@veeqo/ui 12.4.0-beta-3 → 12.4.0-beta-4

package/dist/components/UploadFile/styled.cjs

@@ -9,7 +9,47 @@ function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'defau
 
 var styled__default = /*#__PURE__*/_interopDefaultCompat(styled);
 
-const DropZoneContainer = styled__default.default.div.withConfig({ displayName: "vui--DropZoneContainer", componentId: "vui--17v0v3c" }) `display:flex;align-items:center;justify-content:center;padding:${sizes.sizes.md};border-radius:${radius.radius.base};input[type='file']{position:absolute;opacity:0;width:1px;height:1px;cursor:pointer;}cursor:pointer;border:2px dashed ${colors.colors.neutral.ink.lightest};background-color:${colors.colors.neutral.grey.lightest};:hover{border:2px dashed ${colors.colors.secondary.blue.base};background-color:${colors.colors.secondary.blue.lightest};}:active{border:2px dashed ${colors.colors.secondary.blue.base};box-shadow:0 0 0 4px ${colors.colors.secondary.blue.light};background-color:${colors.colors.secondary.blue.lightest};}:focus-within{border:2px dashed ${colors.colors.secondary.blue.base};box-shadow:0 0 0 4px ${colors.colors.secondary.blue.light};background-color:${colors.colors.secondary.blue.lightest};}&:has(input:invalid){border:2px dashed ${colors.colors.secondary.red.base};:hover{border:2px dashed ${colors.colors.secondary.red.base};background-color:${colors.colors.secondary.red.lightest};}:active{border:2px dashed ${colors.colors.secondary.red.base};box-shadow:0 0 0 4px ${colors.colors.secondary.red.light};background-color:${colors.colors.secondary.red.lightest};}:focus-within{border:2px dashed ${colors.colors.secondary.red.base};box-shadow:0 0 0 4px ${colors.colors.secondary.red.light};background-color:${colors.colors.secondary.red.lightest};}}&:has(input:disabled){cursor:not-allowed;box-shadow:none;background-color:${colors.colors.neutral.grey.light};border-color:${colors.colors.neutral.ink.lightest};color:${colors.colors.neutral.ink.light};}`;
+const DropZoneContainer = styled__default.default.div.withConfig({ displayName: "vui--DropZoneContainer", componentId: "vui--17v0v3c" }) `display:flex;align-items:center;justify-content:center;padding:${sizes.sizes.base};border-radius:${radius.radius.base};input[type='file']{position:absolute;opacity:0;width:1px;height:1px;cursor:pointer;}cursor:pointer;border:2px dashed ${colors.colors.neutral.ink.lightest};background-color:${colors.colors.neutral.grey.lightest};:hover{border:2px dashed ${colors.colors.secondary.blue.base};background-color:${colors.colors.secondary.blue.lightest};svg{color:${colors.colors.secondary.blue.base};}}:active,:focus-within{border:2px dashed ${colors.colors.secondary.blue.base};box-shadow:0 0 0 4px ${colors.colors.secondary.blue.light};background-color:${colors.colors.secondary.blue.lightest};svg{color:${colors.colors.secondary.blue.base};}}${({ isDragOver }) => isDragOver &&
+    `
+    border: 2px dashed ${colors.colors.secondary.blue.base};
+    box-shadow: 0 0 0 4px ${colors.colors.secondary.blue.light};
+    background-color: ${colors.colors.secondary.blue.lightest};
+
+    svg {
+      color: ${colors.colors.secondary.blue.base};
+    }
+  `} ${({ hasUserProvidedNoFiles, isDragOver, isDirty }) => hasUserProvidedNoFiles &&
+    isDirty &&
+    `
+    border: 2px dashed ${colors.colors.secondary.red.base};
+
+    :hover {
+      border: 2px dashed ${colors.colors.secondary.red.base};
+      background-color: ${colors.colors.secondary.red.lightest};
+
+      svg {
+        color: ${colors.colors.secondary.red.base};
+      }
+    }
+
+    :active, :focus-within {
+      border: 2px dashed ${colors.colors.secondary.red.base};
+      box-shadow: 0 0 0 4px ${colors.colors.secondary.red.light};
+      background-color: ${colors.colors.secondary.red.lightest};
+
+      svg {
+        color: ${colors.colors.secondary.red.base};
+      }
+    }
+
+    ${isDragOver
+        ? `
+    border: 2px dashed ${colors.colors.secondary.red.base};
+    box-shadow: 0 0 0 4px ${colors.colors.secondary.red.light};
+    background-color: ${colors.colors.secondary.red.lightest};
+  `
+        : ''}
+  `} &:has(input:disabled){cursor:not-allowed;box-shadow:none;background-color:${colors.colors.neutral.grey.light};border-color:${colors.colors.neutral.ink.lightest};color:${colors.colors.neutral.ink.light};svg{color:${colors.colors.neutral.ink.lightest};}}`;
 
 exports.DropZoneContainer = DropZoneContainer;
 //# sourceMappingURL=styled.cjs.map

