@vuer-ai/vuer-uikit 0.0.120 → 0.1.0

package/dist/chunk-DVUN6GQI.cjs

@@ -0,0 +1,21 @@
+'use strict';
+
+var react = require('react');
+
+// src/hooks/useIsMobile.ts
+var MOBILE_BREAKPOINT = 768;
+function useIsMobile() {
+  const [isMobile, setIsMobile] = react.useState(void 0);
+  react.useEffect(() => {
+    const mql = window.matchMedia(`(max-width: ${MOBILE_BREAKPOINT - 1}px)`);
+    const onChange = () => {
+      setIsMobile(window.innerWidth < MOBILE_BREAKPOINT);
+    };
+    mql.addEventListener("change", onChange);
+    setIsMobile(window.innerWidth < MOBILE_BREAKPOINT);
+    return () => mql.removeEventListener("change", onChange);
+  }, []);
+  return !!isMobile;
+}
+
+exports.useIsMobile = useIsMobile;

package/dist/{chunk-7ACZU3BT.mjs → chunk-EG6JETUN.mjs}

@@ -1,4 +1,4 @@
-import { EulerInput } from './chunk-ZCSJGDX7.mjs';
+import { EulerInput } from './chunk-L2DME42Q.mjs';
 import { forwardRef } from 'react';
 import { jsx } from 'react/jsx-runtime';
 

package/dist/{chunk-T4U3BG2V.mjs → chunk-EGJLY5VZ.mjs}

@@ -1,4 +1,4 @@
-import { cn } from './chunk-T66ETI7E.mjs';
+import { cn } from './chunk-HBEU2PU2.mjs';
 import { useSyncScroll, useScrollSlave, useSyncDrag } from './chunk-SAGQV2YZ.mjs';
 import { Slot } from '@radix-ui/react-slot';
 import { useState, useRef, useEffect } from 'react';

package/dist/{chunk-AE5YDMFT.mjs → chunk-EXM6QMNR.mjs}

@@ -1,6 +1,6 @@
-import { InputNumbers } from './chunk-EVBYVJTW.mjs';
-import { Button } from './chunk-4ODJAEOM.mjs';
-import { cn } from './chunk-T66ETI7E.mjs';
+import { InputNumbers } from './chunk-D2LUQKPM.mjs';
+import { Button } from './chunk-5JYH7TXY.mjs';
+import { cn } from './chunk-HBEU2PU2.mjs';
 import { forwardRef, useState } from 'react';
 import { jsxs, jsx } from 'react/jsx-runtime';
 

package/dist/{chunk-H6JGIEAU.mjs → chunk-EYMZP5PL.mjs}

@@ -1,4 +1,4 @@
-import { InputNumbers } from './chunk-EVBYVJTW.mjs';
+import { InputNumbers } from './chunk-D2LUQKPM.mjs';
 import { forwardRef } from 'react';
 import { jsx } from 'react/jsx-runtime';
 

package/dist/{chunk-K2ZYSKRU.mjs → chunk-EZ536NLQ.mjs}

@@ -1,5 +1,5 @@
 import { colorClasses } from './chunk-4U232QAX.mjs';
