@frontify/fondue-components 29.0.0 → 29.0.1

package/dist/fondue-components111.js

@@ -1,8 +1,20 @@
-const o = "_root_1y4f3_2", t = {
-  root: o
+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 {
-  t as default,
+  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":[],"sourcesContent":[],"names":[],"mappings":";;;"}
+{"version":3,"file":"fondue-components111.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;"}

package/dist/fondue-components112.js

@@ -1,8 +1,130 @@
-const r = (e) => {
-  if (e)
-    return `rgba(${e.red}, ${e.green}, ${e.blue}, ${e.alpha ?? 1})`;
-};
+import { useCallback as c } from "react";
+import { deepEqual as f } from "./fondue-components139.js";
+import { defaultSortableTransition as x, Sortable as R } from "./fondue-components84.js";
+import { isSortable as rr } from "./fondue-components84.js";
+import { useInstance as T } from "@dnd-kit/react";
+import { useDeepSignal as V, useOnValueChange as i, useIsomorphicLayoutEffect as k, useOnElementChange as m, useImmediateEffect as q } from "./fondue-components140.js";
+import { currentValue as v } from "./fondue-components141.js";
+import { batch as L } from "./fondue-components142.js";
+var N = Object.defineProperty, U = Object.defineProperties, z = Object.getOwnPropertyDescriptors, I = Object.getOwnPropertySymbols, A = Object.prototype.hasOwnProperty, B = Object.prototype.propertyIsEnumerable, j = (o, t, a) => t in o ? N(o, t, { enumerable: !0, configurable: !0, writable: !0, value: a }) : o[t] = a, _ = (o, t) => {
+  for (var a in t || (t = {}))
+    A.call(t, a) && j(o, a, t[a]);
+  if (I)
+    for (var a of I(t))
+      B.call(t, a) && j(o, a, t[a]);
+  return o;
+}, F = (o, t) => U(o, z(t));
+function Y(o) {
+  const {
+    accept: t,
+    collisionDetector: a,
+    collisionPriority: b,
+    id: O,
+    data: p,
+    element: h,
+    handle: y,
+    index: g,
+    group: D,
+    disabled: P,
+    feedback: d,
+    modifiers: S,
+    sensors: w,
+    target: C,
+    type: E
+  } = o, l = _(_({}, x), o.transition), r = T((e) => new R(
+    F(_({}, o), {
+      transition: l,
+      register: !1,
+      handle: v(y),
+      element: v(h),
+      target: v(C),
+      feedback: d
+    }),
+    e
+  )), u = V(r, G);
+  return i(O, () => r.id = O), k(() => {
+    L(() => {
+      r.group = D, r.index = g;
+    });
+  }, [r, D, g]), i(E, () => r.type = E), i(
+    t,
+    () => r.accept = t,
+    void 0,
+    f
+  ), i(p, () => p && (r.data = p)), i(
+    g,
+    () => {
+      var e;
+      (e = r.manager) != null && e.dragOperation.status.idle && (l != null && l.idle) && r.refreshShape();
+    },
+    q
+  ), m(y, (e) => r.handle = e), m(h, (e) => r.element = e), m(C, (e) => r.target = e), i(P, () => r.disabled = P === !0), i(w, () => r.sensors = w), i(
+    a,
+    () => r.collisionDetector = a
+  ), i(
+    b,
+    () => r.collisionPriority = b
+  ), i(d, () => r.feedback = d ?? "default"), i(
+    l,
+    () => r.transition = l,
+    void 0,
+    f
+  ), i(
+    S,
+    () => r.modifiers = S,
+    void 0,
+    f
+  ), i(
+    o.alignment,
+    () => r.alignment = o.alignment
+  ), {
+    sortable: u,
+    get isDragging() {
+      return u.isDragging;
+    },
+    get isDropping() {
+      return u.isDropping;
+    },
+    get isDragSource() {
+      return u.isDragSource;
+    },
+    get isDropTarget() {
+      return u.isDropTarget;
+    },
+    handleRef: c(
+      (e) => {
+        r.handle = e ?? void 0;
+      },
+      [r]
+    ),
+    ref: c(
+      (e) => {
+        var n, s;
+        !e && ((n = r.element) != null && n.isConnected) && !((s = r.manager) != null && s.dragOperation.status.idle) || (r.element = e ?? void 0);
+      },
+      [r]
+    ),
+    sourceRef: c(
+      (e) => {
+        var n, s;
+        !e && ((n = r.source) != null && n.isConnected) && !((s = r.manager) != null && s.dragOperation.status.idle) || (r.source = e ?? void 0);
+      },
+      [r]
+    ),
+    targetRef: c(
+      (e) => {
+        var n, s;
+        !e && ((n = r.target) != null && n.isConnected) && !((s = r.manager) != null && s.dragOperation.status.idle) || (r.target = e ?? void 0);
+      },
+      [r]
+    )
+  };
+}
+function G(o, t, a) {
+  return !!(o === "isDragSource" && !a && t);
+}
 export {
-  r as colorToCss
+  rr as isSortable,
+  Y as useSortable
 };
 //# sourceMappingURL=fondue-components112.js.map

package/dist/fondue-components112.js.map

@@ -1 +1 @@
-{"version":3,"file":"fondue-components112.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;"}
+{"version":3,"file":"fondue-components112.js","sources":["../../../node_modules/.pnpm/@dnd-kit+react@0.3.2_react-dom@18.3.1_react@18.3.1__react@18.3.1/node_modules/@dnd-kit/react/sortable.js"],"sourcesContent":["import { useCallback } from 'react';\nimport { batch, deepEqual } from '@dnd-kit/state';\nimport { defaultSortableTransition, Sortable } from '@dnd-kit/dom/sortable';\nexport { isSortable, isSortableOperation } from '@dnd-kit/dom/sortable';\nimport { useInstance } from '@dnd-kit/react';\nimport { useDeepSignal, useOnValueChange, useIsomorphicLayoutEffect, useImmediateEffect, useOnElementChange } from '@dnd-kit/react/hooks';\nimport { currentValue } from '@dnd-kit/react/utilities';\n\nvar __defProp = Object.defineProperty;\nvar __defProps = Object.defineProperties;\nvar __getOwnPropDescs = Object.getOwnPropertyDescriptors;\nvar __getOwnPropSymbols = Object.getOwnPropertySymbols;\nvar __hasOwnProp = Object.prototype.hasOwnProperty;\nvar __propIsEnum = Object.prototype.propertyIsEnumerable;\nvar __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;\nvar __spreadValues = (a, b) => {\n  for (var prop in b || (b = {}))\n    if (__hasOwnProp.call(b, prop))\n      __defNormalProp(a, prop, b[prop]);\n  if (__getOwnPropSymbols)\n    for (var prop of __getOwnPropSymbols(b)) {\n      if (__propIsEnum.call(b, prop))\n        __defNormalProp(a, prop, b[prop]);\n    }\n  return a;\n};\nvar __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));\nfunction useSortable(input) {\n  const {\n    accept,\n    collisionDetector,\n    collisionPriority,\n    id,\n    data,\n    element,\n    handle,\n    index,\n    group,\n    disabled,\n    feedback,\n    modifiers,\n    sensors,\n    target,\n    type\n  } = input;\n  const transition = __spreadValues(__spreadValues({}, defaultSortableTransition), input.transition);\n  const sortable = useInstance((manager) => {\n    return new Sortable(\n      __spreadProps(__spreadValues({}, input), {\n        transition,\n        register: false,\n        handle: currentValue(handle),\n        element: currentValue(element),\n        target: currentValue(target),\n        feedback\n      }),\n      manager\n    );\n  });\n  const trackedSortable = useDeepSignal(sortable, shouldUpdateSynchronously);\n  useOnValueChange(id, () => sortable.id = id);\n  useIsomorphicLayoutEffect(() => {\n    batch(() => {\n      sortable.group = group;\n      sortable.index = index;\n    });\n  }, [sortable, group, index]);\n  useOnValueChange(type, () => sortable.type = type);\n  useOnValueChange(\n    accept,\n    () => sortable.accept = accept,\n    void 0,\n    deepEqual\n  );\n  useOnValueChange(data, () => data && (sortable.data = data));\n  useOnValueChange(\n    index,\n    () => {\n      var _a;\n      if (((_a = sortable.manager) == null ? void 0 : _a.dragOperation.status.idle) && (transition == null ? void 0 : transition.idle)) {\n        sortable.refreshShape();\n      }\n    },\n    useImmediateEffect\n  );\n  useOnElementChange(handle, (handle2) => sortable.handle = handle2);\n  useOnElementChange(element, (element2) => sortable.element = element2);\n  useOnElementChange(target, (target2) => sortable.target = target2);\n  useOnValueChange(disabled, () => sortable.disabled = disabled === true);\n  useOnValueChange(sensors, () => sortable.sensors = sensors);\n  useOnValueChange(\n    collisionDetector,\n    () => sortable.collisionDetector = collisionDetector\n  );\n  useOnValueChange(\n    collisionPriority,\n    () => sortable.collisionPriority = collisionPriority\n  );\n  useOnValueChange(feedback, () => sortable.feedback = feedback != null ? feedback : \"default\");\n  useOnValueChange(\n    transition,\n    () => sortable.transition = transition,\n    void 0,\n    deepEqual\n  );\n  useOnValueChange(\n    modifiers,\n    () => sortable.modifiers = modifiers,\n    void 0,\n    deepEqual\n  );\n  useOnValueChange(\n    input.alignment,\n    () => sortable.alignment = input.alignment\n  );\n  return {\n    sortable: trackedSortable,\n    get isDragging() {\n      return trackedSortable.isDragging;\n    },\n    get isDropping() {\n      return trackedSortable.isDropping;\n    },\n    get isDragSource() {\n      return trackedSortable.isDragSource;\n    },\n    get isDropTarget() {\n      return trackedSortable.isDropTarget;\n    },\n    handleRef: useCallback(\n      (element2) => {\n        sortable.handle = element2 != null ? element2 : void 0;\n      },\n      [sortable]\n    ),\n    ref: useCallback(\n      (element2) => {\n        var _a, _b;\n        if (!element2 && ((_a = sortable.element) == null ? void 0 : _a.isConnected) && !((_b = sortable.manager) == null ? void 0 : _b.dragOperation.status.idle)) {\n          return;\n        }\n        sortable.element = element2 != null ? element2 : void 0;\n      },\n      [sortable]\n    ),\n    sourceRef: useCallback(\n      (element2) => {\n        var _a, _b;\n        if (!element2 && ((_a = sortable.source) == null ? void 0 : _a.isConnected) && !((_b = sortable.manager) == null ? void 0 : _b.dragOperation.status.idle)) {\n          return;\n        }\n        sortable.source = element2 != null ? element2 : void 0;\n      },\n      [sortable]\n    ),\n    targetRef: useCallback(\n      (element2) => {\n        var _a, _b;\n        if (!element2 && ((_a = sortable.target) == null ? void 0 : _a.isConnected) && !((_b = sortable.manager) == null ? void 0 : _b.dragOperation.status.idle)) {\n          return;\n        }\n        sortable.target = element2 != null ? element2 : void 0;\n      },\n      [sortable]\n    )\n  };\n}\nfunction shouldUpdateSynchronously(key, oldValue, newValue) {\n  if (key === \"isDragSource\" && !newValue && oldValue) return true;\n  return false;\n}\n\nexport { useSortable };\n//# sourceMappingURL=sortable.js.map\n//# sourceMappingURL=sortable.js.map"],"names":["__defProp","__defProps","__getOwnPropDescs","__getOwnPropSymbols","__hasOwnProp","__propIsEnum","__defNormalProp","obj","key","value","__spreadValues","a","b","prop","__spreadProps","useSortable","input","accept","collisionDetector","collisionPriority","id","data","element","handle","index","group","disabled","feedback","modifiers","sensors","target","type","transition","defaultSortableTransition","sortable","useInstance","manager","Sortable","currentValue","trackedSortable","useDeepSignal","shouldUpdateSynchronously","useOnValueChange","useIsomorphicLayoutEffect","batch","deepEqual","_a","useImmediateEffect","useOnElementChange","handle2","element2","target2","useCallback","_b","oldValue","newValue"],"mappings":"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","x_google_ignoreList":[0]}

package/dist/fondue-components113.js

@@ -1,20 +1,14 @@
-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 { createContext as t, useContext as r } from "react";
+const e = t({
+  itemId: "",
+  dragHandleRef: () => null,
+  hasHandle: !1
+});
+e.displayName = "OrderableItemContext";
+const a = e.Provider, n = () => r(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
+  e as OrderableItemContext,
+  a as OrderableItemContextProvider,
+  n as useOrderableItemContext
 };
 //# sourceMappingURL=fondue-components113.js.map

package/dist/fondue-components113.js.map

@@ -1 +1 @@
-{"version":3,"file":"fondue-components113.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;"}
+{"version":3,"file":"fondue-components113.js","sources":["../src/components/OrderableList/hooks/useOrderedListItemContext.ts"],"sourcesContent":["/* (c) Copyright Frontify Ltd., all rights reserved. */\n\nimport { createContext, useContext } from 'react';\n\ntype OrderableItemContextType = {\n    itemId: string;\n    dragHandleRef: (element: Element | null) => void;\n    hasHandle: boolean;\n    selected?: boolean;\n    onSelect?: (isSelected: boolean) => void;\n};\n\nexport const OrderableItemContext = createContext<OrderableItemContextType>({\n    itemId: '',\n    dragHandleRef: () => null,\n    hasHandle: false,\n});\nOrderableItemContext.displayName = 'OrderableItemContext';\n\nexport const OrderableItemContextProvider = OrderableItemContext.Provider;\n\nexport const useOrderableItemContext = (): OrderableItemContextType => useContext(OrderableItemContext);\n"],"names":["OrderableItemContext","createContext","OrderableItemContextProvider","useOrderableItemContext","useContext"],"mappings":";AAYO,MAAMA,IAAuBC,EAAwC;AAAA,EACxE,QAAQ;AAAA,EACR,eAAe,MAAM;AAAA,EACrB,WAAW;AACf,CAAC;AACDD,EAAqB,cAAc;AAE5B,MAAME,IAA+BF,EAAqB,UAEpDG,IAA0B,MAAgCC,EAAWJ,CAAoB;"}

package/dist/fondue-components114.js

@@ -1,17 +1,39 @@
-import { format as o } from "date-fns";
-import { transformDateRangeToPickerDateRange as i, transformDatePickerDateToDate as e } from "./fondue-components132.js";
-const y = (r) => !!(r && "from" in r && "to" in r), M = (r) => {
-  const t = e(r);
-  if (t)
-    return o(t, "MMMM d, yyyy");
-}, a = (r) => {
-  const t = i(r);
-  if (!(t != null && t.from) || !(t != null && t.to))
-    return;
-  const n = t.from.getFullYear() === t.to.getFullYear();
-  return n && t.from.getMonth() === t.to.getMonth() ? `${o(t.from, "MMM d")}–${o(t.to, "d, yyyy")}` : n ? `${o(t.from, "MMM d")}–${o(t.to, "MMM d, yyyy")}` : `${o(t.from, "MMM d, yyyy")}–${o(t.to, "MMM d, yyyy")}`;
-}, g = (r) => y(r) ? a(r) : M(r);
+import { jsx as s } from "react/jsx-runtime";
+import { forwardRef as f } from "react";
+import { getItemTitle as p } from "./fondue-components80.js";
+import { useOrderableListAnnounce as u } from "./fondue-components81.js";
+import { useOrderableItemContext as b } from "./fondue-components113.js";
+import l from "./fondue-components83.js";
+const I = f(({ children: t }, o) => {
+  const { itemId: c, onSelect: n, selected: r, hasHandle: d } = b(), m = u();
+  if (!n)
+    return (
+      // eslint-disable-next-line jsx-a11y-x/no-noninteractive-tabindex
+      /* @__PURE__ */ s("div", { className: l.content, ref: o, tabIndex: d ? 0 : void 0, children: t })
+    );
+  const a = () => {
+    const e = !r;
+    n(e), m(`${p(c)} ${e ? "selected" : "unselected"}`);
+  }, i = (e) => {
+    (e.key === "Enter" || e.key === " ") && (e.preventDefault(), a());
+  };
+  return /* @__PURE__ */ s(
+    "div",
+    {
+      className: l.content,
+      ref: o,
+      role: "button",
+      tabIndex: 0,
+      "aria-pressed": !!r,
+      onClick: a,
+      onKeyDown: i,
+      "data-clickable": !0,
+      children: t
+    }
+  );
+});
+I.displayName = "OrderableListItemContent";
 export {
-  g as getDateDisplayString
+  I as OrderableListItemContent
 };
 //# sourceMappingURL=fondue-components114.js.map

package/dist/fondue-components114.js.map

@@ -1 +1 @@
-{"version":3,"file":"fondue-components114.js","sources":["../src/components/DatePicker/helpers/dateDisplayFormatter.ts"],"sourcesContent":["/* (c) Copyright Frontify Ltd., all rights reserved. */\n\nimport { format } from 'date-fns';\n\nimport { type DatePickerDate, type DatePickerDateRange } from '../types';\n\nimport { transformDateRangeToPickerDateRange, transformDatePickerDateToDate } from './dateTransformer';\n\nconst isDateRange = (selected?: DatePickerDateRange | DatePickerDate): selected is DatePickerDateRange => {\n    return Boolean(selected && 'from' in selected && 'to' in selected);\n};\n\nconst getSingleDateDisplayString = (selected?: DatePickerDate): string | undefined => {\n    const singleDate = transformDatePickerDateToDate(selected);\n    if (!singleDate) {\n        return undefined;\n    }\n    return format(singleDate, 'MMMM d, yyyy');\n};\n\nconst getDateRangeDisplayString = (selected?: DatePickerDateRange): string | undefined => {\n    const dateRange = transformDateRangeToPickerDateRange(selected);\n    if (!dateRange?.from || !dateRange?.to) {\n        return undefined;\n    }\n\n    const isSameYear = dateRange.from.getFullYear() === dateRange.to.getFullYear();\n\n    const isSameMonth = isSameYear && dateRange.from.getMonth() === dateRange.to.getMonth();\n\n    if (isSameMonth) {\n        return `${format(dateRange.from, 'MMM d')}\\u2013${format(dateRange.to, 'd, yyyy')}`;\n    }\n\n    if (isSameYear) {\n        return `${format(dateRange.from, 'MMM d')}\\u2013${format(dateRange.to, 'MMM d, yyyy')}`;\n    }\n\n    return `${format(dateRange.from, 'MMM d, yyyy')}\\u2013${format(dateRange.to, 'MMM d, yyyy')}`;\n};\n\nexport const getDateDisplayString = (selected?: DatePickerDateRange | DatePickerDate): string | undefined => {\n    if (isDateRange(selected)) {\n        return getDateRangeDisplayString(selected);\n    }\n    return getSingleDateDisplayString(selected);\n};\n"],"names":["isDateRange","selected","getSingleDateDisplayString","singleDate","transformDatePickerDateToDate","format","getDateRangeDisplayString","dateRange","transformDateRangeToPickerDateRange","isSameYear","getDateDisplayString"],"mappings":";;AAQA,MAAMA,IAAc,CAACC,MACV,GAAQA,KAAY,UAAUA,KAAY,QAAQA,IAGvDC,IAA6B,CAACD,MAAkD;AAClF,QAAME,IAAaC,EAA8BH,CAAQ;AACzD,MAAKE;AAGL,WAAOE,EAAOF,GAAY,cAAc;AAC5C,GAEMG,IAA4B,CAACL,MAAuD;AACtF,QAAMM,IAAYC,EAAoCP,CAAQ;AAC9D,MAAI,EAACM,KAAA,QAAAA,EAAW,SAAQ,EAACA,KAAA,QAAAA,EAAW;AAChC;AAGJ,QAAME,IAAaF,EAAU,KAAK,kBAAkBA,EAAU,GAAG,YAAA;AAIjE,SAFoBE,KAAcF,EAAU,KAAK,eAAeA,EAAU,GAAG,SAAA,IAGlE,GAAGF,EAAOE,EAAU,MAAM,OAAO,CAAC,IAASF,EAAOE,EAAU,IAAI,SAAS,CAAC,KAGjFE,IACO,GAAGJ,EAAOE,EAAU,MAAM,OAAO,CAAC,IAASF,EAAOE,EAAU,IAAI,aAAa,CAAC,KAGlF,GAAGF,EAAOE,EAAU,MAAM,aAAa,CAAC,IAASF,EAAOE,EAAU,IAAI,aAAa,CAAC;AAC/F,GAEaG,IAAuB,CAACT,MAC7BD,EAAYC,CAAQ,IACbK,EAA0BL,CAAQ,IAEtCC,EAA2BD,CAAQ;"}
+{"version":3,"file":"fondue-components114.js","sources":["../src/components/OrderableList/OrderableListItemContent.tsx"],"sourcesContent":["/* (c) Copyright Frontify Ltd., all rights reserved. */\n\nimport { forwardRef, type KeyboardEvent, type ReactNode } from 'react';\n\nimport { getItemTitle } from './helpers/getItemTitle';\nimport { useOrderableListAnnounce } from './hooks/useOrderableListAnnounce';\nimport { useOrderableItemContext } from './hooks/useOrderedListItemContext';\nimport styles from './styles/orderable-list.module.scss';\n\nexport const OrderableListItemContent = forwardRef<HTMLDivElement, { children: ReactNode }>(({ children }, ref) => {\n    const { itemId, onSelect, selected, hasHandle } = useOrderableItemContext();\n    const announce = useOrderableListAnnounce();\n\n    if (!onSelect) {\n        return (\n            // eslint-disable-next-line jsx-a11y-x/no-noninteractive-tabindex\n            <div className={styles.content} ref={ref} tabIndex={hasHandle ? 0 : undefined}>\n                {children}\n            </div>\n        );\n    }\n\n    const handleSelect = () => {\n        const newSelected = !selected;\n        onSelect(newSelected);\n        announce(`${getItemTitle(itemId)} ${newSelected ? 'selected' : 'unselected'}`);\n    };\n\n    const handleKeyDown = (event: KeyboardEvent) => {\n        if (event.key === 'Enter' || event.key === ' ') {\n            event.preventDefault();\n            handleSelect();\n        }\n    };\n\n    return (\n        <div\n            className={styles.content}\n            ref={ref}\n            role=\"button\"\n            tabIndex={0}\n            aria-pressed={Boolean(selected)}\n            onClick={handleSelect}\n            onKeyDown={handleKeyDown}\n            data-clickable\n        >\n            {children}\n        </div>\n    );\n});\nOrderableListItemContent.displayName = 'OrderableListItemContent';\n"],"names":["OrderableListItemContent","forwardRef","children","ref","itemId","onSelect","selected","hasHandle","useOrderableItemContext","announce","useOrderableListAnnounce","jsx","styles","handleSelect","newSelected","getItemTitle","handleKeyDown","event"],"mappings":";;;;;;AASO,MAAMA,IAA2BC,EAAoD,CAAC,EAAE,UAAAC,EAAA,GAAYC,MAAQ;AAC/G,QAAM,EAAE,QAAAC,GAAQ,UAAAC,GAAU,UAAAC,GAAU,WAAAC,EAAA,IAAcC,EAAA,GAC5CC,IAAWC,EAAA;AAEjB,MAAI,CAACL;AACD;AAAA;AAAA,MAEI,gBAAAM,EAAC,OAAA,EAAI,WAAWC,EAAO,SAAS,KAAAT,GAAU,UAAUI,IAAY,IAAI,QAC/D,UAAAL,EAAA,CACL;AAAA;AAIR,QAAMW,IAAe,MAAM;AACvB,UAAMC,IAAc,CAACR;AACrB,IAAAD,EAASS,CAAW,GACpBL,EAAS,GAAGM,EAAaX,CAAM,CAAC,IAAIU,IAAc,aAAa,YAAY,EAAE;AAAA,EACjF,GAEME,IAAgB,CAACC,MAAyB;AAC5C,KAAIA,EAAM,QAAQ,WAAWA,EAAM,QAAQ,SACvCA,EAAM,eAAA,GACNJ,EAAA;AAAA,EAER;AAEA,SACI,gBAAAF;AAAA,IAAC;AAAA,IAAA;AAAA,MACG,WAAWC,EAAO;AAAA,MAClB,KAAAT;AAAA,MACA,MAAK;AAAA,MACL,UAAU;AAAA,MACV,gBAAc,EAAQG;AAAA,MACtB,SAASO;AAAA,MACT,WAAWG;AAAA,MACX,kBAAc;AAAA,MAEb,UAAAd;AAAA,IAAA;AAAA,EAAA;AAGb,CAAC;AACDF,EAAyB,cAAc;"}

package/dist/fondue-components115.js

@@ -1,18 +1,17 @@
-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 = {
-  root: t,
-  caret: a,
-  dateName: o,
-  button: n,
-  actions: c,
-  clearIcon: _
-};
+import { format as o } from "date-fns";
+import { transformDateRangeToPickerDateRange as i, transformDatePickerDateToDate as e } from "./fondue-components128.js";
+const y = (r) => !!(r && "from" in r && "to" in r), M = (r) => {
+  const t = e(r);
+  if (t)
+    return o(t, "MMMM d, yyyy");
+}, a = (r) => {
+  const t = i(r);
+  if (!(t != null && t.from) || !(t != null && t.to))
+    return;
+  const n = t.from.getFullYear() === t.to.getFullYear();
+  return n && t.from.getMonth() === t.to.getMonth() ? `${o(t.from, "MMM d")}–${o(t.to, "d, yyyy")}` : n ? `${o(t.from, "MMM d")}–${o(t.to, "MMM d, yyyy")}` : `${o(t.from, "MMM d, yyyy")}–${o(t.to, "MMM d, yyyy")}`;
+}, g = (r) => y(r) ? a(r) : M(r);
 export {
-  c as actions,
-  n as button,
-  a as caret,
-  _ as clearIcon,
-  o as dateName,
-  e as default,
-  t as root
+  g as getDateDisplayString
 };
 //# sourceMappingURL=fondue-components115.js.map

package/dist/fondue-components115.js.map

@@ -1 +1 @@
-{"version":3,"file":"fondue-components115.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;"}
+{"version":3,"file":"fondue-components115.js","sources":["../src/components/DatePicker/helpers/dateDisplayFormatter.ts"],"sourcesContent":["/* (c) Copyright Frontify Ltd., all rights reserved. */\n\nimport { format } from 'date-fns';\n\nimport { type DatePickerDate, type DatePickerDateRange } from '../types';\n\nimport { transformDateRangeToPickerDateRange, transformDatePickerDateToDate } from './dateTransformer';\n\nconst isDateRange = (selected?: DatePickerDateRange | DatePickerDate): selected is DatePickerDateRange => {\n    return Boolean(selected && 'from' in selected && 'to' in selected);\n};\n\nconst getSingleDateDisplayString = (selected?: DatePickerDate): string | undefined => {\n    const singleDate = transformDatePickerDateToDate(selected);\n    if (!singleDate) {\n        return undefined;\n    }\n    return format(singleDate, 'MMMM d, yyyy');\n};\n\nconst getDateRangeDisplayString = (selected?: DatePickerDateRange): string | undefined => {\n    const dateRange = transformDateRangeToPickerDateRange(selected);\n    if (!dateRange?.from || !dateRange?.to) {\n        return undefined;\n    }\n\n    const isSameYear = dateRange.from.getFullYear() === dateRange.to.getFullYear();\n\n    const isSameMonth = isSameYear && dateRange.from.getMonth() === dateRange.to.getMonth();\n\n    if (isSameMonth) {\n        return `${format(dateRange.from, 'MMM d')}\\u2013${format(dateRange.to, 'd, yyyy')}`;\n    }\n\n    if (isSameYear) {\n        return `${format(dateRange.from, 'MMM d')}\\u2013${format(dateRange.to, 'MMM d, yyyy')}`;\n    }\n\n    return `${format(dateRange.from, 'MMM d, yyyy')}\\u2013${format(dateRange.to, 'MMM d, yyyy')}`;\n};\n\nexport const getDateDisplayString = (selected?: DatePickerDateRange | DatePickerDate): string | undefined => {\n    if (isDateRange(selected)) {\n        return getDateRangeDisplayString(selected);\n    }\n    return getSingleDateDisplayString(selected);\n};\n"],"names":["isDateRange","selected","getSingleDateDisplayString","singleDate","transformDatePickerDateToDate","format","getDateRangeDisplayString","dateRange","transformDateRangeToPickerDateRange","isSameYear","getDateDisplayString"],"mappings":";;AAQA,MAAMA,IAAc,CAACC,MACV,GAAQA,KAAY,UAAUA,KAAY,QAAQA,IAGvDC,IAA6B,CAACD,MAAkD;AAClF,QAAME,IAAaC,EAA8BH,CAAQ;AACzD,MAAKE;AAGL,WAAOE,EAAOF,GAAY,cAAc;AAC5C,GAEMG,IAA4B,CAACL,MAAuD;AACtF,QAAMM,IAAYC,EAAoCP,CAAQ;AAC9D,MAAI,EAACM,KAAA,QAAAA,EAAW,SAAQ,EAACA,KAAA,QAAAA,EAAW;AAChC;AAGJ,QAAME,IAAaF,EAAU,KAAK,kBAAkBA,EAAU,GAAG,YAAA;AAIjE,SAFoBE,KAAcF,EAAU,KAAK,eAAeA,EAAU,GAAG,SAAA,IAGlE,GAAGF,EAAOE,EAAU,MAAM,OAAO,CAAC,IAASF,EAAOE,EAAU,IAAI,SAAS,CAAC,KAGjFE,IACO,GAAGJ,EAAOE,EAAU,MAAM,OAAO,CAAC,IAASF,EAAOE,EAAU,IAAI,aAAa,CAAC,KAGlF,GAAGF,EAAOE,EAAU,MAAM,aAAa,CAAC,IAASF,EAAOE,EAAU,IAAI,aAAa,CAAC;AAC/F,GAEaG,IAAuB,CAACT,MAC7BD,EAAYC,CAAQ,IACbK,EAA0BL,CAAQ,IAEtCC,EAA2BD,CAAQ;"}

package/dist/fondue-components116.js

@@ -1,114 +1,18 @@
-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-components39.js";
-import e from "./fondue-components134.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 t = "_root_v3an7_5", a = "_caret_v3an7_44", o = "_dateName_v3an7_59", n = "_button_v3an7_80", c = "_actions_v3an7_93", _ = "_clearIcon_v3an7_101", e = {
+  root: t,
+  caret: a,
+  dateName: o,
+  button: n,
+  actions: c,
+  clearIcon: _
+};
 export {
-  N as DatePickerCalendar
+  c as actions,
+  n as button,
+  a as caret,
+  _ as clearIcon,
+  o as dateName,
+  e as default,
+  t as root
 };
 //# sourceMappingURL=fondue-components116.js.map

package/dist/fondue-components116.js.map

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

package/dist/fondue-components117.js

@@ -1,16 +1,114 @@
-import { useState as o, useMemo as D } from "react";
-import { transformDateRangeToPickerDateRange as c, transformPickerDateRangeToDateRange as i } from "./fondue-components132.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));
+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-components39.js";
+import e from "./fondue-components130.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 })
+    }
+  ) })
+});
 export {
-  l as useDateRange
+  N as DatePickerCalendar
 };
 //# sourceMappingURL=fondue-components117.js.map