@stevederico/skateboard-ui 3.0.2 → 3.6.0

package/shadcn/lib/base-ui/_chunk-wana68v3.js

@@ -0,0 +1,477 @@
+import {
+  useControlled
+} from "./_chunk-01rqe37g.js";
+import {
+  addEventListener
+} from "./_chunk-mvv30fkv.js";
+import {
+  createChangeEventDetails,
+  exports_reason_parts
+} from "./_chunk-4s0k3h7t.js";
+import {
+  useBaseUiId
+} from "./_chunk-8kh3xk78.js";
+import {
+  TransitionStatusDataAttributes,
+  useAnimationsFinished,
+  useTransitionStatus
+} from "./_chunk-mbn76q14.js";
+import {
+  AnimationFrame,
+  useAnimationFrame
+} from "./_chunk-3h6zpchb.js";
+import {
+  useOnMount
+} from "./_chunk-8jz3hb7q.js";
+import {
+  useStableCallback
+} from "./_chunk-mznt6ktj.js";
+import {
+  useIsoLayoutEffect
+} from "./_chunk-b40erthe.js";
+import {
+  useMergedRefs,
+  warn
+} from "./_chunk-1s41sngz.js";
+
+// node_modules/.deno/@base-ui+react@1.4.1/node_modules/@base-ui/react/esm/collapsible/root/useCollapsibleRoot.js
+import * as React from "react";
+"use client";
+function useCollapsibleRoot(parameters) {
+  const {
+    open: openParam,
+    defaultOpen,
+    onOpenChange,
+    disabled
+  } = parameters;
+  const isControlled = openParam !== undefined;
+  const [open, setOpen] = useControlled({
+    controlled: openParam,
+    default: defaultOpen,
+    name: "Collapsible",
+    state: "open"
+  });
+  const {
+    mounted,
+    setMounted,
+    transitionStatus
+  } = useTransitionStatus(open, true, true);
+  const [visible, setVisible] = React.useState(open);
+  const [{
+    height,
+    width
+  }, setDimensions] = React.useState({
+    height: undefined,
+    width: undefined
+  });
+  const defaultPanelId = useBaseUiId();
+  const [panelIdState, setPanelIdState] = React.useState();
+  const panelId = panelIdState ?? defaultPanelId;
+  const [hiddenUntilFound, setHiddenUntilFound] = React.useState(false);
+  const [keepMounted, setKeepMounted] = React.useState(false);
+  const abortControllerRef = React.useRef(null);
+  const animationTypeRef = React.useRef(null);
+  const transitionDimensionRef = React.useRef(null);
+  const panelRef = React.useRef(null);
+  const runOnceAnimationsFinish = useAnimationsFinished(panelRef, false);
+  const handleTrigger = useStableCallback((event) => {
+    const nextOpen = !open;
+    const eventDetails = createChangeEventDetails(exports_reason_parts.triggerPress, event.nativeEvent);
+    onOpenChange(nextOpen, eventDetails);
+    if (eventDetails.isCanceled) {
+      return;
+    }
+    const panel = panelRef.current;
+    if (animationTypeRef.current === "css-animation" && panel != null) {
+      panel.style.removeProperty("animation-name");
+    }
+    if (!hiddenUntilFound && !keepMounted) {
+      if (animationTypeRef.current != null && animationTypeRef.current !== "css-animation") {
+        if (!mounted && nextOpen) {
+          setMounted(true);
+        }
+      }
+      if (animationTypeRef.current === "css-animation") {
+        if (!visible && nextOpen) {
+          setVisible(true);
+        }
+        if (!mounted && nextOpen) {
+          setMounted(true);
+        }
+      }
+    }
+    setOpen(nextOpen);
+    if (animationTypeRef.current === "none" && mounted && !nextOpen) {
+      setMounted(false);
+    }
+  });
+  useIsoLayoutEffect(() => {
+    if (isControlled && animationTypeRef.current === "none" && !open) {
+      setMounted(false);
+    }
+  }, [isControlled, open, openParam, setMounted]);
+  return React.useMemo(() => ({
+    abortControllerRef,
+    animationTypeRef,
+    disabled,
+    handleTrigger,
+    height,
+    mounted,
+    open,
+    panelId,
+    panelRef,
+    runOnceAnimationsFinish,
+    setDimensions,
+    setHiddenUntilFound,
+    setKeepMounted,
+    setMounted,
+    setOpen,
+    setPanelIdState,
+    setVisible,
+    transitionDimensionRef,
+    transitionStatus,
+    visible,
+    width
+  }), [abortControllerRef, animationTypeRef, disabled, handleTrigger, height, mounted, open, panelId, panelRef, runOnceAnimationsFinish, setDimensions, setHiddenUntilFound, setKeepMounted, setMounted, setOpen, setVisible, transitionDimensionRef, transitionStatus, visible, width]);
+}
+
+// node_modules/.deno/@base-ui+react@1.4.1/node_modules/@base-ui/react/esm/collapsible/root/CollapsibleRootContext.js
+import * as React2 from "react";
+"use client";
+var CollapsibleRootContext = /* @__PURE__ */ React2.createContext(undefined);
+if (true)
+  CollapsibleRootContext.displayName = "CollapsibleRootContext";
+function useCollapsibleRootContext() {
+  const context = React2.useContext(CollapsibleRootContext);
+  if (context === undefined) {
+    throw new Error("Base UI: CollapsibleRootContext is missing. Collapsible parts must be placed within <Collapsible.Root>.");
+  }
+  return context;
+}
+
+// node_modules/.deno/@base-ui+react@1.4.1/node_modules/@base-ui/react/esm/collapsible/panel/CollapsiblePanelDataAttributes.js
+var CollapsiblePanelDataAttributes = function(CollapsiblePanelDataAttributes2) {
+  CollapsiblePanelDataAttributes2["open"] = "data-open";
+  CollapsiblePanelDataAttributes2["closed"] = "data-closed";
+  CollapsiblePanelDataAttributes2[CollapsiblePanelDataAttributes2["startingStyle"] = TransitionStatusDataAttributes.startingStyle] = "startingStyle";
+  CollapsiblePanelDataAttributes2[CollapsiblePanelDataAttributes2["endingStyle"] = TransitionStatusDataAttributes.endingStyle] = "endingStyle";
+  return CollapsiblePanelDataAttributes2;
+}({});
+
+// node_modules/.deno/@base-ui+react@1.4.1/node_modules/@base-ui/react/esm/collapsible/trigger/CollapsibleTriggerDataAttributes.js
+var CollapsibleTriggerDataAttributes = /* @__PURE__ */ function(CollapsibleTriggerDataAttributes2) {
+  CollapsibleTriggerDataAttributes2["panelOpen"] = "data-panel-open";
+  return CollapsibleTriggerDataAttributes2;
+}({});
+
+// node_modules/.deno/@base-ui+react@1.4.1/node_modules/@base-ui/react/esm/utils/collapsibleOpenStateMapping.js
+var PANEL_OPEN_HOOK = {
+  [CollapsiblePanelDataAttributes.open]: ""
+};
+var PANEL_CLOSED_HOOK = {
+  [CollapsiblePanelDataAttributes.closed]: ""
+};
+var triggerOpenStateMapping = {
+  open(value) {
+    if (value) {
+      return {
+        [CollapsibleTriggerDataAttributes.panelOpen]: ""
+      };
+    }
+    return null;
+  }
+};
+var collapsibleOpenStateMapping = {
+  open(value) {
+    if (value) {
+      return PANEL_OPEN_HOOK;
+    }
+    return PANEL_CLOSED_HOOK;
+  }
+};
+
+// node_modules/.deno/@base-ui+react@1.4.1/node_modules/@base-ui/react/esm/collapsible/panel/useCollapsiblePanel.js
+import * as React3 from "react";
+
+// node_modules/.deno/@base-ui+react@1.4.1/node_modules/@base-ui/react/esm/accordion/root/AccordionRootDataAttributes.js
+var AccordionRootDataAttributes = /* @__PURE__ */ function(AccordionRootDataAttributes2) {
+  AccordionRootDataAttributes2["disabled"] = "data-disabled";
+  AccordionRootDataAttributes2["orientation"] = "data-orientation";
+  return AccordionRootDataAttributes2;
+}({});
+
+// node_modules/.deno/@base-ui+react@1.4.1/node_modules/@base-ui/react/esm/collapsible/panel/useCollapsiblePanel.js
+"use client";
+function useCollapsiblePanel(parameters) {
+  const {
+    abortControllerRef,
+    animationTypeRef,
+    externalRef,
+    height,
+    hiddenUntilFound,
+    keepMounted,
+    id: idParam,
+    mounted,
+    onOpenChange,
+    open,
+    panelRef,
+    runOnceAnimationsFinish,
+    setDimensions,
+    setMounted,
+    setOpen,
+    setVisible,
+    transitionDimensionRef,
+    visible,
+    width
+  } = parameters;
+  const isBeforeMatchRef = React3.useRef(false);
+  const latestAnimationNameRef = React3.useRef(null);
+  const shouldCancelInitialOpenAnimationRef = React3.useRef(open);
+  const shouldCancelInitialOpenTransitionRef = React3.useRef(open);
+  const endingStyleFrame = useAnimationFrame();
+  const hidden = React3.useMemo(() => {
+    if (animationTypeRef.current === "css-animation") {
+      return !visible;
+    }
+    return !open && !mounted;
+  }, [open, mounted, visible, animationTypeRef]);
+  const handlePanelRef = useStableCallback((element) => {
+    if (!element) {
+      return;
+    }
+    if (animationTypeRef.current == null || transitionDimensionRef.current == null) {
+      const panelStyles = getComputedStyle(element);
+      const hasAnimation = panelStyles.animationName !== "none" && panelStyles.animationName !== "";
+      const hasTransition = panelStyles.transitionDuration !== "0s" && panelStyles.transitionDuration !== "";
+      if (hasAnimation && hasTransition) {
+        if (true) {
+          warn("CSS transitions and CSS animations both detected on Collapsible or Accordion panel.", "Only one of either animation type should be used.");
+        }
+      } else if (panelStyles.animationName === "none" && panelStyles.transitionDuration !== "0s") {
+        animationTypeRef.current = "css-transition";
+      } else if (panelStyles.animationName !== "none" && panelStyles.transitionDuration === "0s") {
+        animationTypeRef.current = "css-animation";
+      } else {
+        animationTypeRef.current = "none";
+      }
+      if (element.getAttribute(AccordionRootDataAttributes.orientation) === "horizontal" || panelStyles.transitionProperty.indexOf("width") > -1) {
+        transitionDimensionRef.current = "width";
+      } else {
+        transitionDimensionRef.current = "height";
+      }
+    }
+    if (animationTypeRef.current !== "css-transition") {
+      return;
+    }
+    if (height === undefined || width === undefined) {
+      setDimensions({
+        height: element.scrollHeight,
+        width: element.scrollWidth
+      });
+      if (shouldCancelInitialOpenTransitionRef.current) {
+        element.style.setProperty("transition-duration", "0s");
+      }
+    }
+    let frame = -1;
+    let nextFrame = -1;
+    frame = AnimationFrame.request(() => {
+      shouldCancelInitialOpenTransitionRef.current = false;
+      nextFrame = AnimationFrame.request(() => {
+        setTimeout(() => {
+          element.style.removeProperty("transition-duration");
+        });
+      });
+    });
+    return () => {
+      AnimationFrame.cancel(frame);
+      AnimationFrame.cancel(nextFrame);
+    };
+  });
+  const mergedPanelRef = useMergedRefs(externalRef, panelRef, handlePanelRef);
+  useIsoLayoutEffect(() => {
+    if (animationTypeRef.current !== "css-transition") {
+      return;
+    }
+    const panel = panelRef.current;
+    if (!panel) {
+      return;
+    }
+    let resizeFrame = -1;
+    if (abortControllerRef.current != null) {
+      abortControllerRef.current.abort();
+      abortControllerRef.current = null;
+    }
+    if (open) {
+      const originalLayoutStyles = {
+        "justify-content": panel.style.justifyContent,
+        "align-items": panel.style.alignItems,
+        "align-content": panel.style.alignContent,
+        "justify-items": panel.style.justifyItems
+      };
+      Object.keys(originalLayoutStyles).forEach((key) => {
+        panel.style.setProperty(key, "initial", "important");
+      });
+      if (!shouldCancelInitialOpenTransitionRef.current && !keepMounted) {
+        panel.setAttribute(CollapsiblePanelDataAttributes.startingStyle, "");
+      }
+      setDimensions({
+        height: panel.scrollHeight,
+        width: panel.scrollWidth
+      });
+      resizeFrame = AnimationFrame.request(() => {
+        Object.entries(originalLayoutStyles).forEach(([key, value]) => {
+          if (value === "") {
+            panel.style.removeProperty(key);
+          } else {
+            panel.style.setProperty(key, value);
+          }
+        });
+      });
+    } else {
+      if (panel.scrollHeight === 0 && panel.scrollWidth === 0) {
+        return;
+      }
+      setDimensions({
+        height: panel.scrollHeight,
+        width: panel.scrollWidth
+      });
+      const abortController = new AbortController;
+      abortControllerRef.current = abortController;
+      const signal = abortController.signal;
+      let attributeObserver = null;
+      const endingStyleAttribute = CollapsiblePanelDataAttributes.endingStyle;
+      attributeObserver = new MutationObserver((mutationList) => {
+        const hasEndingStyle = mutationList.some((mutation) => mutation.type === "attributes" && mutation.attributeName === endingStyleAttribute);
+        if (hasEndingStyle) {
+          attributeObserver?.disconnect();
+          attributeObserver = null;
+          runOnceAnimationsFinish(() => {
+            setDimensions({
+              height: 0,
+              width: 0
+            });
+            panel.style.removeProperty("content-visibility");
+            setMounted(false);
+            if (abortControllerRef.current === abortController) {
+              abortControllerRef.current = null;
+            }
+          }, signal);
+        }
+      });
+      attributeObserver.observe(panel, {
+        attributes: true,
+        attributeFilter: [endingStyleAttribute]
+      });
+      return () => {
+        attributeObserver?.disconnect();
+        endingStyleFrame.cancel();
+        if (abortControllerRef.current === abortController) {
+          abortController.abort();
+          abortControllerRef.current = null;
+        }
+      };
+    }
+    return () => {
+      AnimationFrame.cancel(resizeFrame);
+    };
+  }, [abortControllerRef, animationTypeRef, endingStyleFrame, hiddenUntilFound, keepMounted, mounted, open, panelRef, runOnceAnimationsFinish, setDimensions, setMounted]);
+  useIsoLayoutEffect(() => {
+    if (animationTypeRef.current !== "css-animation") {
+      return;
+    }
+    const panel = panelRef.current;
+    if (!panel) {
+      return;
+    }
+    latestAnimationNameRef.current = panel.style.animationName || latestAnimationNameRef.current;
+    panel.style.setProperty("animation-name", "none");
+    setDimensions({
+      height: panel.scrollHeight,
+      width: panel.scrollWidth
+    });
+    if (!shouldCancelInitialOpenAnimationRef.current && !isBeforeMatchRef.current) {
+      panel.style.removeProperty("animation-name");
+    }
+    if (open) {
+      if (abortControllerRef.current != null) {
+        abortControllerRef.current.abort();
+        abortControllerRef.current = null;
+      }
+      setMounted(true);
+      setVisible(true);
+    } else {
+      abortControllerRef.current = new AbortController;
+      runOnceAnimationsFinish(() => {
+        setMounted(false);
+        setVisible(false);
+        abortControllerRef.current = null;
+      }, abortControllerRef.current.signal);
+    }
+  }, [abortControllerRef, animationTypeRef, open, panelRef, runOnceAnimationsFinish, setDimensions, setMounted, setVisible, visible]);
+  useOnMount(() => {
+    const frame = AnimationFrame.request(() => {
+      shouldCancelInitialOpenAnimationRef.current = false;
+    });
+    return () => AnimationFrame.cancel(frame);
+  });
+  useIsoLayoutEffect(() => {
+    if (!hiddenUntilFound) {
+      return;
+    }
+    const panel = panelRef.current;
+    if (!panel) {
+      return;
+    }
+    let frame = -1;
+    let nextFrame = -1;
+    if (open && isBeforeMatchRef.current) {
+      panel.style.transitionDuration = "0s";
+      setDimensions({
+        height: panel.scrollHeight,
+        width: panel.scrollWidth
+      });
+      frame = AnimationFrame.request(() => {
+        isBeforeMatchRef.current = false;
+        nextFrame = AnimationFrame.request(() => {
+          setTimeout(() => {
+            panel.style.removeProperty("transition-duration");
+          });
+        });
+      });
+    }
+    return () => {
+      AnimationFrame.cancel(frame);
+      AnimationFrame.cancel(nextFrame);
+    };
+  }, [hiddenUntilFound, open, panelRef, setDimensions]);
+  useIsoLayoutEffect(() => {
+    const panel = panelRef.current;
+    if (panel && hiddenUntilFound && hidden) {
+      panel.setAttribute("hidden", "until-found");
+      if (animationTypeRef.current === "css-transition") {
+        panel.setAttribute(CollapsiblePanelDataAttributes.startingStyle, "");
+      }
+    }
+  }, [hiddenUntilFound, hidden, animationTypeRef, panelRef]);
+  React3.useEffect(function registerBeforeMatchListener() {
+    const panel = panelRef.current;
+    if (!panel) {
+      return;
+    }
+    function handleBeforeMatch(event) {
+      isBeforeMatchRef.current = true;
+      setOpen(true);
+      onOpenChange(true, createChangeEventDetails(exports_reason_parts.none, event));
+    }
+    return addEventListener(panel, "beforematch", handleBeforeMatch);
+  }, [onOpenChange, panelRef, setOpen]);
+  return React3.useMemo(() => ({
+    props: {
+      hidden,
+      id: idParam,
+      ref: mergedPanelRef
+    }
+  }), [hidden, idParam, mergedPanelRef]);
+}
+
+export { useCollapsibleRoot, CollapsibleRootContext, useCollapsibleRootContext, triggerOpenStateMapping, collapsibleOpenStateMapping, useCollapsiblePanel };

