@yewdiel21/motion-kit 0.9.1 → 0.10.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (129) hide show
  1. package/README.md +93 -83
  2. package/dist/auto/index.d.ts +22 -3
  3. package/dist/auto/index.js +41 -3
  4. package/dist/auto/index.js.map +1 -1
  5. package/dist/{chunk-BFC27F2G.js → chunk-IKQ5FODN.js} +2 -2
  6. package/dist/{chunk-JQMJQSXD.js → chunk-TFNRIZHU.js} +1614 -11
  7. package/dist/chunk-TFNRIZHU.js.map +1 -0
  8. package/dist/{chunk-XDWBVFHQ.js → chunk-XAKC2QY7.js} +1202 -3
  9. package/dist/chunk-XAKC2QY7.js.map +1 -0
  10. package/dist/css/components/calendar.css +159 -0
  11. package/dist/css/components/hover-card.css +14 -0
  12. package/dist/css/components/input-otp.css +10 -0
  13. package/dist/css/components/pagination.css +11 -0
  14. package/dist/css/components/quantity.css +16 -0
  15. package/dist/css/components/slot-picker.css +126 -0
  16. package/dist/css/components/studio-dock.css +35 -0
  17. package/dist/css/components/trailer.css +37 -0
  18. package/dist/css/controls.css +65 -0
  19. package/dist/elements/index.d.ts +72 -4
  20. package/dist/elements/index.js +170 -4
  21. package/dist/elements/index.js.map +1 -1
  22. package/dist/index.css +1017 -0
  23. package/dist/index.d.ts +3 -3
  24. package/dist/index.js +45 -3
  25. package/dist/index.js.map +1 -1
  26. package/dist/react/index.d.ts +105 -6
  27. package/dist/react/index.js +350 -3
  28. package/dist/react/index.js.map +1 -1
  29. package/dist/{reduced-B98f8LPs.d.ts → reduced-BmBzKH94.d.ts} +199 -2
  30. package/dist/{reveal-C0hCDcB_.d.ts → reveal-jsX-uwUz.d.ts} +211 -1
  31. package/dist/{store-pHiUvxP8.d.ts → store-DYb3tTsZ.d.ts} +1 -1
  32. package/package.json +1 -1
  33. package/registry.json +178 -104
  34. package/skills/motion-kit/SKILL.md +209 -189
  35. package/src/auto/auto-init.ts +38 -0
  36. package/src/components/calendar/README.md +82 -0
  37. package/src/components/calendar/calendar.css +158 -0
  38. package/src/components/calendar/element.ts +27 -0
  39. package/src/components/calendar/engine.ts +412 -0
  40. package/src/components/calendar/react.tsx +69 -0
  41. package/src/components/hover-card/README.md +16 -0
  42. package/src/components/hover-card/element.ts +8 -0
  43. package/src/components/hover-card/engine.ts +69 -0
  44. package/src/components/hover-card/hover-card.css +13 -0
  45. package/src/components/hover-card/react.tsx +19 -0
  46. package/src/components/input-otp/README.md +18 -0
  47. package/src/components/input-otp/element.ts +14 -0
  48. package/src/components/input-otp/engine.ts +106 -0
  49. package/src/components/input-otp/input-otp.css +9 -0
  50. package/src/components/input-otp/react.tsx +21 -0
  51. package/src/components/pagination/README.md +17 -0
  52. package/src/components/pagination/element.ts +14 -0
  53. package/src/components/pagination/engine.ts +102 -0
  54. package/src/components/pagination/pagination.css +10 -0
  55. package/src/components/pagination/react.tsx +22 -0
  56. package/src/components/quantity/README.md +20 -0
  57. package/src/components/quantity/element.ts +14 -0
  58. package/src/components/quantity/engine.ts +85 -0
  59. package/src/components/quantity/quantity.css +15 -0
  60. package/src/components/quantity/react.tsx +21 -0
  61. package/src/components/slot-picker/README.md +68 -0
  62. package/src/components/slot-picker/element.ts +27 -0
  63. package/src/components/slot-picker/engine.ts +412 -0
  64. package/src/components/slot-picker/react.tsx +76 -0
  65. package/src/components/slot-picker/slot-picker.css +125 -0
  66. package/src/components/studio-dock/README.md +44 -0
  67. package/src/components/studio-dock/element.ts +11 -0
  68. package/src/components/studio-dock/engine.ts +212 -0
  69. package/src/components/studio-dock/react.tsx +23 -0
  70. package/src/components/studio-dock/studio-dock.css +34 -0
  71. package/src/components/trailer/README.md +28 -0
  72. package/src/components/trailer/element.ts +13 -0
  73. package/src/components/trailer/engine.ts +189 -0
  74. package/src/components/trailer/react.tsx +16 -0
  75. package/src/components/trailer/trailer.css +36 -0
  76. package/src/core/dates.ts +98 -0
  77. package/src/css/controls/README.md +14 -0
  78. package/src/css/controls/status.css +63 -0
  79. package/src/elements/index.ts +24 -0
  80. package/src/index.ts +25 -0
  81. package/src/react/index.ts +21 -0
  82. package/src/react/use-action-button.ts +6 -0
  83. package/src/react/use-editorial-reveal.ts +7 -0
  84. package/src/react/use-film-hero.ts +6 -0
  85. package/src/react/use-font-cycle.ts +7 -0
  86. package/src/react/use-image-zoom.ts +5 -0
  87. package/src/react/use-joined-cta.ts +5 -0
  88. package/src/react/use-local-clock.ts +5 -0
  89. package/src/react/use-scroll-dock.ts +5 -0
  90. package/src/react/use-sticker.ts +5 -0
  91. package/src/react/use-studio-dock.ts +8 -0
  92. package/src/react/use-thumbnail-nav.ts +7 -0
  93. package/src/react/use-trailer.ts +6 -0
  94. package/src/react/use-weight-hover.ts +5 -0
  95. package/src/recipes/action-button/README.md +31 -0
  96. package/src/recipes/action-button/action-button.css +113 -0
  97. package/src/recipes/action-button/create-action-button.ts +56 -0
  98. package/src/recipes/editorial-reveal/README.md +35 -0
  99. package/src/recipes/editorial-reveal/create-editorial-reveal.ts +91 -0
  100. package/src/recipes/editorial-reveal/editorial-reveal.css +17 -0
  101. package/src/recipes/film-hero/README.md +23 -0
  102. package/src/recipes/film-hero/create-film-hero.ts +65 -0
  103. package/src/recipes/film-hero/film-hero.css +29 -0
  104. package/src/recipes/font-cycle/README.md +11 -0
  105. package/src/recipes/font-cycle/create-font-cycle.ts +126 -0
  106. package/src/recipes/font-cycle/font-cycle.css +36 -0
  107. package/src/recipes/image-zoom/README.md +16 -0
  108. package/src/recipes/image-zoom/create-image-zoom.ts +27 -0
  109. package/src/recipes/image-zoom/image-zoom.css +7 -0
  110. package/src/recipes/joined-cta/README.md +13 -0
  111. package/src/recipes/joined-cta/create-joined-cta.ts +22 -0
  112. package/src/recipes/joined-cta/joined-cta.css +17 -0
  113. package/src/recipes/local-clock/README.md +31 -0
  114. package/src/recipes/local-clock/create-local-clock.ts +61 -0
  115. package/src/recipes/scroll-dock/README.md +46 -0
  116. package/src/recipes/scroll-dock/create-scroll-dock.ts +72 -0
  117. package/src/recipes/scroll-dock/scroll-dock.css +70 -0
  118. package/src/recipes/sticker/README.md +59 -0
  119. package/src/recipes/sticker/create-sticker.ts +490 -0
  120. package/src/recipes/sticker/sticker.css +112 -0
  121. package/src/recipes/thumbnail-nav/README.md +16 -0
  122. package/src/recipes/thumbnail-nav/create-thumbnail-nav.ts +165 -0
  123. package/src/recipes/thumbnail-nav/thumbnail-nav.css +108 -0
  124. package/src/recipes/weight-hover/README.md +37 -0
  125. package/src/recipes/weight-hover/create-weight-hover.ts +136 -0
  126. package/src/recipes/weight-hover/weight-hover.css +7 -0
  127. package/dist/chunk-JQMJQSXD.js.map +0 -1
  128. package/dist/chunk-XDWBVFHQ.js.map +0 -1
  129. /package/dist/{chunk-BFC27F2G.js.map → chunk-IKQ5FODN.js.map} +0 -0
