@noambz/ui 0.7.0

package/dist/components/organisms/data-grid/data-grid.stories.d.ts

@@ -0,0 +1,19 @@
+import type { Meta, StoryObj } from "@storybook/react-vite";
+import { DataGrid } from "./data-grid.js";
+interface ISignalRow {
+    id: string;
+    ticker: string;
+    analyzer: string;
+    severity: "low" | "medium" | "high";
+    firedAt: string;
+    confidence: number;
+}
+declare const meta: Meta<typeof DataGrid<ISignalRow>>;
+export default meta;
+type Story = StoryObj<typeof DataGrid<ISignalRow>>;
+export declare const Default: Story;
+export declare const Selectable: Story;
+export declare const Loading: Story;
+export declare const Empty: Story;
+export declare const RowClickable: Story;
+//# sourceMappingURL=data-grid.stories.d.ts.map

package/dist/components/organisms/data-grid/data-grid.stories.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"data-grid.stories.d.ts","sourceRoot":"","sources":["../../../../src/components/organisms/data-grid/data-grid.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,IAAI,EAAE,QAAQ,EAAE,MAAM,uBAAuB,CAAC;AAE5D,OAAO,EAAE,QAAQ,EAAE,MAAM,gBAAgB,CAAC;AAM1C,UAAU,UAAU;IAClB,EAAE,EAAE,MAAM,CAAC;IACX,MAAM,EAAE,MAAM,CAAC;IACf,QAAQ,EAAE,MAAM,CAAC;IACjB,QAAQ,EAAE,KAAK,GAAG,QAAQ,GAAG,MAAM,CAAC;IACpC,OAAO,EAAE,MAAM,CAAC;IAChB,UAAU,EAAE,MAAM,CAAC;CACpB;AAsCD,QAAA,MAAM,IAAI,EAAE,IAAI,CAAC,OAAO,QAAQ,CAAC,UAAU,CAAC,CAI3C,CAAC;AACF,eAAe,IAAI,CAAC;AACpB,KAAK,KAAK,GAAG,QAAQ,CAAC,OAAO,QAAQ,CAAC,UAAU,CAAC,CAAC,CAAC;AAEnD,eAAO,MAAM,OAAO,EAAE,KAarB,CAAC;AAEF,eAAO,MAAM,UAAU,EAAE,KAmBxB,CAAC;AAEF,eAAO,MAAM,OAAO,EAAE,KAIrB,CAAC;AAEF,eAAO,MAAM,KAAK,EAAE,KASnB,CAAC;AAEF,eAAO,MAAM,YAAY,EAAE,KAS1B,CAAC"}

package/dist/components/organisms/data-grid/data-grid.type.d.ts

@@ -0,0 +1,10 @@
+export declare enum SortDirectionEnum {
+    ASC = "asc",
+    DESC = "desc"
+}
+export declare enum ColumnAlignEnum {
+    START = "start",
+    CENTER = "center",
+    END = "end"
+}
+//# sourceMappingURL=data-grid.type.d.ts.map

package/dist/components/organisms/data-grid/data-grid.type.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"data-grid.type.d.ts","sourceRoot":"","sources":["../../../../src/components/organisms/data-grid/data-grid.type.ts"],"names":[],"mappings":"AAAA,oBAAY,iBAAiB;IAC3B,GAAG,QAAQ;IACX,IAAI,SAAS;CACd;AAED,oBAAY,eAAe;IACzB,KAAK,UAAU;IACf,MAAM,WAAW;IACjB,GAAG,QAAQ;CACZ"}

package/dist/components/organisms/data-grid/data-grid.type.js

@@ -0,0 +1,16 @@
+var SortDirectionEnum = /* @__PURE__ */ ((SortDirectionEnum2) => {
+  SortDirectionEnum2["ASC"] = "asc";
+  SortDirectionEnum2["DESC"] = "desc";
+  return SortDirectionEnum2;
+})(SortDirectionEnum || {});
+var ColumnAlignEnum = /* @__PURE__ */ ((ColumnAlignEnum2) => {
+  ColumnAlignEnum2["START"] = "start";
+  ColumnAlignEnum2["CENTER"] = "center";
+  ColumnAlignEnum2["END"] = "end";
+  return ColumnAlignEnum2;
+})(ColumnAlignEnum || {});
+export {
+  ColumnAlignEnum,
+  SortDirectionEnum
+};
+//# sourceMappingURL=data-grid.type.js.map

package/dist/components/organisms/data-grid/data-grid.type.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../src/components/organisms/data-grid/data-grid.type.ts"],"sourcesContent":["export enum SortDirectionEnum {\n  ASC = \"asc\",\n  DESC = \"desc\",\n}\n\nexport enum ColumnAlignEnum {\n  START = \"start\",\n  CENTER = \"center\",\n  END = \"end\",\n}\n"],"mappings":"AAAO,IAAK,oBAAL,kBAAKA,uBAAL;AACL,EAAAA,mBAAA,SAAM;AACN,EAAAA,mBAAA,UAAO;AAFG,SAAAA;AAAA,GAAA;AAKL,IAAK,kBAAL,kBAAKC,qBAAL;AACL,EAAAA,iBAAA,WAAQ;AACR,EAAAA,iBAAA,YAAS;AACT,EAAAA,iBAAA,SAAM;AAHI,SAAAA;AAAA,GAAA;","names":["SortDirectionEnum","ColumnAlignEnum"]}

package/dist/components/organisms/data-grid/index.d.ts

@@ -0,0 +1,4 @@
+export { DataGrid } from "./data-grid.js";
+export type { IDataGridProps, IDataGridColumn, IDataGridSort, IDataGridFilters, IDataGridColumnFilter, IDataGridTextFilter, IDataGridSelectFilter, IDataGridSelectOption, } from "./data-grid.js";
+export { SortDirectionEnum, ColumnAlignEnum } from "./data-grid.type.js";
+//# sourceMappingURL=index.d.ts.map

package/dist/components/organisms/data-grid/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/organisms/data-grid/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,QAAQ,EAAE,MAAM,gBAAgB,CAAC;AAC1C,YAAY,EACV,cAAc,EACd,eAAe,EACf,aAAa,EACb,gBAAgB,EAChB,qBAAqB,EACrB,mBAAmB,EACnB,qBAAqB,EACrB,qBAAqB,GACtB,MAAM,gBAAgB,CAAC;AACxB,OAAO,EAAE,iBAAiB,EAAE,eAAe,EAAE,MAAM,qBAAqB,CAAC"}

package/dist/components/organisms/data-grid/index.js

@@ -0,0 +1,8 @@
+import { DataGrid } from "./data-grid.js";
+import { SortDirectionEnum, ColumnAlignEnum } from "./data-grid.type.js";
+export {
+  ColumnAlignEnum,
+  DataGrid,
+  SortDirectionEnum
+};
+//# sourceMappingURL=index.js.map

package/dist/components/organisms/data-grid/index.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../src/components/organisms/data-grid/index.ts"],"sourcesContent":["export { DataGrid } from \"./data-grid.js\";\nexport type {\n  IDataGridProps,\n  IDataGridColumn,\n  IDataGridSort,\n  IDataGridFilters,\n  IDataGridColumnFilter,\n  IDataGridTextFilter,\n  IDataGridSelectFilter,\n  IDataGridSelectOption,\n} from \"./data-grid.js\";\nexport { SortDirectionEnum, ColumnAlignEnum } from \"./data-grid.type.js\";\n"],"mappings":"AAAA,SAAS,gBAAgB;AAWzB,SAAS,mBAAmB,uBAAuB;","names":[]}

