@epilot/spark-ui 0.19.0 → 0.20.1

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.
Files changed (210) hide show
  1. package/dist/components/attachment.d.cts +2 -2
  2. package/dist/components/attachment.d.ts +2 -2
  3. package/dist/components/avatar.cjs +1 -1
  4. package/dist/components/avatar.cjs.map +1 -1
  5. package/dist/components/avatar.js +1 -1
  6. package/dist/components/avatar.js.map +1 -1
  7. package/dist/components/badge.cjs +1 -1
  8. package/dist/components/badge.cjs.map +1 -1
  9. package/dist/components/badge.d.cts +2 -1
  10. package/dist/components/badge.d.ts +2 -1
  11. package/dist/components/badge.js +1 -1
  12. package/dist/components/badge.js.map +1 -1
  13. package/dist/components/{energy-bar-chart.cjs → bar-chart-with-total.cjs} +4 -4
  14. package/dist/components/bar-chart-with-total.cjs.map +1 -0
  15. package/dist/components/bar-chart-with-total.d.cts +19 -0
  16. package/dist/components/bar-chart-with-total.d.ts +19 -0
  17. package/dist/components/{energy-bar-chart.js → bar-chart-with-total.js} +4 -4
  18. package/dist/components/bar-chart-with-total.js.map +1 -0
  19. package/dist/components/bar-chart.cjs +1 -1
  20. package/dist/components/bar-chart.js +2 -2
  21. package/dist/components/bubble.d.cts +1 -1
  22. package/dist/components/bubble.d.ts +1 -1
  23. package/dist/components/button-group.cjs +2 -2
  24. package/dist/components/button-group.cjs.map +1 -1
  25. package/dist/components/button-group.d.cts +1 -1
  26. package/dist/components/button-group.d.ts +1 -1
  27. package/dist/components/button-group.js +2 -2
  28. package/dist/components/button-group.js.map +1 -1
  29. package/dist/components/button.cjs +6 -4
  30. package/dist/components/button.cjs.map +1 -1
  31. package/dist/components/button.d.cts +6 -5
  32. package/dist/components/button.d.ts +6 -5
  33. package/dist/components/button.js +6 -4
  34. package/dist/components/button.js.map +1 -1
  35. package/dist/components/calendar.cjs +2 -2
  36. package/dist/components/calendar.cjs.map +1 -1
  37. package/dist/components/calendar.js +2 -2
  38. package/dist/components/calendar.js.map +1 -1
  39. package/dist/components/callout.cjs +10 -10
  40. package/dist/components/callout.cjs.map +1 -1
  41. package/dist/components/callout.d.cts +1 -1
  42. package/dist/components/callout.d.ts +1 -1
  43. package/dist/components/callout.js +10 -10
  44. package/dist/components/callout.js.map +1 -1
  45. package/dist/components/checkbox.cjs +1 -1
  46. package/dist/components/checkbox.cjs.map +1 -1
  47. package/dist/components/checkbox.js +1 -1
  48. package/dist/components/checkbox.js.map +1 -1
  49. package/dist/components/circular-gauge.cjs +7 -7
  50. package/dist/components/circular-gauge.cjs.map +1 -1
  51. package/dist/components/circular-gauge.js +7 -7
  52. package/dist/components/circular-gauge.js.map +1 -1
  53. package/dist/components/day-of-week-picker.cjs +21 -41
  54. package/dist/components/day-of-week-picker.cjs.map +1 -1
  55. package/dist/components/day-of-week-picker.d.cts +19 -23
  56. package/dist/components/day-of-week-picker.d.ts +19 -23
  57. package/dist/components/day-of-week-picker.js +21 -41
  58. package/dist/components/day-of-week-picker.js.map +1 -1
  59. package/dist/components/energy-history-chart.cjs +2 -2
  60. package/dist/components/energy-history-chart.cjs.map +1 -1
  61. package/dist/components/energy-history-chart.js +2 -2
  62. package/dist/components/energy-history-chart.js.map +1 -1
  63. package/dist/components/{device-card.cjs → entity-card.cjs} +31 -31
  64. package/dist/components/entity-card.cjs.map +1 -0
  65. package/dist/components/{device-card.d.cts → entity-card.d.cts} +15 -15
  66. package/dist/components/{device-card.d.ts → entity-card.d.ts} +15 -15
  67. package/dist/components/{device-card.js → entity-card.js} +20 -20
  68. package/dist/components/entity-card.js.map +1 -0
  69. package/dist/components/{feed-in-hero.cjs → hero-metric.cjs} +10 -15
  70. package/dist/components/hero-metric.cjs.map +1 -0
  71. package/dist/components/hero-metric.d.cts +27 -0
  72. package/dist/components/hero-metric.d.ts +27 -0
  73. package/dist/components/{feed-in-hero.js → hero-metric.js} +7 -12
  74. package/dist/components/hero-metric.js.map +1 -0
  75. package/dist/components/info-block.d.cts +1 -1
  76. package/dist/components/info-block.d.ts +1 -1
  77. package/dist/components/input-group.d.cts +1 -1
  78. package/dist/components/input-group.d.ts +1 -1
  79. package/dist/components/input-otp.cjs +1 -1
  80. package/dist/components/input-otp.js +1 -1
  81. package/dist/components/input.cjs +1 -1
  82. package/dist/components/input.js +1 -1
  83. package/dist/components/line-chart.cjs +3 -3
  84. package/dist/components/line-chart.js +4 -4
  85. package/dist/components/marker.d.cts +1 -1
  86. package/dist/components/marker.d.ts +1 -1
  87. package/dist/components/message-scroller.cjs +1 -1
  88. package/dist/components/message-scroller.js +2 -2
  89. package/dist/components/period-tabs.cjs +2 -22
  90. package/dist/components/period-tabs.cjs.map +1 -1
  91. package/dist/components/period-tabs.d.cts +5 -22
  92. package/dist/components/period-tabs.d.ts +5 -22
  93. package/dist/components/period-tabs.js +2 -22
  94. package/dist/components/period-tabs.js.map +1 -1
  95. package/dist/components/pill.cjs +2 -2
  96. package/dist/components/pill.cjs.map +1 -1
  97. package/dist/components/pill.js +2 -2
  98. package/dist/components/pill.js.map +1 -1
  99. package/dist/components/power-history-chart.cjs +3 -3
  100. package/dist/components/power-history-chart.js +4 -4
  101. package/dist/components/power-network.js +1 -1
  102. package/dist/components/progress.cjs +1 -1
  103. package/dist/components/progress.cjs.map +1 -1
  104. package/dist/components/progress.js +1 -1
  105. package/dist/components/progress.js.map +1 -1
  106. package/dist/components/radio.cjs +1 -1
  107. package/dist/components/radio.cjs.map +1 -1
  108. package/dist/components/radio.js +1 -1
  109. package/dist/components/radio.js.map +1 -1
  110. package/dist/components/segmented-control.cjs +2 -2
  111. package/dist/components/segmented-control.cjs.map +1 -1
  112. package/dist/components/segmented-control.js +2 -2
  113. package/dist/components/segmented-control.js.map +1 -1
  114. package/dist/components/select.cjs +32 -2
  115. package/dist/components/select.cjs.map +1 -1
  116. package/dist/components/select.d.cts +11 -1
  117. package/dist/components/select.d.ts +11 -1
  118. package/dist/components/select.js +32 -4
  119. package/dist/components/select.js.map +1 -1
  120. package/dist/components/solar-forecast-chart.js +1 -1
  121. package/dist/components/stepper.cjs +1 -1
  122. package/dist/components/stepper.cjs.map +1 -1
  123. package/dist/components/stepper.d.cts +4 -4
  124. package/dist/components/stepper.d.ts +4 -4
  125. package/dist/components/stepper.js +1 -1
  126. package/dist/components/stepper.js.map +1 -1
  127. package/dist/components/textarea.cjs +1 -1
  128. package/dist/components/textarea.js +1 -1
  129. package/dist/components/tooltip.cjs +1 -1
  130. package/dist/components/tooltip.cjs.map +1 -1
  131. package/dist/components/tooltip.js +1 -1
  132. package/dist/components/tooltip.js.map +1 -1
  133. package/dist/components/typography.cjs +1 -1
  134. package/dist/components/typography.cjs.map +1 -1
  135. package/dist/components/typography.d.cts +4 -1
  136. package/dist/components/typography.d.ts +4 -1
  137. package/dist/components/typography.js +1 -1
  138. package/dist/components/typography.js.map +1 -1
  139. package/dist/components/wizard-layout.cjs +57 -0
  140. package/dist/components/wizard-layout.cjs.map +1 -0
  141. package/dist/components/wizard-layout.d.cts +34 -0
  142. package/dist/components/wizard-layout.d.ts +34 -0
  143. package/dist/components/wizard-layout.js +50 -0
  144. package/dist/components/wizard-layout.js.map +1 -0
  145. package/dist/lib/accent-colors.cjs +4 -1
  146. package/dist/lib/accent-colors.cjs.map +1 -1
  147. package/dist/lib/accent-colors.d.cts +1 -1
  148. package/dist/lib/accent-colors.d.ts +1 -1
  149. package/dist/lib/accent-colors.js +4 -1
  150. package/dist/lib/accent-colors.js.map +1 -1
  151. package/dist/lib/accent-theme.cjs +2 -2
  152. package/dist/lib/accent-theme.cjs.map +1 -1
  153. package/dist/lib/accent-theme.js +2 -2
  154. package/dist/lib/accent-theme.js.map +1 -1
  155. package/dist/styles/index.css +1 -1
  156. package/dist/styles/spark-default.css +49 -314
  157. package/dist/styles/theme.css +52 -6
  158. package/package.json +1 -1
  159. package/dist/components/battery-progress-row.cjs +0 -135
  160. package/dist/components/battery-progress-row.cjs.map +0 -1
  161. package/dist/components/battery-progress-row.d.cts +0 -69
  162. package/dist/components/battery-progress-row.d.ts +0 -69
  163. package/dist/components/battery-progress-row.js +0 -125
  164. package/dist/components/battery-progress-row.js.map +0 -1
  165. package/dist/components/device-card.cjs.map +0 -1
  166. package/dist/components/device-card.js.map +0 -1
  167. package/dist/components/energy-bar-chart.cjs.map +0 -1
  168. package/dist/components/energy-bar-chart.d.cts +0 -43
  169. package/dist/components/energy-bar-chart.d.ts +0 -43
  170. package/dist/components/energy-bar-chart.js.map +0 -1
  171. package/dist/components/feed-in-hero.cjs.map +0 -1
  172. package/dist/components/feed-in-hero.d.cts +0 -32
  173. package/dist/components/feed-in-hero.d.ts +0 -32
  174. package/dist/components/feed-in-hero.js.map +0 -1
  175. package/dist/components/metering-row.cjs +0 -59
  176. package/dist/components/metering-row.cjs.map +0 -1
  177. package/dist/components/metering-row.d.cts +0 -31
  178. package/dist/components/metering-row.d.ts +0 -31
  179. package/dist/components/metering-row.js +0 -55
  180. package/dist/components/metering-row.js.map +0 -1
  181. package/dist/components/money-saved-block.cjs +0 -83
  182. package/dist/components/money-saved-block.cjs.map +0 -1
  183. package/dist/components/money-saved-block.d.cts +0 -55
  184. package/dist/components/money-saved-block.d.ts +0 -55
  185. package/dist/components/money-saved-block.js +0 -76
  186. package/dist/components/money-saved-block.js.map +0 -1
  187. package/dist/components/on-off-button.cjs +0 -32
  188. package/dist/components/on-off-button.cjs.map +0 -1
  189. package/dist/components/on-off-button.d.cts +0 -18
  190. package/dist/components/on-off-button.d.ts +0 -18
  191. package/dist/components/on-off-button.js +0 -31
  192. package/dist/components/on-off-button.js.map +0 -1
  193. package/dist/components/onboarding-layout.cjs +0 -67
  194. package/dist/components/onboarding-layout.cjs.map +0 -1
  195. package/dist/components/onboarding-layout.d.cts +0 -44
  196. package/dist/components/onboarding-layout.d.ts +0 -44
  197. package/dist/components/onboarding-layout.js +0 -60
  198. package/dist/components/onboarding-layout.js.map +0 -1
  199. package/dist/components/power-history.cjs +0 -114
  200. package/dist/components/power-history.cjs.map +0 -1
  201. package/dist/components/power-history.d.cts +0 -40
  202. package/dist/components/power-history.d.ts +0 -41
  203. package/dist/components/power-history.js +0 -114
  204. package/dist/components/power-history.js.map +0 -1
  205. package/dist/components/smart-toggle-button.cjs +0 -24
  206. package/dist/components/smart-toggle-button.cjs.map +0 -1
  207. package/dist/components/smart-toggle-button.d.cts +0 -16
  208. package/dist/components/smart-toggle-button.d.ts +0 -16
  209. package/dist/components/smart-toggle-button.js +0 -23
  210. package/dist/components/smart-toggle-button.js.map +0 -1
