@skdx/react 0.26.0 → 0.28.0

package/dist/angle-slider/AngleSliderMarks.d.cts

@@ -1,17 +1,14 @@
 import * as React from 'react';
 import type { AngleSliderMarksProps } from './types.cjs';
 /**
- * Container for an {@link AngleSlider}'s tick marks. Structural only — it
- * mirrors the root's `data-disabled` / `data-readonly` so a brand layer can dim
- * the whole ring in one rule, and otherwise stays out of the way.
+ * Container for {@link AngleSlider} tick marks. Mirrors root's
+ * `data-disabled` / `data-readonly` for consistent styling.
  *
- * It is deliberately **not** `aria-hidden`: marks often carry real labels
- * ("N", "E", "S", "W", "45°"), and hiding them wholesale would throw away text
- * a screen-reader user may want. Add `aria-hidden` yourself on purely
- * decorative ticks.
+ * Deliberately not `aria-hidden`: marks carry labels users need. Add
+ * `aria-hidden` to purely decorative marks.
  *
- * Marks do not have to live inside it — the root finds them anywhere in its
- * subtree — but grouping them gives the ring a single positioning context.
+ * Marks can live anywhere in the root's subtree, but grouping here provides a
+ * single positioning context for the ring.
  *
  * @example
  * ```tsx

package/dist/angle-slider/AngleSliderMarks.d.ts

@@ -1,17 +1,14 @@
 import * as React from 'react';
 import type { AngleSliderMarksProps } from './types.js';
 /**
- * Container for an {@link AngleSlider}'s tick marks. Structural only — it
- * mirrors the root's `data-disabled` / `data-readonly` so a brand layer can dim
- * the whole ring in one rule, and otherwise stays out of the way.
+ * Container for {@link AngleSlider} tick marks. Mirrors root's
+ * `data-disabled` / `data-readonly` for consistent styling.
  *
- * It is deliberately **not** `aria-hidden`: marks often carry real labels
- * ("N", "E", "S", "W", "45°"), and hiding them wholesale would throw away text
- * a screen-reader user may want. Add `aria-hidden` yourself on purely
- * decorative ticks.
+ * Deliberately not `aria-hidden`: marks carry labels users need. Add
+ * `aria-hidden` to purely decorative marks.
  *
- * Marks do not have to live inside it — the root finds them anywhere in its
- * subtree — but grouping them gives the ring a single positioning context.
+ * Marks can live anywhere in the root's subtree, but grouping here provides a
+ * single positioning context for the ring.
  *
  * @example
  * ```tsx

package/dist/angle-slider/AngleSliderThumb.d.cts

@@ -1,23 +1,9 @@
 import * as React from 'react';
 import type { AngleSliderThumbProps } from './types.cjs';
 /**
- * The handle that points at an {@link AngleSlider}'s current angle. Purely
- * visual: `aria-hidden` and out of the tab order, because the root carries the
- * whole widget's `role="slider"` semantics and takes the single tab stop —
- * a second focusable element here would announce the same value twice.
+ * Visual-only angle slider thumb, `aria-hidden` since root carries slider semantics.
  *
- * It ships **no positioning**. The root publishes `--skdx-angle-slider-angle`,
- * so one CSS rule rotates the thumb and nothing recomputes a transform per
- * frame:
- *
- * ```css
- * .my-thumb {
- *   transform: rotate(var(--skdx-angle-slider-angle)) translateY(-60px);
- * }
- * ```
- *
- * Exposes `data-value`, `data-disabled`, `data-readonly` and `data-dragging`
- * (present while a pointer drag is in flight) for styling.
+ * Ships no positioning — use `--skdx-angle-slider-angle` CSS variable. Exposes `data-value`, `data-disabled`, `data-readonly`, `data-dragging`.
  *
  * @example
  * ```tsx

package/dist/angle-slider/AngleSliderThumb.d.ts

@@ -1,23 +1,9 @@
 import * as React from 'react';
 import type { AngleSliderThumbProps } from './types.js';
 /**
- * The handle that points at an {@link AngleSlider}'s current angle. Purely
- * visual: `aria-hidden` and out of the tab order, because the root carries the
- * whole widget's `role="slider"` semantics and takes the single tab stop —
- * a second focusable element here would announce the same value twice.
+ * Visual-only angle slider thumb, `aria-hidden` since root carries slider semantics.
  *
- * It ships **no positioning**. The root publishes `--skdx-angle-slider-angle`,
- * so one CSS rule rotates the thumb and nothing recomputes a transform per
- * frame:
- *
- * ```css
- * .my-thumb {
- *   transform: rotate(var(--skdx-angle-slider-angle)) translateY(-60px);
- * }
- * ```
- *
- * Exposes `data-value`, `data-disabled`, `data-readonly` and `data-dragging`
- * (present while a pointer drag is in flight) for styling.
+ * Ships no positioning — use `--skdx-angle-slider-angle` CSS variable. Exposes `data-value`, `data-disabled`, `data-readonly`, `data-dragging`.
  *
  * @example
  * ```tsx

package/dist/angle-slider/index.d.cts

@@ -1,5 +1,2 @@
 export { AngleSlider } from './AngleSlider.cjs';
-export { AngleSliderThumb } from './AngleSliderThumb.cjs';
-export { AngleSliderMarks } from './AngleSliderMarks.cjs';
-export { AngleSliderMark } from './AngleSliderMark.cjs';
-export type { AngleSliderProps, AngleSliderThumbProps, AngleSliderMarksProps, AngleSliderMarkProps, } from './types.cjs';
+export type { AngleSliderProps, AngleSliderMarkData, AngleSliderValueChangeDetail } from './types.cjs';

package/dist/angle-slider/index.d.ts

@@ -1,5 +1,2 @@
 export { AngleSlider } from './AngleSlider.js';
-export { AngleSliderThumb } from './AngleSliderThumb.js';
-export { AngleSliderMarks } from './AngleSliderMarks.js';
-export { AngleSliderMark } from './AngleSliderMark.js';
-export type { AngleSliderProps, AngleSliderThumbProps, AngleSliderMarksProps, AngleSliderMarkProps, } from './types.js';
+export type { AngleSliderProps, AngleSliderMarkData, AngleSliderValueChangeDetail } from './types.js';

package/dist/angle-slider/primitives.d.cts

@@ -0,0 +1,23 @@
+/**
+ * Advanced primitives for `AngleSlider` — the parts the recipe composes. Use
+ * for full manual composition.
+ *
+ * @example
+ * ```tsx
+ * import { AngleSlider, AngleSliderMark, AngleSliderMarks, AngleSliderThumb } from '@skdx/react/primitives/angle-slider';
+ *
+ * <AngleSlider defaultValue={45}>
+ *   <AngleSliderMarks>
+ *     {[0, 90, 180, 270].map((angle) => (
+ *       <AngleSliderMark key={angle} value={angle} />
+ *     ))}
+ *   </AngleSliderMarks>
+ *   <AngleSliderThumb />
+ * </AngleSlider>
+ * ```
+ */
+export { AngleSlider } from './AngleSlider.cjs';
+export { AngleSliderThumb } from './AngleSliderThumb.cjs';
+export { AngleSliderMarks } from './AngleSliderMarks.cjs';
+export { AngleSliderMark } from './AngleSliderMark.cjs';
+export type { AngleSliderProps, AngleSliderThumbProps, AngleSliderMarksProps, AngleSliderMarkProps, } from './types.cjs';

package/dist/angle-slider/primitives.d.ts

