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

package/dist/components/message-scroller.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"message-scroller.js","names":["MessageScrollerPrimitive"],"sources":["../../src/components/message-scroller.tsx"],"sourcesContent":["import {\n  MessageScroller as MessageScrollerPrimitive,\n  useMessageScroller,\n  useMessageScrollerScrollable,\n  useMessageScrollerVisibility,\n} from '@shadcn/react/message-scroller'\nimport * as React from 'react'\nimport { MaterialSymbol } from '../icons/material-symbol'\nimport { cn } from '../utils/cn'\nimport { Button, type ButtonProps } from './button'\n\nfunction MessageScrollerProvider(\n  props: React.ComponentProps<typeof MessageScrollerPrimitive.Provider>,\n) {\n  return <MessageScrollerPrimitive.Provider {...props} />\n}\n\nfunction MessageScroller({\n  className,\n  ...props\n}: React.ComponentProps<typeof MessageScrollerPrimitive.Root>) {\n  return (\n    <MessageScrollerPrimitive.Root\n      data-slot=\"message-scroller\"\n      className={cn(\n        'group/message-scroller relative flex size-full min-h-0 flex-col overflow-hidden',\n        className,\n      )}\n      {...props}\n    />\n  )\n}\n\nfunction MessageScrollerViewport({\n  className,\n  ...props\n}: React.ComponentProps<typeof MessageScrollerPrimitive.Viewport>) {\n  return (\n    <MessageScrollerPrimitive.Viewport\n      data-slot=\"message-scroller-viewport\"\n      // scroll-fade-b is a spark-adopted shadcn utility; scrollbar-width/gutter\n      // are arbitrary props (spark ships no scrollbar-* utilities) and the native\n      // bar collapses to no-scrollbar (spark util) while autoscrolling.\n      className={cn(\n        'size-full min-h-0 min-w-0 scroll-fade-b overflow-y-auto overscroll-contain contain-content [scrollbar-gutter:stable] [scrollbar-width:thin] data-autoscrolling:no-scrollbar',\n        className,\n      )}\n      {...props}\n    />\n  )\n}\n\nfunction MessageScrollerContent({\n  className,\n  ...props\n}: React.ComponentProps<typeof MessageScrollerPrimitive.Content>) {\n  return (\n    <MessageScrollerPrimitive.Content\n      data-slot=\"message-scroller-content\"\n      className={cn('flex h-max min-h-full flex-col gap-8', className)}\n      {...props}\n    />\n  )\n}\n\nfunction MessageScrollerItem({\n  className,\n  scrollAnchor = false,\n  ...props\n}: React.ComponentProps<typeof MessageScrollerPrimitive.Item>) {\n  return (\n    <MessageScrollerPrimitive.Item\n      data-slot=\"message-scroller-item\"\n      scrollAnchor={scrollAnchor}\n      className={cn(\n        'min-w-0 shrink-0 [contain-intrinsic-size:auto_10rem] [content-visibility:auto]',\n        className,\n      )}\n      {...props}\n    />\n  )\n}\n\n// Renders a spark <Button> via `render`, so its `styleVariant`/`color`/`size`\n// recipe paints the chrome — we only add positioning + the enter/leave animation\n// keyed off the primitive's data-[active] state. Icon is a MaterialSymbol (spark's\n// icon set), pointing down for `end` and up for `start`.\nfunction MessageScrollerButton({\n  direction = 'end',\n  className,\n  children,\n  render,\n  styleVariant = 'surface',\n  color = 'neutral',\n  size = 'icon-small',\n  ...props\n}: React.ComponentProps<typeof MessageScrollerPrimitive.Button> &\n  Pick<ButtonProps, 'styleVariant' | 'color' | 'size'>) {\n  return (\n    <MessageScrollerPrimitive.Button\n      data-slot=\"message-scroller-button\"\n      data-direction={direction}\n      direction={direction}\n      className={cn(\n        'absolute start-1/2 -translate-x-1/2 transition-[translate,scale,opacity] duration-200 data-[active=false]:pointer-events-none data-[active=false]:scale-95 data-[active=false]:opacity-0 data-[active=false]:duration-400 data-[active=false]:ease-[cubic-bezier(0.7,0,0.84,0)] data-[active=true]:translate-y-0 data-[active=true]:scale-100 data-[active=true]:opacity-100 data-[active=true]:ease-[cubic-bezier(0.23,1,0.32,1)] data-[direction=end]:bottom-4 data-[direction=end]:data-[active=false]:translate-y-full data-[direction=start]:top-4 data-[direction=start]:data-[active=false]:-translate-y-full motion-reduce:transition-none rtl:translate-x-1/2',\n        className,\n      )}\n      render={\n        render ?? (\n          <Button styleVariant={styleVariant} color={color} size={size} />\n        )\n      }\n      {...props}\n    >\n      {children ?? (\n        <>\n          <MaterialSymbol\n            name={direction === 'end' ? 'arrow_downward' : 'arrow_upward'}\n          />\n          <span className=\"sr-only\">\n            {direction === 'end' ? 'Scroll to end' : 'Scroll to start'}\n          </span>\n        </>\n      )}\n    </MessageScrollerPrimitive.Button>\n  )\n}\n\nexport {\n  MessageScroller,\n  MessageScrollerButton,\n  MessageScrollerContent,\n  MessageScrollerItem,\n  MessageScrollerProvider,\n  MessageScrollerViewport,\n  useMessageScroller,\n  useMessageScrollerScrollable,\n  useMessageScrollerVisibility,\n}\n"],"mappings":";;;;;;;;AAWA,SAAS,wBACP,OACA;AACA,QAAO,oBAACA,kBAAyB,UAA1B,EAAmC,GAAI,OAAS,CAAA;;AAGzD,SAAS,gBAAgB,EACvB,WACA,GAAG,SAC0D;AAC7D,QACE,oBAACA,kBAAyB,MAA1B;EACE,aAAU;EACV,WAAW,GACT,mFACA,UACD;EACD,GAAI;EACJ,CAAA;;AAIN,SAAS,wBAAwB,EAC/B,WACA,GAAG,SAC8D;AACjE,QACE,oBAACA,kBAAyB,UAA1B;EACE,aAAU;EAIV,WAAW,GACT,+KACA,UACD;EACD,GAAI;EACJ,CAAA;;AAIN,SAAS,uBAAuB,EAC9B,WACA,GAAG,SAC6D;AAChE,QACE,oBAACA,kBAAyB,SAA1B;EACE,aAAU;EACV,WAAW,GAAG,wCAAwC,UAAU;EAChE,GAAI;EACJ,CAAA;;AAIN,SAAS,oBAAoB,EAC3B,WACA,eAAe,OACf,GAAG,SAC0D;AAC7D,QACE,oBAACA,kBAAyB,MAA1B;EACE,aAAU;EACI;EACd,WAAW,GACT,kFACA,UACD;EACD,GAAI;EACJ,CAAA;;AAQN,SAAS,sBAAsB,EAC7B,YAAY,OACZ,WACA,UACA,QACA,eAAe,WACf,QAAQ,WACR,OAAO,cACP,GAAG,SAEmD;AACtD,QACE,oBAACA,kBAAyB,QAA1B;EACE,aAAU;EACV,kBAAgB;EACL;EACX,WAAW,GACT,0oBACA,UACD;EACD,QACE,UACE,oBAAC,QAAD;GAAsB;GAAqB;GAAa;GAAQ,CAAA;EAGpE,GAAI;YAEH,YACC,qBAAA,UAAA,EAAA,UAAA,CACE,oBAAC,gBAAD,EACE,MAAM,cAAc,QAAQ,mBAAmB,gBAC/C,CAAA,EACF,oBAAC,QAAD;GAAM,WAAU;aACb,cAAc,QAAQ,kBAAkB;GACpC,CAAA,CACN,EAAA,CAAA;EAE2B,CAAA"}

