@epilot/spark-ui 1.0.0-alpha.2 → 1.0.0-alpha.3

package/dist/components/separator.js

@@ -0,0 +1,35 @@
+"use client";
+import { cn } from "../utils/cn.js";
+import * as React$1 from "react";
+import { jsx, jsxs } from "react/jsx-runtime";
+//#region src/components/separator.tsx
+const Separator = React$1.forwardRef(({ className, orientation = "horizontal", decorative, children, ...props }, ref) => {
+	const isDecorative = decorative ?? !children;
+	if (children) return /* @__PURE__ */ jsxs("div", {
+		className: cn("flex items-center gap-4", className),
+		"data-orientation": orientation,
+		ref,
+		role: isDecorative ? "none" : "separator",
+		...props,
+		children: [
+			/* @__PURE__ */ jsx("div", { className: "h-px flex-1 border-t border-gray" }),
+			/* @__PURE__ */ jsx("span", {
+				className: "shrink-0 text-sm text-gray-light",
+				children
+			}),
+			/* @__PURE__ */ jsx("div", { className: "h-px flex-1 border-t border-gray" })
+		]
+	});
+	return /* @__PURE__ */ jsx("div", {
+		className: cn("shrink-0 border-t border-gray", orientation === "horizontal" ? "h-px w-full" : "h-full w-px", className),
+		"data-orientation": orientation,
+		ref,
+		role: isDecorative ? "none" : "separator",
+		...props
+	});
+});
+Separator.displayName = "Separator";
+//#endregion
+export { Separator };
+
+//# sourceMappingURL=separator.js.map

package/dist/components/separator.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"separator.js","names":["React"],"sources":["../../src/components/separator.tsx"],"sourcesContent":["import * as React from 'react'\nimport { cn } from '../utils/cn'\n\ninterface SeparatorProps extends React.HTMLAttributes<HTMLDivElement> {\n  orientation?: 'horizontal' | 'vertical'\n  decorative?: boolean\n}\n\nconst Separator = React.forwardRef<HTMLDivElement, SeparatorProps>(\n  (\n    { className, orientation = 'horizontal', decorative, children, ...props },\n    ref,\n  ) => {\n    // A labeled divider (e.g. \"OR\") conveys meaning, so default it to\n    // role=\"separator\" unless the caller opts back into decorative.\n    const isDecorative = decorative ?? !children\n\n    if (children) {\n      return (\n        <div\n          className={cn('flex items-center gap-4', className)}\n          data-orientation={orientation}\n          ref={ref}\n          role={isDecorative ? 'none' : 'separator'}\n          {...props}\n        >\n          <div className=\"h-px flex-1 border-t border-gray\" />\n          <span className=\"shrink-0 text-sm text-gray-light\">{children}</span>\n          <div className=\"h-px flex-1 border-t border-gray\" />\n        </div>\n      )\n    }\n\n    return (\n      <div\n        className={cn(\n          'shrink-0 border-t border-gray',\n          orientation === 'horizontal' ? 'h-px w-full' : 'h-full w-px',\n          className,\n        )}\n        data-orientation={orientation}\n        ref={ref}\n        role={isDecorative ? 'none' : 'separator'}\n        {...props}\n      />\n    )\n  },\n)\n\nSeparator.displayName = 'Separator'\n\nexport { Separator }\nexport type { SeparatorProps }\n"],"mappings":";;;;;AAQA,MAAM,YAAYA,QAAM,YAEpB,EAAE,WAAW,cAAc,cAAc,YAAY,UAAU,GAAG,SAClE,QACG;CAGH,MAAM,eAAe,cAAc,CAAC;AAEpC,KAAI,SACF,QACE,qBAAC,OAAD;EACE,WAAW,GAAG,2BAA2B,UAAU;EACnD,oBAAkB;EACb;EACL,MAAM,eAAe,SAAS;EAC9B,GAAI;YALN;GAOE,oBAAC,OAAD,EAAK,WAAU,oCAAqC,CAAA;GACpD,oBAAC,QAAD;IAAM,WAAU;IAAoC;IAAgB,CAAA;GACpE,oBAAC,OAAD,EAAK,WAAU,oCAAqC,CAAA;GAChD;;AAIV,QACE,oBAAC,OAAD;EACE,WAAW,GACT,iCACA,gBAAgB,eAAe,gBAAgB,eAC/C,UACD;EACD,oBAAkB;EACb;EACL,MAAM,eAAe,SAAS;EAC9B,GAAI;EACJ,CAAA;EAGP;AAED,UAAU,cAAc"}

package/dist/components/series-legend.cjs

@@ -0,0 +1,39 @@
+"use client";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+require("../chunk-aJGBMT86.cjs");
+let react_jsx_runtime = require("react/jsx-runtime");
+let cnfast = require("cnfast");
+//#region src/components/series-legend.tsx
+function SeriesLegend({ ariaLabel = "Filter data series", className, hiddenIds, items, onToggle }) {
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+		role: "group",
+		"aria-label": ariaLabel,
+		className: (0, cnfast.cn)("flex flex-wrap gap-x-4 gap-y-1.5", className),
+		children: items.map((item) => {
+			const hidden = hiddenIds.has(item.id);
+			return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("button", {
+				type: "button",
+				onClick: () => onToggle(item.id),
+				"aria-pressed": !hidden,
+				"aria-label": `${item.label}, ${hidden ? "hidden" : "shown"}`,
+				className: (0, cnfast.cn)("flex cursor-pointer items-center gap-1.5 rounded-sm text-xs text-gray-light transition-opacity hover:text-gray focus-visible:ring focus-visible:ring-offset-2 focus-visible:outline-hidden", hidden && "opacity-40"),
+				children: [item.marker === "dashed-line" ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+					"aria-hidden": "true",
+					className: "w-3 shrink-0 border-t-2 border-dashed",
+					style: { borderColor: item.color }
+				}) : /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+					"aria-hidden": "true",
+					className: "size-2.5 shrink-0 rounded-circle",
+					style: { backgroundColor: item.color }
+				}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+					className: (0, cnfast.cn)(hidden && "line-through"),
+					children: item.label
+				})]
+			}, item.id);
+		})
+	});
+}
+//#endregion
+exports.SeriesLegend = SeriesLegend;
+
+//# sourceMappingURL=series-legend.cjs.map

