@spectrum-web-components/number-field 0.37.0 → 0.38.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (9) hide show
  1. package/custom-elements.json +38 -1
  2. package/package.json +9 -9
  3. package/src/NumberField.d.ts +4 -1
  4. package/src/NumberField.dev.js +30 -4
  5. package/src/NumberField.dev.js.map +2 -2
  6. package/src/NumberField.js +13 -13
  7. package/src/NumberField.js.map +3 -3
  8. package/stories/number-field.stories.js +1 -0
  9. package/stories/number-field.stories.js.map +2 -2
package/custom-elements.json CHANGED
@@ -584,7 +584,17 @@
584
584
  },
585
585
  {
586
586
  "kind": "method",
587
- "name": "handleInput",
587
+ "name": "handleCompositionStart",
588
+ "privacy": "protected",
589
+ "return": {
590
+ "type": {
591
+ "text": "void"
592
+ }
593
+ }
594
+ },
595
+ {
596
+ "kind": "method",
597
+ "name": "handleCompositionEnd",
588
598
  "privacy": "protected",
589
599
  "return": {
590
600
  "type": {
@@ -592,6 +602,24 @@
592
602
  }
593
603
  }
594
604
  },
605
+ {
606
+ "kind": "method",
607
+ "name": "handleInput",
608
+ "privacy": "protected",
609
+ "return": {
610
+ "type": {
611
+ "text": "void"
612
+ }
613
+ },
614
+ "parameters": [
615
+ {
616
+ "name": "event",
617
+ "type": {
618
+ "text": "Event"
619
+ }
620
+ }
621
+ ]
622
+ },
595
623
  {
596
624
  "kind": "method",
597
625
  "name": "validateInput",
@@ -692,6 +720,15 @@
692
720
  "text": "TemplateResult"
693
721
  }
694
722
  }
723
+ },
724
+ {
725
+ "kind": "field",
726
+ "name": "isComposing",
727
+ "type": {
728
+ "text": "boolean"
729
+ },
730
+ "privacy": "private",
731
+ "default": "false"
695
732
  }
696
733
  ],
697
734
  "events": [
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@spectrum-web-components/number-field",
3
- "version": "0.37.0",
3
+ "version": "0.38.0",
4
4
  "publishConfig": {
5
5
  "access": "public"
6
6
  },
@@ -58,13 +58,13 @@
58
58
  ],
59
59
  "dependencies": {
60
60
  "@internationalized/number": "^3.1.0",
61
- "@spectrum-web-components/action-button": "^0.37.0",
62
- "@spectrum-web-components/base": "^0.37.0",
63
- "@spectrum-web-components/icon": "^0.37.0",
64
- "@spectrum-web-components/icons-ui": "^0.37.0",
65
- "@spectrum-web-components/reactive-controllers": "^0.37.0",
66
- "@spectrum-web-components/shared": "^0.37.0",
67
- "@spectrum-web-components/textfield": "^0.37.0"
61
+ "@spectrum-web-components/action-button": "^0.38.0",
62
+ "@spectrum-web-components/base": "^0.38.0",
63
+ "@spectrum-web-components/icon": "^0.38.0",
64
+ "@spectrum-web-components/icons-ui": "^0.38.0",
65
+ "@spectrum-web-components/reactive-controllers": "^0.38.0",
66
+ "@spectrum-web-components/shared": "^0.38.0",
67
+ "@spectrum-web-components/textfield": "^0.38.0"
68
68
  },
69
69
  "devDependencies": {
70
70
  "@formatjs/intl-numberformat": "^8.3.5",
@@ -76,5 +76,5 @@
76
76
  "./sp-*.js",
77
77
  "./**/*.dev.js"
78
78
  ],
79
- "gitHead": "d771f62f0d8063070af43283bb0fd5e3400bad06"
79
+ "gitHead": "9a099b7543672f2fd4030833ab813b16c2cad62e"
80
80
  }
