@skdx/vue 0.28.0 → 0.30.0

package/dist/listbox/ListboxItem.vue.d.cts

@@ -1,12 +1,9 @@
 /**
- * Single selectable option in SkdxListbox: role=option with roving tabindex as
- * one tab stop. Click/Enter/Space selects (toggles if multiple). Shift+Space
- * deferred to root for range selection. Disabled options skip arrows/typeahead
- * but stay announced.
+ * Renders a selectable option in SkdxListbox with `role="option"` and roving tabindex.
  *
  * @example
  * ```vue
- * <SkdxListboxItem value="react" text-value="React">
+ * <SkdxListboxItem value="ruby" text-value="Ruby">
  *   <SkdxListboxItemIndicator>✓</SkdxListboxItemIndicator>
  *   React
  * </SkdxListboxItem>
@@ -19,31 +16,29 @@ type __VLS_Props = {
      * Excludes this option from selection and from arrow/typeahead navigation.
      * @default false
      */
-    disabled?: boolean;
+    disabled?: boolean | undefined;
     /**
-     * Text typeahead matches against, published as data-text-value;
-     * needed when option renders more than label (glyph, icon, secondary line).
+     * Text typeahead matches against, published as `data-text-value`.
      * @default undefined
      */
-    textValue?: string;
+    textValue?: string | undefined;
     /**
-     * 1-based position in full option set (aria-posinset); needed for virtualized
-     * lists. Without setSize, "item 4 of unknown" is worse than DOM count.
+     * 1-based position in the full option set, published as `aria-posinset`.
      * @default undefined
      */
-    posInSet?: number;
+    posInSet?: number | undefined;
     /** Size of the full option set this option belongs to. See `posInSet`. */
-    setSize?: number;
+    setSize?: 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<{}>, {
-    disabled: boolean;
-    textValue: string;
-    posInSet: number;
-    setSize: number;
+    disabled: boolean | undefined;
+    textValue: string | undefined;
+    posInSet: number | undefined;
+    setSize: number | undefined;
 }, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
 declare const _default: __VLS_WithSlots<typeof __VLS_component, __VLS_Slots>;
 export default _default;

package/dist/listbox/ListboxItem.vue.d.ts

@@ -1,12 +1,9 @@
 /**
- * Single selectable option in SkdxListbox: role=option with roving tabindex as
- * one tab stop. Click/Enter/Space selects (toggles if multiple). Shift+Space
- * deferred to root for range selection. Disabled options skip arrows/typeahead
- * but stay announced.
+ * Renders a selectable option in SkdxListbox with `role="option"` and roving tabindex.
  *
  * @example
  * ```vue
- * <SkdxListboxItem value="react" text-value="React">
+ * <SkdxListboxItem value="ruby" text-value="Ruby">
  *   <SkdxListboxItemIndicator>✓</SkdxListboxItemIndicator>
  *   React
  * </SkdxListboxItem>
@@ -19,31 +16,29 @@ type __VLS_Props = {
      * Excludes this option from selection and from arrow/typeahead navigation.
      * @default false
      */
-    disabled?: boolean;
+    disabled?: boolean | undefined;
     /**
-     * Text typeahead matches against, published as data-text-value;
-     * needed when option renders more than label (glyph, icon, secondary line).
+     * Text typeahead matches against, published as `data-text-value`.
      * @default undefined
      */
-    textValue?: string;
+    textValue?: string | undefined;
     /**
-     * 1-based position in full option set (aria-posinset); needed for virtualized
-     * lists. Without setSize, "item 4 of unknown" is worse than DOM count.
+     * 1-based position in the full option set, published as `aria-posinset`.
      * @default undefined
      */
-    posInSet?: number;
+    posInSet?: number | undefined;
     /** Size of the full option set this option belongs to. See `posInSet`. */
-    setSize?: number;
+    setSize?: 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<{}>, {
-    disabled: boolean;
-    textValue: string;
-    posInSet: number;
-    setSize: number;
+    disabled: boolean | undefined;
+    textValue: string | undefined;
+    posInSet: number | undefined;
+    setSize: number | undefined;
 }, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
 declare const _default: __VLS_WithSlots<typeof __VLS_component, __VLS_Slots>;
 export default _default;

package/dist/listbox/ListboxItem.vue_vue_type_script_setup_true_lang.cjs

@@ -1 +1 @@
-const r=require("./context.cjs");let t=require("vue");var x=["aria-selected","aria-disabled","data-value","data-text-value","aria-posinset","aria-setsize","data-state","data-disabled","tabindex"],p=(0,t.defineComponent)({__name:"ListboxItem",props:{value:{},disabled:{type:Boolean,default:!1},textValue:{default:void 0},posInSet:{default:void 0},setSize:{default:void 0}},setup(l){const d=l,n=(0,t.inject)(r.LISTBOX_CONTEXT);if(!n)throw new Error("SkdxListboxItem must be used within SkdxListbox.");const a=n,i=(0,t.computed)(()=>d.disabled||a.disabled),u=(0,t.computed)(()=>a.isSelected(d.value)),c=(0,t.computed)(()=>i.value?-1:a.activeValue.value===d.value?0:-1);function o(e){i.value||a.selectItem(d.value,e)}function v(){i.value||a.setActiveValue(d.value)}function f(e){e.key!==" "&&e.key!=="Enter"||e.key===" "&&e.shiftKey&&a.multiple||(e.preventDefault(),o("keyboard"))}function b(e){a.focusOnHover&&!i.value&&e.currentTarget.focus()}return(0,t.provide)(r.LISTBOX_ITEM_CONTEXT,{get selected(){return u.value}}),(e,s)=>((0,t.openBlock)(),(0,t.createElementBlock)("div",{class:"skdx-listbox__item","data-part":"item",role:"option","aria-selected":u.value,"aria-disabled":i.value||void 0,"data-value":l.value,"data-text-value":l.textValue,"aria-posinset":l.posInSet,"aria-setsize":l.setSize,"data-state":u.value?"checked":"unchecked","data-disabled":i.value?"":void 0,tabindex:c.value,onClick:s[0]||(s[0]=m=>o("pointer")),onFocus:v,onPointerenter:b,onKeydown:f},[(0,t.renderSlot)(e.$slots,"default")],40,x))}});exports.default=p;
+const b=require("../utils/injectRequired.cjs"),s=require("./context.cjs");let t=require("vue");var x=["aria-selected","aria-disabled","data-value","data-text-value","aria-posinset","aria-setsize","data-state","data-disabled","tabindex"],p=(0,t.defineComponent)({__name:"ListboxItem",props:{value:{},disabled:{type:Boolean,default:!1},textValue:{default:void 0},posInSet:{default:void 0},setSize:{default:void 0}},setup(u){const l=u,a=b.injectRequired(s.LISTBOX_CONTEXT,"SkdxListboxItem must be used within SkdxListbox."),i=(0,t.computed)(()=>l.disabled||a.disabled),d=(0,t.computed)(()=>a.isSelected(l.value)),r=(0,t.computed)(()=>i.value?-1:a.activeValue.value===l.value?0:-1);function n(e){i.value||a.selectItem(l.value,e)}function c(){i.value||a.setActiveValue(l.value)}function v(e){e.key!==" "&&e.key!=="Enter"||e.key===" "&&e.shiftKey&&a.multiple||(e.preventDefault(),n("keyboard"))}function f(e){a.focusOnHover&&!i.value&&e.currentTarget.focus()}return(0,t.provide)(s.LISTBOX_ITEM_CONTEXT,{get selected(){return d.value}}),(e,o)=>((0,t.openBlock)(),(0,t.createElementBlock)("div",{class:"skdx-listbox__item","data-part":"item",role:"option","aria-selected":d.value,"aria-disabled":i.value||void 0,"data-value":u.value,"data-text-value":u.textValue,"aria-posinset":u.posInSet,"aria-setsize":u.setSize,"data-state":d.value?"checked":"unchecked","data-disabled":i.value?"":void 0,tabindex:r.value,onClick:o[0]||(o[0]=m=>n("pointer")),onFocus:c,onPointerenter:f,onKeydown:v},[(0,t.renderSlot)(e.$slots,"default")],40,x))}});exports.default=p;

