@skdx/vue 0.27.0 → 0.29.0

package/dist/rating/Rating.vue.d.cts

@@ -1,92 +1,84 @@
-/**
- * The Vue implementation of the shared Rating contract (see
- * `@skdx/shared`'s `ratingContract`). Renders `role="radiogroup"` and
- * drives roving-tabindex keyboard navigation (horizontal, no wrap) across
- * `SkdxRatingItem` children, mirroring `packages/vue/src/tabs/TabsList.vue`'s
- * inline keydown handler.
- *
- * The hover preview is display-only: it drives `data-highlighted`/`data-half`
- * and the `hover-value-change` emit, and never touches the committed `value` —
- * the same preview/commit split as `SkdxSlider`, where dragging paints the
- * track but only pointer-up writes the value.
- *
- * With `allowHalf` the root becomes a `role="slider"` instead: half-star
- * values cannot be told truthfully by a set of whole-star radios, so the root
- * takes the tab stop and reports `aria-valuenow`, handles the arrow keys
- * itself (stepping by `0.5`) rather than roving focus, and the items become
- * purely visual.
- *
- * With a `name`, one visually-hidden native input submits the committed value
- * as `String(value)` with the surrounding `<form>` — an unrated (`0`) rating
- * submits nothing, so `required` reports `valueMissing` — and
- * `checkValidity()`/`reportValidity()` — exposed on this root — delegate to it.
- * Resetting the form restores the value the rating was declared with, emitting
- * `value-change` so a controlled parent follows it.
- */
+import { type SkdxRatingValueChangeDetail } from './context.cjs';
+/** Rating control: `role="radiogroup"` with roving-tabindex, or `role="slider"` with `allowHalf`. */
 type __VLS_Props = {
     /** Selected value, for controlled usage. Pair with `v-model:value` or `@value-change`. */
-    value?: number;
+    value?: number | undefined;
     /** Initial value, for uncontrolled usage, e.g. no items filled. */
     defaultValue?: number;
-    /** Number of items to render, e.g. stars. */
+    /**
+     * Number of items to render, e.g. stars.
+     * @min 1
+     */
     max?: number;
     /**
-     * Allow half-item values (`0.5`, `1`, `1.5`, …). Pointer input picks a half
-     * from the leading half of an item's box (the trailing half under RTL);
-     * keyboard input steps by `0.5` per arrow key, so half values are reachable
-     * without a pointer.
-     *
-     * This changes the widget's ARIA, deliberately: a set of whole-star
-     * `role="radio"` items cannot say "2.5" truthfully, so the root becomes a
-     * `role="slider"` reporting `aria-valuenow`/`aria-valuetext`, takes the
-     * single tab stop, and the items become `aria-hidden` visuals. Give the
-     * root an accessible name (`aria-label`) either way.
+     * Names each `SkdxRatingItem` as its `aria-label`, since a star icon contributes no accessible text on its own.
+     * @default (value, max) => `${value} of ${max} stars`
+     */
+    itemLabel?: (value: number, max: number) => string;
+    /**
+     * Lets the committed value be cleared back to `0` by picking it again — clicking the checked item, or pressing Space on it.
+     * @default false
      */
+    allowClear?: boolean;
+    /** Allows half-item values (`0.5`, `1`, `1.5`, …); the root becomes a `role="slider"` since whole-star radios can't say "2.5" truthfully. */
     allowHalf?: boolean;
     /** Disables every item, blocking all interaction. */
     disabled?: boolean;
     /** Displays the current value but blocks interaction (still focusable, unlike disabled). */
     readOnly?: boolean;
     /**
-     * Name for native form participation via a hidden input, which submits the
-     * committed value as `String(value)`. A value of `0` — nothing rated —
-     * submits nothing, like an unchecked radio group.
+     * Name for native form participation via a hidden input that submits the committed value as `String(value)`; `0` submits nothing.
      * @default undefined
      */
-    name?: string;
+    name?: string | undefined;
     /**
      * Marks the hidden form input required, so an unrated (`0`) rating reports
      * `valueMissing`. Only meaningful with `name`.
      * @default false
      */
     required?: boolean;
+    /**
+     * Id of the `<form>` that owns this rating, for a rating rendered outside it.
+     * @default undefined — the rating belongs to its nearest ancestor `<form>`, if any.
+     */
+    form?: string | undefined;
+    /**
+     * Size rung the skin renders the rating at, reflected as `data-size`.
+     * @default undefined — falls back to a `data-size` attribute.
+     */
+    size?: 'md' | 'sm' | 'lg' | (string & {}) | undefined;
 };
-declare var __VLS_1: {};
-type __VLS_Slots = {} & {
-    default?: (props: typeof __VLS_1) => any;
+type __VLS_Slots = {
+    /** Full manual composition — one Item per position. */
+    default?(): unknown;
+    /** The derived Items' content — a star icon, shared by every position. */
+    icon?(): unknown;
 };
 declare const __VLS_component: import("vue").DefineComponent<__VLS_Props, {
     /** Reports whether the hidden form input satisfies its constraints. `true` without a `name`. */
     checkValidity: () => boolean;
     /** Like `checkValidity()`, but also shows the browser's validation message. */
     reportValidity: () => boolean;
+    /** Pushes an externally-computed error onto the hidden input, like `HTMLInputElement.setCustomValidity()`; `''` clears it. */
+    setCustomValidity: (message: string) => void | undefined;
 }, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
     "update:value": (value: number) => any;
-    "value-change": (value: number) => any;
+    "value-change": (detail: SkdxRatingValueChangeDetail) => any;
     "hover-value-change": (value: number | null) => any;
 }, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{
-    "onUpdate:value"?: ((value: number) => any) | undefined;
-    "onValue-change"?: ((value: number) => any) | undefined;
-    "onHover-value-change"?: ((value: number | null) => any) | undefined;
+    "onUpdate:value"?: (value: number) => any;
+    "onValue-change"?: (detail: SkdxRatingValueChangeDetail) => any;
+    "onHover-value-change"?: (value: number | null) => any;
 }>, {
     disabled: boolean;
-    required: boolean;
-    name: string;
-    value: number;
     defaultValue: number;
     max: number;
     readOnly: boolean;
+    required: boolean;
+    value: number | undefined;
     allowHalf: boolean;
+    itemLabel: (value: number, max: number) => string;
+    allowClear: boolean;
 }, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
 declare const _default: __VLS_WithSlots<typeof __VLS_component, __VLS_Slots>;
 export default _default;

package/dist/rating/Rating.vue.d.ts

