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

package/dist/components/thumbnail.cjs

@@ -0,0 +1,54 @@
+"use client";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const require_chunk = require("../chunk-aJGBMT86.cjs");
+let react = require("react");
+react = require_chunk.__toESM(react);
+let react_jsx_runtime = require("react/jsx-runtime");
+let cnfast = require("cnfast");
+//#region src/components/thumbnail.tsx
+const ratioClasses = {
+	"1:1": "aspect-square",
+	"3:2": "aspect-[3/2]",
+	"4:3": "aspect-[4/3]",
+	"16:9": "aspect-[16/9]",
+	"3:4": "aspect-[3/4]",
+	"2:3": "aspect-[2/3]"
+};
+const radiusClasses = {
+	none: "rounded-none",
+	sm: "rounded-sm",
+	md: "rounded-md",
+	lg: "rounded-lg",
+	full: "rounded-full"
+};
+function Thumbnail({ className, src, alt = "", ratio = "1:1", fit = "cover", radius = "md", imgProps, children, ...props }) {
+	const [errored, setErrored] = react.useState(false);
+	const imgRef = react.useRef(null);
+	react.useEffect(() => {
+		setErrored(false);
+		const node = imgRef.current;
+		if (node?.complete && node.naturalWidth === 0) setErrored(true);
+	}, [src]);
+	const showImage = !!src && !errored;
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+		"data-slot": "thumbnail",
+		className: (0, cnfast.cn)("relative flex items-center justify-center overflow-hidden bg-base-gray-soft", ratioClasses[ratio], radiusClasses[radius], className),
+		...props,
+		children: showImage ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)("img", {
+			...imgProps,
+			ref: imgRef,
+			src,
+			alt,
+			onError: (e) => {
+				setErrored(true);
+				imgProps?.onError?.(e);
+			},
+			className: (0, cnfast.cn)("size-full", fit === "contain" ? "object-contain" : "object-cover", imgProps?.className)
+		}) : children
+	});
+}
+Thumbnail.displayName = "Thumbnail";
+//#endregion
+exports.Thumbnail = Thumbnail;
+
+//# sourceMappingURL=thumbnail.cjs.map

package/dist/components/thumbnail.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"thumbnail.cjs","names":["React"],"sources":["../../src/components/thumbnail.tsx"],"sourcesContent":["import * as React from 'react'\nimport { cn } from '../utils/cn'\n\ntype ThumbnailRatio = '1:1' | '3:2' | '4:3' | '16:9' | '3:4' | '2:3'\ntype ThumbnailFit = 'cover' | 'contain'\ntype ThumbnailRadius = 'none' | 'sm' | 'md' | 'lg' | 'full'\n\nconst ratioClasses = {\n  '1:1': 'aspect-square',\n  '3:2': 'aspect-[3/2]',\n  '4:3': 'aspect-[4/3]',\n  '16:9': 'aspect-[16/9]',\n  '3:4': 'aspect-[3/4]',\n  '2:3': 'aspect-[2/3]',\n}\n\nconst radiusClasses = {\n  none: 'rounded-none',\n  sm: 'rounded-sm',\n  md: 'rounded-md',\n  lg: 'rounded-lg',\n  full: 'rounded-full',\n}\n\ninterface ThumbnailProps extends React.ComponentProps<'div'> {\n  src?: string\n  alt?: string\n  ratio?: ThumbnailRatio\n  fit?: ThumbnailFit\n  radius?: ThumbnailRadius\n  imgProps?: React.ComponentProps<'img'>\n}\n\nfunction Thumbnail({\n  className,\n  src,\n  alt = '',\n  ratio = '1:1',\n  fit = 'cover',\n  radius = 'md',\n  imgProps,\n  children,\n  ...props\n}: ThumbnailProps) {\n  const [errored, setErrored] = React.useState(false)\n  const imgRef = React.useRef<HTMLImageElement>(null)\n\n  React.useEffect(() => {\n    // A new src must clear a prior error, or a fixed src would stay stuck on the\n    // fallback. An image that already failed before React attached onError (SSR\n    // hydration, or a cached 404) never fires the event, so also detect that failure\n    // straight from the DOM node here.\n    setErrored(false)\n    const node = imgRef.current\n    if (node?.complete && node.naturalWidth === 0) setErrored(true)\n  }, [src])\n\n  const showImage = !!src && !errored\n\n  return (\n    <div\n      data-slot=\"thumbnail\"\n      className={cn(\n        'relative flex items-center justify-center overflow-hidden bg-base-gray-soft',\n        ratioClasses[ratio],\n        radiusClasses[radius],\n        className,\n      )}\n      {...props}\n    >\n      {showImage ? (\n        <img\n          {...imgProps}\n          ref={imgRef}\n          src={src}\n          alt={alt}\n          onError={(e) => {\n            setErrored(true)\n            imgProps?.onError?.(e)\n          }}\n          className={cn(\n            'size-full',\n            fit === 'contain' ? 'object-contain' : 'object-cover',\n            imgProps?.className,\n          )}\n        />\n      ) : (\n        children\n      )}\n    </div>\n  )\n}\n\nThumbnail.displayName = 'Thumbnail'\n\nexport { Thumbnail }\nexport type { ThumbnailProps, ThumbnailRatio, ThumbnailFit, ThumbnailRadius }\n"],"mappings":";;;;;;;;AAOA,MAAM,eAAe;CACnB,OAAO;CACP,OAAO;CACP,OAAO;CACP,QAAQ;CACR,OAAO;CACP,OAAO;CACR;AAED,MAAM,gBAAgB;CACpB,MAAM;CACN,IAAI;CACJ,IAAI;CACJ,IAAI;CACJ,MAAM;CACP;AAWD,SAAS,UAAU,EACjB,WACA,KACA,MAAM,IACN,QAAQ,OACR,MAAM,SACN,SAAS,MACT,UACA,UACA,GAAG,SACc;CACjB,MAAM,CAAC,SAAS,cAAcA,MAAM,SAAS,MAAM;CACnD,MAAM,SAASA,MAAM,OAAyB,KAAK;AAEnD,OAAM,gBAAgB;AAKpB,aAAW,MAAM;EACjB,MAAM,OAAO,OAAO;AACpB,MAAI,MAAM,YAAY,KAAK,iBAAiB,EAAG,YAAW,KAAK;IAC9D,CAAC,IAAI,CAAC;CAET,MAAM,YAAY,CAAC,CAAC,OAAO,CAAC;AAE5B,QACE,iBAAA,GAAA,kBAAA,KAAC,OAAD;EACE,aAAU;EACV,YAAA,GAAA,OAAA,IACE,+EACA,aAAa,QACb,cAAc,SACd,UACD;EACD,GAAI;YAEH,YACC,iBAAA,GAAA,kBAAA,KAAC,OAAD;GACE,GAAI;GACJ,KAAK;GACA;GACA;GACL,UAAU,MAAM;AACd,eAAW,KAAK;AAChB,cAAU,UAAU,EAAE;;GAExB,YAAA,GAAA,OAAA,IACE,aACA,QAAQ,YAAY,mBAAmB,gBACvC,UAAU,UACX;GACD,CAAA,GAEF;EAEE,CAAA;;AAIV,UAAU,cAAc"}

