@smwb/ui-react 2.0.0

package/dist/components/inputs/datePicker/dataPickerInput.js

@@ -0,0 +1,37 @@
+import { jsx as o } from "react/jsx-runtime";
+import u from "react";
+import { DatePickerIconButton as g } from "./datePickerIconButton.js";
+import { useDateInput as k } from "./useDateInput.js";
+import { Icon as I } from "../../base/icon/icon.js";
+import { TextField as P } from "../textField/textField.js";
+function b(e) {
+  e.stopPropagation();
+}
+const y = u.forwardRef(function(n, a) {
+  const { value: r, onChange: i, onBlur: d, onToggle: c, disabled: t, disableCalendar: l, calendarIcon: p, format: s, ...m } = n, f = k({ value: r, onChange: i, onBlur: d, format: s });
+  return /* @__PURE__ */ o(
+    P,
+    {
+      ref: a,
+      ...f,
+      type: "tel",
+      endAdornment: !l && /* @__PURE__ */ o(
+        g,
+        {
+          edge: "end",
+          onClick: c,
+          onMouseDown: b,
+          disabled: !!t,
+          "data-testid": "date-picker-icon-button",
+          children: p || /* @__PURE__ */ o(I, { name: "calendar_today", fill: 1, weight: 500, size: 24 })
+        }
+      ),
+      disabled: !!t,
+      ...m
+    }
+  );
+});
+export {
+  y as DataPickerInput
+};
+//# sourceMappingURL=dataPickerInput.js.map

package/dist/components/inputs/datePicker/dataPickerInput.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"dataPickerInput.js","sources":["../../../../src/components/inputs/datePicker/dataPickerInput.tsx"],"sourcesContent":["import React from \"react\";\nimport { TextField } from \"../textField\";\nimport { DatePickerIconButton } from \"./datePickerIconButton\";\nimport { useDateInput } from \"./useDateInput\";\nimport { DatePickerProps } from \"./datePicker\";\nimport Icon from \"../../base/icon/icon\";\n\nexport interface DataPickerInputProps extends Omit<\n  DatePickerProps,\n  \"locale\" | \"showDaysOutsideMonth\" | \"disablePast\" | \"disableFuture\" | \"weekStartsOn\" | \"placement\"\n> {\n  onToggle: () => void;\n}\n\nfunction stopPropagation(event: React.SyntheticEvent) {\n  event.stopPropagation();\n}\n\nexport const DataPickerInput = React.forwardRef(function DataPickerInput(\n  props: DataPickerInputProps,\n  ref: React.Ref<HTMLInputElement>\n) {\n  const { value, onChange, onBlur, onToggle, disabled, disableCalendar, calendarIcon, format, ...rest } = props;\n  const maskedProps = useDateInput({ value, onChange, onBlur, format });\n\n  return (\n    <TextField\n      ref={ref}\n      {...maskedProps}\n      type=\"tel\"\n      endAdornment={\n        !disableCalendar && (\n          <DatePickerIconButton\n            edge=\"end\"\n            onClick={onToggle}\n            onMouseDown={stopPropagation}\n            disabled={Boolean(disabled)}\n            data-testid=\"date-picker-icon-button\"\n          >\n            {calendarIcon || <Icon name=\"calendar_today\" fill={1} weight={500} size={24} />}\n          </DatePickerIconButton>\n        )\n      }\n      disabled={Boolean(disabled)}\n      {...rest}\n    />\n  );\n});\n"],"names":["stopPropagation","event","DataPickerInput","React","props","ref","value","onChange","onBlur","onToggle","disabled","disableCalendar","calendarIcon","format","rest","maskedProps","useDateInput","jsx","TextField","DatePickerIconButton","Icon"],"mappings":";;;;;;AAcA,SAASA,EAAgBC,GAA6B;AACpD,EAAAA,EAAM,gBAAA;AACR;AAEO,MAAMC,IAAkBC,EAAM,WAAW,SAC9CC,GACAC,GACA;AACA,QAAM,EAAE,OAAAC,GAAO,UAAAC,GAAU,QAAAC,GAAQ,UAAAC,GAAU,UAAAC,GAAU,iBAAAC,GAAiB,cAAAC,GAAc,QAAAC,GAAQ,GAAGC,EAAA,IAASV,GAClGW,IAAcC,EAAa,EAAE,OAAAV,GAAO,UAAAC,GAAU,QAAAC,GAAQ,QAAAK,GAAQ;AAEpE,SACE,gBAAAI;AAAA,IAACC;AAAA,IAAA;AAAA,MACC,KAAAb;AAAA,MACC,GAAGU;AAAA,MACJ,MAAK;AAAA,MACL,cACE,CAACJ,KACC,gBAAAM;AAAA,QAACE;AAAA,QAAA;AAAA,UACC,MAAK;AAAA,UACL,SAASV;AAAA,UACT,aAAaT;AAAA,UACb,UAAU,EAAQU;AAAA,UAClB,eAAY;AAAA,UAEX,UAAAE,KAAgB,gBAAAK,EAACG,GAAA,EAAK,MAAK,kBAAiB,MAAM,GAAG,QAAQ,KAAK,MAAM,GAAA,CAAI;AAAA,QAAA;AAAA,MAAA;AAAA,MAInF,UAAU,EAAQV;AAAA,MACjB,GAAGI;AAAA,IAAA;AAAA,EAAA;AAGV,CAAC;"}

package/dist/components/inputs/datePicker/dateFormat.d.ts

@@ -0,0 +1,3 @@
+export declare function formatDateByPattern(date: Date, pattern: string): string;
+export declare function parseDateByPattern(value: string, pattern: string): Date | undefined;
+export declare function isDatePatternMatch(value: string, pattern: string): boolean;

package/dist/components/inputs/datePicker/dateFormat.js

@@ -0,0 +1,58 @@
+const c = /yyyy|MM|dd/g;
+function y(t) {
+  const e = [];
+  let n;
+  for (c.lastIndex = 0; (n = c.exec(t)) !== null; )
+    e.push(n[0]);
+  return e;
+}
+function s(t) {
+  return t.replace(/[.*+?^${}()|[\]\\]/g, "\\$&");
+}
+function f(t) {
+  let e = "^", n = 0, r;
+  for (c.lastIndex = 0; (r = c.exec(t)) !== null; )
+    e += s(t.slice(n, r.index)), e += r[0] === "yyyy" ? "(\\d{4})" : "(\\d{2})", n = c.lastIndex;
+  return e += s(t.slice(n)), e += "$", new RegExp(e);
+}
+function g(t, e, n) {
+  if (e < 1 || e > 12 || n < 1)
+    return !1;
+  const r = new Date(t, e - 1, n);
+  return r.getFullYear() === t && r.getMonth() === e - 1 && r.getDate() === n;
+}
+function p(t, e) {
+  const n = t.getFullYear(), r = t.getMonth() + 1, a = t.getDate();
+  return e.replace(c, (i) => i === "yyyy" ? String(n).padStart(4, "0") : i === "MM" ? String(r).padStart(2, "0") : String(a).padStart(2, "0"));
+}
+function x(t, e) {
+  const n = y(e);
+  if (n.length !== 3 || !n.includes("yyyy") || !n.includes("MM") || !n.includes("dd"))
+    return;
+  const r = f(e).exec(t);
+  if (!r)
+    return;
+  let a, i, u;
+  if (n.forEach((o, d) => {
+    const l = Number(r[d + 1]);
+    if (o === "yyyy") {
+      a = l;
+      return;
+    }
+    if (o === "MM") {
+      i = l;
+      return;
+    }
+    u = l;
+  }), !(a === void 0 || i === void 0 || u === void 0) && g(a, i, u))
+    return new Date(a, i - 1, u);
+}
+function M(t, e) {
+  return x(t, e) !== void 0;
+}
+export {
+  p as formatDateByPattern,
+  M as isDatePatternMatch,
+  x as parseDateByPattern
+};
+//# sourceMappingURL=dateFormat.js.map

