@multiplatform.one/forms 6.0.0

package/dist/cjs/fields/Duration/index.native.js

@@ -0,0 +1,310 @@
+"use strict";
+
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all) __defProp(target, name, {
+    get: all[name],
+    enumerable: true
+  });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from)) if (!__hasOwnProp.call(to, key) && key !== except) __defProp(to, key, {
+      get: () => from[key],
+      enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable
+    });
+  }
+  return to;
+};
+var __toCommonJS = mod => __copyProps(__defProp({}, "__esModule", {
+  value: true
+}), mod);
+var Duration_exports = {};
+__export(Duration_exports, {
+  Duration: () => Duration
+});
+module.exports = __toCommonJS(Duration_exports);
+var import_jsx_runtime = require("react/jsx-runtime");
+var import_react = require("react");
+var import_tamagui = require("tamagui");
+var import_Button = require("../../Button/index.native.js");
+var import_Skeleton = require("../../Skeleton/index.native.js");
+var import_fieldLayout = require("../../fieldLayout.native.js");
+var import_FloatingPanel = require("../../FloatingPanel/index.native.js");
+var import_InputParts = require("../../InputParts/index.native.js");
+var import_colorRamps = require("../../shared/colorRamps.native.js");
+var import_TimeColumn = require("../../shared/TimeColumn.native.js");
+var import_utils = require("../../shared/utils.native.js");
+function secondsToHms(totalSeconds) {
+  var hours = Math.floor(totalSeconds / 3600);
+  var minutes = Math.floor(totalSeconds % 3600 / 60);
+  var seconds = totalSeconds % 60;
+  return {
+    hours,
+    minutes,
+    seconds
+  };
+}
+function hmsToSeconds(hours, minutes, seconds) {
+  return hours * 3600 + minutes * 60 + seconds;
+}
+function formatDuration(totalSeconds, showSeconds) {
+  var {
+    hours,
+    minutes,
+    seconds
+  } = secondsToHms(totalSeconds);
+  if (showSeconds) {
+    return `${String(hours).padStart(2, "0")}:${String(minutes).padStart(2, "0")}:${String(seconds).padStart(2, "0")}`;
+  }
+  return `${String(hours).padStart(2, "0")}h ${String(minutes).padStart(2, "0")}m`;
+}
+var hourValues = (0, import_TimeColumn.generateRange)(0, 23);
+var minuteValues = (0, import_TimeColumn.generateRange)(0, 59);
+var secondValues = (0, import_TimeColumn.generateRange)(0, 59);
+var defaultPresets = [{
+  label: "15m",
+  seconds: 900
+}, {
+  label: "30m",
+  seconds: 1800
+}, {
+  label: "1h",
+  seconds: 3600
+}, {
+  label: "2h",
+  seconds: 7200
+}, {
+  label: "4h",
+  seconds: 14400
+}, {
+  label: "8h",
+  seconds: 28800
+}];
+function DurationPopoverContent(param) {
+  var {
+    value,
+    onChange,
+    knobProps,
+    showSeconds,
+    presets
+  } = param;
+  var {
+    hours,
+    minutes,
+    seconds
+  } = secondsToHms(value);
+  return /* @__PURE__ */(0, import_jsx_runtime.jsxs)(import_tamagui.YStack, {
+    ...knobProps.gap,
+    children: [/* @__PURE__ */(0, import_jsx_runtime.jsxs)(import_tamagui.XStack, {
+      gap: "$2",
+      alignItems: "flex-start",
+      justifyContent: "center",
+      children: [/* @__PURE__ */(0, import_jsx_runtime.jsx)(import_TimeColumn.TimeColumn, {
+        label: "Hours",
+        values: hourValues,
+        selected: hours,
+        onChange: function onChange1(newHours) {
+          return onChange(hmsToSeconds(newHours, minutes, seconds));
+        },
+        knobProps
+      }), /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_TimeColumn.TimeColumnSeparator, {
+        knobProps
+      }), /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_TimeColumn.TimeColumn, {
+        label: "Min",
+        values: minuteValues,
+        selected: minutes,
+        onChange: function onChange1(newMinutes) {
+          return onChange(hmsToSeconds(hours, newMinutes, seconds));
+        },
+        knobProps
+      }), showSeconds && /* @__PURE__ */(0, import_jsx_runtime.jsxs)(import_jsx_runtime.Fragment, {
+        children: [/* @__PURE__ */(0, import_jsx_runtime.jsx)(import_TimeColumn.TimeColumnSeparator, {
+          knobProps
+        }), /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_TimeColumn.TimeColumn, {
+          label: "Sec",
+          values: secondValues,
+          selected: seconds,
+          onChange: function onChange1(newSeconds) {
+            return onChange(hmsToSeconds(hours, minutes, newSeconds));
+          },
+          knobProps
+        })]
+      })]
+    }), presets.length > 0 && /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_tamagui.XStack, {
+      gap: "$1",
+      flexWrap: "wrap",
+      justifyContent: "center",
+      children: presets.map(function (preset) {
+        return /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_Button.Button, {
+          size: "$2",
+          onPress: function onPress() {
+            return onChange(preset.seconds);
+          },
+          theme: value === preset.seconds ? "active" : void 0,
+          children: preset.label
+        }, preset.seconds);
+      })
+    })]
+  });
+}
+function Duration(param) {
+  var {
+    name,
+    form: formProp,
+    validators,
+    label,
+    labelProps,
+    helperText,
+    error,
+    required,
+    size,
+    id: idProp,
+    value = 0,
+    defaultValue,
+    onChange,
+    onBlur,
+    disabled,
+    readOnly,
+    showSeconds = false,
+    presets = defaultPresets,
+    placeholder = "Select duration",
+    clockIcon,
+    skeleton,
+    compact
+  } = param;
+  var {
+    resolvedForm,
+    knobProps,
+    id
+  } = (0, import_utils.useFormField)({
+    form: formProp,
+    id: idProp,
+    compact
+  });
+  var resolvedValidators = (0, import_utils.useResolvedValidators)(required, validators, label, name);
+  var [open, setOpen] = (0, import_react.useState)(false);
+  var displayValue = (0, import_react.useMemo)(function () {
+    if (!value && value !== 0) return "";
+    return formatDuration(value, showSeconds);
+  }, [value, showSeconds]);
+  var handleChange = (0, import_react.useCallback)(function (seconds, fieldChange) {
+    fieldChange === null || fieldChange === void 0 ? void 0 : fieldChange(seconds);
+    onChange === null || onChange === void 0 ? void 0 : onChange(seconds);
+  }, [onChange]);
+  var renderTrigger = function renderTrigger2(triggerValue, hasError) {
+    return /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_InputParts.Input, {
+      size: size || knobProps.sizeToken,
+      children: /* @__PURE__ */(0, import_jsx_runtime.jsxs)(import_InputParts.Input.Box, {
+        theme: hasError ? "red" : void 0,
+        ...(disabled ? {
+          opacity: 0.5,
+          pointerEvents: "none"
+        } : void 0),
+        children: [clockIcon && /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_InputParts.Input.Section, {
+          children: /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_InputParts.Input.Icon, {
+            adornment: "leading",
+            children: clockIcon
+          })
+        }), /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_InputParts.Input.Area, {
+          readOnly: true,
+          value: triggerValue,
+          placeholder,
+          disabled,
+          color: import_colorRamps.formCommonColors.text,
+          "aria-readonly": readOnly || void 0,
+          "aria-required": required || void 0,
+          "aria-invalid": hasError || void 0
+        })]
+      })
+    });
+  };
+  var panelContent = function panelContent2(currentValue, onValueChange) {
+    return /* @__PURE__ */(0, import_jsx_runtime.jsx)(DurationPopoverContent, {
+      value: currentValue,
+      onChange: onValueChange,
+      knobProps,
+      showSeconds,
+      presets
+    });
+  };
+  if (skeleton) {
+    return /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_fieldLayout.FieldLayout, {
+      id,
+      label,
+      size,
+      knobProps,
+      children: /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_Skeleton.Skeleton, {
+        variant: "rounded",
+        width: "100%",
+        height: knobProps.sizeToken
+      })
+    });
+  }
+  if (!resolvedForm || !name) {
+    return /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_fieldLayout.FieldLayout, {
+      id,
+      label,
+      labelProps,
+      error,
+      helperText,
+      required,
+      size,
+      knobProps,
+      onBlur,
+      children: readOnly ? renderTrigger(displayValue, !!error) : /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_FloatingPanel.FloatingPanel, {
+        open,
+        onOpenChange: setOpen,
+        disabled,
+        scrollable: true,
+        sizing: "fill",
+        fitContent: true,
+        trigger: renderTrigger(displayValue, !!error),
+        children: panelContent(value, function (s) {
+          return handleChange(s);
+        })
+      })
+    });
+  }
+  return /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_fieldLayout.Field, {
+    form: resolvedForm,
+    name,
+    defaultValue,
+    validators: resolvedValidators,
+    children: function children(field) {
+      var _field_state_value;
+      var resolvedError = (0, import_utils.getFieldError)(field, error);
+      var fieldValue = (_field_state_value = field.state.value) !== null && _field_state_value !== void 0 ? _field_state_value : 0;
+      var fieldDisplay = formatDuration(fieldValue, showSeconds);
+      return /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_fieldLayout.FieldLayout, {
+        id,
+        label,
+        labelProps,
+        error: resolvedError,
+        helperText,
+        required,
+        size,
+        knobProps,
+        onBlur: (0, import_utils.mergeFieldHandler)(field, "handleBlur", onBlur),
+        children: readOnly ? renderTrigger(fieldDisplay, !!resolvedError) : /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_FloatingPanel.FloatingPanel, {
+          open,
+          onOpenChange: setOpen,
+          disabled,
+          scrollable: true,
+          sizing: "fill",
+          fitContent: true,
+          trigger: renderTrigger(fieldDisplay, !!resolvedError),
+          children: panelContent(fieldValue, function (s) {
+            return handleChange(s, function (v) {
+              return field.handleChange(v);
+            });
+          })
+        })
+      });
+    }
+  });
+}
+//# sourceMappingURL=index.native.js.map

