snice 3.1.0 → 3.2.0

package/dist/components/kpi/snice-kpi.js

@@ -0,0 +1,162 @@
+import { __esDecorate, __runInitializers } from 'tslib';
+import { element, property, styles, render, css, html } from 'snice';
+import '../sparkline/snice-sparkline.js';
+
+var cssContent = ":host{display:inline-block;font-family:var(--snice-font-family, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif);contain:layout style paint}.kpi{display:flex;flex-direction:column;gap:var(--snice-spacing-xs,.5rem);padding:var(--snice-spacing-md,1rem);border-radius:var(--snice-border-radius-md,.5rem);background:var(--snice-color-background,rgb(255 255 255));border:1px solid var(--snice-color-border,rgb(229 231 235))}.kpi__header{display:flex;justify-content:space-between;align-items:flex-start;gap:var(--snice-spacing-sm,.75rem)}.kpi__main{display:flex;flex-direction:column;gap:var(--snice-spacing-2xs,.25rem);flex:1}.kpi__label{font-size:var(--snice-font-size-sm, .875rem);font-weight:var(--snice-font-weight-medium,500);color:var(--snice-color-text-secondary,rgb(107 114 128));margin:0}.kpi__value{font-size:var(--snice-font-size-3xl, 2rem);font-weight:var(--snice-font-weight-bold,700);color:var(--snice-color-text,rgb(23 23 23));line-height:1;margin:0}.kpi__value--up{color:var(--snice-color-success,rgb(22 163 74))}.kpi__value--down{color:var(--snice-color-danger,rgb(220 38 38))}.kpi__value--neutral{color:var(--snice-color-text-secondary,rgb(107 114 128))}.kpi__trend{display:flex;align-items:center;gap:var(--snice-spacing-2xs,.25rem);font-size:var(--snice-font-size-sm, .875rem);font-weight:var(--snice-font-weight-semibold,600);padding:var(--snice-spacing-2xs,.25rem) var(--snice-spacing-xs,.5rem);border-radius:var(--snice-border-radius-md,.375rem)}.kpi__trend-icon{font-size:var(--snice-font-size-lg, 1.125rem);line-height:1;font-weight:var(--snice-font-weight-bold,700)}.kpi__trend-value{line-height:1}.kpi__sparkline{margin-top:var(--snice-spacing-xs,.5rem)}.kpi__trend--up{color:var(--snice-color-success,rgb(22 163 74));background:rgb(22 163 74 / .1)}.kpi__trend--down{color:var(--snice-color-danger,rgb(220 38 38));background:rgb(220 38 38 / .1)}.kpi__trend--neutral{color:var(--snice-color-text-secondary,rgb(107 114 128));background:rgb(107 114 128 / .1)}.kpi--small .kpi__label{font-size:var(--snice-font-size-xs, .75rem)}.kpi--small .kpi__value{font-size:var(--snice-font-size-2xl, 1.5rem)}.kpi--small .kpi__trend{font-size:var(--snice-font-size-xs, .75rem)}.kpi--small{padding:var(--snice-spacing-sm,.75rem)}.kpi--medium .kpi__label{font-size:var(--snice-font-size-sm, .875rem)}.kpi--medium .kpi__value{font-size:var(--snice-font-size-3xl, 2rem)}.kpi--medium .kpi__trend{font-size:var(--snice-font-size-sm, .875rem)}.kpi--large .kpi__label{font-size:var(--snice-font-size-md, 1rem)}.kpi--large .kpi__value{font-size:var(--snice-font-size-4xl, 2.5rem)}.kpi--large .kpi__trend{font-size:var(--snice-font-size-md, 1rem)}.kpi--large{padding:var(--snice-spacing-lg,1.25rem)}";
+
+let SniceKpi = (() => {
+    let _classDecorators = [element('snice-kpi')];
+    let _classDescriptor;
+    let _classExtraInitializers = [];
+    let _classThis;
+    let _classSuper = HTMLElement;
+    let _instanceExtraInitializers = [];
+    let _label_decorators;
+    let _label_initializers = [];
+    let _label_extraInitializers = [];
+    let _value_decorators;
+    let _value_initializers = [];
+    let _value_extraInitializers = [];
+    let _trendValue_decorators;
+    let _trendValue_initializers = [];
+    let _trendValue_extraInitializers = [];
+    let _trendData_decorators;
+    let _trendData_initializers = [];
+    let _trendData_extraInitializers = [];
+    let _sentiment_decorators;
+    let _sentiment_initializers = [];
+    let _sentiment_extraInitializers = [];
+    let _size_decorators;
+    let _size_initializers = [];
+    let _size_extraInitializers = [];
+    let _showSparkline_decorators;
+    let _showSparkline_initializers = [];
+    let _showSparkline_extraInitializers = [];
+    let _colorValue_decorators;
+    let _colorValue_initializers = [];
+    let _colorValue_extraInitializers = [];
+    let _componentStyles_decorators;
+    let _renderContent_decorators;
+    (class extends _classSuper {
+        static { _classThis = this; }
+        static {
+            const _metadata = typeof Symbol === "function" && Symbol.metadata ? Object.create(_classSuper[Symbol.metadata] ?? null) : void 0;
+            _label_decorators = [property({})];
+            _value_decorators = [property({})];
+            _trendValue_decorators = [property({})];
+            _trendData_decorators = [property({ type: Array })];
+            _sentiment_decorators = [property({})];
+            _size_decorators = [property({})];
+            _showSparkline_decorators = [property({ type: Boolean })];
+            _colorValue_decorators = [property({ type: Boolean })];
+            _componentStyles_decorators = [styles()];
+            _renderContent_decorators = [render()];
+            __esDecorate(this, null, _componentStyles_decorators, { kind: "method", name: "componentStyles", static: false, private: false, access: { has: obj => "componentStyles" in obj, get: obj => obj.componentStyles }, metadata: _metadata }, null, _instanceExtraInitializers);
+            __esDecorate(this, null, _renderContent_decorators, { kind: "method", name: "renderContent", static: false, private: false, access: { has: obj => "renderContent" in obj, get: obj => obj.renderContent }, metadata: _metadata }, null, _instanceExtraInitializers);
+            __esDecorate(null, null, _label_decorators, { kind: "field", name: "label", static: false, private: false, access: { has: obj => "label" in obj, get: obj => obj.label, set: (obj, value) => { obj.label = value; } }, metadata: _metadata }, _label_initializers, _label_extraInitializers);
+            __esDecorate(null, null, _value_decorators, { kind: "field", name: "value", static: false, private: false, access: { has: obj => "value" in obj, get: obj => obj.value, set: (obj, value) => { obj.value = value; } }, metadata: _metadata }, _value_initializers, _value_extraInitializers);
+            __esDecorate(null, null, _trendValue_decorators, { kind: "field", name: "trendValue", static: false, private: false, access: { has: obj => "trendValue" in obj, get: obj => obj.trendValue, set: (obj, value) => { obj.trendValue = value; } }, metadata: _metadata }, _trendValue_initializers, _trendValue_extraInitializers);
+            __esDecorate(null, null, _trendData_decorators, { kind: "field", name: "trendData", static: false, private: false, access: { has: obj => "trendData" in obj, get: obj => obj.trendData, set: (obj, value) => { obj.trendData = value; } }, metadata: _metadata }, _trendData_initializers, _trendData_extraInitializers);
+            __esDecorate(null, null, _sentiment_decorators, { kind: "field", name: "sentiment", static: false, private: false, access: { has: obj => "sentiment" in obj, get: obj => obj.sentiment, set: (obj, value) => { obj.sentiment = value; } }, metadata: _metadata }, _sentiment_initializers, _sentiment_extraInitializers);
+            __esDecorate(null, null, _size_decorators, { kind: "field", name: "size", static: false, private: false, access: { has: obj => "size" in obj, get: obj => obj.size, set: (obj, value) => { obj.size = value; } }, metadata: _metadata }, _size_initializers, _size_extraInitializers);
+            __esDecorate(null, null, _showSparkline_decorators, { kind: "field", name: "showSparkline", static: false, private: false, access: { has: obj => "showSparkline" in obj, get: obj => obj.showSparkline, set: (obj, value) => { obj.showSparkline = value; } }, metadata: _metadata }, _showSparkline_initializers, _showSparkline_extraInitializers);
+            __esDecorate(null, null, _colorValue_decorators, { kind: "field", name: "colorValue", static: false, private: false, access: { has: obj => "colorValue" in obj, get: obj => obj.colorValue, set: (obj, value) => { obj.colorValue = value; } }, metadata: _metadata }, _colorValue_initializers, _colorValue_extraInitializers);
+            __esDecorate(null, _classDescriptor = { value: _classThis }, _classDecorators, { kind: "class", name: _classThis.name, metadata: _metadata }, null, _classExtraInitializers);
+            _classThis = _classDescriptor.value;
+            if (_metadata) Object.defineProperty(_classThis, Symbol.metadata, { enumerable: true, configurable: true, writable: true, value: _metadata });
+            __runInitializers(_classThis, _classExtraInitializers);
+        }
+        componentStyles() {
+            return css `${cssContent}`;
+        }
+        getTrendIcon() {
+            if (!this.sentiment)
+                return '';
+            switch (this.sentiment) {
+                case 'up':
+                    return '↑';
+                case 'down':
+                    return '↓';
+                case 'neutral':
+                    return '→';
+                default:
+                    return '';
+            }
+        }
+        getSparklineColor() {
+            if (!this.sentiment)
+                return 'primary';
+            switch (this.sentiment) {
+                case 'up':
+                    return 'success';
+                case 'down':
+                    return 'danger';
+                case 'neutral':
+                    return 'muted';
+                default:
+                    return 'primary';
+            }
+        }
+        renderContent() {
+            const kpiClasses = [
+                'kpi',
+                `kpi--${this.size}`
+            ].filter(Boolean).join(' ');
+            const valueClasses = [
+                'kpi__value',
+                this.colorValue && this.sentiment ? `kpi__value--${this.sentiment}` : ''
+            ].filter(Boolean).join(' ');
+            const hasTrend = this.trendValue !== undefined || this.sentiment !== undefined;
+            const hasSparkline = this.showSparkline && this.trendData && this.trendData.length > 0;
+            return html `
+      <div class="${kpiClasses}" part="container">
+        <div class="kpi__header" part="header">
+          <div class="kpi__main" part="main">
+            <div class="kpi__label" part="label">${this.label}</div>
+            <div class="${valueClasses}" part="value">${this.value}</div>
+          </div>
+
+          <if ${hasTrend}>
+            <div class="kpi__trend kpi__trend--${this.sentiment || 'neutral'}" part="trend">
+              <if ${this.sentiment}>
+                <span class="kpi__trend-icon" part="trend-icon">${this.getTrendIcon()}</span>
+              </if>
+              <if ${this.trendValue !== undefined}>
+                <span class="kpi__trend-value" part="trend-value">${this.trendValue}</span>
+              </if>
+            </div>
+          </if>
+        </div>
+
+        <if ${hasSparkline}>
+          <div class="kpi__sparkline" part="sparkline">
+            <snice-sparkline
+              .data="${this.trendData}"
+              color="${this.getSparklineColor()}"
+              width="120"
+              height="30"
+              smooth>
+            </snice-sparkline>
+          </div>
+        </if>
+      </div>
+    `;
+        }
+        constructor() {
+            super(...arguments);
+            this.label = (__runInitializers(this, _instanceExtraInitializers), __runInitializers(this, _label_initializers, ''));
+            this.value = (__runInitializers(this, _label_extraInitializers), __runInitializers(this, _value_initializers, ''));
+            this.trendValue = (__runInitializers(this, _value_extraInitializers), __runInitializers(this, _trendValue_initializers, void 0));
+            this.trendData = (__runInitializers(this, _trendValue_extraInitializers), __runInitializers(this, _trendData_initializers, void 0));
+            this.sentiment = (__runInitializers(this, _trendData_extraInitializers), __runInitializers(this, _sentiment_initializers, void 0));
+            this.size = (__runInitializers(this, _sentiment_extraInitializers), __runInitializers(this, _size_initializers, 'medium'));
+            this.showSparkline = (__runInitializers(this, _size_extraInitializers), __runInitializers(this, _showSparkline_initializers, true));
+            this.colorValue = (__runInitializers(this, _showSparkline_extraInitializers), __runInitializers(this, _colorValue_initializers, false));
+            __runInitializers(this, _colorValue_extraInitializers);
+        }
+    });
+    return _classThis;
+})();
+
+export { SniceKpi };
+//# sourceMappingURL=snice-kpi.js.map

package/dist/components/kpi/snice-kpi.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"snice-kpi.js","sources":["../../../components/kpi/snice-kpi.css?inline","../../../../components/kpi/snice-kpi.ts"],"sourcesContent":["export default \":host{display:inline-block;font-family:var(--snice-font-family, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif);contain:layout style paint}.kpi{display:flex;flex-direction:column;gap:var(--snice-spacing-xs,.5rem);padding:var(--snice-spacing-md,1rem);border-radius:var(--snice-border-radius-md,.5rem);background:var(--snice-color-background,rgb(255 255 255));border:1px solid var(--snice-color-border,rgb(229 231 235))}.kpi__header{display:flex;justify-content:space-between;align-items:flex-start;gap:var(--snice-spacing-sm,.75rem)}.kpi__main{display:flex;flex-direction:column;gap:var(--snice-spacing-2xs,.25rem);flex:1}.kpi__label{font-size:var(--snice-font-size-sm, .875rem);font-weight:var(--snice-font-weight-medium,500);color:var(--snice-color-text-secondary,rgb(107 114 128));margin:0}.kpi__value{font-size:var(--snice-font-size-3xl, 2rem);font-weight:var(--snice-font-weight-bold,700);color:var(--snice-color-text,rgb(23 23 23));line-height:1;margin:0}.kpi__value--up{color:var(--snice-color-success,rgb(22 163 74))}.kpi__value--down{color:var(--snice-color-danger,rgb(220 38 38))}.kpi__value--neutral{color:var(--snice-color-text-secondary,rgb(107 114 128))}.kpi__trend{display:flex;align-items:center;gap:var(--snice-spacing-2xs,.25rem);font-size:var(--snice-font-size-sm, .875rem);font-weight:var(--snice-font-weight-semibold,600);padding:var(--snice-spacing-2xs,.25rem) var(--snice-spacing-xs,.5rem);border-radius:var(--snice-border-radius-md,.375rem)}.kpi__trend-icon{font-size:var(--snice-font-size-lg, 1.125rem);line-height:1;font-weight:var(--snice-font-weight-bold,700)}.kpi__trend-value{line-height:1}.kpi__sparkline{margin-top:var(--snice-spacing-xs,.5rem)}.kpi__trend--up{color:var(--snice-color-success,rgb(22 163 74));background:rgb(22 163 74 / .1)}.kpi__trend--down{color:var(--snice-color-danger,rgb(220 38 38));background:rgb(220 38 38 / .1)}.kpi__trend--neutral{color:var(--snice-color-text-secondary,rgb(107 114 128));background:rgb(107 114 128 / .1)}.kpi--small .kpi__label{font-size:var(--snice-font-size-xs, .75rem)}.kpi--small .kpi__value{font-size:var(--snice-font-size-2xl, 1.5rem)}.kpi--small .kpi__trend{font-size:var(--snice-font-size-xs, .75rem)}.kpi--small{padding:var(--snice-spacing-sm,.75rem)}.kpi--medium .kpi__label{font-size:var(--snice-font-size-sm, .875rem)}.kpi--medium .kpi__value{font-size:var(--snice-font-size-3xl, 2rem)}.kpi--medium .kpi__trend{font-size:var(--snice-font-size-sm, .875rem)}.kpi--large .kpi__label{font-size:var(--snice-font-size-md, 1rem)}.kpi--large .kpi__value{font-size:var(--snice-font-size-4xl, 2.5rem)}.kpi--large .kpi__trend{font-size:var(--snice-font-size-md, 1rem)}.kpi--large{padding:var(--snice-spacing-lg,1.25rem)}\";",null],"names":[],"mappings":"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"}

