@epilot/spark-ui 0.20.1 → 0.20.2

package/dist/components/message.cjs

@@ -4,12 +4,12 @@ const require_chunk = require("../chunk-DY84GLCh.cjs");
 let react = require("react");
 react = require_chunk.__toESM(react);
 let react_jsx_runtime = require("react/jsx-runtime");
-let cnfast = require("cnfast");
+let cn = require("cn");
 //#region src/components/message.tsx
 function MessageGroup({ className, ...props }) {
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
 		"data-slot": "message-group",
-		className: (0, cnfast.cn)("flex min-w-0 flex-col gap-2", className),
+		className: (0, cn.cn)("flex min-w-0 flex-col gap-2", className),
 		...props
 	});
 }
@@ -17,35 +17,35 @@ function Message({ className, align = "start", ...props }) {
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
 		"data-slot": "message",
 		"data-align": align,
-		className: (0, cnfast.cn)("group/message relative flex w-full min-w-0 gap-2 text-sm data-[align=end]:flex-row-reverse", className),
+		className: (0, cn.cn)("group/message relative flex w-full min-w-0 gap-2 text-sm data-[align=end]:flex-row-reverse", className),
 		...props
 	});
 }
 function MessageAvatar({ className, ...props }) {
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
 		"data-slot": "message-avatar",
-		className: (0, cnfast.cn)("flex w-fit min-w-8 shrink-0 items-center justify-center self-end overflow-hidden rounded-full bg-gray-a3 group-has-data-[slot=message-footer]/message:-translate-y-8", className),
+		className: (0, cn.cn)("flex w-fit min-w-8 shrink-0 items-center justify-center self-end overflow-hidden rounded-full bg-gray-a3 group-has-data-[slot=message-footer]/message:-translate-y-8", className),
 		...props
 	});
 }
 function MessageContent({ className, ...props }) {
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
 		"data-slot": "message-content",
-		className: (0, cnfast.cn)("flex w-full min-w-0 flex-col gap-2.5 wrap-break-word group-data-[align=end]/message:*:data-slot:self-end", className),
+		className: (0, cn.cn)("flex w-full min-w-0 flex-col gap-2.5 wrap-break-word group-data-[align=end]/message:*:data-slot:self-end", className),
 		...props
 	});
 }
 function MessageHeader({ className, ...props }) {
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
 		"data-slot": "message-header",
-		className: (0, cnfast.cn)("flex max-w-full min-w-0 items-center px-3 text-xs font-medium text-gray-light group-has-data-[variant=ghost]/message:px-0", className),
+		className: (0, cn.cn)("flex max-w-full min-w-0 items-center px-3 text-xs font-medium text-gray-light group-has-data-[variant=ghost]/message:px-0", className),
 		...props
 	});
 }
 function MessageFooter({ className, ...props }) {
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
 		"data-slot": "message-footer",
-		className: (0, cnfast.cn)("flex max-w-full min-w-0 items-center px-3 text-xs font-medium text-gray-light group-has-data-[variant=ghost]/message:px-0 group-data-[align=end]/message:justify-end", className),
+		className: (0, cn.cn)("flex max-w-full min-w-0 items-center px-3 text-xs font-medium text-gray-light group-has-data-[variant=ghost]/message:px-0 group-data-[align=end]/message:justify-end", className),
 		...props
 	});
 }

package/dist/components/message.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"message.cjs","names":[],"sources":["../../src/components/message.tsx"],"sourcesContent":["import * as React from 'react'\nimport { cn } from '../utils/cn'\n\nfunction MessageGroup({ className, ...props }: React.ComponentProps<'div'>) {\n  return (\n    <div\n      data-slot=\"message-group\"\n      className={cn('flex min-w-0 flex-col gap-2', className)}\n      {...props}\n    />\n  )\n}\n\nfunction Message({\n  className,\n  align = 'start',\n  ...props\n}: React.ComponentProps<'div'> & { align?: 'start' | 'end' }) {\n  return (\n    <div\n      data-slot=\"message\"\n      data-align={align}\n      className={cn(\n        'group/message relative flex w-full min-w-0 gap-2 text-sm data-[align=end]:flex-row-reverse',\n        className,\n      )}\n      {...props}\n    />\n  )\n}\n\nfunction MessageAvatar({ className, ...props }: React.ComponentProps<'div'>) {\n  return (\n    <div\n      data-slot=\"message-avatar\"\n      className={cn(\n        'flex w-fit min-w-8 shrink-0 items-center justify-center self-end overflow-hidden rounded-full bg-gray-a3 group-has-data-[slot=message-footer]/message:-translate-y-8',\n        className,\n      )}\n      {...props}\n    />\n  )\n}\n\nfunction MessageContent({ className, ...props }: React.ComponentProps<'div'>) {\n  return (\n    <div\n      data-slot=\"message-content\"\n      className={cn(\n        'flex w-full min-w-0 flex-col gap-2.5 wrap-break-word group-data-[align=end]/message:*:data-slot:self-end',\n        className,\n      )}\n      {...props}\n    />\n  )\n}\n\nfunction MessageHeader({ className, ...props }: React.ComponentProps<'div'>) {\n  return (\n    <div\n      data-slot=\"message-header\"\n      className={cn(\n        'flex max-w-full min-w-0 items-center px-3 text-xs font-medium text-gray-light group-has-data-[variant=ghost]/message:px-0',\n        className,\n      )}\n      {...props}\n    />\n  )\n}\n\nfunction MessageFooter({ className, ...props }: React.ComponentProps<'div'>) {\n  return (\n    <div\n      data-slot=\"message-footer\"\n      className={cn(\n        'flex max-w-full min-w-0 items-center px-3 text-xs font-medium text-gray-light group-has-data-[variant=ghost]/message:px-0 group-data-[align=end]/message:justify-end',\n        className,\n      )}\n      {...props}\n    />\n  )\n}\n\nexport {\n  Message,\n  MessageAvatar,\n  MessageContent,\n  MessageFooter,\n  MessageGroup,\n  MessageHeader,\n}\n"],"mappings":";;;;;;;;AAGA,SAAS,aAAa,EAAE,WAAW,GAAG,SAAsC;CAC1E,OACE,iBAAA,GAAA,kBAAA,KAAC,OAAD;EACE,aAAU;EACV,YAAA,GAAA,OAAA,IAAc,+BAA+B,SAAS;EACtD,GAAI;CACL,CAAA;AAEL;AAEA,SAAS,QAAQ,EACf,WACA,QAAQ,SACR,GAAG,SACyD;CAC5D,OACE,iBAAA,GAAA,kBAAA,KAAC,OAAD;EACE,aAAU;EACV,cAAY;EACZ,YAAA,GAAA,OAAA,IACE,8FACA,SACF;EACA,GAAI;CACL,CAAA;AAEL;AAEA,SAAS,cAAc,EAAE,WAAW,GAAG,SAAsC;CAC3E,OACE,iBAAA,GAAA,kBAAA,KAAC,OAAD;EACE,aAAU;EACV,YAAA,GAAA,OAAA,IACE,wKACA,SACF;EACA,GAAI;CACL,CAAA;AAEL;AAEA,SAAS,eAAe,EAAE,WAAW,GAAG,SAAsC;CAC5E,OACE,iBAAA,GAAA,kBAAA,KAAC,OAAD;EACE,aAAU;EACV,YAAA,GAAA,OAAA,IACE,4GACA,SACF;EACA,GAAI;CACL,CAAA;AAEL;AAEA,SAAS,cAAc,EAAE,WAAW,GAAG,SAAsC;CAC3E,OACE,iBAAA,GAAA,kBAAA,KAAC,OAAD;EACE,aAAU;EACV,YAAA,GAAA,OAAA,IACE,6HACA,SACF;EACA,GAAI;CACL,CAAA;AAEL;AAEA,SAAS,cAAc,EAAE,WAAW,GAAG,SAAsC;CAC3E,OACE,iBAAA,GAAA,kBAAA,KAAC,OAAD;EACE,aAAU;EACV,YAAA,GAAA,OAAA,IACE,wKACA,SACF;EACA,GAAI;CACL,CAAA;AAEL"}
+{"version":3,"file":"message.cjs","names":[],"sources":["../../src/components/message.tsx"],"sourcesContent":["import * as React from 'react'\nimport { cn } from '../utils/cn'\n\nfunction MessageGroup({ className, ...props }: React.ComponentProps<'div'>) {\n  return (\n    <div\n      data-slot=\"message-group\"\n      className={cn('flex min-w-0 flex-col gap-2', className)}\n      {...props}\n    />\n  )\n}\n\nfunction Message({\n  className,\n  align = 'start',\n  ...props\n}: React.ComponentProps<'div'> & { align?: 'start' | 'end' }) {\n  return (\n    <div\n      data-slot=\"message\"\n      data-align={align}\n      className={cn(\n        'group/message relative flex w-full min-w-0 gap-2 text-sm data-[align=end]:flex-row-reverse',\n        className,\n      )}\n      {...props}\n    />\n  )\n}\n\nfunction MessageAvatar({ className, ...props }: React.ComponentProps<'div'>) {\n  return (\n    <div\n      data-slot=\"message-avatar\"\n      className={cn(\n        'flex w-fit min-w-8 shrink-0 items-center justify-center self-end overflow-hidden rounded-full bg-gray-a3 group-has-data-[slot=message-footer]/message:-translate-y-8',\n        className,\n      )}\n      {...props}\n    />\n  )\n}\n\nfunction MessageContent({ className, ...props }: React.ComponentProps<'div'>) {\n  return (\n    <div\n      data-slot=\"message-content\"\n      className={cn(\n        'flex w-full min-w-0 flex-col gap-2.5 wrap-break-word group-data-[align=end]/message:*:data-slot:self-end',\n        className,\n      )}\n      {...props}\n    />\n  )\n}\n\nfunction MessageHeader({ className, ...props }: React.ComponentProps<'div'>) {\n  return (\n    <div\n      data-slot=\"message-header\"\n      className={cn(\n        'flex max-w-full min-w-0 items-center px-3 text-xs font-medium text-gray-light group-has-data-[variant=ghost]/message:px-0',\n        className,\n      )}\n      {...props}\n    />\n  )\n}\n\nfunction MessageFooter({ className, ...props }: React.ComponentProps<'div'>) {\n  return (\n    <div\n      data-slot=\"message-footer\"\n      className={cn(\n        'flex max-w-full min-w-0 items-center px-3 text-xs font-medium text-gray-light group-has-data-[variant=ghost]/message:px-0 group-data-[align=end]/message:justify-end',\n        className,\n      )}\n      {...props}\n    />\n  )\n}\n\nexport {\n  Message,\n  MessageAvatar,\n  MessageContent,\n  MessageFooter,\n  MessageGroup,\n  MessageHeader,\n}\n"],"mappings":";;;;;;;;AAGA,SAAS,aAAa,EAAE,WAAW,GAAG,SAAsC;CAC1E,OACE,iBAAA,GAAA,kBAAA,KAAC,OAAD;EACE,aAAU;EACV,YAAA,GAAA,GAAA,IAAc,+BAA+B,SAAS;EACtD,GAAI;CACL,CAAA;AAEL;AAEA,SAAS,QAAQ,EACf,WACA,QAAQ,SACR,GAAG,SACyD;CAC5D,OACE,iBAAA,GAAA,kBAAA,KAAC,OAAD;EACE,aAAU;EACV,cAAY;EACZ,YAAA,GAAA,GAAA,IACE,8FACA,SACF;EACA,GAAI;CACL,CAAA;AAEL;AAEA,SAAS,cAAc,EAAE,WAAW,GAAG,SAAsC;CAC3E,OACE,iBAAA,GAAA,kBAAA,KAAC,OAAD;EACE,aAAU;EACV,YAAA,GAAA,GAAA,IACE,wKACA,SACF;EACA,GAAI;CACL,CAAA;AAEL;AAEA,SAAS,eAAe,EAAE,WAAW,GAAG,SAAsC;CAC5E,OACE,iBAAA,GAAA,kBAAA,KAAC,OAAD;EACE,aAAU;EACV,YAAA,GAAA,GAAA,IACE,4GACA,SACF;EACA,GAAI;CACL,CAAA;AAEL;AAEA,SAAS,cAAc,EAAE,WAAW,GAAG,SAAsC;CAC3E,OACE,iBAAA,GAAA,kBAAA,KAAC,OAAD;EACE,aAAU;EACV,YAAA,GAAA,GAAA,IACE,6HACA,SACF;EACA,GAAI;CACL,CAAA;AAEL;AAEA,SAAS,cAAc,EAAE,WAAW,GAAG,SAAsC;CAC3E,OACE,iBAAA,GAAA,kBAAA,KAAC,OAAD;EACE,aAAU;EACV,YAAA,GAAA,GAAA,IACE,wKACA,SACF;EACA,GAAI;CACL,CAAA;AAEL"}

package/dist/components/page-header.cjs

@@ -9,11 +9,11 @@ let _epilot_spark_icons = require("@epilot/spark-icons");
 let react_jsx_runtime = require("react/jsx-runtime");
 let _base_ui_react_merge_props = require("@base-ui/react/merge-props");
 let _base_ui_react_use_render = require("@base-ui/react/use-render");
-let cnfast = require("cnfast");
+let cn = require("cn");
 //#region src/components/page-header.tsx
 const PageHeader = react.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)("header", {
 	ref,
-	className: (0, cnfast.cn)("grid grid-cols-[minmax(0,1fr)_auto_minmax(0,1fr)] items-center gap-3", className),
+	className: (0, cn.cn)("grid grid-cols-[minmax(0,1fr)_auto_minmax(0,1fr)] items-center gap-3", className),
 	...props
 }));
 PageHeader.displayName = "PageHeader";
@@ -24,20 +24,20 @@ const PageHeaderBackButton = react.forwardRef(({ children, className, "aria-labe
 	color: "neutral",
 	type: "button",
 	"aria-label": ariaLabel,
-	className: (0, cnfast.cn)("col-start-1 justify-self-start", className),
+	className: (0, cn.cn)("col-start-1 justify-self-start", className),
 	...props,
 	children: children ?? /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_epilot_spark_icons.ChevronLeft, {})
 }));
 PageHeaderBackButton.displayName = "PageHeaderBackButton";
 const PageHeaderTitle = ({ className, ...props }) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_components_typography.PageTitle, {
-	className: (0, cnfast.cn)("col-start-2 justify-self-center text-center", className),
+	className: (0, cn.cn)("col-start-2 justify-self-center text-center", className),
 	...props
 });
 const PageHeaderActions = ({ className, render, ...props }) => {
 	return (0, _base_ui_react_use_render.useRender)({
 		defaultTagName: "div",
 		render,
-		props: (0, _base_ui_react_merge_props.mergeProps)({ className: (0, cnfast.cn)("col-start-3 flex size-10 shrink-0 items-center justify-self-end", className) }, props)
+		props: (0, _base_ui_react_merge_props.mergeProps)({ className: (0, cn.cn)("col-start-3 flex size-10 shrink-0 items-center justify-self-end", className) }, props)
 	});
 };
 PageHeaderActions.displayName = "PageHeaderActions";