package/dist/components/inputs/datePicker/dateFormat.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"dateFormat.js","sources":["../../../../src/components/inputs/datePicker/dateFormat.ts"],"sourcesContent":["const DATE_TOKEN_REGEXP = /yyyy|MM|dd/g;\n\ntype DateToken = \"yyyy\" | \"MM\" | \"dd\";\n\nfunction extractTokens(pattern: string): DateToken[] {\n  const tokens: DateToken[] = [];\n  let match: RegExpExecArray | null;\n\n  DATE_TOKEN_REGEXP.lastIndex = 0;\n  while ((match = DATE_TOKEN_REGEXP.exec(pattern)) !== null) {\n    tokens.push(match[0] as DateToken);\n  }\n\n  return tokens;\n}\n\nfunction escapeRegExp(value: string): string {\n  return value.replace(/[.*+?^${}()|[\\]\\\\]/g, \"\\\\$&\");\n}\n\nfunction patternToRegExp(pattern: string): RegExp {\n  let regex = \"^\";\n  let lastIndex = 0;\n  let match: RegExpExecArray | null;\n\n  DATE_TOKEN_REGEXP.lastIndex = 0;\n  while ((match = DATE_TOKEN_REGEXP.exec(pattern)) !== null) {\n    regex += escapeRegExp(pattern.slice(lastIndex, match.index));\n    regex += match[0] === \"yyyy\" ? \"(\\\\d{4})\" : \"(\\\\d{2})\";\n    lastIndex = DATE_TOKEN_REGEXP.lastIndex;\n  }\n\n  regex += escapeRegExp(pattern.slice(lastIndex));\n  regex += \"$\";\n\n  return new RegExp(regex);\n}\n\nfunction isValidCalendarDate(year: number, month: number, day: number): boolean {\n  if (month < 1 || month > 12 || day < 1) {\n    return false;\n  }\n\n  const date = new Date(year, month - 1, day);\n\n  return date.getFullYear() === year && date.getMonth() === month - 1 && date.getDate() === day;\n}\n\nexport function formatDateByPattern(date: Date, pattern: string): string {\n  const year = date.getFullYear();\n  const month = date.getMonth() + 1;\n  const day = date.getDate();\n\n  return pattern.replace(DATE_TOKEN_REGEXP, (token) => {\n    if (token === \"yyyy\") {\n      return String(year).padStart(4, \"0\");\n    }\n\n    if (token === \"MM\") {\n      return String(month).padStart(2, \"0\");\n    }\n\n    return String(day).padStart(2, \"0\");\n  });\n}\n\nexport function parseDateByPattern(value: string, pattern: string): Date | undefined {\n  const tokens = extractTokens(pattern);\n\n  if (tokens.length !== 3 || !tokens.includes(\"yyyy\") || !tokens.includes(\"MM\") || !tokens.includes(\"dd\")) {\n    return undefined;\n  }\n\n  const match = patternToRegExp(pattern).exec(value);\n\n  if (!match) {\n    return undefined;\n  }\n\n  let year: number | undefined;\n  let month: number | undefined;\n  let day: number | undefined;\n\n  tokens.forEach((token, index) => {\n    const part = Number(match[index + 1]);\n\n    if (token === \"yyyy\") {\n      year = part;\n      return;\n    }\n\n    if (token === \"MM\") {\n      month = part;\n      return;\n    }\n\n    day = part;\n  });\n\n  if (year === undefined || month === undefined || day === undefined) {\n    return undefined;\n  }\n\n  if (!isValidCalendarDate(year, month, day)) {\n    return undefined;\n  }\n\n  return new Date(year, month - 1, day);\n}\n\nexport function isDatePatternMatch(value: string, pattern: string): boolean {\n  return parseDateByPattern(value, pattern) !== undefined;\n}\n"],"names":["DATE_TOKEN_REGEXP","extractTokens","pattern","tokens","match","escapeRegExp","value","patternToRegExp","regex","lastIndex","isValidCalendarDate","year","month","day","date","formatDateByPattern","token","parseDateByPattern","index","part","isDatePatternMatch"],"mappings":"AAAA,MAAMA,IAAoB;AAI1B,SAASC,EAAcC,GAA8B;AACnD,QAAMC,IAAsB,CAAA;AAC5B,MAAIC;AAGJ,OADAJ,EAAkB,YAAY,IACtBI,IAAQJ,EAAkB,KAAKE,CAAO,OAAO;AACnD,IAAAC,EAAO,KAAKC,EAAM,CAAC,CAAc;AAGnC,SAAOD;AACT;AAEA,SAASE,EAAaC,GAAuB;AAC3C,SAAOA,EAAM,QAAQ,uBAAuB,MAAM;AACpD;AAEA,SAASC,EAAgBL,GAAyB;AAChD,MAAIM,IAAQ,KACRC,IAAY,GACZL;AAGJ,OADAJ,EAAkB,YAAY,IACtBI,IAAQJ,EAAkB,KAAKE,CAAO,OAAO;AACnD,IAAAM,KAASH,EAAaH,EAAQ,MAAMO,GAAWL,EAAM,KAAK,CAAC,GAC3DI,KAASJ,EAAM,CAAC,MAAM,SAAS,aAAa,YAC5CK,IAAYT,EAAkB;AAGhC,SAAAQ,KAASH,EAAaH,EAAQ,MAAMO,CAAS,CAAC,GAC9CD,KAAS,KAEF,IAAI,OAAOA,CAAK;AACzB;AAEA,SAASE,EAAoBC,GAAcC,GAAeC,GAAsB;AAC9E,MAAID,IAAQ,KAAKA,IAAQ,MAAMC,IAAM;AACnC,WAAO;AAGT,QAAMC,IAAO,IAAI,KAAKH,GAAMC,IAAQ,GAAGC,CAAG;AAE1C,SAAOC,EAAK,kBAAkBH,KAAQG,EAAK,eAAeF,IAAQ,KAAKE,EAAK,QAAA,MAAcD;AAC5F;AAEO,SAASE,EAAoBD,GAAYZ,GAAyB;AACvE,QAAMS,IAAOG,EAAK,YAAA,GACZF,IAAQE,EAAK,SAAA,IAAa,GAC1BD,IAAMC,EAAK,QAAA;AAEjB,SAAOZ,EAAQ,QAAQF,GAAmB,CAACgB,MACrCA,MAAU,SACL,OAAOL,CAAI,EAAE,SAAS,GAAG,GAAG,IAGjCK,MAAU,OACL,OAAOJ,CAAK,EAAE,SAAS,GAAG,GAAG,IAG/B,OAAOC,CAAG,EAAE,SAAS,GAAG,GAAG,CACnC;AACH;AAEO,SAASI,EAAmBX,GAAeJ,GAAmC;AACnF,QAAMC,IAASF,EAAcC,CAAO;AAEpC,MAAIC,EAAO,WAAW,KAAK,CAACA,EAAO,SAAS,MAAM,KAAK,CAACA,EAAO,SAAS,IAAI,KAAK,CAACA,EAAO,SAAS,IAAI;AACpG;AAGF,QAAMC,IAAQG,EAAgBL,CAAO,EAAE,KAAKI,CAAK;AAEjD,MAAI,CAACF;AACH;AAGF,MAAIO,GACAC,GACAC;AAkBJ,MAhBAV,EAAO,QAAQ,CAACa,GAAOE,MAAU;AAC/B,UAAMC,IAAO,OAAOf,EAAMc,IAAQ,CAAC,CAAC;AAEpC,QAAIF,MAAU,QAAQ;AACpB,MAAAL,IAAOQ;AACP;AAAA,IACF;AAEA,QAAIH,MAAU,MAAM;AAClB,MAAAJ,IAAQO;AACR;AAAA,IACF;AAEA,IAAAN,IAAMM;AAAA,EACR,CAAC,GAEG,EAAAR,MAAS,UAAaC,MAAU,UAAaC,MAAQ,WAIpDH,EAAoBC,GAAMC,GAAOC,CAAG;AAIzC,WAAO,IAAI,KAAKF,GAAMC,IAAQ,GAAGC,CAAG;AACtC;AAEO,SAASO,EAAmBd,GAAeJ,GAA0B;AAC1E,SAAOe,EAAmBX,GAAOJ,CAAO,MAAM;AAChD;"}

