@ckeditor/ckeditor5-ui 38.1.1 → 38.2.0-alpha.1

package/src/input/inputview.js

@@ -1,106 +1,106 @@
-/**
- * @license Copyright (c) 2003-2023, CKSource Holding sp. z o.o. All rights reserved.
- * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
- */
-/**
- * @module ui/input/inputview
- */
-import View from '../view';
-import { FocusTracker } from '@ckeditor/ckeditor5-utils';
-import '../../theme/components/input/input.css';
-/**
- * The base input view class.
- */
-export default class InputView extends View {
-    /**
-     * @inheritDoc
-     */
-    constructor(locale) {
-        super(locale);
-        this.set('value', undefined);
-        this.set('id', undefined);
-        this.set('placeholder', undefined);
-        this.set('isReadOnly', false);
-        this.set('hasError', false);
-        this.set('ariaDescribedById', undefined);
-        this.focusTracker = new FocusTracker();
-        this.bind('isFocused').to(this.focusTracker);
-        this.set('isEmpty', true);
-        this.set('inputMode', 'text');
-        const bind = this.bindTemplate;
-        this.setTemplate({
-            tag: 'input',
-            attributes: {
-                class: [
-                    'ck',
-                    'ck-input',
-                    bind.if('isFocused', 'ck-input_focused'),
-                    bind.if('isEmpty', 'ck-input-text_empty'),
-                    bind.if('hasError', 'ck-error')
-                ],
-                id: bind.to('id'),
-                placeholder: bind.to('placeholder'),
-                readonly: bind.to('isReadOnly'),
-                inputmode: bind.to('inputMode'),
-                'aria-invalid': bind.if('hasError', true),
-                'aria-describedby': bind.to('ariaDescribedById')
-            },
-            on: {
-                input: bind.to((...args) => {
-                    this.fire('input', ...args);
-                    this._updateIsEmpty();
-                }),
-                change: bind.to(this._updateIsEmpty.bind(this))
-            }
-        });
-    }
-    /**
-     * @inheritDoc
-     */
-    render() {
-        super.render();
-        this.focusTracker.add(this.element);
-        this._setDomElementValue(this.value);
-        this._updateIsEmpty();
-        // Bind `this.value` to the DOM element's value.
-        // We cannot use `value` DOM attribute because removing it on Edge does not clear the DOM element's value property.
-        this.on('change:value', (evt, name, value) => {
-            this._setDomElementValue(value);
-            this._updateIsEmpty();
-        });
-    }
-    /**
-     * @inheritDoc
-     */
-    destroy() {
-        super.destroy();
-        this.focusTracker.destroy();
-    }
-    /**
-     * Moves the focus to the input and selects the value.
-     */
-    select() {
-        this.element.select();
-    }
-    /**
-     * Focuses the input.
-     */
-    focus() {
-        this.element.focus();
-    }
-    /**
-     * Updates the {@link #isEmpty} property value on demand.
-     */
-    _updateIsEmpty() {
-        this.isEmpty = isInputElementEmpty(this.element);
-    }
-    /**
-     * Sets the `value` property of the {@link #element DOM element} on demand.
-     */
-    _setDomElementValue(value) {
-        this.element.value = (!value && value !== 0) ? '' : value;
-    }
-}
-function isInputElementEmpty(domElement) {
-    return !domElement.value;
-}
+/**
+ * @license Copyright (c) 2003-2023, CKSource Holding sp. z o.o. All rights reserved.
+ * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
+ */
+/**
+ * @module ui/input/inputview
+ */
+import View from '../view.js';
+import { FocusTracker } from '@ckeditor/ckeditor5-utils';
+import '../../theme/components/input/input.css';
+/**
+ * The base input view class.
+ */
+export default class InputView extends View {
+    /**
+     * @inheritDoc
+     */
+    constructor(locale) {
+        super(locale);
+        this.set('value', undefined);
+        this.set('id', undefined);
+        this.set('placeholder', undefined);
+        this.set('isReadOnly', false);
+        this.set('hasError', false);
+        this.set('ariaDescribedById', undefined);
+        this.focusTracker = new FocusTracker();
+        this.bind('isFocused').to(this.focusTracker);
+        this.set('isEmpty', true);
+        this.set('inputMode', 'text');
+        const bind = this.bindTemplate;
+        this.setTemplate({
+            tag: 'input',
+            attributes: {
+                class: [
+                    'ck',
+                    'ck-input',
+                    bind.if('isFocused', 'ck-input_focused'),
+                    bind.if('isEmpty', 'ck-input-text_empty'),
+                    bind.if('hasError', 'ck-error')
+                ],
+                id: bind.to('id'),
+                placeholder: bind.to('placeholder'),
+                readonly: bind.to('isReadOnly'),
+                inputmode: bind.to('inputMode'),
+                'aria-invalid': bind.if('hasError', true),
+                'aria-describedby': bind.to('ariaDescribedById')
+            },
+            on: {
+                input: bind.to((...args) => {
+                    this.fire('input', ...args);
+                    this._updateIsEmpty();
+                }),
+                change: bind.to(this._updateIsEmpty.bind(this))
+            }
+        });
+    }
+    /**
+     * @inheritDoc
+     */
+    render() {
+        super.render();
+        this.focusTracker.add(this.element);
+        this._setDomElementValue(this.value);
+        this._updateIsEmpty();
+        // Bind `this.value` to the DOM element's value.
+        // We cannot use `value` DOM attribute because removing it on Edge does not clear the DOM element's value property.
+        this.on('change:value', (evt, name, value) => {
+            this._setDomElementValue(value);
+            this._updateIsEmpty();
+        });
+    }
+    /**
+     * @inheritDoc
+     */
+    destroy() {
+        super.destroy();
+        this.focusTracker.destroy();
+    }
+    /**
+     * Moves the focus to the input and selects the value.
+     */
+    select() {
+        this.element.select();
+    }
+    /**
+     * Focuses the input.
+     */
+    focus() {
+        this.element.focus();
+    }
+    /**
+     * Updates the {@link #isEmpty} property value on demand.
+     */
+    _updateIsEmpty() {
+        this.isEmpty = isInputElementEmpty(this.element);
+    }
+    /**
+     * Sets the `value` property of the {@link #element DOM element} on demand.
+     */
+    _setDomElementValue(value) {
+        this.element.value = (!value && value !== 0) ? '' : value;
+    }
+}
+function isInputElementEmpty(domElement) {
+    return !domElement.value;
+}

