@stepperize/react
Advanced tools
| import t from"react";import{jsx as e}from"react/jsx-runtime";var n=t.createContext(null);function r({value:e,children:r}){return t.createElement(n.Provider,{value:e,children:r})}function i(){const e=t.useContext(n);if(!e)throw new Error("Missing Stepper.Item.");return e}function a(e){const n=t.useContext(e);if(!n)throw new Error("Missing Stepper.Root.");return n}function o(t,e,n){e?.(t),t.defaultPrevented||n()}function c(t){return function(n){const{step:r,render:i,children:o,...c}=n;if(a(t).state.current.data.id!==r)return null;const s={id:`step-panel-${r}`,"data-component":"stepper-content",role:"tabpanel","aria-labelledby":`step-${r}`,tabIndex:0,...c};return i?i(s):e("div",{...s,children:o})}}function s(n){return function(i){const{step:o,render:c,children:s,...d}=i,u=a(n),l=u.lookup.getIndex(o),p=u.state.current.index,h=l<p?"success":l===p?"active":"inactive",f=u.lookup.get(o),m=t.useMemo(()=>({data:f,index:l,status:h,metadata:{get:()=>u.metadata.get(o),set:t=>u.metadata.set(o,t),reset:t=>u.metadata.reset(t)}}),[o,f,l,h,u]),g={"data-component":"stepper-item","data-status":h,...d};return e(r,c?{value:m,children:c(g)}:{value:m,children:e("li",{...g,children:s})})}}var d=["ArrowLeft","ArrowRight","ArrowUp","ArrowDown","Home","End"];function u(n){return function(r){const{orientation:i="horizontal",render:a,children:o,onKeyDown:c,...s}=r,u=t.useContext(n),l=t.useCallback(t=>{if(c?.(t),t.defaultPrevented)return;if(!d.includes(t.key))return;const e=t.target;if("tab"!==e.getAttribute?.("role"))return;const n=u?.state.all;if(!u||!n?.length)return;const r=u.state.current.index,a="horizontal"===i,o=a&&"ArrowRight"===t.key||!a&&"ArrowDown"===t.key,s="Home"===t.key,l="End"===t.key;if(!(o||a&&"ArrowLeft"===t.key||!a&&"ArrowUp"===t.key||s||l))return;let p;if(t.preventDefault(),p=s?0:l?n.length-1:o?Math.min(r+1,n.length-1):Math.max(r-1,0),p===r)return;const h=n[p];u.navigation.goTo(h.id);const f=`step-${h.id}`;queueMicrotask(()=>document.getElementById(f)?.focus())},[u,i,c]),p={"data-component":"stepper-list","data-orientation":i,role:"tablist","aria-orientation":i,...s,onKeyDown:l};return a?a(p):e("ol",{...p,children:o})}}function l(t){return function(n){const{render:r,children:i,...c}=n,s=a(t),d={"data-component":"stepper-next",type:"button",disabled:s.state.isLast,"aria-disabled":s.state.isLast,onClick:t=>{o(t,c.onClick,()=>s.navigation.next())},...c};return r?r(d):e("button",{...d,children:i})}}function p(t){return function(n){const{render:r,children:i,...c}=n,s=a(t),d={"data-component":"stepper-prev",type:"button",disabled:s.state.isFirst,"aria-disabled":s.state.isFirst,onClick:t=>{o(t,c.onClick,()=>s.navigation.prev())},...c};return r?r(d):e("button",{...d,children:i})}}function h(n,r){function i({children:e,orientation:r,...i}){const a=t.useContext(n);if(!a)throw new Error("Missing Scoped.");return t.createElement("div",{"data-component":"stepper","data-orientation":r,role:"group","aria-label":"Stepper",...i},"function"==typeof e?e({stepper:a}):e)}return function(t){const{initialStep:n,initialMetadata:a,children:o,...c}=t;return e(r,{initialStep:n,initialMetadata:a,children:e(i,{...c,children:o})})}}function f(t){return function(n){const{render:r,children:c,...s}=n,d=a(t),u=i(),l=u.data.id,p=d.state.current.data.id===l,h=()=>d.navigation.goTo(l),f={...s,id:`step-${l}`,"data-component":"stepper-trigger","data-status":u.status,role:"tab",tabIndex:"inactive"===u.status?-1:0,"aria-controls":`step-panel-${l}`,"aria-current":p?"step":void 0,"aria-posinset":u.index+1,"aria-setsize":d.state.all.length,"aria-selected":p,onClick:t=>{o(t,s.onClick,h)}};return r?r(f):e("button",{...f,children:c})}}function m(t,n){return{Root:h(t,n),List:u(t),Item:s(t),Trigger:f(t),Title:function(t){const{render:n,children:r,...i}=t,a={"data-component":"stepper-title",...i};return n?n(a):e("h4",{...a,children:r})},Description:function(t){const{render:n,children:r,...i}=t,a={"data-component":"stepper-description",...i};return n?n(a):e("p",{...a,children:r})},Indicator:function(t){const{render:n,children:r,...a}=t,o={"data-component":"stepper-indicator","data-status":i().status,...a},c=n?n(o):r;return e("span",{"aria-hidden":!0,...o,children:c})},Separator:function(t){const{orientation:n,"data-status":r,render:i,children:a,...o}=t,c={"data-component":"stepper-separator","data-orientation":n,"data-status":r,"aria-hidden":!0,tabIndex:-1,...o};return i?i(c):e("hr",{...c})},Content:c(t),Actions:function(t){const{render:n,children:r,...i}=t,a={"data-component":"stepper-actions",...i};return n?n(a):e("div",{...a,children:r})},Prev:p(t),Next:l(t)}}export{n as StepItemContext,r as StepItemProvider,m as createStepperPrimitives,i as useStepItemContext}; |
| import { Step, Get, Metadata, Stepper, StepStatus } from '@stepperize/core'; | ||
| import * as React from 'react'; | ||
| import React__default from 'react'; | ||
| import * as react_jsx_runtime from 'react/jsx-runtime'; | ||
| type StepInfo<S extends Step = Step> = { | ||
| data: S; | ||
| status: StepStatus; | ||
| }; | ||
| /** Render function receiving DOM props. */ | ||
| type RenderProp<E extends React.ElementType = "div"> = (props: React.ComponentPropsWithoutRef<E>) => React.ReactNode; | ||
| type PrimitiveProps<E extends React.ElementType = "div"> = Omit<React.ComponentPropsWithoutRef<E>, "children"> & { | ||
| /** | ||
| * Custom render function for complete control over the rendered element. | ||
| * Receives all props including data attributes, event handlers, and ARIA attributes. | ||
| */ | ||
| render?: RenderProp<E>; | ||
| /** | ||
| * Children can be a ReactNode or a function receiving step info. | ||
| */ | ||
| children?: React.ReactNode; | ||
| }; | ||
| type RootProps<Steps extends Step[]> = Omit<React.ComponentPropsWithoutRef<"div">, "children"> & { | ||
| orientation?: "horizontal" | "vertical"; | ||
| /** Initial step (passed to Scoped internally). */ | ||
| initialStep?: Get.Id<Steps>; | ||
| /** Initial metadata (passed to Scoped internally). */ | ||
| initialMetadata?: Partial<Record<Get.Id<Steps>, Metadata>>; | ||
| children: React.ReactNode | ((props: { | ||
| stepper: Stepper<Steps>; | ||
| }) => React.ReactNode); | ||
| }; | ||
| type ListProps = PrimitiveProps<"ol"> & { | ||
| orientation?: "horizontal" | "vertical"; | ||
| }; | ||
| type ItemProps<Steps extends Step[]> = PrimitiveProps<"li"> & { | ||
| step: Get.Id<Steps>; | ||
| }; | ||
| type TriggerProps = PrimitiveProps<"button">; | ||
| type TitleProps = PrimitiveProps<"h4">; | ||
| type DescriptionProps = PrimitiveProps<"p">; | ||
| type IndicatorProps = PrimitiveProps<"span">; | ||
| type SeparatorProps = PrimitiveProps<"hr"> & { | ||
| orientation?: "horizontal" | "vertical"; | ||
| "data-status"?: StepStatus; | ||
| }; | ||
| type ContentProps<Steps extends Step[]> = PrimitiveProps<"div"> & { | ||
| step: Get.Id<Steps>; | ||
| }; | ||
| type ActionsProps = PrimitiveProps<"div">; | ||
| type PrevProps = PrimitiveProps<"button">; | ||
| type NextProps = PrimitiveProps<"button">; | ||
| declare function createActions(): (props: ActionsProps) => string | number | bigint | boolean | Iterable<React.ReactNode> | Promise<string | number | bigint | boolean | React.ReactPortal | React.ReactElement<unknown, string | React.JSXElementConstructor<any>> | Iterable<React.ReactNode> | null | undefined> | react_jsx_runtime.JSX.Element | null | undefined; | ||
| declare function createContent<Steps extends Step[]>(StepperContext: React__default.Context<Stepper<Steps> | null>): (props: ContentProps<Steps>) => string | number | bigint | boolean | Iterable<React__default.ReactNode> | Promise<string | number | bigint | boolean | React__default.ReactPortal | React__default.ReactElement<unknown, string | React__default.JSXElementConstructor<any>> | Iterable<React__default.ReactNode> | null | undefined> | react_jsx_runtime.JSX.Element | null | undefined; | ||
| declare function createDescription(): (props: DescriptionProps) => string | number | bigint | boolean | Iterable<React.ReactNode> | Promise<string | number | bigint | boolean | React.ReactPortal | React.ReactElement<unknown, string | React.JSXElementConstructor<any>> | Iterable<React.ReactNode> | null | undefined> | react_jsx_runtime.JSX.Element | null | undefined; | ||
| declare function createIndicator(): (props: IndicatorProps) => react_jsx_runtime.JSX.Element; | ||
| declare function createItem<Steps extends Step[]>(StepperContext: React__default.Context<Stepper<Steps> | null>): (props: ItemProps<Steps>) => react_jsx_runtime.JSX.Element; | ||
| declare function createList<Steps extends Step[]>(StepperContext: React__default.Context<Stepper<Steps> | null>): (props: ListProps) => string | number | bigint | boolean | Iterable<React__default.ReactNode> | Promise<string | number | bigint | boolean | React__default.ReactPortal | React__default.ReactElement<unknown, string | React__default.JSXElementConstructor<any>> | Iterable<React__default.ReactNode> | null | undefined> | react_jsx_runtime.JSX.Element | null | undefined; | ||
| declare function createNext<Steps extends Step[]>(StepperContext: React__default.Context<Stepper<Steps> | null>): (props: NextProps) => string | number | bigint | boolean | Iterable<React__default.ReactNode> | Promise<string | number | bigint | boolean | React__default.ReactPortal | React__default.ReactElement<unknown, string | React__default.JSXElementConstructor<any>> | Iterable<React__default.ReactNode> | null | undefined> | react_jsx_runtime.JSX.Element | null | undefined; | ||
| declare function createPrev<Steps extends Step[]>(StepperContext: React__default.Context<Stepper<Steps> | null>): (props: PrevProps) => string | number | bigint | boolean | Iterable<React__default.ReactNode> | Promise<string | number | bigint | boolean | React__default.ReactPortal | React__default.ReactElement<unknown, string | React__default.JSXElementConstructor<any>> | Iterable<React__default.ReactNode> | null | undefined> | react_jsx_runtime.JSX.Element | null | undefined; | ||
| type ScopedProviderProps$1<Steps extends Step[]> = React__default.PropsWithChildren<{ | ||
| initialStep?: RootProps<Steps>["initialStep"]; | ||
| initialMetadata?: RootProps<Steps>["initialMetadata"]; | ||
| }>; | ||
| declare function createRoot<Steps extends Step[]>(StepperContext: React__default.Context<Stepper<Steps> | null>, ScopedProvider: (props: ScopedProviderProps$1<Steps>) => React__default.ReactElement): (props: RootProps<Steps>) => react_jsx_runtime.JSX.Element; | ||
| declare function createSeparator(): (props: SeparatorProps) => string | number | bigint | boolean | Iterable<React.ReactNode> | Promise<string | number | bigint | boolean | React.ReactPortal | React.ReactElement<unknown, string | React.JSXElementConstructor<any>> | Iterable<React.ReactNode> | null | undefined> | react_jsx_runtime.JSX.Element | null | undefined; | ||
| declare function createTitle(): (props: TitleProps) => string | number | bigint | boolean | Iterable<React.ReactNode> | Promise<string | number | bigint | boolean | React.ReactPortal | React.ReactElement<unknown, string | React.JSXElementConstructor<any>> | Iterable<React.ReactNode> | null | undefined> | react_jsx_runtime.JSX.Element | null | undefined; | ||
| declare function createTrigger<Steps extends Step[]>(StepperContext: React__default.Context<Stepper<Steps> | null>): (props: TriggerProps) => string | number | bigint | boolean | Iterable<React__default.ReactNode> | Promise<string | number | bigint | boolean | React__default.ReactPortal | React__default.ReactElement<unknown, string | React__default.JSXElementConstructor<any>> | Iterable<React__default.ReactNode> | null | undefined> | react_jsx_runtime.JSX.Element | null | undefined; | ||
| type StepperPrimitives<Steps extends Step[]> = { | ||
| Root: ReturnType<typeof createRoot<Steps>>; | ||
| List: ReturnType<typeof createList>; | ||
| Item: ReturnType<typeof createItem<Steps>>; | ||
| Trigger: ReturnType<typeof createTrigger<Steps>>; | ||
| Title: ReturnType<typeof createTitle>; | ||
| Description: ReturnType<typeof createDescription>; | ||
| Indicator: ReturnType<typeof createIndicator>; | ||
| Separator: ReturnType<typeof createSeparator>; | ||
| Content: ReturnType<typeof createContent<Steps>>; | ||
| Actions: ReturnType<typeof createActions>; | ||
| Prev: ReturnType<typeof createPrev<Steps>>; | ||
| Next: ReturnType<typeof createNext<Steps>>; | ||
| }; | ||
| type ScopedProviderProps<Steps extends Step[]> = React__default.PropsWithChildren<{ | ||
| initialStep?: Get.Id<Steps>; | ||
| initialMetadata?: Partial<Record<Get.Id<Steps>, Metadata>>; | ||
| }>; | ||
| declare function createStepperPrimitives<Steps extends Step[]>(StepperContext: React__default.Context<Stepper<Steps> | null>, ScopedProvider: (props: ScopedProviderProps<Steps>) => React__default.ReactElement): StepperPrimitives<Steps>; | ||
| export { type ActionsProps as A, type ContentProps as C, type DescriptionProps as D, type IndicatorProps as I, type ListProps as L, type NextProps as N, type PrevProps as P, type RenderProp as R, type StepperPrimitives as S, type TitleProps as T, type ItemProps as a, type PrimitiveProps as b, createStepperPrimitives as c, type RootProps as d, type SeparatorProps as e, type StepInfo as f, type TriggerProps as g }; |
+3
-2
| import { Step, Get, Metadata, Stepper, StepStatus } from '@stepperize/core'; | ||
| export { Get, Step, Stepper } from '@stepperize/core'; | ||
| import { S as StepperPrimitives } from './create-stepper-primitives-CQmDVcLk.js'; | ||
| export { Get, Step, Stepper, TransitionPayload } from '@stepperize/core'; | ||
| import { S as StepperPrimitives } from './create-stepper-primitives-CEvrveWE.js'; | ||
| import 'react'; | ||
| import 'react/jsx-runtime'; | ||
@@ -6,0 +7,0 @@ type TransitionDirection = "next" | "prev" | "goTo"; |
+1
-1
@@ -1,1 +0,1 @@ | ||
| import{createStepperPrimitives as t}from"./chunk-BNHWNMYQ.js";import{getInitialStepIndex as e,getInitialMetadata as r,generateCommonStepperUseFns as n,generateStepperUtils as i,updateStepIndex as a}from"@stepperize/core";import*as o from"react";function s(t,e){return t.reduce((t,r,n)=>(t[r.id]=n<e?"success":n===e?"active":"inactive",t),{})}var u=(...u)=>{const c=o.createContext(null),l=t=>{const{initialStep:c,initialMetadata:l}=t??{},d=o.useMemo(()=>e(u,c),[c]),[f,p]=o.useState(d),[v,m]=o.useState(()=>r(u,l)),[S,g]=o.useState(!1),x=o.useRef(void 0),h=o.useRef(void 0),w=o.useCallback(async(t,e,r)=>{g(!0);try{const n=u[t],i={from:n,to:u[e],metadata:v,statuses:s(u,t),direction:r,fromIndex:t,toIndex:e};if(!1===await(x.current?.(i)))return;p(e);const a={...i,statuses:s(u,e)};await(h.current?.(a))}finally{g(!1)}},[v]);return o.useMemo(()=>{const t=u[f],o=f===u.length-1;return{state:{all:u,current:{data:t,index:f,status:"active",metadata:{get:()=>v[t.id],set:e=>{m(r=>r[t.id]===e?r:{...r,[t.id]:e})},reset:t=>{m(r(u,t?l:void 0))}}},isLast:o,isFirst:0===f,isTransitioning:S},navigation:{next:()=>{const t=f+1;if(null!=x.current||null!=h.current){if(t>=u.length)return;return w(f,t,"next")}a(u,t,p)},prev:()=>{const t=f-1;if(null!=x.current||null!=h.current){if(t<0)return;return w(f,t,"prev")}a(u,t,p)},goTo:t=>{const e=u.findIndex(e=>e.id===t);if(-1===e)throw new Error(`Step with id "${t}" not found.`);if(e!==f)return null!=x.current||null!=h.current?w(f,e,"goTo"):void p(e)},reset:()=>{a(u,e(u,c),p)}},lookup:i(...u),flow:n(u,t,f),metadata:{get values(){return v},set:(t,e)=>{m(r=>r[t]===e?r:{...r,[t]:e})},get:t=>v[t],reset:t=>{m(r(u,t?l:void 0))}},lifecycle:{onBeforeTransition(t){x.current=t},onAfterTransition(t){h.current=t}}}},[f,v,S,w])},d=({initialStep:t,initialMetadata:e,children:r})=>o.createElement(c.Provider,{value:l({initialStep:t,initialMetadata:e})},r),f=t(c,d);return{steps:u,Scoped:d,useStepper:(t={})=>o.useContext(c)??l(t),Stepper:f}};export{u as defineStepper}; | ||
| import{createStepperPrimitives as t}from"./chunk-LDF5ORJX.js";import{getInitialStepIndex as e,getInitialMetadata as a,generateCommonStepperUseFns as n,generateStepperUtils as r,updateStepIndex as i}from"@stepperize/core";import o from"react";function s(t,e){return t.reduce((t,a,n)=>(t[a.id]=n<e?"success":n===e?"active":"inactive",t),{})}function u(t,e){return t.push(e),()=>{const a=t.indexOf(e);-1!==a&&t.splice(a,1)}}var c=(...c)=>{const d=o.createContext(null),l=t=>{const{initialStep:d,initialMetadata:l}=t??{},f=o.useMemo(()=>e(c,d),[d]),[p,m]=o.useState(f),[v,g]=o.useState(()=>a(c,l)),[x,S]=o.useState(!1),h=o.useCallback(t=>a(c,t?l:void 0),[l]),w=o.useRef([]),M=o.useRef([]),T=o.useCallback(async(t,e,a,n)=>{S(!0);try{const r={from:c[t],to:c[e],metadata:{...v,...n?.metadata??{}},statuses:s(c,t),direction:a,fromIndex:t,toIndex:e};for(const t of w.current)if(!1===await t(r))return;n?.metadata&&g(t=>({...t,...n.metadata})),m(e);const i={...r,statuses:s(c,e)};for(const t of M.current)await t(i)}finally{S(!1)}},[v]);return o.useMemo(()=>{const t=c[p],a=()=>w.current.length>0||M.current.length>0;return{state:{all:c,current:{data:t,index:p,status:"active",metadata:{get:()=>v[t.id],set:e=>{g(a=>a[t.id]===e?a:{...a,[t.id]:e})},reset:t=>{g(h(t))}}},isLast:p===c.length-1,isFirst:0===p,isTransitioning:x},navigation:{next:t=>{const e=p+1;if(!(e>=c.length))return a()||t?.metadata?T(p,e,"next",t):void i(c,e,m);i(c,e,m)},prev:t=>{const e=p-1;if(!(e<0))return a()||t?.metadata?T(p,e,"prev",t):void i(c,e,m);i(c,e,m)},goTo:(t,e)=>{const n=c.findIndex(e=>e.id===t);if(-1===n)throw new Error(`Step "${t}" not found.`);if(n!==p)return a()||e?.metadata?T(p,n,"goTo",e):void m(n)},reset:()=>{i(c,e(c,d),m)}},lookup:r(...c),flow:n(c,t,p),metadata:{get values(){return v},set:(t,e)=>{g(a=>a[t]===e?a:{...a,[t]:e})},get:t=>v[t],reset:t=>{g(h(t))}},lifecycle:{onBeforeTransition:t=>u(w.current,t),onAfterTransition:t=>u(M.current,t)}}},[p,v,x,d,T,h])},f=({initialStep:t,initialMetadata:e,children:a})=>o.createElement(d.Provider,{value:l({initialStep:t,initialMetadata:e})},a),p=t(d,f);return{steps:c,Scoped:f,useStepper:(t={})=>{const e=o.useContext(d),a=l(t);return e??a},Stepper:p}};export{c as defineStepper}; |
| import * as _stepperize_core from '@stepperize/core'; | ||
| import { Step, StepperState } from '@stepperize/core'; | ||
| export { StepStatus } from '@stepperize/core'; | ||
| import * as React from 'react'; | ||
| export { A as ActionsProps, C as ContentProps, D as DescriptionProps, d as IndicatorProps, I as ItemProps, L as ListProps, N as NextProps, f as PrevProps, P as PrimitiveProps, R as RenderProp, b as RootProps, e as SeparatorProps, a as StepInfo, S as StepperPrimitives, c as TitleProps, T as TriggerProps, g as createStepperPrimitives } from '../create-stepper-primitives-CQmDVcLk.js'; | ||
| import React__default from 'react'; | ||
| export { A as ActionsProps, C as ContentProps, D as DescriptionProps, I as IndicatorProps, a as ItemProps, L as ListProps, N as NextProps, P as PrevProps, b as PrimitiveProps, R as RenderProp, d as RootProps, e as SeparatorProps, f as StepInfo, S as StepperPrimitives, T as TitleProps, g as TriggerProps, c as createStepperPrimitives } from '../create-stepper-primitives-CEvrveWE.js'; | ||
| import 'react/jsx-runtime'; | ||
@@ -12,6 +13,4 @@ /** | ||
| type StepItemValue<S extends Step = Step> = StepperState<[S]>["current"]; | ||
| declare const StepItemContext: React.Context<{ | ||
| data: { | ||
| id: string; | ||
| }; | ||
| declare const StepItemContext: React__default.Context<{ | ||
| data: Step; | ||
| index: number; | ||
@@ -27,7 +26,5 @@ status: _stepperize_core.StepStatus; | ||
| value: StepItemValue<S>; | ||
| children: React.ReactNode; | ||
| }): React.FunctionComponentElement<React.ProviderProps<{ | ||
| data: { | ||
| id: string; | ||
| }; | ||
| children: React__default.ReactNode; | ||
| }): React__default.FunctionComponentElement<React__default.ProviderProps<{ | ||
| data: Step; | ||
| index: number; | ||
@@ -34,0 +31,0 @@ status: _stepperize_core.StepStatus; |
@@ -1,1 +0,1 @@ | ||
| export{StepItemContext,StepItemProvider,createStepperPrimitives,useStepItemContext}from"../chunk-BNHWNMYQ.js"; | ||
| export{StepItemContext,StepItemProvider,createStepperPrimitives,useStepItemContext}from"../chunk-LDF5ORJX.js"; |
+6
-6
| { | ||
| "name": "@stepperize/react", | ||
| "version": "6.0.1", | ||
| "version": "6.1.0", | ||
| "private": false, | ||
@@ -35,3 +35,3 @@ "publishConfig": { | ||
| "dependencies": { | ||
| "@stepperize/core": "2.0.0" | ||
| "@stepperize/core": "2.1.0" | ||
| }, | ||
@@ -44,9 +44,9 @@ "peerDependencies": { | ||
| "@testing-library/react": "^16.3.2", | ||
| "@types/react": "^19.2.8", | ||
| "jsdom": "^27.4.0", | ||
| "react": "^19.2.3", | ||
| "@types/react": "^19.2.14", | ||
| "jsdom": "^28.1.0", | ||
| "react": "^19.2.4", | ||
| "terser": "^5.46.0", | ||
| "tsup": "^8.5.1", | ||
| "typescript": "^5.9.3", | ||
| "vitest": "^4.0.17" | ||
| "vitest": "^4.0.18" | ||
| }, | ||
@@ -53,0 +53,0 @@ "scripts": { |
| import*as t from"react";var e=t.createContext(null);function n({value:n,children:r}){return t.createElement(e.Provider,{value:n,children:r})}function r(){const n=t.useContext(e);if(!n)throw new Error("useStepItemContext must be used within a Stepper.Item.");return n}function a(e,n){function r({children:n,orientation:r,...a}){const o=t.useContext(e);if(!o)throw new Error("Stepper.Root must be used within Scoped.");return t.createElement("div",{"data-component":"stepper","data-orientation":r,role:"group","aria-label":"Stepper",...a},"function"==typeof n?n({stepper:o}):n)}return function(e){const{initialStep:a,initialMetadata:o,children:i,...s}=e;return t.createElement(n,{initialStep:a,initialMetadata:o,children:t.createElement(r,{...s,children:i})})}}var o=["ArrowLeft","ArrowRight","ArrowUp","ArrowDown","Home","End"];function i(e){return function(n){const{orientation:r="horizontal",render:a,children:i,onKeyDown:s,...c}=n,u=t.useContext(e),d=t.useCallback(t=>{if(s?.(t),!o.includes(t.key))return;const e=t.target;if("tab"!==e.getAttribute?.("role"))return;const n=u?.state.all;if(!u||!n?.length)return;const a=u.state.current.index,i="horizontal"===r,c=i&&"ArrowRight"===t.key||!i&&"ArrowDown"===t.key,d=i&&"ArrowLeft"===t.key||!i&&"ArrowUp"===t.key,p="Home"===t.key,l="End"===t.key;if(!(c||d||p||l))return;let m;if(t.preventDefault(),m=p?0:l?n.length-1:c?Math.min(a+1,n.length-1):Math.max(a-1,0),m===a)return;const h=n[m];u.navigation.goTo(h.id);const f=`step-${h.id}`;queueMicrotask(()=>document.getElementById(f)?.focus())},[u,r,s]),p={"data-component":"stepper-list","data-orientation":r,role:"tablist","aria-orientation":r,...c,onKeyDown:d};return a?a(p):t.createElement("ol",p,i)}}function s(e){return function(r){const{step:a,render:o,children:i,...s}=r,c=t.useContext(e);if(!c)throw new Error("Stepper.Item must be used within Stepper.Root.");const u=c.lookup.getIndex(a),d=c.state.current.index,p=u<d?"success":u===d?"active":"inactive",l=c.lookup.get(a),m=t.useMemo(()=>({data:l,index:u,status:p,metadata:{get:()=>c.metadata.get(a),set:t=>c.metadata.set(a,t),reset:t=>c.metadata.reset(t)}}),[a,l,u,p,c]),h={"data-component":"stepper-item","data-status":p,...s};return o?t.createElement(n,{value:m,children:o(h)}):t.createElement(n,{value:m,children:t.createElement("li",h,i)})}}function c(e){return function(n){const{render:a,children:o,...i}=n,s=t.useContext(e),c=r();if(!s)throw new Error("Stepper.Trigger must be used within Stepper.Root.");const u=c.data.id,d=s.state.current.data.id===u,p=s.state.all.findIndex(t=>t.id===u),l={...i,id:`step-${u}`,"data-component":"stepper-trigger","data-status":c.status,role:"tab",tabIndex:"inactive"===c.status?-1:0,"aria-controls":`step-panel-${u}`,"aria-current":d?"step":void 0,"aria-posinset":p+1,"aria-setsize":s.state.all.length,"aria-selected":!!d,onClick:t=>{s.navigation.goTo(u),i.onClick?.(t)}};return a?a(l):t.createElement("button",{type:"button",...l},o)}}function u(e){return function(n){const{step:r,render:a,children:o,...i}=n,s=t.useContext(e);if(!s)throw new Error("Stepper.Content must be used within Stepper.Root.");if(!(s.state.current.data.id===r))return null;const c={id:`step-panel-${r}`,"data-component":"stepper-content",role:"tabpanel","aria-labelledby":`step-${r}`,"aria-hidden":!1,tabIndex:0,...i};return a?a(c):t.createElement("div",c,o)}}function d(e){return function(n){const{render:r,children:a,...o}=n,i=t.useContext(e);if(!i)throw new Error("Stepper.Prev must be used within Stepper.Root.");const s={"data-component":"stepper-prev",type:"button",disabled:i.state.isFirst,"aria-disabled":i.state.isFirst,onClick:t=>{i.navigation.prev(),o.onClick?.(t)},...o};return r?r(s):t.createElement("button",s,a)}}function p(e){return function(n){const{render:r,children:a,...o}=n,i=t.useContext(e);if(!i)throw new Error("Stepper.Next must be used within Stepper.Root.");const s={"data-component":"stepper-next",type:"button",disabled:i.state.isLast,"aria-disabled":i.state.isLast,onClick:t=>{i.navigation.next(),o.onClick?.(t)},...o};return r?r(s):t.createElement("button",s,a)}}function l(e,n){return{Root:a(e,n),List:i(e),Item:s(e),Trigger:c(e),Title:function(e){const{render:n,children:r,...a}=e,o={"data-component":"stepper-title",...a};return n?n(o):t.createElement("h4",o,r)},Description:function(e){const{render:n,children:r,...a}=e,o={"data-component":"stepper-description",...a};return n?n(o):t.createElement("p",o,r)},Indicator:function(e){const{render:n,children:a,...o}=e,i={"data-component":"stepper-indicator","data-status":r().status,...o},s=n?n(i):a;return t.createElement("span",{"aria-hidden":!0,...i},s)},Separator:function(e){const{orientation:n,"data-status":r,render:a,children:o,...i}=e,s={"data-component":"stepper-separator","data-orientation":n,"data-status":r,"aria-hidden":!0,tabIndex:-1,...i};return a?a(s):t.createElement("hr",s,o)},Content:u(e),Actions:function(e){const{render:n,children:r,...a}=e,o={"data-component":"stepper-actions",...a};return n?n(o):t.createElement("div",o,r)},Prev:d(e),Next:p(e)}}export{e as StepItemContext,n as StepItemProvider,l as createStepperPrimitives,r as useStepItemContext}; |
| import * as React from 'react'; | ||
| import * as _stepperize_core from '@stepperize/core'; | ||
| import { Step, Get, Metadata, Stepper, StepStatus } from '@stepperize/core'; | ||
| type StepInfo<S extends Step = Step> = { | ||
| data: S; | ||
| status: StepStatus; | ||
| }; | ||
| /** Render function receiving DOM props. */ | ||
| type RenderProp<E extends React.ElementType = "div"> = (props: React.ComponentPropsWithoutRef<E>) => React.ReactNode; | ||
| type PrimitiveProps<E extends React.ElementType = "div"> = Omit<React.ComponentPropsWithoutRef<E>, "children"> & { | ||
| /** | ||
| * Custom render function for complete control over the rendered element. | ||
| * Receives all props including data attributes, event handlers, and ARIA attributes. | ||
| */ | ||
| render?: RenderProp<E>; | ||
| /** | ||
| * Children can be a ReactNode or a function receiving step info. | ||
| */ | ||
| children?: React.ReactNode; | ||
| }; | ||
| type RootProps<Steps extends Step[]> = Omit<React.ComponentPropsWithoutRef<"div">, "children"> & { | ||
| orientation?: "horizontal" | "vertical"; | ||
| /** Initial step (passed to Scoped internally). */ | ||
| initialStep?: Get.Id<Steps>; | ||
| /** Initial metadata (passed to Scoped internally). */ | ||
| initialMetadata?: Partial<Record<Get.Id<Steps>, Metadata>>; | ||
| children: React.ReactNode | ((props: { | ||
| stepper: Stepper<Steps>; | ||
| }) => React.ReactNode); | ||
| }; | ||
| type ListProps = PrimitiveProps<"ol"> & { | ||
| orientation?: "horizontal" | "vertical"; | ||
| }; | ||
| type ItemProps<Steps extends Step[]> = PrimitiveProps<"li"> & { | ||
| step: Get.Id<Steps>; | ||
| }; | ||
| type TriggerProps = PrimitiveProps<"button">; | ||
| type TitleProps = PrimitiveProps<"h4">; | ||
| type DescriptionProps = PrimitiveProps<"p">; | ||
| type IndicatorProps = PrimitiveProps<"span">; | ||
| type SeparatorProps = PrimitiveProps<"hr"> & { | ||
| orientation?: "horizontal" | "vertical"; | ||
| "data-status"?: StepStatus; | ||
| }; | ||
| type ContentProps<Steps extends Step[]> = PrimitiveProps<"div"> & { | ||
| step: Get.Id<Steps>; | ||
| }; | ||
| type ActionsProps = PrimitiveProps<"div">; | ||
| type PrevProps = PrimitiveProps<"button">; | ||
| type NextProps = PrimitiveProps<"button">; | ||
| type ScopedProviderProps$1<Steps extends Step[]> = React.PropsWithChildren<{ | ||
| initialStep?: RootProps<Steps>["initialStep"]; | ||
| initialMetadata?: RootProps<Steps>["initialMetadata"]; | ||
| }>; | ||
| declare function createRoot<Steps extends Step[]>(StepperContext: React.Context<Stepper<Steps> | null>, ScopedProvider: (props: ScopedProviderProps$1<Steps>) => React.ReactElement): (props: RootProps<Steps>) => React.FunctionComponentElement<ScopedProviderProps$1<Steps>>; | ||
| declare function createList<Steps extends Step[]>(StepperContext: React.Context<Stepper<Steps> | null>): (props: ListProps) => React.ReactNode; | ||
| declare function createItem<Steps extends Step[]>(StepperContext: React.Context<Stepper<Steps> | null>): (props: ItemProps<Steps>) => React.FunctionComponentElement<{ | ||
| value: { | ||
| data: { | ||
| id: string; | ||
| }; | ||
| index: number; | ||
| status: StepStatus; | ||
| metadata: { | ||
| get: <M extends Metadata>() => M; | ||
| set: <M extends Metadata>(values: M) => void; | ||
| reset: (keepInitialMetadata?: boolean) => void; | ||
| }; | ||
| }; | ||
| children: React.ReactNode; | ||
| }>; | ||
| declare function createTrigger<Steps extends Step[]>(StepperContext: React.Context<Stepper<Steps> | null>): (props: TriggerProps) => React.ReactNode; | ||
| declare function createTitle(): (props: TitleProps) => React.ReactNode; | ||
| declare function createDescription<Steps extends Step[]>(): (props: DescriptionProps) => React.ReactNode; | ||
| declare function createIndicator<Steps extends Step[]>(): (props: IndicatorProps) => React.DetailedReactHTMLElement<{ | ||
| slot?: string | undefined | undefined; | ||
| style?: React.CSSProperties | undefined; | ||
| title?: string | undefined | undefined; | ||
| key?: React.Key | null | undefined; | ||
| defaultChecked?: boolean | undefined | undefined; | ||
| defaultValue?: string | number | readonly string[] | undefined; | ||
| suppressContentEditableWarning?: boolean | undefined | undefined; | ||
| suppressHydrationWarning?: boolean | undefined | undefined; | ||
| accessKey?: string | undefined | undefined; | ||
| autoCapitalize?: "off" | "none" | "on" | "sentences" | "words" | "characters" | undefined | (string & {}) | undefined; | ||
| autoFocus?: boolean | undefined | undefined; | ||
| className?: string | undefined | undefined; | ||
| contentEditable?: (boolean | "true" | "false") | "inherit" | "plaintext-only" | undefined; | ||
| contextMenu?: string | undefined | undefined; | ||
| dir?: string | undefined | undefined; | ||
| draggable?: (boolean | "true" | "false") | undefined; | ||
| enterKeyHint?: "enter" | "done" | "go" | "next" | "previous" | "search" | "send" | undefined | undefined; | ||
| hidden?: boolean | undefined | undefined; | ||
| id?: string | undefined | undefined; | ||
| lang?: string | undefined | undefined; | ||
| nonce?: string | undefined | undefined; | ||
| spellCheck?: (boolean | "true" | "false") | undefined; | ||
| tabIndex?: number | undefined | undefined; | ||
| translate?: "yes" | "no" | undefined | undefined; | ||
| radioGroup?: string | undefined | undefined; | ||
| role?: React.AriaRole | undefined; | ||
| about?: string | undefined | undefined; | ||
| content?: string | undefined | undefined; | ||
| datatype?: string | undefined | undefined; | ||
| inlist?: any; | ||
| prefix?: string | undefined | undefined; | ||
| property?: string | undefined | undefined; | ||
| rel?: string | undefined | undefined; | ||
| resource?: string | undefined | undefined; | ||
| rev?: string | undefined | undefined; | ||
| typeof?: string | undefined | undefined; | ||
| vocab?: string | undefined | undefined; | ||
| autoCorrect?: string | undefined | undefined; | ||
| autoSave?: string | undefined | undefined; | ||
| color?: string | undefined | undefined; | ||
| itemProp?: string | undefined | undefined; | ||
| itemScope?: boolean | undefined | undefined; | ||
| itemType?: string | undefined | undefined; | ||
| itemID?: string | undefined | undefined; | ||
| itemRef?: string | undefined | undefined; | ||
| results?: number | undefined | undefined; | ||
| security?: string | undefined | undefined; | ||
| unselectable?: "on" | "off" | undefined | undefined; | ||
| popover?: "" | "auto" | "manual" | "hint" | undefined | undefined; | ||
| popoverTargetAction?: "toggle" | "show" | "hide" | undefined | undefined; | ||
| popoverTarget?: string | undefined | undefined; | ||
| inert?: boolean | undefined | undefined; | ||
| inputMode?: "none" | "text" | "tel" | "url" | "email" | "numeric" | "decimal" | "search" | undefined | undefined; | ||
| is?: string | undefined | undefined; | ||
| exportparts?: string | undefined | undefined; | ||
| part?: string | undefined | undefined; | ||
| "aria-activedescendant"?: string | undefined | undefined; | ||
| "aria-atomic"?: (boolean | "true" | "false") | undefined; | ||
| "aria-autocomplete"?: "none" | "inline" | "list" | "both" | undefined | undefined; | ||
| "aria-braillelabel"?: string | undefined | undefined; | ||
| "aria-brailleroledescription"?: string | undefined | undefined; | ||
| "aria-busy"?: (boolean | "true" | "false") | undefined; | ||
| "aria-checked"?: boolean | "false" | "mixed" | "true" | undefined | undefined; | ||
| "aria-colcount"?: number | undefined | undefined; | ||
| "aria-colindex"?: number | undefined | undefined; | ||
| "aria-colindextext"?: string | undefined | undefined; | ||
| "aria-colspan"?: number | undefined | undefined; | ||
| "aria-controls"?: string | undefined | undefined; | ||
| "aria-current"?: boolean | "false" | "true" | "page" | "step" | "location" | "date" | "time" | undefined | undefined; | ||
| "aria-describedby"?: string | undefined | undefined; | ||
| "aria-description"?: string | undefined | undefined; | ||
| "aria-details"?: string | undefined | undefined; | ||
| "aria-disabled"?: (boolean | "true" | "false") | undefined; | ||
| "aria-dropeffect"?: "none" | "copy" | "execute" | "link" | "move" | "popup" | undefined | undefined; | ||
| "aria-errormessage"?: string | undefined | undefined; | ||
| "aria-expanded"?: (boolean | "true" | "false") | undefined; | ||
| "aria-flowto"?: string | undefined | undefined; | ||
| "aria-grabbed"?: (boolean | "true" | "false") | undefined; | ||
| "aria-haspopup"?: boolean | "false" | "true" | "menu" | "listbox" | "tree" | "grid" | "dialog" | undefined | undefined; | ||
| "aria-hidden": boolean | "true" | "false"; | ||
| "aria-invalid"?: boolean | "false" | "true" | "grammar" | "spelling" | undefined | undefined; | ||
| "aria-keyshortcuts"?: string | undefined | undefined; | ||
| "aria-label"?: string | undefined | undefined; | ||
| "aria-labelledby"?: string | undefined | undefined; | ||
| "aria-level"?: number | undefined | undefined; | ||
| "aria-live"?: "off" | "assertive" | "polite" | undefined | undefined; | ||
| "aria-modal"?: (boolean | "true" | "false") | undefined; | ||
| "aria-multiline"?: (boolean | "true" | "false") | undefined; | ||
| "aria-multiselectable"?: (boolean | "true" | "false") | undefined; | ||
| "aria-orientation"?: "horizontal" | "vertical" | undefined | undefined; | ||
| "aria-owns"?: string | undefined | undefined; | ||
| "aria-placeholder"?: string | undefined | undefined; | ||
| "aria-posinset"?: number | undefined | undefined; | ||
| "aria-pressed"?: boolean | "false" | "mixed" | "true" | undefined | undefined; | ||
| "aria-readonly"?: (boolean | "true" | "false") | undefined; | ||
| "aria-relevant"?: "additions" | "additions removals" | "additions text" | "all" | "removals" | "removals additions" | "removals text" | "text" | "text additions" | "text removals" | undefined | undefined; | ||
| "aria-required"?: (boolean | "true" | "false") | undefined; | ||
| "aria-roledescription"?: string | undefined | undefined; | ||
| "aria-rowcount"?: number | undefined | undefined; | ||
| "aria-rowindex"?: number | undefined | undefined; | ||
| "aria-rowindextext"?: string | undefined | undefined; | ||
| "aria-rowspan"?: number | undefined | undefined; | ||
| "aria-selected"?: (boolean | "true" | "false") | undefined; | ||
| "aria-setsize"?: number | undefined | undefined; | ||
| "aria-sort"?: "none" | "ascending" | "descending" | "other" | undefined | undefined; | ||
| "aria-valuemax"?: number | undefined | undefined; | ||
| "aria-valuemin"?: number | undefined | undefined; | ||
| "aria-valuenow"?: number | undefined | undefined; | ||
| "aria-valuetext"?: string | undefined | undefined; | ||
| dangerouslySetInnerHTML?: { | ||
| __html: string | TrustedHTML; | ||
| } | undefined | undefined; | ||
| onCopy?: React.ClipboardEventHandler<HTMLSpanElement> | undefined; | ||
| onCopyCapture?: React.ClipboardEventHandler<HTMLSpanElement> | undefined; | ||
| onCut?: React.ClipboardEventHandler<HTMLSpanElement> | undefined; | ||
| onCutCapture?: React.ClipboardEventHandler<HTMLSpanElement> | undefined; | ||
| onPaste?: React.ClipboardEventHandler<HTMLSpanElement> | undefined; | ||
| onPasteCapture?: React.ClipboardEventHandler<HTMLSpanElement> | undefined; | ||
| onCompositionEnd?: React.CompositionEventHandler<HTMLSpanElement> | undefined; | ||
| onCompositionEndCapture?: React.CompositionEventHandler<HTMLSpanElement> | undefined; | ||
| onCompositionStart?: React.CompositionEventHandler<HTMLSpanElement> | undefined; | ||
| onCompositionStartCapture?: React.CompositionEventHandler<HTMLSpanElement> | undefined; | ||
| onCompositionUpdate?: React.CompositionEventHandler<HTMLSpanElement> | undefined; | ||
| onCompositionUpdateCapture?: React.CompositionEventHandler<HTMLSpanElement> | undefined; | ||
| onFocus?: React.FocusEventHandler<HTMLSpanElement> | undefined; | ||
| onFocusCapture?: React.FocusEventHandler<HTMLSpanElement> | undefined; | ||
| onBlur?: React.FocusEventHandler<HTMLSpanElement> | undefined; | ||
| onBlurCapture?: React.FocusEventHandler<HTMLSpanElement> | undefined; | ||
| onChange?: React.FormEventHandler<HTMLSpanElement> | undefined; | ||
| onChangeCapture?: React.FormEventHandler<HTMLSpanElement> | undefined; | ||
| onBeforeInput?: React.InputEventHandler<HTMLSpanElement> | undefined; | ||
| onBeforeInputCapture?: React.FormEventHandler<HTMLSpanElement> | undefined; | ||
| onInput?: React.FormEventHandler<HTMLSpanElement> | undefined; | ||
| onInputCapture?: React.FormEventHandler<HTMLSpanElement> | undefined; | ||
| onReset?: React.FormEventHandler<HTMLSpanElement> | undefined; | ||
| onResetCapture?: React.FormEventHandler<HTMLSpanElement> | undefined; | ||
| onSubmit?: React.FormEventHandler<HTMLSpanElement> | undefined; | ||
| onSubmitCapture?: React.FormEventHandler<HTMLSpanElement> | undefined; | ||
| onInvalid?: React.FormEventHandler<HTMLSpanElement> | undefined; | ||
| onInvalidCapture?: React.FormEventHandler<HTMLSpanElement> | undefined; | ||
| onLoad?: React.ReactEventHandler<HTMLSpanElement> | undefined; | ||
| onLoadCapture?: React.ReactEventHandler<HTMLSpanElement> | undefined; | ||
| onError?: React.ReactEventHandler<HTMLSpanElement> | undefined; | ||
| onErrorCapture?: React.ReactEventHandler<HTMLSpanElement> | undefined; | ||
| onKeyDown?: React.KeyboardEventHandler<HTMLSpanElement> | undefined; | ||
| onKeyDownCapture?: React.KeyboardEventHandler<HTMLSpanElement> | undefined; | ||
| onKeyPress?: React.KeyboardEventHandler<HTMLSpanElement> | undefined; | ||
| onKeyPressCapture?: React.KeyboardEventHandler<HTMLSpanElement> | undefined; | ||
| onKeyUp?: React.KeyboardEventHandler<HTMLSpanElement> | undefined; | ||
| onKeyUpCapture?: React.KeyboardEventHandler<HTMLSpanElement> | undefined; | ||
| onAbort?: React.ReactEventHandler<HTMLSpanElement> | undefined; | ||
| onAbortCapture?: React.ReactEventHandler<HTMLSpanElement> | undefined; | ||
| onCanPlay?: React.ReactEventHandler<HTMLSpanElement> | undefined; | ||
| onCanPlayCapture?: React.ReactEventHandler<HTMLSpanElement> | undefined; | ||
| onCanPlayThrough?: React.ReactEventHandler<HTMLSpanElement> | undefined; | ||
| onCanPlayThroughCapture?: React.ReactEventHandler<HTMLSpanElement> | undefined; | ||
| onDurationChange?: React.ReactEventHandler<HTMLSpanElement> | undefined; | ||
| onDurationChangeCapture?: React.ReactEventHandler<HTMLSpanElement> | undefined; | ||
| onEmptied?: React.ReactEventHandler<HTMLSpanElement> | undefined; | ||
| onEmptiedCapture?: React.ReactEventHandler<HTMLSpanElement> | undefined; | ||
| onEncrypted?: React.ReactEventHandler<HTMLSpanElement> | undefined; | ||
| onEncryptedCapture?: React.ReactEventHandler<HTMLSpanElement> | undefined; | ||
| onEnded?: React.ReactEventHandler<HTMLSpanElement> | undefined; | ||
| onEndedCapture?: React.ReactEventHandler<HTMLSpanElement> | undefined; | ||
| onLoadedData?: React.ReactEventHandler<HTMLSpanElement> | undefined; | ||
| onLoadedDataCapture?: React.ReactEventHandler<HTMLSpanElement> | undefined; | ||
| onLoadedMetadata?: React.ReactEventHandler<HTMLSpanElement> | undefined; | ||
| onLoadedMetadataCapture?: React.ReactEventHandler<HTMLSpanElement> | undefined; | ||
| onLoadStart?: React.ReactEventHandler<HTMLSpanElement> | undefined; | ||
| onLoadStartCapture?: React.ReactEventHandler<HTMLSpanElement> | undefined; | ||
| onPause?: React.ReactEventHandler<HTMLSpanElement> | undefined; | ||
| onPauseCapture?: React.ReactEventHandler<HTMLSpanElement> | undefined; | ||
| onPlay?: React.ReactEventHandler<HTMLSpanElement> | undefined; | ||
| onPlayCapture?: React.ReactEventHandler<HTMLSpanElement> | undefined; | ||
| onPlaying?: React.ReactEventHandler<HTMLSpanElement> | undefined; | ||
| onPlayingCapture?: React.ReactEventHandler<HTMLSpanElement> | undefined; | ||
| onProgress?: React.ReactEventHandler<HTMLSpanElement> | undefined; | ||
| onProgressCapture?: React.ReactEventHandler<HTMLSpanElement> | undefined; | ||
| onRateChange?: React.ReactEventHandler<HTMLSpanElement> | undefined; | ||
| onRateChangeCapture?: React.ReactEventHandler<HTMLSpanElement> | undefined; | ||
| onSeeked?: React.ReactEventHandler<HTMLSpanElement> | undefined; | ||
| onSeekedCapture?: React.ReactEventHandler<HTMLSpanElement> | undefined; | ||
| onSeeking?: React.ReactEventHandler<HTMLSpanElement> | undefined; | ||
| onSeekingCapture?: React.ReactEventHandler<HTMLSpanElement> | undefined; | ||
| onStalled?: React.ReactEventHandler<HTMLSpanElement> | undefined; | ||
| onStalledCapture?: React.ReactEventHandler<HTMLSpanElement> | undefined; | ||
| onSuspend?: React.ReactEventHandler<HTMLSpanElement> | undefined; | ||
| onSuspendCapture?: React.ReactEventHandler<HTMLSpanElement> | undefined; | ||
| onTimeUpdate?: React.ReactEventHandler<HTMLSpanElement> | undefined; | ||
| onTimeUpdateCapture?: React.ReactEventHandler<HTMLSpanElement> | undefined; | ||
| onVolumeChange?: React.ReactEventHandler<HTMLSpanElement> | undefined; | ||
| onVolumeChangeCapture?: React.ReactEventHandler<HTMLSpanElement> | undefined; | ||
| onWaiting?: React.ReactEventHandler<HTMLSpanElement> | undefined; | ||
| onWaitingCapture?: React.ReactEventHandler<HTMLSpanElement> | undefined; | ||
| onAuxClick?: React.MouseEventHandler<HTMLSpanElement> | undefined; | ||
| onAuxClickCapture?: React.MouseEventHandler<HTMLSpanElement> | undefined; | ||
| onClick?: React.MouseEventHandler<HTMLSpanElement> | undefined; | ||
| onClickCapture?: React.MouseEventHandler<HTMLSpanElement> | undefined; | ||
| onContextMenu?: React.MouseEventHandler<HTMLSpanElement> | undefined; | ||
| onContextMenuCapture?: React.MouseEventHandler<HTMLSpanElement> | undefined; | ||
| onDoubleClick?: React.MouseEventHandler<HTMLSpanElement> | undefined; | ||
| onDoubleClickCapture?: React.MouseEventHandler<HTMLSpanElement> | undefined; | ||
| onDrag?: React.DragEventHandler<HTMLSpanElement> | undefined; | ||
| onDragCapture?: React.DragEventHandler<HTMLSpanElement> | undefined; | ||
| onDragEnd?: React.DragEventHandler<HTMLSpanElement> | undefined; | ||
| onDragEndCapture?: React.DragEventHandler<HTMLSpanElement> | undefined; | ||
| onDragEnter?: React.DragEventHandler<HTMLSpanElement> | undefined; | ||
| onDragEnterCapture?: React.DragEventHandler<HTMLSpanElement> | undefined; | ||
| onDragExit?: React.DragEventHandler<HTMLSpanElement> | undefined; | ||
| onDragExitCapture?: React.DragEventHandler<HTMLSpanElement> | undefined; | ||
| onDragLeave?: React.DragEventHandler<HTMLSpanElement> | undefined; | ||
| onDragLeaveCapture?: React.DragEventHandler<HTMLSpanElement> | undefined; | ||
| onDragOver?: React.DragEventHandler<HTMLSpanElement> | undefined; | ||
| onDragOverCapture?: React.DragEventHandler<HTMLSpanElement> | undefined; | ||
| onDragStart?: React.DragEventHandler<HTMLSpanElement> | undefined; | ||
| onDragStartCapture?: React.DragEventHandler<HTMLSpanElement> | undefined; | ||
| onDrop?: React.DragEventHandler<HTMLSpanElement> | undefined; | ||
| onDropCapture?: React.DragEventHandler<HTMLSpanElement> | undefined; | ||
| onMouseDown?: React.MouseEventHandler<HTMLSpanElement> | undefined; | ||
| onMouseDownCapture?: React.MouseEventHandler<HTMLSpanElement> | undefined; | ||
| onMouseEnter?: React.MouseEventHandler<HTMLSpanElement> | undefined; | ||
| onMouseLeave?: React.MouseEventHandler<HTMLSpanElement> | undefined; | ||
| onMouseMove?: React.MouseEventHandler<HTMLSpanElement> | undefined; | ||
| onMouseMoveCapture?: React.MouseEventHandler<HTMLSpanElement> | undefined; | ||
| onMouseOut?: React.MouseEventHandler<HTMLSpanElement> | undefined; | ||
| onMouseOutCapture?: React.MouseEventHandler<HTMLSpanElement> | undefined; | ||
| onMouseOver?: React.MouseEventHandler<HTMLSpanElement> | undefined; | ||
| onMouseOverCapture?: React.MouseEventHandler<HTMLSpanElement> | undefined; | ||
| onMouseUp?: React.MouseEventHandler<HTMLSpanElement> | undefined; | ||
| onMouseUpCapture?: React.MouseEventHandler<HTMLSpanElement> | undefined; | ||
| onSelect?: React.ReactEventHandler<HTMLSpanElement> | undefined; | ||
| onSelectCapture?: React.ReactEventHandler<HTMLSpanElement> | undefined; | ||
| onTouchCancel?: React.TouchEventHandler<HTMLSpanElement> | undefined; | ||
| onTouchCancelCapture?: React.TouchEventHandler<HTMLSpanElement> | undefined; | ||
| onTouchEnd?: React.TouchEventHandler<HTMLSpanElement> | undefined; | ||
| onTouchEndCapture?: React.TouchEventHandler<HTMLSpanElement> | undefined; | ||
| onTouchMove?: React.TouchEventHandler<HTMLSpanElement> | undefined; | ||
| onTouchMoveCapture?: React.TouchEventHandler<HTMLSpanElement> | undefined; | ||
| onTouchStart?: React.TouchEventHandler<HTMLSpanElement> | undefined; | ||
| onTouchStartCapture?: React.TouchEventHandler<HTMLSpanElement> | undefined; | ||
| onPointerDown?: React.PointerEventHandler<HTMLSpanElement> | undefined; | ||
| onPointerDownCapture?: React.PointerEventHandler<HTMLSpanElement> | undefined; | ||
| onPointerMove?: React.PointerEventHandler<HTMLSpanElement> | undefined; | ||
| onPointerMoveCapture?: React.PointerEventHandler<HTMLSpanElement> | undefined; | ||
| onPointerUp?: React.PointerEventHandler<HTMLSpanElement> | undefined; | ||
| onPointerUpCapture?: React.PointerEventHandler<HTMLSpanElement> | undefined; | ||
| onPointerCancel?: React.PointerEventHandler<HTMLSpanElement> | undefined; | ||
| onPointerCancelCapture?: React.PointerEventHandler<HTMLSpanElement> | undefined; | ||
| onPointerEnter?: React.PointerEventHandler<HTMLSpanElement> | undefined; | ||
| onPointerLeave?: React.PointerEventHandler<HTMLSpanElement> | undefined; | ||
| onPointerOver?: React.PointerEventHandler<HTMLSpanElement> | undefined; | ||
| onPointerOverCapture?: React.PointerEventHandler<HTMLSpanElement> | undefined; | ||
| onPointerOut?: React.PointerEventHandler<HTMLSpanElement> | undefined; | ||
| onPointerOutCapture?: React.PointerEventHandler<HTMLSpanElement> | undefined; | ||
| onGotPointerCapture?: React.PointerEventHandler<HTMLSpanElement> | undefined; | ||
| onGotPointerCaptureCapture?: React.PointerEventHandler<HTMLSpanElement> | undefined; | ||
| onLostPointerCapture?: React.PointerEventHandler<HTMLSpanElement> | undefined; | ||
| onLostPointerCaptureCapture?: React.PointerEventHandler<HTMLSpanElement> | undefined; | ||
| onScroll?: React.UIEventHandler<HTMLSpanElement> | undefined; | ||
| onScrollCapture?: React.UIEventHandler<HTMLSpanElement> | undefined; | ||
| onScrollEnd?: React.UIEventHandler<HTMLSpanElement> | undefined; | ||
| onScrollEndCapture?: React.UIEventHandler<HTMLSpanElement> | undefined; | ||
| onWheel?: React.WheelEventHandler<HTMLSpanElement> | undefined; | ||
| onWheelCapture?: React.WheelEventHandler<HTMLSpanElement> | undefined; | ||
| onAnimationStart?: React.AnimationEventHandler<HTMLSpanElement> | undefined; | ||
| onAnimationStartCapture?: React.AnimationEventHandler<HTMLSpanElement> | undefined; | ||
| onAnimationEnd?: React.AnimationEventHandler<HTMLSpanElement> | undefined; | ||
| onAnimationEndCapture?: React.AnimationEventHandler<HTMLSpanElement> | undefined; | ||
| onAnimationIteration?: React.AnimationEventHandler<HTMLSpanElement> | undefined; | ||
| onAnimationIterationCapture?: React.AnimationEventHandler<HTMLSpanElement> | undefined; | ||
| onToggle?: React.ToggleEventHandler<HTMLSpanElement> | undefined; | ||
| onBeforeToggle?: React.ToggleEventHandler<HTMLSpanElement> | undefined; | ||
| onTransitionCancel?: React.TransitionEventHandler<HTMLSpanElement> | undefined; | ||
| onTransitionCancelCapture?: React.TransitionEventHandler<HTMLSpanElement> | undefined; | ||
| onTransitionEnd?: React.TransitionEventHandler<HTMLSpanElement> | undefined; | ||
| onTransitionEndCapture?: React.TransitionEventHandler<HTMLSpanElement> | undefined; | ||
| onTransitionRun?: React.TransitionEventHandler<HTMLSpanElement> | undefined; | ||
| onTransitionRunCapture?: React.TransitionEventHandler<HTMLSpanElement> | undefined; | ||
| onTransitionStart?: React.TransitionEventHandler<HTMLSpanElement> | undefined; | ||
| onTransitionStartCapture?: React.TransitionEventHandler<HTMLSpanElement> | undefined; | ||
| "data-component": string; | ||
| "data-status": _stepperize_core.StepStatus; | ||
| }, HTMLElement>; | ||
| declare function createSeparator(): (props: SeparatorProps) => React.ReactNode; | ||
| declare function createContent<Steps extends Step[]>(StepperContext: React.Context<Stepper<Steps> | null>): (props: ContentProps<Steps>) => React.ReactNode; | ||
| declare function createActions(): (props: ActionsProps) => React.ReactNode; | ||
| declare function createPrev<Steps extends Step[]>(StepperContext: React.Context<Stepper<Steps> | null>): (props: PrevProps) => React.ReactNode; | ||
| declare function createNext<Steps extends Step[]>(StepperContext: React.Context<Stepper<Steps> | null>): (props: NextProps) => React.ReactNode; | ||
| type StepperPrimitives<Steps extends Step[]> = { | ||
| Root: ReturnType<typeof createRoot<Steps>>; | ||
| List: ReturnType<typeof createList>; | ||
| Item: ReturnType<typeof createItem<Steps>>; | ||
| Trigger: ReturnType<typeof createTrigger<Steps>>; | ||
| Title: ReturnType<typeof createTitle>; | ||
| Description: ReturnType<typeof createDescription<Steps>>; | ||
| Indicator: ReturnType<typeof createIndicator<Steps>>; | ||
| Separator: ReturnType<typeof createSeparator>; | ||
| Content: ReturnType<typeof createContent<Steps>>; | ||
| Actions: ReturnType<typeof createActions>; | ||
| Prev: ReturnType<typeof createPrev<Steps>>; | ||
| Next: ReturnType<typeof createNext<Steps>>; | ||
| }; | ||
| type ScopedProviderProps<Steps extends Step[]> = React.PropsWithChildren<{ | ||
| initialStep?: Get.Id<Steps>; | ||
| initialMetadata?: Partial<Record<Get.Id<Steps>, Metadata>>; | ||
| }>; | ||
| declare function createStepperPrimitives<Steps extends Step[]>(StepperContext: React.Context<Stepper<Steps> | null>, ScopedProvider: (props: ScopedProviderProps<Steps>) => React.ReactElement): StepperPrimitives<Steps>; | ||
| export { type ActionsProps as A, type ContentProps as C, type DescriptionProps as D, type ItemProps as I, type ListProps as L, type NextProps as N, type PrimitiveProps as P, type RenderProp as R, type StepperPrimitives as S, type TriggerProps as T, type StepInfo as a, type RootProps as b, type TitleProps as c, type IndicatorProps as d, type SeparatorProps as e, type PrevProps as f, createStepperPrimitives as g }; |
Major refactor
Supply chain riskPackage has recently undergone a major refactor. It may be unstable or indicate significant internal changes. Use caution when updating to versions that include significant changes.
Found 1 instance in 1 package
Minified code
QualityThis package contains minified code. This may be harmless in some cases where minified code is included in packaged libraries, however packages on npm should not minify code.
Found 1 instance in 1 package
Minified code
QualityThis package contains minified code. This may be harmless in some cases where minified code is included in packaged libraries, however packages on npm should not minify code.
Found 1 instance in 1 package
25583
-40.18%225
-56.23%1
Infinity%+ Added
- Removed
Updated