@inshorts/glint-ui 0.5.4 → 0.6.1

package/dist/date-range-picker/index.cjs

@@ -0,0 +1,375 @@
+"use client";
+"use strict";
+"use client";
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/date-range-picker/index.tsx
+var date_range_picker_exports = {};
+__export(date_range_picker_exports, {
+  DateRangePicker: () => DateRangePicker
+});
+module.exports = __toCommonJS(date_range_picker_exports);
+var import_lucide_react = require("lucide-react");
+var React = __toESM(require("react"), 1);
+
+// src/utils.ts
+var import_clsx = require("clsx");
+var import_tailwind_merge = require("tailwind-merge");
+function cn(...inputs) {
+  return (0, import_tailwind_merge.twMerge)((0, import_clsx.clsx)(inputs));
+}
+
+// src/date-range-picker/dateRange.ts
+var pad = (n) => String(n).padStart(2, "0");
+function toIsoDate(date) {
+  return `${date.getFullYear()}-${pad(date.getMonth() + 1)}-${pad(date.getDate())}`;
+}
+function fromIsoDate(value) {
+  if (!value) return null;
+  const trimmed = value.trim();
+  const match = /^(\d{4})-(\d{2})-(\d{2})$/.exec(trimmed);
+  if (!match) return null;
+  const date = new Date(
+    Number(match[1]),
+    Number(match[2]) - 1,
+    Number(match[3])
+  );
+  return toIsoDate(date) === trimmed ? date : null;
+}
+function startOfMonth(date) {
+  return new Date(date.getFullYear(), date.getMonth(), 1);
+}
+function addMonths(date, count) {
+  return new Date(date.getFullYear(), date.getMonth() + count, 1);
+}
+function addDays(date, count) {
+  return new Date(date.getFullYear(), date.getMonth(), date.getDate() + count);
+}
+function isSameDay(a, b) {
+  if (!a || !b) return false;
+  return toIsoDate(a) === toIsoDate(b);
+}
+function monthGrid(month) {
+  const first = startOfMonth(month);
+  const start = addDays(first, -first.getDay());
+  return Array.from({ length: 42 }, (_, index) => addDays(start, index));
+}
+function monthLabel(month, locale = "en-IN") {
+  return month.toLocaleDateString(locale, { month: "long", year: "numeric" });
+}
+function formatDisplay(value, locale = "en-IN") {
+  const date = fromIsoDate(value);
+  if (!date) return "";
+  return date.toLocaleDateString(locale, {
+    day: "numeric",
+    month: "short",
+    year: "numeric"
+  });
+}
+
+// src/date-range-picker/index.tsx
+var import_jsx_runtime = require("react/jsx-runtime");
+var PRESETS = [
+  {
+    label: "Today",
+    range: () => {
+      const today = toIsoDate(/* @__PURE__ */ new Date());
+      return { from: today, to: today };
+    }
+  },
+  {
+    label: "Yesterday",
+    range: () => {
+      const day = toIsoDate(addDays(/* @__PURE__ */ new Date(), -1));
+      return { from: day, to: day };
+    }
+  },
+  {
+    label: "Last 7 days",
+    range: () => ({
+      from: toIsoDate(addDays(/* @__PURE__ */ new Date(), -6)),
+      to: toIsoDate(/* @__PURE__ */ new Date())
+    })
+  },
+  {
+    label: "Last 30 days",
+    range: () => ({
+      from: toIsoDate(addDays(/* @__PURE__ */ new Date(), -29)),
+      to: toIsoDate(/* @__PURE__ */ new Date())
+    })
+  },
+  {
+    label: "This month",
+    range: () => ({
+      from: toIsoDate(startOfMonth(/* @__PURE__ */ new Date())),
+      to: toIsoDate(/* @__PURE__ */ new Date())
+    })
+  }
+];
+var WEEKDAYS = ["Su", "Mo", "Tu", "We", "Th", "Fr", "Sa"];
+function DateRangePicker({
+  value,
+  onChange,
+  disabled,
+  placeholder = "Any date",
+  className,
+  ariaLabel = "Date range"
+}) {
+  const [open, setOpen] = React.useState(false);
+  const [hovered, setHovered] = React.useState(null);
+  const [pendingFrom, setPendingFrom] = React.useState(null);
+  const rootRef = React.useRef(null);
+  const from = fromIsoDate(value.from);
+  const to = fromIsoDate(value.to);
+  const [viewMonth, setViewMonth] = React.useState(
+    () => startOfMonth(from ?? /* @__PURE__ */ new Date())
+  );
+  React.useEffect(() => {
+    if (!open) return void 0;
+    const onPointerDown = (event) => {
+      if (!rootRef.current?.contains(event.target)) setOpen(false);
+    };
+    const onKeyDown = (event) => {
+      if (event.key === "Escape") setOpen(false);
+    };
+    document.addEventListener("mousedown", onPointerDown);
+    document.addEventListener("keydown", onKeyDown);
+    return () => {
+      document.removeEventListener("mousedown", onPointerDown);
+      document.removeEventListener("keydown", onKeyDown);
+    };
+  }, [open]);
+  function openPicker() {
+    setViewMonth(startOfMonth(fromIsoDate(value.from) ?? /* @__PURE__ */ new Date()));
+    setPendingFrom(null);
+    setHovered(null);
+    setOpen(true);
+  }
+  const anchor = pendingFrom ?? (to ? null : from);
+  const previewEnd = pendingFrom ? hovered : null;
+  function rangeBounds() {
+    if (pendingFrom) {
+      if (!previewEnd) return [pendingFrom, pendingFrom];
+      return previewEnd.getTime() < pendingFrom.getTime() ? [previewEnd, pendingFrom] : [pendingFrom, previewEnd];
+    }
+    return [from, to];
+  }
+  const [rangeStart, rangeEnd] = rangeBounds();
+  function selectDay(day) {
+    if (!anchor) {
+      setPendingFrom(day);
+      onChange({ from: toIsoDate(day), to: "" });
+      return;
+    }
+    const [start, end] = day.getTime() < anchor.getTime() ? [day, anchor] : [anchor, day];
+    onChange({ from: toIsoDate(start), to: toIsoDate(end) });
+    setPendingFrom(null);
+    setHovered(null);
+    setOpen(false);
+  }
+  function onGridKeyDown(event) {
+    const offsets = {
+      ArrowLeft: -1,
+      ArrowRight: 1,
+      ArrowUp: -7,
+      ArrowDown: 7
+    };
+    const offset = offsets[event.key];
+    if (offset === void 0) return;
+    const focused = document.activeElement;
+    const iso = focused?.dataset?.day;
+    const current = fromIsoDate(iso);
+    if (!current) return;
+    event.preventDefault();
+    const next = addDays(current, offset);
+    const nextIso = toIsoDate(next);
+    if (!rootRef.current?.querySelector(`[data-day="${nextIso}"]`)) {
+      setViewMonth(startOfMonth(offset < 0 ? next : addMonths(next, -1)));
+    }
+    window.requestAnimationFrame(() => {
+      rootRef.current?.querySelector(`[data-day="${nextIso}"]`)?.focus();
+    });
+  }
+  const label = value.from || value.to ? `${formatDisplay(value.from) || "Any"} \u2192 ${formatDisplay(value.to) || "Any"}` : placeholder;
+  const today = /* @__PURE__ */ new Date();
+  function renderMonth(month) {
+    return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "w-[15.75rem] shrink-0", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "text-foreground mb-2 text-center text-sm font-medium whitespace-nowrap", children: monthLabel(month) }),
+      /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "text-muted-foreground grid grid-cols-7 text-center text-[11px]", children: WEEKDAYS.map((day) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "grid size-9 place-items-center", children: day }, day)) }),
+      /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "grid grid-cols-7", children: monthGrid(month).map((day) => {
+        const iso = toIsoDate(day);
+        const outside = day.getMonth() !== month.getMonth();
+        const isStart = isSameDay(day, rangeStart);
+        const isEnd = isSameDay(day, rangeEnd);
+        const inRange = rangeStart != null && rangeEnd != null && day.getTime() > rangeStart.getTime() && day.getTime() < rangeEnd.getTime();
+        const isToday = isSameDay(day, today);
+        return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+          "button",
+          {
+            type: "button",
+            "data-day": iso,
+            onClick: () => selectDay(day),
+            onMouseEnter: () => setHovered(day),
+            "aria-label": day.toDateString(),
+            "aria-pressed": isStart || isEnd,
+            className: cn(
+              "focus-visible:ring-ring relative grid size-9 place-items-center rounded-md text-sm transition-colors focus-visible:ring-2 focus-visible:outline-none",
+              outside ? "text-muted-foreground/50" : "text-foreground",
+              inRange && "bg-primary/10 rounded-none",
+              (isStart || isEnd) && "bg-primary text-primary-foreground font-medium",
+              // Square off the inner edge so a range reads as one bar
+              // rather than two pills with a gap.
+              isStart && rangeEnd && !isEnd && "rounded-r-none",
+              isEnd && rangeStart && !isStart && "rounded-l-none",
+              !isStart && !isEnd && "hover:bg-muted",
+              isToday && !isStart && !isEnd && "ring-border font-semibold ring-1"
+            ),
+            children: day.getDate()
+          },
+          iso
+        );
+      }) })
+    ] }, monthLabel(month));
+  }
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { ref: rootRef, className: cn("relative", className), children: [
+    /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
+      "div",
+      {
+        className: cn(
+          "border-border bg-background flex items-center rounded-md border",
+          "focus-within:ring-ring/50 focus-within:border-ring focus-within:ring-2",
+          disabled && "opacity-50"
+        ),
+        children: [
+          /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
+            "button",
+            {
+              type: "button",
+              disabled,
+              "aria-haspopup": "dialog",
+              "aria-expanded": open,
+              "aria-label": ariaLabel,
+              onClick: () => open ? setOpen(false) : openPicker(),
+              className: "flex min-w-0 flex-1 items-center gap-2 px-2 py-1.5 text-left text-sm",
+              children: [
+                /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+                  import_lucide_react.CalendarDays,
+                  {
+                    className: "text-muted-foreground size-4 shrink-0",
+                    "aria-hidden": true
+                  }
+                ),
+                /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+                  "span",
+                  {
+                    className: cn(
+                      "truncate",
+                      !value.from && !value.to && "text-muted-foreground"
+                    ),
+                    children: label
+                  }
+                )
+              ]
+            }
+          ),
+          (value.from || value.to) && !disabled ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+            "button",
+            {
+              type: "button",
+              "aria-label": "Clear date range",
+              onClick: () => {
+                onChange({ from: "", to: "" });
+                setPendingFrom(null);
+              },
+              className: "text-muted-foreground hover:text-foreground shrink-0 px-2",
+              children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_lucide_react.X, { className: "size-3.5", "aria-hidden": true })
+            }
+          ) : null
+        ]
+      }
+    ),
+    open ? /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
+      "div",
+      {
+        role: "dialog",
+        "aria-label": ariaLabel,
+        className: "border-border bg-background absolute top-full right-0 z-50 mt-1 flex w-max rounded-lg border p-3 shadow-lg",
+        children: [
+          /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "border-border mr-3 flex w-32 shrink-0 flex-col gap-0.5 border-r pr-3", children: PRESETS.map((preset) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+            "button",
+            {
+              type: "button",
+              className: "hover:bg-muted text-foreground rounded-md px-2 py-1.5 text-left text-xs",
+              onClick: () => {
+                onChange(preset.range());
+                setPendingFrom(null);
+                setOpen(false);
+              },
+              children: preset.label
+            },
+            preset.label
+          )) }),
+          /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { onKeyDown: onGridKeyDown, children: [
+            /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "mb-2 flex items-center justify-between", children: [
+              /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+                "button",
+                {
+                  type: "button",
+                  "aria-label": "Previous month",
+                  className: "hover:bg-muted text-muted-foreground hover:text-foreground rounded-md p-1.5",
+                  onClick: () => setViewMonth(addMonths(viewMonth, -1)),
+                  children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_lucide_react.ChevronLeft, { className: "size-4", "aria-hidden": true })
+                }
+              ),
+              /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+                "button",
+                {
+                  type: "button",
+                  "aria-label": "Next month",
+                  className: "hover:bg-muted text-muted-foreground hover:text-foreground rounded-md p-1.5",
+                  onClick: () => setViewMonth(addMonths(viewMonth, 1)),
+                  children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_lucide_react.ChevronRight, { className: "size-4", "aria-hidden": true })
+                }
+              )
+            ] }),
+            /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "flex gap-5", onMouseLeave: () => setHovered(null), children: [
+              renderMonth(viewMonth),
+              renderMonth(addMonths(viewMonth, 1))
+            ] })
+          ] })
+        ]
+      }
+    ) : null
+  ] });
+}
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  DateRangePicker
+});
+//# sourceMappingURL=index.cjs.map