package/dist/components/thumbnail.d.cts

@@ -0,0 +1,34 @@
+"use client";
+
+import * as _$react_jsx_runtime0 from "react/jsx-runtime";
+import * as React$1 from "react";
+
+//#region src/components/thumbnail.d.ts
+type ThumbnailRatio = '1:1' | '3:2' | '4:3' | '16:9' | '3:4' | '2:3';
+type ThumbnailFit = 'cover' | 'contain';
+type ThumbnailRadius = 'none' | 'sm' | 'md' | 'lg' | 'full';
+interface ThumbnailProps extends React$1.ComponentProps<'div'> {
+  src?: string;
+  alt?: string;
+  ratio?: ThumbnailRatio;
+  fit?: ThumbnailFit;
+  radius?: ThumbnailRadius;
+  imgProps?: React$1.ComponentProps<'img'>;
+}
+declare function Thumbnail({
+  className,
+  src,
+  alt,
+  ratio,
+  fit,
+  radius,
+  imgProps,
+  children,
+  ...props
+}: ThumbnailProps): _$react_jsx_runtime0.JSX.Element;
+declare namespace Thumbnail {
+  var displayName: string;
+}
+//#endregion
+export { Thumbnail, type ThumbnailFit, type ThumbnailProps, type ThumbnailRadius, type ThumbnailRatio };
+//# sourceMappingURL=thumbnail.d.cts.map

package/dist/components/thumbnail.d.ts

@@ -0,0 +1,34 @@
+"use client";
+
+import * as React$1 from "react";
+import * as _$react_jsx_runtime0 from "react/jsx-runtime";
+
+//#region src/components/thumbnail.d.ts
+type ThumbnailRatio = '1:1' | '3:2' | '4:3' | '16:9' | '3:4' | '2:3';
+type ThumbnailFit = 'cover' | 'contain';
+type ThumbnailRadius = 'none' | 'sm' | 'md' | 'lg' | 'full';
+interface ThumbnailProps extends React$1.ComponentProps<'div'> {
+  src?: string;
+  alt?: string;
+  ratio?: ThumbnailRatio;
+  fit?: ThumbnailFit;
+  radius?: ThumbnailRadius;
+  imgProps?: React$1.ComponentProps<'img'>;
+}
+declare function Thumbnail({
+  className,
+  src,
+  alt,
+  ratio,
+  fit,
+  radius,
+  imgProps,
+  children,
+  ...props
+}: ThumbnailProps): _$react_jsx_runtime0.JSX.Element;
+declare namespace Thumbnail {
+  var displayName: string;
+}
+//#endregion
+export { Thumbnail, type ThumbnailFit, type ThumbnailProps, type ThumbnailRadius, type ThumbnailRatio };
+//# sourceMappingURL=thumbnail.d.ts.map

package/dist/components/thumbnail.js

@@ -0,0 +1,51 @@
+"use client";
+import { cn } from "../utils/cn.js";
+import * as React$1 from "react";
+import { jsx } from "react/jsx-runtime";
+//#region src/components/thumbnail.tsx
+const ratioClasses = {
+	"1:1": "aspect-square",
+	"3:2": "aspect-[3/2]",
+	"4:3": "aspect-[4/3]",
+	"16:9": "aspect-[16/9]",
+	"3:4": "aspect-[3/4]",
+	"2:3": "aspect-[2/3]"
+};
+const radiusClasses = {
+	none: "rounded-none",
+	sm: "rounded-sm",
+	md: "rounded-md",
+	lg: "rounded-lg",
+	full: "rounded-full"
+};
+function Thumbnail({ className, src, alt = "", ratio = "1:1", fit = "cover", radius = "md", imgProps, children, ...props }) {
+	const [errored, setErrored] = React$1.useState(false);
+	const imgRef = React$1.useRef(null);
+	React$1.useEffect(() => {
+		setErrored(false);
+		const node = imgRef.current;
+		if (node?.complete && node.naturalWidth === 0) setErrored(true);
+	}, [src]);
+	const showImage = !!src && !errored;
+	return /* @__PURE__ */ jsx("div", {
+		"data-slot": "thumbnail",
+		className: cn("relative flex items-center justify-center overflow-hidden bg-base-gray-soft", ratioClasses[ratio], radiusClasses[radius], className),
+		...props,
+		children: showImage ? /* @__PURE__ */ jsx("img", {
+			...imgProps,
+			ref: imgRef,
+			src,
+			alt,
+			onError: (e) => {
+				setErrored(true);
+				imgProps?.onError?.(e);
+			},
+			className: cn("size-full", fit === "contain" ? "object-contain" : "object-cover", imgProps?.className)
+		}) : children
+	});
+}
+Thumbnail.displayName = "Thumbnail";
+//#endregion
+export { Thumbnail };
+
+//# sourceMappingURL=thumbnail.js.map

