@caspeco/casper-ui-library 8.4.0 → 9.0.0-alpha.0

package/dist/components/date-picker/date-cell-recipe.js

@@ -0,0 +1,180 @@
+import { ThemeColorToken as e, ThemeSpaceToken as o, ThemeRadiusToken as n, ThemeFontToken as c, ThemeFontSizeToken as r } from "../../theme/theme-tokens.js";
+import { defineRecipe as t } from "@chakra-ui/react";
+const i = t({
+  base: {
+    display: "flex",
+    justifyContent: "center",
+    alignItems: "center",
+    flexDirection: "row",
+    padding: "12px 8px",
+    minWidth: "32px",
+    height: "unset",
+    borderRadius: n.Small,
+    fontSize: r.Medium,
+    fontFamily: c.Body,
+    fontWeight: "normal",
+    color: e.OnSurface,
+    position: "relative",
+    border: "2px solid transparent",
+    zIndex: 1,
+    marginLeft: o.XSmall,
+    marginRight: o.XSmall,
+    transitionProperty: "none",
+    "& span": {
+      position: "absolute",
+      display: "flex",
+      alignItems: "center",
+      justifyContent: "center",
+      top: "50%",
+      left: "50%",
+      width: "24px",
+      height: "1px",
+      transform: "translate(-50%,-50%)rotate(-45deg)",
+      background: e.OnSurface
+    },
+    _hover: {
+      background: e.AccentHoverAlpha
+    },
+    _active: {
+      color: e.OnBackground,
+      background: e.AccentActiveAlpha
+    },
+    _focus: {
+      background: e.AccentContainer,
+      border: "2px solid",
+      borderColor: e.Info,
+      outline: "none"
+    },
+    _disabled: {
+      cursor: "not-allowed",
+      opacity: 0.48
+    }
+  },
+  variants: {
+    variant: {
+      normal: {
+        _disabled: {
+          _hover: {
+            background: "none"
+          }
+        }
+      },
+      outSideMonth: {
+        color: e.OnBackgroundSubdued,
+        _disabled: {
+          background: "none"
+        }
+      },
+      isSelectedRangeDay: {
+        background: e.AccentContainer,
+        color: e.OnSurface,
+        marginRight: o.None,
+        marginLeft: o.None,
+        borderRadius: "none",
+        _disabled: {
+          background: e.AccentContainer,
+          color: e.OnSurface
+        },
+        _hover: {
+          border: `solid 1px ${e.Accent}`,
+          background: e.AccentHover,
+          color: e.OnAccent
+        }
+      },
+      currentDay: {
+        color: e.Accent,
+        _disabled: {
+          color: e.Accent,
+          _active: {
+            border: "none"
+          }
+        },
+        "& span": {
+          background: e.Accent
+        },
+        _hover: {
+          color: e.AccentHover,
+          _disabled: {
+            background: "none"
+          }
+        },
+        _active: {
+          color: e.AccentActive,
+          borderColor: e.AccentActive
+        }
+      },
+      selectedDay: {
+        background: e.Accent,
+        color: e.OnAccent,
+        "& span": {
+          background: e.OnAccent
+        },
+        _hover: {
+          background: e.AccentHover,
+          _disabled: {
+            background: e.Accent
+          }
+        },
+        _active: {
+          color: e.OnAccent,
+          background: e.AccentActive
+        },
+        _focus: {
+          background: e.Accent,
+          borderColor: e.Info
+        }
+      },
+      startDateRange: {
+        background: e.Accent,
+        color: e.OnAccent,
+        borderTopRightRadius: n.None,
+        borderBottomRightRadius: n.None,
+        marginRight: o.None,
+        "& span": {
+          background: e.OnAccent
+        },
+        _hover: {
+          background: e.AccentHover,
+          _disabled: {
+            background: e.Accent
+          }
+        },
+        _active: {
+          color: e.OnAccent,
+          background: e.AccentActive
+        },
+        _focus: {
+          background: e.Accent,
+          borderColor: e.Info
+        }
+      },
+      endDateRange: {
+        background: e.Accent,
+        color: e.OnAccent,
+        borderTopLeftRadius: n.None,
+        borderBottomLeftRadius: n.None,
+        marginLeft: o.None,
+        "& span": {
+          background: e.OnAccent
+        },
+        _hover: {
+          background: e.AccentHover,
+          _disabled: {
+            background: e.Accent
+          }
+        },
+        _active: {
+          color: e.OnAccent,
+          background: e.AccentActive
+        },
+        _focus: {
+          background: e.Accent,
+          borderColor: e.Info
+        }
+      }
+    }
+  }
+});
+export {
+  i as dateCellRecipe
+};

