synthesisui 0.16.80 → 0.16.82

package/dist/skill-import.js

@@ -467,6 +467,13 @@ here", which is exactly what the file says.
 Good \`expects\`: \`"the cells"\`, \`"one row per item"\`, \`"the form"\`, \`"the page body"\`. Leave it
 out rather than writing \`"children"\` - the field is for what a person would call it.
 
+**A part can carry its own variants and states**, not only a flat class string. Send
+\`classes\` for the resting look and let the prefixes travel inside it - \`hover:\`,
+\`focus-visible:\`, \`disabled:\`, \`group-hover:\`, \`md:\`, \`data-[state=open]:\` are all read
+and land where they belong. \`group-hover:\` in particular now has somewhere to go: it
+means "when the component around me is hovered", which is what a real table row is built
+on and what nothing could express before.
+
 **\`name\` is the part name**, and it is what carries the styles - flat, lowercase, kebab. Never
 nested: \`"actions.generate"\` compiles to two CSS classes and is invalid, so name it
 \`"generate-action"\`. Name what it IS - \`label\`, \`value\`, \`delta\`, \`cover\`, \`toolbar\` - because the
@@ -530,6 +537,72 @@ extensions are configured at construction, not toggled later
 of their manifest and attaches it (\`"^2.1.0 in packages/ui"\`), so the rule does not go stale the
 day they upgrade and the information is not lost either.
 
+### The floor: what a preview needs before it can draw anything
+
+The owner asked this directly - "to render the button, what do I need to have?" - and the
+honest answer per kind is short. **Work the list for the component's kind and say which
+ones their code answers.** A reader holding this knows that a button read with no hover
+means the hover has not been found yet, and goes back for it.
+
+\`\`\`
+action    the resting fill and the text colour on it · padding and radius ·
+          text size and weight · hover, focus-visible AND disabled - three looks,
+          not one · gap and alignment if it can carry an icon
+field     the fill of the typing area and the text colour in it · the edge at rest
+          and the edge when focused · padding and radius · the placeholder colour
+          (a different decision) · the invalid look if their code has one
+control   the off look and the on look, which IS the component · the size · the
+          focus ring, since a control is reached by keyboard · the disabled look
+surface   the fill, and the edge or the elevation that separates it from the page ·
+          radius and inner padding · the gap between what it holds · whether it
+          changes at a breakpoint
+pill      the fill and text colour, per status if it has statuses · radius and
+          horizontal padding · the text size
+indicator the colour, or the two if it has a track and a fill · the size or ratio ·
+          WHAT DRIVES IT - which prop moves the number
+text      the colour · the size and line height, or a note that both are inherited ·
+          the weight and family if they differ from body
+\`\`\`
+
+**A component genuinely has none of something, and saying so is a real answer.** This is a
+list to work through, not a gate: nothing is blocked for failing it, and inventing a
+background to satisfy it would be the exact opposite of the point.
+
+There is one hard line under all of it: a recipe that declares NO colour, NO edge and NO
+size cannot be told apart from the page. The platform says so rather than printing a
+score, and it follows the root first - a component whose surface belongs to the \`Card\` it
+returns is complete.
+
+### Media is not a style question
+
+An \`image\` node draws a grey region and carries nothing about how to use it, so an agent
+composing with it invents the answer. Send these as \`rules\` on that component:
+
+\`\`\`
+a ratio or an explicit size    a region with neither collapses before the image loads,
+                              and the page jumps when it arrives
+an object-fit                 cover crops and contain letterboxes; which one is right
+                              is about the content, not a default
+a corner radius               an image inside a rounded surface has to say whether it
+                              follows the curve
+what shows while it loads     a skeleton, a blur, or the surface colour
+what shows when it is missing a missing asset must never look broken
+\`\`\`
+
+### What the CLI now reads for you, so do not spend a turn on it
+
+Four things are read deterministically from the source. Reporting them back as if you
+found them wastes a turn and risks contradicting the measurement:
+
+- **variant and state styles** out of \`cva\`, \`tv\` and \`cond === "x" && "classes"\` -
+  including a hover PER variant, compound variants, and \`[var(--their-token)]\`
+- **whether a component forwards the rest of its props**, and which it names
+- **which components appear inside which** at their call sites, as pairs
+- **the folder architecture**, and it will ask you which one has priority
+
+What is still yours: the anatomy tree, the part names, the frontiers, the roles, the
+concept, and the rules that are not about a class name.
+
 ### How much to send
 
 Send an anatomy for **every component with visible structure**, which is nearly all of them. A
@@ -559,7 +632,7 @@ spec view has no nesting to draw.
 
 ### 3. Walk them through the decisions, one at a time
 
-Five decisions are theirs. **Ask them as separate questions with selectable options** - use your
+Six decisions are theirs. **Ask them as separate questions with selectable options** - use your
 question tool, one call per decision, so they pick instead of reading a wall and composing a
 reply. A single block containing everything is a report, and a report gets read, not answered.
 
@@ -673,6 +746,26 @@ Two things to be straight about, because both are true and neither is obvious:
   \`badge\` needs those to exist. Choosing *mine alone* keeps the layouts whose recipes they
   happen to have and drops the rest - a layout pointing at a recipe nobody has renders as holes.
 
+**3e-ter. Which architecture has priority** - ask only when the CLI reported more than
+one, which it does under "How this project is organised".
+
+A project having two shapes is not a project with a mistake: a library organised
+atomically inside a monorepo whose apps are organised by feature is two true answers.
+Say that before you ask, or the question reads as an accusation.
+
+\`\`\`
+Two shapes, and neither is wrong:
+
+  atomic under packages/ui (recommended)   114 files - atoms/molecules/organisms,
+                                           and this is where the system comes from
+  feature under apps/web-dashboard         900 files - features/, where the app
+                                           consumes it
+\`\`\`
+
+The one they pick becomes a rule that reaches \`CLAUDE.md\`, so **every prompt after this
+knows where a new component goes** - not what the folders are called, but which rung or
+which feature a new file belongs to. Recommend the one the system came from.
+
 **3f. Fonts** - do not ask at all. Report and move on:
 
 \`\`\`

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "synthesisui",
-  "version": "0.16.80",
+  "version": "0.16.82",
   "description": "Bring SynthesisUI design systems into any project - tokens, typed components, whole pages and an agent-ready CLAUDE.md manifest.",
   "type": "module",
   "bin": {