package/dist/components/series-legend.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"series-legend.cjs","names":[],"sources":["../../src/components/series-legend.tsx"],"sourcesContent":["import { cn } from '../utils/cn'\n\nexport interface SeriesLegendItem {\n  id: string\n  label: string\n  /** CSS color value applied inline (e.g. `var(--orange-a9)` or `#f00`). */\n  color: string\n  /** Swatch shape: `dot` (default) for bar/area series, `dashed-line` for line overlays. */\n  marker?: 'dot' | 'dashed-line'\n}\n\ninterface SeriesLegendProps {\n  items: SeriesLegendItem[]\n  hiddenIds: ReadonlySet<string>\n  onToggle: (id: string) => void\n  className?: string\n  /** Accessible label announced for the legend group. */\n  ariaLabel?: string\n}\n\nexport function SeriesLegend({\n  ariaLabel = 'Filter data series',\n  className,\n  hiddenIds,\n  items,\n  onToggle,\n}: SeriesLegendProps) {\n  return (\n    <div\n      role=\"group\"\n      aria-label={ariaLabel}\n      className={cn('flex flex-wrap gap-x-4 gap-y-1.5', className)}\n    >\n      {items.map((item) => {\n        const hidden = hiddenIds.has(item.id)\n        return (\n          <button\n            key={item.id}\n            type=\"button\"\n            onClick={() => onToggle(item.id)}\n            aria-pressed={!hidden}\n            aria-label={`${item.label}, ${hidden ? 'hidden' : 'shown'}`}\n            className={cn(\n              'flex cursor-pointer items-center gap-1.5 rounded-sm text-xs text-gray-light transition-opacity hover:text-gray focus-visible:ring focus-visible:ring-offset-2 focus-visible:outline-hidden',\n              hidden && 'opacity-40',\n            )}\n          >\n            {item.marker === 'dashed-line' ? (\n              <span\n                aria-hidden=\"true\"\n                className=\"w-3 shrink-0 border-t-2 border-dashed\"\n                style={{ borderColor: item.color }}\n              />\n            ) : (\n              <span\n                aria-hidden=\"true\"\n                className=\"size-2.5 shrink-0 rounded-circle\"\n                style={{ backgroundColor: item.color }}\n              />\n            )}\n            <span className={cn(hidden && 'line-through')}>{item.label}</span>\n          </button>\n        )\n      })}\n    </div>\n  )\n}\n"],"mappings":";;;;;;AAoBA,SAAgB,aAAa,EAC3B,YAAY,sBACZ,WACA,WACA,OACA,YACoB;AACpB,QACE,iBAAA,GAAA,kBAAA,KAAC,OAAD;EACE,MAAK;EACL,cAAY;EACZ,YAAA,GAAA,OAAA,IAAc,oCAAoC,UAAU;YAE3D,MAAM,KAAK,SAAS;GACnB,MAAM,SAAS,UAAU,IAAI,KAAK,GAAG;AACrC,UACE,iBAAA,GAAA,kBAAA,MAAC,UAAD;IAEE,MAAK;IACL,eAAe,SAAS,KAAK,GAAG;IAChC,gBAAc,CAAC;IACf,cAAY,GAAG,KAAK,MAAM,IAAI,SAAS,WAAW;IAClD,YAAA,GAAA,OAAA,IACE,8LACA,UAAU,aACX;cATH,CAWG,KAAK,WAAW,gBACf,iBAAA,GAAA,kBAAA,KAAC,QAAD;KACE,eAAY;KACZ,WAAU;KACV,OAAO,EAAE,aAAa,KAAK,OAAO;KAClC,CAAA,GAEF,iBAAA,GAAA,kBAAA,KAAC,QAAD;KACE,eAAY;KACZ,WAAU;KACV,OAAO,EAAE,iBAAiB,KAAK,OAAO;KACtC,CAAA,EAEJ,iBAAA,GAAA,kBAAA,KAAC,QAAD;KAAM,YAAA,GAAA,OAAA,IAAc,UAAU,eAAe;eAAG,KAAK;KAAa,CAAA,CAC3D;MAxBF,KAAK,GAwBH;IAEX;EACE,CAAA"}

package/dist/components/series-legend.d.cts

@@ -0,0 +1,31 @@
+"use client";
+
+import * as _$react_jsx_runtime0 from "react/jsx-runtime";
+
+//#region src/components/series-legend.d.ts
+interface SeriesLegendItem {
+  id: string;
+  label: string;
+  /** CSS color value applied inline (e.g. `var(--orange-a9)` or `#f00`). */
+  color: string;
+  /** Swatch shape: `dot` (default) for bar/area series, `dashed-line` for line overlays. */
+  marker?: 'dot' | 'dashed-line';
+}
+interface SeriesLegendProps {
+  items: SeriesLegendItem[];
+  hiddenIds: ReadonlySet<string>;
+  onToggle: (id: string) => void;
+  className?: string;
+  /** Accessible label announced for the legend group. */
+  ariaLabel?: string;
+}
+declare function SeriesLegend({
+  ariaLabel,
+  className,
+  hiddenIds,
+  items,
+  onToggle
+}: SeriesLegendProps): _$react_jsx_runtime0.JSX.Element;
+//#endregion
+export { SeriesLegend, SeriesLegendItem };
+//# sourceMappingURL=series-legend.d.cts.map

package/dist/components/series-legend.d.ts

@@ -0,0 +1,31 @@
+"use client";
+
+import * as _$react_jsx_runtime0 from "react/jsx-runtime";
+
+//#region src/components/series-legend.d.ts
+interface SeriesLegendItem {
+  id: string;
+  label: string;
+  /** CSS color value applied inline (e.g. `var(--orange-a9)` or `#f00`). */
+  color: string;
+  /** Swatch shape: `dot` (default) for bar/area series, `dashed-line` for line overlays. */
+  marker?: 'dot' | 'dashed-line';
+}
+interface SeriesLegendProps {
+  items: SeriesLegendItem[];
+  hiddenIds: ReadonlySet<string>;
+  onToggle: (id: string) => void;
+  className?: string;
+  /** Accessible label announced for the legend group. */
+  ariaLabel?: string;
+}
+declare function SeriesLegend({
+  ariaLabel,
+  className,
+  hiddenIds,
+  items,
+  onToggle
+}: SeriesLegendProps): _$react_jsx_runtime0.JSX.Element;
+//#endregion
+export { SeriesLegend, SeriesLegendItem };
+//# sourceMappingURL=series-legend.d.ts.map

package/dist/components/series-legend.js

@@ -0,0 +1,37 @@
+"use client";
+import { cn } from "../utils/cn.js";
+import { jsx, jsxs } from "react/jsx-runtime";
+//#region src/components/series-legend.tsx
+function SeriesLegend({ ariaLabel = "Filter data series", className, hiddenIds, items, onToggle }) {
+	return /* @__PURE__ */ jsx("div", {
+		role: "group",
+		"aria-label": ariaLabel,
+		className: cn("flex flex-wrap gap-x-4 gap-y-1.5", className),
+		children: items.map((item) => {
+			const hidden = hiddenIds.has(item.id);
+			return /* @__PURE__ */ jsxs("button", {
+				type: "button",
+				onClick: () => onToggle(item.id),
+				"aria-pressed": !hidden,
+				"aria-label": `${item.label}, ${hidden ? "hidden" : "shown"}`,
+				className: cn("flex cursor-pointer items-center gap-1.5 rounded-sm text-xs text-gray-light transition-opacity hover:text-gray focus-visible:ring focus-visible:ring-offset-2 focus-visible:outline-hidden", hidden && "opacity-40"),
+				children: [item.marker === "dashed-line" ? /* @__PURE__ */ jsx("span", {
+					"aria-hidden": "true",
+					className: "w-3 shrink-0 border-t-2 border-dashed",
+					style: { borderColor: item.color }
+				}) : /* @__PURE__ */ jsx("span", {
+					"aria-hidden": "true",
+					className: "size-2.5 shrink-0 rounded-circle",
+					style: { backgroundColor: item.color }
+				}), /* @__PURE__ */ jsx("span", {
+					className: cn(hidden && "line-through"),
+					children: item.label
+				})]
+			}, item.id);
+		})
+	});
+}
+//#endregion
+export { SeriesLegend };
+
+//# sourceMappingURL=series-legend.js.map

