@eifi1/ui-kit 0.4.1 → 0.5.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/LICENSE +32 -0
- package/README.md +498 -57
- package/dist/chart.d.ts +10 -0
- package/dist/chart.js +10 -0
- package/dist/chart.js.map +1 -0
- package/dist/components/account-settings.d.ts +11 -0
- package/dist/components/account-settings.js +19 -12
- package/dist/components/account-settings.js.map +1 -1
- package/dist/components/alert-banner.d.ts +10 -6
- package/dist/components/alert-banner.js +20 -16
- package/dist/components/alert-banner.js.map +1 -1
- package/dist/components/amount-input.d.ts +30 -4
- package/dist/components/amount-input.js +36 -14
- package/dist/components/amount-input.js.map +1 -1
- package/dist/components/calculator.d.ts +24 -7
- package/dist/components/calculator.js +37 -20
- package/dist/components/calculator.js.map +1 -1
- package/dist/components/chart-zoom.d.ts +156 -0
- package/dist/components/chart-zoom.js +262 -0
- package/dist/components/chart-zoom.js.map +1 -0
- package/dist/components/chart.d.ts +28 -3
- package/dist/components/chart.js +71 -32
- package/dist/components/chart.js.map +1 -1
- package/dist/components/checkbox.d.ts +51 -0
- package/dist/components/checkbox.js +123 -0
- package/dist/components/checkbox.js.map +1 -0
- package/dist/components/chip.d.ts +128 -0
- package/dist/components/chip.js +357 -0
- package/dist/components/chip.js.map +1 -0
- package/dist/components/choice-parts.d.ts +24 -0
- package/dist/components/choice-parts.js +18 -0
- package/dist/components/choice-parts.js.map +1 -0
- package/dist/components/combobox-core.d.ts +52 -9
- package/dist/components/combobox-core.js +89 -19
- package/dist/components/combobox-core.js.map +1 -1
- package/dist/components/combobox.d.ts +43 -33
- package/dist/components/combobox.js +409 -340
- package/dist/components/combobox.js.map +1 -1
- package/dist/components/currency-select.d.ts +48 -8
- package/dist/components/currency-select.js +107 -65
- package/dist/components/currency-select.js.map +1 -1
- package/dist/components/data-table-filter-popover.d.ts +15 -3
- package/dist/components/data-table-filter-popover.js +23 -17
- package/dist/components/data-table-filter-popover.js.map +1 -1
- package/dist/components/data-table-filters.d.ts +1 -1
- package/dist/components/data-table-filters.js +3 -2
- package/dist/components/data-table-filters.js.map +1 -1
- package/dist/components/data-table-labels.d.ts +53 -2
- package/dist/components/data-table-labels.js +31 -2
- package/dist/components/data-table-labels.js.map +1 -1
- package/dist/components/data-table-pagination.d.ts +3 -1
- package/dist/components/data-table-pagination.js +16 -10
- package/dist/components/data-table-pagination.js.map +1 -1
- package/dist/components/data-table-sort.js +1 -0
- package/dist/components/data-table-sort.js.map +1 -1
- package/dist/components/data-table.d.ts +1 -1
- package/dist/components/data-table.js +201 -85
- package/dist/components/data-table.js.map +1 -1
- package/dist/components/date-picker.d.ts +25 -9
- package/dist/components/date-picker.js +232 -94
- package/dist/components/date-picker.js.map +1 -1
- package/dist/components/dropdown.d.ts +74 -19
- package/dist/components/dropdown.js +72 -22
- package/dist/components/dropdown.js.map +1 -1
- package/dist/components/entity-combobox.d.ts +5 -4
- package/dist/components/entity-combobox.js +107 -76
- package/dist/components/entity-combobox.js.map +1 -1
- package/dist/components/facing-pair.d.ts +36 -0
- package/dist/components/facing-pair.js +40 -0
- package/dist/components/facing-pair.js.map +1 -0
- package/dist/components/field-sync.d.ts +164 -0
- package/dist/components/field-sync.js +264 -0
- package/dist/components/field-sync.js.map +1 -0
- package/dist/components/file-dropzone.d.ts +21 -7
- package/dist/components/file-dropzone.js +28 -7
- package/dist/components/file-dropzone.js.map +1 -1
- package/dist/components/full-bleed-dialog.d.ts +37 -26
- package/dist/components/full-bleed-dialog.js +20 -5
- package/dist/components/full-bleed-dialog.js.map +1 -1
- package/dist/components/grouped-picker.d.ts +21 -10
- package/dist/components/grouped-picker.js +66 -52
- package/dist/components/grouped-picker.js.map +1 -1
- package/dist/components/hover-menu.d.ts +20 -4
- package/dist/components/hover-menu.js +15 -4
- package/dist/components/hover-menu.js.map +1 -1
- package/dist/components/mini-calendar.d.ts +102 -14
- package/dist/components/mini-calendar.js +256 -70
- package/dist/components/mini-calendar.js.map +1 -1
- package/dist/components/modal.d.ts +9 -3
- package/dist/components/modal.js +34 -45
- package/dist/components/modal.js.map +1 -1
- package/dist/components/month-picker.d.ts +79 -0
- package/dist/components/month-picker.js +342 -0
- package/dist/components/month-picker.js.map +1 -0
- package/dist/components/multi-entity-combobox.d.ts +7 -6
- package/dist/components/multi-entity-combobox.js +112 -72
- package/dist/components/multi-entity-combobox.js.map +1 -1
- package/dist/components/multi-select.d.ts +13 -11
- package/dist/components/multi-select.js +161 -84
- package/dist/components/multi-select.js.map +1 -1
- package/dist/components/number-field.d.ts +92 -0
- package/dist/components/number-field.js +111 -0
- package/dist/components/number-field.js.map +1 -0
- package/dist/components/number-input.d.ts +21 -2
- package/dist/components/number-input.js +2 -1
- package/dist/components/number-input.js.map +1 -1
- package/dist/components/numpad-sheet.d.ts +25 -4
- package/dist/components/numpad-sheet.js +30 -13
- package/dist/components/numpad-sheet.js.map +1 -1
- package/dist/components/page-contents.d.ts +90 -0
- package/dist/components/page-contents.js +170 -0
- package/dist/components/page-contents.js.map +1 -0
- package/dist/components/password-strength.d.ts +106 -0
- package/dist/components/password-strength.js +132 -0
- package/dist/components/password-strength.js.map +1 -0
- package/dist/components/picker-sheet.d.ts +23 -15
- package/dist/components/picker-sheet.js +34 -14
- package/dist/components/picker-sheet.js.map +1 -1
- package/dist/components/popover.d.ts +62 -4
- package/dist/components/popover.js +52 -2
- package/dist/components/popover.js.map +1 -1
- package/dist/components/search-field.d.ts +25 -7
- package/dist/components/search-field.js +7 -5
- package/dist/components/search-field.js.map +1 -1
- package/dist/components/series-chart-labels.d.ts +14 -0
- package/dist/components/series-chart-labels.js +11 -0
- package/dist/components/series-chart-labels.js.map +1 -0
- package/dist/components/series-chart.d.ts +207 -0
- package/dist/components/series-chart.js +223 -0
- package/dist/components/series-chart.js.map +1 -0
- package/dist/components/settings-fields.d.ts +14 -4
- package/dist/components/settings-fields.js +19 -8
- package/dist/components/settings-fields.js.map +1 -1
- package/dist/components/signature-pad.d.ts +119 -0
- package/dist/components/signature-pad.js +405 -0
- package/dist/components/signature-pad.js.map +1 -0
- package/dist/components/slider.d.ts +80 -0
- package/dist/components/slider.js +155 -0
- package/dist/components/slider.js.map +1 -0
- package/dist/components/sparkline.d.ts +93 -0
- package/dist/components/sparkline.js +205 -0
- package/dist/components/sparkline.js.map +1 -0
- package/dist/components/stat-tile.d.ts +151 -0
- package/dist/components/stat-tile.js +236 -0
- package/dist/components/stat-tile.js.map +1 -0
- package/dist/components/swipeable-row.d.ts +25 -2
- package/dist/components/swipeable-row.js +31 -0
- package/dist/components/swipeable-row.js.map +1 -1
- package/dist/components/switch.d.ts +60 -0
- package/dist/components/switch.js +81 -0
- package/dist/components/switch.js.map +1 -0
- package/dist/components/time-input.d.ts +58 -0
- package/dist/components/time-input.js +50 -0
- package/dist/components/time-input.js.map +1 -0
- package/dist/components/toggle-group.d.ts +18 -3
- package/dist/components/toggle-group.js +10 -6
- package/dist/components/toggle-group.js.map +1 -1
- package/dist/components/toggle-legend.d.ts +115 -0
- package/dist/components/toggle-legend.js +114 -0
- package/dist/components/toggle-legend.js.map +1 -0
- package/dist/components/tooltip.d.ts +40 -11
- package/dist/components/tooltip.js +77 -20
- package/dist/components/tooltip.js.map +1 -1
- package/dist/components/treemap.d.ts +132 -0
- package/dist/components/treemap.js +179 -0
- package/dist/components/treemap.js.map +1 -0
- package/dist/components/ui.d.ts +159 -46
- package/dist/components/ui.js +220 -115
- package/dist/components/ui.js.map +1 -1
- package/dist/components/use-mobile-reveal.js +1 -0
- package/dist/components/use-mobile-reveal.js.map +1 -1
- package/dist/components/use-table-state.d.ts +1 -1
- package/dist/components/use-table-state.js +38 -17
- package/dist/components/use-table-state.js.map +1 -1
- package/dist/components/user-avatar.d.ts +5 -3
- package/dist/components/user-avatar.js +4 -2
- package/dist/components/user-avatar.js.map +1 -1
- package/dist/components/wizard-stepper.js +3 -2
- package/dist/components/wizard-stepper.js.map +1 -1
- package/dist/{data-table-filters-aXyf0Xub.d.ts → data-table-filters-DM1auUfH.d.ts} +27 -5
- package/dist/data-table.d.ts +7 -0
- package/dist/data-table.js +12 -0
- package/dist/data-table.js.map +1 -0
- package/dist/feedback/feedback-attachment.js +12 -11
- package/dist/feedback/feedback-attachment.js.map +1 -1
- package/dist/feedback/feedback-dialog.js +2 -1
- package/dist/feedback/feedback-dialog.js.map +1 -1
- package/dist/feedback/feedback-inbox.d.ts +33 -7
- package/dist/feedback/feedback-inbox.js +49 -37
- package/dist/feedback/feedback-inbox.js.map +1 -1
- package/dist/feedback.d.ts +5 -0
- package/dist/feedback.js +5 -0
- package/dist/feedback.js.map +1 -0
- package/dist/hooks/use-anchored-panel.js +1 -0
- package/dist/hooks/use-anchored-panel.js.map +1 -1
- package/dist/hooks/use-anchored-rect.js +1 -0
- package/dist/hooks/use-anchored-rect.js.map +1 -1
- package/dist/hooks/use-announce.d.ts +46 -0
- package/dist/hooks/use-announce.js +37 -0
- package/dist/hooks/use-announce.js.map +1 -0
- package/dist/hooks/use-body-scroll-lock.js +1 -0
- package/dist/hooks/use-body-scroll-lock.js.map +1 -1
- package/dist/hooks/use-close-transition.js +1 -0
- package/dist/hooks/use-close-transition.js.map +1 -1
- package/dist/hooks/use-dismiss.js +1 -0
- package/dist/hooks/use-dismiss.js.map +1 -1
- package/dist/hooks/use-focus-trap.d.ts +16 -0
- package/dist/hooks/use-focus-trap.js +67 -0
- package/dist/hooks/use-focus-trap.js.map +1 -0
- package/dist/hooks/use-media-query.js +1 -0
- package/dist/hooks/use-media-query.js.map +1 -1
- package/dist/hooks/use-overlay-history.js +27 -1
- package/dist/hooks/use-overlay-history.js.map +1 -1
- package/dist/hooks/use-row-swipe.js +1 -0
- package/dist/hooks/use-row-swipe.js.map +1 -1
- package/dist/i18n/defaults.d.ts +31 -0
- package/dist/i18n/defaults.js +63 -0
- package/dist/i18n/defaults.js.map +1 -0
- package/dist/i18n/kit-labels.d.ts +250 -0
- package/dist/i18n/kit-labels.js +184 -0
- package/dist/i18n/kit-labels.js.map +1 -0
- package/dist/index.d.ts +47 -22
- package/dist/index.js +28 -0
- package/dist/index.js.map +1 -1
- package/dist/lib/calc.js +1 -0
- package/dist/lib/calc.js.map +1 -1
- package/dist/lib/cn.js +1 -0
- package/dist/lib/cn.js.map +1 -1
- package/dist/lib/dates.js +1 -0
- package/dist/lib/dates.js.map +1 -1
- package/dist/lib/logger.js +1 -0
- package/dist/lib/logger.js.map +1 -1
- package/dist/lib/safe-storage.js +1 -0
- package/dist/lib/safe-storage.js.map +1 -1
- package/dist/search/command-palette.d.ts +11 -1
- package/dist/search/command-palette.js +21 -15
- package/dist/search/command-palette.js.map +1 -1
- package/dist/search.d.ts +2 -0
- package/dist/search.js +3 -0
- package/dist/search.js.map +1 -0
- package/dist/shell/app-shell.d.ts +33 -4
- package/dist/shell/app-shell.js +275 -78
- package/dist/shell/app-shell.js.map +1 -1
- package/dist/shell/option-switcher-menu.js +3 -2
- package/dist/shell/option-switcher-menu.js.map +1 -1
- package/dist/shell/role-switcher.d.ts +6 -0
- package/dist/shell/role-switcher.js +7 -4
- package/dist/shell/role-switcher.js.map +1 -1
- package/dist/shell/top-bar.d.ts +15 -7
- package/dist/shell/top-bar.js +3 -5
- package/dist/shell/top-bar.js.map +1 -1
- package/dist/shell/topbar-action-menu.js +3 -2
- package/dist/shell/topbar-action-menu.js.map +1 -1
- package/dist/shell/topbar-controls.d.ts +5 -2
- package/dist/shell/topbar-controls.js +20 -15
- package/dist/shell/topbar-controls.js.map +1 -1
- package/dist/shell.d.ts +13 -0
- package/dist/shell.js +8 -0
- package/dist/shell.js.map +1 -0
- package/dist/theme/chart-palette.d.ts +19 -12
- package/dist/theme/chart-palette.js +24 -30
- package/dist/theme/chart-palette.js.map +1 -1
- package/dist/theme/color.d.ts +78 -0
- package/dist/theme/color.js +148 -0
- package/dist/theme/color.js.map +1 -0
- package/dist/theme/palette-derive.d.ts +140 -0
- package/dist/theme/palette-derive.js +376 -0
- package/dist/theme/palette-derive.js.map +1 -0
- package/dist/theme/palette-presets.d.ts +14 -1
- package/dist/theme/palette-presets.js +231 -3
- package/dist/theme/palette-presets.js.map +1 -1
- package/dist/theme/palette-store.js +1 -0
- package/dist/theme/palette-store.js.map +1 -1
- package/dist/theme/theme-store.js +1 -0
- package/dist/theme/theme-store.js.map +1 -1
- package/dist/tour/tour.d.ts +2 -1
- package/dist/tour/tour.js +15 -9
- package/dist/tour/tour.js.map +1 -1
- package/dist/tour.d.ts +2 -0
- package/dist/tour.js +3 -0
- package/dist/tour.js.map +1 -0
- package/dist/wizard/stepper-nav.js +10 -8
- package/dist/wizard/stepper-nav.js.map +1 -1
- package/dist/wizard/types.d.ts +18 -2
- package/dist/wizard/types.js +4 -1
- package/dist/wizard/types.js.map +1 -1
- package/dist/wizard/use-wizard.js +12 -4
- package/dist/wizard/use-wizard.js.map +1 -1
- package/dist/wizard/validation.js +1 -0
- package/dist/wizard/validation.js.map +1 -1
- package/dist/wizard/wizard-context.js +1 -0
- package/dist/wizard/wizard-context.js.map +1 -1
- package/dist/wizard/wizard-step.js +1 -0
- package/dist/wizard/wizard-step.js.map +1 -1
- package/dist/wizard/wizard-summary.js +5 -3
- package/dist/wizard/wizard-summary.js.map +1 -1
- package/dist/wizard.d.ts +8 -0
- package/dist/wizard.js +9 -0
- package/dist/wizard.js.map +1 -0
- package/package.json +66 -13
- package/src/chart.ts +22 -0
- package/src/components/account-settings.tsx +275 -0
- package/src/components/alert-banner.tsx +75 -0
- package/src/components/amount-input.tsx +471 -0
- package/src/components/calculator.tsx +252 -0
- package/src/components/chart-zoom.tsx +499 -0
- package/src/components/chart.tsx +363 -0
- package/src/components/checkbox.tsx +222 -0
- package/src/components/chip.tsx +570 -0
- package/src/components/choice-parts.ts +33 -0
- package/src/components/combobox-core.tsx +540 -0
- package/src/components/combobox.tsx +1026 -0
- package/src/components/currency-select.tsx +269 -0
- package/src/components/data-table-filter-popover.tsx +252 -0
- package/src/components/data-table-filters.ts +176 -0
- package/src/components/data-table-labels.ts +190 -0
- package/src/components/data-table-pagination.tsx +126 -0
- package/src/components/data-table-sort.ts +70 -0
- package/src/components/data-table.tsx +1740 -0
- package/src/components/date-picker.tsx +631 -0
- package/src/components/dropdown.tsx +341 -0
- package/src/components/entity-combobox.tsx +215 -0
- package/src/components/facing-pair.ts +86 -0
- package/src/components/field-sync.tsx +472 -0
- package/src/components/file-dropzone.tsx +181 -0
- package/src/components/full-bleed-dialog.tsx +179 -0
- package/src/components/grouped-picker.tsx +157 -0
- package/src/components/hover-menu.tsx +183 -0
- package/src/components/mini-calendar.tsx +554 -0
- package/src/components/modal.tsx +287 -0
- package/src/components/month-picker.tsx +549 -0
- package/src/components/multi-entity-combobox.tsx +226 -0
- package/src/components/multi-select.tsx +303 -0
- package/src/components/number-field.tsx +225 -0
- package/src/components/number-input.tsx +211 -0
- package/src/components/numpad-sheet.tsx +264 -0
- package/src/components/page-contents.tsx +289 -0
- package/src/components/password-strength.tsx +258 -0
- package/src/components/picker-sheet.tsx +251 -0
- package/src/components/popover.tsx +195 -0
- package/src/components/search-field.tsx +146 -0
- package/src/components/series-chart-labels.ts +26 -0
- package/src/components/series-chart.tsx +481 -0
- package/src/components/settings-fields.tsx +68 -0
- package/src/components/signature-pad.tsx +630 -0
- package/src/components/slider.tsx +313 -0
- package/src/components/sparkline.tsx +329 -0
- package/src/components/stat-tile.tsx +448 -0
- package/src/components/swipeable-row.tsx +271 -0
- package/src/components/switch.tsx +170 -0
- package/src/components/time-input.tsx +107 -0
- package/src/components/toggle-group.tsx +153 -0
- package/src/components/toggle-legend.tsx +229 -0
- package/src/components/tooltip.tsx +477 -0
- package/src/components/treemap.tsx +390 -0
- package/src/components/ui.tsx +1284 -0
- package/src/components/use-mobile-reveal.ts +54 -0
- package/src/components/use-table-state.ts +295 -0
- package/src/components/user-avatar.tsx +61 -0
- package/src/components/wizard-stepper.tsx +37 -0
- package/src/data-table.ts +19 -0
- package/src/feedback/feedback-attachment.tsx +246 -0
- package/src/feedback/feedback-dialog.tsx +209 -0
- package/src/feedback/feedback-inbox.tsx +615 -0
- package/src/feedback.ts +8 -0
- package/src/hooks/use-anchored-panel.ts +169 -0
- package/src/hooks/use-anchored-rect.ts +78 -0
- package/src/hooks/use-announce.ts +85 -0
- package/src/hooks/use-body-scroll-lock.ts +94 -0
- package/src/hooks/use-close-transition.ts +99 -0
- package/src/hooks/use-dismiss.ts +77 -0
- package/src/hooks/use-focus-trap.ts +160 -0
- package/src/hooks/use-media-query.ts +23 -0
- package/src/hooks/use-overlay-history.ts +345 -0
- package/src/hooks/use-row-swipe.ts +212 -0
- package/src/i18n/defaults.ts +68 -0
- package/src/i18n/kit-labels.tsx +447 -0
- package/src/index.ts +169 -0
- package/src/lib/calc.ts +309 -0
- package/src/lib/cn.ts +5 -0
- package/src/lib/dates.ts +187 -0
- package/src/lib/logger.ts +73 -0
- package/src/lib/safe-storage.ts +37 -0
- package/src/search/command-palette.tsx +342 -0
- package/src/search.ts +3 -0
- package/src/shell/app-shell.tsx +772 -0
- package/src/shell/option-switcher-menu.tsx +72 -0
- package/src/shell/role-switcher.tsx +46 -0
- package/src/shell/top-bar.tsx +39 -0
- package/src/shell/topbar-action-menu.tsx +91 -0
- package/src/shell/topbar-controls.tsx +229 -0
- package/src/shell.ts +10 -0
- package/src/theme/chart-palette.ts +145 -0
- package/src/theme/color.ts +266 -0
- package/src/theme/palette-derive.ts +681 -0
- package/src/theme/palette-presets.ts +760 -0
- package/src/theme/palette-store.ts +94 -0
- package/src/theme/theme-store.ts +145 -0
- package/src/tour/tour.tsx +586 -0
- package/src/tour.ts +3 -0
- package/src/vite-env.d.ts +26 -0
- package/src/wizard/stepper-nav.tsx +221 -0
- package/src/wizard/types.ts +178 -0
- package/src/wizard/use-wizard.ts +345 -0
- package/src/wizard/validation.ts +37 -0
- package/src/wizard/wizard-context.tsx +29 -0
- package/src/wizard/wizard-step.tsx +14 -0
- package/src/wizard/wizard-summary.tsx +69 -0
- package/src/wizard.ts +14 -0
- package/tokens.css +222 -20
|
@@ -0,0 +1,376 @@
|
|
|
1
|
+
"use client";
|
|
2
|
+
import {
|
|
3
|
+
contrast,
|
|
4
|
+
deltaE,
|
|
5
|
+
toHex,
|
|
6
|
+
hexToOklch,
|
|
7
|
+
oklchToHex,
|
|
8
|
+
parseHex,
|
|
9
|
+
rgbToOklch,
|
|
10
|
+
simulateCvd,
|
|
11
|
+
solveLightness
|
|
12
|
+
} from "./color.js";
|
|
13
|
+
const HUE_HOME = {
|
|
14
|
+
danger: { hue: 27, slack: 14 },
|
|
15
|
+
warning: { hue: 75, slack: 16 },
|
|
16
|
+
success: { hue: 150, slack: 20 },
|
|
17
|
+
info: { hue: 240, slack: 22 }
|
|
18
|
+
};
|
|
19
|
+
function hueGap(a, b) {
|
|
20
|
+
const d = Math.abs((a - b) % 360 + 360) % 360;
|
|
21
|
+
return d > 180 ? 360 - d : d;
|
|
22
|
+
}
|
|
23
|
+
function placeHue(home, slack, taken) {
|
|
24
|
+
let best = home;
|
|
25
|
+
let bestGap = Math.min(...taken.map((t) => hueGap(home, t)), 360);
|
|
26
|
+
for (let d = -slack; d <= slack; d += 2) {
|
|
27
|
+
const h = (home + d + 360) % 360;
|
|
28
|
+
const gap = Math.min(...taken.map((t) => hueGap(h, t)), 360);
|
|
29
|
+
if (gap > bestGap + 1e-9) {
|
|
30
|
+
best = h;
|
|
31
|
+
bestGap = gap;
|
|
32
|
+
}
|
|
33
|
+
}
|
|
34
|
+
return best;
|
|
35
|
+
}
|
|
36
|
+
const SURFACE_L = {
|
|
37
|
+
// Light: the PAGE is slightly darker than the cards on it, so a card reads as raised
|
|
38
|
+
// without needing a shadow to say so. Matches the shipped presets' relationship.
|
|
39
|
+
light: { page: 0.912, surface: 0.945, surface2: 0.929 },
|
|
40
|
+
dark: { page: 0.158, surface: 0.206, surface2: 0.249 }
|
|
41
|
+
};
|
|
42
|
+
const BORDER_CONTRAST = 1.5;
|
|
43
|
+
const MAX_SURFACE_CHROMA = 0.034;
|
|
44
|
+
function surfaceSet(hue, mode, tint) {
|
|
45
|
+
const c = MAX_SURFACE_CHROMA * Math.max(0, Math.min(1, tint));
|
|
46
|
+
const L = SURFACE_L[mode];
|
|
47
|
+
const bgPage = oklchToHex({ l: L.page, c, h: hue });
|
|
48
|
+
const bgSurface = oklchToHex({ l: L.surface, c, h: hue });
|
|
49
|
+
const bgSurface2 = oklchToHex({ l: L.surface2, c, h: hue });
|
|
50
|
+
const borderChroma = c * 1.6;
|
|
51
|
+
const hardest = [bgPage, bgSurface, bgSurface2].reduce(
|
|
52
|
+
(a, b) => contrast(a, mode === "light" ? "#000000" : "#ffffff") < contrast(b, mode === "light" ? "#000000" : "#ffffff") ? a : b
|
|
53
|
+
);
|
|
54
|
+
const borderL = solveLightness(
|
|
55
|
+
BORDER_CONTRAST,
|
|
56
|
+
parseHex(hardest),
|
|
57
|
+
hue,
|
|
58
|
+
borderChroma,
|
|
59
|
+
mode === "light" ? "darker" : "lighter"
|
|
60
|
+
);
|
|
61
|
+
return {
|
|
62
|
+
bgPage,
|
|
63
|
+
bgSurface,
|
|
64
|
+
bgSurface2,
|
|
65
|
+
border: oklchToHex({ l: borderL, c: borderChroma, h: hue })
|
|
66
|
+
};
|
|
67
|
+
}
|
|
68
|
+
function solveAgainst(hue, chroma, target, against, mode) {
|
|
69
|
+
const bg = parseHex(against);
|
|
70
|
+
const l = solveLightness(target, bg, hue, chroma, mode === "light" ? "darker" : "lighter");
|
|
71
|
+
return oklchToHex({ l, c: chroma, h: hue });
|
|
72
|
+
}
|
|
73
|
+
function contrastOn(fill) {
|
|
74
|
+
const light = "#ffffff";
|
|
75
|
+
const dark = "#12100e";
|
|
76
|
+
return contrast(fill, light) >= contrast(fill, dark) ? light : dark;
|
|
77
|
+
}
|
|
78
|
+
function tintOn(hue, chroma, surface, mode) {
|
|
79
|
+
const s = hexToOklch(surface);
|
|
80
|
+
const l = mode === "light" ? s.l - 0.055 : s.l + 0.055;
|
|
81
|
+
return oklchToHex({ l, c: Math.min(chroma * 0.45, 0.06), h: hue });
|
|
82
|
+
}
|
|
83
|
+
function derivePalette({
|
|
84
|
+
anchors,
|
|
85
|
+
mode,
|
|
86
|
+
surfaceTint = 0.55,
|
|
87
|
+
textContrast
|
|
88
|
+
}) {
|
|
89
|
+
const warnings = [];
|
|
90
|
+
const brand = hexToOklch(anchors.brand);
|
|
91
|
+
if (!brand) {
|
|
92
|
+
throw new Error(
|
|
93
|
+
`derivePalette: brand "${anchors.brand}" is not a #rgb or #rrggbb colour. Anchors must be hex \u2014 a named colour or an rgba() string cannot be converted.`
|
|
94
|
+
);
|
|
95
|
+
}
|
|
96
|
+
const targets = { primary: 10, secondary: 7, muted: 4.6, ...textContrast };
|
|
97
|
+
const surfaces = surfaceSet(brand.h, mode, surfaceTint);
|
|
98
|
+
const worstSurface = [surfaces.bgPage, surfaces.bgSurface, surfaces.bgSurface2].reduce(
|
|
99
|
+
(a, b) => contrast(a, mode === "light" ? "#000000" : "#ffffff") < contrast(b, mode === "light" ? "#000000" : "#ffffff") ? a : b
|
|
100
|
+
);
|
|
101
|
+
const textChroma = 0.014;
|
|
102
|
+
const textPrimary = solveAgainst(brand.h, textChroma, targets.primary, worstSurface, mode);
|
|
103
|
+
const textSecondary = solveAgainst(brand.h, textChroma, targets.secondary, worstSurface, mode);
|
|
104
|
+
const textMuted = solveAgainst(brand.h, textChroma, targets.muted, worstSurface, mode);
|
|
105
|
+
const brandChroma = Math.max(brand.c, 0.06);
|
|
106
|
+
const brandRatio = contrast(anchors.brand, worstSurface);
|
|
107
|
+
const brandHex = brandRatio >= 3 ? toHex(parseHex(anchors.brand)) : solveAgainst(brand.h, brandChroma, 3, worstSurface, mode);
|
|
108
|
+
if (brandRatio < 3) {
|
|
109
|
+
warnings.push(
|
|
110
|
+
`brand ${anchors.brand} sits at ${brandRatio.toFixed(2)}:1 against the ${mode} surfaces, below the 3:1 WCAG 1.4.11 asks of a control boundary. Lightness was adjusted to ${brandHex}; hue and chroma are unchanged.`
|
|
111
|
+
);
|
|
112
|
+
}
|
|
113
|
+
const brandLch = hexToOklch(brandHex);
|
|
114
|
+
const brandHover = oklchToHex({
|
|
115
|
+
...brandLch,
|
|
116
|
+
// Hover moves AWAY from the page in both themes: darker on light, lighter on dark.
|
|
117
|
+
l: mode === "light" ? brandLch.l - 0.06 : brandLch.l + 0.06
|
|
118
|
+
});
|
|
119
|
+
const brandContrast = contrastOn(brandHex);
|
|
120
|
+
const onBrand = contrast(brandHex, brandContrast);
|
|
121
|
+
if (onBrand < 4.5) {
|
|
122
|
+
warnings.push(
|
|
123
|
+
`text on the brand fill reaches only ${onBrand.toFixed(2)}:1 (needs 4.5:1). A mid-lightness, high-chroma brand cannot carry legible text at any ink; use it as an accent and keep primary buttons on a darker or lighter variant.`
|
|
124
|
+
);
|
|
125
|
+
}
|
|
126
|
+
const taken = [brandLch.h];
|
|
127
|
+
const accentLch = anchors.accent ? hexToOklch(anchors.accent) : null;
|
|
128
|
+
if (anchors.accent && !accentLch) {
|
|
129
|
+
warnings.push(`accent "${anchors.accent}" is not a hex colour and was ignored.`);
|
|
130
|
+
}
|
|
131
|
+
if (accentLch) taken.push(accentLch.h);
|
|
132
|
+
const semanticHue = {};
|
|
133
|
+
const semanticChroma = {};
|
|
134
|
+
for (const role of ["danger", "warning", "success", "info"]) {
|
|
135
|
+
const pinned = anchors[role] ? hexToOklch(anchors[role]) : null;
|
|
136
|
+
if (anchors[role] && !pinned) {
|
|
137
|
+
warnings.push(`${role} "${anchors[role]}" is not a hex colour and was ignored.`);
|
|
138
|
+
}
|
|
139
|
+
const home = HUE_HOME[role];
|
|
140
|
+
const hue = pinned ? pinned.h : placeHue(home.hue, home.slack, taken);
|
|
141
|
+
if (!pinned) {
|
|
142
|
+
const gap = Math.min(...taken.map((t) => hueGap(hue, t)));
|
|
143
|
+
if (gap < 20) {
|
|
144
|
+
warnings.push(
|
|
145
|
+
`${role} could only reach ${gap.toFixed(0)}\xB0 from the nearest pinned hue, which is too close to tell apart at a glance. Pin ${role} explicitly, or move the brand.`
|
|
146
|
+
);
|
|
147
|
+
}
|
|
148
|
+
}
|
|
149
|
+
semanticHue[role] = hue;
|
|
150
|
+
semanticChroma[role] = pinned ? Math.max(pinned.c, 0.08) : 0.13;
|
|
151
|
+
taken.push(hue);
|
|
152
|
+
}
|
|
153
|
+
const sem = (role) => {
|
|
154
|
+
const hue = semanticHue[role];
|
|
155
|
+
const chroma = semanticChroma[role];
|
|
156
|
+
const bg = tintOn(hue, chroma, surfaces.bgSurface, mode);
|
|
157
|
+
const onSurface = solveLightness(
|
|
158
|
+
4.5,
|
|
159
|
+
parseHex(worstSurface),
|
|
160
|
+
hue,
|
|
161
|
+
chroma,
|
|
162
|
+
mode === "light" ? "darker" : "lighter"
|
|
163
|
+
);
|
|
164
|
+
const onTint = solveLightness(
|
|
165
|
+
4.5,
|
|
166
|
+
parseHex(bg),
|
|
167
|
+
hue,
|
|
168
|
+
chroma,
|
|
169
|
+
mode === "light" ? "darker" : "lighter"
|
|
170
|
+
);
|
|
171
|
+
const l = mode === "light" ? Math.min(onSurface, onTint) : Math.max(onSurface, onTint);
|
|
172
|
+
return oklchToHex({ l, c: chroma, h: hue });
|
|
173
|
+
};
|
|
174
|
+
const danger = sem("danger");
|
|
175
|
+
const dangerLch = hexToOklch(danger);
|
|
176
|
+
const semantic = {
|
|
177
|
+
danger,
|
|
178
|
+
dangerHover: oklchToHex({
|
|
179
|
+
...dangerLch,
|
|
180
|
+
l: mode === "light" ? dangerLch.l - 0.06 : dangerLch.l + 0.06
|
|
181
|
+
}),
|
|
182
|
+
dangerContrast: contrastOn(danger),
|
|
183
|
+
dangerBorder: oklchToHex({
|
|
184
|
+
l: mode === "light" ? dangerLch.l + 0.22 : dangerLch.l - 0.22,
|
|
185
|
+
c: semanticChroma.danger,
|
|
186
|
+
h: semanticHue.danger
|
|
187
|
+
}),
|
|
188
|
+
dangerBg: tintOn(semanticHue.danger, semanticChroma.danger, surfaces.bgSurface, mode),
|
|
189
|
+
warning: sem("warning"),
|
|
190
|
+
warningBorder: oklchToHex({
|
|
191
|
+
l: mode === "light" ? 0.82 : 0.44,
|
|
192
|
+
c: semanticChroma.warning,
|
|
193
|
+
h: semanticHue.warning
|
|
194
|
+
}),
|
|
195
|
+
warningBg: tintOn(semanticHue.warning, semanticChroma.warning, surfaces.bgSurface, mode),
|
|
196
|
+
info: sem("info"),
|
|
197
|
+
infoBorder: oklchToHex({
|
|
198
|
+
l: mode === "light" ? 0.8 : 0.45,
|
|
199
|
+
c: semanticChroma.info,
|
|
200
|
+
h: semanticHue.info
|
|
201
|
+
}),
|
|
202
|
+
infoBg: tintOn(semanticHue.info, semanticChroma.info, surfaces.bgSurface, mode),
|
|
203
|
+
success: sem("success"),
|
|
204
|
+
successBorder: oklchToHex({
|
|
205
|
+
l: mode === "light" ? 0.81 : 0.45,
|
|
206
|
+
c: semanticChroma.success,
|
|
207
|
+
h: semanticHue.success
|
|
208
|
+
}),
|
|
209
|
+
successBg: tintOn(semanticHue.success, semanticChroma.success, surfaces.bgSurface, mode)
|
|
210
|
+
};
|
|
211
|
+
if (accentLch) {
|
|
212
|
+
const accent = solveAgainst(accentLch.h, Math.max(accentLch.c, 0.06), 3, worstSurface, mode);
|
|
213
|
+
semantic.accent = accent;
|
|
214
|
+
semantic.accentContrast = contrastOn(accent);
|
|
215
|
+
semantic.accentBg = tintOn(accentLch.h, Math.max(accentLch.c, 0.06), surfaces.bgSurface, mode);
|
|
216
|
+
}
|
|
217
|
+
const money = (hue, target) => solveAgainst(hue, 0.12, target, worstSurface, mode);
|
|
218
|
+
const moneyIncome = money(175, 4.5);
|
|
219
|
+
const moneyExpense = money(70, 4.5);
|
|
220
|
+
const moneyNet = money(300, 4.5);
|
|
221
|
+
const moneyNeutral = oklchToHex({ l: mode === "light" ? 0.52 : 0.72, c: 0.012, h: brand.h });
|
|
222
|
+
const tokens = {
|
|
223
|
+
...surfaces,
|
|
224
|
+
textPrimary,
|
|
225
|
+
textSecondary,
|
|
226
|
+
textMuted,
|
|
227
|
+
brand: brandHex,
|
|
228
|
+
brandHover,
|
|
229
|
+
brandContrast,
|
|
230
|
+
moneyIncome,
|
|
231
|
+
moneyExpense,
|
|
232
|
+
moneyNet,
|
|
233
|
+
moneyNeutral,
|
|
234
|
+
// Left alone. See the note at the top of this file about why the categorical ramp is
|
|
235
|
+
// not derived from the brand unless the caller asks.
|
|
236
|
+
//
|
|
237
|
+
// ⚠️ EMPTY, not absent: a caller who hands this straight to `applyTokenSet` keeps
|
|
238
|
+
// whatever `--chart-1…9` were already on the element. That is deliberate — the ramp
|
|
239
|
+
// is a separate decision and clearing it would leave charts unpainted — but it means
|
|
240
|
+
// a derived palette applied over another preset is a MIX until you also supply a
|
|
241
|
+
// ramp. `deriveChartRamp` is how you supply one.
|
|
242
|
+
chart: [],
|
|
243
|
+
heat: deriveHeat(moneyIncome, moneyExpense, surfaces, mode)
|
|
244
|
+
};
|
|
245
|
+
return { tokens, semantic, audit: auditPalette(tokens, semantic), warnings };
|
|
246
|
+
}
|
|
247
|
+
function deriveHeat(income, expense, surfaces, mode) {
|
|
248
|
+
const exp = hexToOklch(expense);
|
|
249
|
+
return {
|
|
250
|
+
neutral: surfaces.bgSurface2,
|
|
251
|
+
under: income,
|
|
252
|
+
over: expense,
|
|
253
|
+
seqLow: oklchToHex({ l: mode === "light" ? 0.93 : 0.26, c: 0.05, h: exp.h }),
|
|
254
|
+
seqHigh: expense,
|
|
255
|
+
empty: mode === "light" ? "rgba(120,110,95,0.14)" : "rgba(160,170,190,0.10)"
|
|
256
|
+
};
|
|
257
|
+
}
|
|
258
|
+
function auditPalette(t, semantic) {
|
|
259
|
+
const checks = [];
|
|
260
|
+
const surfaces = [
|
|
261
|
+
["bgPage", t.bgPage],
|
|
262
|
+
["bgSurface", t.bgSurface],
|
|
263
|
+
["bgSurface2", t.bgSurface2]
|
|
264
|
+
];
|
|
265
|
+
const add = (pair, fg, bg, required, rule) => {
|
|
266
|
+
const ratio = contrast(fg, bg);
|
|
267
|
+
checks.push({ pair, ratio, required, rule, passes: ratio >= required - 0.05 });
|
|
268
|
+
};
|
|
269
|
+
for (const [name, bg] of surfaces) {
|
|
270
|
+
add(`textPrimary on ${name}`, t.textPrimary, bg, 7, "WCAG 1.4.6 AAA body text");
|
|
271
|
+
add(`textSecondary on ${name}`, t.textSecondary, bg, 4.5, "WCAG 1.4.3 AA body text");
|
|
272
|
+
add(`textMuted on ${name}`, t.textMuted, bg, 4.5, "WCAG 1.4.3 AA body text");
|
|
273
|
+
add(`brand on ${name}`, t.brand, bg, 3, "WCAG 1.4.11 graphical object");
|
|
274
|
+
add(`border on ${name}`, t.border, bg, 1.1, "house rule: a hairline must be findable");
|
|
275
|
+
for (const [key, hex] of [
|
|
276
|
+
["moneyIncome", t.moneyIncome],
|
|
277
|
+
["moneyExpense", t.moneyExpense],
|
|
278
|
+
["moneyNet", t.moneyNet]
|
|
279
|
+
]) {
|
|
280
|
+
add(`${key} on ${name}`, hex, bg, 4.5, "WCAG 1.4.3 \u2014 these are rendered as TEXT");
|
|
281
|
+
}
|
|
282
|
+
}
|
|
283
|
+
add("brandContrast on brand", t.brandContrast, t.brand, 4.5, "WCAG 1.4.3 AA body text");
|
|
284
|
+
if (semantic) {
|
|
285
|
+
for (const [name, fg] of [
|
|
286
|
+
["danger", semantic.danger],
|
|
287
|
+
["warning", semantic.warning],
|
|
288
|
+
["info", semantic.info],
|
|
289
|
+
["success", semantic.success]
|
|
290
|
+
]) {
|
|
291
|
+
add(`${name} on bgSurface`, fg, t.bgSurface, 4.5, "WCAG 1.4.3 \u2014 rendered as text");
|
|
292
|
+
}
|
|
293
|
+
add("danger on dangerBg", semantic.danger, semantic.dangerBg, 4.5, "WCAG 1.4.3 \u2014 badge text");
|
|
294
|
+
add("warning on warningBg", semantic.warning, semantic.warningBg, 4.5, "WCAG 1.4.3 \u2014 badge text");
|
|
295
|
+
add("info on infoBg", semantic.info, semantic.infoBg, 4.5, "WCAG 1.4.3 \u2014 badge text");
|
|
296
|
+
add("success on successBg", semantic.success, semantic.successBg, 4.5, "WCAG 1.4.3 \u2014 badge text");
|
|
297
|
+
add(
|
|
298
|
+
"dangerContrast on danger",
|
|
299
|
+
semantic.dangerContrast,
|
|
300
|
+
semantic.danger,
|
|
301
|
+
4.5,
|
|
302
|
+
"WCAG 1.4.3 AA body text"
|
|
303
|
+
);
|
|
304
|
+
}
|
|
305
|
+
const failures = checks.filter((c) => !c.passes);
|
|
306
|
+
return { checks, failures, passes: failures.length === 0 };
|
|
307
|
+
}
|
|
308
|
+
const MIN_SEPARATION = 0.05;
|
|
309
|
+
const SINGLE_LIGHTNESS_MAX_SERIES = 4;
|
|
310
|
+
function deriveChartRamp(brandHex, mode, surfaces, count = 9) {
|
|
311
|
+
const brand = hexToOklch(brandHex) ?? { l: 0.6, c: 0.12, h: 264 };
|
|
312
|
+
const base = mode === "light" ? 0.58 : 0.74;
|
|
313
|
+
const c = Math.max(0.09, Math.min(brand.c, 0.15));
|
|
314
|
+
const vary = count > SINGLE_LIGHTNESS_MAX_SERIES;
|
|
315
|
+
const offsets = [0, mode === "light" ? -0.1 : 0.1, mode === "light" ? 0.08 : -0.08];
|
|
316
|
+
const colors = Array.from(
|
|
317
|
+
{ length: count },
|
|
318
|
+
(_, i) => oklchToHex({
|
|
319
|
+
l: vary ? base + offsets[i % offsets.length] : base,
|
|
320
|
+
c,
|
|
321
|
+
h: (brand.h + 360 / count * i) % 360
|
|
322
|
+
})
|
|
323
|
+
);
|
|
324
|
+
return measureRamp(colors, surfaces);
|
|
325
|
+
}
|
|
326
|
+
function auditChartRamp(colors, surfaces) {
|
|
327
|
+
return measureRamp(colors, surfaces);
|
|
328
|
+
}
|
|
329
|
+
function measureRamp(colors, surfaces) {
|
|
330
|
+
const collisions = [];
|
|
331
|
+
const rgbs = colors.map((hex) => parseHex(hex)).filter((v) => !!v);
|
|
332
|
+
let minSeparation = Infinity;
|
|
333
|
+
for (let i = 0; i < rgbs.length; i++) {
|
|
334
|
+
for (let j = i + 1; j < rgbs.length; j++) {
|
|
335
|
+
const normal = deltaE(rgbs[i], rgbs[j]);
|
|
336
|
+
minSeparation = Math.min(minSeparation, normal);
|
|
337
|
+
if (normal < MIN_SEPARATION) {
|
|
338
|
+
collisions.push({ a: i, b: j, under: "normal", distance: normal });
|
|
339
|
+
}
|
|
340
|
+
for (const type of ["protanopia", "deuteranopia", "tritanopia"]) {
|
|
341
|
+
const d = deltaE(simulateCvd(rgbs[i], type), simulateCvd(rgbs[j], type));
|
|
342
|
+
minSeparation = Math.min(minSeparation, d);
|
|
343
|
+
if (d < MIN_SEPARATION) collisions.push({ a: i, b: j, under: type, distance: d });
|
|
344
|
+
}
|
|
345
|
+
}
|
|
346
|
+
}
|
|
347
|
+
const lowContrast = [];
|
|
348
|
+
let minContrast = Infinity;
|
|
349
|
+
colors.forEach((hex, index) => {
|
|
350
|
+
for (const surface of surfaces) {
|
|
351
|
+
const ratio = contrast(hex, surface);
|
|
352
|
+
minContrast = Math.min(minContrast, ratio);
|
|
353
|
+
if (ratio < 3) lowContrast.push({ index, surface, ratio });
|
|
354
|
+
}
|
|
355
|
+
});
|
|
356
|
+
return {
|
|
357
|
+
colors,
|
|
358
|
+
collisions,
|
|
359
|
+
lowContrast,
|
|
360
|
+
minSeparation: Number.isFinite(minSeparation) ? minSeparation : 0,
|
|
361
|
+
minContrast: Number.isFinite(minContrast) ? minContrast : 0,
|
|
362
|
+
passes: collisions.length === 0 && lowContrast.length === 0
|
|
363
|
+
};
|
|
364
|
+
}
|
|
365
|
+
function describe(hex) {
|
|
366
|
+
const rgb = parseHex(hex);
|
|
367
|
+
return rgb ? rgbToOklch(rgb) : null;
|
|
368
|
+
}
|
|
369
|
+
export {
|
|
370
|
+
auditChartRamp,
|
|
371
|
+
auditPalette,
|
|
372
|
+
deriveChartRamp,
|
|
373
|
+
derivePalette,
|
|
374
|
+
describe
|
|
375
|
+
};
|
|
376
|
+
//# sourceMappingURL=palette-derive.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../../src/theme/palette-derive.ts"],"sourcesContent":["import type { ThemeMode } from \"./theme-store\";\nimport type { TokenSet } from \"./palette-presets\";\nimport type { HeatStops } from \"./chart-palette\";\nimport {\n contrast,\n deltaE,\n toHex,\n hexToOklch,\n oklchToHex,\n parseHex,\n rgbToOklch,\n simulateCvd,\n solveLightness,\n} from \"./color\";\nimport type { CvdType, Oklch } from \"./color\";\n\n/**\n * Build a whole palette from one brand colour, plus any number of colours pinned by\n * hand, with every contrast ratio SOLVED rather than chosen and then hoped for.\n *\n * The presets this package shipped were assembled by eye and annotated with the ratios\n * they were believed to hold — `tokens.css` records \"7.0:1 and 4.8:1\", and\n * `palette-presets.ts` records \"2.67:1 … lifted they clear it at 3.30:1\". Nothing\n * computed any of them, and the audit found four of the nine default light chart hues\n * below the 3:1 that WCAG 1.4.11 requires of a graphical object. A comment is not a\n * test. Everything here is derived to a target and then measured, and\n * {@link auditPalette} returns the measurements so a caller can refuse a palette that\n * does not hold up.\n *\n * WHAT IS DERIVED AND WHAT IS NOT. The UI palette and the CATEGORICAL CHART RAMP solve\n * different problems and are deliberately kept apart. A UI colour needs contrast against\n * one known surface and carries a fixed meaning; a chart colour needs to stay separable\n * from eight unknown siblings, at roughly equal salience, with no implied order.\n * Optimising a set for one makes it worse at the other, which is why `deriveTokenSet`\n * leaves `chart` alone unless you explicitly ask for {@link deriveChartRamp}.\n */\n\n/* ── Inputs ───────────────────────────────────────────────────────────────── */\n\n/** A role whose hue may be pinned by the caller instead of chosen by the deriver. */\nexport type AnchorRole = \"brand\" | \"accent\" | \"danger\" | \"warning\" | \"success\" | \"info\";\n\nexport type PaletteAnchors = { brand: string } & Partial<Record<Exclude<AnchorRole, \"brand\">, string>>;\n\nexport interface DeriveOptions {\n anchors: PaletteAnchors;\n mode: ThemeMode;\n /**\n * How strongly the surfaces carry the brand's hue, 0–1 of the maximum useful tint.\n * 0 gives neutral greys; the shipped default is a visible warmth, because a page that\n * is very slightly the brand's hue reads as considered where a pure grey reads as\n * unstyled. Above ~0.5 the surfaces start competing with the content.\n */\n surfaceTint?: number;\n /** Contrast targets for the three text roles against the WORST surface. */\n textContrast?: { primary?: number; secondary?: number; muted?: number };\n}\n\n/* ── Outputs ──────────────────────────────────────────────────────────────── */\n\n/** The semantic layer, which lives in tokens.css rather than in `TokenSet`. */\nexport interface SemanticTokens {\n danger: string;\n dangerHover: string;\n dangerContrast: string;\n dangerBorder: string;\n dangerBg: string;\n warning: string;\n warningBorder: string;\n warningBg: string;\n info: string;\n infoBorder: string;\n infoBg: string;\n success: string;\n successBorder: string;\n successBg: string;\n /** Present only when a `accent` (secondary brand) anchor was supplied. */\n accent?: string;\n accentContrast?: string;\n accentBg?: string;\n}\n\nexport interface ContrastCheck {\n /** e.g. \"textMuted on bgPage\". */\n pair: string;\n ratio: number;\n /** What WCAG asks of this pair. */\n required: number;\n /** Which rule the requirement comes from, for a reader who wants to argue with it. */\n rule: string;\n passes: boolean;\n}\n\nexport interface ContrastReport {\n checks: ContrastCheck[];\n failures: ContrastCheck[];\n passes: boolean;\n}\n\nexport interface DerivedPalette {\n tokens: TokenSet;\n semantic: SemanticTokens;\n audit: ContrastReport;\n /** Compromises the deriver had to make, in plain words. Never silent. */\n warnings: string[];\n}\n\n/* ── The hue homes ────────────────────────────────────────────────────────── */\n\n/**\n * Where each semantic role wants to sit, and how far it may be pushed.\n *\n * A semantic colour is a convention before it is an aesthetic: danger is red because\n * every other interface the user has ever used made it red, and a \"danger\" button in\n * the brand's teal is a worse button however well it matches. So each role has a home\n * hue and a narrow licence to move — enough to get out of the brand's way when the\n * brand happens to live in the same neighbourhood, not enough to stop meaning what it\n * means. If it cannot get far enough, that is a warning, not a silent compromise.\n */\nconst HUE_HOME: Record<Exclude<AnchorRole, \"brand\" | \"accent\">, { hue: number; slack: number }> = {\n danger: { hue: 27, slack: 14 },\n warning: { hue: 75, slack: 16 },\n success: { hue: 150, slack: 20 },\n info: { hue: 240, slack: 22 },\n};\n\n/** Circular distance between two hue angles, 0–180. */\nfunction hueGap(a: number, b: number): number {\n const d = Math.abs(((a - b) % 360) + 360) % 360;\n return d > 180 ? 360 - d : d;\n}\n\n/**\n * Nudge `home` within `slack` to maximise the distance from every taken hue.\n *\n * Sampled rather than solved: the objective is a min-of-distances over a handful of\n * points on a short arc, which is piecewise-linear with kinks wherever the nearest\n * neighbour changes. Gradient methods stall on those kinks; 2° steps over a ±22° arc is\n * 23 evaluations of some trigonometry and cannot stall.\n */\nfunction placeHue(home: number, slack: number, taken: number[]): number {\n let best = home;\n let bestGap = Math.min(...taken.map((t) => hueGap(home, t)), 360);\n for (let d = -slack; d <= slack; d += 2) {\n const h = (home + d + 360) % 360;\n const gap = Math.min(...taken.map((t) => hueGap(h, t)), 360);\n // Ties go to the hue nearest home: a role should move only as far as it must.\n if (gap > bestGap + 1e-9) {\n best = h;\n bestGap = gap;\n }\n }\n return best;\n}\n\n/* ── Derivation ───────────────────────────────────────────────────────────── */\n\nconst SURFACE_L = {\n // Light: the PAGE is slightly darker than the cards on it, so a card reads as raised\n // without needing a shadow to say so. Matches the shipped presets' relationship.\n light: { page: 0.912, surface: 0.945, surface2: 0.929 },\n dark: { page: 0.158, surface: 0.206, surface2: 0.249 },\n} as const;\n\n/**\n * What a hairline has to clear against the surface it divides.\n *\n * WCAG has nothing to say here — a decorative border is not a graphical object that\n * conveys information — so this is a house rule, and it is deliberately low. A border\n * that clears 3:1 is a RULE, not a hairline: it draws the eye to the box instead of to\n * what is in it. 1.5:1 is the point at which the edge is reliably findable without\n * becoming part of the composition.\n */\nconst BORDER_CONTRAST = 1.5;\n\n/** The most tint a surface can carry before it stops reading as a neutral ground. */\nconst MAX_SURFACE_CHROMA = 0.034;\n\nfunction surfaceSet(hue: number, mode: ThemeMode, tint: number) {\n const c = MAX_SURFACE_CHROMA * Math.max(0, Math.min(1, tint));\n const L = SURFACE_L[mode];\n const bgPage = oklchToHex({ l: L.page, c, h: hue });\n const bgSurface = oklchToHex({ l: L.surface, c, h: hue });\n const bgSurface2 = oklchToHex({ l: L.surface2, c, h: hue });\n // Solved, not guessed: a fixed lightness that looks right against a pale warm ground\n // disappears against a deep cold one, and both are reachable from the same `hue`\n // input. The border carries a little more chroma than the surfaces because at these\n // lightnesses a perfectly neutral hairline on a tinted ground reads as a wrong grey.\n const borderChroma = c * 1.6;\n // Solved against the surface the hairline is HARDEST to see on, not against one of\n // the three. Solving against `bgSurface` alone left it at 1.36:1 on `bgPage`, so the\n // target and the audit disagreed about the same border.\n const hardest = [bgPage, bgSurface, bgSurface2].reduce((a, b) =>\n contrast(a, mode === \"light\" ? \"#000000\" : \"#ffffff\") <\n contrast(b, mode === \"light\" ? \"#000000\" : \"#ffffff\")\n ? a\n : b,\n );\n const borderL = solveLightness(\n BORDER_CONTRAST,\n parseHex(hardest)!,\n hue,\n borderChroma,\n mode === \"light\" ? \"darker\" : \"lighter\",\n );\n return {\n bgPage,\n bgSurface,\n bgSurface2,\n border: oklchToHex({ l: borderL, c: borderChroma, h: hue }),\n };\n}\n\n/** Solve a colour at this hue that clears `target` against `against`, keeping chroma. */\nfunction solveAgainst(hue: number, chroma: number, target: number, against: string, mode: ThemeMode): string {\n const bg = parseHex(against)!;\n const l = solveLightness(target, bg, hue, chroma, mode === \"light\" ? \"darker\" : \"lighter\");\n return oklchToHex({ l, c: chroma, h: hue });\n}\n\n/** Whichever of near-white / near-black reads better ON `fill`. */\nfunction contrastOn(fill: string): string {\n const light = \"#ffffff\";\n const dark = \"#12100e\";\n return contrast(fill, light) >= contrast(fill, dark) ? light : dark;\n}\n\n/** A soft tint of `hue` sitting on the surface — a badge fill, not a button fill. */\nfunction tintOn(hue: number, chroma: number, surface: string, mode: ThemeMode): string {\n const s = hexToOklch(surface)!;\n // Toward the colour, but only far enough to be seen: these back TEXT of the same hue,\n // and a strong tint leaves the text nowhere to go.\n const l = mode === \"light\" ? s.l - 0.055 : s.l + 0.055;\n return oklchToHex({ l, c: Math.min(chroma * 0.45, 0.06), h: hue });\n}\n\nexport function derivePalette({\n anchors,\n mode,\n surfaceTint = 0.55,\n textContrast,\n}: DeriveOptions): DerivedPalette {\n const warnings: string[] = [];\n const brand = hexToOklch(anchors.brand);\n if (!brand) {\n throw new Error(\n `derivePalette: brand \"${anchors.brand}\" is not a #rgb or #rrggbb colour. ` +\n `Anchors must be hex — a named colour or an rgba() string cannot be converted.`,\n );\n }\n\n const targets = { primary: 10, secondary: 7, muted: 4.6, ...textContrast };\n\n // ── Surfaces, from the brand's hue.\n const surfaces = surfaceSet(brand.h, mode, surfaceTint);\n // Every text role is solved against the WORST of the three, so a token is legible\n // wherever it lands. Solving against `bgSurface` alone is the mistake that makes a\n // muted label fail on the page background it also sits on.\n const worstSurface = [surfaces.bgPage, surfaces.bgSurface, surfaces.bgSurface2].reduce((a, b) =>\n contrast(a, mode === \"light\" ? \"#000000\" : \"#ffffff\") <\n contrast(b, mode === \"light\" ? \"#000000\" : \"#ffffff\")\n ? a\n : b,\n );\n\n // ── Text. A trace of the brand hue keeps the greys from reading cold on a warm page.\n const textChroma = 0.014;\n const textPrimary = solveAgainst(brand.h, textChroma, targets.primary, worstSurface, mode);\n const textSecondary = solveAgainst(brand.h, textChroma, targets.secondary, worstSurface, mode);\n const textMuted = solveAgainst(brand.h, textChroma, targets.muted, worstSurface, mode);\n\n // ── Brand. Keep the hue the caller asked for; move only the lightness, and only as\n // far as 3:1 against the worst surface — WCAG 1.4.11, since a brand-filled control is\n // a graphical object whose boundary has to be perceivable.\n const brandChroma = Math.max(brand.c, 0.06);\n const brandRatio = contrast(anchors.brand, worstSurface);\n // NORMALISED, never the caller's raw string. `parseHex` accepts \"4f46e5\" and \"#abc\",\n // and passing either through unchanged put a value in the TokenSet that is not a CSS\n // colour — it then fails silently at paint time, three layers from here.\n const brandHex =\n brandRatio >= 3\n ? toHex(parseHex(anchors.brand)!)\n : solveAgainst(brand.h, brandChroma, 3, worstSurface, mode);\n if (brandRatio < 3) {\n warnings.push(\n `brand ${anchors.brand} sits at ${brandRatio.toFixed(2)}:1 against the ${mode} surfaces, ` +\n `below the 3:1 WCAG 1.4.11 asks of a control boundary. Lightness was adjusted to ` +\n `${brandHex}; hue and chroma are unchanged.`,\n );\n }\n const brandLch = hexToOklch(brandHex)!;\n const brandHover = oklchToHex({\n ...brandLch,\n // Hover moves AWAY from the page in both themes: darker on light, lighter on dark.\n l: mode === \"light\" ? brandLch.l - 0.06 : brandLch.l + 0.06,\n });\n const brandContrast = contrastOn(brandHex);\n const onBrand = contrast(brandHex, brandContrast);\n if (onBrand < 4.5) {\n warnings.push(\n `text on the brand fill reaches only ${onBrand.toFixed(2)}:1 (needs 4.5:1). ` +\n `A mid-lightness, high-chroma brand cannot carry legible text at any ink; ` +\n `use it as an accent and keep primary buttons on a darker or lighter variant.`,\n );\n }\n\n // ── Semantic roles. Anchors are honoured exactly; the rest are placed away from the\n // brand and from each other, within each role's licence to move.\n const taken: number[] = [brandLch.h];\n const accentLch = anchors.accent ? hexToOklch(anchors.accent) : null;\n if (anchors.accent && !accentLch) {\n warnings.push(`accent \"${anchors.accent}\" is not a hex colour and was ignored.`);\n }\n if (accentLch) taken.push(accentLch.h);\n\n const semanticHue = {} as Record<Exclude<AnchorRole, \"brand\" | \"accent\">, number>;\n const semanticChroma = {} as Record<Exclude<AnchorRole, \"brand\" | \"accent\">, number>;\n for (const role of [\"danger\", \"warning\", \"success\", \"info\"] as const) {\n const pinned = anchors[role] ? hexToOklch(anchors[role]!) : null;\n if (anchors[role] && !pinned) {\n warnings.push(`${role} \"${anchors[role]}\" is not a hex colour and was ignored.`);\n }\n const home = HUE_HOME[role];\n const hue = pinned ? pinned.h : placeHue(home.hue, home.slack, taken);\n if (!pinned) {\n const gap = Math.min(...taken.map((t) => hueGap(hue, t)));\n if (gap < 20) {\n warnings.push(\n `${role} could only reach ${gap.toFixed(0)}° from the nearest pinned hue, which is ` +\n `too close to tell apart at a glance. Pin ${role} explicitly, or move the brand.`,\n );\n }\n }\n semanticHue[role] = hue;\n semanticChroma[role] = pinned ? Math.max(pinned.c, 0.08) : 0.13;\n taken.push(hue);\n }\n\n /**\n * A semantic colour has two jobs and therefore two backgrounds: plain text on the\n * page, and the label inside its own tinted badge. The badge is the harder of the\n * two — it is a step toward the colour — so solving only against the surface produced\n * a badge at 4.1:1 while the loose text passed, which is the failure mode that is\n * hardest to notice because nine tenths of the uses look fine.\n */\n const sem = (role: Exclude<AnchorRole, \"brand\" | \"accent\">) => {\n const hue = semanticHue[role];\n const chroma = semanticChroma[role];\n const bg = tintOn(hue, chroma, surfaces.bgSurface, mode);\n const onSurface = solveLightness(\n 4.5,\n parseHex(worstSurface)!,\n hue,\n chroma,\n mode === \"light\" ? \"darker\" : \"lighter\",\n );\n const onTint = solveLightness(\n 4.5,\n parseHex(bg)!,\n hue,\n chroma,\n mode === \"light\" ? \"darker\" : \"lighter\",\n );\n const l = mode === \"light\" ? Math.min(onSurface, onTint) : Math.max(onSurface, onTint);\n return oklchToHex({ l, c: chroma, h: hue });\n };\n\n const danger = sem(\"danger\");\n const dangerLch = hexToOklch(danger)!;\n const semantic: SemanticTokens = {\n danger,\n dangerHover: oklchToHex({\n ...dangerLch,\n l: mode === \"light\" ? dangerLch.l - 0.06 : dangerLch.l + 0.06,\n }),\n dangerContrast: contrastOn(danger),\n dangerBorder: oklchToHex({\n l: mode === \"light\" ? dangerLch.l + 0.22 : dangerLch.l - 0.22,\n c: semanticChroma.danger,\n h: semanticHue.danger,\n }),\n dangerBg: tintOn(semanticHue.danger, semanticChroma.danger, surfaces.bgSurface, mode),\n warning: sem(\"warning\"),\n warningBorder: oklchToHex({\n l: mode === \"light\" ? 0.82 : 0.44,\n c: semanticChroma.warning,\n h: semanticHue.warning,\n }),\n warningBg: tintOn(semanticHue.warning, semanticChroma.warning, surfaces.bgSurface, mode),\n info: sem(\"info\"),\n infoBorder: oklchToHex({\n l: mode === \"light\" ? 0.8 : 0.45,\n c: semanticChroma.info,\n h: semanticHue.info,\n }),\n infoBg: tintOn(semanticHue.info, semanticChroma.info, surfaces.bgSurface, mode),\n success: sem(\"success\"),\n successBorder: oklchToHex({\n l: mode === \"light\" ? 0.81 : 0.45,\n c: semanticChroma.success,\n h: semanticHue.success,\n }),\n successBg: tintOn(semanticHue.success, semanticChroma.success, surfaces.bgSurface, mode),\n };\n\n if (accentLch) {\n const accent = solveAgainst(accentLch.h, Math.max(accentLch.c, 0.06), 3, worstSurface, mode);\n semantic.accent = accent;\n semantic.accentContrast = contrastOn(accent);\n semantic.accentBg = tintOn(accentLch.h, Math.max(accentLch.c, 0.06), surfaces.bgSurface, mode);\n }\n\n // ── Money. A THIRD system again: these are data colours with fixed meanings, and the\n // one rule that outranks everything is that income and expense must never be the\n // red/green pair — which is why the shipped presets use teal/amber/violet. Derived\n // here at fixed hues rather than from the brand, for the same reason `--danger` is:\n // a consumer who rebrands does not thereby change what \"money out\" looks like.\n const money = (hue: number, target: number) => solveAgainst(hue, 0.12, target, worstSurface, mode);\n const moneyIncome = money(175, 4.5);\n const moneyExpense = money(70, 4.5);\n const moneyNet = money(300, 4.5);\n const moneyNeutral = oklchToHex({ l: mode === \"light\" ? 0.52 : 0.72, c: 0.012, h: brand.h });\n\n const tokens: TokenSet = {\n ...surfaces,\n textPrimary,\n textSecondary,\n textMuted,\n brand: brandHex,\n brandHover,\n brandContrast,\n moneyIncome,\n moneyExpense,\n moneyNet,\n moneyNeutral,\n // Left alone. See the note at the top of this file about why the categorical ramp is\n // not derived from the brand unless the caller asks.\n //\n // ⚠️ EMPTY, not absent: a caller who hands this straight to `applyTokenSet` keeps\n // whatever `--chart-1…9` were already on the element. That is deliberate — the ramp\n // is a separate decision and clearing it would leave charts unpainted — but it means\n // a derived palette applied over another preset is a MIX until you also supply a\n // ramp. `deriveChartRamp` is how you supply one.\n chart: [],\n heat: deriveHeat(moneyIncome, moneyExpense, surfaces, mode),\n };\n\n return { tokens, semantic, audit: auditPalette(tokens, semantic), warnings };\n}\n\n/**\n * Heatmap stops, reusing the money pair.\n *\n * `under` is the good direction and `over` the bad one, at the SAME hues as\n * `moneyIncome`/`moneyExpense` — so a heatmap cell and the figure printed beside it\n * agree about which way is which, rather than each inventing its own convention.\n */\nfunction deriveHeat(\n income: string,\n expense: string,\n surfaces: { bgSurface2: string },\n mode: ThemeMode,\n): HeatStops {\n const exp = hexToOklch(expense)!;\n return {\n neutral: surfaces.bgSurface2,\n under: income,\n over: expense,\n seqLow: oklchToHex({ l: mode === \"light\" ? 0.93 : 0.26, c: 0.05, h: exp.h }),\n seqHigh: expense,\n empty: mode === \"light\" ? \"rgba(120,110,95,0.14)\" : \"rgba(160,170,190,0.10)\",\n };\n}\n\n/* ── Audit ────────────────────────────────────────────────────────────────── */\n\n/**\n * Measure every pair that has a requirement, and say which ones fail.\n *\n * This is the part the shipped presets were missing. `derivePalette` runs it on the way\n * out, and the preset test runs it over everything the package ships, so a palette that\n * does not hold up cannot be merged with a comment claiming that it does.\n */\nexport function auditPalette(t: TokenSet, semantic?: SemanticTokens): ContrastReport {\n const checks: ContrastCheck[] = [];\n const surfaces: Array<[string, string]> = [\n [\"bgPage\", t.bgPage],\n [\"bgSurface\", t.bgSurface],\n [\"bgSurface2\", t.bgSurface2],\n ];\n\n const add = (pair: string, fg: string, bg: string, required: number, rule: string) => {\n const ratio = contrast(fg, bg);\n checks.push({ pair, ratio, required, rule, passes: ratio >= required - 0.05 });\n };\n\n for (const [name, bg] of surfaces) {\n add(`textPrimary on ${name}`, t.textPrimary, bg, 7, \"WCAG 1.4.6 AAA body text\");\n add(`textSecondary on ${name}`, t.textSecondary, bg, 4.5, \"WCAG 1.4.3 AA body text\");\n add(`textMuted on ${name}`, t.textMuted, bg, 4.5, \"WCAG 1.4.3 AA body text\");\n add(`brand on ${name}`, t.brand, bg, 3, \"WCAG 1.4.11 graphical object\");\n add(`border on ${name}`, t.border, bg, 1.1, \"house rule: a hairline must be findable\");\n for (const [key, hex] of [\n [\"moneyIncome\", t.moneyIncome],\n [\"moneyExpense\", t.moneyExpense],\n [\"moneyNet\", t.moneyNet],\n ] as const) {\n add(`${key} on ${name}`, hex, bg, 4.5, \"WCAG 1.4.3 — these are rendered as TEXT\");\n }\n }\n\n add(\"brandContrast on brand\", t.brandContrast, t.brand, 4.5, \"WCAG 1.4.3 AA body text\");\n\n if (semantic) {\n for (const [name, fg] of [\n [\"danger\", semantic.danger],\n [\"warning\", semantic.warning],\n [\"info\", semantic.info],\n [\"success\", semantic.success],\n ] as const) {\n add(`${name} on bgSurface`, fg, t.bgSurface, 4.5, \"WCAG 1.4.3 — rendered as text\");\n }\n add(\"danger on dangerBg\", semantic.danger, semantic.dangerBg, 4.5, \"WCAG 1.4.3 — badge text\");\n add(\"warning on warningBg\", semantic.warning, semantic.warningBg, 4.5, \"WCAG 1.4.3 — badge text\");\n add(\"info on infoBg\", semantic.info, semantic.infoBg, 4.5, \"WCAG 1.4.3 — badge text\");\n add(\"success on successBg\", semantic.success, semantic.successBg, 4.5, \"WCAG 1.4.3 — badge text\");\n add(\n \"dangerContrast on danger\",\n semantic.dangerContrast,\n semantic.danger,\n 4.5,\n \"WCAG 1.4.3 AA body text\",\n );\n }\n\n const failures = checks.filter((c) => !c.passes);\n return { checks, failures, passes: failures.length === 0 };\n}\n\n/* ── Categorical chart ramp ───────────────────────────────────────────────── */\n\nexport interface ChartRampReport {\n colors: string[];\n /** Series pairs that are too close under normal vision or any simulated CVD. */\n collisions: Array<{ a: number; b: number; under: \"normal\" | CvdType; distance: number }>;\n /** Series that do not clear 3:1 against a surface they may be drawn on. */\n lowContrast: Array<{ index: number; surface: string; ratio: number }>;\n /** The worst pairwise separation, across normal vision and all three dichromacies. */\n minSeparation: number;\n /** The worst contrast any series reaches against any surface it was measured on. */\n minContrast: number;\n passes: boolean;\n}\n\n/**\n * The floor for pairwise separation in OKLab, across normal vision and each dichromacy.\n *\n * CALIBRATED, not chosen. Paul Tol's \"Muted\" set — which this package ships and which is\n * a well-regarded CVD-safe palette — bottoms out at 0.059 in its light variant and 0.032\n * in the lightened dark one. A threshold above 0.059 would fail a palette that is known\n * to work, which is worse than having no check at all: an audit that cries wolf gets\n * switched off. 0.05 sits just under the known-good case.\n */\nconst MIN_SEPARATION = 0.05;\n\n/**\n * **The categorical trade-off, measured.** At a SINGLE lightness, the most series that\n * can satisfy both the 3:1 fill contrast of WCAG 1.4.11 and {@link MIN_SEPARATION} under\n * dichromacy is FOUR. Searched exhaustively over starting hue and lightness:\n *\n * n=4 best separation 0.065 — both satisfiable\n * n=5 best separation 0.041 — not satisfiable\n * n=9 best separation 0.015 — not satisfiable\n *\n * The reason is structural: dichromacy collapses the red-green axis, so hue alone stops\n * distinguishing colours once you need more than a handful, and the remaining channel is\n * LIGHTNESS — the very thing a uniform-contrast ramp holds constant. Paul Tol's set\n * varies lightness deliberately and pays for it in contrast; that is not an oversight in\n * their palette, it is the only currency left.\n *\n * So above four series this deriver varies lightness too, and reports what it gave up\n * rather than pretending both constraints were met.\n *\n * NOTE ON WHAT THIS BOUND IS. It describes the PROBLEM, not a guarantee about\n * {@link deriveChartRamp}. That function fixes lightness and starts the hue wheel at the\n * brand's own hue rather than searching for the best start, so it reaches the bound only\n * where the brand happens to sit well: sweeping 72 brand hues against the default light\n * surfaces, 7 of 72 produced a passing 4-series ramp (12 of 72 on dark), and none passed\n * at 5 or 9. Read the report it returns; do not assume a pass.\n */\nconst SINGLE_LIGHTNESS_MAX_SERIES = 4;\n\n/**\n * A categorical ramp of `count` hues, evenly spaced and equal in perceived lightness,\n * then MEASURED for separability — including under each dichromacy.\n *\n * Offered but not used by default, and the distinction matters. Evenly spaced hues at\n * one lightness are a reasonable generic answer; Paul Tol's \"Muted\" set, which this\n * package ships, is a better specific one, because it was optimised against real\n * confusion lines rather than derived from a formula. So this exists for a consumer who\n * wants their charts to follow their brand and is willing to read the report — not as\n * a silent upgrade to the default.\n */\nexport function deriveChartRamp(\n brandHex: string,\n mode: ThemeMode,\n surfaces: string[],\n count = 9,\n): ChartRampReport {\n const brand = hexToOklch(brandHex) ?? { l: 0.6, c: 0.12, h: 264 };\n const base = mode === \"light\" ? 0.58 : 0.74;\n const c = Math.max(0.09, Math.min(brand.c, 0.15));\n // Up to four series, one lightness: a scale that varies lightness implies rank, and a\n // categorical one must not. Beyond four, lightness is the only channel left that\n // survives dichromacy — see SINGLE_LIGHTNESS_MAX_SERIES — so it alternates in a\n // three-step cycle, which keeps ADJACENT series (the ones a legend puts side by side)\n // at different lightnesses as well as different hues.\n const vary = count > SINGLE_LIGHTNESS_MAX_SERIES;\n const offsets = [0, mode === \"light\" ? -0.1 : 0.1, mode === \"light\" ? 0.08 : -0.08];\n const colors = Array.from({ length: count }, (_, i) =>\n oklchToHex({\n l: vary ? base + offsets[i % offsets.length] : base,\n c,\n h: (brand.h + (360 / count) * i) % 360,\n }),\n );\n\n return measureRamp(colors, surfaces);\n}\n\n/** Audit a ramp somebody else chose — the shipped Paul Tol set, say. */\nexport function auditChartRamp(colors: string[], surfaces: string[]): ChartRampReport {\n return measureRamp(colors, surfaces);\n}\n\nfunction measureRamp(colors: string[], surfaces: string[]): ChartRampReport {\n const collisions: ChartRampReport[\"collisions\"] = [];\n const rgbs = colors.map((hex) => parseHex(hex)).filter((v): v is NonNullable<typeof v> => !!v);\n let minSeparation = Infinity;\n for (let i = 0; i < rgbs.length; i++) {\n for (let j = i + 1; j < rgbs.length; j++) {\n const normal = deltaE(rgbs[i], rgbs[j]);\n minSeparation = Math.min(minSeparation, normal);\n if (normal < MIN_SEPARATION) {\n collisions.push({ a: i, b: j, under: \"normal\", distance: normal });\n }\n for (const type of [\"protanopia\", \"deuteranopia\", \"tritanopia\"] as const) {\n const d = deltaE(simulateCvd(rgbs[i], type), simulateCvd(rgbs[j], type));\n minSeparation = Math.min(minSeparation, d);\n if (d < MIN_SEPARATION) collisions.push({ a: i, b: j, under: type, distance: d });\n }\n }\n }\n\n const lowContrast: ChartRampReport[\"lowContrast\"] = [];\n let minContrast = Infinity;\n colors.forEach((hex, index) => {\n for (const surface of surfaces) {\n const ratio = contrast(hex, surface);\n minContrast = Math.min(minContrast, ratio);\n // WCAG 1.4.11: a graphical object carrying meaning needs 3:1 against what is\n // adjacent to it. A bar the same value as the card behind it has no boundary.\n if (ratio < 3) lowContrast.push({ index, surface, ratio });\n }\n });\n\n return {\n colors,\n collisions,\n lowContrast,\n minSeparation: Number.isFinite(minSeparation) ? minSeparation : 0,\n minContrast: Number.isFinite(minContrast) ? minContrast : 0,\n passes: collisions.length === 0 && lowContrast.length === 0,\n };\n}\n\n/** Convenience: the OKLCH of a hex, for a caller inspecting an anchor. */\nexport function describe(hex: string): Oklch | null {\n const rgb = parseHex(hex);\n return rgb ? rgbToOklch(rgb) : null;\n}\n"],"mappings":"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","names":[]}
|
|
@@ -28,6 +28,19 @@ interface PalettePreset {
|
|
|
28
28
|
declare const DEFAULT_PRESET: PalettePreset;
|
|
29
29
|
declare const ALTERNATIVE_PRESETS: PalettePreset[];
|
|
30
30
|
declare const IMPRINT_PRESET: PalettePreset;
|
|
31
|
+
/**
|
|
32
|
+
* Presets DERIVED rather than picked, by `derivePalette` from one brand colour each.
|
|
33
|
+
*
|
|
34
|
+
* Every text role here was solved to a contrast target against the worst of the three
|
|
35
|
+
* surfaces it can land on, every semantic colour against both the page and its own badge
|
|
36
|
+
* tint, and the whole set is re-checked by `derived-presets.test.ts` — which re-runs the
|
|
37
|
+
* deriver and fails if these committed values drift from what it now produces.
|
|
38
|
+
*
|
|
39
|
+
* They are committed rather than derived at import because deriving eight token sets
|
|
40
|
+
* costs ~34ms, and charging every consumer that at startup for palettes most of them
|
|
41
|
+
* will never select is the wrong trade. The test is what keeps the two in agreement.
|
|
42
|
+
*/
|
|
43
|
+
declare const DERIVED_PRESETS: PalettePreset[];
|
|
31
44
|
declare const PALETTES: PalettePreset[];
|
|
32
45
|
declare function presetById(id: string): PalettePreset;
|
|
33
46
|
/**
|
|
@@ -45,4 +58,4 @@ declare function presetById(id: string): PalettePreset;
|
|
|
45
58
|
*/
|
|
46
59
|
declare function applyTokenSet(el: HTMLElement, t: TokenSet): void;
|
|
47
60
|
|
|
48
|
-
export { ALTERNATIVE_PRESETS, DEFAULT_PRESET, IMPRINT_PRESET, PALETTES, type PalettePreset, type TokenSet, applyTokenSet, presetById };
|
|
61
|
+
export { ALTERNATIVE_PRESETS, DEFAULT_PRESET, DERIVED_PRESETS, IMPRINT_PRESET, PALETTES, type PalettePreset, type TokenSet, applyTokenSet, presetById };
|