@skdx/react 0.26.0 → 0.28.0

package/dist/card/CardTitle.d.cts

@@ -1,12 +1,14 @@
 import * as React from 'react';
 import type { CardTitleProps } from './types.cjs';
 /**
- * A {@link Card}'s heading. Renders an `<h3>`, typically inside `CardHeader`.
+ * Card heading — renders `<h1>`–`<h6>` per `level` (default `3`).
+ *
+ * Set `level` to match the document outline the card sits in.
  *
  * @example
  * ```tsx
  * <CardHeader>
- *   <CardTitle>Project Alpha</CardTitle>
+ *   <CardTitle level={2}>Project Alpha</CardTitle>
  * </CardHeader>
  * ```
  */

package/dist/card/CardTitle.d.ts

@@ -1,12 +1,14 @@
 import * as React from 'react';
 import type { CardTitleProps } from './types.js';
 /**
- * A {@link Card}'s heading. Renders an `<h3>`, typically inside `CardHeader`.
+ * Card heading — renders `<h1>`–`<h6>` per `level` (default `3`).
+ *
+ * Set `level` to match the document outline the card sits in.
  *
  * @example
  * ```tsx
  * <CardHeader>
- *   <CardTitle>Project Alpha</CardTitle>
+ *   <CardTitle level={2}>Project Alpha</CardTitle>
  * </CardHeader>
  * ```
  */

package/dist/card/index.d.cts

@@ -1,7 +1,5 @@
-export * from './Card.cjs';
+export { Card } from './Card.cjs';
 export { CardHeader } from './CardHeader.cjs';
-export { CardTitle } from './CardTitle.cjs';
-export { CardDescription } from './CardDescription.cjs';
 export { CardContent } from './CardContent.cjs';
 export { CardFooter } from './CardFooter.cjs';
-export type { CardProps, CardHeaderProps, CardTitleProps, CardDescriptionProps, CardContentProps, CardFooterProps, } from './types.cjs';
+export type { CardProps, CardHeaderProps, CardContentProps, CardFooterProps } from './types.cjs';

package/dist/card/index.d.ts

@@ -1,7 +1,5 @@
-export * from './Card.js';
+export { Card } from './Card.js';
 export { CardHeader } from './CardHeader.js';
-export { CardTitle } from './CardTitle.js';
-export { CardDescription } from './CardDescription.js';
 export { CardContent } from './CardContent.js';
 export { CardFooter } from './CardFooter.js';
-export type { CardProps, CardHeaderProps, CardTitleProps, CardDescriptionProps, CardContentProps, CardFooterProps, } from './types.js';
+export type { CardProps, CardHeaderProps, CardContentProps, CardFooterProps } from './types.js';

package/dist/card/primitives.d.cts

@@ -0,0 +1,30 @@
+/**
+ * Primitives for `Card` — `CardHeader`, `CardContent`, `CardFooter` are also public (semantic choices); `CardRoot`, `CardTitle`, `CardDescription`, `CardMedia` are here only.
+ *
+ * @example
+ * ```tsx
+ * import { CardRoot, CardMedia, CardHeader, CardTitle, CardDescription, CardContent, CardFooter } from '@skdx/react/primitives/card';
+ *
+ * <CardRoot>
+ *   <CardMedia>
+ *     <img src="/cover.jpg" alt="" />
+ *   </CardMedia>
+ *   <CardHeader>
+ *     <CardTitle>Project Alpha</CardTitle>
+ *     <CardDescription>Last updated 2 days ago</CardDescription>
+ *   </CardHeader>
+ *   <CardContent>Details about the project go here.</CardContent>
+ *   <CardFooter>
+ *     <button type="button">View</button>
+ *   </CardFooter>
+ * </CardRoot>
+ * ```
+ */
+export { CardRoot } from './Card.cjs';
+export { CardMedia } from './CardMedia.cjs';
+export { CardHeader } from './CardHeader.cjs';
+export { CardTitle } from './CardTitle.cjs';
+export { CardDescription } from './CardDescription.cjs';
+export { CardContent } from './CardContent.cjs';
+export { CardFooter } from './CardFooter.cjs';
+export type { CardRootProps, CardMediaProps, CardHeaderProps, CardTitleProps, CardDescriptionProps, CardContentProps, CardFooterProps, } from './types.cjs';

package/dist/card/primitives.d.ts

@@ -0,0 +1,30 @@
+/**
+ * Primitives for `Card` — `CardHeader`, `CardContent`, `CardFooter` are also public (semantic choices); `CardRoot`, `CardTitle`, `CardDescription`, `CardMedia` are here only.
+ *
+ * @example
+ * ```tsx
+ * import { CardRoot, CardMedia, CardHeader, CardTitle, CardDescription, CardContent, CardFooter } from '@skdx/react/primitives/card';
+ *
+ * <CardRoot>
+ *   <CardMedia>
+ *     <img src="/cover.jpg" alt="" />
+ *   </CardMedia>
+ *   <CardHeader>
+ *     <CardTitle>Project Alpha</CardTitle>
+ *     <CardDescription>Last updated 2 days ago</CardDescription>
+ *   </CardHeader>
+ *   <CardContent>Details about the project go here.</CardContent>
+ *   <CardFooter>
+ *     <button type="button">View</button>
+ *   </CardFooter>
+ * </CardRoot>
+ * ```
+ */
+export { CardRoot } from './Card.js';
+export { CardMedia } from './CardMedia.js';
+export { CardHeader } from './CardHeader.js';
+export { CardTitle } from './CardTitle.js';
+export { CardDescription } from './CardDescription.js';
+export { CardContent } from './CardContent.js';
+export { CardFooter } from './CardFooter.js';
+export type { CardRootProps, CardMediaProps, CardHeaderProps, CardTitleProps, CardDescriptionProps, CardContentProps, CardFooterProps, } from './types.js';

package/dist/card/types.d.cts

