|
| 1 | +--- |
| 2 | +name: update-tokens |
| 3 | +description: Edit Mistica token JSON files when the user requests new tokens, color, spacing, text, radius, changes in skin, or new brand tokens or skins. |
| 4 | +--- |
| 5 | + |
| 6 | +# Token Editor |
| 7 | + |
| 8 | +This skill is used to modify Mistica design tokens JSON files in a controlled and consistent way. |
| 9 | + |
| 10 | +--- |
| 11 | + |
| 12 | +## When to use |
| 13 | + |
| 14 | +Use this skill **only** when the user explicitly requests: |
| 15 | + |
| 16 | +- Adding a new token |
| 17 | +- Editing an existing token |
| 18 | +- Creating a new brand / skin |
| 19 | +- Modifying token values or descriptions |
| 20 | + |
| 21 | +Do not use this skill for: |
| 22 | + |
| 23 | +- UI implementation |
| 24 | +- Token usage in application code |
| 25 | +- Guessing, proposing, or inventing new tokens without explicit request |
| 26 | + |
| 27 | +### Execution flow |
| 28 | + |
| 29 | +When this skill is invoked, follow this order strictly: |
| 30 | + |
| 31 | +1. Identify the exact user request (token name, type, brand) |
| 32 | +2. Locate the affected files: |
| 33 | + - Brand file(s) |
| 34 | + - Schema file (if adding or removing tokens) |
| 35 | + - contrastPairs.js (if color tokens affect contrast) |
| 36 | +3. Apply the minimal required change |
| 37 | +4. Validate structure consistency across brands |
| 38 | +5. Update schema file |
| 39 | +6. Update linter if impacted |
| 40 | +7. Summarize the changes made |
| 41 | + |
| 42 | +--- |
| 43 | + |
| 44 | +## Token file structure |
| 45 | + |
| 46 | +- Tokens live in the `tokens/` directory |
| 47 | +- Brand files are named: `<brand>.json` |
| 48 | +- Schema file: `tokens/schema/skin-schema.json` |
| 49 | +- Linter contrast pairs live in `tokens/linter/contrastPairs.js` |
| 50 | + |
| 51 | +Each brand file must define **the same token structure**: |
| 52 | + |
| 53 | +- `light` |
| 54 | +- `dark` |
| 55 | +- `radius` |
| 56 | +- `text` |
| 57 | +- `spacing` |
| 58 | +- `themeVariant` |
| 59 | +- `componentProperties` |
| 60 | + |
| 61 | +May differ between brands: |
| 62 | + |
| 63 | +- Token values |
| 64 | +- `global.palette` definitions |
| 65 | + |
| 66 | +Token **keys and structure must always match across brands**. |
| 67 | + |
| 68 | +--- |
| 69 | + |
| 70 | +## Editing rules (mandatory) |
| 71 | + |
| 72 | +### General |
| 73 | + |
| 74 | +- Never invent tokens not requested by the user |
| 75 | +- Do not create new token types unless explicitly specified by the user |
| 76 | +- Never remove existing tokens unless explicitly requested |
| 77 | +- Keep JSON formatting consistent with existing files |
| 78 | +- Apply **minimal diffs**: change only what is required |
| 79 | +- Do not reorder unrelated tokens |
| 80 | +- All brand failes should follow the structure enforced in `tokens/schema/skin-schema.json` |
| 81 | + |
| 82 | +--- |
| 83 | + |
| 84 | +## Adding or editing tokens |
| 85 | + |
| 86 | +### Color tokens |
| 87 | + |
| 88 | +- Must exist in **both** `light` and `dark` |
| 89 | +- Values must reference `global.palette`, if the have alpha `rgba({global.palette}, alphaValue)` |
| 90 | +- Token `description` must exactly match the palette reference |
| 91 | +- Do not use raw hex, rgb, or rgba values |
| 92 | +- Insert new tokens after the closest existing token name (alphabetical proximity) |
| 93 | + |
| 94 | +--- |
| 95 | + |
| 96 | +### Text tokens |
| 97 | + |
| 98 | +- A new `text.size` token **must** also define `text.lineHeight` |
| 99 | + |
| 100 | +## Schema updates |
| 101 | + |
| 102 | +- The schema file **must** be updated when new tokens are added |
| 103 | +- Schema structure must exactly match the brand token structure |
| 104 | +- New `global.palette` tokens must be added per brand and included under the corresponding pattern in `definitions/constantProperties/patternProperties` |
| 105 | +- Do not modify schema entries unrelated to the change |
| 106 | + |
| 107 | +--- |
| 108 | + |
| 109 | +## Linter contrastPairs updates |
| 110 | + |
| 111 | +- Update existent or create a new contrast pair if needed |
| 112 | + |
| 113 | +Do not update contrast pairs for: |
| 114 | + |
| 115 | +- Media-specific tokens |
| 116 | +- Tokens using alpha |
0 commit comments