package/dist/components/organisms/date-picker/calendar.d.ts

@@ -0,0 +1,16 @@
+import { type DayPickerProps } from "react-day-picker";
+export type ICalendarProps = DayPickerProps;
+/**
+ * Styled react-day-picker wrapper. Applies Tailwind classes via `classNames`
+ * so the calendar inherits the design system tokens instead of the library CSS.
+ *
+ * Pass `locale` (a `date-fns` locale like `he` / `es`) and `dir="rtl"` to
+ * localize the calendar; both are forwarded to `DayPicker` unchanged. Example:
+ *
+ * ```ts
+ * import { he } from "date-fns/locale";
+ * <Calendar locale={he} dir="rtl" />
+ * ```
+ */
+export declare function Calendar({ className, classNames, showOutsideDays, ...props }: ICalendarProps): import("react").JSX.Element;
+//# sourceMappingURL=calendar.d.ts.map

package/dist/components/organisms/date-picker/calendar.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"calendar.d.ts","sourceRoot":"","sources":["../../../../src/components/organisms/date-picker/calendar.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAa,KAAK,cAAc,EAAE,MAAM,kBAAkB,CAAC;AAGlE,MAAM,MAAM,cAAc,GAAG,cAAc,CAAC;AAE5C;;;;;;;;;;;GAWG;AACH,wBAAgB,QAAQ,CAAC,EAAE,SAAS,EAAE,UAAU,EAAE,eAAsB,EAAE,GAAG,KAAK,EAAE,EAAE,cAAc,+BAmDnG"}

package/dist/components/organisms/date-picker/calendar.js

@@ -0,0 +1,60 @@
+"use client";
+import { jsx } from "react/jsx-runtime";
+import { DayPicker } from "react-day-picker";
+import { cn } from "../../../utils/cn.js";
+function Calendar({ className, classNames, showOutsideDays = true, ...props }) {
+  return /* @__PURE__ */ jsx(
+    DayPicker,
+    {
+      showOutsideDays,
+      className: cn("text-sm", className),
+      classNames: {
+        months: "flex flex-col sm:flex-row gap-4",
+        month: "flex flex-col gap-2",
+        month_caption: "relative flex items-center justify-center h-8 text-sm font-medium",
+        caption_label: "text-sm font-medium",
+        nav: "absolute inset-x-0 top-0 flex items-center justify-between",
+        button_previous: cn(
+          "inline-flex items-center justify-center rounded-md h-7 w-7 text-muted-foreground hover:text-foreground hover:bg-surface-muted transition-colors",
+          "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring",
+          "disabled:opacity-40 disabled:pointer-events-none",
+          "[&_svg]:h-4 [&_svg]:w-4 [&_svg]:fill-current"
+        ),
+        button_next: cn(
+          "inline-flex items-center justify-center rounded-md h-7 w-7 text-muted-foreground hover:text-foreground hover:bg-surface-muted transition-colors",
+          "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring",
+          "disabled:opacity-40 disabled:pointer-events-none",
+          "[&_svg]:h-4 [&_svg]:w-4 [&_svg]:fill-current"
+        ),
+        month_grid: "w-full border-collapse",
+        weekdays: "",
+        weekday: "w-9 h-8 text-muted-foreground text-[0.7rem] font-normal text-center",
+        weeks: "",
+        week: "",
+        day: "w-9 h-9 p-0 text-center relative align-middle focus-within:relative focus-within:z-20",
+        day_button: cn(
+          "inline-flex h-9 w-9 items-center justify-center rounded-md text-sm font-normal transition-colors",
+          "hover:bg-surface-muted focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring",
+          "aria-selected:bg-blue-600 aria-selected:text-white aria-selected:hover:bg-blue-700",
+          "disabled:opacity-40 disabled:pointer-events-none disabled:hover:bg-transparent"
+        ),
+        today: "[&_button]:font-semibold [&_button]:text-blue-600 dark:[&_button]:text-blue-400",
+        outside: "[&_button]:text-muted-foreground/40",
+        disabled: "[&_button]:opacity-40 [&_button]:pointer-events-none",
+        range_start: "[&_button]:rounded-e-none [&_button]:bg-blue-600 [&_button]:text-white dark:[&_button]:bg-blue-600",
+        range_end: "[&_button]:rounded-s-none [&_button]:bg-blue-600 [&_button]:text-white dark:[&_button]:bg-blue-600",
+        range_middle: cn(
+          "[&_button]:bg-blue-100 [&_button]:text-blue-900 [&_button]:rounded-none [&_button]:hover:bg-blue-200",
+          "dark:[&_button]:bg-blue-900/40 dark:[&_button]:text-blue-100 dark:[&_button]:hover:bg-blue-900/60"
+        ),
+        hidden: "invisible",
+        ...classNames
+      },
+      ...props
+    }
+  );
+}
+export {
+  Calendar
+};
+//# sourceMappingURL=calendar.js.map