package/dist/date-range-picker/index.cjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/date-range-picker/index.tsx","../../src/utils.ts","../../src/date-range-picker/dateRange.ts"],"sourcesContent":["\"use client\";\n\nimport { CalendarDays, ChevronLeft, ChevronRight, X } from \"lucide-react\";\nimport * as React from \"react\";\n\nimport { cn } from \"../utils\";\nimport {\n  addDays,\n  addMonths,\n  formatDisplay,\n  fromIsoDate,\n  isSameDay,\n  monthGrid,\n  monthLabel,\n  startOfMonth,\n  toIsoDate,\n} from \"./dateRange\";\n\nexport type DateRangeValue = { from: string; to: string };\n\n/**\n * A two-month range calendar.\n *\n * Two separate date fields cost two columns and read as two unrelated\n * questions when they are one: which window. They also let the pair be set\n * backwards, which returns nothing and looks like a broken filter.\n *\n * Two months rather than one because almost every range anyone picks here\n * crosses a month boundary — \"last week of July into the first of August\" is a\n * single gesture with two months visible and a paging exercise with one.\n *\n * Presets are the useful half. The common ranges are the same handful every\n * time, and picking \"Last 7 days\" out of a list beats counting backwards on a\n * grid.\n */\nconst PRESETS: { label: string; range: () => DateRangeValue }[] = [\n  {\n    label: \"Today\",\n    range: () => {\n      const today = toIsoDate(new Date());\n      return { from: today, to: today };\n    },\n  },\n  {\n    label: \"Yesterday\",\n    range: () => {\n      const day = toIsoDate(addDays(new Date(), -1));\n      return { from: day, to: day };\n    },\n  },\n  {\n    label: \"Last 7 days\",\n    range: () => ({\n      from: toIsoDate(addDays(new Date(), -6)),\n      to: toIsoDate(new Date()),\n    }),\n  },\n  {\n    label: \"Last 30 days\",\n    range: () => ({\n      from: toIsoDate(addDays(new Date(), -29)),\n      to: toIsoDate(new Date()),\n    }),\n  },\n  {\n    label: \"This month\",\n    range: () => ({\n      from: toIsoDate(startOfMonth(new Date())),\n      to: toIsoDate(new Date()),\n    }),\n  },\n];\n\nconst WEEKDAYS = [\"Su\", \"Mo\", \"Tu\", \"We\", \"Th\", \"Fr\", \"Sa\"];\n\nexport interface DateRangePickerProps {\n  value: DateRangeValue;\n  onChange: (next: DateRangeValue) => void;\n  disabled?: boolean;\n  placeholder?: string;\n  className?: string;\n  /** Names the trigger for screen readers when there is no visible label. */\n  ariaLabel?: string;\n}\n\nexport function DateRangePicker({\n  value,\n  onChange,\n  disabled,\n  placeholder = \"Any date\",\n  className,\n  ariaLabel = \"Date range\",\n}: DateRangePickerProps) {\n  const [open, setOpen] = React.useState(false);\n  const [hovered, setHovered] = React.useState<Date | null>(null);\n  /** Set while choosing the second end, so the range can preview under the cursor. */\n  const [pendingFrom, setPendingFrom] = React.useState<Date | null>(null);\n  const rootRef = React.useRef<HTMLDivElement>(null);\n\n  const from = fromIsoDate(value.from);\n  const to = fromIsoDate(value.to);\n\n  const [viewMonth, setViewMonth] = React.useState<Date>(() =>\n    startOfMonth(from ?? new Date()),\n  );\n\n  React.useEffect(() => {\n    if (!open) return undefined;\n    const onPointerDown = (event: MouseEvent) => {\n      if (!rootRef.current?.contains(event.target as Node)) setOpen(false);\n    };\n    const onKeyDown = (event: KeyboardEvent) => {\n      if (event.key === \"Escape\") setOpen(false);\n    };\n    document.addEventListener(\"mousedown\", onPointerDown);\n    document.addEventListener(\"keydown\", onKeyDown);\n    return () => {\n      document.removeEventListener(\"mousedown\", onPointerDown);\n      document.removeEventListener(\"keydown\", onKeyDown);\n    };\n  }, [open]);\n\n  /**\n   * Reopening lands on the current selection rather than wherever the view was\n   * left. Done here rather than in an effect: it is a response to an event, and\n   * setting state from an effect is what `react-hooks/set-state-in-effect`\n   * rejects — correctly, since it costs an extra render every open.\n   */\n  function openPicker() {\n    setViewMonth(startOfMonth(fromIsoDate(value.from) ?? new Date()));\n    setPendingFrom(null);\n    setHovered(null);\n    setOpen(true);\n  }\n\n  const anchor = pendingFrom ?? (to ? null : from);\n  const previewEnd = pendingFrom ? hovered : null;\n\n  function rangeBounds(): [Date | null, Date | null] {\n    if (pendingFrom) {\n      if (!previewEnd) return [pendingFrom, pendingFrom];\n      return previewEnd.getTime() < pendingFrom.getTime()\n        ? [previewEnd, pendingFrom]\n        : [pendingFrom, previewEnd];\n    }\n    return [from, to];\n  }\n\n  const [rangeStart, rangeEnd] = rangeBounds();\n\n  function selectDay(day: Date) {\n    if (!anchor) {\n      // Starting a new range. Keeping only `from` means the next click closes\n      // it, whichever side of the anchor it lands on.\n      setPendingFrom(day);\n      onChange({ from: toIsoDate(day), to: \"\" });\n      return;\n    }\n    const [start, end] =\n      day.getTime() < anchor.getTime() ? [day, anchor] : [anchor, day];\n    onChange({ from: toIsoDate(start), to: toIsoDate(end) });\n    setPendingFrom(null);\n    setHovered(null);\n    setOpen(false);\n  }\n\n  /** Arrow keys move by day/week across both months, as a calendar should. */\n  function onGridKeyDown(event: React.KeyboardEvent<HTMLDivElement>) {\n    const offsets: Record<string, number> = {\n      ArrowLeft: -1,\n      ArrowRight: 1,\n      ArrowUp: -7,\n      ArrowDown: 7,\n    };\n    const offset = offsets[event.key];\n    if (offset === undefined) return;\n    const focused = document.activeElement as HTMLElement | null;\n    const iso = focused?.dataset?.day;\n    const current = fromIsoDate(iso);\n    if (!current) return;\n    event.preventDefault();\n    const next = addDays(current, offset);\n    const nextIso = toIsoDate(next);\n    // Page the view when the move lands outside what is rendered.\n    if (!rootRef.current?.querySelector(`[data-day=\"${nextIso}\"]`)) {\n      setViewMonth(startOfMonth(offset < 0 ? next : addMonths(next, -1)));\n    }\n    window.requestAnimationFrame(() => {\n      rootRef.current\n        ?.querySelector<HTMLElement>(`[data-day=\"${nextIso}\"]`)\n        ?.focus();\n    });\n  }\n\n  const label =\n    value.from || value.to\n      ? `${formatDisplay(value.from) || \"Any\"} → ${formatDisplay(value.to) || \"Any\"}`\n      : placeholder;\n\n  const today = new Date();\n\n  function renderMonth(month: Date) {\n    return (\n      <div key={monthLabel(month)} className=\"w-[15.75rem] shrink-0\">\n        <div className=\"text-foreground mb-2 text-center text-sm font-medium whitespace-nowrap\">\n          {monthLabel(month)}\n        </div>\n        <div className=\"text-muted-foreground grid grid-cols-7 text-center text-[11px]\">\n          {WEEKDAYS.map((day) => (\n            <div key={day} className=\"grid size-9 place-items-center\">\n              {day}\n            </div>\n          ))}\n        </div>\n        <div className=\"grid grid-cols-7\">\n          {monthGrid(month).map((day) => {\n            const iso = toIsoDate(day);\n            const outside = day.getMonth() !== month.getMonth();\n            const isStart = isSameDay(day, rangeStart);\n            const isEnd = isSameDay(day, rangeEnd);\n            const inRange =\n              rangeStart != null &&\n              rangeEnd != null &&\n              day.getTime() > rangeStart.getTime() &&\n              day.getTime() < rangeEnd.getTime();\n            const isToday = isSameDay(day, today);\n\n            return (\n              <button\n                key={iso}\n                type=\"button\"\n                data-day={iso}\n                // Outside days stay clickable — clicking one is how you reach\n                // the neighbouring month without paging.\n                onClick={() => selectDay(day)}\n                onMouseEnter={() => setHovered(day)}\n                aria-label={day.toDateString()}\n                aria-pressed={isStart || isEnd}\n                className={cn(\n                  \"focus-visible:ring-ring relative grid size-9 place-items-center rounded-md text-sm transition-colors focus-visible:ring-2 focus-visible:outline-none\",\n                  outside ? \"text-muted-foreground/50\" : \"text-foreground\",\n                  inRange && \"bg-primary/10 rounded-none\",\n                  (isStart || isEnd) &&\n                    \"bg-primary text-primary-foreground font-medium\",\n                  // Square off the inner edge so a range reads as one bar\n                  // rather than two pills with a gap.\n                  isStart && rangeEnd && !isEnd && \"rounded-r-none\",\n                  isEnd && rangeStart && !isStart && \"rounded-l-none\",\n                  !isStart && !isEnd && \"hover:bg-muted\",\n                  isToday &&\n                    !isStart &&\n                    !isEnd &&\n                    \"ring-border font-semibold ring-1\",\n                )}\n              >\n                {day.getDate()}\n              </button>\n            );\n          })}\n        </div>\n      </div>\n    );\n  }\n\n  return (\n    <div ref={rootRef} className={cn(\"relative\", className)}>\n      <div\n        className={cn(\n          \"border-border bg-background flex items-center rounded-md border\",\n          \"focus-within:ring-ring/50 focus-within:border-ring focus-within:ring-2\",\n          disabled && \"opacity-50\",\n        )}\n      >\n        <button\n          type=\"button\"\n          disabled={disabled}\n          aria-haspopup=\"dialog\"\n          aria-expanded={open}\n          aria-label={ariaLabel}\n          onClick={() => (open ? setOpen(false) : openPicker())}\n          className=\"flex min-w-0 flex-1 items-center gap-2 px-2 py-1.5 text-left text-sm\"\n        >\n          <CalendarDays\n            className=\"text-muted-foreground size-4 shrink-0\"\n            aria-hidden\n          />\n          <span\n            className={cn(\n              \"truncate\",\n              !value.from && !value.to && \"text-muted-foreground\",\n            )}\n          >\n            {label}\n          </span>\n        </button>\n        {(value.from || value.to) && !disabled ? (\n          <button\n            type=\"button\"\n            aria-label=\"Clear date range\"\n            onClick={() => {\n              onChange({ from: \"\", to: \"\" });\n              setPendingFrom(null);\n            }}\n            className=\"text-muted-foreground hover:text-foreground shrink-0 px-2\"\n          >\n            <X className=\"size-3.5\" aria-hidden />\n          </button>\n        ) : null}\n      </div>\n\n      {open ? (\n        <div\n          role=\"dialog\"\n          aria-label={ariaLabel}\n          // `w-max` so the calendar sets its own width instead of inheriting\n          // the filter column, which squeezed the months until the numbers ran\n          // together. Anchored right because this sits in the last column and\n          // would otherwise open off the edge of the viewport.\n          className=\"border-border bg-background absolute top-full right-0 z-50 mt-1 flex w-max rounded-lg border p-3 shadow-lg\"\n        >\n          <div className=\"border-border mr-3 flex w-32 shrink-0 flex-col gap-0.5 border-r pr-3\">\n            {PRESETS.map((preset) => (\n              <button\n                key={preset.label}\n                type=\"button\"\n                className=\"hover:bg-muted text-foreground rounded-md px-2 py-1.5 text-left text-xs\"\n                onClick={() => {\n                  onChange(preset.range());\n                  setPendingFrom(null);\n                  setOpen(false);\n                }}\n              >\n                {preset.label}\n              </button>\n            ))}\n          </div>\n\n          <div onKeyDown={onGridKeyDown}>\n            <div className=\"mb-2 flex items-center justify-between\">\n              <button\n                type=\"button\"\n                aria-label=\"Previous month\"\n                className=\"hover:bg-muted text-muted-foreground hover:text-foreground rounded-md p-1.5\"\n                onClick={() => setViewMonth(addMonths(viewMonth, -1))}\n              >\n                <ChevronLeft className=\"size-4\" aria-hidden />\n              </button>\n              <button\n                type=\"button\"\n                aria-label=\"Next month\"\n                className=\"hover:bg-muted text-muted-foreground hover:text-foreground rounded-md p-1.5\"\n                onClick={() => setViewMonth(addMonths(viewMonth, 1))}\n              >\n                <ChevronRight className=\"size-4\" aria-hidden />\n              </button>\n            </div>\n            <div className=\"flex gap-5\" onMouseLeave={() => setHovered(null)}>\n              {renderMonth(viewMonth)}\n              {renderMonth(addMonths(viewMonth, 1))}\n            </div>\n          </div>\n        </div>\n      ) : null}\n    </div>\n  );\n}\n","import { type ClassValue, clsx } from \"clsx\";\nimport { twMerge } from \"tailwind-merge\";\n\nexport function cn(...inputs: ClassValue[]) {\n  return twMerge(clsx(inputs));\n}\n","/**\n * Date helpers for the range picker, all in local time.\n *\n * Deliberately not `toISOString()`: that converts to UTC first, so on any\n * negative-offset day it returns yesterday's date and the picker highlights the\n * wrong cell. Every value here is built and read as the local calendar day the\n * user is actually looking at.\n */\n\n/** `YYYY-MM-DD`, the value shape the filters store. */\nexport type IsoDate = string;\n\nconst pad = (n: number) => String(n).padStart(2, \"0\");\n\nexport function toIsoDate(date: Date): IsoDate {\n  return `${date.getFullYear()}-${pad(date.getMonth() + 1)}-${pad(date.getDate())}`;\n}\n\n/** Parses `YYYY-MM-DD` into a local midnight Date; null for anything else. */\nexport function fromIsoDate(value: string | null | undefined): Date | null {\n  if (!value) return null;\n  const trimmed = value.trim();\n  const match = /^(\\d{4})-(\\d{2})-(\\d{2})$/.exec(trimmed);\n  if (!match) return null;\n  const date = new Date(\n    Number(match[1]),\n    Number(match[2]) - 1,\n    Number(match[3]),\n  );\n  // Rejects 2026-02-31, which would otherwise roll silently into March.\n  return toIsoDate(date) === trimmed ? date : null;\n}\n\nexport function startOfMonth(date: Date): Date {\n  return new Date(date.getFullYear(), date.getMonth(), 1);\n}\n\nexport function addMonths(date: Date, count: number): Date {\n  return new Date(date.getFullYear(), date.getMonth() + count, 1);\n}\n\nexport function addDays(date: Date, count: number): Date {\n  return new Date(date.getFullYear(), date.getMonth(), date.getDate() + count);\n}\n\nexport function isSameDay(a: Date | null, b: Date | null): boolean {\n  if (!a || !b) return false;\n  return toIsoDate(a) === toIsoDate(b);\n}\n\n/**\n * The six-week grid for a month, Sunday-first, padded with the neighbouring\n * months so every row has seven cells.\n *\n * Always six rows, never five: a grid that changes height as you page through\n * months makes everything below it jump.\n */\nexport function monthGrid(month: Date): Date[] {\n  const first = startOfMonth(month);\n  const start = addDays(first, -first.getDay());\n  return Array.from({ length: 42 }, (_, index) => addDays(start, index));\n}\n\nexport function monthLabel(month: Date, locale = \"en-IN\"): string {\n  return month.toLocaleDateString(locale, { month: \"long\", year: \"numeric\" });\n}\n\n/** Human form for the trigger — \"22 Aug 2026\". */\nexport function formatDisplay(value: string, locale = \"en-IN\"): string {\n  const date = fromIsoDate(value);\n  if (!date) return \"\";\n  return date.toLocaleDateString(locale, {\n    day: \"numeric\",\n    month: \"short\",\n    year: \"numeric\",\n  });\n}\n\nexport function startOfDayMs(value: string): number {\n  const date = fromIsoDate(value);\n  return date ? date.getTime() : 0;\n}\n\n/**\n * The end of a day as milliseconds.\n *\n * A range picked as whole days has to include everything created on the last\n * day, so \"to\" means 23:59:59.999 rather than that morning's midnight — which\n * would drop a whole day of cards without saying so.\n */\nexport function endOfDayMs(value: string): number {\n  const date = fromIsoDate(value);\n  if (!date) return 0;\n  return new Date(\n    date.getFullYear(),\n    date.getMonth(),\n    date.getDate(),\n    23,\n    59,\n    59,\n    999,\n  ).getTime();\n}\n\n/**\n * 11:59 PM on that local day, as 23:59:59.\n *\n * The next midnight is already the following date, and the feed includes that\n * whole day — so the 28th through the 28th came back with the 29th. Stopping\n * at 11:59 PM keeps the end on the day that was picked.\n */\nexport function endAt2359Ms(value: string): number {\n  const date = fromIsoDate(value);\n  if (!date) return 0;\n  return new Date(\n    date.getFullYear(),\n    date.getMonth(),\n    date.getDate(),\n    23,\n    59,\n    59,\n    0,\n  ).getTime();\n}\n\n/**\n * Created-date window for the feed.\n *\n * A blank end means the start day, so one selected date is that whole day.\n * `end_time` is 11:59 PM on the end date.\n */\nexport function createdRangeMs(\n  from: string,\n  to: string,\n): { start_time: number; end_time: number } {\n  const startDate = from.trim() || to.trim();\n  const endDate = to.trim() || from.trim();\n  return {\n    start_time: startOfDayMs(startDate),\n    end_time: endAt2359Ms(endDate),\n  };\n}\n"],"mappings":"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","names":[]}