package/dist/components/UploadFile/styled.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"styled.cjs","sources":["../../../src/components/UploadFile/styled.tsx"],"sourcesContent":["import styled from 'styled-components';\nimport { colors } from '../../theme/modules/colors';\nimport { radius } from '../../theme/modules/radius';\nimport { sizes } from '../../theme/modules/sizes';\n\nexport const DropZoneContainer = styled.div`\n  display: flex;\n  align-items: center;\n  justify-content: center;\n\n  padding: ${sizes.md};\n  border-radius: ${radius.base};\n\n  input[type='file'] {\n    position: absolute;\n    opacity: 0;\n    width: 1px;\n    height: 1px;\n    cursor: pointer;\n  }\n\n  cursor: pointer;\n\n  border: 2px dashed ${colors.neutral.ink.lightest};\n  background-color: ${colors.neutral.grey.lightest};\n\n  :hover {\n    border: 2px dashed ${colors.secondary.blue.base};\n    background-color: ${colors.secondary.blue.lightest};\n  }\n  :active {\n    border: 2px dashed ${colors.secondary.blue.base};\n    box-shadow: 0 0 0 4px ${colors.secondary.blue.light};\n    background-color: ${colors.secondary.blue.lightest};\n  }\n  :focus-within {\n    border: 2px dashed ${colors.secondary.blue.base};\n    box-shadow: 0 0 0 4px ${colors.secondary.blue.light};\n    background-color: ${colors.secondary.blue.lightest};\n  }\n\n  &:has(input:invalid) {\n    border: 2px dashed ${colors.secondary.red.base};\n    :hover {\n      border: 2px dashed ${colors.secondary.red.base};\n      background-color: ${colors.secondary.red.lightest};\n    }\n\n    :active {\n      border: 2px dashed ${colors.secondary.red.base};\n      box-shadow: 0 0 0 4px ${colors.secondary.red.light};\n      background-color: ${colors.secondary.red.lightest};\n    }\n\n    :focus-within {\n      border: 2px dashed ${colors.secondary.red.base};\n      box-shadow: 0 0 0 4px ${colors.secondary.red.light};\n      background-color: ${colors.secondary.red.lightest};\n    }\n  }\n\n  &:has(input:disabled) {\n    cursor: not-allowed;\n    box-shadow: none;\n    background-color: ${colors.neutral.grey.light};\n    border-color: ${colors.neutral.ink.lightest};\n    color: ${colors.neutral.ink.light};\n  }\n`;\n"],"names":["styled","sizes","radius","colors"],"mappings":";;;;;;;;;;;MAKa,iBAAiB,GAAGA,uBAAM,CAAC,GAAG,sJAK9BC,WAAK,CAAC,EAAE,CACF,eAAA,EAAAC,aAAM,CAAC,IAAI,CAAA,sHAAA,EAYPC,aAAM,CAAC,OAAO,CAAC,GAAG,CAAC,QAAQ,CAC5B,kBAAA,EAAAA,aAAM,CAAC,OAAO,CAAC,IAAI,CAAC,QAAQ,6BAGzBA,aAAM,CAAC,SAAS,CAAC,IAAI,CAAC,IAAI,CAAA,kBAAA,EAC3BA,aAAM,CAAC,SAAS,CAAC,IAAI,CAAC,QAAQ,+BAG7BA,aAAM,CAAC,SAAS,CAAC,IAAI,CAAC,IAAI,CAAA,sBAAA,EACvBA,aAAM,CAAC,SAAS,CAAC,IAAI,CAAC,KAAK,CAC/B,kBAAA,EAAAA,aAAM,CAAC,SAAS,CAAC,IAAI,CAAC,QAAQ,qCAG7BA,aAAM,CAAC,SAAS,CAAC,IAAI,CAAC,IAAI,CAAA,sBAAA,EACvBA,aAAM,CAAC,SAAS,CAAC,IAAI,CAAC,KAAK,CAC/B,kBAAA,EAAAA,aAAM,CAAC,SAAS,CAAC,IAAI,CAAC,QAAQ,CAAA,yCAAA,EAI7BA,aAAM,CAAC,SAAS,CAAC,GAAG,CAAC,IAAI,CAEvB,0BAAA,EAAAA,aAAM,CAAC,SAAS,CAAC,GAAG,CAAC,IAAI,qBAC1BA,aAAM,CAAC,SAAS,CAAC,GAAG,CAAC,QAAQ,CAAA,4BAAA,EAI5BA,aAAM,CAAC,SAAS,CAAC,GAAG,CAAC,IAAI,CACtB,sBAAA,EAAAA,aAAM,CAAC,SAAS,CAAC,GAAG,CAAC,KAAK,qBAC9BA,aAAM,CAAC,SAAS,CAAC,GAAG,CAAC,QAAQ,CAI5B,kCAAA,EAAAA,aAAM,CAAC,SAAS,CAAC,GAAG,CAAC,IAAI,yBACtBA,aAAM,CAAC,SAAS,CAAC,GAAG,CAAC,KAAK,CAAA,kBAAA,EAC9BA,aAAM,CAAC,SAAS,CAAC,GAAG,CAAC,QAAQ,CAO/B,6EAAA,EAAAA,aAAM,CAAC,OAAO,CAAC,IAAI,CAAC,KAAK,iBAC7BA,aAAM,CAAC,OAAO,CAAC,GAAG,CAAC,QAAQ,CAAA,OAAA,EAClCA,aAAM,CAAC,OAAO,CAAC,GAAG,CAAC,KAAK,CAAA,EAAA;;;;"}
+{"version":3,"file":"styled.cjs","sources":["../../../src/components/UploadFile/styled.tsx"],"sourcesContent":["import styled from 'styled-components';\nimport { colors } from '../../theme/modules/colors';\nimport { radius } from '../../theme/modules/radius';\nimport { sizes } from '../../theme/modules/sizes';\n\nexport const DropZoneContainer = styled.div<{\n  hasUserProvidedNoFiles: boolean;\n  isDirty: boolean;\n  isDragOver?: boolean;\n}>`\n  display: flex;\n  align-items: center;\n  justify-content: center;\n\n  padding: ${sizes.base};\n  border-radius: ${radius.base};\n\n  input[type='file'] {\n    position: absolute;\n    opacity: 0;\n    width: 1px;\n    height: 1px;\n    cursor: pointer;\n  }\n\n  cursor: pointer;\n\n  border: 2px dashed ${colors.neutral.ink.lightest};\n  background-color: ${colors.neutral.grey.lightest};\n\n  :hover {\n    border: 2px dashed ${colors.secondary.blue.base};\n    background-color: ${colors.secondary.blue.lightest};\n\n    svg {\n      color: ${colors.secondary.blue.base};\n    }\n  }\n  :active,\n  :focus-within {\n    border: 2px dashed ${colors.secondary.blue.base};\n    box-shadow: 0 0 0 4px ${colors.secondary.blue.light};\n    background-color: ${colors.secondary.blue.lightest};\n\n    svg {\n      color: ${colors.secondary.blue.base};\n    }\n  }\n\n  ${({ isDragOver }) =>\n    isDragOver &&\n    `\n    border: 2px dashed ${colors.secondary.blue.base};\n    box-shadow: 0 0 0 4px ${colors.secondary.blue.light};\n    background-color: ${colors.secondary.blue.lightest};\n\n    svg {\n      color: ${colors.secondary.blue.base};\n    }\n  `}\n\n  ${({ hasUserProvidedNoFiles, isDragOver, isDirty }) =>\n    hasUserProvidedNoFiles &&\n    isDirty &&\n    `\n    border: 2px dashed ${colors.secondary.red.base};\n\n    :hover {\n      border: 2px dashed ${colors.secondary.red.base};\n      background-color: ${colors.secondary.red.lightest};\n\n      svg {\n        color: ${colors.secondary.red.base};\n      }\n    }\n\n    :active, :focus-within {\n      border: 2px dashed ${colors.secondary.red.base};\n      box-shadow: 0 0 0 4px ${colors.secondary.red.light};\n      background-color: ${colors.secondary.red.lightest};\n\n      svg {\n        color: ${colors.secondary.red.base};\n      }\n    }\n\n    ${\n      isDragOver\n        ? `\n    border: 2px dashed ${colors.secondary.red.base};\n    box-shadow: 0 0 0 4px ${colors.secondary.red.light};\n    background-color: ${colors.secondary.red.lightest};\n  `\n        : ''\n    }\n  `}\n\n\n  &:has(input:disabled) {\n    cursor: not-allowed;\n    box-shadow: none;\n    background-color: ${colors.neutral.grey.light};\n    border-color: ${colors.neutral.ink.lightest};\n    color: ${colors.neutral.ink.light};\n\n    svg {\n      color: ${colors.neutral.ink.lightest};\n    }\n  }\n`;\n"],"names":["styled","sizes","radius","colors"],"mappings":";;;;;;;;;;;MAKa,iBAAiB,GAAGA,uBAAM,CAAC,GAAG,sJAS9BC,WAAK,CAAC,IAAI,CACJ,eAAA,EAAAC,aAAM,CAAC,IAAI,CAAA,sHAAA,EAYPC,aAAM,CAAC,OAAO,CAAC,GAAG,CAAC,QAAQ,CAC5B,kBAAA,EAAAA,aAAM,CAAC,OAAO,CAAC,IAAI,CAAC,QAAQ,6BAGzBA,aAAM,CAAC,SAAS,CAAC,IAAI,CAAC,IAAI,CAAA,kBAAA,EAC3BA,aAAM,CAAC,SAAS,CAAC,IAAI,CAAC,QAAQ,cAGvCA,aAAM,CAAC,SAAS,CAAC,IAAI,CAAC,IAAI,CAAA,2CAAA,EAKhBA,aAAM,CAAC,SAAS,CAAC,IAAI,CAAC,IAAI,CACvB,sBAAA,EAAAA,aAAM,CAAC,SAAS,CAAC,IAAI,CAAC,KAAK,CAAA,kBAAA,EAC/BA,aAAM,CAAC,SAAS,CAAC,IAAI,CAAC,QAAQ,CAGvC,WAAA,EAAAA,aAAM,CAAC,SAAS,CAAC,IAAI,CAAC,IAAI,MAIrC,CAAC,EAAE,UAAU,EAAE,KACf,UAAU;AACV,IAAA;AACqB,uBAAA,EAAAA,aAAM,CAAC,SAAS,CAAC,IAAI,CAAC,IAAI,CAAA;AACvB,0BAAA,EAAAA,aAAM,CAAC,SAAS,CAAC,IAAI,CAAC,KAAK,CAAA;AAC/B,sBAAA,EAAAA,aAAM,CAAC,SAAS,CAAC,IAAI,CAAC,QAAQ,CAAA;;;AAGvC,aAAA,EAAAA,aAAM,CAAC,SAAS,CAAC,IAAI,CAAC,IAAI,CAAA;;GAEtC,CAEC,CAAA,EAAA,CAAC,EAAE,sBAAsB,EAAE,UAAU,EAAE,OAAO,EAAE,KAChD,sBAAsB;IACtB,OAAO;AACP,IAAA;AACqB,uBAAA,EAAAA,aAAM,CAAC,SAAS,CAAC,GAAG,CAAC,IAAI,CAAA;;;AAGvB,yBAAA,EAAAA,aAAM,CAAC,SAAS,CAAC,GAAG,CAAC,IAAI,CAAA;AAC1B,wBAAA,EAAAA,aAAM,CAAC,SAAS,CAAC,GAAG,CAAC,QAAQ,CAAA;;;AAGtC,eAAA,EAAAA,aAAM,CAAC,SAAS,CAAC,GAAG,CAAC,IAAI,CAAA;;;;;AAKf,yBAAA,EAAAA,aAAM,CAAC,SAAS,CAAC,GAAG,CAAC,IAAI,CAAA;AACtB,4BAAA,EAAAA,aAAM,CAAC,SAAS,CAAC,GAAG,CAAC,KAAK,CAAA;AAC9B,wBAAA,EAAAA,aAAM,CAAC,SAAS,CAAC,GAAG,CAAC,QAAQ,CAAA;;;AAGtC,eAAA,EAAAA,aAAM,CAAC,SAAS,CAAC,GAAG,CAAC,IAAI,CAAA;;;;MAKpC;AACE,UAAE;AACe,uBAAA,EAAAA,aAAM,CAAC,SAAS,CAAC,GAAG,CAAC,IAAI,CAAA;AACtB,0BAAA,EAAAA,aAAM,CAAC,SAAS,CAAC,GAAG,CAAC,KAAK,CAAA;AAC9B,sBAAA,EAAAA,aAAM,CAAC,SAAS,CAAC,GAAG,CAAC,QAAQ,CAAA;AAClD,EAAA;AACK,UAAE,EACN;AACD,EAAA,CAAA,CAAA,2EAAA,EAMqBA,aAAM,CAAC,OAAO,CAAC,IAAI,CAAC,KAAK,CAC7B,cAAA,EAAAA,aAAM,CAAC,OAAO,CAAC,GAAG,CAAC,QAAQ,CAAA,OAAA,EAClCA,aAAM,CAAC,OAAO,CAAC,GAAG,CAAC,KAAK,CAGtB,WAAA,EAAAA,aAAM,CAAC,OAAO,CAAC,GAAG,CAAC,QAAQ;;;;"}

package/dist/components/UploadFile/styled.d.ts

@@ -1 +1,5 @@
-export declare const DropZoneContainer: import("styled-components").StyledComponent<"div", any, {}, never>;
+export declare const DropZoneContainer: import("styled-components").StyledComponent<"div", any, {
+    hasUserProvidedNoFiles: boolean;
+    isDirty: boolean;
+    isDragOver?: boolean | undefined;
+}, never>;

package/dist/components/UploadFile/styled.js

@@ -3,7 +3,47 @@ import { colors } from '../../theme/modules/colors.js';
 import { radius } from '../../theme/modules/radius.js';
 import { sizes } from '../../theme/modules/sizes.js';
 