package/dist/listbox/ListboxItem.vue_vue_type_script_setup_true_lang.js

@@ -1 +1 @@
-import{LISTBOX_CONTEXT as e,LISTBOX_ITEM_CONTEXT as a}from"./context.js";import{computed as t,createElementBlock as s,defineComponent as i,inject as l,openBlock as o,provide as d,renderSlot as u}from"vue";var n=["aria-selected","aria-disabled","data-value","data-text-value","aria-posinset","aria-setsize","data-state","data-disabled","tabindex"],r=/* @__PURE__ */i({__name:"ListboxItem",props:{value:{},disabled:{type:Boolean,default:!1},textValue:{default:void 0},posInSet:{default:void 0},setSize:{default:void 0}},setup(i){const r=i,v=l(e);if(!v)throw new Error("SkdxListboxItem must be used within SkdxListbox.");const c=v,p=t(()=>r.disabled||c.disabled),f=t(()=>c.isSelected(r.value)),b=t(()=>p.value?-1:c.activeValue.value===r.value?0:-1);function m(e){p.value||c.selectItem(r.value,e)}function x(){p.value||c.setActiveValue(r.value)}function k(e){" "!==e.key&&"Enter"!==e.key||" "===e.key&&e.shiftKey&&c.multiple||(e.preventDefault(),m("keyboard"))}function S(e){c.focusOnHover&&!p.value&&e.currentTarget.focus()}return d(a,{get selected(){return f.value}}),(e,a)=>(o(),s("div",{class:"skdx-listbox__item","data-part":"item",role:"option","aria-selected":f.value,"aria-disabled":p.value||void 0,"data-value":i.value,"data-text-value":i.textValue,"aria-posinset":i.posInSet,"aria-setsize":i.setSize,"data-state":f.value?"checked":"unchecked","data-disabled":p.value?"":void 0,tabindex:b.value,onClick:a[0]||(a[0]=e=>m("pointer")),onFocus:x,onPointerenter:S,onKeydown:k},[u(e.$slots,"default")],40,n))}});export{r as default};
+import{injectRequired as e}from"../utils/injectRequired.js";import{LISTBOX_CONTEXT as a,LISTBOX_ITEM_CONTEXT as t}from"./context.js";import{computed as i,createElementBlock as s,defineComponent as l,openBlock as d,provide as o,renderSlot as u}from"vue";var n=["aria-selected","aria-disabled","data-value","data-text-value","aria-posinset","aria-setsize","data-state","data-disabled","tabindex"],r=/* @__PURE__ */l({__name:"ListboxItem",props:{value:{},disabled:{type:Boolean,default:!1},textValue:{default:void 0},posInSet:{default:void 0},setSize:{default:void 0}},setup(l){const r=l,v=e(a,"SkdxListboxItem must be used within SkdxListbox."),c=i(()=>r.disabled||v.disabled),p=i(()=>v.isSelected(r.value)),f=i(()=>c.value?-1:v.activeValue.value===r.value?0:-1);function m(e){c.value||v.selectItem(r.value,e)}function b(){c.value||v.setActiveValue(r.value)}function x(e){" "!==e.key&&"Enter"!==e.key||" "===e.key&&e.shiftKey&&v.multiple||(e.preventDefault(),m("keyboard"))}function k(e){v.focusOnHover&&!c.value&&e.currentTarget.focus()}return o(t,{get selected(){return p.value}}),(e,a)=>(d(),s("div",{class:"skdx-listbox__item","data-part":"item",role:"option","aria-selected":p.value,"aria-disabled":c.value||void 0,"data-value":l.value,"data-text-value":l.textValue,"aria-posinset":l.posInSet,"aria-setsize":l.setSize,"data-state":p.value?"checked":"unchecked","data-disabled":c.value?"":void 0,tabindex:f.value,onClick:a[0]||(a[0]=e=>m("pointer")),onFocus:b,onPointerenter:k,onKeydown:x},[u(e.$slots,"default")],40,n))}});export{r as default};

package/dist/listbox/ListboxItemIndicator.vue.d.cts