package/dist/components/message.cjs

@@ -0,0 +1,60 @@
+"use client";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const require_chunk = require("../chunk-aJGBMT86.cjs");
+let react = require("react");
+react = require_chunk.__toESM(react);
+let react_jsx_runtime = require("react/jsx-runtime");
+let cnfast = require("cnfast");
+//#region src/components/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),
+		...props
+	});
+}
+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),
+		...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),
+		...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),
+		...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),
+		...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),
+		...props
+	});
+}
+//#endregion
+exports.Message = Message;
+exports.MessageAvatar = MessageAvatar;
+exports.MessageContent = MessageContent;
+exports.MessageFooter = MessageFooter;
+exports.MessageGroup = MessageGroup;
+exports.MessageHeader = MessageHeader;
+
+//# sourceMappingURL=message.cjs.map

package/dist/components/message.cjs.map

@@ -0,0 +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;AAC1E,QACE,iBAAA,GAAA,kBAAA,KAAC,OAAD;EACE,aAAU;EACV,YAAA,GAAA,OAAA,IAAc,+BAA+B,UAAU;EACvD,GAAI;EACJ,CAAA;;AAIN,SAAS,QAAQ,EACf,WACA,QAAQ,SACR,GAAG,SACyD;AAC5D,QACE,iBAAA,GAAA,kBAAA,KAAC,OAAD;EACE,aAAU;EACV,cAAY;EACZ,YAAA,GAAA,OAAA,IACE,8FACA,UACD;EACD,GAAI;EACJ,CAAA;;AAIN,SAAS,cAAc,EAAE,WAAW,GAAG,SAAsC;AAC3E,QACE,iBAAA,GAAA,kBAAA,KAAC,OAAD;EACE,aAAU;EACV,YAAA,GAAA,OAAA,IACE,wKACA,UACD;EACD,GAAI;EACJ,CAAA;;AAIN,SAAS,eAAe,EAAE,WAAW,GAAG,SAAsC;AAC5E,QACE,iBAAA,GAAA,kBAAA,KAAC,OAAD;EACE,aAAU;EACV,YAAA,GAAA,OAAA,IACE,4GACA,UACD;EACD,GAAI;EACJ,CAAA;;AAIN,SAAS,cAAc,EAAE,WAAW,GAAG,SAAsC;AAC3E,QACE,iBAAA,GAAA,kBAAA,KAAC,OAAD;EACE,aAAU;EACV,YAAA,GAAA,OAAA,IACE,6HACA,UACD;EACD,GAAI;EACJ,CAAA;;AAIN,SAAS,cAAc,EAAE,WAAW,GAAG,SAAsC;AAC3E,QACE,iBAAA,GAAA,kBAAA,KAAC,OAAD;EACE,aAAU;EACV,YAAA,GAAA,OAAA,IACE,wKACA,UACD;EACD,GAAI;EACJ,CAAA"}

package/dist/components/message.d.cts