package/dist/components/date-picker/date-picker-date-cell.d.ts

@@ -1,4 +1,4 @@
-type Variant = "normal" | "selectedDay" | "currentDay" | "redDay" | "outSideMonth" | "isSelectedRangeDay" | "startDateRange" | "endDateRange";
+type Variant = "normal" | "selectedDay" | "currentDay" | "outSideMonth" | "isSelectedRangeDay" | "startDateRange" | "endDateRange";
 type DatePickerHeaderProps = {
     gridIndex: number;
     day: Date;

package/dist/components/date-picker/date-picker-date-cell.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"date-picker-date-cell.d.ts","sourceRoot":"","sources":["../../../lib/components/date-picker/date-picker-date-cell.tsx"],"names":[],"mappings":"AAIA,KAAK,OAAO,GACT,QAAQ,GACR,aAAa,GACb,YAAY,GACZ,QAAQ,GACR,cAAc,GACd,oBAAoB,GACpB,gBAAgB,GAChB,cAAc,CAAC;AAElB,KAAK,qBAAqB,GAAG;IAC5B,SAAS,EAAE,MAAM,CAAC;IAClB,GAAG,EAAE,IAAI,CAAC;IACV,gBAAgB,EAAE,CAAC,GAAG,EAAE,IAAI,KAAK,IAAI,CAAC;IACtC,OAAO,EAAE,OAAO,CAAC;IACjB,UAAU,EAAE,OAAO,CAAC;IACpB,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B,UAAU,EAAE,OAAO,CAAC;IACpB,YAAY,EAAE,OAAO,CAAC;IACtB,WAAW,EAAE,OAAO,CAAC;IACrB,UAAU,EAAE,OAAO,CAAC;IACpB,SAAS,EAAE,OAAO,CAAC;IACnB,UAAU,EAAE,MAAM,CAAC;IACnB,OAAO,EAAE,MAAM,CAAC;IAChB,UAAU,EAAE,OAAO,CAAC;IACpB,SAAS,EAAE,OAAO,CAAC;CACnB,CAAC;AAEF,eAAO,MAAM,kBAAkB,GAAI,uLAgBhC,qBAAqB,4CAuGvB,CAAC"}
+{"version":3,"file":"date-picker-date-cell.d.ts","sourceRoot":"","sources":["../../../lib/components/date-picker/date-picker-date-cell.tsx"],"names":[],"mappings":"AAKA,KAAK,OAAO,GACT,QAAQ,GACR,aAAa,GACb,YAAY,GACZ,cAAc,GACd,oBAAoB,GACpB,gBAAgB,GAChB,cAAc,CAAC;AAElB,KAAK,qBAAqB,GAAG;IAC5B,SAAS,EAAE,MAAM,CAAC;IAClB,GAAG,EAAE,IAAI,CAAC;IACV,gBAAgB,EAAE,CAAC,GAAG,EAAE,IAAI,KAAK,IAAI,CAAC;IACtC,OAAO,EAAE,OAAO,CAAC;IACjB,UAAU,EAAE,OAAO,CAAC;IACpB,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B,UAAU,EAAE,OAAO,CAAC;IACpB,YAAY,EAAE,OAAO,CAAC;IACtB,WAAW,EAAE,OAAO,CAAC;IACrB,UAAU,EAAE,OAAO,CAAC;IACpB,SAAS,EAAE,OAAO,CAAC;IACnB,UAAU,EAAE,MAAM,CAAC;IACnB,OAAO,EAAE,MAAM,CAAC;IAChB,UAAU,EAAE,OAAO,CAAC;IACpB,SAAS,EAAE,OAAO,CAAC;CACnB,CAAC;AAEF,eAAO,MAAM,kBAAkB,GAAI,uLAgBhC,qBAAqB,4CAoGvB,CAAC"}