package/dist/components/thumbnail.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"thumbnail.js","names":["React"],"sources":["../../src/components/thumbnail.tsx"],"sourcesContent":["import * as React from 'react'\nimport { cn } from '../utils/cn'\n\ntype ThumbnailRatio = '1:1' | '3:2' | '4:3' | '16:9' | '3:4' | '2:3'\ntype ThumbnailFit = 'cover' | 'contain'\ntype ThumbnailRadius = 'none' | 'sm' | 'md' | 'lg' | 'full'\n\nconst ratioClasses = {\n  '1:1': 'aspect-square',\n  '3:2': 'aspect-[3/2]',\n  '4:3': 'aspect-[4/3]',\n  '16:9': 'aspect-[16/9]',\n  '3:4': 'aspect-[3/4]',\n  '2:3': 'aspect-[2/3]',\n}\n\nconst radiusClasses = {\n  none: 'rounded-none',\n  sm: 'rounded-sm',\n  md: 'rounded-md',\n  lg: 'rounded-lg',\n  full: 'rounded-full',\n}\n\ninterface ThumbnailProps extends React.ComponentProps<'div'> {\n  src?: string\n  alt?: string\n  ratio?: ThumbnailRatio\n  fit?: ThumbnailFit\n  radius?: ThumbnailRadius\n  imgProps?: React.ComponentProps<'img'>\n}\n\nfunction Thumbnail({\n  className,\n  src,\n  alt = '',\n  ratio = '1:1',\n  fit = 'cover',\n  radius = 'md',\n  imgProps,\n  children,\n  ...props\n}: ThumbnailProps) {\n  const [errored, setErrored] = React.useState(false)\n  const imgRef = React.useRef<HTMLImageElement>(null)\n\n  React.useEffect(() => {\n    // A new src must clear a prior error, or a fixed src would stay stuck on the\n    // fallback. An image that already failed before React attached onError (SSR\n    // hydration, or a cached 404) never fires the event, so also detect that failure\n    // straight from the DOM node here.\n    setErrored(false)\n    const node = imgRef.current\n    if (node?.complete && node.naturalWidth === 0) setErrored(true)\n  }, [src])\n\n  const showImage = !!src && !errored\n\n  return (\n    <div\n      data-slot=\"thumbnail\"\n      className={cn(\n        'relative flex items-center justify-center overflow-hidden bg-base-gray-soft',\n        ratioClasses[ratio],\n        radiusClasses[radius],\n        className,\n      )}\n      {...props}\n    >\n      {showImage ? (\n        <img\n          {...imgProps}\n          ref={imgRef}\n          src={src}\n          alt={alt}\n          onError={(e) => {\n            setErrored(true)\n            imgProps?.onError?.(e)\n          }}\n          className={cn(\n            'size-full',\n            fit === 'contain' ? 'object-contain' : 'object-cover',\n            imgProps?.className,\n          )}\n        />\n      ) : (\n        children\n      )}\n    </div>\n  )\n}\n\nThumbnail.displayName = 'Thumbnail'\n\nexport { Thumbnail }\nexport type { ThumbnailProps, ThumbnailRatio, ThumbnailFit, ThumbnailRadius }\n"],"mappings":";;;;;AAOA,MAAM,eAAe;CACnB,OAAO;CACP,OAAO;CACP,OAAO;CACP,QAAQ;CACR,OAAO;CACP,OAAO;CACR;AAED,MAAM,gBAAgB;CACpB,MAAM;CACN,IAAI;CACJ,IAAI;CACJ,IAAI;CACJ,MAAM;CACP;AAWD,SAAS,UAAU,EACjB,WACA,KACA,MAAM,IACN,QAAQ,OACR,MAAM,SACN,SAAS,MACT,UACA,UACA,GAAG,SACc;CACjB,MAAM,CAAC,SAAS,cAAcA,QAAM,SAAS,MAAM;CACnD,MAAM,SAASA,QAAM,OAAyB,KAAK;AAEnD,SAAM,gBAAgB;AAKpB,aAAW,MAAM;EACjB,MAAM,OAAO,OAAO;AACpB,MAAI,MAAM,YAAY,KAAK,iBAAiB,EAAG,YAAW,KAAK;IAC9D,CAAC,IAAI,CAAC;CAET,MAAM,YAAY,CAAC,CAAC,OAAO,CAAC;AAE5B,QACE,oBAAC,OAAD;EACE,aAAU;EACV,WAAW,GACT,+EACA,aAAa,QACb,cAAc,SACd,UACD;EACD,GAAI;YAEH,YACC,oBAAC,OAAD;GACE,GAAI;GACJ,KAAK;GACA;GACA;GACL,UAAU,MAAM;AACd,eAAW,KAAK;AAChB,cAAU,UAAU,EAAE;;GAExB,WAAW,GACT,aACA,QAAQ,YAAY,mBAAmB,gBACvC,UAAU,UACX;GACD,CAAA,GAEF;EAEE,CAAA;;AAIV,UAAU,cAAc"}

package/dist/components/time-picker.cjs

@@ -0,0 +1,55 @@
+"use client";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const require_chunk = require("../chunk-aJGBMT86.cjs");
+let react = require("react");
+react = require_chunk.__toESM(react);
+let react_jsx_runtime = require("react/jsx-runtime");
+let cnfast = require("cnfast");
+//#region src/components/time-picker.tsx
+const TimePicker = react.forwardRef(({ "aria-label": ariaLabel, className, disabled, id, onValueChange, step = 60, value }, ref) => {
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("input", {
+		ref,
+		id,
+		type: "time",
+		value,
+		step,
+		disabled,
+		onChange: (event) => onValueChange(event.target.value),
+		"aria-label": ariaLabel,
+		className: (0, cnfast.cn)("h-10 w-full rounded-xl bg-base-gray-soft px-3 text-base font-medium text-gray tabular-nums transition-colors focus-visible:ring focus-visible:ring-offset-2 focus-visible:outline-hidden disabled:cursor-not-allowed disabled:opacity-50", className)
+	});
+});
+TimePicker.displayName = "TimePicker";
+function TimeRangePicker({ className, disabled, end, endLabel = "End", onEndChange, onStartChange, start, startLabel = "Start" }) {
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+		className: (0, cnfast.cn)("grid grid-cols-2 gap-2", className),
+		children: [/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("label", {
+			className: "flex flex-col gap-1.5",
+			children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+				className: "text-xs font-medium text-gray-light",
+				children: startLabel
+			}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(TimePicker, {
+				value: start,
+				onValueChange: onStartChange,
+				disabled,
+				"aria-label": startLabel
+			})]
+		}), /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("label", {
+			className: "flex flex-col gap-1.5",
+			children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+				className: "text-xs font-medium text-gray-light",
+				children: endLabel
+			}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(TimePicker, {
+				value: end,
+				onValueChange: onEndChange,
+				disabled,
+				"aria-label": endLabel
+			})]
+		})]
+	});
+}
+//#endregion
+exports.TimePicker = TimePicker;
+exports.TimeRangePicker = TimeRangePicker;
+
+//# sourceMappingURL=time-picker.cjs.map