package/dist/date-range-picker/index.d.cts

@@ -0,0 +1,18 @@
+import * as React from 'react';
+
+type DateRangeValue = {
+    from: string;
+    to: string;
+};
+interface DateRangePickerProps {
+    value: DateRangeValue;
+    onChange: (next: DateRangeValue) => void;
+    disabled?: boolean;
+    placeholder?: string;
+    className?: string;
+    /** Names the trigger for screen readers when there is no visible label. */
+    ariaLabel?: string;
+}
+declare function DateRangePicker({ value, onChange, disabled, placeholder, className, ariaLabel, }: DateRangePickerProps): React.JSX.Element;
+
+export { DateRangePicker, type DateRangePickerProps, type DateRangeValue };

package/dist/date-range-picker/index.d.ts

@@ -0,0 +1,18 @@
+import * as React from 'react';
+
+type DateRangeValue = {
+    from: string;
+    to: string;
+};
+interface DateRangePickerProps {
+    value: DateRangeValue;
+    onChange: (next: DateRangeValue) => void;
+    disabled?: boolean;
+    placeholder?: string;
+    className?: string;
+    /** Names the trigger for screen readers when there is no visible label. */
+    ariaLabel?: string;
+}
+declare function DateRangePicker({ value, onChange, disabled, placeholder, className, ariaLabel, }: DateRangePickerProps): React.JSX.Element;
+
+export { DateRangePicker, type DateRangePickerProps, type DateRangeValue };

