@skdx/vue 0.26.0

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

@@ -0,0 +1,47 @@
+/**
+ * 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"`.
+ */
+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.
+     */
+    size?: number;
+    /**
+     * 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.
+     */
+    thickness?: 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<{}>, {
+    size: number;
+    thickness: number;
+}, {}, {}, {}, 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/ProgressCircle.vue.d.ts

@@ -0,0 +1,47 @@
+/**
+ * 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"`.
+ */
+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.
+     */
+    size?: number;
+    /**
+     * 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.
+     */
+    thickness?: 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<{}>, {
+    size: number;
+    thickness: number;
+}, {}, {}, {}, 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/ProgressCircle.vue.js

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

package/dist/progress/ProgressCircle.vue_vue_type_script_setup_true_lang.cjs

@@ -0,0 +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=_;

package/dist/progress/ProgressCircle.vue_vue_type_script_setup_true_lang.js

@@ -0,0 +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};

package/dist/progress/ProgressCircleIndicator.vue.cjs

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

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

@@ -0,0 +1,33 @@
+/**
+ * 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>`.
+ *
+ * @example
+ * ```vue
+ * <SkdxProgressCircleIndicator
+ *   as="circle"
+ *   cx="32" cy="32" r="29" fill="none" stroke="currentColor" stroke-width="6"
+ *   style="stroke-dasharray: var(--skdx-progress-dasharray); stroke-dashoffset: var(--skdx-progress-circle-offset)"
+ * />
+ * ```
+ */
+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.
+     */
+    as?: string;
+};
+declare const _default: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {
+    as: string;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+export default _default;

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

@@ -0,0 +1,33 @@
+/**
+ * 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>`.
+ *
+ * @example
+ * ```vue
+ * <SkdxProgressCircleIndicator
+ *   as="circle"
+ *   cx="32" cy="32" r="29" fill="none" stroke="currentColor" stroke-width="6"
+ *   style="stroke-dasharray: var(--skdx-progress-dasharray); stroke-dashoffset: var(--skdx-progress-circle-offset)"
+ * />
+ * ```
+ */
+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.
+     */
+    as?: string;
+};
+declare const _default: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {
+    as: string;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+export default _default;

package/dist/progress/ProgressCircleIndicator.vue.js

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

package/dist/progress/ProgressCircleIndicator.vue_vue_type_script_setup_true_lang.cjs

@@ -0,0 +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;

package/dist/progress/ProgressCircleIndicator.vue_vue_type_script_setup_true_lang.js

@@ -0,0 +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};

package/dist/progress/ProgressIndicator.vue.cjs

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

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

@@ -0,0 +1,9 @@
+/**
+ * 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>`.
+ */
+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>;
+export default _default;

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

@@ -0,0 +1,9 @@
+/**
+ * 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>`.
+ */
+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>;
+export default _default;

package/dist/progress/ProgressIndicator.vue.js

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

package/dist/progress/ProgressIndicator.vue_vue_type_script_setup_true_lang.cjs

@@ -0,0 +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;

package/dist/progress/ProgressIndicator.vue_vue_type_script_setup_true_lang.js

@@ -0,0 +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};

package/dist/progress/context.cjs

@@ -0,0 +1 @@
+var o=Symbol("skdx-progress-context");function n(r,e){return r==null?"indeterminate":r>=e?"complete":"loading"}var i=Symbol("skdx-progress-circle-context");function t(r){return Math.round(r*1e4)/1e4}function a(r,e){return Math.max((r-e)/2,0)}function c(r,e,s){return{"--skdx-progress-circle-circumference":t(r),"--skdx-progress-dasharray":t(r),"--skdx-progress-circle-offset":e==null?void 0:t(r*(1-e/s))}}exports.PROGRESS_CIRCLE_CONTEXT=i;exports.PROGRESS_CONTEXT=o;exports.getCircleRadius=a;exports.getCircleVars=c;exports.getProgressState=n;exports.roundGeometry=t;

package/dist/progress/context.d.cts

