@epilot/spark-ui 0.23.1 → 0.24.0

package/dist/components/sheet.cjs

@@ -2,9 +2,9 @@
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 const require_chunk = require("../chunk-DY84GLCh.cjs");
 const require_components_button = require("./button.cjs");
+let _epilot_spark_icons = require("@epilot/spark-icons");
 let react = require("react");
 react = require_chunk.__toESM(react);
-let _epilot_spark_icons = require("@epilot/spark-icons");
 let react_jsx_runtime = require("react/jsx-runtime");
 let _base_ui_react_dialog = require("@base-ui/react/dialog");
 let cn = require("cn");
@@ -52,7 +52,7 @@ 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, cn.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),
+		className: (0, cn.cn)("fixed z-50 flex flex-col gap-4 border-gray-a1 bg-gray-2 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
 	});
 }

package/dist/components/sheet.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"sheet.cjs","names":["SheetPrimitive","buttonVariants","Close"],"sources":["../../src/components/sheet.tsx"],"sourcesContent":["import { Dialog as SheetPrimitive } from '@base-ui/react/dialog'\nimport { Close } from '@epilot/spark-icons'\nimport * as React from 'react'\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      <Close className=\"[--spark-icon-size:calc(20px*var(--spark-scaling,1))]\" />\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;CACtE,OAAO,iBAAA,GAAA,kBAAA,KAACA,sBAAAA,OAAe,MAAhB,EAAqB,GAAI,MAAQ,CAAA;AAC1C;AAEA,SAAS,aACP,OACA;CACA,OAAO,iBAAA,GAAA,kBAAA,KAACA,sBAAAA,OAAe,SAAhB;EAAwB,aAAU;EAAgB,GAAI;CAAQ,CAAA;AACvE;AAIA,SAAS,WAAW,EAClB,WACA,UACA,GAAG,SACiD;CACpD,IAAI,YAAY,MAAM,QACpB,OACE,iBAAA,GAAA,kBAAA,KAACA,sBAAAA,OAAe,OAAhB;EACE,aAAU;EACC;EACX,GAAI;EAEH;CACmB,CAAA;CAI1B,OACE,iBAAA,GAAA,kBAAA,KAACA,sBAAAA,OAAe,OAAhB;EACE,aAAU;EACV,YAAA,GAAA,GAAA,IACEC,0BAAAA,eAAe;GAAE,MAAM;GAAQ,SAAS;EAAW,CAAC,GACpD,yCACA,SACF;EACA,GAAI;YAEJ,iBAAA,GAAA,kBAAA,KAACC,oBAAAA,OAAD,EAAO,WAAU,wDAAyD,CAAA;CACtD,CAAA;AAE1B;AAEA,SAAS,YACP,OACA;CACA,OAAO,iBAAA,GAAA,kBAAA,KAACF,sBAAAA,OAAe,QAAhB;EAAuB,aAAU;EAAe,GAAI;CAAQ,CAAA;AACrE;AAEA,SAAS,aAAa,EACpB,WACA,GAAG,SACoD;CACvD,OACE,iBAAA,GAAA,kBAAA,KAACA,sBAAAA,OAAe,UAAhB;EACE,aAAU;EACV,YAAA,GAAA,GAAA,IACE,wOACA,SACF;EACA,GAAI;CACL,CAAA;AAEL;AAQA,SAAS,aAAa,EACpB,OAAO,SACP,WACA,GAAG,SACiB;CACpB,OACE,iBAAA,GAAA,kBAAA,KAACA,sBAAAA,OAAe,OAAhB;EACE,aAAU;EACV,aAAW;EACX,YAAA,GAAA,GAAA,IACE,4MACA,6MACA,uOACA,qTACA,4TACA,SACF;EACA,GAAI;CACL,CAAA;AAEL;AAEA,SAAS,YAAY,EAAE,WAAW,GAAG,SAAsC;CACzE,OACE,iBAAA,GAAA,kBAAA,KAAC,OAAD;EACE,aAAU;EACV,YAAA,GAAA,GAAA,IAAc,gDAAgD,SAAS;EACvE,GAAI;CACL,CAAA;AAEL;AAEA,SAAS,YAAY,EAAE,WAAW,GAAG,SAAsC;CACzE,OACE,iBAAA,GAAA,kBAAA,KAAC,OAAD;EACE,aAAU;EACV,YAAA,GAAA,GAAA,IACE,kEACA,SACF;EACA,GAAI;CACL,CAAA;AAEL;AAEA,SAAS,WAAW,EAClB,WACA,GAAG,SACiD;CACpD,OACE,iBAAA,GAAA,kBAAA,KAACA,sBAAAA,OAAe,OAAhB;EACE,aAAU;EACV,YAAA,GAAA,GAAA,IAAc,mCAAmC,SAAS;EAC1D,GAAI;CACL,CAAA;AAEL;AAEA,SAAS,iBAAiB,EACxB,WACA,GAAG,SACuD;CAC1D,OACE,iBAAA,GAAA,kBAAA,KAACA,sBAAAA,OAAe,aAAhB;EACE,aAAU;EACV,YAAA,GAAA,GAAA,IAAc,2BAA2B,SAAS;EAClD,GAAI;CACL,CAAA;AAEL"}
+{"version":3,"file":"sheet.cjs","names":["SheetPrimitive","buttonVariants","Close"],"sources":["../../src/components/sheet.tsx"],"sourcesContent":["import { Dialog as SheetPrimitive } from '@base-ui/react/dialog'\nimport { Close } from '@epilot/spark-icons'\nimport * as React from 'react'\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      <Close className=\"[--spark-icon-size:calc(20px*var(--spark-scaling,1))]\" />\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-2 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;CACtE,OAAO,iBAAA,GAAA,kBAAA,KAACA,sBAAAA,OAAe,MAAhB,EAAqB,GAAI,MAAQ,CAAA;AAC1C;AAEA,SAAS,aACP,OACA;CACA,OAAO,iBAAA,GAAA,kBAAA,KAACA,sBAAAA,OAAe,SAAhB;EAAwB,aAAU;EAAgB,GAAI;CAAQ,CAAA;AACvE;AAIA,SAAS,WAAW,EAClB,WACA,UACA,GAAG,SACiD;CACpD,IAAI,YAAY,MAAM,QACpB,OACE,iBAAA,GAAA,kBAAA,KAACA,sBAAAA,OAAe,OAAhB;EACE,aAAU;EACC;EACX,GAAI;EAEH;CACmB,CAAA;CAI1B,OACE,iBAAA,GAAA,kBAAA,KAACA,sBAAAA,OAAe,OAAhB;EACE,aAAU;EACV,YAAA,GAAA,GAAA,IACEC,0BAAAA,eAAe;GAAE,MAAM;GAAQ,SAAS;EAAW,CAAC,GACpD,yCACA,SACF;EACA,GAAI;YAEJ,iBAAA,GAAA,kBAAA,KAACC,oBAAAA,OAAD,EAAO,WAAU,wDAAyD,CAAA;CACtD,CAAA;AAE1B;AAEA,SAAS,YACP,OACA;CACA,OAAO,iBAAA,GAAA,kBAAA,KAACF,sBAAAA,OAAe,QAAhB;EAAuB,aAAU;EAAe,GAAI;CAAQ,CAAA;AACrE;AAEA,SAAS,aAAa,EACpB,WACA,GAAG,SACoD;CACvD,OACE,iBAAA,GAAA,kBAAA,KAACA,sBAAAA,OAAe,UAAhB;EACE,aAAU;EACV,YAAA,GAAA,GAAA,IACE,wOACA,SACF;EACA,GAAI;CACL,CAAA;AAEL;AAQA,SAAS,aAAa,EACpB,OAAO,SACP,WACA,GAAG,SACiB;CACpB,OACE,iBAAA,GAAA,kBAAA,KAACA,sBAAAA,OAAe,OAAhB;EACE,aAAU;EACV,aAAW;EACX,YAAA,GAAA,GAAA,IACE,4MACA,6MACA,uOACA,qTACA,4TACA,SACF;EACA,GAAI;CACL,CAAA;AAEL;AAEA,SAAS,YAAY,EAAE,WAAW,GAAG,SAAsC;CACzE,OACE,iBAAA,GAAA,kBAAA,KAAC,OAAD;EACE,aAAU;EACV,YAAA,GAAA,GAAA,IAAc,gDAAgD,SAAS;EACvE,GAAI;CACL,CAAA;AAEL;AAEA,SAAS,YAAY,EAAE,WAAW,GAAG,SAAsC;CACzE,OACE,iBAAA,GAAA,kBAAA,KAAC,OAAD;EACE,aAAU;EACV,YAAA,GAAA,GAAA,IACE,kEACA,SACF;EACA,GAAI;CACL,CAAA;AAEL;AAEA,SAAS,WAAW,EAClB,WACA,GAAG,SACiD;CACpD,OACE,iBAAA,GAAA,kBAAA,KAACA,sBAAAA,OAAe,OAAhB;EACE,aAAU;EACV,YAAA,GAAA,GAAA,IAAc,mCAAmC,SAAS;EAC1D,GAAI;CACL,CAAA;AAEL;AAEA,SAAS,iBAAiB,EACxB,WACA,GAAG,SACuD;CAC1D,OACE,iBAAA,GAAA,kBAAA,KAACA,sBAAAA,OAAe,aAAhB;EACE,aAAU;EACV,YAAA,GAAA,GAAA,IAAc,2BAA2B,SAAS;EAClD,GAAI;CACL,CAAA;AAEL"}

package/dist/components/sheet.js

@@ -1,8 +1,8 @@
 "use client";
 import { cn } from "../utils/cn.js";
 import { buttonVariants } from "./button.js";
-import "react";
 import { Close } from "@epilot/spark-icons";
+import "react";
 import { jsx } from "react/jsx-runtime";
 import { Dialog } from "@base-ui/react/dialog";
 //#region src/components/sheet.tsx
@@ -49,7 +49,7 @@ 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),
+		className: cn("fixed z-50 flex flex-col gap-4 border-gray-a1 bg-gray-2 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
 	});
 }

