@fluentui/react-carousel 9.9.8 → 9.9.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.
Files changed (86) hide show
  1. package/CHANGELOG.md +18 -2
  2. package/lib/components/Carousel/useCarousel.js +1 -1
  3. package/lib/components/Carousel/useCarousel.js.map +1 -1
  4. package/lib/components/Carousel/useCarouselStyles.styles.js +0 -2
  5. package/lib/components/Carousel/useCarouselStyles.styles.js.map +1 -1
  6. package/lib/components/Carousel/useCarouselStyles.styles.raw.js +0 -1
  7. package/lib/components/Carousel/useCarouselStyles.styles.raw.js.map +1 -1
  8. package/lib/components/CarouselAutoplayButton/useCarouselAutoplayButtonStyles.styles.js +0 -2
  9. package/lib/components/CarouselAutoplayButton/useCarouselAutoplayButtonStyles.styles.js.map +1 -1
  10. package/lib/components/CarouselAutoplayButton/useCarouselAutoplayButtonStyles.styles.raw.js +0 -1
  11. package/lib/components/CarouselAutoplayButton/useCarouselAutoplayButtonStyles.styles.raw.js.map +1 -1
  12. package/lib/components/CarouselButton/useCarouselButtonStyles.styles.js +1 -0
  13. package/lib/components/CarouselButton/useCarouselButtonStyles.styles.js.map +1 -1
  14. package/lib/components/CarouselButton/useCarouselButtonStyles.styles.raw.js +1 -1
  15. package/lib/components/CarouselButton/useCarouselButtonStyles.styles.raw.js.map +1 -1
  16. package/lib/components/CarouselCard/useCarouselCardStyles.styles.js +0 -2
  17. package/lib/components/CarouselCard/useCarouselCardStyles.styles.js.map +1 -1
  18. package/lib/components/CarouselCard/useCarouselCardStyles.styles.raw.js +0 -1
  19. package/lib/components/CarouselCard/useCarouselCardStyles.styles.raw.js.map +1 -1
  20. package/lib/components/CarouselNav/useCarouselNavStyles.styles.js +0 -2
  21. package/lib/components/CarouselNav/useCarouselNavStyles.styles.js.map +1 -1
  22. package/lib/components/CarouselNav/useCarouselNavStyles.styles.raw.js +0 -1
  23. package/lib/components/CarouselNav/useCarouselNavStyles.styles.raw.js.map +1 -1
  24. package/lib/components/CarouselNavButton/useCarouselNavButtonStyles.styles.js +0 -2
  25. package/lib/components/CarouselNavButton/useCarouselNavButtonStyles.styles.js.map +1 -1
  26. package/lib/components/CarouselNavButton/useCarouselNavButtonStyles.styles.raw.js +0 -1
  27. package/lib/components/CarouselNavButton/useCarouselNavButtonStyles.styles.raw.js.map +1 -1
  28. package/lib/components/CarouselNavContainer/useCarouselNavContainerStyles.styles.js +0 -2
  29. package/lib/components/CarouselNavContainer/useCarouselNavContainerStyles.styles.js.map +1 -1
  30. package/lib/components/CarouselNavContainer/useCarouselNavContainerStyles.styles.raw.js +0 -1
  31. package/lib/components/CarouselNavContainer/useCarouselNavContainerStyles.styles.raw.js.map +1 -1
  32. package/lib/components/CarouselNavImageButton/useCarouselNavImageButtonStyles.styles.js +0 -2
  33. package/lib/components/CarouselNavImageButton/useCarouselNavImageButtonStyles.styles.js.map +1 -1
  34. package/lib/components/CarouselNavImageButton/useCarouselNavImageButtonStyles.styles.raw.js +0 -1
  35. package/lib/components/CarouselNavImageButton/useCarouselNavImageButtonStyles.styles.raw.js.map +1 -1
  36. package/lib/components/CarouselSlider/useCarouselSliderStyles.styles.js +0 -2
  37. package/lib/components/CarouselSlider/useCarouselSliderStyles.styles.js.map +1 -1
  38. package/lib/components/CarouselSlider/useCarouselSliderStyles.styles.raw.js +0 -1
  39. package/lib/components/CarouselSlider/useCarouselSliderStyles.styles.raw.js.map +1 -1
  40. package/lib/components/CarouselViewport/useCarouselViewportStyles.styles.js +0 -2
  41. package/lib/components/CarouselViewport/useCarouselViewportStyles.styles.js.map +1 -1
  42. package/lib/components/CarouselViewport/useCarouselViewportStyles.styles.raw.js +0 -1
  43. package/lib/components/CarouselViewport/useCarouselViewportStyles.styles.raw.js.map +1 -1
  44. package/lib-commonjs/components/Carousel/useCarousel.js +1 -1
  45. package/lib-commonjs/components/Carousel/useCarousel.js.map +1 -1
  46. package/lib-commonjs/components/Carousel/useCarouselStyles.styles.js +0 -1
  47. package/lib-commonjs/components/Carousel/useCarouselStyles.styles.js.map +1 -1
  48. package/lib-commonjs/components/Carousel/useCarouselStyles.styles.raw.js +0 -1
  49. package/lib-commonjs/components/Carousel/useCarouselStyles.styles.raw.js.map +1 -1
  50. package/lib-commonjs/components/CarouselAutoplayButton/useCarouselAutoplayButtonStyles.styles.js +0 -1
  51. package/lib-commonjs/components/CarouselAutoplayButton/useCarouselAutoplayButtonStyles.styles.js.map +1 -1
  52. package/lib-commonjs/components/CarouselAutoplayButton/useCarouselAutoplayButtonStyles.styles.raw.js +0 -1
  53. package/lib-commonjs/components/CarouselAutoplayButton/useCarouselAutoplayButtonStyles.styles.raw.js.map +1 -1
  54. package/lib-commonjs/components/CarouselButton/useCarouselButtonStyles.styles.js +1 -0
  55. package/lib-commonjs/components/CarouselButton/useCarouselButtonStyles.styles.js.map +1 -1
  56. package/lib-commonjs/components/CarouselButton/useCarouselButtonStyles.styles.raw.js +1 -1
  57. package/lib-commonjs/components/CarouselButton/useCarouselButtonStyles.styles.raw.js.map +1 -1
  58. package/lib-commonjs/components/CarouselCard/useCarouselCardStyles.styles.js +0 -1
  59. package/lib-commonjs/components/CarouselCard/useCarouselCardStyles.styles.js.map +1 -1
  60. package/lib-commonjs/components/CarouselCard/useCarouselCardStyles.styles.raw.js +0 -1
  61. package/lib-commonjs/components/CarouselCard/useCarouselCardStyles.styles.raw.js.map +1 -1
  62. package/lib-commonjs/components/CarouselNav/useCarouselNavStyles.styles.js +0 -1
  63. package/lib-commonjs/components/CarouselNav/useCarouselNavStyles.styles.js.map +1 -1
  64. package/lib-commonjs/components/CarouselNav/useCarouselNavStyles.styles.raw.js +0 -1
  65. package/lib-commonjs/components/CarouselNav/useCarouselNavStyles.styles.raw.js.map +1 -1
  66. package/lib-commonjs/components/CarouselNavButton/useCarouselNavButtonStyles.styles.js +0 -1
  67. package/lib-commonjs/components/CarouselNavButton/useCarouselNavButtonStyles.styles.js.map +1 -1
  68. package/lib-commonjs/components/CarouselNavButton/useCarouselNavButtonStyles.styles.raw.js +0 -1
  69. package/lib-commonjs/components/CarouselNavButton/useCarouselNavButtonStyles.styles.raw.js.map +1 -1
  70. package/lib-commonjs/components/CarouselNavContainer/useCarouselNavContainerStyles.styles.js +0 -1
  71. package/lib-commonjs/components/CarouselNavContainer/useCarouselNavContainerStyles.styles.js.map +1 -1
  72. package/lib-commonjs/components/CarouselNavContainer/useCarouselNavContainerStyles.styles.raw.js +0 -1
  73. package/lib-commonjs/components/CarouselNavContainer/useCarouselNavContainerStyles.styles.raw.js.map +1 -1
  74. package/lib-commonjs/components/CarouselNavImageButton/useCarouselNavImageButtonStyles.styles.js +0 -1
  75. package/lib-commonjs/components/CarouselNavImageButton/useCarouselNavImageButtonStyles.styles.js.map +1 -1
  76. package/lib-commonjs/components/CarouselNavImageButton/useCarouselNavImageButtonStyles.styles.raw.js +0 -1
  77. package/lib-commonjs/components/CarouselNavImageButton/useCarouselNavImageButtonStyles.styles.raw.js.map +1 -1
  78. package/lib-commonjs/components/CarouselSlider/useCarouselSliderStyles.styles.js +0 -1
  79. package/lib-commonjs/components/CarouselSlider/useCarouselSliderStyles.styles.js.map +1 -1
  80. package/lib-commonjs/components/CarouselSlider/useCarouselSliderStyles.styles.raw.js +0 -1
  81. package/lib-commonjs/components/CarouselSlider/useCarouselSliderStyles.styles.raw.js.map +1 -1
  82. package/lib-commonjs/components/CarouselViewport/useCarouselViewportStyles.styles.js +0 -1
  83. package/lib-commonjs/components/CarouselViewport/useCarouselViewportStyles.styles.js.map +1 -1
  84. package/lib-commonjs/components/CarouselViewport/useCarouselViewportStyles.styles.raw.js +0 -1
  85. package/lib-commonjs/components/CarouselViewport/useCarouselViewportStyles.styles.raw.js.map +1 -1
  86. package/package.json +8 -8
