@ctrliq/quantic-components 1.65.0 → 1.67.0

package/dist/quantic-components.min.js

@@ -38431,7 +38431,47 @@ const to="important",io=" !"+to,no=Re(class extends Oe{constructor(e){if(super(e
         width: 100%;
       }
     }
-  `,t([Ie({type:"number",description:"Current progress value (0–100). Omit for indeterminate mode."})],e.Progress.prototype,"value",void 0),t([Ie({type:"ProgressSize",options:Object.values(Uo),default:Uo.Small,description:"Controls the bar height and label font size."})],e.Progress.prototype,"size",void 0),t([Ie({type:"boolean",default:"false",description:"Shows a percentage label next to the bar (only in determinate mode)."})],e.Progress.prototype,"label",void 0),t([Ie({type:"ProgressColor",options:Object.values(Zo),default:Zo.Brand,description:"Fill color of the progress bar."})],e.Progress.prototype,"color",void 0),t([Ie({attribute:"aria-label",type:"string",description:"Accessible label for the progressbar role."})],e.Progress.prototype,"ariaLabel",void 0),t([Ie({type:"string",description:"Accessible description forwarded to aria-description."})],e.Progress.prototype,"description",void 0),e.Progress=t([be("quantic-progress")],e.Progress);const Go=Pi,No={ExtraSmall:"xs",Small:"sm",Medium:"md",Large:"lg",ExtraLarge:"xl"};e.Spinner=class extends Ce{constructor(){super(...arguments),this.size=No.Medium,this.label="Loading"}connectedCallback(){super.connectedCallback(),this.setAttribute("role","status")}render(){return G`
+  `,t([Ie({type:"number",description:"Current progress value (0–100). Omit for indeterminate mode."})],e.Progress.prototype,"value",void 0),t([Ie({type:"ProgressSize",options:Object.values(Uo),default:Uo.Small,description:"Controls the bar height and label font size."})],e.Progress.prototype,"size",void 0),t([Ie({type:"boolean",default:"false",description:"Shows a percentage label next to the bar (only in determinate mode)."})],e.Progress.prototype,"label",void 0),t([Ie({type:"ProgressColor",options:Object.values(Zo),default:Zo.Brand,description:"Fill color of the progress bar."})],e.Progress.prototype,"color",void 0),t([Ie({attribute:"aria-label",type:"string",description:"Accessible label for the progressbar role."})],e.Progress.prototype,"ariaLabel",void 0),t([Ie({type:"string",description:"Accessible description forwarded to aria-description."})],e.Progress.prototype,"description",void 0),e.Progress=t([be("quantic-progress")],e.Progress),e.Skeleton=class extends Ce{render(){return G`
+      <span
+        class="skeleton"
+        aria-hidden="true"
+        style=${no({"--cols":null!=this.cols?String(this.cols):void 0,"--rows":null!=this.rows?String(this.rows):void 0,"animation-delay":null!=this.delay?`${this.delay}s`:void 0})}
+      ></span>
+    `}},e.Skeleton.meta={tag:"quantic-skeleton",description:"Animated placeholder used while content is loading. Renders a shimmering block sized by column span and line-height units.",category:"feedback"},e.Skeleton.styles=l`
+    :host {
+      display: block;
+    }
+
+    .skeleton {
+      display: block;
+      border-radius: var(--quantic-radius-sm);
+      width: calc(var(--cols, 12) / 12 * 100%);
+      height: calc(var(--rows, 1) * 1em);
+      background: linear-gradient(
+        120deg,
+        rgb(var(--quantic-bg-tertiary-rgb) / 0.5) 25%,
+        var(--quantic-bg-tertiary) 50%,
+        rgb(var(--quantic-bg-tertiary-rgb) / 0.5) 75%
+      );
+      background-size: 200% 100%;
+      animation: shimmer var(--quantic-component-skeleton-duration, 2.5s) ease-in-out infinite;
+    }
+
+    @keyframes shimmer {
+      from {
+        background-position: 200% 0;
+      }
+      to {
+        background-position: -200% 0;
+      }
+    }
+
+    @media (prefers-reduced-motion: reduce) {
+      .skeleton {
+        animation: none;
+      }
+    }
+  `,t([Ie({type:"number",description:"Width as a fraction of 12 columns (1–12). Defaults to 12 (full width)."})],e.Skeleton.prototype,"cols",void 0),t([Ie({type:"number",description:"Height as a multiple of 1em. Defaults to 1."})],e.Skeleton.prototype,"rows",void 0),t([Ie({type:"number",description:"Animation delay in seconds. Useful for staggering multiple skeletons."})],e.Skeleton.prototype,"delay",void 0),e.Skeleton=t([be("quantic-skeleton")],e.Skeleton);const Go=Pi,No={ExtraSmall:"xs",Small:"sm",Medium:"md",Large:"lg",ExtraLarge:"xl"};e.Spinner=class extends Ce{constructor(){super(...arguments),this.size=No.Medium,this.label="Loading"}connectedCallback(){super.connectedCallback(),this.setAttribute("role","status")}render(){return G`
       <div
         class=${$e({sizer:!0,[`size--${this.size}`]:!0,[`color--${this.color}`]:!!this.color})}
         aria-hidden="true"