@sky.ui/core 0.0.1

package/dist/sky-speeddial/sky-speeddial.js

@@ -0,0 +1,154 @@
+import{__decorate as t,__metadata as e}from"tslib";import{LitElement as i,css as o,html as r}from"lit";import{property as s,customElement as n}from"lit/decorators.js";import{when as a}from"lit/directives/when.js";import{SkyIcon as c}from"../sky-icon/sky-icon.js";let l=class extends i{constructor(){super(...arguments),this.open=!1,this.direction="top",this.fabIcon="ion:add",this.toggleMenu=()=>{this.open=!this.open,this.adjustDirection(),this.dispatchEvent(new CustomEvent("toggle-changed",{detail:{open:this.open,direction:this.direction},bubbles:!0,composed:!0}))}}static{this.dependencies={"sky-icon":c}}static{this.styles=o`
+    :host {
+      position: relative;
+      display: inline-block;
+    }
+
+    .speed-dial {
+      position: relative;
+      display: flex;
+      align-items: center;
+      justify-content: center;
+    }
+
+    .fab {
+      width: 40px;
+      height: 40px;
+      border-radius: 50%;
+      background-color: var(--sky-active-primary);
+      color: var(--sky-text-white);
+      border: var(--sky-border-primary);
+      display: flex;
+      align-items: center;
+      justify-content: center;
+      cursor: pointer;
+      box-shadow: var(--sky-box-shadow-primary);
+      transition: transform 0.3s ease;
+    }
+    .fab:active {
+      transform: scale(0.9);
+    }
+
+            sky-icon {
+        display: inline-block; /* Ensures proper box model behavior */
+        width: 1em; /* Sets a default width, adjust as needed */
+        height: 1em; /* Sets a default height, adjust as needed */
+    }
+
+    .actions {
+      position: absolute;
+      display: flex;
+      gap: 10px;
+      transition: opacity 0.01s ease, transform 0.3s ease;
+      opacity: 0;
+      pointer-events: none;
+      transform: translate(0, 0) scale(0.8);
+    }
+    :host([open]) .actions {
+      opacity: 1;
+      pointer-events: all;
+      transform: translate(0, 0) scale(1);
+    }
+
+    ::slotted(button) {
+      width: 40px;
+      height: 40px;
+      border-radius: 50%;
+      background-color: var(--sky-glass-primary);
+      backdrop-filter: var(--sky-blur-primary) var(--sky-brightness-primary)
+        var(--sky-saturation-primary);
+      -webkit-backdrop-filter: var(--sky-blur-primary)
+        var(--sky-brightness-primary) var(--sky-saturation-primary);
+      color: var(--sky-text-primary);
+      font-size: 18px;
+      font-weight: bold;
+      border: var(--sky-border-primary);
+      position: relative;
+      outline: none;
+      display: flex;
+      align-items: center;
+      justify-content: center;
+      cursor: pointer;
+      box-shadow: var(--sky-box-shadow-secondary);
+      transition: all 0.3s ease;
+    }
+    ::slotted(button:hover) {
+      color: var(--sky-active-primary);
+      background-color: var(--sky-glass-primary);
+      box-shadow: var(--sky-box-shadow-tertiary);
+    }
+    ::slotted(button:active) {
+      transform: scale(0.9);
+    }
+
+    :host([direction="top"]) .actions {
+      flex-direction: column;
+      bottom: 100%;
+      left: 50%;
+      transform: translate(-50%, 20px) scale(0.8);
+    }
+    :host([direction="bottom"]) .actions {
+      flex-direction: column;
+      top: 100%;
+      left: 50%;
+      transform: translate(-50%, -20px) scale(0.8);
+    }
+    :host([direction="left"]) .actions {
+      flex-direction: row;
+      right: 100%;
+      top: 50%;
+      transform: translate(20px, -50%) scale(0.8);
+    }
+    :host([direction="right"]) .actions {
+      flex-direction: row;
+      left: 100%;
+      top: 50%;
+      transform: translate(-20px, -50%) scale(0.8);
+    }
+
+    :host([open][direction="top"]) .actions {
+      transform: translate(-50%, -10px) scale(1);
+    }
+    :host([open][direction="bottom"]) .actions {
+      transform: translate(-50%, 10px) scale(1);
+    }
+    :host([open][direction="left"]) .actions {
+      transform: translate(-10px, -50%) scale(1);
+    }
+    :host([open][direction="right"]) .actions {
+      transform: translate(10px, -50%) scale(1);
+    }
+
+    :host([dir="rtl"][direction="left"]) .actions {
+      right: auto;
+      left: 100%;
+      transform: translate(-20px, -50%) scale(0.8);
+    }
+    :host([dir="rtl"][direction="right"]) .actions {
+      left: auto;
+      right: 100%;
+      transform: translate(20px, -50%) scale(0.8);
+    }
+    :host([open][dir="rtl"][direction="left"]) .actions {
+      transform: translate(10px, -50%) scale(1);
+    }
+    :host([open][dir="rtl"][direction="right"]) .actions {
+      transform: translate(-10px, -50%) scale(1);
+    }
+  `}firstUpdated(){requestAnimationFrame(()=>this.adjustDirection()),window.addEventListener("resize",()=>this.adjustDirection()),("rtl"===document.documentElement.dir||this.closest("[dir='rtl']"))&&this.setAttribute("dir","rtl")}adjustDirection(){const t=this.getBoundingClientRect(),{innerWidth:e,innerHeight:i}=window;"top"===this.direction&&t.top<100?this.direction="bottom":"bottom"===this.direction&&t.bottom+100>i?this.direction="top":"left"===this.direction&&t.left<100?this.direction="right":"right"===this.direction&&t.right+100>e&&(this.direction="left")}openMenu(){this.open||this.toggleMenu()}closeMenu(){this.open&&this.toggleMenu()}toggleMenuState(){this.toggleMenu()}render(){return r`
+      <div class="speed-dial">
+        <div
+          class="fab"
+          part="fab"
+          @click=${this.toggleMenu}
+          aria-expanded=${a(this.open,()=>"true",()=>"false")}
+          role="button"
+        >
+          <sky-icon icon=${this.fabIcon}></sky-icon>
+        </div>
+        <div class="actions" part="actions">
+          <slot></slot>
+        </div>
+      </div>
+    `}};t([s({type:Boolean,reflect:!0}),e("design:type",Object)],l.prototype,"open",void 0),t([s({type:String,reflect:!0}),e("design:type",String)],l.prototype,"direction",void 0),t([s({type:String}),e("design:type",Object)],l.prototype,"fabIcon",void 0),l=t([n("sky-speeddial")],l);export{l as SkySpeeddial};
+//# sourceMappingURL=sky-speeddial.js.map