package/dist/cjs/fields/Duration/index.native.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["__toCommonJS","mod","__copyProps","__defProp","value","Duration_exports","__export","Duration","module","exports","import_jsx_runtime","require","import_react","import_tamagui","import_Button","import_Skeleton","import_fieldLayout","import_FloatingPanel","import_InputParts","import_colorRamps","import_TimeColumn","import_utils","secondsToHms","totalSeconds","hours","Math","floor","minutes","seconds","hmsToSeconds","formatDuration","showSeconds","String","padStart","hourValues","generateRange","minuteValues","secondValues","defaultPresets","label","DurationPopoverContent","param","onChange","knobProps","presets","jsxs","YStack","gap","children","XStack","alignItems","justifyContent","jsx","TimeColumn","values","selected","onChange1","newHours","TimeColumnSeparator","newMinutes","Fragment","newSeconds","length","flexWrap","map","preset","Button","size","onPress","theme","name","form","formProp","validators","labelProps","helperText","error","required","id","idProp","defaultValue","onBlur","disabled","readOnly","placeholder","clockIcon","skeleton","compact","resolvedForm","useFormField","resolvedValidators","useResolvedValidators","open","setOpen","useState","displayValue","useMemo","handleChange","useCallback","fieldChange","renderTrigger","renderTrigger2","triggerValue","hasError","Input","sizeToken","Box","opacity","pointerEvents","Section","Icon","adornment","Area","color","formCommonColors","text","panelContent","panelContent2","currentValue","onValueChange","FieldLayout","Skeleton","variant","width","height","FloatingPanel","onOpenChange","scrollable","sizing","fitContent","trigger","s","Field","field","_field_state_value","resolvedError","getFieldError","fieldValue","state","fieldDisplay"],"sources":["../../../../src/fields/Duration/index.tsx"],"sourcesContent":[null],"mappings":"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","ignoreList":[]}