@@ -1,92 +1,84 @@
-/**
- * The Vue implementation of the shared Rating contract (see
- * `@skdx/shared`'s `ratingContract`). Renders `role="radiogroup"` and
- * drives roving-tabindex keyboard navigation (horizontal, no wrap) across
- * `SkdxRatingItem` children, mirroring `packages/vue/src/tabs/TabsList.vue`'s
- * inline keydown handler.
- *
- * The hover preview is display-only: it drives `data-highlighted`/`data-half`
- * and the `hover-value-change` emit, and never touches the committed `value` —
- * the same preview/commit split as `SkdxSlider`, where dragging paints the
- * track but only pointer-up writes the value.
- *
- * With `allowHalf` the root becomes a `role="slider"` instead: half-star
- * values cannot be told truthfully by a set of whole-star radios, so the root
- * takes the tab stop and reports `aria-valuenow`, handles the arrow keys
- * itself (stepping by `0.5`) rather than roving focus, and the items become
- * purely visual.
- *
- * With a `name`, one visually-hidden native input submits the committed value
- * as `String(value)` with the surrounding `<form>` — an unrated (`0`) rating
- * submits nothing, so `required` reports `valueMissing` — and
- * `checkValidity()`/`reportValidity()` — exposed on this root — delegate to it.
- * Resetting the form restores the value the rating was declared with, emitting
- * `value-change` so a controlled parent follows it.
- */
+import { type SkdxRatingValueChangeDetail } from './context.js';
+/** Rating control: `role="radiogroup"` with roving-tabindex, or `role="slider"` with `allowHalf`. */
 type __VLS_Props = {
     /** Selected value, for controlled usage. Pair with `v-model:value` or `@value-change`. */
-    value?: number;
+    value?: number | undefined;
     /** Initial value, for uncontrolled usage, e.g. no items filled. */
     defaultValue?: number;
-    /** Number of items to render, e.g. stars. */
+    /**
+     * Number of items to render, e.g. stars.
+     * @min 1
+     */
     max?: number;
     /**
-     * Allow half-item values (`0.5`, `1`, `1.5`, …). Pointer input picks a half
-     * from the leading half of an item's box (the trailing half under RTL);
-     * keyboard input steps by `0.5` per arrow key, so half values are reachable
-     * without a pointer.
-     *
-     * This changes the widget's ARIA, deliberately: a set of whole-star
-     * `role="radio"` items cannot say "2.5" truthfully, so the root becomes a
-     * `role="slider"` reporting `aria-valuenow`/`aria-valuetext`, takes the
-     * single tab stop, and the items become `aria-hidden` visuals. Give the
-     * root an accessible name (`aria-label`) either way.
+     * Names each `SkdxRatingItem` as its `aria-label`, since a star icon contributes no accessible text on its own.
+     * @default (value, max) => `${value} of ${max} stars`
+     */
+    itemLabel?: (value: number, max: number) => string;
+    /**
+     * Lets the committed value be cleared back to `0` by picking it again — clicking the checked item, or pressing Space on it.
+     * @default false
      */
+    allowClear?: boolean;
+    /** Allows half-item values (`0.5`, `1`, `1.5`, …); the root becomes a `role="slider"` since whole-star radios can't say "2.5" truthfully. */
     allowHalf?: boolean;
     /** Disables every item, blocking all interaction. */
     disabled?: boolean;
     /** Displays the current value but blocks interaction (still focusable, unlike disabled). */
     readOnly?: boolean;
     /**
-     * Name for native form participation via a hidden input, which submits the
-     * committed value as `String(value)`. A value of `0` — nothing rated —
-     * submits nothing, like an unchecked radio group.
+     * Name for native form participation via a hidden input that submits the committed value as `String(value)`; `0` submits nothing.
      * @default undefined
      */
-    name?: string;
+    name?: string | undefined;
     /**
      * Marks the hidden form input required, so an unrated (`0`) rating reports
      * `valueMissing`. Only meaningful with `name`.
      * @default false
      */
     required?: boolean;
+    /**
+     * Id of the `<form>` that owns this rating, for a rating rendered outside it.
+     * @default undefined — the rating belongs to its nearest ancestor `<form>`, if any.
+     */
+    form?: string | undefined;
+    /**
+     * Size rung the skin renders the rating at, reflected as `data-size`.
+     * @default undefined — falls back to a `data-size` attribute.
+     */
+    size?: 'md' | 'sm' | 'lg' | (string & {}) | undefined;
 };
-declare var __VLS_1: {};
-type __VLS_Slots = {} & {
-    default?: (props: typeof __VLS_1) => any;
+type __VLS_Slots = {
+    /** Full manual composition — one Item per position. */
+    default?(): unknown;
+    /** The derived Items' content — a star icon, shared by every position. */
+    icon?(): unknown;
 };
 declare const __VLS_component: import("vue").DefineComponent<__VLS_Props, {
     /** Reports whether the hidden form input satisfies its constraints. `true` without a `name`. */
     checkValidity: () => boolean;
     /** Like `checkValidity()`, but also shows the browser's validation message. */
     reportValidity: () => boolean;
+    /** Pushes an externally-computed error onto the hidden input, like `HTMLInputElement.setCustomValidity()`; `''` clears it. */
+    setCustomValidity: (message: string) => void | undefined;
 }, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
     "update:value": (value: number) => any;
-    "value-change": (value: number) => any;
+    "value-change": (detail: SkdxRatingValueChangeDetail) => any;
     "hover-value-change": (value: number | null) => any;
 }, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{
-    "onUpdate:value"?: ((value: number) => any) | undefined;
-    "onValue-change"?: ((value: number) => any) | undefined;
-    "onHover-value-change"?: ((value: number | null) => any) | undefined;
+    "onUpdate:value"?: (value: number) => any;
+    "onValue-change"?: (detail: SkdxRatingValueChangeDetail) => any;
+    "onHover-value-change"?: (value: number | null) => any;
 }>, {
     disabled: boolean;
-    required: boolean;
-    name: string;
-    value: number;
     defaultValue: number;
     max: number;
     readOnly: boolean;
+    required: boolean;
+    value: number | undefined;
     allowHalf: boolean;
+    itemLabel: (value: number, max: number) => string;
+    allowClear: boolean;
 }, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
 declare const _default: __VLS_WithSlots<typeof __VLS_component, __VLS_Slots>;
 export default _default;

package/dist/rating/Rating.vue_vue_type_script_setup_true_lang.cjs