package/dist/sky-speeddial/sky-speeddial.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"sky-speeddial.js","sources":["../../src/sky-speeddial/sky-speeddial.ts"],"sourcesContent":[null],"names":["SkySpeeddial","LitElement","constructor","this","open","direction","fabIcon","toggleMenu","adjustDirection","dispatchEvent","CustomEvent","detail","bubbles","composed","dependencies","SkyIcon","styles","css","firstUpdated","requestAnimationFrame","window","addEventListener","document","documentElement","dir","closest","setAttribute","rect","getBoundingClientRect","innerWidth","innerHeight","top","bottom","left","right","openMenu","closeMenu","toggleMenuState","render","html","when","__decorate","property","type","Boolean","reflect","prototype","String","customElement"],"mappings":"uQAsEO,IAAMA,EAAN,cAA2BC,EAA3B,WAAAC,uBAQLC,KAAAC,MAAO,EAIPD,KAAAE,UAAmC,MAInCF,KAAAG,QAAU,UAwKFH,KAAAI,WAAa,KACnBJ,KAAKC,MAAQD,KAAKC,KAClBD,KAAKK,kBAELL,KAAKM,cACH,IAAIC,YAA6C,iBAAkB,CACjEC,OAAQ,CAAEP,KAAMD,KAAKC,KAAMC,UAAWF,KAAKE,WAC3CO,SAAS,EACTC,UAAU,KAmClB,QAjOSV,KAAAW,aAAyD,CAC9D,WAAYC,EACZ,QAgBcZ,KAAAa,OAASC,CAAG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAyI1B,CAEO,YAAAC,GACPC,sBAAsB,IAAMhB,KAAKK,mBACjCY,OAAOC,iBAAiB,SAAU,IAAMlB,KAAKK,oBACR,QAAjCc,SAASC,gBAAgBC,KAAiBrB,KAAKsB,QAAQ,iBACzDtB,KAAKuB,aAAa,MAAO,MAE7B,CAGQ,eAAAlB,GACN,MAAMmB,EAAOxB,KAAKyB,yBACZC,WAAEA,EAAUC,YAAEA,GAAgBV,OAEb,QAAnBjB,KAAKE,WAAuBsB,EAAKI,IAAM,IACzC5B,KAAKE,UAAY,SACW,WAAnBF,KAAKE,WAA0BsB,EAAKK,OAAS,IAAMF,EAC5D3B,KAAKE,UAAY,MACW,SAAnBF,KAAKE,WAAwBsB,EAAKM,KAAO,IAClD9B,KAAKE,UAAY,QACW,UAAnBF,KAAKE,WAAyBsB,EAAKO,MAAQ,IAAML,IAC1D1B,KAAKE,UAAY,OAErB,CAgBO,QAAA8B,GACAhC,KAAKC,MAAMD,KAAKI,YACvB,CAEO,SAAA6B,GACDjC,KAAKC,MAAMD,KAAKI,YACtB,CAEO,eAAA8B,GACLlC,KAAKI,YACP,CAES,MAAA+B,GACP,OAAOC,CAAI;;;;;mBAKIpC,KAAKI;0BACEiC,EAAKrC,KAAKC,KAAM,IAAM,OAAQ,IAAM;;;2BAGnCD,KAAKG;;;;;;KAO9B,GA1NAmC,EAAA,CADCC,EAAS,CAAEC,KAAMC,QAASC,SAAS,6BACvB7C,EAAA8C,UAAA,eAIbL,EAAA,CADCC,EAAS,CAAEC,KAAMI,OAAQF,SAAS,6BACM7C,EAAA8C,UAAA,oBAIzCL,EAAA,CADCC,EAAS,CAAEC,KAAMI,kCACE/C,EAAA8C,UAAA,kBAhBT9C,EAAYyC,EAAA,CADxBO,EAAc,kBACFhD"}

