@aquera/nile-elements 0.1.63-beta-1.2 → 0.1.64-beta-1.0

package/dist/nile-file-preview/nile-file-preview.template.esm.js

@@ -1,4 +1,4 @@
-import"./nile-file-preview.css.esm.js";import{html as i}from"lit";import{c as e,g as n,f as l,r as c,t as o}from"./utils/nile-file-preview.util.esm.js";import"./types/nile-file-preview.enums.esm.js";function a(n,l){return i`
+import"./nile-file-preview.css.esm.js";import{html as i}from"lit";import{c as e,g as n,f as l,r as c,t as a}from"./utils/nile-file-preview.util.esm.js";import"./types/nile-file-preview.enums.esm.js";function o(n,l){return i`
       <div class="uploading" part="horizontal-uploading-state">
         <nile-loader width="24" height="24"></nile-loader>
         <div class="progress-bar-container">
@@ -20,23 +20,23 @@ import"./nile-file-preview.css.esm.js";import{html as i}from"lit";import{c as e,
           ></nile-icon>
         </slot>
       </div>
-    `}function s(e,o,a){return i`
+    `}function s(e,a,o){return i`
     <div class="preview horizontal-div" part="horizontal-preview-state">
       <div class="preview-inner">
         <div class="preview-image-container">
             <img
               class="image-preview"
               src=${e}
-              alt=${o.name}
+              alt=${a.name}
             />
         </div>
         <div class="preview-file-info">
-          <p>${o.name}</p>
-          <p>${n(o.type)} &#8226; ${l(Number(o.size))}</p>
+          <p>${a.name}</p>
+          <p>${n(a.type)} &#8226; ${l(Number(a.size))}</p>
         </div>
       </div>
       <div class="preview-actions">
-        <slot @click=${i=>c(o,i,a)} name="cancelIcon">
+        <slot @click=${i=>c(a,i,o)} name="cancelIcon">
           <nile-icon
             name="trash"
             size="14"
@@ -52,7 +52,7 @@ import"./nile-file-preview.css.esm.js";import{html as i}from"lit";import{c as e,
           <nile-icon name="general" size="20" color="var(--nile-colors-blue-500)"></nile-icon>
         </div>
         <div class="preview-file-info">
-          <p>${o(e.name,e?.type)}</p>
+          <p>${e.name}</p>
           <p>${n(e.type)} &#8226; ${l(Number(e.size))}</p>
         </div>
       </div>
@@ -66,7 +66,7 @@ import"./nile-file-preview.css.esm.js";import{html as i}from"lit";import{c as e,
         </slot>
       </div>
     </div>
-  `}function t(e,n,l){return i`
+  `}function t(e,n,l,o){return a(o),i`
     <div class="error horizontal-div" part="horizontal-error-state">
       <div class="error-container">
         <div class="error-icon">
@@ -74,9 +74,9 @@ import"./nile-file-preview.css.esm.js";import{html as i}from"lit";import{c as e,
         </div>
         <div class="file-info">
           <p class="horizontal-file-name">${e.name}</p>
-          <nile-tooltip content=${n}>
-            <span>${n}</span>
-          </nile-tooltip>
+          ${o.isStringTruncated?i`<nile-tooltip content=${n}>
+                  <span>${n}</span>
+                </nile-tooltip>`:i`<span>${n}</span>`}
         </div>
       </div>
       <slot @click=${i=>c(e,i,l)} name="cancelIcon">
@@ -110,22 +110,22 @@ import"./nile-file-preview.css.esm.js";import{html as i}from"lit";import{c as e,
         ></nile-icon>
       </slot>
     </div>
-  `}function p(e,o,a){return i`
+  `}function p(e,a,o){return i`
     <div class="vertical-div vertical-preview" part="vertical-preview-state">
       <div>
         <img
           class="image-preview"
           src=${e}
-          alt=${o.name}
+          alt=${a.name}
         />
       </div>
 
       <div class="content-container">
-        <p>${o.name}</p>
-         <p>${n(o.type)} &#8226; ${l(Number(o.size))}</p>
+        <p>${a.name}</p>
+         <p>${n(a.type)} &#8226; ${l(Number(a.size))}</p>
       </div>
 
-      <slot @click=${i=>c(o,i,a)} name="cancelIcon">
+      <slot @click=${i=>c(a,i,o)} name="cancelIcon">
         <nile-icon
           name="trash"
           size="14"
@@ -140,7 +140,7 @@ import"./nile-file-preview.css.esm.js";import{html as i}from"lit";import{c as e,
       </div>
 
       <div class="content-container">
-        <p>${o(e.name,e?.type)}</p>
+        <p>${e.name}</p>
         <p>${n(e.type)} &#8226; ${l(Number(e.size))}</p>
       </div>
 
@@ -152,7 +152,7 @@ import"./nile-file-preview.css.esm.js";import{html as i}from"lit";import{c as e,
         ></nile-icon>
       </slot>
     </div>
-  `}function m(e,n,l){return i`
+  `}function m(e,n,l,o){return a(o),i`
     <div class="vertical-div vertical-error" part="vertical-error-state">
       <div class="vertical-document-icon error-bg">
         <nile-icon name="info-icon" size="20" color="var(--nile-colors-red-700)"></nile-icon>
@@ -160,9 +160,9 @@ import"./nile-file-preview.css.esm.js";import{html as i}from"lit";import{c as e,
 
       <div class="file-info-vertical-state">
         <p class="vertical-file-name">${e.name}</p>
-        <nile-tooltip content=${n}>
-          <span>${n}</span>
-        </nile-tooltip>
+        ${o.isStringTruncated?i`<nile-tooltip content=${n}>
+                <span>${n}</span>
+              </nile-tooltip>`:i`<span>${n}</span>`}
       </div>
 
       <slot @click=${i=>c(e,i,l)} name="cancelIcon">
@@ -173,4 +173,4 @@ import"./nile-file-preview.css.esm.js";import{html as i}from"lit";import{c as e,
         ></nile-icon>
       </slot>
     </div>
-  `}export{v as a,t as b,m as c,s as d,p as e,r as f,a as g,d as h};
+  `}export{v as a,t as b,m as c,s as d,p as e,r as f,o as g,d as h};

package/dist/nile-file-preview/utils/index.cjs.js

@@ -1,2 +1,2 @@
-System.register(["./nile-file-preview.util.cjs.js","../types/nile-file-preview.enums.cjs.js"],function(_export,_context){"use strict";return{setters:[function(_nileFilePreviewUtilCjsJs){_export({cancelFileUpload:_nileFilePreviewUtilCjsJs.c,fileUploadServerError:_nileFilePreviewUtilCjsJs.a,formatFileSize:_nileFilePreviewUtilCjsJs.f,generatePreviewUrl:_nileFilePreviewUtilCjsJs.b,getFileType:_nileFilePreviewUtilCjsJs.g,removeFile:_nileFilePreviewUtilCjsJs.r,truncateString:_nileFilePreviewUtilCjsJs.t});},function(_typesNileFilePreviewEnumsCjsJs){}],execute:function execute(){}};});
+System.register(["./nile-file-preview.util.cjs.js","../types/nile-file-preview.enums.cjs.js"],function(_export,_context){"use strict";return{setters:[function(_nileFilePreviewUtilCjsJs){_export({cancelFileUpload:_nileFilePreviewUtilCjsJs.c,formatFileSize:_nileFilePreviewUtilCjsJs.f,generatePreviewUrl:_nileFilePreviewUtilCjsJs.a,getFileType:_nileFilePreviewUtilCjsJs.g,removeFile:_nileFilePreviewUtilCjsJs.r,truncateString:_nileFilePreviewUtilCjsJs.t});},function(_typesNileFilePreviewEnumsCjsJs){}],execute:function execute(){}};});
 //# sourceMappingURL=index.cjs.js.map

package/dist/nile-file-preview/utils/index.esm.js

@@ -1 +1 @@
-export{c as cancelFileUpload,a as fileUploadServerError,f as formatFileSize,b as generatePreviewUrl,g as getFileType,r as removeFile,t as truncateString}from"./nile-file-preview.util.esm.js";import"../types/nile-file-preview.enums.esm.js";
+export{c as cancelFileUpload,f as formatFileSize,a as generatePreviewUrl,g as getFileType,r as removeFile,t as truncateString}from"./nile-file-preview.util.esm.js";import"../types/nile-file-preview.enums.esm.js";

package/dist/nile-file-preview/utils/nile-file-preview.util.cjs.js

@@ -1,2 +1,2 @@
-System.register(["../types/nile-file-preview.enums.cjs.js"],function(_export,_context){"use strict";var e,s,o,n,t,r,a,i,l;return{setters:[function(_typesNileFilePreviewEnumsCjsJs){e=_typesNileFilePreviewEnumsCjsJs.c;s=_typesNileFilePreviewEnumsCjsJs.b;}],execute:function execute(){_export("b",o=function o(s){return new Promise(function(o,n){var t=new FileReader();s?t.readAsDataURL(s):n(e.NO_FILE_SELECTED),t.onload=function(){var e=t.result;o(e);},t.onerror=function(s){n(e.UNABLE_TO_GENEARTE_URL);};});}),_export("r",n=function n(e,o,_n){o.target&&o.target.dispatchEvent(new CustomEvent(s.NILE_REMOVE,{detail:{value:e,url:_n},bubbles:!0,composed:!0}));}),_export("c",t=function t(e,o){o.target&&o.target.dispatchEvent(new CustomEvent(s.NILE_CANCEL_UPLOAD,{detail:{file:e},bubbles:!0,composed:!0}));}),_export("f",r=function r(e){var s=e/1024,o=s/1024,n=o/1024;return n>=1?n.toFixed(2)+" GB":o>=1?o.toFixed(2)+" MB":s>=1?s.toFixed(2)+" KB":e+" B";}),_export("g",a=function a(e){return e.split("/")[1].toUpperCase();}),_export("t",i=function i(e,s){return e.length>20?e.slice(0,10)+"..."+e.slice(e.length-5,e.length-1)+"."+s.split("/")[1]:e;}),_export("a",l=function l(s){document.addEventListener("nile-network-error",function(o){console.log("working file preview"),s.errorMessage=e.NETWORK_ERROR,s.requestUpdate();});});}};});
+System.register(["../types/nile-file-preview.enums.cjs.js"],function(_export,_context){"use strict";var e,s,t,o,a,n,l,r;return{setters:[function(_typesNileFilePreviewEnumsCjsJs){e=_typesNileFilePreviewEnumsCjsJs.c;s=_typesNileFilePreviewEnumsCjsJs.b;}],execute:function execute(){_export("a",t=function t(s){return new Promise(function(t,o){var a=new FileReader();s?a.readAsDataURL(s):o(e.NO_FILE_SELECTED),a.onload=function(){var e=a.result;t(e);},a.onerror=function(s){o(e.UNABLE_TO_GENEARTE_URL);};});}),_export("r",o=function o(e,t,_o){t.target&&t.target.dispatchEvent(new CustomEvent(s.NILE_REMOVE,{detail:{value:e,url:_o},bubbles:!0,composed:!0}));}),_export("c",a=function a(e,t){t.target&&t.target.dispatchEvent(new CustomEvent(s.NILE_CANCEL_UPLOAD,{detail:{file:e},bubbles:!0,composed:!0}));}),_export("f",n=function n(e){var s=e/1024,t=s/1024,o=t/1024;return o>=1?o.toFixed(2)+" GB":t>=1?t.toFixed(2)+" MB":s>=1?s.toFixed(2)+" KB":e+" B";}),_export("g",l=function l(e){return e.split("/")[1].toUpperCase();}),_export("t",r=function r(e){("vertical"===e.variant&&e.errorMessage.length>34||"horizontal"===e.variant&&e.errorMessage.length>96)&&(e.isStringTruncated=!0,e.requestUpdate());});}};});
 //# sourceMappingURL=nile-file-preview.util.cjs.js.map

package/dist/nile-file-preview/utils/nile-file-preview.util.cjs.js.map

@@ -1 +1 @@
-{"version":3,"file":"nile-file-preview.util.cjs.js","sources":["../../../../src/nile-file-preview/utils/nile-file-preview.util.ts"],"sourcesContent":["import NileFilePreview from \"../nile-file-preview\";\nimport { RemoveFileDetail, FilePreviewEvent, FilePreviewErrorMessages } from \"../types\";\n\nexport const generatePreviewUrl = (file: File): Promise<string> => {\n  return new Promise((resolve, reject) => {\n    const reader = new FileReader();\n\n    if (file) {\n      reader.readAsDataURL(file);\n    } else {\n      reject(FilePreviewErrorMessages.NO_FILE_SELECTED);\n    }\n\n    reader.onload = () => {\n      const previewUrl = reader.result as string;\n      resolve(previewUrl);\n    };\n\n    reader.onerror = (error) => {\n      reject(FilePreviewErrorMessages.UNABLE_TO_GENEARTE_URL);\n    }\n  });\n}\n\nexport const removeFile = (removeFile: File, e: CustomEvent<RemoveFileDetail>, originalUrl: string): void => {\n  if (e.target) {\n    e.target.dispatchEvent(\n      new CustomEvent(FilePreviewEvent.NILE_REMOVE, {\n        detail: { value: removeFile, url: originalUrl },\n        bubbles: true,\n        composed: true,\n      })\n    );\n  }\n};\n\nexport const cancelFileUpload = (file: File, e: CustomEvent<RemoveFileDetail>) => {\n  if(e.target) {\n    e.target.dispatchEvent(\n      new CustomEvent(FilePreviewEvent.NILE_CANCEL_UPLOAD, {\n        detail: { file: file },\n        bubbles: true,\n        composed: true,\n      })\n    );\n  }\n}\n\nexport const formatFileSize = (bytes: number): string => {\n  const kb = bytes / 1024;\n  const mb = kb / 1024;\n  const gb = mb / 1024;\n\n  if (gb >= 1) return gb.toFixed(2) + ' GB';\n  if (mb >= 1) return mb.toFixed(2) + ' MB';\n  if (kb >= 1) return kb.toFixed(2) + ' KB';\n  return bytes + ' B';\n}\n\nexport const getFileType = (type: string): string => {\n  return type.split('/')[1].toUpperCase();\n}\n\nexport const truncateString = (str: string, type: string): string => {\n  return str.length > 20 ? (str.slice(0, 10) + '...' +  str.slice(str.length - 5, str.length - 1) + '.' + type.split('/')[1]) : str;\n}\n\nexport const fileUploadServerError = (nileFilePreview: NileFilePreview) => {\n  document.addEventListener('nile-network-error', (e: any) => {\n    console.log('working file preview');\n    \n    nileFilePreview.errorMessage = FilePreviewErrorMessages.NETWORK_ERROR;\n    nileFilePreview.requestUpdate();\n  });\n}"],"names":["generatePreviewUrl","file","Promise","resolve","reject","reader","FileReader","readAsDataURL","FilePreviewErrorMessages","NO_FILE_SELECTED","onload","previewUrl","result","onerror","error","UNABLE_TO_GENEARTE_URL","removeFile","e","originalUrl","target","dispatchEvent","CustomEvent","FilePreviewEvent","NILE_REMOVE","detail","value","url","bubbles","composed","_export","cancelFileUpload","t","NILE_CANCEL_UPLOAD","formatFileSize","bytes","kb","mb","gb","toFixed","getFileType","type","split","toUpperCase","truncateString","str","length","slice","fileUploadServerError","nileFilePreview","document","addEventListener","console","log","errorMessage","NETWORK_ERROR","requestUpdate"],"mappings":"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"}
+{"version":3,"file":"nile-file-preview.util.cjs.js","sources":["../../../../src/nile-file-preview/utils/nile-file-preview.util.ts"],"sourcesContent":["import NileFilePreview from \"../nile-file-preview\";\nimport { RemoveFileDetail, FilePreviewEvent, FilePreviewErrorMessages } from \"../types\";\n\nexport const generatePreviewUrl = (file: File): Promise<string> => {\n  return new Promise((resolve, reject) => {\n    const reader = new FileReader();\n\n    if (file) {\n      reader.readAsDataURL(file);\n    } else {\n      reject(FilePreviewErrorMessages.NO_FILE_SELECTED);\n    }\n\n    reader.onload = () => {\n      const previewUrl = reader.result as string;\n      resolve(previewUrl);\n    };\n\n    reader.onerror = (error) => {\n      reject(FilePreviewErrorMessages.UNABLE_TO_GENEARTE_URL);\n    }\n  });\n}\n\nexport const removeFile = (removeFile: File, e: CustomEvent<RemoveFileDetail>, originalUrl: string): void => {\n  if (e.target) {\n    e.target.dispatchEvent(\n      new CustomEvent(FilePreviewEvent.NILE_REMOVE, {\n        detail: { value: removeFile, url: originalUrl },\n        bubbles: true,\n        composed: true,\n      })\n    );\n  }\n};\n\nexport const cancelFileUpload = (file: File, e: CustomEvent<RemoveFileDetail>) => {\n  if(e.target) {\n    e.target.dispatchEvent(\n      new CustomEvent(FilePreviewEvent.NILE_CANCEL_UPLOAD, {\n        detail: { file: file },\n        bubbles: true,\n        composed: true,\n      })\n    );\n  }\n}\n\nexport const formatFileSize = (bytes: number): string => {\n  const kb = bytes / 1024;\n  const mb = kb / 1024;\n  const gb = mb / 1024;\n\n  if (gb >= 1) return gb.toFixed(2) + ' GB';\n  if (mb >= 1) return mb.toFixed(2) + ' MB';\n  if (kb >= 1) return kb.toFixed(2) + ' KB';\n  return bytes + ' B';\n}\n\nexport const getFileType = (type: string): string => {\n  return type.split('/')[1].toUpperCase();\n}\n\nexport const truncateString = (nileFilePreview: NileFilePreview): void => {\n  if(nileFilePreview.variant === 'vertical' && nileFilePreview.errorMessage.length > 34) {\n    nileFilePreview.isStringTruncated = true;\n    nileFilePreview.requestUpdate();\n  } else if(nileFilePreview.variant === 'horizontal' && nileFilePreview.errorMessage.length > 96) {\n    nileFilePreview.isStringTruncated = true;\n    nileFilePreview.requestUpdate();\n  }\n}"],"names":["generatePreviewUrl","file","Promise","resolve","reject","reader","FileReader","readAsDataURL","FilePreviewErrorMessages","NO_FILE_SELECTED","onload","previewUrl","result","onerror","error","UNABLE_TO_GENEARTE_URL","_export","removeFile","e","originalUrl","target","dispatchEvent","CustomEvent","FilePreviewEvent","NILE_REMOVE","detail","value","url","bubbles","composed","cancelFileUpload","a","NILE_CANCEL_UPLOAD","formatFileSize","bytes","kb","mb","gb","toFixed","getFileType","type","split","toUpperCase","truncateString","nileFilePreview","variant","errorMessage","length","isStringTruncated","requestUpdate"],"mappings":"oSAGaA,CAAAA,CAAsBC,QAAtBD,CAAAA,CAAAA,CAAsBC,SAC1B,IAAIC,CAAAA,OAAAA,CAAQ,SAACC,CAAAA,CAASC,GAC3B,GAAMC,CAAAA,CAAAA,CAAS,GAAIC,CAAAA,UAAAA,CAAAA,CAAAA,CAEfL,EACFI,CAAOE,CAAAA,aAAAA,CAAcN,CAErBG,CAAAA,CAAAA,CAAAA,CAAOI,EAAyBC,gBAGlCJ,CAAAA,CAAAA,CAAAA,CAAOK,MAAS,CAAA,UAAA,CACd,GAAMC,CAAAA,CAAaN,CAAAA,CAAAA,CAAOO,MAC1BT,CAAAA,CAAAA,CAAQQ,EAAW,EAGrBN,CAAAA,CAAAA,CAAOQ,OAAWC,CAAAA,SAAAA,CAAAA,CAAAA,CAChBV,EAAOI,CAAyBO,CAAAA,sBAAAA,CAAuB,EACxD,EAAA,CAAA,IAAAC,OAAA,KAIQC,EAAa,QAAbA,CAAAA,EAAcA,CAAAA,CAAkBC,CAAkCC,CAAAA,EAAAA,CAAAA,CACzED,EAAEE,MACJF,EAAAA,CAAAA,CAAEE,MAAOC,CAAAA,aAAAA,CACP,GAAIC,CAAAA,WAAYC,CAAAA,CAAAA,CAAiBC,WAAa,CAAA,CAC5CC,OAAQ,CAAEC,KAAAA,CAAOT,CAAYU,CAAAA,GAAAA,CAAKR,IAClCS,OAAS,CAAA,CAAA,CAAA,CACTC,QAAU,CAAA,CAAA,CAAA,CAAA,CAAA,CAGf,gBAGUC,CAAmB,CAAA,QAAnBA,CAAAA,CAAmBC,CAAC9B,CAAYiB,CAAAA,CAAAA,CAAAA,CACxCA,EAAEE,MACHF,EAAAA,CAAAA,CAAEE,MAAOC,CAAAA,aAAAA,CACP,GAAIC,CAAAA,WAAYC,CAAAA,CAAAA,CAAiBS,kBAAoB,CAAA,CACnDP,OAAQ,CAAExB,IAAAA,CAAMA,CAChB2B,CAAAA,CAAAA,OAAAA,CAAAA,CAAS,EACTC,QAAU,CAAA,CAAA,CAAA,CAAA,CAAA,CAGf,EAGUI,EAAAA,OAAAA,KAAAA,CAAAA,CAAkBC,QAAlBD,CAAAA,CAAAA,CAAkBC,GAC7B,GAAMC,CAAAA,CAAAA,CAAKD,CAAQ,CAAA,IAAA,CACbE,EAAKD,CAAK,CAAA,IAAA,CACVE,CAAKD,CAAAA,CAAAA,CAAK,KAEhB,MAAIC,CAAAA,CAAAA,EAAM,CAAUA,CAAAA,CAAAA,CAAGC,QAAQ,CAAK,CAAA,CAAA,KAAA,CAChCF,CAAM,EAAA,CAAA,CAAUA,EAAGE,OAAQ,CAAA,CAAA,CAAA,CAAK,KAChCH,CAAAA,CAAAA,EAAM,EAAUA,CAAGG,CAAAA,OAAAA,CAAQ,CAAK,CAAA,CAAA,KAAA,CAC7BJ,EAAQ,IAAI,EAAA,EAAAlB,OAAA,KAGRuB,CAAeC,CAAAA,QAAfD,CAAAA,CAAeC,CAAAA,CAAAA,QACnBA,CAAAA,EAAKC,KAAM,CAAA,GAAA,CAAA,CAAK,CAAGC,CAAAA,CAAAA,WAAAA,CAAAA,CAAAA,IAAAA,OAAAA,KAGfC,EAAkBC,QAAlBD,CAAAA,EAAkBC,CACE,CAAA,CAAA,CAAA,UAAA,GAA5BA,CAAgBC,CAAAA,OAAAA,EAA0BD,EAAgBE,YAAaC,CAAAA,MAAAA,CAAS,EAG7C,EAAA,YAAA,GAA5BH,EAAgBC,OAA4BD,EAAAA,CAAAA,CAAgBE,YAAaC,CAAAA,MAAAA,CAAS,MAF1FH,CAAgBI,CAAAA,iBAAAA,CAAAA,CAAoB,CACpCJ,CAAAA,CAAAA,CAAgBK,gBAIjB"}

package/dist/nile-file-preview/utils/nile-file-preview.util.esm.js

@@ -1 +1 @@
-import{c as e,b as s}from"../types/nile-file-preview.enums.esm.js";const o=s=>new Promise(((o,n)=>{const t=new FileReader;s?t.readAsDataURL(s):n(e.NO_FILE_SELECTED),t.onload=()=>{const e=t.result;o(e)},t.onerror=s=>{n(e.UNABLE_TO_GENEARTE_URL)}})),n=(e,o,n)=>{o.target&&o.target.dispatchEvent(new CustomEvent(s.NILE_REMOVE,{detail:{value:e,url:n},bubbles:!0,composed:!0}))},t=(e,o)=>{o.target&&o.target.dispatchEvent(new CustomEvent(s.NILE_CANCEL_UPLOAD,{detail:{file:e},bubbles:!0,composed:!0}))},r=e=>{const s=e/1024,o=s/1024,n=o/1024;return n>=1?n.toFixed(2)+" GB":o>=1?o.toFixed(2)+" MB":s>=1?s.toFixed(2)+" KB":e+" B"},a=e=>e.split("/")[1].toUpperCase(),i=(e,s)=>e.length>20?e.slice(0,10)+"..."+e.slice(e.length-5,e.length-1)+"."+s.split("/")[1]:e,l=s=>{document.addEventListener("nile-network-error",(o=>{console.log("working file preview"),s.errorMessage=e.NETWORK_ERROR,s.requestUpdate()}))};export{l as a,o as b,t as c,r as f,a as g,n as r,i as t};
+import{c as e,b as s}from"../types/nile-file-preview.enums.esm.js";const t=s=>new Promise(((t,o)=>{const a=new FileReader;s?a.readAsDataURL(s):o(e.NO_FILE_SELECTED),a.onload=()=>{const e=a.result;t(e)},a.onerror=s=>{o(e.UNABLE_TO_GENEARTE_URL)}})),o=(e,t,o)=>{t.target&&t.target.dispatchEvent(new CustomEvent(s.NILE_REMOVE,{detail:{value:e,url:o},bubbles:!0,composed:!0}))},a=(e,t)=>{t.target&&t.target.dispatchEvent(new CustomEvent(s.NILE_CANCEL_UPLOAD,{detail:{file:e},bubbles:!0,composed:!0}))},n=e=>{const s=e/1024,t=s/1024,o=t/1024;return o>=1?o.toFixed(2)+" GB":t>=1?t.toFixed(2)+" MB":s>=1?s.toFixed(2)+" KB":e+" B"},l=e=>e.split("/")[1].toUpperCase(),r=e=>{("vertical"===e.variant&&e.errorMessage.length>34||"horizontal"===e.variant&&e.errorMessage.length>96)&&(e.isStringTruncated=!0,e.requestUpdate())};export{t as a,a as c,n as f,l as g,o as r,r as t};

package/dist/nile-file-upload/nile-file-upload.cjs.js

@@ -1,2 +1,2 @@
-function _typeof(o){"@babel/helpers - typeof";return _typeof="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(o){return typeof o;}:function(o){return o&&"function"==typeof Symbol&&o.constructor===Symbol&&o!==Symbol.prototype?"symbol":typeof o;},_typeof(o);}System.register(["tslib","./nile-file-upload.css.cjs.js","../internal/nile-element.cjs.js","./utils/drag-drop.util.cjs.js","./nile-file-upload.template.cjs.js","./types/file-upload.enums.cjs.js","lit","lit/decorators.js","./utils/file-validation.util.cjs.js","../lit-html-9b3af046.cjs.js"],function(_export,_context){"use strict";var t,s,i,e,h,r,a,o,l,p,n,d,u,c,m,f,y,v,j,g,S,b,_templateObject,w;function _taggedTemplateLiteral(e,t){return t||(t=e.slice(0)),Object.freeze(Object.defineProperties(e,{raw:{value:Object.freeze(t)}}));}function _classCallCheck(a,n){if(!(a instanceof n))throw new TypeError("Cannot call a class as a function");}function _defineProperties(e,r){for(var t=0;t<r.length;t++){var o=r[t];o.enumerable=o.enumerable||!1,o.configurable=!0,"value"in o&&(o.writable=!0),Object.defineProperty(e,_toPropertyKey(o.key),o);}}function _createClass(e,r,t){return r&&_defineProperties(e.prototype,r),t&&_defineProperties(e,t),Object.defineProperty(e,"prototype",{writable:!1}),e;}function _toPropertyKey(t){var i=_toPrimitive(t,"string");return"symbol"==_typeof(i)?i:i+"";}function _toPrimitive(t,r){if("object"!=_typeof(t)||!t)return t;var e=t[Symbol.toPrimitive];if(void 0!==e){var i=e.call(t,r||"default");if("object"!=_typeof(i))return i;throw new TypeError("@@toPrimitive must return a primitive value.");}return("string"===r?String:Number)(t);}function _callSuper(t,o,e){return o=_getPrototypeOf(o),_possibleConstructorReturn(t,_isNativeReflectConstruct()?Reflect.construct(o,e||[],_getPrototypeOf(t).constructor):o.apply(t,e));}function _possibleConstructorReturn(t,e){if(e&&("object"==_typeof(e)||"function"==typeof e))return e;if(void 0!==e)throw new TypeError("Derived constructors may only return object or undefined");return _assertThisInitialized(t);}function _assertThisInitialized(e){if(void 0===e)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return e;}function _isNativeReflectConstruct(){try{var t=!Boolean.prototype.valueOf.call(Reflect.construct(Boolean,[],function(){}));}catch(t){}return(_isNativeReflectConstruct=function _isNativeReflectConstruct(){return!!t;})();}function _superPropGet(t,o,e,r){var p=_get(_getPrototypeOf(1&r?t.prototype:t),o,e);return 2&r&&"function"==typeof p?function(t){return p.apply(e,t);}:p;}function _get(){return _get="undefined"!=typeof Reflect&&Reflect.get?Reflect.get.bind():function(e,t,r){var p=_superPropBase(e,t);if(p){var n=Object.getOwnPropertyDescriptor(p,t);return n.get?n.get.call(arguments.length<3?e:r):n.value;}},_get.apply(null,arguments);}function _superPropBase(t,o){for(;!{}.hasOwnProperty.call(t,o)&&null!==(t=_getPrototypeOf(t)););return t;}function _getPrototypeOf(t){return _getPrototypeOf=Object.setPrototypeOf?Object.getPrototypeOf.bind():function(t){return t.__proto__||Object.getPrototypeOf(t);},_getPrototypeOf(t);}function _inherits(t,e){if("function"!=typeof e&&null!==e)throw new TypeError("Super expression must either be null or a function");t.prototype=Object.create(e&&e.prototype,{constructor:{value:t,writable:!0,configurable:!0}}),Object.defineProperty(t,"prototype",{writable:!1}),e&&_setPrototypeOf(t,e);}function _setPrototypeOf(t,e){return _setPrototypeOf=Object.setPrototypeOf?Object.setPrototypeOf.bind():function(t,e){return t.__proto__=e,t;},_setPrototypeOf(t,e);}return{setters:[function(_tslib){t=_tslib.__decorate;},function(_nileFileUploadCssCjsJs){s=_nileFileUploadCssCjsJs.s;},function(_internalNileElementCjsJs){i=_internalNileElementCjsJs.N;},function(_utilsDragDropUtilCjsJs){e=_utilsDragDropUtilCjsJs.D;},function(_nileFileUploadTemplateCjsJs){h=_nileFileUploadTemplateCjsJs.g;r=_nileFileUploadTemplateCjsJs.a;a=_nileFileUploadTemplateCjsJs.b;o=_nileFileUploadTemplateCjsJs.c;l=_nileFileUploadTemplateCjsJs.d;p=_nileFileUploadTemplateCjsJs.e;},function(_typesFileUploadEnumsCjsJs){n=_typesFileUploadEnumsCjsJs.c;d=_typesFileUploadEnumsCjsJs.F;u=_typesFileUploadEnumsCjsJs.d;c=_typesFileUploadEnumsCjsJs.b;},function(_lit){m=_lit.html;},function(_litDecoratorsJs){f=_litDecoratorsJs.property;y=_litDecoratorsJs.query;v=_litDecoratorsJs.customElement;},function(_utilsFileValidationUtilCjsJs){j=_utilsFileValidationUtilCjsJs.s;g=_utilsFileValidationUtilCjsJs.a;S=_utilsFileValidationUtilCjsJs.b;b=_utilsFileValidationUtilCjsJs.u;},function(_litHtml001CjsJs){}],execute:function execute(){_export("N",w=/*#__PURE__*/function(_i){function w(){var _this;_classCallCheck(this,w);_this=_callSuper(this,w,arguments),_this.size="10MB",_this.error=!1,_this.errorMessage="",_this.allowMultiple=!1,_this.allowDuplicates=!1,_this.allowedTypes=[],_this.uploadedFiles=[],_this.title=n.TITLE,_this.subtitle=n.SUBTITLE,_this.state=d.DEFAULT,_this.variant=u.HORIZONTAL,_this.fileUploadUrl="",_this.autoUpload=!0,_this.uploadRequests=new Map(),_this.fileSizeExceededFilesNumber=0,_this.setState=function(t){_this.state=t;};return _this;}_inherits(w,_i);return _createClass(w,[{key:"connectedCallback",value:function connectedCallback(){_superPropGet(w,"connectedCallback",this,3)([]),this.emit(c.NILE_INIT);}},{key:"firstUpdated",value:function firstUpdated(t){_superPropGet(w,"firstUpdated",this,3)([t]),this.dragHandler=new e(),j(this,this.dragHandler),g(this,this.dragHandler,this.uploadRequests),S(this.dragHandler);}},{key:"updated",value:function updated(t){_superPropGet(w,"updated",this,3)([t]),t.has("uploadedFiles")?(this.fileUploadUrl&&this.autoUpload&&b(this),this.emit(c.NILE_CHANGE,{files:this.uploadedFiles})):t.has("state")&&this.dragHandler.setValuesInDragHandler(this.state),t.has("autoUpload")&&this.autoUpload&&(this.fileUploadUrl&&this.autoUpload&&b(this),this.emit(c.NILE_CHANGE,{files:this.uploadedFiles}));}},{key:"browseFiles",value:function browseFiles(){this.emit(c.NILE_BROWSE),this.errorMessage="",this.input.click();}},{key:"render",value:function render(){return m(_templateObject||(_templateObject=_taggedTemplateLiteral(["\n      ","\n    "])),this.getState());}},{key:"getState",value:function getState(){return this.variant===u.HORIZONTAL?this.getHorizontalState():this.getVerticalState();}},{key:"getHorizontalState",value:function getHorizontalState(){switch(this.state){case d.DEFAULT:return h(this.browseFiles,this.title,this.subtitle,this.dragHandler,this.state,this.errorMessage,this.allowedTypes);case d.DISABLED:return a(this.browseFiles,this.title,this.subtitle,this.dragHandler,this.state,this.errorMessage,this.allowedTypes);case d.DRAG:return r();default:return h(this.browseFiles,this.title,this.subtitle,this.dragHandler,this.state,this.errorMessage,this.allowedTypes);}}},{key:"getVerticalState",value:function getVerticalState(){switch(this.state){case d.DEFAULT:return o(this.browseFiles,this.title,this.subtitle,this.dragHandler,this.errorMessage,this.allowedTypes);case d.DISABLED:return p(this.browseFiles,this.title,this.subtitle,this.dragHandler,this.errorMessage,this.allowedTypes);case d.DRAG:return l();default:return o(this.browseFiles,this.title,this.subtitle,this.dragHandler,this.errorMessage,this.allowedTypes);}}},{key:"disconnectedCallback",value:function disconnectedCallback(){this.emit(c.NILE_DESTROY);}}],[{key:"styles",get:function get(){return[s];}}]);}(i));t([f({type:String})],w.prototype,"size",void 0),t([f({type:Boolean})],w.prototype,"error",void 0),t([f({type:String})],w.prototype,"errorMessage",void 0),t([f({type:Boolean})],w.prototype,"allowMultiple",void 0),t([f({type:Boolean})],w.prototype,"allowDuplicates",void 0),t([f({type:Array})],w.prototype,"allowedTypes",void 0),t([f({type:Array})],w.prototype,"uploadedFiles",void 0),t([f({type:String})],w.prototype,"title",void 0),t([f({type:String})],w.prototype,"subtitle",void 0),t([f({type:String})],w.prototype,"state",void 0),t([f({type:String})],w.prototype,"variant",void 0),t([f({type:String})],w.prototype,"fileUploadUrl",void 0),t([f({type:Boolean})],w.prototype,"autoUpload",void 0),t([y("input")],w.prototype,"input",void 0),_export("N",w=t([v("nile-file-upload")],w));}};});
+function _typeof(o){"@babel/helpers - typeof";return _typeof="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(o){return typeof o;}:function(o){return o&&"function"==typeof Symbol&&o.constructor===Symbol&&o!==Symbol.prototype?"symbol":typeof o;},_typeof(o);}System.register(["tslib","./nile-file-upload.css.cjs.js","../internal/nile-element.cjs.js","./utils/drag-drop.util.cjs.js","./nile-file-upload.template.cjs.js","./types/file-upload.enums.cjs.js","lit","lit/decorators.js","./utils/file-validation.util.cjs.js","../lit-html-9b3af046.cjs.js"],function(_export,_context){"use strict";var t,s,i,e,h,r,a,o,l,p,n,d,u,c,m,f,y,v,j,g,S,b,_templateObject,w;function _taggedTemplateLiteral(e,t){return t||(t=e.slice(0)),Object.freeze(Object.defineProperties(e,{raw:{value:Object.freeze(t)}}));}function _classCallCheck(a,n){if(!(a instanceof n))throw new TypeError("Cannot call a class as a function");}function _defineProperties(e,r){for(var t=0;t<r.length;t++){var o=r[t];o.enumerable=o.enumerable||!1,o.configurable=!0,"value"in o&&(o.writable=!0),Object.defineProperty(e,_toPropertyKey(o.key),o);}}function _createClass(e,r,t){return r&&_defineProperties(e.prototype,r),t&&_defineProperties(e,t),Object.defineProperty(e,"prototype",{writable:!1}),e;}function _toPropertyKey(t){var i=_toPrimitive(t,"string");return"symbol"==_typeof(i)?i:i+"";}function _toPrimitive(t,r){if("object"!=_typeof(t)||!t)return t;var e=t[Symbol.toPrimitive];if(void 0!==e){var i=e.call(t,r||"default");if("object"!=_typeof(i))return i;throw new TypeError("@@toPrimitive must return a primitive value.");}return("string"===r?String:Number)(t);}function _callSuper(t,o,e){return o=_getPrototypeOf(o),_possibleConstructorReturn(t,_isNativeReflectConstruct()?Reflect.construct(o,e||[],_getPrototypeOf(t).constructor):o.apply(t,e));}function _possibleConstructorReturn(t,e){if(e&&("object"==_typeof(e)||"function"==typeof e))return e;if(void 0!==e)throw new TypeError("Derived constructors may only return object or undefined");return _assertThisInitialized(t);}function _assertThisInitialized(e){if(void 0===e)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return e;}function _isNativeReflectConstruct(){try{var t=!Boolean.prototype.valueOf.call(Reflect.construct(Boolean,[],function(){}));}catch(t){}return(_isNativeReflectConstruct=function _isNativeReflectConstruct(){return!!t;})();}function _superPropGet(t,o,e,r){var p=_get(_getPrototypeOf(1&r?t.prototype:t),o,e);return 2&r&&"function"==typeof p?function(t){return p.apply(e,t);}:p;}function _get(){return _get="undefined"!=typeof Reflect&&Reflect.get?Reflect.get.bind():function(e,t,r){var p=_superPropBase(e,t);if(p){var n=Object.getOwnPropertyDescriptor(p,t);return n.get?n.get.call(arguments.length<3?e:r):n.value;}},_get.apply(null,arguments);}function _superPropBase(t,o){for(;!{}.hasOwnProperty.call(t,o)&&null!==(t=_getPrototypeOf(t)););return t;}function _getPrototypeOf(t){return _getPrototypeOf=Object.setPrototypeOf?Object.getPrototypeOf.bind():function(t){return t.__proto__||Object.getPrototypeOf(t);},_getPrototypeOf(t);}function _inherits(t,e){if("function"!=typeof e&&null!==e)throw new TypeError("Super expression must either be null or a function");t.prototype=Object.create(e&&e.prototype,{constructor:{value:t,writable:!0,configurable:!0}}),Object.defineProperty(t,"prototype",{writable:!1}),e&&_setPrototypeOf(t,e);}function _setPrototypeOf(t,e){return _setPrototypeOf=Object.setPrototypeOf?Object.setPrototypeOf.bind():function(t,e){return t.__proto__=e,t;},_setPrototypeOf(t,e);}return{setters:[function(_tslib){t=_tslib.__decorate;},function(_nileFileUploadCssCjsJs){s=_nileFileUploadCssCjsJs.s;},function(_internalNileElementCjsJs){i=_internalNileElementCjsJs.N;},function(_utilsDragDropUtilCjsJs){e=_utilsDragDropUtilCjsJs.D;},function(_nileFileUploadTemplateCjsJs){h=_nileFileUploadTemplateCjsJs.g;r=_nileFileUploadTemplateCjsJs.a;a=_nileFileUploadTemplateCjsJs.b;o=_nileFileUploadTemplateCjsJs.c;l=_nileFileUploadTemplateCjsJs.d;p=_nileFileUploadTemplateCjsJs.e;},function(_typesFileUploadEnumsCjsJs){n=_typesFileUploadEnumsCjsJs.c;d=_typesFileUploadEnumsCjsJs.F;u=_typesFileUploadEnumsCjsJs.d;c=_typesFileUploadEnumsCjsJs.b;},function(_lit){m=_lit.html;},function(_litDecoratorsJs){f=_litDecoratorsJs.property;y=_litDecoratorsJs.query;v=_litDecoratorsJs.customElement;},function(_utilsFileValidationUtilCjsJs){j=_utilsFileValidationUtilCjsJs.s;g=_utilsFileValidationUtilCjsJs.a;S=_utilsFileValidationUtilCjsJs.b;b=_utilsFileValidationUtilCjsJs.u;},function(_litHtml001CjsJs){}],execute:function execute(){_export("N",w=/*#__PURE__*/function(_i){function w(){var _this;_classCallCheck(this,w);_this=_callSuper(this,w,arguments),_this.size="10MB",_this.error=!1,_this.errorMessage="",_this.allowMultiple=!1,_this.allowDuplicates=!1,_this.allowedTypes=[],_this.uploadedFiles=[],_this.title=n.TITLE,_this.subtitle=n.SUBTITLE,_this.state=d.DEFAULT,_this.variant=u.HORIZONTAL,_this.fileUploadUrl="",_this.autoUpload=!0,_this.uploadRequests=new Map(),_this.fileSizeExceededFilesNumber=0,_this.isStringTruncated=!1,_this.setState=function(t){_this.state=t;};return _this;}_inherits(w,_i);return _createClass(w,[{key:"connectedCallback",value:function connectedCallback(){_superPropGet(w,"connectedCallback",this,3)([]),this.emit(c.NILE_INIT);}},{key:"firstUpdated",value:function firstUpdated(t){_superPropGet(w,"firstUpdated",this,3)([t]),this.dragHandler=new e(),j(this,this.dragHandler),g(this,this.dragHandler,this.uploadRequests),S(this.dragHandler);}},{key:"updated",value:function updated(t){_superPropGet(w,"updated",this,3)([t]),t.has("uploadedFiles")?(this.fileUploadUrl&&this.autoUpload&&b(this),this.emit(c.NILE_CHANGE,{files:this.uploadedFiles})):t.has("state")&&this.dragHandler.setValuesInDragHandler(this.state),t.has("autoUpload")&&this.autoUpload&&(this.fileUploadUrl&&this.autoUpload&&b(this),this.emit(c.NILE_CHANGE,{files:this.uploadedFiles}));}},{key:"browseFiles",value:function browseFiles(){this.emit(c.NILE_BROWSE),this.errorMessage="",this.input.click();}},{key:"render",value:function render(){return m(_templateObject||(_templateObject=_taggedTemplateLiteral(["\n      ","\n    "])),this.getState());}},{key:"getState",value:function getState(){return this.variant===u.HORIZONTAL?this.getHorizontalState():this.getVerticalState();}},{key:"getHorizontalState",value:function getHorizontalState(){switch(this.state){case d.DEFAULT:return h(this.browseFiles,this.title,this.subtitle,this.dragHandler,this.state,this.errorMessage,this.allowedTypes,this);case d.DISABLED:return a(this.browseFiles,this.title,this.subtitle,this.dragHandler,this.state,this.errorMessage,this.allowedTypes,this);case d.DRAG:return r();default:return h(this.browseFiles,this.title,this.subtitle,this.dragHandler,this.state,this.errorMessage,this.allowedTypes,this);}}},{key:"getVerticalState",value:function getVerticalState(){switch(this.state){case d.DEFAULT:return o(this.browseFiles,this.title,this.subtitle,this.dragHandler,this.errorMessage,this.allowedTypes,this);case d.DISABLED:return p(this.browseFiles,this.title,this.subtitle,this.dragHandler,this.errorMessage,this.allowedTypes,this);case d.DRAG:return l();default:return o(this.browseFiles,this.title,this.subtitle,this.dragHandler,this.errorMessage,this.allowedTypes,this);}}},{key:"disconnectedCallback",value:function disconnectedCallback(){this.emit(c.NILE_DESTROY);}}],[{key:"styles",get:function get(){return[s];}}]);}(i));t([f({type:String})],w.prototype,"size",void 0),t([f({type:Boolean})],w.prototype,"error",void 0),t([f({type:String})],w.prototype,"errorMessage",void 0),t([f({type:Boolean})],w.prototype,"allowMultiple",void 0),t([f({type:Boolean})],w.prototype,"allowDuplicates",void 0),t([f({type:Array})],w.prototype,"allowedTypes",void 0),t([f({type:Array})],w.prototype,"uploadedFiles",void 0),t([f({type:String})],w.prototype,"title",void 0),t([f({type:String})],w.prototype,"subtitle",void 0),t([f({type:String})],w.prototype,"state",void 0),t([f({type:String})],w.prototype,"variant",void 0),t([f({type:String})],w.prototype,"fileUploadUrl",void 0),t([f({type:Boolean})],w.prototype,"autoUpload",void 0),t([y("input")],w.prototype,"input",void 0),_export("N",w=t([v("nile-file-upload")],w));}};});
 //# sourceMappingURL=nile-file-upload.cjs.js.map

package/dist/nile-file-upload/nile-file-upload.cjs.js.map

@@ -1 +1 @@
-{"version":3,"file":"nile-file-upload.cjs.js","sources":["../../../src/nile-file-upload/nile-file-upload.ts"],"sourcesContent":["/**\n * Copyright Aquera Inc 2025\n *\n * This source code is licensed under the BSD-3-Clause license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport { styles } from './nile-file-upload.css';\nimport { ChangedPropsInterface } from './types/file-upload.type'\nimport NileElement from '../internal/nile-element';\nimport { DragHandler } from './utils/drag-drop.util';\nimport { getHorizontalDisabledState } from './nile-file-upload.template'\nimport { FileUploadDefaults } from './types/file-upload.enums';\nimport { LitElement, html, CSSResultArray, TemplateResult } from 'lit';\nimport { customElement, property, query, state } from 'lit/decorators.js';\nimport { FileUploadState, FileUploadVariant, FileUploadError, FileUploadEvent } from './types/file-upload.enums';\nimport { setUpDragHandler, addGlobalListeners, addInternalListeners, uploadFiles, cancelFileUpload } from './utils/file-validation.util';\nimport {\n  getHorizontalDefaultState,\n  getHorizontalDragState,\n  getVerticalDefaultState,\n  getVerticalDisabledState,\n  getVerticalDragState,\n} from './nile-file-upload.template';\n\n/**\n * Nile file-upload component.\n *\n * @tag nile-file-upload\n *\n */\n@customElement('nile-file-upload')\nexport class NileFileUpload extends NileElement {\n  /**\n   * The styles for nile-file-upload\n   * @remarks If you are extending this class you can extend the base styles with super. Eg `return [super(), myCustomStyles]`\n   */\n  public static get styles(): CSSResultArray {\n    return [styles];\n  }\n\n  @property({ type: String }) size: string = \"10MB\";\n  @property({ type: Boolean}) error: boolean = false;\n  @property({ type: String }) errorMessage: string = \"\";\n  @property({ type: Boolean}) allowMultiple: boolean = false;\n  @property({ type: Boolean}) allowDuplicates: boolean = false;\n  @property({ type: Array  }) allowedTypes: string[] = [];\n  @property({ type: Array  }) uploadedFiles: File[] = [];\n  @property({ type: String }) title: string = FileUploadDefaults.TITLE;\n  @property({ type: String }) subtitle: string = FileUploadDefaults.SUBTITLE;\n  @property({ type: String }) state: FileUploadState = FileUploadState.DEFAULT; \n  @property({ type: String }) variant: FileUploadVariant = FileUploadVariant.HORIZONTAL;\n  @property({ type: String }) fileUploadUrl: string = \"\";\n  @property({ type: Boolean}) autoUpload: boolean = true;\n  @query('input') input!: HTMLInputElement;\n  public uploadRequests = new Map<File, XMLHttpRequest>();\n  public fileSizeExceededFilesNumber: number = 0;\n  \n  private dragHandler!: DragHandler;\n\n  connectedCallback(): void {\n    super.connectedCallback();\n    this.emit(FileUploadEvent.NILE_INIT);\n  }\n\n  firstUpdated(changedProps: ChangedPropsInterface): void {\n    super.firstUpdated(changedProps);\n\n    this.dragHandler = new DragHandler();\n    setUpDragHandler(this, this.dragHandler);\n    addInternalListeners(this, this.dragHandler, this.uploadRequests);\n    addGlobalListeners(this.dragHandler);\n  }\n\n  updated(changedProps: ChangedPropsInterface): void {\n    super.updated(changedProps);\n\n    if (changedProps.has('uploadedFiles')) {\n      // if(this.uploadedFiles.length === 0) {\n      //   this.errorMessage = \"\";\n      // }\n\n      if(this.fileUploadUrl && this.autoUpload) {\n        uploadFiles(this);\n      }\n      this.emit(FileUploadEvent.NILE_CHANGE, { files: this.uploadedFiles });\n    } else if (changedProps.has('state')) {\n      this.dragHandler.setValuesInDragHandler(this.state);\n    }\n\n    if(changedProps.has('autoUpload') && this.autoUpload) {\n      if(this.fileUploadUrl && this.autoUpload) {\n        uploadFiles(this);\n      }\n      this.emit(FileUploadEvent.NILE_CHANGE, { files: this.uploadedFiles });\n    }\n  }\n\n  private browseFiles(): void {\n    this.emit(FileUploadEvent.NILE_BROWSE);\n    this.errorMessage = \"\";\n    this.input.click();\n  }\n\n  public setState = (newState: FileUploadState): void => {\n    this.state = newState;\n  }\n\n  render(): TemplateResult {\n    return html`\n      ${this.getState()}\n    `;\n  }\n\n  private getState(): TemplateResult {\n    return this.variant === FileUploadVariant.HORIZONTAL\n      ? this.getHorizontalState()\n      : this.getVerticalState();\n  }\n\n  private getHorizontalState(): TemplateResult {\n    switch(this.state) {\n      case FileUploadState.DEFAULT:\n        return getHorizontalDefaultState(this.browseFiles, this.title, this.subtitle, this.dragHandler, this.state, this.errorMessage, this.allowedTypes);\n\n      case FileUploadState.DISABLED:\n        return getHorizontalDisabledState(this.browseFiles, this.title, this.subtitle, this.dragHandler, this.state, this.errorMessage, this.allowedTypes);\n\n      case FileUploadState.DRAG:\n        return getHorizontalDragState();\n\n      default:\n        return getHorizontalDefaultState(this.browseFiles, this.title, this.subtitle, this.dragHandler, this.state, this.errorMessage, this.allowedTypes);\n    }\n  }\n\n  private getVerticalState(): TemplateResult {\n    switch(this.state) {\n      case FileUploadState.DEFAULT:\n        return getVerticalDefaultState(this.browseFiles, this.title, this.subtitle, this.dragHandler, this.errorMessage, this.allowedTypes);\n\n      case FileUploadState.DISABLED:\n        return getVerticalDisabledState(this.browseFiles, this.title, this.subtitle, this.dragHandler, this.errorMessage, this.allowedTypes);\n\n      case FileUploadState.DRAG:\n        return getVerticalDragState();\n\n      default:\n        return getVerticalDefaultState(this.browseFiles, this.title, this.subtitle, this.dragHandler, this.errorMessage, this.allowedTypes);\n    }\n  }\n\n  disconnectedCallback(): void {\n    this.emit(FileUploadEvent.NILE_DESTROY);\n  }\n}\n"],"names":["NileFileUpload","_i","w","this","size","error","errorMessage","allowMultiple","allowDuplicates","allowedTypes","uploadedFiles","title","FileUploadDefaults","TITLE","subtitle","SUBTITLE","state","FileUploadState","DEFAULT","variant","FileUploadVariant","HORIZONTAL","fileUploadUrl","autoUpload","uploadRequests","Map","fileSizeExceededFilesNumber","setState","newState","_this","_inherits","_createClass","key","value","connectedCallback","super","emit","FileUploadEvent","NILE_INIT","firstUpdated","changedProps","dragHandler","DragHandler","setUpDragHandler","addInternalListeners","addGlobalListeners","updated","has","uploadFiles","NILE_CHANGE","files","setValuesInDragHandler","browseFiles","NILE_BROWSE","input","click","render","html","_templateObject","_taggedTemplateLiteral","getState","getHorizontalState","getVerticalState","getHorizontalDefaultState","DISABLED","getHorizontalDisabledState","DRAG","getHorizontalDragState","getVerticalDefaultState","getVerticalDisabledState","getVerticalDragState","disconnectedCallback","NILE_DESTROY","__decorate","get","styles","NileElement","property","type","String","prototype","Boolean","Array","query","customElement"],"mappings":"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"}
+{"version":3,"file":"nile-file-upload.cjs.js","sources":["../../../src/nile-file-upload/nile-file-upload.ts"],"sourcesContent":["/**\n * Copyright Aquera Inc 2025\n *\n * This source code is licensed under the BSD-3-Clause license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport { styles } from './nile-file-upload.css';\nimport { ChangedPropsInterface } from './types/file-upload.type'\nimport NileElement from '../internal/nile-element';\nimport { DragHandler } from './utils/drag-drop.util';\nimport { getHorizontalDisabledState } from './nile-file-upload.template'\nimport { FileUploadDefaults } from './types/file-upload.enums';\nimport { LitElement, html, CSSResultArray, TemplateResult } from 'lit';\nimport { customElement, property, query, state } from 'lit/decorators.js';\nimport { FileUploadState, FileUploadVariant, FileUploadError, FileUploadEvent } from './types/file-upload.enums';\nimport { setUpDragHandler, addGlobalListeners, addInternalListeners, uploadFiles, cancelFileUpload } from './utils/file-validation.util';\nimport {\n  getHorizontalDefaultState,\n  getHorizontalDragState,\n  getVerticalDefaultState,\n  getVerticalDisabledState,\n  getVerticalDragState,\n} from './nile-file-upload.template';\n\n/**\n * Nile file-upload component.\n *\n * @tag nile-file-upload\n *\n */\n@customElement('nile-file-upload')\nexport class NileFileUpload extends NileElement {\n  /**\n   * The styles for nile-file-upload\n   * @remarks If you are extending this class you can extend the base styles with super. Eg `return [super(), myCustomStyles]`\n   */\n  public static get styles(): CSSResultArray {\n    return [styles];\n  }\n\n  @property({ type: String }) size: string = \"10MB\";\n  @property({ type: Boolean}) error: boolean = false;\n  @property({ type: String }) errorMessage: string = \"\";\n  @property({ type: Boolean}) allowMultiple: boolean = false;\n  @property({ type: Boolean}) allowDuplicates: boolean = false;\n  @property({ type: Array  }) allowedTypes: string[] = [];\n  @property({ type: Array  }) uploadedFiles: File[] = [];\n  @property({ type: String }) title: string = FileUploadDefaults.TITLE;\n  @property({ type: String }) subtitle: string = FileUploadDefaults.SUBTITLE;\n  @property({ type: String }) state: FileUploadState = FileUploadState.DEFAULT; \n  @property({ type: String }) variant: FileUploadVariant = FileUploadVariant.HORIZONTAL;\n  @property({ type: String }) fileUploadUrl: string = \"\";\n  @property({ type: Boolean}) autoUpload: boolean = true;\n  @query('input') input!: HTMLInputElement;\n  public uploadRequests = new Map<File, XMLHttpRequest>();\n  public fileSizeExceededFilesNumber: number = 0;\n  public isStringTruncated: boolean = false;\n  \n  private dragHandler!: DragHandler;\n\n  connectedCallback(): void {\n    super.connectedCallback();\n    this.emit(FileUploadEvent.NILE_INIT);\n  }\n\n  firstUpdated(changedProps: ChangedPropsInterface): void {\n    super.firstUpdated(changedProps);\n\n    this.dragHandler = new DragHandler();\n    setUpDragHandler(this, this.dragHandler);\n    addInternalListeners(this, this.dragHandler, this.uploadRequests);\n    addGlobalListeners(this.dragHandler);\n  }\n\n  updated(changedProps: ChangedPropsInterface): void {\n    super.updated(changedProps);\n\n    if (changedProps.has('uploadedFiles')) {\n      // if(this.uploadedFiles.length === 0) {\n      //   this.errorMessage = \"\";\n      // }\n\n      if(this.fileUploadUrl && this.autoUpload) {\n        uploadFiles(this);\n      }\n      this.emit(FileUploadEvent.NILE_CHANGE, { files: this.uploadedFiles });\n    } else if (changedProps.has('state')) {\n      this.dragHandler.setValuesInDragHandler(this.state);\n    }\n\n    if(changedProps.has('autoUpload') && this.autoUpload) {\n      if(this.fileUploadUrl && this.autoUpload) {\n        uploadFiles(this);\n      }\n      this.emit(FileUploadEvent.NILE_CHANGE, { files: this.uploadedFiles });\n    }\n  }\n\n  private browseFiles(): void {\n    this.emit(FileUploadEvent.NILE_BROWSE);\n    this.errorMessage = \"\";\n    this.input.click();\n  }\n\n  public setState = (newState: FileUploadState): void => {\n    this.state = newState;\n  }\n\n  render(): TemplateResult {\n    return html`\n      ${this.getState()}\n    `;\n  }\n\n  private getState(): TemplateResult {\n    return this.variant === FileUploadVariant.HORIZONTAL\n      ? this.getHorizontalState()\n      : this.getVerticalState();\n  }\n\n  private getHorizontalState(): TemplateResult {\n    switch(this.state) {\n      case FileUploadState.DEFAULT:\n        return getHorizontalDefaultState(this.browseFiles, this.title, this.subtitle, this.dragHandler, this.state, this.errorMessage, this.allowedTypes, this);\n\n      case FileUploadState.DISABLED:\n        return getHorizontalDisabledState(this.browseFiles, this.title, this.subtitle, this.dragHandler, this.state, this.errorMessage, this.allowedTypes, this);\n\n      case FileUploadState.DRAG:\n        return getHorizontalDragState();\n\n      default:\n        return getHorizontalDefaultState(this.browseFiles, this.title, this.subtitle, this.dragHandler, this.state, this.errorMessage, this.allowedTypes, this);\n    }\n  }\n\n  private getVerticalState(): TemplateResult {\n    switch(this.state) {\n      case FileUploadState.DEFAULT:\n        return getVerticalDefaultState(this.browseFiles, this.title, this.subtitle, this.dragHandler, this.errorMessage, this.allowedTypes, this);\n\n      case FileUploadState.DISABLED:\n        return getVerticalDisabledState(this.browseFiles, this.title, this.subtitle, this.dragHandler, this.errorMessage, this.allowedTypes, this);\n\n      case FileUploadState.DRAG:\n        return getVerticalDragState();\n\n      default:\n        return getVerticalDefaultState(this.browseFiles, this.title, this.subtitle, this.dragHandler, this.errorMessage, this.allowedTypes, this);\n    }\n  }\n\n  disconnectedCallback(): void {\n    this.emit(FileUploadEvent.NILE_DESTROY);\n  }\n}\n"],"names":["NileFileUpload","w","constructor","this","size","error","errorMessage","allowMultiple","allowDuplicates","allowedTypes","uploadedFiles","title","FileUploadDefaults","TITLE","subtitle","SUBTITLE","state","FileUploadState","DEFAULT","variant","FileUploadVariant","HORIZONTAL","fileUploadUrl","autoUpload","uploadRequests","Map","fileSizeExceededFilesNumber","isStringTruncated","setState","newState","_this","_inherits","_i","_createClass","key","value","connectedCallback","super","emit","FileUploadEvent","NILE_INIT","firstUpdated","changedProps","dragHandler","DragHandler","setUpDragHandler","addInternalListeners","addGlobalListeners","updated","has","uploadFiles","NILE_CHANGE","files","setValuesInDragHandler","browseFiles","NILE_BROWSE","input","click","render","html","_templateObject","_taggedTemplateLiteral","getState","getHorizontalState","getVerticalState","getHorizontalDefaultState","DISABLED","getHorizontalDisabledState","DRAG","getHorizontalDragState","getVerticalDefaultState","getVerticalDisabledState","getVerticalDragState","disconnectedCallback","NILE_DESTROY","get","styles","NileElement","__decorate","property","type","String","prototype","Boolean","Array","query","customElement"],"mappings":"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"}

package/dist/nile-file-upload/nile-file-upload.css.cjs.js

@@ -1,2 +1,2 @@
-System.register(["lit"],function(_export,_context){"use strict";var e,_templateObject,r;function _taggedTemplateLiteral(e,t){return t||(t=e.slice(0)),Object.freeze(Object.defineProperties(e,{raw:{value:Object.freeze(t)}}));}return{setters:[function(_lit){e=_lit.css;}],execute:function execute(){_export("s",r=e(_templateObject||(_templateObject=_taggedTemplateLiteral(["\n  :host {\n    display: inline-block;\n  }\n\n  * {\n    padding: 0px;\n    margin: 0px;\n    box-sizing: border-box;\n  }\n\n  .wrapper {\n    display: flex;\n    flex-direction: column;\n    justify-content: center;\n    align-items: flex-start;\n    width: min-content;\n  }\n\n  input {\n    display: none;\n  }\n\n  .horizontal-div {\n    margin-bottom: 10px;\n    height: 62px;\n    max-width: 648px;\n    width: 648px;\n    min-width: 230px;\n    padding: 12px;\n    display: flex;\n    align-items: center;\n    justify-content: space-between;\n    gap: 18px;\n    border-radius: var(--nile-radius-radius-xs);\n    border: 1px dashed var(--nile-colors-neutral-500);\n    color: var(--nile-colors-dark-900);\n    background-color: var(--nile-colors-white-base);\n  }\n\n  .hover-border {\n    border-color: var(--nile-colors-primary-600);\n  }\n\n  .title {\n    font-size: var(--nile-type-scale-3);\n    font-weight: var(--nile-font-weight-regular);\n    color: var(--nile-colors-dark-900);\n    white-space: nowrap;\n    text-overflow: ellipsis;\n    overflow: hidden;\n    max-width: 454px;\n    width: 100%;\n  }\n\n  .subtitle {\n    font-size: var(--nile-type-scale-2);\n    font-weight: var(--nile-font-weight-regular);\n    color: var(--nile-colors-dark-500);\n    white-space: nowrap;\n    text-overflow: ellipsis;\n    overflow: hidden;\n    max-width: 454px;\n  }\n\n  .vertical-div {\n    min-height: 156px;\n    height: auto;\n    min-width: 240px;\n    width: 240px;\n    display: flex;\n    flex-direction: column;\n    justify-content: space-between;\n    align-items: center;\n    padding: 12px;\n    border-radius: var(--nile-radius-radius-xs);\n    color: var(--nile-colors-dark-900);\n    border: 1px dashed var(--nile-colors-neutral-500);\n    background-color: var(--nile-colors-white-base);\n    position: relative; \n  }\n\n  .vertical-div:hover {\n    border-color: var(--nile-colors-blue-500);\n  }\n\n  .outer-div-border {\n    border: 1px solid var(--nile-colors-neutral-400);\n  }\n\n  .inner-div {\n    display: flex;\n    align-items: center;\n    justify-content: flex-start;\n    gap: 18px;\n    box-sizing: border-box;\n  }\n\n  .content {\n    display: flex;  \n    flex-direction: column;\n    justify-content: center;\n    gap: 8px;\n  }\n\n  .content h4 {\n    margin: 0px;\n    font-size: var(--nile-type-scale-3);\n    font-weight: var(--nile-font-weight-regular);\n    color: var(--nile-colors-dark-900);\n    text-align: center;\n    white-space: nowrap;\n    text-overflow: ellipsis;\n    overflow: hidden;\n    width: 454px;\n  }\n      \n  .content p {\n    margin: 0px;\n    font-size: var(--nile-type-scale-2);\n    color: var(--nile-colors-neutral-700);\n    text-align: center;\n    white-space: nowrap;\n    text-overflow: ellipsis;\n    overflow: hidden;\n    width: 454px;\n  }\n\n  ::slotted(img), ::slotted(nile-icon), ::slotted(video) {\n    --nile-svg-height: 24px !important ;\n    --nile-svg-width: 24px !important ;\n    height:42px;\n    width: 42px;\n    object-fit: cover;\n  }\n\n  .browse-file-button {\n    cursor: pointer;\n  }\n\n  /*  DISABLED STATE */\n  .disable {\n    background-color: var(--nile-colors-dark-200);\n    opacity: 0.8;\n    cursor: not-allowed;\n    color: var(--nile-colors-neutral-500);\n    pointer-events: none;\n  }\n\n  /* DRAGGING */\n  .dragging {\n    background-color: var(--nile-colors-blue-100);\n    border-color: var(--nile-colors-primary-600);\n    display: flex;\n    align-items: center;\n    justify-content: flex-start;\n    gap: 18px;\n    color: var(--nile-colors-blue-700);\n    font-size: var(--nile-type-scale-3);\n    font-weight: var(--nile-font-weight-regular);\n  }\n\n  .icons-container {\n    display: flex;\n    gap: 4px;\n  }\n\n  .general-icon {\n    transform: rotate(-18.11deg);\n    position: relative;\n    bottom: 3px;\n  }\n\n  .image-icon {\n    transform: rotate(15deg);\n  }\n\n  .icon:hover {\n    cursor: pointer;\n  }\n\n  /* Uploading State */\n  .uploading {\n    width: 648px;\n    min-width: 230px;\n    display: flex;\n    justify-content: space-between;\n    align-items: center;\n    gap: 18px;\n    box-sizing: border-box;\n    border: 1px solid var(--nile-colors-neutral-400)\n  }\n  \n  .uploading:hover {\n    border-color: var(--nile-colors-neutral-400);\n  }\n\n  .progress-bar-container {\n    width: 100%;\n    display: flex;\n    flex-direction: column;\n    gap: 0px;\n  }\n\n  .progress-bar-percent {\n    width: 100%;\n    display: flex;\n    justify-content: space-between;\n    font-size: var(--nile-type-scale-2);\n    font-weight: var(--nile-font-weight-regular);\n  }\n\n  .progress-bar-container p {\n    margin: 0px;\n  }\n\n  .progress-bar-container > p {\n    font-size: var(--nile-type-scale-1);\n    color: var(--nile-colors-dark-500);\n  }\n\n  /* PREVIEW STATE */\n  .preview {\n    border: 1px solid var(--nile-colors-neutral-400);\n  }\n\n  .preview:hover {\n    border-color: var(--nile-colors-neutral-400);\n  }\n\n  .preview-inner {\n    display: flex;\n    gap: 18px;\n  }\n\n  .preview-image-container {\n    height: 42px;\n    width: 42px;\n  }\n\n  .preview-image-container img {\n    height: 42px;\n    width: 42px;\n    object-fit: contain;\n    border-radius: var(--nile-radius-radius-xs);\n    border: 1px solid var(--nile-colors-neutral-400);\n  }\n  \n  .preview-file-info {\n    width: 100%;\n    display: flex;\n    flex-direction: column;\n    justify-content: center;\n    align-items: flex-start;\n    gap: 8px;\n  }\n\n  .preview-file-info p {\n    margin: 0px;\n    font-size: var(--nile-type-scale-3);\n    font-weight: var(--nile-font-weight-regular);\n  }\n\n  .preview-file-info p:last-of-type{\n    color: var(--nile-colors-neutral-700);\n    font-size: var(--nile-type-scale-2);\n    font-weight: var(--nile-font-weight-regular);\n  }\n\n  .preview nile-icon:hover {\n    cursor: pointer;\n  }\n\n\n  /* NO PREVIEW STATE */\n  .no-preview {\n    border: 1px solid var(--nile-colors-neutral-400);\n  }\n\n  .no-preview:hover {\n    border-color: var(--nile-colors-neutral-400);\n  }\n\n  .no-preview-container {\n    display: flex;\n    gap: 18px;\n  }\n\n  .document-icon {\n    height: 40px;\n    width: 40px;\n    border-radius: var(--nile-radius-radius-xs);\n    padding: 2px 3px 2px 3px;\n    display: flex;\n    justify-content: center;\n    align-items: center;\n    border: 1px solid var(--nile-colors-blue-400);\n    background-color: var(--nile-colors-blue-100);\n  }\n\n  .document-icon nile-icon {\n    height: 40px;\n    width: 40px;\n  }\n  \n  .preview-file-info {\n    width: 100%;\n    display: flex;\n    flex-direction: column;\n    justify-content: center;\n    align-items: flex-start;\n    gap: 8px;\n  }\n\n  .preview-file-info p {\n    margin: 0px;\n    font-size: var(--nile-type-scale-3);\n    font-weight: var(--nile-font-weight-regular);\n  }\n\n  .preview-file-info p:last-of-type{\n    color: var(--nile-colors-neutral-700);\n    font-size: var(--nile-type-scale-2);\n    font-weight: var(--nile-font-weight-regular);\n  }\n\n  .no-preview > nile-icon:hover {\n    cursor: pointer;\n  }\n\n  /* ERROR STATE */\n  \n  .error {\n    border: 1px solid var(--nile-colors-neutral-400);\n  }\n\n  .error:hover {\n    border-color: var(--nile-colors-neutral-400);\n  }\n\n  .error-container {\n    width: 100%;\n    display: flex;\n    gap: 18px;\n  }\n\n  .error-icon {\n    height: 40px;\n    width: 40px;\n    border-radius: var(--nile-radius-radius-xs);\n    padding: 2px 3px 2px 3px;\n    display: flex;\n    justify-content: center;\n    align-items: center;\n    border: 1px solid var(--nile-colors-red-400);\n    background-color: var(--nile-colors-red-100);\n  }\n\n  .error-icon nile-icon {\n    height: 40px;\n    width: 40px;\n  }\n  \n  .file-info {\n    width: 100%;\n    display: flex;\n    flex-direction: column;\n    justify-content: center;\n    align-items: flex-start;\n    gap: 8px;\n  }\n\n  .file-info p {\n    margin: 0px;\n    font-size: var(--nile-type-scale-3);\n    font-weight: var(--nile-font-weight-regular);\n  }\n\n  .file-info p:last-of-type{\n    color: var(--nile-colors-red-700);\n    font-size: var(--nile-type-scale-2);\n    font-weight: var(--nile-font-weight-regular);\n  }\n\n  .error > nile-icon:hover {\n    cursor: pointer;\n  }\n\n  /* VARTICAL STATE START */\n  /* Default State */\n\n  .vertical-default {\n    display: flex;\n    flex-direction: column;\n    align-items: center;\n    justify-content: center;\n    gap: 18px\n  }\n\n  .content-container {\n    display: flex;\n    flex-direction: column;\n    justify-content: center;\n    align-items: center;\n    gap: 8px;\n  }\n\n  .content-container div.title {\n    font-size: var(--nile-type-scale-3);\n    font-weight: var(--nile-font-weight-regular);\n    color: var(--nile-colors-dark-900);\n    text-align: center;\n    white-space: nowrap;\n    text-overflow: ellipsis;\n    overflow: hidden;\n    width: 222px;\n  }\n\n  .content-container div.subtitle {\n    font-size: var(--nile-type-scale-2);\n    font-weight: var(--nile-font-weight-regular);\n    color: var(--nile-colors-dark-500);\n    text-align: center;\n    white-space: nowrap;\n    text-overflow: ellipsis;\n    overflow: hidden;\n    width: 222px;\n  }\n\n  /* Drag State */\n  .vertical-drag {\n    display: flex;\n    flex-direction: column;\n    justify-content: center;\n    align-items: center;\n    gap:18px;\n    font-size: var(--nile-type-scale-3);\n    color: var(--nile-colors-blue-700);\n    background-color: var(--nile-colors-blue-100);\n    border-color: var(--nile-colors-blue-500);\n  }\n\n  /* Uploading State */\n  .vertical-uploading {\n    display: flex;\n    flex-direction: column;\n    justify-content: flex-end;\n    align-items: center;\n    border: 1px solid var(--nile-colors-neutral-400);\n  }\n\n  .vertical-uploading:hover {\n    border-color: var(--nile-colors-neutral-400);\n  }\n\n  .loading {\n    display: flex;\n    justify-content: center;\n    align-items: center;\n  }\n\n  .corner-icon {\n    position: absolute;\n    top: 10px;\n    right: 10px;\n  }\n\n  /* Preview State */\n  .vertical-preview {\n    border: 1px solid var(--nile-colors-neutral-400);\n  }\n\n  .vertical-preview:hover {\n    border-color: var(--nile-colors-neutral-400);\n  }\n\n  .image-preview {\n    border: 1px solid var(--nile-colors-neutral-400);\n    object-fit: cover;\n    width: 80px;\n    height: 80px;\n    border-radius: var(--nile-radius-radius-xs);\n  }\n\n  /* Vertical No Preview State */\n  .vertical-no-preview {\n    border: 1px solid var(--nile-colors-neutral-400);\n  }\n\n  .vertical-no-preview:hover {\n    border-color: var(--nile-colors-neutral-400);\n  }\n\n  .vertical-document-icon {\n    height: 80px;\n    width: 80px;\n    padding: 2px 3px 2px 3px;\n    display: flex;\n    justify-content: center;\n    align-items: center;\n    border-radius: var(--nile-radius-radius-xs);\n    border: 1px solid var(--nile-colors-blue-400);\n    background-color: var(--nile-colors-blue-100);\n  }\n\n  /* Veritcal Error State */\n  .vertical-error {\n    border: 1px solid var(--nile-colors-neutral-400);\n  }\n\n  .vertical-error:hover {\n    border-color: var(--nile-colors-neutral-400);\n  }\n\n  .error-bg {\n    background-color: var(--nile-colors-red-100);\n    border: 1px solid var(--nile-colors-red-400);\n  }\n\n  .error-message {\n    display: flex;\n    flex-direction: column;\n    justify-content: center;\n    align-items: center;\n    gap: 8px;\n    margin: 0px;\n    font-size: var(--nile-type-scale-3);\n    font-weight: var(--nile-font-weight-regular);\n    text-align: start;\n  }\n\n  .error-p {\n    color: var(--nile-colors-red-700);\n    font-size: var(--nile-type-scale-2);\n    width: 216px;\n    white-space: nowrap;\n    overflow: hidden;\n    text-overflow: ellipsis;\n    text-align: center;\n  }\n\n  .error-p p {\n    white-space: nowrap;\n    overflow: hidden;\n    text-overflow: ellipsis;\n    margin: 0;\n  }\n\n\n  /* Displaing uploaded files CSS */\n  .display-files {\n    display: flex;\n    flex-direction: column;\n    justify-content: flex-start;\n    align-items: center;\n    gap: 8px;\n    width: 648px;\n    min-width: 230px;\n    max-height: 200px;\n    overflow-y: auto;\n    border: 1px solid var(--nile-colors-neutral-700);\n    border-radius: var(--nile-radius-radius-xs);\n    scrollbar-width: none;\n    padding: 12px;\n  }\n\n  ul, li {\n    width: 100%;\n  }\n\n  li {\n    list-style-type: none;\n  }\n\n  /* for the upload error messages */\n  .upload-error {\n    font-size: var(--nile-type-scale-2);\n    font-weight: var(--nile-font-weight-regular);\n    color: var(--nile-colors-red-700);\n    display: flex;\n    justify-content: flex-start;\n    align-items: center;\n    gap: var(--nile-spacing-one-half-x);\n  }\n\n  .upload-error > nile-tooltip > span {\n    color: var(--nile-colors-red-700);\n    white-space: nowrap;\n    text-align: left;\n    max-width: 538px;\n    overflow: hidden;\n    text-overflow: ellipsis;\n  }\n\n  .vertical-upload-error {\n    display: flex;\n    gap: 4px;\n  }\n\n  .vertical-upload-error > nile-tooltip > span  {\n    color: var(--nile-colors-red-700);\n    white-space: nowrap;\n    text-align: left;\n    width: 222px;\n    overflow: hidden;\n    text-overflow: ellipsis;\n    font-size: var(--nile-type-scale-2);\n    display: inline-block;\n  }\n"]))));}};});
+System.register(["lit"],function(_export,_context){"use strict";var e,_templateObject,r;function _taggedTemplateLiteral(e,t){return t||(t=e.slice(0)),Object.freeze(Object.defineProperties(e,{raw:{value:Object.freeze(t)}}));}return{setters:[function(_lit){e=_lit.css;}],execute:function execute(){_export("s",r=e(_templateObject||(_templateObject=_taggedTemplateLiteral(["\n  :host {\n    display: inline-block;\n  }\n\n  * {\n    padding: 0px;\n    margin: 0px;\n    box-sizing: border-box;\n  }\n\n  .wrapper {\n    display: flex;\n    flex-direction: column;\n    justify-content: center;\n    align-items: flex-start;\n    width: min-content;\n  }\n\n  input {\n    display: none;\n  }\n\n  .horizontal-div {\n    margin-bottom: 10px;\n    height: 62px;\n    max-width: 648px;\n    width: 648px;\n    min-width: 230px;\n    padding: 12px;\n    display: flex;\n    align-items: center;\n    justify-content: space-between;\n    gap: 18px;\n    border-radius: var(--nile-radius-radius-xs);\n    border: 1px dashed var(--nile-colors-neutral-500);\n    color: var(--nile-colors-dark-900);\n    background-color: var(--nile-colors-white-base);\n  }\n\n  .hover-border {\n    border-color: var(--nile-colors-primary-600);\n  }\n\n  .title {\n    font-size: var(--nile-type-scale-3);\n    font-weight: var(--nile-font-weight-regular);\n    color: var(--nile-colors-dark-900);\n    white-space: nowrap;\n    text-overflow: ellipsis;\n    overflow: hidden;\n    max-width: 454px;\n    width: 100%;\n  }\n\n  .subtitle {\n    font-size: var(--nile-type-scale-2);\n    font-weight: var(--nile-font-weight-regular);\n    color: var(--nile-colors-dark-500);\n    white-space: nowrap;\n    text-overflow: ellipsis;\n    overflow: hidden;\n    max-width: 454px;\n  }\n\n  .vertical-div {\n    min-height: 156px;\n    height: auto;\n    min-width: 240px;\n    width: 240px;\n    display: flex;\n    flex-direction: column;\n    justify-content: space-between;\n    align-items: center;\n    padding: 12px;\n    border-radius: var(--nile-radius-radius-xs);\n    color: var(--nile-colors-dark-900);\n    border: 1px dashed var(--nile-colors-neutral-500);\n    background-color: var(--nile-colors-white-base);\n    position: relative; \n  }\n\n  .vertical-div:hover {\n    border-color: var(--nile-colors-blue-500);\n  }\n\n  .outer-div-border {\n    border: 1px solid var(--nile-colors-neutral-400);\n  }\n\n  .inner-div {\n    display: flex;\n    align-items: center;\n    justify-content: flex-start;\n    gap: 18px;\n    box-sizing: border-box;\n  }\n\n  .content {\n    display: flex;  \n    flex-direction: column;\n    justify-content: center;\n    gap: 8px;\n  }\n\n  .content h4 {\n    margin: 0px;\n    font-size: var(--nile-type-scale-3);\n    font-weight: var(--nile-font-weight-regular);\n    color: var(--nile-colors-dark-900);\n    text-align: center;\n    white-space: nowrap;\n    text-overflow: ellipsis;\n    overflow: hidden;\n    width: 454px;\n  }\n      \n  .content p {\n    margin: 0px;\n    font-size: var(--nile-type-scale-2);\n    color: var(--nile-colors-neutral-700);\n    text-align: center;\n    white-space: nowrap;\n    text-overflow: ellipsis;\n    overflow: hidden;\n    width: 454px;\n  }\n\n  ::slotted(img), ::slotted(nile-icon), ::slotted(video) {\n    --nile-svg-height: 24px !important ;\n    --nile-svg-width: 24px !important ;\n    height:42px;\n    width: 42px;\n    object-fit: cover;\n  }\n\n  .browse-file-button {\n    cursor: pointer;\n  }\n\n  /*  DISABLED STATE */\n  .disable {\n    background-color: var(--nile-colors-dark-200);\n    opacity: 0.8;\n    cursor: not-allowed;\n    color: var(--nile-colors-neutral-500);\n    pointer-events: none;\n  }\n\n  /* DRAGGING */\n  .dragging {\n    background-color: var(--nile-colors-blue-100);\n    border-color: var(--nile-colors-primary-600);\n    display: flex;\n    align-items: center;\n    justify-content: flex-start;\n    gap: 18px;\n    color: var(--nile-colors-blue-700);\n    font-size: var(--nile-type-scale-3);\n    font-weight: var(--nile-font-weight-regular);\n  }\n\n  .icons-container {\n    display: flex;\n    gap: 4px;\n  }\n\n  .general-icon {\n    transform: rotate(-18.11deg);\n    position: relative;\n    bottom: 3px;\n  }\n\n  .image-icon {\n    transform: rotate(15deg);\n  }\n\n  .icon:hover {\n    cursor: pointer;\n  }\n\n  /* Uploading State */\n  .uploading {\n    width: 648px;\n    min-width: 230px;\n    display: flex;\n    justify-content: space-between;\n    align-items: center;\n    gap: 18px;\n    box-sizing: border-box;\n    border: 1px solid var(--nile-colors-neutral-400)\n  }\n  \n  .uploading:hover {\n    border-color: var(--nile-colors-neutral-400);\n  }\n\n  .progress-bar-container {\n    width: 100%;\n    display: flex;\n    flex-direction: column;\n    gap: 0px;\n  }\n\n  .progress-bar-percent {\n    width: 100%;\n    display: flex;\n    justify-content: space-between;\n    font-size: var(--nile-type-scale-2);\n    font-weight: var(--nile-font-weight-regular);\n  }\n\n  .progress-bar-container p {\n    margin: 0px;\n  }\n\n  .progress-bar-container > p {\n    font-size: var(--nile-type-scale-1);\n    color: var(--nile-colors-dark-500);\n  }\n\n  /* PREVIEW STATE */\n  .preview {\n    border: 1px solid var(--nile-colors-neutral-400);\n  }\n\n  .preview:hover {\n    border-color: var(--nile-colors-neutral-400);\n  }\n\n  .preview-inner {\n    display: flex;\n    gap: 18px;\n  }\n\n  .preview-image-container {\n    height: 42px;\n    width: 42px;\n  }\n\n  .preview-image-container img {\n    height: 42px;\n    width: 42px;\n    object-fit: contain;\n    border-radius: var(--nile-radius-radius-xs);\n    border: 1px solid var(--nile-colors-neutral-400);\n  }\n  \n  .preview-file-info {\n    width: 100%;\n    display: flex;\n    flex-direction: column;\n    justify-content: center;\n    align-items: flex-start;\n    gap: 8px;\n  }\n\n  .preview-file-info p {\n    margin: 0px;\n    font-size: var(--nile-type-scale-3);\n    font-weight: var(--nile-font-weight-regular);\n  }\n\n  .preview-file-info p:last-of-type{\n    color: var(--nile-colors-neutral-700);\n    font-size: var(--nile-type-scale-2);\n    font-weight: var(--nile-font-weight-regular);\n  }\n\n  .preview nile-icon:hover {\n    cursor: pointer;\n  }\n\n\n  /* NO PREVIEW STATE */\n  .no-preview {\n    border: 1px solid var(--nile-colors-neutral-400);\n  }\n\n  .no-preview:hover {\n    border-color: var(--nile-colors-neutral-400);\n  }\n\n  .no-preview-container {\n    display: flex;\n    gap: 18px;\n  }\n\n  .document-icon {\n    height: 40px;\n    width: 40px;\n    border-radius: var(--nile-radius-radius-xs);\n    padding: 2px 3px 2px 3px;\n    display: flex;\n    justify-content: center;\n    align-items: center;\n    border: 1px solid var(--nile-colors-blue-400);\n    background-color: var(--nile-colors-blue-100);\n  }\n\n  .document-icon nile-icon {\n    height: 40px;\n    width: 40px;\n  }\n  \n  .preview-file-info {\n    width: 100%;\n    display: flex;\n    flex-direction: column;\n    justify-content: center;\n    align-items: flex-start;\n    gap: 8px;\n  }\n\n  .preview-file-info p {\n    margin: 0px;\n    font-size: var(--nile-type-scale-3);\n    font-weight: var(--nile-font-weight-regular);\n  }\n\n  .preview-file-info p:last-of-type{\n    color: var(--nile-colors-neutral-700);\n    font-size: var(--nile-type-scale-2);\n    font-weight: var(--nile-font-weight-regular);\n  }\n\n  .no-preview > nile-icon:hover {\n    cursor: pointer;\n  }\n\n  /* ERROR STATE */\n  \n  .error {\n    border: 1px solid var(--nile-colors-neutral-400);\n  }\n\n  .error:hover {\n    border-color: var(--nile-colors-neutral-400);\n  }\n\n  .error-container {\n    width: 100%;\n    display: flex;\n    gap: 18px;\n  }\n\n  .error-icon {\n    height: 40px;\n    width: 40px;\n    border-radius: var(--nile-radius-radius-xs);\n    padding: 2px 3px 2px 3px;\n    display: flex;\n    justify-content: center;\n    align-items: center;\n    border: 1px solid var(--nile-colors-red-400);\n    background-color: var(--nile-colors-red-100);\n  }\n\n  .error-icon nile-icon {\n    height: 40px;\n    width: 40px;\n  }\n  \n  .file-info {\n    width: 100%;\n    display: flex;\n    flex-direction: column;\n    justify-content: center;\n    align-items: flex-start;\n    gap: 8px;\n  }\n\n  .file-info p {\n    margin: 0px;\n    font-size: var(--nile-type-scale-3);\n    font-weight: var(--nile-font-weight-regular);\n  }\n\n  .file-info p:last-of-type{\n    color: var(--nile-colors-red-700);\n    font-size: var(--nile-type-scale-2);\n    font-weight: var(--nile-font-weight-regular);\n  }\n\n  .error > nile-icon:hover {\n    cursor: pointer;\n  }\n\n  /* VARTICAL STATE START */\n  /* Default State */\n\n  .vertical-default {\n    display: flex;\n    flex-direction: column;\n    align-items: center;\n    justify-content: center;\n    gap: 18px\n  }\n\n  .content-container {\n    display: flex;\n    flex-direction: column;\n    justify-content: center;\n    align-items: center;\n    gap: 8px;\n  }\n\n  .content-container div.title {\n    font-size: var(--nile-type-scale-3);\n    font-weight: var(--nile-font-weight-regular);\n    color: var(--nile-colors-dark-900);\n    text-align: center;\n    white-space: nowrap;\n    text-overflow: ellipsis;\n    overflow: hidden;\n    width: 222px;\n  }\n\n  .content-container div.subtitle {\n    font-size: var(--nile-type-scale-2);\n    font-weight: var(--nile-font-weight-regular);\n    color: var(--nile-colors-dark-500);\n    text-align: center;\n    white-space: nowrap;\n    text-overflow: ellipsis;\n    overflow: hidden;\n    width: 222px;\n  }\n\n  /* Drag State */\n  .vertical-drag {\n    display: flex;\n    flex-direction: column;\n    justify-content: center;\n    align-items: center;\n    gap:18px;\n    font-size: var(--nile-type-scale-3);\n    color: var(--nile-colors-blue-700);\n    background-color: var(--nile-colors-blue-100);\n    border-color: var(--nile-colors-blue-500);\n  }\n\n  /* Uploading State */\n  .vertical-uploading {\n    display: flex;\n    flex-direction: column;\n    justify-content: flex-end;\n    align-items: center;\n    border: 1px solid var(--nile-colors-neutral-400);\n  }\n\n  .vertical-uploading:hover {\n    border-color: var(--nile-colors-neutral-400);\n  }\n\n  .loading {\n    display: flex;\n    justify-content: center;\n    align-items: center;\n  }\n\n  .corner-icon {\n    position: absolute;\n    top: 10px;\n    right: 10px;\n  }\n\n  /* Preview State */\n  .vertical-preview {\n    border: 1px solid var(--nile-colors-neutral-400);\n  }\n\n  .vertical-preview:hover {\n    border-color: var(--nile-colors-neutral-400);\n  }\n\n  .image-preview {\n    border: 1px solid var(--nile-colors-neutral-400);\n    object-fit: cover;\n    width: 80px;\n    height: 80px;\n    border-radius: var(--nile-radius-radius-xs);\n  }\n\n  /* Vertical No Preview State */\n  .vertical-no-preview {\n    border: 1px solid var(--nile-colors-neutral-400);\n  }\n\n  .vertical-no-preview:hover {\n    border-color: var(--nile-colors-neutral-400);\n  }\n\n  .vertical-document-icon {\n    height: 80px;\n    width: 80px;\n    padding: 2px 3px 2px 3px;\n    display: flex;\n    justify-content: center;\n    align-items: center;\n    border-radius: var(--nile-radius-radius-xs);\n    border: 1px solid var(--nile-colors-blue-400);\n    background-color: var(--nile-colors-blue-100);\n  }\n\n  /* Veritcal Error State */\n  .vertical-error {\n    border: 1px solid var(--nile-colors-neutral-400);\n  }\n\n  .vertical-error:hover {\n    border-color: var(--nile-colors-neutral-400);\n  }\n\n  .error-bg {\n    background-color: var(--nile-colors-red-100);\n    border: 1px solid var(--nile-colors-red-400);\n  }\n\n  .error-message {\n    display: flex;\n    flex-direction: column;\n    justify-content: center;\n    align-items: center;\n    gap: 8px;\n    margin: 0px;\n    font-size: var(--nile-type-scale-3);\n    font-weight: var(--nile-font-weight-regular);\n    text-align: start;\n  }\n\n  .error-p {\n    color: var(--nile-colors-red-700);\n    font-size: var(--nile-type-scale-2);\n    width: 216px;\n    white-space: nowrap;\n    overflow: hidden;\n    text-overflow: ellipsis;\n    text-align: center;\n  }\n\n  .error-p p {\n    white-space: nowrap;\n    overflow: hidden;\n    text-overflow: ellipsis;\n    margin: 0;\n  }\n\n\n  /* Displaing uploaded files CSS */\n  .display-files {\n    display: flex;\n    flex-direction: column;\n    justify-content: flex-start;\n    align-items: center;\n    gap: 8px;\n    width: 648px;\n    min-width: 230px;\n    max-height: 200px;\n    overflow-y: auto;\n    border: 1px solid var(--nile-colors-neutral-700);\n    border-radius: var(--nile-radius-radius-xs);\n    scrollbar-width: none;\n    padding: 12px;\n  }\n\n  ul, li {\n    width: 100%;\n  }\n\n  li {\n    list-style-type: none;\n  }\n\n  /* for the upload error messages */\n  .upload-error {\n    font-size: var(--nile-type-scale-2);\n    font-weight: var(--nile-font-weight-regular);\n    color: var(--nile-colors-red-700);\n    display: flex;\n    justify-content: flex-start;\n    align-items: center;\n    gap: var(--nile-spacing-one-half-x);\n  }\n\n  .upload-error > nile-tooltip > span {\n    color: var(--nile-colors-red-700);\n    white-space: nowrap;\n    text-align: left;\n    max-width: 560px;\n    overflow: hidden;\n    text-overflow: ellipsis;\n  }\n\n  .vertical-upload-error {\n    display: flex;\n    gap: 4px;\n  }\n\n  .vertical-upload-error > nile-tooltip > span  {\n    color: var(--nile-colors-red-700);\n    white-space: nowrap;\n    text-align: left;\n    width: 222px;\n    overflow: hidden;\n    text-overflow: ellipsis;\n    font-size: var(--nile-type-scale-2);\n    display: inline-block;\n  }\n"]))));}};});
 //# sourceMappingURL=nile-file-upload.css.cjs.js.map

package/dist/nile-file-upload/nile-file-upload.css.cjs.js.map

@@ -1 +1 @@
-{"version":3,"file":"nile-file-upload.css.cjs.js","sources":["../../../src/nile-file-upload/nile-file-upload.css.ts"],"sourcesContent":["/**\n* Copyright Aquera Inc 2023\n*\n* This source code is licensed under the BSD-3-Clause license found in the\n* LICENSE file in the root directory of this source tree.\n*/\n\nimport {css} from 'lit';\n\n/**\n * FileUpload CSS\n */\nexport const styles = css`\n  :host {\n    display: inline-block;\n  }\n\n  * {\n    padding: 0px;\n    margin: 0px;\n    box-sizing: border-box;\n  }\n\n  .wrapper {\n    display: flex;\n    flex-direction: column;\n    justify-content: center;\n    align-items: flex-start;\n    width: min-content;\n  }\n\n  input {\n    display: none;\n  }\n\n  .horizontal-div {\n    margin-bottom: 10px;\n    height: 62px;\n    max-width: 648px;\n    width: 648px;\n    min-width: 230px;\n    padding: 12px;\n    display: flex;\n    align-items: center;\n    justify-content: space-between;\n    gap: 18px;\n    border-radius: var(--nile-radius-radius-xs);\n    border: 1px dashed var(--nile-colors-neutral-500);\n    color: var(--nile-colors-dark-900);\n    background-color: var(--nile-colors-white-base);\n  }\n\n  .hover-border {\n    border-color: var(--nile-colors-primary-600);\n  }\n\n  .title {\n    font-size: var(--nile-type-scale-3);\n    font-weight: var(--nile-font-weight-regular);\n    color: var(--nile-colors-dark-900);\n    white-space: nowrap;\n    text-overflow: ellipsis;\n    overflow: hidden;\n    max-width: 454px;\n    width: 100%;\n  }\n\n  .subtitle {\n    font-size: var(--nile-type-scale-2);\n    font-weight: var(--nile-font-weight-regular);\n    color: var(--nile-colors-dark-500);\n    white-space: nowrap;\n    text-overflow: ellipsis;\n    overflow: hidden;\n    max-width: 454px;\n  }\n\n  .vertical-div {\n    min-height: 156px;\n    height: auto;\n    min-width: 240px;\n    width: 240px;\n    display: flex;\n    flex-direction: column;\n    justify-content: space-between;\n    align-items: center;\n    padding: 12px;\n    border-radius: var(--nile-radius-radius-xs);\n    color: var(--nile-colors-dark-900);\n    border: 1px dashed var(--nile-colors-neutral-500);\n    background-color: var(--nile-colors-white-base);\n    position: relative; \n  }\n\n  .vertical-div:hover {\n    border-color: var(--nile-colors-blue-500);\n  }\n\n  .outer-div-border {\n    border: 1px solid var(--nile-colors-neutral-400);\n  }\n\n  .inner-div {\n    display: flex;\n    align-items: center;\n    justify-content: flex-start;\n    gap: 18px;\n    box-sizing: border-box;\n  }\n\n  .content {\n    display: flex;  \n    flex-direction: column;\n    justify-content: center;\n    gap: 8px;\n  }\n\n  .content h4 {\n    margin: 0px;\n    font-size: var(--nile-type-scale-3);\n    font-weight: var(--nile-font-weight-regular);\n    color: var(--nile-colors-dark-900);\n    text-align: center;\n    white-space: nowrap;\n    text-overflow: ellipsis;\n    overflow: hidden;\n    width: 454px;\n  }\n      \n  .content p {\n    margin: 0px;\n    font-size: var(--nile-type-scale-2);\n    color: var(--nile-colors-neutral-700);\n    text-align: center;\n    white-space: nowrap;\n    text-overflow: ellipsis;\n    overflow: hidden;\n    width: 454px;\n  }\n\n  ::slotted(img), ::slotted(nile-icon), ::slotted(video) {\n    --nile-svg-height: 24px !important ;\n    --nile-svg-width: 24px !important ;\n    height:42px;\n    width: 42px;\n    object-fit: cover;\n  }\n\n  .browse-file-button {\n    cursor: pointer;\n  }\n\n  /*  DISABLED STATE */\n  .disable {\n    background-color: var(--nile-colors-dark-200);\n    opacity: 0.8;\n    cursor: not-allowed;\n    color: var(--nile-colors-neutral-500);\n    pointer-events: none;\n  }\n\n  /* DRAGGING */\n  .dragging {\n    background-color: var(--nile-colors-blue-100);\n    border-color: var(--nile-colors-primary-600);\n    display: flex;\n    align-items: center;\n    justify-content: flex-start;\n    gap: 18px;\n    color: var(--nile-colors-blue-700);\n    font-size: var(--nile-type-scale-3);\n    font-weight: var(--nile-font-weight-regular);\n  }\n\n  .icons-container {\n    display: flex;\n    gap: 4px;\n  }\n\n  .general-icon {\n    transform: rotate(-18.11deg);\n    position: relative;\n    bottom: 3px;\n  }\n\n  .image-icon {\n    transform: rotate(15deg);\n  }\n\n  .icon:hover {\n    cursor: pointer;\n  }\n\n  /* Uploading State */\n  .uploading {\n    width: 648px;\n    min-width: 230px;\n    display: flex;\n    justify-content: space-between;\n    align-items: center;\n    gap: 18px;\n    box-sizing: border-box;\n    border: 1px solid var(--nile-colors-neutral-400)\n  }\n  \n  .uploading:hover {\n    border-color: var(--nile-colors-neutral-400);\n  }\n\n  .progress-bar-container {\n    width: 100%;\n    display: flex;\n    flex-direction: column;\n    gap: 0px;\n  }\n\n  .progress-bar-percent {\n    width: 100%;\n    display: flex;\n    justify-content: space-between;\n    font-size: var(--nile-type-scale-2);\n    font-weight: var(--nile-font-weight-regular);\n  }\n\n  .progress-bar-container p {\n    margin: 0px;\n  }\n\n  .progress-bar-container > p {\n    font-size: var(--nile-type-scale-1);\n    color: var(--nile-colors-dark-500);\n  }\n\n  /* PREVIEW STATE */\n  .preview {\n    border: 1px solid var(--nile-colors-neutral-400);\n  }\n\n  .preview:hover {\n    border-color: var(--nile-colors-neutral-400);\n  }\n\n  .preview-inner {\n    display: flex;\n    gap: 18px;\n  }\n\n  .preview-image-container {\n    height: 42px;\n    width: 42px;\n  }\n\n  .preview-image-container img {\n    height: 42px;\n    width: 42px;\n    object-fit: contain;\n    border-radius: var(--nile-radius-radius-xs);\n    border: 1px solid var(--nile-colors-neutral-400);\n  }\n  \n  .preview-file-info {\n    width: 100%;\n    display: flex;\n    flex-direction: column;\n    justify-content: center;\n    align-items: flex-start;\n    gap: 8px;\n  }\n\n  .preview-file-info p {\n    margin: 0px;\n    font-size: var(--nile-type-scale-3);\n    font-weight: var(--nile-font-weight-regular);\n  }\n\n  .preview-file-info p:last-of-type{\n    color: var(--nile-colors-neutral-700);\n    font-size: var(--nile-type-scale-2);\n    font-weight: var(--nile-font-weight-regular);\n  }\n\n  .preview nile-icon:hover {\n    cursor: pointer;\n  }\n\n\n  /* NO PREVIEW STATE */\n  .no-preview {\n    border: 1px solid var(--nile-colors-neutral-400);\n  }\n\n  .no-preview:hover {\n    border-color: var(--nile-colors-neutral-400);\n  }\n\n  .no-preview-container {\n    display: flex;\n    gap: 18px;\n  }\n\n  .document-icon {\n    height: 40px;\n    width: 40px;\n    border-radius: var(--nile-radius-radius-xs);\n    padding: 2px 3px 2px 3px;\n    display: flex;\n    justify-content: center;\n    align-items: center;\n    border: 1px solid var(--nile-colors-blue-400);\n    background-color: var(--nile-colors-blue-100);\n  }\n\n  .document-icon nile-icon {\n    height: 40px;\n    width: 40px;\n  }\n  \n  .preview-file-info {\n    width: 100%;\n    display: flex;\n    flex-direction: column;\n    justify-content: center;\n    align-items: flex-start;\n    gap: 8px;\n  }\n\n  .preview-file-info p {\n    margin: 0px;\n    font-size: var(--nile-type-scale-3);\n    font-weight: var(--nile-font-weight-regular);\n  }\n\n  .preview-file-info p:last-of-type{\n    color: var(--nile-colors-neutral-700);\n    font-size: var(--nile-type-scale-2);\n    font-weight: var(--nile-font-weight-regular);\n  }\n\n  .no-preview > nile-icon:hover {\n    cursor: pointer;\n  }\n\n  /* ERROR STATE */\n  \n  .error {\n    border: 1px solid var(--nile-colors-neutral-400);\n  }\n\n  .error:hover {\n    border-color: var(--nile-colors-neutral-400);\n  }\n\n  .error-container {\n    width: 100%;\n    display: flex;\n    gap: 18px;\n  }\n\n  .error-icon {\n    height: 40px;\n    width: 40px;\n    border-radius: var(--nile-radius-radius-xs);\n    padding: 2px 3px 2px 3px;\n    display: flex;\n    justify-content: center;\n    align-items: center;\n    border: 1px solid var(--nile-colors-red-400);\n    background-color: var(--nile-colors-red-100);\n  }\n\n  .error-icon nile-icon {\n    height: 40px;\n    width: 40px;\n  }\n  \n  .file-info {\n    width: 100%;\n    display: flex;\n    flex-direction: column;\n    justify-content: center;\n    align-items: flex-start;\n    gap: 8px;\n  }\n\n  .file-info p {\n    margin: 0px;\n    font-size: var(--nile-type-scale-3);\n    font-weight: var(--nile-font-weight-regular);\n  }\n\n  .file-info p:last-of-type{\n    color: var(--nile-colors-red-700);\n    font-size: var(--nile-type-scale-2);\n    font-weight: var(--nile-font-weight-regular);\n  }\n\n  .error > nile-icon:hover {\n    cursor: pointer;\n  }\n\n  /* VARTICAL STATE START */\n  /* Default State */\n\n  .vertical-default {\n    display: flex;\n    flex-direction: column;\n    align-items: center;\n    justify-content: center;\n    gap: 18px\n  }\n\n  .content-container {\n    display: flex;\n    flex-direction: column;\n    justify-content: center;\n    align-items: center;\n    gap: 8px;\n  }\n\n  .content-container div.title {\n    font-size: var(--nile-type-scale-3);\n    font-weight: var(--nile-font-weight-regular);\n    color: var(--nile-colors-dark-900);\n    text-align: center;\n    white-space: nowrap;\n    text-overflow: ellipsis;\n    overflow: hidden;\n    width: 222px;\n  }\n\n  .content-container div.subtitle {\n    font-size: var(--nile-type-scale-2);\n    font-weight: var(--nile-font-weight-regular);\n    color: var(--nile-colors-dark-500);\n    text-align: center;\n    white-space: nowrap;\n    text-overflow: ellipsis;\n    overflow: hidden;\n    width: 222px;\n  }\n\n  /* Drag State */\n  .vertical-drag {\n    display: flex;\n    flex-direction: column;\n    justify-content: center;\n    align-items: center;\n    gap:18px;\n    font-size: var(--nile-type-scale-3);\n    color: var(--nile-colors-blue-700);\n    background-color: var(--nile-colors-blue-100);\n    border-color: var(--nile-colors-blue-500);\n  }\n\n  /* Uploading State */\n  .vertical-uploading {\n    display: flex;\n    flex-direction: column;\n    justify-content: flex-end;\n    align-items: center;\n    border: 1px solid var(--nile-colors-neutral-400);\n  }\n\n  .vertical-uploading:hover {\n    border-color: var(--nile-colors-neutral-400);\n  }\n\n  .loading {\n    display: flex;\n    justify-content: center;\n    align-items: center;\n  }\n\n  .corner-icon {\n    position: absolute;\n    top: 10px;\n    right: 10px;\n  }\n\n  /* Preview State */\n  .vertical-preview {\n    border: 1px solid var(--nile-colors-neutral-400);\n  }\n\n  .vertical-preview:hover {\n    border-color: var(--nile-colors-neutral-400);\n  }\n\n  .image-preview {\n    border: 1px solid var(--nile-colors-neutral-400);\n    object-fit: cover;\n    width: 80px;\n    height: 80px;\n    border-radius: var(--nile-radius-radius-xs);\n  }\n\n  /* Vertical No Preview State */\n  .vertical-no-preview {\n    border: 1px solid var(--nile-colors-neutral-400);\n  }\n\n  .vertical-no-preview:hover {\n    border-color: var(--nile-colors-neutral-400);\n  }\n\n  .vertical-document-icon {\n    height: 80px;\n    width: 80px;\n    padding: 2px 3px 2px 3px;\n    display: flex;\n    justify-content: center;\n    align-items: center;\n    border-radius: var(--nile-radius-radius-xs);\n    border: 1px solid var(--nile-colors-blue-400);\n    background-color: var(--nile-colors-blue-100);\n  }\n\n  /* Veritcal Error State */\n  .vertical-error {\n    border: 1px solid var(--nile-colors-neutral-400);\n  }\n\n  .vertical-error:hover {\n    border-color: var(--nile-colors-neutral-400);\n  }\n\n  .error-bg {\n    background-color: var(--nile-colors-red-100);\n    border: 1px solid var(--nile-colors-red-400);\n  }\n\n  .error-message {\n    display: flex;\n    flex-direction: column;\n    justify-content: center;\n    align-items: center;\n    gap: 8px;\n    margin: 0px;\n    font-size: var(--nile-type-scale-3);\n    font-weight: var(--nile-font-weight-regular);\n    text-align: start;\n  }\n\n  .error-p {\n    color: var(--nile-colors-red-700);\n    font-size: var(--nile-type-scale-2);\n    width: 216px;\n    white-space: nowrap;\n    overflow: hidden;\n    text-overflow: ellipsis;\n    text-align: center;\n  }\n\n  .error-p p {\n    white-space: nowrap;\n    overflow: hidden;\n    text-overflow: ellipsis;\n    margin: 0;\n  }\n\n\n  /* Displaing uploaded files CSS */\n  .display-files {\n    display: flex;\n    flex-direction: column;\n    justify-content: flex-start;\n    align-items: center;\n    gap: 8px;\n    width: 648px;\n    min-width: 230px;\n    max-height: 200px;\n    overflow-y: auto;\n    border: 1px solid var(--nile-colors-neutral-700);\n    border-radius: var(--nile-radius-radius-xs);\n    scrollbar-width: none;\n    padding: 12px;\n  }\n\n  ul, li {\n    width: 100%;\n  }\n\n  li {\n    list-style-type: none;\n  }\n\n  /* for the upload error messages */\n  .upload-error {\n    font-size: var(--nile-type-scale-2);\n    font-weight: var(--nile-font-weight-regular);\n    color: var(--nile-colors-red-700);\n    display: flex;\n    justify-content: flex-start;\n    align-items: center;\n    gap: var(--nile-spacing-one-half-x);\n  }\n\n  .upload-error > nile-tooltip > span {\n    color: var(--nile-colors-red-700);\n    white-space: nowrap;\n    text-align: left;\n    max-width: 538px;\n    overflow: hidden;\n    text-overflow: ellipsis;\n  }\n\n  .vertical-upload-error {\n    display: flex;\n    gap: 4px;\n  }\n\n  .vertical-upload-error > nile-tooltip > span  {\n    color: var(--nile-colors-red-700);\n    white-space: nowrap;\n    text-align: left;\n    width: 222px;\n    overflow: hidden;\n    text-overflow: ellipsis;\n    font-size: var(--nile-type-scale-2);\n    display: inline-block;\n  }\n`;\n\nexport default [styles];"],"names":["styles","css","_templateObject","_taggedTemplateLiteral"],"mappings":"oTAYaA,CAAAA,CAASC,CAAG,CAAAC,eAAA,GAAAA,eAAA,CAAAC,sBAAA"}
+{"version":3,"file":"nile-file-upload.css.cjs.js","sources":["../../../src/nile-file-upload/nile-file-upload.css.ts"],"sourcesContent":["/**\n* Copyright Aquera Inc 2023\n*\n* This source code is licensed under the BSD-3-Clause license found in the\n* LICENSE file in the root directory of this source tree.\n*/\n\nimport {css} from 'lit';\n\n/**\n * FileUpload CSS\n */\nexport const styles = css`\n  :host {\n    display: inline-block;\n  }\n\n  * {\n    padding: 0px;\n    margin: 0px;\n    box-sizing: border-box;\n  }\n\n  .wrapper {\n    display: flex;\n    flex-direction: column;\n    justify-content: center;\n    align-items: flex-start;\n    width: min-content;\n  }\n\n  input {\n    display: none;\n  }\n\n  .horizontal-div {\n    margin-bottom: 10px;\n    height: 62px;\n    max-width: 648px;\n    width: 648px;\n    min-width: 230px;\n    padding: 12px;\n    display: flex;\n    align-items: center;\n    justify-content: space-between;\n    gap: 18px;\n    border-radius: var(--nile-radius-radius-xs);\n    border: 1px dashed var(--nile-colors-neutral-500);\n    color: var(--nile-colors-dark-900);\n    background-color: var(--nile-colors-white-base);\n  }\n\n  .hover-border {\n    border-color: var(--nile-colors-primary-600);\n  }\n\n  .title {\n    font-size: var(--nile-type-scale-3);\n    font-weight: var(--nile-font-weight-regular);\n    color: var(--nile-colors-dark-900);\n    white-space: nowrap;\n    text-overflow: ellipsis;\n    overflow: hidden;\n    max-width: 454px;\n    width: 100%;\n  }\n\n  .subtitle {\n    font-size: var(--nile-type-scale-2);\n    font-weight: var(--nile-font-weight-regular);\n    color: var(--nile-colors-dark-500);\n    white-space: nowrap;\n    text-overflow: ellipsis;\n    overflow: hidden;\n    max-width: 454px;\n  }\n\n  .vertical-div {\n    min-height: 156px;\n    height: auto;\n    min-width: 240px;\n    width: 240px;\n    display: flex;\n    flex-direction: column;\n    justify-content: space-between;\n    align-items: center;\n    padding: 12px;\n    border-radius: var(--nile-radius-radius-xs);\n    color: var(--nile-colors-dark-900);\n    border: 1px dashed var(--nile-colors-neutral-500);\n    background-color: var(--nile-colors-white-base);\n    position: relative; \n  }\n\n  .vertical-div:hover {\n    border-color: var(--nile-colors-blue-500);\n  }\n\n  .outer-div-border {\n    border: 1px solid var(--nile-colors-neutral-400);\n  }\n\n  .inner-div {\n    display: flex;\n    align-items: center;\n    justify-content: flex-start;\n    gap: 18px;\n    box-sizing: border-box;\n  }\n\n  .content {\n    display: flex;  \n    flex-direction: column;\n    justify-content: center;\n    gap: 8px;\n  }\n\n  .content h4 {\n    margin: 0px;\n    font-size: var(--nile-type-scale-3);\n    font-weight: var(--nile-font-weight-regular);\n    color: var(--nile-colors-dark-900);\n    text-align: center;\n    white-space: nowrap;\n    text-overflow: ellipsis;\n    overflow: hidden;\n    width: 454px;\n  }\n      \n  .content p {\n    margin: 0px;\n    font-size: var(--nile-type-scale-2);\n    color: var(--nile-colors-neutral-700);\n    text-align: center;\n    white-space: nowrap;\n    text-overflow: ellipsis;\n    overflow: hidden;\n    width: 454px;\n  }\n\n  ::slotted(img), ::slotted(nile-icon), ::slotted(video) {\n    --nile-svg-height: 24px !important ;\n    --nile-svg-width: 24px !important ;\n    height:42px;\n    width: 42px;\n    object-fit: cover;\n  }\n\n  .browse-file-button {\n    cursor: pointer;\n  }\n\n  /*  DISABLED STATE */\n  .disable {\n    background-color: var(--nile-colors-dark-200);\n    opacity: 0.8;\n    cursor: not-allowed;\n    color: var(--nile-colors-neutral-500);\n    pointer-events: none;\n  }\n\n  /* DRAGGING */\n  .dragging {\n    background-color: var(--nile-colors-blue-100);\n    border-color: var(--nile-colors-primary-600);\n    display: flex;\n    align-items: center;\n    justify-content: flex-start;\n    gap: 18px;\n    color: var(--nile-colors-blue-700);\n    font-size: var(--nile-type-scale-3);\n    font-weight: var(--nile-font-weight-regular);\n  }\n\n  .icons-container {\n    display: flex;\n    gap: 4px;\n  }\n\n  .general-icon {\n    transform: rotate(-18.11deg);\n    position: relative;\n    bottom: 3px;\n  }\n\n  .image-icon {\n    transform: rotate(15deg);\n  }\n\n  .icon:hover {\n    cursor: pointer;\n  }\n\n  /* Uploading State */\n  .uploading {\n    width: 648px;\n    min-width: 230px;\n    display: flex;\n    justify-content: space-between;\n    align-items: center;\n    gap: 18px;\n    box-sizing: border-box;\n    border: 1px solid var(--nile-colors-neutral-400)\n  }\n  \n  .uploading:hover {\n    border-color: var(--nile-colors-neutral-400);\n  }\n\n  .progress-bar-container {\n    width: 100%;\n    display: flex;\n    flex-direction: column;\n    gap: 0px;\n  }\n\n  .progress-bar-percent {\n    width: 100%;\n    display: flex;\n    justify-content: space-between;\n    font-size: var(--nile-type-scale-2);\n    font-weight: var(--nile-font-weight-regular);\n  }\n\n  .progress-bar-container p {\n    margin: 0px;\n  }\n\n  .progress-bar-container > p {\n    font-size: var(--nile-type-scale-1);\n    color: var(--nile-colors-dark-500);\n  }\n\n  /* PREVIEW STATE */\n  .preview {\n    border: 1px solid var(--nile-colors-neutral-400);\n  }\n\n  .preview:hover {\n    border-color: var(--nile-colors-neutral-400);\n  }\n\n  .preview-inner {\n    display: flex;\n    gap: 18px;\n  }\n\n  .preview-image-container {\n    height: 42px;\n    width: 42px;\n  }\n\n  .preview-image-container img {\n    height: 42px;\n    width: 42px;\n    object-fit: contain;\n    border-radius: var(--nile-radius-radius-xs);\n    border: 1px solid var(--nile-colors-neutral-400);\n  }\n  \n  .preview-file-info {\n    width: 100%;\n    display: flex;\n    flex-direction: column;\n    justify-content: center;\n    align-items: flex-start;\n    gap: 8px;\n  }\n\n  .preview-file-info p {\n    margin: 0px;\n    font-size: var(--nile-type-scale-3);\n    font-weight: var(--nile-font-weight-regular);\n  }\n\n  .preview-file-info p:last-of-type{\n    color: var(--nile-colors-neutral-700);\n    font-size: var(--nile-type-scale-2);\n    font-weight: var(--nile-font-weight-regular);\n  }\n\n  .preview nile-icon:hover {\n    cursor: pointer;\n  }\n\n\n  /* NO PREVIEW STATE */\n  .no-preview {\n    border: 1px solid var(--nile-colors-neutral-400);\n  }\n\n  .no-preview:hover {\n    border-color: var(--nile-colors-neutral-400);\n  }\n\n  .no-preview-container {\n    display: flex;\n    gap: 18px;\n  }\n\n  .document-icon {\n    height: 40px;\n    width: 40px;\n    border-radius: var(--nile-radius-radius-xs);\n    padding: 2px 3px 2px 3px;\n    display: flex;\n    justify-content: center;\n    align-items: center;\n    border: 1px solid var(--nile-colors-blue-400);\n    background-color: var(--nile-colors-blue-100);\n  }\n\n  .document-icon nile-icon {\n    height: 40px;\n    width: 40px;\n  }\n  \n  .preview-file-info {\n    width: 100%;\n    display: flex;\n    flex-direction: column;\n    justify-content: center;\n    align-items: flex-start;\n    gap: 8px;\n  }\n\n  .preview-file-info p {\n    margin: 0px;\n    font-size: var(--nile-type-scale-3);\n    font-weight: var(--nile-font-weight-regular);\n  }\n\n  .preview-file-info p:last-of-type{\n    color: var(--nile-colors-neutral-700);\n    font-size: var(--nile-type-scale-2);\n    font-weight: var(--nile-font-weight-regular);\n  }\n\n  .no-preview > nile-icon:hover {\n    cursor: pointer;\n  }\n\n  /* ERROR STATE */\n  \n  .error {\n    border: 1px solid var(--nile-colors-neutral-400);\n  }\n\n  .error:hover {\n    border-color: var(--nile-colors-neutral-400);\n  }\n\n  .error-container {\n    width: 100%;\n    display: flex;\n    gap: 18px;\n  }\n\n  .error-icon {\n    height: 40px;\n    width: 40px;\n    border-radius: var(--nile-radius-radius-xs);\n    padding: 2px 3px 2px 3px;\n    display: flex;\n    justify-content: center;\n    align-items: center;\n    border: 1px solid var(--nile-colors-red-400);\n    background-color: var(--nile-colors-red-100);\n  }\n\n  .error-icon nile-icon {\n    height: 40px;\n    width: 40px;\n  }\n  \n  .file-info {\n    width: 100%;\n    display: flex;\n    flex-direction: column;\n    justify-content: center;\n    align-items: flex-start;\n    gap: 8px;\n  }\n\n  .file-info p {\n    margin: 0px;\n    font-size: var(--nile-type-scale-3);\n    font-weight: var(--nile-font-weight-regular);\n  }\n\n  .file-info p:last-of-type{\n    color: var(--nile-colors-red-700);\n    font-size: var(--nile-type-scale-2);\n    font-weight: var(--nile-font-weight-regular);\n  }\n\n  .error > nile-icon:hover {\n    cursor: pointer;\n  }\n\n  /* VARTICAL STATE START */\n  /* Default State */\n\n  .vertical-default {\n    display: flex;\n    flex-direction: column;\n    align-items: center;\n    justify-content: center;\n    gap: 18px\n  }\n\n  .content-container {\n    display: flex;\n    flex-direction: column;\n    justify-content: center;\n    align-items: center;\n    gap: 8px;\n  }\n\n  .content-container div.title {\n    font-size: var(--nile-type-scale-3);\n    font-weight: var(--nile-font-weight-regular);\n    color: var(--nile-colors-dark-900);\n    text-align: center;\n    white-space: nowrap;\n    text-overflow: ellipsis;\n    overflow: hidden;\n    width: 222px;\n  }\n\n  .content-container div.subtitle {\n    font-size: var(--nile-type-scale-2);\n    font-weight: var(--nile-font-weight-regular);\n    color: var(--nile-colors-dark-500);\n    text-align: center;\n    white-space: nowrap;\n    text-overflow: ellipsis;\n    overflow: hidden;\n    width: 222px;\n  }\n\n  /* Drag State */\n  .vertical-drag {\n    display: flex;\n    flex-direction: column;\n    justify-content: center;\n    align-items: center;\n    gap:18px;\n    font-size: var(--nile-type-scale-3);\n    color: var(--nile-colors-blue-700);\n    background-color: var(--nile-colors-blue-100);\n    border-color: var(--nile-colors-blue-500);\n  }\n\n  /* Uploading State */\n  .vertical-uploading {\n    display: flex;\n    flex-direction: column;\n    justify-content: flex-end;\n    align-items: center;\n    border: 1px solid var(--nile-colors-neutral-400);\n  }\n\n  .vertical-uploading:hover {\n    border-color: var(--nile-colors-neutral-400);\n  }\n\n  .loading {\n    display: flex;\n    justify-content: center;\n    align-items: center;\n  }\n\n  .corner-icon {\n    position: absolute;\n    top: 10px;\n    right: 10px;\n  }\n\n  /* Preview State */\n  .vertical-preview {\n    border: 1px solid var(--nile-colors-neutral-400);\n  }\n\n  .vertical-preview:hover {\n    border-color: var(--nile-colors-neutral-400);\n  }\n\n  .image-preview {\n    border: 1px solid var(--nile-colors-neutral-400);\n    object-fit: cover;\n    width: 80px;\n    height: 80px;\n    border-radius: var(--nile-radius-radius-xs);\n  }\n\n  /* Vertical No Preview State */\n  .vertical-no-preview {\n    border: 1px solid var(--nile-colors-neutral-400);\n  }\n\n  .vertical-no-preview:hover {\n    border-color: var(--nile-colors-neutral-400);\n  }\n\n  .vertical-document-icon {\n    height: 80px;\n    width: 80px;\n    padding: 2px 3px 2px 3px;\n    display: flex;\n    justify-content: center;\n    align-items: center;\n    border-radius: var(--nile-radius-radius-xs);\n    border: 1px solid var(--nile-colors-blue-400);\n    background-color: var(--nile-colors-blue-100);\n  }\n\n  /* Veritcal Error State */\n  .vertical-error {\n    border: 1px solid var(--nile-colors-neutral-400);\n  }\n\n  .vertical-error:hover {\n    border-color: var(--nile-colors-neutral-400);\n  }\n\n  .error-bg {\n    background-color: var(--nile-colors-red-100);\n    border: 1px solid var(--nile-colors-red-400);\n  }\n\n  .error-message {\n    display: flex;\n    flex-direction: column;\n    justify-content: center;\n    align-items: center;\n    gap: 8px;\n    margin: 0px;\n    font-size: var(--nile-type-scale-3);\n    font-weight: var(--nile-font-weight-regular);\n    text-align: start;\n  }\n\n  .error-p {\n    color: var(--nile-colors-red-700);\n    font-size: var(--nile-type-scale-2);\n    width: 216px;\n    white-space: nowrap;\n    overflow: hidden;\n    text-overflow: ellipsis;\n    text-align: center;\n  }\n\n  .error-p p {\n    white-space: nowrap;\n    overflow: hidden;\n    text-overflow: ellipsis;\n    margin: 0;\n  }\n\n\n  /* Displaing uploaded files CSS */\n  .display-files {\n    display: flex;\n    flex-direction: column;\n    justify-content: flex-start;\n    align-items: center;\n    gap: 8px;\n    width: 648px;\n    min-width: 230px;\n    max-height: 200px;\n    overflow-y: auto;\n    border: 1px solid var(--nile-colors-neutral-700);\n    border-radius: var(--nile-radius-radius-xs);\n    scrollbar-width: none;\n    padding: 12px;\n  }\n\n  ul, li {\n    width: 100%;\n  }\n\n  li {\n    list-style-type: none;\n  }\n\n  /* for the upload error messages */\n  .upload-error {\n    font-size: var(--nile-type-scale-2);\n    font-weight: var(--nile-font-weight-regular);\n    color: var(--nile-colors-red-700);\n    display: flex;\n    justify-content: flex-start;\n    align-items: center;\n    gap: var(--nile-spacing-one-half-x);\n  }\n\n  .upload-error > nile-tooltip > span {\n    color: var(--nile-colors-red-700);\n    white-space: nowrap;\n    text-align: left;\n    max-width: 560px;\n    overflow: hidden;\n    text-overflow: ellipsis;\n  }\n\n  .vertical-upload-error {\n    display: flex;\n    gap: 4px;\n  }\n\n  .vertical-upload-error > nile-tooltip > span  {\n    color: var(--nile-colors-red-700);\n    white-space: nowrap;\n    text-align: left;\n    width: 222px;\n    overflow: hidden;\n    text-overflow: ellipsis;\n    font-size: var(--nile-type-scale-2);\n    display: inline-block;\n  }\n`;\n\nexport default [styles];"],"names":["styles","css","_templateObject","_taggedTemplateLiteral"],"mappings":"oTAYaA,CAAAA,CAASC,CAAG,CAAAC,eAAA,GAAAA,eAAA,CAAAC,sBAAA"}

package/dist/nile-file-upload/nile-file-upload.css.esm.js

@@ -587,7 +587,7 @@ import{css as e}from"lit";const r=e`
     color: var(--nile-colors-red-700);
     white-space: nowrap;
     text-align: left;
-    max-width: 538px;
+    max-width: 560px;
     overflow: hidden;
     text-overflow: ellipsis;
   }

package/dist/nile-file-upload/nile-file-upload.esm.js

@@ -1,3 +1,3 @@
-import{__decorate as t}from"tslib";import{s}from"./nile-file-upload.css.esm.js";import{N as i}from"../internal/nile-element.esm.js";import{D as e}from"./utils/drag-drop.util.esm.js";import{g as h,a as r,b as a,c as o,d as l,e as p}from"./nile-file-upload.template.esm.js";import{c as n,F as d,d as u,b as m}from"./types/file-upload.enums.esm.js";import{html as c}from"lit";import{property as f,query as y,customElement as v}from"lit/decorators.js";import{s as g,a as S,b,u as j}from"./utils/file-validation.util.esm.js";import"../lit-html-39a6718c.esm.js";let w=class extends i{constructor(){super(...arguments),this.size="10MB",this.error=!1,this.errorMessage="",this.allowMultiple=!1,this.allowDuplicates=!1,this.allowedTypes=[],this.uploadedFiles=[],this.title=n.TITLE,this.subtitle=n.SUBTITLE,this.state=d.DEFAULT,this.variant=u.HORIZONTAL,this.fileUploadUrl="",this.autoUpload=!0,this.uploadRequests=new Map,this.fileSizeExceededFilesNumber=0,this.setState=t=>{this.state=t}}static get styles(){return[s]}connectedCallback(){super.connectedCallback(),this.emit(m.NILE_INIT)}firstUpdated(t){super.firstUpdated(t),this.dragHandler=new e,g(this,this.dragHandler),S(this,this.dragHandler,this.uploadRequests),b(this.dragHandler)}updated(t){super.updated(t),t.has("uploadedFiles")?(this.fileUploadUrl&&this.autoUpload&&j(this),this.emit(m.NILE_CHANGE,{files:this.uploadedFiles})):t.has("state")&&this.dragHandler.setValuesInDragHandler(this.state),t.has("autoUpload")&&this.autoUpload&&(this.fileUploadUrl&&this.autoUpload&&j(this),this.emit(m.NILE_CHANGE,{files:this.uploadedFiles}))}browseFiles(){this.emit(m.NILE_BROWSE),this.errorMessage="",this.input.click()}render(){return c`
+import{__decorate as t}from"tslib";import{s}from"./nile-file-upload.css.esm.js";import{N as i}from"../internal/nile-element.esm.js";import{D as e}from"./utils/drag-drop.util.esm.js";import{g as h,a as r,b as a,c as o,d as l,e as p}from"./nile-file-upload.template.esm.js";import{c as n,F as d,d as u,b as m}from"./types/file-upload.enums.esm.js";import{html as c}from"lit";import{property as f,query as y,customElement as v}from"lit/decorators.js";import{s as g,a as S,b,u as j}from"./utils/file-validation.util.esm.js";import"../lit-html-39a6718c.esm.js";let w=class extends i{constructor(){super(...arguments),this.size="10MB",this.error=!1,this.errorMessage="",this.allowMultiple=!1,this.allowDuplicates=!1,this.allowedTypes=[],this.uploadedFiles=[],this.title=n.TITLE,this.subtitle=n.SUBTITLE,this.state=d.DEFAULT,this.variant=u.HORIZONTAL,this.fileUploadUrl="",this.autoUpload=!0,this.uploadRequests=new Map,this.fileSizeExceededFilesNumber=0,this.isStringTruncated=!1,this.setState=t=>{this.state=t}}static get styles(){return[s]}connectedCallback(){super.connectedCallback(),this.emit(m.NILE_INIT)}firstUpdated(t){super.firstUpdated(t),this.dragHandler=new e,g(this,this.dragHandler),S(this,this.dragHandler,this.uploadRequests),b(this.dragHandler)}updated(t){super.updated(t),t.has("uploadedFiles")?(this.fileUploadUrl&&this.autoUpload&&j(this),this.emit(m.NILE_CHANGE,{files:this.uploadedFiles})):t.has("state")&&this.dragHandler.setValuesInDragHandler(this.state),t.has("autoUpload")&&this.autoUpload&&(this.fileUploadUrl&&this.autoUpload&&j(this),this.emit(m.NILE_CHANGE,{files:this.uploadedFiles}))}browseFiles(){this.emit(m.NILE_BROWSE),this.errorMessage="",this.input.click()}render(){return c`
       ${this.getState()}
-    `}getState(){return this.variant===u.HORIZONTAL?this.getHorizontalState():this.getVerticalState()}getHorizontalState(){switch(this.state){case d.DEFAULT:return h(this.browseFiles,this.title,this.subtitle,this.dragHandler,this.state,this.errorMessage,this.allowedTypes);case d.DISABLED:return a(this.browseFiles,this.title,this.subtitle,this.dragHandler,this.state,this.errorMessage,this.allowedTypes);case d.DRAG:return r();default:return h(this.browseFiles,this.title,this.subtitle,this.dragHandler,this.state,this.errorMessage,this.allowedTypes)}}getVerticalState(){switch(this.state){case d.DEFAULT:return o(this.browseFiles,this.title,this.subtitle,this.dragHandler,this.errorMessage,this.allowedTypes);case d.DISABLED:return p(this.browseFiles,this.title,this.subtitle,this.dragHandler,this.errorMessage,this.allowedTypes);case d.DRAG:return l();default:return o(this.browseFiles,this.title,this.subtitle,this.dragHandler,this.errorMessage,this.allowedTypes)}}disconnectedCallback(){this.emit(m.NILE_DESTROY)}};t([f({type:String})],w.prototype,"size",void 0),t([f({type:Boolean})],w.prototype,"error",void 0),t([f({type:String})],w.prototype,"errorMessage",void 0),t([f({type:Boolean})],w.prototype,"allowMultiple",void 0),t([f({type:Boolean})],w.prototype,"allowDuplicates",void 0),t([f({type:Array})],w.prototype,"allowedTypes",void 0),t([f({type:Array})],w.prototype,"uploadedFiles",void 0),t([f({type:String})],w.prototype,"title",void 0),t([f({type:String})],w.prototype,"subtitle",void 0),t([f({type:String})],w.prototype,"state",void 0),t([f({type:String})],w.prototype,"variant",void 0),t([f({type:String})],w.prototype,"fileUploadUrl",void 0),t([f({type:Boolean})],w.prototype,"autoUpload",void 0),t([y("input")],w.prototype,"input",void 0),w=t([v("nile-file-upload")],w);export{w as N};
+    `}getState(){return this.variant===u.HORIZONTAL?this.getHorizontalState():this.getVerticalState()}getHorizontalState(){switch(this.state){case d.DEFAULT:return h(this.browseFiles,this.title,this.subtitle,this.dragHandler,this.state,this.errorMessage,this.allowedTypes,this);case d.DISABLED:return a(this.browseFiles,this.title,this.subtitle,this.dragHandler,this.state,this.errorMessage,this.allowedTypes,this);case d.DRAG:return r();default:return h(this.browseFiles,this.title,this.subtitle,this.dragHandler,this.state,this.errorMessage,this.allowedTypes,this)}}getVerticalState(){switch(this.state){case d.DEFAULT:return o(this.browseFiles,this.title,this.subtitle,this.dragHandler,this.errorMessage,this.allowedTypes,this);case d.DISABLED:return p(this.browseFiles,this.title,this.subtitle,this.dragHandler,this.errorMessage,this.allowedTypes,this);case d.DRAG:return l();default:return o(this.browseFiles,this.title,this.subtitle,this.dragHandler,this.errorMessage,this.allowedTypes,this)}}disconnectedCallback(){this.emit(m.NILE_DESTROY)}};t([f({type:String})],w.prototype,"size",void 0),t([f({type:Boolean})],w.prototype,"error",void 0),t([f({type:String})],w.prototype,"errorMessage",void 0),t([f({type:Boolean})],w.prototype,"allowMultiple",void 0),t([f({type:Boolean})],w.prototype,"allowDuplicates",void 0),t([f({type:Array})],w.prototype,"allowedTypes",void 0),t([f({type:Array})],w.prototype,"uploadedFiles",void 0),t([f({type:String})],w.prototype,"title",void 0),t([f({type:String})],w.prototype,"subtitle",void 0),t([f({type:String})],w.prototype,"state",void 0),t([f({type:String})],w.prototype,"variant",void 0),t([f({type:String})],w.prototype,"fileUploadUrl",void 0),t([f({type:Boolean})],w.prototype,"autoUpload",void 0),t([y("input")],w.prototype,"input",void 0),w=t([v("nile-file-upload")],w);export{w as N};

package/dist/nile-file-upload/nile-file-upload.template.cjs.js

@@ -1,10 +1,10 @@
-System.register(["lit","./nile-file-upload.css.cjs.js","../lit-html-9b3af046.cjs.js","./types/file-upload.enums.cjs.js"],function(_export,_context){"use strict";var i,e,t,_templateObject,_templateObject2,_templateObject3,_templateObject4,_templateObject5,_templateObject6,_templateObject7,_templateObject8,n,s,l,o,a,r,c,d,v,p,u;function _taggedTemplateLiteral(e,t){return t||(t=e.slice(0)),Object.freeze(Object.defineProperties(e,{raw:{value:Object.freeze(t)}}));}function _createForOfIteratorHelper(r,e){var t="undefined"!=typeof Symbol&&r[Symbol.iterator]||r["@@iterator"];if(!t){if(Array.isArray(r)||(t=_unsupportedIterableToArray(r))||e&&r&&"number"==typeof r.length){t&&(r=t);var _n=0,F=function F(){};return{s:F,n:function n(){return _n>=r.length?{done:!0}:{done:!1,value:r[_n++]};},e:function e(r){throw r;},f:F};}throw new TypeError("Invalid attempt to iterate non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.");}var o,a=!0,u=!1;return{s:function s(){t=t.call(r);},n:function n(){var r=t.next();return a=r.done,r;},e:function e(r){u=!0,o=r;},f:function f(){try{a||null==t["return"]||t["return"]();}finally{if(u)throw o;}}};}function _slicedToArray(r,e){return _arrayWithHoles(r)||_iterableToArrayLimit(r,e)||_unsupportedIterableToArray(r,e)||_nonIterableRest();}function _nonIterableRest(){throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.");}function _iterableToArrayLimit(r,l){var t=null==r?null:"undefined"!=typeof Symbol&&r[Symbol.iterator]||r["@@iterator"];if(null!=t){var e,n,i,u,a=[],f=!0,o=!1;try{if(i=(t=t.call(r)).next,0===l){if(Object(t)!==t)return;f=!1;}else for(;!(f=(e=i.call(t)).done)&&(a.push(e.value),a.length!==l);f=!0);}catch(r){o=!0,n=r;}finally{try{if(!f&&null!=t["return"]&&(u=t["return"](),Object(u)!==u))return;}finally{if(o)throw n;}}return a;}}function _arrayWithHoles(r){if(Array.isArray(r))return r;}function _callSuper(t,o,e){return o=_getPrototypeOf(o),_possibleConstructorReturn(t,_isNativeReflectConstruct()?Reflect.construct(o,e||[],_getPrototypeOf(t).constructor):o.apply(t,e));}function _possibleConstructorReturn(t,e){if(e&&("object"==_typeof(e)||"function"==typeof e))return e;if(void 0!==e)throw new TypeError("Derived constructors may only return object or undefined");return _assertThisInitialized(t);}function _assertThisInitialized(e){if(void 0===e)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return e;}function _isNativeReflectConstruct(){try{var t=!Boolean.prototype.valueOf.call(Reflect.construct(Boolean,[],function(){}));}catch(t){}return(_isNativeReflectConstruct=function _isNativeReflectConstruct(){return!!t;})();}function _getPrototypeOf(t){return _getPrototypeOf=Object.setPrototypeOf?Object.getPrototypeOf.bind():function(t){return t.__proto__||Object.getPrototypeOf(t);},_getPrototypeOf(t);}function _inherits(t,e){if("function"!=typeof e&&null!==e)throw new TypeError("Super expression must either be null or a function");t.prototype=Object.create(e&&e.prototype,{constructor:{value:t,writable:!0,configurable:!0}}),Object.defineProperty(t,"prototype",{writable:!1}),e&&_setPrototypeOf(t,e);}function _setPrototypeOf(t,e){return _setPrototypeOf=Object.setPrototypeOf?Object.setPrototypeOf.bind():function(t,e){return t.__proto__=e,t;},_setPrototypeOf(t,e);}function _typeof(o){"@babel/helpers - typeof";return _typeof="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(o){return typeof o;}:function(o){return o&&"function"==typeof Symbol&&o.constructor===Symbol&&o!==Symbol.prototype?"symbol":typeof o;},_typeof(o);}function _toConsumableArray(r){return _arrayWithoutHoles(r)||_iterableToArray(r)||_unsupportedIterableToArray(r)||_nonIterableSpread();}function _nonIterableSpread(){throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.");}function _unsupportedIterableToArray(r,a){if(r){if("string"==typeof r)return _arrayLikeToArray(r,a);var t={}.toString.call(r).slice(8,-1);return"Object"===t&&r.constructor&&(t=r.constructor.name),"Map"===t||"Set"===t?Array.from(r):"Arguments"===t||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(t)?_arrayLikeToArray(r,a):void 0;}}function _iterableToArray(r){if("undefined"!=typeof Symbol&&null!=r[Symbol.iterator]||null!=r["@@iterator"])return Array.from(r);}function _arrayWithoutHoles(r){if(Array.isArray(r))return _arrayLikeToArray(r);}function _arrayLikeToArray(r,a){(null==a||a>r.length)&&(a=r.length);for(var e=0,n=Array(a);e<a;e++)n[e]=r[e];return n;}function _classCallCheck(a,n){if(!(a instanceof n))throw new TypeError("Cannot call a class as a function");}function _defineProperties(e,r){for(var t=0;t<r.length;t++){var o=r[t];o.enumerable=o.enumerable||!1,o.configurable=!0,"value"in o&&(o.writable=!0),Object.defineProperty(e,_toPropertyKey(o.key),o);}}function _createClass(e,r,t){return r&&_defineProperties(e.prototype,r),t&&_defineProperties(e,t),Object.defineProperty(e,"prototype",{writable:!1}),e;}function _toPropertyKey(t){var i=_toPrimitive(t,"string");return"symbol"==_typeof(i)?i:i+"";}function _toPrimitive(t,r){if("object"!=_typeof(t)||!t)return t;var e=t[Symbol.toPrimitive];if(void 0!==e){var i=e.call(t,r||"default");if("object"!=_typeof(i))return i;throw new TypeError("@@toPrimitive must return a primitive value.");}return("string"===r?String:Number)(t);}return{setters:[function(_lit){i=_lit.html;},function(_nileFileUploadCssCjsJs){},function(_litHtml001CjsJs){e=_litHtml001CjsJs.T;},function(_typesFileUploadEnumsCjsJs){t=_typesFileUploadEnumsCjsJs.c;}],execute:function execute(){/**
+System.register(["lit","./nile-file-upload.css.cjs.js","../lit-html-9b3af046.cjs.js","./types/file-upload.enums.cjs.js","./utils/file-validation.util.cjs.js"],function(_export,_context){"use strict";var i,e,t,s,_templateObject,_templateObject2,_templateObject3,_templateObject4,_templateObject5,_templateObject6,_templateObject7,_templateObject8,_templateObject9,_templateObject10,n,l,a,o,r,c,d,v,p,u,h;function _taggedTemplateLiteral(e,t){return t||(t=e.slice(0)),Object.freeze(Object.defineProperties(e,{raw:{value:Object.freeze(t)}}));}function _createForOfIteratorHelper(r,e){var t="undefined"!=typeof Symbol&&r[Symbol.iterator]||r["@@iterator"];if(!t){if(Array.isArray(r)||(t=_unsupportedIterableToArray(r))||e&&r&&"number"==typeof r.length){t&&(r=t);var _n=0,F=function F(){};return{s:F,n:function n(){return _n>=r.length?{done:!0}:{done:!1,value:r[_n++]};},e:function e(r){throw r;},f:F};}throw new TypeError("Invalid attempt to iterate non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.");}var o,a=!0,u=!1;return{s:function s(){t=t.call(r);},n:function n(){var r=t.next();return a=r.done,r;},e:function e(r){u=!0,o=r;},f:function f(){try{a||null==t["return"]||t["return"]();}finally{if(u)throw o;}}};}function _slicedToArray(r,e){return _arrayWithHoles(r)||_iterableToArrayLimit(r,e)||_unsupportedIterableToArray(r,e)||_nonIterableRest();}function _nonIterableRest(){throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.");}function _iterableToArrayLimit(r,l){var t=null==r?null:"undefined"!=typeof Symbol&&r[Symbol.iterator]||r["@@iterator"];if(null!=t){var e,n,i,u,a=[],f=!0,o=!1;try{if(i=(t=t.call(r)).next,0===l){if(Object(t)!==t)return;f=!1;}else for(;!(f=(e=i.call(t)).done)&&(a.push(e.value),a.length!==l);f=!0);}catch(r){o=!0,n=r;}finally{try{if(!f&&null!=t["return"]&&(u=t["return"](),Object(u)!==u))return;}finally{if(o)throw n;}}return a;}}function _arrayWithHoles(r){if(Array.isArray(r))return r;}function _callSuper(t,o,e){return o=_getPrototypeOf(o),_possibleConstructorReturn(t,_isNativeReflectConstruct()?Reflect.construct(o,e||[],_getPrototypeOf(t).constructor):o.apply(t,e));}function _possibleConstructorReturn(t,e){if(e&&("object"==_typeof(e)||"function"==typeof e))return e;if(void 0!==e)throw new TypeError("Derived constructors may only return object or undefined");return _assertThisInitialized(t);}function _assertThisInitialized(e){if(void 0===e)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return e;}function _isNativeReflectConstruct(){try{var t=!Boolean.prototype.valueOf.call(Reflect.construct(Boolean,[],function(){}));}catch(t){}return(_isNativeReflectConstruct=function _isNativeReflectConstruct(){return!!t;})();}function _getPrototypeOf(t){return _getPrototypeOf=Object.setPrototypeOf?Object.getPrototypeOf.bind():function(t){return t.__proto__||Object.getPrototypeOf(t);},_getPrototypeOf(t);}function _inherits(t,e){if("function"!=typeof e&&null!==e)throw new TypeError("Super expression must either be null or a function");t.prototype=Object.create(e&&e.prototype,{constructor:{value:t,writable:!0,configurable:!0}}),Object.defineProperty(t,"prototype",{writable:!1}),e&&_setPrototypeOf(t,e);}function _setPrototypeOf(t,e){return _setPrototypeOf=Object.setPrototypeOf?Object.setPrototypeOf.bind():function(t,e){return t.__proto__=e,t;},_setPrototypeOf(t,e);}function _typeof(o){"@babel/helpers - typeof";return _typeof="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(o){return typeof o;}:function(o){return o&&"function"==typeof Symbol&&o.constructor===Symbol&&o!==Symbol.prototype?"symbol":typeof o;},_typeof(o);}function _toConsumableArray(r){return _arrayWithoutHoles(r)||_iterableToArray(r)||_unsupportedIterableToArray(r)||_nonIterableSpread();}function _nonIterableSpread(){throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.");}function _unsupportedIterableToArray(r,a){if(r){if("string"==typeof r)return _arrayLikeToArray(r,a);var t={}.toString.call(r).slice(8,-1);return"Object"===t&&r.constructor&&(t=r.constructor.name),"Map"===t||"Set"===t?Array.from(r):"Arguments"===t||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(t)?_arrayLikeToArray(r,a):void 0;}}function _iterableToArray(r){if("undefined"!=typeof Symbol&&null!=r[Symbol.iterator]||null!=r["@@iterator"])return Array.from(r);}function _arrayWithoutHoles(r){if(Array.isArray(r))return _arrayLikeToArray(r);}function _arrayLikeToArray(r,a){(null==a||a>r.length)&&(a=r.length);for(var e=0,n=Array(a);e<a;e++)n[e]=r[e];return n;}function _classCallCheck(a,n){if(!(a instanceof n))throw new TypeError("Cannot call a class as a function");}function _defineProperties(e,r){for(var t=0;t<r.length;t++){var o=r[t];o.enumerable=o.enumerable||!1,o.configurable=!0,"value"in o&&(o.writable=!0),Object.defineProperty(e,_toPropertyKey(o.key),o);}}function _createClass(e,r,t){return r&&_defineProperties(e.prototype,r),t&&_defineProperties(e,t),Object.defineProperty(e,"prototype",{writable:!1}),e;}function _toPropertyKey(t){var i=_toPrimitive(t,"string");return"symbol"==_typeof(i)?i:i+"";}function _toPrimitive(t,r){if("object"!=_typeof(t)||!t)return t;var e=t[Symbol.toPrimitive];if(void 0!==e){var i=e.call(t,r||"default");if("object"!=_typeof(i))return i;throw new TypeError("@@toPrimitive must return a primitive value.");}return("string"===r?String:Number)(t);}return{setters:[function(_lit){i=_lit.html;},function(_nileFileUploadCssCjsJs){},function(_litHtml001CjsJs){e=_litHtml001CjsJs.T;},function(_typesFileUploadEnumsCjsJs){t=_typesFileUploadEnumsCjsJs.c;},function(_utilsFileValidationUtilCjsJs){s=_utilsFileValidationUtilCjsJs.t;}],execute:function execute(){/**
  * @license
  * Copyright 2017 Google LLC
  * SPDX-License-Identifier: BSD-3-Clause
- */n=1;s=/*#__PURE__*/function(){function s(i){_classCallCheck(this,s);}return _createClass(s,[{key:"_$AU",get:function get(){return this._$AM._$AU;}},{key:"_$AT",value:function _$AT(i,e,t){this._$Ct=i,this._$AM=e,this._$Ci=t;}},{key:"_$AS",value:function _$AS(i,e){return this.update(i,e);}},{key:"update",value:function update(i,e){return this.render.apply(this,_toConsumableArray(e));}}]);}();/**
+ */n=1;l=/*#__PURE__*/function(){function l(i){_classCallCheck(this,l);}return _createClass(l,[{key:"_$AU",get:function get(){return this._$AM._$AU;}},{key:"_$AT",value:function _$AT(i,e,t){this._$Ct=i,this._$AM=e,this._$Ci=t;}},{key:"_$AS",value:function _$AS(i,e){return this.update(i,e);}},{key:"update",value:function update(i,e){return this.render.apply(this,_toConsumableArray(e));}}]);}();/**
  * @license
  * Copyright 2018 Google LLC
  * SPDX-License-Identifier: BSD-3-Clause
- */l=function(i){return function(){for(var _len=arguments.length,e=new Array(_len),_key=0;_key<_len;_key++){e[_key]=arguments[_key];}return{_$litDirective$:i,values:e};};}(/*#__PURE__*/function(_s){function _class(i){var _i$strings;var _this;_classCallCheck(this,_class);if(_this=_callSuper(this,_class,[i]),i.type!==n||"class"!==i.name||((_i$strings=i.strings)===null||_i$strings===void 0?void 0:_i$strings.length)>2)throw Error("`classMap()` can only be used in the `class` attribute and must be the only part in the attribute.");return _this;}_inherits(_class,_s);return _createClass(_class,[{key:"render",value:function render(i){return" "+Object.keys(i).filter(function(e){return i[e];}).join(" ")+" ";}},{key:"update",value:function update(i,_ref){var _ref2=_slicedToArray(_ref,1),t=_ref2[0];if(void 0===this.st){this.st=new Set(),void 0!==i.strings&&(this.nt=new Set(i.strings.join(" ").split(/\s/).filter(function(i){return""!==i;})));for(var _i in t){var _this$nt;t[_i]&&!((_this$nt=this.nt)!==null&&_this$nt!==void 0&&_this$nt.has(_i))&&this.st.add(_i);}return this.render(t);}var n=i.element.classList;var _iterator=_createForOfIteratorHelper(this.st),_step;try{for(_iterator.s();!(_step=_iterator.n()).done;){var _i3=_step.value;_i3 in t||(n.remove(_i3),this.st["delete"](_i3));}}catch(err){_iterator.e(err);}finally{_iterator.f();}for(var _i2 in t){var _this$nt2;var _e=!!t[_i2];_e===this.st.has(_i2)||((_this$nt2=this.nt)===null||_this$nt2===void 0?void 0:_this$nt2.has(_i2))||(_e?(n.add(_i2),this.st.add(_i2)):(n.remove(_i2),this.st["delete"](_i2)));}return e;}}]);}(s)),o=function o(e,t,n,s,_o,a,r,c){return i(_templateObject||(_templateObject=_taggedTemplateLiteral(["\n  <div class=\"wrapper\" part=\"horizontal-wrapper\">\n    <div part=\"horizontal-div\" class=",">\n      <div part=\"inner-div\" class=\"inner-div\">\n        <slot class=\"upload-icon-slot\" name=\"upload-icon\">\n          <nile-icon name=\"upload\" size=\"24\"></nile-icon>\n        </slot>\n        <div part=\"content\" class=\"content\">\n          <div class=\"title\">","</div>\n          <div class=\"subtitle\">","</div>\n        </div>\n      </div>\n      <input\n        type=\"file\"\n        ?disabled=","\n        @change=","\n        multiple\n        accept=","\n      />\n      <slot class=\"browse-file-button\" @click="," name=\"browse-file-button\">\n        <nile-button variant=\"tertiary\" ?disabled=",">\n          Browse File\n        </nile-button>\n      </slot>\n    </div>\n    ","\n  </div>\n"])),l({"hover-border":"hover"===a,"horizontal-div":!0,disable:s}),t,n,s,function(i){_o.handleFiles(i);},c.join(","),s?void 0:e,s,r?i(_templateObject2||(_templateObject2=_taggedTemplateLiteral(["<div class=\"upload-error\">\n        <nile-icon name=\"warning\" size=\"12\" color=\"var(--nile-colors-red-700)\"></nile-icon>\n        <nile-tooltip content=",">\n          <span>","</span>\n        </nile-tooltip>\n      </div>"])),r,r):i(_templateObject3||(_templateObject3=_taggedTemplateLiteral([""]))));},_export("g",a=function a(i,e,t,n,s,l,_a){return o(i,e,t,!1,n,s,l,_a);}),_export("b",r=function r(i,e,t,n,s,l,a){return o(i,e,t,!0,n,s,l,a);}),_export("a",c=function c(){return i(_templateObject4||(_templateObject4=_taggedTemplateLiteral(["\n  <div part=\"horizontal-drag-state\" class=\"horizontal-div dragging\">\n    <div class=\"icons-container\">\n      <nile-icon\n        color=\"var(--nile-colors-blue-500)\"\n        name=\"general\"\n        size=\"20\"\n        class=\"general-icon\"\n      ></nile-icon>\n      <nile-icon\n        color=\"var(--nile-colors-blue-500)\"\n        name=\"image\"\n        size=\"24\"\n        class=\"image-icon\"\n      ></nile-icon>\n    </div>\n    <p>","</p>\n  </div>\n"])),t.DRAG_STATE_DEFAULT);}),d=function d(e,t,n,s,l,o,a){return i(_templateObject5||(_templateObject5=_taggedTemplateLiteral(["\n  <div part=\"vertical-wrapper\" class=\"wrapper\">\n    <div part=\"vertical-default\" class=\"vertical-default vertical-div ","\">\n      <slot name=\"upload-icon\">\n        <nile-icon name=\"upload\" size=\"24\"></nile-icon>\n      </slot>\n      <div part=\"vertical-content-container\" class=\"content-container\">\n        <div class=\"title\">","</div>\n        <div class=\"subtitle\">","</div>\n      </div>\n      <input\n        type=\"file\"\n        ?disabled=","\n        @change=","\n        multiple\n        accept=","\n      />\n      <slot @click="," name=\"browse-file-button\">\n        <nile-button variant=\"tertiary\" ?disabled=",">\n          Browse File\n        </nile-button>\n      </slot>\n    </div>\n    ","\n  </div>\n"])),s?"disable":"",t,n,s,function(i){return l.handleFiles(i);},a.join(","),s?void 0:e,s,o?i(_templateObject6||(_templateObject6=_taggedTemplateLiteral(["<div class=\"vertical-upload-error\">\n        <nile-icon name=\"warning\" size=\"12\" color=\"var(--nile-colors-red-700)\"></nile-icon>\n        <nile-tooltip content=",">\n          <span>","</span>\n        </nile-tooltip>\n      </div>"])),o,o):i(_templateObject7||(_templateObject7=_taggedTemplateLiteral([""]))));},_export("c",v=function v(i,e,t,n,s,l){return d(i,e,t,!1,n,s,l);}),_export("e",p=function p(i,e,t,n,s,l){return d(i,e,t,!0,n,s,l);}),_export("d",u=function u(){return i(_templateObject8||(_templateObject8=_taggedTemplateLiteral(["\n  <div part=\"vertical-drag-state\" class=\"vertical-div vertical-drag\">\n    <div class=\"icons-container\">\n      <nile-icon\n        color=\"var(--nile-colors-blue-500)\"\n        name=\"general\"\n        size=\"20\"\n        class=\"general-icon\"\n      ></nile-icon>\n      <nile-icon\n        color=\"var(--nile-colors-blue-500)\"\n        name=\"image\"\n        size=\"24\"\n        class=\"image-icon\"\n      ></nile-icon>\n    </div>\n    <p>","</p>\n  </div>\n"])),t.DRAG_STATE_DEFAULT);});}};});
+ */a=function(i){return function(){for(var _len=arguments.length,e=new Array(_len),_key=0;_key<_len;_key++){e[_key]=arguments[_key];}return{_$litDirective$:i,values:e};};}(/*#__PURE__*/function(_l){function _class(i){var _i$strings;var _this;_classCallCheck(this,_class);if(_this=_callSuper(this,_class,[i]),i.type!==n||"class"!==i.name||((_i$strings=i.strings)===null||_i$strings===void 0?void 0:_i$strings.length)>2)throw Error("`classMap()` can only be used in the `class` attribute and must be the only part in the attribute.");return _this;}_inherits(_class,_l);return _createClass(_class,[{key:"render",value:function render(i){return" "+Object.keys(i).filter(function(e){return i[e];}).join(" ")+" ";}},{key:"update",value:function update(i,_ref){var _ref2=_slicedToArray(_ref,1),t=_ref2[0];if(void 0===this.st){this.st=new Set(),void 0!==i.strings&&(this.nt=new Set(i.strings.join(" ").split(/\s/).filter(function(i){return""!==i;})));for(var _i in t){var _this$nt;t[_i]&&!((_this$nt=this.nt)!==null&&_this$nt!==void 0&&_this$nt.has(_i))&&this.st.add(_i);}return this.render(t);}var s=i.element.classList;var _iterator=_createForOfIteratorHelper(this.st),_step;try{for(_iterator.s();!(_step=_iterator.n()).done;){var _i3=_step.value;_i3 in t||(s.remove(_i3),this.st["delete"](_i3));}}catch(err){_iterator.e(err);}finally{_iterator.f();}for(var _i2 in t){var _this$nt2;var _e=!!t[_i2];_e===this.st.has(_i2)||((_this$nt2=this.nt)===null||_this$nt2===void 0?void 0:_this$nt2.has(_i2))||(_e?(s.add(_i2),this.st.add(_i2)):(s.remove(_i2),this.st["delete"](_i2)));}return e;}}]);}(l)),o=function o(e,t,n,l,_o,r,c,d,v){return s(v),i(_templateObject||(_templateObject=_taggedTemplateLiteral(["\n  <div class=\"wrapper\" part=\"horizontal-wrapper\">\n    <div part=\"horizontal-div\" class=",">\n      <div part=\"inner-div\" class=\"inner-div\">\n        <slot class=\"upload-icon-slot\" name=\"upload-icon\">\n          <nile-icon name=\"upload\" size=\"24\"></nile-icon>\n        </slot>\n        <div part=\"content\" class=\"content\">\n          <div class=\"title\">","</div>\n          <div class=\"subtitle\">","</div>\n        </div>\n      </div>\n      <input\n        type=\"file\"\n        ?disabled=","\n        @change=","\n        multiple\n        accept=","\n      />\n      <slot class=\"browse-file-button\" @click="," name=\"browse-file-button\">\n        <nile-button variant=\"tertiary\" ?disabled=",">\n          Browse File\n        </nile-button>\n      </slot>\n    </div>\n    ","\n  </div>\n  "])),a({"hover-border":"hover"===r,"horizontal-div":!0,disable:l}),t,n,l,function(i){_o.handleFiles(i);},d.join(","),l?void 0:e,l,c?i(_templateObject2||(_templateObject2=_taggedTemplateLiteral(["<div class=\"upload-error\">\n        <nile-icon name=\"warning\" size=\"12\" color=\"var(--nile-colors-red-700)\"></nile-icon>\n        ","\n      </div>"])),v.isStringTruncated?i(_templateObject3||(_templateObject3=_taggedTemplateLiteral(["<nile-tooltip content=",">\n                <span>","</span>\n              </nile-tooltip>"])),c,c):i(_templateObject4||(_templateObject4=_taggedTemplateLiteral(["<span>","</span>"])),c)):i(_templateObject5||(_templateObject5=_taggedTemplateLiteral([""]))));},_export("g",r=function r(i,e,t,s,n,l,a,_r){return o(i,e,t,!1,s,n,l,a,_r);}),_export("b",c=function c(i,e,t,s,n,l,a,r){return o(i,e,t,!0,s,n,l,a,r);}),_export("a",d=function d(){return i(_templateObject6||(_templateObject6=_taggedTemplateLiteral(["\n  <div part=\"horizontal-drag-state\" class=\"horizontal-div dragging\">\n    <div class=\"icons-container\">\n      <nile-icon\n        color=\"var(--nile-colors-blue-500)\"\n        name=\"general\"\n        size=\"20\"\n        class=\"general-icon\"\n      ></nile-icon>\n      <nile-icon\n        color=\"var(--nile-colors-blue-500)\"\n        name=\"image\"\n        size=\"24\"\n        class=\"image-icon\"\n      ></nile-icon>\n    </div>\n    <p>","</p>\n  </div>\n"])),t.DRAG_STATE_DEFAULT);}),v=function v(e,t,n,l,a,o,r,c){return s(c),i(_templateObject7||(_templateObject7=_taggedTemplateLiteral(["\n  <div part=\"vertical-wrapper\" class=\"wrapper\">\n    <div part=\"vertical-default\" class=\"vertical-default vertical-div ","\">\n      <slot name=\"upload-icon\">\n        <nile-icon name=\"upload\" size=\"24\"></nile-icon>\n      </slot>\n      <div part=\"vertical-content-container\" class=\"content-container\">\n        <div class=\"title\">","</div>\n        <div class=\"subtitle\">","</div>\n      </div>\n      <input\n        type=\"file\"\n        ?disabled=","\n        @change=","\n        multiple\n        accept=","\n      />\n      <slot @click="," name=\"browse-file-button\">\n        <nile-button variant=\"tertiary\" ?disabled=",">\n          Browse File\n        </nile-button>\n      </slot>\n    </div>\n    ","\n  </div>\n  "])),l?"disable":"",t,n,l,function(i){return a.handleFiles(i);},r.join(","),l?void 0:e,l,o?i(_templateObject8||(_templateObject8=_taggedTemplateLiteral(["<div class=\"vertical-upload-error\">\n        <nile-icon name=\"warning\" size=\"12\" color=\"var(--nile-colors-red-700)\"></nile-icon>\n        <nile-tooltip content=",">\n          <span>","</span>\n        </nile-tooltip>\n      </div>"])),o,o):i(_templateObject9||(_templateObject9=_taggedTemplateLiteral([""]))));},_export("c",p=function p(i,e,t,s,n,l,a){return v(i,e,t,!1,s,n,l,a);}),_export("e",u=function u(i,e,t,s,n,l,a){return v(i,e,t,!0,s,n,l,a);}),_export("d",h=function h(){return i(_templateObject10||(_templateObject10=_taggedTemplateLiteral(["\n  <div part=\"vertical-drag-state\" class=\"vertical-div vertical-drag\">\n    <div class=\"icons-container\">\n      <nile-icon\n        color=\"var(--nile-colors-blue-500)\"\n        name=\"general\"\n        size=\"20\"\n        class=\"general-icon\"\n      ></nile-icon>\n      <nile-icon\n        color=\"var(--nile-colors-blue-500)\"\n        name=\"image\"\n        size=\"24\"\n        class=\"image-icon\"\n      ></nile-icon>\n    </div>\n    <p>","</p>\n  </div>\n"])),t.DRAG_STATE_DEFAULT);});}};});
 //# sourceMappingURL=nile-file-upload.template.cjs.js.map