@@ -0,0 +1,44 @@
+import type { ComputedRef, CSSProperties, InjectionKey } from 'vue';
+/** @internal Injection key a Progress provides so its Indicator part can mirror value/max. */
+export interface ProgressContext {
+    value: ComputedRef<number | null>;
+    max: ComputedRef<number>;
+}
+/** @internal Injection key a Progress provides so its indicator mirrors the current value and max. */
+export declare const PROGRESS_CONTEXT: InjectionKey<ProgressContext>;
+/** @internal Maps a value/max pair to a Progress state: indeterminate when value is null, complete when value >= max, else loading. */
+export declare function getProgressState(value: number | null, max: number): 'indeterminate' | 'loading' | 'complete';
+/** @internal Ring geometry a ProgressCircle provides so its Indicator part can reuse the same arithmetic. */
+export interface ProgressCircleContext {
+    size: ComputedRef<number>;
+    thickness: ComputedRef<number>;
+    radius: ComputedRef<number>;
+    circumference: ComputedRef<number>;
+}
+/** @internal Injection key a ProgressCircle provides so its arc mirrors the ring's geometry. */
+export declare const PROGRESS_CIRCLE_CONTEXT: InjectionKey<ProgressCircleContext>;
+/**
+ * @internal Trims float noise off a geometry value. These land in the DOM as
+ * CSS custom properties a human reads while debugging, and `138.2301` is as
+ * exact as any stroke can be drawn.
+ */
+export declare function roundGeometry(n: number): number;
+/**
+ * @internal Radius of the ring's *centre line*. A stroke straddles its path,
+ * so half of `thickness` sits outside the radius — insetting by `thickness / 2`
+ * is what keeps the ring inside the `size` box instead of clipping at the
+ * viewBox edge. Floored at `0` so a `thickness` wider than `size` degenerates
+ * to a dot rather than a negative circumference.
+ */
+export declare function getCircleRadius(size: number, thickness: number): number;
+/**
+ * @internal The value-dependent half of the ring geometry, shared by
+ * `SkdxProgressCircle` and `SkdxProgressCircleIndicator` so both elements can be
+ * the one a consumer writes `stroke-dashoffset` on.
+ *
+ * `--skdx-progress-circle-offset` is omitted when indeterminate, exactly as
+ * `SkdxProgressIndicator` omits `--skdx-progress`: an unset custom property falls
+ * through to whatever the consumer's own animation sets, instead of pinning the
+ * ring at a value it does not have.
+ */
+export declare function getCircleVars(circumference: number, value: number | null, max: number): CSSProperties;

package/dist/progress/context.d.ts

@@ -0,0 +1,44 @@
+import type { ComputedRef, CSSProperties, InjectionKey } from 'vue';
+/** @internal Injection key a Progress provides so its Indicator part can mirror value/max. */
+export interface ProgressContext {
+    value: ComputedRef<number | null>;
+    max: ComputedRef<number>;
+}
+/** @internal Injection key a Progress provides so its indicator mirrors the current value and max. */
+export declare const PROGRESS_CONTEXT: InjectionKey<ProgressContext>;
+/** @internal Maps a value/max pair to a Progress state: indeterminate when value is null, complete when value >= max, else loading. */
+export declare function getProgressState(value: number | null, max: number): 'indeterminate' | 'loading' | 'complete';
+/** @internal Ring geometry a ProgressCircle provides so its Indicator part can reuse the same arithmetic. */
+export interface ProgressCircleContext {
+    size: ComputedRef<number>;
+    thickness: ComputedRef<number>;
+    radius: ComputedRef<number>;
+    circumference: ComputedRef<number>;
+}
+/** @internal Injection key a ProgressCircle provides so its arc mirrors the ring's geometry. */
+export declare const PROGRESS_CIRCLE_CONTEXT: InjectionKey<ProgressCircleContext>;
+/**
+ * @internal Trims float noise off a geometry value. These land in the DOM as
+ * CSS custom properties a human reads while debugging, and `138.2301` is as
+ * exact as any stroke can be drawn.
+ */
+export declare function roundGeometry(n: number): number;
+/**
+ * @internal Radius of the ring's *centre line*. A stroke straddles its path,
+ * so half of `thickness` sits outside the radius — insetting by `thickness / 2`
+ * is what keeps the ring inside the `size` box instead of clipping at the
+ * viewBox edge. Floored at `0` so a `thickness` wider than `size` degenerates
+ * to a dot rather than a negative circumference.
+ */
+export declare function getCircleRadius(size: number, thickness: number): number;
+/**
+ * @internal The value-dependent half of the ring geometry, shared by
+ * `SkdxProgressCircle` and `SkdxProgressCircleIndicator` so both elements can be
+ * the one a consumer writes `stroke-dashoffset` on.
+ *
+ * `--skdx-progress-circle-offset` is omitted when indeterminate, exactly as
+ * `SkdxProgressIndicator` omits `--skdx-progress`: an unset custom property falls
+ * through to whatever the consumer's own animation sets, instead of pinning the
+ * ring at a value it does not have.
+ */
+export declare function getCircleVars(circumference: number, value: number | null, max: number): CSSProperties;

