@onewelcome/react-lib-components 9.8.1 → 10.0.1

package/dist/components/Form/FileUpload/FileUpload.cjs.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"FileUpload.cjs.js","sources":["../../../../src/components/Form/FileUpload/FileUpload.tsx"],"sourcesContent":["/*\n * Copyright 2022 OneWelcome B.V.\n *\n *    Licensed under the Apache License, Version 2.0 (the \"License\");\n *    you may not use this file except in compliance with the License.\n *    You may obtain a copy of the License at\n *\n *        http://www.apache.org/licenses/LICENSE-2.0\n *\n *    Unless required by applicable law or agreed to in writing, software\n *    distributed under the License is distributed on an \"AS IS\" BASIS,\n *    WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n *    See the License for the specific language governing permissions and\n *    limitations under the License.\n */\n\nimport React, {\n  DragEvent,\n  DragEventHandler,\n  ForwardRefRenderFunction,\n  useEffect,\n  useRef,\n  useState\n} from \"react\";\nimport { Button } from \"../../Button/Button\";\nimport { FILE_ACTION, FileItem, Props as FileConfig } from \"./FileItem/FileItem\";\nimport { Props as InputProps } from \"../Input/Input\";\nimport { Typography } from \"../../Typography/Typography\";\nimport classes from \"./FileUpload.module.scss\";\nimport { useDetermineStatusIcon } from \"../../../hooks/useDetermineStatusIcon\";\nimport { Label } from \"../Label/Label\";\nimport { withReadOnly } from \"../../withReadOnly\";\n\ntype FileUploadType = Omit<InputProps, \"onDrop\" | \"type\" | \"onChange\" | \"suffix\" | \"prefix\">;\nexport type FileType = Omit<FileConfig, \"onRequestedFileAction\"> &\n  /* eslint-disable-next-line @typescript-eslint/no-explicit-any */\n  Pick<File, \"size\" | \"type\"> & { data?: any };\n\nexport interface Props extends FileUploadType {\n  accept: string;\n  title: string;\n  multiple: boolean;\n  fileList: FileType[];\n  exceedingMaxSizeErrorText?: string;\n  maxFileSizeInBytes?: number;\n  selectButtonText?: string;\n  dragAndDropText?: string;\n  onDragOver?: DragEventHandler;\n  onDragEnter?: DragEventHandler;\n  onDragLeave?: DragEventHandler;\n  onDrop?: (e: FileType[]) => void;\n  onChange?: (e: FileType[]) => void;\n  onRequestedFileAction?: (action: FILE_ACTION, name: FileType[\"name\"]) => void;\n  downloadFileLink?: string;\n  onDownloadFile?: () => void;\n  isRequired?: boolean;\n  invalidDropErrorMessage?: string;\n  noMultipleFileDropErrorMessage?: string;\n  readOnlyViewMessage?: string;\n  helperText?: string;\n}\n\nconst FileUploadComponent: ForwardRefRenderFunction<HTMLInputElement, Props> = (\n  {\n    name,\n    accept,\n    error,\n    success,\n    maxFileSizeInBytes,\n    multiple,\n    id,\n    title,\n    labeledBy,\n    disabled = false,\n    onChange,\n    dragAndDropText = \"Drag and drop or\",\n    selectButtonText = \"Browse file\",\n    readOnlyViewMessage = \"No file uploaded\",\n    onDragOver,\n    onDragLeave,\n    wrapperProps,\n    onDrop,\n    onRequestedFileAction,\n    exceedingMaxSizeErrorText,\n    fileList,\n    onDownloadFile,\n    downloadFileLink,\n    isRequired = true,\n    invalidDropErrorMessage = \"Invalid file format. Supported formats are: $accept.\",\n    noMultipleFileDropErrorMessage = \"You can upload only a single file.\",\n    helperText,\n    ...rest\n  }: Props,\n  ref\n) => {\n  const labelRef = useRef(null);\n  const [dragActive, setDragActive] = useState(false);\n  const [errorMsg, setErrorMsg] = useState(\"\");\n  const [inputError, setInputError] = useState(false);\n  const icon = useDetermineStatusIcon({ success, error });\n  const dropzoneClassNames = [classes[\"file-dropzone\"]];\n  const dropzoneContainerClassNames = [classes[\"upload-button-wrapper\"]];\n  const subTextClass = [classes[\"file-selector-sub-text\"]];\n  const errorTextClass = [classes[\"file-selector-sub-text\"]];\n  dragActive && dropzoneContainerClassNames.push(classes[\"drag-active\"]);\n  const hasError = inputError || error || errorMsg;\n  const readOnlyView = rest[\"data-readonlyview\"];\n  if (hasError) {\n    const errorClass = classes[\"error\"];\n    dropzoneClassNames.push(errorClass);\n    subTextClass.push(errorClass);\n    errorTextClass.push(errorClass);\n  }\n  disabled && dropzoneContainerClassNames.push(classes[\"disabled\"]);\n  success && !error && dropzoneClassNames.push(classes[\"success\"]);\n  const inputId = `input-${name}`;\n  const labelClasses = [classes[\"file-upload-title\"]];\n  isRequired && labelClasses.push(classes[\"required\"]);\n\n  const getFileList = (files: FileList | null): FileType[] => {\n    let savedFiles = fileList ? [...fileList] : [];\n    const fileNames = fileList.map(el => el.name);\n    files?.length &&\n      Array.from(files as ArrayLike<File>).forEach(el => {\n        if (!fileNames.includes(el.name)) {\n          savedFiles = multiple\n            ? [\n                ...savedFiles,\n                {\n                  ...validateUpload(el),\n                  data: el\n                }\n              ]\n            : [\n                {\n                  ...validateUpload(el),\n                  data: el\n                }\n              ];\n        }\n      });\n    return savedFiles;\n  };\n  const onInputChange = (e: React.ChangeEvent<HTMLInputElement>) => {\n    e.preventDefault();\n    e.stopPropagation();\n    const files = getFileList(e.target.files);\n    const isFileValid = files.length && verifyExtensionValidity(files[files.length - 1]);\n\n    if (isFileValid) {\n      setErrorMsg(\"\");\n      e.target.value = \"\";\n      onChange?.(files);\n    }\n  };\n\n  const verifyExtensionValidity = (file: FileType) => {\n    const extension = file.name.split(\".\").pop();\n    return extension && accept.includes(extension);\n  };\n\n  const validateUpload = (file: FileType) => {\n    const result: FileType = {\n      name: file.name,\n      size: file.size,\n      type: file.type\n    };\n\n    let err = false;\n\n    if (maxFileSizeInBytes && file.size && file.size >= maxFileSizeInBytes) {\n      let sizeMessage: string;\n      const isAtLeastOneMb = maxFileSizeInBytes >= 1024 * 1024;\n\n      if (isAtLeastOneMb) {\n        sizeMessage = `${parseFloat((maxFileSizeInBytes / (1024 * 1024)).toFixed(2))}MB`;\n      } else {\n        sizeMessage = `${parseFloat((maxFileSizeInBytes / 1024).toFixed(2))}KB`;\n      }\n\n      result.error =\n        exceedingMaxSizeErrorText ??\n        `The maximum allowed file size is ${sizeMessage}. Upload a smaller file.`;\n      result.status = \"error\";\n      err = true;\n    }\n\n    setInputError(err);\n    return result;\n  };\n\n  useEffect(() => {\n    if (fileList.length) {\n      const validatedFiles = fileList.map(file => validateUpload(file));\n      onChange?.(validatedFiles);\n    }\n  }, []);\n\n  const handleOnDragOver = (e: DragEvent<HTMLDivElement>) => {\n    e.preventDefault();\n    e.stopPropagation();\n    if (!dragActive) {\n      setDragActive(true);\n    }\n    onDragOver?.(e);\n  };\n\n  const handleOnDragLeave = (e: DragEvent<HTMLDivElement>) => {\n    e.preventDefault();\n    e.stopPropagation();\n    const target = e.target as HTMLElement;\n    if (target?.offsetParent?.classList.contains(classes[\"file-dropzone\"])) {\n      setDragActive(false);\n    }\n    onDragLeave?.(e);\n  };\n\n  const handleOnDrop = (e: DragEvent<HTMLDivElement>) => {\n    e.preventDefault();\n    e.stopPropagation();\n    if (e?.dataTransfer?.files && e.dataTransfer.files.length) {\n      const extension = e?.dataTransfer?.files[0]?.name.split(\".\").pop();\n      if (extension && accept && !accept.includes(extension)) {\n        setErrorMsg(invalidDropErrorMessage.replace(\"$accept\", accept));\n        setDragActive(false);\n        return;\n      } else if (!multiple && e.dataTransfer.files.length > 1) {\n        setErrorMsg(noMultipleFileDropErrorMessage);\n        setDragActive(false);\n        return;\n      } else {\n        setErrorMsg(\"\");\n      }\n      const validatedFiles = getFileList(e.dataTransfer.files);\n      onDrop ? onDrop?.(validatedFiles) : onChange?.(validatedFiles);\n    }\n    setDragActive(false);\n  };\n\n  return (\n    <div className={classes[\"file-upload-wrapper\"]} {...wrapperProps}>\n      <div className={classes[\"dropzone-wrapper\"]}>\n        <div className={dropzoneClassNames.join(\" \")} data-readonlyview={readOnlyView}>\n          <Label ref={labelRef} className={`${labelClasses.join(\" \")}`} htmlFor={inputId}>\n            {title}\n          </Label>\n          {fileList?.length > 0 && (\n            <ul className={classes[\"file-list\"]}>\n              {fileList.map(({ name, status, progress, error }) => (\n                <li key={name} className={status} id={name}>\n                  <FileItem\n                    name={name}\n                    key={`${name}_${status}`}\n                    status={status}\n                    progress={progress}\n                    error={error}\n                    downloadFileLink={downloadFileLink}\n                    onDownloadFile={onDownloadFile}\n                    onRequestedFileAction={onRequestedFileAction}\n                  />\n                </li>\n              ))}\n            </ul>\n          )}\n\n          <div\n            className={dropzoneContainerClassNames.join(\" \")}\n            onDragOver={e => !disabled && handleOnDragOver(e)}\n            onDragLeave={e => !disabled && handleOnDragLeave(e)}\n            onDrop={e => !disabled && handleOnDrop(e)}\n            tabIndex={readOnlyView ? 0 : -1}\n          >\n            <div className={classes[\"file-select\"]}>\n              <Typography variant=\"body\" className={\"drag-and-drop-text\"}>\n                {readOnlyView ? readOnlyViewMessage : dragAndDropText}\n              </Typography>\n\n              <div className={classes[\"file-upload-btn\"]}>\n                <Button variant=\"outline\" disabled={disabled}>\n                  {selectButtonText}\n                  <input\n                    {...rest}\n                    className={`${classes[\"upload-input\"]} ${rest.className}`}\n                    ref={ref}\n                    aria-labelledby={labeledBy}\n                    type=\"file\"\n                    id={inputId}\n                    name={name}\n                    multiple={multiple}\n                    disabled={disabled}\n                    accept={accept}\n                    onChange={onInputChange}\n                    spellCheck={false}\n                  />\n                </Button>\n              </div>\n              {!disabled && icon}\n              <span className={classes[\"outline\"]}></span>\n            </div>\n          </div>\n        </div>\n        {errorMsg && (\n          <Typography variant={\"sub-text\"} className={errorTextClass.join(\" \")}>\n            {errorMsg}\n          </Typography>\n        )}\n        {helperText && (\n          <Typography variant={\"sub-text\"} className={subTextClass.join(\" \")}>\n            {helperText}\n          </Typography>\n        )}\n      </div>\n    </div>\n  );\n};\n\nexport const FileUpload = withReadOnly(React.forwardRef(FileUploadComponent));\n"],"names":["FileUpload","withReadOnly","React","forwardRef","name","accept","error","success","maxFileSizeInBytes","multiple","id","title","labeledBy","disabled","onChange","dragAndDropText","selectButtonText","readOnlyViewMessage","onDragOver","onDragLeave","wrapperProps","onDrop","onRequestedFileAction","exceedingMaxSizeErrorText","fileList","onDownloadFile","downloadFileLink","isRequired","invalidDropErrorMessage","noMultipleFileDropErrorMessage","helperText","rest","ref","labelRef","useRef","dragActive","setDragActive","useState","errorMsg","setErrorMsg","inputError","setInputError","icon","useDetermineStatusIcon","dropzoneClassNames","classes","dropzoneContainerClassNames","subTextClass","errorTextClass","push","default","hasError","readOnlyView","errorClass","inputId","labelClasses","getFileList","files","savedFiles","fileNames","map","el","length","Array","from","forEach","includes","validateUpload","data","file","result","size","type","err","sizeMessage","parseFloat","toFixed","status","useEffect","validatedFiles","createElement","className","join","Label","htmlFor","progress","key","FileItem","e","preventDefault","stopPropagation","handleOnDragOver","target","_a","offsetParent","classList","contains","handleOnDragLeave","dataTransfer","extension","_c","_b","split","pop","replace","handleOnDrop","tabIndex","Typography","variant","Button","verifyExtensionValidity","value","spellCheck"],"mappings":"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"}