@@ -1,12 +1,9 @@
 /**
- * Marker shown while option is selected (e.g., checkmark). Renders `<span aria-hidden="true">`.
- * Hides from a11y since `aria-selected` already carries the state.
- * Renders nothing while unselected unless `forceMount` is set.
- * Provide `textValue` on the option so typeahead doesn't match the glyph.
+ * Renders `<span aria-hidden="true">` as a marker while the option is selected, hidden from a11y since `aria-selected` already carries the state.
  *
  * @example
  * ```vue
- * <SkdxListboxItem value="react" text-value="React">
+ * <SkdxListboxItem value="ruby" text-value="Ruby">
  *   <SkdxListboxItemIndicator>✓</SkdxListboxItemIndicator>
  *   React
  * </SkdxListboxItem>

package/dist/listbox/ListboxItemIndicator.vue.d.ts

@@ -1,12 +1,9 @@
 /**
- * Marker shown while option is selected (e.g., checkmark). Renders `<span aria-hidden="true">`.
- * Hides from a11y since `aria-selected` already carries the state.
- * Renders nothing while unselected unless `forceMount` is set.
- * Provide `textValue` on the option so typeahead doesn't match the glyph.
+ * Renders `<span aria-hidden="true">` as a marker while the option is selected, hidden from a11y since `aria-selected` already carries the state.
  *
  * @example
  * ```vue
- * <SkdxListboxItem value="react" text-value="React">
+ * <SkdxListboxItem value="ruby" text-value="Ruby">
  *   <SkdxListboxItemIndicator>✓</SkdxListboxItemIndicator>
  *   React
  * </SkdxListboxItem>

package/dist/listbox/ListboxItemIndicator.vue_vue_type_script_setup_true_lang.cjs

@@ -1 +1 @@
-const i=require("./context.cjs");let e=require("vue");var a={key:0,class:"skdx-listbox__item-indicator","data-part":"item-indicator","aria-hidden":"true"},s=(0,e.defineComponent)({__name:"ListboxItemIndicator",props:{forceMount:{type:Boolean,default:!1}},setup(r){const t=(0,e.inject)(i.LISTBOX_ITEM_CONTEXT);if(!t)throw new Error("SkdxListboxItemIndicator must be used within SkdxListboxItem.");const o=t;return(n,c)=>r.forceMount||(0,e.unref)(o).selected?((0,e.openBlock)(),(0,e.createElementBlock)("span",a,[(0,e.renderSlot)(n.$slots,"default")])):(0,e.createCommentVNode)("",!0)}});exports.default=s;
+const o=require("../utils/injectRequired.cjs"),n=require("./context.cjs");let e=require("vue");var u={key:0,class:"skdx-listbox__item-indicator","data-part":"item-indicator","aria-hidden":"true"},a=(0,e.defineComponent)({__name:"ListboxItemIndicator",props:{forceMount:{type:Boolean,default:!1}},setup(t){const r=o.injectRequired(n.LISTBOX_ITEM_CONTEXT,"SkdxListboxItemIndicator must be used within SkdxListboxItem.");return(i,d)=>t.forceMount||(0,e.unref)(r).selected?((0,e.openBlock)(),(0,e.createElementBlock)("span",u,[(0,e.renderSlot)(i.$slots,"default")])):(0,e.createCommentVNode)("",!0)}});exports.default=a;

package/dist/listbox/ListboxItemIndicator.vue_vue_type_script_setup_true_lang.js

@@ -1 +1 @@
-import{LISTBOX_ITEM_CONTEXT as e}from"./context.js";import{createCommentVNode as t,createElementBlock as o,defineComponent as a,inject as r,openBlock as s,renderSlot as n,unref as i}from"vue";var d={key:0,class:"skdx-listbox__item-indicator","data-part":"item-indicator","aria-hidden":"true"},c=/* @__PURE__ */a({__name:"ListboxItemIndicator",props:{forceMount:{type:Boolean,default:!1}},setup(a){const c=r(e);if(!c)throw new Error("SkdxListboxItemIndicator must be used within SkdxListboxItem.");const m=c;return(e,r)=>a.forceMount||i(m).selected?(s(),o("span",d,[n(e.$slots,"default")])):t("",!0)}});export{c as default};
+import{injectRequired as e}from"../utils/injectRequired.js";import{LISTBOX_ITEM_CONTEXT as t}from"./context.js";import{createCommentVNode as o,createElementBlock as a,defineComponent as s,openBlock as r,renderSlot as i,unref as n}from"vue";var d={key:0,class:"skdx-listbox__item-indicator","data-part":"item-indicator","aria-hidden":"true"},m=/* @__PURE__ */s({__name:"ListboxItemIndicator",props:{forceMount:{type:Boolean,default:!1}},setup(s){const m=e(t,"SkdxListboxItemIndicator must be used within SkdxListboxItem.");return(e,t)=>s.forceMount||n(m).selected?(r(),a("span",d,[i(e.$slots,"default")])):o("",!0)}});export{m as default};

package/dist/listbox/ListboxLabel.vue.d.cts

@@ -1,12 +1,10 @@
 /**
- * Heading naming a `SkdxListboxGroup`. Renders `<div>` with an id the group
- * references via `aria-labelledby`, so the group is named without the label
- * becoming an option. Must be used inside `SkdxListboxGroup`.
+ * Renders `<div>` with an id the group references via `aria-labelledby`, naming a `SkdxListboxGroup`.
  * @example
  * ```vue
  * <SkdxListboxGroup>
  *   <SkdxListboxLabel>Frameworks</SkdxListboxLabel>
- *   <SkdxListboxItem value="react">React</SkdxListboxItem>
+ *   <SkdxListboxItem value="ruby">Ruby</SkdxListboxItem>
  * </SkdxListboxGroup>
  * ```
  */

package/dist/listbox/ListboxLabel.vue.d.ts

@@ -1,12 +1,10 @@
 /**
- * Heading naming a `SkdxListboxGroup`. Renders `<div>` with an id the group
- * references via `aria-labelledby`, so the group is named without the label
- * becoming an option. Must be used inside `SkdxListboxGroup`.
+ * Renders `<div>` with an id the group references via `aria-labelledby`, naming a `SkdxListboxGroup`.
  * @example
  * ```vue
  * <SkdxListboxGroup>
  *   <SkdxListboxLabel>Frameworks</SkdxListboxLabel>
- *   <SkdxListboxItem value="react">React</SkdxListboxItem>
+ *   <SkdxListboxItem value="ruby">Ruby</SkdxListboxItem>
  * </SkdxListboxGroup>
  * ```
  */

package/dist/listbox/ListboxLabel.vue_vue_type_script_setup_true_lang.cjs

@@ -1 +1 @@
-const l=require("./context.cjs");let e=require("vue");var s=["id"],_=(0,e.defineComponent)({__name:"ListboxLabel",setup(a){const t=(0,e.inject)(l.LISTBOX_GROUP_CONTEXT);if(!t)throw new Error("SkdxListboxLabel must be used within SkdxListboxGroup.");const r=t;return(o,i)=>((0,e.openBlock)(),(0,e.createElementBlock)("div",{class:"skdx-listbox__label","data-part":"label",id:(0,e.unref)(r).labelId},[(0,e.renderSlot)(o.$slots,"default")],8,s))}});exports.default=_;
+const r=require("../utils/menuGroup.cjs");let e=require("vue");var a=["id"],u=(0,e.defineComponent)({__name:"ListboxLabel",setup(_){const t=r.useMenuLabelId();return(l,s)=>((0,e.openBlock)(),(0,e.createElementBlock)("div",{id:(0,e.unref)(t),class:"skdx-listbox__label","data-part":"label"},[(0,e.renderSlot)(l.$slots,"default")],8,a))}});exports.default=u;