package/dist/components/time-picker.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"time-picker.cjs","names":["React"],"sources":["../../src/components/time-picker.tsx"],"sourcesContent":["import * as React from 'react'\nimport { cn } from '../utils/cn'\n\ninterface TimePickerProps {\n  /** `HH:MM` 24-hour string. */\n  value: string\n  onValueChange: (next: string) => void\n  disabled?: boolean\n  /** Step in seconds (defaults to 60 — minute-resolution). */\n  step?: number\n  className?: string\n  id?: string\n  'aria-label'?: string\n}\n\nconst TimePicker = React.forwardRef<HTMLInputElement, TimePickerProps>(\n  (\n    {\n      'aria-label': ariaLabel,\n      className,\n      disabled,\n      id,\n      onValueChange,\n      step = 60,\n      value,\n    },\n    ref,\n  ) => {\n    return (\n      <input\n        ref={ref}\n        id={id}\n        type=\"time\"\n        value={value}\n        step={step}\n        disabled={disabled}\n        onChange={(event) => onValueChange(event.target.value)}\n        aria-label={ariaLabel}\n        className={cn(\n          'h-10 w-full rounded-xl bg-base-gray-soft px-3 text-base font-medium text-gray tabular-nums transition-colors focus-visible:ring focus-visible:ring-offset-2 focus-visible:outline-hidden disabled:cursor-not-allowed disabled:opacity-50',\n          className,\n        )}\n      />\n    )\n  },\n)\n\nTimePicker.displayName = 'TimePicker'\n\ninterface TimeRangePickerProps {\n  start: string\n  end: string\n  onStartChange: (next: string) => void\n  onEndChange: (next: string) => void\n  disabled?: boolean\n  startLabel?: string\n  endLabel?: string\n  className?: string\n}\n\nfunction TimeRangePicker({\n  className,\n  disabled,\n  end,\n  endLabel = 'End',\n  onEndChange,\n  onStartChange,\n  start,\n  startLabel = 'Start',\n}: TimeRangePickerProps) {\n  return (\n    <div className={cn('grid grid-cols-2 gap-2', className)}>\n      <label className=\"flex flex-col gap-1.5\">\n        <span className=\"text-xs font-medium text-gray-light\">\n          {startLabel}\n        </span>\n        <TimePicker\n          value={start}\n          onValueChange={onStartChange}\n          disabled={disabled}\n          aria-label={startLabel}\n        />\n      </label>\n      <label className=\"flex flex-col gap-1.5\">\n        <span className=\"text-xs font-medium text-gray-light\">{endLabel}</span>\n        <TimePicker\n          value={end}\n          onValueChange={onEndChange}\n          disabled={disabled}\n          aria-label={endLabel}\n        />\n      </label>\n    </div>\n  )\n}\n\nexport { TimePicker, TimeRangePicker }\n"],"mappings":";;;;;;;;AAeA,MAAM,aAAaA,MAAM,YAErB,EACE,cAAc,WACd,WACA,UACA,IACA,eACA,OAAO,IACP,SAEF,QACG;AACH,QACE,iBAAA,GAAA,kBAAA,KAAC,SAAD;EACO;EACD;EACJ,MAAK;EACE;EACD;EACI;EACV,WAAW,UAAU,cAAc,MAAM,OAAO,MAAM;EACtD,cAAY;EACZ,YAAA,GAAA,OAAA,IACE,4OACA,UACD;EACD,CAAA;EAGP;AAED,WAAW,cAAc;AAazB,SAAS,gBAAgB,EACvB,WACA,UACA,KACA,WAAW,OACX,aACA,eACA,OACA,aAAa,WACU;AACvB,QACE,iBAAA,GAAA,kBAAA,MAAC,OAAD;EAAK,YAAA,GAAA,OAAA,IAAc,0BAA0B,UAAU;YAAvD,CACE,iBAAA,GAAA,kBAAA,MAAC,SAAD;GAAO,WAAU;aAAjB,CACE,iBAAA,GAAA,kBAAA,KAAC,QAAD;IAAM,WAAU;cACb;IACI,CAAA,EACP,iBAAA,GAAA,kBAAA,KAAC,YAAD;IACE,OAAO;IACP,eAAe;IACL;IACV,cAAY;IACZ,CAAA,CACI;MACR,iBAAA,GAAA,kBAAA,MAAC,SAAD;GAAO,WAAU;aAAjB,CACE,iBAAA,GAAA,kBAAA,KAAC,QAAD;IAAM,WAAU;cAAuC;IAAgB,CAAA,EACvE,iBAAA,GAAA,kBAAA,KAAC,YAAD;IACE,OAAO;IACP,eAAe;IACL;IACV,cAAY;IACZ,CAAA,CACI;KACJ"}

package/dist/components/time-picker.d.cts

@@ -0,0 +1,41 @@
+"use client";
+
+import * as _$react_jsx_runtime0 from "react/jsx-runtime";
+import * as React$1 from "react";
+
+//#region src/components/time-picker.d.ts
+interface TimePickerProps {
+  /** `HH:MM` 24-hour string. */
+  value: string;
+  onValueChange: (next: string) => void;
+  disabled?: boolean;
+  /** Step in seconds (defaults to 60 — minute-resolution). */
+  step?: number;
+  className?: string;
+  id?: string;
+  'aria-label'?: string;
+}
+declare const TimePicker: React$1.ForwardRefExoticComponent<TimePickerProps & React$1.RefAttributes<HTMLInputElement>>;
+interface TimeRangePickerProps {
+  start: string;
+  end: string;
+  onStartChange: (next: string) => void;
+  onEndChange: (next: string) => void;
+  disabled?: boolean;
+  startLabel?: string;
+  endLabel?: string;
+  className?: string;
+}
+declare function TimeRangePicker({
+  className,
+  disabled,
+  end,
+  endLabel,
+  onEndChange,
+  onStartChange,
+  start,
+  startLabel
+}: TimeRangePickerProps): _$react_jsx_runtime0.JSX.Element;
+//#endregion
+export { TimePicker, TimeRangePicker };
+//# sourceMappingURL=time-picker.d.cts.map

