@epilot/spark-ui 0.19.0 → 0.20.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 +2 -2
- package/dist/components/accordion.d.ts +1 -1
- package/dist/components/accordion.js +1 -1
- package/dist/components/alert-dialog.cjs +1 -1
- package/dist/components/alert-dialog.js +1 -1
- package/dist/components/attachment.d.cts +2 -2
- package/dist/components/attachment.d.ts +2 -2
- package/dist/components/autocomplete.cjs +1 -1
- package/dist/components/autocomplete.js +1 -1
- package/dist/components/avatar.cjs +1 -1
- package/dist/components/avatar.cjs.map +1 -1
- package/dist/components/avatar.js +1 -1
- package/dist/components/avatar.js.map +1 -1
- package/dist/components/badge.cjs +1 -1
- package/dist/components/badge.cjs.map +1 -1
- package/dist/components/badge.d.cts +2 -1
- package/dist/components/badge.d.ts +2 -1
- package/dist/components/badge.js +1 -1
- package/dist/components/badge.js.map +1 -1
- package/dist/components/{energy-bar-chart.cjs → bar-chart-with-total.cjs} +4 -4
- package/dist/components/bar-chart-with-total.cjs.map +1 -0
- package/dist/components/bar-chart-with-total.d.cts +19 -0
- package/dist/components/bar-chart-with-total.d.ts +19 -0
- package/dist/components/{energy-bar-chart.js → bar-chart-with-total.js} +4 -4
- package/dist/components/bar-chart-with-total.js.map +1 -0
- package/dist/components/bubble.d.cts +1 -1
- package/dist/components/bubble.d.ts +1 -1
- package/dist/components/button-group.cjs +2 -2
- package/dist/components/button-group.cjs.map +1 -1
- package/dist/components/button-group.d.cts +1 -1
- package/dist/components/button-group.d.ts +1 -1
- package/dist/components/button-group.js +2 -2
- package/dist/components/button-group.js.map +1 -1
- package/dist/components/button.cjs +6 -4
- package/dist/components/button.cjs.map +1 -1
- package/dist/components/button.d.cts +6 -5
- package/dist/components/button.d.ts +6 -5
- package/dist/components/button.js +6 -4
- package/dist/components/button.js.map +1 -1
- package/dist/components/calendar.cjs +3 -3
- package/dist/components/calendar.cjs.map +1 -1
- package/dist/components/calendar.js +3 -3
- package/dist/components/calendar.js.map +1 -1
- package/dist/components/callout.cjs +11 -11
- package/dist/components/callout.cjs.map +1 -1
- package/dist/components/callout.d.ts +1 -1
- package/dist/components/callout.js +11 -11
- package/dist/components/callout.js.map +1 -1
- package/dist/components/checkbox.cjs +1 -1
- package/dist/components/checkbox.cjs.map +1 -1
- package/dist/components/checkbox.js +1 -1
- package/dist/components/checkbox.js.map +1 -1
- package/dist/components/circular-gauge.cjs +7 -7
- package/dist/components/circular-gauge.cjs.map +1 -1
- package/dist/components/circular-gauge.js +7 -7
- package/dist/components/circular-gauge.js.map +1 -1
- package/dist/components/day-of-week-picker.cjs +21 -41
- package/dist/components/day-of-week-picker.cjs.map +1 -1
- package/dist/components/day-of-week-picker.d.cts +19 -23
- package/dist/components/day-of-week-picker.d.ts +19 -23
- package/dist/components/day-of-week-picker.js +21 -41
- package/dist/components/day-of-week-picker.js.map +1 -1
- package/dist/components/dialog.cjs +1 -1
- package/dist/components/dialog.js +1 -1
- package/dist/components/dropdown-menu.cjs +1 -1
- package/dist/components/dropdown-menu.js +1 -1
- package/dist/components/empty-state.d.ts +1 -1
- package/dist/components/{device-card.cjs → entity-card.cjs} +31 -31
- package/dist/components/entity-card.cjs.map +1 -0
- package/dist/components/{device-card.d.cts → entity-card.d.cts} +15 -15
- package/dist/components/{device-card.d.ts → entity-card.d.ts} +16 -16
- package/dist/components/{device-card.js → entity-card.js} +20 -20
- package/dist/components/entity-card.js.map +1 -0
- package/dist/components/{feed-in-hero.cjs → hero-metric.cjs} +10 -15
- package/dist/components/hero-metric.cjs.map +1 -0
- package/dist/components/hero-metric.d.cts +27 -0
- package/dist/components/hero-metric.d.ts +27 -0
- package/dist/components/{feed-in-hero.js → hero-metric.js} +7 -12
- package/dist/components/hero-metric.js.map +1 -0
- package/dist/components/info-block.d.cts +1 -1
- package/dist/components/info-block.d.ts +1 -1
- package/dist/components/input-date.cjs +1 -1
- package/dist/components/input-date.js +1 -1
- package/dist/components/input-otp.cjs +1 -1
- package/dist/components/input-otp.js +1 -1
- package/dist/components/input.cjs +1 -1
- package/dist/components/input.js +1 -1
- package/dist/components/line-chart.cjs +1 -1
- package/dist/components/line-chart.js +1 -1
- package/dist/components/marker.d.cts +1 -1
- package/dist/components/marker.d.ts +1 -1
- package/dist/components/message-scroller.cjs +3 -3
- package/dist/components/message-scroller.js +3 -3
- package/dist/components/number-flow.d.cts +12 -2
- package/dist/components/number-flow.d.ts +12 -2
- package/dist/components/page-header.cjs +1 -1
- package/dist/components/page-header.js +1 -1
- package/dist/components/period-tabs.cjs +2 -22
- package/dist/components/period-tabs.cjs.map +1 -1
- package/dist/components/period-tabs.d.cts +5 -22
- package/dist/components/period-tabs.d.ts +5 -22
- package/dist/components/period-tabs.js +2 -22
- package/dist/components/period-tabs.js.map +1 -1
- package/dist/components/pill.cjs +3 -3
- package/dist/components/pill.cjs.map +1 -1
- package/dist/components/pill.js +3 -3
- package/dist/components/pill.js.map +1 -1
- package/dist/components/progress.cjs +1 -1
- package/dist/components/progress.cjs.map +1 -1
- package/dist/components/progress.js +1 -1
- package/dist/components/progress.js.map +1 -1
- package/dist/components/radio.cjs +1 -1
- package/dist/components/radio.cjs.map +1 -1
- package/dist/components/radio.js +1 -1
- package/dist/components/radio.js.map +1 -1
- package/dist/components/sankey-chart.cjs +1 -11
- package/dist/components/sankey-chart.cjs.map +1 -1
- package/dist/components/sankey-chart.d.cts +2 -3
- package/dist/components/sankey-chart.d.ts +2 -3
- package/dist/components/sankey-chart.js +2 -11
- package/dist/components/sankey-chart.js.map +1 -1
- package/dist/components/schedule-list.cjs +1 -1
- package/dist/components/schedule-list.js +1 -1
- package/dist/components/segmented-control.cjs +2 -2
- package/dist/components/segmented-control.cjs.map +1 -1
- package/dist/components/segmented-control.js +2 -2
- package/dist/components/segmented-control.js.map +1 -1
- package/dist/components/select.cjs +33 -3
- package/dist/components/select.cjs.map +1 -1
- package/dist/components/select.d.cts +11 -1
- package/dist/components/select.d.ts +11 -1
- package/dist/components/select.js +32 -4
- package/dist/components/select.js.map +1 -1
- package/dist/components/sheet.cjs +1 -1
- package/dist/components/sheet.js +1 -1
- package/dist/components/stepper.cjs +2 -2
- package/dist/components/stepper.cjs.map +1 -1
- package/dist/components/stepper.d.cts +4 -4
- package/dist/components/stepper.d.ts +4 -4
- package/dist/components/stepper.js +2 -2
- package/dist/components/stepper.js.map +1 -1
- package/dist/components/table.cjs +1 -1
- package/dist/components/table.js +1 -1
- package/dist/components/tabs.cjs +1 -1
- package/dist/components/tabs.js +1 -1
- package/dist/components/textarea.cjs +1 -1
- package/dist/components/textarea.js +1 -1
- package/dist/components/toast.cjs +1 -1
- package/dist/components/toast.js +1 -1
- package/dist/components/tooltip.cjs +2 -2
- package/dist/components/tooltip.cjs.map +1 -1
- package/dist/components/tooltip.js +2 -2
- package/dist/components/tooltip.js.map +1 -1
- package/dist/components/typography.cjs +1 -1
- package/dist/components/typography.cjs.map +1 -1
- package/dist/components/typography.d.cts +4 -1
- package/dist/components/typography.d.ts +4 -1
- package/dist/components/typography.js +1 -1
- package/dist/components/typography.js.map +1 -1
- package/dist/components/wizard-layout.cjs +57 -0
- package/dist/components/wizard-layout.cjs.map +1 -0
- package/dist/components/wizard-layout.d.cts +34 -0
- package/dist/components/wizard-layout.d.ts +34 -0
- package/dist/components/wizard-layout.js +50 -0
- package/dist/components/wizard-layout.js.map +1 -0
- package/dist/lib/accent-colors.cjs +4 -1
- package/dist/lib/accent-colors.cjs.map +1 -1
- package/dist/lib/accent-colors.d.cts +1 -1
- package/dist/lib/accent-colors.d.ts +1 -1
- package/dist/lib/accent-colors.js +4 -1
- package/dist/lib/accent-colors.js.map +1 -1
- package/dist/lib/accent-theme.cjs +2 -2
- package/dist/lib/accent-theme.cjs.map +1 -1
- package/dist/lib/accent-theme.js +2 -2
- package/dist/lib/accent-theme.js.map +1 -1
- package/dist/styles/index.css +1 -1
- package/dist/styles/spark-default.css +49 -314
- package/dist/styles/theme.css +52 -6
- package/dist/utils/format.cjs +0 -13
- package/dist/utils/format.cjs.map +1 -1
- package/dist/utils/format.d.cts +1 -7
- package/dist/utils/format.d.ts +1 -7
- package/dist/utils/format.js +1 -12
- package/dist/utils/format.js.map +1 -1
- package/package.json +1 -1
- package/dist/components/battery-progress-row.cjs +0 -135
- package/dist/components/battery-progress-row.cjs.map +0 -1
- package/dist/components/battery-progress-row.d.cts +0 -69
- package/dist/components/battery-progress-row.d.ts +0 -69
- package/dist/components/battery-progress-row.js +0 -125
- package/dist/components/battery-progress-row.js.map +0 -1
- package/dist/components/device-card.cjs.map +0 -1
- package/dist/components/device-card.js.map +0 -1
- package/dist/components/energy-bar-chart.cjs.map +0 -1
- package/dist/components/energy-bar-chart.d.cts +0 -43
- package/dist/components/energy-bar-chart.d.ts +0 -43
- package/dist/components/energy-bar-chart.js.map +0 -1
- package/dist/components/energy-breakdown.cjs +0 -80
- package/dist/components/energy-breakdown.cjs.map +0 -1
- package/dist/components/energy-breakdown.d.cts +0 -24
- package/dist/components/energy-breakdown.d.ts +0 -24
- package/dist/components/energy-breakdown.js +0 -79
- package/dist/components/energy-breakdown.js.map +0 -1
- package/dist/components/energy-history-chart.cjs +0 -63
- package/dist/components/energy-history-chart.cjs.map +0 -1
- package/dist/components/energy-history-chart.d.cts +0 -64
- package/dist/components/energy-history-chart.d.ts +0 -64
- package/dist/components/energy-history-chart.js +0 -62
- package/dist/components/energy-history-chart.js.map +0 -1
- package/dist/components/feed-in-hero.cjs.map +0 -1
- package/dist/components/feed-in-hero.d.cts +0 -32
- package/dist/components/feed-in-hero.d.ts +0 -32
- package/dist/components/feed-in-hero.js.map +0 -1
- package/dist/components/metering-row.cjs +0 -59
- package/dist/components/metering-row.cjs.map +0 -1
- package/dist/components/metering-row.d.cts +0 -31
- package/dist/components/metering-row.d.ts +0 -31
- package/dist/components/metering-row.js +0 -55
- package/dist/components/metering-row.js.map +0 -1
- package/dist/components/money-saved-block.cjs +0 -83
- package/dist/components/money-saved-block.cjs.map +0 -1
- package/dist/components/money-saved-block.d.cts +0 -55
- package/dist/components/money-saved-block.d.ts +0 -55
- package/dist/components/money-saved-block.js +0 -76
- package/dist/components/money-saved-block.js.map +0 -1
- package/dist/components/on-off-button.cjs +0 -32
- package/dist/components/on-off-button.cjs.map +0 -1
- package/dist/components/on-off-button.d.cts +0 -18
- package/dist/components/on-off-button.d.ts +0 -18
- package/dist/components/on-off-button.js +0 -31
- package/dist/components/on-off-button.js.map +0 -1
- package/dist/components/onboarding-layout.cjs +0 -67
- package/dist/components/onboarding-layout.cjs.map +0 -1
- package/dist/components/onboarding-layout.d.cts +0 -44
- package/dist/components/onboarding-layout.d.ts +0 -44
- package/dist/components/onboarding-layout.js +0 -60
- package/dist/components/onboarding-layout.js.map +0 -1
- package/dist/components/power-history-chart.cjs +0 -498
- package/dist/components/power-history-chart.cjs.map +0 -1
- package/dist/components/power-history-chart.d.cts +0 -71
- package/dist/components/power-history-chart.d.ts +0 -71
- package/dist/components/power-history-chart.js +0 -496
- package/dist/components/power-history-chart.js.map +0 -1
- package/dist/components/power-history.cjs +0 -114
- package/dist/components/power-history.cjs.map +0 -1
- package/dist/components/power-history.d.cts +0 -40
- package/dist/components/power-history.d.ts +0 -41
- package/dist/components/power-history.js +0 -114
- package/dist/components/power-history.js.map +0 -1
- package/dist/components/power-network.cjs +0 -559
- package/dist/components/power-network.cjs.map +0 -1
- package/dist/components/power-network.d.cts +0 -80
- package/dist/components/power-network.d.ts +0 -80
- package/dist/components/power-network.js +0 -553
- package/dist/components/power-network.js.map +0 -1
- package/dist/components/smart-toggle-button.cjs +0 -24
- package/dist/components/smart-toggle-button.cjs.map +0 -1
- package/dist/components/smart-toggle-button.d.cts +0 -16
- package/dist/components/smart-toggle-button.d.ts +0 -16
- package/dist/components/smart-toggle-button.js +0 -23
- package/dist/components/smart-toggle-button.js.map +0 -1
- package/dist/components/solar-forecast-chart.cjs +0 -108
- package/dist/components/solar-forecast-chart.cjs.map +0 -1
- package/dist/components/solar-forecast-chart.d.cts +0 -77
- package/dist/components/solar-forecast-chart.d.ts +0 -77
- package/dist/components/solar-forecast-chart.js +0 -103
- package/dist/components/solar-forecast-chart.js.map +0 -1
- package/dist/number-flow-Bch81ixZ.d.cts +0 -14
- package/dist/number-flow-Bch81ixZ.d.ts +0 -14
- package/dist/utils/build-sankey-nodes.cjs +0 -72
- package/dist/utils/build-sankey-nodes.cjs.map +0 -1
- package/dist/utils/build-sankey-nodes.d.cts +0 -27
- package/dist/utils/build-sankey-nodes.d.ts +0 -27
- package/dist/utils/build-sankey-nodes.js +0 -71
- package/dist/utils/build-sankey-nodes.js.map +0 -1
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"power-history.cjs","names":["useContainerWidth","SectionTitle","SeriesLegend","LineChart","kwFormat"],"sources":["../../src/components/power-history.tsx"],"sourcesContent":["import { useCallback, useMemo, useState } from 'react'\nimport { useContainerWidth } from '../hooks/use-container-width'\nimport { NARROW_NBSP } from '../utils/chars'\nimport { oneDecimalFormat as kwFormat } from '../utils/format'\nimport { LineChart } from './line-chart'\nimport { SeriesLegend, type SeriesLegendItem } from './series-legend'\nimport { SectionTitle } from './typography'\n\ninterface PowerHistorySeries {\n id: string\n label: string\n /** CSS color value (e.g. `var(--orange-a9)`). */\n color: string\n /** Tailwind stroke class applied to the line (e.g. `stroke-orange-a9`). */\n strokeClass: string\n data: { date: Date; value: number }[]\n}\n\n/** Visual config (colors/classes) per series, independent of labels. */\nconst SERIES_STYLE: ReadonlyArray<\n Pick<PowerHistorySeries, 'id' | 'color' | 'strokeClass'>\n> = [\n {\n id: 'production',\n color: 'var(--orange-a9)',\n strokeClass: 'stroke-orange-a9',\n },\n {\n id: 'feedin',\n color: 'var(--green-a9)',\n strokeClass: 'stroke-green-a9',\n },\n {\n id: 'grid',\n color: 'var(--blue-11)',\n strokeClass: 'stroke-blue-11',\n },\n {\n id: 'consumption',\n color: 'var(--neutral-a7)',\n strokeClass: 'stroke-gray-a7',\n },\n]\n\ninterface PowerHistorySeriesLabels {\n production?: React.ReactNode\n feedIn?: React.ReactNode\n grid?: React.ReactNode\n consumption?: React.ReactNode\n}\n\nexport default function PowerHistory({\n solar,\n consumption,\n feedIn,\n grid,\n formatDate,\n title = 'Power history',\n seriesLabels,\n}: {\n solar: { date: Date; value: number }[]\n consumption: { date: Date; value: number }[]\n feedIn: { date: Date; value: number }[]\n grid: { date: Date; value: number }[]\n formatDate: (date: Date) => string\n /** Override the section title. Defaults to `\"Power history\"`. */\n title?: React.ReactNode\n /** Override the legend labels for each series. Each defaults to its English name. */\n seriesLabels?: PowerHistorySeriesLabels\n}) {\n const [chartContainerRef, chartWidth] = useContainerWidth<HTMLDivElement>()\n const [hiddenSeries, setHiddenSeries] = useState<ReadonlySet<string>>(\n () => new Set(),\n )\n\n const toggleSeries = useCallback((id: string) => {\n setHiddenSeries((prev) => {\n const next = new Set(prev)\n if (next.has(id)) {\n next.delete(id)\n } else {\n next.add(id)\n }\n return next\n })\n }, [])\n\n const dataById = useMemo(\n () => ({\n production: solar,\n feedin: feedIn,\n grid,\n consumption,\n }),\n [consumption, feedIn, grid, solar],\n )\n\n const labelById = useMemo<Record<string, React.ReactNode>>(\n () => ({\n production: seriesLabels?.production ?? 'Production',\n feedin: seriesLabels?.feedIn ?? 'Feed in',\n grid: seriesLabels?.grid ?? 'Grid',\n consumption: seriesLabels?.consumption ?? 'Consumption',\n }),\n [seriesLabels],\n )\n\n const legendItems: SeriesLegendItem[] = useMemo(\n () =>\n SERIES_STYLE.map((entry) => ({\n id: entry.id,\n label: labelById[entry.id] as string,\n color: entry.color,\n })),\n [labelById],\n )\n\n const visibleSeries = useMemo(\n () =>\n SERIES_STYLE.filter((entry) => !hiddenSeries.has(entry.id)).map(\n (entry) => ({\n id: entry.id,\n data: dataById[entry.id as keyof typeof dataById],\n curve: 'monotone' as const,\n className: entry.strokeClass,\n }),\n ),\n [dataById, hiddenSeries],\n )\n\n const dataEmpty =\n solar.every((s) => s.value === 0) &&\n consumption.every((c) => c.value === 0) &&\n feedIn.every((f) => f.value === 0) &&\n grid.every((g) => g.value === 0)\n\n if (dataEmpty) return null\n\n return (\n <div className=\"flex flex-col gap-3\">\n <div className=\"flex items-center justify-between\">\n <SectionTitle>{title}</SectionTitle>\n </div>\n\n <SeriesLegend\n items={legendItems}\n hiddenIds={hiddenSeries}\n onToggle={toggleSeries}\n />\n\n <div\n ref={chartContainerRef}\n className=\"w-full\"\n style={{ minHeight: 200 }}\n >\n {chartWidth > 0 && visibleSeries.length > 0 && (\n <LineChart\n width={chartWidth}\n height={200}\n margin={{ top: 8, right: 8, bottom: 28, left: 8 }}\n series={visibleSeries}\n showGrid\n showTooltip\n xTickCount={5}\n yTickCount={4}\n formatDate={formatDate}\n formatValue={(v) => `${kwFormat.format(v / 1000)}${NARROW_NBSP}kW`}\n />\n )}\n </div>\n </div>\n )\n}\n"],"mappings":";;;;;;;;;;;AAmBA,MAAM,eAEF;CACF;EACE,IAAI;EACJ,OAAO;EACP,aAAa;CACf;CACA;EACE,IAAI;EACJ,OAAO;EACP,aAAa;CACf;CACA;EACE,IAAI;EACJ,OAAO;EACP,aAAa;CACf;CACA;EACE,IAAI;EACJ,OAAO;EACP,aAAa;CACf;AACF;AASA,SAAwB,aAAa,EACnC,OACA,aACA,QACA,MACA,YACA,QAAQ,iBACR,gBAWC;CACD,MAAM,CAAC,mBAAmB,cAAcA,kCAAAA,kBAAkC;CAC1E,MAAM,CAAC,cAAc,oBAAA,GAAA,MAAA,gCACb,IAAI,IAAI,CAChB;CAEA,MAAM,gBAAA,GAAA,MAAA,cAA4B,OAAe;EAC/C,iBAAiB,SAAS;GACxB,MAAM,OAAO,IAAI,IAAI,IAAI;GACzB,IAAI,KAAK,IAAI,EAAE,GACb,KAAK,OAAO,EAAE;QAEd,KAAK,IAAI,EAAE;GAEb,OAAO;EACT,CAAC;CACH,GAAG,CAAC,CAAC;CAEL,MAAM,YAAA,GAAA,MAAA,gBACG;EACL,YAAY;EACZ,QAAQ;EACR;EACA;CACF,IACA;EAAC;EAAa;EAAQ;EAAM;CAAK,CACnC;CAEA,MAAM,aAAA,GAAA,MAAA,gBACG;EACL,YAAY,cAAc,cAAc;EACxC,QAAQ,cAAc,UAAU;EAChC,MAAM,cAAc,QAAQ;EAC5B,aAAa,cAAc,eAAe;CAC5C,IACA,CAAC,YAAY,CACf;CAEA,MAAM,eAAA,GAAA,MAAA,eAEF,aAAa,KAAK,WAAW;EAC3B,IAAI,MAAM;EACV,OAAO,UAAU,MAAM;EACvB,OAAO,MAAM;CACf,EAAE,GACJ,CAAC,SAAS,CACZ;CAEA,MAAM,iBAAA,GAAA,MAAA,eAEF,aAAa,QAAQ,UAAU,CAAC,aAAa,IAAI,MAAM,EAAE,CAAC,EAAE,KACzD,WAAW;EACV,IAAI,MAAM;EACV,MAAM,SAAS,MAAM;EACrB,OAAO;EACP,WAAW,MAAM;CACnB,EACF,GACF,CAAC,UAAU,YAAY,CACzB;CAQA,IALE,MAAM,OAAO,MAAM,EAAE,UAAU,CAAC,KAChC,YAAY,OAAO,MAAM,EAAE,UAAU,CAAC,KACtC,OAAO,OAAO,MAAM,EAAE,UAAU,CAAC,KACjC,KAAK,OAAO,MAAM,EAAE,UAAU,CAAC,GAElB,OAAO;CAEtB,OACE,iBAAA,GAAA,kBAAA,MAAC,OAAD;EAAK,WAAU;YAAf;GACE,iBAAA,GAAA,kBAAA,KAAC,OAAD;IAAK,WAAU;cACb,iBAAA,GAAA,kBAAA,KAACC,8BAAAA,cAAD,EAAA,UAAe,MAAoB,CAAA;GAChC,CAAA;GAEL,iBAAA,GAAA,kBAAA,KAACC,iCAAAA,cAAD;IACE,OAAO;IACP,WAAW;IACX,UAAU;GACX,CAAA;GAED,iBAAA,GAAA,kBAAA,KAAC,OAAD;IACE,KAAK;IACL,WAAU;IACV,OAAO,EAAE,WAAW,IAAI;cAEvB,aAAa,KAAK,cAAc,SAAS,KACxC,iBAAA,GAAA,kBAAA,KAACC,8BAAAA,WAAD;KACE,OAAO;KACP,QAAQ;KACR,QAAQ;MAAE,KAAK;MAAG,OAAO;MAAG,QAAQ;MAAI,MAAM;KAAE;KAChD,QAAQ;KACR,UAAA;KACA,aAAA;KACA,YAAY;KACZ,YAAY;KACA;KACZ,cAAc,MAAM,GAAGC,qBAAAA,iBAAS,OAAO,IAAI,GAAI;IAChD,CAAA;GAEA,CAAA;EACF;;AAET"}
|
|
@@ -1,40 +0,0 @@
|
|
|
1
|
-
"use client";
|
|
2
|
-
|
|
3
|
-
//#region src/components/power-history.d.ts
|
|
4
|
-
interface PowerHistorySeriesLabels {
|
|
5
|
-
production?: React.ReactNode;
|
|
6
|
-
feedIn?: React.ReactNode;
|
|
7
|
-
grid?: React.ReactNode;
|
|
8
|
-
consumption?: React.ReactNode;
|
|
9
|
-
}
|
|
10
|
-
declare function PowerHistory({
|
|
11
|
-
solar,
|
|
12
|
-
consumption,
|
|
13
|
-
feedIn,
|
|
14
|
-
grid,
|
|
15
|
-
formatDate,
|
|
16
|
-
title,
|
|
17
|
-
seriesLabels
|
|
18
|
-
}: {
|
|
19
|
-
solar: {
|
|
20
|
-
date: Date;
|
|
21
|
-
value: number;
|
|
22
|
-
}[];
|
|
23
|
-
consumption: {
|
|
24
|
-
date: Date;
|
|
25
|
-
value: number;
|
|
26
|
-
}[];
|
|
27
|
-
feedIn: {
|
|
28
|
-
date: Date;
|
|
29
|
-
value: number;
|
|
30
|
-
}[];
|
|
31
|
-
grid: {
|
|
32
|
-
date: Date;
|
|
33
|
-
value: number;
|
|
34
|
-
}[];
|
|
35
|
-
formatDate: (date: Date) => string; /** Override the section title. Defaults to `"Power history"`. */
|
|
36
|
-
title?: React.ReactNode; /** Override the legend labels for each series. Each defaults to its English name. */
|
|
37
|
-
seriesLabels?: PowerHistorySeriesLabels;
|
|
38
|
-
}): import("react/jsx-runtime").JSX.Element | null;
|
|
39
|
-
export = PowerHistory;
|
|
40
|
-
//# sourceMappingURL=power-history.d.cts.map
|
|
@@ -1,41 +0,0 @@
|
|
|
1
|
-
"use client";
|
|
2
|
-
|
|
3
|
-
//#region src/components/power-history.d.ts
|
|
4
|
-
interface PowerHistorySeriesLabels {
|
|
5
|
-
production?: React.ReactNode;
|
|
6
|
-
feedIn?: React.ReactNode;
|
|
7
|
-
grid?: React.ReactNode;
|
|
8
|
-
consumption?: React.ReactNode;
|
|
9
|
-
}
|
|
10
|
-
declare function PowerHistory({
|
|
11
|
-
solar,
|
|
12
|
-
consumption,
|
|
13
|
-
feedIn,
|
|
14
|
-
grid,
|
|
15
|
-
formatDate,
|
|
16
|
-
title,
|
|
17
|
-
seriesLabels
|
|
18
|
-
}: {
|
|
19
|
-
solar: {
|
|
20
|
-
date: Date;
|
|
21
|
-
value: number;
|
|
22
|
-
}[];
|
|
23
|
-
consumption: {
|
|
24
|
-
date: Date;
|
|
25
|
-
value: number;
|
|
26
|
-
}[];
|
|
27
|
-
feedIn: {
|
|
28
|
-
date: Date;
|
|
29
|
-
value: number;
|
|
30
|
-
}[];
|
|
31
|
-
grid: {
|
|
32
|
-
date: Date;
|
|
33
|
-
value: number;
|
|
34
|
-
}[];
|
|
35
|
-
formatDate: (date: Date) => string; /** Override the section title. Defaults to `"Power history"`. */
|
|
36
|
-
title?: React.ReactNode; /** Override the legend labels for each series. Each defaults to its English name. */
|
|
37
|
-
seriesLabels?: PowerHistorySeriesLabels;
|
|
38
|
-
}): import("react/jsx-runtime").JSX.Element | null;
|
|
39
|
-
//#endregion
|
|
40
|
-
export { PowerHistory as default };
|
|
41
|
-
//# sourceMappingURL=power-history.d.ts.map
|
|
@@ -1,114 +0,0 @@
|
|
|
1
|
-
"use client";
|
|
2
|
-
import "../utils/chars.js";
|
|
3
|
-
import { oneDecimalFormat } from "../utils/format.js";
|
|
4
|
-
import { useContainerWidth } from "../hooks/use-container-width.js";
|
|
5
|
-
import { SeriesLegend } from "./series-legend.js";
|
|
6
|
-
import { SectionTitle } from "./typography.js";
|
|
7
|
-
import { LineChart } from "./line-chart.js";
|
|
8
|
-
import { useCallback, useMemo, useState } from "react";
|
|
9
|
-
import { jsx, jsxs } from "react/jsx-runtime";
|
|
10
|
-
//#region src/components/power-history.tsx
|
|
11
|
-
/** Visual config (colors/classes) per series, independent of labels. */
|
|
12
|
-
const SERIES_STYLE = [
|
|
13
|
-
{
|
|
14
|
-
id: "production",
|
|
15
|
-
color: "var(--orange-a9)",
|
|
16
|
-
strokeClass: "stroke-orange-a9"
|
|
17
|
-
},
|
|
18
|
-
{
|
|
19
|
-
id: "feedin",
|
|
20
|
-
color: "var(--green-a9)",
|
|
21
|
-
strokeClass: "stroke-green-a9"
|
|
22
|
-
},
|
|
23
|
-
{
|
|
24
|
-
id: "grid",
|
|
25
|
-
color: "var(--blue-11)",
|
|
26
|
-
strokeClass: "stroke-blue-11"
|
|
27
|
-
},
|
|
28
|
-
{
|
|
29
|
-
id: "consumption",
|
|
30
|
-
color: "var(--neutral-a7)",
|
|
31
|
-
strokeClass: "stroke-gray-a7"
|
|
32
|
-
}
|
|
33
|
-
];
|
|
34
|
-
function PowerHistory({ solar, consumption, feedIn, grid, formatDate, title = "Power history", seriesLabels }) {
|
|
35
|
-
const [chartContainerRef, chartWidth] = useContainerWidth();
|
|
36
|
-
const [hiddenSeries, setHiddenSeries] = useState(() => /* @__PURE__ */ new Set());
|
|
37
|
-
const toggleSeries = useCallback((id) => {
|
|
38
|
-
setHiddenSeries((prev) => {
|
|
39
|
-
const next = new Set(prev);
|
|
40
|
-
if (next.has(id)) next.delete(id);
|
|
41
|
-
else next.add(id);
|
|
42
|
-
return next;
|
|
43
|
-
});
|
|
44
|
-
}, []);
|
|
45
|
-
const dataById = useMemo(() => ({
|
|
46
|
-
production: solar,
|
|
47
|
-
feedin: feedIn,
|
|
48
|
-
grid,
|
|
49
|
-
consumption
|
|
50
|
-
}), [
|
|
51
|
-
consumption,
|
|
52
|
-
feedIn,
|
|
53
|
-
grid,
|
|
54
|
-
solar
|
|
55
|
-
]);
|
|
56
|
-
const labelById = useMemo(() => ({
|
|
57
|
-
production: seriesLabels?.production ?? "Production",
|
|
58
|
-
feedin: seriesLabels?.feedIn ?? "Feed in",
|
|
59
|
-
grid: seriesLabels?.grid ?? "Grid",
|
|
60
|
-
consumption: seriesLabels?.consumption ?? "Consumption"
|
|
61
|
-
}), [seriesLabels]);
|
|
62
|
-
const legendItems = useMemo(() => SERIES_STYLE.map((entry) => ({
|
|
63
|
-
id: entry.id,
|
|
64
|
-
label: labelById[entry.id],
|
|
65
|
-
color: entry.color
|
|
66
|
-
})), [labelById]);
|
|
67
|
-
const visibleSeries = useMemo(() => SERIES_STYLE.filter((entry) => !hiddenSeries.has(entry.id)).map((entry) => ({
|
|
68
|
-
id: entry.id,
|
|
69
|
-
data: dataById[entry.id],
|
|
70
|
-
curve: "monotone",
|
|
71
|
-
className: entry.strokeClass
|
|
72
|
-
})), [dataById, hiddenSeries]);
|
|
73
|
-
if (solar.every((s) => s.value === 0) && consumption.every((c) => c.value === 0) && feedIn.every((f) => f.value === 0) && grid.every((g) => g.value === 0)) return null;
|
|
74
|
-
return /* @__PURE__ */ jsxs("div", {
|
|
75
|
-
className: "flex flex-col gap-3",
|
|
76
|
-
children: [
|
|
77
|
-
/* @__PURE__ */ jsx("div", {
|
|
78
|
-
className: "flex items-center justify-between",
|
|
79
|
-
children: /* @__PURE__ */ jsx(SectionTitle, { children: title })
|
|
80
|
-
}),
|
|
81
|
-
/* @__PURE__ */ jsx(SeriesLegend, {
|
|
82
|
-
items: legendItems,
|
|
83
|
-
hiddenIds: hiddenSeries,
|
|
84
|
-
onToggle: toggleSeries
|
|
85
|
-
}),
|
|
86
|
-
/* @__PURE__ */ jsx("div", {
|
|
87
|
-
ref: chartContainerRef,
|
|
88
|
-
className: "w-full",
|
|
89
|
-
style: { minHeight: 200 },
|
|
90
|
-
children: chartWidth > 0 && visibleSeries.length > 0 && /* @__PURE__ */ jsx(LineChart, {
|
|
91
|
-
width: chartWidth,
|
|
92
|
-
height: 200,
|
|
93
|
-
margin: {
|
|
94
|
-
top: 8,
|
|
95
|
-
right: 8,
|
|
96
|
-
bottom: 28,
|
|
97
|
-
left: 8
|
|
98
|
-
},
|
|
99
|
-
series: visibleSeries,
|
|
100
|
-
showGrid: true,
|
|
101
|
-
showTooltip: true,
|
|
102
|
-
xTickCount: 5,
|
|
103
|
-
yTickCount: 4,
|
|
104
|
-
formatDate,
|
|
105
|
-
formatValue: (v) => `${oneDecimalFormat.format(v / 1e3)} kW`
|
|
106
|
-
})
|
|
107
|
-
})
|
|
108
|
-
]
|
|
109
|
-
});
|
|
110
|
-
}
|
|
111
|
-
//#endregion
|
|
112
|
-
export { PowerHistory as default };
|
|
113
|
-
|
|
114
|
-
//# sourceMappingURL=power-history.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"power-history.js","names":["kwFormat"],"sources":["../../src/components/power-history.tsx"],"sourcesContent":["import { useCallback, useMemo, useState } from 'react'\nimport { useContainerWidth } from '../hooks/use-container-width'\nimport { NARROW_NBSP } from '../utils/chars'\nimport { oneDecimalFormat as kwFormat } from '../utils/format'\nimport { LineChart } from './line-chart'\nimport { SeriesLegend, type SeriesLegendItem } from './series-legend'\nimport { SectionTitle } from './typography'\n\ninterface PowerHistorySeries {\n id: string\n label: string\n /** CSS color value (e.g. `var(--orange-a9)`). */\n color: string\n /** Tailwind stroke class applied to the line (e.g. `stroke-orange-a9`). */\n strokeClass: string\n data: { date: Date; value: number }[]\n}\n\n/** Visual config (colors/classes) per series, independent of labels. */\nconst SERIES_STYLE: ReadonlyArray<\n Pick<PowerHistorySeries, 'id' | 'color' | 'strokeClass'>\n> = [\n {\n id: 'production',\n color: 'var(--orange-a9)',\n strokeClass: 'stroke-orange-a9',\n },\n {\n id: 'feedin',\n color: 'var(--green-a9)',\n strokeClass: 'stroke-green-a9',\n },\n {\n id: 'grid',\n color: 'var(--blue-11)',\n strokeClass: 'stroke-blue-11',\n },\n {\n id: 'consumption',\n color: 'var(--neutral-a7)',\n strokeClass: 'stroke-gray-a7',\n },\n]\n\ninterface PowerHistorySeriesLabels {\n production?: React.ReactNode\n feedIn?: React.ReactNode\n grid?: React.ReactNode\n consumption?: React.ReactNode\n}\n\nexport default function PowerHistory({\n solar,\n consumption,\n feedIn,\n grid,\n formatDate,\n title = 'Power history',\n seriesLabels,\n}: {\n solar: { date: Date; value: number }[]\n consumption: { date: Date; value: number }[]\n feedIn: { date: Date; value: number }[]\n grid: { date: Date; value: number }[]\n formatDate: (date: Date) => string\n /** Override the section title. Defaults to `\"Power history\"`. */\n title?: React.ReactNode\n /** Override the legend labels for each series. Each defaults to its English name. */\n seriesLabels?: PowerHistorySeriesLabels\n}) {\n const [chartContainerRef, chartWidth] = useContainerWidth<HTMLDivElement>()\n const [hiddenSeries, setHiddenSeries] = useState<ReadonlySet<string>>(\n () => new Set(),\n )\n\n const toggleSeries = useCallback((id: string) => {\n setHiddenSeries((prev) => {\n const next = new Set(prev)\n if (next.has(id)) {\n next.delete(id)\n } else {\n next.add(id)\n }\n return next\n })\n }, [])\n\n const dataById = useMemo(\n () => ({\n production: solar,\n feedin: feedIn,\n grid,\n consumption,\n }),\n [consumption, feedIn, grid, solar],\n )\n\n const labelById = useMemo<Record<string, React.ReactNode>>(\n () => ({\n production: seriesLabels?.production ?? 'Production',\n feedin: seriesLabels?.feedIn ?? 'Feed in',\n grid: seriesLabels?.grid ?? 'Grid',\n consumption: seriesLabels?.consumption ?? 'Consumption',\n }),\n [seriesLabels],\n )\n\n const legendItems: SeriesLegendItem[] = useMemo(\n () =>\n SERIES_STYLE.map((entry) => ({\n id: entry.id,\n label: labelById[entry.id] as string,\n color: entry.color,\n })),\n [labelById],\n )\n\n const visibleSeries = useMemo(\n () =>\n SERIES_STYLE.filter((entry) => !hiddenSeries.has(entry.id)).map(\n (entry) => ({\n id: entry.id,\n data: dataById[entry.id as keyof typeof dataById],\n curve: 'monotone' as const,\n className: entry.strokeClass,\n }),\n ),\n [dataById, hiddenSeries],\n )\n\n const dataEmpty =\n solar.every((s) => s.value === 0) &&\n consumption.every((c) => c.value === 0) &&\n feedIn.every((f) => f.value === 0) &&\n grid.every((g) => g.value === 0)\n\n if (dataEmpty) return null\n\n return (\n <div className=\"flex flex-col gap-3\">\n <div className=\"flex items-center justify-between\">\n <SectionTitle>{title}</SectionTitle>\n </div>\n\n <SeriesLegend\n items={legendItems}\n hiddenIds={hiddenSeries}\n onToggle={toggleSeries}\n />\n\n <div\n ref={chartContainerRef}\n className=\"w-full\"\n style={{ minHeight: 200 }}\n >\n {chartWidth > 0 && visibleSeries.length > 0 && (\n <LineChart\n width={chartWidth}\n height={200}\n margin={{ top: 8, right: 8, bottom: 28, left: 8 }}\n series={visibleSeries}\n showGrid\n showTooltip\n xTickCount={5}\n yTickCount={4}\n formatDate={formatDate}\n formatValue={(v) => `${kwFormat.format(v / 1000)}${NARROW_NBSP}kW`}\n />\n )}\n </div>\n </div>\n )\n}\n"],"mappings":";;;;;;;;;;;AAmBA,MAAM,eAEF;CACF;EACE,IAAI;EACJ,OAAO;EACP,aAAa;CACf;CACA;EACE,IAAI;EACJ,OAAO;EACP,aAAa;CACf;CACA;EACE,IAAI;EACJ,OAAO;EACP,aAAa;CACf;CACA;EACE,IAAI;EACJ,OAAO;EACP,aAAa;CACf;AACF;AASA,SAAwB,aAAa,EACnC,OACA,aACA,QACA,MACA,YACA,QAAQ,iBACR,gBAWC;CACD,MAAM,CAAC,mBAAmB,cAAc,kBAAkC;CAC1E,MAAM,CAAC,cAAc,mBAAmB,+BAChC,IAAI,IAAI,CAChB;CAEA,MAAM,eAAe,aAAa,OAAe;EAC/C,iBAAiB,SAAS;GACxB,MAAM,OAAO,IAAI,IAAI,IAAI;GACzB,IAAI,KAAK,IAAI,EAAE,GACb,KAAK,OAAO,EAAE;QAEd,KAAK,IAAI,EAAE;GAEb,OAAO;EACT,CAAC;CACH,GAAG,CAAC,CAAC;CAEL,MAAM,WAAW,eACR;EACL,YAAY;EACZ,QAAQ;EACR;EACA;CACF,IACA;EAAC;EAAa;EAAQ;EAAM;CAAK,CACnC;CAEA,MAAM,YAAY,eACT;EACL,YAAY,cAAc,cAAc;EACxC,QAAQ,cAAc,UAAU;EAChC,MAAM,cAAc,QAAQ;EAC5B,aAAa,cAAc,eAAe;CAC5C,IACA,CAAC,YAAY,CACf;CAEA,MAAM,cAAkC,cAEpC,aAAa,KAAK,WAAW;EAC3B,IAAI,MAAM;EACV,OAAO,UAAU,MAAM;EACvB,OAAO,MAAM;CACf,EAAE,GACJ,CAAC,SAAS,CACZ;CAEA,MAAM,gBAAgB,cAElB,aAAa,QAAQ,UAAU,CAAC,aAAa,IAAI,MAAM,EAAE,CAAC,EAAE,KACzD,WAAW;EACV,IAAI,MAAM;EACV,MAAM,SAAS,MAAM;EACrB,OAAO;EACP,WAAW,MAAM;CACnB,EACF,GACF,CAAC,UAAU,YAAY,CACzB;CAQA,IALE,MAAM,OAAO,MAAM,EAAE,UAAU,CAAC,KAChC,YAAY,OAAO,MAAM,EAAE,UAAU,CAAC,KACtC,OAAO,OAAO,MAAM,EAAE,UAAU,CAAC,KACjC,KAAK,OAAO,MAAM,EAAE,UAAU,CAAC,GAElB,OAAO;CAEtB,OACE,qBAAC,OAAD;EAAK,WAAU;YAAf;GACE,oBAAC,OAAD;IAAK,WAAU;cACb,oBAAC,cAAD,EAAA,UAAe,MAAoB,CAAA;GAChC,CAAA;GAEL,oBAAC,cAAD;IACE,OAAO;IACP,WAAW;IACX,UAAU;GACX,CAAA;GAED,oBAAC,OAAD;IACE,KAAK;IACL,WAAU;IACV,OAAO,EAAE,WAAW,IAAI;cAEvB,aAAa,KAAK,cAAc,SAAS,KACxC,oBAAC,WAAD;KACE,OAAO;KACP,QAAQ;KACR,QAAQ;MAAE,KAAK;MAAG,OAAO;MAAG,QAAQ;MAAI,MAAM;KAAE;KAChD,QAAQ;KACR,UAAA;KACA,aAAA;KACA,YAAY;KACZ,YAAY;KACA;KACZ,cAAc,MAAM,GAAGA,iBAAS,OAAO,IAAI,GAAI;IAChD,CAAA;GAEA,CAAA;EACF;;AAET"}
|