package/dist/components/date-picker/date-picker-date-cell.js

@@ -1,74 +1,74 @@
-import { jsx as e, Fragment as W, jsxs as p } from "react/jsx-runtime";
-import { useStyleConfig as m, Button as O, Box as t, Stack as V } from "@chakra-ui/react";
-import { formatDate as j } from "../../node_modules/date-fns/format.js";
-import { isToday as x } from "../../node_modules/date-fns/isToday.js";
-import { ThemeColorVariable as r, ThemeSpaceVariable as u } from "../../theme/theme-types.js";
-const N = ({
-  gridColumn: b,
-  gridRow: f,
-  gridIndex: g,
-  day: n,
-  handleDateChange: h,
+import { jsx as e, Fragment as W, jsxs as m } from "react/jsx-runtime";
+import { ThemeRadiusToken as p } from "../../theme/theme-tokens.js";
+import { useRecipe as j, Button as E, Box as t, Stack as M } from "@chakra-ui/react";
+import { format as O } from "../../node_modules/date-fns/format.js";
+import { isToday as u } from "../../node_modules/date-fns/isToday.js";
+import { ThemeColorVariable as r, ThemeSpaceVariable as b } from "../../theme/theme-types.js";
+const z = ({
+  gridColumn: h,
+  gridRow: g,
+  gridIndex: f,
+  day: i,
+  handleDateChange: k,
   variant: o,
-  isDisabled: d,
-  isStrikeThrough: s,
+  isDisabled: x,
+  isStrikeThrough: d,
   hasBlueDot: C,
-  hasYellowDot: k,
+  hasYellowDot: R,
   hasGreenDot: D,
   hasGreyDot: y,
   hasRedDot: S,
   selectWeek: a,
-  isHoliday: i
+  isHoliday: l
 }) => {
-  const R = m("DateCell", { variant: o }), B = m("DateCellWeek", { variant: o }), c = (o === "selectedDay" || o === "startDateRange" || o === "endDateRange") && !a, l = {
+  const T = j({ key: a ? "dateCellWeek" : "dateCell" })({ variant: o }), n = x || d, c = (o === "selectedDay" || o === "startDateRange" || o === "endDateRange") && !a, B = f % 7 === 6, w = a && o === "selectedDay" && B ? {
+    borderTopRightRadius: p.Medium,
+    borderBottomRightRadius: p.Medium
+  } : {}, s = {
     borderRadius: "50%",
     border: c ? "solid 1.5px white" : "",
     width: c ? "7.5px" : "6px",
     height: c ? "7.5px" : "6px"
-  }, w = g % 7 === 6;
-  return /* @__PURE__ */ e(W, { children: /* @__PURE__ */ p(
-    O,
+  }, V = () => {
+    n || k(i);
+  };
+  return /* @__PURE__ */ e(W, { children: /* @__PURE__ */ m(
+    E,
     {
-      __css: a ? B : R,
+      css: { ...T, ...w },
       type: "button",
-      sx: a && o === "selectedDay" && w ? {
-        borderTopRightRadius: "10px",
-        borderBottomRightRadius: "10px"
-      } : {},
-      variant: o,
-      isDisabled: d || s,
-      onClick: () => {
-        !d && !s && h(n);
-      },
-      gridColumn: b,
-      gridRow: f,
+      disabled: n,
+      onClick: V,
+      gridColumn: h,
+      gridRow: g,
       display: "flex",
       "data-testid": "date-picker-date-cell",
+      "data-variant": o,
       children: [
         /* @__PURE__ */ e(
           t,
           {
-            "data-testid": i ? "holiday" : void 0,
-            sx: { color: i ? r.Error : "inherit" },
-            fontWeight: x(n) ? "bold" : "normal",
-            textDecoration: x(n) ? "underline" : "none",
-            children: j(n, "d")
+            "data-testid": l ? "holiday" : void 0,
+            css: { lineHeight: "1.5", color: l ? r.Error : "inherit" },
+            fontWeight: u(i) ? "bold" : "normal",
+            textDecoration: u(i) ? "underline" : "none",
+            children: O(i, "d")
           }
         ),
-        s && /* @__PURE__ */ e("span", {}),
-        /* @__PURE__ */ p(
-          V,
+        d && /* @__PURE__ */ e("span", {}),
+        /* @__PURE__ */ m(
+          M,
           {
             position: "absolute",
-            bottom: u.XSmall,
+            bottom: b.XSmall,
             direction: "row",
-            spacing: u.XSmall,
+            gap: b.XSmall,
             children: [
               C && /* @__PURE__ */ e(
                 t,
                 {
-                  sx: {
-                    ...l,
+                  css: {
+                    ...s,
                     backgroundColor: r.Info
                   }
                 }
@@ -76,17 +76,17 @@ const N = ({
               D && /* @__PURE__ */ e(
                 t,
                 {
-                  sx: {
-                    ...l,
+                  css: {
+                    ...s,
                     backgroundColor: r.Success
                   }
                 }
               ),
-              k && /* @__PURE__ */ e(
+              R && /* @__PURE__ */ e(
                 t,
                 {
-                  sx: {
-                    ...l,
+                  css: {
+                    ...s,
                     backgroundColor: r.Warning
                   }
                 }
@@ -94,8 +94,8 @@ const N = ({
               y && /* @__PURE__ */ e(
                 t,
                 {
-                  sx: {
-                    ...l,
+                  css: {
+                    ...s,
                     backgroundColor: r.Neutral
                   }
                 }
@@ -103,8 +103,8 @@ const N = ({
               S && /* @__PURE__ */ e(
                 t,
                 {
-                  sx: {
-                    ...l,
+                  css: {
+                    ...s,
                     backgroundColor: r.Error
                   }
                 }
@@ -117,5 +117,5 @@ const N = ({
   ) });
 };
 export {
-  N as DatePickerDateCell
+  z as DatePickerDateCell
 };

package/dist/components/date-picker/date-picker-header.js

@@ -1,132 +1,133 @@
-import { jsxs as u, jsx as s } from "react/jsx-runtime";
-import { Flex as p, Text as N } from "@chakra-ui/react";
+import { jsxs as u, jsx as n } from "react/jsx-runtime";
+import { Flex as p, Text as K } from "@chakra-ui/react";
 import { firstLetterUpperCase as T } from "./helper.js";
 import { startOfMonth as d } from "../../node_modules/date-fns/startOfMonth.js";
-import { isBefore as Q } from "../../node_modules/date-fns/isBefore.js";
-import { isSameMonth as X } from "../../node_modules/date-fns/isSameMonth.js";
-import { startOfDay as Z } from "../../node_modules/date-fns/startOfDay.js";
-import { Button as _ } from "../button/button.js";
+import { isBefore as N } from "../../node_modules/date-fns/isBefore.js";
+import { isSameMonth as Q } from "../../node_modules/date-fns/isSameMonth.js";
+import { startOfDay as X } from "../../node_modules/date-fns/startOfDay.js";
+import { Button as Z } from "../button/button.js";
 import { IconButton as x } from "../icon-button/icon-button.js";
-import { Icons as B } from "../icon/types.js";
-import { getISOWeek as E } from "../../node_modules/date-fns/getISOWeek.js";
-import { enGB as D } from "../../node_modules/date-fns/locale/en-GB.js";
-import { enUS as k } from "../../node_modules/date-fns/locale/en-US.js";
-import { nlBE as F } from "../../node_modules/date-fns/locale/nl-BE.js";
-import { fr as P } from "../../node_modules/date-fns/locale/fr.js";
-import { sv as V } from "../../node_modules/date-fns/locale/sv.js";
-import { da as v } from "../../node_modules/date-fns/locale/da.js";
-import { nb as j } from "../../node_modules/date-fns/locale/nb.js";
-import { subMonths as R } from "../../node_modules/date-fns/subMonths.js";
-import { subWeeks as rr } from "../../node_modules/date-fns/subWeeks.js";
-import { subDays as l } from "../../node_modules/date-fns/subDays.js";
-import { addMonths as tr } from "../../node_modules/date-fns/addMonths.js";
-import { addWeeks as or } from "../../node_modules/date-fns/addWeeks.js";
+import { getISOWeek as _ } from "../../node_modules/date-fns/getISOWeek.js";
+import { enGB as k } from "../../node_modules/date-fns/locale/en-GB.js";
+import { enUS as l } from "../../node_modules/date-fns/locale/en-US.js";
+import { nlBE as B } from "../../node_modules/date-fns/locale/nl-BE.js";
+import { fr as F } from "../../node_modules/date-fns/locale/fr.js";
+import { sv as P } from "../../node_modules/date-fns/locale/sv.js";
+import { da as V } from "../../node_modules/date-fns/locale/da.js";
+import { nb as v } from "../../node_modules/date-fns/locale/nb.js";
+import { subMonths as E } from "../../node_modules/date-fns/subMonths.js";
+import { subWeeks as R } from "../../node_modules/date-fns/subWeeks.js";
+import { subDays as D } from "../../node_modules/date-fns/subDays.js";
+import { addMonths as rr } from "../../node_modules/date-fns/addMonths.js";
+import { addWeeks as tr } from "../../node_modules/date-fns/addWeeks.js";
 import { addDays as b } from "../../node_modules/date-fns/addDays.js";
-import { isSameYear as er } from "../../node_modules/date-fns/isSameYear.js";
+import { isSameYear as or } from "../../node_modules/date-fns/isSameYear.js";
 import { isSameDay as ir } from "../../node_modules/date-fns/isSameDay.js";
-import { ThemeSpaceVariable as H, ThemeFontSizeVariable as ar, ThemeFontVariable as mr } from "../../theme/theme-types.js";
-import { formatDate as S } from "../../node_modules/date-fns/format.js";
-const gr = ({
+import { ThemeSpaceVariable as I, ThemeFontSizeVariable as er, ThemeFontVariable as ar } from "../../theme/theme-types.js";
+import { BackIcon as mr } from "../icon/icons/back-icon.js";
+import { ForwardIcon as nr } from "../icon/icons/forward-icon.js";
+import { format as S } from "../../node_modules/date-fns/format.js";
+const Lr = ({
   onMonthChange: h,
   selectedMonth: a,
   month: w,
   selectWeek: m,
-  locale: e,
+  locale: i,
   selectedDate: t,
-  onDateChange: i,
-  isExpanded: n,
-  disablePastMonths: I,
-  disableBackwardNavigation: U,
-  disableForwardNavigation: $,
+  onDateChange: e,
+  isExpanded: s,
+  disablePastMonths: j,
+  disableBackwardNavigation: H,
+  disableForwardNavigation: U,
   dateRange: o,
   onRangeChange: f
 }) => {
-  function g(r) {
+  function $(r) {
     switch (r) {
-      case j:
-        return "Uke";
       case v:
-        return "Uge";
+        return "Uke";
       case V:
-        return "Vecka";
+        return "Uge";
       case P:
-        return "Semaine";
+        return "Vecka";
       case F:
+        return "Semaine";
+      case B:
+      case l:
       case k:
-      case D:
       default:
         return "Week";
     }
   }
-  function z(r) {
+  function g(r) {
     switch (r) {
-      case j:
       case v:
       case V:
-        return "I dag";
       case P:
-        return "Aujourd'hui";
+        return "I dag";
       case F:
+        return "Aujourd'hui";
+      case B:
         return "Vandaag";
+      case l:
       case k:
-      case D:
       default:
         return "Today";
     }
   }
-  function L(r) {
+  function z(r) {
     return !!r?.startDate && !!r?.endDate;
   }
-  const c = !m && L(o) && f;
-  function O(r) {
-    return er(r.startDate, r.endDate) ? e === D || e === k ? "MMM d" : "d MMM" : "PP";
+  const c = !m && z(o) && f;
+  function L(r) {
+    return or(r.startDate, r.endDate) ? i === k || i === l ? "MMM d" : "d MMM" : "PP";
   }
-  const W = () => {
-    if (n)
+  const O = () => {
+    if (s)
       return T(w);
     if (m)
-      return `${g(e)} ${E(t)}`;
+      return `${$(i)} ${_(t)}`;
     if (c) {
-      const r = O(o), J = S(o.startDate, r, { locale: e }), K = S(o.endDate, r, { locale: e });
-      return `${J} - ${K}`.replace(/\./g, "");
+      const r = L(o), q = S(o.startDate, r, { locale: i }), J = S(o.endDate, r, { locale: i });
+      return `${q} - ${J}`.replace(/\./g, "");
     }
-    return t ? S(t, "dd MMMM", { locale: e }) : T(w);
+    return t ? S(t, "dd MMMM", { locale: i }) : T(w);
+  }, W = () => {
+    s ? h(E(d(a))) : m ? e(R(t)) : c ? f({
+      startDate: D(o.startDate),
+      endDate: D(o.endDate)
+    }) : e(D(t));
   }, A = () => {
-    n ? h(R(d(a))) : m ? i(rr(t)) : c ? f({
-      startDate: l(o.startDate),
-      endDate: l(o.endDate)
-    }) : i(l(t));
-  }, C = () => {
-    n ? h(tr(d(a), 1)) : m ? i(or(t, 1)) : c ? f({
+    s ? h(rr(d(a), 1)) : m ? e(tr(t, 1)) : c ? f({
       startDate: b(o.startDate, 1),
       endDate: b(o.endDate, 1)
-    }) : i(b(t, 1));
-  }, y = d(/* @__PURE__ */ new Date()), G = U || I && (Q(a, y) || X(a, y)), M = Z(/* @__PURE__ */ new Date()), Y = !ir(t, M), q = () => {
-    i(M);
+    }) : e(b(t, 1));
+  }, y = d(/* @__PURE__ */ new Date()), C = H || j && (N(a, y) || Q(a, y)), M = X(/* @__PURE__ */ new Date()), G = !ir(t, M), Y = () => {
+    e(M);
   };
-  return /* @__PURE__ */ u(p, { justify: "space-between", align: "center", mb: H.Small, children: [
-    /* @__PURE__ */ s(N, { fontWeight: "500", fontFamily: mr.SubHeader, fontSize: ar.Large, children: W() }),
-    /* @__PURE__ */ u(p, { align: "center", gap: H.Small, children: [
-      Y && /* @__PURE__ */ s(_, { variant: "ghost", size: "sm", onClick: q, children: z(e) }),
+  return /* @__PURE__ */ u(p, { justify: "space-between", align: "center", mb: I.Small, children: [
+    /* @__PURE__ */ n(K, { fontWeight: "500", fontFamily: ar.SubHeader, fontSize: er.Large, children: O() }),
+    /* @__PURE__ */ u(p, { align: "center", gap: I.Small, children: [
+      G && /* @__PURE__ */ n(Z, { variant: "ghost", size: "sm", onClick: Y, children: g(i) }),
       /* @__PURE__ */ u(p, { align: "center", children: [
-        /* @__PURE__ */ s(
+        /* @__PURE__ */ n(
           x,
           {
-            icon: B.Back,
+            icon: mr,
             "aria-label": "Back",
             variant: "ghost",
-            onClick: A,
-            isDisabled: G
+            onClick: W,
+            isDisabled: C
           }
         ),
-        /* @__PURE__ */ s(
+        /* @__PURE__ */ n(
           x,
           {
-            icon: B.Forward,
+            icon: nr,
             "aria-label": "Forward",
             variant: "ghost",
-            onClick: C,
-            isDisabled: $
+            onClick: A,
+            isDisabled: U
           }
         )
       ] })
@@ -134,5 +135,5 @@ const gr = ({
   ] });
 };
 export {
-  gr as DatePickerHeader
+  Lr as DatePickerHeader
 };

package/dist/components/date-picker/date-picker-week-cell.d.ts

@@ -1,4 +1,4 @@
-type Variant = "normal" | "selectedDay" | "currentDay" | "redDay" | "outSideMonth";
+type Variant = "normal" | "selectedDay" | "currentDay" | "outSideMonth";
 type DatePickerWeekCellProps = {
     gridIndex: number;
     variant: Variant;

package/dist/components/date-picker/date-picker-week-cell.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"date-picker-week-cell.d.ts","sourceRoot":"","sources":["../../../lib/components/date-picker/date-picker-week-cell.tsx"],"names":[],"mappings":"AAIA,KAAK,OAAO,GAAG,QAAQ,GAAG,aAAa,GAAG,YAAY,GAAG,QAAQ,GAAG,cAAc,CAAC;AACnF,KAAK,uBAAuB,GAAG;IAC9B,SAAS,EAAE,MAAM,CAAC;IAClB,OAAO,EAAE,OAAO,CAAC;IACjB,IAAI,EAAE,IAAI,CAAC;IACX,gBAAgB,EAAE,CAAC,IAAI,EAAE,IAAI,KAAK,IAAI,CAAC;IACvC,UAAU,EAAE,OAAO,CAAC;IACpB,UAAU,EAAE,OAAO,CAAC;CACpB,CAAC;AAEF,eAAO,MAAM,kBAAkB,GAAI,yEAOhC,uBAAuB,4CA6BzB,CAAC"}
+{"version":3,"file":"date-picker-week-cell.d.ts","sourceRoot":"","sources":["../../../lib/components/date-picker/date-picker-week-cell.tsx"],"names":[],"mappings":"AAIA,KAAK,OAAO,GAAG,QAAQ,GAAG,aAAa,GAAG,YAAY,GAAG,cAAc,CAAC;AAExE,KAAK,uBAAuB,GAAG;IAC9B,SAAS,EAAE,MAAM,CAAC;IAClB,OAAO,EAAE,OAAO,CAAC;IACjB,IAAI,EAAE,IAAI,CAAC;IACX,gBAAgB,EAAE,CAAC,IAAI,EAAE,IAAI,KAAK,IAAI,CAAC;IACvC,UAAU,EAAE,OAAO,CAAC;IACpB,UAAU,EAAE,OAAO,CAAC;CACpB,CAAC;AAEF,eAAO,MAAM,kBAAkB,GAAI,yEAOhC,uBAAuB,4CA2BzB,CAAC"}

package/dist/components/date-picker/date-picker-week-cell.js

@@ -1,39 +1,39 @@
-import { jsx as r, Fragment as b } from "react/jsx-runtime";
-import { useStyleConfig as f, Button as g } from "@chakra-ui/react";
-import { getISOWeek as t } from "../../node_modules/date-fns/getISOWeek.js";
-import { ThemeSpaceVariable as i, ThemeRadiusVariable as l, ThemeColorVariable as m } from "../../theme/theme-types.js";
-const k = ({
-  gridIndex: s,
-  handleWeekChange: d,
-  variant: e,
-  date: o,
-  selectWeek: n,
-  isDisabled: a
+import { jsx as u } from "react/jsx-runtime";
+import { useRecipe as p, Button as b } from "@chakra-ui/react";
+import { ThemeSpaceVariable as r, ThemeRadiusVariable as t, ThemeColorVariable as i } from "../../theme/theme-types.js";
+import { getISOWeek as d } from "../../node_modules/date-fns/getISOWeek.js";
+const C = ({
+  gridIndex: l,
+  handleWeekChange: m,
+  variant: o,
+  date: e,
+  selectWeek: c,
+  isDisabled: n
 }) => {
-  const u = f("DateCell", { variant: e }), c = Math.floor(s / 7) + 1;
-  return /* @__PURE__ */ r(b, { children: /* @__PURE__ */ r(
-    g,
+  const s = p({ key: "dateCell" })({ variant: o }), a = Math.floor(l / 7) + 1;
+  return /* @__PURE__ */ u(
+    b,
     {
-      sx: {
-        color: e === "selectedDay" ? m.OnAccent : m.OnSurfaceSubdued,
-        marginRight: i.None
+      css: {
+        ...s,
+        color: o === "selectedDay" ? i.OnAccent : i.OnSurfaceSubdued,
+        marginRight: r.None,
+        lineHeight: "1.15"
       },
       borderRightRadius: 0,
-      borderTopLeftRadius: l.Medium,
-      borderBottomLeftRadius: l.Medium,
-      __css: u,
+      borderTopLeftRadius: t.Medium,
+      borderBottomLeftRadius: t.Medium,
       type: "button",
-      variant: e,
-      onClick: () => d(o),
+      onClick: () => m(e),
       gridColumn: 1,
-      gridRow: c,
-      "data-testid": `week-number-${t(o)}`,
-      isDisabled: !n || a,
-      ml: i.None,
-      children: t(o)
+      gridRow: a,
+      "data-testid": `week-number-${d(e)}`,
+      disabled: !c || n,
+      ml: r.None,
+      children: d(e)
     }
-  ) });
+  );
 };
 export {
-  k as DatePickerWeekCell
+  C as DatePickerWeekCell
 };