package/dist/components/time-picker.d.ts

@@ -0,0 +1,41 @@
+"use client";
+
+import * as React$1 from "react";
+import * as _$react_jsx_runtime0 from "react/jsx-runtime";
+
+//#region src/components/time-picker.d.ts
+interface TimePickerProps {
+  /** `HH:MM` 24-hour string. */
+  value: string;
+  onValueChange: (next: string) => void;
+  disabled?: boolean;
+  /** Step in seconds (defaults to 60 — minute-resolution). */
+  step?: number;
+  className?: string;
+  id?: string;
+  'aria-label'?: string;
+}
+declare const TimePicker: React$1.ForwardRefExoticComponent<TimePickerProps & React$1.RefAttributes<HTMLInputElement>>;
+interface TimeRangePickerProps {
+  start: string;
+  end: string;
+  onStartChange: (next: string) => void;
+  onEndChange: (next: string) => void;
+  disabled?: boolean;
+  startLabel?: string;
+  endLabel?: string;
+  className?: string;
+}
+declare function TimeRangePicker({
+  className,
+  disabled,
+  end,
+  endLabel,
+  onEndChange,
+  onStartChange,
+  start,
+  startLabel
+}: TimeRangePickerProps): _$react_jsx_runtime0.JSX.Element;
+//#endregion
+export { TimePicker, TimeRangePicker };
+//# sourceMappingURL=time-picker.d.ts.map

package/dist/components/time-picker.js

@@ -0,0 +1,51 @@
+"use client";
+import { cn } from "../utils/cn.js";
+import * as React$1 from "react";
+import { jsx, jsxs } from "react/jsx-runtime";
+//#region src/components/time-picker.tsx
+const TimePicker = React$1.forwardRef(({ "aria-label": ariaLabel, className, disabled, id, onValueChange, step = 60, value }, ref) => {
+	return /* @__PURE__ */ jsx("input", {
+		ref,
+		id,
+		type: "time",
+		value,
+		step,
+		disabled,
+		onChange: (event) => onValueChange(event.target.value),
+		"aria-label": ariaLabel,
+		className: cn("h-10 w-full rounded-xl bg-base-gray-soft px-3 text-base font-medium text-gray tabular-nums transition-colors focus-visible:ring focus-visible:ring-offset-2 focus-visible:outline-hidden disabled:cursor-not-allowed disabled:opacity-50", className)
+	});
+});
+TimePicker.displayName = "TimePicker";
+function TimeRangePicker({ className, disabled, end, endLabel = "End", onEndChange, onStartChange, start, startLabel = "Start" }) {
+	return /* @__PURE__ */ jsxs("div", {
+		className: cn("grid grid-cols-2 gap-2", className),
+		children: [/* @__PURE__ */ jsxs("label", {
+			className: "flex flex-col gap-1.5",
+			children: [/* @__PURE__ */ jsx("span", {
+				className: "text-xs font-medium text-gray-light",
+				children: startLabel
+			}), /* @__PURE__ */ jsx(TimePicker, {
+				value: start,
+				onValueChange: onStartChange,
+				disabled,
+				"aria-label": startLabel
+			})]
+		}), /* @__PURE__ */ jsxs("label", {
+			className: "flex flex-col gap-1.5",
+			children: [/* @__PURE__ */ jsx("span", {
+				className: "text-xs font-medium text-gray-light",
+				children: endLabel
+			}), /* @__PURE__ */ jsx(TimePicker, {
+				value: end,
+				onValueChange: onEndChange,
+				disabled,
+				"aria-label": endLabel
+			})]
+		})]
+	});
+}
+//#endregion
+export { TimePicker, TimeRangePicker };
+
+//# sourceMappingURL=time-picker.js.map

