zeus-css 1.0.12 → 1.0.13

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "zeus-css",
-  "version": "1.0.12",
+  "version": "1.0.13",
   "description": "⚡ A Premium, Zero-Emission, Fluid-Scaling CSS Framework based on Sass SCSS Engine",
   "author": "Stavros Lazaris",
   "license": "MIT",
@@ -17,12 +17,9 @@
   "bin": {
     "zeus-css": "bin/init.js"
   },
-  "scripts": {
-    "postinstall": "node ./bin/postinstall.js"
-  },
   "exports": {
     ".": {
-      "sass": "./scss/zeus.scss",
+      "sass": "./scss/foundation/foundation.scss",
       "css": "./dist/zeus.css",
       "default": "./dist/zeus.css"
     },
@@ -37,12 +34,18 @@
     "./bin/*": "./bin/*"
   },
   "files": [
-    "scss",
+    "scss/foundation",
+    "scss/zeus.scss",
+    "scss/zeus.config.scss",
+    "scss/zeus.customize.scss",
+    "scss/zeus.token.sets.example.scss",
+    "scss/zeus.tokens.json",
     "dist",
-    "bin"
+    "bin",
+    "CHANGELOG.md"
   ],
   "peerDependencies": {
-    "sass": "^1.60.0"
+    "sass": "^1.79.0"
   },
   "keywords": [
     "zeus",

package/scss/CHANGELOG.md

@@ -0,0 +1,112 @@
+# Changelog
+
+All notable changes to zeus-css are documented in this file.
+Format loosely follows [Keep a Changelog](https://keepachangelog.com/).
+
+## [1.0.13]
+
+### Fixed
+
+- **Package tarball no longer ships a stale nested copy of the framework.**
+  `scss/dist/*.css` (a 1.0.0-era build with 12 instances of `outline: none`
+  instead of the current 7 — an accessibility fix that had already shipped
+  in the real `dist/`), the nested `scss/package.json`, `.stylelintrc.json`,
+  and dev-only build scripts are no longer included in `files`. Unpacked
+  package size drops from carrying a full second copy of the framework to
+  just the intended source.
+- **`exports["."].sass` now resolves to `./scss/foundation/foundation.scss`**
+  instead of `./scss/zeus.scss`. The latter is an intentional zero-emission
+  bridge (four `@forward` statements, no CSS) meant for component
+  `.module.scss` files via the `zeus-css/zeus` subpath — it was never meant
+  to be the target of the bare `zeus-css` import. `@use "pkg:zeus-css"` (or
+  any bundler's `sass` condition resolution) now returns the actual
+  framework instead of silently compiling to nothing.
+- Fixed a compile crash (`Invalid index 2 for a list with 1 elements`) when
+  `$zeus-breakpoints` is overridden down to a single entry. The breakpoint
+  sort in `root-generator.scss` now guards `$n > 1` before entering the
+  loop.
+- `<main>` no longer collapses to near-zero width as a flex item. It was
+  included (with `body` and `.container`) in the container-query
+  `container-type: inline-size` reset, which removes it from normal
+  content-based sizing; unlike `body`/`.container`, `<main>` in a flex
+  context has no other width source. Removed from that selector, matching
+  the reasoning already applied to `.grid`.
+- `[hidden]` can now be overridden. The reset declared
+  `display: none !important` inside `@layer reset` — the first layer in
+  cascade order — and layer order reverses for `!important` declarations,
+  so nothing later (layered or not) could win. The `!important` is gone,
+  and the selector is now `:where([hidden]):not([hidden="until-found"])`
+  so `hidden="until-found"` content stays reachable by in-page find, per
+  the HTML spec's own recommended selector for this rule.
+- Fluid typography no longer rounds to visible 1.6px steps. The shared
+  clamp() engine's `$step` defaults to `0.1` in the *output* unit — fine at
+  0.1px for spacing, but 0.1rem (1.6px) for type. Typography now compiles
+  with `$step: 0.01` / `$accuracy: 3`, and declared min/max endpoints are
+  now reached in practice instead of stopping ~1.6px short.
+- `overflow-wrap: anywhere` removed from the `body` reset. It was declared
+  alongside `word-break: break-word`, which already handles overflow
+  safely; `anywhere` additionally breaks inside words that don't need it,
+  including in narrow columns where it isn't wanted.
+- Added `border-style: solid` to the universal box-sizing reset. Elements
+  reset with `border: 0` (`button`, `input`, `textarea`, `select`) stayed
+  invisible even after a consumer later added `border-width`/`border-color`,
+  because `border-style` defaulted to `none`. Same fix Tailwind's preflight
+  uses.
+- `bin/init.js` now exits non-zero on a failed scaffold instead of
+  swallowing the error and exiting 0, and responds to `--help`/`-h` with
+  usage instead of running the full init routine against the current
+  directory.
+- `peerDependencies.sass` raised from `^1.60.0` to `^1.79.0`, matching the
+  actual floor required by the relative `oklch(from ...)` color syntax and
+  the `pkg:` importer used in the docs.
+- Removed the `postinstall` script (`bin/postinstall.js`) and its
+  `package.json` hook. It only printed a discovery hint for
+  `npx zeus-css init`, already covered in the README — not worth pnpm 10
+  blocking lifecycle scripts by default, or the supply-chain-scanner flags
+  a postinstall script draws for no functional benefit.
+- Corrected the README's `@property` claim — coverage is the base semantic
+  color palette (5 tokens), not "key tokens" broadly; derived color
+  variants, spacing, and typography remain plain custom properties.
+- Removed `body-md`, `body-md-bold`, `body-md-semibold`, and `body-md-medium`
+  from the typography token map — they were byte-for-byte duplicates of
+  `body`/`body-bold`/`body-semibold`/`body-medium`. `--text-body` is now
+  the single source; regenerated `zeus.tokens.json`, `cheatsheet.md`, and
+  `llms.txt` (both the `scss/` copies and the package-root mirrors, which
+  had drifted out of sync). The two real consumers of `--text-body-md`
+  (`FinalHeader.module.scss`, `CtaBlock.module.scss`, both outside this
+  package) were migrated to `--text-body` — same value, no visual change.
+- Fixed an unrelated bug found while migrating `CtaBlock.module.scss`:
+  `.installBox` set `font-size: var(--text-body)`, but `--text-body` is a
+  `font` *shorthand* (weight/size/line-height/family), not a bare size —
+  invalid as a `font-size` value, so it silently fell back to inherited.
+  Replaced with `font: var(--text-code);`, matching the token its sibling
+  widget (`TheZeusHero.module.scss` `.install`) already uses, per the
+  file's own "kept in visual sync" comment.
+- Documented that Zeus intentionally ships one color palette with no
+  `prefers-color-scheme` / light-dark switching — not a gap, a design
+  decision. `zeus-theme()` is for swapping the whole palette (e.g. a
+  different brand), not a light/dark toggle. See README Features.
+- Fixed a silent-drop bug in color token emission: explicitly setting a
+  derived color key in `$zeus-colors` (e.g. `primary-light`) made
+  `semantic-colors.scss` skip emitting it, on the assumption that
+  `root-generator.scss`'s generic pipeline would emit it instead — but that
+  pipeline deliberately excludes `$zeus-colors`. The variable vanished from
+  the compiled CSS entirely; with `$zeus-enable-property-registration`
+  left at its default it was masked by `@property`'s `initial-value`
+  incidentally supplying the same value, but disabling that flag exposed
+  the break directly. `_emit-static-color-vars` now always emits every
+  variant, using the explicit override when present and the derived value
+  otherwise.
+
+### Known issues (tracked, not in this release)
+
+- `round()`/`oklch(from ...)` are used throughout the compiled CSS with no
+  `@supports` fallback, so browsers without CSS `round()` support drop the
+  affected `clamp()` declarations entirely. Needs a systematic
+  progressive-enhancement pass, not a patch-sized fix.
+- Class naming mixes three conventions (`z-*` BEM components, `btn-*` and
+  `.container` utilities, both covered by `$zeus-use-prefix`). Decided:
+  keep as-is rather than a breaking rename — `$zeus-use-prefix` defaults
+  to `false`, so `.container`/`btn-*` are unprefixed unless opted in; this
+  is now called out explicitly in `API.md` as a collision risk when
+  running alongside another framework.

package/scss/foundation/core/design/colors/semantic-colors.scss

@@ -54,50 +54,43 @@ $_known-color-keys: (
 // ║  from 5 resolved base colors.                               ║
 // ║  Single source of truth shared with engine/theme-builder.scss. ║
 // ╚══════════════════════════════════════════════════════════════╝
+// Emits $key either from the developer's explicit $zeus-colors override or
+// from $derived. root-generator.scss's generic token pipeline deliberately
+// excludes $zeus-colors (see _design-system.scss), so this is the only
+// place a variant key ever gets emitted — skipping it on _has($key) (as
+// this used to do, on the assumption something else emitted it) silently
+// dropped the variable from the compiled CSS entirely whenever a developer
+// set it explicitly.
+@function _resolved($key, $derived) {
+  @if _has($key) {
+    @return _c($key, $derived);
+  } @else {
+    @return $derived;
+  }
+}
+
 @mixin _emit-static-color-vars($primary, $secondary, $accent, $text, $bg) {
   --color-primary: #{$primary};
-  @if not _has("primary-light") {
-    --color-primary-light: #{derive.derive-light("var(--color-primary)")};
-  }
-  @if not _has("primary-dark") {
-    --color-primary-dark: #{derive.derive-dark("var(--color-primary)")};
-  }
+  --color-primary-light: #{_resolved("primary-light", derive.derive-light("var(--color-primary)"))};
+  --color-primary-dark: #{_resolved("primary-dark", derive.derive-dark("var(--color-primary)"))};
 
   --color-secondary: #{$secondary};
-  @if not _has("secondary-light") {
-    --color-secondary-light: #{derive.derive-light("var(--color-secondary)")};
-  }
-  @if not _has("secondary-dark") {
-    --color-secondary-dark: #{derive.derive-dark("var(--color-secondary)")};
-  }
+  --color-secondary-light: #{_resolved("secondary-light", derive.derive-light("var(--color-secondary)"))};
+  --color-secondary-dark: #{_resolved("secondary-dark", derive.derive-dark("var(--color-secondary)"))};
 
   --color-accent: #{$accent};
-  @if not _has("accent-light") {
-    --color-accent-light: #{derive.derive-light("var(--color-accent)")};
-  }
-  @if not _has("accent-dark") {
-    --color-accent-dark: #{derive.derive-dark("var(--color-accent)")};
-  }
+  --color-accent-light: #{_resolved("accent-light", derive.derive-light("var(--color-accent)"))};
+  --color-accent-dark: #{_resolved("accent-dark", derive.derive-dark("var(--color-accent)"))};
 
   --color-background: #{$bg};
-  @if not _has("surface") {
-    --color-surface: #{derive.derive-surface("var(--color-background)")};
-  }
+  --color-surface: #{_resolved("surface", derive.derive-surface("var(--color-background)"))};
 
   --color-text: #{$text};
-  @if not _has("text-inverse") {
-    --color-text-inverse: #{$bg};
-  }
+  --color-text-inverse: #{_resolved("text-inverse", $bg)};
 
-  @if not _has("text-muted") {
-    --color-text-muted: #{derive.derive-muted("var(--color-text)", "var(--color-background)")};
-  }
-  @if not _has("border") {
-    --color-border: #{derive.derive-border("var(--color-text)", "var(--color-background)")};
-  }
-  @if not _has("border-strong") {
-    --color-border-strong: #{derive.derive-border-strong("var(--color-text)", "var(--color-background)")};
-  }
+  --color-text-muted: #{_resolved("text-muted", derive.derive-muted("var(--color-text)", "var(--color-background)"))};
+  --color-border: #{_resolved("border", derive.derive-border("var(--color-text)", "var(--color-background)"))};
+  --color-border-strong: #{_resolved("border-strong", derive.derive-border-strong("var(--color-text)", "var(--color-background)"))};
 
   --color-surface-subtle: #{derive.derive-surface-subtle("var(--color-surface)", "var(--color-text)")};
   --color-warning-subtle: #{derive.derive-warning-subtle("var(--base-system-warning)", "var(--color-background)")};

package/scss/foundation/core/design/typography/typography.scss

@@ -218,15 +218,6 @@ $_typography-defaults: (
     weight: 400,
     role: "body",
   ),
-  "body-md": (family: "primary",
-    size: (floor: 16,
-      ceil: 18,
-    ),
-    lh: 1.6,
-    ls: 0,
-    weight: 400,
-    role: "body",
-  ),
   "body-bold": (family: "primary",
     size: (floor: 16,
       ceil: 18,
@@ -236,15 +227,6 @@ $_typography-defaults: (
     weight: 700,
     role: "body",
   ),
-  "body-md-bold": (family: "primary",
-    size: (floor: 16,
-      ceil: 18,
-    ),
-    lh: 1.6,
-    ls: 0,
-    weight: 700,
-    role: "body",
-  ),
   "body-semibold": (family: "primary",
     size: (floor: 16,
       ceil: 18,
@@ -254,15 +236,6 @@ $_typography-defaults: (
     weight: 600,
     role: "body",
   ),
-  "body-md-semibold": (family: "primary",
-    size: (floor: 16,
-      ceil: 18,
-    ),
-    lh: 1.6,
-    ls: 0,
-    weight: 600,
-    role: "body",
-  ),
   "body-medium": (family: "primary",
     size: (floor: 16,
       ceil: 18,
@@ -272,15 +245,6 @@ $_typography-defaults: (
     weight: 500,
     role: "body",
   ),
-  "body-md-medium": (family: "primary",
-    size: (floor: 16,
-      ceil: 18,
-    ),
-    lh: 1.6,
-    ls: 0,
-    weight: 500,
-    role: "body",
-  ),
   "body-sm": (family: "primary",
     size: (floor: 14,
       ceil: 16,

package/scss/foundation/core/engine/typography-calc.scss

@@ -67,5 +67,10 @@
   $c-floor: _px-to-rem(map.get($container-bounds, "floor"), 2);
   $c-ceil:  _px-to-rem(map.get($container-bounds, "ceil"), 2);
 
-  @return fc.zeus-cqi-fluid($min-rem, $max-rem, $c-floor, $c-ceil, "rem", 1);
+  // $step in rem defaults to 0.1 (fluid-core.scss), i.e. a 1.6px jump at the
+  // 16px root — visible banding in type that isn't visible in px-based
+  // spacing. A finer step (and matching $accuracy) keeps the rem rounding
+  // below the threshold where it reads as a step, and lets endpoints
+  // actually reach their declared min/max instead of stopping short.
+  @return fc.zeus-cqi-fluid($min-rem, $max-rem, $c-floor, $c-ceil, "rem", 3, 0.01);
 }

package/scss/foundation/views/render/html-body.scss

@@ -36,7 +36,7 @@ $_zp: "";
   // grid inside a narrow column made every token (spacing/borders/icons/
   // typography) smaller with each level. Use the opt-in .cq class below on
   // any specific .grid that should size its own contents.
-  body, main, .#{$_zp}container {
+  body, .#{$_zp}container {
     container-type: inline-size;
   }
 
@@ -47,7 +47,6 @@ $_zp: "";
   body {
     color: var(--color-text);
     background-color: var(--color-background);
-    overflow-wrap: anywhere;
     word-break: break-word;
     @include text(body);
   }

package/scss/foundation/views/render/reset.scss

@@ -32,11 +32,19 @@
     padding: 0;
   }
 
-  // Universal box-sizing
+  // Universal box-sizing. border-width: 0 keeps every element invisible by
+  // default (the browser's own default border-width, ~3px "medium", would
+  // otherwise render on every element the moment border-style is forced to
+  // solid below) — border-style: solid then means a later border-width/
+  // color pair is visible immediately, without it, elements reset with
+  // border: 0 (button, input, textarea, select below) stay invisible even
+  // after a consumer adds width/color, since style defaults to none.
   *,
   *::before,
   *::after {
     box-sizing: border-box;
+    border-width: 0;
+    border-style: solid;
   }
 
   // Remove default margins
@@ -98,9 +106,11 @@
     text-decoration-skip-ink: auto;
   }
 
-  // Hidden elements
-  :where([hidden]) {
-    display: none !important;
+  // Hidden elements. :not([hidden="until-found"]) keeps beforematch content
+  // out of display:none so in-page find (ctrl+F) can still reveal it, per
+  // the HTML spec's own recommended selector for this rule.
+  :where([hidden]):not([hidden="until-found"]) {
+    display: none;
   }
 
   // Focus visible

package/scss/foundation/views/render/root-generator.scss

@@ -120,13 +120,15 @@
 @function _zeus-sorted-breakpoint-keys($breakpoints-map) {
   $keys: map.keys($breakpoints-map);
   $n: list.length($keys);
-  @for $i from 1 through $n - 1 {
-    @for $j from 1 through $n - $i {
-      $a: list.nth($keys, $j);
-      $b: list.nth($keys, $j + 1);
-      @if map.get($breakpoints-map, $a) > map.get($breakpoints-map, $b) {
-        $keys: list.set-nth($keys, $j, $b);
-        $keys: list.set-nth($keys, $j + 1, $a);
+  @if $n > 1 {
+    @for $i from 1 through $n - 1 {
+      @for $j from 1 through $n - $i {
+        $a: list.nth($keys, $j);
+        $b: list.nth($keys, $j + 1);
+        @if map.get($breakpoints-map, $a) > map.get($breakpoints-map, $b) {
+          $keys: list.set-nth($keys, $j, $b);
+          $keys: list.set-nth($keys, $j + 1, $a);
+        }
       }
     }
   }

package/scss/zeus.customize.scss

@@ -55,8 +55,7 @@ $zeus-colors: (
 // Available Keys:
 // • Headings: display-xl, display-lg, display-md, h1, h1-light, h2, h2-light, 
 //             h3, h3-light, h4, h4-light, h5, h5-light, h6, h6-light
-// • Body:     body-xl, body-lg, body, body-md, body-bold, body-md-bold, 
-//             body-semibold, body-md-semibold, body-medium, body-md-medium, 
+// • Body:     body-xl, body-lg, body, body-bold, body-semibold, body-medium,
 //             body-sm, body-sm-bold, body-sm-semibold, body-xs
 // • UI/Other: label, label-bold, caption, caption-bold, overline, 
 //             link, link-bold, button, button-lg, button-sm, code, code-sm

package/scss/zeus.token.sets.example.scss

@@ -40,13 +40,9 @@ $zeus-typography: (
   "body-xl":          ( family: "primary", size: (floor: 20, ceil: 24), lh: 1.6, ls: 0, weight: 400, role: "body" ),
   "body-lg":          ( family: "primary", size: (floor: 18, ceil: 20), lh: 1.6, ls: 0, weight: 400, role: "body" ),
   "body":             ( family: "primary", size: (floor: 16, ceil: 18), lh: 1.6, ls: 0, weight: 400, role: "body" ),
-  "body-md":          ( family: "primary", size: (floor: 16, ceil: 18), lh: 1.6, ls: 0, weight: 400, role: "body" ),
   "body-bold":        ( family: "primary", size: (floor: 16, ceil: 18), lh: 1.6, ls: 0, weight: 700, role: "body" ),
-  "body-md-bold":     ( family: "primary", size: (floor: 16, ceil: 18), lh: 1.6, ls: 0, weight: 700, role: "body" ),
   "body-semibold":    ( family: "primary", size: (floor: 16, ceil: 18), lh: 1.6, ls: 0, weight: 600, role: "body" ),
-  "body-md-semibold": ( family: "primary", size: (floor: 16, ceil: 18), lh: 1.6, ls: 0, weight: 600, role: "body" ),
   "body-medium":      ( family: "primary", size: (floor: 16, ceil: 18), lh: 1.6, ls: 0, weight: 500, role: "body" ),
-  "body-md-medium":   ( family: "primary", size: (floor: 16, ceil: 18), lh: 1.6, ls: 0, weight: 500, role: "body" ),
   "body-sm":          ( family: "primary", size: (floor: 14, ceil: 16), lh: 1.5, ls: 0, weight: 400, role: "body" ),
   "body-sm-bold":     ( family: "primary", size: (floor: 14, ceil: 16), lh: 1.5, ls: 0, weight: 700, role: "body" ),
   "body-sm-semibold": ( family: "primary", size: (floor: 14, ceil: 16), lh: 1.5, ls: 0, weight: 600, role: "body" ),