package/src/NumberField.d.ts CHANGED
@@ -83,7 +83,9 @@ export declare class NumberField extends TextfieldBase {
83
83
  private wasIndeterminate;
84
84
  private indeterminateValue?;
85
85
  protected handleChange(): void;
86
- protected handleInput(): void;
86
+ protected handleCompositionStart(): void;
87
+ protected handleCompositionEnd(): void;
88
+ protected handleInput(event: Event): void;
87
89
  private validateInput;
88
90
  protected get displayValue(): string;
89
91
  protected clearNumberFormatterCache(): void;
@@ -97,6 +99,7 @@ export declare class NumberField extends TextfieldBase {
97
99
  protected renderField(): TemplateResult;
98
100
  protected update(changes: PropertyValues): void;
99
101
  willUpdate(changes: PropertyValues): void;
102
+ private isComposing;
100
103
  protected firstUpdated(changes: PropertyValues): void;
101
104
  protected updated(changes: PropertyValues<this>): void;
102
105
  }
package/src/NumberField.dev.js CHANGED
@@ -11,7 +11,8 @@ var __decorateClass = (decorators, target, key, kind) => {
11
11
  return result;
12
12
  };
13
13
  import {
14
- html
14
+ html,
15
+ nothing
15
16
  } from "@spectrum-web-components/base";
16
17
  import {
17
18
  property,
@@ -101,6 +102,7 @@ export class NumberField extends TextfieldBase {
101
102
  this.applyFocusElementLabel = (value) => {
102
103
  this.appliedLabel = value;
103
104
  };
105
+ this.isComposing = false;
104
106
  }
105
107
  static get styles() {
106
108
  return [...super.styles, styles, chevronStyles];
@@ -233,6 +235,8 @@ export class NumberField extends TextfieldBase {
233
235
  this.stepBy(-1 * factor);
234
236
  }
235
237
  handleKeydown(event) {
238
+ if (this.isComposing)
239
+ return;
236
240
  switch (event.code) {
237
241
  case "ArrowUp":
238
242
  event.preventDefault();
@@ -297,7 +301,25 @@ export class NumberField extends TextfieldBase {
297
301
  this.value = value;
298
302
  super.handleChange();
299
303
  }
300
- handleInput() {
304
+ handleCompositionStart() {
305
+ this.isComposing = true;
306
+ }
307
+ handleCompositionEnd() {
308
+ this.isComposing = false;
309
+ requestAnimationFrame(() => {
310
+ this.inputElement.dispatchEvent(
311
+ new Event("input", {
312
+ composed: true,
313
+ bubbles: true
314
+ })
315
+ );
316
+ });
317
+ }
318
+ handleInput(event) {
319
+ if (this.isComposing) {
320
+ event.stopPropagation();
321
+ return;
322
+ }
301
323
  if (this.indeterminate) {
302
324
  this.wasIndeterminate = true;
303
325
  this.indeterminateValue = this.value;
@@ -319,12 +341,14 @@ export class NumberField extends TextfieldBase {
319
341
  }
320
342
  this._trackingValue = value;
321
343
  this.inputElement.value = value;
344
+ this.inputElement.setSelectionRange(selectionStart, selectionStart);
322
345
  return;
346
+ } else {
347
+ this.inputElement.value = this.indeterminate ? indeterminatePlaceholder : this._trackingValue;
323
348
  }
324
349
  const currentLength = value.length;
325
350
  const previousLength = this._trackingValue.length;
326
351
  const nextSelectStart = (selectionStart || currentLength) - (currentLength - previousLength);
327
- this.inputElement.value = this.indeterminate ? indeterminatePlaceholder : this._trackingValue;
328
352
  this.inputElement.setSelectionRange(nextSelectStart, nextSelectStart);
329
353
  }
330
354
  validateInput(value) {
@@ -430,7 +454,7 @@ export class NumberField extends TextfieldBase {
430
454
  this.autocomplete = "off";
431
455
  return html`
432
456
  ${super.renderField()}
433
- ${this.hideStepper ? html`` : html`
457
+ ${this.hideStepper ? nothing : html`
434
458
  <span
435
459
  class="buttons"
436
460
  @focusin=${this.handleFocusin}
@@ -504,6 +528,8 @@ export class NumberField extends TextfieldBase {
504
528
  firstUpdated(changes) {
505
529
  super.firstUpdated(changes);
506
530
  this.addEventListener("keydown", this.handleKeydown);
531
+ this.addEventListener("compositionstart", this.handleCompositionStart);
532
+ this.addEventListener("compositionend", this.handleCompositionEnd);
507
533
  }
508
534
  updated(changes) {
509
535
  if (changes.has("min") || changes.has("formatOptions")) {
package/src/NumberField.dev.js.map CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["NumberField.ts"],
4
- "sourcesContent": ["/*\nCopyright 2020 Adobe. All rights reserved.\nThis file is licensed to you under the Apache License, Version 2.0 (the \"License\");\nyou may not use this file except in compliance with the License. You may obtain a copy\nof the License at http://www.apache.org/licenses/LICENSE-2.0\n\nUnless required by applicable law or agreed to in writing, software distributed under\nthe License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\nOF ANY KIND, either express or implied. See the License for the specific language\ngoverning permissions and limitations under the License.\n*/\n\nimport {\n CSSResultArray,\n html,\n PropertyValues,\n TemplateResult,\n} from '@spectrum-web-components/base';\nimport {\n property,\n query,\n} from '@spectrum-web-components/base/src/decorators.js';\nimport {\n LanguageResolutionController,\n languageResolverUpdatedSymbol,\n} from '@spectrum-web-components/reactive-controllers/src/LanguageResolution.js';\nimport { streamingListener } from '@spectrum-web-components/base/src/streaming-listener.js';\nimport { NumberFormatter, NumberParser } from '@internationalized/number';\n\nimport '@spectrum-web-components/icons-ui/icons/sp-icon-chevron75.js';\nimport '@spectrum-web-components/icons-ui/icons/sp-icon-chevron100.js';\nimport '@spectrum-web-components/icons-ui/icons/sp-icon-chevron200.js';\nimport '@spectrum-web-components/action-button/sp-action-button.js';\nimport {\n isAndroid,\n isIPhone,\n} from '@spectrum-web-components/shared/src/platform.js';\nimport { TextfieldBase } from '@spectrum-web-components/textfield';\nimport chevronStyles from '@spectrum-web-components/icon/src/spectrum-icon-chevron.css.js';\nimport styles from './number-field.css.js';\n\nexport const FRAMES_PER_CHANGE = 5;\n// Debounce duration for inserting a `change` event after a batch of `wheel` originating `input` events.\nexport const CHANGE_DEBOUNCE_MS = 100;\nexport const indeterminatePlaceholder = '-';\nexport const remapMultiByteCharacters: Record<string, string> = {\n '\uFF11': '1',\n '\uFF12': '2',\n '\uFF13': '3',\n '\uFF14': '4',\n '\uFF15': '5',\n '\uFF16': '6',\n '\uFF17': '7',\n '\uFF18': '8',\n '\uFF19': '9',\n '\uFF10': '0',\n '\u3001': ',',\n '\uFF0C': ',',\n '\u3002': '.',\n '\uFF0E': '.',\n '\uFF05': '%',\n '\uFF0B': '+',\n \u30FC: '-',\n};\n\nconst chevronIcon: Record<string, (dir: 'Down' | 'Up') => TemplateResult> = {\n s: (dir) => html`\n <sp-icon-chevron75\n slot=\"icon\"\n class=\"stepper-icon spectrum-UIIcon-Chevron${dir}75\"\n ></sp-icon-chevron75>\n `,\n m: (dir) => html`\n <sp-icon-chevron75\n slot=\"icon\"\n class=\"stepper-icon spectrum-UIIcon-Chevron${dir}75\"\n ></sp-icon-chevron75>\n `,\n l: (dir) => html`\n <sp-icon-chevron100\n slot=\"icon\"\n class=\"stepper-icon spectrum-UIIcon-Chevron${dir}100\"\n ></sp-icon-chevron100>\n `,\n xl: (dir) => html`\n <sp-icon-chevron200\n slot=\"icon\"\n class=\"stepper-icon spectrum-UIIcon-Chevron${dir}200\"\n ></sp-icon-chevron200>\n `,\n};\n\n/**\n * @element sp-number-field\n * @slot help-text - default or non-negative help text to associate to your form element\n * @slot negative-help-text - negative help text to associate to your form element when `invalid`\n */\nexport class NumberField extends TextfieldBase {\n public static override get styles(): CSSResultArray {\n return [...super.styles, styles, chevronStyles];\n }\n\n @query('.buttons')\n private buttons!: HTMLDivElement;\n\n @property({ type: Boolean, reflect: true })\n public override focused = false;\n\n _forcedUnit = '';\n\n /**\n * An `&lt;sp-number-field&gt;` element will process its numeric value with\n * `new Intl.NumberFormat(this.resolvedLanguage, this.formatOptions).format(this.valueAsNumber)`\n * in order to prepare it for visual delivery in the input. In order to customize this\n * processing supply your own `Intl.NumberFormatOptions` object here.\n *\n * See: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Intl/NumberFormat/NumberFormat\n */\n @property({ type: Object, attribute: 'format-options' })\n public formatOptions: Intl.NumberFormatOptions = {};\n\n /**\n * Whether the stepper UI is hidden or not.\n */\n @property({ type: Boolean, reflect: true, attribute: 'hide-stepper' })\n public hideStepper = false;\n\n @property({ type: Boolean, reflect: true })\n public indeterminate = false;\n\n @property({ type: Boolean, reflect: true, attribute: 'keyboard-focused' })\n public keyboardFocused = false;\n\n @property({ type: Number })\n public max?: number;\n\n @property({ type: Number })\n public min?: number;\n\n /**\n * The distance by which to alter the value of the element when taking a \"step\".\n *\n * When `this.formatOptions.style === 'percentage'` the default step will be\n * set to 0.01 unless otherwise supplied to the element.\n */\n @property({ type: Number })\n public step?: number;\n\n public managedInput = false;\n\n @property({ type: Number, reflect: true, attribute: 'step-modifier' })\n public stepModifier = 10;\n\n @property({ type: Number })\n public override set value(rawValue: number) {\n const value = this.validateInput(rawValue);\n if (value === this.value) {\n return;\n }\n const oldValue = this._value;\n this._value = value;\n this.requestUpdate('value', oldValue);\n }\n\n public override get value(): number {\n return this._value;\n }\n\n private get inputValue(): string {\n return this.indeterminate\n ? this.formattedValue\n : this.inputElement.value;\n }\n\n public override _value = NaN;\n private _trackingValue = '';\n\n /**\n * Retreive the value of the element parsed to a Number.\n */\n public get valueAsString(): string {\n return this._value.toString();\n }\n\n public set valueAsString(value: string) {\n this.value = this.numberParser.parse(value);\n }\n\n public get formattedValue(): string {\n if (isNaN(this.value)) return '';\n return (\n this.numberFormatter.format(this.value) +\n (this.focused ? '' : this._forcedUnit)\n );\n }\n\n private convertValueToNumber(value: string): number {\n if (isIPhone() && this.inputElement.inputMode === 'decimal') {\n const parts = this.numberFormatter.formatToParts(1000.1);\n const sourceDecimal = value\n .split('')\n .find((char) => char === ',' || char === '.');\n const replacementDecimal = parts.find(\n (part) => part.type === 'decimal'\n )?.value;\n if (sourceDecimal && replacementDecimal) {\n value = value.replace(sourceDecimal, replacementDecimal);\n }\n }\n return this.numberParser.parse(value);\n }\n\n private get _step(): number {\n if (typeof this.step !== 'undefined') {\n return this.step;\n }\n if (this.formatOptions?.style === 'percent') {\n return 0.01;\n }\n return 1;\n }\n\n private nextChange!: number;\n private changeCount = 0;\n private findChange!: (event: PointerEvent) => void;\n private change!: (event: PointerEvent) => void;\n private safty!: number;\n private languageResolver = new LanguageResolutionController(this);\n\n private handlePointerdown(event: PointerEvent): void {\n if (event.button !== 0) {\n event.preventDefault();\n return;\n }\n this.managedInput = true;\n this.buttons.setPointerCapture(event.pointerId);\n const stepUpRect = this.buttons.children[0].getBoundingClientRect();\n const stepDownRect = this.buttons.children[1].getBoundingClientRect();\n this.findChange = (event: PointerEvent) => {\n if (\n event.clientX >= stepUpRect.x &&\n event.clientY >= stepUpRect.y &&\n event.clientX <= stepUpRect.x + stepUpRect.width &&\n event.clientY <= stepUpRect.y + stepUpRect.height\n ) {\n this.change = (event: PointerEvent) =>\n this.increment(event.shiftKey ? this.stepModifier : 1);\n } else if (\n event.clientX >= stepDownRect.x &&\n event.clientY >= stepDownRect.y &&\n event.clientX <= stepDownRect.x + stepDownRect.width &&\n event.clientY <= stepDownRect.y + stepDownRect.height\n ) {\n this.change = (event: PointerEvent) =>\n this.decrement(event.shiftKey ? this.stepModifier : 1);\n }\n };\n this.findChange(event);\n this.startChange(event);\n }\n\n private startChange(event: PointerEvent): void {\n this.changeCount = 0;\n this.doChange(event);\n this.safty = setTimeout(() => {\n this.doNextChange(event);\n }, 400) as unknown as number;\n }\n\n private doChange(event: PointerEvent): void {\n this.change(event);\n }\n\n private handlePointermove(event: PointerEvent): void {\n this.findChange(event);\n }\n\n private handlePointerup(event: PointerEvent): void {\n this.buttons.releasePointerCapture(event.pointerId);\n cancelAnimationFrame(this.nextChange);\n clearTimeout(this.safty);\n this.dispatchEvent(\n new Event('change', { bubbles: true, composed: true })\n );\n this.managedInput = false;\n }\n\n private doNextChange(event: PointerEvent): number {\n this.changeCount += 1;\n if (this.changeCount % FRAMES_PER_CHANGE === 0) {\n this.doChange(event);\n }\n return requestAnimationFrame(() => {\n this.nextChange = this.doNextChange(event);\n });\n }\n\n private stepBy(count: number): void {\n if (this.disabled || this.readonly) {\n return;\n }\n const min = typeof this.min !== 'undefined' ? this.min : 0;\n let value = this.value;\n value += count * this._step;\n if (isNaN(this.value)) {\n this.value = min;\n } else {\n this.value = value;\n }\n this.dispatchEvent(\n new Event('input', { bubbles: true, composed: true })\n );\n this.indeterminate = false;\n this.focus();\n }\n\n private increment(factor = 1): void {\n this.stepBy(1 * factor);\n }\n\n private decrement(factor = 1): void {\n this.stepBy(-1 * factor);\n }\n\n private handleKeydown(event: KeyboardEvent): void {\n switch (event.code) {\n case 'ArrowUp':\n event.preventDefault();\n this.increment(event.shiftKey ? this.stepModifier : 1);\n this.dispatchEvent(\n new Event('change', { bubbles: true, composed: true })\n );\n break;\n case 'ArrowDown':\n event.preventDefault();\n this.decrement(event.shiftKey ? this.stepModifier : 1);\n this.dispatchEvent(\n new Event('change', { bubbles: true, composed: true })\n );\n break;\n }\n }\n\n private queuedChangeEvent!: number;\n\n protected onScroll(event: WheelEvent): void {\n event.preventDefault();\n this.managedInput = true;\n const direction = event.shiftKey\n ? event.deltaX / Math.abs(event.deltaX)\n : event.deltaY / Math.abs(event.deltaY);\n if (direction !== 0 && !isNaN(direction)) {\n this.stepBy(direction * (event.shiftKey ? this.stepModifier : 1));\n clearTimeout(this.queuedChangeEvent);\n this.queuedChangeEvent = setTimeout(() => {\n this.dispatchEvent(\n new Event('change', { bubbles: true, composed: true })\n );\n }, CHANGE_DEBOUNCE_MS) as unknown as number;\n }\n this.managedInput = false;\n }\n\n protected override onFocus(): void {\n super.onFocus();\n this._trackingValue = this.inputValue;\n this.keyboardFocused = !this.readonly && true;\n this.addEventListener('wheel', this.onScroll, { passive: false });\n }\n\n protected override onBlur(): void {\n super.onBlur();\n this.keyboardFocused = !this.readonly && false;\n this.removeEventListener('wheel', this.onScroll);\n }\n\n private handleFocusin(): void {\n this.focused = !this.readonly && true;\n this.keyboardFocused = !this.readonly && true;\n }\n\n private handleFocusout(): void {\n this.focused = !this.readonly && false;\n this.keyboardFocused = !this.readonly && false;\n }\n\n private wasIndeterminate = false;\n private indeterminateValue?: number;\n\n protected override handleChange(): void {\n const value = this.convertValueToNumber(this.inputValue);\n if (this.wasIndeterminate) {\n this.wasIndeterminate = false;\n this.indeterminateValue = undefined;\n if (isNaN(value)) {\n this.indeterminate = true;\n return;\n }\n }\n this.value = value;\n super.handleChange();\n }\n\n protected override handleInput(): void {\n if (this.indeterminate) {\n this.wasIndeterminate = true;\n this.indeterminateValue = this.value;\n this.inputElement.value = this.inputElement.value.replace(\n indeterminatePlaceholder,\n ''\n );\n }\n const { value: originalValue, selectionStart } = this.inputElement;\n const value = originalValue\n .split('')\n .map((char) => remapMultiByteCharacters[char] || char)\n .join('');\n if (this.numberParser.isValidPartialNumber(value)) {\n const valueAsNumber = this.convertValueToNumber(value);\n if (!value && this.indeterminateValue) {\n this.indeterminate = true;\n this._value = this.indeterminateValue;\n } else {\n this.indeterminate = false;\n this._value = this.validateInput(valueAsNumber);\n }\n this._trackingValue = value;\n this.inputElement.value = value;\n return;\n }\n const currentLength = value.length;\n const previousLength = this._trackingValue.length;\n const nextSelectStart =\n (selectionStart || currentLength) -\n (currentLength - previousLength);\n this.inputElement.value = this.indeterminate\n ? indeterminatePlaceholder\n : this._trackingValue;\n this.inputElement.setSelectionRange(nextSelectStart, nextSelectStart);\n }\n\n private validateInput(value: number): number {\n if (typeof this.min !== 'undefined') {\n value = Math.max(this.min, value);\n }\n if (typeof this.max !== 'undefined') {\n value = Math.min(this.max, value);\n }\n // Step shouldn't validate when 0...\n if (this.step) {\n const min = typeof this.min !== 'undefined' ? this.min : 0;\n const moduloStep = (value - min) % this.step;\n const fallsOnStep = moduloStep === 0;\n if (!fallsOnStep) {\n const overUnder = Math.round(moduloStep / this.step);\n if (overUnder === 1) {\n value += this.step - moduloStep;\n } else {\n value -= moduloStep;\n }\n }\n if (typeof this.max !== 'undefined') {\n while (value > this.max) {\n value -= this.step;\n }\n }\n }\n return value;\n }\n\n protected override get displayValue(): string {\n const indeterminateValue = this.focused ? '' : indeterminatePlaceholder;\n return this.indeterminate ? indeterminateValue : this.formattedValue;\n }\n\n protected clearNumberFormatterCache(): void {\n this._numberFormatter = undefined;\n this._numberParser = undefined;\n }\n\n protected get numberFormatter(): NumberFormatter {\n if (!this._numberFormatter || !this._numberFormatterFocused) {\n const {\n style,\n unit,\n // eslint-disable-next-line @typescript-eslint/no-unused-vars\n unitDisplay,\n ...formatOptionsNoUnit\n } = this.formatOptions;\n if (style !== 'unit') {\n (formatOptionsNoUnit as Intl.NumberFormatOptions).style = style;\n }\n this._numberFormatterFocused = new NumberFormatter(\n this.languageResolver.language,\n formatOptionsNoUnit\n );\n try {\n this._numberFormatter = new NumberFormatter(\n this.languageResolver.language,\n this.formatOptions\n );\n this._forcedUnit = '';\n this._numberFormatter.format(1);\n } catch (error) {\n if (style === 'unit') {\n this._forcedUnit = unit as string;\n }\n this._numberFormatter = this._numberFormatterFocused;\n }\n }\n return this.focused\n ? this._numberFormatterFocused\n : this._numberFormatter;\n }\n\n private _numberFormatter?: NumberFormatter;\n private _numberFormatterFocused?: NumberFormatter;\n\n protected get numberParser(): NumberParser {\n if (!this._numberParser || !this._numberParserFocused) {\n const {\n style,\n unit,\n // eslint-disable-next-line @typescript-eslint/no-unused-vars\n unitDisplay,\n ...formatOptionsNoUnit\n } = this.formatOptions;\n if (style !== 'unit') {\n (formatOptionsNoUnit as Intl.NumberFormatOptions).style = style;\n }\n this._numberParserFocused = new NumberParser(\n this.languageResolver.language,\n formatOptionsNoUnit\n );\n try {\n this._numberParser = new NumberParser(\n this.languageResolver.language,\n this.formatOptions\n );\n this._forcedUnit = '';\n this._numberParser.parse('0');\n } catch (error) {\n if (style === 'unit') {\n this._forcedUnit = unit as string;\n }\n this._numberParser = this._numberParserFocused;\n }\n }\n return this.focused ? this._numberParserFocused : this._numberParser;\n }\n\n applyFocusElementLabel = (value?: string): void => {\n this.appliedLabel = value;\n };\n\n private _numberParser?: NumberParser;\n private _numberParserFocused?: NumberParser;\n\n protected override renderField(): TemplateResult {\n this.autocomplete = 'off';\n return html`\n ${super.renderField()}\n ${this.hideStepper\n ? html``\n : html`\n <span\n class=\"buttons\"\n @focusin=${this.handleFocusin}\n @focusout=${this.handleFocusout}\n ${streamingListener({\n start: ['pointerdown', this.handlePointerdown],\n streamInside: [\n [\n 'pointermove',\n 'pointerenter',\n 'pointerleave',\n 'pointerover',\n 'pointerout',\n ],\n this.handlePointermove,\n ],\n end: [\n [\n 'pointerup',\n 'pointercancel',\n 'pointerleave',\n ],\n this.handlePointerup,\n ],\n })}\n >\n <sp-action-button\n class=\"step-up\"\n aria-describedby=${this.helpTextId}\n label=${'Increase ' + this.appliedLabel}\n tabindex=\"-1\"\n ?focused=${this.focused}\n ?disabled=${this.disabled ||\n this.readonly ||\n (typeof this.max !== 'undefined' &&\n this.value === this.max)}\n ?quiet=${this.quiet}\n >\n ${chevronIcon[this.size]('Up')}\n </sp-action-button>\n <sp-action-button\n class=\"step-down\"\n aria-describedby=${this.helpTextId}\n label=${'Decrease ' + this.appliedLabel}\n tabindex=\"-1\"\n ?focused=${this.focused}\n ?disabled=${this.disabled ||\n this.readonly ||\n (typeof this.min !== 'undefined' &&\n this.value === this.min)}\n ?quiet=${this.quiet}\n >\n ${chevronIcon[this.size]('Down')}\n </sp-action-button>\n </span>\n `}\n `;\n }\n\n protected override update(changes: PropertyValues): void {\n if (changes.has('formatOptions') || changes.has('resolvedLanguage')) {\n this.clearNumberFormatterCache();\n }\n if (changes.has('value') || changes.has('max') || changes.has('min')) {\n const value = this.numberParser.parse(\n this.formattedValue.replace(this._forcedUnit, '')\n );\n this.value = value;\n }\n super.update(changes);\n }\n\n public override willUpdate(changes: PropertyValues): void {\n this.multiline = false;\n if (changes.has(languageResolverUpdatedSymbol)) {\n this.clearNumberFormatterCache();\n }\n }\n\n protected override firstUpdated(changes: PropertyValues): void {\n super.firstUpdated(changes);\n this.addEventListener('keydown', this.handleKeydown);\n }\n\n protected override updated(changes: PropertyValues<this>): void {\n if (changes.has('min') || changes.has('formatOptions')) {\n let inputMode = 'numeric';\n const hasNegative = typeof this.min !== 'undefined' && this.min < 0;\n const { maximumFractionDigits } =\n this.numberFormatter.resolvedOptions();\n const hasDecimals = maximumFractionDigits > 0;\n /* c8 ignore next 18 */\n if (isIPhone()) {\n // iPhone doesn't have a minus sign in either numeric or decimal.\n // Note this is only for iPhone, not iPad, which always has both\n // minus and decimal in numeric.\n if (hasNegative) {\n inputMode = 'text';\n } else if (hasDecimals) {\n inputMode = 'decimal';\n }\n } else if (isAndroid()) {\n // Android numeric has both a decimal point and minus key.\n // decimal does not have a minus key.\n if (hasNegative) {\n inputMode = 'numeric';\n } else if (hasDecimals) {\n inputMode = 'decimal';\n }\n }\n this.inputElement.inputMode = inputMode;\n }\n }\n}\n"],
5
- "mappings": "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",
4
+ "sourcesContent": ["/*\nCopyright 2020 Adobe. All rights reserved.\nThis file is licensed to you under the Apache License, Version 2.0 (the \"License\");\nyou may not use this file except in compliance with the License. You may obtain a copy\nof the License at http://www.apache.org/licenses/LICENSE-2.0\n\nUnless required by applicable law or agreed to in writing, software distributed under\nthe License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\nOF ANY KIND, either express or implied. See the License for the specific language\ngoverning permissions and limitations under the License.\n*/\n\nimport {\n CSSResultArray,\n html,\n nothing,\n PropertyValues,\n TemplateResult,\n} from '@spectrum-web-components/base';\nimport {\n property,\n query,\n} from '@spectrum-web-components/base/src/decorators.js';\nimport {\n LanguageResolutionController,\n languageResolverUpdatedSymbol,\n} from '@spectrum-web-components/reactive-controllers/src/LanguageResolution.js';\nimport { streamingListener } from '@spectrum-web-components/base/src/streaming-listener.js';\nimport { NumberFormatter, NumberParser } from '@internationalized/number';\n\nimport '@spectrum-web-components/icons-ui/icons/sp-icon-chevron75.js';\nimport '@spectrum-web-components/icons-ui/icons/sp-icon-chevron100.js';\nimport '@spectrum-web-components/icons-ui/icons/sp-icon-chevron200.js';\nimport '@spectrum-web-components/action-button/sp-action-button.js';\nimport {\n isAndroid,\n isIPhone,\n} from '@spectrum-web-components/shared/src/platform.js';\nimport { TextfieldBase } from '@spectrum-web-components/textfield';\nimport chevronStyles from '@spectrum-web-components/icon/src/spectrum-icon-chevron.css.js';\nimport styles from './number-field.css.js';\n\nexport const FRAMES_PER_CHANGE = 5;\n// Debounce duration for inserting a `change` event after a batch of `wheel` originating `input` events.\nexport const CHANGE_DEBOUNCE_MS = 100;\nexport const indeterminatePlaceholder = '-';\nexport const remapMultiByteCharacters: Record<string, string> = {\n '\uFF11': '1',\n '\uFF12': '2',\n '\uFF13': '3',\n '\uFF14': '4',\n '\uFF15': '5',\n '\uFF16': '6',\n '\uFF17': '7',\n '\uFF18': '8',\n '\uFF19': '9',\n '\uFF10': '0',\n '\u3001': ',',\n '\uFF0C': ',',\n '\u3002': '.',\n '\uFF0E': '.',\n '\uFF05': '%',\n '\uFF0B': '+',\n \u30FC: '-',\n};\n\nconst chevronIcon: Record<string, (dir: 'Down' | 'Up') => TemplateResult> = {\n s: (dir) => html`\n <sp-icon-chevron75\n slot=\"icon\"\n class=\"stepper-icon spectrum-UIIcon-Chevron${dir}75\"\n ></sp-icon-chevron75>\n `,\n m: (dir) => html`\n <sp-icon-chevron75\n slot=\"icon\"\n class=\"stepper-icon spectrum-UIIcon-Chevron${dir}75\"\n ></sp-icon-chevron75>\n `,\n l: (dir) => html`\n <sp-icon-chevron100\n slot=\"icon\"\n class=\"stepper-icon spectrum-UIIcon-Chevron${dir}100\"\n ></sp-icon-chevron100>\n `,\n xl: (dir) => html`\n <sp-icon-chevron200\n slot=\"icon\"\n class=\"stepper-icon spectrum-UIIcon-Chevron${dir}200\"\n ></sp-icon-chevron200>\n `,\n};\n\n/**\n * @element sp-number-field\n * @slot help-text - default or non-negative help text to associate to your form element\n * @slot negative-help-text - negative help text to associate to your form element when `invalid`\n */\nexport class NumberField extends TextfieldBase {\n public static override get styles(): CSSResultArray {\n return [...super.styles, styles, chevronStyles];\n }\n\n @query('.buttons')\n private buttons!: HTMLDivElement;\n\n @property({ type: Boolean, reflect: true })\n public override focused = false;\n\n _forcedUnit = '';\n\n /**\n * An `&lt;sp-number-field&gt;` element will process its numeric value with\n * `new Intl.NumberFormat(this.resolvedLanguage, this.formatOptions).format(this.valueAsNumber)`\n * in order to prepare it for visual delivery in the input. In order to customize this\n * processing supply your own `Intl.NumberFormatOptions` object here.\n *\n * See: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Intl/NumberFormat/NumberFormat\n */\n @property({ type: Object, attribute: 'format-options' })\n public formatOptions: Intl.NumberFormatOptions = {};\n\n /**\n * Whether the stepper UI is hidden or not.\n */\n @property({ type: Boolean, reflect: true, attribute: 'hide-stepper' })\n public hideStepper = false;\n\n @property({ type: Boolean, reflect: true })\n public indeterminate = false;\n\n @property({ type: Boolean, reflect: true, attribute: 'keyboard-focused' })\n public keyboardFocused = false;\n\n @property({ type: Number })\n public max?: number;\n\n @property({ type: Number })\n public min?: number;\n\n /**\n * The distance by which to alter the value of the element when taking a \"step\".\n *\n * When `this.formatOptions.style === 'percentage'` the default step will be\n * set to 0.01 unless otherwise supplied to the element.\n */\n @property({ type: Number })\n public step?: number;\n\n public managedInput = false;\n\n @property({ type: Number, reflect: true, attribute: 'step-modifier' })\n public stepModifier = 10;\n\n @property({ type: Number })\n public override set value(rawValue: number) {\n const value = this.validateInput(rawValue);\n if (value === this.value) {\n return;\n }\n const oldValue = this._value;\n this._value = value;\n this.requestUpdate('value', oldValue);\n }\n\n public override get value(): number {\n return this._value;\n }\n\n private get inputValue(): string {\n return this.indeterminate\n ? this.formattedValue\n : this.inputElement.value;\n }\n\n public override _value = NaN;\n private _trackingValue = '';\n\n /**\n * Retreive the value of the element parsed to a Number.\n */\n public get valueAsString(): string {\n return this._value.toString();\n }\n\n public set valueAsString(value: string) {\n this.value = this.numberParser.parse(value);\n }\n\n public get formattedValue(): string {\n if (isNaN(this.value)) return '';\n return (\n this.numberFormatter.format(this.value) +\n (this.focused ? '' : this._forcedUnit)\n );\n }\n\n private convertValueToNumber(value: string): number {\n if (isIPhone() && this.inputElement.inputMode === 'decimal') {\n const parts = this.numberFormatter.formatToParts(1000.1);\n const sourceDecimal = value\n .split('')\n .find((char) => char === ',' || char === '.');\n const replacementDecimal = parts.find(\n (part) => part.type === 'decimal'\n )?.value;\n if (sourceDecimal && replacementDecimal) {\n value = value.replace(sourceDecimal, replacementDecimal);\n }\n }\n return this.numberParser.parse(value);\n }\n\n private get _step(): number {\n if (typeof this.step !== 'undefined') {\n return this.step;\n }\n if (this.formatOptions?.style === 'percent') {\n return 0.01;\n }\n return 1;\n }\n\n private nextChange!: number;\n private changeCount = 0;\n private findChange!: (event: PointerEvent) => void;\n private change!: (event: PointerEvent) => void;\n private safty!: number;\n private languageResolver = new LanguageResolutionController(this);\n\n private handlePointerdown(event: PointerEvent): void {\n if (event.button !== 0) {\n event.preventDefault();\n return;\n }\n this.managedInput = true;\n this.buttons.setPointerCapture(event.pointerId);\n const stepUpRect = this.buttons.children[0].getBoundingClientRect();\n const stepDownRect = this.buttons.children[1].getBoundingClientRect();\n this.findChange = (event: PointerEvent) => {\n if (\n event.clientX >= stepUpRect.x &&\n event.clientY >= stepUpRect.y &&\n event.clientX <= stepUpRect.x + stepUpRect.width &&\n event.clientY <= stepUpRect.y + stepUpRect.height\n ) {\n this.change = (event: PointerEvent) =>\n this.increment(event.shiftKey ? this.stepModifier : 1);\n } else if (\n event.clientX >= stepDownRect.x &&\n event.clientY >= stepDownRect.y &&\n event.clientX <= stepDownRect.x + stepDownRect.width &&\n event.clientY <= stepDownRect.y + stepDownRect.height\n ) {\n this.change = (event: PointerEvent) =>\n this.decrement(event.shiftKey ? this.stepModifier : 1);\n }\n };\n this.findChange(event);\n this.startChange(event);\n }\n\n private startChange(event: PointerEvent): void {\n this.changeCount = 0;\n this.doChange(event);\n this.safty = setTimeout(() => {\n this.doNextChange(event);\n }, 400) as unknown as number;\n }\n\n private doChange(event: PointerEvent): void {\n this.change(event);\n }\n\n private handlePointermove(event: PointerEvent): void {\n this.findChange(event);\n }\n\n private handlePointerup(event: PointerEvent): void {\n this.buttons.releasePointerCapture(event.pointerId);\n cancelAnimationFrame(this.nextChange);\n clearTimeout(this.safty);\n this.dispatchEvent(\n new Event('change', { bubbles: true, composed: true })\n );\n this.managedInput = false;\n }\n\n private doNextChange(event: PointerEvent): number {\n this.changeCount += 1;\n if (this.changeCount % FRAMES_PER_CHANGE === 0) {\n this.doChange(event);\n }\n return requestAnimationFrame(() => {\n this.nextChange = this.doNextChange(event);\n });\n }\n\n private stepBy(count: number): void {\n if (this.disabled || this.readonly) {\n return;\n }\n const min = typeof this.min !== 'undefined' ? this.min : 0;\n let value = this.value;\n value += count * this._step;\n if (isNaN(this.value)) {\n this.value = min;\n } else {\n this.value = value;\n }\n this.dispatchEvent(\n new Event('input', { bubbles: true, composed: true })\n );\n this.indeterminate = false;\n this.focus();\n }\n\n private increment(factor = 1): void {\n this.stepBy(1 * factor);\n }\n\n private decrement(factor = 1): void {\n this.stepBy(-1 * factor);\n }\n\n private handleKeydown(event: KeyboardEvent): void {\n if (this.isComposing) return;\n switch (event.code) {\n case 'ArrowUp':\n event.preventDefault();\n this.increment(event.shiftKey ? this.stepModifier : 1);\n this.dispatchEvent(\n new Event('change', { bubbles: true, composed: true })\n );\n break;\n case 'ArrowDown':\n event.preventDefault();\n this.decrement(event.shiftKey ? this.stepModifier : 1);\n this.dispatchEvent(\n new Event('change', { bubbles: true, composed: true })\n );\n break;\n }\n }\n\n private queuedChangeEvent!: number;\n\n protected onScroll(event: WheelEvent): void {\n event.preventDefault();\n this.managedInput = true;\n const direction = event.shiftKey\n ? event.deltaX / Math.abs(event.deltaX)\n : event.deltaY / Math.abs(event.deltaY);\n if (direction !== 0 && !isNaN(direction)) {\n this.stepBy(direction * (event.shiftKey ? this.stepModifier : 1));\n clearTimeout(this.queuedChangeEvent);\n this.queuedChangeEvent = setTimeout(() => {\n this.dispatchEvent(\n new Event('change', { bubbles: true, composed: true })\n );\n }, CHANGE_DEBOUNCE_MS) as unknown as number;\n }\n this.managedInput = false;\n }\n\n protected override onFocus(): void {\n super.onFocus();\n this._trackingValue = this.inputValue;\n this.keyboardFocused = !this.readonly && true;\n this.addEventListener('wheel', this.onScroll, { passive: false });\n }\n\n protected override onBlur(): void {\n super.onBlur();\n this.keyboardFocused = !this.readonly && false;\n this.removeEventListener('wheel', this.onScroll);\n }\n\n private handleFocusin(): void {\n this.focused = !this.readonly && true;\n this.keyboardFocused = !this.readonly && true;\n }\n\n private handleFocusout(): void {\n this.focused = !this.readonly && false;\n this.keyboardFocused = !this.readonly && false;\n }\n\n private wasIndeterminate = false;\n private indeterminateValue?: number;\n\n protected override handleChange(): void {\n const value = this.convertValueToNumber(this.inputValue);\n if (this.wasIndeterminate) {\n this.wasIndeterminate = false;\n this.indeterminateValue = undefined;\n if (isNaN(value)) {\n this.indeterminate = true;\n return;\n }\n }\n this.value = value;\n super.handleChange();\n }\n\n protected handleCompositionStart(): void {\n this.isComposing = true;\n }\n\n protected handleCompositionEnd(): void {\n this.isComposing = false;\n requestAnimationFrame(() => {\n this.inputElement.dispatchEvent(\n new Event('input', {\n composed: true,\n bubbles: true,\n })\n );\n });\n }\n\n protected override handleInput(event: Event): void {\n if (this.isComposing) {\n event.stopPropagation();\n return;\n }\n if (this.indeterminate) {\n this.wasIndeterminate = true;\n this.indeterminateValue = this.value;\n this.inputElement.value = this.inputElement.value.replace(\n indeterminatePlaceholder,\n ''\n );\n }\n const { value: originalValue, selectionStart } = this.inputElement;\n const value = originalValue\n .split('')\n .map((char) => remapMultiByteCharacters[char] || char)\n .join('');\n if (this.numberParser.isValidPartialNumber(value)) {\n const valueAsNumber = this.convertValueToNumber(value);\n if (!value && this.indeterminateValue) {\n this.indeterminate = true;\n this._value = this.indeterminateValue;\n } else {\n this.indeterminate = false;\n this._value = this.validateInput(valueAsNumber);\n }\n this._trackingValue = value;\n this.inputElement.value = value;\n this.inputElement.setSelectionRange(selectionStart, selectionStart);\n return;\n } else {\n this.inputElement.value = this.indeterminate\n ? indeterminatePlaceholder\n : this._trackingValue;\n }\n const currentLength = value.length;\n const previousLength = this._trackingValue.length;\n const nextSelectStart =\n (selectionStart || currentLength) -\n (currentLength - previousLength);\n this.inputElement.setSelectionRange(nextSelectStart, nextSelectStart);\n }\n\n private validateInput(value: number): number {\n if (typeof this.min !== 'undefined') {\n value = Math.max(this.min, value);\n }\n if (typeof this.max !== 'undefined') {\n value = Math.min(this.max, value);\n }\n // Step shouldn't validate when 0...\n if (this.step) {\n const min = typeof this.min !== 'undefined' ? this.min : 0;\n const moduloStep = (value - min) % this.step;\n const fallsOnStep = moduloStep === 0;\n if (!fallsOnStep) {\n const overUnder = Math.round(moduloStep / this.step);\n if (overUnder === 1) {\n value += this.step - moduloStep;\n } else {\n value -= moduloStep;\n }\n }\n if (typeof this.max !== 'undefined') {\n while (value > this.max) {\n value -= this.step;\n }\n }\n }\n return value;\n }\n\n protected override get displayValue(): string {\n const indeterminateValue = this.focused ? '' : indeterminatePlaceholder;\n return this.indeterminate ? indeterminateValue : this.formattedValue;\n }\n\n protected clearNumberFormatterCache(): void {\n this._numberFormatter = undefined;\n this._numberParser = undefined;\n }\n\n protected get numberFormatter(): NumberFormatter {\n if (!this._numberFormatter || !this._numberFormatterFocused) {\n const {\n style,\n unit,\n // eslint-disable-next-line @typescript-eslint/no-unused-vars\n unitDisplay,\n ...formatOptionsNoUnit\n } = this.formatOptions;\n if (style !== 'unit') {\n (formatOptionsNoUnit as Intl.NumberFormatOptions).style = style;\n }\n this._numberFormatterFocused = new NumberFormatter(\n this.languageResolver.language,\n formatOptionsNoUnit\n );\n try {\n this._numberFormatter = new NumberFormatter(\n this.languageResolver.language,\n this.formatOptions\n );\n this._forcedUnit = '';\n this._numberFormatter.format(1);\n } catch (error) {\n if (style === 'unit') {\n this._forcedUnit = unit as string;\n }\n this._numberFormatter = this._numberFormatterFocused;\n }\n }\n return this.focused\n ? this._numberFormatterFocused\n : this._numberFormatter;\n }\n\n private _numberFormatter?: NumberFormatter;\n private _numberFormatterFocused?: NumberFormatter;\n\n protected get numberParser(): NumberParser {\n if (!this._numberParser || !this._numberParserFocused) {\n const {\n style,\n unit,\n // eslint-disable-next-line @typescript-eslint/no-unused-vars\n unitDisplay,\n ...formatOptionsNoUnit\n } = this.formatOptions;\n if (style !== 'unit') {\n (formatOptionsNoUnit as Intl.NumberFormatOptions).style = style;\n }\n this._numberParserFocused = new NumberParser(\n this.languageResolver.language,\n formatOptionsNoUnit\n );\n try {\n this._numberParser = new NumberParser(\n this.languageResolver.language,\n this.formatOptions\n );\n this._forcedUnit = '';\n this._numberParser.parse('0');\n } catch (error) {\n if (style === 'unit') {\n this._forcedUnit = unit as string;\n }\n this._numberParser = this._numberParserFocused;\n }\n }\n return this.focused ? this._numberParserFocused : this._numberParser;\n }\n\n applyFocusElementLabel = (value?: string): void => {\n this.appliedLabel = value;\n };\n\n private _numberParser?: NumberParser;\n private _numberParserFocused?: NumberParser;\n\n protected override renderField(): TemplateResult {\n this.autocomplete = 'off';\n return html`\n ${super.renderField()}\n ${this.hideStepper\n ? nothing\n : html`\n <span\n class=\"buttons\"\n @focusin=${this.handleFocusin}\n @focusout=${this.handleFocusout}\n ${streamingListener({\n start: ['pointerdown', this.handlePointerdown],\n streamInside: [\n [\n 'pointermove',\n 'pointerenter',\n 'pointerleave',\n 'pointerover',\n 'pointerout',\n ],\n this.handlePointermove,\n ],\n end: [\n [\n 'pointerup',\n 'pointercancel',\n 'pointerleave',\n ],\n this.handlePointerup,\n ],\n })}\n >\n <sp-action-button\n class=\"step-up\"\n aria-describedby=${this.helpTextId}\n label=${'Increase ' + this.appliedLabel}\n tabindex=\"-1\"\n ?focused=${this.focused}\n ?disabled=${this.disabled ||\n this.readonly ||\n (typeof this.max !== 'undefined' &&\n this.value === this.max)}\n ?quiet=${this.quiet}\n >\n ${chevronIcon[this.size]('Up')}\n </sp-action-button>\n <sp-action-button\n class=\"step-down\"\n aria-describedby=${this.helpTextId}\n label=${'Decrease ' + this.appliedLabel}\n tabindex=\"-1\"\n ?focused=${this.focused}\n ?disabled=${this.disabled ||\n this.readonly ||\n (typeof this.min !== 'undefined' &&\n this.value === this.min)}\n ?quiet=${this.quiet}\n >\n ${chevronIcon[this.size]('Down')}\n </sp-action-button>\n </span>\n `}\n `;\n }\n\n protected override update(changes: PropertyValues): void {\n if (changes.has('formatOptions') || changes.has('resolvedLanguage')) {\n this.clearNumberFormatterCache();\n }\n if (changes.has('value') || changes.has('max') || changes.has('min')) {\n const value = this.numberParser.parse(\n this.formattedValue.replace(this._forcedUnit, '')\n );\n this.value = value;\n }\n super.update(changes);\n }\n\n public override willUpdate(changes: PropertyValues): void {\n this.multiline = false;\n if (changes.has(languageResolverUpdatedSymbol)) {\n this.clearNumberFormatterCache();\n }\n }\n\n private isComposing = false;\n\n protected override firstUpdated(changes: PropertyValues): void {\n super.firstUpdated(changes);\n this.addEventListener('keydown', this.handleKeydown);\n this.addEventListener('compositionstart', this.handleCompositionStart);\n this.addEventListener('compositionend', this.handleCompositionEnd);\n }\n\n protected override updated(changes: PropertyValues<this>): void {\n if (changes.has('min') || changes.has('formatOptions')) {\n let inputMode = 'numeric';\n const hasNegative = typeof this.min !== 'undefined' && this.min < 0;\n const { maximumFractionDigits } =\n this.numberFormatter.resolvedOptions();\n const hasDecimals = maximumFractionDigits > 0;\n /* c8 ignore next 18 */\n if (isIPhone()) {\n // iPhone doesn't have a minus sign in either numeric or decimal.\n // Note this is only for iPhone, not iPad, which always has both\n // minus and decimal in numeric.\n if (hasNegative) {\n inputMode = 'text';\n } else if (hasDecimals) {\n inputMode = 'decimal';\n }\n } else if (isAndroid()) {\n // Android numeric has both a decimal point and minus key.\n // decimal does not have a minus key.\n if (hasNegative) {\n inputMode = 'numeric';\n } else if (hasDecimals) {\n inputMode = 'decimal';\n }\n }\n this.inputElement.inputMode = inputMode;\n }\n }\n}\n"],
5
+ "mappings": "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",
6
6
  "names": ["event"]
7
7
  }
package/src/NumberField.js CHANGED
@@ -1,26 +1,26 @@
1
- "use strict";var v=Object.defineProperty;var b=Object.getOwnPropertyDescriptor;var n=(a,l,e,t)=>{for(var i=t>1?void 0:t?b(l,e):l,r=a.length-1,s;r>=0;r--)(s=a[r])&&(i=(t?s(l,e,i):s(i))||i);return t&&i&&v(l,e,i),i};import{html as h}from"@spectrum-web-components/base";import{property as o,query as g}from"@spectrum-web-components/base/src/decorators.js";import{LanguageResolutionController as y,languageResolverUpdatedSymbol as P}from"@spectrum-web-components/reactive-controllers/src/LanguageResolution.js";import{streamingListener as _}from"@spectrum-web-components/base/src/streaming-listener.js";import{NumberFormatter as d,NumberParser as c}from"@internationalized/number";import"@spectrum-web-components/icons-ui/icons/sp-icon-chevron75.js";import"@spectrum-web-components/icons-ui/icons/sp-icon-chevron100.js";import"@spectrum-web-components/icons-ui/icons/sp-icon-chevron200.js";import"@spectrum-web-components/action-button/sp-action-button.js";import{isAndroid as E,isIPhone as m}from"@spectrum-web-components/shared/src/platform.js";import{TextfieldBase as F}from"@spectrum-web-components/textfield";import C from"@spectrum-web-components/icon/src/spectrum-icon-chevron.css.js";import w from"./number-field.css.js";export const FRAMES_PER_CHANGE=5,CHANGE_DEBOUNCE_MS=100,indeterminatePlaceholder="-",remapMultiByteCharacters={"\uFF11":"1","\uFF12":"2","\uFF13":"3","\uFF14":"4","\uFF15":"5","\uFF16":"6","\uFF17":"7","\uFF18":"8","\uFF19":"9","\uFF10":"0","\u3001":",","\uFF0C":",","\u3002":".","\uFF0E":".","\uFF05":"%","\uFF0B":"+",\u30FC:"-"};const f={s:a=>h`
1
+ "use strict";var b=Object.defineProperty;var g=Object.getOwnPropertyDescriptor;var n=(o,l,e,t)=>{for(var i=t>1?void 0:t?g(l,e):l,r=o.length-1,s;r>=0;r--)(s=o[r])&&(i=(t?s(l,e,i):s(i))||i);return t&&i&&b(l,e,i),i};import{html as h,nothing as y}from"@spectrum-web-components/base";import{property as a,query as E}from"@spectrum-web-components/base/src/decorators.js";import{LanguageResolutionController as C,languageResolverUpdatedSymbol as P}from"@spectrum-web-components/reactive-controllers/src/LanguageResolution.js";import{streamingListener as _}from"@spectrum-web-components/base/src/streaming-listener.js";import{NumberFormatter as c,NumberParser as m}from"@internationalized/number";import"@spectrum-web-components/icons-ui/icons/sp-icon-chevron75.js";import"@spectrum-web-components/icons-ui/icons/sp-icon-chevron100.js";import"@spectrum-web-components/icons-ui/icons/sp-icon-chevron200.js";import"@spectrum-web-components/action-button/sp-action-button.js";import{isAndroid as F,isIPhone as f}from"@spectrum-web-components/shared/src/platform.js";import{TextfieldBase as w}from"@spectrum-web-components/textfield";import x from"@spectrum-web-components/icon/src/spectrum-icon-chevron.css.js";import N from"./number-field.css.js";export const FRAMES_PER_CHANGE=5,CHANGE_DEBOUNCE_MS=100,indeterminatePlaceholder="-",remapMultiByteCharacters={"\uFF11":"1","\uFF12":"2","\uFF13":"3","\uFF14":"4","\uFF15":"5","\uFF16":"6","\uFF17":"7","\uFF18":"8","\uFF19":"9","\uFF10":"0","\u3001":",","\uFF0C":",","\u3002":".","\uFF0E":".","\uFF05":"%","\uFF0B":"+",\u30FC:"-"};const v={s:o=>h`
2
2
  <sp-icon-chevron75
3
3
  slot="icon"
4
- class="stepper-icon spectrum-UIIcon-Chevron${a}75"
4
+ class="stepper-icon spectrum-UIIcon-Chevron${o}75"
5
5
  ></sp-icon-chevron75>
6
- `,m:a=>h`
6
+ `,m:o=>h`
7
7
  <sp-icon-chevron75
8
8
  slot="icon"
9
- class="stepper-icon spectrum-UIIcon-Chevron${a}75"
9
+ class="stepper-icon spectrum-UIIcon-Chevron${o}75"
10
10
  ></sp-icon-chevron75>
11
- `,l:a=>h`
11
+ `,l:o=>h`
12
12
  <sp-icon-chevron100
13
13
  slot="icon"
14
- class="stepper-icon spectrum-UIIcon-Chevron${a}100"
14
+ class="stepper-icon spectrum-UIIcon-Chevron${o}100"
15
15
  ></sp-icon-chevron100>
16
- `,xl:a=>h`
16
+ `,xl:o=>h`
17
17
  <sp-icon-chevron200
18
18
  slot="icon"
19
- class="stepper-icon spectrum-UIIcon-Chevron${a}200"
19
+ class="stepper-icon spectrum-UIIcon-Chevron${o}200"
20
20
  ></sp-icon-chevron200>
21
- `};export class NumberField extends F{constructor(){super(...arguments);this.focused=!1;this._forcedUnit="";this.formatOptions={};this.hideStepper=!1;this.indeterminate=!1;this.keyboardFocused=!1;this.managedInput=!1;this.stepModifier=10;this._value=NaN;this._trackingValue="";this.changeCount=0;this.languageResolver=new y(this);this.wasIndeterminate=!1;this.applyFocusElementLabel=e=>{this.appliedLabel=e}}static get styles(){return[...super.styles,w,C]}set value(e){const t=this.validateInput(e);if(t===this.value)return;const i=this._value;this._value=t,this.requestUpdate("value",i)}get value(){return this._value}get inputValue(){return this.indeterminate?this.formattedValue:this.inputElement.value}get valueAsString(){return this._value.toString()}set valueAsString(e){this.value=this.numberParser.parse(e)}get formattedValue(){return isNaN(this.value)?"":this.numberFormatter.format(this.value)+(this.focused?"":this._forcedUnit)}convertValueToNumber(e){var t;if(m()&&this.inputElement.inputMode==="decimal"){const i=this.numberFormatter.formatToParts(1000.1),r=e.split("").find(u=>u===","||u==="."),s=(t=i.find(u=>u.type==="decimal"))==null?void 0:t.value;r&&s&&(e=e.replace(r,s))}return this.numberParser.parse(e)}get _step(){var e;return typeof this.step!="undefined"?this.step:((e=this.formatOptions)==null?void 0:e.style)==="percent"?.01:1}handlePointerdown(e){if(e.button!==0){e.preventDefault();return}this.managedInput=!0,this.buttons.setPointerCapture(e.pointerId);const t=this.buttons.children[0].getBoundingClientRect(),i=this.buttons.children[1].getBoundingClientRect();this.findChange=r=>{r.clientX>=t.x&&r.clientY>=t.y&&r.clientX<=t.x+t.width&&r.clientY<=t.y+t.height?this.change=s=>this.increment(s.shiftKey?this.stepModifier:1):r.clientX>=i.x&&r.clientY>=i.y&&r.clientX<=i.x+i.width&&r.clientY<=i.y+i.height&&(this.change=s=>this.decrement(s.shiftKey?this.stepModifier:1))},this.findChange(e),this.startChange(e)}startChange(e){this.changeCount=0,this.doChange(e),this.safty=setTimeout(()=>{this.doNextChange(e)},400)}doChange(e){this.change(e)}handlePointermove(e){this.findChange(e)}handlePointerup(e){this.buttons.releasePointerCapture(e.pointerId),cancelAnimationFrame(this.nextChange),clearTimeout(this.safty),this.dispatchEvent(new Event("change",{bubbles:!0,composed:!0})),this.managedInput=!1}doNextChange(e){return this.changeCount+=1,this.changeCount%FRAMES_PER_CHANGE===0&&this.doChange(e),requestAnimationFrame(()=>{this.nextChange=this.doNextChange(e)})}stepBy(e){if(this.disabled||this.readonly)return;const t=typeof this.min!="undefined"?this.min:0;let i=this.value;i+=e*this._step,isNaN(this.value)?this.value=t:this.value=i,this.dispatchEvent(new Event("input",{bubbles:!0,composed:!0})),this.indeterminate=!1,this.focus()}increment(e=1){this.stepBy(1*e)}decrement(e=1){this.stepBy(-1*e)}handleKeydown(e){switch(e.code){case"ArrowUp":e.preventDefault(),this.increment(e.shiftKey?this.stepModifier:1),this.dispatchEvent(new Event("change",{bubbles:!0,composed:!0}));break;case"ArrowDown":e.preventDefault(),this.decrement(e.shiftKey?this.stepModifier:1),this.dispatchEvent(new Event("change",{bubbles:!0,composed:!0}));break}}onScroll(e){e.preventDefault(),this.managedInput=!0;const t=e.shiftKey?e.deltaX/Math.abs(e.deltaX):e.deltaY/Math.abs(e.deltaY);t!==0&&!isNaN(t)&&(this.stepBy(t*(e.shiftKey?this.stepModifier:1)),clearTimeout(this.queuedChangeEvent),this.queuedChangeEvent=setTimeout(()=>{this.dispatchEvent(new Event("change",{bubbles:!0,composed:!0}))},CHANGE_DEBOUNCE_MS)),this.managedInput=!1}onFocus(){super.onFocus(),this._trackingValue=this.inputValue,this.keyboardFocused=!this.readonly&&!0,this.addEventListener("wheel",this.onScroll,{passive:!1})}onBlur(){super.onBlur(),this.keyboardFocused=!this.readonly&&!1,this.removeEventListener("wheel",this.onScroll)}handleFocusin(){this.focused=!this.readonly&&!0,this.keyboardFocused=!this.readonly&&!0}handleFocusout(){this.focused=!this.readonly&&!1,this.keyboardFocused=!this.readonly&&!1}handleChange(){const e=this.convertValueToNumber(this.inputValue);if(this.wasIndeterminate&&(this.wasIndeterminate=!1,this.indeterminateValue=void 0,isNaN(e))){this.indeterminate=!0;return}this.value=e,super.handleChange()}handleInput(){this.indeterminate&&(this.wasIndeterminate=!0,this.indeterminateValue=this.value,this.inputElement.value=this.inputElement.value.replace(indeterminatePlaceholder,""));const{value:e,selectionStart:t}=this.inputElement,i=e.split("").map(p=>remapMultiByteCharacters[p]||p).join("");if(this.numberParser.isValidPartialNumber(i)){const p=this.convertValueToNumber(i);!i&&this.indeterminateValue?(this.indeterminate=!0,this._value=this.indeterminateValue):(this.indeterminate=!1,this._value=this.validateInput(p)),this._trackingValue=i,this.inputElement.value=i;return}const r=i.length,s=this._trackingValue.length,u=(t||r)-(r-s);this.inputElement.value=this.indeterminate?indeterminatePlaceholder:this._trackingValue,this.inputElement.setSelectionRange(u,u)}validateInput(e){if(typeof this.min!="undefined"&&(e=Math.max(this.min,e)),typeof this.max!="undefined"&&(e=Math.min(this.max,e)),this.step){const t=typeof this.min!="undefined"?this.min:0,i=(e-t)%this.step;if(i===0||(Math.round(i/this.step)===1?e+=this.step-i:e-=i),typeof this.max!="undefined")for(;e>this.max;)e-=this.step}return e}get displayValue(){const e=this.focused?"":indeterminatePlaceholder;return this.indeterminate?e:this.formattedValue}clearNumberFormatterCache(){this._numberFormatter=void 0,this._numberParser=void 0}get numberFormatter(){if(!this._numberFormatter||!this._numberFormatterFocused){const{style:e,unit:t,unitDisplay:i,...r}=this.formatOptions;e!=="unit"&&(r.style=e),this._numberFormatterFocused=new d(this.languageResolver.language,r);try{this._numberFormatter=new d(this.languageResolver.language,this.formatOptions),this._forcedUnit="",this._numberFormatter.format(1)}catch(s){e==="unit"&&(this._forcedUnit=t),this._numberFormatter=this._numberFormatterFocused}}return this.focused?this._numberFormatterFocused:this._numberFormatter}get numberParser(){if(!this._numberParser||!this._numberParserFocused){const{style:e,unit:t,unitDisplay:i,...r}=this.formatOptions;e!=="unit"&&(r.style=e),this._numberParserFocused=new c(this.languageResolver.language,r);try{this._numberParser=new c(this.languageResolver.language,this.formatOptions),this._forcedUnit="",this._numberParser.parse("0")}catch(s){e==="unit"&&(this._forcedUnit=t),this._numberParser=this._numberParserFocused}}return this.focused?this._numberParserFocused:this._numberParser}renderField(){return this.autocomplete="off",h`
21
+ `};export class NumberField extends w{constructor(){super(...arguments);this.focused=!1;this._forcedUnit="";this.formatOptions={};this.hideStepper=!1;this.indeterminate=!1;this.keyboardFocused=!1;this.managedInput=!1;this.stepModifier=10;this._value=NaN;this._trackingValue="";this.changeCount=0;this.languageResolver=new C(this);this.wasIndeterminate=!1;this.applyFocusElementLabel=e=>{this.appliedLabel=e};this.isComposing=!1}static get styles(){return[...super.styles,N,x]}set value(e){const t=this.validateInput(e);if(t===this.value)return;const i=this._value;this._value=t,this.requestUpdate("value",i)}get value(){return this._value}get inputValue(){return this.indeterminate?this.formattedValue:this.inputElement.value}get valueAsString(){return this._value.toString()}set valueAsString(e){this.value=this.numberParser.parse(e)}get formattedValue(){return isNaN(this.value)?"":this.numberFormatter.format(this.value)+(this.focused?"":this._forcedUnit)}convertValueToNumber(e){var t;if(f()&&this.inputElement.inputMode==="decimal"){const i=this.numberFormatter.formatToParts(1000.1),r=e.split("").find(u=>u===","||u==="."),s=(t=i.find(u=>u.type==="decimal"))==null?void 0:t.value;r&&s&&(e=e.replace(r,s))}return this.numberParser.parse(e)}get _step(){var e;return typeof this.step!="undefined"?this.step:((e=this.formatOptions)==null?void 0:e.style)==="percent"?.01:1}handlePointerdown(e){if(e.button!==0){e.preventDefault();return}this.managedInput=!0,this.buttons.setPointerCapture(e.pointerId);const t=this.buttons.children[0].getBoundingClientRect(),i=this.buttons.children[1].getBoundingClientRect();this.findChange=r=>{r.clientX>=t.x&&r.clientY>=t.y&&r.clientX<=t.x+t.width&&r.clientY<=t.y+t.height?this.change=s=>this.increment(s.shiftKey?this.stepModifier:1):r.clientX>=i.x&&r.clientY>=i.y&&r.clientX<=i.x+i.width&&r.clientY<=i.y+i.height&&(this.change=s=>this.decrement(s.shiftKey?this.stepModifier:1))},this.findChange(e),this.startChange(e)}startChange(e){this.changeCount=0,this.doChange(e),this.safty=setTimeout(()=>{this.doNextChange(e)},400)}doChange(e){this.change(e)}handlePointermove(e){this.findChange(e)}handlePointerup(e){this.buttons.releasePointerCapture(e.pointerId),cancelAnimationFrame(this.nextChange),clearTimeout(this.safty),this.dispatchEvent(new Event("change",{bubbles:!0,composed:!0})),this.managedInput=!1}doNextChange(e){return this.changeCount+=1,this.changeCount%FRAMES_PER_CHANGE===0&&this.doChange(e),requestAnimationFrame(()=>{this.nextChange=this.doNextChange(e)})}stepBy(e){if(this.disabled||this.readonly)return;const t=typeof this.min!="undefined"?this.min:0;let i=this.value;i+=e*this._step,isNaN(this.value)?this.value=t:this.value=i,this.dispatchEvent(new Event("input",{bubbles:!0,composed:!0})),this.indeterminate=!1,this.focus()}increment(e=1){this.stepBy(1*e)}decrement(e=1){this.stepBy(-1*e)}handleKeydown(e){if(!this.isComposing)switch(e.code){case"ArrowUp":e.preventDefault(),this.increment(e.shiftKey?this.stepModifier:1),this.dispatchEvent(new Event("change",{bubbles:!0,composed:!0}));break;case"ArrowDown":e.preventDefault(),this.decrement(e.shiftKey?this.stepModifier:1),this.dispatchEvent(new Event("change",{bubbles:!0,composed:!0}));break}}onScroll(e){e.preventDefault(),this.managedInput=!0;const t=e.shiftKey?e.deltaX/Math.abs(e.deltaX):e.deltaY/Math.abs(e.deltaY);t!==0&&!isNaN(t)&&(this.stepBy(t*(e.shiftKey?this.stepModifier:1)),clearTimeout(this.queuedChangeEvent),this.queuedChangeEvent=setTimeout(()=>{this.dispatchEvent(new Event("change",{bubbles:!0,composed:!0}))},CHANGE_DEBOUNCE_MS)),this.managedInput=!1}onFocus(){super.onFocus(),this._trackingValue=this.inputValue,this.keyboardFocused=!this.readonly&&!0,this.addEventListener("wheel",this.onScroll,{passive:!1})}onBlur(){super.onBlur(),this.keyboardFocused=!this.readonly&&!1,this.removeEventListener("wheel",this.onScroll)}handleFocusin(){this.focused=!this.readonly&&!0,this.keyboardFocused=!this.readonly&&!0}handleFocusout(){this.focused=!this.readonly&&!1,this.keyboardFocused=!this.readonly&&!1}handleChange(){const e=this.convertValueToNumber(this.inputValue);if(this.wasIndeterminate&&(this.wasIndeterminate=!1,this.indeterminateValue=void 0,isNaN(e))){this.indeterminate=!0;return}this.value=e,super.handleChange()}handleCompositionStart(){this.isComposing=!0}handleCompositionEnd(){this.isComposing=!1,requestAnimationFrame(()=>{this.inputElement.dispatchEvent(new Event("input",{composed:!0,bubbles:!0}))})}handleInput(e){if(this.isComposing){e.stopPropagation();return}this.indeterminate&&(this.wasIndeterminate=!0,this.indeterminateValue=this.value,this.inputElement.value=this.inputElement.value.replace(indeterminatePlaceholder,""));const{value:t,selectionStart:i}=this.inputElement,r=t.split("").map(p=>remapMultiByteCharacters[p]||p).join("");if(this.numberParser.isValidPartialNumber(r)){const p=this.convertValueToNumber(r);!r&&this.indeterminateValue?(this.indeterminate=!0,this._value=this.indeterminateValue):(this.indeterminate=!1,this._value=this.validateInput(p)),this._trackingValue=r,this.inputElement.value=r,this.inputElement.setSelectionRange(i,i);return}else this.inputElement.value=this.indeterminate?indeterminatePlaceholder:this._trackingValue;const s=r.length,u=this._trackingValue.length,d=(i||s)-(s-u);this.inputElement.setSelectionRange(d,d)}validateInput(e){if(typeof this.min!="undefined"&&(e=Math.max(this.min,e)),typeof this.max!="undefined"&&(e=Math.min(this.max,e)),this.step){const t=typeof this.min!="undefined"?this.min:0,i=(e-t)%this.step;if(i===0||(Math.round(i/this.step)===1?e+=this.step-i:e-=i),typeof this.max!="undefined")for(;e>this.max;)e-=this.step}return e}get displayValue(){const e=this.focused?"":indeterminatePlaceholder;return this.indeterminate?e:this.formattedValue}clearNumberFormatterCache(){this._numberFormatter=void 0,this._numberParser=void 0}get numberFormatter(){if(!this._numberFormatter||!this._numberFormatterFocused){const{style:e,unit:t,unitDisplay:i,...r}=this.formatOptions;e!=="unit"&&(r.style=e),this._numberFormatterFocused=new c(this.languageResolver.language,r);try{this._numberFormatter=new c(this.languageResolver.language,this.formatOptions),this._forcedUnit="",this._numberFormatter.format(1)}catch(s){e==="unit"&&(this._forcedUnit=t),this._numberFormatter=this._numberFormatterFocused}}return this.focused?this._numberFormatterFocused:this._numberFormatter}get numberParser(){if(!this._numberParser||!this._numberParserFocused){const{style:e,unit:t,unitDisplay:i,...r}=this.formatOptions;e!=="unit"&&(r.style=e),this._numberParserFocused=new m(this.languageResolver.language,r);try{this._numberParser=new m(this.languageResolver.language,this.formatOptions),this._forcedUnit="",this._numberParser.parse("0")}catch(s){e==="unit"&&(this._forcedUnit=t),this._numberParser=this._numberParserFocused}}return this.focused?this._numberParserFocused:this._numberParser}renderField(){return this.autocomplete="off",h`
22
22
  ${super.renderField()}
23
- ${this.hideStepper?h``:h`
23
+ ${this.hideStepper?y:h`
24
24
  <span
25
25
  class="buttons"
26
26
  @focusin=${this.handleFocusin}
@@ -36,7 +36,7 @@
36
36
  ?disabled=${this.disabled||this.readonly||typeof this.max!="undefined"&&this.value===this.max}
37
37
  ?quiet=${this.quiet}
38
38
  >
39
- ${f[this.size]("Up")}
39
+ ${v[this.size]("Up")}
40
40
  </sp-action-button>
41
41
  <sp-action-button
42
42
  class="step-down"
@@ -47,9 +47,9 @@
47
47
  ?disabled=${this.disabled||this.readonly||typeof this.min!="undefined"&&this.value===this.min}
48
48
  ?quiet=${this.quiet}
49
49
  >
50
- ${f[this.size]("Down")}
50
+ ${v[this.size]("Down")}
51
51
  </sp-action-button>
52
52
  </span>
53
53
  `}
54
- `}update(e){if((e.has("formatOptions")||e.has("resolvedLanguage"))&&this.clearNumberFormatterCache(),e.has("value")||e.has("max")||e.has("min")){const t=this.numberParser.parse(this.formattedValue.replace(this._forcedUnit,""));this.value=t}super.update(e)}willUpdate(e){this.multiline=!1,e.has(P)&&this.clearNumberFormatterCache()}firstUpdated(e){super.firstUpdated(e),this.addEventListener("keydown",this.handleKeydown)}updated(e){if(e.has("min")||e.has("formatOptions")){let t="numeric";const i=typeof this.min!="undefined"&&this.min<0,{maximumFractionDigits:r}=this.numberFormatter.resolvedOptions(),s=r>0;m()?i?t="text":s&&(t="decimal"):E()&&(i?t="numeric":s&&(t="decimal")),this.inputElement.inputMode=t}}}n([g(".buttons")],NumberField.prototype,"buttons",2),n([o({type:Boolean,reflect:!0})],NumberField.prototype,"focused",2),n([o({type:Object,attribute:"format-options"})],NumberField.prototype,"formatOptions",2),n([o({type:Boolean,reflect:!0,attribute:"hide-stepper"})],NumberField.prototype,"hideStepper",2),n([o({type:Boolean,reflect:!0})],NumberField.prototype,"indeterminate",2),n([o({type:Boolean,reflect:!0,attribute:"keyboard-focused"})],NumberField.prototype,"keyboardFocused",2),n([o({type:Number})],NumberField.prototype,"max",2),n([o({type:Number})],NumberField.prototype,"min",2),n([o({type:Number})],NumberField.prototype,"step",2),n([o({type:Number,reflect:!0,attribute:"step-modifier"})],NumberField.prototype,"stepModifier",2),n([o({type:Number})],NumberField.prototype,"value",1);
54
+ `}update(e){if((e.has("formatOptions")||e.has("resolvedLanguage"))&&this.clearNumberFormatterCache(),e.has("value")||e.has("max")||e.has("min")){const t=this.numberParser.parse(this.formattedValue.replace(this._forcedUnit,""));this.value=t}super.update(e)}willUpdate(e){this.multiline=!1,e.has(P)&&this.clearNumberFormatterCache()}firstUpdated(e){super.firstUpdated(e),this.addEventListener("keydown",this.handleKeydown),this.addEventListener("compositionstart",this.handleCompositionStart),this.addEventListener("compositionend",this.handleCompositionEnd)}updated(e){if(e.has("min")||e.has("formatOptions")){let t="numeric";const i=typeof this.min!="undefined"&&this.min<0,{maximumFractionDigits:r}=this.numberFormatter.resolvedOptions(),s=r>0;f()?i?t="text":s&&(t="decimal"):F()&&(i?t="numeric":s&&(t="decimal")),this.inputElement.inputMode=t}}}n([E(".buttons")],NumberField.prototype,"buttons",2),n([a({type:Boolean,reflect:!0})],NumberField.prototype,"focused",2),n([a({type:Object,attribute:"format-options"})],NumberField.prototype,"formatOptions",2),n([a({type:Boolean,reflect:!0,attribute:"hide-stepper"})],NumberField.prototype,"hideStepper",2),n([a({type:Boolean,reflect:!0})],NumberField.prototype,"indeterminate",2),n([a({type:Boolean,reflect:!0,attribute:"keyboard-focused"})],NumberField.prototype,"keyboardFocused",2),n([a({type:Number})],NumberField.prototype,"max",2),n([a({type:Number})],NumberField.prototype,"min",2),n([a({type:Number})],NumberField.prototype,"step",2),n([a({type:Number,reflect:!0,attribute:"step-modifier"})],NumberField.prototype,"stepModifier",2),n([a({type:Number})],NumberField.prototype,"value",1);
55
55
  //# sourceMappingURL=NumberField.js.map
package/src/NumberField.js.map CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["NumberField.ts"],
4
- "sourcesContent": ["/*\nCopyright 2020 Adobe. All rights reserved.\nThis file is licensed to you under the Apache License, Version 2.0 (the \"License\");\nyou may not use this file except in compliance with the License. You may obtain a copy\nof the License at http://www.apache.org/licenses/LICENSE-2.0\n\nUnless required by applicable law or agreed to in writing, software distributed under\nthe License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\nOF ANY KIND, either express or implied. See the License for the specific language\ngoverning permissions and limitations under the License.\n*/\n\nimport {\n CSSResultArray,\n html,\n PropertyValues,\n TemplateResult,\n} from '@spectrum-web-components/base';\nimport {\n property,\n query,\n} from '@spectrum-web-components/base/src/decorators.js';\nimport {\n LanguageResolutionController,\n languageResolverUpdatedSymbol,\n} from '@spectrum-web-components/reactive-controllers/src/LanguageResolution.js';\nimport { streamingListener } from '@spectrum-web-components/base/src/streaming-listener.js';\nimport { NumberFormatter, NumberParser } from '@internationalized/number';\n\nimport '@spectrum-web-components/icons-ui/icons/sp-icon-chevron75.js';\nimport '@spectrum-web-components/icons-ui/icons/sp-icon-chevron100.js';\nimport '@spectrum-web-components/icons-ui/icons/sp-icon-chevron200.js';\nimport '@spectrum-web-components/action-button/sp-action-button.js';\nimport {\n isAndroid,\n isIPhone,\n} from '@spectrum-web-components/shared/src/platform.js';\nimport { TextfieldBase } from '@spectrum-web-components/textfield';\nimport chevronStyles from '@spectrum-web-components/icon/src/spectrum-icon-chevron.css.js';\nimport styles from './number-field.css.js';\n\nexport const FRAMES_PER_CHANGE = 5;\n// Debounce duration for inserting a `change` event after a batch of `wheel` originating `input` events.\nexport const CHANGE_DEBOUNCE_MS = 100;\nexport const indeterminatePlaceholder = '-';\nexport const remapMultiByteCharacters: Record<string, string> = {\n '\uFF11': '1',\n '\uFF12': '2',\n '\uFF13': '3',\n '\uFF14': '4',\n '\uFF15': '5',\n '\uFF16': '6',\n '\uFF17': '7',\n '\uFF18': '8',\n '\uFF19': '9',\n '\uFF10': '0',\n '\u3001': ',',\n '\uFF0C': ',',\n '\u3002': '.',\n '\uFF0E': '.',\n '\uFF05': '%',\n '\uFF0B': '+',\n \u30FC: '-',\n};\n\nconst chevronIcon: Record<string, (dir: 'Down' | 'Up') => TemplateResult> = {\n s: (dir) => html`\n <sp-icon-chevron75\n slot=\"icon\"\n class=\"stepper-icon spectrum-UIIcon-Chevron${dir}75\"\n ></sp-icon-chevron75>\n `,\n m: (dir) => html`\n <sp-icon-chevron75\n slot=\"icon\"\n class=\"stepper-icon spectrum-UIIcon-Chevron${dir}75\"\n ></sp-icon-chevron75>\n `,\n l: (dir) => html`\n <sp-icon-chevron100\n slot=\"icon\"\n class=\"stepper-icon spectrum-UIIcon-Chevron${dir}100\"\n ></sp-icon-chevron100>\n `,\n xl: (dir) => html`\n <sp-icon-chevron200\n slot=\"icon\"\n class=\"stepper-icon spectrum-UIIcon-Chevron${dir}200\"\n ></sp-icon-chevron200>\n `,\n};\n\n/**\n * @element sp-number-field\n * @slot help-text - default or non-negative help text to associate to your form element\n * @slot negative-help-text - negative help text to associate to your form element when `invalid`\n */\nexport class NumberField extends TextfieldBase {\n public static override get styles(): CSSResultArray {\n return [...super.styles, styles, chevronStyles];\n }\n\n @query('.buttons')\n private buttons!: HTMLDivElement;\n\n @property({ type: Boolean, reflect: true })\n public override focused = false;\n\n _forcedUnit = '';\n\n /**\n * An `&lt;sp-number-field&gt;` element will process its numeric value with\n * `new Intl.NumberFormat(this.resolvedLanguage, this.formatOptions).format(this.valueAsNumber)`\n * in order to prepare it for visual delivery in the input. In order to customize this\n * processing supply your own `Intl.NumberFormatOptions` object here.\n *\n * See: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Intl/NumberFormat/NumberFormat\n */\n @property({ type: Object, attribute: 'format-options' })\n public formatOptions: Intl.NumberFormatOptions = {};\n\n /**\n * Whether the stepper UI is hidden or not.\n */\n @property({ type: Boolean, reflect: true, attribute: 'hide-stepper' })\n public hideStepper = false;\n\n @property({ type: Boolean, reflect: true })\n public indeterminate = false;\n\n @property({ type: Boolean, reflect: true, attribute: 'keyboard-focused' })\n public keyboardFocused = false;\n\n @property({ type: Number })\n public max?: number;\n\n @property({ type: Number })\n public min?: number;\n\n /**\n * The distance by which to alter the value of the element when taking a \"step\".\n *\n * When `this.formatOptions.style === 'percentage'` the default step will be\n * set to 0.01 unless otherwise supplied to the element.\n */\n @property({ type: Number })\n public step?: number;\n\n public managedInput = false;\n\n @property({ type: Number, reflect: true, attribute: 'step-modifier' })\n public stepModifier = 10;\n\n @property({ type: Number })\n public override set value(rawValue: number) {\n const value = this.validateInput(rawValue);\n if (value === this.value) {\n return;\n }\n const oldValue = this._value;\n this._value = value;\n this.requestUpdate('value', oldValue);\n }\n\n public override get value(): number {\n return this._value;\n }\n\n private get inputValue(): string {\n return this.indeterminate\n ? this.formattedValue\n : this.inputElement.value;\n }\n\n public override _value = NaN;\n private _trackingValue = '';\n\n /**\n * Retreive the value of the element parsed to a Number.\n */\n public get valueAsString(): string {\n return this._value.toString();\n }\n\n public set valueAsString(value: string) {\n this.value = this.numberParser.parse(value);\n }\n\n public get formattedValue(): string {\n if (isNaN(this.value)) return '';\n return (\n this.numberFormatter.format(this.value) +\n (this.focused ? '' : this._forcedUnit)\n );\n }\n\n private convertValueToNumber(value: string): number {\n if (isIPhone() && this.inputElement.inputMode === 'decimal') {\n const parts = this.numberFormatter.formatToParts(1000.1);\n const sourceDecimal = value\n .split('')\n .find((char) => char === ',' || char === '.');\n const replacementDecimal = parts.find(\n (part) => part.type === 'decimal'\n )?.value;\n if (sourceDecimal && replacementDecimal) {\n value = value.replace(sourceDecimal, replacementDecimal);\n }\n }\n return this.numberParser.parse(value);\n }\n\n private get _step(): number {\n if (typeof this.step !== 'undefined') {\n return this.step;\n }\n if (this.formatOptions?.style === 'percent') {\n return 0.01;\n }\n return 1;\n }\n\n private nextChange!: number;\n private changeCount = 0;\n private findChange!: (event: PointerEvent) => void;\n private change!: (event: PointerEvent) => void;\n private safty!: number;\n private languageResolver = new LanguageResolutionController(this);\n\n private handlePointerdown(event: PointerEvent): void {\n if (event.button !== 0) {\n event.preventDefault();\n return;\n }\n this.managedInput = true;\n this.buttons.setPointerCapture(event.pointerId);\n const stepUpRect = this.buttons.children[0].getBoundingClientRect();\n const stepDownRect = this.buttons.children[1].getBoundingClientRect();\n this.findChange = (event: PointerEvent) => {\n if (\n event.clientX >= stepUpRect.x &&\n event.clientY >= stepUpRect.y &&\n event.clientX <= stepUpRect.x + stepUpRect.width &&\n event.clientY <= stepUpRect.y + stepUpRect.height\n ) {\n this.change = (event: PointerEvent) =>\n this.increment(event.shiftKey ? this.stepModifier : 1);\n } else if (\n event.clientX >= stepDownRect.x &&\n event.clientY >= stepDownRect.y &&\n event.clientX <= stepDownRect.x + stepDownRect.width &&\n event.clientY <= stepDownRect.y + stepDownRect.height\n ) {\n this.change = (event: PointerEvent) =>\n this.decrement(event.shiftKey ? this.stepModifier : 1);\n }\n };\n this.findChange(event);\n this.startChange(event);\n }\n\n private startChange(event: PointerEvent): void {\n this.changeCount = 0;\n this.doChange(event);\n this.safty = setTimeout(() => {\n this.doNextChange(event);\n }, 400) as unknown as number;\n }\n\n private doChange(event: PointerEvent): void {\n this.change(event);\n }\n\n private handlePointermove(event: PointerEvent): void {\n this.findChange(event);\n }\n\n private handlePointerup(event: PointerEvent): void {\n this.buttons.releasePointerCapture(event.pointerId);\n cancelAnimationFrame(this.nextChange);\n clearTimeout(this.safty);\n this.dispatchEvent(\n new Event('change', { bubbles: true, composed: true })\n );\n this.managedInput = false;\n }\n\n private doNextChange(event: PointerEvent): number {\n this.changeCount += 1;\n if (this.changeCount % FRAMES_PER_CHANGE === 0) {\n this.doChange(event);\n }\n return requestAnimationFrame(() => {\n this.nextChange = this.doNextChange(event);\n });\n }\n\n private stepBy(count: number): void {\n if (this.disabled || this.readonly) {\n return;\n }\n const min = typeof this.min !== 'undefined' ? this.min : 0;\n let value = this.value;\n value += count * this._step;\n if (isNaN(this.value)) {\n this.value = min;\n } else {\n this.value = value;\n }\n this.dispatchEvent(\n new Event('input', { bubbles: true, composed: true })\n );\n this.indeterminate = false;\n this.focus();\n }\n\n private increment(factor = 1): void {\n this.stepBy(1 * factor);\n }\n\n private decrement(factor = 1): void {\n this.stepBy(-1 * factor);\n }\n\n private handleKeydown(event: KeyboardEvent): void {\n switch (event.code) {\n case 'ArrowUp':\n event.preventDefault();\n this.increment(event.shiftKey ? this.stepModifier : 1);\n this.dispatchEvent(\n new Event('change', { bubbles: true, composed: true })\n );\n break;\n case 'ArrowDown':\n event.preventDefault();\n this.decrement(event.shiftKey ? this.stepModifier : 1);\n this.dispatchEvent(\n new Event('change', { bubbles: true, composed: true })\n );\n break;\n }\n }\n\n private queuedChangeEvent!: number;\n\n protected onScroll(event: WheelEvent): void {\n event.preventDefault();\n this.managedInput = true;\n const direction = event.shiftKey\n ? event.deltaX / Math.abs(event.deltaX)\n : event.deltaY / Math.abs(event.deltaY);\n if (direction !== 0 && !isNaN(direction)) {\n this.stepBy(direction * (event.shiftKey ? this.stepModifier : 1));\n clearTimeout(this.queuedChangeEvent);\n this.queuedChangeEvent = setTimeout(() => {\n this.dispatchEvent(\n new Event('change', { bubbles: true, composed: true })\n );\n }, CHANGE_DEBOUNCE_MS) as unknown as number;\n }\n this.managedInput = false;\n }\n\n protected override onFocus(): void {\n super.onFocus();\n this._trackingValue = this.inputValue;\n this.keyboardFocused = !this.readonly && true;\n this.addEventListener('wheel', this.onScroll, { passive: false });\n }\n\n protected override onBlur(): void {\n super.onBlur();\n this.keyboardFocused = !this.readonly && false;\n this.removeEventListener('wheel', this.onScroll);\n }\n\n private handleFocusin(): void {\n this.focused = !this.readonly && true;\n this.keyboardFocused = !this.readonly && true;\n }\n\n private handleFocusout(): void {\n this.focused = !this.readonly && false;\n this.keyboardFocused = !this.readonly && false;\n }\n\n private wasIndeterminate = false;\n private indeterminateValue?: number;\n\n protected override handleChange(): void {\n const value = this.convertValueToNumber(this.inputValue);\n if (this.wasIndeterminate) {\n this.wasIndeterminate = false;\n this.indeterminateValue = undefined;\n if (isNaN(value)) {\n this.indeterminate = true;\n return;\n }\n }\n this.value = value;\n super.handleChange();\n }\n\n protected override handleInput(): void {\n if (this.indeterminate) {\n this.wasIndeterminate = true;\n this.indeterminateValue = this.value;\n this.inputElement.value = this.inputElement.value.replace(\n indeterminatePlaceholder,\n ''\n );\n }\n const { value: originalValue, selectionStart } = this.inputElement;\n const value = originalValue\n .split('')\n .map((char) => remapMultiByteCharacters[char] || char)\n .join('');\n if (this.numberParser.isValidPartialNumber(value)) {\n const valueAsNumber = this.convertValueToNumber(value);\n if (!value && this.indeterminateValue) {\n this.indeterminate = true;\n this._value = this.indeterminateValue;\n } else {\n this.indeterminate = false;\n this._value = this.validateInput(valueAsNumber);\n }\n this._trackingValue = value;\n this.inputElement.value = value;\n return;\n }\n const currentLength = value.length;\n const previousLength = this._trackingValue.length;\n const nextSelectStart =\n (selectionStart || currentLength) -\n (currentLength - previousLength);\n this.inputElement.value = this.indeterminate\n ? indeterminatePlaceholder\n : this._trackingValue;\n this.inputElement.setSelectionRange(nextSelectStart, nextSelectStart);\n }\n\n private validateInput(value: number): number {\n if (typeof this.min !== 'undefined') {\n value = Math.max(this.min, value);\n }\n if (typeof this.max !== 'undefined') {\n value = Math.min(this.max, value);\n }\n // Step shouldn't validate when 0...\n if (this.step) {\n const min = typeof this.min !== 'undefined' ? this.min : 0;\n const moduloStep = (value - min) % this.step;\n const fallsOnStep = moduloStep === 0;\n if (!fallsOnStep) {\n const overUnder = Math.round(moduloStep / this.step);\n if (overUnder === 1) {\n value += this.step - moduloStep;\n } else {\n value -= moduloStep;\n }\n }\n if (typeof this.max !== 'undefined') {\n while (value > this.max) {\n value -= this.step;\n }\n }\n }\n return value;\n }\n\n protected override get displayValue(): string {\n const indeterminateValue = this.focused ? '' : indeterminatePlaceholder;\n return this.indeterminate ? indeterminateValue : this.formattedValue;\n }\n\n protected clearNumberFormatterCache(): void {\n this._numberFormatter = undefined;\n this._numberParser = undefined;\n }\n\n protected get numberFormatter(): NumberFormatter {\n if (!this._numberFormatter || !this._numberFormatterFocused) {\n const {\n style,\n unit,\n // eslint-disable-next-line @typescript-eslint/no-unused-vars\n unitDisplay,\n ...formatOptionsNoUnit\n } = this.formatOptions;\n if (style !== 'unit') {\n (formatOptionsNoUnit as Intl.NumberFormatOptions).style = style;\n }\n this._numberFormatterFocused = new NumberFormatter(\n this.languageResolver.language,\n formatOptionsNoUnit\n );\n try {\n this._numberFormatter = new NumberFormatter(\n this.languageResolver.language,\n this.formatOptions\n );\n this._forcedUnit = '';\n this._numberFormatter.format(1);\n } catch (error) {\n if (style === 'unit') {\n this._forcedUnit = unit as string;\n }\n this._numberFormatter = this._numberFormatterFocused;\n }\n }\n return this.focused\n ? this._numberFormatterFocused\n : this._numberFormatter;\n }\n\n private _numberFormatter?: NumberFormatter;\n private _numberFormatterFocused?: NumberFormatter;\n\n protected get numberParser(): NumberParser {\n if (!this._numberParser || !this._numberParserFocused) {\n const {\n style,\n unit,\n // eslint-disable-next-line @typescript-eslint/no-unused-vars\n unitDisplay,\n ...formatOptionsNoUnit\n } = this.formatOptions;\n if (style !== 'unit') {\n (formatOptionsNoUnit as Intl.NumberFormatOptions).style = style;\n }\n this._numberParserFocused = new NumberParser(\n this.languageResolver.language,\n formatOptionsNoUnit\n );\n try {\n this._numberParser = new NumberParser(\n this.languageResolver.language,\n this.formatOptions\n );\n this._forcedUnit = '';\n this._numberParser.parse('0');\n } catch (error) {\n if (style === 'unit') {\n this._forcedUnit = unit as string;\n }\n this._numberParser = this._numberParserFocused;\n }\n }\n return this.focused ? this._numberParserFocused : this._numberParser;\n }\n\n applyFocusElementLabel = (value?: string): void => {\n this.appliedLabel = value;\n };\n\n private _numberParser?: NumberParser;\n private _numberParserFocused?: NumberParser;\n\n protected override renderField(): TemplateResult {\n this.autocomplete = 'off';\n return html`\n ${super.renderField()}\n ${this.hideStepper\n ? html``\n : html`\n <span\n class=\"buttons\"\n @focusin=${this.handleFocusin}\n @focusout=${this.handleFocusout}\n ${streamingListener({\n start: ['pointerdown', this.handlePointerdown],\n streamInside: [\n [\n 'pointermove',\n 'pointerenter',\n 'pointerleave',\n 'pointerover',\n 'pointerout',\n ],\n this.handlePointermove,\n ],\n end: [\n [\n 'pointerup',\n 'pointercancel',\n 'pointerleave',\n ],\n this.handlePointerup,\n ],\n })}\n >\n <sp-action-button\n class=\"step-up\"\n aria-describedby=${this.helpTextId}\n label=${'Increase ' + this.appliedLabel}\n tabindex=\"-1\"\n ?focused=${this.focused}\n ?disabled=${this.disabled ||\n this.readonly ||\n (typeof this.max !== 'undefined' &&\n this.value === this.max)}\n ?quiet=${this.quiet}\n >\n ${chevronIcon[this.size]('Up')}\n </sp-action-button>\n <sp-action-button\n class=\"step-down\"\n aria-describedby=${this.helpTextId}\n label=${'Decrease ' + this.appliedLabel}\n tabindex=\"-1\"\n ?focused=${this.focused}\n ?disabled=${this.disabled ||\n this.readonly ||\n (typeof this.min !== 'undefined' &&\n this.value === this.min)}\n ?quiet=${this.quiet}\n >\n ${chevronIcon[this.size]('Down')}\n </sp-action-button>\n </span>\n `}\n `;\n }\n\n protected override update(changes: PropertyValues): void {\n if (changes.has('formatOptions') || changes.has('resolvedLanguage')) {\n this.clearNumberFormatterCache();\n }\n if (changes.has('value') || changes.has('max') || changes.has('min')) {\n const value = this.numberParser.parse(\n this.formattedValue.replace(this._forcedUnit, '')\n );\n this.value = value;\n }\n super.update(changes);\n }\n\n public override willUpdate(changes: PropertyValues): void {\n this.multiline = false;\n if (changes.has(languageResolverUpdatedSymbol)) {\n this.clearNumberFormatterCache();\n }\n }\n\n protected override firstUpdated(changes: PropertyValues): void {\n super.firstUpdated(changes);\n this.addEventListener('keydown', this.handleKeydown);\n }\n\n protected override updated(changes: PropertyValues<this>): void {\n if (changes.has('min') || changes.has('formatOptions')) {\n let inputMode = 'numeric';\n const hasNegative = typeof this.min !== 'undefined' && this.min < 0;\n const { maximumFractionDigits } =\n this.numberFormatter.resolvedOptions();\n const hasDecimals = maximumFractionDigits > 0;\n /* c8 ignore next 18 */\n if (isIPhone()) {\n // iPhone doesn't have a minus sign in either numeric or decimal.\n // Note this is only for iPhone, not iPad, which always has both\n // minus and decimal in numeric.\n if (hasNegative) {\n inputMode = 'text';\n } else if (hasDecimals) {\n inputMode = 'decimal';\n }\n } else if (isAndroid()) {\n // Android numeric has both a decimal point and minus key.\n // decimal does not have a minus key.\n if (hasNegative) {\n inputMode = 'numeric';\n } else if (hasDecimals) {\n inputMode = 'decimal';\n }\n }\n this.inputElement.inputMode = inputMode;\n }\n }\n}\n"],
5
- "mappings": "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",
6
- "names": ["html", "property", "query", "LanguageResolutionController", "languageResolverUpdatedSymbol", "streamingListener", "NumberFormatter", "NumberParser", "isAndroid", "isIPhone", "TextfieldBase", "chevronStyles", "styles", "chevronIcon", "dir", "value", "rawValue", "oldValue", "_a", "parts", "sourceDecimal", "char", "replacementDecimal", "part", "event", "stepUpRect", "stepDownRect", "count", "min", "factor", "direction", "originalValue", "selectionStart", "valueAsNumber", "currentLength", "previousLength", "nextSelectStart", "moduloStep", "indeterminateValue", "style", "unit", "unitDisplay", "formatOptionsNoUnit", "error", "changes", "inputMode", "hasNegative", "maximumFractionDigits", "hasDecimals", "__decorateClass"]
4
+ "sourcesContent": ["/*\nCopyright 2020 Adobe. All rights reserved.\nThis file is licensed to you under the Apache License, Version 2.0 (the \"License\");\nyou may not use this file except in compliance with the License. You may obtain a copy\nof the License at http://www.apache.org/licenses/LICENSE-2.0\n\nUnless required by applicable law or agreed to in writing, software distributed under\nthe License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\nOF ANY KIND, either express or implied. See the License for the specific language\ngoverning permissions and limitations under the License.\n*/\n\nimport {\n CSSResultArray,\n html,\n nothing,\n PropertyValues,\n TemplateResult,\n} from '@spectrum-web-components/base';\nimport {\n property,\n query,\n} from '@spectrum-web-components/base/src/decorators.js';\nimport {\n LanguageResolutionController,\n languageResolverUpdatedSymbol,\n} from '@spectrum-web-components/reactive-controllers/src/LanguageResolution.js';\nimport { streamingListener } from '@spectrum-web-components/base/src/streaming-listener.js';\nimport { NumberFormatter, NumberParser } from '@internationalized/number';\n\nimport '@spectrum-web-components/icons-ui/icons/sp-icon-chevron75.js';\nimport '@spectrum-web-components/icons-ui/icons/sp-icon-chevron100.js';\nimport '@spectrum-web-components/icons-ui/icons/sp-icon-chevron200.js';\nimport '@spectrum-web-components/action-button/sp-action-button.js';\nimport {\n isAndroid,\n isIPhone,\n} from '@spectrum-web-components/shared/src/platform.js';\nimport { TextfieldBase } from '@spectrum-web-components/textfield';\nimport chevronStyles from '@spectrum-web-components/icon/src/spectrum-icon-chevron.css.js';\nimport styles from './number-field.css.js';\n\nexport const FRAMES_PER_CHANGE = 5;\n// Debounce duration for inserting a `change` event after a batch of `wheel` originating `input` events.\nexport const CHANGE_DEBOUNCE_MS = 100;\nexport const indeterminatePlaceholder = '-';\nexport const remapMultiByteCharacters: Record<string, string> = {\n '\uFF11': '1',\n '\uFF12': '2',\n '\uFF13': '3',\n '\uFF14': '4',\n '\uFF15': '5',\n '\uFF16': '6',\n '\uFF17': '7',\n '\uFF18': '8',\n '\uFF19': '9',\n '\uFF10': '0',\n '\u3001': ',',\n '\uFF0C': ',',\n '\u3002': '.',\n '\uFF0E': '.',\n '\uFF05': '%',\n '\uFF0B': '+',\n \u30FC: '-',\n};\n\nconst chevronIcon: Record<string, (dir: 'Down' | 'Up') => TemplateResult> = {\n s: (dir) => html`\n <sp-icon-chevron75\n slot=\"icon\"\n class=\"stepper-icon spectrum-UIIcon-Chevron${dir}75\"\n ></sp-icon-chevron75>\n `,\n m: (dir) => html`\n <sp-icon-chevron75\n slot=\"icon\"\n class=\"stepper-icon spectrum-UIIcon-Chevron${dir}75\"\n ></sp-icon-chevron75>\n `,\n l: (dir) => html`\n <sp-icon-chevron100\n slot=\"icon\"\n class=\"stepper-icon spectrum-UIIcon-Chevron${dir}100\"\n ></sp-icon-chevron100>\n `,\n xl: (dir) => html`\n <sp-icon-chevron200\n slot=\"icon\"\n class=\"stepper-icon spectrum-UIIcon-Chevron${dir}200\"\n ></sp-icon-chevron200>\n `,\n};\n\n/**\n * @element sp-number-field\n * @slot help-text - default or non-negative help text to associate to your form element\n * @slot negative-help-text - negative help text to associate to your form element when `invalid`\n */\nexport class NumberField extends TextfieldBase {\n public static override get styles(): CSSResultArray {\n return [...super.styles, styles, chevronStyles];\n }\n\n @query('.buttons')\n private buttons!: HTMLDivElement;\n\n @property({ type: Boolean, reflect: true })\n public override focused = false;\n\n _forcedUnit = '';\n\n /**\n * An `&lt;sp-number-field&gt;` element will process its numeric value with\n * `new Intl.NumberFormat(this.resolvedLanguage, this.formatOptions).format(this.valueAsNumber)`\n * in order to prepare it for visual delivery in the input. In order to customize this\n * processing supply your own `Intl.NumberFormatOptions` object here.\n *\n * See: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Intl/NumberFormat/NumberFormat\n */\n @property({ type: Object, attribute: 'format-options' })\n public formatOptions: Intl.NumberFormatOptions = {};\n\n /**\n * Whether the stepper UI is hidden or not.\n */\n @property({ type: Boolean, reflect: true, attribute: 'hide-stepper' })\n public hideStepper = false;\n\n @property({ type: Boolean, reflect: true })\n public indeterminate = false;\n\n @property({ type: Boolean, reflect: true, attribute: 'keyboard-focused' })\n public keyboardFocused = false;\n\n @property({ type: Number })\n public max?: number;\n\n @property({ type: Number })\n public min?: number;\n\n /**\n * The distance by which to alter the value of the element when taking a \"step\".\n *\n * When `this.formatOptions.style === 'percentage'` the default step will be\n * set to 0.01 unless otherwise supplied to the element.\n */\n @property({ type: Number })\n public step?: number;\n\n public managedInput = false;\n\n @property({ type: Number, reflect: true, attribute: 'step-modifier' })\n public stepModifier = 10;\n\n @property({ type: Number })\n public override set value(rawValue: number) {\n const value = this.validateInput(rawValue);\n if (value === this.value) {\n return;\n }\n const oldValue = this._value;\n this._value = value;\n this.requestUpdate('value', oldValue);\n }\n\n public override get value(): number {\n return this._value;\n }\n\n private get inputValue(): string {\n return this.indeterminate\n ? this.formattedValue\n : this.inputElement.value;\n }\n\n public override _value = NaN;\n private _trackingValue = '';\n\n /**\n * Retreive the value of the element parsed to a Number.\n */\n public get valueAsString(): string {\n return this._value.toString();\n }\n\n public set valueAsString(value: string) {\n this.value = this.numberParser.parse(value);\n }\n\n public get formattedValue(): string {\n if (isNaN(this.value)) return '';\n return (\n this.numberFormatter.format(this.value) +\n (this.focused ? '' : this._forcedUnit)\n );\n }\n\n private convertValueToNumber(value: string): number {\n if (isIPhone() && this.inputElement.inputMode === 'decimal') {\n const parts = this.numberFormatter.formatToParts(1000.1);\n const sourceDecimal = value\n .split('')\n .find((char) => char === ',' || char === '.');\n const replacementDecimal = parts.find(\n (part) => part.type === 'decimal'\n )?.value;\n if (sourceDecimal && replacementDecimal) {\n value = value.replace(sourceDecimal, replacementDecimal);\n }\n }\n return this.numberParser.parse(value);\n }\n\n private get _step(): number {\n if (typeof this.step !== 'undefined') {\n return this.step;\n }\n if (this.formatOptions?.style === 'percent') {\n return 0.01;\n }\n return 1;\n }\n\n private nextChange!: number;\n private changeCount = 0;\n private findChange!: (event: PointerEvent) => void;\n private change!: (event: PointerEvent) => void;\n private safty!: number;\n private languageResolver = new LanguageResolutionController(this);\n\n private handlePointerdown(event: PointerEvent): void {\n if (event.button !== 0) {\n event.preventDefault();\n return;\n }\n this.managedInput = true;\n this.buttons.setPointerCapture(event.pointerId);\n const stepUpRect = this.buttons.children[0].getBoundingClientRect();\n const stepDownRect = this.buttons.children[1].getBoundingClientRect();\n this.findChange = (event: PointerEvent) => {\n if (\n event.clientX >= stepUpRect.x &&\n event.clientY >= stepUpRect.y &&\n event.clientX <= stepUpRect.x + stepUpRect.width &&\n event.clientY <= stepUpRect.y + stepUpRect.height\n ) {\n this.change = (event: PointerEvent) =>\n this.increment(event.shiftKey ? this.stepModifier : 1);\n } else if (\n event.clientX >= stepDownRect.x &&\n event.clientY >= stepDownRect.y &&\n event.clientX <= stepDownRect.x + stepDownRect.width &&\n event.clientY <= stepDownRect.y + stepDownRect.height\n ) {\n this.change = (event: PointerEvent) =>\n this.decrement(event.shiftKey ? this.stepModifier : 1);\n }\n };\n this.findChange(event);\n this.startChange(event);\n }\n\n private startChange(event: PointerEvent): void {\n this.changeCount = 0;\n this.doChange(event);\n this.safty = setTimeout(() => {\n this.doNextChange(event);\n }, 400) as unknown as number;\n }\n\n private doChange(event: PointerEvent): void {\n this.change(event);\n }\n\n private handlePointermove(event: PointerEvent): void {\n this.findChange(event);\n }\n\n private handlePointerup(event: PointerEvent): void {\n this.buttons.releasePointerCapture(event.pointerId);\n cancelAnimationFrame(this.nextChange);\n clearTimeout(this.safty);\n this.dispatchEvent(\n new Event('change', { bubbles: true, composed: true })\n );\n this.managedInput = false;\n }\n\n private doNextChange(event: PointerEvent): number {\n this.changeCount += 1;\n if (this.changeCount % FRAMES_PER_CHANGE === 0) {\n this.doChange(event);\n }\n return requestAnimationFrame(() => {\n this.nextChange = this.doNextChange(event);\n });\n }\n\n private stepBy(count: number): void {\n if (this.disabled || this.readonly) {\n return;\n }\n const min = typeof this.min !== 'undefined' ? this.min : 0;\n let value = this.value;\n value += count * this._step;\n if (isNaN(this.value)) {\n this.value = min;\n } else {\n this.value = value;\n }\n this.dispatchEvent(\n new Event('input', { bubbles: true, composed: true })\n );\n this.indeterminate = false;\n this.focus();\n }\n\n private increment(factor = 1): void {\n this.stepBy(1 * factor);\n }\n\n private decrement(factor = 1): void {\n this.stepBy(-1 * factor);\n }\n\n private handleKeydown(event: KeyboardEvent): void {\n if (this.isComposing) return;\n switch (event.code) {\n case 'ArrowUp':\n event.preventDefault();\n this.increment(event.shiftKey ? this.stepModifier : 1);\n this.dispatchEvent(\n new Event('change', { bubbles: true, composed: true })\n );\n break;\n case 'ArrowDown':\n event.preventDefault();\n this.decrement(event.shiftKey ? this.stepModifier : 1);\n this.dispatchEvent(\n new Event('change', { bubbles: true, composed: true })\n );\n break;\n }\n }\n\n private queuedChangeEvent!: number;\n\n protected onScroll(event: WheelEvent): void {\n event.preventDefault();\n this.managedInput = true;\n const direction = event.shiftKey\n ? event.deltaX / Math.abs(event.deltaX)\n : event.deltaY / Math.abs(event.deltaY);\n if (direction !== 0 && !isNaN(direction)) {\n this.stepBy(direction * (event.shiftKey ? this.stepModifier : 1));\n clearTimeout(this.queuedChangeEvent);\n this.queuedChangeEvent = setTimeout(() => {\n this.dispatchEvent(\n new Event('change', { bubbles: true, composed: true })\n );\n }, CHANGE_DEBOUNCE_MS) as unknown as number;\n }\n this.managedInput = false;\n }\n\n protected override onFocus(): void {\n super.onFocus();\n this._trackingValue = this.inputValue;\n this.keyboardFocused = !this.readonly && true;\n this.addEventListener('wheel', this.onScroll, { passive: false });\n }\n\n protected override onBlur(): void {\n super.onBlur();\n this.keyboardFocused = !this.readonly && false;\n this.removeEventListener('wheel', this.onScroll);\n }\n\n private handleFocusin(): void {\n this.focused = !this.readonly && true;\n this.keyboardFocused = !this.readonly && true;\n }\n\n private handleFocusout(): void {\n this.focused = !this.readonly && false;\n this.keyboardFocused = !this.readonly && false;\n }\n\n private wasIndeterminate = false;\n private indeterminateValue?: number;\n\n protected override handleChange(): void {\n const value = this.convertValueToNumber(this.inputValue);\n if (this.wasIndeterminate) {\n this.wasIndeterminate = false;\n this.indeterminateValue = undefined;\n if (isNaN(value)) {\n this.indeterminate = true;\n return;\n }\n }\n this.value = value;\n super.handleChange();\n }\n\n protected handleCompositionStart(): void {\n this.isComposing = true;\n }\n\n protected handleCompositionEnd(): void {\n this.isComposing = false;\n requestAnimationFrame(() => {\n this.inputElement.dispatchEvent(\n new Event('input', {\n composed: true,\n bubbles: true,\n })\n );\n });\n }\n\n protected override handleInput(event: Event): void {\n if (this.isComposing) {\n event.stopPropagation();\n return;\n }\n if (this.indeterminate) {\n this.wasIndeterminate = true;\n this.indeterminateValue = this.value;\n this.inputElement.value = this.inputElement.value.replace(\n indeterminatePlaceholder,\n ''\n );\n }\n const { value: originalValue, selectionStart } = this.inputElement;\n const value = originalValue\n .split('')\n .map((char) => remapMultiByteCharacters[char] || char)\n .join('');\n if (this.numberParser.isValidPartialNumber(value)) {\n const valueAsNumber = this.convertValueToNumber(value);\n if (!value && this.indeterminateValue) {\n this.indeterminate = true;\n this._value = this.indeterminateValue;\n } else {\n this.indeterminate = false;\n this._value = this.validateInput(valueAsNumber);\n }\n this._trackingValue = value;\n this.inputElement.value = value;\n this.inputElement.setSelectionRange(selectionStart, selectionStart);\n return;\n } else {\n this.inputElement.value = this.indeterminate\n ? indeterminatePlaceholder\n : this._trackingValue;\n }\n const currentLength = value.length;\n const previousLength = this._trackingValue.length;\n const nextSelectStart =\n (selectionStart || currentLength) -\n (currentLength - previousLength);\n this.inputElement.setSelectionRange(nextSelectStart, nextSelectStart);\n }\n\n private validateInput(value: number): number {\n if (typeof this.min !== 'undefined') {\n value = Math.max(this.min, value);\n }\n if (typeof this.max !== 'undefined') {\n value = Math.min(this.max, value);\n }\n // Step shouldn't validate when 0...\n if (this.step) {\n const min = typeof this.min !== 'undefined' ? this.min : 0;\n const moduloStep = (value - min) % this.step;\n const fallsOnStep = moduloStep === 0;\n if (!fallsOnStep) {\n const overUnder = Math.round(moduloStep / this.step);\n if (overUnder === 1) {\n value += this.step - moduloStep;\n } else {\n value -= moduloStep;\n }\n }\n if (typeof this.max !== 'undefined') {\n while (value > this.max) {\n value -= this.step;\n }\n }\n }\n return value;\n }\n\n protected override get displayValue(): string {\n const indeterminateValue = this.focused ? '' : indeterminatePlaceholder;\n return this.indeterminate ? indeterminateValue : this.formattedValue;\n }\n\n protected clearNumberFormatterCache(): void {\n this._numberFormatter = undefined;\n this._numberParser = undefined;\n }\n\n protected get numberFormatter(): NumberFormatter {\n if (!this._numberFormatter || !this._numberFormatterFocused) {\n const {\n style,\n unit,\n // eslint-disable-next-line @typescript-eslint/no-unused-vars\n unitDisplay,\n ...formatOptionsNoUnit\n } = this.formatOptions;\n if (style !== 'unit') {\n (formatOptionsNoUnit as Intl.NumberFormatOptions).style = style;\n }\n this._numberFormatterFocused = new NumberFormatter(\n this.languageResolver.language,\n formatOptionsNoUnit\n );\n try {\n this._numberFormatter = new NumberFormatter(\n this.languageResolver.language,\n this.formatOptions\n );\n this._forcedUnit = '';\n this._numberFormatter.format(1);\n } catch (error) {\n if (style === 'unit') {\n this._forcedUnit = unit as string;\n }\n this._numberFormatter = this._numberFormatterFocused;\n }\n }\n return this.focused\n ? this._numberFormatterFocused\n : this._numberFormatter;\n }\n\n private _numberFormatter?: NumberFormatter;\n private _numberFormatterFocused?: NumberFormatter;\n\n protected get numberParser(): NumberParser {\n if (!this._numberParser || !this._numberParserFocused) {\n const {\n style,\n unit,\n // eslint-disable-next-line @typescript-eslint/no-unused-vars\n unitDisplay,\n ...formatOptionsNoUnit\n } = this.formatOptions;\n if (style !== 'unit') {\n (formatOptionsNoUnit as Intl.NumberFormatOptions).style = style;\n }\n this._numberParserFocused = new NumberParser(\n this.languageResolver.language,\n formatOptionsNoUnit\n );\n try {\n this._numberParser = new NumberParser(\n this.languageResolver.language,\n this.formatOptions\n );\n this._forcedUnit = '';\n this._numberParser.parse('0');\n } catch (error) {\n if (style === 'unit') {\n this._forcedUnit = unit as string;\n }\n this._numberParser = this._numberParserFocused;\n }\n }\n return this.focused ? this._numberParserFocused : this._numberParser;\n }\n\n applyFocusElementLabel = (value?: string): void => {\n this.appliedLabel = value;\n };\n\n private _numberParser?: NumberParser;\n private _numberParserFocused?: NumberParser;\n\n protected override renderField(): TemplateResult {\n this.autocomplete = 'off';\n return html`\n ${super.renderField()}\n ${this.hideStepper\n ? nothing\n : html`\n <span\n class=\"buttons\"\n @focusin=${this.handleFocusin}\n @focusout=${this.handleFocusout}\n ${streamingListener({\n start: ['pointerdown', this.handlePointerdown],\n streamInside: [\n [\n 'pointermove',\n 'pointerenter',\n 'pointerleave',\n 'pointerover',\n 'pointerout',\n ],\n this.handlePointermove,\n ],\n end: [\n [\n 'pointerup',\n 'pointercancel',\n 'pointerleave',\n ],\n this.handlePointerup,\n ],\n })}\n >\n <sp-action-button\n class=\"step-up\"\n aria-describedby=${this.helpTextId}\n label=${'Increase ' + this.appliedLabel}\n tabindex=\"-1\"\n ?focused=${this.focused}\n ?disabled=${this.disabled ||\n this.readonly ||\n (typeof this.max !== 'undefined' &&\n this.value === this.max)}\n ?quiet=${this.quiet}\n >\n ${chevronIcon[this.size]('Up')}\n </sp-action-button>\n <sp-action-button\n class=\"step-down\"\n aria-describedby=${this.helpTextId}\n label=${'Decrease ' + this.appliedLabel}\n tabindex=\"-1\"\n ?focused=${this.focused}\n ?disabled=${this.disabled ||\n this.readonly ||\n (typeof this.min !== 'undefined' &&\n this.value === this.min)}\n ?quiet=${this.quiet}\n >\n ${chevronIcon[this.size]('Down')}\n </sp-action-button>\n </span>\n `}\n `;\n }\n\n protected override update(changes: PropertyValues): void {\n if (changes.has('formatOptions') || changes.has('resolvedLanguage')) {\n this.clearNumberFormatterCache();\n }\n if (changes.has('value') || changes.has('max') || changes.has('min')) {\n const value = this.numberParser.parse(\n this.formattedValue.replace(this._forcedUnit, '')\n );\n this.value = value;\n }\n super.update(changes);\n }\n\n public override willUpdate(changes: PropertyValues): void {\n this.multiline = false;\n if (changes.has(languageResolverUpdatedSymbol)) {\n this.clearNumberFormatterCache();\n }\n }\n\n private isComposing = false;\n\n protected override firstUpdated(changes: PropertyValues): void {\n super.firstUpdated(changes);\n this.addEventListener('keydown', this.handleKeydown);\n this.addEventListener('compositionstart', this.handleCompositionStart);\n this.addEventListener('compositionend', this.handleCompositionEnd);\n }\n\n protected override updated(changes: PropertyValues<this>): void {\n if (changes.has('min') || changes.has('formatOptions')) {\n let inputMode = 'numeric';\n const hasNegative = typeof this.min !== 'undefined' && this.min < 0;\n const { maximumFractionDigits } =\n this.numberFormatter.resolvedOptions();\n const hasDecimals = maximumFractionDigits > 0;\n /* c8 ignore next 18 */\n if (isIPhone()) {\n // iPhone doesn't have a minus sign in either numeric or decimal.\n // Note this is only for iPhone, not iPad, which always has both\n // minus and decimal in numeric.\n if (hasNegative) {\n inputMode = 'text';\n } else if (hasDecimals) {\n inputMode = 'decimal';\n }\n } else if (isAndroid()) {\n // Android numeric has both a decimal point and minus key.\n // decimal does not have a minus key.\n if (hasNegative) {\n inputMode = 'numeric';\n } else if (hasDecimals) {\n inputMode = 'decimal';\n }\n }\n this.inputElement.inputMode = inputMode;\n }\n }\n}\n"],
5
+ "mappings": "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",
6
+ "names": ["html", "nothing", "property", "query", "LanguageResolutionController", "languageResolverUpdatedSymbol", "streamingListener", "NumberFormatter", "NumberParser", "isAndroid", "isIPhone", "TextfieldBase", "chevronStyles", "styles", "chevronIcon", "dir", "value", "rawValue", "oldValue", "_a", "parts", "sourceDecimal", "char", "replacementDecimal", "part", "event", "stepUpRect", "stepDownRect", "count", "min", "factor", "direction", "originalValue", "selectionStart", "valueAsNumber", "currentLength", "previousLength", "nextSelectStart", "moduloStep", "indeterminateValue", "style", "unit", "unitDisplay", "formatOptionsNoUnit", "error", "changes", "inputMode", "hasNegative", "maximumFractionDigits", "hasDecimals", "__decorateClass"]
7
7
  }
package/stories/number-field.stories.js CHANGED
@@ -192,6 +192,7 @@ export const decimals = (args) => {
192
192
  style="width: 200px"
193
193
  ...=${spreadProps(args)}
194
194
  @change=${args.onChange}
195
+ @input=${args.onInput}
195
196
  .formatOptions=${{
196
197
  signDisplay: "exceptZero",
197
198
  minimumFractionDigits: 1,
package/stories/number-field.stories.js.map CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["number-field.stories.ts"],
4
- "sourcesContent": ["/*\nCopyright 2020 Adobe. All rights reserved.\nThis file is licensed to you under the Apache License, Version 2.0 (the \"License\");\nyou may not use this file except in compliance with the License. You may obtain a copy\nof the License at http://www.apache.org/licenses/LICENSE-2.0\n\nUnless required by applicable law or agreed to in writing, software distributed under\nthe License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\nOF ANY KIND, either express or implied. See the License for the specific language\ngoverning permissions and limitations under the License.\n*/\n\nimport { html, TemplateResult } from '@spectrum-web-components/base';\nimport { ifDefined } from '@spectrum-web-components/base/src/directives.js';\n\nimport '@spectrum-web-components/number-field/sp-number-field.js';\nimport '@spectrum-web-components/field-label/sp-field-label.js';\nimport { spreadProps } from '../../../test/lit-helpers.js';\nimport { NumberField } from '@spectrum-web-components/number-field/src/NumberField.js';\n\nexport default {\n title: 'Number Field',\n component: 'sp-number-field',\n args: {\n disabled: false,\n readonly: false,\n quiet: false,\n value: undefined,\n placeholder: '',\n min: undefined,\n max: undefined,\n step: undefined,\n },\n argTypes: {\n disabled: {\n name: 'disabled',\n type: { name: 'boolean', required: false },\n description:\n 'Disable this control. It will not receive focus or events.',\n table: {\n type: { summary: 'boolean' },\n defaultValue: { summary: false },\n },\n control: {\n type: 'boolean',\n },\n },\n indeterminate: {\n name: 'indeterminate',\n type: { name: 'boolean', required: false },\n description:\n 'Whether the value of the Number Field can be determined for display.',\n table: {\n type: { summary: 'boolean' },\n defaultValue: { summary: false },\n },\n control: {\n type: 'boolean',\n },\n },\n readonly: {\n name: 'readonly',\n type: { name: 'boolean', required: false },\n description:\n 'When this control is read only, you will not be able to input an updated value.',\n table: {\n type: { summary: 'boolean' },\n defaultValue: { summary: false },\n },\n control: {\n type: 'boolean',\n },\n },\n quiet: {\n name: 'quiet',\n type: { name: 'boolean', required: false },\n description:\n 'An altered delivery with no background and only a bottom border.',\n table: {\n type: { summary: 'boolean' },\n defaultValue: { summary: false },\n },\n control: {\n type: 'boolean',\n },\n },\n hideStepper: {\n name: 'hide stepper',\n type: { name: 'boolean', required: false },\n description: 'Whether to remove the stepper UI from the control.',\n table: {\n type: { summary: 'boolean' },\n defaultValue: { summary: false },\n },\n control: {\n type: 'boolean',\n },\n },\n value: {\n name: 'value',\n type: { name: 'number', required: false },\n description: 'Value to apply to the control.',\n table: {\n type: { summary: 'string' },\n defaultValue: { summary: undefined },\n },\n control: {\n type: 'number',\n },\n },\n step: {\n name: 'step',\n type: { name: 'number', required: false },\n description:\n 'Amount to change the value by when using the stepper or arrow key interactions.',\n table: {\n type: { summary: 'string' },\n defaultValue: { summary: undefined },\n },\n control: {\n type: 'number',\n },\n },\n stepModifier: {\n name: 'step modifier',\n type: { name: 'number', required: false },\n description:\n 'Amount to scale the step increment/decrement when holding the shift key',\n table: {\n type: { summary: 'number' },\n defaultValue: { summary: 10 },\n },\n control: {\n type: 'number',\n },\n },\n placeholder: {\n name: 'placeholder',\n type: { name: 'string', required: false },\n description: 'Placeholder to apply to the control.',\n table: {\n type: { summary: 'string' },\n },\n control: {\n type: 'text',\n },\n },\n min: {\n name: 'min',\n type: { name: 'number', required: false },\n description: 'The minimum value the control can be set to.',\n table: {\n type: { summary: 'number' },\n defaultValue: { summary: undefined },\n },\n control: {\n type: 'number',\n },\n },\n max: {\n name: 'max',\n type: { name: 'numer', required: false },\n description: 'The maximum value the control can be set to.',\n table: {\n type: { summary: 'number' },\n defaultValue: { summary: undefined },\n },\n control: {\n type: 'number',\n },\n },\n },\n};\n\ninterface StoryArgs {\n disabled?: boolean;\n indeterminate?: boolean;\n invalid?: boolean;\n value?: number;\n placeholder?: string;\n max?: number;\n min?: number;\n hideStepper?: boolean;\n readonly?: boolean;\n step?: number;\n onChange?: (value: number) => void;\n onInput?: (value: number) => void;\n [prop: string]: unknown;\n}\n\nexport const Default = (args: StoryArgs = {}): TemplateResult => {\n const onChange =\n (args.onChange as (value: number) => void) ||\n (() => {\n return;\n });\n const onInput =\n (args.onInput as (value: number) => void) ||\n (() => {\n return;\n });\n return html`\n <sp-field-label for=\"default\">Enter a number</sp-field-label>\n <sp-number-field\n id=\"default\"\n ...=${spreadProps(args)}\n @input=${(event: Event) =>\n onInput((event.target as NumberField).value)}\n @change=${(event: Event) =>\n onChange((event.target as NumberField).value)}\n style=${ifDefined(args.quiet ? undefined : 'width: 150px')}\n ></sp-number-field>\n `;\n};\n\nDefault.args = {\n value: 100,\n};\n\nexport const quiet = (args: StoryArgs = {}): TemplateResult => Default(args);\n\nquiet.args = {\n quiet: true,\n value: 100,\n};\n\nexport const indeterminate = (args: StoryArgs = {}): TemplateResult =>\n Default(args);\n\nindeterminate.args = {\n value: 100,\n indeterminate: true,\n};\n\nexport const decimals = (args: StoryArgs): TemplateResult => {\n return html`\n <sp-field-label for=\"decimals\">\n Enter a number with visible decimals\n </sp-field-label>\n <sp-number-field\n id=\"decimals\"\n style=\"width: 200px\"\n ...=${spreadProps(args)}\n @change=${args.onChange}\n .formatOptions=${{\n signDisplay: 'exceptZero',\n minimumFractionDigits: 1,\n maximumFractionDigits: 2,\n } as unknown as Intl.NumberFormatOptions}\n ></sp-number-field>\n `;\n};\n\ndecimals.args = {\n value: 19.274,\n};\n\nexport const germanDecimals = (args: StoryArgs): TemplateResult => {\n return html`\n <sp-field-label for=\"decimals\">\n Enter a number with visible decimals\n </sp-field-label>\n <sp-theme lang=\"de\">\n <sp-number-field\n id=\"decimals\"\n style=\"width: 200px\"\n ...=${spreadProps(args)}\n @change=${args.onChange}\n .formatOptions=${{\n signDisplay: 'exceptZero',\n minimumFractionDigits: 1,\n maximumFractionDigits: 2,\n } as unknown as Intl.NumberFormatOptions}\n ></sp-number-field>\n </sp-theme>\n `;\n};\n\ngermanDecimals.args = {\n value: 19.274,\n};\n\nexport const percents = (args: StoryArgs = {}): TemplateResult => {\n return html`\n <sp-field-label for=\"percents\">Enter a percentage</sp-field-label>\n <sp-number-field\n id=\"percents\"\n style=\"width: 200px\"\n ...=${spreadProps(args)}\n @change=${args.onChange}\n .formatOptions=${{\n style: 'percent',\n unitDisplay: 'narrow',\n } as unknown as Intl.NumberFormatOptions}\n ></sp-number-field>\n `;\n};\n\npercents.args = {\n value: 0.372,\n};\n\nexport const currency = (args: StoryArgs = {}): TemplateResult => {\n return html`\n <sp-field-label for=\"currency\">Enter a value in Euros</sp-field-label>\n <sp-number-field\n style=\"width: 200px\"\n ...=${spreadProps(args)}\n @change=${args.onChange}\n .formatOptions=${{\n style: 'currency',\n currency: 'EUR',\n currencyDisplay: 'code',\n currencySign: 'accounting',\n } as unknown as Intl.NumberFormatOptions}\n ></sp-number-field>\n `;\n};\n\ncurrency.args = {\n value: 23.19,\n};\n\nexport const units = (args: StoryArgs): TemplateResult => {\n return html`\n <sp-field-label for=\"units\">Enter a lengths in inches</sp-field-label>\n <sp-number-field\n id=\"units\"\n style=\"width: 200px\"\n ...=${spreadProps(args)}\n @change=${args.onChange}\n .formatOptions=${{\n style: 'unit',\n unit: 'inch',\n unitDisplay: 'long',\n } as unknown as Intl.NumberFormatOptions}\n ></sp-number-field>\n `;\n};\n\nunits.args = {\n value: 24,\n};\n\nexport const pixels = (args: StoryArgs): TemplateResult => {\n return html`\n <sp-field-label for=\"units\">Enter a lengths in pixels</sp-field-label>\n <sp-number-field\n id=\"units\"\n style=\"width: 200px\"\n .formatOptions=${{\n style: 'unit',\n unit: 'px',\n }}\n ...=${spreadProps(args)}\n @change=${args.onChange}\n ></sp-number-field>\n `;\n};\n\npixels.args = {\n value: 800,\n};\n\nexport const minMax = (args: StoryArgs): TemplateResult => html`\n <sp-field-label for=\"min-max\">\n Enter a value between 0 and 255\n </sp-field-label>\n <sp-number-field\n id=\"min-max\"\n style=\"width: 200px\"\n ...=${spreadProps(args)}\n @change=${args.onChange}\n ></sp-number-field>\n`;\n\nminMax.args = {\n value: 4,\n min: 0,\n max: 255,\n};\n\nexport const hideStepper = (args: StoryArgs): TemplateResult => {\n return html`\n <sp-field-label for=\"hideStepper\">\n Enter a number without the stepper UI\n </sp-field-label>\n <sp-number-field\n id=\"hideStepper\"\n ...=${spreadProps(args)}\n @change=${args.onChange}\n ></sp-number-field>\n `;\n};\nhideStepper.args = {\n hideStepper: true,\n value: 67,\n};\n\nexport const hideStepperQuiet = (args: StoryArgs): TemplateResult => {\n return html`\n <sp-field-label for=\"hideStepper\">\n Enter a number without the stepper UI\n </sp-field-label>\n <sp-number-field\n id=\"hideStepper\"\n ...=${spreadProps(args)}\n @change=${args.onChange}\n ></sp-number-field>\n `;\n};\nhideStepperQuiet.args = {\n hideStepper: true,\n value: 67,\n quiet: true,\n};\n\nexport const disabled = (args: StoryArgs): TemplateResult => {\n return html`\n <sp-field-label for=\"disabled\">\n This Number Field is disabled\n </sp-field-label>\n <sp-number-field\n id=\"disabled\"\n ...=${spreadProps(args)}\n @change=${args.onChange}\n ></sp-number-field>\n `;\n};\ndisabled.args = {\n disabled: true,\n value: 892,\n};\n\nexport const readOnly = (args: StoryArgs): TemplateResult => {\n return html`\n <sp-field-label for=\"readonly\">\n You can only read the following value\n </sp-field-label>\n <sp-number-field\n id=\"readonly\"\n ...=${spreadProps(args)}\n @change=${args.onChange}\n ></sp-number-field>\n `;\n};\nreadOnly.args = {\n readonly: true,\n value: '15',\n};\n\nexport const ScrollingContainer = (args: StoryArgs = {}): TemplateResult => {\n const onChange =\n (args.onChange as (value: number) => void) ||\n (() => {\n return;\n });\n const onInput =\n (args.onInput as (value: number) => void) ||\n (() => {\n return;\n });\n return html`\n <style>\n .scroller {\n height: 140px;\n width: 200px;\n overflow-y: scroll;\n padding: 10px;\n background: var(--spectrum-global-color-gray-50);\n }\n\n .scroller > div {\n height: 1000px;\n }\n </style>\n <div class=\"scroller\">\n <div>\n <sp-field-label for=\"default\">Enter a number</sp-field-label>\n <sp-number-field\n id=\"default\"\n ...=${spreadProps(args)}\n @input=${(event: Event) =>\n onInput((event.target as NumberField).value)}\n @change=${(event: Event) =>\n onChange((event.target as NumberField).value)}\n style=\"width: 150px\"\n ></sp-number-field>\n <p>\n This box should not scroll when the focus is inside the\n number field and field value is changed by using the mouse\n wheel.\n </p>\n </div>\n </div>\n `;\n};\n"],
5
- "mappings": "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",
4
+ "sourcesContent": ["/*\nCopyright 2020 Adobe. All rights reserved.\nThis file is licensed to you under the Apache License, Version 2.0 (the \"License\");\nyou may not use this file except in compliance with the License. You may obtain a copy\nof the License at http://www.apache.org/licenses/LICENSE-2.0\n\nUnless required by applicable law or agreed to in writing, software distributed under\nthe License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\nOF ANY KIND, either express or implied. See the License for the specific language\ngoverning permissions and limitations under the License.\n*/\n\nimport { html, TemplateResult } from '@spectrum-web-components/base';\nimport { ifDefined } from '@spectrum-web-components/base/src/directives.js';\n\nimport '@spectrum-web-components/number-field/sp-number-field.js';\nimport '@spectrum-web-components/field-label/sp-field-label.js';\nimport { spreadProps } from '../../../test/lit-helpers.js';\nimport { NumberField } from '@spectrum-web-components/number-field/src/NumberField.js';\n\nexport default {\n title: 'Number Field',\n component: 'sp-number-field',\n args: {\n disabled: false,\n readonly: false,\n quiet: false,\n value: undefined,\n placeholder: '',\n min: undefined,\n max: undefined,\n step: undefined,\n },\n argTypes: {\n disabled: {\n name: 'disabled',\n type: { name: 'boolean', required: false },\n description:\n 'Disable this control. It will not receive focus or events.',\n table: {\n type: { summary: 'boolean' },\n defaultValue: { summary: false },\n },\n control: {\n type: 'boolean',\n },\n },\n indeterminate: {\n name: 'indeterminate',\n type: { name: 'boolean', required: false },\n description:\n 'Whether the value of the Number Field can be determined for display.',\n table: {\n type: { summary: 'boolean' },\n defaultValue: { summary: false },\n },\n control: {\n type: 'boolean',\n },\n },\n readonly: {\n name: 'readonly',\n type: { name: 'boolean', required: false },\n description:\n 'When this control is read only, you will not be able to input an updated value.',\n table: {\n type: { summary: 'boolean' },\n defaultValue: { summary: false },\n },\n control: {\n type: 'boolean',\n },\n },\n quiet: {\n name: 'quiet',\n type: { name: 'boolean', required: false },\n description:\n 'An altered delivery with no background and only a bottom border.',\n table: {\n type: { summary: 'boolean' },\n defaultValue: { summary: false },\n },\n control: {\n type: 'boolean',\n },\n },\n hideStepper: {\n name: 'hide stepper',\n type: { name: 'boolean', required: false },\n description: 'Whether to remove the stepper UI from the control.',\n table: {\n type: { summary: 'boolean' },\n defaultValue: { summary: false },\n },\n control: {\n type: 'boolean',\n },\n },\n value: {\n name: 'value',\n type: { name: 'number', required: false },\n description: 'Value to apply to the control.',\n table: {\n type: { summary: 'string' },\n defaultValue: { summary: undefined },\n },\n control: {\n type: 'number',\n },\n },\n step: {\n name: 'step',\n type: { name: 'number', required: false },\n description:\n 'Amount to change the value by when using the stepper or arrow key interactions.',\n table: {\n type: { summary: 'string' },\n defaultValue: { summary: undefined },\n },\n control: {\n type: 'number',\n },\n },\n stepModifier: {\n name: 'step modifier',\n type: { name: 'number', required: false },\n description:\n 'Amount to scale the step increment/decrement when holding the shift key',\n table: {\n type: { summary: 'number' },\n defaultValue: { summary: 10 },\n },\n control: {\n type: 'number',\n },\n },\n placeholder: {\n name: 'placeholder',\n type: { name: 'string', required: false },\n description: 'Placeholder to apply to the control.',\n table: {\n type: { summary: 'string' },\n },\n control: {\n type: 'text',\n },\n },\n min: {\n name: 'min',\n type: { name: 'number', required: false },\n description: 'The minimum value the control can be set to.',\n table: {\n type: { summary: 'number' },\n defaultValue: { summary: undefined },\n },\n control: {\n type: 'number',\n },\n },\n max: {\n name: 'max',\n type: { name: 'numer', required: false },\n description: 'The maximum value the control can be set to.',\n table: {\n type: { summary: 'number' },\n defaultValue: { summary: undefined },\n },\n control: {\n type: 'number',\n },\n },\n },\n};\n\ninterface StoryArgs {\n disabled?: boolean;\n indeterminate?: boolean;\n invalid?: boolean;\n value?: number;\n placeholder?: string;\n max?: number;\n min?: number;\n hideStepper?: boolean;\n readonly?: boolean;\n step?: number;\n onChange?: (value: number) => void;\n onInput?: (value: number) => void;\n [prop: string]: unknown;\n}\n\nexport const Default = (args: StoryArgs = {}): TemplateResult => {\n const onChange =\n (args.onChange as (value: number) => void) ||\n (() => {\n return;\n });\n const onInput =\n (args.onInput as (value: number) => void) ||\n (() => {\n return;\n });\n return html`\n <sp-field-label for=\"default\">Enter a number</sp-field-label>\n <sp-number-field\n id=\"default\"\n ...=${spreadProps(args)}\n @input=${(event: Event) =>\n onInput((event.target as NumberField).value)}\n @change=${(event: Event) =>\n onChange((event.target as NumberField).value)}\n style=${ifDefined(args.quiet ? undefined : 'width: 150px')}\n ></sp-number-field>\n `;\n};\n\nDefault.args = {\n value: 100,\n};\n\nexport const quiet = (args: StoryArgs = {}): TemplateResult => Default(args);\n\nquiet.args = {\n quiet: true,\n value: 100,\n};\n\nexport const indeterminate = (args: StoryArgs = {}): TemplateResult =>\n Default(args);\n\nindeterminate.args = {\n value: 100,\n indeterminate: true,\n};\n\nexport const decimals = (args: StoryArgs): TemplateResult => {\n return html`\n <sp-field-label for=\"decimals\">\n Enter a number with visible decimals\n </sp-field-label>\n <sp-number-field\n id=\"decimals\"\n style=\"width: 200px\"\n ...=${spreadProps(args)}\n @change=${args.onChange}\n @input=${args.onInput}\n .formatOptions=${{\n signDisplay: 'exceptZero',\n minimumFractionDigits: 1,\n maximumFractionDigits: 2,\n } as unknown as Intl.NumberFormatOptions}\n ></sp-number-field>\n `;\n};\n\ndecimals.args = {\n value: 19.274,\n};\n\nexport const germanDecimals = (args: StoryArgs): TemplateResult => {\n return html`\n <sp-field-label for=\"decimals\">\n Enter a number with visible decimals\n </sp-field-label>\n <sp-theme lang=\"de\">\n <sp-number-field\n id=\"decimals\"\n style=\"width: 200px\"\n ...=${spreadProps(args)}\n @change=${args.onChange}\n .formatOptions=${{\n signDisplay: 'exceptZero',\n minimumFractionDigits: 1,\n maximumFractionDigits: 2,\n } as unknown as Intl.NumberFormatOptions}\n ></sp-number-field>\n </sp-theme>\n `;\n};\n\ngermanDecimals.args = {\n value: 19.274,\n};\n\nexport const percents = (args: StoryArgs = {}): TemplateResult => {\n return html`\n <sp-field-label for=\"percents\">Enter a percentage</sp-field-label>\n <sp-number-field\n id=\"percents\"\n style=\"width: 200px\"\n ...=${spreadProps(args)}\n @change=${args.onChange}\n .formatOptions=${{\n style: 'percent',\n unitDisplay: 'narrow',\n } as unknown as Intl.NumberFormatOptions}\n ></sp-number-field>\n `;\n};\n\npercents.args = {\n value: 0.372,\n};\n\nexport const currency = (args: StoryArgs = {}): TemplateResult => {\n return html`\n <sp-field-label for=\"currency\">Enter a value in Euros</sp-field-label>\n <sp-number-field\n style=\"width: 200px\"\n ...=${spreadProps(args)}\n @change=${args.onChange}\n .formatOptions=${{\n style: 'currency',\n currency: 'EUR',\n currencyDisplay: 'code',\n currencySign: 'accounting',\n } as unknown as Intl.NumberFormatOptions}\n ></sp-number-field>\n `;\n};\n\ncurrency.args = {\n value: 23.19,\n};\n\nexport const units = (args: StoryArgs): TemplateResult => {\n return html`\n <sp-field-label for=\"units\">Enter a lengths in inches</sp-field-label>\n <sp-number-field\n id=\"units\"\n style=\"width: 200px\"\n ...=${spreadProps(args)}\n @change=${args.onChange}\n .formatOptions=${{\n style: 'unit',\n unit: 'inch',\n unitDisplay: 'long',\n } as unknown as Intl.NumberFormatOptions}\n ></sp-number-field>\n `;\n};\n\nunits.args = {\n value: 24,\n};\n\nexport const pixels = (args: StoryArgs): TemplateResult => {\n return html`\n <sp-field-label for=\"units\">Enter a lengths in pixels</sp-field-label>\n <sp-number-field\n id=\"units\"\n style=\"width: 200px\"\n .formatOptions=${{\n style: 'unit',\n unit: 'px',\n }}\n ...=${spreadProps(args)}\n @change=${args.onChange}\n ></sp-number-field>\n `;\n};\n\npixels.args = {\n value: 800,\n};\n\nexport const minMax = (args: StoryArgs): TemplateResult => html`\n <sp-field-label for=\"min-max\">\n Enter a value between 0 and 255\n </sp-field-label>\n <sp-number-field\n id=\"min-max\"\n style=\"width: 200px\"\n ...=${spreadProps(args)}\n @change=${args.onChange}\n ></sp-number-field>\n`;\n\nminMax.args = {\n value: 4,\n min: 0,\n max: 255,\n};\n\nexport const hideStepper = (args: StoryArgs): TemplateResult => {\n return html`\n <sp-field-label for=\"hideStepper\">\n Enter a number without the stepper UI\n </sp-field-label>\n <sp-number-field\n id=\"hideStepper\"\n ...=${spreadProps(args)}\n @change=${args.onChange}\n ></sp-number-field>\n `;\n};\nhideStepper.args = {\n hideStepper: true,\n value: 67,\n};\n\nexport const hideStepperQuiet = (args: StoryArgs): TemplateResult => {\n return html`\n <sp-field-label for=\"hideStepper\">\n Enter a number without the stepper UI\n </sp-field-label>\n <sp-number-field\n id=\"hideStepper\"\n ...=${spreadProps(args)}\n @change=${args.onChange}\n ></sp-number-field>\n `;\n};\nhideStepperQuiet.args = {\n hideStepper: true,\n value: 67,\n quiet: true,\n};\n\nexport const disabled = (args: StoryArgs): TemplateResult => {\n return html`\n <sp-field-label for=\"disabled\">\n This Number Field is disabled\n </sp-field-label>\n <sp-number-field\n id=\"disabled\"\n ...=${spreadProps(args)}\n @change=${args.onChange}\n ></sp-number-field>\n `;\n};\ndisabled.args = {\n disabled: true,\n value: 892,\n};\n\nexport const readOnly = (args: StoryArgs): TemplateResult => {\n return html`\n <sp-field-label for=\"readonly\">\n You can only read the following value\n </sp-field-label>\n <sp-number-field\n id=\"readonly\"\n ...=${spreadProps(args)}\n @change=${args.onChange}\n ></sp-number-field>\n `;\n};\nreadOnly.args = {\n readonly: true,\n value: '15',\n};\n\nexport const ScrollingContainer = (args: StoryArgs = {}): TemplateResult => {\n const onChange =\n (args.onChange as (value: number) => void) ||\n (() => {\n return;\n });\n const onInput =\n (args.onInput as (value: number) => void) ||\n (() => {\n return;\n });\n return html`\n <style>\n .scroller {\n height: 140px;\n width: 200px;\n overflow-y: scroll;\n padding: 10px;\n background: var(--spectrum-global-color-gray-50);\n }\n\n .scroller > div {\n height: 1000px;\n }\n </style>\n <div class=\"scroller\">\n <div>\n <sp-field-label for=\"default\">Enter a number</sp-field-label>\n <sp-number-field\n id=\"default\"\n ...=${spreadProps(args)}\n @input=${(event: Event) =>\n onInput((event.target as NumberField).value)}\n @change=${(event: Event) =>\n onChange((event.target as NumberField).value)}\n style=\"width: 150px\"\n ></sp-number-field>\n <p>\n This box should not scroll when the focus is inside the\n number field and field value is changed by using the mouse\n wheel.\n </p>\n </div>\n </div>\n `;\n};\n"],
5
+ "mappings": "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",
6
6
  "names": []
7
7
  }