@frontify/fondue-components 7.0.0 → 7.0.1

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 (87) hide show
  1. package/dist/fondue-components10.js +31 -27
  2. package/dist/fondue-components10.js.map +1 -1
  3. package/dist/fondue-components11.js +75 -72
  4. package/dist/fondue-components11.js.map +1 -1
  5. package/dist/fondue-components12.js +29 -26
  6. package/dist/fondue-components12.js.map +1 -1
  7. package/dist/fondue-components14.js +1 -1
  8. package/dist/fondue-components15.js +1 -1
  9. package/dist/fondue-components16.js +32 -29
  10. package/dist/fondue-components16.js.map +1 -1
  11. package/dist/fondue-components17.js +2 -2
  12. package/dist/fondue-components18.js +6 -6
  13. package/dist/fondue-components19.js +1 -1
  14. package/dist/fondue-components20.js +1 -1
  15. package/dist/fondue-components21.js +4 -4
  16. package/dist/fondue-components22.js +3 -3
  17. package/dist/fondue-components23.js +1 -1
  18. package/dist/fondue-components24.js +1 -1
  19. package/dist/fondue-components28.js +1 -1
  20. package/dist/fondue-components3.js +28 -25
  21. package/dist/fondue-components3.js.map +1 -1
  22. package/dist/fondue-components31.js +1 -1
  23. package/dist/fondue-components33.js +1 -1
  24. package/dist/fondue-components41.js +18 -19
  25. package/dist/fondue-components41.js.map +1 -1
  26. package/dist/fondue-components42.js +16 -4
  27. package/dist/fondue-components42.js.map +1 -1
  28. package/dist/fondue-components43.js +3 -11
  29. package/dist/fondue-components43.js.map +1 -1
  30. package/dist/fondue-components44.js +13 -3
  31. package/dist/fondue-components44.js.map +1 -1
  32. package/dist/fondue-components45.js +5 -35
  33. package/dist/fondue-components45.js.map +1 -1
  34. package/dist/fondue-components46.js +35 -13
  35. package/dist/fondue-components46.js.map +1 -1
  36. package/dist/fondue-components47.js +12 -4
  37. package/dist/fondue-components47.js.map +1 -1
  38. package/dist/fondue-components48.js +4 -24
  39. package/dist/fondue-components48.js.map +1 -1
  40. package/dist/fondue-components49.js +24 -16
  41. package/dist/fondue-components49.js.map +1 -1
  42. package/dist/fondue-components50.js +16 -139
  43. package/dist/fondue-components50.js.map +1 -1
  44. package/dist/fondue-components51.js +140 -16
  45. package/dist/fondue-components51.js.map +1 -1
  46. package/dist/fondue-components52.js +16 -72
  47. package/dist/fondue-components52.js.map +1 -1
  48. package/dist/fondue-components53.js +72 -8
  49. package/dist/fondue-components53.js.map +1 -1
  50. package/dist/fondue-components54.js +8 -33
  51. package/dist/fondue-components54.js.map +1 -1
  52. package/dist/fondue-components55.js +32 -48
  53. package/dist/fondue-components55.js.map +1 -1
  54. package/dist/fondue-components56.js +48 -10
  55. package/dist/fondue-components56.js.map +1 -1
  56. package/dist/fondue-components57.js +8 -10
  57. package/dist/fondue-components57.js.map +1 -1
  58. package/dist/fondue-components58.js +12 -7
  59. package/dist/fondue-components58.js.map +1 -1
  60. package/dist/fondue-components59.js +7 -12
  61. package/dist/fondue-components59.js.map +1 -1
  62. package/dist/fondue-components60.js +12 -18
  63. package/dist/fondue-components60.js.map +1 -1
  64. package/dist/fondue-components61.js +19 -15
  65. package/dist/fondue-components61.js.map +1 -1
  66. package/dist/fondue-components62.js +14 -52
  67. package/dist/fondue-components62.js.map +1 -1
  68. package/dist/fondue-components63.js +52 -14
  69. package/dist/fondue-components63.js.map +1 -1
  70. package/dist/fondue-components64.js +12 -15
  71. package/dist/fondue-components64.js.map +1 -1
  72. package/dist/fondue-components65.js +17 -6
  73. package/dist/fondue-components65.js.map +1 -1
  74. package/dist/fondue-components66.js +7 -2
  75. package/dist/fondue-components66.js.map +1 -1
  76. package/dist/fondue-components67.js +2 -15
  77. package/dist/fondue-components67.js.map +1 -1
  78. package/dist/fondue-components68.js +1 -1
  79. package/dist/fondue-components69.js +18 -0
  80. package/dist/fondue-components69.js.map +1 -0
  81. package/dist/fondue-components8.js +28 -28
  82. package/dist/fondue-components8.js.map +1 -1
  83. package/dist/fondue-components9.js +102 -92
  84. package/dist/fondue-components9.js.map +1 -1
  85. package/dist/index.d.ts +116 -132
  86. package/dist/style.css +1 -1
  87. package/package.json +1 -1
