npm - @spectrum-web-components/slider - Versions diffs - 0.12.13 → 0.12.14 - Mend

@spectrum-web-components/slider 0.12.13 → 0.12.14

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 (12) hide show

package/README.md +16 -0
package/custom-elements.json +40 -0
package/package.json +7 -7
package/src/HandleController.js +4 -2
package/src/HandleController.js.map +1 -1
package/src/Slider.d.ts +8 -0
package/src/Slider.js +17 -0
package/src/Slider.js.map +1 -1
package/stories/slider.stories.js +35 -0
package/stories/slider.stories.js.map +1 -1
package/test/slider-editable.test.js +16 -1
package/test/slider-editable.test.js.map +1 -1

package/README.md CHANGED Viewed

@@ -119,6 +119,22 @@ An `<sp-slider>` element can be paired with an `<sp-number-field>` element via t
 ></sp-slider>
 ```
+#### Quiet
+```html
+<sp-slider quiet editable></sp-slider>
+<sp-slider quiet disabled editable></sp-slider>
+```
+#### Indeterminate
+The indeterminate attribute will be passed to the internal `<sp-number-field>` element and alter its visual delivery until a change has been made to the `<sp-slider>` element at which point the `change` event that is dispatched can be understood as always removing the indeterminate attribute from the `<sp-slider>`.
+```html
+<sp-slider indeterminate editable></sp-slider>
+<sp-slider indeterminate disabled editable></sp-slider>
+```
 ## Advanced normalization
 By default, `sp-slider` assumes a linear scale between the `min` and `max` values.

package/custom-elements.json CHANGED Viewed

@@ -838,6 +838,28 @@
               "attribute": "disabled",
               "reflects": true
             },
+            {
+              "kind": "field",
+              "name": "quiet",
+              "type": {
+                "text": "boolean"
+              },
+              "privacy": "public",
+              "default": "false",
+              "description": "Applies `quiet` to the underlying `sp-number-field` when `editable === true`.",
+              "attribute": "quiet"
+            },
+            {
+              "kind": "field",
+              "name": "indeterminate",
+              "type": {
+                "text": "boolean"
+              },
+              "privacy": "public",
+              "default": "false",
+              "description": "Applies `indeterminate` to the underlying `sp-number-field` when `editable === true`. Is removed on the next `change` event.",
+              "attribute": "indeterminate"
+            },
             {
               "kind": "field",
               "name": "labelEl",
@@ -1384,6 +1406,24 @@
               "default": "false",
               "fieldName": "disabled"
             },
+            {
+              "name": "quiet",
+              "type": {
+                "text": "boolean"
+              },
+              "default": "false",
+              "description": "Applies `quiet` to the underlying `sp-number-field` when `editable === true`.",
+              "fieldName": "quiet"
+            },
+            {
+              "name": "indeterminate",
+              "type": {
+                "text": "boolean"
+              },
+              "default": "false",
+              "description": "Applies `indeterminate` to the underlying `sp-number-field` when `editable === true`. Is removed on the next `change` event.",
+              "fieldName": "indeterminate"
+            },
             {
               "name": "value",
               "type": {

package/package.json CHANGED Viewed

@@ -1,6 +1,6 @@
 {
     "name": "@spectrum-web-components/slider",
-    "version": "0.12.13",
+    "version": "0.12.14",
     "publishConfig": {
         "access": "public"
     },
@@ -51,14 +51,14 @@
         "@internationalized/number": "^3.1.0",
         "@lit-labs/observers": "^1.0.1",
         "@spectrum-web-components/base": "^0.5.8",
-        "@spectrum-web-components/field-label": "^0.7.12",
-        "@spectrum-web-components/number-field": "^0.3.13",
-        "@spectrum-web-components/shared": "^0.14.3",
-        "@spectrum-web-components/theme": "^0.11.3",
+        "@spectrum-web-components/field-label": "^0.7.13",
+        "@spectrum-web-components/number-field": "^0.4.0",
+        "@spectrum-web-components/shared": "^0.14.4",
+        "@spectrum-web-components/theme": "^0.12.0",
         "tslib": "^2.0.0"
     },
     "devDependencies": {
-        "@spectrum-css/slider": "^3.1.5"
+        "@spectrum-css/slider": "^3.1.7"
     },
     "types": "./src/index.d.ts",
     "customElements": "custom-elements.json",
@@ -66,5 +66,5 @@
         "./sp-*.js",
         "./sync/sp-*.js"
     ],
-    "gitHead": "e5cd4a0db2201b8126eb9133ac3c24172d086359"
+    "gitHead": "3be62133721efba844cd7032566a2c49ed6d9875"
 }

package/src/HandleController.js CHANGED Viewed

@@ -111,7 +111,9 @@ export class HandleController {
         throw new Error(`No input for handle "${handle.name}"`);
     }
     requestUpdate() {
-        this.host.requestUpdate();
+        if (this.host.hasUpdated) {
+            this.host.requestUpdate();
+        }
     }
     /**
      * It is possible for value attributes to be set programmatically. The <input>
@@ -133,7 +135,6 @@ export class HandleController {
         }
         else {
             input.valueAsNumber = handle.value;
-            handle.value = input.valueAsNumber;
             this.requestUpdate();
         }
         handle.value = input.valueAsNumber;
@@ -306,6 +307,7 @@ export class HandleController {
         event.stopPropagation();
         input.value = this.calculateHandlePosition(event, model).toString();
         model.handle.value = parseFloat(input.value);
+        this.host.indeterminate = false;
         this.requestUpdate();
     }
     cancelDrag(model) {

package/src/HandleController.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"HandleController.js","sourceRoot":"","sources":["HandleController.ts"],"names":[],"mappings":"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","sourcesContent":["/\nCopyright 2021 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/\nimport { html, TemplateResult } from '@spectrum-web-components/base';\nimport {\n classMap,\n ifDefined,\n styleMap,\n} from '@spectrum-web-components/base/src/directives.js';\nimport { MutationController } from '@lit-labs/observers/mutation_controller.js';\nimport { Slider } from './Slider.js';\nimport {\n Controller,\n SliderHandle,\n SliderNormalization,\n} from './SliderHandle.js';\n\ninterface HandleReference {\n handle: HTMLElement;\n input: HTMLInputElement;\n}\n\ninterface HandleComponents extends HandleReference {\n model: SliderHandle;\n}\n\ninterface RangeAndClamp {\n range: { min: number; max: number };\n clamp: { min: number; max: number };\n}\ninterface ModelValue extends RangeAndClamp {\n name: string;\n value: number;\n normalizedValue: number;\n step: number;\n highlight: boolean;\n ariaLabel?: string;\n normalization: SliderNormalization;\n handle: SliderHandle;\n}\n\ninterface InputWithModel extends HTMLInputElement {\n model: ModelValue;\n}\n\ninterface DataFromPointerEvent {\n resolvedInput: boolean;\n input: InputWithModel;\n model?: ModelValue;\n}\n\nexport interface HandleValueDictionary {\n [key: string]: number;\n}\n\nexport class HandleController implements Controller {\n private host!: Slider;\n private handles: Map<string, SliderHandle> = new Map();\n private model: ModelValue[] = [];\n private handleOrder: string[] = [];\n private draggingHandle?: SliderHandle;\n private handleRefMap?: WeakMap<SliderHandle, HandleReference>;\n\n constructor(host: Slider) {\n this.host = host;\n\n new MutationController(this.host, {\n config: {\n subtree: true,\n childList: true,\n },\n callback: () => {\n this.extractModelFromLightDom();\n },\n });\n\n this.extractModelFromLightDom();\n }\n\n public get values(): HandleValueDictionary {\n const result: HandleValueDictionary = {};\n for (const model of this.handles.values()) {\n result[model.handleName] = model.value;\n }\n return result;\n }\n\n public get size(): number {\n return this.handles.size;\n }\n\n public inputForHandle(handle: SliderHandle): HTMLInputElement \| undefined {\n if (this.handles.has(handle.handleName)) {\n const { input } = this.getHandleElements(handle);\n return input;\n }\n /* c8 ignore next 2 /\n throw new Error(`No input for handle \"${handle.name}\"`);\n }\n\n public requestUpdate(): void {\n this.host.requestUpdate();\n }\n\n /\n It is possible for value attributes to be set programmatically. The <input>\n * for a particular slider needs to have an opportunity to validate any such\n * values\n \n @param handle Handle who's value needs validation\n /\n public setValueFromHandle(handle: SliderHandle): void {\n const elements = this.getHandleElements(handle);\n / c8 ignore next /\n if (!elements) return;\n\n const { input } = elements;\n if (input.valueAsNumber === handle.value) {\n if (handle.dragging) {\n handle.dispatchInputEvent();\n }\n } else {\n input.valueAsNumber = handle.value;\n handle.value = input.valueAsNumber;\n this.requestUpdate();\n }\n handle.value = input.valueAsNumber;\n }\n\n public handleHasChanged(handle: SliderHandle): void {\n if (handle !== this.host) {\n this.requestUpdate();\n }\n }\n\n public formattedValueForHandle(model: ModelValue): string {\n const { handle } = model;\n const numberFormat = handle.numberFormat ?? this.host.numberFormat;\n return handle.getAriaHandleText(model.value, numberFormat);\n }\n\n public get formattedValues(): Map<string, string> {\n const result = new Map<string, string>();\n for (const model of this.model) {\n result.set(model.name, this.formattedValueForHandle(model));\n }\n return result;\n }\n\n public get focusElement(): HTMLElement {\n const { input } = this.getActiveHandleElements();\n if (\n this.host.editable &&\n !(input as InputWithModel).model.handle.dragging\n ) {\n return this.host.numberField;\n }\n return input;\n }\n\n protected handleOrientation = (): void => {\n this.updateBoundingRect();\n };\n\n public hostConnected(): void {\n if ('orientation' in screen) {\n screen.orientation.addEventListener(\n 'change',\n this.handleOrientation\n );\n } else {\n window.addEventListener(\n 'orientationchange',\n this.handleOrientation\n );\n }\n }\n\n public hostDisconnected(): void {\n if ('orientation' in screen) {\n screen.orientation.removeEventListener(\n 'change',\n this.handleOrientation\n );\n } else {\n window.removeEventListener(\n 'orientationchange',\n this.handleOrientation\n );\n }\n }\n\n public hostUpdate(): void {\n this.updateModel();\n }\n\n // Since extractModelFromLightDom bails on the first un-upgraded handle,\n // a maximum of one listener will be set up per extraction attempt.\n private waitForUpgrade(handle: HTMLElement): boolean {\n if (handle instanceof SliderHandle) {\n return false;\n }\n handle.addEventListener(\n 'sp-slider-handle-ready',\n () => this.extractModelFromLightDom(),\n { once: true, passive: true }\n );\n return true;\n }\n\n private extractModelFromLightDom = (): void => {\n let handles = [\n ...this.host.querySelectorAll('[slot=\"handle\"]'),\n ] as SliderHandle[];\n if (handles.length === 0) {\n handles = [this.host as SliderHandle];\n }\n // extractModelFromLightDom depends on slotted handles already having been upgraded\n if (handles.some((h) => this.waitForUpgrade(h))) {\n return;\n }\n this.handles = new Map();\n this.handleOrder = [];\n handles.forEach((handle, index) => {\n / c8 ignore next /\n if (!handle.handleName?.length) {\n handle.name = `handle${index + 1}`;\n }\n this.handles.set(handle.handleName, handle);\n this.handleOrder.push(handle.handleName);\n handle.handleController = this;\n });\n this.requestUpdate();\n };\n\n public get activeHandle(): string {\n return this.handleOrder[this.handleOrder.length - 1];\n }\n\n public get activeHandleInputId(): string {\n const active = this.activeHandle;\n const index = this.model.findIndex((model) => model.name === active);\n return `input-${index}`;\n }\n\n public activateHandle(name: string): void {\n const index = this.handleOrder.findIndex((item) => item === name);\n if (index >= 0) {\n this.handleOrder.splice(index, 1);\n }\n this.handleOrder.push(name);\n }\n\n private getActiveHandleElements(): HandleComponents {\n const name = this.activeHandle;\n const handleSlider = this.handles.get(name) as SliderHandle;\n const elements = this.getHandleElements(\n handleSlider\n ) as HandleReference;\n return { model: handleSlider, ...elements };\n }\n\n private getHandleElements(sliderHandle: SliderHandle): HandleReference {\n if (!this.handleRefMap) {\n this.handleRefMap = new WeakMap();\n\n const inputNodes =\n this.host.shadowRoot.querySelectorAll('.handle > input');\n for (const inputNode of inputNodes) {\n const input = inputNode as HTMLInputElement;\n const handle = input.parentElement as HTMLElement;\n const model = this.handles.get(\n handle.getAttribute('name') as string\n );\n if (model) {\n this.handleRefMap.set(model, { input, handle });\n }\n }\n }\n\n const components = this.handleRefMap.get(\n sliderHandle\n ) as HandleReference;\n return components;\n }\n\n private clearHandleComponentCache(): void {\n delete this.handleRefMap;\n }\n\n private _boundingClientRect?: DOMRect;\n\n private get boundingClientRect(): DOMRect {\n if (!this._boundingClientRect) {\n this._boundingClientRect = this.host.track.getBoundingClientRect();\n }\n return this._boundingClientRect;\n }\n\n private updateBoundingRect(): void {\n delete this._boundingClientRect;\n }\n\n /\n Return the `input` and `model` associated with the event and\n * whether the `input` is a `resolvedInput` meaning it was acquired\n * from the `model` rather than the event.\n /\n protected extractDataFromEvent(event: PointerEvent): DataFromPointerEvent {\n if (!this._activePointerEventData) {\n let input = (event.target as Element).querySelector(\n ':scope > .input'\n ) as InputWithModel;\n const resolvedInput = !input;\n const model = input\n ? input.model\n : this.model.find((item) => item.name === this.activeHandle);\n if (!input && !!model) {\n input = model.handle.focusElement as InputWithModel;\n }\n this._activePointerEventData = {\n input,\n model,\n resolvedInput,\n };\n }\n return this._activePointerEventData;\n }\n\n private _activePointerEventData!: DataFromPointerEvent \| undefined;\n\n public handlePointerdown(event: PointerEvent): void {\n const { resolvedInput, model } = this.extractDataFromEvent(event);\n if (!model \|\| this.host.disabled \|\| event.button !== 0) {\n event.preventDefault();\n return;\n }\n this.host.track.setPointerCapture(event.pointerId);\n this.updateBoundingRect();\n this.host.labelEl.click();\n this.draggingHandle = model.handle;\n model.handle.dragging = true;\n this.activateHandle(model.name);\n if (resolvedInput) {\n // When the input is resolved forward the pointer event to\n // `handlePointermove` in order to update the value/UI becuase\n // the pointer event was on the track not a handle\n this.handlePointermove(event);\n }\n this.requestUpdate();\n }\n\n public handlePointerup(event: PointerEvent): void {\n const { input, model } = this.extractDataFromEvent(event);\n delete this._activePointerEventData;\n if (!model) return;\n this.host.labelEl.click();\n this.cancelDrag(model);\n this.requestUpdate();\n this.host.track.releasePointerCapture(event.pointerId);\n this.dispatchChangeEvent(input, model.handle);\n }\n\n public handlePointermove(event: PointerEvent): void {\n const { input, model } = this.extractDataFromEvent(event);\n if (!model) return;\n / c8 ignore next 3 /\n if (!this.draggingHandle) {\n return;\n }\n event.stopPropagation();\n input.value = this.calculateHandlePosition(event, model).toString();\n model.handle.value = parseFloat(input.value);\n this.requestUpdate();\n }\n\n public cancelDrag(model?: ModelValue): void {\n model =\n model \|\| this.model.find((item) => item.name === this.activeHandle);\n if (!model) return;\n model.handle.highlight = false;\n delete this.draggingHandle;\n model.handle.dragging = false;\n }\n\n /\n Keep the slider value property in sync with the input element's value\n /\n private onInputChange = (event: Event): void => {\n const input = event.target as InputWithModel;\n input.model.handle.value = input.valueAsNumber;\n\n this.requestUpdate();\n this.dispatchChangeEvent(input, input.model.handle);\n };\n\n private onInputFocus = (event: Event): void => {\n const input = event.target as InputWithModel;\n let isFocusVisible;\n try {\n isFocusVisible =\n input.matches(':focus-visible') \|\|\n this.host.matches('.focus-visible');\n / c8 ignore next 3 /\n } catch (error) {\n isFocusVisible = this.host.matches('.focus-visible');\n }\n input.model.handle.highlight = isFocusVisible;\n this.requestUpdate();\n };\n\n private onInputBlur = (event: Event): void => {\n const input = event.target as InputWithModel;\n input.model.handle.highlight = false;\n this.requestUpdate();\n };\n\n private onInputKeydown = (event: Event): void => {\n const input = event.target as InputWithModel;\n input.model.handle.highlight = true;\n this.requestUpdate();\n };\n\n private dispatchChangeEvent(\n input: HTMLInputElement,\n handle: SliderHandle\n ): void {\n input.valueAsNumber = handle.value;\n\n const changeEvent = new Event('change', {\n bubbles: true,\n composed: true,\n });\n\n handle.dispatchEvent(changeEvent);\n }\n\n /\n Returns the value under the cursor\n * @param: PointerEvent on slider\n * @return: Slider value that correlates to the position under the pointer\n /\n private calculateHandlePosition(\n event: PointerEvent \| MouseEvent,\n model: ModelValue\n ): number {\n const rect = this.boundingClientRect;\n const minOffset = rect.left;\n const offset = event.clientX;\n const size = rect.width;\n\n const directionalOffset = this.host.isLTR\n ? offset - minOffset\n : size - (offset - minOffset);\n const normalized = directionalOffset / size;\n\n return model.normalization.fromNormalized(\n normalized,\n model.range.min,\n model.range.max\n );\n }\n\n public renderHandle(\n model: ModelValue,\n index: number,\n zIndex: number,\n isMultiHandle: boolean\n ): TemplateResult {\n const classes = {\n handle: true,\n dragging: this.draggingHandle?.handleName === model.name,\n 'handle-highlight': model.highlight,\n };\n const style = {\n [this.host.isLTR ? 'left' : 'right']: `${\n model.normalizedValue 100\n }%`,\n 'z-index': zIndex.toString(),\n // Allow setting background per-handle\n 'background-color': `var(--spectrum-slider-handle-background-color-${index}, var(--spectrum-slider-handle-default-background-color))`,\n 'border-color': `var(--spectrum-slider-handle-border-color-${index}, var(-spectrum-slider-handle-default-border-color))`,\n };\n const ariaLabelledBy = isMultiHandle ? `label input-${index}` : 'label';\n return html`\n <div\n class=${classMap(classes)}\n name=${model.name}\n style=${styleMap(style)}\n role=\"presentation\"\n >\n <input\n type=\"range\"\n class=\"input\"\n id=\"input-${index}\"\n min=${model.clamp.min}\n max=${model.clamp.max}\n step=${model.step}\n value=${model.value}\n aria-disabled=${ifDefined(\n this.host.disabled ? 'true' : undefined\n )}\n tabindex=${ifDefined(this.host.editable ? -1 : undefined)}\n aria-label=${ifDefined(model.ariaLabel)}\n aria-labelledby=${ariaLabelledBy}\n aria-valuetext=${this.formattedValueForHandle(model)}\n @change=${this.onInputChange}\n @focus=${this.onInputFocus}\n @blur=${this.onInputBlur}\n @keydown=${this.onInputKeydown}\n .model=${model}\n />\n </div>\n `;\n }\n\n public render(): TemplateResult[] {\n this.clearHandleComponentCache();\n return this.model.map((model, index) => {\n const zIndex = this.handleOrder.indexOf(model.name) + 1;\n return this.renderHandle(\n model,\n index,\n zIndex,\n this.model.length > 1\n );\n });\n }\n\n /*\n Returns a list of track segment [start, end] tuples where the values are\n * normalized to be between 0 and 1.\n * @returns A list of track segment tuples [start, end]\n /\n public trackSegments(): [number, number][] {\n const values = this.model.map((model) => model.normalizedValue);\n values.sort((a, b) => a - b);\n\n // The first segment always starts at 0\n values.unshift(0);\n return values.map((value, index, array) => [\n value,\n array[index + 1] ?? 1,\n ]);\n }\n\n private updateModel(): void {\n const handles = [...this.handles.values()];\n\n const getRangeAndClamp = (index: number): RangeAndClamp => {\n const handle = handles[index];\n const previous = handles[index - 1];\n const next = handles[index + 1];\n\n const min =\n typeof handle.min === 'number'\n ? handle.min\n : (this.host.min as number);\n const max =\n typeof handle.max === 'number'\n ? handle.max\n : (this.host.max as number);\n\n const result: RangeAndClamp = {\n range: { min: min, max: max },\n clamp: { min: min, max: max },\n };\n\n if (handle.min === 'previous') {\n if (previous) {\n for (let j = index - 1; j >= 0; j--) {\n const item = handles[j];\n if (typeof item.min === 'number') {\n result.range.min = item.min;\n break;\n }\n }\n result.clamp.min = Math.max(\n previous.value,\n result.range.min\n );\n / c8 ignore next 5 /\n } else {\n console.warn(\n 'First slider handle cannot have attribute min=\"previous\"'\n );\n }\n }\n if (handle.max === 'next') {\n if (next) {\n for (let j = index + 1; j < handles.length; j++) {\n const item = handles[j];\n if (typeof item.max === 'number') {\n result.range.max = item.max;\n break;\n }\n }\n result.clamp.max = Math.min(next.value, result.range.max);\n / c8 ignore next 5 */\n } else {\n console.warn(\n 'Last slider handle cannot have attribute max=\"next\"'\n );\n }\n }\n return result;\n };\n\n const modelValues = handles.map((handle, index) => {\n const rangeAndClamp = getRangeAndClamp(index);\n const { toNormalized } = handle.normalization;\n const clampedValue = Math.max(\n Math.min(handle.value, rangeAndClamp.clamp.max),\n rangeAndClamp.clamp.min\n );\n const normalizedValue = toNormalized(\n clampedValue,\n rangeAndClamp.range.min,\n rangeAndClamp.range.max\n );\n const model = {\n name: handle.handleName,\n value: clampedValue,\n normalizedValue,\n highlight: handle.highlight,\n step: handle.step ?? this.host.step,\n normalization: handle.normalization,\n handle,\n ariaLabel:\n handle !== this.host && handle?.label.length > 0\n ? handle.label\n : undefined,\n ...rangeAndClamp,\n };\n return model;\n });\n\n this.model = modelValues;\n }\n\n public async handleUpdatesComplete(): Promise<void> {\n const updates = [...this.handles.values()]\n .filter((handle) => handle !== this.host)\n .map((handle) => handle.updateComplete);\n await Promise.all(updates);\n }\n}\n"]}
1	+ {"version":3,"file":"HandleController.js","sourceRoot":"","sources":["HandleController.ts"],"names":[],"mappings":"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","sourcesContent":["/\nCopyright 2021 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/\nimport { html, TemplateResult } from '@spectrum-web-components/base';\nimport {\n classMap,\n ifDefined,\n styleMap,\n} from '@spectrum-web-components/base/src/directives.js';\nimport { MutationController } from '@lit-labs/observers/mutation_controller.js';\nimport { Slider } from './Slider.js';\nimport {\n Controller,\n SliderHandle,\n SliderNormalization,\n} from './SliderHandle.js';\n\ninterface HandleReference {\n handle: HTMLElement;\n input: HTMLInputElement;\n}\n\ninterface HandleComponents extends HandleReference {\n model: SliderHandle;\n}\n\ninterface RangeAndClamp {\n range: { min: number; max: number };\n clamp: { min: number; max: number };\n}\ninterface ModelValue extends RangeAndClamp {\n name: string;\n value: number;\n normalizedValue: number;\n step: number;\n highlight: boolean;\n ariaLabel?: string;\n normalization: SliderNormalization;\n handle: SliderHandle;\n}\n\ninterface InputWithModel extends HTMLInputElement {\n model: ModelValue;\n}\n\ninterface DataFromPointerEvent {\n resolvedInput: boolean;\n input: InputWithModel;\n model?: ModelValue;\n}\n\nexport interface HandleValueDictionary {\n [key: string]: number;\n}\n\nexport class HandleController implements Controller {\n private host!: Slider;\n private handles: Map<string, SliderHandle> = new Map();\n private model: ModelValue[] = [];\n private handleOrder: string[] = [];\n private draggingHandle?: SliderHandle;\n private handleRefMap?: WeakMap<SliderHandle, HandleReference>;\n\n constructor(host: Slider) {\n this.host = host;\n\n new MutationController(this.host, {\n config: {\n subtree: true,\n childList: true,\n },\n callback: () => {\n this.extractModelFromLightDom();\n },\n });\n\n this.extractModelFromLightDom();\n }\n\n public get values(): HandleValueDictionary {\n const result: HandleValueDictionary = {};\n for (const model of this.handles.values()) {\n result[model.handleName] = model.value;\n }\n return result;\n }\n\n public get size(): number {\n return this.handles.size;\n }\n\n public inputForHandle(handle: SliderHandle): HTMLInputElement \| undefined {\n if (this.handles.has(handle.handleName)) {\n const { input } = this.getHandleElements(handle);\n return input;\n }\n /* c8 ignore next 2 /\n throw new Error(`No input for handle \"${handle.name}\"`);\n }\n\n public requestUpdate(): void {\n if (this.host.hasUpdated) {\n this.host.requestUpdate();\n }\n }\n\n /\n It is possible for value attributes to be set programmatically. The <input>\n * for a particular slider needs to have an opportunity to validate any such\n * values\n \n @param handle Handle who's value needs validation\n /\n public setValueFromHandle(handle: SliderHandle): void {\n const elements = this.getHandleElements(handle);\n / c8 ignore next /\n if (!elements) return;\n\n const { input } = elements;\n if (input.valueAsNumber === handle.value) {\n if (handle.dragging) {\n handle.dispatchInputEvent();\n }\n } else {\n input.valueAsNumber = handle.value;\n this.requestUpdate();\n }\n handle.value = input.valueAsNumber;\n }\n\n public handleHasChanged(handle: SliderHandle): void {\n if (handle !== this.host) {\n this.requestUpdate();\n }\n }\n\n public formattedValueForHandle(model: ModelValue): string {\n const { handle } = model;\n const numberFormat = handle.numberFormat ?? this.host.numberFormat;\n return handle.getAriaHandleText(model.value, numberFormat);\n }\n\n public get formattedValues(): Map<string, string> {\n const result = new Map<string, string>();\n for (const model of this.model) {\n result.set(model.name, this.formattedValueForHandle(model));\n }\n return result;\n }\n\n public get focusElement(): HTMLElement {\n const { input } = this.getActiveHandleElements();\n if (\n this.host.editable &&\n !(input as InputWithModel).model.handle.dragging\n ) {\n return this.host.numberField;\n }\n return input;\n }\n\n protected handleOrientation = (): void => {\n this.updateBoundingRect();\n };\n\n public hostConnected(): void {\n if ('orientation' in screen) {\n screen.orientation.addEventListener(\n 'change',\n this.handleOrientation\n );\n } else {\n window.addEventListener(\n 'orientationchange',\n this.handleOrientation\n );\n }\n }\n\n public hostDisconnected(): void {\n if ('orientation' in screen) {\n screen.orientation.removeEventListener(\n 'change',\n this.handleOrientation\n );\n } else {\n window.removeEventListener(\n 'orientationchange',\n this.handleOrientation\n );\n }\n }\n\n public hostUpdate(): void {\n this.updateModel();\n }\n\n // Since extractModelFromLightDom bails on the first un-upgraded handle,\n // a maximum of one listener will be set up per extraction attempt.\n private waitForUpgrade(handle: HTMLElement): boolean {\n if (handle instanceof SliderHandle) {\n return false;\n }\n handle.addEventListener(\n 'sp-slider-handle-ready',\n () => this.extractModelFromLightDom(),\n { once: true, passive: true }\n );\n return true;\n }\n\n private extractModelFromLightDom = (): void => {\n let handles = [\n ...this.host.querySelectorAll('[slot=\"handle\"]'),\n ] as SliderHandle[];\n if (handles.length === 0) {\n handles = [this.host as SliderHandle];\n }\n // extractModelFromLightDom depends on slotted handles already having been upgraded\n if (handles.some((h) => this.waitForUpgrade(h))) {\n return;\n }\n this.handles = new Map();\n this.handleOrder = [];\n handles.forEach((handle, index) => {\n / c8 ignore next /\n if (!handle.handleName?.length) {\n handle.name = `handle${index + 1}`;\n }\n this.handles.set(handle.handleName, handle);\n this.handleOrder.push(handle.handleName);\n handle.handleController = this;\n });\n this.requestUpdate();\n };\n\n public get activeHandle(): string {\n return this.handleOrder[this.handleOrder.length - 1];\n }\n\n public get activeHandleInputId(): string {\n const active = this.activeHandle;\n const index = this.model.findIndex((model) => model.name === active);\n return `input-${index}`;\n }\n\n public activateHandle(name: string): void {\n const index = this.handleOrder.findIndex((item) => item === name);\n if (index >= 0) {\n this.handleOrder.splice(index, 1);\n }\n this.handleOrder.push(name);\n }\n\n private getActiveHandleElements(): HandleComponents {\n const name = this.activeHandle;\n const handleSlider = this.handles.get(name) as SliderHandle;\n const elements = this.getHandleElements(\n handleSlider\n ) as HandleReference;\n return { model: handleSlider, ...elements };\n }\n\n private getHandleElements(sliderHandle: SliderHandle): HandleReference {\n if (!this.handleRefMap) {\n this.handleRefMap = new WeakMap();\n\n const inputNodes =\n this.host.shadowRoot.querySelectorAll('.handle > input');\n for (const inputNode of inputNodes) {\n const input = inputNode as HTMLInputElement;\n const handle = input.parentElement as HTMLElement;\n const model = this.handles.get(\n handle.getAttribute('name') as string\n );\n if (model) {\n this.handleRefMap.set(model, { input, handle });\n }\n }\n }\n\n const components = this.handleRefMap.get(\n sliderHandle\n ) as HandleReference;\n return components;\n }\n\n private clearHandleComponentCache(): void {\n delete this.handleRefMap;\n }\n\n private _boundingClientRect?: DOMRect;\n\n private get boundingClientRect(): DOMRect {\n if (!this._boundingClientRect) {\n this._boundingClientRect = this.host.track.getBoundingClientRect();\n }\n return this._boundingClientRect;\n }\n\n private updateBoundingRect(): void {\n delete this._boundingClientRect;\n }\n\n /\n Return the `input` and `model` associated with the event and\n * whether the `input` is a `resolvedInput` meaning it was acquired\n * from the `model` rather than the event.\n /\n protected extractDataFromEvent(event: PointerEvent): DataFromPointerEvent {\n if (!this._activePointerEventData) {\n let input = (event.target as Element).querySelector(\n ':scope > .input'\n ) as InputWithModel;\n const resolvedInput = !input;\n const model = input\n ? input.model\n : this.model.find((item) => item.name === this.activeHandle);\n if (!input && !!model) {\n input = model.handle.focusElement as InputWithModel;\n }\n this._activePointerEventData = {\n input,\n model,\n resolvedInput,\n };\n }\n return this._activePointerEventData;\n }\n\n private _activePointerEventData!: DataFromPointerEvent \| undefined;\n\n public handlePointerdown(event: PointerEvent): void {\n const { resolvedInput, model } = this.extractDataFromEvent(event);\n if (!model \|\| this.host.disabled \|\| event.button !== 0) {\n event.preventDefault();\n return;\n }\n this.host.track.setPointerCapture(event.pointerId);\n this.updateBoundingRect();\n this.host.labelEl.click();\n this.draggingHandle = model.handle;\n model.handle.dragging = true;\n this.activateHandle(model.name);\n if (resolvedInput) {\n // When the input is resolved forward the pointer event to\n // `handlePointermove` in order to update the value/UI becuase\n // the pointer event was on the track not a handle\n this.handlePointermove(event);\n }\n this.requestUpdate();\n }\n\n public handlePointerup(event: PointerEvent): void {\n const { input, model } = this.extractDataFromEvent(event);\n delete this._activePointerEventData;\n if (!model) return;\n this.host.labelEl.click();\n this.cancelDrag(model);\n this.requestUpdate();\n this.host.track.releasePointerCapture(event.pointerId);\n this.dispatchChangeEvent(input, model.handle);\n }\n\n public handlePointermove(event: PointerEvent): void {\n const { input, model } = this.extractDataFromEvent(event);\n if (!model) return;\n / c8 ignore next 3 /\n if (!this.draggingHandle) {\n return;\n }\n event.stopPropagation();\n input.value = this.calculateHandlePosition(event, model).toString();\n model.handle.value = parseFloat(input.value);\n this.host.indeterminate = false;\n this.requestUpdate();\n }\n\n public cancelDrag(model?: ModelValue): void {\n model =\n model \|\| this.model.find((item) => item.name === this.activeHandle);\n if (!model) return;\n model.handle.highlight = false;\n delete this.draggingHandle;\n model.handle.dragging = false;\n }\n\n /\n Keep the slider value property in sync with the input element's value\n /\n private onInputChange = (event: Event): void => {\n const input = event.target as InputWithModel;\n input.model.handle.value = input.valueAsNumber;\n\n this.requestUpdate();\n this.dispatchChangeEvent(input, input.model.handle);\n };\n\n private onInputFocus = (event: Event): void => {\n const input = event.target as InputWithModel;\n let isFocusVisible;\n try {\n isFocusVisible =\n input.matches(':focus-visible') \|\|\n this.host.matches('.focus-visible');\n / c8 ignore next 3 /\n } catch (error) {\n isFocusVisible = this.host.matches('.focus-visible');\n }\n input.model.handle.highlight = isFocusVisible;\n this.requestUpdate();\n };\n\n private onInputBlur = (event: Event): void => {\n const input = event.target as InputWithModel;\n input.model.handle.highlight = false;\n this.requestUpdate();\n };\n\n private onInputKeydown = (event: Event): void => {\n const input = event.target as InputWithModel;\n input.model.handle.highlight = true;\n this.requestUpdate();\n };\n\n private dispatchChangeEvent(\n input: HTMLInputElement,\n handle: SliderHandle\n ): void {\n input.valueAsNumber = handle.value;\n\n const changeEvent = new Event('change', {\n bubbles: true,\n composed: true,\n });\n\n handle.dispatchEvent(changeEvent);\n }\n\n /\n Returns the value under the cursor\n * @param: PointerEvent on slider\n * @return: Slider value that correlates to the position under the pointer\n /\n private calculateHandlePosition(\n event: PointerEvent \| MouseEvent,\n model: ModelValue\n ): number {\n const rect = this.boundingClientRect;\n const minOffset = rect.left;\n const offset = event.clientX;\n const size = rect.width;\n\n const directionalOffset = this.host.isLTR\n ? offset - minOffset\n : size - (offset - minOffset);\n const normalized = directionalOffset / size;\n\n return model.normalization.fromNormalized(\n normalized,\n model.range.min,\n model.range.max\n );\n }\n\n public renderHandle(\n model: ModelValue,\n index: number,\n zIndex: number,\n isMultiHandle: boolean\n ): TemplateResult {\n const classes = {\n handle: true,\n dragging: this.draggingHandle?.handleName === model.name,\n 'handle-highlight': model.highlight,\n };\n const style = {\n [this.host.isLTR ? 'left' : 'right']: `${\n model.normalizedValue 100\n }%`,\n 'z-index': zIndex.toString(),\n // Allow setting background per-handle\n 'background-color': `var(--spectrum-slider-handle-background-color-${index}, var(--spectrum-slider-handle-default-background-color))`,\n 'border-color': `var(--spectrum-slider-handle-border-color-${index}, var(-spectrum-slider-handle-default-border-color))`,\n };\n const ariaLabelledBy = isMultiHandle ? `label input-${index}` : 'label';\n return html`\n <div\n class=${classMap(classes)}\n name=${model.name}\n style=${styleMap(style)}\n role=\"presentation\"\n >\n <input\n type=\"range\"\n class=\"input\"\n id=\"input-${index}\"\n min=${model.clamp.min}\n max=${model.clamp.max}\n step=${model.step}\n value=${model.value}\n aria-disabled=${ifDefined(\n this.host.disabled ? 'true' : undefined\n )}\n tabindex=${ifDefined(this.host.editable ? -1 : undefined)}\n aria-label=${ifDefined(model.ariaLabel)}\n aria-labelledby=${ariaLabelledBy}\n aria-valuetext=${this.formattedValueForHandle(model)}\n @change=${this.onInputChange}\n @focus=${this.onInputFocus}\n @blur=${this.onInputBlur}\n @keydown=${this.onInputKeydown}\n .model=${model}\n />\n </div>\n `;\n }\n\n public render(): TemplateResult[] {\n this.clearHandleComponentCache();\n return this.model.map((model, index) => {\n const zIndex = this.handleOrder.indexOf(model.name) + 1;\n return this.renderHandle(\n model,\n index,\n zIndex,\n this.model.length > 1\n );\n });\n }\n\n /*\n Returns a list of track segment [start, end] tuples where the values are\n * normalized to be between 0 and 1.\n * @returns A list of track segment tuples [start, end]\n /\n public trackSegments(): [number, number][] {\n const values = this.model.map((model) => model.normalizedValue);\n values.sort((a, b) => a - b);\n\n // The first segment always starts at 0\n values.unshift(0);\n return values.map((value, index, array) => [\n value,\n array[index + 1] ?? 1,\n ]);\n }\n\n private updateModel(): void {\n const handles = [...this.handles.values()];\n\n const getRangeAndClamp = (index: number): RangeAndClamp => {\n const handle = handles[index];\n const previous = handles[index - 1];\n const next = handles[index + 1];\n\n const min =\n typeof handle.min === 'number'\n ? handle.min\n : (this.host.min as number);\n const max =\n typeof handle.max === 'number'\n ? handle.max\n : (this.host.max as number);\n\n const result: RangeAndClamp = {\n range: { min: min, max: max },\n clamp: { min: min, max: max },\n };\n\n if (handle.min === 'previous') {\n if (previous) {\n for (let j = index - 1; j >= 0; j--) {\n const item = handles[j];\n if (typeof item.min === 'number') {\n result.range.min = item.min;\n break;\n }\n }\n result.clamp.min = Math.max(\n previous.value,\n result.range.min\n );\n / c8 ignore next 5 /\n } else {\n console.warn(\n 'First slider handle cannot have attribute min=\"previous\"'\n );\n }\n }\n if (handle.max === 'next') {\n if (next) {\n for (let j = index + 1; j < handles.length; j++) {\n const item = handles[j];\n if (typeof item.max === 'number') {\n result.range.max = item.max;\n break;\n }\n }\n result.clamp.max = Math.min(next.value, result.range.max);\n / c8 ignore next 5 */\n } else {\n console.warn(\n 'Last slider handle cannot have attribute max=\"next\"'\n );\n }\n }\n return result;\n };\n\n const modelValues = handles.map((handle, index) => {\n const rangeAndClamp = getRangeAndClamp(index);\n const { toNormalized } = handle.normalization;\n const clampedValue = Math.max(\n Math.min(handle.value, rangeAndClamp.clamp.max),\n rangeAndClamp.clamp.min\n );\n const normalizedValue = toNormalized(\n clampedValue,\n rangeAndClamp.range.min,\n rangeAndClamp.range.max\n );\n const model = {\n name: handle.handleName,\n value: clampedValue,\n normalizedValue,\n highlight: handle.highlight,\n step: handle.step ?? this.host.step,\n normalization: handle.normalization,\n handle,\n ariaLabel:\n handle !== this.host && handle?.label.length > 0\n ? handle.label\n : undefined,\n ...rangeAndClamp,\n };\n return model;\n });\n\n this.model = modelValues;\n }\n\n public async handleUpdatesComplete(): Promise<void> {\n const updates = [...this.handles.values()]\n .filter((handle) => handle !== this.host)\n .map((handle) => handle.updateComplete);\n await Promise.all(updates);\n }\n}\n"]}