package/dist/progress/context.js

@@ -0,0 +1 @@
+var r=/* @__PURE__ */Symbol("skdx-progress-context");function e(r,e){return null==r?"indeterminate":r>=e?"complete":"loading"}var s=/* @__PURE__ */Symbol("skdx-progress-circle-context");function t(r){return Math.round(1e4*r)/1e4}function n(r,e){return Math.max((r-e)/2,0)}function o(r,e,s){return{"--skdx-progress-circle-circumference":t(r),"--skdx-progress-dasharray":t(r),"--skdx-progress-circle-offset":null==e?void 0:t(r*(1-e/s))}}export{s as PROGRESS_CIRCLE_CONTEXT,r as PROGRESS_CONTEXT,n as getCircleRadius,o as getCircleVars,e as getProgressState,t as roundGeometry};

package/dist/progress/index.cjs

@@ -0,0 +1 @@
+Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const r=require("./Progress.vue.cjs"),e=require("./ProgressIndicator.vue.cjs"),o=require("./ProgressCircle.vue.cjs"),s=require("./ProgressCircleIndicator.vue.cjs");exports.SkdxProgress=r.default;exports.SkdxProgressCircle=o.default;exports.SkdxProgressCircleIndicator=s.default;exports.SkdxProgressIndicator=e.default;

package/dist/progress/index.d.cts

@@ -0,0 +1,4 @@
+export { default as SkdxProgress } from './Progress.vue.cjs';
+export { default as SkdxProgressIndicator } from './ProgressIndicator.vue.cjs';
+export { default as SkdxProgressCircle } from './ProgressCircle.vue.cjs';
+export { default as SkdxProgressCircleIndicator } from './ProgressCircleIndicator.vue.cjs';

package/dist/progress/index.d.ts

@@ -0,0 +1,4 @@
+export { default as SkdxProgress } from './Progress.vue.js';
+export { default as SkdxProgressIndicator } from './ProgressIndicator.vue.js';
+export { default as SkdxProgressCircle } from './ProgressCircle.vue.js';
+export { default as SkdxProgressCircleIndicator } from './ProgressCircleIndicator.vue.js';

package/dist/progress/index.js

@@ -0,0 +1 @@
+import r from"./Progress.vue.js";import s from"./ProgressIndicator.vue.js";import o from"./ProgressCircle.vue.js";import e from"./ProgressCircleIndicator.vue.js";export{r as SkdxProgress,o as SkdxProgressCircle,e as SkdxProgressCircleIndicator,s as SkdxProgressIndicator};

package/dist/qr-code/QrCode.vue.cjs

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

package/dist/qr-code/QrCode.vue.d.cts

