@frontify/fondue-components 23.0.0 → 24.0.0-rc.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 (179) hide show
  1. package/dist/fondue-components.js +50 -46
  2. package/dist/fondue-components.js.map +1 -1
  3. package/dist/fondue-components10.js +3 -3
  4. package/dist/fondue-components10.js.map +1 -1
  5. package/dist/fondue-components11.js +104 -86
  6. package/dist/fondue-components11.js.map +1 -1
  7. package/dist/fondue-components12.js +2 -2
  8. package/dist/fondue-components13.js +58 -57
  9. package/dist/fondue-components13.js.map +1 -1
  10. package/dist/fondue-components14.js +2 -2
  11. package/dist/fondue-components15.js +2 -2
  12. package/dist/fondue-components16.js +2 -2
  13. package/dist/fondue-components17.js +56 -36
  14. package/dist/fondue-components17.js.map +1 -1
  15. package/dist/fondue-components18.js +34 -16
  16. package/dist/fondue-components18.js.map +1 -1
  17. package/dist/fondue-components19.js +18 -73
  18. package/dist/fondue-components19.js.map +1 -1
  19. package/dist/fondue-components20.js +18 -36
  20. package/dist/fondue-components20.js.map +1 -1
  21. package/dist/fondue-components21.js +71 -50
  22. package/dist/fondue-components21.js.map +1 -1
  23. package/dist/fondue-components22.js +36 -138
  24. package/dist/fondue-components22.js.map +1 -1
  25. package/dist/fondue-components23.js +50 -50
  26. package/dist/fondue-components23.js.map +1 -1
  27. package/dist/fondue-components24.js +138 -33
  28. package/dist/fondue-components24.js.map +1 -1
  29. package/dist/fondue-components25.js +52 -193
  30. package/dist/fondue-components25.js.map +1 -1
  31. package/dist/fondue-components26.js +30 -134
  32. package/dist/fondue-components26.js.map +1 -1
  33. package/dist/fondue-components27.js +191 -126
  34. package/dist/fondue-components27.js.map +1 -1
  35. package/dist/fondue-components28.js +134 -30
  36. package/dist/fondue-components28.js.map +1 -1
  37. package/dist/fondue-components29.js +130 -63
  38. package/dist/fondue-components29.js.map +1 -1
  39. package/dist/fondue-components3.js +1 -1
  40. package/dist/fondue-components30.js +31 -101
  41. package/dist/fondue-components30.js.map +1 -1
  42. package/dist/fondue-components31.js +64 -30
  43. package/dist/fondue-components31.js.map +1 -1
  44. package/dist/fondue-components32.js +98 -52
  45. package/dist/fondue-components32.js.map +1 -1
  46. package/dist/fondue-components33.js +30 -20
  47. package/dist/fondue-components33.js.map +1 -1
  48. package/dist/fondue-components34.js +56 -23
  49. package/dist/fondue-components34.js.map +1 -1
  50. package/dist/fondue-components35.js +20 -7
  51. package/dist/fondue-components35.js.map +1 -1
  52. package/dist/fondue-components36.js +23 -6
  53. package/dist/fondue-components36.js.map +1 -1
  54. package/dist/fondue-components37.js +8 -32
  55. package/dist/fondue-components37.js.map +1 -1
  56. package/dist/fondue-components38.js +5 -3
  57. package/dist/fondue-components38.js.map +1 -1
  58. package/dist/fondue-components39.js +32 -12
  59. package/dist/fondue-components39.js.map +1 -1
  60. package/dist/fondue-components4.js +3 -3
  61. package/dist/fondue-components40.js +5 -155
  62. package/dist/fondue-components40.js.map +1 -1
  63. package/dist/fondue-components41.js +18 -116
  64. package/dist/fondue-components41.js.map +1 -1
  65. package/dist/fondue-components42.js +59 -22
  66. package/dist/fondue-components42.js.map +1 -1
  67. package/dist/fondue-components43.js +111 -14
  68. package/dist/fondue-components43.js.map +1 -1
  69. package/dist/fondue-components44.js +116 -30
  70. package/dist/fondue-components44.js.map +1 -1
  71. package/dist/fondue-components45.js +21 -54
  72. package/dist/fondue-components45.js.map +1 -1
  73. package/dist/fondue-components46.js +31 -130
  74. package/dist/fondue-components46.js.map +1 -1
  75. package/dist/fondue-components47.js +53 -20
  76. package/dist/fondue-components47.js.map +1 -1
  77. package/dist/fondue-components48.js +131 -53
  78. package/dist/fondue-components48.js.map +1 -1
  79. package/dist/fondue-components49.js +20 -7
  80. package/dist/fondue-components49.js.map +1 -1
  81. package/dist/fondue-components5.js +2 -2
  82. package/dist/fondue-components50.js +53 -13
  83. package/dist/fondue-components50.js.map +1 -1
  84. package/dist/fondue-components51.js +7 -14
  85. package/dist/fondue-components51.js.map +1 -1
  86. package/dist/fondue-components52.js +13 -5
  87. package/dist/fondue-components52.js.map +1 -1
  88. package/dist/fondue-components53.js +15 -60
  89. package/dist/fondue-components53.js.map +1 -1
  90. package/dist/fondue-components54.js +5 -18
  91. package/dist/fondue-components54.js.map +1 -1
  92. package/dist/fondue-components55.js +60 -19
  93. package/dist/fondue-components55.js.map +1 -1
  94. package/dist/fondue-components56.js +18 -5
  95. package/dist/fondue-components56.js.map +1 -1
  96. package/dist/fondue-components57.js +18 -14
  97. package/dist/fondue-components57.js.map +1 -1
  98. package/dist/fondue-components58.js +1 -1
  99. package/dist/fondue-components59.js +10 -16
  100. package/dist/fondue-components59.js.map +1 -1
  101. package/dist/fondue-components6.js +4 -4
  102. package/dist/fondue-components60.js +4 -10
  103. package/dist/fondue-components60.js.map +1 -1
  104. package/dist/fondue-components61.js +18 -35
  105. package/dist/fondue-components61.js.map +1 -1
  106. package/dist/fondue-components62.js +10 -4
  107. package/dist/fondue-components62.js.map +1 -1
  108. package/dist/fondue-components63.js +34 -10
  109. package/dist/fondue-components63.js.map +1 -1
  110. package/dist/fondue-components64.js +35 -5
  111. package/dist/fondue-components64.js.map +1 -1
  112. package/dist/fondue-components65.js +4 -24
  113. package/dist/fondue-components65.js.map +1 -1
  114. package/dist/fondue-components66.js +12 -16
  115. package/dist/fondue-components66.js.map +1 -1
  116. package/dist/fondue-components67.js +4 -151
  117. package/dist/fondue-components67.js.map +1 -1
  118. package/dist/fondue-components68.js +25 -19
  119. package/dist/fondue-components68.js.map +1 -1
  120. package/dist/fondue-components69.js +16 -77
  121. package/dist/fondue-components69.js.map +1 -1
  122. package/dist/fondue-components7.js +2 -2
  123. package/dist/fondue-components70.js +152 -8
  124. package/dist/fondue-components70.js.map +1 -1
  125. package/dist/fondue-components71.js +19 -37
  126. package/dist/fondue-components71.js.map +1 -1
  127. package/dist/fondue-components72.js +76 -69
  128. package/dist/fondue-components72.js.map +1 -1
  129. package/dist/fondue-components73.js +8 -11
  130. package/dist/fondue-components73.js.map +1 -1
  131. package/dist/fondue-components74.js +36 -12
  132. package/dist/fondue-components74.js.map +1 -1
  133. package/dist/fondue-components75.js +70 -12
  134. package/dist/fondue-components75.js.map +1 -1
  135. package/dist/fondue-components76.js +10 -22
  136. package/dist/fondue-components76.js.map +1 -1
  137. package/dist/fondue-components77.js +13 -34
  138. package/dist/fondue-components77.js.map +1 -1
  139. package/dist/fondue-components78.js +12 -10
  140. package/dist/fondue-components78.js.map +1 -1
  141. package/dist/fondue-components79.js +22 -67
  142. package/dist/fondue-components79.js.map +1 -1
  143. package/dist/fondue-components8.js +5 -5
  144. package/dist/fondue-components80.js +34 -15
  145. package/dist/fondue-components80.js.map +1 -1
  146. package/dist/fondue-components81.js +9 -24
  147. package/dist/fondue-components81.js.map +1 -1
  148. package/dist/fondue-components82.js +67 -18
  149. package/dist/fondue-components82.js.map +1 -1
  150. package/dist/fondue-components83.js +14 -22
  151. package/dist/fondue-components83.js.map +1 -1
  152. package/dist/fondue-components84.js +24 -6
  153. package/dist/fondue-components84.js.map +1 -1
  154. package/dist/fondue-components85.js +18 -19
  155. package/dist/fondue-components85.js.map +1 -1
  156. package/dist/fondue-components86.js +21 -5
  157. package/dist/fondue-components86.js.map +1 -1
  158. package/dist/fondue-components87.js +8 -4
  159. package/dist/fondue-components87.js.map +1 -1
  160. package/dist/fondue-components88.js +19 -4
  161. package/dist/fondue-components88.js.map +1 -1
  162. package/dist/fondue-components89.js +4 -14
  163. package/dist/fondue-components89.js.map +1 -1
  164. package/dist/fondue-components9.js +5 -5
  165. package/dist/fondue-components90.js +5 -2
  166. package/dist/fondue-components90.js.map +1 -1
  167. package/dist/fondue-components91.js +4 -39
  168. package/dist/fondue-components91.js.map +1 -1
  169. package/dist/fondue-components92.js +39 -20
  170. package/dist/fondue-components92.js.map +1 -1
  171. package/dist/fondue-components93.js +24 -0
  172. package/dist/fondue-components93.js.map +1 -0
  173. package/dist/fondue-components94.js +5 -0
  174. package/dist/fondue-components94.js.map +1 -0
  175. package/dist/fondue-components95.js +20 -0
  176. package/dist/fondue-components95.js.map +1 -0
  177. package/dist/index.d.ts +116 -3
  178. package/dist/style.css +1 -1
  179. package/package.json +6 -6
