@riverbankcms/sdk 0.60.1 → 0.60.3
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/_dts/api/src/bookingRecords.d.ts +7 -0
- package/dist/_dts/api/src/communications.d.ts +1 -0
- package/dist/_dts/api/src/contentRuntime.d.ts +8 -0
- package/dist/_dts/api/src/endpoints.d.ts +17 -0
- package/dist/_dts/api/src/index.d.ts +1 -1
- package/dist/_dts/api/src/media.d.ts +1 -1
- package/dist/_dts/api/src/siteManagementEndpoints.d.ts +45 -1
- package/dist/_dts/api/src/siteRuntimeEndpoints.d.ts +24 -1
- package/dist/_dts/api/src/siteSettings.d.ts +7 -0
- package/dist/_dts/api/src/types.d.ts +1 -1
- package/dist/_dts/blocks/src/system/blocks/location-map.d.ts +3 -0
- package/dist/_dts/blocks/src/system/blocks/site-footer.d.ts +1 -0
- package/dist/_dts/blocks/src/system/runtime/nodes/location-map.server.d.ts +4 -0
- package/dist/_dts/blocks/src/system/runtime/nodes/location-map.shared.d.ts +38 -0
- package/dist/_dts/blocks/src/system/runtime/nodes/location-map.view.d.ts +2 -1
- package/dist/_dts/core/src/business-address.d.ts +38 -0
- package/dist/_dts/core/src/index.d.ts +1 -0
- package/dist/_dts/db/src/generated/supabase/database.types.d.ts +22 -0
- package/dist/_dts/preview-next/src/client/blocks/runOptimisticCustomizeAction.d.ts +44 -0
- package/dist/_dts/preview-next/src/client/preview/PreviewEditorSidebar.d.ts +7 -1
- package/dist/_dts/preview-next/src/client/preview/PreviewShell.d.ts +12 -1
- package/dist/_dts/preview-next/src/client/preview/PreviewShellLayout.d.ts +6 -1
- package/dist/_dts/preview-next/src/client/preview/StyleConfigurator.d.ts +20 -0
- package/dist/_dts/preview-next/src/client/preview/StyleConfigurator.state.d.ts +99 -0
- package/dist/_dts/sdk/src/public-api/contracts.d.ts +11 -1
- package/dist/_dts/sdk/src/version.d.ts +1 -1
- package/dist/_dts/theme-core/src/buttons/constants.d.ts +9 -1
- package/dist/_dts/theme-core/src/buttons/generateButtonCss.d.ts +16 -11
- package/dist/_dts/theme-core/src/buttons/generateDefaultButtonSystem.d.ts +9 -16
- package/dist/_dts/theme-core/src/buttons/index.d.ts +1 -0
- package/dist/_dts/theme-core/src/buttons/personalities/brushed-wash.d.ts +11 -0
- package/dist/_dts/theme-core/src/buttons/personalities/confident-chip.d.ts +11 -0
- package/dist/_dts/theme-core/src/buttons/personalities/editorial-link.d.ts +11 -0
- package/dist/_dts/theme-core/src/buttons/personalities/index.d.ts +14 -0
- package/dist/_dts/theme-core/src/buttons/personalities/ink-stamp.d.ts +11 -0
- package/dist/_dts/theme-core/src/buttons/personalities/pebble.d.ts +11 -0
- package/dist/_dts/theme-core/src/buttons/personalities/soft-pill.d.ts +11 -0
- package/dist/_dts/theme-core/src/buttons/personalities/types.d.ts +268 -0
- package/dist/_dts/theme-core/src/buttons/types.d.ts +253 -72
- package/dist/_dts/theme-core/src/mock-themes/all.d.ts +69 -15
- package/dist/_dts/theme-core/src/palette/index.d.ts +1 -0
- package/dist/_dts/theme-core/src/palette/variants/brand-led.d.ts +28 -0
- package/dist/_dts/theme-core/src/palette/variants/high-contrast.d.ts +28 -0
- package/dist/_dts/theme-core/src/palette/variants/index.d.ts +17 -0
- package/dist/_dts/theme-core/src/palette/variants/soft-natural.d.ts +28 -0
- package/dist/_dts/theme-core/src/palette/variants/types.d.ts +154 -0
- package/dist/_dts/theme-core/src/palette/variants/warm-neutral.d.ts +28 -0
- package/dist/_dts/theme-core/src/schema.d.ts +122 -10
- package/dist/_dts/theme-core/src/site-styles/compatibility.d.ts +109 -0
- package/dist/_dts/theme-core/src/site-styles/curatedSiteStyles.d.ts +193 -0
- package/dist/_dts/theme-core/src/site-styles/index.d.ts +1 -0
- package/dist/_dts/theme-core/src/site-styles/pageDesignEditorModel.d.ts +4 -0
- package/dist/_dts/theme-core/src/site-styles/previewCompiler.d.ts +43 -2
- package/dist/_dts/theme-core/src/site-styles/runtimeCompiler.d.ts +23 -1
- package/dist/_dts/ui/src/badge.d.ts +1 -1
- package/dist/_dts/ui/src/callout.d.ts +1 -1
- package/dist/cli/index.mjs +1471 -263
- package/dist/client/bookings.mjs +294 -144
- package/dist/client/client.mjs +3483 -2219
- package/dist/client/hooks.mjs +2765 -1654
- package/dist/client/rendering/client.mjs +3251 -2134
- package/dist/client/rendering/islands.mjs +1842 -728
- package/dist/client/rendering.mjs +41242 -39978
- package/dist/preview-next/before-render.mjs +17 -0
- package/dist/preview-next/client/runtime.mjs +10110 -8271
- package/dist/preview-next/middleware.mjs +17 -0
- package/dist/server/components.mjs +3500 -2364
- package/dist/server/config-validation.mjs +2996 -1885
- package/dist/server/config.mjs +2996 -1885
- package/dist/server/data.mjs +2765 -1654
- package/dist/server/index.mjs +18 -1
- package/dist/server/next.mjs +3215 -2079
- package/dist/server/page-converter.mjs +2910 -1816
- package/dist/server/prebuild.mjs +1 -1
- package/dist/server/rendering/server.mjs +3500 -2364
- package/dist/server/rendering.mjs +3500 -2364
- package/dist/server/routing.mjs +2943 -1704
- package/dist/server/server.mjs +2766 -1655
- package/dist/server/theme-bridge.mjs +1435 -481
- package/dist/server/theme.mjs +1087 -492
- package/package.json +1 -1
- package/dist/_dts/preview-next/src/client/preview/PreviewSiteStyleSwitcher.d.ts +0 -11
- package/dist/_dts/preview-next/src/client/preview/PreviewSiteStyleSwitcher.state.d.ts +0 -43
|
@@ -46,172 +46,767 @@ function brandNonEmptyString(value, label) {
|
|
|
46
46
|
return value;
|
|
47
47
|
}
|
|
48
48
|
|
|
49
|
+
// ../theme-core/src/site-styles/compatibility.ts
|
|
50
|
+
import { z } from "zod";
|
|
51
|
+
var STYLE_AXIS_VALUES = {
|
|
52
|
+
tone: ["minimal", "classic", "bold"],
|
|
53
|
+
energy: ["calm", "vibrant"],
|
|
54
|
+
motion: ["subtle", "standard", "expressive"],
|
|
55
|
+
era: ["editorial", "modern", "organic", "technical", "retro"]
|
|
56
|
+
};
|
|
57
|
+
var styleTagsSchema = z.object({
|
|
58
|
+
tone: z.enum(STYLE_AXIS_VALUES.tone).optional(),
|
|
59
|
+
energy: z.enum(STYLE_AXIS_VALUES.energy).optional(),
|
|
60
|
+
motion: z.enum(STYLE_AXIS_VALUES.motion).optional(),
|
|
61
|
+
era: z.enum(STYLE_AXIS_VALUES.era).optional()
|
|
62
|
+
});
|
|
63
|
+
|
|
49
64
|
// ../theme-core/src/schema.ts
|
|
50
|
-
import { z as
|
|
65
|
+
import { z as z14 } from "zod";
|
|
51
66
|
|
|
52
67
|
// ../theme-core/src/lib/media.ts
|
|
53
|
-
import
|
|
54
|
-
var hotspotSchema =
|
|
55
|
-
x:
|
|
56
|
-
y:
|
|
57
|
-
radius:
|
|
68
|
+
import z2 from "zod";
|
|
69
|
+
var hotspotSchema = z2.object({
|
|
70
|
+
x: z2.number().min(0).max(1),
|
|
71
|
+
y: z2.number().min(0).max(1),
|
|
72
|
+
radius: z2.number().optional()
|
|
58
73
|
});
|
|
59
|
-
var rotationSchema =
|
|
60
|
-
var rectSchema =
|
|
61
|
-
var aspectCropSchema =
|
|
62
|
-
aspect:
|
|
63
|
-
rect:
|
|
64
|
-
hotspot:
|
|
65
|
-
rotation:
|
|
74
|
+
var rotationSchema = z2.union([z2.literal(0), z2.literal(90), z2.literal(180), z2.literal(270)]);
|
|
75
|
+
var rectSchema = z2.tuple([z2.number(), z2.number(), z2.number(), z2.number()]);
|
|
76
|
+
var aspectCropSchema = z2.object({
|
|
77
|
+
aspect: z2.preprocess((value) => value == null ? void 0 : value, z2.string().optional()),
|
|
78
|
+
rect: z2.preprocess((value) => value == null ? void 0 : value, rectSchema.optional()),
|
|
79
|
+
hotspot: z2.preprocess((value) => value == null ? void 0 : value, hotspotSchema.optional()),
|
|
80
|
+
rotation: z2.preprocess((value) => value == null ? void 0 : value, rotationSchema.optional())
|
|
66
81
|
});
|
|
67
|
-
var transformSchema =
|
|
68
|
-
aspectCrops:
|
|
82
|
+
var transformSchema = z2.object({
|
|
83
|
+
aspectCrops: z2.preprocess((value) => {
|
|
69
84
|
if (!value || typeof value !== "object" || Array.isArray(value)) {
|
|
70
85
|
return void 0;
|
|
71
86
|
}
|
|
72
87
|
return value;
|
|
73
|
-
},
|
|
88
|
+
}, z2.record(z2.string(), aspectCropSchema.catch({}))).optional(),
|
|
74
89
|
rect: rectSchema.optional(),
|
|
75
90
|
hotspot: hotspotSchema.optional(),
|
|
76
91
|
rotation: rotationSchema.optional()
|
|
77
92
|
});
|
|
78
|
-
var mediaSchema =
|
|
79
|
-
type:
|
|
80
|
-
purpose:
|
|
81
|
-
placeholder:
|
|
82
|
-
assetId:
|
|
83
|
-
identifier:
|
|
84
|
-
src:
|
|
85
|
-
alt:
|
|
86
|
-
filename:
|
|
87
|
-
mimeType:
|
|
88
|
-
width:
|
|
89
|
-
height:
|
|
90
|
-
storageBucket:
|
|
91
|
-
storagePath:
|
|
93
|
+
var mediaSchema = z2.object({
|
|
94
|
+
type: z2.enum(["image", "video", "audio", "document", "spreadsheet", "archive"]),
|
|
95
|
+
purpose: z2.string().optional(),
|
|
96
|
+
placeholder: z2.boolean().default(true).optional(),
|
|
97
|
+
assetId: z2.string().optional(),
|
|
98
|
+
identifier: z2.string().optional(),
|
|
99
|
+
src: z2.string().optional(),
|
|
100
|
+
alt: z2.string().optional(),
|
|
101
|
+
filename: z2.string().optional(),
|
|
102
|
+
mimeType: z2.string().optional(),
|
|
103
|
+
width: z2.number().optional(),
|
|
104
|
+
height: z2.number().optional(),
|
|
105
|
+
storageBucket: z2.string().optional(),
|
|
106
|
+
storagePath: z2.string().optional(),
|
|
92
107
|
transform: transformSchema.optional()
|
|
93
108
|
});
|
|
94
109
|
|
|
95
110
|
// ../theme-core/src/buttons/types.ts
|
|
96
|
-
import { z as
|
|
97
|
-
var
|
|
98
|
-
|
|
99
|
-
|
|
100
|
-
|
|
101
|
-
|
|
102
|
-
|
|
103
|
-
|
|
104
|
-
|
|
105
|
-
|
|
106
|
-
var
|
|
107
|
-
var
|
|
108
|
-
var
|
|
109
|
-
|
|
110
|
-
|
|
111
|
+
import { z as z3 } from "zod";
|
|
112
|
+
var VARIANT_ROLES = [
|
|
113
|
+
"primary",
|
|
114
|
+
"secondary",
|
|
115
|
+
"outline",
|
|
116
|
+
"ghost",
|
|
117
|
+
"link",
|
|
118
|
+
"tertiary",
|
|
119
|
+
"accent"
|
|
120
|
+
];
|
|
121
|
+
var cornerStyleSchema = z3.enum(["square", "rounded", "pill"]);
|
|
122
|
+
var shadowSizeSchema = z3.enum(["none", "low", "medium", "high"]);
|
|
123
|
+
var textTransformSchema = z3.enum(["none", "uppercase", "lowercase", "capitalize"]);
|
|
124
|
+
var fontWeightSchema = z3.union([z3.literal(500), z3.literal(600), z3.literal(700)]);
|
|
125
|
+
var buttonTypographySchema = z3.enum(["body", "heading"]);
|
|
126
|
+
var letterSpacingSchema = z3.enum(["tight", "normal", "loose"]);
|
|
127
|
+
var hoverTransformSchema = z3.enum(["none", "lift", "scale", "press"]);
|
|
128
|
+
var hoverColorSchema = z3.enum(["none", "brighten", "darken", "saturate", "token"]);
|
|
129
|
+
var buttonPaddingPresetSchema = z3.enum(["compact", "default", "spacious"]);
|
|
130
|
+
var gradientStyleSchema = z3.enum(["linear", "radial", "conic"]);
|
|
131
|
+
var gradientSharpnessSchema = z3.enum(["smooth", "medium", "hard"]);
|
|
132
|
+
var prioritySchema = z3.union([z3.literal(1), z3.literal(2), z3.literal(3)]);
|
|
133
|
+
var variantRoleSchema = z3.enum(VARIANT_ROLES);
|
|
134
|
+
var buttonSizeNameSchema = z3.enum(["sm", "md", "lg", "xl"]);
|
|
135
|
+
var PADDING_TOKEN_PATTERN = /^(?:0|\d+(?:\.\d+)?(?:rem|em|px|%))$/;
|
|
136
|
+
var paddingShorthandSchema = z3.string().refine(
|
|
137
|
+
(value) => {
|
|
138
|
+
const parts = value.split(/\s+/).filter(Boolean);
|
|
139
|
+
return parts.length === 2 && parts.every((token) => PADDING_TOKEN_PATTERN.test(token));
|
|
140
|
+
},
|
|
141
|
+
{
|
|
142
|
+
message: 'Padding must be two space-separated CSS length tokens (e.g. "0.5rem 1rem"). Use `0` for zero.'
|
|
143
|
+
}
|
|
144
|
+
);
|
|
145
|
+
var buttonSizeConfigSchema = z3.object({
|
|
146
|
+
padding: paddingShorthandSchema,
|
|
147
|
+
fontSize: z3.string().optional()
|
|
111
148
|
});
|
|
112
|
-
var buttonSizesSchema =
|
|
149
|
+
var buttonSizesSchema = z3.object({
|
|
113
150
|
sm: buttonSizeConfigSchema,
|
|
114
151
|
md: buttonSizeConfigSchema,
|
|
115
152
|
lg: buttonSizeConfigSchema,
|
|
116
153
|
xl: buttonSizeConfigSchema.optional()
|
|
117
|
-
})
|
|
118
|
-
|
|
119
|
-
|
|
120
|
-
|
|
121
|
-
|
|
122
|
-
|
|
123
|
-
|
|
124
|
-
"border-trace"
|
|
125
|
-
]);
|
|
126
|
-
var buttonGlobalSettingsSchema = z2.object({
|
|
154
|
+
}).transform(({ sm, md, lg, xl }) => ({
|
|
155
|
+
sm,
|
|
156
|
+
md,
|
|
157
|
+
lg,
|
|
158
|
+
xl: xl ?? lg
|
|
159
|
+
}));
|
|
160
|
+
var buttonGlobalSettingsSchema = z3.object({
|
|
127
161
|
cornerStyle: cornerStyleSchema,
|
|
128
|
-
cornerRadius:
|
|
162
|
+
cornerRadius: z3.number().min(0).max(24).optional(),
|
|
129
163
|
shadow: shadowSizeSchema,
|
|
130
164
|
textTransform: textTransformSchema,
|
|
131
165
|
fontWeight: fontWeightSchema,
|
|
132
|
-
|
|
133
|
-
|
|
166
|
+
/**
|
|
167
|
+
* @deprecated Set per-variant via `variant.border.widthClass` instead.
|
|
168
|
+
* Schema field is preserved so existing presets parse; the value is unread
|
|
169
|
+
* by the current generator and will be removed once the legacy
|
|
170
|
+
* `primitives/content/components/Button.tsx` slot exports are deleted.
|
|
171
|
+
*/
|
|
172
|
+
borderWidth: z3.union([z3.literal(1), z3.literal(2), z3.literal(3)]),
|
|
173
|
+
// === Family-level typography ===
|
|
174
|
+
// Typography source (body or heading) — selects which theme typography pool to inherit
|
|
134
175
|
typography: buttonTypographySchema.optional(),
|
|
176
|
+
// Font size for all variants in the family (Tailwind token, e.g. "text-xs", "text-sm")
|
|
177
|
+
// Sized variants get this as default; fixed variants inherit unless they override.
|
|
178
|
+
// Size class CSS may still override at run time for sized variants.
|
|
179
|
+
fontSize: z3.string().optional(),
|
|
180
|
+
// Letter spacing applied to all variants
|
|
181
|
+
letterSpacing: letterSpacingSchema.optional(),
|
|
135
182
|
// Italic style
|
|
136
|
-
italic:
|
|
137
|
-
// Padding preset (applies to
|
|
183
|
+
italic: z3.boolean().optional(),
|
|
184
|
+
// Padding preset (applies to sized variants without a sizes config)
|
|
138
185
|
paddingPreset: buttonPaddingPresetSchema.optional(),
|
|
139
186
|
hoverTransform: hoverTransformSchema,
|
|
140
187
|
hoverColor: hoverColorSchema,
|
|
141
188
|
// When hoverColor is 'token', this specifies which token to use
|
|
142
|
-
hoverColorToken:
|
|
189
|
+
hoverColorToken: z3.string().optional(),
|
|
143
190
|
// Gradient settings (if any variant uses gradients)
|
|
144
191
|
gradientStyle: gradientStyleSchema.optional(),
|
|
145
|
-
gradientAngle:
|
|
192
|
+
gradientAngle: z3.number().min(0).max(360).optional(),
|
|
146
193
|
gradientSharpness: gradientSharpnessSchema.optional()
|
|
147
194
|
});
|
|
148
|
-
var gradientDirectionSchema =
|
|
149
|
-
var buttonBackgroundSchema =
|
|
150
|
-
|
|
151
|
-
|
|
152
|
-
type:
|
|
153
|
-
stops:
|
|
195
|
+
var gradientDirectionSchema = z3.enum(["to-r", "to-l", "to-t", "to-b", "to-tr", "to-tl", "to-br", "to-bl"]);
|
|
196
|
+
var buttonBackgroundSchema = z3.discriminatedUnion("type", [
|
|
197
|
+
z3.object({ type: z3.literal("solid"), colorToken: z3.string() }),
|
|
198
|
+
z3.object({
|
|
199
|
+
type: z3.literal("gradient"),
|
|
200
|
+
stops: z3.array(z3.string()).min(2),
|
|
154
201
|
direction: gradientDirectionSchema
|
|
155
202
|
}),
|
|
156
|
-
|
|
203
|
+
z3.object({ type: z3.literal("transparent") })
|
|
157
204
|
]);
|
|
158
|
-
var effectApplicationSchema =
|
|
159
|
-
effectId:
|
|
160
|
-
options:
|
|
205
|
+
var effectApplicationSchema = z3.object({
|
|
206
|
+
effectId: z3.string(),
|
|
207
|
+
options: z3.record(z3.string(), z3.any()).optional()
|
|
208
|
+
});
|
|
209
|
+
var buttonBorderSchema = z3.object({
|
|
210
|
+
widthClass: z3.string(),
|
|
211
|
+
colorToken: z3.string()
|
|
161
212
|
});
|
|
162
|
-
var
|
|
163
|
-
|
|
164
|
-
|
|
213
|
+
var variantShadowSchema = z3.object({
|
|
214
|
+
elevation: z3.enum(["none", "low", "medium", "high"]),
|
|
215
|
+
softness: z3.enum(["crisp", "soft", "hard"]).nullable(),
|
|
216
|
+
position: z3.enum(["bottom", "bottom-right"]).default("bottom")
|
|
165
217
|
});
|
|
166
|
-
var
|
|
167
|
-
|
|
168
|
-
|
|
169
|
-
|
|
170
|
-
|
|
171
|
-
backgroundTreatment: backgroundTreatmentSchema,
|
|
172
|
-
color: z2.string().optional(),
|
|
173
|
-
gradientColors: z2.tuple([z2.string(), z2.string()]).optional(),
|
|
174
|
-
borderColor: z2.string().optional(),
|
|
175
|
-
outlineHoverEffect: outlineHoverEffectSchema.optional(),
|
|
176
|
-
effectPreset: z2.string().optional()
|
|
218
|
+
var variantEffectsSchema = z3.object({
|
|
219
|
+
base: z3.array(effectApplicationSchema).optional(),
|
|
220
|
+
hover: z3.array(effectApplicationSchema).optional(),
|
|
221
|
+
active: z3.array(effectApplicationSchema).optional(),
|
|
222
|
+
focus: z3.array(effectApplicationSchema).optional()
|
|
177
223
|
});
|
|
178
|
-
var
|
|
179
|
-
|
|
180
|
-
|
|
181
|
-
|
|
182
|
-
|
|
224
|
+
var variantSizeOverridesSchema = z3.object({
|
|
225
|
+
sm: buttonSizeConfigSchema.optional(),
|
|
226
|
+
md: buttonSizeConfigSchema.optional(),
|
|
227
|
+
lg: buttonSizeConfigSchema.optional(),
|
|
228
|
+
xl: buttonSizeConfigSchema.optional()
|
|
229
|
+
});
|
|
230
|
+
var buttonVariantSchema = z3.object({
|
|
231
|
+
id: z3.string(),
|
|
232
|
+
name: z3.string().min(1).max(20),
|
|
233
|
+
enabled: z3.boolean(),
|
|
234
|
+
priority: prioritySchema,
|
|
183
235
|
// Base appearance (token-based)
|
|
184
236
|
background: buttonBackgroundSchema,
|
|
185
|
-
textColorToken:
|
|
186
|
-
|
|
237
|
+
textColorToken: z3.string(),
|
|
238
|
+
/** Tailwind radius token (e.g. `'rounded-md'`). Omit to inherit from `global.cornerStyle`. */
|
|
239
|
+
borderRadius: z3.string().optional(),
|
|
187
240
|
// Optional shadow override (uses theme.shadow if not specified)
|
|
188
|
-
shadow:
|
|
189
|
-
elevation: z2.enum(["none", "low", "medium", "high"]),
|
|
190
|
-
softness: z2.enum(["crisp", "soft", "hard"]).nullable(),
|
|
191
|
-
position: z2.enum(["bottom", "bottom-right"]).default("bottom")
|
|
192
|
-
}).optional(),
|
|
241
|
+
shadow: variantShadowSchema.optional(),
|
|
193
242
|
// Border (optional)
|
|
194
243
|
border: buttonBorderSchema.optional(),
|
|
195
|
-
// Padding (optional, defaults to "0.5rem 1rem")
|
|
196
|
-
padding: z2.string().optional(),
|
|
197
|
-
// Font size (optional, Tailwind text size class)
|
|
198
|
-
fontSize: z2.string().optional(),
|
|
199
244
|
// Hover background token (per-variant override, takes precedence over global hoverColorToken)
|
|
200
|
-
hoverBackgroundToken:
|
|
245
|
+
hoverBackgroundToken: z3.string().optional(),
|
|
201
246
|
// Effect composition
|
|
202
|
-
effects:
|
|
203
|
-
|
|
204
|
-
|
|
205
|
-
active: z2.array(effectApplicationSchema).optional(),
|
|
206
|
-
focus: z2.array(effectApplicationSchema).optional()
|
|
207
|
-
}).optional()
|
|
247
|
+
effects: variantEffectsSchema.optional(),
|
|
248
|
+
// Per-variant size overrides — see VariantSizeOverrides
|
|
249
|
+
sizes: variantSizeOverridesSchema.optional()
|
|
208
250
|
});
|
|
209
|
-
var buttonSystemSchema =
|
|
251
|
+
var buttonSystemSchema = z3.object({
|
|
210
252
|
global: buttonGlobalSettingsSchema,
|
|
211
|
-
variants:
|
|
253
|
+
variants: z3.array(buttonVariantSchema).min(1).max(6),
|
|
212
254
|
sizes: buttonSizesSchema.optional()
|
|
213
255
|
});
|
|
214
256
|
|
|
257
|
+
// ../theme-core/src/buttons/generateButtonCss.ts
|
|
258
|
+
var BUTTON_SIZE_NAMES = buttonSizeNameSchema.options;
|
|
259
|
+
|
|
260
|
+
// ../theme-core/src/buttons/personalities/types.ts
|
|
261
|
+
import { z as z4 } from "zod";
|
|
262
|
+
function asButtonPersonalityId(value) {
|
|
263
|
+
if (value.length === 0) {
|
|
264
|
+
throw new Error("ButtonPersonalityId must be a non-empty string");
|
|
265
|
+
}
|
|
266
|
+
return value;
|
|
267
|
+
}
|
|
268
|
+
var buttonPersonalityIdSchema = z4.string().min(1).transform((value) => asButtonPersonalityId(value));
|
|
269
|
+
var buttonPersonalitySchema = z4.object({
|
|
270
|
+
id: buttonPersonalityIdSchema,
|
|
271
|
+
name: z4.string().min(1),
|
|
272
|
+
description: z4.string().min(1),
|
|
273
|
+
tags: styleTagsSchema,
|
|
274
|
+
buttonSystem: buttonSystemSchema
|
|
275
|
+
});
|
|
276
|
+
function defineButtonPersonality(input) {
|
|
277
|
+
return {
|
|
278
|
+
id: asButtonPersonalityId(input.id),
|
|
279
|
+
name: input.name,
|
|
280
|
+
description: input.description,
|
|
281
|
+
tags: input.tags,
|
|
282
|
+
buttonSystem: input.buttonSystem
|
|
283
|
+
};
|
|
284
|
+
}
|
|
285
|
+
|
|
286
|
+
// ../theme-core/src/buttons/personalities/brushed-wash.ts
|
|
287
|
+
var brushedWash = defineButtonPersonality({
|
|
288
|
+
id: "brushed-wash",
|
|
289
|
+
name: "Brushed Wash",
|
|
290
|
+
description: "Watercolour-gradient buttons with soft shadows and generous padding.",
|
|
291
|
+
tags: { tone: "classic", energy: "vibrant", motion: "standard", era: "organic" },
|
|
292
|
+
buttonSystem: {
|
|
293
|
+
global: {
|
|
294
|
+
cornerStyle: "rounded",
|
|
295
|
+
shadow: "low",
|
|
296
|
+
textTransform: "none",
|
|
297
|
+
fontWeight: 500,
|
|
298
|
+
borderWidth: 1,
|
|
299
|
+
hoverTransform: "none",
|
|
300
|
+
hoverColor: "none"
|
|
301
|
+
},
|
|
302
|
+
sizes: {
|
|
303
|
+
sm: { padding: "0.75rem 2rem", fontSize: "text-sm" },
|
|
304
|
+
md: { padding: "1rem 2.5rem" },
|
|
305
|
+
lg: { padding: "1.25rem 3rem", fontSize: "text-lg" },
|
|
306
|
+
xl: { padding: "1.625rem 3.75rem", fontSize: "text-xl" }
|
|
307
|
+
},
|
|
308
|
+
variants: [
|
|
309
|
+
{
|
|
310
|
+
id: "primary",
|
|
311
|
+
name: "Primary",
|
|
312
|
+
enabled: true,
|
|
313
|
+
priority: 1,
|
|
314
|
+
background: {
|
|
315
|
+
type: "gradient",
|
|
316
|
+
stops: ["primary", "accent"],
|
|
317
|
+
direction: "to-r"
|
|
318
|
+
},
|
|
319
|
+
textColorToken: "primaryForeground",
|
|
320
|
+
borderRadius: "rounded-lg",
|
|
321
|
+
shadow: { elevation: "low", softness: "soft", position: "bottom" },
|
|
322
|
+
effects: {
|
|
323
|
+
hover: [{ effectId: "opacity-reduce", options: { reduction: -15 } }]
|
|
324
|
+
}
|
|
325
|
+
},
|
|
326
|
+
{
|
|
327
|
+
id: "secondary",
|
|
328
|
+
name: "Secondary",
|
|
329
|
+
enabled: true,
|
|
330
|
+
priority: 2,
|
|
331
|
+
background: {
|
|
332
|
+
type: "gradient",
|
|
333
|
+
stops: ["secondary", "accent"],
|
|
334
|
+
direction: "to-br"
|
|
335
|
+
},
|
|
336
|
+
textColorToken: "primaryForeground",
|
|
337
|
+
borderRadius: "rounded-lg",
|
|
338
|
+
shadow: { elevation: "low", softness: "soft", position: "bottom" },
|
|
339
|
+
effects: {
|
|
340
|
+
hover: [{ effectId: "opacity-reduce", options: { reduction: -15 } }]
|
|
341
|
+
}
|
|
342
|
+
},
|
|
343
|
+
{
|
|
344
|
+
id: "outline",
|
|
345
|
+
name: "Outline",
|
|
346
|
+
enabled: true,
|
|
347
|
+
priority: 3,
|
|
348
|
+
background: { type: "transparent" },
|
|
349
|
+
textColorToken: "primary",
|
|
350
|
+
borderRadius: "rounded-lg",
|
|
351
|
+
border: { widthClass: "border", colorToken: "primary" },
|
|
352
|
+
effects: {
|
|
353
|
+
hover: [{ effectId: "background-on-hover", options: { colorToken: "surface" } }]
|
|
354
|
+
}
|
|
355
|
+
},
|
|
356
|
+
{
|
|
357
|
+
id: "ghost",
|
|
358
|
+
name: "Ghost",
|
|
359
|
+
enabled: true,
|
|
360
|
+
priority: 3,
|
|
361
|
+
background: { type: "transparent" },
|
|
362
|
+
textColorToken: "text",
|
|
363
|
+
borderRadius: "rounded-lg",
|
|
364
|
+
effects: {
|
|
365
|
+
hover: [
|
|
366
|
+
{ effectId: "background-on-hover", options: { colorToken: "surface" } }
|
|
367
|
+
]
|
|
368
|
+
}
|
|
369
|
+
}
|
|
370
|
+
]
|
|
371
|
+
}
|
|
372
|
+
});
|
|
373
|
+
|
|
374
|
+
// ../theme-core/src/buttons/personalities/confident-chip.ts
|
|
375
|
+
var confidentChip = defineButtonPersonality({
|
|
376
|
+
id: "confident-chip",
|
|
377
|
+
name: "Confident Chip",
|
|
378
|
+
description: "Mid-radius solid buttons with a crisp hover.",
|
|
379
|
+
tags: { tone: "classic", energy: "calm", motion: "standard", era: "modern" },
|
|
380
|
+
buttonSystem: {
|
|
381
|
+
global: {
|
|
382
|
+
cornerStyle: "rounded",
|
|
383
|
+
shadow: "medium",
|
|
384
|
+
textTransform: "none",
|
|
385
|
+
fontWeight: 600,
|
|
386
|
+
borderWidth: 1,
|
|
387
|
+
hoverTransform: "none",
|
|
388
|
+
hoverColor: "none"
|
|
389
|
+
},
|
|
390
|
+
variants: [
|
|
391
|
+
{
|
|
392
|
+
id: "primary",
|
|
393
|
+
name: "Primary",
|
|
394
|
+
enabled: true,
|
|
395
|
+
priority: 1,
|
|
396
|
+
background: { type: "solid", colorToken: "primary" },
|
|
397
|
+
textColorToken: "primaryForeground",
|
|
398
|
+
borderRadius: "rounded-md",
|
|
399
|
+
shadow: { elevation: "medium", softness: "soft", position: "bottom" },
|
|
400
|
+
effects: {
|
|
401
|
+
hover: [{ effectId: "darken-background", options: { amount: 60 } }],
|
|
402
|
+
active: [{ effectId: "scale-down", options: { scale: "0.97" } }]
|
|
403
|
+
}
|
|
404
|
+
},
|
|
405
|
+
{
|
|
406
|
+
id: "secondary",
|
|
407
|
+
name: "Secondary",
|
|
408
|
+
enabled: true,
|
|
409
|
+
priority: 2,
|
|
410
|
+
background: { type: "solid", colorToken: "surface" },
|
|
411
|
+
textColorToken: "text",
|
|
412
|
+
borderRadius: "rounded-md",
|
|
413
|
+
border: { widthClass: "border", colorToken: "border" },
|
|
414
|
+
effects: {
|
|
415
|
+
hover: [{ effectId: "background-on-hover", options: { colorToken: "background" } }]
|
|
416
|
+
}
|
|
417
|
+
},
|
|
418
|
+
{
|
|
419
|
+
id: "outline",
|
|
420
|
+
name: "Outline",
|
|
421
|
+
enabled: true,
|
|
422
|
+
priority: 3,
|
|
423
|
+
background: { type: "transparent" },
|
|
424
|
+
textColorToken: "primary",
|
|
425
|
+
borderRadius: "rounded-md",
|
|
426
|
+
border: { widthClass: "border", colorToken: "primary" },
|
|
427
|
+
effects: {
|
|
428
|
+
hover: [{ effectId: "background-on-hover", options: { colorToken: "surface" } }]
|
|
429
|
+
}
|
|
430
|
+
},
|
|
431
|
+
{
|
|
432
|
+
id: "ghost",
|
|
433
|
+
name: "Ghost",
|
|
434
|
+
enabled: true,
|
|
435
|
+
priority: 3,
|
|
436
|
+
background: { type: "transparent" },
|
|
437
|
+
textColorToken: "primary",
|
|
438
|
+
borderRadius: "rounded-md",
|
|
439
|
+
effects: {
|
|
440
|
+
hover: [{ effectId: "background-on-hover", options: { colorToken: "surface" } }]
|
|
441
|
+
}
|
|
442
|
+
}
|
|
443
|
+
]
|
|
444
|
+
}
|
|
445
|
+
});
|
|
446
|
+
|
|
447
|
+
// ../theme-core/src/buttons/personalities/editorial-link.ts
|
|
448
|
+
var editorialLink = defineButtonPersonality({
|
|
449
|
+
id: "editorial-link",
|
|
450
|
+
name: "Editorial Link",
|
|
451
|
+
description: "Link-style with a growing underline. Refined, typographic.",
|
|
452
|
+
tags: { tone: "minimal", energy: "calm", motion: "subtle", era: "editorial" },
|
|
453
|
+
buttonSystem: {
|
|
454
|
+
global: {
|
|
455
|
+
cornerStyle: "square",
|
|
456
|
+
shadow: "none",
|
|
457
|
+
textTransform: "none",
|
|
458
|
+
fontWeight: 500,
|
|
459
|
+
borderWidth: 1,
|
|
460
|
+
hoverTransform: "none",
|
|
461
|
+
hoverColor: "none"
|
|
462
|
+
},
|
|
463
|
+
variants: [
|
|
464
|
+
{
|
|
465
|
+
id: "primary",
|
|
466
|
+
name: "Primary",
|
|
467
|
+
enabled: true,
|
|
468
|
+
priority: 1,
|
|
469
|
+
background: { type: "transparent" },
|
|
470
|
+
textColorToken: "text",
|
|
471
|
+
borderRadius: "rounded-none",
|
|
472
|
+
shadow: { elevation: "none", softness: null, position: "bottom" },
|
|
473
|
+
sizes: {
|
|
474
|
+
sm: { padding: "0.25rem 0" },
|
|
475
|
+
md: { padding: "0.5rem 0" },
|
|
476
|
+
lg: { padding: "0.625rem 0" },
|
|
477
|
+
xl: { padding: "0.75rem 0" }
|
|
478
|
+
},
|
|
479
|
+
effects: {
|
|
480
|
+
base: [
|
|
481
|
+
{ effectId: "border-bottom-grow", options: { height: 2, colorToken: "text", origin: "left" } }
|
|
482
|
+
]
|
|
483
|
+
}
|
|
484
|
+
},
|
|
485
|
+
{
|
|
486
|
+
id: "secondary",
|
|
487
|
+
name: "Secondary",
|
|
488
|
+
enabled: true,
|
|
489
|
+
priority: 2,
|
|
490
|
+
background: { type: "transparent" },
|
|
491
|
+
textColorToken: "mutedText",
|
|
492
|
+
borderRadius: "rounded-none",
|
|
493
|
+
shadow: { elevation: "none", softness: null, position: "bottom" },
|
|
494
|
+
sizes: {
|
|
495
|
+
sm: { padding: "0.25rem 0" },
|
|
496
|
+
md: { padding: "0.5rem 0" },
|
|
497
|
+
lg: { padding: "0.625rem 0" },
|
|
498
|
+
xl: { padding: "0.75rem 0" }
|
|
499
|
+
},
|
|
500
|
+
effects: {
|
|
501
|
+
base: [
|
|
502
|
+
{ effectId: "border-bottom-grow", options: { height: 1, colorToken: "mutedText", origin: "left" } }
|
|
503
|
+
]
|
|
504
|
+
}
|
|
505
|
+
},
|
|
506
|
+
{
|
|
507
|
+
id: "outline",
|
|
508
|
+
name: "Outline",
|
|
509
|
+
enabled: true,
|
|
510
|
+
priority: 3,
|
|
511
|
+
background: { type: "transparent" },
|
|
512
|
+
textColorToken: "accent",
|
|
513
|
+
borderRadius: "rounded-none",
|
|
514
|
+
shadow: { elevation: "none", softness: null, position: "bottom" },
|
|
515
|
+
sizes: {
|
|
516
|
+
sm: { padding: "0.25rem 0" },
|
|
517
|
+
md: { padding: "0.5rem 0" },
|
|
518
|
+
lg: { padding: "0.625rem 0" },
|
|
519
|
+
xl: { padding: "0.75rem 0" }
|
|
520
|
+
},
|
|
521
|
+
effects: {
|
|
522
|
+
base: [
|
|
523
|
+
{ effectId: "border-bottom-grow", options: { height: 1, colorToken: "accent", origin: "left" } }
|
|
524
|
+
]
|
|
525
|
+
}
|
|
526
|
+
},
|
|
527
|
+
{
|
|
528
|
+
id: "ghost",
|
|
529
|
+
name: "Ghost",
|
|
530
|
+
enabled: true,
|
|
531
|
+
priority: 3,
|
|
532
|
+
background: { type: "transparent" },
|
|
533
|
+
textColorToken: "mutedText",
|
|
534
|
+
borderRadius: "rounded-none",
|
|
535
|
+
shadow: { elevation: "none", softness: null, position: "bottom" },
|
|
536
|
+
sizes: {
|
|
537
|
+
sm: { padding: "0.25rem 0" },
|
|
538
|
+
md: { padding: "0.5rem 0" },
|
|
539
|
+
lg: { padding: "0.625rem 0" },
|
|
540
|
+
xl: { padding: "0.75rem 0" }
|
|
541
|
+
},
|
|
542
|
+
effects: {
|
|
543
|
+
hover: [{ effectId: "opacity-reduce", options: { reduction: -20 } }]
|
|
544
|
+
}
|
|
545
|
+
}
|
|
546
|
+
]
|
|
547
|
+
}
|
|
548
|
+
});
|
|
549
|
+
|
|
550
|
+
// ../theme-core/src/buttons/personalities/ink-stamp.ts
|
|
551
|
+
var inkStamp = defineButtonPersonality({
|
|
552
|
+
id: "ink-stamp",
|
|
553
|
+
name: "Ink Stamp",
|
|
554
|
+
description: "Hand-stamped block-print buttons with a slight lift on hover.",
|
|
555
|
+
tags: { tone: "bold", energy: "vibrant", motion: "standard", era: "organic" },
|
|
556
|
+
buttonSystem: {
|
|
557
|
+
global: {
|
|
558
|
+
cornerStyle: "rounded",
|
|
559
|
+
shadow: "none",
|
|
560
|
+
textTransform: "uppercase",
|
|
561
|
+
fontWeight: 600,
|
|
562
|
+
borderWidth: 1,
|
|
563
|
+
hoverTransform: "none",
|
|
564
|
+
hoverColor: "none",
|
|
565
|
+
letterSpacing: "loose"
|
|
566
|
+
},
|
|
567
|
+
sizes: {
|
|
568
|
+
sm: { padding: "0.5rem 1.25rem", fontSize: "text-xs" },
|
|
569
|
+
md: { padding: "0.75rem 1.75rem", fontSize: "text-sm" },
|
|
570
|
+
lg: { padding: "0.875rem 2.25rem", fontSize: "text-base" },
|
|
571
|
+
xl: { padding: "1.125rem 2.75rem", fontSize: "text-lg" }
|
|
572
|
+
},
|
|
573
|
+
variants: [
|
|
574
|
+
{
|
|
575
|
+
id: "primary",
|
|
576
|
+
name: "Primary",
|
|
577
|
+
enabled: true,
|
|
578
|
+
priority: 1,
|
|
579
|
+
background: { type: "solid", colorToken: "primary" },
|
|
580
|
+
textColorToken: "primaryForeground",
|
|
581
|
+
borderRadius: "rounded-md",
|
|
582
|
+
effects: {
|
|
583
|
+
hover: [
|
|
584
|
+
{ effectId: "drop-shadow", options: { intensity: "medium" } },
|
|
585
|
+
{ effectId: "scale-up", options: { scale: "1.02" } }
|
|
586
|
+
],
|
|
587
|
+
active: [{ effectId: "scale-down", options: { scale: "0.98" } }]
|
|
588
|
+
}
|
|
589
|
+
},
|
|
590
|
+
{
|
|
591
|
+
id: "secondary",
|
|
592
|
+
name: "Secondary",
|
|
593
|
+
enabled: true,
|
|
594
|
+
priority: 2,
|
|
595
|
+
background: { type: "transparent" },
|
|
596
|
+
textColorToken: "primary",
|
|
597
|
+
borderRadius: "rounded-md",
|
|
598
|
+
border: { widthClass: "border-2", colorToken: "primary" },
|
|
599
|
+
effects: {
|
|
600
|
+
hover: [{ effectId: "background-on-hover", options: { colorToken: "surface" } }]
|
|
601
|
+
}
|
|
602
|
+
},
|
|
603
|
+
{
|
|
604
|
+
id: "outline",
|
|
605
|
+
name: "Outline",
|
|
606
|
+
enabled: true,
|
|
607
|
+
priority: 3,
|
|
608
|
+
background: { type: "transparent" },
|
|
609
|
+
textColorToken: "text",
|
|
610
|
+
borderRadius: "rounded-md",
|
|
611
|
+
border: { widthClass: "border-2", colorToken: "border" },
|
|
612
|
+
effects: {
|
|
613
|
+
hover: [{ effectId: "background-on-hover", options: { colorToken: "surface" } }]
|
|
614
|
+
}
|
|
615
|
+
},
|
|
616
|
+
{
|
|
617
|
+
id: "ghost",
|
|
618
|
+
name: "Ghost",
|
|
619
|
+
enabled: true,
|
|
620
|
+
priority: 3,
|
|
621
|
+
background: { type: "transparent" },
|
|
622
|
+
textColorToken: "accent",
|
|
623
|
+
borderRadius: "rounded-none",
|
|
624
|
+
sizes: {
|
|
625
|
+
sm: { padding: "0.375rem 0", fontSize: "text-xs" },
|
|
626
|
+
md: { padding: "0.5rem 0", fontSize: "text-sm" },
|
|
627
|
+
lg: { padding: "0.625rem 0", fontSize: "text-base" },
|
|
628
|
+
xl: { padding: "0.75rem 0", fontSize: "text-lg" }
|
|
629
|
+
},
|
|
630
|
+
effects: {
|
|
631
|
+
base: [{ effectId: "border-bottom-grow", options: { height: 1, colorToken: "accent", origin: "left" } }]
|
|
632
|
+
}
|
|
633
|
+
}
|
|
634
|
+
]
|
|
635
|
+
}
|
|
636
|
+
});
|
|
637
|
+
|
|
638
|
+
// ../theme-core/src/buttons/personalities/pebble.ts
|
|
639
|
+
var pebble = defineButtonPersonality({
|
|
640
|
+
id: "pebble",
|
|
641
|
+
name: "Pebble",
|
|
642
|
+
description: "Generous pill buttons with a soft hover lift.",
|
|
643
|
+
tags: { tone: "classic", energy: "calm", motion: "standard", era: "organic" },
|
|
644
|
+
buttonSystem: {
|
|
645
|
+
global: {
|
|
646
|
+
cornerStyle: "pill",
|
|
647
|
+
shadow: "none",
|
|
648
|
+
textTransform: "none",
|
|
649
|
+
fontWeight: 500,
|
|
650
|
+
borderWidth: 2,
|
|
651
|
+
hoverTransform: "none",
|
|
652
|
+
hoverColor: "none"
|
|
653
|
+
},
|
|
654
|
+
sizes: {
|
|
655
|
+
sm: { padding: "0.625rem 1.75rem", fontSize: "text-sm" },
|
|
656
|
+
md: { padding: "0.875rem 2.25rem" },
|
|
657
|
+
lg: { padding: "1.125rem 2.75rem", fontSize: "text-lg" },
|
|
658
|
+
xl: { padding: "1.5rem 3.5rem", fontSize: "text-xl" }
|
|
659
|
+
},
|
|
660
|
+
variants: [
|
|
661
|
+
{
|
|
662
|
+
id: "primary",
|
|
663
|
+
name: "Primary",
|
|
664
|
+
enabled: true,
|
|
665
|
+
priority: 1,
|
|
666
|
+
background: { type: "solid", colorToken: "primary" },
|
|
667
|
+
textColorToken: "primaryForeground",
|
|
668
|
+
borderRadius: "rounded-full",
|
|
669
|
+
effects: {
|
|
670
|
+
hover: [
|
|
671
|
+
{ effectId: "scale-up", options: { scale: "1.03" } },
|
|
672
|
+
{ effectId: "drop-shadow", options: { intensity: "medium" } }
|
|
673
|
+
]
|
|
674
|
+
}
|
|
675
|
+
},
|
|
676
|
+
{
|
|
677
|
+
id: "secondary",
|
|
678
|
+
name: "Secondary",
|
|
679
|
+
enabled: true,
|
|
680
|
+
priority: 2,
|
|
681
|
+
background: { type: "transparent" },
|
|
682
|
+
textColorToken: "primary",
|
|
683
|
+
borderRadius: "rounded-full",
|
|
684
|
+
border: { widthClass: "border-2", colorToken: "accent" },
|
|
685
|
+
effects: {
|
|
686
|
+
hover: [{ effectId: "background-on-hover", options: { colorToken: "accent" } }]
|
|
687
|
+
}
|
|
688
|
+
},
|
|
689
|
+
{
|
|
690
|
+
id: "outline",
|
|
691
|
+
name: "Outline",
|
|
692
|
+
enabled: true,
|
|
693
|
+
priority: 3,
|
|
694
|
+
background: { type: "transparent" },
|
|
695
|
+
textColorToken: "text",
|
|
696
|
+
borderRadius: "rounded-full",
|
|
697
|
+
border: { widthClass: "border", colorToken: "border" },
|
|
698
|
+
effects: {
|
|
699
|
+
hover: [{ effectId: "background-on-hover", options: { colorToken: "surface" } }]
|
|
700
|
+
}
|
|
701
|
+
},
|
|
702
|
+
{
|
|
703
|
+
id: "ghost",
|
|
704
|
+
name: "Ghost",
|
|
705
|
+
enabled: true,
|
|
706
|
+
priority: 3,
|
|
707
|
+
background: { type: "transparent" },
|
|
708
|
+
textColorToken: "primary",
|
|
709
|
+
borderRadius: "rounded-full",
|
|
710
|
+
sizes: {
|
|
711
|
+
sm: { padding: "0.375rem 0.875rem", fontSize: "text-sm" },
|
|
712
|
+
md: { padding: "0.5rem 1rem" },
|
|
713
|
+
lg: { padding: "0.625rem 1.25rem", fontSize: "text-lg" },
|
|
714
|
+
xl: { padding: "0.75rem 1.5rem", fontSize: "text-xl" }
|
|
715
|
+
},
|
|
716
|
+
effects: {
|
|
717
|
+
hover: [{ effectId: "opacity-reduce", options: { reduction: 30 } }]
|
|
718
|
+
}
|
|
719
|
+
}
|
|
720
|
+
]
|
|
721
|
+
}
|
|
722
|
+
});
|
|
723
|
+
|
|
724
|
+
// ../theme-core/src/buttons/personalities/soft-pill.ts
|
|
725
|
+
var softPill = defineButtonPersonality({
|
|
726
|
+
id: "soft-pill",
|
|
727
|
+
name: "Soft Pill",
|
|
728
|
+
description: "Rounded pills with a gentle lift on hover. Quietly modern.",
|
|
729
|
+
tags: { tone: "classic", energy: "calm", motion: "subtle", era: "organic" },
|
|
730
|
+
buttonSystem: {
|
|
731
|
+
global: {
|
|
732
|
+
cornerStyle: "pill",
|
|
733
|
+
shadow: "low",
|
|
734
|
+
textTransform: "none",
|
|
735
|
+
fontWeight: 500,
|
|
736
|
+
borderWidth: 2,
|
|
737
|
+
hoverTransform: "lift",
|
|
738
|
+
hoverColor: "none"
|
|
739
|
+
},
|
|
740
|
+
variants: [
|
|
741
|
+
{
|
|
742
|
+
id: "primary",
|
|
743
|
+
name: "Primary",
|
|
744
|
+
enabled: true,
|
|
745
|
+
priority: 1,
|
|
746
|
+
background: { type: "solid", colorToken: "primary" },
|
|
747
|
+
textColorToken: "primaryForeground",
|
|
748
|
+
borderRadius: "rounded-full",
|
|
749
|
+
shadow: { elevation: "low", softness: "soft", position: "bottom" },
|
|
750
|
+
effects: {
|
|
751
|
+
hover: [{ effectId: "lift", options: { translateY: "-1px" } }],
|
|
752
|
+
active: [{ effectId: "scale-down", options: { scale: "0.98" } }]
|
|
753
|
+
}
|
|
754
|
+
},
|
|
755
|
+
{
|
|
756
|
+
id: "secondary",
|
|
757
|
+
name: "Secondary",
|
|
758
|
+
enabled: true,
|
|
759
|
+
priority: 2,
|
|
760
|
+
background: { type: "transparent" },
|
|
761
|
+
textColorToken: "primary",
|
|
762
|
+
borderRadius: "rounded-full",
|
|
763
|
+
border: { widthClass: "border-2", colorToken: "primary" },
|
|
764
|
+
effects: {
|
|
765
|
+
hover: [{ effectId: "background-on-hover", options: { colorToken: "surface" } }]
|
|
766
|
+
}
|
|
767
|
+
},
|
|
768
|
+
{
|
|
769
|
+
id: "outline",
|
|
770
|
+
name: "Outline",
|
|
771
|
+
enabled: true,
|
|
772
|
+
priority: 3,
|
|
773
|
+
background: { type: "transparent" },
|
|
774
|
+
textColorToken: "text",
|
|
775
|
+
borderRadius: "rounded-full",
|
|
776
|
+
border: { widthClass: "border", colorToken: "border" },
|
|
777
|
+
effects: {
|
|
778
|
+
hover: [{ effectId: "background-on-hover", options: { colorToken: "surface" } }]
|
|
779
|
+
}
|
|
780
|
+
},
|
|
781
|
+
{
|
|
782
|
+
id: "ghost",
|
|
783
|
+
name: "Ghost",
|
|
784
|
+
enabled: true,
|
|
785
|
+
priority: 3,
|
|
786
|
+
background: { type: "transparent" },
|
|
787
|
+
textColorToken: "text",
|
|
788
|
+
borderRadius: "rounded-full",
|
|
789
|
+
effects: {
|
|
790
|
+
hover: [{ effectId: "background-on-hover", options: { colorToken: "surface" } }]
|
|
791
|
+
}
|
|
792
|
+
}
|
|
793
|
+
]
|
|
794
|
+
}
|
|
795
|
+
});
|
|
796
|
+
|
|
797
|
+
// ../theme-core/src/buttons/personalities/index.ts
|
|
798
|
+
var buttonPersonalities = [
|
|
799
|
+
softPill,
|
|
800
|
+
confidentChip,
|
|
801
|
+
editorialLink,
|
|
802
|
+
pebble,
|
|
803
|
+
inkStamp,
|
|
804
|
+
brushedWash
|
|
805
|
+
];
|
|
806
|
+
var personalitiesById = new Map(
|
|
807
|
+
buttonPersonalities.map((p) => [p.id, p])
|
|
808
|
+
);
|
|
809
|
+
|
|
215
810
|
// ../theme-core/src/buttons/core.ts
|
|
216
811
|
var CORNER_RADIUS_MAP = {
|
|
217
812
|
square: "0",
|
|
@@ -339,43 +934,43 @@ function getDefaultButtonVariants() {
|
|
|
339
934
|
}
|
|
340
935
|
|
|
341
936
|
// ../theme-core/src/cards/types.ts
|
|
342
|
-
import { z as
|
|
343
|
-
var cardSpacingSchema =
|
|
344
|
-
var gradientDirectionSchema2 =
|
|
345
|
-
var cardBackgroundSchema =
|
|
346
|
-
|
|
347
|
-
|
|
348
|
-
type:
|
|
349
|
-
fromToken:
|
|
350
|
-
toToken:
|
|
937
|
+
import { z as z5 } from "zod";
|
|
938
|
+
var cardSpacingSchema = z5.enum(["none", "compact", "cozy", "medium", "comfortable", "spacious"]);
|
|
939
|
+
var gradientDirectionSchema2 = z5.enum(["to-r", "to-l", "to-t", "to-b", "to-tr", "to-tl", "to-br", "to-bl"]);
|
|
940
|
+
var cardBackgroundSchema = z5.discriminatedUnion("type", [
|
|
941
|
+
z5.object({ type: z5.literal("solid"), colorToken: z5.string() }),
|
|
942
|
+
z5.object({
|
|
943
|
+
type: z5.literal("gradient"),
|
|
944
|
+
fromToken: z5.string(),
|
|
945
|
+
toToken: z5.string(),
|
|
351
946
|
direction: gradientDirectionSchema2
|
|
352
947
|
}),
|
|
353
|
-
|
|
948
|
+
z5.object({ type: z5.literal("transparent") })
|
|
354
949
|
]);
|
|
355
|
-
var cardBorderSchema =
|
|
356
|
-
widthClass:
|
|
357
|
-
colorToken:
|
|
950
|
+
var cardBorderSchema = z5.object({
|
|
951
|
+
widthClass: z5.string(),
|
|
952
|
+
colorToken: z5.string()
|
|
358
953
|
});
|
|
359
|
-
var cardVariantSchema =
|
|
360
|
-
id:
|
|
361
|
-
name:
|
|
362
|
-
enabled:
|
|
363
|
-
priority:
|
|
954
|
+
var cardVariantSchema = z5.object({
|
|
955
|
+
id: z5.string(),
|
|
956
|
+
name: z5.string().min(1).max(20),
|
|
957
|
+
enabled: z5.boolean(),
|
|
958
|
+
priority: z5.union([z5.literal(1), z5.literal(2), z5.literal(3)]),
|
|
364
959
|
// Appearance (token-based)
|
|
365
960
|
background: cardBackgroundSchema,
|
|
366
961
|
spacing: cardSpacingSchema,
|
|
367
962
|
// Optional overrides (uses theme defaults if not specified)
|
|
368
|
-
shadow:
|
|
369
|
-
elevation:
|
|
370
|
-
softness:
|
|
371
|
-
position:
|
|
963
|
+
shadow: z5.object({
|
|
964
|
+
elevation: z5.enum(["none", "low", "medium", "high"]),
|
|
965
|
+
softness: z5.enum(["crisp", "soft", "hard"]).nullable(),
|
|
966
|
+
position: z5.enum(["bottom", "bottom-right"]).default("bottom")
|
|
372
967
|
}).optional(),
|
|
373
|
-
corners:
|
|
968
|
+
corners: z5.enum(["square", "soft", "rounded", "pill"]).optional(),
|
|
374
969
|
// Border (optional)
|
|
375
970
|
border: cardBorderSchema.optional()
|
|
376
971
|
});
|
|
377
|
-
var cardSystemSchema =
|
|
378
|
-
variants:
|
|
972
|
+
var cardSystemSchema = z5.object({
|
|
973
|
+
variants: z5.array(cardVariantSchema).min(1).max(3)
|
|
379
974
|
});
|
|
380
975
|
|
|
381
976
|
// ../theme-core/src/cards/core.ts
|
|
@@ -497,8 +1092,8 @@ function getDefaultCardVariants() {
|
|
|
497
1092
|
}
|
|
498
1093
|
|
|
499
1094
|
// ../theme-core/src/accordions/types.ts
|
|
500
|
-
import { z as
|
|
501
|
-
var accordionIconSchema =
|
|
1095
|
+
import { z as z6 } from "zod";
|
|
1096
|
+
var accordionIconSchema = z6.enum([
|
|
502
1097
|
"plus-minus",
|
|
503
1098
|
// + becomes - (swap or rotate 90°)
|
|
504
1099
|
"chevron",
|
|
@@ -510,180 +1105,180 @@ var accordionIconSchema = z4.enum([
|
|
|
510
1105
|
"circle-plus-minus"
|
|
511
1106
|
// ⊕ becomes ⊖ (swap with fade)
|
|
512
1107
|
]);
|
|
513
|
-
var accordionSystemSchema =
|
|
1108
|
+
var accordionSystemSchema = z6.object({
|
|
514
1109
|
// Visual styling (solid color only - gradients can be added later if needed)
|
|
515
|
-
background:
|
|
516
|
-
type:
|
|
517
|
-
colorToken:
|
|
1110
|
+
background: z6.object({
|
|
1111
|
+
type: z6.literal("solid"),
|
|
1112
|
+
colorToken: z6.string()
|
|
518
1113
|
}),
|
|
519
1114
|
// Spacing (padding inside items)
|
|
520
|
-
spacing:
|
|
1115
|
+
spacing: z6.enum(["none", "compact", "cozy", "medium", "comfortable", "spacious"]),
|
|
521
1116
|
// Border radius (null = inherit from theme.corners)
|
|
522
|
-
corners:
|
|
1117
|
+
corners: z6.enum(["square", "soft", "rounded", "pill"]).nullable(),
|
|
523
1118
|
// Border styling (null = inherit from theme.border)
|
|
524
|
-
border:
|
|
525
|
-
widthClass:
|
|
1119
|
+
border: z6.object({
|
|
1120
|
+
widthClass: z6.string(),
|
|
526
1121
|
// e.g., 'border', 'border-2', 'border-0'
|
|
527
|
-
colorToken:
|
|
1122
|
+
colorToken: z6.string()
|
|
528
1123
|
}).nullable(),
|
|
529
1124
|
// Shadow (null = inherit from theme.shadow)
|
|
530
|
-
shadow:
|
|
531
|
-
elevation:
|
|
532
|
-
softness:
|
|
533
|
-
position:
|
|
1125
|
+
shadow: z6.object({
|
|
1126
|
+
elevation: z6.enum(["none", "low", "medium", "high"]),
|
|
1127
|
+
softness: z6.enum(["soft", "crisp", "hard"]).nullable(),
|
|
1128
|
+
position: z6.enum(["bottom", "bottom-right"])
|
|
534
1129
|
}).nullable(),
|
|
535
1130
|
// Icon style and animation
|
|
536
|
-
icon:
|
|
1131
|
+
icon: z6.object({
|
|
537
1132
|
style: accordionIconSchema,
|
|
538
|
-
position:
|
|
539
|
-
size:
|
|
1133
|
+
position: z6.enum(["left", "right"]),
|
|
1134
|
+
size: z6.enum(["sm", "md", "lg"])
|
|
540
1135
|
}),
|
|
541
1136
|
// Trigger (question) styling
|
|
542
|
-
trigger:
|
|
543
|
-
textColorToken:
|
|
544
|
-
fontWeight:
|
|
1137
|
+
trigger: z6.object({
|
|
1138
|
+
textColorToken: z6.string(),
|
|
1139
|
+
fontWeight: z6.enum(["regular", "medium", "semibold", "bold"]).nullable()
|
|
545
1140
|
// null = inherit from theme
|
|
546
1141
|
}),
|
|
547
1142
|
// Hover state styling
|
|
548
|
-
hover:
|
|
549
|
-
backgroundColorToken:
|
|
550
|
-
textColorToken:
|
|
551
|
-
borderColorToken:
|
|
1143
|
+
hover: z6.object({
|
|
1144
|
+
backgroundColorToken: z6.string().optional(),
|
|
1145
|
+
textColorToken: z6.string().optional(),
|
|
1146
|
+
borderColorToken: z6.string().optional()
|
|
552
1147
|
}),
|
|
553
1148
|
// Content (answer) styling
|
|
554
|
-
content:
|
|
555
|
-
textColorToken:
|
|
1149
|
+
content: z6.object({
|
|
1150
|
+
textColorToken: z6.string()
|
|
556
1151
|
})
|
|
557
1152
|
});
|
|
558
1153
|
|
|
559
1154
|
// ../theme-core/src/inputs/types.ts
|
|
560
|
-
import { z as
|
|
561
|
-
var inputSystemSchema =
|
|
1155
|
+
import { z as z7 } from "zod";
|
|
1156
|
+
var inputSystemSchema = z7.object({
|
|
562
1157
|
// Base styling (applied to all inputs)
|
|
563
|
-
base:
|
|
564
|
-
background:
|
|
565
|
-
|
|
566
|
-
type:
|
|
567
|
-
colorToken:
|
|
1158
|
+
base: z7.object({
|
|
1159
|
+
background: z7.union([
|
|
1160
|
+
z7.object({
|
|
1161
|
+
type: z7.literal("solid"),
|
|
1162
|
+
colorToken: z7.string()
|
|
568
1163
|
}),
|
|
569
|
-
|
|
570
|
-
type:
|
|
1164
|
+
z7.object({
|
|
1165
|
+
type: z7.literal("transparent")
|
|
571
1166
|
})
|
|
572
1167
|
]),
|
|
573
|
-
textColorToken:
|
|
574
|
-
border:
|
|
575
|
-
widthClass:
|
|
1168
|
+
textColorToken: z7.string(),
|
|
1169
|
+
border: z7.object({
|
|
1170
|
+
widthClass: z7.string(),
|
|
576
1171
|
// e.g., 'border', 'border-2'
|
|
577
|
-
colorToken:
|
|
578
|
-
style:
|
|
1172
|
+
colorToken: z7.string(),
|
|
1173
|
+
style: z7.enum(["all", "underline"]).optional()
|
|
579
1174
|
}),
|
|
580
|
-
corners:
|
|
1175
|
+
corners: z7.enum(["square", "soft", "rounded", "pill"]).nullable(),
|
|
581
1176
|
// null = inherit from theme.corners
|
|
582
|
-
shadow:
|
|
583
|
-
elevation:
|
|
584
|
-
softness:
|
|
1177
|
+
shadow: z7.object({
|
|
1178
|
+
elevation: z7.enum(["none", "low", "medium"]),
|
|
1179
|
+
softness: z7.enum(["soft", "crisp", "hard"]).nullable()
|
|
585
1180
|
}).nullable(),
|
|
586
|
-
spacing:
|
|
1181
|
+
spacing: z7.enum(["compact", "cozy", "medium", "comfortable"]),
|
|
587
1182
|
// padding inside inputs
|
|
588
|
-
fontSize:
|
|
1183
|
+
fontSize: z7.enum(["sm", "base", "lg"])
|
|
589
1184
|
}),
|
|
590
1185
|
// Label styling
|
|
591
|
-
label:
|
|
592
|
-
textColorToken:
|
|
593
|
-
fontWeight:
|
|
594
|
-
fontSize:
|
|
595
|
-
textTransform:
|
|
596
|
-
letterSpacing:
|
|
597
|
-
opacity:
|
|
1186
|
+
label: z7.object({
|
|
1187
|
+
textColorToken: z7.string(),
|
|
1188
|
+
fontWeight: z7.enum(["regular", "medium", "semibold", "bold", "black"]),
|
|
1189
|
+
fontSize: z7.enum(["2xs", "xs", "sm", "base"]),
|
|
1190
|
+
textTransform: z7.enum(["none", "uppercase", "lowercase", "capitalize"]).optional(),
|
|
1191
|
+
letterSpacing: z7.enum(["normal", "wide", "wider", "widest"]).optional(),
|
|
1192
|
+
opacity: z7.number().min(0.2).max(1).optional()
|
|
598
1193
|
}),
|
|
599
1194
|
// Focus state
|
|
600
|
-
focus:
|
|
601
|
-
ringColorToken:
|
|
602
|
-
ringWidth:
|
|
603
|
-
borderColorToken:
|
|
1195
|
+
focus: z7.object({
|
|
1196
|
+
ringColorToken: z7.string(),
|
|
1197
|
+
ringWidth: z7.enum(["0", "1", "2", "3"]),
|
|
1198
|
+
borderColorToken: z7.string().optional()
|
|
604
1199
|
// Change border color on focus
|
|
605
1200
|
}),
|
|
606
1201
|
// Error state (for validation feedback)
|
|
607
|
-
error:
|
|
608
|
-
borderColorToken:
|
|
609
|
-
textColorToken:
|
|
1202
|
+
error: z7.object({
|
|
1203
|
+
borderColorToken: z7.string(),
|
|
1204
|
+
textColorToken: z7.string()
|
|
610
1205
|
}),
|
|
611
1206
|
// Disabled state
|
|
612
|
-
disabled:
|
|
613
|
-
backgroundColorToken:
|
|
614
|
-
textColorToken:
|
|
615
|
-
opacity:
|
|
1207
|
+
disabled: z7.object({
|
|
1208
|
+
backgroundColorToken: z7.string(),
|
|
1209
|
+
textColorToken: z7.string(),
|
|
1210
|
+
opacity: z7.number().min(0.3).max(0.7)
|
|
616
1211
|
})
|
|
617
1212
|
});
|
|
618
1213
|
|
|
619
1214
|
// ../theme-core/src/gradients/types.ts
|
|
620
|
-
import { z as
|
|
621
|
-
var gradientStopSchema =
|
|
622
|
-
color:
|
|
1215
|
+
import { z as z8 } from "zod";
|
|
1216
|
+
var gradientStopSchema = z8.object({
|
|
1217
|
+
color: z8.string(),
|
|
623
1218
|
// Theme color token name (e.g., 'primary-500')
|
|
624
|
-
position:
|
|
1219
|
+
position: z8.number().min(0).max(100)
|
|
625
1220
|
// Percentage 0-100
|
|
626
1221
|
});
|
|
627
|
-
var gradientConfigSchema =
|
|
628
|
-
type:
|
|
629
|
-
angle:
|
|
1222
|
+
var gradientConfigSchema = z8.object({
|
|
1223
|
+
type: z8.enum(["linear", "radial"]),
|
|
1224
|
+
angle: z8.number().min(0).max(360).optional(),
|
|
630
1225
|
// For linear gradients (degrees)
|
|
631
|
-
position:
|
|
1226
|
+
position: z8.string().optional(),
|
|
632
1227
|
// For radial gradients ('center', 'top left', etc.)
|
|
633
|
-
stops:
|
|
1228
|
+
stops: z8.array(gradientStopSchema).min(2)
|
|
634
1229
|
});
|
|
635
1230
|
|
|
636
1231
|
// ../theme-core/src/navigation/types.ts
|
|
637
|
-
import { z as
|
|
1232
|
+
import { z as z10 } from "zod";
|
|
638
1233
|
|
|
639
1234
|
// ../theme-core/src/interactive/baseSchema.ts
|
|
640
|
-
import { z as
|
|
641
|
-
var interactiveTypographySchema =
|
|
1235
|
+
import { z as z9 } from "zod";
|
|
1236
|
+
var interactiveTypographySchema = z9.object({
|
|
642
1237
|
/** Font family source */
|
|
643
|
-
typography:
|
|
1238
|
+
typography: z9.enum(["body", "heading"]).default("body"),
|
|
644
1239
|
/** Font weight */
|
|
645
|
-
fontWeight:
|
|
1240
|
+
fontWeight: z9.enum(["regular", "medium", "semibold", "bold"]).default("medium"),
|
|
646
1241
|
/** Text transform */
|
|
647
|
-
textTransform:
|
|
1242
|
+
textTransform: z9.enum(["none", "uppercase", "capitalize"]).default("none"),
|
|
648
1243
|
/** Italic style */
|
|
649
|
-
italic:
|
|
1244
|
+
italic: z9.boolean().default(false)
|
|
650
1245
|
});
|
|
651
|
-
var effectApplicationSchema2 =
|
|
1246
|
+
var effectApplicationSchema2 = z9.object({
|
|
652
1247
|
/** Effect preset ID */
|
|
653
|
-
effectId:
|
|
1248
|
+
effectId: z9.string(),
|
|
654
1249
|
/** User-provided customization options */
|
|
655
|
-
options:
|
|
1250
|
+
options: z9.record(z9.string(), z9.any()).optional()
|
|
656
1251
|
});
|
|
657
|
-
var effectCompositionSchema =
|
|
1252
|
+
var effectCompositionSchema = z9.object({
|
|
658
1253
|
/** Effects always applied */
|
|
659
|
-
base:
|
|
1254
|
+
base: z9.array(effectApplicationSchema2).optional(),
|
|
660
1255
|
/** Effects applied on hover */
|
|
661
|
-
hover:
|
|
1256
|
+
hover: z9.array(effectApplicationSchema2).optional(),
|
|
662
1257
|
/** Effects applied on active/pressed */
|
|
663
|
-
active:
|
|
1258
|
+
active: z9.array(effectApplicationSchema2).optional(),
|
|
664
1259
|
/** Effects applied on focus */
|
|
665
|
-
focus:
|
|
1260
|
+
focus: z9.array(effectApplicationSchema2).optional()
|
|
666
1261
|
});
|
|
667
1262
|
|
|
668
1263
|
// ../theme-core/src/navigation/types.ts
|
|
669
|
-
var navLinkPaddingSchema =
|
|
670
|
-
var navLinkPaddingXSchema =
|
|
671
|
-
var navLinkBorderRadiusSchema =
|
|
672
|
-
var navLinkTextSizeSchema =
|
|
673
|
-
var navLinkLetterSpacingSchema =
|
|
674
|
-
var navLinkStyleSchema =
|
|
1264
|
+
var navLinkPaddingSchema = z10.enum(["none", "compact", "default"]);
|
|
1265
|
+
var navLinkPaddingXSchema = z10.enum(["none", "tight", "compact", "default", "relaxed", "spacious"]);
|
|
1266
|
+
var navLinkBorderRadiusSchema = z10.enum(["none", "sm", "md", "full"]);
|
|
1267
|
+
var navLinkTextSizeSchema = z10.enum(["xs", "sm", "base", "lg"]);
|
|
1268
|
+
var navLinkLetterSpacingSchema = z10.enum(["normal", "wide", "wider", "widest"]);
|
|
1269
|
+
var navLinkStyleSchema = z10.object({
|
|
675
1270
|
/** Display name for the style */
|
|
676
|
-
name:
|
|
1271
|
+
name: z10.string().min(1).max(30).optional(),
|
|
677
1272
|
/** Typography settings (inherited from interactive base) */
|
|
678
1273
|
...interactiveTypographySchema.shape,
|
|
679
1274
|
/** Text color token */
|
|
680
|
-
colorToken:
|
|
1275
|
+
colorToken: z10.string().default("text"),
|
|
681
1276
|
/** Optional text size override */
|
|
682
1277
|
textSize: navLinkTextSizeSchema.optional(),
|
|
683
1278
|
/** Optional letter spacing override */
|
|
684
1279
|
letterSpacing: navLinkLetterSpacingSchema.optional(),
|
|
685
1280
|
/** Hover/active color token (for color-change effects) */
|
|
686
|
-
hoverColorToken:
|
|
1281
|
+
hoverColorToken: z10.string().nullable().optional(),
|
|
687
1282
|
/** Padding preset */
|
|
688
1283
|
padding: navLinkPaddingSchema.default("compact"),
|
|
689
1284
|
/** Horizontal padding override (overrides horizontal component of padding preset) */
|
|
@@ -695,7 +1290,7 @@ var navLinkStyleSchema = z8.object({
|
|
|
695
1290
|
});
|
|
696
1291
|
|
|
697
1292
|
// ../theme-core/src/customCss/validation.ts
|
|
698
|
-
import { z as
|
|
1293
|
+
import { z as z11 } from "zod";
|
|
699
1294
|
var FORBIDDEN_SELECTORS = [":root", "html", "body"];
|
|
700
1295
|
var UNIVERSAL_SELECTOR = "*";
|
|
701
1296
|
var REMOTE_URL_PATTERN = /url\s*\(\s*['"]?(https?:|\/\/)/i;
|
|
@@ -737,7 +1332,7 @@ function containsForbiddenSelector(selector) {
|
|
|
737
1332
|
}
|
|
738
1333
|
return false;
|
|
739
1334
|
}
|
|
740
|
-
var selectorSchema =
|
|
1335
|
+
var selectorSchema = z11.string().min(1, "Selector cannot be empty").max(200, "Selector too long (max 200 characters)").refine(
|
|
741
1336
|
(s) => !containsForbiddenSelector(s),
|
|
742
1337
|
{ message: "Global selectors (:root, html, body, *) are not allowed" }
|
|
743
1338
|
);
|
|
@@ -747,38 +1342,38 @@ function containsRemoteUrl(value) {
|
|
|
747
1342
|
function containsJavascriptUrl(value) {
|
|
748
1343
|
return JAVASCRIPT_URL_PATTERN.test(value);
|
|
749
1344
|
}
|
|
750
|
-
var declarationValueSchema =
|
|
1345
|
+
var declarationValueSchema = z11.string().max(500, "Declaration value too long (max 500 characters)").refine(
|
|
751
1346
|
(v) => !containsRemoteUrl(v),
|
|
752
1347
|
{ message: "Remote url() references are not allowed. Use local paths, data URIs, or fragment IDs." }
|
|
753
1348
|
).refine(
|
|
754
1349
|
(v) => !containsJavascriptUrl(v),
|
|
755
1350
|
{ message: "javascript: URLs are not allowed" }
|
|
756
1351
|
);
|
|
757
|
-
var declarationsSchema =
|
|
758
|
-
|
|
1352
|
+
var declarationsSchema = z11.record(
|
|
1353
|
+
z11.string().min(1).max(100),
|
|
759
1354
|
// property name
|
|
760
1355
|
declarationValueSchema
|
|
761
1356
|
// property value
|
|
762
1357
|
);
|
|
763
|
-
var customCssRuleSchema =
|
|
764
|
-
id:
|
|
1358
|
+
var customCssRuleSchema = z11.object({
|
|
1359
|
+
id: z11.string().min(1, "Rule ID is required").max(50, "Rule ID too long"),
|
|
765
1360
|
selector: selectorSchema,
|
|
766
1361
|
declarations: declarationsSchema
|
|
767
1362
|
});
|
|
768
1363
|
var blockCustomCssRuleSchema = customCssRuleSchema.extend({
|
|
769
|
-
blockKind:
|
|
1364
|
+
blockKind: z11.string().min(1, "Block kind is required").max(50, "Block kind too long")
|
|
770
1365
|
});
|
|
771
|
-
var customCssRulesSchema =
|
|
772
|
-
var blockCustomCssRulesSchema =
|
|
1366
|
+
var customCssRulesSchema = z11.array(customCssRuleSchema).optional();
|
|
1367
|
+
var blockCustomCssRulesSchema = z11.array(blockCustomCssRuleSchema).optional();
|
|
773
1368
|
|
|
774
1369
|
// ../theme-core/src/customCss/atRuleValidation.ts
|
|
775
|
-
import { z as
|
|
1370
|
+
import { z as z12 } from "zod";
|
|
776
1371
|
var KEYFRAME_OFFSET_PATTERN = /^(from|to|\d{1,3}%)$/i;
|
|
777
1372
|
var ANIMATION_NAME_PATTERN = /^[a-zA-Z_-][a-zA-Z0-9_-]*$/;
|
|
778
1373
|
var BLOCKED_AT_RULES = ["@import", "@charset"];
|
|
779
1374
|
var BLOCKED_AT_RULE_PATTERN = /@(?:import|charset)\b/i;
|
|
780
|
-
var ruleIdSchema =
|
|
781
|
-
var nestedRuleSchema =
|
|
1375
|
+
var ruleIdSchema = z12.string().min(1, "Rule ID is required").max(50, "Rule ID too long");
|
|
1376
|
+
var nestedRuleSchema = z12.object({
|
|
782
1377
|
selector: selectorSchema,
|
|
783
1378
|
declarations: declarationsSchema
|
|
784
1379
|
});
|
|
@@ -790,146 +1385,146 @@ function isValidKeyframeOffset(offset) {
|
|
|
790
1385
|
const value = parseInt(match[1], 10);
|
|
791
1386
|
return value >= 0 && value <= 100;
|
|
792
1387
|
}
|
|
793
|
-
var keyframeOffsetSchema =
|
|
1388
|
+
var keyframeOffsetSchema = z12.string().transform((offset) => offset.trim()).refine(
|
|
794
1389
|
(offset) => KEYFRAME_OFFSET_PATTERN.test(offset),
|
|
795
1390
|
{ message: 'Invalid keyframe offset. Use percentages (0%, 50%, 100%) or "from"/"to"' }
|
|
796
1391
|
).refine(
|
|
797
1392
|
isValidKeyframeOffset,
|
|
798
1393
|
{ message: "Keyframe offset must be between 0% and 100%" }
|
|
799
1394
|
);
|
|
800
|
-
var animationNameSchema =
|
|
1395
|
+
var animationNameSchema = z12.string().min(1, "Animation name is required").max(50, "Animation name too long").refine(
|
|
801
1396
|
(name) => ANIMATION_NAME_PATTERN.test(name),
|
|
802
1397
|
{ message: "Invalid animation name. Use letters, numbers, dashes, underscores (start with letter, dash, or underscore)" }
|
|
803
1398
|
);
|
|
804
|
-
var keyframeSchema =
|
|
1399
|
+
var keyframeSchema = z12.object({
|
|
805
1400
|
offset: keyframeOffsetSchema,
|
|
806
1401
|
declarations: declarationsSchema
|
|
807
1402
|
});
|
|
808
|
-
var keyframesAtRuleSchema =
|
|
1403
|
+
var keyframesAtRuleSchema = z12.object({
|
|
809
1404
|
id: ruleIdSchema,
|
|
810
|
-
type:
|
|
1405
|
+
type: z12.literal("keyframes"),
|
|
811
1406
|
name: animationNameSchema,
|
|
812
|
-
frames:
|
|
1407
|
+
frames: z12.array(keyframeSchema).min(1, "At least one keyframe is required")
|
|
813
1408
|
});
|
|
814
|
-
var fontFaceDeclarationsSchema =
|
|
1409
|
+
var fontFaceDeclarationsSchema = z12.record(z12.string().min(1).max(100), declarationValueSchema).refine(
|
|
815
1410
|
(decls) => "fontFamily" in decls || "font-family" in decls,
|
|
816
1411
|
{ message: "font-family is required in @font-face" }
|
|
817
1412
|
);
|
|
818
|
-
var fontFaceAtRuleSchema =
|
|
1413
|
+
var fontFaceAtRuleSchema = z12.object({
|
|
819
1414
|
id: ruleIdSchema,
|
|
820
|
-
type:
|
|
1415
|
+
type: z12.literal("font-face"),
|
|
821
1416
|
declarations: fontFaceDeclarationsSchema
|
|
822
1417
|
});
|
|
823
|
-
var mediaQuerySchema =
|
|
824
|
-
var mediaAtRuleSchema =
|
|
1418
|
+
var mediaQuerySchema = z12.string().min(1, "Media query is required").max(200, "Media query too long");
|
|
1419
|
+
var mediaAtRuleSchema = z12.object({
|
|
825
1420
|
id: ruleIdSchema,
|
|
826
|
-
type:
|
|
1421
|
+
type: z12.literal("media"),
|
|
827
1422
|
query: mediaQuerySchema,
|
|
828
|
-
rules:
|
|
1423
|
+
rules: z12.array(nestedRuleSchema).min(1, "At least one rule is required")
|
|
829
1424
|
});
|
|
830
|
-
var supportsConditionSchema =
|
|
831
|
-
var supportsAtRuleSchema =
|
|
1425
|
+
var supportsConditionSchema = z12.string().min(1, "Supports condition is required").max(200, "Supports condition too long");
|
|
1426
|
+
var supportsAtRuleSchema = z12.object({
|
|
832
1427
|
id: ruleIdSchema,
|
|
833
|
-
type:
|
|
1428
|
+
type: z12.literal("supports"),
|
|
834
1429
|
condition: supportsConditionSchema,
|
|
835
|
-
rules:
|
|
1430
|
+
rules: z12.array(nestedRuleSchema).min(1, "At least one rule is required")
|
|
836
1431
|
});
|
|
837
1432
|
function containsBlockedAtRule(css) {
|
|
838
1433
|
return BLOCKED_AT_RULE_PATTERN.test(css);
|
|
839
1434
|
}
|
|
840
|
-
var rawCssSchema =
|
|
1435
|
+
var rawCssSchema = z12.string().min(1, "CSS is required").max(5e3, "Raw CSS too long (max 5000 characters)").refine(
|
|
841
1436
|
(css) => css.trim().startsWith("@"),
|
|
842
1437
|
{ message: "Raw at-rule must start with @" }
|
|
843
1438
|
).refine(
|
|
844
1439
|
(css) => !containsBlockedAtRule(css),
|
|
845
1440
|
{ message: `Blocked at-rules: ${BLOCKED_AT_RULES.join(", ")}. Use typed at-rules or local assets instead.` }
|
|
846
1441
|
);
|
|
847
|
-
var rawAtRuleSchema =
|
|
1442
|
+
var rawAtRuleSchema = z12.object({
|
|
848
1443
|
id: ruleIdSchema,
|
|
849
|
-
type:
|
|
1444
|
+
type: z12.literal("raw"),
|
|
850
1445
|
css: rawCssSchema
|
|
851
1446
|
});
|
|
852
|
-
var customCssAtRuleSchema =
|
|
1447
|
+
var customCssAtRuleSchema = z12.discriminatedUnion("type", [
|
|
853
1448
|
keyframesAtRuleSchema,
|
|
854
1449
|
fontFaceAtRuleSchema,
|
|
855
1450
|
mediaAtRuleSchema,
|
|
856
1451
|
supportsAtRuleSchema,
|
|
857
1452
|
rawAtRuleSchema
|
|
858
1453
|
]);
|
|
859
|
-
var customCssAtRulesSchema =
|
|
1454
|
+
var customCssAtRulesSchema = z12.array(customCssAtRuleSchema).optional();
|
|
860
1455
|
|
|
861
1456
|
// ../theme-core/src/shared/componentStyles.ts
|
|
862
|
-
import { z as
|
|
863
|
-
var componentBorderSchema =
|
|
864
|
-
width:
|
|
865
|
-
style:
|
|
866
|
-
colorToken:
|
|
1457
|
+
import { z as z13 } from "zod";
|
|
1458
|
+
var componentBorderSchema = z13.object({
|
|
1459
|
+
width: z13.enum(["none", "hairline", "thin", "medium", "thick"]).default("none"),
|
|
1460
|
+
style: z13.enum(["solid", "dashed"]).default("solid"),
|
|
1461
|
+
colorToken: z13.string().optional()
|
|
867
1462
|
// defaults to "border" if not set
|
|
868
1463
|
});
|
|
869
|
-
var componentShadowSchema =
|
|
870
|
-
elevation:
|
|
1464
|
+
var componentShadowSchema = z13.object({
|
|
1465
|
+
elevation: z13.enum(["none", "sm", "md", "lg", "xl", "2xl"]).default("sm")
|
|
871
1466
|
});
|
|
872
1467
|
|
|
873
1468
|
// ../theme-core/src/schema.ts
|
|
874
|
-
var axesSchema =
|
|
875
|
-
tone:
|
|
876
|
-
energy:
|
|
877
|
-
density:
|
|
878
|
-
mediaBias:
|
|
879
|
-
conversionBias:
|
|
880
|
-
motion:
|
|
1469
|
+
var axesSchema = z14.object({
|
|
1470
|
+
tone: z14.enum(["minimal", "classic", "bold"]),
|
|
1471
|
+
energy: z14.enum(["calm", "vibrant"]),
|
|
1472
|
+
density: z14.enum(["airy", "regular", "compact"]),
|
|
1473
|
+
mediaBias: z14.enum(["text", "media", "mixed"]),
|
|
1474
|
+
conversionBias: z14.enum(["low", "med", "high"]),
|
|
1475
|
+
motion: z14.enum(["subtle", "standard", "expressive"])
|
|
881
1476
|
});
|
|
882
|
-
var colourHexString =
|
|
883
|
-
var paletteColorSchema =
|
|
884
|
-
name:
|
|
1477
|
+
var colourHexString = z14.string().regex(/^#([0-9A-Fa-f]{3}){1,2}$/);
|
|
1478
|
+
var paletteColorSchema = z14.object({
|
|
1479
|
+
name: z14.string().min(1),
|
|
885
1480
|
hex: colourHexString
|
|
886
1481
|
});
|
|
887
|
-
var paletteMetaSchema =
|
|
888
|
-
mode:
|
|
1482
|
+
var paletteMetaSchema = z14.object({
|
|
1483
|
+
mode: z14.enum(["light", "dark"])
|
|
889
1484
|
});
|
|
890
|
-
var paletteSchema =
|
|
891
|
-
colors:
|
|
1485
|
+
var paletteSchema = z14.object({
|
|
1486
|
+
colors: z14.array(paletteColorSchema),
|
|
892
1487
|
meta: paletteMetaSchema
|
|
893
1488
|
});
|
|
894
|
-
var typographyStyleSchema =
|
|
895
|
-
family:
|
|
896
|
-
weight:
|
|
897
|
-
letterSpacing:
|
|
898
|
-
lineHeight:
|
|
1489
|
+
var typographyStyleSchema = z14.object({
|
|
1490
|
+
family: z14.string().min(1),
|
|
1491
|
+
weight: z14.enum(["light", "regular", "medium", "semibold", "bold"]),
|
|
1492
|
+
letterSpacing: z14.enum(["tight", "normal", "loose"]),
|
|
1493
|
+
lineHeight: z14.enum(["normal", "relaxed", "loose"])
|
|
899
1494
|
});
|
|
900
1495
|
var bodyTypographyStyleSchema = typographyStyleSchema.extend({
|
|
901
|
-
size:
|
|
1496
|
+
size: z14.enum(["md", "lg", "xl"])
|
|
902
1497
|
});
|
|
903
|
-
var headingSizeSchema =
|
|
904
|
-
var headingTypographyOverridesSchema =
|
|
905
|
-
weight:
|
|
906
|
-
letterSpacing:
|
|
1498
|
+
var headingSizeSchema = z14.enum(["xs", "sm", "md", "lg", "xl", "2xl"]);
|
|
1499
|
+
var headingTypographyOverridesSchema = z14.object({
|
|
1500
|
+
weight: z14.enum(["light", "regular", "medium", "semibold", "bold"]).nullable().optional(),
|
|
1501
|
+
letterSpacing: z14.enum(["tight", "normal", "loose"]).nullable().optional(),
|
|
907
1502
|
size: headingSizeSchema.nullable().optional(),
|
|
908
|
-
lineHeight:
|
|
909
|
-
italic:
|
|
910
|
-
colorToken:
|
|
1503
|
+
lineHeight: z14.enum(["normal", "relaxed", "loose"]).nullable().optional(),
|
|
1504
|
+
italic: z14.boolean().nullable().optional(),
|
|
1505
|
+
colorToken: z14.string().min(1).nullable().optional()
|
|
911
1506
|
// Palette token name for heading color
|
|
912
1507
|
});
|
|
913
1508
|
var headingTypographyStyleSchema = typographyStyleSchema.extend({
|
|
914
|
-
case:
|
|
915
|
-
italic:
|
|
916
|
-
colorToken:
|
|
1509
|
+
case: z14.enum(["uppercase", "normal", "smallCaps"]).nullable(),
|
|
1510
|
+
italic: z14.boolean().nullable(),
|
|
1511
|
+
colorToken: z14.string().min(1).nullable().optional()
|
|
917
1512
|
// Palette token name for heading color
|
|
918
1513
|
});
|
|
919
|
-
var proseLinkUnderlineStyleSchema =
|
|
920
|
-
var proseLinkUnderlineThicknessSchema =
|
|
921
|
-
var proseLinkUnderlineOffsetSchema =
|
|
922
|
-
var proseLinkStyleSchema =
|
|
923
|
-
colorToken:
|
|
924
|
-
hoverColorToken:
|
|
925
|
-
underline:
|
|
926
|
-
decorationColorToken:
|
|
927
|
-
hoverDecorationColorToken:
|
|
1514
|
+
var proseLinkUnderlineStyleSchema = z14.enum(["solid", "dotted", "dashed"]);
|
|
1515
|
+
var proseLinkUnderlineThicknessSchema = z14.enum(["auto", "fromFont", "thin", "medium", "thick"]);
|
|
1516
|
+
var proseLinkUnderlineOffsetSchema = z14.enum(["auto", "tight", "normal", "loose"]);
|
|
1517
|
+
var proseLinkStyleSchema = z14.object({
|
|
1518
|
+
colorToken: z14.string().min(1).optional(),
|
|
1519
|
+
hoverColorToken: z14.string().min(1).optional(),
|
|
1520
|
+
underline: z14.boolean().optional(),
|
|
1521
|
+
decorationColorToken: z14.string().min(1).optional(),
|
|
1522
|
+
hoverDecorationColorToken: z14.string().min(1).optional(),
|
|
928
1523
|
underlineStyle: proseLinkUnderlineStyleSchema.optional(),
|
|
929
1524
|
underlineThickness: proseLinkUnderlineThicknessSchema.optional(),
|
|
930
1525
|
underlineOffset: proseLinkUnderlineOffsetSchema.optional()
|
|
931
1526
|
});
|
|
932
|
-
var semanticSpacingSchema =
|
|
1527
|
+
var semanticSpacingSchema = z14.enum([
|
|
933
1528
|
"none",
|
|
934
1529
|
"compact",
|
|
935
1530
|
"cozy",
|
|
@@ -937,62 +1532,62 @@ var semanticSpacingSchema = z12.enum([
|
|
|
937
1532
|
"comfortable",
|
|
938
1533
|
"spacious"
|
|
939
1534
|
]);
|
|
940
|
-
var boxRoundedSchema =
|
|
941
|
-
var boxBackgroundOverlaySchema =
|
|
942
|
-
type:
|
|
943
|
-
color:
|
|
944
|
-
gradient:
|
|
945
|
-
opacity:
|
|
1535
|
+
var boxRoundedSchema = z14.enum(["none", "sm", "md", "lg", "xl", "2xl", "full"]);
|
|
1536
|
+
var boxBackgroundOverlaySchema = z14.object({
|
|
1537
|
+
type: z14.enum(["none", "color", "gradient"]).nullable().optional(),
|
|
1538
|
+
color: z14.string().nullable().optional(),
|
|
1539
|
+
gradient: z14.string().nullable().optional(),
|
|
1540
|
+
opacity: z14.number().min(0).max(1).nullable().optional()
|
|
946
1541
|
});
|
|
947
|
-
var boxBackgroundSchema =
|
|
948
|
-
type:
|
|
949
|
-
color:
|
|
950
|
-
gradient:
|
|
1542
|
+
var boxBackgroundSchema = z14.object({
|
|
1543
|
+
type: z14.enum(["color", "gradient", "image"]).optional(),
|
|
1544
|
+
color: z14.string().nullable().optional(),
|
|
1545
|
+
gradient: z14.string().nullable().optional(),
|
|
951
1546
|
image: mediaSchema.nullable().optional(),
|
|
952
|
-
objectFit:
|
|
953
|
-
scale:
|
|
954
|
-
position:
|
|
955
|
-
opacity:
|
|
1547
|
+
objectFit: z14.enum(["fill", "fit", "original", "custom"]).nullable().optional(),
|
|
1548
|
+
scale: z14.string().nullable().optional(),
|
|
1549
|
+
position: z14.string().nullable().optional(),
|
|
1550
|
+
opacity: z14.number().min(0).max(1).nullable().optional(),
|
|
956
1551
|
overlay: boxBackgroundOverlaySchema.nullable().optional(),
|
|
957
|
-
textColor:
|
|
958
|
-
headingColor:
|
|
1552
|
+
textColor: z14.string().nullable().optional(),
|
|
1553
|
+
headingColor: z14.string().nullable().optional()
|
|
959
1554
|
});
|
|
960
|
-
var sectionStylesOverrideSchema =
|
|
1555
|
+
var sectionStylesOverrideSchema = z14.object({
|
|
961
1556
|
background: boxBackgroundSchema.nullable().optional(),
|
|
962
1557
|
spacing: semanticSpacingSchema.nullable().optional(),
|
|
963
|
-
minHeight:
|
|
1558
|
+
minHeight: z14.enum(["none", "hero", "immersive"]).nullable().optional()
|
|
964
1559
|
});
|
|
965
|
-
var containerStylesOverrideSchema =
|
|
1560
|
+
var containerStylesOverrideSchema = z14.object({
|
|
966
1561
|
background: boxBackgroundSchema.nullable().optional(),
|
|
967
1562
|
spacing: semanticSpacingSchema.nullable().optional(),
|
|
968
|
-
raised:
|
|
1563
|
+
raised: z14.boolean().nullable().optional(),
|
|
969
1564
|
rounded: boxRoundedSchema.nullable().optional(),
|
|
970
|
-
fullWidth:
|
|
1565
|
+
fullWidth: z14.boolean().nullable().optional()
|
|
971
1566
|
});
|
|
972
|
-
var cardBorderOverrideSchema =
|
|
973
|
-
enabled:
|
|
974
|
-
width:
|
|
975
|
-
colorToken:
|
|
1567
|
+
var cardBorderOverrideSchema = z14.object({
|
|
1568
|
+
enabled: z14.boolean().nullable().optional(),
|
|
1569
|
+
width: z14.enum(["none", "1", "2", "3"]).nullable().optional(),
|
|
1570
|
+
colorToken: z14.string().nullable().optional()
|
|
976
1571
|
});
|
|
977
|
-
var cardStylesOverrideSchema =
|
|
1572
|
+
var cardStylesOverrideSchema = z14.object({
|
|
978
1573
|
background: boxBackgroundSchema.nullable().optional(),
|
|
979
1574
|
border: cardBorderOverrideSchema.nullable().optional(),
|
|
980
1575
|
spacing: semanticSpacingSchema.nullable().optional(),
|
|
981
|
-
raised:
|
|
1576
|
+
raised: z14.boolean().nullable().optional(),
|
|
982
1577
|
rounded: boxRoundedSchema.nullable().optional()
|
|
983
1578
|
});
|
|
984
|
-
var blockStyleOverridesSchema =
|
|
1579
|
+
var blockStyleOverridesSchema = z14.object({
|
|
985
1580
|
sectionStyles: sectionStylesOverrideSchema.nullable().optional(),
|
|
986
1581
|
containerStyles: containerStylesOverrideSchema.nullable().optional(),
|
|
987
1582
|
cardStyles: cardStylesOverrideSchema.nullable().optional()
|
|
988
1583
|
});
|
|
989
|
-
var blockThemeOverrideSchema =
|
|
990
|
-
typography:
|
|
1584
|
+
var blockThemeOverrideSchema = z14.object({
|
|
1585
|
+
typography: z14.object({
|
|
991
1586
|
proseLinkStyle: proseLinkStyleSchema.optional()
|
|
992
1587
|
}).optional(),
|
|
993
1588
|
styles: blockStyleOverridesSchema.optional()
|
|
994
1589
|
});
|
|
995
|
-
var typographyScaleSchema =
|
|
1590
|
+
var typographyScaleSchema = z14.enum([
|
|
996
1591
|
// New intuitive names
|
|
997
1592
|
"compact",
|
|
998
1593
|
// ratio 1.2 (was minorThird)
|
|
@@ -1005,9 +1600,9 @@ var typographyScaleSchema = z12.enum([
|
|
|
1005
1600
|
"majorThird",
|
|
1006
1601
|
"perfectFourth"
|
|
1007
1602
|
]);
|
|
1008
|
-
var typographySchema =
|
|
1603
|
+
var typographySchema = z14.object({
|
|
1009
1604
|
body: bodyTypographyStyleSchema,
|
|
1010
|
-
headings:
|
|
1605
|
+
headings: z14.object({
|
|
1011
1606
|
default: headingTypographyStyleSchema,
|
|
1012
1607
|
h1: headingTypographyOverridesSchema,
|
|
1013
1608
|
h2: headingTypographyOverridesSchema,
|
|
@@ -1020,41 +1615,41 @@ var typographySchema = z12.object({
|
|
|
1020
1615
|
scale: typographyScaleSchema,
|
|
1021
1616
|
proseLinkStyle: proseLinkStyleSchema.optional()
|
|
1022
1617
|
});
|
|
1023
|
-
var spaceSchema =
|
|
1024
|
-
var corners =
|
|
1025
|
-
var shadow =
|
|
1026
|
-
elevation:
|
|
1027
|
-
softness:
|
|
1028
|
-
position:
|
|
1618
|
+
var spaceSchema = z14.enum(["comfortable", "standard", "dense"]);
|
|
1619
|
+
var corners = z14.enum(["square", "soft", "rounded", "pill"]);
|
|
1620
|
+
var shadow = z14.object({
|
|
1621
|
+
elevation: z14.enum(["none", "low", "medium", "high"]),
|
|
1622
|
+
softness: z14.enum(["crisp", "soft", "hard"]).nullable(),
|
|
1623
|
+
position: z14.enum(["bottom", "bottom-right"]).default("bottom")
|
|
1029
1624
|
});
|
|
1030
|
-
var border =
|
|
1031
|
-
width:
|
|
1032
|
-
style:
|
|
1625
|
+
var border = z14.object({
|
|
1626
|
+
width: z14.enum(["none", "hairline", "thin", "thick"]),
|
|
1627
|
+
style: z14.enum(["solid", "dashed"])
|
|
1033
1628
|
});
|
|
1034
|
-
var motion =
|
|
1035
|
-
level:
|
|
1036
|
-
easing:
|
|
1629
|
+
var motion = z14.object({
|
|
1630
|
+
level: z14.enum(["off", "low", "medium", "high"]),
|
|
1631
|
+
easing: z14.enum(["standard", "snappy", "gentle"]).nullable()
|
|
1037
1632
|
});
|
|
1038
|
-
var buttonStyle =
|
|
1633
|
+
var buttonStyle = z14.object({
|
|
1039
1634
|
shape: corners
|
|
1040
1635
|
// Used for --radius-control CSS variable
|
|
1041
1636
|
});
|
|
1042
|
-
var cardStyle =
|
|
1043
|
-
elevation:
|
|
1044
|
-
border:
|
|
1637
|
+
var cardStyle = z14.object({
|
|
1638
|
+
elevation: z14.enum(["none", "low", "medium", "high"]),
|
|
1639
|
+
border: z14.enum(["none", "subtle", "defined"]),
|
|
1045
1640
|
shape: corners,
|
|
1046
|
-
headerStyle:
|
|
1047
|
-
mediaTreatment:
|
|
1641
|
+
headerStyle: z14.enum(["plain", "accentBar", "subtleBg"]).nullable(),
|
|
1642
|
+
mediaTreatment: z14.enum(["square", "rounded", "bleed"]).nullable()
|
|
1048
1643
|
});
|
|
1049
|
-
var inputStyle =
|
|
1644
|
+
var inputStyle = z14.object({
|
|
1050
1645
|
shape: corners,
|
|
1051
|
-
border:
|
|
1052
|
-
focus:
|
|
1053
|
-
label:
|
|
1646
|
+
border: z14.enum(["subtle", "defined", "underline"]),
|
|
1647
|
+
focus: z14.enum(["glow", "ring", "underline"]),
|
|
1648
|
+
label: z14.enum(["inside", "above"])
|
|
1054
1649
|
});
|
|
1055
|
-
var headerVariant =
|
|
1056
|
-
var headerPositioning =
|
|
1057
|
-
var headerNavStyle =
|
|
1650
|
+
var headerVariant = z14.enum(["classic", "centered", "transparent", "floating", "editorial"]);
|
|
1651
|
+
var headerPositioning = z14.enum(["static", "sticky", "fixed"]);
|
|
1652
|
+
var headerNavStyle = z14.enum([
|
|
1058
1653
|
"minimal",
|
|
1059
1654
|
"underline",
|
|
1060
1655
|
"underline-grow",
|
|
@@ -1063,82 +1658,82 @@ var headerNavStyle = z12.enum([
|
|
|
1063
1658
|
"frosted",
|
|
1064
1659
|
"solid"
|
|
1065
1660
|
]);
|
|
1066
|
-
var navFontWeight =
|
|
1067
|
-
var headerMaxWidth =
|
|
1068
|
-
var headerContainerSchema =
|
|
1069
|
-
rounded:
|
|
1070
|
-
border:
|
|
1071
|
-
shadow:
|
|
1072
|
-
padding:
|
|
1073
|
-
tint:
|
|
1074
|
-
opacity:
|
|
1661
|
+
var navFontWeight = z14.enum(["regular", "medium", "semibold", "bold"]);
|
|
1662
|
+
var headerMaxWidth = z14.enum(["container", "full"]);
|
|
1663
|
+
var headerContainerSchema = z14.object({
|
|
1664
|
+
rounded: z14.enum(["none", "sm", "md", "lg", "xl", "2xl"]).default("xl"),
|
|
1665
|
+
border: z14.boolean().default(true),
|
|
1666
|
+
shadow: z14.boolean().default(true),
|
|
1667
|
+
padding: z14.enum(["sm", "md", "lg"]).default("md"),
|
|
1668
|
+
tint: z14.string().nullable().optional(),
|
|
1669
|
+
opacity: z14.number().min(0).max(1).default(0.12)
|
|
1075
1670
|
}).optional();
|
|
1076
1671
|
var headerBorderSchema = componentBorderSchema.extend({
|
|
1077
|
-
position:
|
|
1672
|
+
position: z14.enum(["bottom", "top", "both", "none"]).default("bottom")
|
|
1078
1673
|
}).optional();
|
|
1079
|
-
var logoStyleSchema =
|
|
1080
|
-
fontFamily:
|
|
1081
|
-
letterSpacing:
|
|
1082
|
-
gradient:
|
|
1674
|
+
var logoStyleSchema = z14.object({
|
|
1675
|
+
fontFamily: z14.enum(["heading", "body"]).default("heading"),
|
|
1676
|
+
letterSpacing: z14.enum(["normal", "wide", "wider", "widest"]).default("normal"),
|
|
1677
|
+
gradient: z14.boolean().default(false)
|
|
1083
1678
|
}).optional();
|
|
1084
|
-
var headerLogoTextSchema =
|
|
1085
|
-
mobileWrapLines:
|
|
1086
|
-
mobileMaxWidth:
|
|
1087
|
-
hideOnShrink:
|
|
1679
|
+
var headerLogoTextSchema = z14.object({
|
|
1680
|
+
mobileWrapLines: z14.union([z14.literal(1), z14.literal(2)]).optional(),
|
|
1681
|
+
mobileMaxWidth: z14.enum(["xs", "sm", "md"]).optional(),
|
|
1682
|
+
hideOnShrink: z14.boolean().optional()
|
|
1088
1683
|
}).optional();
|
|
1089
|
-
var navEffectsSchema =
|
|
1090
|
-
underlineGradient:
|
|
1091
|
-
glow:
|
|
1092
|
-
glowColor:
|
|
1093
|
-
neumorphic:
|
|
1684
|
+
var navEffectsSchema = z14.object({
|
|
1685
|
+
underlineGradient: z14.boolean().default(false),
|
|
1686
|
+
glow: z14.boolean().default(false),
|
|
1687
|
+
glowColor: z14.string().optional(),
|
|
1688
|
+
neumorphic: z14.boolean().default(false)
|
|
1094
1689
|
}).optional();
|
|
1095
|
-
var dropdownStyleSchema =
|
|
1690
|
+
var dropdownStyleSchema = z14.object({
|
|
1096
1691
|
// Container styling
|
|
1097
|
-
background:
|
|
1692
|
+
background: z14.string().default("surface"),
|
|
1098
1693
|
// color token
|
|
1099
|
-
textColor:
|
|
1694
|
+
textColor: z14.string().default("text"),
|
|
1100
1695
|
// color token
|
|
1101
|
-
borderColor:
|
|
1696
|
+
borderColor: z14.string().nullable().default("border"),
|
|
1102
1697
|
// null = no border
|
|
1103
|
-
shadow:
|
|
1104
|
-
borderRadius:
|
|
1698
|
+
shadow: z14.enum(["none", "sm", "md", "lg"]).default("md"),
|
|
1699
|
+
borderRadius: z14.enum(["none", "sm", "md", "lg"]).default("md"),
|
|
1105
1700
|
// Link hover states (explicit control)
|
|
1106
|
-
hoverBackground:
|
|
1701
|
+
hoverBackground: z14.string().nullable().optional(),
|
|
1107
1702
|
// color token, null = transparent
|
|
1108
|
-
hoverTextColor:
|
|
1703
|
+
hoverTextColor: z14.string().nullable().optional(),
|
|
1109
1704
|
// color token, null = inherit
|
|
1110
1705
|
// Typography
|
|
1111
|
-
textTransform:
|
|
1112
|
-
letterSpacing:
|
|
1113
|
-
fontWeight:
|
|
1706
|
+
textTransform: z14.enum(["none", "uppercase", "capitalize"]).default("none"),
|
|
1707
|
+
letterSpacing: z14.enum(["normal", "wide", "wider"]).default("normal"),
|
|
1708
|
+
fontWeight: z14.enum(["regular", "medium", "semibold", "bold"]).optional(),
|
|
1114
1709
|
// optional = inherit from navWeight
|
|
1115
|
-
textSize:
|
|
1710
|
+
textSize: z14.enum(["xs", "sm", "base", "lg"]).optional()
|
|
1116
1711
|
// optional = no override (browser default)
|
|
1117
1712
|
}).optional();
|
|
1118
|
-
var headerCtaGapSchema =
|
|
1119
|
-
var navContainerSchema =
|
|
1120
|
-
type:
|
|
1121
|
-
tint:
|
|
1122
|
-
opacity:
|
|
1713
|
+
var headerCtaGapSchema = z14.enum(["none", "tight", "compact", "default", "relaxed", "spacious"]);
|
|
1714
|
+
var navContainerSchema = z14.object({
|
|
1715
|
+
type: z14.enum(["none", "pill", "glass"]).default("none"),
|
|
1716
|
+
tint: z14.string().nullable().optional(),
|
|
1717
|
+
opacity: z14.number().min(0).max(1).default(0.15)
|
|
1123
1718
|
}).default({ type: "none", tint: null, opacity: 0.15 });
|
|
1124
|
-
var headerBackgroundSchema =
|
|
1125
|
-
type:
|
|
1126
|
-
color:
|
|
1719
|
+
var headerBackgroundSchema = z14.object({
|
|
1720
|
+
type: z14.enum(["color", "gradient", "image"]),
|
|
1721
|
+
color: z14.string().nullable().optional(),
|
|
1127
1722
|
gradient: gradientConfigSchema.nullable().optional(),
|
|
1128
1723
|
image: mediaSchema.nullable().optional(),
|
|
1129
|
-
textColor:
|
|
1724
|
+
textColor: z14.string().nullable().optional()
|
|
1130
1725
|
});
|
|
1131
|
-
var headerSchema =
|
|
1726
|
+
var headerSchema = z14.object({
|
|
1132
1727
|
variant: headerVariant,
|
|
1133
1728
|
positioning: headerPositioning,
|
|
1134
|
-
shrinkOnScroll:
|
|
1729
|
+
shrinkOnScroll: z14.boolean(),
|
|
1135
1730
|
maxWidth: headerMaxWidth,
|
|
1136
1731
|
logoOverride: mediaSchema.nullable().optional(),
|
|
1137
1732
|
background: headerBackgroundSchema.default({ type: "color", color: "surface" }),
|
|
1138
|
-
textColor:
|
|
1733
|
+
textColor: z14.string().nullable().optional(),
|
|
1139
1734
|
// Site title and general header text
|
|
1140
1735
|
navStyle: headerNavStyle,
|
|
1141
|
-
navColor:
|
|
1736
|
+
navColor: z14.string().nullable().optional(),
|
|
1142
1737
|
// Nav links (inherits textColor if not set)
|
|
1143
1738
|
navWeight: navFontWeight.default("medium"),
|
|
1144
1739
|
// New fields for header system enhancement
|
|
@@ -1157,50 +1752,50 @@ var headerSchema = z12.object({
|
|
|
1157
1752
|
// Dropdown menu styling (nav dropdowns and mobile drawer)
|
|
1158
1753
|
dropdownStyle: dropdownStyleSchema
|
|
1159
1754
|
});
|
|
1160
|
-
var footerVariant =
|
|
1161
|
-
var footerMaxWidth =
|
|
1162
|
-
var footerMode =
|
|
1163
|
-
var footerNavLayoutMode =
|
|
1164
|
-
var footerNavLayoutAlign =
|
|
1165
|
-
var footerSpacing =
|
|
1166
|
-
var footerLogoPlacement =
|
|
1167
|
-
var footerLogoSize =
|
|
1168
|
-
var footerLogoMaxHeight =
|
|
1169
|
-
var footerBottomTextLinkStyleSchema =
|
|
1170
|
-
colorToken:
|
|
1171
|
-
hoverColorToken:
|
|
1172
|
-
decorationColorToken:
|
|
1173
|
-
underline:
|
|
1755
|
+
var footerVariant = z14.enum(["simple", "columns", "split"]);
|
|
1756
|
+
var footerMaxWidth = z14.enum(["container", "full"]);
|
|
1757
|
+
var footerMode = z14.enum(["default", "blocks", "default+blocks", "none"]);
|
|
1758
|
+
var footerNavLayoutMode = z14.enum(["stack", "inline", "inline-wrap"]);
|
|
1759
|
+
var footerNavLayoutAlign = z14.enum(["start", "center", "end", "space-between"]);
|
|
1760
|
+
var footerSpacing = z14.enum(["none", "tight", "compact", "default", "relaxed", "spacious"]);
|
|
1761
|
+
var footerLogoPlacement = z14.enum(["left", "right", "above", "below"]);
|
|
1762
|
+
var footerLogoSize = z14.enum(["sm", "md", "lg", "xl"]);
|
|
1763
|
+
var footerLogoMaxHeight = z14.enum(["sm", "md", "lg", "xl"]);
|
|
1764
|
+
var footerBottomTextLinkStyleSchema = z14.object({
|
|
1765
|
+
colorToken: z14.string().optional(),
|
|
1766
|
+
hoverColorToken: z14.string().nullable().optional(),
|
|
1767
|
+
decorationColorToken: z14.string().nullable().optional(),
|
|
1768
|
+
underline: z14.boolean().optional()
|
|
1174
1769
|
});
|
|
1175
|
-
var footerBottomBarSchema =
|
|
1176
|
-
enabled:
|
|
1177
|
-
fullBleed:
|
|
1770
|
+
var footerBottomBarSchema = z14.object({
|
|
1771
|
+
enabled: z14.boolean().optional(),
|
|
1772
|
+
fullBleed: z14.boolean().optional(),
|
|
1178
1773
|
background: headerBackgroundSchema.optional(),
|
|
1179
|
-
textColor:
|
|
1180
|
-
textAlign:
|
|
1774
|
+
textColor: z14.string().nullable().optional(),
|
|
1775
|
+
textAlign: z14.enum(["left", "center", "right"]).optional(),
|
|
1181
1776
|
paddingY: footerSpacing.optional(),
|
|
1182
1777
|
paddingX: footerSpacing.optional(),
|
|
1183
|
-
borderTop:
|
|
1184
|
-
colorToken:
|
|
1185
|
-
width:
|
|
1778
|
+
borderTop: z14.object({
|
|
1779
|
+
colorToken: z14.string().nullable().optional(),
|
|
1780
|
+
width: z14.enum(["none", "thin", "medium", "thick"]).optional()
|
|
1186
1781
|
}).optional()
|
|
1187
1782
|
});
|
|
1188
|
-
var footerNavLayoutSchema =
|
|
1783
|
+
var footerNavLayoutSchema = z14.object({
|
|
1189
1784
|
layout: footerNavLayoutMode.optional(),
|
|
1190
1785
|
align: footerNavLayoutAlign.optional(),
|
|
1191
1786
|
gapX: footerSpacing.optional(),
|
|
1192
1787
|
gapY: footerSpacing.optional(),
|
|
1193
|
-
columns:
|
|
1788
|
+
columns: z14.number().int().min(1).max(6).optional()
|
|
1194
1789
|
});
|
|
1195
|
-
var footerLogoSchema =
|
|
1196
|
-
showLogo:
|
|
1197
|
-
showLogoText:
|
|
1790
|
+
var footerLogoSchema = z14.object({
|
|
1791
|
+
showLogo: z14.boolean().default(true),
|
|
1792
|
+
showLogoText: z14.boolean().optional(),
|
|
1198
1793
|
placement: footerLogoPlacement.optional(),
|
|
1199
1794
|
size: footerLogoSize.optional(),
|
|
1200
1795
|
maxHeight: footerLogoMaxHeight.optional(),
|
|
1201
|
-
align:
|
|
1796
|
+
align: z14.enum(["start", "center", "end"]).optional()
|
|
1202
1797
|
});
|
|
1203
|
-
var footerSchema =
|
|
1798
|
+
var footerSchema = z14.object({
|
|
1204
1799
|
/**
|
|
1205
1800
|
* SDK-only footer rendering mode.
|
|
1206
1801
|
*
|
|
@@ -1209,11 +1804,11 @@ var footerSchema = z12.object({
|
|
|
1209
1804
|
mode: footerMode.optional(),
|
|
1210
1805
|
variant: footerVariant,
|
|
1211
1806
|
maxWidth: footerMaxWidth,
|
|
1212
|
-
showLogoText:
|
|
1807
|
+
showLogoText: z14.boolean().optional(),
|
|
1213
1808
|
background: headerBackgroundSchema.default({ type: "color", color: "surface" }),
|
|
1214
1809
|
// Footer nav styling (independent from header)
|
|
1215
1810
|
navStyle: headerNavStyle.default("minimal"),
|
|
1216
|
-
navColor:
|
|
1811
|
+
navColor: z14.string().nullable().optional(),
|
|
1217
1812
|
navWeight: navFontWeight.default("medium"),
|
|
1218
1813
|
// Full nav link customization (overrides navStyle if set)
|
|
1219
1814
|
navLinkStyle: navLinkStyleSchema.optional(),
|
|
@@ -1224,15 +1819,15 @@ var footerSchema = z12.object({
|
|
|
1224
1819
|
logo: footerLogoSchema.optional(),
|
|
1225
1820
|
bottomBar: footerBottomBarSchema.optional()
|
|
1226
1821
|
});
|
|
1227
|
-
var containerPaddingPresetSchema =
|
|
1228
|
-
var layoutSchema =
|
|
1229
|
-
containerPadding:
|
|
1822
|
+
var containerPaddingPresetSchema = z14.enum(["tight", "compact", "default", "relaxed"]);
|
|
1823
|
+
var layoutSchema = z14.object({
|
|
1824
|
+
containerPadding: z14.object({
|
|
1230
1825
|
mobile: containerPaddingPresetSchema.optional(),
|
|
1231
1826
|
tablet: containerPaddingPresetSchema.optional(),
|
|
1232
1827
|
desktop: containerPaddingPresetSchema.optional()
|
|
1233
1828
|
}).optional()
|
|
1234
1829
|
}).optional();
|
|
1235
|
-
var heroTypographySizeSchema =
|
|
1830
|
+
var heroTypographySizeSchema = z14.enum([
|
|
1236
1831
|
"sm",
|
|
1237
1832
|
"base",
|
|
1238
1833
|
"lg",
|
|
@@ -1243,14 +1838,14 @@ var heroTypographySizeSchema = z12.enum([
|
|
|
1243
1838
|
"5xl",
|
|
1244
1839
|
"6xl"
|
|
1245
1840
|
]);
|
|
1246
|
-
var heroTypographyLineHeightSchema =
|
|
1247
|
-
var heroResponsiveTypographySchema =
|
|
1841
|
+
var heroTypographyLineHeightSchema = z14.enum(["tight", "snug", "normal", "relaxed"]);
|
|
1842
|
+
var heroResponsiveTypographySchema = z14.object({
|
|
1248
1843
|
headlineSize: heroTypographySizeSchema.optional(),
|
|
1249
1844
|
headlineLineHeight: heroTypographyLineHeightSchema.optional(),
|
|
1250
1845
|
subheadlineSize: heroTypographySizeSchema.optional(),
|
|
1251
1846
|
subheadlineLineHeight: heroTypographyLineHeightSchema.optional()
|
|
1252
1847
|
});
|
|
1253
|
-
var heroTypographySchema =
|
|
1848
|
+
var heroTypographySchema = z14.object({
|
|
1254
1849
|
headlineSize: heroTypographySizeSchema.optional(),
|
|
1255
1850
|
headlineLineHeight: heroTypographyLineHeightSchema.optional(),
|
|
1256
1851
|
subheadlineSize: heroTypographySizeSchema.optional(),
|
|
@@ -1259,24 +1854,24 @@ var heroTypographySchema = z12.object({
|
|
|
1259
1854
|
microHeadlineLineHeight: heroTypographyLineHeightSchema.optional(),
|
|
1260
1855
|
microSubheadlineSize: heroTypographySizeSchema.optional(),
|
|
1261
1856
|
microSubheadlineLineHeight: heroTypographyLineHeightSchema.optional(),
|
|
1262
|
-
responsive:
|
|
1857
|
+
responsive: z14.object({
|
|
1263
1858
|
tablet: heroResponsiveTypographySchema.optional(),
|
|
1264
1859
|
mobile: heroResponsiveTypographySchema.optional()
|
|
1265
1860
|
}).optional()
|
|
1266
1861
|
});
|
|
1267
|
-
var heroSchema =
|
|
1862
|
+
var heroSchema = z14.object({
|
|
1268
1863
|
typography: heroTypographySchema.optional()
|
|
1269
1864
|
}).optional();
|
|
1270
|
-
var gradientsSchema =
|
|
1271
|
-
button:
|
|
1272
|
-
hero:
|
|
1273
|
-
background:
|
|
1865
|
+
var gradientsSchema = z14.object({
|
|
1866
|
+
button: z14.string().min(1).nullable().optional(),
|
|
1867
|
+
hero: z14.string().min(1).nullable().optional(),
|
|
1868
|
+
background: z14.string().min(1).nullable().optional()
|
|
1274
1869
|
});
|
|
1275
|
-
var themeSchema =
|
|
1276
|
-
name:
|
|
1277
|
-
description:
|
|
1278
|
-
rationale:
|
|
1279
|
-
siteStyleId:
|
|
1870
|
+
var themeSchema = z14.object({
|
|
1871
|
+
name: z14.string().min(1).max(30),
|
|
1872
|
+
description: z14.string().min(1).max(400),
|
|
1873
|
+
rationale: z14.string().min(1).max(400),
|
|
1874
|
+
siteStyleId: z14.string().min(1).transform((value) => asSiteStyleId(value)).optional(),
|
|
1280
1875
|
axes: axesSchema,
|
|
1281
1876
|
palette: paletteSchema,
|
|
1282
1877
|
typography: typographySchema,
|
|
@@ -1303,16 +1898,16 @@ var themeSchema = z12.object({
|
|
|
1303
1898
|
// Block-specific customization (Tier 3)
|
|
1304
1899
|
// blockCustomVars: Per-block CSS variable overrides as bare values
|
|
1305
1900
|
// Example: { "event-registration": { "--step-color": "#6d28d9" } }
|
|
1306
|
-
blockCustomVars:
|
|
1307
|
-
|
|
1901
|
+
blockCustomVars: z14.record(
|
|
1902
|
+
z14.string(),
|
|
1308
1903
|
// block kind (matches data-block attribute)
|
|
1309
|
-
|
|
1904
|
+
z14.record(z14.string(), z14.string())
|
|
1310
1905
|
// { '--var-name': 'value' }
|
|
1311
1906
|
).optional(),
|
|
1312
1907
|
// Structured block-kind theme overrides (v1: typography prose-link style only)
|
|
1313
1908
|
// Keyed by block kind (usually data-block value like "hero"; "block.hero" also accepted)
|
|
1314
|
-
blockOverrides:
|
|
1315
|
-
|
|
1909
|
+
blockOverrides: z14.record(
|
|
1910
|
+
z14.string(),
|
|
1316
1911
|
blockThemeOverrideSchema
|
|
1317
1912
|
).optional(),
|
|
1318
1913
|
// Structured custom CSS rules
|
|
@@ -1348,12 +1943,371 @@ var themeSchema = z12.object({
|
|
|
1348
1943
|
* }
|
|
1349
1944
|
* ```
|
|
1350
1945
|
*/
|
|
1351
|
-
styleGroups:
|
|
1946
|
+
styleGroups: z14.record(z14.string(), z14.array(z14.string())).optional()
|
|
1947
|
+
});
|
|
1948
|
+
var themesTurnSchema = z14.object({
|
|
1949
|
+
message: z14.string().min(1),
|
|
1950
|
+
themes: z14.array(themeSchema).length(3)
|
|
1951
|
+
});
|
|
1952
|
+
|
|
1953
|
+
// ../theme-core/src/palette/variants/types.ts
|
|
1954
|
+
import { z as z15 } from "zod";
|
|
1955
|
+
function asPaletteVariantId(value) {
|
|
1956
|
+
if (value.length === 0) {
|
|
1957
|
+
throw new Error("PaletteVariantId must be a non-empty string");
|
|
1958
|
+
}
|
|
1959
|
+
return value;
|
|
1960
|
+
}
|
|
1961
|
+
var paletteVariantIdSchema = z15.string().min(1).transform((value) => asPaletteVariantId(value));
|
|
1962
|
+
var PALETTE_TOKEN_NAMES = [
|
|
1963
|
+
"primary",
|
|
1964
|
+
"primaryForeground",
|
|
1965
|
+
"secondary",
|
|
1966
|
+
"accent",
|
|
1967
|
+
"success",
|
|
1968
|
+
"warning",
|
|
1969
|
+
"destructive",
|
|
1970
|
+
"background",
|
|
1971
|
+
"surface",
|
|
1972
|
+
"surfaceAlt",
|
|
1973
|
+
"muted",
|
|
1974
|
+
"text",
|
|
1975
|
+
"border"
|
|
1976
|
+
];
|
|
1977
|
+
var paletteTokenNameSchema = z15.enum(PALETTE_TOKEN_NAMES);
|
|
1978
|
+
var HEX_COLOR_REGEX = /^#[0-9a-f]{6}$/;
|
|
1979
|
+
var hexColorSchema = z15.string().regex(HEX_COLOR_REGEX, "Hex must be #RRGGBB (lowercase)").transform((value) => value);
|
|
1980
|
+
var variantPaletteColorSchema = paletteColorSchema.extend({
|
|
1981
|
+
name: paletteTokenNameSchema
|
|
1352
1982
|
});
|
|
1353
|
-
var
|
|
1354
|
-
|
|
1355
|
-
|
|
1983
|
+
var paletteVariantSchema = z15.object({
|
|
1984
|
+
id: paletteVariantIdSchema,
|
|
1985
|
+
name: z15.string().min(1),
|
|
1986
|
+
description: z15.string().min(1),
|
|
1987
|
+
tags: styleTagsSchema,
|
|
1988
|
+
mode: z15.enum(["light", "dark"]),
|
|
1989
|
+
colors: z15.array(variantPaletteColorSchema).min(1)
|
|
1356
1990
|
});
|
|
1991
|
+
function definePaletteVariant(input) {
|
|
1992
|
+
return {
|
|
1993
|
+
id: asPaletteVariantId(input.id),
|
|
1994
|
+
name: input.name,
|
|
1995
|
+
description: input.description,
|
|
1996
|
+
tags: input.tags,
|
|
1997
|
+
mode: input.mode,
|
|
1998
|
+
colors: input.colors
|
|
1999
|
+
};
|
|
2000
|
+
}
|
|
2001
|
+
var paletteOverridesSchema = z15.object({
|
|
2002
|
+
primary: hexColorSchema.optional(),
|
|
2003
|
+
primaryForeground: hexColorSchema.optional(),
|
|
2004
|
+
secondary: hexColorSchema.optional(),
|
|
2005
|
+
accent: hexColorSchema.optional(),
|
|
2006
|
+
success: hexColorSchema.optional(),
|
|
2007
|
+
warning: hexColorSchema.optional(),
|
|
2008
|
+
destructive: hexColorSchema.optional(),
|
|
2009
|
+
background: hexColorSchema.optional(),
|
|
2010
|
+
surface: hexColorSchema.optional(),
|
|
2011
|
+
surfaceAlt: hexColorSchema.optional(),
|
|
2012
|
+
muted: hexColorSchema.optional(),
|
|
2013
|
+
text: hexColorSchema.optional(),
|
|
2014
|
+
border: hexColorSchema.optional()
|
|
2015
|
+
}).strict().transform((value) => value);
|
|
2016
|
+
|
|
2017
|
+
// ../theme-core/src/palette/variants/brand-led.ts
|
|
2018
|
+
var brandLedCool = definePaletteVariant({
|
|
2019
|
+
id: "brand-led-cool",
|
|
2020
|
+
name: "Brand-led \u2014 Cool",
|
|
2021
|
+
description: "Confident blue primary with slate neutrals.",
|
|
2022
|
+
tags: { tone: "classic", energy: "calm", era: "modern" },
|
|
2023
|
+
mode: "light",
|
|
2024
|
+
colors: [
|
|
2025
|
+
{ name: "primary", hex: "#2563eb" },
|
|
2026
|
+
{ name: "secondary", hex: "#64748b" },
|
|
2027
|
+
{ name: "accent", hex: "#0f766e" },
|
|
2028
|
+
{ name: "success", hex: "#16a34a" },
|
|
2029
|
+
{ name: "warning", hex: "#d97706" },
|
|
2030
|
+
{ name: "destructive", hex: "#dc2626" },
|
|
2031
|
+
{ name: "background", hex: "#ffffff" },
|
|
2032
|
+
{ name: "surface", hex: "#ffffff" },
|
|
2033
|
+
{ name: "surfaceAlt", hex: "#f8fafc" },
|
|
2034
|
+
{ name: "muted", hex: "#f1f5f9" },
|
|
2035
|
+
{ name: "text", hex: "#0f172a" },
|
|
2036
|
+
{ name: "primaryForeground", hex: "#ffffff" },
|
|
2037
|
+
{ name: "border", hex: "#cbd5e1" }
|
|
2038
|
+
]
|
|
2039
|
+
});
|
|
2040
|
+
var brandLedWarm = definePaletteVariant({
|
|
2041
|
+
id: "brand-led-warm",
|
|
2042
|
+
name: "Brand-led \u2014 Warm",
|
|
2043
|
+
description: "Sunset orange primary with warm grey neutrals.",
|
|
2044
|
+
tags: { tone: "classic", energy: "vibrant", era: "modern" },
|
|
2045
|
+
mode: "light",
|
|
2046
|
+
colors: [
|
|
2047
|
+
{ name: "primary", hex: "#ea580c" },
|
|
2048
|
+
{ name: "secondary", hex: "#78716c" },
|
|
2049
|
+
{ name: "accent", hex: "#a16207" },
|
|
2050
|
+
{ name: "success", hex: "#16a34a" },
|
|
2051
|
+
{ name: "warning", hex: "#d97706" },
|
|
2052
|
+
{ name: "destructive", hex: "#b91c1c" },
|
|
2053
|
+
{ name: "background", hex: "#fffaf3" },
|
|
2054
|
+
{ name: "surface", hex: "#ffffff" },
|
|
2055
|
+
{ name: "surfaceAlt", hex: "#fbeee0" },
|
|
2056
|
+
{ name: "muted", hex: "#f4e2cd" },
|
|
2057
|
+
{ name: "text", hex: "#1c1917" },
|
|
2058
|
+
{ name: "primaryForeground", hex: "#fffaf3" },
|
|
2059
|
+
{ name: "border", hex: "#d6c4ad" }
|
|
2060
|
+
]
|
|
2061
|
+
});
|
|
2062
|
+
var brandLedJewel = definePaletteVariant({
|
|
2063
|
+
id: "brand-led-jewel",
|
|
2064
|
+
name: "Brand-led \u2014 Jewel",
|
|
2065
|
+
description: "Deep emerald primary with rich neutrals.",
|
|
2066
|
+
tags: { tone: "bold", energy: "vibrant", era: "modern" },
|
|
2067
|
+
mode: "light",
|
|
2068
|
+
colors: [
|
|
2069
|
+
{ name: "primary", hex: "#047857" },
|
|
2070
|
+
{ name: "secondary", hex: "#4b5563" },
|
|
2071
|
+
{ name: "accent", hex: "#7c3aed" },
|
|
2072
|
+
{ name: "success", hex: "#15803d" },
|
|
2073
|
+
{ name: "warning", hex: "#b45309" },
|
|
2074
|
+
{ name: "destructive", hex: "#b91c1c" },
|
|
2075
|
+
{ name: "background", hex: "#ffffff" },
|
|
2076
|
+
{ name: "surface", hex: "#ffffff" },
|
|
2077
|
+
{ name: "surfaceAlt", hex: "#f5f5f4" },
|
|
2078
|
+
{ name: "muted", hex: "#e7e5e4" },
|
|
2079
|
+
{ name: "text", hex: "#0c0a09" },
|
|
2080
|
+
{ name: "primaryForeground", hex: "#ffffff" },
|
|
2081
|
+
{ name: "border", hex: "#a8a29e" }
|
|
2082
|
+
]
|
|
2083
|
+
});
|
|
2084
|
+
|
|
2085
|
+
// ../theme-core/src/palette/variants/high-contrast.ts
|
|
2086
|
+
var highContrastInk = definePaletteVariant({
|
|
2087
|
+
id: "high-contrast-ink",
|
|
2088
|
+
name: "High Contrast \u2014 Ink",
|
|
2089
|
+
description: "Near-black primary with cool greys.",
|
|
2090
|
+
tags: { tone: "bold", energy: "calm", era: "editorial" },
|
|
2091
|
+
mode: "light",
|
|
2092
|
+
colors: [
|
|
2093
|
+
{ name: "primary", hex: "#111827" },
|
|
2094
|
+
{ name: "secondary", hex: "#374151" },
|
|
2095
|
+
{ name: "accent", hex: "#1d4ed8" },
|
|
2096
|
+
{ name: "success", hex: "#047857" },
|
|
2097
|
+
{ name: "warning", hex: "#b45309" },
|
|
2098
|
+
{ name: "destructive", hex: "#b91c1c" },
|
|
2099
|
+
{ name: "background", hex: "#ffffff" },
|
|
2100
|
+
{ name: "surface", hex: "#ffffff" },
|
|
2101
|
+
{ name: "surfaceAlt", hex: "#f3f4f6" },
|
|
2102
|
+
{ name: "muted", hex: "#e5e7eb" },
|
|
2103
|
+
{ name: "text", hex: "#030712" },
|
|
2104
|
+
{ name: "primaryForeground", hex: "#ffffff" },
|
|
2105
|
+
{ name: "border", hex: "#6b7280" }
|
|
2106
|
+
]
|
|
2107
|
+
});
|
|
2108
|
+
var highContrastCharcoal = definePaletteVariant({
|
|
2109
|
+
id: "high-contrast-charcoal",
|
|
2110
|
+
name: "High Contrast \u2014 Charcoal",
|
|
2111
|
+
description: "Warm charcoal primary on a soft cream ground.",
|
|
2112
|
+
tags: { tone: "minimal", energy: "calm", era: "editorial" },
|
|
2113
|
+
mode: "light",
|
|
2114
|
+
colors: [
|
|
2115
|
+
{ name: "primary", hex: "#1f2937" },
|
|
2116
|
+
{ name: "secondary", hex: "#52525b" },
|
|
2117
|
+
{ name: "accent", hex: "#a16207" },
|
|
2118
|
+
{ name: "success", hex: "#15803d" },
|
|
2119
|
+
{ name: "warning", hex: "#b45309" },
|
|
2120
|
+
{ name: "destructive", hex: "#991b1b" },
|
|
2121
|
+
{ name: "background", hex: "#fafaf9" },
|
|
2122
|
+
{ name: "surface", hex: "#ffffff" },
|
|
2123
|
+
{ name: "surfaceAlt", hex: "#f5f5f4" },
|
|
2124
|
+
{ name: "muted", hex: "#e7e5e4" },
|
|
2125
|
+
{ name: "text", hex: "#0c0a09" },
|
|
2126
|
+
{ name: "primaryForeground", hex: "#fafaf9" },
|
|
2127
|
+
{ name: "border", hex: "#a8a29e" }
|
|
2128
|
+
]
|
|
2129
|
+
});
|
|
2130
|
+
var highContrastMonochrome = definePaletteVariant({
|
|
2131
|
+
id: "high-contrast-monochrome",
|
|
2132
|
+
name: "High Contrast \u2014 Monochrome",
|
|
2133
|
+
description: "Pure black-on-white with a single saturated accent.",
|
|
2134
|
+
tags: { tone: "bold", energy: "vibrant", era: "editorial" },
|
|
2135
|
+
mode: "light",
|
|
2136
|
+
colors: [
|
|
2137
|
+
{ name: "primary", hex: "#000000" },
|
|
2138
|
+
{ name: "secondary", hex: "#404040" },
|
|
2139
|
+
{ name: "accent", hex: "#dc2626" },
|
|
2140
|
+
{ name: "success", hex: "#000000" },
|
|
2141
|
+
{ name: "warning", hex: "#000000" },
|
|
2142
|
+
{ name: "destructive", hex: "#dc2626" },
|
|
2143
|
+
{ name: "background", hex: "#ffffff" },
|
|
2144
|
+
{ name: "surface", hex: "#ffffff" },
|
|
2145
|
+
{ name: "surfaceAlt", hex: "#f5f5f5" },
|
|
2146
|
+
{ name: "muted", hex: "#e5e5e5" },
|
|
2147
|
+
{ name: "text", hex: "#000000" },
|
|
2148
|
+
{ name: "primaryForeground", hex: "#ffffff" },
|
|
2149
|
+
{ name: "border", hex: "#525252" }
|
|
2150
|
+
]
|
|
2151
|
+
});
|
|
2152
|
+
|
|
2153
|
+
// ../theme-core/src/palette/variants/soft-natural.ts
|
|
2154
|
+
var softNaturalSage = definePaletteVariant({
|
|
2155
|
+
id: "soft-natural-sage",
|
|
2156
|
+
name: "Soft Natural \u2014 Sage",
|
|
2157
|
+
description: "Olive sage primary on an off-white ground.",
|
|
2158
|
+
tags: { tone: "classic", energy: "calm", era: "organic" },
|
|
2159
|
+
mode: "light",
|
|
2160
|
+
colors: [
|
|
2161
|
+
{ name: "primary", hex: "#3f6212" },
|
|
2162
|
+
{ name: "secondary", hex: "#6b7280" },
|
|
2163
|
+
{ name: "accent", hex: "#0f766e" },
|
|
2164
|
+
{ name: "success", hex: "#15803d" },
|
|
2165
|
+
{ name: "warning", hex: "#a16207" },
|
|
2166
|
+
{ name: "destructive", hex: "#b91c1c" },
|
|
2167
|
+
{ name: "background", hex: "#fbfdf7" },
|
|
2168
|
+
{ name: "surface", hex: "#ffffff" },
|
|
2169
|
+
{ name: "surfaceAlt", hex: "#eef5e8" },
|
|
2170
|
+
{ name: "muted", hex: "#e7efdf" },
|
|
2171
|
+
{ name: "text", hex: "#1f2a1d" },
|
|
2172
|
+
{ name: "primaryForeground", hex: "#ffffff" },
|
|
2173
|
+
{ name: "border", hex: "#cbd8c0" }
|
|
2174
|
+
]
|
|
2175
|
+
});
|
|
2176
|
+
var softNaturalStone = definePaletteVariant({
|
|
2177
|
+
id: "soft-natural-stone",
|
|
2178
|
+
name: "Soft Natural \u2014 Stone",
|
|
2179
|
+
description: "River-stone grey-green primary with cool neutrals.",
|
|
2180
|
+
tags: { tone: "minimal", energy: "calm", era: "organic" },
|
|
2181
|
+
mode: "light",
|
|
2182
|
+
colors: [
|
|
2183
|
+
{ name: "primary", hex: "#5a7a5d" },
|
|
2184
|
+
{ name: "secondary", hex: "#8a9a8c" },
|
|
2185
|
+
{ name: "accent", hex: "#c9b88f" },
|
|
2186
|
+
{ name: "success", hex: "#5a7a5d" },
|
|
2187
|
+
{ name: "warning", hex: "#a89466" },
|
|
2188
|
+
{ name: "destructive", hex: "#a3503e" },
|
|
2189
|
+
{ name: "background", hex: "#faf6ec" },
|
|
2190
|
+
{ name: "surface", hex: "#ffffff" },
|
|
2191
|
+
{ name: "surfaceAlt", hex: "#f0ecdf" },
|
|
2192
|
+
{ name: "muted", hex: "#e6e1d0" },
|
|
2193
|
+
{ name: "text", hex: "#2f3d31" },
|
|
2194
|
+
{ name: "primaryForeground", hex: "#faf6ec" },
|
|
2195
|
+
{ name: "border", hex: "#c9c1ad" }
|
|
2196
|
+
]
|
|
2197
|
+
});
|
|
2198
|
+
var softNaturalWatercolor = definePaletteVariant({
|
|
2199
|
+
id: "soft-natural-watercolor",
|
|
2200
|
+
name: "Soft Natural \u2014 Watercolor",
|
|
2201
|
+
description: "Soft sand primary with watercolour sage accents.",
|
|
2202
|
+
tags: { tone: "classic", energy: "vibrant", era: "organic" },
|
|
2203
|
+
mode: "light",
|
|
2204
|
+
colors: [
|
|
2205
|
+
{ name: "primary", hex: "#a8825f" },
|
|
2206
|
+
{ name: "secondary", hex: "#88a888" },
|
|
2207
|
+
{ name: "accent", hex: "#c8a78e" },
|
|
2208
|
+
{ name: "success", hex: "#7d8a5f" },
|
|
2209
|
+
{ name: "warning", hex: "#c89a4d" },
|
|
2210
|
+
{ name: "destructive", hex: "#a3503e" },
|
|
2211
|
+
{ name: "background", hex: "#fefdfa" },
|
|
2212
|
+
{ name: "surface", hex: "#ffffff" },
|
|
2213
|
+
{ name: "surfaceAlt", hex: "#f6f1e6" },
|
|
2214
|
+
{ name: "muted", hex: "#eee7d1" },
|
|
2215
|
+
{ name: "text", hex: "#4a3d30" },
|
|
2216
|
+
{ name: "primaryForeground", hex: "#fefdfa" },
|
|
2217
|
+
{ name: "border", hex: "#d8c9a8" }
|
|
2218
|
+
]
|
|
2219
|
+
});
|
|
2220
|
+
|
|
2221
|
+
// ../theme-core/src/palette/variants/warm-neutral.ts
|
|
2222
|
+
var warmNeutralClay = definePaletteVariant({
|
|
2223
|
+
id: "warm-neutral-clay",
|
|
2224
|
+
name: "Warm Neutral \u2014 Clay",
|
|
2225
|
+
description: "Terracotta primary on a cream ground.",
|
|
2226
|
+
tags: { tone: "classic", energy: "calm", era: "organic" },
|
|
2227
|
+
mode: "light",
|
|
2228
|
+
colors: [
|
|
2229
|
+
{ name: "primary", hex: "#8b5e34" },
|
|
2230
|
+
{ name: "secondary", hex: "#7c6f64" },
|
|
2231
|
+
{ name: "accent", hex: "#a15c38" },
|
|
2232
|
+
{ name: "success", hex: "#527853" },
|
|
2233
|
+
{ name: "warning", hex: "#b7791f" },
|
|
2234
|
+
{ name: "destructive", hex: "#b91c1c" },
|
|
2235
|
+
{ name: "background", hex: "#fffaf3" },
|
|
2236
|
+
{ name: "surface", hex: "#ffffff" },
|
|
2237
|
+
{ name: "surfaceAlt", hex: "#f5eadc" },
|
|
2238
|
+
{ name: "muted", hex: "#efe2d0" },
|
|
2239
|
+
{ name: "text", hex: "#2f241c" },
|
|
2240
|
+
{ name: "primaryForeground", hex: "#fffaf3" },
|
|
2241
|
+
{ name: "border", hex: "#d8c6b3" }
|
|
2242
|
+
]
|
|
2243
|
+
});
|
|
2244
|
+
var warmNeutralCream = definePaletteVariant({
|
|
2245
|
+
id: "warm-neutral-cream",
|
|
2246
|
+
name: "Warm Neutral \u2014 Cream",
|
|
2247
|
+
description: "Soft sand primary with pale cream surfaces.",
|
|
2248
|
+
tags: { tone: "minimal", energy: "calm", era: "organic" },
|
|
2249
|
+
mode: "light",
|
|
2250
|
+
colors: [
|
|
2251
|
+
{ name: "primary", hex: "#b08864" },
|
|
2252
|
+
{ name: "secondary", hex: "#9a8c7e" },
|
|
2253
|
+
{ name: "accent", hex: "#c2956a" },
|
|
2254
|
+
{ name: "success", hex: "#7d8a5f" },
|
|
2255
|
+
{ name: "warning", hex: "#c89a4d" },
|
|
2256
|
+
{ name: "destructive", hex: "#a3503e" },
|
|
2257
|
+
{ name: "background", hex: "#fdf8ee" },
|
|
2258
|
+
{ name: "surface", hex: "#ffffff" },
|
|
2259
|
+
{ name: "surfaceAlt", hex: "#f4ebd9" },
|
|
2260
|
+
{ name: "muted", hex: "#ede3cf" },
|
|
2261
|
+
{ name: "text", hex: "#3b2f24" },
|
|
2262
|
+
{ name: "primaryForeground", hex: "#fdf8ee" },
|
|
2263
|
+
{ name: "border", hex: "#e0d2b8" }
|
|
2264
|
+
]
|
|
2265
|
+
});
|
|
2266
|
+
var warmNeutralForest = definePaletteVariant({
|
|
2267
|
+
id: "warm-neutral-forest",
|
|
2268
|
+
name: "Warm Neutral \u2014 Forest",
|
|
2269
|
+
description: "Deep forest green primary with earthy neutrals.",
|
|
2270
|
+
tags: { tone: "classic", energy: "calm", era: "organic" },
|
|
2271
|
+
mode: "light",
|
|
2272
|
+
colors: [
|
|
2273
|
+
{ name: "primary", hex: "#3d5840" },
|
|
2274
|
+
{ name: "secondary", hex: "#7a6f5d" },
|
|
2275
|
+
{ name: "accent", hex: "#b06b50" },
|
|
2276
|
+
{ name: "success", hex: "#5a7a5d" },
|
|
2277
|
+
{ name: "warning", hex: "#b7791f" },
|
|
2278
|
+
{ name: "destructive", hex: "#b91c1c" },
|
|
2279
|
+
{ name: "background", hex: "#fbf8f0" },
|
|
2280
|
+
{ name: "surface", hex: "#ffffff" },
|
|
2281
|
+
{ name: "surfaceAlt", hex: "#f2ecdb" },
|
|
2282
|
+
{ name: "muted", hex: "#ebe3cc" },
|
|
2283
|
+
{ name: "text", hex: "#2a2a2a" },
|
|
2284
|
+
{ name: "primaryForeground", hex: "#fbf8f0" },
|
|
2285
|
+
{ name: "border", hex: "#cdc1a4" }
|
|
2286
|
+
]
|
|
2287
|
+
});
|
|
2288
|
+
|
|
2289
|
+
// ../theme-core/src/palette/variants/index.ts
|
|
2290
|
+
var paletteVariants = [
|
|
2291
|
+
// Brand-led family
|
|
2292
|
+
brandLedCool,
|
|
2293
|
+
brandLedWarm,
|
|
2294
|
+
brandLedJewel,
|
|
2295
|
+
// Warm-neutral family
|
|
2296
|
+
warmNeutralClay,
|
|
2297
|
+
warmNeutralCream,
|
|
2298
|
+
warmNeutralForest,
|
|
2299
|
+
// High-contrast family
|
|
2300
|
+
highContrastInk,
|
|
2301
|
+
highContrastCharcoal,
|
|
2302
|
+
highContrastMonochrome,
|
|
2303
|
+
// Soft-natural family
|
|
2304
|
+
softNaturalSage,
|
|
2305
|
+
softNaturalStone,
|
|
2306
|
+
softNaturalWatercolor
|
|
2307
|
+
];
|
|
2308
|
+
var paletteVariantsById = new Map(
|
|
2309
|
+
paletteVariants.map((v) => [v.id, v])
|
|
2310
|
+
);
|
|
1357
2311
|
|
|
1358
2312
|
// ../theme-core/src/tokens/blockColorTokens.ts
|
|
1359
2313
|
var blockColorTokenNames = [
|