package/dist/date-range-picker/index.js

@@ -0,0 +1,10 @@
+"use client";
+import {
+  DateRangePicker
+} from "../chunk-T2KXVH3O.js";
+import "../chunk-MUPW2TFJ.js";
+import "../chunk-HCA5ODCD.js";
+export {
+  DateRangePicker
+};
+//# sourceMappingURL=index.js.map

package/dist/date-range-picker/index.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":[],"sourcesContent":[],"mappings":"","names":[]}

package/dist/dialogLayer.cjs

@@ -0,0 +1,121 @@
+"use client";
+"use strict";
+"use client";
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/dialogLayer.ts
+var dialogLayer_exports = {};
+__export(dialogLayer_exports, {
+  useDialogLayer: () => useDialogLayer
+});
+module.exports = __toCommonJS(dialogLayer_exports);
+var React = __toESM(require("react"), 1);
+var layers = [];
+var FOCUSABLE = [
+  "a[href]",
+  "button:not([disabled])",
+  "input:not([disabled])",
+  "select:not([disabled])",
+  "textarea:not([disabled])",
+  '[tabindex]:not([tabindex="-1"])'
+].join(",");
+function isVisible(element) {
+  if (element.closest("[hidden]")) return false;
+  if (element.getAttribute("aria-hidden") === "true") return false;
+  return typeof element.checkVisibility === "function" ? element.checkVisibility() : true;
+}
+function focusableWithin(container) {
+  return Array.from(container.querySelectorAll(FOCUSABLE)).filter(
+    isVisible
+  );
+}
+function useDialogLayer({
+  active,
+  containerRef,
+  onEscape
+}) {
+  const escapeRef = React.useRef(onEscape);
+  React.useEffect(() => {
+    escapeRef.current = onEscape;
+  });
+  React.useEffect(() => {
+    if (!active) return;
+    const layer = /* @__PURE__ */ Symbol("dialog-layer");
+    layers.push(layer);
+    const isTopLayer = () => layers[layers.length - 1] === layer;
+    const previouslyFocused = document.activeElement instanceof HTMLElement ? document.activeElement : null;
+    const container = containerRef.current;
+    if (container && !container.contains(document.activeElement)) {
+      const [first] = focusableWithin(container);
+      (container.hasAttribute("tabindex") ? container : first)?.focus();
+    }
+    function handleKeyDown(event) {
+      if (!isTopLayer()) return;
+      if (event.key === "Escape") {
+        escapeRef.current?.();
+        return;
+      }
+      if (event.key !== "Tab") return;
+      const panel = containerRef.current;
+      if (!panel) return;
+      const items = focusableWithin(panel);
+      if (items.length === 0) {
+        event.preventDefault();
+        panel.focus();
+        return;
+      }
+      const first = items[0];
+      const last = items[items.length - 1];
+      const active2 = document.activeElement;
+      const outside = !panel.contains(active2);
+      if (event.shiftKey && (active2 === first || outside)) {
+        event.preventDefault();
+        last.focus();
+      } else if (!event.shiftKey && (active2 === last || outside)) {
+        event.preventDefault();
+        first.focus();
+      }
+    }
+    document.addEventListener("keydown", handleKeyDown);
+    const previousOverflow = document.body.style.overflow;
+    document.body.style.overflow = "hidden";
+    return () => {
+      document.removeEventListener("keydown", handleKeyDown);
+      document.body.style.overflow = previousOverflow;
+      const index = layers.indexOf(layer);
+      if (index !== -1) layers.splice(index, 1);
+      if (previouslyFocused?.isConnected) previouslyFocused.focus();
+    };
+  }, [active, containerRef]);
+}
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  useDialogLayer
+});
+//# sourceMappingURL=dialogLayer.cjs.map

