@frontify/fondue-components 29.0.1 → 29.2.0

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 (327) hide show
  1. package/dist/fondue-components.js +72 -70
  2. package/dist/fondue-components.js.map +1 -1
  3. package/dist/fondue-components10.js +176 -33
  4. package/dist/fondue-components10.js.map +1 -1
  5. package/dist/fondue-components100.js +8 -23
  6. package/dist/fondue-components100.js.map +1 -1
  7. package/dist/fondue-components101.js +11 -34
  8. package/dist/fondue-components101.js.map +1 -1
  9. package/dist/fondue-components102.js +10 -10
  10. package/dist/fondue-components103.js +6 -67
  11. package/dist/fondue-components103.js.map +1 -1
  12. package/dist/fondue-components104.js +12 -14
  13. package/dist/fondue-components104.js.map +1 -1
  14. package/dist/fondue-components105.js +22 -25
  15. package/dist/fondue-components105.js.map +1 -1
  16. package/dist/fondue-components106.js +34 -19
  17. package/dist/fondue-components106.js.map +1 -1
  18. package/dist/fondue-components107.js +10 -24
  19. package/dist/fondue-components107.js.map +1 -1
  20. package/dist/fondue-components108.js +67 -8
  21. package/dist/fondue-components108.js.map +1 -1
  22. package/dist/fondue-components109.js +14 -30
  23. package/dist/fondue-components109.js.map +1 -1
  24. package/dist/fondue-components11.js +35 -185
  25. package/dist/fondue-components11.js.map +1 -1
  26. package/dist/fondue-components110.js +23 -4
  27. package/dist/fondue-components110.js.map +1 -1
  28. package/dist/fondue-components111.js +17 -15
  29. package/dist/fondue-components111.js.map +1 -1
  30. package/dist/fondue-components112.js +25 -127
  31. package/dist/fondue-components112.js.map +1 -1
  32. package/dist/fondue-components113.js +9 -11
  33. package/dist/fondue-components113.js.map +1 -1
  34. package/dist/fondue-components114.js +33 -36
  35. package/dist/fondue-components114.js.map +1 -1
  36. package/dist/fondue-components115.js +7 -14
  37. package/dist/fondue-components115.js.map +1 -1
  38. package/dist/fondue-components116.js +4 -14
  39. package/dist/fondue-components116.js.map +1 -1
  40. package/dist/fondue-components117.js +5 -111
  41. package/dist/fondue-components117.js.map +1 -1
  42. package/dist/fondue-components118.js +16 -12
  43. package/dist/fondue-components118.js.map +1 -1
  44. package/dist/fondue-components119.js +14 -17
  45. package/dist/fondue-components119.js.map +1 -1
  46. package/dist/fondue-components12.js +185 -7
  47. package/dist/fondue-components12.js.map +1 -1
  48. package/dist/fondue-components120.js +16 -12
  49. package/dist/fondue-components120.js.map +1 -1
  50. package/dist/fondue-components121.js +107 -213
  51. package/dist/fondue-components121.js.map +1 -1
  52. package/dist/fondue-components122.js +10 -16
  53. package/dist/fondue-components122.js.map +1 -1
  54. package/dist/fondue-components123.js +16 -16
  55. package/dist/fondue-components123.js.map +1 -1
  56. package/dist/fondue-components124.js +12 -150
  57. package/dist/fondue-components124.js.map +1 -1
  58. package/dist/fondue-components125.js +32 -44
  59. package/dist/fondue-components125.js.map +1 -1
  60. package/dist/fondue-components126.js +6 -5
  61. package/dist/fondue-components126.js.map +1 -1
  62. package/dist/fondue-components127.js +127 -5
  63. package/dist/fondue-components127.js.map +1 -1
  64. package/dist/fondue-components128.js +11 -29
  65. package/dist/fondue-components128.js.map +1 -1
  66. package/dist/fondue-components129.js +39 -0
  67. package/dist/fondue-components129.js.map +1 -0
  68. package/dist/fondue-components13.js +8 -63
  69. package/dist/fondue-components13.js.map +1 -1
  70. package/dist/fondue-components130.js +216 -40
  71. package/dist/fondue-components130.js.map +1 -1
  72. package/dist/fondue-components131.js +19 -6
  73. package/dist/fondue-components131.js.map +1 -1
  74. package/dist/fondue-components132.js +16 -11
  75. package/dist/fondue-components132.js.map +1 -1
  76. package/dist/fondue-components133.js +150 -70
  77. package/dist/fondue-components133.js.map +1 -1
  78. package/dist/fondue-components134.js +44 -14
  79. package/dist/fondue-components134.js.map +1 -1
  80. package/dist/fondue-components135.js +170 -7
  81. package/dist/fondue-components135.js.map +1 -1
  82. package/dist/fondue-components136.js +57 -86
  83. package/dist/fondue-components136.js.map +1 -1
  84. package/dist/fondue-components137.js +9 -81
  85. package/dist/fondue-components137.js.map +1 -1
  86. package/dist/fondue-components138.js +254 -29
  87. package/dist/fondue-components138.js.map +1 -1
  88. package/dist/fondue-components14.js +61 -35
  89. package/dist/fondue-components14.js.map +1 -1
  90. package/dist/fondue-components140.js +40 -58
  91. package/dist/fondue-components140.js.map +1 -1
  92. package/dist/fondue-components141.js +41 -9
  93. package/dist/fondue-components141.js.map +1 -1
  94. package/dist/fondue-components142.js +6 -256
  95. package/dist/fondue-components142.js.map +1 -1
  96. package/dist/fondue-components143.js +11 -18
  97. package/dist/fondue-components143.js.map +1 -1
  98. package/dist/fondue-components144.js +68 -67
  99. package/dist/fondue-components144.js.map +1 -1
  100. package/dist/fondue-components145.js +14 -1351
  101. package/dist/fondue-components145.js.map +1 -1
  102. package/dist/fondue-components146.js +7 -941
  103. package/dist/fondue-components146.js.map +1 -1
  104. package/dist/fondue-components147.js +87 -196
  105. package/dist/fondue-components147.js.map +1 -1
  106. package/dist/fondue-components148.js +78 -18
  107. package/dist/fondue-components148.js.map +1 -1
  108. package/dist/fondue-components149.js +30 -39
  109. package/dist/fondue-components149.js.map +1 -1
  110. package/dist/fondue-components15.js +36 -121
  111. package/dist/fondue-components15.js.map +1 -1
  112. package/dist/fondue-components150.js +17 -66
  113. package/dist/fondue-components150.js.map +1 -1
  114. package/dist/fondue-components151.js +69 -30
  115. package/dist/fondue-components151.js.map +1 -1
  116. package/dist/fondue-components152.js +1352 -9
  117. package/dist/fondue-components152.js.map +1 -1
  118. package/dist/fondue-components153.js +939 -151
  119. package/dist/fondue-components153.js.map +1 -1
  120. package/dist/fondue-components154.js +197 -107
  121. package/dist/fondue-components154.js.map +1 -1
  122. package/dist/fondue-components155.js +22 -17
  123. package/dist/fondue-components155.js.map +1 -1
  124. package/dist/fondue-components156.js +39 -15
  125. package/dist/fondue-components156.js.map +1 -1
  126. package/dist/fondue-components157.js +68 -29
  127. package/dist/fondue-components157.js.map +1 -1
  128. package/dist/fondue-components158.js +31 -13
  129. package/dist/fondue-components158.js.map +1 -1
  130. package/dist/fondue-components159.js +9 -7
  131. package/dist/fondue-components159.js.map +1 -1
  132. package/dist/fondue-components16.js +121 -36
  133. package/dist/fondue-components16.js.map +1 -1
  134. package/dist/fondue-components160.js +156 -0
  135. package/dist/fondue-components160.js.map +1 -0
  136. package/dist/fondue-components161.js +111 -0
  137. package/dist/fondue-components161.js.map +1 -0
  138. package/dist/fondue-components162.js +19 -0
  139. package/dist/fondue-components162.js.map +1 -0
  140. package/dist/fondue-components163.js +32 -0
  141. package/dist/fondue-components163.js.map +1 -0
  142. package/dist/fondue-components164.js +16 -0
  143. package/dist/fondue-components164.js.map +1 -0
  144. package/dist/fondue-components165.js +10 -0
  145. package/dist/fondue-components165.js.map +1 -0
  146. package/dist/fondue-components166.js +19 -0
  147. package/dist/fondue-components166.js.map +1 -0
  148. package/dist/fondue-components17.js +30 -39
  149. package/dist/fondue-components17.js.map +1 -1
  150. package/dist/fondue-components18.js +44 -41
  151. package/dist/fondue-components18.js.map +1 -1
  152. package/dist/fondue-components19.js +42 -57
  153. package/dist/fondue-components19.js.map +1 -1
  154. package/dist/fondue-components20.js +55 -41
  155. package/dist/fondue-components20.js.map +1 -1
  156. package/dist/fondue-components21.js +39 -16
  157. package/dist/fondue-components21.js.map +1 -1
  158. package/dist/fondue-components22.js +17 -43
  159. package/dist/fondue-components22.js.map +1 -1
  160. package/dist/fondue-components23.js +46 -68
  161. package/dist/fondue-components23.js.map +1 -1
  162. package/dist/fondue-components24.js +67 -71
  163. package/dist/fondue-components24.js.map +1 -1
  164. package/dist/fondue-components25.js +72 -16
  165. package/dist/fondue-components25.js.map +1 -1
  166. package/dist/fondue-components26.js +18 -77
  167. package/dist/fondue-components26.js.map +1 -1
  168. package/dist/fondue-components27.js +75 -34
  169. package/dist/fondue-components27.js.map +1 -1
  170. package/dist/fondue-components28.js +34 -53
  171. package/dist/fondue-components28.js.map +1 -1
  172. package/dist/fondue-components29.js +55 -23
  173. package/dist/fondue-components29.js.map +1 -1
  174. package/dist/fondue-components3.js +1 -1
  175. package/dist/fondue-components30.js +23 -55
  176. package/dist/fondue-components30.js.map +1 -1
  177. package/dist/fondue-components31.js +52 -97
  178. package/dist/fondue-components31.js.map +1 -1
  179. package/dist/fondue-components32.js +98 -31
  180. package/dist/fondue-components32.js.map +1 -1
  181. package/dist/fondue-components33.js +31 -194
  182. package/dist/fondue-components33.js.map +1 -1
  183. package/dist/fondue-components34.js +184 -134
  184. package/dist/fondue-components34.js.map +1 -1
  185. package/dist/fondue-components35.js +143 -130
  186. package/dist/fondue-components35.js.map +1 -1
  187. package/dist/fondue-components36.js +131 -30
  188. package/dist/fondue-components36.js.map +1 -1
  189. package/dist/fondue-components37.js +29 -79
  190. package/dist/fondue-components37.js.map +1 -1
  191. package/dist/fondue-components38.js +68 -110
  192. package/dist/fondue-components38.js.map +1 -1
  193. package/dist/fondue-components39.js +121 -34
  194. package/dist/fondue-components39.js.map +1 -1
  195. package/dist/fondue-components4.js +21 -19
  196. package/dist/fondue-components4.js.map +1 -1
  197. package/dist/fondue-components40.js +36 -56
  198. package/dist/fondue-components40.js.map +1 -1
  199. package/dist/fondue-components41.js +56 -20
  200. package/dist/fondue-components41.js.map +1 -1
  201. package/dist/fondue-components42.js +20 -25
  202. package/dist/fondue-components42.js.map +1 -1
  203. package/dist/fondue-components43.js +25 -7
  204. package/dist/fondue-components43.js.map +1 -1
  205. package/dist/fondue-components44.js +7 -8
  206. package/dist/fondue-components44.js.map +1 -1
  207. package/dist/fondue-components45.js +9 -41
  208. package/dist/fondue-components45.js.map +1 -1
  209. package/dist/fondue-components46.js +41 -5
  210. package/dist/fondue-components46.js.map +1 -1
  211. package/dist/fondue-components47.js +1 -1
  212. package/dist/fondue-components48.js +3 -11
  213. package/dist/fondue-components48.js.map +1 -1
  214. package/dist/fondue-components49.js +25 -29
  215. package/dist/fondue-components49.js.map +1 -1
  216. package/dist/fondue-components5.js +2 -2
  217. package/dist/fondue-components50.js +33 -54
  218. package/dist/fondue-components50.js.map +1 -1
  219. package/dist/fondue-components51.js +20 -130
  220. package/dist/fondue-components51.js.map +1 -1
  221. package/dist/fondue-components52.js +85 -20
  222. package/dist/fondue-components52.js.map +1 -1
  223. package/dist/fondue-components53.js +13 -53
  224. package/dist/fondue-components53.js.map +1 -1
  225. package/dist/fondue-components54.js +32 -8
  226. package/dist/fondue-components54.js.map +1 -1
  227. package/dist/fondue-components55.js +54 -13
  228. package/dist/fondue-components55.js.map +1 -1
  229. package/dist/fondue-components56.js +130 -16
  230. package/dist/fondue-components56.js.map +1 -1
  231. package/dist/fondue-components57.js +20 -4
  232. package/dist/fondue-components57.js.map +1 -1
  233. package/dist/fondue-components58.js +52 -17
  234. package/dist/fondue-components58.js.map +1 -1
  235. package/dist/fondue-components59.js +7 -18
  236. package/dist/fondue-components59.js.map +1 -1
  237. package/dist/fondue-components6.js +1 -1
  238. package/dist/fondue-components60.js +13 -44
  239. package/dist/fondue-components60.js.map +1 -1
  240. package/dist/fondue-components61.js +16 -24
  241. package/dist/fondue-components61.js.map +1 -1
  242. package/dist/fondue-components62.js +4 -22
  243. package/dist/fondue-components62.js.map +1 -1
  244. package/dist/fondue-components63.js +18 -7
  245. package/dist/fondue-components63.js.map +1 -1
  246. package/dist/fondue-components64.js +18 -4
  247. package/dist/fondue-components64.js.map +1 -1
  248. package/dist/fondue-components65.js +43 -12
  249. package/dist/fondue-components65.js.map +1 -1
  250. package/dist/fondue-components66.js +24 -4
  251. package/dist/fondue-components66.js.map +1 -1
  252. package/dist/fondue-components67.js +22 -17
  253. package/dist/fondue-components67.js.map +1 -1
  254. package/dist/fondue-components68.js +4 -8
  255. package/dist/fondue-components68.js.map +1 -1
  256. package/dist/fondue-components69.js +4 -36
  257. package/dist/fondue-components69.js.map +1 -1
  258. package/dist/fondue-components7.js +32 -65
  259. package/dist/fondue-components7.js.map +1 -1
  260. package/dist/fondue-components70.js +12 -6
  261. package/dist/fondue-components70.js.map +1 -1
  262. package/dist/fondue-components71.js +1 -1
  263. package/dist/fondue-components72.js +17 -12
  264. package/dist/fondue-components72.js.map +1 -1
  265. package/dist/fondue-components73.js +10 -51
  266. package/dist/fondue-components73.js.map +1 -1
  267. package/dist/fondue-components74.js +37 -44
  268. package/dist/fondue-components74.js.map +1 -1
  269. package/dist/fondue-components75.js +7 -6
  270. package/dist/fondue-components75.js.map +1 -1
  271. package/dist/fondue-components76.js +5 -6
  272. package/dist/fondue-components76.js.map +1 -1
  273. package/dist/fondue-components77.js +13 -13
  274. package/dist/fondue-components77.js.map +1 -1
  275. package/dist/fondue-components78.js +51 -27
  276. package/dist/fondue-components78.js.map +1 -1
  277. package/dist/fondue-components79.js +42 -11
  278. package/dist/fondue-components79.js.map +1 -1
  279. package/dist/fondue-components8.js +65 -51
  280. package/dist/fondue-components8.js.map +1 -1
  281. package/dist/fondue-components80.js +6 -5
  282. package/dist/fondue-components80.js.map +1 -1
  283. package/dist/fondue-components81.js +6 -13
  284. package/dist/fondue-components81.js.map +1 -1
  285. package/dist/fondue-components82.js +13 -48
  286. package/dist/fondue-components82.js.map +1 -1
  287. package/dist/fondue-components83.js +27 -22
  288. package/dist/fondue-components83.js.map +1 -1
  289. package/dist/fondue-components84.js +13 -629
  290. package/dist/fondue-components84.js.map +1 -1
  291. package/dist/fondue-components85.js +4 -8
  292. package/dist/fondue-components85.js.map +1 -1
  293. package/dist/fondue-components86.js +12 -12
  294. package/dist/fondue-components86.js.map +1 -1
  295. package/dist/fondue-components87.js +47 -4
  296. package/dist/fondue-components87.js.map +1 -1
  297. package/dist/fondue-components88.js +22 -24
  298. package/dist/fondue-components88.js.map +1 -1
  299. package/dist/fondue-components89.js +628 -16
  300. package/dist/fondue-components89.js.map +1 -1
  301. package/dist/fondue-components9.js +46 -173
  302. package/dist/fondue-components9.js.map +1 -1
  303. package/dist/fondue-components90.js +9 -20
  304. package/dist/fondue-components90.js.map +1 -1
  305. package/dist/fondue-components91.js +13 -20
  306. package/dist/fondue-components91.js.map +1 -1
  307. package/dist/fondue-components92.js +5 -20
  308. package/dist/fondue-components92.js.map +1 -1
  309. package/dist/fondue-components93.js +24 -19
  310. package/dist/fondue-components93.js.map +1 -1
  311. package/dist/fondue-components94.js +17 -19
  312. package/dist/fondue-components94.js.map +1 -1
  313. package/dist/fondue-components95.js +20 -8
  314. package/dist/fondue-components95.js.map +1 -1
  315. package/dist/fondue-components96.js +20 -11
  316. package/dist/fondue-components96.js.map +1 -1
  317. package/dist/fondue-components97.js +20 -11
  318. package/dist/fondue-components97.js.map +1 -1
  319. package/dist/fondue-components98.js +20 -7
  320. package/dist/fondue-components98.js.map +1 -1
  321. package/dist/fondue-components99.js +19 -13
  322. package/dist/fondue-components99.js.map +1 -1
  323. package/dist/index.d.ts +184 -18
  324. package/dist/style.css +1 -1
  325. package/package.json +6 -2
  326. package/dist/fondue-components139.js +0 -173
  327. package/dist/fondue-components139.js.map +0 -1