package/dist/components/Form/FileUpload/FileUpload.es.js

@@ -0,0 +1,210 @@
+import React, { useRef, useState, useEffect } from "react";
+import { Button } from "../../Button/Button.es.js";
+import { FileItem } from "./FileItem/FileItem.es.js";
+import { Typography } from "../../Typography/Typography.es.js";
+import classes from "./FileUpload.module.scss.es.js";
+import { useDetermineStatusIcon } from "../../../hooks/useDetermineStatusIcon.es.js";
+import { Label } from "../Label/Label.es.js";
+import { withReadOnly } from "../../withReadOnly.es.js";
+const FileUploadComponent = ({
+  name,
+  accept,
+  error,
+  success,
+  maxFileSizeInBytes,
+  multiple,
+  id,
+  title,
+  labeledBy,
+  disabled = false,
+  onChange,
+  dragAndDropText = "Drag and drop or",
+  selectButtonText = "Browse file",
+  readOnlyViewMessage = "No file uploaded",
+  onDragOver,
+  onDragLeave,
+  wrapperProps,
+  onDrop,
+  onRequestedFileAction,
+  exceedingMaxSizeErrorText,
+  fileList,
+  onDownloadFile,
+  downloadFileLink,
+  isRequired = true,
+  invalidDropErrorMessage = "Invalid file format. Supported formats are: $accept.",
+  noMultipleFileDropErrorMessage = "You can upload only a single file.",
+  helperText,
+  ...rest
+}, ref) => {
+  const labelRef = useRef(null);
+  const [dragActive, setDragActive] = useState(false);
+  const [errorMsg, setErrorMsg] = useState("");
+  const [inputError, setInputError] = useState(false);
+  const icon = useDetermineStatusIcon({ success, error });
+  const dropzoneClassNames = [classes["file-dropzone"]];
+  const dropzoneContainerClassNames = [classes["upload-button-wrapper"]];
+  const subTextClass = [classes["file-selector-sub-text"]];
+  const errorTextClass = [classes["file-selector-sub-text"]];
+  dragActive && dropzoneContainerClassNames.push(classes["drag-active"]);
+  const hasError = inputError || error || errorMsg;
+  const readOnlyView = rest["data-readonlyview"];
+  if (hasError) {
+    const errorClass = classes["error"];
+    dropzoneClassNames.push(errorClass);
+    subTextClass.push(errorClass);
+    errorTextClass.push(errorClass);
+  }
+  disabled && dropzoneContainerClassNames.push(classes["disabled"]);
+  success && !error && dropzoneClassNames.push(classes["success"]);
+  const inputId = `input-${name}`;
+  const labelClasses = [classes["file-upload-title"]];
+  isRequired && labelClasses.push(classes["required"]);
+  const getFileList = (files) => {
+    let savedFiles = fileList ? [...fileList] : [];
+    const fileNames = fileList.map((el) => el.name);
+    (files == null ? void 0 : files.length) && Array.from(files).forEach((el) => {
+      if (!fileNames.includes(el.name)) {
+        savedFiles = multiple ? [
+          ...savedFiles,
+          {
+            ...validateUpload(el),
+            data: el
+          }
+        ] : [
+          {
+            ...validateUpload(el),
+            data: el
+          }
+        ];
+      }
+    });
+    return savedFiles;
+  };
+  const onInputChange = (e) => {
+    e.preventDefault();
+    e.stopPropagation();
+    const files = getFileList(e.target.files);
+    const isFileValid = files.length && verifyExtensionValidity(files[files.length - 1]);
+    if (isFileValid) {
+      setErrorMsg("");
+      e.target.value = "";
+      onChange == null ? void 0 : onChange(files);
+    }
+  };
+  const verifyExtensionValidity = (file) => {
+    const extension = file.name.split(".").pop();
+    return extension && accept.includes(extension);
+  };
+  const validateUpload = (file) => {
+    const result = {
+      name: file.name,
+      size: file.size,
+      type: file.type
+    };
+    let err = false;
+    if (maxFileSizeInBytes && file.size && file.size >= maxFileSizeInBytes) {
+      let sizeMessage;
+      const isAtLeastOneMb = maxFileSizeInBytes >= 1024 * 1024;
+      if (isAtLeastOneMb) {
+        sizeMessage = `${parseFloat((maxFileSizeInBytes / (1024 * 1024)).toFixed(2))}MB`;
+      } else {
+        sizeMessage = `${parseFloat((maxFileSizeInBytes / 1024).toFixed(2))}KB`;
+      }
+      result.error = exceedingMaxSizeErrorText ?? `The maximum allowed file size is ${sizeMessage}. Upload a smaller file.`;
+      result.status = "error";
+      err = true;
+    }
+    setInputError(err);
+    return result;
+  };
+  useEffect(() => {
+    if (fileList.length) {
+      const validatedFiles = fileList.map((file) => validateUpload(file));
+      onChange == null ? void 0 : onChange(validatedFiles);
+    }
+  }, []);
+  const handleOnDragOver = (e) => {
+    e.preventDefault();
+    e.stopPropagation();
+    if (!dragActive) {
+      setDragActive(true);
+    }
+    onDragOver == null ? void 0 : onDragOver(e);
+  };
+  const handleOnDragLeave = (e) => {
+    var _a;
+    e.preventDefault();
+    e.stopPropagation();
+    const target = e.target;
+    if ((_a = target == null ? void 0 : target.offsetParent) == null ? void 0 : _a.classList.contains(classes["file-dropzone"])) {
+      setDragActive(false);
+    }
+    onDragLeave == null ? void 0 : onDragLeave(e);
+  };
+  const handleOnDrop = (e) => {
+    var _a, _b, _c;
+    e.preventDefault();
+    e.stopPropagation();
+    if (((_a = e == null ? void 0 : e.dataTransfer) == null ? void 0 : _a.files) && e.dataTransfer.files.length) {
+      const extension = (_c = (_b = e == null ? void 0 : e.dataTransfer) == null ? void 0 : _b.files[0]) == null ? void 0 : _c.name.split(".").pop();
+      if (extension && accept && !accept.includes(extension)) {
+        setErrorMsg(invalidDropErrorMessage.replace("$accept", accept));
+        setDragActive(false);
+        return;
+      } else if (!multiple && e.dataTransfer.files.length > 1) {
+        setErrorMsg(noMultipleFileDropErrorMessage);
+        setDragActive(false);
+        return;
+      } else {
+        setErrorMsg("");
+      }
+      const validatedFiles = getFileList(e.dataTransfer.files);
+      onDrop ? onDrop == null ? void 0 : onDrop(validatedFiles) : onChange == null ? void 0 : onChange(validatedFiles);
+    }
+    setDragActive(false);
+  };
+  return /* @__PURE__ */ React.createElement("div", { className: classes["file-upload-wrapper"], ...wrapperProps }, /* @__PURE__ */ React.createElement("div", { className: classes["dropzone-wrapper"] }, /* @__PURE__ */ React.createElement("div", { className: dropzoneClassNames.join(" "), "data-readonlyview": readOnlyView }, /* @__PURE__ */ React.createElement(Label, { ref: labelRef, className: `${labelClasses.join(" ")}`, htmlFor: inputId }, title), (fileList == null ? void 0 : fileList.length) > 0 && /* @__PURE__ */ React.createElement("ul", { className: classes["file-list"] }, fileList.map(({ name: name2, status, progress, error: error2 }) => /* @__PURE__ */ React.createElement("li", { key: name2, className: status, id: name2 }, /* @__PURE__ */ React.createElement(
+    FileItem,
+    {
+      name: name2,
+      key: `${name2}_${status}`,
+      status,
+      progress,
+      error: error2,
+      downloadFileLink,
+      onDownloadFile,
+      onRequestedFileAction
+    }
+  )))), /* @__PURE__ */ React.createElement(
+    "div",
+    {
+      className: dropzoneContainerClassNames.join(" "),
+      onDragOver: (e) => !disabled && handleOnDragOver(e),
+      onDragLeave: (e) => !disabled && handleOnDragLeave(e),
+      onDrop: (e) => !disabled && handleOnDrop(e),
+      tabIndex: readOnlyView ? 0 : -1
+    },
+    /* @__PURE__ */ React.createElement("div", { className: classes["file-select"] }, /* @__PURE__ */ React.createElement(Typography, { variant: "body", className: "drag-and-drop-text" }, readOnlyView ? readOnlyViewMessage : dragAndDropText), /* @__PURE__ */ React.createElement("div", { className: classes["file-upload-btn"] }, /* @__PURE__ */ React.createElement(Button, { variant: "outline", disabled }, selectButtonText, /* @__PURE__ */ React.createElement(
+      "input",
+      {
+        ...rest,
+        className: `${classes["upload-input"]} ${rest.className}`,
+        ref,
+        "aria-labelledby": labeledBy,
+        type: "file",
+        id: inputId,
+        name,
+        multiple,
+        disabled,
+        accept,
+        onChange: onInputChange,
+        spellCheck: false
+      }
+    ))), !disabled && icon, /* @__PURE__ */ React.createElement("span", { className: classes["outline"] }))
+  )), errorMsg && /* @__PURE__ */ React.createElement(Typography, { variant: "sub-text", className: errorTextClass.join(" ") }, errorMsg), helperText && /* @__PURE__ */ React.createElement(Typography, { variant: "sub-text", className: subTextClass.join(" ") }, helperText)));
+};
+const FileUpload = withReadOnly(React.forwardRef(FileUploadComponent));
+export {
+  FileUpload
+};
+//# sourceMappingURL=FileUpload.es.js.map

