atomicuilibrary 0.0.1 → 0.1.3

package/dist/collection/components/image-button/image-button.js

@@ -1,310 +0,0 @@
-import { Host, h } from "@stencil/core";
-export class ImageButton {
-    /** Image source URL */
-    src;
-    /** Image alt text */
-    alt = '';
-    /** Button label (overlay) */
-    label;
-    /** Subtitle or secondary text */
-    description;
-    /** Hover effect: 'zoom' | 'lift' | 'brighten' | 'none' */
-    effect = 'zoom';
-    /** Aspect ratio: 'square' | 'video' | 'portrait' | 'auto' */
-    ratio = 'square';
-    /** Whether the label is always visible or only on hover */
-    labelMode = 'hover';
-    /** Size variant */
-    size = 'md';
-    /** Disabled state */
-    disabled = false;
-    /** Loading state */
-    loading = false;
-    /** Accessibility label */
-    a11yLabel;
-    /** Focus state for keyboard accessibility */
-    isFocused = false;
-    uiClick;
-    handleClick = (e) => {
-        if (this.disabled || this.loading) {
-            e.preventDefault();
-            e.stopPropagation();
-            return;
-        }
-        this.uiClick.emit();
-    };
-    handleKeyDown = (e) => {
-        if (e.key === 'Enter' || e.key === ' ') {
-            e.preventDefault();
-            this.handleClick(e);
-        }
-    };
-    render() {
-        const classes = {
-            'image-button': true,
-            [`image-button-${this.size}`]: true,
-            [`image-button-ratio-${this.ratio}`]: true,
-            [`image-button-effect-${this.effect}`]: true,
-            [`label-mode-${this.labelMode}`]: true,
-            'is-disabled': this.disabled,
-            'is-loading': this.loading,
-            'is-focused': this.isFocused,
-        };
-        return (h(Host, { key: '9f62fc59b4656078cbddd73750e41d03a0f3d2ca' }, h("div", { key: 'd6f464e2f65dd0eb5dd40892179432473b3836fe', class: classes, role: "button", tabindex: this.disabled || this.loading ? -1 : 0, "aria-label": this.a11yLabel || this.label || this.alt || 'Image Button', "aria-disabled": this.disabled ? 'true' : 'false', "aria-busy": this.loading ? 'true' : 'false', onClick: this.handleClick, onKeyDown: this.handleKeyDown, onFocus: () => this.isFocused = true, onBlur: () => this.isFocused = false }, this.src ? (h("img", { class: "button-image", src: this.src, alt: this.alt, loading: "lazy" })) : (h("div", { class: "image-placeholder" }, h("ui-icon", { name: "image", library: "fontawesome", size: "24px" }))), (this.label || this.description) && (h("div", { key: '4f8ce2e322361f645f29bf9c4f48f4c9b151f075', class: "button-overlay" }, h("div", { key: 'f3e15b029509d4ed27bef5c03d75d3bd934f190b', class: "overlay-content" }, this.label && h("div", { key: 'aac7cac7d8e07014a927acd9f572f7dac2688e3d', class: "button-label" }, this.label), this.description && h("div", { key: '1607a06a9fcde90277be03130548d974bf7c6b5c', class: "button-desc" }, this.description)))), this.loading && (h("div", { key: '9c9f38dbeb6b77fb2d8eed4ab641498aa5030bf7', class: "loading-overlay" }, h("ui-icon", { key: '2bc1e06c7a61a4e7752686d489ea2c092550d2b4', name: "spinner", library: "fontawesome", spin: true, size: "24px" }))))));
-    }
-    static get is() { return "ui-image-button"; }
-    static get encapsulation() { return "shadow"; }
-    static get originalStyleUrls() {
-        return {
-            "$": ["image-button.scss"]
-        };
-    }
-    static get styleUrls() {
-        return {
-            "$": ["image-button.css"]
-        };
-    }
-    static get properties() {
-        return {
-            "src": {
-                "type": "string",
-                "mutable": false,
-                "complexType": {
-                    "original": "string",
-                    "resolved": "string",
-                    "references": {}
-                },
-                "required": false,
-                "optional": false,
-                "docs": {
-                    "tags": [],
-                    "text": "Image source URL"
-                },
-                "getter": false,
-                "setter": false,
-                "reflect": false,
-                "attribute": "src"
-            },
-            "alt": {
-                "type": "string",
-                "mutable": false,
-                "complexType": {
-                    "original": "string",
-                    "resolved": "string",
-                    "references": {}
-                },
-                "required": false,
-                "optional": false,
-                "docs": {
-                    "tags": [],
-                    "text": "Image alt text"
-                },
-                "getter": false,
-                "setter": false,
-                "reflect": false,
-                "attribute": "alt",
-                "defaultValue": "''"
-            },
-            "label": {
-                "type": "string",
-                "mutable": false,
-                "complexType": {
-                    "original": "string",
-                    "resolved": "string",
-                    "references": {}
-                },
-                "required": false,
-                "optional": false,
-                "docs": {
-                    "tags": [],
-                    "text": "Button label (overlay)"
-                },
-                "getter": false,
-                "setter": false,
-                "reflect": false,
-                "attribute": "label"
-            },
-            "description": {
-                "type": "string",
-                "mutable": false,
-                "complexType": {
-                    "original": "string",
-                    "resolved": "string",
-                    "references": {}
-                },
-                "required": false,
-                "optional": false,
-                "docs": {
-                    "tags": [],
-                    "text": "Subtitle or secondary text"
-                },
-                "getter": false,
-                "setter": false,
-                "reflect": false,
-                "attribute": "description"
-            },
-            "effect": {
-                "type": "string",
-                "mutable": false,
-                "complexType": {
-                    "original": "'zoom' | 'lift' | 'brighten' | 'none'",
-                    "resolved": "\"brighten\" | \"lift\" | \"none\" | \"zoom\"",
-                    "references": {}
-                },
-                "required": false,
-                "optional": false,
-                "docs": {
-                    "tags": [],
-                    "text": "Hover effect: 'zoom' | 'lift' | 'brighten' | 'none'"
-                },
-                "getter": false,
-                "setter": false,
-                "reflect": false,
-                "attribute": "effect",
-                "defaultValue": "'zoom'"
-            },
-            "ratio": {
-                "type": "string",
-                "mutable": false,
-                "complexType": {
-                    "original": "'square' | 'video' | 'portrait' | 'auto'",
-                    "resolved": "\"auto\" | \"portrait\" | \"square\" | \"video\"",
-                    "references": {}
-                },
-                "required": false,
-                "optional": false,
-                "docs": {
-                    "tags": [],
-                    "text": "Aspect ratio: 'square' | 'video' | 'portrait' | 'auto'"
-                },
-                "getter": false,
-                "setter": false,
-                "reflect": false,
-                "attribute": "ratio",
-                "defaultValue": "'square'"
-            },
-            "labelMode": {
-                "type": "string",
-                "mutable": false,
-                "complexType": {
-                    "original": "'always' | 'hover'",
-                    "resolved": "\"always\" | \"hover\"",
-                    "references": {}
-                },
-                "required": false,
-                "optional": false,
-                "docs": {
-                    "tags": [],
-                    "text": "Whether the label is always visible or only on hover"
-                },
-                "getter": false,
-                "setter": false,
-                "reflect": false,
-                "attribute": "label-mode",
-                "defaultValue": "'hover'"
-            },
-            "size": {
-                "type": "string",
-                "mutable": false,
-                "complexType": {
-                    "original": "'sm' | 'md' | 'lg' | 'xl'",
-                    "resolved": "\"lg\" | \"md\" | \"sm\" | \"xl\"",
-                    "references": {}
-                },
-                "required": false,
-                "optional": false,
-                "docs": {
-                    "tags": [],
-                    "text": "Size variant"
-                },
-                "getter": false,
-                "setter": false,
-                "reflect": false,
-                "attribute": "size",
-                "defaultValue": "'md'"
-            },
-            "disabled": {
-                "type": "boolean",
-                "mutable": false,
-                "complexType": {
-                    "original": "boolean",
-                    "resolved": "boolean",
-                    "references": {}
-                },
-                "required": false,
-                "optional": false,
-                "docs": {
-                    "tags": [],
-                    "text": "Disabled state"
-                },
-                "getter": false,
-                "setter": false,
-                "reflect": false,
-                "attribute": "disabled",
-                "defaultValue": "false"
-            },
-            "loading": {
-                "type": "boolean",
-                "mutable": false,
-                "complexType": {
-                    "original": "boolean",
-                    "resolved": "boolean",
-                    "references": {}
-                },
-                "required": false,
-                "optional": false,
-                "docs": {
-                    "tags": [],
-                    "text": "Loading state"
-                },
-                "getter": false,
-                "setter": false,
-                "reflect": false,
-                "attribute": "loading",
-                "defaultValue": "false"
-            },
-            "a11yLabel": {
-                "type": "string",
-                "mutable": false,
-                "complexType": {
-                    "original": "string",
-                    "resolved": "string",
-                    "references": {}
-                },
-                "required": false,
-                "optional": false,
-                "docs": {
-                    "tags": [],
-                    "text": "Accessibility label"
-                },
-                "getter": false,
-                "setter": false,
-                "reflect": false,
-                "attribute": "a-1-1y-label"
-            }
-        };
-    }
-    static get states() {
-        return {
-            "isFocused": {}
-        };
-    }
-    static get events() {
-        return [{
-                "method": "uiClick",
-                "name": "uiClick",
-                "bubbles": true,
-                "cancelable": true,
-                "composed": true,
-                "docs": {
-                    "tags": [],
-                    "text": ""
-                },
-                "complexType": {
-                    "original": "void",
-                    "resolved": "void",
-                    "references": {}
-                }
-            }];
-    }
-}

