@choco-vanille/ui 1.1.1 → 1.2.0

package/dist/components/forms/calendar/hooks/useCalendar.hook.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useCalendar.hook.js","sources":["../../../../../src/components/forms/calendar/hooks/useCalendar.hook.ts"],"sourcesContent":["import { useCallback, useState } from 'react'\r\n\r\nimport {\r\n    DEFAULT_END_YEAR,\r\n    DEFAULT_START_YEAR,\r\n} from '@components/forms/calendar/constants'\r\nimport type { CalendarView } from '@components/forms/calendar/context/calendarContext.ts'\r\nimport type { UseCalendarProps, UseCalendarResult } from '@components/forms/calendar/hooks/types'\r\n\r\nexport const useCalendar = ({\r\n    month: controlledMonth,\r\n    defaultMonth,\r\n    onMonthChange,\r\n    startMonth,\r\n    endMonth,\r\n    startYear,\r\n    endYear,\r\n}: UseCalendarProps): UseCalendarResult => {\r\n    const resolvedStartYear = startYear ?? DEFAULT_START_YEAR\r\n    const resolvedEndYear = endYear ?? DEFAULT_END_YEAR\r\n\r\n    const [view, setView] = useState<CalendarView>('day')\r\n    const [internalMonth, setInternalMonth] = useState<Date>(\r\n        controlledMonth ?? defaultMonth ?? new Date(),\r\n    )\r\n\r\n    const currentMonth = controlledMonth ?? internalMonth\r\n\r\n    const setCurrentMonth = useCallback(\r\n        (date: Date) => {\r\n            setInternalMonth(date)\r\n            onMonthChange?.(date)\r\n        },\r\n        [onMonthChange],\r\n    )\r\n\r\n    const resolvedStartMonth = startMonth ?? new Date(resolvedStartYear, 0, 1)\r\n    const resolvedEndMonth = endMonth ?? new Date(resolvedEndYear, 11, 31)\r\n\r\n    return {\r\n        view,\r\n        setView,\r\n        currentMonth,\r\n        setCurrentMonth,\r\n        resolvedStartYear,\r\n        resolvedEndYear,\r\n        resolvedStartMonth,\r\n        resolvedEndMonth,\r\n    }\r\n}\r\n"],"names":["useCalendar","controlledMonth","defaultMonth","onMonthChange","startMonth","endMonth","startYear","endYear","resolvedStartYear","DEFAULT_START_YEAR","resolvedEndYear","DEFAULT_END_YEAR","view","setView","useState","internalMonth","setInternalMonth","currentMonth","setCurrentMonth","useCallback","date","resolvedStartMonth","resolvedEndMonth"],"mappings":";;AASO,MAAMA,IAAc,CAAC;AAAA,EACxB,OAAOC;AAAA,EACP,cAAAC;AAAA,EACA,eAAAC;AAAA,EACA,YAAAC;AAAA,EACA,UAAAC;AAAA,EACA,WAAAC;AAAA,EACA,SAAAC;AACJ,MAA2C;AACvC,QAAMC,IAAoBF,KAAaG,GACjCC,IAAkBH,KAAWI,GAE7B,CAACC,GAAMC,CAAO,IAAIC,EAAuB,KAAK,GAC9C,CAACC,GAAeC,CAAgB,IAAIF;AAAA,IACtCb,KAAmBC,KAAgB,oBAAI,KAAA;AAAA,EAAK,GAG1Ce,IAAehB,KAAmBc,GAElCG,IAAkBC;AAAA,IACpB,CAACC,MAAe;AACZ,MAAAJ,EAAiBI,CAAI,GACrBjB,IAAgBiB,CAAI;AAAA,IACxB;AAAA,IACA,CAACjB,CAAa;AAAA,EAAA,GAGZkB,IAAqBjB,KAAc,IAAI,KAAKI,GAAmB,GAAG,CAAC,GACnEc,IAAmBjB,KAAY,IAAI,KAAKK,GAAiB,IAAI,EAAE;AAErE,SAAO;AAAA,IACH,MAAAE;AAAA,IACA,SAAAC;AAAA,IACA,cAAAI;AAAA,IACA,iBAAAC;AAAA,IACA,mBAAAV;AAAA,IACA,iBAAAE;AAAA,IACA,oBAAAW;AAAA,IACA,kBAAAC;AAAA,EAAA;AAER;"}

package/dist/components/forms/calendar/index.d.ts

@@ -0,0 +1,9 @@
+export { default as Calendar } from './Calendar.tsx';
+export { CALENDAR_ROOT_STYLES } from './styles/calendarRoot.css.ts';
+export { CALENDAR_CAPTION_STYLES } from './components/calendar-caption/styles/CalendarCaption.css.ts';
+export { CALENDAR_GRID_STYLES } from './styles/calendarGrid.css.ts';
+export { CALENDAR_DAY_BUTTON_STYLES } from './styles/calendarDayButton.css.ts';
+export { CALENDAR_MONTH_VIEW_STYLES } from './components/calendar-month-view/styles/CalendarMonthView.css.ts';
+export { CALENDAR_YEAR_VIEW_STYLES } from './components/calendar-year-view/styles/CalendarYearView.css.ts';
+export type { CalendarProps } from './types/Calendar.props.ts';
+export type { CalendarView } from './context/calendarContext.ts';

package/dist/components/forms/calendar/styles/calendarDayButton.css.cjs

@@ -0,0 +1,2 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});;/* empty css                                              */;/* empty css                                       */var e={day_button:"_5a2wtz0",selected:"_5a2wtz1",today:"_5a2wtz2",outside:"_5a2wtz3",disabled:"_5a2wtz4",range_start:"_5a2wtz5",range_end:"_5a2wtz6",range_middle:"_5a2wtz7"};exports.CALENDAR_DAY_BUTTON_STYLES=e;
+//# sourceMappingURL=calendarDayButton.css.cjs.map

package/dist/components/forms/calendar/styles/calendarDayButton.css.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"calendarDayButton.css.cjs","sources":[],"sourcesContent":[],"names":[],"mappings":""}

package/dist/components/forms/calendar/styles/calendarDayButton.css.d.ts

@@ -0,0 +1,11 @@
+export declare const CALENDAR_DAY_BUTTON_STYLES: {
+    day_button: string;
+    /** Modifier classes injected by react-day-picker as <td> class names — styled via globalStyle below */
+    selected: string;
+    today: string;
+    outside: string;
+    disabled: string;
+    range_start: string;
+    range_end: string;
+    range_middle: string;
+};

package/dist/components/forms/calendar/styles/calendarDayButton.css.js

@@ -0,0 +1,7 @@
+/* empty css                                            */
+/* empty css                                     */
+var _ = { day_button: "_5a2wtz0", selected: "_5a2wtz1", today: "_5a2wtz2", outside: "_5a2wtz3", disabled: "_5a2wtz4", range_start: "_5a2wtz5", range_end: "_5a2wtz6", range_middle: "_5a2wtz7" };
+export {
+  _ as CALENDAR_DAY_BUTTON_STYLES
+};
+//# sourceMappingURL=calendarDayButton.css.js.map

package/dist/components/forms/calendar/styles/calendarDayButton.css.js.map

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

package/dist/components/forms/calendar/styles/calendarGrid.css.cjs

@@ -0,0 +1,2 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});;/* empty css                                              */;/* empty css                                  */var e={month_grid:"_1oxky4c0",weekdays:"_1oxky4c1",weekday:"_1oxky4c2",week:"_1oxky4c3",day:"_1oxky4c4"};exports.CALENDAR_GRID_STYLES=e;
+//# sourceMappingURL=calendarGrid.css.cjs.map

package/dist/components/forms/calendar/styles/calendarGrid.css.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"calendarGrid.css.cjs","sources":[],"sourcesContent":[],"names":[],"mappings":""}

package/dist/components/forms/calendar/styles/calendarGrid.css.d.ts

@@ -0,0 +1,7 @@
+export declare const CALENDAR_GRID_STYLES: {
+    month_grid: string;
+    weekdays: string;
+    weekday: string;
+    week: string;
+    day: string;
+};

package/dist/components/forms/calendar/styles/calendarGrid.css.js

@@ -0,0 +1,7 @@
+/* empty css                                            */
+/* empty css                                */
+var y = { month_grid: "_1oxky4c0", weekdays: "_1oxky4c1", weekday: "_1oxky4c2", week: "_1oxky4c3", day: "_1oxky4c4" };
+export {
+  y as CALENDAR_GRID_STYLES
+};
+//# sourceMappingURL=calendarGrid.css.js.map

package/dist/components/forms/calendar/styles/calendarGrid.css.js.map

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

package/dist/components/forms/calendar/styles/calendarRoot.css.cjs