@@ -1 +1 @@
1
- {"version":3,"file":"fondue-components30.js","sources":["../src/components/Slider/Slider.tsx"],"sourcesContent":["/* (c) Copyright Frontify Ltd., all rights reserved. */\n\nimport * as RadixSlider from '@radix-ui/react-slider';\nimport { type ForwardedRef, forwardRef, useRef } from 'react';\n\nimport { type CommonAriaAttrs } from '#/utilities/types';\n\nimport styles from './styles/slider.module.scss';\n\nexport type SliderProps = {\n id?: string;\n name?: string;\n /**\n * The default value of the slider\n * Used for uncontrolled components\n * @default [0]\n */\n defaultValue?: number[];\n /**\n * The controlled value of the slider\n * @default [0]\n */\n value?: number[];\n /**\n * Minimum value of the slider\n * @default 0\n */\n min?: number;\n /**\n * Maximum value of the slider\n * @default 100\n */\n max?: number;\n /**\n * The granularity with which the slider can step through values\n * @default 1\n */\n step?: number;\n /**\n * The minimum steps between thumbs in a range slider\n * @default 0\n */\n minStepsBetweenThumbs?: number;\n /**\n * Disable the slider\n * @default false\n */\n disabled?: boolean;\n onChange?: (value: number[]) => void;\n onCommit?: (value: number[]) => void;\n 'data-test-id'?: string;\n} & CommonAriaAttrs;\n\nconst SliderComponent = (\n {\n value,\n defaultValue = [0],\n onChange,\n onCommit,\n 'data-test-id': dataTestId = 'fondue-slider',\n ...props\n }: SliderProps,\n ref: ForwardedRef<HTMLButtonElement>,\n) => {\n const sliderThumbRef = useRef<HTMLSpanElement | null>(null);\n return (\n <RadixSlider.Root\n ref={ref}\n className={styles.root}\n value={value}\n defaultValue={defaultValue}\n onValueChange={onChange}\n onValueCommit={onCommit}\n data-test-id={dataTestId}\n {...props}\n >\n <RadixSlider.Track\n onPointerDown={() => {\n if (sliderThumbRef.current) {\n sliderThumbRef.current.dataset.showFocusRing = 'false';\n }\n }}\n className={styles.track}\n >\n <RadixSlider.Range className={styles.range} />\n </RadixSlider.Track>\n {(value || defaultValue).map((_, index) => (\n <RadixSlider.Thumb\n ref={sliderThumbRef}\n className={styles.thumb}\n onPointerDown={(event) => {\n event.currentTarget.dataset.showFocusRing = 'false';\n }}\n onBlur={(event) => {\n event.currentTarget.dataset.showFocusRing = 'true';\n }}\n key={index}\n />\n ))}\n </RadixSlider.Root>\n );\n};\n\nexport const Slider = forwardRef<HTMLButtonElement, SliderProps>(SliderComponent);\nSlider.displayName = 'Slider';\n"],"names":["SliderComponent","value","defaultValue","onChange","onCommit","dataTestId","props","ref","sliderThumbRef","useRef","jsxs","RadixSlider","styles","jsx","_","index","event","Slider","forwardRef"],"mappings":";;;;AAqDA,MAAMA,IAAkB,CACpB;AAAA,EACI,OAAAC;AAAA,EACA,cAAAC,IAAe,CAAC,CAAC;AAAA,EACjB,UAAAC;AAAA,EACA,UAAAC;AAAA,EACA,gBAAgBC,IAAa;AAAA,EAC7B,GAAGC;AACP,GACAC,MACC;AACD,QAAMC,IAAiBC,EAA+B,IAAI;AAC1D,SACI,gBAAAC;AAAA,IAACC,EAAY;AAAA,IAAZ;AAAA,MACG,KAAAJ;AAAA,MACA,WAAWK,EAAO;AAAA,MAClB,OAAAX;AAAA,MACA,cAAAC;AAAA,MACA,eAAeC;AAAA,MACf,eAAeC;AAAA,MACf,gBAAcC;AAAA,MACb,GAAGC;AAAA,MAEJ,UAAA;AAAA,QAAA,gBAAAO;AAAA,UAACF,EAAY;AAAA,UAAZ;AAAA,YACG,eAAe,MAAM;AACjB,cAAIH,EAAe,YACfA,EAAe,QAAQ,QAAQ,gBAAgB;AAAA,YAEvD;AAAA,YACA,WAAWI,EAAO;AAAA,YAElB,4BAACD,EAAY,OAAZ,EAAkB,WAAWC,EAAO,MAAA,CAAO;AAAA,UAAA;AAAA,QAAA;AAAA,SAE9CX,KAASC,GAAc,IAAI,CAACY,GAAGC,MAC7B,gBAAAF;AAAA,UAACF,EAAY;AAAA,UAAZ;AAAA,YACG,KAAKH;AAAA,YACL,WAAWI,EAAO;AAAA,YAClB,eAAe,CAACI,MAAU;AACtB,cAAAA,EAAM,cAAc,QAAQ,gBAAgB;AAAA,YAChD;AAAA,YACA,QAAQ,CAACA,MAAU;AACf,cAAAA,EAAM,cAAc,QAAQ,gBAAgB;AAAA,YAChD;AAAA,UAAA;AAAA,UACKD;AAAA,QAAA,CAEZ;AAAA,MAAA;AAAA,IAAA;AAAA,EAAA;AAGb,GAEaE,IAASC,EAA2ClB,CAAe;AAChFiB,EAAO,cAAc;"}
1
+ {"version":3,"file":"fondue-components30.js","sources":["../src/components/Select/index.ts"],"sourcesContent":["/* (c) Copyright Frontify Ltd., all rights reserved. */\n\nimport { ComboboxMultiple } from './ComboboxMultiple';\nimport { ComboboxSingle } from './ComboboxSingle';\nimport { SelectMultiple } from './SelectMultiple';\nimport { SelectSingle } from './SelectSingle';\nimport { ForwardedRefSelectItem, ForwardedRefSelectItemGroup } from './components/SelectItem';\nimport { ForwardedRefSelectSlot } from './components/SelectSlot';\n\ntype ComboboxComponent = typeof ComboboxSingle & {\n Multiple: typeof ComboboxMultiple;\n};\n\n// @ts-expect-error We support both Select and Select.Combobox as the Root\nconst Combobox: ComboboxComponent = ComboboxSingle;\nCombobox.Multiple = ComboboxMultiple;\n\n// @ts-expect-error We support both Select and Select.Combobox as the Root\nexport const Select: typeof SelectSingle & {\n Multiple: typeof SelectMultiple;\n Combobox: ComboboxComponent;\n Item: typeof ForwardedRefSelectItem;\n Group: typeof ForwardedRefSelectItemGroup;\n Slot: typeof ForwardedRefSelectSlot;\n} = SelectSingle;\n\nSelect.displayName = 'Select';\nSelect.Multiple = SelectMultiple;\nSelect.Multiple.displayName = 'Select.Multiple';\nSelect.Combobox = Combobox;\nSelect.Combobox.displayName = 'Select.Combobox';\nSelect.Combobox.Multiple = ComboboxMultiple;\nSelect.Combobox.Multiple.displayName = 'Select.Combobox.Multiple';\nSelect.Item = ForwardedRefSelectItem;\nSelect.Item.displayName = 'Select.Item';\nSelect.Group = ForwardedRefSelectItemGroup;\nSelect.Group.displayName = 'Select.Group';\nSelect.Slot = ForwardedRefSelectSlot;\nSelect.Slot.displayName = 'Select.Slot';\n"],"names":["Combobox","ComboboxSingle","ComboboxMultiple","Select","SelectSingle","SelectMultiple","ForwardedRefSelectItem","ForwardedRefSelectItemGroup","ForwardedRefSelectSlot"],"mappings":";;;;;;AAcA,MAAMA,IAA8BC;AACpCD,EAAS,WAAWE;AAGb,MAAMC,IAMTC;AAEJD,EAAO,cAAc;AACrBA,EAAO,WAAWE;AAClBF,EAAO,SAAS,cAAc;AAC9BA,EAAO,WAAWH;AAClBG,EAAO,SAAS,cAAc;AAC9BA,EAAO,SAAS,WAAWD;AAC3BC,EAAO,SAAS,SAAS,cAAc;AACvCA,EAAO,OAAOG;AACdH,EAAO,KAAK,cAAc;AAC1BA,EAAO,QAAQI;AACfJ,EAAO,MAAM,cAAc;AAC3BA,EAAO,OAAOK;AACdL,EAAO,KAAK,cAAc;"}
@@ -1,103 +1,58 @@
1
- import { jsx as s } from "react/jsx-runtime";
2
- import { forwardRef as c } from "react";
3
- import d from "./fondue-components97.js";
4
- const b = c(
5
- ({
6
- "aria-label": t,
7
- "data-test-id": a = "split-button",
8
- children: o,
9
- disabled: i = !1,
10
- emphasis: e = "default",
11
- size: n = "medium"
12
- }, l) => /* @__PURE__ */ s(
13
- "div",
1
+ import { jsxs as f, jsx as s } from "react/jsx-runtime";
2
+ import * as e from "@radix-ui/react-slider";
3
+ import { forwardRef as h, useRef as R } from "react";
4
+ import r from "./fondue-components101.js";
5
+ const g = ({
6
+ value: a,
7
+ defaultValue: n = [0],
8
+ onChange: i,
9
+ onCommit: m,
10
+ "data-test-id": c = "fondue-slider",
11
+ ...d
12
+ }, l) => {
13
+ const o = R(null);
14
+ return /* @__PURE__ */ f(
15
+ e.Root,
14
16
  {
15
17
  ref: l,
16
- role: "group",
17
- "aria-label": t,
18
- "data-test-id": a,
19
- "data-component": "split-button",
20
- "data-emphasis": e,
21
- "data-size": n,
22
- "data-disabled": i,
23
- className: d.root,
24
- children: o
18
+ className: r.root,
19
+ value: a,
20
+ defaultValue: n,
21
+ onValueChange: i,
22
+ onValueCommit: m,
23
+ "data-test-id": c,
24
+ ...d,
25
+ children: [
26
+ /* @__PURE__ */ s(
27
+ e.Track,
28
+ {
29
+ onPointerDown: () => {
30
+ o.current && (o.current.dataset.showFocusRing = "false");
31
+ },
32
+ className: r.track,
33
+ children: /* @__PURE__ */ s(e.Range, { className: r.range })
34
+ }
35
+ ),
36
+ (a || n).map((w, u) => /* @__PURE__ */ s(
37
+ e.Thumb,
38
+ {
39
+ ref: o,
40
+ className: r.thumb,
41
+ onPointerDown: (t) => {
42
+ t.currentTarget.dataset.showFocusRing = "false";
43
+ },
44
+ onBlur: (t) => {
45
+ t.currentTarget.dataset.showFocusRing = "true";
46
+ }
47
+ },
48
+ u
49
+ ))
50
+ ]
25
51
  }
26
- )
27
- );
28
- b.displayName = "SplitButton.Root";
29
- const p = c(
30
- ({
31
- "aria-label": t,
32
- "aria-describedby": a,
33
- "data-test-id": o = "split-button-content",
34
- children: i,
35
- disabled: e = !1,
36
- onPress: n,
37
- title: l,
38
- type: r = "button"
39
- }, u) => /* @__PURE__ */ s(
40
- "button",
41
- {
42
- ref: u,
43
- type: r,
44
- disabled: e,
45
- "aria-label": t,
46
- "aria-describedby": a,
47
- title: l,
48
- "data-test-id": o,
49
- className: d.content,
50
- onClick: n,
51
- children: i
52
- }
53
- )
54
- );
55
- p.displayName = "SplitButton.Content";
56
- const m = ({
57
- "aria-label": t,
58
- "data-test-id": a = "split-button-action",
59
- rotateIcon: o = !0,
60
- children: i
61
- }) => /* @__PURE__ */ s("div", { "aria-label": t, "data-test-id": a, "data-rotate-icon": o, className: d.action, children: i });
62
- m.displayName = "SplitButton.Action";
63
- const B = c(
64
- ({
65
- "aria-label": t,
66
- "aria-describedby": a,
67
- "data-test-id": o = "split-button-action-button",
68
- children: i,
69
- disabled: e = !1,
70
- title: n,
71
- type: l = "button",
72
- ...r
73
- }, u) => /* @__PURE__ */ s(
74
- "button",
75
- {
76
- ref: u,
77
- type: l,
78
- disabled: e,
79
- "aria-label": t,
80
- "aria-describedby": a,
81
- title: n,
82
- "data-test-id": o,
83
- className: d.actionButton,
84
- ...r,
85
- children: i
86
- }
87
- )
88
- );
89
- B.displayName = "SplitButton.ActionButton";
90
- const N = {
91
- Root: b,
92
- Content: p,
93
- Action: m,
94
- ActionButton: B
95
- };
52
+ );
53
+ }, p = h(g);
54
+ p.displayName = "Slider";
96
55
  export {
97
- N as SplitButton,
98
- m as SplitButtonAction,
99
- B as SplitButtonActionButton,
100
- p as SplitButtonContent,
101
- b as SplitButtonRoot
56
+ p as Slider
102
57
  };