@@ -1,12 +1,70 @@
-import type { PrimitivePropsWithRef } from '../utils/primitive.cjs';
-/** Props for the {@link Card} root. */
-export interface CardProps extends PrimitivePropsWithRef<'div'> {
+import type * as React from 'react';
+import type { PolymorphicTag, PrimitivePropsWithRef } from '../utils/primitive.cjs';
+/** Props for {@link CardRoot}: {@link CardProps} minus the derived-anatomy-only props. */
+export interface CardRootProps extends PrimitivePropsWithRef<'div'> {
+    /**
+     * Element name to render instead of the default tag, from the library's
+     * allowlist of tags. Takes a tag name only, never a component — `asChild`
+     * is React's escape hatch for that, and wins when both are set.
+     * @default 'div'
+     */
+    as?: PolymorphicTag;
+}
+/**
+ * Props for the {@link Card} recipe. No `asChild`: the recipe always wraps its
+ * children in the derived anatomy, so `Slot` would never receive the single
+ * element it needs. Reach for `primitives/card`'s headless `CardRoot` for that.
+ */
+export interface CardProps extends Omit<CardRootProps, 'asChild'> {
+    /**
+     * The card's heading, rendered into a derived `CardTitle` inside a derived
+     * `CardHeader`. A `string`, not a node — it narrows the native `title`
+     * attribute this root already carries.
+     * @default undefined — no title is rendered.
+     */
+    title?: string;
+    /**
+     * Supporting text below the title, rendered into a derived `CardDescription`
+     * inside the same derived `CardHeader`.
+     * @default undefined — no description is rendered.
+     */
+    description?: React.ReactNode;
+    /**
+     * An edge-to-edge image or video, rendered into a derived `CardMedia` region
+     * ahead of the header so the skin can clip it against the card's radius.
+     * @default undefined — no media region is rendered.
+     */
+    media?: React.ReactNode;
+    /**
+     * The card's actions, rendered into a derived `CardFooter` after the body.
+     * @default undefined — no footer is rendered.
+     */
+    footer?: React.ReactNode;
+    /**
+     * Which heading element derived `CardTitle` renders, `<h1>` through `<h6>`.
+     * Heading level is document property; library doesn't place card. Card under `<h4>`
+     * needs `5` or it skips backwards for heading navigation.
+     * @default 3
+     */
+    headingLevel?: 1 | 2 | 3 | 4 | 5 | 6;
+}
+/** Props for {@link CardMedia}, the card's edge-to-edge image/video region. */
+export interface CardMediaProps extends PrimitivePropsWithRef<'div'> {
 }
 /** Props for {@link CardHeader}, a container for `CardTitle`/`CardDescription`. */
 export interface CardHeaderProps extends PrimitivePropsWithRef<'div'> {
 }
 /** Props for {@link CardTitle}, the card's heading. */
 export interface CardTitleProps extends PrimitivePropsWithRef<'h3'> {
+    /**
+     * Which heading element to render, `<h1>` through `<h6>`.
+     *
+     * `3` suits card under `<h2>` (common case) but is default, not rule. Heading level
+     * is document property; library doesn't place card. Card under `<h4>` needs `level={5}`
+     * or it skips backwards for heading navigation.
+     * @default 3
+     */
+    level?: 1 | 2 | 3 | 4 | 5 | 6;
 }
 /** Props for {@link CardDescription}, supporting text below the title. */
 export interface CardDescriptionProps extends PrimitivePropsWithRef<'p'> {

package/dist/card/types.d.ts

@@ -1,12 +1,70 @@
-import type { PrimitivePropsWithRef } from '../utils/primitive.js';
-/** Props for the {@link Card} root. */
-export interface CardProps extends PrimitivePropsWithRef<'div'> {
+import type * as React from 'react';
+import type { PolymorphicTag, PrimitivePropsWithRef } from '../utils/primitive.js';
+/** Props for {@link CardRoot}: {@link CardProps} minus the derived-anatomy-only props. */
+export interface CardRootProps extends PrimitivePropsWithRef<'div'> {
+    /**
+     * Element name to render instead of the default tag, from the library's
+     * allowlist of tags. Takes a tag name only, never a component — `asChild`
+     * is React's escape hatch for that, and wins when both are set.
+     * @default 'div'
+     */
+    as?: PolymorphicTag;
+}
+/**
+ * Props for the {@link Card} recipe. No `asChild`: the recipe always wraps its
+ * children in the derived anatomy, so `Slot` would never receive the single
+ * element it needs. Reach for `primitives/card`'s headless `CardRoot` for that.
+ */
+export interface CardProps extends Omit<CardRootProps, 'asChild'> {
+    /**
+     * The card's heading, rendered into a derived `CardTitle` inside a derived
+     * `CardHeader`. A `string`, not a node — it narrows the native `title`
+     * attribute this root already carries.
+     * @default undefined — no title is rendered.
+     */
+    title?: string;
+    /**
+     * Supporting text below the title, rendered into a derived `CardDescription`
+     * inside the same derived `CardHeader`.
+     * @default undefined — no description is rendered.
+     */
+    description?: React.ReactNode;
+    /**
+     * An edge-to-edge image or video, rendered into a derived `CardMedia` region
+     * ahead of the header so the skin can clip it against the card's radius.
+     * @default undefined — no media region is rendered.
+     */
+    media?: React.ReactNode;
+    /**
+     * The card's actions, rendered into a derived `CardFooter` after the body.
+     * @default undefined — no footer is rendered.
+     */
+    footer?: React.ReactNode;
+    /**
+     * Which heading element derived `CardTitle` renders, `<h1>` through `<h6>`.
+     * Heading level is document property; library doesn't place card. Card under `<h4>`
+     * needs `5` or it skips backwards for heading navigation.
+     * @default 3
+     */
+    headingLevel?: 1 | 2 | 3 | 4 | 5 | 6;
+}
+/** Props for {@link CardMedia}, the card's edge-to-edge image/video region. */
+export interface CardMediaProps extends PrimitivePropsWithRef<'div'> {
 }
 /** Props for {@link CardHeader}, a container for `CardTitle`/`CardDescription`. */
 export interface CardHeaderProps extends PrimitivePropsWithRef<'div'> {
 }
 /** Props for {@link CardTitle}, the card's heading. */
 export interface CardTitleProps extends PrimitivePropsWithRef<'h3'> {
+    /**
+     * Which heading element to render, `<h1>` through `<h6>`.
+     *
+     * `3` suits card under `<h2>` (common case) but is default, not rule. Heading level
+     * is document property; library doesn't place card. Card under `<h4>` needs `level={5}`
+     * or it skips backwards for heading navigation.
+     * @default 3
+     */
+    level?: 1 | 2 | 3 | 4 | 5 | 6;
 }
 /** Props for {@link CardDescription}, supporting text below the title. */
 export interface CardDescriptionProps extends PrimitivePropsWithRef<'p'> {

package/dist/carousel/Carousel.cjs

@@ -1 +1 @@
-"use strict";var Ne=Object.create;var b=Object.defineProperty;var Me=Object.getOwnPropertyDescriptor;var He=Object.getOwnPropertyNames;var De=Object.getPrototypeOf,Le=Object.prototype.hasOwnProperty;var Te=(t,o)=>{for(var e in o)b(t,e,{get:o[e],enumerable:!0})},q=(t,o,e,n)=>{if(o&&typeof o=="object"||typeof o=="function")for(let s of He(o))!Le.call(t,s)&&s!==e&&b(t,s,{get:()=>o[s],enumerable:!(n=Me(o,s))||n.enumerable});return t};var C=(t,o,e)=>(e=t!=null?Ne(De(t)):{},q(o||!t||!t.__esModule?b(e,"default",{value:t,enumerable:!0}):e,t)),Se=t=>q(b({},"__esModule",{value:!0}),t);var Ve={};Te(Ve,{Carousel:()=>ee,CarouselContent:()=>D,CarouselItem:()=>L,CarouselNext:()=>S,CarouselPlayPause:()=>K,CarouselPrevious:()=>T,CarouselProvider:()=>j,useCarouselContext:()=>i});module.exports=Se(Ve);var a=C(require("react"),1),J=require("../utils/clamp.cjs"),W=require("../utils/createContext.cjs"),h=require("../utils/direction.cjs"),X=require("../utils/part.cjs"),d=require("../utils/primitive.cjs"),Z=require("../utils/useControllableState.cjs"),H=require("react/jsx-runtime"),Ke="(prefers-reduced-motion: reduce)";function G(){return typeof window>"u"||typeof window.matchMedia!="function"?!1:window.matchMedia(Ke).matches}var[j,i]=(0,W.createSafeContext)("Carousel"),ee=a.forwardRef(({value:t,defaultValue:o=0,onValueChange:e,orientation:n="horizontal",loop:s=!1,slidesPerPage:l=1,slidesPerMove:xe=1,spacing:w,autoplay:N=!1,autoplayInterval:V=5e3,style:B,...f},ye)=>{let[x=0,u]=(0,Z.useControllableState)({prop:t,defaultProp:o,onChange:e}),[A,z]=a.useState([]),ve=(0,h.useDirection)(),v=Math.max(1,Math.floor(l)),y=Math.max(1,Math.floor(xe)),c=A.length,m=Math.max(0,c-v),ge=a.useCallback(r=>{z(p=>p.includes(r)?p:[...p,r])},[]),Re=a.useCallback(r=>{z(p=>p.filter(M=>M!==r))},[]),be=a.useCallback(r=>{u((0,J.clamp)(r,0,m))},[u,m]),g=a.useCallback(()=>{if(c===0)return;let r=x+y;r<=m?u(r):u(s?0:m)},[c,x,y,m,s,u]),F=a.useCallback(()=>{if(c===0)return;let r=x-y;r>=0?u(r):u(s?m:0)},[c,x,y,m,s,u]),[R,O]=a.useState(()=>N&&!G()),[he,U]=a.useState(!1),[Ie,_]=a.useState(!1),[Ee,ke]=a.useState(!1),Q=he||Ie||Ee;a.useEffect(()=>{O(N&&!G())},[N]),a.useEffect(()=>{if(typeof document>"u")return;let r=()=>ke(document.visibilityState==="hidden");return r(),document.addEventListener("visibilitychange",r),()=>document.removeEventListener("visibilitychange",r)},[]),a.useEffect(()=>{if(!R||Q||c<=v)return;let r=setInterval(g,V);return()=>clearInterval(r)},[R,Q,c,v,g,V]);let we=r=>{if(c===0)return;let p=n==="horizontal"?"ArrowRight":"ArrowDown",M=n==="horizontal"?"ArrowLeft":"ArrowUp",$=(0,h.directionalKey)(r.key,r.currentTarget,ve);$===p?(r.preventDefault(),g()):$===M&&(r.preventDefault(),F())},Y=typeof w=="number"?`${w}px`:w;return(0,H.jsx)(j,{value:x,setValue:u,orientation:n,loop:s,itemIds:A,registerItem:ge,unregisterItem:Re,slidesPerPage:v,slidesPerMove:y,maxIndex:m,scrollToIndex:be,next:g,previous:F,playing:R,setPlaying:O,children:(0,H.jsx)(d.Primitive.div,{role:"region","aria-roledescription":"carousel","data-orientation":n,"data-state":R?"playing":"paused",style:Y===void 0?B:{...B,"--skdx-carousel-spacing":Y},...f,...(0,X.skdxPart)("carousel","root",f.className),ref:ye,onKeyDown:(0,d.composeEventHandlers)(f.onKeyDown,we),onPointerEnter:(0,d.composeEventHandlers)(f.onPointerEnter,()=>U(!0)),onPointerLeave:(0,d.composeEventHandlers)(f.onPointerLeave,()=>U(!1)),onFocus:(0,d.composeEventHandlers)(f.onFocus,()=>_(!0)),onBlur:(0,d.composeEventHandlers)(f.onBlur,()=>_(!1))})})});ee.displayName="Carousel";var te=C(require("react"),1),oe=require("../utils/part.cjs"),re=require("../utils/primitive.cjs");var se=require("react/jsx-runtime"),D=te.forwardRef((t,o)=>{let e=i("CarouselContent");return(0,se.jsx)(re.Primitive.div,{"data-orientation":e.orientation,...t,...(0,oe.skdxPart)("carousel","content",t.className),ref:o})});D.displayName="CarouselContent";var P=C(require("react"),1),ae=require("../utils/part.cjs"),ne=require("../utils/primitive.cjs");var ie=require("react/jsx-runtime"),L=P.forwardRef((t,o)=>{let e=i("CarouselItem"),n=P.useId(),s=e.itemIds.indexOf(n),l=s>=e.value&&s<e.value+e.slidesPerPage;return P.useEffect(()=>(e.registerItem(n),()=>e.unregisterItem(n)),[n]),(0,ie.jsx)(ne.Primitive.div,{role:"group","aria-roledescription":"slide","data-state":l?"active":"inactive","data-orientation":e.orientation,hidden:!l,...t,...(0,ae.skdxPart)("carousel","item",t.className),ref:o})});L.displayName="CarouselItem";var le=C(require("react"),1),ue=require("../utils/part.cjs"),I=require("../utils/primitive.cjs");var ce=require("react/jsx-runtime"),T=le.forwardRef((t,o)=>{let e=i("CarouselPrevious"),n=e.itemIds.length,s=e.value<=0,l=n===0||s&&!e.loop;return(0,ce.jsx)(I.Primitive.button,{type:"button",disabled:l,"data-disabled":l?"":void 0,...t,...(0,ue.skdxPart)("carousel","previous",t.className),ref:o,onClick:(0,I.composeEventHandlers)(t.onClick,e.previous)})});T.displayName="CarouselPrevious";var me=C(require("react"),1),de=require("../utils/part.cjs"),E=require("../utils/primitive.cjs");var fe=require("react/jsx-runtime"),S=me.forwardRef((t,o)=>{let e=i("CarouselNext"),n=e.itemIds.length,s=e.value>=e.maxIndex,l=n===0||s&&!e.loop;return(0,fe.jsx)(E.Primitive.button,{type:"button",disabled:l,"data-disabled":l?"":void 0,...t,...(0,de.skdxPart)("carousel","next",t.className),ref:o,onClick:(0,E.composeEventHandlers)(t.onClick,e.next)})});S.displayName="CarouselNext";var pe=C(require("react"),1),Ce=require("../utils/part.cjs"),k=require("../utils/primitive.cjs");var Pe=require("react/jsx-runtime"),K=pe.forwardRef((t,o)=>{let e=i("CarouselPlayPause");return(0,Pe.jsx)(k.Primitive.button,{type:"button","data-state":e.playing?"playing":"paused",...t,...(0,Ce.skdxPart)("carousel","play-pause",t.className),ref:o,onClick:(0,k.composeEventHandlers)(t.onClick,()=>e.setPlaying(!e.playing))})});K.displayName="CarouselPlayPause";0&&(module.exports={Carousel,CarouselContent,CarouselItem,CarouselNext,CarouselPlayPause,CarouselPrevious,CarouselProvider,useCarouselContext});
+"use strict";var et=Object.create;var N=Object.defineProperty;var tt=Object.getOwnPropertyDescriptor;var ot=Object.getOwnPropertyNames;var rt=Object.getPrototypeOf,at=Object.prototype.hasOwnProperty;var st=(e,o)=>{for(var t in o)N(e,t,{get:o[t],enumerable:!0})},j=(e,o,t,s)=>{if(o&&typeof o=="object"||typeof o=="function")for(let r of ot(o))!at.call(e,r)&&r!==t&&N(e,r,{get:()=>o[r],enumerable:!(s=tt(o,r))||s.enumerable});return e};var C=(e,o,t)=>(t=e!=null?et(rt(e)):{},j(o||!e||!e.__esModule?N(t,"default",{value:e,enumerable:!0}):t,e)),nt=e=>j(N({},"__esModule",{value:!0}),e);var yt={};st(yt,{Carousel:()=>G,CarouselContent:()=>k,CarouselIndicator:()=>M,CarouselIndicators:()=>S,CarouselItem:()=>L,CarouselNext:()=>H,CarouselPlayPause:()=>K,CarouselPrevious:()=>B,CarouselProgress:()=>De,CarouselProvider:()=>Me,useCarouselContext:()=>n});module.exports=nt(yt);var l=C(require("react"),1),Ie=require("../utils/clamp.cjs"),Ee=require("../utils/createContext.cjs"),U=require("../utils/direction.cjs"),Ne=require("../utils/part.cjs"),h=require("../utils/primitive.cjs"),ke=require("../utils/useControllableState.cjs");var it=new Set(["textbox","searchbox","listbox","slider","spinbutton","menu","menubar","tablist","grid","treegrid","tree","combobox","radiogroup"]),lt=new Set(["INPUT","SELECT","TEXTAREA","AUDIO","VIDEO"]);function ut(e){if(lt.has(e.tagName)||e.isContentEditable)return!0;let o=e.getAttribute("role");return o!==null&&it.has(o)}function ee(e,o){if(!(e instanceof Element))return!1;let t=e;for(;t!==null&&t!==o;){if(ut(t))return!0;t=t.parentElement}return!1}var te=C(require("react"),1),oe=require("../utils/part.cjs"),re=require("../utils/primitive.cjs");var ae=require("react/jsx-runtime"),k=te.forwardRef((e,o)=>{let t=n("CarouselContent");return(0,ae.jsx)(re.Primitive.div,{"data-orientation":t.orientation,tabIndex:0,"aria-live":t.playing?"off":"polite","aria-atomic":"false",...e,...(0,oe.skdxPart)("carousel","content",e.className),ref:o})});k.displayName="CarouselContent";var se=C(require("react"),1),ne=require("../utils/part.cjs"),T=require("../utils/primitive.cjs");var ie=require("react/jsx-runtime"),M=se.forwardRef(({index:e,label:o,...t},s)=>{let r=n("CarouselIndicator"),i=e>=r.value&&e<r.value+r.slidesPerPage;return(0,ie.jsx)(T.Primitive.button,{type:"button","aria-label":o??`Go to slide ${e+1}`,"aria-disabled":i?!0:void 0,"data-state":i?"active":"inactive","data-orientation":r.orientation,...t,...(0,ne.skdxPart)("carousel","indicator",t.className),ref:s,onClick:(0,T.composeEventHandlers)(t.onClick,()=>{i||r.scrollToIndex(e)})})});M.displayName="CarouselIndicator";var le=C(require("react"),1),ue=require("../utils/part.cjs"),ce=require("../utils/primitive.cjs");var de=require("react/jsx-runtime"),S=le.forwardRef((e,o)=>{let t=n("CarouselIndicators");return(0,de.jsx)(ce.Primitive.div,{role:"group","data-orientation":t.orientation,...e,...(0,ue.skdxPart)("carousel","indicators",e.className),ref:o})});S.displayName="CarouselIndicators";var b=C(require("react"),1),me=require("../utils/part.cjs"),pe=require("../utils/primitive.cjs");var fe=require("react/jsx-runtime"),L=b.forwardRef((e,o)=>{let t=n("CarouselItem"),s=b.useId(),r=t.itemIds.indexOf(s),i=r>=t.value&&r<t.value+t.slidesPerPage,{registerItem:y,unregisterItem:u}=t;return b.useEffect(()=>(y(s),()=>u(s)),[s,y,u]),(0,fe.jsx)(pe.Primitive.div,{role:"group","aria-roledescription":"slide","data-state":i?"active":"inactive","data-orientation":t.orientation,hidden:!i,...e,...(0,me.skdxPart)("carousel","item",e.className),ref:o})});L.displayName="CarouselItem";var Ce=C(require("react"),1),ye=require("../utils/part.cjs"),D=require("../utils/primitive.cjs");var Pe=require("react/jsx-runtime"),H=Ce.forwardRef((e,o)=>{let t=n("CarouselNext"),s=t.itemIds.length,r=t.value>=t.maxIndex,i=s===0||r&&!t.loop;return(0,Pe.jsx)(D.Primitive.button,{type:"button",disabled:i,"data-disabled":i?"":void 0,...e,...(0,ye.skdxPart)("carousel","next",e.className),ref:o,onClick:(0,D.composeEventHandlers)(e.onClick,t.next)})});H.displayName="CarouselNext";var ve=C(require("react"),1),he=require("../utils/part.cjs"),A=require("../utils/primitive.cjs");var xe=require("react/jsx-runtime"),K=ve.forwardRef((e,o)=>{let t=n("CarouselPlayPause");return(0,xe.jsx)(A.Primitive.button,{type:"button","data-state":t.playing?"playing":"paused",...e,...(0,he.skdxPart)("carousel","play-pause",e.className),ref:o,onClick:(0,A.composeEventHandlers)(e.onClick,()=>t.setPlaying(!t.playing))})});K.displayName="CarouselPlayPause";var be=C(require("react"),1),ge=require("../utils/part.cjs"),O=require("../utils/primitive.cjs");var Re=require("react/jsx-runtime"),B=be.forwardRef((e,o)=>{let t=n("CarouselPrevious"),s=t.itemIds.length,r=t.value<=0,i=s===0||r&&!t.loop;return(0,Re.jsx)(O.Primitive.button,{type:"button",disabled:i,"data-disabled":i?"":void 0,...e,...(0,ge.skdxPart)("carousel","previous",e.className),ref:o,onClick:(0,O.composeEventHandlers)(e.onClick,t.previous)})});B.displayName="CarouselPrevious";var c=require("react/jsx-runtime");function we({items:e=[],renderItem:o,showIndicators:t,showControls:s,autoplay:r,indicatorLabels:i}){let y=n("Carousel");return(0,c.jsxs)(c.Fragment,{children:[r?(0,c.jsx)(K,{"aria-label":y.playing?"Pause slideshow":"Play slideshow"}):null,s?(0,c.jsx)(B,{children:"Previous"}):null,(0,c.jsx)(k,{children:e.map((u,m)=>(0,c.jsx)(L,{children:o?o(u,m):String(u)},m))}),s?(0,c.jsx)(H,{children:"Next"}):null,t?(0,c.jsx)(S,{"aria-label":"Slides",children:e.map((u,m)=>(0,c.jsx)(M,{index:m,label:i?.[m]},m))}):null]})}var V=require("react/jsx-runtime"),ct="(prefers-reduced-motion: reduce)";function Te(){return typeof window>"u"||typeof window.matchMedia!="function"?null:window.matchMedia(ct)}function dt(e){let o=Te();return o?(o.addEventListener("change",e),()=>o.removeEventListener("change",e)):()=>{}}function mt(){return Te()?.matches??!1}function pt(){return!1}var[Me,n]=(0,Ee.createSafeContext)("Carousel");function ft({value:e,defaultValue:o=0,onValueChange:t,orientation:s="horizontal",loop:r=!1,slidesPerPage:i=1,slidesPerMove:y=1,spacing:u,autoplay:m=!1,autoplayInterval:$=5e3,items:Ae,renderItem:Ke,showIndicators:Oe=!1,indicatorLabels:Be,showControls:Ve=!0,style:z,children:Ue,...x},_e){let[P=0,p]=(0,ke.useControllableState)({prop:e,defaultProp:o,onChange:t}),[Q,W]=l.useState([]),Fe=(0,U.useDirection)(),w=Math.max(1,Math.floor(i)),R=Math.max(1,Math.floor(y)),d=Q.length,f=Math.max(0,d-w),Ge=l.useCallback(a=>{W(v=>v.includes(a)?v:[...v,a])},[]),$e=l.useCallback(a=>{W(v=>v.filter(F=>F!==a))},[]),ze=l.useCallback(a=>{p((0,Ie.clamp)(a,0,f))},[p,f]),I=l.useCallback(()=>{if(d===0)return;let a=P+R;a<=f?p(a):p(r?0:f)},[d,P,R,f,r,p]),q=l.useCallback(()=>{if(d===0)return;let a=P-R;a>=0?p(a):p(r?f:0)},[d,P,R,f,r,p]),[Qe,X]=l.useState(m),We=l.useSyncExternalStore(dt,mt,pt),E=Qe&&!We,[qe,Y]=l.useState(!1),[Xe,Ye]=l.useState(!1),_=qe||Xe;l.useEffect(()=>{if(typeof document>"u")return;let a=()=>Ye(document.visibilityState==="hidden");return a(),document.addEventListener("visibilitychange",a),()=>document.removeEventListener("visibilitychange",a)},[]),l.useEffect(()=>{if(!E||_||d<=w)return;let a=setInterval(I,$);return()=>clearInterval(a)},[E,_,d,w,I,$]);let Je=a=>{if(d===0||ee(a.target,a.currentTarget))return;let v=s==="horizontal"?"ArrowRight":"ArrowDown",F=s==="horizontal"?"ArrowLeft":"ArrowUp",Z=(0,U.directionalKey)(a.key,a.currentTarget,Fe);Z===v?(a.preventDefault(),I()):Z===F&&(a.preventDefault(),q())},J=typeof u=="number"?`${u}px`:u,Ze=d>0&&(r||P<f),je=d>0&&(r||P>0);return(0,V.jsx)(Me,{value:P,setValue:p,orientation:s,loop:r,itemIds:Q,registerItem:Ge,unregisterItem:$e,slidesPerPage:w,slidesPerMove:R,maxIndex:f,scrollToIndex:ze,next:I,previous:q,canScrollNext:Ze,canScrollPrev:je,playing:E,setPlaying:X,children:(0,V.jsx)(h.Primitive.div,{role:"region","aria-roledescription":"carousel",tabIndex:0,"data-orientation":s,"data-state":E?"playing":"paused","data-suspended":_?"":void 0,style:J===void 0?z:{...z,"--skdx-carousel-spacing":J},...x,...(0,Ne.skdxPart)("carousel","root",x.className),ref:_e,onKeyDown:(0,h.composeEventHandlers)(x.onKeyDown,Je),onPointerEnter:(0,h.composeEventHandlers)(x.onPointerEnter,()=>Y(!0)),onPointerLeave:(0,h.composeEventHandlers)(x.onPointerLeave,()=>Y(!1)),onFocus:(0,h.composeEventHandlers)(x.onFocus,()=>X(!1)),children:Ue??(0,V.jsx)(we,{items:Ae,renderItem:Ke,showIndicators:Oe,indicatorLabels:Be,showControls:Ve,autoplay:m})})})}var G=l.forwardRef(ft);G.displayName="Carousel";var g=C(require("react"),1),Se=require("../utils/part.cjs"),Le=require("../utils/primitive.cjs");var He=require("react/jsx-runtime"),Ct=(e,o)=>`Slide ${e} of ${o}`,De=g.forwardRef(({format:e=Ct,children:o,...t},s)=>{let r=n("CarouselProgress"),i=r.itemIds.length,y=i===0?0:r.value+1,u=e(y,i);return(0,He.jsx)(Le.Primitive.div,{"data-orientation":r.orientation,...t,...(0,Se.skdxPart)("carousel","progress",t.className),ref:s,children:t.asChild&&g.isValidElement(o)?g.cloneElement(o,void 0,u):u})});De.displayName="CarouselProgress";0&&(module.exports={Carousel,CarouselContent,CarouselIndicator,CarouselIndicators,CarouselItem,CarouselNext,CarouselPlayPause,CarouselPrevious,CarouselProgress,CarouselProvider,useCarouselContext});

package/dist/carousel/Carousel.d.cts

@@ -21,35 +21,11 @@ export declare const CarouselProvider: {
     }): React.JSX.Element;
     displayName: string;
 }, useCarouselContext: (consumerName: string) => CarouselContextValue;
-/**
- * Root of a carousel: `role="region"` with `aria-roledescription="carousel"`
- * and `data-orientation`. Owns the index of the first visible slide and hands
- * it down to `CarouselContent` / `CarouselItem` / `CarouselPrevious` /
- * `CarouselNext` / `CarouselPlayPause` via context.
- *
- * Slide order comes from the mount order of `CarouselItem` children, not an
- * explicit index prop on each — the `slidesPerPage` slides starting at `value`
- * render, the rest are `hidden`, and there's no track/transform-based sliding.
- * Supports Arrow Left/Right (or Up/Down when `orientation="vertical"`) when the
- * root is focused, in addition to `CarouselPrevious`/`CarouselNext`; each step
- * moves `slidesPerMove` slides. Works controlled (`value` + `onValueChange`) or
- * uncontrolled (`defaultValue`).
- *
- * `autoplay` is off by default and, when on, pauses on hover, on focus, and
- * while the page is hidden, and never runs under `prefers-reduced-motion`
- * (WCAG 2.2.2) — pair it with a `CarouselPlayPause` control.
- *
- * @example
- * ```tsx
- * <Carousel loop slidesPerPage={2} spacing={16}>
- *   <CarouselContent>
- *     <CarouselItem>Slide 1</CarouselItem>
- *     <CarouselItem>Slide 2</CarouselItem>
- *     <CarouselItem>Slide 3</CarouselItem>
- *   </CarouselContent>
- *   <CarouselPrevious>Prev</CarouselPrevious>
- *   <CarouselNext>Next</CarouselNext>
- * </Carousel>
- * ```
- */
-export declare const Carousel: React.ForwardRefExoticComponent<Omit<CarouselProps, "ref"> & React.RefAttributes<HTMLDivElement>>;
+/** @internal Cast for the generic-over-`T` `forwardRef` pattern — `React.forwardRef` itself cannot express a generic component. */
+type CarouselComponent = (<T>(props: CarouselProps<T> & {
+    ref?: React.ForwardedRef<HTMLDivElement>;
+}) => React.ReactElement | null) & {
+    displayName?: string;
+};
+export declare const Carousel: CarouselComponent;
+export {};

package/dist/carousel/Carousel.d.ts

@@ -21,35 +21,11 @@ export declare const CarouselProvider: {
     }): React.JSX.Element;
     displayName: string;
 }, useCarouselContext: (consumerName: string) => CarouselContextValue;