package/dist/listbox/ListboxLabel.vue_vue_type_script_setup_true_lang.js

@@ -1 +1 @@
-import{LISTBOX_GROUP_CONTEXT as e}from"./context.js";import{createElementBlock as t,defineComponent as s,inject as a,openBlock as o,renderSlot as r,unref as l}from"vue";var n=["id"],i=/* @__PURE__ */s({__name:"ListboxLabel",setup(s){const i=a(e);if(!i)throw new Error("SkdxListboxLabel must be used within SkdxListboxGroup.");const d=i;return(e,s)=>(o(),t("div",{class:"skdx-listbox__label","data-part":"label",id:l(d).labelId},[r(e.$slots,"default")],8,n))}});export{i as default};
+import{useMenuLabelId as e}from"../utils/menuGroup.js";import{createElementBlock as a,defineComponent as s,openBlock as t,renderSlot as l,unref as o}from"vue";var r=["id"],n=/* @__PURE__ */s({__name:"ListboxLabel",setup(s){const n=e();return(e,s)=>(t(),a("div",{id:o(n),class:"skdx-listbox__label","data-part":"label"},[l(e.$slots,"default")],8,r))}});export{n as default};

package/dist/listbox/context.cjs

@@ -1 +1 @@
-const T=require("../utils/id.cjs");var t='[role="option"]:not([data-disabled])',O=Symbol("skdx-listbox-context"),o=Symbol("skdx-listbox-item-context"),e=Symbol("skdx-listbox-group-context");function x(){return T.nextId("listbox-label")}exports.LISTBOX_CONTEXT=O;exports.LISTBOX_GROUP_CONTEXT=e;exports.LISTBOX_ITEM_CONTEXT=o;exports.OPTION_SELECTOR=t;exports.nextListboxLabelId=x;
+var T='[role="option"]:not([data-disabled])',O=Symbol("skdx-listbox-context"),o=Symbol("skdx-listbox-item-context");exports.LISTBOX_CONTEXT=O;exports.LISTBOX_ITEM_CONTEXT=o;exports.OPTION_SELECTOR=T;

package/dist/listbox/context.d.cts

@@ -1,16 +1,12 @@
 import type { InjectionKey, Ref } from 'vue';
 /** @internal Every option that can hold focus. Disabled options are skipped, never focused. */
 export declare const OPTION_SELECTOR = "[role=\"option\"]:not([data-disabled])";