package/dist/components/organisms/date-picker/calendar.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../src/components/organisms/date-picker/calendar.tsx"],"sourcesContent":["\"use client\";\n\nimport { DayPicker, type DayPickerProps } from \"react-day-picker\";\nimport { cn } from \"../../../utils/cn.js\";\n\nexport type ICalendarProps = DayPickerProps;\n\n/**\n * Styled react-day-picker wrapper. Applies Tailwind classes via `classNames`\n * so the calendar inherits the design system tokens instead of the library CSS.\n *\n * Pass `locale` (a `date-fns` locale like `he` / `es`) and `dir=\"rtl\"` to\n * localize the calendar; both are forwarded to `DayPicker` unchanged. Example:\n *\n * ```ts\n * import { he } from \"date-fns/locale\";\n * <Calendar locale={he} dir=\"rtl\" />\n * ```\n */\nexport function Calendar({ className, classNames, showOutsideDays = true, ...props }: ICalendarProps) {\n  return (\n    <DayPicker\n      showOutsideDays={showOutsideDays}\n      className={cn(\"text-sm\", className)}\n      classNames={{\n        months: \"flex flex-col sm:flex-row gap-4\",\n        month: \"flex flex-col gap-2\",\n        month_caption: \"relative flex items-center justify-center h-8 text-sm font-medium\",\n        caption_label: \"text-sm font-medium\",\n        nav: \"absolute inset-x-0 top-0 flex items-center justify-between\",\n        button_previous: cn(\n          \"inline-flex items-center justify-center rounded-md h-7 w-7 text-muted-foreground hover:text-foreground hover:bg-surface-muted transition-colors\",\n          \"focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring\",\n          \"disabled:opacity-40 disabled:pointer-events-none\",\n          \"[&_svg]:h-4 [&_svg]:w-4 [&_svg]:fill-current\",\n        ),\n        button_next: cn(\n          \"inline-flex items-center justify-center rounded-md h-7 w-7 text-muted-foreground hover:text-foreground hover:bg-surface-muted transition-colors\",\n          \"focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring\",\n          \"disabled:opacity-40 disabled:pointer-events-none\",\n          \"[&_svg]:h-4 [&_svg]:w-4 [&_svg]:fill-current\",\n        ),\n        month_grid: \"w-full border-collapse\",\n        weekdays: \"\",\n        weekday: \"w-9 h-8 text-muted-foreground text-[0.7rem] font-normal text-center\",\n        weeks: \"\",\n        week: \"\",\n        day: \"w-9 h-9 p-0 text-center relative align-middle focus-within:relative focus-within:z-20\",\n        day_button: cn(\n          \"inline-flex h-9 w-9 items-center justify-center rounded-md text-sm font-normal transition-colors\",\n          \"hover:bg-surface-muted focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring\",\n          \"aria-selected:bg-blue-600 aria-selected:text-white aria-selected:hover:bg-blue-700\",\n          \"disabled:opacity-40 disabled:pointer-events-none disabled:hover:bg-transparent\",\n        ),\n        today: \"[&_button]:font-semibold [&_button]:text-blue-600 dark:[&_button]:text-blue-400\",\n        outside: \"[&_button]:text-muted-foreground/40\",\n        disabled: \"[&_button]:opacity-40 [&_button]:pointer-events-none\",\n        range_start:\n          \"[&_button]:rounded-e-none [&_button]:bg-blue-600 [&_button]:text-white dark:[&_button]:bg-blue-600\",\n        range_end: \"[&_button]:rounded-s-none [&_button]:bg-blue-600 [&_button]:text-white dark:[&_button]:bg-blue-600\",\n        range_middle: cn(\n          \"[&_button]:bg-blue-100 [&_button]:text-blue-900 [&_button]:rounded-none [&_button]:hover:bg-blue-200\",\n          \"dark:[&_button]:bg-blue-900/40 dark:[&_button]:text-blue-100 dark:[&_button]:hover:bg-blue-900/60\",\n        ),\n        hidden: \"invisible\",\n        ...classNames,\n      }}\n      {...props}\n    />\n  );\n}\n"],"mappings":";AAqBI;AAnBJ,SAAS,iBAAsC;AAC/C,SAAS,UAAU;AAgBZ,SAAS,SAAS,EAAE,WAAW,YAAY,kBAAkB,MAAM,GAAG,MAAM,GAAmB;AACpG,SACE;AAAA,IAAC;AAAA;AAAA,MACC;AAAA,MACA,WAAW,GAAG,WAAW,SAAS;AAAA,MAClC,YAAY;AAAA,QACV,QAAQ;AAAA,QACR,OAAO;AAAA,QACP,eAAe;AAAA,QACf,eAAe;AAAA,QACf,KAAK;AAAA,QACL,iBAAiB;AAAA,UACf;AAAA,UACA;AAAA,UACA;AAAA,UACA;AAAA,QACF;AAAA,QACA,aAAa;AAAA,UACX;AAAA,UACA;AAAA,UACA;AAAA,UACA;AAAA,QACF;AAAA,QACA,YAAY;AAAA,QACZ,UAAU;AAAA,QACV,SAAS;AAAA,QACT,OAAO;AAAA,QACP,MAAM;AAAA,QACN,KAAK;AAAA,QACL,YAAY;AAAA,UACV;AAAA,UACA;AAAA,UACA;AAAA,UACA;AAAA,QACF;AAAA,QACA,OAAO;AAAA,QACP,SAAS;AAAA,QACT,UAAU;AAAA,QACV,aACE;AAAA,QACF,WAAW;AAAA,QACX,cAAc;AAAA,UACZ;AAAA,UACA;AAAA,QACF;AAAA,QACA,QAAQ;AAAA,QACR,GAAG;AAAA,MACL;AAAA,MACC,GAAG;AAAA;AAAA,EACN;AAEJ;","names":[]}

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

@@ -0,0 +1,35 @@
+import type { DateRange } from "react-day-picker";
+export interface IDatePickerProps {
+    value: Date | undefined;
+    onChange: (date: Date | undefined) => void;
+    placeholder?: string;
+    disabled?: boolean;
+    minDate?: Date;
+    maxDate?: Date;
+    /** `date-fns` format string. Defaults to `"PPP"` (long localized date). */
+    displayFormat?: string;
+    className?: string;
+    ariaLabel?: string;
+}
+/**
+ * Single-date picker. Controlled — the consumer owns `value`/`onChange`.
+ */
+export declare function DatePicker({ value, onChange, placeholder, disabled, minDate, maxDate, displayFormat, className, ariaLabel, }: IDatePickerProps): import("react").JSX.Element;
+export interface IDateRangePickerProps {
+    value: DateRange | undefined;
+    onChange: (range: DateRange | undefined) => void;
+    placeholder?: string;
+    disabled?: boolean;
+    minDate?: Date;
+    maxDate?: Date;
+    displayFormat?: string;
+    numberOfMonths?: number;
+    className?: string;
+    ariaLabel?: string;
+}
+/**
+ * Range picker built on react-day-picker's "range" mode. Displays two months
+ * side-by-side by default.
+ */
+export declare function DateRangePicker({ value, onChange, placeholder, disabled, minDate, maxDate, displayFormat, numberOfMonths, className, ariaLabel, }: IDateRangePickerProps): import("react").JSX.Element;
+//# sourceMappingURL=date-picker.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"date-picker.d.ts","sourceRoot":"","sources":["../../../../src/components/organisms/date-picker/date-picker.tsx"],"names":[],"mappings":"AAIA,OAAO,KAAK,EAAE,SAAS,EAAW,MAAM,kBAAkB,CAAC;AA4B3D,MAAM,WAAW,gBAAgB;IAC/B,KAAK,EAAE,IAAI,GAAG,SAAS,CAAC;IACxB,QAAQ,EAAE,CAAC,IAAI,EAAE,IAAI,GAAG,SAAS,KAAK,IAAI,CAAC;IAC3C,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,OAAO,CAAC,EAAE,IAAI,CAAC;IACf,OAAO,CAAC,EAAE,IAAI,CAAC;IACf,2EAA2E;IAC3E,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED;;GAEG;AACH,wBAAgB,UAAU,CAAC,EACzB,KAAK,EACL,QAAQ,EACR,WAAiC,EACjC,QAAgB,EAChB,OAAO,EACP,OAAO,EACP,aAAmC,EACnC,SAAS,EACT,SAAS,GACV,EAAE,gBAAgB,+BA+BlB;AAED,MAAM,WAAW,qBAAqB;IACpC,KAAK,EAAE,SAAS,GAAG,SAAS,CAAC;IAC7B,QAAQ,EAAE,CAAC,KAAK,EAAE,SAAS,GAAG,SAAS,KAAK,IAAI,CAAC;IACjD,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,OAAO,CAAC,EAAE,IAAI,CAAC;IACf,OAAO,CAAC,EAAE,IAAI,CAAC;IACf,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED;;;GAGG;AACH,wBAAgB,eAAe,CAAC,EAC9B,KAAK,EACL,QAAQ,EACR,WAAuC,EACvC,QAAgB,EAChB,OAAO,EACP,OAAO,EACP,aAAmC,EACnC,cAAkB,EAClB,SAAS,EACT,SAAS,GACV,EAAE,qBAAqB,+BAmCvB"}

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