-/**
- * Root of a carousel: `role="region"` with `aria-roledescription="carousel"`
- * and `data-orientation`. Owns the index of the first visible slide and hands
- * it down to `CarouselContent` / `CarouselItem` / `CarouselPrevious` /
- * `CarouselNext` / `CarouselPlayPause` via context.
- *
- * Slide order comes from the mount order of `CarouselItem` children, not an
- * explicit index prop on each — the `slidesPerPage` slides starting at `value`
- * render, the rest are `hidden`, and there's no track/transform-based sliding.
- * Supports Arrow Left/Right (or Up/Down when `orientation="vertical"`) when the
- * root is focused, in addition to `CarouselPrevious`/`CarouselNext`; each step
- * moves `slidesPerMove` slides. Works controlled (`value` + `onValueChange`) or
- * uncontrolled (`defaultValue`).
- *
- * `autoplay` is off by default and, when on, pauses on hover, on focus, and
- * while the page is hidden, and never runs under `prefers-reduced-motion`
- * (WCAG 2.2.2) — pair it with a `CarouselPlayPause` control.
- *
- * @example
- * ```tsx
- * <Carousel loop slidesPerPage={2} spacing={16}>
- *   <CarouselContent>
- *     <CarouselItem>Slide 1</CarouselItem>
- *     <CarouselItem>Slide 2</CarouselItem>
- *     <CarouselItem>Slide 3</CarouselItem>
- *   </CarouselContent>
- *   <CarouselPrevious>Prev</CarouselPrevious>
- *   <CarouselNext>Next</CarouselNext>
- * </Carousel>
- * ```
- */
-export declare const Carousel: React.ForwardRefExoticComponent<Omit<CarouselProps, "ref"> & React.RefAttributes<HTMLDivElement>>;
+/** @internal Cast for the generic-over-`T` `forwardRef` pattern — `React.forwardRef` itself cannot express a generic component. */
+type CarouselComponent = (<T>(props: CarouselProps<T> & {
+    ref?: React.ForwardedRef<HTMLDivElement>;
+}) => React.ReactElement | null) & {
+    displayName?: string;
+};
+export declare const Carousel: CarouselComponent;
+export {};

