@vuer-ai/vuer-uikit 0.0.88 → 0.0.89

package/dist/chunk-E4AGCYEF.mjs

@@ -0,0 +1,545 @@
+import { RadInput } from './chunk-3HUKXFD4.mjs';
+import { TimeInput } from './chunk-M7CWV3WR.mjs';
+import { Vec3Input } from './chunk-AXTZ2RY6.mjs';
+import { DegInput } from './chunk-XTE66VZ3.mjs';
+import { EulerDegInput } from './chunk-GMGAUN57.mjs';
+import { EulerInput } from './chunk-OBYDDCUD.mjs';
+import { InchInput } from './chunk-7YRIF5K4.mjs';
+import { IntInput } from './chunk-HOF7YOYS.mjs';
+import { QuaternionInput } from './chunk-J2RFARFN.mjs';
+import { VectorInput } from './chunk-EAQAIANE.mjs';
+import { CmInput } from './chunk-LQWJ34PD.mjs';
+import { Switch } from './chunk-AZBJB6KC.mjs';
+import { Label } from './chunk-42UBHC2D.mjs';
+import { Layout } from './chunk-FBPAIVBH.mjs';
+import { useDialSchema } from './chunk-WHRN67N6.mjs';
+import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
+
+var DialInputWrapper = ({ label, column = false, children }) => {
+  if (!label) {
+    return /* @__PURE__ */ jsx(Fragment, { children });
+  }
+  const orientation = column ? "horizontal" : "vertical";
+  return /* @__PURE__ */ jsxs(Layout, { orientation, align: "center", children: [
+    /* @__PURE__ */ jsx(Label, { size: "sm", children: label }),
+    /* @__PURE__ */ jsx(Fragment, { children })
+  ] });
+};
+var DialVec3Input = ({
+  name,
+  label,
+  size = "sm",
+  step,
+  column = false
+}) => {
+  const { getValue, setValue } = useDialSchema();
+  const value = getValue(name) ?? [0, 0, 0];
+  return /* @__PURE__ */ jsx(DialInputWrapper, { label, column, children: /* @__PURE__ */ jsx(
+    Vec3Input,
+    {
+      value,
+      onValuesChange: (val) => setValue(name, val),
+      size,
+      step
+    }
+  ) });
+};
+var DialEulerInput = ({
+  name,
+  label,
+  size = "sm",
+  step,
+  column = false
+}) => {
+  const { getValue, setValue } = useDialSchema();
+  const value = getValue(name) ?? [0, 0, 0];
+  return /* @__PURE__ */ jsx(DialInputWrapper, { label, column, children: /* @__PURE__ */ jsx(
+    EulerInput,
+    {
+      value,
+      onValuesChange: (val) => setValue(name, val),
+      size,
+      step
+    }
+  ) });
+};
+var DialEulerDegInput = ({
+  name,
+  label,
+  size = "sm",
+  step,
+  column = false
+}) => {
+  const { getValue, setValue } = useDialSchema();
+  const value = getValue(name) ?? [0, 0, 0];
+  return /* @__PURE__ */ jsx(DialInputWrapper, { label, column, children: /* @__PURE__ */ jsx(
+    EulerDegInput,
+    {
+      value,
+      onValuesChange: (val) => setValue(name, val),
+      size,
+      step
+    }
+  ) });
+};
+var DialQuaternionInput = ({
+  name,
+  label,
+  size = "sm",
+  step,
+  column = false
+}) => {
+  const { getValue, setValue } = useDialSchema();
+  const value = getValue(name) ?? [1, 0, 0, 0];
+  return /* @__PURE__ */ jsx(DialInputWrapper, { label, column, children: /* @__PURE__ */ jsx(
+    QuaternionInput,
+    {
+      value,
+      onValuesChange: (val) => setValue(name, val),
+      size,
+      step
+    }
+  ) });
+};
+var DialVectorInput = ({
+  name,
+  label,
+  size = "sm",
+  step,
+  dimensions = 3,
+  column = false
+}) => {
+  const { getValue, setValue } = useDialSchema();
+  const value = getValue(name) ?? new Array(dimensions).fill(0);
+  return /* @__PURE__ */ jsx(DialInputWrapper, { label, column, children: /* @__PURE__ */ jsx(
+    VectorInput,
+    {
+      value,
+      onValuesChange: (val) => setValue(name, val),
+      size,
+      step
+    }
+  ) });
+};
+var DialIntInput = ({
+  name,
+  label,
+  size = "sm",
+  step = 1,
+  column = false
+}) => {
+  const { getValue, setValue } = useDialSchema();
+  const value = getValue(name) ?? 0;
+  return /* @__PURE__ */ jsx(DialInputWrapper, { label, column, children: /* @__PURE__ */ jsx(
+    IntInput,
+    {
+      value,
+      onChange: (val) => setValue(name, val),
+      size,
+      step
+    }
+  ) });
+};
+var DialDegInput = ({
+  name,
+  label,
+  size = "sm",
+  step,
+  column = false
+}) => {
+  const { getValue, setValue } = useDialSchema();
+  const value = getValue(name) ?? 0;
+  return /* @__PURE__ */ jsx(DialInputWrapper, { label, column, children: /* @__PURE__ */ jsx(
+    DegInput,
+    {
+      value,
+      onChange: (val) => setValue(name, val),
+      size,
+      step
+    }
+  ) });
+};
+var DialRadInput = ({
+  name,
+  label,
+  size = "sm",
+  step,
+  column = false
+}) => {
+  const { getValue, setValue } = useDialSchema();
+  const value = getValue(name) ?? 0;
+  return /* @__PURE__ */ jsx(DialInputWrapper, { label, column, children: /* @__PURE__ */ jsx(
+    RadInput,
+    {
+      value,
+      onChange: (val) => setValue(name, val),
+      size,
+      step
+    }
+  ) });
+};
+var DialCmInput = ({
+  name,
+  label,
+  size = "sm",
+  step,
+  column = false
+}) => {
+  const { getValue, setValue } = useDialSchema();
+  const value = getValue(name) ?? 0;
+  return /* @__PURE__ */ jsx(DialInputWrapper, { label, column, children: /* @__PURE__ */ jsx(
+    CmInput,
+    {
+      value,
+      onChange: (val) => setValue(name, val),
+      size,
+      step
+    }
+  ) });
+};
+var DialInchInput = ({
+  name,
+  label,
+  size = "sm",
+  step,
+  column = false
+}) => {
+  const { getValue, setValue } = useDialSchema();
+  const value = getValue(name) ?? 0;
+  return /* @__PURE__ */ jsx(DialInputWrapper, { label, column, children: /* @__PURE__ */ jsx(
+    InchInput,
+    {
+      value,
+      onChange: (val) => setValue(name, val),
+      size,
+      step
+    }
+  ) });
+};
+var DialTimeInput = ({
+  name,
+  label,
+  size = "sm",
+  step,
+  column = false
+}) => {
+  const { getValue, setValue } = useDialSchema();
+  const value = getValue(name) ?? 0;
+  return /* @__PURE__ */ jsx(DialInputWrapper, { label, column, children: /* @__PURE__ */ jsx(
+    TimeInput,
+    {
+      value,
+      onChange: (val) => setValue(name, val),
+      size,
+      step
+    }
+  ) });
+};
+var DialVectorNInput = ({
+  name,
+  label,
+  column = false,
+  size = "sm"
+}) => {
+  const { getValue, setValue, schemas } = useDialSchema();
+  const schema = schemas.find((s) => s.name === name);
+  if (!schema) {
+    return null;
+  }
+  const value = getValue(name) || [];
+  const dimensions = schema.dimensions || schema.placeholders?.length || schema.dtypes?.length || (Array.isArray(value) ? value.length : 6);
+  const placeholders = schema.placeholders || [];
+  const dtypes = schema.dtypes || [];
+  const steps = schema.steps || [];
+  const tags = schema.tags || {};
+  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 vectorValue = Array.isArray(value) ? value.concat(Array(Math.max(0, dimensions - value.length)).fill(0)) : Array(dimensions).fill(0);
+  const inputSteps = Array.from({ length: dimensions }, (_, i) => {
+    if (steps[i] !== void 0) {
+      return steps[i];
+    }
+    const dtype = dtypes[i];
+    return dtype === "number-int" ? 1 : 0.01;
+  });
+  const labels = placeholders.length > 0 ? placeholders.map((p) => /* @__PURE__ */ jsx("span", { className: "text-xs", children: p })) : void 0;
+  const handleValuesChange = (newValues) => {
+    setValue(name, newValues);
+  };
+  const orientation = column ? "horizontal" : "vertical";
+  const inputComponent = /* @__PURE__ */ jsx(
+    VectorInput,
+    {
+      value: vectorValue,
+      onValuesChange: handleValuesChange,
+      size,
+      step: inputSteps,
+      labels,
+      gridAutoFlow,
+      columns: gridColumns,
+      rows: gridRows
+    }
+  );
+  if (!label) {
+    return inputComponent;
+  }
+  return /* @__PURE__ */ jsxs(Layout, { orientation, align: "start", children: [
+    /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-1", children: [
+      /* @__PURE__ */ jsx(Label, { size: "sm", children: label }),
+      schema.helpText && /* @__PURE__ */ jsx(
+        "span",
+        {
+          className: "text-xs text-gray-500 cursor-help",
+          title: schema.helpText,
+          children: "\u24D8"
+        }
+      )
+    ] }),
+    inputComponent
+  ] });
+};
+var DialPanel = ({ schemas }) => {
+  const groups = {};
+  const ungrouped = [];
+  schemas.forEach((schema) => {
+    const grouping = schema.tags?.grouping;
+    if (grouping) {
+      if (!groups[grouping]) {
+        groups[grouping] = [];
+      }
+      groups[grouping].push(schema);
+    } else {
+      ungrouped.push(schema);
+    }
+  });
+  const renderSchemaInput = (schema) => {
+    const { name, dtype, min, max, step, options, tags } = schema;
+    const column = tags?.col === true;
+    const label = name.charAt(0).toUpperCase() + name.slice(1);
+    switch (dtype) {
+      case "vector3":
+        return /* @__PURE__ */ jsx(DialVec3Input, { name, label, step, column }, name);
+      case "euler":
+        return /* @__PURE__ */ jsx(DialEulerDegInput, { name, label, step, column }, name);
+      case "vector":
+      case "vector-6":
+      case "number-group":
+        return /* @__PURE__ */ jsx(DialVectorNInput, { name, label, column }, name);
+      case "boolean":
+        return /* @__PURE__ */ jsx(DialBooleanInput, { name, label, col: column }, name);
+      case "number-int":
+        return /* @__PURE__ */ jsx(DialIntInput, { name, label, step: step || 1, column }, name);
+      case "number":
+        if (min !== void 0 && max !== void 0 && !options) {
+          return /* @__PURE__ */ jsx(
+            DialSliderInput,
+            {
+              name,
+              label,
+              min,
+              max,
+              step,
+              col: column
+            },
+            name
+          );
+        }
+        if (options && options.length > 0) {
+          return /* @__PURE__ */ jsx(DialSelectInput, { name, label, options, col: column }, name);
+        }
+        return /* @__PURE__ */ jsx(
+          DialNumberInput,
+          {
+            name,
+            label,
+            min,
+            max,
+            step,
+            col: column
+          },
+          name
+        );
+      case "string":
+        if (options && options.length > 0) {
+          return /* @__PURE__ */ jsx(DialSelectInput, { name, label, options, col: column }, name);
+        }
+        return null;
+      default:
+        return null;
+    }
+  };
+  return /* @__PURE__ */ jsxs("div", { className: "dial-schema-renderer space-y-4", children: [
+    Object.entries(groups).map(([groupName, groupSchemas]) => /* @__PURE__ */ jsxs("div", { className: "dial-group", children: [
+      /* @__PURE__ */ jsx("div", { className: "mb-2 font-medium", children: groupName }),
+      /* @__PURE__ */ jsx("div", { className: "dial-row flex flex-row gap-4 rounded-lg bg-gray-50 p-3", children: groupSchemas.map(renderSchemaInput) })
+    ] }, groupName)),
+    ungrouped.length > 0 && /* @__PURE__ */ jsx("div", { className: "dial-group", children: /* @__PURE__ */ jsx("div", { className: "dial-row flex flex-row gap-4 rounded-lg bg-gray-50 p-3", children: ungrouped.map(renderSchemaInput) }) })
+  ] });
+};
+var DialNumberInput = ({
+  name,
+  min,
+  max,
+  step = 1,
+  label,
+  col = false
+}) => {
+  const { getValue, setValue } = useDialSchema();
+  const value = getValue(name) ?? 0;
+  const containerClass = col ? "flex flex-col gap-1" : "flex flex-row gap-2 items-center";
+  return /* @__PURE__ */ jsxs("div", { className: containerClass, children: [
+    label && /* @__PURE__ */ jsx("label", { className: "text-sm font-medium text-gray-700", children: label || name }),
+    /* @__PURE__ */ jsx(
+      "input",
+      {
+        type: "number",
+        value,
+        min,
+        max,
+        step,
+        onChange: (e) => setValue(name, parseFloat(e.target.value)),
+        className: "px-2 py-1 border rounded-md text-sm"
+      }
+    )
+  ] });
+};
+var DialVectorInput2 = ({
+  name,
+  min,
+  max,
+  step = 0.1,
+  label,
+  col = false,
+  dimensions = 3
+}) => {
+  const { getValue, setValue } = useDialSchema();
+  const value = getValue(name) ?? new Array(dimensions).fill(0);
+  const handleChange = (index, newValue) => {
+    const updated = [...value];
+    updated[index] = newValue;
+    setValue(name, updated);
+  };
+  const containerClass = col ? "flex flex-col gap-2" : "flex flex-row gap-2 items-center";
+  const labels = ["x", "y", "z", "w"];
+  return /* @__PURE__ */ jsxs("div", { className: containerClass, children: [
+    label && /* @__PURE__ */ jsx("label", { className: "text-sm font-medium text-gray-700", children: label || name }),
+    /* @__PURE__ */ jsx("div", { className: "flex gap-2", children: value.map((v, i) => /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-1", children: [
+      /* @__PURE__ */ jsxs("span", { className: "text-xs text-gray-500", children: [
+        labels[i],
+        ":"
+      ] }),
+      /* @__PURE__ */ jsx(
+        "input",
+        {
+          type: "number",
+          value: v,
+          min,
+          max,
+          step,
+          onChange: (e) => handleChange(i, parseFloat(e.target.value)),
+          className: "w-20 px-2 py-1 border rounded-md text-sm"
+        }
+      )
+    ] }, i)) })
+  ] });
+};
+var DialBooleanInput = ({
+  name,
+  label,
+  col = false
+}) => {
+  const { getValue, setValue } = useDialSchema();
+  const value = getValue(name) ?? false;
+  const orientation = col ? "horizontal" : "vertical";
+  if (!label) {
+    return /* @__PURE__ */ jsx(
+      Switch,
+      {
+        checked: value,
+        onCheckedChange: (checked) => setValue(name, checked)
+      }
+    );
+  }
+  return /* @__PURE__ */ jsxs(Layout, { orientation, align: "center", children: [
+    /* @__PURE__ */ jsx(Label, { size: "sm", children: label || name }),
+    /* @__PURE__ */ jsx(
+      Switch,
+      {
+        checked: value,
+        onCheckedChange: (checked) => setValue(name, checked)
+      }
+    )
+  ] });
+};
+var DialSelectInput = ({
+  name,
+  options = [],
+  label,
+  col = false
+}) => {
+  const { getValue, setValue } = useDialSchema();
+  const value = getValue(name);
+  const containerClass = col ? "flex flex-col gap-1" : "flex flex-row gap-2 items-center";
+  return /* @__PURE__ */ jsxs("div", { className: containerClass, children: [
+    label && /* @__PURE__ */ jsx("label", { className: "text-sm font-medium text-gray-700", children: label || name }),
+    /* @__PURE__ */ jsx(
+      "select",
+      {
+        value,
+        onChange: (e) => {
+          const val = e.target.value;
+          const parsed = !isNaN(Number(val)) ? Number(val) : val;
+          setValue(name, parsed);
+        },
+        className: "px-2 py-1 border rounded-md text-sm",
+        children: options.map((opt, i) => /* @__PURE__ */ jsx("option", { value: opt, children: opt }, i))
+      }
+    )
+  ] });
+};
+var DialSliderInput = ({
+  name,
+  min = 0,
+  max = 100,
+  step = 1,
+  label,
+  col = false
+}) => {
+  const { getValue, setValue } = useDialSchema();
+  const value = getValue(name) ?? min;
+  const containerClass = col ? "flex flex-col gap-1" : "flex flex-row gap-2 items-center";
+  return /* @__PURE__ */ jsxs("div", { className: containerClass, children: [
+    label && /* @__PURE__ */ jsx("label", { className: "text-sm font-medium text-gray-700", children: label || name }),
+    /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2", children: [
+      /* @__PURE__ */ jsx(
+        "input",
+        {
+          type: "range",
+          value,
+          min,
+          max,
+          step,
+          onChange: (e) => setValue(name, parseFloat(e.target.value)),
+          className: "flex-1"
+        }
+      ),
+      /* @__PURE__ */ jsx("span", { className: "text-sm text-gray-600 w-12 text-right", children: value })
+    ] })
+  ] });
+};
+
+export { DialBooleanInput, DialCmInput, DialDegInput, DialEulerDegInput, DialEulerInput, DialInchInput, DialIntInput, DialNumberInput, DialPanel, DialQuaternionInput, DialRadInput, DialSelectInput, DialSliderInput, DialTimeInput, DialVec3Input, DialVectorInput2 as DialVectorInput, DialVectorInput as DialVectorInput2, DialVectorNInput };