-import { cn } from './chunk-T66ETI7E.mjs';
+import { cn } from './chunk-HBEU2PU2.mjs';
 import { jsx } from 'react/jsx-runtime';
 
 function TimelineEvent({

package/dist/chunk-FRM27RLN.cjs

@@ -0,0 +1,264 @@
+'use strict';
+
+var chunkJ74A5LNZ_cjs = require('./chunk-J74A5LNZ.cjs');
+var chunk6LTCLQH3_cjs = require('./chunk-6LTCLQH3.cjs');
+var React = require('react');
+var jsxRuntime = require('react/jsx-runtime');
+
+function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
+
+var React__default = /*#__PURE__*/_interopDefault(React);
+
+function VirtualGridInner({
+  data,
+  rowCount,
+  columnCount,
+  rowHeight,
+  columnWidth,
+  height,
+  width = "100%",
+  overscanRows = 2,
+  overscanColumns = 2,
+  getCellKey,
+  getColSpan,
+  getRowSpan,
+  children,
+  stickyHeader = false,
+  stickyColumn = false,
+  className,
+  style,
+  ...props
+}, ref) {
+  const containerRef = React.useRef(null);
+  const stickyLayerRef = React.useRef(null);
+  const [scrollTop, setScrollTop] = React.useState(0);
+  const [scrollLeft, setScrollLeft] = React.useState(0);
+  const [containerWidth, setContainerWidth] = React.useState(0);
+  const [containerHeight, setContainerHeight] = React.useState(0);
+  const scrollRef = React.useRef({ top: 0, left: 0 });
+  const setRefs = React.useCallback(
+    (node) => {
+      containerRef.current = node;
+      if (typeof ref === "function") {
+        ref(node);
+      } else if (ref) {
+        ref.current = node;
+      }
+    },
+    [ref]
+  );
+  React.useEffect(() => {
+    const container = containerRef.current;
+    if (!container) return;
+    const resizeObserver = new ResizeObserver((entries) => {
+      for (const entry of entries) {
+        setContainerWidth(entry.contentRect.width);
+        setContainerHeight(entry.contentRect.height);
+      }
+    });
+    resizeObserver.observe(container);
+    setContainerWidth(container.clientWidth);
+    setContainerHeight(container.clientHeight);
+    return () => resizeObserver.disconnect();
+  }, []);
+  const {
+    visibleRange,
+    totalWidth,
+    totalHeight,
+    getCellStyle,
+    getRowOffset,
+    getColumnOffset,
+    getRowHeight,
+    getColumnWidth
+  } = chunkJ74A5LNZ_cjs.useVirtualGrid({
+    rowCount,
+    columnCount,
+    rowHeight,
+    columnWidth,
+    containerWidth,
+    containerHeight,
+    scrollTop,
+    scrollLeft,
+    overscanRows,
+    overscanColumns,
+    getColSpan,
+    getRowSpan
+  });
+  const rafRef = React.useRef(null);
+  const handleScroll = React.useCallback((e) => {
+    const newScrollTop = e.currentTarget.scrollTop;
+    const newScrollLeft = e.currentTarget.scrollLeft;
+    scrollRef.current = { top: newScrollTop, left: newScrollLeft };
+    if (stickyLayerRef.current) {
+      stickyLayerRef.current.style.setProperty("--scroll-top", `${Math.round(newScrollTop)}px`);
+      stickyLayerRef.current.style.setProperty("--scroll-left", `${Math.round(newScrollLeft)}px`);
+    }
+    if (rafRef.current) {
+      cancelAnimationFrame(rafRef.current);
+    }
+    rafRef.current = requestAnimationFrame(() => {
+      setScrollTop(newScrollTop);
+      setScrollLeft(newScrollLeft);
+    });
+  }, []);
+  React.useEffect(() => {
+    return () => {
+      if (rafRef.current) {
+        cancelAnimationFrame(rafRef.current);
+      }
+    };
+  }, []);
+  React.useLayoutEffect(() => {
+    if (stickyLayerRef.current) {
+      stickyLayerRef.current.style.setProperty("--scroll-top", "0px");
+      stickyLayerRef.current.style.setProperty("--scroll-left", "0px");
+    }
+  }, []);
+  const coveredCells = /* @__PURE__ */ new Set();
+  if (getColSpan || getRowSpan) {
+    for (let row = visibleRange.startRow; row <= visibleRange.endRow; row++) {
+      for (let col = visibleRange.startCol; col <= visibleRange.endCol; col++) {
+        const colspan = getColSpan?.(row, col) ?? 1;
+        const rowspan = getRowSpan?.(row, col) ?? 1;
+        if (colspan > 1 || rowspan > 1) {
+          for (let r = row; r < row + rowspan; r++) {
+            for (let c = col; c < col + colspan; c++) {
+              if (r !== row || c !== col) {
+                coveredCells.add(`${r}-${c}`);
+              }
+            }
+          }
+        }
+      }
+    }
+  }
+  const visibleCells = [];
+  for (let row = visibleRange.startRow; row <= visibleRange.endRow && row < rowCount; row++) {
+    for (let col = visibleRange.startCol; col <= visibleRange.endCol && col < columnCount; col++) {
+      if (coveredCells.has(`${row}-${col}`)) {
+        continue;
+      }
+      if (stickyHeader && row === 0 || stickyColumn && col === 0) {
+        continue;
+      }
+      const cellData = data[row]?.[col];
+      const key = getCellKey ? getCellKey(row, col) : `${row}-${col}`;
+      const cellStyle = getCellStyle(row, col);
+      visibleCells.push(
+        /* @__PURE__ */ jsxRuntime.jsx(React__default.default.Fragment, { children: children(cellData, row, col, cellStyle) }, key)
+      );
+    }
+  }
+  const stickyContentStyle = { width: "100%", height: "100%" };
+  const stickyHeaderCells = [];
+  if (stickyHeader && rowCount > 0) {
+    for (let col = visibleRange.startCol; col <= visibleRange.endCol && col < columnCount; col++) {
+      if (stickyColumn && col === 0) continue;
+      if (coveredCells.has(`0-${col}`)) continue;
+      const cellData = data[0]?.[col];
+      const key = getCellKey ? getCellKey(0, col) : `header-${col}`;
+      stickyHeaderCells.push(
+        /* @__PURE__ */ jsxRuntime.jsx(
+          "div",
+          {
+            className: "sticky-header-cell",
+            style: {
+              position: "absolute",
+              top: 0,
+              left: 0,
+              width: getColumnWidth(col),
+              height: getRowHeight(0),
+              transform: `translate3d(${getColumnOffset(col)}px, var(--scroll-top, 0px), 0)`,
+              willChange: "transform",
+              zIndex: 2
+            },
+            children: children(cellData, 0, col, stickyContentStyle)
+          },
+          key
+        )
+      );
+    }
+  }
+  const stickyColumnCells = [];
+  if (stickyColumn && columnCount > 0) {
+    for (let row = visibleRange.startRow; row <= visibleRange.endRow && row < rowCount; row++) {
+      if (stickyHeader && row === 0) continue;
+      if (coveredCells.has(`${row}-0`)) continue;
+      const cellData = data[row]?.[0];
+      const key = getCellKey ? getCellKey(row, 0) : `sticky-col-${row}`;
+      stickyColumnCells.push(
+        /* @__PURE__ */ jsxRuntime.jsx(
+          "div",
+          {
+            className: "sticky-column-cell",
+            style: {
+              position: "absolute",
+              top: 0,
+              left: 0,
+              width: getColumnWidth(0),
+              height: getRowHeight(row),
+              transform: `translate3d(var(--scroll-left, 0px), ${getRowOffset(row)}px, 0)`,
+              willChange: "transform",
+              zIndex: 2
+            },
+            children: children(cellData, row, 0, stickyContentStyle)
+          },
+          key
+        )
+      );
+    }
+  }
+  const stickyCornerCell = stickyHeader && stickyColumn && rowCount > 0 && columnCount > 0 ? /* @__PURE__ */ jsxRuntime.jsx(
+    "div",
+    {
+      className: "sticky-corner-cell",
+      style: {
+        position: "absolute",
+        top: 0,
+        left: 0,
+        width: getColumnWidth(0),
+        height: getRowHeight(0),
+        transform: `translate3d(var(--scroll-left, 0px), var(--scroll-top, 0px), 0)`,
+        willChange: "transform",
+        zIndex: 3
+      },
+      children: children(data[0]?.[0], 0, 0, stickyContentStyle)
+    },
+    "sticky-corner"
+  ) : null;
+  const hasStickyElements = stickyHeader || stickyColumn;
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    "div",
+    {
+      ref: setRefs,
+      className: chunk6LTCLQH3_cjs.cn("relative overflow-auto", className),
+      style: {
+        height,
+        width,
+        ...style
+      },
+      onScroll: handleScroll,
+      ...props,
+      children: /* @__PURE__ */ jsxRuntime.jsxs(
+        "div",
+        {
+          ref: hasStickyElements ? stickyLayerRef : void 0,
+          style: {
+            height: totalHeight,
+            width: totalWidth,
+            position: "relative"
+          },
+          children: [
+            stickyCornerCell,
+            stickyHeaderCells,
+            stickyColumnCells,
+            visibleCells
+          ]
+        }
+      )
+    }
+  );
+}
+var VirtualGrid = React.forwardRef(VirtualGridInner);
+
+exports.VirtualGrid = VirtualGrid;

package/dist/chunk-FTB337IJ.cjs

@@ -0,0 +1,143 @@
+'use strict';
+
+var chunkYDF6VWBW_cjs = require('./chunk-YDF6VWBW.cjs');
+var chunk6LTCLQH3_cjs = require('./chunk-6LTCLQH3.cjs');
+var react = require('react');
+var jsxRuntime = require('react/jsx-runtime');
+
+function VirtualListInner({
+  items,
+  itemHeight,
+  estimatedItemHeight = 40,
+  height = "100%",
+  overscan = 3,
+  getItemKey,
+  children,
+  onScroll,
+  onRangeChange,
+  className,
+  style,
+  ...props
+}, ref) {
+  const containerRef = react.useRef(null);
+  const [scrollTop, setScrollTop] = react.useState(0);
+  const [containerHeight, setContainerHeight] = react.useState(0);
+  const setRefs = react.useCallback(
+    (node) => {
+      containerRef.current = node;
+      if (typeof ref === "function") {
+        ref(node);
+      } else if (ref) {
+        ref.current = node;
+      }
+    },
+    [ref]
+  );
+  react.useEffect(() => {
+    const container = containerRef.current;
+    if (!container) return;
+    const resizeObserver = new ResizeObserver((entries) => {
+      for (const entry of entries) {
+        setContainerHeight(entry.contentRect.height);
+      }
+    });
+    resizeObserver.observe(container);
+    setContainerHeight(container.clientHeight);
+    return () => resizeObserver.disconnect();
+  }, []);
+  const { visibleRange, totalHeight, getItemStyle, measureItem } = chunkYDF6VWBW_cjs.useVirtualList({
+    items,
+    itemHeight,
+    estimatedItemHeight,
+    containerHeight,
+    overscan,
+    scrollTop
+  });
+  const handleScroll = react.useCallback(
+    (e) => {
+      const newScrollTop = e.currentTarget.scrollTop;
+      setScrollTop(newScrollTop);
+      onScroll?.(newScrollTop);
+    },
+    [onScroll]
+  );
+  const prevRangeRef = react.useRef({ start: -1, end: -1 });
+  react.useEffect(() => {
+    if (visibleRange.start !== prevRangeRef.current.start || visibleRange.end !== prevRangeRef.current.end) {
+      prevRangeRef.current = visibleRange;
+      onRangeChange?.(visibleRange.start, visibleRange.end);
+    }
+  }, [visibleRange, onRangeChange]);
+  const visibleItems = [];
+  const isDynamic = itemHeight === "dynamic";
+  const dynamicChildStyle = { width: "100%" };
+  for (let i = visibleRange.start; i <= visibleRange.end && i < items.length; i++) {
+    const item = items[i];
+    const key = getItemKey ? getItemKey(item, i) : i;
+    const itemStyle = getItemStyle(i);
+    visibleItems.push(
+      /* @__PURE__ */ jsxRuntime.jsx(
+        VirtualListItem,
+        {
+          index: i,
+          isDynamic,
+          measureItem,
+          style: itemStyle,
+          children: children(item, i, isDynamic ? dynamicChildStyle : itemStyle)
+        },
+        key
+      )
+    );
+  }
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    "div",
+    {
+      ref: setRefs,
+      className: chunk6LTCLQH3_cjs.cn("relative w-full overflow-auto", className),
+      style: {
+        height,
+        ...style
+      },
+      onScroll: handleScroll,
+      ...props,
+      children: /* @__PURE__ */ jsxRuntime.jsx(
+        "div",
+        {
+          style: {
+            height: totalHeight,
+            position: "relative",
+            width: "100%"
+          },
+          children: visibleItems
+        }
+      )
+    }
+  );
+}
+function VirtualListItem({
+  children,
+  index,
+  isDynamic,
+  measureItem,
+  style
+}) {
+  const itemRef = react.useRef(null);
+  react.useEffect(() => {
+    if (!isDynamic || !itemRef.current) return;
+    const resizeObserver = new ResizeObserver((entries) => {
+      for (const entry of entries) {
+        measureItem(index, entry.contentRect.height);
+      }
+    });
+    resizeObserver.observe(itemRef.current);
+    measureItem(index, itemRef.current.offsetHeight);
+    return () => resizeObserver.disconnect();
+  }, [index, isDynamic, measureItem]);
+  if (!isDynamic) {
+    return /* @__PURE__ */ jsxRuntime.jsx(jsxRuntime.Fragment, { children });
+  }
+  return /* @__PURE__ */ jsxRuntime.jsx("div", { ref: itemRef, style, children });
+}
+var VirtualList = react.forwardRef(VirtualListInner);
+
+exports.VirtualList = VirtualList;