package/dist/components/inputs/datePicker/datePicker.d.ts

@@ -0,0 +1,42 @@
+import React from "react";
+import { Placement } from "../../../utils/floating";
+import { TextFieldProps } from "../textField";
+export declare enum OpenView {
+    days = "days",
+    months = "months",
+    years = "years"
+}
+export interface DatePickerProps extends Omit<TextFieldProps, "onBlur" | "onChange" | "value" | "defaultValue"> {
+    showDaysOutsideMonth?: boolean;
+    disablePast?: boolean;
+    disableFuture?: boolean;
+    /** Earliest selectable date (inclusive). */
+    minDate?: Date;
+    /** Latest selectable date (inclusive). */
+    maxDate?: Date;
+    /** Predicate to disable arbitrary days. */
+    isDateDisabled?: (day: Date) => boolean;
+    weekStartsOn?: 0 | 1 | 2 | 3 | 4 | 5 | 6;
+    /** BCP-47 locale for calendar labels (day/month/year names). */
+    locale?: string;
+    /** Input format pattern with tokens dd, MM, yyyy, e.g. "dd/MM/yyyy". */
+    format?: string;
+    /** Enables date-range selection. */
+    range?: boolean;
+    /** Controlled range value `[start, end]`. */
+    rangeValue?: [Date | undefined, Date | undefined];
+    /** Called when the range changes. */
+    onRangeChange?: (range: [Date | undefined, Date | undefined]) => void;
+    placement?: Placement;
+    disableCalendar?: boolean;
+    label?: string;
+    /** Accessible label for the calendar popup dialog. */
+    calendarAriaLabel?: string;
+    autoComplete?: string;
+    value?: Date | string;
+    calendarIcon?: React.ReactNode;
+    onChange?: (event?: React.ChangeEvent<HTMLInputElement>, value?: Date, data?: DatePickerProps) => void;
+    onBlur?: (event?: React.FocusEvent<HTMLInputElement>, value?: Date, data?: DatePickerProps) => void;
+}
+export declare const DatePicker: React.ForwardRefExoticComponent<DatePickerProps & React.RefAttributes<unknown>>;
+export default DatePicker;

package/dist/components/inputs/datePicker/datePicker.js

@@ -0,0 +1,229 @@
+import { jsx as t, jsxs as $, Fragment as pe } from "react/jsx-runtime";
+import '../../../assets/styles/less/components/datePicker/dataPicker.entry.css';/* empty css                                                               */
+import he, { useMemo as x, useState as D, useRef as A, useCallback as i } from "react";
+import { useFloating as ye, autoUpdate as ke } from "@floating-ui/react";
+import be from "react-transition-group/Transition";
+import { resolvePlacement as ve, buildFloatingMiddleware as we } from "../../../utils/floating.js";
+import { useSafeLayoutEffect as De } from "../../../hooks/useSafeLayoutEffect.js";
+import { useForkRef as N } from "../../../hooks/useForkRef.js";
+import { DataPickerHeader as Ce } from "./dataPickerHeader.js";
+import { DataPickerDays as Re } from "./dataPickerDays.js";
+import { DatePickerList as j } from "./datePickerList.js";
+import { isValidDate as V, setMonth as Fe, setYear as Pe, getMonths as Me, getYears as Se, getDisplayDate as z } from "./utils.js";
+import { DataPickerInput as xe } from "./dataPickerInput.js";
+import { DatePickerIconButton as Ve } from "./datePickerIconButton.js";
+import { Icon as Be } from "../../base/icon/icon.js";
+import { createPortal as Le } from "react-dom";
+import { TextField as Oe } from "../textField/textField.js";
+import { ClickAwayListener as Ye } from "../../clickAwayListener/clickAwayListener.js";
+var Ee = /* @__PURE__ */ ((l) => (l.days = "days", l.months = "months", l.years = "years", l))(Ee || {});
+const Ie = (l) => ({
+  transition: `opacity ${l}ms ease-in-out`,
+  opacity: 0
+}), Te = {
+  entering: { opacity: 1 },
+  entered: { opacity: 1 },
+  exiting: { opacity: 0 }
+}, at = he.forwardRef(function(C, H) {
+  const {
+    value: R,
+    onChange: f,
+    showDaysOutsideMonth: U,
+    disablePast: q,
+    disableFuture: G,
+    weekStartsOn: J = 1,
+    placement: K = "bottom-start",
+    disabled: o,
+    disableCalendar: F,
+    calendarAriaLabel: Q = "Choose date",
+    minDate: W,
+    maxDate: X,
+    isDateDisabled: Z,
+    locale: p,
+    format: d,
+    range: g,
+    rangeValue: P,
+    onRangeChange: h,
+    calendarIcon: B,
+    onBlur: ee,
+    ...L
+  } = C, c = x(() => R === void 0 ? void 0 : new Date(R), [R]), M = P !== void 0, [te, ae] = D([void 0, void 0]), r = M && P ? P : te, [s, y] = D(() => V(c) ? c : /* @__PURE__ */ new Date()), [m, k] = D(
+    "days"
+    /* days */
+  ), [O, b] = D(!1), Y = A(null), S = A(null), E = ve(K), { refs: I, floatingStyles: ne } = ye({
+    open: O,
+    placement: E.placement,
+    whileElementsMounted: ke,
+    middleware: we(E)
+  }), T = N(Y, I.setReference, H), oe = N(S, I.setFloating);
+  De(() => {
+    o || y(V(c) ? c : /* @__PURE__ */ new Date());
+  }, [c, o]);
+  const re = i((e) => {
+    y(e);
+  }, []), se = i(() => {
+    k(
+      m === "months" ? "days" : "months"
+      /* months */
+    );
+  }, [m]), ie = i(() => {
+    k(
+      m === "years" ? "days" : "years"
+      /* years */
+    );
+  }, [m]), le = i(
+    (e) => {
+      y(Fe(s, e)), k(
+        "days"
+        /* days */
+      );
+    },
+    [s]
+  ), ce = i(
+    (e) => {
+      y(Pe(s, e)), k(
+        "days"
+        /* days */
+      );
+    },
+    [s]
+  ), de = i(
+    (e, a) => {
+      if (g) {
+        if (!a)
+          return;
+        const [n, w] = r;
+        let u;
+        !n || n && w ? u = [a, void 0] : u = V(n) && a.getTime() < n.getTime() ? [a, n] : [n, a], M || ae(u), h == null || h(u), u[0] && u[1] && b(!1);
+        return;
+      }
+      f == null || f(e, a, C), b(!1);
+    },
+    [f, C, g, r, M, h]
+  ), _ = i(() => {
+    o || b((e) => !e);
+  }, [o]), me = i((e) => {
+    var n, w;
+    const a = e.target;
+    (n = S.current) != null && n.contains(a) || (w = Y.current) != null && w.contains(a) || b(!1);
+  }, []), ue = x(() => Me(p), [p]), fe = x(() => Se((/* @__PURE__ */ new Date()).getFullYear(), 100), []);
+  let v = null;
+  switch (m) {
+    case "days":
+      v = /* @__PURE__ */ t(
+        Re,
+        {
+          viewValue: s,
+          value: c,
+          showDaysOutsideMonth: U,
+          onChange: de,
+          disablePast: q,
+          disableFuture: G,
+          weekStartsOn: J,
+          minDate: W,
+          maxDate: X,
+          isDateDisabled: Z,
+          locale: p,
+          range: g,
+          rangeStart: r[0],
+          rangeEnd: r[1]
+        }
+      );
+      break;
+    case "months":
+      v = /* @__PURE__ */ t(j, { value: s.getMonth(), items: ue, onChange: le });
+      break;
+    case "years":
+      v = /* @__PURE__ */ t(j, { value: s.getFullYear(), items: fe, onChange: ce });
+      break;
+  }
+  const ge = g && (r[0] || r[1]) ? `${z(r[0], d)} – ${z(r[1], d)}` : "";
+  return /* @__PURE__ */ $(pe, { children: [
+    g ? /* @__PURE__ */ t(
+      Oe,
+      {
+        ref: T,
+        value: ge,
+        readOnly: !0,
+        onChange: () => {
+        },
+        disabled: !!o,
+        placeholder: d ? `${d} – ${d}` : void 0,
+        endAdornment: !F && /* @__PURE__ */ t(
+          Ve,
+          {
+            edge: "end",
+            onClick: _,
+            disabled: !!o,
+            "data-testid": "date-picker-icon-button",
+            children: B || /* @__PURE__ */ t(Be, { name: "calendar_today", fill: 1, weight: 500, size: 24 })
+          }
+        ),
+        ...L
+      }
+    ) : /* @__PURE__ */ t(
+      xe,
+      {
+        ref: T,
+        value: c,
+        onChange: f,
+        onBlur: ee,
+        onToggle: _,
+        disabled: o,
+        disableCalendar: F,
+        format: d,
+        calendarIcon: B,
+        ...L
+      }
+    ),
+    Le(
+      /* @__PURE__ */ t(
+        be,
+        {
+          nodeRef: S,
+          in: O && !o && !F,
+          timeout: 150,
+          mountOnEnter: !0,
+          unmountOnExit: !0,
+          children: (e) => /* @__PURE__ */ t(Ye, { onClickAway: me, children: /* @__PURE__ */ t(
+            "div",
+            {
+              ref: oe,
+              className: "smwb-date-picker",
+              style: {
+                ...ne,
+                ...Ie(150),
+                ...Te[e]
+              },
+              "data-testid": "date-picker",
+              role: "dialog",
+              "aria-modal": "false",
+              "aria-label": Q,
+              children: /* @__PURE__ */ $("div", { className: "smwb-date-picker__inner", children: [
+                /* @__PURE__ */ t(
+                  Ce,
+                  {
+                    viewValue: s,
+                    locale: p,
+                    openView: m,
+                    onChange: re,
+                    onMonthLabelClick: se,
+                    onYearLabelClick: ie
+                  }
+                ),
+                /* @__PURE__ */ t("div", { className: "smwb-date-picker__body", children: v })
+              ] })
+            }
+          ) })
+        }
+      ),
+      document.body
+    )
+  ] });
+});
+export {
+  at as DatePicker,
+  Ee as OpenView,
+  at as default
+};
+//# sourceMappingURL=datePicker.js.map