@@ -1 +1 @@
-const H=require("../utils/useFormReset.cjs"),y=require("../utils/direction.cjs"),R=require("../utils/clamp.cjs"),B=require("./context.cjs");let a=require("vue");var E=["aria-disabled","aria-readonly","data-disabled","data-readonly"],O=["name","^value","required","disabled"],C=(0,a.defineComponent)({__name:"Rating",props:{value:{default:void 0},defaultValue:{default:0},max:{default:5},allowHalf:{type:Boolean,default:!1},disabled:{type:Boolean,default:!1},readOnly:{type:Boolean,default:!1},name:{default:void 0},required:{type:Boolean,default:!1}},emits:["update:value","value-change","hover-value-change"],setup(n,{expose:g,emit:w}){const l=n,s=w,c=(0,a.ref)(l.defaultValue),o=(0,a.computed)(()=>l.value===void 0?c.value:l.value),f=(0,a.ref)(null),m=(0,a.ref)(null);function v(e){e!==o.value&&(l.value===void 0&&(c.value=e),s("update:value",e),s("value-change",e))}function h(e){f.value!==e&&(f.value=e,s("hover-value-change",e))}(0,a.provide)(B.RATING_CONTEXT,{value:o,allowHalf:(0,a.computed)(()=>l.allowHalf),hoverValue:(0,a.computed)(()=>f.value),disabled:(0,a.computed)(()=>l.disabled),readOnly:(0,a.computed)(()=>l.readOnly),onValueChange:v,onHoverValueChange:h});const b=y.useDirection(),x=(0,a.computed)(()=>l.allowHalf?{role:"slider","aria-valuemin":0,"aria-valuemax":l.max,"aria-valuenow":o.value,"aria-valuetext":`${o.value} out of ${l.max}`,"aria-orientation":"horizontal",tabindex:l.disabled?-1:0}:{role:"radiogroup"});function V(e,t){let r=null;e==="ArrowRight"||e==="ArrowUp"?r=o.value+.5:e==="ArrowLeft"||e==="ArrowDown"?r=o.value-.5:e==="Home"?r=0:e==="End"&&(r=l.max),r!==null&&(t.preventDefault(),v(R.clamp(r,0,l.max)))}function q(e){if(l.disabled||l.readOnly)return;const t=y.directionalKey(e.key,e.currentTarget,b());if(l.allowHalf){V(t,e);return}const r=m.value;if(!r)return;const u=Array.from(r.querySelectorAll("[data-skdx-rating-item]")).filter(k=>!k.hasAttribute("disabled"));if(u.length===0)return;const p=u.indexOf(document.activeElement);let i;t==="ArrowRight"||t==="ArrowDown"?i=Math.min(p+1,u.length-1):t==="ArrowLeft"||t==="ArrowUp"?i=Math.max(p-1,0):t==="Home"?i=0:t==="End"&&(i=u.length-1),i!==void 0&&(e.preventDefault(),u[i]?.focus())}const d=(0,a.ref)(null),A=l.value??l.defaultValue;return H.useFormReset(()=>d.value,()=>v(A)),g({checkValidity:()=>d.value?.checkValidity()??!0,reportValidity:()=>d.value?.reportValidity()??!0}),(e,t)=>((0,a.openBlock)(),(0,a.createElementBlock)("div",(0,a.mergeProps)({class:"skdx-rating","data-part":"root","data-skdx-component":"rating",ref_key:"rootRef",ref:m},x.value,{"aria-disabled":n.disabled||void 0,"aria-readonly":n.readOnly||void 0,"data-disabled":n.disabled?"":void 0,"data-readonly":n.readOnly?"":void 0,onKeydown:q,onPointerleave:t[0]||(t[0]=r=>h(null))}),[(0,a.renderSlot)(e.$slots,"default"),n.name?((0,a.openBlock)(),(0,a.createElementBlock)("input",{key:0,ref_key:"hiddenEl",ref:d,type:"text","aria-hidden":"true",tabindex:"-1",name:n.name,"^value":o.value>0?String(o.value):"",required:n.required,disabled:n.disabled,style:{position:"absolute","pointer-events":"none",opacity:"0",margin:"0",width:"1px",height:"1px"}},null,8,O)):(0,a.createCommentVNode)("",!0)],16,E))}});exports.default=C;
+const A=require("../utils/appearance.cjs"),C=require("../utils/useFormReset.cjs"),g=require("../utils/direction.cjs"),R=require("../utils/roving-tab-stop.cjs"),$=require("../utils/clamp.cjs"),B=require("./context.cjs"),H=require("./RatingAnatomy.vue.cjs");let a=require("vue");var O=["aria-disabled","aria-readonly","data-disabled","data-readonly"],D=["name","form","^value","required","disabled"],E=(0,a.defineComponent)({inheritAttrs:!1,__name:"Rating",props:{value:{default:void 0},defaultValue:{default:0},max:{default:5},itemLabel:{type:Function,default:(r,f)=>`${r} of ${f} stars`},allowClear:{type:Boolean,default:!1},allowHalf:{type:Boolean,default:!1},disabled:{type:Boolean,default:!1},readOnly:{type:Boolean,default:!1},name:{},required:{type:Boolean,default:!1},form:{},size:{}},emits:["update:value","value-change","hover-value-change"],setup(r,{expose:f,emit:b}){const t=r,c=b,m=(0,a.ref)(t.defaultValue),o=(0,a.computed)(()=>t.value===void 0?m.value:t.value),v=(0,a.ref)(null),y=(0,a.ref)(null);function u(e,l){if(e===o.value)return;const i=o.value===0?null:o.value;t.value===void 0&&(m.value=e),c("update:value",e),c("value-change",{value:e,previousValue:i,reason:l})}function p(e){v.value!==e&&(v.value=e,c("hover-value-change",e))}(0,a.provide)(B.RATING_CONTEXT,{value:o,max:(0,a.computed)(()=>t.max),itemLabel:(0,a.computed)(()=>t.itemLabel),allowClear:(0,a.computed)(()=>t.allowClear),allowHalf:(0,a.computed)(()=>t.allowHalf),hoverValue:(0,a.computed)(()=>v.value),disabled:(0,a.computed)(()=>t.disabled),readOnly:(0,a.computed)(()=>t.readOnly),onValueChange:u,onHoverValueChange:p});const w=g.useDirection(),x=(0,a.computed)(()=>t.allowHalf?{role:"slider","aria-valuemin":0,"aria-valuemax":t.max,"aria-valuenow":o.value,"aria-valuetext":`${o.value} out of ${t.max}`,"aria-orientation":"horizontal",tabindex:t.disabled?-1:0}:{role:"radiogroup"});function q(e,l){let i=null;e==="ArrowRight"||e==="ArrowUp"?i=o.value+.5:(e==="ArrowLeft"||e==="ArrowDown")&&(i=o.value-.5),i!==null&&(l.preventDefault(),u($.clamp(i,0,t.max),"keyboard"))}function V(e){if(t.disabled||t.readOnly)return;const l=g.directionalKey(e.key,e.currentTarget,w());if(l==="Home"||l==="End"){e.preventDefault(),u(l==="Home"?0:t.max,"keyboard");return}if(t.allowHalf){q(l,e);return}const i=y.value;if(!i)return;const d=R.enabledRovingItems(i,"[data-skdx-rating-item]");if(d.length===0)return;const h=d.indexOf(e.target);let s;l==="ArrowRight"||l==="ArrowDown"?s=Math.min(h+1,d.length-1):(l==="ArrowLeft"||l==="ArrowUp")&&(s=Math.max(h-1,0)),s!==void 0&&(e.preventDefault(),d[s]?.focus())}const n=(0,a.ref)(null),k=t.value??t.defaultValue;return C.useFormReset(()=>n.value,()=>u(k,"programmatic")),f({checkValidity:()=>n.value?.checkValidity()??!0,reportValidity:()=>n.value?.reportValidity()??!0,setCustomValidity:e=>n.value?.setCustomValidity(e)}),(e,l)=>((0,a.openBlock)(),(0,a.createElementBlock)("div",(0,a.mergeProps)({ref_key:"rootRef",ref:y,class:"skdx-rating","data-part":"root","data-skdx-component":"rating"},{...e.$attrs,...x.value,...(0,a.unref)(A.appearanceAttrs)({size:r.size},e.$attrs)},{"aria-disabled":r.disabled||void 0,"aria-readonly":r.readOnly||void 0,"data-disabled":r.disabled?"":void 0,"data-readonly":r.readOnly?"":void 0,onKeydown:V,onPointerleave:l[0]||(l[0]=i=>p(null))}),[(0,a.renderSlot)(e.$slots,"default",{},()=>[(0,a.createVNode)(H.default,{max:r.max},(0,a.createSlots)({_:2},[e.$slots.icon?{name:"icon",fn:(0,a.withCtx)(()=>[(0,a.renderSlot)(e.$slots,"icon")]),key:"0"}:void 0]),1032,["max"])]),r.name?((0,a.openBlock)(),(0,a.createElementBlock)("input",{key:0,ref_key:"hiddenEl",ref:n,type:"text","aria-hidden":"true",tabindex:"-1",name:r.name,form:r.form,"^value":o.value>0?String(o.value):"",required:r.required,disabled:r.disabled,style:{position:"absolute","pointer-events":"none",opacity:"0",margin:"0",width:"1px",height:"1px"}},null,8,D)):(0,a.createCommentVNode)("",!0)],16,O))}});exports.default=E;