package/dist/sky-spinner/index.d.ts

@@ -0,0 +1 @@
+export * from "./sky-spinner";

package/dist/sky-spinner/index.js

@@ -0,0 +1 @@
+export * from './sky-spinner.js';

package/dist/sky-spinner/sky-spinner.d.ts

@@ -0,0 +1,87 @@
+import { LitElement } from "lit";
+export type SkySpinnerVariant = "solid" | "track" | "gradient" | "dashed" | "segment" | "dual" | "material" | "pulse" | "dots" | "bars";
+/**
+ * @element sky-spinner
+ *
+ * @summary Accessible loading indicator with multiple visual variants and overlay modes.
+ *
+ * @status stable
+ * @since 1.0.0
+ *
+ * @documentation https://library.sky-ui.com/components/spinner
+ *
+ * @slot - Default slot for additional content (not typically used).
+ *
+ * @csspart spinner - The main container of the spinner component
+ * @csspart circle - The circular element used for most variants
+ * @csspart text - The text label when `showText` is true
+ * @csspart dots - The container for the dots variant
+ * @csspart dot - Individual dot in the dots variant
+ * @csspart bars - The container for the bars variant
+ * @csspart bar - Individual bar in the bars variant
+ *
+ * @property {SkySpinnerVariant} variant - Spinner visual style.
+ * @property {string} size - Size preset or CSS size value.
+ * @property {string} color - Color token or CSS color value.
+ * @property {boolean} showText - Shows loading text beside spinner.
+ * @property {string} text - Loading text value.
+ * @property {string} ariaLabel - Accessible status label.
+ * @property {boolean} overlay - Covers parent element as overlay.
+ * @property {boolean} fullscreen - Covers viewport as fullscreen overlay.
+ * @property {boolean} backdropBlur - Enables background blur in overlay modes.
+ * @property {number} speed - Animation cycle speed in seconds.
+ * @property {boolean} paused - Pauses spinner animation.
+ *
+ * @Behavior
+ * - Supports ring, dot, bar, pulse, and gradient-based variants.
+ * - Adapts sizing, thickness, and label spacing from `size`.
+ * - Switches between inline, overlay, and fullscreen layouts.
+ *
+ * @example
+ * ```html
+ * <sky-spinner variant="material" size="lg" color="success" show-text text="Deploying service..." overlay backdrop-blur></sky-spinner>
+ * ```
+ * ```vue
+ * <template>
+ *   <sky-spinner variant="material" size="lg" color="success" show-text text="Deploying service..." overlay backdrop-blur></sky-spinner>
+ * </template>
+ * ```
+ * ```jsx
+ * export default function Demo() {
+ *   return <sky-spinner variant="material" size="lg" color="success" show-text text="Deploying service..." overlay backdrop-blur></sky-spinner>;
+ * }
+ * ```
+ */
+export declare class SkySpinner extends LitElement {
+    static styles: import("lit").CSSResult;
+    variant: SkySpinnerVariant;
+    size: string;
+    color: string;
+    showText: boolean;
+    text: string;
+    ariaLabel: string;
+    /** Overlay only on parent (absolute, stretches to parent bounds). */
+    overlay: boolean;
+    /** Fullscreen overlay (fixed, covers viewport). */
+    fullscreen: boolean;
+    /** Optional blur effect on overlay / fullscreen. */
+    backdropBlur: boolean;
+    /** Seconds per rotation (e.g., 0.6 = faster, 2 = slower). */
+    speed: number;
+    /** Pause animation without removing element. */
+    paused: boolean;
+    render(): import("lit-html").TemplateResult<1>;
+    private renderDots;
+    private renderBars;
+    /** Ensure speed is always a sane, positive value. */
+    private get normalizedSpeed();
+    private resolveLabelSize;
+    private resolveLabelGap;
+    /** Preset sizes or arbitrary CSS size. */
+    private resolveSize;
+    /** Apply overlay/fullscreen styles to the root style object. Only sets overlay-related properties when overlay or fullscreen is true. */
+    private applyOverlayStyles;
+    /** Auto ring thickness based on visual size. */
+    private resolveThickness;
+    protected updated(changed: Map<string, unknown>): void;
+}