package/dist/components/series-legend.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"series-legend.js","names":[],"sources":["../../src/components/series-legend.tsx"],"sourcesContent":["import { cn } from '../utils/cn'\n\nexport interface SeriesLegendItem {\n  id: string\n  label: string\n  /** CSS color value applied inline (e.g. `var(--orange-a9)` or `#f00`). */\n  color: string\n  /** Swatch shape: `dot` (default) for bar/area series, `dashed-line` for line overlays. */\n  marker?: 'dot' | 'dashed-line'\n}\n\ninterface SeriesLegendProps {\n  items: SeriesLegendItem[]\n  hiddenIds: ReadonlySet<string>\n  onToggle: (id: string) => void\n  className?: string\n  /** Accessible label announced for the legend group. */\n  ariaLabel?: string\n}\n\nexport function SeriesLegend({\n  ariaLabel = 'Filter data series',\n  className,\n  hiddenIds,\n  items,\n  onToggle,\n}: SeriesLegendProps) {\n  return (\n    <div\n      role=\"group\"\n      aria-label={ariaLabel}\n      className={cn('flex flex-wrap gap-x-4 gap-y-1.5', className)}\n    >\n      {items.map((item) => {\n        const hidden = hiddenIds.has(item.id)\n        return (\n          <button\n            key={item.id}\n            type=\"button\"\n            onClick={() => onToggle(item.id)}\n            aria-pressed={!hidden}\n            aria-label={`${item.label}, ${hidden ? 'hidden' : 'shown'}`}\n            className={cn(\n              'flex cursor-pointer items-center gap-1.5 rounded-sm text-xs text-gray-light transition-opacity hover:text-gray focus-visible:ring focus-visible:ring-offset-2 focus-visible:outline-hidden',\n              hidden && 'opacity-40',\n            )}\n          >\n            {item.marker === 'dashed-line' ? (\n              <span\n                aria-hidden=\"true\"\n                className=\"w-3 shrink-0 border-t-2 border-dashed\"\n                style={{ borderColor: item.color }}\n              />\n            ) : (\n              <span\n                aria-hidden=\"true\"\n                className=\"size-2.5 shrink-0 rounded-circle\"\n                style={{ backgroundColor: item.color }}\n              />\n            )}\n            <span className={cn(hidden && 'line-through')}>{item.label}</span>\n          </button>\n        )\n      })}\n    </div>\n  )\n}\n"],"mappings":";;;;AAoBA,SAAgB,aAAa,EAC3B,YAAY,sBACZ,WACA,WACA,OACA,YACoB;AACpB,QACE,oBAAC,OAAD;EACE,MAAK;EACL,cAAY;EACZ,WAAW,GAAG,oCAAoC,UAAU;YAE3D,MAAM,KAAK,SAAS;GACnB,MAAM,SAAS,UAAU,IAAI,KAAK,GAAG;AACrC,UACE,qBAAC,UAAD;IAEE,MAAK;IACL,eAAe,SAAS,KAAK,GAAG;IAChC,gBAAc,CAAC;IACf,cAAY,GAAG,KAAK,MAAM,IAAI,SAAS,WAAW;IAClD,WAAW,GACT,8LACA,UAAU,aACX;cATH,CAWG,KAAK,WAAW,gBACf,oBAAC,QAAD;KACE,eAAY;KACZ,WAAU;KACV,OAAO,EAAE,aAAa,KAAK,OAAO;KAClC,CAAA,GAEF,oBAAC,QAAD;KACE,eAAY;KACZ,WAAU;KACV,OAAO,EAAE,iBAAiB,KAAK,OAAO;KACtC,CAAA,EAEJ,oBAAC,QAAD;KAAM,WAAW,GAAG,UAAU,eAAe;eAAG,KAAK;KAAa,CAAA,CAC3D;MAxBF,KAAK,GAwBH;IAEX;EACE,CAAA"}

package/dist/components/sheet.cjs

@@ -0,0 +1,102 @@
+"use client";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const require_chunk = require("../chunk-aJGBMT86.cjs");
+const require_icons_material_symbol = require("../icons/material-symbol.cjs");
+const require_components_button = require("./button.cjs");
+let react = require("react");
+react = require_chunk.__toESM(react);
+let react_jsx_runtime = require("react/jsx-runtime");
+let _base_ui_react_dialog = require("@base-ui/react/dialog");
+let cnfast = require("cnfast");
+//#region src/components/sheet.tsx
+function Sheet(props) {
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_base_ui_react_dialog.Dialog.Root, { ...props });
+}
+function SheetTrigger(props) {
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_base_ui_react_dialog.Dialog.Trigger, {
+		"data-slot": "sheet-trigger",
+		...props
+	});
+}
+function SheetClose({ className, children, ...props }) {
+	if (children || props.render) return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_base_ui_react_dialog.Dialog.Close, {
+		"data-slot": "sheet-close",
+		className,
+		...props,
+		children
+	});
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_base_ui_react_dialog.Dialog.Close, {
+		"data-slot": "sheet-close",
+		className: (0, cnfast.cn)(require_components_button.buttonVariants({
+			size: "icon",
+			variant: "tertiary"
+		}), "absolute top-2.5 right-3 rounded-full", className),
+		...props,
+		children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_icons_material_symbol.MaterialSymbol, {
+			className: "[--spark-icon-size:calc(20px*var(--spark-scaling,1))]",
+			name: "close"
+		})
+	});
+}
+function SheetPortal(props) {
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_base_ui_react_dialog.Dialog.Portal, {
+		"data-slot": "sheet-portal",
+		...props
+	});
+}
+function SheetOverlay({ className, ...props }) {
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_base_ui_react_dialog.Dialog.Backdrop, {
+		"data-slot": "sheet-overlay",
+		className: (0, cnfast.cn)("fixed top-(--spark-viewport-top,0) right-0 left-0 z-50 h-(--spark-viewport-height,100%) bg-(--color-overlay) transition-opacity duration-150 data-ending-style:opacity-0 data-starting-style:opacity-0 motion-reduce:transition-none", className),
+		...props
+	});
+}
+function SheetContent({ side = "right", className, ...props }) {
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_base_ui_react_dialog.Dialog.Popup, {
+		"data-slot": "sheet-content",
+		"data-side": side,
+		className: (0, cnfast.cn)("fixed z-50 flex flex-col gap-4 border-gray-a1 bg-gray-1 p-safe-offset-4 text-gray shadow-lg transition-[translate] duration-200 ease-in-out data-ending-style:duration-300 motion-reduce:transition-none", "data-[side=top]:inset-x-0 data-[side=top]:top-(--spark-viewport-top,0) data-[side=top]:border-b data-[side=top]:data-ending-style:-translate-y-full data-[side=top]:data-starting-style:-translate-y-full", "data-[side=bottom]:inset-x-0 data-[side=bottom]:bottom-(--spark-viewport-bottom-offset,0) data-[side=bottom]:border-t data-[side=bottom]:data-ending-style:translate-y-full data-[side=bottom]:data-starting-style:translate-y-full", "data-[side=left]:top-(--spark-viewport-top,0) data-[side=left]:left-0 data-[side=left]:h-(--spark-viewport-height,100%) data-[side=left]:w-3/4 data-[side=left]:border-r data-[side=left]:data-ending-style:-translate-x-full data-[side=left]:data-starting-style:-translate-x-full data-[side=left]:sm:max-w-sm", "data-[side=right]:top-(--spark-viewport-top,0) data-[side=right]:right-0 data-[side=right]:h-(--spark-viewport-height,100%) data-[side=right]:w-3/4 data-[side=right]:border-l data-[side=right]:data-ending-style:translate-x-full data-[side=right]:data-starting-style:translate-x-full data-[side=right]:sm:max-w-sm", className),
+		...props
+	});
+}
+function SheetHeader({ className, ...props }) {
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+		"data-slot": "sheet-header",
+		className: (0, cnfast.cn)("flex flex-col gap-2 text-center sm:text-left", className),
+		...props
+	});
+}
+function SheetFooter({ className, ...props }) {
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+		"data-slot": "sheet-footer",
+		className: (0, cnfast.cn)("mt-auto flex flex-col-reverse gap-2 sm:flex-row sm:justify-end", className),
+		...props
+	});
+}
+function SheetTitle({ className, ...props }) {
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_base_ui_react_dialog.Dialog.Title, {
+		"data-slot": "sheet-title",
+		className: (0, cnfast.cn)("text-lg font-semibold text-gray", className),
+		...props
+	});
+}
+function SheetDescription({ className, ...props }) {
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_base_ui_react_dialog.Dialog.Description, {
+		"data-slot": "sheet-description",
+		className: (0, cnfast.cn)("text-sm text-gray-light", className),
+		...props
+	});
+}
+//#endregion
+exports.Sheet = Sheet;
+exports.SheetClose = SheetClose;
+exports.SheetContent = SheetContent;
+exports.SheetDescription = SheetDescription;
+exports.SheetFooter = SheetFooter;
+exports.SheetHeader = SheetHeader;
+exports.SheetOverlay = SheetOverlay;
+exports.SheetPortal = SheetPortal;
+exports.SheetTitle = SheetTitle;
+exports.SheetTrigger = SheetTrigger;
+
+//# sourceMappingURL=sheet.cjs.map

