@panneau/protocol 5.0.0-alpha.1 → 5.0.0-alpha.3

package/dist/themes.js

@@ -0,0 +1,80 @@
+//#region src/themes.ts
+function mergeRecords(first, second) {
+	return first === void 0 && second === void 0 ? void 0 : {
+		...first,
+		...second
+	};
+}
+function mergeComponents(first, second) {
+	const components = mergeRecords(first, second);
+	if (components === void 0) return;
+	return Object.fromEntries(Object.keys(components).map((component) => {
+		const before = first?.[component];
+		const after = second?.[component];
+		const variants = mergeRecords(before?.variants, after?.variants);
+		return [component, {
+			...before,
+			...after,
+			...variants !== void 0 && { variants: Object.fromEntries(Object.keys(variants).map((name) => [name, {
+				...before?.variants?.[name],
+				...after?.variants?.[name]
+			}])) }
+		}];
+	}));
+}
+var DENSITIES = [
+	"compact",
+	"comfortable",
+	"touch"
+];
+function mergeDensities(first, second) {
+	if (first === void 0 && second === void 0) return;
+	const densities = {
+		...first,
+		...second
+	};
+	DENSITIES.forEach((density) => {
+		if (first?.[density] !== void 0 && second?.[density] !== void 0) densities[density] = {
+			...first[density],
+			...second[density]
+		};
+	});
+	return densities;
+}
+function mergeFonts(first, second) {
+	if (first === void 0 && second === void 0) return;
+	const fonts = [...first ?? [], ...second ?? []];
+	return fonts.filter((font, index) => fonts.findIndex((other) => JSON.stringify(other) === JSON.stringify(font)) === index);
+}
+/**
+* Merges themes, in order: each one overrides the tokens, palette colors, tones and variants of
+* those before it. A token a theme sets in `tokens` but not in `dark` applies to both schemes, so it
+* also replaces the dark value of earlier themes. Variants merge token by token; tones are replaced
+* whole; densities merge token by token; fonts add up. The label is the last one set. `defineTheme()` of `@panneau/ui` merges the same way.
+*/
+function mergeThemes(...themes) {
+	return themes.reduce((merged, theme) => {
+		const tokens = theme.tokens ?? {};
+		const dark = mergeRecords(merged.dark !== void 0 ? Object.fromEntries(Object.entries(merged.dark).filter(([name]) => !Object.hasOwn(tokens, name))) : void 0, theme.dark);
+		const result = {
+			...merged,
+			...theme,
+			label: theme.label ?? merged.label,
+			tokens: {
+				...merged.tokens,
+				...tokens
+			},
+			dark: dark !== void 0 && Object.keys(dark).length > 0 ? dark : void 0,
+			palette: mergeRecords(merged.palette, theme.palette),
+			tones: mergeRecords(merged.tones, theme.tones),
+			components: mergeComponents(merged.components, theme.components),
+			densities: mergeDensities(merged.densities, theme.densities),
+			fonts: mergeFonts(merged.fonts, theme.fonts)
+		};
+		return Object.fromEntries(Object.entries(result).filter(([, value]) => value !== void 0));
+	}, { tokens: {} });
+}
+//#endregion
+export { mergeThemes };
+
+//# sourceMappingURL=themes.js.map