package/dist/carousel/Carousel.js

@@ -1 +1 @@
-import*as r from"react";import{clamp as re}from"../utils/clamp.js";import{createSafeContext as se}from"../utils/createContext.js";import{directionalKey as ae,useDirection as ne}from"../utils/direction.js";import{skdxPart as ie}from"../utils/part.js";import{composeEventHandlers as x,Primitive as le}from"../utils/primitive.js";import{useControllableState as ue}from"../utils/useControllableState.js";import{jsx as V}from"react/jsx-runtime";var ce="(prefers-reduced-motion: reduce)";function K(){return typeof window>"u"||typeof window.matchMedia!="function"?!1:window.matchMedia(ce).matches}var[me,l]=se("Carousel"),de=r.forwardRef(({value:o,defaultValue:n=0,onValueChange:e,orientation:s="horizontal",loop:a=!1,slidesPerPage:i=1,slidesPerMove:$=1,spacing:R,autoplay:b=!1,autoplayInterval:I=5e3,style:E,...d},q)=>{let[C=0,u]=ue({prop:o,defaultProp:n,onChange:e}),[k,w]=r.useState([]),G=ne(),y=Math.max(1,Math.floor(i)),P=Math.max(1,Math.floor($)),c=k.length,m=Math.max(0,c-y),J=r.useCallback(t=>{w(f=>f.includes(t)?f:[...f,t])},[]),W=r.useCallback(t=>{w(f=>f.filter(h=>h!==t))},[]),X=r.useCallback(t=>{u(re(t,0,m))},[u,m]),v=r.useCallback(()=>{if(c===0)return;let t=C+P;t<=m?u(t):u(a?0:m)},[c,C,P,m,a,u]),N=r.useCallback(()=>{if(c===0)return;let t=C-P;t>=0?u(t):u(a?m:0)},[c,C,P,m,a,u]),[g,M]=r.useState(()=>b&&!K()),[Z,H]=r.useState(!1),[j,D]=r.useState(!1),[ee,te]=r.useState(!1),L=Z||j||ee;r.useEffect(()=>{M(b&&!K())},[b]),r.useEffect(()=>{if(typeof document>"u")return;let t=()=>te(document.visibilityState==="hidden");return t(),document.addEventListener("visibilitychange",t),()=>document.removeEventListener("visibilitychange",t)},[]),r.useEffect(()=>{if(!g||L||c<=y)return;let t=setInterval(v,I);return()=>clearInterval(t)},[g,L,c,y,v,I]);let oe=t=>{if(c===0)return;let f=s==="horizontal"?"ArrowRight":"ArrowDown",h=s==="horizontal"?"ArrowLeft":"ArrowUp",S=ae(t.key,t.currentTarget,G);S===f?(t.preventDefault(),v()):S===h&&(t.preventDefault(),N())},T=typeof R=="number"?`${R}px`:R;return V(me,{value:C,setValue:u,orientation:s,loop:a,itemIds:k,registerItem:J,unregisterItem:W,slidesPerPage:y,slidesPerMove:P,maxIndex:m,scrollToIndex:X,next:v,previous:N,playing:g,setPlaying:M,children:V(le.div,{role:"region","aria-roledescription":"carousel","data-orientation":s,"data-state":g?"playing":"paused",style:T===void 0?E:{...E,"--skdx-carousel-spacing":T},...d,...ie("carousel","root",d.className),ref:q,onKeyDown:x(d.onKeyDown,oe),onPointerEnter:x(d.onPointerEnter,()=>H(!0)),onPointerLeave:x(d.onPointerLeave,()=>H(!1)),onFocus:x(d.onFocus,()=>D(!0)),onBlur:x(d.onBlur,()=>D(!1))})})});de.displayName="Carousel";import*as B from"react";import{skdxPart as fe}from"../utils/part.js";import{Primitive as pe}from"../utils/primitive.js";import{jsx as Ce}from"react/jsx-runtime";var A=B.forwardRef((o,n)=>{let e=l("CarouselContent");return Ce(pe.div,{"data-orientation":e.orientation,...o,...fe("carousel","content",o.className),ref:n})});A.displayName="CarouselContent";import*as p from"react";import{skdxPart as Pe}from"../utils/part.js";import{Primitive as xe}from"../utils/primitive.js";import{jsx as ye}from"react/jsx-runtime";var z=p.forwardRef((o,n)=>{let e=l("CarouselItem"),s=p.useId(),a=e.itemIds.indexOf(s),i=a>=e.value&&a<e.value+e.slidesPerPage;return p.useEffect(()=>(e.registerItem(s),()=>e.unregisterItem(s)),[s]),ye(xe.div,{role:"group","aria-roledescription":"slide","data-state":i?"active":"inactive","data-orientation":e.orientation,hidden:!i,...o,...Pe("carousel","item",o.className),ref:n})});z.displayName="CarouselItem";import*as F from"react";import{skdxPart as ve}from"../utils/part.js";import{composeEventHandlers as ge,Primitive as Re}from"../utils/primitive.js";import{jsx as be}from"react/jsx-runtime";var O=F.forwardRef((o,n)=>{let e=l("CarouselPrevious"),s=e.itemIds.length,a=e.value<=0,i=s===0||a&&!e.loop;return be(Re.button,{type:"button",disabled:i,"data-disabled":i?"":void 0,...o,...ve("carousel","previous",o.className),ref:n,onClick:ge(o.onClick,e.previous)})});O.displayName="CarouselPrevious";import*as U from"react";import{skdxPart as he}from"../utils/part.js";import{composeEventHandlers as Ie,Primitive as Ee}from"../utils/primitive.js";import{jsx as ke}from"react/jsx-runtime";var _=U.forwardRef((o,n)=>{let e=l("CarouselNext"),s=e.itemIds.length,a=e.value>=e.maxIndex,i=s===0||a&&!e.loop;return ke(Ee.button,{type:"button",disabled:i,"data-disabled":i?"":void 0,...o,...he("carousel","next",o.className),ref:n,onClick:Ie(o.onClick,e.next)})});_.displayName="CarouselNext";import*as Q from"react";import{skdxPart as we}from"../utils/part.js";import{composeEventHandlers as Ne,Primitive as Me}from"../utils/primitive.js";import{jsx as He}from"react/jsx-runtime";var Y=Q.forwardRef((o,n)=>{let e=l("CarouselPlayPause");return He(Me.button,{type:"button","data-state":e.playing?"playing":"paused",...o,...we("carousel","play-pause",o.className),ref:n,onClick:Ne(o.onClick,()=>e.setPlaying(!e.playing))})});Y.displayName="CarouselPlayPause";export{de as Carousel,A as CarouselContent,z as CarouselItem,_ as CarouselNext,Y as CarouselPlayPause,O as CarouselPrevious,me as CarouselProvider,l as useCarouselContext};
+import*as l from"react";import{clamp as Ye}from"../utils/clamp.js";import{createSafeContext as Je}from"../utils/createContext.js";import{directionalKey as Ze,useDirection as je}from"../utils/direction.js";import{skdxPart as et}from"../utils/part.js";import{composeEventHandlers as I,Primitive as tt}from"../utils/primitive.js";import{useControllableState as ot}from"../utils/useControllableState.js";var xe=new Set(["textbox","searchbox","listbox","slider","spinbutton","menu","menubar","tablist","grid","treegrid","tree","combobox","radiogroup"]),be=new Set(["INPUT","SELECT","TEXTAREA","AUDIO","VIDEO"]);function ge(e){if(be.has(e.tagName)||e.isContentEditable)return!0;let o=e.getAttribute("role");return o!==null&&xe.has(o)}function z(e,o){if(!(e instanceof Element))return!1;let t=e;for(;t!==null&&t!==o;){if(ge(t))return!0;t=t.parentElement}return!1}import*as Q from"react";import{skdxPart as Re}from"../utils/part.js";import{Primitive as we}from"../utils/primitive.js";import{jsx as Ie}from"react/jsx-runtime";var k=Q.forwardRef((e,o)=>{let t=i("CarouselContent");return Ie(we.div,{"data-orientation":t.orientation,tabIndex:0,"aria-live":t.playing?"off":"polite","aria-atomic":"false",...e,...Re("carousel","content",e.className),ref:o})});k.displayName="CarouselContent";import*as W from"react";import{skdxPart as Ee}from"../utils/part.js";import{composeEventHandlers as Ne,Primitive as ke}from"../utils/primitive.js";import{jsx as Te}from"react/jsx-runtime";var T=W.forwardRef(({index:e,label:o,...t},s)=>{let r=i("CarouselIndicator"),n=e>=r.value&&e<r.value+r.slidesPerPage;return Te(ke.button,{type:"button","aria-label":o??`Go to slide ${e+1}`,"aria-disabled":n?!0:void 0,"data-state":n?"active":"inactive","data-orientation":r.orientation,...t,...Ee("carousel","indicator",t.className),ref:s,onClick:Ne(t.onClick,()=>{n||r.scrollToIndex(e)})})});T.displayName="CarouselIndicator";import*as q from"react";import{skdxPart as Me}from"../utils/part.js";import{Primitive as Se}from"../utils/primitive.js";import{jsx as Le}from"react/jsx-runtime";var M=q.forwardRef((e,o)=>{let t=i("CarouselIndicators");return Le(Se.div,{role:"group","data-orientation":t.orientation,...e,...Me("carousel","indicators",e.className),ref:o})});M.displayName="CarouselIndicators";import*as h from"react";import{skdxPart as De}from"../utils/part.js";import{Primitive as He}from"../utils/primitive.js";import{jsx as Ae}from"react/jsx-runtime";var S=h.forwardRef((e,o)=>{let t=i("CarouselItem"),s=h.useId(),r=t.itemIds.indexOf(s),n=r>=t.value&&r<t.value+t.slidesPerPage,{registerItem:f,unregisterItem:u}=t;return h.useEffect(()=>(f(s),()=>u(s)),[s,f,u]),Ae(He.div,{role:"group","aria-roledescription":"slide","data-state":n?"active":"inactive","data-orientation":t.orientation,hidden:!n,...e,...De("carousel","item",e.className),ref:o})});S.displayName="CarouselItem";import*as X from"react";import{skdxPart as Ke}from"../utils/part.js";import{composeEventHandlers as Oe,Primitive as Be}from"../utils/primitive.js";import{jsx as Ve}from"react/jsx-runtime";var L=X.forwardRef((e,o)=>{let t=i("CarouselNext"),s=t.itemIds.length,r=t.value>=t.maxIndex,n=s===0||r&&!t.loop;return Ve(Be.button,{type:"button",disabled:n,"data-disabled":n?"":void 0,...e,...Ke("carousel","next",e.className),ref:o,onClick:Oe(e.onClick,t.next)})});L.displayName="CarouselNext";import*as Y from"react";import{skdxPart as Ue}from"../utils/part.js";import{composeEventHandlers as _e,Primitive as Fe}from"../utils/primitive.js";import{jsx as Ge}from"react/jsx-runtime";var D=Y.forwardRef((e,o)=>{let t=i("CarouselPlayPause");return Ge(Fe.button,{type:"button","data-state":t.playing?"playing":"paused",...e,...Ue("carousel","play-pause",e.className),ref:o,onClick:_e(e.onClick,()=>t.setPlaying(!t.playing))})});D.displayName="CarouselPlayPause";import*as J from"react";import{skdxPart as $e}from"../utils/part.js";import{composeEventHandlers as ze,Primitive as Qe}from"../utils/primitive.js";import{jsx as We}from"react/jsx-runtime";var H=J.forwardRef((e,o)=>{let t=i("CarouselPrevious"),s=t.itemIds.length,r=t.value<=0,n=s===0||r&&!t.loop;return We(Qe.button,{type:"button",disabled:n,"data-disabled":n?"":void 0,...e,...$e("carousel","previous",e.className),ref:o,onClick:ze(e.onClick,t.previous)})});H.displayName="CarouselPrevious";import{Fragment as qe,jsx as P,jsxs as Xe}from"react/jsx-runtime";function Z({items:e=[],renderItem:o,showIndicators:t,showControls:s,autoplay:r,indicatorLabels:n}){let f=i("Carousel");return Xe(qe,{children:[r?P(D,{"aria-label":f.playing?"Pause slideshow":"Play slideshow"}):null,s?P(H,{children:"Previous"}):null,P(k,{children:e.map((u,d)=>P(S,{children:o?o(u,d):String(u)},d))}),s?P(L,{children:"Next"}):null,t?P(M,{"aria-label":"Slides",children:e.map((u,d)=>P(T,{index:d,label:n?.[d]},d))}):null]})}import{jsx as A}from"react/jsx-runtime";var rt="(prefers-reduced-motion: reduce)";function j(){return typeof window>"u"||typeof window.matchMedia!="function"?null:window.matchMedia(rt)}function at(e){let o=j();return o?(o.addEventListener("change",e),()=>o.removeEventListener("change",e)):()=>{}}function st(){return j()?.matches??!1}function nt(){return!1}var[it,i]=Je("Carousel");function lt({value:e,defaultValue:o=0,onValueChange:t,orientation:s="horizontal",loop:r=!1,slidesPerPage:n=1,slidesPerMove:f=1,spacing:u,autoplay:d=!1,autoplayInterval:K=5e3,items:te,renderItem:oe,showIndicators:re=!1,indicatorLabels:ae,showControls:se=!0,style:O,children:ne,...v},ie){let[C=0,m]=ot({prop:e,defaultProp:o,onChange:t}),[B,V]=l.useState([]),le=je(),g=Math.max(1,Math.floor(n)),b=Math.max(1,Math.floor(f)),c=B.length,p=Math.max(0,c-g),ue=l.useCallback(a=>{V(y=>y.includes(a)?y:[...y,a])},[]),ce=l.useCallback(a=>{V(y=>y.filter(N=>N!==a))},[]),de=l.useCallback(a=>{m(Ye(a,0,p))},[m,p]),R=l.useCallback(()=>{if(c===0)return;let a=C+b;a<=p?m(a):m(r?0:p)},[c,C,b,p,r,m]),U=l.useCallback(()=>{if(c===0)return;let a=C-b;a>=0?m(a):m(r?p:0)},[c,C,b,p,r,m]),[me,_]=l.useState(d),pe=l.useSyncExternalStore(at,st,nt),w=me&&!pe,[fe,F]=l.useState(!1),[Ce,ye]=l.useState(!1),E=fe||Ce;l.useEffect(()=>{if(typeof document>"u")return;let a=()=>ye(document.visibilityState==="hidden");return a(),document.addEventListener("visibilitychange",a),()=>document.removeEventListener("visibilitychange",a)},[]),l.useEffect(()=>{if(!w||E||c<=g)return;let a=setInterval(R,K);return()=>clearInterval(a)},[w,E,c,g,R,K]);let Pe=a=>{if(c===0||z(a.target,a.currentTarget))return;let y=s==="horizontal"?"ArrowRight":"ArrowDown",N=s==="horizontal"?"ArrowLeft":"ArrowUp",$=Ze(a.key,a.currentTarget,le);$===y?(a.preventDefault(),R()):$===N&&(a.preventDefault(),U())},G=typeof u=="number"?`${u}px`:u,ve=c>0&&(r||C<p),he=c>0&&(r||C>0);return A(it,{value:C,setValue:m,orientation:s,loop:r,itemIds:B,registerItem:ue,unregisterItem:ce,slidesPerPage:g,slidesPerMove:b,maxIndex:p,scrollToIndex:de,next:R,previous:U,canScrollNext:ve,canScrollPrev:he,playing:w,setPlaying:_,children:A(tt.div,{role:"region","aria-roledescription":"carousel",tabIndex:0,"data-orientation":s,"data-state":w?"playing":"paused","data-suspended":E?"":void 0,style:G===void 0?O:{...O,"--skdx-carousel-spacing":G},...v,...et("carousel","root",v.className),ref:ie,onKeyDown:I(v.onKeyDown,Pe),onPointerEnter:I(v.onPointerEnter,()=>F(!0)),onPointerLeave:I(v.onPointerLeave,()=>F(!1)),onFocus:I(v.onFocus,()=>_(!1)),children:ne??A(Z,{items:te,renderItem:oe,showIndicators:re,indicatorLabels:ae,showControls:se,autoplay:d})})})}var ee=l.forwardRef(lt);ee.displayName="Carousel";import*as x from"react";import{skdxPart as ut}from"../utils/part.js";import{Primitive as ct}from"../utils/primitive.js";import{jsx as pt}from"react/jsx-runtime";var dt=(e,o)=>`Slide ${e} of ${o}`,mt=x.forwardRef(({format:e=dt,children:o,...t},s)=>{let r=i("CarouselProgress"),n=r.itemIds.length,f=n===0?0:r.value+1,u=e(f,n);return pt(ct.div,{"data-orientation":r.orientation,...t,...ut("carousel","progress",t.className),ref:s,children:t.asChild&&x.isValidElement(o)?x.cloneElement(o,void 0,u):u})});mt.displayName="CarouselProgress";export{ee as Carousel,k as CarouselContent,T as CarouselIndicator,M as CarouselIndicators,S as CarouselItem,L as CarouselNext,D as CarouselPlayPause,H as CarouselPrevious,mt as CarouselProgress,it as CarouselProvider,i as useCarouselContext};