package/dist/components/sheet.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"sheet.cjs","names":["SheetPrimitive","buttonVariants","MaterialSymbol"],"sources":["../../src/components/sheet.tsx"],"sourcesContent":["import { Dialog as SheetPrimitive } from '@base-ui/react/dialog'\nimport * as React from 'react'\nimport { MaterialSymbol } from '../icons/material-symbol'\nimport { cn } from '../utils/cn'\nimport { buttonVariants } from './button'\n\nfunction Sheet(props: React.ComponentProps<typeof SheetPrimitive.Root>) {\n  return <SheetPrimitive.Root {...props} />\n}\n\nfunction SheetTrigger(\n  props: React.ComponentProps<typeof SheetPrimitive.Trigger>,\n) {\n  return <SheetPrimitive.Trigger data-slot=\"sheet-trigger\" {...props} />\n}\n\n// bare = the ready-made corner X (label is the consumer's, via aria-label);\n// with children or a render prop it stays the bare primitive (footer buttons, labeled closes)\nfunction SheetClose({\n  className,\n  children,\n  ...props\n}: React.ComponentProps<typeof SheetPrimitive.Close>) {\n  if (children || props.render) {\n    return (\n      <SheetPrimitive.Close\n        data-slot=\"sheet-close\"\n        className={className}\n        {...props}\n      >\n        {children}\n      </SheetPrimitive.Close>\n    )\n  }\n\n  return (\n    <SheetPrimitive.Close\n      data-slot=\"sheet-close\"\n      className={cn(\n        buttonVariants({ size: 'icon', variant: 'tertiary' }),\n        'absolute top-2.5 right-3 rounded-full',\n        className,\n      )}\n      {...props}\n    >\n      <MaterialSymbol\n        className=\"[--spark-icon-size:calc(20px*var(--spark-scaling,1))]\"\n        name=\"close\"\n      />\n    </SheetPrimitive.Close>\n  )\n}\n\nfunction SheetPortal(\n  props: React.ComponentProps<typeof SheetPrimitive.Portal>,\n) {\n  return <SheetPrimitive.Portal data-slot=\"sheet-portal\" {...props} />\n}\n\nfunction SheetOverlay({\n  className,\n  ...props\n}: React.ComponentProps<typeof SheetPrimitive.Backdrop>) {\n  return (\n    <SheetPrimitive.Backdrop\n      data-slot=\"sheet-overlay\"\n      className={cn(\n        'fixed top-(--spark-viewport-top,0) right-0 left-0 z-50 h-(--spark-viewport-height,100%) bg-(--color-overlay) transition-opacity duration-150 data-ending-style:opacity-0 data-starting-style:opacity-0 motion-reduce:transition-none',\n        className,\n      )}\n      {...props}\n    />\n  )\n}\n\ninterface SheetContentProps extends React.ComponentProps<\n  typeof SheetPrimitive.Popup\n> {\n  side?: 'top' | 'right' | 'bottom' | 'left'\n}\n\nfunction SheetContent({\n  side = 'right',\n  className,\n  ...props\n}: SheetContentProps) {\n  return (\n    <SheetPrimitive.Popup\n      data-slot=\"sheet-content\"\n      data-side={side}\n      className={cn(\n        'fixed z-50 flex flex-col gap-4 border-gray-a1 bg-gray-1 p-safe-offset-4 text-gray shadow-lg transition-[translate] duration-200 ease-in-out data-ending-style:duration-300 motion-reduce:transition-none',\n        'data-[side=top]:inset-x-0 data-[side=top]:top-(--spark-viewport-top,0) data-[side=top]:border-b data-[side=top]:data-ending-style:-translate-y-full data-[side=top]:data-starting-style:-translate-y-full',\n        'data-[side=bottom]:inset-x-0 data-[side=bottom]:bottom-(--spark-viewport-bottom-offset,0) data-[side=bottom]:border-t data-[side=bottom]:data-ending-style:translate-y-full data-[side=bottom]:data-starting-style:translate-y-full',\n        'data-[side=left]:top-(--spark-viewport-top,0) data-[side=left]:left-0 data-[side=left]:h-(--spark-viewport-height,100%) data-[side=left]:w-3/4 data-[side=left]:border-r data-[side=left]:data-ending-style:-translate-x-full data-[side=left]:data-starting-style:-translate-x-full data-[side=left]:sm:max-w-sm',\n        'data-[side=right]:top-(--spark-viewport-top,0) data-[side=right]:right-0 data-[side=right]:h-(--spark-viewport-height,100%) data-[side=right]:w-3/4 data-[side=right]:border-l data-[side=right]:data-ending-style:translate-x-full data-[side=right]:data-starting-style:translate-x-full data-[side=right]:sm:max-w-sm',\n        className,\n      )}\n      {...props}\n    />\n  )\n}\n\nfunction SheetHeader({ className, ...props }: React.ComponentProps<'div'>) {\n  return (\n    <div\n      data-slot=\"sheet-header\"\n      className={cn('flex flex-col gap-2 text-center sm:text-left', className)}\n      {...props}\n    />\n  )\n}\n\nfunction SheetFooter({ className, ...props }: React.ComponentProps<'div'>) {\n  return (\n    <div\n      data-slot=\"sheet-footer\"\n      className={cn(\n        'mt-auto flex flex-col-reverse gap-2 sm:flex-row sm:justify-end',\n        className,\n      )}\n      {...props}\n    />\n  )\n}\n\nfunction SheetTitle({\n  className,\n  ...props\n}: React.ComponentProps<typeof SheetPrimitive.Title>) {\n  return (\n    <SheetPrimitive.Title\n      data-slot=\"sheet-title\"\n      className={cn('text-lg font-semibold text-gray', className)}\n      {...props}\n    />\n  )\n}\n\nfunction SheetDescription({\n  className,\n  ...props\n}: React.ComponentProps<typeof SheetPrimitive.Description>) {\n  return (\n    <SheetPrimitive.Description\n      data-slot=\"sheet-description\"\n      className={cn('text-sm text-gray-light', className)}\n      {...props}\n    />\n  )\n}\n\nexport {\n  Sheet,\n  SheetClose,\n  SheetContent,\n  SheetDescription,\n  SheetFooter,\n  SheetHeader,\n  SheetOverlay,\n  SheetPortal,\n  SheetTitle,\n  SheetTrigger,\n}\nexport type { SheetContentProps }\n"],"mappings":";;;;;;;;;;;AAMA,SAAS,MAAM,OAAyD;AACtE,QAAO,iBAAA,GAAA,kBAAA,KAACA,sBAAAA,OAAe,MAAhB,EAAqB,GAAI,OAAS,CAAA;;AAG3C,SAAS,aACP,OACA;AACA,QAAO,iBAAA,GAAA,kBAAA,KAACA,sBAAAA,OAAe,SAAhB;EAAwB,aAAU;EAAgB,GAAI;EAAS,CAAA;;AAKxE,SAAS,WAAW,EAClB,WACA,UACA,GAAG,SACiD;AACpD,KAAI,YAAY,MAAM,OACpB,QACE,iBAAA,GAAA,kBAAA,KAACA,sBAAAA,OAAe,OAAhB;EACE,aAAU;EACC;EACX,GAAI;EAEH;EACoB,CAAA;AAI3B,QACE,iBAAA,GAAA,kBAAA,KAACA,sBAAAA,OAAe,OAAhB;EACE,aAAU;EACV,YAAA,GAAA,OAAA,IACEC,0BAAAA,eAAe;GAAE,MAAM;GAAQ,SAAS;GAAY,CAAC,EACrD,yCACA,UACD;EACD,GAAI;YAEJ,iBAAA,GAAA,kBAAA,KAACC,8BAAAA,gBAAD;GACE,WAAU;GACV,MAAK;GACL,CAAA;EACmB,CAAA;;AAI3B,SAAS,YACP,OACA;AACA,QAAO,iBAAA,GAAA,kBAAA,KAACF,sBAAAA,OAAe,QAAhB;EAAuB,aAAU;EAAe,GAAI;EAAS,CAAA;;AAGtE,SAAS,aAAa,EACpB,WACA,GAAG,SACoD;AACvD,QACE,iBAAA,GAAA,kBAAA,KAACA,sBAAAA,OAAe,UAAhB;EACE,aAAU;EACV,YAAA,GAAA,OAAA,IACE,wOACA,UACD;EACD,GAAI;EACJ,CAAA;;AAUN,SAAS,aAAa,EACpB,OAAO,SACP,WACA,GAAG,SACiB;AACpB,QACE,iBAAA,GAAA,kBAAA,KAACA,sBAAAA,OAAe,OAAhB;EACE,aAAU;EACV,aAAW;EACX,YAAA,GAAA,OAAA,IACE,4MACA,6MACA,uOACA,qTACA,4TACA,UACD;EACD,GAAI;EACJ,CAAA;;AAIN,SAAS,YAAY,EAAE,WAAW,GAAG,SAAsC;AACzE,QACE,iBAAA,GAAA,kBAAA,KAAC,OAAD;EACE,aAAU;EACV,YAAA,GAAA,OAAA,IAAc,gDAAgD,UAAU;EACxE,GAAI;EACJ,CAAA;;AAIN,SAAS,YAAY,EAAE,WAAW,GAAG,SAAsC;AACzE,QACE,iBAAA,GAAA,kBAAA,KAAC,OAAD;EACE,aAAU;EACV,YAAA,GAAA,OAAA,IACE,kEACA,UACD;EACD,GAAI;EACJ,CAAA;;AAIN,SAAS,WAAW,EAClB,WACA,GAAG,SACiD;AACpD,QACE,iBAAA,GAAA,kBAAA,KAACA,sBAAAA,OAAe,OAAhB;EACE,aAAU;EACV,YAAA,GAAA,OAAA,IAAc,mCAAmC,UAAU;EAC3D,GAAI;EACJ,CAAA;;AAIN,SAAS,iBAAiB,EACxB,WACA,GAAG,SACuD;AAC1D,QACE,iBAAA,GAAA,kBAAA,KAACA,sBAAAA,OAAe,aAAhB;EACE,aAAU;EACV,YAAA,GAAA,OAAA,IAAc,2BAA2B,UAAU;EACnD,GAAI;EACJ,CAAA"}

