@ni/nimble-components 33.12.1 → 34.0.1

package/dist/esm/number-field/index.d.ts

@@ -29,7 +29,17 @@ export declare class NumberField extends NumberField_base {
     appearance: NumberFieldAppearance;
     fullBleed: boolean;
     appearanceReadOnly: boolean;
+    private decimalSeparator;
+    private inputFilterRegExp;
+    private readonly langSubscriber;
     connectedCallback(): void;
+    disconnectedCallback(): void;
+    protected sanitizeInput(inputText: string): string;
+    protected syncValueFromInnerControl(): void;
+    protected syncValueToInnerControl(): void;
+    private updateDecimalSeparatorAndInputFilter;
+    private getSeparatorForLanguange;
+    private buildFilterRegExp;
 }
 export declare const numberFieldTag = "nimble-number-field";
 export {};

package/dist/esm/number-field/index.js

@@ -12,6 +12,7 @@ import { iconExclamationMarkTag } from '../icons/exclamation-mark';
 import { numericDecrementLabel, numericIncrementLabel } from '../label-provider/core/label-tokens';
 import { template } from './template';
 import { mixinRequiredVisiblePattern } from '../patterns/required-visible/types';
+import { lang } from '../theme-provider';
 /**
  * A nimble-styled HTML number input
  */