@@ -0,0 +1,23 @@
+/**
+ * Advanced primitives for `AngleSlider` — the parts the recipe composes. Use
+ * for full manual composition.
+ *
+ * @example
+ * ```tsx
+ * import { AngleSlider, AngleSliderMark, AngleSliderMarks, AngleSliderThumb } from '@skdx/react/primitives/angle-slider';
+ *
+ * <AngleSlider defaultValue={45}>
+ *   <AngleSliderMarks>
+ *     {[0, 90, 180, 270].map((angle) => (
+ *       <AngleSliderMark key={angle} value={angle} />
+ *     ))}
+ *   </AngleSliderMarks>
+ *   <AngleSliderThumb />
+ * </AngleSlider>
+ * ```
+ */
+export { AngleSlider } from './AngleSlider.js';
+export { AngleSliderThumb } from './AngleSliderThumb.js';
+export { AngleSliderMarks } from './AngleSliderMarks.js';
+export { AngleSliderMark } from './AngleSliderMark.js';
+export type { AngleSliderProps, AngleSliderThumbProps, AngleSliderMarksProps, AngleSliderMarkProps, } from './types.js';

package/dist/angle-slider/types.d.cts

@@ -1,4 +1,25 @@
 import type { PrimitivePropsWithRef } from '../utils/primitive.cjs';
