@frontify/fondue-components 28.0.0 → 29.0.1

package/dist/fondue-components104.js

@@ -1,18 +1,18 @@
-const t = "_root_v3an7_5", a = "_caret_v3an7_44", o = "_dateName_v3an7_59", n = "_button_v3an7_80", c = "_actions_v3an7_93", _ = "_clearIcon_v3an7_101", e = {
+const t = "_root_ujssn_5", r = "_triggerListWrapper_ujssn_17", s = "_trigger_ujssn_17", n = "_activeIndicator_ujssn_65", e = "_triggerList_ujssn_17", i = "_content_ujssn_159", o = {
   root: t,
-  caret: a,
-  dateName: o,
-  button: n,
-  actions: c,
-  clearIcon: _
+  triggerListWrapper: r,
+  trigger: s,
+  activeIndicator: n,
+  triggerList: e,
+  content: i
 };
 export {
-  c as actions,
-  n as button,
-  a as caret,
-  _ as clearIcon,
-  o as dateName,
-  e as default,
-  t as root
+  n as activeIndicator,
+  i as content,
+  o as default,
+  t as root,
+  s as trigger,
+  e as triggerList,
+  r as triggerListWrapper
 };
 //# sourceMappingURL=fondue-components104.js.map

package/dist/fondue-components105.js

@@ -1,114 +1,29 @@
-import { jsx as r } from "react/jsx-runtime";
-import { IconArrowRight as m, IconArrowLeft as f } from "@frontify/fondue-icons";
-import { forwardRef as h, useMemo as $, useRef as p, useEffect as y } from "react";
-import { getDefaultClassNames as b, DayPicker as w } from "react-day-picker";
-/* empty css                     */
-import { Button as c } from "./fondue-components6.js";
-import { useFondueTheme as g } from "./fondue-components37.js";
-import e from "./fondue-components120.js";
-const N = h(
-  ({ "data-test-id": t = "fondue-date-picker-calendar", disabledDates: o, ...a }, s) => {
-    const d = b(), {
-      dir: l,
-      translations: { dateLocale: n }
-    } = g(), i = $(() => {
-      var u;
-      return a.mode === "single" ? a.selected : (u = a.selected) == null ? void 0 : u.from;
-    }, [a]);
-    return /* @__PURE__ */ r("div", { ref: s, "data-test-id": t, className: e.wrapper, children: /* @__PURE__ */ r(
-      w,
-      {
-        navLayout: "around",
-        "data-test-id": t,
-        locale: n,
-        components: v(),
-        showOutsideDays: !0,
-        disabled: o,
-        defaultMonth: i,
-        dir: l,
-        timeZone: "UTC",
-        classNames: {
-          root: `${d.root} ${e.root}`,
-          day: `${e.day}`,
-          selected: `${e.selected}`,
-          week: `${d.week} ${e.week}`,
-          weekday: `${e.weekday}`,
-          weekdays: `${d.weekdays} ${e.weekdays}`,
-          range_start: `${e.selectedStart}`,
-          range_end: `${e.selectedEnd}`,
-          range_middle: `${e.selectedMiddle}`,
-          disabled: `${e.disabled}`,
-          outside: `${e.outside}`
-        },
-        ...a,
-        modifiersClassNames: {
-          hoverAfter: `${e.hoverAfter}`,
-          hoverBefore: `${e.hoverBefore}`,
-          hoverSelected: `${e.hoverSelected}`
-        }
-      }
-    ) });
-  }
-);
-N.displayName = "DatePickerCalendar";
-const v = () => ({
-  DayButton: ({ day: t, modifiers: o, onClick: a, onMouseEnter: s, onMouseLeave: d, ...l }) => {
-    const n = p(null);
-    return y(() => {
-      var i;
-      o.focused && ((i = n.current) == null || i.focus());
-    }, [o.focused]), /* @__PURE__ */ r(
-      "button",
-      {
-        ...l,
-        ref: n,
-        className: e.dayButton,
-        onClick: a,
-        onMouseEnter: s,
-        onMouseLeave: d,
-        type: "button",
-        children: /* @__PURE__ */ r("div", { className: `${e.dayContent} ${e.button}`, children: t.date.getDate() })
-      }
-    );
-  },
-  PreviousMonthButton: ({
-    onClick: t,
-    "aria-label": o,
-    "aria-disabled": a
-  }) => /* @__PURE__ */ r("div", { className: `${e.toggleMonthButtonContainer} `, children: /* @__PURE__ */ r(
-    c,
-    {
-      emphasis: "weak",
-      size: "small",
-      aspect: "square",
-      "aria-label": o,
-      "aria-disabled": a,
-      onPress: (s) => {
-        s && (t == null || t(s));
-      },
-      children: /* @__PURE__ */ r(f, { size: 16 })
-    }
-  ) }),
-  NextMonthButton: ({
-    onClick: t,
-    "aria-label": o,
-    "aria-disabled": a
-  }) => /* @__PURE__ */ r("div", { className: `${e.toggleMonthButtonContainer} ${e.nextMonthButtonContainer}`, children: /* @__PURE__ */ r(
-    c,
-    {
-      emphasis: "weak",
-      size: "small",
-      aspect: "square",
-      "aria-label": o,
-      "aria-disabled": a,
-      onPress: (s) => {
-        s && (t == null || t(s));
-      },
-      children: /* @__PURE__ */ r(m, { size: 16 })
-    }
-  ) })
-});
+const o = "_root_wvtd0_2", _ = {
+  root: o,
+  "weight-default": "_weight-default_wvtd0_7",
+  "weight-strong": "_weight-strong_wvtd0_11",
+  "weight-x-strong": "_weight-x-strong_wvtd0_15",
+  "size-x-small": "_size-x-small_wvtd0_19",
+  "size-small": "_size-small_wvtd0_24",
+  "size-medium": "_size-medium_wvtd0_29",
+  "size-large": "_size-large_wvtd0_34",
+  "color-default": "_color-default_wvtd0_39",
+  "color-weak": "_color-weak_wvtd0_43",
+  "color-x-weak": "_color-x-weak_wvtd0_47",
+  "color-disabled": "_color-disabled_wvtd0_51",
+  "color-negative": "_color-negative_wvtd0_55",
+  "color-positive": "_color-positive_wvtd0_59",
+  "color-warning": "_color-warning_wvtd0_63",
+  "color-interactive": "_color-interactive_wvtd0_67",
+  "color-box-neutral": "_color-box-neutral_wvtd0_71",
+  "color-box-selected": "_color-box-selected_wvtd0_75",
+  "color-box-disabled": "_color-box-disabled_wvtd0_79",
+  "color-box-positive": "_color-box-positive_wvtd0_83",
+  "color-box-negative": "_color-box-negative_wvtd0_87",
+  "color-box-warning": "_color-box-warning_wvtd0_91"
+};
 export {
-  N as DatePickerCalendar
+  _ as default,
+  o as root
 };
 //# sourceMappingURL=fondue-components105.js.map

package/dist/fondue-components105.js.map

@@ -1 +1 @@
-{"version":3,"file":"fondue-components105.js","sources":["../src/components/DatePicker/DatePickerCalendar.tsx"],"sourcesContent":["/* (c) Copyright Frontify Ltd., all rights reserved. */\n\nimport { IconArrowLeft, IconArrowRight } from '@frontify/fondue-icons';\nimport { forwardRef, useEffect, useMemo, useRef } from 'react';\nimport {\n    getDefaultClassNames,\n    DayPicker,\n    type PreviousMonthButtonProps,\n    type NextMonthButtonProps,\n    type OnSelectHandler,\n    type DateRange as InternalDayPickerDateRange,\n    type CustomComponents,\n    type Matcher,\n    type DayButtonProps,\n} from 'react-day-picker';\nimport 'react-day-picker/style.css';\n\nimport { Button } from '../Button/Button';\nimport { useFondueTheme } from '../ThemeProvider/ThemeProvider';\n\nimport styles from './styles/datePickerCalendar.module.scss';\n\ntype DatePickerCalendarSingleModeProps = {\n    mode: 'single';\n    required: true;\n    selected: Date | undefined;\n    onSelect: OnSelectHandler<Date>;\n};\ntype DatePickerCalendarRangeModeProps = {\n    mode: 'range';\n    required: true;\n    selected: InternalDayPickerDateRange | undefined;\n    onSelect: OnSelectHandler<InternalDayPickerDateRange>;\n    modifiers?: Record<string, Matcher>;\n    onDayMouseEnter?: (day: Date) => void;\n    onDayMouseLeave?: (day: Date) => void;\n};\n\ntype DatePickerCalendarModeProps = DatePickerCalendarSingleModeProps | DatePickerCalendarRangeModeProps;\n\ntype DisabledDates = { before: Date } | { after: Date };\n\nexport type DatePickerBaseProps = {\n    /** The days to be disabled. */\n    disabledDates?: DisabledDates | DisabledDates[];\n    /** The test id applied to the wrapper and forwarded to DayPicker. */\n    'data-test-id'?: string;\n};\n\ntype DatePickerCalendarProps = DatePickerBaseProps & DatePickerCalendarModeProps;\n\nexport const DatePickerCalendar = forwardRef<HTMLDivElement, DatePickerCalendarProps>(\n    ({ 'data-test-id': dataTestId = 'fondue-date-picker-calendar', disabledDates, ...modeProps }, ref): JSX.Element => {\n        const defaultClassNames = getDefaultClassNames();\n        const {\n            dir,\n            translations: { dateLocale },\n        } = useFondueTheme();\n\n        const defaultMonth = useMemo(() => {\n            if (modeProps.mode === 'single') {\n                return modeProps.selected;\n            }\n            return modeProps.selected?.from;\n        }, [modeProps]);\n\n        return (\n            <div ref={ref} data-test-id={dataTestId} className={styles.wrapper}>\n                <DayPicker\n                    navLayout=\"around\"\n                    data-test-id={dataTestId}\n                    locale={dateLocale}\n                    components={getCustomComponents()}\n                    showOutsideDays\n                    disabled={disabledDates}\n                    defaultMonth={defaultMonth}\n                    dir={dir}\n                    timeZone=\"UTC\"\n                    classNames={{\n                        root: `${defaultClassNames.root} ${styles.root}`,\n                        day: `${styles.day}`,\n                        selected: `${styles.selected}`,\n                        week: `${defaultClassNames.week} ${styles.week}`,\n                        weekday: `${styles.weekday}`,\n                        weekdays: `${defaultClassNames.weekdays} ${styles.weekdays}`,\n                        range_start: `${styles.selectedStart}`,\n                        range_end: `${styles.selectedEnd}`,\n                        range_middle: `${styles.selectedMiddle}`,\n                        disabled: `${styles.disabled}`,\n                        outside: `${styles.outside}`,\n                    }}\n                    {...modeProps}\n                    modifiersClassNames={{\n                        hoverAfter: `${styles.hoverAfter}`,\n                        hoverBefore: `${styles.hoverBefore}`,\n                        hoverSelected: `${styles.hoverSelected}`,\n                    }}\n                />\n            </div>\n        );\n    },\n);\nDatePickerCalendar.displayName = 'DatePickerCalendar';\n\nconst getCustomComponents = (): Partial<CustomComponents> => ({\n    DayButton: ({ day, modifiers, onClick, onMouseEnter, onMouseLeave, ...props }: DayButtonProps): JSX.Element => {\n        const buttonRef = useRef<HTMLButtonElement>(null);\n\n        useEffect(() => {\n            if (modifiers.focused) {\n                buttonRef.current?.focus();\n            }\n        }, [modifiers.focused]);\n\n        return (\n            <button\n                {...props}\n                ref={buttonRef}\n                className={styles.dayButton}\n                onClick={onClick}\n                onMouseEnter={onMouseEnter}\n                onMouseLeave={onMouseLeave}\n                type=\"button\"\n            >\n                <div className={`${styles.dayContent} ${styles.button}`}>{day.date.getDate()}</div>\n            </button>\n        );\n    },\n    PreviousMonthButton: ({\n        onClick,\n        'aria-label': ariaLabel,\n        'aria-disabled': ariaDisabled,\n    }: PreviousMonthButtonProps): JSX.Element => {\n        return (\n            <div className={`${styles.toggleMonthButtonContainer} `}>\n                <Button\n                    emphasis=\"weak\"\n                    size=\"small\"\n                    aspect=\"square\"\n                    aria-label={ariaLabel}\n                    aria-disabled={ariaDisabled}\n                    onPress={(event) => {\n                        if (event) {\n                            onClick?.(event);\n                        }\n                    }}\n                >\n                    <IconArrowLeft size={16} />\n                </Button>\n            </div>\n        );\n    },\n    NextMonthButton: ({\n        onClick,\n        'aria-label': ariaLabel,\n        'aria-disabled': ariaDisabled,\n    }: NextMonthButtonProps): JSX.Element => {\n        return (\n            <div className={`${styles.toggleMonthButtonContainer} ${styles.nextMonthButtonContainer}`}>\n                <Button\n                    emphasis=\"weak\"\n                    size=\"small\"\n                    aspect=\"square\"\n                    aria-label={ariaLabel}\n                    aria-disabled={ariaDisabled}\n                    onPress={(event) => {\n                        if (event) {\n                            onClick?.(event);\n                        }\n                    }}\n                >\n                    <IconArrowRight size={16} />\n                </Button>\n            </div>\n        );\n    },\n});\n"],"names":["DatePickerCalendar","forwardRef","dataTestId","disabledDates","modeProps","ref","defaultClassNames","getDefaultClassNames","dir","dateLocale","useFondueTheme","defaultMonth","useMemo","_a","styles","jsx","DayPicker","getCustomComponents","day","modifiers","onClick","onMouseEnter","onMouseLeave","props","buttonRef","useRef","useEffect","ariaLabel","ariaDisabled","Button","event","IconArrowLeft","IconArrowRight"],"mappings":"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"}
+{"version":3,"file":"fondue-components105.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/fondue-components106.js

@@ -1,16 +1,22 @@
-import { useState as o, useMemo as D } from "react";
-import { transformDateRangeToPickerDateRange as c, transformPickerDateRangeToDateRange as i } from "./fondue-components118.js";
-const l = (e, t) => {
-  const [n, r] = o(e), [s, g] = o(e);
-  return s !== e && (g(e), r(e)), {
-    selectedDateRange: D(() => c(n), [n]),
-    handleSelect: (R) => {
-      const a = i(R);
-      a && (t == null || t(a), r(a));
-    }
-  };
+const o = "_root_10bzk_5", t = "_slot_10bzk_67", c = "_input_10bzk_67", n = "_placeholder_10bzk_72", s = "_iconSuccess_10bzk_154", _ = "_iconError_10bzk_162", r = "_loadingStatus_10bzk_175", p = "_inputWrapper_10bzk_195", e = {
+  root: o,
+  slot: t,
+  input: c,
+  placeholder: n,
+  iconSuccess: s,
+  iconError: _,
+  loadingStatus: r,
+  inputWrapper: p
 };
 export {
-  l as useDateRange
+  e as default,
+  _ as iconError,
+  s as iconSuccess,
+  c as input,
+  p as inputWrapper,
+  r as loadingStatus,
+  n as placeholder,
+  o as root,
+  t as slot
 };
 //# sourceMappingURL=fondue-components106.js.map

package/dist/fondue-components106.js.map

@@ -1 +1 @@
-{"version":3,"file":"fondue-components106.js","sources":["../src/components/DatePicker/hooks/useDateRange.ts"],"sourcesContent":["/* (c) Copyright Frontify Ltd., all rights reserved. */\n\nimport { useMemo, useState } from 'react';\nimport { type DateRange as InternalDayPickerDateRange, type OnSelectHandler } from 'react-day-picker';\n\nimport { transformDateRangeToPickerDateRange, transformPickerDateRangeToDateRange } from '../helpers/dateTransformer';\nimport { type DatePickerDateRange } from '../types';\n\nexport const useDateRange = (selected: DatePickerDateRange, onSelect?: (dateRange: DatePickerDateRange) => void) => {\n    const [internalSelectedDateRange, setInternalSelectedDateRange] = useState<DatePickerDateRange>(selected);\n    const [prevSelected, setPrevSelected] = useState<DatePickerDateRange | undefined>(selected);\n\n    if (prevSelected !== selected) {\n        setPrevSelected(selected);\n        setInternalSelectedDateRange(selected);\n    }\n\n    const selectedDateRange = useMemo(() => {\n        return transformDateRangeToPickerDateRange(internalSelectedDateRange);\n    }, [internalSelectedDateRange]);\n\n    const handleSelect: OnSelectHandler<InternalDayPickerDateRange> = (pickerDateRange) => {\n        const dateRange = transformPickerDateRangeToDateRange(pickerDateRange);\n\n        if (dateRange) {\n            onSelect?.(dateRange);\n            setInternalSelectedDateRange(dateRange);\n        }\n    };\n\n    return {\n        selectedDateRange,\n        handleSelect,\n    };\n};\n"],"names":["useDateRange","selected","onSelect","internalSelectedDateRange","setInternalSelectedDateRange","useState","prevSelected","setPrevSelected","useMemo","transformDateRangeToPickerDateRange","pickerDateRange","dateRange","transformPickerDateRangeToDateRange"],"mappings":";;AAQO,MAAMA,IAAe,CAACC,GAA+BC,MAAwD;AAChH,QAAM,CAACC,GAA2BC,CAA4B,IAAIC,EAA8BJ,CAAQ,GAClG,CAACK,GAAcC,CAAe,IAAIF,EAA0CJ,CAAQ;AAE1F,SAAIK,MAAiBL,MACjBM,EAAgBN,CAAQ,GACxBG,EAA6BH,CAAQ,IAgBlC;AAAA,IACH,mBAdsBO,EAAQ,MACvBC,EAAoCN,CAAyB,GACrE,CAACA,CAAyB,CAAC;AAAA,IAa1B,cAX8D,CAACO,MAAoB;AACnF,YAAMC,IAAYC,EAAoCF,CAAe;AAErE,MAAIC,MACAT,KAAA,QAAAA,EAAWS,IACXP,EAA6BO,CAAS;AAAA,IAE9C;AAAA,EAII;AAER;"}
+{"version":3,"file":"fondue-components106.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;"}

package/dist/fondue-components107.js

@@ -1,20 +1,28 @@
-import { useMemo as o } from "react";
-const f = {
-  hoverBefore: !1,
-  hoverAfter: !1,
-  hoverSelected: !1
-}, h = (r) => ({
-  hoverModifiers: o(() => !(r != null && r.from) || !(r != null && r.to) || (r == null ? void 0 : r.to.getTime()) > (r == null ? void 0 : r.from.getTime()) ? f : {
-    hoverBefore: {
-      before: r == null ? void 0 : r.from
-    },
-    hoverAfter: {
-      after: r == null ? void 0 : r.to
-    },
-    hoverSelected: r == null ? void 0 : r.from
-  }, [r])
-});
+const t = "_root_3dhca_5", o = "_textareaWrapper_3dhca_62", s = "_textarea_3dhca_62", a = "_slot_3dhca_120", _ = "_decorator_3dhca_145", c = "_tools_3dhca_158", r = "_toolsButton_3dhca_190", e = "_success_3dhca_222", n = "_error_3dhca_226", d = "_loadingStatus_3dhca_230", l = "_spin_3dhca_1", h = {
+  root: t,
+  textareaWrapper: o,
+  textarea: s,
+  slot: a,
+  decorator: _,
+  tools: c,
+  toolsButton: r,
+  success: e,
+  error: n,
+  loadingStatus: d,
+  spin: l
+};
 export {
-  h as useRangeHover
+  _ as decorator,
+  h as default,
+  n as error,
+  d as loadingStatus,
+  t as root,
+  a as slot,
+  l as spin,
+  e as success,
+  s as textarea,
+  o as textareaWrapper,
+  c as tools,
+  r as toolsButton
 };
 //# sourceMappingURL=fondue-components107.js.map

package/dist/fondue-components107.js.map

@@ -1 +1 @@
-{"version":3,"file":"fondue-components107.js","sources":["../src/components/DatePicker/hooks/useRangeHover.ts"],"sourcesContent":["/* (c) Copyright Frontify Ltd., all rights reserved. */\n\nimport { useMemo } from 'react';\nimport { type DateRange as InternalDayPickerDateRange } from 'react-day-picker';\n\ntype RangeHoverModifiers = {\n    hoverBefore:\n        | {\n              before: Date;\n          }\n        | false;\n    hoverAfter:\n        | {\n              after: Date;\n          }\n        | false;\n    hoverSelected: Date | false;\n};\n\nconst DISABLED_MODIFIERS: RangeHoverModifiers = {\n    hoverBefore: false,\n    hoverAfter: false,\n    hoverSelected: false,\n};\n\nexport const useRangeHover = (selectedDateRange?: InternalDayPickerDateRange) => {\n    const hoverModifiers = useMemo(() => {\n        if (\n            !selectedDateRange?.from ||\n            !selectedDateRange?.to ||\n            selectedDateRange?.to.getTime() > selectedDateRange?.from.getTime()\n        ) {\n            return DISABLED_MODIFIERS;\n        }\n        return {\n            hoverBefore: {\n                before: selectedDateRange?.from,\n            },\n            hoverAfter: {\n                after: selectedDateRange?.to,\n            },\n            hoverSelected: selectedDateRange?.from,\n        };\n    }, [selectedDateRange]);\n\n    return {\n        hoverModifiers,\n    };\n};\n"],"names":["DISABLED_MODIFIERS","useRangeHover","selectedDateRange","useMemo"],"mappings":";AAmBA,MAAMA,IAA0C;AAAA,EAC5C,aAAa;AAAA,EACb,YAAY;AAAA,EACZ,eAAe;AACnB,GAEaC,IAAgB,CAACC,OAoBnB;AAAA,EACH,gBApBmBC,EAAQ,MAEvB,EAACD,KAAA,QAAAA,EAAmB,SACpB,EAACA,KAAA,QAAAA,EAAmB,QACpBA,KAAA,gBAAAA,EAAmB,GAAG,cAAYA,KAAA,gBAAAA,EAAmB,KAAK,aAEnDF,IAEJ;AAAA,IACH,aAAa;AAAA,MACT,QAAQE,KAAA,gBAAAA,EAAmB;AAAA,IAAA;AAAA,IAE/B,YAAY;AAAA,MACR,OAAOA,KAAA,gBAAAA,EAAmB;AAAA,IAAA;AAAA,IAE9B,eAAeA,KAAA,gBAAAA,EAAmB;AAAA,EAAA,GAEvC,CAACA,CAAiB,CAAC;AAGlB;"}
+{"version":3,"file":"fondue-components107.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;"}

package/dist/fondue-components108.js

@@ -1,16 +1,12 @@
-import { useState as o, useMemo as i } from "react";
-import { transformDatePickerDateToDate as m, transformDateToDatePickerDate as d } from "./fondue-components118.js";
-const P = (e, t) => {
-  const [a, r] = o(e), [D, s] = o(e);
-  return D !== e && (s(e), r(e)), {
-    selectedDate: i(() => m(a), [a]),
-    handleSelect: (c) => {
-      const n = d(c);
-      r(n), t == null || t(n);
-    }
-  };
+const s = "_base_vux45_1", t = "_dark_vux45_249", _ = "_light_vux45_331", a = {
+  base: s,
+  dark: t,
+  light: _
 };
 export {
-  P as useSingleDate
+  s as base,
+  t as dark,
+  a as default,
+  _ as light
 };
 //# sourceMappingURL=fondue-components108.js.map

package/dist/fondue-components108.js.map

@@ -1 +1 @@
-{"version":3,"file":"fondue-components108.js","sources":["../src/components/DatePicker/hooks/useSingleDate.ts"],"sourcesContent":["/* (c) Copyright Frontify Ltd., all rights reserved. */\n\nimport { useMemo, useState } from 'react';\nimport { type OnSelectHandler } from 'react-day-picker';\n\nimport { transformDatePickerDateToDate, transformDateToDatePickerDate } from '../helpers/dateTransformer';\nimport { type DatePickerDate } from '../types';\n\nexport const useSingleDate = (selected?: DatePickerDate, onSelect?: (date?: DatePickerDate) => void) => {\n    const [internalSelectedDate, setInternalSelectedDate] = useState<DatePickerDate | undefined>(selected);\n    const [prevSelected, setPrevSelected] = useState<DatePickerDate | undefined>(selected);\n\n    if (prevSelected !== selected) {\n        setPrevSelected(selected);\n        setInternalSelectedDate(selected);\n    }\n\n    const selectedDate = useMemo(() => {\n        return transformDatePickerDateToDate(internalSelectedDate);\n    }, [internalSelectedDate]);\n\n    const handleSelect: OnSelectHandler<Date> = (date) => {\n        const datePickerDate = transformDateToDatePickerDate(date);\n\n        setInternalSelectedDate(datePickerDate);\n        onSelect?.(datePickerDate);\n    };\n\n    return {\n        selectedDate,\n        handleSelect,\n    };\n};\n"],"names":["useSingleDate","selected","onSelect","internalSelectedDate","setInternalSelectedDate","useState","prevSelected","setPrevSelected","useMemo","transformDatePickerDateToDate","date","datePickerDate","transformDateToDatePickerDate"],"mappings":";;AAQO,MAAMA,IAAgB,CAACC,GAA2BC,MAA+C;AACpG,QAAM,CAACC,GAAsBC,CAAuB,IAAIC,EAAqCJ,CAAQ,GAC/F,CAACK,GAAcC,CAAe,IAAIF,EAAqCJ,CAAQ;AAErF,SAAIK,MAAiBL,MACjBM,EAAgBN,CAAQ,GACxBG,EAAwBH,CAAQ,IAc7B;AAAA,IACH,cAZiBO,EAAQ,MAClBC,EAA8BN,CAAoB,GAC1D,CAACA,CAAoB,CAAC;AAAA,IAWrB,cATwC,CAACO,MAAS;AAClD,YAAMC,IAAiBC,EAA8BF,CAAI;AAEzD,MAAAN,EAAwBO,CAAc,GACtCT,KAAA,QAAAA,EAAWS;AAAA,IACf;AAAA,EAII;AAER;"}
+{"version":3,"file":"fondue-components108.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;"}

package/dist/fondue-components109.js

@@ -1,20 +1,34 @@
-const o = "_root_18649_5", c = "_caret_18649_43", t = "_colorName_18649_58", _ = "_colorIndicator_18649_61", n = "_button_18649_82", r = "_actions_18649_113", a = "_clearIcon_18649_122", s = {
-  root: o,
-  caret: c,
-  colorName: t,
-  colorIndicator: _,
-  button: n,
-  actions: r,
-  clearIcon: a
+import { enUS as e } from "./fondue-components143.js";
+const l = {
+  ColorPicker_selectColor: "Select Color",
+  ColorPicker_selectFormat: "Select a color format",
+  ColorPicker_hexValue: "Hex color value",
+  ColorPicker_redChannel: "Red Color Channel",
+  ColorPicker_greenChannel: "Green Color Channel",
+  ColorPicker_blueChannel: "Blue Color Channel",
+  ColorPicker_opacity: "Color Opacity",
+  DatePicker_selectDate: "Select Date",
+  Dialog_close: "Close",
+  Flyout_close: "Close",
+  Select_clear: "clear input",
+  Select_toggleMenu: "toggle menu",
+  Select_error: "Error",
+  Select_selectedCount: "${count} selected: ${items}",
+  Select_singleItemSelected: "1 item selected",
+  Select_multipleItemsSelected: "${count} items selected",
+  Select_additionalItemsSelected: "${count} additional items selected",
+  Switch_defaultLabel: "Switch",
+  Table_sortByDescending: "Sort by ${column} descending",
+  Table_sortByAscending: "Sort by ${column} ascending",
+  Table_sortDescending: "Sort descending",
+  Table_sortAscending: "Sort ascending",
+  Badge_dismiss: "Dismiss ${label}",
+  Notice_dismiss: "Dismiss notice"
+}, t = {
+  translationStrings: l,
+  dateLocale: e
 };
 export {
-  r as actions,
-  n as button,
-  c as caret,
-  a as clearIcon,
-  _ as colorIndicator,
-  t as colorName,
-  s as default,
-  o as root
+  t as enUS
 };
 //# sourceMappingURL=fondue-components109.js.map

package/dist/fondue-components109.js.map

@@ -1 +1 @@
-{"version":3,"file":"fondue-components109.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;"}
+{"version":3,"file":"fondue-components109.js","sources":["../src/locales/en-US.ts"],"sourcesContent":["/* (c) Copyright Frontify Ltd., all rights reserved. */\n\nimport { enUS as dateLocale } from 'date-fns/locale';\n\nconst translations = {\n    ColorPicker_selectColor: 'Select Color',\n    ColorPicker_selectFormat: 'Select a color format',\n    ColorPicker_hexValue: 'Hex color value',\n    ColorPicker_redChannel: 'Red Color Channel',\n    ColorPicker_greenChannel: 'Green Color Channel',\n    ColorPicker_blueChannel: 'Blue Color Channel',\n    ColorPicker_opacity: 'Color Opacity',\n    DatePicker_selectDate: 'Select Date',\n    Dialog_close: 'Close',\n    Flyout_close: 'Close',\n    Select_clear: 'clear input',\n    Select_toggleMenu: 'toggle menu',\n    Select_error: 'Error',\n    Select_selectedCount: '${count} selected: ${items}',\n    Select_singleItemSelected: '1 item selected',\n    Select_multipleItemsSelected: '${count} items selected',\n    Select_additionalItemsSelected: '${count} additional items selected',\n    Switch_defaultLabel: 'Switch',\n    Table_sortByDescending: 'Sort by ${column} descending',\n    Table_sortByAscending: 'Sort by ${column} ascending',\n    Table_sortDescending: 'Sort descending',\n    Table_sortAscending: 'Sort ascending',\n    Badge_dismiss: 'Dismiss ${label}',\n    Notice_dismiss: 'Dismiss notice',\n};\n\nexport const enUS = {\n    translationStrings: translations,\n    dateLocale,\n};\n"],"names":["translations","enUS","dateLocale"],"mappings":";AAIA,MAAMA,IAAe;AAAA,EACjB,yBAAyB;AAAA,EACzB,0BAA0B;AAAA,EAC1B,sBAAsB;AAAA,EACtB,wBAAwB;AAAA,EACxB,0BAA0B;AAAA,EAC1B,yBAAyB;AAAA,EACzB,qBAAqB;AAAA,EACrB,uBAAuB;AAAA,EACvB,cAAc;AAAA,EACd,cAAc;AAAA,EACd,cAAc;AAAA,EACd,mBAAmB;AAAA,EACnB,cAAc;AAAA,EACd,sBAAsB;AAAA,EACtB,2BAA2B;AAAA,EAC3B,8BAA8B;AAAA,EAC9B,gCAAgC;AAAA,EAChC,qBAAqB;AAAA,EACrB,wBAAwB;AAAA,EACxB,uBAAuB;AAAA,EACvB,sBAAsB;AAAA,EACtB,qBAAqB;AAAA,EACrB,eAAe;AAAA,EACf,gBAAgB;AACpB,GAEaC,IAAO;AAAA,EAChB,oBAAoBD;AAAA,EAAA,YACpBE;AACJ;"}

package/dist/fondue-components11.js

@@ -2,9 +2,9 @@ import { jsx as d, jsxs as C } from "react/jsx-runtime";
 import { IconCaretRight as _ } from "@frontify/fondue-icons";
 import * as a from "@radix-ui/react-dropdown-menu";
 import { forwardRef as i, useRef as R, useMemo as j, Children as B } from "react";
-import { useFondueTheme as F, ThemeProvider as I } from "./fondue-components37.js";
-import { useProcessedChildren as T } from "./fondue-components56.js";
-import u from "./fondue-components57.js";
+import { useFondueTheme as F, ThemeProvider as I } from "./fondue-components39.js";
+import { useProcessedChildren as T } from "./fondue-components58.js";
+import u from "./fondue-components59.js";
 const y = ({
   children: t,
   open: o,

package/dist/fondue-components110.js

@@ -1,9 +1,10 @@
-import { useMemo as t } from "react";
-const m = (n, s) => t(() => n.map((r) => {
-  const o = s(r), p = (o == null ? void 0 : o.label) ?? r;
-  return { value: r, displayValue: p };
-}), [n, s]);
+const o = "_root_jwtp8_4", t = "_arrow_jwtp8_27", r = {
+  root: o,
+  arrow: t
+};
 export {
-  m as useBadgeItems
+  t as arrow,
+  r as default,
+  o as root
 };
 //# sourceMappingURL=fondue-components110.js.map

package/dist/fondue-components110.js.map

@@ -1 +1 @@
-{"version":3,"file":"fondue-components110.js","sources":["../src/components/Select/hooks/useBadgeItems.ts"],"sourcesContent":["/* (c) Copyright Frontify Ltd., all rights reserved. */\n\nimport { useMemo } from 'react';\n\ntype SelectItemLike = {\n    value: string;\n    label: string;\n};\n\ntype BadgeItem = {\n    value: string;\n    displayValue: string;\n};\n\nexport const useBadgeItems = (\n    selectedItemValues: string[],\n    getItemByValue: (value?: string) => SelectItemLike | undefined,\n): BadgeItem[] => {\n    return useMemo(() => {\n        return selectedItemValues.map((value) => {\n            const item = getItemByValue(value);\n            const displayValue = item?.label ?? value;\n            return { value, displayValue };\n        });\n    }, [selectedItemValues, getItemByValue]);\n};\n"],"names":["useBadgeItems","selectedItemValues","getItemByValue","useMemo","value","item","displayValue"],"mappings":";AAcO,MAAMA,IAAgB,CACzBC,GACAC,MAEOC,EAAQ,MACJF,EAAmB,IAAI,CAACG,MAAU;AACrC,QAAMC,IAAOH,EAAeE,CAAK,GAC3BE,KAAeD,KAAA,gBAAAA,EAAM,UAASD;AACpC,SAAO,EAAE,OAAAA,GAAO,cAAAE,EAAA;AACpB,CAAC,GACF,CAACL,GAAoBC,CAAc,CAAC;"}
+{"version":3,"file":"fondue-components110.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;"}

package/dist/fondue-components111.js

@@ -1,15 +1,20 @@
-import { useRef as u, useCallback as t } from "react";
-const c = () => {
-  const s = u(!1), o = t((e) => {
-    s.current = !0, e.currentTarget.dataset.showFocusRing = "false";
-  }, []), r = t((e) => {
-    s.current || (e.target.dataset.showFocusRing = "true");
-  }, []), n = t((e) => {
-    e.target.dataset.showFocusRing = "false", s.current = !1;
-  }, []);
-  return { wasClickedRef: s, onMouseDown: o, onFocus: r, onBlur: n };
+const o = "_root_18649_5", c = "_caret_18649_43", t = "_colorName_18649_58", _ = "_colorIndicator_18649_61", n = "_button_18649_82", r = "_actions_18649_113", a = "_clearIcon_18649_122", s = {
+  root: o,
+  caret: c,
+  colorName: t,
+  colorIndicator: _,
+  button: n,
+  actions: r,
+  clearIcon: a
 };
 export {
-  c as useFocusRing
+  r as actions,
+  n as button,
+  c as caret,
+  a as clearIcon,
+  _ as colorIndicator,
+  t as colorName,
+  s as default,
+  o as root
 };
 //# sourceMappingURL=fondue-components111.js.map

package/dist/fondue-components111.js.map

@@ -1 +1 @@
-{"version":3,"file":"fondue-components111.js","sources":["../src/components/Select/hooks/useFocusRing.ts"],"sourcesContent":["/* (c) Copyright Frontify Ltd., all rights reserved. */\n\nimport { useCallback, useRef, type FocusEvent, type MouseEvent, type MutableRefObject } from 'react';\n\ntype FocusRingHandlers = {\n    /** Ref tracking whether the element was activated via mouse click. */\n    wasClickedRef: MutableRefObject<boolean>;\n    /** Handler for mousedown events — marks the interaction as click-based. */\n    onMouseDown: (event: MouseEvent<HTMLElement>) => void;\n    /** Handler for focus events — shows the focus ring only for keyboard navigation. */\n    onFocus: (event: FocusEvent<HTMLElement>) => void;\n    /** Handler for blur events — hides the focus ring and resets click tracking. */\n    onBlur: (event: FocusEvent<HTMLElement>) => void;\n};\n\nexport const useFocusRing = (): FocusRingHandlers => {\n    const wasClickedRef = useRef(false);\n\n    const onMouseDown = useCallback((event: MouseEvent<HTMLElement>): void => {\n        wasClickedRef.current = true;\n        event.currentTarget.dataset.showFocusRing = 'false';\n    }, []);\n\n    const onFocus = useCallback((event: FocusEvent<HTMLElement>): void => {\n        if (!wasClickedRef.current) {\n            event.target.dataset.showFocusRing = 'true';\n        }\n    }, []);\n\n    const onBlur = useCallback((event: FocusEvent<HTMLElement>): void => {\n        event.target.dataset.showFocusRing = 'false';\n        wasClickedRef.current = false;\n    }, []);\n\n    return { wasClickedRef, onMouseDown, onFocus, onBlur };\n};\n"],"names":["useFocusRing","wasClickedRef","useRef","onMouseDown","useCallback","event","onFocus","onBlur"],"mappings":";AAeO,MAAMA,IAAe,MAAyB;AACjD,QAAMC,IAAgBC,EAAO,EAAK,GAE5BC,IAAcC,EAAY,CAACC,MAAyC;AACtE,IAAAJ,EAAc,UAAU,IACxBI,EAAM,cAAc,QAAQ,gBAAgB;AAAA,EAChD,GAAG,CAAA,CAAE,GAECC,IAAUF,EAAY,CAACC,MAAyC;AAClE,IAAKJ,EAAc,YACfI,EAAM,OAAO,QAAQ,gBAAgB;AAAA,EAE7C,GAAG,CAAA,CAAE,GAECE,IAASH,EAAY,CAACC,MAAyC;AACjE,IAAAA,EAAM,OAAO,QAAQ,gBAAgB,SACrCJ,EAAc,UAAU;AAAA,EAC5B,GAAG,CAAA,CAAE;AAEL,SAAO,EAAE,eAAAA,GAAe,aAAAE,GAAa,SAAAG,GAAS,QAAAC,EAAA;AAClD;"}
+{"version":3,"file":"fondue-components111.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;"}