@@ -0,0 +1,2 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});;/* empty css                                              */;/* empty css                                  */var r={root:"irxxrw0",months:"irxxrw1",month:"irxxrw2",calendarContent:"irxxrw3",hiddenCaption:"irxxrw4"};exports.CALENDAR_ROOT_STYLES=r;
+//# sourceMappingURL=calendarRoot.css.cjs.map

package/dist/components/forms/calendar/styles/calendarRoot.css.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"calendarRoot.css.cjs","sources":[],"sourcesContent":[],"names":[],"mappings":""}

package/dist/components/forms/calendar/styles/calendarRoot.css.d.ts

@@ -0,0 +1,8 @@
+export declare const CALENDAR_ROOT_STYLES: {
+    root: string;
+    months: string;
+    month: string;
+    calendarContent: string;
+    /** Hides the DayPicker-internal caption row since we render our own above. */
+    hiddenCaption: string;
+};

package/dist/components/forms/calendar/styles/calendarRoot.css.js

@@ -0,0 +1,7 @@
+/* empty css                                            */
+/* empty css                                */
+var i = { root: "irxxrw0", months: "irxxrw1", month: "irxxrw2", calendarContent: "irxxrw3", hiddenCaption: "irxxrw4" };
+export {
+  i as CALENDAR_ROOT_STYLES
+};
+//# sourceMappingURL=calendarRoot.css.js.map

package/dist/components/forms/calendar/styles/calendarRoot.css.js.map

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

package/dist/components/forms/calendar/types/Calendar.props.d.ts

@@ -0,0 +1,20 @@
+import { DayPickerProps } from 'react-day-picker';
+import { CalendarCaptionLabels } from '../components/calendar-caption/types/CalendarCaption.props.ts';
+export type CalendarProps = DayPickerProps & {
+    /** Additional CSS class applied to the root element. */
+    className?: string;
+    /**
+     * Convenience shorthand for `startMonth`.
+     * Sets the earliest year selectable in the dropdowns.
+     * Defaults to 100 years before the current year.
+     */
+    startYear?: number;
+    /**
+     * Convenience shorthand for `endMonth`.
+     * Sets the latest year selectable in the dropdowns.
+     * Defaults to 10 years after the current year.
+     */
+    endYear?: number;
+    /** Localized labels for the caption navigation buttons. */
+    captionLabels?: CalendarCaptionLabels;
+};

package/dist/components/forms/calendar/utils/decadeStart.utils.cjs

@@ -0,0 +1,2 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("../constants/index.cjs"),r=t=>Math.floor(t/e.YEARS_PER_PAGE)*e.YEARS_PER_PAGE;exports.getDecadeStart=r;
+//# sourceMappingURL=decadeStart.utils.cjs.map

package/dist/components/forms/calendar/utils/decadeStart.utils.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"decadeStart.utils.cjs","sources":["../../../../../src/components/forms/calendar/utils/decadeStart.utils.ts"],"sourcesContent":["import { YEARS_PER_PAGE } from '@components/forms/calendar/constants'\r\n\r\nexport const getDecadeStart = (year: number): number =>\r\n    Math.floor(year / YEARS_PER_PAGE) * YEARS_PER_PAGE\r\n"],"names":["getDecadeStart","year","YEARS_PER_PAGE"],"mappings":"0HAEaA,EAAkBC,GAC3B,KAAK,MAAMA,EAAOC,EAAAA,cAAc,EAAIA,EAAAA"}

package/dist/components/forms/calendar/utils/decadeStart.utils.d.ts

@@ -0,0 +1 @@
+export declare const getDecadeStart: (year: number) => number;

package/dist/components/forms/calendar/utils/decadeStart.utils.js

@@ -0,0 +1,6 @@
+import { YEARS_PER_PAGE as t } from "../constants/index.js";
+const e = (o) => Math.floor(o / t) * t;
+export {
+  e as getDecadeStart
+};
+//# sourceMappingURL=decadeStart.utils.js.map

package/dist/components/forms/calendar/utils/decadeStart.utils.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"decadeStart.utils.js","sources":["../../../../../src/components/forms/calendar/utils/decadeStart.utils.ts"],"sourcesContent":["import { YEARS_PER_PAGE } from '@components/forms/calendar/constants'\r\n\r\nexport const getDecadeStart = (year: number): number =>\r\n    Math.floor(year / YEARS_PER_PAGE) * YEARS_PER_PAGE\r\n"],"names":["getDecadeStart","year","YEARS_PER_PAGE"],"mappings":";AAEO,MAAMA,IAAiB,CAACC,MAC3B,KAAK,MAAMA,IAAOC,CAAc,IAAIA;"}

package/dist/components/forms/checkbox/Checkbox.cjs

@@ -0,0 +1,2 @@
+"use strict";const e=require("react/jsx-runtime"),o=require("@base-ui/react/checkbox"),n=require("react"),h=require("../../foundation/icon/Icon.cjs");require("../../foundation/icon/styles/Icon.css.cjs");const l=require("../../../constants/icons.cjs"),q=require("../../foundation/typography/Typography.cjs");require("../../foundation/typography/styles/Typography.css.cjs");const C=require("../../layout/flex/Flex.cjs");require("../../layout/flex/styles/Flex.css.cjs");const m=require("../../../utils/cn.cjs"),c=require("./styles/Checkbox.css.cjs"),i=n.memo(({label:r,id:t,className:a,onCheckedChange:u,...x})=>{const d=n.useId(),s=t??(r?d:void 0);return e.jsxs(C,{as:"span",inline:!0,gap:"sm",children:[e.jsx(o.Checkbox.Root,{id:s,className:m.cn(c.CHECKBOX_STYLES.root,a),onCheckedChange:u,...x,children:e.jsx(o.Checkbox.Indicator,{className:c.CHECKBOX_STYLES.indicator,children:e.jsx(h,{icon:l.IconRegistry.check,size:"xs"})})}),r&&e.jsx(q,{as:"label",variant:"label",color:"foreground",htmlFor:s,className:c.CHECKBOX_STYLES.label,children:r})]})});i.displayName="Checkbox";module.exports=i;
+//# sourceMappingURL=Checkbox.cjs.map

package/dist/components/forms/checkbox/Checkbox.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"Checkbox.cjs","sources":["../../../../src/components/forms/checkbox/Checkbox.tsx"],"sourcesContent":["import { Checkbox as BaseCheckbox } from '@base-ui/react/checkbox'\r\nimport { memo, useId, type FC } from 'react'\r\n\r\nimport { Icon } from '@components/foundation/icon'\r\nimport { IconRegistry } from '@constants/icons'\r\nimport { Typography } from '@components/foundation/typography'\r\nimport { Flex } from '@components/layout/flex'\r\nimport { cn } from '@utils/cn.ts'\r\nimport { CHECKBOX_STYLES } from '@components/forms/checkbox/styles/Checkbox.css.ts'\r\nimport type { CheckboxProps } from '@components/forms/checkbox/types/Checkbox.props.ts'\r\n\r\n/**\r\n  * A styled checkbox control built on top of `@base-ui/react/checkbox`.\r\n  *\r\n  * Supports controlled (`checked` + `onCheckedChange`) and uncontrolled\r\n  * (`defaultChecked`) modes, plus an optional inline `label`.\r\n  *\r\n  * @example\r\n  * ```tsx\r\n  * <Checkbox label=\"Accept terms\" checked={accepted} onCheckedChange={setAccepted} />\r\n  * ```\r\n  */\r\nconst Checkbox: FC<CheckboxProps> = memo(({ label, id, className, onCheckedChange, ...props }) => {\r\n    const generatedId = useId()\r\n    const checkboxId = id ?? (label ? generatedId : undefined)\r\n\r\n    return (\r\n        <Flex\r\n            as={'span'}\r\n            inline\r\n            gap={'sm'}\r\n        >\r\n            <BaseCheckbox.Root\r\n                id={checkboxId}\r\n                className={cn(CHECKBOX_STYLES.root, className)}\r\n                onCheckedChange={onCheckedChange}\r\n                {...props}\r\n            >\r\n                <BaseCheckbox.Indicator className={CHECKBOX_STYLES.indicator}>\r\n                    <Icon\r\n                        icon={IconRegistry.check}\r\n                        size={'xs'}\r\n                    />\r\n                </BaseCheckbox.Indicator>\r\n            </BaseCheckbox.Root>\r\n\r\n            {label && (\r\n                <Typography\r\n                    as={'label'}\r\n                    variant={'label'}\r\n                    color={'foreground'}\r\n                    htmlFor={checkboxId}\r\n                    className={CHECKBOX_STYLES.label}\r\n                >\r\n                    {label}\r\n                </Typography>\r\n            )}\r\n        </Flex>\r\n    )\r\n})\r\n\r\nCheckbox.displayName = 'Checkbox'\r\n\r\nexport default Checkbox\r\n"],"names":["Checkbox","memo","label","id","className","onCheckedChange","props","generatedId","useId","checkboxId","jsxs","Flex","jsx","BaseCheckbox","cn","CHECKBOX_STYLES","Icon","IconRegistry","Typography"],"mappings":"miBAsBMA,EAA8BC,EAAAA,KAAK,CAAC,CAAE,MAAAC,EAAO,GAAAC,EAAI,UAAAC,EAAW,gBAAAC,EAAiB,GAAGC,KAAY,CAC9F,MAAMC,EAAcC,EAAAA,MAAA,EACdC,EAAaN,IAAOD,EAAQK,EAAc,QAEhD,OACIG,EAAAA,KAACC,EAAA,CACG,GAAI,OACJ,OAAM,GACN,IAAK,KAEL,SAAA,CAAAC,EAAAA,IAACC,EAAAA,SAAa,KAAb,CACG,GAAIJ,EACJ,UAAWK,EAAAA,GAAGC,kBAAgB,KAAMX,CAAS,EAC7C,gBAAAC,EACC,GAAGC,EAEJ,eAACO,EAAAA,SAAa,UAAb,CAAuB,UAAWE,EAAAA,gBAAgB,UAC/C,SAAAH,EAAAA,IAACI,EAAA,CACG,KAAMC,EAAAA,aAAa,MACnB,KAAM,IAAA,CAAA,CACV,CACJ,CAAA,CAAA,EAGHf,GACGU,EAAAA,IAACM,EAAA,CACG,GAAI,QACJ,QAAS,QACT,MAAO,aACP,QAAST,EACT,UAAWM,EAAAA,gBAAgB,MAE1B,SAAAb,CAAA,CAAA,CACL,CAAA,CAAA,CAIhB,CAAC,EAEDF,EAAS,YAAc"}