@@ -0,0 +1,110 @@
+"use client";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { format } from "date-fns";
+import { useState } from "react";
+import { cn } from "../../../utils/cn.js";
+import { Popover, PopoverContent, PopoverTrigger } from "../../atoms/popover/popover.js";
+import { Button } from "../../molecules/button/button.js";
+import { Calendar } from "./calendar.js";
+function buildBoundsMatcher(minDate, maxDate) {
+  const matchers = [];
+  if (minDate) matchers.push({ before: minDate });
+  if (maxDate) matchers.push({ after: maxDate });
+  if (matchers.length === 0) return void 0;
+  if (matchers.length === 1) return matchers[0];
+  return matchers;
+}
+const DEFAULT_DATE_FORMAT = "PPP";
+const DEFAULT_PLACEHOLDER = "Pick a date";
+const DEFAULT_RANGE_PLACEHOLDER = "Pick a date range";
+function CalendarIcon() {
+  return /* @__PURE__ */ jsxs("svg", { width: "16", height: "16", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", "aria-hidden": true, children: [
+    /* @__PURE__ */ jsx("rect", { x: "3", y: "4", width: "18", height: "18", rx: "2" }),
+    /* @__PURE__ */ jsx("path", { d: "M16 2v4M8 2v4M3 10h18" })
+  ] });
+}
+function DatePicker({
+  value,
+  onChange,
+  placeholder = DEFAULT_PLACEHOLDER,
+  disabled = false,
+  minDate,
+  maxDate,
+  displayFormat = DEFAULT_DATE_FORMAT,
+  className,
+  ariaLabel
+}) {
+  const [open, setOpen] = useState(false);
+  return /* @__PURE__ */ jsxs(Popover, { open, onOpenChange: setOpen, children: [
+    /* @__PURE__ */ jsx(PopoverTrigger, { asChild: true, children: /* @__PURE__ */ jsx(
+      Button,
+      {
+        type: "button",
+        variant: "outline",
+        disabled,
+        "aria-label": ariaLabel,
+        className: cn("w-full justify-between font-normal", !value && "text-muted-foreground", className),
+        leadingIcon: /* @__PURE__ */ jsx(CalendarIcon, {}),
+        children: value ? format(value, displayFormat) : placeholder
+      }
+    ) }),
+    /* @__PURE__ */ jsx(PopoverContent, { className: "w-auto p-3", align: "start", children: /* @__PURE__ */ jsx(
+      Calendar,
+      {
+        mode: "single",
+        selected: value,
+        onSelect: (next) => {
+          onChange(next);
+          if (next) setOpen(false);
+        },
+        disabled: buildBoundsMatcher(minDate, maxDate),
+        defaultMonth: value ?? void 0
+      }
+    ) })
+  ] });
+}
+function DateRangePicker({
+  value,
+  onChange,
+  placeholder = DEFAULT_RANGE_PLACEHOLDER,
+  disabled = false,
+  minDate,
+  maxDate,
+  displayFormat = DEFAULT_DATE_FORMAT,
+  numberOfMonths = 2,
+  className,
+  ariaLabel
+}) {
+  const [open, setOpen] = useState(false);
+  const label = value?.from ? value.to ? `${format(value.from, displayFormat)} - ${format(value.to, displayFormat)}` : format(value.from, displayFormat) : placeholder;
+  return /* @__PURE__ */ jsxs(Popover, { open, onOpenChange: setOpen, children: [
+    /* @__PURE__ */ jsx(PopoverTrigger, { asChild: true, children: /* @__PURE__ */ jsx(
+      Button,
+      {
+        type: "button",
+        variant: "outline",
+        disabled,
+        "aria-label": ariaLabel,
+        className: cn("w-full justify-between font-normal", !value?.from && "text-muted-foreground", className),
+        leadingIcon: /* @__PURE__ */ jsx(CalendarIcon, {}),
+        children: label
+      }
+    ) }),
+    /* @__PURE__ */ jsx(PopoverContent, { className: "w-auto p-3", align: "start", children: /* @__PURE__ */ jsx(
+      Calendar,
+      {
+        mode: "range",
+        selected: value,
+        onSelect: onChange,
+        numberOfMonths,
+        disabled: buildBoundsMatcher(minDate, maxDate),
+        defaultMonth: value?.from ?? void 0
+      }
+    ) })
+  ] });
+}
+export {
+  DatePicker,
+  DateRangePicker
+};
+//# sourceMappingURL=date-picker.js.map

package/dist/components/organisms/date-picker/date-picker.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../src/components/organisms/date-picker/date-picker.tsx"],"sourcesContent":["\"use client\";\n\nimport { format } from \"date-fns\";\nimport { useState } from \"react\";\nimport type { DateRange, Matcher } from \"react-day-picker\";\nimport { cn } from \"../../../utils/cn.js\";\nimport { Popover, PopoverContent, PopoverTrigger } from \"../../atoms/popover/popover.js\";\nimport { Button } from \"../../molecules/button/button.js\";\nimport { Calendar } from \"./calendar.js\";\n\nfunction buildBoundsMatcher(minDate: Date | undefined, maxDate: Date | undefined): Matcher | Matcher[] | undefined {\n  const matchers: Matcher[] = [];\n  if (minDate) matchers.push({ before: minDate });\n  if (maxDate) matchers.push({ after: maxDate });\n  if (matchers.length === 0) return undefined;\n  if (matchers.length === 1) return matchers[0];\n  return matchers;\n}\n\nconst DEFAULT_DATE_FORMAT = \"PPP\";\nconst DEFAULT_PLACEHOLDER = \"Pick a date\";\nconst DEFAULT_RANGE_PLACEHOLDER = \"Pick a date range\";\n\nfunction CalendarIcon() {\n  return (\n    <svg width=\"16\" height=\"16\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" strokeWidth=\"2\" aria-hidden>\n      <rect x=\"3\" y=\"4\" width=\"18\" height=\"18\" rx=\"2\" />\n      <path d=\"M16 2v4M8 2v4M3 10h18\" />\n    </svg>\n  );\n}\n\nexport interface IDatePickerProps {\n  value: Date | undefined;\n  onChange: (date: Date | undefined) => void;\n  placeholder?: string;\n  disabled?: boolean;\n  minDate?: Date;\n  maxDate?: Date;\n  /** `date-fns` format string. Defaults to `\"PPP\"` (long localized date). */\n  displayFormat?: string;\n  className?: string;\n  ariaLabel?: string;\n}\n\n/**\n * Single-date picker. Controlled — the consumer owns `value`/`onChange`.\n */\nexport function DatePicker({\n  value,\n  onChange,\n  placeholder = DEFAULT_PLACEHOLDER,\n  disabled = false,\n  minDate,\n  maxDate,\n  displayFormat = DEFAULT_DATE_FORMAT,\n  className,\n  ariaLabel,\n}: IDatePickerProps) {\n  const [open, setOpen] = useState(false);\n\n  return (\n    <Popover open={open} onOpenChange={setOpen}>\n      <PopoverTrigger asChild>\n        <Button\n          type=\"button\"\n          variant=\"outline\"\n          disabled={disabled}\n          aria-label={ariaLabel}\n          className={cn(\"w-full justify-between font-normal\", !value && \"text-muted-foreground\", className)}\n          leadingIcon={<CalendarIcon />}\n        >\n          {value ? format(value, displayFormat) : placeholder}\n        </Button>\n      </PopoverTrigger>\n      <PopoverContent className=\"w-auto p-3\" align=\"start\">\n        <Calendar\n          mode=\"single\"\n          selected={value}\n          onSelect={(next) => {\n            onChange(next);\n            if (next) setOpen(false);\n          }}\n          disabled={buildBoundsMatcher(minDate, maxDate)}\n          defaultMonth={value ?? undefined}\n        />\n      </PopoverContent>\n    </Popover>\n  );\n}\n\nexport interface IDateRangePickerProps {\n  value: DateRange | undefined;\n  onChange: (range: DateRange | undefined) => void;\n  placeholder?: string;\n  disabled?: boolean;\n  minDate?: Date;\n  maxDate?: Date;\n  displayFormat?: string;\n  numberOfMonths?: number;\n  className?: string;\n  ariaLabel?: string;\n}\n\n/**\n * Range picker built on react-day-picker's \"range\" mode. Displays two months\n * side-by-side by default.\n */\nexport function DateRangePicker({\n  value,\n  onChange,\n  placeholder = DEFAULT_RANGE_PLACEHOLDER,\n  disabled = false,\n  minDate,\n  maxDate,\n  displayFormat = DEFAULT_DATE_FORMAT,\n  numberOfMonths = 2,\n  className,\n  ariaLabel,\n}: IDateRangePickerProps) {\n  const [open, setOpen] = useState(false);\n\n  const label = value?.from\n    ? value.to\n      ? `${format(value.from, displayFormat)} - ${format(value.to, displayFormat)}`\n      : format(value.from, displayFormat)\n    : placeholder;\n\n  return (\n    <Popover open={open} onOpenChange={setOpen}>\n      <PopoverTrigger asChild>\n        <Button\n          type=\"button\"\n          variant=\"outline\"\n          disabled={disabled}\n          aria-label={ariaLabel}\n          className={cn(\"w-full justify-between font-normal\", !value?.from && \"text-muted-foreground\", className)}\n          leadingIcon={<CalendarIcon />}\n        >\n          {label}\n        </Button>\n      </PopoverTrigger>\n      <PopoverContent className=\"w-auto p-3\" align=\"start\">\n        <Calendar\n          mode=\"range\"\n          selected={value}\n          onSelect={onChange}\n          numberOfMonths={numberOfMonths}\n          disabled={buildBoundsMatcher(minDate, maxDate)}\n          defaultMonth={value?.from ?? undefined}\n        />\n      </PopoverContent>\n    </Popover>\n  );\n}\n"],"mappings":"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","names":[]}