package/dist/components/sheet.js.map

@@ -1 +1 @@
-{"version":3,"file":"sheet.js","names":["SheetPrimitive"],"sources":["../../src/components/sheet.tsx"],"sourcesContent":["import { Dialog as SheetPrimitive } from '@base-ui/react/dialog'\nimport { Close } from '@epilot/spark-icons'\nimport * as React from 'react'\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      <Close className=\"[--spark-icon-size:calc(20px*var(--spark-scaling,1))]\" />\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;CACtE,OAAO,oBAACA,OAAe,MAAhB,EAAqB,GAAI,MAAQ,CAAA;AAC1C;AAEA,SAAS,aACP,OACA;CACA,OAAO,oBAACA,OAAe,SAAhB;EAAwB,aAAU;EAAgB,GAAI;CAAQ,CAAA;AACvE;AAIA,SAAS,WAAW,EAClB,WACA,UACA,GAAG,SACiD;CACpD,IAAI,YAAY,MAAM,QACpB,OACE,oBAACA,OAAe,OAAhB;EACE,aAAU;EACC;EACX,GAAI;EAEH;CACmB,CAAA;CAI1B,OACE,oBAACA,OAAe,OAAhB;EACE,aAAU;EACV,WAAW,GACT,eAAe;GAAE,MAAM;GAAQ,SAAS;EAAW,CAAC,GACpD,yCACA,SACF;EACA,GAAI;YAEJ,oBAAC,OAAD,EAAO,WAAU,wDAAyD,CAAA;CACtD,CAAA;AAE1B;AAEA,SAAS,YACP,OACA;CACA,OAAO,oBAACA,OAAe,QAAhB;EAAuB,aAAU;EAAe,GAAI;CAAQ,CAAA;AACrE;AAEA,SAAS,aAAa,EACpB,WACA,GAAG,SACoD;CACvD,OACE,oBAACA,OAAe,UAAhB;EACE,aAAU;EACV,WAAW,GACT,wOACA,SACF;EACA,GAAI;CACL,CAAA;AAEL;AAQA,SAAS,aAAa,EACpB,OAAO,SACP,WACA,GAAG,SACiB;CACpB,OACE,oBAACA,OAAe,OAAhB;EACE,aAAU;EACV,aAAW;EACX,WAAW,GACT,4MACA,6MACA,uOACA,qTACA,4TACA,SACF;EACA,GAAI;CACL,CAAA;AAEL;AAEA,SAAS,YAAY,EAAE,WAAW,GAAG,SAAsC;CACzE,OACE,oBAAC,OAAD;EACE,aAAU;EACV,WAAW,GAAG,gDAAgD,SAAS;EACvE,GAAI;CACL,CAAA;AAEL;AAEA,SAAS,YAAY,EAAE,WAAW,GAAG,SAAsC;CACzE,OACE,oBAAC,OAAD;EACE,aAAU;EACV,WAAW,GACT,kEACA,SACF;EACA,GAAI;CACL,CAAA;AAEL;AAEA,SAAS,WAAW,EAClB,WACA,GAAG,SACiD;CACpD,OACE,oBAACA,OAAe,OAAhB;EACE,aAAU;EACV,WAAW,GAAG,mCAAmC,SAAS;EAC1D,GAAI;CACL,CAAA;AAEL;AAEA,SAAS,iBAAiB,EACxB,WACA,GAAG,SACuD;CAC1D,OACE,oBAACA,OAAe,aAAhB;EACE,aAAU;EACV,WAAW,GAAG,2BAA2B,SAAS;EAClD,GAAI;CACL,CAAA;AAEL"}
+{"version":3,"file":"sheet.js","names":["SheetPrimitive"],"sources":["../../src/components/sheet.tsx"],"sourcesContent":["import { Dialog as SheetPrimitive } from '@base-ui/react/dialog'\nimport { Close } from '@epilot/spark-icons'\nimport * as React from 'react'\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      <Close className=\"[--spark-icon-size:calc(20px*var(--spark-scaling,1))]\" />\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-2 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;CACtE,OAAO,oBAACA,OAAe,MAAhB,EAAqB,GAAI,MAAQ,CAAA;AAC1C;AAEA,SAAS,aACP,OACA;CACA,OAAO,oBAACA,OAAe,SAAhB;EAAwB,aAAU;EAAgB,GAAI;CAAQ,CAAA;AACvE;AAIA,SAAS,WAAW,EAClB,WACA,UACA,GAAG,SACiD;CACpD,IAAI,YAAY,MAAM,QACpB,OACE,oBAACA,OAAe,OAAhB;EACE,aAAU;EACC;EACX,GAAI;EAEH;CACmB,CAAA;CAI1B,OACE,oBAACA,OAAe,OAAhB;EACE,aAAU;EACV,WAAW,GACT,eAAe;GAAE,MAAM;GAAQ,SAAS;EAAW,CAAC,GACpD,yCACA,SACF;EACA,GAAI;YAEJ,oBAAC,OAAD,EAAO,WAAU,wDAAyD,CAAA;CACtD,CAAA;AAE1B;AAEA,SAAS,YACP,OACA;CACA,OAAO,oBAACA,OAAe,QAAhB;EAAuB,aAAU;EAAe,GAAI;CAAQ,CAAA;AACrE;AAEA,SAAS,aAAa,EACpB,WACA,GAAG,SACoD;CACvD,OACE,oBAACA,OAAe,UAAhB;EACE,aAAU;EACV,WAAW,GACT,wOACA,SACF;EACA,GAAI;CACL,CAAA;AAEL;AAQA,SAAS,aAAa,EACpB,OAAO,SACP,WACA,GAAG,SACiB;CACpB,OACE,oBAACA,OAAe,OAAhB;EACE,aAAU;EACV,aAAW;EACX,WAAW,GACT,4MACA,6MACA,uOACA,qTACA,4TACA,SACF;EACA,GAAI;CACL,CAAA;AAEL;AAEA,SAAS,YAAY,EAAE,WAAW,GAAG,SAAsC;CACzE,OACE,oBAAC,OAAD;EACE,aAAU;EACV,WAAW,GAAG,gDAAgD,SAAS;EACvE,GAAI;CACL,CAAA;AAEL;AAEA,SAAS,YAAY,EAAE,WAAW,GAAG,SAAsC;CACzE,OACE,oBAAC,OAAD;EACE,aAAU;EACV,WAAW,GACT,kEACA,SACF;EACA,GAAI;CACL,CAAA;AAEL;AAEA,SAAS,WAAW,EAClB,WACA,GAAG,SACiD;CACpD,OACE,oBAACA,OAAe,OAAhB;EACE,aAAU;EACV,WAAW,GAAG,mCAAmC,SAAS;EAC1D,GAAI;CACL,CAAA;AAEL;AAEA,SAAS,iBAAiB,EACxB,WACA,GAAG,SACuD;CAC1D,OACE,oBAACA,OAAe,aAAhB;EACE,aAAU;EACV,WAAW,GAAG,2BAA2B,SAAS;EAClD,GAAI;CACL,CAAA;AAEL"}

package/dist/components/solar-forecast-chart.d.ts

@@ -1,8 +1,8 @@
 "use client";
 
 import { LineChartCurve, LineChartDatum } from "./line-chart.js";
-import { JSX, ReactNode } from "react";
 import { SparkIcon } from "@epilot/spark-icons";
+import { JSX, ReactNode } from "react";
 
 //#region src/components/solar-forecast-chart.d.ts
 interface SolarForecastWeatherPoint {

package/dist/components/stepper.cjs

@@ -1,9 +1,9 @@
 "use client";
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 const require_chunk = require("../chunk-DY84GLCh.cjs");
+let _epilot_spark_icons = require("@epilot/spark-icons");
 let react = require("react");
 react = require_chunk.__toESM(react);
-let _epilot_spark_icons = require("@epilot/spark-icons");
 let react_jsx_runtime = require("react/jsx-runtime");
 let cn = require("cn");
 //#region src/components/stepper.tsx

package/dist/components/stepper.js

@@ -1,7 +1,7 @@
 "use client";
 import { cn } from "../utils/cn.js";
-import * as React$1 from "react";
 import { ChevronLeft, ChevronRight } from "@epilot/spark-icons";
+import * as React$1 from "react";
 import { jsx, jsxs } from "react/jsx-runtime";
 //#region src/components/stepper.tsx
 const Stepper = React$1.forwardRef(({ value, onValueChange, onValueCommit, min = 0, max = 100, step = 1, formatValue = (v) => String(v), disabled, className, commitDelayMs = 400, "aria-label": ariaLabel, decreaseLabel, increaseLabel }, ref) => {

package/dist/components/table.cjs

@@ -2,9 +2,9 @@
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 const require_chunk = require("../chunk-DY84GLCh.cjs");
 const require_components_skeleton = require("./skeleton.cjs");
+let _epilot_spark_icons = require("@epilot/spark-icons");
 let react = require("react");
 react = require_chunk.__toESM(react);
-let _epilot_spark_icons = require("@epilot/spark-icons");
 let react_jsx_runtime = require("react/jsx-runtime");
 let cn = require("cn");
 //#region src/components/table.tsx

package/dist/components/table.js

@@ -1,8 +1,8 @@
 "use client";
 import { cn } from "../utils/cn.js";
 import { Skeleton } from "./skeleton.js";
-import * as React$1 from "react";
 import { ArrowDownward, ArrowUpward, SwapVert } from "@epilot/spark-icons";
+import * as React$1 from "react";
 import { jsx, jsxs } from "react/jsx-runtime";
 //#region src/components/table.tsx
 const TableContext = React$1.createContext({

package/dist/components/tabs.cjs

@@ -1,9 +1,9 @@
 "use client";
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 const require_chunk = require("../chunk-DY84GLCh.cjs");
+let _epilot_spark_icons = require("@epilot/spark-icons");
 let react = require("react");
 react = require_chunk.__toESM(react);
-let _epilot_spark_icons = require("@epilot/spark-icons");
 let react_jsx_runtime = require("react/jsx-runtime");
 let _base_ui_react_tabs = require("@base-ui/react/tabs");
 let cn = require("cn");

package/dist/components/tabs.js

@@ -1,7 +1,7 @@
 "use client";
 import { cn } from "../utils/cn.js";
-import * as React$1 from "react";
 import { ChevronLeft, ChevronRight } from "@epilot/spark-icons";
+import * as React$1 from "react";
 import { jsx, jsxs } from "react/jsx-runtime";
 import { Tabs as Tabs$1 } from "@base-ui/react/tabs";
 //#region src/components/tabs.tsx

package/dist/components/toast.cjs

@@ -4,9 +4,9 @@ Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 const require_chunk = require("../chunk-DY84GLCh.cjs");
 const require_components_button = require("./button.cjs");
 const require_components_spinner = require("./spinner.cjs");
+let _epilot_spark_icons = require("@epilot/spark-icons");
 let react = require("react");
 react = require_chunk.__toESM(react);
-let _epilot_spark_icons = require("@epilot/spark-icons");
 let react_jsx_runtime = require("react/jsx-runtime");
 let _base_ui_react_toast = require("@base-ui/react/toast");
 let cn = require("cn");

package/dist/components/toast.js

@@ -3,8 +3,8 @@
 import { cn } from "../utils/cn.js";
 import { buttonVariants } from "./button.js";
 import { Spinner } from "./spinner.js";
-import "react";
 import { Cancel, CheckCircle, Close, Info, Warning } from "@epilot/spark-icons";
+import "react";
 import { jsx, jsxs } from "react/jsx-runtime";
 import { Toast } from "@base-ui/react/toast";
 //#region src/components/toast.tsx

package/dist/components/tooltip.cjs

@@ -1,9 +1,9 @@
 "use client";
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 const require_chunk = require("../chunk-DY84GLCh.cjs");
+let _epilot_spark_icons = require("@epilot/spark-icons");
 let react = require("react");
 react = require_chunk.__toESM(react);
-let _epilot_spark_icons = require("@epilot/spark-icons");
 let react_jsx_runtime = require("react/jsx-runtime");
 let _base_ui_react_tooltip = require("@base-ui/react/tooltip");
 let cn = require("cn");

package/dist/components/tooltip.js

@@ -1,7 +1,7 @@
 "use client";
 import { cn } from "../utils/cn.js";
-import "react";
 import { Info } from "@epilot/spark-icons";
+import "react";
 import { jsx, jsxs } from "react/jsx-runtime";
 import { Tooltip as Tooltip$1 } from "@base-ui/react/tooltip";
 //#region src/components/tooltip.tsx

package/dist/components/trace.cjs

@@ -0,0 +1,88 @@
+"use client";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const require_chunk = require("../chunk-DY84GLCh.cjs");
+let _epilot_spark_icons = require("@epilot/spark-icons");
+let react = require("react");
+react = require_chunk.__toESM(react);
+let react_jsx_runtime = require("react/jsx-runtime");
+let _base_ui_react_collapsible = require("@base-ui/react/collapsible");
+let cn = require("cn");
+//#region src/components/trace.tsx
+function Trace({ className, ...props }) {
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+		"data-slot": "trace",
+		className: (0, cn.cn)("flex w-full min-w-0 flex-col gap-2 *:has-[>[data-slot=trace-line]]:touch-target *:has-[>[data-slot=trace-line]]:flex *:has-[>[data-slot=trace-line]]:min-h-[1.5rem] *:has-[>[data-slot=trace-line]]:w-fit *:has-[>[data-slot=trace-line]]:max-w-full *:has-[>[data-slot=trace-line]]:min-w-0 *:has-[>[data-slot=trace-line]]:items-center *:has-[>[data-slot=trace-line]]:rounded-md *:has-[>[data-slot=trace-line]]:text-left *:has-[>[data-slot=trace-line]]:focus-visible:ring-2 *:has-[>[data-slot=trace-line]]:focus-visible:ring-offset-2 *:has-[>[data-slot=trace-line]]:focus-visible:outline-hidden", className),
+		...props
+	});
+}
+function TraceLine({ className, status, ...props }) {
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+		"data-slot": "trace-line",
+		"data-status": status,
+		className: (0, cn.cn)("flex w-fit max-w-full min-w-0 items-center gap-2 text-sm text-gray-light transition-colors in-[a,button]:cursor-pointer in-[a:hover,button:hover]:text-gray data-[status=error]:text-error data-[status=error]:in-[a:hover,button:hover]:text-error data-[status=pending]:*:data-[slot=trace-icon]:opacity-60 data-[status=running]:*:data-[slot=trace-title]:shimmer motion-reduce:transition-none", className),
+		...props
+	});
+}
+function TraceIcon({ className, ...props }) {
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+		"data-slot": "trace-icon",
+		"aria-hidden": "true",
+		className: (0, cn.cn)("flex size-4 shrink-0 items-center justify-center [--spark-icon-size:--spacing(4)] [&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4 [[data-slot=trace-title]~&]:-ml-1", className),
+		...props
+	});
+}
+function TraceTitle({ className, ...props }) {
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+		"data-slot": "trace-title",
+		className: (0, cn.cn)("min-w-0 truncate", className),
+		...props
+	});
+}
+function TraceDescription({ className, ...props }) {
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+		"data-slot": "trace-description",
+		className: (0, cn.cn)("shrink-0 text-gray-light tabular-nums", className),
+		...props
+	});
+}
+function TraceCollapsible({ className, ...props }) {
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_base_ui_react_collapsible.Collapsible.Root, {
+		"data-slot": "trace-collapsible",
+		className: (0, cn.cn)("flex w-full min-w-0 flex-col", className),
+		...props
+	});
+}
+function TraceCollapsibleTrigger({ className, children, ...props }) {
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(_base_ui_react_collapsible.Collapsible.Trigger, {
+		"data-slot": "trace-collapsible-trigger",
+		className: (0, cn.cn)("group/trace-collapsible-trigger touch-target flex min-h-[1.5rem] w-fit max-w-full min-w-0 cursor-pointer items-center gap-1 rounded-md text-left text-gray-light transition-colors hover:text-gray focus-visible:ring-2 focus-visible:ring-offset-2 focus-visible:outline-hidden has-[[data-status=error]]:text-error motion-reduce:transition-none", className),
+		...props,
+		children: [children, /* @__PURE__ */ (0, react_jsx_runtime.jsx)(TraceIcon, {
+			className: "transition-transform group-data-[panel-open]/trace-collapsible-trigger:rotate-90 motion-reduce:transition-none",
+			children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_epilot_spark_icons.ChevronRight, {})
+		})]
+	});
+}
+function TraceCollapsibleContent({ className, children, ...props }) {
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_base_ui_react_collapsible.Collapsible.Panel, {
+		"data-slot": "trace-collapsible-content",
+		className: "h-(--collapsible-panel-height) min-w-0 overflow-hidden transition-[height] duration-200 data-ending-style:h-0 data-starting-style:h-0 motion-reduce:transition-none",
+		...props,
+		children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+			"data-slot": "trace-collapsible-content-inner",
+			className: (0, cn.cn)("ms-[calc(--spacing(2)-1px)] mt-2 mb-1 min-w-0 border-s border-gray-a6 ps-4 pe-1 text-sm leading-relaxed wrap-break-word text-gray-light", className),
+			children
+		})
+	});
+}
+//#endregion
+exports.Trace = Trace;
+exports.TraceCollapsible = TraceCollapsible;
+exports.TraceCollapsibleContent = TraceCollapsibleContent;
+exports.TraceCollapsibleTrigger = TraceCollapsibleTrigger;
+exports.TraceDescription = TraceDescription;
+exports.TraceIcon = TraceIcon;
+exports.TraceLine = TraceLine;
+exports.TraceTitle = TraceTitle;
+
+//# sourceMappingURL=trace.cjs.map

