@redis-ui/components 39.12.0 → 41.3.2

package/dist/FormField/components/Nested/Nested.cjs

@@ -2,16 +2,33 @@
 Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
 const jsxRuntime = require("../../../node_modules/react/jsx-runtime.cjs");
 const FormField_context = require("../../FormField.context.cjs");
+const Field_context = require("../../../Inputs/components/Context/Field.context.cjs");
 const SharedId_context = require("../../../Helpers/contexts/SharedId.context.cjs");
+const DISABLED_STATE_TO_PASS = true;
 const Nested = ({
   id,
-  children
-}) => jsxRuntime.jsxRuntimeExports.jsx(SharedId_context.SharedIdProvider, {
-  customId: id,
-  children: jsxRuntime.jsxRuntimeExports.jsx(FormField_context.FieldStatusProvider, {
-    children: jsxRuntime.jsxRuntimeExports.jsx(FormField_context.FieldReadonlyProvider, {
-      children
+  children,
+  disabledState = "smart"
+}) => {
+  const otherProviders = jsxRuntime.jsxRuntimeExports.jsx(SharedId_context.SharedIdProvider, {
+    customId: id,
+    children: jsxRuntime.jsxRuntimeExports.jsx(FormField_context.FieldStatusProvider, {
+      children: jsxRuntime.jsxRuntimeExports.jsx(FormField_context.FieldReadonlyProvider, {
+        children
+      })
     })
-  })
-});
+  });
+  if (disabledState === "smart") {
+    return jsxRuntime.jsxRuntimeExports.jsx(Field_context.FieldDisabledTransProvider, {
+      passOnlyStateDown: DISABLED_STATE_TO_PASS,
+      children: otherProviders
+    });
+  }
+  if (disabledState === "cut") {
+    return jsxRuntime.jsxRuntimeExports.jsx(Field_context.FieldDisabledProvider, {
+      children: otherProviders
+    });
+  }
+  return otherProviders;
+};
 exports.default = Nested;

package/dist/FormField/components/Nested/Nested.d.ts

@@ -1,3 +1,3 @@
 import { FormFieldNestedProps } from './Nested.types';
-declare const Nested: ({ id, children }: FormFieldNestedProps) => import("react/jsx-runtime").JSX.Element;
+declare const Nested: ({ id, children, disabledState }: FormFieldNestedProps) => import("react/jsx-runtime").JSX.Element;
 export default Nested;

package/dist/FormField/components/Nested/Nested.js

@@ -1,17 +1,34 @@
 import { j as jsxRuntimeExports } from "../../../node_modules/react/jsx-runtime.js";
 import { FieldStatusProvider, FieldReadonlyProvider } from "../../FormField.context.js";
+import { FieldDisabledTransProvider, FieldDisabledProvider } from "../../../Inputs/components/Context/Field.context.js";
 import { SharedIdProvider } from "../../../Helpers/contexts/SharedId.context.js";
+const DISABLED_STATE_TO_PASS = true;
 const Nested = ({
   id,
-  children
-}) => jsxRuntimeExports.jsx(SharedIdProvider, {
-  customId: id,
-  children: jsxRuntimeExports.jsx(FieldStatusProvider, {
-    children: jsxRuntimeExports.jsx(FieldReadonlyProvider, {
-      children
+  children,
+  disabledState = "smart"
+}) => {
+  const otherProviders = jsxRuntimeExports.jsx(SharedIdProvider, {
+    customId: id,
+    children: jsxRuntimeExports.jsx(FieldStatusProvider, {
+      children: jsxRuntimeExports.jsx(FieldReadonlyProvider, {
+        children
+      })
     })
-  })
-});
+  });
+  if (disabledState === "smart") {
+    return jsxRuntimeExports.jsx(FieldDisabledTransProvider, {
+      passOnlyStateDown: DISABLED_STATE_TO_PASS,
+      children: otherProviders
+    });
+  }
+  if (disabledState === "cut") {
+    return jsxRuntimeExports.jsx(FieldDisabledProvider, {
+      children: otherProviders
+    });
+  }
+  return otherProviders;
+};
 export {
   Nested as default
 };

package/dist/FormField/components/Nested/Nested.types.d.ts

@@ -1,5 +1,7 @@
 import { ReactNode } from 'react';
+export type DisableStateManagement = 'pass' | 'cut' | 'smart';
 export type FormFieldNestedProps = {
     children?: ReactNode;
     id?: string;
+    disabledState?: DisableStateManagement;
 };

package/dist/Helpers/common.types.d.ts

@@ -9,6 +9,6 @@ export type AnyOtherString = string & NonNullable<unknown>;
 export type ComposeChildrenProps = {
     children: ReactNode;
 };
-export type ComposeElementProps<T extends HTMLElement = HTMLDivElement> = ComposeChildrenProps & Omit<HTMLAttributes<T>, 'children' | 'content'>;
+export type ComposeElementProps<T extends HTMLElement = HTMLElement> = ComposeChildrenProps & Omit<HTMLAttributes<T>, 'children' | 'content'>;
 export type ToCamel<S extends string | number | symbol> = S extends string ? S extends `${infer Head}_${infer Tail}` ? `${ToCamel<Uncapitalize<Head>>}${Capitalize<ToCamel<Tail>>}` : S extends `${infer Head}-${infer Tail}` ? `${ToCamel<Uncapitalize<Head>>}${Capitalize<ToCamel<Tail>>}` : Uncapitalize<S> : never;
 export type ToPascal<S extends string | number | symbol> = S extends string ? S extends `${infer Head}_${infer Tail}` ? `${Capitalize<ToCamel<Head>>}${Capitalize<ToCamel<Tail>>}` : S extends `${infer Head}-${infer Tail}` ? `${Capitalize<ToCamel<Head>>}${Capitalize<ToCamel<Tail>>}` : Capitalize<S> : never;

