@sondor-technology/sondor-components 1.0.0-1165-initial-setup.11 → 1.0.0

package/dist/components/link/link.js

@@ -1,116 +0,0 @@
-var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
-    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
-    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
-    else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
-    return c > 3 && r && Object.defineProperty(target, key, r), r;
-};
-import { LitElement, html, css } from 'lit';
-import { customElement, property } from 'lit/decorators.js';
-import { resetStyles } from '../../styles/reset';
-let StLink = class StLink extends LitElement {
-    constructor() {
-        super(...arguments);
-        this.href = '#';
-        this.target = '_self';
-        this.size = 'md';
-        this.variant = 'inline';
-        this.color = 'primary';
-    }
-    render() {
-        return html `
-      <a href="${this.href}" target="${this.target}">
-        <slot></slot>
-      </a>
-    `;
-    }
-};
-StLink.styles = [
-    resetStyles,
-    css `
-      :host {
-        display: inline-flex;
-        align-items: center;
-      }
-
-      a {
-        display: inline-flex;
-        align-items: center;
-        gap: 0.25em;
-        text-decoration: none;
-        font-weight: 500;
-        transition: color 0.2s ease, opacity 0.2s ease;
-      }
-
-      /* ==========================================================
-         Colors
-         ========================================================== */
-      :host([color="primary"]) a {
-        color: var(--st-color-primary);
-      }
-      :host([color="default"]) a {
-        color: var(--st-color-text);
-      }
-      :host([color="muted"]) a {
-        color: var(--st-color-text-muted);
-      }
-
-      /* Hover states */
-      :host([color="primary"]) a:hover {
-        filter: brightness(1.1);
-      }
-      :host([color="default"]) a:hover {
-        color: var(--st-color-primary);
-      }
-      :host([color="muted"]) a:hover {
-        color: var(--st-color-text);
-      }
-
-      /* ==========================================================
-         Sizes
-         ========================================================== */
-      :host([size="sm"]) a { font-size: 0.875rem; }
-      :host([size="md"]) a { font-size: 1rem; }
-      :host([size="lg"]) a { font-size: 1.125rem; }
-
-      /* ==========================================================
-         Variants
-         ========================================================== */
-      /* inline links live inside paragraphs and underline on hover */
-      :host([variant="inline"]) a {
-        text-decoration: underline;
-        text-underline-offset: 4px;
-        font-weight: inherit; /* Inherits from surrounding paragraph text */
-      }
-      :host([variant="inline"]) a:hover {
-        text-decoration-thickness: 2px;
-      }
-
-      /* standalone links (e.g., footers, sidebars) have no underline by default */
-      :host([variant="standalone"]) a {
-        text-decoration: none;
-      }
-      :host([variant="standalone"]) a:hover {
-        text-decoration: underline;
-        text-underline-offset: 4px;
-      }
-    `
-];
-__decorate([
-    property({ type: String })
-], StLink.prototype, "href", void 0);
-__decorate([
-    property({ type: String })
-], StLink.prototype, "target", void 0);
-__decorate([
-    property({ type: String, reflect: true })
-], StLink.prototype, "size", void 0);
-__decorate([
-    property({ type: String, reflect: true })
-], StLink.prototype, "variant", void 0);
-__decorate([
-    property({ type: String, reflect: true })
-], StLink.prototype, "color", void 0);
-StLink = __decorate([
-    customElement('st-link')
-], StLink);
-export { StLink };

package/dist/components/metadata/metadata.d.ts

@@ -1,18 +0,0 @@
-import { LitElement } from 'lit';
-export declare class StMetadata extends LitElement {
-    pageTitle: string;
-    description: string;
-    image: string;
-    protected createRenderRoot(): this;
-    updated(): void;
-    private _updateMetadata;
-    private _setMeta;
-    private _setCanonical;
-    render(): symbol;
-}
-declare global {
-    interface HTMLElementTagNameMap {
-        'st-metadata': StMetadata;
-    }
-}
-//# sourceMappingURL=metadata.d.ts.map

package/dist/components/metadata/metadata.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"metadata.d.ts","sourceRoot":"","sources":["../../../src/components/metadata/metadata.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAW,MAAM,KAAK,CAAC;AAG1C,qBACa,UAAW,SAAQ,UAAU;IACZ,SAAS,SAAM;IACf,WAAW,SAAM;IACjB,KAAK,SAAM;IAEvC,SAAS,CAAC,gBAAgB,SAAmB;IAE7C,OAAO,SAEN;IAED,OAAO,CAAC,eAAe;IAsBvB,OAAO,CAAC,QAAQ;IAUhB,OAAO,CAAC,aAAa;IAUrB,MAAM,WAEL;CACF;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,aAAa,EAAE,UAAU,CAAC;KAC3B;CACF"}