-const DropZoneContainer = styled.div.withConfig({ displayName: "vui--DropZoneContainer", componentId: "vui--17v0v3c" }) `display:flex;align-items:center;justify-content:center;padding:${sizes.md};border-radius:${radius.base};input[type='file']{position:absolute;opacity:0;width:1px;height:1px;cursor:pointer;}cursor:pointer;border:2px dashed ${colors.neutral.ink.lightest};background-color:${colors.neutral.grey.lightest};:hover{border:2px dashed ${colors.secondary.blue.base};background-color:${colors.secondary.blue.lightest};}:active{border:2px dashed ${colors.secondary.blue.base};box-shadow:0 0 0 4px ${colors.secondary.blue.light};background-color:${colors.secondary.blue.lightest};}:focus-within{border:2px dashed ${colors.secondary.blue.base};box-shadow:0 0 0 4px ${colors.secondary.blue.light};background-color:${colors.secondary.blue.lightest};}&:has(input:invalid){border:2px dashed ${colors.secondary.red.base};:hover{border:2px dashed ${colors.secondary.red.base};background-color:${colors.secondary.red.lightest};}:active{border:2px dashed ${colors.secondary.red.base};box-shadow:0 0 0 4px ${colors.secondary.red.light};background-color:${colors.secondary.red.lightest};}:focus-within{border:2px dashed ${colors.secondary.red.base};box-shadow:0 0 0 4px ${colors.secondary.red.light};background-color:${colors.secondary.red.lightest};}}&:has(input:disabled){cursor:not-allowed;box-shadow:none;background-color:${colors.neutral.grey.light};border-color:${colors.neutral.ink.lightest};color:${colors.neutral.ink.light};}`;
+const DropZoneContainer = styled.div.withConfig({ displayName: "vui--DropZoneContainer", componentId: "vui--17v0v3c" }) `display:flex;align-items:center;justify-content:center;padding:${sizes.base};border-radius:${radius.base};input[type='file']{position:absolute;opacity:0;width:1px;height:1px;cursor:pointer;}cursor:pointer;border:2px dashed ${colors.neutral.ink.lightest};background-color:${colors.neutral.grey.lightest};:hover{border:2px dashed ${colors.secondary.blue.base};background-color:${colors.secondary.blue.lightest};svg{color:${colors.secondary.blue.base};}}:active,:focus-within{border:2px dashed ${colors.secondary.blue.base};box-shadow:0 0 0 4px ${colors.secondary.blue.light};background-color:${colors.secondary.blue.lightest};svg{color:${colors.secondary.blue.base};}}${({ isDragOver }) => isDragOver &&
+    `
+    border: 2px dashed ${colors.secondary.blue.base};
+    box-shadow: 0 0 0 4px ${colors.secondary.blue.light};
+    background-color: ${colors.secondary.blue.lightest};
+
+    svg {
+      color: ${colors.secondary.blue.base};
+    }
+  `} ${({ hasUserProvidedNoFiles, isDragOver, isDirty }) => hasUserProvidedNoFiles &&
+    isDirty &&
+    `
+    border: 2px dashed ${colors.secondary.red.base};
+
+    :hover {
+      border: 2px dashed ${colors.secondary.red.base};
+      background-color: ${colors.secondary.red.lightest};
+
+      svg {
+        color: ${colors.secondary.red.base};
+      }
+    }
+
+    :active, :focus-within {
+      border: 2px dashed ${colors.secondary.red.base};
+      box-shadow: 0 0 0 4px ${colors.secondary.red.light};
+      background-color: ${colors.secondary.red.lightest};
+
+      svg {
+        color: ${colors.secondary.red.base};
+      }
+    }
+
+    ${isDragOver
+        ? `
+    border: 2px dashed ${colors.secondary.red.base};
+    box-shadow: 0 0 0 4px ${colors.secondary.red.light};
+    background-color: ${colors.secondary.red.lightest};
+  `
+        : ''}
+  `} &:has(input:disabled){cursor:not-allowed;box-shadow:none;background-color:${colors.neutral.grey.light};border-color:${colors.neutral.ink.lightest};color:${colors.neutral.ink.light};svg{color:${colors.neutral.ink.lightest};}}`;
 
 export { DropZoneContainer };
 //# sourceMappingURL=styled.js.map

package/dist/components/UploadFile/styled.js.map

@@ -1 +1 @@
-{"version":3,"file":"styled.js","sources":["../../../src/components/UploadFile/styled.tsx"],"sourcesContent":["import styled from 'styled-components';\nimport { colors } from '../../theme/modules/colors';\nimport { radius } from '../../theme/modules/radius';\nimport { sizes } from '../../theme/modules/sizes';\n\nexport const DropZoneContainer = styled.div`\n  display: flex;\n  align-items: center;\n  justify-content: center;\n\n  padding: ${sizes.md};\n  border-radius: ${radius.base};\n\n  input[type='file'] {\n    position: absolute;\n    opacity: 0;\n    width: 1px;\n    height: 1px;\n    cursor: pointer;\n  }\n\n  cursor: pointer;\n\n  border: 2px dashed ${colors.neutral.ink.lightest};\n  background-color: ${colors.neutral.grey.lightest};\n\n  :hover {\n    border: 2px dashed ${colors.secondary.blue.base};\n    background-color: ${colors.secondary.blue.lightest};\n  }\n  :active {\n    border: 2px dashed ${colors.secondary.blue.base};\n    box-shadow: 0 0 0 4px ${colors.secondary.blue.light};\n    background-color: ${colors.secondary.blue.lightest};\n  }\n  :focus-within {\n    border: 2px dashed ${colors.secondary.blue.base};\n    box-shadow: 0 0 0 4px ${colors.secondary.blue.light};\n    background-color: ${colors.secondary.blue.lightest};\n  }\n\n  &:has(input:invalid) {\n    border: 2px dashed ${colors.secondary.red.base};\n    :hover {\n      border: 2px dashed ${colors.secondary.red.base};\n      background-color: ${colors.secondary.red.lightest};\n    }\n\n    :active {\n      border: 2px dashed ${colors.secondary.red.base};\n      box-shadow: 0 0 0 4px ${colors.secondary.red.light};\n      background-color: ${colors.secondary.red.lightest};\n    }\n\n    :focus-within {\n      border: 2px dashed ${colors.secondary.red.base};\n      box-shadow: 0 0 0 4px ${colors.secondary.red.light};\n      background-color: ${colors.secondary.red.lightest};\n    }\n  }\n\n  &:has(input:disabled) {\n    cursor: not-allowed;\n    box-shadow: none;\n    background-color: ${colors.neutral.grey.light};\n    border-color: ${colors.neutral.ink.lightest};\n    color: ${colors.neutral.ink.light};\n  }\n`;\n"],"names":[],"mappings":";;;;;MAKa,iBAAiB,GAAG,MAAM,CAAC,GAAG,sJAK9B,KAAK,CAAC,EAAE,CACF,eAAA,EAAA,MAAM,CAAC,IAAI,CAAA,sHAAA,EAYP,MAAM,CAAC,OAAO,CAAC,GAAG,CAAC,QAAQ,CAC5B,kBAAA,EAAA,MAAM,CAAC,OAAO,CAAC,IAAI,CAAC,QAAQ,6BAGzB,MAAM,CAAC,SAAS,CAAC,IAAI,CAAC,IAAI,CAAA,kBAAA,EAC3B,MAAM,CAAC,SAAS,CAAC,IAAI,CAAC,QAAQ,+BAG7B,MAAM,CAAC,SAAS,CAAC,IAAI,CAAC,IAAI,CAAA,sBAAA,EACvB,MAAM,CAAC,SAAS,CAAC,IAAI,CAAC,KAAK,CAC/B,kBAAA,EAAA,MAAM,CAAC,SAAS,CAAC,IAAI,CAAC,QAAQ,qCAG7B,MAAM,CAAC,SAAS,CAAC,IAAI,CAAC,IAAI,CAAA,sBAAA,EACvB,MAAM,CAAC,SAAS,CAAC,IAAI,CAAC,KAAK,CAC/B,kBAAA,EAAA,MAAM,CAAC,SAAS,CAAC,IAAI,CAAC,QAAQ,CAAA,yCAAA,EAI7B,MAAM,CAAC,SAAS,CAAC,GAAG,CAAC,IAAI,CAEvB,0BAAA,EAAA,MAAM,CAAC,SAAS,CAAC,GAAG,CAAC,IAAI,qBAC1B,MAAM,CAAC,SAAS,CAAC,GAAG,CAAC,QAAQ,CAAA,4BAAA,EAI5B,MAAM,CAAC,SAAS,CAAC,GAAG,CAAC,IAAI,CACtB,sBAAA,EAAA,MAAM,CAAC,SAAS,CAAC,GAAG,CAAC,KAAK,qBAC9B,MAAM,CAAC,SAAS,CAAC,GAAG,CAAC,QAAQ,CAI5B,kCAAA,EAAA,MAAM,CAAC,SAAS,CAAC,GAAG,CAAC,IAAI,yBACtB,MAAM,CAAC,SAAS,CAAC,GAAG,CAAC,KAAK,CAAA,kBAAA,EAC9B,MAAM,CAAC,SAAS,CAAC,GAAG,CAAC,QAAQ,CAO/B,6EAAA,EAAA,MAAM,CAAC,OAAO,CAAC,IAAI,CAAC,KAAK,iBAC7B,MAAM,CAAC,OAAO,CAAC,GAAG,CAAC,QAAQ,CAAA,OAAA,EAClC,MAAM,CAAC,OAAO,CAAC,GAAG,CAAC,KAAK,CAAA,EAAA;;;;"}
+{"version":3,"file":"styled.js","sources":["../../../src/components/UploadFile/styled.tsx"],"sourcesContent":["import styled from 'styled-components';\nimport { colors } from '../../theme/modules/colors';\nimport { radius } from '../../theme/modules/radius';\nimport { sizes } from '../../theme/modules/sizes';\n\nexport const DropZoneContainer = styled.div<{\n  hasUserProvidedNoFiles: boolean;\n  isDirty: boolean;\n  isDragOver?: boolean;\n}>`\n  display: flex;\n  align-items: center;\n  justify-content: center;\n\n  padding: ${sizes.base};\n  border-radius: ${radius.base};\n\n  input[type='file'] {\n    position: absolute;\n    opacity: 0;\n    width: 1px;\n    height: 1px;\n    cursor: pointer;\n  }\n\n  cursor: pointer;\n\n  border: 2px dashed ${colors.neutral.ink.lightest};\n  background-color: ${colors.neutral.grey.lightest};\n\n  :hover {\n    border: 2px dashed ${colors.secondary.blue.base};\n    background-color: ${colors.secondary.blue.lightest};\n\n    svg {\n      color: ${colors.secondary.blue.base};\n    }\n  }\n  :active,\n  :focus-within {\n    border: 2px dashed ${colors.secondary.blue.base};\n    box-shadow: 0 0 0 4px ${colors.secondary.blue.light};\n    background-color: ${colors.secondary.blue.lightest};\n\n    svg {\n      color: ${colors.secondary.blue.base};\n    }\n  }\n\n  ${({ isDragOver }) =>\n    isDragOver &&\n    `\n    border: 2px dashed ${colors.secondary.blue.base};\n    box-shadow: 0 0 0 4px ${colors.secondary.blue.light};\n    background-color: ${colors.secondary.blue.lightest};\n\n    svg {\n      color: ${colors.secondary.blue.base};\n    }\n  `}\n\n  ${({ hasUserProvidedNoFiles, isDragOver, isDirty }) =>\n    hasUserProvidedNoFiles &&\n    isDirty &&\n    `\n    border: 2px dashed ${colors.secondary.red.base};\n\n    :hover {\n      border: 2px dashed ${colors.secondary.red.base};\n      background-color: ${colors.secondary.red.lightest};\n\n      svg {\n        color: ${colors.secondary.red.base};\n      }\n    }\n\n    :active, :focus-within {\n      border: 2px dashed ${colors.secondary.red.base};\n      box-shadow: 0 0 0 4px ${colors.secondary.red.light};\n      background-color: ${colors.secondary.red.lightest};\n\n      svg {\n        color: ${colors.secondary.red.base};\n      }\n    }\n\n    ${\n      isDragOver\n        ? `\n    border: 2px dashed ${colors.secondary.red.base};\n    box-shadow: 0 0 0 4px ${colors.secondary.red.light};\n    background-color: ${colors.secondary.red.lightest};\n  `\n        : ''\n    }\n  `}\n\n\n  &:has(input:disabled) {\n    cursor: not-allowed;\n    box-shadow: none;\n    background-color: ${colors.neutral.grey.light};\n    border-color: ${colors.neutral.ink.lightest};\n    color: ${colors.neutral.ink.light};\n\n    svg {\n      color: ${colors.neutral.ink.lightest};\n    }\n  }\n`;\n"],"names":[],"mappings":";;;;;MAKa,iBAAiB,GAAG,MAAM,CAAC,GAAG,sJAS9B,KAAK,CAAC,IAAI,CACJ,eAAA,EAAA,MAAM,CAAC,IAAI,CAAA,sHAAA,EAYP,MAAM,CAAC,OAAO,CAAC,GAAG,CAAC,QAAQ,CAC5B,kBAAA,EAAA,MAAM,CAAC,OAAO,CAAC,IAAI,CAAC,QAAQ,6BAGzB,MAAM,CAAC,SAAS,CAAC,IAAI,CAAC,IAAI,CAAA,kBAAA,EAC3B,MAAM,CAAC,SAAS,CAAC,IAAI,CAAC,QAAQ,cAGvC,MAAM,CAAC,SAAS,CAAC,IAAI,CAAC,IAAI,CAAA,2CAAA,EAKhB,MAAM,CAAC,SAAS,CAAC,IAAI,CAAC,IAAI,CACvB,sBAAA,EAAA,MAAM,CAAC,SAAS,CAAC,IAAI,CAAC,KAAK,CAAA,kBAAA,EAC/B,MAAM,CAAC,SAAS,CAAC,IAAI,CAAC,QAAQ,CAGvC,WAAA,EAAA,MAAM,CAAC,SAAS,CAAC,IAAI,CAAC,IAAI,MAIrC,CAAC,EAAE,UAAU,EAAE,KACf,UAAU;AACV,IAAA;AACqB,uBAAA,EAAA,MAAM,CAAC,SAAS,CAAC,IAAI,CAAC,IAAI,CAAA;AACvB,0BAAA,EAAA,MAAM,CAAC,SAAS,CAAC,IAAI,CAAC,KAAK,CAAA;AAC/B,sBAAA,EAAA,MAAM,CAAC,SAAS,CAAC,IAAI,CAAC,QAAQ,CAAA;;;AAGvC,aAAA,EAAA,MAAM,CAAC,SAAS,CAAC,IAAI,CAAC,IAAI,CAAA;;GAEtC,CAEC,CAAA,EAAA,CAAC,EAAE,sBAAsB,EAAE,UAAU,EAAE,OAAO,EAAE,KAChD,sBAAsB;IACtB,OAAO;AACP,IAAA;AACqB,uBAAA,EAAA,MAAM,CAAC,SAAS,CAAC,GAAG,CAAC,IAAI,CAAA;;;AAGvB,yBAAA,EAAA,MAAM,CAAC,SAAS,CAAC,GAAG,CAAC,IAAI,CAAA;AAC1B,wBAAA,EAAA,MAAM,CAAC,SAAS,CAAC,GAAG,CAAC,QAAQ,CAAA;;;AAGtC,eAAA,EAAA,MAAM,CAAC,SAAS,CAAC,GAAG,CAAC,IAAI,CAAA;;;;;AAKf,yBAAA,EAAA,MAAM,CAAC,SAAS,CAAC,GAAG,CAAC,IAAI,CAAA;AACtB,4BAAA,EAAA,MAAM,CAAC,SAAS,CAAC,GAAG,CAAC,KAAK,CAAA;AAC9B,wBAAA,EAAA,MAAM,CAAC,SAAS,CAAC,GAAG,CAAC,QAAQ,CAAA;;;AAGtC,eAAA,EAAA,MAAM,CAAC,SAAS,CAAC,GAAG,CAAC,IAAI,CAAA;;;;MAKpC;AACE,UAAE;AACe,uBAAA,EAAA,MAAM,CAAC,SAAS,CAAC,GAAG,CAAC,IAAI,CAAA;AACtB,0BAAA,EAAA,MAAM,CAAC,SAAS,CAAC,GAAG,CAAC,KAAK,CAAA;AAC9B,sBAAA,EAAA,MAAM,CAAC,SAAS,CAAC,GAAG,CAAC,QAAQ,CAAA;AAClD,EAAA;AACK,UAAE,EACN;AACD,EAAA,CAAA,CAAA,2EAAA,EAMqB,MAAM,CAAC,OAAO,CAAC,IAAI,CAAC,KAAK,CAC7B,cAAA,EAAA,MAAM,CAAC,OAAO,CAAC,GAAG,CAAC,QAAQ,CAAA,OAAA,EAClC,MAAM,CAAC,OAAO,CAAC,GAAG,CAAC,KAAK,CAGtB,WAAA,EAAA,MAAM,CAAC,OAAO,CAAC,GAAG,CAAC,QAAQ;;;;"}