@@ -0,0 +1,103 @@
+import { type QrCodeErrorCorrection } from './context.cjs';
+/**
+ * The Vue implementation of the shared QrCode contract (see `@skdx/shared`'s
+ * `qrCodeContract`). Root of a QR code: encodes `value` once and hands the
+ * resulting module matrix to `SkdxQrCodeFrame` / `SkdxQrCodePattern` /
+ * `SkdxQrCodeOverlay` via `provide()`. Renders a `<div>` carrying
+ * `--skdx-qr-code-size` — the module count, e.g. `29` — as an inline custom
+ * property, so a consumer can size the symbol from CSS
+ * (`width: calc(var(--skdx-qr-code-size) * 4px)`) without reading the version
+ * back out in JavaScript.
+ *
+ * **The encode is a `computed` on `value` + `errorCorrection` + `version`.** A
+ * QR encode is ~8 full passes over up to 177² modules for mask selection; doing
+ * it on every render is the bug this component ships with everywhere.
+ *
+ * By default the root also renders `value` as visually hidden text: a QR code
+ * is a dead end for anyone without a camera, and the payload is usually a URL
+ * they would otherwise never reach.
+ *
+ * When `value` will not fit — over capacity, or a pinned `version` too small —
+ * `encode-error` fires and the root renders **nothing**. A partial or clipped
+ * symbol would scan to the wrong destination, which is worse than no symbol.
+ *
+ * @example
+ * ```vue
+ * <SkdxQrCode value="https://example.com" error-correction="H">
+ *   <SkdxQrCodeFrame aria-label="Link to example.com">
+ *     <SkdxQrCodePattern fill="currentColor" />
+ *     <SkdxQrCodeOverlay :size="7">
+ *       <image :href="logo" width="7" height="7" />
+ *     </SkdxQrCodeOverlay>
+ *   </SkdxQrCodeFrame>
+ * </SkdxQrCode>
+ * ```
+ */
+type __VLS_Props = {
+    /**
+     * The payload to encode — a URL, a phone number, a Wi-Fi credential string.
+     * Encoded as UTF-8 bytes, so any string is valid input; only its *length*
+     * can push the symbol past capacity.
+     */
+    value: string;
+    /**
+     * Error-correction level. Higher levels survive more damage, at the cost of
+     * a denser symbol for the same payload.
+     *
+     * **A logo overlay requires `'H'`, or the code stops scanning.** Anything
+     * painted over the centre destroys the modules underneath it, and only
+     * `'H'` carries enough redundancy (~30%) to reconstruct them.
+     * `SkdxQrCodeOverlay` does not raise the level for you — covering an `'M'`
+     * symbol produces a code that looks right and scans in your hand, then
+     * fails on a customer's older phone in poor light.
+     * @default 'M'
+     */
+    errorCorrection?: QrCodeErrorCorrection;
+    /**
+     * Force a symbol version (1–40), fixing the module count at
+     * `4 × version + 17`. Useful when a set of codes must all render at the
+     * same density.
+     *
+     * A version too small for `value` is an encode failure, not a silent
+     * upgrade — see the `encode-error` event.
+     * @default undefined — the smallest version whose capacity fits `value`.
+     */
+    version?: number;
+    /**
+     * Encoding mode. `'byte'` is the only value today; the prop exists so
+     * numeric, alphanumeric and Kanji modes can be added later without a
+     * breaking change.
+     * @default 'byte'
+     */
+    encoding?: 'byte';
+    /**
+     * Render `value` as visually hidden text inside the root, so a screen-reader
+     * user reaches the destination without a camera. A QR code is otherwise a
+     * dead end to anyone who cannot point a phone at it.
+     *
+     * Set to `false` only when you already render the value (or an equivalent
+     * link) yourself — otherwise it is announced twice.
+     * @default true
+     */
+    hiddenLabel?: boolean;
+};
+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, {
+    "encode-error": (error: Error) => any;
+}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{
+    "onEncode-error"?: ((error: Error) => any) | undefined;
+}>, {
+    errorCorrection: QrCodeErrorCorrection;
+    encoding: "byte";
+    hiddenLabel: boolean;
+}, {}, {}, {}, 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/qr-code/QrCode.vue.d.ts

