@yahoo/uds-create-config 2.44.0 → 3.0.0

package/dist/configs/system.js

@@ -0,0 +1,74 @@
+import { Composite } from "../entities/system/Composite.js";
+import { Modifier } from "../entities/system/Modifier.js";
+import { Settings } from "../entities/system/Settings.js";
+import { StyleProperty } from "../entities/system/StyleProperty.js";
+import { Package } from "../entities/system/Package.js";
+import { File } from "../entities/system/File.js";
+import { Component } from "../entities/system/Component.js";
+import { Device } from "../entities/system/Device.js";
+import { Icon } from "../entities/system/Icon.js";
+import { Operation } from "../entities/system/Operation.js";
+import { Tool } from "../entities/system/Tool.js";
+import { registerSchemaMigrations, registeredSchemaMigrations } from "../framework/schema-version.js";
+import { defineConfig } from "../framework/defineConfig.js";
+import { CanvasRole } from "../entities/system/CanvasRole.js";
+import { Font } from "../entities/system/Font.js";
+import { GlobalStyle } from "../entities/system/GlobalStyle.js";
+import { Guidance } from "../entities/system/Guidance.js";
+import { GuidanceStyle } from "../entities/system/GuidanceStyle.js";
+import { WEB_CONFIG_NAME } from "./platform.js";
+import { LinkedSystem } from "../entities/system/LinkedSystem.js";
+import { Motion } from "../entities/system/Motion.js";
+import { Token } from "../entities/system/Token.js";
+import { loadV1Artifact } from "../migrations/2.0.0/v1-artifact.js";
+import { settingsAsKindMigration } from "../migrations/20260908171448_settings_as_kind.js";
+import { visibleStatePointerMigration } from "../migrations/20260908194245_visible_state_pointer.js";
+import { iconKnockoutVariantsMigration } from "../migrations/20260909183001_icon_knockout_variants.js";
+import { linkedSystemLinkOpsMigration } from "../migrations/20260910212453_linked_system_link_ops.js";
+//#region src/configs/system.ts
+/**
+* `System` — the design-system config TYPE. Declares the exact kinds a design system owns (tokens,
+* components, …) plus its derived agent-tool catalog (`operation`/`tool`). `new System()` seeds a
+* config with those kinds; `System.fromJSON(json)` rehydrates one — it declares no borrowed KINDS, so nothing is required, though a
+* caller holding a linked system's config attaches it here (`{ sources: { linkedSystems: { ds } } }`). This is the
+* config every CLI / pipeline / studio consumer reads. Studio's design-file config type lives in
+* studio (`apps/studio/src/configs/design-file.ts`) — a studio-only document type.
+*/
+const System = defineConfig({
+	name: WEB_CONFIG_NAME,
+	description: "A design system: the values, primitives and compositions an app is built from. A ref is written `{ \"__ref\": \"<kind>:<path>\" }`, so a token is `{ \"__ref\": \"token:<group>/<name>\" }` and a token group is `{ \"__ref\": \"token:<group>\" }`. Build it in this order. Tokens first, in groups by purpose (colors, spacing, radii, type sizes), since everything else names them. Then style properties, each with `values` holding one ref to the token group whose members it accepts (`{ \"__ref\": \"token:color\" }`), so a prop takes token names rather than raw CSS; add a string keyword only for a value no token holds. A style rule's bag holds a prop's values (`\"padding\": \"4\"`, `\"bg\": \"brand\"`), never raw CSS. Then a few primitive components, one layer each, whose props are style properties (a box for layout and surface, a text for type, a pressable for interaction). Then every other component composed from those primitives: its layers name a primitive or an element, its anatomy places them (a node renders a layer, a tag or `Slot` where a slot prop's content lands; `children` is the edge list; `visible` is `{ \"$state\": \"<prop>\" }`; a prop shown in a nested layer is a `forward` route, and `$state` never sits in a node's props), and its style rules set style-property values per layer, keyed by prop values when a variant changes them. Modes (a dark mode is `{ type: \"selector\", value: \".dark\" }`) change token values through a token's `overrides`, so a component never restyles for a mode; modifiers (hover, focus, disabled) name a state, and a style rule applies under one as a `_hover` block inside a layer bag. Composites bundle style values that recur. Last, register canvas roles: the canvas draws with them, one entity per tool (`frame` for the layout primitive, `text` for the text primitive, `image`) whose entries name the components that tool inserts, and a tool whose role is unregistered is disabled. Give each component previewProps so it shows content, and never write a CSS property name where a style-property name belongs.",
+	entities: {
+		settings: Settings,
+		tokens: Token,
+		components: Component,
+		modifiers: Modifier,
+		styleProps: StyleProperty,
+		composites: Composite,
+		motion: Motion,
+		fonts: Font,
+		icons: Icon,
+		packages: Package,
+		files: File,
+		guidance: Guidance,
+		guidanceStyles: GuidanceStyle,
+		canvasRoles: CanvasRole,
+		globalStyles: GlobalStyle,
+		devices: Device,
+		linkedSystems: LinkedSystem
+	},
+	sources: { linkedSystems: () => System },
+	derivedEntities: {
+		operations: Operation,
+		tools: Tool
+	}
+});
+if (!registeredSchemaMigrations().has(1)) registerSchemaMigrations({
+	version: 1,
+	up: (json) => loadV1Artifact(json).toJSON()
+});
+if (!registeredSchemaMigrations().has(20260908171448)) registerSchemaMigrations(settingsAsKindMigration);
+if (!registeredSchemaMigrations().has(20260908194245)) registerSchemaMigrations(visibleStatePointerMigration);
+if (!registeredSchemaMigrations().has(20260909183001)) registerSchemaMigrations(iconKnockoutVariantsMigration);
+if (!registeredSchemaMigrations().has(20260910212453)) registerSchemaMigrations(linkedSystemLinkOpsMigration);
+//#endregion
+export { System };

package/dist/css/properties.generated.d.ts

@@ -0,0 +1,14 @@
+//#region src/css/properties.generated.d.ts
+/**
+ * GENERATED — do not edit. `bun run gen:css` regenerates this from mdn-data@2.27.1: every
+ * non-vendor CSS property, the keywords its grammar accepts and the value classes it takes.
+ * `css/values.ts` reads it to tell a CSS property from an attribute and to judge a literal value.
+ */
+interface CssPropertyEntry {
+  /** The keywords the grammar names, sorted. The CSS-wide keywords are not among them. */
+  readonly keywords: readonly string[];
+  /** The leaf value types the grammar reaches (`length-percentage`, `color`, `custom-ident`). */
+  readonly classes: readonly string[];
+}
+//#endregion
+export { CssPropertyEntry };