package/dist/components/UploadFile/types.d.ts

@@ -1,9 +1,23 @@
 /// <reference types="react" />
-import { AcceptedFileTypes, FileSizeUnit } from './constants';
+import { AcceptedFileTypes, ErrorType, FileSizeUnit } from './constants';
 export interface UploadFileProps extends React.InputHTMLAttributes<HTMLInputElement> {
     id: string;
     fileTypes: Array<AcceptedFileTypes>;
     label?: string;
     format?: FileSizeUnit;
     maxBytes?: number;
+    errorMessage?: string;
+    hideUploadedFiles?: boolean;
+    onMaxFilesExceeded?: () => void;
+    maxFiles?: number;
+    disabledMessage?: string;
+    isDirty?: boolean;
 }
+export type UploadFileErrors = {
+    criticalErrors: Array<UploadFileError>;
+};
+type UploadFileError = {
+    errorType: ErrorType;
+    errorMessage: string;
+};
+export {};

package/dist/components/UploadFile/utils/convertFileTypeToAcceptedFileExtension/convertFileTypeToAcceptedFileExtension.d.ts

@@ -0,0 +1 @@
+export declare const convertFileTypeToAcceptedFileExtension: (fileType: string) => string;

package/dist/components/UploadFile/utils/convertFileTypeToAcceptedFileExtension/convertFileTypeToAcceptedFileType.cjs

@@ -0,0 +1,17 @@
+'use strict';
+
+const convertFileTypeToAcceptedFileExtension = (fileType) => {
+    if (typeof fileType !== 'string' || !fileType.includes('/')) {
+        throw new Error('Invalid MIME type');
+    }
+    // Remove any MIME parameter (e.g., ";charset=UTF-8")
+    const [typePart] = fileType.split(';');
+    const [group, type] = typePart.trim().split('/');
+    if (!group || !type) {
+        throw new Error('Invalid MIME type');
+    }
+    return `.${type}`;
+};
+
+exports.convertFileTypeToAcceptedFileExtension = convertFileTypeToAcceptedFileExtension;
+//# sourceMappingURL=convertFileTypeToAcceptedFileType.cjs.map

package/dist/components/UploadFile/utils/convertFileTypeToAcceptedFileExtension/convertFileTypeToAcceptedFileType.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"convertFileTypeToAcceptedFileType.cjs","sources":["../../../../../src/components/UploadFile/utils/convertFileTypeToAcceptedFileExtension/convertFileTypeToAcceptedFileType.ts"],"sourcesContent":["export const convertFileTypeToAcceptedFileExtension = (fileType: string) => {\n  if (typeof fileType !== 'string' || !fileType.includes('/')) {\n    throw new Error('Invalid MIME type');\n  }\n  // Remove any MIME parameter (e.g., \";charset=UTF-8\")\n  const [typePart] = fileType.split(';');\n  const [group, type] = typePart.trim().split('/');\n  if (!group || !type) {\n    throw new Error('Invalid MIME type');\n  }\n  return `.${type}`;\n};\n"],"names":[],"mappings":";;AAAa,MAAA,sCAAsC,GAAG,CAAC,QAAgB,KAAI;AACzE,IAAA,IAAI,OAAO,QAAQ,KAAK,QAAQ,IAAI,CAAC,QAAQ,CAAC,QAAQ,CAAC,GAAG,CAAC,EAAE;AAC3D,QAAA,MAAM,IAAI,KAAK,CAAC,mBAAmB,CAAC;AACrC;;IAED,MAAM,CAAC,QAAQ,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC,GAAG,CAAC;AACtC,IAAA,MAAM,CAAC,KAAK,EAAE,IAAI,CAAC,GAAG,QAAQ,CAAC,IAAI,EAAE,CAAC,KAAK,CAAC,GAAG,CAAC;AAChD,IAAA,IAAI,CAAC,KAAK,IAAI,CAAC,IAAI,EAAE;AACnB,QAAA,MAAM,IAAI,KAAK,CAAC,mBAAmB,CAAC;AACrC;IACD,OAAO,CAAA,CAAA,EAAI,IAAI,CAAA,CAAE;AACnB;;;;"}

package/dist/components/UploadFile/utils/convertFileTypeToAcceptedFileExtension/convertFileTypeToAcceptedFileType.d.ts

@@ -0,0 +1 @@
+export declare const convertFileTypeToAcceptedFileExtension: (fileType: string) => string;

package/dist/components/UploadFile/utils/convertFileTypeToAcceptedFileExtension/convertFileTypeToAcceptedFileType.js

@@ -0,0 +1,15 @@
+const convertFileTypeToAcceptedFileExtension = (fileType) => {
+    if (typeof fileType !== 'string' || !fileType.includes('/')) {
+        throw new Error('Invalid MIME type');
+    }
+    // Remove any MIME parameter (e.g., ";charset=UTF-8")
+    const [typePart] = fileType.split(';');
+    const [group, type] = typePart.trim().split('/');
+    if (!group || !type) {
+        throw new Error('Invalid MIME type');
+    }
+    return `.${type}`;
+};
+
+export { convertFileTypeToAcceptedFileExtension };
+//# sourceMappingURL=convertFileTypeToAcceptedFileType.js.map