package/dist/cjs/fields/FileUpload/FileUpload.spec.cjs

@@ -0,0 +1,17 @@
+var import_vitest = require("vitest");
+var import_test_utils = require("@multiplatform.one/test-utils");
+var import_index = require("./index.cjs");
+var import_jsx_runtime = require("react/jsx-runtime");
+(0, import_vitest.describe)("FileUpload", () => {
+  (0, import_vitest.it)("should render placeholder and upload button text", () => {
+    const result = (0, import_test_utils.renderWithProviders)(/* @__PURE__ */(0, import_jsx_runtime.jsx)(import_index.FileUpload, {
+      label: "Attachment",
+      placeholder: "Upload your file",
+      buttonText: "Pick file",
+      name: "attachment"
+    }));
+    (0, import_vitest.expect)(result.findTextElement("Attachment")).toBeDefined();
+    (0, import_vitest.expect)(result.findTextElement("Upload your file")).toBeDefined();
+    (0, import_vitest.expect)(result.findTextElement("Pick file")).toBeDefined();
+  });
+});

package/dist/cjs/fields/FileUpload/FileUpload.spec.native.js

@@ -0,0 +1,20 @@
+"use strict";
+
+var import_jsx_runtime = require("react/jsx-runtime");
+var import_vitest = require("vitest");
+var import_test_utils = require("@multiplatform.one/test-utils");
+var import_index = require("./index.native.js");
+(0, import_vitest.describe)("FileUpload", function () {
+  (0, import_vitest.it)("should render placeholder and upload button text", function () {
+    var result = (0, import_test_utils.renderWithProviders)(/* @__PURE__ */(0, import_jsx_runtime.jsx)(import_index.FileUpload, {
+      label: "Attachment",
+      placeholder: "Upload your file",
+      buttonText: "Pick file",
+      name: "attachment"
+    }));
+    (0, import_vitest.expect)(result.findTextElement("Attachment")).toBeDefined();
+    (0, import_vitest.expect)(result.findTextElement("Upload your file")).toBeDefined();
+    (0, import_vitest.expect)(result.findTextElement("Pick file")).toBeDefined();
+  });
+});
+//# sourceMappingURL=FileUpload.spec.native.js.map