package/src/inputnumber/inputnumberview.d.ts

@@ -1,49 +1,49 @@
-/**
- * @license Copyright (c) 2003-2023, CKSource Holding sp. z o.o. All rights reserved.
- * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
- */
-/**
- * @module ui/inputnumber/inputnumberview
- */
-import InputView from '../input/inputview';
-import type { Locale } from '@ckeditor/ckeditor5-utils';
-/**
- * The number input view class.
- */
-export default class InputNumberView extends InputView {
-    /**
-     * The value of the `min` DOM attribute (the lowest accepted value) set on the {@link #element}.
-     *
-     * @observable
-     * @default undefined
-     */
-    min: number | undefined;
-    /**
-     * The value of the `max` DOM attribute (the highest accepted value) set on the {@link #element}.
-     *
-     * @observable
-     * @default undefined
-     */
-    max: number | undefined;
-    /**
-     * The value of the `step` DOM attribute set on the {@link #element}.
-     *
-     * @observable
-     * @default undefined
-     */
-    step: number | undefined;
-    /**
-     * Creates an instance of the input number view.
-     *
-     * @param locale The {@link module:core/editor/editor~Editor#locale} instance.
-     * @param options The options of the input.
-     * @param options.min The value of the `min` DOM attribute (the lowest accepted value).
-     * @param options.max The value of the `max` DOM attribute (the highest accepted value).
-     * @param options.step The value of the `step` DOM attribute.
-     */
-    constructor(locale?: Locale, { min, max, step }?: {
-        min?: number;
-        max?: number;
-        step?: number;
-    });
-}
+/**
+ * @license Copyright (c) 2003-2023, CKSource Holding sp. z o.o. All rights reserved.
+ * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
+ */
+/**
+ * @module ui/inputnumber/inputnumberview
+ */
+import InputView from '../input/inputview.js';
+import type { Locale } from '@ckeditor/ckeditor5-utils';
+/**
+ * The number input view class.
+ */
+export default class InputNumberView extends InputView {
+    /**
+     * The value of the `min` DOM attribute (the lowest accepted value) set on the {@link #element}.
+     *
+     * @observable
+     * @default undefined
+     */
+    min: number | undefined;
+    /**
+     * The value of the `max` DOM attribute (the highest accepted value) set on the {@link #element}.
+     *
+     * @observable
+     * @default undefined
+     */
+    max: number | undefined;
+    /**
+     * The value of the `step` DOM attribute set on the {@link #element}.
+     *
+     * @observable
+     * @default undefined
+     */
+    step: number | undefined;
+    /**
+     * Creates an instance of the input number view.
+     *
+     * @param locale The {@link module:core/editor/editor~Editor#locale} instance.
+     * @param options The options of the input.
+     * @param options.min The value of the `min` DOM attribute (the lowest accepted value).
+     * @param options.max The value of the `max` DOM attribute (the highest accepted value).
+     * @param options.step The value of the `step` DOM attribute.
+     */
+    constructor(locale?: Locale, { min, max, step }?: {
+        min?: number;
+        max?: number;
+        step?: number;
+    });
+}