package/dist/components/trace.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"trace.cjs","names":["CollapsiblePrimitive","ChevronRight"],"sources":["../../src/components/trace.tsx"],"sourcesContent":["import { Collapsible as CollapsiblePrimitive } from '@base-ui/react/collapsible'\nimport { ChevronRight } from '@epilot/spark-icons'\nimport * as React from 'react'\nimport { cn } from '../utils/cn'\n\ntype TraceStatus = 'running' | 'error' | 'pending'\n\nfunction Trace({ className, ...props }: React.ComponentProps<'div'>) {\n  return (\n    <div\n      data-slot=\"trace\"\n      className={cn(\n        'flex w-full min-w-0 flex-col gap-2 *:has-[>[data-slot=trace-line]]:touch-target *:has-[>[data-slot=trace-line]]:flex *:has-[>[data-slot=trace-line]]:min-h-[1.5rem] *:has-[>[data-slot=trace-line]]:w-fit *:has-[>[data-slot=trace-line]]:max-w-full *:has-[>[data-slot=trace-line]]:min-w-0 *:has-[>[data-slot=trace-line]]:items-center *:has-[>[data-slot=trace-line]]:rounded-md *:has-[>[data-slot=trace-line]]:text-left *:has-[>[data-slot=trace-line]]:focus-visible:ring-2 *:has-[>[data-slot=trace-line]]:focus-visible:ring-offset-2 *:has-[>[data-slot=trace-line]]:focus-visible:outline-hidden',\n        className,\n      )}\n      {...props}\n    />\n  )\n}\n\nfunction TraceLine({\n  className,\n  status,\n  ...props\n}: React.ComponentProps<'span'> & { status?: TraceStatus }) {\n  return (\n    <span\n      data-slot=\"trace-line\"\n      data-status={status}\n      className={cn(\n        'flex w-fit max-w-full min-w-0 items-center gap-2 text-sm text-gray-light transition-colors in-[a,button]:cursor-pointer in-[a:hover,button:hover]:text-gray data-[status=error]:text-error data-[status=error]:in-[a:hover,button:hover]:text-error data-[status=pending]:*:data-[slot=trace-icon]:opacity-60 data-[status=running]:*:data-[slot=trace-title]:shimmer motion-reduce:transition-none',\n        className,\n      )}\n      {...props}\n    />\n  )\n}\n\nfunction TraceIcon({ className, ...props }: React.ComponentProps<'span'>) {\n  return (\n    <span\n      data-slot=\"trace-icon\"\n      aria-hidden=\"true\"\n      className={cn(\n        \"flex size-4 shrink-0 items-center justify-center [--spark-icon-size:--spacing(4)] [&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4 [[data-slot=trace-title]~&]:-ml-1\",\n        className,\n      )}\n      {...props}\n    />\n  )\n}\n\nfunction TraceTitle({ className, ...props }: React.ComponentProps<'span'>) {\n  return (\n    <span\n      data-slot=\"trace-title\"\n      className={cn('min-w-0 truncate', className)}\n      {...props}\n    />\n  )\n}\n\nfunction TraceDescription({\n  className,\n  ...props\n}: React.ComponentProps<'span'>) {\n  return (\n    <span\n      data-slot=\"trace-description\"\n      className={cn('shrink-0 text-gray-light tabular-nums', className)}\n      {...props}\n    />\n  )\n}\n\ntype CollapsibleRootProps = React.ComponentProps<\n  typeof CollapsiblePrimitive.Root\n>\n\nfunction TraceCollapsible({\n  className,\n  ...props\n}: Omit<CollapsibleRootProps, 'open'> &\n  (\n    | { open?: undefined }\n    | {\n        open: boolean\n        onOpenChange: NonNullable<CollapsibleRootProps['onOpenChange']>\n      }\n  )) {\n  return (\n    <CollapsiblePrimitive.Root\n      data-slot=\"trace-collapsible\"\n      className={cn('flex w-full min-w-0 flex-col', className)}\n      {...props}\n    />\n  )\n}\n\nfunction TraceCollapsibleTrigger({\n  className,\n  children,\n  ...props\n}: React.ComponentProps<typeof CollapsiblePrimitive.Trigger>) {\n  return (\n    <CollapsiblePrimitive.Trigger\n      data-slot=\"trace-collapsible-trigger\"\n      className={cn(\n        'group/trace-collapsible-trigger touch-target flex min-h-[1.5rem] w-fit max-w-full min-w-0 cursor-pointer items-center gap-1 rounded-md text-left text-gray-light transition-colors hover:text-gray focus-visible:ring-2 focus-visible:ring-offset-2 focus-visible:outline-hidden has-[[data-status=error]]:text-error motion-reduce:transition-none',\n        className,\n      )}\n      {...props}\n    >\n      {children}\n      <TraceIcon className=\"transition-transform group-data-[panel-open]/trace-collapsible-trigger:rotate-90 motion-reduce:transition-none\">\n        <ChevronRight />\n      </TraceIcon>\n    </CollapsiblePrimitive.Trigger>\n  )\n}\n\nfunction TraceCollapsibleContent({\n  className,\n  children,\n  ...props\n}: React.ComponentProps<typeof CollapsiblePrimitive.Panel>) {\n  return (\n    <CollapsiblePrimitive.Panel\n      data-slot=\"trace-collapsible-content\"\n      className=\"h-(--collapsible-panel-height) min-w-0 overflow-hidden transition-[height] duration-200 data-ending-style:h-0 data-starting-style:h-0 motion-reduce:transition-none\"\n      {...props}\n    >\n      <div\n        data-slot=\"trace-collapsible-content-inner\"\n        className={cn(\n          'ms-[calc(--spacing(2)-1px)] mt-2 mb-1 min-w-0 border-s border-gray-a6 ps-4 pe-1 text-sm leading-relaxed wrap-break-word text-gray-light',\n          className,\n        )}\n      >\n        {children}\n      </div>\n    </CollapsiblePrimitive.Panel>\n  )\n}\n\nexport {\n  Trace,\n  TraceCollapsible,\n  TraceCollapsibleContent,\n  TraceCollapsibleTrigger,\n  TraceDescription,\n  TraceIcon,\n  TraceLine,\n  TraceTitle,\n  type TraceStatus,\n}\n"],"mappings":";;;;;;;;;;AAOA,SAAS,MAAM,EAAE,WAAW,GAAG,SAAsC;CACnE,OACE,iBAAA,GAAA,kBAAA,KAAC,OAAD;EACE,aAAU;EACV,YAAA,GAAA,GAAA,IACE,glBACA,SACF;EACA,GAAI;CACL,CAAA;AAEL;AAEA,SAAS,UAAU,EACjB,WACA,QACA,GAAG,SACuD;CAC1D,OACE,iBAAA,GAAA,kBAAA,KAAC,QAAD;EACE,aAAU;EACV,eAAa;EACb,YAAA,GAAA,GAAA,IACE,uYACA,SACF;EACA,GAAI;CACL,CAAA;AAEL;AAEA,SAAS,UAAU,EAAE,WAAW,GAAG,SAAuC;CACxE,OACE,iBAAA,GAAA,kBAAA,KAAC,QAAD;EACE,aAAU;EACV,eAAY;EACZ,YAAA,GAAA,GAAA,IACE,wLACA,SACF;EACA,GAAI;CACL,CAAA;AAEL;AAEA,SAAS,WAAW,EAAE,WAAW,GAAG,SAAuC;CACzE,OACE,iBAAA,GAAA,kBAAA,KAAC,QAAD;EACE,aAAU;EACV,YAAA,GAAA,GAAA,IAAc,oBAAoB,SAAS;EAC3C,GAAI;CACL,CAAA;AAEL;AAEA,SAAS,iBAAiB,EACxB,WACA,GAAG,SAC4B;CAC/B,OACE,iBAAA,GAAA,kBAAA,KAAC,QAAD;EACE,aAAU;EACV,YAAA,GAAA,GAAA,IAAc,yCAAyC,SAAS;EAChE,GAAI;CACL,CAAA;AAEL;AAMA,SAAS,iBAAiB,EACxB,WACA,GAAG,SAQA;CACH,OACE,iBAAA,GAAA,kBAAA,KAACA,2BAAAA,YAAqB,MAAtB;EACE,aAAU;EACV,YAAA,GAAA,GAAA,IAAc,gCAAgC,SAAS;EACvD,GAAI;CACL,CAAA;AAEL;AAEA,SAAS,wBAAwB,EAC/B,WACA,UACA,GAAG,SACyD;CAC5D,OACE,iBAAA,GAAA,kBAAA,MAACA,2BAAAA,YAAqB,SAAtB;EACE,aAAU;EACV,YAAA,GAAA,GAAA,IACE,uVACA,SACF;EACA,GAAI;YANN,CAQG,UACD,iBAAA,GAAA,kBAAA,KAAC,WAAD;GAAW,WAAU;aACnB,iBAAA,GAAA,kBAAA,KAACC,oBAAAA,cAAD,CAAe,CAAA;EACN,CAAA,CACiB;;AAElC;AAEA,SAAS,wBAAwB,EAC/B,WACA,UACA,GAAG,SACuD;CAC1D,OACE,iBAAA,GAAA,kBAAA,KAACD,2BAAAA,YAAqB,OAAtB;EACE,aAAU;EACV,WAAU;EACV,GAAI;YAEJ,iBAAA,GAAA,kBAAA,KAAC,OAAD;GACE,aAAU;GACV,YAAA,GAAA,GAAA,IACE,2IACA,SACF;GAEC;EACE,CAAA;CACqB,CAAA;AAEhC"}