package/dist/components/Form/FileUpload/FileUpload.es.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"FileUpload.es.js","sources":["../../../../src/components/Form/FileUpload/FileUpload.tsx"],"sourcesContent":["/*\n * Copyright 2022 OneWelcome B.V.\n *\n *    Licensed under the Apache License, Version 2.0 (the \"License\");\n *    you may not use this file except in compliance with the License.\n *    You may obtain a copy of the License at\n *\n *        http://www.apache.org/licenses/LICENSE-2.0\n *\n *    Unless required by applicable law or agreed to in writing, software\n *    distributed under the License is distributed on an \"AS IS\" BASIS,\n *    WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n *    See the License for the specific language governing permissions and\n *    limitations under the License.\n */\n\nimport React, {\n  DragEvent,\n  DragEventHandler,\n  ForwardRefRenderFunction,\n  useEffect,\n  useRef,\n  useState\n} from \"react\";\nimport { Button } from \"../../Button/Button\";\nimport { FILE_ACTION, FileItem, Props as FileConfig } from \"./FileItem/FileItem\";\nimport { Props as InputProps } from \"../Input/Input\";\nimport { Typography } from \"../../Typography/Typography\";\nimport classes from \"./FileUpload.module.scss\";\nimport { useDetermineStatusIcon } from \"../../../hooks/useDetermineStatusIcon\";\nimport { Label } from \"../Label/Label\";\nimport { withReadOnly } from \"../../withReadOnly\";\n\ntype FileUploadType = Omit<InputProps, \"onDrop\" | \"type\" | \"onChange\" | \"suffix\" | \"prefix\">;\nexport type FileType = Omit<FileConfig, \"onRequestedFileAction\"> &\n  /* eslint-disable-next-line @typescript-eslint/no-explicit-any */\n  Pick<File, \"size\" | \"type\"> & { data?: any };\n\nexport interface Props extends FileUploadType {\n  accept: string;\n  title: string;\n  multiple: boolean;\n  fileList: FileType[];\n  exceedingMaxSizeErrorText?: string;\n  maxFileSizeInBytes?: number;\n  selectButtonText?: string;\n  dragAndDropText?: string;\n  onDragOver?: DragEventHandler;\n  onDragEnter?: DragEventHandler;\n  onDragLeave?: DragEventHandler;\n  onDrop?: (e: FileType[]) => void;\n  onChange?: (e: FileType[]) => void;\n  onRequestedFileAction?: (action: FILE_ACTION, name: FileType[\"name\"]) => void;\n  downloadFileLink?: string;\n  onDownloadFile?: () => void;\n  isRequired?: boolean;\n  invalidDropErrorMessage?: string;\n  noMultipleFileDropErrorMessage?: string;\n  readOnlyViewMessage?: string;\n  helperText?: string;\n}\n\nconst FileUploadComponent: ForwardRefRenderFunction<HTMLInputElement, Props> = (\n  {\n    name,\n    accept,\n    error,\n    success,\n    maxFileSizeInBytes,\n    multiple,\n    id,\n    title,\n    labeledBy,\n    disabled = false,\n    onChange,\n    dragAndDropText = \"Drag and drop or\",\n    selectButtonText = \"Browse file\",\n    readOnlyViewMessage = \"No file uploaded\",\n    onDragOver,\n    onDragLeave,\n    wrapperProps,\n    onDrop,\n    onRequestedFileAction,\n    exceedingMaxSizeErrorText,\n    fileList,\n    onDownloadFile,\n    downloadFileLink,\n    isRequired = true,\n    invalidDropErrorMessage = \"Invalid file format. Supported formats are: $accept.\",\n    noMultipleFileDropErrorMessage = \"You can upload only a single file.\",\n    helperText,\n    ...rest\n  }: Props,\n  ref\n) => {\n  const labelRef = useRef(null);\n  const [dragActive, setDragActive] = useState(false);\n  const [errorMsg, setErrorMsg] = useState(\"\");\n  const [inputError, setInputError] = useState(false);\n  const icon = useDetermineStatusIcon({ success, error });\n  const dropzoneClassNames = [classes[\"file-dropzone\"]];\n  const dropzoneContainerClassNames = [classes[\"upload-button-wrapper\"]];\n  const subTextClass = [classes[\"file-selector-sub-text\"]];\n  const errorTextClass = [classes[\"file-selector-sub-text\"]];\n  dragActive && dropzoneContainerClassNames.push(classes[\"drag-active\"]);\n  const hasError = inputError || error || errorMsg;\n  const readOnlyView = rest[\"data-readonlyview\"];\n  if (hasError) {\n    const errorClass = classes[\"error\"];\n    dropzoneClassNames.push(errorClass);\n    subTextClass.push(errorClass);\n    errorTextClass.push(errorClass);\n  }\n  disabled && dropzoneContainerClassNames.push(classes[\"disabled\"]);\n  success && !error && dropzoneClassNames.push(classes[\"success\"]);\n  const inputId = `input-${name}`;\n  const labelClasses = [classes[\"file-upload-title\"]];\n  isRequired && labelClasses.push(classes[\"required\"]);\n\n  const getFileList = (files: FileList | null): FileType[] => {\n    let savedFiles = fileList ? [...fileList] : [];\n    const fileNames = fileList.map(el => el.name);\n    files?.length &&\n      Array.from(files as ArrayLike<File>).forEach(el => {\n        if (!fileNames.includes(el.name)) {\n          savedFiles = multiple\n            ? [\n                ...savedFiles,\n                {\n                  ...validateUpload(el),\n                  data: el\n                }\n              ]\n            : [\n                {\n                  ...validateUpload(el),\n                  data: el\n                }\n              ];\n        }\n      });\n    return savedFiles;\n  };\n  const onInputChange = (e: React.ChangeEvent<HTMLInputElement>) => {\n    e.preventDefault();\n    e.stopPropagation();\n    const files = getFileList(e.target.files);\n    const isFileValid = files.length && verifyExtensionValidity(files[files.length - 1]);\n\n    if (isFileValid) {\n      setErrorMsg(\"\");\n      e.target.value = \"\";\n      onChange?.(files);\n    }\n  };\n\n  const verifyExtensionValidity = (file: FileType) => {\n    const extension = file.name.split(\".\").pop();\n    return extension && accept.includes(extension);\n  };\n\n  const validateUpload = (file: FileType) => {\n    const result: FileType = {\n      name: file.name,\n      size: file.size,\n      type: file.type\n    };\n\n    let err = false;\n\n    if (maxFileSizeInBytes && file.size && file.size >= maxFileSizeInBytes) {\n      let sizeMessage: string;\n      const isAtLeastOneMb = maxFileSizeInBytes >= 1024 * 1024;\n\n      if (isAtLeastOneMb) {\n        sizeMessage = `${parseFloat((maxFileSizeInBytes / (1024 * 1024)).toFixed(2))}MB`;\n      } else {\n        sizeMessage = `${parseFloat((maxFileSizeInBytes / 1024).toFixed(2))}KB`;\n      }\n\n      result.error =\n        exceedingMaxSizeErrorText ??\n        `The maximum allowed file size is ${sizeMessage}. Upload a smaller file.`;\n      result.status = \"error\";\n      err = true;\n    }\n\n    setInputError(err);\n    return result;\n  };\n\n  useEffect(() => {\n    if (fileList.length) {\n      const validatedFiles = fileList.map(file => validateUpload(file));\n      onChange?.(validatedFiles);\n    }\n  }, []);\n\n  const handleOnDragOver = (e: DragEvent<HTMLDivElement>) => {\n    e.preventDefault();\n    e.stopPropagation();\n    if (!dragActive) {\n      setDragActive(true);\n    }\n    onDragOver?.(e);\n  };\n\n  const handleOnDragLeave = (e: DragEvent<HTMLDivElement>) => {\n    e.preventDefault();\n    e.stopPropagation();\n    const target = e.target as HTMLElement;\n    if (target?.offsetParent?.classList.contains(classes[\"file-dropzone\"])) {\n      setDragActive(false);\n    }\n    onDragLeave?.(e);\n  };\n\n  const handleOnDrop = (e: DragEvent<HTMLDivElement>) => {\n    e.preventDefault();\n    e.stopPropagation();\n    if (e?.dataTransfer?.files && e.dataTransfer.files.length) {\n      const extension = e?.dataTransfer?.files[0]?.name.split(\".\").pop();\n      if (extension && accept && !accept.includes(extension)) {\n        setErrorMsg(invalidDropErrorMessage.replace(\"$accept\", accept));\n        setDragActive(false);\n        return;\n      } else if (!multiple && e.dataTransfer.files.length > 1) {\n        setErrorMsg(noMultipleFileDropErrorMessage);\n        setDragActive(false);\n        return;\n      } else {\n        setErrorMsg(\"\");\n      }\n      const validatedFiles = getFileList(e.dataTransfer.files);\n      onDrop ? onDrop?.(validatedFiles) : onChange?.(validatedFiles);\n    }\n    setDragActive(false);\n  };\n\n  return (\n    <div className={classes[\"file-upload-wrapper\"]} {...wrapperProps}>\n      <div className={classes[\"dropzone-wrapper\"]}>\n        <div className={dropzoneClassNames.join(\" \")} data-readonlyview={readOnlyView}>\n          <Label ref={labelRef} className={`${labelClasses.join(\" \")}`} htmlFor={inputId}>\n            {title}\n          </Label>\n          {fileList?.length > 0 && (\n            <ul className={classes[\"file-list\"]}>\n              {fileList.map(({ name, status, progress, error }) => (\n                <li key={name} className={status} id={name}>\n                  <FileItem\n                    name={name}\n                    key={`${name}_${status}`}\n                    status={status}\n                    progress={progress}\n                    error={error}\n                    downloadFileLink={downloadFileLink}\n                    onDownloadFile={onDownloadFile}\n                    onRequestedFileAction={onRequestedFileAction}\n                  />\n                </li>\n              ))}\n            </ul>\n          )}\n\n          <div\n            className={dropzoneContainerClassNames.join(\" \")}\n            onDragOver={e => !disabled && handleOnDragOver(e)}\n            onDragLeave={e => !disabled && handleOnDragLeave(e)}\n            onDrop={e => !disabled && handleOnDrop(e)}\n            tabIndex={readOnlyView ? 0 : -1}\n          >\n            <div className={classes[\"file-select\"]}>\n              <Typography variant=\"body\" className={\"drag-and-drop-text\"}>\n                {readOnlyView ? readOnlyViewMessage : dragAndDropText}\n              </Typography>\n\n              <div className={classes[\"file-upload-btn\"]}>\n                <Button variant=\"outline\" disabled={disabled}>\n                  {selectButtonText}\n                  <input\n                    {...rest}\n                    className={`${classes[\"upload-input\"]} ${rest.className}`}\n                    ref={ref}\n                    aria-labelledby={labeledBy}\n                    type=\"file\"\n                    id={inputId}\n                    name={name}\n                    multiple={multiple}\n                    disabled={disabled}\n                    accept={accept}\n                    onChange={onInputChange}\n                    spellCheck={false}\n                  />\n                </Button>\n              </div>\n              {!disabled && icon}\n              <span className={classes[\"outline\"]}></span>\n            </div>\n          </div>\n        </div>\n        {errorMsg && (\n          <Typography variant={\"sub-text\"} className={errorTextClass.join(\" \")}>\n            {errorMsg}\n          </Typography>\n        )}\n        {helperText && (\n          <Typography variant={\"sub-text\"} className={subTextClass.join(\" \")}>\n            {helperText}\n          </Typography>\n        )}\n      </div>\n    </div>\n  );\n};\n\nexport const FileUpload = withReadOnly(React.forwardRef(FileUploadComponent));\n"],"names":["name","error"],"mappings":"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"}

