@brytdesigns/web-component-drawer 1.0.22 → 1.0.24

package/dist/esm/index.js

@@ -1,11 +1,13 @@
 import { customShadowlessElement, correctElementType, toHyphenated, getContextFromProvider, invokeOnLoaded } from '@brytdesigns/web-component-utils';
-import { splitProps, createEffect, on, batch, untrack, mergeProps, onMount, createRoot, onCleanup, createMemo } from 'solid-js';
+import { splitProps, createEffect, on, batch, onCleanup, untrack, mergeProps, onMount, createRoot } from 'solid-js';
 import { animate } from 'motion';
 import { createContext, consume, provide } from 'component-register';
 import { createStore } from 'solid-js/store';
+import { abortablePromise } from '@brytdesigns/web-component-core/promise';
+import { awaitAllAnimations } from '@brytdesigns/web-component-core/animation';
 import { observeElementInViewport } from 'observe-element-in-viewport';
-import { disableBodyScroll, enableBodyScroll, clearAllBodyScrollLocks } from 'body-scroll-lock-upgrade';
-import { createFocusTrap } from 'focus-trap';
+import { disableBodyScroll, enableBodyScroll } from 'body-scroll-lock-upgrade';
+import { createFocusTrap } from '@brytdesigns/web-component-core/focusTrap';
 
 var __defProp = Object.defineProperty;
 var __export = (target, all) => {
@@ -27,14 +29,22 @@ function initializeDrawerContext(props) {
       () => store.animationQueue,
       (animationQueue) => {
         if (!animationQueue.length) return;
-        const animations = Promise.allSettled([...store.animationQueue]);
+        const controller = new AbortController();
+        const animations = awaitAllAnimations(animationQueue);
+        const abortableAnimations = abortablePromise(
+          animations,
+          controller.signal
+        );
         setElementState("isAnimating", true);
-        animations.finally(() => {
+        abortableAnimations.finally(() => {
           batch(() => {
             setElementState("isAnimating", false);
             setStore("animationQueue", []);
           });
         });
+        return onCleanup(() => {
+          controller.abort();
+        });
       }
     )
   );
@@ -96,11 +106,6 @@ function hideElement(element) {
 function showElement(element) {
   element.style.display = "block";
 }
-async function controlPromise(controls) {
-  return new Promise((resolve) => {
-    controls.then(() => resolve(null));
-  });
-}
 function getTransitionConfig(style) {
   const properties = {
     autoplay: style.getPropertyValue("--motion--autoplay"),
@@ -172,7 +177,7 @@ var Component = (_, { element }) => {
       (isOpen) => {
         if (!isOpen || isFirstRender) return;
         const animation = enter(element);
-        updateAnimationQueue(controlPromise(animation));
+        updateAnimationQueue(animation);
         return onCleanup(() => {
           if (animation.state !== "finished") animation.complete();
         });
@@ -185,7 +190,7 @@ var Component = (_, { element }) => {
       (isOpen) => {
         if (isOpen || isFirstRender) return;
         const animation = exit(element);
-        updateAnimationQueue(controlPromise(animation));
+        updateAnimationQueue(animation);
         return onCleanup(() => {
           if (animation.state !== "finished") animation.complete();
         });
@@ -341,7 +346,7 @@ var Component3 = (_, { element }) => {
       (isOpen) => {
         if (!isOpen || isFirstRender) return;
         const animation = enter(element);
-        updateAnimationQueue(controlPromise(animation));
+        updateAnimationQueue(animation);
         return onCleanup(() => {
           if (animation.state !== "finished") animation.complete();
         });
@@ -354,7 +359,7 @@ var Component3 = (_, { element }) => {
       (isOpen) => {
         if (isOpen || isFirstRender) return;
         const animation = exit(element);
-        updateAnimationQueue(controlPromise(animation));
+        updateAnimationQueue(animation);
         return onCleanup(() => {
           if (animation.state !== "finished") animation.complete();
         });
@@ -418,15 +423,13 @@ var Component4 = (props, { element }) => {
   const [state, { setElementState }] = context;
   const [_, { updateAnimationQueue, ...events }] = useDrawerContext(context);
   element.actions = events;
-  const focusTrap = createMemo(() => {
-    return createFocusTrap(element, {
-      allowOutsideClick: true,
-      escapeDeactivates: restProps.closeOnEscape,
-      onDeactivate: () => {
-        setElementState("isOpen", false);
-      }
-    });
-  });
+  const focusTrap = createFocusTrap(element, () => ({
+    allowOutsideClick: true,
+    escapeDeactivates: restProps.closeOnEscape,
+    onDeactivate: () => {
+      setElementState("isOpen", false);
+    }
+  }));
   createEffect(() => {
     if (!props.debug) return;
     console.table({
@@ -474,11 +477,10 @@ var Component4 = (props, { element }) => {
     on(
       () => ({
         isOpen: state.isOpen,
-        isAnimating: state.isAnimating,
-        shouldTrapFocus: restProps.shouldTrapFocus
+        isAnimating: state.isAnimating
       }),
-      ({ isOpen, isAnimating, shouldTrapFocus }) => {
-        if (isOpen && !isAnimating && shouldTrapFocus)
+      ({ isOpen, isAnimating }) => {
+        if (isOpen && !isAnimating)
           return disableBodyScroll(element, {
             allowTouchMove: (el) => {
               if (el instanceof HTMLElement) {
@@ -494,7 +496,6 @@ var Component4 = (props, { element }) => {
             }
           });
         onCleanup(() => {
-          if (!shouldTrapFocus) return;
           enableBodyScroll(element);
         });
       }
@@ -514,7 +515,7 @@ var Component4 = (props, { element }) => {
     )
   );
   onCleanup(() => {
-    clearAllBodyScrollLocks();
+    disableBodyScroll(element);
   });
 };
 

package/dist/esm/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/components/drawer-content.ts","../../src/hooks/useDrawer.ts","../../src/utils.ts","../../src/consts.ts","../../src/components/drawer-trigger.ts","../../src/components/drawer-backdrop.ts","../../src/components/drawer-context.ts","../../src/index.ts"],"names":["state","open","createEffect","on","element","Component","Name","onCleanup","onMount","animate","splitProps","focusTrap"],"mappings":"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","file":"index.js","sourcesContent":["import type { CorrectComponentType } from \"@brytdesigns/web-component-utils\";\n\nimport { createEffect, on, onCleanup, onMount } from \"solid-js\";\nimport { animate } from \"motion\";\n\nimport { useDrawer } from \"../hooks/index.js\";\nimport { controlPromise, getTransitionConfig } from \"../utils.js\";\nimport { POSITION, type Position } from \"../consts.js\";\n\ntype DrawerContentProps = {};\n\nexport const Name = `drawer-content`;\n\nexport const Component: CorrectComponentType<DrawerContentProps> = (\n  _,\n  { element },\n) => {\n  const [state, { updateAnimationQueue }] = useDrawer(element);\n\n  let isFirstRender = true;\n\n  createEffect(\n    on(\n      () => state.isOpen,\n      (isOpen) => {\n        if (!isOpen || isFirstRender) return;\n        const animation = enter(element);\n        updateAnimationQueue(controlPromise(animation));\n        return onCleanup(() => {\n          if (animation.state !== \"finished\") animation.complete();\n        });\n      },\n    ),\n  );\n\n  createEffect(\n    on(\n      () => state.isOpen,\n      (isOpen) => {\n        if (isOpen || isFirstRender) return;\n        const animation = exit(element);\n        updateAnimationQueue(controlPromise(animation));\n        return onCleanup(() => {\n          if (animation.state !== \"finished\") animation.complete();\n        });\n      },\n    ),\n  );\n\n  onMount(() => {\n    isFirstRender = false;\n  });\n\n  function enter(element: HTMLElement) {\n    const style = window.getComputedStyle(element);\n    const transition = getTransitionConfig(style);\n    let position = style.getPropertyValue(\"--drawer--position\") as Position;\n    if (!position) position = POSITION.LEFT;\n\n    let transform: Record<string, string[]> = {\n      x: [\"var(--drawer--slide-from)\", \"var(--drawer--slide-to)\"],\n    };\n\n    if (position === POSITION.TOP || position === POSITION.BOTTOM) {\n      transform = {\n        y: [\"var(--drawer--slide-from)\", \"var(--drawer--slide-to)\"],\n      };\n    }\n\n    return animate(\n      element,\n      {\n        ...transform,\n      },\n      transition,\n    );\n  }\n\n  function exit(element: HTMLElement) {\n    const style = window.getComputedStyle(element);\n    const transition = getTransitionConfig(style);\n    let position = style.getPropertyValue(\"--drawer--position\") as Position;\n    if (!position) position = POSITION.LEFT;\n\n    let transform: Record<string, string[]> = {\n      x: [\"var(--drawer--slide-to)\", \"var(--drawer--slide-from)\"],\n    };\n\n    if (position === POSITION.TOP || position === POSITION.BOTTOM) {\n      transform = {\n        y: [\"var(--drawer--slide-to)\", \"var(--drawer--slide-from)\"],\n      };\n    }\n\n    return animate(\n      element,\n      {\n        ...transform,\n      },\n      transition,\n    );\n  }\n};\n","import {\n  type ICustomElement,\n  createContext,\n  provide,\n  consume,\n} from \"component-register\";\nimport {\n  createEffect,\n  on,\n  batch,\n  splitProps,\n  untrack,\n  mergeProps,\n} from \"solid-js\";\nimport { createStore } from \"solid-js/store\";\nimport {\n  toHyphenated,\n  getContextFromProvider,\n} from \"@brytdesigns/web-component-utils\";\n\ntype StoreContext = {\n  animationQueue: Promise<unknown>[];\n};\n\ntype CreateContextOptions = {\n  root: HTMLElement & ICustomElement;\n  isOpen: boolean;\n  isAnimating: boolean;\n};\n\ntype WalkableNode = Parameters<typeof provide>[2];\n\ntype DrawerContext = ReturnType<typeof initializeDrawerContext>;\n\nfunction initializeDrawerContext(props: CreateContextOptions) {\n  const [_internal, _state] = splitProps(props, [\"root\"]);\n  const [store, setStore] = createStore<StoreContext>({ animationQueue: [] });\n\n  createEffect(\n    on(\n      () => store.animationQueue,\n      (animationQueue) => {\n        if (!animationQueue.length) return;\n        const animations = Promise.allSettled([...store.animationQueue]);\n        setElementState(\"isAnimating\", true);\n        animations.finally(() => {\n          batch(() => {\n            setElementState(\"isAnimating\", false);\n            setStore(\"animationQueue\", []);\n          });\n        });\n      },\n    ),\n  );\n\n  function setElementState(\n    key: keyof Omit<CreateContextOptions, \"root\">,\n    value: boolean | ((v: boolean) => boolean),\n  ) {\n    const currentValue = untrack(() => props[key]);\n    if (typeof value === \"function\") {\n      const result = value(currentValue || false);\n      if (`${currentValue}` === `${result}`) return;\n      _internal.root.setAttribute(toHyphenated(key), `${result}`);\n      return;\n    }\n    if (`${currentValue}` === `${value}`) return;\n    return _internal.root.setAttribute(toHyphenated(key), `${value}`);\n  }\n\n  return [mergeProps(_state, store), { setElementState, setStore }] as const;\n}\n\nconst DrawerContextState = createContext(initializeDrawerContext);\n\nexport const provideDrawerContext = (\n  initialState: Omit<CreateContextOptions, \"root\">,\n  element: WalkableNode,\n): DrawerContext => {\n  const props = mergeProps(initialState, { root: element });\n  return provide(DrawerContextState, props, element);\n};\n\nexport const useDrawerContext = (context: DrawerContext) => {\n  const [state, { setElementState, setStore: setState }] = context;\n\n  function updateAnimationQueue(animation: Promise<unknown>) {\n    setState(\"animationQueue\", (state) => [...state, animation]);\n  }\n\n  function close() {\n    setElementState(\"isOpen\", false);\n  }\n\n  function open() {\n    setElementState(\"isOpen\", true);\n  }\n\n  function toggle() {\n    setElementState(\"isOpen\", (open) => !open);\n  }\n\n  return [state, { updateAnimationQueue, close, open, toggle }] as const;\n};\n\nexport const useDrawer = (element: HTMLElement & ICustomElement) => {\n  const context: DrawerContext = consume(DrawerContextState, element);\n\n  if (!context) {\n    throw console.error(\n      \"DrawerContext not found! Please ensure to wrap your custom element with drawer-context element.\",\n    );\n  }\n\n  return useDrawerContext(context);\n};\n\nexport const getDrawerContext = (element: Element) => {\n  const context = getContextFromProvider<DrawerContext>(\n    DrawerContextState,\n    element,\n  );\n  return useDrawerContext(context);\n};\n","import type {\n  AnimationGeneratorType,\n  AnimationPlaybackControlsWithThen,\n  Easing,\n  RepeatType,\n  Transition,\n} from \"motion\";\n\nexport function hideElement<T extends HTMLElement>(element: T) {\n  element.style.display = \"none\";\n}\n\nexport function showElement<T extends HTMLElement>(element: T) {\n  element.style.display = \"block\";\n}\n\nexport async function controlPromise(\n  controls: AnimationPlaybackControlsWithThen,\n) {\n  return new Promise((resolve) => {\n    controls.then(() => resolve(null));\n  });\n}\n\nexport function getTransitionConfig(style: CSSStyleDeclaration) {\n  const properties = {\n    autoplay: style.getPropertyValue(\"--motion--autoplay\"),\n    bounce: style.getPropertyValue(\"--motion--bounce\"),\n    bounceDamping: style.getPropertyValue(\"--motion--bounce-damping\"),\n    bounceStiffness: style.getPropertyValue(\"--motion--bounce-stiffness\"),\n    duration: style.getPropertyValue(\"--motion--duration\"),\n    damping: style.getPropertyValue(\"--motion--damping\"),\n    delay: style.getPropertyValue(\"--motion--delay\"),\n    ease: style.getPropertyValue(\"--motion--ease\"),\n    elapsed: style.getPropertyValue(\"--motion--elapsed\"),\n    mass: style.getPropertyValue(\"--motion--mass\"),\n    max: style.getPropertyValue(\"--motion--max\"),\n    min: style.getPropertyValue(\"--motion--min\"),\n    power: style.getPropertyValue(\"--motion--power\"),\n    repeat: style.getPropertyValue(\"--motion--repeat\"),\n    repeatDelay: style.getPropertyValue(\"--motion--repeat-delay\"),\n    repeatType: style.getPropertyValue(\"--motion--repeat-type\"),\n    restDelta: style.getPropertyValue(\"--motion--rest-delta\"),\n    restSpeed: style.getPropertyValue(\"--motion--rest-speed\"),\n    startTime: style.getPropertyValue(\"--motion--start-time\"),\n    timeConstant: style.getPropertyValue(\"--motion--time-constant\"),\n    times: style.getPropertyValue(\"--motion--times\"),\n    type: style.getPropertyValue(\"--motion--type\"),\n    velocity: style.getPropertyValue(\"--motion--velocity\"),\n    visualDuration: style.getPropertyValue(\"--motion--visual-duration\"),\n  };\n  return {\n    autoplay: properties.autoplay ? properties.autoplay === \"true\" : undefined,\n    bounce: properties.bounce ? parseFloat(properties.bounce) : undefined,\n    bounceDamping: properties.bounceDamping\n      ? parseFloat(properties.bounceDamping)\n      : undefined,\n    bounceStiffness: properties.bounceStiffness\n      ? parseFloat(properties.bounceStiffness)\n      : undefined,\n    duration: properties.duration ? parseFloat(properties.duration) : undefined,\n    damping: properties.damping ? parseFloat(properties.damping) : undefined,\n    delay: properties.delay ? parseFloat(properties.delay) : undefined,\n    ease: (properties.ease as Easing) || undefined,\n    elapsed: properties.elapsed ? parseFloat(properties.elapsed) : undefined,\n    mass: properties.mass ? parseFloat(properties.mass) : undefined,\n    max: properties.max ? parseFloat(properties.max) : undefined,\n    min: properties.min ? parseFloat(properties.min) : undefined,\n    power: properties.power ? parseFloat(properties.power) : undefined,\n    repeat: properties.repeat ? parseInt(properties.repeat) : undefined,\n    repeatDelay: properties.repeatDelay\n      ? parseFloat(properties.repeatDelay)\n      : undefined,\n    repeatType: (properties.repeatType as RepeatType) || undefined,\n    restDelta: properties.restDelta\n      ? parseFloat(properties.restDelta)\n      : undefined,\n    restSpeed: properties.restSpeed\n      ? parseFloat(properties.restSpeed)\n      : undefined,\n    startTime: properties.startTime\n      ? parseFloat(properties.startTime)\n      : undefined,\n    timeConstant: properties.timeConstant\n      ? parseFloat(properties.timeConstant)\n      : undefined,\n    type: (properties.type as AnimationGeneratorType) || undefined,\n    velocity: properties.velocity ? parseFloat(properties.velocity) : undefined,\n    visualDuration: properties.visualDuration\n      ? parseFloat(properties.visualDuration)\n      : undefined,\n  } satisfies Transition;\n}\n","export type Position = (typeof POSITION)[keyof typeof POSITION];\nexport type Action = (typeof ACTION)[keyof typeof ACTION];\n\nexport const POSITION = {\n  TOP: \"top\",\n  BOTTOM: \"bottom\",\n  LEFT: \"left\",\n  RIGHT: \"right\",\n} as const;\n\nexport const ACTION = {\n  OPEN: \"open\",\n  CLOSE: \"close\",\n  TOGGLE: \"toggle\",\n};\n\nexport const EVENT_NAMESPACE = `bryt:drawer` as const;\n","import {\n  invokeOnLoaded,\n  type CorrectComponentType,\n} from \"@brytdesigns/web-component-utils\";\nimport type { Action } from \"../consts\";\n\nimport { createEffect, createRoot, on as _on, onCleanup } from \"solid-js\";\nimport { observeElementInViewport } from \"observe-element-in-viewport\";\n\nimport { getDrawerContext } from \"../hooks/index.js\";\n\ntype DrawerTriggerProps = {\n  target?: string;\n  action?: Action | \"\";\n  on?: keyof HTMLElementEventMap | \"enter\" | \"exit\";\n  preventDefault: boolean;\n};\n\nexport const Name = \"drawer-trigger\";\n\nexport const Component: CorrectComponentType<DrawerTriggerProps> = (\n  props,\n  { element },\n) => {\n  createEffect(() => {\n    const targetProp = props.target,\n      action = props.action,\n      on = props.on,\n      preventDefault = props.preventDefault;\n\n    if (!targetProp)\n      return console.warn(`${Name}: target prop is required!`, element);\n    if (!action)\n      return console.warn(`${Name}: action prop is required!`, element);\n    if (action !== \"close\" && action !== \"open\" && action !== \"toggle\")\n      return console.warn(\n        `${Name}: action prop must be 'close', 'open', or 'toggle'`,\n      );\n    if (!on) return console.warn(`${Name}: on prop is required!`);\n\n    const target = document.querySelector(targetProp);\n    if (!target)\n      return console.warn(`${Name}: target element not found!`, {\n        element,\n        target: targetProp,\n      });\n\n    const controller = new AbortController();\n\n    invokeOnLoaded(\n      () => {\n        createRoot((dispose) => {\n          const [state, { open, close, toggle }] = getDrawerContext(target);\n\n          switch (on) {\n            case \"enter\": {\n              let unsubscribe = null;\n              if (action === \"toggle\") {\n                unsubscribe = observeElementInViewport(element, open, close);\n              }\n\n              if (unsubscribe) onCleanup(unsubscribe);\n              break;\n            }\n            case \"exit\": {\n              let unsubscribe = null;\n              if (action === \"toggle\") {\n                unsubscribe = observeElementInViewport(element, close, open);\n              }\n\n              if (unsubscribe) onCleanup(unsubscribe);\n              break;\n            }\n\n            default: {\n              element.addEventListener(\n                on,\n                (event) => {\n                  if (preventDefault) event.preventDefault();\n                  if (state.isAnimating) return;\n                  switch (action) {\n                    case \"close\":\n                      close();\n                      break;\n                    case \"open\":\n                      open();\n                      break;\n                    case \"toggle\":\n                      toggle();\n                      break;\n                  }\n                },\n                { signal: controller.signal },\n              );\n              break;\n            }\n          }\n\n          createEffect(() => {\n            element.setAttribute(\"is-open\", `${state.isOpen}`);\n            element.setAttribute(\"is-animating\", `${state.isAnimating}`);\n          });\n\n          controller.signal.addEventListener(\"abort\", dispose);\n        });\n      },\n      { signal: controller.signal },\n    );\n\n    return onCleanup(() => {\n      controller.abort();\n    });\n  });\n};\n","import type { CorrectComponentType } from \"@brytdesigns/web-component-utils\";\n\nimport { createEffect, onMount, on, onCleanup } from \"solid-js\";\nimport { animate } from \"motion\";\n\nimport { useDrawer } from \"../hooks/index.js\";\nimport { controlPromise, getTransitionConfig } from \"../utils.js\";\n\ntype DrawerBackdropProps = {};\n\nexport const Name = `drawer-backdrop`;\n\nexport const Component: CorrectComponentType<DrawerBackdropProps> = (\n  _,\n  { element },\n) => {\n  const [state, { updateAnimationQueue, close }] = useDrawer(element);\n  const controller = new AbortController();\n\n  let isFirstRender = true;\n\n  createEffect(\n    on(\n      () => state.isOpen,\n      (isOpen) => {\n        if (!isOpen || isFirstRender) return;\n        const animation = enter(element);\n        updateAnimationQueue(controlPromise(animation));\n        return onCleanup(() => {\n          if (animation.state !== \"finished\") animation.complete();\n        });\n      },\n    ),\n  );\n\n  createEffect(\n    on(\n      () => state.isOpen,\n      (isOpen) => {\n        if (isOpen || isFirstRender) return;\n        const animation = exit(element);\n        updateAnimationQueue(controlPromise(animation));\n        return onCleanup(() => {\n          if (animation.state !== \"finished\") animation.complete();\n        });\n      },\n    ),\n  );\n\n  onMount(() => {\n    isFirstRender = false;\n  });\n\n  function enter(element: HTMLElement) {\n    const style = window.getComputedStyle(element);\n    const options = getTransitionConfig(style);\n    return animate(\n      element,\n      {\n        opacity: [`var(--drawer--opacity-from)`, `var(--drawer--opacity-to)`],\n      },\n      options,\n    );\n  }\n\n  function exit(element: HTMLElement) {\n    const style = window.getComputedStyle(element);\n    const options = getTransitionConfig(style);\n    return animate(\n      element,\n      {\n        opacity: [`var(--drawer--opacity-to)`, `var(--drawer--opacity-from)`],\n      },\n      options,\n    );\n  }\n\n  element.addEventListener(\n    \"click\",\n    () => {\n      if (state.isAnimating) return;\n      close();\n    },\n    {\n      signal: controller.signal,\n    },\n  );\n\n  onCleanup(() => {\n    controller.abort();\n  });\n\n  isFirstRender = false;\n};\n","import type { CorrectComponentType } from \"@brytdesigns/web-component-utils\";\n\nimport { createMemo, createEffect, on, onCleanup, splitProps } from \"solid-js\";\nimport {\n  enableBodyScroll,\n  disableBodyScroll,\n  clearAllBodyScrollLocks,\n} from \"body-scroll-lock-upgrade\";\nimport { createFocusTrap } from \"focus-trap\";\n\nimport { provideDrawerContext, useDrawerContext } from \"../hooks/index.js\";\nimport { hideElement, showElement } from \"../utils.js\";\n\ntype DrawerContextProps = {\n  isOpen: boolean;\n  id: string;\n  closeOnEscape: boolean;\n  shouldTrapFocus: boolean;\n  isAnimating: boolean;\n  debug?: boolean;\n};\n\nexport const Name = `drawer-context`;\n\nexport const Component: CorrectComponentType<DrawerContextProps> = (\n  props,\n  { element },\n) => {\n  const [contextProps, restProps] = splitProps(props, [\n    \"isOpen\",\n    \"isAnimating\",\n  ]);\n\n  const context = provideDrawerContext(contextProps, element);\n\n  const [state, { setElementState }] = context;\n\n  const [_, { updateAnimationQueue, ...events }] = useDrawerContext(context);\n\n  element.actions = events;\n\n  const focusTrap = createMemo(() => {\n    return createFocusTrap(element, {\n      allowOutsideClick: true,\n      escapeDeactivates: restProps.closeOnEscape,\n      onDeactivate: () => {\n        setElementState(\"isOpen\", false);\n      },\n    });\n  });\n\n  createEffect(() => {\n    if (!props.debug) return;\n    console.table({\n      ...state,\n    });\n  });\n\n  createEffect(\n    on(\n      () => state.isOpen,\n      (isOpen) => {\n        const eventName = isOpen ? \"drawer:open\" : \"drawer:close\";\n        element.dispatchEvent(\n          new CustomEvent(eventName, {\n            bubbles: true,\n            detail: { isOpen, relatedTarget: element },\n          }),\n        );\n        element.dispatchEvent(\n          new CustomEvent(\"drawer:toggle\", {\n            bubbles: true,\n            detail: { isOpen, relatedTarget: element },\n          }),\n        );\n      },\n    ),\n  );\n\n  createEffect(\n    on(\n      () => ({\n        isOpen: state.isOpen,\n        focusTrap: focusTrap(),\n        shouldTrapFocus: restProps.shouldTrapFocus,\n      }),\n      ({ isOpen, focusTrap, shouldTrapFocus }) => {\n        if (!isOpen) return;\n        if (props.debug) console.log(\"Showing element\", element);\n        showElement(element);\n        if (!shouldTrapFocus) return;\n        focusTrap.activate();\n        onCleanup(focusTrap.deactivate);\n      },\n    ),\n  );\n\n  createEffect(\n    on(\n      () => ({\n        isOpen: state.isOpen,\n        isAnimating: state.isAnimating,\n        shouldTrapFocus: restProps.shouldTrapFocus,\n      }),\n      ({ isOpen, isAnimating, shouldTrapFocus }) => {\n        if (isOpen && !isAnimating && shouldTrapFocus)\n          return disableBodyScroll(element, {\n            allowTouchMove: (el: EventTarget) => {\n              if (el instanceof HTMLElement) {\n                let element = el as (EventTarget & HTMLElement) | null;\n                while (element && element !== document.body) {\n                  if (element.tagName === \"DRAWER-CONTENT\") {\n                    return true;\n                  }\n\n                  element = element.parentElement;\n                }\n              }\n              return false;\n            },\n          });\n        onCleanup(() => {\n          if (!shouldTrapFocus) return;\n          enableBodyScroll(element);\n        });\n      },\n    ),\n  );\n\n  createEffect(\n    on(\n      () => ({ isOpen: state.isOpen, animationQueue: state.animationQueue }),\n      ({ isOpen, animationQueue }) => {\n        if (isOpen) return;\n        if (props.debug)\n          console.log(\"Waiting for animations to complete...\", animationQueue);\n        return Promise.all(animationQueue)\n          .then(() => hideElement(element))\n          .then(() => {\n            if (props.debug) console.log(\"Hiding element\", element);\n          });\n      },\n    ),\n  );\n\n  onCleanup(() => {\n    clearAllBodyScrollLocks();\n  });\n};\n","import {\n  customShadowlessElement,\n  correctElementType,\n} from \"@brytdesigns/web-component-utils\";\n\nimport {\n  DrawerContent,\n  DrawerContext,\n  DrawerTrigger,\n  DrawerBackdrop,\n} from \"./components/index.js\";\n\ncustomShadowlessElement(\n  DrawerContext.Name,\n  {\n    isOpen: false,\n    id: \"\",\n    closeOnEscape: false,\n    shouldTrapFocus: false,\n    isAnimating: false,\n    debug: false,\n  },\n  correctElementType(DrawerContext.Component),\n);\n\ncustomShadowlessElement(\n  DrawerTrigger.Name,\n  { target: \"\", action: \"\", on: \"click\", preventDefault: true },\n  correctElementType(DrawerTrigger.Component),\n);\n\ncustomShadowlessElement(\n  DrawerBackdrop.Name,\n  {},\n  correctElementType(DrawerBackdrop.Component),\n);\n\ncustomShadowlessElement(\n  DrawerContent.Name,\n  {},\n  correctElementType(DrawerContent.Component),\n);\n\nexport { useDrawer, getDrawerContext } from \"./hooks/index.js\";\n"]}
+{"version":3,"sources":["../../src/components/drawer-content.ts","../../src/hooks/useDrawer.ts","../../src/utils.ts","../../src/consts.ts","../../src/components/drawer-trigger.ts","../../src/components/drawer-backdrop.ts","../../src/components/drawer-context.ts","../../src/index.ts"],"names":["state","open","createEffect","on","onCleanup","element","Component","Name","onMount","animate","splitProps","focusTrap"],"mappings":";;;;;;;;;;;;;;;;;;AAAA,IAAA,sBAAA,GAAA,EAAA;AAAA,QAAA,CAAA,sBAAA,EAAA;AAAA,EAAA,SAAA,EAAA,MAAA,SAAA;AAAA,EAAA,IAAA,EAAA,MAAA;AAAA,CAAA,CAAA;ACuCA,SAAS,wBAAwB,KAA6B,EAAA;AAC5D,EAAM,MAAA,CAAC,WAAW,MAAM,CAAA,GAAI,WAAW,KAAO,EAAA,CAAC,MAAM,CAAC,CAAA;AACtD,EAAM,MAAA,CAAC,OAAO,QAAQ,CAAA,GAAI,YAA0B,EAAE,cAAA,EAAgB,EAAC,EAAG,CAAA;AAE1E,EAAA,YAAA;AAAA,IACE,EAAA;AAAA,MACE,MAAM,KAAM,CAAA,cAAA;AAAA,MACZ,CAAC,cAAmB,KAAA;AAClB,QAAI,IAAA,CAAC,eAAe,MAAQ,EAAA;AAC5B,QAAM,MAAA,UAAA,GAAa,IAAI,eAAgB,EAAA;AACvC,QAAM,MAAA,UAAA,GAAa,mBAAmB,cAAc,CAAA;AACpD,QAAA,MAAM,mBAAsB,GAAA,gBAAA;AAAA,UAC1B,UAAA;AAAA,UACA,UAAW,CAAA;AAAA,SACb;AACA,QAAA,eAAA,CAAgB,eAAe,IAAI,CAAA;AACnC,QAAA,mBAAA,CAAoB,QAAQ,MAAM;AAChC,UAAA,KAAA,CAAM,MAAM;AACV,YAAA,eAAA,CAAgB,eAAe,KAAK,CAAA;AACpC,YAAS,QAAA,CAAA,gBAAA,EAAkB,EAAE,CAAA;AAAA,WAC9B,CAAA;AAAA,SACF,CAAA;AAED,QAAA,OAAO,UAAU,MAAM;AACrB,UAAA,UAAA,CAAW,KAAM,EAAA;AAAA,SAClB,CAAA;AAAA;AACH;AACF,GACF;AAEA,EAAS,SAAA,eAAA,CACP,KACA,KACA,EAAA;AACA,IAAA,MAAM,YAAe,GAAA,OAAA,CAAQ,MAAM,KAAA,CAAM,GAAG,CAAC,CAAA;AAC7C,IAAI,IAAA,OAAO,UAAU,UAAY,EAAA;AAC/B,MAAM,MAAA,MAAA,GAAS,KAAM,CAAA,YAAA,IAAgB,KAAK,CAAA;AAC1C,MAAA,IAAI,CAAG,EAAA,YAAY,CAAO,CAAA,KAAA,CAAA,EAAG,MAAM,CAAI,CAAA,EAAA;AACvC,MAAA,SAAA,CAAU,KAAK,YAAa,CAAA,YAAA,CAAa,GAAG,CAAG,EAAA,CAAA,EAAG,MAAM,CAAE,CAAA,CAAA;AAC1D,MAAA;AAAA;AAEF,IAAA,IAAI,CAAG,EAAA,YAAY,CAAO,CAAA,KAAA,CAAA,EAAG,KAAK,CAAI,CAAA,EAAA;AACtC,IAAO,OAAA,SAAA,CAAU,KAAK,YAAa,CAAA,YAAA,CAAa,GAAG,CAAG,EAAA,CAAA,EAAG,KAAK,CAAE,CAAA,CAAA;AAAA;AAGlE,EAAO,OAAA,CAAC,WAAW,MAAQ,EAAA,KAAK,GAAG,EAAE,eAAA,EAAiB,UAAU,CAAA;AAClE;AAEA,IAAM,kBAAA,GAAqB,cAAc,uBAAuB,CAAA;AAEzD,IAAM,oBAAA,GAAuB,CAClC,YAAA,EACA,OACkB,KAAA;AAClB,EAAA,MAAM,QAAQ,UAAW,CAAA,YAAA,EAAc,EAAE,IAAA,EAAM,SAAS,CAAA;AACxD,EAAO,OAAA,OAAA,CAAQ,kBAAoB,EAAA,KAAA,EAAO,OAAO,CAAA;AACnD,CAAA;AAEO,IAAM,gBAAA,GAAmB,CAAC,OAA2B,KAAA;AAC1D,EAAA,MAAM,CAAC,KAAO,EAAA,EAAE,iBAAiB,QAAU,EAAA,QAAA,EAAU,CAAI,GAAA,OAAA;AAEzD,EAAA,SAAS,qBAAqB,SAA8C,EAAA;AAC1E,IAAA,QAAA,CAAS,kBAAkB,CAACA,MAAAA,KAAU,CAAC,GAAGA,MAAAA,EAAO,SAAS,CAAC,CAAA;AAAA;AAG7D,EAAA,SAAS,KAAQ,GAAA;AACf,IAAA,eAAA,CAAgB,UAAU,KAAK,CAAA;AAAA;AAGjC,EAAA,SAAS,IAAO,GAAA;AACd,IAAA,eAAA,CAAgB,UAAU,IAAI,CAAA;AAAA;AAGhC,EAAA,SAAS,MAAS,GAAA;AAChB,IAAA,eAAA,CAAgB,QAAU,EAAA,CAACC,KAAS,KAAA,CAACA,KAAI,CAAA;AAAA;AAG3C,EAAA,OAAO,CAAC,KAAO,EAAA,EAAE,sBAAsB,KAAO,EAAA,IAAA,EAAM,QAAQ,CAAA;AAC9D,CAAA;AAEa,IAAA,SAAA,GAAY,CAAC,OAA0C,KAAA;AAClE,EAAM,MAAA,OAAA,GAAyB,OAAQ,CAAA,kBAAA,EAAoB,OAAO,CAAA;AAElE,EAAA,IAAI,CAAC,OAAS,EAAA;AACZ,IAAA,MAAM,OAAQ,CAAA,KAAA;AAAA,MACZ;AAAA,KACF;AAAA;AAGF,EAAA,OAAO,iBAAiB,OAAO,CAAA;AACjC;AAEa,IAAA,gBAAA,GAAmB,CAAC,OAAqB,KAAA;AACpD,EAAA,MAAM,OAAU,GAAA,sBAAA;AAAA,IACd,kBAAA;AAAA,IACA;AAAA,GACF;AACA,EAAA,OAAO,iBAAiB,OAAO,CAAA;AACjC;;;ACjIO,SAAS,YAAmC,OAAY,EAAA;AAC7D,EAAA,OAAA,CAAQ,MAAM,OAAU,GAAA,MAAA;AAC1B;AAEO,SAAS,YAAmC,OAAY,EAAA;AAC7D,EAAA,OAAA,CAAQ,MAAM,OAAU,GAAA,OAAA;AAC1B;AAEO,SAAS,oBAAoB,KAA4B,EAAA;AAC9D,EAAA,MAAM,UAAa,GAAA;AAAA,IACjB,QAAA,EAAU,KAAM,CAAA,gBAAA,CAAiB,oBAAoB,CAAA;AAAA,IACrD,MAAA,EAAQ,KAAM,CAAA,gBAAA,CAAiB,kBAAkB,CAAA;AAAA,IACjD,aAAA,EAAe,KAAM,CAAA,gBAAA,CAAiB,0BAA0B,CAAA;AAAA,IAChE,eAAA,EAAiB,KAAM,CAAA,gBAAA,CAAiB,4BAA4B,CAAA;AAAA,IACpE,QAAA,EAAU,KAAM,CAAA,gBAAA,CAAiB,oBAAoB,CAAA;AAAA,IACrD,OAAA,EAAS,KAAM,CAAA,gBAAA,CAAiB,mBAAmB,CAAA;AAAA,IACnD,KAAA,EAAO,KAAM,CAAA,gBAAA,CAAiB,iBAAiB,CAAA;AAAA,IAC/C,IAAA,EAAM,KAAM,CAAA,gBAAA,CAAiB,gBAAgB,CAAA;AAAA,IAC7C,OAAA,EAAS,KAAM,CAAA,gBAAA,CAAiB,mBAAmB,CAAA;AAAA,IACnD,IAAA,EAAM,KAAM,CAAA,gBAAA,CAAiB,gBAAgB,CAAA;AAAA,IAC7C,GAAA,EAAK,KAAM,CAAA,gBAAA,CAAiB,eAAe,CAAA;AAAA,IAC3C,GAAA,EAAK,KAAM,CAAA,gBAAA,CAAiB,eAAe,CAAA;AAAA,IAC3C,KAAA,EAAO,KAAM,CAAA,gBAAA,CAAiB,iBAAiB,CAAA;AAAA,IAC/C,MAAA,EAAQ,KAAM,CAAA,gBAAA,CAAiB,kBAAkB,CAAA;AAAA,IACjD,WAAA,EAAa,KAAM,CAAA,gBAAA,CAAiB,wBAAwB,CAAA;AAAA,IAC5D,UAAA,EAAY,KAAM,CAAA,gBAAA,CAAiB,uBAAuB,CAAA;AAAA,IAC1D,SAAA,EAAW,KAAM,CAAA,gBAAA,CAAiB,sBAAsB,CAAA;AAAA,IACxD,SAAA,EAAW,KAAM,CAAA,gBAAA,CAAiB,sBAAsB,CAAA;AAAA,IACxD,SAAA,EAAW,KAAM,CAAA,gBAAA,CAAiB,sBAAsB,CAAA;AAAA,IACxD,YAAA,EAAc,KAAM,CAAA,gBAAA,CAAiB,yBAAyB,CAAA;AAAA,IAC9D,KAAA,EAAO,KAAM,CAAA,gBAAA,CAAiB,iBAAiB,CAAA;AAAA,IAC/C,IAAA,EAAM,KAAM,CAAA,gBAAA,CAAiB,gBAAgB,CAAA;AAAA,IAC7C,QAAA,EAAU,KAAM,CAAA,gBAAA,CAAiB,oBAAoB,CAAA;AAAA,IACrD,cAAA,EAAgB,KAAM,CAAA,gBAAA,CAAiB,2BAA2B;AAAA,GACpE;AACA,EAAO,OAAA;AAAA,IACL,QAAU,EAAA,UAAA,CAAW,QAAW,GAAA,UAAA,CAAW,aAAa,MAAS,GAAA,MAAA;AAAA,IACjE,QAAQ,UAAW,CAAA,MAAA,GAAS,UAAW,CAAA,UAAA,CAAW,MAAM,CAAI,GAAA,MAAA;AAAA,IAC5D,eAAe,UAAW,CAAA,aAAA,GACtB,UAAW,CAAA,UAAA,CAAW,aAAa,CACnC,GAAA,MAAA;AAAA,IACJ,iBAAiB,UAAW,CAAA,eAAA,GACxB,UAAW,CAAA,UAAA,CAAW,eAAe,CACrC,GAAA,MAAA;AAAA,IACJ,UAAU,UAAW,CAAA,QAAA,GAAW,UAAW,CAAA,UAAA,CAAW,QAAQ,CAAI,GAAA,MAAA;AAAA,IAClE,SAAS,UAAW,CAAA,OAAA,GAAU,UAAW,CAAA,UAAA,CAAW,OAAO,CAAI,GAAA,MAAA;AAAA,IAC/D,OAAO,UAAW,CAAA,KAAA,GAAQ,UAAW,CAAA,UAAA,CAAW,KAAK,CAAI,GAAA,MAAA;AAAA,IACzD,IAAA,EAAO,WAAW,IAAmB,IAAA,MAAA;AAAA,IACrC,SAAS,UAAW,CAAA,OAAA,GAAU,UAAW,CAAA,UAAA,CAAW,OAAO,CAAI,GAAA,MAAA;AAAA,IAC/D,MAAM,UAAW,CAAA,IAAA,GAAO,UAAW,CAAA,UAAA,CAAW,IAAI,CAAI,GAAA,MAAA;AAAA,IACtD,KAAK,UAAW,CAAA,GAAA,GAAM,UAAW,CAAA,UAAA,CAAW,GAAG,CAAI,GAAA,MAAA;AAAA,IACnD,KAAK,UAAW,CAAA,GAAA,GAAM,UAAW,CAAA,UAAA,CAAW,GAAG,CAAI,GAAA,MAAA;AAAA,IACnD,OAAO,UAAW,CAAA,KAAA,GAAQ,UAAW,CAAA,UAAA,CAAW,KAAK,CAAI,GAAA,MAAA;AAAA,IACzD,QAAQ,UAAW,CAAA,MAAA,GAAS,QAAS,CAAA,UAAA,CAAW,MAAM,CAAI,GAAA,MAAA;AAAA,IAC1D,aAAa,UAAW,CAAA,WAAA,GACpB,UAAW,CAAA,UAAA,CAAW,WAAW,CACjC,GAAA,MAAA;AAAA,IACJ,UAAA,EAAa,WAAW,UAA6B,IAAA,MAAA;AAAA,IACrD,WAAW,UAAW,CAAA,SAAA,GAClB,UAAW,CAAA,UAAA,CAAW,SAAS,CAC/B,GAAA,MAAA;AAAA,IACJ,WAAW,UAAW,CAAA,SAAA,GAClB,UAAW,CAAA,UAAA,CAAW,SAAS,CAC/B,GAAA,MAAA;AAAA,IACJ,WAAW,UAAW,CAAA,SAAA,GAClB,UAAW,CAAA,UAAA,CAAW,SAAS,CAC/B,GAAA,MAAA;AAAA,IACJ,cAAc,UAAW,CAAA,YAAA,GACrB,UAAW,CAAA,UAAA,CAAW,YAAY,CAClC,GAAA,MAAA;AAAA,IACJ,IAAA,EAAO,WAAW,IAAmC,IAAA,MAAA;AAAA,IACrD,UAAU,UAAW,CAAA,QAAA,GAAW,UAAW,CAAA,UAAA,CAAW,QAAQ,CAAI,GAAA,MAAA;AAAA,IAClE,gBAAgB,UAAW,CAAA,cAAA,GACvB,UAAW,CAAA,UAAA,CAAW,cAAc,CACpC,GAAA;AAAA,GACN;AACF;;;ACjFO,IAAM,QAAW,GAAA;AAAA,EACtB,GAAK,EAAA,KAAA;AAAA,EACL,MAAQ,EAAA,QAAA;AAAA,EACR,IAAM,EAAA,MAER,CAAA;;;AHGO,IAAM,IAAO,GAAA,CAAA,cAAA,CAAA;AAEb,IAAM,SAAsD,GAAA,CACjE,CACA,EAAA,EAAE,SACC,KAAA;AACH,EAAA,MAAM,CAAC,KAAO,EAAA,EAAE,sBAAsB,CAAA,GAAI,UAAU,OAAO,CAAA;AAE3D,EAAA,IAAI,aAAgB,GAAA,IAAA;AAEpB,EAAAC,YAAAA;AAAA,IACEC,EAAAA;AAAA,MACE,MAAM,KAAM,CAAA,MAAA;AAAA,MACZ,CAAC,MAAW,KAAA;AACV,QAAI,IAAA,CAAC,UAAU,aAAe,EAAA;AAC9B,QAAM,MAAA,SAAA,GAAY,MAAM,OAAO,CAAA;AAC/B,QAAA,oBAAA,CAAqB,SAAS,CAAA;AAC9B,QAAA,OAAOC,UAAU,MAAM;AACrB,UAAA,IAAI,SAAU,CAAA,KAAA,KAAU,UAAY,EAAA,SAAA,CAAU,QAAS,EAAA;AAAA,SACxD,CAAA;AAAA;AACH;AACF,GACF;AAEA,EAAAF,YAAAA;AAAA,IACEC,EAAAA;AAAA,MACE,MAAM,KAAM,CAAA,MAAA;AAAA,MACZ,CAAC,MAAW,KAAA;AACV,QAAA,IAAI,UAAU,aAAe,EAAA;AAC7B,QAAM,MAAA,SAAA,GAAY,KAAK,OAAO,CAAA;AAC9B,QAAA,oBAAA,CAAqB,SAAS,CAAA;AAC9B,QAAA,OAAOC,UAAU,MAAM;AACrB,UAAA,IAAI,SAAU,CAAA,KAAA,KAAU,UAAY,EAAA,SAAA,CAAU,QAAS,EAAA;AAAA,SACxD,CAAA;AAAA;AACH;AACF,GACF;AAEA,EAAA,OAAA,CAAQ,MAAM;AACZ,IAAgB,aAAA,GAAA,KAAA;AAAA,GACjB,CAAA;AAED,EAAA,SAAS,MAAMC,QAAsB,EAAA;AACnC,IAAM,MAAA,KAAA,GAAQ,MAAO,CAAA,gBAAA,CAAiBA,QAAO,CAAA;AAC7C,IAAM,MAAA,UAAA,GAAa,oBAAoB,KAAK,CAAA;AAC5C,IAAI,IAAA,QAAA,GAAW,KAAM,CAAA,gBAAA,CAAiB,oBAAoB,CAAA;AAC1D,IAAI,IAAA,CAAC,QAAU,EAAA,QAAA,GAAW,QAAS,CAAA,IAAA;AAEnC,IAAA,IAAI,SAAsC,GAAA;AAAA,MACxC,CAAA,EAAG,CAAC,2BAAA,EAA6B,yBAAyB;AAAA,KAC5D;AAEA,IAAA,IAAI,QAAa,KAAA,QAAA,CAAS,GAAO,IAAA,QAAA,KAAa,SAAS,MAAQ,EAAA;AAC7D,MAAY,SAAA,GAAA;AAAA,QACV,CAAA,EAAG,CAAC,2BAAA,EAA6B,yBAAyB;AAAA,OAC5D;AAAA;AAGF,IAAO,OAAA,OAAA;AAAA,MACLA,QAAAA;AAAA,MACA;AAAA,QACE,GAAG;AAAA,OACL;AAAA,MACA;AAAA,KACF;AAAA;AAGF,EAAA,SAAS,KAAKA,QAAsB,EAAA;AAClC,IAAM,MAAA,KAAA,GAAQ,MAAO,CAAA,gBAAA,CAAiBA,QAAO,CAAA;AAC7C,IAAM,MAAA,UAAA,GAAa,oBAAoB,KAAK,CAAA;AAC5C,IAAI,IAAA,QAAA,GAAW,KAAM,CAAA,gBAAA,CAAiB,oBAAoB,CAAA;AAC1D,IAAI,IAAA,CAAC,QAAU,EAAA,QAAA,GAAW,QAAS,CAAA,IAAA;AAEnC,IAAA,IAAI,SAAsC,GAAA;AAAA,MACxC,CAAA,EAAG,CAAC,yBAAA,EAA2B,2BAA2B;AAAA,KAC5D;AAEA,IAAA,IAAI,QAAa,KAAA,QAAA,CAAS,GAAO,IAAA,QAAA,KAAa,SAAS,MAAQ,EAAA;AAC7D,MAAY,SAAA,GAAA;AAAA,QACV,CAAA,EAAG,CAAC,yBAAA,EAA2B,2BAA2B;AAAA,OAC5D;AAAA;AAGF,IAAO,OAAA,OAAA;AAAA,MACLA,QAAAA;AAAA,MACA;AAAA,QACE,GAAG;AAAA,OACL;AAAA,MACA;AAAA,KACF;AAAA;AAEJ,CAAA;;;AItGA,IAAA,sBAAA,GAAA,EAAA;AAAA,QAAA,CAAA,sBAAA,EAAA;AAAA,EAAAC,SAAAA,EAAAA,MAAAA,UAAAA;AAAA,EAAA,IAAAC,EAAAA,MAAAA;AAAA,CAAA,CAAA;AAkBO,IAAMA,KAAO,GAAA,gBAAA;AAEb,IAAMD,UAAsD,GAAA,CACjE,KACA,EAAA,EAAE,SACC,KAAA;AACH,EAAAJ,aAAa,MAAM;AACjB,IAAM,MAAA,UAAA,GAAa,KAAM,CAAA,MAAA,EACvB,MAAS,GAAA,KAAA,CAAM,QACfC,GAAK,GAAA,KAAA,CAAM,EACX,EAAA,cAAA,GAAiB,KAAM,CAAA,cAAA;AAEzB,IAAA,IAAI,CAAC,UAAA;AACH,MAAA,OAAO,OAAQ,CAAA,IAAA,CAAK,CAAGI,EAAAA,KAAI,8BAA8B,OAAO,CAAA;AAClE,IAAA,IAAI,CAAC,MAAA;AACH,MAAA,OAAO,OAAQ,CAAA,IAAA,CAAK,CAAGA,EAAAA,KAAI,8BAA8B,OAAO,CAAA;AAClE,IAAA,IAAI,MAAW,KAAA,OAAA,IAAW,MAAW,KAAA,MAAA,IAAU,MAAW,KAAA,QAAA;AACxD,MAAA,OAAO,OAAQ,CAAA,IAAA;AAAA,QACb,GAAGA,KAAI,CAAA,kDAAA;AAAA,OACT;AACF,IAAA,IAAI,CAACJ,GAAI,EAAA,OAAO,QAAQ,IAAK,CAAA,CAAA,EAAGI,KAAI,CAAwB,sBAAA,CAAA,CAAA;AAE5D,IAAM,MAAA,MAAA,GAAS,QAAS,CAAA,aAAA,CAAc,UAAU,CAAA;AAChD,IAAA,IAAI,CAAC,MAAA;AACH,MAAA,OAAO,OAAQ,CAAA,IAAA,CAAK,CAAGA,EAAAA,KAAI,CAA+B,2BAAA,CAAA,EAAA;AAAA,QACxD,OAAA;AAAA,QACA,MAAQ,EAAA;AAAA,OACT,CAAA;AAEH,IAAM,MAAA,UAAA,GAAa,IAAI,eAAgB,EAAA;AAEvC,IAAA,cAAA;AAAA,MACE,MAAM;AACJ,QAAA,UAAA,CAAW,CAAC,OAAY,KAAA;AACtB,UAAM,MAAA,CAAC,OAAO,EAAE,IAAA,EAAM,OAAO,MAAO,EAAC,CAAI,GAAA,gBAAA,CAAiB,MAAM,CAAA;AAEhE,UAAA,QAAQJ,GAAI;AAAA,YACV,KAAK,OAAS,EAAA;AACZ,cAAA,IAAI,WAAc,GAAA,IAAA;AAClB,cAAA,IAAI,WAAW,QAAU,EAAA;AACvB,gBAAc,WAAA,GAAA,wBAAA,CAAyB,OAAS,EAAA,IAAA,EAAM,KAAK,CAAA;AAAA;AAG7D,cAAI,IAAA,WAAA,EAAaC,SAAAA,CAAU,WAAW,CAAA;AACtC,cAAA;AAAA;AACF,YACA,KAAK,MAAQ,EAAA;AACX,cAAA,IAAI,WAAc,GAAA,IAAA;AAClB,cAAA,IAAI,WAAW,QAAU,EAAA;AACvB,gBAAc,WAAA,GAAA,wBAAA,CAAyB,OAAS,EAAA,KAAA,EAAO,IAAI,CAAA;AAAA;AAG7D,cAAI,IAAA,WAAA,EAAaA,SAAAA,CAAU,WAAW,CAAA;AACtC,cAAA;AAAA;AACF,YAEA,SAAS;AACP,cAAQ,OAAA,CAAA,gBAAA;AAAA,gBACND,GAAAA;AAAA,gBACA,CAAC,KAAU,KAAA;AACT,kBAAI,IAAA,cAAA,QAAsB,cAAe,EAAA;AACzC,kBAAA,IAAI,MAAM,WAAa,EAAA;AACvB,kBAAA,QAAQ,MAAQ;AAAA,oBACd,KAAK,OAAA;AACH,sBAAM,KAAA,EAAA;AACN,sBAAA;AAAA,oBACF,KAAK,MAAA;AACH,sBAAK,IAAA,EAAA;AACL,sBAAA;AAAA,oBACF,KAAK,QAAA;AACH,sBAAO,MAAA,EAAA;AACP,sBAAA;AAAA;AACJ,iBACF;AAAA,gBACA,EAAE,MAAQ,EAAA,UAAA,CAAW,MAAO;AAAA,eAC9B;AACA,cAAA;AAAA;AACF;AAGF,UAAAD,aAAa,MAAM;AACjB,YAAA,OAAA,CAAQ,YAAa,CAAA,SAAA,EAAW,CAAG,EAAA,KAAA,CAAM,MAAM,CAAE,CAAA,CAAA;AACjD,YAAA,OAAA,CAAQ,YAAa,CAAA,cAAA,EAAgB,CAAG,EAAA,KAAA,CAAM,WAAW,CAAE,CAAA,CAAA;AAAA,WAC5D,CAAA;AAED,UAAW,UAAA,CAAA,MAAA,CAAO,gBAAiB,CAAA,OAAA,EAAS,OAAO,CAAA;AAAA,SACpD,CAAA;AAAA,OACH;AAAA,MACA,EAAE,MAAQ,EAAA,UAAA,CAAW,MAAO;AAAA,KAC9B;AAEA,IAAA,OAAOE,UAAU,MAAM;AACrB,MAAA,UAAA,CAAW,KAAM,EAAA;AAAA,KAClB,CAAA;AAAA,GACF,CAAA;AACH,CAAA;;;ACjHA,IAAA,uBAAA,GAAA,EAAA;AAAA,QAAA,CAAA,uBAAA,EAAA;AAAA,EAAAE,SAAAA,EAAAA,MAAAA,UAAAA;AAAA,EAAA,IAAAC,EAAAA,MAAAA;AAAA,CAAA,CAAA;AAUO,IAAMA,KAAO,GAAA,CAAA,eAAA,CAAA;AAEb,IAAMD,UAAuD,GAAA,CAClE,CACA,EAAA,EAAE,SACC,KAAA;AACH,EAAM,MAAA,CAAC,OAAO,EAAE,oBAAA,EAAsB,OAAO,CAAA,GAAI,UAAU,OAAO,CAAA;AAClE,EAAM,MAAA,UAAA,GAAa,IAAI,eAAgB,EAAA;AAEvC,EAAA,IAAI,aAAgB,GAAA,IAAA;AAEpB,EAAAJ,YAAAA;AAAA,IACEC,EAAAA;AAAA,MACE,MAAM,KAAM,CAAA,MAAA;AAAA,MACZ,CAAC,MAAW,KAAA;AACV,QAAI,IAAA,CAAC,UAAU,aAAe,EAAA;AAC9B,QAAM,MAAA,SAAA,GAAY,MAAM,OAAO,CAAA;AAC/B,QAAA,oBAAA,CAAqB,SAAS,CAAA;AAC9B,QAAA,OAAOC,UAAU,MAAM;AACrB,UAAA,IAAI,SAAU,CAAA,KAAA,KAAU,UAAY,EAAA,SAAA,CAAU,QAAS,EAAA;AAAA,SACxD,CAAA;AAAA;AACH;AACF,GACF;AAEA,EAAAF,YAAAA;AAAA,IACEC,EAAAA;AAAA,MACE,MAAM,KAAM,CAAA,MAAA;AAAA,MACZ,CAAC,MAAW,KAAA;AACV,QAAA,IAAI,UAAU,aAAe,EAAA;AAC7B,QAAM,MAAA,SAAA,GAAY,KAAK,OAAO,CAAA;AAC9B,QAAA,oBAAA,CAAqB,SAAS,CAAA;AAC9B,QAAA,OAAOC,UAAU,MAAM;AACrB,UAAA,IAAI,SAAU,CAAA,KAAA,KAAU,UAAY,EAAA,SAAA,CAAU,QAAS,EAAA;AAAA,SACxD,CAAA;AAAA;AACH;AACF,GACF;AAEA,EAAAI,QAAQ,MAAM;AACZ,IAAgB,aAAA,GAAA,KAAA;AAAA,GACjB,CAAA;AAED,EAAA,SAAS,MAAMH,QAAsB,EAAA;AACnC,IAAM,MAAA,KAAA,GAAQ,MAAO,CAAA,gBAAA,CAAiBA,QAAO,CAAA;AAC7C,IAAM,MAAA,OAAA,GAAU,oBAAoB,KAAK,CAAA;AACzC,IAAOI,OAAAA,OAAAA;AAAA,MACLJ,QAAAA;AAAA,MACA;AAAA,QACE,OAAA,EAAS,CAAC,CAAA,2BAAA,CAAA,EAA+B,CAA2B,yBAAA,CAAA;AAAA,OACtE;AAAA,MACA;AAAA,KACF;AAAA;AAGF,EAAA,SAAS,KAAKA,QAAsB,EAAA;AAClC,IAAM,MAAA,KAAA,GAAQ,MAAO,CAAA,gBAAA,CAAiBA,QAAO,CAAA;AAC7C,IAAM,MAAA,OAAA,GAAU,oBAAoB,KAAK,CAAA;AACzC,IAAOI,OAAAA,OAAAA;AAAA,MACLJ,QAAAA;AAAA,MACA;AAAA,QACE,OAAA,EAAS,CAAC,CAAA,yBAAA,CAAA,EAA6B,CAA6B,2BAAA,CAAA;AAAA,OACtE;AAAA,MACA;AAAA,KACF;AAAA;AAGF,EAAQ,OAAA,CAAA,gBAAA;AAAA,IACN,OAAA;AAAA,IACA,MAAM;AACJ,MAAA,IAAI,MAAM,WAAa,EAAA;AACvB,MAAM,KAAA,EAAA;AAAA,KACR;AAAA,IACA;AAAA,MACE,QAAQ,UAAW,CAAA;AAAA;AACrB,GACF;AAEA,EAAAD,UAAU,MAAM;AACd,IAAA,UAAA,CAAW,KAAM,EAAA;AAAA,GAClB,CAAA;AAED,EAAgB,aAAA,GAAA,KAAA;AAClB,CAAA;;;AC7FA,IAAA,sBAAA,GAAA,EAAA;AAAA,QAAA,CAAA,sBAAA,EAAA;AAAA,EAAAE,SAAAA,EAAAA,MAAAA,UAAAA;AAAA,EAAA,IAAAC,EAAAA,MAAAA;AAAA,CAAA,CAAA;AAkBO,IAAMA,KAAO,GAAA,CAAA,cAAA,CAAA;AAEb,IAAMD,UAAsD,GAAA,CACjE,KACA,EAAA,EAAE,SACC,KAAA;AACH,EAAA,MAAM,CAAC,YAAA,EAAc,SAAS,CAAA,GAAII,WAAW,KAAO,EAAA;AAAA,IAClD,QAAA;AAAA,IACA;AAAA,GACD,CAAA;AAED,EAAM,MAAA,OAAA,GAAU,oBAAqB,CAAA,YAAA,EAAc,OAAO,CAAA;AAE1D,EAAA,MAAM,CAAC,KAAA,EAAO,EAAE,eAAA,EAAiB,CAAI,GAAA,OAAA;AAErC,EAAM,MAAA,CAAC,GAAG,EAAE,oBAAA,EAAsB,GAAG,MAAO,EAAC,CAAI,GAAA,gBAAA,CAAiB,OAAO,CAAA;AAEzE,EAAA,OAAA,CAAQ,OAAU,GAAA,MAAA;AAElB,EAAM,MAAA,SAAA,GAAY,eAAgB,CAAA,OAAA,EAAS,OAAO;AAAA,IAChD,iBAAmB,EAAA,IAAA;AAAA,IACnB,mBAAmB,SAAU,CAAA,aAAA;AAAA,IAC7B,cAAc,MAAM;AAClB,MAAA,eAAA,CAAgB,UAAU,KAAK,CAAA;AAAA;AACjC,GACA,CAAA,CAAA;AAEF,EAAAR,aAAa,MAAM;AACjB,IAAI,IAAA,CAAC,MAAM,KAAO,EAAA;AAClB,IAAA,OAAA,CAAQ,KAAM,CAAA;AAAA,MACZ,GAAG;AAAA,KACJ,CAAA;AAAA,GACF,CAAA;AAED,EAAAA,YAAAA;AAAA,IACEC,EAAAA;AAAA,MACE,MAAM,KAAM,CAAA,MAAA;AAAA,MACZ,CAAC,MAAW,KAAA;AACV,QAAM,MAAA,SAAA,GAAY,SAAS,aAAgB,GAAA,cAAA;AAC3C,QAAQ,OAAA,CAAA,aAAA;AAAA,UACN,IAAI,YAAY,SAAW,EAAA;AAAA,YACzB,OAAS,EAAA,IAAA;AAAA,YACT,MAAQ,EAAA,EAAE,MAAQ,EAAA,aAAA,EAAe,OAAQ;AAAA,WAC1C;AAAA,SACH;AACA,QAAQ,OAAA,CAAA,aAAA;AAAA,UACN,IAAI,YAAY,eAAiB,EAAA;AAAA,YAC/B,OAAS,EAAA,IAAA;AAAA,YACT,MAAQ,EAAA,EAAE,MAAQ,EAAA,aAAA,EAAe,OAAQ;AAAA,WAC1C;AAAA,SACH;AAAA;AACF;AACF,GACF;AAEA,EAAAD,YAAAA;AAAA,IACEC,EAAAA;AAAA,MACE,OAAO;AAAA,QACL,QAAQ,KAAM,CAAA,MAAA;AAAA,QACd,WAAW,SAAU,EAAA;AAAA,QACrB,iBAAiB,SAAU,CAAA;AAAA,OAC7B,CAAA;AAAA,MACA,CAAC,EAAE,MAAA,EAAQ,SAAAQ,EAAAA,UAAAA,EAAW,iBAAsB,KAAA;AAC1C,QAAA,IAAI,CAAC,MAAQ,EAAA;AACb,QAAA,IAAI,KAAM,CAAA,KAAA,EAAe,OAAA,CAAA,GAAA,CAAI,mBAAmB,OAAO,CAAA;AACvD,QAAA,WAAA,CAAY,OAAO,CAAA;AACnB,QAAA,IAAI,CAAC,eAAiB,EAAA;AACtB,QAAAA,WAAU,QAAS,EAAA;AACnB,QAAAP,SAAAA,CAAUO,WAAU,UAAU,CAAA;AAAA;AAChC;AACF,GACF;AAEA,EAAAT,YAAAA;AAAA,IACEC,EAAAA;AAAA,MACE,OAAO;AAAA,QACL,QAAQ,KAAM,CAAA,MAAA;AAAA,QACd,aAAa,KAAM,CAAA;AAAA,OACrB,CAAA;AAAA,MACA,CAAC,EAAE,MAAQ,EAAA,WAAA,EAAkB,KAAA;AAC3B,QAAA,IAAI,UAAU,CAAC,WAAA;AACb,UAAA,OAAO,kBAAkB,OAAS,EAAA;AAAA,YAChC,cAAA,EAAgB,CAAC,EAAoB,KAAA;AACnC,cAAA,IAAI,cAAc,WAAa,EAAA;AAC7B,gBAAA,IAAIE,QAAU,GAAA,EAAA;AACd,gBAAOA,OAAAA,QAAAA,IAAWA,QAAY,KAAA,QAAA,CAAS,IAAM,EAAA;AAC3C,kBAAIA,IAAAA,QAAAA,CAAQ,YAAY,gBAAkB,EAAA;AACxC,oBAAO,OAAA,IAAA;AAAA;AAGT,kBAAAA,WAAUA,QAAQ,CAAA,aAAA;AAAA;AACpB;AAEF,cAAO,OAAA,KAAA;AAAA;AACT,WACD,CAAA;AACH,QAAAD,UAAU,MAAM;AACd,UAAA,gBAAA,CAAiB,OAAO,CAAA;AAAA,SACzB,CAAA;AAAA;AACH;AACF,GACF;AAEA,EAAAF,YAAAA;AAAA,IACEC,EAAAA;AAAA,MACE,OAAO,EAAE,MAAA,EAAQ,MAAM,MAAQ,EAAA,cAAA,EAAgB,MAAM,cAAe,EAAA,CAAA;AAAA,MACpE,CAAC,EAAE,MAAQ,EAAA,cAAA,EAAqB,KAAA;AAC9B,QAAA,IAAI,MAAQ,EAAA;AACZ,QAAA,IAAI,KAAM,CAAA,KAAA;AACR,UAAQ,OAAA,CAAA,GAAA,CAAI,yCAAyC,cAAc,CAAA;AACrE,QAAO,OAAA,OAAA,CAAQ,GAAI,CAAA,cAAc,CAC9B,CAAA,IAAA,CAAK,MAAM,WAAA,CAAY,OAAO,CAAC,CAC/B,CAAA,IAAA,CAAK,MAAM;AACV,UAAA,IAAI,KAAM,CAAA,KAAA,EAAe,OAAA,CAAA,GAAA,CAAI,kBAAkB,OAAO,CAAA;AAAA,SACvD,CAAA;AAAA;AACL;AACF,GACF;AAEA,EAAAC,UAAU,MAAM;AACd,IAAA,iBAAA,CAAkB,OAAO,CAAA;AAAA,GAC1B,CAAA;AACH,CAAA;;;AChIA,uBAAA;AAAA,EACE,sBAAc,CAAA,IAAA;AAAA,EACd;AAAA,IACE,MAAQ,EAAA,KAAA;AAAA,IACR,EAAI,EAAA,EAAA;AAAA,IACJ,aAAe,EAAA,KAAA;AAAA,IACf,eAAiB,EAAA,KAAA;AAAA,IACjB,WAAa,EAAA,KAAA;AAAA,IACb,KAAO,EAAA;AAAA,GACT;AAAA,EACA,kBAAA,CAAmB,uBAAc,SAAS;AAC5C,CAAA;AAEA,uBAAA;AAAA,EACE,sBAAc,CAAA,IAAA;AAAA,EACd,EAAE,QAAQ,EAAI,EAAA,MAAA,EAAQ,IAAI,EAAI,EAAA,OAAA,EAAS,gBAAgB,IAAK,EAAA;AAAA,EAC5D,kBAAA,CAAmB,uBAAc,SAAS;AAC5C,CAAA;AAEA,uBAAA;AAAA,EACE,uBAAe,CAAA,IAAA;AAAA,EACf,EAAC;AAAA,EACD,kBAAA,CAAmB,wBAAe,SAAS;AAC7C,CAAA;AAEA,uBAAA;AAAA,EACE,sBAAc,CAAA,IAAA;AAAA,EACd,EAAC;AAAA,EACD,kBAAA,CAAmB,uBAAc,SAAS;AAC5C,CAAA","file":"index.js","sourcesContent":["import type { CorrectComponentType } from \"@brytdesigns/web-component-utils\";\n\nimport { createEffect, on, onCleanup, onMount } from \"solid-js\";\nimport { animate } from \"motion\";\n\nimport { useDrawer } from \"../hooks/index.js\";\nimport { getTransitionConfig } from \"../utils.js\";\nimport { POSITION, type Position } from \"../consts.js\";\n\ntype DrawerContentProps = {};\n\nexport const Name = `drawer-content`;\n\nexport const Component: CorrectComponentType<DrawerContentProps> = (\n  _,\n  { element },\n) => {\n  const [state, { updateAnimationQueue }] = useDrawer(element);\n\n  let isFirstRender = true;\n\n  createEffect(\n    on(\n      () => state.isOpen,\n      (isOpen) => {\n        if (!isOpen || isFirstRender) return;\n        const animation = enter(element);\n        updateAnimationQueue(animation);\n        return onCleanup(() => {\n          if (animation.state !== \"finished\") animation.complete();\n        });\n      },\n    ),\n  );\n\n  createEffect(\n    on(\n      () => state.isOpen,\n      (isOpen) => {\n        if (isOpen || isFirstRender) return;\n        const animation = exit(element);\n        updateAnimationQueue(animation);\n        return onCleanup(() => {\n          if (animation.state !== \"finished\") animation.complete();\n        });\n      },\n    ),\n  );\n\n  onMount(() => {\n    isFirstRender = false;\n  });\n\n  function enter(element: HTMLElement) {\n    const style = window.getComputedStyle(element);\n    const transition = getTransitionConfig(style);\n    let position = style.getPropertyValue(\"--drawer--position\") as Position;\n    if (!position) position = POSITION.LEFT;\n\n    let transform: Record<string, string[]> = {\n      x: [\"var(--drawer--slide-from)\", \"var(--drawer--slide-to)\"],\n    };\n\n    if (position === POSITION.TOP || position === POSITION.BOTTOM) {\n      transform = {\n        y: [\"var(--drawer--slide-from)\", \"var(--drawer--slide-to)\"],\n      };\n    }\n\n    return animate(\n      element,\n      {\n        ...transform,\n      },\n      transition,\n    );\n  }\n\n  function exit(element: HTMLElement) {\n    const style = window.getComputedStyle(element);\n    const transition = getTransitionConfig(style);\n    let position = style.getPropertyValue(\"--drawer--position\") as Position;\n    if (!position) position = POSITION.LEFT;\n\n    let transform: Record<string, string[]> = {\n      x: [\"var(--drawer--slide-to)\", \"var(--drawer--slide-from)\"],\n    };\n\n    if (position === POSITION.TOP || position === POSITION.BOTTOM) {\n      transform = {\n        y: [\"var(--drawer--slide-to)\", \"var(--drawer--slide-from)\"],\n      };\n    }\n\n    return animate(\n      element,\n      {\n        ...transform,\n      },\n      transition,\n    );\n  }\n};\n","import {\n  type ICustomElement,\n  createContext,\n  provide,\n  consume,\n} from \"component-register\";\nimport {\n  createEffect,\n  on,\n  batch,\n  splitProps,\n  untrack,\n  mergeProps,\n  onCleanup,\n} from \"solid-js\";\nimport { createStore } from \"solid-js/store\";\nimport {\n  toHyphenated,\n  getContextFromProvider,\n} from \"@brytdesigns/web-component-utils\";\n\nimport type { AnimationPlaybackControlsWithThen } from \"motion\";\nimport { abortablePromise } from \"@brytdesigns/web-component-core/promise\";\nimport { awaitAllAnimations } from \"@brytdesigns/web-component-core/animation\";\n\ntype StoreContext = {\n  animationQueue: AnimationPlaybackControlsWithThen[];\n};\n\ntype CreateContextOptions = {\n  root: HTMLElement & ICustomElement;\n  isOpen: boolean;\n  isAnimating: boolean;\n};\n\ntype WalkableNode = Parameters<typeof provide>[2];\n\ntype DrawerContext = ReturnType<typeof initializeDrawerContext>;\n\nfunction initializeDrawerContext(props: CreateContextOptions) {\n  const [_internal, _state] = splitProps(props, [\"root\"]);\n  const [store, setStore] = createStore<StoreContext>({ animationQueue: [] });\n\n  createEffect(\n    on(\n      () => store.animationQueue,\n      (animationQueue) => {\n        if (!animationQueue.length) return;\n        const controller = new AbortController();\n        const animations = awaitAllAnimations(animationQueue);\n        const abortableAnimations = abortablePromise(\n          animations,\n          controller.signal,\n        );\n        setElementState(\"isAnimating\", true);\n        abortableAnimations.finally(() => {\n          batch(() => {\n            setElementState(\"isAnimating\", false);\n            setStore(\"animationQueue\", []);\n          });\n        });\n\n        return onCleanup(() => {\n          controller.abort();\n        });\n      },\n    ),\n  );\n\n  function setElementState(\n    key: keyof Omit<CreateContextOptions, \"root\">,\n    value: boolean | ((v: boolean) => boolean),\n  ) {\n    const currentValue = untrack(() => props[key]);\n    if (typeof value === \"function\") {\n      const result = value(currentValue || false);\n      if (`${currentValue}` === `${result}`) return;\n      _internal.root.setAttribute(toHyphenated(key), `${result}`);\n      return;\n    }\n    if (`${currentValue}` === `${value}`) return;\n    return _internal.root.setAttribute(toHyphenated(key), `${value}`);\n  }\n\n  return [mergeProps(_state, store), { setElementState, setStore }] as const;\n}\n\nconst DrawerContextState = createContext(initializeDrawerContext);\n\nexport const provideDrawerContext = (\n  initialState: Omit<CreateContextOptions, \"root\">,\n  element: WalkableNode,\n): DrawerContext => {\n  const props = mergeProps(initialState, { root: element });\n  return provide(DrawerContextState, props, element);\n};\n\nexport const useDrawerContext = (context: DrawerContext) => {\n  const [state, { setElementState, setStore: setState }] = context;\n\n  function updateAnimationQueue(animation: AnimationPlaybackControlsWithThen) {\n    setState(\"animationQueue\", (state) => [...state, animation]);\n  }\n\n  function close() {\n    setElementState(\"isOpen\", false);\n  }\n\n  function open() {\n    setElementState(\"isOpen\", true);\n  }\n\n  function toggle() {\n    setElementState(\"isOpen\", (open) => !open);\n  }\n\n  return [state, { updateAnimationQueue, close, open, toggle }] as const;\n};\n\nexport const useDrawer = (element: HTMLElement & ICustomElement) => {\n  const context: DrawerContext = consume(DrawerContextState, element);\n\n  if (!context) {\n    throw console.error(\n      \"DrawerContext not found! Please ensure to wrap your custom element with drawer-context element.\",\n    );\n  }\n\n  return useDrawerContext(context);\n};\n\nexport const getDrawerContext = (element: Element) => {\n  const context = getContextFromProvider<DrawerContext>(\n    DrawerContextState,\n    element,\n  );\n  return useDrawerContext(context);\n};\n","import type {\n  AnimationGeneratorType,\n  AnimationPlaybackControlsWithThen,\n  Easing,\n  RepeatType,\n  Transition,\n} from \"motion\";\n\nexport function hideElement<T extends HTMLElement>(element: T) {\n  element.style.display = \"none\";\n}\n\nexport function showElement<T extends HTMLElement>(element: T) {\n  element.style.display = \"block\";\n}\n\nexport function getTransitionConfig(style: CSSStyleDeclaration) {\n  const properties = {\n    autoplay: style.getPropertyValue(\"--motion--autoplay\"),\n    bounce: style.getPropertyValue(\"--motion--bounce\"),\n    bounceDamping: style.getPropertyValue(\"--motion--bounce-damping\"),\n    bounceStiffness: style.getPropertyValue(\"--motion--bounce-stiffness\"),\n    duration: style.getPropertyValue(\"--motion--duration\"),\n    damping: style.getPropertyValue(\"--motion--damping\"),\n    delay: style.getPropertyValue(\"--motion--delay\"),\n    ease: style.getPropertyValue(\"--motion--ease\"),\n    elapsed: style.getPropertyValue(\"--motion--elapsed\"),\n    mass: style.getPropertyValue(\"--motion--mass\"),\n    max: style.getPropertyValue(\"--motion--max\"),\n    min: style.getPropertyValue(\"--motion--min\"),\n    power: style.getPropertyValue(\"--motion--power\"),\n    repeat: style.getPropertyValue(\"--motion--repeat\"),\n    repeatDelay: style.getPropertyValue(\"--motion--repeat-delay\"),\n    repeatType: style.getPropertyValue(\"--motion--repeat-type\"),\n    restDelta: style.getPropertyValue(\"--motion--rest-delta\"),\n    restSpeed: style.getPropertyValue(\"--motion--rest-speed\"),\n    startTime: style.getPropertyValue(\"--motion--start-time\"),\n    timeConstant: style.getPropertyValue(\"--motion--time-constant\"),\n    times: style.getPropertyValue(\"--motion--times\"),\n    type: style.getPropertyValue(\"--motion--type\"),\n    velocity: style.getPropertyValue(\"--motion--velocity\"),\n    visualDuration: style.getPropertyValue(\"--motion--visual-duration\"),\n  };\n  return {\n    autoplay: properties.autoplay ? properties.autoplay === \"true\" : undefined,\n    bounce: properties.bounce ? parseFloat(properties.bounce) : undefined,\n    bounceDamping: properties.bounceDamping\n      ? parseFloat(properties.bounceDamping)\n      : undefined,\n    bounceStiffness: properties.bounceStiffness\n      ? parseFloat(properties.bounceStiffness)\n      : undefined,\n    duration: properties.duration ? parseFloat(properties.duration) : undefined,\n    damping: properties.damping ? parseFloat(properties.damping) : undefined,\n    delay: properties.delay ? parseFloat(properties.delay) : undefined,\n    ease: (properties.ease as Easing) || undefined,\n    elapsed: properties.elapsed ? parseFloat(properties.elapsed) : undefined,\n    mass: properties.mass ? parseFloat(properties.mass) : undefined,\n    max: properties.max ? parseFloat(properties.max) : undefined,\n    min: properties.min ? parseFloat(properties.min) : undefined,\n    power: properties.power ? parseFloat(properties.power) : undefined,\n    repeat: properties.repeat ? parseInt(properties.repeat) : undefined,\n    repeatDelay: properties.repeatDelay\n      ? parseFloat(properties.repeatDelay)\n      : undefined,\n    repeatType: (properties.repeatType as RepeatType) || undefined,\n    restDelta: properties.restDelta\n      ? parseFloat(properties.restDelta)\n      : undefined,\n    restSpeed: properties.restSpeed\n      ? parseFloat(properties.restSpeed)\n      : undefined,\n    startTime: properties.startTime\n      ? parseFloat(properties.startTime)\n      : undefined,\n    timeConstant: properties.timeConstant\n      ? parseFloat(properties.timeConstant)\n      : undefined,\n    type: (properties.type as AnimationGeneratorType) || undefined,\n    velocity: properties.velocity ? parseFloat(properties.velocity) : undefined,\n    visualDuration: properties.visualDuration\n      ? parseFloat(properties.visualDuration)\n      : undefined,\n  } satisfies Transition;\n}\n","export type Position = (typeof POSITION)[keyof typeof POSITION];\nexport type Action = (typeof ACTION)[keyof typeof ACTION];\n\nexport const POSITION = {\n  TOP: \"top\",\n  BOTTOM: \"bottom\",\n  LEFT: \"left\",\n  RIGHT: \"right\",\n} as const;\n\nexport const ACTION = {\n  OPEN: \"open\",\n  CLOSE: \"close\",\n  TOGGLE: \"toggle\",\n};\n\nexport const EVENT_NAMESPACE = `bryt:drawer` as const;\n","import {\n  invokeOnLoaded,\n  type CorrectComponentType,\n} from \"@brytdesigns/web-component-utils\";\nimport type { Action } from \"../consts\";\n\nimport { createEffect, createRoot, on as _on, onCleanup } from \"solid-js\";\nimport { observeElementInViewport } from \"observe-element-in-viewport\";\n\nimport { getDrawerContext } from \"../hooks/index.js\";\n\ntype DrawerTriggerProps = {\n  target?: string;\n  action?: Action | \"\";\n  on?: keyof HTMLElementEventMap | \"enter\" | \"exit\";\n  preventDefault: boolean;\n};\n\nexport const Name = \"drawer-trigger\";\n\nexport const Component: CorrectComponentType<DrawerTriggerProps> = (\n  props,\n  { element },\n) => {\n  createEffect(() => {\n    const targetProp = props.target,\n      action = props.action,\n      on = props.on,\n      preventDefault = props.preventDefault;\n\n    if (!targetProp)\n      return console.warn(`${Name}: target prop is required!`, element);\n    if (!action)\n      return console.warn(`${Name}: action prop is required!`, element);\n    if (action !== \"close\" && action !== \"open\" && action !== \"toggle\")\n      return console.warn(\n        `${Name}: action prop must be 'close', 'open', or 'toggle'`,\n      );\n    if (!on) return console.warn(`${Name}: on prop is required!`);\n\n    const target = document.querySelector(targetProp);\n    if (!target)\n      return console.warn(`${Name}: target element not found!`, {\n        element,\n        target: targetProp,\n      });\n\n    const controller = new AbortController();\n\n    invokeOnLoaded(\n      () => {\n        createRoot((dispose) => {\n          const [state, { open, close, toggle }] = getDrawerContext(target);\n\n          switch (on) {\n            case \"enter\": {\n              let unsubscribe = null;\n              if (action === \"toggle\") {\n                unsubscribe = observeElementInViewport(element, open, close);\n              }\n\n              if (unsubscribe) onCleanup(unsubscribe);\n              break;\n            }\n            case \"exit\": {\n              let unsubscribe = null;\n              if (action === \"toggle\") {\n                unsubscribe = observeElementInViewport(element, close, open);\n              }\n\n              if (unsubscribe) onCleanup(unsubscribe);\n              break;\n            }\n\n            default: {\n              element.addEventListener(\n                on,\n                (event) => {\n                  if (preventDefault) event.preventDefault();\n                  if (state.isAnimating) return;\n                  switch (action) {\n                    case \"close\":\n                      close();\n                      break;\n                    case \"open\":\n                      open();\n                      break;\n                    case \"toggle\":\n                      toggle();\n                      break;\n                  }\n                },\n                { signal: controller.signal },\n              );\n              break;\n            }\n          }\n\n          createEffect(() => {\n            element.setAttribute(\"is-open\", `${state.isOpen}`);\n            element.setAttribute(\"is-animating\", `${state.isAnimating}`);\n          });\n\n          controller.signal.addEventListener(\"abort\", dispose);\n        });\n      },\n      { signal: controller.signal },\n    );\n\n    return onCleanup(() => {\n      controller.abort();\n    });\n  });\n};\n","import type { CorrectComponentType } from \"@brytdesigns/web-component-utils\";\n\nimport { createEffect, onMount, on, onCleanup } from \"solid-js\";\nimport { animate } from \"motion\";\n\nimport { useDrawer } from \"../hooks/index.js\";\nimport { getTransitionConfig } from \"../utils.js\";\n\ntype DrawerBackdropProps = {};\n\nexport const Name = `drawer-backdrop`;\n\nexport const Component: CorrectComponentType<DrawerBackdropProps> = (\n  _,\n  { element },\n) => {\n  const [state, { updateAnimationQueue, close }] = useDrawer(element);\n  const controller = new AbortController();\n\n  let isFirstRender = true;\n\n  createEffect(\n    on(\n      () => state.isOpen,\n      (isOpen) => {\n        if (!isOpen || isFirstRender) return;\n        const animation = enter(element);\n        updateAnimationQueue(animation);\n        return onCleanup(() => {\n          if (animation.state !== \"finished\") animation.complete();\n        });\n      },\n    ),\n  );\n\n  createEffect(\n    on(\n      () => state.isOpen,\n      (isOpen) => {\n        if (isOpen || isFirstRender) return;\n        const animation = exit(element);\n        updateAnimationQueue(animation);\n        return onCleanup(() => {\n          if (animation.state !== \"finished\") animation.complete();\n        });\n      },\n    ),\n  );\n\n  onMount(() => {\n    isFirstRender = false;\n  });\n\n  function enter(element: HTMLElement) {\n    const style = window.getComputedStyle(element);\n    const options = getTransitionConfig(style);\n    return animate(\n      element,\n      {\n        opacity: [`var(--drawer--opacity-from)`, `var(--drawer--opacity-to)`],\n      },\n      options,\n    );\n  }\n\n  function exit(element: HTMLElement) {\n    const style = window.getComputedStyle(element);\n    const options = getTransitionConfig(style);\n    return animate(\n      element,\n      {\n        opacity: [`var(--drawer--opacity-to)`, `var(--drawer--opacity-from)`],\n      },\n      options,\n    );\n  }\n\n  element.addEventListener(\n    \"click\",\n    () => {\n      if (state.isAnimating) return;\n      close();\n    },\n    {\n      signal: controller.signal,\n    },\n  );\n\n  onCleanup(() => {\n    controller.abort();\n  });\n\n  isFirstRender = false;\n};\n","import type { CorrectComponentType } from \"@brytdesigns/web-component-utils\";\n\nimport { createEffect, on, onCleanup, splitProps } from \"solid-js\";\nimport { enableBodyScroll, disableBodyScroll } from \"body-scroll-lock-upgrade\";\nimport { createFocusTrap } from \"@brytdesigns/web-component-core/focusTrap\";\n\nimport { provideDrawerContext, useDrawerContext } from \"../hooks/index.js\";\nimport { hideElement, showElement } from \"../utils.js\";\n\ntype DrawerContextProps = {\n  isOpen: boolean;\n  id: string;\n  closeOnEscape: boolean;\n  shouldTrapFocus: boolean;\n  isAnimating: boolean;\n  debug?: boolean;\n};\n\nexport const Name = `drawer-context`;\n\nexport const Component: CorrectComponentType<DrawerContextProps> = (\n  props,\n  { element },\n) => {\n  const [contextProps, restProps] = splitProps(props, [\n    \"isOpen\",\n    \"isAnimating\",\n  ]);\n\n  const context = provideDrawerContext(contextProps, element);\n\n  const [state, { setElementState }] = context;\n\n  const [_, { updateAnimationQueue, ...events }] = useDrawerContext(context);\n\n  element.actions = events;\n\n  const focusTrap = createFocusTrap(element, () => ({\n    allowOutsideClick: true,\n    escapeDeactivates: restProps.closeOnEscape,\n    onDeactivate: () => {\n      setElementState(\"isOpen\", false);\n    },\n  }));\n\n  createEffect(() => {\n    if (!props.debug) return;\n    console.table({\n      ...state,\n    });\n  });\n\n  createEffect(\n    on(\n      () => state.isOpen,\n      (isOpen) => {\n        const eventName = isOpen ? \"drawer:open\" : \"drawer:close\";\n        element.dispatchEvent(\n          new CustomEvent(eventName, {\n            bubbles: true,\n            detail: { isOpen, relatedTarget: element },\n          }),\n        );\n        element.dispatchEvent(\n          new CustomEvent(\"drawer:toggle\", {\n            bubbles: true,\n            detail: { isOpen, relatedTarget: element },\n          }),\n        );\n      },\n    ),\n  );\n\n  createEffect(\n    on(\n      () => ({\n        isOpen: state.isOpen,\n        focusTrap: focusTrap(),\n        shouldTrapFocus: restProps.shouldTrapFocus,\n      }),\n      ({ isOpen, focusTrap, shouldTrapFocus }) => {\n        if (!isOpen) return;\n        if (props.debug) console.log(\"Showing element\", element);\n        showElement(element);\n        if (!shouldTrapFocus) return;\n        focusTrap.activate();\n        onCleanup(focusTrap.deactivate);\n      },\n    ),\n  );\n\n  createEffect(\n    on(\n      () => ({\n        isOpen: state.isOpen,\n        isAnimating: state.isAnimating,\n      }),\n      ({ isOpen, isAnimating }) => {\n        if (isOpen && !isAnimating)\n          return disableBodyScroll(element, {\n            allowTouchMove: (el: EventTarget) => {\n              if (el instanceof HTMLElement) {\n                let element = el as (EventTarget & HTMLElement) | null;\n                while (element && element !== document.body) {\n                  if (element.tagName === \"DRAWER-CONTENT\") {\n                    return true;\n                  }\n\n                  element = element.parentElement;\n                }\n              }\n              return false;\n            },\n          });\n        onCleanup(() => {\n          enableBodyScroll(element);\n        });\n      },\n    ),\n  );\n\n  createEffect(\n    on(\n      () => ({ isOpen: state.isOpen, animationQueue: state.animationQueue }),\n      ({ isOpen, animationQueue }) => {\n        if (isOpen) return;\n        if (props.debug)\n          console.log(\"Waiting for animations to complete...\", animationQueue);\n        return Promise.all(animationQueue)\n          .then(() => hideElement(element))\n          .then(() => {\n            if (props.debug) console.log(\"Hiding element\", element);\n          });\n      },\n    ),\n  );\n\n  onCleanup(() => {\n    disableBodyScroll(element);\n  });\n};\n","import {\n  customShadowlessElement,\n  correctElementType,\n} from \"@brytdesigns/web-component-utils\";\n\nimport {\n  DrawerContent,\n  DrawerContext,\n  DrawerTrigger,\n  DrawerBackdrop,\n} from \"./components/index.js\";\n\ncustomShadowlessElement(\n  DrawerContext.Name,\n  {\n    isOpen: false,\n    id: \"\",\n    closeOnEscape: false,\n    shouldTrapFocus: false,\n    isAnimating: false,\n    debug: false,\n  },\n  correctElementType(DrawerContext.Component),\n);\n\ncustomShadowlessElement(\n  DrawerTrigger.Name,\n  { target: \"\", action: \"\", on: \"click\", preventDefault: true },\n  correctElementType(DrawerTrigger.Component),\n);\n\ncustomShadowlessElement(\n  DrawerBackdrop.Name,\n  {},\n  correctElementType(DrawerBackdrop.Component),\n);\n\ncustomShadowlessElement(\n  DrawerContent.Name,\n  {},\n  correctElementType(DrawerContent.Component),\n);\n\nexport { useDrawer, getDrawerContext } from \"./hooks/index.js\";\n"]}

package/dist/main/components/drawer-backdrop.js

@@ -1,7 +1,7 @@
 import { createEffect, on, onMount, onCleanup } from 'solid-js';
 import { animate } from 'motion';
 import { useDrawer } from '../hooks/index.js';
-import { controlPromise, getTransitionConfig } from '../utils.js';
+import { getTransitionConfig } from '../utils.js';
 
 const Name = `drawer-backdrop`;
 const Component = (_, { element }) => {
@@ -14,7 +14,7 @@ const Component = (_, { element }) => {
       (isOpen) => {
         if (!isOpen || isFirstRender) return;
         const animation = enter(element);
-        updateAnimationQueue(controlPromise(animation));
+        updateAnimationQueue(animation);
         return onCleanup(() => {
           if (animation.state !== "finished") animation.complete();
         });
@@ -27,7 +27,7 @@ const Component = (_, { element }) => {
       (isOpen) => {
         if (isOpen || isFirstRender) return;
         const animation = exit(element);
-        updateAnimationQueue(controlPromise(animation));
+        updateAnimationQueue(animation);
         return onCleanup(() => {
           if (animation.state !== "finished") animation.complete();
         });

package/dist/main/components/drawer-backdrop.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/drawer-backdrop.ts"],"names":["element"],"mappings":";;;;;AAUO,MAAM,IAAO,GAAA,CAAA,eAAA;AAEb,MAAM,SAAuD,GAAA,CAClE,CACA,EAAA,EAAE,SACC,KAAA;AACH,EAAM,MAAA,CAAC,OAAO,EAAE,oBAAA,EAAsB,OAAO,CAAA,GAAI,UAAU,OAAO,CAAA;AAClE,EAAM,MAAA,UAAA,GAAa,IAAI,eAAgB,EAAA;AAEvC,EAAA,IAAI,aAAgB,GAAA,IAAA;AAEpB,EAAA,YAAA;AAAA,IACE,EAAA;AAAA,MACE,MAAM,KAAM,CAAA,MAAA;AAAA,MACZ,CAAC,MAAW,KAAA;AACV,QAAI,IAAA,CAAC,UAAU,aAAe,EAAA;AAC9B,QAAM,MAAA,SAAA,GAAY,MAAM,OAAO,CAAA;AAC/B,QAAqB,oBAAA,CAAA,cAAA,CAAe,SAAS,CAAC,CAAA;AAC9C,QAAA,OAAO,UAAU,MAAM;AACrB,UAAA,IAAI,SAAU,CAAA,KAAA,KAAU,UAAY,EAAA,SAAA,CAAU,QAAS,EAAA;AAAA,SACxD,CAAA;AAAA;AACH;AACF,GACF;AAEA,EAAA,YAAA;AAAA,IACE,EAAA;AAAA,MACE,MAAM,KAAM,CAAA,MAAA;AAAA,MACZ,CAAC,MAAW,KAAA;AACV,QAAA,IAAI,UAAU,aAAe,EAAA;AAC7B,QAAM,MAAA,SAAA,GAAY,KAAK,OAAO,CAAA;AAC9B,QAAqB,oBAAA,CAAA,cAAA,CAAe,SAAS,CAAC,CAAA;AAC9C,QAAA,OAAO,UAAU,MAAM;AACrB,UAAA,IAAI,SAAU,CAAA,KAAA,KAAU,UAAY,EAAA,SAAA,CAAU,QAAS,EAAA;AAAA,SACxD,CAAA;AAAA;AACH;AACF,GACF;AAEA,EAAA,OAAA,CAAQ,MAAM;AACZ,IAAgB,aAAA,GAAA,KAAA;AAAA,GACjB,CAAA;AAED,EAAA,SAAS,MAAMA,QAAsB,EAAA;AACnC,IAAM,MAAA,KAAA,GAAQ,MAAO,CAAA,gBAAA,CAAiBA,QAAO,CAAA;AAC7C,IAAM,MAAA,OAAA,GAAU,oBAAoB,KAAK,CAAA;AACzC,IAAO,OAAA,OAAA;AAAA,MACLA,QAAAA;AAAA,MACA;AAAA,QACE,OAAA,EAAS,CAAC,CAAA,2BAAA,CAAA,EAA+B,CAA2B,yBAAA,CAAA;AAAA,OACtE;AAAA,MACA;AAAA,KACF;AAAA;AAGF,EAAA,SAAS,KAAKA,QAAsB,EAAA;AAClC,IAAM,MAAA,KAAA,GAAQ,MAAO,CAAA,gBAAA,CAAiBA,QAAO,CAAA;AAC7C,IAAM,MAAA,OAAA,GAAU,oBAAoB,KAAK,CAAA;AACzC,IAAO,OAAA,OAAA;AAAA,MACLA,QAAAA;AAAA,MACA;AAAA,QACE,OAAA,EAAS,CAAC,CAAA,yBAAA,CAAA,EAA6B,CAA6B,2BAAA,CAAA;AAAA,OACtE;AAAA,MACA;AAAA,KACF;AAAA;AAGF,EAAQ,OAAA,CAAA,gBAAA;AAAA,IACN,OAAA;AAAA,IACA,MAAM;AACJ,MAAA,IAAI,MAAM,WAAa,EAAA;AACvB,MAAM,KAAA,EAAA;AAAA,KACR;AAAA,IACA;AAAA,MACE,QAAQ,UAAW,CAAA;AAAA;AACrB,GACF;AAEA,EAAA,SAAA,CAAU,MAAM;AACd,IAAA,UAAA,CAAW,KAAM,EAAA;AAAA,GAClB,CAAA;AAED,EAAgB,aAAA,GAAA,KAAA;AAClB","file":"drawer-backdrop.js","sourcesContent":["import type { CorrectComponentType } from \"@brytdesigns/web-component-utils\";\n\nimport { createEffect, onMount, on, onCleanup } from \"solid-js\";\nimport { animate } from \"motion\";\n\nimport { useDrawer } from \"../hooks/index.js\";\nimport { controlPromise, getTransitionConfig } from \"../utils.js\";\n\ntype DrawerBackdropProps = {};\n\nexport const Name = `drawer-backdrop`;\n\nexport const Component: CorrectComponentType<DrawerBackdropProps> = (\n  _,\n  { element },\n) => {\n  const [state, { updateAnimationQueue, close }] = useDrawer(element);\n  const controller = new AbortController();\n\n  let isFirstRender = true;\n\n  createEffect(\n    on(\n      () => state.isOpen,\n      (isOpen) => {\n        if (!isOpen || isFirstRender) return;\n        const animation = enter(element);\n        updateAnimationQueue(controlPromise(animation));\n        return onCleanup(() => {\n          if (animation.state !== \"finished\") animation.complete();\n        });\n      },\n    ),\n  );\n\n  createEffect(\n    on(\n      () => state.isOpen,\n      (isOpen) => {\n        if (isOpen || isFirstRender) return;\n        const animation = exit(element);\n        updateAnimationQueue(controlPromise(animation));\n        return onCleanup(() => {\n          if (animation.state !== \"finished\") animation.complete();\n        });\n      },\n    ),\n  );\n\n  onMount(() => {\n    isFirstRender = false;\n  });\n\n  function enter(element: HTMLElement) {\n    const style = window.getComputedStyle(element);\n    const options = getTransitionConfig(style);\n    return animate(\n      element,\n      {\n        opacity: [`var(--drawer--opacity-from)`, `var(--drawer--opacity-to)`],\n      },\n      options,\n    );\n  }\n\n  function exit(element: HTMLElement) {\n    const style = window.getComputedStyle(element);\n    const options = getTransitionConfig(style);\n    return animate(\n      element,\n      {\n        opacity: [`var(--drawer--opacity-to)`, `var(--drawer--opacity-from)`],\n      },\n      options,\n    );\n  }\n\n  element.addEventListener(\n    \"click\",\n    () => {\n      if (state.isAnimating) return;\n      close();\n    },\n    {\n      signal: controller.signal,\n    },\n  );\n\n  onCleanup(() => {\n    controller.abort();\n  });\n\n  isFirstRender = false;\n};\n"]}
+{"version":3,"sources":["../../../src/components/drawer-backdrop.ts"],"names":["element"],"mappings":";;;;;AAUO,MAAM,IAAO,GAAA,CAAA,eAAA;AAEb,MAAM,SAAuD,GAAA,CAClE,CACA,EAAA,EAAE,SACC,KAAA;AACH,EAAM,MAAA,CAAC,OAAO,EAAE,oBAAA,EAAsB,OAAO,CAAA,GAAI,UAAU,OAAO,CAAA;AAClE,EAAM,MAAA,UAAA,GAAa,IAAI,eAAgB,EAAA;AAEvC,EAAA,IAAI,aAAgB,GAAA,IAAA;AAEpB,EAAA,YAAA;AAAA,IACE,EAAA;AAAA,MACE,MAAM,KAAM,CAAA,MAAA;AAAA,MACZ,CAAC,MAAW,KAAA;AACV,QAAI,IAAA,CAAC,UAAU,aAAe,EAAA;AAC9B,QAAM,MAAA,SAAA,GAAY,MAAM,OAAO,CAAA;AAC/B,QAAA,oBAAA,CAAqB,SAAS,CAAA;AAC9B,QAAA,OAAO,UAAU,MAAM;AACrB,UAAA,IAAI,SAAU,CAAA,KAAA,KAAU,UAAY,EAAA,SAAA,CAAU,QAAS,EAAA;AAAA,SACxD,CAAA;AAAA;AACH;AACF,GACF;AAEA,EAAA,YAAA;AAAA,IACE,EAAA;AAAA,MACE,MAAM,KAAM,CAAA,MAAA;AAAA,MACZ,CAAC,MAAW,KAAA;AACV,QAAA,IAAI,UAAU,aAAe,EAAA;AAC7B,QAAM,MAAA,SAAA,GAAY,KAAK,OAAO,CAAA;AAC9B,QAAA,oBAAA,CAAqB,SAAS,CAAA;AAC9B,QAAA,OAAO,UAAU,MAAM;AACrB,UAAA,IAAI,SAAU,CAAA,KAAA,KAAU,UAAY,EAAA,SAAA,CAAU,QAAS,EAAA;AAAA,SACxD,CAAA;AAAA;AACH;AACF,GACF;AAEA,EAAA,OAAA,CAAQ,MAAM;AACZ,IAAgB,aAAA,GAAA,KAAA;AAAA,GACjB,CAAA;AAED,EAAA,SAAS,MAAMA,QAAsB,EAAA;AACnC,IAAM,MAAA,KAAA,GAAQ,MAAO,CAAA,gBAAA,CAAiBA,QAAO,CAAA;AAC7C,IAAM,MAAA,OAAA,GAAU,oBAAoB,KAAK,CAAA;AACzC,IAAO,OAAA,OAAA;AAAA,MACLA,QAAAA;AAAA,MACA;AAAA,QACE,OAAA,EAAS,CAAC,CAAA,2BAAA,CAAA,EAA+B,CAA2B,yBAAA,CAAA;AAAA,OACtE;AAAA,MACA;AAAA,KACF;AAAA;AAGF,EAAA,SAAS,KAAKA,QAAsB,EAAA;AAClC,IAAM,MAAA,KAAA,GAAQ,MAAO,CAAA,gBAAA,CAAiBA,QAAO,CAAA;AAC7C,IAAM,MAAA,OAAA,GAAU,oBAAoB,KAAK,CAAA;AACzC,IAAO,OAAA,OAAA;AAAA,MACLA,QAAAA;AAAA,MACA;AAAA,QACE,OAAA,EAAS,CAAC,CAAA,yBAAA,CAAA,EAA6B,CAA6B,2BAAA,CAAA;AAAA,OACtE;AAAA,MACA;AAAA,KACF;AAAA;AAGF,EAAQ,OAAA,CAAA,gBAAA;AAAA,IACN,OAAA;AAAA,IACA,MAAM;AACJ,MAAA,IAAI,MAAM,WAAa,EAAA;AACvB,MAAM,KAAA,EAAA;AAAA,KACR;AAAA,IACA;AAAA,MACE,QAAQ,UAAW,CAAA;AAAA;AACrB,GACF;AAEA,EAAA,SAAA,CAAU,MAAM;AACd,IAAA,UAAA,CAAW,KAAM,EAAA;AAAA,GAClB,CAAA;AAED,EAAgB,aAAA,GAAA,KAAA;AAClB","file":"drawer-backdrop.js","sourcesContent":["import type { CorrectComponentType } from \"@brytdesigns/web-component-utils\";\n\nimport { createEffect, onMount, on, onCleanup } from \"solid-js\";\nimport { animate } from \"motion\";\n\nimport { useDrawer } from \"../hooks/index.js\";\nimport { getTransitionConfig } from \"../utils.js\";\n\ntype DrawerBackdropProps = {};\n\nexport const Name = `drawer-backdrop`;\n\nexport const Component: CorrectComponentType<DrawerBackdropProps> = (\n  _,\n  { element },\n) => {\n  const [state, { updateAnimationQueue, close }] = useDrawer(element);\n  const controller = new AbortController();\n\n  let isFirstRender = true;\n\n  createEffect(\n    on(\n      () => state.isOpen,\n      (isOpen) => {\n        if (!isOpen || isFirstRender) return;\n        const animation = enter(element);\n        updateAnimationQueue(animation);\n        return onCleanup(() => {\n          if (animation.state !== \"finished\") animation.complete();\n        });\n      },\n    ),\n  );\n\n  createEffect(\n    on(\n      () => state.isOpen,\n      (isOpen) => {\n        if (isOpen || isFirstRender) return;\n        const animation = exit(element);\n        updateAnimationQueue(animation);\n        return onCleanup(() => {\n          if (animation.state !== \"finished\") animation.complete();\n        });\n      },\n    ),\n  );\n\n  onMount(() => {\n    isFirstRender = false;\n  });\n\n  function enter(element: HTMLElement) {\n    const style = window.getComputedStyle(element);\n    const options = getTransitionConfig(style);\n    return animate(\n      element,\n      {\n        opacity: [`var(--drawer--opacity-from)`, `var(--drawer--opacity-to)`],\n      },\n      options,\n    );\n  }\n\n  function exit(element: HTMLElement) {\n    const style = window.getComputedStyle(element);\n    const options = getTransitionConfig(style);\n    return animate(\n      element,\n      {\n        opacity: [`var(--drawer--opacity-to)`, `var(--drawer--opacity-from)`],\n      },\n      options,\n    );\n  }\n\n  element.addEventListener(\n    \"click\",\n    () => {\n      if (state.isAnimating) return;\n      close();\n    },\n    {\n      signal: controller.signal,\n    },\n  );\n\n  onCleanup(() => {\n    controller.abort();\n  });\n\n  isFirstRender = false;\n};\n"]}

package/dist/main/components/drawer-content.js

@@ -1,7 +1,7 @@
 import { createEffect, on, onMount, onCleanup } from 'solid-js';
 import { animate } from 'motion';
 import { useDrawer } from '../hooks/index.js';
-import { controlPromise, getTransitionConfig } from '../utils.js';
+import { getTransitionConfig } from '../utils.js';
 import { POSITION } from '../consts.js';
 
 const Name = `drawer-content`;
@@ -14,7 +14,7 @@ const Component = (_, { element }) => {
       (isOpen) => {
         if (!isOpen || isFirstRender) return;
         const animation = enter(element);
-        updateAnimationQueue(controlPromise(animation));
+        updateAnimationQueue(animation);
         return onCleanup(() => {
           if (animation.state !== "finished") animation.complete();
         });
@@ -27,7 +27,7 @@ const Component = (_, { element }) => {
       (isOpen) => {
         if (isOpen || isFirstRender) return;
         const animation = exit(element);
-        updateAnimationQueue(controlPromise(animation));
+        updateAnimationQueue(animation);
         return onCleanup(() => {
           if (animation.state !== "finished") animation.complete();
         });

package/dist/main/components/drawer-content.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/drawer-content.ts"],"names":["element"],"mappings":"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","file":"drawer-content.js","sourcesContent":["import type { CorrectComponentType } from \"@brytdesigns/web-component-utils\";\n\nimport { createEffect, on, onCleanup, onMount } from \"solid-js\";\nimport { animate } from \"motion\";\n\nimport { useDrawer } from \"../hooks/index.js\";\nimport { controlPromise, getTransitionConfig } from \"../utils.js\";\nimport { POSITION, type Position } from \"../consts.js\";\n\ntype DrawerContentProps = {};\n\nexport const Name = `drawer-content`;\n\nexport const Component: CorrectComponentType<DrawerContentProps> = (\n  _,\n  { element },\n) => {\n  const [state, { updateAnimationQueue }] = useDrawer(element);\n\n  let isFirstRender = true;\n\n  createEffect(\n    on(\n      () => state.isOpen,\n      (isOpen) => {\n        if (!isOpen || isFirstRender) return;\n        const animation = enter(element);\n        updateAnimationQueue(controlPromise(animation));\n        return onCleanup(() => {\n          if (animation.state !== \"finished\") animation.complete();\n        });\n      },\n    ),\n  );\n\n  createEffect(\n    on(\n      () => state.isOpen,\n      (isOpen) => {\n        if (isOpen || isFirstRender) return;\n        const animation = exit(element);\n        updateAnimationQueue(controlPromise(animation));\n        return onCleanup(() => {\n          if (animation.state !== \"finished\") animation.complete();\n        });\n      },\n    ),\n  );\n\n  onMount(() => {\n    isFirstRender = false;\n  });\n\n  function enter(element: HTMLElement) {\n    const style = window.getComputedStyle(element);\n    const transition = getTransitionConfig(style);\n    let position = style.getPropertyValue(\"--drawer--position\") as Position;\n    if (!position) position = POSITION.LEFT;\n\n    let transform: Record<string, string[]> = {\n      x: [\"var(--drawer--slide-from)\", \"var(--drawer--slide-to)\"],\n    };\n\n    if (position === POSITION.TOP || position === POSITION.BOTTOM) {\n      transform = {\n        y: [\"var(--drawer--slide-from)\", \"var(--drawer--slide-to)\"],\n      };\n    }\n\n    return animate(\n      element,\n      {\n        ...transform,\n      },\n      transition,\n    );\n  }\n\n  function exit(element: HTMLElement) {\n    const style = window.getComputedStyle(element);\n    const transition = getTransitionConfig(style);\n    let position = style.getPropertyValue(\"--drawer--position\") as Position;\n    if (!position) position = POSITION.LEFT;\n\n    let transform: Record<string, string[]> = {\n      x: [\"var(--drawer--slide-to)\", \"var(--drawer--slide-from)\"],\n    };\n\n    if (position === POSITION.TOP || position === POSITION.BOTTOM) {\n      transform = {\n        y: [\"var(--drawer--slide-to)\", \"var(--drawer--slide-from)\"],\n      };\n    }\n\n    return animate(\n      element,\n      {\n        ...transform,\n      },\n      transition,\n    );\n  }\n};\n"]}
+{"version":3,"sources":["../../../src/components/drawer-content.ts"],"names":["element"],"mappings":"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","file":"drawer-content.js","sourcesContent":["import type { CorrectComponentType } from \"@brytdesigns/web-component-utils\";\n\nimport { createEffect, on, onCleanup, onMount } from \"solid-js\";\nimport { animate } from \"motion\";\n\nimport { useDrawer } from \"../hooks/index.js\";\nimport { getTransitionConfig } from \"../utils.js\";\nimport { POSITION, type Position } from \"../consts.js\";\n\ntype DrawerContentProps = {};\n\nexport const Name = `drawer-content`;\n\nexport const Component: CorrectComponentType<DrawerContentProps> = (\n  _,\n  { element },\n) => {\n  const [state, { updateAnimationQueue }] = useDrawer(element);\n\n  let isFirstRender = true;\n\n  createEffect(\n    on(\n      () => state.isOpen,\n      (isOpen) => {\n        if (!isOpen || isFirstRender) return;\n        const animation = enter(element);\n        updateAnimationQueue(animation);\n        return onCleanup(() => {\n          if (animation.state !== \"finished\") animation.complete();\n        });\n      },\n    ),\n  );\n\n  createEffect(\n    on(\n      () => state.isOpen,\n      (isOpen) => {\n        if (isOpen || isFirstRender) return;\n        const animation = exit(element);\n        updateAnimationQueue(animation);\n        return onCleanup(() => {\n          if (animation.state !== \"finished\") animation.complete();\n        });\n      },\n    ),\n  );\n\n  onMount(() => {\n    isFirstRender = false;\n  });\n\n  function enter(element: HTMLElement) {\n    const style = window.getComputedStyle(element);\n    const transition = getTransitionConfig(style);\n    let position = style.getPropertyValue(\"--drawer--position\") as Position;\n    if (!position) position = POSITION.LEFT;\n\n    let transform: Record<string, string[]> = {\n      x: [\"var(--drawer--slide-from)\", \"var(--drawer--slide-to)\"],\n    };\n\n    if (position === POSITION.TOP || position === POSITION.BOTTOM) {\n      transform = {\n        y: [\"var(--drawer--slide-from)\", \"var(--drawer--slide-to)\"],\n      };\n    }\n\n    return animate(\n      element,\n      {\n        ...transform,\n      },\n      transition,\n    );\n  }\n\n  function exit(element: HTMLElement) {\n    const style = window.getComputedStyle(element);\n    const transition = getTransitionConfig(style);\n    let position = style.getPropertyValue(\"--drawer--position\") as Position;\n    if (!position) position = POSITION.LEFT;\n\n    let transform: Record<string, string[]> = {\n      x: [\"var(--drawer--slide-to)\", \"var(--drawer--slide-from)\"],\n    };\n\n    if (position === POSITION.TOP || position === POSITION.BOTTOM) {\n      transform = {\n        y: [\"var(--drawer--slide-to)\", \"var(--drawer--slide-from)\"],\n      };\n    }\n\n    return animate(\n      element,\n      {\n        ...transform,\n      },\n      transition,\n    );\n  }\n};\n"]}

package/dist/main/components/drawer-context.js

@@ -1,6 +1,6 @@
-import { splitProps, createMemo, createEffect, on, onCleanup } from 'solid-js';
-import { disableBodyScroll, enableBodyScroll, clearAllBodyScrollLocks } from 'body-scroll-lock-upgrade';
-import { createFocusTrap } from 'focus-trap';
+import { splitProps, createEffect, on, onCleanup } from 'solid-js';
+import { disableBodyScroll, enableBodyScroll } from 'body-scroll-lock-upgrade';
+import { createFocusTrap } from '@brytdesigns/web-component-core/focusTrap';
 import { provideDrawerContext, useDrawerContext } from '../hooks/index.js';
 import { showElement, hideElement } from '../utils.js';
 
@@ -14,15 +14,13 @@ const Component = (props, { element }) => {
   const [state, { setElementState }] = context;
   const [_, { updateAnimationQueue, ...events }] = useDrawerContext(context);
   element.actions = events;
-  const focusTrap = createMemo(() => {
-    return createFocusTrap(element, {
-      allowOutsideClick: true,
-      escapeDeactivates: restProps.closeOnEscape,
-      onDeactivate: () => {
-        setElementState("isOpen", false);
-      }
-    });
-  });
+  const focusTrap = createFocusTrap(element, () => ({
+    allowOutsideClick: true,
+    escapeDeactivates: restProps.closeOnEscape,
+    onDeactivate: () => {
+      setElementState("isOpen", false);
+    }
+  }));
   createEffect(() => {
     if (!props.debug) return;
     console.table({
@@ -70,11 +68,10 @@ const Component = (props, { element }) => {
     on(
       () => ({
         isOpen: state.isOpen,
-        isAnimating: state.isAnimating,
-        shouldTrapFocus: restProps.shouldTrapFocus
+        isAnimating: state.isAnimating
       }),
-      ({ isOpen, isAnimating, shouldTrapFocus }) => {
-        if (isOpen && !isAnimating && shouldTrapFocus)
+      ({ isOpen, isAnimating }) => {
+        if (isOpen && !isAnimating)
           return disableBodyScroll(element, {
             allowTouchMove: (el) => {
               if (el instanceof HTMLElement) {
@@ -90,7 +87,6 @@ const Component = (props, { element }) => {
             }
           });
         onCleanup(() => {
-          if (!shouldTrapFocus) return;
           enableBodyScroll(element);
         });
       }
@@ -110,7 +106,7 @@ const Component = (props, { element }) => {
     )
   );
   onCleanup(() => {
-    clearAllBodyScrollLocks();
+    disableBodyScroll(element);
   });
 };
 

package/dist/main/components/drawer-context.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/drawer-context.ts"],"names":["focusTrap","element"],"mappings":"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","file":"drawer-context.js","sourcesContent":["import type { CorrectComponentType } from \"@brytdesigns/web-component-utils\";\n\nimport { createMemo, createEffect, on, onCleanup, splitProps } from \"solid-js\";\nimport {\n  enableBodyScroll,\n  disableBodyScroll,\n  clearAllBodyScrollLocks,\n} from \"body-scroll-lock-upgrade\";\nimport { createFocusTrap } from \"focus-trap\";\n\nimport { provideDrawerContext, useDrawerContext } from \"../hooks/index.js\";\nimport { hideElement, showElement } from \"../utils.js\";\n\ntype DrawerContextProps = {\n  isOpen: boolean;\n  id: string;\n  closeOnEscape: boolean;\n  shouldTrapFocus: boolean;\n  isAnimating: boolean;\n  debug?: boolean;\n};\n\nexport const Name = `drawer-context`;\n\nexport const Component: CorrectComponentType<DrawerContextProps> = (\n  props,\n  { element },\n) => {\n  const [contextProps, restProps] = splitProps(props, [\n    \"isOpen\",\n    \"isAnimating\",\n  ]);\n\n  const context = provideDrawerContext(contextProps, element);\n\n  const [state, { setElementState }] = context;\n\n  const [_, { updateAnimationQueue, ...events }] = useDrawerContext(context);\n\n  element.actions = events;\n\n  const focusTrap = createMemo(() => {\n    return createFocusTrap(element, {\n      allowOutsideClick: true,\n      escapeDeactivates: restProps.closeOnEscape,\n      onDeactivate: () => {\n        setElementState(\"isOpen\", false);\n      },\n    });\n  });\n\n  createEffect(() => {\n    if (!props.debug) return;\n    console.table({\n      ...state,\n    });\n  });\n\n  createEffect(\n    on(\n      () => state.isOpen,\n      (isOpen) => {\n        const eventName = isOpen ? \"drawer:open\" : \"drawer:close\";\n        element.dispatchEvent(\n          new CustomEvent(eventName, {\n            bubbles: true,\n            detail: { isOpen, relatedTarget: element },\n          }),\n        );\n        element.dispatchEvent(\n          new CustomEvent(\"drawer:toggle\", {\n            bubbles: true,\n            detail: { isOpen, relatedTarget: element },\n          }),\n        );\n      },\n    ),\n  );\n\n  createEffect(\n    on(\n      () => ({\n        isOpen: state.isOpen,\n        focusTrap: focusTrap(),\n        shouldTrapFocus: restProps.shouldTrapFocus,\n      }),\n      ({ isOpen, focusTrap, shouldTrapFocus }) => {\n        if (!isOpen) return;\n        if (props.debug) console.log(\"Showing element\", element);\n        showElement(element);\n        if (!shouldTrapFocus) return;\n        focusTrap.activate();\n        onCleanup(focusTrap.deactivate);\n      },\n    ),\n  );\n\n  createEffect(\n    on(\n      () => ({\n        isOpen: state.isOpen,\n        isAnimating: state.isAnimating,\n        shouldTrapFocus: restProps.shouldTrapFocus,\n      }),\n      ({ isOpen, isAnimating, shouldTrapFocus }) => {\n        if (isOpen && !isAnimating && shouldTrapFocus)\n          return disableBodyScroll(element, {\n            allowTouchMove: (el: EventTarget) => {\n              if (el instanceof HTMLElement) {\n                let element = el as (EventTarget & HTMLElement) | null;\n                while (element && element !== document.body) {\n                  if (element.tagName === \"DRAWER-CONTENT\") {\n                    return true;\n                  }\n\n                  element = element.parentElement;\n                }\n              }\n              return false;\n            },\n          });\n        onCleanup(() => {\n          if (!shouldTrapFocus) return;\n          enableBodyScroll(element);\n        });\n      },\n    ),\n  );\n\n  createEffect(\n    on(\n      () => ({ isOpen: state.isOpen, animationQueue: state.animationQueue }),\n      ({ isOpen, animationQueue }) => {\n        if (isOpen) return;\n        if (props.debug)\n          console.log(\"Waiting for animations to complete...\", animationQueue);\n        return Promise.all(animationQueue)\n          .then(() => hideElement(element))\n          .then(() => {\n            if (props.debug) console.log(\"Hiding element\", element);\n          });\n      },\n    ),\n  );\n\n  onCleanup(() => {\n    clearAllBodyScrollLocks();\n  });\n};\n"]}
+{"version":3,"sources":["../../../src/components/drawer-context.ts"],"names":["focusTrap","element"],"mappings":";;;;;;AAkBO,MAAM,IAAO,GAAA,CAAA,cAAA;AAEb,MAAM,SAAsD,GAAA,CACjE,KACA,EAAA,EAAE,SACC,KAAA;AACH,EAAA,MAAM,CAAC,YAAA,EAAc,SAAS,CAAA,GAAI,WAAW,KAAO,EAAA;AAAA,IAClD,QAAA;AAAA,IACA;AAAA,GACD,CAAA;AAED,EAAM,MAAA,OAAA,GAAU,oBAAqB,CAAA,YAAA,EAAc,OAAO,CAAA;AAE1D,EAAA,MAAM,CAAC,KAAA,EAAO,EAAE,eAAA,EAAiB,CAAI,GAAA,OAAA;AAErC,EAAM,MAAA,CAAC,GAAG,EAAE,oBAAA,EAAsB,GAAG,MAAO,EAAC,CAAI,GAAA,gBAAA,CAAiB,OAAO,CAAA;AAEzE,EAAA,OAAA,CAAQ,OAAU,GAAA,MAAA;AAElB,EAAM,MAAA,SAAA,GAAY,eAAgB,CAAA,OAAA,EAAS,OAAO;AAAA,IAChD,iBAAmB,EAAA,IAAA;AAAA,IACnB,mBAAmB,SAAU,CAAA,aAAA;AAAA,IAC7B,cAAc,MAAM;AAClB,MAAA,eAAA,CAAgB,UAAU,KAAK,CAAA;AAAA;AACjC,GACA,CAAA,CAAA;AAEF,EAAA,YAAA,CAAa,MAAM;AACjB,IAAI,IAAA,CAAC,MAAM,KAAO,EAAA;AAClB,IAAA,OAAA,CAAQ,KAAM,CAAA;AAAA,MACZ,GAAG;AAAA,KACJ,CAAA;AAAA,GACF,CAAA;AAED,EAAA,YAAA;AAAA,IACE,EAAA;AAAA,MACE,MAAM,KAAM,CAAA,MAAA;AAAA,MACZ,CAAC,MAAW,KAAA;AACV,QAAM,MAAA,SAAA,GAAY,SAAS,aAAgB,GAAA,cAAA;AAC3C,QAAQ,OAAA,CAAA,aAAA;AAAA,UACN,IAAI,YAAY,SAAW,EAAA;AAAA,YACzB,OAAS,EAAA,IAAA;AAAA,YACT,MAAQ,EAAA,EAAE,MAAQ,EAAA,aAAA,EAAe,OAAQ;AAAA,WAC1C;AAAA,SACH;AACA,QAAQ,OAAA,CAAA,aAAA;AAAA,UACN,IAAI,YAAY,eAAiB,EAAA;AAAA,YAC/B,OAAS,EAAA,IAAA;AAAA,YACT,MAAQ,EAAA,EAAE,MAAQ,EAAA,aAAA,EAAe,OAAQ;AAAA,WAC1C;AAAA,SACH;AAAA;AACF;AACF,GACF;AAEA,EAAA,YAAA;AAAA,IACE,EAAA;AAAA,MACE,OAAO;AAAA,QACL,QAAQ,KAAM,CAAA,MAAA;AAAA,QACd,WAAW,SAAU,EAAA;AAAA,QACrB,iBAAiB,SAAU,CAAA;AAAA,OAC7B,CAAA;AAAA,MACA,CAAC,EAAE,MAAA,EAAQ,SAAAA,EAAAA,UAAAA,EAAW,iBAAsB,KAAA;AAC1C,QAAA,IAAI,CAAC,MAAQ,EAAA;AACb,QAAA,IAAI,KAAM,CAAA,KAAA,EAAe,OAAA,CAAA,GAAA,CAAI,mBAAmB,OAAO,CAAA;AACvD,QAAA,WAAA,CAAY,OAAO,CAAA;AACnB,QAAA,IAAI,CAAC,eAAiB,EAAA;AACtB,QAAAA,WAAU,QAAS,EAAA;AACnB,QAAA,SAAA,CAAUA,WAAU,UAAU,CAAA;AAAA;AAChC;AACF,GACF;AAEA,EAAA,YAAA;AAAA,IACE,EAAA;AAAA,MACE,OAAO;AAAA,QACL,QAAQ,KAAM,CAAA,MAAA;AAAA,QACd,aAAa,KAAM,CAAA;AAAA,OACrB,CAAA;AAAA,MACA,CAAC,EAAE,MAAQ,EAAA,WAAA,EAAkB,KAAA;AAC3B,QAAA,IAAI,UAAU,CAAC,WAAA;AACb,UAAA,OAAO,kBAAkB,OAAS,EAAA;AAAA,YAChC,cAAA,EAAgB,CAAC,EAAoB,KAAA;AACnC,cAAA,IAAI,cAAc,WAAa,EAAA;AAC7B,gBAAA,IAAIC,QAAU,GAAA,EAAA;AACd,gBAAOA,OAAAA,QAAAA,IAAWA,QAAY,KAAA,QAAA,CAAS,IAAM,EAAA;AAC3C,kBAAIA,IAAAA,QAAAA,CAAQ,YAAY,gBAAkB,EAAA;AACxC,oBAAO,OAAA,IAAA;AAAA;AAGT,kBAAAA,WAAUA,QAAQ,CAAA,aAAA;AAAA;AACpB;AAEF,cAAO,OAAA,KAAA;AAAA;AACT,WACD,CAAA;AACH,QAAA,SAAA,CAAU,MAAM;AACd,UAAA,gBAAA,CAAiB,OAAO,CAAA;AAAA,SACzB,CAAA;AAAA;AACH;AACF,GACF;AAEA,EAAA,YAAA;AAAA,IACE,EAAA;AAAA,MACE,OAAO,EAAE,MAAA,EAAQ,MAAM,MAAQ,EAAA,cAAA,EAAgB,MAAM,cAAe,EAAA,CAAA;AAAA,MACpE,CAAC,EAAE,MAAQ,EAAA,cAAA,EAAqB,KAAA;AAC9B,QAAA,IAAI,MAAQ,EAAA;AACZ,QAAA,IAAI,KAAM,CAAA,KAAA;AACR,UAAQ,OAAA,CAAA,GAAA,CAAI,yCAAyC,cAAc,CAAA;AACrE,QAAO,OAAA,OAAA,CAAQ,GAAI,CAAA,cAAc,CAC9B,CAAA,IAAA,CAAK,MAAM,WAAA,CAAY,OAAO,CAAC,CAC/B,CAAA,IAAA,CAAK,MAAM;AACV,UAAA,IAAI,KAAM,CAAA,KAAA,EAAe,OAAA,CAAA,GAAA,CAAI,kBAAkB,OAAO,CAAA;AAAA,SACvD,CAAA;AAAA;AACL;AACF,GACF;AAEA,EAAA,SAAA,CAAU,MAAM;AACd,IAAA,iBAAA,CAAkB,OAAO,CAAA;AAAA,GAC1B,CAAA;AACH","file":"drawer-context.js","sourcesContent":["import type { CorrectComponentType } from \"@brytdesigns/web-component-utils\";\n\nimport { createEffect, on, onCleanup, splitProps } from \"solid-js\";\nimport { enableBodyScroll, disableBodyScroll } from \"body-scroll-lock-upgrade\";\nimport { createFocusTrap } from \"@brytdesigns/web-component-core/focusTrap\";\n\nimport { provideDrawerContext, useDrawerContext } from \"../hooks/index.js\";\nimport { hideElement, showElement } from \"../utils.js\";\n\ntype DrawerContextProps = {\n  isOpen: boolean;\n  id: string;\n  closeOnEscape: boolean;\n  shouldTrapFocus: boolean;\n  isAnimating: boolean;\n  debug?: boolean;\n};\n\nexport const Name = `drawer-context`;\n\nexport const Component: CorrectComponentType<DrawerContextProps> = (\n  props,\n  { element },\n) => {\n  const [contextProps, restProps] = splitProps(props, [\n    \"isOpen\",\n    \"isAnimating\",\n  ]);\n\n  const context = provideDrawerContext(contextProps, element);\n\n  const [state, { setElementState }] = context;\n\n  const [_, { updateAnimationQueue, ...events }] = useDrawerContext(context);\n\n  element.actions = events;\n\n  const focusTrap = createFocusTrap(element, () => ({\n    allowOutsideClick: true,\n    escapeDeactivates: restProps.closeOnEscape,\n    onDeactivate: () => {\n      setElementState(\"isOpen\", false);\n    },\n  }));\n\n  createEffect(() => {\n    if (!props.debug) return;\n    console.table({\n      ...state,\n    });\n  });\n\n  createEffect(\n    on(\n      () => state.isOpen,\n      (isOpen) => {\n        const eventName = isOpen ? \"drawer:open\" : \"drawer:close\";\n        element.dispatchEvent(\n          new CustomEvent(eventName, {\n            bubbles: true,\n            detail: { isOpen, relatedTarget: element },\n          }),\n        );\n        element.dispatchEvent(\n          new CustomEvent(\"drawer:toggle\", {\n            bubbles: true,\n            detail: { isOpen, relatedTarget: element },\n          }),\n        );\n      },\n    ),\n  );\n\n  createEffect(\n    on(\n      () => ({\n        isOpen: state.isOpen,\n        focusTrap: focusTrap(),\n        shouldTrapFocus: restProps.shouldTrapFocus,\n      }),\n      ({ isOpen, focusTrap, shouldTrapFocus }) => {\n        if (!isOpen) return;\n        if (props.debug) console.log(\"Showing element\", element);\n        showElement(element);\n        if (!shouldTrapFocus) return;\n        focusTrap.activate();\n        onCleanup(focusTrap.deactivate);\n      },\n    ),\n  );\n\n  createEffect(\n    on(\n      () => ({\n        isOpen: state.isOpen,\n        isAnimating: state.isAnimating,\n      }),\n      ({ isOpen, isAnimating }) => {\n        if (isOpen && !isAnimating)\n          return disableBodyScroll(element, {\n            allowTouchMove: (el: EventTarget) => {\n              if (el instanceof HTMLElement) {\n                let element = el as (EventTarget & HTMLElement) | null;\n                while (element && element !== document.body) {\n                  if (element.tagName === \"DRAWER-CONTENT\") {\n                    return true;\n                  }\n\n                  element = element.parentElement;\n                }\n              }\n              return false;\n            },\n          });\n        onCleanup(() => {\n          enableBodyScroll(element);\n        });\n      },\n    ),\n  );\n\n  createEffect(\n    on(\n      () => ({ isOpen: state.isOpen, animationQueue: state.animationQueue }),\n      ({ isOpen, animationQueue }) => {\n        if (isOpen) return;\n        if (props.debug)\n          console.log(\"Waiting for animations to complete...\", animationQueue);\n        return Promise.all(animationQueue)\n          .then(() => hideElement(element))\n          .then(() => {\n            if (props.debug) console.log(\"Hiding element\", element);\n          });\n      },\n    ),\n  );\n\n  onCleanup(() => {\n    disableBodyScroll(element);\n  });\n};\n"]}

package/dist/main/hooks/useDrawer.js

@@ -1,7 +1,9 @@
 import { createContext, provide, consume } from 'component-register';
-import { splitProps, createEffect, on, batch, untrack, mergeProps } from 'solid-js';
+import { splitProps, createEffect, on, batch, onCleanup, untrack, mergeProps } from 'solid-js';
 import { createStore } from 'solid-js/store';
 import { toHyphenated, getContextFromProvider } from '@brytdesigns/web-component-utils';
+import { abortablePromise } from '@brytdesigns/web-component-core/promise';
+import { awaitAllAnimations } from '@brytdesigns/web-component-core/animation';
 
 function initializeDrawerContext(props) {
   const [_internal, _state] = splitProps(props, ["root"]);
@@ -11,14 +13,22 @@ function initializeDrawerContext(props) {
       () => store.animationQueue,
       (animationQueue) => {
         if (!animationQueue.length) return;
-        const animations = Promise.allSettled([...store.animationQueue]);
+        const controller = new AbortController();
+        const animations = awaitAllAnimations(animationQueue);
+        const abortableAnimations = abortablePromise(
+          animations,
+          controller.signal
+        );
         setElementState("isAnimating", true);
-        animations.finally(() => {
+        abortableAnimations.finally(() => {
           batch(() => {
             setElementState("isAnimating", false);
             setStore("animationQueue", []);
           });
         });
+        return onCleanup(() => {
+          controller.abort();
+        });
       }
     )
   );

package/dist/main/hooks/useDrawer.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/hooks/useDrawer.ts"],"names":["state","open"],"mappings":"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","file":"useDrawer.js","sourcesContent":["import {\n  type ICustomElement,\n  createContext,\n  provide,\n  consume,\n} from \"component-register\";\nimport {\n  createEffect,\n  on,\n  batch,\n  splitProps,\n  untrack,\n  mergeProps,\n} from \"solid-js\";\nimport { createStore } from \"solid-js/store\";\nimport {\n  toHyphenated,\n  getContextFromProvider,\n} from \"@brytdesigns/web-component-utils\";\n\ntype StoreContext = {\n  animationQueue: Promise<unknown>[];\n};\n\ntype CreateContextOptions = {\n  root: HTMLElement & ICustomElement;\n  isOpen: boolean;\n  isAnimating: boolean;\n};\n\ntype WalkableNode = Parameters<typeof provide>[2];\n\ntype DrawerContext = ReturnType<typeof initializeDrawerContext>;\n\nfunction initializeDrawerContext(props: CreateContextOptions) {\n  const [_internal, _state] = splitProps(props, [\"root\"]);\n  const [store, setStore] = createStore<StoreContext>({ animationQueue: [] });\n\n  createEffect(\n    on(\n      () => store.animationQueue,\n      (animationQueue) => {\n        if (!animationQueue.length) return;\n        const animations = Promise.allSettled([...store.animationQueue]);\n        setElementState(\"isAnimating\", true);\n        animations.finally(() => {\n          batch(() => {\n            setElementState(\"isAnimating\", false);\n            setStore(\"animationQueue\", []);\n          });\n        });\n      },\n    ),\n  );\n\n  function setElementState(\n    key: keyof Omit<CreateContextOptions, \"root\">,\n    value: boolean | ((v: boolean) => boolean),\n  ) {\n    const currentValue = untrack(() => props[key]);\n    if (typeof value === \"function\") {\n      const result = value(currentValue || false);\n      if (`${currentValue}` === `${result}`) return;\n      _internal.root.setAttribute(toHyphenated(key), `${result}`);\n      return;\n    }\n    if (`${currentValue}` === `${value}`) return;\n    return _internal.root.setAttribute(toHyphenated(key), `${value}`);\n  }\n\n  return [mergeProps(_state, store), { setElementState, setStore }] as const;\n}\n\nconst DrawerContextState = createContext(initializeDrawerContext);\n\nexport const provideDrawerContext = (\n  initialState: Omit<CreateContextOptions, \"root\">,\n  element: WalkableNode,\n): DrawerContext => {\n  const props = mergeProps(initialState, { root: element });\n  return provide(DrawerContextState, props, element);\n};\n\nexport const useDrawerContext = (context: DrawerContext) => {\n  const [state, { setElementState, setStore: setState }] = context;\n\n  function updateAnimationQueue(animation: Promise<unknown>) {\n    setState(\"animationQueue\", (state) => [...state, animation]);\n  }\n\n  function close() {\n    setElementState(\"isOpen\", false);\n  }\n\n  function open() {\n    setElementState(\"isOpen\", true);\n  }\n\n  function toggle() {\n    setElementState(\"isOpen\", (open) => !open);\n  }\n\n  return [state, { updateAnimationQueue, close, open, toggle }] as const;\n};\n\nexport const useDrawer = (element: HTMLElement & ICustomElement) => {\n  const context: DrawerContext = consume(DrawerContextState, element);\n\n  if (!context) {\n    throw console.error(\n      \"DrawerContext not found! Please ensure to wrap your custom element with drawer-context element.\",\n    );\n  }\n\n  return useDrawerContext(context);\n};\n\nexport const getDrawerContext = (element: Element) => {\n  const context = getContextFromProvider<DrawerContext>(\n    DrawerContextState,\n    element,\n  );\n  return useDrawerContext(context);\n};\n"]}
+{"version":3,"sources":["../../../src/hooks/useDrawer.ts"],"names":["state","open"],"mappings":"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","file":"useDrawer.js","sourcesContent":["import {\n  type ICustomElement,\n  createContext,\n  provide,\n  consume,\n} from \"component-register\";\nimport {\n  createEffect,\n  on,\n  batch,\n  splitProps,\n  untrack,\n  mergeProps,\n  onCleanup,\n} from \"solid-js\";\nimport { createStore } from \"solid-js/store\";\nimport {\n  toHyphenated,\n  getContextFromProvider,\n} from \"@brytdesigns/web-component-utils\";\n\nimport type { AnimationPlaybackControlsWithThen } from \"motion\";\nimport { abortablePromise } from \"@brytdesigns/web-component-core/promise\";\nimport { awaitAllAnimations } from \"@brytdesigns/web-component-core/animation\";\n\ntype StoreContext = {\n  animationQueue: AnimationPlaybackControlsWithThen[];\n};\n\ntype CreateContextOptions = {\n  root: HTMLElement & ICustomElement;\n  isOpen: boolean;\n  isAnimating: boolean;\n};\n\ntype WalkableNode = Parameters<typeof provide>[2];\n\ntype DrawerContext = ReturnType<typeof initializeDrawerContext>;\n\nfunction initializeDrawerContext(props: CreateContextOptions) {\n  const [_internal, _state] = splitProps(props, [\"root\"]);\n  const [store, setStore] = createStore<StoreContext>({ animationQueue: [] });\n\n  createEffect(\n    on(\n      () => store.animationQueue,\n      (animationQueue) => {\n        if (!animationQueue.length) return;\n        const controller = new AbortController();\n        const animations = awaitAllAnimations(animationQueue);\n        const abortableAnimations = abortablePromise(\n          animations,\n          controller.signal,\n        );\n        setElementState(\"isAnimating\", true);\n        abortableAnimations.finally(() => {\n          batch(() => {\n            setElementState(\"isAnimating\", false);\n            setStore(\"animationQueue\", []);\n          });\n        });\n\n        return onCleanup(() => {\n          controller.abort();\n        });\n      },\n    ),\n  );\n\n  function setElementState(\n    key: keyof Omit<CreateContextOptions, \"root\">,\n    value: boolean | ((v: boolean) => boolean),\n  ) {\n    const currentValue = untrack(() => props[key]);\n    if (typeof value === \"function\") {\n      const result = value(currentValue || false);\n      if (`${currentValue}` === `${result}`) return;\n      _internal.root.setAttribute(toHyphenated(key), `${result}`);\n      return;\n    }\n    if (`${currentValue}` === `${value}`) return;\n    return _internal.root.setAttribute(toHyphenated(key), `${value}`);\n  }\n\n  return [mergeProps(_state, store), { setElementState, setStore }] as const;\n}\n\nconst DrawerContextState = createContext(initializeDrawerContext);\n\nexport const provideDrawerContext = (\n  initialState: Omit<CreateContextOptions, \"root\">,\n  element: WalkableNode,\n): DrawerContext => {\n  const props = mergeProps(initialState, { root: element });\n  return provide(DrawerContextState, props, element);\n};\n\nexport const useDrawerContext = (context: DrawerContext) => {\n  const [state, { setElementState, setStore: setState }] = context;\n\n  function updateAnimationQueue(animation: AnimationPlaybackControlsWithThen) {\n    setState(\"animationQueue\", (state) => [...state, animation]);\n  }\n\n  function close() {\n    setElementState(\"isOpen\", false);\n  }\n\n  function open() {\n    setElementState(\"isOpen\", true);\n  }\n\n  function toggle() {\n    setElementState(\"isOpen\", (open) => !open);\n  }\n\n  return [state, { updateAnimationQueue, close, open, toggle }] as const;\n};\n\nexport const useDrawer = (element: HTMLElement & ICustomElement) => {\n  const context: DrawerContext = consume(DrawerContextState, element);\n\n  if (!context) {\n    throw console.error(\n      \"DrawerContext not found! Please ensure to wrap your custom element with drawer-context element.\",\n    );\n  }\n\n  return useDrawerContext(context);\n};\n\nexport const getDrawerContext = (element: Element) => {\n  const context = getContextFromProvider<DrawerContext>(\n    DrawerContextState,\n    element,\n  );\n  return useDrawerContext(context);\n};\n"]}

package/dist/main/index.d.ts

@@ -1,15 +1,16 @@
 // Generated by dts-bundle-generator v9.5.1
 
 import { ICustomElement } from 'component-register';
+import { AnimationPlaybackControlsWithThen } from 'motion';
 
 export declare const useDrawer: (element: HTMLElement & ICustomElement) => readonly [
 	{
 		isOpen: boolean;
 		isAnimating: boolean;
-		animationQueue: Promise<unknown>[];
+		animationQueue: AnimationPlaybackControlsWithThen[];
 	},
 	{
-		readonly updateAnimationQueue: (animation: Promise<unknown>) => void;
+		readonly updateAnimationQueue: (animation: AnimationPlaybackControlsWithThen) => void;
 		readonly close: () => void;
 		readonly open: () => void;
 		readonly toggle: () => void;
@@ -19,10 +20,10 @@ export declare const getDrawerContext: (element: Element) => readonly [
 	{
 		isOpen: boolean;
 		isAnimating: boolean;
-		animationQueue: Promise<unknown>[];
+		animationQueue: AnimationPlaybackControlsWithThen[];
 	},
 	{
-		readonly updateAnimationQueue: (animation: Promise<unknown>) => void;
+		readonly updateAnimationQueue: (animation: AnimationPlaybackControlsWithThen) => void;
 		readonly close: () => void;
 		readonly open: () => void;
 		readonly toggle: () => void;

package/dist/main/utils.js

@@ -4,11 +4,6 @@ function hideElement(element) {
 function showElement(element) {
   element.style.display = "block";
 }
-async function controlPromise(controls) {
-  return new Promise((resolve) => {
-    controls.then(() => resolve(null));
-  });
-}
 function getTransitionConfig(style) {
   const properties = {
     autoplay: style.getPropertyValue("--motion--autoplay"),
@@ -63,6 +58,6 @@ function getTransitionConfig(style) {
   };
 }
 
-export { controlPromise, getTransitionConfig, hideElement, showElement };
+export { getTransitionConfig, hideElement, showElement };
 //# sourceMappingURL=utils.js.map
 //# sourceMappingURL=utils.js.map

package/dist/main/utils.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/utils.ts"],"names":[],"mappings":"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","file":"utils.js","sourcesContent":["import type {\n  AnimationGeneratorType,\n  AnimationPlaybackControlsWithThen,\n  Easing,\n  RepeatType,\n  Transition,\n} from \"motion\";\n\nexport function hideElement<T extends HTMLElement>(element: T) {\n  element.style.display = \"none\";\n}\n\nexport function showElement<T extends HTMLElement>(element: T) {\n  element.style.display = \"block\";\n}\n\nexport async function controlPromise(\n  controls: AnimationPlaybackControlsWithThen,\n) {\n  return new Promise((resolve) => {\n    controls.then(() => resolve(null));\n  });\n}\n\nexport function getTransitionConfig(style: CSSStyleDeclaration) {\n  const properties = {\n    autoplay: style.getPropertyValue(\"--motion--autoplay\"),\n    bounce: style.getPropertyValue(\"--motion--bounce\"),\n    bounceDamping: style.getPropertyValue(\"--motion--bounce-damping\"),\n    bounceStiffness: style.getPropertyValue(\"--motion--bounce-stiffness\"),\n    duration: style.getPropertyValue(\"--motion--duration\"),\n    damping: style.getPropertyValue(\"--motion--damping\"),\n    delay: style.getPropertyValue(\"--motion--delay\"),\n    ease: style.getPropertyValue(\"--motion--ease\"),\n    elapsed: style.getPropertyValue(\"--motion--elapsed\"),\n    mass: style.getPropertyValue(\"--motion--mass\"),\n    max: style.getPropertyValue(\"--motion--max\"),\n    min: style.getPropertyValue(\"--motion--min\"),\n    power: style.getPropertyValue(\"--motion--power\"),\n    repeat: style.getPropertyValue(\"--motion--repeat\"),\n    repeatDelay: style.getPropertyValue(\"--motion--repeat-delay\"),\n    repeatType: style.getPropertyValue(\"--motion--repeat-type\"),\n    restDelta: style.getPropertyValue(\"--motion--rest-delta\"),\n    restSpeed: style.getPropertyValue(\"--motion--rest-speed\"),\n    startTime: style.getPropertyValue(\"--motion--start-time\"),\n    timeConstant: style.getPropertyValue(\"--motion--time-constant\"),\n    times: style.getPropertyValue(\"--motion--times\"),\n    type: style.getPropertyValue(\"--motion--type\"),\n    velocity: style.getPropertyValue(\"--motion--velocity\"),\n    visualDuration: style.getPropertyValue(\"--motion--visual-duration\"),\n  };\n  return {\n    autoplay: properties.autoplay ? properties.autoplay === \"true\" : undefined,\n    bounce: properties.bounce ? parseFloat(properties.bounce) : undefined,\n    bounceDamping: properties.bounceDamping\n      ? parseFloat(properties.bounceDamping)\n      : undefined,\n    bounceStiffness: properties.bounceStiffness\n      ? parseFloat(properties.bounceStiffness)\n      : undefined,\n    duration: properties.duration ? parseFloat(properties.duration) : undefined,\n    damping: properties.damping ? parseFloat(properties.damping) : undefined,\n    delay: properties.delay ? parseFloat(properties.delay) : undefined,\n    ease: (properties.ease as Easing) || undefined,\n    elapsed: properties.elapsed ? parseFloat(properties.elapsed) : undefined,\n    mass: properties.mass ? parseFloat(properties.mass) : undefined,\n    max: properties.max ? parseFloat(properties.max) : undefined,\n    min: properties.min ? parseFloat(properties.min) : undefined,\n    power: properties.power ? parseFloat(properties.power) : undefined,\n    repeat: properties.repeat ? parseInt(properties.repeat) : undefined,\n    repeatDelay: properties.repeatDelay\n      ? parseFloat(properties.repeatDelay)\n      : undefined,\n    repeatType: (properties.repeatType as RepeatType) || undefined,\n    restDelta: properties.restDelta\n      ? parseFloat(properties.restDelta)\n      : undefined,\n    restSpeed: properties.restSpeed\n      ? parseFloat(properties.restSpeed)\n      : undefined,\n    startTime: properties.startTime\n      ? parseFloat(properties.startTime)\n      : undefined,\n    timeConstant: properties.timeConstant\n      ? parseFloat(properties.timeConstant)\n      : undefined,\n    type: (properties.type as AnimationGeneratorType) || undefined,\n    velocity: properties.velocity ? parseFloat(properties.velocity) : undefined,\n    visualDuration: properties.visualDuration\n      ? parseFloat(properties.visualDuration)\n      : undefined,\n  } satisfies Transition;\n}\n"]}
+{"version":3,"sources":["../../src/utils.ts"],"names":[],"mappings":"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","file":"utils.js","sourcesContent":["import type {\n  AnimationGeneratorType,\n  AnimationPlaybackControlsWithThen,\n  Easing,\n  RepeatType,\n  Transition,\n} from \"motion\";\n\nexport function hideElement<T extends HTMLElement>(element: T) {\n  element.style.display = \"none\";\n}\n\nexport function showElement<T extends HTMLElement>(element: T) {\n  element.style.display = \"block\";\n}\n\nexport function getTransitionConfig(style: CSSStyleDeclaration) {\n  const properties = {\n    autoplay: style.getPropertyValue(\"--motion--autoplay\"),\n    bounce: style.getPropertyValue(\"--motion--bounce\"),\n    bounceDamping: style.getPropertyValue(\"--motion--bounce-damping\"),\n    bounceStiffness: style.getPropertyValue(\"--motion--bounce-stiffness\"),\n    duration: style.getPropertyValue(\"--motion--duration\"),\n    damping: style.getPropertyValue(\"--motion--damping\"),\n    delay: style.getPropertyValue(\"--motion--delay\"),\n    ease: style.getPropertyValue(\"--motion--ease\"),\n    elapsed: style.getPropertyValue(\"--motion--elapsed\"),\n    mass: style.getPropertyValue(\"--motion--mass\"),\n    max: style.getPropertyValue(\"--motion--max\"),\n    min: style.getPropertyValue(\"--motion--min\"),\n    power: style.getPropertyValue(\"--motion--power\"),\n    repeat: style.getPropertyValue(\"--motion--repeat\"),\n    repeatDelay: style.getPropertyValue(\"--motion--repeat-delay\"),\n    repeatType: style.getPropertyValue(\"--motion--repeat-type\"),\n    restDelta: style.getPropertyValue(\"--motion--rest-delta\"),\n    restSpeed: style.getPropertyValue(\"--motion--rest-speed\"),\n    startTime: style.getPropertyValue(\"--motion--start-time\"),\n    timeConstant: style.getPropertyValue(\"--motion--time-constant\"),\n    times: style.getPropertyValue(\"--motion--times\"),\n    type: style.getPropertyValue(\"--motion--type\"),\n    velocity: style.getPropertyValue(\"--motion--velocity\"),\n    visualDuration: style.getPropertyValue(\"--motion--visual-duration\"),\n  };\n  return {\n    autoplay: properties.autoplay ? properties.autoplay === \"true\" : undefined,\n    bounce: properties.bounce ? parseFloat(properties.bounce) : undefined,\n    bounceDamping: properties.bounceDamping\n      ? parseFloat(properties.bounceDamping)\n      : undefined,\n    bounceStiffness: properties.bounceStiffness\n      ? parseFloat(properties.bounceStiffness)\n      : undefined,\n    duration: properties.duration ? parseFloat(properties.duration) : undefined,\n    damping: properties.damping ? parseFloat(properties.damping) : undefined,\n    delay: properties.delay ? parseFloat(properties.delay) : undefined,\n    ease: (properties.ease as Easing) || undefined,\n    elapsed: properties.elapsed ? parseFloat(properties.elapsed) : undefined,\n    mass: properties.mass ? parseFloat(properties.mass) : undefined,\n    max: properties.max ? parseFloat(properties.max) : undefined,\n    min: properties.min ? parseFloat(properties.min) : undefined,\n    power: properties.power ? parseFloat(properties.power) : undefined,\n    repeat: properties.repeat ? parseInt(properties.repeat) : undefined,\n    repeatDelay: properties.repeatDelay\n      ? parseFloat(properties.repeatDelay)\n      : undefined,\n    repeatType: (properties.repeatType as RepeatType) || undefined,\n    restDelta: properties.restDelta\n      ? parseFloat(properties.restDelta)\n      : undefined,\n    restSpeed: properties.restSpeed\n      ? parseFloat(properties.restSpeed)\n      : undefined,\n    startTime: properties.startTime\n      ? parseFloat(properties.startTime)\n      : undefined,\n    timeConstant: properties.timeConstant\n      ? parseFloat(properties.timeConstant)\n      : undefined,\n    type: (properties.type as AnimationGeneratorType) || undefined,\n    velocity: properties.velocity ? parseFloat(properties.velocity) : undefined,\n    visualDuration: properties.visualDuration\n      ? parseFloat(properties.visualDuration)\n      : undefined,\n  } satisfies Transition;\n}\n"]}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@brytdesigns/web-component-drawer",
-  "version": "1.0.22",
+  "version": "1.0.24",
   "description": "Headless drawer web component",
   "main": "./dist/main/index.js",
   "module": "./dist/main/index.js",
@@ -21,12 +21,12 @@
   "dependencies": {
     "body-scroll-lock-upgrade": "^1.1.0",
     "component-register": "^0.8.7",
-    "focus-trap": "^7.6.4",
     "motion": "^12.18.1",
     "observe-element-in-viewport": "^0.0.15",
     "solid-element": "^1.9.1",
     "solid-js": "^1.9.7",
-    "@brytdesigns/web-component-utils": "0.1.14"
+    "@brytdesigns/web-component-utils": "0.1.14",
+    "@brytdesigns/web-component-core": "1.0.1"
   },
   "devDependencies": {
     "dts-bundle-generator": "^9.5.1",