package/dist/components/UploadFile/utils/convertFileTypeToAcceptedFileExtension/convertFileTypeToAcceptedFileType.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"convertFileTypeToAcceptedFileType.js","sources":["../../../../../src/components/UploadFile/utils/convertFileTypeToAcceptedFileExtension/convertFileTypeToAcceptedFileType.ts"],"sourcesContent":["export const convertFileTypeToAcceptedFileExtension = (fileType: string) => {\n  if (typeof fileType !== 'string' || !fileType.includes('/')) {\n    throw new Error('Invalid MIME type');\n  }\n  // Remove any MIME parameter (e.g., \";charset=UTF-8\")\n  const [typePart] = fileType.split(';');\n  const [group, type] = typePart.trim().split('/');\n  if (!group || !type) {\n    throw new Error('Invalid MIME type');\n  }\n  return `.${type}`;\n};\n"],"names":[],"mappings":"AAAa,MAAA,sCAAsC,GAAG,CAAC,QAAgB,KAAI;AACzE,IAAA,IAAI,OAAO,QAAQ,KAAK,QAAQ,IAAI,CAAC,QAAQ,CAAC,QAAQ,CAAC,GAAG,CAAC,EAAE;AAC3D,QAAA,MAAM,IAAI,KAAK,CAAC,mBAAmB,CAAC;AACrC;;IAED,MAAM,CAAC,QAAQ,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC,GAAG,CAAC;AACtC,IAAA,MAAM,CAAC,KAAK,EAAE,IAAI,CAAC,GAAG,QAAQ,CAAC,IAAI,EAAE,CAAC,KAAK,CAAC,GAAG,CAAC;AAChD,IAAA,IAAI,CAAC,KAAK,IAAI,CAAC,IAAI,EAAE;AACnB,QAAA,MAAM,IAAI,KAAK,CAAC,mBAAmB,CAAC;AACrC;IACD,OAAO,CAAA,CAAA,EAAI,IAAI,CAAA,CAAE;AACnB;;;;"}

package/dist/components/UploadFile/utils/convertFileTypeToAcceptedFileExtension/index.d.ts

@@ -0,0 +1 @@
+export { convertFileTypeToAcceptedFileExtension } from './convertFileTypeToAcceptedFileType';

package/dist/components/UploadFile/utils/getFileSizeString/getFileSizeString.cjs

@@ -3,30 +3,33 @@
 var constants = require('../../constants.cjs');
 
 /**
- * Constructs a string intended to be consumed by an <input> element of type "file". This string
- * should go inside the accept property
+ * Converts a file size in bytes to a human-readable string with the specified format unit.
  *
  * E.g.
  *
  * const maxSizeCopy = getFileSizeString({
- *  maxBytes: 10000,
+ *  maxBytes: 10000000,
  *  format: FileSizeUnit.MB
  * });
  *
- * Where @constant maxSizeCopy would equal "Max size: 1 MB"
+ * Where @constant maxSizeCopy would equal "Maximum file size: 10 MB"
  *
- * @param fileTypes - A list of file types, each value being of @type AcceptedFileTypes
- * the returned string
+ * @param maxBytes - The file size in bytes to convert
+ * @param format - The unit format to display (KB or MB)
+ * @param baseString - Optional prefix string, defaults to "Maximum file size: "
+ * @param digits - Number of decimal places to show, defaults to 2 (strips any leading zeros)
+ * @returns A formatted string representing the file size
  */
-const getFileSizeString = ({ maxBytes, format, baseString }) => {
-    const base = baseString == null ? 'Max size: ' : baseString;
+const getFileSizeString = ({ maxBytes, format, baseString, digits = 2, }) => {
+    const base = baseString !== null && baseString !== undefined ? baseString : 'Maximum file size: ';
+    const getValue = (divisor) => parseFloat((maxBytes / divisor).toFixed(digits));
     switch (format) {
         case constants.FileSizeUnit.KB:
-            return `${base}${Number(maxBytes) / 1000} KB`;
+            return `${base}${getValue(1000)} KB`;
         case constants.FileSizeUnit.MB:
-            return `${base}${Number(maxBytes) / 1000000} MB`;
+            return `${base}${getValue(1000000)} MB`;
         default:
-            return `${base}${Number(maxBytes) / 1000} KB`;
+            return `${base}${getValue(1000)} KB`;
     }
 };
 

package/dist/components/UploadFile/utils/getFileSizeString/getFileSizeString.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"getFileSizeString.cjs","sources":["../../../../../src/components/UploadFile/utils/getFileSizeString/getFileSizeString.ts"],"sourcesContent":["import { FileSizeUnit } from '../../constants';\n\ntype GetFileSizeStringProps = {\n  maxBytes: number;\n  format: FileSizeUnit;\n  baseString?: string;\n};\n/**\n * Constructs a string intended to be consumed by an <input> element of type \"file\". This string\n * should go inside the accept property \n *\n * E.g.\n *\n * const maxSizeCopy = getFileSizeString({\n *  maxBytes: 10000,\n *  format: FileSizeUnit.MB\n * });\n *\n * Where @constant maxSizeCopy would equal \"Max size: 1 MB\"\n *\n * @param fileTypes - A list of file types, each value being of @type AcceptedFileTypes\n * the returned string\n */\nexport const getFileSizeString = ({ maxBytes, format, baseString }: GetFileSizeStringProps) => {\n  const base = baseString == null ? 'Max size: ' : baseString;\n  switch (format) {\n    case FileSizeUnit.KB:\n      return `${base}${Number(maxBytes) / 1000} KB`;\n    case FileSizeUnit.MB:\n      return `${base}${Number(maxBytes) / 1000000} MB`;\n    default:\n      return `${base}${Number(maxBytes) / 1000} KB`;\n  }\n};\n"],"names":["FileSizeUnit"],"mappings":";;;;AAOA;;;;;;;;;;;;;;;AAeG;AACI,MAAM,iBAAiB,GAAG,CAAC,EAAE,QAAQ,EAAE,MAAM,EAAE,UAAU,EAA0B,KAAI;AAC5F,IAAA,MAAM,IAAI,GAAG,UAAU,IAAI,IAAI,GAAG,YAAY,GAAG,UAAU;AAC3D,IAAA,QAAQ,MAAM;QACZ,KAAKA,sBAAY,CAAC,EAAE;YAClB,OAAO,CAAA,EAAG,IAAI,CAAA,EAAG,MAAM,CAAC,QAAQ,CAAC,GAAG,IAAI,CAAA,GAAA,CAAK;QAC/C,KAAKA,sBAAY,CAAC,EAAE;YAClB,OAAO,CAAA,EAAG,IAAI,CAAA,EAAG,MAAM,CAAC,QAAQ,CAAC,GAAG,OAAO,CAAA,GAAA,CAAK;AAClD,QAAA;YACE,OAAO,CAAA,EAAG,IAAI,CAAA,EAAG,MAAM,CAAC,QAAQ,CAAC,GAAG,IAAI,CAAA,GAAA,CAAK;AAChD;AACH;;;;"}
+{"version":3,"file":"getFileSizeString.cjs","sources":["../../../../../src/components/UploadFile/utils/getFileSizeString/getFileSizeString.ts"],"sourcesContent":["import { FileSizeUnit } from '../../constants';\n\ntype GetFileSizeStringProps = {\n  maxBytes: number;\n  format: FileSizeUnit;\n  baseString?: string;\n  digits?: number;\n};\n/**\n * Converts a file size in bytes to a human-readable string with the specified format unit.\n *\n * E.g.\n *\n * const maxSizeCopy = getFileSizeString({\n *  maxBytes: 10000000,\n *  format: FileSizeUnit.MB\n * });\n *\n * Where @constant maxSizeCopy would equal \"Maximum file size: 10 MB\"\n *\n * @param maxBytes - The file size in bytes to convert\n * @param format - The unit format to display (KB or MB)\n * @param baseString - Optional prefix string, defaults to \"Maximum file size: \"\n * @param digits - Number of decimal places to show, defaults to 2 (strips any leading zeros)\n * @returns A formatted string representing the file size\n */\nexport const getFileSizeString = ({\n  maxBytes,\n  format,\n  baseString,\n  digits = 2,\n}: GetFileSizeStringProps) => {\n  const base = baseString ?? 'Maximum file size: ';\n  const getValue = (divisor: number) => parseFloat((maxBytes / divisor).toFixed(digits));\n  switch (format) {\n    case FileSizeUnit.KB:\n      return `${base}${getValue(1000)} KB`;\n    case FileSizeUnit.MB:\n      return `${base}${getValue(1000000)} MB`;\n    default:\n      return `${base}${getValue(1000)} KB`;\n  }\n};\n"],"names":["FileSizeUnit"],"mappings":";;;;AAQA;;;;;;;;;;;;;;;;;AAiBG;AACU,MAAA,iBAAiB,GAAG,CAAC,EAChC,QAAQ,EACR,MAAM,EACN,UAAU,EACV,MAAM,GAAG,CAAC,GACa,KAAI;IAC3B,MAAM,IAAI,GAAG,UAAU,KAAA,IAAA,IAAV,UAAU,KAAV,SAAA,GAAA,UAAU,GAAI,qBAAqB;IAChD,MAAM,QAAQ,GAAG,CAAC,OAAe,KAAK,UAAU,CAAC,CAAC,QAAQ,GAAG,OAAO,EAAE,OAAO,CAAC,MAAM,CAAC,CAAC;AACtF,IAAA,QAAQ,MAAM;QACZ,KAAKA,sBAAY,CAAC,EAAE;YAClB,OAAO,CAAA,EAAG,IAAI,CAAG,EAAA,QAAQ,CAAC,IAAI,CAAC,KAAK;QACtC,KAAKA,sBAAY,CAAC,EAAE;YAClB,OAAO,CAAA,EAAG,IAAI,CAAG,EAAA,QAAQ,CAAC,OAAO,CAAC,KAAK;AACzC,QAAA;YACE,OAAO,CAAA,EAAG,IAAI,CAAG,EAAA,QAAQ,CAAC,IAAI,CAAC,KAAK;AACvC;AACH;;;;"}

package/dist/components/UploadFile/utils/getFileSizeString/getFileSizeString.d.ts

@@ -3,22 +3,25 @@ type GetFileSizeStringProps = {
     maxBytes: number;
     format: FileSizeUnit;
     baseString?: string;
+    digits?: number;
 };
 /**
- * Constructs a string intended to be consumed by an <input> element of type "file". This string
- * should go inside the accept property
+ * Converts a file size in bytes to a human-readable string with the specified format unit.
  *
  * E.g.
  *
  * const maxSizeCopy = getFileSizeString({
- *  maxBytes: 10000,
+ *  maxBytes: 10000000,
  *  format: FileSizeUnit.MB
  * });
  *
- * Where @constant maxSizeCopy would equal "Max size: 1 MB"
+ * Where @constant maxSizeCopy would equal "Maximum file size: 10 MB"
  *
- * @param fileTypes - A list of file types, each value being of @type AcceptedFileTypes
- * the returned string
+ * @param maxBytes - The file size in bytes to convert
+ * @param format - The unit format to display (KB or MB)
+ * @param baseString - Optional prefix string, defaults to "Maximum file size: "
+ * @param digits - Number of decimal places to show, defaults to 2 (strips any leading zeros)
+ * @returns A formatted string representing the file size
  */