package/dist/components/forms/checkbox/Checkbox.d.ts

@@ -0,0 +1,15 @@
+import { FC } from 'react';
+import { CheckboxProps } from './types/Checkbox.props.ts';
+/**
+  * A styled checkbox control built on top of `@base-ui/react/checkbox`.
+  *
+  * Supports controlled (`checked` + `onCheckedChange`) and uncontrolled
+  * (`defaultChecked`) modes, plus an optional inline `label`.
+  *
+  * @example
+  * ```tsx
+  * <Checkbox label="Accept terms" checked={accepted} onCheckedChange={setAccepted} />
+  * ```
+  */
+declare const Checkbox: FC<CheckboxProps>;
+export default Checkbox;

package/dist/components/forms/checkbox/Checkbox.js

@@ -0,0 +1,57 @@
+import { jsxs as p, jsx as o } from "react/jsx-runtime";
+import { Checkbox as i } from "@base-ui/react/checkbox";
+import { memo as d, useId as l } from "react";
+import h from "../../foundation/icon/Icon.js";
+import "../../foundation/icon/styles/Icon.css.js";
+import { IconRegistry as f } from "../../../constants/icons.js";
+import x from "../../foundation/typography/Typography.js";
+import "../../foundation/typography/styles/Typography.css.js";
+import b from "../../layout/flex/Flex.js";
+import "../../layout/flex/styles/Flex.css.js";
+import { cn as k } from "../../../utils/cn.js";
+import { CHECKBOX_STYLES as e } from "./styles/Checkbox.css.js";
+const C = d(({ label: r, id: t, className: c, onCheckedChange: s, ...a }) => {
+  const n = l(), m = t ?? (r ? n : void 0);
+  return /* @__PURE__ */ p(
+    b,
+    {
+      as: "span",
+      inline: !0,
+      gap: "sm",
+      children: [
+        /* @__PURE__ */ o(
+          i.Root,
+          {
+            id: m,
+            className: k(e.root, c),
+            onCheckedChange: s,
+            ...a,
+            children: /* @__PURE__ */ o(i.Indicator, { className: e.indicator, children: /* @__PURE__ */ o(
+              h,
+              {
+                icon: f.check,
+                size: "xs"
+              }
+            ) })
+          }
+        ),
+        r && /* @__PURE__ */ o(
+          x,
+          {
+            as: "label",
+            variant: "label",
+            color: "foreground",
+            htmlFor: m,
+            className: e.label,
+            children: r
+          }
+        )
+      ]
+    }
+  );
+});
+C.displayName = "Checkbox";
+export {
+  C as default
+};
+//# sourceMappingURL=Checkbox.js.map

package/dist/components/forms/checkbox/Checkbox.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Checkbox.js","sources":["../../../../src/components/forms/checkbox/Checkbox.tsx"],"sourcesContent":["import { Checkbox as BaseCheckbox } from '@base-ui/react/checkbox'\r\nimport { memo, useId, type FC } from 'react'\r\n\r\nimport { Icon } from '@components/foundation/icon'\r\nimport { IconRegistry } from '@constants/icons'\r\nimport { Typography } from '@components/foundation/typography'\r\nimport { Flex } from '@components/layout/flex'\r\nimport { cn } from '@utils/cn.ts'\r\nimport { CHECKBOX_STYLES } from '@components/forms/checkbox/styles/Checkbox.css.ts'\r\nimport type { CheckboxProps } from '@components/forms/checkbox/types/Checkbox.props.ts'\r\n\r\n/**\r\n  * A styled checkbox control built on top of `@base-ui/react/checkbox`.\r\n  *\r\n  * Supports controlled (`checked` + `onCheckedChange`) and uncontrolled\r\n  * (`defaultChecked`) modes, plus an optional inline `label`.\r\n  *\r\n  * @example\r\n  * ```tsx\r\n  * <Checkbox label=\"Accept terms\" checked={accepted} onCheckedChange={setAccepted} />\r\n  * ```\r\n  */\r\nconst Checkbox: FC<CheckboxProps> = memo(({ label, id, className, onCheckedChange, ...props }) => {\r\n    const generatedId = useId()\r\n    const checkboxId = id ?? (label ? generatedId : undefined)\r\n\r\n    return (\r\n        <Flex\r\n            as={'span'}\r\n            inline\r\n            gap={'sm'}\r\n        >\r\n            <BaseCheckbox.Root\r\n                id={checkboxId}\r\n                className={cn(CHECKBOX_STYLES.root, className)}\r\n                onCheckedChange={onCheckedChange}\r\n                {...props}\r\n            >\r\n                <BaseCheckbox.Indicator className={CHECKBOX_STYLES.indicator}>\r\n                    <Icon\r\n                        icon={IconRegistry.check}\r\n                        size={'xs'}\r\n                    />\r\n                </BaseCheckbox.Indicator>\r\n            </BaseCheckbox.Root>\r\n\r\n            {label && (\r\n                <Typography\r\n                    as={'label'}\r\n                    variant={'label'}\r\n                    color={'foreground'}\r\n                    htmlFor={checkboxId}\r\n                    className={CHECKBOX_STYLES.label}\r\n                >\r\n                    {label}\r\n                </Typography>\r\n            )}\r\n        </Flex>\r\n    )\r\n})\r\n\r\nCheckbox.displayName = 'Checkbox'\r\n\r\nexport default Checkbox\r\n"],"names":["Checkbox","memo","label","id","className","onCheckedChange","props","generatedId","useId","checkboxId","jsxs","Flex","jsx","BaseCheckbox","cn","CHECKBOX_STYLES","Icon","IconRegistry","Typography"],"mappings":";;;;;;;;;;;;AAsBA,MAAMA,IAA8BC,EAAK,CAAC,EAAE,OAAAC,GAAO,IAAAC,GAAI,WAAAC,GAAW,iBAAAC,GAAiB,GAAGC,QAAY;AAC9F,QAAMC,IAAcC,EAAA,GACdC,IAAaN,MAAOD,IAAQK,IAAc;AAEhD,SACI,gBAAAG;AAAA,IAACC;AAAA,IAAA;AAAA,MACG,IAAI;AAAA,MACJ,QAAM;AAAA,MACN,KAAK;AAAA,MAEL,UAAA;AAAA,QAAA,gBAAAC;AAAA,UAACC,EAAa;AAAA,UAAb;AAAA,YACG,IAAIJ;AAAA,YACJ,WAAWK,EAAGC,EAAgB,MAAMX,CAAS;AAAA,YAC7C,iBAAAC;AAAA,YACC,GAAGC;AAAA,YAEJ,4BAACO,EAAa,WAAb,EAAuB,WAAWE,EAAgB,WAC/C,UAAA,gBAAAH;AAAA,cAACI;AAAA,cAAA;AAAA,gBACG,MAAMC,EAAa;AAAA,gBACnB,MAAM;AAAA,cAAA;AAAA,YAAA,EACV,CACJ;AAAA,UAAA;AAAA,QAAA;AAAA,QAGHf,KACG,gBAAAU;AAAA,UAACM;AAAA,UAAA;AAAA,YACG,IAAI;AAAA,YACJ,SAAS;AAAA,YACT,OAAO;AAAA,YACP,SAAST;AAAA,YACT,WAAWM,EAAgB;AAAA,YAE1B,UAAAb;AAAA,UAAA;AAAA,QAAA;AAAA,MACL;AAAA,IAAA;AAAA,EAAA;AAIhB,CAAC;AAEDF,EAAS,cAAc;"}