package/dist/components/Form/FileUpload/FileUpload.module.scss.cjs.js

@@ -0,0 +1,3 @@
+!function(){"use strict";try{if("undefined"!=typeof document){var e=document.createElement("style");e.appendChild(document.createTextNode('.FileUpload_sr-only_k4xuc{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);border:0}.FileUpload_hidden_k4xuc{display:none}.FileUpload_slide-in_k4xuc{animation:FileUpload_slide-in_k4xuc .5s forwards}@media (prefers-reduced-motion: reduce){.FileUpload_slide-in_k4xuc{animation-duration:.1ms}}.FileUpload_slide-out_k4xuc{animation:FileUpload_slide-out_k4xuc .5s forwards}@media (prefers-reduced-motion: reduce){.FileUpload_slide-out_k4xuc{animation-duration:.1ms}}@keyframes FileUpload_slide-in_k4xuc{0%{transform:translateY(100vh)}to{transform:translateY(0)}}@keyframes FileUpload_slide-out_k4xuc{0%{transform:translateY(0)}to{transform:translateY(100vh)}}/*!\n * Copyright 2022 OneWelcome B.V.\n *\n *    Licensed under the Apache License, Version 2.0 (the "License");\n *    you may not use this file except in compliance with the License.\n *    You may obtain a copy of the License at\n *\n *        http://www.apache.org/licenses/LICENSE-2.0\n *\n *    Unless required by applicable law or agreed to in writing, software\n *    distributed under the License is distributed on an "AS IS" BASIS,\n *    WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n *    See the License for the specific language governing permissions and\n *    limitations under the License.\n */.FileUpload_file-upload-wrapper_k4xuc{display:flex;flex-direction:column}.FileUpload_file-dropzone_k4xuc{border-radius:var(--input-border-radius);background-color:var(--input-background-color);position:relative}.FileUpload_file-dropzone_k4xuc .FileUpload_file-upload-title_k4xuc{margin:0 0 .25rem;font-family:var(--font-family);font-size:var(--form-control-font-size);line-height:var(--default-line-height);color:var(--color-blue-grey900);font-weight:400;display:block}.FileUpload_file-dropzone_k4xuc .FileUpload_file-upload-title_k4xuc.FileUpload_required_k4xuc:after{content:" *";color:var(--error)}.FileUpload_file-dropzone_k4xuc.FileUpload_error_k4xuc span[data-icon-status],.FileUpload_file-dropzone_k4xuc.FileUpload_error_k4xuc .FileUpload_file-upload-title_k4xuc{color:var(--error)}.FileUpload_file-dropzone_k4xuc.FileUpload_error_k4xuc .FileUpload_file-select_k4xuc{border-color:var(--error)}.FileUpload_file-dropzone_k4xuc.FileUpload_success_k4xuc span[data-icon-status]{color:var(--success)}.FileUpload_file-dropzone_k4xuc .FileUpload_upload-button-wrapper_k4xuc.FileUpload_disabled_k4xuc{pointer-events:none}.FileUpload_file-dropzone_k4xuc .FileUpload_upload-button-wrapper_k4xuc.FileUpload_disabled_k4xuc p{color:var(--color-blue-grey400)}.FileUpload_file-dropzone_k4xuc span[data-icon-status]{font-size:var(--font-size-big);position:absolute;top:auto;right:2rem}.FileUpload_file-dropzone_k4xuc{transition-property:all;transition-duration:.2s;transition-timing-function:ease-in-out}@media (prefers-reduced-motion: reduce){.FileUpload_file-dropzone_k4xuc{transition-duration:.1ms}}.FileUpload_file-dropzone_k4xuc[data-readonlyview=true]:has(.FileUpload_file-list_k4xuc) .FileUpload_required_k4xuc:after{display:none}.FileUpload_file-dropzone_k4xuc[data-readonlyview=true]:has(.FileUpload_file-list_k4xuc) ul li p span[data-icon]:before{color:var(--color-blue-grey900)}.FileUpload_file-dropzone_k4xuc[data-readonlyview=true]:has(.FileUpload_file-list_k4xuc) ul li button{visibility:hidden}.FileUpload_file-dropzone_k4xuc[data-readonlyview=true]:has(.FileUpload_file-list_k4xuc) .FileUpload_upload-button-wrapper_k4xuc{display:none}.FileUpload_file-dropzone_k4xuc[data-readonlyview=true]:not(:has(.FileUpload_file-list_k4xuc)) .FileUpload_upload-button-wrapper_k4xuc{min-height:4.5rem}.FileUpload_file-dropzone_k4xuc[data-readonlyview=true]:not(:has(.FileUpload_file-list_k4xuc)) .FileUpload_upload-button-wrapper_k4xuc .FileUpload_file-select_k4xuc{border:0}.FileUpload_file-dropzone_k4xuc[data-readonlyview=true]:not(:has(.FileUpload_file-list_k4xuc)) .FileUpload_upload-button-wrapper_k4xuc .FileUpload_file-select_k4xuc p{color:var(--read-only-text-color)}.FileUpload_file-dropzone_k4xuc[data-readonlyview=true]:not(:has(.FileUpload_file-list_k4xuc)) .FileUpload_upload-button-wrapper_k4xuc .FileUpload_file-upload-btn_k4xuc{display:none}.FileUpload_file-dropzone_k4xuc[data-readonlyview=true]:not(:has(.FileUpload_file-list_k4xuc)) .FileUpload_required_k4xuc:after{display:none}.FileUpload_upload-button-wrapper_k4xuc{background:var(--color-blue-grey25);padding:4px}.FileUpload_upload-button-wrapper_k4xuc.FileUpload_drag-active_k4xuc .FileUpload_outline_k4xuc{position:absolute;margin:0;padding:0;top:0;right:0;bottom:0;left:0;border:var(--file-upload-border-width) var(--drag-drop-border-style) var(--color-blue-grey500);border-radius:var(--input-border-radius);background-color:var(--color-primary50);transition-property:all;transition-duration:.2s;transition-timing-function:ease-in-out}@media (prefers-reduced-motion: reduce){.FileUpload_upload-button-wrapper_k4xuc.FileUpload_drag-active_k4xuc .FileUpload_outline_k4xuc{transition-duration:.1ms}}.FileUpload_upload-button-wrapper_k4xuc.FileUpload_drag-active_k4xuc .FileUpload_outline_k4xuc:before{content:"Drop here";text-align:center;display:block;color:var(--color-primary);padding-top:2rem}.FileUpload_upload-button-wrapper_k4xuc.FileUpload_drag-active_k4xuc:hover .FileUpload_outline_k4xuc{background-color:var(--color-primary50)}.FileUpload_upload-button-wrapper_k4xuc.FileUpload_drag-active_k4xuc .FileUpload_file-select_k4xuc{position:relative}.FileUpload_upload-button-wrapper_k4xuc.FileUpload_drag-active_k4xuc .FileUpload_error_k4xuc .FileUpload_outline_k4xuc{border-color:var(--error)}.FileUpload_file-selector-sub-text_k4xuc{color:var(--greyed-out)}.FileUpload_file-selector-sub-text_k4xuc.FileUpload_error_k4xuc{color:var(--error);display:block}.FileUpload_file-selector-helper-text_k4xuc{color:var(--greyed-out);display:block}.FileUpload_file-select_k4xuc{display:flex;align-items:center;flex-direction:row;justify-content:center;border:var(--file-upload-border-width) var(--drag-drop-border-style) var(--color-blue-grey100);padding:1.25rem}.FileUpload_file-select_k4xuc [class*=file]{font-size:var(--font-size-big);margin-left:.5rem}.FileUpload_file-select_k4xuc [class*=typography]{margin-bottom:0}.FileUpload_upload-input_k4xuc{display:block;width:100%;border:none;text-transform:none;position:absolute;top:0;left:0;right:0;bottom:0;opacity:0;cursor:pointer}.FileUpload_upload-input_k4xuc:focus{outline:none}.FileUpload_file-upload-btn_k4xuc{position:relative}.FileUpload_file-list_k4xuc{list-style:none;padding:0;margin:.25rem 0}.FileUpload_file-list_k4xuc li:not(:last-child){margin-bottom:.5rem}')),document.head.appendChild(e)}}catch(o){console.error("vite-plugin-css-injected-by-js",o)}}();
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e="FileUpload_required_k4xuc",l="FileUpload_error_k4xuc",o="FileUpload_success_k4xuc",i="FileUpload_disabled_k4xuc",u="FileUpload_outline_k4xuc",p={"file-upload-wrapper":"FileUpload_file-upload-wrapper_k4xuc","file-dropzone":"FileUpload_file-dropzone_k4xuc","file-upload-title":"FileUpload_file-upload-title_k4xuc",required:e,error:l,"file-select":"FileUpload_file-select_k4xuc",success:o,"upload-button-wrapper":"FileUpload_upload-button-wrapper_k4xuc",disabled:i,"file-list":"FileUpload_file-list_k4xuc","file-upload-btn":"FileUpload_file-upload-btn_k4xuc","drag-active":"FileUpload_drag-active_k4xuc",outline:u,"file-selector-sub-text":"FileUpload_file-selector-sub-text_k4xuc","upload-input":"FileUpload_upload-input_k4xuc"};exports.default=p,exports.disabled=i,exports.error=l,exports.outline=u,exports.required=e,exports.success=o;
+//# sourceMappingURL=FileUpload.module.scss.cjs.js.map

package/dist/components/Form/FileUpload/FileUpload.module.scss.es.js

