@fluentui/react-slider 9.0.0-beta.1 → 9.0.0-beta.12
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/CHANGELOG.json +528 -1
- package/CHANGELOG.md +150 -2
- package/MIGRATION.md +20 -50
- package/README.md +6 -14
- package/Spec.md +81 -0
- package/dist/react-slider.d.ts +35 -147
- package/lib/Slider.js.map +1 -1
- package/lib/components/Slider/Slider.js +7 -7
- package/lib/components/Slider/Slider.js.map +1 -1
- package/lib/components/Slider/Slider.types.d.ts +27 -60
- package/lib/components/Slider/Slider.types.js.map +1 -1
- package/lib/components/Slider/index.d.ts +2 -2
- package/lib/components/Slider/index.js +2 -2
- package/lib/components/Slider/index.js.map +1 -1
- package/lib/components/Slider/renderSlider.d.ts +1 -1
- package/lib/components/Slider/renderSlider.js +10 -8
- package/lib/components/Slider/renderSlider.js.map +1 -1
- package/lib/components/Slider/useSlider.d.ts +2 -6
- package/lib/components/Slider/useSlider.js +48 -80
- package/lib/components/Slider/useSlider.js.map +1 -1
- package/lib/components/Slider/useSliderState.d.ts +1 -2
- package/lib/components/Slider/useSliderState.js +55 -185
- package/lib/components/Slider/useSliderState.js.map +1 -1
- package/lib/components/Slider/useSliderStyles.d.ts +11 -40
- package/lib/components/Slider/useSliderStyles.js +185 -290
- package/lib/components/Slider/useSliderStyles.js.map +1 -1
- package/lib/index.d.ts +2 -2
- package/lib/index.js +1 -2
- package/lib/index.js.map +1 -1
- package/lib-commonjs/Slider.js +1 -1
- package/lib-commonjs/Slider.js.map +1 -1
- package/lib-commonjs/components/Slider/Slider.js +8 -8
- package/lib-commonjs/components/Slider/Slider.js.map +1 -1
- package/lib-commonjs/components/Slider/Slider.types.d.ts +27 -60
- package/lib-commonjs/components/Slider/Slider.types.js.map +1 -1
- package/lib-commonjs/components/Slider/index.d.ts +2 -2
- package/lib-commonjs/components/Slider/index.js +12 -6
- package/lib-commonjs/components/Slider/index.js.map +1 -1
- package/lib-commonjs/components/Slider/renderSlider.d.ts +1 -1
- package/lib-commonjs/components/Slider/renderSlider.js +14 -14
- package/lib-commonjs/components/Slider/renderSlider.js.map +1 -1
- package/lib-commonjs/components/Slider/useSlider.d.ts +2 -6
- package/lib-commonjs/components/Slider/useSlider.js +51 -84
- package/lib-commonjs/components/Slider/useSlider.js.map +1 -1
- package/lib-commonjs/components/Slider/useSliderState.d.ts +1 -2
- package/lib-commonjs/components/Slider/useSliderState.js +58 -190
- package/lib-commonjs/components/Slider/useSliderState.js.map +1 -1
- package/lib-commonjs/components/Slider/useSliderStyles.d.ts +11 -40
- package/lib-commonjs/components/Slider/useSliderStyles.js +188 -293
- package/lib-commonjs/components/Slider/useSliderStyles.js.map +1 -1
- package/lib-commonjs/index.d.ts +2 -2
- package/lib-commonjs/index.js +38 -4
- package/lib-commonjs/index.js.map +1 -1
- package/package.json +20 -22
- package/lib/RangedSlider.d.ts +0 -1
- package/lib/RangedSlider.js +0 -2
- package/lib/RangedSlider.js.map +0 -1
- package/lib/common/isConformant.d.ts +0 -4
- package/lib/common/isConformant.js +0 -12
- package/lib/common/isConformant.js.map +0 -1
- package/lib/components/RangedSlider/RangedSlider.d.ts +0 -6
- package/lib/components/RangedSlider/RangedSlider.js +0 -15
- package/lib/components/RangedSlider/RangedSlider.js.map +0 -1
- package/lib/components/RangedSlider/RangedSlider.types.d.ts +0 -53
- package/lib/components/RangedSlider/RangedSlider.types.js +0 -2
- package/lib/components/RangedSlider/RangedSlider.types.js.map +0 -1
- package/lib/components/RangedSlider/index.d.ts +0 -6
- package/lib/components/RangedSlider/index.js +0 -7
- package/lib/components/RangedSlider/index.js.map +0 -1
- package/lib/components/RangedSlider/renderRangedSlider.d.ts +0 -5
- package/lib/components/RangedSlider/renderRangedSlider.js +0 -20
- package/lib/components/RangedSlider/renderRangedSlider.js.map +0 -1
- package/lib/components/RangedSlider/useRangedSlider.d.ts +0 -6
- package/lib/components/RangedSlider/useRangedSlider.js +0 -116
- package/lib/components/RangedSlider/useRangedSlider.js.map +0 -1
- package/lib/components/RangedSlider/useRangedSliderState.d.ts +0 -2
- package/lib/components/RangedSlider/useRangedSliderState.js +0 -271
- package/lib/components/RangedSlider/useRangedSliderState.js.map +0 -1
- package/lib/components/RangedSlider/useRangedSliderStyles.d.ts +0 -4
- package/lib/components/RangedSlider/useRangedSliderStyles.js +0 -92
- package/lib/components/RangedSlider/useRangedSliderStyles.js.map +0 -1
- package/lib/utils/calculateSteps.d.ts +0 -5
- package/lib/utils/calculateSteps.js +0 -27
- package/lib/utils/calculateSteps.js.map +0 -1
- package/lib/utils/findClosestThumb.d.ts +0 -4
- package/lib/utils/findClosestThumb.js +0 -7
- package/lib/utils/findClosestThumb.js.map +0 -1
- package/lib/utils/getKeydownValue.d.ts +0 -6
- package/lib/utils/getKeydownValue.js +0 -35
- package/lib/utils/getKeydownValue.js.map +0 -1
- package/lib/utils/getMarkPercent.d.ts +0 -12
- package/lib/utils/getMarkPercent.js +0 -27
- package/lib/utils/getMarkPercent.js.map +0 -1
- package/lib/utils/getMarkValues.d.ts +0 -13
- package/lib/utils/getMarkValues.js +0 -29
- package/lib/utils/getMarkValues.js.map +0 -1
- package/lib/utils/getPercent.d.ts +0 -8
- package/lib/utils/getPercent.js +0 -11
- package/lib/utils/getPercent.js.map +0 -1
- package/lib/utils/index.d.ts +0 -9
- package/lib/utils/index.js +0 -10
- package/lib/utils/index.js.map +0 -1
- package/lib/utils/on.d.ts +0 -11
- package/lib/utils/on.js +0 -17
- package/lib/utils/on.js.map +0 -1
- package/lib/utils/renderMarks.d.ts +0 -13
- package/lib/utils/renderMarks.js +0 -31
- package/lib/utils/renderMarks.js.map +0 -1
- package/lib/utils/validateRangedThumbValues.d.ts +0 -4
- package/lib/utils/validateRangedThumbValues.js +0 -13
- package/lib/utils/validateRangedThumbValues.js.map +0 -1
- package/lib-commonjs/RangedSlider.d.ts +0 -1
- package/lib-commonjs/RangedSlider.js +0 -10
- package/lib-commonjs/RangedSlider.js.map +0 -1
- package/lib-commonjs/common/isConformant.d.ts +0 -4
- package/lib-commonjs/common/isConformant.js +0 -23
- package/lib-commonjs/common/isConformant.js.map +0 -1
- package/lib-commonjs/components/RangedSlider/RangedSlider.d.ts +0 -6
- package/lib-commonjs/components/RangedSlider/RangedSlider.js +0 -26
- package/lib-commonjs/components/RangedSlider/RangedSlider.js.map +0 -1
- package/lib-commonjs/components/RangedSlider/RangedSlider.types.d.ts +0 -53
- package/lib-commonjs/components/RangedSlider/RangedSlider.types.js +0 -6
- package/lib-commonjs/components/RangedSlider/RangedSlider.types.js.map +0 -1
- package/lib-commonjs/components/RangedSlider/index.d.ts +0 -6
- package/lib-commonjs/components/RangedSlider/index.js +0 -20
- package/lib-commonjs/components/RangedSlider/index.js.map +0 -1
- package/lib-commonjs/components/RangedSlider/renderRangedSlider.d.ts +0 -5
- package/lib-commonjs/components/RangedSlider/renderRangedSlider.js +0 -32
- package/lib-commonjs/components/RangedSlider/renderRangedSlider.js.map +0 -1
- package/lib-commonjs/components/RangedSlider/useRangedSlider.d.ts +0 -6
- package/lib-commonjs/components/RangedSlider/useRangedSlider.js +0 -128
- package/lib-commonjs/components/RangedSlider/useRangedSlider.js.map +0 -1
- package/lib-commonjs/components/RangedSlider/useRangedSliderState.d.ts +0 -2
- package/lib-commonjs/components/RangedSlider/useRangedSliderState.js +0 -286
- package/lib-commonjs/components/RangedSlider/useRangedSliderState.js.map +0 -1
- package/lib-commonjs/components/RangedSlider/useRangedSliderStyles.d.ts +0 -4
- package/lib-commonjs/components/RangedSlider/useRangedSliderStyles.js +0 -104
- package/lib-commonjs/components/RangedSlider/useRangedSliderStyles.js.map +0 -1
- package/lib-commonjs/utils/calculateSteps.d.ts +0 -5
- package/lib-commonjs/utils/calculateSteps.js +0 -37
- package/lib-commonjs/utils/calculateSteps.js.map +0 -1
- package/lib-commonjs/utils/findClosestThumb.d.ts +0 -4
- package/lib-commonjs/utils/findClosestThumb.js +0 -16
- package/lib-commonjs/utils/findClosestThumb.js.map +0 -1
- package/lib-commonjs/utils/getKeydownValue.d.ts +0 -6
- package/lib-commonjs/utils/getKeydownValue.js +0 -45
- package/lib-commonjs/utils/getKeydownValue.js.map +0 -1
- package/lib-commonjs/utils/getMarkPercent.d.ts +0 -12
- package/lib-commonjs/utils/getMarkPercent.js +0 -36
- package/lib-commonjs/utils/getMarkPercent.js.map +0 -1
- package/lib-commonjs/utils/getMarkValues.d.ts +0 -13
- package/lib-commonjs/utils/getMarkValues.js +0 -39
- package/lib-commonjs/utils/getMarkValues.js.map +0 -1
- package/lib-commonjs/utils/getPercent.d.ts +0 -8
- package/lib-commonjs/utils/getPercent.js +0 -20
- package/lib-commonjs/utils/getPercent.js.map +0 -1
- package/lib-commonjs/utils/index.d.ts +0 -9
- package/lib-commonjs/utils/index.js +0 -26
- package/lib-commonjs/utils/index.js.map +0 -1
- package/lib-commonjs/utils/on.d.ts +0 -11
- package/lib-commonjs/utils/on.js +0 -26
- package/lib-commonjs/utils/on.js.map +0 -1
- package/lib-commonjs/utils/renderMarks.d.ts +0 -13
- package/lib-commonjs/utils/renderMarks.js +0 -42
- package/lib-commonjs/utils/renderMarks.js.map +0 -1
- package/lib-commonjs/utils/validateRangedThumbValues.d.ts +0 -4
- package/lib-commonjs/utils/validateRangedThumbValues.js +0 -23
- package/lib-commonjs/utils/validateRangedThumbValues.js.map +0 -1
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../src/components/Slider/useSliderStyles.ts"],"names":[],"mappings":"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","sourceRoot":""}
|
|
1
|
+
{"version":3,"sources":["components/Slider/useSliderStyles.ts"],"names":[],"mappings":"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","sourcesContent":["import { shorthands, makeStyles, mergeClasses } from '@griffel/react';\nimport { createFocusOutlineStyle } from '@fluentui/react-tabster';\nimport { tokens } from '@fluentui/react-theme';\nimport type { SliderState, SliderSlots } from './Slider.types';\nimport type { SlotClassNames } from '@fluentui/react-utilities';\n\nexport const sliderClassNames: SlotClassNames<SliderSlots> = {\n root: 'fui-Slider',\n rail: 'fui-Slider__rail',\n thumb: 'fui-Slider__thumb',\n input: 'fui-Slider__input',\n};\n\n// Internal CSS variables\nconst thumbSizeVar = `--fui-Slider__thumb--size`;\nconst railSizeVar = `--fui-Slider__rail--size`;\nconst railColorVar = `--fui-Slider__rail--color`;\nconst progressColorVar = `--fui-Slider__progress--color`;\nconst thumbColorVar = `--fui-Slider__thumb--color`;\n\nexport const sliderCSSVars = {\n railDirectionVar: `--fui-Slider__rail--direction`,\n railOffsetVar: `--fui-Slider__rail--offset`,\n railProgressVar: `--fui-Slider__rail--progress`,\n railStepsPercentVar: `--fui-Slider__rail--steps-percent`,\n thumbPositionVar: `--fui-Slider__thumb--position`,\n};\n\nconst { railDirectionVar, railOffsetVar, railStepsPercentVar, railProgressVar, thumbPositionVar } = sliderCSSVars;\n\n/**\n * Styles for the root slot\n */\nconst useRootStyles = makeStyles({\n root: {\n position: 'relative',\n display: 'inline-grid',\n gridTemplateAreas: '\"slider\"',\n userSelect: 'none',\n touchAction: 'none',\n alignItems: 'center',\n justifyItems: 'center',\n },\n\n small: {\n [thumbSizeVar]: '16px',\n [railSizeVar]: '2px',\n minHeight: '24px',\n },\n\n medium: {\n [thumbSizeVar]: '20px',\n [railSizeVar]: '4px',\n minHeight: '32px',\n },\n\n horizontal: {\n minWidth: '120px',\n height: `var(${thumbSizeVar})`,\n },\n\n vertical: {\n width: `var(${thumbSizeVar})`,\n minHeight: '120px',\n gridTemplateColumns: `var(${thumbSizeVar})`,\n },\n\n enabled: {\n [railColorVar]: tokens.colorNeutralStrokeAccessible,\n [progressColorVar]: tokens.colorCompoundBrandBackground,\n [thumbColorVar]: tokens.colorCompoundBrandBackground,\n ':hover': {\n [thumbColorVar]: tokens.colorBrandBackgroundHover,\n [progressColorVar]: tokens.colorBrandBackgroundHover,\n },\n ':active': {\n [thumbColorVar]: tokens.colorBrandBackgroundPressed,\n [progressColorVar]: tokens.colorBrandBackgroundPressed,\n },\n '@media (forced-colors: active)': {\n [railColorVar]: 'CanvasText',\n [thumbColorVar]: 'Highlight',\n [progressColorVar]: 'Highlight',\n ':hover': {\n [thumbColorVar]: 'Highlight',\n [progressColorVar]: 'Highlight',\n },\n },\n },\n\n disabled: {\n [thumbColorVar]: tokens.colorNeutralForegroundDisabled,\n [railColorVar]: tokens.colorNeutralBackgroundDisabled,\n [progressColorVar]: tokens.colorNeutralForegroundDisabled,\n '@media (forced-colors: active)': {\n [railColorVar]: 'GrayText',\n [thumbColorVar]: 'GrayText',\n [progressColorVar]: 'GrayText',\n },\n },\n\n focusIndicatorHorizontal: createFocusOutlineStyle({\n selector: 'focus-within',\n style: { outlineOffset: { top: '6px', bottom: '6px', left: '10px', right: '10px' } },\n }),\n\n focusIndicatorVertical: createFocusOutlineStyle({\n selector: 'focus-within',\n style: { outlineOffset: { top: '10px', bottom: '10px', left: '6px', right: '6px' } },\n }),\n});\n\n/**\n * Styles for the rail slot\n */\nconst useRailStyles = makeStyles({\n rail: {\n ...shorthands.borderRadius(tokens.borderRadiusXLarge),\n pointerEvents: 'none',\n gridRowStart: 'slider',\n gridRowEnd: 'slider',\n gridColumnStart: 'slider',\n gridColumnEnd: 'slider',\n position: 'relative',\n forcedColorAdjust: 'none',\n // Background gradient represents the progress of the slider\n backgroundImage: `linear-gradient(\n var(${railDirectionVar}),\n var(${railColorVar}) 0%,\n var(${railColorVar}) var(${railOffsetVar}),\n var(${progressColorVar}) var(${railOffsetVar}),\n var(${progressColorVar}) calc(var(${railOffsetVar}) + var(${railProgressVar})),\n var(${railColorVar}) calc(var(${railOffsetVar}) + var(${railProgressVar}))\n )`,\n outlineWidth: '1px',\n outlineStyle: 'solid',\n outlineColor: tokens.colorTransparentStroke,\n ':before': {\n content: \"''\",\n position: 'absolute',\n // Repeating gradient represents the steps if provided\n backgroundImage: `repeating-linear-gradient(\n var(${railDirectionVar}),\n #0000 0%,\n #0000 calc(var(${railStepsPercentVar}) - 1px),\n ${tokens.colorNeutralBackground1} calc(var(${railStepsPercentVar}) - 1px),\n ${tokens.colorNeutralBackground1} var(${railStepsPercentVar})\n )`,\n },\n },\n\n horizontal: {\n width: '100%',\n height: `var(${railSizeVar})`,\n ':before': {\n left: '-1px',\n right: '-1px',\n height: `var(${railSizeVar})`,\n },\n },\n\n vertical: {\n width: `var(${railSizeVar})`,\n height: '100%',\n ':before': {\n width: `var(${railSizeVar})`,\n top: '-1px',\n bottom: '1px',\n },\n },\n});\n\n/**\n * Styles for the thumb slot\n */\nconst useThumbStyles = makeStyles({\n thumb: {\n position: 'absolute',\n width: `var(${thumbSizeVar})`,\n height: `var(${thumbSizeVar})`,\n pointerEvents: 'none',\n outlineStyle: 'none',\n forcedColorAdjust: 'none',\n ...shorthands.borderRadius(tokens.borderRadiusCircular),\n boxShadow: `0 0 0 calc(var(${thumbSizeVar}) * .2) ${tokens.colorNeutralBackground1} inset`,\n backgroundColor: `var(${thumbColorVar})`,\n transform: 'translateX(-50%)',\n ':before': {\n position: 'absolute',\n top: '0px',\n left: '0px',\n bottom: '0px',\n right: '0px',\n ...shorthands.borderRadius(tokens.borderRadiusCircular),\n boxSizing: 'border-box',\n content: \"''\",\n ...shorthands.border(`calc(var(${thumbSizeVar}) * .05)`, 'solid', tokens.colorNeutralStroke1),\n },\n },\n disabled: {\n ':before': {\n ...shorthands.border(`calc(var(${thumbSizeVar}) * .05)`, 'solid', tokens.colorNeutralForegroundDisabled),\n },\n },\n horizontal: {\n left: `var(${thumbPositionVar})`,\n },\n vertical: {\n transform: 'translateY(50%)',\n bottom: `var(${thumbPositionVar})`,\n },\n});\n\n/**\n * Styles for the Input slot\n */\nconst useInputStyles = makeStyles({\n input: {\n opacity: 0,\n gridRowStart: 'slider',\n gridRowEnd: 'slider',\n gridColumnStart: 'slider',\n gridColumnEnd: 'slider',\n ...shorthands.padding(0),\n ...shorthands.margin(0),\n },\n horizontal: {\n height: `var(${thumbSizeVar})`,\n width: `calc(100% + var(${thumbSizeVar}))`,\n },\n vertical: {\n height: `calc(100% + var(${thumbSizeVar}))`,\n width: `var(${thumbSizeVar})`,\n '-webkit-appearance': 'slider-vertical',\n },\n});\n\n/**\n * Apply styling to the Slider slots based on the state\n */\nexport const useSliderStyles_unstable = (state: SliderState): SliderState => {\n const rootStyles = useRootStyles();\n const railStyles = useRailStyles();\n const thumbStyles = useThumbStyles();\n const inputStyles = useInputStyles();\n const isVertical = state.vertical;\n\n state.root.className = mergeClasses(\n sliderClassNames.root,\n rootStyles.root,\n isVertical ? rootStyles.focusIndicatorVertical : rootStyles.focusIndicatorHorizontal,\n rootStyles[state.size!],\n isVertical ? rootStyles.vertical : rootStyles.horizontal,\n state.disabled ? rootStyles.disabled : rootStyles.enabled,\n state.root.className,\n );\n\n state.rail.className = mergeClasses(\n sliderClassNames.rail,\n railStyles.rail,\n isVertical ? railStyles.vertical : railStyles.horizontal,\n state.rail.className,\n );\n\n state.thumb.className = mergeClasses(\n sliderClassNames.thumb,\n thumbStyles.thumb,\n isVertical ? thumbStyles.vertical : thumbStyles.horizontal,\n state.disabled && thumbStyles.disabled,\n state.thumb.className,\n );\n\n state.input.className = mergeClasses(\n sliderClassNames.input,\n inputStyles.input,\n isVertical ? inputStyles.vertical : inputStyles.horizontal,\n state.input.className,\n );\n\n return state;\n};\n"],"sourceRoot":"../src/"}
|
package/lib/index.d.ts
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
export
|
|
2
|
-
export
|
|
1
|
+
export { Slider, renderSlider_unstable, sliderClassNames, useSliderState_unstable, useSliderStyles_unstable, useSlider_unstable, } from './Slider';
|
|
2
|
+
export type { SliderOnChangeData, SliderProps, SliderSlots, SliderState } from './Slider';
|
package/lib/index.js
CHANGED
package/lib/index.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"
|
|
1
|
+
{"version":3,"sources":["index.ts"],"names":[],"mappings":"AAAA,SACE,MADF,EAEE,qBAFF,EAGE,gBAHF,EAIE,uBAJF,EAKE,wBALF,EAME,kBANF,QAOO,UAPP","sourcesContent":["export {\n Slider,\n renderSlider_unstable,\n sliderClassNames,\n useSliderState_unstable,\n useSliderStyles_unstable,\n useSlider_unstable,\n} from './Slider';\nexport type { SliderOnChangeData, SliderProps, SliderSlots, SliderState } from './Slider';\n"],"sourceRoot":"../src/"}
|
package/lib-commonjs/Slider.js
CHANGED
|
@@ -4,7 +4,7 @@ Object.defineProperty(exports, "__esModule", {
|
|
|
4
4
|
value: true
|
|
5
5
|
});
|
|
6
6
|
|
|
7
|
-
|
|
7
|
+
const tslib_1 = /*#__PURE__*/require("tslib");
|
|
8
8
|
|
|
9
9
|
tslib_1.__exportStar(require("./components/Slider/index"), exports);
|
|
10
10
|
//# sourceMappingURL=Slider.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["
|
|
1
|
+
{"version":3,"sources":["Slider.ts"],"names":[],"mappings":";;;;;;;;AAAA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,2BAAA,CAAA,EAAA,OAAA","sourcesContent":["export * from './components/Slider/index';\n"],"sourceRoot":"../src/"}
|
|
@@ -5,22 +5,22 @@ Object.defineProperty(exports, "__esModule", {
|
|
|
5
5
|
});
|
|
6
6
|
exports.Slider = void 0;
|
|
7
7
|
|
|
8
|
-
|
|
8
|
+
const React = /*#__PURE__*/require("react");
|
|
9
9
|
|
|
10
|
-
|
|
10
|
+
const useSlider_1 = /*#__PURE__*/require("./useSlider");
|
|
11
11
|
|
|
12
|
-
|
|
12
|
+
const renderSlider_1 = /*#__PURE__*/require("./renderSlider");
|
|
13
13
|
|
|
14
|
-
|
|
14
|
+
const useSliderStyles_1 = /*#__PURE__*/require("./useSliderStyles");
|
|
15
15
|
/**
|
|
16
16
|
* The Slider component allows users to quickly select a value by dragging a thumb across a rail.
|
|
17
17
|
*/
|
|
18
18
|
|
|
19
19
|
|
|
20
|
-
exports.Slider = /*#__PURE__*/React.forwardRef(
|
|
21
|
-
|
|
22
|
-
useSliderStyles_1.
|
|
23
|
-
return renderSlider_1.
|
|
20
|
+
exports.Slider = /*#__PURE__*/React.forwardRef((props, ref) => {
|
|
21
|
+
const state = useSlider_1.useSlider_unstable(props, ref);
|
|
22
|
+
useSliderStyles_1.useSliderStyles_unstable(state);
|
|
23
|
+
return renderSlider_1.renderSlider_unstable(state);
|
|
24
24
|
});
|
|
25
25
|
exports.Slider.displayName = 'Slider';
|
|
26
26
|
//# sourceMappingURL=Slider.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["
|
|
1
|
+
{"version":3,"sources":["components/Slider/Slider.tsx"],"names":[],"mappings":";;;;;;;AAAA,MAAA,KAAA,gBAAA,OAAA,CAAA,OAAA,CAAA;;AACA,MAAA,WAAA,gBAAA,OAAA,CAAA,aAAA,CAAA;;AACA,MAAA,cAAA,gBAAA,OAAA,CAAA,gBAAA,CAAA;;AACA,MAAA,iBAAA,gBAAA,OAAA,CAAA,mBAAA,CAAA;AAIA;;AAEG;;;AACU,OAAA,CAAA,MAAA,gBAA2C,KAAK,CAAC,UAAN,CAAiB,CAAC,KAAD,EAAQ,GAAR,KAAe;AACtF,QAAM,KAAK,GAAG,WAAA,CAAA,kBAAA,CAAmB,KAAnB,EAA0B,GAA1B,CAAd;AAEA,EAAA,iBAAA,CAAA,wBAAA,CAAyB,KAAzB;AAEA,SAAO,cAAA,CAAA,qBAAA,CAAsB,KAAtB,CAAP;AACD,CANuD,CAA3C;AAOb,OAAA,CAAA,MAAA,CAAO,WAAP,GAAqB,QAArB","sourcesContent":["import * as React from 'react';\nimport { useSlider_unstable } from './useSlider';\nimport { renderSlider_unstable } from './renderSlider';\nimport { useSliderStyles_unstable } from './useSliderStyles';\nimport type { SliderProps } from './Slider.types';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\n\n/**\n * The Slider component allows users to quickly select a value by dragging a thumb across a rail.\n */\nexport const Slider: ForwardRefComponent<SliderProps> = React.forwardRef((props, ref) => {\n const state = useSlider_unstable(props, ref);\n\n useSliderStyles_unstable(state);\n\n return renderSlider_unstable(state);\n});\nSlider.displayName = 'Slider';\n"],"sourceRoot":"../src/"}
|
|
@@ -1,49 +1,38 @@
|
|
|
1
1
|
import * as React from 'react';
|
|
2
|
-
import { ComponentState, ComponentProps,
|
|
2
|
+
import type { ComponentState, ComponentProps, Slot } from '@fluentui/react-utilities';
|
|
3
3
|
export declare type SliderSlots = {
|
|
4
4
|
/**
|
|
5
5
|
* The root of the Slider.
|
|
6
|
+
* The root slot receives the `className` and `style` specified directly on the `<Slider>`.
|
|
7
|
+
* All other native props will be applied to the primary slot, `input`.
|
|
6
8
|
*/
|
|
7
|
-
root:
|
|
9
|
+
root: NonNullable<Slot<'div'>>;
|
|
8
10
|
/**
|
|
9
11
|
* The Slider's base. It is used to visibly display the min and max selectable values.
|
|
10
12
|
*/
|
|
11
|
-
rail:
|
|
12
|
-
/**
|
|
13
|
-
* The wrapper around the Slider component.
|
|
14
|
-
*/
|
|
15
|
-
sliderWrapper: IntrinsicShorthandProps<'div'>;
|
|
16
|
-
/**
|
|
17
|
-
* The wrapper around the Slider's track. It is primarily used to handle the positioning of the track.
|
|
18
|
-
*/
|
|
19
|
-
trackWrapper: IntrinsicShorthandProps<'div'>;
|
|
20
|
-
/**
|
|
21
|
-
* The bar showing the current selected area adjacent to the Slider's thumb.
|
|
22
|
-
*/
|
|
23
|
-
track: IntrinsicShorthandProps<'div'>;
|
|
24
|
-
/**
|
|
25
|
-
* The wrapper holding the marks and mark labels for the Slider.
|
|
26
|
-
*/
|
|
27
|
-
marksWrapper: IntrinsicShorthandProps<'div'>;
|
|
28
|
-
/**
|
|
29
|
-
* The wrapper around the Slider's thumb. It is primarily used to handle the dragging animation from translateX.
|
|
30
|
-
*/
|
|
31
|
-
thumbWrapper: IntrinsicShorthandProps<'div'>;
|
|
13
|
+
rail: NonNullable<Slot<'div'>>;
|
|
32
14
|
/**
|
|
33
15
|
* The draggable icon used to select a given value from the Slider.
|
|
34
16
|
* This is the element containing `role = 'slider'`.
|
|
35
17
|
*/
|
|
36
|
-
thumb:
|
|
37
|
-
/**
|
|
38
|
-
* The area in which the Slider's rail allows for the thumb to be dragged.
|
|
39
|
-
*/
|
|
40
|
-
activeRail: IntrinsicShorthandProps<'div'>;
|
|
18
|
+
thumb: NonNullable<Slot<'div'>>;
|
|
41
19
|
/**
|
|
42
20
|
* The hidden input for the Slider.
|
|
21
|
+
* This is the PRIMARY slot: all native properties specified directly on `<Slider>` will be applied to this slot,
|
|
22
|
+
* except `className` and `style`, which remain on the root slot.
|
|
23
|
+
*
|
|
43
24
|
*/
|
|
44
|
-
input:
|
|
25
|
+
input: NonNullable<Slot<'input'>> & {
|
|
26
|
+
/**
|
|
27
|
+
* Orient is a non standard attribute that allows for vertical orientation in Firefox. It is set internally
|
|
28
|
+
* when `vertical` is set to true.
|
|
29
|
+
* https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input/range#non_standard_attributes
|
|
30
|
+
* Webkit/Chromium support for vertical inputs is provided via -webkit-appearance css property
|
|
31
|
+
*/
|
|
32
|
+
orient?: 'horizontal' | 'vertical';
|
|
33
|
+
};
|
|
45
34
|
};
|
|
46
|
-
|
|
35
|
+
declare type SliderCommons = {
|
|
47
36
|
/**
|
|
48
37
|
* The starting value for an uncontrolled Slider.
|
|
49
38
|
* Mutually exclusive with `value` prop.
|
|
@@ -70,14 +59,6 @@ export declare type SliderCommons = {
|
|
|
70
59
|
* @default 1
|
|
71
60
|
*/
|
|
72
61
|
step?: number;
|
|
73
|
-
/**
|
|
74
|
-
* The number of steps that the Slider's value will change by during a key press. When provided, the `keyboardSteps`
|
|
75
|
-
* will be separated from the pointer `steps` allowing for the value to go outside of pointer related
|
|
76
|
-
* snapping values.
|
|
77
|
-
*
|
|
78
|
-
* @default `step` or 1
|
|
79
|
-
*/
|
|
80
|
-
keyboardStep?: number;
|
|
81
62
|
/**
|
|
82
63
|
* Whether to render the Slider as disabled.
|
|
83
64
|
*
|
|
@@ -85,22 +66,10 @@ export declare type SliderCommons = {
|
|
|
85
66
|
*/
|
|
86
67
|
disabled?: boolean;
|
|
87
68
|
/**
|
|
88
|
-
*
|
|
89
|
-
* @default `false`
|
|
69
|
+
* Render the Slider in a vertical orientation, smallest value on the bottom.
|
|
70
|
+
* @default `false`
|
|
90
71
|
*/
|
|
91
72
|
vertical?: boolean;
|
|
92
|
-
/**
|
|
93
|
-
* When enabled, small marks are displayed across the Slider, showing potential steps.
|
|
94
|
-
*
|
|
95
|
-
* - If `true`, marks are visible at each `step`.
|
|
96
|
-
* - If `number[]`, marks will be displayed at each provided number. Numbers must be in ascending order.
|
|
97
|
-
* - If `{}[]`, mark is shown at the value location and displays any provided custom labels and marks.
|
|
98
|
-
*/
|
|
99
|
-
marks?: boolean | (number | {
|
|
100
|
-
value: number;
|
|
101
|
-
label?: string | JSX.Element;
|
|
102
|
-
mark?: JSX.Element;
|
|
103
|
-
})[];
|
|
104
73
|
/**
|
|
105
74
|
* The starting origin point for the Slider.
|
|
106
75
|
* @default min
|
|
@@ -114,13 +83,11 @@ export declare type SliderCommons = {
|
|
|
114
83
|
/**
|
|
115
84
|
* Triggers a callback when the value has been changed. This will be called on every individual step.
|
|
116
85
|
*/
|
|
117
|
-
onChange?: (ev: React.
|
|
118
|
-
|
|
119
|
-
|
|
120
|
-
|
|
121
|
-
* The Slider's current value label to be read by the screen reader.
|
|
122
|
-
*/
|
|
123
|
-
ariaValueText?: (value: number) => string;
|
|
86
|
+
onChange?: (ev: React.ChangeEvent<HTMLInputElement>, data: SliderOnChangeData) => void;
|
|
87
|
+
};
|
|
88
|
+
export declare type SliderOnChangeData = {
|
|
89
|
+
value: number;
|
|
124
90
|
};
|
|
125
|
-
export declare type SliderProps = Omit<ComponentProps<SliderSlots>, 'onChange' | '
|
|
91
|
+
export declare type SliderProps = Omit<ComponentProps<Partial<SliderSlots>, 'input'>, 'defaultValue' | 'onChange' | 'size' | 'value'> & SliderCommons;
|
|
126
92
|
export declare type SliderState = ComponentState<SliderSlots> & SliderCommons;
|
|
93
|
+
export {};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":[],"names":[],"mappings":"","sourceRoot":""}
|
|
1
|
+
{"version":3,"sources":[],"names":[],"mappings":"","sourceRoot":"../src/"}
|
|
@@ -2,5 +2,5 @@ export * from './Slider';
|
|
|
2
2
|
export * from './Slider.types';
|
|
3
3
|
export * from './renderSlider';
|
|
4
4
|
export * from './useSlider';
|
|
5
|
-
export {
|
|
6
|
-
export {
|
|
5
|
+
export { useSliderState_unstable } from './useSliderState';
|
|
6
|
+
export { sliderClassNames, useSliderStyles_unstable } from './useSliderStyles';
|
|
@@ -3,9 +3,9 @@
|
|
|
3
3
|
Object.defineProperty(exports, "__esModule", {
|
|
4
4
|
value: true
|
|
5
5
|
});
|
|
6
|
-
exports.
|
|
6
|
+
exports.useSliderStyles_unstable = exports.sliderClassNames = exports.useSliderState_unstable = void 0;
|
|
7
7
|
|
|
8
|
-
|
|
8
|
+
const tslib_1 = /*#__PURE__*/require("tslib");
|
|
9
9
|
|
|
10
10
|
tslib_1.__exportStar(require("./Slider"), exports);
|
|
11
11
|
|
|
@@ -17,19 +17,25 @@ tslib_1.__exportStar(require("./useSlider"), exports);
|
|
|
17
17
|
|
|
18
18
|
var useSliderState_1 = /*#__PURE__*/require("./useSliderState");
|
|
19
19
|
|
|
20
|
-
Object.defineProperty(exports, "
|
|
20
|
+
Object.defineProperty(exports, "useSliderState_unstable", {
|
|
21
21
|
enumerable: true,
|
|
22
22
|
get: function () {
|
|
23
|
-
return useSliderState_1.
|
|
23
|
+
return useSliderState_1.useSliderState_unstable;
|
|
24
24
|
}
|
|
25
25
|
});
|
|
26
26
|
|
|
27
27
|
var useSliderStyles_1 = /*#__PURE__*/require("./useSliderStyles");
|
|
28
28
|
|
|
29
|
-
Object.defineProperty(exports, "
|
|
29
|
+
Object.defineProperty(exports, "sliderClassNames", {
|
|
30
30
|
enumerable: true,
|
|
31
31
|
get: function () {
|
|
32
|
-
return useSliderStyles_1.
|
|
32
|
+
return useSliderStyles_1.sliderClassNames;
|
|
33
|
+
}
|
|
34
|
+
});
|
|
35
|
+
Object.defineProperty(exports, "useSliderStyles_unstable", {
|
|
36
|
+
enumerable: true,
|
|
37
|
+
get: function () {
|
|
38
|
+
return useSliderStyles_1.useSliderStyles_unstable;
|
|
33
39
|
}
|
|
34
40
|
});
|
|
35
41
|
//# sourceMappingURL=index.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["
|
|
1
|
+
{"version":3,"sources":["components/Slider/index.ts"],"names":[],"mappings":";;;;;;;;;AAAA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,UAAA,CAAA,EAAA,OAAA;;AACA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,gBAAA,CAAA,EAAA,OAAA;;AACA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,gBAAA,CAAA,EAAA,OAAA;;AACA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,aAAA,CAAA,EAAA,OAAA;;AACA,IAAA,gBAAA,gBAAA,OAAA,CAAA,kBAAA,CAAA;;AAAS,MAAA,CAAA,cAAA,CAAA,OAAA,EAAA,yBAAA,EAAA;AAAA,EAAA,UAAA,EAAA,IAAA;AAAA,EAAA,GAAA,EAAA,YAAA;AAAA,WAAA,gBAAA,CAAA,uBAAA;AAAuB;AAAvB,CAAA;;AACT,IAAA,iBAAA,gBAAA,OAAA,CAAA,mBAAA,CAAA;;AAAS,MAAA,CAAA,cAAA,CAAA,OAAA,EAAA,kBAAA,EAAA;AAAA,EAAA,UAAA,EAAA,IAAA;AAAA,EAAA,GAAA,EAAA,YAAA;AAAA,WAAA,iBAAA,CAAA,gBAAA;AAAgB;AAAhB,CAAA;AAAkB,MAAA,CAAA,cAAA,CAAA,OAAA,EAAA,0BAAA,EAAA;AAAA,EAAA,UAAA,EAAA,IAAA;AAAA,EAAA,GAAA,EAAA,YAAA;AAAA,WAAA,iBAAA,CAAA,wBAAA;AAAwB;AAAxB,CAAA","sourcesContent":["export * from './Slider';\nexport * from './Slider.types';\nexport * from './renderSlider';\nexport * from './useSlider';\nexport { useSliderState_unstable } from './useSliderState';\nexport { sliderClassNames, useSliderStyles_unstable } from './useSliderStyles';\n"],"sourceRoot":"../src/"}
|
|
@@ -3,27 +3,27 @@
|
|
|
3
3
|
Object.defineProperty(exports, "__esModule", {
|
|
4
4
|
value: true
|
|
5
5
|
});
|
|
6
|
-
exports.
|
|
6
|
+
exports.renderSlider_unstable = void 0;
|
|
7
7
|
|
|
8
|
-
|
|
8
|
+
const React = /*#__PURE__*/require("react");
|
|
9
9
|
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
var react_utilities_1 = /*#__PURE__*/require("@fluentui/react-utilities");
|
|
13
|
-
|
|
14
|
-
var useSlider_1 = /*#__PURE__*/require("./useSlider");
|
|
10
|
+
const react_utilities_1 = /*#__PURE__*/require("@fluentui/react-utilities");
|
|
15
11
|
/**
|
|
16
12
|
* Render the final JSX of Slider
|
|
17
13
|
*/
|
|
18
14
|
|
|
19
15
|
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
return React.createElement(slots.root,
|
|
16
|
+
const renderSlider_unstable = state => {
|
|
17
|
+
const {
|
|
18
|
+
slots,
|
|
19
|
+
slotProps
|
|
20
|
+
} = react_utilities_1.getSlots(state);
|
|
21
|
+
return React.createElement(slots.root, { ...slotProps.root
|
|
22
|
+
}, React.createElement(slots.input, { ...slotProps.input
|
|
23
|
+
}), React.createElement(slots.rail, { ...slotProps.rail
|
|
24
|
+
}), React.createElement(slots.thumb, { ...slotProps.thumb
|
|
25
|
+
}));
|
|
26
26
|
};
|
|
27
27
|
|
|
28
|
-
exports.
|
|
28
|
+
exports.renderSlider_unstable = renderSlider_unstable;
|
|
29
29
|
//# sourceMappingURL=renderSlider.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["
|
|
1
|
+
{"version":3,"sources":["components/Slider/renderSlider.tsx"],"names":[],"mappings":";;;;;;;AAAA,MAAA,KAAA,gBAAA,OAAA,CAAA,OAAA,CAAA;;AACA,MAAA,iBAAA,gBAAA,OAAA,CAAA,2BAAA,CAAA;AAGA;;AAEG;;;AACI,MAAM,qBAAqB,GAAI,KAAD,IAAuB;AAC1D,QAAM;AAAE,IAAA,KAAF;AAAS,IAAA;AAAT,MAAuB,iBAAA,CAAA,QAAA,CAAsB,KAAtB,CAA7B;AAEA,SACE,KAAA,CAAA,aAAA,CAAC,KAAK,CAAC,IAAP,EAAW,EAAA,GAAK,SAAS,CAAC;AAAf,GAAX,EACE,KAAA,CAAA,aAAA,CAAC,KAAK,CAAC,KAAP,EAAY,EAAA,GAAK,SAAS,CAAC;AAAf,GAAZ,CADF,EAEE,KAAA,CAAA,aAAA,CAAC,KAAK,CAAC,IAAP,EAAW,EAAA,GAAK,SAAS,CAAC;AAAf,GAAX,CAFF,EAGE,KAAA,CAAA,aAAA,CAAC,KAAK,CAAC,KAAP,EAAY,EAAA,GAAK,SAAS,CAAC;AAAf,GAAZ,CAHF,CADF;AAOD,CAVM;;AAAM,OAAA,CAAA,qBAAA,GAAqB,qBAArB","sourcesContent":["import * as React from 'react';\nimport { getSlots } from '@fluentui/react-utilities';\nimport type { SliderState, SliderSlots } from './Slider.types';\n\n/**\n * Render the final JSX of Slider\n */\nexport const renderSlider_unstable = (state: SliderState) => {\n const { slots, slotProps } = getSlots<SliderSlots>(state);\n\n return (\n <slots.root {...slotProps.root}>\n <slots.input {...slotProps.input} />\n <slots.rail {...slotProps.rail} />\n <slots.thumb {...slotProps.thumb} />\n </slots.root>\n );\n};\n"],"sourceRoot":"../src/"}
|
|
@@ -1,10 +1,6 @@
|
|
|
1
1
|
import * as React from 'react';
|
|
2
|
-
import { SliderProps,
|
|
3
|
-
/**
|
|
4
|
-
* Array of all shorthand properties listed in sliderShorthandProps
|
|
5
|
-
*/
|
|
6
|
-
export declare const sliderShorthandProps: (keyof SliderSlots)[];
|
|
2
|
+
import { SliderProps, SliderState } from './Slider.types';
|
|
7
3
|
/**
|
|
8
4
|
* Given user props, returns state and render function for a Slider.
|
|
9
5
|
*/
|
|
10
|
-
export declare const
|
|
6
|
+
export declare const useSlider_unstable: (props: SliderProps, ref: React.Ref<HTMLInputElement>) => SliderState;
|
|
@@ -3,115 +3,82 @@
|
|
|
3
3
|
Object.defineProperty(exports, "__esModule", {
|
|
4
4
|
value: true
|
|
5
5
|
});
|
|
6
|
-
exports.
|
|
6
|
+
exports.useSlider_unstable = void 0;
|
|
7
7
|
|
|
8
|
-
|
|
8
|
+
const react_utilities_1 = /*#__PURE__*/require("@fluentui/react-utilities");
|
|
9
9
|
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
var useSliderState_1 = /*#__PURE__*/require("./useSliderState");
|
|
13
|
-
/**
|
|
14
|
-
* Array of all shorthand properties listed in sliderShorthandProps
|
|
15
|
-
*/
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
exports.sliderShorthandProps = ['root', 'activeRail', 'input', 'rail', 'sliderWrapper', 'thumb', 'thumbWrapper', 'track', 'trackWrapper', 'marksWrapper'];
|
|
10
|
+
const useSliderState_1 = /*#__PURE__*/require("./useSliderState");
|
|
19
11
|
/**
|
|
20
12
|
* Given user props, returns state and render function for a Slider.
|
|
21
13
|
*/
|
|
22
14
|
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
onChange
|
|
59
|
-
origin: origin,
|
|
60
|
-
size: size,
|
|
61
|
-
step: step,
|
|
62
|
-
vertical: vertical,
|
|
63
|
-
value: value,
|
|
15
|
+
|
|
16
|
+
const useSlider_unstable = (props, ref) => {
|
|
17
|
+
const nativeProps = react_utilities_1.getPartitionedNativeProps({
|
|
18
|
+
props,
|
|
19
|
+
primarySlotTagName: 'input',
|
|
20
|
+
excludedPropNames: ['onChange', 'size']
|
|
21
|
+
});
|
|
22
|
+
const {
|
|
23
|
+
// Props
|
|
24
|
+
value,
|
|
25
|
+
defaultValue,
|
|
26
|
+
min = 0,
|
|
27
|
+
max = 100,
|
|
28
|
+
step,
|
|
29
|
+
disabled,
|
|
30
|
+
vertical,
|
|
31
|
+
size = 'medium',
|
|
32
|
+
origin,
|
|
33
|
+
onChange,
|
|
34
|
+
// Slots
|
|
35
|
+
root,
|
|
36
|
+
input,
|
|
37
|
+
rail,
|
|
38
|
+
thumb
|
|
39
|
+
} = props;
|
|
40
|
+
const state = {
|
|
41
|
+
defaultValue,
|
|
42
|
+
disabled,
|
|
43
|
+
max,
|
|
44
|
+
min,
|
|
45
|
+
origin,
|
|
46
|
+
size,
|
|
47
|
+
step,
|
|
48
|
+
vertical,
|
|
49
|
+
value,
|
|
50
|
+
onChange,
|
|
64
51
|
components: {
|
|
65
|
-
activeRail: 'div',
|
|
66
52
|
input: 'input',
|
|
67
|
-
marksWrapper: 'div',
|
|
68
53
|
rail: 'div',
|
|
69
54
|
root: 'div',
|
|
70
|
-
|
|
71
|
-
thumb: 'div',
|
|
72
|
-
thumbWrapper: 'div',
|
|
73
|
-
track: 'div',
|
|
74
|
-
trackWrapper: 'div'
|
|
55
|
+
thumb: 'div'
|
|
75
56
|
},
|
|
76
|
-
root: react_utilities_1.
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
})),
|
|
81
|
-
activeRail: react_utilities_1.resolveShorthand(activeRail, {
|
|
82
|
-
required: true
|
|
57
|
+
root: react_utilities_1.resolveShorthand(root, {
|
|
58
|
+
required: true,
|
|
59
|
+
defaultProps: { ...nativeProps.root
|
|
60
|
+
}
|
|
83
61
|
}),
|
|
84
62
|
input: react_utilities_1.resolveShorthand(input, {
|
|
85
63
|
required: true,
|
|
86
64
|
defaultProps: {
|
|
87
|
-
|
|
65
|
+
id: react_utilities_1.useId('slider-', props.id),
|
|
66
|
+
ref,
|
|
67
|
+
...nativeProps.primary,
|
|
68
|
+
type: 'range',
|
|
69
|
+
orient: vertical ? 'vertical' : undefined
|
|
88
70
|
}
|
|
89
71
|
}),
|
|
90
|
-
marksWrapper: react_utilities_1.resolveShorthand(marksWrapper, {
|
|
91
|
-
required: true
|
|
92
|
-
}),
|
|
93
72
|
rail: react_utilities_1.resolveShorthand(rail, {
|
|
94
73
|
required: true
|
|
95
74
|
}),
|
|
96
|
-
sliderWrapper: react_utilities_1.resolveShorthand(sliderWrapper, {
|
|
97
|
-
required: true
|
|
98
|
-
}),
|
|
99
75
|
thumb: react_utilities_1.resolveShorthand(thumb, {
|
|
100
76
|
required: true
|
|
101
|
-
}),
|
|
102
|
-
thumbWrapper: react_utilities_1.resolveShorthand(thumbWrapper, {
|
|
103
|
-
required: true
|
|
104
|
-
}),
|
|
105
|
-
track: react_utilities_1.resolveShorthand(track, {
|
|
106
|
-
required: true
|
|
107
|
-
}),
|
|
108
|
-
trackWrapper: react_utilities_1.resolveShorthand(trackWrapper, {
|
|
109
|
-
required: true
|
|
110
77
|
})
|
|
111
78
|
};
|
|
112
|
-
useSliderState_1.
|
|
79
|
+
useSliderState_1.useSliderState_unstable(state);
|
|
113
80
|
return state;
|
|
114
81
|
};
|
|
115
82
|
|
|
116
|
-
exports.
|
|
83
|
+
exports.useSlider_unstable = useSlider_unstable;
|
|
117
84
|
//# sourceMappingURL=useSlider.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["
|
|
1
|
+
{"version":3,"sources":["components/Slider/useSlider.ts"],"names":[],"mappings":";;;;;;;AACA,MAAA,iBAAA,gBAAA,OAAA,CAAA,2BAAA,CAAA;;AACA,MAAA,gBAAA,gBAAA,OAAA,CAAA,kBAAA,CAAA;AAGA;;AAEG;;;AACI,MAAM,kBAAkB,GAAG,CAAC,KAAD,EAAqB,GAArB,KAAsE;AACtG,QAAM,WAAW,GAAG,iBAAA,CAAA,yBAAA,CAA0B;AAC5C,IAAA,KAD4C;AAE5C,IAAA,kBAAkB,EAAE,OAFwB;AAG5C,IAAA,iBAAiB,EAAE,CAAC,UAAD,EAAa,MAAb;AAHyB,GAA1B,CAApB;AAMA,QAAM;AACJ;AACA,IAAA,KAFI;AAGJ,IAAA,YAHI;AAIJ,IAAA,GAAG,GAAG,CAJF;AAKJ,IAAA,GAAG,GAAG,GALF;AAMJ,IAAA,IANI;AAOJ,IAAA,QAPI;AAQJ,IAAA,QARI;AASJ,IAAA,IAAI,GAAG,QATH;AAUJ,IAAA,MAVI;AAWJ,IAAA,QAXI;AAYJ;AACA,IAAA,IAbI;AAcJ,IAAA,KAdI;AAeJ,IAAA,IAfI;AAgBJ,IAAA;AAhBI,MAiBF,KAjBJ;AAmBA,QAAM,KAAK,GAAgB;AACzB,IAAA,YADyB;AAEzB,IAAA,QAFyB;AAGzB,IAAA,GAHyB;AAIzB,IAAA,GAJyB;AAKzB,IAAA,MALyB;AAMzB,IAAA,IANyB;AAOzB,IAAA,IAPyB;AAQzB,IAAA,QARyB;AASzB,IAAA,KATyB;AAUzB,IAAA,QAVyB;AAWzB,IAAA,UAAU,EAAE;AACV,MAAA,KAAK,EAAE,OADG;AAEV,MAAA,IAAI,EAAE,KAFI;AAGV,MAAA,IAAI,EAAE,KAHI;AAIV,MAAA,KAAK,EAAE;AAJG,KAXa;AAiBzB,IAAA,IAAI,EAAE,iBAAA,CAAA,gBAAA,CAAiB,IAAjB,EAAuB;AAC3B,MAAA,QAAQ,EAAE,IADiB;AAE3B,MAAA,YAAY,EAAE,EACZ,GAAG,WAAW,CAAC;AADH;AAFa,KAAvB,CAjBmB;AAuBzB,IAAA,KAAK,EAAE,iBAAA,CAAA,gBAAA,CAAiB,KAAjB,EAAwB;AAC7B,MAAA,QAAQ,EAAE,IADmB;AAE7B,MAAA,YAAY,EAAE;AACZ,QAAA,EAAE,EAAE,iBAAA,CAAA,KAAA,CAAM,SAAN,EAAiB,KAAK,CAAC,EAAvB,CADQ;AAEZ,QAAA,GAFY;AAGZ,WAAG,WAAW,CAAC,OAHH;AAIZ,QAAA,IAAI,EAAE,OAJM;AAKZ,QAAA,MAAM,EAAE,QAAQ,GAAG,UAAH,GAAgB;AALpB;AAFe,KAAxB,CAvBkB;AAiCzB,IAAA,IAAI,EAAE,iBAAA,CAAA,gBAAA,CAAiB,IAAjB,EAAuB;AAAE,MAAA,QAAQ,EAAE;AAAZ,KAAvB,CAjCmB;AAkCzB,IAAA,KAAK,EAAE,iBAAA,CAAA,gBAAA,CAAiB,KAAjB,EAAwB;AAAE,MAAA,QAAQ,EAAE;AAAZ,KAAxB;AAlCkB,GAA3B;AAqCA,EAAA,gBAAA,CAAA,uBAAA,CAAwB,KAAxB;AAEA,SAAO,KAAP;AACD,CAlEM;;AAAM,OAAA,CAAA,kBAAA,GAAkB,kBAAlB","sourcesContent":["import * as React from 'react';\nimport { getPartitionedNativeProps, resolveShorthand, useId } from '@fluentui/react-utilities';\nimport { useSliderState_unstable } from './useSliderState';\nimport { SliderProps, SliderState } from './Slider.types';\n\n/**\n * Given user props, returns state and render function for a Slider.\n */\nexport const useSlider_unstable = (props: SliderProps, ref: React.Ref<HTMLInputElement>): SliderState => {\n const nativeProps = getPartitionedNativeProps({\n props,\n primarySlotTagName: 'input',\n excludedPropNames: ['onChange', 'size'],\n });\n\n const {\n // Props\n value,\n defaultValue,\n min = 0,\n max = 100,\n step,\n disabled,\n vertical,\n size = 'medium',\n origin,\n onChange,\n // Slots\n root,\n input,\n rail,\n thumb,\n } = props;\n\n const state: SliderState = {\n defaultValue,\n disabled,\n max,\n min,\n origin,\n size,\n step,\n vertical,\n value,\n onChange,\n components: {\n input: 'input',\n rail: 'div',\n root: 'div',\n thumb: 'div',\n },\n root: resolveShorthand(root, {\n required: true,\n defaultProps: {\n ...nativeProps.root,\n },\n }),\n input: resolveShorthand(input, {\n required: true,\n defaultProps: {\n id: useId('slider-', props.id),\n ref,\n ...nativeProps.primary,\n type: 'range',\n orient: vertical ? 'vertical' : undefined,\n },\n }),\n rail: resolveShorthand(rail, { required: true }),\n thumb: resolveShorthand(thumb, { required: true }),\n };\n\n useSliderState_unstable(state);\n\n return state;\n};\n"],"sourceRoot":"../src/"}
|