package/dist/Helpers/contexts/NullableContext.cjs

@@ -0,0 +1,17 @@
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const React = require("react");
+const createNullableContext = ({
+  forComponentName
+}) => {
+  const Context = React.createContext(null);
+  const useTheContext = () => {
+    const context = React.useContext(Context);
+    if (context === null) {
+      throw new Error(`${forComponentName} compound components cannot be rendered outside the ${forComponentName} component`);
+    }
+    return context;
+  };
+  return [useTheContext, Context.Provider, Context];
+};
+exports.createNullableContext = createNullableContext;

package/dist/Helpers/contexts/NullableContext.d.ts

@@ -0,0 +1,4 @@
+import { Provider } from 'react';
+export declare const createNullableContext: <T>({ forComponentName }: {
+    forComponentName: string;
+}) => readonly [() => T, Provider<T>, import("react").Context<T | null>];

package/dist/Helpers/contexts/NullableContext.js

@@ -0,0 +1,17 @@
+import { createContext, useContext } from "react";
+const createNullableContext = ({
+  forComponentName
+}) => {
+  const Context = createContext(null);
+  const useTheContext = () => {
+    const context = useContext(Context);
+    if (context === null) {
+      throw new Error(`${forComponentName} compound components cannot be rendered outside the ${forComponentName} component`);
+    }
+    return context;
+  };
+  return [useTheContext, Context.Provider, Context];
+};
+export {
+  createNullableContext
+};

package/dist/Helpers/contexts/PrimitiveContextState.cjs

@@ -40,8 +40,30 @@ const createPrimitiveContextState = () => {
       children
     });
   };
+  const OverridingStateProvider = ({
+    value,
+    passOnlyStateDown,
+    children
+  }) => {
+    var _a;
+    const [state, setState] = React.useState(value);
+    React.useLayoutEffect(() => {
+      if (value !== void 0) setState(value);
+    }, [value]);
+    const contextState = (_a = React.useContext(Context)) == null ? void 0 : _a.state;
+    const mergedState = contextState !== void 0 && (passOnlyStateDown === contextState || typeof passOnlyStateDown === "function" && passOnlyStateDown(contextState)) ? contextState : state;
+    const context = React.useMemo(() => ({
+      state: mergedState,
+      setState
+    }), [mergedState]);
+    return jsxRuntime.jsxRuntimeExports.jsx(Context.Provider, {
+      value: context,
+      children
+    });
+  };
   const StateTransProvider = ({
     value,
+    passOnlyStateDown = void 0,
     children
   }) => {
     const context = React.useContext(Context);
@@ -49,6 +71,11 @@ const createPrimitiveContextState = () => {
       value,
       children
     });
+    if (passOnlyStateDown !== void 0) return jsxRuntime.jsxRuntimeExports.jsx(OverridingStateProvider, {
+      passOnlyStateDown,
+      value,
+      children
+    });
     if (value !== void 0) return jsxRuntime.jsxRuntimeExports.jsx(ValueUpdater, {
       value,
       children

package/dist/Helpers/contexts/PrimitiveContextState.d.ts

@@ -1,5 +1,8 @@
 import { ProviderProps } from 'react';
 type StateProviderProps<T> = Partial<ProviderProps<T>>;
+type OverridingStateProps<T> = {
+    passOnlyStateDown?: T | ((state: T) => boolean);
+};
 /**
  * Presents the shared context state for a primitive value.
  *
@@ -11,7 +14,9 @@ type StateProviderProps<T> = Partial<ProviderProps<T>>;
  * The top provider unconditionally creates its own shared state and passes it to descendants.
  *
  * The transitive provider forwards state from the ascendant top provider, if there is one.
- * Otherwise, it behaves like a top state provider.
+ * Otherwise, it behaves like a top provider.<br/>
+ * If the `passOnlyStateDown` prop is set, the provider creates inner shared state (like a top provider),
+ * but overrides the state value with outer state if allowed by the prop
  *
  * Each provider type and hook optionally receives a value and updates state.
  * Undefined values are ignored.
@@ -19,5 +24,5 @@ type StateProviderProps<T> = Partial<ProviderProps<T>>;
  *
  * If no providers are found, the hook returns the state passed to it.
  */
-export declare const createPrimitiveContextState: <T extends string | number | boolean | null>() => readonly [(value?: T | undefined) => T | undefined, ({ value, children }: Partial<ProviderProps<T>>) => import("react/jsx-runtime").JSX.Element, ({ value, children }: Partial<ProviderProps<T>>) => import("react/jsx-runtime").JSX.Element];
+export declare const createPrimitiveContextState: <T extends string | number | boolean | null>() => readonly [(value?: T | undefined) => T | undefined, ({ value, children }: Partial<ProviderProps<T>>) => import("react/jsx-runtime").JSX.Element, ({ value, passOnlyStateDown, children }: Partial<ProviderProps<T>> & OverridingStateProps<T>) => import("react/jsx-runtime").JSX.Element];
 export {};

package/dist/Helpers/contexts/PrimitiveContextState.js

@@ -38,8 +38,30 @@ const createPrimitiveContextState = () => {
       children
     });
   };
