@sequenceholdings/atlas-ui 0.1.3 → 0.1.5

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/package.json CHANGED
@@ -9,7 +9,7 @@
9
9
  "publishConfig": {
10
10
  "access": "public"
11
11
  },
12
- "version": "0.1.3",
12
+ "version": "0.1.5",
13
13
  "description": "Atlas shared UI component library for Artifact Studio apps",
14
14
  "type": "module",
15
15
  "sideEffects": [
@@ -25,10 +25,16 @@
25
25
  "default": "./dist/charts.mjs"
26
26
  },
27
27
  "./tokens.css": "./dist/tokens.css",
28
+ "./tokens.v2.css": "./tokens.v2.css",
29
+ "./tokens.v2.tenants.css": "./tokens.v2.tenants.css",
30
+ "./theme.v2.css": "./theme.v2.css",
28
31
  "./package.json": "./package.json"
29
32
  },
33
+ "//tokens.v2.tenants.css": "The OpCo [data-theme] overlay. It MUST be exported — Tailwind v4 resolves the @import through the package exports map (under the `style` condition), so without this entry the Atlas CSS build fails with 'not exported under the condition style'. It is intentionally kept OUT of `files` so it is NOT in the published tarball (the shared package stays opco-free, DES-127); only the Atlas monorepo build (which resolves via the workspace symlink) consumes it. No published consumer imports this subpath.",
30
34
  "files": [
31
- "dist"
35
+ "dist",
36
+ "tokens.v2.css",
37
+ "theme.v2.css"
32
38
  ],
33
39
  "peerDependencies": {
34
40
  "@tanstack/react-query": "^4.36.1",
@@ -73,13 +79,19 @@
73
79
  },
74
80
  "devDependencies": {
75
81
  "@microsoft/api-extractor": "^7.58.7",
82
+ "@types/js-yaml": "^4.0.9",
76
83
  "@vitejs/plugin-react": "^5.0.0",
84
+ "js-yaml": "^4.1.1",
85
+ "tsx": "^4.19.2",
77
86
  "typescript": "^5.6.0",
78
87
  "vite": "8.0.16",
79
- "vite-plugin-dts": "^4.5.4"
88
+ "vite-plugin-dts": "^4.5.4",
89
+ "vitest": "^4.1.5"
80
90
  },
81
91
  "scripts": {
82
- "build": "vite build && cp src/tokens.css dist/tokens.css",
92
+ "build": "tsx scripts/generate-tokens.ts && vite build && cp src/tokens.css dist/tokens.css",
93
+ "generate:tokens": "tsx scripts/generate-tokens.ts",
94
+ "test": "vitest run",
83
95
  "type-check": "tsc --noEmit"
84
96
  }
85
97
  }