package/dist/components/time-picker.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"time-picker.js","names":["React"],"sources":["../../src/components/time-picker.tsx"],"sourcesContent":["import * as React from 'react'\nimport { cn } from '../utils/cn'\n\ninterface TimePickerProps {\n  /** `HH:MM` 24-hour string. */\n  value: string\n  onValueChange: (next: string) => void\n  disabled?: boolean\n  /** Step in seconds (defaults to 60 — minute-resolution). */\n  step?: number\n  className?: string\n  id?: string\n  'aria-label'?: string\n}\n\nconst TimePicker = React.forwardRef<HTMLInputElement, TimePickerProps>(\n  (\n    {\n      'aria-label': ariaLabel,\n      className,\n      disabled,\n      id,\n      onValueChange,\n      step = 60,\n      value,\n    },\n    ref,\n  ) => {\n    return (\n      <input\n        ref={ref}\n        id={id}\n        type=\"time\"\n        value={value}\n        step={step}\n        disabled={disabled}\n        onChange={(event) => onValueChange(event.target.value)}\n        aria-label={ariaLabel}\n        className={cn(\n          'h-10 w-full rounded-xl bg-base-gray-soft px-3 text-base font-medium text-gray tabular-nums transition-colors focus-visible:ring focus-visible:ring-offset-2 focus-visible:outline-hidden disabled:cursor-not-allowed disabled:opacity-50',\n          className,\n        )}\n      />\n    )\n  },\n)\n\nTimePicker.displayName = 'TimePicker'\n\ninterface TimeRangePickerProps {\n  start: string\n  end: string\n  onStartChange: (next: string) => void\n  onEndChange: (next: string) => void\n  disabled?: boolean\n  startLabel?: string\n  endLabel?: string\n  className?: string\n}\n\nfunction TimeRangePicker({\n  className,\n  disabled,\n  end,\n  endLabel = 'End',\n  onEndChange,\n  onStartChange,\n  start,\n  startLabel = 'Start',\n}: TimeRangePickerProps) {\n  return (\n    <div className={cn('grid grid-cols-2 gap-2', className)}>\n      <label className=\"flex flex-col gap-1.5\">\n        <span className=\"text-xs font-medium text-gray-light\">\n          {startLabel}\n        </span>\n        <TimePicker\n          value={start}\n          onValueChange={onStartChange}\n          disabled={disabled}\n          aria-label={startLabel}\n        />\n      </label>\n      <label className=\"flex flex-col gap-1.5\">\n        <span className=\"text-xs font-medium text-gray-light\">{endLabel}</span>\n        <TimePicker\n          value={end}\n          onValueChange={onEndChange}\n          disabled={disabled}\n          aria-label={endLabel}\n        />\n      </label>\n    </div>\n  )\n}\n\nexport { TimePicker, TimeRangePicker }\n"],"mappings":";;;;;AAeA,MAAM,aAAaA,QAAM,YAErB,EACE,cAAc,WACd,WACA,UACA,IACA,eACA,OAAO,IACP,SAEF,QACG;AACH,QACE,oBAAC,SAAD;EACO;EACD;EACJ,MAAK;EACE;EACD;EACI;EACV,WAAW,UAAU,cAAc,MAAM,OAAO,MAAM;EACtD,cAAY;EACZ,WAAW,GACT,4OACA,UACD;EACD,CAAA;EAGP;AAED,WAAW,cAAc;AAazB,SAAS,gBAAgB,EACvB,WACA,UACA,KACA,WAAW,OACX,aACA,eACA,OACA,aAAa,WACU;AACvB,QACE,qBAAC,OAAD;EAAK,WAAW,GAAG,0BAA0B,UAAU;YAAvD,CACE,qBAAC,SAAD;GAAO,WAAU;aAAjB,CACE,oBAAC,QAAD;IAAM,WAAU;cACb;IACI,CAAA,EACP,oBAAC,YAAD;IACE,OAAO;IACP,eAAe;IACL;IACV,cAAY;IACZ,CAAA,CACI;MACR,qBAAC,SAAD;GAAO,WAAU;aAAjB,CACE,oBAAC,QAAD;IAAM,WAAU;cAAuC;IAAgB,CAAA,EACvE,oBAAC,YAAD;IACE,OAAO;IACP,eAAe;IACL;IACV,cAAY;IACZ,CAAA,CACI;KACJ"}

package/dist/components/toast.cjs

@@ -0,0 +1,99 @@
+"use client";
+"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_spinner = require("./spinner.cjs");
+let react = require("react");
+react = require_chunk.__toESM(react);
+let react_jsx_runtime = require("react/jsx-runtime");
+let sonner = require("sonner");
+let cnfast = require("cnfast");
+//#region src/components/toast.tsx
+const ICONS = Object.fromEntries(Object.entries({
+	success: {
+		name: "check_circle",
+		className: "text-success-light"
+	},
+	info: {
+		name: "info",
+		className: "text-info-light"
+	},
+	warning: {
+		name: "warning",
+		className: "text-warning-light"
+	},
+	error: {
+		name: "cancel",
+		className: "text-error-light"
+	}
+}).map(([type, icon]) => [type, /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_icons_material_symbol.MaterialSymbol, {
+	className: (0, cnfast.cn)("inline-flex shrink-0 items-center [--spark-icon-size:16px]", icon.className),
+	name: icon.name
+}, type)]));
+ICONS.loading = /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_components_spinner.Spinner, {
+	"aria-hidden": "true",
+	className: "flex text-gray-11",
+	label: "",
+	role: "presentation",
+	size: "sm"
+});
+const STYLE_VARS = {
+	"--normal-bg": "var(--color-gray-2)",
+	"--normal-text": "var(--color-gray-12)",
+	"--normal-border": "var(--color-gray-a1)",
+	"--border-radius": "var(--radius-lg)",
+	"--gray1": "var(--color-gray-1)",
+	"--gray2": "var(--color-gray-2)",
+	"--gray3": "var(--color-gray-3)",
+	"--gray4": "var(--color-gray-4)",
+	"--gray5": "var(--color-gray-5)",
+	"--gray11": "var(--color-gray-11)",
+	"--gray12": "var(--color-gray-12)",
+	"--toast-close-button-start": "unset",
+	"--toast-close-button-end": "0",
+	"--toast-close-button-transform": "translate(35%, -35%)",
+	"--success-bg": "var(--color-green-2)",
+	"--success-border": "transparent",
+	"--success-text": "var(--color-green-11)",
+	"--info-bg": "var(--color-blue-2)",
+	"--info-border": "transparent",
+	"--info-text": "var(--color-blue-11)",
+	"--warning-bg": "var(--color-orange-2)",
+	"--warning-border": "transparent",
+	"--warning-text": "var(--color-orange-11)",
+	"--error-bg": "var(--color-red-2)",
+	"--error-border": "transparent",
+	"--error-text": "var(--color-red-11)"
+};
+const CLASS_NAMES = {
+	description: "text-gray-11! [[data-rich-colors=true][data-type]_&]:text-inherit!",
+	actionButton: "bg-spark-9! text-spark-contrast! hover:bg-spark-10! rounded-md!",
+	cancelButton: "bg-gray-a3! text-gray-12! hover:bg-gray-a4! rounded-md!"
+};
+const Toaster = ({ className, closeButton = true, icons, richColors = true, style, toastOptions, ...props }) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)(sonner.Toaster, {
+	className: (0, cnfast.cn)("toaster group", className),
+	closeButton,
+	icons: {
+		...ICONS,
+		...icons
+	},
+	richColors,
+	style: {
+		...STYLE_VARS,
+		...style
+	},
+	toastOptions: {
+		...toastOptions,
+		classNames: {
+			...CLASS_NAMES,
+			...toastOptions?.classNames
+		}
+	},
+	...props
+});
+//#endregion
+exports.Toaster = Toaster;
+exports.toast = sonner.toast;
+
+//# sourceMappingURL=toast.cjs.map