package/dist/rating/Rating.vue_vue_type_script_setup_true_lang.js

@@ -1 +1 @@
-import{useFormReset as e}from"../utils/useFormReset.js";import{directionalKey as a,useDirection as l}from"../utils/direction.js";import{clamp as t}from"../utils/clamp.js";import{RATING_CONTEXT as r}from"./context.js";import{computed as o,createCommentVNode as n,createElementBlock as i,defineComponent as d,mergeProps as u,openBlock as s,provide as v,ref as f,renderSlot as m}from"vue";var p=["aria-disabled","aria-readonly","data-disabled","data-readonly"],c=["name","^value","required","disabled"],y=/* @__PURE__ */d({__name:"Rating",props:{value:{default:void 0},defaultValue:{default:0},max:{default:5},allowHalf:{type:Boolean,default:!1},disabled:{type:Boolean,default:!1},readOnly:{type:Boolean,default:!1},name:{default:void 0},required:{type:Boolean,default:!1}},emits:["update:value","value-change","hover-value-change"],setup(d,{expose:y,emit:h}){const g=d,x=h,b=f(g.defaultValue),w=o(()=>void 0===g.value?b.value:g.value),A=f(null),k=f(null);function V(e){e!==w.value&&(void 0===g.value&&(b.value=e),x("update:value",e),x("value-change",e))}function H(e){A.value!==e&&(A.value=e,x("hover-value-change",e))}v(r,{value:w,allowHalf:o(()=>g.allowHalf),hoverValue:o(()=>A.value),disabled:o(()=>g.disabled),readOnly:o(()=>g.readOnly),onValueChange:V,onHoverValueChange:H});const O=l(),R=o(()=>g.allowHalf?{role:"slider","aria-valuemin":0,"aria-valuemax":g.max,"aria-valuenow":w.value,"aria-valuetext":`${w.value} out of ${g.max}`,"aria-orientation":"horizontal",tabindex:g.disabled?-1:0}:{role:"radiogroup"});function B(e){if(g.disabled||g.readOnly)return;const l=a(e.key,e.currentTarget,O());if(g.allowHalf)return void function(e,a){let l=null;"ArrowRight"===e||"ArrowUp"===e?l=w.value+.5:"ArrowLeft"===e||"ArrowDown"===e?l=w.value-.5:"Home"===e?l=0:"End"===e&&(l=g.max),null!==l&&(a.preventDefault(),V(t(l,0,g.max)))}(l,e);const r=k.value;if(!r)return;const o=Array.from(r.querySelectorAll("[data-skdx-rating-item]")).filter(e=>!e.hasAttribute("disabled"));if(0===o.length)return;const n=o.indexOf(document.activeElement);let i;"ArrowRight"===l||"ArrowDown"===l?i=Math.min(n+1,o.length-1):"ArrowLeft"===l||"ArrowUp"===l?i=Math.max(n-1,0):"Home"===l?i=0:"End"===l&&(i=o.length-1),void 0!==i&&(e.preventDefault(),o[i]?.focus())}const E=f(null),q=g.value??g.defaultValue;return e(()=>E.value,()=>V(q)),y({checkValidity:()=>E.value?.checkValidity()??!0,reportValidity:()=>E.value?.reportValidity()??!0}),(e,a)=>(s(),i("div",u({class:"skdx-rating","data-part":"root","data-skdx-component":"rating",ref_key:"rootRef",ref:k},R.value,{"aria-disabled":d.disabled||void 0,"aria-readonly":d.readOnly||void 0,"data-disabled":d.disabled?"":void 0,"data-readonly":d.readOnly?"":void 0,onKeydown:B,onPointerleave:a[0]||(a[0]=e=>H(null))}),[m(e.$slots,"default"),d.name?(s(),i("input",{key:0,ref_key:"hiddenEl",ref:E,type:"text","aria-hidden":"true",tabindex:"-1",name:d.name,"^value":w.value>0?String(w.value):"",required:d.required,disabled:d.disabled,style:{position:"absolute","pointer-events":"none",opacity:"0",margin:"0",width:"1px",height:"1px"}},null,8,c)):n("",!0)],16,p))}});export{y as default};
+import{appearanceAttrs as e}from"../utils/appearance.js";import{useFormReset as a}from"../utils/useFormReset.js";import{directionalKey as l,useDirection as t}from"../utils/direction.js";import{enabledRovingItems as o}from"../utils/roving-tab-stop.js";import{clamp as r}from"../utils/clamp.js";import{RATING_CONTEXT as i}from"./context.js";import n from"./RatingAnatomy.vue.js";import{computed as u,createCommentVNode as d,createElementBlock as s,createSlots as m,createVNode as v,defineComponent as f,mergeProps as p,openBlock as c,provide as y,ref as x,renderSlot as g,unref as h,withCtx as b}from"vue";var w=["aria-disabled","aria-readonly","data-disabled","data-readonly"],V=["name","form","^value","required","disabled"],k=/* @__PURE__ */f({inheritAttrs:!1,__name:"Rating",props:{value:{default:void 0},defaultValue:{default:0},max:{default:5},itemLabel:{type:Function,default:(e,a)=>`${e} of ${a} stars`},allowClear:{type:Boolean,default:!1},allowHalf:{type:Boolean,default:!1},disabled:{type:Boolean,default:!1},readOnly:{type:Boolean,default:!1},name:{},required:{type:Boolean,default:!1},form:{},size:{}},emits:["update:value","value-change","hover-value-change"],setup(f,{expose:k,emit:A}){const C=f,R=A,$=x(C.defaultValue),H=u(()=>void 0===C.value?$.value:C.value),O=x(null),j=x(null);function B(e,a){if(e===H.value)return;const l=0===H.value?null:H.value;void 0===C.value&&($.value=e),R("update:value",e),R("value-change",{value:e,previousValue:l,reason:a})}function D(e){O.value!==e&&(O.value=e,R("hover-value-change",e))}y(i,{value:H,max:u(()=>C.max),itemLabel:u(()=>C.itemLabel),allowClear:u(()=>C.allowClear),allowHalf:u(()=>C.allowHalf),hoverValue:u(()=>O.value),disabled:u(()=>C.disabled),readOnly:u(()=>C.readOnly),onValueChange:B,onHoverValueChange:D});const _=t(),L=u(()=>C.allowHalf?{role:"slider","aria-valuemin":0,"aria-valuemax":C.max,"aria-valuenow":H.value,"aria-valuetext":`${H.value} out of ${C.max}`,"aria-orientation":"horizontal",tabindex:C.disabled?-1:0}:{role:"radiogroup"});function q(e){if(C.disabled||C.readOnly)return;const a=l(e.key,e.currentTarget,_());if("Home"===a||"End"===a)return e.preventDefault(),void B("Home"===a?0:C.max,"keyboard");if(C.allowHalf)return void function(e,a){let l=null;"ArrowRight"===e||"ArrowUp"===e?l=H.value+.5:("ArrowLeft"===e||"ArrowDown"===e)&&(l=H.value-.5),null!==l&&(a.preventDefault(),B(r(l,0,C.max),"keyboard"))}(a,e);const t=j.value;if(!t)return;const i=o(t,"[data-skdx-rating-item]");if(0===i.length)return;const n=i.indexOf(e.target);let u;"ArrowRight"===a||"ArrowDown"===a?u=Math.min(n+1,i.length-1):("ArrowLeft"===a||"ArrowUp"===a)&&(u=Math.max(n-1,0)),void 0!==u&&(e.preventDefault(),i[u]?.focus())}const z=x(null),E=C.value??C.defaultValue;return a(()=>z.value,()=>B(E,"programmatic")),k({checkValidity:()=>z.value?.checkValidity()??!0,reportValidity:()=>z.value?.reportValidity()??!0,setCustomValidity:e=>z.value?.setCustomValidity(e)}),(a,l)=>(c(),s("div",p({ref_key:"rootRef",ref:j,class:"skdx-rating","data-part":"root","data-skdx-component":"rating"},{...a.$attrs,...L.value,...h(e)({size:f.size},a.$attrs)},{"aria-disabled":f.disabled||void 0,"aria-readonly":f.readOnly||void 0,"data-disabled":f.disabled?"":void 0,"data-readonly":f.readOnly?"":void 0,onKeydown:q,onPointerleave:l[0]||(l[0]=e=>D(null))}),[g(a.$slots,"default",{},()=>[v(n,{max:f.max},m({_:2},[a.$slots.icon?{name:"icon",fn:b(()=>[g(a.$slots,"icon")]),key:"0"}:void 0]),1032,["max"])]),f.name?(c(),s("input",{key:0,ref_key:"hiddenEl",ref:z,type:"text","aria-hidden":"true",tabindex:"-1",name:f.name,form:f.form,"^value":H.value>0?String(H.value):"",required:f.required,disabled:f.disabled,style:{position:"absolute","pointer-events":"none",opacity:"0",margin:"0",width:"1px",height:"1px"}},null,8,V)):d("",!0)],16,w))}});export{k as default};

