@fluentui/react-slider 9.0.14 → 9.0.15

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (37) hide show
  1. package/CHANGELOG.json +60 -1
  2. package/CHANGELOG.md +16 -2
  3. package/lib/components/Slider/Slider.js +0 -1
  4. package/lib/components/Slider/Slider.js.map +1 -1
  5. package/lib/components/Slider/renderSlider.js +8 -5
  6. package/lib/components/Slider/renderSlider.js.map +1 -1
  7. package/lib/components/Slider/useSlider.js.map +1 -1
  8. package/lib/components/Slider/useSliderState.js +6 -8
  9. package/lib/components/Slider/useSliderState.js.map +1 -1
  10. package/lib/components/Slider/useSliderStyles.js +240 -249
  11. package/lib/components/Slider/useSliderStyles.js.map +1 -1
  12. package/lib/components/SliderField/SliderField.js.map +1 -1
  13. package/lib/index.js.map +1 -1
  14. package/lib-commonjs/Slider.js +0 -2
  15. package/lib-commonjs/Slider.js.map +1 -1
  16. package/lib-commonjs/SliderField.js +0 -2
  17. package/lib-commonjs/SliderField.js.map +1 -1
  18. package/lib-commonjs/components/Slider/Slider.js +0 -6
  19. package/lib-commonjs/components/Slider/Slider.js.map +1 -1
  20. package/lib-commonjs/components/Slider/Slider.types.js.map +1 -1
  21. package/lib-commonjs/components/Slider/index.js +0 -9
  22. package/lib-commonjs/components/Slider/index.js.map +1 -1
  23. package/lib-commonjs/components/Slider/renderSlider.js +8 -9
  24. package/lib-commonjs/components/Slider/renderSlider.js.map +1 -1
  25. package/lib-commonjs/components/Slider/useSlider.js +0 -5
  26. package/lib-commonjs/components/Slider/useSlider.js.map +1 -1
  27. package/lib-commonjs/components/Slider/useSliderState.js +6 -13
  28. package/lib-commonjs/components/Slider/useSliderState.js.map +1 -1
  29. package/lib-commonjs/components/Slider/useSliderStyles.js +240 -254
  30. package/lib-commonjs/components/Slider/useSliderStyles.js.map +1 -1
  31. package/lib-commonjs/components/SliderField/SliderField.js +0 -4
  32. package/lib-commonjs/components/SliderField/SliderField.js.map +1 -1
  33. package/lib-commonjs/components/SliderField/index.js +0 -2
  34. package/lib-commonjs/components/SliderField/index.js.map +1 -1
  35. package/lib-commonjs/index.js +0 -4
  36. package/lib-commonjs/index.js.map +1 -1
  37. package/package.json +8 -8
package/CHANGELOG.json CHANGED
@@ -2,7 +2,66 @@
2
2
  "name": "@fluentui/react-slider",