package/dist/collection/components/image-button/types.js

@@ -1 +0,0 @@
-export {};

package/dist/collection/components/input-pair/input-pair.css

@@ -1,72 +0,0 @@
-.sr-only {
-  position: absolute !important;
-  width: 1px !important;
-  height: 1px !important;
-  padding: 0 !important;
-  margin: -1px !important;
-  overflow: hidden !important;
-  clip: rect(0, 0, 0, 0) !important;
-  white-space: nowrap !important;
-  border-width: 0 !important;
-}
-
-.a11y-sr-only {
-  position: absolute !important;
-  width: 1px !important;
-  height: 1px !important;
-  padding: 0 !important;
-  margin: -1px !important;
-  overflow: hidden !important;
-  clip: rect(0, 0, 0, 0) !important;
-  white-space: nowrap !important;
-  border-width: 0 !important;
-}
-
-:host {
-  display: block;
-  width: auto;
-  min-width: 0;
-  --pair-radius: 10px;
-}
-:host.full-width {
-  width: 100%;
-}
-
-.pair-main-label {
-  display: block;
-  font-size: 11px;
-  font-weight: 700;
-  text-transform: uppercase;
-  letter-spacing: 0.08em;
-  opacity: 0.65;
-  color: var(--label-color, var(--text-secondary, #64748b));
-  margin-bottom: 8px;
-}
-
-.pair-container {
-  display: flex;
-  align-items: flex-end;
-  width: 100%;
-}
-.pair-container .input-item {
-  flex: 1;
-  min-width: 0;
-}
-.pair-container {
-  /* Default radii for inputs */
-}
-.pair-container .input-item.left ui-input::part(container),
-.pair-container .input-item.right ui-input::part(container) {
-  border-radius: var(--pair-radius);
-  border-width: 1.5px;
-}
-.pair-container.is-connected .input-item.left ui-input::part(container) {
-  border-top-right-radius: 0;
-  border-bottom-right-radius: 0;
-  border-right-width: 0.75px;
-}
-.pair-container.is-connected .input-item.right ui-input::part(container) {
-  border-top-left-radius: 0;
-  border-bottom-left-radius: 0;
-  border-left-width: 0.75px;
-}