package/dist/components/trace.d.cts

@@ -0,0 +1,53 @@
+"use client";
+
+import * as React$1 from "react";
+import { Collapsible } from "@base-ui/react/collapsible";
+
+//#region src/components/trace.d.ts
+type TraceStatus = 'running' | 'error' | 'pending';
+declare function Trace({
+  className,
+  ...props
+}: React$1.ComponentProps<'div'>): import("react/jsx-runtime").JSX.Element;
+declare function TraceLine({
+  className,
+  status,
+  ...props
+}: React$1.ComponentProps<'span'> & {
+  status?: TraceStatus;
+}): import("react/jsx-runtime").JSX.Element;
+declare function TraceIcon({
+  className,
+  ...props
+}: React$1.ComponentProps<'span'>): import("react/jsx-runtime").JSX.Element;
+declare function TraceTitle({
+  className,
+  ...props
+}: React$1.ComponentProps<'span'>): import("react/jsx-runtime").JSX.Element;
+declare function TraceDescription({
+  className,
+  ...props
+}: React$1.ComponentProps<'span'>): import("react/jsx-runtime").JSX.Element;
+type CollapsibleRootProps = React$1.ComponentProps<typeof Collapsible.Root>;
+declare function TraceCollapsible({
+  className,
+  ...props
+}: Omit<CollapsibleRootProps, 'open'> & ({
+  open?: undefined;
+} | {
+  open: boolean;
+  onOpenChange: NonNullable<CollapsibleRootProps['onOpenChange']>;
+})): import("react/jsx-runtime").JSX.Element;
+declare function TraceCollapsibleTrigger({
+  className,
+  children,
+  ...props
+}: React$1.ComponentProps<typeof Collapsible.Trigger>): import("react/jsx-runtime").JSX.Element;
+declare function TraceCollapsibleContent({
+  className,
+  children,
+  ...props
+}: React$1.ComponentProps<typeof Collapsible.Panel>): import("react/jsx-runtime").JSX.Element;
+//#endregion
+export { Trace, TraceCollapsible, TraceCollapsibleContent, TraceCollapsibleTrigger, TraceDescription, TraceIcon, TraceLine, type TraceStatus, TraceTitle };
+//# sourceMappingURL=trace.d.cts.map