package/src/inputnumber/inputnumberview.js

@@ -1,40 +1,40 @@
-/**
- * @license Copyright (c) 2003-2023, CKSource Holding sp. z o.o. All rights reserved.
- * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
- */
-/**
- * @module ui/inputnumber/inputnumberview
- */
-import InputView from '../input/inputview';
-/**
- * The number input view class.
- */
-export default class InputNumberView extends InputView {
-    /**
-     * Creates an instance of the input number view.
-     *
-     * @param locale The {@link module:core/editor/editor~Editor#locale} instance.
-     * @param options The options of the input.
-     * @param options.min The value of the `min` DOM attribute (the lowest accepted value).
-     * @param options.max The value of the `max` DOM attribute (the highest accepted value).
-     * @param options.step The value of the `step` DOM attribute.
-     */
-    constructor(locale, { min, max, step } = {}) {
-        super(locale);
-        const bind = this.bindTemplate;
-        this.set('min', min);
-        this.set('max', max);
-        this.set('step', step);
-        this.extendTemplate({
-            attributes: {
-                type: 'number',
-                class: [
-                    'ck-input-number'
-                ],
-                min: bind.to('min'),
-                max: bind.to('max'),
-                step: bind.to('step')
-            }
-        });
-    }
-}
+/**
+ * @license Copyright (c) 2003-2023, CKSource Holding sp. z o.o. All rights reserved.
+ * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
+ */
+/**
+ * @module ui/inputnumber/inputnumberview
+ */
+import InputView from '../input/inputview.js';
+/**
+ * The number input view class.
+ */
+export default class InputNumberView extends InputView {
+    /**
+     * Creates an instance of the input number view.
+     *
+     * @param locale The {@link module:core/editor/editor~Editor#locale} instance.
+     * @param options The options of the input.
+     * @param options.min The value of the `min` DOM attribute (the lowest accepted value).
+     * @param options.max The value of the `max` DOM attribute (the highest accepted value).
+     * @param options.step The value of the `step` DOM attribute.
+     */
+    constructor(locale, { min, max, step } = {}) {
+        super(locale);
+        const bind = this.bindTemplate;
+        this.set('min', min);
+        this.set('max', max);
+        this.set('step', step);
+        this.extendTemplate({
+            attributes: {
+                type: 'number',
+                class: [
+                    'ck-input-number'
+                ],
+                min: bind.to('min'),
+                max: bind.to('max'),
+                step: bind.to('step')
+            }
+        });
+    }
+}

package/src/inputtext/inputtextview.d.ts

@@ -1,18 +1,18 @@
-/**
- * @license Copyright (c) 2003-2023, CKSource Holding sp. z o.o. All rights reserved.
- * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
- */
-/**
- * @module ui/inputtext/inputtextview
- */
-import InputView from '../input/inputview';
-import type { Locale } from '@ckeditor/ckeditor5-utils';
-/**
- * The text input view class.
- */
-export default class InputTextView extends InputView {
-    /**
-     * @inheritDoc
-     */
-    constructor(locale?: Locale);
-}
+/**
+ * @license Copyright (c) 2003-2023, CKSource Holding sp. z o.o. All rights reserved.
+ * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
+ */
+/**
+ * @module ui/inputtext/inputtextview
+ */
+import InputView from '../input/inputview.js';
+import type { Locale } from '@ckeditor/ckeditor5-utils';
+/**
+ * The text input view class.
+ */
+export default class InputTextView extends InputView {
+    /**
+     * @inheritDoc
+     */
+    constructor(locale?: Locale);
+}

package/src/inputtext/inputtextview.js