@@ -21,11 +22,53 @@ export class NumberField extends mixinErrorPattern(mixinRequiredVisiblePattern(F
         this.appearance = NumberFieldAppearance.underline;
         this.fullBleed = false;
         this.appearanceReadOnly = false;
+        this.decimalSeparator = '.';
+        this.inputFilterRegExp = this.buildFilterRegExp(this.decimalSeparator);
+        this.langSubscriber = {
+            handleChange: () => this.updateDecimalSeparatorAndInputFilter()
+        };
     }
     connectedCallback() {
         super.connectedCallback();
         // This is a workaround for FAST issue: https://github.com/microsoft/fast/issues/6148
         this.control.setAttribute('role', 'spinbutton');
+        this.updateDecimalSeparatorAndInputFilter();
+        lang.subscribe(this.langSubscriber, this);
+    }
+    disconnectedCallback() {
+        super.disconnectedCallback();
+        lang.unsubscribe(this.langSubscriber, this);
+    }
+    sanitizeInput(inputText) {
+        return inputText.replace(this.inputFilterRegExp, '');
+    }
+    // this.value <-- this.control.value
+    syncValueFromInnerControl() {
+        this.value = this.decimalSeparator !== '.'
+            ? this.control.value.replace(this.decimalSeparator, '.')
+            : this.control.value;
+    }
+    // this.value --> this.control.value
+    syncValueToInnerControl() {
+        this.control.value = this.decimalSeparator !== '.'
+            ? this.value.replace('.', this.decimalSeparator)
+            : this.value;
+    }
+    updateDecimalSeparatorAndInputFilter() {
+        const previousSeparator = this.decimalSeparator;
+        this.decimalSeparator = this.getSeparatorForLanguange(lang.getValueFor(this));
+        if (this.decimalSeparator !== previousSeparator) {
+            this.inputFilterRegExp = this.buildFilterRegExp(this.decimalSeparator);
+            this.control.value = this.control.value.replace(previousSeparator, this.decimalSeparator);
+        }
+    }
+    getSeparatorForLanguange(language) {
+        return Intl.NumberFormat(language)
+            .formatToParts(1.1)
+            .find(x => x.type === 'decimal').value;
+    }
+    buildFilterRegExp(decimalSeparator) {
+        return new RegExp(`[^0-9\\-+e${decimalSeparator}]`, 'g');
     }
 }
 __decorate([

package/dist/esm/number-field/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/number-field/index.ts"],"names":[],"mappings":";AAAA,OAAO,EAAE,IAAI,EAAE,IAAI,EAAE,MAAM,kBAAkB,CAAC;AAC9C,OAAO,EACH,YAAY,EACZ,WAAW,IAAI,qBAAqB,EAEvC,MAAM,qBAAqB,CAAC;AAC7B,OAAO,EAAE,MAAM,EAAE,MAAM,UAAU,CAAC;AAClC,OAAO,EAAE,qBAAqB,EAAE,MAAM,SAAS,CAAC;AAChD,OAAO,EAAE,iBAAiB,EAAE,MAAM,4BAA4B,CAAC;AAC/D,OAAO,EAAE,iBAAiB,EAAE,MAAM,yBAAyB,CAAC;AAC5D,OAAO,EAAE,SAAS,EAAE,MAAM,WAAW,CAAC;AACtC,OAAO,EAAE,gBAAgB,EAAE,MAAM,qBAAqB,CAAC;AACvD,OAAO,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC;AAC1C,OAAO,EAAE,sBAAsB,EAAE,MAAM,2BAA2B,CAAC;AACnE,OAAO,EACH,qBAAqB,EACrB,qBAAqB,EACxB,MAAM,qCAAqC,CAAC;AAC7C,OAAO,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAC;AACtC,OAAO,EAAE,2BAA2B,EAAE,MAAM,oCAAoC,CAAC;AAQjF;;GAEG;AACH,MAAM,OAAO,WAAY,SAAQ,iBAAiB,CAC9C,2BAA2B,CAAC,qBAAqB,CAAC,CACrD;IAFD;;QAIW,eAAU,GAA0B,qBAAqB,CAAC,SAAS,CAAC;QAGpE,cAAS,GAAG,KAAK,CAAC;QAGlB,uBAAkB,GAAG,KAAK,CAAC;IAQtC,CAAC;IANmB,iBAAiB;QAC7B,KAAK,CAAC,iBAAiB,EAAE,CAAC;QAE1B,qFAAqF;QACrF,IAAI,CAAC,OAAO,CAAC,YAAY,CAAC,MAAM,EAAE,YAAY,CAAC,CAAC;IACpD,CAAC;CACJ;AAdU;IADN,IAAI;+CACsE;AAGpE;IADN,IAAI,CAAC,EAAE,SAAS,EAAE,YAAY,EAAE,IAAI,EAAE,SAAS,EAAE,CAAC;8CAC1B;AAGlB;IADN,IAAI,CAAC,EAAE,SAAS,EAAE,qBAAqB,EAAE,IAAI,EAAE,SAAS,EAAE,CAAC;uDAC1B;AAUtC;;;;;;;GAOG;AACH,MAAM,iBAAiB,GAAG,WAAW,CAAC,OAAO,CAAqB;IAC9D,QAAQ,EAAE,cAAc;IACxB,SAAS,EAAE,qBAAqB;IAChC,QAAQ;IACR,MAAM;IACN,aAAa,EAAE;QACX,cAAc,EAAE,IAAI;KACvB;IACD,aAAa,EAAE,IAAI,CAAa;WACzB,SAAS;;;;;;;cAON,CAAC,CAAC,EAAE,CAAC,qBAAqB,CAAC,WAAW,CAAC,CAAC,CAAC;eACxC,gBAAgB;;;gBAGf,gBAAgB;YACpB,SAAS;KAChB;IACD,WAAW,EAAE,IAAI,CAAa;WACvB,SAAS;;;;;;;cAON,CAAC,CAAC,EAAE,CAAC,qBAAqB,CAAC,WAAW,CAAC,CAAC,CAAC;eACxC,UAAU;;gBAET,UAAU;YACd,SAAS;KAChB;IACD,GAAG,EAAE,IAAI,CAAa;WACf,sBAAsB;;;aAGpB,sBAAsB;UACzB,iBAAiB;KACtB;CACJ,CAAC,CAAC;AAEH,YAAY,CAAC,WAAW,EAAE,CAAC,UAAU,CAAC,QAAQ,CAAC,CAAC,QAAQ,CAAC,iBAAiB,EAAE,CAAC,CAAC;AAC9E,MAAM,CAAC,MAAM,cAAc,GAAG,qBAAqB,CAAC","sourcesContent":["import { attr, html } from '@ni/fast-element';\nimport {\n    DesignSystem,\n    NumberField as FoundationNumberField,\n    type NumberFieldOptions\n} from '@ni/fast-foundation';\nimport { styles } from './styles';\nimport { NumberFieldAppearance } from './types';\nimport { errorTextTemplate } from '../patterns/error/template';\nimport { mixinErrorPattern } from '../patterns/error/types';\nimport { buttonTag } from '../button';\nimport { iconMinusWideTag } from '../icons/minus-wide';\nimport { iconAddTag } from '../icons/add';\nimport { iconExclamationMarkTag } from '../icons/exclamation-mark';\nimport {\n    numericDecrementLabel,\n    numericIncrementLabel\n} from '../label-provider/core/label-tokens';\nimport { template } from './template';\nimport { mixinRequiredVisiblePattern } from '../patterns/required-visible/types';\n\ndeclare global {\n    interface HTMLElementTagNameMap {\n        'nimble-number-field': NumberField;\n    }\n}\n\n/**\n * A nimble-styled HTML number input\n */\nexport class NumberField extends mixinErrorPattern(\n    mixinRequiredVisiblePattern(FoundationNumberField)\n) {\n    @attr\n    public appearance: NumberFieldAppearance = NumberFieldAppearance.underline;\n\n    @attr({ attribute: 'full-bleed', mode: 'boolean' })\n    public fullBleed = false;\n\n    @attr({ attribute: 'appearance-readonly', mode: 'boolean' })\n    public appearanceReadOnly = false;\n\n    public override connectedCallback(): void {\n        super.connectedCallback();\n\n        // This is a workaround for FAST issue: https://github.com/microsoft/fast/issues/6148\n        this.control.setAttribute('role', 'spinbutton');\n    }\n}\n\n/**\n * A function that returns a number-field registration for configuring the component with a DesignSystem.\n *\n * @public\n * @remarks\n * Generates HTML Element: \\<nimble-number-field\\>\n *\n */\nconst nimbleNumberField = NumberField.compose<NumberFieldOptions>({\n    baseName: 'number-field',\n    baseClass: FoundationNumberField,\n    template,\n    styles,\n    shadowOptions: {\n        delegatesFocus: true\n    },\n    stepDownGlyph: html<NumberField>`\n        <${buttonTag}\n            class=\"step-up-down-button\"\n            appearance=\"ghost\"\n            content-hidden\n            tabindex=\"-1\"\n            aria-hidden=\"true\"\n        >\n            ${x => numericDecrementLabel.getValueFor(x)}\n            <${iconMinusWideTag}\n                slot=\"start\"\n            >\n            </${iconMinusWideTag}>\n        </${buttonTag}>\n    `,\n    stepUpGlyph: html<NumberField>`\n        <${buttonTag}\n            class=\"step-up-down-button\"\n            appearance=\"ghost\"\n            content-hidden\n            tabindex=\"-1\"\n            aria-hidden=\"true\"\n        >\n            ${x => numericIncrementLabel.getValueFor(x)}\n            <${iconAddTag}\n                slot=\"start\">\n            </${iconAddTag}>\n        </${buttonTag}>\n    `,\n    end: html<NumberField>`\n        <${iconExclamationMarkTag}\n            severity=\"error\"\n            class=\"error-icon\"\n        ></${iconExclamationMarkTag}>\n        ${errorTextTemplate}\n    `\n});\n\nDesignSystem.getOrCreate().withPrefix('nimble').register(nimbleNumberField());\nexport const numberFieldTag = 'nimble-number-field';\n"]}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/number-field/index.ts"],"names":[],"mappings":"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","sourcesContent":["import { attr, html } from '@ni/fast-element';\nimport {\n    DesignSystem,\n    NumberField as FoundationNumberField,\n    type DesignTokenSubscriber,\n    type NumberFieldOptions\n} from '@ni/fast-foundation';\nimport { styles } from './styles';\nimport { NumberFieldAppearance } from './types';\nimport { errorTextTemplate } from '../patterns/error/template';\nimport { mixinErrorPattern } from '../patterns/error/types';\nimport { buttonTag } from '../button';\nimport { iconMinusWideTag } from '../icons/minus-wide';\nimport { iconAddTag } from '../icons/add';\nimport { iconExclamationMarkTag } from '../icons/exclamation-mark';\nimport {\n    numericDecrementLabel,\n    numericIncrementLabel\n} from '../label-provider/core/label-tokens';\nimport { template } from './template';\nimport { mixinRequiredVisiblePattern } from '../patterns/required-visible/types';\nimport { lang } from '../theme-provider';\n\ndeclare global {\n    interface HTMLElementTagNameMap {\n        'nimble-number-field': NumberField;\n    }\n}\n\n/**\n * A nimble-styled HTML number input\n */\nexport class NumberField extends mixinErrorPattern(\n    mixinRequiredVisiblePattern(FoundationNumberField)\n) {\n    @attr\n    public appearance: NumberFieldAppearance = NumberFieldAppearance.underline;\n\n    @attr({ attribute: 'full-bleed', mode: 'boolean' })\n    public fullBleed = false;\n\n    @attr({ attribute: 'appearance-readonly', mode: 'boolean' })\n    public appearanceReadOnly = false;\n\n    private decimalSeparator = '.';\n    private inputFilterRegExp = this.buildFilterRegExp(this.decimalSeparator);\n\n    private readonly langSubscriber: DesignTokenSubscriber<typeof lang> = {\n        handleChange: () => this.updateDecimalSeparatorAndInputFilter()\n    };\n\n    public override connectedCallback(): void {\n        super.connectedCallback();\n\n        // This is a workaround for FAST issue: https://github.com/microsoft/fast/issues/6148\n        this.control.setAttribute('role', 'spinbutton');\n        this.updateDecimalSeparatorAndInputFilter();\n        lang.subscribe(this.langSubscriber, this);\n    }\n\n    public override disconnectedCallback(): void {\n        super.disconnectedCallback();\n\n        lang.unsubscribe(this.langSubscriber, this);\n    }\n\n    protected override sanitizeInput(inputText: string): string {\n        return inputText.replace(this.inputFilterRegExp, '');\n    }\n\n    // this.value <-- this.control.value\n    protected override syncValueFromInnerControl(): void {\n        this.value = this.decimalSeparator !== '.'\n            ? this.control.value.replace(this.decimalSeparator, '.')\n            : this.control.value;\n    }\n\n    // this.value --> this.control.value\n    protected override syncValueToInnerControl(): void {\n        this.control.value = this.decimalSeparator !== '.'\n            ? this.value.replace('.', this.decimalSeparator)\n            : this.value;\n    }\n\n    private updateDecimalSeparatorAndInputFilter(): void {\n        const previousSeparator = this.decimalSeparator;\n        this.decimalSeparator = this.getSeparatorForLanguange(\n            lang.getValueFor(this)\n        );\n        if (this.decimalSeparator !== previousSeparator) {\n            this.inputFilterRegExp = this.buildFilterRegExp(\n                this.decimalSeparator\n            );\n            this.control.value = this.control.value.replace(\n                previousSeparator,\n                this.decimalSeparator\n            );\n        }\n    }\n\n    private getSeparatorForLanguange(language: string): string {\n        return Intl.NumberFormat(language)\n            .formatToParts(1.1)\n            .find(x => x.type === 'decimal')!.value;\n    }\n\n    private buildFilterRegExp(decimalSeparator: string): RegExp {\n        return new RegExp(`[^0-9\\\\-+e${decimalSeparator}]`, 'g');\n    }\n}\n\n/**\n * A function that returns a number-field registration for configuring the component with a DesignSystem.\n *\n * @public\n * @remarks\n * Generates HTML Element: \\<nimble-number-field\\>\n *\n */\nconst nimbleNumberField = NumberField.compose<NumberFieldOptions>({\n    baseName: 'number-field',\n    baseClass: FoundationNumberField,\n    template,\n    styles,\n    shadowOptions: {\n        delegatesFocus: true\n    },\n    stepDownGlyph: html<NumberField>`\n        <${buttonTag}\n            class=\"step-up-down-button\"\n            appearance=\"ghost\"\n            content-hidden\n            tabindex=\"-1\"\n            aria-hidden=\"true\"\n        >\n            ${x => numericDecrementLabel.getValueFor(x)}\n            <${iconMinusWideTag}\n                slot=\"start\"\n            >\n            </${iconMinusWideTag}>\n        </${buttonTag}>\n    `,\n    stepUpGlyph: html<NumberField>`\n        <${buttonTag}\n            class=\"step-up-down-button\"\n            appearance=\"ghost\"\n            content-hidden\n            tabindex=\"-1\"\n            aria-hidden=\"true\"\n        >\n            ${x => numericIncrementLabel.getValueFor(x)}\n            <${iconAddTag}\n                slot=\"start\">\n            </${iconAddTag}>\n        </${buttonTag}>\n    `,\n    end: html<NumberField>`\n        <${iconExclamationMarkTag}\n            severity=\"error\"\n            class=\"error-icon\"\n        ></${iconExclamationMarkTag}>\n        ${errorTextTemplate}\n    `\n});\n\nDesignSystem.getOrCreate().withPrefix('nimble').register(nimbleNumberField());\nexport const numberFieldTag = 'nimble-number-field';\n"]}

package/dist/esm/number-field/template.js

@@ -35,7 +35,7 @@ export const template = (context, definition) => html `
                 ?required="${x => x.required}"
                 size="${x => x.size}"
                 type="text"
-                inputmode="numeric"
+                inputmode="text"
                 min="${x => x.min}"
                 max="${x => x.max}"
                 step="${x => x.step}"

package/dist/esm/number-field/template.js.map

@@ -1 +1 @@
-{"version":3,"file":"template.js","sourceRoot":"","sources":["../../../src/number-field/template.ts"],"names":[],"mappings":"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","sourcesContent":["import { html, ref, slotted, when } from '@ni/fast-element';\nimport type { ViewTemplate } from '@ni/fast-element';\nimport {\n    endSlotTemplate,\n    type FoundationElementTemplate,\n    type NumberFieldOptions,\n    startSlotTemplate\n} from '@ni/fast-foundation';\nimport type { NumberField } from '.';\nimport { createRequiredVisibleLabelTemplate } from '../patterns/required-visible/template';\n\nconst labelTemplate = createRequiredVisibleLabelTemplate(\n    html<NumberField>`<label\n        part=\"label\"\n        for=\"control\"\n        class=\"${x => (x.defaultSlottedNodes?.length ? 'label' : 'label label__hidden')}\"\n    >\n        <slot ${slotted('defaultSlottedNodes')}></slot>\n    </label>`\n);\n\n/**\n * The template for the {@link @ni/fast-foundation#(NumberField:class)} component.\n * @public\n */\nexport const template: FoundationElementTemplate<\nViewTemplate<NumberField>,\nNumberFieldOptions\n> = (context, definition) => html`\n    <template class=\"${x => (x.readOnly ? 'readonly' : '')}\">\n        ${labelTemplate}\n        <div class=\"root\" part=\"root\">\n            ${startSlotTemplate(context, definition)}\n            <input\n                class=\"control\"\n                part=\"control\"\n                id=\"control\"\n                @input=\"${x => x.handleTextInput()}\"\n                @change=\"${x => x.handleChange()}\"\n                @keydown=\"${(x, c) => x.handleKeyDown(c.event as KeyboardEvent)}\"\n                @blur=\"${x => x.handleBlur()}\"\n                ?autofocus=\"${x => x.autofocus}\"\n                ?disabled=\"${x => x.disabled}\"\n                list=\"${x => x.list}\"\n                maxlength=\"${x => x.maxlength}\"\n                minlength=\"${x => x.minlength}\"\n                placeholder=\"${x => x.placeholder}\"\n                ?readonly=\"${x => x.readOnly}\"\n                ?required=\"${x => x.required}\"\n                size=\"${x => x.size}\"\n                type=\"text\"\n                inputmode=\"numeric\"\n                min=\"${x => x.min}\"\n                max=\"${x => x.max}\"\n                step=\"${x => x.step}\"\n                aria-atomic=\"${x => x.ariaAtomic}\"\n                aria-busy=\"${x => x.ariaBusy}\"\n                aria-controls=\"${x => x.ariaControls}\"\n                aria-current=\"${x => x.ariaCurrent}\"\n                aria-describedby=\"${x => x.ariaDescribedby}\"\n                aria-details=\"${x => x.ariaDetails}\"\n                aria-disabled=\"${x => x.ariaDisabled}\"\n                aria-errormessage=\"${x => x.ariaErrormessage}\"\n                aria-flowto=\"${x => x.ariaFlowto}\"\n                aria-haspopup=\"${x => x.ariaHaspopup}\"\n                aria-hidden=\"${x => x.ariaHidden}\"\n                aria-invalid=\"${x => x.ariaInvalid}\"\n                aria-keyshortcuts=\"${x => x.ariaKeyshortcuts}\"\n                aria-label=\"${x => x.ariaLabel}\"\n                aria-labelledby=\"${x => x.ariaLabelledby}\"\n                aria-live=\"${x => x.ariaLive}\"\n                aria-owns=\"${x => x.ariaOwns}\"\n                aria-relevant=\"${x => x.ariaRelevant}\"\n                aria-roledescription=\"${x => x.ariaRoledescription}\"\n                aria-required=\"${x => x.requiredVisible}\"\n                ${ref('control')}\n            />\n            ${when(\n        x => !x.hideStep && !x.readOnly && !x.disabled,\n        html<NumberField>`\n                    <div class=\"controls\" part=\"controls\">\n                        <div\n                            class=\"step-up\"\n                            part=\"step-up\"\n                            @click=\"${x => x.stepUp()}\"\n                        >\n                            <slot name=\"step-up-glyph\">\n                                ${definition.stepUpGlyph || ''}\n                            </slot>\n                        </div>\n                        <div\n                            class=\"step-down\"\n                            part=\"step-down\"\n                            @click=\"${x => x.stepDown()}\"\n                        >\n                            <slot name=\"step-down-glyph\">\n                                ${definition.stepDownGlyph || ''}\n                            </slot>\n                        </div>\n                    </div>\n                `\n    )}\n            ${endSlotTemplate(context, definition)}\n        </div>\n    </template>\n`;\n"]}
+{"version":3,"file":"template.js","sourceRoot":"","sources":["../../../src/number-field/template.ts"],"names":[],"mappings":"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","sourcesContent":["import { html, ref, slotted, when } from '@ni/fast-element';\nimport type { ViewTemplate } from '@ni/fast-element';\nimport {\n    endSlotTemplate,\n    type FoundationElementTemplate,\n    type NumberFieldOptions,\n    startSlotTemplate\n} from '@ni/fast-foundation';\nimport type { NumberField } from '.';\nimport { createRequiredVisibleLabelTemplate } from '../patterns/required-visible/template';\n\nconst labelTemplate = createRequiredVisibleLabelTemplate(\n    html<NumberField>`<label\n        part=\"label\"\n        for=\"control\"\n        class=\"${x => (x.defaultSlottedNodes?.length ? 'label' : 'label label__hidden')}\"\n    >\n        <slot ${slotted('defaultSlottedNodes')}></slot>\n    </label>`\n);\n\n/**\n * The template for the {@link @ni/fast-foundation#(NumberField:class)} component.\n * @public\n */\nexport const template: FoundationElementTemplate<\nViewTemplate<NumberField>,\nNumberFieldOptions\n> = (context, definition) => html`\n    <template class=\"${x => (x.readOnly ? 'readonly' : '')}\">\n        ${labelTemplate}\n        <div class=\"root\" part=\"root\">\n            ${startSlotTemplate(context, definition)}\n            <input\n                class=\"control\"\n                part=\"control\"\n                id=\"control\"\n                @input=\"${x => x.handleTextInput()}\"\n                @change=\"${x => x.handleChange()}\"\n                @keydown=\"${(x, c) => x.handleKeyDown(c.event as KeyboardEvent)}\"\n                @blur=\"${x => x.handleBlur()}\"\n                ?autofocus=\"${x => x.autofocus}\"\n                ?disabled=\"${x => x.disabled}\"\n                list=\"${x => x.list}\"\n                maxlength=\"${x => x.maxlength}\"\n                minlength=\"${x => x.minlength}\"\n                placeholder=\"${x => x.placeholder}\"\n                ?readonly=\"${x => x.readOnly}\"\n                ?required=\"${x => x.required}\"\n                size=\"${x => x.size}\"\n                type=\"text\"\n                inputmode=\"text\"\n                min=\"${x => x.min}\"\n                max=\"${x => x.max}\"\n                step=\"${x => x.step}\"\n                aria-atomic=\"${x => x.ariaAtomic}\"\n                aria-busy=\"${x => x.ariaBusy}\"\n                aria-controls=\"${x => x.ariaControls}\"\n                aria-current=\"${x => x.ariaCurrent}\"\n                aria-describedby=\"${x => x.ariaDescribedby}\"\n                aria-details=\"${x => x.ariaDetails}\"\n                aria-disabled=\"${x => x.ariaDisabled}\"\n                aria-errormessage=\"${x => x.ariaErrormessage}\"\n                aria-flowto=\"${x => x.ariaFlowto}\"\n                aria-haspopup=\"${x => x.ariaHaspopup}\"\n                aria-hidden=\"${x => x.ariaHidden}\"\n                aria-invalid=\"${x => x.ariaInvalid}\"\n                aria-keyshortcuts=\"${x => x.ariaKeyshortcuts}\"\n                aria-label=\"${x => x.ariaLabel}\"\n                aria-labelledby=\"${x => x.ariaLabelledby}\"\n                aria-live=\"${x => x.ariaLive}\"\n                aria-owns=\"${x => x.ariaOwns}\"\n                aria-relevant=\"${x => x.ariaRelevant}\"\n                aria-roledescription=\"${x => x.ariaRoledescription}\"\n                aria-required=\"${x => x.requiredVisible}\"\n                ${ref('control')}\n            />\n            ${when(\n        x => !x.hideStep && !x.readOnly && !x.disabled,\n        html<NumberField>`\n                    <div class=\"controls\" part=\"controls\">\n                        <div\n                            class=\"step-up\"\n                            part=\"step-up\"\n                            @click=\"${x => x.stepUp()}\"\n                        >\n                            <slot name=\"step-up-glyph\">\n                                ${definition.stepUpGlyph || ''}\n                            </slot>\n                        </div>\n                        <div\n                            class=\"step-down\"\n                            part=\"step-down\"\n                            @click=\"${x => x.stepDown()}\"\n                        >\n                            <slot name=\"step-down-glyph\">\n                                ${definition.stepDownGlyph || ''}\n                            </slot>\n                        </div>\n                    </div>\n                `\n    )}\n            ${endSlotTemplate(context, definition)}\n        </div>\n    </template>\n`;\n"]}

package/dist/esm/number-field/testing/number-field.pageobject.d.ts

@@ -0,0 +1,23 @@
+import type { NumberField } from '..';
+/**
+ * Page object for `nimble-number-field` component to provide consistent ways
+ * of querying and interacting with the component during tests.
+ */
+export declare class NumberFieldPageObject {
+    protected readonly numberFieldElement: NumberField;
+    constructor(numberFieldElement: NumberField);
+    /**
+     * @returns The string visible in the control.
+     */
+    getDisplayValue(): string;
+    /**
+     * Inputs the given text via a single input event.
+     */
+    inputText(text: string): void;
+    /**
+     * Inputs the given text via a single input event, replacing any text that was already there.
+     */
+    setText(text: string): void;
+    private inputTextInternal;
+    private get inputControl();
+}

package/dist/esm/number-field/testing/number-field.pageobject.js

@@ -0,0 +1,38 @@
+/**
+ * Page object for `nimble-number-field` component to provide consistent ways
+ * of querying and interacting with the component during tests.
+ */
+export class NumberFieldPageObject {
+    constructor(numberFieldElement) {
+        this.numberFieldElement = numberFieldElement;
+    }
+    /**
+     * @returns The string visible in the control.
+     */
+    getDisplayValue() {
+        return this.inputControl.value;
+    }
+    /**
+     * Inputs the given text via a single input event.
+     */
+    inputText(text) {
+        this.inputTextInternal(text);
+    }
+    /**
+     * Inputs the given text via a single input event, replacing any text that was already there.
+     */
+    setText(text) {
+        this.inputTextInternal(text, true);
+    }
+    inputTextInternal(text, replace = false) {
+        this.inputControl.value = text;
+        this.inputControl.dispatchEvent(new InputEvent('input', {
+            data: text,
+            inputType: replace ? 'deleteContentForward' : 'insertText'
+        }));
+    }
+    get inputControl() {
+        return this.numberFieldElement.shadowRoot.querySelector('input');
+    }
+}
+//# sourceMappingURL=number-field.pageobject.js.map

package/dist/esm/number-field/testing/number-field.pageobject.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"number-field.pageobject.js","sourceRoot":"","sources":["../../../../src/number-field/testing/number-field.pageobject.ts"],"names":[],"mappings":"AAEA;;;GAGG;AACH,MAAM,OAAO,qBAAqB;IAC9B,YAAsC,kBAA+B;QAA/B,uBAAkB,GAAlB,kBAAkB,CAAa;IAAG,CAAC;IAEzE;;OAEG;IACI,eAAe;QAClB,OAAO,IAAI,CAAC,YAAY,CAAC,KAAK,CAAC;IACnC,CAAC;IAED;;OAEG;IACI,SAAS,CAAC,IAAY;QACzB,IAAI,CAAC,iBAAiB,CAAC,IAAI,CAAC,CAAC;IACjC,CAAC;IAED;;OAEG;IACI,OAAO,CAAC,IAAY;QACvB,IAAI,CAAC,iBAAiB,CAAC,IAAI,EAAE,IAAI,CAAC,CAAC;IACvC,CAAC;IAEO,iBAAiB,CAAC,IAAY,EAAE,OAAO,GAAG,KAAK;QACnD,IAAI,CAAC,YAAY,CAAC,KAAK,GAAG,IAAI,CAAC;QAC/B,IAAI,CAAC,YAAY,CAAC,aAAa,CAC3B,IAAI,UAAU,CAAC,OAAO,EAAE;YACpB,IAAI,EAAE,IAAI;YACV,SAAS,EAAE,OAAO,CAAC,CAAC,CAAC,sBAAsB,CAAC,CAAC,CAAC,YAAY;SAC7D,CAAC,CACL,CAAC;IACN,CAAC;IAED,IAAY,YAAY;QACpB,OAAO,IAAI,CAAC,kBAAkB,CAAC,UAAW,CAAC,aAAa,CAAC,OAAO,CAAE,CAAC;IACvE,CAAC;CACJ","sourcesContent":["import type { NumberField } from '..';\n\n/**\n * Page object for `nimble-number-field` component to provide consistent ways\n * of querying and interacting with the component during tests.\n */\nexport class NumberFieldPageObject {\n    public constructor(protected readonly numberFieldElement: NumberField) {}\n\n    /**\n     * @returns The string visible in the control.\n     */\n    public getDisplayValue(): string {\n        return this.inputControl.value;\n    }\n\n    /**\n     * Inputs the given text via a single input event.\n     */\n    public inputText(text: string): void {\n        this.inputTextInternal(text);\n    }\n\n    /**\n     * Inputs the given text via a single input event, replacing any text that was already there.\n     */\n    public setText(text: string): void {\n        this.inputTextInternal(text, true);\n    }\n\n    private inputTextInternal(text: string, replace = false): void {\n        this.inputControl.value = text;\n        this.inputControl.dispatchEvent(\n            new InputEvent('input', {\n                data: text,\n                inputType: replace ? 'deleteContentForward' : 'insertText'\n            })\n        );\n    }\n\n    private get inputControl(): HTMLInputElement {\n        return this.numberFieldElement.shadowRoot!.querySelector('input')!;\n    }\n}\n"]}

package/dist/esm/rich-text/editor/models/create-tiptap-editor.js

@@ -176,7 +176,8 @@ function createCustomMentionExtension(config, activeMentionCharacterEmitter, act
                 mergeAttributes(this.options.HTMLAttributes, HTMLAttributes),
                 this.options.renderText({
                     options: this.options,
-                    node
+                    node,
+                    suggestion: null
                 })
             ];
         }

