@csszyx/mcp-server 0.16.0 → 0.17.1

package/llms-full.txt

@@ -250,6 +250,11 @@ canonical key or replacement shape. A truly unknown key is different: it warns
 but still emits a kebab-case candidate so an intentional Tailwind `@utility`
 can serve it.
 
+Diagnostics retain the statically resolved objects inside conditional branches,
+ternary spreads and sz arrays. Shared source properties are reported once, without
+changing emitted classes. Unresolved spreads still have incomplete key/value
+checking: a fallback warning does not mean their readable properties are clean.
+
 ## Type safety — unknown keys are TypeScript errors
 
 The `sz` prop type is **closed**: a key that is not a known sz prop or variant is a
@@ -688,6 +693,7 @@ Strategy for static analysis vs runtime generation.
 | **Variable reference**        | ❌ Not applicable        | ✅ **Build time**        | `sz={myVar}` — pass variable directly when no override needed. Compiler resolves the binding to its object literal initializer (incl. `as const`, `satisfies`, explicit type annotation).                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                |
 | **Object Spread**             | ❌ Fails spread          | ✅ **Static Analysis**   | `sz={{ ...baseProps, key: val }}` — use spread only when overriding/adding; last key wins. Resolved at build time for local literals. Multiple/nested spreads supported. Imported vars fall back to `_sz()` — no crash. When runtime `sz` emits CSS variables beside one direct object-literal JSX prop spread, or one conditional with object-literal branches, generated variables merge into every branch's `style`; unresolved/multiple JSX spreads retain a collision diagnostic.                                                                                                                                                                                                                                                                                                   |
 | **Array variable items**      | ❌ Not applicable        | ✅ **Build time**        | `sz={[varA, varB]}` and `sz={[varA, cond && varB]}` — LATER WINS composition. All-static-object arrays deep-merge at build (later leaf wins per key path, sibling keys survive) into one className; arrays with strings/conditions/dynamic elements emit `_szcn(...)` — a compiler-injected helper (`_` = generated code, never hand-authored; the unmemoized twin of `szcn`) applying the same later-wins rule per property group at runtime. Finite ternary elements and finite conditional object properties compile to conditional class strings; only truly dynamic elements (e.g. a forwarded `szsc` slot) pass through `_szPart` (string passthrough / sz-object compile).                                                                                                        |
+| **Two `sz` attributes**       | ❌ Not applicable        | ✅ **Build time**        | `<div sz={a} sz={b} />` is read as `sz={[a, b]}` — later wins per property, one className, an authored `className` first. Every shape folds: two arrays join their elements; a ternary or a runtime value becomes one element of the composition. JSX compilers would pass the duplicate through as a duplicate object key, where the last silently replaces the first. Reported as a nudge — write the array so the order is on the page.                                                                                                                                                                                                                                                                                                                                               |
 | **Ternary variable branches** | ❌ Not applicable        | ✅ **Build time**        | `sz={cond ? varA : varB}` — both branches compiled to static strings when variables are local literals. A branch spelled `undefined`, `null`, `false`, or `{}` is the EMPTY style and compiles to no classes, so `sz={cond ? varA : undefined}` folds just like `: {}`. A chain — `a ? x : b ? y : z` — compiles too, up to 8 tests; the emitted expression keeps the same nesting, so each test is only reached when every test before it was falsy. Past 8 the attribute keeps the runtime path.                                                                                                                                                                                                                                                                                       |
 | **Guarded style (`&&`)**      | ❌ Not applicable        | ✅ **Build time**        | `sz={cond && varA}` compiles to the ternary it already is, because a falsy left operand is the empty style. `sz={a \|\| varA}` does NOT compile: `\|\|` yields its LEFT operand when the test passes, and that value can be a style the fold would drop.                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                 |
 | **Chained variables**         | ❌ Not applicable        | ✅ **Build time**        | `const b = { ...a, key: val }; <div sz={b} />` — compiler resolves the chain recursively.                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                |
@@ -2906,9 +2912,9 @@ Controlling inline-size (logical equivalent of width). Added in Tailwind v4.2.
 
 Component-like utility for fixing an element's width to the current breakpoint.
 