package/dist/components/trace.d.ts

@@ -0,0 +1,53 @@
+"use client";
+
+import * as React$1 from "react";
+import { Collapsible } from "@base-ui/react/collapsible";
+
+//#region src/components/trace.d.ts
+type TraceStatus = 'running' | 'error' | 'pending';
+declare function Trace({
+  className,
+  ...props
+}: React$1.ComponentProps<'div'>): import("react/jsx-runtime").JSX.Element;
+declare function TraceLine({
+  className,
+  status,
+  ...props
+}: React$1.ComponentProps<'span'> & {
+  status?: TraceStatus;
+}): import("react/jsx-runtime").JSX.Element;
+declare function TraceIcon({
+  className,
+  ...props
+}: React$1.ComponentProps<'span'>): import("react/jsx-runtime").JSX.Element;
+declare function TraceTitle({
+  className,
+  ...props
+}: React$1.ComponentProps<'span'>): import("react/jsx-runtime").JSX.Element;
+declare function TraceDescription({
+  className,
+  ...props
+}: React$1.ComponentProps<'span'>): import("react/jsx-runtime").JSX.Element;
+type CollapsibleRootProps = React$1.ComponentProps<typeof Collapsible.Root>;
+declare function TraceCollapsible({
+  className,
+  ...props
+}: Omit<CollapsibleRootProps, 'open'> & ({
+  open?: undefined;
+} | {
+  open: boolean;
+  onOpenChange: NonNullable<CollapsibleRootProps['onOpenChange']>;
+})): import("react/jsx-runtime").JSX.Element;
+declare function TraceCollapsibleTrigger({
+  className,
+  children,
+  ...props
+}: React$1.ComponentProps<typeof Collapsible.Trigger>): import("react/jsx-runtime").JSX.Element;
+declare function TraceCollapsibleContent({
+  className,
+  children,
+  ...props
+}: React$1.ComponentProps<typeof Collapsible.Panel>): import("react/jsx-runtime").JSX.Element;
+//#endregion
+export { Trace, TraceCollapsible, TraceCollapsibleContent, TraceCollapsibleTrigger, TraceDescription, TraceIcon, TraceLine, type TraceStatus, TraceTitle };
+//# sourceMappingURL=trace.d.ts.map