package/dist/cjs/fields/FileUpload/FileUpload.spec.native.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["import_jsx_runtime","require","import_vitest","import_test_utils","import_index","describe","it","result","renderWithProviders","jsx","FileUpload","label","placeholder","buttonText","name","expect","findTextElement","toBeDefined"],"sources":["../../../../src/fields/FileUpload/FileUpload.spec.tsx"],"sourcesContent":[null],"mappings":"AAAA;;AACA,IAAAA,kBAAA,GAAoCC,OAAA;AACpC,IAAAC,aAAA,GAA2BD,OAAA;AAKrB,IAAAE,iBAAA,GAAAF,OAAA;AAAA,IAHNG,YAAA,GAAAH,OAAA,oBAAS;AACP,IAAAC,aAAA,CAAAG,QAAG;EACD,IAAAH,aAAM,CAAAI,EAAA,EAAS;IAAA,IACbC,MAAA,OAAAJ,iBAAA,CAAAK,mBAAA,qBAAAR,kBAAA,CAAAS,GAAA,EAAAL,YAAA,CAAAM,UAAA;MAAAC,KAAC;MAAAC,WAAA;MAAAC,UACC,EAAM;MAAAC,IACN;IAAY;IACD,IAAAZ,aACN,CAAAa,MAAA,EAAAR,MAAA,CAAAS,eAAA,gBAAAC,WAAA;IAAA,IAAAf,aAAA,CAAAa,MAAA,EAAAR,MAAA,CAAAS,eAAA,sBAAAC,WAAA;IAAA,EACP,EAAAf,aAAA,CAAAa,MAAA,EAAAR,MAAA,CAAAS,eAAA,eAAAC,WAAA;EAAA,EACF;AAEA","ignoreList":[]}

package/dist/cjs/fields/FileUpload/FileUpload.stories.cjs