package/dist/sky-spinner/sky-spinner.js

@@ -0,0 +1,334 @@
+import{__decorate as e,__metadata as r}from"tslib";import{LitElement as t,css as i,html as s}from"lit";import{property as a,customElement as n}from"lit/decorators.js";import{classMap as o}from"lit/directives/class-map.js";import{styleMap as l}from"lit/directives/style-map.js";import{resolveColor as p}from"../helper/utils/color-resolver.js";let d=class extends t{constructor(){super(...arguments),this.variant="solid",this.size="md",this.color="primary",this.showText=!1,this.text="Loading...",this.ariaLabel="Loading",this.overlay=!1,this.fullscreen=!1,this.backdropBlur=!1,this.speed=1,this.paused=!1}static{this.styles=i`
+    :host {
+      display: inline-block;
+      --sky-spinner-speed: 1s;
+      --sky-spinner-size: 24px;
+      --sky-spinner-thickness: 3px;
+      --sky-spinner-label-size: 0.875rem;
+    }
+
+    .spinner {
+      position: relative;
+      display: inline-flex;
+      align-items: center;
+      justify-content: center;
+    }
+
+    .spinner-circle {
+      position: relative;
+      display: inline-block;
+      box-sizing: border-box;
+      border-radius: 50%;
+      border-style: solid;
+      border-color: transparent;
+      border-top-color: currentColor;
+      animation: spin var(--sky-spinner-speed) linear infinite;
+      width: var(--sky-spinner-size);
+      height: var(--sky-spinner-size);
+      border-width: var(--sky-spinner-thickness);
+    }
+
+    .spinner-text {
+      margin-left: var(--sky-spinner-label-gap, 8px);
+      font-family: inherit;
+      color: inherit;
+      font-size: var(--sky-spinner-label-size);
+      line-height: 1.2;
+    }
+
+    @keyframes spin {
+      0% {
+        transform: rotate(0deg);
+      }
+      100% {
+        transform: rotate(360deg);
+      }
+    }
+
+    @keyframes pulse {
+      0% {
+        transform: scale(0.6);
+        opacity: 0.6;
+      }
+      50% {
+        transform: scale(1);
+        opacity: 1;
+      }
+      100% {
+        transform: scale(0.6);
+        opacity: 0.6;
+      }
+    }
+
+    @keyframes dots-pulse {
+      0% {
+        transform: scale(0.6);
+        opacity: 0.4;
+      }
+      40% {
+        transform: scale(1);
+        opacity: 1;
+      }
+      100% {
+        transform: scale(0.6);
+        opacity: 0.4;
+      }
+    }
+
+    @keyframes bars-stretch {
+      0% {
+        transform: scaleY(0.5);
+        opacity: 0.6;
+      }
+      50% {
+        transform: scaleY(1);
+        opacity: 1;
+      }
+      100% {
+        transform: scaleY(0.5);
+        opacity: 0.6;
+      }
+    }
+
+    /* ──────────────── VARIANT: SOLID (default ring) ──────────────── */
+
+    .variant-solid {
+      border-color: color-mix(in srgb, currentColor 20%, transparent);
+      border-top-color: currentColor;
+    }
+
+    /* ──────────────── VARIANT: TRACK (strong ring) ───────────────── */
+
+    .variant-track {
+      border-style: solid;
+      border-width: calc(var(--sky-spinner-thickness) + 1px);
+      border-color: color-mix(in srgb, currentColor 55%, transparent);
+      border-top-color: currentColor;
+      border-right-color: color-mix(in srgb, currentColor 35%, transparent);
+      border-bottom-color: color-mix(in srgb, currentColor 25%, transparent);
+      border-left-color: color-mix(in srgb, currentColor 35%, transparent);
+    }
+
+    /* ──────────────── VARIANT: DASHED (dotted arc) ───────────────── */
+
+    .variant-dashed {
+      border-style: dashed;
+      border-color: currentColor;
+      border-left-color: transparent;
+      border-bottom-color: transparent;
+    }
+
+    /* ──────────────── VARIANT: SEGMENT (multi-segment ring) ─────── */
+
+    .variant-segment {
+      position: relative;
+      border: 0;
+    }
+
+    .variant-segment::before {
+      content: "";
+      position: absolute;
+      inset: 0;
+      border-radius: 50%;
+      box-sizing: border-box;
+      background: repeating-conic-gradient(
+        from 0deg,
+        currentColor 0deg 12deg,
+        transparent 12deg 36deg
+      );
+      mask: radial-gradient(
+        farthest-side,
+        transparent calc(100% - var(--sky-spinner-thickness)),
+        #000 100%
+      );
+      -webkit-mask: radial-gradient(
+        farthest-side,
+        transparent calc(100% - var(--sky-spinner-thickness)),
+        #000 100%
+      );
+      animation: spin calc(var(--sky-spinner-speed) * 1.8) linear infinite;
+    }
+
+    /* ──────────────── VARIANT: GRADIENT (conic ring) ─────────────── */
+
+    .variant-gradient {
+      border: 0;
+      background: none;
+    }
+
+    .variant-gradient::before {
+      content: "";
+      position: absolute;
+      inset: 0;
+      border-radius: 50%;
+      background: conic-gradient(
+        from 0deg,
+        transparent,
+        currentColor,
+        transparent
+      );
+      animation: spin var(--sky-spinner-speed) linear infinite;
+      mask: radial-gradient(
+        farthest-side,
+        transparent calc(100% - var(--sky-spinner-thickness)),
+        #000 100%
+      );
+      -webkit-mask: radial-gradient(
+        farthest-side,
+        transparent calc(100% - var(--sky-spinner-thickness)),
+        #000 100%
+      );
+    }
+
+    /* ──────────────── VARIANT: DUAL (two opposite arcs) ─────────── */
+
+    .variant-dual {
+      border-style: solid;
+      border-width: var(--sky-spinner-thickness);
+      border-color: transparent;
+      border-top-color: currentColor;
+      border-bottom-color: currentColor;
+      animation: spin var(--sky-spinner-speed) linear infinite;
+    }
+
+    /* ──────────────── VARIANT: MATERIAL (sweeping arc) ──────────── */
+
+    .variant-material {
+      position: relative;
+      border: 0;
+    }
+
+    .variant-material::before {
+      content: "";
+      position: absolute;
+      inset: 0;
+      border-radius: 50%;
+      box-sizing: border-box;
+      background: conic-gradient(
+        from 0deg,
+        transparent 0deg,
+        transparent 70deg,
+        currentColor 70deg,
+        currentColor 230deg,
+        transparent 230deg,
+        transparent 360deg
+      );
+      mask: radial-gradient(
+        farthest-side,
+        transparent calc(100% - var(--sky-spinner-thickness)),
+        #000 100%
+      );
+      -webkit-mask: radial-gradient(
+        farthest-side,
+        transparent calc(100% - var(--sky-spinner-thickness)),
+        #000 100%
+      );
+      animation: spin calc(var(--sky-spinner-speed) * 1.1)
+        cubic-bezier(0.4, 0, 0.2, 1) infinite;
+    }
+
+    /* ──────────────── VARIANT: PULSE (single dot) ───────────────── */
+
+    .variant-pulse {
+      border: 0;
+      border-radius: 50%;
+      width: calc(var(--sky-spinner-size) * 0.5);
+      height: calc(var(--sky-spinner-size) * 0.5);
+      background-color: currentColor;
+      animation: pulse calc(var(--sky-spinner-speed) * 1.1) ease-in-out infinite;
+    }
+
+    /* ──────────────── VARIANT: DOTS (three dots) ────────────────── */
+
+    .dots {
+      display: inline-flex;
+      align-items: center;
+      justify-content: center;
+      gap: calc(var(--sky-spinner-size) * 0.14);
+    }
+
+    .dot {
+      width: calc(var(--sky-spinner-size) * 0.2);
+      height: calc(var(--sky-spinner-size) * 0.2);
+      border-radius: 50%;
+      background-color: currentColor;
+      animation: dots-pulse calc(var(--sky-spinner-speed) * 1.3) ease-in-out
+        infinite;
+    }
+
+    .dot:nth-child(2) {
+      animation-delay: calc(var(--sky-spinner-speed) * 0.18);
+    }
+
+    .dot:nth-child(3) {
+      animation-delay: calc(var(--sky-spinner-speed) * 0.36);
+    }
+
+    /* ──────────────── VARIANT: BARS (four bars) ─────────────────── */
+
+    .bars {
+      display: inline-flex;
+      align-items: flex-end;
+      justify-content: center;
+      gap: calc(var(--sky-spinner-size) * 0.08);
+    }
+
+    .bar {
+      width: calc(var(--sky-spinner-size) * 0.12);
+      height: calc(var(--sky-spinner-size) * 0.35);
+      border-radius: 999px;
+      background-color: currentColor;
+      transform-origin: center bottom;
+      animation: bars-stretch calc(var(--sky-spinner-speed) * 1.4) ease-in-out
+        infinite;
+    }
+
+    .bar:nth-child(2) {
+      animation-delay: calc(var(--sky-spinner-speed) * 0.12);
+    }
+
+    .bar:nth-child(3) {
+      animation-delay: calc(var(--sky-spinner-speed) * 0.24);
+    }
+
+    .bar:nth-child(4) {
+      animation-delay: calc(var(--sky-spinner-speed) * 0.36);
+    }
+
+    /* Pause support for all animated pieces */
+    .is-paused .spinner-circle,
+    .is-paused .variant-gradient::before,
+    .is-paused .variant-segment::before,
+    .is-paused .variant-material::before,
+    .is-paused .dot,
+    .is-paused .bar,
+    .is-paused .variant-pulse {
+      animation-play-state: paused;
+    }
+  `}render(){const e={spinner:!0,"is-paused":this.paused},r={"spinner-circle":!0,[`variant-${this.variant}`]:!0},t=this.resolveSize(),i=this.resolveThickness(t),a=this.resolveLabelSize(t),n=this.resolveLabelGap(t),d={"--sky-spinner-speed":`${this.normalizedSpeed}s`,"--sky-spinner-size":t,"--sky-spinner-thickness":i,"--sky-spinner-label-size":a,"--sky-spinner-label-gap":n,color:p(this.color)};this.applyOverlayStyles(d);const c=this.ariaLabel||(this.showText?this.text:"Loading");let y;return y="dots"===this.variant?this.renderDots():"bars"===this.variant?this.renderBars():s`<div class=${o(r)}></div>`,s`
+      <div
+        class=${o(e)}
+        role="status"
+        aria-live="polite"
+        aria-busy="true"
+        aria-label=${c}
+        style=${l(d)}
+      >
+        ${y}
+        ${this.showText?s`<span class="spinner-text">${this.text}</span>`:""}
+      </div>
+    `}renderDots(){return s`
+      <div class="dots">
+        <div class="dot"></div>
+        <div class="dot"></div>
+        <div class="dot"></div>
+      </div>
+    `}renderBars(){return s`
+      <div class="bars">
+        <div class="bar"></div>
+        <div class="bar"></div>
+        <div class="bar"></div>
+        <div class="bar"></div>
+      </div>
+    `}get normalizedSpeed(){return!this.speed||this.speed<=0?1:this.speed}resolveLabelSize(e){const r=parseFloat(e);if(Number.isNaN(r))return"0.875rem";return`${Math.max(11,Math.min(18,Math.round(.5*r)))}px`}resolveLabelGap(e){const r=parseFloat(e);if(Number.isNaN(r))return"8px";return`${Math.max(6,Math.min(16,Math.round(.25*r)))}px`}resolveSize(){const e=(this.size||"").trim(),r=e.toLowerCase(),t={xs:"12px",sm:"16px",md:"24px",lg:"32px",xl:"40px"};return r in t?t[r]:e?/^\d+$/u.test(e)?`${e}px`:e:"24px"}applyOverlayStyles(e){if(this.fullscreen)return e.position="fixed",e.top="0",e.left="0",e.width="100vw",e.height="100vh",e["background-color"]="rgba(0, 0, 0, 0.4)",e["z-index"]="9999",e.display="flex",e["align-items"]="center",e["justify-content"]="center",void(this.backdropBlur&&(e["backdrop-filter"]="blur(4px)"));this.overlay&&(e.position="absolute",e.top="0",e.left="0",e.width="100%",e.height="100%",e["background-color"]="var(--sky-overlay-primary, rgba(0,0,0,0.4))",e["z-index"]="999",e.display="flex",e["align-items"]="center",e["justify-content"]="center",this.backdropBlur&&(e["backdrop-filter"]="var(--sky-blur-primary, blur(4px))"))}resolveThickness(e){const r=parseFloat(e);return Number.isNaN(r)?"3px":r<=16?"2px":r<=28?"3px":"4px"}updated(e){e.has("speed")&&(!this.speed||this.speed<=0)&&(this.speed=1)}};e([a({type:String}),r("design:type",String)],d.prototype,"variant",void 0),e([a({type:String}),r("design:type",String)],d.prototype,"size",void 0),e([a({type:String}),r("design:type",String)],d.prototype,"color",void 0),e([a({type:Boolean}),r("design:type",Object)],d.prototype,"showText",void 0),e([a({type:String}),r("design:type",Object)],d.prototype,"text",void 0),e([a({type:String}),r("design:type",Object)],d.prototype,"ariaLabel",void 0),e([a({type:Boolean}),r("design:type",Object)],d.prototype,"overlay",void 0),e([a({type:Boolean}),r("design:type",Object)],d.prototype,"fullscreen",void 0),e([a({type:Boolean}),r("design:type",Object)],d.prototype,"backdropBlur",void 0),e([a({type:Number}),r("design:type",Object)],d.prototype,"speed",void 0),e([a({type:Boolean}),r("design:type",Object)],d.prototype,"paused",void 0),d=e([n("sky-spinner")],d);export{d as SkySpinner};
+//# sourceMappingURL=sky-spinner.js.map

package/dist/sky-spinner/sky-spinner.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"sky-spinner.js","sources":["../../src/sky-spinner/sky-spinner.ts"],"sourcesContent":[null],"names":["SkySpinner","LitElement","constructor","this","variant","size","color","showText","text","ariaLabel","overlay","fullscreen","backdropBlur","speed","paused","styles","css","render","spinnerClasses","spinner","circleClasses","sizeValue","resolveSize","thickness","resolveThickness","labelSize","resolveLabelSize","labelGap","resolveLabelGap","rootStyles","normalizedSpeed","resolveColor","applyOverlayStyles","visual","renderDots","renderBars","html","classMap","styleMap","numeric","parseFloat","Number","isNaN","Math","max","min","round","n","raw","trim","preset","toLowerCase","presetMap","xs","sm","md","lg","xl","test","updated","changed","has","__decorate","property","type","String","prototype","Boolean","customElement"],"mappings":"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"}

package/dist/sky-steps/index.d.ts

@@ -0,0 +1 @@
+export * from "./sky-steps";

package/dist/sky-steps/index.js

@@ -0,0 +1 @@
+export * from './sky-steps.js';