@@ -0,0 +1,36 @@
+"use client";
+
+import * as _$react_jsx_runtime0 from "react/jsx-runtime";
+import * as React$1 from "react";
+
+//#region src/components/message.d.ts
+declare function MessageGroup({
+  className,
+  ...props
+}: React$1.ComponentProps<'div'>): _$react_jsx_runtime0.JSX.Element;
+declare function Message({
+  className,
+  align,
+  ...props
+}: React$1.ComponentProps<'div'> & {
+  align?: 'start' | 'end';
+}): _$react_jsx_runtime0.JSX.Element;
+declare function MessageAvatar({
+  className,
+  ...props
+}: React$1.ComponentProps<'div'>): _$react_jsx_runtime0.JSX.Element;
+declare function MessageContent({
+  className,
+  ...props
+}: React$1.ComponentProps<'div'>): _$react_jsx_runtime0.JSX.Element;
+declare function MessageHeader({
+  className,
+  ...props
+}: React$1.ComponentProps<'div'>): _$react_jsx_runtime0.JSX.Element;
+declare function MessageFooter({
+  className,
+  ...props
+}: React$1.ComponentProps<'div'>): _$react_jsx_runtime0.JSX.Element;
+//#endregion
+export { Message, MessageAvatar, MessageContent, MessageFooter, MessageGroup, MessageHeader };
+//# sourceMappingURL=message.d.cts.map

package/dist/components/message.d.ts

@@ -0,0 +1,36 @@
+"use client";
+
+import * as React$1 from "react";
+import * as _$react_jsx_runtime0 from "react/jsx-runtime";
+
+//#region src/components/message.d.ts
+declare function MessageGroup({
+  className,
+  ...props
+}: React$1.ComponentProps<'div'>): _$react_jsx_runtime0.JSX.Element;
+declare function Message({
+  className,
+  align,
+  ...props
+}: React$1.ComponentProps<'div'> & {
+  align?: 'start' | 'end';
+}): _$react_jsx_runtime0.JSX.Element;
+declare function MessageAvatar({
+  className,
+  ...props
+}: React$1.ComponentProps<'div'>): _$react_jsx_runtime0.JSX.Element;
+declare function MessageContent({
+  className,
+  ...props
+}: React$1.ComponentProps<'div'>): _$react_jsx_runtime0.JSX.Element;
+declare function MessageHeader({
+  className,
+  ...props
+}: React$1.ComponentProps<'div'>): _$react_jsx_runtime0.JSX.Element;
+declare function MessageFooter({
+  className,
+  ...props
+}: React$1.ComponentProps<'div'>): _$react_jsx_runtime0.JSX.Element;
+//#endregion
+export { Message, MessageAvatar, MessageContent, MessageFooter, MessageGroup, MessageHeader };
+//# sourceMappingURL=message.d.ts.map

package/dist/components/message.js

@@ -0,0 +1,52 @@
+"use client";
+import { cn } from "../utils/cn.js";
+import "react";
+import { jsx } from "react/jsx-runtime";
+//#region src/components/message.tsx
+function MessageGroup({ className, ...props }) {
+	return /* @__PURE__ */ jsx("div", {
+		"data-slot": "message-group",
+		className: cn("flex min-w-0 flex-col gap-2", className),
+		...props
+	});
+}
+function Message({ className, align = "start", ...props }) {
+	return /* @__PURE__ */ jsx("div", {
+		"data-slot": "message",
+		"data-align": align,
+		className: 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__ */ jsx("div", {
+		"data-slot": "message-avatar",
+		className: 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__ */ jsx("div", {
+		"data-slot": "message-content",
+		className: 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__ */ jsx("div", {
+		"data-slot": "message-header",
+		className: 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__ */ jsx("div", {
+		"data-slot": "message-footer",
+		className: 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
+	});
+}
+//#endregion
+export { Message, MessageAvatar, MessageContent, MessageFooter, MessageGroup, MessageHeader };
+
+//# sourceMappingURL=message.js.map

package/dist/components/message.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"message.js","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;AAC1E,QACE,oBAAC,OAAD;EACE,aAAU;EACV,WAAW,GAAG,+BAA+B,UAAU;EACvD,GAAI;EACJ,CAAA;;AAIN,SAAS,QAAQ,EACf,WACA,QAAQ,SACR,GAAG,SACyD;AAC5D,QACE,oBAAC,OAAD;EACE,aAAU;EACV,cAAY;EACZ,WAAW,GACT,8FACA,UACD;EACD,GAAI;EACJ,CAAA;;AAIN,SAAS,cAAc,EAAE,WAAW,GAAG,SAAsC;AAC3E,QACE,oBAAC,OAAD;EACE,aAAU;EACV,WAAW,GACT,wKACA,UACD;EACD,GAAI;EACJ,CAAA;;AAIN,SAAS,eAAe,EAAE,WAAW,GAAG,SAAsC;AAC5E,QACE,oBAAC,OAAD;EACE,aAAU;EACV,WAAW,GACT,4GACA,UACD;EACD,GAAI;EACJ,CAAA;;AAIN,SAAS,cAAc,EAAE,WAAW,GAAG,SAAsC;AAC3E,QACE,oBAAC,OAAD;EACE,aAAU;EACV,WAAW,GACT,6HACA,UACD;EACD,GAAI;EACJ,CAAA;;AAIN,SAAS,cAAc,EAAE,WAAW,GAAG,SAAsC;AAC3E,QACE,oBAAC,OAAD;EACE,aAAU;EACV,WAAW,GACT,wKACA,UACD;EACD,GAAI;EACJ,CAAA"}

package/dist/components/metering-row.cjs

@@ -0,0 +1,43 @@
+"use client";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+require("../chunk-aJGBMT86.cjs");
+const require_icons_material_symbol = require("../icons/material-symbol.cjs");
+let react_jsx_runtime = require("react/jsx-runtime");
+let cnfast = require("cnfast");
+//#region src/components/metering-row.tsx
+const MeteringRow = ({ className, tone, ...rest }) => {
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+		className: (0, cnfast.cn)("group flex items-center gap-3", className),
+		"data-tone": tone,
+		...rest
+	});
+};
+const MeteringRowIcon = ({ className, icon, ...rest }) => {
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+		className: (0, cnfast.cn)("flex size-10 shrink-0 items-center justify-center rounded-xl group-data-[tone=accent]:bg-base-accent-soft group-data-[tone=accent]:text-accent group-data-[tone=error]:bg-base-error-soft group-data-[tone=error]:text-error group-data-[tone=neutral]:bg-base-gray-soft group-data-[tone=neutral]:text-gray group-data-[tone=success]:bg-base-success-soft group-data-[tone=success]:text-success group-data-[tone=warning]:bg-base-warning-soft group-data-[tone=warning]:text-warning", className),
+		...rest,
+		children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_icons_material_symbol.MaterialSymbol, {
+			className: "text-[18px]",
+			name: icon
+		})
+	});
+};
+const MeteringRowLabel = ({ className, ...rest }) => {
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+		className: (0, cnfast.cn)("flex-1 text-sm text-gray", className),
+		...rest
+	});
+};
+const MeteringRowValue = ({ className, ...rest }) => {
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+		className: (0, cnfast.cn)("text-lg leading-tight font-bold tabular-nums group-data-[tone=accent]:text-accent group-data-[tone=error]:text-error group-data-[tone=neutral]:text-gray group-data-[tone=success]:text-success group-data-[tone=warning]:text-warning", className),
+		...rest
+	});
+};
+//#endregion
+exports.MeteringRow = MeteringRow;
+exports.MeteringRowIcon = MeteringRowIcon;
+exports.MeteringRowLabel = MeteringRowLabel;
+exports.MeteringRowValue = MeteringRowValue;
+
+//# sourceMappingURL=metering-row.cjs.map