@@ -0,0 +1,32 @@
+!function(){"use strict";try{if("undefined"!=typeof document){var e=document.createElement("style");e.appendChild(document.createTextNode('.FileUpload_sr-only_k4xuc{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);border:0}.FileUpload_hidden_k4xuc{display:none}.FileUpload_slide-in_k4xuc{animation:FileUpload_slide-in_k4xuc .5s forwards}@media (prefers-reduced-motion: reduce){.FileUpload_slide-in_k4xuc{animation-duration:.1ms}}.FileUpload_slide-out_k4xuc{animation:FileUpload_slide-out_k4xuc .5s forwards}@media (prefers-reduced-motion: reduce){.FileUpload_slide-out_k4xuc{animation-duration:.1ms}}@keyframes FileUpload_slide-in_k4xuc{0%{transform:translateY(100vh)}to{transform:translateY(0)}}@keyframes FileUpload_slide-out_k4xuc{0%{transform:translateY(0)}to{transform:translateY(100vh)}}/*!\n * Copyright 2022 OneWelcome B.V.\n *\n *    Licensed under the Apache License, Version 2.0 (the "License");\n *    you may not use this file except in compliance with the License.\n *    You may obtain a copy of the License at\n *\n *        http://www.apache.org/licenses/LICENSE-2.0\n *\n *    Unless required by applicable law or agreed to in writing, software\n *    distributed under the License is distributed on an "AS IS" BASIS,\n *    WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n *    See the License for the specific language governing permissions and\n *    limitations under the License.\n */.FileUpload_file-upload-wrapper_k4xuc{display:flex;flex-direction:column}.FileUpload_file-dropzone_k4xuc{border-radius:var(--input-border-radius);background-color:var(--input-background-color);position:relative}.FileUpload_file-dropzone_k4xuc .FileUpload_file-upload-title_k4xuc{margin:0 0 .25rem;font-family:var(--font-family);font-size:var(--form-control-font-size);line-height:var(--default-line-height);color:var(--color-blue-grey900);font-weight:400;display:block}.FileUpload_file-dropzone_k4xuc .FileUpload_file-upload-title_k4xuc.FileUpload_required_k4xuc:after{content:" *";color:var(--error)}.FileUpload_file-dropzone_k4xuc.FileUpload_error_k4xuc span[data-icon-status],.FileUpload_file-dropzone_k4xuc.FileUpload_error_k4xuc .FileUpload_file-upload-title_k4xuc{color:var(--error)}.FileUpload_file-dropzone_k4xuc.FileUpload_error_k4xuc .FileUpload_file-select_k4xuc{border-color:var(--error)}.FileUpload_file-dropzone_k4xuc.FileUpload_success_k4xuc span[data-icon-status]{color:var(--success)}.FileUpload_file-dropzone_k4xuc .FileUpload_upload-button-wrapper_k4xuc.FileUpload_disabled_k4xuc{pointer-events:none}.FileUpload_file-dropzone_k4xuc .FileUpload_upload-button-wrapper_k4xuc.FileUpload_disabled_k4xuc p{color:var(--color-blue-grey400)}.FileUpload_file-dropzone_k4xuc span[data-icon-status]{font-size:var(--font-size-big);position:absolute;top:auto;right:2rem}.FileUpload_file-dropzone_k4xuc{transition-property:all;transition-duration:.2s;transition-timing-function:ease-in-out}@media (prefers-reduced-motion: reduce){.FileUpload_file-dropzone_k4xuc{transition-duration:.1ms}}.FileUpload_file-dropzone_k4xuc[data-readonlyview=true]:has(.FileUpload_file-list_k4xuc) .FileUpload_required_k4xuc:after{display:none}.FileUpload_file-dropzone_k4xuc[data-readonlyview=true]:has(.FileUpload_file-list_k4xuc) ul li p span[data-icon]:before{color:var(--color-blue-grey900)}.FileUpload_file-dropzone_k4xuc[data-readonlyview=true]:has(.FileUpload_file-list_k4xuc) ul li button{visibility:hidden}.FileUpload_file-dropzone_k4xuc[data-readonlyview=true]:has(.FileUpload_file-list_k4xuc) .FileUpload_upload-button-wrapper_k4xuc{display:none}.FileUpload_file-dropzone_k4xuc[data-readonlyview=true]:not(:has(.FileUpload_file-list_k4xuc)) .FileUpload_upload-button-wrapper_k4xuc{min-height:4.5rem}.FileUpload_file-dropzone_k4xuc[data-readonlyview=true]:not(:has(.FileUpload_file-list_k4xuc)) .FileUpload_upload-button-wrapper_k4xuc .FileUpload_file-select_k4xuc{border:0}.FileUpload_file-dropzone_k4xuc[data-readonlyview=true]:not(:has(.FileUpload_file-list_k4xuc)) .FileUpload_upload-button-wrapper_k4xuc .FileUpload_file-select_k4xuc p{color:var(--read-only-text-color)}.FileUpload_file-dropzone_k4xuc[data-readonlyview=true]:not(:has(.FileUpload_file-list_k4xuc)) .FileUpload_upload-button-wrapper_k4xuc .FileUpload_file-upload-btn_k4xuc{display:none}.FileUpload_file-dropzone_k4xuc[data-readonlyview=true]:not(:has(.FileUpload_file-list_k4xuc)) .FileUpload_required_k4xuc:after{display:none}.FileUpload_upload-button-wrapper_k4xuc{background:var(--color-blue-grey25);padding:4px}.FileUpload_upload-button-wrapper_k4xuc.FileUpload_drag-active_k4xuc .FileUpload_outline_k4xuc{position:absolute;margin:0;padding:0;top:0;right:0;bottom:0;left:0;border:var(--file-upload-border-width) var(--drag-drop-border-style) var(--color-blue-grey500);border-radius:var(--input-border-radius);background-color:var(--color-primary50);transition-property:all;transition-duration:.2s;transition-timing-function:ease-in-out}@media (prefers-reduced-motion: reduce){.FileUpload_upload-button-wrapper_k4xuc.FileUpload_drag-active_k4xuc .FileUpload_outline_k4xuc{transition-duration:.1ms}}.FileUpload_upload-button-wrapper_k4xuc.FileUpload_drag-active_k4xuc .FileUpload_outline_k4xuc:before{content:"Drop here";text-align:center;display:block;color:var(--color-primary);padding-top:2rem}.FileUpload_upload-button-wrapper_k4xuc.FileUpload_drag-active_k4xuc:hover .FileUpload_outline_k4xuc{background-color:var(--color-primary50)}.FileUpload_upload-button-wrapper_k4xuc.FileUpload_drag-active_k4xuc .FileUpload_file-select_k4xuc{position:relative}.FileUpload_upload-button-wrapper_k4xuc.FileUpload_drag-active_k4xuc .FileUpload_error_k4xuc .FileUpload_outline_k4xuc{border-color:var(--error)}.FileUpload_file-selector-sub-text_k4xuc{color:var(--greyed-out)}.FileUpload_file-selector-sub-text_k4xuc.FileUpload_error_k4xuc{color:var(--error);display:block}.FileUpload_file-selector-helper-text_k4xuc{color:var(--greyed-out);display:block}.FileUpload_file-select_k4xuc{display:flex;align-items:center;flex-direction:row;justify-content:center;border:var(--file-upload-border-width) var(--drag-drop-border-style) var(--color-blue-grey100);padding:1.25rem}.FileUpload_file-select_k4xuc [class*=file]{font-size:var(--font-size-big);margin-left:.5rem}.FileUpload_file-select_k4xuc [class*=typography]{margin-bottom:0}.FileUpload_upload-input_k4xuc{display:block;width:100%;border:none;text-transform:none;position:absolute;top:0;left:0;right:0;bottom:0;opacity:0;cursor:pointer}.FileUpload_upload-input_k4xuc:focus{outline:none}.FileUpload_file-upload-btn_k4xuc{position:relative}.FileUpload_file-list_k4xuc{list-style:none;padding:0;margin:.25rem 0}.FileUpload_file-list_k4xuc li:not(:last-child){margin-bottom:.5rem}')),document.head.appendChild(e)}}catch(o){console.error("vite-plugin-css-injected-by-js",o)}}();
+const required = "FileUpload_required_k4xuc";
+const error = "FileUpload_error_k4xuc";
+const success = "FileUpload_success_k4xuc";
+const disabled = "FileUpload_disabled_k4xuc";
+const outline = "FileUpload_outline_k4xuc";
+const classes = {
+  "file-upload-wrapper": "FileUpload_file-upload-wrapper_k4xuc",
+  "file-dropzone": "FileUpload_file-dropzone_k4xuc",
+  "file-upload-title": "FileUpload_file-upload-title_k4xuc",
+  required,
+  error,
+  "file-select": "FileUpload_file-select_k4xuc",
+  success,
+  "upload-button-wrapper": "FileUpload_upload-button-wrapper_k4xuc",
+  disabled,
+  "file-list": "FileUpload_file-list_k4xuc",
+  "file-upload-btn": "FileUpload_file-upload-btn_k4xuc",
+  "drag-active": "FileUpload_drag-active_k4xuc",
+  outline,
+  "file-selector-sub-text": "FileUpload_file-selector-sub-text_k4xuc",
+  "upload-input": "FileUpload_upload-input_k4xuc"
+};
+export {
+  classes as default,
+  disabled,
+  error,
+  outline,
+  required,
+  success
+};
+//# sourceMappingURL=FileUpload.module.scss.es.js.map

package/dist/components/Form/FileUpload/FileUpload.module.scss.es.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"FileUpload.module.scss.es.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;"}

package/dist/components/Form/Form.cjs.js

@@ -0,0 +1,2 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react"),r=require("./Form.module.scss.cjs.js"),s=e.forwardRef((({children:s,className:o,...t},a)=>e.createElement("form",{ref:a,className:`${r.default.form} ${o??""}`,...t},s)));exports.Form=s;
+//# sourceMappingURL=Form.cjs.js.map

package/dist/components/Form/Form.cjs.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Form.cjs.js","sources":["../../../src/components/Form/Form.tsx"],"sourcesContent":["/*\n * Copyright 2022 OneWelcome B.V.\n *\n *    Licensed under the Apache License, Version 2.0 (the \"License\");\n *    you may not use this file except in compliance with the License.\n *    You may obtain a copy of the License at\n *\n *        http://www.apache.org/licenses/LICENSE-2.0\n *\n *    Unless required by applicable law or agreed to in writing, software\n *    distributed under the License is distributed on an \"AS IS\" BASIS,\n *    WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n *    See the License for the specific language governing permissions and\n *    limitations under the License.\n */\n\nimport React, { ComponentPropsWithRef, ForwardRefRenderFunction, ReactNode } from \"react\";\nimport classes from \"./Form.module.scss\";\n\nexport interface Props extends ComponentPropsWithRef<\"form\"> {\n  children?: ReactNode;\n}\n\nconst FormComponent: ForwardRefRenderFunction<HTMLFormElement, Props> = (\n  { children, className, ...rest }: Props,\n  ref\n) => {\n  return (\n    <form ref={ref} className={`${classes.form} ${className ?? \"\"}`} {...rest}>\n      {children}\n    </form>\n  );\n};\n\nexport const Form = React.forwardRef(FormComponent);\n"],"names":["Form","React","forwardRef","children","className","rest","ref","createElement","classes","form"],"mappings":"gJAkCaA,EAAOC,EAAMC,YAX8C,EACpEC,WAAUC,eAAcC,GAC1BC,MAGGC,cAAA,OAAA,CAAKD,MAAUF,UAAW,GAAGI,EAAAA,QAAQC,QAAQL,GAAa,QAAUC,GAClEF"}

package/dist/components/Form/Form.es.js

@@ -0,0 +1,10 @@
+import React from "react";
+import classes from "./Form.module.scss.es.js";
+const FormComponent = ({ children, className, ...rest }, ref) => {
+  return /* @__PURE__ */ React.createElement("form", { ref, className: `${classes.form} ${className ?? ""}`, ...rest }, children);
+};
+const Form = React.forwardRef(FormComponent);
+export {
+  Form
+};
+//# sourceMappingURL=Form.es.js.map