package/dist/components/trace.js

@@ -0,0 +1,78 @@
+"use client";
+import { cn } from "../utils/cn.js";
+import { ChevronRight } from "@epilot/spark-icons";
+import "react";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { Collapsible } from "@base-ui/react/collapsible";
+//#region src/components/trace.tsx
+function Trace({ className, ...props }) {
+	return /* @__PURE__ */ jsx("div", {
+		"data-slot": "trace",
+		className: cn("flex w-full min-w-0 flex-col gap-2 *:has-[>[data-slot=trace-line]]:touch-target *:has-[>[data-slot=trace-line]]:flex *:has-[>[data-slot=trace-line]]:min-h-[1.5rem] *:has-[>[data-slot=trace-line]]:w-fit *:has-[>[data-slot=trace-line]]:max-w-full *:has-[>[data-slot=trace-line]]:min-w-0 *:has-[>[data-slot=trace-line]]:items-center *:has-[>[data-slot=trace-line]]:rounded-md *:has-[>[data-slot=trace-line]]:text-left *:has-[>[data-slot=trace-line]]:focus-visible:ring-2 *:has-[>[data-slot=trace-line]]:focus-visible:ring-offset-2 *:has-[>[data-slot=trace-line]]:focus-visible:outline-hidden", className),
+		...props
+	});
+}
+function TraceLine({ className, status, ...props }) {
+	return /* @__PURE__ */ jsx("span", {
+		"data-slot": "trace-line",
+		"data-status": status,
+		className: cn("flex w-fit max-w-full min-w-0 items-center gap-2 text-sm text-gray-light transition-colors in-[a,button]:cursor-pointer in-[a:hover,button:hover]:text-gray data-[status=error]:text-error data-[status=error]:in-[a:hover,button:hover]:text-error data-[status=pending]:*:data-[slot=trace-icon]:opacity-60 data-[status=running]:*:data-[slot=trace-title]:shimmer motion-reduce:transition-none", className),
+		...props
+	});
+}
+function TraceIcon({ className, ...props }) {
+	return /* @__PURE__ */ jsx("span", {
+		"data-slot": "trace-icon",
+		"aria-hidden": "true",
+		className: cn("flex size-4 shrink-0 items-center justify-center [--spark-icon-size:--spacing(4)] [&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4 [[data-slot=trace-title]~&]:-ml-1", className),
+		...props
+	});
+}
+function TraceTitle({ className, ...props }) {
+	return /* @__PURE__ */ jsx("span", {
+		"data-slot": "trace-title",
+		className: cn("min-w-0 truncate", className),
+		...props
+	});
+}
+function TraceDescription({ className, ...props }) {
+	return /* @__PURE__ */ jsx("span", {
+		"data-slot": "trace-description",
+		className: cn("shrink-0 text-gray-light tabular-nums", className),
+		...props
+	});
+}
+function TraceCollapsible({ className, ...props }) {
+	return /* @__PURE__ */ jsx(Collapsible.Root, {
+		"data-slot": "trace-collapsible",
+		className: cn("flex w-full min-w-0 flex-col", className),
+		...props
+	});
+}
+function TraceCollapsibleTrigger({ className, children, ...props }) {
+	return /* @__PURE__ */ jsxs(Collapsible.Trigger, {
+		"data-slot": "trace-collapsible-trigger",
+		className: cn("group/trace-collapsible-trigger touch-target flex min-h-[1.5rem] w-fit max-w-full min-w-0 cursor-pointer items-center gap-1 rounded-md text-left text-gray-light transition-colors hover:text-gray focus-visible:ring-2 focus-visible:ring-offset-2 focus-visible:outline-hidden has-[[data-status=error]]:text-error motion-reduce:transition-none", className),
+		...props,
+		children: [children, /* @__PURE__ */ jsx(TraceIcon, {
+			className: "transition-transform group-data-[panel-open]/trace-collapsible-trigger:rotate-90 motion-reduce:transition-none",
+			children: /* @__PURE__ */ jsx(ChevronRight, {})
+		})]
+	});
+}
+function TraceCollapsibleContent({ className, children, ...props }) {
+	return /* @__PURE__ */ jsx(Collapsible.Panel, {
+		"data-slot": "trace-collapsible-content",
+		className: "h-(--collapsible-panel-height) min-w-0 overflow-hidden transition-[height] duration-200 data-ending-style:h-0 data-starting-style:h-0 motion-reduce:transition-none",
+		...props,
+		children: /* @__PURE__ */ jsx("div", {
+			"data-slot": "trace-collapsible-content-inner",
+			className: cn("ms-[calc(--spacing(2)-1px)] mt-2 mb-1 min-w-0 border-s border-gray-a6 ps-4 pe-1 text-sm leading-relaxed wrap-break-word text-gray-light", className),
+			children
+		})
+	});
+}
+//#endregion
+export { Trace, TraceCollapsible, TraceCollapsibleContent, TraceCollapsibleTrigger, TraceDescription, TraceIcon, TraceLine, TraceTitle };
+
+//# sourceMappingURL=trace.js.map

