@spectrum-web-components/slider 1.1.0-beta.8 → 1.1.0-beta.9
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.
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@spectrum-web-components/slider",
|
|
3
|
-
"version": "1.1.0-beta.
|
|
3
|
+
"version": "1.1.0-beta.9",
|
|
4
4
|
"publishConfig": {
|
|
5
5
|
"access": "public"
|
|
6
6
|
},
|
|
@@ -76,12 +76,12 @@
|
|
|
76
76
|
"dependencies": {
|
|
77
77
|
"@internationalized/number": "^3.1.0",
|
|
78
78
|
"@lit-labs/observers": "^2.0.2",
|
|
79
|
-
"@spectrum-web-components/base": "^1.1.0-beta.
|
|
80
|
-
"@spectrum-web-components/field-label": "^1.1.0-beta.
|
|
81
|
-
"@spectrum-web-components/number-field": "^1.1.0-beta.
|
|
82
|
-
"@spectrum-web-components/reactive-controllers": "^1.1.0-beta.
|
|
83
|
-
"@spectrum-web-components/shared": "^1.1.0-beta.
|
|
84
|
-
"@spectrum-web-components/theme": "^1.1.0-beta.
|
|
79
|
+
"@spectrum-web-components/base": "^1.1.0-beta.9",
|
|
80
|
+
"@spectrum-web-components/field-label": "^1.1.0-beta.9",
|
|
81
|
+
"@spectrum-web-components/number-field": "^1.1.0-beta.9",
|
|
82
|
+
"@spectrum-web-components/reactive-controllers": "^1.1.0-beta.9",
|
|
83
|
+
"@spectrum-web-components/shared": "^1.1.0-beta.9",
|
|
84
|
+
"@spectrum-web-components/theme": "^1.1.0-beta.9"
|
|
85
85
|
},
|
|
86
86
|
"devDependencies": {
|
|
87
87
|
"@spectrum-css/slider": "^6.0.0-s2-foundations.17"
|
|
@@ -93,5 +93,5 @@
|
|
|
93
93
|
"./**/*.dev.js",
|
|
94
94
|
"./sync/sp-*.js"
|
|
95
95
|
],
|
|
96
|
-
"gitHead": "
|
|
96
|
+
"gitHead": "56bdfbc0a26b76ff7c3ee454478d5ebd2a4d33dc"
|
|
97
97
|
}
|
|
@@ -411,6 +411,7 @@ export class HandleController {
|
|
|
411
411
|
aria-disabled=${ifDefined(
|
|
412
412
|
this.host.disabled ? "true" : void 0
|
|
413
413
|
)}
|
|
414
|
+
tabindex=${ifDefined(this.host.editable ? -1 : void 0)}
|
|
414
415
|
aria-label=${ifDefined(model.ariaLabel)}
|
|
415
416
|
aria-labelledby=${ariaLabelledBy}
|
|
416
417
|
aria-valuetext=${this.formattedValueForHandle(model)}
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["HandleController.ts"],
|
|
4
|
-
"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.dev.js'\nimport { SliderHandle, SliderNormalization } from './SliderHandle.dev.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 {\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 const _forcedUnit =\n handle._forcedUnit === ''\n ? this.host._forcedUnit\n : handle._forcedUnit;\n return (\n handle.getAriaHandleText(model.value, numberFormat) + _forcedUnit\n );\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 !input ||\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 public get activeHandleModel(): ModelValue {\n const active = this.activeHandle;\n return this.model.find((model) => model.name === active)!;\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 /**\n * @description check for defaultvalue(value) property in sp-slider and reset on double click on sliderHandle\n * @param event\n */\n public handleDoubleClick(event: PointerEvent): void {\n const input = (event.target as Element).querySelector(\n '.input'\n ) as InputWithModel;\n\n if (input.model?.handle.defaultValue !== undefined) {\n input.model.handle.value = input.model.handle.defaultValue;\n this.dispatchChangeEvent(input, input.model.handle);\n input.model.handle.dispatchInputEvent();\n this.requestUpdate();\n }\n }\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 if (event.pointerType === 'mouse') {\n this.host.labelEl.click();\n }\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 if (event.pointerType === 'mouse') {\n this.host.labelEl.click();\n }\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 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: KeyboardEvent): void => {\n if (event.key == 'Escape') {\n const input = event.target as InputWithModel;\n if (\n input.model.handle?.defaultValue !== undefined &&\n input.model.handle.value !== input.model.handle.defaultValue\n ) {\n input.model.handle.value = input.model.handle.defaultValue;\n input.model.handle.dispatchInputEvent();\n this.dispatchChangeEvent(input, input.model.handle);\n this.requestUpdate();\n event.preventDefault();\n event.stopPropagation();\n }\n return;\n }\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 ...(isMultiHandle && {\n 'background-color': `var(--spectrum-slider-handle-background-color-${index}, var(--spectrum-slider-handle-background-color))`,\n 'border-color': `var(--spectrum-slider-handle-border-color-${index}, var(--spectrum-slider-handle-border-color))`,\n }),\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 aria-label=${ifDefined(model.ariaLabel)}\n aria-labelledby=${ariaLabelledBy}\n aria-valuetext=${this.formattedValueForHandle(model)}\n aria-describedby=\"slider-description\"\n @change=${this.onInputChange}\n @focus=${this.onInputFocus}\n @blur=${this.onInputBlur}\n @keydown=${this.onInputKeydown}\n .model=${model}\n />\n <span id=\"slider-description\">\n Press escape or double click to reset the slider to its\n default value.\n </span>\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) + 2;\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 }\n if (window.__swc.DEBUG) {\n if (!previous) {\n window.__swc.warn(\n this.host,\n '<sp-slider-handle> elements that are the first child of an <sp-slider> element cannot have attribute \"min=\\'previous\\'\"`',\n 'https://opensource.adobe.com/spectrum-web-components/components/slider-handle/#multi-handle-slider-with-ordered-handles'\n );\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 }\n if (window.__swc.DEBUG) {\n if (!next) {\n window.__swc.warn(\n this.host,\n '<sp-slider-handle> elements that are the last child of an <sp-slider> element cannot have attribute \"max=\\'next\\'\"',\n 'https://opensource.adobe.com/spectrum-web-components/components/slider-handle/#multi-handle-slider-with-ordered-handles'\n );\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"],
|
|
5
|
-
"mappings": "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",
|
|
4
|
+
"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.dev.js'\nimport { SliderHandle, SliderNormalization } from './SliderHandle.dev.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 {\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 const _forcedUnit =\n handle._forcedUnit === ''\n ? this.host._forcedUnit\n : handle._forcedUnit;\n return (\n handle.getAriaHandleText(model.value, numberFormat) + _forcedUnit\n );\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 !input ||\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 public get activeHandleModel(): ModelValue {\n const active = this.activeHandle;\n return this.model.find((model) => model.name === active)!;\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 /**\n * @description check for defaultvalue(value) property in sp-slider and reset on double click on sliderHandle\n * @param event\n */\n public handleDoubleClick(event: PointerEvent): void {\n const input = (event.target as Element).querySelector(\n '.input'\n ) as InputWithModel;\n\n if (input.model?.handle.defaultValue !== undefined) {\n input.model.handle.value = input.model.handle.defaultValue;\n this.dispatchChangeEvent(input, input.model.handle);\n input.model.handle.dispatchInputEvent();\n this.requestUpdate();\n }\n }\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 if (event.pointerType === 'mouse') {\n this.host.labelEl.click();\n }\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 if (event.pointerType === 'mouse') {\n this.host.labelEl.click();\n }\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 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: KeyboardEvent): void => {\n if (event.key == 'Escape') {\n const input = event.target as InputWithModel;\n if (\n input.model.handle?.defaultValue !== undefined &&\n input.model.handle.value !== input.model.handle.defaultValue\n ) {\n input.model.handle.value = input.model.handle.defaultValue;\n input.model.handle.dispatchInputEvent();\n this.dispatchChangeEvent(input, input.model.handle);\n this.requestUpdate();\n event.preventDefault();\n event.stopPropagation();\n }\n return;\n }\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 ...(isMultiHandle && {\n 'background-color': `var(--spectrum-slider-handle-background-color-${index}, var(--spectrum-slider-handle-background-color))`,\n 'border-color': `var(--spectrum-slider-handle-border-color-${index}, var(--spectrum-slider-handle-border-color))`,\n }),\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 aria-describedby=\"slider-description\"\n @change=${this.onInputChange}\n @focus=${this.onInputFocus}\n @blur=${this.onInputBlur}\n @keydown=${this.onInputKeydown}\n .model=${model}\n />\n <span id=\"slider-description\">\n Press escape or double click to reset the slider to its\n default value.\n </span>\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) + 2;\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 }\n if (window.__swc.DEBUG) {\n if (!previous) {\n window.__swc.warn(\n this.host,\n '<sp-slider-handle> elements that are the first child of an <sp-slider> element cannot have attribute \"min=\\'previous\\'\"`',\n 'https://opensource.adobe.com/spectrum-web-components/components/slider-handle/#multi-handle-slider-with-ordered-handles'\n );\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 }\n if (window.__swc.DEBUG) {\n if (!next) {\n window.__swc.warn(\n this.host,\n '<sp-slider-handle> elements that are the last child of an <sp-slider> element cannot have attribute \"max=\\'next\\'\"',\n 'https://opensource.adobe.com/spectrum-web-components/components/slider-handle/#multi-handle-slider-with-ordered-handles'\n );\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"],
|
|
5
|
+
"mappings": "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",
|
|
6
6
|
"names": ["input"]
|
|
7
7
|
}
|
package/src/HandleController.js
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["HandleController.ts"],
|
|
4
|
-
"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 { SliderHandle, SliderNormalization } 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 {\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 const _forcedUnit =\n handle._forcedUnit === ''\n ? this.host._forcedUnit\n : handle._forcedUnit;\n return (\n handle.getAriaHandleText(model.value, numberFormat) + _forcedUnit\n );\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 !input ||\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 public get activeHandleModel(): ModelValue {\n const active = this.activeHandle;\n return this.model.find((model) => model.name === active)!;\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 /**\n * @description check for defaultvalue(value) property in sp-slider and reset on double click on sliderHandle\n * @param event\n */\n public handleDoubleClick(event: PointerEvent): void {\n const input = (event.target as Element).querySelector(\n '.input'\n ) as InputWithModel;\n\n if (input.model?.handle.defaultValue !== undefined) {\n input.model.handle.value = input.model.handle.defaultValue;\n this.dispatchChangeEvent(input, input.model.handle);\n input.model.handle.dispatchInputEvent();\n this.requestUpdate();\n }\n }\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 if (event.pointerType === 'mouse') {\n this.host.labelEl.click();\n }\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 if (event.pointerType === 'mouse') {\n this.host.labelEl.click();\n }\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 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: KeyboardEvent): void => {\n if (event.key == 'Escape') {\n const input = event.target as InputWithModel;\n if (\n input.model.handle?.defaultValue !== undefined &&\n input.model.handle.value !== input.model.handle.defaultValue\n ) {\n input.model.handle.value = input.model.handle.defaultValue;\n input.model.handle.dispatchInputEvent();\n this.dispatchChangeEvent(input, input.model.handle);\n this.requestUpdate();\n event.preventDefault();\n event.stopPropagation();\n }\n return;\n }\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 ...(isMultiHandle && {\n 'background-color': `var(--spectrum-slider-handle-background-color-${index}, var(--spectrum-slider-handle-background-color))`,\n 'border-color': `var(--spectrum-slider-handle-border-color-${index}, var(--spectrum-slider-handle-border-color))`,\n }),\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 aria-label=${ifDefined(model.ariaLabel)}\n aria-labelledby=${ariaLabelledBy}\n aria-valuetext=${this.formattedValueForHandle(model)}\n aria-describedby=\"slider-description\"\n @change=${this.onInputChange}\n @focus=${this.onInputFocus}\n @blur=${this.onInputBlur}\n @keydown=${this.onInputKeydown}\n .model=${model}\n />\n <span id=\"slider-description\">\n Press escape or double click to reset the slider to its\n default value.\n </span>\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) + 2;\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 }\n if (window.__swc.DEBUG) {\n if (!previous) {\n window.__swc.warn(\n this.host,\n '<sp-slider-handle> elements that are the first child of an <sp-slider> element cannot have attribute \"min=\\'previous\\'\"`',\n 'https://opensource.adobe.com/spectrum-web-components/components/slider-handle/#multi-handle-slider-with-ordered-handles'\n );\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 }\n if (window.__swc.DEBUG) {\n if (!next) {\n window.__swc.warn(\n this.host,\n '<sp-slider-handle> elements that are the last child of an <sp-slider> element cannot have attribute \"max=\\'next\\'\"',\n 'https://opensource.adobe.com/spectrum-web-components/components/slider-handle/#multi-handle-slider-with-ordered-handles'\n );\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"],
|
|
5
|
-
"mappings": "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
|
|
4
|
+
"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 { SliderHandle, SliderNormalization } 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 {\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 const _forcedUnit =\n handle._forcedUnit === ''\n ? this.host._forcedUnit\n : handle._forcedUnit;\n return (\n handle.getAriaHandleText(model.value, numberFormat) + _forcedUnit\n );\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 !input ||\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 public get activeHandleModel(): ModelValue {\n const active = this.activeHandle;\n return this.model.find((model) => model.name === active)!;\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 /**\n * @description check for defaultvalue(value) property in sp-slider and reset on double click on sliderHandle\n * @param event\n */\n public handleDoubleClick(event: PointerEvent): void {\n const input = (event.target as Element).querySelector(\n '.input'\n ) as InputWithModel;\n\n if (input.model?.handle.defaultValue !== undefined) {\n input.model.handle.value = input.model.handle.defaultValue;\n this.dispatchChangeEvent(input, input.model.handle);\n input.model.handle.dispatchInputEvent();\n this.requestUpdate();\n }\n }\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 if (event.pointerType === 'mouse') {\n this.host.labelEl.click();\n }\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 if (event.pointerType === 'mouse') {\n this.host.labelEl.click();\n }\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 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: KeyboardEvent): void => {\n if (event.key == 'Escape') {\n const input = event.target as InputWithModel;\n if (\n input.model.handle?.defaultValue !== undefined &&\n input.model.handle.value !== input.model.handle.defaultValue\n ) {\n input.model.handle.value = input.model.handle.defaultValue;\n input.model.handle.dispatchInputEvent();\n this.dispatchChangeEvent(input, input.model.handle);\n this.requestUpdate();\n event.preventDefault();\n event.stopPropagation();\n }\n return;\n }\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 ...(isMultiHandle && {\n 'background-color': `var(--spectrum-slider-handle-background-color-${index}, var(--spectrum-slider-handle-background-color))`,\n 'border-color': `var(--spectrum-slider-handle-border-color-${index}, var(--spectrum-slider-handle-border-color))`,\n }),\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 aria-describedby=\"slider-description\"\n @change=${this.onInputChange}\n @focus=${this.onInputFocus}\n @blur=${this.onInputBlur}\n @keydown=${this.onInputKeydown}\n .model=${model}\n />\n <span id=\"slider-description\">\n Press escape or double click to reset the slider to its\n default value.\n </span>\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) + 2;\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 }\n if (window.__swc.DEBUG) {\n if (!previous) {\n window.__swc.warn(\n this.host,\n '<sp-slider-handle> elements that are the first child of an <sp-slider> element cannot have attribute \"min=\\'previous\\'\"`',\n 'https://opensource.adobe.com/spectrum-web-components/components/slider-handle/#multi-handle-slider-with-ordered-handles'\n );\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 }\n if (window.__swc.DEBUG) {\n if (!next) {\n window.__swc.warn(\n this.host,\n '<sp-slider-handle> elements that are the last child of an <sp-slider> element cannot have attribute \"max=\\'next\\'\"',\n 'https://opensource.adobe.com/spectrum-web-components/components/slider-handle/#multi-handle-slider-with-ordered-handles'\n );\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"],
|
|
5
|
+
"mappings": "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",
|
|
6
6
|
"names": ["html", "classMap", "ifDefined", "styleMap", "MutationController", "SliderHandle", "host", "handles", "h", "handle", "index", "_a", "event", "input", "isFocusVisible", "error", "result", "model", "elements", "numberFormat", "_forcedUnit", "active", "name", "item", "handleSlider", "sliderHandle", "inputNodes", "inputNode", "resolvedInput", "changeEvent", "rect", "minOffset", "offset", "size", "normalized", "zIndex", "isMultiHandle", "classes", "style", "ariaLabelledBy", "values", "a", "b", "value", "array", "getRangeAndClamp", "previous", "next", "min", "max", "j", "modelValues", "rangeAndClamp", "toNormalized", "clampedValue", "normalizedValue", "updates"]
|
|
7
7
|
}
|
package/test/index.js
CHANGED
|
@@ -70,22 +70,24 @@ export const testEditableSlider = (type) => {
|
|
|
70
70
|
it("dispatches `input` of the animation frame", async () => {
|
|
71
71
|
const inputSpy = spy();
|
|
72
72
|
const changeSpy = spy();
|
|
73
|
-
const el = await fixture(
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
|
|
81
|
-
|
|
82
|
-
|
|
83
|
-
|
|
84
|
-
|
|
85
|
-
|
|
86
|
-
|
|
87
|
-
|
|
88
|
-
|
|
73
|
+
const el = await fixture(
|
|
74
|
+
html`
|
|
75
|
+
<sp-slider
|
|
76
|
+
editable
|
|
77
|
+
hide-stepper
|
|
78
|
+
min="1"
|
|
79
|
+
max="100"
|
|
80
|
+
step="1"
|
|
81
|
+
label="Slider label"
|
|
82
|
+
@input=${(event) => {
|
|
83
|
+
inputSpy(event.target.value);
|
|
84
|
+
}}
|
|
85
|
+
@change=${(event) => {
|
|
86
|
+
changeSpy(event.target.value);
|
|
87
|
+
}}
|
|
88
|
+
></sp-slider>
|
|
89
|
+
`
|
|
90
|
+
);
|
|
89
91
|
await elementUpdated(el);
|
|
90
92
|
expect(el.value).to.equal(50.5);
|
|
91
93
|
expect(inputSpy.callCount, "start clean").to.equal(0);
|
|
@@ -279,32 +281,6 @@ export const testEditableSlider = (type) => {
|
|
|
279
281
|
el.handleController.inputForHandle(el)
|
|
280
282
|
);
|
|
281
283
|
});
|
|
282
|
-
it("allows keyboard focus on both handler and <sp-number-field>", async () => {
|
|
283
|
-
const el = await sliderFromFixture(editable);
|
|
284
|
-
await elementUpdated(el);
|
|
285
|
-
el.focus();
|
|
286
|
-
await elementUpdated(el);
|
|
287
|
-
expect(
|
|
288
|
-
el.shadowRoot.activeElement === el.numberField,
|
|
289
|
-
"number-field focused"
|
|
290
|
-
).to.be.true;
|
|
291
|
-
await sendKeys({
|
|
292
|
-
press: "Shift+Tab"
|
|
293
|
-
});
|
|
294
|
-
await nextFrame();
|
|
295
|
-
expect(
|
|
296
|
-
el.shadowRoot.activeElement === el.handleController.inputForHandle(el),
|
|
297
|
-
"handler focused"
|
|
298
|
-
).to.be.true;
|
|
299
|
-
await sendKeys({
|
|
300
|
-
press: "Tab"
|
|
301
|
-
});
|
|
302
|
-
await nextFrame();
|
|
303
|
-
expect(
|
|
304
|
-
el.shadowRoot.activeElement === el.numberField,
|
|
305
|
-
"number-field focused"
|
|
306
|
-
).to.be.true;
|
|
307
|
-
});
|
|
308
284
|
});
|
|
309
285
|
};
|
|
310
286
|
//# sourceMappingURL=index.js.map
|
package/test/index.js.map
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["index.ts"],
|
|
4
|
-
"sourcesContent": ["/*\nCopyright 2020 Adobe. All rights reserved.\nThis file is licensed to you under the Apache License, Version 2.0 (the \"License\");\nyou may not use this file except in compliance with the License. You may obtain a copy\nof the License at http://www.apache.org/licenses/LICENSE-2.0\n\nUnless required by applicable law or agreed to in writing, software distributed under\nthe License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\nOF ANY KIND, either express or implied. See the License for the specific language\ngoverning permissions and limitations under the License.\n*/\n\nimport { Slider } from '@spectrum-web-components/slider';\nimport {\n editable,\n hideStepper,\n Indeterminate,\n StoryArgs,\n} from '../stories/slider.stories.js';\nimport { elementUpdated, expect, nextFrame } from '@open-wc/testing';\nimport { html, TemplateResult } from '@spectrum-web-components/base';\nimport { sendKeys } from '@web/test-runner-commands';\nimport { spy } from 'sinon';\nimport {\n fixture,\n testForLitDevWarnings,\n} from '../../../test/testing-helpers.js';\nimport { sendMouse } from '../../../test/plugins/browser.js';\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\nexport const testEditableSlider = (type: string): void => {\n describe(`Slider - editable, ${type}`, () => {\n testForLitDevWarnings(async () => await sliderFromFixture(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('dispatches `input` of the animation frame', async () => {\n const inputSpy = spy();\n const changeSpy = spy();\n const el = await fixture<Slider>(html`\n <sp-slider\n editable\n hide-stepper\n min=\"1\"\n max=\"100\"\n step=\"1\"\n label=\"Slider label\"\n @input=${(event: Event & { target: Slider }) => {\n inputSpy(event.target.value);\n }}\n @change=${(event: Event & { target: Slider }) => {\n changeSpy(event.target.value);\n }}\n ></sp-slider>\n `);\n await elementUpdated(el);\n expect(el.value).to.equal(50.5);\n\n expect(inputSpy.callCount, 'start clean').to.equal(0);\n expect(changeSpy.callCount, 'start clean').to.equal(0);\n\n const handle = el.shadowRoot.querySelector(\n '.handle'\n ) as HTMLDivElement;\n const rect = handle.getBoundingClientRect();\n let frames = 0;\n let shouldCountFrames = true;\n const countFrames = (): void => {\n if (!shouldCountFrames) return;\n frames += 1;\n requestAnimationFrame(countFrames);\n };\n countFrames();\n type Steps = {\n type: 'move';\n position: [number, number];\n }[];\n const toRight: Steps = [...Array(51).keys()].map((i) => ({\n type: 'move',\n position: [\n rect.left + rect.width / 2 + i,\n rect.top + rect.height / 2,\n ],\n }));\n const toLeft: Steps = toRight.slice(0, -1).reverse();\n await sendMouse({\n steps: [\n {\n type: 'move',\n position: [\n rect.left + rect.width / 2,\n rect.top + rect.height / 2,\n ],\n },\n {\n type: 'down',\n },\n ...toRight,\n ...toLeft,\n {\n type: 'up',\n },\n ],\n });\n shouldCountFrames = false;\n await elementUpdated(el);\n await nextFrame();\n await nextFrame();\n\n expect(el.value).to.gt(50.5);\n expect(\n inputSpy.callCount,\n 'should not have more \"input\"s than frames'\n ).to.lte(frames);\n expect(changeSpy.callCount, 'only one change').to.equal(1);\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 el.shadowRoot.activeElement?.dispatchEvent(\n new WheelEvent('wheel', { deltaY: 1 })\n );\n\n await elementUpdated(el);\n\n expect(el.shadowRoot.activeElement).to.equal(el.numberField);\n expect(el.value).to.equal(46);\n expect(inputSpy.callCount, 'still one input').to.equal(2);\n\n el.shadowRoot.activeElement?.dispatchEvent(\n new WheelEvent('wheel', { deltaY: -1 })\n );\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, 'still one input').to.equal(3);\n\n el.shadowRoot.activeElement?.dispatchEvent(\n new WheelEvent('wheel', { deltaX: 1, shiftKey: true })\n );\n\n await elementUpdated(el);\n\n expect(el.shadowRoot.activeElement).to.equal(el.numberField);\n expect(el.value).to.equal(55);\n expect(inputSpy.callCount, 'still one input').to.equal(4);\n\n el.shadowRoot.activeElement?.dispatchEvent(\n new WheelEvent('wheel', { deltaX: -1, shiftKey: true })\n );\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, 'still one input').to.equal(5);\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(\n '.handle'\n ) 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 pointerType: 'mouse',\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 pointerType: 'mouse',\n })\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 pointerType: 'mouse',\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 pointerType: 'mouse',\n })\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 pointerType: 'mouse',\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 it('allows keyboard focus on both handler and <sp-number-field>', async () => {\n const el = await sliderFromFixture(editable);\n await elementUpdated(el);\n\n el.focus();\n await elementUpdated(el);\n\n expect(\n el.shadowRoot.activeElement === el.numberField,\n 'number-field focused'\n ).to.be.true;\n\n await sendKeys({\n press: 'Shift+Tab',\n });\n await nextFrame();\n\n expect(\n el.shadowRoot.activeElement ===\n el.handleController.inputForHandle(el),\n 'handler focused'\n ).to.be.true;\n\n await sendKeys({\n press: 'Tab',\n });\n await nextFrame();\n\n expect(\n el.shadowRoot.activeElement === el.numberField,\n 'number-field focused'\n ).to.be.true;\n });\n });\n};\n"],
|
|
5
|
-
"mappings": ";AAaA;AAAA,EACI;AAAA,EACA;AAAA,EACA;AAAA,OAEG;AACP,SAAS,gBAAgB,QAAQ,iBAAiB;AAClD,SAAS,YAA4B;AACrC,SAAS,gBAAgB;AACzB,SAAS,WAAW;AACpB;AAAA,EACI;AAAA,EACA;AAAA,OACG;AACP,SAAS,iBAAiB;AAE1B,eAAe,kBACX,eACe;AACf,QAAM,KAAK,MAAM,QAAgB,cAAc,CAAC,CAAC,CAAC;AAClD,QAAM,SAAS,GAAG,cAAc,WAAW;AAC3C,SAAO;AACX;AAEO,aAAM,qBAAqB,CAAC,SAAuB;AACtD,WAAS,sBAAsB,IAAI,IAAI,MAAM;AACzC,0BAAsB,YAAY,MAAM,kBAAkB,QAAQ,CAAC;AACnE,OAAG,SAAS,YAAY;AACpB,YAAM,KAAK,MAAM,kBAAkB,QAAQ;AAE3C,YAAM,eAAe,EAAE;AAEvB,YAAM,OAAO,EAAE,EAAE,GAAG,GAAG,WAAW;AAAA,IACtC,CAAC;AAED,OAAG,0BAA0B,YAAY;AACrC,YAAM,KAAK,MAAM,kBAAkB,WAAW;AAE9C,YAAM,eAAe,EAAE;AAEvB,YAAM,OAAO,EAAE,EAAE,GAAG,GAAG,WAAW;AAAA,IACtC,CAAC;AAED,OAAG,sBAAsB,YAAY;AACjC,YAAM,KAAK,SAAS,cAAc,WAAW;AAC7C,SAAG,WAAW;AACd,SAAG,WAAW;AACd,SAAG,QAAQ;AAEX,UAAI;AACA,iBAAS,KAAK,OAAO,EAAE;AAAA,MAC3B,SAAS,OAAO;AACZ,eAAO,IAAI,EAAE,GAAG,GAAG;AAAA,MACvB;AAEA,YAAM,eAAe,EAAE;AAEvB,YAAM,OAAO,EAAE,EAAE,GAAG,GAAG,WAAW;AAClC,SAAG,OAAO;AAAA,IACd,CAAC;AAED,OAAG,iEAAiE,YAAY;AAC5E,YAAM,KAAK,MAAM,kBAAkB,aAAa;AAEhD,YAAM,eAAe,EAAE;AAEvB,aAAO,GAAG,KAAK,EAAE,GAAG,MAAM,CAAC;AAC3B,aAAO,GAAG,aAAa,EAAE,GAAG,GAAG;AAE/B,SAAG,MAAM;AAET,YAAM,eAAe,EAAE;AAEvB,YAAM,SAAS,EAAE,OAAO,YAAY,CAAC;AACrC,YAAM,SAAS,EAAE,OAAO,YAAY,CAAC;AACrC,YAAM,SAAS,EAAE,MAAM,KAAK,CAAC;AAC7B,YAAM,SAAS,EAAE,OAAO,QAAQ,CAAC;AAEjC,YAAM,eAAe,EAAE;AAEvB,aAAO,GAAG,KAAK,EAAE,GAAG,MAAM,EAAE;AAC5B,aAAO,GAAG,aAAa,EAAE,GAAG,GAAG;AAAA,IACnC,CAAC;AAED,OAAG,wCAAwC,YAAY;AACnD,YAAM,KAAK,MAAM,kBAAkB,QAAQ;AAE3C,YAAM,eAAe,EAAE;AAEvB,SAAG,MAAM;AAET,YAAM,eAAe,EAAE;AAEvB,aAAO,GAAG,WAAW,aAAa,EAAE,GAAG,MAAM,GAAG,WAAW;AAAA,IAC/D,CAAC;AAED,OAAG,6CAA6C,YAAY;AACxD,YAAM,WAAW,IAAI;AACrB,YAAM,YAAY,IAAI;AACtB,YAAM,KAAK,MAAM,
|
|
4
|
+
"sourcesContent": ["/*\nCopyright 2020 Adobe. All rights reserved.\nThis file is licensed to you under the Apache License, Version 2.0 (the \"License\");\nyou may not use this file except in compliance with the License. You may obtain a copy\nof the License at http://www.apache.org/licenses/LICENSE-2.0\n\nUnless required by applicable law or agreed to in writing, software distributed under\nthe License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\nOF ANY KIND, either express or implied. See the License for the specific language\ngoverning permissions and limitations under the License.\n*/\n\nimport { Slider } from '@spectrum-web-components/slider';\nimport {\n editable,\n hideStepper,\n Indeterminate,\n StoryArgs,\n} from '../stories/slider.stories.js';\nimport { elementUpdated, expect, nextFrame } from '@open-wc/testing';\nimport { html, TemplateResult } from '@spectrum-web-components/base';\nimport { sendKeys } from '@web/test-runner-commands';\nimport { spy } from 'sinon';\nimport {\n fixture,\n testForLitDevWarnings,\n} from '../../../test/testing-helpers.js';\nimport { sendMouse } from '../../../test/plugins/browser.js';\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\nexport const testEditableSlider = (type: string): void => {\n describe(`Slider - editable, ${type}`, () => {\n testForLitDevWarnings(async () => await sliderFromFixture(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('dispatches `input` of the animation frame', async () => {\n const inputSpy = spy();\n const changeSpy = spy();\n const el = await fixture<Slider>(\n html`\n <sp-slider\n editable\n hide-stepper\n min=\"1\"\n max=\"100\"\n step=\"1\"\n label=\"Slider label\"\n @input=${(event: Event & { target: Slider }) => {\n inputSpy(event.target.value);\n }}\n @change=${(event: Event & { target: Slider }) => {\n changeSpy(event.target.value);\n }}\n ></sp-slider>\n `\n );\n await elementUpdated(el);\n expect(el.value).to.equal(50.5);\n\n expect(inputSpy.callCount, 'start clean').to.equal(0);\n expect(changeSpy.callCount, 'start clean').to.equal(0);\n\n const handle = el.shadowRoot.querySelector(\n '.handle'\n ) as HTMLDivElement;\n const rect = handle.getBoundingClientRect();\n let frames = 0;\n let shouldCountFrames = true;\n const countFrames = (): void => {\n if (!shouldCountFrames) return;\n frames += 1;\n requestAnimationFrame(countFrames);\n };\n countFrames();\n type Steps = {\n type: 'move';\n position: [number, number];\n }[];\n const toRight: Steps = [...Array(51).keys()].map((i) => ({\n type: 'move',\n position: [\n rect.left + rect.width / 2 + i,\n rect.top + rect.height / 2,\n ],\n }));\n const toLeft: Steps = toRight.slice(0, -1).reverse();\n await sendMouse({\n steps: [\n {\n type: 'move',\n position: [\n rect.left + rect.width / 2,\n rect.top + rect.height / 2,\n ],\n },\n {\n type: 'down',\n },\n ...toRight,\n ...toLeft,\n {\n type: 'up',\n },\n ],\n });\n shouldCountFrames = false;\n await elementUpdated(el);\n await nextFrame();\n await nextFrame();\n\n expect(el.value).to.gt(50.5);\n expect(\n inputSpy.callCount,\n 'should not have more \"input\"s than frames'\n ).to.lte(frames);\n expect(changeSpy.callCount, 'only one change').to.equal(1);\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 el.shadowRoot.activeElement?.dispatchEvent(\n new WheelEvent('wheel', { deltaY: 1 })\n );\n\n await elementUpdated(el);\n\n expect(el.shadowRoot.activeElement).to.equal(el.numberField);\n expect(el.value).to.equal(46);\n expect(inputSpy.callCount, 'still one input').to.equal(2);\n\n el.shadowRoot.activeElement?.dispatchEvent(\n new WheelEvent('wheel', { deltaY: -1 })\n );\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, 'still one input').to.equal(3);\n\n el.shadowRoot.activeElement?.dispatchEvent(\n new WheelEvent('wheel', { deltaX: 1, shiftKey: true })\n );\n\n await elementUpdated(el);\n\n expect(el.shadowRoot.activeElement).to.equal(el.numberField);\n expect(el.value).to.equal(55);\n expect(inputSpy.callCount, 'still one input').to.equal(4);\n\n el.shadowRoot.activeElement?.dispatchEvent(\n new WheelEvent('wheel', { deltaX: -1, shiftKey: true })\n );\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, 'still one input').to.equal(5);\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(\n '.handle'\n ) 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 pointerType: 'mouse',\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 pointerType: 'mouse',\n })\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 pointerType: 'mouse',\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 pointerType: 'mouse',\n })\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 pointerType: 'mouse',\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};\n"],
|
|
5
|
+
"mappings": "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",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|