@mkbabb/glass-ui 3.8.0 → 3.9.0

package/dist/styles/disco-glyph.css

@@ -1,26 +0,0 @@
-/* disco-glyph.css — host rule for <DiscoGlyph>.
- *
- * Per P.W3 sub-B. The component renders an inline <svg> with a faceted
- * gradient + specular cap painted over the silhouette path. The host
- * rule scopes layout (block flow, inherit colour) and exposes a
- * minimal opt-in selector for phase-tinted state styling.
- *
- * Self-contained sheet; no token additions. Consumers may override
- * via the `--phase-color` cascade established by the chassis layer.
- */
-
-@layer components {
-    .disco-glyph {
-        display: inline-block;
-        width: 100%;
-        height: 100%;
-        color: currentColor;
-        line-height: 0;
-    }
-
-    .disco-glyph--phase-tinted {
-        /* Hook for consumers that animate hue under phase changes;
-         * the gradient stops already read currentColor or an explicit
-         * phaseColor prop, so this class stays empty by default. */
-    }
-}

package/dist/styles/glyph-face.css

@@ -1,92 +0,0 @@
-/* glyph-face.css — three-layer composition for <GlyphFace>.
- *
- * Per W2.7 §19 and Q.W3 §F2 + §F8. Wraps a slotted glyph (lucide stroke
- * or DiscoGlyph SVG) with a phase-tinted radial backplate (visible only
- * when [data-active="true"]) and a 165° linear-gradient catch-light cap.
- * The slotted silhouette stays `currentColor` — Vignelli-clean — while
- * the disco punch lives in the surrounding layers.
- *
- * Q.W3.A.1 inversion: when no silhouette resolves, the cap renders
- * nothing (rather than a wrapper-rectangle fallback). Consumers passing
- * `silhouette` continue to consume `clip-path: path(var(--gf-silhouette))`;
- * the lucide consumer sites in ActionCluster + SettingsCog publish via
- * the silhouette table from `@src/components/speedtest/icons/lucide-silhouettes.ts`,
- * and DiscoGlyph hands its silhouette upward via provide/inject for
- * disco wrappers. The fail-safe is now "no cap" not "wrong cap".
- *
- * Q.W3.A.2 default raise: --gf-cap-strength 0.35 → 0.55, mix-blend-mode
- * overlay → screen. `screen` composes correctly against the translucent
- * dock substrates (`--card` at 50–60% opacity); `overlay` collapses
- * there because its contrast lift requires an opaque underlay. Consumers
- * needing the metallic-overlay punch declare `mix-blend-mode: overlay`
- * via class or `--gf-cap-blend` override.
- *
- * Self-contained sheet; no token additions beyond what's already in
- * `tokens.css`. Consumers may override the cap blend mode and backplate
- * radius with the documented `--gf-*` custom properties.
- */
-
-@layer components {
-    .glyph-face {
-        position: relative;
-        display: inline-flex;
-        align-items: center;
-        justify-content: center;
-        isolation: isolate;
-        --gf-tint: transparent;
-        --gf-cap-strength: 0.55;
-        --gf-cap-blend: screen;
-        --gf-cap-radius: 50%;
-    }
-
-    .glyph-face-backplate {
-        position: absolute;
-        inset: -25%;
-        border-radius: 50%;
-        background: radial-gradient(
-            ellipse at 30% 30%,
-            var(--gf-tint) 0%,
-            transparent 70%
-        );
-        opacity: 0;
-        transition: opacity var(--duration-fast) var(--spring-snappy);
-        z-index: -1;
-        pointer-events: none;
-    }
-
-    .glyph-face[data-active="true"] .glyph-face-backplate {
-        opacity: 1;
-    }
-
-    /* Cap fail-safe: by default render nothing. The cap only paints
-       when --gf-silhouette resolves (via prop or provide/inject from
-       a DiscoGlyph descendant). This closes the wrapper-rectangle
-       leak the lucide consumers in ActionCluster + SettingsCog hit
-       under the prior opt-in path. */
-    .glyph-face-cap {
-        position: absolute;
-        inset: 0;
-        background: transparent;
-        pointer-events: none;
-        mix-blend-mode: var(--gf-cap-blend);
-    }
-
-    .glyph-face[style*="--gf-silhouette"] .glyph-face-cap {
-        background: linear-gradient(
-            165deg,
-            rgba(255, 255, 255, var(--gf-cap-strength, 0.55)) 0%,
-            transparent 40%
-        );
-        clip-path: var(--gf-silhouette);
-    }
-
-    .dark .glyph-face {
-        --gf-cap-strength: 0.32;
-    }
-
-    @media (prefers-reduced-motion: reduce) {
-        .glyph-face-backplate {
-            transition: none;
-        }
-    }
-}

