@aivenio/aquarium 1.76.3 → 1.77.0

package/dist/system.mjs

@@ -4224,6 +4224,7 @@ __export(molecules_exports, {
   EmptyState: () => EmptyState,
   EmptyStateLayout: () => EmptyStateLayout,
   ExternalLinkButton: () => ExternalLinkButton,
+  FileInput: () => FileInput,
   Flexbox: () => Flexbox,
   FlexboxItem: () => FlexboxItem,
   GhostButton: () => GhostButton,
@@ -10293,6 +10294,7 @@ var import_cross5 = __toESM(require_cross());
 var import_error3 = __toESM(require_error());
 var import_search3 = __toESM(require_search());
 var import_tick4 = __toESM(require_tick());
+var import_upload2 = __toESM(require_upload());
 var InputAdornment = ({
   placement = "right",
   className,
@@ -10317,6 +10319,12 @@ var SearchIcon = ({ onClick }) => /* @__PURE__ */ React56.createElement(Icon, {
   "data-testid": "icon-search",
   onClick
 });
+var UploadIcon = ({ onClick }) => /* @__PURE__ */ React56.createElement(Icon, {
+  icon: import_upload2.default,
+  color: "primary-intense",
+  "data-testid": "icon-upload",
+  onClick
+});
 var ResetIcon = ({ onClick }) => /* @__PURE__ */ React56.createElement(Icon, {
   className: "hover:cursor-pointer",
   icon: import_cross5.default,
@@ -10347,11 +10355,14 @@ var createInput = (displayName, opts = {}) => {
         "type"
       ]);
       var _a2;
-      const inputType = opts.isSearch ? "search" : type;
+      const inputType = opts.isSearch ? "search" : opts.isFile ? "file" : type;
       const inputRef = React57.useRef(null);
       useImperativeHandle(ref, () => inputRef.current);
-      const handleReset = () => {
+      const handleReset = (e) => {
         var _a3;
+        if (opts.isFile) {
+          e.preventDefault();
+        }
         const el = inputRef.current;
         if (el) {
           const lastValue = el.value;
@@ -10364,7 +10375,8 @@ var createInput = (displayName, opts = {}) => {
       return /* @__PURE__ */ React57.createElement("span", {
         className: classNames("Aquarium-InputBase", tw("relative block"))
       }, opts.adornment && /* @__PURE__ */ React57.createElement(InputAdornment, {
-        placement: "left"
+        placement: "left",
+        className: opts.isFile ? "icon-stroke-2" : void 0
       }, opts.adornment), /* @__PURE__ */ React57.createElement("input", __spreadProps(__spreadValues({
         ref: inputRef,
         type: inputType
@@ -10377,7 +10389,8 @@ var createInput = (displayName, opts = {}) => {
           {
             "[&::-webkit-search-cancel-button]:appearance-none": opts.isSearch,
             "pl-7": opts.adornment,
-            "pr-7": opts.canReset || endAdornment
+            "pr-7": opts.canReset || endAdornment,
+            "file:text-primary-intense file:typography-small-strong file:border-0 file:bg-transparent file:p-0 file:mr-4": opts.isFile
           },
           getCommonInputStyles({ readOnly, valid }),
           props.className
@@ -10395,57 +10408,68 @@ var createInput = (displayName, opts = {}) => {
   return InputComponent;
 };
 var InputBase = createInput("InputBase");
+var FileInputBase = createInput("FileInputBase", {
+  adornment: /* @__PURE__ */ React57.createElement(UploadIcon, null),
+  canReset: true,
+  isFile: true
+});
 var SearchInput = createInput("SearchInput", {
   adornment: /* @__PURE__ */ React57.createElement(SearchIcon, null),
   canReset: true,
   isSearch: true
 });
-var Input2 = React57.forwardRef((inputProps, ref) => {
-  var _b, _c;
-  const _a = inputProps, { readOnly = false, value: valueProp, onChange: onChangeProp } = _a, props = __objRest(_a, ["readOnly", "value", "onChange"]);
-  const isControlled = typeof valueProp !== "undefined";
-  const [valueState, setValueState] = useState7((_b = props.defaultValue) != null ? _b : "");
-  const value = isControlled ? valueProp : valueState;
-  const handleChange = useCallback(
-    (e) => {
-      const next = e.target.value;
-      if (!isControlled) {
-        setValueState(next);
-      }
-      onChangeProp == null ? void 0 : onChangeProp(e);
-    },
-    [isControlled, onChangeProp]
-  );
-  const defaultId = useId7();
-  const id = (_c = props.id) != null ? _c : defaultId;
-  const errorMessageId = useId7();
-  const errorProps = props.valid === false ? { "aria-invalid": true, "aria-describedby": errorMessageId } : {};
-  const _d = getLabelControlProps(inputProps), { "data-testid": dataTestId } = _d, labelControlProps = __objRest(_d, ["data-testid"]);
-  const baseProps = omit5(
-    inputProps,
-    Object.keys(labelControlProps).concat(isControlled ? ["defaultValue"] : ["value"])
-  );
-  return /* @__PURE__ */ React57.createElement(LabelControl, __spreadProps(__spreadValues({
-    id: `${id}-label`,
-    htmlFor: id,
-    messageId: errorMessageId,
-    length: value !== void 0 ? toString(value).length : void 0
-  }, labelControlProps), {
-    className: "Aquarium-Input"
-  }), /* @__PURE__ */ React57.createElement(InputBase, __spreadProps(__spreadValues(__spreadValues({
-    ref
-  }, baseProps), errorProps), {
-    id,
-    "data-testid": dataTestId,
-    onChange: handleChange,
-    disabled: props.disabled,
-    maxLength: props.maxLength,
-    required: props.required,
-    valid: props.valid,
-    readOnly
-  })));
-});
-Input2.displayName = "Input";
+var createInputComponent = (displayName, options = {}) => {
+  const InputComponentBase = options.input || InputBase;
+  const InputComponent = React57.forwardRef((inputProps, ref) => {
+    var _b, _c;
+    const _a = inputProps, { readOnly = false, value: valueProp, onChange: onChangeProp } = _a, props = __objRest(_a, ["readOnly", "value", "onChange"]);
+    const isControlled = typeof valueProp !== "undefined";
+    const [valueState, setValueState] = useState7((_b = props.defaultValue) != null ? _b : "");
+    const value = isControlled ? valueProp : valueState;
+    const handleChange = useCallback(
+      (e) => {
+        const next = e.target.value;
+        if (!isControlled) {
+          setValueState(next);
+        }
+        onChangeProp == null ? void 0 : onChangeProp(e);
+      },
+      [isControlled, onChangeProp]
+    );
+    const defaultId = useId7();
+    const id = (_c = props.id) != null ? _c : defaultId;
+    const errorMessageId = useId7();
+    const errorProps = props.valid === false ? { "aria-invalid": true, "aria-describedby": errorMessageId } : {};
+    const _d = getLabelControlProps(inputProps), { "data-testid": dataTestId } = _d, labelControlProps = __objRest(_d, ["data-testid"]);
+    const baseProps = omit5(
+      inputProps,
+      Object.keys(labelControlProps).concat(isControlled ? ["defaultValue"] : ["value"])
+    );
+    return /* @__PURE__ */ React57.createElement(LabelControl, __spreadProps(__spreadValues({
+      id: `${id}-label`,
+      htmlFor: id,
+      messageId: errorMessageId,
+      length: value !== void 0 ? toString(value).length : void 0
+    }, labelControlProps), {
+      className: "Aquarium-Input"
+    }), /* @__PURE__ */ React57.createElement(InputComponentBase, __spreadProps(__spreadValues(__spreadValues({
+      ref
+    }, baseProps), errorProps), {
+      id,
+      "data-testid": dataTestId,
+      onChange: handleChange,
+      disabled: props.disabled,
+      maxLength: props.maxLength,
+      required: props.required,
+      valid: props.valid,
+      readOnly
+    })));
+  });
+  InputComponent.displayName = displayName;
+  return InputComponent;
+};
+var FileInput = createInputComponent("FileInput", { input: FileInputBase });
+var Input2 = createInputComponent("Input", { input: InputBase });
 Input2.Skeleton = () => /* @__PURE__ */ React57.createElement(LabelControl.Skeleton, null, /* @__PURE__ */ React57.createElement(InputBase.Skeleton, null));
 Input2.Skeleton.displayName = "Input.Skeleton";
 
@@ -15923,6 +15947,7 @@ export {
   EmptyState,
   EmptyStateLayout,
   ExternalLinkButton,
+  FileInput,
   Flexbox,
   FlexboxItem,
   FormControl,