package/dist/components/forms/checkbox/index.d.ts

@@ -0,0 +1,3 @@
+export { default as Checkbox } from './Checkbox.tsx';
+export { CHECKBOX_STYLES } from './styles/Checkbox.css.ts';
+export type { CheckboxProps } from './types/Checkbox.props.ts';

package/dist/components/forms/checkbox/styles/Checkbox.css.cjs

@@ -0,0 +1,2 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});;/* empty css                                              */;/* empty css                              */var e={root:"_1v8fbad0",indicator:"_1v8fbad1",label:"_1v8fbad2"};exports.CHECKBOX_STYLES=e;
+//# sourceMappingURL=Checkbox.css.cjs.map

package/dist/components/forms/checkbox/styles/Checkbox.css.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"Checkbox.css.cjs","sources":[],"sourcesContent":[],"names":[],"mappings":""}

package/dist/components/forms/checkbox/styles/Checkbox.css.d.ts

@@ -0,0 +1,24 @@
+/**
+ * Root element — the visible box (applied on `Checkbox.Root`, a `<button>`).
+ *
+ * Dual-context design:
+ *  - **Standalone** (`Checkbox` component): `data-state` / `data-disabled` live
+ *    on this element itself → self-selectors `&[...]` apply.
+ *  - **Dropdown** (`DropdownMenuCheckboxItem`): this class is re-used on the
+ *    `<span>` indicator inside the item. The parent item carries `data-state` /
+ *    `data-highlighted` / `data-disabled` → ancestor selectors `[...] &` apply.
+ *
+ * Both selector sets coexist without conflict:
+ *  - In standalone context the span/button is `data-state` itself → only `&[...]`.
+ *  - In dropdown context the span never has `data-state` → only `[...] &`.
+ */
+export declare const CHECKBOX_STYLES: {
+    root: string;
+    /**
+     * Indicator slot — keeps the check icon centred.
+     * `color: inherit` picks up the `primaryForeground` set on the root when checked.
+     */
+    indicator: string;
+    /** Typography label associated with the checkbox control. */
+    label: string;
+};

package/dist/components/forms/checkbox/styles/Checkbox.css.js

@@ -0,0 +1,7 @@
+/* empty css                                            */
+/* empty css                            */
+var r = { root: "_1v8fbad0", indicator: "_1v8fbad1", label: "_1v8fbad2" };
+export {
+  r as CHECKBOX_STYLES
+};
+//# sourceMappingURL=Checkbox.css.js.map

package/dist/components/forms/checkbox/styles/Checkbox.css.js.map

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

package/dist/components/forms/checkbox/types/Checkbox.props.d.ts

@@ -0,0 +1,5 @@
+import { Checkbox } from '@base-ui/react/checkbox';
+export type CheckboxProps = Checkbox.Root.Props & {
+    /** Optional text label rendered beside the checkbox. When provided, `id` is used to associate the label. */
+    label?: string;
+};

package/dist/components/forms/date-picker/DatePicker.cjs

@@ -0,0 +1,2 @@
+"use strict";const e=require("react/jsx-runtime"),R=require("../calendar/Calendar.cjs");;/* empty css                                           */;/* empty css                                                   */;/* empty css                                                                                  */;/* empty css                                                   */;/* empty css                                                        */;/* empty css                                                                                       */;/* empty css                                                                                     */const w=require("../text-field/TextField.cjs");require("../text-field/styles/TextField.css.cjs");;/* empty css                                               */;/* empty css                                                                                   */;/* empty css                                                                                            */;/* empty css                                                                                            */const u=require("../../overlay/popover/Popover.cjs");;/* empty css                                                             */;/* empty css                                                              */;/* empty css                                                                      */;/* empty css                                                                   */;/* empty css                                                                    */;/* empty css                                                                 */;/* empty css                                                                  */;/* empty css                                                                    */;/* empty css                                                                     */;/* empty css                                                                   */;/* empty css                                                                    */;/* empty css                                                                    */;/* empty css                                                                                  */const K=require("../../actions/icon-button/IconButton.cjs");require("../../actions/icon-button/styles/IconButton.css.cjs");const M=require("./hooks/useDatePicker.hook.cjs"),s=require("./styles/DatePicker.css.cjs"),A=require("../../../constants/icons.cjs"),d=require("../../../utils/cn.cjs"),r=require("react"),p=r.memo(({value:h,defaultValue:D,onChange:m,calendarProps:C,id:b,disabled:n,"aria-label":g,"aria-labelledby":x,calendarAriaLabel:y="Calendar",onKeyDown:l,...o})=>{const{selectedDate:i,inputValue:E,open:t,inputId:P,handleInputChange:f,handleInputKeyDown:c,handleCalendarSelect:k,setOpen:I}=M.useDatePicker({value:h,defaultValue:D,onChange:m,id:b}),q=r.useRef(null),S=r.useMemo(()=>i??new Date,[i]),T=r.useCallback(a=>{c(a),l?.(a)},[c,l]),_=r.useCallback(a=>{a.preventDefault()},[]),{className:j,...N}=C??{};return e.jsxs(u,{open:t,onOpenChange:I,children:[e.jsx(w,{...o,ref:q,id:P,type:"date",disabled:n,value:E,onChange:f,onKeyDown:T,className:d.cn(s.DATE_PICKER_STYLES.input,o.className),"aria-label":g,"aria-labelledby":x,"aria-haspopup":"dialog","aria-expanded":t,endAction:e.jsx(u.Trigger,{children:e.jsx(K,{icon:A.IconRegistry.calendar,"aria-label":"Open calendar",variant:"ghost",color:"primary",size:"sm",type:"button",disabled:n,onMouseDown:_})})}),e.jsx(u.Content,{side:"bottom",align:"end",className:s.DATE_PICKER_STYLES.content,"aria-label":y,initialFocus:!1,finalFocus:q,children:e.jsx(R,{mode:"single",selected:i,onSelect:k,disabled:n,className:d.cn(s.DATE_PICKER_STYLES.calendar,j),...N,defaultMonth:S,autoFocus:t})})]})});p.displayName="DatePicker";module.exports=p;
+//# sourceMappingURL=DatePicker.cjs.map

