snice 2.1.5 → 2.2.1

package/dist/components/button/snice-button.d.ts

@@ -0,0 +1,32 @@
+import type { ButtonVariant, ButtonSize, IconPlacement, SniceButtonElement } from './snice-button.types';
+export declare class SniceButton extends HTMLElement implements SniceButtonElement {
+    variant: ButtonVariant;
+    size: ButtonSize;
+    disabled: boolean;
+    loading: boolean;
+    outline: boolean;
+    pill: boolean;
+    circle: boolean;
+    href: string;
+    target: string;
+    download: string;
+    icon: string;
+    iconPlacement: IconPlacement;
+    button?: HTMLButtonElement;
+    spinner?: HTMLElement;
+    label?: HTMLElement;
+    iconElement?: HTMLImageElement;
+    html(): string;
+    css(): string;
+    updateButtonClasses(): void;
+    updateDisabledState(): void;
+    setLoading(loading: boolean): void;
+    setDisabled(disabled: boolean): void;
+    setVariant(variant: typeof this.variant): void;
+    handleClick(event: MouseEvent): {
+        originalEvent: MouseEvent;
+    } | undefined;
+    focus(options?: FocusOptions): void;
+    blur(): void;
+    click(): void;
+}

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

@@ -0,0 +1,232 @@
+import { __esDecorate, __runInitializers } from 'tslib';
+import { element, property, query, watch, on, dispatch } from 'snice';
+
+var css = ":host {\n  display: inline-block;\n  position: relative;\n  width: auto;\n  cursor: pointer;\n}\n\n:host([disabled]) {\n  cursor: not-allowed;\n}\n\n.button {\n  display: inline-flex;\n  align-items: center;\n  justify-content: center;\n  width: 100%;\n  border: 1px solid;\n  font-family: var(--snice-font-family, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif);\n  font-weight: var(--snice-font-weight-medium, 500);\n  text-decoration: none;\n  user-select: none;\n  white-space: nowrap;\n  vertical-align: middle;\n  padding: 0;\n  transition: \n    color var(--snice-transition-fast, 150ms) ease,\n    background-color var(--snice-transition-fast, 150ms) ease,\n    border-color var(--snice-transition-fast, 150ms) ease,\n    box-shadow var(--snice-transition-fast, 150ms) ease;\n  cursor: inherit;\n  position: relative;\n}\n\n.button:focus-visible {\n  outline: none;\n  box-shadow: 0 0 0 var(--snice-focus-ring-width, 2px) var(--snice-focus-ring-color, rgb(59 130 246 / 0.5));\n}\n\n.button--disabled {\n  opacity: 0.5;\n  cursor: not-allowed;\n}\n\n/* Sizes */\n.button--small {\n  font-size: var(--snice-font-size-sm, 0.875rem);\n  height: 1.875rem; /* 30px */\n  padding: 0 var(--snice-spacing-sm, 0.75rem);\n  border-radius: var(--snice-border-radius-md, 0.25rem);\n}\n\n.button--medium {\n  font-size: var(--snice-font-size-md, 1rem);\n  height: 2.5rem; /* 40px */\n  padding: 0 var(--snice-spacing-md, 1rem);\n  border-radius: var(--snice-border-radius-md, 0.25rem);\n}\n\n.button--large {\n  font-size: var(--snice-font-size-lg, 1.125rem);\n  height: 3.125rem; /* 50px */\n  padding: 0 var(--snice-spacing-lg, 1.5rem);\n  border-radius: var(--snice-border-radius-md, 0.25rem);\n}\n\n/* Variants - Default */\n.button--default {\n  background-color: var(--snice-color-background, rgb(255 255 255));\n  color: var(--snice-color-text, rgb(23 23 23));\n  border-color: var(--snice-color-border, rgb(226 226 226));\n}\n\n.button--default:hover:not(.button--disabled) {\n  background-color: var(--snice-color-background-secondary, rgb(250 250 250));\n  border-color: var(--snice-color-border-hover, rgb(204 204 204));\n}\n\n.button--default:active:not(.button--disabled) {\n  background-color: var(--snice-color-background-tertiary, rgb(241 241 241));\n}\n\n/* Variants - Primary */\n.button--primary {\n  background-color: var(--snice-color-primary, rgb(37 99 235));\n  color: var(--snice-color-text-inverse, rgb(250 250 250));\n  border-color: var(--snice-color-primary, rgb(37 99 235));\n}\n\n.button--primary:hover:not(.button--disabled) {\n  background-color: var(--snice-color-primary-hover, rgb(29 78 216));\n  border-color: var(--snice-color-primary-hover, rgb(29 78 216));\n}\n\n.button--primary:active:not(.button--disabled) {\n  background-color: var(--snice-color-primary-hover, rgb(29 78 216));\n}\n\n/* Variants - Success */\n.button--success {\n  background-color: var(--snice-color-success, rgb(22 163 74));\n  color: var(--snice-color-text-inverse, rgb(250 250 250));\n  border-color: var(--snice-color-success, rgb(22 163 74));\n}\n\n.button--success:hover:not(.button--disabled) {\n  background-color: var(--snice-color-success-hover, rgb(21 128 61));\n  border-color: var(--snice-color-success-hover, rgb(21 128 61));\n}\n\n/* Variants - Warning */\n.button--warning {\n  background-color: var(--snice-color-warning, rgb(202 138 4));\n  color: var(--snice-color-text-inverse, rgb(250 250 250));\n  border-color: var(--snice-color-warning, rgb(202 138 4));\n}\n\n.button--warning:hover:not(.button--disabled) {\n  background-color: var(--snice-color-warning-hover, rgb(161 98 7));\n  border-color: var(--snice-color-warning-hover, rgb(161 98 7));\n}\n\n/* Variants - Danger */\n.button--danger {\n  background-color: var(--snice-color-danger, rgb(220 38 38));\n  color: var(--snice-color-text-inverse, rgb(250 250 250));\n  border-color: var(--snice-color-danger, rgb(220 38 38));\n}\n\n.button--danger:hover:not(.button--disabled) {\n  background-color: var(--snice-color-danger-hover, rgb(185 28 28));\n  border-color: var(--snice-color-danger-hover, rgb(185 28 28));\n}\n\n/* Variants - Text */\n.button--text {\n  background-color: transparent;\n  color: var(--snice-color-primary, rgb(37 99 235));\n  border-color: transparent;\n}\n\n.button--text:hover:not(.button--disabled) {\n  background-color: rgb(59 130 246 / 0.1);\n  color: var(--snice-color-primary-hover, rgb(29 78 216));\n}\n\n/* Outline modifier */\n.button--outline.button--default {\n  background-color: transparent;\n  color: var(--snice-color-text, rgb(23 23 23));\n}\n\n.button--outline.button--primary {\n  background-color: transparent;\n  color: var(--snice-color-primary, rgb(37 99 235));\n}\n\n.button--outline.button--success {\n  background-color: transparent;\n  color: var(--snice-color-success, rgb(22 163 74));\n}\n\n.button--outline.button--warning {\n  background-color: transparent;\n  color: var(--snice-color-warning, rgb(202 138 4));\n}\n\n.button--outline.button--danger {\n  background-color: transparent;\n  color: var(--snice-color-danger, rgb(220 38 38));\n}\n\n.button--outline:hover:not(.button--disabled) {\n  background-color: rgb(115 115 115 / 0.1);\n}\n\n/* Shape modifiers */\n.button--pill {\n  border-radius: var(--snice-border-radius-pill, 9999px);\n}\n\n.button--circle {\n  border-radius: var(--snice-border-radius-circle, 50%);\n  width: var(--size);\n  padding: 0;\n}\n\n.button--small.button--circle { --size: 1.875rem; /* 30px */ }\n.button--medium.button--circle { --size: 2.5rem; /* 40px */ }\n.button--large.button--circle { --size: 3.125rem; /* 50px */ }\n\n/* Loading state */\n.button--loading {\n  position: relative;\n  cursor: wait;\n}\n\n.button--loading .label {\n  visibility: hidden;\n}\n\n.spinner {\n  display: none;\n  position: absolute;\n  top: 50%;\n  left: 50%;\n  transform: translate(-50%, -50%);\n  width: 1em;\n  height: 1em;\n}\n\n.button--loading .spinner {\n  display: block;\n}\n\n.spinner::after {\n  content: '';\n  display: block;\n  width: 100%;\n  height: 100%;\n  border: 2px solid currentColor;\n  border-right-color: transparent;\n  border-radius: 50%;\n  animation: spin 0.6s linear infinite;\n}\n\n@keyframes spin {\n  to {\n    transform: rotate(360deg);\n  }\n}";
+
+let SniceButton = (() => {
+    let _classDecorators = [element('snice-button')];
+    let _classDescriptor;
+    let _classExtraInitializers = [];
+    let _classThis;
+    let _classSuper = HTMLElement;
+    let _instanceExtraInitializers = [];
+    let _variant_decorators;
+    let _variant_initializers = [];
+    let _variant_extraInitializers = [];
+    let _size_decorators;
+    let _size_initializers = [];
+    let _size_extraInitializers = [];
+    let _disabled_decorators;
+    let _disabled_initializers = [];
+    let _disabled_extraInitializers = [];
+    let _loading_decorators;
+    let _loading_initializers = [];
+    let _loading_extraInitializers = [];
+    let _outline_decorators;
+    let _outline_initializers = [];
+    let _outline_extraInitializers = [];
+    let _pill_decorators;
+    let _pill_initializers = [];
+    let _pill_extraInitializers = [];
+    let _circle_decorators;
+    let _circle_initializers = [];
+    let _circle_extraInitializers = [];
+    let _href_decorators;
+    let _href_initializers = [];
+    let _href_extraInitializers = [];
+    let _target_decorators;
+    let _target_initializers = [];
+    let _target_extraInitializers = [];
+    let _download_decorators;
+    let _download_initializers = [];
+    let _download_extraInitializers = [];
+    let _icon_decorators;
+    let _icon_initializers = [];
+    let _icon_extraInitializers = [];
+    let _iconPlacement_decorators;
+    let _iconPlacement_initializers = [];
+    let _iconPlacement_extraInitializers = [];
+    let _button_decorators;
+    let _button_initializers = [];
+    let _button_extraInitializers = [];
+    let _spinner_decorators;
+    let _spinner_initializers = [];
+    let _spinner_extraInitializers = [];
+    let _label_decorators;
+    let _label_initializers = [];
+    let _label_extraInitializers = [];
+    let _iconElement_decorators;
+    let _iconElement_initializers = [];
+    let _iconElement_extraInitializers = [];
+    let _updateButtonClasses_decorators;
+    let _updateDisabledState_decorators;
+    let _handleClick_decorators;
+    (class extends _classSuper {
+        static { _classThis = this; }
+        static {
+            const _metadata = typeof Symbol === "function" && Symbol.metadata ? Object.create(_classSuper[Symbol.metadata] ?? null) : void 0;
+            _variant_decorators = [property({ reflect: true })];
+            _size_decorators = [property({ reflect: true })];
+            _disabled_decorators = [property({ type: Boolean, reflect: true })];
+            _loading_decorators = [property({ type: Boolean, reflect: true })];
+            _outline_decorators = [property({ type: Boolean, reflect: true })];
+            _pill_decorators = [property({ type: Boolean, reflect: true })];
+            _circle_decorators = [property({ type: Boolean, reflect: true })];
+            _href_decorators = [property({ type: String, reflect: true })];
+            _target_decorators = [property({ type: String, reflect: true })];
+            _download_decorators = [property({ type: String, reflect: true })];
+            _icon_decorators = [property({ type: String, reflect: true })];
+            _iconPlacement_decorators = [property({ attribute: 'icon-placement', reflect: true })];
+            _button_decorators = [query('.button')];
+            _spinner_decorators = [query('.spinner')];
+            _label_decorators = [query('.label')];
+            _iconElement_decorators = [query('.icon')];
+            _updateButtonClasses_decorators = [watch('*')];
+            _updateDisabledState_decorators = [watch('disabled')];
+            _handleClick_decorators = [on('click'), dispatch('@snice/click')];
+            __esDecorate(this, null, _updateButtonClasses_decorators, { kind: "method", name: "updateButtonClasses", static: false, private: false, access: { has: obj => "updateButtonClasses" in obj, get: obj => obj.updateButtonClasses }, metadata: _metadata }, null, _instanceExtraInitializers);
+            __esDecorate(this, null, _updateDisabledState_decorators, { kind: "method", name: "updateDisabledState", static: false, private: false, access: { has: obj => "updateDisabledState" in obj, get: obj => obj.updateDisabledState }, metadata: _metadata }, null, _instanceExtraInitializers);
+            __esDecorate(this, null, _handleClick_decorators, { kind: "method", name: "handleClick", static: false, private: false, access: { has: obj => "handleClick" in obj, get: obj => obj.handleClick }, metadata: _metadata }, null, _instanceExtraInitializers);
+            __esDecorate(null, null, _variant_decorators, { kind: "field", name: "variant", static: false, private: false, access: { has: obj => "variant" in obj, get: obj => obj.variant, set: (obj, value) => { obj.variant = value; } }, metadata: _metadata }, _variant_initializers, _variant_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, _disabled_decorators, { kind: "field", name: "disabled", static: false, private: false, access: { has: obj => "disabled" in obj, get: obj => obj.disabled, set: (obj, value) => { obj.disabled = value; } }, metadata: _metadata }, _disabled_initializers, _disabled_extraInitializers);
+            __esDecorate(null, null, _loading_decorators, { kind: "field", name: "loading", static: false, private: false, access: { has: obj => "loading" in obj, get: obj => obj.loading, set: (obj, value) => { obj.loading = value; } }, metadata: _metadata }, _loading_initializers, _loading_extraInitializers);
+            __esDecorate(null, null, _outline_decorators, { kind: "field", name: "outline", static: false, private: false, access: { has: obj => "outline" in obj, get: obj => obj.outline, set: (obj, value) => { obj.outline = value; } }, metadata: _metadata }, _outline_initializers, _outline_extraInitializers);
+            __esDecorate(null, null, _pill_decorators, { kind: "field", name: "pill", static: false, private: false, access: { has: obj => "pill" in obj, get: obj => obj.pill, set: (obj, value) => { obj.pill = value; } }, metadata: _metadata }, _pill_initializers, _pill_extraInitializers);
+            __esDecorate(null, null, _circle_decorators, { kind: "field", name: "circle", static: false, private: false, access: { has: obj => "circle" in obj, get: obj => obj.circle, set: (obj, value) => { obj.circle = value; } }, metadata: _metadata }, _circle_initializers, _circle_extraInitializers);
+            __esDecorate(null, null, _href_decorators, { kind: "field", name: "href", static: false, private: false, access: { has: obj => "href" in obj, get: obj => obj.href, set: (obj, value) => { obj.href = value; } }, metadata: _metadata }, _href_initializers, _href_extraInitializers);
+            __esDecorate(null, null, _target_decorators, { kind: "field", name: "target", static: false, private: false, access: { has: obj => "target" in obj, get: obj => obj.target, set: (obj, value) => { obj.target = value; } }, metadata: _metadata }, _target_initializers, _target_extraInitializers);
+            __esDecorate(null, null, _download_decorators, { kind: "field", name: "download", static: false, private: false, access: { has: obj => "download" in obj, get: obj => obj.download, set: (obj, value) => { obj.download = value; } }, metadata: _metadata }, _download_initializers, _download_extraInitializers);
+            __esDecorate(null, null, _icon_decorators, { kind: "field", name: "icon", static: false, private: false, access: { has: obj => "icon" in obj, get: obj => obj.icon, set: (obj, value) => { obj.icon = value; } }, metadata: _metadata }, _icon_initializers, _icon_extraInitializers);
+            __esDecorate(null, null, _iconPlacement_decorators, { kind: "field", name: "iconPlacement", static: false, private: false, access: { has: obj => "iconPlacement" in obj, get: obj => obj.iconPlacement, set: (obj, value) => { obj.iconPlacement = value; } }, metadata: _metadata }, _iconPlacement_initializers, _iconPlacement_extraInitializers);
+            __esDecorate(null, null, _button_decorators, { kind: "field", name: "button", static: false, private: false, access: { has: obj => "button" in obj, get: obj => obj.button, set: (obj, value) => { obj.button = value; } }, metadata: _metadata }, _button_initializers, _button_extraInitializers);
+            __esDecorate(null, null, _spinner_decorators, { kind: "field", name: "spinner", static: false, private: false, access: { has: obj => "spinner" in obj, get: obj => obj.spinner, set: (obj, value) => { obj.spinner = value; } }, metadata: _metadata }, _spinner_initializers, _spinner_extraInitializers);
+            __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, _iconElement_decorators, { kind: "field", name: "iconElement", static: false, private: false, access: { has: obj => "iconElement" in obj, get: obj => obj.iconElement, set: (obj, value) => { obj.iconElement = value; } }, metadata: _metadata }, _iconElement_initializers, _iconElement_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);
+        }
+        html() {
+            const classes = [
+                'button',
+                `button--${this.variant || 'default'}`,
+                `button--${this.size || 'medium'}`,
+                this.outline ? 'button--outline' : '',
+                this.pill ? 'button--pill' : '',
+                this.circle ? 'button--circle' : '',
+                this.loading ? 'button--loading' : '',
+                this.disabled ? 'button--disabled' : '',
+                this.icon ? `button--has-icon` : '',
+                this.icon ? `button--icon-${this.iconPlacement}` : ''
+            ].filter(Boolean).join(' ');
+            const iconElement = this.icon ? /*html*/ `
+      <img class="icon" src="${this.icon}" alt="" part="icon" />
+    ` : '';
+            return /*html*/ `
+      <button class="${classes}" type="button" ${this.disabled ? 'disabled' : ''} part="base">
+        <span class="spinner" part="spinner"></span>
+        ${this.iconPlacement === 'start' ? iconElement : ''}
+        <span class="label" part="label">
+          <slot></slot>
+        </span>
+        ${this.iconPlacement === 'end' ? iconElement : ''}
+      </button>
+    `;
+        }
+        css() {
+            return css;
+        }
+        updateButtonClasses() {
+            if (!this.button)
+                return;
+            // Rebuild all classes based on current state
+            const classes = [
+                'button',
+                `button--${this.variant}`,
+                `button--${this.size}`,
+                this.outline ? 'button--outline' : '',
+                this.pill ? 'button--pill' : '',
+                this.circle ? 'button--circle' : '',
+                this.loading ? 'button--loading' : '',
+                this.disabled ? 'button--disabled' : '',
+                this.icon ? `button--has-icon` : '',
+                this.icon ? `button--icon-${this.iconPlacement}` : ''
+            ].filter(Boolean);
+            // Set the className directly to avoid class manipulation issues
+            this.button.className = classes.join(' ');
+        }
+        updateDisabledState() {
+            if (this.button) {
+                this.button.disabled = this.disabled;
+            }
+        }
+        // Keep these methods for backwards compatibility if needed
+        setLoading(loading) {
+            this.loading = loading;
+        }
+        setDisabled(disabled) {
+            this.disabled = disabled;
+        }
+        setVariant(variant) {
+            this.variant = variant;
+        }
+        handleClick(event) {
+            if (this.disabled || this.loading) {
+                event.preventDefault();
+                event.stopPropagation();
+                return;
+            }
+            // Handle navigation if href is set
+            if (this.href) {
+                if (this.download) {
+                    const a = document.createElement('a');
+                    a.href = this.href;
+                    a.download = this.download;
+                    a.click();
+                }
+                else if (this.target) {
+                    window.open(this.href, this.target);
+                }
+                else {
+                    window.location.href = this.href;
+                }
+            }
+            return { originalEvent: event };
+        }
+        focus(options) {
+            this.button?.focus(options);
+        }
+        blur() {
+            this.button?.blur();
+        }
+        click() {
+            this.button?.click();
+        }
+        constructor() {
+            super(...arguments);
+            this.variant = (__runInitializers(this, _instanceExtraInitializers), __runInitializers(this, _variant_initializers, 'default'));
+            this.size = (__runInitializers(this, _variant_extraInitializers), __runInitializers(this, _size_initializers, 'medium'));
+            this.disabled = (__runInitializers(this, _size_extraInitializers), __runInitializers(this, _disabled_initializers, false));
+            this.loading = (__runInitializers(this, _disabled_extraInitializers), __runInitializers(this, _loading_initializers, false));
+            this.outline = (__runInitializers(this, _loading_extraInitializers), __runInitializers(this, _outline_initializers, false));
+            this.pill = (__runInitializers(this, _outline_extraInitializers), __runInitializers(this, _pill_initializers, false));
+            this.circle = (__runInitializers(this, _pill_extraInitializers), __runInitializers(this, _circle_initializers, false));
+            this.href = (__runInitializers(this, _circle_extraInitializers), __runInitializers(this, _href_initializers, ''));
+            this.target = (__runInitializers(this, _href_extraInitializers), __runInitializers(this, _target_initializers, ''));
+            this.download = (__runInitializers(this, _target_extraInitializers), __runInitializers(this, _download_initializers, ''));
+            this.icon = (__runInitializers(this, _download_extraInitializers), __runInitializers(this, _icon_initializers, ''));
+            this.iconPlacement = (__runInitializers(this, _icon_extraInitializers), __runInitializers(this, _iconPlacement_initializers, 'start'));
+            this.button = (__runInitializers(this, _iconPlacement_extraInitializers), __runInitializers(this, _button_initializers, void 0));
+            this.spinner = (__runInitializers(this, _button_extraInitializers), __runInitializers(this, _spinner_initializers, void 0));
+            this.label = (__runInitializers(this, _spinner_extraInitializers), __runInitializers(this, _label_initializers, void 0));
+            this.iconElement = (__runInitializers(this, _label_extraInitializers), __runInitializers(this, _iconElement_initializers, void 0));
+            __runInitializers(this, _iconElement_extraInitializers);
+        }
+    });
+    return _classThis;
+})();
+
+export { SniceButton };
+//# sourceMappingURL=snice-button.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"snice-button.js","sources":["../../../components/button/snice-button.css?inline","../../../../components/button/snice-button.ts"],"sourcesContent":["export default \":host {\\n  display: inline-block;\\n  position: relative;\\n  width: auto;\\n  cursor: pointer;\\n}\\n\\n:host([disabled]) {\\n  cursor: not-allowed;\\n}\\n\\n.button {\\n  display: inline-flex;\\n  align-items: center;\\n  justify-content: center;\\n  width: 100%;\\n  border: 1px solid;\\n  font-family: var(--snice-font-family, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif);\\n  font-weight: var(--snice-font-weight-medium, 500);\\n  text-decoration: none;\\n  user-select: none;\\n  white-space: nowrap;\\n  vertical-align: middle;\\n  padding: 0;\\n  transition: \\n    color var(--snice-transition-fast, 150ms) ease,\\n    background-color var(--snice-transition-fast, 150ms) ease,\\n    border-color var(--snice-transition-fast, 150ms) ease,\\n    box-shadow var(--snice-transition-fast, 150ms) ease;\\n  cursor: inherit;\\n  position: relative;\\n}\\n\\n.button:focus-visible {\\n  outline: none;\\n  box-shadow: 0 0 0 var(--snice-focus-ring-width, 2px) var(--snice-focus-ring-color, rgb(59 130 246 / 0.5));\\n}\\n\\n.button--disabled {\\n  opacity: 0.5;\\n  cursor: not-allowed;\\n}\\n\\n/* Sizes */\\n.button--small {\\n  font-size: var(--snice-font-size-sm, 0.875rem);\\n  height: 1.875rem; /* 30px */\\n  padding: 0 var(--snice-spacing-sm, 0.75rem);\\n  border-radius: var(--snice-border-radius-md, 0.25rem);\\n}\\n\\n.button--medium {\\n  font-size: var(--snice-font-size-md, 1rem);\\n  height: 2.5rem; /* 40px */\\n  padding: 0 var(--snice-spacing-md, 1rem);\\n  border-radius: var(--snice-border-radius-md, 0.25rem);\\n}\\n\\n.button--large {\\n  font-size: var(--snice-font-size-lg, 1.125rem);\\n  height: 3.125rem; /* 50px */\\n  padding: 0 var(--snice-spacing-lg, 1.5rem);\\n  border-radius: var(--snice-border-radius-md, 0.25rem);\\n}\\n\\n/* Variants - Default */\\n.button--default {\\n  background-color: var(--snice-color-background, rgb(255 255 255));\\n  color: var(--snice-color-text, rgb(23 23 23));\\n  border-color: var(--snice-color-border, rgb(226 226 226));\\n}\\n\\n.button--default:hover:not(.button--disabled) {\\n  background-color: var(--snice-color-background-secondary, rgb(250 250 250));\\n  border-color: var(--snice-color-border-hover, rgb(204 204 204));\\n}\\n\\n.button--default:active:not(.button--disabled) {\\n  background-color: var(--snice-color-background-tertiary, rgb(241 241 241));\\n}\\n\\n/* Variants - Primary */\\n.button--primary {\\n  background-color: var(--snice-color-primary, rgb(37 99 235));\\n  color: var(--snice-color-text-inverse, rgb(250 250 250));\\n  border-color: var(--snice-color-primary, rgb(37 99 235));\\n}\\n\\n.button--primary:hover:not(.button--disabled) {\\n  background-color: var(--snice-color-primary-hover, rgb(29 78 216));\\n  border-color: var(--snice-color-primary-hover, rgb(29 78 216));\\n}\\n\\n.button--primary:active:not(.button--disabled) {\\n  background-color: var(--snice-color-primary-hover, rgb(29 78 216));\\n}\\n\\n/* Variants - Success */\\n.button--success {\\n  background-color: var(--snice-color-success, rgb(22 163 74));\\n  color: var(--snice-color-text-inverse, rgb(250 250 250));\\n  border-color: var(--snice-color-success, rgb(22 163 74));\\n}\\n\\n.button--success:hover:not(.button--disabled) {\\n  background-color: var(--snice-color-success-hover, rgb(21 128 61));\\n  border-color: var(--snice-color-success-hover, rgb(21 128 61));\\n}\\n\\n/* Variants - Warning */\\n.button--warning {\\n  background-color: var(--snice-color-warning, rgb(202 138 4));\\n  color: var(--snice-color-text-inverse, rgb(250 250 250));\\n  border-color: var(--snice-color-warning, rgb(202 138 4));\\n}\\n\\n.button--warning:hover:not(.button--disabled) {\\n  background-color: var(--snice-color-warning-hover, rgb(161 98 7));\\n  border-color: var(--snice-color-warning-hover, rgb(161 98 7));\\n}\\n\\n/* Variants - Danger */\\n.button--danger {\\n  background-color: var(--snice-color-danger, rgb(220 38 38));\\n  color: var(--snice-color-text-inverse, rgb(250 250 250));\\n  border-color: var(--snice-color-danger, rgb(220 38 38));\\n}\\n\\n.button--danger:hover:not(.button--disabled) {\\n  background-color: var(--snice-color-danger-hover, rgb(185 28 28));\\n  border-color: var(--snice-color-danger-hover, rgb(185 28 28));\\n}\\n\\n/* Variants - Text */\\n.button--text {\\n  background-color: transparent;\\n  color: var(--snice-color-primary, rgb(37 99 235));\\n  border-color: transparent;\\n}\\n\\n.button--text:hover:not(.button--disabled) {\\n  background-color: rgb(59 130 246 / 0.1);\\n  color: var(--snice-color-primary-hover, rgb(29 78 216));\\n}\\n\\n/* Outline modifier */\\n.button--outline.button--default {\\n  background-color: transparent;\\n  color: var(--snice-color-text, rgb(23 23 23));\\n}\\n\\n.button--outline.button--primary {\\n  background-color: transparent;\\n  color: var(--snice-color-primary, rgb(37 99 235));\\n}\\n\\n.button--outline.button--success {\\n  background-color: transparent;\\n  color: var(--snice-color-success, rgb(22 163 74));\\n}\\n\\n.button--outline.button--warning {\\n  background-color: transparent;\\n  color: var(--snice-color-warning, rgb(202 138 4));\\n}\\n\\n.button--outline.button--danger {\\n  background-color: transparent;\\n  color: var(--snice-color-danger, rgb(220 38 38));\\n}\\n\\n.button--outline:hover:not(.button--disabled) {\\n  background-color: rgb(115 115 115 / 0.1);\\n}\\n\\n/* Shape modifiers */\\n.button--pill {\\n  border-radius: var(--snice-border-radius-pill, 9999px);\\n}\\n\\n.button--circle {\\n  border-radius: var(--snice-border-radius-circle, 50%);\\n  width: var(--size);\\n  padding: 0;\\n}\\n\\n.button--small.button--circle { --size: 1.875rem; /* 30px */ }\\n.button--medium.button--circle { --size: 2.5rem; /* 40px */ }\\n.button--large.button--circle { --size: 3.125rem; /* 50px */ }\\n\\n/* Loading state */\\n.button--loading {\\n  position: relative;\\n  cursor: wait;\\n}\\n\\n.button--loading .label {\\n  visibility: hidden;\\n}\\n\\n.spinner {\\n  display: none;\\n  position: absolute;\\n  top: 50%;\\n  left: 50%;\\n  transform: translate(-50%, -50%);\\n  width: 1em;\\n  height: 1em;\\n}\\n\\n.button--loading .spinner {\\n  display: block;\\n}\\n\\n.spinner::after {\\n  content: '';\\n  display: block;\\n  width: 100%;\\n  height: 100%;\\n  border: 2px solid currentColor;\\n  border-right-color: transparent;\\n  border-radius: 50%;\\n  animation: spin 0.6s linear infinite;\\n}\\n\\n@keyframes spin {\\n  to {\\n    transform: rotate(360deg);\\n  }\\n}\";",null],"names":[],"mappings":"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"}

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