package/shadcn/lib/base-ui/_chunk-wtw745qd.js

@@ -0,0 +1,12 @@
+// node_modules/.deno/@base-ui+react@1.4.1/node_modules/@base-ui/react/esm/internals/direction-context/DirectionContext.js
+import * as React from "react";
+"use client";
+var DirectionContext = /* @__PURE__ */ React.createContext(undefined);
+if (true)
+  DirectionContext.displayName = "DirectionContext";
+function useDirection() {
+  const context = React.useContext(DirectionContext);
+  return context?.direction ?? "ltr";
+}
+
+export { useDirection };

package/shadcn/lib/base-ui/_chunk-xb7ph1ka.js

@@ -0,0 +1,6 @@
+// node_modules/.deno/@base-ui+utils@0.2.8/node_modules/@base-ui/utils/esm/owner.js
+function ownerDocument(node) {
+  return node?.ownerDocument || document;
+}
+
+export { ownerDocument };

package/shadcn/lib/base-ui/_chunk-xfagb0fq.js

@@ -0,0 +1,28 @@
+import {
+  round
+} from "./_chunk-nya71ccw.js";
+import {
+  getComputedStyle,
+  isHTMLElement
+} from "./_chunk-sx6vkz01.js";
+
+// node_modules/.deno/@base-ui+react@1.4.1/node_modules/@base-ui/react/esm/utils/getCssDimensions.js
+function getCssDimensions(element) {
+  const css = getComputedStyle(element);
+  let width = parseFloat(css.width) || 0;
+  let height = parseFloat(css.height) || 0;
+  const hasOffset = isHTMLElement(element);
+  const offsetWidth = hasOffset ? element.offsetWidth : width;
+  const offsetHeight = hasOffset ? element.offsetHeight : height;
+  const shouldFallback = round(width) !== offsetWidth || round(height) !== offsetHeight;
+  if (shouldFallback) {
+    width = offsetWidth;
+    height = offsetHeight;
+  }
+  return {
+    width,
+    height
+  };
+}
+
+export { getCssDimensions };