package/dist/components/Form/Form.es.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Form.es.js","sources":["../../../src/components/Form/Form.tsx"],"sourcesContent":["/*\n * Copyright 2022 OneWelcome B.V.\n *\n *    Licensed under the Apache License, Version 2.0 (the \"License\");\n *    you may not use this file except in compliance with the License.\n *    You may obtain a copy of the License at\n *\n *        http://www.apache.org/licenses/LICENSE-2.0\n *\n *    Unless required by applicable law or agreed to in writing, software\n *    distributed under the License is distributed on an \"AS IS\" BASIS,\n *    WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n *    See the License for the specific language governing permissions and\n *    limitations under the License.\n */\n\nimport React, { ComponentPropsWithRef, ForwardRefRenderFunction, ReactNode } from \"react\";\nimport classes from \"./Form.module.scss\";\n\nexport interface Props extends ComponentPropsWithRef<\"form\"> {\n  children?: ReactNode;\n}\n\nconst FormComponent: ForwardRefRenderFunction<HTMLFormElement, Props> = (\n  { children, className, ...rest }: Props,\n  ref\n) => {\n  return (\n    <form ref={ref} className={`${classes.form} ${className ?? \"\"}`} {...rest}>\n      {children}\n    </form>\n  );\n};\n\nexport const Form = React.forwardRef(FormComponent);\n"],"names":[],"mappings":";;AAuBA,MAAM,gBAAkE,CACtE,EAAE,UAAU,WAAW,GAAG,QAC1B,QACG;AACH,SACG,sBAAA,cAAA,QAAA,EAAK,KAAU,WAAW,GAAG,QAAQ,IAAI,IAAI,aAAa,EAAE,IAAK,GAAG,QAClE,QACH;AAEJ;AAEa,MAAA,OAAO,MAAM,WAAW,aAAa;"}

package/dist/components/Form/Form.module.scss.cjs.js

@@ -0,0 +1,3 @@
+!function(){"use strict";try{if("undefined"!=typeof document){var e=document.createElement("style");e.appendChild(document.createTextNode('/*!\n * Copyright 2022 OneWelcome B.V.\n *\n *    Licensed under the Apache License, Version 2.0 (the "License");\n *    you may not use this file except in compliance with the License.\n *    You may obtain a copy of the License at\n *\n *        http://www.apache.org/licenses/LICENSE-2.0\n *\n *    Unless required by applicable law or agreed to in writing, software\n *    distributed under the License is distributed on an "AS IS" BASIS,\n *    WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n *    See the License for the specific language governing permissions and\n *    limitations under the License.\n */.Form_form_k4xuc{font-family:var(--font-family)}')),document.head.appendChild(e)}}catch(n){console.error("vite-plugin-css-injected-by-js",n)}}();
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e="Form_form_k4xuc",o={form:e};exports.default=o,exports.form=e;
+//# sourceMappingURL=Form.module.scss.cjs.js.map

package/dist/components/Form/Form.module.scss.es.js

@@ -0,0 +1,10 @@
+!function(){"use strict";try{if("undefined"!=typeof document){var e=document.createElement("style");e.appendChild(document.createTextNode('/*!\n * Copyright 2022 OneWelcome B.V.\n *\n *    Licensed under the Apache License, Version 2.0 (the "License");\n *    you may not use this file except in compliance with the License.\n *    You may obtain a copy of the License at\n *\n *        http://www.apache.org/licenses/LICENSE-2.0\n *\n *    Unless required by applicable law or agreed to in writing, software\n *    distributed under the License is distributed on an "AS IS" BASIS,\n *    WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n *    See the License for the specific language governing permissions and\n *    limitations under the License.\n */.Form_form_k4xuc{font-family:var(--font-family)}')),document.head.appendChild(e)}}catch(n){console.error("vite-plugin-css-injected-by-js",n)}}();
+const form = "Form_form_k4xuc";
+const classes = {
+  form
+};
+export {
+  classes as default,
+  form
+};
+//# sourceMappingURL=Form.module.scss.es.js.map

package/dist/components/Form/Form.module.scss.es.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Form.module.scss.es.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;"}

package/dist/components/Form/FormControl/FormControl.cjs.js

@@ -0,0 +1,2 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react"),r=require("./FormControl.module.scss.cjs.js"),l=e.forwardRef((({children:l,disabled:t,className:o,grid:d,align:a="center",...s},n)=>e.createElement("div",{...s,ref:n,"data-formcontrol":!0,className:`${r.default["form-control"]} ${o||""} ${d&&d>1?`${r.default.grid} ${r.default["grid-"+d]}`:""} ${r.default[a]}`},e.Children.map(l,(l=>{if(!l)return null;const o=e.cloneElement(l,{disabled:void 0!==l.props.disabled?l.props.disabled:t});return d&&d>1?e.createElement("div",{className:`${r.default["col-"+d]} ${r.default.column}`},o):o})))));exports.FormControl=l;
+//# sourceMappingURL=FormControl.cjs.js.map

package/dist/components/Form/FormControl/FormControl.cjs.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"FormControl.cjs.js","sources":["../../../../src/components/Form/FormControl/FormControl.tsx"],"sourcesContent":["/*\n * Copyright 2022 OneWelcome B.V.\n *\n *    Licensed under the Apache License, Version 2.0 (the \"License\");\n *    you may not use this file except in compliance with the License.\n *    You may obtain a copy of the License at\n *\n *        http://www.apache.org/licenses/LICENSE-2.0\n *\n *    Unless required by applicable law or agreed to in writing, software\n *    distributed under the License is distributed on an \"AS IS\" BASIS,\n *    WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n *    See the License for the specific language governing permissions and\n *    limitations under the License.\n */\n\nimport React, { ForwardRefRenderFunction, ComponentPropsWithRef, ReactElement } from \"react\";\nimport classes from \"./FormControl.module.scss\";\n\nexport interface Props extends ComponentPropsWithRef<\"div\"> {\n  children?: ReactElement | ReactElement[] | null;\n  grid?: 1 | 2 | 3;\n  align?: \"top\" | \"start\" | \"middle\" | \"center\" | \"bottom\" | \"end\" | \"stretch\";\n  disabled?: boolean;\n}\n\nconst FormControlComponent: ForwardRefRenderFunction<HTMLDivElement, Props> = (\n  { children, disabled, className, grid, align = \"center\", ...rest }: Props,\n  ref\n) => {\n  const renderChildren = () =>\n    React.Children.map(children, child => {\n      if (!child) {\n        return null;\n      }\n\n      const childElement = React.cloneElement(child, {\n        disabled: child.props.disabled !== undefined ? child.props.disabled : disabled\n      });\n\n      if (grid && grid > 1) {\n        return <div className={`${classes[\"col-\" + grid]} ${classes.column}`}>{childElement}</div>;\n      }\n\n      return childElement;\n    });\n\n  return (\n    <div\n      {...rest}\n      ref={ref}\n      data-formcontrol\n      className={`${classes[\"form-control\"]} ${className ? className : \"\"} ${\n        grid && grid > 1 ? `${classes.grid} ${classes[\"grid-\" + grid]}` : \"\"\n      } ${classes[align]}`}\n    >\n      {renderChildren()}\n    </div>\n  );\n};\n\nexport const FormControl = React.forwardRef(FormControlComponent);\n"],"names":["FormControl","React","forwardRef","children","disabled","className","grid","align","rest","ref","createElement","classes","default","Children","map","child","childElement","cloneElement","props","column"],"mappings":"uJA6DaA,EAAcC,EAAMC,YAnC6C,EAC1EC,WAAUC,WAAUC,YAAWC,OAAMC,QAAQ,YAAaC,GAC5DC,IAoBER,EAAAS,cAAC,MAAA,IACKF,EACJC,MACA,oBAAgB,EAChBJ,UAAW,GAAGM,UAAQ,mBAAmBN,GAAwB,MAC/DC,GAAQA,EAAO,EAAI,GAAGK,EAAAA,QAAQL,QAAQK,EAAAA,QAAQ,QAAUL,KAAU,MAChEK,EAAQC,QAAAL,MAvBdN,EAAMY,SAASC,IAAIX,GAAmBY,IACpC,IAAKA,EACI,OAAA,KAGH,MAAAC,EAAef,EAAMgB,aAAaF,EAAO,CAC7CX,cAAmC,IAAzBW,EAAMG,MAAMd,SAAyBW,EAAMG,MAAMd,SAAWA,IAGpE,OAAAE,GAAQA,EAAO,IACTI,cAAA,MAAA,CAAIL,UAAW,GAAGM,EAAQC,QAAA,OAASN,MAASK,EAAAA,QAAQQ,UAAWH,GAGlEA,CAAA"}

package/dist/components/Form/FormControl/FormControl.es.js

@@ -0,0 +1,31 @@
+import React from "react";
+import classes from "./FormControl.module.scss.es.js";
+const FormControlComponent = ({ children, disabled, className, grid, align = "center", ...rest }, ref) => {
+  const renderChildren = () => React.Children.map(children, (child) => {
+    if (!child) {
+      return null;
+    }
+    const childElement = React.cloneElement(child, {
+      disabled: child.props.disabled !== void 0 ? child.props.disabled : disabled
+    });
+    if (grid && grid > 1) {
+      return /* @__PURE__ */ React.createElement("div", { className: `${classes["col-" + grid]} ${classes.column}` }, childElement);
+    }
+    return childElement;
+  });
+  return /* @__PURE__ */ React.createElement(
+    "div",
+    {
+      ...rest,
+      ref,
+      "data-formcontrol": true,
+      className: `${classes["form-control"]} ${className ? className : ""} ${grid && grid > 1 ? `${classes.grid} ${classes["grid-" + grid]}` : ""} ${classes[align]}`
+    },
+    renderChildren()
+  );
+};
+const FormControl = React.forwardRef(FormControlComponent);
+export {
+  FormControl
+};
+//# sourceMappingURL=FormControl.es.js.map