@@ -1 +1 @@
1
- {"version":3,"file":"fondue-components55.js","sources":["../src/components/Select/useSelectData.tsx"],"sourcesContent":["/* (c) Copyright Frontify Ltd., all rights reserved. */\n\nimport { IconCross } from '@frontify/fondue-icons';\nimport { Children, cloneElement, isValidElement, useCallback, useMemo, useState, type ReactNode } from 'react';\n\nimport { ForwardedRefSelectItem, type SelectItemProps } from './SelectItem';\nimport { ForwardedRefSelectSlot, type SelectSlotProps } from './SelectSlot';\nimport { getSelectOptionValue } from './utils';\n\nexport type SelectItemType = {\n value: string;\n label: string;\n};\n\n/**\n * Recursively extracts option values from children.\n * This function traverses through the React component tree and collects all SelectItem values.\n *\n * @param {ReactNode} children - The React children to extract values from.\n * @returns {SelectItemType[]} An array of SelectItemType objects.\n *\n * @example\n * const options = (\n * <SelectItem value=\"1\">Option 1</SelectItem>\n * <SelectItem value=\"2\">Option 2</SelectItem>\n * );\n * const values = getRecursiveOptionValues(options);\n * // Returns: [{ value: '1', label: 'Option 1' }, { value: '2', label: 'Option 2' }]\n */\nexport const getRecursiveOptionValues = (children: ReactNode): { value: string; label: string }[] => {\n const values: { value: string; label: string }[] = [];\n Children.forEach(children, (child) => {\n if (isValidElement<SelectItemProps>(child) && child.type === ForwardedRefSelectItem) {\n values.push(getSelectOptionValue(child.props));\n } else if (isValidElement<{ children: ReactNode }>(child) && child.props.children) {\n const optionValues = getRecursiveOptionValues(child.props.children);\n for (const optionValue of optionValues) {\n values.push(optionValue);\n }\n }\n });\n return values;\n};\n\n/**\n * Custom hook for managing select data and filtering.\n *\n * @param {ReactNode} children - The React children to process, typically SelectItem components.\n * @returns {Object} An object containing the processed data.\n */\nexport const useSelectData = (children: ReactNode) => {\n const [filterText, setFilterText] = useState('');\n const { inputSlots, menuSlots, itemValues, clearButton } = useMemo(() => {\n const inputSlots: ReactNode[] = [];\n const menuSlots: ReactNode[] = [];\n let clearButton: ReactNode;\n\n const hasSlots = Children.toArray(children).some(\n (child) => isValidElement<SelectSlotProps>(child) && child.type === ForwardedRefSelectSlot,\n );\n\n if (hasSlots) {\n Children.forEach(children, (child) => {\n if (isValidElement<SelectSlotProps>(child) && child.type === ForwardedRefSelectSlot) {\n if (child.props.name === 'menu') {\n menuSlots.push(child.props.children);\n } else if (child.props.name === 'left' || child.props.name === 'right') {\n inputSlots.push(child);\n } else if (child.props.name === 'clear') {\n if (child.props.children) {\n clearButton = child;\n } else {\n clearButton = cloneElement(child, { children: <IconCross size={16} /> });\n }\n }\n }\n });\n } else {\n menuSlots.push(children);\n }\n\n const itemValues = getRecursiveOptionValues(menuSlots);\n\n return { inputSlots, menuSlots, itemValues, clearButton };\n }, [children]);\n\n const items = useMemo(\n () =>\n itemValues.filter(\n (item) => filterText === '' || item.label.toLowerCase().includes(filterText.toLowerCase()),\n ),\n [itemValues, filterText],\n );\n\n const getItemByValue = useCallback(\n (value?: string) => (value ? itemValues.find((item) => item.value === value) : undefined),\n [itemValues],\n );\n\n return {\n items,\n menuSlots,\n filterText,\n inputSlots,\n clearButton,\n setFilterText,\n getItemByValue,\n };\n};\n"],"names":["getRecursiveOptionValues","children","values","Children","child","isValidElement","ForwardedRefSelectItem","getSelectOptionValue","optionValues","optionValue","useSelectData","filterText","setFilterText","useState","inputSlots","menuSlots","itemValues","clearButton","useMemo","ForwardedRefSelectSlot","cloneElement","IconCross","items","item","getItemByValue","useCallback","value"],"mappings":";;;;;;AA6Ba,MAAAA,IAA2B,CAACC,MAA4D;AACjG,QAAMC,IAA6C,CAAC;AAC3C,SAAAC,EAAA,QAAQF,GAAU,CAACG,MAAU;AAClC,QAAIC,EAAgCD,CAAK,KAAKA,EAAM,SAASE;AACzD,MAAAJ,EAAO,KAAKK,EAAqBH,EAAM,KAAK,CAAC;AAAA,aACtCC,EAAwCD,CAAK,KAAKA,EAAM,MAAM,UAAU;AAC/E,YAAMI,IAAeR,EAAyBI,EAAM,MAAM,QAAQ;AAClE,iBAAWK,KAAeD;AACtB,QAAAN,EAAO,KAAKO,CAAW;AAAA,IAC3B;AAAA,EACJ,CACH,GACMP;AACX,GAQaQ,IAAgB,CAACT,MAAwB;AAClD,QAAM,CAACU,GAAYC,CAAa,IAAIC,EAAS,EAAE,GACzC,EAAE,YAAAC,GAAY,WAAAC,GAAW,YAAAC,GAAY,aAAAC,EAAY,IAAIC,EAAQ,MAAM;AACrE,UAAMJ,IAA0B,CAAC,GAC3BC,IAAyB,CAAC;AAC5BE,QAAAA;AAMJ,IAJiBd,EAAS,QAAQF,CAAQ,EAAE;AAAA,MACxC,CAACG,MAAUC,EAAgCD,CAAK,KAAKA,EAAM,SAASe;AAAA,IACxE,IAGahB,EAAA,QAAQF,GAAU,CAACG,MAAU;AAClC,MAAIC,EAAgCD,CAAK,KAAKA,EAAM,SAASe,MACrDf,EAAM,MAAM,SAAS,SACrBW,EAAU,KAAKX,EAAM,MAAM,QAAQ,IAC5BA,EAAM,MAAM,SAAS,UAAUA,EAAM,MAAM,SAAS,UAC3DU,EAAW,KAAKV,CAAK,IACdA,EAAM,MAAM,SAAS,YACxBA,EAAM,MAAM,WACZa,IAAcb,IAEda,IAAcG,EAAahB,GAAO,EAAE,4BAAWiB,GAAU,EAAA,MAAM,GAAI,CAAA,GAAI;AAAA,IAGnF,CACH,IAEDN,EAAU,KAAKd,CAAQ;AAGrBe,UAAAA,IAAahB,EAAyBe,CAAS;AAE9C,WAAA,EAAE,YAAAD,GAAY,WAAAC,GAAW,YAAAC,GAAY,aAAAC,EAAY;AAAA,EAAA,GACzD,CAAChB,CAAQ,CAAC,GAEPqB,IAAQJ;AAAA,IACV,MACIF,EAAW;AAAA,MACP,CAACO,MAASZ,MAAe,MAAMY,EAAK,MAAM,cAAc,SAASZ,EAAW,YAAa,CAAA;AAAA,IAC7F;AAAA,IACJ,CAACK,GAAYL,CAAU;AAAA,EAC3B,GAEMa,IAAiBC;AAAA,IACnB,CAACC,MAAoBA,IAAQV,EAAW,KAAK,CAACO,MAASA,EAAK,UAAUG,CAAK,IAAI;AAAA,IAC/E,CAACV,CAAU;AAAA,EACf;AAEO,SAAA;AAAA,IACH,OAAAM;AAAA,IACA,WAAAP;AAAA,IACA,YAAAJ;AAAA,IACA,YAAAG;AAAA,IACA,aAAAG;AAAA,IACA,eAAAL;AAAA,IACA,gBAAAY;AAAA,EACJ;AACJ;"}
1
+ {"version":3,"file":"fondue-components55.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;"}
@@ -1,14 +1,52 @@
1
- const t = "_root_oitg9_5", o = "_thumb_oitg9_17", _ = "_track_oitg9_21", r = "_range_oitg9_28", a = {
2
- root: t,
3
- thumb: o,
4
- track: _,
5
- range: r
1
+ import { jsx as w } from "react/jsx-runtime";
2
+ import { IconCross as x } from "@frontify/fondue-icons";
3
+ import { useState as B, useMemo as i, Children as f, isValidElement as a, cloneElement as E, useCallback as v } from "react";
4
+ import { ForwardedRefSelectItem as F } from "./fondue-components52.js";
5
+ import { ForwardedRefSelectSlot as c } from "./fondue-components54.js";
6
+ import { getSelectOptionValue as I } from "./fondue-components68.js";
7
+ const S = (r) => {
8
+ const t = [];
9
+ return f.forEach(r, (o) => {
10
+ if (a(o) && o.type === F)
11
+ t.push(I(o.props));
12
+ else if (a(o) && o.props.children) {
13
+ const u = S(o.props.children);
14
+ for (const l of u)
15
+ t.push(l);
16
+ }
17
+ }), t;
18
+ }, z = (r) => {
19
+ const [t, o] = B(""), { inputSlots: u, menuSlots: l, itemValues: p, clearButton: V } = i(() => {
20
+ const s = [], n = [];
21
+ let m;
22
+ f.toArray(r).some(
23
+ (e) => a(e) && e.type === c
24
+ ) ? f.forEach(r, (e) => {
25
+ a(e) && e.type === c && (e.props.name === "menu" ? n.push(e.props.children) : e.props.name === "left" || e.props.name === "right" ? s.push(e) : e.props.name === "clear" && (e.props.children ? m = e : m = E(e, { children: /* @__PURE__ */ w(x, { size: 16 }) })));
26
+ }) : n.push(r);
27
+ const g = S(n);
28
+ return { inputSlots: s, menuSlots: n, itemValues: g, clearButton: m };
29
+ }, [r]), y = i(
30
+ () => p.filter(
31
+ (s) => t === "" || s.label.toLowerCase().includes(t.toLowerCase())
32
+ ),
33
+ [p, t]
34
+ ), C = v(
35
+ (s) => s ? p.find((n) => n.value === s) : void 0,
36
+ [p]
37
+ );
38
+ return {
39
+ items: y,
40
+ menuSlots: l,
41
+ filterText: t,
42
+ inputSlots: u,
43
+ clearButton: V,
44
+ setFilterText: o,
45
+ getItemByValue: C
46
+ };
6
47
  };
7
48
  export {
8
- a as default,
9
- r as range,
10
- t as root,
11
- o as thumb,
12
- _ as track
49
+ S as getRecursiveOptionValues,
50
+ z as useSelectData
13
51
  };
14
52
  //# sourceMappingURL=fondue-components56.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"fondue-components56.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;"}
1
+ {"version":3,"file":"fondue-components56.js","sources":["../src/components/Select/useSelectData.tsx"],"sourcesContent":["/* (c) Copyright Frontify Ltd., all rights reserved. */\n\nimport { IconCross } from '@frontify/fondue-icons';\nimport { Children, cloneElement, isValidElement, useCallback, useMemo, useState, type ReactNode } from 'react';\n\nimport { ForwardedRefSelectItem, type SelectItemProps } from './SelectItem';\nimport { ForwardedRefSelectSlot, type SelectSlotProps } from './SelectSlot';\nimport { getSelectOptionValue } from './utils';\n\nexport type SelectItemType = {\n value: string;\n label: string;\n};\n\n/**\n * Recursively extracts option values from children.\n * This function traverses through the React component tree and collects all SelectItem values.\n *\n * @param {ReactNode} children - The React children to extract values from.\n * @returns {SelectItemType[]} An array of SelectItemType objects.\n *\n * @example\n * const options = (\n * <SelectItem value=\"1\">Option 1</SelectItem>\n * <SelectItem value=\"2\">Option 2</SelectItem>\n * );\n * const values = getRecursiveOptionValues(options);\n * // Returns: [{ value: '1', label: 'Option 1' }, { value: '2', label: 'Option 2' }]\n */\nexport const getRecursiveOptionValues = (children: ReactNode): { value: string; label: string }[] => {\n const values: { value: string; label: string }[] = [];\n Children.forEach(children, (child) => {\n if (isValidElement<SelectItemProps>(child) && child.type === ForwardedRefSelectItem) {\n values.push(getSelectOptionValue(child.props));\n } else if (isValidElement<{ children: ReactNode }>(child) && child.props.children) {\n const optionValues = getRecursiveOptionValues(child.props.children);\n for (const optionValue of optionValues) {\n values.push(optionValue);\n }\n }\n });\n return values;\n};\n\n/**\n * Custom hook for managing select data and filtering.\n *\n * @param {ReactNode} children - The React children to process, typically SelectItem components.\n * @returns {Object} An object containing the processed data.\n */\nexport const useSelectData = (children: ReactNode) => {\n const [filterText, setFilterText] = useState('');\n const { inputSlots, menuSlots, itemValues, clearButton } = useMemo(() => {\n const inputSlots: ReactNode[] = [];\n const menuSlots: ReactNode[] = [];\n let clearButton: ReactNode;\n\n const hasSlots = Children.toArray(children).some(\n (child) => isValidElement<SelectSlotProps>(child) && child.type === ForwardedRefSelectSlot,\n );\n\n if (hasSlots) {\n Children.forEach(children, (child) => {\n if (isValidElement<SelectSlotProps>(child) && child.type === ForwardedRefSelectSlot) {\n if (child.props.name === 'menu') {\n menuSlots.push(child.props.children);\n } else if (child.props.name === 'left' || child.props.name === 'right') {\n inputSlots.push(child);\n } else if (child.props.name === 'clear') {\n if (child.props.children) {\n clearButton = child;\n } else {\n clearButton = cloneElement(child, { children: <IconCross size={16} /> });\n }\n }\n }\n });\n } else {\n menuSlots.push(children);\n }\n\n const itemValues = getRecursiveOptionValues(menuSlots);\n\n return { inputSlots, menuSlots, itemValues, clearButton };\n }, [children]);\n\n const items = useMemo(\n () =>\n itemValues.filter(\n (item) => filterText === '' || item.label.toLowerCase().includes(filterText.toLowerCase()),\n ),\n [itemValues, filterText],\n );\n\n const getItemByValue = useCallback(\n (value?: string) => (value ? itemValues.find((item) => item.value === value) : undefined),\n [itemValues],\n );\n\n return {\n items,\n menuSlots,\n filterText,\n inputSlots,\n clearButton,\n setFilterText,\n getItemByValue,\n };\n};\n"],"names":["getRecursiveOptionValues","children","values","Children","child","isValidElement","ForwardedRefSelectItem","getSelectOptionValue","optionValues","optionValue","useSelectData","filterText","setFilterText","useState","inputSlots","menuSlots","itemValues","clearButton","useMemo","ForwardedRefSelectSlot","cloneElement","IconCross","items","item","getItemByValue","useCallback","value"],"mappings":";;;;;;AA6Ba,MAAAA,IAA2B,CAACC,MAA4D;AACjG,QAAMC,IAA6C,CAAC;AAC3C,SAAAC,EAAA,QAAQF,GAAU,CAACG,MAAU;AAClC,QAAIC,EAAgCD,CAAK,KAAKA,EAAM,SAASE;AACzD,MAAAJ,EAAO,KAAKK,EAAqBH,EAAM,KAAK,CAAC;AAAA,aACtCC,EAAwCD,CAAK,KAAKA,EAAM,MAAM,UAAU;AAC/E,YAAMI,IAAeR,EAAyBI,EAAM,MAAM,QAAQ;AAClE,iBAAWK,KAAeD;AACtB,QAAAN,EAAO,KAAKO,CAAW;AAAA,IAC3B;AAAA,EACJ,CACH,GACMP;AACX,GAQaQ,IAAgB,CAACT,MAAwB;AAClD,QAAM,CAACU,GAAYC,CAAa,IAAIC,EAAS,EAAE,GACzC,EAAE,YAAAC,GAAY,WAAAC,GAAW,YAAAC,GAAY,aAAAC,EAAY,IAAIC,EAAQ,MAAM;AACrE,UAAMJ,IAA0B,CAAC,GAC3BC,IAAyB,CAAC;AAC5BE,QAAAA;AAMJ,IAJiBd,EAAS,QAAQF,CAAQ,EAAE;AAAA,MACxC,CAACG,MAAUC,EAAgCD,CAAK,KAAKA,EAAM,SAASe;AAAA,IACxE,IAGahB,EAAA,QAAQF,GAAU,CAACG,MAAU;AAClC,MAAIC,EAAgCD,CAAK,KAAKA,EAAM,SAASe,MACrDf,EAAM,MAAM,SAAS,SACrBW,EAAU,KAAKX,EAAM,MAAM,QAAQ,IAC5BA,EAAM,MAAM,SAAS,UAAUA,EAAM,MAAM,SAAS,UAC3DU,EAAW,KAAKV,CAAK,IACdA,EAAM,MAAM,SAAS,YACxBA,EAAM,MAAM,WACZa,IAAcb,IAEda,IAAcG,EAAahB,GAAO,EAAE,4BAAWiB,GAAU,EAAA,MAAM,GAAI,CAAA,GAAI;AAAA,IAGnF,CACH,IAEDN,EAAU,KAAKd,CAAQ;AAGrBe,UAAAA,IAAahB,EAAyBe,CAAS;AAE9C,WAAA,EAAE,YAAAD,GAAY,WAAAC,GAAW,YAAAC,GAAY,aAAAC,EAAY;AAAA,EAAA,GACzD,CAAChB,CAAQ,CAAC,GAEPqB,IAAQJ;AAAA,IACV,MACIF,EAAW;AAAA,MACP,CAACO,MAASZ,MAAe,MAAMY,EAAK,MAAM,cAAc,SAASZ,EAAW,YAAa,CAAA;AAAA,IAC7F;AAAA,IACJ,CAACK,GAAYL,CAAU;AAAA,EAC3B,GAEMa,IAAiBC;AAAA,IACnB,CAACC,MAAoBA,IAAQV,EAAW,KAAK,CAACO,MAASA,EAAK,UAAUG,CAAK,IAAI;AAAA,IAC/E,CAACV,CAAU;AAAA,EACf;AAEO,SAAA;AAAA,IACH,OAAAM;AAAA,IACA,WAAAP;AAAA,IACA,YAAAJ;AAAA,IACA,YAAAG;AAAA,IACA,aAAAG;AAAA,IACA,eAAAL;AAAA,IACA,gBAAAY;AAAA,EACJ;AACJ;"}
@@ -1,16 +1,14 @@
1
- const t = "_root_1a16w_5", _ = "_small_1a16w_33", a = "_medium_1a16w_37", o = "_large_1a16w_41", m = "_thumb_1a16w_55", s = {
1
+ const t = "_root_oitg9_5", o = "_thumb_oitg9_17", _ = "_track_oitg9_21", r = "_range_oitg9_28", a = {
2
2
  root: t,
3
- small: _,
4
- medium: a,
5
- large: o,
6
- thumb: m
3
+ thumb: o,
4
+ track: _,
5
+ range: r
7
6
  };
8
7
  export {
9
- s as default,
10
- o as large,
11
- a as medium,
8
+ a as default,
9
+ r as range,
12
10
  t as root,
13
- _ as small,
14
- m as thumb
11
+ o as thumb,
12
+ _ as track
15
13
  };
16
14
  //# sourceMappingURL=fondue-components57.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"fondue-components57.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;"}
1
+ {"version":3,"file":"fondue-components57.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;"}
@@ -1,11 +1,16 @@
1
- import { useEffect as f } from "react";
2
- import { syncRefs as o } from "./fondue-components37.js";
3
- const m = (s, e) => {
4
- f(() => {
5
- o(s, e);
6
- }, [s]);
1
+ const t = "_root_1a16w_5", _ = "_small_1a16w_33", a = "_medium_1a16w_37", o = "_large_1a16w_41", m = "_thumb_1a16w_55", s = {
2
+ root: t,
3
+ small: _,
4
+ medium: a,
5
+ large: o,
6
+ thumb: m
7
7
  };
8
8
  export {
9
- m as useSyncRefs
9
+ s as default,
10
+ o as large,
11
+ a as medium,
12
+ t as root,
13
+ _ as small,
14
+ m as thumb
10
15
  };
11
16
  //# sourceMappingURL=fondue-components58.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"fondue-components58.js","sources":["../src/hooks/useSyncRefs.ts"],"sourcesContent":["/* (c) Copyright Frontify Ltd., all rights reserved. */\n\nimport { type ForwardedRef, useEffect, type RefObject } from 'react';\n\nimport { syncRefs } from '#/utilities/domUtilities';\n\n/**\n * A custom React hook that synchronizes a local ref with a forwarded ref.\n * This is useful when you need to maintain both an internal reference to a DOM element\n * and allow external access through a forwarded ref.\n *\n * @template TElement - The type of the DOM element being referenced. Defaults to HTMLElement.\n * @param {RefObject<TElement>} localRef - The local ref object used internally by the component.\n * @param {ForwardedRef<TElement>} forwardedRef - The ref forwarded from a parent component.\n *\n * @example\n * ```tsx\n * const MyComponent = forwardRef<HTMLDivElement>((props, ref) => {\n * const localRef = useRef<HTMLDivElement>(null);\n * useSyncRefs(localRef, ref);\n *\n * return <div ref={localRef}>Content</div>;\n * });\n * ```\n */\nexport const useSyncRefs = <TElement = HTMLElement>(\n localRef: RefObject<TElement>,\n forwardedRef: ForwardedRef<TElement>,\n) => {\n useEffect(() => {\n syncRefs<TElement>(localRef, forwardedRef);\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [localRef]);\n};\n"],"names":["useSyncRefs","localRef","forwardedRef","useEffect","syncRefs"],"mappings":";;AAyBa,MAAAA,IAAc,CACvBC,GACAC,MACC;AACD,EAAAC,EAAU,MAAM;AACZ,IAAAC,EAAmBH,GAAUC,CAAY;AAAA,EAAA,GAE1C,CAACD,CAAQ,CAAC;AACjB;"}
1
+ {"version":3,"file":"fondue-components58.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;"}
@@ -1,16 +1,11 @@
1
- import { useEffect as c } from "react";
2
- const s = (t) => {
3
- c(() => {
4
- if (!t.current)
5
- return;
6
- const e = t.current, n = new ResizeObserver(() => {
7
- const r = e.scrollWidth > e.clientWidth;
8
- e.title = r && e.textContent || "";
9
- });
10
- return n.observe(e), () => n.disconnect();
11
- }, [t]);
1
+ import { useEffect as f } from "react";
2
+ import { syncRefs as o } from "./fondue-components37.js";
3
+ const m = (s, e) => {
4
+ f(() => {
5
+ o(s, e);
6
+ }, [s]);
12
7
  };
13
8
  export {
14
- s as useTextTruncation
9
+ m as useSyncRefs
15
10
  };
16
11
  //# sourceMappingURL=fondue-components59.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"fondue-components59.js","sources":["../src/hooks/useTextTruncation.ts"],"sourcesContent":["/* (c) Copyright Frontify Ltd., all rights reserved. */\n\nimport { useEffect, type RefObject } from 'react';\n\n/**\n * A custom React hook that automatically manages text truncation and tooltips.\n * It observes the element's size and adds a title attribute with the full text\n * when the content is truncated.\n *\n * ! Note: Components utilizing this hook should have tests in place to verify\n * ! that in each scenario, the height is correctly adjusted accodrding to the\n * ! requirements of the component and the viewport.\n *\n * @param {RefObject<HTMLElement>} ref - Reference to the HTML element to observe for truncation.\n *\n * @example\n * ```tsx\n * const MyComponent = () => {\n * const textRef = useRef<HTMLDivElement>(null);\n * useTextTruncation(textRef);\n *\n * return <div ref={textRef} className=\"truncate\">Long text content...</div>;\n * });\n * ```\n */\nexport const useTextTruncation = (ref: RefObject<HTMLElement>) => {\n useEffect(() => {\n if (!ref.current) {\n return;\n }\n\n const element = ref.current;\n const observer = new ResizeObserver(() => {\n const isTruncated = element.scrollWidth > element.clientWidth;\n element.title = isTruncated ? element.textContent || '' : '';\n });\n\n observer.observe(element);\n return () => observer.disconnect();\n }, [ref]);\n};\n"],"names":["useTextTruncation","ref","useEffect","element","observer","isTruncated"],"mappings":";AAyBa,MAAAA,IAAoB,CAACC,MAAgC;AAC9D,EAAAC,EAAU,MAAM;AACR,QAAA,CAACD,EAAI;AACL;AAGJ,UAAME,IAAUF,EAAI,SACdG,IAAW,IAAI,eAAe,MAAM;AAChC,YAAAC,IAAcF,EAAQ,cAAcA,EAAQ;AAClD,MAAAA,EAAQ,QAAQE,KAAcF,EAAQ,eAAe;AAAA,IAAK,CAC7D;AAED,WAAAC,EAAS,QAAQD,CAAO,GACjB,MAAMC,EAAS,WAAW;AAAA,EAAA,GAClC,CAACH,CAAG,CAAC;AACZ;"}
1
+ {"version":3,"file":"fondue-components59.js","sources":["../src/hooks/useSyncRefs.ts"],"sourcesContent":["/* (c) Copyright Frontify Ltd., all rights reserved. */\n\nimport { type ForwardedRef, useEffect, type RefObject } from 'react';\n\nimport { syncRefs } from '#/utilities/domUtilities';\n\n/**\n * A custom React hook that synchronizes a local ref with a forwarded ref.\n * This is useful when you need to maintain both an internal reference to a DOM element\n * and allow external access through a forwarded ref.\n *\n * @template TElement - The type of the DOM element being referenced. Defaults to HTMLElement.\n * @param {RefObject<TElement>} localRef - The local ref object used internally by the component.\n * @param {ForwardedRef<TElement>} forwardedRef - The ref forwarded from a parent component.\n *\n * @example\n * ```tsx\n * const MyComponent = forwardRef<HTMLDivElement>((props, ref) => {\n * const localRef = useRef<HTMLDivElement>(null);\n * useSyncRefs(localRef, ref);\n *\n * return <div ref={localRef}>Content</div>;\n * });\n * ```\n */\nexport const useSyncRefs = <TElement = HTMLElement>(\n localRef: RefObject<TElement>,\n forwardedRef: ForwardedRef<TElement>,\n) => {\n useEffect(() => {\n syncRefs<TElement>(localRef, forwardedRef);\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [localRef]);\n};\n"],"names":["useSyncRefs","localRef","forwardedRef","useEffect","syncRefs"],"mappings":";;AAyBa,MAAAA,IAAc,CACvBC,GACAC,MACC;AACD,EAAAC,EAAU,MAAM;AACZ,IAAAC,EAAmBH,GAAUC,CAAY;AAAA,EAAA,GAE1C,CAACD,CAAQ,CAAC;AACjB;"}
@@ -1,22 +1,16 @@
1
- const o = "_table_1pmcv_4", t = "_headerCell_1pmcv_18", _ = "_rowCell_1pmcv_19", c = "_caption_1pmcv_40", r = "_sortButton_1pmcv_65", e = "_sortIndicator_1pmcv_89", n = "_body_1pmcv_93", s = "_row_1pmcv_19", l = {
2
- table: o,
3
- headerCell: t,
4
- rowCell: _,
5
- caption: c,
6
- sortButton: r,
7
- sortIndicator: e,
8
- body: n,
9
- row: s
1
+ import { useEffect as c } from "react";
2
+ const s = (t) => {
3
+ c(() => {
4
+ if (!t.current)
5
+ return;
6
+ const e = t.current, n = new ResizeObserver(() => {
7
+ const r = e.scrollWidth > e.clientWidth;
8
+ e.title = r && e.textContent || "";
9
+ });
10
+ return n.observe(e), () => n.disconnect();
11
+ }, [t]);
10
12
  };
11
13
  export {
12
- n as body,
13
- c as caption,
14
- l as default,
15
- t as headerCell,
16
- s as row,
17
- _ as rowCell,
18
- r as sortButton,
19
- e as sortIndicator,
20
- o as table
14
+ s as useTextTruncation
21
15
  };
22
16
  //# sourceMappingURL=fondue-components60.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"fondue-components60.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;"}
1
+ {"version":3,"file":"fondue-components60.js","sources":["../src/hooks/useTextTruncation.ts"],"sourcesContent":["/* (c) Copyright Frontify Ltd., all rights reserved. */\n\nimport { useEffect, type RefObject } from 'react';\n\n/**\n * A custom React hook that automatically manages text truncation and tooltips.\n * It observes the element's size and adds a title attribute with the full text\n * when the content is truncated.\n *\n * @param {RefObject<HTMLElement>} ref - Reference to the HTML element to observe for truncation.\n *\n * @example\n * ```tsx\n * const MyComponent = () => {\n * const textRef = useRef<HTMLDivElement>(null);\n * useTextTruncation(textRef);\n *\n * return <div ref={textRef} className=\"truncate\">Long text content...</div>;\n * });\n * ```\n */\nexport const useTextTruncation = (ref: RefObject<HTMLElement>) => {\n useEffect(() => {\n if (!ref.current) {\n return;\n }\n\n const element = ref.current;\n const observer = new ResizeObserver(() => {\n const isTruncated = element.scrollWidth > element.clientWidth;\n element.title = isTruncated ? element.textContent || '' : '';\n });\n\n observer.observe(element);\n return () => observer.disconnect();\n }, [ref]);\n};\n"],"names":["useTextTruncation","ref","useEffect","element","observer","isTruncated"],"mappings":";AAqBa,MAAAA,IAAoB,CAACC,MAAgC;AAC9D,EAAAC,EAAU,MAAM;AACR,QAAA,CAACD,EAAI;AACL;AAGJ,UAAME,IAAUF,EAAI,SACdG,IAAW,IAAI,eAAe,MAAM;AAChC,YAAAC,IAAcF,EAAQ,cAAcA,EAAQ;AAClD,MAAAA,EAAQ,QAAQE,KAAcF,EAAQ,eAAe;AAAA,IAAK,CAC7D;AAED,WAAAC,EAAS,QAAQD,CAAO,GACjB,MAAMC,EAAS,WAAW;AAAA,EAAA,GAClC,CAACH,CAAG,CAAC;AACZ;"}
@@ -1,18 +1,22 @@
1
- function l(t, r) {
2
- const n = 'tr[tabindex="0"]', e = t.closest("table");
3
- if (!e)
4
- return null;
5
- const o = Array.from(e.querySelectorAll(n)), c = o.indexOf(t) + (r === "ArrowUp" ? -1 : 1);
6
- return c >= 0 && c < o.length ? o[c] : null;
7
- }
8
- function u(t) {
9
- const r = t.target, n = r.closest("tr");
10
- if (!n || r !== n || !["ArrowUp", "ArrowDown"].includes(t.key))
11
- return;
12
- const e = l(n, t.key);
13
- e && (t.preventDefault(), e.focus());
14
- }
1
+ const o = "_table_1pmcv_4", t = "_headerCell_1pmcv_18", _ = "_rowCell_1pmcv_19", c = "_caption_1pmcv_40", r = "_sortButton_1pmcv_65", e = "_sortIndicator_1pmcv_89", n = "_body_1pmcv_93", s = "_row_1pmcv_19", l = {
2
+ table: o,
3
+ headerCell: t,
4
+ rowCell: _,
5
+ caption: c,
6
+ sortButton: r,
7
+ sortIndicator: e,
8
+ body: n,
9
+ row: s
10
+ };
15
11
  export {
16
- u as handleKeyDown
12
+ n as body,
13
+ c as caption,
14
+ l as default,
15
+ t as headerCell,
16
+ s as row,
17
+ _ as rowCell,
18
+ r as sortButton,
19
+ e as sortIndicator,
20
+ o as table
17
21
  };
18
22
  //# sourceMappingURL=fondue-components61.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"fondue-components61.js","sources":["../src/components/Table/utils.ts"],"sourcesContent":["/* (c) Copyright Frontify Ltd., all rights reserved. */\n\nimport { type KeyboardEvent } from 'react';\n\nfunction getAdjacentRow(currentRow: HTMLElement, key: 'ArrowUp' | 'ArrowDown'): HTMLElement | null {\n const selector = 'tr[tabindex=\"0\"]';\n const table = currentRow.closest('table');\n if (!table) {\n return null;\n }\n\n const rows = Array.from(table.querySelectorAll(selector));\n const currentIndex = rows.indexOf(currentRow);\n const nextIndex = currentIndex + (key === 'ArrowUp' ? -1 : 1);\n\n return nextIndex >= 0 && nextIndex < rows.length ? (rows[nextIndex] as HTMLElement) : null;\n}\n\nexport function handleKeyDown(event: KeyboardEvent<HTMLTableElement>) {\n const target = event.target as HTMLElement;\n const currentRow = target.closest('tr');\n\n if (!currentRow || target !== currentRow || !['ArrowUp', 'ArrowDown'].includes(event.key)) {\n return;\n }\n\n const nextRow = getAdjacentRow(currentRow, event.key as 'ArrowUp' | 'ArrowDown');\n if (nextRow) {\n event.preventDefault();\n nextRow.focus();\n }\n}\n"],"names":["getAdjacentRow","currentRow","key","selector","table","rows","nextIndex","handleKeyDown","event","target","nextRow"],"mappings":"AAIA,SAASA,EAAeC,GAAyBC,GAAkD;AAC/F,QAAMC,IAAW,oBACXC,IAAQH,EAAW,QAAQ,OAAO;AACxC,MAAI,CAACG;AACM,WAAA;AAGX,QAAMC,IAAO,MAAM,KAAKD,EAAM,iBAAiBD,CAAQ,CAAC,GAElDG,IADeD,EAAK,QAAQJ,CAAU,KACVC,MAAQ,YAAY,KAAK;AAE3D,SAAOI,KAAa,KAAKA,IAAYD,EAAK,SAAUA,EAAKC,CAAS,IAAoB;AAC1F;AAEO,SAASC,EAAcC,GAAwC;AAClE,QAAMC,IAASD,EAAM,QACfP,IAAaQ,EAAO,QAAQ,IAAI;AAEtC,MAAI,CAACR,KAAcQ,MAAWR,KAAc,CAAC,CAAC,WAAW,WAAW,EAAE,SAASO,EAAM,GAAG;AACpF;AAGJ,QAAME,IAAUV,EAAeC,GAAYO,EAAM,GAA8B;AAC/E,EAAIE,MACAF,EAAM,eAAe,GACrBE,EAAQ,MAAM;AAEtB;"}
1
+ {"version":3,"file":"fondue-components61.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;"}
@@ -1,56 +1,18 @@
1
- import { useRef as v, useState as w, useEffect as W, useLayoutEffect as p } from "react";
2
- const b = (e, s) => e.filter((f) => {
3
- var c;
4
- const o = (c = f.ref) == null ? void 0 : c.current;
5
- return o ? o.offsetLeft + o.offsetWidth > (s == null ? void 0 : s.scrollLeft) + s.offsetWidth || o.offsetLeft - s.scrollLeft < 0 : !1;
6
- }), a = (e, s) => {
7
- const f = s.current, o = e == null ? void 0 : e.querySelector('[data-state="active"]');
8
- if (!e || !(o instanceof HTMLButtonElement) || !(f instanceof HTMLSpanElement))
1
+ function l(t, r) {
2
+ const n = 'tr[tabindex="0"]', e = t.closest("table");
3
+ if (!e)
4
+ return null;
5
+ const o = Array.from(e.querySelectorAll(n)), c = o.indexOf(t) + (r === "ArrowUp" ? -1 : 1);
6
+ return c >= 0 && c < o.length ? o[c] : null;
7
+ }
8
+ function u(t) {
9
+ const r = t.target, n = r.closest("tr");
10
+ if (!n || r !== n || !["ArrowUp", "ArrowDown"].includes(t.key))
9
11
  return;
10
- const c = (e == null ? void 0 : e.scrollLeft) > (o == null ? void 0 : o.offsetLeft), d = (o == null ? void 0 : o.offsetLeft) + (o == null ? void 0 : o.offsetWidth) > (e == null ? void 0 : e.offsetWidth);
11
- c ? (e.offsetWidth > o.offsetWidth + o.offsetLeft ? f.style.left = `${o.offsetLeft}px` : f.style.left = `${e.offsetWidth - o.offsetWidth}px`, f.style.width = `${o == null ? void 0 : o.offsetWidth}px`) : d ? (f.style.left = `${e.clientWidth - o.offsetWidth}px`, f.style.width = `${o.offsetWidth}px`) : (f.style.left = `${o.offsetLeft}px`, f.style.width = `${o.offsetWidth}px`);
12
- }, O = ({
13
- activeTab: e
14
- }) => {
15
- const s = v(null), f = v(null), [o, c] = w([]), [d, u] = w([]);
16
- return W(() => {
17
- const t = s.current, n = t == null ? void 0 : t.querySelector('[data-state="active"]');
18
- n instanceof HTMLButtonElement && t instanceof HTMLDivElement && (a(t, f), n.scrollIntoView({ behavior: "smooth", block: "nearest", inline: "end" }));
19
- }, [e, f]), p(() => {
20
- var l;
21
- const t = s.current, n = t == null ? void 0 : t.querySelector('[data-state="active"]');
22
- if (t instanceof HTMLDivElement && n instanceof HTMLButtonElement) {
23
- a(t, f);
24
- const r = new MutationObserver(() => {
25
- n.scrollIntoView({ behavior: "instant", block: "nearest", inline: "end" }), a(t, f);
26
- });
27
- t.parentNode && r.observe(t.parentNode, { childList: !0 });
28
- const h = new IntersectionObserver(
29
- () => {
30
- u(b(o, t)), a(t, f);
31
- },
32
- {
33
- root: t,
34
- threshold: 1
35
- }
36
- );
37
- for (const i of o)
38
- (l = i.ref) != null && l.current && h.observe(i.ref.current);
39
- return () => {
40
- h.disconnect(), r.disconnect();
41
- };
42
- }
43
- }, [o, s, f]), {
44
- triggerListRef: s,
45
- activeIndicatorRef: f,
46
- triggersOutOfView: d,
47
- triggers: o,
48
- addTrigger: (t) => {
49
- c((n) => [...n, t]);
50
- }
51
- };
52
- };
12
+ const e = l(n, t.key);
13
+ e && (t.preventDefault(), e.focus());
14
+ }
53
15
  export {
54
- O as useTabTriggers
16
+ u as handleKeyDown
55
17
  };
56
18
  //# sourceMappingURL=fondue-components62.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"fondue-components62.js","sources":["../src/components/Tabs/hooks/useTabTriggers.tsx"],"sourcesContent":["/* (c) Copyright Frontify Ltd., all rights reserved. */\n\nimport { type RefObject, useEffect, useLayoutEffect, useRef, useState } from 'react';\n\nimport { type TabTrigger } from '../types';\n\nconst getOverflowingTriggers = (triggers: TabTrigger[], triggerListElement: HTMLDivElement) => {\n return triggers.filter((trigger) => {\n const triggerElement = trigger.ref?.current;\n if (!triggerElement) {\n return false;\n }\n return (\n triggerElement.offsetLeft + triggerElement.offsetWidth >\n triggerListElement?.scrollLeft + triggerListElement.offsetWidth ||\n triggerElement.offsetLeft - triggerListElement.scrollLeft < 0\n );\n });\n};\n\nconst moveActiveIndicator = (triggerListElement: HTMLDivElement, activeIndicatorRef: RefObject<HTMLSpanElement>) => {\n const activeIndicatorElement = activeIndicatorRef.current;\n const activeTriggerElement = triggerListElement?.querySelector('[data-state=\"active\"]');\n\n if (\n !triggerListElement ||\n !(activeTriggerElement instanceof HTMLButtonElement) ||\n !(activeIndicatorElement instanceof HTMLSpanElement)\n ) {\n return;\n }\n\n const isOverflowingLeft = triggerListElement?.scrollLeft > activeTriggerElement?.offsetLeft;\n const isOverflowingRight =\n activeTriggerElement?.offsetLeft + activeTriggerElement?.offsetWidth > triggerListElement?.offsetWidth;\n\n if (isOverflowingLeft) {\n const willFitAllItemsToTheLeft =\n triggerListElement.offsetWidth > activeTriggerElement.offsetWidth + activeTriggerElement.offsetLeft;\n if (willFitAllItemsToTheLeft) {\n activeIndicatorElement.style.left = `${activeTriggerElement.offsetLeft}px`;\n } else {\n activeIndicatorElement.style.left = `${triggerListElement.offsetWidth - activeTriggerElement.offsetWidth}px`;\n }\n activeIndicatorElement.style.width = `${activeTriggerElement?.offsetWidth}px`;\n } else if (isOverflowingRight) {\n activeIndicatorElement.style.left = `${triggerListElement.clientWidth - activeTriggerElement.offsetWidth}px`;\n activeIndicatorElement.style.width = `${activeTriggerElement.offsetWidth}px`;\n } else {\n activeIndicatorElement.style.left = `${activeTriggerElement.offsetLeft}px`;\n activeIndicatorElement.style.width = `${activeTriggerElement.offsetWidth}px`;\n }\n};\n\nexport const useTabTriggers = ({\n activeTab,\n}: {\n activeTab?: string;\n}): {\n triggerListRef: RefObject<HTMLDivElement>;\n activeIndicatorRef: RefObject<HTMLSpanElement>;\n triggers: TabTrigger[];\n triggersOutOfView: TabTrigger[];\n addTrigger: (trigger: TabTrigger) => void;\n} => {\n const triggerListRef = useRef<HTMLDivElement | null>(null);\n const activeIndicatorRef = useRef<HTMLSpanElement | null>(null);\n const [triggers, setTriggers] = useState<TabTrigger[]>([]);\n const [triggersOutOfView, setTriggersOutOfView] = useState<TabTrigger[]>([]);\n\n // move the active indicator and scroll to the correct position when the tab changes\n useEffect(() => {\n const triggerListElement = triggerListRef.current;\n const activeTriggerElement = triggerListElement?.querySelector('[data-state=\"active\"]');\n\n if (activeTriggerElement instanceof HTMLButtonElement && triggerListElement instanceof HTMLDivElement) {\n moveActiveIndicator(triggerListElement, activeIndicatorRef);\n activeTriggerElement.scrollIntoView({ behavior: 'smooth', block: 'nearest', inline: 'end' });\n }\n }, [activeTab, activeIndicatorRef]);\n\n useLayoutEffect(() => {\n const triggerListElement = triggerListRef.current;\n const activeTriggerElement = triggerListElement?.querySelector('[data-state=\"active\"]');\n\n if (triggerListElement instanceof HTMLDivElement && activeTriggerElement instanceof HTMLButtonElement) {\n // move the active indicator to the initial active tab\n moveActiveIndicator(triggerListElement, activeIndicatorRef);\n\n // observe addition of the dropdown trigger which reduces the available width\n const mutationObserver = new MutationObserver(() => {\n activeTriggerElement.scrollIntoView({ behavior: 'instant', block: 'nearest', inline: 'end' });\n moveActiveIndicator(triggerListElement, activeIndicatorRef);\n });\n if (triggerListElement.parentNode) {\n mutationObserver.observe(triggerListElement.parentNode, { childList: true });\n }\n\n // calculate the overflowing elements when item starts overflowing the parent\n const intersectionObserver = new IntersectionObserver(\n () => {\n setTriggersOutOfView(getOverflowingTriggers(triggers, triggerListElement));\n moveActiveIndicator(triggerListElement, activeIndicatorRef);\n },\n {\n root: triggerListElement,\n threshold: 1,\n },\n );\n for (const trigger of triggers) {\n if (trigger.ref?.current) {\n intersectionObserver.observe(trigger.ref.current);\n }\n }\n\n return () => {\n intersectionObserver.disconnect();\n mutationObserver.disconnect();\n };\n }\n }, [triggers, triggerListRef, activeIndicatorRef]);\n\n return {\n triggerListRef,\n activeIndicatorRef,\n triggersOutOfView,\n triggers,\n addTrigger: (trigger) => {\n setTriggers((prev) => [...prev, trigger]);\n },\n };\n};\n"],"names":["getOverflowingTriggers","triggers","triggerListElement","trigger","triggerElement","_a","moveActiveIndicator","activeIndicatorRef","activeIndicatorElement","activeTriggerElement","isOverflowingLeft","isOverflowingRight","useTabTriggers","activeTab","triggerListRef","useRef","setTriggers","useState","triggersOutOfView","setTriggersOutOfView","useEffect","useLayoutEffect","mutationObserver","intersectionObserver","prev"],"mappings":"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"}
1
+ {"version":3,"file":"fondue-components62.js","sources":["../src/components/Table/utils.ts"],"sourcesContent":["/* (c) Copyright Frontify Ltd., all rights reserved. */\n\nimport { type KeyboardEvent } from 'react';\n\nfunction getAdjacentRow(currentRow: HTMLElement, key: 'ArrowUp' | 'ArrowDown'): HTMLElement | null {\n const selector = 'tr[tabindex=\"0\"]';\n const table = currentRow.closest('table');\n if (!table) {\n return null;\n }\n\n const rows = Array.from(table.querySelectorAll(selector));\n const currentIndex = rows.indexOf(currentRow);\n const nextIndex = currentIndex + (key === 'ArrowUp' ? -1 : 1);\n\n return nextIndex >= 0 && nextIndex < rows.length ? (rows[nextIndex] as HTMLElement) : null;\n}\n\nexport function handleKeyDown(event: KeyboardEvent<HTMLTableElement>) {\n const target = event.target as HTMLElement;\n const currentRow = target.closest('tr');\n\n if (!currentRow || target !== currentRow || !['ArrowUp', 'ArrowDown'].includes(event.key)) {\n return;\n }\n\n const nextRow = getAdjacentRow(currentRow, event.key as 'ArrowUp' | 'ArrowDown');\n if (nextRow) {\n event.preventDefault();\n nextRow.focus();\n }\n}\n"],"names":["getAdjacentRow","currentRow","key","selector","table","rows","nextIndex","handleKeyDown","event","target","nextRow"],"mappings":"AAIA,SAASA,EAAeC,GAAyBC,GAAkD;AAC/F,QAAMC,IAAW,oBACXC,IAAQH,EAAW,QAAQ,OAAO;AACxC,MAAI,CAACG;AACM,WAAA;AAGX,QAAMC,IAAO,MAAM,KAAKD,EAAM,iBAAiBD,CAAQ,CAAC,GAElDG,IADeD,EAAK,QAAQJ,CAAU,KACVC,MAAQ,YAAY,KAAK;AAE3D,SAAOI,KAAa,KAAKA,IAAYD,EAAK,SAAUA,EAAKC,CAAS,IAAoB;AAC1F;AAEO,SAASC,EAAcC,GAAwC;AAClE,QAAMC,IAASD,EAAM,QACfP,IAAaQ,EAAO,QAAQ,IAAI;AAEtC,MAAI,CAACR,KAAcQ,MAAWR,KAAc,CAAC,CAAC,WAAW,WAAW,EAAE,SAASO,EAAM,GAAG;AACpF;AAGJ,QAAME,IAAUV,EAAeC,GAAYO,EAAM,GAA8B;AAC/E,EAAIE,MACAF,EAAM,eAAe,GACrBE,EAAQ,MAAM;AAEtB;"}
@@ -1,18 +1,56 @@
1
- const t = "_root_1s2mi_5", r = "_triggerList_1s2mi_14", i = "_triggerListWrapper_1s2mi_28", s = "_trigger_1s2mi_14", e = "_content_1s2mi_78", o = "_activeIndicator_1s2mi_82", g = {
2
- root: t,
3
- triggerList: r,
4
- triggerListWrapper: i,
5
- trigger: s,
6
- content: e,
7
- activeIndicator: o
1
+ import { useRef as v, useState as w, useEffect as W, useLayoutEffect as p } from "react";
2
+ const b = (e, s) => e.filter((f) => {
3
+ var c;
4
+ const o = (c = f.ref) == null ? void 0 : c.current;
5
+ return o ? o.offsetLeft + o.offsetWidth > (s == null ? void 0 : s.scrollLeft) + s.offsetWidth || o.offsetLeft - s.scrollLeft < 0 : !1;
6
+ }), a = (e, s) => {
7
+ const f = s.current, o = e == null ? void 0 : e.querySelector('[data-state="active"]');
8
+ if (!e || !(o instanceof HTMLButtonElement) || !(f instanceof HTMLSpanElement))
9
+ return;
10
+ const c = (e == null ? void 0 : e.scrollLeft) > (o == null ? void 0 : o.offsetLeft), d = (o == null ? void 0 : o.offsetLeft) + (o == null ? void 0 : o.offsetWidth) > (e == null ? void 0 : e.offsetWidth);
11
+ c ? (e.offsetWidth > o.offsetWidth + o.offsetLeft ? f.style.left = `${o.offsetLeft}px` : f.style.left = `${e.offsetWidth - o.offsetWidth}px`, f.style.width = `${o == null ? void 0 : o.offsetWidth}px`) : d ? (f.style.left = `${e.clientWidth - o.offsetWidth}px`, f.style.width = `${o.offsetWidth}px`) : (f.style.left = `${o.offsetLeft}px`, f.style.width = `${o.offsetWidth}px`);
12
+ }, O = ({
13
+ activeTab: e
14
+ }) => {
15
+ const s = v(null), f = v(null), [o, c] = w([]), [d, u] = w([]);
16
+ return W(() => {
17
+ const t = s.current, n = t == null ? void 0 : t.querySelector('[data-state="active"]');
18
+ n instanceof HTMLButtonElement && t instanceof HTMLDivElement && (a(t, f), n.scrollIntoView({ behavior: "smooth", block: "nearest", inline: "end" }));
19
+ }, [e, f]), p(() => {
20
+ var l;
21
+ const t = s.current, n = t == null ? void 0 : t.querySelector('[data-state="active"]');
22
+ if (t instanceof HTMLDivElement && n instanceof HTMLButtonElement) {
23
+ a(t, f);
24
+ const r = new MutationObserver(() => {
25
+ n.scrollIntoView({ behavior: "instant", block: "nearest", inline: "end" }), a(t, f);
26
+ });
27
+ t.parentNode && r.observe(t.parentNode, { childList: !0 });
28
+ const h = new IntersectionObserver(
29
+ () => {
30
+ u(b(o, t)), a(t, f);
31
+ },
32
+ {
33
+ root: t,
34
+ threshold: 1
35
+ }
36
+ );
37
+ for (const i of o)
38
+ (l = i.ref) != null && l.current && h.observe(i.ref.current);
39
+ return () => {
40
+ h.disconnect(), r.disconnect();
41
+ };
42
+ }
43
+ }, [o, s, f]), {
44
+ triggerListRef: s,
45
+ activeIndicatorRef: f,
46
+ triggersOutOfView: d,
47
+ triggers: o,
48
+ addTrigger: (t) => {
49
+ c((n) => [...n, t]);
50
+ }
51
+ };
8
52
  };
9
53
  export {
10
- o as activeIndicator,
11
- e as content,
12
- g as default,
13
- t as root,
14
- s as trigger,
15
- r as triggerList,
16
- i as triggerListWrapper
54
+ O as useTabTriggers
17
55
  };
18
56
  //# sourceMappingURL=fondue-components63.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"fondue-components63.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;"}
1
+ {"version":3,"file":"fondue-components63.js","sources":["../src/components/Tabs/hooks/useTabTriggers.tsx"],"sourcesContent":["/* (c) Copyright Frontify Ltd., all rights reserved. */\n\nimport { type RefObject, useEffect, useLayoutEffect, useRef, useState } from 'react';\n\nimport { type TabTrigger } from '../types';\n\nconst getOverflowingTriggers = (triggers: TabTrigger[], triggerListElement: HTMLDivElement) => {\n return triggers.filter((trigger) => {\n const triggerElement = trigger.ref?.current;\n if (!triggerElement) {\n return false;\n }\n return (\n triggerElement.offsetLeft + triggerElement.offsetWidth >\n triggerListElement?.scrollLeft + triggerListElement.offsetWidth ||\n triggerElement.offsetLeft - triggerListElement.scrollLeft < 0\n );\n });\n};\n\nconst moveActiveIndicator = (triggerListElement: HTMLDivElement, activeIndicatorRef: RefObject<HTMLSpanElement>) => {\n const activeIndicatorElement = activeIndicatorRef.current;\n const activeTriggerElement = triggerListElement?.querySelector('[data-state=\"active\"]');\n\n if (\n !triggerListElement ||\n !(activeTriggerElement instanceof HTMLButtonElement) ||\n !(activeIndicatorElement instanceof HTMLSpanElement)\n ) {\n return;\n }\n\n const isOverflowingLeft = triggerListElement?.scrollLeft > activeTriggerElement?.offsetLeft;\n const isOverflowingRight =\n activeTriggerElement?.offsetLeft + activeTriggerElement?.offsetWidth > triggerListElement?.offsetWidth;\n\n if (isOverflowingLeft) {\n const willFitAllItemsToTheLeft =\n triggerListElement.offsetWidth > activeTriggerElement.offsetWidth + activeTriggerElement.offsetLeft;\n if (willFitAllItemsToTheLeft) {\n activeIndicatorElement.style.left = `${activeTriggerElement.offsetLeft}px`;\n } else {\n activeIndicatorElement.style.left = `${triggerListElement.offsetWidth - activeTriggerElement.offsetWidth}px`;\n }\n activeIndicatorElement.style.width = `${activeTriggerElement?.offsetWidth}px`;\n } else if (isOverflowingRight) {\n activeIndicatorElement.style.left = `${triggerListElement.clientWidth - activeTriggerElement.offsetWidth}px`;\n activeIndicatorElement.style.width = `${activeTriggerElement.offsetWidth}px`;\n } else {\n activeIndicatorElement.style.left = `${activeTriggerElement.offsetLeft}px`;\n activeIndicatorElement.style.width = `${activeTriggerElement.offsetWidth}px`;\n }\n};\n\nexport const useTabTriggers = ({\n activeTab,\n}: {\n activeTab?: string;\n}): {\n triggerListRef: RefObject<HTMLDivElement>;\n activeIndicatorRef: RefObject<HTMLSpanElement>;\n triggers: TabTrigger[];\n triggersOutOfView: TabTrigger[];\n addTrigger: (trigger: TabTrigger) => void;\n} => {\n const triggerListRef = useRef<HTMLDivElement | null>(null);\n const activeIndicatorRef = useRef<HTMLSpanElement | null>(null);\n const [triggers, setTriggers] = useState<TabTrigger[]>([]);\n const [triggersOutOfView, setTriggersOutOfView] = useState<TabTrigger[]>([]);\n\n // move the active indicator and scroll to the correct position when the tab changes\n useEffect(() => {\n const triggerListElement = triggerListRef.current;\n const activeTriggerElement = triggerListElement?.querySelector('[data-state=\"active\"]');\n\n if (activeTriggerElement instanceof HTMLButtonElement && triggerListElement instanceof HTMLDivElement) {\n moveActiveIndicator(triggerListElement, activeIndicatorRef);\n activeTriggerElement.scrollIntoView({ behavior: 'smooth', block: 'nearest', inline: 'end' });\n }\n }, [activeTab, activeIndicatorRef]);\n\n useLayoutEffect(() => {\n const triggerListElement = triggerListRef.current;\n const activeTriggerElement = triggerListElement?.querySelector('[data-state=\"active\"]');\n\n if (triggerListElement instanceof HTMLDivElement && activeTriggerElement instanceof HTMLButtonElement) {\n // move the active indicator to the initial active tab\n moveActiveIndicator(triggerListElement, activeIndicatorRef);\n\n // observe addition of the dropdown trigger which reduces the available width\n const mutationObserver = new MutationObserver(() => {\n activeTriggerElement.scrollIntoView({ behavior: 'instant', block: 'nearest', inline: 'end' });\n moveActiveIndicator(triggerListElement, activeIndicatorRef);\n });\n if (triggerListElement.parentNode) {\n mutationObserver.observe(triggerListElement.parentNode, { childList: true });\n }\n\n // calculate the overflowing elements when item starts overflowing the parent\n const intersectionObserver = new IntersectionObserver(\n () => {\n setTriggersOutOfView(getOverflowingTriggers(triggers, triggerListElement));\n moveActiveIndicator(triggerListElement, activeIndicatorRef);\n },\n {\n root: triggerListElement,\n threshold: 1,\n },\n );\n for (const trigger of triggers) {\n if (trigger.ref?.current) {\n intersectionObserver.observe(trigger.ref.current);\n }\n }\n\n return () => {\n intersectionObserver.disconnect();\n mutationObserver.disconnect();\n };\n }\n }, [triggers, triggerListRef, activeIndicatorRef]);\n\n return {\n triggerListRef,\n activeIndicatorRef,\n triggersOutOfView,\n triggers,\n addTrigger: (trigger) => {\n setTriggers((prev) => [...prev, trigger]);\n },\n };\n};\n"],"names":["getOverflowingTriggers","triggers","triggerListElement","trigger","triggerElement","_a","moveActiveIndicator","activeIndicatorRef","activeIndicatorElement","activeTriggerElement","isOverflowingLeft","isOverflowingRight","useTabTriggers","activeTab","triggerListRef","useRef","setTriggers","useState","triggersOutOfView","setTriggersOutOfView","useEffect","useLayoutEffect","mutationObserver","intersectionObserver","prev"],"mappings":";AAMA,MAAMA,IAAyB,CAACC,GAAwBC,MAC7CD,EAAS,OAAO,CAACE,MAAY;;AAC1B,QAAAC,KAAiBC,IAAAF,EAAQ,QAAR,gBAAAE,EAAa;AACpC,SAAKD,IAIDA,EAAe,aAAaA,EAAe,eACvCF,KAAA,gBAAAA,EAAoB,cAAaA,EAAmB,eACxDE,EAAe,aAAaF,EAAmB,aAAa,IALrD;AAKqD,CAEnE,GAGCI,IAAsB,CAACJ,GAAoCK,MAAmD;AAChH,QAAMC,IAAyBD,EAAmB,SAC5CE,IAAuBP,KAAA,gBAAAA,EAAoB,cAAc;AAE/D,MACI,CAACA,KACD,EAAEO,aAAgC,sBAClC,EAAED,aAAkC;AAEpC;AAGE,QAAAE,KAAoBR,KAAA,gBAAAA,EAAoB,eAAaO,KAAA,gBAAAA,EAAsB,aAC3EE,KACFF,KAAA,gBAAAA,EAAsB,eAAaA,KAAA,gBAAAA,EAAsB,gBAAcP,KAAA,gBAAAA,EAAoB;AAE/F,EAAIQ,KAEIR,EAAmB,cAAcO,EAAqB,cAAcA,EAAqB,aAEzFD,EAAuB,MAAM,OAAO,GAAGC,EAAqB,UAAU,OAEtED,EAAuB,MAAM,OAAO,GAAGN,EAAmB,cAAcO,EAAqB,WAAW,MAE5GD,EAAuB,MAAM,QAAQ,GAAGC,KAAA,gBAAAA,EAAsB,WAAW,QAClEE,KACPH,EAAuB,MAAM,OAAO,GAAGN,EAAmB,cAAcO,EAAqB,WAAW,MACxGD,EAAuB,MAAM,QAAQ,GAAGC,EAAqB,WAAW,SAExED,EAAuB,MAAM,OAAO,GAAGC,EAAqB,UAAU,MACtED,EAAuB,MAAM,QAAQ,GAAGC,EAAqB,WAAW;AAEhF,GAEaG,IAAiB,CAAC;AAAA,EAC3B,WAAAC;AACJ,MAQK;AACK,QAAAC,IAAiBC,EAA8B,IAAI,GACnDR,IAAqBQ,EAA+B,IAAI,GACxD,CAACd,GAAUe,CAAW,IAAIC,EAAuB,CAAA,CAAE,GACnD,CAACC,GAAmBC,CAAoB,IAAIF,EAAuB,CAAA,CAAE;AAG3E,SAAAG,EAAU,MAAM;AACZ,UAAMlB,IAAqBY,EAAe,SACpCL,IAAuBP,KAAA,gBAAAA,EAAoB,cAAc;AAE3D,IAAAO,aAAgC,qBAAqBP,aAA8B,mBACnFI,EAAoBJ,GAAoBK,CAAkB,GACrCE,EAAA,eAAe,EAAE,UAAU,UAAU,OAAO,WAAW,QAAQ,OAAO;AAAA,EAC/F,GACD,CAACI,GAAWN,CAAkB,CAAC,GAElCc,EAAgB,MAAM;;AAClB,UAAMnB,IAAqBY,EAAe,SACpCL,IAAuBP,KAAA,gBAAAA,EAAoB,cAAc;AAE3D,QAAAA,aAA8B,kBAAkBO,aAAgC,mBAAmB;AAEnG,MAAAH,EAAoBJ,GAAoBK,CAAkB;AAGpD,YAAAe,IAAmB,IAAI,iBAAiB,MAAM;AAC3B,QAAAb,EAAA,eAAe,EAAE,UAAU,WAAW,OAAO,WAAW,QAAQ,OAAO,GAC5FH,EAAoBJ,GAAoBK,CAAkB;AAAA,MAAA,CAC7D;AACD,MAAIL,EAAmB,cACnBoB,EAAiB,QAAQpB,EAAmB,YAAY,EAAE,WAAW,IAAM;AAI/E,YAAMqB,IAAuB,IAAI;AAAA,QAC7B,MAAM;AACmB,UAAAJ,EAAAnB,EAAuBC,GAAUC,CAAkB,CAAC,GACzEI,EAAoBJ,GAAoBK,CAAkB;AAAA,QAC9D;AAAA,QACA;AAAA,UACI,MAAML;AAAA,UACN,WAAW;AAAA,QAAA;AAAA,MAEnB;AACA,iBAAWC,KAAWF;AACd,SAAAI,IAAAF,EAAQ,QAAR,QAAAE,EAAa,WACQkB,EAAA,QAAQpB,EAAQ,IAAI,OAAO;AAIxD,aAAO,MAAM;AACT,QAAAoB,EAAqB,WAAW,GAChCD,EAAiB,WAAW;AAAA,MAChC;AAAA,IAAA;AAAA,EAEL,GAAA,CAACrB,GAAUa,GAAgBP,CAAkB,CAAC,GAE1C;AAAA,IACH,gBAAAO;AAAA,IACA,oBAAAP;AAAA,IACA,mBAAAW;AAAA,IACA,UAAAjB;AAAA,IACA,YAAY,CAACE,MAAY;AACrB,MAAAa,EAAY,CAACQ,MAAS,CAAC,GAAGA,GAAMrB,CAAO,CAAC;AAAA,IAAA;AAAA,EAEhD;AACJ;"}
@@ -1,21 +1,18 @@
1
- const t = "_root_y2kt3_5", o = "_input_y2kt3_59", s = "_slot_y2kt3_78", _ = "_iconSuccess_y2kt3_128", n = "_iconError_y2kt3_136", c = "_loadingStatus_y2kt3_144", i = "_spin_y2kt3_1", r = {
1
+ const t = "_root_1s2mi_5", r = "_triggerList_1s2mi_14", i = "_triggerListWrapper_1s2mi_28", s = "_trigger_1s2mi_14", e = "_content_1s2mi_78", o = "_activeIndicator_1s2mi_82", g = {
2
2
  root: t,
3
- input: o,
4
- slot: s,
5
- iconSuccess: _,
6
- iconError: n,
7
- loadingStatus: c,
8
- spin: i,
9
- "tw-dark": "_tw-dark_y2kt3_176"
3
+ triggerList: r,
4
+ triggerListWrapper: i,
5
+ trigger: s,
6
+ content: e,
7
+ activeIndicator: o
10
8
  };
11
9
  export {
12
- r as default,
13
- n as iconError,
14
- _ as iconSuccess,
15
- o as input,
16
- c as loadingStatus,
10
+ o as activeIndicator,
11
+ e as content,
12
+ g as default,
17
13
  t as root,
18
- s as slot,
19
- i as spin
14
+ s as trigger,
15
+ r as triggerList,
16
+ i as triggerListWrapper
20
17
  };
21
18
  //# sourceMappingURL=fondue-components64.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"fondue-components64.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;"}
1
+ {"version":3,"file":"fondue-components64.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;"}
@@ -1,10 +1,21 @@
1
- const o = "_root_18vgg_4", r = "_arrow_18vgg_22", t = {
2
- root: o,
3
- arrow: r
1
+ const t = "_root_y2kt3_5", o = "_input_y2kt3_59", s = "_slot_y2kt3_78", _ = "_iconSuccess_y2kt3_128", n = "_iconError_y2kt3_136", c = "_loadingStatus_y2kt3_144", i = "_spin_y2kt3_1", r = {
2
+ root: t,
3
+ input: o,
4
+ slot: s,
5
+ iconSuccess: _,
6
+ iconError: n,
7
+ loadingStatus: c,
8
+ spin: i,
9
+ "tw-dark": "_tw-dark_y2kt3_176"
4
10
  };
5
11
  export {
6
- r as arrow,
7
- t as default,
8
- o as root
12
+ r as default,
13
+ n as iconError,
14
+ _ as iconSuccess,
15
+ o as input,
16
+ c as loadingStatus,
17
+ t as root,
18
+ s as slot,
19
+ i as spin
9
20
  };
10
21
  //# sourceMappingURL=fondue-components65.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"fondue-components65.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;"}
1
+ {"version":3,"file":"fondue-components65.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;"}
@@ -1,5 +1,10 @@
1
- const t = "focus-visible:tw-outline has-[[data-show-focus-ring=true]]:tw-outline tw-outline-4 tw-outline-offset-2 tw-outline-blue focus-visible:tw-outline-blue";
1
+ const o = "_root_18vgg_4", r = "_arrow_18vgg_22", t = {
2
+ root: o,
3
+ arrow: r
4
+ };
2
5
  export {
3
- t as FOCUS_OUTLINE
6
+ r as arrow,
7
+ t as default,
8
+ o as root
4
9
  };
5
10
  //# sourceMappingURL=fondue-components66.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"fondue-components66.js","sources":["../src/utilities/focusStyle.ts"],"sourcesContent":["/* (c) Copyright Frontify Ltd., all rights reserved. */\n\nexport const FOCUS_OUTLINE =\n 'focus-visible:tw-outline has-[[data-show-focus-ring=true]]:tw-outline tw-outline-4 tw-outline-offset-2 tw-outline-blue focus-visible:tw-outline-blue'; // second declaration of tw-outline-blue is to assure that in firefox the outline isn't overriden by a global definition of :-moz-focusring which is coming from tailwinds normalization styling\n"],"names":["FOCUS_OUTLINE"],"mappings":"AAEO,MAAMA,IACT;"}
1
+ {"version":3,"file":"fondue-components66.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;"}
@@ -1,18 +1,5 @@
1
- const o = "_root_8a8rm_5", t = "_button_8a8rm_56", c = "_colorIndicator_8a8rm_69", r = "_actions_8a8rm_75", a = "_clear_8a8rm_85", _ = "_caret_8a8rm_98", n = {
2
- root: o,
3
- button: t,
4
- colorIndicator: c,
5
- actions: r,
6
- clear: a,
7
- caret: _
8
- };
1
+ const t = "focus-visible:tw-outline has-[[data-show-focus-ring=true]]:tw-outline tw-outline-4 tw-outline-offset-2 tw-outline-blue focus-visible:tw-outline-blue";
9
2
  export {
10
- r as actions,
11
- t as button,
12
- _ as caret,
13
- a as clear,
14
- c as colorIndicator,
15
- n as default,
16
- o as root
3
+ t as FOCUS_OUTLINE
17
4
  };
18
5
  //# sourceMappingURL=fondue-components67.js.map