@@ -0,0 +1,23 @@
+export type ButtonVariant = 'default' | 'primary' | 'success' | 'warning' | 'danger' | 'text';
+export type ButtonSize = 'small' | 'medium' | 'large';
+export type IconPlacement = 'start' | 'end';
+export interface SniceButtonElement extends HTMLElement {
+    variant: ButtonVariant;
+    size: ButtonSize;
+    disabled: boolean;
+    loading: boolean;
+    outline: boolean;
+    pill: boolean;
+    circle: boolean;
+    href: string;
+    target: string;
+    download: string;
+    icon: string;
+    iconPlacement: IconPlacement;
+    focus(options?: FocusOptions): void;
+    blur(): void;
+    click(): void;
+}
+export interface ButtonClickDetail {
+    button: SniceButtonElement;
+}

package/dist/components/card/snice-card.d.ts

@@ -0,0 +1,19 @@
+import type { CardVariant, CardSize, SniceCardElement } from './snice-card.types';
+export declare class SniceCard extends HTMLElement implements SniceCardElement {
+    variant: CardVariant;
+    size: CardSize;
+    clickable: boolean;
+    selected: boolean;
+    disabled: boolean;
+    private hasHeader;
+    private hasFooter;
+    html(): string;
+    css(): string;
+    init(): void;
+    private setupSlotListeners;
+    private checkSlots;
+    handleClick(event: MouseEvent): {
+        selected: boolean;
+    } | undefined;
+    handleKeydown(event: KeyboardEvent): void;
+}

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

