@vuer-ai/vuer-uikit 0.0.119 → 0.0.121

package/dist/{chunk-DDU3SPCC.mjs → chunk-FUMJBAQI.mjs}

@@ -1,9 +1,13 @@
-import { cn } from './chunk-T66ETI7E.mjs';
+import { Button } from './chunk-5JYH7TXY.mjs';
+import { cn } from './chunk-HBEU2PU2.mjs';
 import { cva } from 'class-variance-authority';
-import { jsx } from 'react/jsx-runtime';
+import { ChevronDown, ChevronUp } from 'lucide-react';
+import { useState } from 'react';
+import { jsxs, jsx } from 'react/jsx-runtime';
 
 var cardVariants = cva(
   [
+    "relative",
     "flex",
     "flex-col",
     "rounded-uk-xl",
@@ -29,8 +33,57 @@ var cardVariants = cva(
     }
   }
 );
-function Card({ className, size, ...props }) {
-  return /* @__PURE__ */ jsx("div", { "data-slot": "card", className: cn(cardVariants({ size, className })), ...props });
+function Card({
+  className,
+  size,
+  collapsible,
+  collapsedContent,
+  defaultCollapsed = false,
+  children,
+  ...props
+}) {
+  const [isCollapsed, setIsCollapsed] = useState(defaultCollapsed);
+  if (collapsible) {
+    if (isCollapsed) {
+      return /* @__PURE__ */ jsxs(
+        "div",
+        {
+          "data-slot": "card",
+          className: cn(cardVariants({ size }), "flex-row justify-between", className),
+          ...props,
+          children: [
+            collapsedContent,
+            /* @__PURE__ */ jsx("div", { className: "right-lg absolute top-1/2 -translate-y-1/2", children: /* @__PURE__ */ jsx(
+              Button,
+              {
+                variant: "ghost",
+                size: "sm",
+                icon: true,
+                onClick: () => setIsCollapsed(false),
+                className: "hover:bg-shadow-secondary",
+                children: /* @__PURE__ */ jsx(ChevronDown, { strokeWidth: 1.5, className: "text-icon-primary size-4" })
+              }
+            ) })
+          ]
+        }
+      );
+    }
+    return /* @__PURE__ */ jsxs("div", { "data-slot": "card", className: cn(cardVariants({ size, className })), ...props, children: [
+      /* @__PURE__ */ jsx("div", { className: "right-lg top-lg absolute", children: /* @__PURE__ */ jsx(
+        Button,
+        {
+          variant: "ghost",
+          size: "sm",
+          icon: true,
+          onClick: () => setIsCollapsed(true),
+          className: "hover:bg-shadow-secondary",
+          children: /* @__PURE__ */ jsx(ChevronUp, { strokeWidth: 1.5, className: "text-icon-primary size-4" })
+        }
+      ) }),
+      children
+    ] });
+  }
+  return /* @__PURE__ */ jsx("div", { "data-slot": "card", className: cn(cardVariants({ size, className })), ...props, children });
 }
 var cardHeaderVariants = cva(["flex", "flex-row", "items-center", "justify-between"], {
   variants: {

package/dist/{chunk-4TYIH6V3.mjs → chunk-G45SP3DA.mjs}

@@ -1,26 +1,26 @@
-import { DialPresetsInput } from './chunk-LMYA5IOK.mjs';
-import { useDialSchema } from './chunk-ZTGJIGBC.mjs';
+import { DialPresetsInput } from './chunk-6ZLK2RYS.mjs';
+import { useDialSchema, DialProvider } from './chunk-ZTGJIGBC.mjs';
 import { IconRenderer } from './chunk-6YMDD5CU.mjs';
-import { TimeInput } from './chunk-ZJSL6HSL.mjs';
-import { Vec3Input } from './chunk-XTLGNJIO.mjs';
-import { DegInput } from './chunk-H6JGIEAU.mjs';
-import { EulerDegInput } from './chunk-7ACZU3BT.mjs';
-import { EulerInput } from './chunk-ZCSJGDX7.mjs';
-import { EulerRadInput } from './chunk-Y2XVZEXM.mjs';
-import { InchInput } from './chunk-JFPIUDGT.mjs';
-import { IntInput } from './chunk-3DIFS7CO.mjs';
-import { QuaternionInput } from './chunk-NJWKR5WR.mjs';
-import { VectorInput } from './chunk-3NIMV5PH.mjs';
-import { CmInput } from './chunk-REZAPK6Z.mjs';
-import { ColorInput } from './chunk-2GXIGEKC.mjs';
-import { RadInput } from './chunk-SCUMWMIN.mjs';
-import { InputNumbers } from './chunk-EVBYVJTW.mjs';
-import { TextInput } from './chunk-P3YSHGT5.mjs';
-import { Slider } from './chunk-WHV6Z7YX.mjs';
-import { Switch } from './chunk-OLYHHP67.mjs';
-import { Label } from './chunk-UIJEAY6H.mjs';
-import { FormLayout } from './chunk-RGOZPSTI.mjs';
-import { Select, SelectTrigger, SelectValue, SelectContent, SelectItem } from './chunk-IAFCABPY.mjs';
+import { TimeInput } from './chunk-BLG4IPRR.mjs';
+import { Vec3Input } from './chunk-XC25ZQ7H.mjs';
+import { EulerDegInput } from './chunk-XHNM6XE3.mjs';
+import { EulerInput } from './chunk-7MR3M2HW.mjs';
+import { EulerRadInput } from './chunk-ZQ2DPA2M.mjs';
+import { InchInput } from './chunk-LOMLR5AA.mjs';
+import { IntInput } from './chunk-YBUMQX6M.mjs';
+import { QuaternionInput } from './chunk-CEYNTMQP.mjs';
+import { VectorInput } from './chunk-HUPECWNG.mjs';
+import { CmInput } from './chunk-BDFUHPX2.mjs';
+import { DegInput } from './chunk-2KQXKQNU.mjs';
+import { RadInput } from './chunk-PC42NEBI.mjs';
+import { TextInput } from './chunk-P55DAW6H.mjs';
+import { ColorInput } from './chunk-IKSER6BF.mjs';
+import { InputNumbers } from './chunk-HGN7J4CP.mjs';
+import { Slider } from './chunk-XIESS6HW.mjs';
+import { Switch } from './chunk-RS4T6S3Z.mjs';
+import { Label } from './chunk-XTZURZIR.mjs';
+import { FormLayout } from './chunk-TMBHKVKH.mjs';
+import { Select, SelectTrigger, SelectValue, SelectContent, SelectItem } from './chunk-O5YP3JQ4.mjs';
 import { useCallback } from 'react';
 import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
 
@@ -514,25 +514,11 @@ var DialVectorInput2 = ({
   const steps = schema.steps || [];
   const mins = schema.mins || [];
   const maxs = schema.maxs || [];
-  const tags = schema.tags || {};
   const vectorValue = Array.isArray(value) ? value.concat(Array(Math.max(0, dimensions - value.length)).fill(0)) : Array(dimensions).fill(0);
   const hasMixedTypes = dtypes.some((dtype) => dtype === "boolean");
-  let gridAutoFlow;
-  let gridColumns;
-  let gridRows;
-  if (typeof tags.col === "number") {
-    gridAutoFlow = "column";
-    gridRows = tags.col;
-    gridColumns = void 0;
-  } else if (typeof tags.row === "number") {
-    gridAutoFlow = "row";
-    gridColumns = tags.row;
-    gridRows = void 0;
-  } else {
-    gridAutoFlow = "row";
-    gridColumns = void 0;
-    gridRows = void 0;
-  }
+  const gridAutoFlow = schema.vectorFlow === "column" ? "column" : "row";
+  const gridColumns = typeof schema.vectorCols === "number" ? schema.vectorCols : void 0;
+  const gridRows = typeof schema.vectorRows === "number" ? schema.vectorRows : void 0;
   if (hasMixedTypes) {
     const numberIndices = [];
     const booleanIndices = [];
@@ -658,6 +644,56 @@ var DialVectorInput2 = ({
     ] })
   ] });
 };
+var DialInterfaceInput = ({ name }) => {
+  const { getValue, setValue, schemas } = useDialSchema();
+  const values = getValue(name);
+  const handlePropertyChange = useCallback(
+    (propName, value) => {
+      const newValues = { ...values };
+      newValues[propName] = value;
+      setValue(name, newValues);
+    },
+    [name, setValue, values]
+  );
+  const schema = schemas.find((s) => s.name === name);
+  if (!schema || !schema.typeDefinition?.schemas) {
+    return null;
+  }
+  return /* @__PURE__ */ jsx(
+    DialProvider,
+    {
+      schemas: schema.typeDefinition.schemas,
+      values,
+      onValueChange: handlePropertyChange,
+      children: /* @__PURE__ */ jsx(
+        DialPanel,
+        {
+          schemas: schema.typeDefinition.schemas,
+          groups: schema.typeDefinition.groups,
+          labelLayout: schema.labelPosition
+        }
+      )
+    }
+  );
+};
+var generateGroupStyle = (config) => {
+  const layout = config?.layout ?? "grid";
+  if (layout === "grid") {
+    return {
+      display: "grid",
+      gap: "0.5rem",
+      gridAutoFlow: config?.gridFlow,
+      gridTemplateColumns: config?.gridColTemplate ? config.gridColTemplate : config?.gridCols ? `repeat(${config.gridCols}, 1fr)` : "1fr",
+      gridTemplateRows: config?.gridRowTemplate ? config.gridRowTemplate : config?.gridRows ? `repeat(${config.gridRows}, 1fr)` : void 0
+    };
+  }
+  return {
+    display: "flex",
+    gap: "0.5rem",
+    flexWrap: config?.flexWrap ?? "wrap",
+    justifyContent: config?.flexJustifyContent
+  };
+};
 var DialPanel = ({
   schemas,
   groups: groupConfigs,
@@ -669,19 +705,10 @@ var DialPanel = ({
       groupConfigMap[config.name] = config;
     });
   }
-  schemas.forEach((schema) => {
-    const grouping = schema.tags?.grouping;
-    if (grouping && !groupConfigMap[grouping]) {
-      groupConfigMap[grouping] = { name: grouping };
-    }
-    if (grouping && schema.tags?.noWrap && groupConfigMap[grouping]) {
-      groupConfigMap[grouping].noWrap = true;
-    }
-  });
   const groupedSchemas = {};
   const ungrouped = [];
   schemas.forEach((schema) => {
-    const grouping = schema.tags?.grouping;
+    const grouping = schema?.grouping;
     if (grouping) {
       if (!groupedSchemas[grouping]) {
         groupedSchemas[grouping] = [];
@@ -692,10 +719,13 @@ var DialPanel = ({
     }
   });
   const renderSchemaInput = (schema) => {
-    const { name, dtype, icon, min, max, step, options, tags } = schema;
-    const effectiveLabelPosition = tags?.labelPosition || labelLayout;
+    const { name, dtype, icon, min, max, step, options } = schema;
+    const effectiveLabelPosition = schema?.labelPosition || labelLayout;
     const label = schema.label || name.charAt(0).toUpperCase() + name.slice(1);
     switch (dtype) {
+      case "interface":
+      case "object":
+        return /* @__PURE__ */ jsx(DialInterfaceInput, { name });
       case "vector3":
         return /* @__PURE__ */ jsx(
           DialVec3Input,
@@ -835,6 +865,7 @@ var DialPanel = ({
         return /* @__PURE__ */ jsx(DialColorInput, { name, label, icon }, name);
       case "string":
       case "text":
+      case "select":
         if (options && options.length > 0) {
           return /* @__PURE__ */ jsx(
             DialSelectInput,
@@ -866,14 +897,13 @@ var DialPanel = ({
   return /* @__PURE__ */ jsxs("div", { className: "dial-schema-renderer space-y-4", children: [
     Object.entries(groupedSchemas).map(([name, schemaList]) => {
       const groupConfig = groupConfigMap[name];
-      const hasNoWrap = groupConfig?.noWrap;
-      const layoutClass = hasNoWrap ? "grid grid-cols-2 gap-2" : "flex flex-row gap-2";
+      const groupStyle = generateGroupStyle(groupConfig);
       return /* @__PURE__ */ jsxs("div", { className: "dial-group", children: [
-        /* @__PURE__ */ jsx("div", { className: "text-text-primary mb-2 font-medium", children: name }),
-        /* @__PURE__ */ jsx("div", { className: `dial-row ${layoutClass}`, children: schemaList.map(renderSchemaInput) })
+        /* @__PURE__ */ jsx("div", { className: "text-text-primary mb-2 font-medium capitalize", children: name }),
+        /* @__PURE__ */ jsx("div", { className: "dial-row", style: groupStyle, children: schemaList.map(renderSchemaInput) })
       ] }, name);
     }),
-    ungrouped.length > 0 && /* @__PURE__ */ jsx("div", { className: "dial-group", children: /* @__PURE__ */ jsx("div", { className: "dial-row grid grid-cols-3 gap-2", children: ungrouped.map(renderSchemaInput) }) })
+    ungrouped.length > 0 && /* @__PURE__ */ jsx("div", { className: "dial-group", children: /* @__PURE__ */ jsx("div", { className: "dial-row grid grid-cols-1 gap-2", children: ungrouped.map(renderSchemaInput) }) })
   ] });
 };
 var DialInputWrapper2 = ({ label, labelPosition = "top", icon, children }) => {
@@ -934,7 +964,7 @@ var DialBooleanInput = ({
 }) => {
   const { getValue, setValue } = useDialSchema();
   const value = getValue(name) ?? false;
-  const handleChange = useCallback((checked) => setValue(name, checked), [name]);
+  const handleChange = useCallback((checked) => setValue(name, checked), [name, setValue]);
   const switchProps = {
     checked: value,
     onCheckedChange: handleChange
@@ -949,7 +979,7 @@ var DialColorInput = ({ name, label, icon, ...props }) => {
   const value = getValue(name) ?? "";
   const handleChange = useCallback(
     (e) => setValue(name, e.target.value),
-    [name]
+    [name, setValue]
   );
   const inputComp = /* @__PURE__ */ jsx(ColorInput, { value, onChange: handleChange, prefix: label });
   return /* @__PURE__ */ jsx(DialInputWrapper2, { label, icon, ...props, children: inputComp });
@@ -969,7 +999,7 @@ var DialSelectInput = ({
       const parsed = !isNaN(Number(val)) ? Number(val) : val;
       setValue(name, parsed);
     },
-    [name]
+    [name, setValue]
   );
   const selectComponent = /* @__PURE__ */ jsxs(Select, { value: String(value), onValueChange: handleValueChange, children: [
     /* @__PURE__ */ jsx(SelectTrigger, { size, children: /* @__PURE__ */ jsx(SelectValue, { placeholder: "Select an option" }) }),
@@ -988,7 +1018,7 @@ var DialSliderInput = ({
 }) => {
   const { getValue, setValue } = useDialSchema();
   const value = getValue(name) ?? min;
-  const handleValueChange = useCallback(([val]) => setValue(name, val), [name]);
+  const handleValueChange = useCallback(([val]) => setValue(name, val), [name, setValue]);
   const sliderProps = {
     value: [value],
     onValueChange: handleValueChange,
@@ -1003,4 +1033,4 @@ var DialSliderInput = ({
   ] });
 };
 
-export { DialBooleanInput, DialCmInput, DialColorInput, DialDegInput, DialEulerDegInput, DialEulerInput, DialEulerRadInput, DialInchInput, DialIntInput, DialNumberInput, DialNumberRadInput, DialPanel, DialQuaternionInput, DialRadInput, DialSelectInput, DialSliderInput, DialTextInput, DialTimeInput, DialVec3Input, DialVectorInput, DialVectorInput2 };
+export { DialBooleanInput, DialCmInput, DialColorInput, DialDegInput, DialEulerDegInput, DialEulerInput, DialEulerRadInput, DialInchInput, DialIntInput, DialInterfaceInput, DialNumberInput, DialNumberRadInput, DialPanel, DialQuaternionInput, DialRadInput, DialSelectInput, DialSliderInput, DialTextInput, DialTimeInput, DialVec3Input, DialVectorInput, DialVectorInput2 };

package/dist/{chunk-HB65PF7F.cjs → chunk-GBRIW266.cjs}

@@ -1,12 +1,12 @@
 'use strict';
 
-var chunkLVIZRMYN_cjs = require('./chunk-LVIZRMYN.cjs');
+var chunkQF3JWGWX_cjs = require('./chunk-QF3JWGWX.cjs');
 var react = require('react');
 var jsxRuntime = require('react/jsx-runtime');
 
 var Vec3Input = react.forwardRef(function Vec3Input2({ value, onValuesChange, ...props }, ref) {
   return /* @__PURE__ */ jsxRuntime.jsx(
-    chunkLVIZRMYN_cjs.VectorInput,
+    chunkQF3JWGWX_cjs.VectorInput,
     {
       ref,
       value,

package/dist/{chunk-RPTRTGC2.cjs → chunk-GEGPGQVH.cjs}

@@ -1,38 +1,38 @@
 'use strict';
 
 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);
 
 // src/hooks/clientOnly.tsx
-function clientOnly(fn) {
-  if (typeof window !== "undefined") {
-    return fn();
+function ClientOnly({
+  children,
+  fallback = null
+}) {
+  const [hasMounted, setHasMounted] = React__default.default.useState(false);
+  React__default.default.useEffect(() => {
+    setHasMounted(true);
+  }, []);
+  if (!hasMounted) {
+    return /* @__PURE__ */ jsxRuntime.jsx(jsxRuntime.Fragment, { children: fallback });
   }
-  return void 0;
+  return /* @__PURE__ */ jsxRuntime.jsx(jsxRuntime.Fragment, { children });
 }
 function createClientOnlyComponent(Component, fallback) {
   return function ClientOnlyWrapper(props) {
-    const [isClient2, setIsClient] = React__default.default.useState(false);
+    const [isClient, setIsClient] = React__default.default.useState(false);
     React__default.default.useEffect(() => {
       setIsClient(true);
     }, []);
-    if (!isClient2) {
+    if (!isClient) {
       return fallback ? React__default.default.createElement(fallback, props) : null;
     }
     return React__default.default.createElement(Component, props);
   };
 }
-function isClient() {
-  return typeof window !== "undefined";
-}
-function isServer() {
-  return typeof window === "undefined";
-}
 
-exports.clientOnly = clientOnly;
+exports.ClientOnly = ClientOnly;
 exports.createClientOnlyComponent = createClientOnlyComponent;
-exports.isClient = isClient;
-exports.isServer = isServer;

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-XQ3MWA3D.mjs → chunk-GJKFQHUX.mjs}

@@ -1,6 +1,6 @@
-import { RadInput } from './chunk-SCUMWMIN.mjs';
-import { Button } from './chunk-4ODJAEOM.mjs';
-import { cn } from './chunk-T66ETI7E.mjs';
+import { RadInput } from './chunk-PC42NEBI.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-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 };

package/dist/{chunk-T66ETI7E.mjs → chunk-HBEU2PU2.mjs}

@@ -15,6 +15,10 @@ var twMerge = extendTailwindMerge({
       p: ["p-xxs", "p-xs", "p-sm", "p-md", "p-lg", "p-xl"],
       py: ["py-xxs", "py-xs", "py-sm", "py-md", "py-lg", "py-xl"],
       px: ["px-xxs", "px-xs", "px-sm", "px-md", "px-lg", "px-xl"],
+      pt: ["pt-xxs", "pt-xs", "pt-sm", "pt-md", "pt-lg", "pt-xl"],
+      pb: ["pb-xxs", "pb-xs", "pb-sm", "pb-md", "pb-lg", "pb-xl"],
+      pl: ["pl-xxs", "pl-xs", "pl-sm", "pl-md", "pl-lg", "pl-xl"],
+      pr: ["pr-xxs", "pr-xs", "pr-sm", "pr-md", "pr-lg", "pr-xl"],
       "font-size": [
         "text-uk-xs",
         "text-uk-sm",
@@ -22,7 +26,8 @@ var twMerge = extendTailwindMerge({
         "text-uk-lg",
         "text-uk-xl",
         "text-uk-xxl"
-      ]
+      ],
+      "text-color": ["text-text-primary", "text-text-highlight"]
     }
   }
 });

package/dist/{chunk-EVBYVJTW.mjs → chunk-HGN7J4CP.mjs}

@@ -1,5 +1,5 @@
-import { InputRoot, InputSlot } from './chunk-SMXN2KOV.mjs';
-import { cn } from './chunk-T66ETI7E.mjs';
+import { InputRoot, InputSlot } from './chunk-HGTL7DFT.mjs';
+import { cn } from './chunk-HBEU2PU2.mjs';
 import React, { forwardRef, useRef, useState, useCallback } from 'react';
 import { jsx, jsxs } from 'react/jsx-runtime';
 

package/dist/{chunk-SMXN2KOV.mjs → chunk-HGTL7DFT.mjs}

@@ -1,4 +1,4 @@
-import { cn } from './chunk-T66ETI7E.mjs';
+import { cn } from './chunk-HBEU2PU2.mjs';
 import { composeRefs } from '@radix-ui/react-compose-refs';
 import { cva } from 'class-variance-authority';
 import { forwardRef, useRef } from 'react';

package/dist/{chunk-QO2AM6MF.mjs → chunk-HIDTQ4Z2.mjs}

@@ -1,4 +1,4 @@
-import { cn } from './chunk-T66ETI7E.mjs';
+import { cn } from './chunk-HBEU2PU2.mjs';
 import * as CollapsiblePrimitive from '@radix-ui/react-collapsible';
 import { jsx } from 'react/jsx-runtime';
 

package/dist/{chunk-3NIMV5PH.mjs → chunk-HUPECWNG.mjs}

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