@@ -1 +1 @@
1
- {"version":3,"file":"fondue-components35.js","sources":["../src/components/Badge/BadgeStatus.tsx"],"sourcesContent":["/* (c) Copyright Frontify Ltd., all rights reserved. */\n\nimport styles from './styles/badgestatus.module.scss';\nimport { type RgbaColor } from './types';\nimport { colorToCss } from './utils';\n\ntype BadgeStatusType = 'default' | 'positive' | 'highlight' | 'warning' | 'negative';\n\nconst badgeStatusMap = ['default', 'positive', 'highlight', 'warning', 'negative'];\n\nexport type BadgeStatusProps = { status: BadgeStatusType } | { status: RgbaColor | string };\n\nconst isBadgeStatusType = (value: RgbaColor | string): value is BadgeStatusType =>\n typeof value === 'string' && badgeStatusMap.includes(value);\n\nexport const BadgeStatus = ({ status }: BadgeStatusProps) => {\n const colorProps = isBadgeStatusType(status)\n ? { 'data-status': status }\n : { style: { backgroundColor: typeof status === 'string' ? status : colorToCss(status) || 'transparent' } };\n\n return <div data-test-id=\"badge-status\" className={styles.root} {...colorProps}></div>;\n};\n"],"names":["badgeStatusMap","isBadgeStatusType","value","BadgeStatus","status","colorProps","colorToCss","jsx","styles"],"mappings":";;;AAQA,MAAMA,IAAiB,CAAC,WAAW,YAAY,aAAa,WAAW,UAAU,GAI3EC,IAAoB,CAACC,MACvB,OAAOA,KAAU,YAAYF,EAAe,SAASE,CAAK,GAEjDC,IAAc,CAAC,EAAE,QAAAC,QAA+B;AACzD,QAAMC,IAAaJ,EAAkBG,CAAM,IACrC,EAAE,eAAeA,EAAA,IACjB,EAAE,OAAO,EAAE,iBAAiB,OAAOA,KAAW,WAAWA,IAASE,EAAWF,CAAM,KAAK,gBAAc;AAE5G,SAAO,gBAAAG,EAAC,SAAI,gBAAa,gBAAe,WAAWC,EAAO,MAAO,GAAGH,GAAY;AACpF;"}
1
+ {"version":3,"file":"fondue-components35.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;"}
@@ -1,10 +1,27 @@
1
- const s = "_root_i684q_3", o = "_dismiss_i684q_156", t = {
2
- root: s,
3
- dismiss: o
1
+ import { useContext as i, useCallback as u } from "react";
2
+ import { ThemeContext as c } from "./fondue-components33.js";
3
+ const d = () => {
4
+ const { translations: r } = i(c);
5
+ return {
6
+ /** Translation function */
7
+ t: u(
8
+ (o, e) => {
9
+ const n = r[o];
10
+ if (n === void 0)
11
+ return process.env.NODE_ENV !== "production" && console.warn(`[Fondue] Translation key "${o}" not found`), o;
12
+ if (typeof n != "string")
13
+ return process.env.NODE_ENV !== "production" && console.warn(`[Fondue] Translation value for key "${o}" is not a string`), o;
14
+ let t = n;
15
+ if (e)
16
+ for (const [s, a] of Object.entries(e))
17
+ t = t.replaceAll(`\${${s}}`, a);
18
+ return t;
19
+ },
20
+ [r]
21
+ )
22
+ };
4
23
  };
5
24
  export {
6
- t as default,
7
- o as dismiss,
8
- s as root
25
+ d as useTranslation
9
26
  };
10
27
  //# sourceMappingURL=fondue-components36.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"fondue-components36.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;"}
1
+ {"version":3,"file":"fondue-components36.js","sources":["../src/hooks/useTranslation.ts"],"sourcesContent":["/* (c) Copyright Frontify Ltd., all rights reserved. */\n\nimport { useCallback, useContext } from 'react';\n\nimport { ThemeContext } from '../components/ThemeProvider/ThemeProvider';\n\n/**\n * Hook to access translation functionality.\n *\n * @returns Object containing translation function\n *\n * @example\n * ```tsx\n * const { t } = useTranslation();\n *\n * // Simple translation\n * const label = t('ColorPicker_selectColor');\n *\n * // Translation with variables\n * const sortLabel = t('Table_sortByAscending', { column: 'Name' });\n * ```\n */\nexport const useTranslation = () => {\n const { translations } = useContext(ThemeContext);\n\n /**\n * Translates a key to its localized string value.\n * Keys follow the format ComponentName_localLabelName[_moreLocalLabelName]\n * and support variable interpolation using ${variable} syntax.\n *\n * @param key - The translation key (e.g., 'ColorPicker_selectColor')\n * @param variables - Optional variables to interpolate into the translation\n * @returns The translated string, or the key itself if translation is not found\n */\n const t = useCallback(\n (key: keyof typeof translations, variables?: Record<string, string>): string => {\n // Direct lookup for flat keys\n const value = translations[key];\n\n if (value === undefined) {\n if (process.env.NODE_ENV !== 'production') {\n console.warn(`[Fondue] Translation key \"${key}\" not found`);\n }\n return key;\n }\n\n if (typeof value !== 'string') {\n if (process.env.NODE_ENV !== 'production') {\n console.warn(`[Fondue] Translation value for key \"${key}\" is not a string`);\n }\n return key;\n }\n\n let text = value;\n\n // Variable interpolation: replace ${variable} with actual values\n if (variables) {\n for (const [varKey, varValue] of Object.entries(variables)) {\n text = text.replaceAll(`\\${${varKey}}`, varValue);\n }\n }\n\n return text;\n },\n [translations],\n );\n\n return {\n /** Translation function */\n t,\n };\n};\n"],"names":["useTranslation","translations","useContext","ThemeContext","useCallback","key","variables","value","text","varKey","varValue"],"mappings":";;AAsBO,MAAMA,IAAiB,MAAM;AAChC,QAAM,EAAE,cAAAC,EAAA,IAAiBC,EAAWC,CAAY;AA4ChD,SAAO;AAAA;AAAA,IAEH,GAnCMC;AAAA,MACN,CAACC,GAAgCC,MAA+C;AAE5E,cAAMC,IAAQN,EAAaI,CAAG;AAE9B,YAAIE,MAAU;AACV,iBAAI,QAAQ,IAAI,aAAa,gBACzB,QAAQ,KAAK,6BAA6BF,CAAG,aAAa,GAEvDA;AAGX,YAAI,OAAOE,KAAU;AACjB,iBAAI,QAAQ,IAAI,aAAa,gBACzB,QAAQ,KAAK,uCAAuCF,CAAG,mBAAmB,GAEvEA;AAGX,YAAIG,IAAOD;AAGX,YAAID;AACA,qBAAW,CAACG,GAAQC,CAAQ,KAAK,OAAO,QAAQJ,CAAS;AACrD,YAAAE,IAAOA,EAAK,WAAW,MAAMC,CAAM,KAAKC,CAAQ;AAIxD,eAAOF;AAAA,MACX;AAAA,MACA,CAACP,CAAY;AAAA,IAAA;AAAA,EAKb;AAER;"}
@@ -1,35 +1,11 @@
1
- const g = (n) => n.startsWith("aria-") || n === "role", s = {
2
- m: "margin",
3
- mx: "margin-x",
4
- my: "margin-y",
5
- mt: "margin-top",
6
- mr: "margin-right",
7
- mb: "margin-bottom",
8
- ml: "margin-left",
9
- p: "padding",
10
- px: "padding-x",
11
- py: "padding-y",
12
- pt: "padding-top",
13
- pr: "padding-right",
14
- pb: "padding-bottom",
15
- pl: "padding-left",
16
- direction: "flex-direction",
17
- align: "align-items",
18
- wrap: "flex-wrap",
19
- columns: "grid-template-columns",
20
- rows: "grid-template-rows"
21
- }, m = (n, r) => n === "columns" || n === "rows" ? typeof r == "number" ? `repeat(${r}, 1fr)` : r : typeof r == "number" ? `${r * 0.25}rem` : r, f = (n, r = {}) => Object.entries(n).reduce((i, [t, o]) => {
22
- if (g(t))
23
- return i;
24
- const e = t in r ? r[t] : t in s ? s[t] : t, p = e == null ? void 0 : e.replaceAll(/([\da-z]|(?=[A-Z]))([A-Z])/g, "$1-$2").toLowerCase();
25
- if (typeof o == "object")
26
- for (const [d, a] of Object.entries(o))
27
- a !== void 0 && (i[`--${d}-${p}`] = m(t, a));
28
- else
29
- i[`--${p}`] = m(t, o);
30
- return i;
31
- }, {});
1
+ import { jsx as r } from "react/jsx-runtime";
2
+ import s from "./fondue-components90.js";
3
+ import { colorToCss as e } from "./fondue-components91.js";
4
+ const a = ["default", "positive", "highlight", "warning", "negative"], i = (t) => typeof t == "string" && a.includes(t), p = ({ status: t }) => {
5
+ const o = i(t) ? { "data-status": t } : { style: { backgroundColor: typeof t == "string" ? t : e(t) || "transparent" } };
6
+ return /* @__PURE__ */ r("div", { "data-test-id": "badge-status", className: s.root, ...o });
7
+ };
32
8
  export {
33
- f as propsToCssVariables
9
+ p as BadgeStatus
34
10
  };
35
11
  //# sourceMappingURL=fondue-components37.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"fondue-components37.js","sources":["../src/helpers/propsToCssVariables.ts"],"sourcesContent":["/* (c) Copyright Frontify Ltd., all rights reserved. */\n\nimport { type CSSProperties } from 'react';\n\nimport { type Breakpoint } from './layout';\n\nconst isAriaProp = (key: string): boolean => {\n return key.startsWith('aria-') || key === 'role';\n};\n\nconst abbreviationToCssProperty: Record<string, string> = {\n m: 'margin',\n mx: 'margin-x',\n my: 'margin-y',\n mt: 'margin-top',\n mr: 'margin-right',\n mb: 'margin-bottom',\n ml: 'margin-left',\n p: 'padding',\n px: 'padding-x',\n py: 'padding-y',\n pt: 'padding-top',\n pr: 'padding-right',\n pb: 'padding-bottom',\n pl: 'padding-left',\n direction: 'flex-direction',\n align: 'align-items',\n wrap: 'flex-wrap',\n columns: 'grid-template-columns',\n rows: 'grid-template-rows',\n};\n\nconst transformValueBasedOnKey = (key: string, value: string | number): string | number => {\n if (key === 'columns' || key === 'rows') {\n if (typeof value === 'number') {\n return `repeat(${value}, 1fr)`;\n }\n return value;\n }\n\n // Spacing tokens\n if (typeof value === 'number') {\n return `${value * 0.25}rem`;\n }\n\n return value;\n};\n\nexport const propsToCssVariables = (\n props: Record<string, string | number | boolean | { [key in Breakpoint]?: string | number | boolean }>,\n extraAbbreviationToCssProperty: Record<string, string> = {},\n): CSSProperties => {\n return Object.entries(props).reduce((acc, [key, value]) => {\n if (isAriaProp(key)) {\n return acc;\n }\n\n const cssProperty =\n key in extraAbbreviationToCssProperty\n ? extraAbbreviationToCssProperty[key]\n : key in abbreviationToCssProperty\n ? abbreviationToCssProperty[key]\n : key;\n // The lookahead is necessary to split camelCase boundaries; disabling false-positive lint warning\n const cssPropertyKebabCase = cssProperty?.replaceAll(/([\\da-z]|(?=[A-Z]))([A-Z])/g, '$1-$2').toLowerCase();\n\n if (typeof value === 'object') {\n for (const [breakpoint, breakpointValue] of Object.entries(value)) {\n if (breakpointValue !== undefined) {\n // @ts-expect-error CSS variables are not typed into `CSSProperties`\n acc[`--${breakpoint}-${cssPropertyKebabCase}`] = transformValueBasedOnKey(key, breakpointValue);\n }\n }\n } else {\n // @ts-expect-error CSS variables are not typed into `CSSProperties`\n acc[`--${cssPropertyKebabCase}`] = transformValueBasedOnKey(key, value);\n }\n\n return acc;\n }, {} as CSSProperties);\n};\n"],"names":["isAriaProp","key","abbreviationToCssProperty","transformValueBasedOnKey","value","propsToCssVariables","props","extraAbbreviationToCssProperty","acc","cssProperty","cssPropertyKebabCase","breakpoint","breakpointValue"],"mappings":"AAMA,MAAMA,IAAa,CAACC,MACTA,EAAI,WAAW,OAAO,KAAKA,MAAQ,QAGxCC,IAAoD;AAAA,EACtD,GAAG;AAAA,EACH,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,GAAG;AAAA,EACH,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,WAAW;AAAA,EACX,OAAO;AAAA,EACP,MAAM;AAAA,EACN,SAAS;AAAA,EACT,MAAM;AACV,GAEMC,IAA2B,CAACF,GAAaG,MACvCH,MAAQ,aAAaA,MAAQ,SACzB,OAAOG,KAAU,WACV,UAAUA,CAAK,WAEnBA,IAIP,OAAOA,KAAU,WACV,GAAGA,IAAQ,IAAI,QAGnBA,GAGEC,IAAsB,CAC/BC,GACAC,IAAyD,OAElD,OAAO,QAAQD,CAAK,EAAE,OAAO,CAACE,GAAK,CAACP,GAAKG,CAAK,MAAM;AACvD,MAAIJ,EAAWC,CAAG;AACd,WAAOO;AAGX,QAAMC,IACFR,KAAOM,IACDA,EAA+BN,CAAG,IAClCA,KAAOC,IACLA,EAA0BD,CAAG,IAC7BA,GAENS,IAAuBD,KAAA,gBAAAA,EAAa,WAAW,+BAA+B,SAAS;AAE7F,MAAI,OAAOL,KAAU;AACjB,eAAW,CAACO,GAAYC,CAAe,KAAK,OAAO,QAAQR,CAAK;AAC5D,MAAIQ,MAAoB,WAEpBJ,EAAI,KAAKG,CAAU,IAAID,CAAoB,EAAE,IAAIP,EAAyBF,GAAKW,CAAe;AAAA;AAKtG,IAAAJ,EAAI,KAAKE,CAAoB,EAAE,IAAIP,EAAyBF,GAAKG,CAAK;AAG1E,SAAOI;AACX,GAAG,CAAA,CAAmB;"}
1
+ {"version":3,"file":"fondue-components37.js","sources":["../src/components/Badge/BadgeStatus.tsx"],"sourcesContent":["/* (c) Copyright Frontify Ltd., all rights reserved. */\n\nimport styles from './styles/badgestatus.module.scss';\nimport { type RgbaColor } from './types';\nimport { colorToCss } from './utils';\n\ntype BadgeStatusType = 'default' | 'positive' | 'highlight' | 'warning' | 'negative';\n\nconst badgeStatusMap = ['default', 'positive', 'highlight', 'warning', 'negative'];\n\nexport type BadgeStatusProps = { status: BadgeStatusType } | { status: RgbaColor | string };\n\nconst isBadgeStatusType = (value: RgbaColor | string): value is BadgeStatusType =>\n typeof value === 'string' && badgeStatusMap.includes(value);\n\nexport const BadgeStatus = ({ status }: BadgeStatusProps) => {\n const colorProps = isBadgeStatusType(status)\n ? { 'data-status': status }\n : { style: { backgroundColor: typeof status === 'string' ? status : colorToCss(status) || 'transparent' } };\n\n return <div data-test-id=\"badge-status\" className={styles.root} {...colorProps}></div>;\n};\n"],"names":["badgeStatusMap","isBadgeStatusType","value","BadgeStatus","status","colorProps","colorToCss","jsx","styles"],"mappings":";;;AAQA,MAAMA,IAAiB,CAAC,WAAW,YAAY,aAAa,WAAW,UAAU,GAI3EC,IAAoB,CAACC,MACvB,OAAOA,KAAU,YAAYF,EAAe,SAASE,CAAK,GAEjDC,IAAc,CAAC,EAAE,QAAAC,QAA+B;AACzD,QAAMC,IAAaJ,EAAkBG,CAAM,IACrC,EAAE,eAAeA,EAAA,IACjB,EAAE,OAAO,EAAE,iBAAiB,OAAOA,KAAW,WAAWA,IAASE,EAAWF,CAAM,KAAK,gBAAc;AAE5G,SAAO,gBAAAG,EAAC,SAAI,gBAAa,gBAAe,WAAWC,EAAO,MAAO,GAAGH,GAAY;AACpF;"}
@@ -1,8 +1,10 @@
1
- const o = "_root_f9dx4_6", t = {
2
- root: o
1
+ const s = "_root_o6e73_3", o = "_dismiss_o6e73_156", t = {
2
+ root: s,
3
+ dismiss: o
3
4
  };
4
5
  export {
5
6
  t as default,
6
- o as root
7
+ o as dismiss,
8
+ s as root
7
9
  };
8
10
  //# sourceMappingURL=fondue-components38.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"fondue-components38.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;"}
1
+ {"version":3,"file":"fondue-components38.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;"}
@@ -1,15 +1,35 @@
1
- import { extendTailwindMerge as e } from "tailwind-merge";
2
- import { tv as o } from "tailwind-variants";
3
- const r = e({
4
- prefix: "tw-",
5
- extend: {
6
- classGroups: {
7
- "font-size": ["text-body-x-small", "text-body-small", "text-body-medium", "text-body-large"]
8
- }
9
- }
10
- }), m = (...t) => r(...t), x = (t) => o(t);
1
+ const g = (n) => n.startsWith("aria-") || n === "role", s = {
2
+ m: "margin",
3
+ mx: "margin-x",
4
+ my: "margin-y",
5
+ mt: "margin-top",
6
+ mr: "margin-right",
7
+ mb: "margin-bottom",
8
+ ml: "margin-left",
9
+ p: "padding",
10
+ px: "padding-x",
11
+ py: "padding-y",
12
+ pt: "padding-top",
13
+ pr: "padding-right",
14
+ pb: "padding-bottom",
15
+ pl: "padding-left",
16
+ direction: "flex-direction",
17
+ align: "align-items",
18
+ wrap: "flex-wrap",
19
+ columns: "grid-template-columns",
20
+ rows: "grid-template-rows"
21
+ }, m = (n, r) => n === "columns" || n === "rows" ? typeof r == "number" ? `repeat(${r}, 1fr)` : r : typeof r == "number" ? `${r * 0.25}rem` : r, f = (n, r = {}) => Object.entries(n).reduce((i, [t, o]) => {
22
+ if (g(t))
23
+ return i;
24
+ const e = t in r ? r[t] : t in s ? s[t] : t, p = e == null ? void 0 : e.replaceAll(/([\da-z]|(?=[A-Z]))([A-Z])/g, "$1-$2").toLowerCase();
25
+ if (typeof o == "object")
26
+ for (const [d, a] of Object.entries(o))
27
+ a !== void 0 && (i[`--${d}-${p}`] = m(t, a));
28
+ else
29
+ i[`--${p}`] = m(t, o);
30
+ return i;
31
+ }, {});
11
32
  export {
12
- m as cn,
13
- x as sv
33
+ f as propsToCssVariables
14
34
  };
15
35
  //# sourceMappingURL=fondue-components39.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"fondue-components39.js","sources":["../src/utilities/styleUtilities.ts"],"sourcesContent":["/* (c) Copyright Frontify Ltd., all rights reserved. */\n\nimport { extendTailwindMerge } from 'tailwind-merge';\nimport { tv, type TV } from 'tailwind-variants';\n\ntype ClassNameValue = ClassNameArray | string | null | undefined | 0 | false;\ntype ClassNameArray = ClassNameValue[];\n\nconst customTwMerge = extendTailwindMerge({\n prefix: 'tw-',\n extend: {\n classGroups: {\n 'font-size': ['text-body-x-small', 'text-body-small', 'text-body-medium', 'text-body-large'],\n },\n },\n});\n\nexport const cn = (...classLists: ClassNameValue[]): string => {\n return customTwMerge(...classLists);\n};\n\nexport const sv: TV = (variants) => {\n return tv(variants);\n};\n"],"names":["customTwMerge","extendTailwindMerge","cn","classLists","sv","variants","tv"],"mappings":";;AAQA,MAAMA,IAAgBC,EAAoB;AAAA,EACtC,QAAQ;AAAA,EACR,QAAQ;AAAA,IACJ,aAAa;AAAA,MACT,aAAa,CAAC,qBAAqB,mBAAmB,oBAAoB,iBAAiB;AAAA,IAAA;AAAA,EAC/F;AAER,CAAC,GAEYC,IAAK,IAAIC,MACXH,EAAc,GAAGG,CAAU,GAGzBC,IAAS,CAACC,MACZC,EAAGD,CAAQ;"}
1
+ {"version":3,"file":"fondue-components39.js","sources":["../src/helpers/propsToCssVariables.ts"],"sourcesContent":["/* (c) Copyright Frontify Ltd., all rights reserved. */\n\nimport { type CSSProperties } from 'react';\n\nimport { type Breakpoint } from './layout';\n\nconst isAriaProp = (key: string): boolean => {\n return key.startsWith('aria-') || key === 'role';\n};\n\nconst abbreviationToCssProperty: Record<string, string> = {\n m: 'margin',\n mx: 'margin-x',\n my: 'margin-y',\n mt: 'margin-top',\n mr: 'margin-right',\n mb: 'margin-bottom',\n ml: 'margin-left',\n p: 'padding',\n px: 'padding-x',\n py: 'padding-y',\n pt: 'padding-top',\n pr: 'padding-right',\n pb: 'padding-bottom',\n pl: 'padding-left',\n direction: 'flex-direction',\n align: 'align-items',\n wrap: 'flex-wrap',\n columns: 'grid-template-columns',\n rows: 'grid-template-rows',\n};\n\nconst transformValueBasedOnKey = (key: string, value: string | number): string | number => {\n if (key === 'columns' || key === 'rows') {\n if (typeof value === 'number') {\n return `repeat(${value}, 1fr)`;\n }\n return value;\n }\n\n // Spacing tokens\n if (typeof value === 'number') {\n return `${value * 0.25}rem`;\n }\n\n return value;\n};\n\nexport const propsToCssVariables = (\n props: Record<string, string | number | boolean | { [key in Breakpoint]?: string | number | boolean }>,\n extraAbbreviationToCssProperty: Record<string, string> = {},\n): CSSProperties => {\n return Object.entries(props).reduce((acc, [key, value]) => {\n if (isAriaProp(key)) {\n return acc;\n }\n\n const cssProperty =\n key in extraAbbreviationToCssProperty\n ? extraAbbreviationToCssProperty[key]\n : key in abbreviationToCssProperty\n ? abbreviationToCssProperty[key]\n : key;\n // The lookahead is necessary to split camelCase boundaries; disabling false-positive lint warning\n const cssPropertyKebabCase = cssProperty?.replaceAll(/([\\da-z]|(?=[A-Z]))([A-Z])/g, '$1-$2').toLowerCase();\n\n if (typeof value === 'object') {\n for (const [breakpoint, breakpointValue] of Object.entries(value)) {\n if (breakpointValue !== undefined) {\n // @ts-expect-error CSS variables are not typed into `CSSProperties`\n acc[`--${breakpoint}-${cssPropertyKebabCase}`] = transformValueBasedOnKey(key, breakpointValue);\n }\n }\n } else {\n // @ts-expect-error CSS variables are not typed into `CSSProperties`\n acc[`--${cssPropertyKebabCase}`] = transformValueBasedOnKey(key, value);\n }\n\n return acc;\n }, {} as CSSProperties);\n};\n"],"names":["isAriaProp","key","abbreviationToCssProperty","transformValueBasedOnKey","value","propsToCssVariables","props","extraAbbreviationToCssProperty","acc","cssProperty","cssPropertyKebabCase","breakpoint","breakpointValue"],"mappings":"AAMA,MAAMA,IAAa,CAACC,MACTA,EAAI,WAAW,OAAO,KAAKA,MAAQ,QAGxCC,IAAoD;AAAA,EACtD,GAAG;AAAA,EACH,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,GAAG;AAAA,EACH,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,WAAW;AAAA,EACX,OAAO;AAAA,EACP,MAAM;AAAA,EACN,SAAS;AAAA,EACT,MAAM;AACV,GAEMC,IAA2B,CAACF,GAAaG,MACvCH,MAAQ,aAAaA,MAAQ,SACzB,OAAOG,KAAU,WACV,UAAUA,CAAK,WAEnBA,IAIP,OAAOA,KAAU,WACV,GAAGA,IAAQ,IAAI,QAGnBA,GAGEC,IAAsB,CAC/BC,GACAC,IAAyD,OAElD,OAAO,QAAQD,CAAK,EAAE,OAAO,CAACE,GAAK,CAACP,GAAKG,CAAK,MAAM;AACvD,MAAIJ,EAAWC,CAAG;AACd,WAAOO;AAGX,QAAMC,IACFR,KAAOM,IACDA,EAA+BN,CAAG,IAClCA,KAAOC,IACLA,EAA0BD,CAAG,IAC7BA,GAENS,IAAuBD,KAAA,gBAAAA,EAAa,WAAW,+BAA+B,SAAS;AAE7F,MAAI,OAAOL,KAAU;AACjB,eAAW,CAACO,GAAYC,CAAe,KAAK,OAAO,QAAQR,CAAK;AAC5D,MAAIQ,MAAoB,WAEpBJ,EAAI,KAAKG,CAAU,IAAID,CAAoB,EAAE,IAAIP,EAAyBF,GAAKW,CAAe;AAAA;AAKtG,IAAAJ,EAAI,KAAKE,CAAoB,EAAE,IAAIP,EAAyBF,GAAKG,CAAK;AAG1E,SAAOI;AACX,GAAG,CAAA,CAAmB;"}
@@ -1,8 +1,8 @@
1
1
  import { jsx as a, jsxs as g, Fragment as h } from "react/jsx-runtime";
2
2
  import { IconCross as B } from "@frontify/fondue-icons";
3
- import { useTranslation as x } from "./fondue-components34.js";
4
- import { BadgeStatus as y } from "./fondue-components35.js";
5
- import p from "./fondue-components36.js";
3
+ import { useTranslation as x } from "./fondue-components36.js";
4
+ import { BadgeStatus as y } from "./fondue-components37.js";
5
+ import p from "./fondue-components38.js";
6
6
  const P = ({
7
7
  "aria-label": e,
8
8
  "data-test-id": n = "badge",
@@ -1,158 +1,8 @@
1
- import { FOCUS_OUTLINE as t } from "./fondue-components90.js";
2
- import { sv as e } from "./fondue-components39.js";
3
- const o = e({
4
- base: `tw-group tw-relative tw-flex tw-flex-row tw-gap-2 tw-items-center tw-justify-center tw-cursor-pointer tw-font-body tw-font-medium tw-box-border tw-whitespace-nowrap tw-transition-colors ${t}`,
5
- variants: {
6
- disabled: {
7
- true: "tw-cursor-not-allowed tw-pointer-events-none tw-text-box-disabled-inverse tw-bg-box-disabled"
8
- },
9
- rounding: {
10
- medium: "tw-rounded",
11
- full: "tw-rounded-full"
12
- },
13
- size: {
14
- small: "tw-h-6 tw-text-body-small",
15
- medium: "tw-h-9 tw-text-body-medium",
16
- large: "tw-h-12 tw-text-body-large"
17
- },
18
- aspect: {
19
- square: "tw-aspect-square tw-px-0",
20
- default: ""
21
- },
22
- hugWidth: {
23
- false: "tw-w-full"
24
- },
25
- emphasis: {
26
- default: "",
27
- weak: "",
28
- strong: ""
29
- },
30
- variant: {
31
- default: "",
32
- positive: "",
33
- negative: "",
34
- danger: "",
35
- loud: ""
36
- }
37
- },
38
- compoundVariants: [
39
- {
40
- disabled: !1,
41
- variant: "default",
42
- emphasis: "default",
43
- class: "tw-bg-button-background hover:tw-bg-button-background-hover active:tw-bg-button-background-pressed"
44
- },
45
- {
46
- disabled: !1,
47
- variant: "default",
48
- emphasis: "weak",
49
- class: "hover:tw-bg-button-background-hover active:tw-bg-button-background-pressed"
50
- },
51
- {
52
- disabled: !1,
53
- variant: "default",
54
- emphasis: "strong",
55
- class: "tw-bg-button-strong-background hover:tw-bg-button-strong-background-hover active:tw-bg-button-strong-background-pressed"
56
- },
57
- {
58
- disabled: !1,
59
- variant: "positive",
60
- emphasis: "default",
61
- class: "tw-bg-button-positive-background hover:tw-bg-button-positive-background-hover active:tw-bg-button-positive-background-pressed"
62
- },
63
- {
64
- disabled: !1,
65
- variant: "positive",
66
- emphasis: "weak",
67
- class: "hover:tw-bg-button-positive-background-hover active:tw-bg-button-positive-background-pressed"
68
- },
69
- {
70
- disabled: !1,
71
- variant: "positive",
72
- emphasis: "strong",
73
- class: "tw-bg-button-strong-positive-background hover:tw-bg-button-strong-positive-background-hover active:tw-bg-button-strong-positive-background-pressed"
74
- },
75
- {
76
- disabled: !1,
77
- variant: "negative",
78
- emphasis: "default",
79
- class: "tw-bg-button-negative-background hover:tw-bg-button-negative-background-hover active:tw-bg-button-negative-background-pressed"
80
- },
81
- {
82
- disabled: !1,
83
- variant: "negative",
84
- emphasis: "weak",
85
- class: "hover:tw-bg-button-negative-background-hover active:tw-bg-button-negative-background-pressed"
86
- },
87
- {
88
- disabled: !1,
89
- variant: "negative",
90
- emphasis: "strong",
91
- class: "tw-bg-button-strong-negative-background hover:tw-bg-button-strong-negative-background-hover active:tw-bg-button-strong-negative-background-pressed"
92
- },
93
- {
94
- disabled: !1,
95
- variant: "danger",
96
- emphasis: "default",
97
- class: "tw-bg-button-background hover:tw-bg-button-background-hover active:tw-bg-button-background-pressed"
98
- },
99
- {
100
- disabled: !1,
101
- variant: "danger",
102
- emphasis: "weak",
103
- class: "hover:tw-bg-button-background-hover active:tw-bg-button-background-pressed"
104
- },
105
- {
106
- disabled: !1,
107
- variant: "danger",
108
- emphasis: "strong",
109
- class: "tw-bg-button-danger-background hover:tw-bg-button-danger-background-hover active:tw-bg-button-danger-background-pressed"
110
- },
111
- {
112
- disabled: !1,
113
- variant: "loud",
114
- emphasis: "default",
115
- class: "tw-bg-box-selected hover:tw-bg-box-selected-hover active:tw-bg-box-selected-pressed"
116
- },
117
- {
118
- disabled: !1,
119
- variant: "loud",
120
- emphasis: "weak",
121
- class: "tw-border-transparent hover:tw-bg-box-selected-hover active:tw-bg-box-selected-pressed"
122
- },
123
- {
124
- disabled: !1,
125
- variant: "loud",
126
- emphasis: "strong",
127
- class: "tw-bg-box-selected-strong hover:tw-bg-box-selected-strong-hover active:tw-bg-box-selected-strong-pressed "
128
- },
129
- {
130
- aspect: "default",
131
- size: "small",
132
- class: "tw-px-2"
133
- },
134
- {
135
- aspect: "default",
136
- size: "medium",
137
- class: "tw-px-4"
138
- },
139
- {
140
- aspect: "default",
141
- size: "large",
142
- class: "tw-px-6"
143
- }
144
- ],
145
- defaultVariants: {
146
- variant: "default",
147
- emphasis: "strong",
148
- size: "medium",
149
- rounding: "medium",
150
- hugWidth: !0,
151
- aspect: "default",
152
- disabled: !1
153
- }
154
- });
1
+ const o = "_root_f9dx4_6", t = {
2
+ root: o
3
+ };
155
4
  export {
156
- o as buttonStyles
5
+ t as default,
6
+ o as root
157
7
  };
158
8
  //# sourceMappingURL=fondue-components40.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"fondue-components40.js","sources":["../src/components/Button/styles/buttonStyles.ts"],"sourcesContent":["/* (c) Copyright Frontify Ltd., all rights reserved. */\n\nimport { FOCUS_OUTLINE } from '#/utilities/focusStyle';\nimport { sv } from '#/utilities/styleUtilities';\n\nexport const buttonStyles = sv({\n base:\n 'tw-group tw-relative tw-flex tw-flex-row tw-gap-2 tw-items-center tw-justify-center tw-cursor-pointer tw-font-body tw-font-medium tw-box-border tw-whitespace-nowrap tw-transition-colors ' +\n `${FOCUS_OUTLINE}`,\n variants: {\n disabled: {\n true: 'tw-cursor-not-allowed tw-pointer-events-none tw-text-box-disabled-inverse tw-bg-box-disabled',\n },\n rounding: {\n medium: 'tw-rounded',\n full: 'tw-rounded-full',\n },\n size: {\n small: 'tw-h-6 tw-text-body-small',\n medium: 'tw-h-9 tw-text-body-medium',\n large: 'tw-h-12 tw-text-body-large',\n },\n aspect: {\n square: 'tw-aspect-square tw-px-0',\n default: '',\n },\n hugWidth: {\n false: 'tw-w-full',\n },\n emphasis: {\n default: '',\n weak: '',\n strong: '',\n },\n variant: {\n default: '',\n positive: '',\n negative: '',\n danger: '',\n loud: '',\n },\n },\n compoundVariants: [\n {\n disabled: false,\n variant: 'default',\n emphasis: 'default',\n class:\n 'tw-bg-button-background ' +\n 'hover:tw-bg-button-background-hover ' +\n 'active:tw-bg-button-background-pressed',\n },\n {\n disabled: false,\n variant: 'default',\n emphasis: 'weak',\n class: 'hover:tw-bg-button-background-hover active:tw-bg-button-background-pressed',\n },\n {\n disabled: false,\n variant: 'default',\n emphasis: 'strong',\n class:\n 'tw-bg-button-strong-background ' +\n 'hover:tw-bg-button-strong-background-hover ' +\n 'active:tw-bg-button-strong-background-pressed',\n },\n {\n disabled: false,\n variant: 'positive',\n emphasis: 'default',\n class:\n 'tw-bg-button-positive-background ' +\n 'hover:tw-bg-button-positive-background-hover ' +\n 'active:tw-bg-button-positive-background-pressed',\n },\n {\n disabled: false,\n variant: 'positive',\n emphasis: 'weak',\n class: 'hover:tw-bg-button-positive-background-hover active:tw-bg-button-positive-background-pressed',\n },\n {\n disabled: false,\n variant: 'positive',\n emphasis: 'strong',\n class:\n 'tw-bg-button-strong-positive-background ' +\n 'hover:tw-bg-button-strong-positive-background-hover ' +\n 'active:tw-bg-button-strong-positive-background-pressed',\n },\n {\n disabled: false,\n variant: 'negative',\n emphasis: 'default',\n class:\n 'tw-bg-button-negative-background ' +\n 'hover:tw-bg-button-negative-background-hover ' +\n 'active:tw-bg-button-negative-background-pressed',\n },\n {\n disabled: false,\n variant: 'negative',\n emphasis: 'weak',\n class: 'hover:tw-bg-button-negative-background-hover active:tw-bg-button-negative-background-pressed',\n },\n {\n disabled: false,\n variant: 'negative',\n emphasis: 'strong',\n class:\n 'tw-bg-button-strong-negative-background ' +\n 'hover:tw-bg-button-strong-negative-background-hover ' +\n 'active:tw-bg-button-strong-negative-background-pressed',\n },\n {\n disabled: false,\n variant: 'danger',\n emphasis: 'default',\n class:\n 'tw-bg-button-background ' +\n 'hover:tw-bg-button-background-hover ' +\n 'active:tw-bg-button-background-pressed',\n },\n {\n disabled: false,\n variant: 'danger',\n emphasis: 'weak',\n class: 'hover:tw-bg-button-background-hover active:tw-bg-button-background-pressed',\n },\n {\n disabled: false,\n variant: 'danger',\n emphasis: 'strong',\n class:\n 'tw-bg-button-danger-background ' +\n 'hover:tw-bg-button-danger-background-hover ' +\n 'active:tw-bg-button-danger-background-pressed',\n },\n {\n disabled: false,\n variant: 'loud',\n emphasis: 'default',\n class: 'tw-bg-box-selected hover:tw-bg-box-selected-hover active:tw-bg-box-selected-pressed',\n },\n {\n disabled: false,\n variant: 'loud',\n emphasis: 'weak',\n class: 'tw-border-transparent hover:tw-bg-box-selected-hover active:tw-bg-box-selected-pressed',\n },\n {\n disabled: false,\n variant: 'loud',\n emphasis: 'strong',\n class:\n 'tw-bg-box-selected-strong ' +\n 'hover:tw-bg-box-selected-strong-hover ' +\n 'active:tw-bg-box-selected-strong-pressed ',\n },\n {\n aspect: 'default',\n size: 'small',\n class: 'tw-px-2',\n },\n {\n aspect: 'default',\n size: 'medium',\n class: 'tw-px-4',\n },\n {\n aspect: 'default',\n size: 'large',\n class: 'tw-px-6',\n },\n ],\n defaultVariants: {\n variant: 'default',\n emphasis: 'strong',\n size: 'medium',\n rounding: 'medium',\n hugWidth: true,\n aspect: 'default',\n disabled: false,\n },\n});\n"],"names":["buttonStyles","sv","FOCUS_OUTLINE"],"mappings":";;AAKO,MAAMA,IAAeC,EAAG;AAAA,EAC3B,MACI,6LACGC,CAAa;AAAA,EACpB,UAAU;AAAA,IACN,UAAU;AAAA,MACN,MAAM;AAAA,IAAA;AAAA,IAEV,UAAU;AAAA,MACN,QAAQ;AAAA,MACR,MAAM;AAAA,IAAA;AAAA,IAEV,MAAM;AAAA,MACF,OAAO;AAAA,MACP,QAAQ;AAAA,MACR,OAAO;AAAA,IAAA;AAAA,IAEX,QAAQ;AAAA,MACJ,QAAQ;AAAA,MACR,SAAS;AAAA,IAAA;AAAA,IAEb,UAAU;AAAA,MACN,OAAO;AAAA,IAAA;AAAA,IAEX,UAAU;AAAA,MACN,SAAS;AAAA,MACT,MAAM;AAAA,MACN,QAAQ;AAAA,IAAA;AAAA,IAEZ,SAAS;AAAA,MACL,SAAS;AAAA,MACT,UAAU;AAAA,MACV,UAAU;AAAA,MACV,QAAQ;AAAA,MACR,MAAM;AAAA,IAAA;AAAA,EACV;AAAA,EAEJ,kBAAkB;AAAA,IACd;AAAA,MACI,UAAU;AAAA,MACV,SAAS;AAAA,MACT,UAAU;AAAA,MACV,OACI;AAAA,IAAA;AAAA,IAIR;AAAA,MACI,UAAU;AAAA,MACV,SAAS;AAAA,MACT,UAAU;AAAA,MACV,OAAO;AAAA,IAAA;AAAA,IAEX;AAAA,MACI,UAAU;AAAA,MACV,SAAS;AAAA,MACT,UAAU;AAAA,MACV,OACI;AAAA,IAAA;AAAA,IAIR;AAAA,MACI,UAAU;AAAA,MACV,SAAS;AAAA,MACT,UAAU;AAAA,MACV,OACI;AAAA,IAAA;AAAA,IAIR;AAAA,MACI,UAAU;AAAA,MACV,SAAS;AAAA,MACT,UAAU;AAAA,MACV,OAAO;AAAA,IAAA;AAAA,IAEX;AAAA,MACI,UAAU;AAAA,MACV,SAAS;AAAA,MACT,UAAU;AAAA,MACV,OACI;AAAA,IAAA;AAAA,IAIR;AAAA,MACI,UAAU;AAAA,MACV,SAAS;AAAA,MACT,UAAU;AAAA,MACV,OACI;AAAA,IAAA;AAAA,IAIR;AAAA,MACI,UAAU;AAAA,MACV,SAAS;AAAA,MACT,UAAU;AAAA,MACV,OAAO;AAAA,IAAA;AAAA,IAEX;AAAA,MACI,UAAU;AAAA,MACV,SAAS;AAAA,MACT,UAAU;AAAA,MACV,OACI;AAAA,IAAA;AAAA,IAIR;AAAA,MACI,UAAU;AAAA,MACV,SAAS;AAAA,MACT,UAAU;AAAA,MACV,OACI;AAAA,IAAA;AAAA,IAIR;AAAA,MACI,UAAU;AAAA,MACV,SAAS;AAAA,MACT,UAAU;AAAA,MACV,OAAO;AAAA,IAAA;AAAA,IAEX;AAAA,MACI,UAAU;AAAA,MACV,SAAS;AAAA,MACT,UAAU;AAAA,MACV,OACI;AAAA,IAAA;AAAA,IAIR;AAAA,MACI,UAAU;AAAA,MACV,SAAS;AAAA,MACT,UAAU;AAAA,MACV,OAAO;AAAA,IAAA;AAAA,IAEX;AAAA,MACI,UAAU;AAAA,MACV,SAAS;AAAA,MACT,UAAU;AAAA,MACV,OAAO;AAAA,IAAA;AAAA,IAEX;AAAA,MACI,UAAU;AAAA,MACV,SAAS;AAAA,MACT,UAAU;AAAA,MACV,OACI;AAAA,IAAA;AAAA,IAIR;AAAA,MACI,QAAQ;AAAA,MACR,MAAM;AAAA,MACN,OAAO;AAAA,IAAA;AAAA,IAEX;AAAA,MACI,QAAQ;AAAA,MACR,MAAM;AAAA,MACN,OAAO;AAAA,IAAA;AAAA,IAEX;AAAA,MACI,QAAQ;AAAA,MACR,MAAM;AAAA,MACN,OAAO;AAAA,IAAA;AAAA,EACX;AAAA,EAEJ,iBAAiB;AAAA,IACb,SAAS;AAAA,IACT,UAAU;AAAA,IACV,MAAM;AAAA,IACN,UAAU;AAAA,IACV,UAAU;AAAA,IACV,QAAQ;AAAA,IACR,UAAU;AAAA,EAAA;AAElB,CAAC;"}
1
+ {"version":3,"file":"fondue-components40.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;"}
@@ -1,121 +1,23 @@
1
- import { sv as t } from "./fondue-components39.js";
2
- const s = t({
3
- variants: {
4
- emphasis: {
5
- default: "",
6
- weak: "",
7
- strong: ""
8
- },
9
- variant: {
10
- default: "",
11
- positive: "",
12
- negative: "",
13
- danger: "",
14
- loud: ""
15
- },
16
- disabled: {
17
- true: "tw-text-box-disabled-inverse"
1
+ import { extendTailwindMerge as e } from "tailwind-merge";
2
+ import { tv as x } from "tailwind-variants";
3
+ const r = e({
4
+ prefix: "tw-",
5
+ extend: {
6
+ classGroups: {
7
+ "font-size": [
8
+ "text-xx-small",
9
+ "text-x-small",
10
+ "text-small",
11
+ "text-medium",
12
+ "text-large",
13
+ "text-x-large",
14
+ "text-xx-large"
15
+ ]
18
16
  }
19
- },
20
- compoundVariants: [
21
- {
22
- disabled: !1,
23
- variant: "default",
24
- emphasis: "default",
25
- class: "[&_svg]:tw-text-button-icon group-hover:[&_svg]:tw-text-button-icon-hover group-active:[&_svg]:tw-text-button-icon-pressed [&_svg]:tw-leading-none"
26
- },
27
- {
28
- disabled: !1,
29
- variant: "default",
30
- emphasis: "weak",
31
- class: "[&_svg]:tw-text-button-icon group-hover:[&_svg]:tw-text-button-icon-hover group-active:[&_svg]:tw-text-button-icon-pressed [&_svg]:tw-leading-none"
32
- },
33
- {
34
- disabled: !1,
35
- variant: "default",
36
- emphasis: "strong",
37
- class: "[&_svg]:tw-text-button-strong-icon group-hover:[&_svg]:tw-text-button-strong-icon-hover group-active:[&_svg]:tw-text-button-strong-icon-pressed [&_svg]:tw-leading-none"
38
- },
39
- {
40
- disabled: !1,
41
- variant: "positive",
42
- emphasis: "default",
43
- class: "[&_svg]:tw-text-button-positive-icon group-hover:[&_svg]:tw-text-button-positive-icon-hover group-active:[&_svg]:tw-text-button-positive-icon-pressed [&_svg]:tw-leading-none"
44
- },
45
- {
46
- disabled: !1,
47
- variant: "positive",
48
- emphasis: "weak",
49
- class: "[&_svg]:tw-text-button-strong-positive-icon group-hover:[&_svg]:tw-text-button-strong-positive-icon-hovergroup-active:[&_svg]:tw-text-button-strong-positive-icon-pressed [&_svg]:tw-leading-none"
50
- },
51
- {
52
- disabled: !1,
53
- variant: "positive",
54
- emphasis: "strong",
55
- class: "[&_svg]:tw-text-button-strong-positive-icon group-hover:[&_svg]:tw-text-button-strong-positive-icon-hover group-active:[&_svg]:tw-text-button-strong-positive-icon-pressed [&_svg]:tw-leading-none"
56
- },
57
- {
58
- disabled: !1,
59
- variant: "negative",
60
- emphasis: "default",
61
- class: "[&_svg]:tw-text-button-negative-icon group-hover:[&_svg]:tw-text-button-negative-icon-hovergroup-active:[&_svg]:tw-text-button-negative-icon-pressed [&_svg]:tw-leading-none"
62
- },
63
- {
64
- disabled: !1,
65
- variant: "negative",
66
- emphasis: "weak",
67
- class: "[&_svg]:tw-text-button-negative-icon group-hover:[&_svg]:tw-text-button-negative-icon-hovergroup-active:[&_svg]:tw-text-button-negative-icon-pressed [&_svg]:tw-leading-none"
68
- },
69
- {
70
- disabled: !1,
71
- variant: "negative",
72
- emphasis: "strong",
73
- class: "[&_svg]:tw-text-button-strong-negative-icon group-hover:[&_svg]:tw-text-button-strong-negative-icon-hovergroup-active:[&_svg]:tw-text-button-strong-negative-icon-pressed [&_svg]:tw-leading-none"
74
- },
75
- {
76
- disabled: !1,
77
- variant: "danger",
78
- emphasis: "default",
79
- class: "[&_svg]:tw-text-button-negative-icon group-hover:[&_svg]:tw-text-button-negative-icon-hovergroup-active:[&_svg]:tw-text-button-negative-icon-pressed [&_svg]:tw-leading-none"
80
- },
81
- {
82
- disabled: !1,
83
- variant: "danger",
84
- emphasis: "weak",
85
- class: "[&_svg]:tw-text-button-negative-icon group-hover:[&_svg]:tw-text-button-negative-icon-hovergroup-active:[&_svg]:tw-text-button-negative-icon-pressed [&_svg]:tw-leading-none"
86
- },
87
- {
88
- disabled: !1,
89
- variant: "danger",
90
- emphasis: "strong",
91
- class: "[&_svg]:tw-text-button-danger-icon group-hover:[&_svg]:tw-text-button-danger-icon-hovergroup-active:[&_svg]:tw-text-button-danger-icon-pressed [&_svg]:tw-leading-none"
92
- },
93
- {
94
- disabled: !1,
95
- variant: "loud",
96
- emphasis: "default",
97
- class: "[&_svg]:tw-text-box-selected-inverse group-hover:[&_svg]:tw-text-box-selected-inverse-hovergroup-active:[&_svg]:tw-text-box-selected-inverse-pressed [&_svg]:tw-leading-none"
98
- },
99
- {
100
- disabled: !1,
101
- variant: "loud",
102
- emphasis: "weak",
103
- class: "[&_svg]:tw-text-box-selected-inverse group-hover:[&_svg]:tw-text-box-selected-inverse-hovergroup-active:[&_svg]:tw-text-box-selected-inverse-pressed [&_svg]:tw-leading-none"
104
- },
105
- {
106
- disabled: !1,
107
- variant: "loud",
108
- emphasis: "strong",
109
- class: "[&_svg]:tw-text-box-selected-strong-inverse group-hover:[&_svg]:tw-text-box-selected-strong-inversegroup-active:[&_svg]:tw-text-box-selected-strong-inverse [&_svg]:tw-leading-none"
110
- }
111
- ],
112
- defaultVariants: {
113
- emphasis: "strong",
114
- variant: "default",
115
- disabled: !1
116
17
  }
117
- });
18
+ }), o = (...t) => r(...t), m = (t) => x(t);
118
19
  export {
119
- s as iconStyles
20
+ o as cn,
21
+ m as sv
120
22
  };
121
23
  //# sourceMappingURL=fondue-components41.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"fondue-components41.js","sources":["../src/components/Button/styles/iconStyles.ts"],"sourcesContent":["/* (c) Copyright Frontify Ltd., all rights reserved. */\n\nimport { sv } from '#/utilities/styleUtilities';\n\nexport const iconStyles = sv({\n variants: {\n emphasis: {\n default: '',\n weak: '',\n strong: '',\n },\n variant: {\n default: '',\n positive: '',\n negative: '',\n danger: '',\n loud: '',\n },\n disabled: {\n true: 'tw-text-box-disabled-inverse',\n },\n },\n compoundVariants: [\n {\n disabled: false,\n variant: 'default',\n emphasis: 'default',\n class:\n '[&_svg]:tw-text-button-icon ' +\n 'group-hover:[&_svg]:tw-text-button-icon-hover ' +\n 'group-active:[&_svg]:tw-text-button-icon-pressed [&_svg]:tw-leading-none',\n },\n {\n disabled: false,\n variant: 'default',\n emphasis: 'weak',\n class:\n '[&_svg]:tw-text-button-icon ' +\n 'group-hover:[&_svg]:tw-text-button-icon-hover ' +\n 'group-active:[&_svg]:tw-text-button-icon-pressed [&_svg]:tw-leading-none',\n },\n {\n disabled: false,\n variant: 'default',\n emphasis: 'strong',\n class:\n '[&_svg]:tw-text-button-strong-icon ' +\n 'group-hover:[&_svg]:tw-text-button-strong-icon-hover ' +\n 'group-active:[&_svg]:tw-text-button-strong-icon-pressed [&_svg]:tw-leading-none',\n },\n {\n disabled: false,\n variant: 'positive',\n emphasis: 'default',\n class:\n '[&_svg]:tw-text-button-positive-icon ' +\n 'group-hover:[&_svg]:tw-text-button-positive-icon-hover ' +\n 'group-active:[&_svg]:tw-text-button-positive-icon-pressed [&_svg]:tw-leading-none',\n },\n {\n disabled: false,\n variant: 'positive',\n emphasis: 'weak',\n class:\n '[&_svg]:tw-text-button-strong-positive-icon ' +\n 'group-hover:[&_svg]:tw-text-button-strong-positive-icon-hover' +\n 'group-active:[&_svg]:tw-text-button-strong-positive-icon-pressed [&_svg]:tw-leading-none',\n },\n {\n disabled: false,\n variant: 'positive',\n emphasis: 'strong',\n class:\n '[&_svg]:tw-text-button-strong-positive-icon ' +\n 'group-hover:[&_svg]:tw-text-button-strong-positive-icon-hover ' +\n 'group-active:[&_svg]:tw-text-button-strong-positive-icon-pressed [&_svg]:tw-leading-none',\n },\n {\n disabled: false,\n variant: 'negative',\n emphasis: 'default',\n class:\n '[&_svg]:tw-text-button-negative-icon ' +\n 'group-hover:[&_svg]:tw-text-button-negative-icon-hover' +\n 'group-active:[&_svg]:tw-text-button-negative-icon-pressed [&_svg]:tw-leading-none',\n },\n {\n disabled: false,\n variant: 'negative',\n emphasis: 'weak',\n class:\n '[&_svg]:tw-text-button-negative-icon ' +\n 'group-hover:[&_svg]:tw-text-button-negative-icon-hover' +\n 'group-active:[&_svg]:tw-text-button-negative-icon-pressed [&_svg]:tw-leading-none',\n },\n {\n disabled: false,\n variant: 'negative',\n emphasis: 'strong',\n class:\n '[&_svg]:tw-text-button-strong-negative-icon ' +\n 'group-hover:[&_svg]:tw-text-button-strong-negative-icon-hover' +\n 'group-active:[&_svg]:tw-text-button-strong-negative-icon-pressed [&_svg]:tw-leading-none',\n },\n {\n disabled: false,\n variant: 'danger',\n emphasis: 'default',\n class:\n '[&_svg]:tw-text-button-negative-icon ' +\n 'group-hover:[&_svg]:tw-text-button-negative-icon-hover' +\n 'group-active:[&_svg]:tw-text-button-negative-icon-pressed [&_svg]:tw-leading-none',\n },\n {\n disabled: false,\n variant: 'danger',\n emphasis: 'weak',\n class:\n '[&_svg]:tw-text-button-negative-icon ' +\n 'group-hover:[&_svg]:tw-text-button-negative-icon-hover' +\n 'group-active:[&_svg]:tw-text-button-negative-icon-pressed [&_svg]:tw-leading-none',\n },\n {\n disabled: false,\n variant: 'danger',\n emphasis: 'strong',\n class:\n '[&_svg]:tw-text-button-danger-icon ' +\n 'group-hover:[&_svg]:tw-text-button-danger-icon-hover' +\n 'group-active:[&_svg]:tw-text-button-danger-icon-pressed [&_svg]:tw-leading-none',\n },\n {\n disabled: false,\n variant: 'loud',\n emphasis: 'default',\n class:\n '[&_svg]:tw-text-box-selected-inverse ' +\n 'group-hover:[&_svg]:tw-text-box-selected-inverse-hover' +\n 'group-active:[&_svg]:tw-text-box-selected-inverse-pressed [&_svg]:tw-leading-none',\n },\n {\n disabled: false,\n variant: 'loud',\n emphasis: 'weak',\n class:\n '[&_svg]:tw-text-box-selected-inverse ' +\n 'group-hover:[&_svg]:tw-text-box-selected-inverse-hover' +\n 'group-active:[&_svg]:tw-text-box-selected-inverse-pressed [&_svg]:tw-leading-none',\n },\n {\n disabled: false,\n variant: 'loud',\n emphasis: 'strong',\n class:\n '[&_svg]:tw-text-box-selected-strong-inverse ' +\n 'group-hover:[&_svg]:tw-text-box-selected-strong-inverse' +\n 'group-active:[&_svg]:tw-text-box-selected-strong-inverse [&_svg]:tw-leading-none',\n },\n ],\n defaultVariants: {\n emphasis: 'strong',\n variant: 'default',\n disabled: false,\n },\n});\n"],"names":["iconStyles","sv"],"mappings":";AAIO,MAAMA,IAAaC,EAAG;AAAA,EACzB,UAAU;AAAA,IACN,UAAU;AAAA,MACN,SAAS;AAAA,MACT,MAAM;AAAA,MACN,QAAQ;AAAA,IAAA;AAAA,IAEZ,SAAS;AAAA,MACL,SAAS;AAAA,MACT,UAAU;AAAA,MACV,UAAU;AAAA,MACV,QAAQ;AAAA,MACR,MAAM;AAAA,IAAA;AAAA,IAEV,UAAU;AAAA,MACN,MAAM;AAAA,IAAA;AAAA,EACV;AAAA,EAEJ,kBAAkB;AAAA,IACd;AAAA,MACI,UAAU;AAAA,MACV,SAAS;AAAA,MACT,UAAU;AAAA,MACV,OACI;AAAA,IAAA;AAAA,IAIR;AAAA,MACI,UAAU;AAAA,MACV,SAAS;AAAA,MACT,UAAU;AAAA,MACV,OACI;AAAA,IAAA;AAAA,IAIR;AAAA,MACI,UAAU;AAAA,MACV,SAAS;AAAA,MACT,UAAU;AAAA,MACV,OACI;AAAA,IAAA;AAAA,IAIR;AAAA,MACI,UAAU;AAAA,MACV,SAAS;AAAA,MACT,UAAU;AAAA,MACV,OACI;AAAA,IAAA;AAAA,IAIR;AAAA,MACI,UAAU;AAAA,MACV,SAAS;AAAA,MACT,UAAU;AAAA,MACV,OACI;AAAA,IAAA;AAAA,IAIR;AAAA,MACI,UAAU;AAAA,MACV,SAAS;AAAA,MACT,UAAU;AAAA,MACV,OACI;AAAA,IAAA;AAAA,IAIR;AAAA,MACI,UAAU;AAAA,MACV,SAAS;AAAA,MACT,UAAU;AAAA,MACV,OACI;AAAA,IAAA;AAAA,IAIR;AAAA,MACI,UAAU;AAAA,MACV,SAAS;AAAA,MACT,UAAU;AAAA,MACV,OACI;AAAA,IAAA;AAAA,IAIR;AAAA,MACI,UAAU;AAAA,MACV,SAAS;AAAA,MACT,UAAU;AAAA,MACV,OACI;AAAA,IAAA;AAAA,IAIR;AAAA,MACI,UAAU;AAAA,MACV,SAAS;AAAA,MACT,UAAU;AAAA,MACV,OACI;AAAA,IAAA;AAAA,IAIR;AAAA,MACI,UAAU;AAAA,MACV,SAAS;AAAA,MACT,UAAU;AAAA,MACV,OACI;AAAA,IAAA;AAAA,IAIR;AAAA,MACI,UAAU;AAAA,MACV,SAAS;AAAA,MACT,UAAU;AAAA,MACV,OACI;AAAA,IAAA;AAAA,IAIR;AAAA,MACI,UAAU;AAAA,MACV,SAAS;AAAA,MACT,UAAU;AAAA,MACV,OACI;AAAA,IAAA;AAAA,IAIR;AAAA,MACI,UAAU;AAAA,MACV,SAAS;AAAA,MACT,UAAU;AAAA,MACV,OACI;AAAA,IAAA;AAAA,IAIR;AAAA,MACI,UAAU;AAAA,MACV,SAAS;AAAA,MACT,UAAU;AAAA,MACV,OACI;AAAA,IAAA;AAAA,EAGR;AAAA,EAEJ,iBAAiB;AAAA,IACb,UAAU;AAAA,IACV,SAAS;AAAA,IACT,UAAU;AAAA,EAAA;AAElB,CAAC;"}
1
+ {"version":3,"file":"fondue-components41.js","sources":["../src/utilities/styleUtilities.ts"],"sourcesContent":["/* (c) Copyright Frontify Ltd., all rights reserved. */\n\nimport { extendTailwindMerge } from 'tailwind-merge';\nimport { tv, type TV } from 'tailwind-variants';\n\ntype ClassNameValue = ClassNameArray | string | null | undefined | 0 | false;\ntype ClassNameArray = ClassNameValue[];\n\nconst customTwMerge = extendTailwindMerge({\n prefix: 'tw-',\n extend: {\n classGroups: {\n 'font-size': [\n 'text-xx-small',\n 'text-x-small',\n 'text-small',\n 'text-medium',\n 'text-large',\n 'text-x-large',\n 'text-xx-large',\n ],\n },\n },\n});\n\nexport const cn = (...classLists: ClassNameValue[]): string => {\n return customTwMerge(...classLists);\n};\n\nexport const sv: TV = (variants) => {\n return tv(variants);\n};\n"],"names":["customTwMerge","extendTailwindMerge","cn","classLists","sv","variants","tv"],"mappings":";;AAQA,MAAMA,IAAgBC,EAAoB;AAAA,EACtC,QAAQ;AAAA,EACR,QAAQ;AAAA,IACJ,aAAa;AAAA,MACT,aAAa;AAAA,QACT;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,MAAA;AAAA,IACJ;AAAA,EACJ;AAER,CAAC,GAEYC,IAAK,IAAIC,MACXH,EAAc,GAAGG,CAAU,GAGzBC,IAAS,CAACC,MACZC,EAAGD,CAAQ;"}