package/dist/rating/RatingAnatomy.vue.cjs

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

package/dist/rating/RatingAnatomy.vue.d.cts

@@ -0,0 +1,17 @@
+/** @internal Draws `max` Items, each with icon slot content or a default star. */
+type __VLS_Props = {
+    max?: number | undefined;
+};
+type __VLS_Slots = {
+    icon?(): unknown;
+};
+declare const __VLS_component: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {
+    max: number | undefined;
+}, {}, {}, {}, 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/rating/RatingAnatomy.vue.d.ts

@@ -0,0 +1,17 @@
+/** @internal Draws `max` Items, each with icon slot content or a default star. */
+type __VLS_Props = {
+    max?: number | undefined;
+};
+type __VLS_Slots = {
+    icon?(): unknown;
+};
+declare const __VLS_component: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {
+    max: number | undefined;
+}, {}, {}, {}, 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/rating/RatingAnatomy.vue.js

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

package/dist/rating/RatingAnatomy.vue_vue_type_script_setup_true_lang.cjs

@@ -0,0 +1 @@
+const u=require("../utils/Glyph.vue.cjs"),n=require("./RatingItem.vue.cjs");let e=require("vue");var l=(0,e.defineComponent)({__name:"RatingAnatomy",props:{max:{default:5}},setup(r){return(a,o)=>((0,e.openBlock)(!0),(0,e.createElementBlock)(e.Fragment,null,(0,e.renderList)(r.max,t=>((0,e.openBlock)(),(0,e.createBlock)(n.default,{key:t,value:t},{default:(0,e.withCtx)(()=>[(0,e.renderSlot)(a.$slots,"icon",{},()=>[(0,e.createVNode)(u.default,{name:"star"})])]),_:3},8,["value"]))),128))}});exports.default=l;

package/dist/rating/RatingAnatomy.vue_vue_type_script_setup_true_lang.js

@@ -0,0 +1 @@
+import e from"../utils/Glyph.vue.js";import a from"./RatingItem.vue.js";import{Fragment as t,createBlock as o,createElementBlock as s,createVNode as r,defineComponent as l,openBlock as m,renderList as n,renderSlot as u,withCtx as i}from"vue";var p=/* @__PURE__ */l({__name:"RatingAnatomy",props:{max:{default:5}},setup:l=>(p,c)=>(m(!0),s(t,null,n(l.max,t=>(m(),o(a,{key:t,value:t},{default:i(()=>[u(p.$slots,"icon",{},()=>[r(e,{name:"star"})])]),_:3},8,["value"]))),128))});export{p as default};

package/dist/rating/RatingItem.vue.d.cts