3
3
  "entries": [
4
4
  {
5
- "date": "Wed, 21 Dec 2022 10:17:13 GMT",
5
+ "date": "Wed, 04 Jan 2023 01:35:48 GMT",
6
+ "tag": "@fluentui/react-slider_v9.0.15",
7
+ "version": "9.0.15",
8
+ "comments": {
9
+ "none": [
10
+ {
11
+ "author": "martinhochel@microsoft.com",
12
+ "package": "@fluentui/react-slider",
13
+ "commit": "4ec2b998b294d6d9c3196d3d82893bdd97d0c105",
14
+ "comment": "chore(scripts): move index.ts to to follow sub-folder domain packaging"
15
+ },
16
+ {
17
+ "author": "martinhochel@microsoft.com",
18
+ "package": "@fluentui/react-slider",
19
+ "commit": "194b0cf0cc27c1c1233aa945f09b3ad29778d8ca",
20
+ "comment": "chore(scripts): use for @fluentui/scripts version within all package.json"
21
+ }
22
+ ],
23
+ "patch": [
24
+ {
25
+ "author": "olfedias@microsoft.com",
26
+ "package": "@fluentui/react-slider",
27
+ "commit": "2c38f1e4ae07b2b60df596efe11015a68f166dbf",
28
+ "comment": "chore: Update Griffel to latest version"
29
+ },
30
+ {
31
+ "author": "beachball",
32
+ "package": "@fluentui/react-slider",
33
+ "comment": "Bump @fluentui/react-field to v9.0.0-alpha.13",
34
+ "commit": "3e322d15529451be153e97298873253e21af4082"
35
+ },
36
+ {
37
+ "author": "beachball",
38
+ "package": "@fluentui/react-slider",
39
+ "comment": "Bump @fluentui/react-tabster to v9.3.5",
40
+ "commit": "3e322d15529451be153e97298873253e21af4082"
41
+ },
42
+ {
43
+ "author": "beachball",
44
+ "package": "@fluentui/react-slider",
45
+ "comment": "Bump @fluentui/react-utilities to v9.3.1",
46
+ "commit": "3e322d15529451be153e97298873253e21af4082"
47
+ },
48
+ {
49
+ "author": "beachball",
50
+ "package": "@fluentui/react-slider",
51
+ "comment": "Bump @fluentui/react-conformance-griffel to v9.0.0-beta.19",
52
+ "commit": "3e322d15529451be153e97298873253e21af4082"
53
+ },
54
+ {
55
+ "author": "beachball",
56
+ "package": "@fluentui/react-slider",
57
+ "comment": "Bump @fluentui/react-label to v9.0.15",
58
+ "commit": "3e322d15529451be153e97298873253e21af4082"
59
+ }
60
+ ]
61
+ }
62
+ },
63
+ {
64
+ "date": "Wed, 21 Dec 2022 10:20:31 GMT",
6
65
  "tag": "@fluentui/react-slider_v9.0.14",
7
66
  "version": "9.0.14",
8
67
  "comments": {
package/CHANGELOG.md CHANGED
@@ -1,12 +1,26 @@
1
1
  # Change Log - @fluentui/react-slider
2
2
 
3
- This log was last generated on Wed, 21 Dec 2022 10:17:13 GMT and should not be manually modified.
3
+ This log was last generated on Wed, 04 Jan 2023 01:35:48 GMT and should not be manually modified.
4
4
 
5
5
  <!-- Start content -->
6
6
 
7
+ ## [9.0.15](https://github.com/microsoft/fluentui/tree/@fluentui/react-slider_v9.0.15)
8
+
9
+ Wed, 04 Jan 2023 01:35:48 GMT
10
+ [Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-slider_v9.0.14..@fluentui/react-slider_v9.0.15)
11
+
12
+ ### Patches
13
+
14
+ - chore: Update Griffel to latest version ([PR #26045](https://github.com/microsoft/fluentui/pull/26045) by olfedias@microsoft.com)
15
+ - Bump @fluentui/react-field to v9.0.0-alpha.13 ([PR #26114](https://github.com/microsoft/fluentui/pull/26114) by beachball)
16
+ - Bump @fluentui/react-tabster to v9.3.5 ([PR #26114](https://github.com/microsoft/fluentui/pull/26114) by beachball)
17
+ - Bump @fluentui/react-utilities to v9.3.1 ([PR #26114](https://github.com/microsoft/fluentui/pull/26114) by beachball)
18
+ - Bump @fluentui/react-conformance-griffel to v9.0.0-beta.19 ([PR #26114](https://github.com/microsoft/fluentui/pull/26114) by beachball)
19
+ - Bump @fluentui/react-label to v9.0.15 ([PR #26114](https://github.com/microsoft/fluentui/pull/26114) by beachball)
20
+
7
21
  ## [9.0.14](https://github.com/microsoft/fluentui/tree/@fluentui/react-slider_v9.0.14)
8
22
 
9
- Wed, 21 Dec 2022 10:17:13 GMT
23
+ Wed, 21 Dec 2022 10:20:31 GMT
10
24
  [Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-slider_v9.0.13..@fluentui/react-slider_v9.0.14)
11
25
 
12
26
  ### Patches
@@ -5,7 +5,6 @@ import { useSliderStyles_unstable } from './useSliderStyles';
5
5
  /**
6
6
  * The Slider component allows users to quickly select a value by dragging a thumb across a rail.
7
7
  */
8
-
9
8
  export const Slider = /*#__PURE__*/React.forwardRef((props, ref) => {
10
9
  const state = useSlider_unstable(props, ref);
11
10
  useSliderStyles_unstable(state);
@@ -1 +1 @@
1
- {"version":3,"sources":["packages/react-components/react-slider/src/components/Slider/Slider.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAZ,MAAuB,OAAvB;AACA,SAAS,kBAAT,QAAmC,aAAnC;AACA,SAAS,qBAAT,QAAsC,gBAAtC;AACA,SAAS,wBAAT,QAAyC,mBAAzC;AAIA;;AAEG;;AACH,OAAO,MAAM,MAAM,gBAAqC,KAAK,CAAC,UAAN,CAAiB,CAAC,KAAD,EAAQ,GAAR,KAAe;EACtF,MAAM,KAAK,GAAG,kBAAkB,CAAC,KAAD,EAAQ,GAAR,CAAhC;EAEA,wBAAwB,CAAC,KAAD,CAAxB;EAEA,OAAO,qBAAqB,CAAC,KAAD,CAA5B;AACD,CANuD,CAAjD;AAOP,MAAM,CAAC,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
+ {"version":3,"mappings":"AAAA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAC9B,SAASC,kBAAkB,QAAQ,aAAa;AAChD,SAASC,qBAAqB,QAAQ,gBAAgB;AACtD,SAASC,wBAAwB,QAAQ,mBAAmB;AAI5D;;;AAGA,OAAO,MAAMC,MAAM,gBAAqCJ,KAAK,CAACK,UAAU,CAAC,CAACC,KAAK,EAAEC,GAAG,KAAI;EACtF,MAAMC,KAAK,GAAGP,kBAAkB,CAACK,KAAK,EAAEC,GAAG,CAAC;EAE5CJ,wBAAwB,CAACK,KAAK,CAAC;EAE/B,OAAON,qBAAqB,CAACM,KAAK,CAAC;AACrC,CAAC,CAAC;AACFJ,MAAM,CAACK,WAAW,GAAG,QAAQ","names":["React","useSlider_unstable","renderSlider_unstable","useSliderStyles_unstable","Slider","forwardRef","props","ref","state","displayName"],"sourceRoot":"../src/","sources":["packages/react-components/react-slider/src/components/Slider/Slider.tsx"],"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"]}
@@ -3,16 +3,19 @@ import { getSlots } from '@fluentui/react-utilities';
3
3
  /**
4
4
  * Render the final JSX of Slider
5
5
  */
6
-
7
6
  export const renderSlider_unstable = state => {
8
7
  const {
9
8
  slots,
10
9
  slotProps
11
10
  } = getSlots(state);
12
- return /*#__PURE__*/React.createElement(slots.root, { ...slotProps.root
13
- }, /*#__PURE__*/React.createElement(slots.input, { ...slotProps.input
14
- }), /*#__PURE__*/React.createElement(slots.rail, { ...slotProps.rail
15
- }), /*#__PURE__*/React.createElement(slots.thumb, { ...slotProps.thumb
11
+ return /*#__PURE__*/React.createElement(slots.root, {
12
+ ...slotProps.root
13
+ }, /*#__PURE__*/React.createElement(slots.input, {
14
+ ...slotProps.input
15
+ }), /*#__PURE__*/React.createElement(slots.rail, {
16
+ ...slotProps.rail
17
+ }), /*#__PURE__*/React.createElement(slots.thumb, {
18
+ ...slotProps.thumb
16
19
  }));
17
20
  };
18
21
  //# sourceMappingURL=renderSlider.js.map
@@ -1 +1 @@
1
- {"version":3,"sources":["packages/react-components/react-slider/src/components/Slider/renderSlider.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAZ,MAAuB,OAAvB;AACA,SAAS,QAAT,QAAyB,2BAAzB;AAGA;;AAEG;;AACH,OAAO,MAAM,qBAAqB,GAAI,KAAD,IAAuB;EAC1D,MAAM;IAAE,KAAF;IAAS;EAAT,IAAuB,QAAQ,CAAc,KAAd,CAArC;EAEA,oBACE,KAAA,CAAA,aAAA,CAAC,KAAK,CAAC,IAAP,EAAW,EAAA,GAAK,SAAS,CAAC;EAAf,CAAX,eACE,KAAA,CAAA,aAAA,CAAC,KAAK,CAAC,KAAP,EAAY,EAAA,GAAK,SAAS,CAAC;EAAf,CAAZ,CADF,eAEE,KAAA,CAAA,aAAA,CAAC,KAAK,CAAC,IAAP,EAAW,EAAA,GAAK,SAAS,CAAC;EAAf,CAAX,CAFF,eAGE,KAAA,CAAA,aAAA,CAAC,KAAK,CAAC,KAAP,EAAY,EAAA,GAAK,SAAS,CAAC;EAAf,CAAZ,CAHF,CADF;AAOD,CAVM","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
+ {"version":3,"mappings":"AAAA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAC9B,SAASC,QAAQ,QAAQ,2BAA2B;AAGpD;;;AAGA,OAAO,MAAMC,qBAAqB,GAAIC,KAAkB,IAAI;EAC1D,MAAM;IAAEC,KAAK;IAAEC;EAAS,CAAE,GAAGJ,QAAQ,CAAcE,KAAK,CAAC;EAEzD,oBACEH,oBAACI,KAAK,CAACE,IAAI;IAAA,GAAKD,SAAS,CAACC;EAAI,gBAC5BN,oBAACI,KAAK,CAACG,KAAK;IAAA,GAAKF,SAAS,CAACE;EAAK,EAAI,eACpCP,oBAACI,KAAK,CAACI,IAAI;IAAA,GAAKH,SAAS,CAACG;EAAI,EAAI,eAClCR,oBAACI,KAAK,CAACK,KAAK;IAAA,GAAKJ,SAAS,CAACI;EAAK,EAAI,CACzB;AAEjB,CAAC","names":["React","getSlots","renderSlider_unstable","state","slots","slotProps","root","input","rail","thumb"],"sourceRoot":"../src/","sources":["packages/react-components/react-slider/src/components/Slider/renderSlider.tsx"],"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"]}
@@ -1 +1 @@
1
- {"version":3,"sources":["packages/react-components/react-slider/src/components/Slider/useSlider.ts"],"names":[],"mappings":"AACA,SAAS,yBAAT,EAAoC,gBAApC,EAAsD,KAAtD,QAAmE,2BAAnE;AACA,SAAS,uBAAT,QAAwC,kBAAxC;AAEA,SAAS,cAAT,QAA+B,yBAA/B;AAEA,OAAO,MAAM,kBAAkB,GAAG,CAAC,KAAD,EAAqB,GAArB,KAAsE;EACtG,MAAM,WAAW,GAAG,yBAAyB,CAAC;IAC5C,KAD4C;IAE5C,kBAAkB,EAAE,OAFwB;IAG5C,iBAAiB,EAAE,CAAC,UAAD,EAAa,MAAb;EAHyB,CAAD,CAA7C;EAMA,MAAM;IACJ,QADI;IAEJ,QAFI;IAGJ,IAAI,GAAG,QAHH;IAIJ;IACA,IALI;IAMJ,KANI;IAOJ,IAPI;IAQJ;EARI,IASF,KATJ;EAWA,MAAM,KAAK,GAAgB;IACzB,QADyB;IAEzB,IAFyB;IAGzB,QAHyB;IAIzB,UAAU,EAAE;MACV,KAAK,EAAE,OADG;MAEV,IAAI,EAAE,KAFI;MAGV,IAAI,EAAE,KAHI;MAIV,KAAK,EAAE;IAJG,CAJa;IAUzB,IAAI,EAAE,gBAAgB,CAAC,IAAD,EAAO;MAC3B,QAAQ,EAAE,IADiB;MAE3B,YAAY,EAAE;QACZ,GAAG,EAAE,cAAc,EADP;QAEZ,GAAG,WAAW,CAAC;MAFH;IAFa,CAAP,CAVG;IAiBzB,KAAK,EAAE,gBAAgB,CAAC,KAAD,EAAQ;MAC7B,QAAQ,EAAE,IADmB;MAE7B,YAAY,EAAE;QACZ,EAAE,EAAE,KAAK,CAAC,SAAD,EAAY,KAAK,CAAC,EAAlB,CADG;QAEZ,GAFY;QAGZ,GAAG,WAAW,CAAC,OAHH;QAIZ,IAAI,EAAE,OAJM;QAKZ,MAAM,EAAE,QAAQ,GAAG,UAAH,GAAgB;MALpB;IAFe,CAAR,CAjBE;IA2BzB,IAAI,EAAE,gBAAgB,CAAC,IAAD,EAAO;MAAE,QAAQ,EAAE;IAAZ,CAAP,CA3BG;IA4BzB,KAAK,EAAE,gBAAgB,CAAC,KAAD,EAAQ;MAAE,QAAQ,EAAE;IAAZ,CAAR;EA5BE,CAA3B;EA+BA,uBAAuB,CAAC,KAAD,EAAQ,KAAR,CAAvB;EAEA,OAAO,KAAP;AACD,CApDM","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';\nimport { useFocusWithin } from '@fluentui/react-tabster';\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 disabled,\n vertical,\n size = 'medium',\n // Slots\n root,\n input,\n rail,\n thumb,\n } = props;\n\n const state: SliderState = {\n disabled,\n size,\n vertical,\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 ref: useFocusWithin<HTMLDivElement>(),\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, props);\n\n return state;\n};\n"],"sourceRoot":"../src/"}
1
+ {"version":3,"mappings":"AACA,SAASA,yBAAyB,EAAEC,gBAAgB,EAAEC,KAAK,QAAQ,2BAA2B;AAC9F,SAASC,uBAAuB,QAAQ,kBAAkB;AAE1D,SAASC,cAAc,QAAQ,yBAAyB;AAExD,OAAO,MAAMC,kBAAkB,GAAG,CAACC,KAAkB,EAAEC,GAAgC,KAAiB;EACtG,MAAMC,WAAW,GAAGR,yBAAyB,CAAC;IAC5CM,KAAK;IACLG,kBAAkB,EAAE,OAAO;IAC3BC,iBAAiB,EAAE,CAAC,UAAU,EAAE,MAAM;GACvC,CAAC;EAEF,MAAM;IACJC,QAAQ;IACRC,QAAQ;IACRC,IAAI,GAAG,QAAQ;IACf;IACAC,IAAI;IACJC,KAAK;IACLC,IAAI;IACJC;EAAK,CACN,GAAGX,KAAK;EAET,MAAMY,KAAK,GAAgB;IACzBP,QAAQ;IACRE,IAAI;IACJD,QAAQ;IACRO,UAAU,EAAE;MACVJ,KAAK,EAAE,OAAO;MACdC,IAAI,EAAE,KAAK;MACXF,IAAI,EAAE,KAAK;MACXG,KAAK,EAAE;KACR;IACDH,IAAI,EAAEb,gBAAgB,CAACa,IAAI,EAAE;MAC3BM,QAAQ,EAAE,IAAI;MACdC,YAAY,EAAE;QACZd,GAAG,EAAEH,cAAc,EAAkB;QACrC,GAAGI,WAAW,CAACM;;KAElB,CAAC;IACFC,KAAK,EAAEd,gBAAgB,CAACc,KAAK,EAAE;MAC7BK,QAAQ,EAAE,IAAI;MACdC,YAAY,EAAE;QACZC,EAAE,EAAEpB,KAAK,CAAC,SAAS,EAAEI,KAAK,CAACgB,EAAE,CAAC;QAC9Bf,GAAG;QACH,GAAGC,WAAW,CAACe,OAAO;QACtBC,IAAI,EAAE,OAAO;QACbC,MAAM,EAAEb,QAAQ,GAAG,UAAU,GAAGc;;KAEnC,CAAC;IACFV,IAAI,EAAEf,gBAAgB,CAACe,IAAI,EAAE;MAAEI,QAAQ,EAAE;IAAI,CAAE,CAAC;IAChDH,KAAK,EAAEhB,gBAAgB,CAACgB,KAAK,EAAE;MAAEG,QAAQ,EAAE;IAAI,CAAE;GAClD;EAEDjB,uBAAuB,CAACe,KAAK,EAAEZ,KAAK,CAAC;EAErC,OAAOY,KAAK;AACd,CAAC","names":["getPartitionedNativeProps","resolveShorthand","useId","useSliderState_unstable","useFocusWithin","useSlider_unstable","props","ref","nativeProps","primarySlotTagName","excludedPropNames","disabled","vertical","size","root","input","rail","thumb","state","components","required","defaultProps","id","primary","type","orient","undefined"],"sourceRoot":"../src/","sources":["packages/react-components/react-slider/src/components/Slider/useSlider.ts"],"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';\nimport { useFocusWithin } from '@fluentui/react-tabster';\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 disabled,\n vertical,\n size = 'medium',\n // Slots\n root,\n input,\n rail,\n thumb,\n } = props;\n\n const state: SliderState = {\n disabled,\n size,\n vertical,\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 ref: useFocusWithin<HTMLDivElement>(),\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, props);\n\n return state;\n};\n"]}
@@ -6,11 +6,9 @@ const {
6
6
  sliderProgressVar,
7
7
  sliderDirectionVar
8
8
  } = sliderCSSVars;
9
-
10
9
  const getPercent = (value, min, max) => {
11
10
  return max === min ? 0 : (value - min) / (max - min) * 100;
12
11
  };
13
-
14
12
  export const useSliderState_unstable = (state, props) => {
15
13
  const {
16
14
  defaultValue = 0,
@@ -33,7 +31,6 @@ export const useSliderState_unstable = (state, props) => {
33
31
  const onChange = useEventCallback(ev => {
34
32
  const newValue = Number(ev.target.value);
35
33
  setCurrentValue(clamp(newValue, min, max));
36
-
37
34
  if (inputOnChange && inputOnChange !== propsOnChange) {
38
35
  inputOnChange(ev);
39
36
  } else if (propsOnChange) {
@@ -46,12 +43,13 @@ export const useSliderState_unstable = (state, props) => {
46
43
  [sliderDirectionVar]: state.vertical ? '0deg' : dir === 'ltr' ? '90deg' : '270deg',
47
44
  [sliderStepsPercentVar]: step && step > 0 ? `${step * 100 / (max - min)}%` : '',
48
45
  [sliderProgressVar]: `${valuePercent}%`
49
- }; // Root props
50
-
51
- state.root.style = { ...rootVariables,
46
+ };
47
+ // Root props
48
+ state.root.style = {
49
+ ...rootVariables,
52
50
  ...state.root.style
53
- }; // Input Props
54
-
51
+ };
52
+ // Input Props
55
53
  state.input.value = currentValue;
56
54
  state.input.onChange = onChange;
57
55
  return state;
@@ -1 +1 @@
1
- {"version":3,"sources":["packages/react-components/react-slider/src/components/Slider/useSliderState.tsx"],"names":[],"mappings":"AACA,SAAS,KAAT,EAAgB,oBAAhB,EAAsC,gBAAtC,QAA8D,2BAA9D;AACA,SAAS,kBAAkB,IAAI,SAA/B,QAAgD,iCAAhD;AACA,SAAS,aAAT,QAA8B,mBAA9B;AAGA,MAAM;EAAE,qBAAF;EAAyB,iBAAzB;EAA4C;AAA5C,IAAmE,aAAzE;;AAEA,MAAM,UAAU,GAAG,CAAC,KAAD,EAAgB,GAAhB,EAA6B,GAA7B,KAA4C;EAC7D,OAAO,GAAG,KAAK,GAAR,GAAc,CAAd,GAAmB,CAAC,KAAK,GAAG,GAAT,KAAiB,GAAG,GAAG,GAAvB,CAAD,GAAgC,GAAzD;AACD,CAFD;;AAIA,OAAO,MAAM,uBAAuB,GAAG,CAAC,KAAD,EAAqB,KAArB,KAA2C;EAChF,MAAM;IAAE,YAAY,GAAG,CAAjB;IAAoB,GAAG,GAAG,CAA1B;IAA6B,GAAG,GAAG,GAAnC;IAAwC,IAAxC;IAA8C;EAA9C,IAAwD,KAA9D;EACA,MAAM;IAAE;EAAF,IAAU,SAAS,EAAzB;EACA,MAAM,CAAC,YAAD,EAAe,eAAf,IAAkC,oBAAoB,CAAC;IAC3D,KAAK,EAAE,KAAK,KAAK,SAAV,GAAsB,KAAK,CAAC,KAAD,EAAQ,GAAR,EAAa,GAAb,CAA3B,GAA+C,SADK;IAE3D,YAAY,EAAE,KAAK,CAAC,YAAD,EAAe,GAAf,EAAoB,GAApB,CAFwC;IAG3D,YAAY,EAAE;EAH6C,CAAD,CAA5D;EAKA,MAAM,YAAY,GAAG,UAAU,CAAC,YAAD,EAAe,GAAf,EAAoB,GAApB,CAA/B;EAEA,MAAM,aAAa,GAAG,KAAK,CAAC,KAAN,CAAY,QAAlC;EACA,MAAM,aAAa,GAAG,KAAK,CAAC,QAA5B;EAEA,MAAM,QAAQ,GAA+C,gBAAgB,CAAC,EAAE,IAAG;IACjF,MAAM,QAAQ,GAAG,MAAM,CAAC,EAAE,CAAC,MAAH,CAAU,KAAX,CAAvB;IACA,eAAe,CAAC,KAAK,CAAC,QAAD,EAAW,GAAX,EAAgB,GAAhB,CAAN,CAAf;;IAEA,IAAI,aAAa,IAAI,aAAa,KAAK,aAAvC,EAAsD;MACpD,aAAa,CAAC,EAAD,CAAb;IACD,CAFD,MAEO,IAAI,aAAJ,EAAmB;MACxB,aAAa,CAAC,EAAD,EAAK;QAAE,KAAK,EAAE;MAAT,CAAL,CAAb;IACD;EACF,CAT4E,CAA7E;EAWA,MAAM,aAAa,GAAG;IACpB,CAAC,kBAAD,GAAsB,KAAK,CAAC,QAAN,GAAiB,MAAjB,GAA0B,GAAG,KAAK,KAAR,GAAgB,OAAhB,GAA0B,QADtD;IAEpB,CAAC,qBAAD,GAAyB,IAAI,IAAI,IAAI,GAAG,CAAf,GAAmB,GAAI,IAAI,GAAG,GAAR,IAAgB,GAAG,GAAG,GAAtB,CAA0B,GAAhD,GAAsD,EAF3D;IAGpB,CAAC,iBAAD,GAAqB,GAAG,YAAY;EAHhB,CAAtB,CAxBgF,CA8BhF;;EACA,KAAK,CAAC,IAAN,CAAW,KAAX,GAAmB,EACjB,GAAG,aADc;IAEjB,GAAG,KAAK,CAAC,IAAN,CAAW;EAFG,CAAnB,CA/BgF,CAoChF;;EACA,KAAK,CAAC,KAAN,CAAY,KAAZ,GAAoB,YAApB;EACA,KAAK,CAAC,KAAN,CAAY,QAAZ,GAAuB,QAAvB;EAEA,OAAO,KAAP;AACD,CAzCM","sourcesContent":["import * as React from 'react';\nimport { clamp, useControllableState, useEventCallback } from '@fluentui/react-utilities';\nimport { useFluent_unstable as useFluent } from '@fluentui/react-shared-contexts';\nimport { sliderCSSVars } from './useSliderStyles';\nimport type { SliderState, SliderProps } from './Slider.types';\n\nconst { sliderStepsPercentVar, sliderProgressVar, sliderDirectionVar } = sliderCSSVars;\n\nconst getPercent = (value: number, min: number, max: number) => {\n return max === min ? 0 : ((value - min) / (max - min)) * 100;\n};\n\nexport const useSliderState_unstable = (state: SliderState, props: SliderProps) => {\n const { defaultValue = 0, min = 0, max = 100, step, value } = props;\n const { dir } = useFluent();\n const [currentValue, setCurrentValue] = useControllableState({\n state: value !== undefined ? clamp(value, min, max) : undefined,\n defaultState: clamp(defaultValue, min, max),\n initialState: 0,\n });\n const valuePercent = getPercent(currentValue, min, max);\n\n const inputOnChange = state.input.onChange;\n const propsOnChange = props.onChange;\n\n const onChange: React.ChangeEventHandler<HTMLInputElement> = useEventCallback(ev => {\n const newValue = Number(ev.target.value);\n setCurrentValue(clamp(newValue, min, max));\n\n if (inputOnChange && inputOnChange !== propsOnChange) {\n inputOnChange(ev);\n } else if (propsOnChange) {\n propsOnChange(ev, { value: newValue });\n }\n });\n\n const rootVariables = {\n [sliderDirectionVar]: state.vertical ? '0deg' : dir === 'ltr' ? '90deg' : '270deg',\n [sliderStepsPercentVar]: step && step > 0 ? `${(step * 100) / (max - min)}%` : '',\n [sliderProgressVar]: `${valuePercent}%`,\n };\n\n // Root props\n state.root.style = {\n ...rootVariables,\n ...state.root.style,\n };\n\n // Input Props\n state.input.value = currentValue;\n state.input.onChange = onChange;\n\n return state;\n};\n"],"sourceRoot":"../src/"}
1
+ {"version":3,"mappings":"AACA,SAASA,KAAK,EAAEC,oBAAoB,EAAEC,gBAAgB,QAAQ,2BAA2B;AACzF,SAASC,kBAAkB,IAAIC,SAAS,QAAQ,iCAAiC;AACjF,SAASC,aAAa,QAAQ,mBAAmB;AAGjD,MAAM;EAAEC,qBAAqB;EAAEC,iBAAiB;EAAEC;AAAkB,CAAE,GAAGH,aAAa;AAEtF,MAAMI,UAAU,GAAG,CAACC,KAAa,EAAEC,GAAW,EAAEC,GAAW,KAAI;EAC7D,OAAOA,GAAG,KAAKD,GAAG,GAAG,CAAC,GAAI,CAACD,KAAK,GAAGC,GAAG,KAAKC,GAAG,GAAGD,GAAG,CAAC,GAAI,GAAG;AAC9D,CAAC;AAED,OAAO,MAAME,uBAAuB,GAAG,CAACC,KAAkB,EAAEC,KAAkB,KAAI;EAChF,MAAM;IAAEC,YAAY,GAAG,CAAC;IAAEL,GAAG,GAAG,CAAC;IAAEC,GAAG,GAAG,GAAG;IAAEK,IAAI;IAAEP;EAAK,CAAE,GAAGK,KAAK;EACnE,MAAM;IAAEG;EAAG,CAAE,GAAGd,SAAS,EAAE;EAC3B,MAAM,CAACe,YAAY,EAAEC,eAAe,CAAC,GAAGnB,oBAAoB,CAAC;IAC3Da,KAAK,EAAEJ,KAAK,KAAKW,SAAS,GAAGrB,KAAK,CAACU,KAAK,EAAEC,GAAG,EAAEC,GAAG,CAAC,GAAGS,SAAS;IAC/DC,YAAY,EAAEtB,KAAK,CAACgB,YAAY,EAAEL,GAAG,EAAEC,GAAG,CAAC;IAC3CW,YAAY,EAAE;GACf,CAAC;EACF,MAAMC,YAAY,GAAGf,UAAU,CAACU,YAAY,EAAER,GAAG,EAAEC,GAAG,CAAC;EAEvD,MAAMa,aAAa,GAAGX,KAAK,CAACY,KAAK,CAACC,QAAQ;EAC1C,MAAMC,aAAa,GAAGb,KAAK,CAACY,QAAQ;EAEpC,MAAMA,QAAQ,GAA+CzB,gBAAgB,CAAC2B,EAAE,IAAG;IACjF,MAAMC,QAAQ,GAAGC,MAAM,CAACF,EAAE,CAACG,MAAM,CAACtB,KAAK,CAAC;IACxCU,eAAe,CAACpB,KAAK,CAAC8B,QAAQ,EAAEnB,GAAG,EAAEC,GAAG,CAAC,CAAC;IAE1C,IAAIa,aAAa,IAAIA,aAAa,KAAKG,aAAa,EAAE;MACpDH,aAAa,CAACI,EAAE,CAAC;KAClB,MAAM,IAAID,aAAa,EAAE;MACxBA,aAAa,CAACC,EAAE,EAAE;QAAEnB,KAAK,EAAEoB;MAAQ,CAAE,CAAC;;EAE1C,CAAC,CAAC;EAEF,MAAMG,aAAa,GAAG;IACpB,CAACzB,kBAAkB,GAAGM,KAAK,CAACoB,QAAQ,GAAG,MAAM,GAAGhB,GAAG,KAAK,KAAK,GAAG,OAAO,GAAG,QAAQ;IAClF,CAACZ,qBAAqB,GAAGW,IAAI,IAAIA,IAAI,GAAG,CAAC,GAAG,GAAIA,IAAI,GAAG,GAAG,IAAKL,GAAG,GAAGD,GAAG,CAAC,GAAG,GAAG,EAAE;IACjF,CAACJ,iBAAiB,GAAG,GAAGiB,YAAY;GACrC;EAED;EACAV,KAAK,CAACqB,IAAI,CAACC,KAAK,GAAG;IACjB,GAAGH,aAAa;IAChB,GAAGnB,KAAK,CAACqB,IAAI,CAACC;GACf;EAED;EACAtB,KAAK,CAACY,KAAK,CAAChB,KAAK,GAAGS,YAAY;EAChCL,KAAK,CAACY,KAAK,CAACC,QAAQ,GAAGA,QAAQ;EAE/B,OAAOb,KAAK;AACd,CAAC","names":["clamp","useControllableState","useEventCallback","useFluent_unstable","useFluent","sliderCSSVars","sliderStepsPercentVar","sliderProgressVar","sliderDirectionVar","getPercent","value","min","max","useSliderState_unstable","state","props","defaultValue","step","dir","currentValue","setCurrentValue","undefined","defaultState","initialState","valuePercent","inputOnChange","input","onChange","propsOnChange","ev","newValue","Number","target","rootVariables","vertical","root","style"],"sourceRoot":"../src/","sources":["packages/react-components/react-slider/src/components/Slider/useSliderState.tsx"],"sourcesContent":["import * as React from 'react';\nimport { clamp, useControllableState, useEventCallback } from '@fluentui/react-utilities';\nimport { useFluent_unstable as useFluent } from '@fluentui/react-shared-contexts';\nimport { sliderCSSVars } from './useSliderStyles';\nimport type { SliderState, SliderProps } from './Slider.types';\n\nconst { sliderStepsPercentVar, sliderProgressVar, sliderDirectionVar } = sliderCSSVars;\n\nconst getPercent = (value: number, min: number, max: number) => {\n return max === min ? 0 : ((value - min) / (max - min)) * 100;\n};\n\nexport const useSliderState_unstable = (state: SliderState, props: SliderProps) => {\n const { defaultValue = 0, min = 0, max = 100, step, value } = props;\n const { dir } = useFluent();\n const [currentValue, setCurrentValue] = useControllableState({\n state: value !== undefined ? clamp(value, min, max) : undefined,\n defaultState: clamp(defaultValue, min, max),\n initialState: 0,\n });\n const valuePercent = getPercent(currentValue, min, max);\n\n const inputOnChange = state.input.onChange;\n const propsOnChange = props.onChange;\n\n const onChange: React.ChangeEventHandler<HTMLInputElement> = useEventCallback(ev => {\n const newValue = Number(ev.target.value);\n setCurrentValue(clamp(newValue, min, max));\n\n if (inputOnChange && inputOnChange !== propsOnChange) {\n inputOnChange(ev);\n } else if (propsOnChange) {\n propsOnChange(ev, { value: newValue });\n }\n });\n\n const rootVariables = {\n [sliderDirectionVar]: state.vertical ? '0deg' : dir === 'ltr' ? '90deg' : '270deg',\n [sliderStepsPercentVar]: step && step > 0 ? `${(step * 100) / (max - min)}%` : '',\n [sliderProgressVar]: `${valuePercent}%`,\n };\n\n // Root props\n state.root.style = {\n ...rootVariables,\n ...state.root.style,\n };\n\n // Input Props\n state.input.value = currentValue;\n state.input.onChange = onChange;\n\n return state;\n};\n"]}