package/dist/dialogLayer.cjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/dialogLayer.ts"],"sourcesContent":["\"use client\";\n\nimport * as React from \"react\";\n\n/**\n * The keyboard and focus behaviour every dialog needs, in one place.\n *\n * `Modal` and `SideDrawer` each had a copy of the scroll lock and an Escape\n * handler, and neither did anything about focus: opening a dialog left focus\n * on the button behind it, Tab walked the page underneath — through the\n * full-screen backdrop button, among other things — and closing left focus\n * wherever it had wandered. That is the whole keyboard story for thirty\n * dialogs, so it is fixed once here rather than thirty times.\n */\n\n/**\n * Open dialogs, innermost last.\n *\n * Nesting is real here — \"Create audience group\" opens on top of \"Send\n * notification\" — and without an ordering both would answer the same Escape\n * and fight over the same Tab. Only the top layer acts.\n */\nconst layers: symbol[] = [];\n\nconst FOCUSABLE = [\n  \"a[href]\",\n  \"button:not([disabled])\",\n  \"input:not([disabled])\",\n  \"select:not([disabled])\",\n  \"textarea:not([disabled])\",\n  '[tabindex]:not([tabindex=\"-1\"])',\n].join(\",\");\n\n/**\n * Deliberately not `offsetParent` or `getClientRects`: the first is null for\n * anything `position: fixed`, which a dialog panel usually is, and the second\n * is empty for *everything* under a test renderer that does no layout — which\n * would collapse the trap to \"no focusable elements\" in every test.\n */\nfunction isVisible(element: HTMLElement): boolean {\n  if (element.closest(\"[hidden]\")) return false;\n  if (element.getAttribute(\"aria-hidden\") === \"true\") return false;\n  return typeof element.checkVisibility === \"function\"\n    ? element.checkVisibility()\n    : true;\n}\n\nfunction focusableWithin(container: HTMLElement): HTMLElement[] {\n  return Array.from(container.querySelectorAll<HTMLElement>(FOCUSABLE)).filter(\n    isVisible,\n  );\n}\n\nexport function useDialogLayer({\n  active,\n  containerRef,\n  onEscape,\n}: {\n  active: boolean;\n  /** The panel. Focus is moved into it and kept inside it. */\n  containerRef: React.RefObject<HTMLElement | null>;\n  /** Called on Escape, only while this is the top layer. Omit to ignore it. */\n  onEscape?: () => void;\n}): void {\n  // Read through a ref so a caller passing a fresh closure every render does\n  // not tear the listener down and rebuild it on every keystroke.\n  const escapeRef = React.useRef(onEscape);\n  React.useEffect(() => {\n    escapeRef.current = onEscape;\n  });\n\n  React.useEffect(() => {\n    if (!active) return;\n\n    const layer = Symbol(\"dialog-layer\");\n    layers.push(layer);\n    const isTopLayer = () => layers[layers.length - 1] === layer;\n\n    const previouslyFocused =\n      document.activeElement instanceof HTMLElement\n        ? document.activeElement\n        : null;\n\n    const container = containerRef.current;\n    // Something inside may have claimed focus already — an `autoFocus` input —\n    // and that choice is better than any this could make.\n    if (container && !container.contains(document.activeElement)) {\n      const [first] = focusableWithin(container);\n      // The panel itself, not its first control: the first control is a Delete\n      // button often enough that focusing it would put a destructive action\n      // one Enter away from an accidental keypress.\n      (container.hasAttribute(\"tabindex\") ? container : first)?.focus();\n    }\n\n    function handleKeyDown(event: KeyboardEvent) {\n      if (!isTopLayer()) return;\n\n      if (event.key === \"Escape\") {\n        escapeRef.current?.();\n        return;\n      }\n\n      if (event.key !== \"Tab\") return;\n      const panel = containerRef.current;\n      if (!panel) return;\n\n      const items = focusableWithin(panel);\n      if (items.length === 0) {\n        event.preventDefault();\n        panel.focus();\n        return;\n      }\n\n      const first = items[0]!;\n      const last = items[items.length - 1]!;\n      const active = document.activeElement;\n      const outside = !panel.contains(active);\n\n      if (event.shiftKey && (active === first || outside)) {\n        event.preventDefault();\n        last.focus();\n      } else if (!event.shiftKey && (active === last || outside)) {\n        event.preventDefault();\n        first.focus();\n      }\n    }\n\n    document.addEventListener(\"keydown\", handleKeyDown);\n    const previousOverflow = document.body.style.overflow;\n    document.body.style.overflow = \"hidden\";\n\n    return () => {\n      document.removeEventListener(\"keydown\", handleKeyDown);\n      document.body.style.overflow = previousOverflow;\n      const index = layers.indexOf(layer);\n      if (index !== -1) layers.splice(index, 1);\n      // Back where it came from, so closing a dialog opened by keyboard does\n      // not drop the caret at the top of the document.\n      if (previouslyFocused?.isConnected) previouslyFocused.focus();\n    };\n  }, [active, containerRef]);\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA,YAAuB;AAoBvB,IAAM,SAAmB,CAAC;AAE1B,IAAM,YAAY;AAAA,EAChB;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,EAAE,KAAK,GAAG;AAQV,SAAS,UAAU,SAA+B;AAChD,MAAI,QAAQ,QAAQ,UAAU,EAAG,QAAO;AACxC,MAAI,QAAQ,aAAa,aAAa,MAAM,OAAQ,QAAO;AAC3D,SAAO,OAAO,QAAQ,oBAAoB,aACtC,QAAQ,gBAAgB,IACxB;AACN;AAEA,SAAS,gBAAgB,WAAuC;AAC9D,SAAO,MAAM,KAAK,UAAU,iBAA8B,SAAS,CAAC,EAAE;AAAA,IACpE;AAAA,EACF;AACF;AAEO,SAAS,eAAe;AAAA,EAC7B;AAAA,EACA;AAAA,EACA;AACF,GAMS;AAGP,QAAM,YAAkB,aAAO,QAAQ;AACvC,EAAM,gBAAU,MAAM;AACpB,cAAU,UAAU;AAAA,EACtB,CAAC;AAED,EAAM,gBAAU,MAAM;AACpB,QAAI,CAAC,OAAQ;AAEb,UAAM,QAAQ,uBAAO,cAAc;AACnC,WAAO,KAAK,KAAK;AACjB,UAAM,aAAa,MAAM,OAAO,OAAO,SAAS,CAAC,MAAM;AAEvD,UAAM,oBACJ,SAAS,yBAAyB,cAC9B,SAAS,gBACT;AAEN,UAAM,YAAY,aAAa;AAG/B,QAAI,aAAa,CAAC,UAAU,SAAS,SAAS,aAAa,GAAG;AAC5D,YAAM,CAAC,KAAK,IAAI,gBAAgB,SAAS;AAIzC,OAAC,UAAU,aAAa,UAAU,IAAI,YAAY,QAAQ,MAAM;AAAA,IAClE;AAEA,aAAS,cAAc,OAAsB;AAC3C,UAAI,CAAC,WAAW,EAAG;AAEnB,UAAI,MAAM,QAAQ,UAAU;AAC1B,kBAAU,UAAU;AACpB;AAAA,MACF;AAEA,UAAI,MAAM,QAAQ,MAAO;AACzB,YAAM,QAAQ,aAAa;AAC3B,UAAI,CAAC,MAAO;AAEZ,YAAM,QAAQ,gBAAgB,KAAK;AACnC,UAAI,MAAM,WAAW,GAAG;AACtB,cAAM,eAAe;AACrB,cAAM,MAAM;AACZ;AAAA,MACF;AAEA,YAAM,QAAQ,MAAM,CAAC;AACrB,YAAM,OAAO,MAAM,MAAM,SAAS,CAAC;AACnC,YAAMA,UAAS,SAAS;AACxB,YAAM,UAAU,CAAC,MAAM,SAASA,OAAM;AAEtC,UAAI,MAAM,aAAaA,YAAW,SAAS,UAAU;AACnD,cAAM,eAAe;AACrB,aAAK,MAAM;AAAA,MACb,WAAW,CAAC,MAAM,aAAaA,YAAW,QAAQ,UAAU;AAC1D,cAAM,eAAe;AACrB,cAAM,MAAM;AAAA,MACd;AAAA,IACF;AAEA,aAAS,iBAAiB,WAAW,aAAa;AAClD,UAAM,mBAAmB,SAAS,KAAK,MAAM;AAC7C,aAAS,KAAK,MAAM,WAAW;AAE/B,WAAO,MAAM;AACX,eAAS,oBAAoB,WAAW,aAAa;AACrD,eAAS,KAAK,MAAM,WAAW;AAC/B,YAAM,QAAQ,OAAO,QAAQ,KAAK;AAClC,UAAI,UAAU,GAAI,QAAO,OAAO,OAAO,CAAC;AAGxC,UAAI,mBAAmB,YAAa,mBAAkB,MAAM;AAAA,IAC9D;AAAA,EACF,GAAG,CAAC,QAAQ,YAAY,CAAC;AAC3B;","names":["active"]}

