@vuer-ai/vuer-uikit 0.0.100 → 0.0.101

package/src/dial/DialPanel.tsx

@@ -8,6 +8,7 @@ import {
   DialNumberInput,
   DialSelectInput,
   DialSliderInput,
+  DialTextInput,
   DialVec3Input,
   DialVectorInput,
 } from "./wrapped-inputs";
@@ -153,6 +154,7 @@ export const DialPanel: React.FC<DialSchemaRendererProps> = ({ schemas, groups:
         );
 
       case "string":
+      case "text":
         // If options are provided, use select
         if (options && options.length > 0) {
           return (
@@ -165,8 +167,16 @@ export const DialPanel: React.FC<DialSchemaRendererProps> = ({ schemas, groups:
             />
           );
         }
-        // For now, skip pure string inputs (could add text input later)
-        return null;
+        // Use text input for pure string values
+        return (
+          <DialTextInput
+            key={name}
+            name={name}
+            label={label}
+            placeholder={`Enter ${label.toLowerCase()}`}
+            labelPosition={labelPosition}
+          />
+        );
 
       default:
         return null;

package/src/dial/wrapped-inputs/DialInputs.tsx

@@ -11,6 +11,7 @@ import {
   Label,
   QuaternionInput,
   RadInput,
+  TextInput,
   TimeInput,
   Vec3Input,
   VectorInput,
@@ -399,3 +400,38 @@ export const DialTimeInput: React.FC<DialWrapperProps> = ({
     );
   }
 };
+
+// Dial-wrapped TextInput
+export const DialTextInput: React.FC<DialWrapperProps & { placeholder?: string }> = ({
+  name,
+  label,
+  size = "sm",
+  labelPosition,
+  placeholder,
+}) => {
+  const { getValue, setValue } = useDialSchema();
+  const value = (getValue(name) ?? "") as string;
+
+  if (labelPosition === "inline") {
+    return (
+      <TextInput
+        value={value}
+        onChange={(val) => setValue(name, val)}
+        size={size}
+        placeholder={placeholder}
+        prefix={label}
+      />
+    );
+  } else {
+    return (
+      <DialInputWrapper label={label}>
+        <TextInput 
+          value={value} 
+          onChange={(val) => setValue(name, val)} 
+          size={size} 
+          placeholder={placeholder}
+        />
+      </DialInputWrapper>
+    );
+  }
+};

package/src/dial/wrapped-inputs/index.ts

@@ -19,6 +19,7 @@ export {
   DialCmInput,
   DialInchInput,
   DialTimeInput,
+  DialTextInput,
 } from "./DialInputs";
 
 // Variable-dimension vector input

package/src/ui/inputs/index.tsx

@@ -3,3 +3,4 @@ export * from "./input-numbers";
 export * from "./color-input";
 export * from "./presets-input";
 export * from "./number-inputs";
+export * from "./text-input";

package/src/ui/inputs/text-input.tsx

@@ -0,0 +1,43 @@
+import { forwardRef } from "react";
+
+import { InputRoot, InputRootProps, InputSlot } from "./input";
+
+export interface TextInputProps extends Omit<InputRootProps, "type" | "value" | "onChange"> {
+  value?: string;
+  onChange?: (value: string) => void;
+  placeholder?: string;
+  prefix?: string;
+  suffix?: string;
+  maxLength?: number;
+}
+
+/**
+ * Text input component for string values.
+ * Provides a simple text input with optional prefix/suffix.
+ *
+ * @param value - The current text value
+ * @param onChange - Callback when text changes
+ * @param placeholder - Placeholder text
+ * @param prefix - Optional prefix text/icon
+ * @param suffix - Optional suffix text/icon
+ * @param maxLength - Maximum character length
+ */
+export const TextInput = forwardRef<HTMLInputElement, TextInputProps>(function TextInput(
+  { value = "", onChange, prefix, suffix, placeholder, maxLength, ...props },
+  ref,
+) {
+  return (
+    <InputRoot
+      ref={ref}
+      type="text"
+      value={value}
+      onChange={(e) => onChange?.(e.target.value)}
+      placeholder={placeholder}
+      maxLength={maxLength}
+      {...props}
+    >
+      {prefix && <InputSlot side="left">{prefix}</InputSlot>}
+      {suffix && <InputSlot side="right">{suffix}</InputSlot>}
+    </InputRoot>
+  );
+});

package/dist/{chunk-KXKEZ3MH.mjs → chunk-AJYO5W6O.mjs}

@@ -1,17 +1,17 @@
 import { useTimelineState } from './chunk-JWKOW2OV.mjs';
 import { useViewport } from './chunk-VPQ5SSY3.mjs';
+import { NavigationControls } from './chunk-5EXV5EWF.mjs';
 import { Tick } from './chunk-K22BEXUA.mjs';
 import { TimeRuleEventDot } from './chunk-OC4HRPZU.mjs';
 import { TimelineEvent } from './chunk-N6DSPSMM.mjs';
 import { TimelineProcessBar } from './chunk-CO6EASQO.mjs';
+import { rightWedgeClasses, leftWedgeClasses, TOTAL_DURATION } from './chunk-4U232QAX.mjs';
 import { LeftWedge, RightWedge } from './chunk-IR334P7F.mjs';
 import { WheelZoomContext } from './chunk-CIPI2V54.mjs';
 import { TreeSearchBar } from './chunk-73VF2W3D.mjs';
 import { TreeView } from './chunk-VQPJ7TLB.mjs';
 import { useTreeState, useTreeSearch } from './chunk-PC5DHSC4.mjs';
 import { CursorOverlay } from './chunk-SA5WKLYB.mjs';
-import { NavigationControls } from './chunk-5EXV5EWF.mjs';
-import { rightWedgeClasses, leftWedgeClasses, TOTAL_DURATION } from './chunk-4U232QAX.mjs';
 import { TooltipProvider } from './chunk-ZNPI2TYG.mjs';
 import { SyncScroll, SyncDragY, SyncScrollSlave } from './chunk-PDOFOJ4P.mjs';
 import { cn } from './chunk-HMN4IKTG.mjs';

package/dist/{chunk-K4I4YU6N.cjs → chunk-G7FYBSFO.cjs}

@@ -2,18 +2,18 @@
 
 var chunkWJL5HMO6_cjs = require('./chunk-WJL5HMO6.cjs');
 var chunkRJ7I6ZQK_cjs = require('./chunk-RJ7I6ZQK.cjs');
+var chunkLP3AGGRK_cjs = require('./chunk-LP3AGGRK.cjs');
 var chunk6TSA7KXX_cjs = require('./chunk-6TSA7KXX.cjs');
 var chunkMVAFOQ67_cjs = require('./chunk-MVAFOQ67.cjs');
 var chunkTUYG6BYZ_cjs = require('./chunk-TUYG6BYZ.cjs');
 var chunkYXFHJKNW_cjs = require('./chunk-YXFHJKNW.cjs');
+var chunkG2ZYONQO_cjs = require('./chunk-G2ZYONQO.cjs');
 var chunk5MNZYCN2_cjs = require('./chunk-5MNZYCN2.cjs');
 var chunkZ6UDRPC2_cjs = require('./chunk-Z6UDRPC2.cjs');
 var chunk55RSKLJ5_cjs = require('./chunk-55RSKLJ5.cjs');
 var chunkHAVTMZR3_cjs = require('./chunk-HAVTMZR3.cjs');
 var chunkEEGQLTSQ_cjs = require('./chunk-EEGQLTSQ.cjs');
 var chunk2J75MYQA_cjs = require('./chunk-2J75MYQA.cjs');
-var chunkLP3AGGRK_cjs = require('./chunk-LP3AGGRK.cjs');
-var chunkG2ZYONQO_cjs = require('./chunk-G2ZYONQO.cjs');
 var chunk2CZEFXEW_cjs = require('./chunk-2CZEFXEW.cjs');
 var chunkG5JZGNKY_cjs = require('./chunk-G5JZGNKY.cjs');
 var chunkOHIB3TEN_cjs = require('./chunk-OHIB3TEN.cjs');