package/dist/{chunk-7A5EMDZH.mjs → chunk-G35PQKU5.mjs}

@@ -1,9 +1,9 @@
+import { Tabs } from './chunk-2J466BYZ.mjs';
+import { Textarea } from './chunk-Y2IIKDRY.mjs';
+import { InputRoot } from './chunk-HGTL7DFT.mjs';
+import { SelectTrigger } from './chunk-4W7JKZVN.mjs';
+import { Button } from './chunk-5JYH7TXY.mjs';
 import { withCursor } from './chunk-RAHKRYQJ.mjs';
-import { Tabs } from './chunk-EOLUDKZ3.mjs';
-import { Textarea } from './chunk-RLTLA7VS.mjs';
-import { InputRoot } from './chunk-SMXN2KOV.mjs';
-import { SelectTrigger } from './chunk-IAFCABPY.mjs';
-import { Button } from './chunk-4ODJAEOM.mjs';
 
 // src/highlight-cursor/enhanced-components.tsx
 var CursorButton = withCursor(Button);

package/dist/{chunk-ZJSL6HSL.mjs → chunk-GAAP5JO4.mjs}

@@ -1,4 +1,4 @@
-import { InputNumbers } from './chunk-EVBYVJTW.mjs';
+import { InputNumbers } from './chunk-D2LUQKPM.mjs';
 import { forwardRef } from 'react';
 import { jsx } from 'react/jsx-runtime';
 