103
58
  //# sourceMappingURL=fondue-components31.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"fondue-components31.js","sources":["../src/components/SplitButton/SplitButton.tsx"],"sourcesContent":["/* (c) Copyright Frontify Ltd., all rights reserved. */\n\nimport { forwardRef, type ForwardedRef, type MouseEvent, type ReactNode } from 'react';\n\nimport styles from './styles/splitButton.module.scss';\n\ntype ButtonSize = 'small' | 'medium' | 'large';\n\ntype ButtonEmphasis = 'default' | 'weak' | 'strong';\n\nexport type SplitButtonProps = {\n /**\n * @default 'default'\n */\n emphasis?: ButtonEmphasis;\n /**\n * @default 'medium'\n */\n size?: ButtonSize;\n /**\n * @default false\n */\n disabled?: boolean;\n /**\n * Accessible label for the button group\n */\n 'aria-label'?: string;\n /**\n * Test ID for the root element\n */\n 'data-test-id'?: string;\n children: ReactNode;\n};\n\nexport type SplitButtonContentProps = {\n /**\n * Button type\n * @default 'button'\n */\n type?: 'button' | 'submit' | 'reset';\n /**\n * Whether the button is disabled\n * @default false\n */\n disabled?: boolean;\n /**\n * Click handler\n */\n onPress?: (event?: MouseEvent<HTMLButtonElement>) => void;\n /**\n * Accessible label\n */\n 'aria-label'?: string;\n /**\n * Accessible description\n */\n 'aria-describedby'?: string;\n /**\n * Test ID for the content section\n */\n 'data-test-id'?: string;\n /**\n * Button title\n */\n title?: string;\n children: ReactNode;\n};\n\nexport type SplitButtonActionProps = {\n /**\n * Accessible label\n */\n 'aria-label'?: string;\n /**\n * Test ID for the action slot\n */\n 'data-test-id'?: string;\n /**\n * Whether to rotate the icon 180 degrees when active (typically for caret icons)\n * @default true\n */\n rotateIcon?: boolean;\n children: ReactNode;\n};\n\nexport type SplitButtonActionButtonProps = {\n /**\n * Button type\n * @default 'button'\n */\n type?: 'button' | 'submit' | 'reset';\n /**\n * Whether the button is disabled\n * @default false\n */\n disabled?: boolean;\n /**\n * Accessible label\n */\n 'aria-label'?: string;\n /**\n * Accessible description\n */\n 'aria-describedby'?: string;\n /**\n * Test ID for the action button\n */\n 'data-test-id'?: string;\n /**\n * Button title\n */\n title?: string;\n children: ReactNode;\n};\n\nexport const SplitButtonRoot = forwardRef<HTMLDivElement, SplitButtonProps>(\n (\n {\n 'aria-label': ariaLabel,\n 'data-test-id': dataTestId = 'split-button',\n children,\n disabled = false,\n emphasis = 'default',\n size = 'medium',\n }: SplitButtonProps,\n ref: ForwardedRef<HTMLDivElement>,\n ) => {\n return (\n <div\n ref={ref}\n role=\"group\"\n aria-label={ariaLabel}\n data-test-id={dataTestId}\n data-component=\"split-button\"\n data-emphasis={emphasis}\n data-size={size}\n data-disabled={disabled}\n className={styles.root}\n >\n {children}\n </div>\n );\n },\n);\nSplitButtonRoot.displayName = 'SplitButton.Root';\n\nexport const SplitButtonContent = forwardRef<HTMLButtonElement, SplitButtonContentProps>(\n (\n {\n 'aria-label': ariaLabel,\n 'aria-describedby': ariaDescribedby,\n 'data-test-id': dataTestId = 'split-button-content',\n children,\n disabled = false,\n onPress,\n title,\n type = 'button',\n }: SplitButtonContentProps,\n ref: ForwardedRef<HTMLButtonElement>,\n ) => {\n return (\n <button\n ref={ref}\n type={type}\n disabled={disabled}\n aria-label={ariaLabel}\n aria-describedby={ariaDescribedby}\n title={title}\n data-test-id={dataTestId}\n className={styles.content}\n onClick={onPress}\n >\n {children}\n </button>\n );\n },\n);\nSplitButtonContent.displayName = 'SplitButton.Content';\n\nexport const SplitButtonAction = ({\n 'aria-label': ariaLabel,\n 'data-test-id': dataTestId = 'split-button-action',\n rotateIcon = true,\n children,\n}: SplitButtonActionProps) => {\n return (\n <div aria-label={ariaLabel} data-test-id={dataTestId} data-rotate-icon={rotateIcon} className={styles.action}>\n {children}\n </div>\n );\n};\nSplitButtonAction.displayName = 'SplitButton.Action';\n\nexport const SplitButtonActionButton = forwardRef<HTMLButtonElement, SplitButtonActionButtonProps>(\n (\n {\n 'aria-label': ariaLabel,\n 'aria-describedby': ariaDescribedby,\n 'data-test-id': dataTestId = 'split-button-action-button',\n children,\n disabled = false,\n title,\n type = 'button',\n ...props\n },\n ref,\n ) => {\n return (\n <button\n ref={ref}\n type={type}\n disabled={disabled}\n aria-label={ariaLabel}\n aria-describedby={ariaDescribedby}\n title={title}\n data-test-id={dataTestId}\n className={styles.actionButton}\n {...props}\n >\n {children}\n </button>\n );\n },\n);\nSplitButtonActionButton.displayName = 'SplitButton.ActionButton';\n\nexport const SplitButton = {\n Root: SplitButtonRoot,\n Content: SplitButtonContent,\n Action: SplitButtonAction,\n ActionButton: SplitButtonActionButton,\n};\n"],"names":["SplitButtonRoot","forwardRef","ariaLabel","dataTestId","children","disabled","emphasis","size","ref","jsx","styles","SplitButtonContent","ariaDescribedby","onPress","title","type","SplitButtonAction","rotateIcon","SplitButtonActionButton","props","SplitButton"],"mappings":";;;AAmHO,MAAMA,IAAkBC;AAAA,EAC3B,CACI;AAAA,IACI,cAAcC;AAAA,IACd,gBAAgBC,IAAa;AAAA,IAC7B,UAAAC;AAAA,IACA,UAAAC,IAAW;AAAA,IACX,UAAAC,IAAW;AAAA,IACX,MAAAC,IAAO;AAAA,EAAA,GAEXC,MAGI,gBAAAC;AAAA,IAAC;AAAA,IAAA;AAAA,MACG,KAAAD;AAAA,MACA,MAAK;AAAA,MACL,cAAYN;AAAA,MACZ,gBAAcC;AAAA,MACd,kBAAe;AAAA,MACf,iBAAeG;AAAA,MACf,aAAWC;AAAA,MACX,iBAAeF;AAAA,MACf,WAAWK,EAAO;AAAA,MAEjB,UAAAN;AAAA,IAAA;AAAA,EAAA;AAIjB;AACAJ,EAAgB,cAAc;AAEvB,MAAMW,IAAqBV;AAAA,EAC9B,CACI;AAAA,IACI,cAAcC;AAAA,IACd,oBAAoBU;AAAA,IACpB,gBAAgBT,IAAa;AAAA,IAC7B,UAAAC;AAAA,IACA,UAAAC,IAAW;AAAA,IACX,SAAAQ;AAAA,IACA,OAAAC;AAAA,IACA,MAAAC,IAAO;AAAA,EAAA,GAEXP,MAGI,gBAAAC;AAAA,IAAC;AAAA,IAAA;AAAA,MACG,KAAAD;AAAA,MACA,MAAAO;AAAA,MACA,UAAAV;AAAA,MACA,cAAYH;AAAA,MACZ,oBAAkBU;AAAA,MAClB,OAAAE;AAAA,MACA,gBAAcX;AAAA,MACd,WAAWO,EAAO;AAAA,MAClB,SAASG;AAAA,MAER,UAAAT;AAAA,IAAA;AAAA,EAAA;AAIjB;AACAO,EAAmB,cAAc;AAE1B,MAAMK,IAAoB,CAAC;AAAA,EAC9B,cAAcd;AAAA,EACd,gBAAgBC,IAAa;AAAA,EAC7B,YAAAc,IAAa;AAAA,EACb,UAAAb;AACJ,MAEQ,gBAAAK,EAAC,OAAA,EAAI,cAAYP,GAAW,gBAAcC,GAAY,oBAAkBc,GAAY,WAAWP,EAAO,QACjG,UAAAN,EAAA,CACL;AAGRY,EAAkB,cAAc;AAEzB,MAAME,IAA0BjB;AAAA,EACnC,CACI;AAAA,IACI,cAAcC;AAAA,IACd,oBAAoBU;AAAA,IACpB,gBAAgBT,IAAa;AAAA,IAC7B,UAAAC;AAAA,IACA,UAAAC,IAAW;AAAA,IACX,OAAAS;AAAA,IACA,MAAAC,IAAO;AAAA,IACP,GAAGI;AAAA,EAAA,GAEPX,MAGI,gBAAAC;AAAA,IAAC;AAAA,IAAA;AAAA,MACG,KAAAD;AAAA,MACA,MAAAO;AAAA,MACA,UAAAV;AAAA,MACA,cAAYH;AAAA,MACZ,oBAAkBU;AAAA,MAClB,OAAAE;AAAA,MACA,gBAAcX;AAAA,MACd,WAAWO,EAAO;AAAA,MACjB,GAAGS;AAAA,MAEH,UAAAf;AAAA,IAAA;AAAA,EAAA;AAIjB;AACAc,EAAwB,cAAc;AAE/B,MAAME,IAAc;AAAA,EACvB,MAAMpB;AAAA,EACN,SAASW;AAAA,EACT,QAAQK;AAAA,EACR,cAAcE;AAClB;"}