package/dist/components/sheet.d.cts

@@ -0,0 +1,46 @@
+"use client";
+
+import * as _$react_jsx_runtime0 from "react/jsx-runtime";
+import * as React$1 from "react";
+import { Dialog } from "@base-ui/react/dialog";
+
+//#region src/components/sheet.d.ts
+declare function Sheet(props: React$1.ComponentProps<typeof Dialog.Root>): _$react_jsx_runtime0.JSX.Element;
+declare function SheetTrigger(props: React$1.ComponentProps<typeof Dialog.Trigger>): _$react_jsx_runtime0.JSX.Element;
+declare function SheetClose({
+  className,
+  children,
+  ...props
+}: React$1.ComponentProps<typeof Dialog.Close>): _$react_jsx_runtime0.JSX.Element;
+declare function SheetPortal(props: React$1.ComponentProps<typeof Dialog.Portal>): _$react_jsx_runtime0.JSX.Element;
+declare function SheetOverlay({
+  className,
+  ...props
+}: React$1.ComponentProps<typeof Dialog.Backdrop>): _$react_jsx_runtime0.JSX.Element;
+interface SheetContentProps extends React$1.ComponentProps<typeof Dialog.Popup> {
+  side?: 'top' | 'right' | 'bottom' | 'left';
+}
+declare function SheetContent({
+  side,
+  className,
+  ...props
+}: SheetContentProps): _$react_jsx_runtime0.JSX.Element;
+declare function SheetHeader({
+  className,
+  ...props
+}: React$1.ComponentProps<'div'>): _$react_jsx_runtime0.JSX.Element;
+declare function SheetFooter({
+  className,
+  ...props
+}: React$1.ComponentProps<'div'>): _$react_jsx_runtime0.JSX.Element;
+declare function SheetTitle({
+  className,
+  ...props
+}: React$1.ComponentProps<typeof Dialog.Title>): _$react_jsx_runtime0.JSX.Element;
+declare function SheetDescription({
+  className,
+  ...props
+}: React$1.ComponentProps<typeof Dialog.Description>): _$react_jsx_runtime0.JSX.Element;
+//#endregion
+export { Sheet, SheetClose, SheetContent, type SheetContentProps, SheetDescription, SheetFooter, SheetHeader, SheetOverlay, SheetPortal, SheetTitle, SheetTrigger };
+//# sourceMappingURL=sheet.d.cts.map

package/dist/components/sheet.d.ts

@@ -0,0 +1,46 @@
+"use client";
+
+import * as React$1 from "react";
+import * as _$react_jsx_runtime0 from "react/jsx-runtime";
+import { Dialog } from "@base-ui/react/dialog";
+
+//#region src/components/sheet.d.ts
+declare function Sheet(props: React$1.ComponentProps<typeof Dialog.Root>): _$react_jsx_runtime0.JSX.Element;
+declare function SheetTrigger(props: React$1.ComponentProps<typeof Dialog.Trigger>): _$react_jsx_runtime0.JSX.Element;
+declare function SheetClose({
+  className,
+  children,
+  ...props
+}: React$1.ComponentProps<typeof Dialog.Close>): _$react_jsx_runtime0.JSX.Element;
+declare function SheetPortal(props: React$1.ComponentProps<typeof Dialog.Portal>): _$react_jsx_runtime0.JSX.Element;
+declare function SheetOverlay({
+  className,
+  ...props
+}: React$1.ComponentProps<typeof Dialog.Backdrop>): _$react_jsx_runtime0.JSX.Element;
+interface SheetContentProps extends React$1.ComponentProps<typeof Dialog.Popup> {
+  side?: 'top' | 'right' | 'bottom' | 'left';
+}
+declare function SheetContent({
+  side,
+  className,
+  ...props
+}: SheetContentProps): _$react_jsx_runtime0.JSX.Element;
+declare function SheetHeader({
+  className,
+  ...props
+}: React$1.ComponentProps<'div'>): _$react_jsx_runtime0.JSX.Element;
+declare function SheetFooter({
+  className,
+  ...props
+}: React$1.ComponentProps<'div'>): _$react_jsx_runtime0.JSX.Element;
+declare function SheetTitle({
+  className,
+  ...props
+}: React$1.ComponentProps<typeof Dialog.Title>): _$react_jsx_runtime0.JSX.Element;
+declare function SheetDescription({
+  className,
+  ...props
+}: React$1.ComponentProps<typeof Dialog.Description>): _$react_jsx_runtime0.JSX.Element;
+//#endregion
+export { Sheet, SheetClose, SheetContent, type SheetContentProps, SheetDescription, SheetFooter, SheetHeader, SheetOverlay, SheetPortal, SheetTitle, SheetTrigger };
+//# sourceMappingURL=sheet.d.ts.map