package/dist/components/metering-row.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"metering-row.cjs","names":["MaterialSymbol"],"sources":["../../src/components/metering-row.tsx"],"sourcesContent":["import {\n  MaterialSymbol,\n  type MaterialSymbolIconName,\n} from '../icons/material-symbol'\nimport type { Tone } from '../lib/tones'\nimport { cn } from '../utils/cn'\n\nconst MeteringRow = ({\n  className,\n  tone,\n  ...rest\n}: React.ComponentProps<'div'> & {\n  tone: Tone\n}) => {\n  return (\n    <div\n      className={cn('group flex items-center gap-3', className)}\n      data-tone={tone}\n      {...rest}\n    />\n  )\n}\n\nconst MeteringRowIcon = ({\n  className,\n  icon,\n  ...rest\n}: React.ComponentProps<'span'> & {\n  icon: MaterialSymbolIconName\n}) => {\n  return (\n    <span\n      className={cn(\n        'flex size-10 shrink-0 items-center justify-center rounded-xl group-data-[tone=accent]:bg-base-accent-soft group-data-[tone=accent]:text-accent group-data-[tone=error]:bg-base-error-soft group-data-[tone=error]:text-error group-data-[tone=neutral]:bg-base-gray-soft group-data-[tone=neutral]:text-gray group-data-[tone=success]:bg-base-success-soft group-data-[tone=success]:text-success group-data-[tone=warning]:bg-base-warning-soft group-data-[tone=warning]:text-warning',\n        className,\n      )}\n      {...rest}\n    >\n      <MaterialSymbol className=\"text-[18px]\" name={icon} />\n    </span>\n  )\n}\n\nconst MeteringRowLabel = ({\n  className,\n  ...rest\n}: React.ComponentProps<'span'>) => {\n  return (\n    <span className={cn('flex-1 text-sm text-gray', className)} {...rest} />\n  )\n}\n\nconst MeteringRowValue = ({\n  className,\n  ...rest\n}: React.ComponentProps<'span'>) => {\n  return (\n    <span\n      className={cn(\n        'text-lg leading-tight font-bold tabular-nums group-data-[tone=accent]:text-accent group-data-[tone=error]:text-error group-data-[tone=neutral]:text-gray group-data-[tone=success]:text-success group-data-[tone=warning]:text-warning',\n        className,\n      )}\n      {...rest}\n    />\n  )\n}\n\nexport { MeteringRow, MeteringRowIcon, MeteringRowLabel, MeteringRowValue }\n"],"mappings":";;;;;;;AAOA,MAAM,eAAe,EACnB,WACA,MACA,GAAG,WAGC;AACJ,QACE,iBAAA,GAAA,kBAAA,KAAC,OAAD;EACE,YAAA,GAAA,OAAA,IAAc,iCAAiC,UAAU;EACzD,aAAW;EACX,GAAI;EACJ,CAAA;;AAIN,MAAM,mBAAmB,EACvB,WACA,MACA,GAAG,WAGC;AACJ,QACE,iBAAA,GAAA,kBAAA,KAAC,QAAD;EACE,YAAA,GAAA,OAAA,IACE,4dACA,UACD;EACD,GAAI;YAEJ,iBAAA,GAAA,kBAAA,KAACA,8BAAAA,gBAAD;GAAgB,WAAU;GAAc,MAAM;GAAQ,CAAA;EACjD,CAAA;;AAIX,MAAM,oBAAoB,EACxB,WACA,GAAG,WAC+B;AAClC,QACE,iBAAA,GAAA,kBAAA,KAAC,QAAD;EAAM,YAAA,GAAA,OAAA,IAAc,4BAA4B,UAAU;EAAE,GAAI;EAAQ,CAAA;;AAI5E,MAAM,oBAAoB,EACxB,WACA,GAAG,WAC+B;AAClC,QACE,iBAAA,GAAA,kBAAA,KAAC,QAAD;EACE,YAAA,GAAA,OAAA,IACE,0OACA,UACD;EACD,GAAI;EACJ,CAAA"}

package/dist/components/metering-row.d.cts

