@lumx/react 3.18.2-alpha.3 → 3.18.2-alpha.4

package/index.d.ts

@@ -3328,11 +3328,13 @@ interface FileInputProps extends Omit<React.ComponentProps<'input'>, 'onChange'>
 /**
  * Defines the props of the component.
  */
-interface UploaderProps extends GenericProps, HasTheme {
+interface UploaderProps extends GenericProps, HasTheme, HasAriaDisabled {
     /** Image aspect ratio. */
     aspectRatio?: AspectRatio;
     /** Icon (SVG path). */
     icon?: string;
+    /** Disabled state */
+    isDisabled?: boolean;
     /** Label text. */
     label?: string;
     /** Size variant. */

package/index.js

@@ -14177,7 +14177,7 @@ Tooltip.displayName = COMPONENT_NAME$2;
 Tooltip.className = CLASSNAME$2;
 Tooltip.defaultProps = DEFAULT_PROPS$2;
 
-const _excluded$1 = ["aspectRatio", "className", "label", "icon", "size", "theme", "variant", "fileInputProps"];
+const _excluded$1 = ["aspectRatio", "className", "label", "icon", "size", "theme", "variant", "fileInputProps", "onClick"];
 
 /**
  * Uploader variants.
@@ -14227,6 +14227,11 @@ const DEFAULT_PROPS$1 = {
  * @return React element.
  */
 const Uploader = forwardRef((props, ref) => {
+  const {
+    disabledStateProps,
+    otherProps,
+    isAnyDisabled
+  } = useDisableStateProps(props);
   const defaultTheme = useTheme() || Theme.light;
   const {
       aspectRatio = DEFAULT_PROPS$1.aspectRatio,
@@ -14236,11 +14241,19 @@ const Uploader = forwardRef((props, ref) => {
       size = DEFAULT_PROPS$1.size,
       theme = defaultTheme,
       variant = DEFAULT_PROPS$1.variant,
-      fileInputProps
-    } = props,
-    forwardedProps = _objectWithoutProperties(props, _excluded$1);
+      fileInputProps,
+      onClick
+    } = otherProps,
+    forwardedProps = _objectWithoutProperties(otherProps, _excluded$1);
   // Adjust to square aspect ratio when using circle variants.
   const adjustedAspectRatio = variant === UploaderVariant.circle ? AspectRatio.square : aspectRatio;
+  const handleClick = React__default.useCallback(evt => {
+    if (isAnyDisabled) {
+      evt.preventDefault();
+    } else {
+      onClick === null || onClick === void 0 ? void 0 : onClick(evt);
+    }
+  }, [isAnyDisabled, onClick]);
   const generatedInputId = useId();
   const inputId = (fileInputProps === null || fileInputProps === void 0 ? void 0 : fileInputProps.id) || generatedInputId;
   const [isDragHovering, unsetDragHovering, setDragHovering] = useBooleanState(false);
@@ -14251,28 +14264,30 @@ const Uploader = forwardRef((props, ref) => {
     }
   } : {
     Component: 'button',
-    props: {
+    props: _objectSpread2({
       type: 'button'
-    }
+    }, disabledStateProps)
   };
   const onChange = React__default.useMemo(() => {
-    if (!(fileInputProps !== null && fileInputProps !== void 0 && fileInputProps.onChange)) return undefined;
+    if (isAnyDisabled || !(fileInputProps !== null && fileInputProps !== void 0 && fileInputProps.onChange)) return undefined;
     return evt => {
       const fileList = evt.target.files;
       const files = fileList ? Array.from(fileList) : [];
       fileInputProps.onChange(files, evt);
     };
-  }, [fileInputProps]);
+  }, [isAnyDisabled, fileInputProps]);
   return /*#__PURE__*/React__default.createElement(wrapper.Component, _extends({
     ref: ref
   }, wrapper.props, forwardedProps, {
+    onClick: handleClick,
     className: classNames(className, handleBasicClasses({
       aspectRatio: adjustedAspectRatio,
       prefix: CLASSNAME$1,
       size,
       theme,
       variant,
-      isDragHovering
+      isDragHovering,
+      isDisabled: isAnyDisabled
     }))
   }), /*#__PURE__*/React__default.createElement("span", {
     className: `${CLASSNAME$1}__background`
@@ -14287,8 +14302,9 @@ const Uploader = forwardRef((props, ref) => {
   }, label)), fileInputProps && /*#__PURE__*/React__default.createElement("input", _extends({
     type: "file",
     id: inputId,
-    className: `${CLASSNAME$1}__input`
-  }, fileInputProps, {
+    className: `${CLASSNAME$1}__input ${VISUALLY_HIDDEN}`
+  }, disabledStateProps, fileInputProps, {
+    readOnly: isAnyDisabled,
     onChange: onChange,
     onDragEnter: setDragHovering,
     onDragLeave: unsetDragHovering,