package/dist/components/inputs/datePicker/datePicker.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"datePicker.js","sources":["../../../../src/components/inputs/datePicker/datePicker.tsx"],"sourcesContent":["import React, { useCallback, useMemo, useRef, useState } from \"react\";\nimport { autoUpdate, useFloating } from \"@floating-ui/react\";\nimport Transition, { TransitionStatus } from \"react-transition-group/Transition\";\nimport { buildFloatingMiddleware, Placement, resolvePlacement } from \"../../../utils/floating\";\nimport { useSafeLayoutEffect } from \"../../../hooks/useSafeLayoutEffect\";\nimport { useForkRef } from \"../../../hooks/useForkRef\";\nimport { TextField, TextFieldProps } from \"../textField\";\nimport { ClickAwayListener } from \"../../clickAwayListener\";\nimport { DataPickerHeader } from \"./dataPickerHeader\";\nimport { DataPickerDays } from \"./dataPickerDays\";\nimport { DatePickerList } from \"./datePickerList\";\nimport { getMonths, setMonth, getYears, setYear, isValidDate, getDisplayDate } from \"./utils\";\nimport { DataPickerInput } from \"./dataPickerInput\";\nimport { DatePickerIconButton } from \"./datePickerIconButton\";\nimport Icon from \"../../base/icon/icon\";\nimport { createPortal } from \"react-dom\";\n\nexport enum OpenView {\n  days = \"days\",\n  months = \"months\",\n  years = \"years\",\n}\n\nconst defaultStyle = (duration: number) => ({\n  transition: `opacity ${duration}ms ease-in-out`,\n  opacity: 0,\n});\n\nconst transitionStyles = {\n  entering: { opacity: 1 },\n  entered: { opacity: 1 },\n  exiting: { opacity: 0 },\n} as Record<TransitionStatus, { opacity: number }>;\n\nexport interface DatePickerProps extends Omit<TextFieldProps, \"onBlur\" | \"onChange\" | \"value\" | \"defaultValue\"> {\n  showDaysOutsideMonth?: boolean;\n  disablePast?: boolean;\n  disableFuture?: boolean;\n  /** Earliest selectable date (inclusive). */\n  minDate?: Date;\n  /** Latest selectable date (inclusive). */\n  maxDate?: Date;\n  /** Predicate to disable arbitrary days. */\n  isDateDisabled?: (day: Date) => boolean;\n  weekStartsOn?: 0 | 1 | 2 | 3 | 4 | 5 | 6;\n  /** BCP-47 locale for calendar labels (day/month/year names). */\n  locale?: string;\n  /** Input format pattern with tokens dd, MM, yyyy, e.g. \"dd/MM/yyyy\". */\n  format?: string;\n  /** Enables date-range selection. */\n  range?: boolean;\n  /** Controlled range value `[start, end]`. */\n  rangeValue?: [Date | undefined, Date | undefined];\n  /** Called when the range changes. */\n  onRangeChange?: (range: [Date | undefined, Date | undefined]) => void;\n  placement?: Placement;\n  disableCalendar?: boolean;\n  label?: string;\n  /** Accessible label for the calendar popup dialog. */\n  calendarAriaLabel?: string;\n  autoComplete?: string;\n  value?: Date | string;\n  calendarIcon?: React.ReactNode;\n  onChange?: (event?: React.ChangeEvent<HTMLInputElement>, value?: Date, data?: DatePickerProps) => void;\n  onBlur?: (event?: React.FocusEvent<HTMLInputElement>, value?: Date, data?: DatePickerProps) => void;\n}\n\nexport const DatePicker = React.forwardRef(function DatePicker(props: DatePickerProps, ref) {\n  const {\n    value: valueProp,\n    onChange: onChangeProp,\n    showDaysOutsideMonth,\n    disablePast,\n    disableFuture,\n    weekStartsOn = 1,\n    placement = \"bottom-start\",\n    disabled,\n    disableCalendar,\n    calendarAriaLabel = \"Choose date\",\n    minDate,\n    maxDate,\n    isDateDisabled,\n    locale,\n    format,\n    range,\n    rangeValue,\n    onRangeChange,\n    calendarIcon,\n    onBlur: onBlurProp,\n    ...rest\n  } = props;\n  const value = useMemo(() => (valueProp === undefined ? undefined : new Date(valueProp)), [valueProp]);\n  const isRangeControlled = rangeValue !== undefined;\n  const [rangeState, setRangeState] = useState<[Date | undefined, Date | undefined]>([undefined, undefined]);\n  const currentRange = isRangeControlled && rangeValue ? rangeValue : rangeState;\n  const [viewValue, setViewValue] = useState<Date>(() => (isValidDate(value) ? value : new Date()));\n  const [openView, setOpenView] = useState<OpenView>(OpenView.days);\n  const [isOpen, setIsOpen] = useState(false);\n\n  const anchorRef = useRef<HTMLDivElement | null>(null);\n  const calendarRef = useRef<HTMLDivElement | null>(null);\n\n  const resolved = resolvePlacement(placement);\n  const { refs, floatingStyles } = useFloating({\n    open: isOpen,\n    placement: resolved.placement,\n    whileElementsMounted: autoUpdate,\n    middleware: buildFloatingMiddleware(resolved),\n  });\n\n  const anchorForkRef = useForkRef(anchorRef, refs.setReference, ref);\n  const calendarForkRef = useForkRef(calendarRef, refs.setFloating);\n\n  useSafeLayoutEffect(() => {\n    if (disabled) {\n      return;\n    }\n\n    setViewValue(isValidDate(value) ? value : new Date());\n  }, [value, disabled]);\n\n  const onViewValueChange = useCallback((value: Date) => {\n    setViewValue(value);\n  }, []);\n\n  const onMonthLabelClick = useCallback(() => {\n    setOpenView(openView === OpenView.months ? OpenView.days : OpenView.months);\n  }, [openView]);\n\n  const onYearLabelClick = useCallback(() => {\n    setOpenView(openView === OpenView.years ? OpenView.days : OpenView.years);\n  }, [openView]);\n\n  const onMonthChange = useCallback(\n    (month: number) => {\n      setViewValue(setMonth(viewValue, month));\n      setOpenView(OpenView.days);\n    },\n    [viewValue]\n  );\n\n  const onYearChange = useCallback(\n    (month: number) => {\n      setViewValue(setYear(viewValue, month));\n      setOpenView(OpenView.days);\n    },\n    [viewValue]\n  );\n\n  const onChange = useCallback(\n    (event?: React.ChangeEvent<HTMLInputElement>, date?: Date) => {\n      if (range) {\n        if (!date) {\n          return;\n        }\n        const [start, end] = currentRange;\n        let next: [Date | undefined, Date | undefined];\n        if (!start || (start && end)) {\n          next = [date, undefined];\n        } else {\n          next = isValidDate(start) && date.getTime() < start.getTime() ? [date, start] : [start, date];\n        }\n        if (!isRangeControlled) {\n          setRangeState(next);\n        }\n        onRangeChange?.(next);\n        if (next[0] && next[1]) {\n          setIsOpen(false);\n        }\n        return;\n      }\n      onChangeProp?.(event, date, props);\n      setIsOpen(false);\n    },\n    [onChangeProp, props, range, currentRange, isRangeControlled, onRangeChange]\n  );\n\n  const onToggle = useCallback(() => {\n    if (!disabled) {\n      setIsOpen((prevState) => !prevState);\n    }\n  }, [disabled]);\n\n  const onClickAway = useCallback((event: Event | React.SyntheticEvent) => {\n    const target = event.target as HTMLElement;\n\n    if (calendarRef.current?.contains(target) || anchorRef.current?.contains(target)) {\n      return;\n    }\n\n    setIsOpen(false);\n  }, []);\n\n  const months = useMemo(() => getMonths(locale), [locale]);\n  const years = useMemo(() => getYears(new Date().getFullYear(), 100), []);\n\n  let view: React.ReactNode = null;\n\n  switch (openView) {\n    case OpenView.days:\n      view = (\n        <DataPickerDays\n          viewValue={viewValue}\n          value={value}\n          showDaysOutsideMonth={showDaysOutsideMonth}\n          onChange={onChange}\n          disablePast={disablePast}\n          disableFuture={disableFuture}\n          weekStartsOn={weekStartsOn}\n          minDate={minDate}\n          maxDate={maxDate}\n          isDateDisabled={isDateDisabled}\n          locale={locale}\n          range={range}\n          rangeStart={currentRange[0]}\n          rangeEnd={currentRange[1]}\n        />\n      );\n      break;\n    case OpenView.months:\n      view = <DatePickerList value={viewValue.getMonth()} items={months} onChange={onMonthChange} />;\n      break;\n    case OpenView.years:\n      view = <DatePickerList value={viewValue.getFullYear()} items={years} onChange={onYearChange} />;\n      break;\n  }\n\n  const rangeDisplay =\n    range && (currentRange[0] || currentRange[1])\n      ? `${getDisplayDate(currentRange[0], format)} – ${getDisplayDate(currentRange[1], format)}`\n      : \"\";\n\n  return (\n    <>\n      {range ? (\n        <TextField\n          ref={anchorForkRef}\n          value={rangeDisplay}\n          readOnly\n          onChange={() => undefined}\n          disabled={Boolean(disabled)}\n          placeholder={format ? `${format} – ${format}` : undefined}\n          endAdornment={\n            !disableCalendar && (\n              <DatePickerIconButton\n                edge=\"end\"\n                onClick={onToggle}\n                disabled={Boolean(disabled)}\n                data-testid=\"date-picker-icon-button\"\n              >\n                {calendarIcon || <Icon name=\"calendar_today\" fill={1} weight={500} size={24} />}\n              </DatePickerIconButton>\n            )\n          }\n          {...rest}\n        />\n      ) : (\n        <DataPickerInput\n          ref={anchorForkRef}\n          value={value}\n          onChange={onChangeProp}\n          onBlur={onBlurProp}\n          onToggle={onToggle}\n          disabled={disabled}\n          disableCalendar={disableCalendar}\n          format={format}\n          calendarIcon={calendarIcon}\n          {...rest}\n        />\n      )}\n      {createPortal(\n        <Transition\n          nodeRef={calendarRef}\n          in={isOpen && !disabled && !disableCalendar}\n          timeout={150}\n          mountOnEnter\n          unmountOnExit\n        >\n          {(state) => (\n            <ClickAwayListener onClickAway={onClickAway}>\n              <div\n                ref={calendarForkRef}\n                className=\"smwb-date-picker\"\n                style={{\n                  ...floatingStyles,\n                  ...defaultStyle(150),\n                  ...transitionStyles[state],\n                }}\n                data-testid=\"date-picker\"\n                role=\"dialog\"\n                aria-modal=\"false\"\n                aria-label={calendarAriaLabel}\n              >\n                <div className=\"smwb-date-picker__inner\">\n                  <DataPickerHeader\n                    viewValue={viewValue}\n                    locale={locale}\n                    openView={openView}\n                    onChange={onViewValueChange}\n                    onMonthLabelClick={onMonthLabelClick}\n                    onYearLabelClick={onYearLabelClick}\n                  />\n                  <div className=\"smwb-date-picker__body\">{view}</div>\n                </div>\n              </div>\n            </ClickAwayListener>\n          )}\n        </Transition>,\n        document.body\n      )}\n    </>\n  );\n});\n\nexport default DatePicker;\n"],"names":["OpenView","defaultStyle","duration","transitionStyles","DatePicker","React","props","ref","valueProp","onChangeProp","showDaysOutsideMonth","disablePast","disableFuture","weekStartsOn","placement","disabled","disableCalendar","calendarAriaLabel","minDate","maxDate","isDateDisabled","locale","format","range","rangeValue","onRangeChange","calendarIcon","onBlurProp","rest","value","useMemo","isRangeControlled","rangeState","setRangeState","useState","currentRange","viewValue","setViewValue","isValidDate","openView","setOpenView","isOpen","setIsOpen","anchorRef","useRef","calendarRef","resolved","resolvePlacement","refs","floatingStyles","useFloating","autoUpdate","buildFloatingMiddleware","anchorForkRef","useForkRef","calendarForkRef","useSafeLayoutEffect","onViewValueChange","useCallback","onMonthLabelClick","onYearLabelClick","onMonthChange","month","setMonth","onYearChange","setYear","onChange","event","date","start","end","next","onToggle","prevState","onClickAway","target","_a","_b","months","getMonths","years","getYears","view","jsx","DataPickerDays","DatePickerList","rangeDisplay","getDisplayDate","jsxs","Fragment","TextField","DatePickerIconButton","Icon","DataPickerInput","createPortal","Transition","state","ClickAwayListener","DataPickerHeader"],"mappings":"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"}