1
+ {"version":3,"file":"fondue-components31.js","sources":["../src/components/Slider/Slider.tsx"],"sourcesContent":["/* (c) Copyright Frontify Ltd., all rights reserved. */\n\nimport * as RadixSlider from '@radix-ui/react-slider';\nimport { type ForwardedRef, forwardRef, useRef } from 'react';\n\nimport { type CommonAriaAttrs } from '#/utilities/types';\n\nimport styles from './styles/slider.module.scss';\n\nexport type SliderProps = {\n id?: string;\n name?: string;\n /**\n * The default value of the slider\n * Used for uncontrolled components\n * @default [0]\n */\n defaultValue?: number[];\n /**\n * The controlled value of the slider\n * @default [0]\n */\n value?: number[];\n /**\n * Minimum value of the slider\n * @default 0\n */\n min?: number;\n /**\n * Maximum value of the slider\n * @default 100\n */\n max?: number;\n /**\n * The granularity with which the slider can step through values\n * @default 1\n */\n step?: number;\n /**\n * The minimum steps between thumbs in a range slider\n * @default 0\n */\n minStepsBetweenThumbs?: number;\n /**\n * Disable the slider\n * @default false\n */\n disabled?: boolean;\n onChange?: (value: number[]) => void;\n onCommit?: (value: number[]) => void;\n 'data-test-id'?: string;\n} & CommonAriaAttrs;\n\nconst SliderComponent = (\n {\n value,\n defaultValue = [0],\n onChange,\n onCommit,\n 'data-test-id': dataTestId = 'fondue-slider',\n ...props\n }: SliderProps,\n ref: ForwardedRef<HTMLButtonElement>,\n) => {\n const sliderThumbRef = useRef<HTMLSpanElement | null>(null);\n return (\n <RadixSlider.Root\n ref={ref}\n className={styles.root}\n value={value}\n defaultValue={defaultValue}\n onValueChange={onChange}\n onValueCommit={onCommit}\n data-test-id={dataTestId}\n {...props}\n >\n <RadixSlider.Track\n onPointerDown={() => {\n if (sliderThumbRef.current) {\n sliderThumbRef.current.dataset.showFocusRing = 'false';\n }\n }}\n className={styles.track}\n >\n <RadixSlider.Range className={styles.range} />\n </RadixSlider.Track>\n {(value || defaultValue).map((_, index) => (\n <RadixSlider.Thumb\n ref={sliderThumbRef}\n className={styles.thumb}\n onPointerDown={(event) => {\n event.currentTarget.dataset.showFocusRing = 'false';\n }}\n onBlur={(event) => {\n event.currentTarget.dataset.showFocusRing = 'true';\n }}\n key={index}\n />\n ))}\n </RadixSlider.Root>\n );\n};\n\nexport const Slider = forwardRef<HTMLButtonElement, SliderProps>(SliderComponent);\nSlider.displayName = 'Slider';\n"],"names":["SliderComponent","value","defaultValue","onChange","onCommit","dataTestId","props","ref","sliderThumbRef","useRef","jsxs","RadixSlider","styles","jsx","_","index","event","Slider","forwardRef"],"mappings":";;;;AAqDA,MAAMA,IAAkB,CACpB;AAAA,EACI,OAAAC;AAAA,EACA,cAAAC,IAAe,CAAC,CAAC;AAAA,EACjB,UAAAC;AAAA,EACA,UAAAC;AAAA,EACA,gBAAgBC,IAAa;AAAA,EAC7B,GAAGC;AACP,GACAC,MACC;AACD,QAAMC,IAAiBC,EAA+B,IAAI;AAC1D,SACI,gBAAAC;AAAA,IAACC,EAAY;AAAA,IAAZ;AAAA,MACG,KAAAJ;AAAA,MACA,WAAWK,EAAO;AAAA,MAClB,OAAAX;AAAA,MACA,cAAAC;AAAA,MACA,eAAeC;AAAA,MACf,eAAeC;AAAA,MACf,gBAAcC;AAAA,MACb,GAAGC;AAAA,MAEJ,UAAA;AAAA,QAAA,gBAAAO;AAAA,UAACF,EAAY;AAAA,UAAZ;AAAA,YACG,eAAe,MAAM;AACjB,cAAIH,EAAe,YACfA,EAAe,QAAQ,QAAQ,gBAAgB;AAAA,YAEvD;AAAA,YACA,WAAWI,EAAO;AAAA,YAElB,4BAACD,EAAY,OAAZ,EAAkB,WAAWC,EAAO,MAAA,CAAO;AAAA,UAAA;AAAA,QAAA;AAAA,SAE9CX,KAASC,GAAc,IAAI,CAACY,GAAGC,MAC7B,gBAAAF;AAAA,UAACF,EAAY;AAAA,UAAZ;AAAA,YACG,KAAKH;AAAA,YACL,WAAWI,EAAO;AAAA,YAClB,eAAe,CAACI,MAAU;AACtB,cAAAA,EAAM,cAAc,QAAQ,gBAAgB;AAAA,YAChD;AAAA,YACA,QAAQ,CAACA,MAAU;AACf,cAAAA,EAAM,cAAc,QAAQ,gBAAgB;AAAA,YAChD;AAAA,UAAA;AAAA,UACKD;AAAA,QAAA,CAEZ;AAAA,MAAA;AAAA,IAAA;AAAA,EAAA;AAGb,GAEaE,IAASC,EAA2ClB,CAAe;AAChFiB,EAAO,cAAc;"}
@@ -1,36 +1,103 @@
1
- import { jsx as t } from "react/jsx-runtime";
2
- import * as a from "@radix-ui/react-switch";
3
- import { forwardRef as n } from "react";
4
- import { useTranslation as f } from "./fondue-components42.js";
5
- import e from "./fondue-components98.js";
6
- const p = ({
7
- value: o,
8
- defaultValue: i,
9
- size: r = "medium",
10
- onChange: m,
11
- "data-test-id": s = "fondue-switch",
12
- "aria-label": c,
13
- ...d
14
- }, h) => {
15
- const { t: l } = f();
16
- return /* @__PURE__ */ t(
17
- a.Root,
1
+ import { jsx as s } from "react/jsx-runtime";
2
+ import { forwardRef as c } from "react";
3
+ import d from "./fondue-components102.js";
4
+ const b = c(
5
+ ({
6
+ "aria-label": t,
7
+ "data-test-id": a = "split-button",
8
+ children: o,
9
+ disabled: i = !1,
10
+ emphasis: e = "default",
11
+ size: n = "medium"
12
+ }, l) => /* @__PURE__ */ s(
13
+ "div",
18
14
  {
19
- ref: h,
20
- checked: o,
21
- defaultChecked: i,
22
- className: e.root,
23
- onCheckedChange: m,
24
- "aria-label": c ?? l("Switch_defaultLabel"),
25
- "data-test-id": s,
26
- "data-size": r,
27
- ...d,
28
- children: /* @__PURE__ */ t(a.Thumb, { className: e.thumb })
15
+ ref: l,
16
+ role: "group",
17
+ "aria-label": t,
18
+ "data-test-id": a,
19
+ "data-component": "split-button",
20
+ "data-emphasis": e,
21
+ "data-size": n,
22
+ "data-disabled": i,
23
+ className: d.root,
24
+ children: o
29
25
  }
30
- );
31
- }, u = n(p);
32
- u.displayName = "Switch";
26
+ )
27
+ );
28
+ b.displayName = "SplitButton.Root";
29
+ const p = c(
30
+ ({
31
+ "aria-label": t,
32
+ "aria-describedby": a,
33
+ "data-test-id": o = "split-button-content",
34
+ children: i,
35
+ disabled: e = !1,
36
+ onPress: n,
37
+ title: l,
38
+ type: r = "button"
39
+ }, u) => /* @__PURE__ */ s(
40
+ "button",
41
+ {
42
+ ref: u,
43
+ type: r,
44
+ disabled: e,
45
+ "aria-label": t,
46
+ "aria-describedby": a,
47
+ title: l,
48
+ "data-test-id": o,
49
+ className: d.content,
50
+ onClick: n,
51
+ children: i
52
+ }
53
+ )
54
+ );
55
+ p.displayName = "SplitButton.Content";
56
+ const m = ({
57
+ "aria-label": t,
58
+ "data-test-id": a = "split-button-action",
59
+ rotateIcon: o = !0,
60
+ children: i
61
+ }) => /* @__PURE__ */ s("div", { "aria-label": t, "data-test-id": a, "data-rotate-icon": o, className: d.action, children: i });
62
+ m.displayName = "SplitButton.Action";
63
+ const B = c(
64
+ ({
65
+ "aria-label": t,
66
+ "aria-describedby": a,
67
+ "data-test-id": o = "split-button-action-button",
68
+ children: i,
69
+ disabled: e = !1,
70
+ title: n,
71
+ type: l = "button",
72
+ ...r
73
+ }, u) => /* @__PURE__ */ s(
74
+ "button",
75
+ {
76
+ ref: u,
77
+ type: l,
78
+ disabled: e,
79
+ "aria-label": t,
80
+ "aria-describedby": a,
81
+ title: n,
82
+ "data-test-id": o,
83
+ className: d.actionButton,
84
+ ...r,
85
+ children: i
86
+ }
87
+ )
88
+ );
89
+ B.displayName = "SplitButton.ActionButton";
90
+ const N = {
91
+ Root: b,
92
+ Content: p,
93
+ Action: m,
94
+ ActionButton: B
95
+ };
33
96
  export {
34
- u as Switch
97
+ N as SplitButton,
98
+ m as SplitButtonAction,
99
+ B as SplitButtonActionButton,
100
+ p as SplitButtonContent,
101
+ b as SplitButtonRoot
35
102
  };