package/dist/components/toast.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"toast.cjs","names":["MaterialSymbol","Spinner","Sonner"],"sources":["../../src/components/toast.tsx"],"sourcesContent":["'use client'\n\nimport * as React from 'react'\nimport { Toaster as Sonner, toast, type ToasterProps } from 'sonner'\nimport {\n  MaterialSymbol,\n  type MaterialSymbolIconName,\n} from '../icons/material-symbol'\nimport { cn } from '../utils/cn'\nimport { Spinner } from './spinner'\n\n// sonner's icon slot is a fixed 16px box that does not scale, so the glyphs\n// are pinned to 16px rather than the usual --spark-scaling formula\nconst TOAST_ICONS: Record<\n  'success' | 'info' | 'warning' | 'error',\n  { name: MaterialSymbolIconName; className: string }\n> = {\n  success: { name: 'check_circle', className: 'text-success-light' },\n  info: { name: 'info', className: 'text-info-light' },\n  warning: { name: 'warning', className: 'text-warning-light' },\n  error: { name: 'cancel', className: 'text-error-light' },\n}\n\nconst ICONS: ToasterProps['icons'] = Object.fromEntries(\n  Object.entries(TOAST_ICONS).map(([type, icon]) => [\n    type,\n    <MaterialSymbol\n      className={cn(\n        'inline-flex shrink-0 items-center [--spark-icon-size:16px]',\n        icon.className,\n      )}\n      key={type}\n      name={icon.name}\n    />,\n  ]),\n)\n// decorative: the toast itself announces the loading message, so the spinner\n// must not add its own status live region; `flex` kills the inline baseline\n// gap that pushes it off-center inside sonner's loader wrapper\nICONS.loading = (\n  <Spinner\n    aria-hidden=\"true\"\n    className=\"flex text-gray-11\"\n    label=\"\"\n    role=\"presentation\"\n    size=\"sm\"\n  />\n)\n\nconst STYLE_VARS = {\n  '--normal-bg': 'var(--color-gray-2)',\n  '--normal-text': 'var(--color-gray-12)',\n  '--normal-border': 'var(--color-gray-a1)',\n  '--border-radius': 'var(--radius-lg)',\n  // sonner's own gray scale (close button, cancel button) — remapped so it\n  // follows the spark theme instead of sonner's hardcoded light-only values\n  '--gray1': 'var(--color-gray-1)',\n  '--gray2': 'var(--color-gray-2)',\n  '--gray3': 'var(--color-gray-3)',\n  '--gray4': 'var(--color-gray-4)',\n  '--gray5': 'var(--color-gray-5)',\n  '--gray11': 'var(--color-gray-11)',\n  '--gray12': 'var(--color-gray-12)',\n  // close button on the top-right corner (sonner defaults to top-left in ltr)\n  '--toast-close-button-start': 'unset',\n  '--toast-close-button-end': '0',\n  '--toast-close-button-transform': 'translate(35%, -35%)',\n  // rich-color palette — opaque radix steps (bg 2, text 11) so floating\n  // toasts don't let page content bleed through the way alpha `-soft`\n  // tokens would; borders off per design\n  '--success-bg': 'var(--color-green-2)',\n  '--success-border': 'transparent',\n  '--success-text': 'var(--color-green-11)',\n  '--info-bg': 'var(--color-blue-2)',\n  '--info-border': 'transparent',\n  '--info-text': 'var(--color-blue-11)',\n  '--warning-bg': 'var(--color-orange-2)',\n  '--warning-border': 'transparent',\n  '--warning-text': 'var(--color-orange-11)',\n  '--error-bg': 'var(--color-red-2)',\n  '--error-border': 'transparent',\n  '--error-text': 'var(--color-red-11)',\n} as React.CSSProperties\n\nconst CLASS_NAMES = {\n  // sonner hardcodes the description color (#3f3f3f) and its styles are\n  // unlayered, so only important utilities win; typed rich toasts restore\n  // the tinted inherit (untyped toasts carry data-rich-colors too, so the\n  // guard needs both attributes)\n  description:\n    'text-gray-11! [[data-rich-colors=true][data-type]_&]:text-inherit!',\n  actionButton:\n    'bg-spark-9! text-spark-contrast! hover:bg-spark-10! rounded-md!',\n  cancelButton: 'bg-gray-a3! text-gray-12! hover:bg-gray-a4! rounded-md!',\n}\n\n// consumer props merge with (not replace) the spark theming — React itself\n// would wholesale-replace object props like `style`\nconst Toaster = ({\n  className,\n  closeButton = true,\n  icons,\n  richColors = true,\n  style,\n  toastOptions,\n  ...props\n}: ToasterProps) => (\n  <Sonner\n    className={cn('toaster group', className)}\n    closeButton={closeButton}\n    icons={{ ...ICONS, ...icons }}\n    richColors={richColors}\n    style={{ ...STYLE_VARS, ...style }}\n    toastOptions={{\n      ...toastOptions,\n      classNames: { ...CLASS_NAMES, ...toastOptions?.classNames },\n    }}\n    {...props}\n  />\n)\n\nexport { Toaster, toast }\nexport type { ToasterProps }\n"],"mappings":";;;;;;;;;;;;AAuBA,MAAM,QAA+B,OAAO,YAC1C,OAAO,QAAQ;CAPf,SAAS;EAAE,MAAM;EAAgB,WAAW;EAAsB;CAClE,MAAM;EAAE,MAAM;EAAQ,WAAW;EAAmB;CACpD,SAAS;EAAE,MAAM;EAAW,WAAW;EAAsB;CAC7D,OAAO;EAAE,MAAM;EAAU,WAAW;EAAoB;CAI9B,CAAC,CAAC,KAAK,CAAC,MAAM,UAAU,CAChD,MACA,iBAAA,GAAA,kBAAA,KAACA,8BAAAA,gBAAD;CACE,YAAA,GAAA,OAAA,IACE,8DACA,KAAK,UACN;CAED,MAAM,KAAK;CACX,EAFK,KAEL,CACH,CAAC,CACH;AAID,MAAM,UACJ,iBAAA,GAAA,kBAAA,KAACC,2BAAAA,SAAD;CACE,eAAY;CACZ,WAAU;CACV,OAAM;CACN,MAAK;CACL,MAAK;CACL,CAAA;AAGJ,MAAM,aAAa;CACjB,eAAe;CACf,iBAAiB;CACjB,mBAAmB;CACnB,mBAAmB;CAGnB,WAAW;CACX,WAAW;CACX,WAAW;CACX,WAAW;CACX,WAAW;CACX,YAAY;CACZ,YAAY;CAEZ,8BAA8B;CAC9B,4BAA4B;CAC5B,kCAAkC;CAIlC,gBAAgB;CAChB,oBAAoB;CACpB,kBAAkB;CAClB,aAAa;CACb,iBAAiB;CACjB,eAAe;CACf,gBAAgB;CAChB,oBAAoB;CACpB,kBAAkB;CAClB,cAAc;CACd,kBAAkB;CAClB,gBAAgB;CACjB;AAED,MAAM,cAAc;CAKlB,aACE;CACF,cACE;CACF,cAAc;CACf;AAID,MAAM,WAAW,EACf,WACA,cAAc,MACd,OACA,aAAa,MACb,OACA,cACA,GAAG,YAEH,iBAAA,GAAA,kBAAA,KAACC,OAAAA,SAAD;CACE,YAAA,GAAA,OAAA,IAAc,iBAAiB,UAAU;CAC5B;CACb,OAAO;EAAE,GAAG;EAAO,GAAG;EAAO;CACjB;CACZ,OAAO;EAAE,GAAG;EAAY,GAAG;EAAO;CAClC,cAAc;EACZ,GAAG;EACH,YAAY;GAAE,GAAG;GAAa,GAAG,cAAc;GAAY;EAC5D;CACD,GAAI;CACJ,CAAA"}

