@process.co/ui 0.0.17 → 0.0.19

package/css/ui.css

@@ -193,6 +193,9 @@
   .uii\:left-2 {
     left: calc(var(--uii-spacing) * 2);
   }
+  .uii\:z-20 {
+    z-index: 20;
+  }
   .uii\:z-50 {
     z-index: 50;
   }
@@ -1121,6 +1124,9 @@
   .uii\:min-h-\[56px\] {
     min-height: 56px;
   }
+  .uii\:w-8 {
+    width: calc(var(--uii-spacing) * 8);
+  }
   .uii\:w-\[28px\] {
     width: 28px;
   }
@@ -1169,6 +1175,9 @@
   .uii\:scroll-my-1 {
     scroll-margin-block: calc(var(--uii-spacing) * 1);
   }
+  .uii\:flex-row {
+    flex-direction: row;
+  }
   .uii\:flex-wrap {
     flex-wrap: wrap;
   }
@@ -1181,6 +1190,9 @@
   .uii\:justify-center {
     justify-content: center;
   }
+  .uii\:justify-start {
+    justify-content: flex-start;
+  }
   .uii\:gap-1\.5 {
     gap: calc(var(--uii-spacing) * 1.5);
   }
@@ -1245,6 +1257,10 @@
     border-left-style: var(--tw-border-style);
     border-left-width: 10px;
   }
+  .uii\:border-dashed {
+    --tw-border-style: dashed;
+    border-style: dashed;
+  }
   .uii\:border-none {
     --tw-border-style: none;
     border-style: none;
@@ -1258,9 +1274,15 @@
   .uii\:border-amber-500\/50 {
     border-color: color-mix(in oklab, oklch(76.9% 0.188 70.08) 50%, transparent);
   }
+  .uii\:border-gray-300 {
+    border-color: oklch(87.2% 0.01 258.338);
+  }
   .uii\:border-input {
     border-color: var(--input);
   }
+  .uii\:border-primary {
+    border-color: var(--primary);
+  }
   .uii\:border-purple-200 {
     border-color: oklch(90.2% 0.063 306.703);
   }
@@ -1333,6 +1355,9 @@
   .uii\:fill-current {
     fill: currentcolor;
   }
+  .uii\:object-contain {
+    object-fit: contain;
+  }
   .uii\:p-1 {
     padding: calc(var(--uii-spacing) * 1);
   }

package/dist/components/fields/index.cjs

@@ -3101,7 +3101,10 @@ function Input({
   required = false,
   hasRequiredError = false,
   className,
-  editorClassName
+  editorClassName,
+  showCaseSensitivity = false,
+  caseSensitive = false,
+  onCaseSensitiveChange
 }) {
   const devCtx = React33.useContext(DevContext);
   const resolvedExpectedType = useResolvedExpectedType(expectedType, devCtx);
@@ -3114,17 +3117,10 @@ function Input({
   const isExpression = React33__namespace.useMemo(() => {
     return value != null && typeof value === "object" && "expression" in value;
   }, [value]);
-  const handleChange = React33__namespace.useCallback((e) => {
-    const newValue = e.target.value;
-    if (newValue.includes("{{")) {
-      onChange({
-        expression: newValue,
-        type: "expression"
-      });
-    } else {
-      onChange(newValue);
-    }
-  }, [onChange]);
+  const handleChange = React33__namespace.useCallback(
+    (e) => onChange(e.target.value),
+    [onChange]
+  );
   const showError = hasRequiredError || required && !displayValue;
   const isWaiting = resolvedExpectedType.startsWith("Waiting for:") || resolvedExpectedType.startsWith("Subscribing to:");
   return /* @__PURE__ */ React33__namespace.createElement("div", { className: cn("uii:mb-2", className) }, /* @__PURE__ */ React33__namespace.createElement("div", { className: "uii:flex uii:items-center uii:gap-2 uii:mt-2" }, /* @__PURE__ */ React33__namespace.createElement(
@@ -3145,7 +3141,19 @@ function Input({
       title: resolvedExpectedType
     },
     resolvedExpectedType
-  ), showError && /* @__PURE__ */ React33__namespace.createElement("span", { className: "uii:-mt-2 uii:inline-flex uii:px-1 uii:py-0.5 uii:bg-red-100 uii:text-red-600 uii:rounded-sm uii:text-[10px] uii:font-medium" }, "Required")), /* @__PURE__ */ React33__namespace.createElement("div", { className: "uii:mt-0.5" }, /* @__PURE__ */ React33__namespace.createElement(
+  ), showError && /* @__PURE__ */ React33__namespace.createElement("span", { className: "uii:-mt-2 uii:inline-flex uii:px-1 uii:py-0.5 uii:bg-red-100 uii:text-red-600 uii:rounded-sm uii:text-[10px] uii:font-medium" }, "Required"), showCaseSensitivity && onCaseSensitiveChange && /* @__PURE__ */ React33__namespace.createElement(
+    "button",
+    {
+      type: "button",
+      title: caseSensitive ? "Case sensitive (click to ignore case)" : "Ignore case (click for case sensitive)",
+      onClick: () => onCaseSensitiveChange(!caseSensitive),
+      className: cn(
+        "uii:-mt-2 uii:inline-flex uii:items-center uii:justify-center uii:rounded-sm uii:border uii:px-1 uii:py-0.5 uii:text-[10px] uii:font-medium uii:transition-colors uii:outline-none focus:uii:ring-2 focus:uii:ring-ring focus:uii:ring-offset-1",
+        caseSensitive ? "uii:bg-primary uii:text-primary-foreground uii:border-primary" : "uii:bg-gray-200 uii:text-muted-foreground uii:border-input hover:uii:bg-gray-300"
+      )
+    },
+    "Aa"
+  )), /* @__PURE__ */ React33__namespace.createElement("div", { className: "uii:mt-0.5" }, /* @__PURE__ */ React33__namespace.createElement(
     "input",
     {
       id: fieldName,
@@ -8437,14 +8445,14 @@ function Select3({
     }
     onChange(newValue);
   }, [onChange]);
-  const handleExpressionChange = React33__namespace.useCallback((e) => {
-    const newValue = e.target.value;
-    setExpressionValue(newValue);
-    onChange({
-      expression: newValue,
-      type: "expression"
-    });
-  }, [onChange]);
+  const handleExpressionChange = React33__namespace.useCallback(
+    (e) => {
+      const newValue = e.target.value;
+      setExpressionValue(newValue);
+      onChange(newValue);
+    },
+    [onChange]
+  );
   const handleSwitchToValue = React33__namespace.useCallback(() => {
     setIsExpressionMode(false);
     setExpressionValue("");