36
103
  //# sourceMappingURL=fondue-components32.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"fondue-components32.js","sources":["../src/components/Switch/Switch.tsx"],"sourcesContent":["/* (c) Copyright Frontify Ltd., all rights reserved. */\n\nimport * as RadixSwitch from '@radix-ui/react-switch';\nimport { type FormEvent, type ForwardedRef, forwardRef } from 'react';\n\nimport { useTranslation } from '#/hooks/useTranslation';\nimport { type CommonAriaAttrs } from '#/utilities/types';\n\nimport styles from './styles/switch.module.scss';\n\ntype SwitchProps = {\n id?: string;\n name?: string;\n /**\n * The size of the switch component.\n * @default medium\n */\n size?: 'small' | 'medium' | 'large';\n /**\n * The active value in the select component. This is used to control the select externally.\n * @default false\n */\n value?: boolean;\n /**\n * The default value of the select component. Used for uncontrolled usages.\n * @default false\n */\n defaultValue?: boolean;\n /**\n * Disables the select component.\n * @default false\n */\n disabled?: boolean;\n /**\n * Whether the switch is required.\n * @default false\n */\n required?: boolean;\n /**\n * Callback function that is called when the switch is toggled.\n * @param checked - The new checked state of the switch\n */\n onChange?: (checked: boolean) => void;\n /**\n * Event handler called when the checkbox is blurred\n * @param event - The event object\n */\n onBlur?: (event: FormEvent<HTMLButtonElement>) => void;\n /**\n * Event handler called when the checkbox is focused\n * @param event - The event object\n */\n onFocus?: (event: FormEvent<HTMLButtonElement>) => void;\n 'data-test-id'?: string;\n} & CommonAriaAttrs;\n\nconst SwitchComponent = (\n {\n value,\n defaultValue,\n size = 'medium',\n onChange,\n 'data-test-id': dataTestId = 'fondue-switch',\n 'aria-label': ariaLabel,\n ...props\n }: SwitchProps,\n ref: ForwardedRef<HTMLButtonElement>,\n) => {\n const { t } = useTranslation();\n\n return (\n <RadixSwitch.Root\n ref={ref}\n checked={value}\n defaultChecked={defaultValue}\n className={styles.root}\n onCheckedChange={onChange}\n aria-label={ariaLabel ?? t('Switch_defaultLabel')}\n data-test-id={dataTestId}\n data-size={size}\n {...props}\n >\n <RadixSwitch.Thumb className={styles.thumb} />\n </RadixSwitch.Root>\n );\n};\n\nexport const Switch = forwardRef<HTMLButtonElement, SwitchProps>(SwitchComponent);\nSwitch.displayName = 'Switch';\n"],"names":["SwitchComponent","value","defaultValue","size","onChange","dataTestId","ariaLabel","props","ref","t","useTranslation","jsx","RadixSwitch","styles","Switch","forwardRef"],"mappings":";;;;;AAwDA,MAAMA,IAAkB,CACpB;AAAA,EACI,OAAAC;AAAA,EACA,cAAAC;AAAA,EACA,MAAAC,IAAO;AAAA,EACP,UAAAC;AAAA,EACA,gBAAgBC,IAAa;AAAA,EAC7B,cAAcC;AAAA,EACd,GAAGC;AACP,GACAC,MACC;AACD,QAAM,EAAE,GAAAC,EAAA,IAAMC,EAAA;AAEd,SACI,gBAAAC;AAAA,IAACC,EAAY;AAAA,IAAZ;AAAA,MACG,KAAAJ;AAAA,MACA,SAASP;AAAA,MACT,gBAAgBC;AAAA,MAChB,WAAWW,EAAO;AAAA,MAClB,iBAAiBT;AAAA,MACjB,cAAYE,KAAaG,EAAE,qBAAqB;AAAA,MAChD,gBAAcJ;AAAA,MACd,aAAWF;AAAA,MACV,GAAGI;AAAA,MAEJ,4BAACK,EAAY,OAAZ,EAAkB,WAAWC,EAAO,MAAA,CAAO;AAAA,IAAA;AAAA,EAAA;AAGxD,GAEaC,IAASC,EAA2Cf,CAAe;AAChFc,EAAO,cAAc;"}