package/shadcn/lib/base-ui/_chunk-xxhqanfd.js

@@ -0,0 +1,16 @@
+// node_modules/.deno/@base-ui+react@1.4.1/node_modules/@base-ui/react/esm/internals/serializeValue.js
+function serializeValue(value) {
+  if (value == null) {
+    return "";
+  }
+  if (typeof value === "string") {
+    return value;
+  }
+  try {
+    return JSON.stringify(value);
+  } catch {
+    return String(value);
+  }
+}
+
+export { serializeValue };

package/shadcn/lib/base-ui/_chunk-y887e46p.js

@@ -0,0 +1,15 @@
+// node_modules/.deno/@base-ui+react@1.4.1/node_modules/@base-ui/react/esm/toolbar/root/ToolbarRootContext.js
+import * as React from "react";
+"use client";
+var ToolbarRootContext = /* @__PURE__ */ React.createContext(undefined);
+if (true)
+  ToolbarRootContext.displayName = "ToolbarRootContext";
+function useToolbarRootContext(optional) {
+  const context = React.useContext(ToolbarRootContext);
+  if (context === undefined && !optional) {
+    throw new Error("Base UI: ToolbarRootContext is missing. Toolbar parts must be placed within <Toolbar.Root>.");
+  }
+  return context;
+}
+
+export { useToolbarRootContext };

package/shadcn/lib/base-ui/_chunk-ymj1dpqg.js

@@ -0,0 +1,14 @@
+// node_modules/.deno/@base-ui+react@1.4.1/node_modules/@base-ui/react/esm/csp-provider/CSPContext.js
+import * as React from "react";
+"use client";
+var CSPContext = /* @__PURE__ */ React.createContext(undefined);
+if (true)
+  CSPContext.displayName = "CSPContext";
+var DEFAULT_CSP_CONTEXT_VALUE = {
+  disableStyleElements: false
+};
+function useCSPContext() {
+  return React.useContext(CSPContext) ?? DEFAULT_CSP_CONTEXT_VALUE;
+}
+
+export { useCSPContext };