package/dist/components/inputs/datePicker/datePickerActionLabel.d.ts

@@ -0,0 +1,12 @@
+import React from "react";
+export interface ActionLabelProp {
+    label: string;
+    onLeftIconClick?: React.MouseEventHandler;
+    onRightIconClick?: React.MouseEventHandler;
+    onLabelClick?: React.MouseEventHandler;
+    disabled?: boolean;
+    active?: boolean;
+    hiddenSwitches?: boolean;
+    dataToggleId?: string;
+}
+export declare function DatePickerActionLabel({ label, onLeftIconClick, onRightIconClick, onLabelClick, disabled, active, hiddenSwitches, dataToggleId, ...rest }: ActionLabelProp): import("react/jsx-runtime").JSX.Element;

package/dist/components/inputs/datePicker/datePickerActionLabel.js

@@ -0,0 +1,42 @@
+import { jsxs as t, jsx as e } from "react/jsx-runtime";
+import r from "clsx";
+import { DatePickerIconButton as s } from "./datePickerIconButton.js";
+import { Icon as a } from "../../base/icon/icon.js";
+function f({
+  label: o,
+  onLeftIconClick: n,
+  onRightIconClick: l,
+  onLabelClick: d,
+  disabled: i,
+  active: m,
+  hiddenSwitches: _,
+  dataToggleId: w,
+  ...h
+}) {
+  const c = r("smwb-date-picker__switch", {
+    "smwb-date-picker__switch--hidden": _
+  });
+  return /* @__PURE__ */ t("div", { className: "smwb-date-picker__action", ...h, children: [
+    /* @__PURE__ */ e("div", { className: c, children: /* @__PURE__ */ e(s, { size: "small", onClick: i ? void 0 : n, children: /* @__PURE__ */ e(a, { name: "keyboard_arrow_left", weight: 500, size: 24 }) }) }),
+    /* @__PURE__ */ t(
+      "div",
+      {
+        className: r("smwb-date-picker__action-label", {
+          "smwb-date-picker__action-label--disabled": i,
+          "smwb-date-picker__action-label--active": m
+        }),
+        "data-testid": w,
+        onClick: i ? void 0 : d,
+        children: [
+          /* @__PURE__ */ e("span", { className: "smwb-date-picker__action-text", children: o }),
+          /* @__PURE__ */ e(a, { name: "arrow_drop_down", weight: 500, size: 20 })
+        ]
+      }
+    ),
+    /* @__PURE__ */ e("div", { className: c, children: /* @__PURE__ */ e(s, { size: "small", onClick: i ? void 0 : l, children: /* @__PURE__ */ e(a, { name: "keyboard_arrow_right", weight: 500, size: 24 }) }) })
+  ] });
+}
+export {
+  f as DatePickerActionLabel
+};
+//# sourceMappingURL=datePickerActionLabel.js.map