package/dist/components/sheet.js

@@ -0,0 +1,90 @@
+"use client";
+import { cn } from "../utils/cn.js";
+import { MaterialSymbol } from "../icons/material-symbol.js";
+import { buttonVariants } from "./button.js";
+import "react";
+import { jsx } from "react/jsx-runtime";
+import { Dialog } from "@base-ui/react/dialog";
+//#region src/components/sheet.tsx
+function Sheet(props) {
+	return /* @__PURE__ */ jsx(Dialog.Root, { ...props });
+}
+function SheetTrigger(props) {
+	return /* @__PURE__ */ jsx(Dialog.Trigger, {
+		"data-slot": "sheet-trigger",
+		...props
+	});
+}
+function SheetClose({ className, children, ...props }) {
+	if (children || props.render) return /* @__PURE__ */ jsx(Dialog.Close, {
+		"data-slot": "sheet-close",
+		className,
+		...props,
+		children
+	});
+	return /* @__PURE__ */ jsx(Dialog.Close, {
+		"data-slot": "sheet-close",
+		className: cn(buttonVariants({
+			size: "icon",
+			variant: "tertiary"
+		}), "absolute top-2.5 right-3 rounded-full", className),
+		...props,
+		children: /* @__PURE__ */ jsx(MaterialSymbol, {
+			className: "[--spark-icon-size:calc(20px*var(--spark-scaling,1))]",
+			name: "close"
+		})
+	});
+}
+function SheetPortal(props) {
+	return /* @__PURE__ */ jsx(Dialog.Portal, {
+		"data-slot": "sheet-portal",
+		...props
+	});
+}
+function SheetOverlay({ className, ...props }) {
+	return /* @__PURE__ */ jsx(Dialog.Backdrop, {
+		"data-slot": "sheet-overlay",
+		className: cn("fixed top-(--spark-viewport-top,0) right-0 left-0 z-50 h-(--spark-viewport-height,100%) bg-(--color-overlay) transition-opacity duration-150 data-ending-style:opacity-0 data-starting-style:opacity-0 motion-reduce:transition-none", className),
+		...props
+	});
+}
+function SheetContent({ side = "right", className, ...props }) {
+	return /* @__PURE__ */ jsx(Dialog.Popup, {
+		"data-slot": "sheet-content",
+		"data-side": side,
+		className: cn("fixed z-50 flex flex-col gap-4 border-gray-a1 bg-gray-1 p-safe-offset-4 text-gray shadow-lg transition-[translate] duration-200 ease-in-out data-ending-style:duration-300 motion-reduce:transition-none", "data-[side=top]:inset-x-0 data-[side=top]:top-(--spark-viewport-top,0) data-[side=top]:border-b data-[side=top]:data-ending-style:-translate-y-full data-[side=top]:data-starting-style:-translate-y-full", "data-[side=bottom]:inset-x-0 data-[side=bottom]:bottom-(--spark-viewport-bottom-offset,0) data-[side=bottom]:border-t data-[side=bottom]:data-ending-style:translate-y-full data-[side=bottom]:data-starting-style:translate-y-full", "data-[side=left]:top-(--spark-viewport-top,0) data-[side=left]:left-0 data-[side=left]:h-(--spark-viewport-height,100%) data-[side=left]:w-3/4 data-[side=left]:border-r data-[side=left]:data-ending-style:-translate-x-full data-[side=left]:data-starting-style:-translate-x-full data-[side=left]:sm:max-w-sm", "data-[side=right]:top-(--spark-viewport-top,0) data-[side=right]:right-0 data-[side=right]:h-(--spark-viewport-height,100%) data-[side=right]:w-3/4 data-[side=right]:border-l data-[side=right]:data-ending-style:translate-x-full data-[side=right]:data-starting-style:translate-x-full data-[side=right]:sm:max-w-sm", className),
+		...props
+	});
+}
+function SheetHeader({ className, ...props }) {
+	return /* @__PURE__ */ jsx("div", {
+		"data-slot": "sheet-header",
+		className: cn("flex flex-col gap-2 text-center sm:text-left", className),
+		...props
+	});
+}
+function SheetFooter({ className, ...props }) {
+	return /* @__PURE__ */ jsx("div", {
+		"data-slot": "sheet-footer",
+		className: cn("mt-auto flex flex-col-reverse gap-2 sm:flex-row sm:justify-end", className),
+		...props
+	});
+}
+function SheetTitle({ className, ...props }) {
+	return /* @__PURE__ */ jsx(Dialog.Title, {
+		"data-slot": "sheet-title",
+		className: cn("text-lg font-semibold text-gray", className),
+		...props
+	});
+}
+function SheetDescription({ className, ...props }) {
+	return /* @__PURE__ */ jsx(Dialog.Description, {
+		"data-slot": "sheet-description",
+		className: cn("text-sm text-gray-light", className),
+		...props
+	});
+}
+//#endregion
+export { Sheet, SheetClose, SheetContent, SheetDescription, SheetFooter, SheetHeader, SheetOverlay, SheetPortal, SheetTitle, SheetTrigger };
+
+//# sourceMappingURL=sheet.js.map