package/src/Slider.d.ts CHANGED Viewed

@@ -43,6 +43,14 @@ export declare class Slider extends Slider_base {
     tickStep: number;
     tickLabels: boolean;
     disabled: boolean;
+    /**
+     * Applies `quiet` to the underlying `sp-number-field` when `editable === true`.
+     */
+    quiet: boolean;
+    /**
+     * Applies `indeterminate` to the underlying `sp-number-field` when `editable === true`. Is removed on the next `change` event.
+     */
+    indeterminate: boolean;
     labelEl: HTMLLabelElement;
     numberField: NumberField;
     track: HTMLDivElement;

package/src/Slider.js CHANGED Viewed

@@ -50,6 +50,14 @@ export class Slider extends ObserveSlotText(SliderHandle, '') {
         this.tickStep = 0;
         this.tickLabels = false;
         this.disabled = false;
+        /**
+         * Applies `quiet` to the underlying `sp-number-field` when `editable === true`.
+         */
+        this.quiet = false;
+        /**
+         * Applies `indeterminate` to the underlying `sp-number-field` when `editable === true`. Is removed on the next `change` event.
+         */
+        this.indeterminate = false;
         this._numberFieldInput = Promise.resolve();
     }
     static get styles() {
@@ -129,6 +137,8 @@ export class Slider extends ObserveSlotText(SliderHandle, '') {
                           value=${this.value}
                           ?hide-stepper=${this.hideStepper}
                           ?disabled=${this.disabled}
+                          ?quiet=${this.quiet}
+                          ?indeterminate=${this.indeterminate}
                           @input=${this.handleNumberInput}
                           @change=${this.handleNumberChange}
                       ></sp-number-field>
@@ -306,6 +316,7 @@ export class Slider extends ObserveSlotText(SliderHandle, '') {
                 this.dispatchInputEvent();
             }
         }
+        this.indeterminate = false;
     }
     trackSegmentStyles(start, end) {
         const size = end - start;
@@ -362,6 +373,12 @@ __decorate([
 __decorate([
     property({ type: Boolean, reflect: true })
 ], Slider.prototype, "disabled", void 0);
+__decorate([
+    property({ type: Boolean })
+], Slider.prototype, "quiet", void 0);
+__decorate([
+    property({ type: Boolean })
+], Slider.prototype, "indeterminate", void 0);
 __decorate([
     query('#label')
 ], Slider.prototype, "labelEl", void 0);

package/src/Slider.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Slider.js","sourceRoot":"","sources":["Slider.ts"],"names":[],"mappings":"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","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 TemplateResult,\n} from '@spectrum-web-components/base';\nimport {\n property,\n query,\n} from '@spectrum-web-components/base/src/decorators.js';\nimport {\n classMap,\n ifDefined,\n repeat,\n styleMap,\n} from '@spectrum-web-components/base/src/directives.js';\n\nimport sliderStyles from './slider.css.js';\nimport { ObserveSlotText } from '@spectrum-web-components/shared/src/observe-slot-text.js';\nimport { StyleInfo } from 'lit-html/directives/style-map';\nimport '@spectrum-web-components/field-label/sp-field-label.js';\nimport type { NumberField } from '@spectrum-web-components/number-field';\nimport { HandleController, HandleValueDictionary } from './HandleController.js';\nimport { SliderHandle } from './SliderHandle.js';\nimport { streamingListener } from '@spectrum-web-components/base/src/streaming-listener.js';\nimport type { NumberFormatter } from '@internationalized/number';\n\nexport const variants = ['filled', 'ramp', 'range', 'tick'];\n\n/*\n @element sp-slider\n \n @slot - text label for the Slider\n * @slot handle - optionally accepts two or more sp-slider-handle elements\n /\nexport class Slider extends ObserveSlotText(SliderHandle, '') {\n public static override get styles(): CSSResultArray {\n return [sliderStyles];\n }\n\n public override handleController: HandleController = new HandleController(\n this\n );\n\n /\n Whether to display a Number Field along side the slider UI\n /\n @property({ type: Boolean, reflect: true })\n public get editable(): boolean {\n return this._editable;\n }\n\n public set editable(editable: boolean) {\n if (editable === this.editable) return;\n const oldValue = this.editable;\n this._editable = this.handleController.size < 2 ? editable : false;\n if (this.editable) {\n this._numberFieldInput = import(\n '@spectrum-web-components/number-field/sp-number-field.js'\n );\n }\n if (oldValue !== this.editable) {\n this.requestUpdate('editable', oldValue);\n }\n }\n\n private _editable = false;\n\n /\n Whether the stepper UI of the Number Field is hidden or not\n /\n @property({ type: Boolean, reflect: true, attribute: 'hide-stepper' })\n public hideStepper = false;\n\n @property()\n public type = '';\n\n @property({ type: String })\n public set variant(variant: string) {\n const oldVariant = this.variant;\n if (variant === this.variant) {\n return;\n }\n if (variants.includes(variant)) {\n this.setAttribute('variant', variant);\n this._variant = variant;\n } else {\n this.removeAttribute('variant');\n this._variant = '';\n }\n this.requestUpdate('variant', oldVariant);\n }\n\n public get variant(): string {\n return this._variant;\n }\n\n public get values(): HandleValueDictionary {\n return this.handleController.values;\n }\n\n public override get handleName(): string {\n return 'value';\n }\n\n / Ensure that a '' value for `variant` removes the attribute instead of a blank value /\n private _variant = '';\n\n @property({ attribute: false })\n public getAriaValueText: (values: Map<string, string>) => string = (\n values\n ) => {\n const valueArray = [...values.values()];\n if (valueArray.length === 2)\n return `${valueArray[0]}${this._forcedUnit} - ${valueArray[1]}${this._forcedUnit}`;\n return valueArray.join(`${this._forcedUnit}, `) + this._forcedUnit;\n };\n\n public override get ariaValueText(): string {\n if (!this.getAriaValueText) {\n return `${this.value}${this._forcedUnit}`;\n }\n return this.getAriaValueText(this.handleController.formattedValues);\n }\n\n @property({ type: String, reflect: true, attribute: 'label-visibility' })\n public labelVisibility?: 'text' \| 'value' \| 'none';\n\n @property({ type: Number, reflect: true })\n public override min = 0;\n\n @property({ type: Number, reflect: true })\n public override max = 100;\n\n @property({ type: Number })\n public override step = 1;\n\n @property({ type: Number, attribute: 'tick-step' })\n public tickStep = 0;\n\n @property({ type: Boolean, attribute: 'tick-labels' })\n public tickLabels = false;\n\n @property({ type: Boolean, reflect: true })\n public override disabled = false;\n\n @query('#label')\n public labelEl!: HTMLLabelElement;\n\n @query('#number-field')\n public numberField!: NumberField;\n\n @query('#track')\n public track!: HTMLDivElement;\n\n public override get numberFormat(): NumberFormatter {\n return this.getNumberFormat();\n }\n\n public override get focusElement(): HTMLElement {\n return this.handleController.focusElement;\n }\n\n protected handleLabelClick(event: Event): void {\n if (this.editable) {\n event.preventDefault();\n this.focus();\n }\n }\n\n protected override render(): TemplateResult {\n return html`\n ${this.renderLabel()} ${this.renderTrack()}\n ${this.editable\n ? html`\n <sp-number-field\n .formatOptions=${this.formatOptions \|\| {}}\n id=\"number-field\"\n min=${this.min}\n max=${this.max}\n step=${this.step}\n value=${this.value}\n ?hide-stepper=${this.hideStepper}\n ?disabled=${this.disabled}\n @input=${this.handleNumberInput}\n @change=${this.handleNumberChange}\n ></sp-number-field>\n `\n : html``}\n `;\n }\n\n public override connectedCallback(): void {\n super.connectedCallback();\n this.handleController.hostConnected();\n }\n\n public override disconnectedCallback(): void {\n super.disconnectedCallback();\n this.handleController.hostDisconnected();\n }\n\n public override update(changedProperties: Map<string, boolean>): void {\n this.handleController.hostUpdate();\n if (changedProperties.has('disabled') && this.disabled) {\n this.handleController.cancelDrag();\n }\n super.update(changedProperties);\n }\n\n private renderLabel(): TemplateResult {\n const textLabelVisible =\n this.labelVisibility === 'none' \|\| this.labelVisibility === 'value';\n const valueLabelVisible =\n this.labelVisibility === 'none' \|\| this.labelVisibility === 'text';\n return html`\n <div id=\"label-container\">\n <sp-field-label\n class=${classMap({\n 'visually-hidden': textLabelVisible,\n })}\n ?disabled=${this.disabled}\n id=\"label\"\n for=${this.editable\n ? 'number-field'\n : this.handleController.activeHandleInputId}\n @click=${this.handleLabelClick}\n >\n ${this.slotHasContent ? html`` : this.label}\n <slot>${this.label}</slot>\n </sp-field-label>\n <output\n class=${classMap({\n 'visually-hidden': valueLabelVisible,\n })}\n id=\"value\"\n aria-live=\"off\"\n for=\"input\"\n >\n ${this.ariaValueText}\n </output>\n </div>\n `;\n }\n\n private renderRamp(): TemplateResult {\n if (this.variant !== 'ramp') {\n return html``;\n }\n return html`\n <div id=\"ramp\">\n <svg\n viewBox=\"0 0 240 16\"\n preserveAspectRatio=\"none\"\n aria-hidden=\"true\"\n focusable=\"false\"\n >\n <path\n d=\"M240,4v8c0,2.3-1.9,4.1-4.2,4L1,9C0.4,9,0,8.5,0,8c0-0.5,0.4-1,1-1l234.8-7C238.1-0.1,240,1.7,240,4z\"\n ></path>\n </svg>\n </div>\n `;\n }\n\n private renderTicks(): TemplateResult {\n if (this.variant !== 'tick') {\n return html``;\n }\n const tickStep = this.tickStep \|\| this.step;\n const tickCount =\n ((this.max as number) - (this.min as number)) / tickStep;\n const partialFit = tickCount % 1 !== 0;\n const ticks = new Array(Math.floor(tickCount + 1));\n ticks.fill(0, 0, tickCount + 1);\n return html`\n <div\n class=\"${partialFit ? 'not-exact ' : ''}ticks\"\n style=${ifDefined(\n partialFit\n ? `--sp-slider-tick-offset: calc(100% / ${this.max} ${this.tickStep}`\n : undefined\n )}\n >\n ${ticks.map(\n (_tick, i) => html`\n <div class=\"tick\">\n ${this.tickLabels\n ? html`\n <div class=\"tickLabel\">\n ${i * tickStep + this.min}\n </div>\n `\n : html``}\n </div>\n `\n )}\n </div>\n `;\n }\n\n private renderTrackSegment(start: number, end: number): TemplateResult {\n if (this.variant === 'ramp') {\n return html``;\n }\n return html`\n <div\n class=\"track\"\n style=${styleMap(this.trackSegmentStyles(start, end))}\n role=\"presentation\"\n ></div>\n `;\n }\n\n private renderTrack(): TemplateResult {\n const segments = this.handleController.trackSegments();\n\n const trackItems = [\n { id: 'track0', html: this.renderTrackSegment(...segments[0]) },\n { id: 'ramp', html: this.renderRamp() },\n { id: 'ticks', html: this.renderTicks() },\n { id: 'handles', html: this.handleController.render() },\n ...segments.slice(1).map(([start, end], index) => ({\n id: `track${index + 1}`,\n html: this.renderTrackSegment(start, end),\n })),\n ];\n\n return html`\n <div\n id=\"track\"\n ${streamingListener({\n start: ['pointerdown', this.handlePointerdown],\n streamInside: ['pointermove', this.handlePointermove],\n end: [['pointerup', 'pointercancel'], this.handlePointerup],\n })}\n >\n <div id=\"controls\">\n ${repeat(\n trackItems,\n (item) => item.id,\n (item) => item.html\n )}\n </div>\n </div>\n `;\n }\n\n protected handlePointerdown(event: PointerEvent): void {\n this.handleController.handlePointerdown(event);\n }\n\n protected handlePointermove(event: PointerEvent): void {\n this.handleController.handlePointermove(event);\n }\n\n protected handlePointerup(event: PointerEvent): void {\n this.handleController.handlePointerup(event);\n }\n\n private handleNumberInput(event: Event & { target: NumberField }): void {\n const { value } = event.target;\n if (event.target?.stepperActive && !isNaN(value)) {\n this.value = value;\n return;\n }\n // Do not apply uncommited values to the parent element unless interacting with the stepper UI.\n // Stop uncommited input from being annoucned to the parent application.\n event.stopPropagation();\n }\n\n private handleNumberChange(event: Event & { target: NumberField }): void {\n const { value } = event.target;\n if (isNaN(value)) {\n event.target.value = this.value;\n event.stopPropagation();\n } else {\n this.value = value;\n if (!event.target?.stepperActive) {\n // When stepper is not active, sythesize an `input` event so that the\n // `change` event isn't surprising.\n this.dispatchInputEvent();\n }\n }\n }\n\n private trackSegmentStyles(start: number, end: number): StyleInfo {\n const size = end - start;\n const styles: StyleInfo = {\n width: `${size * 100}%`,\n '--spectrum-slider-track-background-size': `${(1 / size) * 100}%`,\n '--spectrum-slider-track-segment-position': `${start * 100}%`,\n };\n return styles;\n }\n\n private _numberFieldInput: Promise<unknown> = Promise.resolve();\n\n protected override async getUpdateComplete(): Promise<boolean> {\n const complete = (await super.getUpdateComplete()) as boolean;\n if (this.editable) {\n await this._numberFieldInput;\n await this.numberField.updateComplete;\n }\n await this.handleController.handleUpdatesComplete();\n return complete;\n }\n}\n"]}
1	+ {"version":3,"file":"Slider.js","sourceRoot":"","sources":["Slider.ts"],"names":[],"mappings":"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","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 TemplateResult,\n} from '@spectrum-web-components/base';\nimport {\n property,\n query,\n} from '@spectrum-web-components/base/src/decorators.js';\nimport {\n classMap,\n ifDefined,\n repeat,\n styleMap,\n} from '@spectrum-web-components/base/src/directives.js';\n\nimport sliderStyles from './slider.css.js';\nimport { ObserveSlotText } from '@spectrum-web-components/shared/src/observe-slot-text.js';\nimport { StyleInfo } from 'lit-html/directives/style-map';\nimport '@spectrum-web-components/field-label/sp-field-label.js';\nimport type { NumberField } from '@spectrum-web-components/number-field';\nimport { HandleController, HandleValueDictionary } from './HandleController.js';\nimport { SliderHandle } from './SliderHandle.js';\nimport { streamingListener } from '@spectrum-web-components/base/src/streaming-listener.js';\nimport type { NumberFormatter } from '@internationalized/number';\n\nexport const variants = ['filled', 'ramp', 'range', 'tick'];\n\n/*\n @element sp-slider\n \n @slot - text label for the Slider\n * @slot handle - optionally accepts two or more sp-slider-handle elements\n /\nexport class Slider extends ObserveSlotText(SliderHandle, '') {\n public static override get styles(): CSSResultArray {\n return [sliderStyles];\n }\n\n public override handleController: HandleController = new HandleController(\n this\n );\n\n /\n Whether to display a Number Field along side the slider UI\n /\n @property({ type: Boolean, reflect: true })\n public get editable(): boolean {\n return this._editable;\n }\n\n public set editable(editable: boolean) {\n if (editable === this.editable) return;\n const oldValue = this.editable;\n this._editable = this.handleController.size < 2 ? editable : false;\n if (this.editable) {\n this._numberFieldInput = import(\n '@spectrum-web-components/number-field/sp-number-field.js'\n );\n }\n if (oldValue !== this.editable) {\n this.requestUpdate('editable', oldValue);\n }\n }\n\n private _editable = false;\n\n /\n Whether the stepper UI of the Number Field is hidden or not\n /\n @property({ type: Boolean, reflect: true, attribute: 'hide-stepper' })\n public hideStepper = false;\n\n @property()\n public type = '';\n\n @property({ type: String })\n public set variant(variant: string) {\n const oldVariant = this.variant;\n if (variant === this.variant) {\n return;\n }\n if (variants.includes(variant)) {\n this.setAttribute('variant', variant);\n this._variant = variant;\n } else {\n this.removeAttribute('variant');\n this._variant = '';\n }\n this.requestUpdate('variant', oldVariant);\n }\n\n public get variant(): string {\n return this._variant;\n }\n\n public get values(): HandleValueDictionary {\n return this.handleController.values;\n }\n\n public override get handleName(): string {\n return 'value';\n }\n\n / Ensure that a '' value for `variant` removes the attribute instead of a blank value /\n private _variant = '';\n\n @property({ attribute: false })\n public getAriaValueText: (values: Map<string, string>) => string = (\n values\n ) => {\n const valueArray = [...values.values()];\n if (valueArray.length === 2)\n return `${valueArray[0]}${this._forcedUnit} - ${valueArray[1]}${this._forcedUnit}`;\n return valueArray.join(`${this._forcedUnit}, `) + this._forcedUnit;\n };\n\n public override get ariaValueText(): string {\n if (!this.getAriaValueText) {\n return `${this.value}${this._forcedUnit}`;\n }\n return this.getAriaValueText(this.handleController.formattedValues);\n }\n\n @property({ type: String, reflect: true, attribute: 'label-visibility' })\n public labelVisibility?: 'text' \| 'value' \| 'none';\n\n @property({ type: Number, reflect: true })\n public override min = 0;\n\n @property({ type: Number, reflect: true })\n public override max = 100;\n\n @property({ type: Number })\n public override step = 1;\n\n @property({ type: Number, attribute: 'tick-step' })\n public tickStep = 0;\n\n @property({ type: Boolean, attribute: 'tick-labels' })\n public tickLabels = false;\n\n @property({ type: Boolean, reflect: true })\n public override disabled = false;\n\n /\n Applies `quiet` to the underlying `sp-number-field` when `editable === true`.\n /\n @property({ type: Boolean })\n public quiet = false;\n\n /\n Applies `indeterminate` to the underlying `sp-number-field` when `editable === true`. Is removed on the next `change` event.\n /\n @property({ type: Boolean })\n public indeterminate = false;\n\n @query('#label')\n public labelEl!: HTMLLabelElement;\n\n @query('#number-field')\n public numberField!: NumberField;\n\n @query('#track')\n public track!: HTMLDivElement;\n\n public override get numberFormat(): NumberFormatter {\n return this.getNumberFormat();\n }\n\n public override get focusElement(): HTMLElement {\n return this.handleController.focusElement;\n }\n\n protected handleLabelClick(event: Event): void {\n if (this.editable) {\n event.preventDefault();\n this.focus();\n }\n }\n\n protected override render(): TemplateResult {\n return html`\n ${this.renderLabel()} ${this.renderTrack()}\n ${this.editable\n ? html`\n <sp-number-field\n .formatOptions=${this.formatOptions \|\| {}}\n id=\"number-field\"\n min=${this.min}\n max=${this.max}\n step=${this.step}\n value=${this.value}\n ?hide-stepper=${this.hideStepper}\n ?disabled=${this.disabled}\n ?quiet=${this.quiet}\n ?indeterminate=${this.indeterminate}\n @input=${this.handleNumberInput}\n @change=${this.handleNumberChange}\n ></sp-number-field>\n `\n : html``}\n `;\n }\n\n public override connectedCallback(): void {\n super.connectedCallback();\n this.handleController.hostConnected();\n }\n\n public override disconnectedCallback(): void {\n super.disconnectedCallback();\n this.handleController.hostDisconnected();\n }\n\n public override update(changedProperties: Map<string, boolean>): void {\n this.handleController.hostUpdate();\n if (changedProperties.has('disabled') && this.disabled) {\n this.handleController.cancelDrag();\n }\n super.update(changedProperties);\n }\n\n private renderLabel(): TemplateResult {\n const textLabelVisible =\n this.labelVisibility === 'none' \|\| this.labelVisibility === 'value';\n const valueLabelVisible =\n this.labelVisibility === 'none' \|\| this.labelVisibility === 'text';\n return html`\n <div id=\"label-container\">\n <sp-field-label\n class=${classMap({\n 'visually-hidden': textLabelVisible,\n })}\n ?disabled=${this.disabled}\n id=\"label\"\n for=${this.editable\n ? 'number-field'\n : this.handleController.activeHandleInputId}\n @click=${this.handleLabelClick}\n >\n ${this.slotHasContent ? html`` : this.label}\n <slot>${this.label}</slot>\n </sp-field-label>\n <output\n class=${classMap({\n 'visually-hidden': valueLabelVisible,\n })}\n id=\"value\"\n aria-live=\"off\"\n for=\"input\"\n >\n ${this.ariaValueText}\n </output>\n </div>\n `;\n }\n\n private renderRamp(): TemplateResult {\n if (this.variant !== 'ramp') {\n return html``;\n }\n return html`\n <div id=\"ramp\">\n <svg\n viewBox=\"0 0 240 16\"\n preserveAspectRatio=\"none\"\n aria-hidden=\"true\"\n focusable=\"false\"\n >\n <path\n d=\"M240,4v8c0,2.3-1.9,4.1-4.2,4L1,9C0.4,9,0,8.5,0,8c0-0.5,0.4-1,1-1l234.8-7C238.1-0.1,240,1.7,240,4z\"\n ></path>\n </svg>\n </div>\n `;\n }\n\n private renderTicks(): TemplateResult {\n if (this.variant !== 'tick') {\n return html``;\n }\n const tickStep = this.tickStep \|\| this.step;\n const tickCount =\n ((this.max as number) - (this.min as number)) / tickStep;\n const partialFit = tickCount % 1 !== 0;\n const ticks = new Array(Math.floor(tickCount + 1));\n ticks.fill(0, 0, tickCount + 1);\n return html`\n <div\n class=\"${partialFit ? 'not-exact ' : ''}ticks\"\n style=${ifDefined(\n partialFit\n ? `--sp-slider-tick-offset: calc(100% / ${this.max} ${this.tickStep}`\n : undefined\n )}\n >\n ${ticks.map(\n (_tick, i) => html`\n <div class=\"tick\">\n ${this.tickLabels\n ? html`\n <div class=\"tickLabel\">\n ${i * tickStep + this.min}\n </div>\n `\n : html``}\n </div>\n `\n )}\n </div>\n `;\n }\n\n private renderTrackSegment(start: number, end: number): TemplateResult {\n if (this.variant === 'ramp') {\n return html``;\n }\n return html`\n <div\n class=\"track\"\n style=${styleMap(this.trackSegmentStyles(start, end))}\n role=\"presentation\"\n ></div>\n `;\n }\n\n private renderTrack(): TemplateResult {\n const segments = this.handleController.trackSegments();\n\n const trackItems = [\n { id: 'track0', html: this.renderTrackSegment(...segments[0]) },\n { id: 'ramp', html: this.renderRamp() },\n { id: 'ticks', html: this.renderTicks() },\n { id: 'handles', html: this.handleController.render() },\n ...segments.slice(1).map(([start, end], index) => ({\n id: `track${index + 1}`,\n html: this.renderTrackSegment(start, end),\n })),\n ];\n\n return html`\n <div\n id=\"track\"\n ${streamingListener({\n start: ['pointerdown', this.handlePointerdown],\n streamInside: ['pointermove', this.handlePointermove],\n end: [['pointerup', 'pointercancel'], this.handlePointerup],\n })}\n >\n <div id=\"controls\">\n ${repeat(\n trackItems,\n (item) => item.id,\n (item) => item.html\n )}\n </div>\n </div>\n `;\n }\n\n protected handlePointerdown(event: PointerEvent): void {\n this.handleController.handlePointerdown(event);\n }\n\n protected handlePointermove(event: PointerEvent): void {\n this.handleController.handlePointermove(event);\n }\n\n protected handlePointerup(event: PointerEvent): void {\n this.handleController.handlePointerup(event);\n }\n\n private handleNumberInput(event: Event & { target: NumberField }): void {\n const { value } = event.target;\n if (event.target?.stepperActive && !isNaN(value)) {\n this.value = value;\n return;\n }\n // Do not apply uncommited values to the parent element unless interacting with the stepper UI.\n // Stop uncommited input from being annoucned to the parent application.\n event.stopPropagation();\n }\n\n private handleNumberChange(event: Event & { target: NumberField }): void {\n const { value } = event.target;\n if (isNaN(value)) {\n event.target.value = this.value;\n event.stopPropagation();\n } else {\n this.value = value;\n if (!event.target?.stepperActive) {\n // When stepper is not active, sythesize an `input` event so that the\n // `change` event isn't surprising.\n this.dispatchInputEvent();\n }\n }\n this.indeterminate = false;\n }\n\n private trackSegmentStyles(start: number, end: number): StyleInfo {\n const size = end - start;\n const styles: StyleInfo = {\n width: `${size * 100}%`,\n '--spectrum-slider-track-background-size': `${(1 / size) * 100}%`,\n '--spectrum-slider-track-segment-position': `${start * 100}%`,\n };\n return styles;\n }\n\n private _numberFieldInput: Promise<unknown> = Promise.resolve();\n\n protected override async getUpdateComplete(): Promise<boolean> {\n const complete = (await super.getUpdateComplete()) as boolean;\n if (this.editable) {\n await this._numberFieldInput;\n await this.numberField.updateComplete;\n }\n await this.handleController.handleUpdatesComplete();\n return complete;\n }\n}\n"]}

package/stories/slider.stories.js CHANGED Viewed

@@ -380,6 +380,41 @@ export const Disabled = (args = {}) => {
         </div>
     `;
 };
+export const Quiet = (args = {}) => {
+    return html `
+        <div style="width: 500px; margin: 12px 20px;">
+            <sp-slider
+                editable
+                hide-stepper
+                quiet
+                value="5"
+                step="0.5"
+                min="0"
+                max="20"
+                label="Intensity"
+                ...=${spreadProps(args)}
+            ></sp-slider>
+        </div>
+    `;
+};
+export const Indeterminate = (args = {}) => {
+    return html `
+        <div style="width: 500px; margin: 12px 20px;">
+            <sp-slider
+                editable
+                indeterminate
+                value="5"
+                step="0.5"
+                min="0"
+                max="20"
+                label="Intensity"
+                @input=${handleEvent(args)}
+                @change=${handleEvent(args)}
+                ...=${spreadProps(args)}
+            ></sp-slider>
+        </div>
+    `;
+};
 export const ExplicitHandle = (args = {}) => {
     return html `
         <div style="width: 500px; margin: 12px 20px;">

package/stories/slider.stories.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"slider.stories.js","sourceRoot":"","sources":["slider.stories.ts"],"names":[],"mappings":"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","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/\nimport { html, TemplateResult } from '@spectrum-web-components/base';\n\nimport '../sp-slider.js';\nimport '../sp-slider-handle.js';\nimport { Slider, SliderHandle, variants } from '../';\nimport { spreadProps } from '../../../test/lit-helpers.js';\n\nexport default {\n component: 'sp-slider',\n title: 'Slider',\n argTypes: {\n onInput: { action: 'input' },\n onChange: { action: 'change' },\n variant: {\n name: 'Variant',\n description: 'Determines the style of slider.',\n table: {\n type: { summary: 'string' },\n defaultValue: { summary: undefined },\n },\n control: {\n type: 'inline-radio',\n options: [undefined, ...variants],\n },\n },\n tickStep: {\n name: 'Tick Step',\n description: 'Tick spacing on slider.',\n table: {\n type: { summary: 'number' },\n defaultValue: { summary: 0.1 },\n },\n control: {\n type: 'number',\n },\n },\n labelVisibility: {\n name: 'Label Visibility',\n description: 'The labels visibily available in the UI',\n table: {\n type: { summary: '\"text\" \| \"value\" \| \"none\" \| undefined' },\n defaultValue: { summary: undefined },\n },\n control: {\n type: 'text',\n },\n },\n },\n args: {\n variant: undefined,\n tickStep: 0.1,\n labelVisibility: undefined,\n },\n};\n\nexport interface StoryArgs {\n variant?: string;\n tickStep?: number;\n labelVisibility?: string;\n onInput?: (val: string) => void;\n onChange?: (val: string) => void;\n [prop: string]: unknown;\n}\n\nconst handleEvent =\n ({ onInput, onChange }: StoryArgs) =>\n (event: Event): void => {\n const { value } = event.target as Slider;\n if (onInput && event.type === 'input') {\n onInput(value.toString());\n } else if (onChange && event.type === 'change') {\n onChange(value.toString());\n }\n };\n\nconst handleHandleEvent =\n ({ onInput, onChange }: StoryArgs) =>\n (event: Event): void => {\n const target = event.target as SliderHandle;\n if (target.value != null) {\n if (typeof target.value === 'object') {\n const value = JSON.stringify(target.value, null, 2);\n if (onInput && event.type === 'input') {\n onInput(value);\n } else if (onChange && event.type === 'change') {\n onChange(value);\n }\n } else {\n const value = `${target.name}: ${target.value}`;\n if (onInput && event.type === 'input') {\n onInput(value);\n } else if (onChange && event.type === 'change') {\n onChange(value);\n }\n }\n }\n };\n\nexport const Default = (args: StoryArgs = {}): TemplateResult => {\n return html`\n <div style=\"width: 500px; margin: 12px 20px;\">\n <sp-slider\n max=\"1\"\n min=\"0\"\n value=\".5\"\n step=\"0.01\"\n @input=${handleEvent(args)}\n @change=${handleEvent(args)}\n .formatOptions=${{ style: 'percent' }}\n ...=${spreadProps(args)}\n >\n Opacity\n </sp-slider>\n </div>\n `;\n};\n\nexport const noVisibleTextLabel = (args: StoryArgs = {}): TemplateResult => {\n return html`\n <div style=\"width: 500px; margin: 12px 20px;\">\n <sp-slider\n max=\"1\"\n min=\"0\"\n value=\".5\"\n step=\"0.01\"\n @input=${handleEvent(args)}\n @change=${handleEvent(args)}\n .formatOptions=${{ style: 'percent' }}\n ...=${spreadProps(args)}\n >\n Opacity\n </sp-slider>\n </div>\n `;\n};\nnoVisibleTextLabel.args = {\n labelVisibility: 'value',\n};\n\nexport const noVisibleValueLabel = (args: StoryArgs = {}): TemplateResult => {\n return html`\n <div style=\"width: 500px; margin: 12px 20px;\">\n <sp-slider\n max=\"1\"\n min=\"0\"\n value=\".5\"\n step=\"0.01\"\n @input=${handleEvent(args)}\n @change=${handleEvent(args)}\n .formatOptions=${{ style: 'percent' }}\n ...=${spreadProps(args)}\n >\n Opacity\n </sp-slider>\n </div>\n `;\n};\nnoVisibleValueLabel.args = {\n labelVisibility: 'text',\n};\n\nexport const noVisibleLabels = (args: StoryArgs = {}): TemplateResult => {\n return html`\n <div style=\"width: 500px; margin: 12px 20px;\">\n <sp-slider\n max=\"1\"\n min=\"0\"\n value=\".5\"\n step=\"0.01\"\n @input=${handleEvent(args)}\n @change=${handleEvent(args)}\n .formatOptions=${{ style: 'percent' }}\n ...=${spreadProps(args)}\n >\n Opacity\n </sp-slider>\n </div>\n `;\n};\nnoVisibleLabels.args = {\n labelVisibility: 'none',\n};\n\nexport const px = (args: StoryArgs = {}): TemplateResult => {\n return html`\n <div style=\"width: 500px; margin: 12px 20px;\">\n <sp-slider\n max=\"360\"\n min=\"0\"\n value=\"90\"\n step=\"1\"\n @input=${handleEvent(args)}\n @change=${handleEvent(args)}\n .formatOptions=${{\n style: 'unit',\n unit: 'px',\n }}\n ...=${spreadProps(args)}\n >\n Angle\n </sp-slider>\n </div>\n `;\n};\n\nclass NumberFieldDefined extends HTMLElement {\n constructor() {\n super();\n this.numberFieldLoaderPromise = new Promise((res) => {\n customElements.whenDefined('sp-number-field').then(() => {\n res(true);\n });\n });\n }\n\n private numberFieldLoaderPromise: Promise<boolean> = Promise.resolve(false);\n\n get updateComplete(): Promise<boolean> {\n return this.numberFieldLoaderPromise;\n }\n}\n\ncustomElements.define('number-field-defined', NumberFieldDefined);\n\nconst editableDecorator = (story: () => TemplateResult): TemplateResult => {\n return html`\n ${story()}\n <number-field-defined></number-field-defined>\n `;\n};\n\nexport const editable = (args: StoryArgs = {}): TemplateResult => {\n return html`\n <div style=\"width: 500px; margin: 12px 20px;\">\n <sp-slider\n editable\n max=\"360\"\n min=\"0\"\n value=\"90\"\n step=\"1\"\n @input=${handleEvent(args)}\n @change=${handleEvent(args)}\n .formatOptions=${{\n style: 'unit',\n unit: 'degree',\n unitDisplay: 'narrow',\n }}\n ...=${spreadProps(args)}\n >\n Angle\n </sp-slider>\n </div>\n `;\n};\n\neditable.decorators = [editableDecorator];\n\nexport const editableDisabled = (args: StoryArgs = {}): TemplateResult => {\n return html`\n <div style=\"width: 500px; margin: 12px 20px;\">\n <sp-slider\n editable\n disabled\n max=\"360\"\n min=\"0\"\n value=\"90\"\n step=\"1\"\n @input=${handleEvent(args)}\n @change=${handleEvent(args)}\n .formatOptions=${{\n style: 'unit',\n unit: 'degree',\n unitDisplay: 'narrow',\n }}\n ...=${spreadProps(args)}\n >\n Angle\n </sp-slider>\n </div>\n `;\n};\n\neditable.decorators = [editableDecorator];\n\nexport const editableCustom = (args: StoryArgs = {}): TemplateResult => {\n return html`\n <div\n style=\"width: 500px; margin: 12px 20px; --spectrum-slider-editable-number-field-width: 150px;\"\n >\n <sp-slider\n editable\n max=\"24\"\n min=\"0\"\n value=\"12.75\"\n step=\"0.25\"\n @input=${handleEvent(args)}\n @change=${handleEvent(args)}\n .formatOptions=${{ style: 'unit', unit: 'hour' }}\n ...=${spreadProps(args)}\n >\n Hours\n </sp-slider>\n </div>\n `;\n};\n\neditableCustom.decorators = [editableDecorator];\n\nexport const hideStepper = (args: StoryArgs = {}): TemplateResult => {\n return html`\n <div style=\"width: 500px; margin: 12px 20px;\">\n <sp-slider\n editable\n hide-stepper\n max=\"1\"\n min=\"0\"\n value=\".5\"\n step=\"0.01\"\n @input=${handleEvent(args)}\n @change=${handleEvent(args)}\n .formatOptions=${{ style: 'percent' }}\n ...=${spreadProps(args)}\n >\n Opacity\n </sp-slider>\n </div>\n `;\n};\n\nhideStepper.decorators = [editableDecorator];\n\nexport const Gradient = (args: StoryArgs = {}): TemplateResult => {\n return html`\n <div\n style=\"\n width: 500px;\n margin: 12px 20px;\n --spectrum-slider-track-color:linear-gradient(to right, red, green 100%);\n --spectrum-slider-track-color-rtl:linear-gradient(to left, red, green 100%);\n \"\n >\n <sp-slider\n label=\"Opacity\"\n max=\"100\"\n min=\"0\"\n value=\"50\"\n id=\"opacity-slider\"\n @input=${handleEvent(args)}\n @change=${handleEvent(args)}\n ...=${spreadProps(args)}\n ></sp-slider>\n </div>\n `;\n};\nGradient.args = {\n variant: undefined,\n};\n\nexport const tick = (args: StoryArgs = {}): TemplateResult => {\n return html`\n <sp-slider\n label=\"Slider Label\"\n variant=\"tick\"\n min=\"0\"\n max=\"92\"\n ...=${spreadProps(args)}\n ></sp-slider>\n `;\n};\ntick.args = {\n variant: 'tick',\n tickStep: 5,\n};\n\nexport const tickLabels = (args: StoryArgs = {}): TemplateResult => {\n return html`\n <sp-slider\n label=\"Slider Label\"\n tick-labels\n variant=\"tick\"\n min=\"50\"\n max=\"75\"\n ...=${spreadProps(args)}\n ></sp-slider>\n `;\n};\ntickLabels.args = {\n variant: 'tick',\n tickStep: 5,\n};\n\nexport const Disabled = (args: StoryArgs = {}): TemplateResult => {\n return html`\n <div style=\"width: 500px; margin: 12px 20px;\">\n <sp-slider\n disabled\n value=\"5\"\n step=\"0.5\"\n min=\"0\"\n max=\"20\"\n label=\"Intensity\"\n ...=${spreadProps(args)}\n ></sp-slider>\n </div>\n `;\n};\n\nexport const ExplicitHandle = (args: StoryArgs = {}): TemplateResult => {\n return html`\n <div style=\"width: 500px; margin: 12px 20px;\">\n <sp-slider\n step=\"0.5\"\n min=\"0\"\n max=\"20\"\n @input=${handleHandleEvent(args)}\n @change=${handleHandleEvent(args)}\n ...=${spreadProps(args)}\n >\n Intensity\n <sp-slider-handle slot=\"handle\" value=\"5\"></sp-slider-handle>\n </sp-slider>\n </div>\n `;\n};\n\nexport const TwoHandles = (args: StoryArgs = {}): TemplateResult => {\n return html`\n <div style=\"width: 500px; margin: 12px 20px;\">\n <sp-slider\n value=\"5\"\n step=\"1\"\n min=\"0\"\n max=\"255\"\n @input=${handleHandleEvent(args)}\n @change=${handleHandleEvent(args)}\n ...=${spreadProps(args)}\n >\n Output Levels\n <sp-slider-handle\n slot=\"handle\"\n name=\"min\"\n value=\"5\"\n ></sp-slider-handle>\n <sp-slider-handle\n slot=\"handle\"\n name=\"max\"\n value=\"250\"\n ></sp-slider-handle>\n </sp-slider>\n </div>\n `;\n};\nTwoHandles.args = {\n variant: 'range',\n tickStep: 10,\n};\n\nexport const TwoHandlesPt = (args: StoryArgs = {}): TemplateResult => {\n return html`\n <div style=\"width: 500px; margin: 12px 20px;\">\n <sp-slider\n value=\"5\"\n step=\"1\"\n min=\"0\"\n max=\"255\"\n @input=${handleHandleEvent(args)}\n @change=${handleHandleEvent(args)}\n .formatOptions=${{\n style: 'unit',\n unit: 'pt',\n }}\n ...=${spreadProps(args)}\n >\n Output Levels\n <sp-slider-handle\n slot=\"handle\"\n name=\"min\"\n value=\"5\"\n ></sp-slider-handle>\n <sp-slider-handle\n slot=\"handle\"\n name=\"max\"\n value=\"250\"\n ></sp-slider-handle>\n </sp-slider>\n </div>\n `;\n};\nTwoHandlesPt.args = {\n variant: 'range',\n tickStep: 10,\n};\n\nexport const ThreeHandlesPc = (args: StoryArgs = {}): TemplateResult => {\n return html`\n <div style=\"width: 500px; margin: 12px 20px;\">\n <sp-slider\n value=\"5\"\n step=\"1\"\n min=\"0\"\n max=\"255\"\n @input=${handleHandleEvent(args)}\n @change=${handleHandleEvent(args)}\n .formatOptions=${{\n style: 'unit',\n unit: 'pc',\n }}\n ...=${spreadProps(args)}\n >\n Output Levels\n <sp-slider-handle slot=\"handle\" value=\"5\"></sp-slider-handle>\n <sp-slider-handle slot=\"handle\" value=\"133\"></sp-slider-handle>\n <sp-slider-handle slot=\"handle\" value=\"250\"></sp-slider-handle>\n </sp-slider>\n </div>\n `;\n};\n\nexport const ThreeHandlesOrdered = (args: StoryArgs = {}): TemplateResult => {\n return html`\n <div style=\"width: 500px; margin: 12px 20px;\">\n <sp-slider\n step=\"1\"\n min=\"0\"\n max=\"255\"\n @input=${handleHandleEvent(args)}\n @change=${handleHandleEvent(args)}\n ...=${spreadProps(args)}\n >\n Output Levels\n <sp-slider-handle\n slot=\"handle\"\n name=\"low\"\n value=\"5\"\n max=\"next\"\n ></sp-slider-handle>\n <sp-slider-handle\n slot=\"handle\"\n name=\"mid\"\n value=\"100\"\n min=\"previous\"\n max=\"next\"\n ></sp-slider-handle>\n <sp-slider-handle\n slot=\"handle\"\n name=\"high\"\n value=\"250\"\n min=\"previous\"\n ></sp-slider-handle>\n </sp-slider>\n </div>\n `;\n};\nThreeHandlesOrdered.args = {\n tickStep: 10,\n};\n\n// This is a very complex example from an actual application.\n//\n// The first and last handles go from 0 to 255 in a linear fashion.\n// The last and first handles are ordered so that the last handle\n// must be greater than or equal to the first handle.\n//\n// The middle handle's range goes from 9.99 to 0.01, counting down.\n// the middle handle's limits are set by the outer handles such that\n// the position of the left handle is the staring value (9.99) for the\n// middle handle. And the position of the right handle is the end\n// value (0.01). That means that the middle handle will move\n// proportionally as you move the outer handles.\n//\n// The two other interesting features of the middle handle are that\n// it counts down, and that it does so exponentially for the first\n// half of its range.\n//\n// Because the specification for the <input> tag in HTML says that the\n// min should be less than the max, we do a double normalization to make\n// this work. The middle handle is considered to go between 0 and 1,\n// where 0 is the left handle's position and 1 is the right handle's\n// position. We then do the appropriate calculation to convert that\n// value into one between 9.99 and 0.01 for display to the user.\n//\n// One iteresting thing to note is that the normalization function\n// can also be used to enforce clamping.\n//\nexport const ThreeHandlesComplex = (args: StoryArgs = {}): TemplateResult => {\n const values: { [key: string]: number } = {\n black: 50,\n gray: 4.98,\n white: 225,\n };\n const handleEvent =\n ({ onInput, onChange }: StoryArgs) =>\n (event: Event): void => {\n const target = event.target as SliderHandle;\n if (target.value != null) {\n if (typeof target.value === 'object') {\n const value = JSON.stringify(target.value, null, 2);\n if (onInput && event.type === 'input') {\n onInput(value);\n } else if (onChange && event.type === 'change') {\n onChange(value);\n }\n } else {\n const value = `${target.name}: ${target.value}`;\n if (onInput && event.type === 'input') {\n onInput(value);\n } else if (onChange && event.type === 'change') {\n onChange(value);\n }\n }\n values[target.name] = target.value;\n }\n };\n const grayNormalization = {\n toNormalized(value: number) {\n const normalizedBlack = values.black / 255;\n const normalizedWhite = values.white / 255;\n const clamped = Math.max(Math.min(value, 1), 0);\n return (\n clamped * (normalizedWhite - normalizedBlack) + normalizedBlack\n );\n },\n fromNormalized(value: number) {\n const normalizedBlack = values.black / 255;\n const normalizedWhite = values.white / 255;\n const clamped = Math.max(\n Math.min(value, normalizedWhite),\n normalizedBlack\n );\n\n return (\n (clamped - normalizedBlack) /\n (normalizedWhite - normalizedBlack)\n );\n },\n };\n const blackNormalization = {\n toNormalized(value: number) {\n const clamped = Math.min(value, values.white);\n return clamped / 255;\n },\n fromNormalized(value: number) {\n const denormalized = value * 255;\n return Math.min(denormalized, values.white);\n },\n };\n const whiteNormalization = {\n toNormalized(value: number) {\n const clamped = Math.max(value, values.black);\n return clamped / 255;\n },\n fromNormalized(value: number) {\n const denormalized = value * 255;\n return Math.max(denormalized, values.black);\n },\n };\n const computeGray = (value: number): string => {\n let result = 1.0;\n if (value > 0.5) {\n result = Math.max(2 * (1 - value), 0.01);\n } else if (value < 0.5) {\n result = ((1 - 2 * value) * (Math.sqrt(9.99) - 1) + 1) ** 2;\n }\n const formatOptions = {\n maximumFractionDigits: 2,\n minimumFractionDigits: 2,\n };\n return new Intl.NumberFormat(navigator.language, formatOptions).format(\n result\n );\n };\n return html`\n <div style=\"width: 500px; margin: 12px 20px;\">\n <sp-slider\n step=\"1\"\n min=\"0\"\n max=\"255\"\n @input=${handleEvent}\n @change=${handleEvent}\n ...=${spreadProps(args)}\n >\n Output Levels\n <sp-slider-handle\n slot=\"handle\"\n name=\"black\"\n value=${values.black}\n .normalization=${blackNormalization}\n ></sp-slider-handle>\n <sp-slider-handle\n slot=\"handle\"\n name=\"gray\"\n value=\"0.215\"\n min=\"0\"\n max=\"1\"\n step=\"0.005\"\n .normalization=${grayNormalization}\n .getAriaHandleText=${computeGray}\n ></sp-slider-handle>\n <sp-slider-handle\n slot=\"handle\"\n name=\"white\"\n value=${values.white}\n .normalization=${whiteNormalization}\n ></sp-slider-handle>\n </sp-slider>\n </div>\n `;\n};\nThreeHandlesOrdered.args = {\n tickStep: 10,\n};\n\nexport const focusTabDemo = (args: StoryArgs = {}): TemplateResult => {\n const value = 50;\n const min = 0;\n const max = 100;\n const step = 1;\n return html`\n <div style=\"width: 500px; margin: 12px 20px 20px;\">\n <sp-slider\n value=\"${value}\"\n step=\"${step}\"\n min=\"${min}\"\n max=\"${max}\"\n label=\"Opacity\"\n id=\"opacity-slider-opacity\"\n ...=${spreadProps(args)}\n ></sp-slider>\n </div>\n <div style=\"width: 500px; margin: 20px;\">\n <sp-slider\n value=\"${value}\"\n step=\"${step}\"\n min=\"${min}\"\n max=\"${max}\"\n label=\"Lightness\"\n id=\"opacity-slider-lightness\"\n ...=${spreadProps(args)}\n ></sp-slider>\n </div>\n <div style=\"width: 500px; margin: 20px 20px 12px;\">\n <sp-slider\n value=\"${value}\"\n step=\"${step}\"\n min=\"${min}\"\n max=\"${max}\"\n label=\"Saturation\"\n id=\"opacity-slider-saturation\"\n ...=${spreadProps(args)}\n ></sp-slider>\n </div>\n `;\n};\n"]}
1	+ {"version":3,"file":"slider.stories.js","sourceRoot":"","sources":["slider.stories.ts"],"names":[],"mappings":"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","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/\nimport { html, TemplateResult } from '@spectrum-web-components/base';\n\nimport '../sp-slider.js';\nimport '../sp-slider-handle.js';\nimport { Slider, SliderHandle, variants } from '../';\nimport { spreadProps } from '../../../test/lit-helpers.js';\n\nexport default {\n component: 'sp-slider',\n title: 'Slider',\n argTypes: {\n onInput: { action: 'input' },\n onChange: { action: 'change' },\n variant: {\n name: 'Variant',\n description: 'Determines the style of slider.',\n table: {\n type: { summary: 'string' },\n defaultValue: { summary: undefined },\n },\n control: {\n type: 'inline-radio',\n options: [undefined, ...variants],\n },\n },\n tickStep: {\n name: 'Tick Step',\n description: 'Tick spacing on slider.',\n table: {\n type: { summary: 'number' },\n defaultValue: { summary: 0.1 },\n },\n control: {\n type: 'number',\n },\n },\n labelVisibility: {\n name: 'Label Visibility',\n description: 'The labels visibily available in the UI',\n table: {\n type: { summary: '\"text\" \| \"value\" \| \"none\" \| undefined' },\n defaultValue: { summary: undefined },\n },\n control: {\n type: 'text',\n },\n },\n },\n args: {\n variant: undefined,\n tickStep: 0.1,\n labelVisibility: undefined,\n },\n};\n\nexport interface StoryArgs {\n variant?: string;\n tickStep?: number;\n labelVisibility?: string;\n onInput?: (val: string) => void;\n onChange?: (val: string) => void;\n [prop: string]: unknown;\n}\n\nconst handleEvent =\n ({ onInput, onChange }: StoryArgs) =>\n (event: Event): void => {\n const { value } = event.target as Slider;\n if (onInput && event.type === 'input') {\n onInput(value.toString());\n } else if (onChange && event.type === 'change') {\n onChange(value.toString());\n }\n };\n\nconst handleHandleEvent =\n ({ onInput, onChange }: StoryArgs) =>\n (event: Event): void => {\n const target = event.target as SliderHandle;\n if (target.value != null) {\n if (typeof target.value === 'object') {\n const value = JSON.stringify(target.value, null, 2);\n if (onInput && event.type === 'input') {\n onInput(value);\n } else if (onChange && event.type === 'change') {\n onChange(value);\n }\n } else {\n const value = `${target.name}: ${target.value}`;\n if (onInput && event.type === 'input') {\n onInput(value);\n } else if (onChange && event.type === 'change') {\n onChange(value);\n }\n }\n }\n };\n\nexport const Default = (args: StoryArgs = {}): TemplateResult => {\n return html`\n <div style=\"width: 500px; margin: 12px 20px;\">\n <sp-slider\n max=\"1\"\n min=\"0\"\n value=\".5\"\n step=\"0.01\"\n @input=${handleEvent(args)}\n @change=${handleEvent(args)}\n .formatOptions=${{ style: 'percent' }}\n ...=${spreadProps(args)}\n >\n Opacity\n </sp-slider>\n </div>\n `;\n};\n\nexport const noVisibleTextLabel = (args: StoryArgs = {}): TemplateResult => {\n return html`\n <div style=\"width: 500px; margin: 12px 20px;\">\n <sp-slider\n max=\"1\"\n min=\"0\"\n value=\".5\"\n step=\"0.01\"\n @input=${handleEvent(args)}\n @change=${handleEvent(args)}\n .formatOptions=${{ style: 'percent' }}\n ...=${spreadProps(args)}\n >\n Opacity\n </sp-slider>\n </div>\n `;\n};\nnoVisibleTextLabel.args = {\n labelVisibility: 'value',\n};\n\nexport const noVisibleValueLabel = (args: StoryArgs = {}): TemplateResult => {\n return html`\n <div style=\"width: 500px; margin: 12px 20px;\">\n <sp-slider\n max=\"1\"\n min=\"0\"\n value=\".5\"\n step=\"0.01\"\n @input=${handleEvent(args)}\n @change=${handleEvent(args)}\n .formatOptions=${{ style: 'percent' }}\n ...=${spreadProps(args)}\n >\n Opacity\n </sp-slider>\n </div>\n `;\n};\nnoVisibleValueLabel.args = {\n labelVisibility: 'text',\n};\n\nexport const noVisibleLabels = (args: StoryArgs = {}): TemplateResult => {\n return html`\n <div style=\"width: 500px; margin: 12px 20px;\">\n <sp-slider\n max=\"1\"\n min=\"0\"\n value=\".5\"\n step=\"0.01\"\n @input=${handleEvent(args)}\n @change=${handleEvent(args)}\n .formatOptions=${{ style: 'percent' }}\n ...=${spreadProps(args)}\n >\n Opacity\n </sp-slider>\n </div>\n `;\n};\nnoVisibleLabels.args = {\n labelVisibility: 'none',\n};\n\nexport const px = (args: StoryArgs = {}): TemplateResult => {\n return html`\n <div style=\"width: 500px; margin: 12px 20px;\">\n <sp-slider\n max=\"360\"\n min=\"0\"\n value=\"90\"\n step=\"1\"\n @input=${handleEvent(args)}\n @change=${handleEvent(args)}\n .formatOptions=${{\n style: 'unit',\n unit: 'px',\n }}\n ...=${spreadProps(args)}\n >\n Angle\n </sp-slider>\n </div>\n `;\n};\n\nclass NumberFieldDefined extends HTMLElement {\n constructor() {\n super();\n this.numberFieldLoaderPromise = new Promise((res) => {\n customElements.whenDefined('sp-number-field').then(() => {\n res(true);\n });\n });\n }\n\n private numberFieldLoaderPromise: Promise<boolean> = Promise.resolve(false);\n\n get updateComplete(): Promise<boolean> {\n return this.numberFieldLoaderPromise;\n }\n}\n\ncustomElements.define('number-field-defined', NumberFieldDefined);\n\nconst editableDecorator = (story: () => TemplateResult): TemplateResult => {\n return html`\n ${story()}\n <number-field-defined></number-field-defined>\n `;\n};\n\nexport const editable = (args: StoryArgs = {}): TemplateResult => {\n return html`\n <div style=\"width: 500px; margin: 12px 20px;\">\n <sp-slider\n editable\n max=\"360\"\n min=\"0\"\n value=\"90\"\n step=\"1\"\n @input=${handleEvent(args)}\n @change=${handleEvent(args)}\n .formatOptions=${{\n style: 'unit',\n unit: 'degree',\n unitDisplay: 'narrow',\n }}\n ...=${spreadProps(args)}\n >\n Angle\n </sp-slider>\n </div>\n `;\n};\n\neditable.decorators = [editableDecorator];\n\nexport const editableDisabled = (args: StoryArgs = {}): TemplateResult => {\n return html`\n <div style=\"width: 500px; margin: 12px 20px;\">\n <sp-slider\n editable\n disabled\n max=\"360\"\n min=\"0\"\n value=\"90\"\n step=\"1\"\n @input=${handleEvent(args)}\n @change=${handleEvent(args)}\n .formatOptions=${{\n style: 'unit',\n unit: 'degree',\n unitDisplay: 'narrow',\n }}\n ...=${spreadProps(args)}\n >\n Angle\n </sp-slider>\n </div>\n `;\n};\n\neditable.decorators = [editableDecorator];\n\nexport const editableCustom = (args: StoryArgs = {}): TemplateResult => {\n return html`\n <div\n style=\"width: 500px; margin: 12px 20px; --spectrum-slider-editable-number-field-width: 150px;\"\n >\n <sp-slider\n editable\n max=\"24\"\n min=\"0\"\n value=\"12.75\"\n step=\"0.25\"\n @input=${handleEvent(args)}\n @change=${handleEvent(args)}\n .formatOptions=${{ style: 'unit', unit: 'hour' }}\n ...=${spreadProps(args)}\n >\n Hours\n </sp-slider>\n </div>\n `;\n};\n\neditableCustom.decorators = [editableDecorator];\n\nexport const hideStepper = (args: StoryArgs = {}): TemplateResult => {\n return html`\n <div style=\"width: 500px; margin: 12px 20px;\">\n <sp-slider\n editable\n hide-stepper\n max=\"1\"\n min=\"0\"\n value=\".5\"\n step=\"0.01\"\n @input=${handleEvent(args)}\n @change=${handleEvent(args)}\n .formatOptions=${{ style: 'percent' }}\n ...=${spreadProps(args)}\n >\n Opacity\n </sp-slider>\n </div>\n `;\n};\n\nhideStepper.decorators = [editableDecorator];\n\nexport const Gradient = (args: StoryArgs = {}): TemplateResult => {\n return html`\n <div\n style=\"\n width: 500px;\n margin: 12px 20px;\n --spectrum-slider-track-color:linear-gradient(to right, red, green 100%);\n --spectrum-slider-track-color-rtl:linear-gradient(to left, red, green 100%);\n \"\n >\n <sp-slider\n label=\"Opacity\"\n max=\"100\"\n min=\"0\"\n value=\"50\"\n id=\"opacity-slider\"\n @input=${handleEvent(args)}\n @change=${handleEvent(args)}\n ...=${spreadProps(args)}\n ></sp-slider>\n </div>\n `;\n};\nGradient.args = {\n variant: undefined,\n};\n\nexport const tick = (args: StoryArgs = {}): TemplateResult => {\n return html`\n <sp-slider\n label=\"Slider Label\"\n variant=\"tick\"\n min=\"0\"\n max=\"92\"\n ...=${spreadProps(args)}\n ></sp-slider>\n `;\n};\ntick.args = {\n variant: 'tick',\n tickStep: 5,\n};\n\nexport const tickLabels = (args: StoryArgs = {}): TemplateResult => {\n return html`\n <sp-slider\n label=\"Slider Label\"\n tick-labels\n variant=\"tick\"\n min=\"50\"\n max=\"75\"\n ...=${spreadProps(args)}\n ></sp-slider>\n `;\n};\ntickLabels.args = {\n variant: 'tick',\n tickStep: 5,\n};\n\nexport const Disabled = (args: StoryArgs = {}): TemplateResult => {\n return html`\n <div style=\"width: 500px; margin: 12px 20px;\">\n <sp-slider\n disabled\n value=\"5\"\n step=\"0.5\"\n min=\"0\"\n max=\"20\"\n label=\"Intensity\"\n ...=${spreadProps(args)}\n ></sp-slider>\n </div>\n `;\n};\n\nexport const Quiet = (args: StoryArgs = {}): TemplateResult => {\n return html`\n <div style=\"width: 500px; margin: 12px 20px;\">\n <sp-slider\n editable\n hide-stepper\n quiet\n value=\"5\"\n step=\"0.5\"\n min=\"0\"\n max=\"20\"\n label=\"Intensity\"\n ...=${spreadProps(args)}\n ></sp-slider>\n </div>\n `;\n};\n\nexport const Indeterminate = (args: StoryArgs = {}): TemplateResult => {\n return html`\n <div style=\"width: 500px; margin: 12px 20px;\">\n <sp-slider\n editable\n indeterminate\n value=\"5\"\n step=\"0.5\"\n min=\"0\"\n max=\"20\"\n label=\"Intensity\"\n @input=${handleEvent(args)}\n @change=${handleEvent(args)}\n ...=${spreadProps(args)}\n ></sp-slider>\n </div>\n `;\n};\n\nexport const ExplicitHandle = (args: StoryArgs = {}): TemplateResult => {\n return html`\n <div style=\"width: 500px; margin: 12px 20px;\">\n <sp-slider\n step=\"0.5\"\n min=\"0\"\n max=\"20\"\n @input=${handleHandleEvent(args)}\n @change=${handleHandleEvent(args)}\n ...=${spreadProps(args)}\n >\n Intensity\n <sp-slider-handle slot=\"handle\" value=\"5\"></sp-slider-handle>\n </sp-slider>\n </div>\n `;\n};\n\nexport const TwoHandles = (args: StoryArgs = {}): TemplateResult => {\n return html`\n <div style=\"width: 500px; margin: 12px 20px;\">\n <sp-slider\n value=\"5\"\n step=\"1\"\n min=\"0\"\n max=\"255\"\n @input=${handleHandleEvent(args)}\n @change=${handleHandleEvent(args)}\n ...=${spreadProps(args)}\n >\n Output Levels\n <sp-slider-handle\n slot=\"handle\"\n name=\"min\"\n value=\"5\"\n ></sp-slider-handle>\n <sp-slider-handle\n slot=\"handle\"\n name=\"max\"\n value=\"250\"\n ></sp-slider-handle>\n </sp-slider>\n </div>\n `;\n};\nTwoHandles.args = {\n variant: 'range',\n tickStep: 10,\n};\n\nexport const TwoHandlesPt = (args: StoryArgs = {}): TemplateResult => {\n return html`\n <div style=\"width: 500px; margin: 12px 20px;\">\n <sp-slider\n value=\"5\"\n step=\"1\"\n min=\"0\"\n max=\"255\"\n @input=${handleHandleEvent(args)}\n @change=${handleHandleEvent(args)}\n .formatOptions=${{\n style: 'unit',\n unit: 'pt',\n }}\n ...=${spreadProps(args)}\n >\n Output Levels\n <sp-slider-handle\n slot=\"handle\"\n name=\"min\"\n value=\"5\"\n ></sp-slider-handle>\n <sp-slider-handle\n slot=\"handle\"\n name=\"max\"\n value=\"250\"\n ></sp-slider-handle>\n </sp-slider>\n </div>\n `;\n};\nTwoHandlesPt.args = {\n variant: 'range',\n tickStep: 10,\n};\n\nexport const ThreeHandlesPc = (args: StoryArgs = {}): TemplateResult => {\n return html`\n <div style=\"width: 500px; margin: 12px 20px;\">\n <sp-slider\n value=\"5\"\n step=\"1\"\n min=\"0\"\n max=\"255\"\n @input=${handleHandleEvent(args)}\n @change=${handleHandleEvent(args)}\n .formatOptions=${{\n style: 'unit',\n unit: 'pc',\n }}\n ...=${spreadProps(args)}\n >\n Output Levels\n <sp-slider-handle slot=\"handle\" value=\"5\"></sp-slider-handle>\n <sp-slider-handle slot=\"handle\" value=\"133\"></sp-slider-handle>\n <sp-slider-handle slot=\"handle\" value=\"250\"></sp-slider-handle>\n </sp-slider>\n </div>\n `;\n};\n\nexport const ThreeHandlesOrdered = (args: StoryArgs = {}): TemplateResult => {\n return html`\n <div style=\"width: 500px; margin: 12px 20px;\">\n <sp-slider\n step=\"1\"\n min=\"0\"\n max=\"255\"\n @input=${handleHandleEvent(args)}\n @change=${handleHandleEvent(args)}\n ...=${spreadProps(args)}\n >\n Output Levels\n <sp-slider-handle\n slot=\"handle\"\n name=\"low\"\n value=\"5\"\n max=\"next\"\n ></sp-slider-handle>\n <sp-slider-handle\n slot=\"handle\"\n name=\"mid\"\n value=\"100\"\n min=\"previous\"\n max=\"next\"\n ></sp-slider-handle>\n <sp-slider-handle\n slot=\"handle\"\n name=\"high\"\n value=\"250\"\n min=\"previous\"\n ></sp-slider-handle>\n </sp-slider>\n </div>\n `;\n};\nThreeHandlesOrdered.args = {\n tickStep: 10,\n};\n\n// This is a very complex example from an actual application.\n//\n// The first and last handles go from 0 to 255 in a linear fashion.\n// The last and first handles are ordered so that the last handle\n// must be greater than or equal to the first handle.\n//\n// The middle handle's range goes from 9.99 to 0.01, counting down.\n// the middle handle's limits are set by the outer handles such that\n// the position of the left handle is the staring value (9.99) for the\n// middle handle. And the position of the right handle is the end\n// value (0.01). That means that the middle handle will move\n// proportionally as you move the outer handles.\n//\n// The two other interesting features of the middle handle are that\n// it counts down, and that it does so exponentially for the first\n// half of its range.\n//\n// Because the specification for the <input> tag in HTML says that the\n// min should be less than the max, we do a double normalization to make\n// this work. The middle handle is considered to go between 0 and 1,\n// where 0 is the left handle's position and 1 is the right handle's\n// position. We then do the appropriate calculation to convert that\n// value into one between 9.99 and 0.01 for display to the user.\n//\n// One iteresting thing to note is that the normalization function\n// can also be used to enforce clamping.\n//\nexport const ThreeHandlesComplex = (args: StoryArgs = {}): TemplateResult => {\n const values: { [key: string]: number } = {\n black: 50,\n gray: 4.98,\n white: 225,\n };\n const handleEvent =\n ({ onInput, onChange }: StoryArgs) =>\n (event: Event): void => {\n const target = event.target as SliderHandle;\n if (target.value != null) {\n if (typeof target.value === 'object') {\n const value = JSON.stringify(target.value, null, 2);\n if (onInput && event.type === 'input') {\n onInput(value);\n } else if (onChange && event.type === 'change') {\n onChange(value);\n }\n } else {\n const value = `${target.name}: ${target.value}`;\n if (onInput && event.type === 'input') {\n onInput(value);\n } else if (onChange && event.type === 'change') {\n onChange(value);\n }\n }\n values[target.name] = target.value;\n }\n };\n const grayNormalization = {\n toNormalized(value: number) {\n const normalizedBlack = values.black / 255;\n const normalizedWhite = values.white / 255;\n const clamped = Math.max(Math.min(value, 1), 0);\n return (\n clamped * (normalizedWhite - normalizedBlack) + normalizedBlack\n );\n },\n fromNormalized(value: number) {\n const normalizedBlack = values.black / 255;\n const normalizedWhite = values.white / 255;\n const clamped = Math.max(\n Math.min(value, normalizedWhite),\n normalizedBlack\n );\n\n return (\n (clamped - normalizedBlack) /\n (normalizedWhite - normalizedBlack)\n );\n },\n };\n const blackNormalization = {\n toNormalized(value: number) {\n const clamped = Math.min(value, values.white);\n return clamped / 255;\n },\n fromNormalized(value: number) {\n const denormalized = value * 255;\n return Math.min(denormalized, values.white);\n },\n };\n const whiteNormalization = {\n toNormalized(value: number) {\n const clamped = Math.max(value, values.black);\n return clamped / 255;\n },\n fromNormalized(value: number) {\n const denormalized = value * 255;\n return Math.max(denormalized, values.black);\n },\n };\n const computeGray = (value: number): string => {\n let result = 1.0;\n if (value > 0.5) {\n result = Math.max(2 * (1 - value), 0.01);\n } else if (value < 0.5) {\n result = ((1 - 2 * value) * (Math.sqrt(9.99) - 1) + 1) ** 2;\n }\n const formatOptions = {\n maximumFractionDigits: 2,\n minimumFractionDigits: 2,\n };\n return new Intl.NumberFormat(navigator.language, formatOptions).format(\n result\n );\n };\n return html`\n <div style=\"width: 500px; margin: 12px 20px;\">\n <sp-slider\n step=\"1\"\n min=\"0\"\n max=\"255\"\n @input=${handleEvent}\n @change=${handleEvent}\n ...=${spreadProps(args)}\n >\n Output Levels\n <sp-slider-handle\n slot=\"handle\"\n name=\"black\"\n value=${values.black}\n .normalization=${blackNormalization}\n ></sp-slider-handle>\n <sp-slider-handle\n slot=\"handle\"\n name=\"gray\"\n value=\"0.215\"\n min=\"0\"\n max=\"1\"\n step=\"0.005\"\n .normalization=${grayNormalization}\n .getAriaHandleText=${computeGray}\n ></sp-slider-handle>\n <sp-slider-handle\n slot=\"handle\"\n name=\"white\"\n value=${values.white}\n .normalization=${whiteNormalization}\n ></sp-slider-handle>\n </sp-slider>\n </div>\n `;\n};\nThreeHandlesOrdered.args = {\n tickStep: 10,\n};\n\nexport const focusTabDemo = (args: StoryArgs = {}): TemplateResult => {\n const value = 50;\n const min = 0;\n const max = 100;\n const step = 1;\n return html`\n <div style=\"width: 500px; margin: 12px 20px 20px;\">\n <sp-slider\n value=\"${value}\"\n step=\"${step}\"\n min=\"${min}\"\n max=\"${max}\"\n label=\"Opacity\"\n id=\"opacity-slider-opacity\"\n ...=${spreadProps(args)}\n ></sp-slider>\n </div>\n <div style=\"width: 500px; margin: 20px;\">\n <sp-slider\n value=\"${value}\"\n step=\"${step}\"\n min=\"${min}\"\n max=\"${max}\"\n label=\"Lightness\"\n id=\"opacity-slider-lightness\"\n ...=${spreadProps(args)}\n ></sp-slider>\n </div>\n <div style=\"width: 500px; margin: 20px 20px 12px;\">\n <sp-slider\n value=\"${value}\"\n step=\"${step}\"\n min=\"${min}\"\n max=\"${max}\"\n label=\"Saturation\"\n id=\"opacity-slider-saturation\"\n ...=${spreadProps(args)}\n ></sp-slider>\n </div>\n `;\n};\n"]}

package/test/slider-editable.test.js CHANGED Viewed

@@ -10,7 +10,7 @@ OF ANY KIND, either express or implied. See the License for the specific languag
 governing permissions and limitations under the License.
 */
 import '../sp-slider.js';
-import { editable, hideStepper } from '../stories/slider.stories.js';
+import { editable, hideStepper, Indeterminate, } from '../stories/slider.stories.js';
 import { elementUpdated, expect, fixture } from '@open-wc/testing';
 import { sendKeys } from '@web/test-runner-commands';
 import { spy } from 'sinon';
@@ -45,6 +45,21 @@ describe('Slider - editable', () => {
         await expect(el).to.be.accessible();
         el.remove();
     });
+    it('toggles indeterminate when edited via the `<sp-number-field>`', async () => {
+        const el = await sliderFromFixture(Indeterminate);
+        await elementUpdated(el);
+        expect(el.value).to.equal(5);
+        expect(el.indeterminate).to.be.true;
+        el.focus();
+        await elementUpdated(el);
+        await sendKeys({ press: 'Backspace' });
+        await sendKeys({ press: 'Backspace' });
+        await sendKeys({ type: '15' });
+        await sendKeys({ press: 'Enter' });
+        await elementUpdated(el);
+        expect(el.value).to.equal(15);
+        expect(el.indeterminate).to.be.false;
+    });
     it('focuses `<sp-number-field>` directly', async () => {
         const el = await sliderFromFixture(editable);
         await elementUpdated(el);

package/test/slider-editable.test.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"slider-editable.test.js","sourceRoot":"","sources":["slider-editable.test.ts"],"names":[],"mappings":"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","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 '../sp-slider.js';\nimport { Slider } from '../';\nimport { editable, hideStepper, StoryArgs } from '../stories/slider.stories.js';\nimport { elementUpdated, expect, fixture } from '@open-wc/testing';\nimport { TemplateResult } from '@spectrum-web-components/base';\nimport { sendKeys } from '@web/test-runner-commands';\nimport { spy } from 'sinon';\n\nasync function sliderFromFixture(\n sliderFixture: (args: StoryArgs) => TemplateResult\n): Promise<Slider> {\n const el = await fixture<Slider>(sliderFixture({}));\n const slider = el.querySelector('sp-slider') as Slider;\n return slider;\n}\n\ndescribe('Slider - editable', () => {\n it('loads', async () => {\n const el = await sliderFromFixture(editable);\n\n await elementUpdated(el);\n\n await expect(el).to.be.accessible();\n });\n\n it('loads - [hide-stepper]', async () => {\n const el = await sliderFromFixture(hideStepper);\n\n await elementUpdated(el);\n\n await expect(el).to.be.accessible();\n });\n\n it('loads - [disabled]', async () => {\n const el = document.createElement('sp-slider');\n el.editable = true;\n el.disabled = true;\n el.label = 'Disabled, editable, slider';\n\n try {\n document.body.append(el);\n } catch (error) {\n expect(true).to.be.false;\n }\n\n await elementUpdated(el);\n\n await expect(el).to.be.accessible();\n el.remove();\n });\n\n it('focuses `<sp-number-field>` directly', async () => {\n const el = await sliderFromFixture(editable);\n\n await elementUpdated(el);\n\n el.focus();\n\n await elementUpdated(el);\n\n expect(el.shadowRoot.activeElement).to.equal(el.numberField);\n });\n\n it('edits via the `<sp-number-field>`', async () => {\n const inputSpy = spy();\n const changeSpy = spy();\n const el = await sliderFromFixture(editable);\n el.addEventListener('input', () => inputSpy());\n el.addEventListener('change', () => changeSpy());\n\n await elementUpdated(el);\n\n el.focus();\n\n await elementUpdated(el);\n\n expect(el.shadowRoot.activeElement).to.equal(el.numberField);\n expect(el.value).to.equal(90);\n\n await sendKeys({ press: 'Backspace' });\n await sendKeys({ press: 'Backspace' });\n await sendKeys({ press: 'Backspace' });\n await sendKeys({ type: '45' });\n await sendKeys({ press: 'Enter' });\n\n await elementUpdated(el);\n\n expect(el.shadowRoot.activeElement).to.equal(el.numberField);\n expect(el.value).to.equal(45);\n expect(inputSpy.callCount, 'one input').to.equal(1);\n expect(changeSpy.callCount, 'one change').to.equal(1);\n\n await sendKeys({ press: 'Backspace' });\n await sendKeys({ press: 'Backspace' });\n await sendKeys({ press: 'Backspace' });\n await sendKeys({ press: 'Enter' });\n\n expect(el.shadowRoot.activeElement).to.equal(el.numberField);\n expect(el.value).to.equal(45);\n expect(inputSpy.callCount, 'still one input').to.equal(1);\n expect(changeSpy.callCount, 'still one change').to.equal(1);\n });\n\n it('focuses `<input>` after pointer interactions', async () => {\n let pointerId = -1;\n const el = await sliderFromFixture(editable);\n\n await elementUpdated(el);\n\n expect(el.dragging).to.be.false;\n expect(el.highlight).to.be.false;\n expect(pointerId).to.equal(-1);\n\n const handle = el.shadowRoot.querySelector('.handle') as HTMLDivElement;\n el.track.setPointerCapture = (id: number) => (pointerId = id);\n el.track.releasePointerCapture = (id: number) => (pointerId = id);\n handle.dispatchEvent(\n new PointerEvent('pointerdown', {\n button: 1,\n pointerId: 1,\n cancelable: true,\n bubbles: true,\n composed: true,\n })\n );\n await elementUpdated(el);\n\n expect(el.dragging).to.be.false;\n expect(pointerId, '1').to.equal(-1);\n\n handle.dispatchEvent(\n new PointerEvent('pointerdown', {\n button: 0,\n pointerId: 1,\n cancelable: true,\n bubbles: true,\n composed: true,\n })\n );\n await elementUpdated(el);\n\n expect(el.dragging, 'it is dragging 1').to.be.true;\n expect(pointerId, '2').to.equal(1);\n\n handle.dispatchEvent(\n new PointerEvent('pointerup', {\n pointerId: 2,\n cancelable: true,\n bubbles: true,\n composed: true,\n })\n );\n await elementUpdated(el);\n\n expect(el.dragging).to.be.false;\n expect(el.highlight).to.be.false;\n expect(pointerId, '3').to.equal(2);\n\n handle.dispatchEvent(\n new PointerEvent('pointerdown', {\n button: 0,\n pointerId: 1,\n cancelable: true,\n bubbles: true,\n composed: true,\n })\n );\n await elementUpdated(el);\n\n expect(el.dragging, 'it is dragging 2').to.be.true;\n expect(pointerId, '4').to.equal(1);\n\n handle.dispatchEvent(\n new PointerEvent('pointercancel', {\n pointerId: 3,\n cancelable: true,\n bubbles: true,\n composed: true,\n })\n );\n await elementUpdated(el);\n\n expect(el.dragging).to.be.false;\n expect(pointerId, '5').to.equal(3);\n expect(el.shadowRoot.activeElement).to.equal(\n el.handleController.inputForHandle(el)\n );\n });\n});\n"]}
1	+ {"version":3,"file":"slider-editable.test.js","sourceRoot":"","sources":["slider-editable.test.ts"],"names":[],"mappings":"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","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 '../sp-slider.js';\nimport { Slider } from '../';\nimport {\n editable,\n hideStepper,\n Indeterminate,\n StoryArgs,\n} from '../stories/slider.stories.js';\nimport { elementUpdated, expect, fixture } from '@open-wc/testing';\nimport { TemplateResult } from '@spectrum-web-components/base';\nimport { sendKeys } from '@web/test-runner-commands';\nimport { spy } from 'sinon';\n\nasync function sliderFromFixture(\n sliderFixture: (args: StoryArgs) => TemplateResult\n): Promise<Slider> {\n const el = await fixture<Slider>(sliderFixture({}));\n const slider = el.querySelector('sp-slider') as Slider;\n return slider;\n}\n\ndescribe('Slider - editable', () => {\n it('loads', async () => {\n const el = await sliderFromFixture(editable);\n\n await elementUpdated(el);\n\n await expect(el).to.be.accessible();\n });\n\n it('loads - [hide-stepper]', async () => {\n const el = await sliderFromFixture(hideStepper);\n\n await elementUpdated(el);\n\n await expect(el).to.be.accessible();\n });\n\n it('loads - [disabled]', async () => {\n const el = document.createElement('sp-slider');\n el.editable = true;\n el.disabled = true;\n el.label = 'Disabled, editable, slider';\n\n try {\n document.body.append(el);\n } catch (error) {\n expect(true).to.be.false;\n }\n\n await elementUpdated(el);\n\n await expect(el).to.be.accessible();\n el.remove();\n });\n\n it('toggles indeterminate when edited via the `<sp-number-field>`', async () => {\n const el = await sliderFromFixture(Indeterminate);\n\n await elementUpdated(el);\n\n expect(el.value).to.equal(5);\n expect(el.indeterminate).to.be.true;\n\n el.focus();\n\n await elementUpdated(el);\n\n await sendKeys({ press: 'Backspace' });\n await sendKeys({ press: 'Backspace' });\n await sendKeys({ type: '15' });\n await sendKeys({ press: 'Enter' });\n\n await elementUpdated(el);\n\n expect(el.value).to.equal(15);\n expect(el.indeterminate).to.be.false;\n });\n\n it('focuses `<sp-number-field>` directly', async () => {\n const el = await sliderFromFixture(editable);\n\n await elementUpdated(el);\n\n el.focus();\n\n await elementUpdated(el);\n\n expect(el.shadowRoot.activeElement).to.equal(el.numberField);\n });\n\n it('edits via the `<sp-number-field>`', async () => {\n const inputSpy = spy();\n const changeSpy = spy();\n const el = await sliderFromFixture(editable);\n el.addEventListener('input', () => inputSpy());\n el.addEventListener('change', () => changeSpy());\n\n await elementUpdated(el);\n\n el.focus();\n\n await elementUpdated(el);\n\n expect(el.shadowRoot.activeElement).to.equal(el.numberField);\n expect(el.value).to.equal(90);\n\n await sendKeys({ press: 'Backspace' });\n await sendKeys({ press: 'Backspace' });\n await sendKeys({ press: 'Backspace' });\n await sendKeys({ type: '45' });\n await sendKeys({ press: 'Enter' });\n\n await elementUpdated(el);\n\n expect(el.shadowRoot.activeElement).to.equal(el.numberField);\n expect(el.value).to.equal(45);\n expect(inputSpy.callCount, 'one input').to.equal(1);\n expect(changeSpy.callCount, 'one change').to.equal(1);\n\n await sendKeys({ press: 'Backspace' });\n await sendKeys({ press: 'Backspace' });\n await sendKeys({ press: 'Backspace' });\n await sendKeys({ press: 'Enter' });\n\n expect(el.shadowRoot.activeElement).to.equal(el.numberField);\n expect(el.value).to.equal(45);\n expect(inputSpy.callCount, 'still one input').to.equal(1);\n expect(changeSpy.callCount, 'still one change').to.equal(1);\n });\n\n it('focuses `<input>` after pointer interactions', async () => {\n let pointerId = -1;\n const el = await sliderFromFixture(editable);\n\n await elementUpdated(el);\n\n expect(el.dragging).to.be.false;\n expect(el.highlight).to.be.false;\n expect(pointerId).to.equal(-1);\n\n const handle = el.shadowRoot.querySelector('.handle') as HTMLDivElement;\n el.track.setPointerCapture = (id: number) => (pointerId = id);\n el.track.releasePointerCapture = (id: number) => (pointerId = id);\n handle.dispatchEvent(\n new PointerEvent('pointerdown', {\n button: 1,\n pointerId: 1,\n cancelable: true,\n bubbles: true,\n composed: true,\n })\n );\n await elementUpdated(el);\n\n expect(el.dragging).to.be.false;\n expect(pointerId, '1').to.equal(-1);\n\n handle.dispatchEvent(\n new PointerEvent('pointerdown', {\n button: 0,\n pointerId: 1,\n cancelable: true,\n bubbles: true,\n composed: true,\n })\n );\n await elementUpdated(el);\n\n expect(el.dragging, 'it is dragging 1').to.be.true;\n expect(pointerId, '2').to.equal(1);\n\n handle.dispatchEvent(\n new PointerEvent('pointerup', {\n pointerId: 2,\n cancelable: true,\n bubbles: true,\n composed: true,\n })\n );\n await elementUpdated(el);\n\n expect(el.dragging).to.be.false;\n expect(el.highlight).to.be.false;\n expect(pointerId, '3').to.equal(2);\n\n handle.dispatchEvent(\n new PointerEvent('pointerdown', {\n button: 0,\n pointerId: 1,\n cancelable: true,\n bubbles: true,\n composed: true,\n })\n );\n await elementUpdated(el);\n\n expect(el.dragging, 'it is dragging 2').to.be.true;\n expect(pointerId, '4').to.equal(1);\n\n handle.dispatchEvent(\n new PointerEvent('pointercancel', {\n pointerId: 3,\n cancelable: true,\n bubbles: true,\n composed: true,\n })\n );\n await elementUpdated(el);\n\n expect(el.dragging).to.be.false;\n expect(pointerId, '5').to.equal(3);\n expect(el.shadowRoot.activeElement).to.equal(\n el.handleController.inputForHandle(el)\n );\n });\n});\n"]}