package/dist/components/organisms/date-picker/date-picker.stories.d.ts

@@ -0,0 +1,8 @@
+import type { Meta, StoryObj } from "@storybook/react-vite";
+declare const meta: Meta;
+export default meta;
+type Story = StoryObj;
+export declare const Single: Story;
+export declare const Range: Story;
+export declare const WithBounds: Story;
+//# sourceMappingURL=date-picker.stories.d.ts.map

package/dist/components/organisms/date-picker/date-picker.stories.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"date-picker.stories.d.ts","sourceRoot":"","sources":["../../../../src/components/organisms/date-picker/date-picker.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,IAAI,EAAE,QAAQ,EAAE,MAAM,uBAAuB,CAAC;AAK5D,QAAA,MAAM,IAAI,EAAE,IAGX,CAAC;AACF,eAAe,IAAI,CAAC;AACpB,KAAK,KAAK,GAAG,QAAQ,CAAC;AAEtB,eAAO,MAAM,MAAM,EAAE,KAYpB,CAAC;AAEF,eAAO,MAAM,KAAK,EAAE,KAcnB,CAAC;AAEF,eAAO,MAAM,UAAU,EAAE,KAaxB,CAAC"}

package/dist/components/organisms/date-picker/index.d.ts

@@ -0,0 +1,5 @@
+export { DatePicker, DateRangePicker } from "./date-picker.js";
+export type { IDatePickerProps, IDateRangePickerProps } from "./date-picker.js";
+export { Calendar } from "./calendar.js";
+export type { ICalendarProps } from "./calendar.js";
+//# sourceMappingURL=index.d.ts.map

package/dist/components/organisms/date-picker/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/organisms/date-picker/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAE,eAAe,EAAE,MAAM,kBAAkB,CAAC;AAC/D,YAAY,EAAE,gBAAgB,EAAE,qBAAqB,EAAE,MAAM,kBAAkB,CAAC;AAChF,OAAO,EAAE,QAAQ,EAAE,MAAM,eAAe,CAAC;AACzC,YAAY,EAAE,cAAc,EAAE,MAAM,eAAe,CAAC"}

package/dist/components/organisms/date-picker/index.js

@@ -0,0 +1,8 @@
+import { DatePicker, DateRangePicker } from "./date-picker.js";
+import { Calendar } from "./calendar.js";
+export {
+  Calendar,
+  DatePicker,
+  DateRangePicker
+};
+//# sourceMappingURL=index.js.map

package/dist/components/organisms/date-picker/index.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../src/components/organisms/date-picker/index.ts"],"sourcesContent":["export { DatePicker, DateRangePicker } from \"./date-picker.js\";\nexport type { IDatePickerProps, IDateRangePickerProps } from \"./date-picker.js\";\nexport { Calendar } from \"./calendar.js\";\nexport type { ICalendarProps } from \"./calendar.js\";\n"],"mappings":"AAAA,SAAS,YAAY,uBAAuB;AAE5C,SAAS,gBAAgB;","names":[]}

package/dist/components/organisms/drawer/drawer.d.ts