package/dist/components/sheet.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"sheet.js","names":["SheetPrimitive"],"sources":["../../src/components/sheet.tsx"],"sourcesContent":["import { Dialog as SheetPrimitive } from '@base-ui/react/dialog'\nimport * as React from 'react'\nimport { MaterialSymbol } from '../icons/material-symbol'\nimport { cn } from '../utils/cn'\nimport { buttonVariants } from './button'\n\nfunction Sheet(props: React.ComponentProps<typeof SheetPrimitive.Root>) {\n  return <SheetPrimitive.Root {...props} />\n}\n\nfunction SheetTrigger(\n  props: React.ComponentProps<typeof SheetPrimitive.Trigger>,\n) {\n  return <SheetPrimitive.Trigger data-slot=\"sheet-trigger\" {...props} />\n}\n\n// bare = the ready-made corner X (label is the consumer's, via aria-label);\n// with children or a render prop it stays the bare primitive (footer buttons, labeled closes)\nfunction SheetClose({\n  className,\n  children,\n  ...props\n}: React.ComponentProps<typeof SheetPrimitive.Close>) {\n  if (children || props.render) {\n    return (\n      <SheetPrimitive.Close\n        data-slot=\"sheet-close\"\n        className={className}\n        {...props}\n      >\n        {children}\n      </SheetPrimitive.Close>\n    )\n  }\n\n  return (\n    <SheetPrimitive.Close\n      data-slot=\"sheet-close\"\n      className={cn(\n        buttonVariants({ size: 'icon', variant: 'tertiary' }),\n        'absolute top-2.5 right-3 rounded-full',\n        className,\n      )}\n      {...props}\n    >\n      <MaterialSymbol\n        className=\"[--spark-icon-size:calc(20px*var(--spark-scaling,1))]\"\n        name=\"close\"\n      />\n    </SheetPrimitive.Close>\n  )\n}\n\nfunction SheetPortal(\n  props: React.ComponentProps<typeof SheetPrimitive.Portal>,\n) {\n  return <SheetPrimitive.Portal data-slot=\"sheet-portal\" {...props} />\n}\n\nfunction SheetOverlay({\n  className,\n  ...props\n}: React.ComponentProps<typeof SheetPrimitive.Backdrop>) {\n  return (\n    <SheetPrimitive.Backdrop\n      data-slot=\"sheet-overlay\"\n      className={cn(\n        'fixed top-(--spark-viewport-top,0) right-0 left-0 z-50 h-(--spark-viewport-height,100%) bg-(--color-overlay) transition-opacity duration-150 data-ending-style:opacity-0 data-starting-style:opacity-0 motion-reduce:transition-none',\n        className,\n      )}\n      {...props}\n    />\n  )\n}\n\ninterface SheetContentProps extends React.ComponentProps<\n  typeof SheetPrimitive.Popup\n> {\n  side?: 'top' | 'right' | 'bottom' | 'left'\n}\n\nfunction SheetContent({\n  side = 'right',\n  className,\n  ...props\n}: SheetContentProps) {\n  return (\n    <SheetPrimitive.Popup\n      data-slot=\"sheet-content\"\n      data-side={side}\n      className={cn(\n        'fixed z-50 flex flex-col gap-4 border-gray-a1 bg-gray-1 p-safe-offset-4 text-gray shadow-lg transition-[translate] duration-200 ease-in-out data-ending-style:duration-300 motion-reduce:transition-none',\n        'data-[side=top]:inset-x-0 data-[side=top]:top-(--spark-viewport-top,0) data-[side=top]:border-b data-[side=top]:data-ending-style:-translate-y-full data-[side=top]:data-starting-style:-translate-y-full',\n        'data-[side=bottom]:inset-x-0 data-[side=bottom]:bottom-(--spark-viewport-bottom-offset,0) data-[side=bottom]:border-t data-[side=bottom]:data-ending-style:translate-y-full data-[side=bottom]:data-starting-style:translate-y-full',\n        'data-[side=left]:top-(--spark-viewport-top,0) data-[side=left]:left-0 data-[side=left]:h-(--spark-viewport-height,100%) data-[side=left]:w-3/4 data-[side=left]:border-r data-[side=left]:data-ending-style:-translate-x-full data-[side=left]:data-starting-style:-translate-x-full data-[side=left]:sm:max-w-sm',\n        'data-[side=right]:top-(--spark-viewport-top,0) data-[side=right]:right-0 data-[side=right]:h-(--spark-viewport-height,100%) data-[side=right]:w-3/4 data-[side=right]:border-l data-[side=right]:data-ending-style:translate-x-full data-[side=right]:data-starting-style:translate-x-full data-[side=right]:sm:max-w-sm',\n        className,\n      )}\n      {...props}\n    />\n  )\n}\n\nfunction SheetHeader({ className, ...props }: React.ComponentProps<'div'>) {\n  return (\n    <div\n      data-slot=\"sheet-header\"\n      className={cn('flex flex-col gap-2 text-center sm:text-left', className)}\n      {...props}\n    />\n  )\n}\n\nfunction SheetFooter({ className, ...props }: React.ComponentProps<'div'>) {\n  return (\n    <div\n      data-slot=\"sheet-footer\"\n      className={cn(\n        'mt-auto flex flex-col-reverse gap-2 sm:flex-row sm:justify-end',\n        className,\n      )}\n      {...props}\n    />\n  )\n}\n\nfunction SheetTitle({\n  className,\n  ...props\n}: React.ComponentProps<typeof SheetPrimitive.Title>) {\n  return (\n    <SheetPrimitive.Title\n      data-slot=\"sheet-title\"\n      className={cn('text-lg font-semibold text-gray', className)}\n      {...props}\n    />\n  )\n}\n\nfunction SheetDescription({\n  className,\n  ...props\n}: React.ComponentProps<typeof SheetPrimitive.Description>) {\n  return (\n    <SheetPrimitive.Description\n      data-slot=\"sheet-description\"\n      className={cn('text-sm text-gray-light', className)}\n      {...props}\n    />\n  )\n}\n\nexport {\n  Sheet,\n  SheetClose,\n  SheetContent,\n  SheetDescription,\n  SheetFooter,\n  SheetHeader,\n  SheetOverlay,\n  SheetPortal,\n  SheetTitle,\n  SheetTrigger,\n}\nexport type { SheetContentProps }\n"],"mappings":";;;;;;;;AAMA,SAAS,MAAM,OAAyD;AACtE,QAAO,oBAACA,OAAe,MAAhB,EAAqB,GAAI,OAAS,CAAA;;AAG3C,SAAS,aACP,OACA;AACA,QAAO,oBAACA,OAAe,SAAhB;EAAwB,aAAU;EAAgB,GAAI;EAAS,CAAA;;AAKxE,SAAS,WAAW,EAClB,WACA,UACA,GAAG,SACiD;AACpD,KAAI,YAAY,MAAM,OACpB,QACE,oBAACA,OAAe,OAAhB;EACE,aAAU;EACC;EACX,GAAI;EAEH;EACoB,CAAA;AAI3B,QACE,oBAACA,OAAe,OAAhB;EACE,aAAU;EACV,WAAW,GACT,eAAe;GAAE,MAAM;GAAQ,SAAS;GAAY,CAAC,EACrD,yCACA,UACD;EACD,GAAI;YAEJ,oBAAC,gBAAD;GACE,WAAU;GACV,MAAK;GACL,CAAA;EACmB,CAAA;;AAI3B,SAAS,YACP,OACA;AACA,QAAO,oBAACA,OAAe,QAAhB;EAAuB,aAAU;EAAe,GAAI;EAAS,CAAA;;AAGtE,SAAS,aAAa,EACpB,WACA,GAAG,SACoD;AACvD,QACE,oBAACA,OAAe,UAAhB;EACE,aAAU;EACV,WAAW,GACT,wOACA,UACD;EACD,GAAI;EACJ,CAAA;;AAUN,SAAS,aAAa,EACpB,OAAO,SACP,WACA,GAAG,SACiB;AACpB,QACE,oBAACA,OAAe,OAAhB;EACE,aAAU;EACV,aAAW;EACX,WAAW,GACT,4MACA,6MACA,uOACA,qTACA,4TACA,UACD;EACD,GAAI;EACJ,CAAA;;AAIN,SAAS,YAAY,EAAE,WAAW,GAAG,SAAsC;AACzE,QACE,oBAAC,OAAD;EACE,aAAU;EACV,WAAW,GAAG,gDAAgD,UAAU;EACxE,GAAI;EACJ,CAAA;;AAIN,SAAS,YAAY,EAAE,WAAW,GAAG,SAAsC;AACzE,QACE,oBAAC,OAAD;EACE,aAAU;EACV,WAAW,GACT,kEACA,UACD;EACD,GAAI;EACJ,CAAA;;AAIN,SAAS,WAAW,EAClB,WACA,GAAG,SACiD;AACpD,QACE,oBAACA,OAAe,OAAhB;EACE,aAAU;EACV,WAAW,GAAG,mCAAmC,UAAU;EAC3D,GAAI;EACJ,CAAA;;AAIN,SAAS,iBAAiB,EACxB,WACA,GAAG,SACuD;AAC1D,QACE,oBAACA,OAAe,aAAhB;EACE,aAAU;EACV,WAAW,GAAG,2BAA2B,UAAU;EACnD,GAAI;EACJ,CAAA"}