package/dist/components/toast.d.cts

@@ -0,0 +1,18 @@
+"use client";
+
+import * as _$react_jsx_runtime0 from "react/jsx-runtime";
+import { ToasterProps, toast } from "sonner";
+
+//#region src/components/toast.d.ts
+declare const Toaster: ({
+  className,
+  closeButton,
+  icons,
+  richColors,
+  style,
+  toastOptions,
+  ...props
+}: ToasterProps) => _$react_jsx_runtime0.JSX.Element;
+//#endregion
+export { Toaster, type ToasterProps, toast };
+//# sourceMappingURL=toast.d.cts.map

package/dist/components/toast.d.ts

@@ -0,0 +1,18 @@
+"use client";
+
+import * as _$react_jsx_runtime0 from "react/jsx-runtime";
+import { ToasterProps, toast } from "sonner";
+
+//#region src/components/toast.d.ts
+declare const Toaster: ({
+  className,
+  closeButton,
+  icons,
+  richColors,
+  style,
+  toastOptions,
+  ...props
+}: ToasterProps) => _$react_jsx_runtime0.JSX.Element;
+//#endregion
+export { Toaster, type ToasterProps, toast };
+//# sourceMappingURL=toast.d.ts.map

package/dist/components/toast.js

@@ -0,0 +1,95 @@
+"use client";
+"use client";
+import { cn } from "../utils/cn.js";
+import { MaterialSymbol } from "../icons/material-symbol.js";
+import { Spinner } from "./spinner.js";
+import "react";
+import { jsx } from "react/jsx-runtime";
+import { Toaster as Toaster$1, toast } from "sonner";
+//#region src/components/toast.tsx
+const ICONS = Object.fromEntries(Object.entries({
+	success: {
+		name: "check_circle",
+		className: "text-success-light"
+	},
+	info: {
+		name: "info",
+		className: "text-info-light"
+	},
+	warning: {
+		name: "warning",
+		className: "text-warning-light"
+	},
+	error: {
+		name: "cancel",
+		className: "text-error-light"
+	}
+}).map(([type, icon]) => [type, /* @__PURE__ */ jsx(MaterialSymbol, {
+	className: cn("inline-flex shrink-0 items-center [--spark-icon-size:16px]", icon.className),
+	name: icon.name
+}, type)]));
+ICONS.loading = /* @__PURE__ */ jsx(Spinner, {
+	"aria-hidden": "true",
+	className: "flex text-gray-11",
+	label: "",
+	role: "presentation",
+	size: "sm"
+});
+const STYLE_VARS = {
+	"--normal-bg": "var(--color-gray-2)",
+	"--normal-text": "var(--color-gray-12)",
+	"--normal-border": "var(--color-gray-a1)",
+	"--border-radius": "var(--radius-lg)",
+	"--gray1": "var(--color-gray-1)",
+	"--gray2": "var(--color-gray-2)",
+	"--gray3": "var(--color-gray-3)",
+	"--gray4": "var(--color-gray-4)",
+	"--gray5": "var(--color-gray-5)",
+	"--gray11": "var(--color-gray-11)",
+	"--gray12": "var(--color-gray-12)",
+	"--toast-close-button-start": "unset",
+	"--toast-close-button-end": "0",
+	"--toast-close-button-transform": "translate(35%, -35%)",
+	"--success-bg": "var(--color-green-2)",
+	"--success-border": "transparent",
+	"--success-text": "var(--color-green-11)",
+	"--info-bg": "var(--color-blue-2)",
+	"--info-border": "transparent",
+	"--info-text": "var(--color-blue-11)",
+	"--warning-bg": "var(--color-orange-2)",
+	"--warning-border": "transparent",
+	"--warning-text": "var(--color-orange-11)",
+	"--error-bg": "var(--color-red-2)",
+	"--error-border": "transparent",
+	"--error-text": "var(--color-red-11)"
+};
+const CLASS_NAMES = {
+	description: "text-gray-11! [[data-rich-colors=true][data-type]_&]:text-inherit!",
+	actionButton: "bg-spark-9! text-spark-contrast! hover:bg-spark-10! rounded-md!",
+	cancelButton: "bg-gray-a3! text-gray-12! hover:bg-gray-a4! rounded-md!"
+};
+const Toaster = ({ className, closeButton = true, icons, richColors = true, style, toastOptions, ...props }) => /* @__PURE__ */ jsx(Toaster$1, {
+	className: cn("toaster group", className),
+	closeButton,
+	icons: {
+		...ICONS,
+		...icons
+	},
+	richColors,
+	style: {
+		...STYLE_VARS,
+		...style
+	},
+	toastOptions: {
+		...toastOptions,
+		classNames: {
+			...CLASS_NAMES,
+			...toastOptions?.classNames
+		}
+	},
+	...props
+});
+//#endregion
+export { Toaster, toast };
+
+//# sourceMappingURL=toast.js.map