@@ -0,0 +1,55 @@
+import * as RadixDialog from "@radix-ui/react-dialog";
+import { type VariantProps } from "class-variance-authority";
+import { type ComponentPropsWithoutRef } from "react";
+export declare const Drawer: import("react").FC<RadixDialog.DialogProps>;
+export declare const DrawerTrigger: import("react").ForwardRefExoticComponent<RadixDialog.DialogTriggerProps & import("react").RefAttributes<HTMLButtonElement>>;
+export declare const DrawerPortal: import("react").FC<RadixDialog.DialogPortalProps>;
+export declare const DrawerClose: import("react").ForwardRefExoticComponent<RadixDialog.DialogCloseProps & import("react").RefAttributes<HTMLButtonElement>>;
+declare const drawerVariants: (props?: ({
+    side?: "top" | "right" | "bottom" | "left" | null | undefined;
+    size?: "sm" | "md" | "lg" | "xl" | null | undefined;
+} & import("class-variance-authority/types").ClassProp) | undefined) => string;
+export declare const DrawerOverlay: import("react").ForwardRefExoticComponent<Omit<RadixDialog.DialogOverlayProps & import("react").RefAttributes<HTMLDivElement>, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
+export interface IDrawerContentProps extends ComponentPropsWithoutRef<typeof RadixDialog.Content>, VariantProps<typeof drawerVariants> {
+    showCloseButton?: boolean;
+}
+export declare const DrawerContent: import("react").ForwardRefExoticComponent<IDrawerContentProps & import("react").RefAttributes<HTMLDivElement>>;
+export declare const DrawerHeader: ({ className, ...props }: ComponentPropsWithoutRef<"div">) => import("react").JSX.Element;
+export declare const DrawerBody: ({ className, ...props }: ComponentPropsWithoutRef<"div">) => import("react").JSX.Element;
+export declare const DrawerFooter: ({ className, ...props }: ComponentPropsWithoutRef<"div">) => import("react").JSX.Element;
+export declare const DrawerTitle: import("react").ForwardRefExoticComponent<Omit<RadixDialog.DialogTitleProps & import("react").RefAttributes<HTMLHeadingElement>, "ref"> & import("react").RefAttributes<HTMLHeadingElement>>;
+export declare const DrawerDescription: import("react").ForwardRefExoticComponent<Omit<RadixDialog.DialogDescriptionProps & import("react").RefAttributes<HTMLParagraphElement>, "ref"> & import("react").RefAttributes<HTMLParagraphElement>>;
+export interface IDrawerPanelProps extends Omit<ComponentPropsWithoutRef<typeof RadixDialog.Root>, "children"> {
+    title?: string;
+    description?: string;
+    side?: VariantProps<typeof drawerVariants>["side"];
+    size?: VariantProps<typeof drawerVariants>["size"];
+    /** Content rendered in the header area next to the title (filters, actions). */
+    headerExtra?: ComponentPropsWithoutRef<"div">["children"];
+    /** Footer content (e.g. primary/secondary action buttons). */
+    footer?: ComponentPropsWithoutRef<"div">["children"];
+    /** Disable the visually-hidden / rendered title. Useful when headerExtra
+     *  already provides its own heading. */
+    hideTitle?: boolean;
+    children: ComponentPropsWithoutRef<"div">["children"];
+}
+/**
+ * All-in-one drawer panel: a single component that renders the Radix Root,
+ * Overlay, Content, optional Header (title + headerExtra), Body (children),
+ * and optional Footer. Use this for the common case; drop down to
+ * `<Drawer><DrawerContent>...</DrawerContent></Drawer>` when you need full
+ * composition control.
+ *
+ * @example
+ * <DrawerPanel
+ *   open={open}
+ *   onOpenChange={setOpen}
+ *   title="Filters"
+ *   footer={<Button onClick={close}>Apply</Button>}
+ * >
+ *   <FiltersForm />
+ * </DrawerPanel>
+ */
+export declare function DrawerPanel({ title, description, side, size, headerExtra, footer, hideTitle, children, ...rootProps }: IDrawerPanelProps): import("react").JSX.Element;
+export {};
+//# sourceMappingURL=drawer.d.ts.map

package/dist/components/organisms/drawer/drawer.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"drawer.d.ts","sourceRoot":"","sources":["../../../../src/components/organisms/drawer/drawer.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,WAAW,MAAM,wBAAwB,CAAC;AACtD,OAAO,EAAO,KAAK,YAAY,EAAE,MAAM,0BAA0B,CAAC;AAClE,OAAO,EAAc,KAAK,wBAAwB,EAAmB,MAAM,OAAO,CAAC;AAGnF,eAAO,MAAM,MAAM,6CAAmB,CAAC;AACvC,eAAO,MAAM,aAAa,8HAAsB,CAAC;AACjD,eAAO,MAAM,YAAY,mDAAqB,CAAC;AAC/C,eAAO,MAAM,WAAW,4HAAoB,CAAC;AAE7C,QAAA,MAAM,cAAc;;;8EAoCnB,CAAC;AAEF,eAAO,MAAM,aAAa,wLAYxB,CAAC;AAGH,MAAM,WAAW,mBACf,SAAQ,wBAAwB,CAAC,OAAO,WAAW,CAAC,OAAO,CAAC,EAC1D,YAAY,CAAC,OAAO,cAAc,CAAC;IACrC,eAAe,CAAC,EAAE,OAAO,CAAC;CAC3B;AAUD,eAAO,MAAM,aAAa,gHAmBzB,CAAC;AAGF,eAAO,MAAM,YAAY,GAAI,yBAAyB,wBAAwB,CAAC,KAAK,CAAC,gCAEpF,CAAC;AAEF,eAAO,MAAM,UAAU,GAAI,yBAAyB,wBAAwB,CAAC,KAAK,CAAC,gCAElF,CAAC;AAEF,eAAO,MAAM,YAAY,GAAI,yBAAyB,wBAAwB,CAAC,KAAK,CAAC,gCAKpF,CAAC;AAEF,eAAO,MAAM,WAAW,8LAKtB,CAAC;AAGH,eAAO,MAAM,iBAAiB,wMAK5B,CAAC;AAGH,MAAM,WAAW,iBACf,SAAQ,IAAI,CAAC,wBAAwB,CAAC,OAAO,WAAW,CAAC,IAAI,CAAC,EAAE,UAAU,CAAC;IAC3E,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,IAAI,CAAC,EAAE,YAAY,CAAC,OAAO,cAAc,CAAC,CAAC,MAAM,CAAC,CAAC;IACnD,IAAI,CAAC,EAAE,YAAY,CAAC,OAAO,cAAc,CAAC,CAAC,MAAM,CAAC,CAAC;IACnD,gFAAgF;IAChF,WAAW,CAAC,EAAE,wBAAwB,CAAC,KAAK,CAAC,CAAC,UAAU,CAAC,CAAC;IAC1D,8DAA8D;IAC9D,MAAM,CAAC,EAAE,wBAAwB,CAAC,KAAK,CAAC,CAAC,UAAU,CAAC,CAAC;IACrD;4CACwC;IACxC,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,QAAQ,EAAE,wBAAwB,CAAC,KAAK,CAAC,CAAC,UAAU,CAAC,CAAC;CACvD;AAED;;;;;;;;;;;;;;;;GAgBG;AACH,wBAAgB,WAAW,CAAC,EAC1B,KAAK,EACL,WAAW,EACX,IAAI,EACJ,IAAI,EACJ,WAAW,EACX,MAAM,EACN,SAAS,EACT,QAAQ,EACR,GAAG,SAAS,EACb,EAAE,iBAAiB,+BAiCnB"}

package/dist/components/organisms/drawer/drawer.js