package/dist/components/page-header.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"page-header.cjs","names":["React","Button","ChevronLeft","PageTitle"],"sources":["../../src/components/page-header.tsx"],"sourcesContent":["import { mergeProps } from '@base-ui/react/merge-props'\nimport { useRender } from '@base-ui/react/use-render'\nimport { ChevronLeft } from '@epilot/spark-icons'\nimport * as React from 'react'\nimport { cn } from '../utils/cn'\nimport { Button, type ButtonProps } from './button'\nimport { PageTitle } from './typography'\n\nconst PageHeader = React.forwardRef<\n  HTMLElement,\n  React.HTMLAttributes<HTMLElement>\n>(({ className, ...props }, ref) => (\n  <header\n    ref={ref}\n    className={cn(\n      'grid grid-cols-[minmax(0,1fr)_auto_minmax(0,1fr)] items-center gap-3',\n      className,\n    )}\n    {...props}\n  />\n))\nPageHeader.displayName = 'PageHeader'\n\nconst PageHeaderBackButton = React.forwardRef<\n  HTMLButtonElement,\n  Omit<ButtonProps, 'size' | 'styleVariant' | 'color'>\n>(\n  (\n    { children, className, 'aria-label': ariaLabel = 'Back', ...props },\n    ref,\n  ) => (\n    <Button\n      ref={ref}\n      size=\"icon-small\"\n      styleVariant=\"ghost\"\n      color=\"neutral\"\n      type=\"button\"\n      aria-label={ariaLabel}\n      className={cn('col-start-1 justify-self-start', className)}\n      {...props}\n    >\n      {children ?? <ChevronLeft />}\n    </Button>\n  ),\n)\nPageHeaderBackButton.displayName = 'PageHeaderBackButton'\n\nconst PageHeaderTitle = ({\n  className,\n  ...props\n}: React.ComponentProps<'h2'>) => (\n  <PageTitle\n    className={cn('col-start-2 justify-self-center text-center', className)}\n    {...props}\n  />\n)\n\ntype PageHeaderActionsProps = useRender.ComponentProps<'div'>\n\nconst PageHeaderActions = ({\n  className,\n  render,\n  ...props\n}: PageHeaderActionsProps) => {\n  return useRender({\n    defaultTagName: 'div',\n    render,\n    props: mergeProps<'div'>(\n      {\n        className: cn(\n          'col-start-3 flex size-10 shrink-0 items-center justify-self-end',\n          className,\n        ),\n      },\n      props,\n    ),\n  })\n}\nPageHeaderActions.displayName = 'PageHeaderActions'\n\nexport { PageHeader, PageHeaderActions, PageHeaderBackButton, PageHeaderTitle }\nexport type { PageHeaderActionsProps }\n"],"mappings":";;;;;;;;;;;;;AAQA,MAAM,aAAaA,MAAM,YAGtB,EAAE,WAAW,GAAG,SAAS,QAC1B,iBAAA,GAAA,kBAAA,KAAC,UAAD;CACO;CACL,YAAA,GAAA,OAAA,IACE,wEACA,SACF;CACA,GAAI;AACL,CAAA,CACF;AACD,WAAW,cAAc;AAEzB,MAAM,uBAAuBA,MAAM,YAK/B,EAAE,UAAU,WAAW,cAAc,YAAY,QAAQ,GAAG,SAC5D,QAEA,iBAAA,GAAA,kBAAA,KAACC,0BAAAA,QAAD;CACO;CACL,MAAK;CACL,cAAa;CACb,OAAM;CACN,MAAK;CACL,cAAY;CACZ,YAAA,GAAA,OAAA,IAAc,kCAAkC,SAAS;CACzD,GAAI;WAEH,YAAY,iBAAA,GAAA,kBAAA,KAACC,oBAAAA,aAAD,CAAc,CAAA;AACrB,CAAA,CAEZ;AACA,qBAAqB,cAAc;AAEnC,MAAM,mBAAmB,EACvB,WACA,GAAG,YAEH,iBAAA,GAAA,kBAAA,KAACC,8BAAAA,WAAD;CACE,YAAA,GAAA,OAAA,IAAc,+CAA+C,SAAS;CACtE,GAAI;AACL,CAAA;AAKH,MAAM,qBAAqB,EACzB,WACA,QACA,GAAG,YACyB;CAC5B,QAAA,GAAA,0BAAA,WAAiB;EACf,gBAAgB;EAChB;EACA,QAAA,GAAA,2BAAA,YACE,EACE,YAAA,GAAA,OAAA,IACE,mEACA,SACF,EACF,GACA,KACF;CACF,CAAC;AACH;AACA,kBAAkB,cAAc"}
+{"version":3,"file":"page-header.cjs","names":["React","Button","ChevronLeft","PageTitle"],"sources":["../../src/components/page-header.tsx"],"sourcesContent":["import { mergeProps } from '@base-ui/react/merge-props'\nimport { useRender } from '@base-ui/react/use-render'\nimport { ChevronLeft } from '@epilot/spark-icons'\nimport * as React from 'react'\nimport { cn } from '../utils/cn'\nimport { Button, type ButtonProps } from './button'\nimport { PageTitle } from './typography'\n\nconst PageHeader = React.forwardRef<\n  HTMLElement,\n  React.HTMLAttributes<HTMLElement>\n>(({ className, ...props }, ref) => (\n  <header\n    ref={ref}\n    className={cn(\n      'grid grid-cols-[minmax(0,1fr)_auto_minmax(0,1fr)] items-center gap-3',\n      className,\n    )}\n    {...props}\n  />\n))\nPageHeader.displayName = 'PageHeader'\n\nconst PageHeaderBackButton = React.forwardRef<\n  HTMLButtonElement,\n  Omit<ButtonProps, 'size' | 'styleVariant' | 'color'>\n>(\n  (\n    { children, className, 'aria-label': ariaLabel = 'Back', ...props },\n    ref,\n  ) => (\n    <Button\n      ref={ref}\n      size=\"icon-small\"\n      styleVariant=\"ghost\"\n      color=\"neutral\"\n      type=\"button\"\n      aria-label={ariaLabel}\n      className={cn('col-start-1 justify-self-start', className)}\n      {...props}\n    >\n      {children ?? <ChevronLeft />}\n    </Button>\n  ),\n)\nPageHeaderBackButton.displayName = 'PageHeaderBackButton'\n\nconst PageHeaderTitle = ({\n  className,\n  ...props\n}: React.ComponentProps<'h2'>) => (\n  <PageTitle\n    className={cn('col-start-2 justify-self-center text-center', className)}\n    {...props}\n  />\n)\n\ntype PageHeaderActionsProps = useRender.ComponentProps<'div'>\n\nconst PageHeaderActions = ({\n  className,\n  render,\n  ...props\n}: PageHeaderActionsProps) => {\n  return useRender({\n    defaultTagName: 'div',\n    render,\n    props: mergeProps<'div'>(\n      {\n        className: cn(\n          'col-start-3 flex size-10 shrink-0 items-center justify-self-end',\n          className,\n        ),\n      },\n      props,\n    ),\n  })\n}\nPageHeaderActions.displayName = 'PageHeaderActions'\n\nexport { PageHeader, PageHeaderActions, PageHeaderBackButton, PageHeaderTitle }\nexport type { PageHeaderActionsProps }\n"],"mappings":";;;;;;;;;;;;;AAQA,MAAM,aAAaA,MAAM,YAGtB,EAAE,WAAW,GAAG,SAAS,QAC1B,iBAAA,GAAA,kBAAA,KAAC,UAAD;CACO;CACL,YAAA,GAAA,GAAA,IACE,wEACA,SACF;CACA,GAAI;AACL,CAAA,CACF;AACD,WAAW,cAAc;AAEzB,MAAM,uBAAuBA,MAAM,YAK/B,EAAE,UAAU,WAAW,cAAc,YAAY,QAAQ,GAAG,SAC5D,QAEA,iBAAA,GAAA,kBAAA,KAACC,0BAAAA,QAAD;CACO;CACL,MAAK;CACL,cAAa;CACb,OAAM;CACN,MAAK;CACL,cAAY;CACZ,YAAA,GAAA,GAAA,IAAc,kCAAkC,SAAS;CACzD,GAAI;WAEH,YAAY,iBAAA,GAAA,kBAAA,KAACC,oBAAAA,aAAD,CAAc,CAAA;AACrB,CAAA,CAEZ;AACA,qBAAqB,cAAc;AAEnC,MAAM,mBAAmB,EACvB,WACA,GAAG,YAEH,iBAAA,GAAA,kBAAA,KAACC,8BAAAA,WAAD;CACE,YAAA,GAAA,GAAA,IAAc,+CAA+C,SAAS;CACtE,GAAI;AACL,CAAA;AAKH,MAAM,qBAAqB,EACzB,WACA,QACA,GAAG,YACyB;CAC5B,QAAA,GAAA,0BAAA,WAAiB;EACf,gBAAgB;EAChB;EACA,QAAA,GAAA,2BAAA,YACE,EACE,YAAA,GAAA,GAAA,IACE,mEACA,SACF,EACF,GACA,KACF;CACF,CAAC;AACH;AACA,kBAAkB,cAAc"}

package/dist/components/period-tabs.cjs

@@ -3,30 +3,30 @@ Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 const require_components_button = require("./button.cjs");
 let _epilot_spark_icons = require("@epilot/spark-icons");
 let react_jsx_runtime = require("react/jsx-runtime");
