12. Styles, variables and libraries
Esta página está em inglês; a tradução está a caminho.
| ID | Requirement | P | Type | Ver. | M |
|---|---|---|---|---|---|
| VAR-1 | Styles shall be defined and applied. Colour (paint lists), text, effect and layout grid styles with names in groups (Brand/Primary), descriptions, apply/detach, edit in place; a style change updates every user. |
Must | functional | test | 0.4 |
| VAR-2 | Variables shall be organised in collections with modes. Types colour, number, string, boolean; each collection has modes (e.g. Light/Dark, Compact/Comfortable, brands); a value per mode; groups by / in the name; descriptions. |
Must | functional | test | 0.4 |
| VAR-3 | Variables shall alias other variables. A semantic variable (color/bg/surface) refers to a primitive (palette/gray/50); cycles are refused; the panel shows the resolved value per mode. |
Must | functional | test | 0.4 |
| VAR-4 | Properties shall bind to variables. Fills, strokes, opacity, corner radii, width/height/min/max, gap, padding, stroke weight, visibility, text content, font family/size/weight/line height/letter spacing, effect values, component property values. | Must | functional | test | 0.4 |
| VAR-5 | Variables shall have scopes and code syntax. Scopes limit where a variable is offered (e.g. only fills, only gap); code syntax per platform (var(--color-bg), theme.colors.bg) is used by inspection and export. |
Should | functional | test | 0.4 |
| VAR-6 | Frames and pages shall choose modes. Explicit mode per collection on any frame, inherited by its children; preview modes on the canvas and in ud render --mode. |
Must | functional | test | 0.4 |
| VAR-7 | A file shall publish a library to the workspace. Components, styles and variables of a .design file marked as a library are available to other .design files of the workspace (and to files referencing a path or a git-tracked package). Instances keep a reference to the library file and node. |
Must | functional | test | 0.4 |
| VAR-8 | Library updates shall be reviewed before they apply. When a library changes, consuming files show “Updates available” with a visual before/after per component and style; accept all or some; one undo step. Also ud library updates and ud library accept. |
Must | functional | test | 0.4 |
| VAR-9 | Variables shall be importable and exportable as tokens. Must: W3C DTCG JSON and Style Dictionary import and export; export as CSS custom properties, SCSS and Tailwind theme. Should: Tokens Studio JSON, and native formats (Swift, Kotlin/Compose, Flutter). Export is a command and can run on save into a configured path. | Must | interface | test | 0.6 |
| VAR-10 | Expressions in number and string variables could be supported. Arithmetic and string concatenation referencing other variables (spacing/base * 2). |
Could | functional | test | backlog |