package/dist/components/Form/FormControl/FormControl.es.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"FormControl.es.js","sources":["../../../../src/components/Form/FormControl/FormControl.tsx"],"sourcesContent":["/*\n * Copyright 2022 OneWelcome B.V.\n *\n *    Licensed under the Apache License, Version 2.0 (the \"License\");\n *    you may not use this file except in compliance with the License.\n *    You may obtain a copy of the License at\n *\n *        http://www.apache.org/licenses/LICENSE-2.0\n *\n *    Unless required by applicable law or agreed to in writing, software\n *    distributed under the License is distributed on an \"AS IS\" BASIS,\n *    WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n *    See the License for the specific language governing permissions and\n *    limitations under the License.\n */\n\nimport React, { ForwardRefRenderFunction, ComponentPropsWithRef, ReactElement } from \"react\";\nimport classes from \"./FormControl.module.scss\";\n\nexport interface Props extends ComponentPropsWithRef<\"div\"> {\n  children?: ReactElement | ReactElement[] | null;\n  grid?: 1 | 2 | 3;\n  align?: \"top\" | \"start\" | \"middle\" | \"center\" | \"bottom\" | \"end\" | \"stretch\";\n  disabled?: boolean;\n}\n\nconst FormControlComponent: ForwardRefRenderFunction<HTMLDivElement, Props> = (\n  { children, disabled, className, grid, align = \"center\", ...rest }: Props,\n  ref\n) => {\n  const renderChildren = () =>\n    React.Children.map(children, child => {\n      if (!child) {\n        return null;\n      }\n\n      const childElement = React.cloneElement(child, {\n        disabled: child.props.disabled !== undefined ? child.props.disabled : disabled\n      });\n\n      if (grid && grid > 1) {\n        return <div className={`${classes[\"col-\" + grid]} ${classes.column}`}>{childElement}</div>;\n      }\n\n      return childElement;\n    });\n\n  return (\n    <div\n      {...rest}\n      ref={ref}\n      data-formcontrol\n      className={`${classes[\"form-control\"]} ${className ? className : \"\"} ${\n        grid && grid > 1 ? `${classes.grid} ${classes[\"grid-\" + grid]}` : \"\"\n      } ${classes[align]}`}\n    >\n      {renderChildren()}\n    </div>\n  );\n};\n\nexport const FormControl = React.forwardRef(FormControlComponent);\n"],"names":[],"mappings":";;AA0BA,MAAM,uBAAwE,CAC5E,EAAE,UAAU,UAAU,WAAW,MAAM,QAAQ,UAAU,GAAG,KAAK,GACjE,QACG;AACH,QAAM,iBAAiB,MACrB,MAAM,SAAS,IAAI,UAAU,CAAS,UAAA;AACpC,QAAI,CAAC,OAAO;AACH,aAAA;AAAA,IAAA;AAGH,UAAA,eAAe,MAAM,aAAa,OAAO;AAAA,MAC7C,UAAU,MAAM,MAAM,aAAa,SAAY,MAAM,MAAM,WAAW;AAAA,IAAA,CACvE;AAEG,QAAA,QAAQ,OAAO,GAAG;AACpB,aAAQ,sBAAA,cAAA,OAAA,EAAI,WAAW,GAAG,QAAQ,SAAS,IAAI,CAAC,IAAI,QAAQ,MAAM,GAAA,GAAK,YAAa;AAAA,IAAA;AAG/E,WAAA;AAAA,EAAA,CACR;AAGD,SAAA,sBAAA;AAAA,IAAC;AAAA,IAAA;AAAA,MACE,GAAG;AAAA,MACJ;AAAA,MACA,oBAAgB;AAAA,MAChB,WAAW,GAAG,QAAQ,cAAc,CAAC,IAAI,YAAY,YAAY,EAAE,IACjE,QAAQ,OAAO,IAAI,GAAG,QAAQ,IAAI,IAAI,QAAQ,UAAU,IAAI,CAAC,KAAK,EACpE,IAAI,QAAQ,KAAK,CAAC;AAAA,IAAA;AAAA,IAEjB,eAAe;AAAA,EAClB;AAEJ;AAEa,MAAA,cAAc,MAAM,WAAW,oBAAoB;"}

package/dist/components/Form/FormControl/FormControl.module.scss.cjs.js

@@ -0,0 +1,3 @@
+!function(){"use strict";try{if("undefined"!=typeof document){var o=document.createElement("style");o.appendChild(document.createTextNode('/*!\n * Copyright 2022 OneWelcome B.V.\n *\n *    Licensed under the Apache License, Version 2.0 (the "License");\n *    you may not use this file except in compliance with the License.\n *    You may obtain a copy of the License at\n *\n *        http://www.apache.org/licenses/LICENSE-2.0\n *\n *    Unless required by applicable law or agreed to in writing, software\n *    distributed under the License is distributed on an "AS IS" BASIS,\n *    WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n *    See the License for the specific language governing permissions and\n *    limitations under the License.\n */.FormControl_form-control_k4xuc{font-size:var(--form-control-font-size)}.FormControl_form-control_k4xuc+.FormControl_form-control_k4xuc{margin-top:1rem}.FormControl_form-control_k4xuc.FormControl_grid_k4xuc{display:flex;flex-wrap:wrap;gap:1rem}.FormControl_form-control_k4xuc.FormControl_grid_k4xuc.FormControl_center_k4xuc,.FormControl_form-control_k4xuc.FormControl_grid_k4xuc.FormControl_middle_k4xuc{align-items:center}.FormControl_form-control_k4xuc.FormControl_grid_k4xuc.FormControl_start_k4xuc,.FormControl_form-control_k4xuc.FormControl_grid_k4xuc.FormControl_top_k4xuc{align-items:flex-start}.FormControl_form-control_k4xuc.FormControl_grid_k4xuc.FormControl_end_k4xuc,.FormControl_form-control_k4xuc.FormControl_grid_k4xuc.FormControl_bottom_k4xuc{align-items:flex-end}.FormControl_form-control_k4xuc.FormControl_grid_k4xuc.FormControl_stretch_k4xuc{align-items:stretch}.FormControl_form-control_k4xuc.FormControl_grid_k4xuc.FormControl_stretch_k4xuc>*>*{box-sizing:border-box;height:100%}.FormControl_column_k4xuc{flex-grow:1;flex-shrink:0}.FormControl_col-2_k4xuc{flex-basis:calc((100% - 1rem)/2)}.FormControl_col-3_k4xuc{flex-basis:calc((100% - 2rem) / 3)}')),document.head.appendChild(o)}}catch(r){console.error("vite-plugin-css-injected-by-js",r)}}();
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const o="FormControl_grid_k4xuc",t="FormControl_center_k4xuc",r="FormControl_middle_k4xuc",e="FormControl_start_k4xuc",c="FormControl_top_k4xuc",l="FormControl_end_k4xuc",n="FormControl_bottom_k4xuc",_="FormControl_stretch_k4xuc",m="FormControl_column_k4xuc",x={"form-control":"FormControl_form-control_k4xuc",grid:o,center:t,middle:r,start:e,top:c,end:l,bottom:n,stretch:_,column:m,"col-2":"FormControl_col-2_k4xuc","col-3":"FormControl_col-3_k4xuc"};exports.bottom=n,exports.center=t,exports.column=m,exports.default=x,exports.end=l,exports.grid=o,exports.middle=r,exports.start=e,exports.stretch=_,exports.top=c;
+//# sourceMappingURL=FormControl.module.scss.cjs.js.map

package/dist/components/Form/FormControl/FormControl.module.scss.es.js

@@ -0,0 +1,37 @@
+!function(){"use strict";try{if("undefined"!=typeof document){var o=document.createElement("style");o.appendChild(document.createTextNode('/*!\n * Copyright 2022 OneWelcome B.V.\n *\n *    Licensed under the Apache License, Version 2.0 (the "License");\n *    you may not use this file except in compliance with the License.\n *    You may obtain a copy of the License at\n *\n *        http://www.apache.org/licenses/LICENSE-2.0\n *\n *    Unless required by applicable law or agreed to in writing, software\n *    distributed under the License is distributed on an "AS IS" BASIS,\n *    WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n *    See the License for the specific language governing permissions and\n *    limitations under the License.\n */.FormControl_form-control_k4xuc{font-size:var(--form-control-font-size)}.FormControl_form-control_k4xuc+.FormControl_form-control_k4xuc{margin-top:1rem}.FormControl_form-control_k4xuc.FormControl_grid_k4xuc{display:flex;flex-wrap:wrap;gap:1rem}.FormControl_form-control_k4xuc.FormControl_grid_k4xuc.FormControl_center_k4xuc,.FormControl_form-control_k4xuc.FormControl_grid_k4xuc.FormControl_middle_k4xuc{align-items:center}.FormControl_form-control_k4xuc.FormControl_grid_k4xuc.FormControl_start_k4xuc,.FormControl_form-control_k4xuc.FormControl_grid_k4xuc.FormControl_top_k4xuc{align-items:flex-start}.FormControl_form-control_k4xuc.FormControl_grid_k4xuc.FormControl_end_k4xuc,.FormControl_form-control_k4xuc.FormControl_grid_k4xuc.FormControl_bottom_k4xuc{align-items:flex-end}.FormControl_form-control_k4xuc.FormControl_grid_k4xuc.FormControl_stretch_k4xuc{align-items:stretch}.FormControl_form-control_k4xuc.FormControl_grid_k4xuc.FormControl_stretch_k4xuc>*>*{box-sizing:border-box;height:100%}.FormControl_column_k4xuc{flex-grow:1;flex-shrink:0}.FormControl_col-2_k4xuc{flex-basis:calc((100% - 1rem)/2)}.FormControl_col-3_k4xuc{flex-basis:calc((100% - 2rem) / 3)}')),document.head.appendChild(o)}}catch(r){console.error("vite-plugin-css-injected-by-js",r)}}();
+const grid = "FormControl_grid_k4xuc";
+const center = "FormControl_center_k4xuc";
+const middle = "FormControl_middle_k4xuc";
+const start = "FormControl_start_k4xuc";
+const top = "FormControl_top_k4xuc";
+const end = "FormControl_end_k4xuc";
+const bottom = "FormControl_bottom_k4xuc";
+const stretch = "FormControl_stretch_k4xuc";
+const column = "FormControl_column_k4xuc";
+const classes = {
+  "form-control": "FormControl_form-control_k4xuc",
+  grid,
+  center,
+  middle,
+  start,
+  top,
+  end,
+  bottom,
+  stretch,
+  column,
+  "col-2": "FormControl_col-2_k4xuc",
+  "col-3": "FormControl_col-3_k4xuc"
+};
+export {
+  bottom,
+  center,
+  column,
+  classes as default,
+  end,
+  grid,
+  middle,
+  start,
+  stretch,
+  top
+};
+//# sourceMappingURL=FormControl.module.scss.es.js.map

package/dist/components/Form/FormControl/FormControl.module.scss.es.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"FormControl.module.scss.es.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/components/Form/FormErrorText/FormErrorText.cjs.js

@@ -0,0 +1,2 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react"),r=require("../../Icon/Icon.cjs.js"),o=require("./FormErrorText.module.scss.cjs.js");exports.FormErrorText=({error:s,errorMessage:a,errorMessageProps:c,errorMessageIcon:t,errorMessageIconPosition:l="before",errorId:n})=>s?e.createElement("span",{...c,className:`${o.default["error-message"]} ${(null==c?void 0:c.className)??""}`},e.createElement("span",{id:n,className:o.default.message},t&&"before"===l&&e.createElement(r.Icon,{className:`${o.default["error-icon"]} ${o.default["error-icon-before"]}`,icon:t}),(null==c?void 0:c.children)||a,t&&"after"===l&&e.createElement(r.Icon,{className:`${o.default["error-icon"]} ${o.default["error-icon-after"]}`,icon:t}))):null;
+//# sourceMappingURL=FormErrorText.cjs.js.map