1
+ {"version":3,"file":"fondue-components32.js","sources":["../src/components/SplitButton/SplitButton.tsx"],"sourcesContent":["/* (c) Copyright Frontify Ltd., all rights reserved. */\n\nimport { forwardRef, type ForwardedRef, type MouseEvent, type ReactNode } from 'react';\n\nimport styles from './styles/splitButton.module.scss';\n\ntype ButtonSize = 'small' | 'medium' | 'large';\n\ntype ButtonEmphasis = 'default' | 'weak' | 'strong';\n\nexport type SplitButtonProps = {\n /**\n * @default 'default'\n */\n emphasis?: ButtonEmphasis;\n /**\n * @default 'medium'\n */\n size?: ButtonSize;\n /**\n * @default false\n */\n disabled?: boolean;\n /**\n * Accessible label for the button group\n */\n 'aria-label'?: string;\n /**\n * Test ID for the root element\n */\n 'data-test-id'?: string;\n children: ReactNode;\n};\n\nexport type SplitButtonContentProps = {\n /**\n * Button type\n * @default 'button'\n */\n type?: 'button' | 'submit' | 'reset';\n /**\n * Whether the button is disabled\n * @default false\n */\n disabled?: boolean;\n /**\n * Click handler\n */\n onPress?: (event?: MouseEvent<HTMLButtonElement>) => void;\n /**\n * Accessible label\n */\n 'aria-label'?: string;\n /**\n * Accessible description\n */\n 'aria-describedby'?: string;\n /**\n * Test ID for the content section\n */\n 'data-test-id'?: string;\n /**\n * Button title\n */\n title?: string;\n children: ReactNode;\n};\n\nexport type SplitButtonActionProps = {\n /**\n * Accessible label\n */\n 'aria-label'?: string;\n /**\n * Test ID for the action slot\n */\n 'data-test-id'?: string;\n /**\n * Whether to rotate the icon 180 degrees when active (typically for caret icons)\n * @default true\n */\n rotateIcon?: boolean;\n children: ReactNode;\n};\n\nexport type SplitButtonActionButtonProps = {\n /**\n * Button type\n * @default 'button'\n */\n type?: 'button' | 'submit' | 'reset';\n /**\n * Whether the button is disabled\n * @default false\n */\n disabled?: boolean;\n /**\n * Accessible label\n */\n 'aria-label'?: string;\n /**\n * Accessible description\n */\n 'aria-describedby'?: string;\n /**\n * Test ID for the action button\n */\n 'data-test-id'?: string;\n /**\n * Button title\n */\n title?: string;\n children: ReactNode;\n};\n\nexport const SplitButtonRoot = forwardRef<HTMLDivElement, SplitButtonProps>(\n (\n {\n 'aria-label': ariaLabel,\n 'data-test-id': dataTestId = 'split-button',\n children,\n disabled = false,\n emphasis = 'default',\n size = 'medium',\n }: SplitButtonProps,\n ref: ForwardedRef<HTMLDivElement>,\n ) => {\n return (\n <div\n ref={ref}\n role=\"group\"\n aria-label={ariaLabel}\n data-test-id={dataTestId}\n data-component=\"split-button\"\n data-emphasis={emphasis}\n data-size={size}\n data-disabled={disabled}\n className={styles.root}\n >\n {children}\n </div>\n );\n },\n);\nSplitButtonRoot.displayName = 'SplitButton.Root';\n\nexport const SplitButtonContent = forwardRef<HTMLButtonElement, SplitButtonContentProps>(\n (\n {\n 'aria-label': ariaLabel,\n 'aria-describedby': ariaDescribedby,\n 'data-test-id': dataTestId = 'split-button-content',\n children,\n disabled = false,\n onPress,\n title,\n type = 'button',\n }: SplitButtonContentProps,\n ref: ForwardedRef<HTMLButtonElement>,\n ) => {\n return (\n <button\n ref={ref}\n type={type}\n disabled={disabled}\n aria-label={ariaLabel}\n aria-describedby={ariaDescribedby}\n title={title}\n data-test-id={dataTestId}\n className={styles.content}\n onClick={onPress}\n >\n {children}\n </button>\n );\n },\n);\nSplitButtonContent.displayName = 'SplitButton.Content';\n\nexport const SplitButtonAction = ({\n 'aria-label': ariaLabel,\n 'data-test-id': dataTestId = 'split-button-action',\n rotateIcon = true,\n children,\n}: SplitButtonActionProps) => {\n return (\n <div aria-label={ariaLabel} data-test-id={dataTestId} data-rotate-icon={rotateIcon} className={styles.action}>\n {children}\n </div>\n );\n};\nSplitButtonAction.displayName = 'SplitButton.Action';\n\nexport const SplitButtonActionButton = forwardRef<HTMLButtonElement, SplitButtonActionButtonProps>(\n (\n {\n 'aria-label': ariaLabel,\n 'aria-describedby': ariaDescribedby,\n 'data-test-id': dataTestId = 'split-button-action-button',\n children,\n disabled = false,\n title,\n type = 'button',\n ...props\n },\n ref,\n ) => {\n return (\n <button\n ref={ref}\n type={type}\n disabled={disabled}\n aria-label={ariaLabel}\n aria-describedby={ariaDescribedby}\n title={title}\n data-test-id={dataTestId}\n className={styles.actionButton}\n {...props}\n >\n {children}\n </button>\n );\n },\n);\nSplitButtonActionButton.displayName = 'SplitButton.ActionButton';\n\nexport const SplitButton = {\n Root: SplitButtonRoot,\n Content: SplitButtonContent,\n Action: SplitButtonAction,\n ActionButton: SplitButtonActionButton,\n};\n"],"names":["SplitButtonRoot","forwardRef","ariaLabel","dataTestId","children","disabled","emphasis","size","ref","jsx","styles","SplitButtonContent","ariaDescribedby","onPress","title","type","SplitButtonAction","rotateIcon","SplitButtonActionButton","props","SplitButton"],"mappings":";;;AAmHO,MAAMA,IAAkBC;AAAA,EAC3B,CACI;AAAA,IACI,cAAcC;AAAA,IACd,gBAAgBC,IAAa;AAAA,IAC7B,UAAAC;AAAA,IACA,UAAAC,IAAW;AAAA,IACX,UAAAC,IAAW;AAAA,IACX,MAAAC,IAAO;AAAA,EAAA,GAEXC,MAGI,gBAAAC;AAAA,IAAC;AAAA,IAAA;AAAA,MACG,KAAAD;AAAA,MACA,MAAK;AAAA,MACL,cAAYN;AAAA,MACZ,gBAAcC;AAAA,MACd,kBAAe;AAAA,MACf,iBAAeG;AAAA,MACf,aAAWC;AAAA,MACX,iBAAeF;AAAA,MACf,WAAWK,EAAO;AAAA,MAEjB,UAAAN;AAAA,IAAA;AAAA,EAAA;AAIjB;AACAJ,EAAgB,cAAc;AAEvB,MAAMW,IAAqBV;AAAA,EAC9B,CACI;AAAA,IACI,cAAcC;AAAA,IACd,oBAAoBU;AAAA,IACpB,gBAAgBT,IAAa;AAAA,IAC7B,UAAAC;AAAA,IACA,UAAAC,IAAW;AAAA,IACX,SAAAQ;AAAA,IACA,OAAAC;AAAA,IACA,MAAAC,IAAO;AAAA,EAAA,GAEXP,MAGI,gBAAAC;AAAA,IAAC;AAAA,IAAA;AAAA,MACG,KAAAD;AAAA,MACA,MAAAO;AAAA,MACA,UAAAV;AAAA,MACA,cAAYH;AAAA,MACZ,oBAAkBU;AAAA,MAClB,OAAAE;AAAA,MACA,gBAAcX;AAAA,MACd,WAAWO,EAAO;AAAA,MAClB,SAASG;AAAA,MAER,UAAAT;AAAA,IAAA;AAAA,EAAA;AAIjB;AACAO,EAAmB,cAAc;AAE1B,MAAMK,IAAoB,CAAC;AAAA,EAC9B,cAAcd;AAAA,EACd,gBAAgBC,IAAa;AAAA,EAC7B,YAAAc,IAAa;AAAA,EACb,UAAAb;AACJ,MAEQ,gBAAAK,EAAC,OAAA,EAAI,cAAYP,GAAW,gBAAcC,GAAY,oBAAkBc,GAAY,WAAWP,EAAO,QACjG,UAAAN,EAAA,CACL;AAGRY,EAAkB,cAAc;AAEzB,MAAME,IAA0BjB;AAAA,EACnC,CACI;AAAA,IACI,cAAcC;AAAA,IACd,oBAAoBU;AAAA,IACpB,gBAAgBT,IAAa;AAAA,IAC7B,UAAAC;AAAA,IACA,UAAAC,IAAW;AAAA,IACX,OAAAS;AAAA,IACA,MAAAC,IAAO;AAAA,IACP,GAAGI;AAAA,EAAA,GAEPX,MAGI,gBAAAC;AAAA,IAAC;AAAA,IAAA;AAAA,MACG,KAAAD;AAAA,MACA,MAAAO;AAAA,MACA,UAAAV;AAAA,MACA,cAAYH;AAAA,MACZ,oBAAkBU;AAAA,MAClB,OAAAE;AAAA,MACA,gBAAcX;AAAA,MACd,WAAWO,EAAO;AAAA,MACjB,GAAGS;AAAA,MAEH,UAAAf;AAAA,IAAA;AAAA,EAAA;AAIjB;AACAc,EAAwB,cAAc;AAE/B,MAAME,IAAc;AAAA,EACvB,MAAMpB;AAAA,EACN,SAASW;AAAA,EACT,QAAQK;AAAA,EACR,cAAcE;AAClB;"}
@@ -1,199 +1,36 @@
1
- import { jsx as n, jsxs as T } from "react/jsx-runtime";
2
- import { IconArrowUp as O, IconArrowDown as K, IconArrowBidirectional as W } from "@frontify/fondue-icons";
3
- import { forwardRef as u, useRef as v, useState as _, useEffect as D, useMemo as L } from "react";
4
- import { useSyncRefs as R } from "./fondue-components54.js";
5
- import { useTextTruncation as h } from "./fondue-components99.js";
6
- import { useTranslation as j } from "./fondue-components42.js";
7
- import { Box as M } from "./fondue-components5.js";
8
- import { LoadingCircle as S } from "./fondue-components21.js";
9
- import s from "./fondue-components100.js";
10
- import { handleKeyDown as U, shouldIgnoreRowClick as q } from "./fondue-components101.js";
11
- const x = u(
12
- ({ layout: t = "auto", fontSize: e = "medium", gutter: r = "0px", sticky: o, noBorder: a = !1, children: l, ...m }, f) => {
13
- const b = v(null), [p, i] = _(!1);
14
- R(b, f);
15
- const d = o === "head" || o === "both", N = o === "col" || o === "both";
16
- return D(() => {
17
- const c = b.current;
18
- if (!c)
19
- return;
20
- const y = () => {
21
- const g = c.parentElement;
22
- if (!g)
23
- return;
24
- const C = c.scrollWidth, E = g.clientWidth;
25
- i(C > E);
26
- };
27
- y();
28
- const w = new ResizeObserver(y);
29
- return w.observe(c), c.parentElement && w.observe(c.parentElement), () => {
30
- w.disconnect();
31
- };
32
- }, [l]), // eslint-disable-next-line jsx-a11y-x/no-noninteractive-element-interactions
33
- /* @__PURE__ */ n(
34
- "table",
35
- {
36
- ref: b,
37
- className: s.table,
38
- style: {
39
- // @ts-expect-error CSS custom properties are not in CSSProperties type
40
- "--table-gutter": r
41
- },
42
- "data-layout": t,
43
- "data-font-size": e,
44
- "data-sticky-header": d,
45
- "data-sticky-left-column": N,
46
- "data-no-border": a,
47
- "data-has-horizontal-overflow": p,
48
- onKeyDown: U,
49
- ...m,
50
- children: l
51
- }
52
- );
53
- }
54
- );
55
- x.displayName = "Table.Root";
56
- const k = u(({ children: t }, e) => /* @__PURE__ */ n("caption", { ref: e, className: s.caption, children: t }));
57
- k.displayName = "Table.Caption";
58
- const z = u(
59
- ({ sticky: t = !1, children: e, "aria-label": r, "aria-busy": o }, a) => /* @__PURE__ */ n("thead", { ref: a, className: s.header, "data-sticky": t, "aria-label": r, "aria-busy": o, children: e })
60
- );
61
- z.displayName = "Table.Header";
62
- const H = u(
63
- ({
64
- noShrink: t = !1,
65
- truncate: e = !1,
66
- align: r = "left",
67
- scope: o = "col",
68
- sortTranslations: a,
69
- sortDirection: l,
70
- colSpan: m,
71
- width: f,
72
- state: b = "idle",
73
- loadingStateAriaLabel: p,
74
- onSortChange: i,
75
- children: d
76
- }, N) => {
77
- const { t: c } = j(), y = v(null);
78
- R(y, N), h(y);
79
- const w = L(() => typeof d == "string" ? l === "ascending" ? (a == null ? void 0 : a.sortDescending) ?? c("Table_sortByDescending", { column: d }) : (a == null ? void 0 : a.sortAscending) ?? c("Table_sortByAscending", { column: d }) : c(l === "ascending" ? "Table_sortDescending" : "Table_sortAscending"), [d, l, a, c]), g = () => {
80
- if (!i)
81
- return;
82
- i(l === void 0 || l === "descending" ? "ascending" : "descending");
83
- };
84
- return /* @__PURE__ */ n(
85
- "th",
86
- {
87
- ref: y,
88
- style: { width: f },
89
- className: s.headerCell,
90
- scope: o,
91
- colSpan: m,
92
- "data-align": r,
93
- "data-truncate": e,
94
- "data-no-shrink": t,
95
- "data-sortable": !!i,
96
- "aria-sort": i ? l || "none" : void 0,
97
- children: b === "loading" ? /* @__PURE__ */ T("div", { className: s.cellContent, "aria-live": "polite", "aria-label": p, children: [
98
- typeof d == "string" && e ? /* @__PURE__ */ n("span", { className: s.buttonText, children: d }) : d,
99
- /* @__PURE__ */ n(S, { "data-test-id": "fondue-loading-circle", size: "xx-small" })
100
- ] }) : i ? /* @__PURE__ */ T(
101
- "button",
102
- {
103
- className: s.cellContent,
104
- "aria-label": w,
105
- "data-active": !!l,
106
- onClick: g,
107
- type: "button",
108
- children: [
109
- typeof d == "string" && e ? /* @__PURE__ */ n("span", { className: s.buttonText, children: d }) : d,
110
- /* @__PURE__ */ n(M, { width: 3, children: l === "ascending" ? /* @__PURE__ */ n(O, { className: s.sortIndicator, size: "12" }) : l === "descending" ? /* @__PURE__ */ n(K, { className: s.sortIndicator, size: "12" }) : /* @__PURE__ */ n(W, { className: s.sortIndicator, size: "12" }) })
111
- ]
112
- }
113
- ) : d
114
- }
115
- );
116
- }
117
- );
118
- H.displayName = "Table.HeaderCell";
119
- const I = u(
120
- ({ firstColumnSticky: t = !1, lastColumnSticky: e = !1, children: r, "aria-busy": o }, a) => /* @__PURE__ */ n(
121
- "tbody",
1
+ import { jsx as t } from "react/jsx-runtime";
2
+ import * as a from "@radix-ui/react-switch";
3
+ import { forwardRef as n } from "react";
4
+ import { useTranslation as f } from "./fondue-components43.js";
5
+ import e from "./fondue-components103.js";
6
+ const p = ({
7
+ value: o,
8
+ defaultValue: i,
9
+ size: r = "medium",
10
+ onChange: m,
11
+ "data-test-id": s = "fondue-switch",
12
+ "aria-label": c,
13
+ ...d
14
+ }, h) => {
15
+ const { t: l } = f();
16
+ return /* @__PURE__ */ t(
17
+ a.Root,
122
18
  {
123
- ref: a,
124
- className: s.body,
125
- "data-first-column-sticky": t,
126
- "data-last-column-sticky": e,
127
- "aria-busy": o,
128
- children: r
19
+ ref: h,
20
+ checked: o,
21
+ defaultChecked: i,
22
+ className: e.root,
23
+ onCheckedChange: m,
24
+ "aria-label": c ?? l("Switch_defaultLabel"),
25
+ "data-test-id": s,
26
+ "data-size": r,
27
+ ...d,
28
+ children: /* @__PURE__ */ t(a.Thumb, { className: e.thumb })
129
29
  }
130
- )
131
- );
132
- I.displayName = "Table.Body";
133
- const B = u(
134
- ({ disabled: t = !1, selected: e = !1, onClick: r, children: o, "aria-label": a, "data-test-id": l }, m) => {
135
- const f = r !== void 0 && !t, b = (i) => {
136
- t || q(i) || r && r(e);
137
- }, p = (i) => {
138
- f && (i.key === "Enter" || i.key === " ") && (i.preventDefault(), b());
139
- };
140
- return /* @__PURE__ */ n(
141
- "tr",
142
- {
143
- ref: m,
144
- className: s.row,
145
- tabIndex: 0,
146
- role: f ? "button" : "row",
147
- "data-disabled": t,
148
- "data-interactive": f,
149
- "data-selected": f ? void 0 : e,
150
- "aria-disabled": t,
151
- "aria-label": a,
152
- "aria-selected": f ? void 0 : e,
153
- onClick: f ? b : void 0,
154
- onKeyDown: f ? p : void 0,
155
- "data-test-id": l,
156
- children: o
157
- }
158
- );
159
- }
160
- );
161
- B.displayName = "Table.Row";
162
- const A = u(
163
- ({ colSpan: t, truncate: e, align: r = "left", children: o, "aria-label": a }, l) => {
164
- const m = v(null);
165
- return R(m, l), h(m), /* @__PURE__ */ n(
166
- "td",
167
- {
168
- ref: m,
169
- className: s.rowCell,
170
- colSpan: t,
171
- "data-align": r,
172
- "data-truncate": e,
173
- "aria-label": a,
174
- children: o
175
- }
176
- );
177
- }
178
- );
179
- A.displayName = "Table.RowCell";
180
- const ee = {
181
- Root: x,
182
- Caption: k,
183
- Header: z,
184
- HeaderCell: H,
185
- Body: I,
186
- Row: B,
187
- RowCell: A
188
- };
30
+ );
31
+ }, u = n(p);
32
+ u.displayName = "Switch";
189
33
  export {
190
- ee as Table,
191
- I as TableBody,
192
- k as TableCaption,
193
- z as TableHeader,
194
- H as TableHeaderCell,
195
- x as TableRoot,
196
- B as TableRow,
197
- A as TableRowCell
34
+ u as Switch
198
35
  };
199
36
  //# sourceMappingURL=fondue-components33.js.map