-let cnfast = require("cnfast");
+let cn = require("cn");
 //#region src/components/period-tabs.tsx
 const PeriodTabs = ({ className, ...rest }) => {
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
-		className: (0, cnfast.cn)("flex flex-col items-center gap-2", className),
+		className: (0, cn.cn)("flex flex-col items-center gap-2", className),
 		...rest
 	});
 };
 const PeriodStepper = ({ className, ...rest }) => {
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
-		className: (0, cnfast.cn)("flex items-center gap-2 text-gray-light", className),
+		className: (0, cn.cn)("flex items-center gap-2 text-gray-light", className),
 		...rest
 	});
 };
 const PeriodStepperLabel = ({ className, ...rest }) => {
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
-		className: (0, cnfast.cn)("min-w-40 text-center text-sm font-medium text-gray", className),
+		className: (0, cn.cn)("min-w-40 text-center text-sm font-medium text-gray", className),
 		...rest
 	});
 };
 const PeriodStepperButtonPrev = ({ className, "aria-label": ariaLabel, ...rest }) => {
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_components_button.Button, {
 		"aria-label": ariaLabel,
-		className: (0, cnfast.cn)("disabled:text-gray-light/60 disabled:opacity-40", className),
+		className: (0, cn.cn)("disabled:text-gray-light/60 disabled:opacity-40", className),
 		size: "icon-small",
 		styleVariant: "ghost",
 		color: "neutral",
@@ -37,7 +37,7 @@ const PeriodStepperButtonPrev = ({ className, "aria-label": ariaLabel, ...rest }
 const PeriodStepperButtonNext = ({ className, "aria-label": ariaLabel, ...rest }) => {
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_components_button.Button, {
 		"aria-label": ariaLabel,
-		className: (0, cnfast.cn)("disabled:text-gray-light/60 disabled:opacity-40", className),
+		className: (0, cn.cn)("disabled:text-gray-light/60 disabled:opacity-40", className),
 		size: "icon-small",
 		styleVariant: "ghost",
 		color: "neutral",

package/dist/components/period-tabs.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"period-tabs.cjs","names":["Button","ChevronLeft","ChevronRight"],"sources":["../../src/components/period-tabs.tsx"],"sourcesContent":["import { ChevronLeft, ChevronRight } from '@epilot/spark-icons'\nimport { cn } from '../utils/cn'\nimport { Button, type ButtonProps } from './button'\n\ntype PeriodStepperButtonProps = Omit<\n  ButtonProps,\n  'styleVariant' | 'color' | 'size' | 'children' | 'aria-label'\n> & {\n  'aria-label': string\n}\n\nconst PeriodTabs = ({ className, ...rest }: React.ComponentProps<'div'>) => {\n  return (\n    <div\n      className={cn('flex flex-col items-center gap-2', className)}\n      {...rest}\n    />\n  )\n}\n\nconst PeriodStepper = ({ className, ...rest }: React.ComponentProps<'div'>) => {\n  return (\n    <div\n      className={cn('flex items-center gap-2 text-gray-light', className)}\n      {...rest}\n    />\n  )\n}\n\nconst PeriodStepperLabel = ({\n  className,\n  ...rest\n}: React.ComponentProps<'span'>) => {\n  return (\n    <span\n      className={cn(\n        'min-w-40 text-center text-sm font-medium text-gray',\n        className,\n      )}\n      {...rest}\n    />\n  )\n}\n\nconst PeriodStepperButtonPrev = ({\n  className,\n  'aria-label': ariaLabel,\n  ...rest\n}: PeriodStepperButtonProps) => {\n  return (\n    <Button\n      aria-label={ariaLabel}\n      className={cn(\n        'disabled:text-gray-light/60 disabled:opacity-40',\n        className,\n      )}\n      size=\"icon-small\"\n      styleVariant=\"ghost\"\n      color=\"neutral\"\n      {...rest}\n    >\n      <ChevronLeft />\n    </Button>\n  )\n}\n\nconst PeriodStepperButtonNext = ({\n  className,\n  'aria-label': ariaLabel,\n  ...rest\n}: PeriodStepperButtonProps) => {\n  return (\n    <Button\n      aria-label={ariaLabel}\n      className={cn(\n        'disabled:text-gray-light/60 disabled:opacity-40',\n        className,\n      )}\n      size=\"icon-small\"\n      styleVariant=\"ghost\"\n      color=\"neutral\"\n      {...rest}\n    >\n      <ChevronRight />\n    </Button>\n  )\n}\n\nexport {\n  PeriodTabs,\n  PeriodStepper,\n  PeriodStepperLabel,\n  PeriodStepperButtonPrev,\n  PeriodStepperButtonNext,\n}\n"],"mappings":";;;;;;;AAWA,MAAM,cAAc,EAAE,WAAW,GAAG,WAAwC;CAC1E,OACE,iBAAA,GAAA,kBAAA,KAAC,OAAD;EACE,YAAA,GAAA,OAAA,IAAc,oCAAoC,SAAS;EAC3D,GAAI;CACL,CAAA;AAEL;AAEA,MAAM,iBAAiB,EAAE,WAAW,GAAG,WAAwC;CAC7E,OACE,iBAAA,GAAA,kBAAA,KAAC,OAAD;EACE,YAAA,GAAA,OAAA,IAAc,2CAA2C,SAAS;EAClE,GAAI;CACL,CAAA;AAEL;AAEA,MAAM,sBAAsB,EAC1B,WACA,GAAG,WAC+B;CAClC,OACE,iBAAA,GAAA,kBAAA,KAAC,QAAD;EACE,YAAA,GAAA,OAAA,IACE,sDACA,SACF;EACA,GAAI;CACL,CAAA;AAEL;AAEA,MAAM,2BAA2B,EAC/B,WACA,cAAc,WACd,GAAG,WAC2B;CAC9B,OACE,iBAAA,GAAA,kBAAA,KAACA,0BAAAA,QAAD;EACE,cAAY;EACZ,YAAA,GAAA,OAAA,IACE,mDACA,SACF;EACA,MAAK;EACL,cAAa;EACb,OAAM;EACN,GAAI;YAEJ,iBAAA,GAAA,kBAAA,KAACC,oBAAAA,aAAD,CAAc,CAAA;CACR,CAAA;AAEZ;AAEA,MAAM,2BAA2B,EAC/B,WACA,cAAc,WACd,GAAG,WAC2B;CAC9B,OACE,iBAAA,GAAA,kBAAA,KAACD,0BAAAA,QAAD;EACE,cAAY;EACZ,YAAA,GAAA,OAAA,IACE,mDACA,SACF;EACA,MAAK;EACL,cAAa;EACb,OAAM;EACN,GAAI;YAEJ,iBAAA,GAAA,kBAAA,KAACE,oBAAAA,cAAD,CAAe,CAAA;CACT,CAAA;AAEZ"}
+{"version":3,"file":"period-tabs.cjs","names":["Button","ChevronLeft","ChevronRight"],"sources":["../../src/components/period-tabs.tsx"],"sourcesContent":["import { ChevronLeft, ChevronRight } from '@epilot/spark-icons'\nimport { cn } from '../utils/cn'\nimport { Button, type ButtonProps } from './button'\n\ntype PeriodStepperButtonProps = Omit<\n  ButtonProps,\n  'styleVariant' | 'color' | 'size' | 'children' | 'aria-label'\n> & {\n  'aria-label': string\n}\n\nconst PeriodTabs = ({ className, ...rest }: React.ComponentProps<'div'>) => {\n  return (\n    <div\n      className={cn('flex flex-col items-center gap-2', className)}\n      {...rest}\n    />\n  )\n}\n\nconst PeriodStepper = ({ className, ...rest }: React.ComponentProps<'div'>) => {\n  return (\n    <div\n      className={cn('flex items-center gap-2 text-gray-light', className)}\n      {...rest}\n    />\n  )\n}\n\nconst PeriodStepperLabel = ({\n  className,\n  ...rest\n}: React.ComponentProps<'span'>) => {\n  return (\n    <span\n      className={cn(\n        'min-w-40 text-center text-sm font-medium text-gray',\n        className,\n      )}\n      {...rest}\n    />\n  )\n}\n\nconst PeriodStepperButtonPrev = ({\n  className,\n  'aria-label': ariaLabel,\n  ...rest\n}: PeriodStepperButtonProps) => {\n  return (\n    <Button\n      aria-label={ariaLabel}\n      className={cn(\n        'disabled:text-gray-light/60 disabled:opacity-40',\n        className,\n      )}\n      size=\"icon-small\"\n      styleVariant=\"ghost\"\n      color=\"neutral\"\n      {...rest}\n    >\n      <ChevronLeft />\n    </Button>\n  )\n}\n\nconst PeriodStepperButtonNext = ({\n  className,\n  'aria-label': ariaLabel,\n  ...rest\n}: PeriodStepperButtonProps) => {\n  return (\n    <Button\n      aria-label={ariaLabel}\n      className={cn(\n        'disabled:text-gray-light/60 disabled:opacity-40',\n        className,\n      )}\n      size=\"icon-small\"\n      styleVariant=\"ghost\"\n      color=\"neutral\"\n      {...rest}\n    >\n      <ChevronRight />\n    </Button>\n  )\n}\n\nexport {\n  PeriodTabs,\n  PeriodStepper,\n  PeriodStepperLabel,\n  PeriodStepperButtonPrev,\n  PeriodStepperButtonNext,\n}\n"],"mappings":";;;;;;;AAWA,MAAM,cAAc,EAAE,WAAW,GAAG,WAAwC;CAC1E,OACE,iBAAA,GAAA,kBAAA,KAAC,OAAD;EACE,YAAA,GAAA,GAAA,IAAc,oCAAoC,SAAS;EAC3D,GAAI;CACL,CAAA;AAEL;AAEA,MAAM,iBAAiB,EAAE,WAAW,GAAG,WAAwC;CAC7E,OACE,iBAAA,GAAA,kBAAA,KAAC,OAAD;EACE,YAAA,GAAA,GAAA,IAAc,2CAA2C,SAAS;EAClE,GAAI;CACL,CAAA;AAEL;AAEA,MAAM,sBAAsB,EAC1B,WACA,GAAG,WAC+B;CAClC,OACE,iBAAA,GAAA,kBAAA,KAAC,QAAD;EACE,YAAA,GAAA,GAAA,IACE,sDACA,SACF;EACA,GAAI;CACL,CAAA;AAEL;AAEA,MAAM,2BAA2B,EAC/B,WACA,cAAc,WACd,GAAG,WAC2B;CAC9B,OACE,iBAAA,GAAA,kBAAA,KAACA,0BAAAA,QAAD;EACE,cAAY;EACZ,YAAA,GAAA,GAAA,IACE,mDACA,SACF;EACA,MAAK;EACL,cAAa;EACb,OAAM;EACN,GAAI;YAEJ,iBAAA,GAAA,kBAAA,KAACC,oBAAAA,aAAD,CAAc,CAAA;CACR,CAAA;AAEZ;AAEA,MAAM,2BAA2B,EAC/B,WACA,cAAc,WACd,GAAG,WAC2B;CAC9B,OACE,iBAAA,GAAA,kBAAA,KAACD,0BAAAA,QAAD;EACE,cAAY;EACZ,YAAA,GAAA,GAAA,IACE,mDACA,SACF;EACA,MAAK;EACL,cAAa;EACb,OAAM;EACN,GAAI;YAEJ,iBAAA,GAAA,kBAAA,KAACE,oBAAAA,cAAD,CAAe,CAAA;CACT,CAAA;AAEZ"}

package/dist/components/pill.cjs

@@ -6,7 +6,7 @@ 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 cnfast = require("cnfast");
+let cn = require("cn");
 //#region src/components/pill.tsx
 /**
 * Like Badge, but interactive: `onClick` makes the whole pill a button
@@ -42,7 +42,7 @@ const Pill = react.forwardRef(function Pill({ className, children, styleVariant,
 		"data-accent-color": color ? require_lib_accent_colors.accentByColor[color] : void 0,
 		...interaction,
 		ref,
-		className: (0, cnfast.cn)("inline-flex h-7 items-center gap-1 rounded-full px-2.5 text-xs font-medium select-none", "bg-(--spark-style-bg,var(--color-base-gray-soft)) text-(--spark-style-fg,var(--spark-badge-fg,var(--color-gray-high-contrast)))", "shadow-[inset_0_0_0_var(--spark-style-border-width,1px)_var(--spark-style-border,transparent)]", focusable && "transition-colors focus-visible:ring-2 focus-visible:ring-offset-2 focus-visible:outline-hidden motion-reduce:transition-none", clickable && "cursor-pointer hover:bg-(--spark-style-bg-hover,var(--color-gray-a4))", disabled && "pointer-events-none opacity-50", className),
+		className: (0, cn.cn)("inline-flex h-7 items-center gap-1 rounded-full px-2.5 text-xs font-medium select-none", "bg-(--spark-style-bg,var(--neutral-a3)) text-(--spark-style-fg,var(--spark-badge-fg,var(--neutral-a11)))", "shadow-[inset_0_0_0_var(--spark-style-border-width,1px)_var(--spark-style-border,transparent)]", focusable && "transition-colors focus-visible:ring-2 focus-visible:ring-offset-2 focus-visible:outline-hidden motion-reduce:transition-none", clickable && "cursor-pointer hover:bg-(--spark-style-bg-hover,var(--neutral-a4))", disabled && "pointer-events-none opacity-50", className),
 		...props,
 		children: [children, removable ? /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(react_jsx_runtime.Fragment, { children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
 			className: "sr-only",
@@ -54,7 +54,7 @@ const Pill = react.forwardRef(function Pill({ className, children, styleVariant,
 				event.stopPropagation();
 				onRemove?.(event);
 			},
-			className: "-mr-1 inline-flex size-4 shrink-0 items-center justify-center rounded-full transition-colors hover:bg-(--spark-style-bg-hover,var(--color-gray-a4)) motion-reduce:transition-none",
+			className: "-mr-1 inline-flex size-4 shrink-0 items-center justify-center rounded-full transition-colors hover:bg-(--spark-style-bg-hover,var(--neutral-a4)) motion-reduce:transition-none",
 			children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_epilot_spark_icons.Close, { className: "[--spark-icon-size:14px]" })
 		})] }) : null]
 	});

package/dist/components/pill.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"pill.cjs","names":["React","accentByColor","Close"],"sources":["../../src/components/pill.tsx"],"sourcesContent":["import { Close } from '@epilot/spark-icons'\nimport * as React from 'react'\nimport { accentByColor } from '../lib/accent-colors'\nimport type { SparkAccentColor } from '../lib/accent-colors'\nimport type { SparkStyle } from '../lib/theme-types'\nimport { cn } from '../utils/cn'\n\ntype PillRemoveProps =\n  | { onRemove?: undefined; removeLabel?: string }\n  | {\n      /** Fires on a pointer click of the (decorative) glyph, or Delete/Backspace while the pill has focus. */\n      onRemove: (event: React.SyntheticEvent) => void\n      /** Visually-hidden text folded into the pill's accessible name -- the glyph itself is `aria-hidden`. */\n      removeLabel: string\n    }\n\ntype PillProps = Omit<React.HTMLAttributes<HTMLSpanElement>, 'onClick'> &\n  PillRemoveProps & {\n    styleVariant?: SparkStyle\n    color?: SparkAccentColor\n    disabled?: boolean\n    onClick?: (event: React.SyntheticEvent<HTMLSpanElement>) => void\n  }\n\n/**\n * Like Badge, but interactive: `onClick` makes the whole pill a button\n * (Enter/Space), `onRemove` adds a Delete/Backspace-and-click affordance.\n * Both are optional -- with neither, it's a static label.\n */\nconst Pill = React.forwardRef<HTMLSpanElement, PillProps>(function Pill(\n  {\n    className,\n    children,\n    styleVariant,\n    color,\n    disabled = false,\n    onClick,\n    onRemove,\n    removeLabel,\n    onKeyDown,\n    ...props\n  },\n  ref,\n) {\n  const clickable = !disabled && onClick !== undefined\n  const removable = !disabled && onRemove !== undefined\n  const focusable = clickable || removable\n  const hasLook = styleVariant !== undefined || color !== undefined\n\n  const handleKeyDown = (event: React.KeyboardEvent<HTMLSpanElement>) => {\n    onKeyDown?.(event)\n    if (clickable && (event.key === 'Enter' || event.key === ' ')) {\n      if (event.key === ' ') event.preventDefault()\n      onClick?.(event)\n    }\n    if (removable && (event.key === 'Delete' || event.key === 'Backspace')) {\n      onRemove?.(event)\n    }\n  }\n\n  // button role and click handler travel together, so a clickable pill always\n  // answers Enter/Space; a removable-only pill stays generic and answers Delete\n  const interaction = {\n    onKeyDown: handleKeyDown,\n    ...(clickable && { role: 'button' as const, onClick }),\n    ...(focusable && { tabIndex: 0 }),\n  }\n\n  return (\n    <span\n      aria-disabled={disabled || undefined}\n      aria-keyshortcuts={removable ? 'Delete' : undefined}\n      data-slot=\"pill\"\n      data-style={hasLook ? (styleVariant ?? 'soft') : undefined}\n      data-accent-color={color ? accentByColor[color] : undefined}\n      {...interaction}\n      ref={ref}\n      className={cn(\n        'inline-flex h-7 items-center gap-1 rounded-full px-2.5 text-xs font-medium select-none',\n        'bg-(--spark-style-bg,var(--color-base-gray-soft)) text-(--spark-style-fg,var(--spark-badge-fg,var(--color-gray-high-contrast)))',\n        'shadow-[inset_0_0_0_var(--spark-style-border-width,1px)_var(--spark-style-border,transparent)]',\n        focusable &&\n          'transition-colors focus-visible:ring-2 focus-visible:ring-offset-2 focus-visible:outline-hidden motion-reduce:transition-none',\n        clickable &&\n          'cursor-pointer hover:bg-(--spark-style-bg-hover,var(--color-gray-a4))',\n        disabled && 'pointer-events-none opacity-50',\n        className,\n      )}\n      {...props}\n    >\n      {children}\n      {removable ? (\n        <>\n          {/* aria-hidden hides the glyph itself; this carries removeLabel into the pill's own accessible name */}\n          <span className=\"sr-only\">{removeLabel}</span>\n          <span\n            aria-hidden=\"true\"\n            data-slot=\"pill-remove\"\n            onClick={(event) => {\n              event.stopPropagation()\n              onRemove?.(event)\n            }}\n            className=\"-mr-1 inline-flex size-4 shrink-0 items-center justify-center rounded-full transition-colors hover:bg-(--spark-style-bg-hover,var(--color-gray-a4)) motion-reduce:transition-none\"\n          >\n            <Close className=\"[--spark-icon-size:14px]\" />\n          </span>\n        </>\n      ) : null}\n    </span>\n  )\n})\n\nPill.displayName = 'Pill'\n\nexport { Pill }\nexport type { PillProps }\n"],"mappings":";;;;;;;;;;;;;;;AA6BA,MAAM,OAAOA,MAAM,WAAuC,SAAS,KACjE,EACE,WACA,UACA,cACA,OACA,WAAW,OACX,SACA,UACA,aACA,WACA,GAAG,SAEL,KACA;CACA,MAAM,YAAY,CAAC,YAAY,YAAY,KAAA;CAC3C,MAAM,YAAY,CAAC,YAAY,aAAa,KAAA;CAC5C,MAAM,YAAY,aAAa;CAC/B,MAAM,UAAU,iBAAiB,KAAA,KAAa,UAAU,KAAA;CAExD,MAAM,iBAAiB,UAAgD;EACrE,YAAY,KAAK;EACjB,IAAI,cAAc,MAAM,QAAQ,WAAW,MAAM,QAAQ,MAAM;GAC7D,IAAI,MAAM,QAAQ,KAAK,MAAM,eAAe;GAC5C,UAAU,KAAK;EACjB;EACA,IAAI,cAAc,MAAM,QAAQ,YAAY,MAAM,QAAQ,cACxD,WAAW,KAAK;CAEpB;CAIA,MAAM,cAAc;EAClB,WAAW;EACX,GAAI,aAAa;GAAE,MAAM;GAAmB;EAAQ;EACpD,GAAI,aAAa,EAAE,UAAU,EAAE;CACjC;CAEA,OACE,iBAAA,GAAA,kBAAA,MAAC,QAAD;EACE,iBAAe,YAAY,KAAA;EAC3B,qBAAmB,YAAY,WAAW,KAAA;EAC1C,aAAU;EACV,cAAY,UAAW,gBAAgB,SAAU,KAAA;EACjD,qBAAmB,QAAQC,0BAAAA,cAAc,SAAS,KAAA;EAClD,GAAI;EACC;EACL,YAAA,GAAA,OAAA,IACE,0FACA,mIACA,kGACA,aACE,iIACF,aACE,yEACF,YAAY,kCACZ,SACF;EACA,GAAI;YAnBN,CAqBG,UACA,YACC,iBAAA,GAAA,kBAAA,MAAA,kBAAA,UAAA,EAAA,UAAA,CAEE,iBAAA,GAAA,kBAAA,KAAC,QAAD;GAAM,WAAU;aAAW;EAAkB,CAAA,GAC7C,iBAAA,GAAA,kBAAA,KAAC,QAAD;GACE,eAAY;GACZ,aAAU;GACV,UAAU,UAAU;IAClB,MAAM,gBAAgB;IACtB,WAAW,KAAK;GAClB;GACA,WAAU;aAEV,iBAAA,GAAA,kBAAA,KAACC,oBAAAA,OAAD,EAAO,WAAU,2BAA4B,CAAA;EACzC,CAAA,CACN,EAAA,CAAA,IACA,IACA;;AAEV,CAAC;AAED,KAAK,cAAc"}
+{"version":3,"file":"pill.cjs","names":["React","accentByColor","Close"],"sources":["../../src/components/pill.tsx"],"sourcesContent":["import { Close } from '@epilot/spark-icons'\nimport * as React from 'react'\nimport { accentByColor } from '../lib/accent-colors'\nimport type { SparkAccentColor } from '../lib/accent-colors'\nimport type { SparkStyle } from '../lib/theme-types'\nimport { cn } from '../utils/cn'\n\ntype PillRemoveProps =\n  | { onRemove?: undefined; removeLabel?: string }\n  | {\n      /** Fires on a pointer click of the (decorative) glyph, or Delete/Backspace while the pill has focus. */\n      onRemove: (event: React.SyntheticEvent) => void\n      /** Visually-hidden text folded into the pill's accessible name -- the glyph itself is `aria-hidden`. */\n      removeLabel: string\n    }\n\ntype PillProps = Omit<React.HTMLAttributes<HTMLSpanElement>, 'onClick'> &\n  PillRemoveProps & {\n    styleVariant?: SparkStyle\n    color?: SparkAccentColor\n    disabled?: boolean\n    onClick?: (event: React.SyntheticEvent<HTMLSpanElement>) => void\n  }\n\n/**\n * Like Badge, but interactive: `onClick` makes the whole pill a button\n * (Enter/Space), `onRemove` adds a Delete/Backspace-and-click affordance.\n * Both are optional -- with neither, it's a static label.\n */\nconst Pill = React.forwardRef<HTMLSpanElement, PillProps>(function Pill(\n  {\n    className,\n    children,\n    styleVariant,\n    color,\n    disabled = false,\n    onClick,\n    onRemove,\n    removeLabel,\n    onKeyDown,\n    ...props\n  },\n  ref,\n) {\n  const clickable = !disabled && onClick !== undefined\n  const removable = !disabled && onRemove !== undefined\n  const focusable = clickable || removable\n  const hasLook = styleVariant !== undefined || color !== undefined\n\n  const handleKeyDown = (event: React.KeyboardEvent<HTMLSpanElement>) => {\n    onKeyDown?.(event)\n    if (clickable && (event.key === 'Enter' || event.key === ' ')) {\n      if (event.key === ' ') event.preventDefault()\n      onClick?.(event)\n    }\n    if (removable && (event.key === 'Delete' || event.key === 'Backspace')) {\n      onRemove?.(event)\n    }\n  }\n\n  // button role and click handler travel together, so a clickable pill always\n  // answers Enter/Space; a removable-only pill stays generic and answers Delete\n  const interaction = {\n    onKeyDown: handleKeyDown,\n    ...(clickable && { role: 'button' as const, onClick }),\n    ...(focusable && { tabIndex: 0 }),\n  }\n\n  return (\n    <span\n      aria-disabled={disabled || undefined}\n      aria-keyshortcuts={removable ? 'Delete' : undefined}\n      data-slot=\"pill\"\n      data-style={hasLook ? (styleVariant ?? 'soft') : undefined}\n      data-accent-color={color ? accentByColor[color] : undefined}\n      {...interaction}\n      ref={ref}\n      className={cn(\n        'inline-flex h-7 items-center gap-1 rounded-full px-2.5 text-xs font-medium select-none',\n        'bg-(--spark-style-bg,var(--neutral-a3)) text-(--spark-style-fg,var(--spark-badge-fg,var(--neutral-a11)))',\n        'shadow-[inset_0_0_0_var(--spark-style-border-width,1px)_var(--spark-style-border,transparent)]',\n        focusable &&\n          'transition-colors focus-visible:ring-2 focus-visible:ring-offset-2 focus-visible:outline-hidden motion-reduce:transition-none',\n        clickable &&\n          'cursor-pointer hover:bg-(--spark-style-bg-hover,var(--neutral-a4))',\n        disabled && 'pointer-events-none opacity-50',\n        className,\n      )}\n      {...props}\n    >\n      {children}\n      {removable ? (\n        <>\n          {/* aria-hidden hides the glyph itself; this carries removeLabel into the pill's own accessible name */}\n          <span className=\"sr-only\">{removeLabel}</span>\n          <span\n            aria-hidden=\"true\"\n            data-slot=\"pill-remove\"\n            onClick={(event) => {\n              event.stopPropagation()\n              onRemove?.(event)\n            }}\n            className=\"-mr-1 inline-flex size-4 shrink-0 items-center justify-center rounded-full transition-colors hover:bg-(--spark-style-bg-hover,var(--neutral-a4)) motion-reduce:transition-none\"\n          >\n            <Close className=\"[--spark-icon-size:14px]\" />\n          </span>\n        </>\n      ) : null}\n    </span>\n  )\n})\n\nPill.displayName = 'Pill'\n\nexport { Pill }\nexport type { PillProps }\n"],"mappings":";;;;;;;;;;;;;;;AA6BA,MAAM,OAAOA,MAAM,WAAuC,SAAS,KACjE,EACE,WACA,UACA,cACA,OACA,WAAW,OACX,SACA,UACA,aACA,WACA,GAAG,SAEL,KACA;CACA,MAAM,YAAY,CAAC,YAAY,YAAY,KAAA;CAC3C,MAAM,YAAY,CAAC,YAAY,aAAa,KAAA;CAC5C,MAAM,YAAY,aAAa;CAC/B,MAAM,UAAU,iBAAiB,KAAA,KAAa,UAAU,KAAA;CAExD,MAAM,iBAAiB,UAAgD;EACrE,YAAY,KAAK;EACjB,IAAI,cAAc,MAAM,QAAQ,WAAW,MAAM,QAAQ,MAAM;GAC7D,IAAI,MAAM,QAAQ,KAAK,MAAM,eAAe;GAC5C,UAAU,KAAK;EACjB;EACA,IAAI,cAAc,MAAM,QAAQ,YAAY,MAAM,QAAQ,cACxD,WAAW,KAAK;CAEpB;CAIA,MAAM,cAAc;EAClB,WAAW;EACX,GAAI,aAAa;GAAE,MAAM;GAAmB;EAAQ;EACpD,GAAI,aAAa,EAAE,UAAU,EAAE;CACjC;CAEA,OACE,iBAAA,GAAA,kBAAA,MAAC,QAAD;EACE,iBAAe,YAAY,KAAA;EAC3B,qBAAmB,YAAY,WAAW,KAAA;EAC1C,aAAU;EACV,cAAY,UAAW,gBAAgB,SAAU,KAAA;EACjD,qBAAmB,QAAQC,0BAAAA,cAAc,SAAS,KAAA;EAClD,GAAI;EACC;EACL,YAAA,GAAA,GAAA,IACE,0FACA,4GACA,kGACA,aACE,iIACF,aACE,sEACF,YAAY,kCACZ,SACF;EACA,GAAI;YAnBN,CAqBG,UACA,YACC,iBAAA,GAAA,kBAAA,MAAA,kBAAA,UAAA,EAAA,UAAA,CAEE,iBAAA,GAAA,kBAAA,KAAC,QAAD;GAAM,WAAU;aAAW;EAAkB,CAAA,GAC7C,iBAAA,GAAA,kBAAA,KAAC,QAAD;GACE,eAAY;GACZ,aAAU;GACV,UAAU,UAAU;IAClB,MAAM,gBAAgB;IACtB,WAAW,KAAK;GAClB;GACA,WAAU;aAEV,iBAAA,GAAA,kBAAA,KAACC,oBAAAA,OAAD,EAAO,WAAU,2BAA4B,CAAA;EACzC,CAAA,CACN,EAAA,CAAA,IACA,IACA;;AAEV,CAAC;AAED,KAAK,cAAc"}

package/dist/components/pill.js

@@ -1,6 +1,6 @@
 "use client";
-import { cn } from "../utils/cn.js";
 import { accentByColor } from "../lib/accent-colors.js";
+import { cn } from "../utils/cn.js";
 import * as React$1 from "react";
 import { Close } from "@epilot/spark-icons";
 import { Fragment, jsx, jsxs } from "react/jsx-runtime";
@@ -39,7 +39,7 @@ const Pill = React$1.forwardRef(function Pill({ className, children, styleVarian
 		"data-accent-color": color ? accentByColor[color] : void 0,
 		...interaction,
 		ref,
-		className: cn("inline-flex h-7 items-center gap-1 rounded-full px-2.5 text-xs font-medium select-none", "bg-(--spark-style-bg,var(--color-base-gray-soft)) text-(--spark-style-fg,var(--spark-badge-fg,var(--color-gray-high-contrast)))", "shadow-[inset_0_0_0_var(--spark-style-border-width,1px)_var(--spark-style-border,transparent)]", focusable && "transition-colors focus-visible:ring-2 focus-visible:ring-offset-2 focus-visible:outline-hidden motion-reduce:transition-none", clickable && "cursor-pointer hover:bg-(--spark-style-bg-hover,var(--color-gray-a4))", disabled && "pointer-events-none opacity-50", className),
+		className: cn("inline-flex h-7 items-center gap-1 rounded-full px-2.5 text-xs font-medium select-none", "bg-(--spark-style-bg,var(--neutral-a3)) text-(--spark-style-fg,var(--spark-badge-fg,var(--neutral-a11)))", "shadow-[inset_0_0_0_var(--spark-style-border-width,1px)_var(--spark-style-border,transparent)]", focusable && "transition-colors focus-visible:ring-2 focus-visible:ring-offset-2 focus-visible:outline-hidden motion-reduce:transition-none", clickable && "cursor-pointer hover:bg-(--spark-style-bg-hover,var(--neutral-a4))", disabled && "pointer-events-none opacity-50", className),
 		...props,
 		children: [children, removable ? /* @__PURE__ */ jsxs(Fragment, { children: [/* @__PURE__ */ jsx("span", {
 			className: "sr-only",
@@ -51,7 +51,7 @@ const Pill = React$1.forwardRef(function Pill({ className, children, styleVarian
 				event.stopPropagation();
 				onRemove?.(event);
 			},
-			className: "-mr-1 inline-flex size-4 shrink-0 items-center justify-center rounded-full transition-colors hover:bg-(--spark-style-bg-hover,var(--color-gray-a4)) motion-reduce:transition-none",
+			className: "-mr-1 inline-flex size-4 shrink-0 items-center justify-center rounded-full transition-colors hover:bg-(--spark-style-bg-hover,var(--neutral-a4)) motion-reduce:transition-none",
 			children: /* @__PURE__ */ jsx(Close, { className: "[--spark-icon-size:14px]" })
 		})] }) : null]
 	});

package/dist/components/pill.js.map

@@ -1 +1 @@
-{"version":3,"file":"pill.js","names":["React"],"sources":["../../src/components/pill.tsx"],"sourcesContent":["import { Close } from '@epilot/spark-icons'\nimport * as React from 'react'\nimport { accentByColor } from '../lib/accent-colors'\nimport type { SparkAccentColor } from '../lib/accent-colors'\nimport type { SparkStyle } from '../lib/theme-types'\nimport { cn } from '../utils/cn'\n\ntype PillRemoveProps =\n  | { onRemove?: undefined; removeLabel?: string }\n  | {\n      /** Fires on a pointer click of the (decorative) glyph, or Delete/Backspace while the pill has focus. */\n      onRemove: (event: React.SyntheticEvent) => void\n      /** Visually-hidden text folded into the pill's accessible name -- the glyph itself is `aria-hidden`. */\n      removeLabel: string\n    }\n\ntype PillProps = Omit<React.HTMLAttributes<HTMLSpanElement>, 'onClick'> &\n  PillRemoveProps & {\n    styleVariant?: SparkStyle\n    color?: SparkAccentColor\n    disabled?: boolean\n    onClick?: (event: React.SyntheticEvent<HTMLSpanElement>) => void\n  }\n\n/**\n * Like Badge, but interactive: `onClick` makes the whole pill a button\n * (Enter/Space), `onRemove` adds a Delete/Backspace-and-click affordance.\n * Both are optional -- with neither, it's a static label.\n */\nconst Pill = React.forwardRef<HTMLSpanElement, PillProps>(function Pill(\n  {\n    className,\n    children,\n    styleVariant,\n    color,\n    disabled = false,\n    onClick,\n    onRemove,\n    removeLabel,\n    onKeyDown,\n    ...props\n  },\n  ref,\n) {\n  const clickable = !disabled && onClick !== undefined\n  const removable = !disabled && onRemove !== undefined\n  const focusable = clickable || removable\n  const hasLook = styleVariant !== undefined || color !== undefined\n\n  const handleKeyDown = (event: React.KeyboardEvent<HTMLSpanElement>) => {\n    onKeyDown?.(event)\n    if (clickable && (event.key === 'Enter' || event.key === ' ')) {\n      if (event.key === ' ') event.preventDefault()\n      onClick?.(event)\n    }\n    if (removable && (event.key === 'Delete' || event.key === 'Backspace')) {\n      onRemove?.(event)\n    }\n  }\n\n  // button role and click handler travel together, so a clickable pill always\n  // answers Enter/Space; a removable-only pill stays generic and answers Delete\n  const interaction = {\n    onKeyDown: handleKeyDown,\n    ...(clickable && { role: 'button' as const, onClick }),\n    ...(focusable && { tabIndex: 0 }),\n  }\n\n  return (\n    <span\n      aria-disabled={disabled || undefined}\n      aria-keyshortcuts={removable ? 'Delete' : undefined}\n      data-slot=\"pill\"\n      data-style={hasLook ? (styleVariant ?? 'soft') : undefined}\n      data-accent-color={color ? accentByColor[color] : undefined}\n      {...interaction}\n      ref={ref}\n      className={cn(\n        'inline-flex h-7 items-center gap-1 rounded-full px-2.5 text-xs font-medium select-none',\n        'bg-(--spark-style-bg,var(--color-base-gray-soft)) text-(--spark-style-fg,var(--spark-badge-fg,var(--color-gray-high-contrast)))',\n        'shadow-[inset_0_0_0_var(--spark-style-border-width,1px)_var(--spark-style-border,transparent)]',\n        focusable &&\n          'transition-colors focus-visible:ring-2 focus-visible:ring-offset-2 focus-visible:outline-hidden motion-reduce:transition-none',\n        clickable &&\n          'cursor-pointer hover:bg-(--spark-style-bg-hover,var(--color-gray-a4))',\n        disabled && 'pointer-events-none opacity-50',\n        className,\n      )}\n      {...props}\n    >\n      {children}\n      {removable ? (\n        <>\n          {/* aria-hidden hides the glyph itself; this carries removeLabel into the pill's own accessible name */}\n          <span className=\"sr-only\">{removeLabel}</span>\n          <span\n            aria-hidden=\"true\"\n            data-slot=\"pill-remove\"\n            onClick={(event) => {\n              event.stopPropagation()\n              onRemove?.(event)\n            }}\n            className=\"-mr-1 inline-flex size-4 shrink-0 items-center justify-center rounded-full transition-colors hover:bg-(--spark-style-bg-hover,var(--color-gray-a4)) motion-reduce:transition-none\"\n          >\n            <Close className=\"[--spark-icon-size:14px]\" />\n          </span>\n        </>\n      ) : null}\n    </span>\n  )\n})\n\nPill.displayName = 'Pill'\n\nexport { Pill }\nexport type { PillProps }\n"],"mappings":";;;;;;;;;;;;AA6BA,MAAM,OAAOA,QAAM,WAAuC,SAAS,KACjE,EACE,WACA,UACA,cACA,OACA,WAAW,OACX,SACA,UACA,aACA,WACA,GAAG,SAEL,KACA;CACA,MAAM,YAAY,CAAC,YAAY,YAAY,KAAA;CAC3C,MAAM,YAAY,CAAC,YAAY,aAAa,KAAA;CAC5C,MAAM,YAAY,aAAa;CAC/B,MAAM,UAAU,iBAAiB,KAAA,KAAa,UAAU,KAAA;CAExD,MAAM,iBAAiB,UAAgD;EACrE,YAAY,KAAK;EACjB,IAAI,cAAc,MAAM,QAAQ,WAAW,MAAM,QAAQ,MAAM;GAC7D,IAAI,MAAM,QAAQ,KAAK,MAAM,eAAe;GAC5C,UAAU,KAAK;EACjB;EACA,IAAI,cAAc,MAAM,QAAQ,YAAY,MAAM,QAAQ,cACxD,WAAW,KAAK;CAEpB;CAIA,MAAM,cAAc;EAClB,WAAW;EACX,GAAI,aAAa;GAAE,MAAM;GAAmB;EAAQ;EACpD,GAAI,aAAa,EAAE,UAAU,EAAE;CACjC;CAEA,OACE,qBAAC,QAAD;EACE,iBAAe,YAAY,KAAA;EAC3B,qBAAmB,YAAY,WAAW,KAAA;EAC1C,aAAU;EACV,cAAY,UAAW,gBAAgB,SAAU,KAAA;EACjD,qBAAmB,QAAQ,cAAc,SAAS,KAAA;EAClD,GAAI;EACC;EACL,WAAW,GACT,0FACA,mIACA,kGACA,aACE,iIACF,aACE,yEACF,YAAY,kCACZ,SACF;EACA,GAAI;YAnBN,CAqBG,UACA,YACC,qBAAA,UAAA,EAAA,UAAA,CAEE,oBAAC,QAAD;GAAM,WAAU;aAAW;EAAkB,CAAA,GAC7C,oBAAC,QAAD;GACE,eAAY;GACZ,aAAU;GACV,UAAU,UAAU;IAClB,MAAM,gBAAgB;IACtB,WAAW,KAAK;GAClB;GACA,WAAU;aAEV,oBAAC,OAAD,EAAO,WAAU,2BAA4B,CAAA;EACzC,CAAA,CACN,EAAA,CAAA,IACA,IACA;;AAEV,CAAC;AAED,KAAK,cAAc"}
+{"version":3,"file":"pill.js","names":["React"],"sources":["../../src/components/pill.tsx"],"sourcesContent":["import { Close } from '@epilot/spark-icons'\nimport * as React from 'react'\nimport { accentByColor } from '../lib/accent-colors'\nimport type { SparkAccentColor } from '../lib/accent-colors'\nimport type { SparkStyle } from '../lib/theme-types'\nimport { cn } from '../utils/cn'\n\ntype PillRemoveProps =\n  | { onRemove?: undefined; removeLabel?: string }\n  | {\n      /** Fires on a pointer click of the (decorative) glyph, or Delete/Backspace while the pill has focus. */\n      onRemove: (event: React.SyntheticEvent) => void\n      /** Visually-hidden text folded into the pill's accessible name -- the glyph itself is `aria-hidden`. */\n      removeLabel: string\n    }\n\ntype PillProps = Omit<React.HTMLAttributes<HTMLSpanElement>, 'onClick'> &\n  PillRemoveProps & {\n    styleVariant?: SparkStyle\n    color?: SparkAccentColor\n    disabled?: boolean\n    onClick?: (event: React.SyntheticEvent<HTMLSpanElement>) => void\n  }\n\n/**\n * Like Badge, but interactive: `onClick` makes the whole pill a button\n * (Enter/Space), `onRemove` adds a Delete/Backspace-and-click affordance.\n * Both are optional -- with neither, it's a static label.\n */\nconst Pill = React.forwardRef<HTMLSpanElement, PillProps>(function Pill(\n  {\n    className,\n    children,\n    styleVariant,\n    color,\n    disabled = false,\n    onClick,\n    onRemove,\n    removeLabel,\n    onKeyDown,\n    ...props\n  },\n  ref,\n) {\n  const clickable = !disabled && onClick !== undefined\n  const removable = !disabled && onRemove !== undefined\n  const focusable = clickable || removable\n  const hasLook = styleVariant !== undefined || color !== undefined\n\n  const handleKeyDown = (event: React.KeyboardEvent<HTMLSpanElement>) => {\n    onKeyDown?.(event)\n    if (clickable && (event.key === 'Enter' || event.key === ' ')) {\n      if (event.key === ' ') event.preventDefault()\n      onClick?.(event)\n    }\n    if (removable && (event.key === 'Delete' || event.key === 'Backspace')) {\n      onRemove?.(event)\n    }\n  }\n\n  // button role and click handler travel together, so a clickable pill always\n  // answers Enter/Space; a removable-only pill stays generic and answers Delete\n  const interaction = {\n    onKeyDown: handleKeyDown,\n    ...(clickable && { role: 'button' as const, onClick }),\n    ...(focusable && { tabIndex: 0 }),\n  }\n\n  return (\n    <span\n      aria-disabled={disabled || undefined}\n      aria-keyshortcuts={removable ? 'Delete' : undefined}\n      data-slot=\"pill\"\n      data-style={hasLook ? (styleVariant ?? 'soft') : undefined}\n      data-accent-color={color ? accentByColor[color] : undefined}\n      {...interaction}\n      ref={ref}\n      className={cn(\n        'inline-flex h-7 items-center gap-1 rounded-full px-2.5 text-xs font-medium select-none',\n        'bg-(--spark-style-bg,var(--neutral-a3)) text-(--spark-style-fg,var(--spark-badge-fg,var(--neutral-a11)))',\n        'shadow-[inset_0_0_0_var(--spark-style-border-width,1px)_var(--spark-style-border,transparent)]',\n        focusable &&\n          'transition-colors focus-visible:ring-2 focus-visible:ring-offset-2 focus-visible:outline-hidden motion-reduce:transition-none',\n        clickable &&\n          'cursor-pointer hover:bg-(--spark-style-bg-hover,var(--neutral-a4))',\n        disabled && 'pointer-events-none opacity-50',\n        className,\n      )}\n      {...props}\n    >\n      {children}\n      {removable ? (\n        <>\n          {/* aria-hidden hides the glyph itself; this carries removeLabel into the pill's own accessible name */}\n          <span className=\"sr-only\">{removeLabel}</span>\n          <span\n            aria-hidden=\"true\"\n            data-slot=\"pill-remove\"\n            onClick={(event) => {\n              event.stopPropagation()\n              onRemove?.(event)\n            }}\n            className=\"-mr-1 inline-flex size-4 shrink-0 items-center justify-center rounded-full transition-colors hover:bg-(--spark-style-bg-hover,var(--neutral-a4)) motion-reduce:transition-none\"\n          >\n            <Close className=\"[--spark-icon-size:14px]\" />\n          </span>\n        </>\n      ) : null}\n    </span>\n  )\n})\n\nPill.displayName = 'Pill'\n\nexport { Pill }\nexport type { PillProps }\n"],"mappings":";;;;;;;;;;;;AA6BA,MAAM,OAAOA,QAAM,WAAuC,SAAS,KACjE,EACE,WACA,UACA,cACA,OACA,WAAW,OACX,SACA,UACA,aACA,WACA,GAAG,SAEL,KACA;CACA,MAAM,YAAY,CAAC,YAAY,YAAY,KAAA;CAC3C,MAAM,YAAY,CAAC,YAAY,aAAa,KAAA;CAC5C,MAAM,YAAY,aAAa;CAC/B,MAAM,UAAU,iBAAiB,KAAA,KAAa,UAAU,KAAA;CAExD,MAAM,iBAAiB,UAAgD;EACrE,YAAY,KAAK;EACjB,IAAI,cAAc,MAAM,QAAQ,WAAW,MAAM,QAAQ,MAAM;GAC7D,IAAI,MAAM,QAAQ,KAAK,MAAM,eAAe;GAC5C,UAAU,KAAK;EACjB;EACA,IAAI,cAAc,MAAM,QAAQ,YAAY,MAAM,QAAQ,cACxD,WAAW,KAAK;CAEpB;CAIA,MAAM,cAAc;EAClB,WAAW;EACX,GAAI,aAAa;GAAE,MAAM;GAAmB;EAAQ;EACpD,GAAI,aAAa,EAAE,UAAU,EAAE;CACjC;CAEA,OACE,qBAAC,QAAD;EACE,iBAAe,YAAY,KAAA;EAC3B,qBAAmB,YAAY,WAAW,KAAA;EAC1C,aAAU;EACV,cAAY,UAAW,gBAAgB,SAAU,KAAA;EACjD,qBAAmB,QAAQ,cAAc,SAAS,KAAA;EAClD,GAAI;EACC;EACL,WAAW,GACT,0FACA,4GACA,kGACA,aACE,iIACF,aACE,sEACF,YAAY,kCACZ,SACF;EACA,GAAI;YAnBN,CAqBG,UACA,YACC,qBAAA,UAAA,EAAA,UAAA,CAEE,oBAAC,QAAD;GAAM,WAAU;aAAW;EAAkB,CAAA,GAC7C,oBAAC,QAAD;GACE,eAAY;GACZ,aAAU;GACV,UAAU,UAAU;IAClB,MAAM,gBAAgB;IACtB,WAAW,KAAK;GAClB;GACA,WAAU;aAEV,oBAAC,OAAD,EAAO,WAAU,2BAA4B,CAAA;EACzC,CAAA,CACN,EAAA,CAAA,IACA,IACA;;AAEV,CAAC;AAED,KAAK,cAAc"}

package/dist/components/popover.cjs

@@ -7,7 +7,7 @@ let react_jsx_runtime = require("react/jsx-runtime");
 let _base_ui_react_merge_props = require("@base-ui/react/merge-props");
 let _base_ui_react_use_render = require("@base-ui/react/use-render");
 let _base_ui_react_popover = require("@base-ui/react/popover");
-let cnfast = require("cnfast");
+let cn = require("cn");
 //#region src/components/popover.tsx
 const PopoverAnchorContext = react.createContext(null);
 function Popover(props) {
@@ -56,7 +56,7 @@ function PopoverContent({ className, align = "center", sideOffset = 4, side, ali
 			sideOffset,
 			children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_base_ui_react_popover.Popover.Popup, {
 				"data-slot": "popover-content",
-				className: (0, cnfast.cn)("z-50 w-72 origin-(--transform-origin) rounded-lg border border-gray-a1 bg-gray-1 p-4 text-gray-a12 shadow-md outline-hidden transition-[opacity,scale,translate] duration-100 motion-reduce:transition-none", "data-starting-style:scale-95 data-starting-style:opacity-0", "data-[side=bottom]:data-starting-style:-translate-y-2 data-[side=left]:data-starting-style:translate-x-2 data-[side=right]:data-starting-style:-translate-x-2 data-[side=top]:data-starting-style:translate-y-2", "data-ending-style:scale-95 data-ending-style:opacity-0", className),
+				className: (0, cn.cn)("z-50 w-72 origin-(--transform-origin) rounded-lg border border-gray-a1 bg-gray-1 p-4 text-gray-a12 shadow-md outline-hidden transition-[opacity,scale,translate] duration-100 motion-reduce:transition-none", "data-starting-style:scale-95 data-starting-style:opacity-0", "data-[side=bottom]:data-starting-style:-translate-y-2 data-[side=left]:data-starting-style:translate-x-2 data-[side=right]:data-starting-style:-translate-x-2 data-[side=top]:data-starting-style:translate-y-2", "data-ending-style:scale-95 data-ending-style:opacity-0", className),
 				...props
 			})
 		})

package/dist/components/popover.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"popover.cjs","names":["React","PopoverPrimitive"],"sources":["../../src/components/popover.tsx"],"sourcesContent":["import { mergeProps } from '@base-ui/react/merge-props'\nimport { Popover as PopoverPrimitive } from '@base-ui/react/popover'\nimport { useRender } from '@base-ui/react/use-render'\nimport * as React from 'react'\nimport { cn } from '../utils/cn'\n\n// Base UI dropped the Anchor part; the anchor element registers itself here and\n// PopoverContent feeds it to the Positioner.\nconst PopoverAnchorContext = React.createContext<{\n  anchor: HTMLElement | null\n  setAnchor: (element: HTMLElement | null) => void\n} | null>(null)\n\nfunction Popover(props: React.ComponentProps<typeof PopoverPrimitive.Root>) {\n  const [anchor, setAnchor] = React.useState<HTMLElement | null>(null)\n  const value = React.useMemo(() => ({ anchor, setAnchor }), [anchor])\n  return (\n    <PopoverAnchorContext.Provider value={value}>\n      <PopoverPrimitive.Root {...props} />\n    </PopoverAnchorContext.Provider>\n  )\n}\n\nfunction PopoverTrigger(\n  props: React.ComponentProps<typeof PopoverPrimitive.Trigger>,\n) {\n  return <PopoverPrimitive.Trigger data-slot=\"popover-trigger\" {...props} />\n}\n\n// A Close part inside the popup is also what enables Base UI's focus trap for modal popovers.\nfunction PopoverClose(\n  props: React.ComponentProps<typeof PopoverPrimitive.Close>,\n) {\n  return <PopoverPrimitive.Close data-slot=\"popover-close\" {...props} />\n}\n\n/** Anchors the popover to this element instead of the trigger. Pass `render` to\n * wrap an existing element (was radix `asChild`). */\nfunction PopoverAnchor({ render, ...props }: useRender.ComponentProps<'div'>) {\n  const context = React.useContext(PopoverAnchorContext)\n  return useRender({\n    defaultTagName: 'div',\n    render,\n    ref: context?.setAnchor,\n    props: mergeProps<'div'>(\n      { 'data-slot': 'popover-anchor' } as React.ComponentProps<'div'>,\n      props,\n    ),\n  })\n}\n\ntype PopoverContentProps = React.ComponentProps<typeof PopoverPrimitive.Popup> &\n  Pick<\n    PopoverPrimitive.Positioner.Props,\n    'align' | 'alignOffset' | 'side' | 'sideOffset' | 'anchor'\n  > &\n  Pick<PopoverPrimitive.Portal.Props, 'container'>\n\nfunction PopoverContent({\n  className,\n  align = 'center',\n  sideOffset = 4,\n  side,\n  alignOffset,\n  anchor,\n  container,\n  ...props\n}: PopoverContentProps) {\n  const context = React.useContext(PopoverAnchorContext)\n  return (\n    <PopoverPrimitive.Portal container={container}>\n      <PopoverPrimitive.Positioner\n        align={align}\n        alignOffset={alignOffset}\n        anchor={anchor ?? context?.anchor ?? undefined}\n        className=\"isolate z-50\"\n        side={side}\n        sideOffset={sideOffset}\n      >\n        <PopoverPrimitive.Popup\n          data-slot=\"popover-content\"\n          className={cn(\n            'z-50 w-72 origin-(--transform-origin) rounded-lg border border-gray-a1 bg-gray-1 p-4 text-gray-a12 shadow-md outline-hidden transition-[opacity,scale,translate] duration-100 motion-reduce:transition-none',\n            // enter: fade + zoom + a slight per-side slide (was animate-in)\n            'data-starting-style:scale-95 data-starting-style:opacity-0',\n            'data-[side=bottom]:data-starting-style:-translate-y-2 data-[side=left]:data-starting-style:translate-x-2 data-[side=right]:data-starting-style:-translate-x-2 data-[side=top]:data-starting-style:translate-y-2',\n            // exit: fade + zoom (was animate-out)\n            'data-ending-style:scale-95 data-ending-style:opacity-0',\n            className,\n          )}\n          {...props}\n        />\n      </PopoverPrimitive.Positioner>\n    </PopoverPrimitive.Portal>\n  )\n}\n\nexport { Popover, PopoverAnchor, PopoverClose, PopoverContent, PopoverTrigger }\n"],"mappings":";;;;;;;;;;;AAQA,MAAM,uBAAuBA,MAAM,cAGzB,IAAI;AAEd,SAAS,QAAQ,OAA2D;CAC1E,MAAM,CAAC,QAAQ,aAAaA,MAAM,SAA6B,IAAI;CACnE,MAAM,QAAQA,MAAM,eAAe;EAAE;EAAQ;CAAU,IAAI,CAAC,MAAM,CAAC;CACnE,OACE,iBAAA,GAAA,kBAAA,KAAC,qBAAqB,UAAtB;EAAsC;YACpC,iBAAA,GAAA,kBAAA,KAACC,uBAAAA,QAAiB,MAAlB,EAAuB,GAAI,MAAQ,CAAA;CACN,CAAA;AAEnC;AAEA,SAAS,eACP,OACA;CACA,OAAO,iBAAA,GAAA,kBAAA,KAACA,uBAAAA,QAAiB,SAAlB;EAA0B,aAAU;EAAkB,GAAI;CAAQ,CAAA;AAC3E;AAGA,SAAS,aACP,OACA;CACA,OAAO,iBAAA,GAAA,kBAAA,KAACA,uBAAAA,QAAiB,OAAlB;EAAwB,aAAU;EAAgB,GAAI;CAAQ,CAAA;AACvE;;;AAIA,SAAS,cAAc,EAAE,QAAQ,GAAG,SAA0C;CAE5E,QAAA,GAAA,0BAAA,WAAiB;EACf,gBAAgB;EAChB;EACA,KAJcD,MAAM,WAAW,oBAIpB,GAAG;EACd,QAAA,GAAA,2BAAA,YACE,EAAE,aAAa,iBAAiB,GAChC,KACF;CACF,CAAC;AACH;AASA,SAAS,eAAe,EACtB,WACA,QAAQ,UACR,aAAa,GACb,MACA,aACA,QACA,WACA,GAAG,SACmB;CACtB,MAAM,UAAUA,MAAM,WAAW,oBAAoB;CACrD,OACE,iBAAA,GAAA,kBAAA,KAACC,uBAAAA,QAAiB,QAAlB;EAAoC;YAClC,iBAAA,GAAA,kBAAA,KAACA,uBAAAA,QAAiB,YAAlB;GACS;GACM;GACb,QAAQ,UAAU,SAAS,UAAU,KAAA;GACrC,WAAU;GACJ;GACM;aAEZ,iBAAA,GAAA,kBAAA,KAACA,uBAAAA,QAAiB,OAAlB;IACE,aAAU;IACV,YAAA,GAAA,OAAA,IACE,+MAEA,8DACA,mNAEA,0DACA,SACF;IACA,GAAI;GACL,CAAA;EAC0B,CAAA;CACN,CAAA;AAE7B"}
+{"version":3,"file":"popover.cjs","names":["React","PopoverPrimitive"],"sources":["../../src/components/popover.tsx"],"sourcesContent":["import { mergeProps } from '@base-ui/react/merge-props'\nimport { Popover as PopoverPrimitive } from '@base-ui/react/popover'\nimport { useRender } from '@base-ui/react/use-render'\nimport * as React from 'react'\nimport { cn } from '../utils/cn'\n\n// Base UI dropped the Anchor part; the anchor element registers itself here and\n// PopoverContent feeds it to the Positioner.\nconst PopoverAnchorContext = React.createContext<{\n  anchor: HTMLElement | null\n  setAnchor: (element: HTMLElement | null) => void\n} | null>(null)\n\nfunction Popover(props: React.ComponentProps<typeof PopoverPrimitive.Root>) {\n  const [anchor, setAnchor] = React.useState<HTMLElement | null>(null)\n  const value = React.useMemo(() => ({ anchor, setAnchor }), [anchor])\n  return (\n    <PopoverAnchorContext.Provider value={value}>\n      <PopoverPrimitive.Root {...props} />\n    </PopoverAnchorContext.Provider>\n  )\n}\n\nfunction PopoverTrigger(\n  props: React.ComponentProps<typeof PopoverPrimitive.Trigger>,\n) {\n  return <PopoverPrimitive.Trigger data-slot=\"popover-trigger\" {...props} />\n}\n\n// A Close part inside the popup is also what enables Base UI's focus trap for modal popovers.\nfunction PopoverClose(\n  props: React.ComponentProps<typeof PopoverPrimitive.Close>,\n) {\n  return <PopoverPrimitive.Close data-slot=\"popover-close\" {...props} />\n}\n\n/** Anchors the popover to this element instead of the trigger. Pass `render` to\n * wrap an existing element (was radix `asChild`). */\nfunction PopoverAnchor({ render, ...props }: useRender.ComponentProps<'div'>) {\n  const context = React.useContext(PopoverAnchorContext)\n  return useRender({\n    defaultTagName: 'div',\n    render,\n    ref: context?.setAnchor,\n    props: mergeProps<'div'>(\n      { 'data-slot': 'popover-anchor' } as React.ComponentProps<'div'>,\n      props,\n    ),\n  })\n}\n\ntype PopoverContentProps = React.ComponentProps<typeof PopoverPrimitive.Popup> &\n  Pick<\n    PopoverPrimitive.Positioner.Props,\n    'align' | 'alignOffset' | 'side' | 'sideOffset' | 'anchor'\n  > &\n  Pick<PopoverPrimitive.Portal.Props, 'container'>\n\nfunction PopoverContent({\n  className,\n  align = 'center',\n  sideOffset = 4,\n  side,\n  alignOffset,\n  anchor,\n  container,\n  ...props\n}: PopoverContentProps) {\n  const context = React.useContext(PopoverAnchorContext)\n  return (\n    <PopoverPrimitive.Portal container={container}>\n      <PopoverPrimitive.Positioner\n        align={align}\n        alignOffset={alignOffset}\n        anchor={anchor ?? context?.anchor ?? undefined}\n        className=\"isolate z-50\"\n        side={side}\n        sideOffset={sideOffset}\n      >\n        <PopoverPrimitive.Popup\n          data-slot=\"popover-content\"\n          className={cn(\n            'z-50 w-72 origin-(--transform-origin) rounded-lg border border-gray-a1 bg-gray-1 p-4 text-gray-a12 shadow-md outline-hidden transition-[opacity,scale,translate] duration-100 motion-reduce:transition-none',\n            // enter: fade + zoom + a slight per-side slide (was animate-in)\n            'data-starting-style:scale-95 data-starting-style:opacity-0',\n            'data-[side=bottom]:data-starting-style:-translate-y-2 data-[side=left]:data-starting-style:translate-x-2 data-[side=right]:data-starting-style:-translate-x-2 data-[side=top]:data-starting-style:translate-y-2',\n            // exit: fade + zoom (was animate-out)\n            'data-ending-style:scale-95 data-ending-style:opacity-0',\n            className,\n          )}\n          {...props}\n        />\n      </PopoverPrimitive.Positioner>\n    </PopoverPrimitive.Portal>\n  )\n}\n\nexport { Popover, PopoverAnchor, PopoverClose, PopoverContent, PopoverTrigger }\n"],"mappings":";;;;;;;;;;;AAQA,MAAM,uBAAuBA,MAAM,cAGzB,IAAI;AAEd,SAAS,QAAQ,OAA2D;CAC1E,MAAM,CAAC,QAAQ,aAAaA,MAAM,SAA6B,IAAI;CACnE,MAAM,QAAQA,MAAM,eAAe;EAAE;EAAQ;CAAU,IAAI,CAAC,MAAM,CAAC;CACnE,OACE,iBAAA,GAAA,kBAAA,KAAC,qBAAqB,UAAtB;EAAsC;YACpC,iBAAA,GAAA,kBAAA,KAACC,uBAAAA,QAAiB,MAAlB,EAAuB,GAAI,MAAQ,CAAA;CACN,CAAA;AAEnC;AAEA,SAAS,eACP,OACA;CACA,OAAO,iBAAA,GAAA,kBAAA,KAACA,uBAAAA,QAAiB,SAAlB;EAA0B,aAAU;EAAkB,GAAI;CAAQ,CAAA;AAC3E;AAGA,SAAS,aACP,OACA;CACA,OAAO,iBAAA,GAAA,kBAAA,KAACA,uBAAAA,QAAiB,OAAlB;EAAwB,aAAU;EAAgB,GAAI;CAAQ,CAAA;AACvE;;;AAIA,SAAS,cAAc,EAAE,QAAQ,GAAG,SAA0C;CAE5E,QAAA,GAAA,0BAAA,WAAiB;EACf,gBAAgB;EAChB;EACA,KAJcD,MAAM,WAAW,oBAIpB,GAAG;EACd,QAAA,GAAA,2BAAA,YACE,EAAE,aAAa,iBAAiB,GAChC,KACF;CACF,CAAC;AACH;AASA,SAAS,eAAe,EACtB,WACA,QAAQ,UACR,aAAa,GACb,MACA,aACA,QACA,WACA,GAAG,SACmB;CACtB,MAAM,UAAUA,MAAM,WAAW,oBAAoB;CACrD,OACE,iBAAA,GAAA,kBAAA,KAACC,uBAAAA,QAAiB,QAAlB;EAAoC;YAClC,iBAAA,GAAA,kBAAA,KAACA,uBAAAA,QAAiB,YAAlB;GACS;GACM;GACb,QAAQ,UAAU,SAAS,UAAU,KAAA;GACrC,WAAU;GACJ;GACM;aAEZ,iBAAA,GAAA,kBAAA,KAACA,uBAAAA,QAAiB,OAAlB;IACE,aAAU;IACV,YAAA,GAAA,GAAA,IACE,+MAEA,8DACA,mNAEA,0DACA,SACF;IACA,GAAI;GACL,CAAA;EAC0B,CAAA;CACN,CAAA;AAE7B"}

package/dist/components/power-history-chart.cjs

@@ -6,10 +6,10 @@ const require_hooks_use_reduced_motion = require("../hooks/use-reduced-motion.cj
 require("../utils/chars.cjs");
 const require_utils_format = require("../utils/format.cjs");
 const require_utils_chart_scale = require("../utils/chart-scale.cjs");
+const require_utils_chart_time_ticks = require("../utils/chart-time-ticks.cjs");
 const require_components_chart = require("./chart.cjs");
 const require_components_series_legend = require("./series-legend.cjs");
 const require_components_typography = require("./typography.cjs");
-const require_utils_chart_time_ticks = require("../utils/chart-time-ticks.cjs");
 let react = require("react");
 react = require_chunk.__toESM(react);
 let react_jsx_runtime = require("react/jsx-runtime");
@@ -19,7 +19,7 @@ let _visx_shape = require("@visx/shape");
 let _visx_curve = require("@visx/curve");
 let _visx_tooltip = require("@visx/tooltip");
 let _visx_vendor_d3_array = require("@visx/vendor/d3-array");
-let cnfast = require("cnfast");
+let cn = require("cn");
 //#region src/components/power-history-chart.tsx
 const AREA_KEYS = [
 	"solar",
@@ -207,7 +207,7 @@ function PowerHistoryChart({ data, unit, formatX, formatTooltipX, formatValue, l
 		placement: "beside"
 	});
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
-		className: (0, cnfast.cn)("flex w-full flex-col gap-2", className),
+		className: (0, cn.cn)("flex w-full flex-col gap-2", className),
 		children: [
 			title && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_components_typography.SectionTitle, { children: title }),
 			/* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_components_series_legend.SeriesLegend, {

package/dist/components/power-history-chart.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"power-history-chart.cjs","names":["React","useReducedMotion","valueFormat","useChartZoom","buildYAxisScale","useAnimatedChartDomain","measureYAxisGutter","formatYAxisTick","buildTimeTicks","useMeasuredSize","clampTooltipPosition","SectionTitle","SeriesLegend","Area","curveMonotoneX","LinePath","ChartZoomResetButton","ChartTooltipCard"],"sources":["../../src/components/power-history-chart.tsx"],"sourcesContent":["import { curveMonotoneX } from '@visx/curve'\nimport { localPoint } from '@visx/event'\nimport { scaleLinear } from '@visx/scale'\nimport { Area, LinePath } from '@visx/shape'\nimport { useTooltip } from '@visx/tooltip'\nimport { bisector } from '@visx/vendor/d3-array'\nimport * as React from 'react'\nimport { useCallback, useEffect, useMemo, useRef, useState } from 'react'\nimport { useAnimatedChartDomain, useChartZoom } from '../hooks/use-chart-zoom'\nimport { useReducedMotion } from '../hooks/use-reduced-motion'\nimport { NARROW_NBSP } from '../utils/chars'\nimport {\n  buildYAxisScale,\n  formatYAxisTick,\n  measureYAxisGutter,\n} from '../utils/chart-scale'\nimport { buildTimeTicks } from '../utils/chart-time-ticks'\nimport type { TimeDomain } from '../utils/chart-zoom'\nimport { cn } from '../utils/cn'\nimport { twoDecimalFormat as valueFormat } from '../utils/format'\nimport {\n  ChartTooltipCard,\n  type ChartTooltipRow,\n  ChartZoomResetButton,\n  clampTooltipPosition,\n  useMeasuredSize,\n} from './chart'\nimport { SeriesLegend, type SeriesLegendItem } from './series-legend'\nimport { SectionTitle } from './typography'\n\nexport interface PowerHistoryPoint {\n  /** Epoch milliseconds. */\n  t: number\n  solar: number\n  /** Signed: positive = import, negative = feed-in. */\n  grid: number\n  /** Signed: positive = discharge, negative = charge. */\n  battery: number\n  consumption: number\n}\n\nexport interface PowerHistoryChartProps {\n  data: PowerHistoryPoint[]\n  /** Axis/tooltip unit, e.g. \"kW\". */\n  unit: string\n  formatX: (t: number) => string\n  /** Tooltip time formatter. Defaults to `formatX`; use to keep the tooltip's\n   * full clock time when the axis ticks are compact (hour-only). */\n  formatTooltipX?: (t: number) => string\n  formatValue?: (value: number) => string\n  labels: {\n    solar: string\n    grid: string\n    battery: string\n    consumption: string\n  }\n  /** Series to drop entirely (no legend entry, area, or tooltip row). */\n  omitSeries?: readonly PowerHistorySeriesKey[]\n  /** Epoch ms to mark with the current-time dashed line (omit to hide). */\n  highlightAt?: number\n  title?: string\n  className?: string\n  height?: number\n  zoomable?: boolean\n  zoomResetLabel?: string\n  zoomDomain?: TimeDomain | null\n  onZoomDomainChange?: (domain: TimeDomain | null) => void\n}\n\nconst AREA_KEYS = ['solar', 'grid', 'battery'] as const\n\n// All toggleable series, in legend order. The areas (solar/grid/battery) plus\n// the consumption overlay line.\nconst SERIES_KEYS = ['solar', 'grid', 'battery', 'consumption'] as const\nexport type PowerHistorySeriesKey = (typeof SERIES_KEYS)[number]\ntype SeriesKey = PowerHistorySeriesKey\n\nconst SERIES_COLORS = {\n  solar: 'var(--orange-a9)',\n  grid: 'var(--blue-9)',\n  battery: 'var(--green-a9)',\n  consumption: 'var(--neutral-12)',\n} as const\n\nconst PADDING_TOP = 20\nconst PADDING_BOTTOM = 28\nconst PADDING_RIGHT = 8\nconst X_TICK_COUNT = 6\nconst DEFAULT_HEIGHT = 260\nconst DETAILED_X_AXIS_THRESHOLD = 6 * 60 * 60 * 1000\n\nconst tBisector = bisector<PowerHistoryPoint, number>((d) => d.t)\n\nfunction touchDistance(a: React.Touch, b: React.Touch): number {\n  return Math.hypot(a.clientX - b.clientX, a.clientY - b.clientY)\n}\n\nfunction touchMidpoint(\n  a: React.Touch,\n  b: React.Touch,\n): {\n  clientX: number\n  clientY: number\n} {\n  return {\n    clientX: (a.clientX + b.clientX) / 2,\n    clientY: (a.clientY + b.clientY) / 2,\n  }\n}\n\n/**\n * Diverging \"power sources\" area chart over a continuous time axis: solar\n * (orange), grid (blue) and battery (green) areas around a zero baseline, with\n * consumption overlaid as a line. Negative values (grid feed-in, battery\n * charging) dip below zero. For instantaneous power (day view). A legend at the\n * top toggles each series on/off; the y-axis rescales to the visible ones. visx.\n */\nexport function PowerHistoryChart({\n  data,\n  unit,\n  formatX,\n  formatTooltipX,\n  formatValue,\n  labels,\n  omitSeries,\n  highlightAt,\n  title,\n  className,\n  height = DEFAULT_HEIGHT,\n  zoomable = false,\n  zoomResetLabel,\n  zoomDomain,\n  onZoomDomainChange,\n}: PowerHistoryChartProps) {\n  const plotClipId = React.useId()\n  const fmtTooltipX = formatTooltipX ?? formatX\n  const containerRef = useRef<HTMLDivElement>(null)\n  const reducedMotion = useReducedMotion()\n  const [width, setWidth] = useState(0)\n  const [hiddenSeries, setHiddenSeries] = useState<ReadonlySet<string>>(\n    () => new Set(),\n  )\n  const omitted = useMemo(() => new Set<SeriesKey>(omitSeries), [omitSeries])\n\n  const toggleSeries = useCallback((id: string) => {\n    setHiddenSeries((prev) => {\n      const next = new Set(prev)\n      if (next.has(id)) {\n        next.delete(id)\n      } else {\n        next.add(id)\n      }\n      return next\n    })\n  }, [])\n\n  const isHidden = useCallback(\n    (key: SeriesKey) => omitted.has(key) || hiddenSeries.has(key),\n    [hiddenSeries, omitted],\n  )\n\n  const {\n    showTooltip,\n    hideTooltip,\n    tooltipData,\n    tooltipLeft,\n    tooltipTop,\n    tooltipOpen,\n  } = useTooltip<PowerHistoryPoint>()\n\n  useEffect(() => {\n    const element = containerRef.current\n    if (!element) return\n\n    const resizeObserver = new ResizeObserver((entries) => {\n      const entry = entries[0]\n      if (!entry) return\n      setWidth(entry.contentRect.width)\n    })\n\n    resizeObserver.observe(element)\n    return () => resizeObserver.disconnect()\n  }, [])\n\n  const fmtValue = (value: number) =>\n    formatValue\n      ? formatValue(value)\n      : `${valueFormat.format(value)}${NARROW_NBSP}${unit}`\n\n  const tMin = data.length ? (data[0]?.t ?? 0) : 0\n  const tMax = data.length ? (data[data.length - 1]?.t ?? 0) : 0\n  const fullDomain = useMemo((): TimeDomain | null => {\n    if (data.length === 0) return null\n    return [tMin, tMax]\n  }, [data.length, tMin, tMax])\n\n  const zoom = useChartZoom({\n    enabled: zoomable,\n    fullDomain,\n    zoomDomain,\n    onZoomDomainChange,\n  })\n\n  const viewMin = zoom.zoomWindow?.[0] ?? tMin\n  const viewMax = zoom.zoomWindow?.[1] ?? tMax\n\n  const visibleData = useMemo(\n    () => data.filter((d) => d.t >= viewMin && d.t <= viewMax),\n    [data, viewMin, viewMax],\n  )\n\n  const { yMin, yMax } = useMemo(() => {\n    let min = 0\n    let max = 0\n    for (const d of visibleData) {\n      if (!isHidden('solar')) max = Math.max(max, d.solar)\n      if (!isHidden('consumption')) max = Math.max(max, d.consumption)\n      if (!isHidden('grid')) {\n        max = Math.max(max, d.grid)\n        min = Math.min(min, d.grid)\n      }\n      if (!isHidden('battery')) {\n        max = Math.max(max, d.battery)\n        min = Math.min(min, d.battery)\n      }\n    }\n    return { yMin: min, yMax: max }\n  }, [visibleData, isHidden])\n\n  const {\n    ticks: yTicks,\n    min: lo,\n    max: hi,\n  } = useMemo(() => buildYAxisScale(yMin, yMax), [yMin, yMax])\n  const displayedYDomain = useAnimatedChartDomain([lo, hi], {\n    animateChanges: zoom.isPinching,\n    reducedMotion,\n  })\n\n  const gutter = useMemo(\n    () => measureYAxisGutter(yTicks, formatYAxisTick),\n    [yTicks],\n  )\n\n  const plotRight = Math.max(gutter, width - PADDING_RIGHT)\n\n  const xScale = useMemo(\n    () =>\n      scaleLinear<number>({\n        domain: [viewMin, viewMax === viewMin ? viewMin + 1 : viewMax],\n        range: [gutter, plotRight],\n      }),\n    [viewMin, viewMax, plotRight, gutter],\n  )\n\n  const plotHeight = Math.max(0, height - PADDING_BOTTOM - PADDING_TOP)\n  const plotWidth = Math.max(0, plotRight - gutter)\n\n  const yScale = useMemo(\n    () =>\n      scaleLinear<number>({\n        domain: [\n          displayedYDomain[0],\n          displayedYDomain[1] === displayedYDomain[0]\n            ? displayedYDomain[0] + 1\n            : displayedYDomain[1],\n        ],\n        range: [height - PADDING_BOTTOM, PADDING_TOP],\n      }),\n    [displayedYDomain, height],\n  )\n\n  const xTicks = useMemo(\n    () => buildTimeTicks(viewMin, viewMax, X_TICK_COUNT),\n    [viewMin, viewMax],\n  )\n  const formatAxisX =\n    zoom.isZoomed && viewMax - viewMin <= DETAILED_X_AXIS_THRESHOLD\n      ? fmtTooltipX\n      : formatX\n\n  const domainXFromEvent = useCallback(\n    (\n      event:\n        | React.MouseEvent<SVGRectElement>\n        | React.PointerEvent<SVGRectElement>\n        | React.TouchEvent<SVGRectElement>,\n    ) => {\n      const point = localPoint(event)\n      if (!point) return null\n      return xScale.invert(point.x)\n    },\n    [xScale],\n  )\n\n  const handleTooltip = useCallback(\n    (\n      event:\n        | React.TouchEvent<SVGRectElement>\n        | React.MouseEvent<SVGRectElement>,\n    ) => {\n      if (zoom.isBrushing || zoom.isPanning) return\n      const point = localPoint(event)\n      if (!point || data.length === 0) return\n\n      const xMs = xScale.invert(point.x)\n      const index = tBisector.left(data, xMs, 1)\n      const d0 = data[index - 1]\n      const d1 = data[index]\n      if (!d0) return\n\n      const d = d1 && xMs - d0.t > d1.t - xMs ? d1 : d0\n      showTooltip({\n        tooltipData: d,\n        tooltipLeft: xScale(d.t),\n        tooltipTop: PADDING_TOP,\n      })\n    },\n    [data, showTooltip, xScale, zoom.isBrushing, zoom.isPanning],\n  )\n\n  const legendItems: SeriesLegendItem[] = SERIES_KEYS.filter(\n    (key) => !omitted.has(key),\n  ).map((key) => ({\n    id: key,\n    label: labels[key],\n    color: SERIES_COLORS[key],\n  }))\n\n  const tooltipRows: ChartTooltipRow[] = tooltipData\n    ? SERIES_KEYS.filter((key) => !isHidden(key)).map((key) => ({\n        key,\n        label: labels[key],\n        color: SERIES_COLORS[key],\n        value: fmtValue(tooltipData[key]),\n      }))\n    : []\n\n  const showHighlight =\n    highlightAt !== undefined &&\n    highlightAt >= viewMin &&\n    highlightAt <= viewMax\n\n  const [tooltipRef, tooltipSize] = useMeasuredSize<HTMLDivElement>()\n  const tooltipPos = clampTooltipPosition({\n    anchorX: tooltipLeft ?? 0,\n    anchorY: tooltipTop ?? PADDING_TOP,\n    width,\n    height,\n    tipWidth: tooltipSize.width,\n    tipHeight: tooltipSize.height,\n    placement: 'beside',\n  })\n\n  return (\n    <div className={cn('flex w-full flex-col gap-2', className)}>\n      {title && <SectionTitle>{title}</SectionTitle>}\n      <SeriesLegend\n        items={legendItems}\n        hiddenIds={hiddenSeries}\n        onToggle={toggleSeries}\n      />\n      <span className=\"px-1 text-xs text-gray-light\">{unit}</span>\n      <div ref={containerRef} className=\"relative w-full\" style={{ height }}>\n        {width > 0 && (\n          <svg width={width} height={height}>\n            <defs>\n              {AREA_KEYS.map((key) => (\n                <linearGradient\n                  key={key}\n                  id={`power-history-fill-${key}`}\n                  x1=\"0\"\n                  y1=\"0\"\n                  x2=\"0\"\n                  y2=\"1\"\n                >\n                  <stop\n                    offset=\"0%\"\n                    stopColor={SERIES_COLORS[key]}\n                    stopOpacity={0.35}\n                  />\n                  <stop\n                    offset=\"100%\"\n                    stopColor={SERIES_COLORS[key]}\n                    stopOpacity={0.04}\n                  />\n                </linearGradient>\n              ))}\n              <clipPath id={plotClipId}>\n                <rect\n                  height={plotHeight}\n                  width={plotWidth}\n                  x={gutter}\n                  y={PADDING_TOP}\n                />\n              </clipPath>\n            </defs>\n\n            {yTicks.map((tick) => {\n              const y = yScale(tick)\n              return (\n                <g key={`y-tick-${tick}`}>\n                  <line\n                    x1={gutter}\n                    x2={plotRight}\n                    y1={y}\n                    y2={y}\n                    stroke=\"var(--neutral-a4)\"\n                    strokeWidth={1}\n                  />\n                  <text\n                    x={gutter - 7}\n                    y={y + 3}\n                    textAnchor=\"end\"\n                    fill=\"var(--neutral-a11)\"\n                    fontSize={10}\n                  >\n                    {formatYAxisTick(tick)}\n                  </text>\n                </g>\n              )\n            })}\n\n            <g clipPath={`url(#${plotClipId})`} data-testid=\"chart-plot-clip\">\n              {AREA_KEYS.filter((key) => !isHidden(key)).map((key) => (\n                <Area<PowerHistoryPoint>\n                  key={`area-${key}`}\n                  data={data}\n                  x={(d) => xScale(d.t)}\n                  y0={yScale(0)}\n                  y1={(d) => yScale(d[key])}\n                  curve={curveMonotoneX}\n                  fill={`url(#power-history-fill-${key})`}\n                  stroke=\"transparent\"\n                />\n              ))}\n\n              {AREA_KEYS.filter((key) => !isHidden(key)).map((key) => (\n                <LinePath<PowerHistoryPoint>\n                  key={`line-${key}`}\n                  data={data}\n                  x={(d) => xScale(d.t)}\n                  y={(d) => yScale(d[key])}\n                  curve={curveMonotoneX}\n                  stroke={SERIES_COLORS[key]}\n                  strokeWidth={1.5}\n                  fill=\"none\"\n                />\n              ))}\n\n              {!isHidden('consumption') && (\n                <LinePath<PowerHistoryPoint>\n                  data={data}\n                  x={(d) => xScale(d.t)}\n                  y={(d) => yScale(d.consumption)}\n                  curve={curveMonotoneX}\n                  stroke={SERIES_COLORS.consumption}\n                  strokeWidth={1.5}\n                  fill=\"none\"\n                />\n              )}\n            </g>\n\n            <line\n              x1={gutter}\n              x2={plotRight}\n              y1={yScale(0)}\n              y2={yScale(0)}\n              stroke=\"var(--neutral-a6)\"\n              strokeWidth={1}\n            />\n\n            {showHighlight && (\n              <line\n                x1={xScale(highlightAt)}\n                x2={xScale(highlightAt)}\n                y1={PADDING_TOP}\n                y2={height - PADDING_BOTTOM}\n                stroke=\"var(--spark-a9)\"\n                strokeWidth={1.5}\n                strokeDasharray=\"5 4\"\n                pointerEvents=\"none\"\n              />\n            )}\n\n            {xTicks.map((tick, index) => (\n              <text\n                key={`x-tick-${tick}`}\n                x={xScale(tick)}\n                y={height - PADDING_BOTTOM + 16}\n                textAnchor={\n                  index === 0\n                    ? 'start'\n                    : index === xTicks.length - 1\n                      ? 'end'\n                      : 'middle'\n                }\n                fill=\"var(--neutral-a11)\"\n                fontSize={10}\n              >\n                {formatAxisX(tick)}\n              </text>\n            ))}\n\n            {tooltipOpen &&\n              tooltipData &&\n              !zoom.isBrushing &&\n              !zoom.isPanning && (\n                <>\n                  <line\n                    x1={xScale(tooltipData.t)}\n                    x2={xScale(tooltipData.t)}\n                    y1={PADDING_TOP}\n                    y2={height - PADDING_BOTTOM}\n                    stroke=\"var(--neutral-a6)\"\n                    strokeDasharray=\"4 4\"\n                    pointerEvents=\"none\"\n                  />\n                  {AREA_KEYS.filter((key) => !isHidden(key)).map((key) => (\n                    <circle\n                      key={`dot-${key}`}\n                      cx={xScale(tooltipData.t)}\n                      cy={yScale(tooltipData[key])}\n                      r={3.5}\n                      fill={SERIES_COLORS[key]}\n                      stroke=\"white\"\n                      strokeWidth={1.5}\n                      pointerEvents=\"none\"\n                    />\n                  ))}\n                  {!isHidden('consumption') && (\n                    <circle\n                      cx={xScale(tooltipData.t)}\n                      cy={yScale(tooltipData.consumption)}\n                      r={3.5}\n                      fill={SERIES_COLORS.consumption}\n                      stroke=\"white\"\n                      strokeWidth={1.5}\n                      pointerEvents=\"none\"\n                    />\n                  )}\n                </>\n              )}\n\n            {zoom.brushBand && (\n              <rect\n                data-testid=\"chart-brush-band\"\n                x={Math.min(\n                  xScale(zoom.brushBand[0]),\n                  xScale(zoom.brushBand[1]),\n                )}\n                y={PADDING_TOP}\n                width={Math.abs(\n                  xScale(zoom.brushBand[1]) - xScale(zoom.brushBand[0]),\n                )}\n                height={plotHeight}\n                fill=\"var(--spark-a4)\"\n                pointerEvents=\"none\"\n              />\n            )}\n\n            <rect\n              x={gutter}\n              y={PADDING_TOP}\n              width={plotWidth}\n              height={plotHeight}\n              fill=\"transparent\"\n              style={zoomable ? { touchAction: 'pan-y' } : undefined}\n              onMouseLeave={() => {\n                if (!zoom.isBrushing) hideTooltip()\n              }}\n              onMouseMove={(event) => {\n                if (zoom.isBrushing) {\n                  const domainX = domainXFromEvent(event)\n                  if (domainX != null) zoom.onPointerMove(domainX)\n                  return\n                }\n                handleTooltip(event)\n              }}\n              onPointerDown={(event) => {\n                if (!zoomable || event.pointerType === 'touch') return\n                if (event.button !== 0) return\n                const domainX = domainXFromEvent(event)\n                if (domainX == null) return\n                event.currentTarget.setPointerCapture?.(event.pointerId)\n                hideTooltip()\n                zoom.onPointerDown(domainX)\n              }}\n              onPointerMove={(event) => {\n                if (!zoomable) return\n                const domainX = domainXFromEvent(event)\n                if (domainX != null) zoom.onPointerMove(domainX)\n              }}\n              onPointerUp={(event) => {\n                if (!zoomable) return\n                const domainX = domainXFromEvent(event)\n                if (domainX != null) zoom.onPointerUp(domainX)\n                else zoom.onPointerCancel()\n              }}\n              onPointerCancel={() => {\n                zoom.onPointerCancel()\n              }}\n              onDoubleClick={() => {\n                if (zoomable) zoom.onDoubleClick()\n              }}\n              onTouchStart={(event) => {\n                if (!zoomable) return\n                if (event.touches.length === 2) {\n                  const [a, b] = [event.touches[0], event.touches[1]]\n                  if (!a || !b) return\n                  const point = localPoint(\n                    event.currentTarget,\n                    touchMidpoint(a, b) as MouseEvent,\n                  )\n                  if (!point) return\n                  const midpoint = Math.min(\n                    1,\n                    Math.max(0, (point.x - gutter) / plotWidth),\n                  )\n                  zoom.onPinchStart(touchDistance(a, b), midpoint)\n                  hideTooltip()\n                  return\n                }\n                if (event.touches.length === 1 && zoom.isZoomed) {\n                  const point = localPoint(event)\n                  if (!point) return\n                  zoom.onPanStart({\n                    x: (point.x - gutter) / plotWidth,\n                    y: (point.y - PADDING_TOP) / plotHeight,\n                  })\n                  hideTooltip()\n                }\n              }}\n              onTouchMove={(event) => {\n                if (zoomable && event.touches.length === 2) {\n                  const [a, b] = [event.touches[0], event.touches[1]]\n                  if (!a || !b) return\n                  const point = localPoint(\n                    event.currentTarget,\n                    touchMidpoint(a, b) as MouseEvent,\n                  )\n                  if (!point) return\n                  const midpoint = Math.min(\n                    1,\n                    Math.max(0, (point.x - gutter) / plotWidth),\n                  )\n                  zoom.onPinchMove(touchDistance(a, b), midpoint)\n                  return\n                }\n                if (event.touches.length === 1 && zoom.isZoomed) {\n                  const point = localPoint(event)\n                  if (!point) return\n                  zoom.onPanMove({\n                    x: (point.x - gutter) / plotWidth,\n                    y: (point.y - PADDING_TOP) / plotHeight,\n                  })\n                  return\n                }\n                if (event.touches.length === 1) handleTooltip(event)\n              }}\n              onTouchEnd={(event) => {\n                if (zoomable && event.touches.length < 2) zoom.onPinchEnd()\n                if (event.touches.length === 0) {\n                  if (zoomable) zoom.onPanEnd()\n                  if (zoomable) zoom.onTap()\n                  hideTooltip()\n                }\n              }}\n              onTouchCancel={() => {\n                zoom.onPinchEnd()\n                zoom.onPanEnd()\n              }}\n            />\n          </svg>\n        )}\n\n        {zoom.isZoomed && zoomResetLabel && (\n          <ChartZoomResetButton\n            label={zoomResetLabel}\n            onReset={zoom.resetZoom}\n          />\n        )}\n\n        <div\n          ref={tooltipRef}\n          className=\"pointer-events-none absolute z-10\"\n          style={{\n            left: tooltipPos.left,\n            top: tooltipPos.top,\n            opacity:\n              tooltipOpen && tooltipData && !zoom.isPanning && !zoom.isBrushing\n                ? 1\n                : 0,\n            transition: reducedMotion\n              ? 'opacity 140ms ease-out'\n              : 'left 140ms ease-out, top 140ms ease-out, opacity 140ms ease-out',\n          }}\n        >\n          {tooltipData && (\n            <ChartTooltipCard\n              label={fmtTooltipX(tooltipData.t)}\n              rows={tooltipRows}\n            />\n          )}\n        </div>\n      </div>\n    </div>\n  )\n}\n"],"mappings":"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"}
+{"version":3,"file":"power-history-chart.cjs","names":["React","useReducedMotion","valueFormat","useChartZoom","buildYAxisScale","useAnimatedChartDomain","measureYAxisGutter","formatYAxisTick","buildTimeTicks","useMeasuredSize","clampTooltipPosition","SectionTitle","SeriesLegend","Area","curveMonotoneX","LinePath","ChartZoomResetButton","ChartTooltipCard"],"sources":["../../src/components/power-history-chart.tsx"],"sourcesContent":["import { curveMonotoneX } from '@visx/curve'\nimport { localPoint } from '@visx/event'\nimport { scaleLinear } from '@visx/scale'\nimport { Area, LinePath } from '@visx/shape'\nimport { useTooltip } from '@visx/tooltip'\nimport { bisector } from '@visx/vendor/d3-array'\nimport * as React from 'react'\nimport { useCallback, useEffect, useMemo, useRef, useState } from 'react'\nimport { useAnimatedChartDomain, useChartZoom } from '../hooks/use-chart-zoom'\nimport { useReducedMotion } from '../hooks/use-reduced-motion'\nimport { NARROW_NBSP } from '../utils/chars'\nimport {\n  buildYAxisScale,\n  formatYAxisTick,\n  measureYAxisGutter,\n} from '../utils/chart-scale'\nimport { buildTimeTicks } from '../utils/chart-time-ticks'\nimport type { TimeDomain } from '../utils/chart-zoom'\nimport { cn } from '../utils/cn'\nimport { twoDecimalFormat as valueFormat } from '../utils/format'\nimport {\n  ChartTooltipCard,\n  type ChartTooltipRow,\n  ChartZoomResetButton,\n  clampTooltipPosition,\n  useMeasuredSize,\n} from './chart'\nimport { SeriesLegend, type SeriesLegendItem } from './series-legend'\nimport { SectionTitle } from './typography'\n\nexport interface PowerHistoryPoint {\n  /** Epoch milliseconds. */\n  t: number\n  solar: number\n  /** Signed: positive = import, negative = feed-in. */\n  grid: number\n  /** Signed: positive = discharge, negative = charge. */\n  battery: number\n  consumption: number\n}\n\nexport interface PowerHistoryChartProps {\n  data: PowerHistoryPoint[]\n  /** Axis/tooltip unit, e.g. \"kW\". */\n  unit: string\n  formatX: (t: number) => string\n  /** Tooltip time formatter. Defaults to `formatX`; use to keep the tooltip's\n   * full clock time when the axis ticks are compact (hour-only). */\n  formatTooltipX?: (t: number) => string\n  formatValue?: (value: number) => string\n  labels: {\n    solar: string\n    grid: string\n    battery: string\n    consumption: string\n  }\n  /** Series to drop entirely (no legend entry, area, or tooltip row). */\n  omitSeries?: readonly PowerHistorySeriesKey[]\n  /** Epoch ms to mark with the current-time dashed line (omit to hide). */\n  highlightAt?: number\n  title?: string\n  className?: string\n  height?: number\n  zoomable?: boolean\n  zoomResetLabel?: string\n  zoomDomain?: TimeDomain | null\n  onZoomDomainChange?: (domain: TimeDomain | null) => void\n}\n\nconst AREA_KEYS = ['solar', 'grid', 'battery'] as const\n\n// All toggleable series, in legend order. The areas (solar/grid/battery) plus\n// the consumption overlay line.\nconst SERIES_KEYS = ['solar', 'grid', 'battery', 'consumption'] as const\nexport type PowerHistorySeriesKey = (typeof SERIES_KEYS)[number]\ntype SeriesKey = PowerHistorySeriesKey\n\nconst SERIES_COLORS = {\n  solar: 'var(--orange-a9)',\n  grid: 'var(--blue-9)',\n  battery: 'var(--green-a9)',\n  consumption: 'var(--neutral-12)',\n} as const\n\nconst PADDING_TOP = 20\nconst PADDING_BOTTOM = 28\nconst PADDING_RIGHT = 8\nconst X_TICK_COUNT = 6\nconst DEFAULT_HEIGHT = 260\nconst DETAILED_X_AXIS_THRESHOLD = 6 * 60 * 60 * 1000\n\nconst tBisector = bisector<PowerHistoryPoint, number>((d) => d.t)\n\nfunction touchDistance(a: React.Touch, b: React.Touch): number {\n  return Math.hypot(a.clientX - b.clientX, a.clientY - b.clientY)\n}\n\nfunction touchMidpoint(\n  a: React.Touch,\n  b: React.Touch,\n): {\n  clientX: number\n  clientY: number\n} {\n  return {\n    clientX: (a.clientX + b.clientX) / 2,\n    clientY: (a.clientY + b.clientY) / 2,\n  }\n}\n\n/**\n * Diverging \"power sources\" area chart over a continuous time axis: solar\n * (orange), grid (blue) and battery (green) areas around a zero baseline, with\n * consumption overlaid as a line. Negative values (grid feed-in, battery\n * charging) dip below zero. For instantaneous power (day view). A legend at the\n * top toggles each series on/off; the y-axis rescales to the visible ones. visx.\n */\n// oxlint-disable-next-line eslint/complexity -- pre-existing; split it before adding branches\nexport function PowerHistoryChart({\n  data,\n  unit,\n  formatX,\n  formatTooltipX,\n  formatValue,\n  labels,\n  omitSeries,\n  highlightAt,\n  title,\n  className,\n  height = DEFAULT_HEIGHT,\n  zoomable = false,\n  zoomResetLabel,\n  zoomDomain,\n  onZoomDomainChange,\n}: PowerHistoryChartProps) {\n  const plotClipId = React.useId()\n  const fmtTooltipX = formatTooltipX ?? formatX\n  const containerRef = useRef<HTMLDivElement>(null)\n  const reducedMotion = useReducedMotion()\n  const [width, setWidth] = useState(0)\n  const [hiddenSeries, setHiddenSeries] = useState<ReadonlySet<string>>(\n    () => new Set(),\n  )\n  const omitted = useMemo(() => new Set<SeriesKey>(omitSeries), [omitSeries])\n\n  const toggleSeries = useCallback((id: string) => {\n    setHiddenSeries((prev) => {\n      const next = new Set(prev)\n      if (next.has(id)) {\n        next.delete(id)\n      } else {\n        next.add(id)\n      }\n      return next\n    })\n  }, [])\n\n  const isHidden = useCallback(\n    (key: SeriesKey) => omitted.has(key) || hiddenSeries.has(key),\n    [hiddenSeries, omitted],\n  )\n\n  const {\n    showTooltip,\n    hideTooltip,\n    tooltipData,\n    tooltipLeft,\n    tooltipTop,\n    tooltipOpen,\n  } = useTooltip<PowerHistoryPoint>()\n\n  useEffect(() => {\n    const element = containerRef.current\n    if (!element) return\n\n    const resizeObserver = new ResizeObserver((entries) => {\n      const entry = entries[0]\n      if (!entry) return\n      setWidth(entry.contentRect.width)\n    })\n\n    resizeObserver.observe(element)\n    return () => resizeObserver.disconnect()\n  }, [])\n\n  const fmtValue = (value: number) =>\n    formatValue\n      ? formatValue(value)\n      : `${valueFormat.format(value)}${NARROW_NBSP}${unit}`\n\n  const tMin = data.length ? (data[0]?.t ?? 0) : 0\n  const tMax = data.length ? (data[data.length - 1]?.t ?? 0) : 0\n  const fullDomain = useMemo((): TimeDomain | null => {\n    if (data.length === 0) return null\n    return [tMin, tMax]\n  }, [data.length, tMin, tMax])\n\n  const zoom = useChartZoom({\n    enabled: zoomable,\n    fullDomain,\n    zoomDomain,\n    onZoomDomainChange,\n  })\n\n  const viewMin = zoom.zoomWindow?.[0] ?? tMin\n  const viewMax = zoom.zoomWindow?.[1] ?? tMax\n\n  const visibleData = useMemo(\n    () => data.filter((d) => d.t >= viewMin && d.t <= viewMax),\n    [data, viewMin, viewMax],\n  )\n\n  const { yMin, yMax } = useMemo(() => {\n    let min = 0\n    let max = 0\n    for (const d of visibleData) {\n      if (!isHidden('solar')) max = Math.max(max, d.solar)\n      if (!isHidden('consumption')) max = Math.max(max, d.consumption)\n      if (!isHidden('grid')) {\n        max = Math.max(max, d.grid)\n        min = Math.min(min, d.grid)\n      }\n      if (!isHidden('battery')) {\n        max = Math.max(max, d.battery)\n        min = Math.min(min, d.battery)\n      }\n    }\n    return { yMin: min, yMax: max }\n  }, [visibleData, isHidden])\n\n  const {\n    ticks: yTicks,\n    min: lo,\n    max: hi,\n  } = useMemo(() => buildYAxisScale(yMin, yMax), [yMin, yMax])\n  const displayedYDomain = useAnimatedChartDomain([lo, hi], {\n    animateChanges: zoom.isPinching,\n    reducedMotion,\n  })\n\n  const gutter = useMemo(\n    () => measureYAxisGutter(yTicks, formatYAxisTick),\n    [yTicks],\n  )\n\n  const plotRight = Math.max(gutter, width - PADDING_RIGHT)\n\n  const xScale = useMemo(\n    () =>\n      scaleLinear<number>({\n        domain: [viewMin, viewMax === viewMin ? viewMin + 1 : viewMax],\n        range: [gutter, plotRight],\n      }),\n    [viewMin, viewMax, plotRight, gutter],\n  )\n\n  const plotHeight = Math.max(0, height - PADDING_BOTTOM - PADDING_TOP)\n  const plotWidth = Math.max(0, plotRight - gutter)\n\n  const yScale = useMemo(\n    () =>\n      scaleLinear<number>({\n        domain: [\n          displayedYDomain[0],\n          displayedYDomain[1] === displayedYDomain[0]\n            ? displayedYDomain[0] + 1\n            : displayedYDomain[1],\n        ],\n        range: [height - PADDING_BOTTOM, PADDING_TOP],\n      }),\n    [displayedYDomain, height],\n  )\n\n  const xTicks = useMemo(\n    () => buildTimeTicks(viewMin, viewMax, X_TICK_COUNT),\n    [viewMin, viewMax],\n  )\n  const formatAxisX =\n    zoom.isZoomed && viewMax - viewMin <= DETAILED_X_AXIS_THRESHOLD\n      ? fmtTooltipX\n      : formatX\n\n  const domainXFromEvent = useCallback(\n    (\n      event:\n        | React.MouseEvent<SVGRectElement>\n        | React.PointerEvent<SVGRectElement>\n        | React.TouchEvent<SVGRectElement>,\n    ) => {\n      const point = localPoint(event)\n      if (!point) return null\n      return xScale.invert(point.x)\n    },\n    [xScale],\n  )\n\n  const handleTooltip = useCallback(\n    (\n      event:\n        | React.TouchEvent<SVGRectElement>\n        | React.MouseEvent<SVGRectElement>,\n    ) => {\n      if (zoom.isBrushing || zoom.isPanning) return\n      const point = localPoint(event)\n      if (!point || data.length === 0) return\n\n      const xMs = xScale.invert(point.x)\n      const index = tBisector.left(data, xMs, 1)\n      const d0 = data[index - 1]\n      const d1 = data[index]\n      if (!d0) return\n\n      const d = d1 && xMs - d0.t > d1.t - xMs ? d1 : d0\n      showTooltip({\n        tooltipData: d,\n        tooltipLeft: xScale(d.t),\n        tooltipTop: PADDING_TOP,\n      })\n    },\n    [data, showTooltip, xScale, zoom.isBrushing, zoom.isPanning],\n  )\n\n  const legendItems: SeriesLegendItem[] = SERIES_KEYS.filter(\n    (key) => !omitted.has(key),\n  ).map((key) => ({\n    id: key,\n    label: labels[key],\n    color: SERIES_COLORS[key],\n  }))\n\n  const tooltipRows: ChartTooltipRow[] = tooltipData\n    ? SERIES_KEYS.filter((key) => !isHidden(key)).map((key) => ({\n        key,\n        label: labels[key],\n        color: SERIES_COLORS[key],\n        value: fmtValue(tooltipData[key]),\n      }))\n    : []\n\n  const showHighlight =\n    highlightAt !== undefined &&\n    highlightAt >= viewMin &&\n    highlightAt <= viewMax\n\n  const [tooltipRef, tooltipSize] = useMeasuredSize<HTMLDivElement>()\n  const tooltipPos = clampTooltipPosition({\n    anchorX: tooltipLeft ?? 0,\n    anchorY: tooltipTop ?? PADDING_TOP,\n    width,\n    height,\n    tipWidth: tooltipSize.width,\n    tipHeight: tooltipSize.height,\n    placement: 'beside',\n  })\n\n  return (\n    <div className={cn('flex w-full flex-col gap-2', className)}>\n      {title && <SectionTitle>{title}</SectionTitle>}\n      <SeriesLegend\n        items={legendItems}\n        hiddenIds={hiddenSeries}\n        onToggle={toggleSeries}\n      />\n      <span className=\"px-1 text-xs text-gray-light\">{unit}</span>\n      <div ref={containerRef} className=\"relative w-full\" style={{ height }}>\n        {width > 0 && (\n          <svg width={width} height={height}>\n            <defs>\n              {AREA_KEYS.map((key) => (\n                <linearGradient\n                  key={key}\n                  id={`power-history-fill-${key}`}\n                  x1=\"0\"\n                  y1=\"0\"\n                  x2=\"0\"\n                  y2=\"1\"\n                >\n                  <stop\n                    offset=\"0%\"\n                    stopColor={SERIES_COLORS[key]}\n                    stopOpacity={0.35}\n                  />\n                  <stop\n                    offset=\"100%\"\n                    stopColor={SERIES_COLORS[key]}\n                    stopOpacity={0.04}\n                  />\n                </linearGradient>\n              ))}\n              <clipPath id={plotClipId}>\n                <rect\n                  height={plotHeight}\n                  width={plotWidth}\n                  x={gutter}\n                  y={PADDING_TOP}\n                />\n              </clipPath>\n            </defs>\n\n            {yTicks.map((tick) => {\n              const y = yScale(tick)\n              return (\n                <g key={`y-tick-${tick}`}>\n                  <line\n                    x1={gutter}\n                    x2={plotRight}\n                    y1={y}\n                    y2={y}\n                    stroke=\"var(--neutral-a4)\"\n                    strokeWidth={1}\n                  />\n                  <text\n                    x={gutter - 7}\n                    y={y + 3}\n                    textAnchor=\"end\"\n                    fill=\"var(--neutral-a11)\"\n                    fontSize={10}\n                  >\n                    {formatYAxisTick(tick)}\n                  </text>\n                </g>\n              )\n            })}\n\n            <g clipPath={`url(#${plotClipId})`} data-testid=\"chart-plot-clip\">\n              {AREA_KEYS.filter((key) => !isHidden(key)).map((key) => (\n                <Area<PowerHistoryPoint>\n                  key={`area-${key}`}\n                  data={data}\n                  x={(d) => xScale(d.t)}\n                  y0={yScale(0)}\n                  y1={(d) => yScale(d[key])}\n                  curve={curveMonotoneX}\n                  fill={`url(#power-history-fill-${key})`}\n                  stroke=\"transparent\"\n                />\n              ))}\n\n              {AREA_KEYS.filter((key) => !isHidden(key)).map((key) => (\n                <LinePath<PowerHistoryPoint>\n                  key={`line-${key}`}\n                  data={data}\n                  x={(d) => xScale(d.t)}\n                  y={(d) => yScale(d[key])}\n                  curve={curveMonotoneX}\n                  stroke={SERIES_COLORS[key]}\n                  strokeWidth={1.5}\n                  fill=\"none\"\n                />\n              ))}\n\n              {!isHidden('consumption') && (\n                <LinePath<PowerHistoryPoint>\n                  data={data}\n                  x={(d) => xScale(d.t)}\n                  y={(d) => yScale(d.consumption)}\n                  curve={curveMonotoneX}\n                  stroke={SERIES_COLORS.consumption}\n                  strokeWidth={1.5}\n                  fill=\"none\"\n                />\n              )}\n            </g>\n\n            <line\n              x1={gutter}\n              x2={plotRight}\n              y1={yScale(0)}\n              y2={yScale(0)}\n              stroke=\"var(--neutral-a6)\"\n              strokeWidth={1}\n            />\n\n            {showHighlight && (\n              <line\n                x1={xScale(highlightAt)}\n                x2={xScale(highlightAt)}\n                y1={PADDING_TOP}\n                y2={height - PADDING_BOTTOM}\n                stroke=\"var(--spark-a9)\"\n                strokeWidth={1.5}\n                strokeDasharray=\"5 4\"\n                pointerEvents=\"none\"\n              />\n            )}\n\n            {xTicks.map((tick, index) => (\n              <text\n                key={`x-tick-${tick}`}\n                x={xScale(tick)}\n                y={height - PADDING_BOTTOM + 16}\n                textAnchor={\n                  index === 0\n                    ? 'start'\n                    : index === xTicks.length - 1\n                      ? 'end'\n                      : 'middle'\n                }\n                fill=\"var(--neutral-a11)\"\n                fontSize={10}\n              >\n                {formatAxisX(tick)}\n              </text>\n            ))}\n\n            {tooltipOpen &&\n              tooltipData &&\n              !zoom.isBrushing &&\n              !zoom.isPanning && (\n                <>\n                  <line\n                    x1={xScale(tooltipData.t)}\n                    x2={xScale(tooltipData.t)}\n                    y1={PADDING_TOP}\n                    y2={height - PADDING_BOTTOM}\n                    stroke=\"var(--neutral-a6)\"\n                    strokeDasharray=\"4 4\"\n                    pointerEvents=\"none\"\n                  />\n                  {AREA_KEYS.filter((key) => !isHidden(key)).map((key) => (\n                    <circle\n                      key={`dot-${key}`}\n                      cx={xScale(tooltipData.t)}\n                      cy={yScale(tooltipData[key])}\n                      r={3.5}\n                      fill={SERIES_COLORS[key]}\n                      stroke=\"white\"\n                      strokeWidth={1.5}\n                      pointerEvents=\"none\"\n                    />\n                  ))}\n                  {!isHidden('consumption') && (\n                    <circle\n                      cx={xScale(tooltipData.t)}\n                      cy={yScale(tooltipData.consumption)}\n                      r={3.5}\n                      fill={SERIES_COLORS.consumption}\n                      stroke=\"white\"\n                      strokeWidth={1.5}\n                      pointerEvents=\"none\"\n                    />\n                  )}\n                </>\n              )}\n\n            {zoom.brushBand && (\n              <rect\n                data-testid=\"chart-brush-band\"\n                x={Math.min(\n                  xScale(zoom.brushBand[0]),\n                  xScale(zoom.brushBand[1]),\n                )}\n                y={PADDING_TOP}\n                width={Math.abs(\n                  xScale(zoom.brushBand[1]) - xScale(zoom.brushBand[0]),\n                )}\n                height={plotHeight}\n                fill=\"var(--spark-a4)\"\n                pointerEvents=\"none\"\n              />\n            )}\n\n            <rect\n              x={gutter}\n              y={PADDING_TOP}\n              width={plotWidth}\n              height={plotHeight}\n              fill=\"transparent\"\n              style={zoomable ? { touchAction: 'pan-y' } : undefined}\n              onMouseLeave={() => {\n                if (!zoom.isBrushing) hideTooltip()\n              }}\n              onMouseMove={(event) => {\n                if (zoom.isBrushing) {\n                  const domainX = domainXFromEvent(event)\n                  if (domainX != null) zoom.onPointerMove(domainX)\n                  return\n                }\n                handleTooltip(event)\n              }}\n              onPointerDown={(event) => {\n                if (!zoomable || event.pointerType === 'touch') return\n                if (event.button !== 0) return\n                const domainX = domainXFromEvent(event)\n                if (domainX == null) return\n                event.currentTarget.setPointerCapture?.(event.pointerId)\n                hideTooltip()\n                zoom.onPointerDown(domainX)\n              }}\n              onPointerMove={(event) => {\n                if (!zoomable) return\n                const domainX = domainXFromEvent(event)\n                if (domainX != null) zoom.onPointerMove(domainX)\n              }}\n              onPointerUp={(event) => {\n                if (!zoomable) return\n                const domainX = domainXFromEvent(event)\n                if (domainX != null) zoom.onPointerUp(domainX)\n                else zoom.onPointerCancel()\n              }}\n              onPointerCancel={() => {\n                zoom.onPointerCancel()\n              }}\n              onDoubleClick={() => {\n                if (zoomable) zoom.onDoubleClick()\n              }}\n              onTouchStart={(event) => {\n                if (!zoomable) return\n                if (event.touches.length === 2) {\n                  const [a, b] = [event.touches[0], event.touches[1]]\n                  if (!a || !b) return\n                  const point = localPoint(\n                    event.currentTarget,\n                    touchMidpoint(a, b) as MouseEvent,\n                  )\n                  if (!point) return\n                  const midpoint = Math.min(\n                    1,\n                    Math.max(0, (point.x - gutter) / plotWidth),\n                  )\n                  zoom.onPinchStart(touchDistance(a, b), midpoint)\n                  hideTooltip()\n                  return\n                }\n                if (event.touches.length === 1 && zoom.isZoomed) {\n                  const point = localPoint(event)\n                  if (!point) return\n                  zoom.onPanStart({\n                    x: (point.x - gutter) / plotWidth,\n                    y: (point.y - PADDING_TOP) / plotHeight,\n                  })\n                  hideTooltip()\n                }\n              }}\n              onTouchMove={(event) => {\n                if (zoomable && event.touches.length === 2) {\n                  const [a, b] = [event.touches[0], event.touches[1]]\n                  if (!a || !b) return\n                  const point = localPoint(\n                    event.currentTarget,\n                    touchMidpoint(a, b) as MouseEvent,\n                  )\n                  if (!point) return\n                  const midpoint = Math.min(\n                    1,\n                    Math.max(0, (point.x - gutter) / plotWidth),\n                  )\n                  zoom.onPinchMove(touchDistance(a, b), midpoint)\n                  return\n                }\n                if (event.touches.length === 1 && zoom.isZoomed) {\n                  const point = localPoint(event)\n                  if (!point) return\n                  zoom.onPanMove({\n                    x: (point.x - gutter) / plotWidth,\n                    y: (point.y - PADDING_TOP) / plotHeight,\n                  })\n                  return\n                }\n                if (event.touches.length === 1) handleTooltip(event)\n              }}\n              onTouchEnd={(event) => {\n                if (zoomable && event.touches.length < 2) zoom.onPinchEnd()\n                if (event.touches.length === 0) {\n                  if (zoomable) zoom.onPanEnd()\n                  if (zoomable) zoom.onTap()\n                  hideTooltip()\n                }\n              }}\n              onTouchCancel={() => {\n                zoom.onPinchEnd()\n                zoom.onPanEnd()\n              }}\n            />\n          </svg>\n        )}\n\n        {zoom.isZoomed && zoomResetLabel && (\n          <ChartZoomResetButton\n            label={zoomResetLabel}\n            onReset={zoom.resetZoom}\n          />\n        )}\n\n        <div\n          ref={tooltipRef}\n          className=\"pointer-events-none absolute z-10\"\n          style={{\n            left: tooltipPos.left,\n            top: tooltipPos.top,\n            opacity:\n              tooltipOpen && tooltipData && !zoom.isPanning && !zoom.isBrushing\n                ? 1\n                : 0,\n            transition: reducedMotion\n              ? 'opacity 140ms ease-out'\n              : 'left 140ms ease-out, top 140ms ease-out, opacity 140ms ease-out',\n          }}\n        >\n          {tooltipData && (\n            <ChartTooltipCard\n              label={fmtTooltipX(tooltipData.t)}\n              rows={tooltipRows}\n            />\n          )}\n        </div>\n      </div>\n    </div>\n  )\n}\n"],"mappings":"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"}

package/dist/components/power-history-chart.js

@@ -5,10 +5,10 @@ import { cn } from "../utils/cn.js";
 import "../utils/chars.js";
 import { twoDecimalFormat } from "../utils/format.js";
 import { buildYAxisScale, formatYAxisTick, measureYAxisGutter } from "../utils/chart-scale.js";
+import { buildTimeTicks } from "../utils/chart-time-ticks.js";
 import { ChartTooltipCard, ChartZoomResetButton, clampTooltipPosition, useMeasuredSize } from "./chart.js";
 import { SeriesLegend } from "./series-legend.js";
 import { SectionTitle } from "./typography.js";
-import { buildTimeTicks } from "../utils/chart-time-ticks.js";
 import * as React$1 from "react";
 import { useCallback, useEffect, useMemo, useRef, useState } from "react";
 import { Fragment, jsx, jsxs } from "react/jsx-runtime";