UNPKG

4.79 kBTypeScriptView Raw
1/**
2 * @license Copyright (c) 2003-2023, CKSource Holding sp. z o.o. All rights reserved.
3 * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
4 */
5/**
6 * @module link/ui/linkformview
7 */
8import { ButtonView, LabeledFieldView, View, ViewCollection, type InputTextView } from 'ckeditor5/src/ui';
9import { FocusTracker, KeystrokeHandler, type Locale } from 'ckeditor5/src/utils';
10import type LinkCommand from '../linkcommand';
11import '@ckeditor/ckeditor5-ui/theme/components/responsive-form/responsiveform.css';
12import '../../theme/linkform.css';
13/**
14 * The link form view controller class.
15 *
16 * See {@link module:link/ui/linkformview~LinkFormView}.
17 */
18export default class LinkFormView extends View {
19 /**
20 * Tracks information about DOM focus in the form.
21 */
22 readonly focusTracker: FocusTracker;
23 /**
24 * An instance of the {@link module:utils/keystrokehandler~KeystrokeHandler}.
25 */
26 readonly keystrokes: KeystrokeHandler;
27 /**
28 * The URL input view.
29 */
30 urlInputView: LabeledFieldView<InputTextView>;
31 /**
32 * The Save button view.
33 */
34 saveButtonView: ButtonView;
35 /**
36 * The Cancel button view.
37 */
38 cancelButtonView: ButtonView;
39 /**
40 * A collection of {@link module:ui/button/switchbuttonview~SwitchButtonView},
41 * which corresponds to {@link module:link/linkcommand~LinkCommand#manualDecorators manual decorators}
42 * configured in the editor.
43 */
44 private readonly _manualDecoratorSwitches;
45 /**
46 * A collection of child views in the form.
47 */
48 readonly children: ViewCollection;
49 /**
50 * A collection of views that can be focused in the form.
51 */
52 private readonly _focusables;
53 /**
54 * Helps cycling over {@link #_focusables} in the form.
55 */
56 private readonly _focusCycler;
57 /**
58 * Creates an instance of the {@link module:link/ui/linkformview~LinkFormView} class.
59 *
60 * Also see {@link #render}.
61 *
62 * @param locale The localization services instance.
63 * @param linkCommand Reference to {@link module:link/linkcommand~LinkCommand}.
64 */
65 constructor(locale: Locale, linkCommand: LinkCommand);
66 /**
67 * Obtains the state of the {@link module:ui/button/switchbuttonview~SwitchButtonView switch buttons} representing
68 * {@link module:link/linkcommand~LinkCommand#manualDecorators manual link decorators}
69 * in the {@link module:link/ui/linkformview~LinkFormView}.
70 *
71 * @returns Key-value pairs, where the key is the name of the decorator and the value is its state.
72 */
73 getDecoratorSwitchesState(): Record<string, boolean>;
74 /**
75 * @inheritDoc
76 */
77 render(): void;
78 /**
79 * @inheritDoc
80 */
81 destroy(): void;
82 /**
83 * Focuses the fist {@link #_focusables} in the form.
84 */
85 focus(): void;
86 /**
87 * Creates a labeled input view.
88 *
89 * @returns Labeled field view instance.
90 */
91 private _createUrlInput;
92 /**
93 * Creates a button view.
94 *
95 * @param label The button label.
96 * @param icon The button icon.
97 * @param className The additional button CSS class name.
98 * @param eventName An event name that the `ButtonView#execute` event will be delegated to.
99 * @returns The button view instance.
100 */
101 private _createButton;
102 /**
103 * Populates {@link module:ui/viewcollection~ViewCollection} of {@link module:ui/button/switchbuttonview~SwitchButtonView}
104 * made based on {@link module:link/linkcommand~LinkCommand#manualDecorators}.
105 *
106 * @param linkCommand A reference to the link command.
107 * @returns ViewCollection of switch buttons.
108 */
109 private _createManualDecoratorSwitches;
110 /**
111 * Populates the {@link #children} collection of the form.
112 *
113 * If {@link module:link/linkcommand~LinkCommand#manualDecorators manual decorators} are configured in the editor, it creates an
114 * additional `View` wrapping all {@link #_manualDecoratorSwitches} switch buttons corresponding
115 * to these decorators.
116 *
117 * @param manualDecorators A reference to
118 * the collection of manual decorators stored in the link command.
119 * @returns The children of link form view.
120 */
121 private _createFormChildren;
122}
123/**
124 * Fired when the form view is submitted (when one of the children triggered the submit event),
125 * for example with a click on {@link ~LinkFormView#saveButtonView}.
126 *
127 * @eventName ~LinkFormView#submit
128 */
129export type SubmitEvent = {
130 name: 'submit';
131 args: [];
132};
133/**
134 * Fired when the form view is canceled, for example with a click on {@link ~LinkFormView#cancelButtonView}.
135 *
136 * @eventName ~LinkFormView#cancel
137 */
138export type CancelEvent = {
139 name: 'cancel';
140 args: [];
141};