@skdx/vue 0.27.0 → 0.29.0

package/dist/progress/Progress.vue.d.cts

@@ -1,25 +1,100 @@
+import { type ProgressRole } from './context.cjs';
 /**
- * The Vue implementation of the shared Progress contract (see
- * `@skdx/shared`'s `progressContract`). Clamps `value` between 0 and `max`,
- * renders `role="progressbar"` with the matching `aria-value*` attributes,
- * and `provide()`s value/max to `<SkdxProgressIndicator>` via context.
+ * Progress root that clamps `value` and renders `role="progressbar"` — or, under `role="meter"`, a static gauge with `low`/`high`/`optimum` bands.
+ *
+ * ```vue
+ * <SkdxProgress :value="66" label="Uploading" show-value />
+ * ```
  */
 type __VLS_Props = {
-    /** Current value. null renders an indeterminate progress bar. */
+    /** Current value. null renders an indeterminate progress bar, and clamps from zero under `role="meter"`. */
     value?: number | null;
-    /** Maximum value that value is measured against. */
+    /**
+     * What the root reports: a task in flight, or a static scalar within a known range.
+     * @default 'progressbar'
+     */
+    role?: ProgressRole;
+    /**
+     * Upper edge of the low band; with `high` and `optimum` this decides `data-range`. Read only under `role="meter"`.
+     * @default undefined — no low band.
+     */
+    low?: number | undefined;
+    /**
+     * Lower edge of the high band, the upper counterpart of `low`. Read only under `role="meter"`.
+     * @default undefined — no high band.
+     */
+    high?: number | undefined;
+    /**
+     * The ideal value, deciding which end of the range counts as good. Read only under `role="meter"`.
+     * @default undefined — no band is preferred.
+     */
+    optimum?: number | undefined;
+    /** Lower bound of the range, reflected as aria-valuemin. */
+    min?: number;
+    /** Upper bound of the range that value is measured against. */
     max?: number;
-    /** Formats aria-valuetext. Defaults to a rounded percentage. */
-    getValueLabel?: (value: number, max: number) => string;
+    /** A second, further-along value published by the Indicator as `--skdx-progress-buffer`; changes no ARIA. */
+    buffer?: number | null;
+    /** Formats aria-valuetext and Value part; defaults to rounded percentage. */
+    getValueLabel?: ((value: number, min: number, max: number) => string) | undefined;
+    /** Intl.NumberFormat options for `aria-valuetext` and Value, formatting the raw value; `getValueLabel` overrides it. */
+    formatOptions?: Intl.NumberFormatOptions | undefined;
+    /** BCP-47 locale for formatting, ensuring server/browser consistency. */
+    locale?: string | undefined;
+    /**
+     * Renders circular anatomy (Circle wrapping CircleIndicator) instead of bar.
+     * @default false
+     */
+    circular?: boolean;
+    /**
+     * Visible name rendered as derived Label, wired to aria-labelledby.
+     * @default undefined
+     */
+    label?: string | undefined;
+    /**
+     * Renders a derived Value readout alongside the bar or ring.
+     * @default false
+     */
+    showValue?: boolean;
+    /**
+     * Forces the indeterminate state regardless of `value`.
+     * @default false
+     */
+    indeterminate?: boolean;
+    /**
+     * Outer diameter of the derived ring, in unitless SVG user units. Applies
+     * only while `circular`.
+     * @default 48
+     */
+    diameter?: number;
+    /**
+     * Stroke width of the derived ring, in the same units as `diameter`.
+     * Applies only while `circular`.
+     * @default 4
+     */
+    strokeWidth?: number;
 };
 declare var __VLS_1: {};
 type __VLS_Slots = {} & {
     default?: (props: typeof __VLS_1) => any;
 };
 declare const __VLS_component: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {
-    value: number | null;
+    role: ProgressRole;
+    indeterminate: boolean;
     max: number;
-    getValueLabel: (value: number, max: number) => string;
+    min: number;
+    value: number | null;
+    high: number | undefined;
+    low: number | undefined;
+    optimum: number | undefined;
+    diameter: number;
+    strokeWidth: number;
+    circular: boolean;
+    showValue: boolean;
+    buffer: number | null;
+    getValueLabel: ((value: number, min: number, max: number) => string) | undefined;
+    formatOptions: Intl.NumberFormatOptions | undefined;
+    locale: string | undefined;
 }, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
 declare const _default: __VLS_WithSlots<typeof __VLS_component, __VLS_Slots>;
 export default _default;

package/dist/progress/Progress.vue.d.ts