package/dist/components/forms/date-picker/DatePicker.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"DatePicker.cjs","sources":["../../../../src/components/forms/date-picker/DatePicker.tsx"],"sourcesContent":["import { Calendar } from '@components/forms/calendar'\r\nimport { TextField } from '@components/forms/text-field'\r\nimport { Popover } from '@components/overlay/popover'\r\nimport { IconButton } from '@components/actions/icon-button'\r\nimport { useDatePicker } from '@components/forms/date-picker/hooks/useDatePicker.hook.ts'\r\nimport { DATE_PICKER_STYLES } from '@components/forms/date-picker/styles/DatePicker.css.ts'\r\nimport { IconRegistry } from '@constants/icons'\r\nimport { cn } from '@utils/cn.ts'\r\nimport type { DatePickerProps } from '@components/forms/date-picker/types/DatePicker.props.ts'\r\nimport { memo, useCallback, useMemo, useRef } from 'react'\r\n\r\n/**\r\n * A date picker that combines a native `type=\"date\"` text field with a\r\n * calendar popover.\r\n *\r\n * - Typing a valid `YYYY-MM-DD` date updates the calendar and calls `onChange`.\r\n * - Selecting a day in the calendar updates the input and closes the popover.\r\n * - Invalid or incomplete typed values are kept in the input but do not update\r\n *   the selected date until they become valid.\r\n * - Opening the popover focuses the selected day (or today), and closing it\r\n *   returns focus to the input.\r\n *\r\n * @example\r\n * ```tsx\r\n * const [date, setDate] = useState<Date | undefined>()\r\n * <DatePicker label=\"Pick a date\" value={date} onChange={setDate} />\r\n * ```\r\n */\r\nconst DatePicker = memo(\r\n    ({\r\n        value,\r\n        defaultValue,\r\n        onChange,\r\n        calendarProps,\r\n        id,\r\n        disabled,\r\n        'aria-label': ariaLabel,\r\n        'aria-labelledby': ariaLabelledBy,\r\n        calendarAriaLabel = 'Calendar',\r\n        onKeyDown,\r\n        ...textFieldProps\r\n    }: DatePickerProps) => {\r\n        const {\r\n            selectedDate,\r\n            inputValue,\r\n            open,\r\n            inputId,\r\n            handleInputChange,\r\n            handleInputKeyDown,\r\n            handleCalendarSelect,\r\n            setOpen,\r\n        } = useDatePicker({ value, defaultValue, onChange, id })\r\n\r\n        const inputRef = useRef<HTMLInputElement>(null)\r\n        const calendarDefaultMonth = useMemo(\r\n            () => selectedDate ?? new Date(),\r\n            [selectedDate],\r\n        )\r\n\r\n        const handleKeyDown = useCallback(\r\n            (event: React.KeyboardEvent<HTMLInputElement>) => {\r\n                handleInputKeyDown(event)\r\n                onKeyDown?.(event)\r\n            },\r\n            [handleInputKeyDown, onKeyDown],\r\n        )\r\n\r\n        const handleCalendarButtonMouseDown = useCallback(\r\n            (event: React.MouseEvent<HTMLButtonElement>) => {\r\n                event.preventDefault()\r\n            },\r\n            [],\r\n        )\r\n\r\n        const { className: calendarClassName, ...restCalendarProps } =\r\n            calendarProps ?? {}\r\n\r\n        return (\r\n            <Popover\r\n                open={open}\r\n                onOpenChange={setOpen}\r\n            >\r\n                <TextField\r\n                    {...textFieldProps}\r\n                    ref={inputRef}\r\n                    id={inputId}\r\n                    type={'date'}\r\n                    disabled={disabled}\r\n                    value={inputValue}\r\n                    onChange={handleInputChange}\r\n                    onKeyDown={handleKeyDown}\r\n                    className={cn(DATE_PICKER_STYLES.input, textFieldProps.className)}\r\n                    aria-label={ariaLabel}\r\n                    aria-labelledby={ariaLabelledBy}\r\n                    aria-haspopup={'dialog'}\r\n                    aria-expanded={open}\r\n                    endAction={\r\n                        <Popover.Trigger>\r\n                            <IconButton\r\n                                icon={IconRegistry.calendar}\r\n                                aria-label={'Open calendar'}\r\n                                variant={'ghost'}\r\n                                color={'primary'}\r\n                                size={'sm'}\r\n                                type={'button'}\r\n                                disabled={disabled}\r\n                                onMouseDown={handleCalendarButtonMouseDown}\r\n                            />\r\n                        </Popover.Trigger>\r\n                    }\r\n                />\r\n\r\n                <Popover.Content\r\n                    side={'bottom'}\r\n                    align={'end'}\r\n                    className={DATE_PICKER_STYLES.content}\r\n                    aria-label={calendarAriaLabel}\r\n                    initialFocus={false}\r\n                    finalFocus={inputRef}\r\n                >\r\n                    <Calendar\r\n                        mode={'single'}\r\n                        selected={selectedDate}\r\n                        onSelect={handleCalendarSelect}\r\n                        disabled={disabled}\r\n                        className={cn(DATE_PICKER_STYLES.calendar, calendarClassName)}\r\n                        {...restCalendarProps}\r\n                        defaultMonth={calendarDefaultMonth}\r\n                        autoFocus={open}\r\n                    />\r\n                </Popover.Content>\r\n            </Popover>\r\n        )\r\n    },\r\n)\r\n\r\nDatePicker.displayName = 'DatePicker'\r\n\r\nexport default DatePicker\r\n"],"names":["DatePicker","memo","value","defaultValue","onChange","calendarProps","id","disabled","ariaLabel","ariaLabelledBy","calendarAriaLabel","onKeyDown","textFieldProps","selectedDate","inputValue","open","inputId","handleInputChange","handleInputKeyDown","handleCalendarSelect","setOpen","useDatePicker","inputRef","useRef","calendarDefaultMonth","useMemo","handleKeyDown","useCallback","event","handleCalendarButtonMouseDown","calendarClassName","restCalendarProps","jsxs","Popover","jsx","TextField","cn","DATE_PICKER_STYLES","IconButton","IconRegistry","Calendar"],"mappings":"8/EA4BMA,EAAaC,EAAAA,KACf,CAAC,CACG,MAAAC,EACA,aAAAC,EACA,SAAAC,EACA,cAAAC,EACA,GAAAC,EACA,SAAAC,EACA,aAAcC,EACd,kBAAmBC,EACnB,kBAAAC,EAAoB,WACpB,UAAAC,EACA,GAAGC,CAAA,IACgB,CACnB,KAAM,CACF,aAAAC,EACA,WAAAC,EACA,KAAAC,EACA,QAAAC,EACA,kBAAAC,EACA,mBAAAC,EACA,qBAAAC,EACA,QAAAC,CAAA,EACAC,EAAAA,cAAc,CAAE,MAAAnB,EAAO,aAAAC,EAAc,SAAAC,EAAU,GAAAE,EAAI,EAEjDgB,EAAWC,EAAAA,OAAyB,IAAI,EACxCC,EAAuBC,EAAAA,QACzB,IAAMZ,GAAgB,IAAI,KAC1B,CAACA,CAAY,CAAA,EAGXa,EAAgBC,EAAAA,YACjBC,GAAiD,CAC9CV,EAAmBU,CAAK,EACxBjB,IAAYiB,CAAK,CACrB,EACA,CAACV,EAAoBP,CAAS,CAAA,EAG5BkB,EAAgCF,EAAAA,YACjCC,GAA+C,CAC5CA,EAAM,eAAA,CACV,EACA,CAAA,CAAC,EAGC,CAAE,UAAWE,EAAmB,GAAGC,CAAA,EACrC1B,GAAiB,CAAA,EAErB,OACI2B,EAAAA,KAACC,EAAA,CACG,KAAAlB,EACA,aAAcK,EAEd,SAAA,CAAAc,EAAAA,IAACC,EAAA,CACI,GAAGvB,EACJ,IAAKU,EACL,GAAIN,EACJ,KAAM,OACN,SAAAT,EACA,MAAOO,EACP,SAAUG,EACV,UAAWS,EACX,UAAWU,EAAAA,GAAGC,EAAAA,mBAAmB,MAAOzB,EAAe,SAAS,EAChE,aAAYJ,EACZ,kBAAiBC,EACjB,gBAAe,SACf,gBAAeM,EACf,UACImB,EAAAA,IAACD,EAAQ,QAAR,CACG,SAAAC,EAAAA,IAACI,EAAA,CACG,KAAMC,EAAAA,aAAa,SACnB,aAAY,gBACZ,QAAS,QACT,MAAO,UACP,KAAM,KACN,KAAM,SACN,SAAAhC,EACA,YAAasB,CAAA,CAAA,CACjB,CACJ,CAAA,CAAA,EAIRK,EAAAA,IAACD,EAAQ,QAAR,CACG,KAAM,SACN,MAAO,MACP,UAAWI,EAAAA,mBAAmB,QAC9B,aAAY3B,EACZ,aAAc,GACd,WAAYY,EAEZ,SAAAY,EAAAA,IAACM,EAAA,CACG,KAAM,SACN,SAAU3B,EACV,SAAUM,EACV,SAAAZ,EACA,UAAW6B,EAAAA,GAAGC,qBAAmB,SAAUP,CAAiB,EAC3D,GAAGC,EACJ,aAAcP,EACd,UAAWT,CAAA,CAAA,CACf,CAAA,CACJ,CAAA,CAAA,CAGZ,CACJ,EAEAf,EAAW,YAAc"}

package/dist/components/forms/date-picker/DatePicker.d.ts

@@ -0,0 +1,21 @@
+import { DatePickerProps } from './types/DatePicker.props.ts';
+import { MemoExoticComponent } from 'react';
+/**
+ * A date picker that combines a native `type="date"` text field with a
+ * calendar popover.
+ *
+ * - Typing a valid `YYYY-MM-DD` date updates the calendar and calls `onChange`.
+ * - Selecting a day in the calendar updates the input and closes the popover.
+ * - Invalid or incomplete typed values are kept in the input but do not update
+ *   the selected date until they become valid.
+ * - Opening the popover focuses the selected day (or today), and closing it
+ *   returns focus to the input.
+ *
+ * @example
+ * ```tsx
+ * const [date, setDate] = useState<Date | undefined>()
+ * <DatePicker label="Pick a date" value={date} onChange={setDate} />
+ * ```
+ */
+declare const DatePicker: MemoExoticComponent<({ value, defaultValue, onChange, calendarProps, id, disabled, "aria-label": ariaLabel, "aria-labelledby": ariaLabelledBy, calendarAriaLabel, onKeyDown, ...textFieldProps }: DatePickerProps) => import("react").JSX.Element>;
+export default DatePicker;

