@frontify/fondue-components 19.2.0 → 19.3.0

package/dist/fondue-components77.js

@@ -1,18 +1,29 @@
-const o = "_root_kjbh5_5", t = "_input_kjbh5_59", s = "_slot_kjbh5_82", c = "_iconSuccess_kjbh5_132", n = "_iconError_kjbh5_141", _ = "_loadingStatus_kjbh5_155", r = {
+const o = "_root_1cjgh_2", _ = {
   root: o,
-  input: t,
-  slot: s,
-  iconSuccess: c,
-  iconError: n,
-  loadingStatus: _
+  "weight-default": "_weight-default_1cjgh_7",
+  "weight-strong": "_weight-strong_1cjgh_11",
+  "weight-x-strong": "_weight-x-strong_1cjgh_15",
+  "size-x-small": "_size-x-small_1cjgh_19",
+  "size-small": "_size-small_1cjgh_24",
+  "size-medium": "_size-medium_1cjgh_29",
+  "size-large": "_size-large_1cjgh_34",
+  "color-default": "_color-default_1cjgh_39",
+  "color-weak": "_color-weak_1cjgh_43",
+  "color-x-weak": "_color-x-weak_1cjgh_47",
+  "color-disabled": "_color-disabled_1cjgh_51",
+  "color-negative": "_color-negative_1cjgh_55",
+  "color-positive": "_color-positive_1cjgh_59",
+  "color-warning": "_color-warning_1cjgh_63",
+  "color-interactive": "_color-interactive_1cjgh_67",
+  "color-box-neutral": "_color-box-neutral_1cjgh_71",
+  "color-box-selected": "_color-box-selected_1cjgh_75",
+  "color-box-disabled": "_color-box-disabled_1cjgh_79",
+  "color-box-positive": "_color-box-positive_1cjgh_83",
+  "color-box-negative": "_color-box-negative_1cjgh_87",
+  "color-box-warning": "_color-box-warning_1cjgh_91"
 };
 export {
-  r as default,
-  n as iconError,
-  c as iconSuccess,
-  t as input,
-  _ as loadingStatus,
-  o as root,
-  s as slot
+  _ as default,
+  o as root
 };
 //# sourceMappingURL=fondue-components77.js.map

package/dist/fondue-components77.js.map

@@ -1 +1 @@
-{"version":3,"file":"fondue-components77.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;"}
+{"version":3,"file":"fondue-components77.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/fondue-components78.js

@@ -1,10 +1,18 @@
-const t = "_dark_1mr83_1", r = "_light_1mr83_250", s = {
-  dark: t,
-  light: r
+const o = "_root_kjbh5_5", t = "_input_kjbh5_59", s = "_slot_kjbh5_82", c = "_iconSuccess_kjbh5_132", n = "_iconError_kjbh5_141", _ = "_loadingStatus_kjbh5_155", r = {
+  root: o,
+  input: t,
+  slot: s,
+  iconSuccess: c,
+  iconError: n,
+  loadingStatus: _
 };
 export {
-  t as dark,
-  s as default,
-  r as light
+  r as default,
+  n as iconError,
+  c as iconSuccess,
+  t as input,
+  _ as loadingStatus,
+  o as root,
+  s as slot
 };
 //# sourceMappingURL=fondue-components78.js.map

package/dist/fondue-components78.js.map

@@ -1 +1 @@
-{"version":3,"file":"fondue-components78.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;"}
+{"version":3,"file":"fondue-components78.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;"}

package/dist/fondue-components79.js

@@ -1,10 +1,26 @@
-const o = "_root_13m98_4", r = "_arrow_13m98_25", t = {
+const o = "_root_18lbr_5", t = "_textarea_18lbr_73", s = "_slot_18lbr_123", r = "_decorator_18lbr_137", _ = "_tools_18lbr_150", l = "_toolsButton_18lbr_162", c = "_success_18lbr_194", n = "_error_18lbr_198", e = "_loadingStatus_18lbr_202", a = "_spin_18lbr_1", b = {
   root: o,
-  arrow: r
+  textarea: t,
+  slot: s,
+  decorator: r,
+  tools: _,
+  toolsButton: l,
+  success: c,
+  error: n,
+  loadingStatus: e,
+  spin: a
 };
 export {
-  r as arrow,
-  t as default,
-  o as root
+  r as decorator,
+  b as default,
+  n as error,
+  e as loadingStatus,
+  o as root,
+  s as slot,
+  a as spin,
+  c as success,
+  t as textarea,
+  _ as tools,
+  l as toolsButton
 };
 //# sourceMappingURL=fondue-components79.js.map

package/dist/fondue-components79.js.map

@@ -1 +1 @@
-{"version":3,"file":"fondue-components79.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;"}
+{"version":3,"file":"fondue-components79.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;"}

package/dist/fondue-components8.js

@@ -1,11 +1,11 @@
 import { jsx as a } from "react/jsx-runtime";
 import { Slot as P } from "@radix-ui/react-slot";
 import { forwardRef as F, useState as y, useMemo as N, Children as I } from "react";
-import { ForwardedRefColorGradientInput as w } from "./fondue-components41.js";
-import { ForwardedRefColorPickerInput as h } from "./fondue-components42.js";
-import { ForwardedRefColorValueInput as G } from "./fondue-components43.js";
-import V from "./fondue-components44.js";
-import { DEFAULT_FORMAT as g, DEFAULT_COLOR as A, getColorWithName as s } from "./fondue-components45.js";
+import { ForwardedRefColorGradientInput as w } from "./fondue-components42.js";
+import { ForwardedRefColorPickerInput as h } from "./fondue-components43.js";
+import { ForwardedRefColorValueInput as G } from "./fondue-components44.js";
+import V from "./fondue-components45.js";
+import { DEFAULT_FORMAT as g, DEFAULT_COLOR as A, getColorWithName as s } from "./fondue-components46.js";
 const p = ({
   children: t,
   currentColor: r = A,

package/dist/fondue-components8.js.map

@@ -1 +1 @@
-{"version":3,"file":"fondue-components8.js","sources":["../src/components/ColorPicker/ColorPicker.tsx"],"sourcesContent":["/* (c) Copyright Frontify Ltd., all rights reserved. */\n\nimport { Slot as RadixSlot } from '@radix-ui/react-slot';\nimport { Children, forwardRef, useMemo, useState, type ForwardedRef, type ReactNode } from 'react';\n\nimport { ForwardedRefColorGradientInput } from './ColorGradientInput';\nimport { ForwardedRefColorPickerInput } from './ColorPickerInput';\nimport { ForwardedRefColorValueInput } from './ColorValueInput';\nimport styles from './styles/customColorPicker.module.scss';\nimport { type ColorFormat, type RgbaColor } from './types';\nimport { DEFAULT_COLOR, DEFAULT_FORMAT, getColorWithName } from './utils';\n\ntype ColorPickerProps = {\n    /**\n     * The children of the color picker component. This can contain multiple `ColorPicker.Values` or `ColorPicker.Gradient` components.\n     */\n    children?: ReactNode;\n    /**\n     * The active color in the color picker\n     */\n    currentColor?: RgbaColor;\n    /**\n     * Event handler called when the color changes\n     */\n    onColorChange?: (color: RgbaColor) => void;\n    /**\n     * The active color format in the color picker\n     */\n    currentFormat?: ColorFormat;\n    /**\n     * Event handler called when the color format changes\n     */\n    onFormatChange?: (format: ColorFormat) => void;\n    /**\n     * The default format to use for the color input when not controlled externally\n     * @default \"HEX\"\n     */\n    defaultFormat?: ColorFormat;\n    /**\n     * The test id of the color picker\n     */\n    'data-test-id'?: string;\n};\n\nexport const ColorPickerRoot = (\n    {\n        children,\n        currentColor = DEFAULT_COLOR,\n        onColorChange = () => {},\n        currentFormat,\n        onFormatChange = () => {},\n        defaultFormat = DEFAULT_FORMAT,\n        'data-test-id': dataTestId = 'color-picker-input',\n        ...props\n    }: ColorPickerProps,\n    forwardedRef: ForwardedRef<HTMLDivElement>,\n) => {\n    const [managedFormat, setManagedFormat] = useState<ColorFormat>(defaultFormat);\n    const activeFormat = useMemo(() => currentFormat ?? managedFormat, [currentFormat, managedFormat]);\n\n    return (\n        <div className={styles.root} data-picker-type=\"custom-color\" data-test-id={dataTestId} ref={forwardedRef}>\n            {Children.map(children, (child) => (\n                <ColorPickerSlot\n                    {...props}\n                    onColorChange={(color: RgbaColor) => {\n                        onColorChange(getColorWithName(color, activeFormat));\n                    }}\n                    currentColor={currentColor}\n                    currentFormat={activeFormat}\n                    setCurrentFormat={(currentFormat: ColorFormat) => {\n                        setManagedFormat(currentFormat);\n                        onFormatChange(currentFormat);\n                        onColorChange(getColorWithName(currentColor, currentFormat));\n                    }}\n                >\n                    {child}\n                </ColorPickerSlot>\n            ))}\n        </div>\n    );\n};\nColorPickerRoot.displayName = 'ColorPicker';\n\ntype ColorPickerSlotProps = ColorPickerProps & {\n    currentFormat?: ColorFormat;\n    setCurrentFormat?: (format: ColorFormat) => void;\n};\nconst ColorPickerSlot = ({ children, ...props }: ColorPickerSlotProps) => <RadixSlot {...props}>{children}</RadixSlot>;\n\nexport const ForwardedRefColorPicker = forwardRef<HTMLDivElement, ColorPickerProps>(ColorPickerRoot);\n\nexport const ColorPicker = {\n    Root: ForwardedRefColorPicker,\n    Values: ForwardedRefColorValueInput,\n    Gradient: ForwardedRefColorGradientInput,\n    Input: ForwardedRefColorPickerInput,\n};\n\nColorPicker.Root.displayName = 'ColorPicker.Root';\nColorPicker.Values.displayName = 'ColorPicker.Values';\nColorPicker.Gradient.displayName = 'ColorPicker.Gradient';\nColorPicker.Input.displayName = 'ColorPicker.Input';\n"],"names":["ColorPickerRoot","children","currentColor","DEFAULT_COLOR","onColorChange","currentFormat","onFormatChange","defaultFormat","DEFAULT_FORMAT","dataTestId","props","forwardedRef","managedFormat","setManagedFormat","useState","activeFormat","useMemo","jsx","styles","Children","child","ColorPickerSlot","color","getColorWithName","RadixSlot","ForwardedRefColorPicker","forwardRef","ColorPicker","ForwardedRefColorValueInput","ForwardedRefColorGradientInput","ForwardedRefColorPickerInput"],"mappings":";;;;;;;;AA4CO,MAAMA,IAAkB,CAC3B;AAAA,EACI,UAAAC;AAAA,EACA,cAAAC,IAAeC;AAAA,EACf,eAAAC,IAAgB,MAAM;AAAA,EAAC;AAAA,EACvB,eAAAC;AAAA,EACA,gBAAAC,IAAiB,MAAM;AAAA,EAAC;AAAA,EACxB,eAAAC,IAAgBC;AAAA,EAChB,gBAAgBC,IAAa;AAAA,EAC7B,GAAGC;AACP,GACAC,MACC;AACD,QAAM,CAACC,GAAeC,CAAgB,IAAIC,EAAsBP,CAAa,GACvEQ,IAAeC,EAAQ,MAAMX,KAAiBO,GAAe,CAACP,GAAeO,CAAa,CAAC;AAEjG,SACK,gBAAAK,EAAA,OAAA,EAAI,WAAWC,EAAO,MAAM,oBAAiB,gBAAe,gBAAcT,GAAY,KAAKE,GACvF,UAAAQ,EAAS,IAAIlB,GAAU,CAACmB,MACrB,gBAAAH;AAAA,IAACI;AAAA,IAAA;AAAA,MACI,GAAGX;AAAA,MACJ,eAAe,CAACY,MAAqB;AACnB,QAAAlB,EAAAmB,EAAiBD,GAAOP,CAAY,CAAC;AAAA,MACvD;AAAA,MACA,cAAAb;AAAA,MACA,eAAea;AAAA,MACf,kBAAkB,CAACV,MAA+B;AAC9C,QAAAQ,EAAiBR,CAAa,GAC9BC,EAAeD,CAAa,GACdD,EAAAmB,EAAiBrB,GAAcG,CAAa,CAAC;AAAA,MAC/D;AAAA,MAEC,UAAAe;AAAA,IAAA;AAAA,EAER,CAAA,GACL;AAER;AACApB,EAAgB,cAAc;AAM9B,MAAMqB,IAAkB,CAAC,EAAE,UAAApB,GAAU,GAAGS,EAAM,MAA6B,gBAAAO,EAAAO,GAAA,EAAW,GAAGd,GAAQ,UAAAT,GAAS,GAE7FwB,IAA0BC,EAA6C1B,CAAe,GAEtF2B,IAAc;AAAA,EACvB,MAAMF;AAAA,EACN,QAAQG;AAAA,EACR,UAAUC;AAAA,EACV,OAAOC;AACX;AAEAH,EAAY,KAAK,cAAc;AAC/BA,EAAY,OAAO,cAAc;AACjCA,EAAY,SAAS,cAAc;AACnCA,EAAY,MAAM,cAAc;"}
+{"version":3,"file":"fondue-components8.js","sources":["../src/components/ColorPicker/ColorPicker.tsx"],"sourcesContent":["/* (c) Copyright Frontify Ltd., all rights reserved. */\n\nimport { Slot as RadixSlot } from '@radix-ui/react-slot';\nimport { Children, forwardRef, useMemo, useState, type ForwardedRef, type ReactNode } from 'react';\n\nimport { ForwardedRefColorGradientInput } from './ColorGradientInput';\nimport { ForwardedRefColorPickerInput } from './ColorPickerInput';\nimport { ForwardedRefColorValueInput } from './ColorValueInput';\nimport styles from './styles/customColorPicker.module.scss';\nimport { type ColorFormat, type RgbaColor } from './types';\nimport { DEFAULT_COLOR, DEFAULT_FORMAT, getColorWithName } from './utils';\n\ntype ColorPickerProps = {\n    /**\n     * The children of the color picker component. This can contain multiple `ColorPicker.Values` or `ColorPicker.Gradient` components.\n     */\n    children?: ReactNode;\n    /**\n     * The active color in the color picker\n     */\n    currentColor?: RgbaColor;\n    /**\n     * Event handler called when the color changes\n     */\n    onColorChange?: (color: RgbaColor) => void;\n    /**\n     * The active color format in the color picker\n     */\n    currentFormat?: ColorFormat;\n    /**\n     * Event handler called when the color format changes\n     */\n    onFormatChange?: (format: ColorFormat) => void;\n    /**\n     * The default format to use for the color input when not controlled externally\n     * @default \"HEX\"\n     */\n    defaultFormat?: ColorFormat;\n    /**\n     * The test id of the color picker\n     */\n    'data-test-id'?: string;\n};\n\nexport const ColorPickerRoot = (\n    {\n        children,\n        currentColor = DEFAULT_COLOR,\n        onColorChange = () => {},\n        currentFormat,\n        onFormatChange = () => {},\n        defaultFormat = DEFAULT_FORMAT,\n        'data-test-id': dataTestId = 'color-picker-input',\n        ...props\n    }: ColorPickerProps,\n    forwardedRef: ForwardedRef<HTMLDivElement>,\n) => {\n    const [managedFormat, setManagedFormat] = useState<ColorFormat>(defaultFormat);\n    const activeFormat = useMemo(() => currentFormat ?? managedFormat, [currentFormat, managedFormat]);\n\n    return (\n        <div className={styles.root} data-picker-type=\"custom-color\" data-test-id={dataTestId} ref={forwardedRef}>\n            {Children.map(children, (child) => (\n                <ColorPickerSlot\n                    {...props}\n                    onColorChange={(color: RgbaColor) => {\n                        onColorChange(getColorWithName(color, activeFormat));\n                    }}\n                    currentColor={currentColor}\n                    currentFormat={activeFormat}\n                    setCurrentFormat={(currentFormat: ColorFormat) => {\n                        setManagedFormat(currentFormat);\n                        onFormatChange(currentFormat);\n                        onColorChange(getColorWithName(currentColor, currentFormat));\n                    }}\n                >\n                    {child}\n                </ColorPickerSlot>\n            ))}\n        </div>\n    );\n};\nColorPickerRoot.displayName = 'ColorPicker';\n\ntype ColorPickerSlotProps = ColorPickerProps & {\n    currentFormat?: ColorFormat;\n    setCurrentFormat?: (format: ColorFormat) => void;\n};\nconst ColorPickerSlot = ({ children, ...props }: ColorPickerSlotProps) => <RadixSlot {...props}>{children}</RadixSlot>;\n\nexport const ForwardedRefColorPicker = forwardRef<HTMLDivElement, ColorPickerProps>(ColorPickerRoot);\n\nexport const ColorPicker = {\n    Root: ForwardedRefColorPicker,\n    Values: ForwardedRefColorValueInput,\n    Gradient: ForwardedRefColorGradientInput,\n    Input: ForwardedRefColorPickerInput,\n};\n\nColorPicker.Root.displayName = 'ColorPicker.Root';\nColorPicker.Values.displayName = 'ColorPicker.Values';\nColorPicker.Gradient.displayName = 'ColorPicker.Gradient';\nColorPicker.Input.displayName = 'ColorPicker.Input';\n"],"names":["ColorPickerRoot","children","currentColor","DEFAULT_COLOR","onColorChange","currentFormat","onFormatChange","defaultFormat","DEFAULT_FORMAT","dataTestId","props","forwardedRef","managedFormat","setManagedFormat","useState","activeFormat","useMemo","jsx","styles","Children","child","ColorPickerSlot","color","getColorWithName","RadixSlot","ForwardedRefColorPicker","forwardRef","ColorPicker","ForwardedRefColorValueInput","ForwardedRefColorGradientInput","ForwardedRefColorPickerInput"],"mappings":";;;;;;;;AA4CO,MAAMA,IAAkB,CAC3B;AAAA,EACI,UAAAC;AAAA,EACA,cAAAC,IAAeC;AAAA,EACf,eAAAC,IAAgB,MAAM;AAAA,EAAC;AAAA,EACvB,eAAAC;AAAA,EACA,gBAAAC,IAAiB,MAAM;AAAA,EAAC;AAAA,EACxB,eAAAC,IAAgBC;AAAA,EAChB,gBAAgBC,IAAa;AAAA,EAC7B,GAAGC;AACP,GACAC,MACC;AACD,QAAM,CAACC,GAAeC,CAAgB,IAAIC,EAAsBP,CAAa,GACvEQ,IAAeC,EAAQ,MAAMX,KAAiBO,GAAe,CAACP,GAAeO,CAAa,CAAC;AAEjG,SACI,gBAAAK,EAAC,OAAA,EAAI,WAAWC,EAAO,MAAM,oBAAiB,gBAAe,gBAAcT,GAAY,KAAKE,GACvF,UAAAQ,EAAS,IAAIlB,GAAU,CAACmB,MACrB,gBAAAH;AAAA,IAACI;AAAA,IAAA;AAAA,MACI,GAAGX;AAAA,MACJ,eAAe,CAACY,MAAqB;AACjC,QAAAlB,EAAcmB,EAAiBD,GAAOP,CAAY,CAAC;AAAA,MACvD;AAAA,MACA,cAAAb;AAAA,MACA,eAAea;AAAA,MACf,kBAAkB,CAACV,MAA+B;AAC9C,QAAAQ,EAAiBR,CAAa,GAC9BC,EAAeD,CAAa,GAC5BD,EAAcmB,EAAiBrB,GAAcG,CAAa,CAAC;AAAA,MAC/D;AAAA,MAEC,UAAAe;AAAA,IAAA;AAAA,EAAA,CAER,GACL;AAER;AACApB,EAAgB,cAAc;AAM9B,MAAMqB,IAAkB,CAAC,EAAE,UAAApB,GAAU,GAAGS,EAAA,MAAkC,gBAAAO,EAACO,GAAA,EAAW,GAAGd,GAAQ,UAAAT,GAAS,GAE7FwB,IAA0BC,EAA6C1B,CAAe,GAEtF2B,IAAc;AAAA,EACvB,MAAMF;AAAA,EACN,QAAQG;AAAA,EACR,UAAUC;AAAA,EACV,OAAOC;AACX;AAEAH,EAAY,KAAK,cAAc;AAC/BA,EAAY,OAAO,cAAc;AACjCA,EAAY,SAAS,cAAc;AACnCA,EAAY,MAAM,cAAc;"}

package/dist/fondue-components80.js

@@ -1,8 +1,10 @@
-const o = "_root_1sqdc_1", t = {
-  root: o
+const t = "_dark_1mr83_1", r = "_light_1mr83_250", s = {
+  dark: t,
+  light: r
 };
 export {
-  t as default,
-  o as root
+  t as dark,
+  s as default,
+  r as light
 };
 //# sourceMappingURL=fondue-components80.js.map

package/dist/fondue-components80.js.map

@@ -1 +1 @@
-{"version":3,"file":"fondue-components80.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;"}
+{"version":3,"file":"fondue-components80.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;"}

package/dist/fondue-components81.js

@@ -1,8 +1,10 @@
-const r = (e) => {
-  if (e)
-    return `rgba(${e.red}, ${e.green}, ${e.blue}, ${e.alpha ?? 1})`;
+const o = "_root_13m98_4", r = "_arrow_13m98_25", t = {
+  root: o,
+  arrow: r
 };
 export {
-  r as colorToCss
+  r as arrow,
+  t as default,
+  o as root
 };
 //# sourceMappingURL=fondue-components81.js.map

package/dist/fondue-components81.js.map

@@ -1 +1 @@
-{"version":3,"file":"fondue-components81.js","sources":["../src/components/Badge/utils.ts"],"sourcesContent":["/* (c) Copyright Frontify Ltd., all rights reserved. */\n\nimport { type RgbaColor } from './types';\n\nexport const DEFAULT_COLOR = { red: 255, green: 255, blue: 255, alpha: 1, name: '' };\n\n/**\n * Converts a color object to a CSS color string.\n * @param {RgbaColor} color - The color object to be converted.\n * @returns {string}\n * @example\n * colorToCss({ red: 255, green: 255, blue: 255, alpha: 1 }); // 'rgba(255, 255, 255, 1)'\n * @example\n * colorToCss({ red: 255, green: 87, blue: 51, alpha: 1 }); // 'rgba(255, 87, 51, 1)'\n * @example\n * colorToCss({ red: 0, green: 0, blue: 0, alpha: 0 }); // 'rgba(0, 0, 0, 0)'\n */\nexport const colorToCss = (color?: RgbaColor) => {\n    if (!color) {\n        return undefined;\n    }\n    return `rgba(${color.red}, ${color.green}, ${color.blue}, ${color.alpha ?? 1})`;\n};\n"],"names":["colorToCss","color"],"mappings":"AAiBa,MAAAA,IAAa,CAACC,MAAsB;AAC7C,MAAKA;AAGL,WAAO,QAAQA,EAAM,GAAG,KAAKA,EAAM,KAAK,KAAKA,EAAM,IAAI,KAAKA,EAAM,SAAS,CAAC;AAChF;"}
+{"version":3,"file":"fondue-components81.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;"}

package/dist/fondue-components82.js

@@ -1,5 +1,8 @@
-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";
+const o = "_root_lwb4s_1", t = {
+  root: o
+};
 export {
-  t as FOCUS_OUTLINE
+  t as default,
+  o as root
 };
 //# sourceMappingURL=fondue-components82.js.map

package/dist/fondue-components82.js.map

@@ -1 +1 @@
-{"version":3,"file":"fondue-components82.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;"}
+{"version":3,"file":"fondue-components82.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;"}

package/dist/fondue-components83.js

@@ -1,20 +1,8 @@
-const o = "_root_1761r_5", t = "_colorName_1761r_55", c = "_button_1761r_63", r = "_colorIndicator_1761r_76", _ = "_actions_1761r_95", a = "_clear_1761r_105", n = "_caret_1761r_118", s = {
-  root: o,
-  colorName: t,
-  button: c,
-  colorIndicator: r,
-  actions: _,
-  clear: a,
-  caret: n
+const r = (e) => {
+  if (e)
+    return `rgba(${e.red}, ${e.green}, ${e.blue}, ${e.alpha ?? 1})`;
 };
 export {
-  _ as actions,
-  c as button,
-  n as caret,
-  a as clear,
-  r as colorIndicator,
-  t as colorName,
-  s as default,
-  o as root
+  r as colorToCss
 };
 //# sourceMappingURL=fondue-components83.js.map

package/dist/fondue-components83.js.map

@@ -1 +1 @@
-{"version":3,"file":"fondue-components83.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;"}
+{"version":3,"file":"fondue-components83.js","sources":["../src/components/Badge/utils.ts"],"sourcesContent":["/* (c) Copyright Frontify Ltd., all rights reserved. */\n\nimport { type RgbaColor } from './types';\n\nexport const DEFAULT_COLOR = { red: 255, green: 255, blue: 255, alpha: 1, name: '' };\n\n/**\n * Converts a color object to a CSS color string.\n * @param {RgbaColor} color - The color object to be converted.\n * @returns {string}\n * @example\n * colorToCss({ red: 255, green: 255, blue: 255, alpha: 1 }); // 'rgba(255, 255, 255, 1)'\n * @example\n * colorToCss({ red: 255, green: 87, blue: 51, alpha: 1 }); // 'rgba(255, 87, 51, 1)'\n * @example\n * colorToCss({ red: 0, green: 0, blue: 0, alpha: 0 }); // 'rgba(0, 0, 0, 0)'\n */\nexport const colorToCss = (color?: RgbaColor) => {\n    if (!color) {\n        return undefined;\n    }\n    return `rgba(${color.red}, ${color.green}, ${color.blue}, ${color.alpha ?? 1})`;\n};\n"],"names":["colorToCss","color"],"mappings":"AAiBO,MAAMA,IAAa,CAACC,MAAsB;AAC7C,MAAKA;AAGL,WAAO,QAAQA,EAAM,GAAG,KAAKA,EAAM,KAAK,KAAKA,EAAM,IAAI,KAAKA,EAAM,SAAS,CAAC;AAChF;"}

package/dist/fondue-components84.js

@@ -1,43 +1,5 @@
-import { Children as a, isValidElement as u, cloneElement as f } from "react";
-import { ForwardedRefSelectItem as E } from "./fondue-components64.js";
-const g = ({
-  children: o,
-  value: r,
-  label: s
-}) => o && typeof o == "string" ? {
-  value: r || o,
-  label: s || o
-} : {
-  value: r || "",
-  label: s || r || "",
-  ...o ? { children: o } : null
-}, w = (o, r) => u(o) && o.type === r, y = (o, r, s, p = 0) => {
-  const n = [];
-  let t = 0;
-  return a.forEach(o, (e) => {
-    if (w(e, E) && u(e))
-      g(e.props).label.toLowerCase().includes((s == null ? void 0 : s.toLowerCase()) || "") && (n.push(r(e, p + t)), t++);
-    else if (u(e) && (e != null && e.props.children)) {
-      const { parsedChildren: m, subElementCount: C } = y(
-        e.props.children,
-        r,
-        "",
-        p + t
-      );
-      e = f(e, {
-        children: m,
-        key: `group-${p + t}`
-      }), n.push(e), t += C;
-    } else
-      n.push(e);
-  }), {
-    parsedChildren: n,
-    subElementCount: t
-  };
-};
+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";
 export {
-  g as getSelectOptionValue,
-  w as isReactLeaf,
-  y as recursiveMap
+  t as FOCUS_OUTLINE
 };
 //# sourceMappingURL=fondue-components84.js.map

package/dist/fondue-components84.js.map

@@ -1 +1 @@
-{"version":3,"file":"fondue-components84.js","sources":["../src/components/Select/utils.ts"],"sourcesContent":["/* (c) Copyright Frontify Ltd., all rights reserved. */\n\nimport {\n    Children,\n    cloneElement,\n    isValidElement,\n    type JSXElementConstructor,\n    type ReactElement,\n    type ReactNode,\n} from 'react';\n\nimport { ForwardedRefSelectItem, type SelectItemProps } from './SelectItem';\n\n/**\n * Extracts and returns an object containing `value` and `label` from a given SelectItemProps object.\n * It prioritizes explicit `value` and `label` properties but will fall back to using `children` as the value or label if necessary.\n *\n * @param {SelectItemProps} props - The properties of a select item, which include potential children, value, and label.\n * @returns {{ value: string; label: string, children?: ReactNode }} An object containing `value` and `label` as strings.\n *\n * @example\n * // Returns { value: 'option1', label: 'Option 1' }\n * getSelectOptionValue({ value: 'option1', label: 'Option 1' });\n *\n * @example\n * // Uses children as the value and label when they are not explicitly provided\n * // Returns { value: 'Default', label: 'Default' }\n * getSelectOptionValue({ children: 'Default' });\n */\nexport const getSelectOptionValue = ({\n    children,\n    value,\n    label,\n}: SelectItemProps): {\n    value: string;\n    label: string;\n    children?: ReactNode;\n} => {\n    if (children && typeof children === 'string') {\n        return {\n            value: value ? value : children,\n            label: label ? label : children,\n        };\n    }\n\n    return {\n        value: value || '',\n        label: label ? label : value || '',\n        ...(children ? { children } : null),\n    };\n};\n/**\n * Determines if the child is a leaf node of React, meaning it has one final child of a native type;\n *\n * @param {ReactNode} child - The React child node to check.\n * @param {JSXElementConstructor<never>} Component - The React component constructor used for comparison.\n * @returns {boolean} Returns true if the `child` is a valid React element of the specified `Component` type.\n *\n * @example\n * // Assuming ForwardedRefSelectItem is a component that renders an <input> element\n * // Returns true\n * isReactLeaf(<ForwardedRefSelectItem />, ForwardedRefSelectItem);\n *\n * @example\n * // Returns false for non-matching types or non-leaf components\n * isReactLeaf(<div><ForwardedRefSelectItem /></div>, ForwardedRefSelectItem);\n */\nexport const isReactLeaf = (child: ReactNode, Component: JSXElementConstructor<never>): child is ReactElement =>\n    isValidElement(child) && child.type === Component;\n\n/**\n * Recursively maps through React children, applying a callback to each child that meets the specified conditions.\n * This function is useful for deeply nested structures where modifications or checks are needed at multiple levels.\n *\n * @param {ReactNode} children - The children to be recursively processed.\n * @param {function(ReactNode, number): ReactNode} callback - A function that is called for each child that meets the condition. It receives the child and its index, and returns a React node.\n * @param {string} [filterText=''] - Optional text used to filter children based on their properties.\n * @param {number} [nextIndex=0] - The starting index for numbering children, defaults to 0.\n * @returns {{ parsedChildren: ReactNode[], subElementCount: number }} An object containing the transformed children array and the count of all processed sub-elements.\n *\n * @example\n * // Example usage in a select component where only items containing a certain text are modified\n * recursiveMap(children, (child, index) => React.cloneElement(child, { extraProp: 'value' }), 'specific text');\n *\n * @example\n * // Nested structure transformation, adding class names based on index\n * recursiveMap(children, (child, index) => React.cloneElement(child, { className: `item-${index}` }));\n */\nexport const recursiveMap = (\n    children: ReactNode,\n    callback: (child: ReactNode, nextIndex: number) => ReactNode,\n    filterText?: string,\n    nextIndex: number = 0,\n): {\n    parsedChildren: ReactNode[];\n    subElementCount: number;\n} => {\n    const resultingChildren: ReactNode[] = [];\n    let itemCounter = 0;\n    Children.forEach(children, (child) => {\n        if (isReactLeaf(child, ForwardedRefSelectItem) && isValidElement<SelectItemProps>(child)) {\n            if (\n                getSelectOptionValue(child.props)\n                    .label.toLowerCase()\n                    .includes(filterText?.toLowerCase() || '')\n            ) {\n                resultingChildren.push(callback(child, nextIndex + itemCounter));\n                itemCounter++;\n            }\n        } else if (isValidElement<{ children: ReactNode }>(child) && child?.props.children) {\n            const { parsedChildren, subElementCount } = recursiveMap(\n                child.props.children,\n                callback,\n                '',\n                nextIndex + itemCounter,\n            );\n            child = cloneElement(child, {\n                children: parsedChildren,\n                key: `group-${nextIndex + itemCounter}`,\n            });\n            resultingChildren.push(child);\n            itemCounter += subElementCount;\n        } else {\n            resultingChildren.push(child);\n        }\n    });\n    return {\n        parsedChildren: resultingChildren,\n        subElementCount: itemCounter,\n    };\n};\n"],"names":["getSelectOptionValue","children","value","label","isReactLeaf","child","Component","isValidElement","recursiveMap","callback","filterText","nextIndex","resultingChildren","itemCounter","Children","ForwardedRefSelectItem","parsedChildren","subElementCount","cloneElement"],"mappings":";;AA6BO,MAAMA,IAAuB,CAAC;AAAA,EACjC,UAAAC;AAAA,EACA,OAAAC;AAAA,EACA,OAAAC;AACJ,MAKQF,KAAY,OAAOA,KAAa,WACzB;AAAA,EACH,OAAOC,KAAgBD;AAAA,EACvB,OAAOE,KAAgBF;AAC3B,IAGG;AAAA,EACH,OAAOC,KAAS;AAAA,EAChB,OAAOC,KAAgBD,KAAS;AAAA,EAChC,GAAID,IAAW,EAAE,UAAAA,MAAa;AAClC,GAkBSG,IAAc,CAACC,GAAkBC,MAC1CC,EAAeF,CAAK,KAAKA,EAAM,SAASC,GAoB/BE,IAAe,CACxBP,GACAQ,GACAC,GACAC,IAAoB,MAInB;AACD,QAAMC,IAAiC,CAAC;AACxC,MAAIC,IAAc;AACT,SAAAC,EAAA,QAAQb,GAAU,CAACI,MAAU;AAClC,QAAID,EAAYC,GAAOU,CAAsB,KAAKR,EAAgCF,CAAK;AACnF,MACIL,EAAqBK,EAAM,KAAK,EAC3B,MAAM,cACN,UAASK,KAAA,gBAAAA,EAAY,kBAAiB,EAAE,MAE7CE,EAAkB,KAAKH,EAASJ,GAAOM,IAAYE,CAAW,CAAC,GAC/DA;AAAA,aAEGN,EAAwCF,CAAK,MAAKA,KAAA,QAAAA,EAAO,MAAM,WAAU;AAC1E,YAAA,EAAE,gBAAAW,GAAgB,iBAAAC,EAAA,IAAoBT;AAAA,QACxCH,EAAM,MAAM;AAAA,QACZI;AAAA,QACA;AAAA,QACAE,IAAYE;AAAA,MAChB;AACA,MAAAR,IAAQa,EAAab,GAAO;AAAA,QACxB,UAAUW;AAAA,QACV,KAAK,SAASL,IAAYE,CAAW;AAAA,MAAA,CACxC,GACDD,EAAkB,KAAKP,CAAK,GACbQ,KAAAI;AAAA,IAAA;AAEf,MAAAL,EAAkB,KAAKP,CAAK;AAAA,EAChC,CACH,GACM;AAAA,IACH,gBAAgBO;AAAA,IAChB,iBAAiBC;AAAA,EACrB;AACJ;"}
+{"version":3,"file":"fondue-components84.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;"}

package/dist/fondue-components85.js

@@ -0,0 +1,43 @@
+import { Children as a, isValidElement as u, cloneElement as f } from "react";
+import { ForwardedRefSelectItem as E } from "./fondue-components65.js";
+const g = ({
+  children: o,
+  value: r,
+  label: s
+}) => o && typeof o == "string" ? {
+  value: r || o,
+  label: s || o
+} : {
+  value: r || "",
+  label: s || r || "",
+  ...o ? { children: o } : null
+}, w = (o, r) => u(o) && o.type === r, y = (o, r, s, p = 0) => {
+  const n = [];
+  let t = 0;
+  return a.forEach(o, (e) => {
+    if (w(e, E) && u(e))
+      g(e.props).label.toLowerCase().includes((s == null ? void 0 : s.toLowerCase()) || "") && (n.push(r(e, p + t)), t++);
+    else if (u(e) && (e != null && e.props.children)) {
+      const { parsedChildren: m, subElementCount: C } = y(
+        e.props.children,
+        r,
+        "",
+        p + t
+      );
+      e = f(e, {
+        children: m,
+        key: `group-${p + t}`
+      }), n.push(e), t += C;
+    } else
+      n.push(e);
+  }), {
+    parsedChildren: n,
+    subElementCount: t
+  };
+};
+export {
+  g as getSelectOptionValue,
+  w as isReactLeaf,
+  y as recursiveMap
+};
+//# sourceMappingURL=fondue-components85.js.map

package/dist/fondue-components85.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"fondue-components85.js","sources":["../src/components/Select/utils.ts"],"sourcesContent":["/* (c) Copyright Frontify Ltd., all rights reserved. */\n\nimport {\n    Children,\n    cloneElement,\n    isValidElement,\n    type JSXElementConstructor,\n    type ReactElement,\n    type ReactNode,\n} from 'react';\n\nimport { ForwardedRefSelectItem, type SelectItemProps } from './SelectItem';\n\n/**\n * Extracts and returns an object containing `value` and `label` from a given SelectItemProps object.\n * It prioritizes explicit `value` and `label` properties but will fall back to using `children` as the value or label if necessary.\n *\n * @param {SelectItemProps} props - The properties of a select item, which include potential children, value, and label.\n * @returns {{ value: string; label: string, children?: ReactNode }} An object containing `value` and `label` as strings.\n *\n * @example\n * // Returns { value: 'option1', label: 'Option 1' }\n * getSelectOptionValue({ value: 'option1', label: 'Option 1' });\n *\n * @example\n * // Uses children as the value and label when they are not explicitly provided\n * // Returns { value: 'Default', label: 'Default' }\n * getSelectOptionValue({ children: 'Default' });\n */\nexport const getSelectOptionValue = ({\n    children,\n    value,\n    label,\n}: SelectItemProps): {\n    value: string;\n    label: string;\n    children?: ReactNode;\n} => {\n    if (children && typeof children === 'string') {\n        return {\n            value: value ? value : children,\n            label: label ? label : children,\n        };\n    }\n\n    return {\n        value: value || '',\n        label: label ? label : value || '',\n        ...(children ? { children } : null),\n    };\n};\n/**\n * Determines if the child is a leaf node of React, meaning it has one final child of a native type;\n *\n * @param {ReactNode} child - The React child node to check.\n * @param {JSXElementConstructor<never>} Component - The React component constructor used for comparison.\n * @returns {boolean} Returns true if the `child` is a valid React element of the specified `Component` type.\n *\n * @example\n * // Assuming ForwardedRefSelectItem is a component that renders an <input> element\n * // Returns true\n * isReactLeaf(<ForwardedRefSelectItem />, ForwardedRefSelectItem);\n *\n * @example\n * // Returns false for non-matching types or non-leaf components\n * isReactLeaf(<div><ForwardedRefSelectItem /></div>, ForwardedRefSelectItem);\n */\nexport const isReactLeaf = (child: ReactNode, Component: JSXElementConstructor<never>): child is ReactElement =>\n    isValidElement(child) && child.type === Component;\n\n/**\n * Recursively maps through React children, applying a callback to each child that meets the specified conditions.\n * This function is useful for deeply nested structures where modifications or checks are needed at multiple levels.\n *\n * @param {ReactNode} children - The children to be recursively processed.\n * @param {function(ReactNode, number): ReactNode} callback - A function that is called for each child that meets the condition. It receives the child and its index, and returns a React node.\n * @param {string} [filterText=''] - Optional text used to filter children based on their properties.\n * @param {number} [nextIndex=0] - The starting index for numbering children, defaults to 0.\n * @returns {{ parsedChildren: ReactNode[], subElementCount: number }} An object containing the transformed children array and the count of all processed sub-elements.\n *\n * @example\n * // Example usage in a select component where only items containing a certain text are modified\n * recursiveMap(children, (child, index) => React.cloneElement(child, { extraProp: 'value' }), 'specific text');\n *\n * @example\n * // Nested structure transformation, adding class names based on index\n * recursiveMap(children, (child, index) => React.cloneElement(child, { className: `item-${index}` }));\n */\nexport const recursiveMap = (\n    children: ReactNode,\n    callback: (child: ReactNode, nextIndex: number) => ReactNode,\n    filterText?: string,\n    nextIndex: number = 0,\n): {\n    parsedChildren: ReactNode[];\n    subElementCount: number;\n} => {\n    const resultingChildren: ReactNode[] = [];\n    let itemCounter = 0;\n    Children.forEach(children, (child) => {\n        if (isReactLeaf(child, ForwardedRefSelectItem) && isValidElement<SelectItemProps>(child)) {\n            if (\n                getSelectOptionValue(child.props)\n                    .label.toLowerCase()\n                    .includes(filterText?.toLowerCase() || '')\n            ) {\n                resultingChildren.push(callback(child, nextIndex + itemCounter));\n                itemCounter++;\n            }\n        } else if (isValidElement<{ children: ReactNode }>(child) && child?.props.children) {\n            const { parsedChildren, subElementCount } = recursiveMap(\n                child.props.children,\n                callback,\n                '',\n                nextIndex + itemCounter,\n            );\n            child = cloneElement(child, {\n                children: parsedChildren,\n                key: `group-${nextIndex + itemCounter}`,\n            });\n            resultingChildren.push(child);\n            itemCounter += subElementCount;\n        } else {\n            resultingChildren.push(child);\n        }\n    });\n    return {\n        parsedChildren: resultingChildren,\n        subElementCount: itemCounter,\n    };\n};\n"],"names":["getSelectOptionValue","children","value","label","isReactLeaf","child","Component","isValidElement","recursiveMap","callback","filterText","nextIndex","resultingChildren","itemCounter","Children","ForwardedRefSelectItem","parsedChildren","subElementCount","cloneElement"],"mappings":";;AA6BO,MAAMA,IAAuB,CAAC;AAAA,EACjC,UAAAC;AAAA,EACA,OAAAC;AAAA,EACA,OAAAC;AACJ,MAKQF,KAAY,OAAOA,KAAa,WACzB;AAAA,EACH,OAAOC,KAAgBD;AAAA,EACvB,OAAOE,KAAgBF;AAAA,IAIxB;AAAA,EACH,OAAOC,KAAS;AAAA,EAChB,OAAOC,KAAgBD,KAAS;AAAA,EAChC,GAAID,IAAW,EAAE,UAAAA,MAAa;AAAA,GAmBzBG,IAAc,CAACC,GAAkBC,MAC1CC,EAAeF,CAAK,KAAKA,EAAM,SAASC,GAoB/BE,IAAe,CACxBP,GACAQ,GACAC,GACAC,IAAoB,MAInB;AACD,QAAMC,IAAiC,CAAA;AACvC,MAAIC,IAAc;AAClB,SAAAC,EAAS,QAAQb,GAAU,CAACI,MAAU;AAClC,QAAID,EAAYC,GAAOU,CAAsB,KAAKR,EAAgCF,CAAK;AACnF,MACIL,EAAqBK,EAAM,KAAK,EAC3B,MAAM,cACN,UAASK,KAAA,gBAAAA,EAAY,kBAAiB,EAAE,MAE7CE,EAAkB,KAAKH,EAASJ,GAAOM,IAAYE,CAAW,CAAC,GAC/DA;AAAA,aAEGN,EAAwCF,CAAK,MAAKA,KAAA,QAAAA,EAAO,MAAM,WAAU;AAChF,YAAM,EAAE,gBAAAW,GAAgB,iBAAAC,EAAA,IAAoBT;AAAA,QACxCH,EAAM,MAAM;AAAA,QACZI;AAAA,QACA;AAAA,QACAE,IAAYE;AAAA,MAAA;AAEhB,MAAAR,IAAQa,EAAab,GAAO;AAAA,QACxB,UAAUW;AAAA,QACV,KAAK,SAASL,IAAYE,CAAW;AAAA,MAAA,CACxC,GACDD,EAAkB,KAAKP,CAAK,GAC5BQ,KAAeI;AAAA,IACnB;AACI,MAAAL,EAAkB,KAAKP,CAAK;AAAA,EAEpC,CAAC,GACM;AAAA,IACH,gBAAgBO;AAAA,IAChB,iBAAiBC;AAAA,EAAA;AAEzB;"}

package/dist/fondue-components86.js

@@ -0,0 +1,20 @@
+const o = "_root_1761r_5", t = "_colorName_1761r_55", c = "_button_1761r_63", r = "_colorIndicator_1761r_76", _ = "_actions_1761r_95", a = "_clear_1761r_105", n = "_caret_1761r_118", s = {
+  root: o,
+  colorName: t,
+  button: c,
+  colorIndicator: r,
+  actions: _,
+  clear: a,
+  caret: n
+};
+export {
+  _ as actions,
+  c as button,
+  n as caret,
+  a as clear,
+  r as colorIndicator,
+  t as colorName,
+  s as default,
+  o as root
+};
+//# sourceMappingURL=fondue-components86.js.map

package/dist/fondue-components86.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"fondue-components86.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;"}

package/dist/fondue-components9.js

@@ -1,53 +1,58 @@
 import { jsx as o, jsxs as P } from "react/jsx-runtime";
 import { IconCross as j } from "@frontify/fondue-icons";
 import * as d from "@radix-ui/react-dialog";
-import { createContext as q, forwardRef as l, useRef as B, useContext as z } from "react";
-import { useSyncRefs as E } from "./fondue-components46.js";
-import { addShowFocusRing as L, addAutoFocusAttribute as $ } from "./fondue-components47.js";
-import { useFondueTheme as k, ThemeProvider as G } from "./fondue-components29.js";
-import n from "./fondue-components48.js";
-const f = q({ isModal: !1 }), y = ({ children: t, ...e }) => /* @__PURE__ */ o(f.Provider, { value: { isModal: e.modal ?? !1 }, children: /* @__PURE__ */ o(d.Root, { ...e, children: t }) });
+import { createContext as q, forwardRef as l, useRef as B, useContext as z, useMemo as E } from "react";
+import { useSyncRefs as L } from "./fondue-components47.js";
+import { addShowFocusRing as $, addAutoFocusAttribute as k } from "./fondue-components48.js";
+import { useFondueTheme as G, ThemeProvider as I } from "./fondue-components30.js";
+import r from "./fondue-components49.js";
+const m = q({ isModal: !1 });
+m.displayName = "DialogContext";
+const y = ({ children: t, ...e }) => {
+  const a = E(() => ({ isModal: e.modal ?? !1 }), [e.modal]);
+  return /* @__PURE__ */ o(m.Provider, { value: a, children: /* @__PURE__ */ o(d.Root, { ...e, children: t }) });
+};
 y.displayName = "Dialog.Root";
-const D = ({ asChild: t = !0, children: e, "data-test-id": a = "fondue-dialog-trigger", ...i }, r) => /* @__PURE__ */ o(
+const D = ({ asChild: t = !0, children: e, "data-test-id": a = "fondue-dialog-trigger", ...i }, n) => /* @__PURE__ */ o(
   d.Trigger,
   {
-    onMouseDown: $,
+    onMouseDown: k,
     "data-auto-focus-visible": "true",
     "data-auto-focus-trigger": !0,
     "data-test-id": a,
     asChild: t,
-    ref: r,
+    ref: n,
     ...i,
     children: e
   }
 );
 D.displayName = "Dialog.Trigger";
-const I = ({ children: t, showUnderlay: e }) => {
-  const { isModal: a } = z(f);
-  return a ? /* @__PURE__ */ o(d.Overlay, { "data-visible": e, className: n.underlay, children: t }) : /* @__PURE__ */ o("div", { className: n.underlay, "data-visible": e, children: t });
+const J = ({ children: t, showUnderlay: e }) => {
+  const { isModal: a } = z(m);
+  return a ? /* @__PURE__ */ o(d.Overlay, { "data-visible": e, className: r.underlay, children: t }) : /* @__PURE__ */ o("div", { className: r.underlay, "data-visible": e, children: t });
 }, h = ({
   maxWidth: t = "800px",
   minWidth: e = "400px",
   minHeight: a = "200px",
   padding: i = "compact",
-  verticalAlign: r = "center",
+  verticalAlign: n = "center",
   "data-test-id": s = "fondue-dialog-content",
   showUnderlay: c = !1,
   rounded: T = !0,
   children: w,
   ...S
 }, M) => {
-  const A = k(), u = B(null);
-  E(u, M);
+  const A = G(), u = B(null);
+  L(u, M);
   const H = (O) => {
-    var p;
+    var f;
     O.preventDefault();
-    const g = (p = u.current) == null ? void 0 : p.querySelector('[data-dialog-layout-component="body"]'), m = g == null ? void 0 : g.querySelector(
+    const g = (f = u.current) == null ? void 0 : f.querySelector('[data-dialog-layout-component="body"]'), p = g == null ? void 0 : g.querySelector(
       'button, [href], input, select, textarea, [tabindex]:not([tabindex="-1"])'
     );
-    m instanceof HTMLElement && m.focus();
+    p instanceof HTMLElement && p.focus();
   };
-  return /* @__PURE__ */ o(d.Portal, { children: /* @__PURE__ */ o(G, { theme: A, children: /* @__PURE__ */ o(I, { showUnderlay: c, children: /* @__PURE__ */ o(
+  return /* @__PURE__ */ o(d.Portal, { children: /* @__PURE__ */ o(I, { theme: A, children: /* @__PURE__ */ o(J, { showUnderlay: c, children: /* @__PURE__ */ o(
     d.Content,
     {
       style: {
@@ -56,13 +61,13 @@ const I = ({ children: t, showUnderlay: e }) => {
         "--dialog-min-height": a
       },
       ref: u,
-      className: n.content,
-      onFocus: L,
+      className: r.content,
+      onFocus: $,
       onOpenAutoFocus: H,
       "data-dialog-padding": i,
       "data-dialog-rounded": T,
       "data-test-id": s,
-      "data-dialog-vertical-align": r,
+      "data-dialog-vertical-align": n,
       ...S,
       children: w
     }
@@ -74,19 +79,19 @@ const C = ({
   showBorder: e = !0,
   showCloseButton: a = !0,
   closeProps: i,
-  children: r,
+  children: n,
   "data-test-id": s = "fondue-dialog-header"
 }, c) => /* @__PURE__ */ P(
   "div",
   {
     "data-test-id": s,
     ref: c,
-    className: n.header,
+    className: r.header,
     "data-dialog-header-padding": t,
     "data-show-border": e,
     "data-dialog-layout-component": "header",
     children: [
-      /* @__PURE__ */ o("div", { children: r }),
+      /* @__PURE__ */ o("div", { children: n }),
       a && /* @__PURE__ */ o(
         d.Close,
         {
@@ -102,12 +107,12 @@ const C = ({
   }
 );
 C.displayName = "Dialog.Header";
-const N = ({ padding: t, showBorder: e = !0, children: a, "data-test-id": i = "fondue-dialog-footer" }, r) => /* @__PURE__ */ o(
+const N = ({ padding: t, showBorder: e = !0, children: a, "data-test-id": i = "fondue-dialog-footer" }, n) => /* @__PURE__ */ o(
   "div",
   {
     "data-test-id": i,
-    ref: r,
-    className: n.footer,
+    ref: n,
+    className: r.footer,
     "data-dialog-footer-padding": t,
     "data-show-border": e,
     "data-dialog-layout-component": "footer",
@@ -120,14 +125,14 @@ const b = ({ padding: t, children: e, "data-test-id": a = "fondue-dialog-body" }
   {
     "data-test-id": a,
     ref: i,
-    className: n.body,
+    className: r.body,
     "data-dialog-body-padding": t,
     "data-dialog-layout-component": "body",
     children: e
   }
 );
 b.displayName = "Dialog.Body";
-const v = ({ children: t, "data-test-id": e = "fondue-dialog-side-content" }, a) => /* @__PURE__ */ o("div", { "data-test-id": e, ref: a, className: n.sideContent, "data-dialog-layout-component": !0, children: t });
+const v = ({ children: t, "data-test-id": e = "fondue-dialog-side-content" }, a) => /* @__PURE__ */ o("div", { "data-test-id": e, ref: a, className: r.sideContent, "data-dialog-layout-component": !0, children: t });
 v.displayName = "Dialog.SideContent";
 const x = ({ children: t }) => /* @__PURE__ */ o(d.Close, { asChild: !0, children: t });
 x.displayName = "Dialog.Close";
@@ -135,7 +140,7 @@ const F = ({ children: t, asChild: e }) => /* @__PURE__ */ o(d.Title, { asChild:
 F.displayName = "Dialog.Title";
 const R = ({ children: t, asChild: e }) => /* @__PURE__ */ o(d.Description, { asChild: e, children: t });
 R.displayName = "Dialog.Description";
-const Y = {
+const Z = {
   Root: y,
   Title: F,
   Description: R,
@@ -148,7 +153,7 @@ const Y = {
   SideContent: l(v)
 };
 export {
-  Y as Dialog,
+  Z as Dialog,
   b as DialogBody,
   x as DialogClose,
   h as DialogContent,