@hjmds/design-contracts 0.8.2
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/README.md +208 -0
- package/dist/alert-dialog.d.ts +102 -0
- package/dist/alert-dialog.d.ts.map +1 -0
- package/dist/alert-dialog.js +136 -0
- package/dist/alert-dialog.js.map +1 -0
- package/dist/base-recipes.d.ts +184 -0
- package/dist/base-recipes.d.ts.map +1 -0
- package/dist/base-recipes.js +129 -0
- package/dist/base-recipes.js.map +1 -0
- package/dist/behaviors.d.ts +1254 -0
- package/dist/behaviors.d.ts.map +1 -0
- package/dist/behaviors.js +972 -0
- package/dist/behaviors.js.map +1 -0
- package/dist/bottom-navigation-defaults.d.ts +13 -0
- package/dist/bottom-navigation-defaults.d.ts.map +1 -0
- package/dist/bottom-navigation-defaults.js +10 -0
- package/dist/bottom-navigation-defaults.js.map +1 -0
- package/dist/bottom-navigation.d.ts +114 -0
- package/dist/bottom-navigation.d.ts.map +1 -0
- package/dist/bottom-navigation.js +223 -0
- package/dist/bottom-navigation.js.map +1 -0
- package/dist/breadcrumb.d.ts +97 -0
- package/dist/breadcrumb.d.ts.map +1 -0
- package/dist/breadcrumb.js +99 -0
- package/dist/breadcrumb.js.map +1 -0
- package/dist/calendar.d.ts +285 -0
- package/dist/calendar.d.ts.map +1 -0
- package/dist/calendar.js +297 -0
- package/dist/calendar.js.map +1 -0
- package/dist/card.d.ts +39 -0
- package/dist/card.d.ts.map +1 -0
- package/dist/card.js +50 -0
- package/dist/card.js.map +1 -0
- package/dist/carousel.d.ts +180 -0
- package/dist/carousel.d.ts.map +1 -0
- package/dist/carousel.js +172 -0
- package/dist/carousel.js.map +1 -0
- package/dist/catalog.d.ts +7158 -0
- package/dist/catalog.d.ts.map +1 -0
- package/dist/catalog.js +220 -0
- package/dist/catalog.js.map +1 -0
- package/dist/collection.d.ts +123 -0
- package/dist/collection.d.ts.map +1 -0
- package/dist/collection.js +211 -0
- package/dist/collection.js.map +1 -0
- package/dist/color-references.d.ts +46 -0
- package/dist/color-references.d.ts.map +1 -0
- package/dist/color-references.js +39 -0
- package/dist/color-references.js.map +1 -0
- package/dist/colors.d.ts +56 -0
- package/dist/colors.d.ts.map +1 -0
- package/dist/colors.js +90 -0
- package/dist/colors.js.map +1 -0
- package/dist/command-palette.d.ts +240 -0
- package/dist/command-palette.d.ts.map +1 -0
- package/dist/command-palette.js +97 -0
- package/dist/command-palette.js.map +1 -0
- package/dist/component-contracts.d.ts +137 -0
- package/dist/component-contracts.d.ts.map +1 -0
- package/dist/component-contracts.js +53 -0
- package/dist/component-contracts.js.map +1 -0
- package/dist/component-definitions.d.ts +135 -0
- package/dist/component-definitions.d.ts.map +1 -0
- package/dist/component-definitions.js +142 -0
- package/dist/component-definitions.js.map +1 -0
- package/dist/component-recipes.d.ts +3583 -0
- package/dist/component-recipes.d.ts.map +1 -0
- package/dist/component-recipes.js +1503 -0
- package/dist/component-recipes.js.map +1 -0
- package/dist/component-references.d.ts +416 -0
- package/dist/component-references.d.ts.map +1 -0
- package/dist/component-references.js +140 -0
- package/dist/component-references.js.map +1 -0
- package/dist/content-state.d.ts +104 -0
- package/dist/content-state.d.ts.map +1 -0
- package/dist/content-state.js +116 -0
- package/dist/content-state.js.map +1 -0
- package/dist/counter-badge-recipe.d.ts +80 -0
- package/dist/counter-badge-recipe.d.ts.map +1 -0
- package/dist/counter-badge-recipe.js +44 -0
- package/dist/counter-badge-recipe.js.map +1 -0
- package/dist/counter-badge.d.ts +12 -0
- package/dist/counter-badge.d.ts.map +1 -0
- package/dist/counter-badge.js +21 -0
- package/dist/counter-badge.js.map +1 -0
- package/dist/data-table.d.ts +203 -0
- package/dist/data-table.d.ts.map +1 -0
- package/dist/data-table.js +182 -0
- package/dist/data-table.js.map +1 -0
- package/dist/date-picker.d.ts +268 -0
- package/dist/date-picker.d.ts.map +1 -0
- package/dist/date-picker.js +168 -0
- package/dist/date-picker.js.map +1 -0
- package/dist/description-list.d.ts +68 -0
- package/dist/description-list.d.ts.map +1 -0
- package/dist/description-list.js +85 -0
- package/dist/description-list.js.map +1 -0
- package/dist/design-system-provider.d.ts +80 -0
- package/dist/design-system-provider.d.ts.map +1 -0
- package/dist/design-system-provider.js +147 -0
- package/dist/design-system-provider.js.map +1 -0
- package/dist/evidence.d.ts +49 -0
- package/dist/evidence.d.ts.map +1 -0
- package/dist/evidence.js +133 -0
- package/dist/evidence.js.map +1 -0
- package/dist/file-picker.d.ts +183 -0
- package/dist/file-picker.d.ts.map +1 -0
- package/dist/file-picker.js +224 -0
- package/dist/file-picker.js.map +1 -0
- package/dist/floating-action-button.d.ts +143 -0
- package/dist/floating-action-button.d.ts.map +1 -0
- package/dist/floating-action-button.js +149 -0
- package/dist/floating-action-button.js.map +1 -0
- package/dist/form.d.ts +143 -0
- package/dist/form.d.ts.map +1 -0
- package/dist/form.js +206 -0
- package/dist/form.js.map +1 -0
- package/dist/foundations.d.ts +300 -0
- package/dist/foundations.d.ts.map +1 -0
- package/dist/foundations.js +238 -0
- package/dist/foundations.js.map +1 -0
- package/dist/grid.d.ts +75 -0
- package/dist/grid.d.ts.map +1 -0
- package/dist/grid.js +133 -0
- package/dist/grid.js.map +1 -0
- package/dist/icon-button-recipe.d.ts +99 -0
- package/dist/icon-button-recipe.d.ts.map +1 -0
- package/dist/icon-button-recipe.js +53 -0
- package/dist/icon-button-recipe.js.map +1 -0
- package/dist/icon.d.ts +41 -0
- package/dist/icon.d.ts.map +1 -0
- package/dist/icon.js +147 -0
- package/dist/icon.js.map +1 -0
- package/dist/image.d.ts +82 -0
- package/dist/image.d.ts.map +1 -0
- package/dist/image.js +100 -0
- package/dist/image.js.map +1 -0
- package/dist/index.d.ts +58 -0
- package/dist/index.d.ts.map +1 -0
- package/dist/index.js +66 -0
- package/dist/index.js.map +1 -0
- package/dist/layout.d.ts +118 -0
- package/dist/layout.d.ts.map +1 -0
- package/dist/layout.js +118 -0
- package/dist/layout.js.map +1 -0
- package/dist/link.d.ts +57 -0
- package/dist/link.d.ts.map +1 -0
- package/dist/link.js +142 -0
- package/dist/link.js.map +1 -0
- package/dist/load-more.d.ts +64 -0
- package/dist/load-more.d.ts.map +1 -0
- package/dist/load-more.js +124 -0
- package/dist/load-more.js.map +1 -0
- package/dist/mentions.d.ts +67 -0
- package/dist/mentions.d.ts.map +1 -0
- package/dist/mentions.js +107 -0
- package/dist/mentions.js.map +1 -0
- package/dist/number-field.d.ts +208 -0
- package/dist/number-field.d.ts.map +1 -0
- package/dist/number-field.js +247 -0
- package/dist/number-field.js.map +1 -0
- package/dist/otp-field.d.ts +152 -0
- package/dist/otp-field.d.ts.map +1 -0
- package/dist/otp-field.js +117 -0
- package/dist/otp-field.js.map +1 -0
- package/dist/pagination.d.ts +181 -0
- package/dist/pagination.d.ts.map +1 -0
- package/dist/pagination.js +226 -0
- package/dist/pagination.js.map +1 -0
- package/dist/password-field.d.ts +187 -0
- package/dist/password-field.d.ts.map +1 -0
- package/dist/password-field.js +120 -0
- package/dist/password-field.js.map +1 -0
- package/dist/popover.d.ts +152 -0
- package/dist/popover.d.ts.map +1 -0
- package/dist/popover.js +137 -0
- package/dist/popover.js.map +1 -0
- package/dist/progress-recipe.d.ts +43 -0
- package/dist/progress-recipe.d.ts.map +1 -0
- package/dist/progress-recipe.js +16 -0
- package/dist/progress-recipe.js.map +1 -0
- package/dist/recipes.d.ts +31 -0
- package/dist/recipes.d.ts.map +1 -0
- package/dist/recipes.js +46 -0
- package/dist/recipes.js.map +1 -0
- package/dist/responsive.d.ts +27 -0
- package/dist/responsive.d.ts.map +1 -0
- package/dist/responsive.js +66 -0
- package/dist/responsive.js.map +1 -0
- package/dist/result.d.ts +111 -0
- package/dist/result.d.ts.map +1 -0
- package/dist/result.js +97 -0
- package/dist/result.js.map +1 -0
- package/dist/selection-helpers.d.ts +16 -0
- package/dist/selection-helpers.d.ts.map +1 -0
- package/dist/selection-helpers.js +52 -0
- package/dist/selection-helpers.js.map +1 -0
- package/dist/semantic-colors.d.ts +275 -0
- package/dist/semantic-colors.d.ts.map +1 -0
- package/dist/semantic-colors.js +84 -0
- package/dist/semantic-colors.js.map +1 -0
- package/dist/sheet.d.ts +51 -0
- package/dist/sheet.d.ts.map +1 -0
- package/dist/sheet.js +69 -0
- package/dist/sheet.js.map +1 -0
- package/dist/showcase.d.ts +153 -0
- package/dist/showcase.d.ts.map +1 -0
- package/dist/showcase.js +210 -0
- package/dist/showcase.js.map +1 -0
- package/dist/side-panel.d.ts +199 -0
- package/dist/side-panel.d.ts.map +1 -0
- package/dist/side-panel.js +111 -0
- package/dist/side-panel.js.map +1 -0
- package/dist/slider.d.ts +138 -0
- package/dist/slider.d.ts.map +1 -0
- package/dist/slider.js +150 -0
- package/dist/slider.js.map +1 -0
- package/dist/splitter.d.ts +113 -0
- package/dist/splitter.d.ts.map +1 -0
- package/dist/splitter.js +99 -0
- package/dist/splitter.js.map +1 -0
- package/dist/statistic.d.ts +41 -0
- package/dist/statistic.d.ts.map +1 -0
- package/dist/statistic.js +76 -0
- package/dist/statistic.js.map +1 -0
- package/dist/steps.d.ts +196 -0
- package/dist/steps.d.ts.map +1 -0
- package/dist/steps.js +160 -0
- package/dist/steps.js.map +1 -0
- package/dist/tag.d.ts +128 -0
- package/dist/tag.d.ts.map +1 -0
- package/dist/tag.js +93 -0
- package/dist/tag.js.map +1 -0
- package/dist/timeline.d.ts +147 -0
- package/dist/timeline.d.ts.map +1 -0
- package/dist/timeline.js +127 -0
- package/dist/timeline.js.map +1 -0
- package/dist/toast.d.ts +164 -0
- package/dist/toast.d.ts.map +1 -0
- package/dist/toast.js +529 -0
- package/dist/toast.js.map +1 -0
- package/dist/tokens.d.ts +9 -0
- package/dist/tokens.d.ts.map +1 -0
- package/dist/tokens.js +9 -0
- package/dist/tokens.js.map +1 -0
- package/dist/tooltip.d.ts +44 -0
- package/dist/tooltip.d.ts.map +1 -0
- package/dist/tooltip.js +88 -0
- package/dist/tooltip.js.map +1 -0
- package/dist/tour.d.ts +218 -0
- package/dist/tour.d.ts.map +1 -0
- package/dist/tour.js +211 -0
- package/dist/tour.js.map +1 -0
- package/dist/transfer-list.d.ts +207 -0
- package/dist/transfer-list.d.ts.map +1 -0
- package/dist/transfer-list.js +193 -0
- package/dist/transfer-list.js.map +1 -0
- package/dist/tree-select.d.ts +78 -0
- package/dist/tree-select.d.ts.map +1 -0
- package/dist/tree-select.js +132 -0
- package/dist/tree-select.js.map +1 -0
- package/dist/tree.d.ts +206 -0
- package/dist/tree.d.ts.map +1 -0
- package/dist/tree.js +223 -0
- package/dist/tree.js.map +1 -0
- package/dist/upload-item.d.ts +173 -0
- package/dist/upload-item.d.ts.map +1 -0
- package/dist/upload-item.js +156 -0
- package/dist/upload-item.js.map +1 -0
- package/dist/version.d.ts +3 -0
- package/dist/version.d.ts.map +1 -0
- package/dist/version.js +3 -0
- package/dist/version.js.map +1 -0
- package/docs/affix.md +63 -0
- package/docs/anchor.md +59 -0
- package/docs/ant-design-coverage.md +119 -0
- package/docs/app-provider.md +50 -0
- package/docs/app-rn-adoption.md +227 -0
- package/docs/architecture.md +320 -0
- package/docs/authoring-brief.md +87 -0
- package/docs/border-beam.md +66 -0
- package/docs/bottom-navigation.md +127 -0
- package/docs/breadcrumb.md +82 -0
- package/docs/calendar.md +154 -0
- package/docs/carousel.md +130 -0
- package/docs/cascader.md +93 -0
- package/docs/catalog-decision-status.md +306 -0
- package/docs/color-picker.md +72 -0
- package/docs/command-palette.md +116 -0
- package/docs/confirm-popover.md +93 -0
- package/docs/consistency-audit.md +383 -0
- package/docs/consumer-release-gate.md +90 -0
- package/docs/content-state.md +156 -0
- package/docs/context-panel.md +88 -0
- package/docs/cross-platform-core-normalization.md +118 -0
- package/docs/data-table.md +79 -0
- package/docs/date-picker.md +84 -0
- package/docs/description-list.md +75 -0
- package/docs/design-system-provider.md +139 -0
- package/docs/dropdown.md +78 -0
- package/docs/expansion-roadmap.md +285 -0
- package/docs/file-picker.md +59 -0
- package/docs/floating-action-button.md +111 -0
- package/docs/form.md +134 -0
- package/docs/generated/component-maturity.md +103 -0
- package/docs/generated/renderer-evidence.json +5597 -0
- package/docs/generated/renderer-evidence.md +132 -0
- package/docs/generated/showcase-manifest.json +3732 -0
- package/docs/icon.md +22 -0
- package/docs/identity.md +121 -0
- package/docs/image.md +84 -0
- package/docs/implementation-0.5.md +85 -0
- package/docs/layout-primitives.md +107 -0
- package/docs/layout.md +83 -0
- package/docs/library-reference-decisions.md +123 -0
- package/docs/link.md +67 -0
- package/docs/load-more.md +31 -0
- package/docs/mentions.md +82 -0
- package/docs/migration-0.2.md +108 -0
- package/docs/migration-0.3.md +72 -0
- package/docs/migration-0.5.md +82 -0
- package/docs/migration-0.6.md +197 -0
- package/docs/notification.md +54 -0
- package/docs/number-field.md +82 -0
- package/docs/otp-field.md +103 -0
- package/docs/pagination.md +139 -0
- package/docs/password-field.md +98 -0
- package/docs/popover.md +124 -0
- package/docs/promotion-candidates.md +169 -0
- package/docs/qr-code.md +69 -0
- package/docs/rating.md +58 -0
- package/docs/responsive-grid.md +90 -0
- package/docs/result.md +96 -0
- package/docs/showcase.md +97 -0
- package/docs/side-panel.md +71 -0
- package/docs/slider.md +79 -0
- package/docs/splitter.md +55 -0
- package/docs/statistic.md +16 -0
- package/docs/steps.md +115 -0
- package/docs/tag.md +57 -0
- package/docs/time-picker.md +88 -0
- package/docs/timeline.md +146 -0
- package/docs/toast.md +127 -0
- package/docs/tooltip.md +58 -0
- package/docs/tour.md +136 -0
- package/docs/transfer-list.md +94 -0
- package/docs/tree-select.md +101 -0
- package/docs/tree.md +123 -0
- package/docs/upload-item.md +68 -0
- package/docs/utility.md +53 -0
- package/docs/virtual-list.md +70 -0
- package/docs/watermark.md +58 -0
- package/package.json +402 -0
package/dist/tag.js
ADDED
|
@@ -0,0 +1,93 @@
|
|
|
1
|
+
import { resolveColorReference, } from "./color-references.js";
|
|
2
|
+
import { semanticColors } from "./semantic-colors.js";
|
|
3
|
+
import { fontWeight, spacing, stroke } from "./foundations.js";
|
|
4
|
+
export const tagDefaults = {
|
|
5
|
+
tone: "neutral",
|
|
6
|
+
};
|
|
7
|
+
function assertCopy(value, field) {
|
|
8
|
+
if (value.trim().length === 0) {
|
|
9
|
+
throw new TypeError(`Tag ${field} must not be empty`);
|
|
10
|
+
}
|
|
11
|
+
}
|
|
12
|
+
const supportedTones = [
|
|
13
|
+
"neutral",
|
|
14
|
+
"info",
|
|
15
|
+
"success",
|
|
16
|
+
"attention",
|
|
17
|
+
"brand",
|
|
18
|
+
];
|
|
19
|
+
export function validateTagDescriptor(descriptor) {
|
|
20
|
+
assertCopy(descriptor.label, "label");
|
|
21
|
+
if (descriptor.tone !== undefined &&
|
|
22
|
+
!supportedTones.includes(descriptor.tone)) {
|
|
23
|
+
throw new TypeError(`Unsupported Tag tone: ${String(descriptor.tone)}`);
|
|
24
|
+
}
|
|
25
|
+
}
|
|
26
|
+
export function resolveTagDescriptor(descriptor) {
|
|
27
|
+
validateTagDescriptor(descriptor);
|
|
28
|
+
return {
|
|
29
|
+
label: descriptor.label,
|
|
30
|
+
tone: descriptor.tone ?? tagDefaults.tone,
|
|
31
|
+
};
|
|
32
|
+
}
|
|
33
|
+
/**
|
|
34
|
+
* Rectangular, not the pill `radius.full` that `chipRecipe` and `badgeRecipe`
|
|
35
|
+
* use, so a static Tag never reads as a pressable Chip or a status Badge at a
|
|
36
|
+
* glance. No `states` and no `focus` contract: nothing here is ever pressed
|
|
37
|
+
* or focused.
|
|
38
|
+
*/
|
|
39
|
+
export const tagRecipe = {
|
|
40
|
+
slots: ["root", "label"],
|
|
41
|
+
defaults: tagDefaults,
|
|
42
|
+
tones: {
|
|
43
|
+
neutral: {
|
|
44
|
+
background: semanticColors.surface.sunken,
|
|
45
|
+
content: semanticColors.content.secondary,
|
|
46
|
+
border: null,
|
|
47
|
+
},
|
|
48
|
+
brand: {
|
|
49
|
+
background: semanticColors.surface.brand,
|
|
50
|
+
content: semanticColors.content.brand,
|
|
51
|
+
border: null,
|
|
52
|
+
},
|
|
53
|
+
info: {
|
|
54
|
+
background: semanticColors.feedback.info.badgeBackground,
|
|
55
|
+
content: semanticColors.feedback.info.foreground,
|
|
56
|
+
border: semanticColors.feedback.info.border,
|
|
57
|
+
},
|
|
58
|
+
success: {
|
|
59
|
+
background: semanticColors.feedback.success.badgeBackground,
|
|
60
|
+
content: semanticColors.feedback.success.foreground,
|
|
61
|
+
border: semanticColors.feedback.success.border,
|
|
62
|
+
},
|
|
63
|
+
attention: {
|
|
64
|
+
background: semanticColors.feedback.attention.badgeBackground,
|
|
65
|
+
content: semanticColors.feedback.attention.foreground,
|
|
66
|
+
border: semanticColors.feedback.attention.border,
|
|
67
|
+
},
|
|
68
|
+
},
|
|
69
|
+
size: {
|
|
70
|
+
// Static metadata still participates in Dynamic Type. A fixed 20px frame
|
|
71
|
+
// clips the label at accessibility sizes; minHeight preserves the compact
|
|
72
|
+
// base shape while allowing the intrinsic line box to grow.
|
|
73
|
+
minHeight: 20,
|
|
74
|
+
paddingHorizontal: spacing.xxs,
|
|
75
|
+
gap: spacing.xxs,
|
|
76
|
+
textVariant: "caption",
|
|
77
|
+
fontWeight: fontWeight.semibold,
|
|
78
|
+
},
|
|
79
|
+
radius: "sm",
|
|
80
|
+
borderWidth: stroke.default,
|
|
81
|
+
};
|
|
82
|
+
/** Resolve the same Tag recipe for non-CSS renderers. */
|
|
83
|
+
export function resolveTagPresentation(tone, palette) {
|
|
84
|
+
const contract = tagRecipe.tones[tone];
|
|
85
|
+
return {
|
|
86
|
+
background: resolveColorReference(contract.background, palette),
|
|
87
|
+
content: resolveColorReference(contract.content, palette),
|
|
88
|
+
border: contract.border === null
|
|
89
|
+
? null
|
|
90
|
+
: resolveColorReference(contract.border, palette),
|
|
91
|
+
};
|
|
92
|
+
}
|
|
93
|
+
//# sourceMappingURL=tag.js.map
|
package/dist/tag.js.map
ADDED
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"tag.js","sourceRoot":"","sources":["../src/tag.ts"],"names":[],"mappings":"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","sourcesContent":["import {\n resolveColorReference,\n type ColorReferencePalette,\n} from \"./color-references.js\";\nimport { semanticColors } from \"./semantic-colors.js\";\nimport { fontWeight, spacing, stroke } from \"./foundations.js\";\n\nexport type TagTone = \"neutral\" | \"info\" | \"success\" | \"attention\" | \"brand\";\n\nexport const tagDefaults = {\n tone: \"neutral\",\n} as const satisfies Readonly<{ tone: TagTone }>;\n\n/**\n * A single piece of static metadata (a position, a grade, a season). Tag has\n * no interaction axis at all — no selected, no pressed, no closable. Removing\n * or toggling a tag is deselection, which belongs to `Chip`.\n */\nexport type TagDescriptor = Readonly<{\n label: string;\n tone?: TagTone;\n}>;\n\nexport type ResolvedTagDescriptor = Readonly<{\n label: string;\n tone: TagTone;\n}>;\n\nfunction assertCopy(value: string, field: string): void {\n if (value.trim().length === 0) {\n throw new TypeError(`Tag ${field} must not be empty`);\n }\n}\n\nconst supportedTones: readonly TagTone[] = [\n \"neutral\",\n \"info\",\n \"success\",\n \"attention\",\n \"brand\",\n];\n\nexport function validateTagDescriptor(descriptor: TagDescriptor): void {\n assertCopy(descriptor.label, \"label\");\n if (\n descriptor.tone !== undefined &&\n !supportedTones.includes(descriptor.tone)\n ) {\n throw new TypeError(`Unsupported Tag tone: ${String(descriptor.tone)}`);\n }\n}\n\nexport function resolveTagDescriptor(\n descriptor: TagDescriptor,\n): ResolvedTagDescriptor {\n validateTagDescriptor(descriptor);\n return {\n label: descriptor.label,\n tone: descriptor.tone ?? tagDefaults.tone,\n };\n}\n\n/**\n * Rectangular, not the pill `radius.full` that `chipRecipe` and `badgeRecipe`\n * use, so a static Tag never reads as a pressable Chip or a status Badge at a\n * glance. No `states` and no `focus` contract: nothing here is ever pressed\n * or focused.\n */\nexport const tagRecipe = {\n slots: [\"root\", \"label\"] as const,\n defaults: tagDefaults,\n tones: {\n neutral: {\n background: semanticColors.surface.sunken,\n content: semanticColors.content.secondary,\n border: null,\n },\n brand: {\n background: semanticColors.surface.brand,\n content: semanticColors.content.brand,\n border: null,\n },\n info: {\n background: semanticColors.feedback.info.badgeBackground,\n content: semanticColors.feedback.info.foreground,\n border: semanticColors.feedback.info.border,\n },\n success: {\n background: semanticColors.feedback.success.badgeBackground,\n content: semanticColors.feedback.success.foreground,\n border: semanticColors.feedback.success.border,\n },\n attention: {\n background: semanticColors.feedback.attention.badgeBackground,\n content: semanticColors.feedback.attention.foreground,\n border: semanticColors.feedback.attention.border,\n },\n },\n size: {\n // Static metadata still participates in Dynamic Type. A fixed 20px frame\n // clips the label at accessibility sizes; minHeight preserves the compact\n // base shape while allowing the intrinsic line box to grow.\n minHeight: 20,\n paddingHorizontal: spacing.xxs,\n gap: spacing.xxs,\n textVariant: \"caption\",\n fontWeight: fontWeight.semibold,\n },\n radius: \"sm\",\n borderWidth: stroke.default,\n} as const;\n\nexport type ResolvedTagPresentation = Readonly<{\n background: string;\n content: string;\n border: string | null;\n}>;\n\n/** Resolve the same Tag recipe for non-CSS renderers. */\nexport function resolveTagPresentation(\n tone: TagTone,\n palette: ColorReferencePalette,\n): ResolvedTagPresentation {\n const contract = tagRecipe.tones[tone];\n return {\n background: resolveColorReference(contract.background, palette),\n content: resolveColorReference(contract.content, palette),\n border:\n contract.border === null\n ? null\n : resolveColorReference(contract.border, palette),\n };\n}\n"]}
|
|
@@ -0,0 +1,147 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* Timeline is a record of what already happened, not a position in a flow —
|
|
3
|
+
* that is Steps' job (see docs/steps.md and the boundary note in
|
|
4
|
+
* docs/timeline.md). Because there is no cursor, Timeline never derives a
|
|
5
|
+
* status from position: every item is simply "happened", and the connector
|
|
6
|
+
* between items carries no reached/unreached meaning. Ant Design's
|
|
7
|
+
* alternating left/right layout is intentionally not reproduced — it is a
|
|
8
|
+
* Web-only decoration with no equivalent in a single-direction native list;
|
|
9
|
+
* see docs/timeline.md for the rationale.
|
|
10
|
+
*/
|
|
11
|
+
export type TimelineItemTone = "neutral" | "info" | "success" | "attention";
|
|
12
|
+
export type TimelineItemDescriptor<Id extends string = string> = Readonly<{
|
|
13
|
+
id: Id;
|
|
14
|
+
label: string;
|
|
15
|
+
/** Product-formatted "when" copy, e.g. "3회 초" or "2024-01-15". Timeline never formats a clock, inning, or date itself. */
|
|
16
|
+
timestamp?: string;
|
|
17
|
+
/** Product-formatted supplementary detail, e.g. "안타로 1루 진출". */
|
|
18
|
+
description?: string;
|
|
19
|
+
tone?: TimelineItemTone;
|
|
20
|
+
}>;
|
|
21
|
+
export type TimelineDescriptor<Id extends string = string> = Readonly<{
|
|
22
|
+
items: readonly TimelineItemDescriptor<Id>[];
|
|
23
|
+
}>;
|
|
24
|
+
export declare const timelineDefaults: {
|
|
25
|
+
readonly itemTone: "neutral";
|
|
26
|
+
};
|
|
27
|
+
export type TimelineAccessibleNameInfo = Readonly<{
|
|
28
|
+
position: number;
|
|
29
|
+
total: number;
|
|
30
|
+
label: string;
|
|
31
|
+
}>;
|
|
32
|
+
/**
|
|
33
|
+
* Products own the exact phrase order and counter-word grammar, same reason
|
|
34
|
+
* Steps does not assemble its own accessible name (see docs/steps.md).
|
|
35
|
+
*/
|
|
36
|
+
export type ComposeTimelineAccessibleName = (info: TimelineAccessibleNameInfo) => string;
|
|
37
|
+
export type ResolvedTimelineItemDescriptor<Id extends string = string> = Omit<TimelineItemDescriptor<Id>, "tone"> & Readonly<{
|
|
38
|
+
tone: TimelineItemTone;
|
|
39
|
+
/** 1-indexed so position and label both preserve reading order for renderers. */
|
|
40
|
+
position: number;
|
|
41
|
+
total: number;
|
|
42
|
+
/** Order + label, for platforms without built-in list-position semantics. */
|
|
43
|
+
accessibleName: string;
|
|
44
|
+
}>;
|
|
45
|
+
export type ResolveTimelineOptions = Readonly<{
|
|
46
|
+
composeAccessibleName: ComposeTimelineAccessibleName;
|
|
47
|
+
}>;
|
|
48
|
+
export declare function validateTimelineItemDescriptor<Id extends string>(item: TimelineItemDescriptor<Id>): void;
|
|
49
|
+
export declare function validateTimelineDescriptor<Id extends string>(descriptor: TimelineDescriptor<Id>): void;
|
|
50
|
+
/**
|
|
51
|
+
* Attaches order-preserving accessible names to an already-ordered item list.
|
|
52
|
+
* Unlike Steps, no status is derived from position — every item already
|
|
53
|
+
* happened, so this only adds order and the resolved tone default.
|
|
54
|
+
*/
|
|
55
|
+
export declare function resolveTimelineDescriptor<Id extends string>(descriptor: TimelineDescriptor<Id>, options: ResolveTimelineOptions): readonly ResolvedTimelineItemDescriptor<Id>[];
|
|
56
|
+
export declare const timelineRecipe: {
|
|
57
|
+
readonly slots: readonly ["root", "item", "dot", "connector", "content", "timestamp", "label", "description"];
|
|
58
|
+
readonly gap: 16;
|
|
59
|
+
readonly dot: {
|
|
60
|
+
readonly diameter: 10;
|
|
61
|
+
readonly borderWidth: 1;
|
|
62
|
+
readonly tones: {
|
|
63
|
+
readonly neutral: {
|
|
64
|
+
readonly border: null;
|
|
65
|
+
readonly fill: Readonly<{
|
|
66
|
+
source: "theme";
|
|
67
|
+
key: "textMuted";
|
|
68
|
+
alpha?: number;
|
|
69
|
+
}>;
|
|
70
|
+
};
|
|
71
|
+
readonly info: {
|
|
72
|
+
readonly border: Readonly<{
|
|
73
|
+
source: "accent";
|
|
74
|
+
key: "info";
|
|
75
|
+
alpha?: number;
|
|
76
|
+
}>;
|
|
77
|
+
readonly fill: Readonly<{
|
|
78
|
+
source: "accent";
|
|
79
|
+
key: "info";
|
|
80
|
+
alpha?: number;
|
|
81
|
+
}>;
|
|
82
|
+
};
|
|
83
|
+
readonly success: {
|
|
84
|
+
readonly border: Readonly<{
|
|
85
|
+
source: "accent";
|
|
86
|
+
key: "success";
|
|
87
|
+
alpha?: number;
|
|
88
|
+
}>;
|
|
89
|
+
readonly fill: Readonly<{
|
|
90
|
+
source: "accent";
|
|
91
|
+
key: "success";
|
|
92
|
+
alpha?: number;
|
|
93
|
+
}>;
|
|
94
|
+
};
|
|
95
|
+
readonly attention: {
|
|
96
|
+
readonly border: Readonly<{
|
|
97
|
+
source: "accent";
|
|
98
|
+
key: "attention";
|
|
99
|
+
alpha?: number;
|
|
100
|
+
}>;
|
|
101
|
+
readonly fill: Readonly<{
|
|
102
|
+
source: "accent";
|
|
103
|
+
key: "attention";
|
|
104
|
+
alpha?: number;
|
|
105
|
+
}>;
|
|
106
|
+
};
|
|
107
|
+
};
|
|
108
|
+
};
|
|
109
|
+
/**
|
|
110
|
+
* A single tone, unlike stepsRecipe.connector's reached/unreached pair —
|
|
111
|
+
* Timeline has no cursor, so no segment is "not yet reached".
|
|
112
|
+
*/
|
|
113
|
+
readonly connector: {
|
|
114
|
+
readonly width: 1;
|
|
115
|
+
readonly tone: Readonly<{
|
|
116
|
+
source: "theme";
|
|
117
|
+
key: "border";
|
|
118
|
+
alpha?: number;
|
|
119
|
+
}>;
|
|
120
|
+
};
|
|
121
|
+
readonly timestamp: {
|
|
122
|
+
readonly textVariant: "caption";
|
|
123
|
+
readonly color: Readonly<{
|
|
124
|
+
source: "theme";
|
|
125
|
+
key: "textMuted";
|
|
126
|
+
alpha?: number;
|
|
127
|
+
}>;
|
|
128
|
+
};
|
|
129
|
+
readonly label: {
|
|
130
|
+
readonly textVariant: "body";
|
|
131
|
+
readonly fontWeight: "600";
|
|
132
|
+
readonly color: Readonly<{
|
|
133
|
+
source: "theme";
|
|
134
|
+
key: "text";
|
|
135
|
+
alpha?: number;
|
|
136
|
+
}>;
|
|
137
|
+
};
|
|
138
|
+
readonly description: {
|
|
139
|
+
readonly textVariant: "body";
|
|
140
|
+
readonly color: Readonly<{
|
|
141
|
+
source: "theme";
|
|
142
|
+
key: "textBody";
|
|
143
|
+
alpha?: number;
|
|
144
|
+
}>;
|
|
145
|
+
};
|
|
146
|
+
};
|
|
147
|
+
//# sourceMappingURL=timeline.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"timeline.d.ts","sourceRoot":"","sources":["../src/timeline.ts"],"names":[],"mappings":"AAKA;;;;;;;;;GASG;AACH,MAAM,MAAM,gBAAgB,GAAG,SAAS,GAAG,MAAM,GAAG,SAAS,GAAG,WAAW,CAAC;AAE5E,MAAM,MAAM,sBAAsB,CAAC,EAAE,SAAS,MAAM,GAAG,MAAM,IAAI,QAAQ,CAAC;IACxE,EAAE,EAAE,EAAE,CAAC;IACP,KAAK,EAAE,MAAM,CAAC;IACd,0HAA0H;IAC1H,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,gEAAgE;IAChE,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,IAAI,CAAC,EAAE,gBAAgB,CAAC;CACzB,CAAC,CAAC;AAEH,MAAM,MAAM,kBAAkB,CAAC,EAAE,SAAS,MAAM,GAAG,MAAM,IAAI,QAAQ,CAAC;IACpE,KAAK,EAAE,SAAS,sBAAsB,CAAC,EAAE,CAAC,EAAE,CAAC;CAC9C,CAAC,CAAC;AAEH,eAAO,MAAM,gBAAgB;;CAEgC,CAAC;AAE9D,MAAM,MAAM,0BAA0B,GAAG,QAAQ,CAAC;IAChD,QAAQ,EAAE,MAAM,CAAC;IACjB,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,MAAM,CAAC;CACf,CAAC,CAAC;AAEH;;;GAGG;AACH,MAAM,MAAM,6BAA6B,GAAG,CAC1C,IAAI,EAAE,0BAA0B,KAC7B,MAAM,CAAC;AAEZ,MAAM,MAAM,8BAA8B,CAAC,EAAE,SAAS,MAAM,GAAG,MAAM,IAAI,IAAI,CAC3E,sBAAsB,CAAC,EAAE,CAAC,EAC1B,MAAM,CACP,GACC,QAAQ,CAAC;IACP,IAAI,EAAE,gBAAgB,CAAC;IACvB,iFAAiF;IACjF,QAAQ,EAAE,MAAM,CAAC;IACjB,KAAK,EAAE,MAAM,CAAC;IACd,6EAA6E;IAC7E,cAAc,EAAE,MAAM,CAAC;CACxB,CAAC,CAAC;AAEL,MAAM,MAAM,sBAAsB,GAAG,QAAQ,CAAC;IAC5C,qBAAqB,EAAE,6BAA6B,CAAC;CACtD,CAAC,CAAC;AAQH,wBAAgB,8BAA8B,CAAC,EAAE,SAAS,MAAM,EAC9D,IAAI,EAAE,sBAAsB,CAAC,EAAE,CAAC,GAC/B,IAAI,CAqBN;AAED,wBAAgB,0BAA0B,CAAC,EAAE,SAAS,MAAM,EAC1D,UAAU,EAAE,kBAAkB,CAAC,EAAE,CAAC,GACjC,IAAI,CAYN;AAED;;;;GAIG;AACH,wBAAgB,yBAAyB,CAAC,EAAE,SAAS,MAAM,EACzD,UAAU,EAAE,kBAAkB,CAAC,EAAE,CAAC,EAClC,OAAO,EAAE,sBAAsB,GAC9B,SAAS,8BAA8B,CAAC,EAAE,CAAC,EAAE,CA2B/C;AAED,eAAO,MAAM,cAAc;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;IA+BzB;;;OAGG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAoCJ,CAAC"}
|
package/dist/timeline.js
ADDED
|
@@ -0,0 +1,127 @@
|
|
|
1
|
+
import { fontWeight, spacing, stroke } from "./foundations.js";
|
|
2
|
+
import { semanticColors } from "./semantic-colors.js";
|
|
3
|
+
export const timelineDefaults = {
|
|
4
|
+
itemTone: "neutral",
|
|
5
|
+
};
|
|
6
|
+
function assertNonEmpty(value, field) {
|
|
7
|
+
if (value.trim().length === 0) {
|
|
8
|
+
throw new TypeError(`Timeline ${field} must not be empty`);
|
|
9
|
+
}
|
|
10
|
+
}
|
|
11
|
+
export function validateTimelineItemDescriptor(item) {
|
|
12
|
+
assertNonEmpty(item.id, "item id");
|
|
13
|
+
if (item.id !== item.id.trim()) {
|
|
14
|
+
throw new TypeError("Timeline item id must not start or end with whitespace");
|
|
15
|
+
}
|
|
16
|
+
assertNonEmpty(item.label, "item label");
|
|
17
|
+
if (item.timestamp !== undefined) {
|
|
18
|
+
assertNonEmpty(item.timestamp, "item timestamp");
|
|
19
|
+
}
|
|
20
|
+
if (item.description !== undefined) {
|
|
21
|
+
assertNonEmpty(item.description, "item description");
|
|
22
|
+
}
|
|
23
|
+
if (item.tone !== undefined &&
|
|
24
|
+
item.tone !== "neutral" &&
|
|
25
|
+
item.tone !== "info" &&
|
|
26
|
+
item.tone !== "success" &&
|
|
27
|
+
item.tone !== "attention") {
|
|
28
|
+
throw new TypeError(`Unsupported Timeline item tone: ${String(item.tone)}`);
|
|
29
|
+
}
|
|
30
|
+
}
|
|
31
|
+
export function validateTimelineDescriptor(descriptor) {
|
|
32
|
+
if (descriptor.items.length === 0) {
|
|
33
|
+
throw new RangeError("Timeline must contain at least one item");
|
|
34
|
+
}
|
|
35
|
+
const ids = new Set();
|
|
36
|
+
for (const item of descriptor.items) {
|
|
37
|
+
validateTimelineItemDescriptor(item);
|
|
38
|
+
if (ids.has(item.id)) {
|
|
39
|
+
throw new TypeError(`Duplicate Timeline item id: ${item.id}`);
|
|
40
|
+
}
|
|
41
|
+
ids.add(item.id);
|
|
42
|
+
}
|
|
43
|
+
}
|
|
44
|
+
/**
|
|
45
|
+
* Attaches order-preserving accessible names to an already-ordered item list.
|
|
46
|
+
* Unlike Steps, no status is derived from position — every item already
|
|
47
|
+
* happened, so this only adds order and the resolved tone default.
|
|
48
|
+
*/
|
|
49
|
+
export function resolveTimelineDescriptor(descriptor, options) {
|
|
50
|
+
validateTimelineDescriptor(descriptor);
|
|
51
|
+
if (typeof options.composeAccessibleName !== "function") {
|
|
52
|
+
throw new TypeError("Timeline composeAccessibleName must be a function");
|
|
53
|
+
}
|
|
54
|
+
const total = descriptor.items.length;
|
|
55
|
+
return descriptor.items.map((item, index) => {
|
|
56
|
+
const position = index + 1;
|
|
57
|
+
const accessibleName = options.composeAccessibleName({
|
|
58
|
+
position,
|
|
59
|
+
total,
|
|
60
|
+
label: item.label,
|
|
61
|
+
});
|
|
62
|
+
if (typeof accessibleName !== "string" || accessibleName.trim().length === 0) {
|
|
63
|
+
throw new TypeError("Timeline composeAccessibleName must return a non-empty string");
|
|
64
|
+
}
|
|
65
|
+
return {
|
|
66
|
+
...item,
|
|
67
|
+
tone: item.tone ?? timelineDefaults.itemTone,
|
|
68
|
+
position,
|
|
69
|
+
total,
|
|
70
|
+
accessibleName,
|
|
71
|
+
};
|
|
72
|
+
});
|
|
73
|
+
}
|
|
74
|
+
export const timelineRecipe = {
|
|
75
|
+
slots: [
|
|
76
|
+
"root",
|
|
77
|
+
"item",
|
|
78
|
+
"dot",
|
|
79
|
+
"connector",
|
|
80
|
+
"content",
|
|
81
|
+
"timestamp",
|
|
82
|
+
"label",
|
|
83
|
+
"description",
|
|
84
|
+
],
|
|
85
|
+
gap: spacing.md,
|
|
86
|
+
dot: {
|
|
87
|
+
diameter: 10,
|
|
88
|
+
borderWidth: stroke.default,
|
|
89
|
+
tones: {
|
|
90
|
+
neutral: { border: null, fill: semanticColors.content.secondary },
|
|
91
|
+
info: {
|
|
92
|
+
border: semanticColors.feedback.info.border,
|
|
93
|
+
fill: semanticColors.feedback.info.foreground,
|
|
94
|
+
},
|
|
95
|
+
success: {
|
|
96
|
+
border: semanticColors.feedback.success.border,
|
|
97
|
+
fill: semanticColors.feedback.success.foreground,
|
|
98
|
+
},
|
|
99
|
+
attention: {
|
|
100
|
+
border: semanticColors.feedback.attention.border,
|
|
101
|
+
fill: semanticColors.feedback.attention.foreground,
|
|
102
|
+
},
|
|
103
|
+
},
|
|
104
|
+
},
|
|
105
|
+
/**
|
|
106
|
+
* A single tone, unlike stepsRecipe.connector's reached/unreached pair —
|
|
107
|
+
* Timeline has no cursor, so no segment is "not yet reached".
|
|
108
|
+
*/
|
|
109
|
+
connector: {
|
|
110
|
+
width: stroke.default,
|
|
111
|
+
tone: semanticColors.border.default,
|
|
112
|
+
},
|
|
113
|
+
timestamp: {
|
|
114
|
+
textVariant: "caption",
|
|
115
|
+
color: semanticColors.content.secondary,
|
|
116
|
+
},
|
|
117
|
+
label: {
|
|
118
|
+
textVariant: "body",
|
|
119
|
+
fontWeight: fontWeight.semibold,
|
|
120
|
+
color: semanticColors.content.primary,
|
|
121
|
+
},
|
|
122
|
+
description: {
|
|
123
|
+
textVariant: "body",
|
|
124
|
+
color: semanticColors.content.body,
|
|
125
|
+
},
|
|
126
|
+
};
|
|
127
|
+
//# sourceMappingURL=timeline.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"timeline.js","sourceRoot":"","sources":["../src/timeline.ts"],"names":[],"mappings":"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","sourcesContent":["import type { ColorReference } from \"./color-references.js\";\nimport type { FontWeightValue, TextVariant } from \"./foundations.js\";\nimport { fontWeight, spacing, stroke } from \"./foundations.js\";\nimport { semanticColors } from \"./semantic-colors.js\";\n\n/**\n * Timeline is a record of what already happened, not a position in a flow —\n * that is Steps' job (see docs/steps.md and the boundary note in\n * docs/timeline.md). Because there is no cursor, Timeline never derives a\n * status from position: every item is simply \"happened\", and the connector\n * between items carries no reached/unreached meaning. Ant Design's\n * alternating left/right layout is intentionally not reproduced — it is a\n * Web-only decoration with no equivalent in a single-direction native list;\n * see docs/timeline.md for the rationale.\n */\nexport type TimelineItemTone = \"neutral\" | \"info\" | \"success\" | \"attention\";\n\nexport type TimelineItemDescriptor<Id extends string = string> = Readonly<{\n id: Id;\n label: string;\n /** Product-formatted \"when\" copy, e.g. \"3회 초\" or \"2024-01-15\". Timeline never formats a clock, inning, or date itself. */\n timestamp?: string;\n /** Product-formatted supplementary detail, e.g. \"안타로 1루 진출\". */\n description?: string;\n tone?: TimelineItemTone;\n}>;\n\nexport type TimelineDescriptor<Id extends string = string> = Readonly<{\n items: readonly TimelineItemDescriptor<Id>[];\n}>;\n\nexport const timelineDefaults = {\n itemTone: \"neutral\",\n} as const satisfies Readonly<{ itemTone: TimelineItemTone }>;\n\nexport type TimelineAccessibleNameInfo = Readonly<{\n position: number;\n total: number;\n label: string;\n}>;\n\n/**\n * Products own the exact phrase order and counter-word grammar, same reason\n * Steps does not assemble its own accessible name (see docs/steps.md).\n */\nexport type ComposeTimelineAccessibleName = (\n info: TimelineAccessibleNameInfo,\n) => string;\n\nexport type ResolvedTimelineItemDescriptor<Id extends string = string> = Omit<\n TimelineItemDescriptor<Id>,\n \"tone\"\n> &\n Readonly<{\n tone: TimelineItemTone;\n /** 1-indexed so position and label both preserve reading order for renderers. */\n position: number;\n total: number;\n /** Order + label, for platforms without built-in list-position semantics. */\n accessibleName: string;\n }>;\n\nexport type ResolveTimelineOptions = Readonly<{\n composeAccessibleName: ComposeTimelineAccessibleName;\n}>;\n\nfunction assertNonEmpty(value: string, field: string): void {\n if (value.trim().length === 0) {\n throw new TypeError(`Timeline ${field} must not be empty`);\n }\n}\n\nexport function validateTimelineItemDescriptor<Id extends string>(\n item: TimelineItemDescriptor<Id>,\n): void {\n assertNonEmpty(item.id, \"item id\");\n if (item.id !== item.id.trim()) {\n throw new TypeError(\"Timeline item id must not start or end with whitespace\");\n }\n assertNonEmpty(item.label, \"item label\");\n if (item.timestamp !== undefined) {\n assertNonEmpty(item.timestamp, \"item timestamp\");\n }\n if (item.description !== undefined) {\n assertNonEmpty(item.description, \"item description\");\n }\n if (\n item.tone !== undefined &&\n item.tone !== \"neutral\" &&\n item.tone !== \"info\" &&\n item.tone !== \"success\" &&\n item.tone !== \"attention\"\n ) {\n throw new TypeError(`Unsupported Timeline item tone: ${String(item.tone)}`);\n }\n}\n\nexport function validateTimelineDescriptor<Id extends string>(\n descriptor: TimelineDescriptor<Id>,\n): void {\n if (descriptor.items.length === 0) {\n throw new RangeError(\"Timeline must contain at least one item\");\n }\n const ids = new Set<Id>();\n for (const item of descriptor.items) {\n validateTimelineItemDescriptor(item);\n if (ids.has(item.id)) {\n throw new TypeError(`Duplicate Timeline item id: ${item.id}`);\n }\n ids.add(item.id);\n }\n}\n\n/**\n * Attaches order-preserving accessible names to an already-ordered item list.\n * Unlike Steps, no status is derived from position — every item already\n * happened, so this only adds order and the resolved tone default.\n */\nexport function resolveTimelineDescriptor<Id extends string>(\n descriptor: TimelineDescriptor<Id>,\n options: ResolveTimelineOptions,\n): readonly ResolvedTimelineItemDescriptor<Id>[] {\n validateTimelineDescriptor(descriptor);\n if (typeof options.composeAccessibleName !== \"function\") {\n throw new TypeError(\"Timeline composeAccessibleName must be a function\");\n }\n\n const total = descriptor.items.length;\n return descriptor.items.map((item, index) => {\n const position = index + 1;\n const accessibleName = options.composeAccessibleName({\n position,\n total,\n label: item.label,\n });\n if (typeof accessibleName !== \"string\" || accessibleName.trim().length === 0) {\n throw new TypeError(\n \"Timeline composeAccessibleName must return a non-empty string\",\n );\n }\n return {\n ...item,\n tone: item.tone ?? timelineDefaults.itemTone,\n position,\n total,\n accessibleName,\n };\n });\n}\n\nexport const timelineRecipe = {\n slots: [\n \"root\",\n \"item\",\n \"dot\",\n \"connector\",\n \"content\",\n \"timestamp\",\n \"label\",\n \"description\",\n ] as const,\n gap: spacing.md,\n dot: {\n diameter: 10,\n borderWidth: stroke.default,\n tones: {\n neutral: { border: null, fill: semanticColors.content.secondary },\n info: {\n border: semanticColors.feedback.info.border,\n fill: semanticColors.feedback.info.foreground,\n },\n success: {\n border: semanticColors.feedback.success.border,\n fill: semanticColors.feedback.success.foreground,\n },\n attention: {\n border: semanticColors.feedback.attention.border,\n fill: semanticColors.feedback.attention.foreground,\n },\n },\n },\n /**\n * A single tone, unlike stepsRecipe.connector's reached/unreached pair —\n * Timeline has no cursor, so no segment is \"not yet reached\".\n */\n connector: {\n width: stroke.default,\n tone: semanticColors.border.default,\n },\n timestamp: {\n textVariant: \"caption\",\n color: semanticColors.content.secondary,\n },\n label: {\n textVariant: \"body\",\n fontWeight: fontWeight.semibold,\n color: semanticColors.content.primary,\n },\n description: {\n textVariant: \"body\",\n color: semanticColors.content.body,\n },\n} as const satisfies {\n slots: readonly string[];\n gap: number;\n dot: {\n diameter: number;\n borderWidth: number;\n tones: Record<\n TimelineItemTone,\n { border: ColorReference | null; fill: ColorReference }\n >;\n };\n connector: {\n width: number;\n tone: ColorReference;\n };\n timestamp: { textVariant: TextVariant; color: ColorReference };\n label: { textVariant: TextVariant; fontWeight: FontWeightValue; color: ColorReference };\n description: { textVariant: TextVariant; color: ColorReference };\n};\n"]}
|
package/dist/toast.d.ts
ADDED
|
@@ -0,0 +1,164 @@
|
|
|
1
|
+
import type { ToastTone } from "./component-recipes.js";
|
|
2
|
+
export type ToastId = string;
|
|
3
|
+
export type ToastAnnouncementPriority = "normal" | "high";
|
|
4
|
+
export type ToastPauseReason = "pointer" | "focus" | "window" | "gesture" | "programmatic";
|
|
5
|
+
export type ToastDismissReason = "timeout" | "action" | "close-action" | "escape" | "swipe" | "programmatic" | "queue-overflow" | "interrupted";
|
|
6
|
+
export type ToastDuplicatePolicy = "update" | "ignore";
|
|
7
|
+
export type ToastTimerUpdatePolicy = "preserve" | "restart";
|
|
8
|
+
export type ToastOverflowPolicy = "discard-oldest" | "discard-newest";
|
|
9
|
+
export type ToastActionDescriptor = Readonly<{
|
|
10
|
+
label: string;
|
|
11
|
+
accessibilityLabel?: string;
|
|
12
|
+
onAction(): void;
|
|
13
|
+
dismissOnAction?: boolean;
|
|
14
|
+
}>;
|
|
15
|
+
/**
|
|
16
|
+
* Renderer-neutral copy and behavior for one notification. Copy stays plain
|
|
17
|
+
* text so Web and Native can announce the exact same message without accepting
|
|
18
|
+
* renderer nodes in the core package.
|
|
19
|
+
*/
|
|
20
|
+
export type ToastDescriptor = Readonly<{
|
|
21
|
+
/** Stable product-owned identity used for in-place de-duplication. */
|
|
22
|
+
id: ToastId;
|
|
23
|
+
title?: string;
|
|
24
|
+
description: string;
|
|
25
|
+
tone?: ToastTone;
|
|
26
|
+
/** High priority interrupts; normal priority waits for a graceful announcement. */
|
|
27
|
+
priority?: ToastAnnouncementPriority;
|
|
28
|
+
/** Optional localized announcement when visible copy needs extra context. */
|
|
29
|
+
announcement?: string;
|
|
30
|
+
/** `null` is persistent. Values below the accessible minimum are clamped. */
|
|
31
|
+
durationMs?: number | null;
|
|
32
|
+
action?: ToastActionDescriptor;
|
|
33
|
+
/** Required localized name for the icon-only close affordance. */
|
|
34
|
+
closeLabel: string;
|
|
35
|
+
onDismiss?: (reason: ToastDismissReason) => void;
|
|
36
|
+
}>;
|
|
37
|
+
export type ResolvedToastActionDescriptor = Readonly<{
|
|
38
|
+
label: string;
|
|
39
|
+
accessibilityLabel: string;
|
|
40
|
+
onAction(): void;
|
|
41
|
+
dismissOnAction: boolean;
|
|
42
|
+
}>;
|
|
43
|
+
export type ResolvedToastDescriptor = Readonly<{
|
|
44
|
+
id: ToastId;
|
|
45
|
+
title: string | null;
|
|
46
|
+
description: string;
|
|
47
|
+
tone: ToastTone;
|
|
48
|
+
priority: ToastAnnouncementPriority;
|
|
49
|
+
announcement: string;
|
|
50
|
+
durationMs: number | null;
|
|
51
|
+
action: ResolvedToastActionDescriptor | null;
|
|
52
|
+
closeLabel: string;
|
|
53
|
+
onDismiss: ((reason: ToastDismissReason) => void) | null;
|
|
54
|
+
}>;
|
|
55
|
+
export type ToastAnnouncement = Readonly<{
|
|
56
|
+
message: string;
|
|
57
|
+
priority: ToastAnnouncementPriority;
|
|
58
|
+
}>;
|
|
59
|
+
export declare const toastBehaviorDefaults: {
|
|
60
|
+
readonly durationMs: 5000;
|
|
61
|
+
readonly minimumDurationMs: 5000;
|
|
62
|
+
readonly priority: "normal";
|
|
63
|
+
readonly dismissOnAction: true;
|
|
64
|
+
readonly maxVisible: 1;
|
|
65
|
+
readonly maxQueued: 20;
|
|
66
|
+
readonly duplicatePolicy: "update";
|
|
67
|
+
readonly timerUpdatePolicy: "preserve";
|
|
68
|
+
readonly overflowPolicy: "discard-oldest";
|
|
69
|
+
};
|
|
70
|
+
/** Rejects ambiguous identity and inaccessible copy before anything is queued. */
|
|
71
|
+
export declare function validateToastDescriptor(descriptor: ToastDescriptor): void;
|
|
72
|
+
/** Actionable notifications persist by default; every timer has a five-second floor. */
|
|
73
|
+
export declare function resolveToastDuration(descriptor: ToastDescriptor): number | null;
|
|
74
|
+
export declare function resolveToastDescriptor(descriptor: ToastDescriptor): ResolvedToastDescriptor;
|
|
75
|
+
export declare function resolveToastAnnouncement(descriptor: ToastDescriptor): ToastAnnouncement;
|
|
76
|
+
export type ToastPhase = "queued" | "visible" | "closing" | "closed";
|
|
77
|
+
export type ToastTimerStatus = "waiting" | "running" | "paused" | "persistent" | "stopped";
|
|
78
|
+
export type ToastTimerSnapshot = Readonly<{
|
|
79
|
+
status: ToastTimerStatus;
|
|
80
|
+
durationMs: number | null;
|
|
81
|
+
remainingMs: number | null;
|
|
82
|
+
pausedBy: readonly ToastPauseReason[];
|
|
83
|
+
}>;
|
|
84
|
+
export type ToastSessionSnapshot = Readonly<{
|
|
85
|
+
revision: number;
|
|
86
|
+
phase: ToastPhase;
|
|
87
|
+
descriptor: ResolvedToastDescriptor;
|
|
88
|
+
timer: ToastTimerSnapshot;
|
|
89
|
+
actionInvoked: boolean;
|
|
90
|
+
dismissReason: ToastDismissReason | null;
|
|
91
|
+
}>;
|
|
92
|
+
export type ToastSession = Readonly<{
|
|
93
|
+
getSnapshot(): ToastSessionSnapshot;
|
|
94
|
+
subscribe(listener: () => void): () => void;
|
|
95
|
+
/** Starts visibility and the timer. Queued time is never counted. */
|
|
96
|
+
show(): boolean;
|
|
97
|
+
update(descriptor: ToastDescriptor, timerPolicy?: ToastTimerUpdatePolicy): boolean;
|
|
98
|
+
pause(reason: ToastPauseReason): boolean;
|
|
99
|
+
resume(reason: ToastPauseReason): boolean;
|
|
100
|
+
/** Advances a renderer-owned clock; no global timer or Date dependency exists. */
|
|
101
|
+
advanceTime(elapsedMs: number): boolean;
|
|
102
|
+
invokeAction(): boolean;
|
|
103
|
+
dismiss(reason: ToastDismissReason): boolean;
|
|
104
|
+
/** Renderers call this once exit motion or immediate reduced-motion exit finishes. */
|
|
105
|
+
completeExit(): boolean;
|
|
106
|
+
interrupt(): boolean;
|
|
107
|
+
}>;
|
|
108
|
+
/** Owns one notification's action, timer, and dismiss lifecycle exactly once. */
|
|
109
|
+
export declare function createToastSession(descriptor: ToastDescriptor): ToastSession;
|
|
110
|
+
export type ToastStoreOptions = Readonly<{
|
|
111
|
+
maxVisible?: number;
|
|
112
|
+
maxQueued?: number;
|
|
113
|
+
duplicatePolicy?: ToastDuplicatePolicy;
|
|
114
|
+
timerUpdatePolicy?: ToastTimerUpdatePolicy;
|
|
115
|
+
overflowPolicy?: ToastOverflowPolicy;
|
|
116
|
+
}>;
|
|
117
|
+
export type ToastPublishOptions = Readonly<{
|
|
118
|
+
duplicatePolicy?: ToastDuplicatePolicy;
|
|
119
|
+
timerUpdatePolicy?: ToastTimerUpdatePolicy;
|
|
120
|
+
}>;
|
|
121
|
+
export type ToastPublishResult = Readonly<{
|
|
122
|
+
outcome: "added";
|
|
123
|
+
id: ToastId;
|
|
124
|
+
position: "visible" | "queued";
|
|
125
|
+
}> | Readonly<{
|
|
126
|
+
outcome: "updated";
|
|
127
|
+
id: ToastId;
|
|
128
|
+
position: "visible" | "queued";
|
|
129
|
+
}> | Readonly<{
|
|
130
|
+
outcome: "ignored";
|
|
131
|
+
id: ToastId;
|
|
132
|
+
reason: "duplicate" | "closing";
|
|
133
|
+
}> | Readonly<{
|
|
134
|
+
outcome: "discarded";
|
|
135
|
+
id: ToastId;
|
|
136
|
+
reason: "queue-overflow";
|
|
137
|
+
}>;
|
|
138
|
+
export type ToastStoreSnapshot = Readonly<{
|
|
139
|
+
visible: readonly ToastSessionSnapshot[];
|
|
140
|
+
queued: readonly ToastSessionSnapshot[];
|
|
141
|
+
}>;
|
|
142
|
+
export type ToastStore = Readonly<{
|
|
143
|
+
getSnapshot(): ToastStoreSnapshot;
|
|
144
|
+
subscribe(listener: () => void): () => void;
|
|
145
|
+
publish(descriptor: ToastDescriptor, options?: ToastPublishOptions): ToastPublishResult;
|
|
146
|
+
invokeAction(id: ToastId): boolean;
|
|
147
|
+
dismiss(id: ToastId, reason: ToastDismissReason): boolean;
|
|
148
|
+
/** Stable-id programmatic close shortcut. */
|
|
149
|
+
close(id: ToastId): boolean;
|
|
150
|
+
pause(id: ToastId, reason: ToastPauseReason): boolean;
|
|
151
|
+
resume(id: ToastId, reason: ToastPauseReason): boolean;
|
|
152
|
+
pauseAll(reason: ToastPauseReason): number;
|
|
153
|
+
resumeAll(reason: ToastPauseReason): number;
|
|
154
|
+
advanceTime(elapsedMs: number): number;
|
|
155
|
+
completeExit(id: ToastId): boolean;
|
|
156
|
+
/** Provider teardown closes every item exactly once without waiting for motion. */
|
|
157
|
+
dispose(): boolean;
|
|
158
|
+
}>;
|
|
159
|
+
/**
|
|
160
|
+
* Bounded FIFO coordinator. Visible items keep their slot through exit motion;
|
|
161
|
+
* queued items begin timing only after promotion into a vacated slot.
|
|
162
|
+
*/
|
|
163
|
+
export declare function createToastStore(options?: ToastStoreOptions): ToastStore;
|
|
164
|
+
//# sourceMappingURL=toast.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"toast.d.ts","sourceRoot":"","sources":["../src/toast.ts"],"names":[],"mappings":"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"}
|