@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
|
@@ -4,17 +4,17 @@ import "react";
|
|
|
4
4
|
import { jsx, jsxs } from "react/jsx-runtime";
|
|
5
5
|
//#region src/components/circular-gauge.tsx
|
|
6
6
|
const TRACK_TONE_CLASSES = {
|
|
7
|
-
success: "stroke-
|
|
8
|
-
warning: "stroke-
|
|
9
|
-
error: "stroke-
|
|
10
|
-
accent: "stroke-
|
|
7
|
+
success: "stroke-success-soft",
|
|
8
|
+
warning: "stroke-warning-soft",
|
|
9
|
+
error: "stroke-error-soft",
|
|
10
|
+
accent: "stroke-primary-soft",
|
|
11
11
|
neutral: "stroke-base-gray-soft"
|
|
12
12
|
};
|
|
13
13
|
const INDICATOR_TONE_CLASSES = {
|
|
14
14
|
success: "stroke-base-success-solid",
|
|
15
|
-
warning: "stroke-warning-
|
|
16
|
-
error: "stroke-error-
|
|
17
|
-
accent: "stroke-
|
|
15
|
+
warning: "stroke-base-warning-solid",
|
|
16
|
+
error: "stroke-base-error-solid",
|
|
17
|
+
accent: "stroke-primary",
|
|
18
18
|
neutral: "stroke-gray"
|
|
19
19
|
};
|
|
20
20
|
const CircularGauge = ({ className, value, max = 100, tone = "accent", size = 44, strokeWidth = 4, children, ...rest }) => {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"circular-gauge.js","names":[],"sources":["../../src/components/circular-gauge.tsx"],"sourcesContent":["import * as React from 'react'\nimport type { Tone } from '../lib/tones'\nimport { cn } from '../utils/cn'\n\nconst TRACK_TONE_CLASSES: Record<Tone, string> = {\n success: 'stroke-
|
|
1
|
+
{"version":3,"file":"circular-gauge.js","names":[],"sources":["../../src/components/circular-gauge.tsx"],"sourcesContent":["import * as React from 'react'\nimport type { Tone } from '../lib/tones'\nimport { cn } from '../utils/cn'\n\nconst TRACK_TONE_CLASSES: Record<Tone, string> = {\n success: 'stroke-success-soft',\n warning: 'stroke-warning-soft',\n error: 'stroke-error-soft',\n accent: 'stroke-primary-soft',\n neutral: 'stroke-base-gray-soft',\n}\n\nconst INDICATOR_TONE_CLASSES: Record<Tone, string> = {\n // solid ramp, not `-active`: keeps the ring in step with EntityCardState's dot\n success: 'stroke-base-success-solid',\n warning: 'stroke-base-warning-solid',\n error: 'stroke-base-error-solid',\n accent: 'stroke-primary',\n neutral: 'stroke-gray',\n}\n\n/**\n * Consumers should pass an `aria-label` to name the metric the gauge represents\n * (e.g. \"Battery\"); `aria-valuetext` defaults to the value as a percentage.\n */\nexport interface CircularGaugeProps extends Omit<\n React.ComponentProps<'div'>,\n 'children'\n> {\n /** Current value (0–max). */\n value: number\n /** Maximum value. Default: 100 */\n max?: number\n /** Tone color for the indicator/track pair. Default: \"accent\" */\n tone?: Tone\n /** Diameter in pixels. Default: 44 */\n size?: number\n /** Stroke thickness in pixels. Default: 4 */\n strokeWidth?: number\n /** Optional content rendered centered inside the gauge (e.g. percentage, icon). */\n children?: React.ReactNode\n}\n\nconst CircularGauge = ({\n className,\n value,\n max = 100,\n tone = 'accent',\n size = 44,\n strokeWidth = 4,\n children,\n ...rest\n}: CircularGaugeProps) => {\n const clamped = Math.min(Math.max(value, 0), max)\n const radius = (size - strokeWidth) / 2\n const circumference = 2 * Math.PI * radius\n const offset = circumference * (1 - clamped / max)\n const percent = Math.round((clamped / max) * 100)\n\n return (\n <div\n className={cn('relative inline-flex shrink-0', className)}\n style={{ width: size, height: size }}\n role=\"meter\"\n aria-valuemin={0}\n aria-valuemax={max}\n aria-valuenow={value}\n aria-valuetext={`${percent}%`}\n {...rest}\n >\n <svg\n className=\"size-full -rotate-90\"\n width={size}\n height={size}\n viewBox={`0 0 ${size} ${size}`}\n aria-hidden=\"true\"\n >\n <circle\n cx={size / 2}\n cy={size / 2}\n r={radius}\n fill=\"none\"\n strokeWidth={strokeWidth}\n className={TRACK_TONE_CLASSES[tone]}\n />\n <circle\n cx={size / 2}\n cy={size / 2}\n r={radius}\n fill=\"none\"\n strokeWidth={strokeWidth}\n strokeLinecap=\"round\"\n strokeDasharray={circumference}\n strokeDashoffset={offset}\n className={cn(\n 'transition-[stroke-dashoffset] duration-300',\n INDICATOR_TONE_CLASSES[tone],\n )}\n />\n </svg>\n {children !== undefined && (\n <span className=\"absolute inset-0 flex items-center justify-center text-[11px] leading-none font-semibold tabular-nums\">\n {children}\n </span>\n )}\n </div>\n )\n}\n\nexport { CircularGauge }\n"],"mappings":";;;;;AAIA,MAAM,qBAA2C;CAC/C,SAAS;CACT,SAAS;CACT,OAAO;CACP,QAAQ;CACR,SAAS;AACX;AAEA,MAAM,yBAA+C;CAEnD,SAAS;CACT,SAAS;CACT,OAAO;CACP,QAAQ;CACR,SAAS;AACX;AAwBA,MAAM,iBAAiB,EACrB,WACA,OACA,MAAM,KACN,OAAO,UACP,OAAO,IACP,cAAc,GACd,UACA,GAAG,WACqB;CACxB,MAAM,UAAU,KAAK,IAAI,KAAK,IAAI,OAAO,CAAC,GAAG,GAAG;CAChD,MAAM,UAAU,OAAO,eAAe;CACtC,MAAM,gBAAgB,IAAI,KAAK,KAAK;CACpC,MAAM,SAAS,iBAAiB,IAAI,UAAU;CAC9C,MAAM,UAAU,KAAK,MAAO,UAAU,MAAO,GAAG;CAEhD,OACE,qBAAC,OAAD;EACE,WAAW,GAAG,iCAAiC,SAAS;EACxD,OAAO;GAAE,OAAO;GAAM,QAAQ;EAAK;EACnC,MAAK;EACL,iBAAe;EACf,iBAAe;EACf,iBAAe;EACf,kBAAgB,GAAG,QAAQ;EAC3B,GAAI;YARN,CAUE,qBAAC,OAAD;GACE,WAAU;GACV,OAAO;GACP,QAAQ;GACR,SAAS,OAAO,KAAK,GAAG;GACxB,eAAY;aALd,CAOE,oBAAC,UAAD;IACE,IAAI,OAAO;IACX,IAAI,OAAO;IACX,GAAG;IACH,MAAK;IACQ;IACb,WAAW,mBAAmB;GAC/B,CAAA,GACD,oBAAC,UAAD;IACE,IAAI,OAAO;IACX,IAAI,OAAO;IACX,GAAG;IACH,MAAK;IACQ;IACb,eAAc;IACd,iBAAiB;IACjB,kBAAkB;IAClB,WAAW,GACT,+CACA,uBAAuB,KACzB;GACD,CAAA,CACE;MACJ,aAAa,KAAA,KACZ,oBAAC,QAAD;GAAM,WAAU;GACb;EACG,CAAA,CAEL;;AAET"}
|
|
@@ -7,34 +7,13 @@ let react_jsx_runtime = require("react/jsx-runtime");
|
|
|
7
7
|
let cnfast = require("cnfast");
|
|
8
8
|
//#region src/components/day-of-week-picker.tsx
|
|
9
9
|
const WEEK_DAYS = [
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
},
|
|
18
|
-
{
|
|
19
|
-
value: "wednesday",
|
|
20
|
-
short: "Wed"
|
|
21
|
-
},
|
|
22
|
-
{
|
|
23
|
-
value: "thursday",
|
|
24
|
-
short: "Thu"
|
|
25
|
-
},
|
|
26
|
-
{
|
|
27
|
-
value: "friday",
|
|
28
|
-
short: "Fri"
|
|
29
|
-
},
|
|
30
|
-
{
|
|
31
|
-
value: "saturday",
|
|
32
|
-
short: "Sat"
|
|
33
|
-
},
|
|
34
|
-
{
|
|
35
|
-
value: "sunday",
|
|
36
|
-
short: "Sun"
|
|
37
|
-
}
|
|
10
|
+
"monday",
|
|
11
|
+
"tuesday",
|
|
12
|
+
"wednesday",
|
|
13
|
+
"thursday",
|
|
14
|
+
"friday",
|
|
15
|
+
"saturday",
|
|
16
|
+
"sunday"
|
|
38
17
|
];
|
|
39
18
|
const WEEKDAYS_ONLY = [
|
|
40
19
|
"monday",
|
|
@@ -44,8 +23,9 @@ const WEEKDAYS_ONLY = [
|
|
|
44
23
|
"friday"
|
|
45
24
|
];
|
|
46
25
|
const WEEKEND_ONLY = ["saturday", "sunday"];
|
|
47
|
-
const ALL_DAYS = WEEK_DAYS
|
|
48
|
-
const DayOfWeekPicker = react.forwardRef((
|
|
26
|
+
const ALL_DAYS = [...WEEK_DAYS];
|
|
27
|
+
const DayOfWeekPicker = react.forwardRef(function DayOfWeekPicker(props, ref) {
|
|
28
|
+
const { className, disabled, onValueChange, showPresets = false, value, dayLabels, dayAriaLabels, daysAriaLabel } = props;
|
|
49
29
|
const selected = react.useMemo(() => new Set(value), [value]);
|
|
50
30
|
const toggle = (day) => {
|
|
51
31
|
const next = new Set(selected);
|
|
@@ -60,47 +40,47 @@ const DayOfWeekPicker = react.forwardRef(({ className, disabled, onValueChange,
|
|
|
60
40
|
return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
|
|
61
41
|
ref,
|
|
62
42
|
className: (0, cnfast.cn)("flex flex-col gap-2", className),
|
|
63
|
-
children: [showPresets && /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
|
|
43
|
+
children: [showPresets && props.showPresets ? /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
|
|
64
44
|
role: "group",
|
|
65
|
-
"aria-label": presetsAriaLabel,
|
|
45
|
+
"aria-label": props.presetsAriaLabel,
|
|
66
46
|
className: "flex flex-wrap gap-1.5",
|
|
67
47
|
children: [
|
|
68
48
|
/* @__PURE__ */ (0, react_jsx_runtime.jsx)(PresetButton, {
|
|
69
49
|
active: matches(WEEKDAYS_ONLY),
|
|
70
50
|
disabled,
|
|
71
51
|
onClick: () => setPreset(WEEKDAYS_ONLY),
|
|
72
|
-
children: presetLabels
|
|
52
|
+
children: props.presetLabels.weekdays
|
|
73
53
|
}),
|
|
74
54
|
/* @__PURE__ */ (0, react_jsx_runtime.jsx)(PresetButton, {
|
|
75
55
|
active: matches(WEEKEND_ONLY),
|
|
76
56
|
disabled,
|
|
77
57
|
onClick: () => setPreset(WEEKEND_ONLY),
|
|
78
|
-
children: presetLabels
|
|
58
|
+
children: props.presetLabels.weekend
|
|
79
59
|
}),
|
|
80
60
|
/* @__PURE__ */ (0, react_jsx_runtime.jsx)(PresetButton, {
|
|
81
61
|
active: matches(ALL_DAYS),
|
|
82
62
|
disabled,
|
|
83
63
|
onClick: () => setPreset(ALL_DAYS),
|
|
84
|
-
children: presetLabels
|
|
64
|
+
children: props.presetLabels.everyDay
|
|
85
65
|
})
|
|
86
66
|
]
|
|
87
|
-
}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
|
|
67
|
+
}) : null, /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
|
|
88
68
|
role: "group",
|
|
89
69
|
"aria-label": daysAriaLabel,
|
|
90
70
|
className: "flex gap-1",
|
|
91
71
|
children: WEEK_DAYS.map((day) => {
|
|
92
|
-
const checked = selected.has(day
|
|
93
|
-
const label = dayLabels
|
|
72
|
+
const checked = selected.has(day);
|
|
73
|
+
const label = dayLabels[day];
|
|
94
74
|
return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
|
|
95
75
|
type: "button",
|
|
96
76
|
role: "checkbox",
|
|
97
77
|
"aria-checked": checked,
|
|
98
|
-
"aria-label": dayAriaLabels?.[day
|
|
78
|
+
"aria-label": dayAriaLabels?.[day] ?? label,
|
|
99
79
|
disabled,
|
|
100
|
-
onClick: () => toggle(day
|
|
80
|
+
onClick: () => toggle(day),
|
|
101
81
|
className: (0, cnfast.cn)("touch-target inline-flex h-9 flex-1 items-center justify-center rounded-full text-xs font-medium transition-colors focus-visible:ring-2 focus-visible:ring-offset-2 focus-visible:outline-hidden disabled:cursor-not-allowed disabled:opacity-50 motion-reduce:transition-none", checked ? "bg-base-accent-solid text-accent-contrast hover:bg-spark-9" : "bg-base-gray-soft text-gray-light hover:bg-gray-a4"),
|
|
102
82
|
children: label
|
|
103
|
-
}, day
|
|
83
|
+
}, day);
|
|
104
84
|
})
|
|
105
85
|
})]
|
|
106
86
|
});
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"day-of-week-picker.cjs","names":["React"],"sources":["../../src/components/day-of-week-picker.tsx"],"sourcesContent":["import * as React from 'react'\nimport { cn } from '../utils/cn'\n\nexport type WeekDay =\n | 'monday'\n | 'tuesday'\n | 'wednesday'\n | 'thursday'\n | 'friday'\n | 'saturday'\n | 'sunday'\n\nexport const WEEK_DAYS:
|
|
1
|
+
{"version":3,"file":"day-of-week-picker.cjs","names":["React"],"sources":["../../src/components/day-of-week-picker.tsx"],"sourcesContent":["import * as React from 'react'\nimport { cn } from '../utils/cn'\n\nexport type WeekDay =\n | 'monday'\n | 'tuesday'\n | 'wednesday'\n | 'thursday'\n | 'friday'\n | 'saturday'\n | 'sunday'\n\nexport const WEEK_DAYS: readonly WeekDay[] = [\n 'monday',\n 'tuesday',\n 'wednesday',\n 'thursday',\n 'friday',\n 'saturday',\n 'sunday',\n] as const\n\nconst WEEKDAYS_ONLY: WeekDay[] = [\n 'monday',\n 'tuesday',\n 'wednesday',\n 'thursday',\n 'friday',\n]\nconst WEEKEND_ONLY: WeekDay[] = ['saturday', 'sunday']\nconst ALL_DAYS: WeekDay[] = [...WEEK_DAYS]\n\ntype DayOfWeekPickerBaseProps = {\n value: WeekDay[]\n onValueChange: (next: WeekDay[]) => void\n disabled?: boolean\n className?: string\n dayLabels: Record<WeekDay, string>\n dayAriaLabels?: Partial<Record<WeekDay, string>>\n daysAriaLabel: string\n}\n\ntype DayOfWeekPickerWithPresets = DayOfWeekPickerBaseProps & {\n showPresets: true\n presetLabels: {\n weekdays: React.ReactNode\n weekend: React.ReactNode\n everyDay: React.ReactNode\n }\n presetsAriaLabel: string\n}\n\ntype DayOfWeekPickerWithoutPresets = DayOfWeekPickerBaseProps & {\n showPresets?: false\n presetLabels?: never\n presetsAriaLabel?: never\n}\n\ntype DayOfWeekPickerProps =\n | DayOfWeekPickerWithPresets\n | DayOfWeekPickerWithoutPresets\n\nconst DayOfWeekPicker = React.forwardRef<HTMLDivElement, DayOfWeekPickerProps>(\n function DayOfWeekPicker(props, ref) {\n const {\n className,\n disabled,\n onValueChange,\n showPresets = false,\n value,\n dayLabels,\n dayAriaLabels,\n daysAriaLabel,\n } = props\n\n const selected = React.useMemo(() => new Set(value), [value])\n\n const toggle = (day: WeekDay) => {\n const next = new Set(selected)\n if (next.has(day)) {\n next.delete(day)\n } else {\n next.add(day)\n }\n onValueChange(ALL_DAYS.filter((d) => next.has(d)))\n }\n\n const matches = (preset: WeekDay[]) =>\n selected.size === preset.length && preset.every((d) => selected.has(d))\n\n const setPreset = (preset: WeekDay[]) => {\n onValueChange(preset)\n }\n\n return (\n <div ref={ref} className={cn('flex flex-col gap-2', className)}>\n {showPresets && props.showPresets ? (\n <div\n role=\"group\"\n aria-label={props.presetsAriaLabel}\n className=\"flex flex-wrap gap-1.5\"\n >\n <PresetButton\n active={matches(WEEKDAYS_ONLY)}\n disabled={disabled}\n onClick={() => setPreset(WEEKDAYS_ONLY)}\n >\n {props.presetLabels.weekdays}\n </PresetButton>\n <PresetButton\n active={matches(WEEKEND_ONLY)}\n disabled={disabled}\n onClick={() => setPreset(WEEKEND_ONLY)}\n >\n {props.presetLabels.weekend}\n </PresetButton>\n <PresetButton\n active={matches(ALL_DAYS)}\n disabled={disabled}\n onClick={() => setPreset(ALL_DAYS)}\n >\n {props.presetLabels.everyDay}\n </PresetButton>\n </div>\n ) : null}\n <div role=\"group\" aria-label={daysAriaLabel} className=\"flex gap-1\">\n {WEEK_DAYS.map((day) => {\n const checked = selected.has(day)\n const label = dayLabels[day]\n const ariaLabel = dayAriaLabels?.[day] ?? label\n return (\n <button\n key={day}\n type=\"button\"\n role=\"checkbox\"\n aria-checked={checked}\n aria-label={ariaLabel}\n disabled={disabled}\n onClick={() => toggle(day)}\n className={cn(\n 'touch-target inline-flex h-9 flex-1 items-center justify-center rounded-full text-xs font-medium transition-colors focus-visible:ring-2 focus-visible:ring-offset-2 focus-visible:outline-hidden disabled:cursor-not-allowed disabled:opacity-50 motion-reduce:transition-none',\n checked\n ? 'bg-base-accent-solid text-accent-contrast hover:bg-spark-9'\n : 'bg-base-gray-soft text-gray-light hover:bg-gray-a4',\n )}\n >\n {label}\n </button>\n )\n })}\n </div>\n </div>\n )\n },\n)\n\nDayOfWeekPicker.displayName = 'DayOfWeekPicker'\n\ninterface PresetButtonProps {\n active: boolean\n disabled?: boolean\n onClick: () => void\n children: React.ReactNode\n}\n\nfunction PresetButton({\n active,\n children,\n disabled,\n onClick,\n}: PresetButtonProps) {\n return (\n <button\n type=\"button\"\n onClick={onClick}\n disabled={disabled}\n aria-pressed={active}\n className={cn(\n 'touch-target inline-flex h-7 items-center justify-center rounded-full px-3 text-xs font-medium transition-colors focus-visible:ring-2 focus-visible:ring-offset-2 focus-visible:outline-hidden disabled:cursor-not-allowed disabled:opacity-50 motion-reduce:transition-none',\n active\n ? 'bg-base-accent-soft text-accent'\n : 'bg-transparent text-gray-light hover:bg-gray-a3',\n )}\n >\n {children}\n </button>\n )\n}\n\nexport { DayOfWeekPicker }\n"],"mappings":";;;;;;;;AAYA,MAAa,YAAgC;CAC3C;CACA;CACA;CACA;CACA;CACA;CACA;AACF;AAEA,MAAM,gBAA2B;CAC/B;CACA;CACA;CACA;CACA;AACF;AACA,MAAM,eAA0B,CAAC,YAAY,QAAQ;AACrD,MAAM,WAAsB,CAAC,GAAG,SAAS;AAgCzC,MAAM,kBAAkBA,MAAM,WAC5B,SAAS,gBAAgB,OAAO,KAAK;CACnC,MAAM,EACJ,WACA,UACA,eACA,cAAc,OACd,OACA,WACA,eACA,kBACE;CAEJ,MAAM,WAAWA,MAAM,cAAc,IAAI,IAAI,KAAK,GAAG,CAAC,KAAK,CAAC;CAE5D,MAAM,UAAU,QAAiB;EAC/B,MAAM,OAAO,IAAI,IAAI,QAAQ;EAC7B,IAAI,KAAK,IAAI,GAAG,GACd,KAAK,OAAO,GAAG;OAEf,KAAK,IAAI,GAAG;EAEd,cAAc,SAAS,QAAQ,MAAM,KAAK,IAAI,CAAC,CAAC,CAAC;CACnD;CAEA,MAAM,WAAW,WACf,SAAS,SAAS,OAAO,UAAU,OAAO,OAAO,MAAM,SAAS,IAAI,CAAC,CAAC;CAExE,MAAM,aAAa,WAAsB;EACvC,cAAc,MAAM;CACtB;CAEA,OACE,iBAAA,GAAA,kBAAA,MAAC,OAAD;EAAU;EAAK,YAAA,GAAA,OAAA,IAAc,uBAAuB,SAAS;YAA7D,CACG,eAAe,MAAM,cACpB,iBAAA,GAAA,kBAAA,MAAC,OAAD;GACE,MAAK;GACL,cAAY,MAAM;GAClB,WAAU;aAHZ;IAKE,iBAAA,GAAA,kBAAA,KAAC,cAAD;KACE,QAAQ,QAAQ,aAAa;KACnB;KACV,eAAe,UAAU,aAAa;eAErC,MAAM,aAAa;IACR,CAAA;IACd,iBAAA,GAAA,kBAAA,KAAC,cAAD;KACE,QAAQ,QAAQ,YAAY;KAClB;KACV,eAAe,UAAU,YAAY;eAEpC,MAAM,aAAa;IACR,CAAA;IACd,iBAAA,GAAA,kBAAA,KAAC,cAAD;KACE,QAAQ,QAAQ,QAAQ;KACd;KACV,eAAe,UAAU,QAAQ;eAEhC,MAAM,aAAa;IACR,CAAA;GACX;OACH,MACJ,iBAAA,GAAA,kBAAA,KAAC,OAAD;GAAK,MAAK;GAAQ,cAAY;GAAe,WAAU;aACpD,UAAU,KAAK,QAAQ;IACtB,MAAM,UAAU,SAAS,IAAI,GAAG;IAChC,MAAM,QAAQ,UAAU;IAExB,OACE,iBAAA,GAAA,kBAAA,KAAC,UAAD;KAEE,MAAK;KACL,MAAK;KACL,gBAAc;KACd,cAPc,gBAAgB,QAAQ;KAQ5B;KACV,eAAe,OAAO,GAAG;KACzB,YAAA,GAAA,OAAA,IACE,kRACA,UACI,+DACA,oDACN;eAEC;IACK,GAfD,GAeC;GAEZ,CAAC;EACE,CAAA,CACF;;AAET,CACF;AAEA,gBAAgB,cAAc;AAS9B,SAAS,aAAa,EACpB,QACA,UACA,UACA,WACoB;CACpB,OACE,iBAAA,GAAA,kBAAA,KAAC,UAAD;EACE,MAAK;EACI;EACC;EACV,gBAAc;EACd,YAAA,GAAA,OAAA,IACE,gRACA,SACI,oCACA,iDACN;EAEC;CACK,CAAA;AAEZ"}
|
|
@@ -4,35 +4,31 @@ import * as React$1 from "react";
|
|
|
4
4
|
|
|
5
5
|
//#region src/components/day-of-week-picker.d.ts
|
|
6
6
|
type WeekDay = 'monday' | 'tuesday' | 'wednesday' | 'thursday' | 'friday' | 'saturday' | 'sunday';
|
|
7
|
-
declare const WEEK_DAYS:
|
|
8
|
-
|
|
9
|
-
short: string;
|
|
10
|
-
}>;
|
|
11
|
-
interface DayOfWeekPickerProps {
|
|
7
|
+
declare const WEEK_DAYS: readonly WeekDay[];
|
|
8
|
+
type DayOfWeekPickerBaseProps = {
|
|
12
9
|
value: WeekDay[];
|
|
13
10
|
onValueChange: (next: WeekDay[]) => void;
|
|
14
11
|
disabled?: boolean;
|
|
15
|
-
/** Show "Weekdays / Weekend / Every day" preset shortcuts above the chips. */
|
|
16
|
-
showPresets?: boolean;
|
|
17
12
|
className?: string;
|
|
18
|
-
|
|
19
|
-
dayLabels?: Partial<Record<WeekDay, string>>;
|
|
20
|
-
/**
|
|
21
|
-
* Full accessible names per day (e.g. "Monday"). Used as each chip's
|
|
22
|
-
* `aria-label`. Falls back to the visible short label when omitted.
|
|
23
|
-
*/
|
|
13
|
+
dayLabels: Record<WeekDay, string>;
|
|
24
14
|
dayAriaLabels?: Partial<Record<WeekDay, string>>;
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
15
|
+
daysAriaLabel: string;
|
|
16
|
+
};
|
|
17
|
+
type DayOfWeekPickerWithPresets = DayOfWeekPickerBaseProps & {
|
|
18
|
+
showPresets: true;
|
|
19
|
+
presetLabels: {
|
|
20
|
+
weekdays: React$1.ReactNode;
|
|
21
|
+
weekend: React$1.ReactNode;
|
|
22
|
+
everyDay: React$1.ReactNode;
|
|
30
23
|
};
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
24
|
+
presetsAriaLabel: string;
|
|
25
|
+
};
|
|
26
|
+
type DayOfWeekPickerWithoutPresets = DayOfWeekPickerBaseProps & {
|
|
27
|
+
showPresets?: false;
|
|
28
|
+
presetLabels?: never;
|
|
29
|
+
presetsAriaLabel?: never;
|
|
30
|
+
};
|
|
31
|
+
type DayOfWeekPickerProps = DayOfWeekPickerWithPresets | DayOfWeekPickerWithoutPresets;
|
|
36
32
|
declare const DayOfWeekPicker: React$1.ForwardRefExoticComponent<DayOfWeekPickerProps & React$1.RefAttributes<HTMLDivElement>>;
|
|
37
33
|
//#endregion
|
|
38
34
|
export { DayOfWeekPicker, WEEK_DAYS, WeekDay };
|
|
@@ -4,35 +4,31 @@ import * as React$1 from "react";
|
|
|
4
4
|
|
|
5
5
|
//#region src/components/day-of-week-picker.d.ts
|
|
6
6
|
type WeekDay = 'monday' | 'tuesday' | 'wednesday' | 'thursday' | 'friday' | 'saturday' | 'sunday';
|
|
7
|
-
declare const WEEK_DAYS:
|
|
8
|
-
|
|
9
|
-
short: string;
|
|
10
|
-
}>;
|
|
11
|
-
interface DayOfWeekPickerProps {
|
|
7
|
+
declare const WEEK_DAYS: readonly WeekDay[];
|
|
8
|
+
type DayOfWeekPickerBaseProps = {
|
|
12
9
|
value: WeekDay[];
|
|
13
10
|
onValueChange: (next: WeekDay[]) => void;
|
|
14
11
|
disabled?: boolean;
|
|
15
|
-
/** Show "Weekdays / Weekend / Every day" preset shortcuts above the chips. */
|
|
16
|
-
showPresets?: boolean;
|
|
17
12
|
className?: string;
|
|
18
|
-
|
|
19
|
-
dayLabels?: Partial<Record<WeekDay, string>>;
|
|
20
|
-
/**
|
|
21
|
-
* Full accessible names per day (e.g. "Monday"). Used as each chip's
|
|
22
|
-
* `aria-label`. Falls back to the visible short label when omitted.
|
|
23
|
-
*/
|
|
13
|
+
dayLabels: Record<WeekDay, string>;
|
|
24
14
|
dayAriaLabels?: Partial<Record<WeekDay, string>>;
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
15
|
+
daysAriaLabel: string;
|
|
16
|
+
};
|
|
17
|
+
type DayOfWeekPickerWithPresets = DayOfWeekPickerBaseProps & {
|
|
18
|
+
showPresets: true;
|
|
19
|
+
presetLabels: {
|
|
20
|
+
weekdays: React$1.ReactNode;
|
|
21
|
+
weekend: React$1.ReactNode;
|
|
22
|
+
everyDay: React$1.ReactNode;
|
|
30
23
|
};
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
24
|
+
presetsAriaLabel: string;
|
|
25
|
+
};
|
|
26
|
+
type DayOfWeekPickerWithoutPresets = DayOfWeekPickerBaseProps & {
|
|
27
|
+
showPresets?: false;
|
|
28
|
+
presetLabels?: never;
|
|
29
|
+
presetsAriaLabel?: never;
|
|
30
|
+
};
|
|
31
|
+
type DayOfWeekPickerProps = DayOfWeekPickerWithPresets | DayOfWeekPickerWithoutPresets;
|
|
36
32
|
declare const DayOfWeekPicker: React$1.ForwardRefExoticComponent<DayOfWeekPickerProps & React$1.RefAttributes<HTMLDivElement>>;
|
|
37
33
|
//#endregion
|
|
38
34
|
export { DayOfWeekPicker, WEEK_DAYS, WeekDay };
|
|
@@ -4,34 +4,13 @@ import * as React$1 from "react";
|
|
|
4
4
|
import { jsx, jsxs } from "react/jsx-runtime";
|
|
5
5
|
//#region src/components/day-of-week-picker.tsx
|
|
6
6
|
const WEEK_DAYS = [
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
},
|
|
15
|
-
{
|
|
16
|
-
value: "wednesday",
|
|
17
|
-
short: "Wed"
|
|
18
|
-
},
|
|
19
|
-
{
|
|
20
|
-
value: "thursday",
|
|
21
|
-
short: "Thu"
|
|
22
|
-
},
|
|
23
|
-
{
|
|
24
|
-
value: "friday",
|
|
25
|
-
short: "Fri"
|
|
26
|
-
},
|
|
27
|
-
{
|
|
28
|
-
value: "saturday",
|
|
29
|
-
short: "Sat"
|
|
30
|
-
},
|
|
31
|
-
{
|
|
32
|
-
value: "sunday",
|
|
33
|
-
short: "Sun"
|
|
34
|
-
}
|
|
7
|
+
"monday",
|
|
8
|
+
"tuesday",
|
|
9
|
+
"wednesday",
|
|
10
|
+
"thursday",
|
|
11
|
+
"friday",
|
|
12
|
+
"saturday",
|
|
13
|
+
"sunday"
|
|
35
14
|
];
|
|
36
15
|
const WEEKDAYS_ONLY = [
|
|
37
16
|
"monday",
|
|
@@ -41,8 +20,9 @@ const WEEKDAYS_ONLY = [
|
|
|
41
20
|
"friday"
|
|
42
21
|
];
|
|
43
22
|
const WEEKEND_ONLY = ["saturday", "sunday"];
|
|
44
|
-
const ALL_DAYS = WEEK_DAYS
|
|
45
|
-
const DayOfWeekPicker = React$1.forwardRef((
|
|
23
|
+
const ALL_DAYS = [...WEEK_DAYS];
|
|
24
|
+
const DayOfWeekPicker = React$1.forwardRef(function DayOfWeekPicker(props, ref) {
|
|
25
|
+
const { className, disabled, onValueChange, showPresets = false, value, dayLabels, dayAriaLabels, daysAriaLabel } = props;
|
|
46
26
|
const selected = React$1.useMemo(() => new Set(value), [value]);
|
|
47
27
|
const toggle = (day) => {
|
|
48
28
|
const next = new Set(selected);
|
|
@@ -57,47 +37,47 @@ const DayOfWeekPicker = React$1.forwardRef(({ className, disabled, onValueChange
|
|
|
57
37
|
return /* @__PURE__ */ jsxs("div", {
|
|
58
38
|
ref,
|
|
59
39
|
className: cn("flex flex-col gap-2", className),
|
|
60
|
-
children: [showPresets && /* @__PURE__ */ jsxs("div", {
|
|
40
|
+
children: [showPresets && props.showPresets ? /* @__PURE__ */ jsxs("div", {
|
|
61
41
|
role: "group",
|
|
62
|
-
"aria-label": presetsAriaLabel,
|
|
42
|
+
"aria-label": props.presetsAriaLabel,
|
|
63
43
|
className: "flex flex-wrap gap-1.5",
|
|
64
44
|
children: [
|
|
65
45
|
/* @__PURE__ */ jsx(PresetButton, {
|
|
66
46
|
active: matches(WEEKDAYS_ONLY),
|
|
67
47
|
disabled,
|
|
68
48
|
onClick: () => setPreset(WEEKDAYS_ONLY),
|
|
69
|
-
children: presetLabels
|
|
49
|
+
children: props.presetLabels.weekdays
|
|
70
50
|
}),
|
|
71
51
|
/* @__PURE__ */ jsx(PresetButton, {
|
|
72
52
|
active: matches(WEEKEND_ONLY),
|
|
73
53
|
disabled,
|
|
74
54
|
onClick: () => setPreset(WEEKEND_ONLY),
|
|
75
|
-
children: presetLabels
|
|
55
|
+
children: props.presetLabels.weekend
|
|
76
56
|
}),
|
|
77
57
|
/* @__PURE__ */ jsx(PresetButton, {
|
|
78
58
|
active: matches(ALL_DAYS),
|
|
79
59
|
disabled,
|
|
80
60
|
onClick: () => setPreset(ALL_DAYS),
|
|
81
|
-
children: presetLabels
|
|
61
|
+
children: props.presetLabels.everyDay
|
|
82
62
|
})
|
|
83
63
|
]
|
|
84
|
-
}), /* @__PURE__ */ jsx("div", {
|
|
64
|
+
}) : null, /* @__PURE__ */ jsx("div", {
|
|
85
65
|
role: "group",
|
|
86
66
|
"aria-label": daysAriaLabel,
|
|
87
67
|
className: "flex gap-1",
|
|
88
68
|
children: WEEK_DAYS.map((day) => {
|
|
89
|
-
const checked = selected.has(day
|
|
90
|
-
const label = dayLabels
|
|
69
|
+
const checked = selected.has(day);
|
|
70
|
+
const label = dayLabels[day];
|
|
91
71
|
return /* @__PURE__ */ jsx("button", {
|
|
92
72
|
type: "button",
|
|
93
73
|
role: "checkbox",
|
|
94
74
|
"aria-checked": checked,
|
|
95
|
-
"aria-label": dayAriaLabels?.[day
|
|
75
|
+
"aria-label": dayAriaLabels?.[day] ?? label,
|
|
96
76
|
disabled,
|
|
97
|
-
onClick: () => toggle(day
|
|
77
|
+
onClick: () => toggle(day),
|
|
98
78
|
className: cn("touch-target inline-flex h-9 flex-1 items-center justify-center rounded-full text-xs font-medium transition-colors focus-visible:ring-2 focus-visible:ring-offset-2 focus-visible:outline-hidden disabled:cursor-not-allowed disabled:opacity-50 motion-reduce:transition-none", checked ? "bg-base-accent-solid text-accent-contrast hover:bg-spark-9" : "bg-base-gray-soft text-gray-light hover:bg-gray-a4"),
|
|
99
79
|
children: label
|
|
100
|
-
}, day
|
|
80
|
+
}, day);
|
|
101
81
|
})
|
|
102
82
|
})]
|
|
103
83
|
});
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"day-of-week-picker.js","names":["React"],"sources":["../../src/components/day-of-week-picker.tsx"],"sourcesContent":["import * as React from 'react'\nimport { cn } from '../utils/cn'\n\nexport type WeekDay =\n | 'monday'\n | 'tuesday'\n | 'wednesday'\n | 'thursday'\n | 'friday'\n | 'saturday'\n | 'sunday'\n\nexport const WEEK_DAYS:
|
|
1
|
+
{"version":3,"file":"day-of-week-picker.js","names":["React"],"sources":["../../src/components/day-of-week-picker.tsx"],"sourcesContent":["import * as React from 'react'\nimport { cn } from '../utils/cn'\n\nexport type WeekDay =\n | 'monday'\n | 'tuesday'\n | 'wednesday'\n | 'thursday'\n | 'friday'\n | 'saturday'\n | 'sunday'\n\nexport const WEEK_DAYS: readonly WeekDay[] = [\n 'monday',\n 'tuesday',\n 'wednesday',\n 'thursday',\n 'friday',\n 'saturday',\n 'sunday',\n] as const\n\nconst WEEKDAYS_ONLY: WeekDay[] = [\n 'monday',\n 'tuesday',\n 'wednesday',\n 'thursday',\n 'friday',\n]\nconst WEEKEND_ONLY: WeekDay[] = ['saturday', 'sunday']\nconst ALL_DAYS: WeekDay[] = [...WEEK_DAYS]\n\ntype DayOfWeekPickerBaseProps = {\n value: WeekDay[]\n onValueChange: (next: WeekDay[]) => void\n disabled?: boolean\n className?: string\n dayLabels: Record<WeekDay, string>\n dayAriaLabels?: Partial<Record<WeekDay, string>>\n daysAriaLabel: string\n}\n\ntype DayOfWeekPickerWithPresets = DayOfWeekPickerBaseProps & {\n showPresets: true\n presetLabels: {\n weekdays: React.ReactNode\n weekend: React.ReactNode\n everyDay: React.ReactNode\n }\n presetsAriaLabel: string\n}\n\ntype DayOfWeekPickerWithoutPresets = DayOfWeekPickerBaseProps & {\n showPresets?: false\n presetLabels?: never\n presetsAriaLabel?: never\n}\n\ntype DayOfWeekPickerProps =\n | DayOfWeekPickerWithPresets\n | DayOfWeekPickerWithoutPresets\n\nconst DayOfWeekPicker = React.forwardRef<HTMLDivElement, DayOfWeekPickerProps>(\n function DayOfWeekPicker(props, ref) {\n const {\n className,\n disabled,\n onValueChange,\n showPresets = false,\n value,\n dayLabels,\n dayAriaLabels,\n daysAriaLabel,\n } = props\n\n const selected = React.useMemo(() => new Set(value), [value])\n\n const toggle = (day: WeekDay) => {\n const next = new Set(selected)\n if (next.has(day)) {\n next.delete(day)\n } else {\n next.add(day)\n }\n onValueChange(ALL_DAYS.filter((d) => next.has(d)))\n }\n\n const matches = (preset: WeekDay[]) =>\n selected.size === preset.length && preset.every((d) => selected.has(d))\n\n const setPreset = (preset: WeekDay[]) => {\n onValueChange(preset)\n }\n\n return (\n <div ref={ref} className={cn('flex flex-col gap-2', className)}>\n {showPresets && props.showPresets ? (\n <div\n role=\"group\"\n aria-label={props.presetsAriaLabel}\n className=\"flex flex-wrap gap-1.5\"\n >\n <PresetButton\n active={matches(WEEKDAYS_ONLY)}\n disabled={disabled}\n onClick={() => setPreset(WEEKDAYS_ONLY)}\n >\n {props.presetLabels.weekdays}\n </PresetButton>\n <PresetButton\n active={matches(WEEKEND_ONLY)}\n disabled={disabled}\n onClick={() => setPreset(WEEKEND_ONLY)}\n >\n {props.presetLabels.weekend}\n </PresetButton>\n <PresetButton\n active={matches(ALL_DAYS)}\n disabled={disabled}\n onClick={() => setPreset(ALL_DAYS)}\n >\n {props.presetLabels.everyDay}\n </PresetButton>\n </div>\n ) : null}\n <div role=\"group\" aria-label={daysAriaLabel} className=\"flex gap-1\">\n {WEEK_DAYS.map((day) => {\n const checked = selected.has(day)\n const label = dayLabels[day]\n const ariaLabel = dayAriaLabels?.[day] ?? label\n return (\n <button\n key={day}\n type=\"button\"\n role=\"checkbox\"\n aria-checked={checked}\n aria-label={ariaLabel}\n disabled={disabled}\n onClick={() => toggle(day)}\n className={cn(\n 'touch-target inline-flex h-9 flex-1 items-center justify-center rounded-full text-xs font-medium transition-colors focus-visible:ring-2 focus-visible:ring-offset-2 focus-visible:outline-hidden disabled:cursor-not-allowed disabled:opacity-50 motion-reduce:transition-none',\n checked\n ? 'bg-base-accent-solid text-accent-contrast hover:bg-spark-9'\n : 'bg-base-gray-soft text-gray-light hover:bg-gray-a4',\n )}\n >\n {label}\n </button>\n )\n })}\n </div>\n </div>\n )\n },\n)\n\nDayOfWeekPicker.displayName = 'DayOfWeekPicker'\n\ninterface PresetButtonProps {\n active: boolean\n disabled?: boolean\n onClick: () => void\n children: React.ReactNode\n}\n\nfunction PresetButton({\n active,\n children,\n disabled,\n onClick,\n}: PresetButtonProps) {\n return (\n <button\n type=\"button\"\n onClick={onClick}\n disabled={disabled}\n aria-pressed={active}\n className={cn(\n 'touch-target inline-flex h-7 items-center justify-center rounded-full px-3 text-xs font-medium transition-colors focus-visible:ring-2 focus-visible:ring-offset-2 focus-visible:outline-hidden disabled:cursor-not-allowed disabled:opacity-50 motion-reduce:transition-none',\n active\n ? 'bg-base-accent-soft text-accent'\n : 'bg-transparent text-gray-light hover:bg-gray-a3',\n )}\n >\n {children}\n </button>\n )\n}\n\nexport { DayOfWeekPicker }\n"],"mappings":";;;;;AAYA,MAAa,YAAgC;CAC3C;CACA;CACA;CACA;CACA;CACA;CACA;AACF;AAEA,MAAM,gBAA2B;CAC/B;CACA;CACA;CACA;CACA;AACF;AACA,MAAM,eAA0B,CAAC,YAAY,QAAQ;AACrD,MAAM,WAAsB,CAAC,GAAG,SAAS;AAgCzC,MAAM,kBAAkBA,QAAM,WAC5B,SAAS,gBAAgB,OAAO,KAAK;CACnC,MAAM,EACJ,WACA,UACA,eACA,cAAc,OACd,OACA,WACA,eACA,kBACE;CAEJ,MAAM,WAAWA,QAAM,cAAc,IAAI,IAAI,KAAK,GAAG,CAAC,KAAK,CAAC;CAE5D,MAAM,UAAU,QAAiB;EAC/B,MAAM,OAAO,IAAI,IAAI,QAAQ;EAC7B,IAAI,KAAK,IAAI,GAAG,GACd,KAAK,OAAO,GAAG;OAEf,KAAK,IAAI,GAAG;EAEd,cAAc,SAAS,QAAQ,MAAM,KAAK,IAAI,CAAC,CAAC,CAAC;CACnD;CAEA,MAAM,WAAW,WACf,SAAS,SAAS,OAAO,UAAU,OAAO,OAAO,MAAM,SAAS,IAAI,CAAC,CAAC;CAExE,MAAM,aAAa,WAAsB;EACvC,cAAc,MAAM;CACtB;CAEA,OACE,qBAAC,OAAD;EAAU;EAAK,WAAW,GAAG,uBAAuB,SAAS;YAA7D,CACG,eAAe,MAAM,cACpB,qBAAC,OAAD;GACE,MAAK;GACL,cAAY,MAAM;GAClB,WAAU;aAHZ;IAKE,oBAAC,cAAD;KACE,QAAQ,QAAQ,aAAa;KACnB;KACV,eAAe,UAAU,aAAa;eAErC,MAAM,aAAa;IACR,CAAA;IACd,oBAAC,cAAD;KACE,QAAQ,QAAQ,YAAY;KAClB;KACV,eAAe,UAAU,YAAY;eAEpC,MAAM,aAAa;IACR,CAAA;IACd,oBAAC,cAAD;KACE,QAAQ,QAAQ,QAAQ;KACd;KACV,eAAe,UAAU,QAAQ;eAEhC,MAAM,aAAa;IACR,CAAA;GACX;OACH,MACJ,oBAAC,OAAD;GAAK,MAAK;GAAQ,cAAY;GAAe,WAAU;aACpD,UAAU,KAAK,QAAQ;IACtB,MAAM,UAAU,SAAS,IAAI,GAAG;IAChC,MAAM,QAAQ,UAAU;IAExB,OACE,oBAAC,UAAD;KAEE,MAAK;KACL,MAAK;KACL,gBAAc;KACd,cAPc,gBAAgB,QAAQ;KAQ5B;KACV,eAAe,OAAO,GAAG;KACzB,WAAW,GACT,kRACA,UACI,+DACA,oDACN;eAEC;IACK,GAfD,GAeC;GAEZ,CAAC;EACE,CAAA,CACF;;AAET,CACF;AAEA,gBAAgB,cAAc;AAS9B,SAAS,aAAa,EACpB,QACA,UACA,UACA,WACoB;CACpB,OACE,oBAAC,UAAD;EACE,MAAK;EACI;EACC;EACV,gBAAc;EACd,WAAW,GACT,gRACA,SACI,oCACA,iDACN;EAEC;CACK,CAAA;AAEZ"}
|
|
@@ -2,9 +2,9 @@
|
|
|
2
2
|
Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
|
|
3
3
|
const require_chunk = require("../chunk-DY84GLCh.cjs");
|
|
4
4
|
const require_components_button = require("./button.cjs");
|
|
5
|
+
let _epilot_spark_icons = require("@epilot/spark-icons");
|
|
5
6
|
let react = require("react");
|
|
6
7
|
react = require_chunk.__toESM(react);
|
|
7
|
-
let _epilot_spark_icons = require("@epilot/spark-icons");
|
|
8
8
|
let react_jsx_runtime = require("react/jsx-runtime");
|
|
9
9
|
let _base_ui_react_dialog = require("@base-ui/react/dialog");
|
|
10
10
|
let cnfast = require("cnfast");
|
|
@@ -1,8 +1,8 @@
|
|
|
1
1
|
"use client";
|
|
2
2
|
import { cn } from "../utils/cn.js";
|
|
3
3
|
import { buttonVariants } from "./button.js";
|
|
4
|
-
import "react";
|
|
5
4
|
import { Close } from "@epilot/spark-icons";
|
|
5
|
+
import "react";
|
|
6
6
|
import { jsx } from "react/jsx-runtime";
|
|
7
7
|
import { Dialog as Dialog$1 } from "@base-ui/react/dialog";
|
|
8
8
|
//#region src/components/dialog.tsx
|
|
@@ -1,9 +1,9 @@
|
|
|
1
1
|
"use client";
|
|
2
2
|
Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
|
|
3
3
|
const require_chunk = require("../chunk-DY84GLCh.cjs");
|
|
4
|
+
let _epilot_spark_icons = require("@epilot/spark-icons");
|
|
4
5
|
let react = require("react");
|
|
5
6
|
react = require_chunk.__toESM(react);
|
|
6
|
-
let _epilot_spark_icons = require("@epilot/spark-icons");
|
|
7
7
|
let react_jsx_runtime = require("react/jsx-runtime");
|
|
8
8
|
let _base_ui_react_menu = require("@base-ui/react/menu");
|
|
9
9
|
let cnfast = require("cnfast");
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
"use client";
|
|
2
2
|
import { cn } from "../utils/cn.js";
|
|
3
|
-
import "react";
|
|
4
3
|
import { Check, ChevronRight } from "@epilot/spark-icons";
|
|
4
|
+
import "react";
|
|
5
5
|
import { jsx, jsxs } from "react/jsx-runtime";
|
|
6
6
|
import { Menu } from "@base-ui/react/menu";
|
|
7
7
|
//#region src/components/dropdown-menu.tsx
|