package/dist/carousel/CarouselAnatomy.d.cts

@@ -0,0 +1,17 @@
+import type * as React from 'react';
+/**
+ * The anatomy a {@link Carousel} draws from `items` given no manually-composed
+ * children: an optional play/pause control (whenever `autoplay` is set),
+ * optional previous/next buttons, the content with one derived `CarouselItem`
+ * per item, and an optional indicator dot per item.
+ *
+ * @internal
+ */
+export declare function CarouselAnatomy<T>({ items, renderItem, showIndicators, showControls, autoplay, indicatorLabels, }: {
+    items?: T[];
+    renderItem?: (item: T, index: number) => React.ReactNode;
+    showIndicators?: boolean;
+    showControls?: boolean;
+    autoplay?: boolean;
+    indicatorLabels?: readonly string[];
+}): React.JSX.Element;

package/dist/carousel/CarouselAnatomy.d.ts

@@ -0,0 +1,17 @@
+import type * as React from 'react';
+/**
+ * The anatomy a {@link Carousel} draws from `items` given no manually-composed
+ * children: an optional play/pause control (whenever `autoplay` is set),
+ * optional previous/next buttons, the content with one derived `CarouselItem`
+ * per item, and an optional indicator dot per item.
+ *
+ * @internal
+ */
+export declare function CarouselAnatomy<T>({ items, renderItem, showIndicators, showControls, autoplay, indicatorLabels, }: {
+    items?: T[];
+    renderItem?: (item: T, index: number) => React.ReactNode;
+    showIndicators?: boolean;
+    showControls?: boolean;
+    autoplay?: boolean;
+    indicatorLabels?: readonly string[];
+}): React.JSX.Element;