@@ -0,0 +1,137 @@
+"use client";
+import { jsx, jsxs } from "react/jsx-runtime";
+import * as RadixDialog from "@radix-ui/react-dialog";
+import { cva } from "class-variance-authority";
+import { forwardRef } from "react";
+import { cn } from "../../../utils/cn.js";
+const Drawer = RadixDialog.Root;
+const DrawerTrigger = RadixDialog.Trigger;
+const DrawerPortal = RadixDialog.Portal;
+const DrawerClose = RadixDialog.Close;
+const drawerVariants = cva(
+  "fixed z-50 flex flex-col border border-border-base bg-surface shadow-xl data-[state=open]:animate-in data-[state=closed]:animate-out",
+  {
+    variants: {
+      side: {
+        right: "inset-y-0 right-0 h-full w-80 max-w-[90vw] data-[state=closed]:slide-out-to-right data-[state=open]:slide-in-from-right",
+        left: "inset-y-0 left-0 h-full w-80 max-w-[90vw] data-[state=closed]:slide-out-to-left data-[state=open]:slide-in-from-left",
+        top: "inset-x-0 top-0 h-auto max-h-[90vh] w-full data-[state=closed]:slide-out-to-top data-[state=open]:slide-in-from-top",
+        bottom: "inset-x-0 bottom-0 h-auto max-h-[90vh] w-full data-[state=closed]:slide-out-to-bottom data-[state=open]:slide-in-from-bottom"
+      },
+      size: {
+        sm: "",
+        md: "",
+        lg: "",
+        xl: ""
+      }
+    },
+    compoundVariants: [
+      { side: ["left", "right"], size: "sm", className: "w-64" },
+      { side: ["left", "right"], size: "md", className: "w-80" },
+      { side: ["left", "right"], size: "lg", className: "w-96" },
+      { side: ["left", "right"], size: "xl", className: "w-[28rem]" },
+      { side: ["top", "bottom"], size: "sm", className: "max-h-[30vh]" },
+      { side: ["top", "bottom"], size: "md", className: "max-h-[50vh]" },
+      { side: ["top", "bottom"], size: "lg", className: "max-h-[70vh]" },
+      { side: ["top", "bottom"], size: "xl", className: "max-h-[90vh]" }
+    ],
+    defaultVariants: {
+      side: "right",
+      size: "md"
+    }
+  }
+);
+const DrawerOverlay = forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
+  RadixDialog.Overlay,
+  {
+    ref,
+    className: cn(
+      "fixed inset-0 z-50 bg-black/50 data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0",
+      className
+    ),
+    ...props
+  }
+));
+DrawerOverlay.displayName = "DrawerOverlay";
+function CloseIcon() {
+  return /* @__PURE__ */ jsx("svg", { viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: 2, className: "h-4 w-4", "aria-hidden": "true", children: /* @__PURE__ */ jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", d: "M6 18L18 6M6 6l12 12" }) });
+}
+const DrawerContent = forwardRef(
+  ({ className, side, size, showCloseButton = true, children, ...props }, ref) => /* @__PURE__ */ jsxs(DrawerPortal, { children: [
+    /* @__PURE__ */ jsx(DrawerOverlay, {}),
+    /* @__PURE__ */ jsxs(
+      RadixDialog.Content,
+      {
+        ref,
+        className: cn(drawerVariants({ side, size }), className),
+        ...props,
+        children: [
+          children,
+          showCloseButton ? /* @__PURE__ */ jsxs(RadixDialog.Close, { className: "absolute end-4 top-4 rounded-md p-1 text-muted-foreground transition-colors hover:bg-surface-muted focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring", children: [
+            /* @__PURE__ */ jsx(CloseIcon, {}),
+            /* @__PURE__ */ jsx("span", { className: "sr-only", children: "Close" })
+          ] }) : null
+        ]
+      }
+    )
+  ] })
+);
+DrawerContent.displayName = "DrawerContent";
+const DrawerHeader = ({ className, ...props }) => /* @__PURE__ */ jsx("div", { className: cn("flex flex-col gap-1.5 border-b border-border-base p-4", className), ...props });
+const DrawerBody = ({ className, ...props }) => /* @__PURE__ */ jsx("div", { className: cn("flex-1 overflow-y-auto p-4", className), ...props });
+const DrawerFooter = ({ className, ...props }) => /* @__PURE__ */ jsx(
+  "div",
+  {
+    className: cn("flex items-center justify-end gap-2 border-t border-border-base p-4", className),
+    ...props
+  }
+);
+const DrawerTitle = forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(RadixDialog.Title, { ref, className: cn("text-lg font-semibold leading-none", className), ...props }));
+DrawerTitle.displayName = "DrawerTitle";
+const DrawerDescription = forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(RadixDialog.Description, { ref, className: cn("text-sm text-muted-foreground", className), ...props }));
+DrawerDescription.displayName = "DrawerDescription";
+function DrawerPanel({
+  title,
+  description,
+  side,
+  size,
+  headerExtra,
+  footer,
+  hideTitle,
+  children,
+  ...rootProps
+}) {
+  const hasHeader = Boolean(title || description || headerExtra);
+  return /* @__PURE__ */ jsx(Drawer, { ...rootProps, children: /* @__PURE__ */ jsxs(DrawerContent, { side, size, showCloseButton: !hasHeader, children: [
+    hasHeader ? /* @__PURE__ */ jsx(DrawerHeader, { children: /* @__PURE__ */ jsxs("div", { className: "flex items-start justify-between gap-2", children: [
+      /* @__PURE__ */ jsxs("div", { className: "flex min-w-0 flex-col gap-1", children: [
+        title ? hideTitle ? /* @__PURE__ */ jsx(RadixDialog.Title, { className: "sr-only", children: title }) : /* @__PURE__ */ jsx(DrawerTitle, { children: title }) : null,
+        description ? /* @__PURE__ */ jsx(DrawerDescription, { children: description }) : null
+      ] }),
+      /* @__PURE__ */ jsxs("div", { className: "flex shrink-0 items-center gap-1", children: [
+        headerExtra,
+        /* @__PURE__ */ jsxs(RadixDialog.Close, { className: "rounded-md p-1 text-muted-foreground transition-colors hover:bg-surface-muted focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring", children: [
+          /* @__PURE__ */ jsx(CloseIcon, {}),
+          /* @__PURE__ */ jsx("span", { className: "sr-only", children: "Close" })
+        ] })
+      ] })
+    ] }) }) : null,
+    /* @__PURE__ */ jsx(DrawerBody, { children }),
+    footer ? /* @__PURE__ */ jsx(DrawerFooter, { children: footer }) : null
+  ] }) });
+}
+export {
+  Drawer,
+  DrawerBody,
+  DrawerClose,
+  DrawerContent,
+  DrawerDescription,
+  DrawerFooter,
+  DrawerHeader,
+  DrawerOverlay,
+  DrawerPanel,
+  DrawerPortal,
+  DrawerTitle,
+  DrawerTrigger
+};
+//# sourceMappingURL=drawer.js.map