@@ -1,25 +1,100 @@
+import { type ProgressRole } from './context.js';
 /**
- * The Vue implementation of the shared Progress contract (see
- * `@skdx/shared`'s `progressContract`). Clamps `value` between 0 and `max`,
- * renders `role="progressbar"` with the matching `aria-value*` attributes,
- * and `provide()`s value/max to `<SkdxProgressIndicator>` via context.
+ * Progress root that clamps `value` and renders `role="progressbar"` — or, under `role="meter"`, a static gauge with `low`/`high`/`optimum` bands.
+ *
+ * ```vue
+ * <SkdxProgress :value="66" label="Uploading" show-value />
+ * ```
  */
 type __VLS_Props = {
-    /** Current value. null renders an indeterminate progress bar. */
+    /** Current value. null renders an indeterminate progress bar, and clamps from zero under `role="meter"`. */
     value?: number | null;
-    /** Maximum value that value is measured against. */
+    /**
+     * What the root reports: a task in flight, or a static scalar within a known range.
+     * @default 'progressbar'
+     */
+    role?: ProgressRole;
+    /**
+     * Upper edge of the low band; with `high` and `optimum` this decides `data-range`. Read only under `role="meter"`.
+     * @default undefined — no low band.
+     */
+    low?: number | undefined;
+    /**
+     * Lower edge of the high band, the upper counterpart of `low`. Read only under `role="meter"`.
+     * @default undefined — no high band.
+     */
+    high?: number | undefined;
+    /**
+     * The ideal value, deciding which end of the range counts as good. Read only under `role="meter"`.
+     * @default undefined — no band is preferred.
+     */
+    optimum?: number | undefined;
+    /** Lower bound of the range, reflected as aria-valuemin. */
+    min?: number;
+    /** Upper bound of the range that value is measured against. */
     max?: number;
-    /** Formats aria-valuetext. Defaults to a rounded percentage. */
-    getValueLabel?: (value: number, max: number) => string;
+    /** A second, further-along value published by the Indicator as `--skdx-progress-buffer`; changes no ARIA. */
+    buffer?: number | null;
+    /** Formats aria-valuetext and Value part; defaults to rounded percentage. */
+    getValueLabel?: ((value: number, min: number, max: number) => string) | undefined;
+    /** Intl.NumberFormat options for `aria-valuetext` and Value, formatting the raw value; `getValueLabel` overrides it. */
+    formatOptions?: Intl.NumberFormatOptions | undefined;
+    /** BCP-47 locale for formatting, ensuring server/browser consistency. */
+    locale?: string | undefined;
+    /**
+     * Renders circular anatomy (Circle wrapping CircleIndicator) instead of bar.
+     * @default false
+     */
+    circular?: boolean;
+    /**
+     * Visible name rendered as derived Label, wired to aria-labelledby.
+     * @default undefined
+     */
+    label?: string | undefined;
+    /**
+     * Renders a derived Value readout alongside the bar or ring.
+     * @default false
+     */
+    showValue?: boolean;
+    /**
+     * Forces the indeterminate state regardless of `value`.
+     * @default false
+     */
+    indeterminate?: boolean;
+    /**
+     * Outer diameter of the derived ring, in unitless SVG user units. Applies
+     * only while `circular`.
+     * @default 48
+     */
+    diameter?: number;
+    /**
+     * Stroke width of the derived ring, in the same units as `diameter`.
+     * Applies only while `circular`.
+     * @default 4
+     */
+    strokeWidth?: number;
 };
 declare var __VLS_1: {};
 type __VLS_Slots = {} & {
     default?: (props: typeof __VLS_1) => any;
 };
 declare const __VLS_component: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {
-    value: number | null;
+    role: ProgressRole;
+    indeterminate: boolean;
     max: number;
-    getValueLabel: (value: number, max: number) => string;
+    min: number;
+    value: number | null;
+    high: number | undefined;
+    low: number | undefined;
+    optimum: number | undefined;
+    diameter: number;
+    strokeWidth: number;
+    circular: boolean;
+    showValue: boolean;
+    buffer: number | null;
+    getValueLabel: ((value: number, min: number, max: number) => string) | undefined;
+    formatOptions: Intl.NumberFormatOptions | undefined;
+    locale: string | undefined;
 }, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
 declare const _default: __VLS_WithSlots<typeof __VLS_component, __VLS_Slots>;
 export default _default;

package/dist/progress/Progress.vue_vue_type_script_setup_true_lang.cjs

@@ -1 +1 @@
-const r=require("./context.cjs");let e=require("vue");var d=["aria-valuemax","aria-valuenow","aria-valuetext","data-state","data-value","data-max"],n=(0,e.defineComponent)({__name:"Progress",props:{value:{default:null},max:{default:100},getValueLabel:{type:Function,default:(u,a)=>`${Math.round(u/a*100)}%`}},setup(u){const a=u,t=(0,e.computed)(()=>a.value==null?null:Math.min(Math.max(a.value,0),a.max)),l=(0,e.computed)(()=>a.max),o=(0,e.computed)(()=>r.getProgressState(t.value,a.max)),s=(0,e.computed)(()=>t.value!=null?a.getValueLabel(t.value,a.max):void 0);return(0,e.provide)(r.PROGRESS_CONTEXT,{value:t,max:l}),(v,m)=>((0,e.openBlock)(),(0,e.createElementBlock)("div",{class:"skdx-progress","data-part":"root","data-skdx-component":"progress",role:"progressbar","aria-valuemin":0,"aria-valuemax":l.value,"aria-valuenow":t.value??void 0,"aria-valuetext":s.value,"data-state":o.value,"data-value":t.value??void 0,"data-max":l.value},[(0,e.renderSlot)(v.$slots,"default")],8,d))}});exports.default=n;
+const w=require("../utils/id.cjs"),n=require("./context.cjs"),P=require("./ProgressAnatomy.vue.cjs");let a=require("vue");var k=["role","aria-valuemin","aria-valuemax","aria-valuenow","aria-valuetext","aria-labelledby","data-state","data-value","data-min","data-max","data-range"],y=(0,a.defineComponent)({__name:"Progress",props:{value:{default:null},role:{default:"progressbar"},low:{default:void 0},high:{default:void 0},optimum:{default:void 0},min:{default:0},max:{default:100},buffer:{default:null},getValueLabel:{type:Function,default:void 0},formatOptions:{default:void 0},locale:{default:void 0},circular:{type:Boolean,default:!1},label:{},showValue:{type:Boolean,default:!1},indeterminate:{type:Boolean,default:!1},diameter:{default:48},strokeWidth:{default:4}},setup(o){const e=o,r=(0,a.computed)(()=>e.role==="meter"),p=(0,a.computed)(()=>r.value?e.value??0:e.indeterminate?null:e.value);function g(d,i,f){return e.getValueLabel!==void 0?e.getValueLabel(d,i,f):e.formatOptions!==void 0||e.locale!==void 0?new Intl.NumberFormat(e.locale,e.formatOptions).format(d):`${Math.round(n.getProgressPercent(d,i,f))}%`}const t=(0,a.computed)(()=>e.min),l=(0,a.computed)(()=>r.value?Math.max(e.max,e.min):e.max),u=(0,a.computed)(()=>n.clampProgressValue(p.value,t.value,l.value)),b=(0,a.computed)(()=>r.value?null:n.clampProgressValue(e.buffer,t.value,l.value)),v=(0,a.computed)(()=>r.value&&u.value!=null?n.getProgressRange(u.value,t.value,l.value,{low:e.low,high:e.high,optimum:e.optimum}):void 0),h=(0,a.computed)(()=>r.value?void 0:n.getProgressState(u.value,l.value)),s=(0,a.computed)(()=>u.value!=null?g(u.value,t.value,l.value):void 0),x=(0,a.computed)(()=>r.value&&!n.announcesValueText(e.getValueLabel,e.formatOptions,e.locale,t.value,l.value)?void 0:s.value),c=w.nextId("progress-label"),m=(0,a.ref)(0),V=(0,a.computed)(()=>m.value>0);return(0,a.provide)(n.PROGRESS_CONTEXT,{value:u,min:t,max:l,buffer:b,role:(0,a.computed)(()=>e.role),range:v,labelId:c,setHasLabel:d=>{m.value+=d?1:-1},valueLabel:s}),(d,i)=>((0,a.openBlock)(),(0,a.createElementBlock)("div",{class:"skdx-progress","data-part":"root","data-skdx-component":"progress",role:o.role,"aria-valuemin":t.value,"aria-valuemax":l.value,"aria-valuenow":u.value??void 0,"aria-valuetext":x.value,"aria-labelledby":V.value?(0,a.unref)(c):void 0,"data-state":h.value,"data-value":u.value??void 0,"data-min":t.value,"data-max":l.value,"data-range":v.value},[(0,a.renderSlot)(d.$slots,"default",{},()=>[(0,a.createVNode)(P.default,{circular:!r.value&&o.circular,label:o.label,"show-value":o.showValue,diameter:o.diameter,"stroke-width":o.strokeWidth},null,8,["circular","label","show-value","diameter","stroke-width"])])],8,k))}});exports.default=y;