package/dist/components/inputs/datePicker/datePickerActionLabel.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"datePickerActionLabel.js","sources":["../../../../src/components/inputs/datePicker/datePickerActionLabel.tsx"],"sourcesContent":["import React from \"react\";\nimport cn from \"clsx\";\nimport { DatePickerIconButton } from \"./datePickerIconButton\";\nimport Icon from \"../../base/icon/icon\";\n\nexport interface ActionLabelProp {\n  label: string;\n  onLeftIconClick?: React.MouseEventHandler;\n  onRightIconClick?: React.MouseEventHandler;\n  onLabelClick?: React.MouseEventHandler;\n  disabled?: boolean;\n  active?: boolean;\n  hiddenSwitches?: boolean;\n  dataToggleId?: string;\n}\n\nexport function DatePickerActionLabel({\n  label,\n  onLeftIconClick,\n  onRightIconClick,\n  onLabelClick,\n  disabled,\n  active,\n  hiddenSwitches,\n  dataToggleId,\n  ...rest\n}: ActionLabelProp) {\n  const switchClasses = cn(\"smwb-date-picker__switch\", {\n    \"smwb-date-picker__switch--hidden\": hiddenSwitches,\n  });\n\n  return (\n    <div className=\"smwb-date-picker__action\" {...rest}>\n      <div className={switchClasses}>\n        <DatePickerIconButton size=\"small\" onClick={disabled ? undefined : onLeftIconClick}>\n          <Icon name=\"keyboard_arrow_left\" weight={500} size={24} />\n        </DatePickerIconButton>\n      </div>\n      <div\n        className={cn(\"smwb-date-picker__action-label\", {\n          \"smwb-date-picker__action-label--disabled\": disabled,\n          \"smwb-date-picker__action-label--active\": active,\n        })}\n        data-testid={dataToggleId}\n        onClick={disabled ? undefined : onLabelClick}\n      >\n        <span className=\"smwb-date-picker__action-text\">{label}</span>\n        <Icon name=\"arrow_drop_down\" weight={500} size={20} />\n      </div>\n      <div className={switchClasses}>\n        <DatePickerIconButton size=\"small\" onClick={disabled ? undefined : onRightIconClick}>\n          <Icon name=\"keyboard_arrow_right\" weight={500} size={24} />\n        </DatePickerIconButton>\n      </div>\n    </div>\n  );\n}\n"],"names":["DatePickerActionLabel","label","onLeftIconClick","onRightIconClick","onLabelClick","disabled","active","hiddenSwitches","dataToggleId","rest","switchClasses","cn","jsxs","jsx","DatePickerIconButton","Icon"],"mappings":";;;;AAgBO,SAASA,EAAsB;AAAA,EACpC,OAAAC;AAAA,EACA,iBAAAC;AAAA,EACA,kBAAAC;AAAA,EACA,cAAAC;AAAA,EACA,UAAAC;AAAA,EACA,QAAAC;AAAA,EACA,gBAAAC;AAAA,EACA,cAAAC;AAAA,EACA,GAAGC;AACL,GAAoB;AAClB,QAAMC,IAAgBC,EAAG,4BAA4B;AAAA,IACnD,oCAAoCJ;AAAA,EAAA,CACrC;AAED,SACE,gBAAAK,EAAC,OAAA,EAAI,WAAU,4BAA4B,GAAGH,GAC5C,UAAA;AAAA,IAAA,gBAAAI,EAAC,OAAA,EAAI,WAAWH,GACd,UAAA,gBAAAG,EAACC,KAAqB,MAAK,SAAQ,SAAST,IAAW,SAAYH,GACjE,UAAA,gBAAAW,EAACE,GAAA,EAAK,MAAK,uBAAsB,QAAQ,KAAK,MAAM,IAAI,GAC1D,EAAA,CACF;AAAA,IACA,gBAAAH;AAAA,MAAC;AAAA,MAAA;AAAA,QACC,WAAWD,EAAG,kCAAkC;AAAA,UAC9C,4CAA4CN;AAAA,UAC5C,0CAA0CC;AAAA,QAAA,CAC3C;AAAA,QACD,eAAaE;AAAA,QACb,SAASH,IAAW,SAAYD;AAAA,QAEhC,UAAA;AAAA,UAAA,gBAAAS,EAAC,QAAA,EAAK,WAAU,iCAAiC,UAAAZ,GAAM;AAAA,4BACtDc,GAAA,EAAK,MAAK,mBAAkB,QAAQ,KAAK,MAAM,GAAA,CAAI;AAAA,QAAA;AAAA,MAAA;AAAA,IAAA;AAAA,IAEtD,gBAAAF,EAAC,SAAI,WAAWH,GACd,4BAACI,GAAA,EAAqB,MAAK,SAAQ,SAAST,IAAW,SAAYF,GACjE,UAAA,gBAAAU,EAACE,KAAK,MAAK,wBAAuB,QAAQ,KAAK,MAAM,GAAA,CAAI,EAAA,CAC3D,EAAA,CACF;AAAA,EAAA,GACF;AAEJ;"}