@@ -1 +0,0 @@
1
- {"version":3,"file":"battery-progress-row.cjs","names":["Battery0Bar","Battery1Bar","Battery2Bar","Battery3Bar","Battery4Bar","Battery5Bar","Battery6Bar","BatteryFull","Icon","Badge","Progress"],"sources":["../../src/components/battery-progress-row.tsx"],"sourcesContent":["import {\n Battery0Bar,\n Battery1Bar,\n Battery2Bar,\n Battery3Bar,\n Battery4Bar,\n Battery5Bar,\n Battery6Bar,\n BatteryFull,\n type SparkIcon,\n} from '@epilot/spark-icons'\nimport { createContext, useContext } from 'react'\nimport type { Tone } from '../lib/tones'\nimport { cn } from '../utils/cn'\nimport { Badge, type SparkBadgeColor } from './badge'\nimport { Icon } from './icon'\nimport { Progress } from './progress'\n\ninterface BatteryProgressRowContextValue {\n soc: number\n}\n\nconst BatteryProgressRowContext =\n createContext<BatteryProgressRowContextValue | null>(null)\n\nfunction useBatteryProgressRowContext() {\n const context = useContext(BatteryProgressRowContext)\n if (!context) {\n throw new Error(\n 'BatteryProgressRow.* must be rendered inside <BatteryProgressRow>',\n )\n }\n return context\n}\n\nconst BatteryProgressRow = ({\n className,\n soc,\n children,\n ...rest\n}: React.ComponentProps<'div'> & { soc: number }) => {\n return (\n <BatteryProgressRowContext.Provider value={{ soc }}>\n <div className={cn('flex items-center gap-3', className)} {...rest}>\n {children}\n </div>\n </BatteryProgressRowContext.Provider>\n )\n}\n\nconst BATTERY_BY_LEVEL = [\n Battery0Bar,\n Battery1Bar,\n Battery2Bar,\n Battery3Bar,\n Battery4Bar,\n Battery5Bar,\n Battery6Bar,\n] as const\n\nconst BatteryProgressRowIcon = ({\n className,\n icon: overrideIcon,\n ...rest\n}: React.ComponentProps<'span'> & { icon?: SparkIcon }) => {\n const { soc } = useBatteryProgressRowContext()\n const clampedSoc = Math.min(Math.max(soc, 0), 100)\n const batteryLevel = Math.min(Math.floor(clampedSoc / (100 / 7)), 6)\n const fallback: SparkIcon =\n clampedSoc === 100\n ? BatteryFull\n : (BATTERY_BY_LEVEL[batteryLevel] ?? Battery0Bar)\n const Glyph = overrideIcon ?? fallback\n\n return (\n <Icon {...rest} className={className} color=\"success\" size=\"large\">\n <Glyph />\n </Icon>\n )\n}\n\nconst BatteryProgressRowContent = ({\n className,\n ...rest\n}: React.ComponentProps<'div'>) => {\n return (\n <div\n className={cn('flex min-w-0 flex-1 flex-col gap-1.5', className)}\n {...rest}\n />\n )\n}\n\nconst BatteryProgressRowHeader = ({\n className,\n ...rest\n}: React.ComponentProps<'div'>) => {\n return (\n <div\n className={cn('flex items-center justify-between gap-2', className)}\n {...rest}\n />\n )\n}\n\nconst toneToBadgeColor: Record<Tone, SparkBadgeColor> = {\n success: 'success',\n warning: 'warning',\n error: 'danger',\n accent: 'accent',\n neutral: 'neutral',\n}\n\nconst BatteryProgressRowStateBadge = ({\n className,\n children,\n tone = 'neutral',\n ...rest\n}: Omit<React.ComponentProps<'span'>, 'color'> & { tone?: Tone }) => {\n if (children === null || children === undefined) return null\n return (\n <Badge\n color={toneToBadgeColor[tone]}\n className={cn('w-fit', className)}\n {...rest}\n >\n {children}\n </Badge>\n )\n}\n\nconst BatteryProgressRowChargingPower = ({\n className,\n children,\n ...rest\n}: React.ComponentProps<'span'>) => {\n if (children === null || children === undefined) return null\n return (\n <span\n className={cn(\n 'ml-auto text-lg leading-tight font-bold text-gray tabular-nums',\n className,\n )}\n {...rest}\n >\n {children}\n </span>\n )\n}\n\n/**\n * Linear progress bar bound to the row's `soc`.\n */\nconst BatteryProgressRowProgressBar = ({\n className,\n ...rest\n}: Omit<React.ComponentProps<typeof Progress>, 'value' | 'max'>) => {\n const { soc } = useBatteryProgressRowContext()\n return <Progress className={className} max={100} value={soc} {...rest} />\n}\n\nconst BatteryProgressRowFooter = ({\n className,\n ...rest\n}: React.ComponentProps<'div'>) => {\n return (\n <div\n className={cn(\n 'flex justify-between text-xs text-gray-light tabular-nums',\n className,\n )}\n {...rest}\n />\n )\n}\n\nconst BatteryProgressRowMinSoc = ({\n className,\n children,\n ...rest\n}: React.ComponentProps<'span'>) => {\n if (children === null || children === undefined) return null\n return (\n <span className={cn(className)} {...rest}>\n {children}\n </span>\n )\n}\n\n/**\n * Current state-of-charge label, rendered as `{soc}%`. Reads from context.\n */\nconst BatteryProgressRowSoc = ({\n className,\n ...rest\n}: React.ComponentProps<'span'>) => {\n const { soc } = useBatteryProgressRowContext()\n return (\n <span className={cn(className)} {...rest}>\n {`${soc}%`}\n </span>\n )\n}\n\nexport {\n BatteryProgressRow,\n BatteryProgressRowIcon,\n BatteryProgressRowContent,\n BatteryProgressRowHeader,\n BatteryProgressRowStateBadge,\n BatteryProgressRowChargingPower,\n BatteryProgressRowProgressBar,\n BatteryProgressRowFooter,\n BatteryProgressRowMinSoc,\n BatteryProgressRowSoc,\n}\n"],"mappings":"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"}
@@ -1,69 +0,0 @@
1
- "use client";
2
-
3
- import { Tone } from "../lib/tones.cjs";
4
- import { Progress } from "./progress.cjs";
5
- import { SparkIcon } from "@epilot/spark-icons";
6
-
7
- //#region src/components/battery-progress-row.d.ts
8
- declare const BatteryProgressRow: ({
9
- className,
10
- soc,
11
- children,
12
- ...rest
13
- }: React.ComponentProps<"div"> & {
14
- soc: number;
15
- }) => import("react/jsx-runtime").JSX.Element;
16
- declare const BatteryProgressRowIcon: ({
17
- className,
18
- icon: overrideIcon,
19
- ...rest
20
- }: React.ComponentProps<"span"> & {
21
- icon?: SparkIcon;
22
- }) => import("react/jsx-runtime").JSX.Element;
23
- declare const BatteryProgressRowContent: ({
24
- className,
25
- ...rest
26
- }: React.ComponentProps<"div">) => import("react/jsx-runtime").JSX.Element;
27
- declare const BatteryProgressRowHeader: ({
28
- className,
29
- ...rest
30
- }: React.ComponentProps<"div">) => import("react/jsx-runtime").JSX.Element;
31
- declare const BatteryProgressRowStateBadge: ({
32
- className,
33
- children,
34
- tone,
35
- ...rest
36
- }: Omit<React.ComponentProps<"span">, "color"> & {
37
- tone?: Tone;
38
- }) => import("react/jsx-runtime").JSX.Element | null;
39
- declare const BatteryProgressRowChargingPower: ({
40
- className,
41
- children,
42
- ...rest
43
- }: React.ComponentProps<"span">) => import("react/jsx-runtime").JSX.Element | null;
44
- /**
45
- * Linear progress bar bound to the row's `soc`.
46
- */
47
- declare const BatteryProgressRowProgressBar: ({
48
- className,
49
- ...rest
50
- }: Omit<React.ComponentProps<typeof Progress>, "value" | "max">) => import("react/jsx-runtime").JSX.Element;
51
- declare const BatteryProgressRowFooter: ({
52
- className,
53
- ...rest
54
- }: React.ComponentProps<"div">) => import("react/jsx-runtime").JSX.Element;
55
- declare const BatteryProgressRowMinSoc: ({
56
- className,
57
- children,
58
- ...rest
59
- }: React.ComponentProps<"span">) => import("react/jsx-runtime").JSX.Element | null;
60
- /**
61
- * Current state-of-charge label, rendered as `{soc}%`. Reads from context.
62
- */
63
- declare const BatteryProgressRowSoc: ({
64
- className,
65
- ...rest
66
- }: React.ComponentProps<"span">) => import("react/jsx-runtime").JSX.Element;
67
- //#endregion
68
- export { BatteryProgressRow, BatteryProgressRowChargingPower, BatteryProgressRowContent, BatteryProgressRowFooter, BatteryProgressRowHeader, BatteryProgressRowIcon, BatteryProgressRowMinSoc, BatteryProgressRowProgressBar, BatteryProgressRowSoc, BatteryProgressRowStateBadge };
69
- //# sourceMappingURL=battery-progress-row.d.cts.map
@@ -1,69 +0,0 @@
1
- "use client";
2
-
3
- import { Tone } from "../lib/tones.js";
4
- import { Progress } from "./progress.js";
5
- import { SparkIcon } from "@epilot/spark-icons";
6
-
7
- //#region src/components/battery-progress-row.d.ts
8
- declare const BatteryProgressRow: ({
9
- className,
10
- soc,
11
- children,
12
- ...rest
13
- }: React.ComponentProps<"div"> & {
14
- soc: number;
15
- }) => import("react/jsx-runtime").JSX.Element;
16
- declare const BatteryProgressRowIcon: ({
17
- className,
18
- icon: overrideIcon,
19
- ...rest
20
- }: React.ComponentProps<"span"> & {
21
- icon?: SparkIcon;
22
- }) => import("react/jsx-runtime").JSX.Element;
23
- declare const BatteryProgressRowContent: ({
24
- className,
25
- ...rest
26
- }: React.ComponentProps<"div">) => import("react/jsx-runtime").JSX.Element;
27
- declare const BatteryProgressRowHeader: ({
28
- className,
29
- ...rest
30
- }: React.ComponentProps<"div">) => import("react/jsx-runtime").JSX.Element;
31
- declare const BatteryProgressRowStateBadge: ({
32
- className,
33
- children,
34
- tone,
35
- ...rest
36
- }: Omit<React.ComponentProps<"span">, "color"> & {
37
- tone?: Tone;
38
- }) => import("react/jsx-runtime").JSX.Element | null;
39
- declare const BatteryProgressRowChargingPower: ({
40
- className,
41
- children,
42
- ...rest
43
- }: React.ComponentProps<"span">) => import("react/jsx-runtime").JSX.Element | null;
44
- /**
45
- * Linear progress bar bound to the row's `soc`.
46
- */
47
- declare const BatteryProgressRowProgressBar: ({
48
- className,
49
- ...rest
50
- }: Omit<React.ComponentProps<typeof Progress>, "value" | "max">) => import("react/jsx-runtime").JSX.Element;
51
- declare const BatteryProgressRowFooter: ({
52
- className,
53
- ...rest
54
- }: React.ComponentProps<"div">) => import("react/jsx-runtime").JSX.Element;
55
- declare const BatteryProgressRowMinSoc: ({
56
- className,
57
- children,
58
- ...rest
59
- }: React.ComponentProps<"span">) => import("react/jsx-runtime").JSX.Element | null;
60
- /**
61
- * Current state-of-charge label, rendered as `{soc}%`. Reads from context.
62
- */
63
- declare const BatteryProgressRowSoc: ({
64
- className,
65
- ...rest
66
- }: React.ComponentProps<"span">) => import("react/jsx-runtime").JSX.Element;
67
- //#endregion
68
- export { BatteryProgressRow, BatteryProgressRowChargingPower, BatteryProgressRowContent, BatteryProgressRowFooter, BatteryProgressRowHeader, BatteryProgressRowIcon, BatteryProgressRowMinSoc, BatteryProgressRowProgressBar, BatteryProgressRowSoc, BatteryProgressRowStateBadge };
69
- //# sourceMappingURL=battery-progress-row.d.ts.map
@@ -1,125 +0,0 @@
1
- "use client";
2
- import { cn } from "../utils/cn.js";
3
- import { Badge } from "./badge.js";
4
- import { Icon } from "./icon.js";
5
- import { Progress } from "./progress.js";
6
- import { createContext, useContext } from "react";
7
- import { Battery0Bar, Battery1Bar, Battery2Bar, Battery3Bar, Battery4Bar, Battery5Bar, Battery6Bar, BatteryFull } from "@epilot/spark-icons";
8
- import { jsx } from "react/jsx-runtime";
9
- //#region src/components/battery-progress-row.tsx
10
- const BatteryProgressRowContext = createContext(null);
11
- function useBatteryProgressRowContext() {
12
- const context = useContext(BatteryProgressRowContext);
13
- if (!context) throw new Error("BatteryProgressRow.* must be rendered inside <BatteryProgressRow>");
14
- return context;
15
- }
16
- const BatteryProgressRow = ({ className, soc, children, ...rest }) => {
17
- return /* @__PURE__ */ jsx(BatteryProgressRowContext.Provider, {
18
- value: { soc },
19
- children: /* @__PURE__ */ jsx("div", {
20
- className: cn("flex items-center gap-3", className),
21
- ...rest,
22
- children
23
- })
24
- });
25
- };
26
- const BATTERY_BY_LEVEL = [
27
- Battery0Bar,
28
- Battery1Bar,
29
- Battery2Bar,
30
- Battery3Bar,
31
- Battery4Bar,
32
- Battery5Bar,
33
- Battery6Bar
34
- ];
35
- const BatteryProgressRowIcon = ({ className, icon: overrideIcon, ...rest }) => {
36
- const { soc } = useBatteryProgressRowContext();
37
- const clampedSoc = Math.min(Math.max(soc, 0), 100);
38
- const batteryLevel = Math.min(Math.floor(clampedSoc / (100 / 7)), 6);
39
- const fallback = clampedSoc === 100 ? BatteryFull : BATTERY_BY_LEVEL[batteryLevel] ?? Battery0Bar;
40
- const Glyph = overrideIcon ?? fallback;
41
- return /* @__PURE__ */ jsx(Icon, {
42
- ...rest,
43
- className,
44
- color: "success",
45
- size: "large",
46
- children: /* @__PURE__ */ jsx(Glyph, {})
47
- });
48
- };
49
- const BatteryProgressRowContent = ({ className, ...rest }) => {
50
- return /* @__PURE__ */ jsx("div", {
51
- className: cn("flex min-w-0 flex-1 flex-col gap-1.5", className),
52
- ...rest
53
- });
54
- };
55
- const BatteryProgressRowHeader = ({ className, ...rest }) => {
56
- return /* @__PURE__ */ jsx("div", {
57
- className: cn("flex items-center justify-between gap-2", className),
58
- ...rest
59
- });
60
- };
61
- const toneToBadgeColor = {
62
- success: "success",
63
- warning: "warning",
64
- error: "danger",
65
- accent: "accent",
66
- neutral: "neutral"
67
- };
68
- const BatteryProgressRowStateBadge = ({ className, children, tone = "neutral", ...rest }) => {
69
- if (children === null || children === void 0) return null;
70
- return /* @__PURE__ */ jsx(Badge, {
71
- color: toneToBadgeColor[tone],
72
- className: cn("w-fit", className),
73
- ...rest,
74
- children
75
- });
76
- };
77
- const BatteryProgressRowChargingPower = ({ className, children, ...rest }) => {
78
- if (children === null || children === void 0) return null;
79
- return /* @__PURE__ */ jsx("span", {
80
- className: cn("ml-auto text-lg leading-tight font-bold text-gray tabular-nums", className),
81
- ...rest,
82
- children
83
- });
84
- };
85
- /**
86
- * Linear progress bar bound to the row's `soc`.
87
- */
88
- const BatteryProgressRowProgressBar = ({ className, ...rest }) => {
89
- const { soc } = useBatteryProgressRowContext();
90
- return /* @__PURE__ */ jsx(Progress, {
91
- className,
92
- max: 100,
93
- value: soc,
94
- ...rest
95
- });
96
- };
97
- const BatteryProgressRowFooter = ({ className, ...rest }) => {
98
- return /* @__PURE__ */ jsx("div", {
99
- className: cn("flex justify-between text-xs text-gray-light tabular-nums", className),
100
- ...rest
101
- });
102
- };
103
- const BatteryProgressRowMinSoc = ({ className, children, ...rest }) => {
104
- if (children === null || children === void 0) return null;
105
- return /* @__PURE__ */ jsx("span", {
106
- className: cn(className),
107
- ...rest,
108
- children
109
- });
110
- };
111
- /**
112
- * Current state-of-charge label, rendered as `{soc}%`. Reads from context.
113
- */
114
- const BatteryProgressRowSoc = ({ className, ...rest }) => {
115
- const { soc } = useBatteryProgressRowContext();
116
- return /* @__PURE__ */ jsx("span", {
117
- className: cn(className),
118
- ...rest,
119
- children: `${soc}%`
120
- });
121
- };
122
- //#endregion
123
- export { BatteryProgressRow, BatteryProgressRowChargingPower, BatteryProgressRowContent, BatteryProgressRowFooter, BatteryProgressRowHeader, BatteryProgressRowIcon, BatteryProgressRowMinSoc, BatteryProgressRowProgressBar, BatteryProgressRowSoc, BatteryProgressRowStateBadge };
124
-
125
- //# sourceMappingURL=battery-progress-row.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"battery-progress-row.js","names":[],"sources":["../../src/components/battery-progress-row.tsx"],"sourcesContent":["import {\n Battery0Bar,\n Battery1Bar,\n Battery2Bar,\n Battery3Bar,\n Battery4Bar,\n Battery5Bar,\n Battery6Bar,\n BatteryFull,\n type SparkIcon,\n} from '@epilot/spark-icons'\nimport { createContext, useContext } from 'react'\nimport type { Tone } from '../lib/tones'\nimport { cn } from '../utils/cn'\nimport { Badge, type SparkBadgeColor } from './badge'\nimport { Icon } from './icon'\nimport { Progress } from './progress'\n\ninterface BatteryProgressRowContextValue {\n soc: number\n}\n\nconst BatteryProgressRowContext =\n createContext<BatteryProgressRowContextValue | null>(null)\n\nfunction useBatteryProgressRowContext() {\n const context = useContext(BatteryProgressRowContext)\n if (!context) {\n throw new Error(\n 'BatteryProgressRow.* must be rendered inside <BatteryProgressRow>',\n )\n }\n return context\n}\n\nconst BatteryProgressRow = ({\n className,\n soc,\n children,\n ...rest\n}: React.ComponentProps<'div'> & { soc: number }) => {\n return (\n <BatteryProgressRowContext.Provider value={{ soc }}>\n <div className={cn('flex items-center gap-3', className)} {...rest}>\n {children}\n </div>\n </BatteryProgressRowContext.Provider>\n )\n}\n\nconst BATTERY_BY_LEVEL = [\n Battery0Bar,\n Battery1Bar,\n Battery2Bar,\n Battery3Bar,\n Battery4Bar,\n Battery5Bar,\n Battery6Bar,\n] as const\n\nconst BatteryProgressRowIcon = ({\n className,\n icon: overrideIcon,\n ...rest\n}: React.ComponentProps<'span'> & { icon?: SparkIcon }) => {\n const { soc } = useBatteryProgressRowContext()\n const clampedSoc = Math.min(Math.max(soc, 0), 100)\n const batteryLevel = Math.min(Math.floor(clampedSoc / (100 / 7)), 6)\n const fallback: SparkIcon =\n clampedSoc === 100\n ? BatteryFull\n : (BATTERY_BY_LEVEL[batteryLevel] ?? Battery0Bar)\n const Glyph = overrideIcon ?? fallback\n\n return (\n <Icon {...rest} className={className} color=\"success\" size=\"large\">\n <Glyph />\n </Icon>\n )\n}\n\nconst BatteryProgressRowContent = ({\n className,\n ...rest\n}: React.ComponentProps<'div'>) => {\n return (\n <div\n className={cn('flex min-w-0 flex-1 flex-col gap-1.5', className)}\n {...rest}\n />\n )\n}\n\nconst BatteryProgressRowHeader = ({\n className,\n ...rest\n}: React.ComponentProps<'div'>) => {\n return (\n <div\n className={cn('flex items-center justify-between gap-2', className)}\n {...rest}\n />\n )\n}\n\nconst toneToBadgeColor: Record<Tone, SparkBadgeColor> = {\n success: 'success',\n warning: 'warning',\n error: 'danger',\n accent: 'accent',\n neutral: 'neutral',\n}\n\nconst BatteryProgressRowStateBadge = ({\n className,\n children,\n tone = 'neutral',\n ...rest\n}: Omit<React.ComponentProps<'span'>, 'color'> & { tone?: Tone }) => {\n if (children === null || children === undefined) return null\n return (\n <Badge\n color={toneToBadgeColor[tone]}\n className={cn('w-fit', className)}\n {...rest}\n >\n {children}\n </Badge>\n )\n}\n\nconst BatteryProgressRowChargingPower = ({\n className,\n children,\n ...rest\n}: React.ComponentProps<'span'>) => {\n if (children === null || children === undefined) return null\n return (\n <span\n className={cn(\n 'ml-auto text-lg leading-tight font-bold text-gray tabular-nums',\n className,\n )}\n {...rest}\n >\n {children}\n </span>\n )\n}\n\n/**\n * Linear progress bar bound to the row's `soc`.\n */\nconst BatteryProgressRowProgressBar = ({\n className,\n ...rest\n}: Omit<React.ComponentProps<typeof Progress>, 'value' | 'max'>) => {\n const { soc } = useBatteryProgressRowContext()\n return <Progress className={className} max={100} value={soc} {...rest} />\n}\n\nconst BatteryProgressRowFooter = ({\n className,\n ...rest\n}: React.ComponentProps<'div'>) => {\n return (\n <div\n className={cn(\n 'flex justify-between text-xs text-gray-light tabular-nums',\n className,\n )}\n {...rest}\n />\n )\n}\n\nconst BatteryProgressRowMinSoc = ({\n className,\n children,\n ...rest\n}: React.ComponentProps<'span'>) => {\n if (children === null || children === undefined) return null\n return (\n <span className={cn(className)} {...rest}>\n {children}\n </span>\n )\n}\n\n/**\n * Current state-of-charge label, rendered as `{soc}%`. Reads from context.\n */\nconst BatteryProgressRowSoc = ({\n className,\n ...rest\n}: React.ComponentProps<'span'>) => {\n const { soc } = useBatteryProgressRowContext()\n return (\n <span className={cn(className)} {...rest}>\n {`${soc}%`}\n </span>\n )\n}\n\nexport {\n BatteryProgressRow,\n BatteryProgressRowIcon,\n BatteryProgressRowContent,\n BatteryProgressRowHeader,\n BatteryProgressRowStateBadge,\n BatteryProgressRowChargingPower,\n BatteryProgressRowProgressBar,\n BatteryProgressRowFooter,\n BatteryProgressRowMinSoc,\n BatteryProgressRowSoc,\n}\n"],"mappings":";;;;;;;;;AAsBA,MAAM,4BACJ,cAAqD,IAAI;AAE3D,SAAS,+BAA+B;CACtC,MAAM,UAAU,WAAW,yBAAyB;CACpD,IAAI,CAAC,SACH,MAAM,IAAI,MACR,mEACF;CAEF,OAAO;AACT;AAEA,MAAM,sBAAsB,EAC1B,WACA,KACA,UACA,GAAG,WACgD;CACnD,OACE,oBAAC,0BAA0B,UAA3B;EAAoC,OAAO,EAAE,IAAI;YAC/C,oBAAC,OAAD;GAAK,WAAW,GAAG,2BAA2B,SAAS;GAAG,GAAI;GAC3D;EACE,CAAA;CAC6B,CAAA;AAExC;AAEA,MAAM,mBAAmB;CACvB;CACA;CACA;CACA;CACA;CACA;CACA;AACF;AAEA,MAAM,0BAA0B,EAC9B,WACA,MAAM,cACN,GAAG,WACsD;CACzD,MAAM,EAAE,QAAQ,6BAA6B;CAC7C,MAAM,aAAa,KAAK,IAAI,KAAK,IAAI,KAAK,CAAC,GAAG,GAAG;CACjD,MAAM,eAAe,KAAK,IAAI,KAAK,MAAM,cAAc,MAAM,EAAE,GAAG,CAAC;CACnE,MAAM,WACJ,eAAe,MACX,cACC,iBAAiB,iBAAiB;CACzC,MAAM,QAAQ,gBAAgB;CAE9B,OACE,oBAAC,MAAD;EAAM,GAAI;EAAiB;EAAW,OAAM;EAAU,MAAK;YACzD,oBAAC,OAAD,CAAQ,CAAA;CACJ,CAAA;AAEV;AAEA,MAAM,6BAA6B,EACjC,WACA,GAAG,WAC8B;CACjC,OACE,oBAAC,OAAD;EACE,WAAW,GAAG,wCAAwC,SAAS;EAC/D,GAAI;CACL,CAAA;AAEL;AAEA,MAAM,4BAA4B,EAChC,WACA,GAAG,WAC8B;CACjC,OACE,oBAAC,OAAD;EACE,WAAW,GAAG,2CAA2C,SAAS;EAClE,GAAI;CACL,CAAA;AAEL;AAEA,MAAM,mBAAkD;CACtD,SAAS;CACT,SAAS;CACT,OAAO;CACP,QAAQ;CACR,SAAS;AACX;AAEA,MAAM,gCAAgC,EACpC,WACA,UACA,OAAO,WACP,GAAG,WACgE;CACnE,IAAI,aAAa,QAAQ,aAAa,KAAA,GAAW,OAAO;CACxD,OACE,oBAAC,OAAD;EACE,OAAO,iBAAiB;EACxB,WAAW,GAAG,SAAS,SAAS;EAChC,GAAI;EAEH;CACI,CAAA;AAEX;AAEA,MAAM,mCAAmC,EACvC,WACA,UACA,GAAG,WAC+B;CAClC,IAAI,aAAa,QAAQ,aAAa,KAAA,GAAW,OAAO;CACxD,OACE,oBAAC,QAAD;EACE,WAAW,GACT,kEACA,SACF;EACA,GAAI;EAEH;CACG,CAAA;AAEV;;;;AAKA,MAAM,iCAAiC,EACrC,WACA,GAAG,WAC+D;CAClE,MAAM,EAAE,QAAQ,6BAA6B;CAC7C,OAAO,oBAAC,UAAD;EAAqB;EAAW,KAAK;EAAK,OAAO;EAAK,GAAI;CAAO,CAAA;AAC1E;AAEA,MAAM,4BAA4B,EAChC,WACA,GAAG,WAC8B;CACjC,OACE,oBAAC,OAAD;EACE,WAAW,GACT,6DACA,SACF;EACA,GAAI;CACL,CAAA;AAEL;AAEA,MAAM,4BAA4B,EAChC,WACA,UACA,GAAG,WAC+B;CAClC,IAAI,aAAa,QAAQ,aAAa,KAAA,GAAW,OAAO;CACxD,OACE,oBAAC,QAAD;EAAM,WAAW,GAAG,SAAS;EAAG,GAAI;EACjC;CACG,CAAA;AAEV;;;;AAKA,MAAM,yBAAyB,EAC7B,WACA,GAAG,WAC+B;CAClC,MAAM,EAAE,QAAQ,6BAA6B;CAC7C,OACE,oBAAC,QAAD;EAAM,WAAW,GAAG,SAAS;EAAG,GAAI;YACjC,GAAG,IAAI;CACJ,CAAA;AAEV"}
@@ -1 +0,0 @@
1
- {"version":3,"file":"device-card.cjs","names":[],"sources":["../../src/components/device-card.tsx"],"sourcesContent":["import type { SparkIcon } from '@epilot/spark-icons'\nimport { cva } from 'class-variance-authority'\nimport * as React from 'react'\nimport type { Tone } from '../lib/tones'\nimport { cn } from '../utils/cn'\n\nconst DeviceCard = ({ className, ...rest }: React.ComponentProps<'div'>) => (\n <div\n className={cn(\n 'flex flex-col overflow-hidden rounded-lg border border-gray bg-(--spark-background)',\n className,\n )}\n {...rest}\n />\n)\n\nconst DeviceCardBody = ({\n className,\n active,\n ...rest\n}: React.ComponentProps<'button'> & { active?: boolean }) => (\n <button\n type=\"button\"\n className={cn(\n 'flex w-full cursor-pointer flex-col gap-3 p-4 text-left transition-colors hover:bg-gray-a2 focus-visible:outline-2 focus-visible:-outline-offset-2 focus-visible:outline-accent-focus',\n active && 'bg-linear-to-br from-spark-9/10 to-spark-1/5 to-20%',\n className,\n )}\n {...rest}\n />\n)\n\nconst DeviceCardHeader = ({\n className,\n ...rest\n}: React.ComponentProps<'div'>) => (\n <div className={cn('flex w-full items-center gap-3', className)} {...rest} />\n)\n\nconst DeviceCardMeters = ({\n className,\n ...rest\n}: React.ComponentProps<'div'>) => (\n <div\n className={cn('flex flex-col gap-2 border-t border-gray pt-3', className)}\n {...rest}\n />\n)\n\nconst iconToneVariants = cva(\n // max() pill escape (matches Icon): a tile stays rounded-md at low Roundness but\n // becomes a circle at large/full, same as it did pre-harmonization via clamping.\n 'flex size-11 shrink-0 items-center justify-center rounded-[max(var(--spark-rounded-md),var(--spark-rounded-full))]',\n {\n variants: {\n tone: {\n success: 'bg-base-success-soft text-success',\n warning: 'bg-base-warning-soft text-warning',\n error: 'bg-base-error-soft text-error',\n accent: 'bg-base-accent-soft text-accent',\n neutral: 'bg-base-gray-soft text-gray',\n },\n },\n defaultVariants: { tone: 'neutral' },\n },\n)\n\nconst DeviceCardIcon = ({\n className,\n icon: Glyph,\n tone,\n ...rest\n}: React.ComponentProps<'span'> & {\n icon: SparkIcon\n tone?: Tone\n}) => (\n <span className={iconToneVariants({ tone, className })} {...rest}>\n <Glyph className=\"[--spark-icon-size:18px]\" />\n </span>\n)\n\nconst DeviceCardTitleColumn = ({\n className,\n ...rest\n}: React.ComponentProps<'div'>) => (\n <div\n className={cn('flex min-w-0 flex-1 flex-col gap-0.5', className)}\n {...rest}\n />\n)\n\nconst DeviceCardTitle = ({\n className,\n ...rest\n}: React.ComponentProps<'span'>) => (\n <span\n className={cn('truncate text-sm font-bold text-gray', className)}\n {...rest}\n />\n)\n\nconst stateToneVariants = cva(\n 'inline-flex items-center gap-1.5 text-xs font-medium',\n {\n variants: {\n tone: {\n success: 'text-success',\n warning: 'text-warning',\n error: 'text-error',\n accent: 'text-accent',\n neutral: 'text-gray-light',\n },\n },\n defaultVariants: { tone: 'neutral' },\n },\n)\n\nconst dotToneVariants = cva('size-1.5 shrink-0 rounded-full', {\n variants: {\n tone: {\n success: 'bg-base-success-solid',\n warning: 'bg-base-warning-solid',\n error: 'bg-base-error-solid',\n accent: 'bg-base-accent-solid',\n neutral: 'bg-base-gray-solid',\n },\n },\n defaultVariants: { tone: 'neutral' },\n})\n\nconst DeviceCardState = ({\n className,\n tone,\n children,\n ...rest\n}: React.ComponentProps<'span'> & { tone?: Tone }) => (\n <span className={stateToneVariants({ tone, className })} {...rest}>\n <span className={dotToneVariants({ tone })} />\n <span className=\"truncate\">{children}</span>\n </span>\n)\n\nconst DeviceCardDetail = ({\n className,\n ...rest\n}: React.ComponentProps<'span'>) => (\n <span\n className={cn('truncate text-xs text-gray-light tabular-nums', className)}\n {...rest}\n />\n)\n\nconst DeviceCardPower = ({\n className,\n ...rest\n}: React.ComponentProps<'span'>) => (\n <span\n className={cn(\n 'ms-2 shrink-0 self-center text-lg leading-tight font-bold text-gray tabular-nums',\n className,\n )}\n {...rest}\n />\n)\n\nconst DeviceCardControls = ({\n className,\n ...rest\n}: React.ComponentProps<'div'>) => (\n <div\n className={cn(\n 'flex items-center gap-3 border-t border-gray bg-base-gray-surface px-4 py-3',\n className,\n )}\n {...rest}\n />\n)\n\nconst DeviceCardFooter = ({\n className,\n ...rest\n}: React.ComponentProps<'div'>) => (\n <div\n className={cn(\n 'flex items-center justify-center gap-1.5 border-t border-gray bg-base-gray-surface px-4 py-2 text-xs text-gray-light',\n className,\n )}\n {...rest}\n />\n)\n\nexport {\n DeviceCard,\n DeviceCardBody,\n DeviceCardControls,\n DeviceCardDetail,\n DeviceCardFooter,\n DeviceCardHeader,\n DeviceCardIcon,\n DeviceCardMeters,\n DeviceCardPower,\n DeviceCardState,\n DeviceCardTitle,\n DeviceCardTitleColumn,\n}\n"],"mappings":";;;;;;;;;AAMA,MAAM,cAAc,EAAE,WAAW,GAAG,WAClC,iBAAA,GAAA,kBAAA,KAAC,OAAD;CACE,YAAA,GAAA,OAAA,IACE,uFACA,SACF;CACA,GAAI;AACL,CAAA;AAGH,MAAM,kBAAkB,EACtB,WACA,QACA,GAAG,WAEH,iBAAA,GAAA,kBAAA,KAAC,UAAD;CACE,MAAK;CACL,YAAA,GAAA,OAAA,IACE,yLACA,UAAU,uDACV,SACF;CACA,GAAI;AACL,CAAA;AAGH,MAAM,oBAAoB,EACxB,WACA,GAAG,WAEH,iBAAA,GAAA,kBAAA,KAAC,OAAD;CAAK,YAAA,GAAA,OAAA,IAAc,kCAAkC,SAAS;CAAG,GAAI;AAAO,CAAA;AAG9E,MAAM,oBAAoB,EACxB,WACA,GAAG,WAEH,iBAAA,GAAA,kBAAA,KAAC,OAAD;CACE,YAAA,GAAA,OAAA,IAAc,iDAAiD,SAAS;CACxE,GAAI;AACL,CAAA;AAGH,MAAM,oBAAA,GAAA,yBAAA,KAGJ,sHACA;CACE,UAAU,EACR,MAAM;EACJ,SAAS;EACT,SAAS;EACT,OAAO;EACP,QAAQ;EACR,SAAS;CACX,EACF;CACA,iBAAiB,EAAE,MAAM,UAAU;AACrC,CACF;AAEA,MAAM,kBAAkB,EACtB,WACA,MAAM,OACN,MACA,GAAG,WAKH,iBAAA,GAAA,kBAAA,KAAC,QAAD;CAAM,WAAW,iBAAiB;EAAE;EAAM;CAAU,CAAC;CAAG,GAAI;WAC1D,iBAAA,GAAA,kBAAA,KAAC,OAAD,EAAO,WAAU,2BAA4B,CAAA;AACzC,CAAA;AAGR,MAAM,yBAAyB,EAC7B,WACA,GAAG,WAEH,iBAAA,GAAA,kBAAA,KAAC,OAAD;CACE,YAAA,GAAA,OAAA,IAAc,wCAAwC,SAAS;CAC/D,GAAI;AACL,CAAA;AAGH,MAAM,mBAAmB,EACvB,WACA,GAAG,WAEH,iBAAA,GAAA,kBAAA,KAAC,QAAD;CACE,YAAA,GAAA,OAAA,IAAc,wCAAwC,SAAS;CAC/D,GAAI;AACL,CAAA;AAGH,MAAM,qBAAA,GAAA,yBAAA,KACJ,wDACA;CACE,UAAU,EACR,MAAM;EACJ,SAAS;EACT,SAAS;EACT,OAAO;EACP,QAAQ;EACR,SAAS;CACX,EACF;CACA,iBAAiB,EAAE,MAAM,UAAU;AACrC,CACF;AAEA,MAAM,mBAAA,GAAA,yBAAA,KAAsB,kCAAkC;CAC5D,UAAU,EACR,MAAM;EACJ,SAAS;EACT,SAAS;EACT,OAAO;EACP,QAAQ;EACR,SAAS;CACX,EACF;CACA,iBAAiB,EAAE,MAAM,UAAU;AACrC,CAAC;AAED,MAAM,mBAAmB,EACvB,WACA,MACA,UACA,GAAG,WAEH,iBAAA,GAAA,kBAAA,MAAC,QAAD;CAAM,WAAW,kBAAkB;EAAE;EAAM;CAAU,CAAC;CAAG,GAAI;WAA7D,CACE,iBAAA,GAAA,kBAAA,KAAC,QAAD,EAAM,WAAW,gBAAgB,EAAE,KAAK,CAAC,EAAI,CAAA,GAC7C,iBAAA,GAAA,kBAAA,KAAC,QAAD;EAAM,WAAU;EAAY;CAAe,CAAA,CACvC;;AAGR,MAAM,oBAAoB,EACxB,WACA,GAAG,WAEH,iBAAA,GAAA,kBAAA,KAAC,QAAD;CACE,YAAA,GAAA,OAAA,IAAc,iDAAiD,SAAS;CACxE,GAAI;AACL,CAAA;AAGH,MAAM,mBAAmB,EACvB,WACA,GAAG,WAEH,iBAAA,GAAA,kBAAA,KAAC,QAAD;CACE,YAAA,GAAA,OAAA,IACE,oFACA,SACF;CACA,GAAI;AACL,CAAA;AAGH,MAAM,sBAAsB,EAC1B,WACA,GAAG,WAEH,iBAAA,GAAA,kBAAA,KAAC,OAAD;CACE,YAAA,GAAA,OAAA,IACE,+EACA,SACF;CACA,GAAI;AACL,CAAA;AAGH,MAAM,oBAAoB,EACxB,WACA,GAAG,WAEH,iBAAA,GAAA,kBAAA,KAAC,OAAD;CACE,YAAA,GAAA,OAAA,IACE,wHACA,SACF;CACA,GAAI;AACL,CAAA"}
@@ -1 +0,0 @@
1
- {"version":3,"file":"device-card.js","names":[],"sources":["../../src/components/device-card.tsx"],"sourcesContent":["import type { SparkIcon } from '@epilot/spark-icons'\nimport { cva } from 'class-variance-authority'\nimport * as React from 'react'\nimport type { Tone } from '../lib/tones'\nimport { cn } from '../utils/cn'\n\nconst DeviceCard = ({ className, ...rest }: React.ComponentProps<'div'>) => (\n <div\n className={cn(\n 'flex flex-col overflow-hidden rounded-lg border border-gray bg-(--spark-background)',\n className,\n )}\n {...rest}\n />\n)\n\nconst DeviceCardBody = ({\n className,\n active,\n ...rest\n}: React.ComponentProps<'button'> & { active?: boolean }) => (\n <button\n type=\"button\"\n className={cn(\n 'flex w-full cursor-pointer flex-col gap-3 p-4 text-left transition-colors hover:bg-gray-a2 focus-visible:outline-2 focus-visible:-outline-offset-2 focus-visible:outline-accent-focus',\n active && 'bg-linear-to-br from-spark-9/10 to-spark-1/5 to-20%',\n className,\n )}\n {...rest}\n />\n)\n\nconst DeviceCardHeader = ({\n className,\n ...rest\n}: React.ComponentProps<'div'>) => (\n <div className={cn('flex w-full items-center gap-3', className)} {...rest} />\n)\n\nconst DeviceCardMeters = ({\n className,\n ...rest\n}: React.ComponentProps<'div'>) => (\n <div\n className={cn('flex flex-col gap-2 border-t border-gray pt-3', className)}\n {...rest}\n />\n)\n\nconst iconToneVariants = cva(\n // max() pill escape (matches Icon): a tile stays rounded-md at low Roundness but\n // becomes a circle at large/full, same as it did pre-harmonization via clamping.\n 'flex size-11 shrink-0 items-center justify-center rounded-[max(var(--spark-rounded-md),var(--spark-rounded-full))]',\n {\n variants: {\n tone: {\n success: 'bg-base-success-soft text-success',\n warning: 'bg-base-warning-soft text-warning',\n error: 'bg-base-error-soft text-error',\n accent: 'bg-base-accent-soft text-accent',\n neutral: 'bg-base-gray-soft text-gray',\n },\n },\n defaultVariants: { tone: 'neutral' },\n },\n)\n\nconst DeviceCardIcon = ({\n className,\n icon: Glyph,\n tone,\n ...rest\n}: React.ComponentProps<'span'> & {\n icon: SparkIcon\n tone?: Tone\n}) => (\n <span className={iconToneVariants({ tone, className })} {...rest}>\n <Glyph className=\"[--spark-icon-size:18px]\" />\n </span>\n)\n\nconst DeviceCardTitleColumn = ({\n className,\n ...rest\n}: React.ComponentProps<'div'>) => (\n <div\n className={cn('flex min-w-0 flex-1 flex-col gap-0.5', className)}\n {...rest}\n />\n)\n\nconst DeviceCardTitle = ({\n className,\n ...rest\n}: React.ComponentProps<'span'>) => (\n <span\n className={cn('truncate text-sm font-bold text-gray', className)}\n {...rest}\n />\n)\n\nconst stateToneVariants = cva(\n 'inline-flex items-center gap-1.5 text-xs font-medium',\n {\n variants: {\n tone: {\n success: 'text-success',\n warning: 'text-warning',\n error: 'text-error',\n accent: 'text-accent',\n neutral: 'text-gray-light',\n },\n },\n defaultVariants: { tone: 'neutral' },\n },\n)\n\nconst dotToneVariants = cva('size-1.5 shrink-0 rounded-full', {\n variants: {\n tone: {\n success: 'bg-base-success-solid',\n warning: 'bg-base-warning-solid',\n error: 'bg-base-error-solid',\n accent: 'bg-base-accent-solid',\n neutral: 'bg-base-gray-solid',\n },\n },\n defaultVariants: { tone: 'neutral' },\n})\n\nconst DeviceCardState = ({\n className,\n tone,\n children,\n ...rest\n}: React.ComponentProps<'span'> & { tone?: Tone }) => (\n <span className={stateToneVariants({ tone, className })} {...rest}>\n <span className={dotToneVariants({ tone })} />\n <span className=\"truncate\">{children}</span>\n </span>\n)\n\nconst DeviceCardDetail = ({\n className,\n ...rest\n}: React.ComponentProps<'span'>) => (\n <span\n className={cn('truncate text-xs text-gray-light tabular-nums', className)}\n {...rest}\n />\n)\n\nconst DeviceCardPower = ({\n className,\n ...rest\n}: React.ComponentProps<'span'>) => (\n <span\n className={cn(\n 'ms-2 shrink-0 self-center text-lg leading-tight font-bold text-gray tabular-nums',\n className,\n )}\n {...rest}\n />\n)\n\nconst DeviceCardControls = ({\n className,\n ...rest\n}: React.ComponentProps<'div'>) => (\n <div\n className={cn(\n 'flex items-center gap-3 border-t border-gray bg-base-gray-surface px-4 py-3',\n className,\n )}\n {...rest}\n />\n)\n\nconst DeviceCardFooter = ({\n className,\n ...rest\n}: React.ComponentProps<'div'>) => (\n <div\n className={cn(\n 'flex items-center justify-center gap-1.5 border-t border-gray bg-base-gray-surface px-4 py-2 text-xs text-gray-light',\n className,\n )}\n {...rest}\n />\n)\n\nexport {\n DeviceCard,\n DeviceCardBody,\n DeviceCardControls,\n DeviceCardDetail,\n DeviceCardFooter,\n DeviceCardHeader,\n DeviceCardIcon,\n DeviceCardMeters,\n DeviceCardPower,\n DeviceCardState,\n DeviceCardTitle,\n DeviceCardTitleColumn,\n}\n"],"mappings":";;;;;;AAMA,MAAM,cAAc,EAAE,WAAW,GAAG,WAClC,oBAAC,OAAD;CACE,WAAW,GACT,uFACA,SACF;CACA,GAAI;AACL,CAAA;AAGH,MAAM,kBAAkB,EACtB,WACA,QACA,GAAG,WAEH,oBAAC,UAAD;CACE,MAAK;CACL,WAAW,GACT,yLACA,UAAU,uDACV,SACF;CACA,GAAI;AACL,CAAA;AAGH,MAAM,oBAAoB,EACxB,WACA,GAAG,WAEH,oBAAC,OAAD;CAAK,WAAW,GAAG,kCAAkC,SAAS;CAAG,GAAI;AAAO,CAAA;AAG9E,MAAM,oBAAoB,EACxB,WACA,GAAG,WAEH,oBAAC,OAAD;CACE,WAAW,GAAG,iDAAiD,SAAS;CACxE,GAAI;AACL,CAAA;AAGH,MAAM,mBAAmB,IAGvB,sHACA;CACE,UAAU,EACR,MAAM;EACJ,SAAS;EACT,SAAS;EACT,OAAO;EACP,QAAQ;EACR,SAAS;CACX,EACF;CACA,iBAAiB,EAAE,MAAM,UAAU;AACrC,CACF;AAEA,MAAM,kBAAkB,EACtB,WACA,MAAM,OACN,MACA,GAAG,WAKH,oBAAC,QAAD;CAAM,WAAW,iBAAiB;EAAE;EAAM;CAAU,CAAC;CAAG,GAAI;WAC1D,oBAAC,OAAD,EAAO,WAAU,2BAA4B,CAAA;AACzC,CAAA;AAGR,MAAM,yBAAyB,EAC7B,WACA,GAAG,WAEH,oBAAC,OAAD;CACE,WAAW,GAAG,wCAAwC,SAAS;CAC/D,GAAI;AACL,CAAA;AAGH,MAAM,mBAAmB,EACvB,WACA,GAAG,WAEH,oBAAC,QAAD;CACE,WAAW,GAAG,wCAAwC,SAAS;CAC/D,GAAI;AACL,CAAA;AAGH,MAAM,oBAAoB,IACxB,wDACA;CACE,UAAU,EACR,MAAM;EACJ,SAAS;EACT,SAAS;EACT,OAAO;EACP,QAAQ;EACR,SAAS;CACX,EACF;CACA,iBAAiB,EAAE,MAAM,UAAU;AACrC,CACF;AAEA,MAAM,kBAAkB,IAAI,kCAAkC;CAC5D,UAAU,EACR,MAAM;EACJ,SAAS;EACT,SAAS;EACT,OAAO;EACP,QAAQ;EACR,SAAS;CACX,EACF;CACA,iBAAiB,EAAE,MAAM,UAAU;AACrC,CAAC;AAED,MAAM,mBAAmB,EACvB,WACA,MACA,UACA,GAAG,WAEH,qBAAC,QAAD;CAAM,WAAW,kBAAkB;EAAE;EAAM;CAAU,CAAC;CAAG,GAAI;WAA7D,CACE,oBAAC,QAAD,EAAM,WAAW,gBAAgB,EAAE,KAAK,CAAC,EAAI,CAAA,GAC7C,oBAAC,QAAD;EAAM,WAAU;EAAY;CAAe,CAAA,CACvC;;AAGR,MAAM,oBAAoB,EACxB,WACA,GAAG,WAEH,oBAAC,QAAD;CACE,WAAW,GAAG,iDAAiD,SAAS;CACxE,GAAI;AACL,CAAA;AAGH,MAAM,mBAAmB,EACvB,WACA,GAAG,WAEH,oBAAC,QAAD;CACE,WAAW,GACT,oFACA,SACF;CACA,GAAI;AACL,CAAA;AAGH,MAAM,sBAAsB,EAC1B,WACA,GAAG,WAEH,oBAAC,OAAD;CACE,WAAW,GACT,+EACA,SACF;CACA,GAAI;AACL,CAAA;AAGH,MAAM,oBAAoB,EACxB,WACA,GAAG,WAEH,oBAAC,OAAD;CACE,WAAW,GACT,wHACA,SACF;CACA,GAAI;AACL,CAAA"}
@@ -1 +0,0 @@
1
- {"version":3,"file":"energy-bar-chart.cjs","names":["BarChart","NumberFlow"],"sources":["../../src/components/energy-bar-chart.tsx"],"sourcesContent":["import {\n BarChart,\n type BarChartCategory,\n type BarChartLineSeries,\n type BarChartSeries,\n} from './bar-chart'\nimport NumberFlow, { type Format } from './number-flow'\n\nexport type Category = BarChartCategory\n\nexport interface HourBucket {\n hour: number\n solar: number\n battery: number\n grid: number\n}\n\nexport type EnergyBarSeries<TDatum = HourBucket> = BarChartSeries<TDatum>\nexport type EnergyBarLineSeries<TDatum = HourBucket> =\n BarChartLineSeries<TDatum>\n\ninterface EnergyBarChartProps<TDatum> {\n data: TDatum[]\n series: BarChartSeries<TDatum>[]\n lines?: BarChartLineSeries<TDatum>[]\n getCategory: (datum: TDatum) => Category\n categories?: Category[]\n categoryTicks?: Category[]\n formatCategory?: (category: Category) => string\n formatTooltipCategory?: (category: Category) => string\n highlightedCategory?: Category\n showHighlightLine?: boolean\n title?: string\n yAxisUnit?: string\n formatValue?: (value: number) => string\n totalSuffix?: string\n totalFormat?: Format\n height?: number\n className?: string\n}\n\nexport function EnergyBarChart<TDatum>({\n totalSuffix,\n totalFormat,\n className,\n ...rest\n}: EnergyBarChartProps<TDatum>): React.ReactElement {\n return (\n <BarChart<TDatum>\n {...rest}\n className={className}\n renderTotal={(value, animated) => (\n <NumberFlow\n value={value}\n animated={animated}\n {...(totalSuffix !== undefined && { suffix: totalSuffix })}\n {...(totalFormat !== undefined && { format: totalFormat })}\n className=\"text-base font-bold text-gray tabular-nums\"\n />\n )}\n />\n )\n}\n"],"mappings":";;;;;;AAyCA,SAAgB,eAAuB,EACrC,aACA,aACA,WACA,GAAG,QAC+C;CAClD,OACE,iBAAA,GAAA,kBAAA,KAACA,6BAAAA,UAAD;EACE,GAAI;EACO;EACX,cAAc,OAAO,aACnB,iBAAA,GAAA,kBAAA,KAACC,gCAAD;GACS;GACG;GACV,GAAK,gBAAgB,KAAA,KAAa,EAAE,QAAQ,YAAY;GACxD,GAAK,gBAAgB,KAAA,KAAa,EAAE,QAAQ,YAAY;GACxD,WAAU;EACX,CAAA;CAEJ,CAAA;AAEL"}
@@ -1,43 +0,0 @@
1
- "use client";
2
-
3
- import { BarChartCategory, BarChartLineSeries, BarChartSeries } from "./bar-chart.cjs";
4
- import { t as Format } from "../number-flow-Bch81ixZ.cjs";
5
-
6
- //#region src/components/energy-bar-chart.d.ts
7
- type Category = BarChartCategory;
8
- interface HourBucket {
9
- hour: number;
10
- solar: number;
11
- battery: number;
12
- grid: number;
13
- }
14
- type EnergyBarSeries<TDatum = HourBucket> = BarChartSeries<TDatum>;
15
- type EnergyBarLineSeries<TDatum = HourBucket> = BarChartLineSeries<TDatum>;
16
- interface EnergyBarChartProps<TDatum> {
17
- data: TDatum[];
18
- series: BarChartSeries<TDatum>[];
19
- lines?: BarChartLineSeries<TDatum>[];
20
- getCategory: (datum: TDatum) => Category;
21
- categories?: Category[];
22
- categoryTicks?: Category[];
23
- formatCategory?: (category: Category) => string;
24
- formatTooltipCategory?: (category: Category) => string;
25
- highlightedCategory?: Category;
26
- showHighlightLine?: boolean;
27
- title?: string;
28
- yAxisUnit?: string;
29
- formatValue?: (value: number) => string;
30
- totalSuffix?: string;
31
- totalFormat?: Format;
32
- height?: number;
33
- className?: string;
34
- }
35
- declare function EnergyBarChart<TDatum>({
36
- totalSuffix,
37
- totalFormat,
38
- className,
39
- ...rest
40
- }: EnergyBarChartProps<TDatum>): React.ReactElement;
41
- //#endregion
42
- export { Category, EnergyBarChart, EnergyBarLineSeries, EnergyBarSeries, HourBucket };
43
- //# sourceMappingURL=energy-bar-chart.d.cts.map
@@ -1,43 +0,0 @@
1
- "use client";
2
-
3
- import { BarChartCategory, BarChartLineSeries, BarChartSeries } from "./bar-chart.js";
4
- import { t as Format } from "../number-flow-Bch81ixZ.js";
5
-
6
- //#region src/components/energy-bar-chart.d.ts
7
- type Category = BarChartCategory;
8
- interface HourBucket {
9
- hour: number;
10
- solar: number;
11
- battery: number;
12
- grid: number;
13
- }
14
- type EnergyBarSeries<TDatum = HourBucket> = BarChartSeries<TDatum>;
15
- type EnergyBarLineSeries<TDatum = HourBucket> = BarChartLineSeries<TDatum>;
16
- interface EnergyBarChartProps<TDatum> {
17
- data: TDatum[];
18
- series: BarChartSeries<TDatum>[];
19
- lines?: BarChartLineSeries<TDatum>[];
20
- getCategory: (datum: TDatum) => Category;
21
- categories?: Category[];
22
- categoryTicks?: Category[];
23
- formatCategory?: (category: Category) => string;
24
- formatTooltipCategory?: (category: Category) => string;
25
- highlightedCategory?: Category;
26
- showHighlightLine?: boolean;
27
- title?: string;
28
- yAxisUnit?: string;
29
- formatValue?: (value: number) => string;
30
- totalSuffix?: string;
31
- totalFormat?: Format;
32
- height?: number;
33
- className?: string;
34
- }
35
- declare function EnergyBarChart<TDatum>({
36
- totalSuffix,
37
- totalFormat,
38
- className,
39
- ...rest
40
- }: EnergyBarChartProps<TDatum>): React.ReactElement;
41
- //#endregion
42
- export { Category, EnergyBarChart, EnergyBarLineSeries, EnergyBarSeries, HourBucket };
43
- //# sourceMappingURL=energy-bar-chart.d.ts.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"energy-bar-chart.js","names":[],"sources":["../../src/components/energy-bar-chart.tsx"],"sourcesContent":["import {\n BarChart,\n type BarChartCategory,\n type BarChartLineSeries,\n type BarChartSeries,\n} from './bar-chart'\nimport NumberFlow, { type Format } from './number-flow'\n\nexport type Category = BarChartCategory\n\nexport interface HourBucket {\n hour: number\n solar: number\n battery: number\n grid: number\n}\n\nexport type EnergyBarSeries<TDatum = HourBucket> = BarChartSeries<TDatum>\nexport type EnergyBarLineSeries<TDatum = HourBucket> =\n BarChartLineSeries<TDatum>\n\ninterface EnergyBarChartProps<TDatum> {\n data: TDatum[]\n series: BarChartSeries<TDatum>[]\n lines?: BarChartLineSeries<TDatum>[]\n getCategory: (datum: TDatum) => Category\n categories?: Category[]\n categoryTicks?: Category[]\n formatCategory?: (category: Category) => string\n formatTooltipCategory?: (category: Category) => string\n highlightedCategory?: Category\n showHighlightLine?: boolean\n title?: string\n yAxisUnit?: string\n formatValue?: (value: number) => string\n totalSuffix?: string\n totalFormat?: Format\n height?: number\n className?: string\n}\n\nexport function EnergyBarChart<TDatum>({\n totalSuffix,\n totalFormat,\n className,\n ...rest\n}: EnergyBarChartProps<TDatum>): React.ReactElement {\n return (\n <BarChart<TDatum>\n {...rest}\n className={className}\n renderTotal={(value, animated) => (\n <NumberFlow\n value={value}\n animated={animated}\n {...(totalSuffix !== undefined && { suffix: totalSuffix })}\n {...(totalFormat !== undefined && { format: totalFormat })}\n className=\"text-base font-bold text-gray tabular-nums\"\n />\n )}\n />\n )\n}\n"],"mappings":";;;;;AAyCA,SAAgB,eAAuB,EACrC,aACA,aACA,WACA,GAAG,QAC+C;CAClD,OACE,oBAAC,UAAD;EACE,GAAI;EACO;EACX,cAAc,OAAO,aACnB,oBAAC,YAAD;GACS;GACG;GACV,GAAK,gBAAgB,KAAA,KAAa,EAAE,QAAQ,YAAY;GACxD,GAAK,gBAAgB,KAAA,KAAa,EAAE,QAAQ,YAAY;GACxD,WAAU;EACX,CAAA;CAEJ,CAAA;AAEL"}
@@ -1 +0,0 @@
1
- {"version":3,"file":"feed-in-hero.cjs","names":[],"sources":["../../src/components/feed-in-hero.tsx"],"sourcesContent":["import { cva } from 'class-variance-authority'\nimport type { Tone } from '../lib/tones'\nimport { cn } from '../utils/cn'\n\nconst FeedInHero = ({ className, ...rest }: React.ComponentProps<'div'>) => {\n return (\n <div\n className={cn(\n 'flex flex-col items-center gap-1 rounded-lg border border-gray p-5 text-center',\n className,\n )}\n {...rest}\n />\n )\n}\n\n/**\n * Label row above the value. Lays out children in a flex row with a small\n * gap so a tooltip / icon can sit alongside the label text.\n */\nconst FeedInHeroLabel = ({\n className,\n ...rest\n}: React.ComponentProps<'div'>) => {\n return (\n <div\n className={cn(\n 'flex items-center gap-1.5 text-xs font-medium text-gray-light',\n className,\n )}\n {...rest}\n />\n )\n}\n\nconst valueToneVariants = cva('text-4xl font-bold tabular-nums', {\n variants: {\n tone: {\n success: 'text-success',\n warning: 'text-warning',\n error: 'text-error',\n accent: 'text-accent',\n neutral: 'text-gray',\n },\n },\n defaultVariants: {\n tone: 'neutral',\n },\n})\n\nconst FeedInHeroValue = ({\n className,\n tone,\n ...rest\n}: React.ComponentProps<'span'> & { tone?: Tone }) => {\n return <span className={valueToneVariants({ tone, className })} {...rest} />\n}\n\n/** Smaller-weight unit suffix that sits inline with the value (e.g. \"W\"). */\nconst FeedInHeroValueUnit = ({\n className,\n ...rest\n}: React.ComponentProps<'span'>) => {\n return <span className={cn('text-2xl font-semibold', className)} {...rest} />\n}\n\nexport { FeedInHero, FeedInHeroLabel, FeedInHeroValue, FeedInHeroValueUnit }\n"],"mappings":";;;;;;AAIA,MAAM,cAAc,EAAE,WAAW,GAAG,WAAwC;CAC1E,OACE,iBAAA,GAAA,kBAAA,KAAC,OAAD;EACE,YAAA,GAAA,OAAA,IACE,kFACA,SACF;EACA,GAAI;CACL,CAAA;AAEL;;;;;AAMA,MAAM,mBAAmB,EACvB,WACA,GAAG,WAC8B;CACjC,OACE,iBAAA,GAAA,kBAAA,KAAC,OAAD;EACE,YAAA,GAAA,OAAA,IACE,iEACA,SACF;EACA,GAAI;CACL,CAAA;AAEL;AAEA,MAAM,qBAAA,GAAA,yBAAA,KAAwB,mCAAmC;CAC/D,UAAU,EACR,MAAM;EACJ,SAAS;EACT,SAAS;EACT,OAAO;EACP,QAAQ;EACR,SAAS;CACX,EACF;CACA,iBAAiB,EACf,MAAM,UACR;AACF,CAAC;AAED,MAAM,mBAAmB,EACvB,WACA,MACA,GAAG,WACiD;CACpD,OAAO,iBAAA,GAAA,kBAAA,KAAC,QAAD;EAAM,WAAW,kBAAkB;GAAE;GAAM;EAAU,CAAC;EAAG,GAAI;CAAO,CAAA;AAC7E;;AAGA,MAAM,uBAAuB,EAC3B,WACA,GAAG,WAC+B;CAClC,OAAO,iBAAA,GAAA,kBAAA,KAAC,QAAD;EAAM,YAAA,GAAA,OAAA,IAAc,0BAA0B,SAAS;EAAG,GAAI;CAAO,CAAA;AAC9E"}
@@ -1,32 +0,0 @@
1
- "use client";
2
-
3
- import { Tone } from "../lib/tones.cjs";
4
-
5
- //#region src/components/feed-in-hero.d.ts
6
- declare const FeedInHero: ({
7
- className,
8
- ...rest
9
- }: React.ComponentProps<"div">) => import("react/jsx-runtime").JSX.Element;
10
- /**
11
- * Label row above the value. Lays out children in a flex row with a small
12
- * gap so a tooltip / icon can sit alongside the label text.
13
- */
14
- declare const FeedInHeroLabel: ({
15
- className,
16
- ...rest
17
- }: React.ComponentProps<"div">) => import("react/jsx-runtime").JSX.Element;
18
- declare const FeedInHeroValue: ({
19
- className,
20
- tone,
21
- ...rest
22
- }: React.ComponentProps<"span"> & {
23
- tone?: Tone;
24
- }) => import("react/jsx-runtime").JSX.Element;
25
- /** Smaller-weight unit suffix that sits inline with the value (e.g. "W"). */
26
- declare const FeedInHeroValueUnit: ({
27
- className,
28
- ...rest
29
- }: React.ComponentProps<"span">) => import("react/jsx-runtime").JSX.Element;
30
- //#endregion
31
- export { FeedInHero, FeedInHeroLabel, FeedInHeroValue, FeedInHeroValueUnit };
32
- //# sourceMappingURL=feed-in-hero.d.cts.map
@@ -1,32 +0,0 @@
1
- "use client";
2
-
3
- import { Tone } from "../lib/tones.js";
4
-
5
- //#region src/components/feed-in-hero.d.ts
6
- declare const FeedInHero: ({
7
- className,
8
- ...rest
9
- }: React.ComponentProps<"div">) => import("react/jsx-runtime").JSX.Element;
10
- /**
11
- * Label row above the value. Lays out children in a flex row with a small
12
- * gap so a tooltip / icon can sit alongside the label text.
13
- */
14
- declare const FeedInHeroLabel: ({
15
- className,
16
- ...rest
17
- }: React.ComponentProps<"div">) => import("react/jsx-runtime").JSX.Element;
18
- declare const FeedInHeroValue: ({
19
- className,
20
- tone,
21
- ...rest
22
- }: React.ComponentProps<"span"> & {
23
- tone?: Tone;
24
- }) => import("react/jsx-runtime").JSX.Element;
25
- /** Smaller-weight unit suffix that sits inline with the value (e.g. "W"). */
26
- declare const FeedInHeroValueUnit: ({
27
- className,
28
- ...rest
29
- }: React.ComponentProps<"span">) => import("react/jsx-runtime").JSX.Element;
30
- //#endregion
31
- export { FeedInHero, FeedInHeroLabel, FeedInHeroValue, FeedInHeroValueUnit };
32
- //# sourceMappingURL=feed-in-hero.d.ts.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"feed-in-hero.js","names":[],"sources":["../../src/components/feed-in-hero.tsx"],"sourcesContent":["import { cva } from 'class-variance-authority'\nimport type { Tone } from '../lib/tones'\nimport { cn } from '../utils/cn'\n\nconst FeedInHero = ({ className, ...rest }: React.ComponentProps<'div'>) => {\n return (\n <div\n className={cn(\n 'flex flex-col items-center gap-1 rounded-lg border border-gray p-5 text-center',\n className,\n )}\n {...rest}\n />\n )\n}\n\n/**\n * Label row above the value. Lays out children in a flex row with a small\n * gap so a tooltip / icon can sit alongside the label text.\n */\nconst FeedInHeroLabel = ({\n className,\n ...rest\n}: React.ComponentProps<'div'>) => {\n return (\n <div\n className={cn(\n 'flex items-center gap-1.5 text-xs font-medium text-gray-light',\n className,\n )}\n {...rest}\n />\n )\n}\n\nconst valueToneVariants = cva('text-4xl font-bold tabular-nums', {\n variants: {\n tone: {\n success: 'text-success',\n warning: 'text-warning',\n error: 'text-error',\n accent: 'text-accent',\n neutral: 'text-gray',\n },\n },\n defaultVariants: {\n tone: 'neutral',\n },\n})\n\nconst FeedInHeroValue = ({\n className,\n tone,\n ...rest\n}: React.ComponentProps<'span'> & { tone?: Tone }) => {\n return <span className={valueToneVariants({ tone, className })} {...rest} />\n}\n\n/** Smaller-weight unit suffix that sits inline with the value (e.g. \"W\"). */\nconst FeedInHeroValueUnit = ({\n className,\n ...rest\n}: React.ComponentProps<'span'>) => {\n return <span className={cn('text-2xl font-semibold', className)} {...rest} />\n}\n\nexport { FeedInHero, FeedInHeroLabel, FeedInHeroValue, FeedInHeroValueUnit }\n"],"mappings":";;;;;AAIA,MAAM,cAAc,EAAE,WAAW,GAAG,WAAwC;CAC1E,OACE,oBAAC,OAAD;EACE,WAAW,GACT,kFACA,SACF;EACA,GAAI;CACL,CAAA;AAEL;;;;;AAMA,MAAM,mBAAmB,EACvB,WACA,GAAG,WAC8B;CACjC,OACE,oBAAC,OAAD;EACE,WAAW,GACT,iEACA,SACF;EACA,GAAI;CACL,CAAA;AAEL;AAEA,MAAM,oBAAoB,IAAI,mCAAmC;CAC/D,UAAU,EACR,MAAM;EACJ,SAAS;EACT,SAAS;EACT,OAAO;EACP,QAAQ;EACR,SAAS;CACX,EACF;CACA,iBAAiB,EACf,MAAM,UACR;AACF,CAAC;AAED,MAAM,mBAAmB,EACvB,WACA,MACA,GAAG,WACiD;CACpD,OAAO,oBAAC,QAAD;EAAM,WAAW,kBAAkB;GAAE;GAAM;EAAU,CAAC;EAAG,GAAI;CAAO,CAAA;AAC7E;;AAGA,MAAM,uBAAuB,EAC3B,WACA,GAAG,WAC+B;CAClC,OAAO,oBAAC,QAAD;EAAM,WAAW,GAAG,0BAA0B,SAAS;EAAG,GAAI;CAAO,CAAA;AAC9E"}
@@ -1,59 +0,0 @@
1
- "use client";
2
- Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
3
- const require_components_icon = require("./icon.cjs");
4
- let react = require("react");
5
- let react_jsx_runtime = require("react/jsx-runtime");
6
- let cnfast = require("cnfast");
7
- //#region src/components/metering-row.tsx
8
- const MeteringRowContext = (0, react.createContext)(null);
9
- function useMeteringRowTone() {
10
- const tone = (0, react.useContext)(MeteringRowContext);
11
- if (!tone) throw new Error("MeteringRow.* must be rendered inside <MeteringRow>");
12
- return tone;
13
- }
14
- const MeteringRow = ({ className, tone, ...rest }) => {
15
- return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(MeteringRowContext.Provider, {
16
- value: tone,
17
- children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
18
- className: (0, cnfast.cn)("group flex items-center gap-3", className),
19
- "data-tone": tone,
20
- ...rest
21
- })
22
- });
23
- };
24
- const toneToIconColor = {
25
- accent: "accent",
26
- neutral: "neutral",
27
- success: "success",
28
- warning: "warning",
29
- error: "danger"
30
- };
31
- const MeteringRowIcon = ({ className, icon: Glyph, ...rest }) => {
32
- const tone = useMeteringRowTone();
33
- return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_components_icon.Icon, {
34
- ...rest,
35
- className,
36
- color: toneToIconColor[tone],
37
- size: "large",
38
- children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Glyph, {})
39
- });
40
- };
41
- const MeteringRowLabel = ({ className, ...rest }) => {
42
- return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
43
- className: (0, cnfast.cn)("flex-1 text-sm text-gray", className),
44
- ...rest
45
- });
46
- };
47
- const MeteringRowValue = ({ className, ...rest }) => {
48
- return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
49
- 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),
50
- ...rest
51
- });
52
- };
53
- //#endregion
54
- exports.MeteringRow = MeteringRow;
55
- exports.MeteringRowIcon = MeteringRowIcon;
56
- exports.MeteringRowLabel = MeteringRowLabel;
57
- exports.MeteringRowValue = MeteringRowValue;
58
-
59
- //# sourceMappingURL=metering-row.cjs.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"metering-row.cjs","names":["Icon"],"sources":["../../src/components/metering-row.tsx"],"sourcesContent":["import type { SparkIcon } from '@epilot/spark-icons'\nimport { createContext, useContext } from 'react'\nimport type { SparkAccentColor } from '../lib/accent-colors'\nimport type { Tone } from '../lib/tones'\nimport { cn } from '../utils/cn'\nimport { Icon } from './icon'\n\nconst MeteringRowContext = createContext<Tone | null>(null)\n\nfunction useMeteringRowTone() {\n const tone = useContext(MeteringRowContext)\n if (!tone) {\n throw new Error('MeteringRow.* must be rendered inside <MeteringRow>')\n }\n return tone\n}\n\nconst MeteringRow = ({\n className,\n tone,\n ...rest\n}: React.ComponentProps<'div'> & {\n tone: Tone\n}) => {\n return (\n <MeteringRowContext.Provider value={tone}>\n <div\n className={cn('group flex items-center gap-3', className)}\n data-tone={tone}\n {...rest}\n />\n </MeteringRowContext.Provider>\n )\n}\n\nconst toneToIconColor: Record<Tone, SparkAccentColor> = {\n accent: 'accent',\n neutral: 'neutral',\n success: 'success',\n warning: 'warning',\n error: 'danger',\n}\n\nconst MeteringRowIcon = ({\n className,\n icon: Glyph,\n ...rest\n}: React.ComponentProps<'span'> & {\n icon: SparkIcon\n}) => {\n const tone = useMeteringRowTone()\n return (\n <Icon\n {...rest}\n className={className}\n color={toneToIconColor[tone]}\n size=\"large\"\n >\n <Glyph />\n </Icon>\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,sBAAA,GAAA,MAAA,eAAgD,IAAI;AAE1D,SAAS,qBAAqB;CAC5B,MAAM,QAAA,GAAA,MAAA,YAAkB,kBAAkB;CAC1C,IAAI,CAAC,MACH,MAAM,IAAI,MAAM,qDAAqD;CAEvE,OAAO;AACT;AAEA,MAAM,eAAe,EACnB,WACA,MACA,GAAG,WAGC;CACJ,OACE,iBAAA,GAAA,kBAAA,KAAC,mBAAmB,UAApB;EAA6B,OAAO;YAClC,iBAAA,GAAA,kBAAA,KAAC,OAAD;GACE,YAAA,GAAA,OAAA,IAAc,iCAAiC,SAAS;GACxD,aAAW;GACX,GAAI;EACL,CAAA;CAC0B,CAAA;AAEjC;AAEA,MAAM,kBAAkD;CACtD,QAAQ;CACR,SAAS;CACT,SAAS;CACT,SAAS;CACT,OAAO;AACT;AAEA,MAAM,mBAAmB,EACvB,WACA,MAAM,OACN,GAAG,WAGC;CACJ,MAAM,OAAO,mBAAmB;CAChC,OACE,iBAAA,GAAA,kBAAA,KAACA,wBAAAA,MAAD;EACE,GAAI;EACO;EACX,OAAO,gBAAgB;EACvB,MAAK;YAEL,iBAAA,GAAA,kBAAA,KAAC,OAAD,CAAQ,CAAA;CACJ,CAAA;AAEV;AAEA,MAAM,oBAAoB,EACxB,WACA,GAAG,WAC+B;CAClC,OACE,iBAAA,GAAA,kBAAA,KAAC,QAAD;EAAM,YAAA,GAAA,OAAA,IAAc,4BAA4B,SAAS;EAAG,GAAI;CAAO,CAAA;AAE3E;AAEA,MAAM,oBAAoB,EACxB,WACA,GAAG,WAC+B;CAClC,OACE,iBAAA,GAAA,kBAAA,KAAC,QAAD;EACE,YAAA,GAAA,OAAA,IACE,0OACA,SACF;EACA,GAAI;CACL,CAAA;AAEL"}
@@ -1,31 +0,0 @@
1
- "use client";
2
-
3
- import { Tone } from "../lib/tones.cjs";
4
- import { SparkIcon } from "@epilot/spark-icons";
5
-
6
- //#region src/components/metering-row.d.ts
7
- declare const MeteringRow: ({
8
- className,
9
- tone,
10
- ...rest
11
- }: React.ComponentProps<"div"> & {
12
- tone: Tone;
13
- }) => import("react/jsx-runtime").JSX.Element;
14
- declare const MeteringRowIcon: ({
15
- className,
16
- icon: Glyph,
17
- ...rest
18
- }: React.ComponentProps<"span"> & {
19
- icon: SparkIcon;
20
- }) => import("react/jsx-runtime").JSX.Element;
21
- declare const MeteringRowLabel: ({
22
- className,
23
- ...rest
24
- }: React.ComponentProps<"span">) => import("react/jsx-runtime").JSX.Element;
25
- declare const MeteringRowValue: ({
26
- className,
27
- ...rest
28
- }: React.ComponentProps<"span">) => import("react/jsx-runtime").JSX.Element;
29
- //#endregion
30
- export { MeteringRow, MeteringRowIcon, MeteringRowLabel, MeteringRowValue };
31
- //# sourceMappingURL=metering-row.d.cts.map