+  const OverridingStateProvider = ({
+    value,
+    passOnlyStateDown,
+    children
+  }) => {
+    var _a;
+    const [state, setState] = useState(value);
+    useLayoutEffect(() => {
+      if (value !== void 0) setState(value);
+    }, [value]);
+    const contextState = (_a = useContext(Context)) == null ? void 0 : _a.state;
+    const mergedState = contextState !== void 0 && (passOnlyStateDown === contextState || typeof passOnlyStateDown === "function" && passOnlyStateDown(contextState)) ? contextState : state;
+    const context = useMemo(() => ({
+      state: mergedState,
+      setState
+    }), [mergedState]);
+    return jsxRuntimeExports.jsx(Context.Provider, {
+      value: context,
+      children
+    });
+  };
   const StateTransProvider = ({
     value,
+    passOnlyStateDown = void 0,
     children
   }) => {
     const context = useContext(Context);
@@ -47,6 +69,11 @@ const createPrimitiveContextState = () => {
       value,
       children
     });
+    if (passOnlyStateDown !== void 0) return jsxRuntimeExports.jsx(OverridingStateProvider, {
+      passOnlyStateDown,
+      value,
+      children
+    });
     if (value !== void 0) return jsxRuntimeExports.jsx(ValueUpdater, {
       value,
       children

package/dist/Helpers/hooks/useScrollable.cjs

@@ -0,0 +1,32 @@
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const React = require("react");
+function isScrollable(el) {
+  return el.scrollHeight > el.clientHeight || el.scrollWidth > el.clientWidth;
+}
+const useScrollable = (ref) => {
+  const [scrollable, setScrollable] = React.useState(false);
+  React.useEffect(() => {
+    const el = ref.current;
+    if (!el) return void 0;
+    const update = () => setScrollable(isScrollable(el));
+    const resizeObserver = new ResizeObserver(update);
+    resizeObserver.observe(el);
+    const mutationObserver = new MutationObserver(update);
+    mutationObserver.observe(el, {
+      childList: true,
+      subtree: true,
+      attributes: true,
+      characterData: true
+    });
+    window.addEventListener("resize", update);
+    update();
+    return () => {
+      resizeObserver.disconnect();
+      mutationObserver.disconnect();
+      window.removeEventListener("resize", update);
+    };
+  }, [ref]);
+  return scrollable;
+};
+exports.useScrollable = useScrollable;

package/dist/Helpers/hooks/useScrollable.d.ts

@@ -0,0 +1,3 @@
+import { RefObject } from 'react';
+/** Hook: returns whether element is scrollable */
+export declare const useScrollable: (ref: RefObject<HTMLElement>) => boolean;

package/dist/Helpers/hooks/useScrollable.js

@@ -0,0 +1,32 @@
+import { useState, useEffect } from "react";
+function isScrollable(el) {
+  return el.scrollHeight > el.clientHeight || el.scrollWidth > el.clientWidth;
+}
+const useScrollable = (ref) => {
+  const [scrollable, setScrollable] = useState(false);
+  useEffect(() => {
+    const el = ref.current;
+    if (!el) return void 0;
+    const update = () => setScrollable(isScrollable(el));
+    const resizeObserver = new ResizeObserver(update);
+    resizeObserver.observe(el);
+    const mutationObserver = new MutationObserver(update);
+    mutationObserver.observe(el, {
+      childList: true,
+      subtree: true,
+      attributes: true,
+      characterData: true
+    });
+    window.addEventListener("resize", update);
+    update();
+    return () => {
+      resizeObserver.disconnect();
+      mutationObserver.disconnect();
+      window.removeEventListener("resize", update);
+    };
+  }, [ref]);
+  return scrollable;
+};
+export {
+  useScrollable
+};

package/dist/Helpers/index.d.ts

@@ -3,6 +3,9 @@ export * from './generateId';
 export * from './debounce';
 export * from './contexts/SharedId.context';
 export * from './contexts/PrimitiveContextState';
+export * from './contexts/NullableContext';
 export * from './SelfContained';
 export * from './RestylableElement';
 export * from './contexts/Popper/Popper.context';
+export * from './common.types';
+export * from './hooks/useScrollable';

package/dist/Helpers/react.utils.cjs

@@ -14,9 +14,13 @@ const combineHandlers = (...handlers) => {
 };
 const isFragmentElement = (el) => el.type === React.Fragment;
 const isTextualNode = (node) => !node || (Array.isArray(node) ? node.flat().every(isTextualNode) : !React.isValidElement(node) || isFragmentElement(node) && isTextualNode(node.props.children));
+const forwardRefWithGenerics = React.forwardRef;
+const memoWithGenerics = React.memo;
 exports.childrenToString = childrenToString;
 exports.combineHandlers = combineHandlers;
+exports.forwardRefWithGenerics = forwardRefWithGenerics;
 exports.handlePreventDefault = handlePreventDefault;
 exports.handleStopPropagation = handleStopPropagation;
 exports.isFragmentElement = isFragmentElement;
 exports.isTextualNode = isTextualNode;
+exports.memoWithGenerics = memoWithGenerics;

package/dist/Helpers/react.utils.d.ts

@@ -1,4 +1,4 @@
-import { ReactElement, ReactNode } from 'react';
+import { ReactElement, ReactNode, ForwardedRef, FunctionComponent, PropsWithoutRef, RefAttributes } from 'react';
 export declare const handlePreventDefault: (e: {
     preventDefault: VoidFunction;
 }) => void;
@@ -18,4 +18,6 @@ export declare const isFragmentElement: (el: ReactElement) => el is ReactElement
  * Returns false if texts is wrapped into other components, including Fragment.
  */
 export declare const isTextualNode: (node: ReactNode) => boolean;
+export declare const forwardRefWithGenerics: <T, P = {}>(render: (props: P, ref: ForwardedRef<T>) => ReturnType<FunctionComponent>) => (props: PropsWithoutRef<P> & RefAttributes<T>) => ReturnType<FunctionComponent>;
+export declare const memoWithGenerics: <P extends object>(Component: (props: P) => ReturnType<FunctionComponent>, propsAreEqual?: ((prevProps: Readonly<P>, nextProps: Readonly<P>) => boolean) | undefined) => (props: P) => ReturnType<FunctionComponent>;
 export {};

package/dist/Helpers/react.utils.js

@@ -1,4 +1,4 @@
-import { Fragment, isValidElement } from "react";
+import { Fragment, isValidElement, forwardRef, memo } from "react";
 import "../node_modules/react-children-utilities/react-children-utilities.js";
 import onlyText from "../node_modules/react-children-utilities/lib/onlyText.js";
 const handlePreventDefault = (e) => e.preventDefault();
@@ -12,11 +12,15 @@ const combineHandlers = (...handlers) => {
 };
 const isFragmentElement = (el) => el.type === Fragment;
 const isTextualNode = (node) => !node || (Array.isArray(node) ? node.flat().every(isTextualNode) : !isValidElement(node) || isFragmentElement(node) && isTextualNode(node.props.children));
+const forwardRefWithGenerics = forwardRef;
+const memoWithGenerics = memo;
 export {
   childrenToString,
   combineHandlers,
+  forwardRefWithGenerics,
   handlePreventDefault,
   handleStopPropagation,
   isFragmentElement,
-  isTextualNode
+  isTextualNode,
+  memoWithGenerics
 };

package/dist/Inputs/Input/Input.d.ts

@@ -2,13 +2,13 @@
 import { RestInputProps } from './Input.types';
 declare const Input: import("react").ForwardRefExoticComponent<import("../components/Compose/CommonCompose.types").CommonInputComposeProps & Omit<import("../components/Context/InputValueProvider").InputValueProviderProps, "children"> & import("../components/InputTag/InputTag.types").InputTagProps & import("../components/LoadingIndicator/LoadingIndicator.types").LoadingIndicatorProps & import("../components/ResetButton/ResetButton.types").ResetButtonProps & RestInputProps & import("react").RefAttributes<HTMLInputElement>> & {
     StatusIndicator: ({ className, style, size, ...restProps }: import("@redislabsdev/redis-ui-icons/monochrome").MonochromeIconProps & Pick<import("react").HTMLAttributes<unknown>, "style" | "className">) => import("react/jsx-runtime").JSX.Element | null;
-    Compose: ({ value, defaultValue, onChange, parser, formatter, ...restProps }: import("../components/Compose/CommonCompose.types").CommonInputComposeProps & Omit<import("../components/Context/InputValueProvider").InputValueProviderProps, "children"> & Omit<import("../../Helpers/common.types").ComposeElementProps<HTMLDivElement>, "defaultValue" | "onChange"> & {
+    Compose: ({ value, defaultValue, onChange, parser, formatter, ...restProps }: import("../components/Compose/CommonCompose.types").CommonInputComposeProps & Omit<import("../components/Context/InputValueProvider").InputValueProviderProps, "children"> & Omit<import("../..").ComposeElementProps<HTMLElement>, "defaultValue" | "onChange"> & {
         readonlyRender?: import("../components/ReadonlyRender/ReadonlyRender.types").ReadOnlyRenderComponent | undefined;
         readonlyProps?: import("react").HTMLAttributes<HTMLElement> | undefined;
     }) => import("react/jsx-runtime").JSX.Element;
     LoadingIndicator: ({ loading, ...restProps }: import("../components/LoadingIndicator/LoadingIndicator.types").LoadingIndicatorProps & import("../components/LoadingIndicator/LoadingIndicator.types").RestLoadingIndicatorProps) => import("react/jsx-runtime").JSX.Element | null;
     Tag: import("react").ForwardRefExoticComponent<import("../components/InputTag/InputTag.types").InputTagProps & import("../components/InputTag/InputTag.types").RestInputTagProps & import("react").RefAttributes<HTMLInputElement>>;
-    ReadonlyValue: import("styled-components").StyledComponent<({ size, variant, color, component, ellipsis, ...restProps }: import("../../Typography/components/Body/Body.types").BodyProps) => import("react/jsx-runtime").JSX.Element, any, {
+    ReadonlyValue: import("styled-components").StyledComponent<({ size, variant, color, component, ellipsis, ...restProps }: import("../..").TypographyBodyProps) => import("react/jsx-runtime").JSX.Element, any, {
         readOnly: boolean;
     }, "readOnly">;
     ResetButton: ({ size, icon, allowReset, onClick, onMouseDown, ...restProps }: Partial<import("../..").IconButtonProps> & import("../components/ResetButton/ResetButton.types").ResetButtonProps) => import("react/jsx-runtime").JSX.Element | null;

package/dist/Inputs/NumericInput/NumericInput.d.ts

@@ -4,13 +4,13 @@ declare const NumericInput: import("react").ForwardRefExoticComponent<import("..
     readOnly?: boolean | undefined;
 } & RestNumericInputProps & import("react").RefAttributes<HTMLInputElement>> & {
     StatusIndicator: ({ className, style, size, ...restProps }: import("@redislabsdev/redis-ui-icons/monochrome").MonochromeIconProps & Pick<import("react").HTMLAttributes<unknown>, "style" | "className">) => import("react/jsx-runtime").JSX.Element | null;
-    Compose: ({ value, defaultValue, onChange, min, max, step, required, maxDecimals, autoValidate, validate, calcStepActionValue, ...restProps }: import("../components/Compose/CommonCompose.types").CommonInputComposeProps & Omit<import("../components/Context/NumericInputValueProvider").NumericInputValueProviderProps, "children"> & Omit<import("../../Helpers/common.types").ComposeElementProps<HTMLDivElement>, "defaultValue" | "onChange"> & {
+    Compose: ({ value, defaultValue, onChange, min, max, step, required, maxDecimals, autoValidate, validate, calcStepActionValue, ...restProps }: import("../components/Compose/CommonCompose.types").CommonInputComposeProps & Omit<import("../components/Context/NumericInputValueProvider").NumericInputValueProviderProps, "children"> & Omit<import("../..").ComposeElementProps<HTMLElement>, "defaultValue" | "onChange"> & {
         readonlyRender?: import("../components/ReadonlyRender/ReadonlyRender.types").ReadOnlyRenderComponent | undefined;
         readonlyProps?: import("react").HTMLAttributes<HTMLElement> | undefined;
     }) => import("react/jsx-runtime").JSX.Element;
     LoadingIndicator: ({ loading, ...restProps }: import("../components/LoadingIndicator/LoadingIndicator.types").LoadingIndicatorProps & import("../components/LoadingIndicator/LoadingIndicator.types").RestLoadingIndicatorProps) => import("react/jsx-runtime").JSX.Element | null;
     Tag: import("react").ForwardRefExoticComponent<import("../components/InputTag/InputTag.types").InputTagProps & import("../components/InputTag/InputTag.types").RestInputTagProps & import("react").RefAttributes<HTMLInputElement>>;
-    ReadonlyValue: import("styled-components").StyledComponent<({ size, variant, color, component, ellipsis, ...restProps }: import("../../Typography/components/Body/Body.types").BodyProps) => import("react/jsx-runtime").JSX.Element, any, {
+    ReadonlyValue: import("styled-components").StyledComponent<({ size, variant, color, component, ellipsis, ...restProps }: import("../..").TypographyBodyProps) => import("react/jsx-runtime").JSX.Element, any, {
         readOnly: boolean;
     }, "readOnly">;
     ResetButton: ({ size, icon, allowReset, onClick, onMouseDown, ...restProps }: Partial<import("../..").IconButtonProps> & import("../components/ResetButton/ResetButton.types").ResetButtonProps) => import("react/jsx-runtime").JSX.Element | null;

package/dist/Inputs/PasswordInput/components/Compose/Compose.style.d.ts

@@ -1,5 +1,5 @@
 /// <reference types="react" />
-export declare const PasswordInputCompose: import("styled-components").StyledComponent<({ value, defaultValue, onChange, parser, formatter, ...restProps }: import("../../../components/Compose/CommonCompose.types").CommonInputComposeProps & Omit<import("../../../components/Context/InputValueProvider").InputValueProviderProps, "children"> & Omit<import("../../../../Helpers/common.types").ComposeElementProps<HTMLDivElement>, "defaultValue" | "onChange"> & {
+export declare const PasswordInputCompose: import("styled-components").StyledComponent<({ value, defaultValue, onChange, parser, formatter, ...restProps }: import("../../../components/Compose/CommonCompose.types").CommonInputComposeProps & Omit<import("../../../components/Context/InputValueProvider").InputValueProviderProps, "children"> & Omit<import("../../../..").ComposeElementProps<HTMLElement>, "defaultValue" | "onChange"> & {
     readonlyRender?: import("../../../components/ReadonlyRender/ReadonlyRender.types").ReadOnlyRenderComponent | undefined;
     readonlyProps?: import("react").HTMLAttributes<HTMLElement> | undefined;
 }) => import("react/jsx-runtime").JSX.Element, any, {}, never>;

package/dist/Inputs/PasswordInput/components/PasswordButton/PasswordButton.js

@@ -3,7 +3,7 @@ import { HideIcon, ShowIcon } from "@redislabsdev/redis-ui-icons";
 import { useFieldDisabled } from "../../../components/Context/Field.context.js";
 import { usePasswordExposure } from "../PasswordInput.context.js";
 import { useInputValueApi } from "../../../components/Context/InputValue.context.js";
-import IconButtonComponent from "../../../../Button/IconButton/IconButton.js";
+import IconButton from "../../../../Button/IconButton/IconButton.js";
 const PasswordButton = (props) => {
   const fieldDisabled = useFieldDisabled();
   const {
@@ -15,7 +15,7 @@ const PasswordButton = (props) => {
     showExposureToggle
   } = usePasswordExposure();
   const showToggle = showExposureToggle === "always" || showExposureToggle === "has-value" && value;
-  return showToggle ? jsxRuntimeExports.jsx(IconButtonComponent, {
+  return showToggle ? jsxRuntimeExports.jsx(IconButton, {
     size: "XL",
     ...props,
     disabled: fieldDisabled,

package/dist/Inputs/QuantityCounter/QuantityCounter.d.ts

@@ -4,7 +4,7 @@ declare const QuantityCounter: import("react").ForwardRefExoticComponent<import(
     incrementButtonProps?: Omit<import("./QuantityCounter.types").QuantityCounterStepButtonProps, "action"> | undefined;
     decrementButtonProps?: Omit<import("./QuantityCounter.types").QuantityCounterStepButtonProps, "action"> | undefined;
 } & RestQuantityCounterProps & import("react").RefAttributes<HTMLInputElement>> & {
-    Compose: ({ valueLabel, readonlyRender, children, onMouseEnter, onMouseLeave, ...restProps }: import("../components/Compose/CommonCompose.types").CommonInputComposeProps & Omit<import("../components/Context/NumericInputValueProvider").NumericInputValueProviderProps, "children"> & Omit<import("../../Helpers/common.types").ComposeElementProps<HTMLDivElement>, "defaultValue" | "onChange"> & {
+    Compose: ({ valueLabel, readonlyRender, children, onMouseEnter, onMouseLeave, ...restProps }: import("../components/Compose/CommonCompose.types").CommonInputComposeProps & Omit<import("../components/Context/NumericInputValueProvider").NumericInputValueProviderProps, "children"> & Omit<import("../..").ComposeElementProps<HTMLElement>, "defaultValue" | "onChange"> & {
         readonlyRender?: import("../components/ReadonlyRender/ReadonlyRender.types").ReadOnlyRenderComponent | undefined;
         readonlyProps?: import("react").HTMLAttributes<HTMLElement> | undefined;
     } & {
@@ -12,14 +12,14 @@ declare const QuantityCounter: import("react").ForwardRefExoticComponent<import(
     }) => import("react/jsx-runtime").JSX.Element;
     StepButton: ({ action, title, variant, size, icon, disabled, onClick, onMouseDown, ...restProps }: import("./QuantityCounter.types").QuantityCounterStepButtonProps) => import("react/jsx-runtime").JSX.Element;
     InputGroup: import("react").ForwardRefExoticComponent<import("../components/InputTag/InputTag.types").RestInputTagProps & import("./QuantityCounter.types").QuantityCounterInputGroupProps & import("react").RefAttributes<HTMLInputElement>> & {
-        Compose: (props: import("../../Helpers/common.types").ComposeElementProps<HTMLDivElement>) => import("react/jsx-runtime").JSX.Element;
+        Compose: (props: import("../..").ComposeElementProps<HTMLElement>) => import("react/jsx-runtime").JSX.Element;
         Tag: import("styled-components").StyledComponent<import("react").ForwardRefExoticComponent<import("../components/InputTag/InputTag.types").InputTagProps & import("../components/InputTag/InputTag.types").RestInputTagProps & import("react").RefAttributes<HTMLInputElement>>, any, {
             autoSize: true;
             'aria-description': string;
         }, "aria-description" | "autoSize">;
         ValueLabel: ({ children }: import("./components/InputGroup/components/ValueLabel/ValueLabel.types").ValueLabelProps) => import("react/jsx-runtime").JSX.Element | null;
     };
-    ReadonlyValue: import("styled-components").StyledComponent<({ size, variant, color, component, ellipsis, ...restProps }: import("../../Typography/components/Body/Body.types").BodyProps) => import("react/jsx-runtime").JSX.Element, any, {
+    ReadonlyValue: import("styled-components").StyledComponent<({ size, variant, color, component, ellipsis, ...restProps }: import("../..").TypographyBodyProps) => import("react/jsx-runtime").JSX.Element, any, {
         readOnly: boolean;
     }, "readOnly">;
 };

package/dist/Inputs/QuantityCounter/components/Compose/Compose.style.d.ts

@@ -1,5 +1,5 @@
 /// <reference types="react" />
-export declare const QuantityCounterCompose: import("styled-components").StyledComponent<({ value, defaultValue, onChange, min, max, step, required, maxDecimals, autoValidate, validate, calcStepActionValue, ...restProps }: import("../../../components/Compose/CommonCompose.types").CommonInputComposeProps & Omit<import("../../../components/Context/NumericInputValueProvider").NumericInputValueProviderProps, "children"> & Omit<import("../../../../Helpers/common.types").ComposeElementProps<HTMLDivElement>, "defaultValue" | "onChange"> & {
+export declare const QuantityCounterCompose: import("styled-components").StyledComponent<({ value, defaultValue, onChange, min, max, step, required, maxDecimals, autoValidate, validate, calcStepActionValue, ...restProps }: import("../../../components/Compose/CommonCompose.types").CommonInputComposeProps & Omit<import("../../../components/Context/NumericInputValueProvider").NumericInputValueProviderProps, "children"> & Omit<import("../../../..").ComposeElementProps<HTMLElement>, "defaultValue" | "onChange"> & {
     readonlyRender?: import("../../../components/ReadonlyRender/ReadonlyRender.types").ReadOnlyRenderComponent | undefined;
     readonlyProps?: import("react").HTMLAttributes<HTMLElement> | undefined;
 }) => import("react/jsx-runtime").JSX.Element, any, {}, never>;

package/dist/Inputs/QuantityCounter/components/Compose/components/ErrorTooltip/ErrorTooltip.style.d.ts

@@ -1,2 +1,2 @@
-export declare const TooltipErrorText: import("styled-components").StyledComponent<(props: import("../../../../../../Typography/components/Body/Body.types").BodyProps) => import("react/jsx-runtime").JSX.Element, any, {}, never>;
+export declare const TooltipErrorText: import("styled-components").StyledComponent<(props: import("../../../../../..").TypographyBodyProps) => import("react/jsx-runtime").JSX.Element, any, {}, never>;
 export declare const StatusIndicator: import("styled-components").StyledComponent<"span", any, {}, never>;

package/dist/Inputs/QuantityCounter/components/InputGroup/InputGroup.d.ts

@@ -1,7 +1,7 @@
 /// <reference types="react" />
 import { QuantityCounterInputGroupProps } from './InputGroup.types';
 export declare const InputGroup: import("react").ForwardRefExoticComponent<import("../../../components/InputTag/InputTag.types").RestInputTagProps & QuantityCounterInputGroupProps & import("react").RefAttributes<HTMLInputElement>> & {
-    Compose: (props: import("../../../../Helpers/common.types").ComposeElementProps<HTMLDivElement>) => import("react/jsx-runtime").JSX.Element;
+    Compose: (props: import("../../../..").ComposeElementProps<HTMLElement>) => import("react/jsx-runtime").JSX.Element;
     Tag: import("styled-components").StyledComponent<import("react").ForwardRefExoticComponent<import("../../../components/InputTag/InputTag.types").InputTagProps & import("../../../components/InputTag/InputTag.types").RestInputTagProps & import("react").RefAttributes<HTMLInputElement>>, any, {
         autoSize: true;
         'aria-description': string;

package/dist/Inputs/QuantityCounter/components/InputGroup/components/ValueLabel/ValueLabel.style.d.ts

@@ -1 +1 @@
-export declare const ValueLabel: import("styled-components").StyledComponent<({ size, variant, color, component, ellipsis, ...restProps }: import("../../../../../../Typography/components/Body/Body.types").BodyProps) => import("react/jsx-runtime").JSX.Element, any, {}, never>;
+export declare const ValueLabel: import("styled-components").StyledComponent<({ size, variant, color, component, ellipsis, ...restProps }: import("../../../../../../Typography").TypographyBodyProps) => import("react/jsx-runtime").JSX.Element, any, {}, never>;

package/dist/Inputs/SearchInput/SearchInput.d.ts

@@ -1,6 +1,6 @@
 /// <reference types="react" />
 declare const SearchInput: import("react").ForwardRefExoticComponent<Omit<import("../components/Compose/TextCompose.types").TextInputComposeProps, "readOnly" | "parser" | "formatter"> & import("../components/InputTag/InputTag.types").InputTagProps & import("../components/LoadingIndicator/LoadingIndicator.types").LoadingIndicatorProps & import("../components/ResetButton/ResetButton.types").ResetButtonProps & import("..").RestInputProps & import("react").RefAttributes<HTMLInputElement>> & {
-    Compose: ({ value, defaultValue, onChange, parser, formatter, ...restProps }: import("../components/Compose/CommonCompose.types").CommonInputComposeProps & Omit<import("../components/Context/InputValueProvider").InputValueProviderProps, "children"> & Omit<import("../../Helpers/common.types").ComposeElementProps<HTMLDivElement>, "defaultValue" | "onChange"> & {
+    Compose: ({ value, defaultValue, onChange, parser, formatter, ...restProps }: import("../components/Compose/CommonCompose.types").CommonInputComposeProps & Omit<import("../components/Context/InputValueProvider").InputValueProviderProps, "children"> & Omit<import("../..").ComposeElementProps<HTMLElement>, "defaultValue" | "onChange"> & {
         readonlyRender?: import("../components/ReadonlyRender/ReadonlyRender.types").ReadOnlyRenderComponent | undefined;
         readonlyProps?: import("react").HTMLAttributes<HTMLElement> | undefined;
     }) => import("react/jsx-runtime").JSX.Element;

package/dist/Inputs/TextArea/TextArea.d.ts

@@ -8,12 +8,12 @@ declare const TextArea: import("react").ForwardRefExoticComponent<Omit<import(".
     StatusIndicator: import("styled-components").StyledComponent<({ className, style, size, ...restProps }: import("@redislabsdev/redis-ui-icons/monochrome").MonochromeIconProps & Pick<import("react").HTMLAttributes<unknown>, "style" | "className">) => import("react/jsx-runtime").JSX.Element | null, any, {}, never>;
     Compose: ({ readonlyRender, ...restProps }: Omit<import("../components/Compose/TextCompose.types").TextInputComposeProps, "parser" | "formatter"> & {
         height?: string | undefined;
-    } & Omit<import("../../Helpers/common.types").ComposeElementProps<HTMLDivElement>, "defaultValue" | "onChange"> & {
+    } & Omit<import("../..").ComposeElementProps<HTMLElement>, "defaultValue" | "onChange"> & {
         readonlyRender?: import("../components/ReadonlyRender/ReadonlyRender.types").ReadOnlyRenderComponent | undefined;
         readonlyProps?: import("react").HTMLAttributes<HTMLElement> | undefined;
     }) => import("react/jsx-runtime").JSX.Element;
     Tag: import("react").ForwardRefExoticComponent<import("./components/TextAreaTag/TextAreaTag").RestTextAreaTagProps & import("react").RefAttributes<HTMLTextAreaElement>>;
-    ReadonlyValue: import("styled-components").StyledComponent<({ size, variant, color, component, ellipsis, ...restProps }: import("../../Typography/components/Body/Body.types").BodyProps) => import("react/jsx-runtime").JSX.Element, any, {
+    ReadonlyValue: import("styled-components").StyledComponent<({ size, variant, color, component, ellipsis, ...restProps }: import("../..").TypographyBodyProps) => import("react/jsx-runtime").JSX.Element, any, {
         readOnly: boolean;
     }, "readOnly">;
 };

package/dist/Inputs/TextArea/components/Compose/Compose.style.d.ts

@@ -1,5 +1,5 @@
 /// <reference types="react" />
-export declare const TextAreaCompose: import("styled-components").StyledComponent<({ value, defaultValue, onChange, parser, formatter, ...restProps }: import("../../../components/Compose/CommonCompose.types").CommonInputComposeProps & Omit<import("../../../components/Context/InputValueProvider").InputValueProviderProps, "children"> & Omit<import("../../../../Helpers/common.types").ComposeElementProps<HTMLDivElement>, "defaultValue" | "onChange"> & {
+export declare const TextAreaCompose: import("styled-components").StyledComponent<({ value, defaultValue, onChange, parser, formatter, ...restProps }: import("../../../components/Compose/CommonCompose.types").CommonInputComposeProps & Omit<import("../../../components/Context/InputValueProvider").InputValueProviderProps, "children"> & Omit<import("../../../..").ComposeElementProps<HTMLElement>, "defaultValue" | "onChange"> & {
     readonlyRender?: import("../../../components/ReadonlyRender/ReadonlyRender.types").ReadOnlyRenderComponent | undefined;
     readonlyProps?: import("react").HTMLAttributes<HTMLElement> | undefined;
 }) => import("react/jsx-runtime").JSX.Element, any, Omit<import("../../../components/Compose/TextCompose.types").TextInputComposeProps, "parser" | "formatter"> & {
@@ -7,6 +7,6 @@ export declare const TextAreaCompose: import("styled-components").StyledComponen
 } & {
     readOnly?: boolean | undefined;
 }, never>;
-export declare const ReadonlyValue: import("styled-components").StyledComponent<({ size, variant, color, component, ellipsis, ...restProps }: import("../../../../Typography/components/Body/Body.types").BodyProps) => import("react/jsx-runtime").JSX.Element, any, {
+export declare const ReadonlyValue: import("styled-components").StyledComponent<({ size, variant, color, component, ellipsis, ...restProps }: import("../../../../Typography").TypographyBodyProps) => import("react/jsx-runtime").JSX.Element, any, {
     readOnly: boolean;
 }, "readOnly">;

package/dist/Inputs/components/Compose/Compose.style.d.ts

@@ -4,6 +4,6 @@ export declare const CommonInputCompose: import("styled-components").StyledCompo
 } & {
     $variant: InputVariant;
 }, "data-status">;
-export declare const ReadonlyValue: import("styled-components").StyledComponent<({ size, variant, color, component, ellipsis, ...restProps }: import("../../../Typography/components/Body/Body.types").BodyProps) => import("react/jsx-runtime").JSX.Element, any, {
+export declare const ReadonlyValue: import("styled-components").StyledComponent<({ size, variant, color, component, ellipsis, ...restProps }: import("../../../Typography").TypographyBodyProps) => import("react/jsx-runtime").JSX.Element, any, {
     readOnly: boolean;
 }, "readOnly">;

package/dist/Inputs/components/Context/Field.context.d.ts

@@ -1,4 +1,6 @@
 import { ReactElement } from 'react';
-export declare const useFieldDisabled: (value?: boolean | undefined) => boolean | undefined, FieldDisabledProvider: ({ value, children }: Partial<import("react").ProviderProps<boolean>>) => import("react/jsx-runtime").JSX.Element, FieldDisabledTransProvider: ({ value, children }: Partial<import("react").ProviderProps<boolean>>) => import("react/jsx-runtime").JSX.Element;
+export declare const useFieldDisabled: (value?: boolean | undefined) => boolean | undefined, FieldDisabledProvider: ({ value, children }: Partial<import("react").ProviderProps<boolean>>) => import("react/jsx-runtime").JSX.Element, FieldDisabledTransProvider: ({ value, passOnlyStateDown, children }: Partial<import("react").ProviderProps<boolean>> & {
+    passOnlyStateDown?: boolean | ((state: boolean) => boolean) | undefined;
+}) => import("react/jsx-runtime").JSX.Element;
 export declare const useErrorContent: () => string | ReactElement<any, string | import("react").JSXElementConstructor<any>>;
 export declare const ErrorContentProvider: import("react").Provider<string | ReactElement<any, string | import("react").JSXElementConstructor<any>>>;

package/dist/Inputs/components/ResetButton/ResetButton.style.js

@@ -1,7 +1,7 @@
 import _styled from "styled-components";
 import { useTheme } from "@redislabsdev/redis-ui-styles";
-import IconButtonComponent from "../../../Button/IconButton/IconButton.js";
-const ResetButton = _styled(IconButtonComponent).withConfig({
+import IconButton from "../../../Button/IconButton/IconButton.js";
+const ResetButton = _styled(IconButton).withConfig({
   displayName: "ResetButtonstyle__ResetButton",
   componentId: "RedisUI__sc-ky4eky-0"
 })(["color:", ";"], () => useTheme().components.input.search.resetButton.iconColor);