package/dist/components/organisms/drawer/drawer.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../src/components/organisms/drawer/drawer.tsx"],"sourcesContent":["\"use client\";\n\nimport * as RadixDialog from \"@radix-ui/react-dialog\";\nimport { cva, type VariantProps } from \"class-variance-authority\";\nimport { forwardRef, type ComponentPropsWithoutRef, type ElementRef } from \"react\";\nimport { cn } from \"../../../utils/cn.js\";\n\nexport const Drawer = RadixDialog.Root;\nexport const DrawerTrigger = RadixDialog.Trigger;\nexport const DrawerPortal = RadixDialog.Portal;\nexport const DrawerClose = RadixDialog.Close;\n\nconst drawerVariants = cva(\n  \"fixed z-50 flex flex-col border border-border-base bg-surface shadow-xl data-[state=open]:animate-in data-[state=closed]:animate-out\",\n  {\n    variants: {\n      side: {\n        right:\n          \"inset-y-0 right-0 h-full w-80 max-w-[90vw] data-[state=closed]:slide-out-to-right data-[state=open]:slide-in-from-right\",\n        left:\n          \"inset-y-0 left-0 h-full w-80 max-w-[90vw] data-[state=closed]:slide-out-to-left data-[state=open]:slide-in-from-left\",\n        top:\n          \"inset-x-0 top-0 h-auto max-h-[90vh] w-full data-[state=closed]:slide-out-to-top data-[state=open]:slide-in-from-top\",\n        bottom:\n          \"inset-x-0 bottom-0 h-auto max-h-[90vh] w-full data-[state=closed]:slide-out-to-bottom data-[state=open]:slide-in-from-bottom\",\n      },\n      size: {\n        sm: \"\",\n        md: \"\",\n        lg: \"\",\n        xl: \"\",\n      },\n    },\n    compoundVariants: [\n      { side: [\"left\", \"right\"], size: \"sm\", className: \"w-64\" },\n      { side: [\"left\", \"right\"], size: \"md\", className: \"w-80\" },\n      { side: [\"left\", \"right\"], size: \"lg\", className: \"w-96\" },\n      { side: [\"left\", \"right\"], size: \"xl\", className: \"w-[28rem]\" },\n      { side: [\"top\", \"bottom\"], size: \"sm\", className: \"max-h-[30vh]\" },\n      { side: [\"top\", \"bottom\"], size: \"md\", className: \"max-h-[50vh]\" },\n      { side: [\"top\", \"bottom\"], size: \"lg\", className: \"max-h-[70vh]\" },\n      { side: [\"top\", \"bottom\"], size: \"xl\", className: \"max-h-[90vh]\" },\n    ],\n    defaultVariants: {\n      side: \"right\",\n      size: \"md\",\n    },\n  },\n);\n\nexport const DrawerOverlay = forwardRef<\n  ElementRef<typeof RadixDialog.Overlay>,\n  ComponentPropsWithoutRef<typeof RadixDialog.Overlay>\n>(({ className, ...props }, ref) => (\n  <RadixDialog.Overlay\n    ref={ref}\n    className={cn(\n      \"fixed inset-0 z-50 bg-black/50 data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0\",\n      className,\n    )}\n    {...props}\n  />\n));\nDrawerOverlay.displayName = \"DrawerOverlay\";\n\nexport interface IDrawerContentProps\n  extends ComponentPropsWithoutRef<typeof RadixDialog.Content>,\n    VariantProps<typeof drawerVariants> {\n  showCloseButton?: boolean;\n}\n\nfunction CloseIcon() {\n  return (\n    <svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" strokeWidth={2} className=\"h-4 w-4\" aria-hidden=\"true\">\n      <path strokeLinecap=\"round\" strokeLinejoin=\"round\" d=\"M6 18L18 6M6 6l12 12\" />\n    </svg>\n  );\n}\n\nexport const DrawerContent = forwardRef<ElementRef<typeof RadixDialog.Content>, IDrawerContentProps>(\n  ({ className, side, size, showCloseButton = true, children, ...props }, ref) => (\n    <DrawerPortal>\n      <DrawerOverlay />\n      <RadixDialog.Content\n        ref={ref}\n        className={cn(drawerVariants({ side, size }), className)}\n        {...props}\n      >\n        {children}\n        {showCloseButton ? (\n          <RadixDialog.Close className=\"absolute end-4 top-4 rounded-md p-1 text-muted-foreground transition-colors hover:bg-surface-muted focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring\">\n            <CloseIcon />\n            <span className=\"sr-only\">Close</span>\n          </RadixDialog.Close>\n        ) : null}\n      </RadixDialog.Content>\n    </DrawerPortal>\n  ),\n);\nDrawerContent.displayName = \"DrawerContent\";\n\nexport const DrawerHeader = ({ className, ...props }: ComponentPropsWithoutRef<\"div\">) => (\n  <div className={cn(\"flex flex-col gap-1.5 border-b border-border-base p-4\", className)} {...props} />\n);\n\nexport const DrawerBody = ({ className, ...props }: ComponentPropsWithoutRef<\"div\">) => (\n  <div className={cn(\"flex-1 overflow-y-auto p-4\", className)} {...props} />\n);\n\nexport const DrawerFooter = ({ className, ...props }: ComponentPropsWithoutRef<\"div\">) => (\n  <div\n    className={cn(\"flex items-center justify-end gap-2 border-t border-border-base p-4\", className)}\n    {...props}\n  />\n);\n\nexport const DrawerTitle = forwardRef<\n  ElementRef<typeof RadixDialog.Title>,\n  ComponentPropsWithoutRef<typeof RadixDialog.Title>\n>(({ className, ...props }, ref) => (\n  <RadixDialog.Title ref={ref} className={cn(\"text-lg font-semibold leading-none\", className)} {...props} />\n));\nDrawerTitle.displayName = \"DrawerTitle\";\n\nexport const DrawerDescription = forwardRef<\n  ElementRef<typeof RadixDialog.Description>,\n  ComponentPropsWithoutRef<typeof RadixDialog.Description>\n>(({ className, ...props }, ref) => (\n  <RadixDialog.Description ref={ref} className={cn(\"text-sm text-muted-foreground\", className)} {...props} />\n));\nDrawerDescription.displayName = \"DrawerDescription\";\n\nexport interface IDrawerPanelProps\n  extends Omit<ComponentPropsWithoutRef<typeof RadixDialog.Root>, \"children\"> {\n  title?: string;\n  description?: string;\n  side?: VariantProps<typeof drawerVariants>[\"side\"];\n  size?: VariantProps<typeof drawerVariants>[\"size\"];\n  /** Content rendered in the header area next to the title (filters, actions). */\n  headerExtra?: ComponentPropsWithoutRef<\"div\">[\"children\"];\n  /** Footer content (e.g. primary/secondary action buttons). */\n  footer?: ComponentPropsWithoutRef<\"div\">[\"children\"];\n  /** Disable the visually-hidden / rendered title. Useful when headerExtra\n   *  already provides its own heading. */\n  hideTitle?: boolean;\n  children: ComponentPropsWithoutRef<\"div\">[\"children\"];\n}\n\n/**\n * All-in-one drawer panel: a single component that renders the Radix Root,\n * Overlay, Content, optional Header (title + headerExtra), Body (children),\n * and optional Footer. Use this for the common case; drop down to\n * `<Drawer><DrawerContent>...</DrawerContent></Drawer>` when you need full\n * composition control.\n *\n * @example\n * <DrawerPanel\n *   open={open}\n *   onOpenChange={setOpen}\n *   title=\"Filters\"\n *   footer={<Button onClick={close}>Apply</Button>}\n * >\n *   <FiltersForm />\n * </DrawerPanel>\n */\nexport function DrawerPanel({\n  title,\n  description,\n  side,\n  size,\n  headerExtra,\n  footer,\n  hideTitle,\n  children,\n  ...rootProps\n}: IDrawerPanelProps) {\n  const hasHeader = Boolean(title || description || headerExtra);\n  return (\n    <Drawer {...rootProps}>\n      <DrawerContent side={side} size={size} showCloseButton={!hasHeader}>\n        {hasHeader ? (\n          <DrawerHeader>\n            <div className=\"flex items-start justify-between gap-2\">\n              <div className=\"flex min-w-0 flex-col gap-1\">\n                {title ? (\n                  hideTitle ? (\n                    <RadixDialog.Title className=\"sr-only\">{title}</RadixDialog.Title>\n                  ) : (\n                    <DrawerTitle>{title}</DrawerTitle>\n                  )\n                ) : null}\n                {description ? <DrawerDescription>{description}</DrawerDescription> : null}\n              </div>\n              <div className=\"flex shrink-0 items-center gap-1\">\n                {headerExtra}\n                <RadixDialog.Close className=\"rounded-md p-1 text-muted-foreground transition-colors hover:bg-surface-muted focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring\">\n                  <CloseIcon />\n                  <span className=\"sr-only\">Close</span>\n                </RadixDialog.Close>\n              </div>\n            </div>\n          </DrawerHeader>\n        ) : null}\n        <DrawerBody>{children}</DrawerBody>\n        {footer ? <DrawerFooter>{footer}</DrawerFooter> : null}\n      </DrawerContent>\n    </Drawer>\n  );\n}\n"],"mappings":"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","names":[]}