package/dist/components/metadata/metadata.js

@@ -1,71 +0,0 @@
-var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
-    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
-    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
-    else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
-    return c > 3 && r && Object.defineProperty(target, key, r), r;
-};
-import { LitElement, nothing } from 'lit';
-import { customElement, property } from 'lit/decorators.js';
-let StMetadata = class StMetadata extends LitElement {
-    constructor() {
-        super(...arguments);
-        this.pageTitle = '';
-        this.description = '';
-        this.image = '';
-    }
-    createRenderRoot() { return this; }
-    updated() {
-        this._updateMetadata();
-    }
-    _updateMetadata() {
-        // Read site name from environment variable (e.g., VITE_SITE_NAME)
-        const siteName = import.meta.env?.VITE_SITE_NAME || '';
-        if (this.pageTitle) {
-            // If site name is configured, append it; otherwise use the title standalone
-            document.title = siteName ? `${this.pageTitle} - ${siteName}` : this.pageTitle;
-            this._setMeta('property', 'og:title', this.pageTitle);
-        }
-        if (this.description) {
-            this._setMeta('name', 'description', this.description);
-            this._setMeta('property', 'og:description', this.description);
-        }
-        if (this.image) {
-            this._setMeta('property', 'og:image', this.image);
-        }
-        this._setCanonical(window.location.href);
-    }
-    _setMeta(attrName, attrValue, content) {
-        let meta = document.head.querySelector(`meta[${attrName}="${attrValue}"]`);
-        if (!meta) {
-            meta = document.createElement('meta');
-            meta.setAttribute(attrName, attrValue);
-            document.head.appendChild(meta);
-        }
-        meta.setAttribute('content', content);
-    }
-    _setCanonical(url) {
-        let link = document.head.querySelector('link[rel="canonical"]');
-        if (!link) {
-            link = document.createElement('link');
-            link.setAttribute('rel', 'canonical');
-            document.head.appendChild(link);
-        }
-        link.setAttribute('href', url);
-    }
-    render() {
-        return nothing;
-    }
-};
-__decorate([
-    property({ type: String })
-], StMetadata.prototype, "pageTitle", void 0);
-__decorate([
-    property({ type: String })
-], StMetadata.prototype, "description", void 0);
-__decorate([
-    property({ type: String })
-], StMetadata.prototype, "image", void 0);
-StMetadata = __decorate([
-    customElement('st-metadata')
-], StMetadata);
-export { StMetadata };

package/dist/components/modal/modal.d.ts

@@ -1,24 +0,0 @@
-import { LitElement, PropertyValues } from 'lit';
-export declare class StModal extends LitElement {
-    /**
-     * Controls whether the modal is open.
-     */
-    open: boolean;
-    /**
-     * Title text displayed in the modal header.
-     */
-    heading: string;
-    private dialogEl;
-    static styles: import("lit").CSSResult[];
-    updated(changedProperties: PropertyValues): void;
-    private handleClose;
-    private onDialogClose;
-    private handleBackdropClick;
-    render(): import("lit-html").TemplateResult<1>;
-}
-declare global {
-    interface HTMLElementTagNameMap {
-        'st-modal': StModal;
-    }
-}
-//# sourceMappingURL=modal.d.ts.map

package/dist/components/modal/modal.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"modal.d.ts","sourceRoot":"","sources":["../../../src/components/modal/modal.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAa,cAAc,EAAE,MAAM,KAAK,CAAC;AAI5D,qBACa,OAAQ,SAAQ,UAAU;IACrC;;OAEG;IACyC,IAAI,UAAS;IAEzD;;OAEG;IACyB,OAAO,SAAM;IAExB,OAAO,CAAC,QAAQ,CAAqB;IAEtD,MAAM,CAAC,MAAM,4BAwEX;IAEF,OAAO,CAAC,iBAAiB,EAAE,cAAc,QAUxC;IAED,OAAO,CAAC,WAAW;IAKnB,OAAO,CAAC,aAAa;IAOrB,OAAO,CAAC,mBAAmB;IAY3B,MAAM,yCAuBL;CACF;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,UAAU,EAAE,OAAO,CAAC;KACrB;CACF"}