package/dist/progress/Progress.vue_vue_type_script_setup_true_lang.js

@@ -1 +1 @@
-import{PROGRESS_CONTEXT as a,getProgressState as e}from"./context.js";import{computed as t,createElementBlock as l,defineComponent as u,openBlock as r,provide as o,renderSlot as s}from"vue";var v=["aria-valuemax","aria-valuenow","aria-valuetext","data-state","data-value","data-max"],d=/* @__PURE__ */u({__name:"Progress",props:{value:{default:null},max:{default:100},getValueLabel:{type:Function,default:(a,e)=>`${Math.round(a/e*100)}%`}},setup(u){const d=u,n=t(()=>null==d.value?null:Math.min(Math.max(d.value,0),d.max)),m=t(()=>d.max),i=t(()=>e(n.value,d.max)),x=t(()=>null!=n.value?d.getValueLabel(n.value,d.max):void 0);return o(a,{value:n,max:m}),(a,e)=>(r(),l("div",{class:"skdx-progress","data-part":"root","data-skdx-component":"progress",role:"progressbar","aria-valuemin":0,"aria-valuemax":m.value,"aria-valuenow":n.value??void 0,"aria-valuetext":x.value,"data-state":i.value,"data-value":n.value??void 0,"data-max":m.value},[s(a.$slots,"default")],8,v))}});export{d as default};
+import{nextId as a}from"../utils/id.js";import{PROGRESS_CONTEXT as e,announcesValueText as l,clampProgressValue as t,getProgressPercent as u,getProgressRange as o,getProgressState as r}from"./context.js";import v from"./ProgressAnatomy.vue.js";import{computed as d,createElementBlock as i,createVNode as s,defineComponent as n,openBlock as m,provide as f,ref as p,renderSlot as c,unref as g}from"vue";var b=["role","aria-valuemin","aria-valuemax","aria-valuenow","aria-valuetext","aria-labelledby","data-state","data-value","data-min","data-max","data-range"],x=/* @__PURE__ */n({__name:"Progress",props:{value:{default:null},role:{default:"progressbar"},low:{default:void 0},high:{default:void 0},optimum:{default:void 0},min:{default:0},max:{default:100},buffer:{default:null},getValueLabel:{type:Function,default:void 0},formatOptions:{default:void 0},locale:{default:void 0},circular:{type:Boolean,default:!1},label:{},showValue:{type:Boolean,default:!1},indeterminate:{type:Boolean,default:!1},diameter:{default:48},strokeWidth:{default:4}},setup(n){const x=n,h=d(()=>"meter"===x.role),w=d(()=>h.value?x.value??0:x.indeterminate?null:x.value),V=d(()=>x.min),k=d(()=>h.value?Math.max(x.max,x.min):x.max),P=d(()=>t(w.value,V.value,k.value)),y=d(()=>h.value?null:t(x.buffer,V.value,k.value)),L=d(()=>h.value&&null!=P.value?o(P.value,V.value,k.value,{low:x.low,high:x.high,optimum:x.optimum}):void 0),O=d(()=>h.value?void 0:r(P.value,k.value)),B=d(()=>{return null!=P.value?(a=P.value,e=V.value,l=k.value,void 0!==x.getValueLabel?x.getValueLabel(a,e,l):void 0!==x.formatOptions||void 0!==x.locale?new Intl.NumberFormat(x.locale,x.formatOptions).format(a):`${Math.round(u(a,e,l))}%`):void 0;var a,e,l}),S=d(()=>h.value&&!l(x.getValueLabel,x.formatOptions,x.locale,V.value,k.value)?void 0:B.value),j=a("progress-label"),E=p(0),I=d(()=>E.value>0);return f(e,{value:P,min:V,max:k,buffer:y,role:d(()=>x.role),range:L,labelId:j,setHasLabel:a=>{E.value+=a?1:-1},valueLabel:B}),(a,e)=>(m(),i("div",{class:"skdx-progress","data-part":"root","data-skdx-component":"progress",role:n.role,"aria-valuemin":V.value,"aria-valuemax":k.value,"aria-valuenow":P.value??void 0,"aria-valuetext":S.value,"aria-labelledby":I.value?g(j):void 0,"data-state":O.value,"data-value":P.value??void 0,"data-min":V.value,"data-max":k.value,"data-range":L.value},[c(a.$slots,"default",{},()=>[s(v,{circular:!h.value&&n.circular,label:n.label,"show-value":n.showValue,diameter:n.diameter,"stroke-width":n.strokeWidth},null,8,["circular","label","show-value","diameter","stroke-width"])])],8,b))}});export{x as default};

package/dist/progress/ProgressAnatomy.vue.cjs

@@ -0,0 +1 @@
+const e=require("./ProgressAnatomy.vue_vue_type_script_setup_true_lang.cjs");var r=e.default;exports.default=r;

package/dist/progress/ProgressAnatomy.vue.d.cts

