@yewdiel21/motion-kit 0.9.0 → 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.
- package/NOTICE +3 -35
- package/README.md +93 -81
- package/dist/auto/index.d.ts +22 -3
- package/dist/auto/index.js +43 -5
- package/dist/auto/index.js.map +1 -1
- package/dist/{chunk-KLY5BRRI.js → chunk-34EZ7DF4.js} +1 -1
- package/dist/chunk-34EZ7DF4.js.map +1 -0
- package/dist/{chunk-RFDIZYFX.js → chunk-DOOMULVV.js} +20 -20
- package/dist/chunk-DOOMULVV.js.map +1 -0
- package/dist/{chunk-ABNRDDO7.js → chunk-I3DXF2KQ.js} +2 -2
- package/dist/{chunk-Q4LVFNLN.js → chunk-IKQ5FODN.js} +4 -4
- package/dist/chunk-IKQ5FODN.js.map +1 -0
- package/dist/{chunk-2BQGFOA7.js → chunk-J6OCFNGU.js} +2 -2
- package/dist/chunk-J6OCFNGU.js.map +1 -0
- package/dist/{chunk-6OJAP6ZL.js → chunk-QFBOHPWZ.js} +3 -3
- package/dist/chunk-QFBOHPWZ.js.map +1 -0
- package/dist/{chunk-J27KH2A2.js → chunk-RVSKEBIC.js} +1 -1
- package/dist/chunk-RVSKEBIC.js.map +1 -0
- package/dist/{chunk-34XYOXHG.js → chunk-TFNRIZHU.js} +1615 -12
- package/dist/chunk-TFNRIZHU.js.map +1 -0
- package/dist/{chunk-FS2HJVVY.js → chunk-XAKC2QY7.js} +1204 -5
- package/dist/chunk-XAKC2QY7.js.map +1 -0
- package/dist/css/components/calendar.css +159 -0
- package/dist/css/components/chat-background.css +2 -2
- package/dist/css/components/chat.css +1 -1
- package/dist/css/components/cursor.css +3 -3
- package/dist/css/components/dialog.css +3 -3
- package/dist/css/components/hover-card.css +14 -0
- package/dist/css/components/input-otp.css +10 -0
- package/dist/css/components/island.css +1 -1
- package/dist/css/components/menu.css +1 -1
- package/dist/css/components/nav.css +1 -5
- package/dist/css/components/pagination.css +11 -0
- package/dist/css/components/quantity.css +16 -0
- package/dist/css/components/slot-picker.css +126 -0
- package/dist/css/components/steps.css +2 -2
- package/dist/css/components/studio-dock.css +35 -0
- package/dist/css/components/theme-picker.css +1 -1
- package/dist/css/components/toast.css +1 -1
- package/dist/css/components/trailer.css +37 -0
- package/dist/css/controls.css +78 -13
- package/dist/css/effects.css +8 -8
- package/dist/css/fonts.css +1 -1
- package/dist/css/themes/black-green.css +1 -1
- package/dist/css/themes/black.css +1 -1
- package/dist/css/themes/blue.css +1 -1
- package/dist/css/themes/brown.css +1 -1
- package/dist/css/themes/cold-blue.css +1 -1
- package/dist/css/themes/funny.css +1 -1
- package/dist/css/themes/gray.css +1 -1
- package/dist/css/themes/green.css +1 -1
- package/dist/css/themes/modern-1.css +1 -1
- package/dist/css/themes/neogreen.css +1 -1
- package/dist/css/themes/new.css +1 -1
- package/dist/css/themes/new2.css +1 -1
- package/dist/css/themes/oled.css +1 -1
- package/dist/css/themes/orange.css +1 -1
- package/dist/css/themes/pastel-pink.css +1 -1
- package/dist/css/themes/pink.css +1 -1
- package/dist/css/themes/purple.css +1 -1
- package/dist/css/themes/red.css +1 -1
- package/dist/css/themes/super-blue.css +1 -1
- package/dist/css/themes.css +19 -19
- package/dist/css/tokens.css +9 -9
- package/dist/elements/index.d.ts +75 -7
- package/dist/elements/index.js +172 -6
- package/dist/elements/index.js.map +1 -1
- package/dist/{engine-CUr9QijM.d.ts → engine-GDGwQnJE.d.ts} +2 -2
- package/dist/gl/index.js +3 -3
- package/dist/index.css +1076 -63
- package/dist/index.d.ts +17 -17
- package/dist/index.js +49 -7
- package/dist/index.js.map +1 -1
- package/dist/react/index.d.ts +139 -40
- package/dist/react/index.js +355 -8
- package/dist/react/index.js.map +1 -1
- package/dist/{reduced-BM4Ls0g5.d.ts → reduced-BmBzKH94.d.ts} +215 -18
- package/dist/{reveal-WFUWDrei.d.ts → reveal-jsX-uwUz.d.ts} +233 -24
- package/dist/{store-Bqy_obnD.d.ts → store-DYb3tTsZ.d.ts} +5 -5
- package/dist/theme/generate.d.ts +1 -1
- package/dist/theme/generate.js +2 -2
- package/dist/theme/generate.js.map +1 -1
- package/dist/theme/index.d.ts +2 -2
- package/dist/theme/index.js +2 -2
- package/dist/{theme-BFMoCzi6.d.ts → theme-Bjf9qIIy.d.ts} +1 -1
- package/package.json +2 -2
- package/registry.json +230 -156
- package/skills/motion-kit/SKILL.md +209 -189
- package/skills/motion-kit/reference/components.md +5 -5
- package/skills/motion-kit/reference/design.md +14 -14
- package/skills/motion-kit/reference/recipes.md +48 -49
- package/src/auto/auto-init.ts +38 -0
- package/src/components/calendar/README.md +82 -0
- package/src/components/calendar/calendar.css +158 -0
- package/src/components/calendar/element.ts +27 -0
- package/src/components/calendar/engine.ts +412 -0
- package/src/components/calendar/react.tsx +69 -0
- package/src/components/chat/README.md +1 -3
- package/src/components/chat/chat.css +1 -1
- package/src/components/chat/engine.ts +1 -1
- package/src/components/chat/react.tsx +1 -1
- package/src/components/chat-background/README.md +1 -3
- package/src/components/chat-background/audio.ts +1 -1
- package/src/components/chat-background/chat-background.css +2 -2
- package/src/components/chat-background/engine.ts +1 -1
- package/src/components/chat-background/react.tsx +1 -1
- package/src/components/cursor/README.md +3 -5
- package/src/components/cursor/cursor.css +3 -3
- package/src/components/cursor/element.ts +2 -2
- package/src/components/cursor/engine.ts +5 -5
- package/src/components/cursor/react.tsx +1 -1
- package/src/components/dialog/README.md +4 -8
- package/src/components/dialog/dialog.css +3 -3
- package/src/components/dialog/engine.ts +2 -2
- package/src/components/dialog/react.tsx +1 -1
- package/src/components/hover-card/README.md +16 -0
- package/src/components/hover-card/element.ts +8 -0
- package/src/components/hover-card/engine.ts +69 -0
- package/src/components/hover-card/hover-card.css +13 -0
- package/src/components/hover-card/react.tsx +19 -0
- package/src/components/input-otp/README.md +18 -0
- package/src/components/input-otp/element.ts +14 -0
- package/src/components/input-otp/engine.ts +106 -0
- package/src/components/input-otp/input-otp.css +9 -0
- package/src/components/input-otp/react.tsx +21 -0
- package/src/components/island/README.md +7 -7
- package/src/components/island/engine.ts +3 -3
- package/src/components/island/island.css +1 -1
- package/src/components/island/react.tsx +3 -3
- package/src/components/menu/README.md +2 -4
- package/src/components/menu/engine.ts +1 -1
- package/src/components/menu/menu.css +1 -1
- package/src/components/menu/react.tsx +1 -1
- package/src/components/nav/README.md +12 -14
- package/src/components/nav/engine.ts +5 -5
- package/src/components/nav/nav.css +1 -5
- package/src/components/nav/react.tsx +3 -3
- package/src/components/pagination/README.md +17 -0
- package/src/components/pagination/element.ts +14 -0
- package/src/components/pagination/engine.ts +102 -0
- package/src/components/pagination/pagination.css +10 -0
- package/src/components/pagination/react.tsx +22 -0
- package/src/components/quantity/README.md +20 -0
- package/src/components/quantity/element.ts +14 -0
- package/src/components/quantity/engine.ts +85 -0
- package/src/components/quantity/quantity.css +15 -0
- package/src/components/quantity/react.tsx +21 -0
- package/src/components/slot-picker/README.md +68 -0
- package/src/components/slot-picker/element.ts +27 -0
- package/src/components/slot-picker/engine.ts +412 -0
- package/src/components/slot-picker/react.tsx +76 -0
- package/src/components/slot-picker/slot-picker.css +125 -0
- package/src/components/steps/README.md +1 -3
- package/src/components/steps/engine.ts +3 -3
- package/src/components/steps/react.tsx +2 -2
- package/src/components/steps/steps.css +2 -2
- package/src/components/studio-dock/README.md +44 -0
- package/src/components/studio-dock/element.ts +11 -0
- package/src/components/studio-dock/engine.ts +212 -0
- package/src/components/studio-dock/react.tsx +23 -0
- package/src/components/studio-dock/studio-dock.css +34 -0
- package/src/components/theme-picker/README.md +3 -5
- package/src/components/theme-picker/engine.ts +2 -2
- package/src/components/theme-picker/react.tsx +1 -1
- package/src/components/theme-picker/theme-picker.css +1 -1
- package/src/components/toast/README.md +1 -3
- package/src/components/toast/engine.ts +2 -2
- package/src/components/toast/react.tsx +1 -1
- package/src/components/toast/store.ts +1 -2
- package/src/components/toast/toast.css +1 -1
- package/src/components/trailer/README.md +28 -0
- package/src/components/trailer/element.ts +13 -0
- package/src/components/trailer/engine.ts +189 -0
- package/src/components/trailer/react.tsx +16 -0
- package/src/components/trailer/trailer.css +36 -0
- package/src/core/channels.ts +3 -3
- package/src/core/curves.ts +3 -3
- package/src/core/dates.ts +98 -0
- package/src/core/gsap.ts +2 -2
- package/src/core/loop.ts +1 -1
- package/src/core/math.ts +1 -1
- package/src/core/physics-spring.ts +2 -2
- package/src/core/scroll-track.ts +2 -4
- package/src/core/spring.ts +1 -1
- package/src/core/timing.ts +21 -22
- package/src/css/controls/README.md +24 -20
- package/src/css/controls/burger.css +1 -1
- package/src/css/controls/button.css +4 -4
- package/src/css/controls/checkbox.css +1 -1
- package/src/css/controls/chip.css +1 -1
- package/src/css/controls/field.css +2 -2
- package/src/css/controls/glass.css +4 -4
- package/src/css/controls/status.css +63 -0
- package/src/css/default-theme.css +1 -1
- package/src/css/effects/README.md +19 -21
- package/src/css/effects/anim.css +1 -1
- package/src/css/effects/fade.css +1 -1
- package/src/css/effects/float.css +1 -1
- package/src/css/effects/frost.css +1 -1
- package/src/css/effects/grain.css +1 -1
- package/src/css/effects/loading.css +1 -1
- package/src/css/effects/success.css +1 -1
- package/src/css/effects/text.css +1 -1
- package/src/css/fonts.css +1 -1
- package/src/css/states.css +1 -1
- package/src/css/themes/black-green.css +1 -1
- package/src/css/themes/black.css +1 -1
- package/src/css/themes/blue.css +1 -1
- package/src/css/themes/brown.css +1 -1
- package/src/css/themes/cold-blue.css +1 -1
- package/src/css/themes/funny.css +1 -1
- package/src/css/themes/gray.css +1 -1
- package/src/css/themes/green.css +1 -1
- package/src/css/themes/modern-1.css +1 -1
- package/src/css/themes/neogreen.css +1 -1
- package/src/css/themes/new.css +1 -1
- package/src/css/themes/new2.css +1 -1
- package/src/css/themes/oled.css +1 -1
- package/src/css/themes/orange.css +1 -1
- package/src/css/themes/pastel-pink.css +1 -1
- package/src/css/themes/pink.css +1 -1
- package/src/css/themes/purple.css +1 -1
- package/src/css/themes/red.css +1 -1
- package/src/css/themes/super-blue.css +1 -1
- package/src/css/tokens.css +8 -8
- package/src/elements/index.ts +24 -0
- package/src/gl/liquid-blend/README.md +3 -3
- package/src/gl/matcap/README.md +3 -3
- package/src/gl/particle-hero/README.md +1 -1
- package/src/gl/particle-hero/create-particle-hero.ts +3 -5
- package/src/gl/particle-hero/shaders.ts +1 -1
- package/src/gl/shader-blur/README.md +3 -3
- package/src/gl/shader-grain/README.md +3 -3
- package/src/index.ts +25 -0
- package/src/motion/chat.ts +2 -2
- package/src/motion/confetti.ts +1 -1
- package/src/motion/count.ts +1 -1
- package/src/motion/details.ts +1 -1
- package/src/motion/drag-dismiss.ts +1 -1
- package/src/motion/effects.ts +1 -1
- package/src/motion/entrances.ts +1 -1
- package/src/motion/floating.ts +1 -1
- package/src/motion/flow.ts +2 -2
- package/src/motion/indicator.ts +1 -1
- package/src/motion/layout.ts +1 -1
- package/src/motion/liquid.ts +1 -1
- package/src/motion/morph.ts +2 -2
- package/src/motion/reveal.ts +1 -1
- package/src/motion/sheet.ts +1 -1
- package/src/motion/surface.ts +1 -1
- package/src/react/animated-number.tsx +2 -2
- package/src/react/flip-group.tsx +1 -1
- package/src/react/frost.tsx +1 -1
- package/src/react/index.ts +21 -0
- package/src/react/slot-text.tsx +1 -1
- package/src/react/use-action-button.ts +6 -0
- package/src/react/use-card-dock.ts +1 -1
- package/src/react/use-cascade.ts +1 -1
- package/src/react/use-contrast.ts +1 -1
- package/src/react/use-depth-grid.ts +1 -1
- package/src/react/use-editorial-reveal.ts +7 -0
- package/src/react/use-fill-text.ts +1 -1
- package/src/react/use-film-hero.ts +6 -0
- package/src/react/use-font-cycle.ts +7 -0
- package/src/react/use-frame-zoom.ts +1 -1
- package/src/react/use-image-zoom.ts +5 -0
- package/src/react/use-joined-cta.ts +5 -0
- package/src/react/use-letters.ts +1 -1
- package/src/react/use-local-clock.ts +5 -0
- package/src/react/use-marquee.ts +1 -1
- package/src/react/use-mask-text.ts +1 -1
- package/src/react/use-parallax.ts +1 -1
- package/src/react/use-particle-hero.ts +1 -1
- package/src/react/use-scroll-dock.ts +5 -0
- package/src/react/use-snap-strip.ts +1 -1
- package/src/react/use-sticker.ts +5 -0
- package/src/react/use-studio-dock.ts +8 -0
- package/src/react/use-text-roll.ts +1 -1
- package/src/react/use-thumbnail-nav.ts +7 -0
- package/src/react/use-trailer.ts +6 -0
- package/src/react/use-weight-hover.ts +5 -0
- package/src/recipes/action-button/README.md +31 -0
- package/src/recipes/action-button/action-button.css +113 -0
- package/src/recipes/action-button/create-action-button.ts +56 -0
- package/src/recipes/card-dock/README.md +1 -1
- package/src/recipes/card-dock/card-dock.css +1 -1
- package/src/recipes/card-dock/create-card-dock.ts +2 -2
- package/src/recipes/cascade/README.md +1 -3
- package/src/recipes/cascade/create-cascade.ts +3 -3
- package/src/recipes/contrast/README.md +0 -2
- package/src/recipes/contrast/create-contrast.ts +1 -1
- package/src/recipes/counter/README.md +0 -2
- package/src/recipes/counter/create-counter.ts +1 -1
- package/src/recipes/curved-carousel/README.md +0 -2
- package/src/recipes/curved-carousel/create-curved-carousel.ts +2 -2
- package/src/recipes/curved-carousel/curved-carousel.css +1 -1
- package/src/recipes/depth-grid/README.md +0 -2
- package/src/recipes/depth-grid/create-depth-grid.ts +3 -4
- package/src/recipes/details/README.md +0 -2
- package/src/recipes/details/create-details.ts +1 -1
- package/src/recipes/dock-pill/README.md +3 -3
- package/src/recipes/drag-ruler/README.md +3 -3
- package/src/recipes/editorial-reveal/README.md +35 -0
- package/src/recipes/editorial-reveal/create-editorial-reveal.ts +91 -0
- package/src/recipes/editorial-reveal/editorial-reveal.css +17 -0
- package/src/recipes/fill-text/README.md +1 -1
- package/src/recipes/fill-text/create-fill-text.ts +1 -1
- package/src/recipes/film-hero/README.md +23 -0
- package/src/recipes/film-hero/create-film-hero.ts +65 -0
- package/src/recipes/film-hero/film-hero.css +29 -0
- package/src/recipes/fit-text/README.md +0 -2
- package/src/recipes/flow/README.md +0 -2
- package/src/recipes/flow/create-flow.ts +1 -1
- package/src/recipes/font-cycle/README.md +11 -0
- package/src/recipes/font-cycle/create-font-cycle.ts +126 -0
- package/src/recipes/font-cycle/font-cycle.css +36 -0
- package/src/recipes/frame-zoom/README.md +1 -3
- package/src/recipes/frame-zoom/create-frame-zoom.ts +2 -2
- package/src/recipes/image-zoom/README.md +16 -0
- package/src/recipes/image-zoom/create-image-zoom.ts +27 -0
- package/src/recipes/image-zoom/image-zoom.css +7 -0
- package/src/recipes/infinite-reel/README.md +3 -3
- package/src/recipes/joined-cta/README.md +13 -0
- package/src/recipes/joined-cta/create-joined-cta.ts +22 -0
- package/src/recipes/joined-cta/joined-cta.css +17 -0
- package/src/recipes/letters/README.md +2 -4
- package/src/recipes/letters/create-letters.ts +3 -3
- package/src/recipes/local-clock/README.md +31 -0
- package/src/recipes/local-clock/create-local-clock.ts +61 -0
- package/src/recipes/marquee/README.md +0 -2
- package/src/recipes/marquee/create-marquee.ts +3 -3
- package/src/recipes/marquee/marquee.css +1 -1
- package/src/recipes/mask-text/README.md +3 -5
- package/src/recipes/mask-text/create-mask-text.ts +4 -4
- package/src/recipes/parallax/README.md +1 -3
- package/src/recipes/parallax/create-parallax.ts +1 -1
- package/src/recipes/pile/README.md +0 -2
- package/src/recipes/pile/create-pile.ts +1 -1
- package/src/recipes/pile/pile-math.ts +1 -1
- package/src/recipes/pile/pile.css +1 -1
- package/src/recipes/pill/README.md +0 -2
- package/src/recipes/pill/pill.css +2 -2
- package/src/recipes/pop/README.md +0 -2
- package/src/recipes/pop/create-pop.ts +1 -1
- package/src/recipes/radial-menu/README.md +0 -2
- package/src/recipes/radial-menu/create-radial-menu.ts +1 -1
- package/src/recipes/radial-menu/radial-menu.css +1 -1
- package/src/recipes/reflow/README.md +3 -5
- package/src/recipes/reflow/create-reflow.ts +1 -1
- package/src/recipes/repel-bento/README.md +3 -3
- package/src/recipes/reveal/README.md +0 -2
- package/src/recipes/reveal/create-reveal.ts +1 -1
- package/src/recipes/rotator/README.md +3 -3
- package/src/recipes/scroll-dock/README.md +46 -0
- package/src/recipes/scroll-dock/create-scroll-dock.ts +72 -0
- package/src/recipes/scroll-dock/scroll-dock.css +70 -0
- package/src/recipes/slot-text/README.md +0 -2
- package/src/recipes/slot-text/create-slot-text.ts +1 -1
- package/src/recipes/snap-strip/README.md +1 -1
- package/src/recipes/snap-strip/create-snap-strip.ts +5 -6
- package/src/recipes/snap-strip/snap-strip.css +1 -1
- package/src/recipes/sortable/README.md +3 -5
- package/src/recipes/sortable/create-sortable.ts +4 -4
- package/src/recipes/sortable/sortable.css +1 -1
- package/src/recipes/spring-cards/README.md +0 -2
- package/src/recipes/spring-cards/create-spring-cards.ts +1 -1
- package/src/recipes/spring-cards/spring-cards.css +1 -1
- package/src/recipes/sticker/README.md +59 -0
- package/src/recipes/sticker/create-sticker.ts +490 -0
- package/src/recipes/sticker/sticker.css +112 -0
- package/src/recipes/stretch-footer/README.md +0 -2
- package/src/recipes/stretch-footer/create-stretch-footer.ts +1 -1
- package/src/recipes/stretch-footer/stretch-footer.css +1 -1
- package/src/recipes/tabs/README.md +0 -2
- package/src/recipes/tabs/create-tabs.ts +1 -1
- package/src/recipes/text-roll/README.md +1 -3
- package/src/recipes/text-roll/create-text-roll.ts +3 -3
- package/src/recipes/text-roll/text-roll.css +1 -1
- package/src/recipes/thumbnail-nav/README.md +16 -0
- package/src/recipes/thumbnail-nav/create-thumbnail-nav.ts +165 -0
- package/src/recipes/thumbnail-nav/thumbnail-nav.css +108 -0
- package/src/recipes/ticket-menu/README.md +3 -3
- package/src/recipes/weight-hover/README.md +37 -0
- package/src/recipes/weight-hover/create-weight-hover.ts +136 -0
- package/src/recipes/weight-hover/weight-hover.css +7 -0
- package/src/recipes/words/README.md +0 -2
- package/src/recipes/words/create-words.ts +1 -1
- package/src/theme/generate.ts +1 -1
- package/src/theme/presets.ts +2 -2
- package/src/theme/theme.ts +1 -2
- package/dist/chunk-2BQGFOA7.js.map +0 -1
- package/dist/chunk-34XYOXHG.js.map +0 -1
- package/dist/chunk-6OJAP6ZL.js.map +0 -1
- package/dist/chunk-FS2HJVVY.js.map +0 -1
- package/dist/chunk-J27KH2A2.js.map +0 -1
- package/dist/chunk-KLY5BRRI.js.map +0 -1
- package/dist/chunk-Q4LVFNLN.js.map +0 -1
- package/dist/chunk-RFDIZYFX.js.map +0 -1
- /package/dist/{chunk-ABNRDDO7.js.map → chunk-I3DXF2KQ.js.map} +0 -0
package/NOTICE
CHANGED
|
@@ -1,38 +1,6 @@
|
|
|
1
1
|
motion-kit
|
|
2
2
|
Copyright 2026 Yewdiel Medina. All rights reserved.
|
|
3
3
|
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
images or fonts from those sites are included in this repository or in the
|
|
8
|
-
published package.
|
|
9
|
-
|
|
10
|
-
The 19 theme palettes (css/themes/*.css, css/default-theme.css) reproduce the
|
|
11
|
-
colour values of Stepbro's themes as data, and the controls reproduce the sizes
|
|
12
|
-
of its Material Web overrides. Fonts (DM Sans, Geist Mono, Material Symbols) are
|
|
13
|
-
loaded from Google Fonts, not bundled.
|
|
14
|
-
|
|
15
|
-
The glass control, progressive frost, floating tags, success confetti and
|
|
16
|
-
sheet dialog reproduce parameters observed in dousanmiao.com; the burger icon
|
|
17
|
-
and rolling button reproduce timings of siena.film's public CSS. No code from
|
|
18
|
-
their bundles is included; the film grain is an original CSS approximation.
|
|
19
|
-
The text and scroll recipes and the cursors (v0.6) reproduce parameters
|
|
20
|
-
observed in offficestud.io (masked type), siena.film (slot title, reveal group,
|
|
21
|
-
parallax, depth grid, video mask, header contrast, marquee, dot cursor) and
|
|
22
|
-
dousanmiao.com (hero letters, glass chip cursor); they are original code.
|
|
23
|
-
The island navbar, card dock, snap strip, fill text and particle hero (v0.7)
|
|
24
|
-
reproduce parameters observed in iyo.ai (floating navbar, product dock, phone
|
|
25
|
-
cards, fill-text, GPU particle hero); they are original code. The particle hero
|
|
26
|
-
is an own WebGL2 implementation of the observed mechanism, with its own shaders
|
|
27
|
-
and locally drawn words: no iyo.ai code, shaders, images, models or fonts.
|
|
28
|
-
|
|
29
|
-
The collections (v0.8) re-implement Siena's ticket menu and inertial reels and
|
|
30
|
-
Dousan's bento entry/repulsion, testimonials, years ruler and active dock pill.
|
|
31
|
-
The image effects (v0.9) use original WebGL shaders: OFFFICE's liquid/matcap
|
|
32
|
-
mechanisms adapted to images and an analytic sphere, and Siena's observed
|
|
33
|
-
grain intensity and directional blur weights. No third-party shaders, models,
|
|
34
|
-
images or fonts are redistributed. Playground SVG illustrations are original.
|
|
35
|
-
|
|
36
|
-
Parts of the Stepbro recipes, the spring channels, slot text, swatches, flip
|
|
37
|
-
group and animated number reuse code written by the same author for Kayro
|
|
38
|
-
(Apache License 2.0).
|
|
4
|
+
Parts of the recipes, spring channels, slot text, swatches, flip group and
|
|
5
|
+
animated number include code by the same author licensed under the
|
|
6
|
+
Apache License 2.0.
|
package/README.md
CHANGED
|
@@ -1,81 +1,93 @@
|
|
|
1
|
-
# @yewdiel21/motion-kit
|
|
2
|
-
|
|
3
|
-
Motion toolkit for vanilla JavaScript, Astro and React/Next.js. GSAP recipes, accessible UI components, 19 Material 3 themes, CSS controls and optional WebGL effects.
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
```
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
```
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
<
|
|
27
|
-
</
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
import
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
<
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
npx @yewdiel21/motion-kit
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
|
71
|
-
|
|
72
|
-
|
|
|
73
|
-
| `/
|
|
74
|
-
| `/
|
|
75
|
-
| `/
|
|
76
|
-
| `/
|
|
77
|
-
| `/
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
|
|
81
|
-
|
|
1
|
+
# @yewdiel21/motion-kit
|
|
2
|
+
|
|
3
|
+
Motion toolkit for vanilla JavaScript, Astro and React/Next.js. GSAP recipes, accessible UI components, 19 Material 3 themes, CSS controls and optional WebGL effects.
|
|
4
|
+
|
|
5
|
+
[Live playground](https://motion-kit-playground.vercel.app) — vanilla and React examples for every component.
|
|
6
|
+
|
|
7
|
+
## Install
|
|
8
|
+
|
|
9
|
+
```sh
|
|
10
|
+
npm install @yewdiel21/motion-kit gsap
|
|
11
|
+
```
|
|
12
|
+
|
|
13
|
+
For React components, install React 18 or newer. The theme generator additionally requires `@material/material-color-utilities@^0.3.0`.
|
|
14
|
+
|
|
15
|
+
## Vanilla / Astro
|
|
16
|
+
|
|
17
|
+
```ts
|
|
18
|
+
import '@yewdiel21/motion-kit/css';
|
|
19
|
+
import { autoInit } from '@yewdiel21/motion-kit/auto';
|
|
20
|
+
|
|
21
|
+
const destroy = autoInit(document);
|
|
22
|
+
```
|
|
23
|
+
|
|
24
|
+
```html
|
|
25
|
+
<div class="mk-segmented" data-mk="tabs">
|
|
26
|
+
<button data-mk-tab aria-selected="true">Today</button>
|
|
27
|
+
<button data-mk-tab>Week</button>
|
|
28
|
+
<span data-mk-indicator></span>
|
|
29
|
+
</div>
|
|
30
|
+
```
|
|
31
|
+
|
|
32
|
+
Call `destroy()` before replacing the DOM. Add `MK_HEAD_SCRIPT` from `/auto` inline to `<head>` when using entrance recipes, and `defineElements()` from `/elements` to register the `mk-*` custom elements.
|
|
33
|
+
|
|
34
|
+
## React / Next.js
|
|
35
|
+
|
|
36
|
+
```tsx
|
|
37
|
+
'use client';
|
|
38
|
+
|
|
39
|
+
import '@yewdiel21/motion-kit/css';
|
|
40
|
+
import { useRef } from 'react';
|
|
41
|
+
import { useTabs } from '@yewdiel21/motion-kit/react';
|
|
42
|
+
|
|
43
|
+
export function Tabs() {
|
|
44
|
+
const ref = useRef<HTMLDivElement>(null);
|
|
45
|
+
useTabs(ref);
|
|
46
|
+
return (
|
|
47
|
+
<div ref={ref} className="mk-segmented">
|
|
48
|
+
<button data-mk-tab aria-selected="true">Today</button>
|
|
49
|
+
<button data-mk-tab>Week</button>
|
|
50
|
+
<span data-mk-indicator="" />
|
|
51
|
+
</div>
|
|
52
|
+
);
|
|
53
|
+
}
|
|
54
|
+
```
|
|
55
|
+
|
|
56
|
+
Hooks create the engine after mount and destroy it on unmount. Import themes separately from `/css/themes`, fonts from `/css/fonts`, and theme utilities from `/theme`.
|
|
57
|
+
|
|
58
|
+
## Copy source with the CLI
|
|
59
|
+
|
|
60
|
+
```sh
|
|
61
|
+
npx @yewdiel21/motion-kit list
|
|
62
|
+
npx @yewdiel21/motion-kit add tabs island drag-ruler --react --elements --dir src/motion-kit
|
|
63
|
+
npx @yewdiel21/motion-kit skill
|
|
64
|
+
```
|
|
65
|
+
|
|
66
|
+
The CLI copies the selected components, their dependencies and CSS. Each copied folder includes its README. It does not overwrite files without `--force`.
|
|
67
|
+
|
|
68
|
+
## Entry points
|
|
69
|
+
|
|
70
|
+
| Import | Contents |
|
|
71
|
+
|---|---|
|
|
72
|
+
| `@yewdiel21/motion-kit` | Factories, motion functions, easings and timing constants |
|
|
73
|
+
| `/auto` | Declarative `data-mk` initialization and head script |
|
|
74
|
+
| `/react` | Hooks and React components |
|
|
75
|
+
| `/elements` | Custom elements |
|
|
76
|
+
| `/theme` | Theme runtime and head script |
|
|
77
|
+
| `/theme/generate` | Optional Material 3 palette generator |
|
|
78
|
+
| `/gl` | Particle hero, liquid blend, matcap, shader grain and blur |
|
|
79
|
+
| `/css`, `/css/themes`, `/css/fonts` | Styles, theme palettes and font imports |
|
|
80
|
+
|
|
81
|
+
WebGL is optional. Keep accessible text and images in HTML; effects provide a fallback when graphics support is unavailable. Motion recipes respect reduced-motion preferences and return an idempotent `destroy()`.
|
|
82
|
+
|
|
83
|
+
Full component documentation and the playground source are in the [repository](https://github.com/YewdielMartinez/motion-kit). Each component README documents its markup, options and controls. License notices: `NOTICE`. License: `UNLICENSED`; all rights reserved.
|
|
84
|
+
|
|
85
|
+
## New in 0.10.0
|
|
86
|
+
|
|
87
|
+
Nineteen entries, each with vanilla and React demos in the playground:
|
|
88
|
+
|
|
89
|
+
- **Components** (factory, React and custom element): `quantity`, `pagination`, `hover-card`, `input-otp`, `studio-dock`, `trailer`, `calendar` (month and week views with events, ARIA grid) and `slot-picker` (day and time slots for bookings; accepts lists, maps or promises and submits through a hidden input).
|
|
90
|
+
- **Recipes** (factory, hook and `autoInit()`): `joined-cta`, `image-zoom`, `font-cycle`, `thumbnail-nav`, `action-button`, `film-hero`, `editorial-reveal`, `weight-hover` (requires a variable font), `sticker`, `scroll-dock` and `local-clock`.
|
|
91
|
+
- **CSS control**: `.mk-status`, an availability pill with a pulsing dot.
|
|
92
|
+
|
|
93
|
+
All new entries return an idempotent `destroy()`, support the keyboard and respect reduced motion. No original assets from the reference sites are included.
|
package/dist/auto/index.d.ts
CHANGED
|
@@ -1,10 +1,29 @@
|
|
|
1
|
-
import { c as createSpringCards, C as CurvedCarouselInstance,
|
|
2
|
-
export {
|
|
1
|
+
import { c as createJoinedCta, a as createImageZoom, b as createFontCycle, d as createThumbnailNav, e as createActionButton, f as createFilmHero, g as createEditorialReveal, h as createWeightHover, i as createSticker, j as createScrollDock, k as createLocalClock, l as createSpringCards, C as CurvedCarouselInstance, m as createPile, n as createWords, o as createFlow, p as createPop, q as createFitText, r as createStretchFooter, s as createRadialMenu, t as createTabs, u as createCounter, v as createReveal, w as createReflow, x as createSlotText, y as createSortable, z as createMaskText, A as createCascade, B as createTextRoll, D as createLetters, E as createParallax, F as createDepthGrid, G as createFrameZoom, H as createContrast, I as createMarquee, J as createCardDock, K as createSnapStrip, L as createFillText, T as TicketMenuOptions, M as TicketMenuInstance, N as createInfiniteReel, O as createRepelBento, P as createRotator, Q as createDragRuler, R as createDockPill } from '../reduced-BmBzKH94.js';
|
|
2
|
+
export { S as MK_HEAD_SCRIPT } from '../reduced-BmBzKH94.js';
|
|
3
|
+
import { c as createStudioDock, a as createTrailer, b as createQuantity, d as createPagination, e as createHoverCard, f as createInputOtp, g as createCalendar, h as createSlotPicker } from '../reveal-jsX-uwUz.js';
|
|
3
4
|
import { I as Instance } from '../types-BkS_raL8.js';
|
|
4
|
-
import '../reveal-WFUWDrei.js';
|
|
5
5
|
import 'gsap/SplitText';
|
|
6
6
|
|
|
7
7
|
declare const factories: {
|
|
8
|
+
'joined-cta': typeof createJoinedCta;
|
|
9
|
+
'image-zoom': typeof createImageZoom;
|
|
10
|
+
'font-cycle': typeof createFontCycle;
|
|
11
|
+
'thumbnail-nav': typeof createThumbnailNav;
|
|
12
|
+
'action-button': typeof createActionButton;
|
|
13
|
+
'film-hero': typeof createFilmHero;
|
|
14
|
+
'editorial-reveal': typeof createEditorialReveal;
|
|
15
|
+
'studio-dock': typeof createStudioDock;
|
|
16
|
+
trailer: typeof createTrailer;
|
|
17
|
+
quantity: typeof createQuantity;
|
|
18
|
+
pagination: typeof createPagination;
|
|
19
|
+
'hover-card': typeof createHoverCard;
|
|
20
|
+
'input-otp': typeof createInputOtp;
|
|
21
|
+
calendar: typeof createCalendar;
|
|
22
|
+
'slot-picker': typeof createSlotPicker;
|
|
23
|
+
'weight-hover': typeof createWeightHover;
|
|
24
|
+
sticker: typeof createSticker;
|
|
25
|
+
'scroll-dock': typeof createScrollDock;
|
|
26
|
+
'local-clock': typeof createLocalClock;
|
|
8
27
|
'spring-cards': typeof createSpringCards;
|
|
9
28
|
'curved-carousel': (el: HTMLElement, options: Record<string, unknown>) => CurvedCarouselInstance;
|
|
10
29
|
pile: typeof createPile;
|
package/dist/auto/index.js
CHANGED
|
@@ -1,4 +1,5 @@
|
|
|
1
1
|
import {
|
|
2
|
+
createActionButton,
|
|
2
3
|
createCardDock,
|
|
3
4
|
createCascade,
|
|
4
5
|
createContrast,
|
|
@@ -8,12 +9,18 @@ import {
|
|
|
8
9
|
createDetails,
|
|
9
10
|
createDockPill,
|
|
10
11
|
createDragRuler,
|
|
12
|
+
createEditorialReveal,
|
|
11
13
|
createFillText,
|
|
14
|
+
createFilmHero,
|
|
12
15
|
createFitText,
|
|
13
16
|
createFlow,
|
|
17
|
+
createFontCycle,
|
|
14
18
|
createFrameZoom,
|
|
19
|
+
createImageZoom,
|
|
15
20
|
createInfiniteReel,
|
|
21
|
+
createJoinedCta,
|
|
16
22
|
createLetters,
|
|
23
|
+
createLocalClock,
|
|
17
24
|
createMarquee,
|
|
18
25
|
createMaskText,
|
|
19
26
|
createParallax,
|
|
@@ -24,23 +31,35 @@ import {
|
|
|
24
31
|
createRepelBento,
|
|
25
32
|
createReveal,
|
|
26
33
|
createRotator,
|
|
34
|
+
createScrollDock,
|
|
27
35
|
createSlotText,
|
|
28
36
|
createSnapStrip,
|
|
29
37
|
createSortable,
|
|
30
38
|
createSpringCards,
|
|
39
|
+
createSticker,
|
|
31
40
|
createStretchFooter,
|
|
32
41
|
createTabs,
|
|
33
42
|
createTextRoll,
|
|
43
|
+
createThumbnailNav,
|
|
34
44
|
createTicketMenu,
|
|
45
|
+
createWeightHover,
|
|
35
46
|
createWords
|
|
36
|
-
} from "../chunk-
|
|
47
|
+
} from "../chunk-XAKC2QY7.js";
|
|
37
48
|
import {
|
|
38
|
-
ScrollTrigger
|
|
39
|
-
|
|
40
|
-
|
|
49
|
+
ScrollTrigger,
|
|
50
|
+
createCalendar,
|
|
51
|
+
createHoverCard,
|
|
52
|
+
createInputOtp,
|
|
53
|
+
createPagination,
|
|
54
|
+
createQuantity,
|
|
55
|
+
createSlotPicker,
|
|
56
|
+
createStudioDock,
|
|
57
|
+
createTrailer
|
|
58
|
+
} from "../chunk-TFNRIZHU.js";
|
|
59
|
+
import "../chunk-34EZ7DF4.js";
|
|
41
60
|
import {
|
|
42
61
|
MK_HEAD_SCRIPT
|
|
43
|
-
} from "../chunk-
|
|
62
|
+
} from "../chunk-DOOMULVV.js";
|
|
44
63
|
import {
|
|
45
64
|
warnOnce
|
|
46
65
|
} from "../chunk-TGV27ZWM.js";
|
|
@@ -110,6 +129,25 @@ function parseOptions(el) {
|
|
|
110
129
|
|
|
111
130
|
// src/auto/auto-init.ts
|
|
112
131
|
var factories = {
|
|
132
|
+
"joined-cta": createJoinedCta,
|
|
133
|
+
"image-zoom": createImageZoom,
|
|
134
|
+
"font-cycle": createFontCycle,
|
|
135
|
+
"thumbnail-nav": createThumbnailNav,
|
|
136
|
+
"action-button": createActionButton,
|
|
137
|
+
"film-hero": createFilmHero,
|
|
138
|
+
"editorial-reveal": createEditorialReveal,
|
|
139
|
+
"studio-dock": createStudioDock,
|
|
140
|
+
"trailer": createTrailer,
|
|
141
|
+
"quantity": createQuantity,
|
|
142
|
+
"pagination": createPagination,
|
|
143
|
+
"hover-card": createHoverCard,
|
|
144
|
+
"input-otp": createInputOtp,
|
|
145
|
+
"calendar": createCalendar,
|
|
146
|
+
"slot-picker": createSlotPicker,
|
|
147
|
+
"weight-hover": createWeightHover,
|
|
148
|
+
"sticker": createSticker,
|
|
149
|
+
"scroll-dock": createScrollDock,
|
|
150
|
+
"local-clock": createLocalClock,
|
|
113
151
|
"spring-cards": createSpringCards,
|
|
114
152
|
"curved-carousel": (el, options) => createCurvedCarousel(el, {
|
|
115
153
|
...options,
|
package/dist/auto/index.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../src/auto/parse-options.ts","../../src/auto/auto-init.ts"],"sourcesContent":["/** Attributes the recipes write themselves or use for children; never options. */\nconst RESERVED = new Set([\n '',\n 'ready',\n 'inview',\n 'carousel',\n 'open',\n 'card',\n 'slide',\n 'toggle',\n 'item',\n 'phantom',\n 'footerTitle',\n 'tab',\n 'indicator',\n 'chevron',\n 'text',\n 'role',\n 'motion',\n 'veil',\n 'swatch',\n 'part',\n 'sorting',\n 'sortableGroup',\n 'sortableLocked',\n 'cascade',\n 'on',\n 'tone',\n 'cursorZone',\n 'hidden',\n 'pressed',\n 'parallaxTarget',\n 'spread',\n 'expanded',\n 'settled',\n 'mode',\n 'active',\n 'islandToggle',\n 'islandPanel',\n 'islandItem',\n 'islandClose',\n 'reelTrack',\n 'reelCopy',\n 'dragging',\n 'dockItem',\n]);\n\nconst coerce = (value: string): unknown => {\n if (value === '' || value === 'true') return true;\n if (value === 'false') return false;\n if (/^-?\\d*\\.?\\d+$/.test(value)) return Number(value);\n return value;\n};\n\n/**\n * `data-mk-<option>` attributes → options object.\n * `data-mk-throw-boost=\"2.5\"` → `{ throwBoost: 2.5 }`, `data-mk-trigger=\"load\"` → `{ trigger: 'load' }`.\n */\nexport function parseOptions(el: HTMLElement): Record<string, unknown> {\n const options: Record<string, unknown> = {};\n for (const [key, raw] of Object.entries(el.dataset)) {\n if (!key.startsWith('mk') || key.length === 2) continue;\n const name = key.charAt(2).toLowerCase() + key.slice(3);\n if (RESERVED.has(name)) continue;\n options[name] = coerce(raw ?? '');\n }\n return options;\n}\n","import { ScrollTrigger } from '../core/gsap';\nimport { warnOnce, type Instance } from '../core/types';\nimport { createSpringCards } from '../recipes/spring-cards/create-spring-cards';\nimport { createCurvedCarousel } from '../recipes/curved-carousel/create-curved-carousel';\nimport { createPile } from '../recipes/pile/create-pile';\nimport { createWords } from '../recipes/words/create-words';\nimport { createFlow } from '../recipes/flow/create-flow';\nimport { createPop } from '../recipes/pop/create-pop';\nimport { createFitText } from '../recipes/fit-text/create-fit-text';\nimport { createStretchFooter } from '../recipes/stretch-footer/create-stretch-footer';\nimport { createRadialMenu } from '../recipes/radial-menu/create-radial-menu';\nimport { createTabs } from '../recipes/tabs/create-tabs';\nimport { createCounter } from '../recipes/counter/create-counter';\nimport { createDetails } from '../recipes/details/create-details';\nimport { createReveal } from '../recipes/reveal/create-reveal';\nimport { createReflow } from '../recipes/reflow/create-reflow';\nimport { createSlotText } from '../recipes/slot-text/create-slot-text';\nimport { createSortable } from '../recipes/sortable/create-sortable';\nimport { createMaskText } from '../recipes/mask-text/create-mask-text';\nimport { createCascade } from '../recipes/cascade/create-cascade';\nimport { createTextRoll } from '../recipes/text-roll/create-text-roll';\nimport { createLetters } from '../recipes/letters/create-letters';\nimport { createParallax } from '../recipes/parallax/create-parallax';\nimport { createDepthGrid } from '../recipes/depth-grid/create-depth-grid';\nimport { createFrameZoom } from '../recipes/frame-zoom/create-frame-zoom';\nimport { createContrast } from '../recipes/contrast/create-contrast';\nimport { createMarquee } from '../recipes/marquee/create-marquee';\nimport { createCardDock } from '../recipes/card-dock/create-card-dock';\nimport { createSnapStrip } from '../recipes/snap-strip/create-snap-strip';\nimport { createFillText } from '../recipes/fill-text/create-fill-text';\nimport { parseOptions } from './parse-options';\nimport { createTicketMenu } from '../recipes/ticket-menu/create-ticket-menu';\nimport { createInfiniteReel } from '../recipes/infinite-reel/create-infinite-reel';\nimport { createRepelBento } from '../recipes/repel-bento/create-repel-bento';\nimport { createRotator } from '../recipes/rotator/create-rotator';\nimport { createDragRuler } from '../recipes/drag-ruler/create-drag-ruler';\nimport { createDockPill } from '../recipes/dock-pill/create-dock-pill';\n\ntype Factory = (el: HTMLElement, options: Record<string, unknown>) => Instance;\n\nconst factories = {\n 'spring-cards': createSpringCards,\n 'curved-carousel': (el, options) =>\n createCurvedCarousel(el, {\n ...options,\n onSelect: (index, slide) => el.dispatchEvent(new CustomEvent('mk:select', { detail: { index, slide }, bubbles: true })),\n }),\n pile: createPile,\n words: createWords,\n flow: createFlow,\n pop: createPop,\n 'fit-text': createFitText,\n 'stretch-footer': createStretchFooter,\n 'radial-menu': createRadialMenu,\n tabs: createTabs,\n counter: createCounter,\n details: (el) => createDetails(el),\n reveal: createReveal,\n reflow: createReflow,\n 'slot-text': createSlotText,\n sortable: createSortable,\n 'mask-text': createMaskText,\n cascade: createCascade,\n 'text-roll': createTextRoll,\n letters: createLetters,\n parallax: createParallax,\n 'depth-grid': createDepthGrid,\n 'frame-zoom': createFrameZoom,\n contrast: createContrast,\n marquee: createMarquee,\n 'card-dock': createCardDock,\n 'snap-strip': createSnapStrip,\n 'fill-text': createFillText,\n 'ticket-menu': createTicketMenu,\n 'infinite-reel': createInfiniteReel,\n 'repel-bento': createRepelBento,\n 'rotator': createRotator,\n 'drag-ruler': createDragRuler,\n 'dock-pill': createDockPill,\n} satisfies Record<string, Factory>;\n\nexport type RecipeName = keyof typeof factories;\nexport const recipeNames = Object.keys(factories) as RecipeName[];\n\n/** Measured text: wait for web fonts, fit before splitting into words. */\nconst AFTER_FONTS: RecipeName[] = ['fit-text', 'words', 'slot-text'];\n\nconst instances = new WeakMap<HTMLElement, Map<RecipeName, Instance>>();\n\nexport interface AutoInitOptions {\n /** Only start these recipes. */\n only?: RecipeName[];\n}\n\n/**\n * Start every `[data-mk]` recipe inside `root` (an element may list several:\n * `data-mk=\"fit-text words\"`). Options come from `data-mk-*` attributes.\n * Returns a function that destroys what this call created. Safe to call again:\n * elements that already run a recipe are skipped.\n */\nexport function autoInit(root: ParentNode = document, { only }: AutoInitOptions = {}): () => void {\n if (typeof window === 'undefined') return () => {};\n const created: Array<[HTMLElement, RecipeName, Instance]> = [];\n let cancelled = false;\n\n const elements = [...root.querySelectorAll<HTMLElement>('[data-mk]')];\n if (root instanceof HTMLElement && root.matches('[data-mk]')) elements.unshift(root);\n\n const start = (el: HTMLElement, name: RecipeName) => {\n if (cancelled) return;\n const running = instances.get(el) ?? new Map<RecipeName, Instance>();\n if (running.has(name)) return;\n const instance = (factories[name] as Factory)(el, parseOptions(el));\n running.set(name, instance);\n instances.set(el, running);\n created.push([el, name, instance]);\n };\n\n const now: Array<[HTMLElement, RecipeName]> = [];\n const later: Array<[HTMLElement, RecipeName]> = [];\n for (const el of elements) {\n for (const raw of (el.dataset.mk ?? '').split(/\\s+/).filter(Boolean)) {\n if (!(raw in factories)) {\n warnOnce(`autoInit: unknown recipe \"${raw}\" (known: ${recipeNames.join(', ')})`);\n continue;\n }\n const name = raw as RecipeName;\n if (only && !only.includes(name)) continue;\n (AFTER_FONTS.includes(name) ? later : now).push([el, name]);\n }\n }\n\n now.forEach(([el, name]) => start(el, name));\n if (later.length) {\n later.sort((a, b) => AFTER_FONTS.indexOf(a[1]) - AFTER_FONTS.indexOf(b[1]));\n const fonts = document.fonts?.ready ?? Promise.resolve();\n void Promise.race([fonts, new Promise((resolve) => setTimeout(resolve, 1500))]).then(() => {\n later.forEach(([el, name]) => start(el, name));\n if (!cancelled) ScrollTrigger.refresh();\n });\n }\n\n return () => {\n cancelled = true;\n for (const [el, name, instance] of created.reverse()) {\n instance.destroy();\n instances.get(el)?.delete(name);\n }\n created.length = 0;\n };\n}\n"],"mappings":"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","names":[]}
|
|
1
|
+
{"version":3,"sources":["../../src/auto/parse-options.ts","../../src/auto/auto-init.ts"],"sourcesContent":["/** Attributes the recipes write themselves or use for children; never options. */\nconst RESERVED = new Set([\n '',\n 'ready',\n 'inview',\n 'carousel',\n 'open',\n 'card',\n 'slide',\n 'toggle',\n 'item',\n 'phantom',\n 'footerTitle',\n 'tab',\n 'indicator',\n 'chevron',\n 'text',\n 'role',\n 'motion',\n 'veil',\n 'swatch',\n 'part',\n 'sorting',\n 'sortableGroup',\n 'sortableLocked',\n 'cascade',\n 'on',\n 'tone',\n 'cursorZone',\n 'hidden',\n 'pressed',\n 'parallaxTarget',\n 'spread',\n 'expanded',\n 'settled',\n 'mode',\n 'active',\n 'islandToggle',\n 'islandPanel',\n 'islandItem',\n 'islandClose',\n 'reelTrack',\n 'reelCopy',\n 'dragging',\n 'dockItem',\n]);\n\nconst coerce = (value: string): unknown => {\n if (value === '' || value === 'true') return true;\n if (value === 'false') return false;\n if (/^-?\\d*\\.?\\d+$/.test(value)) return Number(value);\n return value;\n};\n\n/**\n * `data-mk-<option>` attributes → options object.\n * `data-mk-throw-boost=\"2.5\"` → `{ throwBoost: 2.5 }`, `data-mk-trigger=\"load\"` → `{ trigger: 'load' }`.\n */\nexport function parseOptions(el: HTMLElement): Record<string, unknown> {\n const options: Record<string, unknown> = {};\n for (const [key, raw] of Object.entries(el.dataset)) {\n if (!key.startsWith('mk') || key.length === 2) continue;\n const name = key.charAt(2).toLowerCase() + key.slice(3);\n if (RESERVED.has(name)) continue;\n options[name] = coerce(raw ?? '');\n }\n return options;\n}\n","import { createQuantity } from '../components/quantity/engine';\nimport { createPagination } from '../components/pagination/engine';\nimport { createHoverCard } from '../components/hover-card/engine';\nimport { createInputOtp } from '../components/input-otp/engine';\nimport { createJoinedCta } from '../recipes/joined-cta/create-joined-cta';\nimport { createImageZoom } from '../recipes/image-zoom/create-image-zoom';\nimport { createFontCycle } from '../recipes/font-cycle/create-font-cycle';\nimport { createThumbnailNav } from '../recipes/thumbnail-nav/create-thumbnail-nav';\nimport { createActionButton } from '../recipes/action-button/create-action-button';\nimport { createFilmHero } from '../recipes/film-hero/create-film-hero';\nimport { createEditorialReveal } from '../recipes/editorial-reveal/create-editorial-reveal';\nimport { createStudioDock } from '../components/studio-dock/engine';\nimport { createCalendar } from '../components/calendar/engine';\nimport { createSlotPicker } from '../components/slot-picker/engine';\nimport { createWeightHover } from '../recipes/weight-hover/create-weight-hover';\nimport { createSticker } from '../recipes/sticker/create-sticker';\nimport { createScrollDock } from '../recipes/scroll-dock/create-scroll-dock';\nimport { createLocalClock } from '../recipes/local-clock/create-local-clock';\nimport { createTrailer } from '../components/trailer/engine';\nimport { ScrollTrigger } from '../core/gsap';\nimport { warnOnce, type Instance } from '../core/types';\nimport { createSpringCards } from '../recipes/spring-cards/create-spring-cards';\nimport { createCurvedCarousel } from '../recipes/curved-carousel/create-curved-carousel';\nimport { createPile } from '../recipes/pile/create-pile';\nimport { createWords } from '../recipes/words/create-words';\nimport { createFlow } from '../recipes/flow/create-flow';\nimport { createPop } from '../recipes/pop/create-pop';\nimport { createFitText } from '../recipes/fit-text/create-fit-text';\nimport { createStretchFooter } from '../recipes/stretch-footer/create-stretch-footer';\nimport { createRadialMenu } from '../recipes/radial-menu/create-radial-menu';\nimport { createTabs } from '../recipes/tabs/create-tabs';\nimport { createCounter } from '../recipes/counter/create-counter';\nimport { createDetails } from '../recipes/details/create-details';\nimport { createReveal } from '../recipes/reveal/create-reveal';\nimport { createReflow } from '../recipes/reflow/create-reflow';\nimport { createSlotText } from '../recipes/slot-text/create-slot-text';\nimport { createSortable } from '../recipes/sortable/create-sortable';\nimport { createMaskText } from '../recipes/mask-text/create-mask-text';\nimport { createCascade } from '../recipes/cascade/create-cascade';\nimport { createTextRoll } from '../recipes/text-roll/create-text-roll';\nimport { createLetters } from '../recipes/letters/create-letters';\nimport { createParallax } from '../recipes/parallax/create-parallax';\nimport { createDepthGrid } from '../recipes/depth-grid/create-depth-grid';\nimport { createFrameZoom } from '../recipes/frame-zoom/create-frame-zoom';\nimport { createContrast } from '../recipes/contrast/create-contrast';\nimport { createMarquee } from '../recipes/marquee/create-marquee';\nimport { createCardDock } from '../recipes/card-dock/create-card-dock';\nimport { createSnapStrip } from '../recipes/snap-strip/create-snap-strip';\nimport { createFillText } from '../recipes/fill-text/create-fill-text';\nimport { parseOptions } from './parse-options';\nimport { createTicketMenu } from '../recipes/ticket-menu/create-ticket-menu';\nimport { createInfiniteReel } from '../recipes/infinite-reel/create-infinite-reel';\nimport { createRepelBento } from '../recipes/repel-bento/create-repel-bento';\nimport { createRotator } from '../recipes/rotator/create-rotator';\nimport { createDragRuler } from '../recipes/drag-ruler/create-drag-ruler';\nimport { createDockPill } from '../recipes/dock-pill/create-dock-pill';\n\ntype Factory = (el: HTMLElement, options: Record<string, unknown>) => Instance;\n\nconst factories = {\n 'joined-cta': createJoinedCta,\n 'image-zoom': createImageZoom,\n 'font-cycle': createFontCycle,\n 'thumbnail-nav': createThumbnailNav,\n 'action-button': createActionButton,\n 'film-hero': createFilmHero,\n 'editorial-reveal': createEditorialReveal,\n 'studio-dock': createStudioDock,\n 'trailer': createTrailer,\n 'quantity': createQuantity,\n 'pagination': createPagination,\n 'hover-card': createHoverCard,\n 'input-otp': createInputOtp,\n 'calendar': createCalendar,\n 'slot-picker': createSlotPicker,\n 'weight-hover': createWeightHover,\n 'sticker': createSticker,\n 'scroll-dock': createScrollDock,\n 'local-clock': createLocalClock,\n 'spring-cards': createSpringCards,\n 'curved-carousel': (el, options) =>\n createCurvedCarousel(el, {\n ...options,\n onSelect: (index, slide) => el.dispatchEvent(new CustomEvent('mk:select', { detail: { index, slide }, bubbles: true })),\n }),\n pile: createPile,\n words: createWords,\n flow: createFlow,\n pop: createPop,\n 'fit-text': createFitText,\n 'stretch-footer': createStretchFooter,\n 'radial-menu': createRadialMenu,\n tabs: createTabs,\n counter: createCounter,\n details: (el) => createDetails(el),\n reveal: createReveal,\n reflow: createReflow,\n 'slot-text': createSlotText,\n sortable: createSortable,\n 'mask-text': createMaskText,\n cascade: createCascade,\n 'text-roll': createTextRoll,\n letters: createLetters,\n parallax: createParallax,\n 'depth-grid': createDepthGrid,\n 'frame-zoom': createFrameZoom,\n contrast: createContrast,\n marquee: createMarquee,\n 'card-dock': createCardDock,\n 'snap-strip': createSnapStrip,\n 'fill-text': createFillText,\n 'ticket-menu': createTicketMenu,\n 'infinite-reel': createInfiniteReel,\n 'repel-bento': createRepelBento,\n 'rotator': createRotator,\n 'drag-ruler': createDragRuler,\n 'dock-pill': createDockPill,\n} satisfies Record<string, Factory>;\n\nexport type RecipeName = keyof typeof factories;\nexport const recipeNames = Object.keys(factories) as RecipeName[];\n\n/** Measured text: wait for web fonts, fit before splitting into words. */\nconst AFTER_FONTS: RecipeName[] = ['fit-text', 'words', 'slot-text'];\n\nconst instances = new WeakMap<HTMLElement, Map<RecipeName, Instance>>();\n\nexport interface AutoInitOptions {\n /** Only start these recipes. */\n only?: RecipeName[];\n}\n\n/**\n * Start every `[data-mk]` recipe inside `root` (an element may list several:\n * `data-mk=\"fit-text words\"`). Options come from `data-mk-*` attributes.\n * Returns a function that destroys what this call created. Safe to call again:\n * elements that already run a recipe are skipped.\n */\nexport function autoInit(root: ParentNode = document, { only }: AutoInitOptions = {}): () => void {\n if (typeof window === 'undefined') return () => {};\n const created: Array<[HTMLElement, RecipeName, Instance]> = [];\n let cancelled = false;\n\n const elements = [...root.querySelectorAll<HTMLElement>('[data-mk]')];\n if (root instanceof HTMLElement && root.matches('[data-mk]')) elements.unshift(root);\n\n const start = (el: HTMLElement, name: RecipeName) => {\n if (cancelled) return;\n const running = instances.get(el) ?? new Map<RecipeName, Instance>();\n if (running.has(name)) return;\n const instance = (factories[name] as Factory)(el, parseOptions(el));\n running.set(name, instance);\n instances.set(el, running);\n created.push([el, name, instance]);\n };\n\n const now: Array<[HTMLElement, RecipeName]> = [];\n const later: Array<[HTMLElement, RecipeName]> = [];\n for (const el of elements) {\n for (const raw of (el.dataset.mk ?? '').split(/\\s+/).filter(Boolean)) {\n if (!(raw in factories)) {\n warnOnce(`autoInit: unknown recipe \"${raw}\" (known: ${recipeNames.join(', ')})`);\n continue;\n }\n const name = raw as RecipeName;\n if (only && !only.includes(name)) continue;\n (AFTER_FONTS.includes(name) ? later : now).push([el, name]);\n }\n }\n\n now.forEach(([el, name]) => start(el, name));\n if (later.length) {\n later.sort((a, b) => AFTER_FONTS.indexOf(a[1]) - AFTER_FONTS.indexOf(b[1]));\n const fonts = document.fonts?.ready ?? Promise.resolve();\n void Promise.race([fonts, new Promise((resolve) => setTimeout(resolve, 1500))]).then(() => {\n later.forEach(([el, name]) => start(el, name));\n if (!cancelled) ScrollTrigger.refresh();\n });\n }\n\n return () => {\n cancelled = true;\n for (const [el, name, instance] of created.reverse()) {\n instance.destroy();\n instances.get(el)?.delete(name);\n }\n created.length = 0;\n };\n}\n"],"mappings":"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","names":[]}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../src/core/math.ts"],"sourcesContent":["export const clamp = (v: number, min: number, max: number) => Math.min(max, Math.max(min, v));\r\nexport const lerp = (a: number, b: number, t: number) => (1 - t) * a + t * b;\r\n/** frame-rate independent smoothing: lerp by 1 - e^(-lambda·dt). */\r\nexport const damp = (a: number, b: number, lambda: number, dt: number) => lerp(a, b, 1 - Math.exp(-lambda * dt));\r\nexport const wrap = (v: number, length: number) => ((v % length) + length) % length;\r\nexport function mapRange(v: number, inMin: number, inMax: number, outMin: number, outMax: number, clamped = false) {\r\n const t = (v - inMin) / (inMax - inMin);\r\n return lerp(outMin, outMax, clamped ? clamp(t, 0, 1) : t);\r\n}\r\n"],"mappings":";AAAO,IAAM,QAAQ,CAAC,GAAW,KAAa,QAAgB,KAAK,IAAI,KAAK,KAAK,IAAI,KAAK,CAAC,CAAC;AACrF,IAAM,OAAO,CAAC,GAAW,GAAW,OAAe,IAAI,KAAK,IAAI,IAAI;AAEpE,IAAM,OAAO,CAAC,GAAW,GAAW,QAAgB,OAAe,KAAK,GAAG,GAAG,IAAI,KAAK,IAAI,CAAC,SAAS,EAAE,CAAC;AACxG,IAAM,OAAO,CAAC,GAAW,YAAqB,IAAI,SAAU,UAAU;AACtE,SAAS,SAAS,GAAW,OAAe,OAAe,QAAgB,QAAgB,UAAU,OAAO;AACjH,QAAM,KAAK,IAAI,UAAU,QAAQ;AACjC,SAAO,KAAK,QAAQ,QAAQ,UAAU,MAAM,GAAG,GAAG,CAAC,IAAI,CAAC;AAC1D;","names":[]}
|
|
@@ -99,9 +99,9 @@ var TIMING = Object.freeze({
|
|
|
99
99
|
charsDelay: 0.225,
|
|
100
100
|
charsStagger: 0.02
|
|
101
101
|
}),
|
|
102
|
-
/**
|
|
102
|
+
/** glass (CSS): surface/shadow transitions, ring and shine. */
|
|
103
103
|
glass: Object.freeze({ hover: 0.4, ring: 0.5 }),
|
|
104
|
-
/**
|
|
104
|
+
/** utility animations (css/effects/anim.css), by name. */
|
|
105
105
|
effects: Object.freeze({
|
|
106
106
|
out: 0.5,
|
|
107
107
|
"out-left": 0.5,
|
|
@@ -114,7 +114,7 @@ var TIMING = Object.freeze({
|
|
|
114
114
|
wipe: 0.7,
|
|
115
115
|
"progress-in": 1
|
|
116
116
|
}),
|
|
117
|
-
/**
|
|
117
|
+
/** success confetti, per 60 fps frame. */
|
|
118
118
|
confetti: Object.freeze({
|
|
119
119
|
count: 45,
|
|
120
120
|
speed: [2, 8],
|
|
@@ -125,9 +125,9 @@ var TIMING = Object.freeze({
|
|
|
125
125
|
drag: 0.98,
|
|
126
126
|
spin: 2.5
|
|
127
127
|
}),
|
|
128
|
-
/**
|
|
128
|
+
/** project sheet. */
|
|
129
129
|
sheet: Object.freeze({ open: 0.72, close: 0.72, underlayScale: 0.98, underlayOpacity: 0.4 }),
|
|
130
|
-
/**
|
|
130
|
+
/** Physical spring pairs: [stiffness, damping]. */
|
|
131
131
|
springs: Object.freeze({
|
|
132
132
|
press: [400, 10],
|
|
133
133
|
success: [260, 18],
|
|
@@ -139,13 +139,13 @@ var TIMING = Object.freeze({
|
|
|
139
139
|
bentoRepel: [300, 25],
|
|
140
140
|
dockPill: [380, 30]
|
|
141
141
|
}),
|
|
142
|
-
/**
|
|
142
|
+
/** masked type. */
|
|
143
143
|
maskText: Object.freeze({ duration: 1.2, delay: 0.1, stagger: 0.02, exitStagger: 2e-3, y: 100, threshold: 0.8 }),
|
|
144
|
-
/**
|
|
144
|
+
/** reveal group (rules, fades, rises). */
|
|
145
145
|
cascade: Object.freeze({ duration: 1.2, step: 0.03, rise: 200, threshold: 0.3 }),
|
|
146
|
-
/**
|
|
146
|
+
/** slot title: each letter turns 8–14 times inside a 2 s expo.out envelope. */
|
|
147
147
|
textRoll: Object.freeze({ duration: 2, stagger: 0.04, turns: [8, 14], interval: 6e3, quietMs: 1e3 }),
|
|
148
|
-
/**
|
|
148
|
+
/** hero letters: scale on hover, pastel blink. */
|
|
149
149
|
letters: Object.freeze({
|
|
150
150
|
scale: 1.3,
|
|
151
151
|
y: -5,
|
|
@@ -155,9 +155,9 @@ var TIMING = Object.freeze({
|
|
|
155
155
|
blinkRepeatDelay: 0.1,
|
|
156
156
|
blinkDelays: [0.1, 0.6, 0.2, 1, 0.4, 1.2, 0.15, 0.8, 0.3]
|
|
157
157
|
}),
|
|
158
|
-
/**
|
|
158
|
+
/** image parallax. */
|
|
159
159
|
parallax: Object.freeze({ travel: 10, scale: 1.2, strongScale: 1.3, lerp: 1 }),
|
|
160
|
-
/**
|
|
160
|
+
/** About grid gathering from depth. */
|
|
161
161
|
depthGrid: Object.freeze({
|
|
162
162
|
perspective: 600,
|
|
163
163
|
distance: 900,
|
|
@@ -168,7 +168,7 @@ var TIMING = Object.freeze({
|
|
|
168
168
|
stagger: 0.15,
|
|
169
169
|
lerp: 1
|
|
170
170
|
}),
|
|
171
|
-
/**
|
|
171
|
+
/** video mask: the frame and the picture inside scale in opposite directions. */
|
|
172
172
|
frameZoom: Object.freeze({
|
|
173
173
|
outer: [80, 20],
|
|
174
174
|
inner: [130, 20],
|
|
@@ -177,19 +177,19 @@ var TIMING = Object.freeze({
|
|
|
177
177
|
open: 1,
|
|
178
178
|
lerp: 1
|
|
179
179
|
}),
|
|
180
|
-
/**
|
|
180
|
+
/** marquee: seconds per item, at most 14 counted. */
|
|
181
181
|
marquee: Object.freeze({ perItem: 2, maxItems: 14 }),
|
|
182
|
-
/**
|
|
182
|
+
/** glass chip and dot cursor. */
|
|
183
183
|
cursor: Object.freeze({ gutter: 10, circle: 96, dotLerp: 0.2, light: 180 }),
|
|
184
|
-
/**
|
|
184
|
+
/** floating navbar: enters from −300 % over 1.8 s; rows follow 0.15 s + 0.025 s each. */
|
|
185
185
|
island: Object.freeze({ entrance: 1.8, offset: -300, delay: 0.15, step: 0.025, focus: 150 }),
|
|
186
|
-
/**
|
|
186
|
+
/** product dock: spread for 1.6 s on load; tablet range re-checked 250 ms after a resize. */
|
|
187
187
|
cardDock: Object.freeze({ intro: 1600, resizeDebounce: 250 }),
|
|
188
|
-
/**
|
|
188
|
+
/** phone cards: 5 s a card, 2 s wait after a touch, 0.5 s after it shows. */
|
|
189
189
|
snapStrip: Object.freeze({ interval: 5e3, resume: 2e3, delay: 500 }),
|
|
190
|
-
/**
|
|
190
|
+
/** fill-text: letters from .2, 0.5 s each, 0.1 s apart, top 90 % → centre 40 %. */
|
|
191
191
|
fillText: Object.freeze({ from: 0.2, duration: 0.5, stagger: 0.1, start: "top 90%", end: "center 40%" }),
|
|
192
|
-
/**
|
|
192
|
+
/** particle hero: fade in 1 s after 0.3 s, morph cycles, pointer push. */
|
|
193
193
|
particleHero: Object.freeze({ fadeIn: 1, fadeDelay: 0.3, size: 128, pointSize: 1.7, maxDpr: 1.5, stillSteps: 110 }),
|
|
194
194
|
ticketMenu: Object.freeze({ open: 0.9, content: 1.1, stagger: 0.02, from: 150 }),
|
|
195
195
|
infiniteReel: Object.freeze({ friction: 0.95, wheel: 0.05, dragThreshold: 5 }),
|
|
@@ -301,4 +301,4 @@ export {
|
|
|
301
301
|
MK_HEAD_SCRIPT,
|
|
302
302
|
createScope
|
|
303
303
|
};
|
|
304
|
-
//# sourceMappingURL=chunk-
|
|
304
|
+
//# sourceMappingURL=chunk-DOOMULVV.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../src/core/timing.ts","../src/core/loop.ts","../src/core/reduced.ts","../src/core/scope.ts"],"sourcesContent":["/**\n * Every duration in one place (seconds, like GSAP, unless the name says\n * ms). Recipes and components take their defaults from here, so a timing is\n * changed once.\n */\nexport const TIMING = Object.freeze({\n flow: 0.5,\n flowStagger: 0.05,\n stepChange: 0.5,\n reveal: Object.freeze({\n fast: [0.5, 0.25],\n normal: [0.7, 0.35],\n slow: [1.05, 0.5],\n slower: [1.6, 0.75],\n } as const),\n details: 0.32,\n chevron: 0.25,\n indicator: 0.45,\n number: 0.6,\n numberPricing: 0.7,\n revealCounter: 0.9,\n layoutTravel: 0.62,\n /** New items in a reflow enter in this share of the travel time. */\n layoutEnterFactor: 0.6,\n menu: Object.freeze({ duration: 0.35, stagger: 0.04, delay: 0.1 }),\n palette: Object.freeze({ duration: 0.1, stagger: 0.01 }),\n form: Object.freeze({ duration: 0.35, stagger: 0.04 }),\n landing: Object.freeze({ duration: 0.4, stagger: 0.05, delay: 0.15 }),\n content: Object.freeze({ duration: 0.6, stagger: 0.06 }),\n bubble: 0.7,\n bubbleStagger: 0.06,\n word: 0.25,\n wordStagger: 0.05,\n chatScroll: 0.35,\n composer: 0.18,\n slot: Object.freeze({ durationMs: 300, staggerMs: 45, exitOffsetMs: 50, colorFadeMs: 280, maxTilt: 5, minResizeMs: 140 }),\n swatch: 0.5,\n swatchLight: 3.5,\n swatchBackground: 4.5,\n /** ModalHost (modal-origin, modal-close-origin, modal-fallback, modal-auto-resize). */\n dialog: Object.freeze({\n /** The surface travels from its opener. */\n open: 0.7,\n /** The opener's colour hands over to the surface's. */\n surfaceColor: 0.3,\n /** Back into the opener. */\n close: 0.5,\n /** While closing, the content heads for the opener on a 2 s path cut at `close`. */\n contentReturn: 2,\n originHide: 0.08,\n originShow: 0.3,\n originShowDelay: 0.2,\n /** No opener on screen: scale .92 → 1. */\n fallback: 0.35,\n autoResize: 0.45,\n /** Backdrop tint on the signature curve. */\n backdrop: 0.5,\n /** Items of a list that opens from its control. */\n list: 0.25,\n }),\n /** modal-liquid (spring channels; springs are stiffness/damping, not times). */\n liquid: Object.freeze({\n size: 0.3,\n radius: 0.7,\n content: 0.3,\n color: 0.4,\n colorDelay: 0.15,\n ghost: 0.25,\n ghostDelay: 0.05,\n closeSize: 0.25,\n closeContent: 0.3,\n originRestore: 0.3,\n originRestoreDelay: 0.2,\n safetyMs: 1100,\n }),\n /** modal-drag: the spring back when a drag is not far enough. */\n drag: Object.freeze({ restore: 0.5, radiusRestore: 0.3 }),\n /** modal-float. */\n float: Object.freeze({ shadow: 0.45, glideDecay: 0.18, sizeSmoothing: 0.08 }),\n /** chat-loader-delay, chat-confirmation-bar. */\n chat: Object.freeze({ pendingDelayMs: 500, confirmWordStagger: 0.1 }),\n /** onboarding-busy-background, step-change, onboarding-reveal-counter. */\n onboarding: Object.freeze({ busy: 0.8, idle: 0.6, step: 0.5, counter: 0.9 }),\n /** task-drag: lift, land (FA .62), crossfade (66 % of the land), neighbours shifting (FA .52). */\n sortable: Object.freeze({ lift: 0.18, land: 0.42, landFade: 0.42 * 0.66, shift: 0.62 }),\n /** toast-deck, toast-morph, toast-character-reveal. */\n toast: Object.freeze({\n relayout: 0.6,\n expand: 0.55,\n expandStagger: 0.06,\n enter: 0.5,\n exit: 0.3,\n collapseDelayMs: 150,\n morphSize: 0.32,\n morphRadius: 0.7,\n morphContent: 0.32,\n morphColor: 0.4,\n morphColorDelay: 0.15,\n morphShadow: 0.6,\n morphShadowDelay: 0.05,\n safetyMs: 1100,\n chars: 0.4,\n charsDelay: 0.225,\n charsStagger: 0.02,\n }),\n /** glass (CSS): surface/shadow transitions, ring and shine. */\n glass: Object.freeze({ hover: 0.4, ring: 0.5 }),\n /** utility animations (css/effects/anim.css), by name. */\n effects: Object.freeze({\n out: 0.5,\n 'out-left': 0.5,\n 'out-bottom': 0.5,\n collapse: 0.25,\n highlight: 1,\n shake: 0.5,\n 'shake-strong': 0.4,\n fade: 0.3,\n wipe: 0.7,\n 'progress-in': 1,\n }),\n /** success confetti, per 60 fps frame. */\n confetti: Object.freeze({\n count: 45,\n speed: [2, 8] as const,\n lift: 2,\n radius: [3, 7] as const,\n decay: [0.015, 0.03] as const,\n gravity: 0.15,\n drag: 0.98,\n spin: 2.5,\n }),\n /** project sheet. */\n sheet: Object.freeze({ open: 0.72, close: 0.72, underlayScale: 0.98, underlayOpacity: 0.4 }),\n /** Physical spring pairs: [stiffness, damping]. */\n springs: Object.freeze({\n press: [400, 10] as const,\n success: [260, 18] as const,\n underlay: [300, 30] as const,\n letters: [300, 10] as const,\n cursorFollow: [800, 35] as const,\n cursorAppear: [500, 30] as const,\n bentoEnter: [60, 15] as const,\n bentoRepel: [300, 25] as const,\n dockPill: [380, 30] as const,\n }),\n /** masked type. */\n maskText: Object.freeze({ duration: 1.2, delay: 0.1, stagger: 0.02, exitStagger: 0.002, y: 100, threshold: 0.8 }),\n /** reveal group (rules, fades, rises). */\n cascade: Object.freeze({ duration: 1.2, step: 0.03, rise: 200, threshold: 0.3 }),\n /** slot title: each letter turns 8–14 times inside a 2 s expo.out envelope. */\n textRoll: Object.freeze({ duration: 2, stagger: 0.04, turns: [8, 14] as const, interval: 6000, quietMs: 1000 }),\n /** hero letters: scale on hover, pastel blink. */\n letters: Object.freeze({\n scale: 1.3,\n y: -5,\n step: 0.03,\n blink: 0.6,\n blinkStart: 0.6,\n blinkRepeatDelay: 0.1,\n blinkDelays: [0.1, 0.6, 0.2, 1, 0.4, 1.2, 0.15, 0.8, 0.3] as const,\n }),\n /** image parallax. */\n parallax: Object.freeze({ travel: 10, scale: 1.2, strongScale: 1.3, lerp: 1 }),\n /** About grid gathering from depth. */\n depthGrid: Object.freeze({\n perspective: 600,\n distance: 900,\n depth: -3000,\n rotate: -160,\n opacity: 0.05,\n scale: 0.4,\n stagger: 0.15,\n lerp: 1,\n }),\n /** video mask: the frame and the picture inside scale in opposite directions. */\n frameZoom: Object.freeze({\n outer: [80, 20] as const,\n inner: [130, 20] as const,\n phoneOuter: [95, 5] as const,\n phoneInner: [105, 5] as const,\n open: 1,\n lerp: 1,\n }),\n /** marquee: seconds per item, at most 14 counted. */\n marquee: Object.freeze({ perItem: 2, maxItems: 14 }),\n /** glass chip and dot cursor. */\n cursor: Object.freeze({ gutter: 10, circle: 96, dotLerp: 0.2, light: 180 }),\n /** floating navbar: enters from −300 % over 1.8 s; rows follow 0.15 s + 0.025 s each. */\n island: Object.freeze({ entrance: 1.8, offset: -300, delay: 0.15, step: 0.025, focus: 150 }),\n /** product dock: spread for 1.6 s on load; tablet range re-checked 250 ms after a resize. */\n cardDock: Object.freeze({ intro: 1600, resizeDebounce: 250 }),\n /** phone cards: 5 s a card, 2 s wait after a touch, 0.5 s after it shows. */\n snapStrip: Object.freeze({ interval: 5000, resume: 2000, delay: 500 }),\n /** fill-text: letters from .2, 0.5 s each, 0.1 s apart, top 90 % → centre 40 %. */\n fillText: Object.freeze({ from: 0.2, duration: 0.5, stagger: 0.1, start: 'top 90%', end: 'center 40%' }),\n /** particle hero: fade in 1 s after 0.3 s, morph cycles, pointer push. */\n particleHero: Object.freeze({ fadeIn: 1, fadeDelay: 0.3, size: 128, pointSize: 1.7, maxDpr: 1.5, stillSteps: 110 }),\n ticketMenu: Object.freeze({ open: 0.9, content: 1.1, stagger: 0.02, from: 150 }),\n infiniteReel: Object.freeze({ friction: 0.95, wheel: 0.05, dragThreshold: 5 }),\n repelBento: Object.freeze({ offset: 0.6, stagger: 0.006, strength: 5000, distance: 30, breakpoint: 1024 }),\n rotator: Object.freeze({ interval: 8000, duration: 0.25, y: 5 }),\n dragRuler: Object.freeze({ min: 0, max: 8, step: 0.1, pixelsPerUnit: 60 }),\n});\n","import { gsap } from 'gsap';\n\n/** Called every frame with dt = 1 at 60 Hz. */\nexport type Tick = (dt: number) => void;\n\nconst subscribers = new Set<Tick>();\nconst FRAME_MS = 1000 / 60;\n\nfunction tick(_time: number, deltaMs: number) {\n // Capped so a backgrounded tab does not explode the springs.\n const dt = Math.min(deltaMs / FRAME_MS, 3);\n subscribers.forEach((fn) => fn(dt));\n}\n\n/** One shared ticker callback for every recipe. */\nexport function subscribe(fn: Tick): () => void {\n if (!subscribers.size) gsap.ticker.add(tick);\n subscribers.add(fn);\n return () => {\n subscribers.delete(fn);\n if (!subscribers.size) gsap.ticker.remove(tick);\n };\n}\n\n/** Run `fn` every frame only while `el` is near the viewport. */\nexport function whileVisible(el: Element, fn: Tick, rootMargin = '100px'): () => void {\n let stop: (() => void) | null = null;\n const io = new IntersectionObserver(\n ([entry]) => {\n if (entry?.isIntersecting) stop ??= subscribe(fn);\n else {\n stop?.();\n stop = null;\n }\n },\n { rootMargin },\n );\n io.observe(el);\n return () => {\n io.disconnect();\n stop?.();\n stop = null;\n };\n}\n","/** `prefers-reduced-motion: reduce`. Always false during SSR. */\nexport function reduced(): boolean {\n return typeof matchMedia === 'function' && matchMedia('(prefers-reduced-motion: reduce)').matches;\n}\n\n/**\n * Entrance animations run only with motion allowed and when the head safety net\n * (see MK_HEAD_SCRIPT) has not given up on JavaScript.\n */\nexport function entrances(): boolean {\n if (reduced()) return false;\n return !(typeof document !== 'undefined' && document.documentElement.classList.contains('mk-failed'));\n}\n\n/**\n * Inline this in <head> (before CSS paints). It enables the hidden entrance states\n * (`.mk-js`) and reveals everything again (`.mk-failed`) if no recipe has started\n * within 2.5 s — e.g. the bundle failed to load.\n */\nexport const MK_HEAD_SCRIPT =\n \"(function(){var r=document.documentElement;r.classList.add('mk-js');setTimeout(function(){if(!r.classList.contains('mk-ready'))r.classList.add('mk-failed')},2500)})();\";\n","import type { Cleanup } from './types';\n\nexport interface Scope {\n /** Register any cleanup; returns it for convenience. */\n add(fn: Cleanup): Cleanup;\n /** addEventListener that is removed on dispose. */\n on<K extends keyof HTMLElementEventMap>(\n target: EventTarget,\n type: K | (string & {}),\n listener: (event: HTMLElementEventMap[K]) => void,\n options?: AddEventListenerOptions | boolean,\n ): void;\n /** Disconnects the observer on dispose and returns it. */\n observe<O extends { disconnect(): void }>(observer: O): O;\n /** setTimeout that is cleared on dispose. */\n timeout(fn: () => void, ms: number): void;\n /** Set (or remove, with null) an attribute; dispose puts the original value back. */\n attr(el: Element, name: string, value: string | null): void;\n /** Run every cleanup once, newest first. */\n dispose(): void;\n readonly disposed: boolean;\n}\n\n/** Collects the side effects of one recipe instance so `destroy()` can undo all of them. */\nexport function createScope(): Scope {\n const cleanups: Cleanup[] = [];\n const originals = new Map<Element, Map<string, string | null>>();\n let disposed = false;\n return {\n add(fn) {\n cleanups.push(fn);\n return fn;\n },\n on(target, type, listener, options) {\n target.addEventListener(type, listener as EventListener, options);\n cleanups.push(() => target.removeEventListener(type, listener as EventListener, options));\n },\n observe(observer) {\n cleanups.push(() => observer.disconnect());\n return observer;\n },\n timeout(fn, ms) {\n const id = setTimeout(fn, ms);\n cleanups.push(() => clearTimeout(id));\n },\n attr(el, name, value) {\n let saved = originals.get(el);\n if (!saved) originals.set(el, (saved = new Map()));\n if (!saved.has(name)) {\n saved.set(name, el.getAttribute(name));\n cleanups.push(() => {\n const original = saved.get(name);\n if (original === null || original === undefined) el.removeAttribute(name);\n else el.setAttribute(name, original);\n });\n }\n if (value === null) el.removeAttribute(name);\n else el.setAttribute(name, value);\n },\n dispose() {\n if (disposed) return;\n disposed = true;\n for (const fn of cleanups.reverse()) fn();\n cleanups.length = 0;\n },\n get disposed() {\n return disposed;\n },\n };\n}\n"],"mappings":"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","names":[]}
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import {
|
|
2
2
|
ROLES
|
|
3
|
-
} from "./chunk-
|
|
3
|
+
} from "./chunk-RVSKEBIC.js";
|
|
4
4
|
|
|
5
5
|
// src/theme/css-format.ts
|
|
6
6
|
function block(selectors, scheme, palette, indent = "") {
|
|
@@ -25,4 +25,4 @@ function themeCss(id, { light, dark }) {
|
|
|
25
25
|
export {
|
|
26
26
|
themeCss
|
|
27
27
|
};
|
|
28
|
-
//# sourceMappingURL=chunk-
|
|
28
|
+
//# sourceMappingURL=chunk-I3DXF2KQ.js.map
|
|
@@ -21,20 +21,20 @@ import {
|
|
|
21
21
|
splitWords,
|
|
22
22
|
spring,
|
|
23
23
|
springEase
|
|
24
|
-
} from "./chunk-
|
|
24
|
+
} from "./chunk-TFNRIZHU.js";
|
|
25
25
|
import {
|
|
26
26
|
THEMES,
|
|
27
27
|
THEME_EVENT,
|
|
28
28
|
getTheme,
|
|
29
29
|
setTheme
|
|
30
|
-
} from "./chunk-
|
|
30
|
+
} from "./chunk-RVSKEBIC.js";
|
|
31
31
|
import {
|
|
32
32
|
TIMING,
|
|
33
33
|
createScope,
|
|
34
34
|
entrances,
|
|
35
35
|
reduced,
|
|
36
36
|
subscribe
|
|
37
|
-
} from "./chunk-
|
|
37
|
+
} from "./chunk-DOOMULVV.js";
|
|
38
38
|
import {
|
|
39
39
|
inert,
|
|
40
40
|
warnOnce
|
|
@@ -1614,4 +1614,4 @@ export {
|
|
|
1614
1614
|
createCursor,
|
|
1615
1615
|
createIsland
|
|
1616
1616
|
};
|
|
1617
|
-
//# sourceMappingURL=chunk-
|
|
1617
|
+
//# sourceMappingURL=chunk-IKQ5FODN.js.map
|