@@ -0,0 +1,32 @@
+"use client";
+
+import { MaterialSymbolIconName } from "../icons/material-symbol.cjs";
+import { t as Tone } from "../tones-DjgKOX3s.cjs";
+import * as _$react_jsx_runtime0 from "react/jsx-runtime";
+
+//#region src/components/metering-row.d.ts
+declare const MeteringRow: ({
+  className,
+  tone,
+  ...rest
+}: React.ComponentProps<"div"> & {
+  tone: Tone;
+}) => _$react_jsx_runtime0.JSX.Element;
+declare const MeteringRowIcon: ({
+  className,
+  icon,
+  ...rest
+}: React.ComponentProps<"span"> & {
+  icon: MaterialSymbolIconName;
+}) => _$react_jsx_runtime0.JSX.Element;
+declare const MeteringRowLabel: ({
+  className,
+  ...rest
+}: React.ComponentProps<"span">) => _$react_jsx_runtime0.JSX.Element;
+declare const MeteringRowValue: ({
+  className,
+  ...rest
+}: React.ComponentProps<"span">) => _$react_jsx_runtime0.JSX.Element;
+//#endregion
+export { MeteringRow, MeteringRowIcon, MeteringRowLabel, MeteringRowValue };
+//# sourceMappingURL=metering-row.d.cts.map

package/dist/components/metering-row.d.ts

@@ -0,0 +1,32 @@
+"use client";
+
+import { MaterialSymbolIconName } from "../icons/material-symbol.js";
+import { t as Tone } from "../tones-DyCkL71h.js";
+import * as _$react_jsx_runtime0 from "react/jsx-runtime";
+
+//#region src/components/metering-row.d.ts
+declare const MeteringRow: ({
+  className,
+  tone,
+  ...rest
+}: React.ComponentProps<"div"> & {
+  tone: Tone;
+}) => _$react_jsx_runtime0.JSX.Element;
+declare const MeteringRowIcon: ({
+  className,
+  icon,
+  ...rest
+}: React.ComponentProps<"span"> & {
+  icon: MaterialSymbolIconName;
+}) => _$react_jsx_runtime0.JSX.Element;
+declare const MeteringRowLabel: ({
+  className,
+  ...rest
+}: React.ComponentProps<"span">) => _$react_jsx_runtime0.JSX.Element;
+declare const MeteringRowValue: ({
+  className,
+  ...rest
+}: React.ComponentProps<"span">) => _$react_jsx_runtime0.JSX.Element;
+//#endregion
+export { MeteringRow, MeteringRowIcon, MeteringRowLabel, MeteringRowValue };
+//# sourceMappingURL=metering-row.d.ts.map

package/dist/components/metering-row.js

@@ -0,0 +1,38 @@
+"use client";
+import { cn } from "../utils/cn.js";
+import { MaterialSymbol } from "../icons/material-symbol.js";
+import { jsx } from "react/jsx-runtime";
+//#region src/components/metering-row.tsx
+const MeteringRow = ({ className, tone, ...rest }) => {
+	return /* @__PURE__ */ jsx("div", {
+		className: cn("group flex items-center gap-3", className),
+		"data-tone": tone,
+		...rest
+	});
+};
+const MeteringRowIcon = ({ className, icon, ...rest }) => {
+	return /* @__PURE__ */ jsx("span", {
+		className: cn("flex size-10 shrink-0 items-center justify-center rounded-xl group-data-[tone=accent]:bg-base-accent-soft group-data-[tone=accent]:text-accent group-data-[tone=error]:bg-base-error-soft group-data-[tone=error]:text-error group-data-[tone=neutral]:bg-base-gray-soft group-data-[tone=neutral]:text-gray group-data-[tone=success]:bg-base-success-soft group-data-[tone=success]:text-success group-data-[tone=warning]:bg-base-warning-soft group-data-[tone=warning]:text-warning", className),
+		...rest,
+		children: /* @__PURE__ */ jsx(MaterialSymbol, {
+			className: "text-[18px]",
+			name: icon
+		})
+	});
+};
+const MeteringRowLabel = ({ className, ...rest }) => {
+	return /* @__PURE__ */ jsx("span", {
+		className: cn("flex-1 text-sm text-gray", className),
+		...rest
+	});
+};
+const MeteringRowValue = ({ className, ...rest }) => {
+	return /* @__PURE__ */ jsx("span", {
+		className: cn("text-lg leading-tight font-bold tabular-nums group-data-[tone=accent]:text-accent group-data-[tone=error]:text-error group-data-[tone=neutral]:text-gray group-data-[tone=success]:text-success group-data-[tone=warning]:text-warning", className),
+		...rest
+	});
+};
+//#endregion
+export { MeteringRow, MeteringRowIcon, MeteringRowLabel, MeteringRowValue };
+
+//# sourceMappingURL=metering-row.js.map