@@ -1,4 +1,4 @@
1
- import { e as MenuOptions, M as MenuInstance, g as RevealSpeed } from './reveal-C0hCDcB_.js';
1
+ import { x as MenuOptions, M as MenuInstance, B as RevealSpeed } from './reveal-jsX-uwUz.js';
2
2
  import { I as Instance } from './types-BkS_raL8.js';
3
3
  import { SplitText } from 'gsap/SplitText';
4
4
 
@@ -30,6 +30,203 @@ interface CurvedCarouselInstance extends Instance {
30
30
  }
31
31
  declare function createCurvedCarousel(root: HTMLElement | null, options?: CurvedCarouselOptions): CurvedCarouselInstance;
32
32
 
33
+ interface JoinedCtaOptions {
34
+ duration?: number;
35
+ }
36
+ interface JoinedCtaInstance extends Instance {
37
+ expand(): void;
38
+ collapse(): void;
39
+ readonly expanded: boolean;
40
+ }
41
+ /** Silvia's three contact capsules joining into one. Motion is entirely CSS. */
42
+ declare function createJoinedCta(root: HTMLElement | null, options?: JoinedCtaOptions): JoinedCtaInstance;
43
+
44
+ interface ImageZoomOptions {
45
+ duration?: number;
46
+ frameScale?: number;
47
+ imageScale?: number;
48
+ }
49
+ interface ImageZoomInstance extends Instance {
50
+ open(active: boolean): void;
51
+ readonly active: boolean;
52
+ }
53
+ /** Counter-zoom: the clipped frame grows as the picture inside settles to 1×. */
54
+ declare function createImageZoom(root: HTMLElement | null, options?: ImageZoomOptions): ImageZoomInstance;
55
+
56
+ interface FontCycleFace {
57
+ /** A font supplied by the application. No font files are downloaded by this recipe. */
58
+ family?: string;
59
+ axes?: Readonly<Record<string, number>>;
60
+ weight?: number;
61
+ style?: 'normal' | 'italic' | 'oblique';
62
+ }
63
+ interface FontCycleOptions {
64
+ text?: string;
65
+ /** Alternated per character; the second face rolls in on hover or focus. */
66
+ faces?: readonly [FontCycleFace, FontCycleFace];
67
+ /** Seconds per character. */
68
+ duration?: number;
69
+ /** Seconds between characters. */
70
+ stagger?: number;
71
+ /** Optional decorative artwork owned by the consumer. Hidden with reduced motion. */
72
+ overlaySrc?: string;
73
+ }
74
+ interface FontCycleInstance extends Instance {
75
+ play(): void;
76
+ reset(): void;
77
+ readonly active: boolean;
78
+ }
79
+ /** Alternating variable-font faces in a masked, reversible character roll. */
80
+ declare function createFontCycle(root: HTMLElement | null, options?: FontCycleOptions): FontCycleInstance;
81
+
82
+ interface ThumbnailNavOptions {
83
+ index?: number;
84
+ label?: string;
85
+ /** Seconds for expansion and panel entry. */
86
+ duration?: number;
87
+ onSelect?: (index: number, item: HTMLElement) => void;
88
+ }
89
+ interface ThumbnailNavInstance extends Instance {
90
+ open(): void;
91
+ close(): void;
92
+ toggle(): void;
93
+ select(index: number): void;
94
+ readonly index: number;
95
+ readonly expanded: boolean;
96
+ }
97
+ /** A category disclosure with stacked previews, real links and complete keyboard navigation. */
98
+ declare function createThumbnailNav(root: HTMLElement | null, options?: ThumbnailNavOptions): ThumbnailNavInstance;
99
+
100
+ type ActionButtonVariant = 'primary' | 'secondary' | 'icon' | 'stepper' | 'film';
101
+ interface ActionButtonOptions {
102
+ variant?: ActionButtonVariant;
103
+ /** Toggle aria-pressed on activation. Ordinary action buttons leave it unset. */
104
+ toggle?: boolean;
105
+ pressed?: boolean;
106
+ onPressedChange?: (pressed: boolean) => void;
107
+ }
108
+ interface ActionButtonInstance extends Instance {
109
+ setPressed(pressed: boolean): void;
110
+ readonly pressed: boolean;
111
+ }
112
+ /** Drawn press buttons and a masked rolling-label film variant. Uses native activation. */
113
+ declare function createActionButton(root: HTMLElement | null, options?: ActionButtonOptions): ActionButtonInstance;
114
+
115
+ interface FilmHeroOptions {
116
+ duration?: number;
117
+ stagger?: number;
118
+ /** Media travel as a fraction of the hero height. 0 disables parallax. */
119
+ parallax?: number;
120
+ scale?: number;
121
+ edge?: 'organic' | 'straight';
122
+ /** Scrollable demo panels and nested page shells can supply their own scroll root. */
123
+ scroller?: HTMLElement | Window;
124
+ }
125
+ interface FilmHeroInstance extends Instance {
126
+ replay(): void;
127
+ refresh(): void;
128
+ }
129
+ /** Editorial line reveals with scoped, scroll-driven media. Organic edge is an approximation. */
130
+ declare function createFilmHero(root: HTMLElement | null, options?: FilmHeroOptions): FilmHeroInstance;
131
+
132
+ interface EditorialRevealOptions {
133
+ trigger?: 'scroll' | 'load' | 'manual';
134
+ /** Title and staged groups, seconds. Reference default 1.2. */
135
+ duration?: number;
136
+ stagger?: number;
137
+ /** Title pieces' start offset, percent. Reference default 110. */
138
+ y?: number;
139
+ ease?: string;
140
+ hoverDuration?: number;
141
+ /** Duplicate label/arrow content moves by this many em. */
142
+ buttonShift?: number;
143
+ imageScale?: number;
144
+ parallax?: boolean;
145
+ }
146
+ interface EditorialRevealInstance extends Instance {
147
+ play(): void;
148
+ reset(): void;
149
+ }
150
+ /** Editorial composition: masked headings, staged contact groups, restrained image/card motion and keyboard-equivalent buttons. */
151
+ declare function createEditorialReveal(root: HTMLElement | null, options?: EditorialRevealOptions): EditorialRevealInstance;
152
+
153
+ interface WeightHoverOptions {
154
+ /** Axis value far from the pointer. */
155
+ rest?: number;
156
+ /** Axis value right under the pointer. */
157
+ near?: number;
158
+ /** Reach of the effect, px. */
159
+ radius?: number;
160
+ /** Variable-font axis tag. */
161
+ axis?: string;
162
+ /** Share of the remaining distance covered per frame (0–1). */
163
+ lerp?: number;
164
+ /** React to touch and pen too (the reference reacts to the mouse only). */
165
+ anyPointer?: boolean;
166
+ }
167
+ interface WeightHoverInstance extends Instance {
168
+ /** Point the effect at viewport coordinates (null releases it). */
169
+ pointAt(point: {
170
+ x: number;
171
+ y: number;
172
+ } | null): void;
173
+ }
174
+ declare function createWeightHover(root: HTMLElement | null, options?: WeightHoverOptions): WeightHoverInstance;
175
+
176
+ interface StickerOptions {
177
+ /** Drag to peel the sticker off. */
178
+ peel?: boolean;
179
+ /** Pointer-driven foil and shine. */
180
+ holo?: boolean;
181
+ /** Share of the area lifted before the sticker comes off (0–1). */
182
+ detachAt?: number;
183
+ /** Drag length (px, unscaled) that takes it off whatever the area; default max(80, half the longest side). */
184
+ detachDistance?: number;
185
+ /** Time hidden after falling before it comes back, ms. */
186
+ returnDelay?: number;
187
+ onPeel?: () => void;
188
+ onReturn?: () => void;
189
+ }
190
+ interface StickerInstance extends Instance {
191
+ /** idle | peeling | carried | falling | away */
192
+ readonly state: StickerState;
193
+ }
194
+ type StickerState = 'idle' | 'peeling' | 'carried' | 'falling' | 'away';
195
+ declare function createSticker(root: HTMLElement | null, options?: StickerOptions): StickerInstance;
196
+
197
+ interface ScrollDockOptions {
198
+ /** Scroll distance before it shows, in viewport heights. */
199
+ threshold?: number;
200
+ /** Element (or selector) that sends it away when it reaches the viewport bottom. */
201
+ hideWhen?: Element | string | null;
202
+ /** px above the bottom edge at which `hideWhen` counts as reached. */
203
+ hideOffset?: number;
204
+ /** Scrolling element (or selector, looked up from the dock outwards); the window by default. */
205
+ scroller?: HTMLElement | string | null;
206
+ onChange?: (visible: boolean) => void;
207
+ }
208
+ interface ScrollDockInstance extends Instance {
209
+ readonly visible: boolean;
210
+ /** Re-read the scroll position (after layout changes). */
211
+ update(): void;
212
+ }
213
+ declare function createScrollDock(root: HTMLElement | null, options?: ScrollDockOptions): ScrollDockInstance;
214
+
215
+ interface LocalClockOptions {
216
+ /** IANA zone, e.g. "America/Mexico_City". The visitor's zone by default. */
217
+ timeZone?: string;
218
+ locale?: string;
219
+ hour12?: boolean;
220
+ seconds?: boolean;
221
+ /** Full control over the format (overrides hour12/seconds). */
222
+ format?: Intl.DateTimeFormatOptions;
223
+ }
224
+ interface LocalClockInstance extends Instance {
225
+ /** Text currently shown. */
226
+ readonly text: string;
227
+ }
228
+ declare function createLocalClock(root: HTMLElement | null, options?: LocalClockOptions): LocalClockInstance;
229
+
33
230
  interface SpringCardsOptions {
34
231
  /** Cards inside the root. */
35
232
  selector?: string;
@@ -563,4 +760,4 @@ declare function entrances(): boolean;
563
760
  */
564
761
  declare const MK_HEAD_SCRIPT = "(function(){var r=document.documentElement;r.classList.add('mk-js');setTimeout(function(){if(!r.classList.contains('mk-ready'))r.classList.add('mk-failed')},2500)})();";
565
762
 
566
- export { type FitTextOptions as $, type TicketMenuInstance as A, createInfiniteReel as B, type CurvedCarouselInstance as C, createRepelBento as D, createRotator as E, createDragRuler as F, createDockPill as G, type CardDockInstance as H, type CardDockOptions as I, type CascadeInstance as J, type CascadeOptions as K, type ContrastInstance as L, MK_HEAD_SCRIPT as M, type ContrastOptions as N, type CounterInstance as O, type CounterOptions as P, type CurvedCarouselOptions as Q, type DepthGridInstance as R, type DepthGridOptions as S, type TicketMenuOptions as T, type DockPillInstance as U, type DockPillOptions as V, type DragRulerInstance as W, type DragRulerOptions as X, type FillTextInstance as Y, type FillTextOptions as Z, type FitTextInstance as _, createPile as a, type FlowInOptions as a0, type FlowInstance as a1, type FlowOptions as a2, type FlowOutOptions as a3, type FrameZoomInstance as a4, type FrameZoomOptions as a5, type InfiniteReelInstance as a6, type InfiniteReelOptions as a7, type LettersInstance as a8, type LettersOptions as a9, type SortableInstance as aA, type SortableLabels as aB, type SortableOptions as aC, type SpringCardsInstance as aD, type SpringCardsOptions as aE, type StretchFooterInstance as aF, type StretchFooterOptions as aG, type TabsInstance as aH, type TabsOptions as aI, type TextRollInstance as aJ, type TextRollOptions as aK, type WordsInstance as aL, type WordsOptions as aM, createCurvedCarousel as aN, createTicketMenu as aO, entrances as aP, flowIn as aQ, flowOut as aR, moveItem as aS, pileLayers as aT, pileStyle as aU, reduced as aV, stepChange as aW, type MarqueeInstance as aa, type MarqueeOptions as ab, type MaskTextInstance as ac, type MaskTextOptions as ad, type ParallaxInstance as ae, type ParallaxOptions as af, type PileInstance as ag, type PileLayer as ah, type PileOptions as ai, type PopInstance as aj, type PopOptions as ak, type RadialMenuInstance as al, type RadialMenuOptions as am, type ReflowInstance as an, type ReflowOptions as ao, type ReorderDetail as ap, type RepelBentoInstance as aq, type RepelBentoOptions as ar, type RevealInstance as as, type RevealRecipeOptions as at, type RotatorInstance as au, type RotatorOptions as av, type SlotTextInstance as aw, type SlotTextOptions as ax, type SnapStripInstance as ay, type SnapStripOptions as az, createWords as b, createSpringCards as c, createFlow as d, createPop as e, createFitText as f, createStretchFooter as g, createRadialMenu as h, createTabs as i, createCounter as j, createReveal as k, createReflow as l, createSlotText as m, createSortable as n, createMaskText as o, createCascade as p, createTextRoll as q, createLetters as r, createParallax as s, createDepthGrid as t, createFrameZoom as u, createContrast as v, createMarquee as w, createCardDock as x, createSnapStrip as y, createFillText as z };
763
+ export { type ContrastInstance as $, createCascade as A, createTextRoll as B, type CurvedCarouselInstance as C, createLetters as D, createParallax as E, createDepthGrid as F, createFrameZoom as G, createContrast as H, createMarquee as I, createCardDock as J, createSnapStrip as K, createFillText as L, type TicketMenuInstance as M, createInfiniteReel as N, createRepelBento as O, createRotator as P, createDragRuler as Q, createDockPill as R, MK_HEAD_SCRIPT as S, type TicketMenuOptions as T, type ActionButtonInstance as U, type ActionButtonOptions as V, type ActionButtonVariant as W, type CardDockInstance as X, type CardDockOptions as Y, type CascadeInstance as Z, type CascadeOptions as _, createImageZoom as a, type SnapStripInstance as a$, type ContrastOptions as a0, type CounterInstance as a1, type CounterOptions as a2, type CurvedCarouselOptions as a3, type DepthGridInstance as a4, type DepthGridOptions as a5, type DockPillInstance as a6, type DockPillOptions as a7, type DragRulerInstance as a8, type DragRulerOptions as a9, type LocalClockOptions as aA, type MarqueeInstance as aB, type MarqueeOptions as aC, type MaskTextInstance as aD, type MaskTextOptions as aE, type ParallaxInstance as aF, type ParallaxOptions as aG, type PileInstance as aH, type PileLayer as aI, type PileOptions as aJ, type PopInstance as aK, type PopOptions as aL, type RadialMenuInstance as aM, type RadialMenuOptions as aN, type ReflowInstance as aO, type ReflowOptions as aP, type ReorderDetail as aQ, type RepelBentoInstance as aR, type RepelBentoOptions as aS, type RevealInstance as aT, type RevealRecipeOptions as aU, type RotatorInstance as aV, type RotatorOptions as aW, type ScrollDockInstance as aX, type ScrollDockOptions as aY, type SlotTextInstance as aZ, type SlotTextOptions as a_, type EditorialRevealInstance as aa, type EditorialRevealOptions as ab, type FillTextInstance as ac, type FillTextOptions as ad, type FilmHeroInstance as ae, type FilmHeroOptions as af, type FitTextInstance as ag, type FitTextOptions as ah, type FlowInOptions as ai, type FlowInstance as aj, type FlowOptions as ak, type FlowOutOptions as al, type FontCycleFace as am, type FontCycleInstance as an, type FontCycleOptions as ao, type FrameZoomInstance as ap, type FrameZoomOptions as aq, type ImageZoomInstance as ar, type ImageZoomOptions as as, type InfiniteReelInstance as at, type InfiniteReelOptions as au, type JoinedCtaInstance as av, type JoinedCtaOptions as aw, type LettersInstance as ax, type LettersOptions as ay, type LocalClockInstance as az, createFontCycle as b, type SnapStripOptions as b0, type SortableInstance as b1, type SortableLabels as b2, type SortableOptions as b3, type SpringCardsInstance as b4, type SpringCardsOptions as b5, type StickerInstance as b6, type StickerOptions as b7, type StickerState as b8, type StretchFooterInstance as b9, type StretchFooterOptions as ba, type TabsInstance as bb, type TabsOptions as bc, type TextRollInstance as bd, type TextRollOptions as be, type ThumbnailNavInstance as bf, type ThumbnailNavOptions as bg, type WeightHoverInstance as bh, type WeightHoverOptions as bi, type WordsInstance as bj, type WordsOptions as bk, createCurvedCarousel as bl, createTicketMenu as bm, entrances as bn, flowIn as bo, flowOut as bp, moveItem as bq, pileLayers as br, pileStyle as bs, reduced as bt, stepChange as bu, createJoinedCta as c, createThumbnailNav as d, createActionButton as e, createFilmHero as f, createEditorialReveal as g, createWeightHover as h, createSticker as i, createScrollDock as j, createLocalClock as k, createSpringCards as l, createPile as m, createWords as n, createFlow as o, createPop as p, createFitText as q, createStretchFooter as r, createRadialMenu as s, createTabs as t, createCounter as u, createReveal as v, createReflow as w, createSlotText as x, createSortable as y, createMaskText as z };
@@ -54,6 +54,216 @@ interface MenuInstance extends DialogInstance {
54
54
  }
55
55
  declare function createMenu(dialog: HTMLElement | null, options?: MenuOptions): MenuInstance;
56
56
 
57
+ interface QuantityOptions {
58
+ min?: number;
59
+ max?: number;
60
+ step?: number;
61
+ value?: number;
62
+ disabled?: boolean;
63
+ onChange?: (value: number) => void;
64
+ }
65
+ interface QuantityInstance extends Instance {
66
+ setValue(value: number, notify?: boolean): void;
67
+ readonly value: number;
68
+ }
69
+ /** Bounded numeric control. Bite/rotation is CSS; buttons remain native. */
70
+ declare function createQuantity(root: HTMLElement | null, options?: QuantityOptions): QuantityInstance;
71
+
72
+ interface PaginationOptions {
73
+ totalPages?: number;
74
+ page?: number;
75
+ siblings?: number;
76
+ pageLabel?: (page: number) => string;
77
+ onChange?: (page: number) => void;
78
+ }
79
+ interface PaginationInstance extends Instance {
80
+ setPage(page: number, notify?: boolean): void;
81
+ setTotalPages(total: number): void;
82
+ readonly page: number;
83
+ readonly totalPages: number;
84
+ }
85
+ /** Renders a bounded window of pages, even when totalPages is very large. */
86
+ declare function createPagination(root: HTMLElement | null, options?: PaginationOptions): PaginationInstance;
87
+
88
+ interface HoverCardOptions {
89
+ openDelay?: number;
90
+ closeDelay?: number;
91
+ placement?: 'top' | 'bottom';
92
+ onOpenChange?: (open: boolean) => void;
93
+ }
94
+ interface HoverCardInstance extends Instance {
95
+ open(): void;
96
+ close(): void;
97
+ readonly isOpen: boolean;
98
+ }
99
+ /** Nonmodal preview: pointer, keyboard focus and tap all reveal the same panel. */
100
+ declare function createHoverCard(root: HTMLElement | null, options?: HoverCardOptions): HoverCardInstance;
101
+
102
+ interface InputOtpOptions {
103
+ length?: number;
104
+ value?: string;
105
+ mask?: boolean;
106
+ onChange?: (value: string) => void;
107
+ onComplete?: (value: string) => void;
108
+ }
109
+ interface InputOtpInstance extends Instance {
110
+ setValue(value: string, notify?: boolean): void;
111
+ focus(): void;
112
+ readonly value: string;
113
+ }
114
+ /** One real input preserves native editing, mobile autofill and password managers. */
115
+ declare function createInputOtp(root: HTMLElement | null, options?: InputOtpOptions): InputOtpInstance;
116
+
117
+ type StudioDockView = 'menu' | 'contact' | 'reel';
118
+ interface StudioDockState {
119
+ open: boolean;
120
+ view: StudioDockView;
121
+ page: number;
122
+ }
123
+ interface StudioDockOptions {
124
+ /** Seconds. Reference sheet: 1.3 s, outBack(.52). */
125
+ duration?: number;
126
+ ease?: string;
127
+ /** Move focus into a newly opened view. Defaults to true. */
128
+ focusOnOpen?: boolean;
129
+ /** Contain Tab within the open panel and its toggle. Defaults to true. */
130
+ trapFocus?: boolean;
131
+ onChange?: (state: StudioDockState) => void;
132
+ }
133
+ interface StudioDockInstance extends Instance {
134
+ open(view?: StudioDockView): void;
135
+ close(): void;
136
+ toggle(): void;
137
+ selectPage(index: number): void;
138
+ readonly state: StudioDockState;
139
+ }
140
+ /** A contained studio sheet. Markup remains useful without JavaScript; fixed positioning is CSS opt-in. */
141
+ declare function createStudioDock(root: HTMLElement | null, options?: StudioDockOptions): StudioDockInstance;
142
+
143
+ type DateInput = Date | string | number;
144
+ /** Local midnight of a date; "2026-10-23" is read as a local day, not UTC. */
145
+ declare function toDate(input: DateInput | null | undefined, fallback?: Date): Date;
146
+ /** YYYY-MM-DD of the local day. */
147
+ declare const dayKey: (date: Date) => string;
148
+
149
+ type CalendarView = 'month' | 'week';
150
+ type CalendarEventStatus = 'pending' | 'done' | 'cancelled';
151
+ interface CalendarEvent {
152
+ id: string | number;
153
+ title: string;
154
+ start: DateInput;
155
+ end?: DateInput;
156
+ allDay?: boolean;
157
+ status?: CalendarEventStatus;
158
+ /** Any CSS colour for the chip. */
159
+ color?: string;
160
+ }
161
+ interface CalendarRange {
162
+ start: Date;
163
+ end: Date;
164
+ view: CalendarView;
165
+ }
166
+ interface CalendarLabels {
167
+ more?: (count: number) => string;
168
+ events?: (count: number) => string;
169
+ status?: Partial<Record<CalendarEventStatus, string>>;
170
+ }
171
+ interface CalendarOptions {
172
+ /** Date the calendar opens on. */
173
+ date?: DateInput;
174
+ view?: CalendarView;
175
+ /** 0 = Sunday … 6 = Saturday. */
176
+ firstDay?: number;
177
+ locale?: string;
178
+ events?: CalendarEvent[];
179
+ /** Chips per day in the month view before "+N". */
180
+ maxEvents?: number;
181
+ selected?: DateInput | null;
182
+ /** Override "today" (tests, demos in another zone). */
183
+ today?: DateInput;
184
+ labels?: CalendarLabels;
185
+ onSelect?: (date: Date) => void;
186
+ onEventClick?: (event: CalendarEvent) => void;
187
+ onNavigate?: (range: CalendarRange) => void;
188
+ }
189
+ interface CalendarInstance extends Instance {
190
+ next(): void;
191
+ prev(): void;
192
+ goToday(): void;
193
+ setDate(date: DateInput): void;
194
+ setView(view: CalendarView): void;
195
+ setEvents(events: CalendarEvent[]): void;
196
+ select(date: DateInput | null, notify?: boolean): void;
197
+ readonly date: Date;
198
+ readonly view: CalendarView;
199
+ readonly selected: Date | null;
200
+ readonly range: CalendarRange;
201
+ }
202
+ declare function createCalendar(root: HTMLElement | null, options?: CalendarOptions): CalendarInstance;
203
+
204
+ type SlotSource = string[] | Record<string, string[]> | ((date: Date) => string[] | Promise<string[]>);
205
+ interface SlotValue {
206
+ date: Date;
207
+ time: string;
208
+ key: string;
209
+ value: string;
210
+ }
211
+ interface SlotPickerLabels {
212
+ placeholder?: string;
213
+ empty?: string;
214
+ loading?: string;
215
+ heading?: (date: Date) => string;
216
+ }
217
+ interface SlotPickerOptions {
218
+ /** Month shown first (and the selected day when `value` is not given). */
219
+ date?: DateInput;
220
+ /** Initial value: "2026-10-23T10:30" or { date, time }. */
221
+ value?: string | {
222
+ date: DateInput;
223
+ time: string;
224
+ } | null;
225
+ slots?: SlotSource;
226
+ min?: DateInput;
227
+ max?: DateInput;
228
+ /** Weekdays never available (0 = Sunday). */
229
+ closedDays?: number[];
230
+ isDisabled?: (date: Date) => boolean;
231
+ firstDay?: number;
232
+ locale?: string;
233
+ labels?: SlotPickerLabels;
234
+ onChange?: (value: SlotValue) => void;
235
+ onDateChange?: (date: Date) => void;
236
+ }
237
+ interface SlotPickerInstance extends Instance {
238
+ selectDate(date: DateInput): void;
239
+ selectTime(time: string | null): void;
240
+ setSlots(slots: SlotSource): void;
241
+ readonly date: Date | null;
242
+ readonly time: string | null;
243
+ readonly value: string | null;
244
+ }
245
+ declare function createSlotPicker(root: HTMLElement | null, options?: SlotPickerOptions): SlotPickerInstance;
246
+
247
+ interface TrailerOptions {
248
+ triggers?: boolean | string;
249
+ autoplay?: boolean;
250
+ closeOnBackdrop?: boolean;
251
+ onOpen?: () => void;
252
+ onClose?: () => void;
253
+ }
254
+ interface TrailerInstance extends Instance {
255
+ open(origin?: HTMLElement | null): void;
256
+ close(): void;
257
+ toggle(origin?: HTMLElement | null): void;
258
+ play(): Promise<boolean>;
259
+ pause(): void;
260
+ seek(seconds: number): void;
261
+ setVolume(volume: number): void;
262
+ readonly isOpen: boolean;
263
+ }
264
+ /** Native modal + consumer-owned video, with optional accessible custom transport controls. */
265
+ declare function createTrailer(root: HTMLElement | null, options?: TrailerOptions): TrailerInstance;
266
+
57
267
  /**
58
268
  * Every duration in one place (seconds, like GSAP, unless the name says
59
269
  * ms). Recipes and components take their defaults from here, so a timing is
@@ -412,4 +622,4 @@ interface RevealHandle {
412
622
  }
413
623
  declare function revealFrom(target: HTMLElement, options?: RevealOptions): RevealHandle | null;
414
624
 
415
- export { type DialogInstance as D, type MenuInstance as M, type RevealHandle as R, TIMING as T, type DialogLabels as a, type DialogOptions as b, type DialogPlacement as c, type DialogVariant as d, type MenuOptions as e, type RevealOptions as f, type RevealSpeed as g, createDialog as h, createMenu as i, revealFrom as r };
625
+ export { type RevealOptions as A, type RevealSpeed as B, type CalendarInstance as C, type DialogInstance as D, type SlotPickerLabels as E, type SlotPickerOptions as F, type SlotSource as G, type HoverCardInstance as H, type InputOtpInstance as I, type SlotValue as J, type StudioDockOptions as K, type StudioDockState as L, type MenuInstance as M, TIMING as N, type TrailerOptions as O, type PaginationInstance as P, type QuantityInstance as Q, type RevealHandle as R, type StudioDockInstance as S, type TrailerInstance as T, createDialog as U, createMenu as V, dayKey as W, revealFrom as X, toDate as Y, createTrailer as a, createQuantity as b, createStudioDock as c, createPagination as d, createHoverCard as e, createInputOtp as f, createCalendar as g, createSlotPicker as h, type StudioDockView as i, type SlotPickerInstance as j, type CalendarEvent as k, type CalendarEventStatus as l, type CalendarLabels as m, type CalendarOptions as n, type CalendarRange as o, type CalendarView as p, type DateInput as q, type DialogLabels as r, type DialogOptions as s, type DialogPlacement as t, type DialogVariant as u, type HoverCardOptions as v, type InputOtpOptions as w, type MenuOptions as x, type PaginationOptions as y, type QuantityOptions as z };
@@ -1,6 +1,6 @@
1
1
  import { I as Instance } from './types-BkS_raL8.js';
2
2
  import { Flip } from 'gsap/Flip';
3
- import { R as RevealHandle } from './reveal-C0hCDcB_.js';
3
+ import { R as RevealHandle } from './reveal-jsX-uwUz.js';
4
4
 
5
5
  interface ThemePickerOptions {
6
6
  /** Theme ids to show, in order. Default: visible presets, or all with showHidden. */
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@yewdiel21/motion-kit",
3
- "version": "0.9.1",
3
+ "version": "0.10.0",
4
4
  "description": "Motion toolkit for vanilla, Astro and React: GSAP recipes, accessible components, 19 themes, CSS controls and optional WebGL effects.",
5
5
  "type": "module",
6
6
  "license": "UNLICENSED",