package/dist/carousel/CarouselContent.d.cts

@@ -1,9 +1,8 @@
 import * as React from 'react';
 import type { CarouselContentProps } from './types.cjs';
 /**
- * Wrapper around the slide `CarouselItem`s: renders a plain `<div>` with
- * `data-orientation` reflecting the carousel's axis. Layout (e.g. hiding
- * overflow) is entirely up to your CSS.
+ * Slide wrapper and live region. Layout is CSS-controlled. `aria-live`
+ * politeness follows `playing` state: `off` during autoplay, `polite` after.
  *
  * @example
  * ```tsx

package/dist/carousel/CarouselContent.d.ts

@@ -1,9 +1,8 @@
 import * as React from 'react';
 import type { CarouselContentProps } from './types.js';
 /**
- * Wrapper around the slide `CarouselItem`s: renders a plain `<div>` with
- * `data-orientation` reflecting the carousel's axis. Layout (e.g. hiding
- * overflow) is entirely up to your CSS.
+ * Slide wrapper and live region. Layout is CSS-controlled. `aria-live`
+ * politeness follows `playing` state: `off` during autoplay, `polite` after.
  *
  * @example
  * ```tsx

package/dist/carousel/CarouselIndicator.d.cts

@@ -0,0 +1,16 @@
+import * as React from 'react';
+import type { CarouselIndicatorProps } from './types.cjs';
+/**
+ * Slide dot button. Calls `scrollToIndex(index)` and carries `data-state`
+ * `"active"`/`"inactive"`, plus `aria-disabled="true"` on the current slide.
+ *
+ * Uses `aria-disabled` not `disabled`: the dot for the current slide stays
+ * focusable for keyboard users to count and navigate slides. Gets a default
+ * `aria-label` of `"Go to slide 3"`; consumer's `aria-label` wins.
+ *
+ * @example
+ * ```tsx
+ * <CarouselIndicator index={0} />
+ * ```
+ */
+export declare const CarouselIndicator: React.ForwardRefExoticComponent<Omit<CarouselIndicatorProps, "ref"> & React.RefAttributes<HTMLButtonElement>>;