@@ -71,8 +71,6 @@ const useStyles = /*#__PURE__*/__styles({
71
71
  * Apply styling to the CarouselNavImageButton slots based on the state
72
72
  */
73
73
  export const useCarouselNavImageButtonStyles_unstable = state => {
74
- 'use no memo';
75
-
76
74
  const {
77
75
  selected
78
76
  } = state;
@@ -1 +1 @@
1
- {"version":3,"names":["__styles","mergeClasses","shorthands","tokens","carouselNavImageButtonClassNames","root","image","imageButtonSize","selectedImageButtonSize","useStyles","B7ck84d","Byoj8tv","uwmqm3","z189sj","z8tnut","B0ocmuz","jrapky","Frg6f3","t21cq0","B6of3ja","B74szlk","g2u3we","h3c5rm","B9xav0g","zhjwy3","Beyfa6y","Bbmb7ep","Btl43ni","B7oj6ja","Dimara","a9b677","Bqenvij","B68tc82","Bmxbyg5","Bpg54ce","eoavqd","selected","d","p","h","useCarouselNavImageButtonStyles_unstable","state","styles","className","_state_image"],"sources":["useCarouselNavImageButtonStyles.styles.js"],"sourcesContent":["'use client';\nimport { makeStyles, mergeClasses, shorthands } from '@griffel/react';\nimport { tokens } from '@fluentui/react-theme';\nexport const carouselNavImageButtonClassNames = {\n root: 'fui-CarouselNavImageButton',\n image: 'fui-CarouselNavImageButton__image'\n};\nconst imageButtonSize = 40;\nconst selectedImageButtonSize = 48;\n/**\n * Styles for the root slot\n */ const useStyles = makeStyles({\n root: {\n boxSizing: 'content-box',\n padding: '0px',\n margin: `0 ${tokens.spacingHorizontalXS}`,\n ...shorthands.borderColor(tokens.colorTransparentStroke),\n borderRadius: tokens.borderRadiusSmall,\n width: imageButtonSize + 'px',\n height: imageButtonSize + 'px',\n overflow: 'hidden',\n ':hover': {\n cursor: 'pointer'\n }\n },\n image: {\n width: imageButtonSize + 'px',\n height: imageButtonSize + 'px',\n borderRadius: tokens.borderRadiusSmall\n },\n selected: {\n width: selectedImageButtonSize + 'px',\n height: selectedImageButtonSize + 'px'\n }\n});\n/**\n * Apply styling to the CarouselNavImageButton slots based on the state\n */ export const useCarouselNavImageButtonStyles_unstable = (state)=>{\n 'use no memo';\n const { selected } = state;\n const styles = useStyles();\n // eslint-disable-next-line react-hooks/immutability\n state.root.className = mergeClasses(carouselNavImageButtonClassNames.root, styles.root, selected && styles.selected, state.root.className);\n if (state.image) {\n var _state_image;\n // eslint-disable-next-line react-hooks/immutability\n state.image.className = mergeClasses(carouselNavImageButtonClassNames.image, styles.image, selected && styles.selected, (_state_image = state.image) === null || _state_image === void 0 ? void 0 : _state_image.className);\n }\n return state;\n};\n"],"mappings":"AAAA,YAAY;;AACZ,SAAAA,QAAA,EAAqBC,YAAY,EAAEC,UAAU,QAAQ,gBAAgB;AACrE,SAASC,MAAM,QAAQ,uBAAuB;AAC9C,OAAO,MAAMC,gCAAgC,GAAG;EAC5CC,IAAI,EAAE,4BAA4B;EAClCC,KAAK,EAAE;AACX,CAAC;AACD,MAAMC,eAAe,GAAG,EAAE;AAC1B,MAAMC,uBAAuB,GAAG,EAAE;AAClC;AACA;AACA;AAAI,MAAMC,SAAS,gBAAGT,QAAA;EAAAK,IAAA;IAAAK,OAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,MAAA;EAAA;EAAA7B,KAAA;IAAAwB,MAAA;IAAAC,OAAA;IAAAN,OAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,MAAA;EAAA;EAAAO,QAAA;IAAAN,MAAA;IAAAC,OAAA;EAAA;AAAA;EAAAM,CAAA;IAAAC,CAAA;EAAA;IAAAA,CAAA;EAAA;IAAAA,CAAA;EAAA;IAAAA,CAAA;EAAA;IAAAA,CAAA;EAAA;EAAAC,CAAA;AAAA,CAuBrB,CAAC;AACF;AACA;AACA;AAAI,OAAO,MAAMC,wCAAwC,GAAIC,KAAK,IAAG;EACjE,aAAa;;EACb,MAAM;IAAEL;EAAS,CAAC,GAAGK,KAAK;EAC1B,MAAMC,MAAM,GAAGjC,SAAS,CAAC,CAAC;EAC1B;EACAgC,KAAK,CAACpC,IAAI,CAACsC,SAAS,GAAG1C,YAAY,CAACG,gCAAgC,CAACC,IAAI,EAAEqC,MAAM,CAACrC,IAAI,EAAE+B,QAAQ,IAAIM,MAAM,CAACN,QAAQ,EAAEK,KAAK,CAACpC,IAAI,CAACsC,SAAS,CAAC;EAC1I,IAAIF,KAAK,CAACnC,KAAK,EAAE;IACb,IAAIsC,YAAY;IAChB;IACAH,KAAK,CAACnC,KAAK,CAACqC,SAAS,GAAG1C,YAAY,CAACG,gCAAgC,CAACE,KAAK,EAAEoC,MAAM,CAACpC,KAAK,EAAE8B,QAAQ,IAAIM,MAAM,CAACN,QAAQ,EAAE,CAACQ,YAAY,GAAGH,KAAK,CAACnC,KAAK,MAAM,IAAI,IAAIsC,YAAY,KAAK,KAAK,CAAC,GAAG,KAAK,CAAC,GAAGA,YAAY,CAACD,SAAS,CAAC;EAC/N;EACA,OAAOF,KAAK;AAChB,CAAC","ignoreList":[]}
1
+ {"version":3,"names":["__styles","mergeClasses","shorthands","tokens","carouselNavImageButtonClassNames","root","image","imageButtonSize","selectedImageButtonSize","useStyles","B7ck84d","Byoj8tv","uwmqm3","z189sj","z8tnut","B0ocmuz","jrapky","Frg6f3","t21cq0","B6of3ja","B74szlk","g2u3we","h3c5rm","B9xav0g","zhjwy3","Beyfa6y","Bbmb7ep","Btl43ni","B7oj6ja","Dimara","a9b677","Bqenvij","B68tc82","Bmxbyg5","Bpg54ce","eoavqd","selected","d","p","h","useCarouselNavImageButtonStyles_unstable","state","styles","className","_state_image"],"sources":["useCarouselNavImageButtonStyles.styles.js"],"sourcesContent":["'use client';\nimport { makeStyles, mergeClasses, shorthands } from '@griffel/react';\nimport { tokens } from '@fluentui/react-theme';\nexport const carouselNavImageButtonClassNames = {\n root: 'fui-CarouselNavImageButton',\n image: 'fui-CarouselNavImageButton__image'\n};\nconst imageButtonSize = 40;\nconst selectedImageButtonSize = 48;\n/**\n * Styles for the root slot\n */ const useStyles = makeStyles({\n root: {\n boxSizing: 'content-box',\n padding: '0px',\n margin: `0 ${tokens.spacingHorizontalXS}`,\n ...shorthands.borderColor(tokens.colorTransparentStroke),\n borderRadius: tokens.borderRadiusSmall,\n width: imageButtonSize + 'px',\n height: imageButtonSize + 'px',\n overflow: 'hidden',\n ':hover': {\n cursor: 'pointer'\n }\n },\n image: {\n width: imageButtonSize + 'px',\n height: imageButtonSize + 'px',\n borderRadius: tokens.borderRadiusSmall\n },\n selected: {\n width: selectedImageButtonSize + 'px',\n height: selectedImageButtonSize + 'px'\n }\n});\n/**\n * Apply styling to the CarouselNavImageButton slots based on the state\n */ export const useCarouselNavImageButtonStyles_unstable = (state)=>{\n const { selected } = state;\n const styles = useStyles();\n // eslint-disable-next-line react-hooks/immutability\n state.root.className = mergeClasses(carouselNavImageButtonClassNames.root, styles.root, selected && styles.selected, state.root.className);\n if (state.image) {\n var _state_image;\n // eslint-disable-next-line react-hooks/immutability\n state.image.className = mergeClasses(carouselNavImageButtonClassNames.image, styles.image, selected && styles.selected, (_state_image = state.image) === null || _state_image === void 0 ? void 0 : _state_image.className);\n }\n return state;\n};\n"],"mappings":"AAAA,YAAY;;AACZ,SAAAA,QAAA,EAAqBC,YAAY,EAAEC,UAAU,QAAQ,gBAAgB;AACrE,SAASC,MAAM,QAAQ,uBAAuB;AAC9C,OAAO,MAAMC,gCAAgC,GAAG;EAC5CC,IAAI,EAAE,4BAA4B;EAClCC,KAAK,EAAE;AACX,CAAC;AACD,MAAMC,eAAe,GAAG,EAAE;AAC1B,MAAMC,uBAAuB,GAAG,EAAE;AAClC;AACA;AACA;AAAI,MAAMC,SAAS,gBAAGT,QAAA;EAAAK,IAAA;IAAAK,OAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,MAAA;EAAA;EAAA7B,KAAA;IAAAwB,MAAA;IAAAC,OAAA;IAAAN,OAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,MAAA;EAAA;EAAAO,QAAA;IAAAN,MAAA;IAAAC,OAAA;EAAA;AAAA;EAAAM,CAAA;IAAAC,CAAA;EAAA;IAAAA,CAAA;EAAA;IAAAA,CAAA;EAAA;IAAAA,CAAA;EAAA;IAAAA,CAAA;EAAA;EAAAC,CAAA;AAAA,CAuBrB,CAAC;AACF;AACA;AACA;AAAI,OAAO,MAAMC,wCAAwC,GAAIC,KAAK,IAAG;EACjE,MAAM;IAAEL;EAAS,CAAC,GAAGK,KAAK;EAC1B,MAAMC,MAAM,GAAGjC,SAAS,CAAC,CAAC;EAC1B;EACAgC,KAAK,CAACpC,IAAI,CAACsC,SAAS,GAAG1C,YAAY,CAACG,gCAAgC,CAACC,IAAI,EAAEqC,MAAM,CAACrC,IAAI,EAAE+B,QAAQ,IAAIM,MAAM,CAACN,QAAQ,EAAEK,KAAK,CAACpC,IAAI,CAACsC,SAAS,CAAC;EAC1I,IAAIF,KAAK,CAACnC,KAAK,EAAE;IACb,IAAIsC,YAAY;IAChB;IACAH,KAAK,CAACnC,KAAK,CAACqC,SAAS,GAAG1C,YAAY,CAACG,gCAAgC,CAACE,KAAK,EAAEoC,MAAM,CAACpC,KAAK,EAAE8B,QAAQ,IAAIM,MAAM,CAACN,QAAQ,EAAE,CAACQ,YAAY,GAAGH,KAAK,CAACnC,KAAK,MAAM,IAAI,IAAIsC,YAAY,KAAK,KAAK,CAAC,GAAG,KAAK,CAAC,GAAGA,YAAY,CAACD,SAAS,CAAC;EAC/N;EACA,OAAOF,KAAK;AAChB,CAAC","ignoreList":[]}
@@ -36,7 +36,6 @@ const selectedImageButtonSize = 48;
36
36
  /**
37
37
  * Apply styling to the CarouselNavImageButton slots based on the state
38
38
  */ export const useCarouselNavImageButtonStyles_unstable = (state)=>{
39
- 'use no memo';
40
39
  const { selected } = state;
41
40
  const styles = useStyles();
42
41
  // eslint-disable-next-line react-hooks/immutability
@@ -1 +1 @@
1
- {"version":3,"sources":["../src/components/CarouselNavImageButton/useCarouselNavImageButtonStyles.styles.ts"],"sourcesContent":["'use client';\n\nimport { makeStyles, mergeClasses, shorthands } from '@griffel/react';\nimport type { SlotClassNames } from '@fluentui/react-utilities';\nimport type { CarouselNavImageButtonSlots, CarouselNavImageButtonState } from './CarouselNavImageButton.types';\nimport { tokens } from '@fluentui/react-theme';\n\nexport const carouselNavImageButtonClassNames: SlotClassNames<CarouselNavImageButtonSlots> = {\n root: 'fui-CarouselNavImageButton',\n image: 'fui-CarouselNavImageButton__image',\n};\n\nconst imageButtonSize = 40;\nconst selectedImageButtonSize = 48;\n\n/**\n * Styles for the root slot\n */\nconst useStyles = makeStyles({\n root: {\n boxSizing: 'content-box',\n padding: '0px',\n margin: `0 ${tokens.spacingHorizontalXS}`,\n ...shorthands.borderColor(tokens.colorTransparentStroke),\n borderRadius: tokens.borderRadiusSmall,\n width: imageButtonSize + 'px',\n height: imageButtonSize + 'px',\n overflow: 'hidden',\n ':hover': {\n cursor: 'pointer',\n },\n },\n image: {\n width: imageButtonSize + 'px',\n height: imageButtonSize + 'px',\n borderRadius: tokens.borderRadiusSmall,\n },\n selected: {\n width: selectedImageButtonSize + 'px',\n height: selectedImageButtonSize + 'px',\n },\n});\n\n/**\n * Apply styling to the CarouselNavImageButton slots based on the state\n */\nexport const useCarouselNavImageButtonStyles_unstable = (\n state: CarouselNavImageButtonState,\n): CarouselNavImageButtonState => {\n 'use no memo';\n\n const { selected } = state;\n const styles = useStyles();\n\n // eslint-disable-next-line react-hooks/immutability\n state.root.className = mergeClasses(\n carouselNavImageButtonClassNames.root,\n styles.root,\n selected && styles.selected,\n state.root.className,\n );\n\n if (state.image) {\n // eslint-disable-next-line react-hooks/immutability\n state.image.className = mergeClasses(\n carouselNavImageButtonClassNames.image,\n styles.image,\n selected && styles.selected,\n state.image?.className,\n );\n }\n\n return state;\n};\n"],"names":["makeStyles","mergeClasses","shorthands","tokens","carouselNavImageButtonClassNames","root","image","imageButtonSize","selectedImageButtonSize","useStyles","boxSizing","padding","margin","spacingHorizontalXS","borderColor","colorTransparentStroke","borderRadius","borderRadiusSmall","width","height","overflow","cursor","selected","useCarouselNavImageButtonStyles_unstable","state","styles","className"],"mappings":"AAAA;AAEA,SAASA,UAAU,EAAEC,YAAY,EAAEC,UAAU,QAAQ,iBAAiB;AAGtE,SAASC,MAAM,QAAQ,wBAAwB;AAE/C,OAAO,MAAMC,mCAAgF;IAC3FC,MAAM;IACNC,OAAO;AACT,EAAE;AAEF,MAAMC,kBAAkB;AACxB,MAAMC,0BAA0B;AAEhC;;CAEC,GACD,MAAMC,YAAYT,WAAW;IAC3BK,MAAM;QACJK,WAAW;QACXC,SAAS;QACTC,QAAQ,CAAC,EAAE,EAAET,OAAOU,mBAAmB,EAAE;QACzC,GAAGX,WAAWY,WAAW,CAACX,OAAOY,sBAAsB,CAAC;QACxDC,cAAcb,OAAOc,iBAAiB;QACtCC,OAAOX,kBAAkB;QACzBY,QAAQZ,kBAAkB;QAC1Ba,UAAU;QACV,UAAU;YACRC,QAAQ;QACV;IACF;IACAf,OAAO;QACLY,OAAOX,kBAAkB;QACzBY,QAAQZ,kBAAkB;QAC1BS,cAAcb,OAAOc,iBAAiB;IACxC;IACAK,UAAU;QACRJ,OAAOV,0BAA0B;QACjCW,QAAQX,0BAA0B;IACpC;AACF;AAEA;;CAEC,GACD,OAAO,MAAMe,2CAA2C,CACtDC;IAEA;IAEA,MAAM,EAAEF,QAAQ,EAAE,GAAGE;IACrB,MAAMC,SAAShB;IAEf,oDAAoD;IACpDe,MAAMnB,IAAI,CAACqB,SAAS,GAAGzB,aACrBG,iCAAiCC,IAAI,EACrCoB,OAAOpB,IAAI,EACXiB,YAAYG,OAAOH,QAAQ,EAC3BE,MAAMnB,IAAI,CAACqB,SAAS;IAGtB,IAAIF,MAAMlB,KAAK,EAAE;YAMbkB;QALF,oDAAoD;QACpDA,MAAMlB,KAAK,CAACoB,SAAS,GAAGzB,aACtBG,iCAAiCE,KAAK,EACtCmB,OAAOnB,KAAK,EACZgB,YAAYG,OAAOH,QAAQ,GAC3BE,eAAAA,MAAMlB,KAAK,cAAXkB,mCAAAA,aAAaE,SAAS;IAE1B;IAEA,OAAOF;AACT,EAAE"}
1
+ {"version":3,"sources":["../src/components/CarouselNavImageButton/useCarouselNavImageButtonStyles.styles.ts"],"sourcesContent":["'use client';\n\nimport { makeStyles, mergeClasses, shorthands } from '@griffel/react';\nimport type { SlotClassNames } from '@fluentui/react-utilities';\nimport type { CarouselNavImageButtonSlots, CarouselNavImageButtonState } from './CarouselNavImageButton.types';\nimport { tokens } from '@fluentui/react-theme';\n\nexport const carouselNavImageButtonClassNames: SlotClassNames<CarouselNavImageButtonSlots> = {\n root: 'fui-CarouselNavImageButton',\n image: 'fui-CarouselNavImageButton__image',\n};\n\nconst imageButtonSize = 40;\nconst selectedImageButtonSize = 48;\n\n/**\n * Styles for the root slot\n */\nconst useStyles = makeStyles({\n root: {\n boxSizing: 'content-box',\n padding: '0px',\n margin: `0 ${tokens.spacingHorizontalXS}`,\n ...shorthands.borderColor(tokens.colorTransparentStroke),\n borderRadius: tokens.borderRadiusSmall,\n width: imageButtonSize + 'px',\n height: imageButtonSize + 'px',\n overflow: 'hidden',\n ':hover': {\n cursor: 'pointer',\n },\n },\n image: {\n width: imageButtonSize + 'px',\n height: imageButtonSize + 'px',\n borderRadius: tokens.borderRadiusSmall,\n },\n selected: {\n width: selectedImageButtonSize + 'px',\n height: selectedImageButtonSize + 'px',\n },\n});\n\n/**\n * Apply styling to the CarouselNavImageButton slots based on the state\n */\nexport const useCarouselNavImageButtonStyles_unstable = (\n state: CarouselNavImageButtonState,\n): CarouselNavImageButtonState => {\n const { selected } = state;\n const styles = useStyles();\n\n // eslint-disable-next-line react-hooks/immutability\n state.root.className = mergeClasses(\n carouselNavImageButtonClassNames.root,\n styles.root,\n selected && styles.selected,\n state.root.className,\n );\n\n if (state.image) {\n // eslint-disable-next-line react-hooks/immutability\n state.image.className = mergeClasses(\n carouselNavImageButtonClassNames.image,\n styles.image,\n selected && styles.selected,\n state.image?.className,\n );\n }\n\n return state;\n};\n"],"names":["makeStyles","mergeClasses","shorthands","tokens","carouselNavImageButtonClassNames","root","image","imageButtonSize","selectedImageButtonSize","useStyles","boxSizing","padding","margin","spacingHorizontalXS","borderColor","colorTransparentStroke","borderRadius","borderRadiusSmall","width","height","overflow","cursor","selected","useCarouselNavImageButtonStyles_unstable","state","styles","className"],"mappings":"AAAA;AAEA,SAASA,UAAU,EAAEC,YAAY,EAAEC,UAAU,QAAQ,iBAAiB;AAGtE,SAASC,MAAM,QAAQ,wBAAwB;AAE/C,OAAO,MAAMC,mCAAgF;IAC3FC,MAAM;IACNC,OAAO;AACT,EAAE;AAEF,MAAMC,kBAAkB;AACxB,MAAMC,0BAA0B;AAEhC;;CAEC,GACD,MAAMC,YAAYT,WAAW;IAC3BK,MAAM;QACJK,WAAW;QACXC,SAAS;QACTC,QAAQ,CAAC,EAAE,EAAET,OAAOU,mBAAmB,EAAE;QACzC,GAAGX,WAAWY,WAAW,CAACX,OAAOY,sBAAsB,CAAC;QACxDC,cAAcb,OAAOc,iBAAiB;QACtCC,OAAOX,kBAAkB;QACzBY,QAAQZ,kBAAkB;QAC1Ba,UAAU;QACV,UAAU;YACRC,QAAQ;QACV;IACF;IACAf,OAAO;QACLY,OAAOX,kBAAkB;QACzBY,QAAQZ,kBAAkB;QAC1BS,cAAcb,OAAOc,iBAAiB;IACxC;IACAK,UAAU;QACRJ,OAAOV,0BAA0B;QACjCW,QAAQX,0BAA0B;IACpC;AACF;AAEA;;CAEC,GACD,OAAO,MAAMe,2CAA2C,CACtDC;IAEA,MAAM,EAAEF,QAAQ,EAAE,GAAGE;IACrB,MAAMC,SAAShB;IAEf,oDAAoD;IACpDe,MAAMnB,IAAI,CAACqB,SAAS,GAAGzB,aACrBG,iCAAiCC,IAAI,EACrCoB,OAAOpB,IAAI,EACXiB,YAAYG,OAAOH,QAAQ,EAC3BE,MAAMnB,IAAI,CAACqB,SAAS;IAGtB,IAAIF,MAAMlB,KAAK,EAAE;YAMbkB;QALF,oDAAoD;QACpDA,MAAMlB,KAAK,CAACoB,SAAS,GAAGzB,aACtBG,iCAAiCE,KAAK,EACtCmB,OAAOnB,KAAK,EACZgB,YAAYG,OAAOH,QAAQ,GAC3BE,eAAAA,MAAMlB,KAAK,cAAXkB,mCAAAA,aAAaE,SAAS;IAE1B;IAEA,OAAOF;AACT,EAAE"}
@@ -28,8 +28,6 @@ const useStyles = /*#__PURE__*/__styles({
28
28
  * Apply styling to the CarouselSlider slots based on the state
29
29
  */
30
30
  export const useCarouselSliderStyles_unstable = state => {
31
- 'use no memo';
32
-
33
31
  const appearance = useCarouselContext(context => context.appearance);
34
32
  const styles = useStyles();
35
33
  // eslint-disable-next-line react-hooks/immutability
@@ -1 +1 @@
1
- {"version":3,"names":["__styles","mergeClasses","tokens","useCarouselContext_unstable","useCarouselContext","carouselSliderClassNames","root","useStyles","mc9l5x","Eiaeu8","elevated","i8kkvl","Belr9w4","rmohyg","d","p","useCarouselSliderStyles_unstable","state","appearance","context","styles","className"],"sources":["useCarouselSliderStyles.styles.js"],"sourcesContent":["'use client';\nimport { makeStyles, mergeClasses } from '@griffel/react';\nimport { tokens } from '@fluentui/react-theme';\nimport { useCarouselContext_unstable as useCarouselContext } from '../CarouselContext';\nexport const carouselSliderClassNames = {\n root: 'fui-CarouselSlider'\n};\n/**\n * Styles for the root slot\n */ const useStyles = makeStyles({\n root: {\n display: 'flex',\n overflowAnchor: 'none'\n },\n elevated: {\n gap: tokens.spacingHorizontalXXL\n }\n});\n/**\n * Apply styling to the CarouselSlider slots based on the state\n */ export const useCarouselSliderStyles_unstable = (state)=>{\n 'use no memo';\n const appearance = useCarouselContext((context)=>context.appearance);\n const styles = useStyles();\n // eslint-disable-next-line react-hooks/immutability\n state.root.className = mergeClasses(carouselSliderClassNames.root, styles.root, appearance === 'elevated' && styles.elevated, state.root.className);\n return state;\n};\n"],"mappings":"AAAA,YAAY;;AACZ,SAAAA,QAAA,EAAqBC,YAAY,QAAQ,gBAAgB;AACzD,SAASC,MAAM,QAAQ,uBAAuB;AAC9C,SAASC,2BAA2B,IAAIC,kBAAkB,QAAQ,oBAAoB;AACtF,OAAO,MAAMC,wBAAwB,GAAG;EACpCC,IAAI,EAAE;AACV,CAAC;AACD;AACA;AACA;AAAI,MAAMC,SAAS,gBAAGP,QAAA;EAAAM,IAAA;IAAAE,MAAA;IAAAC,MAAA;EAAA;EAAAC,QAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,MAAA;EAAA;AAAA;EAAAC,CAAA;IAAAC,CAAA;EAAA;AAAA,CAQrB,CAAC;AACF;AACA;AACA;AAAI,OAAO,MAAMC,gCAAgC,GAAIC,KAAK,IAAG;EACzD,aAAa;;EACb,MAAMC,UAAU,GAAGd,kBAAkB,CAAEe,OAAO,IAAGA,OAAO,CAACD,UAAU,CAAC;EACpE,MAAME,MAAM,GAAGb,SAAS,CAAC,CAAC;EAC1B;EACAU,KAAK,CAACX,IAAI,CAACe,SAAS,GAAGpB,YAAY,CAACI,wBAAwB,CAACC,IAAI,EAAEc,MAAM,CAACd,IAAI,EAAEY,UAAU,KAAK,UAAU,IAAIE,MAAM,CAACV,QAAQ,EAAEO,KAAK,CAACX,IAAI,CAACe,SAAS,CAAC;EACnJ,OAAOJ,KAAK;AAChB,CAAC","ignoreList":[]}
1
+ {"version":3,"names":["__styles","mergeClasses","tokens","useCarouselContext_unstable","useCarouselContext","carouselSliderClassNames","root","useStyles","mc9l5x","Eiaeu8","elevated","i8kkvl","Belr9w4","rmohyg","d","p","useCarouselSliderStyles_unstable","state","appearance","context","styles","className"],"sources":["useCarouselSliderStyles.styles.js"],"sourcesContent":["'use client';\nimport { makeStyles, mergeClasses } from '@griffel/react';\nimport { tokens } from '@fluentui/react-theme';\nimport { useCarouselContext_unstable as useCarouselContext } from '../CarouselContext';\nexport const carouselSliderClassNames = {\n root: 'fui-CarouselSlider'\n};\n/**\n * Styles for the root slot\n */ const useStyles = makeStyles({\n root: {\n display: 'flex',\n overflowAnchor: 'none'\n },\n elevated: {\n gap: tokens.spacingHorizontalXXL\n }\n});\n/**\n * Apply styling to the CarouselSlider slots based on the state\n */ export const useCarouselSliderStyles_unstable = (state)=>{\n const appearance = useCarouselContext((context)=>context.appearance);\n const styles = useStyles();\n // eslint-disable-next-line react-hooks/immutability\n state.root.className = mergeClasses(carouselSliderClassNames.root, styles.root, appearance === 'elevated' && styles.elevated, state.root.className);\n return state;\n};\n"],"mappings":"AAAA,YAAY;;AACZ,SAAAA,QAAA,EAAqBC,YAAY,QAAQ,gBAAgB;AACzD,SAASC,MAAM,QAAQ,uBAAuB;AAC9C,SAASC,2BAA2B,IAAIC,kBAAkB,QAAQ,oBAAoB;AACtF,OAAO,MAAMC,wBAAwB,GAAG;EACpCC,IAAI,EAAE;AACV,CAAC;AACD;AACA;AACA;AAAI,MAAMC,SAAS,gBAAGP,QAAA;EAAAM,IAAA;IAAAE,MAAA;IAAAC,MAAA;EAAA;EAAAC,QAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,MAAA;EAAA;AAAA;EAAAC,CAAA;IAAAC,CAAA;EAAA;AAAA,CAQrB,CAAC;AACF;AACA;AACA;AAAI,OAAO,MAAMC,gCAAgC,GAAIC,KAAK,IAAG;EACzD,MAAMC,UAAU,GAAGd,kBAAkB,CAAEe,OAAO,IAAGA,OAAO,CAACD,UAAU,CAAC;EACpE,MAAME,MAAM,GAAGb,SAAS,CAAC,CAAC;EAC1B;EACAU,KAAK,CAACX,IAAI,CAACe,SAAS,GAAGpB,YAAY,CAACI,wBAAwB,CAACC,IAAI,EAAEc,MAAM,CAACd,IAAI,EAAEY,UAAU,KAAK,UAAU,IAAIE,MAAM,CAACV,QAAQ,EAAEO,KAAK,CAACX,IAAI,CAACe,SAAS,CAAC;EACnJ,OAAOJ,KAAK;AAChB,CAAC","ignoreList":[]}
@@ -19,7 +19,6 @@ export const carouselSliderClassNames = {
19
19
  /**
20
20
  * Apply styling to the CarouselSlider slots based on the state
21
21
  */ export const useCarouselSliderStyles_unstable = (state)=>{
22
- 'use no memo';
23
22
  const appearance = useCarouselContext((context)=>context.appearance);
24
23
  const styles = useStyles();
25
24
  // eslint-disable-next-line react-hooks/immutability
@@ -1 +1 @@
1
- {"version":3,"sources":["../src/components/CarouselSlider/useCarouselSliderStyles.styles.ts"],"sourcesContent":["'use client';\n\nimport { makeStyles, mergeClasses } from '@griffel/react';\nimport type { SlotClassNames } from '@fluentui/react-utilities';\nimport { tokens } from '@fluentui/react-theme';\nimport { useCarouselContext_unstable as useCarouselContext } from '../CarouselContext';\n\nimport type { CarouselSliderSlots, CarouselSliderState } from './CarouselSlider.types';\n\nexport const carouselSliderClassNames: SlotClassNames<CarouselSliderSlots> = {\n root: 'fui-CarouselSlider',\n};\n\n/**\n * Styles for the root slot\n */\nconst useStyles = makeStyles({\n root: {\n display: 'flex',\n overflowAnchor: 'none',\n },\n elevated: {\n gap: tokens.spacingHorizontalXXL,\n },\n});\n\n/**\n * Apply styling to the CarouselSlider slots based on the state\n */\nexport const useCarouselSliderStyles_unstable = (state: CarouselSliderState): CarouselSliderState => {\n 'use no memo';\n\n const appearance = useCarouselContext(context => context.appearance);\n const styles = useStyles();\n\n // eslint-disable-next-line react-hooks/immutability\n state.root.className = mergeClasses(\n carouselSliderClassNames.root,\n styles.root,\n appearance === 'elevated' && styles.elevated,\n state.root.className,\n );\n\n return state;\n};\n"],"names":["makeStyles","mergeClasses","tokens","useCarouselContext_unstable","useCarouselContext","carouselSliderClassNames","root","useStyles","display","overflowAnchor","elevated","gap","spacingHorizontalXXL","useCarouselSliderStyles_unstable","state","appearance","context","styles","className"],"mappings":"AAAA;AAEA,SAASA,UAAU,EAAEC,YAAY,QAAQ,iBAAiB;AAE1D,SAASC,MAAM,QAAQ,wBAAwB;AAC/C,SAASC,+BAA+BC,kBAAkB,QAAQ,qBAAqB;AAIvF,OAAO,MAAMC,2BAAgE;IAC3EC,MAAM;AACR,EAAE;AAEF;;CAEC,GACD,MAAMC,YAAYP,WAAW;IAC3BM,MAAM;QACJE,SAAS;QACTC,gBAAgB;IAClB;IACAC,UAAU;QACRC,KAAKT,OAAOU,oBAAoB;IAClC;AACF;AAEA;;CAEC,GACD,OAAO,MAAMC,mCAAmC,CAACC;IAC/C;IAEA,MAAMC,aAAaX,mBAAmBY,CAAAA,UAAWA,QAAQD,UAAU;IACnE,MAAME,SAASV;IAEf,oDAAoD;IACpDO,MAAMR,IAAI,CAACY,SAAS,GAAGjB,aACrBI,yBAAyBC,IAAI,EAC7BW,OAAOX,IAAI,EACXS,eAAe,cAAcE,OAAOP,QAAQ,EAC5CI,MAAMR,IAAI,CAACY,SAAS;IAGtB,OAAOJ;AACT,EAAE"}
1
+ {"version":3,"sources":["../src/components/CarouselSlider/useCarouselSliderStyles.styles.ts"],"sourcesContent":["'use client';\n\nimport { makeStyles, mergeClasses } from '@griffel/react';\nimport type { SlotClassNames } from '@fluentui/react-utilities';\nimport { tokens } from '@fluentui/react-theme';\nimport { useCarouselContext_unstable as useCarouselContext } from '../CarouselContext';\n\nimport type { CarouselSliderSlots, CarouselSliderState } from './CarouselSlider.types';\n\nexport const carouselSliderClassNames: SlotClassNames<CarouselSliderSlots> = {\n root: 'fui-CarouselSlider',\n};\n\n/**\n * Styles for the root slot\n */\nconst useStyles = makeStyles({\n root: {\n display: 'flex',\n overflowAnchor: 'none',\n },\n elevated: {\n gap: tokens.spacingHorizontalXXL,\n },\n});\n\n/**\n * Apply styling to the CarouselSlider slots based on the state\n */\nexport const useCarouselSliderStyles_unstable = (state: CarouselSliderState): CarouselSliderState => {\n const appearance = useCarouselContext(context => context.appearance);\n const styles = useStyles();\n\n // eslint-disable-next-line react-hooks/immutability\n state.root.className = mergeClasses(\n carouselSliderClassNames.root,\n styles.root,\n appearance === 'elevated' && styles.elevated,\n state.root.className,\n );\n\n return state;\n};\n"],"names":["makeStyles","mergeClasses","tokens","useCarouselContext_unstable","useCarouselContext","carouselSliderClassNames","root","useStyles","display","overflowAnchor","elevated","gap","spacingHorizontalXXL","useCarouselSliderStyles_unstable","state","appearance","context","styles","className"],"mappings":"AAAA;AAEA,SAASA,UAAU,EAAEC,YAAY,QAAQ,iBAAiB;AAE1D,SAASC,MAAM,QAAQ,wBAAwB;AAC/C,SAASC,+BAA+BC,kBAAkB,QAAQ,qBAAqB;AAIvF,OAAO,MAAMC,2BAAgE;IAC3EC,MAAM;AACR,EAAE;AAEF;;CAEC,GACD,MAAMC,YAAYP,WAAW;IAC3BM,MAAM;QACJE,SAAS;QACTC,gBAAgB;IAClB;IACAC,UAAU;QACRC,KAAKT,OAAOU,oBAAoB;IAClC;AACF;AAEA;;CAEC,GACD,OAAO,MAAMC,mCAAmC,CAACC;IAC/C,MAAMC,aAAaX,mBAAmBY,CAAAA,UAAWA,QAAQD,UAAU;IACnE,MAAME,SAASV;IAEf,oDAAoD;IACpDO,MAAMR,IAAI,CAACY,SAAS,GAAGjB,aACrBI,yBAAyBC,IAAI,EAC7BW,OAAOX,IAAI,EACXS,eAAe,cAAcE,OAAOP,QAAQ,EAC5CI,MAAMR,IAAI,CAACY,SAAS;IAGtB,OAAOJ;AACT,EAAE"}
@@ -19,8 +19,6 @@ const useStyles = /*#__PURE__*/__styles({
19
19
  * Apply styling to the CarouselViewport slots based on the state
20
20
  */
21
21
  export const useCarouselViewportStyles_unstable = state => {
22
- 'use no memo';
23
-
24
22
  const styles = useStyles();
25
23
  // eslint-disable-next-line react-hooks/immutability
26
24
  state.root.className = mergeClasses(carouselViewportClassNames.root, styles.root, state.root.className);
@@ -1 +1 @@
1
- {"version":3,"names":["__styles","mergeClasses","carouselViewportClassNames","root","useStyles","B2u0y6b","a9b677","d","useCarouselViewportStyles_unstable","state","styles","className"],"sources":["useCarouselViewportStyles.styles.js"],"sourcesContent":["'use client';\nimport { makeStyles, mergeClasses } from '@griffel/react';\nexport const carouselViewportClassNames = {\n root: 'fui-CarouselViewport'\n};\n/**\n * Styles for the root slot\n */ const useStyles = makeStyles({\n root: {\n maxWidth: '100%',\n width: 'auto'\n }\n});\n/**\n * Apply styling to the CarouselViewport slots based on the state\n */ export const useCarouselViewportStyles_unstable = (state)=>{\n 'use no memo';\n const styles = useStyles();\n // eslint-disable-next-line react-hooks/immutability\n state.root.className = mergeClasses(carouselViewportClassNames.root, styles.root, state.root.className);\n return state;\n};\n"],"mappings":"AAAA,YAAY;;AACZ,SAAAA,QAAA,EAAqBC,YAAY,QAAQ,gBAAgB;AACzD,OAAO,MAAMC,0BAA0B,GAAG;EACtCC,IAAI,EAAE;AACV,CAAC;AACD;AACA;AACA;AAAI,MAAMC,SAAS,gBAAGJ,QAAA;EAAAG,IAAA;IAAAE,OAAA;IAAAC,MAAA;EAAA;AAAA;EAAAC,CAAA;AAAA,CAKrB,CAAC;AACF;AACA;AACA;AAAI,OAAO,MAAMC,kCAAkC,GAAIC,KAAK,IAAG;EAC3D,aAAa;;EACb,MAAMC,MAAM,GAAGN,SAAS,CAAC,CAAC;EAC1B;EACAK,KAAK,CAACN,IAAI,CAACQ,SAAS,GAAGV,YAAY,CAACC,0BAA0B,CAACC,IAAI,EAAEO,MAAM,CAACP,IAAI,EAAEM,KAAK,CAACN,IAAI,CAACQ,SAAS,CAAC;EACvG,OAAOF,KAAK;AAChB,CAAC","ignoreList":[]}
1
+ {"version":3,"names":["__styles","mergeClasses","carouselViewportClassNames","root","useStyles","B2u0y6b","a9b677","d","useCarouselViewportStyles_unstable","state","styles","className"],"sources":["useCarouselViewportStyles.styles.js"],"sourcesContent":["'use client';\nimport { makeStyles, mergeClasses } from '@griffel/react';\nexport const carouselViewportClassNames = {\n root: 'fui-CarouselViewport'\n};\n/**\n * Styles for the root slot\n */ const useStyles = makeStyles({\n root: {\n maxWidth: '100%',\n width: 'auto'\n }\n});\n/**\n * Apply styling to the CarouselViewport slots based on the state\n */ export const useCarouselViewportStyles_unstable = (state)=>{\n const styles = useStyles();\n // eslint-disable-next-line react-hooks/immutability\n state.root.className = mergeClasses(carouselViewportClassNames.root, styles.root, state.root.className);\n return state;\n};\n"],"mappings":"AAAA,YAAY;;AACZ,SAAAA,QAAA,EAAqBC,YAAY,QAAQ,gBAAgB;AACzD,OAAO,MAAMC,0BAA0B,GAAG;EACtCC,IAAI,EAAE;AACV,CAAC;AACD;AACA;AACA;AAAI,MAAMC,SAAS,gBAAGJ,QAAA;EAAAG,IAAA;IAAAE,OAAA;IAAAC,MAAA;EAAA;AAAA;EAAAC,CAAA;AAAA,CAKrB,CAAC;AACF;AACA;AACA;AAAI,OAAO,MAAMC,kCAAkC,GAAIC,KAAK,IAAG;EAC3D,MAAMC,MAAM,GAAGN,SAAS,CAAC,CAAC;EAC1B;EACAK,KAAK,CAACN,IAAI,CAACQ,SAAS,GAAGV,YAAY,CAACC,0BAA0B,CAACC,IAAI,EAAEO,MAAM,CAACP,IAAI,EAAEM,KAAK,CAACN,IAAI,CAACQ,SAAS,CAAC;EACvG,OAAOF,KAAK;AAChB,CAAC","ignoreList":[]}
@@ -14,7 +14,6 @@ export const carouselViewportClassNames = {
14
14
  /**
15
15
  * Apply styling to the CarouselViewport slots based on the state
16
16
  */ export const useCarouselViewportStyles_unstable = (state)=>{
17
- 'use no memo';
18
17
  const styles = useStyles();
19
18
  // eslint-disable-next-line react-hooks/immutability
20
19
  state.root.className = mergeClasses(carouselViewportClassNames.root, styles.root, state.root.className);
@@ -1 +1 @@
1
- {"version":3,"sources":["../src/components/CarouselViewport/useCarouselViewportStyles.styles.ts"],"sourcesContent":["'use client';\n\nimport { makeStyles, mergeClasses } from '@griffel/react';\nimport type { SlotClassNames } from '@fluentui/react-utilities';\nimport type { CarouselViewportSlots, CarouselViewportState } from './CarouselViewport.types';\n\nexport const carouselViewportClassNames: SlotClassNames<CarouselViewportSlots> = {\n root: 'fui-CarouselViewport',\n};\n\n/**\n * Styles for the root slot\n */\nconst useStyles = makeStyles({\n root: {\n maxWidth: '100%',\n width: 'auto',\n },\n});\n\n/**\n * Apply styling to the CarouselViewport slots based on the state\n */\nexport const useCarouselViewportStyles_unstable = (state: CarouselViewportState): CarouselViewportState => {\n 'use no memo';\n\n const styles = useStyles();\n // eslint-disable-next-line react-hooks/immutability\n state.root.className = mergeClasses(carouselViewportClassNames.root, styles.root, state.root.className);\n\n return state;\n};\n"],"names":["makeStyles","mergeClasses","carouselViewportClassNames","root","useStyles","maxWidth","width","useCarouselViewportStyles_unstable","state","styles","className"],"mappings":"AAAA;AAEA,SAASA,UAAU,EAAEC,YAAY,QAAQ,iBAAiB;AAI1D,OAAO,MAAMC,6BAAoE;IAC/EC,MAAM;AACR,EAAE;AAEF;;CAEC,GACD,MAAMC,YAAYJ,WAAW;IAC3BG,MAAM;QACJE,UAAU;QACVC,OAAO;IACT;AACF;AAEA;;CAEC,GACD,OAAO,MAAMC,qCAAqC,CAACC;IACjD;IAEA,MAAMC,SAASL;IACf,oDAAoD;IACpDI,MAAML,IAAI,CAACO,SAAS,GAAGT,aAAaC,2BAA2BC,IAAI,EAAEM,OAAON,IAAI,EAAEK,MAAML,IAAI,CAACO,SAAS;IAEtG,OAAOF;AACT,EAAE"}
1
+ {"version":3,"sources":["../src/components/CarouselViewport/useCarouselViewportStyles.styles.ts"],"sourcesContent":["'use client';\n\nimport { makeStyles, mergeClasses } from '@griffel/react';\nimport type { SlotClassNames } from '@fluentui/react-utilities';\nimport type { CarouselViewportSlots, CarouselViewportState } from './CarouselViewport.types';\n\nexport const carouselViewportClassNames: SlotClassNames<CarouselViewportSlots> = {\n root: 'fui-CarouselViewport',\n};\n\n/**\n * Styles for the root slot\n */\nconst useStyles = makeStyles({\n root: {\n maxWidth: '100%',\n width: 'auto',\n },\n});\n\n/**\n * Apply styling to the CarouselViewport slots based on the state\n */\nexport const useCarouselViewportStyles_unstable = (state: CarouselViewportState): CarouselViewportState => {\n const styles = useStyles();\n // eslint-disable-next-line react-hooks/immutability\n state.root.className = mergeClasses(carouselViewportClassNames.root, styles.root, state.root.className);\n\n return state;\n};\n"],"names":["makeStyles","mergeClasses","carouselViewportClassNames","root","useStyles","maxWidth","width","useCarouselViewportStyles_unstable","state","styles","className"],"mappings":"AAAA;AAEA,SAASA,UAAU,EAAEC,YAAY,QAAQ,iBAAiB;AAI1D,OAAO,MAAMC,6BAAoE;IAC/EC,MAAM;AACR,EAAE;AAEF;;CAEC,GACD,MAAMC,YAAYJ,WAAW;IAC3BG,MAAM;QACJE,UAAU;QACVC,OAAO;IACT;AACF;AAEA;;CAEC,GACD,OAAO,MAAMC,qCAAqC,CAACC;IACjD,MAAMC,SAASL;IACf,oDAAoD;IACpDI,MAAML,IAAI,CAACO,SAAS,GAAGT,aAAaC,2BAA2BC,IAAI,EAAEM,OAAON,IAAI,EAAEK,MAAML,IAAI,CAACO,SAAS;IAEtG,OAAOF;AACT,EAAE"}
@@ -15,7 +15,7 @@ const _reactutilities = require("@fluentui/react-utilities");
15
15
  const _react = /*#__PURE__*/ _interop_require_wildcard._(require("react"));
16
16
  const _useEmblaCarousel = require("../useEmblaCarousel");
17
17
  function useCarousel_unstable(props, ref) {
18
- 'use no memo';
18
+ 'use no memo'; // justified: compiler would optimize useCarousel_unstable — manual opt-out to preserve runtime behavior
19
19
  const { align = 'center', circular = false, onActiveIndexChange, groupSize = 'auto', draggable = false, whitespace = false, announcement, motion = 'slide', autoplayInterval = 4000, appearance = 'flat' } = props;
20
20
  const { dir } = (0, _reactsharedcontexts.useFluent_unstable)();
21
21
  const { activeIndex, carouselApi, containerRef, viewportRef, subscribeForValues, enableAutoplay, resetAutoplay } = (0, _useEmblaCarousel.useEmblaCarousel)({
@@ -1 +1 @@
1
- {"version":3,"sources":["../src/components/Carousel/useCarousel.ts"],"sourcesContent":["'use client';\n\nimport { useFluent_unstable as useFluent } from '@fluentui/react-shared-contexts';\nimport {\n getIntrinsicElementProps,\n slot,\n useEventCallback,\n useIsomorphicLayoutEffect,\n useMergedRefs,\n} from '@fluentui/react-utilities';\nimport * as React from 'react';\n\nimport type { CarouselProps, CarouselState } from './Carousel.types';\nimport type { CarouselContextValue } from '../CarouselContext.types';\nimport { useEmblaCarousel } from '../useEmblaCarousel';\nimport { useAnnounce } from '@fluentui/react-shared-contexts';\n\n/**\n * Create the state required to render Carousel.\n *\n * The returned state can be modified with hooks such as useCarouselStyles_unstable,\n * before being passed to renderCarousel_unstable.\n *\n * @param props - props from this instance of Carousel\n * @param ref - reference to root HTMLDivElement of Carousel\n */\nexport function useCarousel_unstable(props: CarouselProps, ref: React.Ref<HTMLDivElement>): CarouselState {\n 'use no memo';\n\n const {\n align = 'center',\n circular = false,\n onActiveIndexChange,\n groupSize = 'auto',\n draggable = false,\n whitespace = false,\n announcement,\n motion = 'slide',\n autoplayInterval = 4000,\n appearance = 'flat',\n } = props;\n\n const { dir } = useFluent();\n const { activeIndex, carouselApi, containerRef, viewportRef, subscribeForValues, enableAutoplay, resetAutoplay } =\n useEmblaCarousel({\n align,\n direction: dir,\n loop: circular,\n slidesToScroll: groupSize,\n defaultActiveIndex: props.defaultActiveIndex,\n activeIndex: props.activeIndex,\n watchDrag: draggable,\n containScroll: whitespace ? false : 'keepSnaps',\n motion,\n onDragIndexChange: onActiveIndexChange,\n onAutoplayIndexChange: onActiveIndexChange,\n autoplayInterval,\n });\n\n const selectPageByElement: CarouselContextValue['selectPageByElement'] = useEventCallback((event, element, jump) => {\n const foundIndex = carouselApi.scrollToElement(element, jump);\n onActiveIndexChange?.(event, { event, type: 'focus', index: foundIndex });\n\n return foundIndex;\n });\n\n const selectPageByIndex: CarouselContextValue['selectPageByIndex'] = useEventCallback((event, index, jump) => {\n carouselApi.scrollToIndex(index, jump);\n\n onActiveIndexChange?.(event, { event, type: 'click', index });\n });\n\n const selectPageByDirection: CarouselContextValue['selectPageByDirection'] = useEventCallback((event, direction) => {\n const nextPageIndex = carouselApi.scrollInDirection(direction);\n onActiveIndexChange?.(event, { event, type: 'click', index: nextPageIndex });\n\n return nextPageIndex;\n });\n\n const mergedContainerRef = useMergedRefs(ref, containerRef);\n\n // Announce carousel updates\n const announcementTextRef = React.useRef<string>('');\n const totalNavLength = React.useRef<number>(0);\n const navGroupRef = React.useRef<number[][]>([]);\n\n const { announce } = useAnnounce();\n\n const updateAnnouncement = useEventCallback(() => {\n if (totalNavLength.current <= 0 || !announcement) {\n // Ignore announcements until slides discovered\n return;\n }\n\n const announcementText = announcement(activeIndex, totalNavLength.current, navGroupRef.current);\n\n if (announcementText !== announcementTextRef.current) {\n announcementTextRef.current = announcementText;\n announce(announcementText, { polite: true });\n }\n });\n\n useIsomorphicLayoutEffect(() => {\n // Subscribe to any non-index carousel state changes\n return subscribeForValues(data => {\n if (totalNavLength.current <= 0 && data.navItemsCount > 0 && announcement) {\n const announcementText = announcement(data.activeIndex, data.navItemsCount, data.groupIndexList);\n // Initialize our string to prevent updateAnnouncement from reading an initial load\n announcementTextRef.current = announcementText;\n }\n totalNavLength.current = data.navItemsCount;\n navGroupRef.current = data.groupIndexList;\n updateAnnouncement();\n });\n }, [subscribeForValues, updateAnnouncement, announcement]);\n\n useIsomorphicLayoutEffect(() => {\n updateAnnouncement();\n }, [activeIndex, updateAnnouncement]);\n\n return {\n components: {\n root: 'div',\n },\n root: slot.always(\n getIntrinsicElementProps('div', {\n ref: mergedContainerRef,\n role: 'region',\n ...props,\n }),\n { elementType: 'div' },\n ),\n\n activeIndex,\n appearance,\n circular,\n containerRef: mergedContainerRef,\n viewportRef,\n selectPageByElement,\n selectPageByDirection,\n selectPageByIndex,\n subscribeForValues,\n enableAutoplay,\n resetAutoplay,\n };\n}\n"],"names":["useFluent_unstable","useFluent","getIntrinsicElementProps","slot","useEventCallback","useIsomorphicLayoutEffect","useMergedRefs","React","useEmblaCarousel","useAnnounce","useCarousel_unstable","props","ref","align","circular","onActiveIndexChange","groupSize","draggable","whitespace","announcement","motion","autoplayInterval","appearance","dir","activeIndex","carouselApi","containerRef","viewportRef","subscribeForValues","enableAutoplay","resetAutoplay","direction","loop","slidesToScroll","defaultActiveIndex","watchDrag","containScroll","onDragIndexChange","onAutoplayIndexChange","selectPageByElement","event","element","jump","foundIndex","scrollToElement","type","index","selectPageByIndex","scrollToIndex","selectPageByDirection","nextPageIndex","scrollInDirection","mergedContainerRef","announcementTextRef","useRef","totalNavLength","navGroupRef","announce","updateAnnouncement","current","announcementText","polite","data","navItemsCount","groupIndexList","components","root","always","role","elementType"],"mappings":"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"}
1
+ {"version":3,"sources":["../src/components/Carousel/useCarousel.ts"],"sourcesContent":["'use client';\n\nimport { useFluent_unstable as useFluent } from '@fluentui/react-shared-contexts';\nimport {\n getIntrinsicElementProps,\n slot,\n useEventCallback,\n useIsomorphicLayoutEffect,\n useMergedRefs,\n} from '@fluentui/react-utilities';\nimport * as React from 'react';\n\nimport type { CarouselProps, CarouselState } from './Carousel.types';\nimport type { CarouselContextValue } from '../CarouselContext.types';\nimport { useEmblaCarousel } from '../useEmblaCarousel';\nimport { useAnnounce } from '@fluentui/react-shared-contexts';\n\n/**\n * Create the state required to render Carousel.\n *\n * The returned state can be modified with hooks such as useCarouselStyles_unstable,\n * before being passed to renderCarousel_unstable.\n *\n * @param props - props from this instance of Carousel\n * @param ref - reference to root HTMLDivElement of Carousel\n */\nexport function useCarousel_unstable(props: CarouselProps, ref: React.Ref<HTMLDivElement>): CarouselState {\n 'use no memo'; // justified: compiler would optimize useCarousel_unstable — manual opt-out to preserve runtime behavior\n\n const {\n align = 'center',\n circular = false,\n onActiveIndexChange,\n groupSize = 'auto',\n draggable = false,\n whitespace = false,\n announcement,\n motion = 'slide',\n autoplayInterval = 4000,\n appearance = 'flat',\n } = props;\n\n const { dir } = useFluent();\n const { activeIndex, carouselApi, containerRef, viewportRef, subscribeForValues, enableAutoplay, resetAutoplay } =\n useEmblaCarousel({\n align,\n direction: dir,\n loop: circular,\n slidesToScroll: groupSize,\n defaultActiveIndex: props.defaultActiveIndex,\n activeIndex: props.activeIndex,\n watchDrag: draggable,\n containScroll: whitespace ? false : 'keepSnaps',\n motion,\n onDragIndexChange: onActiveIndexChange,\n onAutoplayIndexChange: onActiveIndexChange,\n autoplayInterval,\n });\n\n const selectPageByElement: CarouselContextValue['selectPageByElement'] = useEventCallback((event, element, jump) => {\n const foundIndex = carouselApi.scrollToElement(element, jump);\n onActiveIndexChange?.(event, { event, type: 'focus', index: foundIndex });\n\n return foundIndex;\n });\n\n const selectPageByIndex: CarouselContextValue['selectPageByIndex'] = useEventCallback((event, index, jump) => {\n carouselApi.scrollToIndex(index, jump);\n\n onActiveIndexChange?.(event, { event, type: 'click', index });\n });\n\n const selectPageByDirection: CarouselContextValue['selectPageByDirection'] = useEventCallback((event, direction) => {\n const nextPageIndex = carouselApi.scrollInDirection(direction);\n onActiveIndexChange?.(event, { event, type: 'click', index: nextPageIndex });\n\n return nextPageIndex;\n });\n\n const mergedContainerRef = useMergedRefs(ref, containerRef);\n\n // Announce carousel updates\n const announcementTextRef = React.useRef<string>('');\n const totalNavLength = React.useRef<number>(0);\n const navGroupRef = React.useRef<number[][]>([]);\n\n const { announce } = useAnnounce();\n\n const updateAnnouncement = useEventCallback(() => {\n if (totalNavLength.current <= 0 || !announcement) {\n // Ignore announcements until slides discovered\n return;\n }\n\n const announcementText = announcement(activeIndex, totalNavLength.current, navGroupRef.current);\n\n if (announcementText !== announcementTextRef.current) {\n announcementTextRef.current = announcementText;\n announce(announcementText, { polite: true });\n }\n });\n\n useIsomorphicLayoutEffect(() => {\n // Subscribe to any non-index carousel state changes\n return subscribeForValues(data => {\n if (totalNavLength.current <= 0 && data.navItemsCount > 0 && announcement) {\n const announcementText = announcement(data.activeIndex, data.navItemsCount, data.groupIndexList);\n // Initialize our string to prevent updateAnnouncement from reading an initial load\n announcementTextRef.current = announcementText;\n }\n totalNavLength.current = data.navItemsCount;\n navGroupRef.current = data.groupIndexList;\n updateAnnouncement();\n });\n }, [subscribeForValues, updateAnnouncement, announcement]);\n\n useIsomorphicLayoutEffect(() => {\n updateAnnouncement();\n }, [activeIndex, updateAnnouncement]);\n\n return {\n components: {\n root: 'div',\n },\n root: slot.always(\n getIntrinsicElementProps('div', {\n ref: mergedContainerRef,\n role: 'region',\n ...props,\n }),\n { elementType: 'div' },\n ),\n\n activeIndex,\n appearance,\n circular,\n containerRef: mergedContainerRef,\n viewportRef,\n selectPageByElement,\n selectPageByDirection,\n selectPageByIndex,\n subscribeForValues,\n enableAutoplay,\n resetAutoplay,\n };\n}\n"],"names":["useFluent_unstable","useFluent","getIntrinsicElementProps","slot","useEventCallback","useIsomorphicLayoutEffect","useMergedRefs","React","useEmblaCarousel","useAnnounce","useCarousel_unstable","props","ref","align","circular","onActiveIndexChange","groupSize","draggable","whitespace","announcement","motion","autoplayInterval","appearance","dir","activeIndex","carouselApi","containerRef","viewportRef","subscribeForValues","enableAutoplay","resetAutoplay","direction","loop","slidesToScroll","defaultActiveIndex","watchDrag","containScroll","onDragIndexChange","onAutoplayIndexChange","selectPageByElement","event","element","jump","foundIndex","scrollToElement","type","index","selectPageByIndex","scrollToIndex","selectPageByDirection","nextPageIndex","scrollInDirection","mergedContainerRef","announcementTextRef","useRef","totalNavLength","navGroupRef","announce","updateAnnouncement","current","announcementText","polite","data","navItemsCount","groupIndexList","components","root","always","role","elementType"],"mappings":"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"}
@@ -61,7 +61,6 @@ const carouselClassNames = {
61
61
  ]
62
62
  });
63
63
  const useCarouselStyles_unstable = (state)=>{
64
- 'use no memo';
65
64
  const styles = useStyles();
66
65
  const { appearance } = state;
67
66
  // eslint-disable-next-line react-hooks/immutability
@@ -1 +1 @@
1
- {"version":3,"sources":["useCarouselStyles.styles.js"],"sourcesContent":["'use client';\nimport { makeStyles, mergeClasses } from '@griffel/react';\nimport { tokens } from '@fluentui/react-theme';\nexport const carouselClassNames = {\n root: 'fui-Carousel'\n};\n/**\n * Styles for the root slot\n */ const useStyles = makeStyles({\n root: {\n // Only hide horizontal overflow to enable focus border to bleed bounds vertically\n overflowX: 'hidden',\n overflowAnchor: 'none',\n position: 'relative'\n },\n elevated: {\n // Reserve vertical space so the drop shadow has room to render\n // without being clipped by surrounding layout or overflow rules.\n margin: tokens.spacingVerticalL,\n padding: tokens.spacingVerticalL\n }\n});\n/**\n * Apply styling to the Carousel slots based on the state\n */ export const useCarouselStyles_unstable = (state)=>{\n 'use no memo';\n const styles = useStyles();\n const { appearance } = state;\n // eslint-disable-next-line react-hooks/immutability\n state.root.className = mergeClasses(carouselClassNames.root, styles.root, appearance === 'elevated' && styles.elevated, state.root.className);\n return state;\n};\n"],"names":["__styles","mergeClasses","tokens","carouselClassNames","root","useStyles","B68tc82","Eiaeu8","qhf8xq","elevated","jrapky","Frg6f3","t21cq0","B6of3ja","B74szlk","Byoj8tv","uwmqm3","z189sj","z8tnut","B0ocmuz","d","p","useCarouselStyles_unstable","state","styles","appearance","className"],"mappings":"AAAA,YAAY;;;;;;;;;;;;IAGCG,kBAAkB;;;8BAqBY;;;;uBAvBF,gBAAgB;AAElD,2BAA2B;IAC9BC,IAAI,EAAE;AACV,CAAC;AACD;;CAEA,GAAI,MAAMC,SAAS,GAAA,WAAA,OAAGL,eAAA,EAAA;IAAAI,IAAA,EAAA;QAAAE,OAAA,EAAA;QAAAC,MAAA,EAAA;QAAAC,MAAA,EAAA;IAAA;IAAAC,QAAA,EAAA;QAAAC,MAAA,EAAA;QAAAC,MAAA,EAAA;QAAAC,MAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,MAAA,EAAA;QAAAC,MAAA,EAAA;QAAAC,MAAA,EAAA;QAAAC,OAAA,EAAA;IAAA;AAAA,GAAA;IAAAC,CAAA,EAAA;QAAA;QAAA;QAAA;QAAA;YAAA;YAAA;gBAAAC,CAAA,EAAA,CAAA;YAAA;SAAA;QAAA;YAAA;YAAA;gBAAAA,CAAA,EAAA,CAAA;YAAA;SAAA;KAAA;AAAA,CAarB,CAAC;AAGS,MAAMC,8BAA8BC,KAAK,IAAG;IACnD,aAAa;IACb,MAAMC,MAAM,GAAGnB,SAAS,CAAC,CAAC;IAC1B,MAAM,EAAEoB,UAAAA,EAAY,GAAGF,KAAK;IAC5B,oDAAA;IACAA,KAAK,CAACnB,IAAI,CAACsB,SAAS,OAAGzB,mBAAY,EAACE,kBAAkB,CAACC,IAAI,EAAEoB,MAAM,CAACpB,IAAI,EAAEqB,UAAU,KAAK,UAAU,IAAID,MAAM,CAACf,QAAQ,EAAEc,KAAK,CAACnB,IAAI,CAACsB,SAAS,CAAC;IAC7I,OAAOH,KAAK;AAChB,CAAC"}
1
+ {"version":3,"sources":["useCarouselStyles.styles.js"],"sourcesContent":["'use client';\nimport { makeStyles, mergeClasses } from '@griffel/react';\nimport { tokens } from '@fluentui/react-theme';\nexport const carouselClassNames = {\n root: 'fui-Carousel'\n};\n/**\n * Styles for the root slot\n */ const useStyles = makeStyles({\n root: {\n // Only hide horizontal overflow to enable focus border to bleed bounds vertically\n overflowX: 'hidden',\n overflowAnchor: 'none',\n position: 'relative'\n },\n elevated: {\n // Reserve vertical space so the drop shadow has room to render\n // without being clipped by surrounding layout or overflow rules.\n margin: tokens.spacingVerticalL,\n padding: tokens.spacingVerticalL\n }\n});\n/**\n * Apply styling to the Carousel slots based on the state\n */ export const useCarouselStyles_unstable = (state)=>{\n const styles = useStyles();\n const { appearance } = state;\n // eslint-disable-next-line react-hooks/immutability\n state.root.className = mergeClasses(carouselClassNames.root, styles.root, appearance === 'elevated' && styles.elevated, state.root.className);\n return state;\n};\n"],"names":["__styles","mergeClasses","tokens","carouselClassNames","root","useStyles","B68tc82","Eiaeu8","qhf8xq","elevated","jrapky","Frg6f3","t21cq0","B6of3ja","B74szlk","Byoj8tv","uwmqm3","z189sj","z8tnut","B0ocmuz","d","p","useCarouselStyles_unstable","state","styles","appearance","className"],"mappings":"AAAA,YAAY;;;;;;;;;;;;IAGCG,kBAAkB;;;8BAqBY;;;;uBAvBF,gBAAgB;AAElD,2BAA2B;IAC9BC,IAAI,EAAE;AACV,CAAC;AACD;;CAEA,GAAI,MAAMC,SAAS,GAAA,WAAA,OAAGL,eAAA,EAAA;IAAAI,IAAA,EAAA;QAAAE,OAAA,EAAA;QAAAC,MAAA,EAAA;QAAAC,MAAA,EAAA;IAAA;IAAAC,QAAA,EAAA;QAAAC,MAAA,EAAA;QAAAC,MAAA,EAAA;QAAAC,MAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,MAAA,EAAA;QAAAC,MAAA,EAAA;QAAAC,MAAA,EAAA;QAAAC,OAAA,EAAA;IAAA;AAAA,GAAA;IAAAC,CAAA,EAAA;QAAA;QAAA;QAAA;QAAA;YAAA;YAAA;gBAAAC,CAAA,EAAA,CAAA;YAAA;SAAA;QAAA;YAAA;YAAA;gBAAAA,CAAA,EAAA,CAAA;YAAA;SAAA;KAAA;AAAA,CAarB,CAAC;AAGS,MAAMC,8BAA8BC,KAAK,IAAG;IACnD,MAAMC,MAAM,GAAGnB,SAAS,CAAC,CAAC;IAC1B,MAAM,EAAEoB,UAAAA,EAAY,GAAGF,KAAK;IAC5B,oDAAA;IACAA,KAAK,CAACnB,IAAI,CAACsB,SAAS,OAAGzB,mBAAY,EAACE,kBAAkB,CAACC,IAAI,EAAEoB,MAAM,CAACpB,IAAI,EAAEqB,UAAU,KAAK,UAAU,IAAID,MAAM,CAACf,QAAQ,EAAEc,KAAK,CAACnB,IAAI,CAACsB,SAAS,CAAC;IAC7I,OAAOH,KAAK;AAChB,CAAC"}
@@ -39,7 +39,6 @@ const carouselClassNames = {
39
39
  }
40
40
  });
41
41
  const useCarouselStyles_unstable = (state)=>{
42
- 'use no memo';
43
42
  const styles = useStyles();
44
43
  const { appearance } = state;
45
44
  // eslint-disable-next-line react-hooks/immutability
@@ -1 +1 @@
1
- {"version":3,"sources":["../src/components/Carousel/useCarouselStyles.styles.ts"],"sourcesContent":["'use client';\n\nimport { makeStyles, mergeClasses } from '@griffel/react';\nimport type { SlotClassNames } from '@fluentui/react-utilities';\nimport { tokens } from '@fluentui/react-theme';\n\nimport type { CarouselSlots, CarouselState } from './Carousel.types';\n\nexport const carouselClassNames: SlotClassNames<CarouselSlots> = {\n root: 'fui-Carousel',\n};\n\n/**\n * Styles for the root slot\n */\nconst useStyles = makeStyles({\n root: {\n // Only hide horizontal overflow to enable focus border to bleed bounds vertically\n overflowX: 'hidden',\n overflowAnchor: 'none',\n position: 'relative',\n },\n elevated: {\n // Reserve vertical space so the drop shadow has room to render\n // without being clipped by surrounding layout or overflow rules.\n margin: tokens.spacingVerticalL,\n padding: tokens.spacingVerticalL,\n },\n});\n\n/**\n * Apply styling to the Carousel slots based on the state\n */\nexport const useCarouselStyles_unstable = (state: CarouselState): CarouselState => {\n 'use no memo';\n\n const styles = useStyles();\n const { appearance } = state;\n\n // eslint-disable-next-line react-hooks/immutability\n state.root.className = mergeClasses(\n carouselClassNames.root,\n styles.root,\n appearance === 'elevated' && styles.elevated,\n state.root.className,\n );\n return state;\n};\n"],"names":["makeStyles","mergeClasses","tokens","carouselClassNames","root","useStyles","overflowX","overflowAnchor","position","elevated","margin","spacingVerticalL","padding","useCarouselStyles_unstable","state","styles","appearance","className"],"mappings":"AAAA;;;;;;;;;;;;IAQaG,kBAAAA;;;IAyBAU,0BAAAA;;;;uBA/B4B,iBAAiB;4BAEnC,wBAAwB;AAIxC,2BAA0D;IAC/DT,MAAM;AACR,EAAE;AAEF;;CAEC,GACD,MAAMC,gBAAYL,iBAAAA,EAAW;IAC3BI,MAAM;QACJ,kFAAkF;QAClFE,WAAW;QACXC,gBAAgB;QAChBC,UAAU;IACZ;IACAC,UAAU;QACR,+DAA+D;QAC/D,iEAAiE;QACjEC,QAAQR,kBAAAA,CAAOS,gBAAgB;QAC/BC,SAASV,kBAAAA,CAAOS,gBAAgB;IAClC;AACF;AAKO,mCAAmC,CAACG;IACzC;IAEA,MAAMC,SAASV;IACf,MAAM,EAAEW,UAAU,EAAE,GAAGF;IAEvB,oDAAoD;IACpDA,MAAMV,IAAI,CAACa,SAAS,OAAGhB,mBAAAA,EACrBE,mBAAmBC,IAAI,EACvBW,OAAOX,IAAI,EACXY,eAAe,cAAcD,OAAON,QAAQ,EAC5CK,MAAMV,IAAI,CAACa,SAAS;IAEtB,OAAOH;AACT,EAAE"}
1
+ {"version":3,"sources":["../src/components/Carousel/useCarouselStyles.styles.ts"],"sourcesContent":["'use client';\n\nimport { makeStyles, mergeClasses } from '@griffel/react';\nimport type { SlotClassNames } from '@fluentui/react-utilities';\nimport { tokens } from '@fluentui/react-theme';\n\nimport type { CarouselSlots, CarouselState } from './Carousel.types';\n\nexport const carouselClassNames: SlotClassNames<CarouselSlots> = {\n root: 'fui-Carousel',\n};\n\n/**\n * Styles for the root slot\n */\nconst useStyles = makeStyles({\n root: {\n // Only hide horizontal overflow to enable focus border to bleed bounds vertically\n overflowX: 'hidden',\n overflowAnchor: 'none',\n position: 'relative',\n },\n elevated: {\n // Reserve vertical space so the drop shadow has room to render\n // without being clipped by surrounding layout or overflow rules.\n margin: tokens.spacingVerticalL,\n padding: tokens.spacingVerticalL,\n },\n});\n\n/**\n * Apply styling to the Carousel slots based on the state\n */\nexport const useCarouselStyles_unstable = (state: CarouselState): CarouselState => {\n const styles = useStyles();\n const { appearance } = state;\n\n // eslint-disable-next-line react-hooks/immutability\n state.root.className = mergeClasses(\n carouselClassNames.root,\n styles.root,\n appearance === 'elevated' && styles.elevated,\n state.root.className,\n );\n return state;\n};\n"],"names":["makeStyles","mergeClasses","tokens","carouselClassNames","root","useStyles","overflowX","overflowAnchor","position","elevated","margin","spacingVerticalL","padding","useCarouselStyles_unstable","state","styles","appearance","className"],"mappings":"AAAA;;;;;;;;;;;;IAQaG,kBAAAA;;;IAyBAU,0BAAAA;;;;uBA/B4B,iBAAiB;4BAEnC,wBAAwB;AAIxC,2BAA0D;IAC/DT,MAAM;AACR,EAAE;AAEF;;CAEC,GACD,MAAMC,gBAAYL,iBAAAA,EAAW;IAC3BI,MAAM;QACJ,kFAAkF;QAClFE,WAAW;QACXC,gBAAgB;QAChBC,UAAU;IACZ;IACAC,UAAU;QACR,+DAA+D;QAC/D,iEAAiE;QACjEC,QAAQR,kBAAAA,CAAOS,gBAAgB;QAC/BC,SAASV,kBAAAA,CAAOS,gBAAgB;IAClC;AACF;AAKO,mCAAmC,CAACG;IACzC,MAAMC,SAASV;IACf,MAAM,EAAEW,UAAU,EAAE,GAAGF;IAEvB,oDAAoD;IACpDA,MAAMV,IAAI,CAACa,SAAS,OAAGhB,mBAAAA,EACrBE,mBAAmBC,IAAI,EACvBW,OAAOX,IAAI,EACXY,eAAe,cAAcD,OAAON,QAAQ,EAC5CK,MAAMV,IAAI,CAACa,SAAS;IAEtB,OAAOH;AACT,EAAE"}
@@ -61,7 +61,6 @@ const carouselAutoplayButtonClassNames = {
61
61
  ]
62
62
  });
63
63
  const useCarouselAutoplayButtonStyles_unstable = (state)=>{
64
- 'use no memo';
65
64
  const styles = useStyles();
66
65
  (0, _reactbutton.useToggleButtonStyles_unstable)(state);
67
66
  // eslint-disable-next-line react-hooks/immutability
@@ -1 +1 @@
1
- {"version":3,"sources":["useCarouselAutoplayButtonStyles.styles.js"],"sourcesContent":["'use client';\nimport { makeStyles, mergeClasses, shorthands } from '@griffel/react';\nimport { useToggleButtonStyles_unstable } from '@fluentui/react-button';\nimport { tokens } from '@fluentui/react-theme';\nexport const carouselAutoplayButtonClassNames = {\n root: 'fui-CarouselAutoplayButton',\n icon: 'fui-CarouselAutoplayButton__icon'\n};\n/**\n * Styles for the root slot\n */ const useStyles = makeStyles({\n root: {\n pointerEvents: 'all',\n marginTop: 'auto',\n marginBottom: 'auto',\n ...shorthands.borderColor(tokens.colorTransparentStroke),\n color: tokens.colorNeutralForeground2,\n backgroundColor: tokens.colorNeutralBackgroundAlpha,\n ':hover': {\n cursor: 'pointer'\n }\n }\n});\n/**\n * Apply styling to the CarouselAutoplayButton slots based on the state\n */ export const useCarouselAutoplayButtonStyles_unstable = (state)=>{\n 'use no memo';\n const styles = useStyles();\n useToggleButtonStyles_unstable(state);\n // eslint-disable-next-line react-hooks/immutability\n state.root.className = mergeClasses(carouselAutoplayButtonClassNames.root, styles.root, state.root.className);\n if (state.icon) {\n // eslint-disable-next-line react-hooks/immutability\n state.icon.className = mergeClasses(carouselAutoplayButtonClassNames.icon, state.icon.className);\n }\n return state;\n};\n"],"names":["__styles","mergeClasses","shorthands","useToggleButtonStyles_unstable","tokens","carouselAutoplayButtonClassNames","root","icon","useStyles","Bkecrkj","B6of3ja","jrapky","g2u3we","h3c5rm","B9xav0g","zhjwy3","sj55zd","De3pzq","eoavqd","d","h","useCarouselAutoplayButtonStyles_unstable","state","styles","className"],"mappings":"AAAA,YAAY;;;;;;;;;;;;IAICK,gCAAgC;;;IAqB5BgB,wCAAwC;;;;uBAxBJ,gBAAgB;6BACtB,wBAAwB;AAEhE,yCAAyC;IAC5Cf,IAAI,EAAE,4BAA4B;IAClCC,IAAI,EAAE;AACV,CAAC;AACD;;CAEA,GAAI,MAAMC,SAAS,GAAA,WAAA,GAAGR,mBAAA,EAAA;IAAAM,IAAA,EAAA;QAAAG,OAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,MAAA,EAAA;QAAAC,MAAA,EAAA;QAAAC,MAAA,EAAA;YAAA;YAAA;SAAA;QAAAC,OAAA,EAAA;QAAAC,MAAA,EAAA;YAAA;YAAA;SAAA;QAAAC,MAAA,EAAA;QAAAC,MAAA,EAAA;QAAAC,MAAA,EAAA;IAAA;AAAA,GAAA;IAAAC,CAAA,EAAA;QAAA;QAAA;QAAA;QAAA;QAAA;QAAA;QAAA;QAAA;QAAA;KAAA;IAAAC,CAAA,EAAA;QAAA;KAAA;AAAA,CAYrB,CAAC;AAGS,kDAAkDE,KAAK,IAAG;IACjE,aAAa;IACb,MAAMC,MAAM,GAAGf,SAAS,CAAC,CAAC;QAC1BL,2CAA8B,EAACmB,KAAK,CAAC;IACrC,oDAAA;IACAA,KAAK,CAAChB,IAAI,CAACkB,SAAS,OAAGvB,mBAAY,EAACI,gCAAgC,CAACC,IAAI,EAAEiB,MAAM,CAACjB,IAAI,EAAEgB,KAAK,CAAChB,IAAI,CAACkB,SAAS,CAAC;IAC7G,IAAIF,KAAK,CAACf,IAAI,EAAE;QACZ,oDAAA;QACAe,KAAK,CAACf,IAAI,CAACiB,SAAS,OAAGvB,mBAAY,EAACI,gCAAgC,CAACE,IAAI,EAAEe,KAAK,CAACf,IAAI,CAACiB,SAAS,CAAC;IACpG;IACA,OAAOF,KAAK;AAChB,CAAC"}
1
+ {"version":3,"sources":["useCarouselAutoplayButtonStyles.styles.js"],"sourcesContent":["'use client';\nimport { makeStyles, mergeClasses, shorthands } from '@griffel/react';\nimport { useToggleButtonStyles_unstable } from '@fluentui/react-button';\nimport { tokens } from '@fluentui/react-theme';\nexport const carouselAutoplayButtonClassNames = {\n root: 'fui-CarouselAutoplayButton',\n icon: 'fui-CarouselAutoplayButton__icon'\n};\n/**\n * Styles for the root slot\n */ const useStyles = makeStyles({\n root: {\n pointerEvents: 'all',\n marginTop: 'auto',\n marginBottom: 'auto',\n ...shorthands.borderColor(tokens.colorTransparentStroke),\n color: tokens.colorNeutralForeground2,\n backgroundColor: tokens.colorNeutralBackgroundAlpha,\n ':hover': {\n cursor: 'pointer'\n }\n }\n});\n/**\n * Apply styling to the CarouselAutoplayButton slots based on the state\n */ export const useCarouselAutoplayButtonStyles_unstable = (state)=>{\n const styles = useStyles();\n useToggleButtonStyles_unstable(state);\n // eslint-disable-next-line react-hooks/immutability\n state.root.className = mergeClasses(carouselAutoplayButtonClassNames.root, styles.root, state.root.className);\n if (state.icon) {\n // eslint-disable-next-line react-hooks/immutability\n state.icon.className = mergeClasses(carouselAutoplayButtonClassNames.icon, state.icon.className);\n }\n return state;\n};\n"],"names":["__styles","mergeClasses","shorthands","useToggleButtonStyles_unstable","tokens","carouselAutoplayButtonClassNames","root","icon","useStyles","Bkecrkj","B6of3ja","jrapky","g2u3we","h3c5rm","B9xav0g","zhjwy3","sj55zd","De3pzq","eoavqd","d","h","useCarouselAutoplayButtonStyles_unstable","state","styles","className"],"mappings":"AAAA,YAAY;;;;;;;;;;;;IAICK,gCAAgC;;;IAqB5BgB,wCAAwC;;;;uBAxBJ,gBAAgB;6BACtB,wBAAwB;AAEhE,yCAAyC;IAC5Cf,IAAI,EAAE,4BAA4B;IAClCC,IAAI,EAAE;AACV,CAAC;AACD;;CAEA,GAAI,MAAMC,SAAS,GAAA,WAAA,GAAGR,mBAAA,EAAA;IAAAM,IAAA,EAAA;QAAAG,OAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,MAAA,EAAA;QAAAC,MAAA,EAAA;QAAAC,MAAA,EAAA;YAAA;YAAA;SAAA;QAAAC,OAAA,EAAA;QAAAC,MAAA,EAAA;YAAA;YAAA;SAAA;QAAAC,MAAA,EAAA;QAAAC,MAAA,EAAA;QAAAC,MAAA,EAAA;IAAA;AAAA,GAAA;IAAAC,CAAA,EAAA;QAAA;QAAA;QAAA;QAAA;QAAA;QAAA;QAAA;QAAA;QAAA;KAAA;IAAAC,CAAA,EAAA;QAAA;KAAA;AAAA,CAYrB,CAAC;AAGS,kDAAkDE,KAAK,IAAG;IACjE,MAAMC,MAAM,GAAGf,SAAS,CAAC,CAAC;QAC1BL,2CAA8B,EAACmB,KAAK,CAAC;IACrC,oDAAA;IACAA,KAAK,CAAChB,IAAI,CAACkB,SAAS,OAAGvB,mBAAY,EAACI,gCAAgC,CAACC,IAAI,EAAEiB,MAAM,CAACjB,IAAI,EAAEgB,KAAK,CAAChB,IAAI,CAACkB,SAAS,CAAC;IAC7G,IAAIF,KAAK,CAACf,IAAI,EAAE;QACZ,oDAAA;QACAe,KAAK,CAACf,IAAI,CAACiB,SAAS,OAAGvB,mBAAY,EAACI,gCAAgC,CAACE,IAAI,EAAEe,KAAK,CAACf,IAAI,CAACiB,SAAS,CAAC;IACpG;IACA,OAAOF,KAAK;AAChB,CAAC"}
@@ -40,7 +40,6 @@ const carouselAutoplayButtonClassNames = {
40
40
  }
41
41
  });
42
42
  const useCarouselAutoplayButtonStyles_unstable = (state)=>{
43
- 'use no memo';
44
43
  const styles = useStyles();
45
44
  (0, _reactbutton.useToggleButtonStyles_unstable)(state);
46
45
  // eslint-disable-next-line react-hooks/immutability
@@ -1 +1 @@
1
- {"version":3,"sources":["../src/components/CarouselAutoplayButton/useCarouselAutoplayButtonStyles.styles.ts"],"sourcesContent":["'use client';\n\nimport { makeStyles, mergeClasses, shorthands } from '@griffel/react';\nimport type { SlotClassNames } from '@fluentui/react-utilities';\nimport type { CarouselAutoplayButtonSlots, CarouselAutoplayButtonState } from './CarouselAutoplayButton.types';\nimport { useToggleButtonStyles_unstable } from '@fluentui/react-button';\nimport { tokens } from '@fluentui/react-theme';\n\nexport const carouselAutoplayButtonClassNames: SlotClassNames<CarouselAutoplayButtonSlots> = {\n root: 'fui-CarouselAutoplayButton',\n icon: 'fui-CarouselAutoplayButton__icon',\n};\n\n/**\n * Styles for the root slot\n */\nconst useStyles = makeStyles({\n root: {\n pointerEvents: 'all',\n marginTop: 'auto',\n marginBottom: 'auto',\n ...shorthands.borderColor(tokens.colorTransparentStroke),\n color: tokens.colorNeutralForeground2,\n backgroundColor: tokens.colorNeutralBackgroundAlpha,\n ':hover': {\n cursor: 'pointer',\n },\n },\n\n // TODO add additional classes for different states and/or slots\n});\n\n/**\n * Apply styling to the CarouselAutoplayButton slots based on the state\n */\nexport const useCarouselAutoplayButtonStyles_unstable = (\n state: CarouselAutoplayButtonState,\n): CarouselAutoplayButtonState => {\n 'use no memo';\n\n const styles = useStyles();\n\n useToggleButtonStyles_unstable(state);\n\n // eslint-disable-next-line react-hooks/immutability\n state.root.className = mergeClasses(carouselAutoplayButtonClassNames.root, styles.root, state.root.className);\n\n if (state.icon) {\n // eslint-disable-next-line react-hooks/immutability\n state.icon.className = mergeClasses(carouselAutoplayButtonClassNames.icon, state.icon.className);\n }\n\n return state;\n};\n"],"names":["makeStyles","mergeClasses","shorthands","useToggleButtonStyles_unstable","tokens","carouselAutoplayButtonClassNames","root","icon","useStyles","pointerEvents","marginTop","marginBottom","borderColor","colorTransparentStroke","color","colorNeutralForeground2","backgroundColor","colorNeutralBackgroundAlpha","cursor","useCarouselAutoplayButtonStyles_unstable","state","styles","className"],"mappings":"AAAA;;;;;;;;;;;;IAQaK,gCAAAA;;;4CA2BAc;;;;uBAjCwC,iBAAiB;6BAGvB,yBAAyB;4BACjD,wBAAwB;AAExC,yCAAsF;IAC3Fb,MAAM;IACNC,MAAM;AACR,EAAE;AAEF;;CAEC,GACD,MAAMC,gBAAYR,iBAAAA,EAAW;IAC3BM,MAAM;QACJG,eAAe;QACfC,WAAW;QACXC,cAAc;QACd,GAAGT,iBAAAA,CAAWU,WAAW,CAACR,kBAAAA,CAAOS,sBAAsB,CAAC;QACxDC,OAAOV,kBAAAA,CAAOW,uBAAuB;QACrCC,iBAAiBZ,kBAAAA,CAAOa,2BAA2B;QACnD,UAAU;YACRC,QAAQ;QACV;IACF;AAGF;AAKO,MAAMC,2CAA2C,CACtDC;IAEA;IAEA,MAAMC,SAASb;QAEfL,2CAAAA,EAA+BiB;IAE/B,oDAAoD;IACpDA,MAAMd,IAAI,CAACgB,SAAS,OAAGrB,mBAAAA,EAAaI,iCAAiCC,IAAI,EAAEe,OAAOf,IAAI,EAAEc,MAAMd,IAAI,CAACgB,SAAS;IAE5G,IAAIF,MAAMb,IAAI,EAAE;QACd,oDAAoD;QACpDa,MAAMb,IAAI,CAACe,SAAS,OAAGrB,mBAAAA,EAAaI,iCAAiCE,IAAI,EAAEa,MAAMb,IAAI,CAACe,SAAS;IACjG;IAEA,OAAOF;AACT,EAAE"}
1
+ {"version":3,"sources":["../src/components/CarouselAutoplayButton/useCarouselAutoplayButtonStyles.styles.ts"],"sourcesContent":["'use client';\n\nimport { makeStyles, mergeClasses, shorthands } from '@griffel/react';\nimport type { SlotClassNames } from '@fluentui/react-utilities';\nimport type { CarouselAutoplayButtonSlots, CarouselAutoplayButtonState } from './CarouselAutoplayButton.types';\nimport { useToggleButtonStyles_unstable } from '@fluentui/react-button';\nimport { tokens } from '@fluentui/react-theme';\n\nexport const carouselAutoplayButtonClassNames: SlotClassNames<CarouselAutoplayButtonSlots> = {\n root: 'fui-CarouselAutoplayButton',\n icon: 'fui-CarouselAutoplayButton__icon',\n};\n\n/**\n * Styles for the root slot\n */\nconst useStyles = makeStyles({\n root: {\n pointerEvents: 'all',\n marginTop: 'auto',\n marginBottom: 'auto',\n ...shorthands.borderColor(tokens.colorTransparentStroke),\n color: tokens.colorNeutralForeground2,\n backgroundColor: tokens.colorNeutralBackgroundAlpha,\n ':hover': {\n cursor: 'pointer',\n },\n },\n\n // TODO add additional classes for different states and/or slots\n});\n\n/**\n * Apply styling to the CarouselAutoplayButton slots based on the state\n */\nexport const useCarouselAutoplayButtonStyles_unstable = (\n state: CarouselAutoplayButtonState,\n): CarouselAutoplayButtonState => {\n const styles = useStyles();\n\n useToggleButtonStyles_unstable(state);\n\n // eslint-disable-next-line react-hooks/immutability\n state.root.className = mergeClasses(carouselAutoplayButtonClassNames.root, styles.root, state.root.className);\n\n if (state.icon) {\n // eslint-disable-next-line react-hooks/immutability\n state.icon.className = mergeClasses(carouselAutoplayButtonClassNames.icon, state.icon.className);\n }\n\n return state;\n};\n"],"names":["makeStyles","mergeClasses","shorthands","useToggleButtonStyles_unstable","tokens","carouselAutoplayButtonClassNames","root","icon","useStyles","pointerEvents","marginTop","marginBottom","borderColor","colorTransparentStroke","color","colorNeutralForeground2","backgroundColor","colorNeutralBackgroundAlpha","cursor","useCarouselAutoplayButtonStyles_unstable","state","styles","className"],"mappings":"AAAA;;;;;;;;;;;;IAQaK,gCAAAA;;;4CA2BAc;;;;uBAjCwC,iBAAiB;6BAGvB,yBAAyB;4BACjD,wBAAwB;AAExC,yCAAsF;IAC3Fb,MAAM;IACNC,MAAM;AACR,EAAE;AAEF;;CAEC,GACD,MAAMC,gBAAYR,iBAAAA,EAAW;IAC3BM,MAAM;QACJG,eAAe;QACfC,WAAW;QACXC,cAAc;QACd,GAAGT,iBAAAA,CAAWU,WAAW,CAACR,kBAAAA,CAAOS,sBAAsB,CAAC;QACxDC,OAAOV,kBAAAA,CAAOW,uBAAuB;QACrCC,iBAAiBZ,kBAAAA,CAAOa,2BAA2B;QACnD,UAAU;YACRC,QAAQ;QACV;IACF;AAGF;AAKO,MAAMC,2CAA2C,CACtDC;IAEA,MAAMC,SAASb;QAEfL,2CAAAA,EAA+BiB;IAE/B,oDAAoD;IACpDA,MAAMd,IAAI,CAACgB,SAAS,OAAGrB,mBAAAA,EAAaI,iCAAiCC,IAAI,EAAEe,OAAOf,IAAI,EAAEc,MAAMd,IAAI,CAACgB,SAAS;IAE5G,IAAIF,MAAMb,IAAI,EAAE;QACd,oDAAoD;QACpDa,MAAMb,IAAI,CAACe,SAAS,OAAGrB,mBAAAA,EAAaI,iCAAiCE,IAAI,EAAEa,MAAMb,IAAI,CAACe,SAAS;IACjG;IAEA,OAAOF;AACT,EAAE"}
@@ -48,6 +48,7 @@ const carouselButtonClassNames = {
48
48
  });
49
49
  const useCarouselButtonStyles_unstable = (state)=>{
50
50
  'use no memo';
51
+ // justified: compiler would optimize useCarouselButtonStyles_unstable — manual opt-out to preserve runtime behavior
51
52
  const styles = useStyles();
52
53
  state = {
53
54
  ...state,
@@ -1 +1 @@
1
- {"version":3,"sources":["useCarouselButtonStyles.styles.js"],"sourcesContent":["'use client';\nimport { makeStyles, mergeClasses } from '@griffel/react';\nimport { useButtonStyles_unstable } from '@fluentui/react-button';\nimport { tokens } from '@fluentui/react-theme';\nexport const carouselButtonClassNames = {\n root: 'fui-CarouselButton',\n icon: 'fui-CarouselButton__icon'\n};\n/**\n * Styles for the root slot\n */ const useStyles = makeStyles({\n root: {\n marginTop: 'auto',\n marginBottom: 'auto',\n color: tokens.colorNeutralForeground2,\n backgroundColor: tokens.colorNeutralBackgroundAlpha,\n pointerEvents: 'all',\n ':hover': {\n cursor: 'pointer'\n }\n }\n});\n/**\n * Apply styling to the CarouselButton slots based on the state\n */ export const useCarouselButtonStyles_unstable = (state)=>{\n 'use no memo';\n const styles = useStyles();\n state = {\n ...state,\n ...useButtonStyles_unstable(state)\n };\n state.root.className = mergeClasses(carouselButtonClassNames.root, styles.root, state.root.className);\n if (state.icon) {\n state.icon.className = mergeClasses(carouselButtonClassNames.icon, state.icon.className);\n }\n return state;\n};\n"],"names":["__styles","mergeClasses","useButtonStyles_unstable","tokens","carouselButtonClassNames","root","icon","useStyles","B6of3ja","jrapky","sj55zd","De3pzq","Bkecrkj","eoavqd","d","h","useCarouselButtonStyles_unstable","state","styles","className"],"mappings":"AAAA,YAAY;;;;;;;;;;;;IAICI,wBAAwB;;;oCAoBY;;;;uBAvBR,gBAAgB;6BAChB,wBAAwB;AAE1D,iCAAiC;IACpCC,IAAI,EAAE,oBAAoB;IAC1BC,IAAI,EAAE;AACV,CAAC;AACD;;CAEA,GAAI,MAAMC,SAAS,GAAA,WAAA,GAAGP,mBAAA,EAAA;IAAAK,IAAA,EAAA;QAAAG,OAAA,EAAA;QAAAC,MAAA,EAAA;QAAAC,MAAA,EAAA;QAAAC,MAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,MAAA,EAAA;IAAA;AAAA,GAAA;IAAAC,CAAA,EAAA;QAAA;QAAA;QAAA;QAAA;QAAA;KAAA;IAAAC,CAAA,EAAA;QAAA;KAAA;AAAA,CAWrB,CAAC;AAGS,MAAMC,oCAAoCC,KAAK,IAAG;IACzD,aAAa;IACb,MAAMC,MAAM,GAAGX,SAAS,CAAC,CAAC;IAC1BU,KAAK,GAAG;QACJ,GAAGA,KAAK;QACR,OAAGf,qCAAwB,EAACe,KAAK,CAAA;IACrC,CAAC;IACDA,KAAK,CAACZ,IAAI,CAACc,SAAS,OAAGlB,mBAAY,EAACG,wBAAwB,CAACC,IAAI,EAAEa,MAAM,CAACb,IAAI,EAAEY,KAAK,CAACZ,IAAI,CAACc,SAAS,CAAC;IACrG,IAAIF,KAAK,CAACX,IAAI,EAAE;QACZW,KAAK,CAACX,IAAI,CAACa,SAAS,OAAGlB,mBAAY,EAACG,wBAAwB,CAACE,IAAI,EAAEW,KAAK,CAACX,IAAI,CAACa,SAAS,CAAC;IAC5F;IACA,OAAOF,KAAK;AAChB,CAAC"}
1
+ {"version":3,"sources":["useCarouselButtonStyles.styles.js"],"sourcesContent":["'use client';\nimport { makeStyles, mergeClasses } from '@griffel/react';\nimport { useButtonStyles_unstable } from '@fluentui/react-button';\nimport { tokens } from '@fluentui/react-theme';\nexport const carouselButtonClassNames = {\n root: 'fui-CarouselButton',\n icon: 'fui-CarouselButton__icon'\n};\n/**\n * Styles for the root slot\n */ const useStyles = makeStyles({\n root: {\n marginTop: 'auto',\n marginBottom: 'auto',\n color: tokens.colorNeutralForeground2,\n backgroundColor: tokens.colorNeutralBackgroundAlpha,\n pointerEvents: 'all',\n ':hover': {\n cursor: 'pointer'\n }\n }\n});\n/**\n * Apply styling to the CarouselButton slots based on the state\n */ export const useCarouselButtonStyles_unstable = (state)=>{\n 'use no memo'; // justified: compiler would optimize useCarouselButtonStyles_unstable — manual opt-out to preserve runtime behavior\n const styles = useStyles();\n state = {\n ...state,\n ...useButtonStyles_unstable(state)\n };\n state.root.className = mergeClasses(carouselButtonClassNames.root, styles.root, state.root.className);\n if (state.icon) {\n state.icon.className = mergeClasses(carouselButtonClassNames.icon, state.icon.className);\n }\n return state;\n};\n"],"names":["__styles","mergeClasses","useButtonStyles_unstable","tokens","carouselButtonClassNames","root","icon","useStyles","B6of3ja","jrapky","sj55zd","De3pzq","Bkecrkj","eoavqd","d","h","useCarouselButtonStyles_unstable","state","styles","className"],"mappings":"AAAA,YAAY;;;;;;;;;;;;IAICI,wBAAwB;;;oCAoBY;;;;uBAvBR,gBAAgB;6BAChB,wBAAwB;AAE1D,iCAAiC;IACpCC,IAAI,EAAE,oBAAoB;IAC1BC,IAAI,EAAE;AACV,CAAC;AACD;;CAEA,GAAI,MAAMC,SAAS,GAAA,WAAA,GAAGP,mBAAA,EAAA;IAAAK,IAAA,EAAA;QAAAG,OAAA,EAAA;QAAAC,MAAA,EAAA;QAAAC,MAAA,EAAA;QAAAC,MAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,MAAA,EAAA;IAAA;AAAA,GAAA;IAAAC,CAAA,EAAA;QAAA;QAAA;QAAA;QAAA;QAAA;KAAA;IAAAC,CAAA,EAAA;QAAA;KAAA;AAAA,CAWrB,CAAC;AAGS,MAAMC,oCAAoCC,KAAK,IAAG;IACzD,aAAa;IAAE,oHAAA;IACf,MAAMC,MAAM,GAAGX,SAAS,CAAC,CAAC;IAC1BU,KAAK,GAAG;QACJ,GAAGA,KAAK;QACR,OAAGf,qCAAwB,EAACe,KAAK,CAAA;IACrC,CAAC;IACDA,KAAK,CAACZ,IAAI,CAACc,SAAS,OAAGlB,mBAAY,EAACG,wBAAwB,CAACC,IAAI,EAAEa,MAAM,CAACb,IAAI,EAAEY,KAAK,CAACZ,IAAI,CAACc,SAAS,CAAC;IACrG,IAAIF,KAAK,CAACX,IAAI,EAAE;QACZW,KAAK,CAACX,IAAI,CAACa,SAAS,OAAGlB,mBAAY,EAACG,wBAAwB,CAACE,IAAI,EAAEW,KAAK,CAACX,IAAI,CAACa,SAAS,CAAC;IAC5F;IACA,OAAOF,KAAK;AAChB,CAAC"}
@@ -39,7 +39,7 @@ const carouselButtonClassNames = {
39
39
  }
40
40
  });
41
41
  const useCarouselButtonStyles_unstable = (state)=>{
42
- 'use no memo';
42
+ 'use no memo'; // justified: compiler would optimize useCarouselButtonStyles_unstable — manual opt-out to preserve runtime behavior
43
43
  const styles = useStyles();
44
44
  state = {
45
45
  ...state,
@@ -1 +1 @@
1
- {"version":3,"sources":["../src/components/CarouselButton/useCarouselButtonStyles.styles.ts"],"sourcesContent":["'use client';\n\nimport { makeStyles, mergeClasses } from '@griffel/react';\nimport type { SlotClassNames } from '@fluentui/react-utilities';\nimport type { CarouselButtonSlots, CarouselButtonState } from './CarouselButton.types';\nimport { useButtonStyles_unstable } from '@fluentui/react-button';\nimport { tokens } from '@fluentui/react-theme';\n\nexport const carouselButtonClassNames: SlotClassNames<CarouselButtonSlots> = {\n root: 'fui-CarouselButton',\n icon: 'fui-CarouselButton__icon',\n};\n\n/**\n * Styles for the root slot\n */\nconst useStyles = makeStyles({\n root: {\n marginTop: 'auto',\n marginBottom: 'auto',\n color: tokens.colorNeutralForeground2,\n backgroundColor: tokens.colorNeutralBackgroundAlpha,\n pointerEvents: 'all',\n ':hover': {\n cursor: 'pointer',\n },\n },\n});\n\n/**\n * Apply styling to the CarouselButton slots based on the state\n */\nexport const useCarouselButtonStyles_unstable = (state: CarouselButtonState): CarouselButtonState => {\n 'use no memo';\n\n const styles = useStyles();\n\n state = {\n ...state,\n ...useButtonStyles_unstable(state),\n };\n\n state.root.className = mergeClasses(carouselButtonClassNames.root, styles.root, state.root.className);\n\n if (state.icon) {\n state.icon.className = mergeClasses(carouselButtonClassNames.icon, state.icon.className);\n }\n\n return state;\n};\n"],"names":["makeStyles","mergeClasses","useButtonStyles_unstable","tokens","carouselButtonClassNames","root","icon","useStyles","marginTop","marginBottom","color","colorNeutralForeground2","backgroundColor","colorNeutralBackgroundAlpha","pointerEvents","cursor","useCarouselButtonStyles_unstable","state","styles","className"],"mappings":"AAAA;;;;;;;;;;;;IAQaI,wBAAAA;;;oCAwBAY;eAAAA;;;uBA9B4B,iBAAiB;6BAGjB,yBAAyB;4BAC3C,wBAAwB;AAExC,iCAAsE;IAC3EX,MAAM;IACNC,MAAM;AACR,EAAE;AAEF;;CAEC,GACD,MAAMC,gBAAYP,iBAAAA,EAAW;IAC3BK,MAAM;QACJG,WAAW;QACXC,cAAc;QACdC,OAAOP,kBAAAA,CAAOQ,uBAAuB;QACrCC,iBAAiBT,kBAAAA,CAAOU,2BAA2B;QACnDC,eAAe;QACf,UAAU;YACRC,QAAQ;QACV;IACF;AACF;AAKO,yCAAyC,CAACE;IAC/C;IAEA,MAAMC,SAASX;IAEfU,QAAQ;QACN,GAAGA,KAAK;QACR,OAAGf,qCAAAA,EAAyBe,MAAM;IACpC;IAEAA,MAAMZ,IAAI,CAACc,SAAS,OAAGlB,mBAAAA,EAAaG,yBAAyBC,IAAI,EAAEa,OAAOb,IAAI,EAAEY,MAAMZ,IAAI,CAACc,SAAS;IAEpG,IAAIF,MAAMX,IAAI,EAAE;QACdW,MAAMX,IAAI,CAACa,SAAS,OAAGlB,mBAAAA,EAAaG,yBAAyBE,IAAI,EAAEW,MAAMX,IAAI,CAACa,SAAS;IACzF;IAEA,OAAOF;AACT,EAAE"}
1
+ {"version":3,"sources":["../src/components/CarouselButton/useCarouselButtonStyles.styles.ts"],"sourcesContent":["'use client';\n\nimport { makeStyles, mergeClasses } from '@griffel/react';\nimport type { SlotClassNames } from '@fluentui/react-utilities';\nimport type { CarouselButtonSlots, CarouselButtonState } from './CarouselButton.types';\nimport { useButtonStyles_unstable } from '@fluentui/react-button';\nimport { tokens } from '@fluentui/react-theme';\n\nexport const carouselButtonClassNames: SlotClassNames<CarouselButtonSlots> = {\n root: 'fui-CarouselButton',\n icon: 'fui-CarouselButton__icon',\n};\n\n/**\n * Styles for the root slot\n */\nconst useStyles = makeStyles({\n root: {\n marginTop: 'auto',\n marginBottom: 'auto',\n color: tokens.colorNeutralForeground2,\n backgroundColor: tokens.colorNeutralBackgroundAlpha,\n pointerEvents: 'all',\n ':hover': {\n cursor: 'pointer',\n },\n },\n});\n\n/**\n * Apply styling to the CarouselButton slots based on the state\n */\nexport const useCarouselButtonStyles_unstable = (state: CarouselButtonState): CarouselButtonState => {\n 'use no memo'; // justified: compiler would optimize useCarouselButtonStyles_unstable — manual opt-out to preserve runtime behavior\n\n const styles = useStyles();\n\n state = {\n ...state,\n ...useButtonStyles_unstable(state),\n };\n\n state.root.className = mergeClasses(carouselButtonClassNames.root, styles.root, state.root.className);\n\n if (state.icon) {\n state.icon.className = mergeClasses(carouselButtonClassNames.icon, state.icon.className);\n }\n\n return state;\n};\n"],"names":["makeStyles","mergeClasses","useButtonStyles_unstable","tokens","carouselButtonClassNames","root","icon","useStyles","marginTop","marginBottom","color","colorNeutralForeground2","backgroundColor","colorNeutralBackgroundAlpha","pointerEvents","cursor","useCarouselButtonStyles_unstable","state","styles","className"],"mappings":"AAAA;;;;;;;;;;;;IAQaI,wBAAAA;;;oCAwBAY;eAAAA;;;uBA9B4B,iBAAiB;6BAGjB,yBAAyB;4BAC3C,wBAAwB;AAExC,iCAAsE;IAC3EX,MAAM;IACNC,MAAM;AACR,EAAE;AAEF;;CAEC,GACD,MAAMC,gBAAYP,iBAAAA,EAAW;IAC3BK,MAAM;QACJG,WAAW;QACXC,cAAc;QACdC,OAAOP,kBAAAA,CAAOQ,uBAAuB;QACrCC,iBAAiBT,kBAAAA,CAAOU,2BAA2B;QACnDC,eAAe;QACf,UAAU;YACRC,QAAQ;QACV;IACF;AACF;AAKO,yCAAyC,CAACE;IAC/C,eAAe,oHAAoH;IAEnI,MAAMC,SAASX;IAEfU,QAAQ;QACN,GAAGA,KAAK;QACR,OAAGf,qCAAAA,EAAyBe,MAAM;IACpC;IAEAA,MAAMZ,IAAI,CAACc,SAAS,OAAGlB,mBAAAA,EAAaG,yBAAyBC,IAAI,EAAEa,OAAOb,IAAI,EAAEY,MAAMZ,IAAI,CAACc,SAAS;IAEpG,IAAIF,MAAMX,IAAI,EAAE;QACdW,MAAMX,IAAI,CAACa,SAAS,OAAGlB,mBAAAA,EAAaG,yBAAyBE,IAAI,EAAEW,MAAMX,IAAI,CAACa,SAAS;IACzF;IAEA,OAAOF;AACT,EAAE"}
@@ -85,7 +85,6 @@ const carouselCardClassNames = {
85
85
  ]
86
86
  });
87
87
  const useCarouselCardStyles_unstable = (state)=>{
88
- 'use no memo';
89
88
  const { autoSize } = state;
90
89
  const appearance = (0, _CarouselContext.useCarouselContext_unstable)((context)=>context.appearance);
91
90
  const styles = useStyles();
@@ -1 +1 @@
1
- {"version":3,"sources":["useCarouselCardStyles.styles.js"],"sourcesContent":["'use client';\nimport { makeStyles, mergeClasses } from '@griffel/react';\nimport { tokens } from '@fluentui/react-theme';\nimport { useCarouselContext_unstable as useCarouselContext } from '../CarouselContext';\nexport const carouselCardClassNames = {\n root: 'fui-CarouselCard'\n};\n/**\n * Styles for the root slot\n */ const useStyles = makeStyles({\n root: {\n flex: '0 0 100%',\n maxWidth: '100%'\n },\n autoSize: {\n flex: '0 0 auto' /* Adapt slide size to its content */ ,\n minWidth: 0,\n width: 'auto',\n maxWidth: '100%'\n },\n elevated: {\n borderRadius: tokens.borderRadiusXLarge,\n boxShadow: tokens.shadow16,\n overflow: 'hidden'\n }\n});\n/**\n * Apply styling to the CarouselCard slots based on the state\n */ export const useCarouselCardStyles_unstable = (state)=>{\n 'use no memo';\n const { autoSize } = state;\n const appearance = useCarouselContext((context)=>context.appearance);\n const styles = useStyles();\n // eslint-disable-next-line react-hooks/immutability\n state.root.className = mergeClasses(carouselCardClassNames.root, styles.root, appearance === 'elevated' && styles.elevated, autoSize && styles.autoSize, state.root.className);\n return state;\n};\n"],"names":["__styles","mergeClasses","tokens","useCarouselContext_unstable","useCarouselContext","carouselCardClassNames","root","useStyles","xawz","Bh6795r","Bnnss6s","fkmc3a","B2u0y6b","autoSize","Bf4jedk","a9b677","elevated","Beyfa6y","Bbmb7ep","Btl43ni","B7oj6ja","Dimara","E5pizo","B68tc82","Bmxbyg5","Bpg54ce","d","p","useCarouselCardStyles_unstable","state","appearance","context","styles","className"],"mappings":"AAAA,YAAY;;;;;;;;;;;;IAICK,sBAAsB;;;kCAwBY;eAA9BuB;;;uBA3BwB,gBAAgB;iCAES,oBAAoB;AAC/E,+BAA+B;IAClCtB,IAAI,EAAE;AACV,CAAC;AACD;;CAEA,GAAI,MAAMC,SAAS,GAAA,WAAA,OAAGP,eAAA,EAAA;IAAAM,IAAA,EAAA;QAAAE,IAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,MAAA,EAAA;QAAAC,OAAA,EAAA;IAAA;IAAAC,QAAA,EAAA;QAAAL,IAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,MAAA,EAAA;QAAAG,OAAA,EAAA;QAAAC,MAAA,EAAA;QAAAH,OAAA,EAAA;IAAA;IAAAI,QAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,MAAA,EAAA;QAAAC,MAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,OAAA,EAAA;IAAA;AAAA,GAAA;IAAAC,CAAA,EAAA;QAAA;YAAA;YAAA;gBAAAC,CAAA,EAAA,CAAA;YAAA;SAAA;QAAA;QAAA;YAAA;YAAA;gBAAAA,CAAA,EAAA,CAAA;YAAA;SAAA;QAAA;QAAA;QAAA;YAAA;YAAA;gBAAAA,CAAA,EAAA,CAAA;YAAA;SAAA;QAAA;QAAA;YAAA;YAAA;gBAAAA,CAAA,EAAA,CAAA;YAAA;SAAA;KAAA;AAAA,CAgBrB,CAAC;AAGS,wCAAwCE,KAAK,IAAG;IACvD,aAAa;IACb,MAAM,EAAEhB,QAAAA,EAAU,GAAGgB,KAAK;IAC1B,MAAMC,UAAU,OAAG1B,4CAAkB,GAAE2B,OAAO,GAAGA,OAAO,CAACD,UAAU,CAAC;IACpE,MAAME,MAAM,GAAGzB,SAAS,CAAC,CAAC;IAC1B,oDAAA;IACAsB,KAAK,CAACvB,IAAI,CAAC2B,SAAS,OAAGhC,mBAAY,EAACI,sBAAsB,CAACC,IAAI,EAAE0B,MAAM,CAAC1B,IAAI,EAAEwB,UAAU,KAAK,UAAU,IAAIE,MAAM,CAAChB,QAAQ,EAAEH,QAAQ,IAAImB,MAAM,CAACnB,QAAQ,EAAEgB,KAAK,CAACvB,IAAI,CAAC2B,SAAS,CAAC;IAC9K,OAAOJ,KAAK;AAChB,CAAC"}
1
+ {"version":3,"sources":["useCarouselCardStyles.styles.js"],"sourcesContent":["'use client';\nimport { makeStyles, mergeClasses } from '@griffel/react';\nimport { tokens } from '@fluentui/react-theme';\nimport { useCarouselContext_unstable as useCarouselContext } from '../CarouselContext';\nexport const carouselCardClassNames = {\n root: 'fui-CarouselCard'\n};\n/**\n * Styles for the root slot\n */ const useStyles = makeStyles({\n root: {\n flex: '0 0 100%',\n maxWidth: '100%'\n },\n autoSize: {\n flex: '0 0 auto' /* Adapt slide size to its content */ ,\n minWidth: 0,\n width: 'auto',\n maxWidth: '100%'\n },\n elevated: {\n borderRadius: tokens.borderRadiusXLarge,\n boxShadow: tokens.shadow16,\n overflow: 'hidden'\n }\n});\n/**\n * Apply styling to the CarouselCard slots based on the state\n */ export const useCarouselCardStyles_unstable = (state)=>{\n const { autoSize } = state;\n const appearance = useCarouselContext((context)=>context.appearance);\n const styles = useStyles();\n // eslint-disable-next-line react-hooks/immutability\n state.root.className = mergeClasses(carouselCardClassNames.root, styles.root, appearance === 'elevated' && styles.elevated, autoSize && styles.autoSize, state.root.className);\n return state;\n};\n"],"names":["__styles","mergeClasses","tokens","useCarouselContext_unstable","useCarouselContext","carouselCardClassNames","root","useStyles","xawz","Bh6795r","Bnnss6s","fkmc3a","B2u0y6b","autoSize","Bf4jedk","a9b677","elevated","Beyfa6y","Bbmb7ep","Btl43ni","B7oj6ja","Dimara","E5pizo","B68tc82","Bmxbyg5","Bpg54ce","d","p","useCarouselCardStyles_unstable","state","appearance","context","styles","className"],"mappings":"AAAA,YAAY;;;;;;;;;;;;IAICK,sBAAsB;;;kCAwBY;eAA9BuB;;;uBA3BwB,gBAAgB;iCAES,oBAAoB;AAC/E,+BAA+B;IAClCtB,IAAI,EAAE;AACV,CAAC;AACD;;CAEA,GAAI,MAAMC,SAAS,GAAA,WAAA,OAAGP,eAAA,EAAA;IAAAM,IAAA,EAAA;QAAAE,IAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,MAAA,EAAA;QAAAC,OAAA,EAAA;IAAA;IAAAC,QAAA,EAAA;QAAAL,IAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,MAAA,EAAA;QAAAG,OAAA,EAAA;QAAAC,MAAA,EAAA;QAAAH,OAAA,EAAA;IAAA;IAAAI,QAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,MAAA,EAAA;QAAAC,MAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,OAAA,EAAA;IAAA;AAAA,GAAA;IAAAC,CAAA,EAAA;QAAA;YAAA;YAAA;gBAAAC,CAAA,EAAA,CAAA;YAAA;SAAA;QAAA;QAAA;YAAA;YAAA;gBAAAA,CAAA,EAAA,CAAA;YAAA;SAAA;QAAA;QAAA;QAAA;YAAA;YAAA;gBAAAA,CAAA,EAAA,CAAA;YAAA;SAAA;QAAA;QAAA;YAAA;YAAA;gBAAAA,CAAA,EAAA,CAAA;YAAA;SAAA;KAAA;AAAA,CAgBrB,CAAC;AAGS,wCAAwCE,KAAK,IAAG;IACvD,MAAM,EAAEhB,QAAAA,EAAU,GAAGgB,KAAK;IAC1B,MAAMC,UAAU,OAAG1B,4CAAkB,EAAE2B,OAAO,IAAGA,OAAO,CAACD,UAAU,CAAC;IACpE,MAAME,MAAM,GAAGzB,SAAS,CAAC,CAAC;IAC1B,oDAAA;IACAsB,KAAK,CAACvB,IAAI,CAAC2B,SAAS,OAAGhC,mBAAY,EAACI,sBAAsB,CAACC,IAAI,EAAE0B,MAAM,CAAC1B,IAAI,EAAEwB,UAAU,KAAK,UAAU,IAAIE,MAAM,CAAChB,QAAQ,EAAEH,QAAQ,IAAImB,MAAM,CAACnB,QAAQ,EAAEgB,KAAK,CAACvB,IAAI,CAAC2B,SAAS,CAAC;IAC9K,OAAOJ,KAAK;AAChB,CAAC"}
@@ -43,7 +43,6 @@ const carouselCardClassNames = {
43
43
  }
44
44
  });
45
45
  const useCarouselCardStyles_unstable = (state)=>{
46
- 'use no memo';
47
46
  const { autoSize } = state;
48
47
  const appearance = (0, _CarouselContext.useCarouselContext_unstable)((context)=>context.appearance);
49
48
  const styles = useStyles();
@@ -1 +1 @@
1
- {"version":3,"sources":["../src/components/CarouselCard/useCarouselCardStyles.styles.ts"],"sourcesContent":["'use client';\n\nimport { makeStyles, mergeClasses } from '@griffel/react';\nimport type { SlotClassNames } from '@fluentui/react-utilities';\nimport { tokens } from '@fluentui/react-theme';\nimport { useCarouselContext_unstable as useCarouselContext } from '../CarouselContext';\nimport type { CarouselCardSlots, CarouselCardState } from './CarouselCard.types';\n\nexport const carouselCardClassNames: SlotClassNames<CarouselCardSlots> = {\n root: 'fui-CarouselCard',\n};\n\n/**\n * Styles for the root slot\n */\nconst useStyles = makeStyles({\n root: {\n flex: '0 0 100%',\n maxWidth: '100%',\n },\n autoSize: {\n flex: '0 0 auto' /* Adapt slide size to its content */,\n minWidth: 0,\n width: 'auto',\n maxWidth: '100%',\n },\n elevated: {\n borderRadius: tokens.borderRadiusXLarge,\n boxShadow: tokens.shadow16,\n overflow: 'hidden',\n },\n});\n\n/**\n * Apply styling to the CarouselCard slots based on the state\n */\nexport const useCarouselCardStyles_unstable = (state: CarouselCardState): CarouselCardState => {\n 'use no memo';\n\n const { autoSize } = state;\n const appearance = useCarouselContext(context => context.appearance);\n\n const styles = useStyles();\n // eslint-disable-next-line react-hooks/immutability\n state.root.className = mergeClasses(\n carouselCardClassNames.root,\n styles.root,\n appearance === 'elevated' && styles.elevated,\n autoSize && styles.autoSize,\n state.root.className,\n );\n\n return state;\n};\n"],"names":["makeStyles","mergeClasses","tokens","useCarouselContext_unstable","useCarouselContext","carouselCardClassNames","root","useStyles","flex","maxWidth","autoSize","minWidth","width","elevated","borderRadius","borderRadiusXLarge","boxShadow","shadow16","overflow","useCarouselCardStyles_unstable","state","appearance","context","styles","className"],"mappings":"AAAA;;;;;;;;;;;;IAQaK,sBAAAA;;;IA4BAc,8BAAAA;;;;uBAlC4B,iBAAiB;4BAEnC,wBAAwB;iCACmB,qBAAqB;AAGhF,+BAAkE;IACvEb,MAAM;AACR,EAAE;AAEF;;CAEC,GACD,MAAMC,gBAAYP,iBAAAA,EAAW;IAC3BM,MAAM;QACJE,MAAM;QACNC,UAAU;IACZ;IACAC,UAAU;QACRF,MAAM,WAAW,mCAAmC;QACpDG,UAAU;QACVC,OAAO;QACPH,UAAU;IACZ;IACAI,UAAU;QACRC,cAAcZ,kBAAAA,CAAOa,kBAAkB;QACvCC,WAAWd,kBAAAA,CAAOe,QAAQ;QAC1BC,UAAU;IACZ;AACF;AAKO,uCAAuC,CAACE;IAC7C;IAEA,MAAM,EAAEV,QAAQ,EAAE,GAAGU;IACrB,MAAMC,iBAAajB,4CAAAA,EAAmBkB,CAAAA,UAAWA,QAAQD,UAAU;IAEnE,MAAME,SAAShB;IACf,oDAAoD;IACpDa,MAAMd,IAAI,CAACkB,SAAS,OAAGvB,mBAAAA,EACrBI,uBAAuBC,IAAI,EAC3BiB,OAAOjB,IAAI,EACXe,eAAe,cAAcE,OAAOV,QAAQ,EAC5CH,YAAYa,OAAOb,QAAQ,EAC3BU,MAAMd,IAAI,CAACkB,SAAS;IAGtB,OAAOJ;AACT,EAAE"}
1
+ {"version":3,"sources":["../src/components/CarouselCard/useCarouselCardStyles.styles.ts"],"sourcesContent":["'use client';\n\nimport { makeStyles, mergeClasses } from '@griffel/react';\nimport type { SlotClassNames } from '@fluentui/react-utilities';\nimport { tokens } from '@fluentui/react-theme';\nimport { useCarouselContext_unstable as useCarouselContext } from '../CarouselContext';\nimport type { CarouselCardSlots, CarouselCardState } from './CarouselCard.types';\n\nexport const carouselCardClassNames: SlotClassNames<CarouselCardSlots> = {\n root: 'fui-CarouselCard',\n};\n\n/**\n * Styles for the root slot\n */\nconst useStyles = makeStyles({\n root: {\n flex: '0 0 100%',\n maxWidth: '100%',\n },\n autoSize: {\n flex: '0 0 auto' /* Adapt slide size to its content */,\n minWidth: 0,\n width: 'auto',\n maxWidth: '100%',\n },\n elevated: {\n borderRadius: tokens.borderRadiusXLarge,\n boxShadow: tokens.shadow16,\n overflow: 'hidden',\n },\n});\n\n/**\n * Apply styling to the CarouselCard slots based on the state\n */\nexport const useCarouselCardStyles_unstable = (state: CarouselCardState): CarouselCardState => {\n const { autoSize } = state;\n const appearance = useCarouselContext(context => context.appearance);\n\n const styles = useStyles();\n // eslint-disable-next-line react-hooks/immutability\n state.root.className = mergeClasses(\n carouselCardClassNames.root,\n styles.root,\n appearance === 'elevated' && styles.elevated,\n autoSize && styles.autoSize,\n state.root.className,\n );\n\n return state;\n};\n"],"names":["makeStyles","mergeClasses","tokens","useCarouselContext_unstable","useCarouselContext","carouselCardClassNames","root","useStyles","flex","maxWidth","autoSize","minWidth","width","elevated","borderRadius","borderRadiusXLarge","boxShadow","shadow16","overflow","useCarouselCardStyles_unstable","state","appearance","context","styles","className"],"mappings":"AAAA;;;;;;;;;;;;IAQaK,sBAAAA;;;IA4BAc,8BAAAA;;;;uBAlC4B,iBAAiB;4BAEnC,wBAAwB;iCACmB,qBAAqB;AAGhF,+BAAkE;IACvEb,MAAM;AACR,EAAE;AAEF;;CAEC,GACD,MAAMC,gBAAYP,iBAAAA,EAAW;IAC3BM,MAAM;QACJE,MAAM;QACNC,UAAU;IACZ;IACAC,UAAU;QACRF,MAAM,WAAW,mCAAmC;QACpDG,UAAU;QACVC,OAAO;QACPH,UAAU;IACZ;IACAI,UAAU;QACRC,cAAcZ,kBAAAA,CAAOa,kBAAkB;QACvCC,WAAWd,kBAAAA,CAAOe,QAAQ;QAC1BC,UAAU;IACZ;AACF;AAKO,uCAAuC,CAACE;IAC7C,MAAM,EAAEV,QAAQ,EAAE,GAAGU;IACrB,MAAMC,iBAAajB,4CAAAA,EAAmBkB,CAAAA,UAAWA,QAAQD,UAAU;IAEnE,MAAME,SAAShB;IACf,oDAAoD;IACpDa,MAAMd,IAAI,CAACkB,SAAS,OAAGvB,mBAAAA,EACrBI,uBAAuBC,IAAI,EAC3BiB,OAAOjB,IAAI,EACXe,eAAe,cAAcE,OAAOV,QAAQ,EAC5CH,YAAYa,OAAOb,QAAQ,EAC3BU,MAAMd,IAAI,CAACkB,SAAS;IAGtB,OAAOJ;AACT,EAAE"}
@@ -100,7 +100,6 @@ const carouselNavClassNames = {
100
100
  ]
101
101
  });
102
102
  const useCarouselNavStyles_unstable = (state)=>{
103
- 'use no memo';
104
103
  const styles = useStyles();
105
104
  // eslint-disable-next-line react-hooks/immutability
106
105
  state.root.className = (0, _react.mergeClasses)(carouselNavClassNames.root, styles.root, state.root.className);
@@ -1 +1 @@
1
- {"version":3,"sources":["useCarouselNavStyles.styles.js"],"sourcesContent":["'use client';\nimport { makeStyles, mergeClasses, shorthands } from '@griffel/react';\nimport { createCustomFocusIndicatorStyle } from '@fluentui/react-tabster';\nimport { tokens } from '@fluentui/react-theme';\nexport const carouselNavClassNames = {\n root: 'fui-CarouselNav'\n};\n/**\n * Styles for the root slot\n */ const useStyles = makeStyles({\n root: {\n display: 'flex',\n flexDirection: 'row',\n alignItems: 'center',\n justifyContent: 'center',\n pointerEvents: 'all',\n ...createCustomFocusIndicatorStyle({\n outline: `${tokens.strokeWidthThick} solid ${tokens.colorStrokeFocus2}`,\n borderRadius: tokens.borderRadiusMedium,\n ...shorthands.borderColor('transparent')\n }),\n borderRadius: tokens.borderRadiusXLarge,\n margin: `auto ${tokens.spacingHorizontalS}`,\n backgroundColor: tokens.colorNeutralBackgroundAlpha\n }\n});\n/**\n * Apply styling to the CarouselNav slots based on the state\n */ export const useCarouselNavStyles_unstable = (state)=>{\n 'use no memo';\n const styles = useStyles();\n // eslint-disable-next-line react-hooks/immutability\n state.root.className = mergeClasses(carouselNavClassNames.root, styles.root, state.root.className);\n return state;\n};\n"],"names":["__styles","mergeClasses","shorthands","createCustomFocusIndicatorStyle","tokens","carouselNavClassNames","root","useStyles","mc9l5x","Beiy3e4","Bt984gj","Brf1p80","Bkecrkj","Bfpq7zp","g9k6zt","Bn4voq9","giviqs","Bw81rd7","kdpuga","dm238s","B6xbmo0","B3whbx2","B8q5s1w","Bci5o5g","n8qw10","Bdrgwmp","Beyfa6y","Bbmb7ep","Btl43ni","B7oj6ja","Dimara","jrapky","Frg6f3","t21cq0","B6of3ja","B74szlk","De3pzq","d","p","useCarouselNavStyles_unstable","state","styles","className"],"mappings":"AAAA,YAAY;;;;;;;;;;;;IAICK,qBAAqB;;;IAwBjBkC,6BAA6B;;;;uBA3BO,gBAAgB;AAG9D,8BAA8B;IACjCjC,IAAI,EAAE;AACV,CAAC;AACD;;CAEA,GAAI,MAAMC,SAAS,GAAA,WAAA,OAAGP,eAAA,EAAA;IAAAM,IAAA,EAAA;QAAAE,MAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,MAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,MAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,MAAA,EAAA;QAAAC,MAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,OAAA,EAAA;YAAA;YAAA;SAAA;QAAAC,MAAA,EAAA;QAAAC,OAAA,EAAA;YAAA;YAAA;SAAA;QAAAC,OAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,MAAA,EAAA;QAAAC,MAAA,EAAA;QAAAC,MAAA,EAAA;QAAAC,MAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,MAAA,EAAA;IAAA;AAAA,GAAA;IAAAC,CAAA,EAAA;QAAA;QAAA;QAAA;QAAA;QAAA;QAAA;YAAA;YAAA;gBAAAC,CAAA,EAAA,CAAA;YAAA;SAAA;QAAA;YAAA;YAAA;gBAAAA,CAAA,EAAA,CAAA;YAAA;SAAA;QAAA;QAAA;QAAA;QAAA;QAAA;YAAA;YAAA;gBAAAA,CAAA,EAAA,CAAA;YAAA;SAAA;QAAA;YAAA;YAAA;gBAAAA,CAAA,EAAA,CAAA;YAAA;SAAA;QAAA;KAAA;AAAA,CAgBrB,CAAC;AAGS,uCAAuCE,KAAK,IAAG;IACtD,aAAa;IACb,MAAMC,MAAM,GAAGlC,SAAS,CAAC,CAAC;IAC1B,oDAAA;IACAiC,KAAK,CAAClC,IAAI,CAACoC,SAAS,OAAGzC,mBAAY,EAACI,qBAAqB,CAACC,IAAI,EAAEmC,MAAM,CAACnC,IAAI,EAAEkC,KAAK,CAAClC,IAAI,CAACoC,SAAS,CAAC;IAClG,OAAOF,KAAK;AAChB,CAAC"}
1
+ {"version":3,"sources":["useCarouselNavStyles.styles.js"],"sourcesContent":["'use client';\nimport { makeStyles, mergeClasses, shorthands } from '@griffel/react';\nimport { createCustomFocusIndicatorStyle } from '@fluentui/react-tabster';\nimport { tokens } from '@fluentui/react-theme';\nexport const carouselNavClassNames = {\n root: 'fui-CarouselNav'\n};\n/**\n * Styles for the root slot\n */ const useStyles = makeStyles({\n root: {\n display: 'flex',\n flexDirection: 'row',\n alignItems: 'center',\n justifyContent: 'center',\n pointerEvents: 'all',\n ...createCustomFocusIndicatorStyle({\n outline: `${tokens.strokeWidthThick} solid ${tokens.colorStrokeFocus2}`,\n borderRadius: tokens.borderRadiusMedium,\n ...shorthands.borderColor('transparent')\n }),\n borderRadius: tokens.borderRadiusXLarge,\n margin: `auto ${tokens.spacingHorizontalS}`,\n backgroundColor: tokens.colorNeutralBackgroundAlpha\n }\n});\n/**\n * Apply styling to the CarouselNav slots based on the state\n */ export const useCarouselNavStyles_unstable = (state)=>{\n const styles = useStyles();\n // eslint-disable-next-line react-hooks/immutability\n state.root.className = mergeClasses(carouselNavClassNames.root, styles.root, state.root.className);\n return state;\n};\n"],"names":["__styles","mergeClasses","shorthands","createCustomFocusIndicatorStyle","tokens","carouselNavClassNames","root","useStyles","mc9l5x","Beiy3e4","Bt984gj","Brf1p80","Bkecrkj","Bfpq7zp","g9k6zt","Bn4voq9","giviqs","Bw81rd7","kdpuga","dm238s","B6xbmo0","B3whbx2","B8q5s1w","Bci5o5g","n8qw10","Bdrgwmp","Beyfa6y","Bbmb7ep","Btl43ni","B7oj6ja","Dimara","jrapky","Frg6f3","t21cq0","B6of3ja","B74szlk","De3pzq","d","p","useCarouselNavStyles_unstable","state","styles","className"],"mappings":"AAAA,YAAY;;;;;;;;;;;;IAICK,qBAAqB;;;IAwBjBkC,6BAA6B;;;;uBA3BO,gBAAgB;AAG9D,8BAA8B;IACjCjC,IAAI,EAAE;AACV,CAAC;AACD;;CAEA,GAAI,MAAMC,SAAS,GAAA,WAAA,OAAGP,eAAA,EAAA;IAAAM,IAAA,EAAA;QAAAE,MAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,MAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,MAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,MAAA,EAAA;QAAAC,MAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,OAAA,EAAA;YAAA;YAAA;SAAA;QAAAC,MAAA,EAAA;QAAAC,OAAA,EAAA;YAAA;YAAA;SAAA;QAAAC,OAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,MAAA,EAAA;QAAAC,MAAA,EAAA;QAAAC,MAAA,EAAA;QAAAC,MAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,MAAA,EAAA;IAAA;AAAA,GAAA;IAAAC,CAAA,EAAA;QAAA;QAAA;QAAA;QAAA;QAAA;QAAA;YAAA;YAAA;gBAAAC,CAAA,EAAA,CAAA;YAAA;SAAA;QAAA;YAAA;YAAA;gBAAAA,CAAA,EAAA,CAAA;YAAA;SAAA;QAAA;QAAA;QAAA;QAAA;QAAA;YAAA;YAAA;gBAAAA,CAAA,EAAA,CAAA;YAAA;SAAA;QAAA;YAAA;YAAA;gBAAAA,CAAA,EAAA,CAAA;YAAA;SAAA;QAAA;KAAA;AAAA,CAgBrB,CAAC;AAGS,uCAAuCE,KAAK,IAAG;IACtD,MAAMC,MAAM,GAAGlC,SAAS,CAAC,CAAC;IAC1B,oDAAA;IACAiC,KAAK,CAAClC,IAAI,CAACoC,SAAS,OAAGzC,mBAAY,EAACI,qBAAqB,CAACC,IAAI,EAAEmC,MAAM,CAACnC,IAAI,EAAEkC,KAAK,CAAClC,IAAI,CAACoC,SAAS,CAAC;IAClG,OAAOF,KAAK;AAChB,CAAC"}
@@ -43,7 +43,6 @@ const carouselNavClassNames = {
43
43
  }
44
44
  });
45
45
  const useCarouselNavStyles_unstable = (state)=>{
46
- 'use no memo';
47
46
  const styles = useStyles();
48
47
  // eslint-disable-next-line react-hooks/immutability
49
48
  state.root.className = (0, _react.mergeClasses)(carouselNavClassNames.root, styles.root, state.root.className);
@@ -1 +1 @@
1
- {"version":3,"sources":["../src/components/CarouselNav/useCarouselNavStyles.styles.ts"],"sourcesContent":["'use client';\n\nimport { makeStyles, mergeClasses, shorthands } from '@griffel/react';\nimport { createCustomFocusIndicatorStyle } from '@fluentui/react-tabster';\nimport { tokens } from '@fluentui/react-theme';\nimport type { SlotClassNames } from '@fluentui/react-utilities';\n\nimport type { CarouselNavSlots, CarouselNavState } from './CarouselNav.types';\n\nexport const carouselNavClassNames: SlotClassNames<CarouselNavSlots> = {\n root: 'fui-CarouselNav',\n};\n\n/**\n * Styles for the root slot\n */\nconst useStyles = makeStyles({\n root: {\n display: 'flex',\n flexDirection: 'row',\n alignItems: 'center',\n justifyContent: 'center',\n pointerEvents: 'all',\n ...createCustomFocusIndicatorStyle({\n outline: `${tokens.strokeWidthThick} solid ${tokens.colorStrokeFocus2}`,\n borderRadius: tokens.borderRadiusMedium,\n ...shorthands.borderColor('transparent'),\n }),\n borderRadius: tokens.borderRadiusXLarge,\n margin: `auto ${tokens.spacingHorizontalS}`,\n backgroundColor: tokens.colorNeutralBackgroundAlpha,\n },\n});\n\n/**\n * Apply styling to the CarouselNav slots based on the state\n */\nexport const useCarouselNavStyles_unstable = (state: CarouselNavState): CarouselNavState => {\n 'use no memo';\n\n const styles = useStyles();\n // eslint-disable-next-line react-hooks/immutability\n state.root.className = mergeClasses(carouselNavClassNames.root, styles.root, state.root.className);\n\n return state;\n};\n"],"names":["makeStyles","mergeClasses","shorthands","createCustomFocusIndicatorStyle","tokens","carouselNavClassNames","root","useStyles","display","flexDirection","alignItems","justifyContent","pointerEvents","outline","strokeWidthThick","colorStrokeFocus2","borderRadius","borderRadiusMedium","borderColor","borderRadiusXLarge","margin","spacingHorizontalS","backgroundColor","colorNeutralBackgroundAlpha","useCarouselNavStyles_unstable","state","styles","className"],"mappings":"AAAA;;;;;;;;;;;;IASaK,qBAAAA;;;iCA4BAmB;;;;uBAnCwC,iBAAiB;8BACtB,0BAA0B;4BACnD,wBAAwB;AAKxC,8BAAgE;IACrElB,MAAM;AACR,EAAE;AAEF;;CAEC,GACD,MAAMC,gBAAYP,iBAAAA,EAAW;IAC3BM,MAAM;QACJE,SAAS;QACTC,eAAe;QACfC,YAAY;QACZC,gBAAgB;QAChBC,eAAe;QACf,OAAGT,6CAAAA,EAAgC;YACjCU,SAAS,GAAGT,kBAAAA,CAAOU,gBAAgB,CAAC,OAAO,EAAEV,kBAAAA,CAAOW,iBAAiB,EAAE;YACvEC,cAAcZ,kBAAAA,CAAOa,kBAAkB;YACvC,GAAGf,iBAAAA,CAAWgB,WAAW,CAAC,cAAc;QAC1C,EAAE;QACFF,cAAcZ,kBAAAA,CAAOe,kBAAkB;QACvCC,QAAQ,CAAC,KAAK,EAAEhB,kBAAAA,CAAOiB,kBAAkB,EAAE;QAC3CC,iBAAiBlB,kBAAAA,CAAOmB,2BAA2B;IACrD;AACF;AAKO,MAAMC,gCAAgC,CAACC;IAC5C;IAEA,MAAMC,SAASnB;IACf,oDAAoD;IACpDkB,MAAMnB,IAAI,CAACqB,SAAS,OAAG1B,mBAAAA,EAAaI,sBAAsBC,IAAI,EAAEoB,OAAOpB,IAAI,EAAEmB,MAAMnB,IAAI,CAACqB,SAAS;IAEjG,OAAOF;AACT,EAAE"}
1
+ {"version":3,"sources":["../src/components/CarouselNav/useCarouselNavStyles.styles.ts"],"sourcesContent":["'use client';\n\nimport { makeStyles, mergeClasses, shorthands } from '@griffel/react';\nimport { createCustomFocusIndicatorStyle } from '@fluentui/react-tabster';\nimport { tokens } from '@fluentui/react-theme';\nimport type { SlotClassNames } from '@fluentui/react-utilities';\n\nimport type { CarouselNavSlots, CarouselNavState } from './CarouselNav.types';\n\nexport const carouselNavClassNames: SlotClassNames<CarouselNavSlots> = {\n root: 'fui-CarouselNav',\n};\n\n/**\n * Styles for the root slot\n */\nconst useStyles = makeStyles({\n root: {\n display: 'flex',\n flexDirection: 'row',\n alignItems: 'center',\n justifyContent: 'center',\n pointerEvents: 'all',\n ...createCustomFocusIndicatorStyle({\n outline: `${tokens.strokeWidthThick} solid ${tokens.colorStrokeFocus2}`,\n borderRadius: tokens.borderRadiusMedium,\n ...shorthands.borderColor('transparent'),\n }),\n borderRadius: tokens.borderRadiusXLarge,\n margin: `auto ${tokens.spacingHorizontalS}`,\n backgroundColor: tokens.colorNeutralBackgroundAlpha,\n },\n});\n\n/**\n * Apply styling to the CarouselNav slots based on the state\n */\nexport const useCarouselNavStyles_unstable = (state: CarouselNavState): CarouselNavState => {\n const styles = useStyles();\n // eslint-disable-next-line react-hooks/immutability\n state.root.className = mergeClasses(carouselNavClassNames.root, styles.root, state.root.className);\n\n return state;\n};\n"],"names":["makeStyles","mergeClasses","shorthands","createCustomFocusIndicatorStyle","tokens","carouselNavClassNames","root","useStyles","display","flexDirection","alignItems","justifyContent","pointerEvents","outline","strokeWidthThick","colorStrokeFocus2","borderRadius","borderRadiusMedium","borderColor","borderRadiusXLarge","margin","spacingHorizontalS","backgroundColor","colorNeutralBackgroundAlpha","useCarouselNavStyles_unstable","state","styles","className"],"mappings":"AAAA;;;;;;;;;;;;IASaK,qBAAAA;;;iCA4BAmB;;;;uBAnCwC,iBAAiB;8BACtB,0BAA0B;4BACnD,wBAAwB;AAKxC,8BAAgE;IACrElB,MAAM;AACR,EAAE;AAEF;;CAEC,GACD,MAAMC,gBAAYP,iBAAAA,EAAW;IAC3BM,MAAM;QACJE,SAAS;QACTC,eAAe;QACfC,YAAY;QACZC,gBAAgB;QAChBC,eAAe;QACf,OAAGT,6CAAAA,EAAgC;YACjCU,SAAS,GAAGT,kBAAAA,CAAOU,gBAAgB,CAAC,OAAO,EAAEV,kBAAAA,CAAOW,iBAAiB,EAAE;YACvEC,cAAcZ,kBAAAA,CAAOa,kBAAkB;YACvC,GAAGf,iBAAAA,CAAWgB,WAAW,CAAC,cAAc;QAC1C,EAAE;QACFF,cAAcZ,kBAAAA,CAAOe,kBAAkB;QACvCC,QAAQ,CAAC,KAAK,EAAEhB,kBAAAA,CAAOiB,kBAAkB,EAAE;QAC3CC,iBAAiBlB,kBAAAA,CAAOmB,2BAA2B;IACrD;AACF;AAKO,MAAMC,gCAAgC,CAACC;IAC5C,MAAMC,SAASnB;IACf,oDAAoD;IACpDkB,MAAMnB,IAAI,CAACqB,SAAS,OAAG1B,mBAAAA,EAAaI,sBAAsBC,IAAI,EAAEoB,OAAOpB,IAAI,EAAEmB,MAAMnB,IAAI,CAACqB,SAAS;IAEjG,OAAOF;AACT,EAAE"}
@@ -311,7 +311,6 @@ const carouselNavButtonClassNames = {
311
311
  ]
312
312
  });
313
313
  const useCarouselNavButtonStyles_unstable = (state)=>{
314
- 'use no memo';
315
314
  const styles = useStyles();
316
315
  const { selected, appearance } = state;
317
316
  // eslint-disable-next-line react-hooks/immutability
@@ -1 +1 @@
1
- {"version":3,"sources":["useCarouselNavButtonStyles.styles.js"],"sourcesContent":["'use client';\nimport { makeStyles, mergeClasses, shorthands } from '@griffel/react';\nimport { createCustomFocusIndicatorStyle } from '@fluentui/react-tabster';\nimport { tokens } from '@fluentui/react-theme';\nexport const carouselNavButtonClassNames = {\n root: 'fui-CarouselNavButton'\n};\n/**\n * Styles for the root slot\n */ const useStyles = makeStyles({\n root: {\n cursor: 'pointer',\n pointerEvents: 'all',\n width: tokens.spacingHorizontalS,\n height: tokens.spacingVerticalS,\n padding: `${tokens.spacingVerticalS} ${tokens.spacingHorizontalS}`,\n boxSizing: 'content-box',\n backgroundColor: tokens.colorTransparentBackground,\n ...shorthands.borderWidth(0),\n '::after': {\n content: '\"\"',\n display: 'block',\n boxSizing: 'border-box',\n borderRadius: '50%',\n border: 'none',\n height: tokens.spacingVerticalS,\n width: tokens.spacingHorizontalS,\n backgroundColor: tokens.colorNeutralForeground1,\n color: tokens.colorNeutralForeground1,\n '@media (forced-colors: active)': {\n // Bypass OS high contrast with inverted blend mode (otherwise icon is invisible)\n forcedColorAdjust: 'none',\n backgroundColor: 'white',\n mixBlendMode: 'difference'\n }\n }\n },\n rootUnselected: {\n outline: `${tokens.strokeWidthThin} solid transparent`,\n ...createCustomFocusIndicatorStyle({\n border: `${tokens.strokeWidthThick} solid ${tokens.colorStrokeFocus2}`,\n margin: `calc(-1 * ${tokens.strokeWidthThick})`,\n borderRadius: tokens.borderRadiusMedium\n }),\n '::after': {\n opacity: 0.6\n },\n ':hover': {\n '::after': {\n opacity: 0.75\n }\n },\n ':active': {\n '::after': {\n opacity: 1\n }\n }\n },\n rootSelected: {\n width: tokens.spacingHorizontalL,\n padding: `${tokens.spacingVerticalS} ${tokens.spacingHorizontalXS}`,\n outline: `${tokens.strokeWidthThin} solid transparent`,\n ...createCustomFocusIndicatorStyle({\n border: `${tokens.strokeWidthThick} solid ${tokens.colorStrokeFocus2}`,\n margin: `calc(-1 * ${tokens.strokeWidthThick})`,\n borderRadius: tokens.borderRadiusMedium\n }),\n '::after': {\n width: tokens.spacingHorizontalL,\n borderRadius: '4px'\n },\n ':hover': {\n '::after': {\n opacity: 0.75\n }\n },\n ':active': {\n '::after': {\n opacity: 0.65\n }\n }\n },\n brand: {\n '::after': {\n backgroundColor: tokens.colorCompoundBrandBackground,\n opacity: 1\n },\n ':hover': {\n '::after': {\n backgroundColor: tokens.colorCompoundBrandBackgroundHover,\n opacity: 1\n }\n },\n ':active': {\n '::after': {\n backgroundColor: tokens.colorCompoundBrandBackgroundPressed,\n opacity: 1\n }\n }\n },\n unselectedBrand: {\n '::after': {\n opacity: 0.6,\n backgroundColor: tokens.colorNeutralForeground1\n },\n ':hover': {\n '::after': {\n opacity: 0.75\n }\n },\n ':active': {\n '::after': {\n opacity: 1\n }\n }\n }\n});\n/**\n * Apply styling to the CarouselNavButton slots based on the state\n */ export const useCarouselNavButtonStyles_unstable = (state)=>{\n 'use no memo';\n const styles = useStyles();\n const { selected, appearance } = state;\n // eslint-disable-next-line react-hooks/immutability\n state.root.className = mergeClasses(carouselNavButtonClassNames.root, styles.root, selected ? styles.rootSelected : styles.rootUnselected, appearance === 'brand' && styles.brand, !selected && appearance === 'brand' && styles.unselectedBrand, state.root.className);\n return state;\n};\n"],"names":["__styles","mergeClasses","shorthands","createCustomFocusIndicatorStyle","tokens","carouselNavButtonClassNames","root","useStyles","Bceei9c","Bkecrkj","a9b677","Bqenvij","Byoj8tv","uwmqm3","z189sj","z8tnut","B0ocmuz","B7ck84d","De3pzq","B4j52fo","Bekrc4i","Bn0qgzm","ibv6hh","Bsft5z2","ap17g6","li1rpt","d9w3h3","B3778ie","B4j8arr","Bl18szs","Blrzh8d","Bjuhk93","B1q35kw","Bw17bha","Bcgy8vk","Du69r6","Gp14am","vfts7","Bhxzhr1","G63luc","s924m2","Barhvk9","Ihftqj","wywymt","B0n5ga8","Bm2nyyq","xrcqlc","e1d83w","Dlnsje","a2br6o","Bjyk6c5","go7t6h","xdqbwx","Hwb57","umgawz","rootUnselected","Bw0xxkn","oeaueh","Bpd4iqm","Befb4lg","Byu6kyc","n8qw10","Bbjhlyh","i2cumq","Bunx835","Bdrgwmp","mqozju","lbo84a","Bksnhdo","Bci5o5g","u5e7qz","Bn40d3w","B7b6zxw","B8q5s1w","B5gfjzb","Bbcte9g","Bqz3imu","Bj9ihqo","Bl51kww","B3bvztg","Btyt4dx","Brhw1f9","Bw81rd7","kdpuga","dm238s","B6xbmo0","B3whbx2","Bp15pi3","Bay5ve9","Bni0232","rootSelected","brand","Glksuk","Blzl0y7","unselectedBrand","d","p","m","h","a","useCarouselNavButtonStyles_unstable","state","styles","selected","appearance","className"],"mappings":"AAAA,YAAY;;;;;;;;;;;;IAICK,2BAA2B;;;IAmHvB+F,mCAAmC;;;;uBAtHC,gBAAgB;AAG9D,oCAAoC;IACvC9F,IAAI,EAAE;AACV,CAAC;AACD;;CAEA,GAAI,MAAMC,SAAS,GAAA,WAAA,OAAGP,eAAA,EAAA;IAAAM,IAAA,EAAA;QAAAE,OAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,MAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,MAAA,EAAA;QAAAC,MAAA,EAAA;QAAAC,MAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,MAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,OAAA,EAAA;YAAA;YAAA;SAAA;QAAAC,OAAA,EAAA;QAAAC,MAAA,EAAA;YAAA;YAAA;SAAA;QAAAC,OAAA,EAAA;QAAAC,MAAA,EAAA;QAAAC,MAAA,EAAA;QAAAC,MAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,MAAA,EAAA;QAAAC,MAAA,EAAA;QAAAC,KAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,MAAA,EAAA;QAAAC,MAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,MAAA,EAAA;QAAAC,MAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,MAAA,EAAA;QAAAC,MAAA,EAAA;QAAAC,MAAA,EAAA;QAAAC,MAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,MAAA,EAAA;QAAAC,MAAA,EAAA;QAAAC,KAAA,EAAA;QAAAC,MAAA,EAAA;IAAA;IAAAC,cAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,MAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,MAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,MAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,MAAA,EAAA;QAAAC,MAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,MAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,MAAA,EAAA;QAAAC,MAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,OAAA,EAAA;IAAA;IAAAC,YAAA,EAAA;QAAAhF,MAAA,EAAA;QAAAE,OAAA,EAAA;QAAAC,MAAA,EAAA;QAAAC,MAAA,EAAA;QAAAC,MAAA,EAAA;QAAAC,OAAA,EAAA;QAAAwC,OAAA,EAAA;QAAAC,MAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,MAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,MAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,MAAA,EAAA;QAAAC,MAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,MAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,MAAA,EAAA;QAAAC,MAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,OAAA,EAAA;QAAArC,MAAA,EAAA;QAAAvB,MAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,OAAA,EAAA;QAAA0D,OAAA,EAAA;QAAAC,OAAA,EAAA;IAAA;IAAAE,KAAA,EAAA;QAAAzC,OAAA,EAAA;QAAAqC,OAAA,EAAA;QAAAK,MAAA,EAAA;QAAAJ,OAAA,EAAA;QAAAK,OAAA,EAAA;QAAAJ,OAAA,EAAA;IAAA;IAAAK,eAAA,EAAA;QAAAP,OAAA,EAAA;QAAArC,OAAA,EAAA;QAAAsC,OAAA,EAAA;QAAAC,OAAA,EAAA;IAAA;AAAA,GAAA;IAAAM,CAAA,EAAA;QAAA;QAAA;QAAA;QAAA;QAAA;YAAA;YAAA;gBAAAC,CAAA,EAAA,CAAA;YAAA;SAAA;QAAA;QAAA;QAAA;QAAA;QAAA;QAAA;QAAA;QAAA;QAAA;QAAA;YAAA;YAAA;gBAAAA,CAAA,EAAA,CAAA;YAAA;SAAA;QAAA;YAAA;YAAA;gBAAAA,CAAA,EAAA,CAAA;YAAA;SAAA;QAAA;QAAA;QAAA;QAAA;QAAA;YAAA;YAAA;gBAAAA,CAAA,EAAA,CAAA;YAAA;SAAA;QAAA;YAAA;YAAA;gBAAAA,CAAA,EAAA,CAAA;YAAA;SAAA;QAAA;YAAA;YAAA;gBAAAA,CAAA,EAAA,CAAA;YAAA;SAAA;QAAA;YAAA;YAAA;gBAAAA,CAAA,EAAA,CAAA;YAAA;SAAA;QAAA;QAAA;QAAA;YAAA;YAAA;gBAAAA,CAAA,EAAA,CAAA;YAAA;SAAA;QAAA;YAAA;YAAA;gBAAAA,CAAA,EAAA,CAAA;YAAA;SAAA;QAAA;YAAA;YAAA;gBAAAA,CAAA,EAAA,CAAA;YAAA;SAAA;QAAA;YAAA;YAAA;gBAAAA,CAAA,EAAA,CAAA;YAAA;SAAA;QAAA;YAAA;YAAA;gBAAAA,CAAA,EAAA,CAAA;YAAA;SAAA;QAAA;QAAA;YAAA;YAAA;gBAAAA,CAAA,EAAA,CAAA;YAAA;SAAA;QAAA;QAAA;KAAA;IAAAC,CAAA,EAAA;QAAA;YAAA;YAAA;gBAAAA,CAAA,EAAA;YAAA;SAAA;QAAA;YAAA;YAAA;gBAAAA,CAAA,EAAA;YAAA;SAAA;QAAA;YAAA;YAAA;gBAAAA,CAAA,EAAA;YAAA;SAAA;KAAA;IAAAC,CAAA,EAAA;QAAA;QAAA;QAAA;KAAA;IAAAC,CAAA,EAAA;QAAA;QAAA;QAAA;KAAA;AAAA,CA2GrB,CAAC;AAGS,6CAA6CE,KAAK,IAAG;IAC5D,aAAa;IACb,MAAMC,MAAM,GAAG/F,SAAS,CAAC,CAAC;IAC1B,MAAM,EAAEgG,QAAQ,EAAEC,UAAAA,EAAY,GAAGH,KAAK;IACtC,oDAAA;IACAA,KAAK,CAAC/F,IAAI,CAACmG,SAAS,OAAGxG,mBAAY,EAACI,2BAA2B,CAACC,IAAI,EAAEgG,MAAM,CAAChG,IAAI,EAAEiG,QAAQ,GAAGD,MAAM,CAACZ,YAAY,GAAGY,MAAM,CAAC/C,cAAc,EAAEiD,UAAU,KAAK,OAAO,IAAIF,MAAM,CAACX,KAAK,EAAE,CAACY,QAAQ,IAAIC,UAAU,KAAK,OAAO,IAAIF,MAAM,CAACR,eAAe,EAAEO,KAAK,CAAC/F,IAAI,CAACmG,SAAS,CAAC;IACvQ,OAAOJ,KAAK;AAChB,CAAC"}
1
+ {"version":3,"sources":["useCarouselNavButtonStyles.styles.js"],"sourcesContent":["'use client';\nimport { makeStyles, mergeClasses, shorthands } from '@griffel/react';\nimport { createCustomFocusIndicatorStyle } from '@fluentui/react-tabster';\nimport { tokens } from '@fluentui/react-theme';\nexport const carouselNavButtonClassNames = {\n root: 'fui-CarouselNavButton'\n};\n/**\n * Styles for the root slot\n */ const useStyles = makeStyles({\n root: {\n cursor: 'pointer',\n pointerEvents: 'all',\n width: tokens.spacingHorizontalS,\n height: tokens.spacingVerticalS,\n padding: `${tokens.spacingVerticalS} ${tokens.spacingHorizontalS}`,\n boxSizing: 'content-box',\n backgroundColor: tokens.colorTransparentBackground,\n ...shorthands.borderWidth(0),\n '::after': {\n content: '\"\"',\n display: 'block',\n boxSizing: 'border-box',\n borderRadius: '50%',\n border: 'none',\n height: tokens.spacingVerticalS,\n width: tokens.spacingHorizontalS,\n backgroundColor: tokens.colorNeutralForeground1,\n color: tokens.colorNeutralForeground1,\n '@media (forced-colors: active)': {\n // Bypass OS high contrast with inverted blend mode (otherwise icon is invisible)\n forcedColorAdjust: 'none',\n backgroundColor: 'white',\n mixBlendMode: 'difference'\n }\n }\n },\n rootUnselected: {\n outline: `${tokens.strokeWidthThin} solid transparent`,\n ...createCustomFocusIndicatorStyle({\n border: `${tokens.strokeWidthThick} solid ${tokens.colorStrokeFocus2}`,\n margin: `calc(-1 * ${tokens.strokeWidthThick})`,\n borderRadius: tokens.borderRadiusMedium\n }),\n '::after': {\n opacity: 0.6\n },\n ':hover': {\n '::after': {\n opacity: 0.75\n }\n },\n ':active': {\n '::after': {\n opacity: 1\n }\n }\n },\n rootSelected: {\n width: tokens.spacingHorizontalL,\n padding: `${tokens.spacingVerticalS} ${tokens.spacingHorizontalXS}`,\n outline: `${tokens.strokeWidthThin} solid transparent`,\n ...createCustomFocusIndicatorStyle({\n border: `${tokens.strokeWidthThick} solid ${tokens.colorStrokeFocus2}`,\n margin: `calc(-1 * ${tokens.strokeWidthThick})`,\n borderRadius: tokens.borderRadiusMedium\n }),\n '::after': {\n width: tokens.spacingHorizontalL,\n borderRadius: '4px'\n },\n ':hover': {\n '::after': {\n opacity: 0.75\n }\n },\n ':active': {\n '::after': {\n opacity: 0.65\n }\n }\n },\n brand: {\n '::after': {\n backgroundColor: tokens.colorCompoundBrandBackground,\n opacity: 1\n },\n ':hover': {\n '::after': {\n backgroundColor: tokens.colorCompoundBrandBackgroundHover,\n opacity: 1\n }\n },\n ':active': {\n '::after': {\n backgroundColor: tokens.colorCompoundBrandBackgroundPressed,\n opacity: 1\n }\n }\n },\n unselectedBrand: {\n '::after': {\n opacity: 0.6,\n backgroundColor: tokens.colorNeutralForeground1\n },\n ':hover': {\n '::after': {\n opacity: 0.75\n }\n },\n ':active': {\n '::after': {\n opacity: 1\n }\n }\n }\n});\n/**\n * Apply styling to the CarouselNavButton slots based on the state\n */ export const useCarouselNavButtonStyles_unstable = (state)=>{\n const styles = useStyles();\n const { selected, appearance } = state;\n // eslint-disable-next-line react-hooks/immutability\n state.root.className = mergeClasses(carouselNavButtonClassNames.root, styles.root, selected ? styles.rootSelected : styles.rootUnselected, appearance === 'brand' && styles.brand, !selected && appearance === 'brand' && styles.unselectedBrand, state.root.className);\n return state;\n};\n"],"names":["__styles","mergeClasses","shorthands","createCustomFocusIndicatorStyle","tokens","carouselNavButtonClassNames","root","useStyles","Bceei9c","Bkecrkj","a9b677","Bqenvij","Byoj8tv","uwmqm3","z189sj","z8tnut","B0ocmuz","B7ck84d","De3pzq","B4j52fo","Bekrc4i","Bn0qgzm","ibv6hh","Bsft5z2","ap17g6","li1rpt","d9w3h3","B3778ie","B4j8arr","Bl18szs","Blrzh8d","Bjuhk93","B1q35kw","Bw17bha","Bcgy8vk","Du69r6","Gp14am","vfts7","Bhxzhr1","G63luc","s924m2","Barhvk9","Ihftqj","wywymt","B0n5ga8","Bm2nyyq","xrcqlc","e1d83w","Dlnsje","a2br6o","Bjyk6c5","go7t6h","xdqbwx","Hwb57","umgawz","rootUnselected","Bw0xxkn","oeaueh","Bpd4iqm","Befb4lg","Byu6kyc","n8qw10","Bbjhlyh","i2cumq","Bunx835","Bdrgwmp","mqozju","lbo84a","Bksnhdo","Bci5o5g","u5e7qz","Bn40d3w","B7b6zxw","B8q5s1w","B5gfjzb","Bbcte9g","Bqz3imu","Bj9ihqo","Bl51kww","B3bvztg","Btyt4dx","Brhw1f9","Bw81rd7","kdpuga","dm238s","B6xbmo0","B3whbx2","Bp15pi3","Bay5ve9","Bni0232","rootSelected","brand","Glksuk","Blzl0y7","unselectedBrand","d","p","m","h","a","useCarouselNavButtonStyles_unstable","state","styles","selected","appearance","className"],"mappings":"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"}
@@ -134,7 +134,6 @@ const carouselNavButtonClassNames = {
134
134
  }
135
135
  });
136
136
  const useCarouselNavButtonStyles_unstable = (state)=>{
137
- 'use no memo';
138
137
  const styles = useStyles();
139
138
  const { selected, appearance } = state;
140
139
  // eslint-disable-next-line react-hooks/immutability