-export declare const getFileSizeString: ({ maxBytes, format, baseString }: GetFileSizeStringProps) => string;
+export declare const getFileSizeString: ({ maxBytes, format, baseString, digits, }: GetFileSizeStringProps) => string;
 export {};

package/dist/components/UploadFile/utils/getFileSizeString/getFileSizeString.js

@@ -1,30 +1,33 @@
 import { FileSizeUnit } from '../../constants.js';
 
 /**
- * Constructs a string intended to be consumed by an <input> element of type "file". This string
- * should go inside the accept property
+ * Converts a file size in bytes to a human-readable string with the specified format unit.
  *
  * E.g.
  *
  * const maxSizeCopy = getFileSizeString({
- *  maxBytes: 10000,
+ *  maxBytes: 10000000,
  *  format: FileSizeUnit.MB
  * });
  *
- * Where @constant maxSizeCopy would equal "Max size: 1 MB"
+ * Where @constant maxSizeCopy would equal "Maximum file size: 10 MB"
  *
- * @param fileTypes - A list of file types, each value being of @type AcceptedFileTypes
- * the returned string
+ * @param maxBytes - The file size in bytes to convert
+ * @param format - The unit format to display (KB or MB)
+ * @param baseString - Optional prefix string, defaults to "Maximum file size: "
+ * @param digits - Number of decimal places to show, defaults to 2 (strips any leading zeros)
+ * @returns A formatted string representing the file size
  */
-const getFileSizeString = ({ maxBytes, format, baseString }) => {
-    const base = baseString == null ? 'Max size: ' : baseString;
+const getFileSizeString = ({ maxBytes, format, baseString, digits = 2, }) => {
+    const base = baseString !== null && baseString !== undefined ? baseString : 'Maximum file size: ';
+    const getValue = (divisor) => parseFloat((maxBytes / divisor).toFixed(digits));
     switch (format) {
         case FileSizeUnit.KB:
-            return `${base}${Number(maxBytes) / 1000} KB`;
+            return `${base}${getValue(1000)} KB`;
         case FileSizeUnit.MB:
-            return `${base}${Number(maxBytes) / 1000000} MB`;
+            return `${base}${getValue(1000000)} MB`;
         default:
-            return `${base}${Number(maxBytes) / 1000} KB`;
+            return `${base}${getValue(1000)} KB`;
     }
 };
 

package/dist/components/UploadFile/utils/getFileSizeString/getFileSizeString.js.map

@@ -1 +1 @@
-{"version":3,"file":"getFileSizeString.js","sources":["../../../../../src/components/UploadFile/utils/getFileSizeString/getFileSizeString.ts"],"sourcesContent":["import { FileSizeUnit } from '../../constants';\n\ntype GetFileSizeStringProps = {\n  maxBytes: number;\n  format: FileSizeUnit;\n  baseString?: string;\n};\n/**\n * Constructs a string intended to be consumed by an <input> element of type \"file\". This string\n * should go inside the accept property \n *\n * E.g.\n *\n * const maxSizeCopy = getFileSizeString({\n *  maxBytes: 10000,\n *  format: FileSizeUnit.MB\n * });\n *\n * Where @constant maxSizeCopy would equal \"Max size: 1 MB\"\n *\n * @param fileTypes - A list of file types, each value being of @type AcceptedFileTypes\n * the returned string\n */\nexport const getFileSizeString = ({ maxBytes, format, baseString }: GetFileSizeStringProps) => {\n  const base = baseString == null ? 'Max size: ' : baseString;\n  switch (format) {\n    case FileSizeUnit.KB:\n      return `${base}${Number(maxBytes) / 1000} KB`;\n    case FileSizeUnit.MB:\n      return `${base}${Number(maxBytes) / 1000000} MB`;\n    default:\n      return `${base}${Number(maxBytes) / 1000} KB`;\n  }\n};\n"],"names":[],"mappings":";;AAOA;;;;;;;;;;;;;;;AAeG;AACI,MAAM,iBAAiB,GAAG,CAAC,EAAE,QAAQ,EAAE,MAAM,EAAE,UAAU,EAA0B,KAAI;AAC5F,IAAA,MAAM,IAAI,GAAG,UAAU,IAAI,IAAI,GAAG,YAAY,GAAG,UAAU;AAC3D,IAAA,QAAQ,MAAM;QACZ,KAAK,YAAY,CAAC,EAAE;YAClB,OAAO,CAAA,EAAG,IAAI,CAAA,EAAG,MAAM,CAAC,QAAQ,CAAC,GAAG,IAAI,CAAA,GAAA,CAAK;QAC/C,KAAK,YAAY,CAAC,EAAE;YAClB,OAAO,CAAA,EAAG,IAAI,CAAA,EAAG,MAAM,CAAC,QAAQ,CAAC,GAAG,OAAO,CAAA,GAAA,CAAK;AAClD,QAAA;YACE,OAAO,CAAA,EAAG,IAAI,CAAA,EAAG,MAAM,CAAC,QAAQ,CAAC,GAAG,IAAI,CAAA,GAAA,CAAK;AAChD;AACH;;;;"}
+{"version":3,"file":"getFileSizeString.js","sources":["../../../../../src/components/UploadFile/utils/getFileSizeString/getFileSizeString.ts"],"sourcesContent":["import { FileSizeUnit } from '../../constants';\n\ntype GetFileSizeStringProps = {\n  maxBytes: number;\n  format: FileSizeUnit;\n  baseString?: string;\n  digits?: number;\n};\n/**\n * Converts a file size in bytes to a human-readable string with the specified format unit.\n *\n * E.g.\n *\n * const maxSizeCopy = getFileSizeString({\n *  maxBytes: 10000000,\n *  format: FileSizeUnit.MB\n * });\n *\n * Where @constant maxSizeCopy would equal \"Maximum file size: 10 MB\"\n *\n * @param maxBytes - The file size in bytes to convert\n * @param format - The unit format to display (KB or MB)\n * @param baseString - Optional prefix string, defaults to \"Maximum file size: \"\n * @param digits - Number of decimal places to show, defaults to 2 (strips any leading zeros)\n * @returns A formatted string representing the file size\n */\nexport const getFileSizeString = ({\n  maxBytes,\n  format,\n  baseString,\n  digits = 2,\n}: GetFileSizeStringProps) => {\n  const base = baseString ?? 'Maximum file size: ';\n  const getValue = (divisor: number) => parseFloat((maxBytes / divisor).toFixed(digits));\n  switch (format) {\n    case FileSizeUnit.KB:\n      return `${base}${getValue(1000)} KB`;\n    case FileSizeUnit.MB:\n      return `${base}${getValue(1000000)} MB`;\n    default:\n      return `${base}${getValue(1000)} KB`;\n  }\n};\n"],"names":[],"mappings":";;AAQA;;;;;;;;;;;;;;;;;AAiBG;AACU,MAAA,iBAAiB,GAAG,CAAC,EAChC,QAAQ,EACR,MAAM,EACN,UAAU,EACV,MAAM,GAAG,CAAC,GACa,KAAI;IAC3B,MAAM,IAAI,GAAG,UAAU,KAAA,IAAA,IAAV,UAAU,KAAV,SAAA,GAAA,UAAU,GAAI,qBAAqB;IAChD,MAAM,QAAQ,GAAG,CAAC,OAAe,KAAK,UAAU,CAAC,CAAC,QAAQ,GAAG,OAAO,EAAE,OAAO,CAAC,MAAM,CAAC,CAAC;AACtF,IAAA,QAAQ,MAAM;QACZ,KAAK,YAAY,CAAC,EAAE;YAClB,OAAO,CAAA,EAAG,IAAI,CAAG,EAAA,QAAQ,CAAC,IAAI,CAAC,KAAK;QACtC,KAAK,YAAY,CAAC,EAAE;YAClB,OAAO,CAAA,EAAG,IAAI,CAAG,EAAA,QAAQ,CAAC,OAAO,CAAC,KAAK;AACzC,QAAA;YACE,OAAO,CAAA,EAAG,IAAI,CAAG,EAAA,QAAQ,CAAC,IAAI,CAAC,KAAK;AACvC;AACH;;;;"}

package/dist/components/UploadFile/utils/getValidTypesString/getValidTypesString.cjs

@@ -1,7 +1,5 @@
 'use strict';
 
-var constants = require('../../constants.cjs');
-
 /**
  * Constructs a user-friendly string of accepted types valid for the UploadFile component based on the
  * fileTypes list passed as parameter.
@@ -21,34 +19,22 @@ var constants = require('../../constants.cjs');
  * the returned string
  */
 const getValidTypesString = ({ fileTypes, baseString }) => {
-    let base = baseString == null ? 'Valid types: ' : baseString;
-    fileTypes.forEach((fileType, index, list) => {
-        const iterable = list.length > 1;
-        const isLast = index === list.length - 1 && iterable;
-        const isPenultimate = index === list.length - 2 && iterable;
-        if (isLast)
-            base += ' and ';
-        switch (fileType) {
-            case constants.AcceptedFileTypes.CSV:
-                base += 'CSV';
-                break;
-            case constants.AcceptedFileTypes.GIF:
-                base += 'GIF';
-                break;
-            case constants.AcceptedFileTypes.JPEG:
-                base += 'JPEG';
-                break;
-            case constants.AcceptedFileTypes.JPG:
-                base += 'JPG';
-                break;
-            case constants.AcceptedFileTypes.PNG:
-                base += 'PNG';
-                break;
-        }
-        if (!isPenultimate && !isLast && list.length > 2)
-            base += ', ';
-    });
-    return base;
+    // Remove leading dot and uppercase for display
+    const getDisplayType = (fileType) => fileType.replace(/^\./, '').toUpperCase();
+    if (!fileTypes.length)
+        return baseString !== null && baseString !== undefined ? baseString : '';
+    const displayTypes = fileTypes.map(getDisplayType);
+    let result = baseString == null ? 'Valid file types: ' : baseString;
+    if (displayTypes.length === 1) {
+        result += displayTypes[0];
+    }
+    else if (displayTypes.length === 2) {
+        result += `${displayTypes[0]} and ${displayTypes[1]}`;
+    }
+    else {
+        result += `${displayTypes.slice(0, -1).join(', ')} and ${displayTypes[displayTypes.length - 1]}`;
+    }
+    return result;
 };
 
 exports.getValidTypesString = getValidTypesString;

package/dist/components/UploadFile/utils/getValidTypesString/getValidTypesString.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"getValidTypesString.cjs","sources":["../../../../../src/components/UploadFile/utils/getValidTypesString/getValidTypesString.ts"],"sourcesContent":["import { AcceptedFileTypes } from '../../constants';\n\ntype GetValidTypesStringProps = {\n  fileTypes: Array<AcceptedFileTypes>;\n  baseString?: string;\n};\n\n/**\n * Constructs a user-friendly string of accepted types valid for the UploadFile component based on the\n * fileTypes list passed as parameter.\n *\n * E.g.\n *\n * const validTypesCopy = getValidTypesString({\n *  fileTypes: [\n *    AcceptedFileTypes.CSV,\n *  ]\n * });\n *\n * Where @constant validTypesCopy would equal \"Valid types: CSV\"\n *\n * @param fileTypes - A list of file types, each value being of @type AcceptedFileTypes\n * @param baseString - An optional string to override the default value of 'Valid types: ' prefixed to\n * the returned string\n */\nexport const getValidTypesString = ({ fileTypes, baseString }: GetValidTypesStringProps) => {\n  let base = baseString == null ? 'Valid types: ' : baseString;\n  fileTypes.forEach((fileType, index, list) => {\n    const iterable = list.length > 1;\n    const isLast = index === list.length - 1 && iterable;\n    const isPenultimate = index === list.length - 2 && iterable;\n\n    if (isLast) base += ' and ';\n\n    switch (fileType) {\n      case AcceptedFileTypes.CSV:\n        base += 'CSV';\n        break;\n      case AcceptedFileTypes.GIF:\n        base += 'GIF';\n        break;\n      case AcceptedFileTypes.JPEG:\n        base += 'JPEG';\n        break;\n      case AcceptedFileTypes.JPG:\n        base += 'JPG';\n        break;\n      case AcceptedFileTypes.PNG:\n        base += 'PNG';\n        break;\n      default:\n        break;\n    }\n\n    if (!isPenultimate && !isLast && list.length > 2) base += ', ';\n  });\n  return base;\n};\n"],"names":["AcceptedFileTypes"],"mappings":";;;;AAOA;;;;;;;;;;;;;;;;;AAiBG;AACU,MAAA,mBAAmB,GAAG,CAAC,EAAE,SAAS,EAAE,UAAU,EAA4B,KAAI;AACzF,IAAA,IAAI,IAAI,GAAG,UAAU,IAAI,IAAI,GAAG,eAAe,GAAG,UAAU;IAC5D,SAAS,CAAC,OAAO,CAAC,CAAC,QAAQ,EAAE,KAAK,EAAE,IAAI,KAAI;AAC1C,QAAA,MAAM,QAAQ,GAAG,IAAI,CAAC,MAAM,GAAG,CAAC;QAChC,MAAM,MAAM,GAAG,KAAK,KAAK,IAAI,CAAC,MAAM,GAAG,CAAC,IAAI,QAAQ;QACpD,MAAM,aAAa,GAAG,KAAK,KAAK,IAAI,CAAC,MAAM,GAAG,CAAC,IAAI,QAAQ;AAE3D,QAAA,IAAI,MAAM;YAAE,IAAI,IAAI,OAAO;AAE3B,QAAA,QAAQ,QAAQ;YACd,KAAKA,2BAAiB,CAAC,GAAG;gBACxB,IAAI,IAAI,KAAK;gBACb;YACF,KAAKA,2BAAiB,CAAC,GAAG;gBACxB,IAAI,IAAI,KAAK;gBACb;YACF,KAAKA,2BAAiB,CAAC,IAAI;gBACzB,IAAI,IAAI,MAAM;gBACd;YACF,KAAKA,2BAAiB,CAAC,GAAG;gBACxB,IAAI,IAAI,KAAK;gBACb;YACF,KAAKA,2BAAiB,CAAC,GAAG;gBACxB,IAAI,IAAI,KAAK;gBACb;AAGH;QAED,IAAI,CAAC,aAAa,IAAI,CAAC,MAAM,IAAI,IAAI,CAAC,MAAM,GAAG,CAAC;YAAE,IAAI,IAAI,IAAI;AAChE,KAAC,CAAC;AACF,IAAA,OAAO,IAAI;AACb;;;;"}
+{"version":3,"file":"getValidTypesString.cjs","sources":["../../../../../src/components/UploadFile/utils/getValidTypesString/getValidTypesString.ts"],"sourcesContent":["import { AcceptedFileTypes } from '../../constants';\n\ntype GetValidTypesStringProps = {\n  fileTypes: Array<AcceptedFileTypes>;\n  baseString?: string;\n};\n\n/**\n * Constructs a user-friendly string of accepted types valid for the UploadFile component based on the\n * fileTypes list passed as parameter.\n *\n * E.g.\n *\n * const validTypesCopy = getValidTypesString({\n *  fileTypes: [\n *    AcceptedFileTypes.CSV,\n *  ]\n * });\n *\n * Where @constant validTypesCopy would equal \"Valid types: CSV\"\n *\n * @param fileTypes - A list of file types, each value being of @type AcceptedFileTypes\n * @param baseString - An optional string to override the default value of 'Valid types: ' prefixed to\n * the returned string\n */\nexport const getValidTypesString = ({ fileTypes, baseString }: GetValidTypesStringProps) => {\n  // Remove leading dot and uppercase for display\n  const getDisplayType = (fileType: AcceptedFileTypes) => fileType.replace(/^\\./, '').toUpperCase();\n\n  if (!fileTypes.length) return baseString ?? '';\n\n  const displayTypes = fileTypes.map(getDisplayType);\n\n  let result = baseString == null ? 'Valid file types: ' : baseString;\n\n  if (displayTypes.length === 1) {\n    result += displayTypes[0];\n  } else if (displayTypes.length === 2) {\n    result += `${displayTypes[0]} and ${displayTypes[1]}`;\n  } else {\n    result += `${displayTypes.slice(0, -1).join(', ')} and ${displayTypes[displayTypes.length - 1]}`;\n  }\n\n  return result;\n};\n"],"names":[],"mappings":";;AAOA;;;;;;;;;;;;;;;;;AAiBG;AACU,MAAA,mBAAmB,GAAG,CAAC,EAAE,SAAS,EAAE,UAAU,EAA4B,KAAI;;AAEzF,IAAA,MAAM,cAAc,GAAG,CAAC,QAA2B,KAAK,QAAQ,CAAC,OAAO,CAAC,KAAK,EAAE,EAAE,CAAC,CAAC,WAAW,EAAE;IAEjG,IAAI,CAAC,SAAS,CAAC,MAAM;AAAE,QAAA,OAAO,UAAU,KAAV,IAAA,IAAA,UAAU,iBAAV,UAAU,GAAI,EAAE;IAE9C,MAAM,YAAY,GAAG,SAAS,CAAC,GAAG,CAAC,cAAc,CAAC;AAElD,IAAA,IAAI,MAAM,GAAG,UAAU,IAAI,IAAI,GAAG,oBAAoB,GAAG,UAAU;AAEnE,IAAA,IAAI,YAAY,CAAC,MAAM,KAAK,CAAC,EAAE;AAC7B,QAAA,MAAM,IAAI,YAAY,CAAC,CAAC,CAAC;AAC1B;AAAM,SAAA,IAAI,YAAY,CAAC,MAAM,KAAK,CAAC,EAAE;AACpC,QAAA,MAAM,IAAI,CAAA,EAAG,YAAY,CAAC,CAAC,CAAC,CAAQ,KAAA,EAAA,YAAY,CAAC,CAAC,CAAC,CAAA,CAAE;AACtD;AAAM,SAAA;QACL,MAAM,IAAI,CAAG,EAAA,YAAY,CAAC,KAAK,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,IAAI,CAAC,IAAI,CAAC,CAAQ,KAAA,EAAA,YAAY,CAAC,YAAY,CAAC,MAAM,GAAG,CAAC,CAAC,CAAA,CAAE;AACjG;AAED,IAAA,OAAO,MAAM;AACf;;;;"}

