@epilot/spark-ui 0.20.0 → 0.21.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/components/accordion.cjs +7 -7
- package/dist/components/accordion.cjs.map +1 -1
- package/dist/components/accordion.d.ts +1 -1
- package/dist/components/accordion.js +1 -1
- package/dist/components/alert-dialog.cjs +10 -10
- package/dist/components/alert-dialog.cjs.map +1 -1
- package/dist/components/alert-dialog.js +1 -1
- package/dist/components/attachment.cjs +10 -10
- package/dist/components/attachment.cjs.map +1 -1
- package/dist/components/attachment.d.cts +2 -2
- package/dist/components/attachment.d.ts +2 -2
- package/dist/components/autocomplete.cjs +13 -13
- package/dist/components/autocomplete.cjs.map +1 -1
- package/dist/components/autocomplete.js +1 -1
- package/dist/components/avatar.cjs +2 -2
- package/dist/components/avatar.cjs.map +1 -1
- package/dist/components/avatar.js +1 -1
- package/dist/components/badge.cjs +2 -2
- package/dist/components/badge.cjs.map +1 -1
- package/dist/components/badge.js +1 -1
- package/dist/components/bar-chart-with-total.d.cts +1 -1
- package/dist/components/bar-chart-with-total.d.ts +1 -1
- package/dist/components/bar-chart.cjs +4 -4
- package/dist/components/bar-chart.cjs.map +1 -1
- package/dist/components/bar-chart.js +2 -2
- package/dist/components/box.cjs +2 -2
- package/dist/components/box.cjs.map +1 -1
- package/dist/components/box.js +1 -1
- package/dist/components/breadcrumbs.cjs +7 -7
- package/dist/components/breadcrumbs.cjs.map +1 -1
- package/dist/components/bubble.cjs +5 -5
- package/dist/components/bubble.cjs.map +1 -1
- package/dist/components/bubble.d.cts +1 -1
- package/dist/components/bubble.d.ts +1 -1
- package/dist/components/button-group.cjs +5 -5
- package/dist/components/button-group.cjs.map +1 -1
- package/dist/components/button-group.js +1 -1
- package/dist/components/button.cjs +2 -2
- package/dist/components/button.cjs.map +1 -1
- package/dist/components/button.d.cts +2 -2
- package/dist/components/button.d.ts +2 -2
- package/dist/components/button.js +1 -1
- package/dist/components/calendar.cjs +9 -9
- package/dist/components/calendar.cjs.map +1 -1
- package/dist/components/calendar.js +1 -1
- package/dist/components/callout.cjs +8 -8
- package/dist/components/callout.cjs.map +1 -1
- package/dist/components/callout.d.cts +1 -1
- package/dist/components/callout.d.ts +2 -2
- package/dist/components/callout.js +1 -1
- package/dist/components/card.cjs +16 -16
- package/dist/components/card.cjs.map +1 -1
- package/dist/components/card.js +2 -2
- package/dist/components/card.js.map +1 -1
- package/dist/components/chart.cjs +2 -2
- package/dist/components/chart.cjs.map +1 -1
- package/dist/components/checkbox.cjs +2 -2
- package/dist/components/checkbox.cjs.map +1 -1
- package/dist/components/checkbox.js +1 -1
- package/dist/components/circular-gauge.cjs +3 -3
- package/dist/components/circular-gauge.cjs.map +1 -1
- package/dist/components/day-of-week-picker.cjs +4 -4
- package/dist/components/day-of-week-picker.cjs.map +1 -1
- package/dist/components/dialog.cjs +9 -9
- package/dist/components/dialog.cjs.map +1 -1
- package/dist/components/dialog.js +1 -1
- package/dist/components/drawer.cjs +8 -8
- package/dist/components/drawer.cjs.map +1 -1
- package/dist/components/dropdown-menu.cjs +11 -11
- package/dist/components/dropdown-menu.cjs.map +1 -1
- package/dist/components/dropdown-menu.js +1 -1
- package/dist/components/empty-state.d.ts +1 -1
- package/dist/components/energy-breakdown.cjs +80 -0
- package/dist/components/energy-breakdown.cjs.map +1 -0
- package/dist/components/energy-breakdown.d.cts +24 -0
- package/dist/components/energy-breakdown.d.ts +24 -0
- package/dist/components/energy-breakdown.js +79 -0
- package/dist/components/energy-breakdown.js.map +1 -0
- package/dist/components/energy-history-chart.cjs +63 -0
- package/dist/components/energy-history-chart.cjs.map +1 -0
- package/dist/components/energy-history-chart.d.cts +64 -0
- package/dist/components/energy-history-chart.d.ts +64 -0
- package/dist/components/energy-history-chart.js +62 -0
- package/dist/components/energy-history-chart.js.map +1 -0
- package/dist/components/entity-card.cjs +11 -11
- package/dist/components/entity-card.cjs.map +1 -1
- package/dist/components/entity-card.d.ts +1 -1
- package/dist/components/field.cjs +15 -15
- package/dist/components/field.cjs.map +1 -1
- package/dist/components/hero-metric.cjs +4 -4
- package/dist/components/hero-metric.cjs.map +1 -1
- package/dist/components/icon.cjs +2 -2
- package/dist/components/icon.cjs.map +1 -1
- package/dist/components/icon.js +1 -1
- package/dist/components/info-block.cjs +9 -9
- package/dist/components/info-block.cjs.map +1 -1
- package/dist/components/info-block.d.cts +1 -1
- package/dist/components/info-block.d.ts +1 -1
- package/dist/components/input-date.cjs +3 -3
- package/dist/components/input-date.cjs.map +1 -1
- package/dist/components/input-date.js +1 -1
- package/dist/components/input-group.cjs +5 -5
- package/dist/components/input-group.cjs.map +1 -1
- package/dist/components/input-otp.cjs +3 -3
- package/dist/components/input-otp.cjs.map +1 -1
- package/dist/components/input-otp.js +1 -1
- package/dist/components/input.cjs +3 -3
- package/dist/components/input.cjs.map +1 -1
- package/dist/components/input.js +1 -1
- package/dist/components/label.cjs +2 -2
- package/dist/components/label.cjs.map +1 -1
- package/dist/components/layout.cjs +2 -2
- package/dist/components/layout.cjs.map +1 -1
- package/dist/components/line-chart.cjs +7 -7
- package/dist/components/line-chart.cjs.map +1 -1
- package/dist/components/line-chart.js +4 -4
- package/dist/components/list.cjs +10 -10
- package/dist/components/list.cjs.map +1 -1
- package/dist/components/list.js +1 -1
- package/dist/components/list.js.map +1 -1
- package/dist/components/marker.cjs +4 -4
- package/dist/components/marker.cjs.map +1 -1
- package/dist/components/marker.d.cts +1 -1
- package/dist/components/marker.d.ts +1 -1
- package/dist/components/message-scroller.cjs +8 -8
- package/dist/components/message-scroller.cjs.map +1 -1
- package/dist/components/message-scroller.js +4 -4
- package/dist/components/message-scroller.js.map +1 -1
- package/dist/components/message.cjs +7 -7
- package/dist/components/message.cjs.map +1 -1
- package/dist/components/number-flow.d.cts +2 -12
- package/dist/components/number-flow.d.ts +2 -12
- package/dist/components/page-header.cjs +6 -6
- package/dist/components/page-header.cjs.map +1 -1
- package/dist/components/page-header.d.cts +1 -1
- package/dist/components/page-header.d.ts +1 -1
- package/dist/components/page-header.js +1 -1
- package/dist/components/period-tabs.cjs +6 -6
- package/dist/components/period-tabs.cjs.map +1 -1
- package/dist/components/pill.cjs +3 -3
- package/dist/components/pill.cjs.map +1 -1
- package/dist/components/pill.js +2 -2
- package/dist/components/popover.cjs +2 -2
- package/dist/components/popover.cjs.map +1 -1
- package/dist/components/power-history-chart.cjs +498 -0
- package/dist/components/power-history-chart.cjs.map +1 -0
- package/dist/components/power-history-chart.d.cts +71 -0
- package/dist/components/power-history-chart.d.ts +71 -0
- package/dist/components/power-history-chart.js +496 -0
- package/dist/components/power-history-chart.js.map +1 -0
- package/dist/components/power-network.cjs +559 -0
- package/dist/components/power-network.cjs.map +1 -0
- package/dist/components/power-network.d.cts +80 -0
- package/dist/components/power-network.d.ts +80 -0
- package/dist/components/power-network.js +553 -0
- package/dist/components/power-network.js.map +1 -0
- package/dist/components/progress.cjs +2 -2
- package/dist/components/progress.cjs.map +1 -1
- package/dist/components/radio-card-group.cjs +3 -3
- package/dist/components/radio-card-group.cjs.map +1 -1
- package/dist/components/radio.cjs +3 -3
- package/dist/components/radio.cjs.map +1 -1
- package/dist/components/radio.js +1 -1
- package/dist/components/sankey-chart.cjs +13 -3
- package/dist/components/sankey-chart.cjs.map +1 -1
- package/dist/components/sankey-chart.d.cts +3 -2
- package/dist/components/sankey-chart.d.ts +3 -2
- package/dist/components/sankey-chart.js +11 -2
- package/dist/components/sankey-chart.js.map +1 -1
- package/dist/components/schedule-editor.cjs +9 -9
- package/dist/components/schedule-editor.cjs.map +1 -1
- package/dist/components/schedule-list.cjs +11 -11
- package/dist/components/schedule-list.cjs.map +1 -1
- package/dist/components/schedule-list.js +1 -1
- package/dist/components/scroll-area.cjs +3 -3
- package/dist/components/scroll-area.cjs.map +1 -1
- package/dist/components/segmented-control.cjs +4 -4
- package/dist/components/segmented-control.cjs.map +1 -1
- package/dist/components/select.cjs +13 -13
- package/dist/components/select.cjs.map +1 -1
- package/dist/components/select.js +2 -2
- package/dist/components/separator.cjs +3 -3
- package/dist/components/separator.cjs.map +1 -1
- package/dist/components/series-legend.cjs +4 -4
- package/dist/components/series-legend.cjs.map +1 -1
- package/dist/components/sheet.cjs +9 -9
- package/dist/components/sheet.cjs.map +1 -1
- package/dist/components/sheet.js +1 -1
- package/dist/components/skeleton.cjs +3 -3
- package/dist/components/skeleton.cjs.map +1 -1
- package/dist/components/slider.cjs +11 -11
- package/dist/components/slider.cjs.map +1 -1
- package/dist/components/solar-forecast-chart.cjs +108 -0
- package/dist/components/solar-forecast-chart.cjs.map +1 -0
- package/dist/components/solar-forecast-chart.d.cts +77 -0
- package/dist/components/solar-forecast-chart.d.ts +77 -0
- package/dist/components/solar-forecast-chart.js +103 -0
- package/dist/components/solar-forecast-chart.js.map +1 -0
- package/dist/components/sortable-list.cjs +3 -3
- package/dist/components/sortable-list.cjs.map +1 -1
- package/dist/components/spinner.cjs +2 -2
- package/dist/components/spinner.cjs.map +1 -1
- package/dist/components/stat-card.cjs +8 -8
- package/dist/components/stat-card.cjs.map +1 -1
- package/dist/components/stepper.cjs +3 -3
- package/dist/components/stepper.cjs.map +1 -1
- package/dist/components/stepper.js +1 -1
- package/dist/components/switch.cjs +3 -3
- package/dist/components/switch.cjs.map +1 -1
- package/dist/components/switch.js +1 -1
- package/dist/components/table.cjs +9 -9
- package/dist/components/table.cjs.map +1 -1
- package/dist/components/table.js +1 -1
- package/dist/components/tabs.cjs +8 -8
- package/dist/components/tabs.cjs.map +1 -1
- package/dist/components/tabs.js +1 -1
- package/dist/components/textarea.cjs +3 -3
- package/dist/components/textarea.cjs.map +1 -1
- package/dist/components/textarea.js +1 -1
- package/dist/components/theme.cjs +2 -2
- package/dist/components/theme.cjs.map +1 -1
- package/dist/components/theme.js +1 -1
- package/dist/components/thumbnail.cjs +3 -3
- package/dist/components/thumbnail.cjs.map +1 -1
- package/dist/components/time-picker.cjs +3 -3
- package/dist/components/time-picker.cjs.map +1 -1
- package/dist/components/toast.cjs +8 -8
- package/dist/components/toast.cjs.map +1 -1
- package/dist/components/toast.js +1 -1
- package/dist/components/tooltip.cjs +4 -4
- package/dist/components/tooltip.cjs.map +1 -1
- package/dist/components/tooltip.js +1 -1
- package/dist/components/typography.cjs +6 -6
- package/dist/components/typography.cjs.map +1 -1
- package/dist/components/wizard-layout.cjs +8 -8
- package/dist/components/wizard-layout.cjs.map +1 -1
- package/dist/lib/input-box-variants.cjs +9 -9
- package/dist/lib/input-box-variants.cjs.map +1 -1
- package/dist/number-flow-Bch81ixZ.d.cts +14 -0
- package/dist/number-flow-Bch81ixZ.d.ts +14 -0
- package/dist/styles/spark-default.css +11 -0
- package/dist/utils/build-sankey-nodes.cjs +72 -0
- package/dist/utils/build-sankey-nodes.cjs.map +1 -0
- package/dist/utils/build-sankey-nodes.d.cts +27 -0
- package/dist/utils/build-sankey-nodes.d.ts +27 -0
- package/dist/utils/build-sankey-nodes.js +71 -0
- package/dist/utils/build-sankey-nodes.js.map +1 -0
- package/dist/utils/cn.cjs +2 -2
- package/dist/utils/cn.d.cts +1 -1
- package/dist/utils/cn.d.ts +1 -1
- package/dist/utils/cn.js +1 -1
- package/dist/utils/format.cjs +13 -0
- package/dist/utils/format.cjs.map +1 -1
- package/dist/utils/format.d.cts +7 -1
- package/dist/utils/format.d.ts +7 -1
- package/dist/utils/format.js +12 -1
- package/dist/utils/format.js.map +1 -1
- package/package.json +2 -2
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"toast.cjs","names":["CheckCircle","Info","Warning","Cancel","ToastPrimitive","Spinner","buttonVariants","Close"],"sources":["../../src/components/toast.tsx"],"sourcesContent":["'use client'\n\nimport { Toast as ToastPrimitive } from '@base-ui/react/toast'\nimport {\n Cancel,\n CheckCircle,\n Close,\n Info,\n Warning,\n type SparkIcon,\n} from '@epilot/spark-icons'\nimport * as React from 'react'\nimport { cn } from '../utils/cn'\nimport { buttonVariants } from './button'\nimport { Spinner } from './spinner'\n\ntype ToastType = 'success' | 'info' | 'warning' | 'error' | 'loading'\n\ntype ToastPosition =\n | 'top-left'\n | 'top-center'\n | 'top-right'\n | 'bottom-left'\n | 'bottom-center'\n | 'bottom-right'\n\n// Per-toast overrides Base UI carries through untouched as opaque `data`.\ntype ToastData = { closeButton?: boolean }\n\n// `label` is the button's content; everything else a `<button>` takes passes\n// straight through, so a caller can set `className`, `disabled`, `type`, and\n// the rest without a new prop for each one.\ntype ToastAction = Omit<\n React.ComponentPropsWithoutRef<'button'>,\n 'children'\n> & {\n label: React.ReactNode\n}\n\ntype ToastOptions = {\n description?: React.ReactNode\n /** Auto-dismiss time in ms. `0` keeps the toast until dismissed. */\n duration?: number\n /** Reuse an id to update a toast in place instead of stacking a new one. */\n id?: string\n closeButton?: boolean\n action?: ToastAction\n onDismiss?: () => void\n /** `high` announces urgently (assertive); the default is polite. */\n priority?: 'low' | 'high'\n}\n\ntype ToastPromiseMessages<Value> = {\n loading: string\n success: string | ((value: Value) => string)\n error: string | ((error: unknown) => string)\n}\n\nconst TOAST_ICONS: Record<\n Exclude<ToastType, 'loading'>,\n { icon: SparkIcon; className: string }\n> = {\n success: { icon: CheckCircle, className: 'text-success-light' },\n info: { icon: Info, className: 'text-info-light' },\n warning: { icon: Warning, className: 'text-warning-light' },\n error: { icon: Cancel, className: 'text-error-light' },\n}\n\n// Opaque radix steps (bg 2, border 6, text 11) so a floating toast never lets\n// page content bleed through the way the alpha `-soft` tokens would. The border\n// carries the tone too, otherwise a tinted toast keeps a grey outline.\nconst TONE_CLASSES: Record<Exclude<ToastType, 'loading'>, string> = {\n success: 'border-green-6 bg-green-2 text-green-11',\n info: 'border-blue-6 bg-blue-2 text-blue-11',\n warning: 'border-orange-6 bg-orange-2 text-orange-11',\n error: 'border-red-6 bg-red-2 text-red-11',\n}\n\n// Mobile-first: every position drops to a full-width stack at the top, which\n// is what the end-customer portal ships. `position` only takes effect from the\n// `sm` breakpoint up.\nconst POSITION_CLASSES: Record<ToastPosition, string> = {\n 'top-left': 'sm:top-4 sm:right-auto sm:bottom-auto sm:left-4',\n 'top-center':\n 'sm:top-4 sm:right-auto sm:bottom-auto sm:left-1/2 sm:-translate-x-1/2',\n 'top-right': 'sm:top-4 sm:right-4 sm:bottom-auto sm:left-auto',\n 'bottom-left': 'sm:top-auto sm:right-auto sm:bottom-4 sm:left-4',\n 'bottom-center':\n 'sm:top-auto sm:right-auto sm:bottom-4 sm:left-1/2 sm:-translate-x-1/2',\n 'bottom-right': 'sm:top-auto sm:right-4 sm:bottom-4 sm:left-auto',\n}\n\nconst manager = ToastPrimitive.createToastManager<ToastData>()\n\nlet sequence = 0\n\n// `label` names the content and `onClick` is wrapped, so neither reaches the\n// DOM button as-is; everything else does.\nfunction actionRest({\n label: _label,\n onClick: _onClick,\n ...rest\n}: ToastAction) {\n return rest\n}\n\nfunction toManagerOptions(\n id: string,\n title: React.ReactNode,\n type: ToastType | undefined,\n options: ToastOptions | undefined,\n) {\n const action = options?.action\n return {\n id,\n title,\n type,\n description: options?.description,\n timeout: options?.duration,\n priority: options?.priority,\n onClose: options?.onDismiss,\n // Base UI leaves the toast open after an action; dismissing matches what\n // callers expect from an \"Undo\" button.\n actionProps: action && {\n ...actionRest(action),\n children: action.label,\n onClick: (event: React.MouseEvent<HTMLButtonElement>) => {\n action.onClick?.(event)\n manager.close(id)\n },\n },\n data: { closeButton: options?.closeButton },\n }\n}\n\nconst emit =\n (type?: ToastType) =>\n (message: React.ReactNode, options?: ToastOptions): string => {\n // an id up front lets the action handler close the toast it belongs to\n const id = options?.id ?? `spark-toast-${(sequence += 1)}`\n return manager.add(toManagerOptions(id, message, type, options))\n }\n\n// A string phase becomes a titled toast of that type; an object phase keeps\n// whatever the caller set and only fills in the type.\nconst phase =\n <Value,>(\n value: ToastPromiseMessages<Value>[keyof ToastPromiseMessages<Value>],\n type: ToastType,\n ) =>\n (result: Value) => {\n const resolved = typeof value === 'function' ? value(result) : value\n return { title: resolved, type }\n }\n\nconst toast = Object.assign(emit(), {\n success: emit('success'),\n info: emit('info'),\n warning: emit('warning'),\n error: emit('error'),\n loading: emit('loading'),\n /** Dismiss one toast, or every toast when called without an id. */\n dismiss: (id?: string) => manager.close(id),\n promise: <Value,>(\n promiseValue: Promise<Value>,\n messages: ToastPromiseMessages<Value>,\n ) =>\n manager.promise(promiseValue, {\n loading: { title: messages.loading, type: 'loading' as const },\n success: phase(messages.success, 'success'),\n error: phase(messages.error as never, 'error'),\n }),\n})\n\nfunction ToastIcon({ type }: { type?: string }) {\n const icon = TOAST_ICONS[type as Exclude<ToastType, 'loading'>]\n if (type !== 'loading' && !icon) return null\n\n const Glyph = icon?.icon\n\n // Fixed box matching the title's line height, so the glyph and the spinner\n // both centre on the first line whether or not a description follows.\n return (\n <span\n aria-hidden=\"true\"\n className=\"flex h-5 w-5 shrink-0 items-center justify-center\"\n >\n {type === 'loading' ? (\n // Decorative: the toast already announces the loading message, so the\n // spinner must not add a second status live region.\n <Spinner\n className=\"text-gray-11\"\n label=\"\"\n role=\"presentation\"\n size=\"sm\"\n />\n ) : Glyph ? (\n <Glyph className={cn('[--spark-icon-size:20px]', icon.className)} />\n ) : null}\n </span>\n )\n}\n\nfunction ToastItem({\n closeButton,\n richColors,\n toast: toastObject,\n}: {\n closeButton: boolean\n richColors: boolean\n toast: ToastPrimitive.Root.ToastObject<ToastData>\n}) {\n const tone = TONE_CLASSES[toastObject.type as Exclude<ToastType, 'loading'>]\n const showClose = toastObject.data?.closeButton ?? closeButton\n\n return (\n <ToastPrimitive.Root\n data-slot=\"toast\"\n className={cn(\n // Skin only. All geometry (position, stacking, transitions, the\n // pointer bridge) lives in styles/index.css, because Tailwind's\n // `utilities` layer outranks `components` and a stray `bottom-0` here\n // would beat the stylesheet's `bottom: auto` on top-anchored stacks.\n // The border is what makes the cards behind the front one legible.\n 'flex items-start gap-2 rounded-lg border border-gray-a5 bg-gray-1 p-3 text-gray shadow-md select-none',\n richColors && tone,\n )}\n // the stack is top-anchored on mobile and bottom-anchored above `sm`, so\n // both vertical directions have to dismiss\n swipeDirection={['up', 'down', 'right']}\n toast={toastObject}\n >\n <ToastIcon type={toastObject.type} />\n <ToastPrimitive.Content className=\"flex min-w-0 flex-1 flex-col gap-0.5\">\n <ToastPrimitive.Title\n className=\"text-sm font-medium\"\n data-slot=\"toast-title\"\n />\n <ToastPrimitive.Description\n className={cn(\n 'text-sm',\n richColors && tone ? 'text-inherit' : 'text-gray-11',\n )}\n data-slot=\"toast-description\"\n />\n </ToastPrimitive.Content>\n {toastObject.actionProps ? (\n <ToastPrimitive.Action\n // -my-2 keeps the 36px control from stretching a single-line row past\n // the 20px text; self-center then lands it on the title when there is\n // no description, and mid-block when there is one\n className={cn(\n buttonVariants({ size: 'small', variant: 'primary' }),\n '-my-2 shrink-0 self-center rounded-full',\n )}\n data-slot=\"toast-action\"\n />\n ) : null}\n {showClose ? (\n <ToastPrimitive.Close\n aria-label=\"Close\"\n className={cn(\n buttonVariants({ size: 'icon-small', variant: 'tertiary' }),\n // -my-1: same reason as the action, for a 28px control\n '-my-1 -mr-1 size-7 shrink-0 self-center text-gray-11',\n )}\n data-slot=\"toast-close\"\n >\n <Close aria-hidden=\"true\" className=\"[--spark-icon-size:18px]\" />\n </ToastPrimitive.Close>\n ) : null}\n </ToastPrimitive.Root>\n )\n}\n\nfunction ToastList({\n closeButton,\n richColors,\n}: {\n closeButton: boolean\n richColors: boolean\n}) {\n const { toasts } = ToastPrimitive.useToastManager<ToastData>()\n\n return toasts.map((toastObject) => (\n <ToastItem\n closeButton={closeButton}\n key={toastObject.id}\n richColors={richColors}\n toast={toastObject}\n />\n ))\n}\n\ntype ToasterProps = {\n className?: string\n /** Corner or edge the toasts stack in. */\n position?: ToastPosition\n /** Close button on every toast; a per-toast `closeButton` wins. */\n closeButton?: boolean\n /** Tinted surfaces for success/info/warning/error toasts. */\n richColors?: boolean\n /** Default auto-dismiss time in ms. `0` disables auto-dismiss. */\n duration?: number\n /** Toasts visible at once before older ones are marked `data-limited`. */\n limit?: number\n /**\n * Vertical edge below the `sm` breakpoint, where the stack is always\n * full-width and `position` does not apply. Defaults to `top`, matching the\n * end-customer portal.\n */\n mobilePosition?: 'top' | 'bottom'\n}\n\nfunction Toaster({\n className,\n closeButton = true,\n duration = 4000,\n limit,\n mobilePosition = 'top',\n position = 'bottom-right',\n richColors = true,\n}: ToasterProps) {\n return (\n <ToastPrimitive.Provider\n limit={limit}\n timeout={duration}\n toastManager={manager}\n >\n <ToastPrimitive.Portal>\n <ToastPrimitive.Viewport\n // block + zero height: the toasts are absolutely positioned against\n // this box's bottom edge, the way Base UI's stacked example works\n className={cn(\n 'fixed inset-x-4 z-50 block h-0 outline-none',\n mobilePosition === 'top' ? 'top-4' : 'bottom-4',\n 'sm:inset-x-auto sm:w-96 sm:max-w-[calc(100vw-2rem)]',\n POSITION_CLASSES[position],\n className,\n )}\n data-mobile-side={mobilePosition}\n data-side={position.startsWith('top') ? 'top' : 'bottom'}\n data-slot=\"toaster\"\n >\n <ToastList closeButton={closeButton} richColors={richColors} />\n </ToastPrimitive.Viewport>\n </ToastPrimitive.Portal>\n </ToastPrimitive.Provider>\n )\n}\n\nexport { Toaster, toast }\nexport type {\n ToastAction,\n ToasterProps,\n ToastOptions,\n ToastPosition,\n ToastPromiseMessages,\n ToastType,\n}\n"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"toast.cjs","names":["CheckCircle","Info","Warning","Cancel","ToastPrimitive","Spinner","buttonVariants","Close"],"sources":["../../src/components/toast.tsx"],"sourcesContent":["'use client'\n\nimport { Toast as ToastPrimitive } from '@base-ui/react/toast'\nimport {\n Cancel,\n CheckCircle,\n Close,\n Info,\n Warning,\n type SparkIcon,\n} from '@epilot/spark-icons'\nimport * as React from 'react'\nimport { cn } from '../utils/cn'\nimport { buttonVariants } from './button'\nimport { Spinner } from './spinner'\n\ntype ToastType = 'success' | 'info' | 'warning' | 'error' | 'loading'\n\ntype ToastPosition =\n | 'top-left'\n | 'top-center'\n | 'top-right'\n | 'bottom-left'\n | 'bottom-center'\n | 'bottom-right'\n\n// Per-toast overrides Base UI carries through untouched as opaque `data`.\ntype ToastData = { closeButton?: boolean }\n\n// `label` is the button's content; everything else a `<button>` takes passes\n// straight through, so a caller can set `className`, `disabled`, `type`, and\n// the rest without a new prop for each one.\ntype ToastAction = Omit<\n React.ComponentPropsWithoutRef<'button'>,\n 'children'\n> & {\n label: React.ReactNode\n}\n\ntype ToastOptions = {\n description?: React.ReactNode\n /** Auto-dismiss time in ms. `0` keeps the toast until dismissed. */\n duration?: number\n /** Reuse an id to update a toast in place instead of stacking a new one. */\n id?: string\n closeButton?: boolean\n action?: ToastAction\n onDismiss?: () => void\n /** `high` announces urgently (assertive); the default is polite. */\n priority?: 'low' | 'high'\n}\n\ntype ToastPromiseMessages<Value> = {\n loading: string\n success: string | ((value: Value) => string)\n error: string | ((error: unknown) => string)\n}\n\nconst TOAST_ICONS: Record<\n Exclude<ToastType, 'loading'>,\n { icon: SparkIcon; className: string }\n> = {\n success: { icon: CheckCircle, className: 'text-success-light' },\n info: { icon: Info, className: 'text-info-light' },\n warning: { icon: Warning, className: 'text-warning-light' },\n error: { icon: Cancel, className: 'text-error-light' },\n}\n\n// Opaque radix steps (bg 2, border 6, text 11) so a floating toast never lets\n// page content bleed through the way the alpha `-soft` tokens would. The border\n// carries the tone too, otherwise a tinted toast keeps a grey outline.\nconst TONE_CLASSES: Record<Exclude<ToastType, 'loading'>, string> = {\n success: 'border-green-6 bg-green-2 text-green-11',\n info: 'border-blue-6 bg-blue-2 text-blue-11',\n warning: 'border-orange-6 bg-orange-2 text-orange-11',\n error: 'border-red-6 bg-red-2 text-red-11',\n}\n\n// Mobile-first: every position drops to a full-width stack at the top, which\n// is what the end-customer portal ships. `position` only takes effect from the\n// `sm` breakpoint up.\nconst POSITION_CLASSES: Record<ToastPosition, string> = {\n 'top-left': 'sm:top-4 sm:right-auto sm:bottom-auto sm:left-4',\n 'top-center':\n 'sm:top-4 sm:right-auto sm:bottom-auto sm:left-1/2 sm:-translate-x-1/2',\n 'top-right': 'sm:top-4 sm:right-4 sm:bottom-auto sm:left-auto',\n 'bottom-left': 'sm:top-auto sm:right-auto sm:bottom-4 sm:left-4',\n 'bottom-center':\n 'sm:top-auto sm:right-auto sm:bottom-4 sm:left-1/2 sm:-translate-x-1/2',\n 'bottom-right': 'sm:top-auto sm:right-4 sm:bottom-4 sm:left-auto',\n}\n\nconst manager = ToastPrimitive.createToastManager<ToastData>()\n\nlet sequence = 0\n\n// `label` names the content and `onClick` is wrapped, so neither reaches the\n// DOM button as-is; everything else does.\nfunction actionRest({\n label: _label,\n onClick: _onClick,\n ...rest\n}: ToastAction) {\n return rest\n}\n\nfunction toManagerOptions(\n id: string,\n title: React.ReactNode,\n type: ToastType | undefined,\n options: ToastOptions | undefined,\n) {\n const action = options?.action\n return {\n id,\n title,\n type,\n description: options?.description,\n timeout: options?.duration,\n priority: options?.priority,\n onClose: options?.onDismiss,\n // Base UI leaves the toast open after an action; dismissing matches what\n // callers expect from an \"Undo\" button.\n actionProps: action && {\n ...actionRest(action),\n children: action.label,\n onClick: (event: React.MouseEvent<HTMLButtonElement>) => {\n action.onClick?.(event)\n manager.close(id)\n },\n },\n data: { closeButton: options?.closeButton },\n }\n}\n\nconst emit =\n (type?: ToastType) =>\n (message: React.ReactNode, options?: ToastOptions): string => {\n // an id up front lets the action handler close the toast it belongs to\n const id = options?.id ?? `spark-toast-${(sequence += 1)}`\n return manager.add(toManagerOptions(id, message, type, options))\n }\n\n// A string phase becomes a titled toast of that type; an object phase keeps\n// whatever the caller set and only fills in the type.\nconst phase =\n <Value,>(\n value: ToastPromiseMessages<Value>[keyof ToastPromiseMessages<Value>],\n type: ToastType,\n ) =>\n (result: Value) => {\n const resolved = typeof value === 'function' ? value(result) : value\n return { title: resolved, type }\n }\n\nconst toast = Object.assign(emit(), {\n success: emit('success'),\n info: emit('info'),\n warning: emit('warning'),\n error: emit('error'),\n loading: emit('loading'),\n /** Dismiss one toast, or every toast when called without an id. */\n dismiss: (id?: string) => manager.close(id),\n promise: <Value,>(\n promiseValue: Promise<Value>,\n messages: ToastPromiseMessages<Value>,\n ) =>\n manager.promise(promiseValue, {\n loading: { title: messages.loading, type: 'loading' as const },\n success: phase(messages.success, 'success'),\n error: phase(messages.error as never, 'error'),\n }),\n})\n\nfunction ToastIcon({ type }: { type?: string }) {\n const icon = TOAST_ICONS[type as Exclude<ToastType, 'loading'>]\n if (type !== 'loading' && !icon) return null\n\n const Glyph = icon?.icon\n\n // Fixed box matching the title's line height, so the glyph and the spinner\n // both centre on the first line whether or not a description follows.\n return (\n <span\n aria-hidden=\"true\"\n className=\"flex h-5 w-5 shrink-0 items-center justify-center\"\n >\n {type === 'loading' ? (\n // Decorative: the toast already announces the loading message, so the\n // spinner must not add a second status live region.\n <Spinner\n className=\"text-gray-11\"\n label=\"\"\n role=\"presentation\"\n size=\"sm\"\n />\n ) : Glyph ? (\n <Glyph className={cn('[--spark-icon-size:20px]', icon.className)} />\n ) : null}\n </span>\n )\n}\n\nfunction ToastItem({\n closeButton,\n richColors,\n toast: toastObject,\n}: {\n closeButton: boolean\n richColors: boolean\n toast: ToastPrimitive.Root.ToastObject<ToastData>\n}) {\n const tone = TONE_CLASSES[toastObject.type as Exclude<ToastType, 'loading'>]\n const showClose = toastObject.data?.closeButton ?? closeButton\n\n return (\n <ToastPrimitive.Root\n data-slot=\"toast\"\n className={cn(\n // Skin only. All geometry (position, stacking, transitions, the\n // pointer bridge) lives in styles/index.css, because Tailwind's\n // `utilities` layer outranks `components` and a stray `bottom-0` here\n // would beat the stylesheet's `bottom: auto` on top-anchored stacks.\n // The border is what makes the cards behind the front one legible.\n 'flex items-start gap-2 rounded-lg border border-gray-a5 bg-gray-1 p-3 text-gray shadow-md select-none',\n richColors && tone,\n )}\n // the stack is top-anchored on mobile and bottom-anchored above `sm`, so\n // both vertical directions have to dismiss\n swipeDirection={['up', 'down', 'right']}\n toast={toastObject}\n >\n <ToastIcon type={toastObject.type} />\n <ToastPrimitive.Content className=\"flex min-w-0 flex-1 flex-col gap-0.5\">\n <ToastPrimitive.Title\n className=\"text-sm font-medium\"\n data-slot=\"toast-title\"\n />\n <ToastPrimitive.Description\n className={cn(\n 'text-sm',\n richColors && tone ? 'text-inherit' : 'text-gray-11',\n )}\n data-slot=\"toast-description\"\n />\n </ToastPrimitive.Content>\n {toastObject.actionProps ? (\n <ToastPrimitive.Action\n // -my-2 keeps the 36px control from stretching a single-line row past\n // the 20px text; self-center then lands it on the title when there is\n // no description, and mid-block when there is one\n className={cn(\n buttonVariants({ size: 'small', variant: 'primary' }),\n '-my-2 shrink-0 self-center rounded-full',\n )}\n data-slot=\"toast-action\"\n />\n ) : null}\n {showClose ? (\n <ToastPrimitive.Close\n aria-label=\"Close\"\n className={cn(\n buttonVariants({ size: 'icon-small', variant: 'tertiary' }),\n // -my-1: same reason as the action, for a 28px control\n '-my-1 -mr-1 size-7 shrink-0 self-center text-gray-11',\n )}\n data-slot=\"toast-close\"\n >\n <Close aria-hidden=\"true\" className=\"[--spark-icon-size:18px]\" />\n </ToastPrimitive.Close>\n ) : null}\n </ToastPrimitive.Root>\n )\n}\n\nfunction ToastList({\n closeButton,\n richColors,\n}: {\n closeButton: boolean\n richColors: boolean\n}) {\n const { toasts } = ToastPrimitive.useToastManager<ToastData>()\n\n return toasts.map((toastObject) => (\n <ToastItem\n closeButton={closeButton}\n key={toastObject.id}\n richColors={richColors}\n toast={toastObject}\n />\n ))\n}\n\ntype ToasterProps = {\n className?: string\n /** Corner or edge the toasts stack in. */\n position?: ToastPosition\n /** Close button on every toast; a per-toast `closeButton` wins. */\n closeButton?: boolean\n /** Tinted surfaces for success/info/warning/error toasts. */\n richColors?: boolean\n /** Default auto-dismiss time in ms. `0` disables auto-dismiss. */\n duration?: number\n /** Toasts visible at once before older ones are marked `data-limited`. */\n limit?: number\n /**\n * Vertical edge below the `sm` breakpoint, where the stack is always\n * full-width and `position` does not apply. Defaults to `top`, matching the\n * end-customer portal.\n */\n mobilePosition?: 'top' | 'bottom'\n}\n\nfunction Toaster({\n className,\n closeButton = true,\n duration = 4000,\n limit,\n mobilePosition = 'top',\n position = 'bottom-right',\n richColors = true,\n}: ToasterProps) {\n return (\n <ToastPrimitive.Provider\n limit={limit}\n timeout={duration}\n toastManager={manager}\n >\n <ToastPrimitive.Portal>\n <ToastPrimitive.Viewport\n // block + zero height: the toasts are absolutely positioned against\n // this box's bottom edge, the way Base UI's stacked example works\n className={cn(\n 'fixed inset-x-4 z-50 block h-0 outline-none',\n mobilePosition === 'top' ? 'top-4' : 'bottom-4',\n 'sm:inset-x-auto sm:w-96 sm:max-w-[calc(100vw-2rem)]',\n POSITION_CLASSES[position],\n className,\n )}\n data-mobile-side={mobilePosition}\n data-side={position.startsWith('top') ? 'top' : 'bottom'}\n data-slot=\"toaster\"\n >\n <ToastList closeButton={closeButton} richColors={richColors} />\n </ToastPrimitive.Viewport>\n </ToastPrimitive.Portal>\n </ToastPrimitive.Provider>\n )\n}\n\nexport { Toaster, toast }\nexport type {\n ToastAction,\n ToasterProps,\n ToastOptions,\n ToastPosition,\n ToastPromiseMessages,\n ToastType,\n}\n"],"mappings":"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"}
|
package/dist/components/toast.js
CHANGED
|
@@ -3,8 +3,8 @@
|
|
|
3
3
|
import { cn } from "../utils/cn.js";
|
|
4
4
|
import { buttonVariants } from "./button.js";
|
|
5
5
|
import { Spinner } from "./spinner.js";
|
|
6
|
-
import { Cancel, CheckCircle, Close, Info, Warning } from "@epilot/spark-icons";
|
|
7
6
|
import "react";
|
|
7
|
+
import { Cancel, CheckCircle, Close, Info, Warning } from "@epilot/spark-icons";
|
|
8
8
|
import { jsx, jsxs } from "react/jsx-runtime";
|
|
9
9
|
import { Toast } from "@base-ui/react/toast";
|
|
10
10
|
//#region src/components/toast.tsx
|
|
@@ -1,12 +1,12 @@
|
|
|
1
1
|
"use client";
|
|
2
2
|
Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
|
|
3
3
|
const require_chunk = require("../chunk-DY84GLCh.cjs");
|
|
4
|
-
let _epilot_spark_icons = require("@epilot/spark-icons");
|
|
5
4
|
let react = require("react");
|
|
6
5
|
react = require_chunk.__toESM(react);
|
|
6
|
+
let _epilot_spark_icons = require("@epilot/spark-icons");
|
|
7
7
|
let react_jsx_runtime = require("react/jsx-runtime");
|
|
8
8
|
let _base_ui_react_tooltip = require("@base-ui/react/tooltip");
|
|
9
|
-
let
|
|
9
|
+
let cn = require("cn");
|
|
10
10
|
//#region src/components/tooltip.tsx
|
|
11
11
|
const TooltipProvider = ({ delay = 0, ...props }) => {
|
|
12
12
|
return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_base_ui_react_tooltip.Tooltip.Provider, {
|
|
@@ -39,11 +39,11 @@ const TooltipContent = ({ className, hideArrow = false, variant = "default", chi
|
|
|
39
39
|
children: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(_base_ui_react_tooltip.Tooltip.Popup, {
|
|
40
40
|
"data-slot": "tooltip-content",
|
|
41
41
|
"data-variant": variant,
|
|
42
|
-
className: (0,
|
|
42
|
+
className: (0, cn.cn)("z-50 w-fit origin-(--transform-origin) rounded-lg p-2 text-xs leading-none transition-[opacity,scale,translate] duration-150", "data-starting-style:scale-95 data-starting-style:opacity-0", "data-[side=bottom]:data-starting-style:-translate-y-1 data-[side=left]:data-starting-style:translate-x-1 data-[side=right]:data-starting-style:-translate-x-1 data-[side=top]:data-starting-style:translate-y-1", "data-ending-style:opacity-0 data-ending-style:duration-0", "data-[variant=default]:bg-gray-12 data-[variant=default]:text-gray-1", "data-[variant=destructive]:bg-red-12 data-[variant=destructive]:text-red-1", className),
|
|
43
43
|
...props,
|
|
44
44
|
children: [children, !hideArrow && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_base_ui_react_tooltip.Tooltip.Arrow, {
|
|
45
45
|
"data-variant": variant,
|
|
46
|
-
className: (0,
|
|
46
|
+
className: (0, cn.cn)("z-50", "data-[side=bottom]:top-[-8px]", "data-[side=top]:bottom-[-8px] data-[side=top]:rotate-180", "data-[side=left]:right-[-13px] data-[side=left]:rotate-90", "data-[side=right]:left-[-13px] data-[side=right]:-rotate-90", "data-[variant=default]:text-gray-12", "data-[variant=destructive]:text-red-12"),
|
|
47
47
|
children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)("svg", {
|
|
48
48
|
fill: "none",
|
|
49
49
|
height: "10",
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"tooltip.cjs","names":["TooltipPrimitive","Info"],"sources":["../../src/components/tooltip.tsx"],"sourcesContent":["import { Tooltip as TooltipPrimitive } from '@base-ui/react/tooltip'\nimport { Info } from '@epilot/spark-icons'\nimport * as React from 'react'\nimport { cn } from '../utils/cn'\n\nconst TooltipProvider = ({\n delay = 0,\n ...props\n}: React.ComponentProps<typeof TooltipPrimitive.Provider>) => {\n return <TooltipPrimitive.Provider delay={delay} {...props} />\n}\n\nconst TooltipPortal = ({\n ...props\n}: React.ComponentProps<typeof TooltipPrimitive.Portal>) => {\n return <TooltipPrimitive.Portal data-slot=\"tooltip-portal\" {...props} />\n}\n\ntype TooltipProps = React.ComponentProps<typeof TooltipPrimitive.Root>\n\nconst Tooltip = ({ ...props }: TooltipProps) => {\n return <TooltipPrimitive.Root {...props} />\n}\n\nconst TooltipTrigger = ({\n ...props\n}: React.ComponentProps<typeof TooltipPrimitive.Trigger>) => {\n return <TooltipPrimitive.Trigger data-slot=\"tooltip-trigger\" {...props} />\n}\n\ntype TooltipContentProps = React.ComponentProps<typeof TooltipPrimitive.Popup> &\n Pick<\n TooltipPrimitive.Positioner.Props,\n 'align' | 'alignOffset' | 'side' | 'sideOffset'\n > & {\n hideArrow?: boolean\n variant?: 'default' | 'destructive'\n }\n\nconst TooltipContent = ({\n className,\n hideArrow = false,\n variant = 'default',\n children,\n align,\n alignOffset,\n side,\n sideOffset = 4,\n ...props\n}: TooltipContentProps) => {\n return (\n <TooltipPrimitive.Portal>\n <TooltipPrimitive.Positioner\n align={align}\n alignOffset={alignOffset}\n className=\"isolate z-50\"\n side={side}\n sideOffset={sideOffset}\n >\n <TooltipPrimitive.Popup\n data-slot=\"tooltip-content\"\n data-variant={variant}\n className={cn(\n 'z-50 w-fit origin-(--transform-origin) rounded-lg p-2 text-xs leading-none transition-[opacity,scale,translate] duration-150',\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-1 data-[side=left]:data-starting-style:translate-x-1 data-[side=right]:data-starting-style:-translate-x-1 data-[side=top]:data-starting-style:translate-y-1',\n // exit: instant (was data-[state=closed]:duration-0)\n 'data-ending-style:opacity-0 data-ending-style:duration-0',\n 'data-[variant=default]:bg-gray-12 data-[variant=default]:text-gray-1',\n 'data-[variant=destructive]:bg-red-12 data-[variant=destructive]:text-red-1',\n className,\n )}\n {...props}\n >\n {children}\n {!hideArrow && (\n <TooltipPrimitive.Arrow\n data-variant={variant}\n className={cn(\n 'z-50',\n // svg tip points up; rotate per side, overlap 2px for a seamless join\n 'data-[side=bottom]:top-[-8px]',\n 'data-[side=top]:bottom-[-8px] data-[side=top]:rotate-180',\n 'data-[side=left]:right-[-13px] data-[side=left]:rotate-90',\n 'data-[side=right]:left-[-13px] data-[side=right]:-rotate-90',\n 'data-[variant=default]:text-gray-12',\n 'data-[variant=destructive]:text-red-12',\n )}\n >\n <svg fill=\"none\" height=\"10\" viewBox=\"0 0 20 10\" width=\"20\">\n <path\n d=\"M9.66437 2.60207L4.80758 6.97318C4.07308 7.63423 3.11989 8 2.13172 8H0V10H20V8H18.5349C17.5468 8 16.5936 7.63423 15.8591 6.97318L11.0023 2.60207C10.622 2.2598 10.0447 2.25979 9.66437 2.60207Z\"\n fill=\"currentColor\"\n />\n </svg>\n </TooltipPrimitive.Arrow>\n )}\n </TooltipPrimitive.Popup>\n </TooltipPrimitive.Positioner>\n </TooltipPrimitive.Portal>\n )\n}\n\ninterface InfoTooltipProps {\n content: string\n label: string\n 'aria-label'?: string\n}\n\nconst InfoTooltip = ({\n content,\n label,\n 'aria-label': ariaLabel,\n}: InfoTooltipProps) => {\n return (\n <Tooltip>\n <TooltipTrigger\n render={\n <button\n aria-label={ariaLabel ?? label}\n className=\"touch-target inline-flex size-6 min-h-[24px] min-w-[24px] shrink-0 cursor-help items-center justify-center rounded-full p-0 text-gray-light transition-colors hover:text-gray focus-visible:ring-2 focus-visible:ring-primary focus-visible:outline-none\"\n type=\"button\"\n />\n }\n >\n <Info className=\"text-sm!\" />\n </TooltipTrigger>\n <TooltipContent className=\"max-w-xs whitespace-pre-line\">\n {content}\n </TooltipContent>\n </Tooltip>\n )\n}\n\nexport {\n Tooltip,\n TooltipTrigger,\n TooltipContent,\n TooltipProvider,\n TooltipPortal,\n InfoTooltip,\n}\n"],"mappings":";;;;;;;;;;AAKA,MAAM,mBAAmB,EACvB,QAAQ,GACR,GAAG,YACyD;CAC5D,OAAO,iBAAA,GAAA,kBAAA,KAACA,uBAAAA,QAAiB,UAAlB;EAAkC;EAAO,GAAI;CAAQ,CAAA;AAC9D;AAEA,MAAM,iBAAiB,EACrB,GAAG,YACuD;CAC1D,OAAO,iBAAA,GAAA,kBAAA,KAACA,uBAAAA,QAAiB,QAAlB;EAAyB,aAAU;EAAiB,GAAI;CAAQ,CAAA;AACzE;AAIA,MAAM,WAAW,EAAE,GAAG,YAA0B;CAC9C,OAAO,iBAAA,GAAA,kBAAA,KAACA,uBAAAA,QAAiB,MAAlB,EAAuB,GAAI,MAAQ,CAAA;AAC5C;AAEA,MAAM,kBAAkB,EACtB,GAAG,YACwD;CAC3D,OAAO,iBAAA,GAAA,kBAAA,KAACA,uBAAAA,QAAiB,SAAlB;EAA0B,aAAU;EAAkB,GAAI;CAAQ,CAAA;AAC3E;AAWA,MAAM,kBAAkB,EACtB,WACA,YAAY,OACZ,UAAU,WACV,UACA,OACA,aACA,MACA,aAAa,GACb,GAAG,YACsB;CACzB,OACE,iBAAA,GAAA,kBAAA,KAACA,uBAAAA,QAAiB,QAAlB,EAAA,UACE,iBAAA,GAAA,kBAAA,KAACA,uBAAAA,QAAiB,YAAlB;EACS;EACM;EACb,WAAU;EACJ;EACM;YAEZ,iBAAA,GAAA,kBAAA,MAACA,uBAAAA,QAAiB,OAAlB;GACE,aAAU;GACV,gBAAc;GACd,YAAA,GAAA,
|
|
1
|
+
{"version":3,"file":"tooltip.cjs","names":["TooltipPrimitive","Info"],"sources":["../../src/components/tooltip.tsx"],"sourcesContent":["import { Tooltip as TooltipPrimitive } from '@base-ui/react/tooltip'\nimport { Info } from '@epilot/spark-icons'\nimport * as React from 'react'\nimport { cn } from '../utils/cn'\n\nconst TooltipProvider = ({\n delay = 0,\n ...props\n}: React.ComponentProps<typeof TooltipPrimitive.Provider>) => {\n return <TooltipPrimitive.Provider delay={delay} {...props} />\n}\n\nconst TooltipPortal = ({\n ...props\n}: React.ComponentProps<typeof TooltipPrimitive.Portal>) => {\n return <TooltipPrimitive.Portal data-slot=\"tooltip-portal\" {...props} />\n}\n\ntype TooltipProps = React.ComponentProps<typeof TooltipPrimitive.Root>\n\nconst Tooltip = ({ ...props }: TooltipProps) => {\n return <TooltipPrimitive.Root {...props} />\n}\n\nconst TooltipTrigger = ({\n ...props\n}: React.ComponentProps<typeof TooltipPrimitive.Trigger>) => {\n return <TooltipPrimitive.Trigger data-slot=\"tooltip-trigger\" {...props} />\n}\n\ntype TooltipContentProps = React.ComponentProps<typeof TooltipPrimitive.Popup> &\n Pick<\n TooltipPrimitive.Positioner.Props,\n 'align' | 'alignOffset' | 'side' | 'sideOffset'\n > & {\n hideArrow?: boolean\n variant?: 'default' | 'destructive'\n }\n\nconst TooltipContent = ({\n className,\n hideArrow = false,\n variant = 'default',\n children,\n align,\n alignOffset,\n side,\n sideOffset = 4,\n ...props\n}: TooltipContentProps) => {\n return (\n <TooltipPrimitive.Portal>\n <TooltipPrimitive.Positioner\n align={align}\n alignOffset={alignOffset}\n className=\"isolate z-50\"\n side={side}\n sideOffset={sideOffset}\n >\n <TooltipPrimitive.Popup\n data-slot=\"tooltip-content\"\n data-variant={variant}\n className={cn(\n 'z-50 w-fit origin-(--transform-origin) rounded-lg p-2 text-xs leading-none transition-[opacity,scale,translate] duration-150',\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-1 data-[side=left]:data-starting-style:translate-x-1 data-[side=right]:data-starting-style:-translate-x-1 data-[side=top]:data-starting-style:translate-y-1',\n // exit: instant (was data-[state=closed]:duration-0)\n 'data-ending-style:opacity-0 data-ending-style:duration-0',\n 'data-[variant=default]:bg-gray-12 data-[variant=default]:text-gray-1',\n 'data-[variant=destructive]:bg-red-12 data-[variant=destructive]:text-red-1',\n className,\n )}\n {...props}\n >\n {children}\n {!hideArrow && (\n <TooltipPrimitive.Arrow\n data-variant={variant}\n className={cn(\n 'z-50',\n // svg tip points up; rotate per side, overlap 2px for a seamless join\n 'data-[side=bottom]:top-[-8px]',\n 'data-[side=top]:bottom-[-8px] data-[side=top]:rotate-180',\n 'data-[side=left]:right-[-13px] data-[side=left]:rotate-90',\n 'data-[side=right]:left-[-13px] data-[side=right]:-rotate-90',\n 'data-[variant=default]:text-gray-12',\n 'data-[variant=destructive]:text-red-12',\n )}\n >\n <svg fill=\"none\" height=\"10\" viewBox=\"0 0 20 10\" width=\"20\">\n <path\n d=\"M9.66437 2.60207L4.80758 6.97318C4.07308 7.63423 3.11989 8 2.13172 8H0V10H20V8H18.5349C17.5468 8 16.5936 7.63423 15.8591 6.97318L11.0023 2.60207C10.622 2.2598 10.0447 2.25979 9.66437 2.60207Z\"\n fill=\"currentColor\"\n />\n </svg>\n </TooltipPrimitive.Arrow>\n )}\n </TooltipPrimitive.Popup>\n </TooltipPrimitive.Positioner>\n </TooltipPrimitive.Portal>\n )\n}\n\ninterface InfoTooltipProps {\n content: string\n label: string\n 'aria-label'?: string\n}\n\nconst InfoTooltip = ({\n content,\n label,\n 'aria-label': ariaLabel,\n}: InfoTooltipProps) => {\n return (\n <Tooltip>\n <TooltipTrigger\n render={\n <button\n aria-label={ariaLabel ?? label}\n className=\"touch-target inline-flex size-6 min-h-[24px] min-w-[24px] shrink-0 cursor-help items-center justify-center rounded-full p-0 text-gray-light transition-colors hover:text-gray focus-visible:ring-2 focus-visible:ring-primary focus-visible:outline-none\"\n type=\"button\"\n />\n }\n >\n <Info className=\"text-sm!\" />\n </TooltipTrigger>\n <TooltipContent className=\"max-w-xs whitespace-pre-line\">\n {content}\n </TooltipContent>\n </Tooltip>\n )\n}\n\nexport {\n Tooltip,\n TooltipTrigger,\n TooltipContent,\n TooltipProvider,\n TooltipPortal,\n InfoTooltip,\n}\n"],"mappings":";;;;;;;;;;AAKA,MAAM,mBAAmB,EACvB,QAAQ,GACR,GAAG,YACyD;CAC5D,OAAO,iBAAA,GAAA,kBAAA,KAACA,uBAAAA,QAAiB,UAAlB;EAAkC;EAAO,GAAI;CAAQ,CAAA;AAC9D;AAEA,MAAM,iBAAiB,EACrB,GAAG,YACuD;CAC1D,OAAO,iBAAA,GAAA,kBAAA,KAACA,uBAAAA,QAAiB,QAAlB;EAAyB,aAAU;EAAiB,GAAI;CAAQ,CAAA;AACzE;AAIA,MAAM,WAAW,EAAE,GAAG,YAA0B;CAC9C,OAAO,iBAAA,GAAA,kBAAA,KAACA,uBAAAA,QAAiB,MAAlB,EAAuB,GAAI,MAAQ,CAAA;AAC5C;AAEA,MAAM,kBAAkB,EACtB,GAAG,YACwD;CAC3D,OAAO,iBAAA,GAAA,kBAAA,KAACA,uBAAAA,QAAiB,SAAlB;EAA0B,aAAU;EAAkB,GAAI;CAAQ,CAAA;AAC3E;AAWA,MAAM,kBAAkB,EACtB,WACA,YAAY,OACZ,UAAU,WACV,UACA,OACA,aACA,MACA,aAAa,GACb,GAAG,YACsB;CACzB,OACE,iBAAA,GAAA,kBAAA,KAACA,uBAAAA,QAAiB,QAAlB,EAAA,UACE,iBAAA,GAAA,kBAAA,KAACA,uBAAAA,QAAiB,YAAlB;EACS;EACM;EACb,WAAU;EACJ;EACM;YAEZ,iBAAA,GAAA,kBAAA,MAACA,uBAAAA,QAAiB,OAAlB;GACE,aAAU;GACV,gBAAc;GACd,YAAA,GAAA,GAAA,IACE,gIAEA,8DACA,mNAEA,4DACA,wEACA,8EACA,SACF;GACA,GAAI;aAdN,CAgBG,UACA,CAAC,aACA,iBAAA,GAAA,kBAAA,KAACA,uBAAAA,QAAiB,OAAlB;IACE,gBAAc;IACd,YAAA,GAAA,GAAA,IACE,QAEA,iCACA,4DACA,6DACA,+DACA,uCACA,wCACF;cAEA,iBAAA,GAAA,kBAAA,KAAC,OAAD;KAAK,MAAK;KAAO,QAAO;KAAK,SAAQ;KAAY,OAAM;eACrD,iBAAA,GAAA,kBAAA,KAAC,QAAD;MACE,GAAE;MACF,MAAK;KACN,CAAA;IACE,CAAA;GACiB,CAAA,CAEJ;;CACG,CAAA,EACN,CAAA;AAE7B;AAQA,MAAM,eAAe,EACnB,SACA,OACA,cAAc,gBACQ;CACtB,OACE,iBAAA,GAAA,kBAAA,MAAC,SAAD,EAAA,UAAA,CACE,iBAAA,GAAA,kBAAA,KAAC,gBAAD;EACE,QACE,iBAAA,GAAA,kBAAA,KAAC,UAAD;GACE,cAAY,aAAa;GACzB,WAAU;GACV,MAAK;EACN,CAAA;YAGH,iBAAA,GAAA,kBAAA,KAACC,oBAAAA,MAAD,EAAM,WAAU,WAAY,CAAA;CACd,CAAA,GAChB,iBAAA,GAAA,kBAAA,KAAC,gBAAD;EAAgB,WAAU;YACvB;CACa,CAAA,CACT,EAAA,CAAA;AAEb"}
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
"use client";
|
|
2
2
|
import { cn } from "../utils/cn.js";
|
|
3
|
-
import { Info } from "@epilot/spark-icons";
|
|
4
3
|
import "react";
|
|
4
|
+
import { Info } from "@epilot/spark-icons";
|
|
5
5
|
import { jsx, jsxs } from "react/jsx-runtime";
|
|
6
6
|
import { Tooltip as Tooltip$1 } from "@base-ui/react/tooltip";
|
|
7
7
|
//#region src/components/tooltip.tsx
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
"use client";
|
|
2
2
|
Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
|
|
3
3
|
let react_jsx_runtime = require("react/jsx-runtime");
|
|
4
|
-
let
|
|
4
|
+
let cn = require("cn");
|
|
5
5
|
//#region src/components/typography.tsx
|
|
6
6
|
const PowerValue = ({ "aria-label": ariaLabel, ...props }) => {
|
|
7
7
|
return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("h2", {
|
|
@@ -12,31 +12,31 @@ const PowerValue = ({ "aria-label": ariaLabel, ...props }) => {
|
|
|
12
12
|
};
|
|
13
13
|
const PageTitle = ({ className, ...props }) => {
|
|
14
14
|
return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("h2", {
|
|
15
|
-
className: (0,
|
|
15
|
+
className: (0, cn.cn)("text-xl font-bold wrap-break-word", className),
|
|
16
16
|
...props
|
|
17
17
|
});
|
|
18
18
|
};
|
|
19
19
|
const SectionTitle = ({ className, ...props }) => {
|
|
20
20
|
return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("h3", {
|
|
21
|
-
className: (0,
|
|
21
|
+
className: (0, cn.cn)("text-base font-bold text-gray", className),
|
|
22
22
|
...props
|
|
23
23
|
});
|
|
24
24
|
};
|
|
25
25
|
const SectionDescription = ({ className, ...props }) => {
|
|
26
26
|
return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("p", {
|
|
27
|
-
className: (0,
|
|
27
|
+
className: (0, cn.cn)("text-sm text-gray-light", className),
|
|
28
28
|
...props
|
|
29
29
|
});
|
|
30
30
|
};
|
|
31
31
|
const SectionSubtitle = ({ className, ...props }) => {
|
|
32
32
|
return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("h4", {
|
|
33
|
-
className: (0,
|
|
33
|
+
className: (0, cn.cn)("text-sm font-bold tracking-wider text-gray-light uppercase", className),
|
|
34
34
|
...props
|
|
35
35
|
});
|
|
36
36
|
};
|
|
37
37
|
const StateValue = ({ className, ...props }) => {
|
|
38
38
|
return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
|
|
39
|
-
className: (0,
|
|
39
|
+
className: (0, cn.cn)("text-xl font-black tabular-nums", className),
|
|
40
40
|
...props
|
|
41
41
|
});
|
|
42
42
|
};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"typography.cjs","names":[],"sources":["../../src/components/typography.tsx"],"sourcesContent":["import { cn } from '../utils/cn'\n\ntype PowerValueProps = Omit<React.ComponentProps<'h2'>, 'aria-label'> & {\n 'aria-label': string\n}\n\nconst PowerValue = ({ 'aria-label': ariaLabel, ...props }: PowerValueProps) => {\n return (\n <h2\n className=\"text-3xl font-bold text-gray tabular-nums\"\n aria-label={ariaLabel}\n {...props}\n />\n )\n}\n\nconst PageTitle = ({ className, ...props }: React.ComponentProps<'h2'>) => {\n return (\n <h2\n className={cn('text-xl font-bold wrap-break-word', className)}\n {...props}\n />\n )\n}\n\nconst SectionTitle = ({ className, ...props }: React.ComponentProps<'h2'>) => {\n return (\n <h3 className={cn('text-base font-bold text-gray', className)} {...props} />\n )\n}\n\nconst SectionDescription = ({\n className,\n ...props\n}: React.ComponentProps<'p'>) => {\n return <p className={cn('text-sm text-gray-light', className)} {...props} />\n}\n\nconst SectionSubtitle = ({\n className,\n ...props\n}: React.ComponentProps<'h3'>) => {\n return (\n <h4\n className={cn(\n 'text-sm font-bold tracking-wider text-gray-light uppercase',\n className,\n )}\n {...props}\n />\n )\n}\n\nconst StateValue = ({ className, ...props }: React.ComponentProps<'span'>) => {\n return (\n <span\n className={cn('text-xl font-black tabular-nums', className)}\n {...props}\n />\n )\n}\n\nexport {\n PowerValue,\n PageTitle,\n SectionTitle,\n SectionDescription,\n SectionSubtitle,\n StateValue,\n}\n"],"mappings":";;;;;AAMA,MAAM,cAAc,EAAE,cAAc,WAAW,GAAG,YAA6B;CAC7E,OACE,iBAAA,GAAA,kBAAA,KAAC,MAAD;EACE,WAAU;EACV,cAAY;EACZ,GAAI;CACL,CAAA;AAEL;AAEA,MAAM,aAAa,EAAE,WAAW,GAAG,YAAwC;CACzE,OACE,iBAAA,GAAA,kBAAA,KAAC,MAAD;EACE,YAAA,GAAA,
|
|
1
|
+
{"version":3,"file":"typography.cjs","names":[],"sources":["../../src/components/typography.tsx"],"sourcesContent":["import { cn } from '../utils/cn'\n\ntype PowerValueProps = Omit<React.ComponentProps<'h2'>, 'aria-label'> & {\n 'aria-label': string\n}\n\nconst PowerValue = ({ 'aria-label': ariaLabel, ...props }: PowerValueProps) => {\n return (\n <h2\n className=\"text-3xl font-bold text-gray tabular-nums\"\n aria-label={ariaLabel}\n {...props}\n />\n )\n}\n\nconst PageTitle = ({ className, ...props }: React.ComponentProps<'h2'>) => {\n return (\n <h2\n className={cn('text-xl font-bold wrap-break-word', className)}\n {...props}\n />\n )\n}\n\nconst SectionTitle = ({ className, ...props }: React.ComponentProps<'h2'>) => {\n return (\n <h3 className={cn('text-base font-bold text-gray', className)} {...props} />\n )\n}\n\nconst SectionDescription = ({\n className,\n ...props\n}: React.ComponentProps<'p'>) => {\n return <p className={cn('text-sm text-gray-light', className)} {...props} />\n}\n\nconst SectionSubtitle = ({\n className,\n ...props\n}: React.ComponentProps<'h3'>) => {\n return (\n <h4\n className={cn(\n 'text-sm font-bold tracking-wider text-gray-light uppercase',\n className,\n )}\n {...props}\n />\n )\n}\n\nconst StateValue = ({ className, ...props }: React.ComponentProps<'span'>) => {\n return (\n <span\n className={cn('text-xl font-black tabular-nums', className)}\n {...props}\n />\n )\n}\n\nexport {\n PowerValue,\n PageTitle,\n SectionTitle,\n SectionDescription,\n SectionSubtitle,\n StateValue,\n}\n"],"mappings":";;;;;AAMA,MAAM,cAAc,EAAE,cAAc,WAAW,GAAG,YAA6B;CAC7E,OACE,iBAAA,GAAA,kBAAA,KAAC,MAAD;EACE,WAAU;EACV,cAAY;EACZ,GAAI;CACL,CAAA;AAEL;AAEA,MAAM,aAAa,EAAE,WAAW,GAAG,YAAwC;CACzE,OACE,iBAAA,GAAA,kBAAA,KAAC,MAAD;EACE,YAAA,GAAA,GAAA,IAAc,qCAAqC,SAAS;EAC5D,GAAI;CACL,CAAA;AAEL;AAEA,MAAM,gBAAgB,EAAE,WAAW,GAAG,YAAwC;CAC5E,OACE,iBAAA,GAAA,kBAAA,KAAC,MAAD;EAAI,YAAA,GAAA,GAAA,IAAc,iCAAiC,SAAS;EAAG,GAAI;CAAQ,CAAA;AAE/E;AAEA,MAAM,sBAAsB,EAC1B,WACA,GAAG,YAC4B;CAC/B,OAAO,iBAAA,GAAA,kBAAA,KAAC,KAAD;EAAG,YAAA,GAAA,GAAA,IAAc,2BAA2B,SAAS;EAAG,GAAI;CAAQ,CAAA;AAC7E;AAEA,MAAM,mBAAmB,EACvB,WACA,GAAG,YAC6B;CAChC,OACE,iBAAA,GAAA,kBAAA,KAAC,MAAD;EACE,YAAA,GAAA,GAAA,IACE,8DACA,SACF;EACA,GAAI;CACL,CAAA;AAEL;AAEA,MAAM,cAAc,EAAE,WAAW,GAAG,YAA0C;CAC5E,OACE,iBAAA,GAAA,kBAAA,KAAC,QAAD;EACE,YAAA,GAAA,GAAA,IAAc,mCAAmC,SAAS;EAC1D,GAAI;CACL,CAAA;AAEL"}
|
|
@@ -1,47 +1,47 @@
|
|
|
1
1
|
"use client";
|
|
2
2
|
Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
|
|
3
3
|
let react_jsx_runtime = require("react/jsx-runtime");
|
|
4
|
-
let
|
|
4
|
+
let cn = require("cn");
|
|
5
5
|
//#region src/components/wizard-layout.tsx
|
|
6
6
|
const WizardLayout = ({ className, ...rest }) => {
|
|
7
7
|
return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
|
|
8
|
-
className: (0,
|
|
8
|
+
className: (0, cn.cn)("flex flex-col gap-[calc(var(--spark-layout-gap)*6)]", className),
|
|
9
9
|
...rest
|
|
10
10
|
});
|
|
11
11
|
};
|
|
12
12
|
const WizardLayoutHeader = ({ className, ...rest }) => {
|
|
13
13
|
return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
|
|
14
|
-
className: (0,
|
|
14
|
+
className: (0, cn.cn)("flex flex-col gap-[calc(var(--spark-layout-gap)*3)] pt-4", className),
|
|
15
15
|
...rest
|
|
16
16
|
});
|
|
17
17
|
};
|
|
18
18
|
const WizardLayoutHeading = ({ className, ...rest }) => {
|
|
19
19
|
return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
|
|
20
|
-
className: (0,
|
|
20
|
+
className: (0, cn.cn)("flex flex-col gap-[calc(var(--spark-layout-gap)*1)]", className),
|
|
21
21
|
...rest
|
|
22
22
|
});
|
|
23
23
|
};
|
|
24
24
|
const WizardLayoutTitleRow = ({ className, ...rest }) => {
|
|
25
25
|
return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
|
|
26
|
-
className: (0,
|
|
26
|
+
className: (0, cn.cn)("flex items-center justify-between", className),
|
|
27
27
|
...rest
|
|
28
28
|
});
|
|
29
29
|
};
|
|
30
30
|
const WizardLayoutTitle = ({ className, ...rest }) => {
|
|
31
31
|
return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("h2", {
|
|
32
|
-
className: (0,
|
|
32
|
+
className: (0, cn.cn)("text-lg font-bold text-gray", className),
|
|
33
33
|
...rest
|
|
34
34
|
});
|
|
35
35
|
};
|
|
36
36
|
const WizardLayoutDescription = ({ className, ...rest }) => {
|
|
37
37
|
return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("p", {
|
|
38
|
-
className: (0,
|
|
38
|
+
className: (0, cn.cn)("text-sm text-gray-light", className),
|
|
39
39
|
...rest
|
|
40
40
|
});
|
|
41
41
|
};
|
|
42
42
|
const WizardLayoutFooter = ({ className, ...rest }) => {
|
|
43
43
|
return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
|
|
44
|
-
className: (0,
|
|
44
|
+
className: (0, cn.cn)("flex items-center justify-between", className),
|
|
45
45
|
...rest
|
|
46
46
|
});
|
|
47
47
|
};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"wizard-layout.cjs","names":[],"sources":["../../src/components/wizard-layout.tsx"],"sourcesContent":["import { cn } from '../utils/cn'\n\nconst WizardLayout = ({ className, ...rest }: React.ComponentProps<'div'>) => {\n return (\n <div\n className={cn(\n 'flex flex-col gap-[calc(var(--spark-layout-gap)*6)]',\n className,\n )}\n {...rest}\n />\n )\n}\n\nconst WizardLayoutHeader = ({\n className,\n ...rest\n}: React.ComponentProps<'div'>) => {\n return (\n <div\n className={cn(\n 'flex flex-col gap-[calc(var(--spark-layout-gap)*3)] pt-4',\n className,\n )}\n {...rest}\n />\n )\n}\n\nconst WizardLayoutHeading = ({\n className,\n ...rest\n}: React.ComponentProps<'div'>) => {\n return (\n <div\n className={cn(\n 'flex flex-col gap-[calc(var(--spark-layout-gap)*1)]',\n className,\n )}\n {...rest}\n />\n )\n}\n\nconst WizardLayoutTitleRow = ({\n className,\n ...rest\n}: React.ComponentProps<'div'>) => {\n return (\n <div\n className={cn('flex items-center justify-between', className)}\n {...rest}\n />\n )\n}\n\nconst WizardLayoutTitle = ({\n className,\n ...rest\n}: React.ComponentProps<'h2'>) => {\n return (\n <h2 className={cn('text-lg font-bold text-gray', className)} {...rest} />\n )\n}\n\nconst WizardLayoutDescription = ({\n className,\n ...rest\n}: React.ComponentProps<'p'>) => {\n return <p className={cn('text-sm text-gray-light', className)} {...rest} />\n}\n\nconst WizardLayoutFooter = ({\n className,\n ...rest\n}: React.ComponentProps<'div'>) => {\n return (\n <div\n className={cn('flex items-center justify-between', className)}\n {...rest}\n />\n )\n}\n\nexport {\n WizardLayout,\n WizardLayoutHeader,\n WizardLayoutHeading,\n WizardLayoutTitleRow,\n WizardLayoutTitle,\n WizardLayoutDescription,\n WizardLayoutFooter,\n}\n"],"mappings":";;;;;AAEA,MAAM,gBAAgB,EAAE,WAAW,GAAG,WAAwC;CAC5E,OACE,iBAAA,GAAA,kBAAA,KAAC,OAAD;EACE,YAAA,GAAA,
|
|
1
|
+
{"version":3,"file":"wizard-layout.cjs","names":[],"sources":["../../src/components/wizard-layout.tsx"],"sourcesContent":["import { cn } from '../utils/cn'\n\nconst WizardLayout = ({ className, ...rest }: React.ComponentProps<'div'>) => {\n return (\n <div\n className={cn(\n 'flex flex-col gap-[calc(var(--spark-layout-gap)*6)]',\n className,\n )}\n {...rest}\n />\n )\n}\n\nconst WizardLayoutHeader = ({\n className,\n ...rest\n}: React.ComponentProps<'div'>) => {\n return (\n <div\n className={cn(\n 'flex flex-col gap-[calc(var(--spark-layout-gap)*3)] pt-4',\n className,\n )}\n {...rest}\n />\n )\n}\n\nconst WizardLayoutHeading = ({\n className,\n ...rest\n}: React.ComponentProps<'div'>) => {\n return (\n <div\n className={cn(\n 'flex flex-col gap-[calc(var(--spark-layout-gap)*1)]',\n className,\n )}\n {...rest}\n />\n )\n}\n\nconst WizardLayoutTitleRow = ({\n className,\n ...rest\n}: React.ComponentProps<'div'>) => {\n return (\n <div\n className={cn('flex items-center justify-between', className)}\n {...rest}\n />\n )\n}\n\nconst WizardLayoutTitle = ({\n className,\n ...rest\n}: React.ComponentProps<'h2'>) => {\n return (\n <h2 className={cn('text-lg font-bold text-gray', className)} {...rest} />\n )\n}\n\nconst WizardLayoutDescription = ({\n className,\n ...rest\n}: React.ComponentProps<'p'>) => {\n return <p className={cn('text-sm text-gray-light', className)} {...rest} />\n}\n\nconst WizardLayoutFooter = ({\n className,\n ...rest\n}: React.ComponentProps<'div'>) => {\n return (\n <div\n className={cn('flex items-center justify-between', className)}\n {...rest}\n />\n )\n}\n\nexport {\n WizardLayout,\n WizardLayoutHeader,\n WizardLayoutHeading,\n WizardLayoutTitleRow,\n WizardLayoutTitle,\n WizardLayoutDescription,\n WizardLayoutFooter,\n}\n"],"mappings":";;;;;AAEA,MAAM,gBAAgB,EAAE,WAAW,GAAG,WAAwC;CAC5E,OACE,iBAAA,GAAA,kBAAA,KAAC,OAAD;EACE,YAAA,GAAA,GAAA,IACE,uDACA,SACF;EACA,GAAI;CACL,CAAA;AAEL;AAEA,MAAM,sBAAsB,EAC1B,WACA,GAAG,WAC8B;CACjC,OACE,iBAAA,GAAA,kBAAA,KAAC,OAAD;EACE,YAAA,GAAA,GAAA,IACE,4DACA,SACF;EACA,GAAI;CACL,CAAA;AAEL;AAEA,MAAM,uBAAuB,EAC3B,WACA,GAAG,WAC8B;CACjC,OACE,iBAAA,GAAA,kBAAA,KAAC,OAAD;EACE,YAAA,GAAA,GAAA,IACE,uDACA,SACF;EACA,GAAI;CACL,CAAA;AAEL;AAEA,MAAM,wBAAwB,EAC5B,WACA,GAAG,WAC8B;CACjC,OACE,iBAAA,GAAA,kBAAA,KAAC,OAAD;EACE,YAAA,GAAA,GAAA,IAAc,qCAAqC,SAAS;EAC5D,GAAI;CACL,CAAA;AAEL;AAEA,MAAM,qBAAqB,EACzB,WACA,GAAG,WAC6B;CAChC,OACE,iBAAA,GAAA,kBAAA,KAAC,MAAD;EAAI,YAAA,GAAA,GAAA,IAAc,+BAA+B,SAAS;EAAG,GAAI;CAAO,CAAA;AAE5E;AAEA,MAAM,2BAA2B,EAC/B,WACA,GAAG,WAC4B;CAC/B,OAAO,iBAAA,GAAA,kBAAA,KAAC,KAAD;EAAG,YAAA,GAAA,GAAA,IAAc,2BAA2B,SAAS;EAAG,GAAI;CAAO,CAAA;AAC5E;AAEA,MAAM,sBAAsB,EAC1B,WACA,GAAG,WAC8B;CACjC,OACE,iBAAA,GAAA,kBAAA,KAAC,OAAD;EACE,YAAA,GAAA,GAAA,IAAc,qCAAqC,SAAS;EAC5D,GAAI;CACL,CAAA;AAEL"}
|
|
@@ -1,26 +1,26 @@
|
|
|
1
1
|
"use client";
|
|
2
2
|
Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
|
|
3
|
-
let
|
|
3
|
+
let cn = require("cn");
|
|
4
4
|
//#region src/lib/input-box-variants.ts
|
|
5
5
|
const GHOST_UNDERLINE = "h-10 rounded-none border-0 border-b-2 px-0 py-2 text-base focus:border-b-input-active focus-visible:border-b-input-active user-valid:border-b-input-active user-invalid:border-b-input-invalid user-invalid:text-error user-invalid:focus:border-b-red-a8! user-invalid:focus-visible:border-b-red-a8! aria-invalid:border-b-input-invalid aria-invalid:text-error aria-invalid:focus:border-b-red-a8! aria-invalid:focus-visible:border-b-red-a8! group-data-[invalid=true]/field:border-b-input-invalid! group-data-[invalid=true]/field:text-error group-data-[invalid=true]/field:focus:border-b-red-a8! group-data-[invalid=true]/field:focus-visible:border-b-red-a8! disabled:border-b-input-disabled";
|
|
6
6
|
const SOFT_BASE = "user-invalid:bg-base-error-soft user-invalid:text-error user-invalid:not-disabled:hover:bg-red-a4 focus-visible:ring-2 focus-visible:ring-offset-2 user-invalid:focus-visible:ring-red-a8 disabled:bg-base-gray-soft disabled:opacity-50 aria-invalid:bg-base-error-soft aria-invalid:text-error aria-invalid:not-disabled:hover:bg-red-a4 aria-invalid:focus-visible:ring-red-a8 group-data-[invalid=true]/field:bg-base-error-soft group-data-[invalid=true]/field:text-error group-data-[invalid=true]/field:not-disabled:hover:bg-red-a4 group-data-[invalid=true]/field:focus-visible:ring-red-a8";
|
|
7
7
|
const BORDERED = "border user-invalid:border-input-invalid user-invalid:text-error focus-visible:ring-1 user-invalid:focus-visible:border-input-invalid! user-invalid:focus-visible:ring-red-a4! disabled:border-input-disabled disabled:opacity-50 aria-invalid:border-input-invalid aria-invalid:text-error aria-invalid:focus-visible:border-input-invalid! aria-invalid:focus-visible:ring-red-a4! group-data-[invalid=true]/field:border-input-invalid group-data-[invalid=true]/field:text-error group-data-[invalid=true]/field:focus-visible:border-input-invalid! group-data-[invalid=true]/field:focus-visible:ring-red-a4!";
|
|
8
8
|
const boxChrome = {
|
|
9
9
|
soft: {
|
|
10
|
-
brand: (0,
|
|
11
|
-
gray: (0,
|
|
10
|
+
brand: (0, cn.cn)(SOFT_BASE, "bg-input-base not-disabled:hover:bg-input-base-hover focus-visible:ring-input-active"),
|
|
11
|
+
gray: (0, cn.cn)(SOFT_BASE, "bg-base-gray-soft not-disabled:hover:bg-gray-a4 focus-visible:ring-gray-a8")
|
|
12
12
|
},
|
|
13
13
|
surface: {
|
|
14
|
-
brand: (0,
|
|
15
|
-
gray: (0,
|
|
14
|
+
brand: (0, cn.cn)(BORDERED, "border-input bg-base-accent-surface focus-visible:border-input-active focus-visible:ring-spark-a4"),
|
|
15
|
+
gray: (0, cn.cn)(BORDERED, "border-input-gray bg-base-gray-surface focus-visible:border-gray-a8 focus-visible:ring-gray-a4")
|
|
16
16
|
},
|
|
17
17
|
outlined: {
|
|
18
|
-
brand: (0,
|
|
19
|
-
gray: (0,
|
|
18
|
+
brand: (0, cn.cn)(BORDERED, "border-input focus-visible:border-input-active focus-visible:ring-spark-a4"),
|
|
19
|
+
gray: (0, cn.cn)(BORDERED, "border-input-gray focus-visible:border-gray-a8 focus-visible:ring-gray-a4")
|
|
20
20
|
},
|
|
21
21
|
ghost: {
|
|
22
|
-
brand: (0,
|
|
23
|
-
gray: (0,
|
|
22
|
+
brand: (0, cn.cn)(GHOST_UNDERLINE, "border-b-input"),
|
|
23
|
+
gray: (0, cn.cn)(GHOST_UNDERLINE, "border-b-input-gray")
|
|
24
24
|
}
|
|
25
25
|
};
|
|
26
26
|
//#endregion
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"input-box-variants.cjs","names":[],"sources":["../../src/lib/input-box-variants.ts"],"sourcesContent":["import { cn } from '../utils/cn'\nimport type { SparkInputColor, SparkInputStyle } from './theme-types'\n\nexport const GHOST_UNDERLINE =\n 'h-10 rounded-none border-0 border-b-2 px-0 py-2 text-base focus:border-b-input-active focus-visible:border-b-input-active user-valid:border-b-input-active user-invalid:border-b-input-invalid user-invalid:text-error user-invalid:focus:border-b-red-a8! user-invalid:focus-visible:border-b-red-a8! aria-invalid:border-b-input-invalid aria-invalid:text-error aria-invalid:focus:border-b-red-a8! aria-invalid:focus-visible:border-b-red-a8! group-data-[invalid=true]/field:border-b-input-invalid! group-data-[invalid=true]/field:text-error group-data-[invalid=true]/field:focus:border-b-red-a8! group-data-[invalid=true]/field:focus-visible:border-b-red-a8! disabled:border-b-input-disabled'\n\nconst SOFT_BASE =\n 'user-invalid:bg-base-error-soft user-invalid:text-error user-invalid:not-disabled:hover:bg-red-a4 focus-visible:ring-2 focus-visible:ring-offset-2 user-invalid:focus-visible:ring-red-a8 disabled:bg-base-gray-soft disabled:opacity-50 aria-invalid:bg-base-error-soft aria-invalid:text-error aria-invalid:not-disabled:hover:bg-red-a4 aria-invalid:focus-visible:ring-red-a8 group-data-[invalid=true]/field:bg-base-error-soft group-data-[invalid=true]/field:text-error group-data-[invalid=true]/field:not-disabled:hover:bg-red-a4 group-data-[invalid=true]/field:focus-visible:ring-red-a8'\n\nconst BORDERED =\n 'border user-invalid:border-input-invalid user-invalid:text-error focus-visible:ring-1 user-invalid:focus-visible:border-input-invalid! user-invalid:focus-visible:ring-red-a4! disabled:border-input-disabled disabled:opacity-50 aria-invalid:border-input-invalid aria-invalid:text-error aria-invalid:focus-visible:border-input-invalid! aria-invalid:focus-visible:ring-red-a4! group-data-[invalid=true]/field:border-input-invalid group-data-[invalid=true]/field:text-error group-data-[invalid=true]/field:focus-visible:border-input-invalid! group-data-[invalid=true]/field:focus-visible:ring-red-a4!'\nexport const boxChrome: Record<\n SparkInputStyle,\n Record<SparkInputColor, string>\n> = {\n soft: {\n brand: cn(\n SOFT_BASE,\n 'bg-input-base not-disabled:hover:bg-input-base-hover focus-visible:ring-input-active',\n ),\n gray: cn(\n SOFT_BASE,\n 'bg-base-gray-soft not-disabled:hover:bg-gray-a4 focus-visible:ring-gray-a8',\n ),\n },\n surface: {\n brand: cn(\n BORDERED,\n 'border-input bg-base-accent-surface focus-visible:border-input-active focus-visible:ring-spark-a4',\n ),\n gray: cn(\n BORDERED,\n 'border-input-gray bg-base-gray-surface focus-visible:border-gray-a8 focus-visible:ring-gray-a4',\n ),\n },\n outlined: {\n brand: cn(\n BORDERED,\n 'border-input focus-visible:border-input-active focus-visible:ring-spark-a4',\n ),\n gray: cn(\n BORDERED,\n 'border-input-gray focus-visible:border-gray-a8 focus-visible:ring-gray-a4',\n ),\n },\n ghost: {\n brand: cn(GHOST_UNDERLINE, 'border-b-input'),\n gray: cn(GHOST_UNDERLINE, 'border-b-input-gray'),\n },\n}\n"],"mappings":";;;;AAGA,MAAa,kBACX;AAEF,MAAM,YACJ;AAEF,MAAM,WACJ;AACF,MAAa,YAGT;CACF,MAAM;EACJ,QAAA,GAAA,
|
|
1
|
+
{"version":3,"file":"input-box-variants.cjs","names":[],"sources":["../../src/lib/input-box-variants.ts"],"sourcesContent":["import { cn } from '../utils/cn'\nimport type { SparkInputColor, SparkInputStyle } from './theme-types'\n\nexport const GHOST_UNDERLINE =\n 'h-10 rounded-none border-0 border-b-2 px-0 py-2 text-base focus:border-b-input-active focus-visible:border-b-input-active user-valid:border-b-input-active user-invalid:border-b-input-invalid user-invalid:text-error user-invalid:focus:border-b-red-a8! user-invalid:focus-visible:border-b-red-a8! aria-invalid:border-b-input-invalid aria-invalid:text-error aria-invalid:focus:border-b-red-a8! aria-invalid:focus-visible:border-b-red-a8! group-data-[invalid=true]/field:border-b-input-invalid! group-data-[invalid=true]/field:text-error group-data-[invalid=true]/field:focus:border-b-red-a8! group-data-[invalid=true]/field:focus-visible:border-b-red-a8! disabled:border-b-input-disabled'\n\nconst SOFT_BASE =\n 'user-invalid:bg-base-error-soft user-invalid:text-error user-invalid:not-disabled:hover:bg-red-a4 focus-visible:ring-2 focus-visible:ring-offset-2 user-invalid:focus-visible:ring-red-a8 disabled:bg-base-gray-soft disabled:opacity-50 aria-invalid:bg-base-error-soft aria-invalid:text-error aria-invalid:not-disabled:hover:bg-red-a4 aria-invalid:focus-visible:ring-red-a8 group-data-[invalid=true]/field:bg-base-error-soft group-data-[invalid=true]/field:text-error group-data-[invalid=true]/field:not-disabled:hover:bg-red-a4 group-data-[invalid=true]/field:focus-visible:ring-red-a8'\n\nconst BORDERED =\n 'border user-invalid:border-input-invalid user-invalid:text-error focus-visible:ring-1 user-invalid:focus-visible:border-input-invalid! user-invalid:focus-visible:ring-red-a4! disabled:border-input-disabled disabled:opacity-50 aria-invalid:border-input-invalid aria-invalid:text-error aria-invalid:focus-visible:border-input-invalid! aria-invalid:focus-visible:ring-red-a4! group-data-[invalid=true]/field:border-input-invalid group-data-[invalid=true]/field:text-error group-data-[invalid=true]/field:focus-visible:border-input-invalid! group-data-[invalid=true]/field:focus-visible:ring-red-a4!'\nexport const boxChrome: Record<\n SparkInputStyle,\n Record<SparkInputColor, string>\n> = {\n soft: {\n brand: cn(\n SOFT_BASE,\n 'bg-input-base not-disabled:hover:bg-input-base-hover focus-visible:ring-input-active',\n ),\n gray: cn(\n SOFT_BASE,\n 'bg-base-gray-soft not-disabled:hover:bg-gray-a4 focus-visible:ring-gray-a8',\n ),\n },\n surface: {\n brand: cn(\n BORDERED,\n 'border-input bg-base-accent-surface focus-visible:border-input-active focus-visible:ring-spark-a4',\n ),\n gray: cn(\n BORDERED,\n 'border-input-gray bg-base-gray-surface focus-visible:border-gray-a8 focus-visible:ring-gray-a4',\n ),\n },\n outlined: {\n brand: cn(\n BORDERED,\n 'border-input focus-visible:border-input-active focus-visible:ring-spark-a4',\n ),\n gray: cn(\n BORDERED,\n 'border-input-gray focus-visible:border-gray-a8 focus-visible:ring-gray-a4',\n ),\n },\n ghost: {\n brand: cn(GHOST_UNDERLINE, 'border-b-input'),\n gray: cn(GHOST_UNDERLINE, 'border-b-input-gray'),\n },\n}\n"],"mappings":";;;;AAGA,MAAa,kBACX;AAEF,MAAM,YACJ;AAEF,MAAM,WACJ;AACF,MAAa,YAGT;CACF,MAAM;EACJ,QAAA,GAAA,GAAA,IACE,WACA,sFACF;EACA,OAAA,GAAA,GAAA,IACE,WACA,4EACF;CACF;CACA,SAAS;EACP,QAAA,GAAA,GAAA,IACE,UACA,mGACF;EACA,OAAA,GAAA,GAAA,IACE,UACA,gGACF;CACF;CACA,UAAU;EACR,QAAA,GAAA,GAAA,IACE,UACA,4EACF;EACA,OAAA,GAAA,GAAA,IACE,UACA,2EACF;CACF;CACA,OAAO;EACL,QAAA,GAAA,GAAA,IAAU,iBAAiB,gBAAgB;EAC3C,OAAA,GAAA,GAAA,IAAS,iBAAiB,qBAAqB;CACjD;AACF"}
|
|
@@ -0,0 +1,14 @@
|
|
|
1
|
+
"use client";
|
|
2
|
+
|
|
3
|
+
import { Format, NumberFlowProps, NumberFlowProps as NumberFlowProps$1 } from "@number-flow/react";
|
|
4
|
+
|
|
5
|
+
//#region src/components/number-flow.d.ts
|
|
6
|
+
declare function NumberFlow({
|
|
7
|
+
locales,
|
|
8
|
+
prefix,
|
|
9
|
+
suffix,
|
|
10
|
+
...props
|
|
11
|
+
}: NumberFlowProps): import("react/jsx-runtime").JSX.Element;
|
|
12
|
+
//#endregion
|
|
13
|
+
export { NumberFlow as n, NumberFlowProps$1 as r, Format as t };
|
|
14
|
+
//# sourceMappingURL=number-flow-Bch81ixZ.d.cts.map
|
|
@@ -0,0 +1,14 @@
|
|
|
1
|
+
"use client";
|
|
2
|
+
|
|
3
|
+
import { Format, NumberFlowProps, NumberFlowProps as NumberFlowProps$1 } from "@number-flow/react";
|
|
4
|
+
|
|
5
|
+
//#region src/components/number-flow.d.ts
|
|
6
|
+
declare function NumberFlow({
|
|
7
|
+
locales,
|
|
8
|
+
prefix,
|
|
9
|
+
suffix,
|
|
10
|
+
...props
|
|
11
|
+
}: NumberFlowProps): import("react/jsx-runtime").JSX.Element;
|
|
12
|
+
//#endregion
|
|
13
|
+
export { NumberFlow as n, NumberFlowProps$1 as r, Format as t };
|
|
14
|
+
//# sourceMappingURL=number-flow-Bch81ixZ.d.ts.map
|
|
@@ -876,6 +876,17 @@
|
|
|
876
876
|
--spark-card-c-contrast: var(--spark-contrast);
|
|
877
877
|
}
|
|
878
878
|
|
|
879
|
+
/* An explicit neutral card opts out of an inherited accent card colour: initial drops each slot to its neutral fallback. */
|
|
880
|
+
[data-card-color='neutral'],
|
|
881
|
+
:where([data-card-color='neutral'] .spark-theme) {
|
|
882
|
+
--spark-card-c-soft: initial;
|
|
883
|
+
--spark-card-c-soft-hover: initial;
|
|
884
|
+
--spark-card-c-surface: initial;
|
|
885
|
+
--spark-card-c-border: initial;
|
|
886
|
+
--spark-card-c-solid: initial;
|
|
887
|
+
--spark-card-c-contrast: initial;
|
|
888
|
+
}
|
|
889
|
+
|
|
879
890
|
[data-card-variant='soft'],
|
|
880
891
|
:where([data-card-variant='soft'] .spark-theme),
|
|
881
892
|
:where([data-card-variant='soft'] [data-card-color]) {
|
|
@@ -0,0 +1,72 @@
|
|
|
1
|
+
"use client";
|
|
2
|
+
Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
|
|
3
|
+
//#region src/utils/build-sankey-nodes.ts
|
|
4
|
+
function buildSankeyNodes({ solarPower, batteryPower, gridPower, floorShares, deviceSharesByFloor }) {
|
|
5
|
+
const solar = Math.max(0, solarPower);
|
|
6
|
+
const gridImport = Math.max(0, gridPower);
|
|
7
|
+
const gridExport = Math.max(0, -gridPower);
|
|
8
|
+
const batteryDischarge = Math.max(0, batteryPower);
|
|
9
|
+
const batteryCharge = Math.max(0, -batteryPower);
|
|
10
|
+
const solarToBattery = Math.min(solar, batteryCharge);
|
|
11
|
+
const gridToBattery = Math.min(gridImport, batteryCharge - solarToBattery);
|
|
12
|
+
const solarToFeedIn = Math.min(solar - solarToBattery, gridExport);
|
|
13
|
+
const batteryToFeedIn = Math.min(batteryDischarge, gridExport - solarToFeedIn);
|
|
14
|
+
const links = [
|
|
15
|
+
{
|
|
16
|
+
source: "grid",
|
|
17
|
+
target: "home",
|
|
18
|
+
value: gridImport - gridToBattery
|
|
19
|
+
},
|
|
20
|
+
{
|
|
21
|
+
source: "solar",
|
|
22
|
+
target: "home",
|
|
23
|
+
value: solar - solarToBattery - solarToFeedIn
|
|
24
|
+
},
|
|
25
|
+
{
|
|
26
|
+
source: "battery",
|
|
27
|
+
target: "home",
|
|
28
|
+
value: batteryDischarge - batteryToFeedIn
|
|
29
|
+
},
|
|
30
|
+
{
|
|
31
|
+
source: "solar",
|
|
32
|
+
target: "battery",
|
|
33
|
+
value: solarToBattery
|
|
34
|
+
},
|
|
35
|
+
{
|
|
36
|
+
source: "grid",
|
|
37
|
+
target: "battery",
|
|
38
|
+
value: gridToBattery
|
|
39
|
+
},
|
|
40
|
+
{
|
|
41
|
+
source: "solar",
|
|
42
|
+
target: "gridFeedIn",
|
|
43
|
+
value: solarToFeedIn
|
|
44
|
+
},
|
|
45
|
+
{
|
|
46
|
+
source: "battery",
|
|
47
|
+
target: "gridFeedIn",
|
|
48
|
+
value: batteryToFeedIn
|
|
49
|
+
}
|
|
50
|
+
];
|
|
51
|
+
if (!floorShares) return links;
|
|
52
|
+
const homeWatts = solar - solarToBattery - solarToFeedIn + (gridImport - gridToBattery) + (batteryDischarge - batteryToFeedIn);
|
|
53
|
+
for (const [floorId, share] of Object.entries(floorShares)) {
|
|
54
|
+
const floorWatts = homeWatts * share;
|
|
55
|
+
links.push({
|
|
56
|
+
source: "home",
|
|
57
|
+
target: floorId,
|
|
58
|
+
value: floorWatts
|
|
59
|
+
});
|
|
60
|
+
const deviceShares = deviceSharesByFloor?.[floorId] ?? {};
|
|
61
|
+
for (const [deviceId, deviceShare] of Object.entries(deviceShares)) links.push({
|
|
62
|
+
source: floorId,
|
|
63
|
+
target: deviceId,
|
|
64
|
+
value: floorWatts * deviceShare
|
|
65
|
+
});
|
|
66
|
+
}
|
|
67
|
+
return links;
|
|
68
|
+
}
|
|
69
|
+
//#endregion
|
|
70
|
+
exports.buildSankeyNodes = buildSankeyNodes;
|
|
71
|
+
|
|
72
|
+
//# sourceMappingURL=build-sankey-nodes.cjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"build-sankey-nodes.cjs","names":[],"sources":["../../src/utils/build-sankey-nodes.ts"],"sourcesContent":["import type { SankeyChartLink } from '../components/sankey-chart'\n\ntype SankeyNodesArgs = {\n solarPower: number\n /**\n * Signed storage power: positive = discharging into the home, negative =\n * charging from solar/grid. Charging power is routed into the `battery`\n * node so it isn't mistakenly attributed to home consumption.\n */\n batteryPower: number\n gridPower: number\n floorShares?: Record<string, number>\n deviceSharesByFloor?: Record<string, Record<string, number>>\n}\n\nfunction buildSankeyNodes({\n solarPower,\n batteryPower,\n gridPower,\n floorShares,\n deviceSharesByFloor,\n}: SankeyNodesArgs): SankeyChartLink[] {\n const solar = Math.max(0, solarPower)\n const gridImport = Math.max(0, gridPower)\n const gridExport = Math.max(0, -gridPower)\n const batteryDischarge = Math.max(0, batteryPower)\n const batteryCharge = Math.max(0, -batteryPower)\n\n // Charge the battery from solar surplus first, then from the grid. Routing\n // the charge flow into the `battery` node (a sink while charging) keeps it\n // out of the `home` node, which should reflect actual consumption only.\n const solarToBattery = Math.min(solar, batteryCharge)\n const gridToBattery = Math.min(gridImport, batteryCharge - solarToBattery)\n\n // Grid feed-in (export). Cover it from the solar surplus first, then fall\n // back to battery discharge. Like battery charging, this must not land in the\n // `home` node — it's power leaving the house, not consumption.\n const solarToFeedIn = Math.min(solar - solarToBattery, gridExport)\n const batteryToFeedIn = Math.min(batteryDischarge, gridExport - solarToFeedIn)\n\n const links: SankeyChartLink[] = [\n { source: 'grid', target: 'home', value: gridImport - gridToBattery },\n {\n source: 'solar',\n target: 'home',\n value: solar - solarToBattery - solarToFeedIn,\n },\n {\n source: 'battery',\n target: 'home',\n value: batteryDischarge - batteryToFeedIn,\n },\n { source: 'solar', target: 'battery', value: solarToBattery },\n { source: 'grid', target: 'battery', value: gridToBattery },\n { source: 'solar', target: 'gridFeedIn', value: solarToFeedIn },\n { source: 'battery', target: 'gridFeedIn', value: batteryToFeedIn },\n ]\n\n if (!floorShares) return links\n\n const homeWatts =\n solar -\n solarToBattery -\n solarToFeedIn +\n (gridImport - gridToBattery) +\n (batteryDischarge - batteryToFeedIn)\n\n for (const [floorId, share] of Object.entries(floorShares)) {\n const floorWatts = homeWatts * share\n links.push({ source: 'home', target: floorId, value: floorWatts })\n\n const deviceShares = deviceSharesByFloor?.[floorId] ?? {}\n for (const [deviceId, deviceShare] of Object.entries(deviceShares)) {\n links.push({\n source: floorId,\n target: deviceId,\n value: floorWatts * deviceShare,\n })\n }\n }\n\n return links\n}\n\nexport { buildSankeyNodes }\n"],"mappings":";;;AAeA,SAAS,iBAAiB,EACxB,YACA,cACA,WACA,aACA,uBACqC;CACrC,MAAM,QAAQ,KAAK,IAAI,GAAG,UAAU;CACpC,MAAM,aAAa,KAAK,IAAI,GAAG,SAAS;CACxC,MAAM,aAAa,KAAK,IAAI,GAAG,CAAC,SAAS;CACzC,MAAM,mBAAmB,KAAK,IAAI,GAAG,YAAY;CACjD,MAAM,gBAAgB,KAAK,IAAI,GAAG,CAAC,YAAY;CAK/C,MAAM,iBAAiB,KAAK,IAAI,OAAO,aAAa;CACpD,MAAM,gBAAgB,KAAK,IAAI,YAAY,gBAAgB,cAAc;CAKzE,MAAM,gBAAgB,KAAK,IAAI,QAAQ,gBAAgB,UAAU;CACjE,MAAM,kBAAkB,KAAK,IAAI,kBAAkB,aAAa,aAAa;CAE7E,MAAM,QAA2B;EAC/B;GAAE,QAAQ;GAAQ,QAAQ;GAAQ,OAAO,aAAa;EAAc;EACpE;GACE,QAAQ;GACR,QAAQ;GACR,OAAO,QAAQ,iBAAiB;EAClC;EACA;GACE,QAAQ;GACR,QAAQ;GACR,OAAO,mBAAmB;EAC5B;EACA;GAAE,QAAQ;GAAS,QAAQ;GAAW,OAAO;EAAe;EAC5D;GAAE,QAAQ;GAAQ,QAAQ;GAAW,OAAO;EAAc;EAC1D;GAAE,QAAQ;GAAS,QAAQ;GAAc,OAAO;EAAc;EAC9D;GAAE,QAAQ;GAAW,QAAQ;GAAc,OAAO;EAAgB;CACpE;CAEA,IAAI,CAAC,aAAa,OAAO;CAEzB,MAAM,YACJ,QACA,iBACA,iBACC,aAAa,kBACb,mBAAmB;CAEtB,KAAK,MAAM,CAAC,SAAS,UAAU,OAAO,QAAQ,WAAW,GAAG;EAC1D,MAAM,aAAa,YAAY;EAC/B,MAAM,KAAK;GAAE,QAAQ;GAAQ,QAAQ;GAAS,OAAO;EAAW,CAAC;EAEjE,MAAM,eAAe,sBAAsB,YAAY,CAAC;EACxD,KAAK,MAAM,CAAC,UAAU,gBAAgB,OAAO,QAAQ,YAAY,GAC/D,MAAM,KAAK;GACT,QAAQ;GACR,QAAQ;GACR,OAAO,aAAa;EACtB,CAAC;CAEL;CAEA,OAAO;AACT"}
|
|
@@ -0,0 +1,27 @@
|
|
|
1
|
+
"use client";
|
|
2
|
+
|
|
3
|
+
import { SankeyChartLink } from "../components/sankey-chart.cjs";
|
|
4
|
+
|
|
5
|
+
//#region src/utils/build-sankey-nodes.d.ts
|
|
6
|
+
type SankeyNodesArgs = {
|
|
7
|
+
solarPower: number;
|
|
8
|
+
/**
|
|
9
|
+
* Signed storage power: positive = discharging into the home, negative =
|
|
10
|
+
* charging from solar/grid. Charging power is routed into the `battery`
|
|
11
|
+
* node so it isn't mistakenly attributed to home consumption.
|
|
12
|
+
*/
|
|
13
|
+
batteryPower: number;
|
|
14
|
+
gridPower: number;
|
|
15
|
+
floorShares?: Record<string, number>;
|
|
16
|
+
deviceSharesByFloor?: Record<string, Record<string, number>>;
|
|
17
|
+
};
|
|
18
|
+
declare function buildSankeyNodes({
|
|
19
|
+
solarPower,
|
|
20
|
+
batteryPower,
|
|
21
|
+
gridPower,
|
|
22
|
+
floorShares,
|
|
23
|
+
deviceSharesByFloor
|
|
24
|
+
}: SankeyNodesArgs): SankeyChartLink[];
|
|
25
|
+
//#endregion
|
|
26
|
+
export { buildSankeyNodes };
|
|
27
|
+
//# sourceMappingURL=build-sankey-nodes.d.cts.map
|
|
@@ -0,0 +1,27 @@
|
|
|
1
|
+
"use client";
|
|
2
|
+
|
|
3
|
+
import { SankeyChartLink } from "../components/sankey-chart.js";
|
|
4
|
+
|
|
5
|
+
//#region src/utils/build-sankey-nodes.d.ts
|
|
6
|
+
type SankeyNodesArgs = {
|
|
7
|
+
solarPower: number;
|
|
8
|
+
/**
|
|
9
|
+
* Signed storage power: positive = discharging into the home, negative =
|
|
10
|
+
* charging from solar/grid. Charging power is routed into the `battery`
|
|
11
|
+
* node so it isn't mistakenly attributed to home consumption.
|
|
12
|
+
*/
|
|
13
|
+
batteryPower: number;
|
|
14
|
+
gridPower: number;
|
|
15
|
+
floorShares?: Record<string, number>;
|
|
16
|
+
deviceSharesByFloor?: Record<string, Record<string, number>>;
|
|
17
|
+
};
|
|
18
|
+
declare function buildSankeyNodes({
|
|
19
|
+
solarPower,
|
|
20
|
+
batteryPower,
|
|
21
|
+
gridPower,
|
|
22
|
+
floorShares,
|
|
23
|
+
deviceSharesByFloor
|
|
24
|
+
}: SankeyNodesArgs): SankeyChartLink[];
|
|
25
|
+
//#endregion
|
|
26
|
+
export { buildSankeyNodes };
|
|
27
|
+
//# sourceMappingURL=build-sankey-nodes.d.ts.map
|