package/dist/components/modal/modal.js

@@ -1,163 +0,0 @@
-var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
-    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
-    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
-    else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
-    return c > 3 && r && Object.defineProperty(target, key, r), r;
-};
-import { LitElement, html, css } from 'lit';
-import { customElement, property, query } from 'lit/decorators.js';
-import { resetStyles } from '../../styles/reset.js';
-let StModal = class StModal extends LitElement {
-    constructor() {
-        super(...arguments);
-        /**
-         * Controls whether the modal is open.
-         */
-        this.open = false;
-        /**
-         * Title text displayed in the modal header.
-         */
-        this.heading = '';
-    }
-    updated(changedProperties) {
-        if (changedProperties.has('open')) {
-            if (this.dialogEl) {
-                if (this.open && !this.dialogEl.open) {
-                    this.dialogEl.showModal();
-                }
-                else if (!this.open && this.dialogEl.open) {
-                    this.dialogEl.close();
-                }
-            }
-        }
-    }
-    handleClose() {
-        this.open = false;
-        this.dispatchEvent(new CustomEvent('st-close', { bubbles: true, composed: true }));
-    }
-    onDialogClose() {
-        if (this.open) {
-            this.open = false;
-            this.dispatchEvent(new CustomEvent('st-close', { bubbles: true, composed: true }));
-        }
-    }
-    handleBackdropClick(e) {
-        const rect = this.dialogEl.getBoundingClientRect();
-        if (e.clientX < rect.left ||
-            e.clientX > rect.right ||
-            e.clientY < rect.top ||
-            e.clientY > rect.bottom) {
-            this.handleClose();
-        }
-    }
-    render() {
-        return html `
-      <dialog 
-        @cancel=${this.handleClose} 
-        @click=${this.handleBackdropClick} 
-        @close=${this.onDialogClose}
-      >
-        <div class="modal-header" @click=${(e) => e.stopPropagation()}>
-          <slot name="header">
-            <h3 class="modal-title">${this.heading}</h3>
-          </slot>
-          <button class="close-btn" @click=${this.handleClose} aria-label="Close modal">
-            <svg width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><line x1="18" y1="6" x2="6" y2="18"></line><line x1="6" y1="6" x2="18" y2="18"></line></svg>
-          </button>
-        </div>
-        <div class="modal-body" @click=${(e) => e.stopPropagation()}>
-          <slot></slot>
-        </div>
-        <div class="modal-footer" @click=${(e) => e.stopPropagation()}>
-          <slot name="footer"></slot>
-        </div>
-      </dialog>
-    `;
-    }
-};
-StModal.styles = [
-    resetStyles,
-    css `
-      :host {
-        display: contents;
-      }
-
-      dialog {
-        padding: 0;
-        border: 1px solid var(--st-color-border);
-        border-radius: var(--st-radius-lg, 0.5rem);
-        background-color: var(--st-color-surface);
-        color: var(--st-color-text);
-        width: 100%;
-        max-width: 500px;
-        box-shadow: 0 20px 25px -5px rgb(0 0 0 / 0.1), 0 8px 10px -6px rgb(0 0 0 / 0.1);
-        font-family: var(--st-font-family, inherit);
-      }
-
-      dialog::backdrop {
-        background-color: rgba(0, 0, 0, 0.5);
-        backdrop-filter: blur(2px);
-      }
-
-      .modal-header {
-        display: flex;
-        align-items: center;
-        justify-content: space-between;
-        padding: var(--st-spacing-md) var(--st-spacing-lg);
-        border-bottom: 1px solid var(--st-color-border);
-      }
-
-      .modal-title {
-        font-size: 1.125rem;
-        font-weight: 600;
-        margin: 0;
-      }
-
-      .close-btn {
-        background: none;
-        border: none;
-        cursor: pointer;
-        color: var(--st-color-text-muted);
-        padding: 0.25rem;
-        display: flex;
-        align-items: center;
-        justify-content: center;
-        border-radius: var(--st-radius-sm);
-        transition: color 0.2s, background-color 0.2s;
-      }
-
-      .close-btn:hover {
-        color: var(--st-color-text);
-        background-color: var(--st-color-surface-muted, #f1f5f9);
-      }
-
-      .modal-body {
-        padding: var(--st-spacing-lg);
-        font-size: var(--st-font-size-sm, 0.875rem);
-        line-height: 1.5;
-      }
-
-      .modal-footer {
-        display: flex;
-        align-items: center;
-        justify-content: flex-end;
-        gap: var(--st-spacing-sm);
-        padding: var(--st-spacing-md) var(--st-spacing-lg);
-        border-top: 1px solid var(--st-color-border);
-        background-color: var(--st-color-surface-muted, #f8fafc);
-      }
-    `
-];
-__decorate([
-    property({ type: Boolean, reflect: true })
-], StModal.prototype, "open", void 0);
-__decorate([
-    property({ type: String })
-], StModal.prototype, "heading", void 0);
-__decorate([
-    query('dialog')
-], StModal.prototype, "dialogEl", void 0);
-StModal = __decorate([
-    customElement('st-modal')
-], StModal);
-export { StModal };