package/dist/chunk-GHQA7PER.mjs

@@ -0,0 +1,107 @@
+import { cn } from './chunk-HBEU2PU2.mjs';
+import * as SheetPrimitive from '@radix-ui/react-dialog';
+import { XIcon } from 'lucide-react';
+import { jsx, jsxs } from 'react/jsx-runtime';
+
+function Sheet({ ...props }) {
+  return /* @__PURE__ */ jsx(SheetPrimitive.Root, { "data-slot": "sheet", ...props });
+}
+function SheetTrigger({ ...props }) {
+  return /* @__PURE__ */ jsx(SheetPrimitive.Trigger, { "data-slot": "sheet-trigger", ...props });
+}
+function SheetClose({ ...props }) {
+  return /* @__PURE__ */ jsx(SheetPrimitive.Close, { "data-slot": "sheet-close", ...props });
+}
+function SheetPortal({ ...props }) {
+  return /* @__PURE__ */ jsx(SheetPrimitive.Portal, { "data-slot": "sheet-portal", ...props });
+}
+function SheetOverlay({ className, ...props }) {
+  return /* @__PURE__ */ jsx(
+    SheetPrimitive.Overlay,
+    {
+      "data-slot": "sheet-overlay",
+      className: cn(
+        "data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 bg-bg-mask fixed inset-0 z-50",
+        className
+      ),
+      ...props
+    }
+  );
+}
+function SheetContent({
+  className,
+  children,
+  side = "right",
+  ...props
+}) {
+  return /* @__PURE__ */ jsxs(SheetPortal, { children: [
+    /* @__PURE__ */ jsx(SheetOverlay, {}),
+    /* @__PURE__ */ jsxs(
+      SheetPrimitive.Content,
+      {
+        "data-slot": "sheet-content",
+        className: cn(
+          "liquid-dark:liquid-dark-bg liquid-light:liquid-light-bg bg-bg-primary data-[state=open]:animate-in data-[state=closed]:animate-out fixed z-50 flex flex-col gap-4 shadow-lg transition ease-in-out data-[state=closed]:duration-300 data-[state=open]:duration-500",
+          side === "right" && "data-[state=closed]:slide-out-to-right data-[state=open]:slide-in-from-right inset-y-0 right-0 h-full w-3/4 border-l sm:max-w-sm",
+          side === "left" && "data-[state=closed]:slide-out-to-left data-[state=open]:slide-in-from-left inset-y-0 left-0 h-full w-3/4 border-r sm:max-w-sm",
+          side === "top" && "data-[state=closed]:slide-out-to-top data-[state=open]:slide-in-from-top inset-x-0 top-0 h-auto border-b",
+          side === "bottom" && "data-[state=closed]:slide-out-to-bottom data-[state=open]:slide-in-from-bottom inset-x-0 bottom-0 h-auto border-t",
+          className
+        ),
+        ...props,
+        children: [
+          children,
+          /* @__PURE__ */ jsxs(SheetPrimitive.Close, { className: "ring-offset-bg-primary focus:ring-bg-mask data-[state=open]:bg-bg-secondary absolute top-4 right-4 rounded-xs opacity-70 transition-opacity hover:opacity-100 focus:ring-2 focus:ring-offset-2 focus:outline-hidden disabled:pointer-events-none", children: [
+            /* @__PURE__ */ jsx(XIcon, { className: "size-4" }),
+            /* @__PURE__ */ jsx("span", { className: "sr-only", children: "Close" })
+          ] })
+        ]
+      }
+    )
+  ] });
+}
+function SheetHeader({ className, ...props }) {
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      "data-slot": "sheet-header",
+      className: cn("gap-md pb-xl flex flex-col", className),
+      ...props
+    }
+  );
+}
+function SheetFooter({ className, ...props }) {
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      "data-slot": "sheet-footer",
+      className: cn("gap-lg pt-xl mt-auto flex flex-col", className),
+      ...props
+    }
+  );
+}
+function SheetTitle({ className, ...props }) {
+  return /* @__PURE__ */ jsx(
+    SheetPrimitive.Title,
+    {
+      "data-slot": "sheet-title",
+      className: cn("text-text-highlight text-uk-xl leading-uk-xl font-medium", className),
+      ...props
+    }
+  );
+}
+function SheetDescription({
+  className,
+  ...props
+}) {
+  return /* @__PURE__ */ jsx(
+    SheetPrimitive.Description,
+    {
+      "data-slot": "sheet-description",
+      className: cn("text-text-secondary text-uk-md leading-uk-md", className),
+      ...props
+    }
+  );
+}
+
+export { Sheet, SheetClose, SheetContent, SheetDescription, SheetFooter, SheetHeader, SheetTitle, SheetTrigger };