package/dist/components/forms/date-picker/DatePicker.js

@@ -0,0 +1,144 @@
+import { jsxs as v, jsx as e } from "react/jsx-runtime";
+import E from "../calendar/Calendar.js";
+/* empty css                                         */
+/* empty css                                                 */
+/* empty css                                                                                */
+/* empty css                                                 */
+/* empty css                                                      */
+/* empty css                                                                                     */
+/* empty css                                                                                   */
+import F from "../text-field/TextField.js";
+import "../text-field/styles/TextField.css.js";
+/* empty css                                             */
+/* empty css                                                                                 */
+/* empty css                                                                                          */
+/* empty css                                                                                          */
+import n from "../../overlay/popover/Popover.js";
+/* empty css                                                           */
+/* empty css                                                            */
+/* empty css                                                                    */
+/* empty css                                                                 */
+/* empty css                                                                  */
+/* empty css                                                               */
+/* empty css                                                                */
+/* empty css                                                                  */
+/* empty css                                                                   */
+/* empty css                                                                 */
+/* empty css                                                                  */
+/* empty css                                                                  */
+/* empty css                                                                                */
+import K from "../../actions/icon-button/IconButton.js";
+import "../../actions/icon-button/styles/IconButton.css.js";
+import { useDatePicker as O } from "./hooks/useDatePicker.hook.js";
+import { DATE_PICKER_STYLES as i } from "./styles/DatePicker.css.js";
+import { IconRegistry as j } from "../../../constants/icons.js";
+import { cn as c } from "../../../utils/cn.js";
+import { memo as A, useRef as B, useMemo as _, useCallback as d } from "react";
+const z = A(
+  ({
+    value: u,
+    defaultValue: f,
+    onChange: h,
+    calendarProps: C,
+    id: D,
+    disabled: a,
+    "aria-label": g,
+    "aria-labelledby": b,
+    calendarAriaLabel: y = "Calendar",
+    onKeyDown: m,
+    ...l
+  }) => {
+    const {
+      selectedDate: t,
+      inputValue: N,
+      open: r,
+      inputId: I,
+      handleInputChange: w,
+      handleInputKeyDown: p,
+      handleCalendarSelect: M,
+      setOpen: P
+    } = O({ value: u, defaultValue: f, onChange: h, id: D }), s = B(null), k = _(
+      () => t ?? /* @__PURE__ */ new Date(),
+      [t]
+    ), x = d(
+      (o) => {
+        p(o), m?.(o);
+      },
+      [p, m]
+    ), R = d(
+      (o) => {
+        o.preventDefault();
+      },
+      []
+    ), { className: S, ...T } = C ?? {};
+    return /* @__PURE__ */ v(
+      n,
+      {
+        open: r,
+        onOpenChange: P,
+        children: [
+          /* @__PURE__ */ e(
+            F,
+            {
+              ...l,
+              ref: s,
+              id: I,
+              type: "date",
+              disabled: a,
+              value: N,
+              onChange: w,
+              onKeyDown: x,
+              className: c(i.input, l.className),
+              "aria-label": g,
+              "aria-labelledby": b,
+              "aria-haspopup": "dialog",
+              "aria-expanded": r,
+              endAction: /* @__PURE__ */ e(n.Trigger, { children: /* @__PURE__ */ e(
+                K,
+                {
+                  icon: j.calendar,
+                  "aria-label": "Open calendar",
+                  variant: "ghost",
+                  color: "primary",
+                  size: "sm",
+                  type: "button",
+                  disabled: a,
+                  onMouseDown: R
+                }
+              ) })
+            }
+          ),
+          /* @__PURE__ */ e(
+            n.Content,
+            {
+              side: "bottom",
+              align: "end",
+              className: i.content,
+              "aria-label": y,
+              initialFocus: !1,
+              finalFocus: s,
+              children: /* @__PURE__ */ e(
+                E,
+                {
+                  mode: "single",
+                  selected: t,
+                  onSelect: M,
+                  disabled: a,
+                  className: c(i.calendar, S),
+                  ...T,
+                  defaultMonth: k,
+                  autoFocus: r
+                }
+              )
+            }
+          )
+        ]
+      }
+    );
+  }
+);
+z.displayName = "DatePicker";
+export {
+  z as default
+};
+//# sourceMappingURL=DatePicker.js.map