@@ -0,0 +1,136 @@
+import { __runInitializers, __esDecorate } from 'tslib';
+import { element, property, ready, on, dispatch } from 'snice';
+
+var css = ":host {\n  display: block;\n  --card-padding: 1rem; /* 16px */\n  --card-border-radius: 8px;\n  --card-bg: white;\n  --card-border-color: rgb(var(--snice-color-gray-200, 226 226 226));\n  --card-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.1), 0 1px 2px 0 rgba(0, 0, 0, 0.06);\n  --card-hover-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);\n}\n\n.card {\n  background: var(--card-bg);\n  border-radius: var(--card-border-radius);\n  overflow: hidden;\n  position: relative;\n  height: 100%;\n  display: flex;\n  flex-direction: column;\n  transition: transform 0.2s ease, box-shadow 0.2s ease, border-color 0.2s ease;\n}\n\n/* Variants */\n:host([variant=\"elevated\"]) .card {\n  box-shadow: var(--card-shadow);\n  border: 1px solid transparent;\n}\n\n:host([variant=\"bordered\"]) .card {\n  border: 1px solid var(--card-border-color);\n  box-shadow: none;\n}\n\n:host([variant=\"flat\"]) .card {\n  border: none;\n  box-shadow: none;\n  background: rgb(var(--snice-color-gray-50, 250 250 250));\n}\n\n/* Clickable state */\n:host([clickable]) .card {\n  cursor: pointer;\n  user-select: none;\n}\n\n:host([clickable]:not([disabled])) .card:hover {\n  transform: translateY(-2px);\n}\n\n:host([clickable][variant=\"elevated\"]:not([disabled])) .card:hover {\n  box-shadow: var(--card-hover-shadow);\n}\n\n:host([clickable][variant=\"bordered\"]:not([disabled])) .card:hover {\n  border-color: rgb(var(--snice-color-blue-500, 59 130 246));\n}\n\n:host([clickable][variant=\"flat\"]:not([disabled])) .card:hover {\n  background: rgb(var(--snice-color-gray-100, 241 241 241));\n}\n\n:host([clickable]:not([disabled])) .card:active {\n  transform: translateY(0);\n}\n\n/* Selected state */\n:host([selected]) .card {\n  border-color: rgb(var(--snice-color-blue-500, 59 130 246));\n}\n\n:host([selected][variant=\"elevated\"]) .card,\n:host([selected][variant=\"bordered\"]) .card {\n  border-width: 2px;\n  border-color: rgb(var(--snice-color-blue-500, 59 130 246));\n}\n\n:host([selected][variant=\"flat\"]) .card {\n  background: rgb(var(--snice-color-blue-50, 239 246 255));\n  border: 2px solid rgb(var(--snice-color-blue-500, 59 130 246));\n}\n\n/* Disabled state */\n:host([disabled]) {\n  pointer-events: none;\n  opacity: 0.5;\n}\n\n:host([disabled]) .card {\n  cursor: not-allowed;\n}\n\n/* Sizes */\n:host([size=\"small\"]) {\n  --card-padding: 12px;\n  --card-border-radius: 6px;\n}\n\n:host([size=\"large\"]) {\n  --card-padding: 24px;\n  --card-border-radius: 12px;\n}\n\n/* Card sections */\n.card-header {\n  padding: var(--card-padding);\n  border-bottom: 1px solid var(--card-border-color);\n}\n\n.card-body {\n  flex: 1;\n  padding: var(--card-padding);\n}\n\n.card-footer {\n  padding: var(--card-padding);\n  border-top: 1px solid var(--card-border-color);\n}\n\n/* Slotted image styling */\n::slotted([slot=\"image\"]) {\n  width: 100%;\n  height: auto;\n  display: block;\n  border-radius: var(--card-border-radius) var(--card-border-radius) 0 0;\n}\n\n/* When header exists right after image */\n.card-image-slot + .card-header:not([hidden]) {\n  border-radius: 0;\n}\n\n/* Hidden attribute support */\n[hidden] {\n  display: none !important;\n}\n\n/* Focus state */\n:host([clickable]) .card:focus-visible {\n  outline: 2px solid rgb(var(--snice-color-blue-500, 59 130 246));\n  outline-offset: 2px;\n}";
+
+let SniceCard = (() => {
+    let _classDecorators = [element('snice-card')];
+    let _classDescriptor;
+    let _classExtraInitializers = [];
+    let _classThis;
+    let _classSuper = HTMLElement;
+    let _instanceExtraInitializers = [];
+    let _variant_decorators;
+    let _variant_initializers = [];
+    let _variant_extraInitializers = [];
+    let _size_decorators;
+    let _size_initializers = [];
+    let _size_extraInitializers = [];
+    let _clickable_decorators;
+    let _clickable_initializers = [];
+    let _clickable_extraInitializers = [];
+    let _selected_decorators;
+    let _selected_initializers = [];
+    let _selected_extraInitializers = [];
+    let _disabled_decorators;
+    let _disabled_initializers = [];
+    let _disabled_extraInitializers = [];
+    let _init_decorators;
+    let _handleClick_decorators;
+    let _handleKeydown_decorators;
+    (class extends _classSuper {
+        static { _classThis = this; }
+        constructor() {
+            super(...arguments);
+            this.variant = (__runInitializers(this, _instanceExtraInitializers), __runInitializers(this, _variant_initializers, 'elevated'));
+            this.size = (__runInitializers(this, _variant_extraInitializers), __runInitializers(this, _size_initializers, 'medium'));
+            this.clickable = (__runInitializers(this, _size_extraInitializers), __runInitializers(this, _clickable_initializers, false));
+            this.selected = (__runInitializers(this, _clickable_extraInitializers), __runInitializers(this, _selected_initializers, false));
+            this.disabled = (__runInitializers(this, _selected_extraInitializers), __runInitializers(this, _disabled_initializers, false));
+            this.hasHeader = (__runInitializers(this, _disabled_extraInitializers), false);
+            this.hasFooter = false;
+        }
+        static {
+            const _metadata = typeof Symbol === "function" && Symbol.metadata ? Object.create(_classSuper[Symbol.metadata] ?? null) : void 0;
+            _variant_decorators = [property({ reflect: true })];
+            _size_decorators = [property({ reflect: true })];
+            _clickable_decorators = [property({ type: Boolean, reflect: true })];
+            _selected_decorators = [property({ type: Boolean, reflect: true })];
+            _disabled_decorators = [property({ type: Boolean, reflect: true })];
+            _init_decorators = [ready()];
+            _handleClick_decorators = [on('click', '.card'), dispatch('card-click')];
+            _handleKeydown_decorators = [on('keydown', '.card')];
+            __esDecorate(this, null, _init_decorators, { kind: "method", name: "init", static: false, private: false, access: { has: obj => "init" in obj, get: obj => obj.init }, metadata: _metadata }, null, _instanceExtraInitializers);
+            __esDecorate(this, null, _handleClick_decorators, { kind: "method", name: "handleClick", static: false, private: false, access: { has: obj => "handleClick" in obj, get: obj => obj.handleClick }, metadata: _metadata }, null, _instanceExtraInitializers);
+            __esDecorate(this, null, _handleKeydown_decorators, { kind: "method", name: "handleKeydown", static: false, private: false, access: { has: obj => "handleKeydown" in obj, get: obj => obj.handleKeydown }, metadata: _metadata }, null, _instanceExtraInitializers);
+            __esDecorate(null, null, _variant_decorators, { kind: "field", name: "variant", static: false, private: false, access: { has: obj => "variant" in obj, get: obj => obj.variant, set: (obj, value) => { obj.variant = value; } }, metadata: _metadata }, _variant_initializers, _variant_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, _clickable_decorators, { kind: "field", name: "clickable", static: false, private: false, access: { has: obj => "clickable" in obj, get: obj => obj.clickable, set: (obj, value) => { obj.clickable = value; } }, metadata: _metadata }, _clickable_initializers, _clickable_extraInitializers);
+            __esDecorate(null, null, _selected_decorators, { kind: "field", name: "selected", static: false, private: false, access: { has: obj => "selected" in obj, get: obj => obj.selected, set: (obj, value) => { obj.selected = value; } }, metadata: _metadata }, _selected_initializers, _selected_extraInitializers);
+            __esDecorate(null, null, _disabled_decorators, { kind: "field", name: "disabled", static: false, private: false, access: { has: obj => "disabled" in obj, get: obj => obj.disabled, set: (obj, value) => { obj.disabled = value; } }, metadata: _metadata }, _disabled_initializers, _disabled_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);
+        }
+        html() {
+            return /*html*/ `
+      <div class="card" 
+           role="${this.clickable ? 'button' : 'article'}"
+           tabindex="${this.clickable && !this.disabled ? '0' : '-1'}"
+           aria-selected="${this.selected}"
+           aria-disabled="${this.disabled}">
+        <slot name="image" class="card-image-slot"></slot>
+        <div class="card-header" ${this.hasHeader ? '' : 'hidden'}>
+          <slot name="header"></slot>
+        </div>
+        <div class="card-body">
+          <slot></slot>
+        </div>
+        <div class="card-footer" ${this.hasFooter ? '' : 'hidden'}>
+          <slot name="footer"></slot>
+        </div>
+      </div>
+    `;
+        }
+        css() {
+            return css;
+        }
+        init() {
+            // Check for slotted content
+            this.setupSlotListeners();
+            this.checkSlots();
+        }
+        setupSlotListeners() {
+            const slots = this.shadowRoot?.querySelectorAll('slot');
+            slots?.forEach(slot => {
+                slot.addEventListener('slotchange', () => this.checkSlots());
+            });
+        }
+        checkSlots() {
+            const headerSlot = this.shadowRoot?.querySelector('slot[name="header"]');
+            const footerSlot = this.shadowRoot?.querySelector('slot[name="footer"]');
+            this.hasHeader = (headerSlot?.assignedNodes().length || 0) > 0;
+            this.hasFooter = (footerSlot?.assignedNodes().length || 0) > 0;
+            // Update visibility
+            const header = this.shadowRoot?.querySelector('.card-header');
+            const footer = this.shadowRoot?.querySelector('.card-footer');
+            if (header)
+                header.toggleAttribute('hidden', !this.hasHeader);
+            if (footer)
+                footer.toggleAttribute('hidden', !this.hasFooter);
+        }
+        handleClick(event) {
+            if (!this.clickable || this.disabled)
+                return;
+            if (this.clickable && !this.disabled) {
+                this.selected = !this.selected;
+            }
+            return {
+                selected: this.selected
+            };
+        }
+        handleKeydown(event) {
+            if (!this.clickable || this.disabled)
+                return;
+            if (event.key === 'Enter' || event.key === ' ') {
+                event.preventDefault();
+                this.handleClick(new MouseEvent('click'));
+            }
+        }
+    });
+    return _classThis;
+})();
+
+export { SniceCard };
+//# sourceMappingURL=snice-card.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"snice-card.js","sources":["../../../components/card/snice-card.css?inline","../../../../components/card/snice-card.ts"],"sourcesContent":["export default \":host {\\n  display: block;\\n  --card-padding: 1rem; /* 16px */\\n  --card-border-radius: 8px;\\n  --card-bg: white;\\n  --card-border-color: rgb(var(--snice-color-gray-200, 226 226 226));\\n  --card-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.1), 0 1px 2px 0 rgba(0, 0, 0, 0.06);\\n  --card-hover-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);\\n}\\n\\n.card {\\n  background: var(--card-bg);\\n  border-radius: var(--card-border-radius);\\n  overflow: hidden;\\n  position: relative;\\n  height: 100%;\\n  display: flex;\\n  flex-direction: column;\\n  transition: transform 0.2s ease, box-shadow 0.2s ease, border-color 0.2s ease;\\n}\\n\\n/* Variants */\\n:host([variant=\\\"elevated\\\"]) .card {\\n  box-shadow: var(--card-shadow);\\n  border: 1px solid transparent;\\n}\\n\\n:host([variant=\\\"bordered\\\"]) .card {\\n  border: 1px solid var(--card-border-color);\\n  box-shadow: none;\\n}\\n\\n:host([variant=\\\"flat\\\"]) .card {\\n  border: none;\\n  box-shadow: none;\\n  background: rgb(var(--snice-color-gray-50, 250 250 250));\\n}\\n\\n/* Clickable state */\\n:host([clickable]) .card {\\n  cursor: pointer;\\n  user-select: none;\\n}\\n\\n:host([clickable]:not([disabled])) .card:hover {\\n  transform: translateY(-2px);\\n}\\n\\n:host([clickable][variant=\\\"elevated\\\"]:not([disabled])) .card:hover {\\n  box-shadow: var(--card-hover-shadow);\\n}\\n\\n:host([clickable][variant=\\\"bordered\\\"]:not([disabled])) .card:hover {\\n  border-color: rgb(var(--snice-color-blue-500, 59 130 246));\\n}\\n\\n:host([clickable][variant=\\\"flat\\\"]:not([disabled])) .card:hover {\\n  background: rgb(var(--snice-color-gray-100, 241 241 241));\\n}\\n\\n:host([clickable]:not([disabled])) .card:active {\\n  transform: translateY(0);\\n}\\n\\n/* Selected state */\\n:host([selected]) .card {\\n  border-color: rgb(var(--snice-color-blue-500, 59 130 246));\\n}\\n\\n:host([selected][variant=\\\"elevated\\\"]) .card,\\n:host([selected][variant=\\\"bordered\\\"]) .card {\\n  border-width: 2px;\\n  border-color: rgb(var(--snice-color-blue-500, 59 130 246));\\n}\\n\\n:host([selected][variant=\\\"flat\\\"]) .card {\\n  background: rgb(var(--snice-color-blue-50, 239 246 255));\\n  border: 2px solid rgb(var(--snice-color-blue-500, 59 130 246));\\n}\\n\\n/* Disabled state */\\n:host([disabled]) {\\n  pointer-events: none;\\n  opacity: 0.5;\\n}\\n\\n:host([disabled]) .card {\\n  cursor: not-allowed;\\n}\\n\\n/* Sizes */\\n:host([size=\\\"small\\\"]) {\\n  --card-padding: 12px;\\n  --card-border-radius: 6px;\\n}\\n\\n:host([size=\\\"large\\\"]) {\\n  --card-padding: 24px;\\n  --card-border-radius: 12px;\\n}\\n\\n/* Card sections */\\n.card-header {\\n  padding: var(--card-padding);\\n  border-bottom: 1px solid var(--card-border-color);\\n}\\n\\n.card-body {\\n  flex: 1;\\n  padding: var(--card-padding);\\n}\\n\\n.card-footer {\\n  padding: var(--card-padding);\\n  border-top: 1px solid var(--card-border-color);\\n}\\n\\n/* Slotted image styling */\\n::slotted([slot=\\\"image\\\"]) {\\n  width: 100%;\\n  height: auto;\\n  display: block;\\n  border-radius: var(--card-border-radius) var(--card-border-radius) 0 0;\\n}\\n\\n/* When header exists right after image */\\n.card-image-slot + .card-header:not([hidden]) {\\n  border-radius: 0;\\n}\\n\\n/* Hidden attribute support */\\n[hidden] {\\n  display: none !important;\\n}\\n\\n/* Focus state */\\n:host([clickable]) .card:focus-visible {\\n  outline: 2px solid rgb(var(--snice-color-blue-500, 59 130 246));\\n  outline-offset: 2px;\\n}\";",null],"names":[],"mappings":"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"}