package/dist/themes.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"themes.js","names":[],"sources":["../src/themes.ts"],"sourcesContent":["import type { Theme } from './schemas/theme';\n\n/** A theme to merge: `tokens` can be left out, as in the theme of a definition. */\nexport type PartialTheme = Partial<Theme>;\n\nfunction mergeRecords<T>(\n    first: Record<string, T> | undefined,\n    second: Record<string, T> | undefined,\n): Record<string, T> | undefined {\n    return first === undefined && second === undefined ? undefined : { ...first, ...second };\n}\n\nfunction mergeComponents(\n    first: Theme['components'],\n    second: Theme['components'],\n): Theme['components'] {\n    const components = mergeRecords(first, second);\n    if (components === undefined) {\n        return undefined;\n    }\n    return Object.fromEntries(\n        Object.keys(components).map((component) => {\n            const before = first?.[component];\n            const after = second?.[component];\n            const variants = mergeRecords(before?.variants, after?.variants);\n            return [\n                component,\n                {\n                    ...before,\n                    ...after,\n                    ...(variants !== undefined && {\n                        variants: Object.fromEntries(\n                            Object.keys(variants).map((name) => [\n                                name,\n                                { ...before?.variants?.[name], ...after?.variants?.[name] },\n                            ]),\n                        ),\n                    }),\n                },\n            ];\n        }),\n    );\n}\n\nconst DENSITIES = ['compact', 'comfortable', 'touch'] as const;\n\nfunction mergeDensities(first: Theme['densities'], second: Theme['densities']): Theme['densities'] {\n    if (first === undefined && second === undefined) {\n        return undefined;\n    }\n    const densities = { ...first, ...second };\n    DENSITIES.forEach((density) => {\n        if (first?.[density] !== undefined && second?.[density] !== undefined) {\n            densities[density] = { ...first[density], ...second[density] };\n        }\n    });\n    return densities;\n}\n\nfunction mergeFonts(first: Theme['fonts'], second: Theme['fonts']): Theme['fonts'] {\n    if (first === undefined && second === undefined) {\n        return undefined;\n    }\n    const fonts = [...(first ?? []), ...(second ?? [])];\n    return fonts.filter(\n        (font, index) =>\n            fonts.findIndex((other) => JSON.stringify(other) === JSON.stringify(font)) === index,\n    );\n}\n\n/**\n * Merges themes, in order: each one overrides the tokens, palette colors, tones and variants of\n * those before it. A token a theme sets in `tokens` but not in `dark` applies to both schemes, so it\n * also replaces the dark value of earlier themes. Variants merge token by token; tones are replaced\n * whole; densities merge token by token; fonts add up. The label is the last one set. `defineTheme()` of `@panneau/ui` merges the same way.\n */\nexport function mergeThemes(...themes: readonly PartialTheme[]): Theme {\n    return themes.reduce<Theme>(\n        (merged, theme) => {\n            const tokens = theme.tokens ?? {};\n            const dark = mergeRecords(\n                merged.dark !== undefined\n                    ? Object.fromEntries(\n                          Object.entries(merged.dark).filter(\n                              ([name]) => !Object.hasOwn(tokens, name),\n                          ),\n                      )\n                    : undefined,\n                theme.dark,\n            );\n            const result: Theme = {\n                ...merged,\n                ...theme,\n                label: theme.label ?? merged.label,\n                tokens: { ...merged.tokens, ...tokens },\n                dark: dark !== undefined && Object.keys(dark).length > 0 ? dark : undefined,\n                palette: mergeRecords(merged.palette, theme.palette),\n                tones: mergeRecords(merged.tones, theme.tones),\n                components: mergeComponents(merged.components, theme.components),\n                densities: mergeDensities(merged.densities, theme.densities),\n                fonts: mergeFonts(merged.fonts, theme.fonts),\n            };\n            return Object.fromEntries(\n                Object.entries(result).filter(([, value]) => value !== undefined),\n            ) as Theme;\n        },\n        { tokens: {} },\n    );\n}\n"],"mappings":";AAKA,SAAS,aACL,OACA,QAC6B;CAC7B,OAAO,UAAU,KAAA,KAAa,WAAW,KAAA,IAAY,KAAA,IAAY;EAAE,GAAG;EAAO,GAAG;CAAO;AAC3F;AAEA,SAAS,gBACL,OACA,QACmB;CACnB,MAAM,aAAa,aAAa,OAAO,MAAM;CAC7C,IAAI,eAAe,KAAA,GACf;CAEJ,OAAO,OAAO,YACV,OAAO,KAAK,UAAU,CAAC,CAAC,KAAK,cAAc;EACvC,MAAM,SAAS,QAAQ;EACvB,MAAM,QAAQ,SAAS;EACvB,MAAM,WAAW,aAAa,QAAQ,UAAU,OAAO,QAAQ;EAC/D,OAAO,CACH,WACA;GACI,GAAG;GACH,GAAG;GACH,GAAI,aAAa,KAAA,KAAa,EAC1B,UAAU,OAAO,YACb,OAAO,KAAK,QAAQ,CAAC,CAAC,KAAK,SAAS,CAChC,MACA;IAAE,GAAG,QAAQ,WAAW;IAAO,GAAG,OAAO,WAAW;GAAM,CAC9D,CAAC,CACL,EACJ;EACJ,CACJ;CACJ,CAAC,CACL;AACJ;AAEA,IAAM,YAAY;CAAC;CAAW;CAAe;AAAO;AAEpD,SAAS,eAAe,OAA2B,QAAgD;CAC/F,IAAI,UAAU,KAAA,KAAa,WAAW,KAAA,GAClC;CAEJ,MAAM,YAAY;EAAE,GAAG;EAAO,GAAG;CAAO;CACxC,UAAU,SAAS,YAAY;EAC3B,IAAI,QAAQ,aAAa,KAAA,KAAa,SAAS,aAAa,KAAA,GACxD,UAAU,WAAW;GAAE,GAAG,MAAM;GAAU,GAAG,OAAO;EAAS;CAErE,CAAC;CACD,OAAO;AACX;AAEA,SAAS,WAAW,OAAuB,QAAwC;CAC/E,IAAI,UAAU,KAAA,KAAa,WAAW,KAAA,GAClC;CAEJ,MAAM,QAAQ,CAAC,GAAI,SAAS,CAAC,GAAI,GAAI,UAAU,CAAC,CAAE;CAClD,OAAO,MAAM,QACR,MAAM,UACH,MAAM,WAAW,UAAU,KAAK,UAAU,KAAK,MAAM,KAAK,UAAU,IAAI,CAAC,MAAM,KACvF;AACJ;;;;;;;AAQA,SAAgB,YAAY,GAAG,QAAwC;CACnE,OAAO,OAAO,QACT,QAAQ,UAAU;EACf,MAAM,SAAS,MAAM,UAAU,CAAC;EAChC,MAAM,OAAO,aACT,OAAO,SAAS,KAAA,IACV,OAAO,YACH,OAAO,QAAQ,OAAO,IAAI,CAAC,CAAC,QACvB,CAAC,UAAU,CAAC,OAAO,OAAO,QAAQ,IAAI,CAC3C,CACJ,IACA,KAAA,GACN,MAAM,IACV;EACA,MAAM,SAAgB;GAClB,GAAG;GACH,GAAG;GACH,OAAO,MAAM,SAAS,OAAO;GAC7B,QAAQ;IAAE,GAAG,OAAO;IAAQ,GAAG;GAAO;GACtC,MAAM,SAAS,KAAA,KAAa,OAAO,KAAK,IAAI,CAAC,CAAC,SAAS,IAAI,OAAO,KAAA;GAClE,SAAS,aAAa,OAAO,SAAS,MAAM,OAAO;GACnD,OAAO,aAAa,OAAO,OAAO,MAAM,KAAK;GAC7C,YAAY,gBAAgB,OAAO,YAAY,MAAM,UAAU;GAC/D,WAAW,eAAe,OAAO,WAAW,MAAM,SAAS;GAC3D,OAAO,WAAW,OAAO,OAAO,MAAM,KAAK;EAC/C;EACA,OAAO,OAAO,YACV,OAAO,QAAQ,MAAM,CAAC,CAAC,QAAQ,GAAG,WAAW,UAAU,KAAA,CAAS,CACpE;CACJ,GACA,EAAE,QAAQ,CAAC,EAAE,CACjB;AACJ"}

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@panneau/protocol",
-    "version": "5.0.0-alpha.1",
+    "version": "5.0.0-alpha.3",
     "description": "The Panneau protocol: definition schema, HTTP API spec and conformance kit",
     "type": "module",
     "license": "MIT",