package/dist/carousel/CarouselIndicator.d.ts

@@ -0,0 +1,16 @@
+import * as React from 'react';
+import type { CarouselIndicatorProps } from './types.js';
+/**
+ * Slide dot button. Calls `scrollToIndex(index)` and carries `data-state`
+ * `"active"`/`"inactive"`, plus `aria-disabled="true"` on the current slide.
+ *
+ * Uses `aria-disabled` not `disabled`: the dot for the current slide stays
+ * focusable for keyboard users to count and navigate slides. Gets a default
+ * `aria-label` of `"Go to slide 3"`; consumer's `aria-label` wins.
+ *
+ * @example
+ * ```tsx
+ * <CarouselIndicator index={0} />
+ * ```
+ */
+export declare const CarouselIndicator: React.ForwardRefExoticComponent<Omit<CarouselIndicatorProps, "ref"> & React.RefAttributes<HTMLButtonElement>>;

package/dist/carousel/CarouselIndicators.d.cts

@@ -0,0 +1,20 @@
+import * as React from 'react';
+import type { CarouselIndicatorsProps } from './types.cjs';
+/**
+ * Container for slide dots — `role="group"` with `data-orientation`. Group of buttons, not tabs (slides are not tabpanels).
+ *
+ * @example
+ * ```tsx
+ * function Dots() {
+ *   const { itemIds } = useCarouselContext('Dots');
+ *   return (
+ *     <CarouselIndicators aria-label="Slides">
+ *       {itemIds.map((id, index) => (
+ *         <CarouselIndicator key={id} index={index} />
+ *       ))}
+ *     </CarouselIndicators>
+ *   );
+ * }
+ * ```
+ */
+export declare const CarouselIndicators: React.ForwardRefExoticComponent<Omit<CarouselIndicatorsProps, "ref"> & React.RefAttributes<HTMLDivElement>>;

package/dist/carousel/CarouselIndicators.d.ts

@@ -0,0 +1,20 @@
+import * as React from 'react';
+import type { CarouselIndicatorsProps } from './types.js';
+/**
+ * Container for slide dots — `role="group"` with `data-orientation`. Group of buttons, not tabs (slides are not tabpanels).
+ *
+ * @example
+ * ```tsx
+ * function Dots() {
+ *   const { itemIds } = useCarouselContext('Dots');
+ *   return (
+ *     <CarouselIndicators aria-label="Slides">
+ *       {itemIds.map((id, index) => (
+ *         <CarouselIndicator key={id} index={index} />
+ *       ))}
+ *     </CarouselIndicators>
+ *   );
+ * }
+ * ```
+ */
+export declare const CarouselIndicators: React.ForwardRefExoticComponent<Omit<CarouselIndicatorsProps, "ref"> & React.RefAttributes<HTMLDivElement>>;