-/**
- * The payload `value-change` carries. Many interactions (arrow keys,
- * typeahead, Shift+variants, Control+Shift+Home/End, Control+A, click) map
- * to the same event; `reason` disambiguates them.
- */
+/** The payload the `value-change` event carries; `reason` disambiguates which interaction caused it. */
 export interface ListboxValueChangeDetail {
     /** The whole selection after the change, not the single option that was toggled — see `selectedValue`. */
     value: string[];
-    /** The selection held before this change, or `null` when there was none. */
-    previousValue: string[] | null;
+    /** The selection held before this change, empty when there was none. */
+    previousValue: string[];
     /** What drove the change. */
     reason: 'keyboard' | 'pointer' | 'programmatic';
     /** The first selected value, or `null` when nothing is selected. */
@@ -52,12 +48,3 @@ export interface ListboxItemContext {
 }
 /** @internal Injection key a ListboxItem provides so its ItemIndicator can read its selected state. */
 export declare const LISTBOX_ITEM_CONTEXT: InjectionKey<ListboxItemContext>;
-/** @internal Wiring passed from a ListboxGroup to its ListboxLabel. */
-export interface ListboxGroupContext {
-    /** The id the group points `aria-labelledby` at, which its Label claims. */
-    labelId: string;
-}
-/** @internal Injection key a ListboxGroup provides so its Label claims the id the group is named by. */
-export declare const LISTBOX_GROUP_CONTEXT: InjectionKey<ListboxGroupContext>;
-/** @internal Generates a unique id for a ListboxGroup's label. */
-export declare function nextListboxLabelId(): string;

package/dist/listbox/context.d.ts

@@ -1,16 +1,12 @@
 import type { InjectionKey, Ref } from 'vue';
 /** @internal Every option that can hold focus. Disabled options are skipped, never focused. */
 export declare const OPTION_SELECTOR = "[role=\"option\"]:not([data-disabled])";
-/**
- * The payload `value-change` carries. Many interactions (arrow keys,
- * typeahead, Shift+variants, Control+Shift+Home/End, Control+A, click) map
- * to the same event; `reason` disambiguates them.
- */
+/** The payload the `value-change` event carries; `reason` disambiguates which interaction caused it. */
 export interface ListboxValueChangeDetail {
     /** The whole selection after the change, not the single option that was toggled — see `selectedValue`. */
     value: string[];
-    /** The selection held before this change, or `null` when there was none. */
-    previousValue: string[] | null;
+    /** The selection held before this change, empty when there was none. */
+    previousValue: string[];
     /** What drove the change. */
     reason: 'keyboard' | 'pointer' | 'programmatic';
     /** The first selected value, or `null` when nothing is selected. */
@@ -52,12 +48,3 @@ export interface ListboxItemContext {
 }
 /** @internal Injection key a ListboxItem provides so its ItemIndicator can read its selected state. */
 export declare const LISTBOX_ITEM_CONTEXT: InjectionKey<ListboxItemContext>;
-/** @internal Wiring passed from a ListboxGroup to its ListboxLabel. */
-export interface ListboxGroupContext {
-    /** The id the group points `aria-labelledby` at, which its Label claims. */
-    labelId: string;
-}
-/** @internal Injection key a ListboxGroup provides so its Label claims the id the group is named by. */
-export declare const LISTBOX_GROUP_CONTEXT: InjectionKey<ListboxGroupContext>;
-/** @internal Generates a unique id for a ListboxGroup's label. */
-export declare function nextListboxLabelId(): string;

package/dist/listbox/context.js

@@ -1 +1 @@
-import{nextId as t}from"../utils/id.js";var o='[role="option"]:not([data-disabled])',s=/* @__PURE__ */Symbol("skdx-listbox-context"),x=/* @__PURE__ */Symbol("skdx-listbox-item-context"),l=/* @__PURE__ */Symbol("skdx-listbox-group-context");function a(){return t("listbox-label")}export{s as LISTBOX_CONTEXT,l as LISTBOX_GROUP_CONTEXT,x as LISTBOX_ITEM_CONTEXT,o as OPTION_SELECTOR,a as nextListboxLabelId};
+var o='[role="option"]:not([data-disabled])',t=/* @__PURE__ */Symbol("skdx-listbox-context"),T=/* @__PURE__ */Symbol("skdx-listbox-item-context");export{t as LISTBOX_CONTEXT,T as LISTBOX_ITEM_CONTEXT,o as OPTION_SELECTOR};

package/dist/listbox/primitives.cjs

@@ -1 +1 @@
-Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("./ListboxGroup.vue.cjs"),t=require("./ListboxItem.vue.cjs"),r=require("./ListboxItemIndicator.vue.cjs"),i=require("./ListboxLabel.vue.cjs"),o=require("./Listbox.vue.cjs");exports.SkdxListbox=o.default;exports.SkdxListboxGroup=e.default;exports.SkdxListboxItem=t.default;exports.SkdxListboxItemIndicator=r.default;exports.SkdxListboxLabel=i.default;
+Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("./ListboxLabel.vue.cjs"),t=require("./ListboxGroup.vue.cjs"),r=require("./ListboxItem.vue.cjs"),i=require("./ListboxItemIndicator.vue.cjs"),o=require("./Listbox.vue.cjs");exports.SkdxListbox=o.default;exports.SkdxListboxGroup=t.default;exports.SkdxListboxItem=r.default;exports.SkdxListboxItemIndicator=i.default;exports.SkdxListboxLabel=e.default;

package/dist/listbox/primitives.js

@@ -1 +1 @@
-import o from"./ListboxGroup.vue.js";import t from"./ListboxItem.vue.js";import s from"./ListboxItemIndicator.vue.js";import i from"./ListboxLabel.vue.js";import x from"./Listbox.vue.js";export{x as SkdxListbox,o as SkdxListboxGroup,t as SkdxListboxItem,s as SkdxListboxItemIndicator,i as SkdxListboxLabel};
+import o from"./ListboxLabel.vue.js";import t from"./ListboxGroup.vue.js";import s from"./ListboxItem.vue.js";import i from"./ListboxItemIndicator.vue.js";import x from"./Listbox.vue.js";export{x as SkdxListbox,t as SkdxListboxGroup,s as SkdxListboxItem,i as SkdxListboxItemIndicator,o as SkdxListboxLabel};

package/dist/loading-overlay/LoadingOverlay.vue.d.cts

@@ -1,8 +1,5 @@
 /**
- * Covers content in the default slot while work is in flight. Renders a plain
- * `<div>`; give it `position: relative` for local coverage, or set `fullScreen`
- * for viewport coverage. Always derives Backdrop and Content layers with a spinner.
- * While visible, sets `aria-busy="true"` and `inert` on the covered wrapper.
+ * Covers content in the default slot with a spinner while work is in flight.
  *
  * @example
  * ```vue
@@ -13,38 +10,35 @@
  */
 type __VLS_Props = {
     /**
-     * Whether work is in flight for controlled usage. Pair with `v-model:visible`.
+     * Whether work is in flight, for controlled usage via `v-model:visible`.
      * @default undefined — uncontrolled, tracks internally.
      */
-    visible?: boolean;
+    visible?: boolean | undefined;
     /**
-     * Cover the viewport instead of the root's box. Emits `data-full-screen`
-     * and locks body scroll while visible; inline overlays never lock the body.
+     * Covers the viewport instead of the root's box, emitting `data-full-screen` and locking body scroll while visible.
      * @default false — the overlay covers only the root element's box.
      */
     fullScreen?: boolean;
     /**
-     * Accessible name of the busy region, announced when the overlay becomes
-     * visible and used as the derived `SkdxSpinner`'s label.
+     * Accessible name of the busy region, announced when the overlay becomes visible and used as the derived `SkdxSpinner`'s label.
      * @default 'Loading' — name the work ("Loading invoices") when multiple overlays exist.
      */
     loadingLabel?: string;
     /**
-     * Text announced when the overlay hides, closing the loop the appearance
-     * announcement opens (the region became operable again — a change screen-reader
-     * users cannot see). Omitted: the overlay clears its message, allowing
-     * consecutive identical `loadingLabel`s to announce twice.
+     * Text announced when the overlay hides; omitted, it clears its own message instead.
      * @default undefined — hiding announces nothing.
      */
-    loadedLabel?: string;
+    loadedLabel?: string | undefined;
     /**
-     * Milliseconds to wait after `visible` turns true before the overlay renders.
-     * Responses arriving inside this window never render the overlay, preventing
-     * spinner flash on fast requests. The timer cancels if `visible` flips back
-     * to false or on unmount.
+     * Milliseconds to wait after `visible` turns true before the overlay renders, avoiding spinner flash on fast responses.
      * @default 0 — shows immediately to avoid hiding slow connections.
      */
     delay?: number;
+    /**
+     * How strongly the skin tints the backdrop, applied to the derived Backdrop part.
+     * @default undefined — falls back to a `data-emphasis` attribute.
+     */
+    emphasis?: 'low' | 'medium' | 'high' | (string & {}) | undefined;
 };
 declare var __VLS_10: {};
 type __VLS_Slots = {} & {
@@ -54,13 +48,13 @@ declare const __VLS_component: import("vue").DefineComponent<__VLS_Props, {}, {}
     "update:visible": (visible: boolean) => any;
     "visible-change": (visible: boolean) => any;
 }, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{
-    "onUpdate:visible"?: ((visible: boolean) => any) | undefined;
-    "onVisible-change"?: ((visible: boolean) => any) | undefined;
+    "onUpdate:visible"?: (visible: boolean) => any;
+    "onVisible-change"?: (visible: boolean) => any;
 }>, {
-    visible: boolean;
+    visible: boolean | undefined;
     loadingLabel: string;
+    emphasis: "low" | "medium" | "high" | (string & {}) | undefined;
     fullScreen: boolean;
-    loadedLabel: string;
     delay: number;
 }, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
 declare const _default: __VLS_WithSlots<typeof __VLS_component, __VLS_Slots>;

package/dist/loading-overlay/LoadingOverlay.vue.d.ts

@@ -1,8 +1,5 @@
 /**
- * Covers content in the default slot while work is in flight. Renders a plain
- * `<div>`; give it `position: relative` for local coverage, or set `fullScreen`
- * for viewport coverage. Always derives Backdrop and Content layers with a spinner.
- * While visible, sets `aria-busy="true"` and `inert` on the covered wrapper.
+ * Covers content in the default slot with a spinner while work is in flight.
  *
  * @example
  * ```vue
@@ -13,38 +10,35 @@
  */
 type __VLS_Props = {
     /**
-     * Whether work is in flight for controlled usage. Pair with `v-model:visible`.
+     * Whether work is in flight, for controlled usage via `v-model:visible`.
      * @default undefined — uncontrolled, tracks internally.
      */
-    visible?: boolean;
+    visible?: boolean | undefined;
     /**
-     * Cover the viewport instead of the root's box. Emits `data-full-screen`
-     * and locks body scroll while visible; inline overlays never lock the body.
+     * Covers the viewport instead of the root's box, emitting `data-full-screen` and locking body scroll while visible.
      * @default false — the overlay covers only the root element's box.
      */
     fullScreen?: boolean;
     /**
-     * Accessible name of the busy region, announced when the overlay becomes
-     * visible and used as the derived `SkdxSpinner`'s label.
+     * Accessible name of the busy region, announced when the overlay becomes visible and used as the derived `SkdxSpinner`'s label.
      * @default 'Loading' — name the work ("Loading invoices") when multiple overlays exist.
      */
     loadingLabel?: string;
     /**
-     * Text announced when the overlay hides, closing the loop the appearance
-     * announcement opens (the region became operable again — a change screen-reader
-     * users cannot see). Omitted: the overlay clears its message, allowing
-     * consecutive identical `loadingLabel`s to announce twice.
+     * Text announced when the overlay hides; omitted, it clears its own message instead.
      * @default undefined — hiding announces nothing.
      */
-    loadedLabel?: string;
+    loadedLabel?: string | undefined;
     /**
-     * Milliseconds to wait after `visible` turns true before the overlay renders.
-     * Responses arriving inside this window never render the overlay, preventing
-     * spinner flash on fast requests. The timer cancels if `visible` flips back
-     * to false or on unmount.
+     * Milliseconds to wait after `visible` turns true before the overlay renders, avoiding spinner flash on fast responses.
      * @default 0 — shows immediately to avoid hiding slow connections.
      */
     delay?: number;
+    /**
+     * How strongly the skin tints the backdrop, applied to the derived Backdrop part.
+     * @default undefined — falls back to a `data-emphasis` attribute.
+     */
+    emphasis?: 'low' | 'medium' | 'high' | (string & {}) | undefined;
 };
 declare var __VLS_10: {};
 type __VLS_Slots = {} & {
@@ -54,13 +48,13 @@ declare const __VLS_component: import("vue").DefineComponent<__VLS_Props, {}, {}
     "update:visible": (visible: boolean) => any;
     "visible-change": (visible: boolean) => any;
 }, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{
-    "onUpdate:visible"?: ((visible: boolean) => any) | undefined;
-    "onVisible-change"?: ((visible: boolean) => any) | undefined;
+    "onUpdate:visible"?: (visible: boolean) => any;
+    "onVisible-change"?: (visible: boolean) => any;
 }>, {
-    visible: boolean;
+    visible: boolean | undefined;
     loadingLabel: string;
+    emphasis: "low" | "medium" | "high" | (string & {}) | undefined;
     fullScreen: boolean;
-    loadedLabel: string;
     delay: number;
 }, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
 declare const _default: __VLS_WithSlots<typeof __VLS_component, __VLS_Slots>;

package/dist/loading-overlay/LoadingOverlay.vue_vue_type_script_setup_true_lang.cjs

@@ -1 +1 @@
-const n=require("./LoadingOverlayBackdrop.vue.cjs"),u=require("./LoadingOverlayContent.vue.cjs"),s=require("./LoadingOverlayRoot.vue.cjs");let e=require("vue");var p=(0,e.defineComponent)({__name:"LoadingOverlay",props:{visible:{type:Boolean,default:void 0},fullScreen:{type:Boolean,default:!1},loadingLabel:{default:"Loading"},loadedLabel:{default:void 0},delay:{default:0}},emits:["update:visible","visible-change"],setup(o,{emit:r}){const i=o,l=r;return(d,t)=>((0,e.openBlock)(),(0,e.createBlock)(s.default,(0,e.mergeProps)(i,{"onUpdate:visible":t[0]||(t[0]=a=>l("update:visible",a)),onVisibleChange:t[1]||(t[1]=a=>l("visible-change",a))}),{default:(0,e.withCtx)(()=>[(0,e.renderSlot)(d.$slots,"default"),(0,e.createVNode)(n.default),(0,e.createVNode)(u.default)]),_:3},16))}});exports.default=p;
+const v=require("./LoadingOverlayBackdrop.vue.cjs"),c=require("./LoadingOverlayContent.vue.cjs"),m=require("./LoadingOverlayRoot.vue.cjs");let e=require("vue");var f=(0,e.defineComponent)({inheritAttrs:!1,__name:"LoadingOverlay",props:{visible:{type:Boolean,default:void 0},fullScreen:{type:Boolean,default:!1},loadingLabel:{default:"Loading"},loadedLabel:{},delay:{default:0},emphasis:{default:void 0}},emits:["update:visible","visible-change"],setup(l,{emit:n}){const r=l,o=(0,e.useAttrs)(),u=(0,e.computed)(()=>r.emphasis??o["data-emphasis"]),d=(0,e.computed)(()=>{const{"data-emphasis":a,...t}=o;return t}),p=(0,e.computed)(()=>{const{emphasis:a,...t}=r;return t}),i=n;return(a,t)=>((0,e.openBlock)(),(0,e.createBlock)(m.default,(0,e.mergeProps)({...p.value,...d.value},{"onUpdate:visible":t[0]||(t[0]=s=>i("update:visible",s)),onVisibleChange:t[1]||(t[1]=s=>i("visible-change",s))}),{default:(0,e.withCtx)(()=>[(0,e.renderSlot)(a.$slots,"default"),(0,e.createVNode)(v.default,{emphasis:u.value},null,8,["emphasis"]),(0,e.createVNode)(c.default)]),_:3},16))}});exports.default=f;

package/dist/loading-overlay/LoadingOverlay.vue_vue_type_script_setup_true_lang.js

@@ -1 +1 @@
-import e from"./LoadingOverlayBackdrop.vue.js";import a from"./LoadingOverlayContent.vue.js";import o from"./LoadingOverlayRoot.vue.js";import{createBlock as t,createVNode as l,defineComponent as i,mergeProps as d,openBlock as r,renderSlot as s,withCtx as n}from"vue";var p=/* @__PURE__ */i({__name:"LoadingOverlay",props:{visible:{type:Boolean,default:void 0},fullScreen:{type:Boolean,default:!1},loadingLabel:{default:"Loading"},loadedLabel:{default:void 0},delay:{default:0}},emits:["update:visible","visible-change"],setup(i,{emit:p}){const u=i,v=p;return(i,p)=>(r(),t(o,d(u,{"onUpdate:visible":p[0]||(p[0]=e=>v("update:visible",e)),onVisibleChange:p[1]||(p[1]=e=>v("visible-change",e))}),{default:n(()=>[s(i.$slots,"default"),l(e),l(a)]),_:3},16))}});export{p as default};
+import e from"./LoadingOverlayBackdrop.vue.js";import a from"./LoadingOverlayContent.vue.js";import s from"./LoadingOverlayRoot.vue.js";import{computed as t,createBlock as o,createVNode as i,defineComponent as l,mergeProps as r,openBlock as n,renderSlot as d,useAttrs as p,withCtx as u}from"vue";var m=/* @__PURE__ */l({inheritAttrs:!1,__name:"LoadingOverlay",props:{visible:{type:Boolean,default:void 0},fullScreen:{type:Boolean,default:!1},loadingLabel:{default:"Loading"},loadedLabel:{},delay:{default:0},emphasis:{default:void 0}},emits:["update:visible","visible-change"],setup(l,{emit:m}){const v=l,f=p(),c=t(()=>v.emphasis??f["data-emphasis"]),h=t(()=>{const{"data-emphasis":e,...a}=f;return a}),g=t(()=>{const{emphasis:e,...a}=v;return a}),b=m;return(t,l)=>(n(),o(s,r({...g.value,...h.value},{"onUpdate:visible":l[0]||(l[0]=e=>b("update:visible",e)),onVisibleChange:l[1]||(l[1]=e=>b("visible-change",e))}),{default:u(()=>[d(t.$slots,"default"),i(e,{emphasis:c.value},null,8,["emphasis"]),i(a)]),_:3},16))}});export{m as default};

package/dist/loading-overlay/LoadingOverlayBackdrop.vue.d.cts

@@ -1,7 +1,5 @@
 /**
- * The scrim layer. Reads visibility from the root's context.
- *
- * Must be used inside `<SkdxLoadingOverlay>`.
+ * Renders the scrim layer, reading visibility from the root's context.
  *
  * @example
  * ```vue
@@ -11,6 +9,12 @@
  * </SkdxLoadingOverlay>
  * ```
  */
-type __VLS_Props = {};
+type __VLS_Props = {
+    /**
+     * How strongly the skin tints the backdrop, reflected as `data-emphasis`.
+     * @default undefined — falls back to a `data-emphasis` attribute.
+     */
+    emphasis?: 'low' | 'medium' | 'high' | (string & {}) | undefined;
+};
 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/loading-overlay/LoadingOverlayBackdrop.vue.d.ts

@@ -1,7 +1,5 @@
 /**
- * The scrim layer. Reads visibility from the root's context.
- *
- * Must be used inside `<SkdxLoadingOverlay>`.
+ * Renders the scrim layer, reading visibility from the root's context.
  *
  * @example
  * ```vue
@@ -11,6 +9,12 @@
  * </SkdxLoadingOverlay>
  * ```
  */
-type __VLS_Props = {};
+type __VLS_Props = {
+    /**
+     * How strongly the skin tints the backdrop, reflected as `data-emphasis`.
+     * @default undefined — falls back to a `data-emphasis` attribute.
+     */
+    emphasis?: 'low' | 'medium' | 'high' | (string & {}) | undefined;
+};
 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/loading-overlay/LoadingOverlayBackdrop.vue_vue_type_script_setup_true_lang.cjs

@@ -1 +1 @@
-const a=require("./context.cjs");let e=require("vue");var t=["data-full-screen"],n=(0,e.defineComponent)({__name:"LoadingOverlayBackdrop",setup(d){const r=(0,e.inject)(a.LOADING_OVERLAY_CONTEXT);if(!r)throw new Error("<SkdxLoadingOverlayBackdrop> must be used inside <SkdxLoadingOverlay>.");return(o,l)=>(0,e.unref)(r).visible.value?((0,e.openBlock)(),(0,e.createElementBlock)("div",{key:0,class:"skdx-loading-overlay__backdrop","data-part":"backdrop","aria-hidden":"true","data-state":"visible","data-full-screen":(0,e.unref)(r).fullScreen.value?"":void 0},null,8,t)):(0,e.createCommentVNode)("",!0)}});exports.default=n;
+const n=require("../utils/appearance.cjs"),i=require("../utils/injectRequired.cjs"),s=require("./context.cjs");let e=require("vue");var u=["data-full-screen"],d=(0,e.defineComponent)({inheritAttrs:!1,__name:"LoadingOverlayBackdrop",props:{emphasis:{}},setup(t){const r=i.injectRequired(s.LOADING_OVERLAY_CONTEXT,"<SkdxLoadingOverlayBackdrop> must be used inside <SkdxLoadingOverlay>.");return(a,o)=>(0,e.unref)(r).visible.value?((0,e.openBlock)(),(0,e.createElementBlock)("div",(0,e.mergeProps)({key:0,class:"skdx-loading-overlay__backdrop","data-part":"backdrop","aria-hidden":"true","data-state":"visible","data-full-screen":(0,e.unref)(r).fullScreen.value?"":void 0},{...a.$attrs,...(0,e.unref)(n.appearanceAttrs)({emphasis:t.emphasis},a.$attrs)}),null,16,u)):(0,e.createCommentVNode)("",!0)}});exports.default=d;

package/dist/loading-overlay/LoadingOverlayBackdrop.vue_vue_type_script_setup_true_lang.js

@@ -1 +1 @@
-import{LOADING_OVERLAY_CONTEXT as e}from"./context.js";import{createCommentVNode as a,createElementBlock as r,defineComponent as o,inject as t,openBlock as d,unref as n}from"vue";var l=["data-full-screen"],s=/* @__PURE__ */o({__name:"LoadingOverlayBackdrop",setup(o){const s=t(e);if(!s)throw new Error("<SkdxLoadingOverlayBackdrop> must be used inside <SkdxLoadingOverlay>.");return(e,o)=>n(s).visible.value?(d(),r("div",{key:0,class:"skdx-loading-overlay__backdrop","data-part":"backdrop","aria-hidden":"true","data-state":"visible","data-full-screen":n(s).fullScreen.value?"":void 0},null,8,l)):a("",!0)}});export{s as default};
+import{appearanceAttrs as e}from"../utils/appearance.js";import{injectRequired as a}from"../utils/injectRequired.js";import{LOADING_OVERLAY_CONTEXT as r}from"./context.js";import{createCommentVNode as s,createElementBlock as t,defineComponent as i,mergeProps as o,openBlock as d,unref as n}from"vue";var l=["data-full-screen"],p=/* @__PURE__ */i({inheritAttrs:!1,__name:"LoadingOverlayBackdrop",props:{emphasis:{}},setup(i){const p=a(r,"<SkdxLoadingOverlayBackdrop> must be used inside <SkdxLoadingOverlay>.");return(a,r)=>n(p).visible.value?(d(),t("div",o({key:0,class:"skdx-loading-overlay__backdrop","data-part":"backdrop","aria-hidden":"true","data-state":"visible","data-full-screen":n(p).fullScreen.value?"":void 0},{...a.$attrs,...n(e)({emphasis:i.emphasis},a.$attrs)}),null,16,l)):s("",!0)}});export{p as default};

package/dist/loading-overlay/LoadingOverlayContent.vue.d.cts

@@ -1,14 +1,5 @@
 /**
- * The centered indicator layer. Reads visibility and label from the root's
- * context.
- *
- * With no slot content it falls back to `<SkdxSpinner>`, labelled with the
- * root's `loadingLabel`. Fill the default slot to replace it entirely.
- *
- * Sits inside the root's `inert` `covered` wrapper, so nothing here is
- * focusable or announced — the root announces through the live region.
- *
- * Must be used inside `<SkdxLoadingOverlay>`.
+ * Renders the centered indicator layer, falling back to `<SkdxSpinner>` when the default slot is empty.
  *
  * @example
  * ```vue

package/dist/loading-overlay/LoadingOverlayContent.vue.d.ts

@@ -1,14 +1,5 @@
 /**
- * The centered indicator layer. Reads visibility and label from the root's
- * context.
- *
- * With no slot content it falls back to `<SkdxSpinner>`, labelled with the
- * root's `loadingLabel`. Fill the default slot to replace it entirely.
- *
- * Sits inside the root's `inert` `covered` wrapper, so nothing here is
- * focusable or announced — the root announces through the live region.
- *
- * Must be used inside `<SkdxLoadingOverlay>`.
+ * Renders the centered indicator layer, falling back to `<SkdxSpinner>` when the default slot is empty.
  *
  * @example
  * ```vue

package/dist/loading-overlay/LoadingOverlayContent.vue_vue_type_script_setup_true_lang.cjs

@@ -1 +1 @@
-const r=require("../spinner/Spinner.vue.cjs"),a=require("./context.cjs");let e=require("vue");var l=["data-full-screen"],o=(0,e.defineComponent)({__name:"LoadingOverlayContent",setup(u){const t=(0,e.inject)(a.LOADING_OVERLAY_CONTEXT);if(!t)throw new Error("<SkdxLoadingOverlayContent> must be used inside <SkdxLoadingOverlay>.");return(n,d)=>(0,e.unref)(t).visible.value?((0,e.openBlock)(),(0,e.createElementBlock)("div",{key:0,class:"skdx-loading-overlay__content","data-part":"content","data-state":"visible","data-full-screen":(0,e.unref)(t).fullScreen.value?"":void 0},[(0,e.renderSlot)(n.$slots,"default",{},()=>[(0,e.createVNode)(r.default,{label:(0,e.unref)(t).loadingLabel.value},null,8,["label"])])],8,l)):(0,e.createCommentVNode)("",!0)}});exports.default=o;
+const r=require("../utils/injectRequired.cjs"),a=require("../spinner/Spinner.vue.cjs"),l=require("./context.cjs");let e=require("vue");var u=["data-full-screen"],o=(0,e.defineComponent)({__name:"LoadingOverlayContent",setup(i){const t=r.injectRequired(l.LOADING_OVERLAY_CONTEXT,"<SkdxLoadingOverlayContent> must be used inside <SkdxLoadingOverlay>.");return(n,d)=>(0,e.unref)(t).visible.value?((0,e.openBlock)(),(0,e.createElementBlock)("div",{key:0,class:"skdx-loading-overlay__content","data-part":"content","data-state":"visible","data-full-screen":(0,e.unref)(t).fullScreen.value?"":void 0},[(0,e.renderSlot)(n.$slots,"default",{},()=>[(0,e.createVNode)(a.default,{label:(0,e.unref)(t).loadingLabel.value},null,8,["label"])])],8,u)):(0,e.createCommentVNode)("",!0)}});exports.default=o;

package/dist/loading-overlay/LoadingOverlayContent.vue_vue_type_script_setup_true_lang.js

@@ -1 +1 @@
-import e from"../spinner/Spinner.vue.js";import{LOADING_OVERLAY_CONTEXT as a}from"./context.js";import{createCommentVNode as t,createElementBlock as n,createVNode as l,defineComponent as o,inject as r,openBlock as s,renderSlot as d,unref as i}from"vue";var u=["data-full-screen"],c=/* @__PURE__ */o({__name:"LoadingOverlayContent",setup(o){const c=r(a);if(!c)throw new Error("<SkdxLoadingOverlayContent> must be used inside <SkdxLoadingOverlay>.");return(a,o)=>i(c).visible.value?(s(),n("div",{key:0,class:"skdx-loading-overlay__content","data-part":"content","data-state":"visible","data-full-screen":i(c).fullScreen.value?"":void 0},[d(a.$slots,"default",{},()=>[l(e,{label:i(c).loadingLabel.value},null,8,["label"])])],8,u)):t("",!0)}});export{c as default};
+import{injectRequired as e}from"../utils/injectRequired.js";import a from"../spinner/Spinner.vue.js";import{LOADING_OVERLAY_CONTEXT as t}from"./context.js";import{createCommentVNode as n,createElementBlock as l,createVNode as o,defineComponent as r,openBlock as s,renderSlot as i,unref as d}from"vue";var u=["data-full-screen"],c=/* @__PURE__ */r({__name:"LoadingOverlayContent",setup(r){const c=e(t,"<SkdxLoadingOverlayContent> must be used inside <SkdxLoadingOverlay>.");return(e,t)=>d(c).visible.value?(s(),l("div",{key:0,class:"skdx-loading-overlay__content","data-part":"content","data-state":"visible","data-full-screen":d(c).fullScreen.value?"":void 0},[i(e.$slots,"default",{},()=>[o(a,{label:d(c).loadingLabel.value},null,8,["label"])])],8,u)):n("",!0)}});export{c as default};