package/dist/components/UploadFile/utils/getValidTypesString/getValidTypesString.js

@@ -1,5 +1,3 @@
-import { AcceptedFileTypes } from '../../constants.js';
-
 /**
  * Constructs a user-friendly string of accepted types valid for the UploadFile component based on the
  * fileTypes list passed as parameter.
@@ -19,34 +17,22 @@ import { AcceptedFileTypes } from '../../constants.js';
  * the returned string
  */
 const getValidTypesString = ({ fileTypes, baseString }) => {
-    let base = baseString == null ? 'Valid types: ' : baseString;
-    fileTypes.forEach((fileType, index, list) => {
-        const iterable = list.length > 1;
-        const isLast = index === list.length - 1 && iterable;
-        const isPenultimate = index === list.length - 2 && iterable;
-        if (isLast)
-            base += ' and ';
-        switch (fileType) {
-            case AcceptedFileTypes.CSV:
-                base += 'CSV';
-                break;
-            case AcceptedFileTypes.GIF:
-                base += 'GIF';
-                break;
-            case AcceptedFileTypes.JPEG:
-                base += 'JPEG';
-                break;
-            case AcceptedFileTypes.JPG:
-                base += 'JPG';
-                break;
-            case AcceptedFileTypes.PNG:
-                base += 'PNG';
-                break;
-        }
-        if (!isPenultimate && !isLast && list.length > 2)
-            base += ', ';
-    });
-    return base;
+    // Remove leading dot and uppercase for display
+    const getDisplayType = (fileType) => fileType.replace(/^\./, '').toUpperCase();
+    if (!fileTypes.length)
+        return baseString !== null && baseString !== undefined ? baseString : '';
+    const displayTypes = fileTypes.map(getDisplayType);
+    let result = baseString == null ? 'Valid file types: ' : baseString;
+    if (displayTypes.length === 1) {
+        result += displayTypes[0];
+    }
+    else if (displayTypes.length === 2) {
+        result += `${displayTypes[0]} and ${displayTypes[1]}`;
+    }
+    else {
+        result += `${displayTypes.slice(0, -1).join(', ')} and ${displayTypes[displayTypes.length - 1]}`;
+    }
+    return result;
 };
 
 export { getValidTypesString };