-| Concept    | CSS Rule                                        | Tailwind v4 Class | `sz` Prop (Object Syntax) | Note                                                    |
-| :--------- | :---------------------------------------------- | :---------------- | :------------------------ | :------------------------------------------------------ |
-| **Enable** | `width: 100%; max-width: 100% (at breakpoints)` | `container`       | `{ container: true }`     | **Top-level prop**. Better DX than `maxW: 'container'`. |
+| Concept    | CSS Rule                                                    | Tailwind v4 Class | `sz` Prop (Object Syntax) | Note                                                                                                                                                                                                           |
+| :--------- | :---------------------------------------------------------- | :---------------- | :------------------------ | :------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
+| **Enable** | `width: 100%; max-width: <breakpoint> (at each breakpoint)` | `container`       | `{ container: true }`     | **Top-level prop**. `maxW` does not accept `container`: it resolves against the `--container-*` scale, where no `container` key exists, so `{ maxW: 'container' }` emits `max-w-container` and styles nothing. |
 
 ## Typography Plugin (Prose)
 
@@ -3905,6 +3911,27 @@ import { __szColorVar } from "csszyx/lite";
 
 ## Nested Element Routing — splitBox + class toolkit
 
+For className-only consumers, import `classify`, `has`, `pick`, `omit` and
+`splitBox` from `@csszyx/runtime/split`. The entry excludes sz-object adapters;
+ESM can tree-shake the main entry too, while CommonJS benefits from the narrower
+surface. The compiler dependency remains.
+
+The supported vocabulary is atomic utilities. A multi-property custom
+`@utility card` is not classified: `pick` excludes it, `omit` retains it, and
+`splitBox` leaves it on the fallback node with a development warning unless
+explicitly placed. Use `splitBox('card p-4', { inner: ['card'] })` to place the
+whole class; no CSS declarations are split. Literal placement matches a whole
+base name, so `card` does not match `card-lg`. Use authored names when mangling.
+`{ outer: ['hidden'] }` matches every variant of `hidden`; naming `md:hidden`
+in a class placement list matches nothing and warns. Query helpers still
+require recognised selectors.
+
+`scope` is the category for `group` and `peer`, including `group/item`. Both
+route outer: `group` supplies an ancestor and `peer` keeps its sibling position.
+The expanded vocabulary also recognises `placeholder-*` as inner and
+`start-*`/`end-*` as outer. These classes previously used the fallback, so
+review old routing assumptions and category-query expectations when upgrading.
+
 When a caller passes one flat `className` to a component that renders nested elements, `splitBox` partitions it at the CSS box-model border line so each element gets the classes that act on it. Pure string functions, framework-agnostic. The class-token → box-role map is generated from the compiler's property tables (never drifts).
 
 ```tsx
@@ -3918,31 +3945,47 @@ import {
   stripSzProps,
 } from "@csszyx/runtime";
 
-// Partition: outer = border-outward (margin/position/border/ring/sizing/bg/shadow/transform/visibility),
-//            inner = border-inward (padding/overflow/display/flex/grid/gap/text/interaction)
+// Partition: outer = border-outward (margin/position/border/ring/sizing/bg/shadow/transform/
+//            visibility/overflow-hidden+clip/cursor/select/pointer-events/scroll-m/snap-start/align),
+//            inner = border-inward (padding/overflow-auto+scroll/display/flex/grid/gap/text/divide/
+//            perspective/transform-3d/resize/appearance)
+// Both: transition/duration/ease/delay are declared on BOTH nodes (a transition is inert until a
+//       property changes, and the state that changes it can sit on either side).
 const { outer, inner } = splitBox("m-4 px-2 md:flex");
 // outer: "m-4"   inner: "px-2 md:flex"
 
+// overflow routes by VALUE: hidden/clip clip the frame, auto/scroll scroll the content
+splitBox("overflow-hidden overflow-y-auto p-4");
+// outer: "overflow-hidden"   inner: "overflow-y-auto p-4"
+
 // Override any default per call (BoxSelector = box-role | category | class-prefix | { category: value })
-splitBox("overflow-hidden p-4", { outer: ["overflow"] });
-// outer: "overflow-hidden"   inner: "p-4"
+splitBox("overflow-hidden p-4", { inner: ["overflow"] });
+// outer: ""   inner: "overflow-hidden p-4"
 
 // Toolkit: csszyx owns the truth (box-role/category), your project owns the rule
-classify("inset-ring-2"); // { role: 'inner', category: 'ring' }
+classify("inset-ring-2"); // { role: 'outer', category: 'ring' }
 has("p-2 overflow-y-auto", "overflow"); // true
 pick("m-4 text-sm", "text"); // "text-sm"
 omit("p-2 overflow-y-auto flex", "overflow"); // "p-2 flex"
 
-// A scroller scrolls only when the outer frame clips (project-owned dependency rule)
-const dep = has(outer, { overflow: "hidden" }) ? "overflow-y-auto h-full" : "";
+// A scroll frame: the clip and the height land outer on their own; the plumbing that lets a
+// child inherit the frame's height is the component's own (min-h-0 defeats flex's min-height:auto)
+// frame: `${outer} flex flex-col min-h-0 overflow-hidden`
+// content: `${inner} flex-1 min-h-0 overflow-y-auto`
 
 // sz-OBJECT routing: splitBoxSz partitions an sz OBJECT (not a className) into
 // { outer, inner } sz objects — keeps a szv-based component sz-native and routes
 // each key to the same side its class would (splitBoxSz(x) ≡ splitBox(compile(x))).
 splitBoxSz({ m: 4, px: 2 }); // { outer: { m: 4 }, inner: { px: 2 } }
 splitBoxSz({ gap: 2, hover: { px: 1 }, md: { m: 4 } }); // variants route by inner prop; split when they disagree
-splitBoxSz({ grow: 2, self: "center" }, { outer: ["grow", "self"] }); // force flex-item utils to the frame
-// classifySzKey(key) / hasSz / pickSz / omitSz — the sz-object toolkit twins
+splitBoxSz({ grow: 2, self: "center" }, { inner: ["grow", "self"] }); // item utils (grow/order/self/col-span) are OUTER by default; this forces them back to the content
+// Placement lists can pin a whole literal variant key, preserving its contents.
+splitBoxSz({ hover: { p: 2, m: 4 } }, { outer: ["hover"] });
+// { outer: { hover: { p: 2, m: 4 } }, inner: {} }
+// Literal keys such as "[&:hover]" work too; inner wins if both lists name it.
+splitBoxSz({ overflow: "hidden", p: 4 }); // { outer: { overflow: 'hidden' }, inner: { p: 4 } }
+// classifySzKey(key, value?) / hasSz / pickSz / omitSz — the sz-object toolkit twins
+// (pass the value for a key whose side depends on it: classifySzKey('overflow', 'hidden') → outer)
 
 // stripSzProps: drop sz before forwarding ...rest to the DOM (guards uncompiled files
 // whose raw sz would leak as sz="[object Object]"; dev-warns once on a raw-object sz)

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@csszyx/mcp-server",
-  "version": "0.16.0",
+  "version": "0.17.1",
   "description": "Model Context Protocol (MCP) server for csszyx — enables AI agents to understand and generate sz props",
   "license": "MIT",
   "type": "module",
@@ -28,15 +28,15 @@
     "node": "^22.18.0 || >=24.11.0"
   },
   "dependencies": {
-    "@csszyx/cli": "0.16.0",
-    "@csszyx/compiler": "0.16.0",
-    "@csszyx/unplugin": "0.16.0",
+    "@csszyx/cli": "0.17.1",
+    "@csszyx/compiler": "0.17.1",
+    "@csszyx/unplugin": "0.17.1",
     "@modelcontextprotocol/sdk": "^1.30.0",
-    "zod": "^4.4.3"
+    "zod": "^4.5.4"
   },
   "devDependencies": {
     "@types/node": "^22.20.1",
-    "tsx": "^4.23.12",
+    "tsx": "^4.23.13",
     "typescript": "^6.0.3",
     "unbuild": "^3.6.1",
     "vitest": "^4.1.11"