package/dist/components/metering-row.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"metering-row.js","names":[],"sources":["../../src/components/metering-row.tsx"],"sourcesContent":["import {\n  MaterialSymbol,\n  type MaterialSymbolIconName,\n} from '../icons/material-symbol'\nimport type { Tone } from '../lib/tones'\nimport { cn } from '../utils/cn'\n\nconst MeteringRow = ({\n  className,\n  tone,\n  ...rest\n}: React.ComponentProps<'div'> & {\n  tone: Tone\n}) => {\n  return (\n    <div\n      className={cn('group flex items-center gap-3', className)}\n      data-tone={tone}\n      {...rest}\n    />\n  )\n}\n\nconst MeteringRowIcon = ({\n  className,\n  icon,\n  ...rest\n}: React.ComponentProps<'span'> & {\n  icon: MaterialSymbolIconName\n}) => {\n  return (\n    <span\n      className={cn(\n        'flex size-10 shrink-0 items-center justify-center rounded-xl group-data-[tone=accent]:bg-base-accent-soft group-data-[tone=accent]:text-accent group-data-[tone=error]:bg-base-error-soft group-data-[tone=error]:text-error group-data-[tone=neutral]:bg-base-gray-soft group-data-[tone=neutral]:text-gray group-data-[tone=success]:bg-base-success-soft group-data-[tone=success]:text-success group-data-[tone=warning]:bg-base-warning-soft group-data-[tone=warning]:text-warning',\n        className,\n      )}\n      {...rest}\n    >\n      <MaterialSymbol className=\"text-[18px]\" name={icon} />\n    </span>\n  )\n}\n\nconst MeteringRowLabel = ({\n  className,\n  ...rest\n}: React.ComponentProps<'span'>) => {\n  return (\n    <span className={cn('flex-1 text-sm text-gray', className)} {...rest} />\n  )\n}\n\nconst MeteringRowValue = ({\n  className,\n  ...rest\n}: React.ComponentProps<'span'>) => {\n  return (\n    <span\n      className={cn(\n        'text-lg leading-tight font-bold tabular-nums group-data-[tone=accent]:text-accent group-data-[tone=error]:text-error group-data-[tone=neutral]:text-gray group-data-[tone=success]:text-success group-data-[tone=warning]:text-warning',\n        className,\n      )}\n      {...rest}\n    />\n  )\n}\n\nexport { MeteringRow, MeteringRowIcon, MeteringRowLabel, MeteringRowValue }\n"],"mappings":";;;;;AAOA,MAAM,eAAe,EACnB,WACA,MACA,GAAG,WAGC;AACJ,QACE,oBAAC,OAAD;EACE,WAAW,GAAG,iCAAiC,UAAU;EACzD,aAAW;EACX,GAAI;EACJ,CAAA;;AAIN,MAAM,mBAAmB,EACvB,WACA,MACA,GAAG,WAGC;AACJ,QACE,oBAAC,QAAD;EACE,WAAW,GACT,4dACA,UACD;EACD,GAAI;YAEJ,oBAAC,gBAAD;GAAgB,WAAU;GAAc,MAAM;GAAQ,CAAA;EACjD,CAAA;;AAIX,MAAM,oBAAoB,EACxB,WACA,GAAG,WAC+B;AAClC,QACE,oBAAC,QAAD;EAAM,WAAW,GAAG,4BAA4B,UAAU;EAAE,GAAI;EAAQ,CAAA;;AAI5E,MAAM,oBAAoB,EACxB,WACA,GAAG,WAC+B;AAClC,QACE,oBAAC,QAAD;EACE,WAAW,GACT,0OACA,UACD;EACD,GAAI;EACJ,CAAA"}

package/dist/components/money-saved-block.cjs

@@ -0,0 +1,87 @@
+"use client";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+require("../chunk-aJGBMT86.cjs");
+const require_icons_material_symbol = require("../icons/material-symbol.cjs");
+const require_components_typography = require("./typography.cjs");
+let react_jsx_runtime = require("react/jsx-runtime");
+//#region src/components/money-saved-block.tsx
+const MoneySavedContainer = ({ children, ariaLabel = "Money saved today" }) => {
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+		"aria-label": ariaLabel,
+		className: "flex items-center justify-between gap-4",
+		children
+	});
+};
+const MoneySavedContent = ({ children }) => {
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+		className: "flex flex-col gap-1",
+		children
+	});
+};
+const MoneySavedTitle = ({ children }) => {
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_components_typography.SectionTitle, { children });
+};
+const MoneySavedValue = ({ children }) => {
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_components_typography.StateValue, { children });
+};
+const MoneySavedDelta = ({ children }) => {
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("span", {
+		className: "flex items-end gap-1 text-sm text-base-success-solid",
+		children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_icons_material_symbol.MaterialSymbol, {
+			className: "rotate-180 text-[14px]",
+			name: "swap_vert"
+		}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+			className: "tabular-nums",
+			children
+		})]
+	});
+};
+const MoneySavedGaugeContainer = ({ children }) => {
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+		className: "relative top-2 flex flex-col items-end gap-1",
+		children
+	});
+};
+const MoneySavedGaugeContent = ({ autarkyProgress, autarkyLabel, autarkyCaption = "Autarky", gaugeWidth, gaugeHeight, gaugeArcPath, gaugeStrokeWidth }) => {
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(react_jsx_runtime.Fragment, { children: [
+		/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("svg", {
+			className: "h-[44px] w-[76px]",
+			viewBox: `0 0 ${gaugeWidth} ${gaugeHeight}`,
+			"aria-hidden": "true",
+			children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("path", {
+				d: gaugeArcPath,
+				fill: "none",
+				stroke: "var(--gray-a5)",
+				strokeWidth: gaugeStrokeWidth,
+				strokeLinecap: "round",
+				pathLength: 1
+			}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("path", {
+				d: gaugeArcPath,
+				fill: "none",
+				stroke: "var(--green-a9)",
+				strokeWidth: gaugeStrokeWidth,
+				strokeLinecap: "round",
+				pathLength: 1,
+				strokeDasharray: `${autarkyProgress} 1`
+			})]
+		}),
+		/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+			className: "absolute inset-0 flex items-center justify-center text-sm font-semibold text-gray",
+			children: autarkyLabel
+		}),
+		/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+			className: "mx-auto text-xs text-gray-light",
+			children: autarkyCaption
+		})
+	] });
+};
+//#endregion
+exports.MoneySavedContainer = MoneySavedContainer;
+exports.MoneySavedContent = MoneySavedContent;
+exports.MoneySavedDelta = MoneySavedDelta;
+exports.MoneySavedGaugeContainer = MoneySavedGaugeContainer;
+exports.MoneySavedGaugeContent = MoneySavedGaugeContent;
+exports.MoneySavedTitle = MoneySavedTitle;
+exports.MoneySavedValue = MoneySavedValue;
+
+//# sourceMappingURL=money-saved-block.cjs.map