@@ -34,6 +34,7 @@
         "./definition.schema.json": "./schema/definition.schema.json",
         "./openapi.json": "./schema/openapi.json",
         "./boot.schema.json": "./schema/boot.schema.json",
+        "./theme.schema.json": "./schema/theme.schema.json",
         "./package.json": "./package.json"
     },
     "files": [

package/schema/boot.schema.json

@@ -141,18 +141,7 @@
                     "$ref": "#/$defs/Uploads"
                 },
                 "theme": {
-                    "type": "object",
-                    "properties": {
-                        "colorScheme": {
-                            "type": "string",
-                            "enum": [
-                                "light",
-                                "dark",
-                                "auto"
-                            ]
-                        }
-                    },
-                    "additionalProperties": {}
+                    "$ref": "#/$defs/DefinitionTheme"
                 },
                 "user": {
                     "anyOf": [
@@ -897,6 +886,9 @@
                 "queued": {
                     "type": "boolean"
                 },
+                "dryRun": {
+                    "type": "boolean"
+                },
                 "url": {
                     "type": "string"
                 },
@@ -1196,6 +1188,260 @@
             ],
             "additionalProperties": {}
         },
+        "DefinitionTheme": {
+            "type": "object",
+            "properties": {
+                "label": {
+                    "type": "string"
+                },
+                "tokens": {
+                    "$ref": "#/$defs/ThemeTokens"
+                },
+                "dark": {
+                    "$ref": "#/$defs/ThemeTokens"
+                },
+                "palette": {
+                    "type": "object",
+                    "propertyNames": {
+                        "type": "string",
+                        "pattern": "^[a-z0-9-]+$"
+                    },
+                    "additionalProperties": {
+                        "type": "string",
+                        "pattern": "^[^{};<]*$"
+                    }
+                },
+                "tones": {
+                    "type": "object",
+                    "propertyNames": {
+                        "type": "string",
+                        "pattern": "^[a-z0-9-]+$"
+                    },
+                    "additionalProperties": {
+                        "$ref": "#/$defs/ToneInput"
+                    }
+                },
+                "components": {
+                    "type": "object",
+                    "propertyNames": {
+                        "type": "string",
+                        "pattern": "^[a-z0-9-]+$"
+                    },
+                    "additionalProperties": {
+                        "type": "object",
+                        "properties": {
+                            "variants": {
+                                "type": "object",
+                                "propertyNames": {
+                                    "type": "string",
+                                    "pattern": "^[a-z0-9-]+$"
+                                },
+                                "additionalProperties": {
+                                    "$ref": "#/$defs/ThemeTokens"
+                                }
+                            }
+                        },
+                        "additionalProperties": {}
+                    }
+                },
+                "densities": {
+                    "type": "object",
+                    "properties": {
+                        "compact": {
+                            "$ref": "#/$defs/ThemeTokens"
+                        },
+                        "comfortable": {
+                            "$ref": "#/$defs/ThemeTokens"
+                        },
+                        "touch": {
+                            "$ref": "#/$defs/ThemeTokens"
+                        }
+                    },
+                    "additionalProperties": {}
+                },
+                "fonts": {
+                    "type": "array",
+                    "items": {
+                        "$ref": "#/$defs/ThemeFont"
+                    }
+                },
+                "colorScheme": {
+                    "type": "string",
+                    "enum": [
+                        "light",
+                        "dark",
+                        "auto"
+                    ]
+                },
+                "density": {
+                    "type": "string",
+                    "enum": [
+                        "compact",
+                        "comfortable",
+                        "touch",
+                        "auto"
+                    ]
+                },
+                "extends": {
+                    "anyOf": [
+                        {
+                            "type": "string"
+                        },
+                        {
+                            "type": "array",
+                            "items": {
+                                "type": "string"
+                            }
+                        }
+                    ]
+                }
+            },
+            "additionalProperties": {}
+        },
+        "ThemeTokens": {
+            "type": "object",
+            "propertyNames": {
+                "type": "string",
+                "pattern": "^[a-zA-Z0-9_-]+$"
+            },
+            "additionalProperties": {
+                "type": "string",
+                "pattern": "^[^{};<]*$"
+            }
+        },
+        "ToneInput": {
+            "anyOf": [
+                {
+                    "type": "string"
+                },
+                {
+                    "type": "object",
+                    "properties": {
+                        "text": {
+                            "type": "string"
+                        },
+                        "subtle": {
+                            "type": "string"
+                        },
+                        "border": {
+                            "type": "string"
+                        },
+                        "outline": {
+                            "type": "string"
+                        },
+                        "solid": {
+                            "type": "string"
+                        },
+                        "solidHover": {
+                            "type": "string"
+                        },
+                        "solidText": {
+                            "type": "string"
+                        },
+                        "dark": {
+                            "type": "object",
+                            "properties": {
+                                "text": {
+                                    "type": "string"
+                                },
+                                "subtle": {
+                                    "type": "string"
+                                },
+                                "border": {
+                                    "type": "string"
+                                },
+                                "outline": {
+                                    "type": "string"
+                                },
+                                "solid": {
+                                    "type": "string"
+                                },
+                                "solidHover": {
+                                    "type": "string"
+                                },
+                                "solidText": {
+                                    "type": "string"
+                                }
+                            },
+                            "additionalProperties": {}
+                        }
+                    },
+                    "required": [
+                        "text",
+                        "subtle",
+                        "border",
+                        "outline",
+                        "solid",
+                        "solidHover",
+                        "solidText"
+                    ],
+                    "additionalProperties": {}
+                }
+            ]
+        },
+        "ThemeFont": {
+            "anyOf": [
+                {
+                    "$ref": "#/$defs/ThemeFontFace"
+                },
+                {
+                    "$ref": "#/$defs/ThemeFontStylesheet"
+                }
+            ]
+        },
+        "ThemeFontFace": {
+            "type": "object",
+            "properties": {
+                "family": {
+                    "type": "string",
+                    "pattern": "^[^{}<;\"\\\\]+$"
+                },
+                "src": {
+                    "type": "string",
+                    "pattern": "^[^{}<]+$"
+                },
+                "weight": {
+                    "type": "string",
+                    "pattern": "^[^{}<;]*$"
+                },
+                "style": {
+                    "type": "string",
+                    "pattern": "^[^{}<;]*$"
+                },
+                "display": {
+                    "type": "string",
+                    "enum": [
+                        "auto",
+                        "block",
+                        "swap",
+                        "fallback",
+                        "optional"
+                    ]
+                },
+                "unicodeRange": {
+                    "type": "string",
+                    "pattern": "^[^{}<;]*$"
+                }
+            },
+            "required": [
+                "family",
+                "src"
+            ],
+            "additionalProperties": {}
+        },
+        "ThemeFontStylesheet": {
+            "type": "object",
+            "properties": {
+                "stylesheet": {
+                    "type": "string",
+                    "minLength": 1
+                }
+            },
+            "required": [
+                "stylesheet"
+            ],
+            "additionalProperties": {}
+        },
         "User": {
             "type": "object",
             "properties": {