@@ -0,0 +1,103 @@
+import { type QrCodeErrorCorrection } from './context.js';
+/**
+ * The Vue implementation of the shared QrCode contract (see `@skdx/shared`'s
+ * `qrCodeContract`). Root of a QR code: encodes `value` once and hands the
+ * resulting module matrix to `SkdxQrCodeFrame` / `SkdxQrCodePattern` /
+ * `SkdxQrCodeOverlay` via `provide()`. Renders a `<div>` carrying
+ * `--skdx-qr-code-size` — the module count, e.g. `29` — as an inline custom
+ * property, so a consumer can size the symbol from CSS
+ * (`width: calc(var(--skdx-qr-code-size) * 4px)`) without reading the version
+ * back out in JavaScript.
+ *
+ * **The encode is a `computed` on `value` + `errorCorrection` + `version`.** A
+ * QR encode is ~8 full passes over up to 177² modules for mask selection; doing
+ * it on every render is the bug this component ships with everywhere.
+ *
+ * By default the root also renders `value` as visually hidden text: a QR code
+ * is a dead end for anyone without a camera, and the payload is usually a URL
+ * they would otherwise never reach.
+ *
+ * When `value` will not fit — over capacity, or a pinned `version` too small —
+ * `encode-error` fires and the root renders **nothing**. A partial or clipped
+ * symbol would scan to the wrong destination, which is worse than no symbol.
+ *
+ * @example
+ * ```vue
+ * <SkdxQrCode value="https://example.com" error-correction="H">
+ *   <SkdxQrCodeFrame aria-label="Link to example.com">
+ *     <SkdxQrCodePattern fill="currentColor" />
+ *     <SkdxQrCodeOverlay :size="7">
+ *       <image :href="logo" width="7" height="7" />
+ *     </SkdxQrCodeOverlay>
+ *   </SkdxQrCodeFrame>
+ * </SkdxQrCode>
+ * ```
+ */
+type __VLS_Props = {
+    /**
+     * The payload to encode — a URL, a phone number, a Wi-Fi credential string.
+     * Encoded as UTF-8 bytes, so any string is valid input; only its *length*
+     * can push the symbol past capacity.
+     */
+    value: string;
+    /**
+     * Error-correction level. Higher levels survive more damage, at the cost of
+     * a denser symbol for the same payload.
+     *
+     * **A logo overlay requires `'H'`, or the code stops scanning.** Anything
+     * painted over the centre destroys the modules underneath it, and only
+     * `'H'` carries enough redundancy (~30%) to reconstruct them.
+     * `SkdxQrCodeOverlay` does not raise the level for you — covering an `'M'`
+     * symbol produces a code that looks right and scans in your hand, then
+     * fails on a customer's older phone in poor light.
+     * @default 'M'
+     */
+    errorCorrection?: QrCodeErrorCorrection;
+    /**
+     * Force a symbol version (1–40), fixing the module count at
+     * `4 × version + 17`. Useful when a set of codes must all render at the
+     * same density.
+     *
+     * A version too small for `value` is an encode failure, not a silent
+     * upgrade — see the `encode-error` event.
+     * @default undefined — the smallest version whose capacity fits `value`.
+     */
+    version?: number;
+    /**
+     * Encoding mode. `'byte'` is the only value today; the prop exists so
+     * numeric, alphanumeric and Kanji modes can be added later without a
+     * breaking change.
+     * @default 'byte'
+     */
+    encoding?: 'byte';
+    /**
+     * Render `value` as visually hidden text inside the root, so a screen-reader
+     * user reaches the destination without a camera. A QR code is otherwise a
+     * dead end to anyone who cannot point a phone at it.
+     *
+     * Set to `false` only when you already render the value (or an equivalent
+     * link) yourself — otherwise it is announced twice.
+     * @default true
+     */
+    hiddenLabel?: boolean;
+};
+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, {
+    "encode-error": (error: Error) => any;
+}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{
+    "onEncode-error"?: ((error: Error) => any) | undefined;
+}>, {
+    errorCorrection: QrCodeErrorCorrection;
+    encoding: "byte";
+    hiddenLabel: boolean;
+}, {}, {}, {}, 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/qr-code/QrCode.vue.js

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

package/dist/qr-code/QrCode.vue_vue_type_script_setup_true_lang.cjs