package/dist/components/UploadFile/utils/getValidTypesString/getValidTypesString.js.map

@@ -1 +1 @@
-{"version":3,"file":"getValidTypesString.js","sources":["../../../../../src/components/UploadFile/utils/getValidTypesString/getValidTypesString.ts"],"sourcesContent":["import { AcceptedFileTypes } from '../../constants';\n\ntype GetValidTypesStringProps = {\n  fileTypes: Array<AcceptedFileTypes>;\n  baseString?: string;\n};\n\n/**\n * Constructs a user-friendly string of accepted types valid for the UploadFile component based on the\n * fileTypes list passed as parameter.\n *\n * E.g.\n *\n * const validTypesCopy = getValidTypesString({\n *  fileTypes: [\n *    AcceptedFileTypes.CSV,\n *  ]\n * });\n *\n * Where @constant validTypesCopy would equal \"Valid types: CSV\"\n *\n * @param fileTypes - A list of file types, each value being of @type AcceptedFileTypes\n * @param baseString - An optional string to override the default value of 'Valid types: ' prefixed to\n * the returned string\n */\nexport const getValidTypesString = ({ fileTypes, baseString }: GetValidTypesStringProps) => {\n  let base = baseString == null ? 'Valid types: ' : baseString;\n  fileTypes.forEach((fileType, index, list) => {\n    const iterable = list.length > 1;\n    const isLast = index === list.length - 1 && iterable;\n    const isPenultimate = index === list.length - 2 && iterable;\n\n    if (isLast) base += ' and ';\n\n    switch (fileType) {\n      case AcceptedFileTypes.CSV:\n        base += 'CSV';\n        break;\n      case AcceptedFileTypes.GIF:\n        base += 'GIF';\n        break;\n      case AcceptedFileTypes.JPEG:\n        base += 'JPEG';\n        break;\n      case AcceptedFileTypes.JPG:\n        base += 'JPG';\n        break;\n      case AcceptedFileTypes.PNG:\n        base += 'PNG';\n        break;\n      default:\n        break;\n    }\n\n    if (!isPenultimate && !isLast && list.length > 2) base += ', ';\n  });\n  return base;\n};\n"],"names":[],"mappings":";;AAOA;;;;;;;;;;;;;;;;;AAiBG;AACU,MAAA,mBAAmB,GAAG,CAAC,EAAE,SAAS,EAAE,UAAU,EAA4B,KAAI;AACzF,IAAA,IAAI,IAAI,GAAG,UAAU,IAAI,IAAI,GAAG,eAAe,GAAG,UAAU;IAC5D,SAAS,CAAC,OAAO,CAAC,CAAC,QAAQ,EAAE,KAAK,EAAE,IAAI,KAAI;AAC1C,QAAA,MAAM,QAAQ,GAAG,IAAI,CAAC,MAAM,GAAG,CAAC;QAChC,MAAM,MAAM,GAAG,KAAK,KAAK,IAAI,CAAC,MAAM,GAAG,CAAC,IAAI,QAAQ;QACpD,MAAM,aAAa,GAAG,KAAK,KAAK,IAAI,CAAC,MAAM,GAAG,CAAC,IAAI,QAAQ;AAE3D,QAAA,IAAI,MAAM;YAAE,IAAI,IAAI,OAAO;AAE3B,QAAA,QAAQ,QAAQ;YACd,KAAK,iBAAiB,CAAC,GAAG;gBACxB,IAAI,IAAI,KAAK;gBACb;YACF,KAAK,iBAAiB,CAAC,GAAG;gBACxB,IAAI,IAAI,KAAK;gBACb;YACF,KAAK,iBAAiB,CAAC,IAAI;gBACzB,IAAI,IAAI,MAAM;gBACd;YACF,KAAK,iBAAiB,CAAC,GAAG;gBACxB,IAAI,IAAI,KAAK;gBACb;YACF,KAAK,iBAAiB,CAAC,GAAG;gBACxB,IAAI,IAAI,KAAK;gBACb;AAGH;QAED,IAAI,CAAC,aAAa,IAAI,CAAC,MAAM,IAAI,IAAI,CAAC,MAAM,GAAG,CAAC;YAAE,IAAI,IAAI,IAAI;AAChE,KAAC,CAAC;AACF,IAAA,OAAO,IAAI;AACb;;;;"}
+{"version":3,"file":"getValidTypesString.js","sources":["../../../../../src/components/UploadFile/utils/getValidTypesString/getValidTypesString.ts"],"sourcesContent":["import { AcceptedFileTypes } from '../../constants';\n\ntype GetValidTypesStringProps = {\n  fileTypes: Array<AcceptedFileTypes>;\n  baseString?: string;\n};\n\n/**\n * Constructs a user-friendly string of accepted types valid for the UploadFile component based on the\n * fileTypes list passed as parameter.\n *\n * E.g.\n *\n * const validTypesCopy = getValidTypesString({\n *  fileTypes: [\n *    AcceptedFileTypes.CSV,\n *  ]\n * });\n *\n * Where @constant validTypesCopy would equal \"Valid types: CSV\"\n *\n * @param fileTypes - A list of file types, each value being of @type AcceptedFileTypes\n * @param baseString - An optional string to override the default value of 'Valid types: ' prefixed to\n * the returned string\n */\nexport const getValidTypesString = ({ fileTypes, baseString }: GetValidTypesStringProps) => {\n  // Remove leading dot and uppercase for display\n  const getDisplayType = (fileType: AcceptedFileTypes) => fileType.replace(/^\\./, '').toUpperCase();\n\n  if (!fileTypes.length) return baseString ?? '';\n\n  const displayTypes = fileTypes.map(getDisplayType);\n\n  let result = baseString == null ? 'Valid file types: ' : baseString;\n\n  if (displayTypes.length === 1) {\n    result += displayTypes[0];\n  } else if (displayTypes.length === 2) {\n    result += `${displayTypes[0]} and ${displayTypes[1]}`;\n  } else {\n    result += `${displayTypes.slice(0, -1).join(', ')} and ${displayTypes[displayTypes.length - 1]}`;\n  }\n\n  return result;\n};\n"],"names":[],"mappings":"AAOA;;;;;;;;;;;;;;;;;AAiBG;AACU,MAAA,mBAAmB,GAAG,CAAC,EAAE,SAAS,EAAE,UAAU,EAA4B,KAAI;;AAEzF,IAAA,MAAM,cAAc,GAAG,CAAC,QAA2B,KAAK,QAAQ,CAAC,OAAO,CAAC,KAAK,EAAE,EAAE,CAAC,CAAC,WAAW,EAAE;IAEjG,IAAI,CAAC,SAAS,CAAC,MAAM;AAAE,QAAA,OAAO,UAAU,KAAV,IAAA,IAAA,UAAU,iBAAV,UAAU,GAAI,EAAE;IAE9C,MAAM,YAAY,GAAG,SAAS,CAAC,GAAG,CAAC,cAAc,CAAC;AAElD,IAAA,IAAI,MAAM,GAAG,UAAU,IAAI,IAAI,GAAG,oBAAoB,GAAG,UAAU;AAEnE,IAAA,IAAI,YAAY,CAAC,MAAM,KAAK,CAAC,EAAE;AAC7B,QAAA,MAAM,IAAI,YAAY,CAAC,CAAC,CAAC;AAC1B;AAAM,SAAA,IAAI,YAAY,CAAC,MAAM,KAAK,CAAC,EAAE;AACpC,QAAA,MAAM,IAAI,CAAA,EAAG,YAAY,CAAC,CAAC,CAAC,CAAQ,KAAA,EAAA,YAAY,CAAC,CAAC,CAAC,CAAA,CAAE;AACtD;AAAM,SAAA;QACL,MAAM,IAAI,CAAG,EAAA,YAAY,CAAC,KAAK,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,IAAI,CAAC,IAAI,CAAC,CAAQ,KAAA,EAAA,YAAY,CAAC,YAAY,CAAC,MAAM,GAAG,CAAC,CAAC,CAAA,CAAE;AACjG;AAED,IAAA,OAAO,MAAM;AACf;;;;"}

package/dist/components/UploadFile/utils/index.d.ts

@@ -1,4 +1,3 @@
 export { getValidTypesString } from './getValidTypesString/getValidTypesString';
 export { getFileSizeString } from './getFileSizeString/getFileSizeString';
 export { getTypePropForInputEl } from './getTypePropForInputEl/getTypePropForInputEl';
-export { setInputElFile } from './setInputElFile/setInputElFile';

package/dist/components/UploadFile/utils/isImageType/index.d.ts

@@ -0,0 +1 @@
+export { isImageType } from './isImageType';

package/dist/components/UploadFile/utils/isImageType/isImageType.cjs

@@ -0,0 +1,14 @@
+'use strict';
+
+const isImageType = (file) => {
+    if (!file)
+        return false;
+    const fileType = file.type.split('/');
+    if (fileType[0] === 'image') {
+        return true;
+    }
+    return false;
+};
+
+exports.isImageType = isImageType;
+//# sourceMappingURL=isImageType.cjs.map

package/dist/components/UploadFile/utils/isImageType/isImageType.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"isImageType.cjs","sources":["../../../../../src/components/UploadFile/utils/isImageType/isImageType.ts"],"sourcesContent":["export const isImageType = (file?: File | null) => {\n  if (!file) return false;\n\n  const fileType = file.type.split('/');\n\n  if (fileType[0] === 'image') {\n    return true;\n  }\n\n  return false;\n};\n"],"names":[],"mappings":";;AAAa,MAAA,WAAW,GAAG,CAAC,IAAkB,KAAI;AAChD,IAAA,IAAI,CAAC,IAAI;AAAE,QAAA,OAAO,KAAK;IAEvB,MAAM,QAAQ,GAAG,IAAI,CAAC,IAAI,CAAC,KAAK,CAAC,GAAG,CAAC;AAErC,IAAA,IAAI,QAAQ,CAAC,CAAC,CAAC,KAAK,OAAO,EAAE;AAC3B,QAAA,OAAO,IAAI;AACZ;AAED,IAAA,OAAO,KAAK;AACd;;;;"}

package/dist/components/UploadFile/utils/isImageType/isImageType.d.ts

@@ -0,0 +1 @@
+export declare const isImageType: (file?: File | null) => boolean;