package/theme.v2.css ADDED
@@ -0,0 +1,225 @@
1
+ /* GENERATED by atlas-ui/scripts/generate-tokens.ts — do not edit by hand. */
2
+ /* Tailwind @theme utility bridge (DES-223): every semantic role → a --color-* utility. */
3
+
4
+ @theme inline {
5
+ --color-background: var(--background);
6
+ --color-foreground: var(--foreground);
7
+ --color-card: var(--card);
8
+ --color-card-foreground: var(--card-foreground);
9
+ --color-popover: var(--popover);
10
+ --color-popover-foreground: var(--popover-foreground);
11
+ --color-shell: var(--shell);
12
+ --color-sidebar: var(--sidebar);
13
+ --color-sidebar-foreground: var(--sidebar-foreground);
14
+ --color-sidebar-accent: var(--sidebar-accent);
15
+ --color-sidebar-accent-foreground: var(--sidebar-accent-foreground);
16
+ --color-primary: var(--primary);
17
+ --color-primary-foreground: var(--primary-foreground);
18
+ --color-primary-hover: var(--primary-hover);
19
+ --color-secondary: var(--secondary);
20
+ --color-secondary-foreground: var(--secondary-foreground);
21
+ --color-muted: var(--muted);
22
+ --color-muted-foreground: var(--muted-foreground);
23
+ --color-accent: var(--accent);
24
+ --color-accent-foreground: var(--accent-foreground);
25
+ --color-expressive: var(--expressive);
26
+ --color-expressive-tint: var(--expressive-tint);
27
+ --color-expressive-border: var(--expressive-border);
28
+ --color-expressive-text: var(--expressive-text);
29
+ --color-destructive: var(--destructive);
30
+ --color-destructive-foreground: var(--destructive-foreground);
31
+ --color-border: var(--border);
32
+ --color-border-strong: var(--border-strong);
33
+ --color-input: var(--input);
34
+ --color-ring: var(--ring);
35
+ --color-foreground-primary: var(--text-primary);
36
+ --color-foreground-secondary: var(--text-secondary);
37
+ --color-foreground-muted: var(--text-muted);
38
+ --color-foreground-placeholder: var(--text-placeholder);
39
+ --color-foreground-disabled: var(--text-disabled);
40
+ --color-foreground-on-color: var(--text-on-color);
41
+ --color-field: var(--field);
42
+ --color-field-hover: var(--field-hover);
43
+ --color-field-disabled: var(--field-disabled);
44
+ --color-link: var(--link);
45
+ --color-link-hover: var(--link-hover);
46
+ --color-link-visited: var(--link-visited);
47
+ --color-icon-primary: var(--icon-primary);
48
+ --color-icon-secondary: var(--icon-secondary);
49
+ --color-icon-on-color: var(--icon-on-color);
50
+ --color-icon-disabled: var(--icon-disabled);
51
+ --color-inverse: var(--inverse);
52
+ --color-inverse-foreground: var(--inverse-foreground);
53
+ --color-overlay: var(--overlay);
54
+ --color-skeleton: var(--skeleton);
55
+ --color-skeleton-foreground: var(--skeleton-foreground);
56
+ --color-success: var(--success);
57
+ --color-success-foreground: var(--success-foreground);
58
+ --color-success-tint: var(--success-tint);
59
+ --color-success-text: var(--success-text);
60
+ --color-warning: var(--warning);
61
+ --color-warning-foreground: var(--warning-foreground);
62
+ --color-warning-tint: var(--warning-tint);
63
+ --color-warning-text: var(--warning-text);
64
+ --color-danger: var(--danger);
65
+ --color-danger-foreground: var(--danger-foreground);
66
+ --color-danger-tint: var(--danger-tint);
67
+ --color-danger-text: var(--danger-text);
68
+ --color-info: var(--info);
69
+ --color-info-foreground: var(--info-foreground);
70
+ --color-info-tint: var(--info-tint);
71
+ --color-info-text: var(--info-text);
72
+ --color-chart-1: var(--chart-1);
73
+ --color-chart-1-soft: var(--chart-1-soft);
74
+ --color-chart-2: var(--chart-2);
75
+ --color-chart-2-soft: var(--chart-2-soft);
76
+ --color-chart-3: var(--chart-3);
77
+ --color-chart-3-soft: var(--chart-3-soft);
78
+ --color-chart-4: var(--chart-4);
79
+ --color-chart-4-soft: var(--chart-4-soft);
80
+ --color-chart-5: var(--chart-5);
81
+ --color-chart-5-soft: var(--chart-5-soft);
82
+ --color-chart-success: var(--chart-success);
83
+ --color-chart-success-soft: var(--chart-success-soft);
84
+ --color-chart-danger: var(--chart-danger);
85
+ --color-chart-danger-soft: var(--chart-danger-soft);
86
+ --color-chart-mono-1: var(--chart-mono-1);
87
+ --color-chart-mono-2: var(--chart-mono-2);
88
+ --color-chart-mono-3: var(--chart-mono-3);
89
+ --color-chart-mono-4: var(--chart-mono-4);
90
+ --color-chart-mono-5: var(--chart-mono-5);
91
+ --color-chart-adjacent-1: var(--chart-adjacent-1);
92
+ --color-chart-adjacent-1-soft: var(--chart-adjacent-1-soft);
93
+ --color-chart-adjacent-2: var(--chart-adjacent-2);
94
+ --color-chart-adjacent-2-soft: var(--chart-adjacent-2-soft);
95
+ --color-chart-adjacent-3: var(--chart-adjacent-3);
96
+ --color-chart-adjacent-3-soft: var(--chart-adjacent-3-soft);
97
+ --color-chart-adjacent-4: var(--chart-adjacent-4);
98
+ --color-chart-adjacent-4-soft: var(--chart-adjacent-4-soft);
99
+ --color-chart-adjacent-5: var(--chart-adjacent-5);
100
+ --color-chart-adjacent-5-soft: var(--chart-adjacent-5-soft);
101
+ --color-identity-1: var(--identity-1);
102
+ --color-identity-1-text: var(--identity-1-text);
103
+ --color-identity-2: var(--identity-2);
104
+ --color-identity-2-text: var(--identity-2-text);
105
+ --color-identity-3: var(--identity-3);
106
+ --color-identity-3-text: var(--identity-3-text);
107
+ --color-identity-4: var(--identity-4);
108
+ --color-identity-4-text: var(--identity-4-text);
109
+ --color-identity-5: var(--identity-5);
110
+ --color-identity-5-text: var(--identity-5-text);
111
+ --color-identity-6: var(--identity-6);
112
+ --color-identity-6-text: var(--identity-6-text);
113
+ --color-identity-7: var(--identity-7);
114
+ --color-identity-7-text: var(--identity-7-text);
115
+ --color-identity-8: var(--identity-8);
116
+ --color-identity-8-text: var(--identity-8-text);
117
+ --color-sidebar-primary: var(--sidebar-primary);
118
+ --color-sidebar-primary-foreground: var(--sidebar-primary-foreground);
119
+ --color-sidebar-border: var(--sidebar-border);
120
+ --color-sidebar-ring: var(--sidebar-ring);
121
+ --color-surface: var(--surface);
122
+ --color-surface-hover: var(--surface-hover);
123
+ --color-highlight: var(--highlight);
124
+ --color-brand: var(--brand);
125
+
126
+ /* ── non-colour roles (DES-298) ──
127
+ Tailwind v4 compiles the --text-x--* sub-properties into the text-x
128
+ utility itself, each behind a --tw-* fallback, so ONE class carries
129
+ size + leading + weight + tracking and an explicit `font-medium` at a
130
+ call site still wins. `uppercase` and `font-mono` stay separate
131
+ utilities: there is no @theme channel for either. */
132
+ --text-page-title: var(--type-page-title);
133
+ --text-page-title--line-height: var(--type-page-title-leading);
134
+ --text-page-title--font-weight: var(--type-page-title-weight);
135
+ --text-page-title--letter-spacing: var(--type-page-title-tracking);
136
+ --text-heading: var(--type-heading);
137
+ --text-heading--line-height: var(--type-heading-leading);
138
+ --text-heading--font-weight: var(--type-heading-weight);
139
+ --text-body: var(--type-body);
140
+ --text-body--line-height: var(--type-body-leading);
141
+ --text-body--font-weight: var(--type-body-weight);
142
+ --text-label: var(--type-label);
143
+ --text-label--line-height: var(--type-label-leading);
144
+ --text-label--font-weight: var(--type-label-weight);
145
+ --text-record-name: var(--type-record-name);
146
+ --text-record-name--line-height: var(--type-record-name-leading);
147
+ --text-record-name--font-weight: var(--type-record-name-weight);
148
+ --text-caption: var(--type-caption);
149
+ --text-caption--line-height: var(--type-caption-leading);
150
+ --text-caption--font-weight: var(--type-caption-weight);
151
+ --text-eyebrow: var(--type-eyebrow);
152
+ --text-eyebrow--line-height: var(--type-eyebrow-leading);
153
+ --text-eyebrow--font-weight: var(--type-eyebrow-weight);
154
+ --text-eyebrow--letter-spacing: var(--type-eyebrow-tracking);
155
+ --text-control: var(--type-control);
156
+ --text-control--line-height: var(--type-control-leading);
157
+ --text-control--font-weight: var(--type-control-weight);
158
+ --text-control-sm: var(--type-control-sm);
159
+ --text-control-sm--line-height: var(--type-control-sm-leading);
160
+ --text-control-sm--font-weight: var(--type-control-sm-weight);
161
+ --text-badge: var(--type-badge);
162
+ --text-badge--line-height: var(--type-badge-leading);
163
+ --text-badge--font-weight: var(--type-badge-weight);
164
+ --text-code: var(--type-code);
165
+ --text-code--line-height: var(--type-code-leading);
166
+ --text-code--font-weight: var(--type-code-weight);
167
+ --text-metric: var(--type-metric);
168
+ --text-metric--line-height: var(--type-metric-leading);
169
+ --text-metric--font-weight: var(--type-metric-weight);
170
+ --text-metric--letter-spacing: var(--type-metric-tracking);
171
+ --spacing-inline-tight: var(--space-inline-tight);
172
+ --spacing-inline: var(--space-inline);
173
+ --spacing-inline-loose: var(--space-inline-loose);
174
+ --spacing-compact-tight: var(--space-compact-tight);
175
+ --spacing-compact: var(--space-compact);
176
+ --spacing-default: var(--space-default);
177
+ --spacing-roomy: var(--space-roomy);
178
+ --spacing-stack-tight: var(--space-stack-tight);
179
+ --spacing-stack: var(--space-stack);
180
+ --spacing-stack-group: var(--space-stack-group);
181
+ --spacing-stack-section: var(--space-stack-section);
182
+ --radius-control: var(--corner-control);
183
+ --radius-badge: var(--corner-badge);
184
+ --radius-surface-nested: var(--corner-surface-nested);
185
+ --radius-surface: var(--corner-surface);
186
+ --shadow-flat: var(--elevation-flat);
187
+ --shadow-resting: var(--elevation-resting);
188
+ --shadow-popover: var(--elevation-popover);
189
+ --shadow-modal: var(--elevation-modal);
190
+ --ease-hover: var(--motion-hover-ease);
191
+ --ease-enter: var(--motion-enter-ease);
192
+ --ease-exit: var(--motion-exit-ease);
193
+
194
+ /* ── legacy typography (DES-93) ──
195
+ `--text-xs--font-weight` must live in @theme: a gated :root
196
+ declaration alone does not make Tailwind emit font-weight on
197
+ `.text-xs` (verified against @tailwindcss/postcss). */
198
+ --text-xs--font-weight: var(--ds-weight-medium);
199
+
200
+ /* DES-372 — default Tailwind shadow ladder → elevation roles.
201
+ Remaps the stock size utilities so ~850 shadow-sm/md/lg call sites
202
+ resolve to the same values as the roles, with no call-site churn.
203
+ Do NOT remap --shadow-inner (inset; different job). */
204
+ --shadow-2xs: var(--elevation-resting);
205
+ --shadow-xs: var(--elevation-resting);
206
+ --shadow-sm: var(--elevation-resting);
207
+ --shadow: var(--elevation-resting);
208
+ --shadow-md: var(--elevation-popover);
209
+ --shadow-lg: var(--elevation-popover);
210
+ --shadow-xl: var(--elevation-modal);
211
+ --shadow-2xl: var(--elevation-modal);
212
+
213
+ /* No --duration-* mapping: it is not a Tailwind v4 theme namespace, so it
214
+ mints nothing (verified). Read --motion-<role>-duration directly, or
215
+ `duration-[var(--motion-hover-duration)]`. Faking it with --animate-*
216
+ would put a keyframe name where a duration belongs. */
217
+ }
218
+
219
+ @utility text-eyebrow {
220
+ text-transform: uppercase;
221
+ }
222
+
223
+ @utility text-code {
224
+ font-family: var(--font-mono);
225
+ }