package/{components/card/snice-card.types.ts → dist/components/card/snice-card.types.d.ts}

@@ -1,10 +1,9 @@
 export type CardVariant = 'elevated' | 'bordered' | 'flat';
 export type CardSize = 'small' | 'medium' | 'large';
-
 export interface SniceCardElement extends HTMLElement {
-  variant: CardVariant;
-  size: CardSize;
-  clickable: boolean;
-  selected: boolean;
-  disabled: boolean;
-}
+    variant: CardVariant;
+    size: CardSize;
+    clickable: boolean;
+    selected: boolean;
+    disabled: boolean;
+}

package/dist/components/checkbox/snice-checkbox.d.ts

@@ -0,0 +1,34 @@
+import type { CheckboxSize, SniceCheckboxElement } from './snice-checkbox.types';
+export declare class SniceCheckbox extends HTMLElement implements SniceCheckboxElement {
+    checked: boolean;
+    indeterminate: boolean;
+    disabled: boolean;
+    required: boolean;
+    invalid: boolean;
+    size: CheckboxSize;
+    name: string;
+    value: string;
+    label: string;
+    input?: HTMLInputElement;
+    checkbox?: HTMLElement;
+    labelElement?: HTMLElement;
+    wrapper?: HTMLElement;
+    html(): string;
+    css(): string;
+    init(): void;
+    handleChange(e: Event): void;
+    handleClick(e: Event): void;
+    handleCheckedChange(): void;
+    handleIndeterminateChange(): void;
+    handleDisabledChange(): void;
+    handleInvalidChange(): void;
+    handleRequiredChange(): void;
+    handleLabelChange(): void;
+    private updateCheckboxState;
+    private dispatchChangeEvent;
+    focus(): void;
+    blur(): void;
+    click(): void;
+    toggle(): void;
+    setIndeterminate(): void;
+}