package/dist/components/page-layout/page-layout.d.ts

@@ -1,46 +0,0 @@
-import { LitElement, PropertyValues } from 'lit';
-export type LayoutVariant = 'app-shell' | 'content-sidebar' | 'single-column' | 'three-column';
-export declare class StPageLayout extends LitElement {
-    /**
-     * Defines the structural layout variant to render.
-     */
-    variant: LayoutVariant;
-    /**
-     * Maximum width for the left sidebar section (e.g., '20rem', '300px').
-     */
-    sidebarWidth: string;
-    /**
-     * Maximum width for the right sidebar section (e.g., '16rem', '250px').
-     */
-    rightSidebarWidth: string;
-    /**
-     * Optional maximum width for the main content area (e.g., '48rem', '800px').
-     */
-    mainMaxWidth: string;
-    /**
-     * When true, expands the main content area to fill 100% of the available width between sidebars.
-     */
-    fillMain: boolean;
-    private _mobileMenuOpen;
-    private _touchStartX;
-    private _currentTranslateX;
-    private _isDragging;
-    updated(changedProperties: PropertyValues<this>): void;
-    private _toggleMobileMenu;
-    private _closeMobileMenu;
-    private _handleNavClick;
-    private _handleTouchStart;
-    private _handleTouchMove;
-    private _handleTouchEnd;
-    private _resizeListener;
-    connectedCallback(): void;
-    disconnectedCallback(): void;
-    static styles: import("lit").CSSResult[];
-    render(): import("lit-html").TemplateResult<1>;
-}
-declare global {
-    interface HTMLElementTagNameMap {
-        'st-page-layout': StPageLayout;
-    }
-}
-//# sourceMappingURL=page-layout.d.ts.map

package/dist/components/page-layout/page-layout.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"page-layout.d.ts","sourceRoot":"","sources":["../../../src/components/page-layout/page-layout.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAa,cAAc,EAAE,MAAM,KAAK,CAAC;AAI5D,MAAM,MAAM,aAAa,GAAG,WAAW,GAAG,iBAAiB,GAAG,eAAe,GAAG,cAAc,CAAC;AAE/F,qBACa,YAAa,SAAQ,UAAU;IAC1C;;OAEG;IAEH,OAAO,EAAE,aAAa,CAAmB;IAEzC;;OAEG;IAEH,YAAY,SAAM;IAElB;;OAEG;IAEH,iBAAiB,SAAM;IAEvB;;OAEG;IAEH,YAAY,SAAM;IAElB;;OAEG;IAEH,QAAQ,UAAS;IAGjB,OAAO,CAAC,eAAe,CAAS;IAEhC,OAAO,CAAC,YAAY,CAAK;IACzB,OAAO,CAAC,kBAAkB,CAAK;IAC/B,OAAO,CAAC,WAAW,CAAS;IAEnB,OAAO,CAAC,iBAAiB,EAAE,cAAc,CAAC,IAAI,CAAC,QA0BvD;IAED,OAAO,CAAC,iBAAiB,CAEvB;IAEF,OAAO,CAAC,gBAAgB,CAEtB;IAGF,OAAO,CAAC,eAAe,CAUrB;IAEF,OAAO,CAAC,iBAAiB,CAMvB;IAEF,OAAO,CAAC,gBAAgB,CAUtB;IAEF,OAAO,CAAC,eAAe,CAarB;IAEF,OAAO,CAAC,eAAe,CAIrB;IAEF,iBAAiB,SAGhB;IAED,oBAAoB,SAGnB;IAED,MAAM,CAAC,MAAM,4BAsZX;IAEF,MAAM,yCAgJL;CACF;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,gBAAgB,EAAE,YAAY,CAAC;KAChC;CACF"}