@yewdiel21/motion-kit 0.17.0 → 0.19.0

package/src/motion/morph.ts

@@ -127,6 +127,9 @@ function faceOf(surface: HTMLElement, origin: HTMLElement, shape: Shape, withCop
 /** The morph each surface is playing, so a new one stops it first. */
 const running = new WeakMap<HTMLElement, gsap.core.Animation>();
 
+/** A scroll area's bars and button ride on the surface: they are not content that enters. */
+const OVERLAY = '[data-mk-scroll-rail], [data-mk-scroll-top]';
+
 /** Whether a surface is opening or closing right now. */
 export const isMorphing = (surface: HTMLElement) => running.has(surface);
 
@@ -141,7 +144,7 @@ function stop(surface: HTMLElement) {
 /** Stop a surface's morph now and put the surface and its content back to rest. */
 export function stopMorph(surface: HTMLElement) {
   stop(surface);
-  const parts = [...surface.querySelectorAll<HTMLElement>(':scope > *')].filter((element) => !element.classList.contains('mk-liquid'));
+  const parts = [...surface.querySelectorAll<HTMLElement>(':scope > *')].filter((element) => !element.classList.contains('mk-liquid') && !element.matches(OVERLAY));
   gsap.killTweensOf(parts);
   clearStyles(parts, MORPH_STYLES);
 }
@@ -298,7 +301,7 @@ export interface MorphOpenOptions {
 
 const partsOf = (surface: HTMLElement, content: string | undefined) =>
   [...surface.querySelectorAll<HTMLElement>(content ?? ':scope > *')].filter(
-    (element) => !element.classList.contains(FACE) && !element.classList.contains('mk-liquid'),
+    (element) => !element.classList.contains(FACE) && !element.classList.contains('mk-liquid') && !element.matches(OVERLAY),
   );
 
 /**

package/src/react/index.ts

@@ -174,3 +174,20 @@ export { WaveformPlayer, type WaveformPlayerProps } from '../components/waveform
 export { VoiceMessageBubble, type VoiceMessageBubbleProps } from '../components/voice-message-bubble/react';
 export { DrilldownMenu, type DrilldownMenuProps, type DrilldownMenuHandle } from '../components/drilldown-menu/react';
 export { WheelPicker, type WheelPickerProps } from '../components/wheel-picker/react';
+
+export { Stepper, type StepperProps } from '../components/stepper/react';
+export { RadioGroup, type RadioGroupProps } from '../components/radio-group/react';
+export { EqualizerSlider, type EqualizerSliderProps } from '../components/equalizer-slider/react';
+export { TemperatureSlider, type TemperatureSliderProps } from '../components/temperature-slider/react';
+export { RatingScale, type RatingScaleProps } from '../components/rating-scale/react';
+export { NotificationStack, type NotificationStackProps } from '../components/notification-stack/react';
+export { BentoGrid, type BentoGridProps } from '../components/bento-grid/react';
+export { ScrollPreviewDock, type ScrollPreviewDockProps } from '../components/scroll-preview-dock/react';
+export { StickyHeader, type StickyHeaderProps } from '../components/sticky-header/react';
+export { HandwritingText, type HandwritingTextProps } from '../components/handwriting-text/react';
+export { ParticleButton, type ParticleButtonProps } from '../components/particle-button/react';
+export { MagnetizeButton, type MagnetizeButtonProps } from '../components/magnetize-button/react';
+export { BadgeButton, type BadgeButtonProps } from '../components/badge-button/react';
+export { MorphingPageDots, type MorphingPageDotsProps } from '../components/morphing-page-dots/react';
+export { NotFound, type NotFoundProps } from '../components/not-found/react';
+export { ScrollArea, type ScrollAreaProps } from '../components/scroll-area/react';