+/**
+ * The payload `onValueChange` receives, carrying both ends of the change
+ * plus what drove it. A dial's `onValueCommit` fires only when a pointer drag
+ * ends — a key press is already a discrete commit and fires none.
+ */
+export interface AngleSliderValueChangeDetail {
+    /** The angle the change settled on, in degrees, already folded into `[0, 360)`. */
+    value: number;
+    /**
+     * The angle held before the change, or `null` when there was none. Needed
+     * because a consumer reacting to a change almost always needs both ends,
+     * and in a controlled component the old value is already gone by the time
+     * the handler runs.
+     */
+    previousValue: number | null;
+    /**
+     * What drove the change: `'keyboard'` for arrow/Page/Home/End keys,
+     * `'pointer'` for a drag frame, `'programmatic'` when the application set it.
+     */
+    reason: 'keyboard' | 'pointer' | 'programmatic';
+}
 /** @internal Shared state distributed from {@link AngleSlider} to its parts via context. Not part of the public API. */
 export interface AngleSliderContextValue {
     value: number;
@@ -22,32 +43,21 @@ export interface AngleSliderProps extends Omit<PrimitivePropsWithRef<'div'>, 'on
      */
     defaultValue?: number;
     /**
-     * Fires with the new angle on every change — each arrow key, and each frame
-     * of a drag that crosses a `step` boundary.
+     * Fires on every change — each arrow key, and each frame of a drag that
+     * crosses a `step` boundary — carrying the new angle, the angle held before
+     * it, and the reason the change happened. A change that resolves to the
+     * angle already held fires nothing.
      * @default undefined — no-op if omitted.
      */
-    onValueChange?: (value: number) => void;
+    onValueChange?: (detail: AngleSliderValueChangeDetail) => void;
     /**
      * Fires once with the committed angle when a drag ends (pointer release or
-     * cancel). This is the callback to hang an expensive effect on: a drag emits
-     * `onValueChange` per step crossed, and this one exactly once, so a consumer
-     * can repaint per frame without also making a network call per frame.
-     *
-     * Keyboard changes do not fire it — a key press is already a discrete commit,
-     * reported by `onValueChange`.
+     * cancel) — the callback to hang an expensive effect on, since a drag emits
+     * `onValueChange` per step crossed but this exactly once. Keyboard changes
+     * do not fire it, being discrete commits already reported by `onValueChange`.
      * @default undefined — no-op if omitted.
      */
     onValueCommit?: (value: number) => void;
-    /**
-     * Previous name for `onValueCommit`, kept so 0.20 code keeps working.
-     * @deprecated Renamed to `onValueCommit` in 0.21. The contract, Vue and Web
-     * Components have always called this `value-commit`, and React's own
-     * `Slider`/`Editable` already spelled it `onValueCommit` — only
-     * `AngleSlider` and `ColorPicker` used `onValueChangeEnd`. Still honoured
-     * when `onValueCommit` is not supplied; it will be removed in 0.22.
-     * @default undefined — no-op if omitted.
-     */
-    onValueChangeEnd?: (value: number) => void;
     /**
      * Increment in degrees that both pointer and keyboard input are rounded to.
      * Shift+arrow always moves 10° and PageUp/PageDown always move 45°,
@@ -71,17 +81,54 @@ export interface AngleSliderProps extends Omit<PrimitivePropsWithRef<'div'>, 'on
     readOnly?: boolean;
     /**
      * Restrict the value to the angles declared by the rendered `AngleSliderMark`
-     * parts. Marks are discovered from the DOM at interaction time, so there is
-     * no registration plumbing and a mark added or removed later just works.
-     *
-     * With marks present, dragging snaps to the nearest one (measured the short
-     * way around the circle, so 350° snaps to a 0° mark), arrow keys move one
-     * mark, Shift+arrow and PageUp/PageDown move three, and Home/End jump to the
-     * first/last mark. With `restrictToMarks` set but no marks rendered, the
-     * value falls back to the `step` grid rather than becoming unchangeable.
+     * parts, discovered from the DOM at interaction time so one added or removed
+     * later just works. With marks present, dragging snaps to the nearest one,
+     * arrow keys move one mark, Shift+arrow/PageUp/PageDown move three, and
+     * Home/End jump to the first/last mark; with none rendered, falls back to
+     * the `step` grid rather than becoming unchangeable.
      * @default false
      */
     restrictToMarks?: boolean;
+    /**
+     * Formats the angle for `aria-valuetext`, which is what a screen reader
+     * announces in place of the bare `aria-valuenow`. Supply it to localise the
+     * announcement, or to announce something that is not degrees at all — a
+     * compass bearing, a clock position. Returning an empty string is treated as
+     * no override.
+     * @default (angle) => `${angle}°`
+     */
+    formatValue?: (angle: number) => string;
+    /**
+     * Form field name. With it the current angle is submitted under that name
+     * through a visually-hidden input; without it the dial submits nothing.
+     * @default undefined
+     */
+    name?: string;
+    /**
+     * Id of the `<form>` the dial submits into, forwarded to the hidden input,
+     * so a dial can live outside the form it belongs to.
+     * @default undefined
+     */
+    form?: string;
+    /**
+     * Ticks rendered around the dial, one derived `AngleSliderMark` part each.
+     * Marks are discovered from the DOM at interaction time (same mechanism
+     * `restrictToMarks` always used), so a derived mark works with it exactly
+     * as a hand-composed one does. Ignored when `children` is given.
+     * @default undefined — no marks are rendered.
+     */
+    marks?: readonly AngleSliderMarkData[];
+}
+/**
+ * One entry of {@link AngleSliderProps.marks} — a tick at an angle, with an
+ * optional label. Named `Data`, not `AngleSliderMark`, because that name is
+ * the `AngleSliderMark` part component's own.
+ */
+export interface AngleSliderMarkData {
+    /** The angle in degrees this tick sits at. */
+    value: number;
+    /** Text rendered inside the derived mark. */
+    label?: string;
 }
 /** Props for the {@link AngleSliderThumb}, the handle that points at the current angle. */
 export interface AngleSliderThumbProps extends PrimitivePropsWithRef<'div'> {

package/dist/angle-slider/types.d.ts

@@ -1,4 +1,25 @@
 import type { PrimitivePropsWithRef } from '../utils/primitive.js';
+/**
+ * The payload `onValueChange` receives, carrying both ends of the change
+ * plus what drove it. A dial's `onValueCommit` fires only when a pointer drag
+ * ends — a key press is already a discrete commit and fires none.
+ */
+export interface AngleSliderValueChangeDetail {
+    /** The angle the change settled on, in degrees, already folded into `[0, 360)`. */
+    value: number;
+    /**
+     * The angle held before the change, or `null` when there was none. Needed
+     * because a consumer reacting to a change almost always needs both ends,
+     * and in a controlled component the old value is already gone by the time
+     * the handler runs.
+     */
+    previousValue: number | null;
+    /**
+     * What drove the change: `'keyboard'` for arrow/Page/Home/End keys,
+     * `'pointer'` for a drag frame, `'programmatic'` when the application set it.
+     */
+    reason: 'keyboard' | 'pointer' | 'programmatic';
+}
 /** @internal Shared state distributed from {@link AngleSlider} to its parts via context. Not part of the public API. */
 export interface AngleSliderContextValue {
     value: number;
@@ -22,32 +43,21 @@ export interface AngleSliderProps extends Omit<PrimitivePropsWithRef<'div'>, 'on
      */
     defaultValue?: number;
     /**
-     * Fires with the new angle on every change — each arrow key, and each frame
-     * of a drag that crosses a `step` boundary.
+     * Fires on every change — each arrow key, and each frame of a drag that
+     * crosses a `step` boundary — carrying the new angle, the angle held before
+     * it, and the reason the change happened. A change that resolves to the
+     * angle already held fires nothing.
      * @default undefined — no-op if omitted.
      */
-    onValueChange?: (value: number) => void;
+    onValueChange?: (detail: AngleSliderValueChangeDetail) => void;
     /**
      * Fires once with the committed angle when a drag ends (pointer release or
-     * cancel). This is the callback to hang an expensive effect on: a drag emits
-     * `onValueChange` per step crossed, and this one exactly once, so a consumer
-     * can repaint per frame without also making a network call per frame.
-     *
-     * Keyboard changes do not fire it — a key press is already a discrete commit,
-     * reported by `onValueChange`.
+     * cancel) — the callback to hang an expensive effect on, since a drag emits
+     * `onValueChange` per step crossed but this exactly once. Keyboard changes
+     * do not fire it, being discrete commits already reported by `onValueChange`.
      * @default undefined — no-op if omitted.
      */
     onValueCommit?: (value: number) => void;
-    /**
-     * Previous name for `onValueCommit`, kept so 0.20 code keeps working.
-     * @deprecated Renamed to `onValueCommit` in 0.21. The contract, Vue and Web
-     * Components have always called this `value-commit`, and React's own
-     * `Slider`/`Editable` already spelled it `onValueCommit` — only
-     * `AngleSlider` and `ColorPicker` used `onValueChangeEnd`. Still honoured
-     * when `onValueCommit` is not supplied; it will be removed in 0.22.
-     * @default undefined — no-op if omitted.
-     */
-    onValueChangeEnd?: (value: number) => void;
     /**
      * Increment in degrees that both pointer and keyboard input are rounded to.
      * Shift+arrow always moves 10° and PageUp/PageDown always move 45°,
@@ -71,17 +81,54 @@ export interface AngleSliderProps extends Omit<PrimitivePropsWithRef<'div'>, 'on
     readOnly?: boolean;
     /**
      * Restrict the value to the angles declared by the rendered `AngleSliderMark`
-     * parts. Marks are discovered from the DOM at interaction time, so there is
-     * no registration plumbing and a mark added or removed later just works.
-     *
-     * With marks present, dragging snaps to the nearest one (measured the short
-     * way around the circle, so 350° snaps to a 0° mark), arrow keys move one
-     * mark, Shift+arrow and PageUp/PageDown move three, and Home/End jump to the
-     * first/last mark. With `restrictToMarks` set but no marks rendered, the
-     * value falls back to the `step` grid rather than becoming unchangeable.
+     * parts, discovered from the DOM at interaction time so one added or removed
+     * later just works. With marks present, dragging snaps to the nearest one,
+     * arrow keys move one mark, Shift+arrow/PageUp/PageDown move three, and
+     * Home/End jump to the first/last mark; with none rendered, falls back to
+     * the `step` grid rather than becoming unchangeable.
      * @default false
      */
     restrictToMarks?: boolean;
+    /**
+     * Formats the angle for `aria-valuetext`, which is what a screen reader
+     * announces in place of the bare `aria-valuenow`. Supply it to localise the
+     * announcement, or to announce something that is not degrees at all — a
+     * compass bearing, a clock position. Returning an empty string is treated as
+     * no override.
+     * @default (angle) => `${angle}°`
+     */
+    formatValue?: (angle: number) => string;
+    /**
+     * Form field name. With it the current angle is submitted under that name
+     * through a visually-hidden input; without it the dial submits nothing.
+     * @default undefined
+     */
+    name?: string;
+    /**
+     * Id of the `<form>` the dial submits into, forwarded to the hidden input,
+     * so a dial can live outside the form it belongs to.
+     * @default undefined
+     */
+    form?: string;
+    /**
+     * Ticks rendered around the dial, one derived `AngleSliderMark` part each.
+     * Marks are discovered from the DOM at interaction time (same mechanism
+     * `restrictToMarks` always used), so a derived mark works with it exactly
+     * as a hand-composed one does. Ignored when `children` is given.
+     * @default undefined — no marks are rendered.
+     */
+    marks?: readonly AngleSliderMarkData[];
+}
+/**
+ * One entry of {@link AngleSliderProps.marks} — a tick at an angle, with an
+ * optional label. Named `Data`, not `AngleSliderMark`, because that name is
+ * the `AngleSliderMark` part component's own.
+ */
+export interface AngleSliderMarkData {
+    /** The angle in degrees this tick sits at. */
+    value: number;
+    /** Text rendered inside the derived mark. */
+    label?: string;
 }
 /** Props for the {@link AngleSliderThumb}, the handle that points at the current angle. */
 export interface AngleSliderThumbProps extends PrimitivePropsWithRef<'div'> {

package/dist/aspect-ratio/AspectRatio.cjs

@@ -1 +1 @@
-"use strict";var l=Object.create;var s=Object.defineProperty;var y=Object.getOwnPropertyDescriptor;var R=Object.getOwnPropertyNames;var v=Object.getPrototypeOf,n=Object.prototype.hasOwnProperty;var x=(t,o)=>{for(var e in o)s(t,e,{get:o[e],enumerable:!0})},r=(t,o,e,a)=>{if(o&&typeof o=="object"||typeof o=="function")for(let i of R(o))!n.call(t,i)&&i!==e&&s(t,i,{get:()=>o[i],enumerable:!(a=y(o,i))||a.enumerable});return t};var A=(t,o,e)=>(e=t!=null?l(v(t)):{},r(o||!t||!t.__esModule?s(e,"default",{value:t,enumerable:!0}):e,t)),P=t=>r(s({},"__esModule",{value:!0}),t);var k={};x(k,{AspectRatio:()=>f});module.exports=P(k);var m=A(require("react"),1),d=require("../utils/part.cjs"),c=require("../utils/primitive.cjs"),p=require("react/jsx-runtime"),f=m.forwardRef(({ratio:t=1,style:o,wrapperProps:e,...a},i)=>(0,p.jsx)("div",{"data-skdx-aspect-ratio-wrapper":"",...e,style:{position:"relative",width:"100%",...e?.style,paddingBottom:`${100/t}%`},children:(0,p.jsx)(c.Primitive.div,{"data-skdx-aspect-ratio":"",...a,...(0,d.skdxPart)("aspect-ratio","root",a.className),ref:i,style:{position:"absolute",inset:0,...o}})}));f.displayName="AspectRatio";0&&(module.exports={AspectRatio});
+"use strict";var u=Object.create;var a=Object.defineProperty;var b=Object.getOwnPropertyDescriptor;var v=Object.getOwnPropertyNames;var A=Object.getPrototypeOf,h=Object.prototype.hasOwnProperty;var x=(t,e)=>{for(var o in e)a(t,o,{get:e[o],enumerable:!0})},s=(t,e,o,i)=>{if(e&&typeof e=="object"||typeof e=="function")for(let r of v(e))!h.call(t,r)&&r!==o&&a(t,r,{get:()=>e[r],enumerable:!(i=b(e,r))||i.enumerable});return t};var y=(t,e,o)=>(o=t!=null?u(A(t)):{},s(e||!t||!t.__esModule?a(o,"default",{value:t,enumerable:!0}):o,t)),w=t=>s(a({},"__esModule",{value:!0}),t);var P={};x(P,{AspectRatio:()=>d,resolveAspectRatio:()=>l});module.exports=w(P);var n=y(require("react"),1),m=require("../utils/is-dev-mode.cjs"),c=require("../utils/part.cjs"),f=require("../utils/primitive.cjs"),R=require("react/jsx-runtime"),p=!1;function l(t){return Number.isFinite(t)&&t>0?t:(p||(p=!0,(0,m.isDevMode)()&&console.warn(`[skdx] AspectRatio: \`ratio\` must be a finite number greater than zero, got ${t}. Falling back to the default of 1. A non-positive ratio is not a valid CSS aspect-ratio, so the declaration would be discarded and the box would collapse to no height.`)),1)}var d=n.forwardRef(({ratio:t=1,style:e,...o},i)=>(0,R.jsx)(f.Primitive.div,{...o,...(0,c.skdxPart)("aspect-ratio","root",o.className),ref:i,style:{...e,aspectRatio:l(t)}}));d.displayName="AspectRatio";0&&(module.exports={AspectRatio,resolveAspectRatio});

package/dist/aspect-ratio/AspectRatio.d.cts

@@ -1,12 +1,15 @@
 import * as React from 'react';
 import type { AspectRatioProps } from './types.cjs';
 /**
- * Maintains a fixed width:height ratio for its content, independent of
- * consumer CSS. Uses the padding-percentage technique so it works headlessly
- * even if the brand layer never sets `aspect-ratio` itself. Renders an outer
- * `<div data-skdx-aspect-ratio-wrapper>` that owns the padding hack, containing
- * an absolutely-positioned `<div data-skdx-aspect-ratio>` (the actual
- * `AspectRatio` element, forwarding `ref`) that fills it.
+ * @internal Falls back to the default for a `ratio` the platform cannot
+ * honour. `0`, negative, and non-finite values are invalid for
+ * `aspect-ratio`, silently collapsing the element to no height — hence the
+ * warning.
+ */
+export declare function resolveAspectRatio(ratio: number): number;
+/**
+ * Fixed width:height ratio. Requires a containing block with definite inline
+ * size — flex/grid items without `width`/`flex-basis` have no size.
  *
  * @example
  * ```tsx

package/dist/aspect-ratio/AspectRatio.d.ts

@@ -1,12 +1,15 @@
 import * as React from 'react';
 import type { AspectRatioProps } from './types.js';
 /**
- * Maintains a fixed width:height ratio for its content, independent of
- * consumer CSS. Uses the padding-percentage technique so it works headlessly
- * even if the brand layer never sets `aspect-ratio` itself. Renders an outer
- * `<div data-skdx-aspect-ratio-wrapper>` that owns the padding hack, containing
- * an absolutely-positioned `<div data-skdx-aspect-ratio>` (the actual
- * `AspectRatio` element, forwarding `ref`) that fills it.
+ * @internal Falls back to the default for a `ratio` the platform cannot
+ * honour. `0`, negative, and non-finite values are invalid for
+ * `aspect-ratio`, silently collapsing the element to no height — hence the
+ * warning.
+ */
+export declare function resolveAspectRatio(ratio: number): number;
+/**
+ * Fixed width:height ratio. Requires a containing block with definite inline
+ * size — flex/grid items without `width`/`flex-basis` have no size.
  *
  * @example
  * ```tsx

package/dist/aspect-ratio/AspectRatio.js

@@ -1 +1 @@
-import*as i from"react";import{skdxPart as r}from"../utils/part.js";import{Primitive as m}from"../utils/primitive.js";import{jsx as e}from"react/jsx-runtime";var d=i.forwardRef(({ratio:a=1,style:s,wrapperProps:t,...o},p)=>e("div",{"data-skdx-aspect-ratio-wrapper":"",...t,style:{position:"relative",width:"100%",...t?.style,paddingBottom:`${100/a}%`},children:e(m.div,{"data-skdx-aspect-ratio":"",...o,...r("aspect-ratio","root",o.className),ref:p,style:{position:"absolute",inset:0,...s}})}));d.displayName="AspectRatio";export{d as AspectRatio};
+import*as r from"react";import{isDevMode as s}from"../utils/is-dev-mode.js";import{skdxPart as p}from"../utils/part.js";import{Primitive as n}from"../utils/primitive.js";import{jsx as f}from"react/jsx-runtime";var o=!1;function m(t){return Number.isFinite(t)&&t>0?t:(o||(o=!0,s()&&console.warn(`[skdx] AspectRatio: \`ratio\` must be a finite number greater than zero, got ${t}. Falling back to the default of 1. A non-positive ratio is not a valid CSS aspect-ratio, so the declaration would be discarded and the box would collapse to no height.`)),1)}var c=r.forwardRef(({ratio:t=1,style:i,...e},a)=>f(n.div,{...e,...p("aspect-ratio","root",e.className),ref:a,style:{...i,aspectRatio:m(t)}}));c.displayName="AspectRatio";export{c as AspectRatio,m as resolveAspectRatio};

package/dist/aspect-ratio/types.d.cts

@@ -1,18 +1,9 @@
-import type * as React from 'react';
 import type { PrimitivePropsWithRef } from '../utils/primitive.cjs';
 /** Props for the {@link AspectRatio} root. */
 export interface AspectRatioProps extends PrimitivePropsWithRef<'div'> {
     /**
-     * Desired width:height ratio, e.g. `16 / 9`.
+     * Desired width:height ratio, e.g. `16 / 9`. Must be positive; invalid values discard the declaration, collapse the box, and warn in development.
      * @default 1
      */
     ratio?: number;
-    /**
-     * Props for the outer `data-skdx-aspect-ratio-wrapper` element that owns the
-     * padding-percentage hack — `className`, `style`, `ref`, anything else. Its
-     * `position`/`width` are merged, not replaced, so yours win; `padding-bottom`
-     * is not, since that declaration *is* the ratio.
-     * @default undefined
-     */
-    wrapperProps?: React.ComponentPropsWithRef<'div'>;
 }

package/dist/aspect-ratio/types.d.ts

@@ -1,18 +1,9 @@
-import type * as React from 'react';
 import type { PrimitivePropsWithRef } from '../utils/primitive.js';
 /** Props for the {@link AspectRatio} root. */
 export interface AspectRatioProps extends PrimitivePropsWithRef<'div'> {
     /**
-     * Desired width:height ratio, e.g. `16 / 9`.
+     * Desired width:height ratio, e.g. `16 / 9`. Must be positive; invalid values discard the declaration, collapse the box, and warn in development.
      * @default 1
      */
     ratio?: number;
-    /**
-     * Props for the outer `data-skdx-aspect-ratio-wrapper` element that owns the
-     * padding-percentage hack — `className`, `style`, `ref`, anything else. Its
-     * `position`/`width` are merged, not replaced, so yours win; `padding-bottom`
-     * is not, since that declaration *is* the ratio.
-     * @default undefined
-     */
-    wrapperProps?: React.ComponentPropsWithRef<'div'>;
 }

package/dist/autocomplete/Autocomplete.cjs

@@ -1 +1 @@
-"use strict";var We=Object.create;var T=Object.defineProperty;var Ke=Object.getOwnPropertyDescriptor;var $e=Object.getOwnPropertyNames;var Ge=Object.getPrototypeOf,Ue=Object.prototype.hasOwnProperty;var qe=(t,n)=>{for(var e in n)T(t,e,{get:n[e],enumerable:!0})},J=(t,n,e,r)=>{if(n&&typeof n=="object"||typeof n=="function")for(let p of $e(n))!Ue.call(t,p)&&p!==e&&T(t,p,{get:()=>n[p],enumerable:!(r=Ke(n,p))||r.enumerable});return t};var P=(t,n,e)=>(e=t!=null?We(Ge(t)):{},J(n||!t||!t.__esModule?T(e,"default",{value:t,enumerable:!0}):e,t)),ze=t=>J(T({},"__esModule",{value:!0}),t);var Je={};qe(Je,{Autocomplete:()=>te,AutocompleteContent:()=>K,AutocompleteEmpty:()=>U,AutocompleteInput:()=>S,AutocompleteItem:()=>G,AutocompleteList:()=>$,AutocompletePortal:()=>W,AutocompleteProvider:()=>ee,AutocompleteTrigger:()=>B,defaultGetSuggestionCountLabel:()=>j,useAutocompleteContext:()=>m});module.exports=ze(Je);var i=P(require("react"),1),Q=require("../utils/createContext.cjs"),X=require("../utils/liveAnnouncer.cjs"),Y=require("../utils/popper.cjs"),H=require("../utils/useControllableState.cjs"),Z=require("../utils/useOpenChangeComplete.cjs"),_=require("../utils/useOptionCollection.cjs"),V=require("react/jsx-runtime");function j(t){return`${t} suggestion${t===1?"":"s"} available`}var[ee,m]=(0,Q.createSafeContext)("Autocomplete");function te({children:t,value:n,defaultValue:e="",onValueChange:r,inputValue:p,defaultInputValue:o,onInputValueChange:u,open:I,defaultOpen:A=!1,onOpenChange:x,onOpenChangeComplete:l,allowCustomValue:c=!0,openOnFocus:a=!1,filter:f,disabled:h=!1,readOnly:b=!1,invalid:Te=!1,getSuggestionCountLabel:q=j}){let He=i.useRef(null),Le=i.useRef(null),L=i.useRef(null),Me=i.useId(),[M="",w]=(0,H.useControllableState)({prop:n,defaultProp:e,onChange:r}),[g="",R]=(0,H.useControllableState)({prop:p,defaultProp:o??e,onChange:u}),[E=!1,s]=(0,H.useControllableState)({prop:I,defaultProp:A,onChange:x});(0,Z.useOpenChangeComplete)(E,L,l);let d=(0,_.useOptionCollection)({open:E,setOpen:s,contentRef:L}),{itemCount:N}=d,O=i.useRef(g);i.useEffect(()=>{E&&(0,X.announce)(q(N))},[E,N,q]);let Ne=i.useCallback((y,z)=>{h||b||(w(y),R(z),O.current=z,s(!1))},[h,b,w,R,s]),Ve=i.useCallback(()=>{if(!(h||b)){if(!c){R(O.current),s(!1);return}w(g),O.current=g,s(!1)}},[h,b,c,g,w,R,s]),Fe=i.useCallback(()=>{R(O.current),s(!1)},[R,s]),Se=i.useCallback(y=>f===void 0||f(y,g),[f,g]),Be=i.useCallback(y=>y!==""&&y===M,[M]);return(0,V.jsx)(Y.PopperRoot,{children:(0,V.jsx)(ee,{inputRef:He,triggerRef:Le,contentRef:L,listId:Me,value:M,isSelected:Be,inputValue:g,onInputValueChange:R,open:E,onOpenChange:s,activeId:d.activeId,setActiveId:d.setActiveId,moveActive:d.moveActive,openWithHighlight:d.openWithHighlight,itemCount:N,registerItem:d.registerItem,unregisterItem:d.unregisterItem,getItem:d.getItem,matchesFilter:Se,commitItem:Ne,commitInputValue:Ve,revert:Fe,allowCustomValue:c,openOnFocus:a,disabled:h,readOnly:b,invalid:Te,children:t})})}te.displayName="Autocomplete";var oe=P(require("react"),1),ne=require("../utils/composeRefs.cjs"),re=require("../utils/part.cjs"),pe=require("../utils/popper.cjs"),v=require("../utils/primitive.cjs");var F=require("react/jsx-runtime"),S=oe.forwardRef((t,n)=>{let e=m("AutocompleteInput"),r=(0,ne.useComposedRefs)(n,e.inputRef),p=()=>{let o=e.activeId?e.getItem(e.activeId):void 0;return o?(e.commitItem(o.value,o.text||o.value),!0):!1};return(0,F.jsx)(pe.PopperAnchor,{asChild:!0,children:(0,F.jsx)(v.Primitive.input,{type:"text",role:"combobox","aria-expanded":e.open,"aria-controls":e.listId,"aria-autocomplete":"list","aria-activedescendant":e.activeId??void 0,autoComplete:"off",disabled:e.disabled,readOnly:e.readOnly,"aria-invalid":e.invalid?!0:void 0,"aria-readonly":e.readOnly?!0:void 0,"data-invalid":e.invalid?"":void 0,"data-readonly":e.readOnly?"":void 0,"data-disabled":e.disabled?"":void 0,"data-state":e.open?"open":"closed",...t,...(0,re.skdxPart)("autocomplete","input",t.className),ref:r,value:e.inputValue,onChange:(0,v.composeEventHandlers)(t.onChange,o=>{e.onInputValueChange(o.target.value),e.open||e.onOpenChange(!0)}),onFocus:(0,v.composeEventHandlers)(t.onFocus,()=>{e.openOnFocus&&!e.readOnly&&!e.open&&e.onOpenChange(!0)}),onBlur:(0,v.composeEventHandlers)(t.onBlur,()=>{e.commitInputValue()}),onKeyDown:(0,v.composeEventHandlers)(t.onKeyDown,o=>{o.key==="ArrowDown"?(o.preventDefault(),e.open?e.moveActive(1):e.openWithHighlight("first")):o.key==="ArrowUp"?(o.preventDefault(),e.open?e.moveActive(-1):e.openWithHighlight("last")):o.key==="Enter"?p()?o.preventDefault():e.allowCustomValue&&e.inputValue!==""&&(o.preventDefault(),e.commitInputValue()):o.key==="Escape"?e.open&&!e.contentRef.current&&(o.preventDefault(),e.revert()):o.key==="Tab"&&e.commitInputValue()})})})});S.displayName="AutocompleteInput";var ie=P(require("react"),1),me=require("../utils/composeRefs.cjs"),le=require("../utils/part.cjs"),k=require("../utils/primitive.cjs");var ae=require("react/jsx-runtime"),B=ie.forwardRef((t,n)=>{let e=m("AutocompleteTrigger"),r=(0,me.useComposedRefs)(n,e.triggerRef);return(0,ae.jsx)(k.Primitive.button,{type:"button",tabIndex:-1,"aria-expanded":e.open,"aria-controls":e.listId,disabled:e.disabled,"data-disabled":e.disabled?"":void 0,"data-readonly":e.readOnly?"":void 0,"data-state":e.open?"open":"closed",...t,...(0,le.skdxPart)("autocomplete","trigger",t.className),ref:r,onMouseDown:(0,k.composeEventHandlers)(t.onMouseDown,p=>p.preventDefault()),onClick:(0,k.composeEventHandlers)(t.onClick,()=>{e.readOnly||(e.onOpenChange(!e.open),e.inputRef.current?.focus())})})});B.displayName="AutocompleteTrigger";var se=require("../utils/portal.cjs");var ue=require("react/jsx-runtime"),W=({forceMount:t,children:n,...e})=>{let r=m("AutocompletePortal");return t||r.open?(0,ue.jsx)(se.Portal,{...e,children:n}):null};W.displayName="AutocompletePortal";var ce=P(require("react"),1),fe=require("../utils/composeRefs.cjs"),de=require("../utils/part.cjs"),Ae=require("../utils/popper.cjs"),ge=require("../utils/primitive.cjs"),Re=require("../utils/useDismiss.cjs");var Pe=require("react/jsx-runtime"),K=ce.forwardRef(({forceMount:t,side:n="bottom",align:e="start",sideOffset:r=4,onEscapeKeyDown:p,onPointerDownOutside:o,onFocusOutside:u,onInteractOutside:I,...A},x)=>{let l=m("AutocompleteContent"),c=(0,fe.useComposedRefs)(x,l.contentRef);return(0,Re.useDismiss)({enabled:l.open,onEscapeKeyDown:a=>{p?.(a),a.defaultPrevented||l.revert()},onInteractOutside:I,onPointerDownOutside:a=>{o?.(a),a.defaultPrevented||l.onOpenChange(!1)},onFocusOutside:a=>{u?.(a),a.defaultPrevented||l.onOpenChange(!1)}},[l.contentRef,l.inputRef,l.triggerRef]),!t&&!l.open?null:(0,Pe.jsx)(Ae.PopperContent,{component:"autocomplete","data-state":l.open?"open":"closed",side:n,align:e,sideOffset:r,...A,...(0,de.skdxPart)("autocomplete","content",A.className),ref:c,onMouseDown:(0,ge.composeEventHandlers)(A.onMouseDown,a=>a.preventDefault())})});K.displayName="AutocompleteContent";var ve=P(require("react"),1),Ie=require("../utils/part.cjs"),ye=require("../utils/primitive.cjs");var Ce=require("react/jsx-runtime"),$=ve.forwardRef((t,n)=>{let e=m("AutocompleteList");return(0,Ce.jsx)(ye.Primitive.div,{role:"listbox",id:e.listId,...t,...(0,Ie.skdxPart)("autocomplete","list",t.className),ref:n})});$.displayName="AutocompleteList";var C=P(require("react"),1),xe=require("../utils/composeRefs.cjs"),he=require("../utils/part.cjs"),D=require("../utils/primitive.cjs"),be=require("../utils/useOptionCollection.cjs");var Ee=require("react/jsx-runtime"),G=C.forwardRef(({value:t,disabled:n,textValue:e,...r},p)=>{let o=m("AutocompleteItem"),u=C.useId(),I=C.useRef(null),A=(0,xe.useComposedRefs)(p,I),{text:x,visible:l}=(0,be.useOptionEntry)({id:u,value:t,textValue:e,itemRef:I,matchesFilter:o.matchesFilter,registerItem:o.registerItem,unregisterItem:o.unregisterItem});if(!l)return null;let c=o.isSelected(t),a=o.activeId===u,f=n||o.disabled||o.readOnly;return(0,Ee.jsx)(D.Primitive.div,{role:"option",id:u,"data-value":t,"aria-selected":c,"aria-disabled":f?!0:void 0,"data-state":c?"checked":"unchecked","data-highlighted":a?"":void 0,"data-disabled":f?"":void 0,...r,...(0,he.skdxPart)("autocomplete","item",r.className),ref:A,onClick:(0,D.composeEventHandlers)(r.onClick,()=>{f||(o.commitItem(t,x??t),o.inputRef.current?.focus())}),onPointerEnter:(0,D.composeEventHandlers)(r.onPointerEnter,()=>{f||o.setActiveId(u)})})});G.displayName="AutocompleteItem";var ke=P(require("react"),1),De=require("../utils/part.cjs"),we=require("../utils/primitive.cjs");var Oe=require("react/jsx-runtime"),U=ke.forwardRef((t,n)=>m("AutocompleteEmpty").itemCount===0?(0,Oe.jsx)(we.Primitive.div,{role:"presentation",...t,...(0,De.skdxPart)("autocomplete","empty",t.className),ref:n}):null);U.displayName="AutocompleteEmpty";0&&(module.exports={Autocomplete,AutocompleteContent,AutocompleteEmpty,AutocompleteInput,AutocompleteItem,AutocompleteList,AutocompletePortal,AutocompleteProvider,AutocompleteTrigger,defaultGetSuggestionCountLabel,useAutocompleteContext});
+"use strict";var Ht=Object.create;var K=Object.defineProperty;var Vt=Object.getOwnPropertyDescriptor;var Gt=Object.getOwnPropertyNames;var Nt=Object.getPrototypeOf,Mt=Object.prototype.hasOwnProperty;var Ft=(t,r)=>{for(var e in r)K(t,e,{get:r[e],enumerable:!0})},ge=(t,r,e,l)=>{if(r&&typeof r=="object"||typeof r=="function")for(let p of Gt(r))!Mt.call(t,p)&&p!==e&&K(t,p,{get:()=>r[p],enumerable:!(l=Vt(r,p))||l.enumerable});return t};var g=(t,r,e)=>(e=t!=null?Ht(Nt(t)):{},ge(r||!t||!t.__esModule?K(e,"default",{value:t,enumerable:!0}):e,t)),St=t=>ge(K({},"__esModule",{value:!0}),t);var Kt={};Ft(Kt,{Autocomplete:()=>nt,AutocompleteClear:()=>st,AutocompleteContent:()=>W,AutocompleteEmpty:()=>q,AutocompleteGroup:()=>$,AutocompleteGroupLabel:()=>_,AutocompleteGroupProvider:()=>Te,AutocompleteInput:()=>z,AutocompleteItem:()=>J,AutocompleteList:()=>Q,AutocompletePortal:()=>X,AutocompleteProvider:()=>rt,AutocompleteTrigger:()=>mt,defaultGetSuggestionCountLabel:()=>ot,defaultOptionsFilter:()=>N.defaultOptionsFilter,useAutocompleteContext:()=>m,useAutocompleteGroupContext:()=>le});module.exports=St(Kt);var n=g(require("react"),1),Ye=require("../utils/createContext.cjs"),Ze=require("../utils/formControl.cjs"),je=require("../utils/liveAnnouncer.cjs"),et=require("../utils/popper.cjs"),j=require("../utils/scoredFilter.cjs"),Y=require("../utils/useControllableState.cjs"),tt=require("../utils/useOpenChangeComplete.cjs"),ee=require("../utils/useOptionCollection.cjs");var Re=g(require("react"),1),ye=require("../utils/composeRefs.cjs"),Ce=require("../utils/part.cjs"),ve=require("../utils/popper.cjs"),be=require("../utils/primitive.cjs"),Pe=require("../utils/useDismiss.cjs");var xe=require("react/jsx-runtime"),W=Re.forwardRef(({forceMount:t,side:r="bottom",align:e="start",sideOffset:l=4,onEscapeKeyDown:p,onPointerDownOutside:o,onFocusOutside:f,onInteractOutside:R,...a},D)=>{let u=m("AutocompleteContent"),x=(0,ye.useComposedRefs)(D,u.contentRef);return(0,Pe.useDismiss)({enabled:u.open,onEscapeKeyDown:i=>{p?.(i),i.defaultPrevented||u.revert()},onInteractOutside:R,onPointerDownOutside:i=>{o?.(i),i.defaultPrevented||u.onOpenChange(!1)},onFocusOutside:i=>{f?.(i),i.defaultPrevented||u.onOpenChange(!1)}},[u.contentRef,u.inputRef,u.triggerRef]),!t&&!u.open?null:(0,xe.jsx)(ve.PopperContent,{component:"autocomplete","aria-busy":u.loading?!0:void 0,"data-loading":u.loading?"":void 0,"data-state":u.open?"open":"closed",side:r,align:e,sideOffset:l,...a,...(0,Ce.skdxPart)("autocomplete","content",a.className),ref:x,onMouseDown:(0,be.composeEventHandlers)(a.onMouseDown,i=>i.preventDefault())})});W.displayName="AutocompleteContent";var Ie=g(require("react"),1),he=require("../utils/part.cjs"),Oe=require("../utils/primitive.cjs");var ke=require("react/jsx-runtime"),q=Ie.forwardRef((t,r)=>m("AutocompleteEmpty").itemCount===0?(0,ke.jsx)(Oe.Primitive.div,{role:"presentation",...t,...(0,he.skdxPart)("autocomplete","empty",t.className),ref:r}):null);q.displayName="AutocompleteEmpty";var U=g(require("react"),1),Ee=require("../utils/createContext.cjs"),De=require("../utils/part.cjs"),Le=require("../utils/primitive.cjs"),ne=require("react/jsx-runtime"),[Te,le]=(0,Ee.createSafeContext)("AutocompleteGroup"),$=U.forwardRef((t,r)=>{let e=U.useId();return(0,ne.jsx)(Te,{labelId:e,children:(0,ne.jsx)(Le.Primitive.div,{role:"group","aria-labelledby":e,...t,...(0,De.skdxPart)("autocomplete","group",t.className),ref:r})})});$.displayName="AutocompleteGroup";var we=g(require("react"),1),He=require("../utils/part.cjs"),Ve=require("../utils/primitive.cjs");var Ge=require("react/jsx-runtime"),_=we.forwardRef((t,r)=>{let e=le("AutocompleteGroupLabel");return(0,Ge.jsx)(Ve.Primitive.div,{id:e.labelId,...t,...(0,He.skdxPart)("autocomplete","label",t.className),ref:r})});_.displayName="AutocompleteGroupLabel";var Ne=g(require("react"),1),Me=require("../utils/composeRefs.cjs"),Fe=require("../utils/part.cjs"),Se=require("../utils/popper.cjs"),P=require("../utils/primitive.cjs");var ae=require("react/jsx-runtime"),z=Ne.forwardRef((t,r)=>{let e=m("AutocompleteInput"),l=(0,Me.useComposedRefs)(r,e.inputRef),p=()=>{let o=e.activeId?e.getItem(e.activeId):void 0;return o?(e.commitItem(o.value,o.text||o.value,"keyboard"),!0):!1};return(0,ae.jsx)(Se.PopperAnchor,{asChild:!0,children:(0,ae.jsx)(P.Primitive.input,{type:"text",role:"combobox","aria-expanded":e.open,"aria-controls":e.listId,"aria-autocomplete":"list","aria-activedescendant":e.activeId??void 0,autoComplete:"off",name:e.name,form:e.form,disabled:e.disabled,readOnly:e.readOnly,"aria-invalid":e.invalid?!0:void 0,"aria-readonly":e.readOnly?!0:void 0,"aria-busy":e.loading?!0:void 0,"data-invalid":e.invalid?"":void 0,"data-readonly":e.readOnly?"":void 0,"data-loading":e.loading?"":void 0,"data-disabled":e.disabled?"":void 0,"data-state":e.open?"open":"closed",...t,...(0,Fe.skdxPart)("autocomplete","input",t.className),ref:l,value:e.inputValue,onChange:(0,P.composeEventHandlers)(t.onChange,o=>{e.onInputValueChange(o.target.value),e.open||e.onOpenChange(!0)}),onFocus:(0,P.composeEventHandlers)(t.onFocus,()=>{e.openOnFocus&&!e.readOnly&&!e.open&&e.onOpenChange(!0)}),onBlur:(0,P.composeEventHandlers)(t.onBlur,()=>{e.commitInputValue("pointer")}),onKeyDown:(0,P.composeEventHandlers)(t.onKeyDown,o=>{if(o.altKey&&o.key==="ArrowDown")o.preventDefault(),e.open||e.onOpenChange(!0);else if(o.altKey&&o.key==="ArrowUp")o.preventDefault(),!p()&&e.open&&e.onOpenChange(!1);else if(o.key==="ArrowDown")o.preventDefault(),e.open?e.moveActive(1):e.openWithHighlight("first");else if(o.key==="ArrowUp")o.preventDefault(),e.open?e.moveActive(-1):e.openWithHighlight("last");else if(o.key==="Home"||o.key==="End"){if(!e.open)return;o.preventDefault(),e.moveActiveToEdge(o.key==="Home"?"first":"last")}else o.key==="Enter"?p()?o.preventDefault():e.allowCustomValue&&e.inputValue!==""?(o.preventDefault(),e.commitInputValue("keyboard")):e.open&&e.onOpenChange(!1):o.key==="Escape"?e.open&&!e.contentRef.current&&(o.preventDefault(),e.revert()):o.key==="Tab"&&e.commitInputValue("keyboard")})})})});z.displayName="AutocompleteInput";var E=g(require("react"),1),Be=require("../utils/composeRefs.cjs"),Ke=require("../utils/part.cjs"),G=require("../utils/primitive.cjs"),We=require("../utils/useOptionCollection.cjs");var qe=require("react/jsx-runtime"),J=E.forwardRef(({value:t,disabled:r,textValue:e,...l},p)=>{let o=m("AutocompleteItem"),f=E.useId(),R=E.useRef(null),a=(0,Be.useComposedRefs)(p,R),{text:D,visible:u}=(0,We.useOptionEntry)({id:f,value:t,textValue:e,itemRef:R,matchesFilter:o.matchesFilter,registerItem:o.registerItem,unregisterItem:o.unregisterItem});if(!u)return null;let x=o.isSelected(t),i=o.activeId===f,I=r||o.disabled||o.readOnly,L=o.itemOrder?.get(f);return(0,qe.jsx)(G.Primitive.div,{role:"option",id:f,"data-value":t,"aria-selected":x,"aria-disabled":I?!0:void 0,"data-state":x?"checked":"unchecked","data-highlighted":i?"":void 0,"data-disabled":I?"":void 0,...l,...(0,Ke.skdxPart)("autocomplete","item",l.className),ref:a,onClick:(0,G.composeEventHandlers)(l.onClick,()=>{I||(o.commitItem(t,D??t,"pointer"),o.inputRef.current?.focus())}),onPointerEnter:(0,G.composeEventHandlers)(l.onPointerEnter,()=>{I||o.setActiveId(f)}),style:L!==void 0?{order:L,...l.style}:l.style})});J.displayName="AutocompleteItem";var Ue=g(require("react"),1),$e=require("../utils/part.cjs"),_e=require("../utils/primitive.cjs");var ze=require("react/jsx-runtime"),Q=Ue.forwardRef((t,r)=>{let e=m("AutocompleteList");return(0,ze.jsx)(_e.Primitive.div,{role:"listbox",id:e.listId,...t,...(0,$e.skdxPart)("autocomplete","list",t.className),ref:r})});Q.displayName="AutocompleteList";var Je=require("../utils/portal.cjs");var Qe=require("react/jsx-runtime"),X=({forceMount:t,children:r,...e})=>{let l=m("AutocompletePortal");return t||l.open?(0,Qe.jsx)(Je.Portal,{...e,children:r}):null};X.displayName="AutocompletePortal";var N=require("../combobox/Combobox.cjs"),s=require("react/jsx-runtime"),Bt=t=>"options"in t,Xe=({options:t,renderOption:r,placeholder:e,ariaLabel:l,passThrough:p})=>{let o=m("Autocomplete"),f=l??e,R=a=>(0,s.jsx)(J,{value:a.value,disabled:a.disabled,textValue:a.label,children:r?r(a,{selected:o.isSelected(a.value)}):a.label??a.value},a.value);return(0,s.jsxs)(s.Fragment,{children:[(0,s.jsx)(z,{...p,"aria-label":f,placeholder:e}),(0,s.jsx)(X,{children:(0,s.jsxs)(W,{children:[(0,s.jsx)(Q,{"aria-label":f,children:t.map(a=>Bt(a)?(0,s.jsxs)($,{children:[(0,s.jsx)(_,{children:a.label}),a.options.map(R)]},a.label):R(a))}),(0,s.jsx)(q,{children:"No suggestions"})]})})]})};var Z=require("react/jsx-runtime");function ot(t){return`${t} suggestion${t===1?"":"s"} available`}var[rt,m]=(0,Ye.createSafeContext)("Autocomplete"),nt=n.forwardRef(function({children:r,value:e,defaultValue:l="",onValueChange:p,inputValue:o,defaultInputValue:f,onInputValueChange:R,open:a,defaultOpen:D=!1,onOpenChange:u,onOpenChangeComplete:x,allowCustomValue:i=!0,openOnFocus:I=!1,autoHighlight:L=!1,loop:dt=!0,filter:At,disabled:T=!1,readOnly:w=!1,invalid:gt=!1,loading:te=!1,name:Rt,form:yt,getResultCountLabel:pe=ot,options:me,renderOption:Ct,placeholder:vt,"aria-label":bt,...Pt},xt){let h=At??(me?N.defaultOptionsFilter:void 0),ue=n.useRef(null),It=n.useRef(null),S=n.useRef(null),ht=n.useId(),ie=n.useRef("programmatic"),ce=n.useRef(!1),se=n.useRef(null),[H="",fe]=(0,Y.useControllableState)({prop:e,defaultProp:l,onChange:c=>p?.({value:c,previousValue:se.current,reason:ie.current,created:ce.current})}),oe=n.useRef(H);oe.current=H;let O=n.useCallback((c,v,k)=>{ie.current=v,ce.current=k,se.current=oe.current===""?null:oe.current,fe(c)},[fe]),[y="",C]=(0,Y.useControllableState)({prop:o,defaultProp:f??l,onChange:R}),[b=!1,d]=(0,Y.useControllableState)({prop:a,defaultProp:D,onChange:u});(0,tt.useOpenChangeComplete)(b,S,x);let Ot=n.useCallback(c=>typeof h!="function"||(0,j.filterKeeps)(h(c,y)),[h,y]),kt=n.useCallback(c=>{if(typeof h!="function")return null;let v=h(c.text,y);return typeof v=="number"?v:null},[h,y]),A=(0,ee.useOptionCollection)({open:b,setOpen:d,contentRef:S,loop:dt,scoreItem:kt}),{itemCount:B,itemOrder:re}=A,{activeId:de,setActiveId:Ae}=A;n.useEffect(()=>{if(!L||!b||de!==null)return;let c=requestAnimationFrame(()=>{let v=Array.from(S.current?.querySelectorAll(ee.OPTION_SELECTOR)??[]),k=(0,j.sortByOrder)(v,re)[0];k&&Ae(k.id)});return()=>cancelAnimationFrame(c)},[L,b,de,B,Ae,re]);let V=n.useRef(y);n.useEffect(()=>{!b||te||(0,je.announce)(pe(B))},[b,te,B,pe]),n.useImperativeHandle(xt,()=>(0,Ze.formValidityHandle)(ue),[]);let Et=n.useCallback((c,v,k)=>{T||w||(O(c,k,!1),C(v),V.current=v,d(!1))},[T,w,O,C,d]),Dt=n.useCallback(c=>{if(!(T||w)){if(!i){C(V.current),d(!1);return}O(y,c,!0),V.current=y,d(!1)}},[T,w,i,y,O,C,d]),Lt=n.useCallback(()=>{O("","pointer",!0),C(""),V.current="",d(!1)},[O,C,d]),Tt=n.useCallback(()=>{C(V.current),d(!1)},[C,d]),wt=n.useCallback(c=>c!==""&&c===H,[H]);return(0,Z.jsx)(et.PopperRoot,{children:(0,Z.jsx)(rt,{inputRef:ue,triggerRef:It,contentRef:S,listId:ht,value:H,isSelected:wt,inputValue:y,onInputValueChange:C,open:b,onOpenChange:d,activeId:A.activeId,itemOrder:re,setActiveId:A.setActiveId,moveActive:A.moveActive,moveActiveToEdge:A.moveActiveToEdge,openWithHighlight:A.openWithHighlight,itemCount:B,registerItem:A.registerItem,unregisterItem:A.unregisterItem,getItem:A.getItem,matchesFilter:Ot,commitItem:Et,commitInputValue:Dt,revert:Tt,clear:Lt,allowCustomValue:i,openOnFocus:I,disabled:T,readOnly:w,invalid:gt,loading:te,name:Rt,form:yt,children:r??(0,Z.jsx)(Xe,{options:me??[],renderOption:Ct,placeholder:vt,ariaLabel:bt,passThrough:Pt})})})});nt.displayName="Autocomplete";var lt=g(require("react"),1),at=require("../utils/composeRefs.cjs"),pt=require("../utils/part.cjs"),M=require("../utils/primitive.cjs");var ut=require("react/jsx-runtime"),mt=lt.forwardRef((t,r)=>{let e=m("AutocompleteTrigger"),l=(0,at.useComposedRefs)(r,e.triggerRef);return(0,ut.jsx)(M.Primitive.button,{type:"button",tabIndex:-1,"aria-expanded":e.open,"aria-controls":e.listId,disabled:e.disabled,"data-disabled":e.disabled?"":void 0,"data-readonly":e.readOnly?"":void 0,"data-state":e.open?"open":"closed",...t,...(0,pt.skdxPart)("autocomplete","trigger",t.className),ref:l,onMouseDown:(0,M.composeEventHandlers)(t.onMouseDown,p=>p.preventDefault()),onClick:(0,M.composeEventHandlers)(t.onClick,()=>{e.readOnly||(e.onOpenChange(!e.open),e.inputRef.current?.focus())})})});mt.displayName="AutocompleteTrigger";var it=g(require("react"),1),ct=require("../utils/part.cjs"),F=require("../utils/primitive.cjs");var ft=require("react/jsx-runtime"),st=it.forwardRef((t,r)=>{let e=m("AutocompleteClear"),l=e.value===""&&e.inputValue==="";return(0,ft.jsx)(F.Primitive.button,{type:"button",tabIndex:-1,disabled:e.disabled||e.readOnly||l,"data-disabled":e.disabled?"":void 0,"data-readonly":e.readOnly?"":void 0,...t,...(0,ct.skdxPart)("autocomplete","clear",t.className),ref:r,onMouseDown:(0,F.composeEventHandlers)(t.onMouseDown,p=>p.preventDefault()),onClick:(0,F.composeEventHandlers)(t.onClick,()=>{e.clear(),e.inputRef.current?.focus()})})});st.displayName="AutocompleteClear";0&&(module.exports={Autocomplete,AutocompleteClear,AutocompleteContent,AutocompleteEmpty,AutocompleteGroup,AutocompleteGroupLabel,AutocompleteGroupProvider,AutocompleteInput,AutocompleteItem,AutocompleteList,AutocompletePortal,AutocompleteProvider,AutocompleteTrigger,defaultGetSuggestionCountLabel,defaultOptionsFilter,useAutocompleteContext,useAutocompleteGroupContext});