package/dist/{chunk-ND3WJ63Z.cjs → chunk-GVRVRBDU.cjs}

@@ -1,6 +1,6 @@
 'use strict';
 
-var chunkCRX2ZCM2_cjs = require('./chunk-CRX2ZCM2.cjs');
+var chunk6LTCLQH3_cjs = require('./chunk-6LTCLQH3.cjs');
 var TogglePrimitive = require('@radix-ui/react-toggle');
 var classVarianceAuthority = require('class-variance-authority');
 var jsxRuntime = require('react/jsx-runtime');
@@ -100,7 +100,7 @@ function Toggle({
     TogglePrimitive__namespace.Root,
     {
       "data-slot": "toggle",
-      className: chunkCRX2ZCM2_cjs.cn(toggleVariants({ variant, size, className })),
+      className: chunk6LTCLQH3_cjs.cn(toggleVariants({ variant, size, className })),
       ...props
     }
   );

package/dist/chunk-GZ2BG42R.mjs

@@ -0,0 +1,34 @@
+import { LiquidLayout, LiquidLayoutContent, LiquidLayoutBottom, LiquidLayoutRight, LiquidLayoutTop, LiquidLayoutLeft } from './chunk-YMMSHGYC.mjs';
+import { jsxs, jsx } from 'react/jsx-runtime';
+
+var LiquidLayoutView = ({
+  left,
+  right,
+  top,
+  bottom,
+  children,
+  className,
+  leftClassName,
+  rightClassName,
+  topClassName,
+  bottomClassName,
+  contentClassName,
+  hideUI = false
+}) => {
+  const uiVisibilityClass = hideUI ? "invisible pointer-events-none" : "";
+  return /* @__PURE__ */ jsxs(LiquidLayout, { className, children: [
+    /* @__PURE__ */ jsx(
+      LiquidLayoutContent,
+      {
+        className: `absolute inset-0 z-0 flex flex-col items-center justify-center ${contentClassName || ""}`,
+        children
+      }
+    ),
+    bottom && /* @__PURE__ */ jsx(LiquidLayoutBottom, { className: `z-20 mt-4 ${bottomClassName || ""} ${uiVisibilityClass}`, children: bottom }),
+    right && /* @__PURE__ */ jsx(LiquidLayoutRight, { className: `z-20 max-w-75 ${rightClassName || ""} ${uiVisibilityClass}`, children: right }),
+    top && /* @__PURE__ */ jsx(LiquidLayoutTop, { className: `z-20 ${topClassName || ""} ${uiVisibilityClass}`, children: top }),
+    left && /* @__PURE__ */ jsx(LiquidLayoutLeft, { className: `z-20 max-w-75 ${leftClassName || ""} ${uiVisibilityClass}`, children: left })
+  ] });
+};
+
+export { LiquidLayoutView };

package/dist/chunk-H3JRYX2U.mjs

@@ -0,0 +1,19 @@
+import { useState, useEffect } from 'react';
+
+// src/hooks/useIsMobile.ts
+var MOBILE_BREAKPOINT = 768;
+function useIsMobile() {
+  const [isMobile, setIsMobile] = useState(void 0);
+  useEffect(() => {
+    const mql = window.matchMedia(`(max-width: ${MOBILE_BREAKPOINT - 1}px)`);
+    const onChange = () => {
+      setIsMobile(window.innerWidth < MOBILE_BREAKPOINT);
+    };
+    mql.addEventListener("change", onChange);
+    setIsMobile(window.innerWidth < MOBILE_BREAKPOINT);
+    return () => mql.removeEventListener("change", onChange);
+  }, []);
+  return !!isMobile;
+}
+
+export { useIsMobile };