package/dist/components/money-saved-block.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"money-saved-block.cjs","names":["SectionTitle","StateValue","MaterialSymbol"],"sources":["../../src/components/money-saved-block.tsx"],"sourcesContent":["import { MaterialSymbol } from '../icons/material-symbol'\nimport { SectionTitle, StateValue } from './typography'\n\nconst MoneySavedContainer = ({\n  children,\n  ariaLabel = 'Money saved today',\n}: {\n  children: React.ReactNode\n  /** Override the accessible label for the container. Defaults to `\"Money saved today\"`. */\n  ariaLabel?: string\n}) => {\n  return (\n    <div\n      aria-label={ariaLabel}\n      className=\"flex items-center justify-between gap-4\"\n    >\n      {children}\n    </div>\n  )\n}\n\nconst MoneySavedContent = ({ children }: { children: React.ReactNode }) => {\n  return <div className=\"flex flex-col gap-1\">{children}</div>\n}\n\nconst MoneySavedTitle = ({ children }: { children: React.ReactNode }) => {\n  return <SectionTitle>{children}</SectionTitle>\n}\n\nconst MoneySavedValue = ({ children }: { children: React.ReactNode }) => {\n  return <StateValue>{children}</StateValue>\n}\n\nconst MoneySavedDelta = ({ children }: { children: React.ReactNode }) => {\n  return (\n    <span className=\"flex items-end gap-1 text-sm text-base-success-solid\">\n      <MaterialSymbol className=\"rotate-180 text-[14px]\" name=\"swap_vert\" />\n      <span className=\"tabular-nums\">{children}</span>\n    </span>\n  )\n}\n\nconst MoneySavedGaugeContainer = ({\n  children,\n}: {\n  children: React.ReactNode\n}) => {\n  return (\n    <div className=\"relative top-2 flex flex-col items-end gap-1\">\n      {children}\n    </div>\n  )\n}\n\nconst MoneySavedGaugeContent = ({\n  autarkyProgress,\n  autarkyLabel,\n  autarkyCaption = 'Autarky',\n  gaugeWidth,\n  gaugeHeight,\n  gaugeArcPath,\n  gaugeStrokeWidth,\n}: {\n  autarkyProgress: number\n  autarkyLabel: string\n  /** Override the caption shown beneath the gauge. Defaults to `\"Autarky\"`. */\n  autarkyCaption?: React.ReactNode\n  gaugeWidth: number\n  gaugeHeight: number\n  gaugeArcPath: string\n  gaugeStrokeWidth: number\n}) => {\n  return (\n    <>\n      <svg\n        className=\"h-[44px] w-[76px]\"\n        viewBox={`0 0 ${gaugeWidth} ${gaugeHeight}`}\n        aria-hidden=\"true\"\n      >\n        <path\n          d={gaugeArcPath}\n          fill=\"none\"\n          stroke=\"var(--gray-a5)\"\n          strokeWidth={gaugeStrokeWidth}\n          strokeLinecap=\"round\"\n          pathLength={1}\n        />\n        <path\n          d={gaugeArcPath}\n          fill=\"none\"\n          stroke=\"var(--green-a9)\"\n          strokeWidth={gaugeStrokeWidth}\n          strokeLinecap=\"round\"\n          pathLength={1}\n          strokeDasharray={`${autarkyProgress} 1`}\n        />\n      </svg>\n      <span className=\"absolute inset-0 flex items-center justify-center text-sm font-semibold text-gray\">\n        {autarkyLabel}\n      </span>\n      <span className=\"mx-auto text-xs text-gray-light\">{autarkyCaption}</span>\n    </>\n  )\n}\n\nexport {\n  MoneySavedContainer,\n  MoneySavedContent,\n  MoneySavedTitle,\n  MoneySavedValue,\n  MoneySavedDelta,\n  MoneySavedGaugeContainer,\n  MoneySavedGaugeContent,\n}\n"],"mappings":";;;;;;;AAGA,MAAM,uBAAuB,EAC3B,UACA,YAAY,0BAKR;AACJ,QACE,iBAAA,GAAA,kBAAA,KAAC,OAAD;EACE,cAAY;EACZ,WAAU;EAET;EACG,CAAA;;AAIV,MAAM,qBAAqB,EAAE,eAA8C;AACzE,QAAO,iBAAA,GAAA,kBAAA,KAAC,OAAD;EAAK,WAAU;EAAuB;EAAe,CAAA;;AAG9D,MAAM,mBAAmB,EAAE,eAA8C;AACvE,QAAO,iBAAA,GAAA,kBAAA,KAACA,8BAAAA,cAAD,EAAe,UAAwB,CAAA;;AAGhD,MAAM,mBAAmB,EAAE,eAA8C;AACvE,QAAO,iBAAA,GAAA,kBAAA,KAACC,8BAAAA,YAAD,EAAa,UAAsB,CAAA;;AAG5C,MAAM,mBAAmB,EAAE,eAA8C;AACvE,QACE,iBAAA,GAAA,kBAAA,MAAC,QAAD;EAAM,WAAU;YAAhB,CACE,iBAAA,GAAA,kBAAA,KAACC,8BAAAA,gBAAD;GAAgB,WAAU;GAAyB,MAAK;GAAc,CAAA,EACtE,iBAAA,GAAA,kBAAA,KAAC,QAAD;GAAM,WAAU;GAAgB;GAAgB,CAAA,CAC3C;;;AAIX,MAAM,4BAA4B,EAChC,eAGI;AACJ,QACE,iBAAA,GAAA,kBAAA,KAAC,OAAD;EAAK,WAAU;EACZ;EACG,CAAA;;AAIV,MAAM,0BAA0B,EAC9B,iBACA,cACA,iBAAiB,WACjB,YACA,aACA,cACA,uBAUI;AACJ,QACE,iBAAA,GAAA,kBAAA,MAAA,kBAAA,UAAA,EAAA,UAAA;EACE,iBAAA,GAAA,kBAAA,MAAC,OAAD;GACE,WAAU;GACV,SAAS,OAAO,WAAW,GAAG;GAC9B,eAAY;aAHd,CAKE,iBAAA,GAAA,kBAAA,KAAC,QAAD;IACE,GAAG;IACH,MAAK;IACL,QAAO;IACP,aAAa;IACb,eAAc;IACd,YAAY;IACZ,CAAA,EACF,iBAAA,GAAA,kBAAA,KAAC,QAAD;IACE,GAAG;IACH,MAAK;IACL,QAAO;IACP,aAAa;IACb,eAAc;IACd,YAAY;IACZ,iBAAiB,GAAG,gBAAgB;IACpC,CAAA,CACE;;EACN,iBAAA,GAAA,kBAAA,KAAC,QAAD;GAAM,WAAU;aACb;GACI,CAAA;EACP,iBAAA,GAAA,kBAAA,KAAC,QAAD;GAAM,WAAU;aAAmC;GAAsB,CAAA;EACxE,EAAA,CAAA"}

