@true-engineering/true-react-common-ui-kit 4.0.0-alpha63 → 4.0.0-alpha65

package/dist/components/FiltersPane/types.d.ts

@@ -30,6 +30,7 @@ export type MultiSelectOptionType<Value> = Value | undefined extends IFilterMult
 export interface IConfigItemBasicBase<Value> {
     name: ReactNode;
     isInline?: boolean;
+    isDisabled?: boolean;
     isClearable?: boolean;
     requiredFilledFilters?: string[];
     localeKey?: IFilterLocaleKey;

package/dist/hooks/use-resize-ref.d.ts

@@ -2,6 +2,7 @@ import { RefCallback } from 'react';
 export interface IResizeRefOptions {
     /** @default false */
     isDisabled?: boolean;
-    onChange: (entry: ResizeObserverEntry) => void;
+    onChange?: (entry: ResizeObserverEntry) => void;
+    onTargetChange?: (target: Element) => void;
 }
 export declare const useResizeRef: (options: IResizeRefOptions) => RefCallback<Element>;

package/dist/true-react-common-ui-kit.js

@@ -2717,13 +2717,18 @@ const useResizeRef = (options) => {
     const observer = new ResizeObserver(([entry]) => {
       const { current } = optionsRef;
       if (!current.isDisabled) {
-        current?.onChange(entry);
+        current.onChange?.(entry);
+        current.onTargetChange?.(entry.target);
       }
     });
     const observerRef = (node) => {
       observer.disconnect();
-      if (isNotEmpty(node)) {
-        observer.observe(node);
+      if (!isNotEmpty(node)) {
+        return;
+      }
+      observer.observe(node);
+      if (!optionsRef.current.isDisabled) {
+        optionsRef.current.onTargetChange?.(node);
       }
     };
     return { ref: observerRef, disconnect: () => observer.disconnect() };
@@ -4148,13 +4153,9 @@ const ControlWrapper = ({
     className: "tweakPreloader",
     currentComponentName: "ControlWrapper"
   });
-  const startControlsRef = useCallback(
-    (node) => {
-      setStartControlsWidth(node?.clientWidth);
-    },
-    // eslint-disable-next-line react-hooks/exhaustive-deps
-    [startIcon, size2]
-  );
+  const startControlsRef = useResizeRef({
+    onTargetChange: (target) => setStartControlsWidth(target.clientWidth)
+  });
   const renderIconControl = ({ key, iconComponent, onClick, shouldResetSize = false }, iconType, index) => /* @__PURE__ */ jsx(
     "div",
     {
@@ -4376,12 +4377,9 @@ const InputBase = forwardRef(function InputBase2({
     await onChange("", event, "clear");
     inputRef.current?.focus();
   };
-  const unitsRef = useCallback(
-    (node) => {
-      setUnitsWidth(node?.clientWidth);
-    },
-    [units]
-  );
+  const unitsRef = useResizeRef({
+    onTargetChange: (target) => setUnitsWidth(target.clientWidth)
+  });
   const props = {
     className: clsx(classes.input, {
       [classes.withUnits]: hasUnits,
@@ -8751,7 +8749,7 @@ function FiltersPane({
           localeKey,
           onChange: (value) => onChangeFilters({ ...values, [filterKey]: value }),
           value: currentValue,
-          isDisabled: isDisabled || filter2?.requiredFilledFilters?.some((item) => !values[item]),
+          isDisabled: isDisabled || filter2?.isDisabled || filter2?.requiredFilledFilters?.some((item) => !values[item]),
           tweakStyles: tweakFilterWrapperStyles,
           data: shouldRenderDataId ? { id: filterKey } : void 0,
           testId: getTestId(testId, `filter-${filterKey}`)