package/dist/components/inputs/datePicker/datePickerDay.d.ts

@@ -0,0 +1,13 @@
+import React from "react";
+interface DataPickerDayProps extends Omit<React.ButtonHTMLAttributes<HTMLButtonElement>, "onChange"> {
+    active?: boolean;
+    current?: boolean;
+    hidden?: boolean;
+    outside?: boolean;
+    disabled?: boolean;
+    inRange?: boolean;
+    day: Date;
+    onChange?: (event?: React.ChangeEvent<HTMLInputElement>, date?: Date) => void;
+}
+export declare const DatePickerDay: React.MemoExoticComponent<({ className, children, onMouseDown: onMouseDownProp, onChange, active, current, hidden, outside, disabled, inRange, day, ...rest }: DataPickerDayProps) => import("react/jsx-runtime").JSX.Element>;
+export {};

package/dist/components/inputs/datePicker/datePickerDay.js

@@ -0,0 +1,62 @@
+import { jsx as _, jsxs as d } from "react/jsx-runtime";
+import c from "react";
+import j from "clsx";
+import { Ripple as D } from "../../base/ripple/ripple.js";
+const B = c.memo(function({
+  className: k,
+  children: n,
+  onMouseDown: e,
+  onChange: r,
+  active: i,
+  current: f,
+  hidden: u,
+  outside: y,
+  disabled: t,
+  inRange: l,
+  day: m,
+  ...o
+}) {
+  const s = c.useRef(null), R = c.useCallback(
+    (a) => {
+      e == null || e(a);
+    },
+    [e]
+  ), w = c.useCallback(
+    (a) => {
+      var p;
+      t || (p = s.current) == null || p.onRipple(a);
+    },
+    [t]
+  ), b = c.useCallback(() => {
+    t || r == null || r(void 0, m);
+  }, [r, m, t]);
+  if (u)
+    return /* @__PURE__ */ _("span", { className: "smwb-date-picker__day-hidden" });
+  const x = j("smwb-date-picker__day", k, {
+    "smwb-date-picker__day--active": !t && i,
+    "smwb-date-picker__day--current": f && !i,
+    "smwb-date-picker__day--outside": !t && y,
+    "smwb-date-picker__day--disabled": t,
+    "smwb-date-picker__day--in-range": !t && l
+  });
+  return /* @__PURE__ */ d(
+    "button",
+    {
+      className: x,
+      type: "button",
+      onMouseDown: R,
+      onPointerDown: w,
+      onClick: b,
+      disabled: t,
+      ...o,
+      children: [
+        n,
+        !t && /* @__PURE__ */ _(D, { actionRef: s, center: !0 })
+      ]
+    }
+  );
+});
+export {
+  B as DatePickerDay
+};
+//# sourceMappingURL=datePickerDay.js.map

package/dist/components/inputs/datePicker/datePickerDay.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"datePickerDay.js","sources":["../../../../src/components/inputs/datePicker/datePickerDay.tsx"],"sourcesContent":["import React from \"react\";\nimport cn from \"clsx\";\nimport { Ripple, RippleActionsRef } from \"../../base/ripple/ripple\";\n\ninterface DataPickerDayProps extends Omit<React.ButtonHTMLAttributes<HTMLButtonElement>, \"onChange\"> {\n  active?: boolean;\n  current?: boolean;\n  hidden?: boolean;\n  outside?: boolean;\n  disabled?: boolean;\n  inRange?: boolean;\n  day: Date;\n  onChange?: (event?: React.ChangeEvent<HTMLInputElement>, date?: Date) => void;\n}\n\nexport const DatePickerDay = React.memo(function DataPickerDay({\n  className,\n  children,\n  onMouseDown: onMouseDownProp,\n  onChange,\n  active,\n  current,\n  hidden,\n  outside,\n  disabled,\n  inRange,\n  day,\n  ...rest\n}: DataPickerDayProps) {\n  const rippleRef = React.useRef<RippleActionsRef>(null);\n\n  const onMouseDown = React.useCallback(\n    (event: React.MouseEvent<HTMLButtonElement>) => {\n      onMouseDownProp?.(event);\n    },\n    [onMouseDownProp]\n  );\n\n  // Ripple on pointerdown so it fires for touch and pen, not just mouse.\n  const onPointerDown = React.useCallback(\n    (event: React.PointerEvent<HTMLButtonElement>) => {\n      if (!disabled) {\n        rippleRef.current?.onRipple(event);\n      }\n    },\n    [disabled]\n  );\n\n  const onClick = React.useCallback(() => {\n    if (!disabled) {\n      onChange?.(undefined, day);\n    }\n  }, [onChange, day, disabled]);\n\n  if (hidden) {\n    return <span className=\"smwb-date-picker__day-hidden\" />;\n  }\n\n  const classes = cn(\"smwb-date-picker__day\", className, {\n    \"smwb-date-picker__day--active\": !disabled && active,\n    \"smwb-date-picker__day--current\": current && !active,\n    \"smwb-date-picker__day--outside\": !disabled && outside,\n    \"smwb-date-picker__day--disabled\": disabled,\n    \"smwb-date-picker__day--in-range\": !disabled && inRange,\n  });\n\n  return (\n    <button\n      className={classes}\n      type=\"button\"\n      onMouseDown={onMouseDown}\n      onPointerDown={onPointerDown}\n      onClick={onClick}\n      disabled={disabled}\n      {...rest}\n    >\n      {children}\n      {!disabled && <Ripple actionRef={rippleRef} center />}\n    </button>\n  );\n});\n"],"names":["DatePickerDay","React","className","children","onMouseDownProp","onChange","active","current","hidden","outside","disabled","inRange","day","rest","rippleRef","onMouseDown","event","onPointerDown","_a","onClick","jsx","classes","cn","jsxs","Ripple"],"mappings":";;;;AAeO,MAAMA,IAAgBC,EAAM,KAAK,SAAuB;AAAA,EAC7D,WAAAC;AAAA,EACA,UAAAC;AAAA,EACA,aAAaC;AAAA,EACb,UAAAC;AAAA,EACA,QAAAC;AAAA,EACA,SAAAC;AAAA,EACA,QAAAC;AAAA,EACA,SAAAC;AAAA,EACA,UAAAC;AAAA,EACA,SAAAC;AAAA,EACA,KAAAC;AAAA,EACA,GAAGC;AACL,GAAuB;AACrB,QAAMC,IAAYb,EAAM,OAAyB,IAAI,GAE/Cc,IAAcd,EAAM;AAAA,IACxB,CAACe,MAA+C;AAC9C,MAAAZ,KAAA,QAAAA,EAAkBY;AAAA,IACpB;AAAA,IACA,CAACZ,CAAe;AAAA,EAAA,GAIZa,IAAgBhB,EAAM;AAAA,IAC1B,CAACe,MAAiD;;AAChD,MAAKN,MACHQ,IAAAJ,EAAU,YAAV,QAAAI,EAAmB,SAASF;AAAA,IAEhC;AAAA,IACA,CAACN,CAAQ;AAAA,EAAA,GAGLS,IAAUlB,EAAM,YAAY,MAAM;AACtC,IAAKS,KACHL,KAAA,QAAAA,EAAW,QAAWO;AAAA,EAE1B,GAAG,CAACP,GAAUO,GAAKF,CAAQ,CAAC;AAE5B,MAAIF;AACF,WAAO,gBAAAY,EAAC,QAAA,EAAK,WAAU,+BAAA,CAA+B;AAGxD,QAAMC,IAAUC,EAAG,yBAAyBpB,GAAW;AAAA,IACrD,iCAAiC,CAACQ,KAAYJ;AAAA,IAC9C,kCAAkCC,KAAW,CAACD;AAAA,IAC9C,kCAAkC,CAACI,KAAYD;AAAA,IAC/C,mCAAmCC;AAAA,IACnC,mCAAmC,CAACA,KAAYC;AAAA,EAAA,CACjD;AAED,SACE,gBAAAY;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,WAAWF;AAAA,MACX,MAAK;AAAA,MACL,aAAAN;AAAA,MACA,eAAAE;AAAA,MACA,SAAAE;AAAA,MACA,UAAAT;AAAA,MACC,GAAGG;AAAA,MAEH,UAAA;AAAA,QAAAV;AAAA,QACA,CAACO,KAAY,gBAAAU,EAACI,KAAO,WAAWV,GAAW,QAAM,GAAA,CAAC;AAAA,MAAA;AAAA,IAAA;AAAA,EAAA;AAGzD,CAAC;"}