package/dist/components/money-saved-block.d.cts

@@ -0,0 +1,57 @@
+"use client";
+
+import * as _$react_jsx_runtime0 from "react/jsx-runtime";
+
+//#region src/components/money-saved-block.d.ts
+declare const MoneySavedContainer: ({
+  children,
+  ariaLabel
+}: {
+  children: React.ReactNode; /** Override the accessible label for the container. Defaults to `"Money saved today"`. */
+  ariaLabel?: string;
+}) => _$react_jsx_runtime0.JSX.Element;
+declare const MoneySavedContent: ({
+  children
+}: {
+  children: React.ReactNode;
+}) => _$react_jsx_runtime0.JSX.Element;
+declare const MoneySavedTitle: ({
+  children
+}: {
+  children: React.ReactNode;
+}) => _$react_jsx_runtime0.JSX.Element;
+declare const MoneySavedValue: ({
+  children
+}: {
+  children: React.ReactNode;
+}) => _$react_jsx_runtime0.JSX.Element;
+declare const MoneySavedDelta: ({
+  children
+}: {
+  children: React.ReactNode;
+}) => _$react_jsx_runtime0.JSX.Element;
+declare const MoneySavedGaugeContainer: ({
+  children
+}: {
+  children: React.ReactNode;
+}) => _$react_jsx_runtime0.JSX.Element;
+declare const MoneySavedGaugeContent: ({
+  autarkyProgress,
+  autarkyLabel,
+  autarkyCaption,
+  gaugeWidth,
+  gaugeHeight,
+  gaugeArcPath,
+  gaugeStrokeWidth
+}: {
+  autarkyProgress: number;
+  autarkyLabel: string; /** Override the caption shown beneath the gauge. Defaults to `"Autarky"`. */
+  autarkyCaption?: React.ReactNode;
+  gaugeWidth: number;
+  gaugeHeight: number;
+  gaugeArcPath: string;
+  gaugeStrokeWidth: number;
+}) => _$react_jsx_runtime0.JSX.Element;
+//#endregion
+export { MoneySavedContainer, MoneySavedContent, MoneySavedDelta, MoneySavedGaugeContainer, MoneySavedGaugeContent, MoneySavedTitle, MoneySavedValue };
+//# sourceMappingURL=money-saved-block.d.cts.map

package/dist/components/money-saved-block.d.ts

@@ -0,0 +1,57 @@
+"use client";
+
+import * as _$react_jsx_runtime0 from "react/jsx-runtime";
+
+//#region src/components/money-saved-block.d.ts
+declare const MoneySavedContainer: ({
+  children,
+  ariaLabel
+}: {
+  children: React.ReactNode; /** Override the accessible label for the container. Defaults to `"Money saved today"`. */
+  ariaLabel?: string;
+}) => _$react_jsx_runtime0.JSX.Element;
+declare const MoneySavedContent: ({
+  children
+}: {
+  children: React.ReactNode;
+}) => _$react_jsx_runtime0.JSX.Element;
+declare const MoneySavedTitle: ({
+  children
+}: {
+  children: React.ReactNode;
+}) => _$react_jsx_runtime0.JSX.Element;
+declare const MoneySavedValue: ({
+  children
+}: {
+  children: React.ReactNode;
+}) => _$react_jsx_runtime0.JSX.Element;
+declare const MoneySavedDelta: ({
+  children
+}: {
+  children: React.ReactNode;
+}) => _$react_jsx_runtime0.JSX.Element;
+declare const MoneySavedGaugeContainer: ({
+  children
+}: {
+  children: React.ReactNode;
+}) => _$react_jsx_runtime0.JSX.Element;
+declare const MoneySavedGaugeContent: ({
+  autarkyProgress,
+  autarkyLabel,
+  autarkyCaption,
+  gaugeWidth,
+  gaugeHeight,
+  gaugeArcPath,
+  gaugeStrokeWidth
+}: {
+  autarkyProgress: number;
+  autarkyLabel: string; /** Override the caption shown beneath the gauge. Defaults to `"Autarky"`. */
+  autarkyCaption?: React.ReactNode;
+  gaugeWidth: number;
+  gaugeHeight: number;
+  gaugeArcPath: string;
+  gaugeStrokeWidth: number;
+}) => _$react_jsx_runtime0.JSX.Element;
+//#endregion
+export { MoneySavedContainer, MoneySavedContent, MoneySavedDelta, MoneySavedGaugeContainer, MoneySavedGaugeContent, MoneySavedTitle, MoneySavedValue };
+//# sourceMappingURL=money-saved-block.d.ts.map