@@ -0,0 +1 @@
+const i=require("../utils/VisuallyHidden.vue.cjs"),s=require("./context.cjs"),v=require("./encoder.cjs");let e=require("vue");var m=(0,e.defineComponent)({__name:"QrCode",props:{value:{},errorCorrection:{default:"M"},version:{},encoding:{default:"byte"},hiddenLabel:{type:Boolean,default:!0}},emits:["encode-error"],setup(t,{emit:d}){const r=t,c=d,o=(0,e.computed)(()=>v.encodeQr(r.value,r.errorCorrection,r.version)),n=(0,e.computed)(()=>o.value?.length??0),u=(0,e.computed)(()=>({"--skdx-qr-code-size":n.value}));(0,e.provide)(s.QR_CODE_CONTEXT,{matrix:(0,e.computed)(()=>o.value??[]),size:n,value:(0,e.computed)(()=>r.value)});function a(){o.value===null&&c("encode-error",new Error(`[skandadx] QrCode cannot encode a ${r.value.length}-character value at error correction "${r.errorCorrection}"`+(r.version===void 0?" within version 40.":` at version ${r.version}.`)))}return(0,e.onMounted)(a),(0,e.watch)(()=>[r.value,r.errorCorrection,r.version],a),(l,p)=>o.value?((0,e.openBlock)(),(0,e.createElementBlock)("div",{key:0,class:"skdx-qr-code","data-part":"root","data-skdx-component":"qr-code","data-skdx-qr-code":"",style:(0,e.normalizeStyle)(u.value)},[(0,e.renderSlot)(l.$slots,"default"),t.hiddenLabel?((0,e.openBlock)(),(0,e.createBlock)(i.default,{key:0},{default:(0,e.withCtx)(()=>[(0,e.createTextVNode)((0,e.toDisplayString)(t.value),1)]),_:1})):(0,e.createCommentVNode)("",!0)],4)):(0,e.createCommentVNode)("",!0)}});exports.default=m;

package/dist/qr-code/QrCode.vue_vue_type_script_setup_true_lang.js

@@ -0,0 +1 @@
+import e from"../utils/VisuallyHidden.vue.js";import{QR_CODE_CONTEXT as r}from"./context.js";import{encodeQr as o}from"./encoder.js";import{computed as a,createBlock as t,createCommentVNode as n,createElementBlock as s,createTextVNode as d,defineComponent as l,normalizeStyle as i,onMounted as c,openBlock as u,provide as v,renderSlot as m,toDisplayString as p,watch as f,withCtx as C}from"vue";var k=/* @__PURE__ */l({__name:"QrCode",props:{value:{},errorCorrection:{default:"M"},version:{},encoding:{default:"byte"},hiddenLabel:{type:Boolean,default:!0}},emits:["encode-error"],setup(l,{emit:k}){const x=l,h=k,y=a(()=>o(x.value,x.errorCorrection,x.version)),_=a(()=>y.value?.length??0),g=a(()=>({"--skdx-qr-code-size":_.value}));function q(){null===y.value&&h("encode-error",/* @__PURE__ */new Error(`[skandadx] QrCode cannot encode a ${x.value.length}-character value at error correction "${x.errorCorrection}"`+(void 0===x.version?" within version 40.":` at version ${x.version}.`)))}return v(r,{matrix:a(()=>y.value??[]),size:_,value:a(()=>x.value)}),c(q),f(()=>[x.value,x.errorCorrection,x.version],q),(r,o)=>y.value?(u(),s("div",{key:0,class:"skdx-qr-code","data-part":"root","data-skdx-component":"qr-code","data-skdx-qr-code":"",style:i(g.value)},[m(r.$slots,"default"),l.hiddenLabel?(u(),t(e,{key:0},{default:C(()=>[d(p(l.value),1)]),_:1})):n("",!0)],4)):n("",!0)}});export{k as default};

package/dist/qr-code/QrCodeFrame.vue.cjs

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

package/dist/qr-code/QrCodeFrame.vue.d.cts

@@ -0,0 +1,35 @@
+/**
+ * The `<svg>` host for a QR code. Its `viewBox` is `0 0 size size` where `size`
+ * is the module count, so **one user unit is one module** — `SkdxQrCodePattern`
+ * and `SkdxQrCodeOverlay` both work in whole modules and never need a scale
+ * factor. The element itself carries no width or height; size it from CSS,
+ * optionally via the root's `--skdx-qr-code-size`.
+ *
+ * ARIA follows what you name it. Pass `aria-label` or `aria-labelledby` and it
+ * becomes `role="img"` with that name — worth doing when the symbol is the only
+ * copy of the destination on screen. Pass neither and it is `aria-hidden`,
+ * because an unnamed `<svg>` full of squares is decoration, and the root's
+ * `hiddenLabel` text already carries the payload.
+ *
+ * Must be used inside an `<SkdxQrCode>`.
+ *
+ * @example
+ * ```vue
+ * <SkdxQrCodeFrame aria-label="Scan to open example.com" style="width: 160px">
+ *   <SkdxQrCodePattern fill="currentColor" />
+ * </SkdxQrCodeFrame>
+ * ```
+ */
+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;
+    };
+};