package/dist/components/trace.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"trace.js","names":["CollapsiblePrimitive"],"sources":["../../src/components/trace.tsx"],"sourcesContent":["import { Collapsible as CollapsiblePrimitive } from '@base-ui/react/collapsible'\nimport { ChevronRight } from '@epilot/spark-icons'\nimport * as React from 'react'\nimport { cn } from '../utils/cn'\n\ntype TraceStatus = 'running' | 'error' | 'pending'\n\nfunction Trace({ className, ...props }: React.ComponentProps<'div'>) {\n  return (\n    <div\n      data-slot=\"trace\"\n      className={cn(\n        'flex w-full min-w-0 flex-col gap-2 *:has-[>[data-slot=trace-line]]:touch-target *:has-[>[data-slot=trace-line]]:flex *:has-[>[data-slot=trace-line]]:min-h-[1.5rem] *:has-[>[data-slot=trace-line]]:w-fit *:has-[>[data-slot=trace-line]]:max-w-full *:has-[>[data-slot=trace-line]]:min-w-0 *:has-[>[data-slot=trace-line]]:items-center *:has-[>[data-slot=trace-line]]:rounded-md *:has-[>[data-slot=trace-line]]:text-left *:has-[>[data-slot=trace-line]]:focus-visible:ring-2 *:has-[>[data-slot=trace-line]]:focus-visible:ring-offset-2 *:has-[>[data-slot=trace-line]]:focus-visible:outline-hidden',\n        className,\n      )}\n      {...props}\n    />\n  )\n}\n\nfunction TraceLine({\n  className,\n  status,\n  ...props\n}: React.ComponentProps<'span'> & { status?: TraceStatus }) {\n  return (\n    <span\n      data-slot=\"trace-line\"\n      data-status={status}\n      className={cn(\n        'flex w-fit max-w-full min-w-0 items-center gap-2 text-sm text-gray-light transition-colors in-[a,button]:cursor-pointer in-[a:hover,button:hover]:text-gray data-[status=error]:text-error data-[status=error]:in-[a:hover,button:hover]:text-error data-[status=pending]:*:data-[slot=trace-icon]:opacity-60 data-[status=running]:*:data-[slot=trace-title]:shimmer motion-reduce:transition-none',\n        className,\n      )}\n      {...props}\n    />\n  )\n}\n\nfunction TraceIcon({ className, ...props }: React.ComponentProps<'span'>) {\n  return (\n    <span\n      data-slot=\"trace-icon\"\n      aria-hidden=\"true\"\n      className={cn(\n        \"flex size-4 shrink-0 items-center justify-center [--spark-icon-size:--spacing(4)] [&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4 [[data-slot=trace-title]~&]:-ml-1\",\n        className,\n      )}\n      {...props}\n    />\n  )\n}\n\nfunction TraceTitle({ className, ...props }: React.ComponentProps<'span'>) {\n  return (\n    <span\n      data-slot=\"trace-title\"\n      className={cn('min-w-0 truncate', className)}\n      {...props}\n    />\n  )\n}\n\nfunction TraceDescription({\n  className,\n  ...props\n}: React.ComponentProps<'span'>) {\n  return (\n    <span\n      data-slot=\"trace-description\"\n      className={cn('shrink-0 text-gray-light tabular-nums', className)}\n      {...props}\n    />\n  )\n}\n\ntype CollapsibleRootProps = React.ComponentProps<\n  typeof CollapsiblePrimitive.Root\n>\n\nfunction TraceCollapsible({\n  className,\n  ...props\n}: Omit<CollapsibleRootProps, 'open'> &\n  (\n    | { open?: undefined }\n    | {\n        open: boolean\n        onOpenChange: NonNullable<CollapsibleRootProps['onOpenChange']>\n      }\n  )) {\n  return (\n    <CollapsiblePrimitive.Root\n      data-slot=\"trace-collapsible\"\n      className={cn('flex w-full min-w-0 flex-col', className)}\n      {...props}\n    />\n  )\n}\n\nfunction TraceCollapsibleTrigger({\n  className,\n  children,\n  ...props\n}: React.ComponentProps<typeof CollapsiblePrimitive.Trigger>) {\n  return (\n    <CollapsiblePrimitive.Trigger\n      data-slot=\"trace-collapsible-trigger\"\n      className={cn(\n        'group/trace-collapsible-trigger touch-target flex min-h-[1.5rem] w-fit max-w-full min-w-0 cursor-pointer items-center gap-1 rounded-md text-left text-gray-light transition-colors hover:text-gray focus-visible:ring-2 focus-visible:ring-offset-2 focus-visible:outline-hidden has-[[data-status=error]]:text-error motion-reduce:transition-none',\n        className,\n      )}\n      {...props}\n    >\n      {children}\n      <TraceIcon className=\"transition-transform group-data-[panel-open]/trace-collapsible-trigger:rotate-90 motion-reduce:transition-none\">\n        <ChevronRight />\n      </TraceIcon>\n    </CollapsiblePrimitive.Trigger>\n  )\n}\n\nfunction TraceCollapsibleContent({\n  className,\n  children,\n  ...props\n}: React.ComponentProps<typeof CollapsiblePrimitive.Panel>) {\n  return (\n    <CollapsiblePrimitive.Panel\n      data-slot=\"trace-collapsible-content\"\n      className=\"h-(--collapsible-panel-height) min-w-0 overflow-hidden transition-[height] duration-200 data-ending-style:h-0 data-starting-style:h-0 motion-reduce:transition-none\"\n      {...props}\n    >\n      <div\n        data-slot=\"trace-collapsible-content-inner\"\n        className={cn(\n          'ms-[calc(--spacing(2)-1px)] mt-2 mb-1 min-w-0 border-s border-gray-a6 ps-4 pe-1 text-sm leading-relaxed wrap-break-word text-gray-light',\n          className,\n        )}\n      >\n        {children}\n      </div>\n    </CollapsiblePrimitive.Panel>\n  )\n}\n\nexport {\n  Trace,\n  TraceCollapsible,\n  TraceCollapsibleContent,\n  TraceCollapsibleTrigger,\n  TraceDescription,\n  TraceIcon,\n  TraceLine,\n  TraceTitle,\n  type TraceStatus,\n}\n"],"mappings":";;;;;;;AAOA,SAAS,MAAM,EAAE,WAAW,GAAG,SAAsC;CACnE,OACE,oBAAC,OAAD;EACE,aAAU;EACV,WAAW,GACT,glBACA,SACF;EACA,GAAI;CACL,CAAA;AAEL;AAEA,SAAS,UAAU,EACjB,WACA,QACA,GAAG,SACuD;CAC1D,OACE,oBAAC,QAAD;EACE,aAAU;EACV,eAAa;EACb,WAAW,GACT,uYACA,SACF;EACA,GAAI;CACL,CAAA;AAEL;AAEA,SAAS,UAAU,EAAE,WAAW,GAAG,SAAuC;CACxE,OACE,oBAAC,QAAD;EACE,aAAU;EACV,eAAY;EACZ,WAAW,GACT,wLACA,SACF;EACA,GAAI;CACL,CAAA;AAEL;AAEA,SAAS,WAAW,EAAE,WAAW,GAAG,SAAuC;CACzE,OACE,oBAAC,QAAD;EACE,aAAU;EACV,WAAW,GAAG,oBAAoB,SAAS;EAC3C,GAAI;CACL,CAAA;AAEL;AAEA,SAAS,iBAAiB,EACxB,WACA,GAAG,SAC4B;CAC/B,OACE,oBAAC,QAAD;EACE,aAAU;EACV,WAAW,GAAG,yCAAyC,SAAS;EAChE,GAAI;CACL,CAAA;AAEL;AAMA,SAAS,iBAAiB,EACxB,WACA,GAAG,SAQA;CACH,OACE,oBAACA,YAAqB,MAAtB;EACE,aAAU;EACV,WAAW,GAAG,gCAAgC,SAAS;EACvD,GAAI;CACL,CAAA;AAEL;AAEA,SAAS,wBAAwB,EAC/B,WACA,UACA,GAAG,SACyD;CAC5D,OACE,qBAACA,YAAqB,SAAtB;EACE,aAAU;EACV,WAAW,GACT,uVACA,SACF;EACA,GAAI;YANN,CAQG,UACD,oBAAC,WAAD;GAAW,WAAU;aACnB,oBAAC,cAAD,CAAe,CAAA;EACN,CAAA,CACiB;;AAElC;AAEA,SAAS,wBAAwB,EAC/B,WACA,UACA,GAAG,SACuD;CAC1D,OACE,oBAACA,YAAqB,OAAtB;EACE,aAAU;EACV,WAAU;EACV,GAAI;YAEJ,oBAAC,OAAD;GACE,aAAU;GACV,WAAW,GACT,2IACA,SACF;GAEC;EACE,CAAA;CACqB,CAAA;AAEhC"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@epilot/spark-ui",
-  "version": "0.23.1",
+  "version": "0.24.0",
   "description": "React UI component library from Spark SDK",
   "homepage": "https://spark-ui.epilot.io/docs/ui",
   "license": "Apache-2.0",