package/dist/components/skeleton.cjs

@@ -0,0 +1,24 @@
+"use client";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+require("../chunk-aJGBMT86.cjs");
+let react_jsx_runtime = require("react/jsx-runtime");
+let cnfast = require("cnfast");
+//#region src/components/skeleton.tsx
+function Skeleton({ className = "", ...props }) {
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+		className: (0, cnfast.cn)("animate-pulse rounded-md bg-base-gray-soft motion-reduce:animate-none", className),
+		...props
+	});
+}
+function CardSkeleton({ children, className = "", padding = "p-4", ...props }) {
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+		className: (0, cnfast.cn)("flex flex-col rounded-2xl border border-gray", padding, className),
+		...props,
+		children
+	});
+}
+//#endregion
+exports.CardSkeleton = CardSkeleton;
+exports.Skeleton = Skeleton;
+
+//# sourceMappingURL=skeleton.cjs.map

package/dist/components/skeleton.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"skeleton.cjs","names":[],"sources":["../../src/components/skeleton.tsx"],"sourcesContent":["import type { HTMLAttributes, ReactNode } from 'react'\nimport { cn } from '../utils/cn'\n\ntype SkeletonProps = HTMLAttributes<HTMLDivElement>\n\nexport function Skeleton({ className = '', ...props }: SkeletonProps) {\n  return (\n    <div\n      className={cn(\n        'animate-pulse rounded-md bg-base-gray-soft motion-reduce:animate-none',\n        className,\n      )}\n      {...props}\n    />\n  )\n}\n\ninterface CardSkeletonProps extends HTMLAttributes<HTMLDivElement> {\n  children?: ReactNode\n  padding?: 'p-3' | 'p-4'\n}\n\nexport function CardSkeleton({\n  children,\n  className = '',\n  padding = 'p-4',\n  ...props\n}: CardSkeletonProps) {\n  return (\n    <div\n      className={cn(\n        'flex flex-col rounded-2xl border border-gray',\n        padding,\n        className,\n      )}\n      {...props}\n    >\n      {children}\n    </div>\n  )\n}\n"],"mappings":";;;;;;AAKA,SAAgB,SAAS,EAAE,YAAY,IAAI,GAAG,SAAwB;AACpE,QACE,iBAAA,GAAA,kBAAA,KAAC,OAAD;EACE,YAAA,GAAA,OAAA,IACE,yEACA,UACD;EACD,GAAI;EACJ,CAAA;;AASN,SAAgB,aAAa,EAC3B,UACA,YAAY,IACZ,UAAU,OACV,GAAG,SACiB;AACpB,QACE,iBAAA,GAAA,kBAAA,KAAC,OAAD;EACE,YAAA,GAAA,OAAA,IACE,gDACA,SACA,UACD;EACD,GAAI;EAEH;EACG,CAAA"}

package/dist/components/skeleton.d.cts

@@ -0,0 +1,24 @@
+"use client";
+
+import * as _$react_jsx_runtime0 from "react/jsx-runtime";
+import { HTMLAttributes, ReactNode } from "react";
+
+//#region src/components/skeleton.d.ts
+type SkeletonProps = HTMLAttributes<HTMLDivElement>;
+declare function Skeleton({
+  className,
+  ...props
+}: SkeletonProps): _$react_jsx_runtime0.JSX.Element;
+interface CardSkeletonProps extends HTMLAttributes<HTMLDivElement> {
+  children?: ReactNode;
+  padding?: 'p-3' | 'p-4';
+}
+declare function CardSkeleton({
+  children,
+  className,
+  padding,
+  ...props
+}: CardSkeletonProps): _$react_jsx_runtime0.JSX.Element;
+//#endregion
+export { CardSkeleton, Skeleton };
+//# sourceMappingURL=skeleton.d.cts.map

package/dist/components/skeleton.d.ts

@@ -0,0 +1,24 @@
+"use client";
+
+import { HTMLAttributes, ReactNode } from "react";
+import * as _$react_jsx_runtime0 from "react/jsx-runtime";
+
+//#region src/components/skeleton.d.ts
+type SkeletonProps = HTMLAttributes<HTMLDivElement>;
+declare function Skeleton({
+  className,
+  ...props
+}: SkeletonProps): _$react_jsx_runtime0.JSX.Element;
+interface CardSkeletonProps extends HTMLAttributes<HTMLDivElement> {
+  children?: ReactNode;
+  padding?: 'p-3' | 'p-4';
+}
+declare function CardSkeleton({
+  children,
+  className,
+  padding,
+  ...props
+}: CardSkeletonProps): _$react_jsx_runtime0.JSX.Element;
+//#endregion
+export { CardSkeleton, Skeleton };
+//# sourceMappingURL=skeleton.d.ts.map

package/dist/components/skeleton.js

@@ -0,0 +1,21 @@
+"use client";
+import { cn } from "../utils/cn.js";
+import { jsx } from "react/jsx-runtime";
+//#region src/components/skeleton.tsx
+function Skeleton({ className = "", ...props }) {
+	return /* @__PURE__ */ jsx("div", {
+		className: cn("animate-pulse rounded-md bg-base-gray-soft motion-reduce:animate-none", className),
+		...props
+	});
+}
+function CardSkeleton({ children, className = "", padding = "p-4", ...props }) {
+	return /* @__PURE__ */ jsx("div", {
+		className: cn("flex flex-col rounded-2xl border border-gray", padding, className),
+		...props,
+		children
+	});
+}
+//#endregion
+export { CardSkeleton, Skeleton };
+
+//# sourceMappingURL=skeleton.js.map

package/dist/components/skeleton.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"skeleton.js","names":[],"sources":["../../src/components/skeleton.tsx"],"sourcesContent":["import type { HTMLAttributes, ReactNode } from 'react'\nimport { cn } from '../utils/cn'\n\ntype SkeletonProps = HTMLAttributes<HTMLDivElement>\n\nexport function Skeleton({ className = '', ...props }: SkeletonProps) {\n  return (\n    <div\n      className={cn(\n        'animate-pulse rounded-md bg-base-gray-soft motion-reduce:animate-none',\n        className,\n      )}\n      {...props}\n    />\n  )\n}\n\ninterface CardSkeletonProps extends HTMLAttributes<HTMLDivElement> {\n  children?: ReactNode\n  padding?: 'p-3' | 'p-4'\n}\n\nexport function CardSkeleton({\n  children,\n  className = '',\n  padding = 'p-4',\n  ...props\n}: CardSkeletonProps) {\n  return (\n    <div\n      className={cn(\n        'flex flex-col rounded-2xl border border-gray',\n        padding,\n        className,\n      )}\n      {...props}\n    >\n      {children}\n    </div>\n  )\n}\n"],"mappings":";;;;AAKA,SAAgB,SAAS,EAAE,YAAY,IAAI,GAAG,SAAwB;AACpE,QACE,oBAAC,OAAD;EACE,WAAW,GACT,yEACA,UACD;EACD,GAAI;EACJ,CAAA;;AASN,SAAgB,aAAa,EAC3B,UACA,YAAY,IACZ,UAAU,OACV,GAAG,SACiB;AACpB,QACE,oBAAC,OAAD;EACE,WAAW,GACT,gDACA,SACA,UACD;EACD,GAAI;EAEH;EACG,CAAA"}