package/dist/components/kpi/snice-kpi.types.d.ts

@@ -0,0 +1,12 @@
+export type KpiSentiment = 'up' | 'down' | 'neutral';
+export type KpiSize = 'small' | 'medium' | 'large';
+export interface SniceKpiElement extends HTMLElement {
+    label: string;
+    value: string | number;
+    trendValue?: string | number;
+    trendData?: number[];
+    sentiment?: KpiSentiment;
+    size: KpiSize;
+    showSparkline: boolean;
+    colorValue: boolean;
+}

package/dist/components/layout/snice-layout-blog.js

@@ -2,7 +2,7 @@ import { __runInitializers, __esDecorate } from 'tslib';
 import { element, query, property, render, styles, html, css } from 'snice';
 import '../nav/snice-nav.js';
 
-var cssContent = "/* Blog Layout - Article with sidebar */\n:host {\n  display: block;\n  font-family: var(--snice-font-family, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif);\n}\n\n.layout {\n  min-height: 100vh;\n  display: grid;\n  grid-template-rows: auto 1fr auto;\n}\n\n.container {\n  max-width: 1200px;\n  margin: 0 auto;\n  padding: 0 var(--snice-spacing-lg, 2rem);\n}\n\n.header {\n  background: var(--snice-color-background, white);\n  border-bottom: 1px solid var(--snice-color-border, #d1d5db);\n  padding: var(--snice-spacing-md, 1rem) 0;\n}\n\n.header .container {\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n}\n\n.brand h1 {\n  margin: 0;\n  font-size: var(--snice-font-size-xl, 1.5rem);\n  font-weight: var(--snice-font-weight-bold, 700);\n  color: var(--snice-color-text, #374151);\n}\n\n.nav {\n  display: flex;\n  gap: var(--snice-spacing-lg, 2rem);\n}\n\n.nav ::slotted(a) {\n  text-decoration: none;\n  color: var(--snice-color-text-secondary, #6b7280);\n  font-weight: var(--snice-font-weight-medium, 500);\n  transition: color var(--snice-transition-fast, 0.15s) ease;\n}\n\n.nav ::slotted(a:hover) {\n  color: var(--snice-color-primary, #3b82f6);\n}\n\n.main {\n  background: var(--snice-color-background, white);\n  padding: var(--snice-spacing-xl, 3rem) 0;\n}\n\n.content-area {\n  display: grid;\n  grid-template-columns: 1fr 300px;\n  gap: var(--snice-spacing-2xl, 4rem);\n  align-items: start;\n}\n\n.article {\n  max-width: none;\n}\n\n.sidebar {\n  background: var(--snice-color-background-secondary, #f8fafc);\n  border-radius: var(--snice-border-radius-lg, 8px);\n  padding: var(--snice-spacing-lg, 2rem);\n  position: sticky;\n  top: var(--snice-spacing-lg, 2rem);\n}\n\n.footer {\n  background: var(--snice-color-background-tertiary, #f1f5f9);\n  border-top: 1px solid var(--snice-color-border, #d1d5db);\n  padding: var(--snice-spacing-xl, 3rem) 0;\n}\n\n/* Typography for article content */\n.article ::slotted(h1) {\n  font-size: var(--snice-font-size-3xl, 2.25rem);\n  font-weight: var(--snice-font-weight-bold, 700);\n  color: var(--snice-color-text, #374151);\n  line-height: var(--snice-line-height-tight, 1.25);\n  margin-bottom: var(--snice-spacing-lg, 2rem);\n}\n\n.article ::slotted(h2) {\n  font-size: var(--snice-font-size-2xl, 1.875rem);\n  font-weight: var(--snice-font-weight-semibold, 600);\n  color: var(--snice-color-text, #374151);\n  margin-top: var(--snice-spacing-xl, 3rem);\n  margin-bottom: var(--snice-spacing-md, 1rem);\n}\n\n.article ::slotted(p) {\n  font-size: var(--snice-font-size-base, 1rem);\n  line-height: var(--snice-line-height-relaxed, 1.625);\n  color: var(--snice-color-text, #374151);\n  margin-bottom: var(--snice-spacing-md, 1rem);\n}\n\n/* Mobile responsive */\n@media (max-width: 968px) {\n  .content-area {\n    grid-template-columns: 1fr;\n    gap: var(--snice-spacing-xl, 3rem);\n  }\n  \n  .sidebar {\n    position: static;\n  }\n}\n\n@media (max-width: 768px) {\n  .header .container {\n    flex-direction: column;\n    gap: var(--snice-spacing-md, 1rem);\n  }\n  \n  .main {\n    padding: var(--snice-spacing-lg, 2rem) 0;\n  }\n}";
+var cssContent = ":host{display:block;font-family:var(--snice-font-family, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif)}.layout{min-height:100vh;display:grid;grid-template-rows:auto 1fr auto}.container{max-width:1200px;margin:0 auto;padding:0 var(--snice-spacing-lg,2rem)}.header{background:var(--snice-color-background,#fff);border-bottom:1px solid var(--snice-color-border,#d1d5db);padding:var(--snice-spacing-md,1rem) 0}.header .container{display:flex;align-items:center;justify-content:space-between}.brand h1{margin:0;font-size:var(--snice-font-size-xl, 1.5rem);font-weight:var(--snice-font-weight-bold,700);color:var(--snice-color-text,#374151)}.nav{display:flex;gap:var(--snice-spacing-lg,2rem)}.nav ::slotted(a){text-decoration:none;color:var(--snice-color-text-secondary,#6b7280);font-weight:var(--snice-font-weight-medium,500);transition:color var(--snice-transition-fast, .15s) ease}.nav ::slotted(a:hover){color:var(--snice-color-primary,#3b82f6)}.main{background:var(--snice-color-background,#fff);padding:var(--snice-spacing-xl,3rem) 0}.content-area{display:grid;grid-template-columns:1fr 300px;gap:var(--snice-spacing-2xl,4rem);align-items:start}.article{max-width:none}.sidebar{background:var(--snice-color-background-secondary,#f8fafc);border-radius:var(--snice-border-radius-lg,8px);padding:var(--snice-spacing-lg,2rem);position:sticky;top:var(--snice-spacing-lg,2rem)}.footer{background:var(--snice-color-background-tertiary,#f1f5f9);border-top:1px solid var(--snice-color-border,#d1d5db);padding:var(--snice-spacing-xl,3rem) 0}.article ::slotted(h1){font-size:var(--snice-font-size-3xl, 2.25rem);font-weight:var(--snice-font-weight-bold,700);color:var(--snice-color-text,#374151);line-height:var(--snice-line-height-tight, 1.25);margin-bottom:var(--snice-spacing-lg,2rem)}.article ::slotted(h2){font-size:var(--snice-font-size-2xl, 1.875rem);font-weight:var(--snice-font-weight-semibold,600);color:var(--snice-color-text,#374151);margin-top:var(--snice-spacing-xl,3rem);margin-bottom:var(--snice-spacing-md,1rem)}.article ::slotted(p){font-size:var(--snice-font-size-base, 1rem);line-height:var(--snice-line-height-relaxed, 1.625);color:var(--snice-color-text,#374151);margin-bottom:var(--snice-spacing-md,1rem)}@media (max-width:968px){.content-area{grid-template-columns:1fr;gap:var(--snice-spacing-xl,3rem)}.sidebar{position:static}}@media (max-width:768px){.header .container{flex-direction:column;gap:var(--snice-spacing-md,1rem)}.main{padding:var(--snice-spacing-lg,2rem) 0}}";
 
 let SniceLayoutBlog = (() => {
     let _classDecorators = [element('snice-layout-blog')];

package/dist/components/layout/snice-layout-blog.js.map

@@ -1 +1 @@
-{"version":3,"file":"snice-layout-blog.js","sources":["../../../components/layout/snice-layout-blog.css?inline","../../../../components/layout/snice-layout-blog.ts"],"sourcesContent":["export default \"/* Blog Layout - Article with sidebar */\\n:host {\\n  display: block;\\n  font-family: var(--snice-font-family, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif);\\n}\\n\\n.layout {\\n  min-height: 100vh;\\n  display: grid;\\n  grid-template-rows: auto 1fr auto;\\n}\\n\\n.container {\\n  max-width: 1200px;\\n  margin: 0 auto;\\n  padding: 0 var(--snice-spacing-lg, 2rem);\\n}\\n\\n.header {\\n  background: var(--snice-color-background, white);\\n  border-bottom: 1px solid var(--snice-color-border, #d1d5db);\\n  padding: var(--snice-spacing-md, 1rem) 0;\\n}\\n\\n.header .container {\\n  display: flex;\\n  align-items: center;\\n  justify-content: space-between;\\n}\\n\\n.brand h1 {\\n  margin: 0;\\n  font-size: var(--snice-font-size-xl, 1.5rem);\\n  font-weight: var(--snice-font-weight-bold, 700);\\n  color: var(--snice-color-text, #374151);\\n}\\n\\n.nav {\\n  display: flex;\\n  gap: var(--snice-spacing-lg, 2rem);\\n}\\n\\n.nav ::slotted(a) {\\n  text-decoration: none;\\n  color: var(--snice-color-text-secondary, #6b7280);\\n  font-weight: var(--snice-font-weight-medium, 500);\\n  transition: color var(--snice-transition-fast, 0.15s) ease;\\n}\\n\\n.nav ::slotted(a:hover) {\\n  color: var(--snice-color-primary, #3b82f6);\\n}\\n\\n.main {\\n  background: var(--snice-color-background, white);\\n  padding: var(--snice-spacing-xl, 3rem) 0;\\n}\\n\\n.content-area {\\n  display: grid;\\n  grid-template-columns: 1fr 300px;\\n  gap: var(--snice-spacing-2xl, 4rem);\\n  align-items: start;\\n}\\n\\n.article {\\n  max-width: none;\\n}\\n\\n.sidebar {\\n  background: var(--snice-color-background-secondary, #f8fafc);\\n  border-radius: var(--snice-border-radius-lg, 8px);\\n  padding: var(--snice-spacing-lg, 2rem);\\n  position: sticky;\\n  top: var(--snice-spacing-lg, 2rem);\\n}\\n\\n.footer {\\n  background: var(--snice-color-background-tertiary, #f1f5f9);\\n  border-top: 1px solid var(--snice-color-border, #d1d5db);\\n  padding: var(--snice-spacing-xl, 3rem) 0;\\n}\\n\\n/* Typography for article content */\\n.article ::slotted(h1) {\\n  font-size: var(--snice-font-size-3xl, 2.25rem);\\n  font-weight: var(--snice-font-weight-bold, 700);\\n  color: var(--snice-color-text, #374151);\\n  line-height: var(--snice-line-height-tight, 1.25);\\n  margin-bottom: var(--snice-spacing-lg, 2rem);\\n}\\n\\n.article ::slotted(h2) {\\n  font-size: var(--snice-font-size-2xl, 1.875rem);\\n  font-weight: var(--snice-font-weight-semibold, 600);\\n  color: var(--snice-color-text, #374151);\\n  margin-top: var(--snice-spacing-xl, 3rem);\\n  margin-bottom: var(--snice-spacing-md, 1rem);\\n}\\n\\n.article ::slotted(p) {\\n  font-size: var(--snice-font-size-base, 1rem);\\n  line-height: var(--snice-line-height-relaxed, 1.625);\\n  color: var(--snice-color-text, #374151);\\n  margin-bottom: var(--snice-spacing-md, 1rem);\\n}\\n\\n/* Mobile responsive */\\n@media (max-width: 968px) {\\n  .content-area {\\n    grid-template-columns: 1fr;\\n    gap: var(--snice-spacing-xl, 3rem);\\n  }\\n  \\n  .sidebar {\\n    position: static;\\n  }\\n}\\n\\n@media (max-width: 768px) {\\n  .header .container {\\n    flex-direction: column;\\n    gap: var(--snice-spacing-md, 1rem);\\n  }\\n  \\n  .main {\\n    padding: var(--snice-spacing-lg, 2rem) 0;\\n  }\\n}\";",null],"names":[],"mappings":"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"}
+{"version":3,"file":"snice-layout-blog.js","sources":["../../../components/layout/snice-layout-blog.css?inline","../../../../components/layout/snice-layout-blog.ts"],"sourcesContent":["export default \":host{display:block;font-family:var(--snice-font-family, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif)}.layout{min-height:100vh;display:grid;grid-template-rows:auto 1fr auto}.container{max-width:1200px;margin:0 auto;padding:0 var(--snice-spacing-lg,2rem)}.header{background:var(--snice-color-background,#fff);border-bottom:1px solid var(--snice-color-border,#d1d5db);padding:var(--snice-spacing-md,1rem) 0}.header .container{display:flex;align-items:center;justify-content:space-between}.brand h1{margin:0;font-size:var(--snice-font-size-xl, 1.5rem);font-weight:var(--snice-font-weight-bold,700);color:var(--snice-color-text,#374151)}.nav{display:flex;gap:var(--snice-spacing-lg,2rem)}.nav ::slotted(a){text-decoration:none;color:var(--snice-color-text-secondary,#6b7280);font-weight:var(--snice-font-weight-medium,500);transition:color var(--snice-transition-fast, .15s) ease}.nav ::slotted(a:hover){color:var(--snice-color-primary,#3b82f6)}.main{background:var(--snice-color-background,#fff);padding:var(--snice-spacing-xl,3rem) 0}.content-area{display:grid;grid-template-columns:1fr 300px;gap:var(--snice-spacing-2xl,4rem);align-items:start}.article{max-width:none}.sidebar{background:var(--snice-color-background-secondary,#f8fafc);border-radius:var(--snice-border-radius-lg,8px);padding:var(--snice-spacing-lg,2rem);position:sticky;top:var(--snice-spacing-lg,2rem)}.footer{background:var(--snice-color-background-tertiary,#f1f5f9);border-top:1px solid var(--snice-color-border,#d1d5db);padding:var(--snice-spacing-xl,3rem) 0}.article ::slotted(h1){font-size:var(--snice-font-size-3xl, 2.25rem);font-weight:var(--snice-font-weight-bold,700);color:var(--snice-color-text,#374151);line-height:var(--snice-line-height-tight, 1.25);margin-bottom:var(--snice-spacing-lg,2rem)}.article ::slotted(h2){font-size:var(--snice-font-size-2xl, 1.875rem);font-weight:var(--snice-font-weight-semibold,600);color:var(--snice-color-text,#374151);margin-top:var(--snice-spacing-xl,3rem);margin-bottom:var(--snice-spacing-md,1rem)}.article ::slotted(p){font-size:var(--snice-font-size-base, 1rem);line-height:var(--snice-line-height-relaxed, 1.625);color:var(--snice-color-text,#374151);margin-bottom:var(--snice-spacing-md,1rem)}@media (max-width:968px){.content-area{grid-template-columns:1fr;gap:var(--snice-spacing-xl,3rem)}.sidebar{position:static}}@media (max-width:768px){.header .container{flex-direction:column;gap:var(--snice-spacing-md,1rem)}.main{padding:var(--snice-spacing-lg,2rem) 0}}\";",null],"names":[],"mappings":"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"}

package/dist/components/layout/snice-layout-card.js

@@ -1,7 +1,7 @@
 import { __esDecorate, __runInitializers } from 'tslib';
 import { element, property, render, styles, html, css } from 'snice';
 
-var cssContent = "/* Card Grid Layout */\n:host {\n  display: block;\n  font-family: var(--snice-font-family, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif);\n}\n\n.layout {\n  min-height: 100vh;\n  display: grid;\n  grid-template-rows: auto 1fr auto;\n  background: var(--snice-color-background-secondary, #f8fafc);\n}\n\n.header {\n  background: var(--snice-color-background, white);\n  border-bottom: 1px solid var(--snice-color-border, #d1d5db);\n  padding: var(--snice-spacing-lg, 2rem);\n}\n\n.main {\n  padding: var(--snice-spacing-lg, 2rem);\n}\n\n.grid {\n  display: grid;\n  grid-template-columns: repeat(3, 1fr);\n}\n\n/* Column variants */\n:host([columns=\"1\"]) .grid {\n  grid-template-columns: 1fr;\n}\n\n:host([columns=\"2\"]) .grid {\n  grid-template-columns: repeat(2, 1fr);\n}\n\n:host([columns=\"3\"]) .grid {\n  grid-template-columns: repeat(3, 1fr);\n}\n\n:host([columns=\"4\"]) .grid {\n  grid-template-columns: repeat(4, 1fr);\n}\n\n:host([columns=\"6\"]) .grid {\n  grid-template-columns: repeat(6, 1fr);\n}\n\n/* Gap variants */\n:host([gap=\"sm\"]) .grid {\n  gap: var(--snice-spacing-sm, 0.75rem);\n}\n\n:host([gap=\"md\"]) .grid,\n:host(:not([gap])) .grid {\n  gap: var(--snice-spacing-md, 1rem);\n}\n\n:host([gap=\"lg\"]) .grid {\n  gap: var(--snice-spacing-lg, 2rem);\n}\n\n:host([gap=\"xl\"]) .grid {\n  gap: var(--snice-spacing-xl, 3rem);\n}\n\n.footer {\n  background: var(--snice-color-background, white);\n  border-top: 1px solid var(--snice-color-border, #d1d5db);\n  padding: var(--snice-spacing-lg, 2rem);\n}\n\n/* Auto-responsive grid */\n@media (max-width: 1200px) {\n  :host([columns=\"6\"]) .grid {\n    grid-template-columns: repeat(4, 1fr);\n  }\n}\n\n@media (max-width: 992px) {\n  :host([columns=\"4\"]) .grid,\n  :host([columns=\"6\"]) .grid {\n    grid-template-columns: repeat(3, 1fr);\n  }\n}\n\n@media (max-width: 768px) {\n  :host([columns=\"3\"]) .grid,\n  :host([columns=\"4\"]) .grid,\n  :host([columns=\"6\"]) .grid {\n    grid-template-columns: repeat(2, 1fr);\n  }\n}\n\n@media (max-width: 480px) {\n  .grid {\n    grid-template-columns: 1fr !important;\n  }\n  \n  .main {\n    padding: var(--snice-spacing-md, 1rem);\n  }\n}";
+var cssContent = ":host{display:block;font-family:var(--snice-font-family, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif)}.layout{min-height:100vh;display:grid;grid-template-rows:auto 1fr auto;background:var(--snice-color-background-secondary,#f8fafc)}.header{background:var(--snice-color-background,#fff);border-bottom:1px solid var(--snice-color-border,#d1d5db);padding:var(--snice-spacing-lg,2rem)}.main{padding:var(--snice-spacing-lg,2rem)}.grid{display:grid;grid-template-columns:repeat(3,1fr)}:host([columns=\"1\"]) .grid{grid-template-columns:1fr}:host([columns=\"2\"]) .grid{grid-template-columns:repeat(2,1fr)}:host([columns=\"3\"]) .grid{grid-template-columns:repeat(3,1fr)}:host([columns=\"4\"]) .grid{grid-template-columns:repeat(4,1fr)}:host([columns=\"6\"]) .grid{grid-template-columns:repeat(6,1fr)}:host([gap=sm]) .grid{gap:var(--snice-spacing-sm,.75rem)}:host(:not([gap])) .grid,:host([gap=md]) .grid{gap:var(--snice-spacing-md,1rem)}:host([gap=lg]) .grid{gap:var(--snice-spacing-lg,2rem)}:host([gap=xl]) .grid{gap:var(--snice-spacing-xl,3rem)}.footer{background:var(--snice-color-background,#fff);border-top:1px solid var(--snice-color-border,#d1d5db);padding:var(--snice-spacing-lg,2rem)}@media (max-width:1200px){:host([columns=\"6\"]) .grid{grid-template-columns:repeat(4,1fr)}}@media (max-width:992px){:host([columns=\"4\"]) .grid,:host([columns=\"6\"]) .grid{grid-template-columns:repeat(3,1fr)}}@media (max-width:768px){:host([columns=\"3\"]) .grid,:host([columns=\"4\"]) .grid,:host([columns=\"6\"]) .grid{grid-template-columns:repeat(2,1fr)}}@media (max-width:480px){.grid{grid-template-columns:1fr!important}.main{padding:var(--snice-spacing-md,1rem)}}";
 
 let SniceLayoutCard = (() => {
     let _classDecorators = [element('snice-layout-card')];

package/dist/components/layout/snice-layout-card.js.map

@@ -1 +1 @@
-{"version":3,"file":"snice-layout-card.js","sources":["../../../components/layout/snice-layout-card.css?inline","../../../../components/layout/snice-layout-card.ts"],"sourcesContent":["export default \"/* Card Grid Layout */\\n:host {\\n  display: block;\\n  font-family: var(--snice-font-family, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif);\\n}\\n\\n.layout {\\n  min-height: 100vh;\\n  display: grid;\\n  grid-template-rows: auto 1fr auto;\\n  background: var(--snice-color-background-secondary, #f8fafc);\\n}\\n\\n.header {\\n  background: var(--snice-color-background, white);\\n  border-bottom: 1px solid var(--snice-color-border, #d1d5db);\\n  padding: var(--snice-spacing-lg, 2rem);\\n}\\n\\n.main {\\n  padding: var(--snice-spacing-lg, 2rem);\\n}\\n\\n.grid {\\n  display: grid;\\n  grid-template-columns: repeat(3, 1fr);\\n}\\n\\n/* Column variants */\\n:host([columns=\\\"1\\\"]) .grid {\\n  grid-template-columns: 1fr;\\n}\\n\\n:host([columns=\\\"2\\\"]) .grid {\\n  grid-template-columns: repeat(2, 1fr);\\n}\\n\\n:host([columns=\\\"3\\\"]) .grid {\\n  grid-template-columns: repeat(3, 1fr);\\n}\\n\\n:host([columns=\\\"4\\\"]) .grid {\\n  grid-template-columns: repeat(4, 1fr);\\n}\\n\\n:host([columns=\\\"6\\\"]) .grid {\\n  grid-template-columns: repeat(6, 1fr);\\n}\\n\\n/* Gap variants */\\n:host([gap=\\\"sm\\\"]) .grid {\\n  gap: var(--snice-spacing-sm, 0.75rem);\\n}\\n\\n:host([gap=\\\"md\\\"]) .grid,\\n:host(:not([gap])) .grid {\\n  gap: var(--snice-spacing-md, 1rem);\\n}\\n\\n:host([gap=\\\"lg\\\"]) .grid {\\n  gap: var(--snice-spacing-lg, 2rem);\\n}\\n\\n:host([gap=\\\"xl\\\"]) .grid {\\n  gap: var(--snice-spacing-xl, 3rem);\\n}\\n\\n.footer {\\n  background: var(--snice-color-background, white);\\n  border-top: 1px solid var(--snice-color-border, #d1d5db);\\n  padding: var(--snice-spacing-lg, 2rem);\\n}\\n\\n/* Auto-responsive grid */\\n@media (max-width: 1200px) {\\n  :host([columns=\\\"6\\\"]) .grid {\\n    grid-template-columns: repeat(4, 1fr);\\n  }\\n}\\n\\n@media (max-width: 992px) {\\n  :host([columns=\\\"4\\\"]) .grid,\\n  :host([columns=\\\"6\\\"]) .grid {\\n    grid-template-columns: repeat(3, 1fr);\\n  }\\n}\\n\\n@media (max-width: 768px) {\\n  :host([columns=\\\"3\\\"]) .grid,\\n  :host([columns=\\\"4\\\"]) .grid,\\n  :host([columns=\\\"6\\\"]) .grid {\\n    grid-template-columns: repeat(2, 1fr);\\n  }\\n}\\n\\n@media (max-width: 480px) {\\n  .grid {\\n    grid-template-columns: 1fr !important;\\n  }\\n  \\n  .main {\\n    padding: var(--snice-spacing-md, 1rem);\\n  }\\n}\";",null],"names":[],"mappings":";;;AAAA,iBAAe,8oEAA8oE;;ICIhpE,eAAe,GAAA,CAAA,MAAA;4BAD3B,OAAO,CAAC,mBAAmB,CAAC,CAAA;;;;sBACQ,WAAW;;;;;;;;;;AAAnB,KAAA,cAAQ,WAAW,CAAA;;;;mCAC7C,QAAQ,CAAC,EAAI,CAAC,CAAA;+BAGd,QAAQ,CAAC,EAAI,CAAC,CAAA;AAGd,YAAA,yBAAA,GAAA,CAAA,MAAM,EAAE,CAAA;AAqBR,YAAA,2BAAA,GAAA,CAAA,MAAM,EAAE,CAAA;AApBT,YAAA,YAAA,CAAA,IAAA,EAAA,IAAA,EAAA,yBAAA,EAAA,EAAA,IAAA,EAAA,QAAA,EAAA,IAAA,EAAA,eAAA,EAAA,MAAA,EAAA,KAAA,EAAA,OAAA,EAAA,KAAA,EAAA,MAAA,EAAA,EAAA,GAAA,EAAA,GAAA,IAAA,eAAA,IAAA,GAAA,EAAA,GAAA,EAAA,GAAA,IAAA,GAAA,CAAA,aAAa,EAAA,EAAA,QAAA,EAAA,SAAA,EAAA,EAAA,IAAA,EAAA,0BAAA,CAAA;AAqBb,YAAA,YAAA,CAAA,IAAA,EAAA,IAAA,EAAA,2BAAA,EAAA,EAAA,IAAA,EAAA,QAAA,EAAA,IAAA,EAAA,iBAAA,EAAA,MAAA,EAAA,KAAA,EAAA,OAAA,EAAA,KAAA,EAAA,MAAA,EAAA,EAAA,GAAA,EAAA,GAAA,IAAA,iBAAA,IAAA,GAAA,EAAA,GAAA,EAAA,GAAA,IAAA,GAAA,CAAA,eAAe,EAAA,EAAA,QAAA,EAAA,SAAA,EAAA,EAAA,IAAA,EAAA,0BAAA,CAAA;YA3Bf,YAAA,CAAA,IAAA,EAAA,IAAA,EAAA,mBAAA,EAAA,EAAA,IAAA,EAAA,OAAA,EAAA,IAAA,EAAA,SAAA,EAAA,MAAA,EAAA,KAAA,EAAA,OAAA,EAAA,KAAA,EAAA,MAAA,EAAA,EAAA,GAAA,EAAA,GAAA,IAAA,SAAA,IAAA,GAAA,EAAA,GAAA,EAAA,GAAA,IAAA,GAAA,CAAA,OAAO,EAAA,GAAA,EAAA,CAAA,GAAA,EAAA,KAAA,KAAA,EAAA,GAAA,CAAP,OAAO,GAAA,KAAA,CAAA,CAAA,CAAA,EAAA,EAAA,QAAA,EAAA,SAAA,EAAA,EAAA,qBAAA,EAAA,0BAAA,CAAA;YAGP,YAAA,CAAA,IAAA,EAAA,IAAA,EAAA,eAAA,EAAA,EAAA,IAAA,EAAA,OAAA,EAAA,IAAA,EAAA,KAAA,EAAA,MAAA,EAAA,KAAA,EAAA,OAAA,EAAA,KAAA,EAAA,MAAA,EAAA,EAAA,GAAA,EAAA,GAAA,IAAA,KAAA,IAAA,GAAA,EAAA,GAAA,EAAA,GAAA,IAAA,GAAA,CAAA,GAAG,EAAA,GAAA,EAAA,CAAA,GAAA,EAAA,KAAA,KAAA,EAAA,GAAA,CAAH,GAAG,GAAA,KAAA,CAAA,CAAA,CAAA,EAAA,EAAA,QAAA,EAAA,SAAA,EAAA,EAAA,iBAAA,EAAA,sBAAA,CAAA;YALL,YAAA,CAAA,IAAA,EAAA,gBAAA,GAAA,EAAA,KAAA,EAAA,UAAA,EAAA,EAAA,gBAAA,EAAA,EAAA,IAAA,EAAA,OAAA,EAAA,IAAA,EAAA,UAAA,CAAA,IAAA,EAAA,QAAA,EAAA,SAAA,EAAA,EAAA,IAAA,EAAA,uBAAA,CAAA;;;YAAa,iBAAA,CAAA,UAAA,EAAA,uBAAA,CAAA;;QAQX,aAAa,GAAA;YACX,OAAO,IAAI,UAAQ;;;;;;;;;;;;;;;;KAgBlB;QACH;QAGA,eAAe,GAAA;AACb,YAAA,OAAO,GAAG,SAAO,CAAA,EAAG,UAAU,EAAE;QAClC;;;AA7BA,YAAA,IAAA,CAAA,OAAO,IAFI,iBAAA,CAAA,IAAA,EAAA,0BAAA,CAAe,EAAA,iBAAA,CAAA,IAAA,EAAA,qBAAA,EAEa,GAAG,CAAA,CAAA;YAG1C,IAAA,CAAA,GAAG,IAAA,iBAAA,CAAA,IAAA,EAAA,0BAAA,CAAA,EAAA,iBAAA,CAAA,IAAA,EAAA,iBAAA,EAA8B,IAAI,CAAA,CAAA;;;;;;;;;"}
+{"version":3,"file":"snice-layout-card.js","sources":["../../../components/layout/snice-layout-card.css?inline","../../../../components/layout/snice-layout-card.ts"],"sourcesContent":["export default \":host{display:block;font-family:var(--snice-font-family, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif)}.layout{min-height:100vh;display:grid;grid-template-rows:auto 1fr auto;background:var(--snice-color-background-secondary,#f8fafc)}.header{background:var(--snice-color-background,#fff);border-bottom:1px solid var(--snice-color-border,#d1d5db);padding:var(--snice-spacing-lg,2rem)}.main{padding:var(--snice-spacing-lg,2rem)}.grid{display:grid;grid-template-columns:repeat(3,1fr)}:host([columns=\\\"1\\\"]) .grid{grid-template-columns:1fr}:host([columns=\\\"2\\\"]) .grid{grid-template-columns:repeat(2,1fr)}:host([columns=\\\"3\\\"]) .grid{grid-template-columns:repeat(3,1fr)}:host([columns=\\\"4\\\"]) .grid{grid-template-columns:repeat(4,1fr)}:host([columns=\\\"6\\\"]) .grid{grid-template-columns:repeat(6,1fr)}:host([gap=sm]) .grid{gap:var(--snice-spacing-sm,.75rem)}:host(:not([gap])) .grid,:host([gap=md]) .grid{gap:var(--snice-spacing-md,1rem)}:host([gap=lg]) .grid{gap:var(--snice-spacing-lg,2rem)}:host([gap=xl]) .grid{gap:var(--snice-spacing-xl,3rem)}.footer{background:var(--snice-color-background,#fff);border-top:1px solid var(--snice-color-border,#d1d5db);padding:var(--snice-spacing-lg,2rem)}@media (max-width:1200px){:host([columns=\\\"6\\\"]) .grid{grid-template-columns:repeat(4,1fr)}}@media (max-width:992px){:host([columns=\\\"4\\\"]) .grid,:host([columns=\\\"6\\\"]) .grid{grid-template-columns:repeat(3,1fr)}}@media (max-width:768px){:host([columns=\\\"3\\\"]) .grid,:host([columns=\\\"4\\\"]) .grid,:host([columns=\\\"6\\\"]) .grid{grid-template-columns:repeat(2,1fr)}}@media (max-width:480px){.grid{grid-template-columns:1fr!important}.main{padding:var(--snice-spacing-md,1rem)}}\";",null],"names":[],"mappings":"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"}

package/dist/components/layout/snice-layout-centered.js

@@ -1,7 +1,7 @@
 import { __esDecorate, __runInitializers } from 'tslib';
 import { element, property, render, styles, html, css } from 'snice';
 
-var cssContent = "/* Centered Layout - For forms, auth pages, etc */\n:host {\n  display: block;\n  font-family: var(--snice-font-family, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif);\n}\n\n.layout {\n  min-height: 100vh;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  padding: var(--snice-spacing-lg, 2rem);\n  background: var(--snice-color-background-secondary, #f8fafc);\n}\n\n.container {\n  width: 100%;\n  max-width: 400px;\n  background: var(--snice-color-background, white);\n  border-radius: var(--snice-border-radius-lg, 8px);\n  box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);\n  padding: var(--snice-spacing-xl, 3rem);\n}\n\n/* Width variants */\n:host([width=\"sm\"]) .container {\n  max-width: 320px;\n}\n\n:host([width=\"md\"]) .container {\n  max-width: 400px;\n}\n\n:host([width=\"lg\"]) .container {\n  max-width: 500px;\n}\n\n:host([width=\"xl\"]) .container {\n  max-width: 600px;\n}\n\n/* Mobile responsive */\n@media (max-width: 480px) {\n  .layout {\n    padding: var(--snice-spacing-md, 1rem);\n  }\n  \n  .container {\n    padding: var(--snice-spacing-lg, 2rem);\n  }\n}";
+var cssContent = ":host{display:block;font-family:var(--snice-font-family, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif)}.layout{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:var(--snice-spacing-lg,2rem);background:var(--snice-color-background-secondary,#f8fafc)}.container{width:100%;max-width:400px;background:var(--snice-color-background,#fff);border-radius:var(--snice-border-radius-lg,8px);box-shadow:0 4px 6px -1px rgba(0,0,0,.1),0 2px 4px -1px rgba(0,0,0,.06);padding:var(--snice-spacing-xl,3rem)}:host([width=sm]) .container{max-width:320px}:host([width=md]) .container{max-width:400px}:host([width=lg]) .container{max-width:500px}:host([width=xl]) .container{max-width:600px}@media (max-width:480px){.layout{padding:var(--snice-spacing-md,1rem)}.container{padding:var(--snice-spacing-lg,2rem)}}";
 
 let SniceLayoutCentered = (() => {
     let _classDecorators = [element('snice-layout-centered')];

package/dist/components/layout/snice-layout-centered.js.map

@@ -1 +1 @@
-{"version":3,"file":"snice-layout-centered.js","sources":["../../../components/layout/snice-layout-centered.css?inline","../../../../components/layout/snice-layout-centered.ts"],"sourcesContent":["export default \"/* Centered Layout - For forms, auth pages, etc */\\n:host {\\n  display: block;\\n  font-family: var(--snice-font-family, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif);\\n}\\n\\n.layout {\\n  min-height: 100vh;\\n  display: flex;\\n  align-items: center;\\n  justify-content: center;\\n  padding: var(--snice-spacing-lg, 2rem);\\n  background: var(--snice-color-background-secondary, #f8fafc);\\n}\\n\\n.container {\\n  width: 100%;\\n  max-width: 400px;\\n  background: var(--snice-color-background, white);\\n  border-radius: var(--snice-border-radius-lg, 8px);\\n  box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);\\n  padding: var(--snice-spacing-xl, 3rem);\\n}\\n\\n/* Width variants */\\n:host([width=\\\"sm\\\"]) .container {\\n  max-width: 320px;\\n}\\n\\n:host([width=\\\"md\\\"]) .container {\\n  max-width: 400px;\\n}\\n\\n:host([width=\\\"lg\\\"]) .container {\\n  max-width: 500px;\\n}\\n\\n:host([width=\\\"xl\\\"]) .container {\\n  max-width: 600px;\\n}\\n\\n/* Mobile responsive */\\n@media (max-width: 480px) {\\n  .layout {\\n    padding: var(--snice-spacing-md, 1rem);\\n  }\\n  \\n  .container {\\n    padding: var(--snice-spacing-lg, 2rem);\\n  }\\n}\";",null],"names":[],"mappings":";;;AAAA,iBAAe,0oCAA0oC;;ICI5oC,mBAAmB,GAAA,CAAA,MAAA;4BAD/B,OAAO,CAAC,uBAAuB,CAAC,CAAA;;;;sBACQ,WAAW;;;;;;;AAAnB,KAAA,cAAQ,WAAW,CAAA;;;;iCACjD,QAAQ,CAAC,EAAI,CAAC,CAAA;AAGd,YAAA,yBAAA,GAAA,CAAA,MAAM,EAAE,CAAA;AAWR,YAAA,2BAAA,GAAA,CAAA,MAAM,EAAE,CAAA;AAVT,YAAA,YAAA,CAAA,IAAA,EAAA,IAAA,EAAA,yBAAA,EAAA,EAAA,IAAA,EAAA,QAAA,EAAA,IAAA,EAAA,eAAA,EAAA,MAAA,EAAA,KAAA,EAAA,OAAA,EAAA,KAAA,EAAA,MAAA,EAAA,EAAA,GAAA,EAAA,GAAA,IAAA,eAAA,IAAA,GAAA,EAAA,GAAA,EAAA,GAAA,IAAA,GAAA,CAAA,aAAa,EAAA,EAAA,QAAA,EAAA,SAAA,EAAA,EAAA,IAAA,EAAA,0BAAA,CAAA;AAWb,YAAA,YAAA,CAAA,IAAA,EAAA,IAAA,EAAA,2BAAA,EAAA,EAAA,IAAA,EAAA,QAAA,EAAA,IAAA,EAAA,iBAAA,EAAA,MAAA,EAAA,KAAA,EAAA,OAAA,EAAA,KAAA,EAAA,MAAA,EAAA,EAAA,GAAA,EAAA,GAAA,IAAA,iBAAA,IAAA,GAAA,EAAA,GAAA,EAAA,GAAA,IAAA,GAAA,CAAA,eAAe,EAAA,EAAA,QAAA,EAAA,SAAA,EAAA,EAAA,IAAA,EAAA,0BAAA,CAAA;YAdf,YAAA,CAAA,IAAA,EAAA,IAAA,EAAA,iBAAA,EAAA,EAAA,IAAA,EAAA,OAAA,EAAA,IAAA,EAAA,OAAA,EAAA,MAAA,EAAA,KAAA,EAAA,OAAA,EAAA,KAAA,EAAA,MAAA,EAAA,EAAA,GAAA,EAAA,GAAA,IAAA,OAAA,IAAA,GAAA,EAAA,GAAA,EAAA,GAAA,IAAA,GAAA,CAAA,KAAK,EAAA,GAAA,EAAA,CAAA,GAAA,EAAA,KAAA,KAAA,EAAA,GAAA,CAAL,KAAK,GAAA,KAAA,CAAA,CAAA,CAAA,EAAA,EAAA,QAAA,EAAA,SAAA,EAAA,EAAA,mBAAA,EAAA,wBAAA,CAAA;YAFP,YAAA,CAAA,IAAA,EAAA,gBAAA,GAAA,EAAA,KAAA,EAAA,UAAA,EAAA,EAAA,gBAAA,EAAA,EAAA,IAAA,EAAA,OAAA,EAAA,IAAA,EAAA,UAAA,CAAA,IAAA,EAAA,QAAA,EAAA,SAAA,EAAA,EAAA,IAAA,EAAA,uBAAA,CAAA;;;YAAa,iBAAA,CAAA,UAAA,EAAA,uBAAA,CAAA;;QAKX,aAAa,GAAA;YACX,OAAO,IAAI,UAAQ;;;;;;KAMlB;QACH;QAGA,eAAe,GAAA;AACb,YAAA,OAAO,GAAG,SAAO,CAAA,EAAG,UAAU,EAAE;QAClC;;;AAhBA,YAAA,IAAA,CAAA,KAAK,IAFM,iBAAA,CAAA,IAAA,EAAA,0BAAA,CAAmB,EAAA,iBAAA,CAAA,IAAA,EAAA,mBAAA,EAEK,IAAI,CAAA,CAAA;;;;;;;;;"}
+{"version":3,"file":"snice-layout-centered.js","sources":["../../../components/layout/snice-layout-centered.css?inline","../../../../components/layout/snice-layout-centered.ts"],"sourcesContent":["export default \":host{display:block;font-family:var(--snice-font-family, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif)}.layout{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:var(--snice-spacing-lg,2rem);background:var(--snice-color-background-secondary,#f8fafc)}.container{width:100%;max-width:400px;background:var(--snice-color-background,#fff);border-radius:var(--snice-border-radius-lg,8px);box-shadow:0 4px 6px -1px rgba(0,0,0,.1),0 2px 4px -1px rgba(0,0,0,.06);padding:var(--snice-spacing-xl,3rem)}:host([width=sm]) .container{max-width:320px}:host([width=md]) .container{max-width:400px}:host([width=lg]) .container{max-width:500px}:host([width=xl]) .container{max-width:600px}@media (max-width:480px){.layout{padding:var(--snice-spacing-md,1rem)}.container{padding:var(--snice-spacing-lg,2rem)}}\";",null],"names":[],"mappings":";;;AAAA,iBAAe,00BAA00B;;ICI50B,mBAAmB,GAAA,CAAA,MAAA;4BAD/B,OAAO,CAAC,uBAAuB,CAAC,CAAA;;;;sBACQ,WAAW;;;;;;;AAAnB,KAAA,cAAQ,WAAW,CAAA;;;;iCACjD,QAAQ,CAAC,EAAI,CAAC,CAAA;AAGd,YAAA,yBAAA,GAAA,CAAA,MAAM,EAAE,CAAA;AAWR,YAAA,2BAAA,GAAA,CAAA,MAAM,EAAE,CAAA;AAVT,YAAA,YAAA,CAAA,IAAA,EAAA,IAAA,EAAA,yBAAA,EAAA,EAAA,IAAA,EAAA,QAAA,EAAA,IAAA,EAAA,eAAA,EAAA,MAAA,EAAA,KAAA,EAAA,OAAA,EAAA,KAAA,EAAA,MAAA,EAAA,EAAA,GAAA,EAAA,GAAA,IAAA,eAAA,IAAA,GAAA,EAAA,GAAA,EAAA,GAAA,IAAA,GAAA,CAAA,aAAa,EAAA,EAAA,QAAA,EAAA,SAAA,EAAA,EAAA,IAAA,EAAA,0BAAA,CAAA;AAWb,YAAA,YAAA,CAAA,IAAA,EAAA,IAAA,EAAA,2BAAA,EAAA,EAAA,IAAA,EAAA,QAAA,EAAA,IAAA,EAAA,iBAAA,EAAA,MAAA,EAAA,KAAA,EAAA,OAAA,EAAA,KAAA,EAAA,MAAA,EAAA,EAAA,GAAA,EAAA,GAAA,IAAA,iBAAA,IAAA,GAAA,EAAA,GAAA,EAAA,GAAA,IAAA,GAAA,CAAA,eAAe,EAAA,EAAA,QAAA,EAAA,SAAA,EAAA,EAAA,IAAA,EAAA,0BAAA,CAAA;YAdf,YAAA,CAAA,IAAA,EAAA,IAAA,EAAA,iBAAA,EAAA,EAAA,IAAA,EAAA,OAAA,EAAA,IAAA,EAAA,OAAA,EAAA,MAAA,EAAA,KAAA,EAAA,OAAA,EAAA,KAAA,EAAA,MAAA,EAAA,EAAA,GAAA,EAAA,GAAA,IAAA,OAAA,IAAA,GAAA,EAAA,GAAA,EAAA,GAAA,IAAA,GAAA,CAAA,KAAK,EAAA,GAAA,EAAA,CAAA,GAAA,EAAA,KAAA,KAAA,EAAA,GAAA,CAAL,KAAK,GAAA,KAAA,CAAA,CAAA,CAAA,EAAA,EAAA,QAAA,EAAA,SAAA,EAAA,EAAA,mBAAA,EAAA,wBAAA,CAAA;YAFP,YAAA,CAAA,IAAA,EAAA,gBAAA,GAAA,EAAA,KAAA,EAAA,UAAA,EAAA,EAAA,gBAAA,EAAA,EAAA,IAAA,EAAA,OAAA,EAAA,IAAA,EAAA,UAAA,CAAA,IAAA,EAAA,QAAA,EAAA,SAAA,EAAA,EAAA,IAAA,EAAA,uBAAA,CAAA;;;YAAa,iBAAA,CAAA,UAAA,EAAA,uBAAA,CAAA;;QAKX,aAAa,GAAA;YACX,OAAO,IAAI,UAAQ;;;;;;KAMlB;QACH;QAGA,eAAe,GAAA;AACb,YAAA,OAAO,GAAG,SAAO,CAAA,EAAG,UAAU,EAAE;QAClC;;;AAhBA,YAAA,IAAA,CAAA,KAAK,IAFM,iBAAA,CAAA,IAAA,EAAA,0BAAA,CAAmB,EAAA,iBAAA,CAAA,IAAA,EAAA,mBAAA,EAEK,IAAI,CAAA,CAAA;;;;;;;;;"}

package/dist/components/layout/snice-layout-dashboard.js

@@ -3,7 +3,7 @@ import { element, query, property, render, styles, html, css } from 'snice';
 import '../breadcrumbs/snice-breadcrumbs.js';
 import '../nav/snice-nav.js';
 
-var cssContent = "/* Dashboard Layout - Complex grid with multiple areas */\n:host {\n  display: block;\n  font-family: var(--snice-font-family, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif);\n}\n\n.layout {\n  display: grid;\n  grid-template-areas: \n    \"header header header\"\n    \"nav nav nav\"\n    \"sidebar main right-sidebar\";\n  grid-template-rows: auto auto 1fr;\n  grid-template-columns: 250px 1fr 250px;\n  min-height: 100vh;\n  gap: 1px;\n  background: var(--snice-color-border, #d1d5db);\n}\n\n.header {\n  grid-area: header;\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  padding: var(--snice-spacing-md, 1rem) var(--snice-spacing-lg, 2rem);\n  background: var(--snice-color-background, white);\n  border-bottom: 1px solid var(--snice-color-border, #d1d5db);\n}\n\n.header-start h1 {\n  margin: 0;\n  font-size: var(--snice-font-size-xl, 1.5rem);\n  font-weight: var(--snice-font-weight-semibold, 600);\n  color: var(--snice-color-text, #374151);\n}\n\n.header-center {\n  flex: 1;\n  max-width: 400px;\n  margin: 0 var(--snice-spacing-lg, 2rem);\n}\n\n.nav {\n  grid-area: nav;\n  padding: var(--snice-spacing-md, 1rem) var(--snice-spacing-lg, 2rem);\n  background: var(--snice-color-background, white);\n  border-bottom: 1px solid var(--snice-color-border, #d1d5db);\n}\n\n.sidebar {\n  grid-area: sidebar;\n  background: var(--snice-color-background, white);\n  padding: var(--snice-spacing-lg, 2rem);\n  overflow-y: auto;\n}\n\n.main {\n  grid-area: main;\n  padding: var(--snice-spacing-lg, 2rem);\n  background: var(--snice-color-background-secondary, #f8fafc);\n  overflow-y: auto;\n}\n\n.right-sidebar {\n  grid-area: right-sidebar;\n  background: var(--snice-color-background, white);\n  padding: var(--snice-spacing-lg, 2rem);\n  overflow-y: auto;\n}\n\n/* Responsive */\n@media (max-width: 1024px) {\n  .layout {\n    grid-template-areas: \n      \"header header\"\n      \"nav nav\"\n      \"main main\";\n    grid-template-columns: 1fr;\n  }\n  \n  .sidebar,\n  .right-sidebar {\n    display: none;\n  }\n}\n\n@media (max-width: 768px) {\n  .header {\n    flex-direction: column;\n    gap: var(--snice-spacing-md, 1rem);\n  }\n  \n  .header-center {\n    margin: 0;\n    max-width: none;\n    width: 100%;\n  }\n}";
+var cssContent = ":host{display:block;font-family:var(--snice-font-family, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif)}.layout{display:grid;grid-template-areas:\"header header header\" \"nav nav nav\" \"sidebar main right-sidebar\";grid-template-rows:auto auto 1fr;grid-template-columns:250px 1fr 250px;min-height:100vh;gap:1px;background:var(--snice-color-border,#d1d5db)}.header{grid-area:header;display:flex;align-items:center;justify-content:space-between;padding:var(--snice-spacing-md,1rem) var(--snice-spacing-lg,2rem);background:var(--snice-color-background,#fff);border-bottom:1px solid var(--snice-color-border,#d1d5db)}.header-start h1{margin:0;font-size:var(--snice-font-size-xl, 1.5rem);font-weight:var(--snice-font-weight-semibold,600);color:var(--snice-color-text,#374151)}.header-center{flex:1;max-width:400px;margin:0 var(--snice-spacing-lg,2rem)}.nav{grid-area:nav;padding:var(--snice-spacing-md,1rem) var(--snice-spacing-lg,2rem);background:var(--snice-color-background,#fff);border-bottom:1px solid var(--snice-color-border,#d1d5db)}.sidebar{grid-area:sidebar;background:var(--snice-color-background,#fff);padding:var(--snice-spacing-lg,2rem);overflow-y:auto}.main{grid-area:main;padding:var(--snice-spacing-lg,2rem);background:var(--snice-color-background-secondary,#f8fafc);overflow-y:auto}.right-sidebar{grid-area:right-sidebar;background:var(--snice-color-background,#fff);padding:var(--snice-spacing-lg,2rem);overflow-y:auto}@media (max-width:1024px){.layout{grid-template-areas:\"header header\" \"nav nav\" \"main main\";grid-template-columns:1fr}.right-sidebar,.sidebar{display:none}}@media (max-width:768px){.header{flex-direction:column;gap:var(--snice-spacing-md,1rem)}.header-center{margin:0;max-width:none;width:100%}}";
 
 let SniceLayoutDashboard = (() => {
     let _classDecorators = [element('snice-layout-dashboard')];

package/dist/components/layout/snice-layout-dashboard.js.map

@@ -1 +1 @@
-{"version":3,"file":"snice-layout-dashboard.js","sources":["../../../components/layout/snice-layout-dashboard.css?inline","../../../../components/layout/snice-layout-dashboard.ts"],"sourcesContent":["export default \"/* Dashboard Layout - Complex grid with multiple areas */\\n:host {\\n  display: block;\\n  font-family: var(--snice-font-family, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif);\\n}\\n\\n.layout {\\n  display: grid;\\n  grid-template-areas: \\n    \\\"header header header\\\"\\n    \\\"nav nav nav\\\"\\n    \\\"sidebar main right-sidebar\\\";\\n  grid-template-rows: auto auto 1fr;\\n  grid-template-columns: 250px 1fr 250px;\\n  min-height: 100vh;\\n  gap: 1px;\\n  background: var(--snice-color-border, #d1d5db);\\n}\\n\\n.header {\\n  grid-area: header;\\n  display: flex;\\n  align-items: center;\\n  justify-content: space-between;\\n  padding: var(--snice-spacing-md, 1rem) var(--snice-spacing-lg, 2rem);\\n  background: var(--snice-color-background, white);\\n  border-bottom: 1px solid var(--snice-color-border, #d1d5db);\\n}\\n\\n.header-start h1 {\\n  margin: 0;\\n  font-size: var(--snice-font-size-xl, 1.5rem);\\n  font-weight: var(--snice-font-weight-semibold, 600);\\n  color: var(--snice-color-text, #374151);\\n}\\n\\n.header-center {\\n  flex: 1;\\n  max-width: 400px;\\n  margin: 0 var(--snice-spacing-lg, 2rem);\\n}\\n\\n.nav {\\n  grid-area: nav;\\n  padding: var(--snice-spacing-md, 1rem) var(--snice-spacing-lg, 2rem);\\n  background: var(--snice-color-background, white);\\n  border-bottom: 1px solid var(--snice-color-border, #d1d5db);\\n}\\n\\n.sidebar {\\n  grid-area: sidebar;\\n  background: var(--snice-color-background, white);\\n  padding: var(--snice-spacing-lg, 2rem);\\n  overflow-y: auto;\\n}\\n\\n.main {\\n  grid-area: main;\\n  padding: var(--snice-spacing-lg, 2rem);\\n  background: var(--snice-color-background-secondary, #f8fafc);\\n  overflow-y: auto;\\n}\\n\\n.right-sidebar {\\n  grid-area: right-sidebar;\\n  background: var(--snice-color-background, white);\\n  padding: var(--snice-spacing-lg, 2rem);\\n  overflow-y: auto;\\n}\\n\\n/* Responsive */\\n@media (max-width: 1024px) {\\n  .layout {\\n    grid-template-areas: \\n      \\\"header header\\\"\\n      \\\"nav nav\\\"\\n      \\\"main main\\\";\\n    grid-template-columns: 1fr;\\n  }\\n  \\n  .sidebar,\\n  .right-sidebar {\\n    display: none;\\n  }\\n}\\n\\n@media (max-width: 768px) {\\n  .header {\\n    flex-direction: column;\\n    gap: var(--snice-spacing-md, 1rem);\\n  }\\n  \\n  .header-center {\\n    margin: 0;\\n    max-width: none;\\n    width: 100%;\\n  }\\n}\";",null],"names":[],"mappings":"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"}
+{"version":3,"file":"snice-layout-dashboard.js","sources":["../../../components/layout/snice-layout-dashboard.css?inline","../../../../components/layout/snice-layout-dashboard.ts"],"sourcesContent":["export default \":host{display:block;font-family:var(--snice-font-family, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif)}.layout{display:grid;grid-template-areas:\\\"header header header\\\" \\\"nav nav nav\\\" \\\"sidebar main right-sidebar\\\";grid-template-rows:auto auto 1fr;grid-template-columns:250px 1fr 250px;min-height:100vh;gap:1px;background:var(--snice-color-border,#d1d5db)}.header{grid-area:header;display:flex;align-items:center;justify-content:space-between;padding:var(--snice-spacing-md,1rem) var(--snice-spacing-lg,2rem);background:var(--snice-color-background,#fff);border-bottom:1px solid var(--snice-color-border,#d1d5db)}.header-start h1{margin:0;font-size:var(--snice-font-size-xl, 1.5rem);font-weight:var(--snice-font-weight-semibold,600);color:var(--snice-color-text,#374151)}.header-center{flex:1;max-width:400px;margin:0 var(--snice-spacing-lg,2rem)}.nav{grid-area:nav;padding:var(--snice-spacing-md,1rem) var(--snice-spacing-lg,2rem);background:var(--snice-color-background,#fff);border-bottom:1px solid var(--snice-color-border,#d1d5db)}.sidebar{grid-area:sidebar;background:var(--snice-color-background,#fff);padding:var(--snice-spacing-lg,2rem);overflow-y:auto}.main{grid-area:main;padding:var(--snice-spacing-lg,2rem);background:var(--snice-color-background-secondary,#f8fafc);overflow-y:auto}.right-sidebar{grid-area:right-sidebar;background:var(--snice-color-background,#fff);padding:var(--snice-spacing-lg,2rem);overflow-y:auto}@media (max-width:1024px){.layout{grid-template-areas:\\\"header header\\\" \\\"nav nav\\\" \\\"main main\\\";grid-template-columns:1fr}.right-sidebar,.sidebar{display:none}}@media (max-width:768px){.header{flex-direction:column;gap:var(--snice-spacing-md,1rem)}.header-center{margin:0;max-width:none;width:100%}}\";",null],"names":[],"mappings":"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"}

package/dist/components/layout/snice-layout-fullscreen.js

@@ -1,7 +1,7 @@
 import { __esDecorate, __runInitializers } from 'tslib';
 import { element, property, render, styles, html, css } from 'snice';
 
-var cssContent = "/* Fullscreen Layout - For presentations, media viewers, etc */\n:host {\n  display: block;\n  font-family: var(--snice-font-family, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif);\n}\n\n.layout {\n  position: relative;\n  width: 100vw;\n  height: 100vh;\n  overflow: hidden;\n  background: var(--snice-color-background-dark, #111827);\n}\n\n.background {\n  position: absolute;\n  inset: 0;\n  z-index: 1;\n}\n\n.overlay {\n  position: absolute;\n  inset: 0;\n  z-index: 2;\n  background: rgba(0, 0, 0, 0.5);\n  opacity: 0;\n  transition: opacity var(--snice-transition-normal, 0.25s) ease;\n  pointer-events: none;\n}\n\n:host([overlay]) .overlay {\n  opacity: 1;\n  pointer-events: auto;\n}\n\n.content {\n  position: absolute;\n  inset: 0;\n  z-index: 3;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  padding: var(--snice-spacing-lg, 2rem);\n}\n\n.controls {\n  position: absolute;\n  bottom: 0;\n  left: 0;\n  right: 0;\n  z-index: 4;\n  padding: var(--snice-spacing-lg, 2rem);\n  background: linear-gradient(transparent, rgba(0, 0, 0, 0.8));\n  transform: translateY(100%);\n  transition: transform var(--snice-transition-normal, 0.25s) ease;\n}\n\n:host(:hover) .controls {\n  transform: translateY(0);\n}\n\n/* Media queries for mobile */\n@media (max-width: 768px) {\n  .controls {\n    transform: translateY(0);\n    background: rgba(0, 0, 0, 0.8);\n  }\n  \n  .content {\n    padding: var(--snice-spacing-md, 1rem);\n  }\n}";
+var cssContent = ":host{display:block;font-family:var(--snice-font-family, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif)}.layout{position:relative;width:100vw;height:100vh;overflow:hidden;background:var(--snice-color-background-dark,#111827)}.background{position:absolute;inset:0;z-index:1}.overlay{position:absolute;inset:0;z-index:2;background:rgba(0,0,0,.5);opacity:0;transition:opacity var(--snice-transition-normal, .25s) ease;pointer-events:none}:host([overlay]) .overlay{opacity:1;pointer-events:auto}.content{position:absolute;inset:0;z-index:3;display:flex;align-items:center;justify-content:center;padding:var(--snice-spacing-lg,2rem)}.controls{position:absolute;bottom:0;left:0;right:0;z-index:4;padding:var(--snice-spacing-lg,2rem);background:linear-gradient(transparent,rgba(0,0,0,.8));transform:translateY(100%);transition:transform var(--snice-transition-normal, .25s) ease}:host(:hover) .controls{transform:translateY(0)}@media (max-width:768px){.controls{transform:translateY(0);background:rgba(0,0,0,.8)}.content{padding:var(--snice-spacing-md,1rem)}}";
 
 let SniceLayoutFullscreen = (() => {
     let _classDecorators = [element('snice-layout-fullscreen')];

package/dist/components/layout/snice-layout-fullscreen.js.map

@@ -1 +1 @@
-{"version":3,"file":"snice-layout-fullscreen.js","sources":["../../../components/layout/snice-layout-fullscreen.css?inline","../../../../components/layout/snice-layout-fullscreen.ts"],"sourcesContent":["export default \"/* Fullscreen Layout - For presentations, media viewers, etc */\\n:host {\\n  display: block;\\n  font-family: var(--snice-font-family, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif);\\n}\\n\\n.layout {\\n  position: relative;\\n  width: 100vw;\\n  height: 100vh;\\n  overflow: hidden;\\n  background: var(--snice-color-background-dark, #111827);\\n}\\n\\n.background {\\n  position: absolute;\\n  inset: 0;\\n  z-index: 1;\\n}\\n\\n.overlay {\\n  position: absolute;\\n  inset: 0;\\n  z-index: 2;\\n  background: rgba(0, 0, 0, 0.5);\\n  opacity: 0;\\n  transition: opacity var(--snice-transition-normal, 0.25s) ease;\\n  pointer-events: none;\\n}\\n\\n:host([overlay]) .overlay {\\n  opacity: 1;\\n  pointer-events: auto;\\n}\\n\\n.content {\\n  position: absolute;\\n  inset: 0;\\n  z-index: 3;\\n  display: flex;\\n  align-items: center;\\n  justify-content: center;\\n  padding: var(--snice-spacing-lg, 2rem);\\n}\\n\\n.controls {\\n  position: absolute;\\n  bottom: 0;\\n  left: 0;\\n  right: 0;\\n  z-index: 4;\\n  padding: var(--snice-spacing-lg, 2rem);\\n  background: linear-gradient(transparent, rgba(0, 0, 0, 0.8));\\n  transform: translateY(100%);\\n  transition: transform var(--snice-transition-normal, 0.25s) ease;\\n}\\n\\n:host(:hover) .controls {\\n  transform: translateY(0);\\n}\\n\\n/* Media queries for mobile */\\n@media (max-width: 768px) {\\n  .controls {\\n    transform: translateY(0);\\n    background: rgba(0, 0, 0, 0.8);\\n  }\\n  \\n  .content {\\n    padding: var(--snice-spacing-md, 1rem);\\n  }\\n}\";",null],"names":[],"mappings":";;;AAAA,iBAAe,28CAA28C;;ICI78C,qBAAqB,GAAA,CAAA,MAAA;4BADjC,OAAO,CAAC,yBAAyB,CAAC,CAAA;;;;sBACQ,WAAW;;;;;;;AAAnB,KAAA,cAAQ,WAAW,CAAA;;;;AACnD,YAAA,mBAAA,GAAA,CAAA,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,GAAI,CAAC,CAAA;AAG7B,YAAA,yBAAA,GAAA,CAAA,MAAM,EAAE,CAAA;AAuBR,YAAA,2BAAA,GAAA,CAAA,MAAM,EAAE,CAAA;AAtBT,YAAA,YAAA,CAAA,IAAA,EAAA,IAAA,EAAA,yBAAA,EAAA,EAAA,IAAA,EAAA,QAAA,EAAA,IAAA,EAAA,eAAA,EAAA,MAAA,EAAA,KAAA,EAAA,OAAA,EAAA,KAAA,EAAA,MAAA,EAAA,EAAA,GAAA,EAAA,GAAA,IAAA,eAAA,IAAA,GAAA,EAAA,GAAA,EAAA,GAAA,IAAA,GAAA,CAAA,aAAa,EAAA,EAAA,QAAA,EAAA,SAAA,EAAA,EAAA,IAAA,EAAA,0BAAA,CAAA;AAuBb,YAAA,YAAA,CAAA,IAAA,EAAA,IAAA,EAAA,2BAAA,EAAA,EAAA,IAAA,EAAA,QAAA,EAAA,IAAA,EAAA,iBAAA,EAAA,MAAA,EAAA,KAAA,EAAA,OAAA,EAAA,KAAA,EAAA,MAAA,EAAA,EAAA,GAAA,EAAA,GAAA,IAAA,iBAAA,IAAA,GAAA,EAAA,GAAA,EAAA,GAAA,IAAA,GAAA,CAAA,eAAe,EAAA,EAAA,QAAA,EAAA,SAAA,EAAA,EAAA,IAAA,EAAA,0BAAA,CAAA;YA1Bf,YAAA,CAAA,IAAA,EAAA,IAAA,EAAA,mBAAA,EAAA,EAAA,IAAA,EAAA,OAAA,EAAA,IAAA,EAAA,SAAA,EAAA,MAAA,EAAA,KAAA,EAAA,OAAA,EAAA,KAAA,EAAA,MAAA,EAAA,EAAA,GAAA,EAAA,GAAA,IAAA,SAAA,IAAA,GAAA,EAAA,GAAA,EAAA,GAAA,IAAA,GAAA,CAAA,OAAO,EAAA,GAAA,EAAA,CAAA,GAAA,EAAA,KAAA,KAAA,EAAA,GAAA,CAAP,OAAO,GAAA,KAAA,CAAA,CAAA,CAAA,EAAA,EAAA,QAAA,EAAA,SAAA,EAAA,EAAA,qBAAA,EAAA,0BAAA,CAAA;YAFT,YAAA,CAAA,IAAA,EAAA,gBAAA,GAAA,EAAA,KAAA,EAAA,UAAA,EAAA,EAAA,gBAAA,EAAA,EAAA,IAAA,EAAA,OAAA,EAAA,IAAA,EAAA,UAAA,CAAA,IAAA,EAAA,QAAA,EAAA,SAAA,EAAA,EAAA,IAAA,EAAA,uBAAA,CAAA;;;YAAa,iBAAA,CAAA,UAAA,EAAA,uBAAA,CAAA;;QAKX,aAAa,GAAA;YACX,OAAO,IAAI,UAAQ;;;;;;;;;;;;;;;;;;KAkBlB;QACH;QAGA,eAAe,GAAA;AACb,YAAA,OAAO,GAAG,SAAO,CAAA,EAAG,UAAU,EAAE;QAClC;;;AA5BA,YAAA,IAAA,CAAA,OAAO,IAFI,iBAAA,CAAA,IAAA,EAAA,0BAAA,CAAqB,EAAA,iBAAA,CAAA,IAAA,EAAA,qBAAA,EAEtB,KAAK,CAAA,CAAA;;;;;;;;;"}
+{"version":3,"file":"snice-layout-fullscreen.js","sources":["../../../components/layout/snice-layout-fullscreen.css?inline","../../../../components/layout/snice-layout-fullscreen.ts"],"sourcesContent":["export default \":host{display:block;font-family:var(--snice-font-family, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif)}.layout{position:relative;width:100vw;height:100vh;overflow:hidden;background:var(--snice-color-background-dark,#111827)}.background{position:absolute;inset:0;z-index:1}.overlay{position:absolute;inset:0;z-index:2;background:rgba(0,0,0,.5);opacity:0;transition:opacity var(--snice-transition-normal, .25s) ease;pointer-events:none}:host([overlay]) .overlay{opacity:1;pointer-events:auto}.content{position:absolute;inset:0;z-index:3;display:flex;align-items:center;justify-content:center;padding:var(--snice-spacing-lg,2rem)}.controls{position:absolute;bottom:0;left:0;right:0;z-index:4;padding:var(--snice-spacing-lg,2rem);background:linear-gradient(transparent,rgba(0,0,0,.8));transform:translateY(100%);transition:transform var(--snice-transition-normal, .25s) ease}:host(:hover) .controls{transform:translateY(0)}@media (max-width:768px){.controls{transform:translateY(0);background:rgba(0,0,0,.8)}.content{padding:var(--snice-spacing-md,1rem)}}\";",null],"names":[],"mappings":";;;AAAA,iBAAe,kjCAAkjC;;ICIpjC,qBAAqB,GAAA,CAAA,MAAA;4BADjC,OAAO,CAAC,yBAAyB,CAAC,CAAA;;;;sBACQ,WAAW;;;;;;;AAAnB,KAAA,cAAQ,WAAW,CAAA;;;;AACnD,YAAA,mBAAA,GAAA,CAAA,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,GAAI,CAAC,CAAA;AAG7B,YAAA,yBAAA,GAAA,CAAA,MAAM,EAAE,CAAA;AAuBR,YAAA,2BAAA,GAAA,CAAA,MAAM,EAAE,CAAA;AAtBT,YAAA,YAAA,CAAA,IAAA,EAAA,IAAA,EAAA,yBAAA,EAAA,EAAA,IAAA,EAAA,QAAA,EAAA,IAAA,EAAA,eAAA,EAAA,MAAA,EAAA,KAAA,EAAA,OAAA,EAAA,KAAA,EAAA,MAAA,EAAA,EAAA,GAAA,EAAA,GAAA,IAAA,eAAA,IAAA,GAAA,EAAA,GAAA,EAAA,GAAA,IAAA,GAAA,CAAA,aAAa,EAAA,EAAA,QAAA,EAAA,SAAA,EAAA,EAAA,IAAA,EAAA,0BAAA,CAAA;AAuBb,YAAA,YAAA,CAAA,IAAA,EAAA,IAAA,EAAA,2BAAA,EAAA,EAAA,IAAA,EAAA,QAAA,EAAA,IAAA,EAAA,iBAAA,EAAA,MAAA,EAAA,KAAA,EAAA,OAAA,EAAA,KAAA,EAAA,MAAA,EAAA,EAAA,GAAA,EAAA,GAAA,IAAA,iBAAA,IAAA,GAAA,EAAA,GAAA,EAAA,GAAA,IAAA,GAAA,CAAA,eAAe,EAAA,EAAA,QAAA,EAAA,SAAA,EAAA,EAAA,IAAA,EAAA,0BAAA,CAAA;YA1Bf,YAAA,CAAA,IAAA,EAAA,IAAA,EAAA,mBAAA,EAAA,EAAA,IAAA,EAAA,OAAA,EAAA,IAAA,EAAA,SAAA,EAAA,MAAA,EAAA,KAAA,EAAA,OAAA,EAAA,KAAA,EAAA,MAAA,EAAA,EAAA,GAAA,EAAA,GAAA,IAAA,SAAA,IAAA,GAAA,EAAA,GAAA,EAAA,GAAA,IAAA,GAAA,CAAA,OAAO,EAAA,GAAA,EAAA,CAAA,GAAA,EAAA,KAAA,KAAA,EAAA,GAAA,CAAP,OAAO,GAAA,KAAA,CAAA,CAAA,CAAA,EAAA,EAAA,QAAA,EAAA,SAAA,EAAA,EAAA,qBAAA,EAAA,0BAAA,CAAA;YAFT,YAAA,CAAA,IAAA,EAAA,gBAAA,GAAA,EAAA,KAAA,EAAA,UAAA,EAAA,EAAA,gBAAA,EAAA,EAAA,IAAA,EAAA,OAAA,EAAA,IAAA,EAAA,UAAA,CAAA,IAAA,EAAA,QAAA,EAAA,SAAA,EAAA,EAAA,IAAA,EAAA,uBAAA,CAAA;;;YAAa,iBAAA,CAAA,UAAA,EAAA,uBAAA,CAAA;;QAKX,aAAa,GAAA;YACX,OAAO,IAAI,UAAQ;;;;;;;;;;;;;;;;;;KAkBlB;QACH;QAGA,eAAe,GAAA;AACb,YAAA,OAAO,GAAG,SAAO,CAAA,EAAG,UAAU,EAAE;QAClC;;;AA5BA,YAAA,IAAA,CAAA,OAAO,IAFI,iBAAA,CAAA,IAAA,EAAA,0BAAA,CAAqB,EAAA,iBAAA,CAAA,IAAA,EAAA,qBAAA,EAEtB,KAAK,CAAA,CAAA;;;;;;;;;"}

package/dist/components/layout/snice-layout-landing.js

@@ -2,7 +2,7 @@ import { __runInitializers, __esDecorate } from 'tslib';
 import { element, query, property, render, styles, html, css } from 'snice';
 import '../nav/snice-nav.js';
 
-var cssContent = "/* Landing Page Layout */\n:host {\n  display: block;\n  font-family: var(--snice-font-family, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif);\n}\n\n.layout {\n  min-height: 100vh;\n  display: flex;\n  flex-direction: column;\n}\n\n.container {\n  max-width: 1200px;\n  margin: 0 auto;\n  padding: 0 var(--snice-spacing-lg, 2rem);\n}\n\n.header {\n  background: var(--snice-color-background, white);\n  border-bottom: 1px solid var(--snice-color-border, #d1d5db);\n  position: sticky;\n  top: 0;\n  z-index: 100;\n}\n\n.header .container {\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  padding-top: var(--snice-spacing-md, 1rem);\n  padding-bottom: var(--snice-spacing-md, 1rem);\n}\n\n.brand h1 {\n  margin: 0;\n  font-size: var(--snice-font-size-xl, 1.5rem);\n  font-weight: var(--snice-font-weight-bold, 700);\n  color: var(--snice-color-text, #374151);\n}\n\n.nav {\n  display: flex;\n  gap: var(--snice-spacing-lg, 2rem);\n}\n\n.nav ::slotted(a) {\n  text-decoration: none;\n  color: var(--snice-color-text-secondary, #6b7280);\n  font-weight: var(--snice-font-weight-medium, 500);\n  transition: color var(--snice-transition-fast, 0.15s) ease;\n}\n\n.nav ::slotted(a:hover) {\n  color: var(--snice-color-primary, #3b82f6);\n}\n\n.main {\n  flex: 1;\n}\n\n.hero {\n  background: var(--snice-color-background-secondary, #f8fafc);\n  padding: var(--snice-spacing-2xl, 4rem) 0;\n}\n\n.content {\n  background: var(--snice-color-background, white);\n}\n\n.footer {\n  background: var(--snice-color-background-tertiary, #f1f5f9);\n  border-top: 1px solid var(--snice-color-border, #d1d5db);\n  padding: var(--snice-spacing-xl, 3rem) 0;\n  margin-top: auto;\n}\n\n/* Mobile responsive */\n@media (max-width: 768px) {\n  .header .container {\n    flex-direction: column;\n    gap: var(--snice-spacing-md, 1rem);\n  }\n  \n  .nav {\n    gap: var(--snice-spacing-md, 1rem);\n  }\n  \n  .hero {\n    padding: var(--snice-spacing-xl, 3rem) 0;\n  }\n}";
+var cssContent = ":host{display:block;font-family:var(--snice-font-family, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif)}.layout{min-height:100vh;display:flex;flex-direction:column}.container{max-width:1200px;margin:0 auto;padding:0 var(--snice-spacing-lg,2rem)}.header{background:var(--snice-color-background,#fff);border-bottom:1px solid var(--snice-color-border,#d1d5db);position:sticky;top:0;z-index:100}.header .container{display:flex;align-items:center;justify-content:space-between;padding-top:var(--snice-spacing-md,1rem);padding-bottom:var(--snice-spacing-md,1rem)}.brand h1{margin:0;font-size:var(--snice-font-size-xl, 1.5rem);font-weight:var(--snice-font-weight-bold,700);color:var(--snice-color-text,#374151)}.nav{display:flex;gap:var(--snice-spacing-lg,2rem)}.nav ::slotted(a){text-decoration:none;color:var(--snice-color-text-secondary,#6b7280);font-weight:var(--snice-font-weight-medium,500);transition:color var(--snice-transition-fast, .15s) ease}.nav ::slotted(a:hover){color:var(--snice-color-primary,#3b82f6)}.main{flex:1}.hero{background:var(--snice-color-background-secondary,#f8fafc);padding:var(--snice-spacing-2xl,4rem) 0}.content{background:var(--snice-color-background,#fff)}.footer{background:var(--snice-color-background-tertiary,#f1f5f9);border-top:1px solid var(--snice-color-border,#d1d5db);padding:var(--snice-spacing-xl,3rem) 0;margin-top:auto}@media (max-width:768px){.header .container{flex-direction:column;gap:var(--snice-spacing-md,1rem)}.nav{gap:var(--snice-spacing-md,1rem)}.hero{padding:var(--snice-spacing-xl,3rem) 0}}";
 
 let SniceLayoutLanding = (() => {
     let _classDecorators = [element('snice-layout-landing')];

package/dist/components/layout/snice-layout-landing.js.map

@@ -1 +1 @@
-{"version":3,"file":"snice-layout-landing.js","sources":["../../../components/layout/snice-layout-landing.css?inline","../../../../components/layout/snice-layout-landing.ts"],"sourcesContent":["export default \"/* Landing Page Layout */\\n:host {\\n  display: block;\\n  font-family: var(--snice-font-family, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif);\\n}\\n\\n.layout {\\n  min-height: 100vh;\\n  display: flex;\\n  flex-direction: column;\\n}\\n\\n.container {\\n  max-width: 1200px;\\n  margin: 0 auto;\\n  padding: 0 var(--snice-spacing-lg, 2rem);\\n}\\n\\n.header {\\n  background: var(--snice-color-background, white);\\n  border-bottom: 1px solid var(--snice-color-border, #d1d5db);\\n  position: sticky;\\n  top: 0;\\n  z-index: 100;\\n}\\n\\n.header .container {\\n  display: flex;\\n  align-items: center;\\n  justify-content: space-between;\\n  padding-top: var(--snice-spacing-md, 1rem);\\n  padding-bottom: var(--snice-spacing-md, 1rem);\\n}\\n\\n.brand h1 {\\n  margin: 0;\\n  font-size: var(--snice-font-size-xl, 1.5rem);\\n  font-weight: var(--snice-font-weight-bold, 700);\\n  color: var(--snice-color-text, #374151);\\n}\\n\\n.nav {\\n  display: flex;\\n  gap: var(--snice-spacing-lg, 2rem);\\n}\\n\\n.nav ::slotted(a) {\\n  text-decoration: none;\\n  color: var(--snice-color-text-secondary, #6b7280);\\n  font-weight: var(--snice-font-weight-medium, 500);\\n  transition: color var(--snice-transition-fast, 0.15s) ease;\\n}\\n\\n.nav ::slotted(a:hover) {\\n  color: var(--snice-color-primary, #3b82f6);\\n}\\n\\n.main {\\n  flex: 1;\\n}\\n\\n.hero {\\n  background: var(--snice-color-background-secondary, #f8fafc);\\n  padding: var(--snice-spacing-2xl, 4rem) 0;\\n}\\n\\n.content {\\n  background: var(--snice-color-background, white);\\n}\\n\\n.footer {\\n  background: var(--snice-color-background-tertiary, #f1f5f9);\\n  border-top: 1px solid var(--snice-color-border, #d1d5db);\\n  padding: var(--snice-spacing-xl, 3rem) 0;\\n  margin-top: auto;\\n}\\n\\n/* Mobile responsive */\\n@media (max-width: 768px) {\\n  .header .container {\\n    flex-direction: column;\\n    gap: var(--snice-spacing-md, 1rem);\\n  }\\n  \\n  .nav {\\n    gap: var(--snice-spacing-md, 1rem);\\n  }\\n  \\n  .hero {\\n    padding: var(--snice-spacing-xl, 3rem) 0;\\n  }\\n}\";",null],"names":[],"mappings":";;;;AAAA,iBAAe,g9DAAg9D;;ICOl9D,kBAAkB,GAAA,CAAA,MAAA;4BAD9B,OAAO,CAAC,sBAAsB,CAAC,CAAA;;;;sBACQ,WAAW;;;;;;;;;;AAAnB,KAAA,cAAQ,WAAW,CAAA;;;;YAEjD,IAAA,CAAA,UAAU,IAFC,mDAAkB,EAAA,iBAAA,CAAA,IAAA,EAAA,wBAAA,EAAA,MAAA,CAAA,CAAA;YAK7B,IAAA,CAAA,MAAM,IAAA,iBAAA,CAAA,IAAA,EAAA,6BAAA,CAAA,EAAA,iBAAA,CAAA,IAAA,EAAA,oBAAA,EAAG,KAAK,CAAA,CAAA;YAEN,IAAA,CAAA,QAAQ,IAAA,iBAAA,CAAA,IAAA,EAAA,yBAAA,CAAA,EAAc,EAAE,CAAA;YACxB,IAAA,CAAA,YAAY,GAAG,EAAE;QAgE3B;;;sCAvEG,KAAK,CAAC,WAAW,CAAC,CAAA;kCAGlB,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,SAAS,EAAE,SAAS,EAAE,CAAC,CAAA;AAMjD,YAAA,yBAAA,GAAA,CAAA,MAAM,EAAE,CAAA;AA4CR,YAAA,2BAAA,GAAA,CAAA,MAAM,EAAE,CAAA;AA3CT,YAAA,YAAA,CAAA,IAAA,EAAA,IAAA,EAAA,yBAAA,EAAA,EAAA,IAAA,EAAA,QAAA,EAAA,IAAA,EAAA,eAAA,EAAA,MAAA,EAAA,KAAA,EAAA,OAAA,EAAA,KAAA,EAAA,MAAA,EAAA,EAAA,GAAA,EAAA,GAAA,IAAA,eAAA,IAAA,GAAA,EAAA,GAAA,EAAA,GAAA,IAAA,GAAA,CAAA,aAAa,EAAA,EAAA,QAAA,EAAA,SAAA,EAAA,EAAA,IAAA,EAAA,0BAAA,CAAA;AA4Cb,YAAA,YAAA,CAAA,IAAA,EAAA,IAAA,EAAA,2BAAA,EAAA,EAAA,IAAA,EAAA,QAAA,EAAA,IAAA,EAAA,iBAAA,EAAA,MAAA,EAAA,KAAA,EAAA,OAAA,EAAA,KAAA,EAAA,MAAA,EAAA,EAAA,GAAA,EAAA,GAAA,IAAA,iBAAA,IAAA,GAAA,EAAA,GAAA,EAAA,GAAA,IAAA,GAAA,CAAA,eAAe,EAAA,EAAA,QAAA,EAAA,SAAA,EAAA,EAAA,IAAA,EAAA,0BAAA,CAAA;YArDf,YAAA,CAAA,IAAA,EAAA,IAAA,EAAA,sBAAA,EAAA,EAAA,IAAA,EAAA,OAAA,EAAA,IAAA,EAAA,YAAA,EAAA,MAAA,EAAA,KAAA,EAAA,OAAA,EAAA,KAAA,EAAA,MAAA,EAAA,EAAA,GAAA,EAAA,GAAA,IAAA,YAAA,IAAA,GAAA,EAAA,GAAA,EAAA,GAAA,IAAA,GAAA,CAAA,UAAU,EAAA,GAAA,EAAA,CAAA,GAAA,EAAA,KAAA,KAAA,EAAA,GAAA,CAAV,UAAU,GAAA,KAAA,CAAA,CAAA,CAAA,EAAA,EAAA,QAAA,EAAA,SAAA,EAAA,EAAA,wBAAA,EAAA,6BAAA,CAAA;YAGV,YAAA,CAAA,IAAA,EAAA,IAAA,EAAA,kBAAA,EAAA,EAAA,IAAA,EAAA,OAAA,EAAA,IAAA,EAAA,QAAA,EAAA,MAAA,EAAA,KAAA,EAAA,OAAA,EAAA,KAAA,EAAA,MAAA,EAAA,EAAA,GAAA,EAAA,GAAA,IAAA,QAAA,IAAA,GAAA,EAAA,GAAA,EAAA,GAAA,IAAA,GAAA,CAAA,MAAM,EAAA,GAAA,EAAA,CAAA,GAAA,EAAA,KAAA,KAAA,EAAA,GAAA,CAAN,MAAM,GAAA,KAAA,CAAA,CAAA,CAAA,EAAA,EAAA,QAAA,EAAA,SAAA,EAAA,EAAA,oBAAA,EAAA,yBAAA,CAAA;YALR,YAAA,CAAA,IAAA,EAAA,gBAAA,GAAA,EAAA,KAAA,EAAA,UAAA,EAAA,EAAA,gBAAA,EAAA,EAAA,IAAA,EAAA,OAAA,EAAA,IAAA,EAAA,UAAA,CAAA,IAAA,EAAA,QAAA,EAAA,SAAA,EAAA,EAAA,IAAA,EAAA,uBAAA,CAAA;;;YAAa,iBAAA,CAAA,UAAA,EAAA,uBAAA,CAAA;;QAWX,aAAa,GAAA;YACX,OAAO,IAAI,UAAQ;;;;;;;;;AASL,gBAAA,EAAA,IAAI,CAAC,MAAM,CAAA;;;kBAGX,CAAC,IAAI,CAAC,MAAM,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;KA2BzB;QACH;QAGA,eAAe,GAAA;AACb,YAAA,OAAO,GAAG,SAAO,CAAA,EAAG,UAAU,EAAE;QAClC;AAEA,QAAA,MAAM,CAAC,UAAsB,EAAE,QAAmB,EAAE,YAAoB,EAAE,WAAwB,EAAA;AAChG,YAAA,IAAI,CAAC,QAAQ,GAAG,QAAQ;AACxB,YAAA,IAAI,CAAC,YAAY,GAAG,YAAY;AAChC,YAAA,IAAI,CAAC,MAAM,GAAG,IAAI;AAElB,YAAA,IAAI,CAAC,SAAS,CAAC,UAAU,EAAE,WAAW,CAAC;QACzC;QAEA,SAAS,CAAC,UAAuB,EAAE,WAAyB,EAAA;AAC1D,YAAA,IAAI,IAAI,CAAC,UAAU,EAAE;AACnB,gBAAA,IAAI,CAAC,UAAU,CAAC,MAAM,CAAC,IAAI,CAAC,QAAQ,EAAE,UAAU,EAAE,IAAI,CAAC,YAAY,EAAE,WAAW,CAAC;YACnF;QACF;;;;;;;"}
+{"version":3,"file":"snice-layout-landing.js","sources":["../../../components/layout/snice-layout-landing.css?inline","../../../../components/layout/snice-layout-landing.ts"],"sourcesContent":["export default \":host{display:block;font-family:var(--snice-font-family, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif)}.layout{min-height:100vh;display:flex;flex-direction:column}.container{max-width:1200px;margin:0 auto;padding:0 var(--snice-spacing-lg,2rem)}.header{background:var(--snice-color-background,#fff);border-bottom:1px solid var(--snice-color-border,#d1d5db);position:sticky;top:0;z-index:100}.header .container{display:flex;align-items:center;justify-content:space-between;padding-top:var(--snice-spacing-md,1rem);padding-bottom:var(--snice-spacing-md,1rem)}.brand h1{margin:0;font-size:var(--snice-font-size-xl, 1.5rem);font-weight:var(--snice-font-weight-bold,700);color:var(--snice-color-text,#374151)}.nav{display:flex;gap:var(--snice-spacing-lg,2rem)}.nav ::slotted(a){text-decoration:none;color:var(--snice-color-text-secondary,#6b7280);font-weight:var(--snice-font-weight-medium,500);transition:color var(--snice-transition-fast, .15s) ease}.nav ::slotted(a:hover){color:var(--snice-color-primary,#3b82f6)}.main{flex:1}.hero{background:var(--snice-color-background-secondary,#f8fafc);padding:var(--snice-spacing-2xl,4rem) 0}.content{background:var(--snice-color-background,#fff)}.footer{background:var(--snice-color-background-tertiary,#f1f5f9);border-top:1px solid var(--snice-color-border,#d1d5db);padding:var(--snice-spacing-xl,3rem) 0;margin-top:auto}@media (max-width:768px){.header .container{flex-direction:column;gap:var(--snice-spacing-md,1rem)}.nav{gap:var(--snice-spacing-md,1rem)}.hero{padding:var(--snice-spacing-xl,3rem) 0}}\";",null],"names":[],"mappings":"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"}

package/dist/components/layout/snice-layout-minimal.js

@@ -1,7 +1,7 @@
 import { __esDecorate, __runInitializers } from 'tslib';
 import { element, render, styles, html, css } from 'snice';
 
-var cssContent = "/* Minimal Layout - Just content */\n:host {\n  display: block;\n  font-family: var(--snice-font-family, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif);\n}\n\n.layout {\n  min-height: 100vh;\n  display: flex;\n  flex-direction: column;\n}\n\n.main {\n  flex: 1;\n  background: var(--snice-color-background, white);\n}";
+var cssContent = ":host{display:block;font-family:var(--snice-font-family, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif)}.layout{min-height:100vh;display:flex;flex-direction:column}.main{flex:1;background:var(--snice-color-background,#fff)}";
 
 let SniceLayoutMinimal = (() => {
     let _classDecorators = [element('snice-layout-minimal')];

package/dist/components/layout/snice-layout-minimal.js.map

@@ -1 +1 @@
-{"version":3,"file":"snice-layout-minimal.js","sources":["../../../components/layout/snice-layout-minimal.css?inline","../../../../components/layout/snice-layout-minimal.ts"],"sourcesContent":["export default \"/* Minimal Layout - Just content */\\n:host {\\n  display: block;\\n  font-family: var(--snice-font-family, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif);\\n}\\n\\n.layout {\\n  min-height: 100vh;\\n  display: flex;\\n  flex-direction: column;\\n}\\n\\n.main {\\n  flex: 1;\\n  background: var(--snice-color-background, white);\\n}\";",null],"names":[],"mappings":";;;AAAA,iBAAe,mVAAmV;;ICIrV,kBAAkB,GAAA,CAAA,MAAA;4BAD9B,OAAO,CAAC,sBAAsB,CAAC,CAAA;;;;sBACQ,WAAW;;;;AAAnB,KAAA,cAAQ,WAAW,CAAA;;;;AAChD,YAAA,yBAAA,GAAA,CAAA,MAAM,EAAE,CAAA;AAWR,YAAA,2BAAA,GAAA,CAAA,MAAM,EAAE,CAAA;AAVT,YAAA,YAAA,CAAA,IAAA,EAAA,IAAA,EAAA,yBAAA,EAAA,EAAA,IAAA,EAAA,QAAA,EAAA,IAAA,EAAA,eAAA,EAAA,MAAA,EAAA,KAAA,EAAA,OAAA,EAAA,KAAA,EAAA,MAAA,EAAA,EAAA,GAAA,EAAA,GAAA,IAAA,eAAA,IAAA,GAAA,EAAA,GAAA,EAAA,GAAA,IAAA,GAAA,CAAA,aAAa,EAAA,EAAA,QAAA,EAAA,SAAA,EAAA,EAAA,IAAA,EAAA,0BAAA,CAAA;AAWb,YAAA,YAAA,CAAA,IAAA,EAAA,IAAA,EAAA,2BAAA,EAAA,EAAA,IAAA,EAAA,QAAA,EAAA,IAAA,EAAA,iBAAA,EAAA,MAAA,EAAA,KAAA,EAAA,OAAA,EAAA,KAAA,EAAA,MAAA,EAAA,EAAA,GAAA,EAAA,GAAA,IAAA,iBAAA,IAAA,GAAA,EAAA,GAAA,EAAA,GAAA,IAAA,GAAA,CAAA,eAAe,EAAA,EAAA,QAAA,EAAA,SAAA,EAAA,EAAA,IAAA,EAAA,0BAAA,CAAA;YAbjB,YAAA,CAAA,IAAA,EAAA,gBAAA,GAAA,EAAA,KAAA,EAAA,UAAA,EAAA,EAAA,gBAAA,EAAA,EAAA,IAAA,EAAA,OAAA,EAAA,IAAA,EAAA,UAAA,CAAA,IAAA,EAAA,QAAA,EAAA,SAAA,EAAA,EAAA,IAAA,EAAA,uBAAA,CAAA;;;YAAa,iBAAA,CAAA,UAAA,EAAA,uBAAA,CAAA;;QAEX,aAAa,GAAA;YACX,OAAO,IAAI,UAAQ;;;;;;KAMlB;QACH;QAGA,eAAe,GAAA;AACb,YAAA,OAAO,GAAG,SAAO,CAAA,EAAG,UAAU,EAAE;QAClC;;;YAfW,iBAAA,CAAA,IAAA,EAAA,0BAAA,CAAkB;;;;;;;;"}
+{"version":3,"file":"snice-layout-minimal.js","sources":["../../../components/layout/snice-layout-minimal.css?inline","../../../../components/layout/snice-layout-minimal.ts"],"sourcesContent":["export default \":host{display:block;font-family:var(--snice-font-family, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif)}.layout{min-height:100vh;display:flex;flex-direction:column}.main{flex:1;background:var(--snice-color-background,#fff)}\";",null],"names":[],"mappings":";;;AAAA,iBAAe,qPAAqP;;ICIvP,kBAAkB,GAAA,CAAA,MAAA;4BAD9B,OAAO,CAAC,sBAAsB,CAAC,CAAA;;;;sBACQ,WAAW;;;;AAAnB,KAAA,cAAQ,WAAW,CAAA;;;;AAChD,YAAA,yBAAA,GAAA,CAAA,MAAM,EAAE,CAAA;AAWR,YAAA,2BAAA,GAAA,CAAA,MAAM,EAAE,CAAA;AAVT,YAAA,YAAA,CAAA,IAAA,EAAA,IAAA,EAAA,yBAAA,EAAA,EAAA,IAAA,EAAA,QAAA,EAAA,IAAA,EAAA,eAAA,EAAA,MAAA,EAAA,KAAA,EAAA,OAAA,EAAA,KAAA,EAAA,MAAA,EAAA,EAAA,GAAA,EAAA,GAAA,IAAA,eAAA,IAAA,GAAA,EAAA,GAAA,EAAA,GAAA,IAAA,GAAA,CAAA,aAAa,EAAA,EAAA,QAAA,EAAA,SAAA,EAAA,EAAA,IAAA,EAAA,0BAAA,CAAA;AAWb,YAAA,YAAA,CAAA,IAAA,EAAA,IAAA,EAAA,2BAAA,EAAA,EAAA,IAAA,EAAA,QAAA,EAAA,IAAA,EAAA,iBAAA,EAAA,MAAA,EAAA,KAAA,EAAA,OAAA,EAAA,KAAA,EAAA,MAAA,EAAA,EAAA,GAAA,EAAA,GAAA,IAAA,iBAAA,IAAA,GAAA,EAAA,GAAA,EAAA,GAAA,IAAA,GAAA,CAAA,eAAe,EAAA,EAAA,QAAA,EAAA,SAAA,EAAA,EAAA,IAAA,EAAA,0BAAA,CAAA;YAbjB,YAAA,CAAA,IAAA,EAAA,gBAAA,GAAA,EAAA,KAAA,EAAA,UAAA,EAAA,EAAA,gBAAA,EAAA,EAAA,IAAA,EAAA,OAAA,EAAA,IAAA,EAAA,UAAA,CAAA,IAAA,EAAA,QAAA,EAAA,SAAA,EAAA,EAAA,IAAA,EAAA,uBAAA,CAAA;;;YAAa,iBAAA,CAAA,UAAA,EAAA,uBAAA,CAAA;;QAEX,aAAa,GAAA;YACX,OAAO,IAAI,UAAQ;;;;;;KAMlB;QACH;QAGA,eAAe,GAAA;AACb,YAAA,OAAO,GAAG,SAAO,CAAA,EAAG,UAAU,EAAE;QAClC;;;YAfW,iBAAA,CAAA,IAAA,EAAA,0BAAA,CAAkB;;;;;;;;"}

package/dist/components/layout/snice-layout-sidebar.js

@@ -3,7 +3,7 @@ import { element, property, query, render, styles, ready, html, css } from 'snic
 import '../drawer/snice-drawer.js';
 import '../nav/snice-nav.js';
 
-var cssContent = "/* Sidebar Layout with full-width header */\n:host {\n  display: block;\n  font-family: var(--snice-font-family, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif);\n}\n\n.layout {\n  display: grid;\n  grid-template-rows: auto 1fr auto;\n  min-height: 100vh;\n}\n\n/* Header spans full width */\n.header {\n  display: flex;\n  align-items: center;\n  gap: var(--snice-spacing-md, 1rem);\n  padding: var(--snice-spacing-md, 1rem) var(--snice-spacing-lg, 1.25rem);\n  background: var(--snice-color-background, white);\n  border-bottom: 1px solid var(--snice-color-border, #e5e7eb);\n  z-index: 10;\n}\n\n.header-brand {\n  display: flex;\n  align-items: center;\n}\n\n.header-brand h2 {\n  margin: 0;\n  font-size: var(--snice-font-size-lg, 1.125rem);\n  font-weight: var(--snice-font-weight-semibold, 600);\n  color: var(--snice-color-text, #111827);\n  white-space: nowrap;\n  overflow: hidden;\n  text-overflow: ellipsis;\n}\n\n.sidebar-toggle {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  width: var(--snice-size-control-md, 2rem);\n  height: var(--snice-size-control-md, 2rem);\n  background: none;\n  border: none;\n  color: var(--snice-color-text-secondary, #6b7280);\n  cursor: pointer;\n  padding: var(--snice-spacing-xs, 0.5rem);\n  border-radius: var(--snice-border-radius-md, 6px);\n  transition: all var(--snice-transition-fast, 150ms) ease;\n}\n\n.sidebar-toggle:hover {\n  background: var(--snice-color-primary, rgb(59 130 246));\n  color: var(--snice-color-text-inverse, white);\n}\n\n.sidebar-toggle:focus-visible {\n  outline: var(--snice-focus-ring-width, 2px) solid var(--snice-focus-ring-color, #3b82f6);\n  outline-offset: var(--snice-focus-ring-offset, 2px);\n}\n\n.header-content {\n  flex: 1;\n  min-width: 0; /* Allow flex item to shrink below content size */\n  display: flex;\n  align-items: center;\n  gap: var(--snice-spacing-md, 1rem);\n}\n\n/* Ensure slotted content can take full width */\n.header-content ::slotted(*) {\n  flex: 1;\n  width: 100%;\n}\n\n/* Body area contains drawer and main content */\n.body-area {\n  position: relative;\n  display: flex;\n  flex: 1;\n  overflow: hidden;\n  background: var(--snice-color-background-secondary, #f8fafc);\n}\n\n.sidebar-drawer {\n  flex-shrink: 0;\n}\n\n.sidebar-nav {\n  display: flex;\n  flex-direction: column;\n  gap: var(--snice-spacing-sm, 0.75rem);\n  padding: var(--snice-spacing-md, 1rem);\n}\n\n.main {\n  flex: 1;\n  padding: var(--snice-spacing-lg, 1.25rem);\n  overflow-y: auto;\n  background: var(--snice-color-background-secondary, #f8fafc);\n}\n\n/* Footer spans full width */\n.footer {\n  padding: var(--snice-spacing-md, 1rem) var(--snice-spacing-lg, 1.25rem);\n  background: var(--snice-color-background, white);\n  border-top: 1px solid var(--snice-color-border, #e5e7eb);\n}\n\n.footer:empty {\n  display: none;\n}\n\n/* Responsive behavior */\n@media (max-width: 768px) {\n  .header {\n    padding: var(--snice-spacing-sm, 0.75rem) var(--snice-spacing-md, 1rem);\n  }\n\n  .main {\n    padding: var(--snice-spacing-md, 1rem);\n  }\n\n  .footer {\n    padding: var(--snice-spacing-sm, 0.75rem) var(--snice-spacing-md, 1rem);\n  }\n}";
+var cssContent = ":host{display:block;font-family:var(--snice-font-family, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif)}.layout{display:grid;grid-template-rows:auto 1fr auto;min-height:100vh}.header{display:flex;align-items:center;gap:var(--snice-spacing-md,1rem);padding:var(--snice-spacing-md,1rem) var(--snice-spacing-lg,1.25rem);background:var(--snice-color-background,#fff);border-bottom:1px solid var(--snice-color-border,#e5e7eb);z-index:10}.header-brand{display:flex;align-items:center}.header-brand h2{margin:0;font-size:var(--snice-font-size-lg, 1.125rem);font-weight:var(--snice-font-weight-semibold,600);color:var(--snice-color-text,#111827);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.sidebar-toggle{display:flex;align-items:center;justify-content:center;width:var(--snice-size-control-md,2rem);height:var(--snice-size-control-md,2rem);background:0 0;border:none;color:var(--snice-color-text-secondary,#6b7280);cursor:pointer;padding:var(--snice-spacing-xs,.5rem);border-radius:var(--snice-border-radius-md,6px);transition:all var(--snice-transition-fast, 150ms) ease}.sidebar-toggle:hover{background:var(--snice-color-primary,rgb(59 130 246));color:var(--snice-color-text-inverse,#fff)}.sidebar-toggle:focus-visible{outline:var(--snice-focus-ring-width,2px) solid var(--snice-focus-ring-color,#3b82f6);outline-offset:var(--snice-focus-ring-offset,2px)}.header-content{flex:1;min-width:0;display:flex;align-items:center;gap:var(--snice-spacing-md,1rem)}.header-content ::slotted(*){flex:1;width:100%}.body-area{position:relative;display:flex;flex:1;overflow:hidden;background:var(--snice-color-background-secondary,#f8fafc)}.sidebar-drawer{flex-shrink:0}.sidebar-nav{display:flex;flex-direction:column;gap:var(--snice-spacing-sm,.75rem);padding:var(--snice-spacing-md,1rem)}.main{flex:1;padding:var(--snice-spacing-lg,1.25rem);overflow-y:auto;background:var(--snice-color-background-secondary,#f8fafc)}.footer{padding:var(--snice-spacing-md,1rem) var(--snice-spacing-lg,1.25rem);background:var(--snice-color-background,#fff);border-top:1px solid var(--snice-color-border,#e5e7eb)}.footer:empty{display:none}@media (max-width:768px){.header{padding:var(--snice-spacing-sm,.75rem) var(--snice-spacing-md,1rem)}.main{padding:var(--snice-spacing-md,1rem)}.footer{padding:var(--snice-spacing-sm,.75rem) var(--snice-spacing-md,1rem)}}";
 
 let SniceLayoutSidebar = (() => {
     let _classDecorators = [element('snice-layout-sidebar')];