package/dist/components/Form/FormErrorText/FormErrorText.cjs.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"FormErrorText.cjs.js","sources":["../../../../src/components/Form/FormErrorText/FormErrorText.tsx"],"sourcesContent":["/*\n * Copyright 2022 OneWelcome B.V.\n *\n *    Licensed under the Apache License, Version 2.0 (the \"License\");\n *    you may not use this file except in compliance with the License.\n *    You may obtain a copy of the License at\n *\n *        http://www.apache.org/licenses/LICENSE-2.0\n *\n *    Unless required by applicable law or agreed to in writing, software\n *    distributed under the License is distributed on an \"AS IS\" BASIS,\n *    WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n *    See the License for the specific language governing permissions and\n *    limitations under the License.\n */\n\nimport React from \"react\";\nimport { Icon, Icons } from \"../../Icon/Icon\";\nimport classes from \"./FormErrorText.module.scss\";\nimport { KeyValuePair } from \"../../../interfaces\";\n\nexport interface FormErrorTextProps {\n  error?: boolean;\n  errorMessage?: string;\n  errorMessageProps?: React.ComponentPropsWithRef<\"span\"> & KeyValuePair;\n  errorMessageIcon?: Icons;\n  errorMessageIconPosition?: \"before\" | \"after\";\n  errorId?: string;\n}\n\nexport const FormErrorText = ({\n  error,\n  errorMessage,\n  errorMessageProps,\n  errorMessageIcon,\n  errorMessageIconPosition = \"before\",\n  errorId\n}: FormErrorTextProps) => {\n  if (!error) {\n    return null;\n  }\n\n  return (\n    <span\n      {...errorMessageProps}\n      className={`${classes[\"error-message\"]} ${errorMessageProps?.className ?? \"\"}`}\n    >\n      <span id={errorId} className={classes[\"message\"]}>\n        {errorMessageIcon && errorMessageIconPosition === \"before\" && (\n          <Icon\n            className={`${classes[\"error-icon\"]} ${classes[\"error-icon-before\"]}`}\n            icon={errorMessageIcon}\n          />\n        )}\n        {errorMessageProps?.children || errorMessage}\n        {errorMessageIcon && errorMessageIconPosition === \"after\" && (\n          <Icon\n            className={`${classes[\"error-icon\"]} ${classes[\"error-icon-after\"]}`}\n            icon={errorMessageIcon}\n          />\n        )}\n      </span>\n    </span>\n  );\n};\n"],"names":["error","errorMessage","errorMessageProps","errorMessageIcon","errorMessageIconPosition","errorId","React","createElement","className","classes","id","Icon","default","icon","children"],"mappings":"mNA8B6B,EAC3BA,QACAC,eACAC,oBACAC,mBACAC,2BAA2B,SAC3BC,aAEKL,EAKHM,EAAAC,cAAC,OAAA,IACKL,EACJM,UAAW,GAAGC,EAAAA,QAAQ,qBAAuC,MAAnBP,OAAmB,EAAAA,EAAAM,YAAa,MAE1EF,EAAAC,cAAC,OAAK,CAAAG,GAAIL,EAASG,UAAWC,UAAiB,SAC5CN,GAAiD,WAA7BC,GACnBE,EAAAC,cAACI,EAAAA,KAAA,CACCH,UAAW,GAAGC,EAAAA,QAAQ,iBAAiBA,EAAAG,QAAQ,uBAC/CC,KAAMV,KAGU,MAAnBD,OAAmB,EAAAA,EAAAY,WAAYb,EAC/BE,GAAiD,UAA7BC,GACnBE,EAAAC,cAACI,EAAAA,KAAA,CACCH,UAAW,GAAGC,EAAAA,QAAQ,iBAAiBA,EAAAG,QAAQ,sBAC/CC,KAAMV,MAnBP"}

package/dist/components/Form/FormErrorText/FormErrorText.es.js

@@ -0,0 +1,39 @@
+import React from "react";
+import { Icon } from "../../Icon/Icon.es.js";
+import classes from "./FormErrorText.module.scss.es.js";
+const FormErrorText = ({
+  error,
+  errorMessage,
+  errorMessageProps,
+  errorMessageIcon,
+  errorMessageIconPosition = "before",
+  errorId
+}) => {
+  if (!error) {
+    return null;
+  }
+  return /* @__PURE__ */ React.createElement(
+    "span",
+    {
+      ...errorMessageProps,
+      className: `${classes["error-message"]} ${(errorMessageProps == null ? void 0 : errorMessageProps.className) ?? ""}`
+    },
+    /* @__PURE__ */ React.createElement("span", { id: errorId, className: classes["message"] }, errorMessageIcon && errorMessageIconPosition === "before" && /* @__PURE__ */ React.createElement(
+      Icon,
+      {
+        className: `${classes["error-icon"]} ${classes["error-icon-before"]}`,
+        icon: errorMessageIcon
+      }
+    ), (errorMessageProps == null ? void 0 : errorMessageProps.children) || errorMessage, errorMessageIcon && errorMessageIconPosition === "after" && /* @__PURE__ */ React.createElement(
+      Icon,
+      {
+        className: `${classes["error-icon"]} ${classes["error-icon-after"]}`,
+        icon: errorMessageIcon
+      }
+    ))
+  );
+};
+export {
+  FormErrorText
+};
+//# sourceMappingURL=FormErrorText.es.js.map

package/dist/components/Form/FormErrorText/FormErrorText.es.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"FormErrorText.es.js","sources":["../../../../src/components/Form/FormErrorText/FormErrorText.tsx"],"sourcesContent":["/*\n * Copyright 2022 OneWelcome B.V.\n *\n *    Licensed under the Apache License, Version 2.0 (the \"License\");\n *    you may not use this file except in compliance with the License.\n *    You may obtain a copy of the License at\n *\n *        http://www.apache.org/licenses/LICENSE-2.0\n *\n *    Unless required by applicable law or agreed to in writing, software\n *    distributed under the License is distributed on an \"AS IS\" BASIS,\n *    WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n *    See the License for the specific language governing permissions and\n *    limitations under the License.\n */\n\nimport React from \"react\";\nimport { Icon, Icons } from \"../../Icon/Icon\";\nimport classes from \"./FormErrorText.module.scss\";\nimport { KeyValuePair } from \"../../../interfaces\";\n\nexport interface FormErrorTextProps {\n  error?: boolean;\n  errorMessage?: string;\n  errorMessageProps?: React.ComponentPropsWithRef<\"span\"> & KeyValuePair;\n  errorMessageIcon?: Icons;\n  errorMessageIconPosition?: \"before\" | \"after\";\n  errorId?: string;\n}\n\nexport const FormErrorText = ({\n  error,\n  errorMessage,\n  errorMessageProps,\n  errorMessageIcon,\n  errorMessageIconPosition = \"before\",\n  errorId\n}: FormErrorTextProps) => {\n  if (!error) {\n    return null;\n  }\n\n  return (\n    <span\n      {...errorMessageProps}\n      className={`${classes[\"error-message\"]} ${errorMessageProps?.className ?? \"\"}`}\n    >\n      <span id={errorId} className={classes[\"message\"]}>\n        {errorMessageIcon && errorMessageIconPosition === \"before\" && (\n          <Icon\n            className={`${classes[\"error-icon\"]} ${classes[\"error-icon-before\"]}`}\n            icon={errorMessageIcon}\n          />\n        )}\n        {errorMessageProps?.children || errorMessage}\n        {errorMessageIcon && errorMessageIconPosition === \"after\" && (\n          <Icon\n            className={`${classes[\"error-icon\"]} ${classes[\"error-icon-after\"]}`}\n            icon={errorMessageIcon}\n          />\n        )}\n      </span>\n    </span>\n  );\n};\n"],"names":[],"mappings":";;;AA8BO,MAAM,gBAAgB,CAAC;AAAA,EAC5B;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,2BAA2B;AAAA,EAC3B;AACF,MAA0B;AACxB,MAAI,CAAC,OAAO;AACH,WAAA;AAAA,EAAA;AAIP,SAAA,sBAAA;AAAA,IAAC;AAAA,IAAA;AAAA,MACE,GAAG;AAAA,MACJ,WAAW,GAAG,QAAQ,eAAe,CAAC,KAAI,uDAAmB,cAAa,EAAE;AAAA,IAAA;AAAA,IAE5E,sBAAA,cAAC,QAAK,EAAA,IAAI,SAAS,WAAW,QAAQ,SAAS,EAAA,GAC5C,oBAAoB,6BAA6B,YAChD,sBAAA;AAAA,MAAC;AAAA,MAAA;AAAA,QACC,WAAW,GAAG,QAAQ,YAAY,CAAC,IAAI,QAAQ,mBAAmB,CAAC;AAAA,QACnE,MAAM;AAAA,MAAA;AAAA,IAAA,IAGT,uDAAmB,aAAY,cAC/B,oBAAoB,6BAA6B,WAChD,sBAAA;AAAA,MAAC;AAAA,MAAA;AAAA,QACC,WAAW,GAAG,QAAQ,YAAY,CAAC,IAAI,QAAQ,kBAAkB,CAAC;AAAA,QAClE,MAAM;AAAA,MAAA;AAAA,IAGZ,CAAA;AAAA,EACF;AAEJ;"}

package/dist/components/Form/FormErrorText/FormErrorText.module.scss.cjs.js

@@ -0,0 +1,3 @@
+!function(){"use strict";try{if("undefined"!=typeof document){var r=document.createElement("style");r.appendChild(document.createTextNode(".FormErrorText_error-message_k4xuc{color:var(--error);display:flex;align-items:flex-end;line-height:1rem}.FormErrorText_error-icon_k4xuc{margin-right:.5rem;font-size:var(--font-size-big)}.FormErrorText_error-icon-before_k4xuc{margin-right:.5rem}.FormErrorText_error-icon-after_k4xuc{margin-left:.5rem}")),document.head.appendChild(r)}}catch(e){console.error("vite-plugin-css-injected-by-js",e)}}();
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}}),exports.default={"error-message":"FormErrorText_error-message_k4xuc","error-icon":"FormErrorText_error-icon_k4xuc","error-icon-before":"FormErrorText_error-icon-before_k4xuc","error-icon-after":"FormErrorText_error-icon-after_k4xuc"};
+//# sourceMappingURL=FormErrorText.module.scss.cjs.js.map

package/dist/components/Form/FormErrorText/FormErrorText.module.scss.es.js

@@ -0,0 +1,11 @@
+!function(){"use strict";try{if("undefined"!=typeof document){var r=document.createElement("style");r.appendChild(document.createTextNode(".FormErrorText_error-message_k4xuc{color:var(--error);display:flex;align-items:flex-end;line-height:1rem}.FormErrorText_error-icon_k4xuc{margin-right:.5rem;font-size:var(--font-size-big)}.FormErrorText_error-icon-before_k4xuc{margin-right:.5rem}.FormErrorText_error-icon-after_k4xuc{margin-left:.5rem}")),document.head.appendChild(r)}}catch(e){console.error("vite-plugin-css-injected-by-js",e)}}();
+const classes = {
+  "error-message": "FormErrorText_error-message_k4xuc",
+  "error-icon": "FormErrorText_error-icon_k4xuc",
+  "error-icon-before": "FormErrorText_error-icon-before_k4xuc",
+  "error-icon-after": "FormErrorText_error-icon-after_k4xuc"
+};
+export {
+  classes as default
+};
+//# sourceMappingURL=FormErrorText.module.scss.es.js.map