package/dist/chunk-EAQAIANE.mjs

@@ -0,0 +1,20 @@
+import { InputNumbers } from './chunk-QAERXYKR.mjs';
+import { forwardRef } from 'react';
+import { jsx } from 'react/jsx-runtime';
+
+var VectorInput = forwardRef(function VectorInput2({ labels, prefix, gridAutoFlow, columns, rows, layout, columnMajor, ...props }, ref) {
+  return /* @__PURE__ */ jsx(
+    InputNumbers,
+    {
+      ref,
+      prefix: labels || prefix,
+      gridAutoFlow: gridAutoFlow || layout,
+      columns,
+      rows,
+      columnMajor,
+      ...props
+    }
+  );
+});
+
+export { VectorInput };

package/dist/{chunk-BGYHKHMQ.mjs → chunk-FBPAIVBH.mjs}

@@ -20,7 +20,7 @@ function Layout({
           "items-start": align === "start",
           "items-end": align === "end",
           "gap-xs flex flex-col items-stretch": orientation === "horizontal",
-          "gap-xs grid grid-cols-[1fr_2fr] text-center": orientation === "vertical"
+          "gap-xs grid text-center": orientation === "vertical"
         },
         className
       ),

package/dist/{chunk-TKV4YQPL.cjs → chunk-FR6JWEU4.cjs}

@@ -6,7 +6,7 @@ var jsxRuntime = require('react/jsx-runtime');
 
 var PACKAGE_VERSION = "0.0.88" ;
 var PACKAGE_NAME = "@vuer-ai/vuer-uikit" ;
-var GIT_HASH = "07a243e" ;
+var GIT_HASH = "6a176af" ;
 function PackageBadge({
   className,
   packageName,