@@ -0,0 +1,16 @@
+/** @internal Renders optional Label, linear/circular Indicator, and optional Value. */
+type __VLS_Props = {
+    circular?: boolean | undefined;
+    label?: string | undefined;
+    showValue?: boolean | undefined;
+    diameter?: number | undefined;
+    strokeWidth?: number | undefined;
+};
+declare const _default: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {
+    label: string | undefined;
+    diameter: number | undefined;
+    strokeWidth: number | undefined;
+    circular: boolean | undefined;
+    showValue: boolean | undefined;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+export default _default;

package/dist/progress/ProgressAnatomy.vue.d.ts

@@ -0,0 +1,16 @@
+/** @internal Renders optional Label, linear/circular Indicator, and optional Value. */
+type __VLS_Props = {
+    circular?: boolean | undefined;
+    label?: string | undefined;
+    showValue?: boolean | undefined;
+    diameter?: number | undefined;
+    strokeWidth?: number | undefined;
+};
+declare const _default: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {
+    label: string | undefined;
+    diameter: number | undefined;
+    strokeWidth: number | undefined;
+    circular: boolean | undefined;
+    showValue: boolean | undefined;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+export default _default;

package/dist/progress/ProgressAnatomy.vue.js

@@ -0,0 +1 @@
+import e from"./ProgressAnatomy.vue_vue_type_script_setup_true_lang.js";var r=e;export{r as default};

package/dist/progress/ProgressAnatomy.vue_vue_type_script_setup_true_lang.cjs

@@ -0,0 +1 @@
+const r=require("./ProgressCircle.vue.cjs"),a=require("./ProgressCircleIndicator.vue.cjs"),l=require("./ProgressIndicator.vue.cjs"),o=require("./ProgressLabel.vue.cjs"),u=require("./ProgressValue.vue.cjs");let e=require("vue");var c=(0,e.defineComponent)({__name:"ProgressAnatomy",props:{circular:{type:Boolean,default:!1},label:{default:void 0},showValue:{type:Boolean,default:!1},diameter:{default:48},strokeWidth:{default:4}},setup(t){return(i,d)=>((0,e.openBlock)(),(0,e.createElementBlock)(e.Fragment,null,[t.label?((0,e.openBlock)(),(0,e.createBlock)(o.default,{key:0},{default:(0,e.withCtx)(()=>[(0,e.createTextVNode)((0,e.toDisplayString)(t.label),1)]),_:1})):(0,e.createCommentVNode)("",!0),t.circular?((0,e.openBlock)(),(0,e.createBlock)(r.default,{key:1,diameter:t.diameter,"stroke-width":t.strokeWidth},{default:(0,e.withCtx)(()=>[(0,e.createVNode)(a.default)]),_:1},8,["diameter","stroke-width"])):((0,e.openBlock)(),(0,e.createBlock)(l.default,{key:2})),t.showValue?((0,e.openBlock)(),(0,e.createBlock)(u.default,{key:3})):(0,e.createCommentVNode)("",!0)],64))}});exports.default=c;

package/dist/progress/ProgressAnatomy.vue_vue_type_script_setup_true_lang.js

@@ -0,0 +1 @@
+import e from"./ProgressCircle.vue.js";import r from"./ProgressCircleIndicator.vue.js";import t from"./ProgressIndicator.vue.js";import a from"./ProgressLabel.vue.js";import o from"./ProgressValue.vue.js";import{Fragment as s,createBlock as l,createCommentVNode as i,createElementBlock as d,createTextVNode as m,createVNode as u,defineComponent as c,openBlock as f,toDisplayString as n,withCtx as p}from"vue";var k=/* @__PURE__ */c({__name:"ProgressAnatomy",props:{circular:{type:Boolean,default:!1},label:{default:void 0},showValue:{type:Boolean,default:!1},diameter:{default:48},strokeWidth:{default:4}},setup:c=>(k,g)=>(f(),d(s,null,[c.label?(f(),l(a,{key:0},{default:p(()=>[m(n(c.label),1)]),_:1})):i("",!0),c.circular?(f(),l(e,{key:1,diameter:c.diameter,"stroke-width":c.strokeWidth},{default:p(()=>[u(r)]),_:1},8,["diameter","stroke-width"])):(f(),l(t,{key:2})),c.showValue?(f(),l(o,{key:3})):i("",!0)],64))});export{k as default};

package/dist/progress/ProgressCircle.vue.d.cts

@@ -1,42 +1,23 @@
-/**
- * Circular geometry host for a `<SkdxProgress>`. Renders **no SVG of its own**
- * — it is a plain element that publishes the ring's arithmetic as CSS custom
- * properties, so the consumer brings their own `<svg>` markup and drives
- * `stroke-dasharray` / `stroke-dashoffset` from CSS alone:
- *
- * - `--skdx-progress-circle-size` / `--skdx-progress-circle-thickness` — the props, echoed back.
- * - `--skdx-progress-circle-radius` — `(size - thickness) / 2`, the `r` of the ring's centre line.
- * - `--skdx-progress-circle-circumference` — `2πr`.
- * - `--skdx-progress-dasharray` — the value for `stroke-dasharray`.
- * - `--skdx-progress-circle-offset` — the value for `stroke-dashoffset`; **absent when indeterminate**.
- *
- * Carries the same `data-state` / `data-value` / `data-max` as the linear
- * parts. ARIA lives on the `<SkdxProgress>` root, which this must be used
- * inside — this part adds no second `role="progressbar"`.
- */
+/** Circular geometry host, with no SVG of its own, that publishes ring arithmetic as CSS custom properties. */
 type __VLS_Props = {
     /**
-     * Outer diameter of the ring, in unitless SVG user units — the number you
-     * also put in your own `viewBox="0 0 size size"`. Unitless rather than a
-     * CSS length because it feeds `stroke-dasharray`/`stroke-dashoffset`,
-     * which are path lengths, not lengths CSS can convert.
-     * @default 48 — a ring that reads at body-text scale, so the default renders visibly with no config.
+     * Outer diameter of the ring, in unitless SVG user units, matching the `viewBox` on your own SVG.
+     * @default 48 — a ring that reads at body-text scale.
      */
-    size?: number;
+    diameter?: number | undefined;
     /**
-     * Stroke width of the ring, in the same unitless units as `size`. Insets
-     * the radius by half its value so the stroke stays inside the `size` box.
-     * @default 4 — about a twelfth of the default `size`, thick enough to see and thin enough not to close the hole.
+     * Stroke width of the ring, in the same unitless units as `diameter`; insets the radius by half its value.
+     * @default 4 — thick enough to see, thin enough not to close the hole.
      */
-    thickness?: number;
+    strokeWidth?: number | undefined;
 };
 declare var __VLS_1: {};
 type __VLS_Slots = {} & {
     default?: (props: typeof __VLS_1) => any;
 };
 declare const __VLS_component: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {
-    size: number;
-    thickness: number;
+    diameter: number | undefined;
+    strokeWidth: number | undefined;
 }, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
 declare const _default: __VLS_WithSlots<typeof __VLS_component, __VLS_Slots>;
 export default _default;

package/dist/progress/ProgressCircle.vue.d.ts

@@ -1,42 +1,23 @@
-/**
- * Circular geometry host for a `<SkdxProgress>`. Renders **no SVG of its own**
- * — it is a plain element that publishes the ring's arithmetic as CSS custom
- * properties, so the consumer brings their own `<svg>` markup and drives
- * `stroke-dasharray` / `stroke-dashoffset` from CSS alone:
- *
- * - `--skdx-progress-circle-size` / `--skdx-progress-circle-thickness` — the props, echoed back.
- * - `--skdx-progress-circle-radius` — `(size - thickness) / 2`, the `r` of the ring's centre line.
- * - `--skdx-progress-circle-circumference` — `2πr`.
- * - `--skdx-progress-dasharray` — the value for `stroke-dasharray`.
- * - `--skdx-progress-circle-offset` — the value for `stroke-dashoffset`; **absent when indeterminate**.
- *
- * Carries the same `data-state` / `data-value` / `data-max` as the linear
- * parts. ARIA lives on the `<SkdxProgress>` root, which this must be used
- * inside — this part adds no second `role="progressbar"`.
- */
+/** Circular geometry host, with no SVG of its own, that publishes ring arithmetic as CSS custom properties. */
 type __VLS_Props = {
     /**
-     * Outer diameter of the ring, in unitless SVG user units — the number you
-     * also put in your own `viewBox="0 0 size size"`. Unitless rather than a
-     * CSS length because it feeds `stroke-dasharray`/`stroke-dashoffset`,
-     * which are path lengths, not lengths CSS can convert.
-     * @default 48 — a ring that reads at body-text scale, so the default renders visibly with no config.
+     * Outer diameter of the ring, in unitless SVG user units, matching the `viewBox` on your own SVG.
+     * @default 48 — a ring that reads at body-text scale.
      */
-    size?: number;
+    diameter?: number | undefined;
     /**
-     * Stroke width of the ring, in the same unitless units as `size`. Insets
-     * the radius by half its value so the stroke stays inside the `size` box.
-     * @default 4 — about a twelfth of the default `size`, thick enough to see and thin enough not to close the hole.
+     * Stroke width of the ring, in the same unitless units as `diameter`; insets the radius by half its value.
+     * @default 4 — thick enough to see, thin enough not to close the hole.
      */
-    thickness?: number;
+    strokeWidth?: number | undefined;
 };
 declare var __VLS_1: {};
 type __VLS_Slots = {} & {
     default?: (props: typeof __VLS_1) => any;
 };
 declare const __VLS_component: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {
-    size: number;
-    thickness: number;
+    diameter: number | undefined;
+    strokeWidth: number | undefined;
 }, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
 declare const _default: __VLS_WithSlots<typeof __VLS_component, __VLS_Slots>;
 export default _default;

package/dist/progress/ProgressCircle.vue_vue_type_script_setup_true_lang.cjs

@@ -1 +1 @@
-const r=require("./context.cjs");let e=require("vue");var p=["data-state","data-value","data-max"],_=(0,e.defineComponent)({__name:"ProgressCircle",props:{size:{default:48},thickness:{default:4}},setup(o){const s=o,c=(0,e.inject)(r.PROGRESS_CONTEXT);if(!c)throw new Error("<SkdxProgressCircle> must be used inside <SkdxProgress>.");const t=c,l=(0,e.computed)(()=>s.size),i=(0,e.computed)(()=>s.thickness),a=(0,e.computed)(()=>r.getCircleRadius(s.size,s.thickness)),u=(0,e.computed)(()=>2*Math.PI*a.value),n=(0,e.computed)(()=>r.getProgressState(t.value.value,t.max.value)),d=(0,e.computed)(()=>({"--skdx-progress-circle-size":s.size,"--skdx-progress-circle-thickness":s.thickness,"--skdx-progress-circle-radius":r.roundGeometry(a.value),...r.getCircleVars(u.value,t.value.value,t.max.value)}));return(0,e.provide)(r.PROGRESS_CIRCLE_CONTEXT,{size:l,thickness:i,radius:a,circumference:u}),(v,m)=>((0,e.openBlock)(),(0,e.createElementBlock)("div",{class:"skdx-progress__circle","data-part":"circle","data-state":n.value,"data-value":(0,e.unref)(t).value.value??void 0,"data-max":(0,e.unref)(t).max.value,style:(0,e.normalizeStyle)(d.value)},[(0,e.renderSlot)(v.$slots,"default")],12,p))}});exports.default=_;
+const m=require("../utils/injectRequired.cjs"),a=require("./context.cjs");let e=require("vue");var v=["data-state","data-value","data-min","data-max"],p=(0,e.defineComponent)({__name:"ProgressCircle",props:{diameter:{default:48},strokeWidth:{default:4}},setup(d){const r=d,t=m.injectRequired(a.PROGRESS_CONTEXT,"<SkdxProgressCircle> must be used inside <SkdxProgress>."),i=(0,e.computed)(()=>r.diameter),o=(0,e.computed)(()=>r.strokeWidth),s=(0,e.computed)(()=>a.getCircleRadius(r.diameter,r.strokeWidth)),u=(0,e.computed)(()=>2*Math.PI*s.value),c=(0,e.computed)(()=>a.getProgressState(t.value.value,t.max.value)),l=(0,e.computed)(()=>({"--skdx-progress-circle-size":r.diameter,"--skdx-progress-circle-thickness":r.strokeWidth,"--skdx-progress-circle-radius":a.roundGeometry(s.value),...a.getCircleVars(u.value,t.value.value,t.min.value,t.max.value)}));return(0,e.provide)(a.PROGRESS_CIRCLE_CONTEXT,{diameter:i,strokeWidth:o,radius:s,circumference:u}),(n,_)=>((0,e.openBlock)(),(0,e.createElementBlock)("div",{class:"skdx-progress__circle","data-part":"circle","data-state":c.value,"data-value":(0,e.unref)(t).value.value??void 0,"data-min":(0,e.unref)(t).min.value,"data-max":(0,e.unref)(t).max.value,style:(0,e.normalizeStyle)(l.value)},[(0,e.renderSlot)(n.$slots,"default")],12,v))}});exports.default=p;

package/dist/progress/ProgressCircle.vue_vue_type_script_setup_true_lang.js

@@ -1 +1 @@
-import{PROGRESS_CIRCLE_CONTEXT as e,PROGRESS_CONTEXT as s,getCircleRadius as a,getCircleVars as r,getProgressState as t,roundGeometry as l}from"./context.js";import{computed as i,createElementBlock as c,defineComponent as o,inject as u,normalizeStyle as d,openBlock as n,provide as v,renderSlot as m,unref as p}from"vue";var k=["data-state","data-value","data-max"],x=/* @__PURE__ */o({__name:"ProgressCircle",props:{size:{default:48},thickness:{default:4}},setup(o){const x=o,g=u(s);if(!g)throw new Error("<SkdxProgressCircle> must be used inside <SkdxProgress>.");const f=g,C=i(()=>x.size),S=i(()=>x.thickness),h=i(()=>a(x.size,x.thickness)),z=i(()=>2*Math.PI*h.value),E=i(()=>t(f.value.value,f.max.value)),P=i(()=>({"--skdx-progress-circle-size":x.size,"--skdx-progress-circle-thickness":x.thickness,"--skdx-progress-circle-radius":l(h.value),...r(z.value,f.value.value,f.max.value)}));return v(e,{size:C,thickness:S,radius:h,circumference:z}),(e,s)=>(n(),c("div",{class:"skdx-progress__circle","data-part":"circle","data-state":E.value,"data-value":p(f).value.value??void 0,"data-max":p(f).max.value,style:d(P.value)},[m(e.$slots,"default")],12,k))}});export{x as default};
+import{injectRequired as e}from"../utils/injectRequired.js";import{PROGRESS_CIRCLE_CONTEXT as a,PROGRESS_CONTEXT as s,getCircleRadius as r,getCircleVars as t,getProgressState as i,roundGeometry as d}from"./context.js";import{computed as l,createElementBlock as u,defineComponent as o,normalizeStyle as m,openBlock as c,provide as v,renderSlot as n,unref as p}from"vue";var k=["data-state","data-value","data-min","data-max"],x=/* @__PURE__ */o({__name:"ProgressCircle",props:{diameter:{default:48},strokeWidth:{default:4}},setup(o){const x=o,g=e(s,"<SkdxProgressCircle> must be used inside <SkdxProgress>."),f=l(()=>x.diameter),C=l(()=>x.strokeWidth),S=l(()=>r(x.diameter,x.strokeWidth)),R=l(()=>2*Math.PI*S.value),h=l(()=>i(g.value.value,g.max.value)),P=l(()=>({"--skdx-progress-circle-size":x.diameter,"--skdx-progress-circle-thickness":x.strokeWidth,"--skdx-progress-circle-radius":d(S.value),...t(R.value,g.value.value,g.min.value,g.max.value)}));return v(a,{diameter:f,strokeWidth:C,radius:S,circumference:R}),(e,a)=>(c(),u("div",{class:"skdx-progress__circle","data-part":"circle","data-state":h.value,"data-value":p(g).value.value??void 0,"data-min":p(g).min.value,"data-max":p(g).max.value,style:m(P.value)},[n(e.$slots,"default")],12,k))}});export{x as default};

package/dist/progress/ProgressCircleIndicator.vue.d.cts

@@ -1,14 +1,5 @@
 /**
- * The swept arc of a `<SkdxProgressCircle>` — the circular counterpart of
- * `<SkdxProgressIndicator>`. Mirrors the root's `data-state` / `data-value` /
- * `data-max`, and repeats the value-dependent ring properties
- * (`--skdx-progress-circle-circumference`, `--skdx-progress-dasharray`,
- * `--skdx-progress-circle-offset`) on itself so this element can be styled
- * directly, plus `--skdx-progress` as a percentage for anything measured in
- * percent rather than path length.
- *
- * Usually rendered as the `<circle>` (or `<path>`) it drives via `as`, since a
- * `div` has no stroke. Must be used inside `<SkdxProgressCircle>`.
+ * Swept arc for `<SkdxProgressCircle>`, mirroring data-state/value/max and exposing CSS properties.
  *
  * @example
  * ```vue
@@ -21,9 +12,8 @@
  */
 type __VLS_Props = {
     /**
-     * Tag name to render. Vue has no `asChild`, so this is how the arc becomes
-     * the SVG element it drives — `as="circle"` inside your own `<svg>`.
-     * @default 'div' — a plain block element, matching every other part in this package; useless inside an `<svg>`, so pass `"circle"` or `"path"` there.
+     * Tag name to render (e.g., 'circle', 'path' for SVG).
+     * @default 'div'
      */
     as?: string;
 };

package/dist/progress/ProgressCircleIndicator.vue.d.ts

@@ -1,14 +1,5 @@
 /**
- * The swept arc of a `<SkdxProgressCircle>` — the circular counterpart of
- * `<SkdxProgressIndicator>`. Mirrors the root's `data-state` / `data-value` /
- * `data-max`, and repeats the value-dependent ring properties
- * (`--skdx-progress-circle-circumference`, `--skdx-progress-dasharray`,
- * `--skdx-progress-circle-offset`) on itself so this element can be styled
- * directly, plus `--skdx-progress` as a percentage for anything measured in
- * percent rather than path length.
- *
- * Usually rendered as the `<circle>` (or `<path>`) it drives via `as`, since a
- * `div` has no stroke. Must be used inside `<SkdxProgressCircle>`.
+ * Swept arc for `<SkdxProgressCircle>`, mirroring data-state/value/max and exposing CSS properties.
  *
  * @example
  * ```vue
@@ -21,9 +12,8 @@
  */
 type __VLS_Props = {
     /**
-     * Tag name to render. Vue has no `asChild`, so this is how the arc becomes
-     * the SVG element it drives — `as="circle"` inside your own `<svg>`.
-     * @default 'div' — a plain block element, matching every other part in this package; useless inside an `<svg>`, so pass `"circle"` or `"path"` there.
+     * Tag name to render (e.g., 'circle', 'path' for SVG).
+     * @default 'div'
      */
     as?: string;
 };

package/dist/progress/ProgressCircleIndicator.vue_vue_type_script_setup_true_lang.cjs

@@ -1 +1 @@
-const r=require("./context.cjs");let e=require("vue");var n=(0,e.defineComponent)({__name:"ProgressCircleIndicator",props:{as:{default:"div"}},setup(l){const a=(0,e.inject)(r.PROGRESS_CONTEXT);if(!a)throw new Error("<SkdxProgressCircleIndicator> must be used inside <SkdxProgress>.");const s=(0,e.inject)(r.PROGRESS_CIRCLE_CONTEXT);if(!s)throw new Error("<SkdxProgressCircleIndicator> must be used inside <SkdxProgressCircle>.");const t=a,o=s,u=(0,e.computed)(()=>r.getProgressState(t.value.value,t.max.value)),c=(0,e.computed)(()=>({"--skdx-progress":t.value.value!=null?`${t.value.value/t.max.value*100}%`:void 0,...r.getCircleVars(o.circumference.value,t.value.value,t.max.value)}));return(i,d)=>((0,e.openBlock)(),(0,e.createBlock)((0,e.resolveDynamicComponent)(l.as),{class:"skdx-progress__circle-indicator","data-part":"circle-indicator","data-state":u.value,"data-value":(0,e.unref)(t).value.value??void 0,"data-max":(0,e.unref)(t).max.value,style:(0,e.normalizeStyle)(c.value)},null,8,["data-state","data-value","data-max","style"]))}});exports.default=n;
+const t=require("../utils/injectRequired.cjs"),r=require("./context.cjs");let a=require("vue");var n=(0,a.defineComponent)({__name:"ProgressCircleIndicator",props:{as:{default:"div"}},setup(u){const e=t.injectRequired(r.PROGRESS_CONTEXT,"<SkdxProgressCircleIndicator> must be used inside <SkdxProgress>."),s=t.injectRequired(r.PROGRESS_CIRCLE_CONTEXT,"<SkdxProgressCircleIndicator> must be used inside <SkdxProgressCircle>."),l=(0,a.computed)(()=>r.getProgressState(e.value.value,e.max.value)),i=(0,a.computed)(()=>({"--skdx-progress":e.value.value!=null?`${r.getProgressPercent(e.value.value,e.min.value,e.max.value)}%`:void 0,...r.getCircleVars(s.circumference.value,e.value.value,e.min.value,e.max.value)}));return(c,o)=>((0,a.openBlock)(),(0,a.createBlock)((0,a.resolveDynamicComponent)(u.as),{class:"skdx-progress__circle-indicator","data-part":"circle-indicator","data-state":l.value,"data-value":(0,a.unref)(e).value.value??void 0,"data-min":(0,a.unref)(e).min.value,"data-max":(0,a.unref)(e).max.value,style:(0,a.normalizeStyle)(i.value)},null,8,["data-state","data-value","data-min","data-max","style"]))}});exports.default=n;

package/dist/progress/ProgressCircleIndicator.vue_vue_type_script_setup_true_lang.js

@@ -1 +1 @@
-import{PROGRESS_CIRCLE_CONTEXT as e,PROGRESS_CONTEXT as a,getCircleVars as r,getProgressState as s}from"./context.js";import{computed as t,createBlock as l,defineComponent as o,inject as u,normalizeStyle as i,openBlock as d,resolveDynamicComponent as c,unref as n}from"vue";var v=/* @__PURE__ */o({__name:"ProgressCircleIndicator",props:{as:{default:"div"}},setup(o){const v=u(a);if(!v)throw new Error("<SkdxProgressCircleIndicator> must be used inside <SkdxProgress>.");const m=u(e);if(!m)throw new Error("<SkdxProgressCircleIndicator> must be used inside <SkdxProgressCircle>.");const x=v,p=m,C=t(()=>s(x.value.value,x.max.value)),g=t(()=>({"--skdx-progress":null!=x.value.value?x.value.value/x.max.value*100+"%":void 0,...r(p.circumference.value,x.value.value,x.max.value)}));return(e,a)=>(d(),l(c(o.as),{class:"skdx-progress__circle-indicator","data-part":"circle-indicator","data-state":C.value,"data-value":n(x).value.value??void 0,"data-max":n(x).max.value,style:i(g.value)},null,8,["data-state","data-value","data-max","style"]))}});export{v as default};
+import{injectRequired as e}from"../utils/injectRequired.js";import{PROGRESS_CIRCLE_CONTEXT as a,PROGRESS_CONTEXT as s,getCircleVars as r,getProgressPercent as t,getProgressState as l}from"./context.js";import{computed as u,createBlock as i,defineComponent as o,normalizeStyle as d,openBlock as n,resolveDynamicComponent as c,unref as v}from"vue";var m=/* @__PURE__ */o({__name:"ProgressCircleIndicator",props:{as:{default:"div"}},setup(o){const m=e(s,"<SkdxProgressCircleIndicator> must be used inside <SkdxProgress>."),p=e(a,"<SkdxProgressCircleIndicator> must be used inside <SkdxProgressCircle>."),x=u(()=>l(m.value.value,m.max.value)),g=u(()=>({"--skdx-progress":null!=m.value.value?`${t(m.value.value,m.min.value,m.max.value)}%`:void 0,...r(p.circumference.value,m.value.value,m.min.value,m.max.value)}));return(e,a)=>(n(),i(c(o.as),{class:"skdx-progress__circle-indicator","data-part":"circle-indicator","data-state":x.value,"data-value":v(m).value.value??void 0,"data-min":v(m).min.value,"data-max":v(m).max.value,style:d(g.value)},null,8,["data-state","data-value","data-min","data-max","style"]))}});export{m as default};

package/dist/progress/ProgressIndicator.vue.d.cts

@@ -1,9 +1,14 @@
-/**
- * The visual fill of a `<SkdxProgress>` bar. Mirrors the root's `data-state`
- * / `data-value` / `data-max` and sets a `--skdx-progress` CSS custom
- * property (a percentage) so width/transform can be driven purely from CSS.
- * Must be used inside `<SkdxProgress>`.
- */
+/** Visual fill of the bar or gauge, setting `--skdx-progress` and `--skdx-progress-buffer` as CSS custom properties. */
 type __VLS_Props = {};
-declare const _default: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare var __VLS_1: {};
+type __VLS_Slots = {} & {
+    default?: (props: typeof __VLS_1) => any;
+};
+declare const __VLS_component: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: __VLS_WithSlots<typeof __VLS_component, __VLS_Slots>;
 export default _default;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/progress/ProgressIndicator.vue.d.ts

@@ -1,9 +1,14 @@
-/**
- * The visual fill of a `<SkdxProgress>` bar. Mirrors the root's `data-state`
- * / `data-value` / `data-max` and sets a `--skdx-progress` CSS custom
- * property (a percentage) so width/transform can be driven purely from CSS.
- * Must be used inside `<SkdxProgress>`.
- */
+/** Visual fill of the bar or gauge, setting `--skdx-progress` and `--skdx-progress-buffer` as CSS custom properties. */
 type __VLS_Props = {};
-declare const _default: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare var __VLS_1: {};
+type __VLS_Slots = {} & {
+    default?: (props: typeof __VLS_1) => any;
+};
+declare const __VLS_component: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: __VLS_WithSlots<typeof __VLS_component, __VLS_Slots>;
 export default _default;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/progress/ProgressIndicator.vue_vue_type_script_setup_true_lang.cjs

@@ -1 +1 @@
-const r=require("./context.cjs");let e=require("vue");var u=["data-state","data-value","data-max"],l=(0,e.defineComponent)({__name:"ProgressIndicator",setup(n){const a=(0,e.inject)(r.PROGRESS_CONTEXT);if(!a)throw new Error("<SkdxProgressIndicator> must be used inside <SkdxProgress>.");const t=a,s=(0,e.computed)(()=>r.getProgressState(t.value.value,t.max.value)),o=(0,e.computed)(()=>t.value.value!=null?`${t.value.value/t.max.value*100}%`:void 0);return(d,c)=>((0,e.openBlock)(),(0,e.createElementBlock)("div",{class:"skdx-progress__indicator","data-part":"indicator","data-state":s.value,"data-value":(0,e.unref)(t).value.value??void 0,"data-max":(0,e.unref)(t).max.value,style:(0,e.normalizeStyle)({"--skdx-progress":o.value})},null,12,u))}});exports.default=l;
+const n=require("../utils/injectRequired.cjs"),r=require("./context.cjs");let a=require("vue");var o=["data-state","data-range","data-value","data-min","data-max"],d=(0,a.defineComponent)({__name:"ProgressIndicator",setup(v){const e=n.injectRequired(r.PROGRESS_CONTEXT,"<SkdxProgressIndicator> must be used inside <SkdxProgress>."),t=(0,a.computed)(()=>e.role.value==="meter"?void 0:r.getProgressState(e.value.value,e.max.value)),u=(0,a.computed)(()=>e.value.value!=null?`${r.getProgressPercent(e.value.value,e.min.value,e.max.value)}%`:void 0),s=(0,a.computed)(()=>e.buffer.value!=null?`${r.getProgressPercent(e.buffer.value,e.min.value,e.max.value)}%`:void 0);return(l,i)=>((0,a.openBlock)(),(0,a.createElementBlock)("div",{class:"skdx-progress__indicator","data-part":"indicator","data-state":t.value,"data-range":(0,a.unref)(e).range.value,"data-value":(0,a.unref)(e).value.value??void 0,"data-min":(0,a.unref)(e).min.value,"data-max":(0,a.unref)(e).max.value,style:(0,a.normalizeStyle)({"--skdx-progress":u.value,"--skdx-progress-buffer":s.value})},[(0,a.renderSlot)(l.$slots,"default")],12,o))}});exports.default=d;

package/dist/progress/ProgressIndicator.vue_vue_type_script_setup_true_lang.js

@@ -1 +1 @@
-import{PROGRESS_CONTEXT as a,getProgressState as e}from"./context.js";import{computed as t,createElementBlock as s,defineComponent as r,inject as o,normalizeStyle as l,openBlock as u,unref as d}from"vue";var n=["data-state","data-value","data-max"],v=/* @__PURE__ */r({__name:"ProgressIndicator",setup(r){const v=o(a);if(!v)throw new Error("<SkdxProgressIndicator> must be used inside <SkdxProgress>.");const i=v,m=t(()=>e(i.value.value,i.max.value)),c=t(()=>null!=i.value.value?i.value.value/i.max.value*100+"%":void 0);return(a,e)=>(u(),s("div",{class:"skdx-progress__indicator","data-part":"indicator","data-state":m.value,"data-value":d(i).value.value??void 0,"data-max":d(i).max.value,style:l({"--skdx-progress":c.value})},null,12,n))}});export{v as default};
+import{injectRequired as a}from"../utils/injectRequired.js";import{PROGRESS_CONTEXT as e,getProgressPercent as t,getProgressState as r}from"./context.js";import{computed as s,createElementBlock as l,defineComponent as u,normalizeStyle as o,openBlock as d,renderSlot as v,unref as n}from"vue";var i=["data-state","data-range","data-value","data-min","data-max"],m=/* @__PURE__ */u({__name:"ProgressIndicator",setup(u){const m=a(e,"<SkdxProgressIndicator> must be used inside <SkdxProgress>."),c=s(()=>"meter"===m.role.value?void 0:r(m.value.value,m.max.value)),f=s(()=>null!=m.value.value?`${t(m.value.value,m.min.value,m.max.value)}%`:void 0),g=s(()=>null!=m.buffer.value?`${t(m.buffer.value,m.min.value,m.max.value)}%`:void 0);return(a,e)=>(d(),l("div",{class:"skdx-progress__indicator","data-part":"indicator","data-state":c.value,"data-range":n(m).range.value,"data-value":n(m).value.value??void 0,"data-min":n(m).min.value,"data-max":n(m).max.value,style:o({"--skdx-progress":f.value,"--skdx-progress-buffer":g.value})},[v(a.$slots,"default")],12,i))}});export{m as default};

package/dist/progress/ProgressLabel.vue.cjs

@@ -0,0 +1 @@
+const e=require("./ProgressLabel.vue_vue_type_script_setup_true_lang.cjs");var r=e.default;exports.default=r;

package/dist/progress/ProgressLabel.vue.d.cts

@@ -0,0 +1,14 @@
+/** The bar's visible name, rendered as a `<span>` since `role="progressbar"` isn't labelable by `<label for>`. */
+type __VLS_Props = {};
+declare var __VLS_1: {};
+type __VLS_Slots = {} & {
+    default?: (props: typeof __VLS_1) => any;
+};
+declare const __VLS_component: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: __VLS_WithSlots<typeof __VLS_component, __VLS_Slots>;
+export default _default;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/progress/ProgressLabel.vue.d.ts

@@ -0,0 +1,14 @@
+/** The bar's visible name, rendered as a `<span>` since `role="progressbar"` isn't labelable by `<label for>`. */
+type __VLS_Props = {};
+declare var __VLS_1: {};
+type __VLS_Slots = {} & {
+    default?: (props: typeof __VLS_1) => any;
+};
+declare const __VLS_component: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: __VLS_WithSlots<typeof __VLS_component, __VLS_Slots>;
+export default _default;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};