@rebasepro/ui 0.2.5 → 0.4.0

package/dist/index.umd.js

@@ -3182,49 +3182,80 @@
     small: "px-2 py-0.5 text-xs",
     medium: "px-2.5 py-1 text-xs"
   };
-  function FilterChip(t0) {
-    const $ = reactCompilerRuntime.c(11);
-    const {
-      children,
-      active: t1,
-      onClick,
-      icon,
-      size: t2,
-      className,
-      disabled: t3
-    } = t0;
+  const FilterChip = React.forwardRef(function FilterChip2(t0, ref) {
+    const $ = reactCompilerRuntime.c(22);
+    let children;
+    let className;
+    let icon;
+    let onClick;
+    let rest;
+    let t1;
+    let t2;
+    let t3;
+    if ($[0] !== t0) {
+      ({
+        children,
+        active: t1,
+        onClick,
+        icon,
+        size: t2,
+        className,
+        disabled: t3,
+        ...rest
+      } = t0);
+      $[0] = t0;
+      $[1] = children;
+      $[2] = className;
+      $[3] = icon;
+      $[4] = onClick;
+      $[5] = rest;
+      $[6] = t1;
+      $[7] = t2;
+      $[8] = t3;
+    } else {
+      children = $[1];
+      className = $[2];
+      icon = $[3];
+      onClick = $[4];
+      rest = $[5];
+      t1 = $[6];
+      t2 = $[7];
+      t3 = $[8];
+    }
     const active = t1 === void 0 ? false : t1;
     const size = t2 === void 0 ? "medium" : t2;
     const disabled = t3 === void 0 ? false : t3;
     const t4 = sizeClasses[size];
     let t5;
-    if ($[0] !== active || $[1] !== className || $[2] !== disabled || $[3] !== t4) {
+    if ($[9] !== active || $[10] !== className || $[11] !== disabled || $[12] !== t4) {
       t5 = cls("inline-flex items-center gap-1 rounded-full", "font-medium whitespace-nowrap select-none shrink-0", "transition-all duration-150", "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-primary/50", t4, active ? "bg-primary/12 text-primary dark:bg-primary/20 dark:text-primary shadow-[inset_0_0_0_1.5px_var(--color-primary)]" : cls("bg-surface-accent-100 text-text-secondary dark:bg-surface-accent-800 dark:text-text-secondary-dark", !disabled && "cursor-pointer hover:bg-surface-accent-200 dark:hover:bg-surface-accent-700"), disabled && "opacity-50 cursor-not-allowed", className);
-      $[0] = active;
-      $[1] = className;
-      $[2] = disabled;
-      $[3] = t4;
-      $[4] = t5;
+      $[9] = active;
+      $[10] = className;
+      $[11] = disabled;
+      $[12] = t4;
+      $[13] = t5;
     } else {
-      t5 = $[4];
+      t5 = $[13];
     }
     let t6;
-    if ($[5] !== children || $[6] !== disabled || $[7] !== icon || $[8] !== onClick || $[9] !== t5) {
-      t6 = /* @__PURE__ */ jsxRuntime.jsxs("button", { type: "button", onClick, disabled, className: t5, children: [
+    if ($[14] !== children || $[15] !== disabled || $[16] !== icon || $[17] !== onClick || $[18] !== ref || $[19] !== rest || $[20] !== t5) {
+      t6 = /* @__PURE__ */ jsxRuntime.jsxs("button", { ref, type: "button", onClick, disabled, className: t5, ...rest, children: [
         icon,
         children
       ] });
-      $[5] = children;
-      $[6] = disabled;
-      $[7] = icon;
-      $[8] = onClick;
-      $[9] = t5;
-      $[10] = t6;
+      $[14] = children;
+      $[15] = disabled;
+      $[16] = icon;
+      $[17] = onClick;
+      $[18] = ref;
+      $[19] = rest;
+      $[20] = t5;
+      $[21] = t6;
     } else {
-      t6 = $[10];
+      t6 = $[21];
     }
     return t6;
-  }
+  });
   const colorClasses = {
     info: "bg-sky-200 dark:bg-teal-900",
     warn: "bg-orange-200 dark:bg-yellow-950"
@@ -7553,73 +7584,59 @@
   });
   Badge.displayName = "Badge";
   function DebouncedTextField(props) {
-    const $ = reactCompilerRuntime.c(13);
-    const previousEventRef = React.useRef(void 0);
-    const [internalValue, setInternalValue] = React.useState(props.value);
-    const deferredValue = React.useDeferredValue(internalValue);
-    let t0;
-    let t1;
-    if ($[0] !== props.value) {
-      t0 = () => {
-        setInternalValue(props.value);
+    const [internalValue, setInternalValue] = React.useState(props.value ?? "");
+    const lastSentValueRef = React.useRef(props.value ?? "");
+    const timerRef = React.useRef(void 0);
+    React.useEffect(() => {
+      const externalValue = props.value ?? "";
+      if (externalValue !== lastSentValueRef.current) {
+        setInternalValue(externalValue);
+        lastSentValueRef.current = externalValue;
+      }
+    }, [props.value]);
+    React.useEffect(() => {
+      return () => {
+        if (timerRef.current) clearTimeout(timerRef.current);
       };
-      t1 = [props.value];
-      $[0] = props.value;
-      $[1] = t0;
-      $[2] = t1;
-    } else {
-      t0 = $[1];
-      t1 = $[2];
-    }
-    React.useEffect(t0, t1);
-    let t2;
-    if ($[3] !== deferredValue || $[4] !== props) {
-      t2 = () => {
-        const emptyInitialValue = !props.value;
-        if (emptyInitialValue && !deferredValue) {
-          return;
-        }
-        if (deferredValue !== props.value && previousEventRef.current && props.onChange) {
-          props.onChange(previousEventRef.current);
+    }, []);
+    const flushChange = React.useCallback((value, event) => {
+      if (timerRef.current) {
+        clearTimeout(timerRef.current);
+        timerRef.current = void 0;
+      }
+      if (value !== props.value && props.onChange) {
+        lastSentValueRef.current = value;
+        const e = {
+          ...event,
+          target: {
+            ...event?.target,
+            value,
+            name: props.name
+          }
+        };
+        props.onChange(e);
+      }
+    }, [props.value, props.onChange, props.name]);
+    const internalOnChange = React.useCallback((event_0) => {
+      const newValue = event_0.target.value;
+      setInternalValue(newValue);
+      if (timerRef.current) clearTimeout(timerRef.current);
+      const eventCopy = {
+        ...event_0,
+        target: {
+          ...event_0?.target,
+          name: event_0?.target?.name
         }
       };
-      $[3] = deferredValue;
-      $[4] = props;
-      $[5] = t2;
-    } else {
-      t2 = $[5];
-    }
-    let t3;
-    if ($[6] !== deferredValue || $[7] !== props.value) {
-      t3 = [deferredValue, props.value];
-      $[6] = deferredValue;
-      $[7] = props.value;
-      $[8] = t3;
-    } else {
-      t3 = $[8];
-    }
-    React.useEffect(t2, t3);
-    let t4;
-    if ($[9] === /* @__PURE__ */ Symbol.for("react.memo_cache_sentinel")) {
-      t4 = (event) => {
-        previousEventRef.current = event;
-        setInternalValue(event.target.value);
-      };
-      $[9] = t4;
-    } else {
-      t4 = $[9];
-    }
-    const internalOnChange = t4;
-    let t5;
-    if ($[10] !== internalValue || $[11] !== props) {
-      t5 = /* @__PURE__ */ jsxRuntime.jsx(TextField, { ...props, onChange: internalOnChange, value: internalValue });
-      $[10] = internalValue;
-      $[11] = props;
-      $[12] = t5;
-    } else {
-      t5 = $[12];
-    }
-    return t5;
+      timerRef.current = setTimeout(() => {
+        flushChange(newValue, eventCopy);
+      }, 150);
+    }, [flushChange]);
+    const internalOnBlur = React.useCallback((event_1) => {
+      flushChange(internalValue, event_1);
+      props.onBlur?.(event_1);
+    }, [internalValue, flushChange, props.onBlur]);
+    return /* @__PURE__ */ jsxRuntime.jsx(TextField, { ...props, onChange: internalOnChange, onBlur: internalOnBlur, value: internalValue });
   }
   const styles = `
 @keyframes shimmer {
@@ -8339,7 +8356,8 @@
       height: headerHeight
     }, children: [
       columns.map((column_0, columnIndex) => {
-        const filterForThisProperty = column_0 && filter && filter[column_0.key] ? filter[column_0.key] : void 0;
+        const columnFilter = column_0 && filter && filter[column_0.key] ? filter[column_0.key] : void 0;
+        const filterForThisProperty = columnFilter ? Array.isArray(columnFilter[0]) ? columnFilter[0] : columnFilter : void 0;
         const isDraggable = !column_0.frozen && !!onColumnsOrderChange;
         const isDragging = draggingColumnId === column_0.key;
         return /* @__PURE__ */ jsxRuntime.jsx(ErrorBoundary, { children: /* @__PURE__ */ jsxRuntime.jsx(SortableColumnHeader, { column: column_0, columnIndex, columnRefs, isResizing, onFilterUpdate, filter: filterForThisProperty, sortByProperty, currentSort, onColumnSort, onClickResizeColumn, createFilterField, isDragging, isDraggable }) }, "header_" + column_0.key);