package/src/styles/disco-glyph.css

@@ -1,26 +0,0 @@
-/* disco-glyph.css — host rule for <DiscoGlyph>.
- *
- * Per P.W3 sub-B. The component renders an inline <svg> with a faceted
- * gradient + specular cap painted over the silhouette path. The host
- * rule scopes layout (block flow, inherit colour) and exposes a
- * minimal opt-in selector for phase-tinted state styling.
- *
- * Self-contained sheet; no token additions. Consumers may override
- * via the `--phase-color` cascade established by the chassis layer.
- */
-
-@layer components {
-    .disco-glyph {
-        display: inline-block;
-        width: 100%;
-        height: 100%;
-        color: currentColor;
-        line-height: 0;
-    }
-
-    .disco-glyph--phase-tinted {
-        /* Hook for consumers that animate hue under phase changes;
-         * the gradient stops already read currentColor or an explicit
-         * phaseColor prop, so this class stays empty by default. */
-    }
-}

package/src/styles/glyph-face.css

@@ -1,92 +0,0 @@
-/* glyph-face.css — three-layer composition for <GlyphFace>.
- *
- * Per W2.7 §19 and Q.W3 §F2 + §F8. Wraps a slotted glyph (lucide stroke
- * or DiscoGlyph SVG) with a phase-tinted radial backplate (visible only
- * when [data-active="true"]) and a 165° linear-gradient catch-light cap.
- * The slotted silhouette stays `currentColor` — Vignelli-clean — while
- * the disco punch lives in the surrounding layers.
- *
- * Q.W3.A.1 inversion: when no silhouette resolves, the cap renders
- * nothing (rather than a wrapper-rectangle fallback). Consumers passing
- * `silhouette` continue to consume `clip-path: path(var(--gf-silhouette))`;
- * the lucide consumer sites in ActionCluster + SettingsCog publish via
- * the silhouette table from `@src/components/speedtest/icons/lucide-silhouettes.ts`,
- * and DiscoGlyph hands its silhouette upward via provide/inject for
- * disco wrappers. The fail-safe is now "no cap" not "wrong cap".
- *
- * Q.W3.A.2 default raise: --gf-cap-strength 0.35 → 0.55, mix-blend-mode
- * overlay → screen. `screen` composes correctly against the translucent
- * dock substrates (`--card` at 50–60% opacity); `overlay` collapses
- * there because its contrast lift requires an opaque underlay. Consumers
- * needing the metallic-overlay punch declare `mix-blend-mode: overlay`
- * via class or `--gf-cap-blend` override.
- *
- * Self-contained sheet; no token additions beyond what's already in
- * `tokens.css`. Consumers may override the cap blend mode and backplate
- * radius with the documented `--gf-*` custom properties.
- */
-
-@layer components {
-    .glyph-face {
-        position: relative;
-        display: inline-flex;
-        align-items: center;
-        justify-content: center;
-        isolation: isolate;
-        --gf-tint: transparent;
-        --gf-cap-strength: 0.55;
-        --gf-cap-blend: screen;
-        --gf-cap-radius: 50%;
-    }
-
-    .glyph-face-backplate {
-        position: absolute;
-        inset: -25%;
-        border-radius: 50%;
-        background: radial-gradient(
-            ellipse at 30% 30%,
-            var(--gf-tint) 0%,
-            transparent 70%
-        );
-        opacity: 0;
-        transition: opacity var(--duration-fast) var(--spring-snappy);
-        z-index: -1;
-        pointer-events: none;
-    }
-
-    .glyph-face[data-active="true"] .glyph-face-backplate {
-        opacity: 1;
-    }
-
-    /* Cap fail-safe: by default render nothing. The cap only paints
-       when --gf-silhouette resolves (via prop or provide/inject from
-       a DiscoGlyph descendant). This closes the wrapper-rectangle
-       leak the lucide consumers in ActionCluster + SettingsCog hit
-       under the prior opt-in path. */
-    .glyph-face-cap {
-        position: absolute;
-        inset: 0;
-        background: transparent;
-        pointer-events: none;
-        mix-blend-mode: var(--gf-cap-blend);
-    }
-
-    .glyph-face[style*="--gf-silhouette"] .glyph-face-cap {
-        background: linear-gradient(
-            165deg,
-            rgba(255, 255, 255, var(--gf-cap-strength, 0.55)) 0%,
-            transparent 40%
-        );
-        clip-path: var(--gf-silhouette);
-    }
-
-    .dark .glyph-face {
-        --gf-cap-strength: 0.32;
-    }
-
-    @media (prefers-reduced-motion: reduce) {
-        .glyph-face-backplate {
-            transition: none;
-        }
-    }
-}