package/dist/components/inputs/datePicker/datePickerIconButton.d.ts

@@ -0,0 +1,6 @@
+import React from "react";
+export type DataPickerIconButtonProps = React.ButtonHTMLAttributes<HTMLButtonElement> & {
+    size?: "medium" | "small";
+    edge?: "start" | "end";
+};
+export declare function DatePickerIconButton({ className, children, onMouseDown: onMouseDownProp, disabled, size, edge, ...rest }: DataPickerIconButtonProps): import("react/jsx-runtime").JSX.Element;

package/dist/components/inputs/datePicker/datePickerIconButton.js

@@ -0,0 +1,44 @@
+import { jsxs as l, jsx as _ } from "react/jsx-runtime";
+import f from "react";
+import { Ripple as d } from "../../base/ripple/ripple.js";
+import k from "clsx";
+function g({
+  className: r,
+  children: m,
+  onMouseDown: e,
+  disabled: t,
+  size: s = "medium",
+  edge: c,
+  ...a
+}) {
+  const o = f.useRef(null), p = (n) => {
+    e == null || e(n);
+  }, u = (n) => {
+    var i;
+    t || (i = o.current) == null || i.onRipple(n);
+  }, b = k("smwb-date-picker__icon-button", r, {
+    "smwb-date-picker__icon-button--small": s === "small",
+    "smwb-date-picker__icon-button--edge-start": c === "start",
+    "smwb-date-picker__icon-button--edge-end": c === "end",
+    "smwb-date-picker__icon-button--disabled": t
+  });
+  return /* @__PURE__ */ l(
+    "button",
+    {
+      onMouseDown: p,
+      onPointerDown: u,
+      type: "button",
+      className: b,
+      disabled: t,
+      ...a,
+      children: [
+        m,
+        !t && /* @__PURE__ */ _(d, { actionRef: o, center: !0 })
+      ]
+    }
+  );
+}
+export {
+  g as DatePickerIconButton
+};
+//# sourceMappingURL=datePickerIconButton.js.map

package/dist/components/inputs/datePicker/datePickerIconButton.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"datePickerIconButton.js","sources":["../../../../src/components/inputs/datePicker/datePickerIconButton.tsx"],"sourcesContent":["import React from \"react\";\nimport { Ripple, RippleActionsRef } from \"../../base/ripple/ripple\";\nimport cn from \"clsx\";\n\nexport type DataPickerIconButtonProps = React.ButtonHTMLAttributes<HTMLButtonElement> & {\n  size?: \"medium\" | \"small\";\n  edge?: \"start\" | \"end\";\n};\n\nexport function DatePickerIconButton({\n  className,\n  children,\n  onMouseDown: onMouseDownProp,\n  disabled,\n  size = \"medium\",\n  edge,\n  ...rest\n}: DataPickerIconButtonProps) {\n  const rippleRef = React.useRef<RippleActionsRef>(null);\n\n  const onMouseDown = (event: React.MouseEvent<HTMLButtonElement>) => {\n    onMouseDownProp?.(event);\n  };\n\n  // Ripple on pointerdown so it fires for touch and pen, not just mouse.\n  const onPointerDown = (event: React.PointerEvent<HTMLButtonElement>) => {\n    if (!disabled) {\n      rippleRef.current?.onRipple(event);\n    }\n  };\n\n  const classes = cn(\"smwb-date-picker__icon-button\", className, {\n    \"smwb-date-picker__icon-button--small\": size === \"small\",\n    \"smwb-date-picker__icon-button--edge-start\": edge === \"start\",\n    \"smwb-date-picker__icon-button--edge-end\": edge === \"end\",\n    \"smwb-date-picker__icon-button--disabled\": disabled,\n  });\n\n  return (\n    <button\n      onMouseDown={onMouseDown}\n      onPointerDown={onPointerDown}\n      type=\"button\"\n      className={classes}\n      disabled={disabled}\n      {...rest}\n    >\n      {children}\n      {!disabled && <Ripple actionRef={rippleRef} center />}\n    </button>\n  );\n}\n"],"names":["DatePickerIconButton","className","children","onMouseDownProp","disabled","size","edge","rest","rippleRef","React","onMouseDown","event","onPointerDown","_a","classes","cn","jsxs","jsx","Ripple"],"mappings":";;;;AASO,SAASA,EAAqB;AAAA,EACnC,WAAAC;AAAA,EACA,UAAAC;AAAA,EACA,aAAaC;AAAA,EACb,UAAAC;AAAA,EACA,MAAAC,IAAO;AAAA,EACP,MAAAC;AAAA,EACA,GAAGC;AACL,GAA8B;AAC5B,QAAMC,IAAYC,EAAM,OAAyB,IAAI,GAE/CC,IAAc,CAACC,MAA+C;AAClE,IAAAR,KAAA,QAAAA,EAAkBQ;AAAA,EACpB,GAGMC,IAAgB,CAACD,MAAiD;;AACtE,IAAKP,MACHS,IAAAL,EAAU,YAAV,QAAAK,EAAmB,SAASF;AAAA,EAEhC,GAEMG,IAAUC,EAAG,iCAAiCd,GAAW;AAAA,IAC7D,wCAAwCI,MAAS;AAAA,IACjD,6CAA6CC,MAAS;AAAA,IACtD,2CAA2CA,MAAS;AAAA,IACpD,2CAA2CF;AAAA,EAAA,CAC5C;AAED,SACE,gBAAAY;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,aAAAN;AAAA,MACA,eAAAE;AAAA,MACA,MAAK;AAAA,MACL,WAAWE;AAAA,MACX,UAAAV;AAAA,MACC,GAAGG;AAAA,MAEH,UAAA;AAAA,QAAAL;AAAA,QACA,CAACE,KAAY,gBAAAa,EAACC,KAAO,WAAWV,GAAW,QAAM,GAAA,CAAC;AAAA,MAAA;AAAA,IAAA;AAAA,EAAA;AAGzD;"}