package/dist/dialogLayer.d.cts

@@ -0,0 +1,11 @@
+import * as React from 'react';
+
+declare function useDialogLayer({ active, containerRef, onEscape, }: {
+    active: boolean;
+    /** The panel. Focus is moved into it and kept inside it. */
+    containerRef: React.RefObject<HTMLElement | null>;
+    /** Called on Escape, only while this is the top layer. Omit to ignore it. */
+    onEscape?: () => void;
+}): void;
+
+export { useDialogLayer };

package/dist/dialogLayer.d.ts

@@ -0,0 +1,11 @@
+import * as React from 'react';
+
+declare function useDialogLayer({ active, containerRef, onEscape, }: {
+    active: boolean;
+    /** The panel. Focus is moved into it and kept inside it. */
+    containerRef: React.RefObject<HTMLElement | null>;
+    /** Called on Escape, only while this is the top layer. Omit to ignore it. */
+    onEscape?: () => void;
+}): void;
+
+export { useDialogLayer };

package/dist/dialogLayer.js

@@ -0,0 +1,8 @@
+"use client";
+import {
+  useDialogLayer
+} from "./chunk-HBBOR43A.js";
+export {
+  useDialogLayer
+};
+//# sourceMappingURL=dialogLayer.js.map

package/dist/dialogLayer.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":[],"sourcesContent":[],"mappings":"","names":[]}