@@ -0,0 +1,245 @@
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all) __defProp(target, name, {
+    get: all[name],
+    enumerable: true
+  });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from)) if (!__hasOwnProp.call(to, key) && key !== except) __defProp(to, key, {
+      get: () => from[key],
+      enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable
+    });
+  }
+  return to;
+};
+var __toCommonJS = mod => __copyProps(__defProp({}, "__esModule", {
+  value: true
+}), mod);
+var FileUpload_stories_exports = {};
+__export(FileUpload_stories_exports, {
+  Basic: () => Basic,
+  Disabled: () => Disabled,
+  ImageOnly: () => ImageOnly,
+  Interactive: () => Interactive,
+  Main: () => Main,
+  Sizes: () => Sizes,
+  Standalone: () => Standalone,
+  WithError: () => WithError,
+  default: () => FileUpload_stories_default
+});
+module.exports = __toCommonJS(FileUpload_stories_exports);
+var import_storybook = require("@multiplatform.one/storybook");
+var import_react_form = require("@tanstack/react-form");
+var import_react = require("react");
+var import_tamagui = require("tamagui");
+var import_Button = require("../../Button/index.cjs");
+var import_Form = require("../../Form/index.cjs");
+var import_index = require("./index.cjs");
+var import_jsx_runtime = require("react/jsx-runtime");
+const meta = {
+  title: "Forms/FileUpload",
+  component: import_index.FileUpload,
+  parameters: {
+    docs: {
+      description: {
+        component: "A file upload component with drag-and-drop support, file validation, and preview capabilities for form integration."
+      }
+    }
+  },
+  argTypes: {
+    label: {
+      control: "text",
+      description: "Field label"
+    },
+    helperText: {
+      control: "text",
+      description: "Helper text below the field"
+    },
+    error: {
+      control: "text",
+      description: "Error message"
+    },
+    required: {
+      control: "boolean",
+      description: "Mark field as required"
+    },
+    disabled: {
+      control: "boolean",
+      description: "Disable file upload"
+    },
+    size: {
+      control: "select",
+      options: ["$2", "$3", "$4"],
+      description: "Field size"
+    },
+    accept: {
+      control: "text",
+      description: "Accepted file types"
+    },
+    maxSize: {
+      control: "number",
+      description: "Maximum file size in bytes"
+    },
+    multiple: {
+      control: "boolean",
+      description: "Allow multiple file selection"
+    },
+    dragDrop: {
+      control: "boolean",
+      description: "Enable drag and drop"
+    },
+    showPreview: {
+      control: "boolean",
+      description: "Show file preview"
+    }
+  }
+};
+var FileUpload_stories_default = meta;
+const Main = {
+  name: "Main",
+  render: () => {
+    const FormExample = () => {
+      const form = (0, import_react_form.useForm)({
+        defaultValues: {
+          avatar: null,
+          document: null,
+          attachments: null
+        },
+        onSubmit: async ({
+          value
+        }) => {
+          (0, import_storybook.action)("onSubmit")(value);
+        }
+      });
+      return /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_Form.Form, {
+        form,
+        children: /* @__PURE__ */(0, import_jsx_runtime.jsxs)(import_tamagui.YStack, {
+          gap: "$4",
+          children: [/* @__PURE__ */(0, import_jsx_runtime.jsx)(import_index.FileUpload, {
+            ...{
+              label: "Profile Picture",
+              name: "avatar",
+              accept: "image/*",
+              helperText: "Upload your profile picture",
+              showPreview: true
+            }
+          }), /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_index.FileUpload, {
+            ...{
+              label: "Document",
+              name: "document",
+              accept: ".pdf,.doc,.docx",
+              helperText: "Upload PDF or Word document"
+            }
+          }), /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_index.FileUpload, {
+            ...{
+              label: "Attachments",
+              name: "attachments",
+              multiple: true,
+              helperText: "Upload multiple files"
+            }
+          }), /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_Button.Button, {
+            action: "submit",
+            children: "Submit"
+          })]
+        })
+      });
+    };
+    return /* @__PURE__ */(0, import_jsx_runtime.jsx)(FormExample, {});
+  }
+};
+const Standalone = {
+  args: {
+    label: "Upload File",
+    helperText: "Max 10MB",
+    accept: "*/*",
+    maxSize: 10485760
+  },
+  render: args => /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_index.FileUpload, {
+    ...args
+  })
+};
+const Basic = {
+  render: args => /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_index.FileUpload, {
+    ...args
+  }),
+  args: {
+    label: "Upload File",
+    placeholder: "Click to upload or drag and drop"
+  }
+};
+const Disabled = {
+  render: args => /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_index.FileUpload, {
+    ...args
+  }),
+  args: {
+    label: "Disabled Upload",
+    disabled: true,
+    placeholder: "Cannot upload"
+  }
+};
+const WithError = {
+  render: args => /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_index.FileUpload, {
+    ...args
+  }),
+  args: {
+    label: "Required File",
+    error: "Please upload a file",
+    required: true
+  }
+};
+const Sizes = {
+  render: () => /* @__PURE__ */(0, import_jsx_runtime.jsxs)(import_tamagui.YStack, {
+    gap: "$4",
+    maxWidth: 400,
+    children: [/* @__PURE__ */(0, import_jsx_runtime.jsx)(import_index.FileUpload, {
+      label: "Small",
+      size: "$2",
+      placeholder: "Upload a file"
+    }), /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_index.FileUpload, {
+      label: "Medium (default)",
+      size: "$3",
+      placeholder: "Upload a file"
+    }), /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_index.FileUpload, {
+      label: "Large",
+      size: "$4",
+      placeholder: "Upload a file"
+    })]
+  })
+};
+const Interactive = {
+  render: () => {
+    const InteractiveExample = () => {
+      const [file, setFile] = (0, import_react.useState)(null);
+      return /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_tamagui.YStack, {
+        gap: "$4",
+        maxWidth: 400,
+        children: /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_index.FileUpload, {
+          label: "Upload File",
+          onChange: f => {
+            setFile(f);
+            (0, import_storybook.action)("onChange")(f);
+          },
+          helperText: file ? `Selected: ${file.name}` : "No file selected"
+        })
+      });
+    };
+    return /* @__PURE__ */(0, import_jsx_runtime.jsx)(InteractiveExample, {});
+  }
+};
+const ImageOnly = {
+  render: args => /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_index.FileUpload, {
+    ...args
+  }),
+  args: {
+    label: "Upload Image",
+    accept: "image/*",
+    showPreview: true,
+    helperText: "PNG, JPG, GIF up to 5MB",
+    maxSize: 5 * 1024 * 1024
+  }
+};