@@ -1,27 +1,27 @@
-/**
- * @license Copyright (c) 2003-2023, CKSource Holding sp. z o.o. All rights reserved.
- * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
- */
-/**
- * @module ui/inputtext/inputtextview
- */
-import InputView from '../input/inputview';
-/**
- * The text input view class.
- */
-export default class InputTextView extends InputView {
-    /**
-     * @inheritDoc
-     */
-    constructor(locale) {
-        super(locale);
-        this.extendTemplate({
-            attributes: {
-                type: 'text',
-                class: [
-                    'ck-input-text'
-                ]
-            }
-        });
-    }
-}
+/**
+ * @license Copyright (c) 2003-2023, CKSource Holding sp. z o.o. All rights reserved.
+ * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
+ */
+/**
+ * @module ui/inputtext/inputtextview
+ */
+import InputView from '../input/inputview.js';
+/**
+ * The text input view class.
+ */
+export default class InputTextView extends InputView {
+    /**
+     * @inheritDoc
+     */
+    constructor(locale) {
+        super(locale);
+        this.extendTemplate({
+            attributes: {
+                type: 'text',
+                class: [
+                    'ck-input-text'
+                ]
+            }
+        });
+    }
+}

package/src/label/labelview.d.ts

@@ -1,36 +1,36 @@
-/**
- * @license Copyright (c) 2003-2023, CKSource Holding sp. z o.o. All rights reserved.
- * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
- */
-/**
- * @module ui/label/labelview
- */
-import View from '../view';
-import { type Locale } from '@ckeditor/ckeditor5-utils';
-import '../../theme/components/label/label.css';
-/**
- * The label view class.
- */
-export default class LabelView extends View {
-    /**
-     * An unique id of the label. It can be used by other UI components to reference
-     * the label, for instance, using the `aria-describedby` DOM attribute.
-     */
-    readonly id: string;
-    /**
-     * The text of the label.
-     *
-     * @observable
-     */
-    text: string | undefined;
-    /**
-     * The `for` attribute of the label (i.e. to pair with an `<input>` element).
-     *
-     * @observable
-     */
-    for: string | undefined;
-    /**
-     * @inheritDoc
-     */
-    constructor(locale?: Locale);
-}
+/**
+ * @license Copyright (c) 2003-2023, CKSource Holding sp. z o.o. All rights reserved.
+ * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
+ */
+/**
+ * @module ui/label/labelview
+ */
+import View from '../view.js';
+import { type Locale } from '@ckeditor/ckeditor5-utils';
+import '../../theme/components/label/label.css';
+/**
+ * The label view class.
+ */
+export default class LabelView extends View {
+    /**
+     * An unique id of the label. It can be used by other UI components to reference
+     * the label, for instance, using the `aria-describedby` DOM attribute.
+     */
+    readonly id: string;
+    /**
+     * The text of the label.
+     *
+     * @observable
+     */
+    text: string | undefined;
+    /**
+     * The `for` attribute of the label (i.e. to pair with an `<input>` element).
+     *
+     * @observable
+     */
+    for: string | undefined;
+    /**
+     * @inheritDoc
+     */
+    constructor(locale?: Locale);
+}

package/src/label/labelview.js

@@ -1,41 +1,41 @@
-/**
- * @license Copyright (c) 2003-2023, CKSource Holding sp. z o.o. All rights reserved.
- * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
- */
-/**
- * @module ui/label/labelview
- */
-import View from '../view';
-import { uid } from '@ckeditor/ckeditor5-utils';
-import '../../theme/components/label/label.css';
-/**
- * The label view class.
- */
-export default class LabelView extends View {
-    /**
-     * @inheritDoc
-     */
-    constructor(locale) {
-        super(locale);
-        this.set('text', undefined);
-        this.set('for', undefined);
-        this.id = `ck-editor__label_${uid()}`;
-        const bind = this.bindTemplate;
-        this.setTemplate({
-            tag: 'label',
-            attributes: {
-                class: [
-                    'ck',
-                    'ck-label'
-                ],
-                id: this.id,
-                for: bind.to('for')
-            },
-            children: [
-                {
-                    text: bind.to('text')
-                }
-            ]
-        });
-    }
-}
+/**
+ * @license Copyright (c) 2003-2023, CKSource Holding sp. z o.o. All rights reserved.
+ * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
+ */
+/**
+ * @module ui/label/labelview
+ */
+import View from '../view.js';
+import { uid } from '@ckeditor/ckeditor5-utils';
+import '../../theme/components/label/label.css';
+/**
+ * The label view class.
+ */
+export default class LabelView extends View {
+    /**
+     * @inheritDoc
+     */
+    constructor(locale) {
+        super(locale);
+        this.set('text', undefined);
+        this.set('for', undefined);
+        this.id = `ck-editor__label_${uid()}`;
+        const bind = this.bindTemplate;
+        this.setTemplate({
+            tag: 'label',
+            attributes: {
+                class: [
+                    'ck',
+                    'ck-label'
+                ],
+                id: this.id,
+                for: bind.to('for')
+            },
+            children: [
+                {
+                    text: bind.to('text')
+                }
+            ]
+        });
+    }
+}