package/dist/components/forms/date-picker/DatePicker.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"DatePicker.js","sources":["../../../../src/components/forms/date-picker/DatePicker.tsx"],"sourcesContent":["import { Calendar } from '@components/forms/calendar'\r\nimport { TextField } from '@components/forms/text-field'\r\nimport { Popover } from '@components/overlay/popover'\r\nimport { IconButton } from '@components/actions/icon-button'\r\nimport { useDatePicker } from '@components/forms/date-picker/hooks/useDatePicker.hook.ts'\r\nimport { DATE_PICKER_STYLES } from '@components/forms/date-picker/styles/DatePicker.css.ts'\r\nimport { IconRegistry } from '@constants/icons'\r\nimport { cn } from '@utils/cn.ts'\r\nimport type { DatePickerProps } from '@components/forms/date-picker/types/DatePicker.props.ts'\r\nimport { memo, useCallback, useMemo, useRef } from 'react'\r\n\r\n/**\r\n * A date picker that combines a native `type=\"date\"` text field with a\r\n * calendar popover.\r\n *\r\n * - Typing a valid `YYYY-MM-DD` date updates the calendar and calls `onChange`.\r\n * - Selecting a day in the calendar updates the input and closes the popover.\r\n * - Invalid or incomplete typed values are kept in the input but do not update\r\n *   the selected date until they become valid.\r\n * - Opening the popover focuses the selected day (or today), and closing it\r\n *   returns focus to the input.\r\n *\r\n * @example\r\n * ```tsx\r\n * const [date, setDate] = useState<Date | undefined>()\r\n * <DatePicker label=\"Pick a date\" value={date} onChange={setDate} />\r\n * ```\r\n */\r\nconst DatePicker = memo(\r\n    ({\r\n        value,\r\n        defaultValue,\r\n        onChange,\r\n        calendarProps,\r\n        id,\r\n        disabled,\r\n        'aria-label': ariaLabel,\r\n        'aria-labelledby': ariaLabelledBy,\r\n        calendarAriaLabel = 'Calendar',\r\n        onKeyDown,\r\n        ...textFieldProps\r\n    }: DatePickerProps) => {\r\n        const {\r\n            selectedDate,\r\n            inputValue,\r\n            open,\r\n            inputId,\r\n            handleInputChange,\r\n            handleInputKeyDown,\r\n            handleCalendarSelect,\r\n            setOpen,\r\n        } = useDatePicker({ value, defaultValue, onChange, id })\r\n\r\n        const inputRef = useRef<HTMLInputElement>(null)\r\n        const calendarDefaultMonth = useMemo(\r\n            () => selectedDate ?? new Date(),\r\n            [selectedDate],\r\n        )\r\n\r\n        const handleKeyDown = useCallback(\r\n            (event: React.KeyboardEvent<HTMLInputElement>) => {\r\n                handleInputKeyDown(event)\r\n                onKeyDown?.(event)\r\n            },\r\n            [handleInputKeyDown, onKeyDown],\r\n        )\r\n\r\n        const handleCalendarButtonMouseDown = useCallback(\r\n            (event: React.MouseEvent<HTMLButtonElement>) => {\r\n                event.preventDefault()\r\n            },\r\n            [],\r\n        )\r\n\r\n        const { className: calendarClassName, ...restCalendarProps } =\r\n            calendarProps ?? {}\r\n\r\n        return (\r\n            <Popover\r\n                open={open}\r\n                onOpenChange={setOpen}\r\n            >\r\n                <TextField\r\n                    {...textFieldProps}\r\n                    ref={inputRef}\r\n                    id={inputId}\r\n                    type={'date'}\r\n                    disabled={disabled}\r\n                    value={inputValue}\r\n                    onChange={handleInputChange}\r\n                    onKeyDown={handleKeyDown}\r\n                    className={cn(DATE_PICKER_STYLES.input, textFieldProps.className)}\r\n                    aria-label={ariaLabel}\r\n                    aria-labelledby={ariaLabelledBy}\r\n                    aria-haspopup={'dialog'}\r\n                    aria-expanded={open}\r\n                    endAction={\r\n                        <Popover.Trigger>\r\n                            <IconButton\r\n                                icon={IconRegistry.calendar}\r\n                                aria-label={'Open calendar'}\r\n                                variant={'ghost'}\r\n                                color={'primary'}\r\n                                size={'sm'}\r\n                                type={'button'}\r\n                                disabled={disabled}\r\n                                onMouseDown={handleCalendarButtonMouseDown}\r\n                            />\r\n                        </Popover.Trigger>\r\n                    }\r\n                />\r\n\r\n                <Popover.Content\r\n                    side={'bottom'}\r\n                    align={'end'}\r\n                    className={DATE_PICKER_STYLES.content}\r\n                    aria-label={calendarAriaLabel}\r\n                    initialFocus={false}\r\n                    finalFocus={inputRef}\r\n                >\r\n                    <Calendar\r\n                        mode={'single'}\r\n                        selected={selectedDate}\r\n                        onSelect={handleCalendarSelect}\r\n                        disabled={disabled}\r\n                        className={cn(DATE_PICKER_STYLES.calendar, calendarClassName)}\r\n                        {...restCalendarProps}\r\n                        defaultMonth={calendarDefaultMonth}\r\n                        autoFocus={open}\r\n                    />\r\n                </Popover.Content>\r\n            </Popover>\r\n        )\r\n    },\r\n)\r\n\r\nDatePicker.displayName = 'DatePicker'\r\n\r\nexport default DatePicker\r\n"],"names":["DatePicker","memo","value","defaultValue","onChange","calendarProps","id","disabled","ariaLabel","ariaLabelledBy","calendarAriaLabel","onKeyDown","textFieldProps","selectedDate","inputValue","open","inputId","handleInputChange","handleInputKeyDown","handleCalendarSelect","setOpen","useDatePicker","inputRef","useRef","calendarDefaultMonth","useMemo","handleKeyDown","useCallback","event","handleCalendarButtonMouseDown","calendarClassName","restCalendarProps","jsxs","Popover","jsx","TextField","cn","DATE_PICKER_STYLES","IconButton","IconRegistry","Calendar"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA4BA,MAAMA,IAAaC;AAAA,EACf,CAAC;AAAA,IACG,OAAAC;AAAA,IACA,cAAAC;AAAA,IACA,UAAAC;AAAA,IACA,eAAAC;AAAA,IACA,IAAAC;AAAA,IACA,UAAAC;AAAA,IACA,cAAcC;AAAA,IACd,mBAAmBC;AAAA,IACnB,mBAAAC,IAAoB;AAAA,IACpB,WAAAC;AAAA,IACA,GAAGC;AAAA,EAAA,MACgB;AACnB,UAAM;AAAA,MACF,cAAAC;AAAA,MACA,YAAAC;AAAA,MACA,MAAAC;AAAA,MACA,SAAAC;AAAA,MACA,mBAAAC;AAAA,MACA,oBAAAC;AAAA,MACA,sBAAAC;AAAA,MACA,SAAAC;AAAA,IAAA,IACAC,EAAc,EAAE,OAAAnB,GAAO,cAAAC,GAAc,UAAAC,GAAU,IAAAE,GAAI,GAEjDgB,IAAWC,EAAyB,IAAI,GACxCC,IAAuBC;AAAA,MACzB,MAAMZ,KAAgB,oBAAI,KAAA;AAAA,MAC1B,CAACA,CAAY;AAAA,IAAA,GAGXa,IAAgBC;AAAA,MAClB,CAACC,MAAiD;AAC9C,QAAAV,EAAmBU,CAAK,GACxBjB,IAAYiB,CAAK;AAAA,MACrB;AAAA,MACA,CAACV,GAAoBP,CAAS;AAAA,IAAA,GAG5BkB,IAAgCF;AAAA,MAClC,CAACC,MAA+C;AAC5C,QAAAA,EAAM,eAAA;AAAA,MACV;AAAA,MACA,CAAA;AAAA,IAAC,GAGC,EAAE,WAAWE,GAAmB,GAAGC,EAAA,IACrC1B,KAAiB,CAAA;AAErB,WACI,gBAAA2B;AAAA,MAACC;AAAA,MAAA;AAAA,QACG,MAAAlB;AAAA,QACA,cAAcK;AAAA,QAEd,UAAA;AAAA,UAAA,gBAAAc;AAAA,YAACC;AAAA,YAAA;AAAA,cACI,GAAGvB;AAAA,cACJ,KAAKU;AAAA,cACL,IAAIN;AAAA,cACJ,MAAM;AAAA,cACN,UAAAT;AAAA,cACA,OAAOO;AAAA,cACP,UAAUG;AAAA,cACV,WAAWS;AAAA,cACX,WAAWU,EAAGC,EAAmB,OAAOzB,EAAe,SAAS;AAAA,cAChE,cAAYJ;AAAA,cACZ,mBAAiBC;AAAA,cACjB,iBAAe;AAAA,cACf,iBAAeM;AAAA,cACf,WACI,gBAAAmB,EAACD,EAAQ,SAAR,EACG,UAAA,gBAAAC;AAAA,gBAACI;AAAA,gBAAA;AAAA,kBACG,MAAMC,EAAa;AAAA,kBACnB,cAAY;AAAA,kBACZ,SAAS;AAAA,kBACT,OAAO;AAAA,kBACP,MAAM;AAAA,kBACN,MAAM;AAAA,kBACN,UAAAhC;AAAA,kBACA,aAAasB;AAAA,gBAAA;AAAA,cAAA,EACjB,CACJ;AAAA,YAAA;AAAA,UAAA;AAAA,UAIR,gBAAAK;AAAA,YAACD,EAAQ;AAAA,YAAR;AAAA,cACG,MAAM;AAAA,cACN,OAAO;AAAA,cACP,WAAWI,EAAmB;AAAA,cAC9B,cAAY3B;AAAA,cACZ,cAAc;AAAA,cACd,YAAYY;AAAA,cAEZ,UAAA,gBAAAY;AAAA,gBAACM;AAAA,gBAAA;AAAA,kBACG,MAAM;AAAA,kBACN,UAAU3B;AAAA,kBACV,UAAUM;AAAA,kBACV,UAAAZ;AAAA,kBACA,WAAW6B,EAAGC,EAAmB,UAAUP,CAAiB;AAAA,kBAC3D,GAAGC;AAAA,kBACJ,cAAcP;AAAA,kBACd,WAAWT;AAAA,gBAAA;AAAA,cAAA;AAAA,YACf;AAAA,UAAA;AAAA,QACJ;AAAA,MAAA;AAAA,IAAA;AAAA,EAGZ;AACJ;AAEAf,EAAW,cAAc;"}

package/dist/components/forms/date-picker/constants/index.cjs

@@ -0,0 +1,2 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=new Set([" ","Spacebar"]);exports.KEYS_THAT_OPEN_NATIVE_PICKER=e;
+//# sourceMappingURL=index.cjs.map

package/dist/components/forms/date-picker/constants/index.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.cjs","sources":["../../../../../src/components/forms/date-picker/constants/index.ts"],"sourcesContent":["export const KEYS_THAT_OPEN_NATIVE_PICKER = new Set([' ', 'Spacebar'])\r\n"],"names":["KEYS_THAT_OPEN_NATIVE_PICKER"],"mappings":"gFAAO,MAAMA,EAA+B,IAAI,IAAI,CAAC,IAAK,UAAU,CAAC"}

package/dist/components/forms/date-picker/constants/index.d.ts

@@ -0,0 +1 @@
+export declare const KEYS_THAT_OPEN_NATIVE_PICKER: Set<string>;

package/dist/components/forms/date-picker/constants/index.js

@@ -0,0 +1,5 @@
+const e = /* @__PURE__ */ new Set([" ", "Spacebar"]);
+export {
+  e as KEYS_THAT_OPEN_NATIVE_PICKER
+};
+//# sourceMappingURL=index.js.map

package/dist/components/forms/date-picker/constants/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sources":["../../../../../src/components/forms/date-picker/constants/index.ts"],"sourcesContent":["export const KEYS_THAT_OPEN_NATIVE_PICKER = new Set([' ', 'Spacebar'])\r\n"],"names":["KEYS_THAT_OPEN_NATIVE_PICKER"],"mappings":"AAAO,MAAMA,IAA+B,oBAAI,IAAI,CAAC,KAAK,UAAU,CAAC;"}

package/dist/components/forms/date-picker/hooks/useDatePicker.hook.cjs

@@ -0,0 +1,2 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("react"),i=require("../utils/datePicker.utils.cjs"),w=require("../constants/index.cjs"),y=({value:s,defaultValue:d,onChange:D,id:p})=>{const n=s!==void 0,S=t.useId(),g=p??S,[T,f]=t.useState(d),[k,l]=t.useState(i.formatDateToString(d)),[I,u]=t.useState(!1),c=n?s:T;t.useEffect(()=>{n&&(f(s),l(i.formatDateToString(s)))},[n,s]);const a=t.useCallback(e=>{n||(f(e),l(i.formatDateToString(e))),D?.(e)},[n,D]),C=t.useCallback(e=>{const o=e.target.value;if(l(o),o===""){c!==void 0&&a(void 0);return}const r=i.parseStringToDate(o);r&&r.getTime()!==c?.getTime()&&a(r)},[c,a]),b=t.useCallback(e=>{a(e),u(!1)},[a]),m=t.useCallback(e=>{const o=w.KEYS_THAT_OPEN_NATIVE_PICKER.has(e.key),r=e.key==="ArrowDown"&&e.altKey;(o||r)&&(e.preventDefault(),u(!0))},[]);return{selectedDate:c,inputValue:k,open:I,inputId:g,handleInputChange:C,handleInputKeyDown:m,handleCalendarSelect:b,setOpen:u}};exports.useDatePicker=y;
+//# sourceMappingURL=useDatePicker.hook.cjs.map

package/dist/components/forms/date-picker/hooks/useDatePicker.hook.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"useDatePicker.hook.cjs","sources":["../../../../../src/components/forms/date-picker/hooks/useDatePicker.hook.ts"],"sourcesContent":["import { useCallback, useEffect, useId, useState } from 'react'\r\n\r\nimport { formatDateToString, parseStringToDate } from '@components/forms/date-picker/utils/datePicker.utils.ts'\r\nimport type { UseDatePickerOptions, UseDatePickerReturn } from '@components/forms/date-picker/types'\r\nimport { KEYS_THAT_OPEN_NATIVE_PICKER } from '@components/forms/date-picker/constants'\r\n\r\n/**\r\n * Manages state and interactions for the DatePicker component.\r\n *\r\n * Supports both controlled and uncontrolled modes, keeps the native date input\r\n * in sync with the calendar selection, and only commits valid `YYYY-MM-DD`\r\n * values to `onChange`.\r\n */\r\nexport const useDatePicker = ({\r\n    value,\r\n    defaultValue,\r\n    onChange,\r\n    id,\r\n}: UseDatePickerOptions): UseDatePickerReturn => {\r\n    const isControlled = value !== undefined\r\n    const generatedId = useId()\r\n    const inputId = id ?? generatedId\r\n\r\n    const [selectedDate, setSelectedDate] = useState<Date | undefined>(defaultValue)\r\n    const [inputValue, setInputValue] = useState(formatDateToString(defaultValue))\r\n    const [open, setOpen] = useState(false)\r\n\r\n    const resolvedDate = isControlled ? value : selectedDate\r\n\r\n    useEffect(() => {\r\n        if (isControlled) {\r\n            setSelectedDate(value)\r\n            setInputValue(formatDateToString(value))\r\n        }\r\n    }, [isControlled, value])\r\n\r\n    const updateDate = useCallback(\r\n        (date: Date | undefined) => {\r\n            if (!isControlled) {\r\n                setSelectedDate(date)\r\n                setInputValue(formatDateToString(date))\r\n            }\r\n            onChange?.(date)\r\n        },\r\n        [isControlled, onChange],\r\n    )\r\n\r\n    const handleInputChange = useCallback(\r\n        (event: React.ChangeEvent<HTMLInputElement>) => {\r\n            const newValue = event.target.value\r\n            setInputValue(newValue)\r\n\r\n            if (newValue === '') {\r\n                if (resolvedDate !== undefined) {\r\n                    updateDate(undefined)\r\n                }\r\n                return\r\n            }\r\n\r\n            const parsed = parseStringToDate(newValue)\r\n            if (parsed && parsed.getTime() !== resolvedDate?.getTime()) {\r\n                updateDate(parsed)\r\n            }\r\n        },\r\n        [resolvedDate, updateDate],\r\n    )\r\n\r\n    const handleCalendarSelect = useCallback(\r\n        (date: Date | undefined) => {\r\n            updateDate(date)\r\n            setOpen(false)\r\n        },\r\n        [updateDate],\r\n    )\r\n\r\n    const handleInputKeyDown = useCallback(\r\n        (event: React.KeyboardEvent<HTMLInputElement>) => {\r\n            const isSpace = KEYS_THAT_OPEN_NATIVE_PICKER.has(event.key)\r\n            const isAltArrowDown = event.key === 'ArrowDown' && event.altKey\r\n\r\n            if (isSpace || isAltArrowDown) {\r\n                event.preventDefault()\r\n                setOpen(true)\r\n            }\r\n        },\r\n        [],\r\n    )\r\n\r\n    return {\r\n        selectedDate: resolvedDate,\r\n        inputValue,\r\n        open,\r\n        inputId,\r\n        handleInputChange,\r\n        handleInputKeyDown,\r\n        handleCalendarSelect,\r\n        setOpen,\r\n    }\r\n}\r\n"],"names":["useDatePicker","value","defaultValue","onChange","id","isControlled","generatedId","useId","inputId","selectedDate","setSelectedDate","useState","inputValue","setInputValue","formatDateToString","open","setOpen","resolvedDate","useEffect","updateDate","useCallback","date","handleInputChange","event","newValue","parsed","parseStringToDate","handleCalendarSelect","handleInputKeyDown","isSpace","KEYS_THAT_OPEN_NATIVE_PICKER","isAltArrowDown"],"mappings":"wLAaaA,EAAgB,CAAC,CAC1B,MAAAC,EACA,aAAAC,EACA,SAAAC,EACA,GAAAC,CACJ,IAAiD,CAC7C,MAAMC,EAAeJ,IAAU,OACzBK,EAAcC,EAAAA,MAAA,EACdC,EAAUJ,GAAME,EAEhB,CAACG,EAAcC,CAAe,EAAIC,EAAAA,SAA2BT,CAAY,EACzE,CAACU,EAAYC,CAAa,EAAIF,EAAAA,SAASG,EAAAA,mBAAmBZ,CAAY,CAAC,EACvE,CAACa,EAAMC,CAAO,EAAIL,EAAAA,SAAS,EAAK,EAEhCM,EAAeZ,EAAeJ,EAAQQ,EAE5CS,EAAAA,UAAU,IAAM,CACRb,IACAK,EAAgBT,CAAK,EACrBY,EAAcC,EAAAA,mBAAmBb,CAAK,CAAC,EAE/C,EAAG,CAACI,EAAcJ,CAAK,CAAC,EAExB,MAAMkB,EAAaC,EAAAA,YACdC,GAA2B,CACnBhB,IACDK,EAAgBW,CAAI,EACpBR,EAAcC,EAAAA,mBAAmBO,CAAI,CAAC,GAE1ClB,IAAWkB,CAAI,CACnB,EACA,CAAChB,EAAcF,CAAQ,CAAA,EAGrBmB,EAAoBF,EAAAA,YACrBG,GAA+C,CAC5C,MAAMC,EAAWD,EAAM,OAAO,MAG9B,GAFAV,EAAcW,CAAQ,EAElBA,IAAa,GAAI,CACbP,IAAiB,QACjBE,EAAW,MAAS,EAExB,MACJ,CAEA,MAAMM,EAASC,EAAAA,kBAAkBF,CAAQ,EACrCC,GAAUA,EAAO,QAAA,IAAcR,GAAc,WAC7CE,EAAWM,CAAM,CAEzB,EACA,CAACR,EAAcE,CAAU,CAAA,EAGvBQ,EAAuBP,EAAAA,YACxBC,GAA2B,CACxBF,EAAWE,CAAI,EACfL,EAAQ,EAAK,CACjB,EACA,CAACG,CAAU,CAAA,EAGTS,EAAqBR,EAAAA,YACtBG,GAAiD,CAC9C,MAAMM,EAAUC,EAAAA,6BAA6B,IAAIP,EAAM,GAAG,EACpDQ,EAAiBR,EAAM,MAAQ,aAAeA,EAAM,QAEtDM,GAAWE,KACXR,EAAM,eAAA,EACNP,EAAQ,EAAI,EAEpB,EACA,CAAA,CAAC,EAGL,MAAO,CACH,aAAcC,EACd,WAAAL,EACA,KAAAG,EACA,QAAAP,EACA,kBAAAc,EACA,mBAAAM,EACA,qBAAAD,EACA,QAAAX,CAAA,CAER"}

package/dist/components/forms/date-picker/hooks/useDatePicker.hook.d.ts

@@ -0,0 +1,9 @@
+import { UseDatePickerOptions, UseDatePickerReturn } from '../types';
+/**
+ * Manages state and interactions for the DatePicker component.
+ *
+ * Supports both controlled and uncontrolled modes, keeps the native date input
+ * in sync with the calendar selection, and only commits valid `YYYY-MM-DD`
+ * values to `onChange`.
+ */
+export declare const useDatePicker: ({ value, defaultValue, onChange, id, }: UseDatePickerOptions) => UseDatePickerReturn;