package/dist/esm/rich-text/editor/models/create-tiptap-editor.js.map

@@ -1 +1 @@
-{"version":3,"file":"create-tiptap-editor.js","sourceRoot":"","sources":["../../../../../src/rich-text/editor/models/create-tiptap-editor.ts"],"names":[],"mappings":"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","sourcesContent":["import { Editor, Mark, Node, mergeAttributes } from '@tiptap/core';\nimport Bold from '@tiptap/extension-bold';\nimport BulletList from '@tiptap/extension-bullet-list';\nimport Document from '@tiptap/extension-document';\nimport HardBreak from '@tiptap/extension-hard-break';\nimport History from '@tiptap/extension-history';\nimport Italic from '@tiptap/extension-italic';\nimport Link from '@tiptap/extension-link';\nimport ListItem from '@tiptap/extension-list-item';\nimport Mention from '@tiptap/extension-mention';\nimport OrderedList from '@tiptap/extension-ordered-list';\nimport Paragraph from '@tiptap/extension-paragraph';\nimport Placeholder from '@tiptap/extension-placeholder';\nimport Text from '@tiptap/extension-text';\nimport { Slice, Fragment, Node as FragmentNode } from 'prosemirror-model';\nimport { PluginKey } from 'prosemirror-state';\n\nimport { keyEscape } from '@ni/fast-web-utilities';\nimport {\n    type ActiveMentionCommandEmitter,\n    type ActiveMentionCharacterEmitter,\n    mentionPluginPrefix\n} from '../types';\n\nimport { anchorTag } from '../../../anchor';\nimport type { MentionExtensionConfiguration } from '../../models/mention-extension-configuration';\nimport type { RichTextMentionListbox } from '../../mention-listbox';\n\nconst validAbsoluteLinkRegex = /^https?:\\/\\//i;\n\nexport function createTiptapEditor(\n    activeMentionCharacterEmitter: ActiveMentionCharacterEmitter,\n    activeMentionCommandEmitter: ActiveMentionCommandEmitter,\n    editor: HTMLDivElement,\n    mentionExtensionConfig: MentionExtensionConfiguration[],\n    mentionListbox?: RichTextMentionListbox,\n    placeholder?: string\n): Editor {\n    const customLink = createCustomLinkExtension();\n    const mentionExtensions = mentionExtensionConfig.map(config => createCustomMentionExtension(\n        config,\n        activeMentionCharacterEmitter,\n        activeMentionCommandEmitter,\n        mentionListbox\n    ));\n\n    /**\n     * For more information on the extensions for the supported formatting options, refer to the links below.\n     * Tiptap marks: https://tiptap.dev/api/marks\n     * Tiptap nodes: https://tiptap.dev/api/nodes\n     */\n    const tipTapEditor = new Editor({\n        element: editor,\n        // The editor will detect markdown syntax for an input only for these items\n        // https://tiptap.dev/api/editor#enable-input-rules\n        enableInputRules: [BulletList, OrderedList],\n        // The editor will not detect markdown syntax when pasting content in any supported items\n        // Lists do not have any default paste rules, they have only input rules, so disabled paste rules\n        // https://tiptap.dev/api/editor#enable-paste-rules\n        enablePasteRules: false,\n        editorProps: {\n            // Validating whether the links in the pasted content belongs to the supported scheme (HTTPS/HTTP),\n            // and rendering it as a link in the editor. If not, rendering it as a plain text.\n            // Also, updating the link text content with its href as we support only the absolute link.\n\n            // `transformPasted` can be updated/removed when hyperlink support added\n            // See: https://github.com/ni/nimble/issues/1527\n            transformPasted\n        },\n        extensions: [\n            Document,\n            Paragraph,\n            Text,\n            BulletList,\n            OrderedList,\n            ListItem,\n            Bold,\n            Italic,\n            History,\n            Placeholder.configure({\n                placeholder,\n                showOnlyWhenEditable: false\n            }),\n            HardBreak,\n            customLink,\n            ...mentionExtensions\n        ]\n    });\n\n    /**\n     * @param slice contains the Fragment of the copied content. If the content is a link, the slice contains Text node with Link mark.\n     * ProseMirror reference for `transformPasted`: https://prosemirror.net/docs/ref/#view.EditorProps.transformPasted\n     */\n    function transformPasted(slice: Slice): Slice {\n        const modifiedFragment = updateLinkAndMentionNodes(\n            tipTapEditor,\n            slice.content\n        );\n        return new Slice(modifiedFragment, slice.openStart, slice.openEnd);\n    }\n\n    return tipTapEditor;\n}\n\n/**\n * Extending the default link mark schema defined in the TipTap.\n *\n * \"excludes\": https://prosemirror.net/docs/ref/#model.MarkSpec.excludes\n * \"inclusive\": https://prosemirror.net/docs/ref/#model.MarkSpec.inclusive\n * \"parseHTML\": https://tiptap.dev/guide/custom-extensions#parse-html\n * \"renderHTML\": https://tiptap.dev/guide/custom-extensions/#render-html\n */\nfunction createCustomLinkExtension(): Mark {\n    return Link.extend({\n        // Excludes can be removed/enabled when hyperlink support added\n        // See: https://github.com/ni/nimble/issues/1527\n        excludes: '_',\n        // Inclusive can be updated when hyperlink support added\n        // See: https://github.com/ni/nimble/issues/1527\n        inclusive: false,\n        parseHTML() {\n            return [\n                // To load the `nimble-anchor` from the HTML parsed content by markdown-parser as links in the Tiptap editor, the `parseHTML`\n                // of Link extension should return nimble `anchorTag`.\n                // This is because the link mark schema in `markdown-parser.ts` file uses `<nimble-anchor>` as anchor tag and not `<a>`.\n                {\n                    tag: anchorTag\n                },\n                // `<a>` tag is added here to support when pasting a link from external source.\n                {\n                    tag: 'a'\n                }\n            ];\n        },\n        // HTMLAttribute cannot be in camelCase as we want to match it with the name in Tiptap\n        // eslint-disable-next-line @typescript-eslint/naming-convention\n        renderHTML({ HTMLAttributes }) {\n            // The below 'a' tag should be replaced with 'nimble-anchor' once the below issue is fixed.\n            // https://github.com/ni/nimble/issues/1516\n            return ['a', HTMLAttributes];\n        }\n    }).configure({\n        // HTMLAttribute cannot be in camelCase as we want to match it with the name in Tiptap\n        // eslint-disable-next-line @typescript-eslint/naming-convention\n        HTMLAttributes: {\n            rel: 'noopener noreferrer',\n            target: null,\n            // Adding `class` here is a workaround to render two mentions without a whitespace as display names\n            // This attribute can be removed when the below issue is resolved\n            // https://github.com/ni/nimble/issues/1707\n            class: ''\n        },\n        autolink: true,\n        openOnClick: false,\n        // linkOnPaste can be enabled when hyperlink support added\n        // See: https://github.com/ni/nimble/issues/1527\n        linkOnPaste: false,\n        shouldAutoLink: href => validAbsoluteLinkRegex.test(href)\n    });\n}\n\nfunction createCustomMentionExtension(\n    config: MentionExtensionConfiguration,\n    activeMentionCharacterEmitter: ActiveMentionCharacterEmitter,\n    activeMentionCommandEmitter: ActiveMentionCommandEmitter,\n    mentionListbox?: RichTextMentionListbox\n): Node {\n    return Mention.extend({\n        name: config.name,\n        parseHTML() {\n            return [\n                {\n                    tag: config.viewElement\n                }\n            ];\n        },\n        addAttributes() {\n            return {\n                href: {\n                    default: null,\n                    parseHTML: element => element.getAttribute('mention-href'),\n                    renderHTML: attributes => {\n                        return {\n                            'mention-href': attributes.href as string\n                        };\n                    }\n                },\n                label: {\n                    default: null,\n                    parseHTML: element => element.getAttribute('mention-label'),\n                    renderHTML: attributes => {\n                        return {\n                            'mention-label': attributes.label as string\n                        };\n                    }\n                },\n                disabled: {\n                    default: null,\n                    parseHTML: element => element.getAttribute('disabled'),\n                    renderHTML: attributes => {\n                        return {\n                            disabled: attributes.disabled as string\n                        };\n                    }\n                }\n            };\n        },\n        // eslint-disable-next-line @typescript-eslint/naming-convention\n        renderHTML({ node, HTMLAttributes }) {\n            return [\n                config.viewElement,\n                mergeAttributes(this.options.HTMLAttributes, HTMLAttributes),\n                this.options.renderText({\n                    options: this.options,\n                    node\n                })\n            ];\n        }\n    }).configure({\n        suggestion: {\n            char: config.character,\n            decorationClass: 'nimble-mention-view-edit',\n            pluginKey: new PluginKey(config.key),\n            allowSpaces: true,\n            render: () => {\n                let inSuggestionMode = false;\n                return {\n                    onStart: (props): void => {\n                        /**\n                         * If the cursor position moves to outside of the mention and configuration element changes,\n                         * the setMarkdown() will trigger this `onStart` without a decoration node because the cursor\n                         * position is temporarily moved out of the suggestion decoration. Ignore `onStart` in that case\n                         * and don't show the mention list box since it doesn't have anything to anchor to.\n                         */\n                        if (props.decorationNode === null) {\n                            return;\n                        }\n                        inSuggestionMode = true;\n                        config.mentionUpdateEmitter(props.query);\n                        activeMentionCharacterEmitter(props.text.slice(0, 1));\n                        activeMentionCommandEmitter(props.command);\n                        mentionListbox?.show({\n                            filter: props.query,\n                            anchorNode: props.decorationNode as HTMLElement\n                        });\n                    },\n                    onUpdate: (props): void => {\n                        if (!inSuggestionMode) {\n                            return;\n                        }\n                        config.mentionUpdateEmitter(props.query);\n                        activeMentionCommandEmitter(props.command);\n                        mentionListbox?.show({\n                            filter: props.query,\n                            anchorNode: props.decorationNode as HTMLElement\n                        });\n                    },\n                    onKeyDown: (props): boolean => {\n                        if (!inSuggestionMode) {\n                            return false;\n                        }\n                        if (props.event.key === keyEscape) {\n                            inSuggestionMode = false;\n                        }\n                        return (\n                            mentionListbox?.keydownHandler(props.event) ?? false\n                        );\n                    },\n                    onExit: (): void => {\n                        activeMentionCharacterEmitter('');\n                        activeMentionCommandEmitter(undefined);\n                        mentionListbox?.close();\n                    }\n                };\n            }\n        }\n    });\n}\n\n/**\n * This method finds the Link mark in the pasted content and update its Text node.\n * If there is no text node, pass the node's fragment recursively and updates only node containing Link mark.\n * If the Text node does not contains Link mark, push the same node to `updatedNodes`.\n *\n * @param fragment Fragment containing the pasted content. [Fragment](https://prosemirror.net/docs/ref/#model.Fragment)\n * @returns modified fragment from the `updatedNode` after updating the valid link text with its href value.\n */\nfunction updateLinkAndMentionNodes(\n    tiptapEditor: Editor,\n    fragment: Fragment\n): Fragment {\n    const updatedNodes: FragmentNode[] = [];\n\n    fragment.forEach(node => {\n        if (node.isText && node.marks.length > 0) {\n            const linkMark = node.marks.find(\n                mark => mark.type.name === 'link' && mark.attrs\n            );\n            if (linkMark) {\n                // Checks if the link is valid link or not\n                // Needing to separately validate the link on paste is a workaround for a tiptap issue\n                // See: https://github.com/ni/nimble/issues/1527\n                if (\n                    validAbsoluteLinkRegex.test(linkMark.attrs.href as string)\n                ) {\n                    // The below lines of code is responsible for updating the text content with its href value and creates a new updated text node.\n                    // This code needs an update when the hyperlink support is added.\n                    // See: https://github.com/ni/nimble/issues/1527\n                    updatedNodes.push(\n                        tiptapEditor.schema.text(\n                            linkMark.attrs.href as string,\n                            node.marks\n                        )\n                    );\n                } else {\n                    // If it is a invalid link, creates a new Text node with the same text content and without a Link mark.\n                    updatedNodes.push(\n                        tiptapEditor.schema.text(\n                            node.textContent,\n                            linkMark.removeFromSet(node.marks)\n                        )\n                    );\n                }\n            } else {\n                updatedNodes.push(node);\n            }\n        } else if (node.type.name.startsWith(mentionPluginPrefix)) {\n            updatedNodes.push(\n                tiptapEditor.schema.text(node.attrs.label as string)\n            );\n        } else {\n            const updatedContent = updateLinkAndMentionNodes(\n                tiptapEditor,\n                node.content\n            );\n            updatedNodes.push(node.copy(updatedContent));\n        }\n    });\n\n    return Fragment.fromArray(updatedNodes);\n}\n"]}
+{"version":3,"file":"create-tiptap-editor.js","sourceRoot":"","sources":["../../../../../src/rich-text/editor/models/create-tiptap-editor.ts"],"names":[],"mappings":"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","sourcesContent":["import { Editor, Mark, Node, mergeAttributes } from '@tiptap/core';\nimport Bold from '@tiptap/extension-bold';\nimport BulletList from '@tiptap/extension-bullet-list';\nimport Document from '@tiptap/extension-document';\nimport HardBreak from '@tiptap/extension-hard-break';\nimport History from '@tiptap/extension-history';\nimport Italic from '@tiptap/extension-italic';\nimport Link from '@tiptap/extension-link';\nimport ListItem from '@tiptap/extension-list-item';\nimport Mention from '@tiptap/extension-mention';\nimport OrderedList from '@tiptap/extension-ordered-list';\nimport Paragraph from '@tiptap/extension-paragraph';\nimport Placeholder from '@tiptap/extension-placeholder';\nimport Text from '@tiptap/extension-text';\nimport { Slice, Fragment, Node as FragmentNode } from 'prosemirror-model';\nimport { PluginKey } from 'prosemirror-state';\n\nimport { keyEscape } from '@ni/fast-web-utilities';\nimport {\n    type ActiveMentionCommandEmitter,\n    type ActiveMentionCharacterEmitter,\n    mentionPluginPrefix\n} from '../types';\n\nimport { anchorTag } from '../../../anchor';\nimport type { MentionExtensionConfiguration } from '../../models/mention-extension-configuration';\nimport type { RichTextMentionListbox } from '../../mention-listbox';\n\nconst validAbsoluteLinkRegex = /^https?:\\/\\//i;\n\nexport function createTiptapEditor(\n    activeMentionCharacterEmitter: ActiveMentionCharacterEmitter,\n    activeMentionCommandEmitter: ActiveMentionCommandEmitter,\n    editor: HTMLDivElement,\n    mentionExtensionConfig: MentionExtensionConfiguration[],\n    mentionListbox?: RichTextMentionListbox,\n    placeholder?: string\n): Editor {\n    const customLink = createCustomLinkExtension();\n    const mentionExtensions = mentionExtensionConfig.map(config => createCustomMentionExtension(\n        config,\n        activeMentionCharacterEmitter,\n        activeMentionCommandEmitter,\n        mentionListbox\n    ));\n\n    /**\n     * For more information on the extensions for the supported formatting options, refer to the links below.\n     * Tiptap marks: https://tiptap.dev/api/marks\n     * Tiptap nodes: https://tiptap.dev/api/nodes\n     */\n    const tipTapEditor = new Editor({\n        element: editor,\n        // The editor will detect markdown syntax for an input only for these items\n        // https://tiptap.dev/api/editor#enable-input-rules\n        enableInputRules: [BulletList, OrderedList],\n        // The editor will not detect markdown syntax when pasting content in any supported items\n        // Lists do not have any default paste rules, they have only input rules, so disabled paste rules\n        // https://tiptap.dev/api/editor#enable-paste-rules\n        enablePasteRules: false,\n        editorProps: {\n            // Validating whether the links in the pasted content belongs to the supported scheme (HTTPS/HTTP),\n            // and rendering it as a link in the editor. If not, rendering it as a plain text.\n            // Also, updating the link text content with its href as we support only the absolute link.\n\n            // `transformPasted` can be updated/removed when hyperlink support added\n            // See: https://github.com/ni/nimble/issues/1527\n            transformPasted\n        },\n        extensions: [\n            Document,\n            Paragraph,\n            Text,\n            BulletList,\n            OrderedList,\n            ListItem,\n            Bold,\n            Italic,\n            History,\n            Placeholder.configure({\n                placeholder,\n                showOnlyWhenEditable: false\n            }),\n            HardBreak,\n            customLink,\n            ...mentionExtensions\n        ]\n    });\n\n    /**\n     * @param slice contains the Fragment of the copied content. If the content is a link, the slice contains Text node with Link mark.\n     * ProseMirror reference for `transformPasted`: https://prosemirror.net/docs/ref/#view.EditorProps.transformPasted\n     */\n    function transformPasted(slice: Slice): Slice {\n        const modifiedFragment = updateLinkAndMentionNodes(\n            tipTapEditor,\n            slice.content\n        );\n        return new Slice(modifiedFragment, slice.openStart, slice.openEnd);\n    }\n\n    return tipTapEditor;\n}\n\n/**\n * Extending the default link mark schema defined in the TipTap.\n *\n * \"excludes\": https://prosemirror.net/docs/ref/#model.MarkSpec.excludes\n * \"inclusive\": https://prosemirror.net/docs/ref/#model.MarkSpec.inclusive\n * \"parseHTML\": https://tiptap.dev/guide/custom-extensions#parse-html\n * \"renderHTML\": https://tiptap.dev/guide/custom-extensions/#render-html\n */\nfunction createCustomLinkExtension(): Mark {\n    return Link.extend({\n        // Excludes can be removed/enabled when hyperlink support added\n        // See: https://github.com/ni/nimble/issues/1527\n        excludes: '_',\n        // Inclusive can be updated when hyperlink support added\n        // See: https://github.com/ni/nimble/issues/1527\n        inclusive: false,\n        parseHTML() {\n            return [\n                // To load the `nimble-anchor` from the HTML parsed content by markdown-parser as links in the Tiptap editor, the `parseHTML`\n                // of Link extension should return nimble `anchorTag`.\n                // This is because the link mark schema in `markdown-parser.ts` file uses `<nimble-anchor>` as anchor tag and not `<a>`.\n                {\n                    tag: anchorTag\n                },\n                // `<a>` tag is added here to support when pasting a link from external source.\n                {\n                    tag: 'a'\n                }\n            ];\n        },\n        // HTMLAttribute cannot be in camelCase as we want to match it with the name in Tiptap\n        // eslint-disable-next-line @typescript-eslint/naming-convention\n        renderHTML({ HTMLAttributes }) {\n            // The below 'a' tag should be replaced with 'nimble-anchor' once the below issue is fixed.\n            // https://github.com/ni/nimble/issues/1516\n            return ['a', HTMLAttributes];\n        }\n    }).configure({\n        // HTMLAttribute cannot be in camelCase as we want to match it with the name in Tiptap\n        // eslint-disable-next-line @typescript-eslint/naming-convention\n        HTMLAttributes: {\n            rel: 'noopener noreferrer',\n            target: null,\n            // Adding `class` here is a workaround to render two mentions without a whitespace as display names\n            // This attribute can be removed when the below issue is resolved\n            // https://github.com/ni/nimble/issues/1707\n            class: ''\n        },\n        autolink: true,\n        openOnClick: false,\n        // linkOnPaste can be enabled when hyperlink support added\n        // See: https://github.com/ni/nimble/issues/1527\n        linkOnPaste: false,\n        shouldAutoLink: href => validAbsoluteLinkRegex.test(href)\n    });\n}\n\nfunction createCustomMentionExtension(\n    config: MentionExtensionConfiguration,\n    activeMentionCharacterEmitter: ActiveMentionCharacterEmitter,\n    activeMentionCommandEmitter: ActiveMentionCommandEmitter,\n    mentionListbox?: RichTextMentionListbox\n): Node {\n    return Mention.extend({\n        name: config.name,\n        parseHTML() {\n            return [\n                {\n                    tag: config.viewElement\n                }\n            ];\n        },\n        addAttributes() {\n            return {\n                href: {\n                    default: null,\n                    parseHTML: element => element.getAttribute('mention-href'),\n                    renderHTML: attributes => {\n                        return {\n                            'mention-href': attributes.href as string\n                        };\n                    }\n                },\n                label: {\n                    default: null,\n                    parseHTML: element => element.getAttribute('mention-label'),\n                    renderHTML: attributes => {\n                        return {\n                            'mention-label': attributes.label as string\n                        };\n                    }\n                },\n                disabled: {\n                    default: null,\n                    parseHTML: element => element.getAttribute('disabled'),\n                    renderHTML: attributes => {\n                        return {\n                            disabled: attributes.disabled as string\n                        };\n                    }\n                }\n            };\n        },\n        // eslint-disable-next-line @typescript-eslint/naming-convention\n        renderHTML({ node, HTMLAttributes }) {\n            return [\n                config.viewElement,\n                mergeAttributes(this.options.HTMLAttributes, HTMLAttributes),\n                this.options.renderText({\n                    options: this.options,\n                    node,\n                    suggestion: null\n                })\n            ];\n        }\n    }).configure({\n        suggestion: {\n            char: config.character,\n            decorationClass: 'nimble-mention-view-edit',\n            pluginKey: new PluginKey(config.key),\n            allowSpaces: true,\n            render: () => {\n                let inSuggestionMode = false;\n                return {\n                    onStart: (props): void => {\n                        /**\n                         * If the cursor position moves to outside of the mention and configuration element changes,\n                         * the setMarkdown() will trigger this `onStart` without a decoration node because the cursor\n                         * position is temporarily moved out of the suggestion decoration. Ignore `onStart` in that case\n                         * and don't show the mention list box since it doesn't have anything to anchor to.\n                         */\n                        if (props.decorationNode === null) {\n                            return;\n                        }\n                        inSuggestionMode = true;\n                        config.mentionUpdateEmitter(props.query);\n                        activeMentionCharacterEmitter(props.text.slice(0, 1));\n                        activeMentionCommandEmitter(props.command);\n                        mentionListbox?.show({\n                            filter: props.query,\n                            anchorNode: props.decorationNode as HTMLElement\n                        });\n                    },\n                    onUpdate: (props): void => {\n                        if (!inSuggestionMode) {\n                            return;\n                        }\n                        config.mentionUpdateEmitter(props.query);\n                        activeMentionCommandEmitter(props.command);\n                        mentionListbox?.show({\n                            filter: props.query,\n                            anchorNode: props.decorationNode as HTMLElement\n                        });\n                    },\n                    onKeyDown: (props): boolean => {\n                        if (!inSuggestionMode) {\n                            return false;\n                        }\n                        if (props.event.key === keyEscape) {\n                            inSuggestionMode = false;\n                        }\n                        return (\n                            mentionListbox?.keydownHandler(props.event) ?? false\n                        );\n                    },\n                    onExit: (): void => {\n                        activeMentionCharacterEmitter('');\n                        activeMentionCommandEmitter(undefined);\n                        mentionListbox?.close();\n                    }\n                };\n            }\n        }\n    });\n}\n\n/**\n * This method finds the Link mark in the pasted content and update its Text node.\n * If there is no text node, pass the node's fragment recursively and updates only node containing Link mark.\n * If the Text node does not contains Link mark, push the same node to `updatedNodes`.\n *\n * @param fragment Fragment containing the pasted content. [Fragment](https://prosemirror.net/docs/ref/#model.Fragment)\n * @returns modified fragment from the `updatedNode` after updating the valid link text with its href value.\n */\nfunction updateLinkAndMentionNodes(\n    tiptapEditor: Editor,\n    fragment: Fragment\n): Fragment {\n    const updatedNodes: FragmentNode[] = [];\n\n    fragment.forEach(node => {\n        if (node.isText && node.marks.length > 0) {\n            const linkMark = node.marks.find(\n                mark => mark.type.name === 'link' && mark.attrs\n            );\n            if (linkMark) {\n                // Checks if the link is valid link or not\n                // Needing to separately validate the link on paste is a workaround for a tiptap issue\n                // See: https://github.com/ni/nimble/issues/1527\n                if (\n                    validAbsoluteLinkRegex.test(linkMark.attrs.href as string)\n                ) {\n                    // The below lines of code is responsible for updating the text content with its href value and creates a new updated text node.\n                    // This code needs an update when the hyperlink support is added.\n                    // See: https://github.com/ni/nimble/issues/1527\n                    updatedNodes.push(\n                        tiptapEditor.schema.text(\n                            linkMark.attrs.href as string,\n                            node.marks\n                        )\n                    );\n                } else {\n                    // If it is a invalid link, creates a new Text node with the same text content and without a Link mark.\n                    updatedNodes.push(\n                        tiptapEditor.schema.text(\n                            node.textContent,\n                            linkMark.removeFromSet(node.marks)\n                        )\n                    );\n                }\n            } else {\n                updatedNodes.push(node);\n            }\n        } else if (node.type.name.startsWith(mentionPluginPrefix)) {\n            updatedNodes.push(\n                tiptapEditor.schema.text(node.attrs.label as string)\n            );\n        } else {\n            const updatedContent = updateLinkAndMentionNodes(\n                tiptapEditor,\n                node.content\n            );\n            updatedNodes.push(node.copy(updatedContent));\n        }\n    });\n\n    return Fragment.fromArray(updatedNodes);\n}\n"]}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ni/nimble-components",
-  "version": "33.12.1",
+  "version": "34.0.1",
   "description": "Styled web components for the NI Nimble Design System",
   "scripts": {
     "build": "npm run generate-icons && npm run generate-workers && npm run build-components && npm run bundle-components && npm run generate-scss",
@@ -61,25 +61,25 @@
   "dependencies": {
     "@ni/fast-colors": "^10.0.0",
     "@ni/fast-element": "^10.0.0",
-    "@ni/fast-foundation": "^10.0.0",
+    "@ni/fast-foundation": "^10.1.1",
     "@ni/fast-web-utilities": "^10.0.0",
     "@ni/nimble-tokens": "^8.10.0",
     "@tanstack/table-core": "^8.19.3",
     "@tanstack/virtual-core": "^3.10.6",
-    "@tiptap/core": "^2.10.3",
-    "@tiptap/extension-bold": "^2.10.3",
-    "@tiptap/extension-bullet-list": "^2.10.3",
-    "@tiptap/extension-document": "^2.10.3",
-    "@tiptap/extension-hard-break": "^2.10.3",
-    "@tiptap/extension-history": "^2.10.3",
-    "@tiptap/extension-italic": "^2.10.3",
-    "@tiptap/extension-link": "^2.10.3",
-    "@tiptap/extension-list-item": "^2.10.3",
-    "@tiptap/extension-mention": "^2.10.3",
-    "@tiptap/extension-ordered-list": "^2.10.3",
-    "@tiptap/extension-paragraph": "^2.10.3",
-    "@tiptap/extension-placeholder": "^2.10.3",
-    "@tiptap/extension-text": "^2.10.3",
+    "@tiptap/core": "^2.25.1",
+    "@tiptap/extension-bold": "^2.25.1",
+    "@tiptap/extension-bullet-list": "^2.25.1",
+    "@tiptap/extension-document": "^2.25.1",
+    "@tiptap/extension-hard-break": "^2.25.1",
+    "@tiptap/extension-history": "^2.25.1",
+    "@tiptap/extension-italic": "^2.25.1",
+    "@tiptap/extension-link": "^2.25.1",
+    "@tiptap/extension-list-item": "^2.25.1",
+    "@tiptap/extension-mention": "^2.25.1",
+    "@tiptap/extension-ordered-list": "^2.25.1",
+    "@tiptap/extension-paragraph": "^2.25.1",
+    "@tiptap/extension-placeholder": "^2.25.1",
+    "@tiptap/extension-text": "^2.25.1",
     "@types/d3-array": "^3.0.4",
     "@types/d3-random": "^3.0.1",
     "@types/d3-scale": "^4.0.2",
@@ -98,11 +98,11 @@
     "tslib": "^2.2.0"
   },
   "peerDependencies": {
-    "apache-arrow": "20.0.0"
+    "apache-arrow": "21.0.0"
   },
   "devDependencies": {
     "@ni-private/eslint-config-nimble": "*",
-    "@ni/jasmine-parameterized": "^1.0.0",
+    "@ni/jasmine-parameterized": "^1.0.1",
     "@rollup/plugin-commonjs": "^28.0.0",
     "@rollup/plugin-node-resolve": "^16.0.0",
     "@rollup/plugin-replace": "^6.0.0",
@@ -123,7 +123,7 @@
     "karma-spec-reporter": "^0.0.36",
     "karma-webkit-launcher": "^2.6.0",
     "karma-webpack": "^5.0.0",
-    "playwright": "1.52.0",
+    "playwright": "1.53.1",
     "prettier-eslint": "^16.3.0",
     "prettier-eslint-cli": "^8.0.1",
     "rollup": "^4.12.0",