@@ -1,24 +1,15 @@
-/**
- * A single selectable item (e.g. one star) within a `SkdxRating`. Renders
- * `role="radio"` with `data-highlighted` set for this item and every one
- * before it (up to the hovered item, or the committed value). Selects on
- * click/focus (WAI-ARIA radio pattern); hovering previews the value.
- *
- * When the `SkdxRating` root sets `allowHalf` the item is purely visual —
- * `aria-hidden`, out of the tab order, no `role="radio"` — because the root
- * carries the whole widget's semantics as a `role="slider"`. It still emits
- * `data-highlighted` plus `data-half` (present when the effective value lands
- * on this item's leading half) so a brand layer can paint half a star.
- */
+/** Rating item (e.g. one star) that selects on click or focus, with hover previewing the value. */
 type __VLS_Props = {
     /** This item's 1-indexed position within the rating scale. */
     value: number;
-    /** Excludes this item from selection, hover preview, and roving focus. */
+    /** Excludes this item from selection, hover preview, and roving focus. @default false */
     disabled?: boolean;
 };
-declare var __VLS_1: {};
+declare var __VLS_1: {}, __VLS_3: {};
 type __VLS_Slots = {} & {
     default?: (props: typeof __VLS_1) => any;
+} & {
+    default?: (props: typeof __VLS_3) => 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;

package/dist/rating/RatingItem.vue.d.ts

@@ -1,24 +1,15 @@
-/**
- * A single selectable item (e.g. one star) within a `SkdxRating`. Renders
- * `role="radio"` with `data-highlighted` set for this item and every one
- * before it (up to the hovered item, or the committed value). Selects on
- * click/focus (WAI-ARIA radio pattern); hovering previews the value.
- *
- * When the `SkdxRating` root sets `allowHalf` the item is purely visual —
- * `aria-hidden`, out of the tab order, no `role="radio"` — because the root
- * carries the whole widget's semantics as a `role="slider"`. It still emits
- * `data-highlighted` plus `data-half` (present when the effective value lands
- * on this item's leading half) so a brand layer can paint half a star.
- */
+/** Rating item (e.g. one star) that selects on click or focus, with hover previewing the value. */
 type __VLS_Props = {
     /** This item's 1-indexed position within the rating scale. */
     value: number;
-    /** Excludes this item from selection, hover preview, and roving focus. */
+    /** Excludes this item from selection, hover preview, and roving focus. @default false */
     disabled?: boolean;
 };
-declare var __VLS_1: {};
+declare var __VLS_1: {}, __VLS_3: {};
 type __VLS_Slots = {} & {
     default?: (props: typeof __VLS_1) => any;
+} & {
+    default?: (props: typeof __VLS_3) => 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;

package/dist/rating/RatingItem.vue_vue_type_script_setup_true_lang.cjs

@@ -1 +1 @@
-const y=require("../utils/direction.cjs"),x=require("./context.cjs");let e=require("vue");var C=["data-state","data-highlighted","data-half","data-disabled","disabled"],P=(0,e.defineComponent)({__name:"RatingItem",props:{value:{},disabled:{type:Boolean,default:!1}},setup(f){const t=f,a=(0,e.inject)(x.RATING_CONTEXT);if(!a)throw new Error("<SkdxRatingItem> must be used inside <SkdxRating>.");const u=(0,e.computed)(()=>a.allowHalf.value),i=(0,e.computed)(()=>a.value.value===t.value||u.value&&a.value.value===t.value-.5),n=(0,e.computed)(()=>a.disabled.value||t.disabled),v=(0,e.computed)(()=>a.hoverValue.value??a.value.value),h=(0,e.computed)(()=>v.value>=(u.value?t.value-.5:t.value)),p=(0,e.computed)(()=>u.value&&v.value===t.value-.5),m=(0,e.computed)(()=>i.value||a.value.value===0&&t.value===1),g=(0,e.computed)(()=>u.value?{"aria-hidden":"true",tabindex:-1}:{role:"radio","aria-checked":i.value,tabindex:m.value?0:-1});function c(l){n.value||a.readOnly.value||a.onValueChange(l)}function r(l){if(!u.value)return t.value;const o=l.currentTarget,d=o.getBoundingClientRect();if(!d.width)return t.value;const s=(l.clientX-d.left)/d.width;return(y.resolveDirection(o)==="rtl"?1-s:s)<=.5?t.value-.5:t.value}function _(l){c(r(l))}function b(){!u.value&&!i.value&&c(t.value)}function k(l){!n.value&&!a.readOnly.value&&a.onHoverValueChange(r(l))}function w(l){!u.value||n.value||a.readOnly.value||a.onHoverValueChange(r(l))}return(l,o)=>((0,e.openBlock)(),(0,e.createElementBlock)("button",(0,e.mergeProps)({class:"skdx-rating__item","data-part":"item",type:"button"},g.value,{"data-skdx-rating-item":"","data-state":i.value?"checked":"unchecked","data-highlighted":h.value?"":void 0,"data-half":p.value?"":void 0,"data-disabled":n.value?"":void 0,disabled:n.value,onClick:_,onFocus:b,onPointerenter:k,onPointermove:w,onKeydown:o[0]||(o[0]=(0,e.withKeys)((0,e.withModifiers)(()=>{},["prevent"]),["enter"]))}),[(0,e.renderSlot)(l.$slots,"default")],16,C))}});exports.default=P;
+const w=require("../utils/injectRequired.cjs"),C=require("../utils/direction.cjs"),R=require("./context.cjs");let e=require("vue");var x=["data-state","data-highlighted","data-half","data-disabled"],B=["data-state","data-highlighted","data-half","data-disabled","disabled"],V=(0,e.defineComponent)({__name:"RatingItem",props:{value:{},disabled:{type:Boolean,default:!1}},setup(b){const l=b,a=w.injectRequired(R.RATING_CONTEXT,"<SkdxRatingItem> must be used inside <SkdxRating>."),u=(0,e.computed)(()=>a.allowHalf.value),i=(0,e.computed)(()=>a.value.value===l.value||u.value&&a.value.value===l.value-.5),o=(0,e.computed)(()=>a.disabled.value||l.disabled),s=(0,e.computed)(()=>a.hoverValue.value??a.value.value),c=(0,e.computed)(()=>s.value>=(u.value?l.value-.5:l.value)),h=(0,e.computed)(()=>u.value&&s.value===l.value-.5),y=(0,e.computed)(()=>i.value||a.value.value===0&&l.value===1);let d=!1;const p=(0,e.computed)(()=>u.value?{role:"presentation"}:{role:"radio","aria-checked":i.value,"aria-label":a.itemLabel.value(l.value,a.max.value),tabindex:y.value?0:-1});function f(t,n){if(!(o.value||a.readOnly.value)){if(a.allowClear.value&&t===a.value.value){a.onValueChange(0,n);return}a.onValueChange(t,n)}}function r(t){if(!u.value)return l.value;const n=t.currentTarget,v=n.getBoundingClientRect();if(!v.width)return l.value;const _=(t.clientX-v.left)/v.width;return(C.resolveDirection(n)==="rtl"?1-_:_)<=.5?l.value-.5:l.value}function m(t){f(r(t),"pointer")}function P(){d=!0}function q(){const t=d?"pointer":"keyboard";d=!1,!u.value&&!i.value&&f(l.value,t)}function g(t){!o.value&&!a.readOnly.value&&a.onHoverValueChange(r(t))}function k(t){!u.value||o.value||a.readOnly.value||a.onHoverValueChange(r(t))}return(t,n)=>u.value?((0,e.openBlock)(),(0,e.createElementBlock)("span",(0,e.mergeProps)({key:0,class:"skdx-rating__item","data-part":"item"},p.value,{"data-skdx-rating-item":"","data-state":i.value?"checked":"unchecked","data-highlighted":c.value?"":void 0,"data-half":h.value?"":void 0,"data-disabled":o.value?"":void 0,onClick:m,onPointerenter:g,onPointermove:k}),[(0,e.renderSlot)(t.$slots,"default")],16,x)):((0,e.openBlock)(),(0,e.createElementBlock)("button",(0,e.mergeProps)({key:1,class:"skdx-rating__item","data-part":"item",type:"button"},p.value,{"data-skdx-rating-item":"","data-state":i.value?"checked":"unchecked","data-highlighted":c.value?"":void 0,"data-half":h.value?"":void 0,"data-disabled":o.value?"":void 0,disabled:o.value,onClick:m,onFocus:q,onPointerdown:P,onPointerenter:g,onPointermove:k,onKeydown:n[0]||(n[0]=(0,e.withKeys)((0,e.withModifiers)(()=>{},["prevent"]),["enter"]))}),[(0,e.renderSlot)(t.$slots,"default")],16,B))}});exports.default=V;

package/dist/rating/RatingItem.vue_vue_type_script_setup_true_lang.js

@@ -1 +1 @@
-import{resolveDirection as e}from"../utils/direction.js";import{RATING_CONTEXT as a}from"./context.js";import{computed as t,createElementBlock as l,defineComponent as u,inject as n,mergeProps as i,openBlock as o,renderSlot as v,withKeys as d,withModifiers as r}from"vue";var s=["data-state","data-highlighted","data-half","data-disabled","disabled"],c=/* @__PURE__ */u({__name:"RatingItem",props:{value:{},disabled:{type:Boolean,default:!1}},setup(u){const c=u,f=n(a);if(!f)throw new Error("<SkdxRatingItem> must be used inside <SkdxRating>.");const h=t(()=>f.allowHalf.value),m=t(()=>f.value.value===c.value||h.value&&f.value.value===c.value-.5),g=t(()=>f.disabled.value||c.disabled),p=t(()=>f.hoverValue.value??f.value.value),b=t(()=>p.value>=(h.value?c.value-.5:c.value)),k=t(()=>h.value&&p.value===c.value-.5),w=t(()=>m.value||0===f.value.value&&1===c.value),x=t(()=>h.value?{"aria-hidden":"true",tabindex:-1}:{role:"radio","aria-checked":m.value,tabindex:w.value?0:-1});function y(e){g.value||f.readOnly.value||f.onValueChange(e)}function C(a){if(!h.value)return c.value;const t=a.currentTarget,l=t.getBoundingClientRect();if(!l.width)return c.value;const u=(a.clientX-l.left)/l.width;return("rtl"===e(t)?1-u:u)<=.5?c.value-.5:c.value}function R(e){y(C(e))}function _(){!h.value&&!m.value&&y(c.value)}function B(e){!g.value&&!f.readOnly.value&&f.onHoverValueChange(C(e))}function O(e){!h.value||g.value||f.readOnly.value||f.onHoverValueChange(C(e))}return(e,a)=>(o(),l("button",i({class:"skdx-rating__item","data-part":"item",type:"button"},x.value,{"data-skdx-rating-item":"","data-state":m.value?"checked":"unchecked","data-highlighted":b.value?"":void 0,"data-half":k.value?"":void 0,"data-disabled":g.value?"":void 0,disabled:g.value,onClick:R,onFocus:_,onPointerenter:B,onPointermove:O,onKeydown:a[0]||(a[0]=d(r(()=>{},["prevent"]),["enter"]))}),[v(e.$slots,"default")],16,s))}});export{c as default};
+import{injectRequired as e}from"../utils/injectRequired.js";import{resolveDirection as a}from"../utils/direction.js";import{RATING_CONTEXT as t}from"./context.js";import{computed as l,createElementBlock as u,defineComponent as n,mergeProps as i,openBlock as d,renderSlot as o,withKeys as v,withModifiers as r}from"vue";var s=["data-state","data-highlighted","data-half","data-disabled"],c=["data-state","data-highlighted","data-half","data-disabled","disabled"],h=/* @__PURE__ */n({__name:"RatingItem",props:{value:{},disabled:{type:Boolean,default:!1}},setup(n){const h=n,f=e(t,"<SkdxRatingItem> must be used inside <SkdxRating>."),m=l(()=>f.allowHalf.value),g=l(()=>f.value.value===h.value||m.value&&f.value.value===h.value-.5),p=l(()=>f.disabled.value||h.disabled),k=l(()=>f.hoverValue.value??f.value.value),b=l(()=>k.value>=(m.value?h.value-.5:h.value)),x=l(()=>m.value&&k.value===h.value-.5),y=l(()=>g.value||0===f.value.value&&1===h.value);let C=!1;const w=l(()=>m.value?{role:"presentation"}:{role:"radio","aria-checked":g.value,"aria-label":f.itemLabel.value(h.value,f.max.value),tabindex:y.value?0:-1});function R(e,a){if(!p.value&&!f.readOnly.value){if(f.allowClear.value&&e===f.value.value)return void f.onValueChange(0,a);f.onValueChange(e,a)}}function _(e){if(!m.value)return h.value;const t=e.currentTarget,l=t.getBoundingClientRect();if(!l.width)return h.value;const u=(e.clientX-l.left)/l.width;return("rtl"===a(t)?1-u:u)<=.5?h.value-.5:h.value}function P(e){R(_(e),"pointer")}function j(){C=!0}function V(){const e=C?"pointer":"keyboard";C=!1,!m.value&&!g.value&&R(h.value,e)}function B(e){!p.value&&!f.readOnly.value&&f.onHoverValueChange(_(e))}function O(e){!m.value||p.value||f.readOnly.value||f.onHoverValueChange(_(e))}return(e,a)=>m.value?(d(),u("span",i({key:0,class:"skdx-rating__item","data-part":"item"},w.value,{"data-skdx-rating-item":"","data-state":g.value?"checked":"unchecked","data-highlighted":b.value?"":void 0,"data-half":x.value?"":void 0,"data-disabled":p.value?"":void 0,onClick:P,onPointerenter:B,onPointermove:O}),[o(e.$slots,"default")],16,s)):(d(),u("button",i({key:1,class:"skdx-rating__item","data-part":"item",type:"button"},w.value,{"data-skdx-rating-item":"","data-state":g.value?"checked":"unchecked","data-highlighted":b.value?"":void 0,"data-half":x.value?"":void 0,"data-disabled":p.value?"":void 0,disabled:p.value,onClick:P,onFocus:V,onPointerdown:j,onPointerenter:B,onPointermove:O,onKeydown:a[0]||(a[0]=v(r(()=>{},["prevent"]),["enter"]))}),[o(e.$slots,"default")],16,c))}});export{h as default};

package/dist/rating/context.d.cts

@@ -1,12 +1,26 @@
 import type { ComputedRef, InjectionKey } from 'vue';
+/** Payload the `value-change` event carries, with `reason` distinguishing click, keyboard, and programmatic sources. */
+export interface SkdxRatingValueChangeDetail {
+    /** The rating value the change settled on. */
+    value: number;
+    /** The value held before the change, or `null` when it was `0` — 0 and "unrated" are the same state. */
+    previousValue: number | null;
+    /** What drove the change: `'keyboard'` for arrow/Home/End/focus, `'pointer'` for a click, `'programmatic'` for an application-driven set. */
+    reason: 'keyboard' | 'pointer' | 'programmatic';
+}
 /** @internal Injection key a Rating provides so its items can read/drive shared state. */
 export interface RatingContext {
     value: ComputedRef<number>;
+    max: ComputedRef<number>;
+    /** Resolved `itemLabel` — each item calls it with its own value and the group's `max` to name itself. */
+    itemLabel: ComputedRef<(value: number, max: number) => string>;
+    /** Whether re-picking the committed value clears the rating to 0. */
+    allowClear: ComputedRef<boolean>;
     allowHalf: ComputedRef<boolean>;
     hoverValue: ComputedRef<number | null>;
     disabled: ComputedRef<boolean>;
     readOnly: ComputedRef<boolean>;
-    onValueChange: (value: number) => void;
+    onValueChange: (value: number, reason: SkdxRatingValueChangeDetail['reason']) => void;
     onHoverValueChange: (value: number | null) => void;
 }
 /** @internal Injection key a Rating provides so its items share the current value, hover value, and change handlers. */

package/dist/rating/context.d.ts

@@ -1,12 +1,26 @@
 import type { ComputedRef, InjectionKey } from 'vue';
+/** Payload the `value-change` event carries, with `reason` distinguishing click, keyboard, and programmatic sources. */
+export interface SkdxRatingValueChangeDetail {
+    /** The rating value the change settled on. */
+    value: number;
+    /** The value held before the change, or `null` when it was `0` — 0 and "unrated" are the same state. */
+    previousValue: number | null;
+    /** What drove the change: `'keyboard'` for arrow/Home/End/focus, `'pointer'` for a click, `'programmatic'` for an application-driven set. */
+    reason: 'keyboard' | 'pointer' | 'programmatic';
+}
 /** @internal Injection key a Rating provides so its items can read/drive shared state. */
 export interface RatingContext {
     value: ComputedRef<number>;
+    max: ComputedRef<number>;
+    /** Resolved `itemLabel` — each item calls it with its own value and the group's `max` to name itself. */
+    itemLabel: ComputedRef<(value: number, max: number) => string>;
+    /** Whether re-picking the committed value clears the rating to 0. */
+    allowClear: ComputedRef<boolean>;
     allowHalf: ComputedRef<boolean>;
     hoverValue: ComputedRef<number | null>;
     disabled: ComputedRef<boolean>;
     readOnly: ComputedRef<boolean>;
-    onValueChange: (value: number) => void;
+    onValueChange: (value: number, reason: SkdxRatingValueChangeDetail['reason']) => void;
     onHoverValueChange: (value: number | null) => void;
 }
 /** @internal Injection key a Rating provides so its items share the current value, hover value, and change handlers. */

package/dist/rating/index.cjs

@@ -1 +1 @@
-Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("./Rating.vue.cjs"),t=require("./RatingItem.vue.cjs");exports.SkdxRating=e.default;exports.SkdxRatingItem=t.default;
+Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("./Rating.vue.cjs");exports.SkdxRating=e.default;

package/dist/rating/index.d.cts

@@ -1,2 +1,2 @@
 export { default as SkdxRating } from './Rating.vue.cjs';
-export { default as SkdxRatingItem } from './RatingItem.vue.cjs';
+export type { SkdxRatingValueChangeDetail } from './context.cjs';

package/dist/rating/index.d.ts

@@ -1,2 +1,2 @@
 export { default as SkdxRating } from './Rating.vue.js';
-export { default as SkdxRatingItem } from './RatingItem.vue.js';
+export type { SkdxRatingValueChangeDetail } from './context.js';

package/dist/rating/index.js

@@ -1 +1 @@
-import t from"./Rating.vue.js";import a from"./RatingItem.vue.js";export{t as SkdxRating,a as SkdxRatingItem};
+import t from"./Rating.vue.js";export{t as SkdxRating};

package/dist/rating/primitives.cjs

@@ -0,0 +1 @@
+Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("./RatingItem.vue.cjs"),t=require("./Rating.vue.cjs");exports.SkdxRating=t.default;exports.SkdxRatingItem=e.default;

package/dist/rating/primitives.d.cts

@@ -0,0 +1,19 @@
+/**
+ * Advanced primitives for `SkdxRating` — the parts the recipe composes.
+ *
+ * @example
+ * ```vue
+ * <script setup lang="ts">
+ * import { SkdxRating, SkdxRatingItem } from '@skdx/vue/primitives/rating';
+ * </script>
+ *
+ * <template>
+ *   <SkdxRating aria-label="Rate this" :max="5">
+ *     <SkdxRatingItem v-for="i in 5" :key="i" :value="i">★</SkdxRatingItem>
+ *   </SkdxRating>
+ * </template>
+ * ```
+ */
+export { default as SkdxRating } from './Rating.vue.cjs';
+export { default as SkdxRatingItem } from './RatingItem.vue.cjs';
+export type { SkdxRatingValueChangeDetail } from './context.cjs';

package/dist/rating/primitives.d.ts

@@ -0,0 +1,19 @@
+/**
+ * Advanced primitives for `SkdxRating` — the parts the recipe composes.
+ *
+ * @example
+ * ```vue
+ * <script setup lang="ts">
+ * import { SkdxRating, SkdxRatingItem } from '@skdx/vue/primitives/rating';
+ * </script>
+ *
+ * <template>
+ *   <SkdxRating aria-label="Rate this" :max="5">
+ *     <SkdxRatingItem v-for="i in 5" :key="i" :value="i">★</SkdxRatingItem>
+ *   </SkdxRating>
+ * </template>
+ * ```
+ */
+export { default as SkdxRating } from './Rating.vue.js';
+export { default as SkdxRatingItem } from './RatingItem.vue.js';
+export type { SkdxRatingValueChangeDetail } from './context.js';

package/dist/rating/primitives.js

@@ -0,0 +1 @@
+import t from"./RatingItem.vue.js";import a from"./Rating.vue.js";export{a as SkdxRating,t as SkdxRatingItem};