@digital-realty/ix-file-uploader 1.1.11 → 1.1.12

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -1,4 +1,7 @@
1
- import{__decorate}from"tslib";import{css,svg,LitElement,nothing,html}from"lit";import{property,state}from"lit/decorators.js";import{createRef,ref}from"lit/directives/ref.js";import{classMap}from"lit/directives/class-map.js";import"@digital-realty/ix-icon-button/ix-icon-button.js";let IxFileChipStyles=css`.file-chip{align-items:center;background:#f5f7ff;cursor:pointer;display:flex;flex:auto;padding:4px 8px;height:40px}.file-chip span{margin-right:10px}.delete-icon{color:var(--md-sys-color-error)}`,trash=svg`<svg viewBox="0 0 24 24"><path d="M15.5 4H19V6H5V4H8.5L9.5 3H14.5L15.5 4ZM8 21C6.9 21 6 20.1 6 19V7H18V19C18 20.1 17.1 21 16 21H8Z"/></svg>`;class IxFileChip extends LitElement{constructor(){super(...arguments),this.deletable=!0}onClick(){var e=new CustomEvent("on-file-click",{detail:{file:this.file}});this.dispatchEvent(e)}onDelete(){var e;this.deletable&&(e=new CustomEvent("on-file-delete",{detail:{file:this.file}}),this.dispatchEvent(e))}render(){var e;return html`<li class="file-chip"><span @click="${this.onClick}">${null==(e=this.file)?void 0:e.name} </span>${this.deletable?html`<ix-icon-button @click="${this.onDelete}" name="delete-button"><ix-icon slot="default" class="delete-icon">${trash}</ix-icon></ix-icon-button>`:nothing}</li>`}}IxFileChip.styles=[IxFileChipStyles],__decorate([property({type:Object})],IxFileChip.prototype,"file",void 0),__decorate([property({type:Boolean})],IxFileChip.prototype,"deletable",void 0),customElements.define("ix-file-chip",IxFileChip),(e=>{e.B="B",e.KB="KB",e.MB="MB",e.GB="GB",e.TB="TB",e.PB="PB",e.EB="EB",e.ZB="ZB",e.YB="YB"})(DataStorageUnit=DataStorageUnit||{});var DataStorageUnit,DataStorageUnit$1=DataStorageUnit;let KB=1024,MB=1024*KB,GB=1024*MB,TB=1024*GB,PB=1024*TB,EB=1024*PB,ZB=1024*EB,YB=1024*ZB,getTotalBytes=e=>{switch(e){case DataStorageUnit$1.KB:return KB;case DataStorageUnit$1.MB:return MB;case DataStorageUnit$1.GB:return GB;case DataStorageUnit$1.TB:return TB;case DataStorageUnit$1.PB:return PB;case DataStorageUnit$1.EB:return EB;case DataStorageUnit$1.ZB:return ZB;case DataStorageUnit$1.YB:return YB;default:return 0}},mimeTypeMap={"csv-application/vnd.ms-excel":"text/csv"};function mapBrowserContentTypes(e,t){return mimeTypeMap[e+"-"+t.type]?new File([t],t.name,{type:mimeTypeMap[e+"-"+t.type]}):t}let processFiles=e=>{var{currentFiles:i,extensions:l,filesToProcess:e,maxFileCount:a,maxFileSizeInBytes:o,allowDuplicates:r}=e,s=[];let n=0;for(let t of e){var p=t.name.split(".").pop()||"",d=l.includes(p.toLocaleLowerCase());if(t=mapBrowserContentTypes(p,t),d)if(t.size>o)s.push({file:t,message:"The file you are attempting to upload exceeds the maximum size allowed.",uploaded:!1,id:crypto.randomUUID()});else if(i.length+n>=a)s.push({file:t,message:`File not uploaded; it would exceed the maximum number of files (${a})`,uploaded:!1,id:crypto.randomUUID()});else{if(!r)if(i.some(e=>e.name===t.name)){p="File not uploaded; there is already a file named "+t.name;s.push({file:t,message:p,uploaded:!1,id:crypto.randomUUID()});continue}s.push({file:t,message:"File uploaded",uploaded:!0,id:crypto.randomUUID()}),n+=1}else{d=`File extension for "${t.name}" is not allowed`;s.push({file:t,message:d,uploaded:!1,id:crypto.randomUUID()})}}return s},sortFilesAscending=(e=[])=>e.sort((e,t)=>{e=e.name.toLocaleLowerCase(),t=t.name.toLocaleLowerCase();return e<t?-1:0}),IxFileUploaderStyles=css`.ix-file-uploader{display:flex;flex-direction:column;justify-content:center;min-width:320px}.dropzone{background:var(--clr-surface,#f5f7ff);border:1px dashed var(--clr-info,#2196f3);border-radius:3px;cursor:pointer;display:flex;flex-direction:column;gap:4px;padding:16px}.ix-file-uploader__label{color:var(
1
+ import{__decorate}from"tslib";import{css,svg,LitElement,nothing,html}from"lit";import{property,state}from"lit/decorators.js";import{createRef,ref}from"lit/directives/ref.js";import{classMap}from"lit/directives/class-map.js";import"@digital-realty/ix-icon-button/ix-icon-button.js";let IxFileChipStyles=css`.file-chip{align-items:center;background:#f5f7ff;cursor:pointer;display:flex;flex:auto;padding:4px 8px;height:40px}.file-chip span{margin-right:10px;font-size:var(--ix-file-chip-font-size,var(--text-small-size,1rem));line-height:var(--ix-file-chip-line-height,var(--text-small-line-height,1.3rem));letter-spacing:var(--ix-file-chip-letter-spacing,var(--text-small-letter-spacing,.15px));color:var(
2
+ --ix-file-chip-color,
3
+ var(--clr-on-surface, 'inherit')
4
+ )}.delete-icon{color:var(--md-sys-color-error)}`,trash=svg`<svg viewBox="0 0 24 24"><path d="M15.5 4H19V6H5V4H8.5L9.5 3H14.5L15.5 4ZM8 21C6.9 21 6 20.1 6 19V7H18V19C18 20.1 17.1 21 16 21H8Z"/></svg>`;class IxFileChip extends LitElement{constructor(){super(...arguments),this.deletable=!0}onClick(){var e=new CustomEvent("on-file-click",{detail:{file:this.file}});this.dispatchEvent(e)}onDelete(){var e;this.deletable&&(e=new CustomEvent("on-file-delete",{detail:{file:this.file}}),this.dispatchEvent(e))}render(){var e;return html`<li class="file-chip"><span @click="${this.onClick}">${null==(e=this.file)?void 0:e.name} </span>${this.deletable?html`<ix-icon-button @click="${this.onDelete}" name="delete-button"><ix-icon slot="default" class="delete-icon">${trash}</ix-icon></ix-icon-button>`:nothing}</li>`}}IxFileChip.styles=[IxFileChipStyles],__decorate([property({type:Object})],IxFileChip.prototype,"file",void 0),__decorate([property({type:Boolean})],IxFileChip.prototype,"deletable",void 0),customElements.define("ix-file-chip",IxFileChip),(e=>{e.B="B",e.KB="KB",e.MB="MB",e.GB="GB",e.TB="TB",e.PB="PB",e.EB="EB",e.ZB="ZB",e.YB="YB"})(DataStorageUnit=DataStorageUnit||{});var DataStorageUnit,DataStorageUnit$1=DataStorageUnit;let KB=1024,MB=1024*KB,GB=1024*MB,TB=1024*GB,PB=1024*TB,EB=1024*PB,ZB=1024*EB,YB=1024*ZB,getTotalBytes=e=>{switch(e){case DataStorageUnit$1.KB:return KB;case DataStorageUnit$1.MB:return MB;case DataStorageUnit$1.GB:return GB;case DataStorageUnit$1.TB:return TB;case DataStorageUnit$1.PB:return PB;case DataStorageUnit$1.EB:return EB;case DataStorageUnit$1.ZB:return ZB;case DataStorageUnit$1.YB:return YB;default:return 0}},mimeTypeMap={"csv-application/vnd.ms-excel":"text/csv"};function mapBrowserContentTypes(e,t){return mimeTypeMap[e+"-"+t.type]?new File([t],t.name,{type:mimeTypeMap[e+"-"+t.type]}):t}let processFiles=e=>{var{currentFiles:i,extensions:l,filesToProcess:e,maxFileCount:a,maxFileSizeInBytes:r,allowDuplicates:o}=e,s=[];let n=0;for(let t of e){var p=t.name.split(".").pop()||"",d=l.includes(p.toLocaleLowerCase());if(t=mapBrowserContentTypes(p,t),d)if(t.size>r)s.push({file:t,message:"The file you are attempting to upload exceeds the maximum size allowed.",uploaded:!1,id:crypto.randomUUID()});else if(i.length+n>=a)s.push({file:t,message:`File not uploaded; it would exceed the maximum number of files (${a})`,uploaded:!1,id:crypto.randomUUID()});else{if(!o)if(i.some(e=>e.name===t.name)){p="File not uploaded; there is already a file named "+t.name;s.push({file:t,message:p,uploaded:!1,id:crypto.randomUUID()});continue}s.push({file:t,message:"File uploaded",uploaded:!0,id:crypto.randomUUID()}),n+=1}else{d=`File extension for "${t.name}" is not allowed`;s.push({file:t,message:d,uploaded:!1,id:crypto.randomUUID()})}}return s},sortFilesAscending=(e=[])=>e.sort((e,t)=>{e=e.name.toLocaleLowerCase(),t=t.name.toLocaleLowerCase();return e<t?-1:0}),IxFileUploaderStyles=css`.ix-file-uploader{display:flex;flex-direction:column;justify-content:center;min-width:320px}.dropzone{background:var(--clr-surface,#f5f7ff);border:1px dashed var(--clr-info,#2196f3);border-radius:3px;cursor:pointer;display:flex;flex-direction:column;gap:4px;padding:16px}.ix-file-uploader__label{color:var(
2
5
  --ix-file-uploader-label-color,
3
6
  var(--clr-on-surface, 'inherit')
4
7
  );font-family:var(
@@ -7,4 +10,4 @@ import{__decorate}from"tslib";import{css,svg,LitElement,nothing,html}from"lit";i
7
10
  );font-size:var(--ix-file-uploader-label-font-size,var(--text-small-size,.75rem));font-style:normal;font-weight:var(--ix-file-uploader-label-font-weight,700);line-height:var(--ix-file-uploader-label-line-height,var(--text-small-line-height,16px));letter-spacing:var(--ix-file-uploader-label-letter-spacing,var(--text-small-letter-spacing,1.25px));text-align:center;text-transform:var(--ix-file-uploader-label-text-transform,uppercase)}.ix-file-uploader__help-text{color:var(--ix-file-uploader-help-color, var(--clr-on-surface, 'inherit'));font-family:var(
8
11
  --ix-file-uploader-help-font-family,
9
12
  var(--root-secondary-font, 'inherit')
10
- );font-size:var(--ix-file-uploader-help-font-size,var(--text-small-size,.75rem));text-align:center}.uploaded-file-list{display:flex;flex-wrap:wrap;gap:16px;list-style:none;margin:0;margin-top:32px;padding:0}.file-input{opacity:0;border-width:0;clip:rect(0,0,0,0);height:1px;margin:-1px;overflow:hidden;padding:0;white-space:nowrap;width:1px}.error .dropzone{border-color:var(--md-sys-color-error)}`;class IxFileUploader extends LitElement{constructor(){super(...arguments),this.internals=this.attachInternals(),this.dropzoneRef=createRef(),this.fileRef=createRef(),this.allowMultipleFiles=!1,this.allowDuplicates=!1,this.bodyText="",this.defaultFiles=[],this.allowDeleteDefaultFiles=!1,this.extensions=[],this.headerText="",this.maxFileCount=10,this.maxFileSizeUnit=DataStorageUnit$1.MB,this.maxFileSizeValue=10,this.name="ix-file-uploader",this.error=!1,this.files=[],this.maxFileSizeInBytes=0}get form(){return this.internals.form}onDrop(e){e.preventDefault(),e.dataTransfer&&(e=Array.from(e.dataTransfer.files),this.process(e))}onFileChange(e){e=e.currentTarget.files,e=Array.from(e);this.process(e),this.fileRef.value.files=(new DataTransfer).files}process(e){e=processFiles({currentFiles:this.files,extensions:this.extensions,filesToProcess:e,maxFileCount:this.allowMultipleFiles?this.maxFileCount:1,maxFileSizeInBytes:this.maxFileSizeInBytes,allowDuplicates:this.allowDuplicates});this.updateState(e),this.onFilesUploaded(e)}updateState(e=[]){let t=[];e.forEach(e=>{e.uploaded&&t.push(Object.assign(e.file,{id:e.id}))}),this.allowMultipleFiles?this.files=[...this.files,...t]:t.length&&(e=t[0],this.files=[e])}onFilesUploaded(e){e=new CustomEvent("on-files-uploaded",{detail:{allFiles:this.files,filesUploaded:e.filter(e=>e.uploaded),filesNotUploaded:e.filter(e=>!e.uploaded)}});this.dispatchEvent(e)}onFileClick(e){e=new CustomEvent("on-file-clicked",{detail:{allFiles:this.files,file:e.detail.file}});this.dispatchEvent(e)}onFileDelete(e){let t,i=null==(t=e.detail.file)?void 0:t.id;this.files=[...this.files].filter(e=>e.id!==i);e=new CustomEvent("on-file-removed",{detail:{allFiles:this.files,file:e.detail.file}});this.dispatchEvent(e)}openFileUploadDialog(){var e;null!=(e=this.fileRef.value)&&e.click()}firstUpdated(){this.files=[...this.defaultFiles];var e=this.dropzoneRef.value,e=(e&&(e.addEventListener("dragenter",e=>e.preventDefault()),e.addEventListener("dragover",e=>e.preventDefault()),e.addEventListener("drop",this.onDrop.bind(this))),this.fileRef.value),e=(e&&e.addEventListener("change",this.onFileChange.bind(this)),getTotalBytes(this.maxFileSizeUnit));this.maxFileSizeInBytes=this.maxFileSizeValue*e}update(e){super.update(e),e.has("defaultFiles")&&(this.files=[...this.files.filter(t=>!this.defaultFiles.some(e=>e.name===t.name)),...this.defaultFiles])}isFileDeletable(t){return!this.defaultFiles.some(e=>e.name===t.name)||this.allowDeleteDefaultFiles}renderFileList(e=[]){e=sortFilesAscending(e).map(e=>html`<ix-file-chip .file="${e}" .deletable="${this.isFileDeletable(e)}" @on-file-click="${this.onFileClick}" @on-file-delete="${this.onFileDelete}"></ix-file-chip>`);return html`<ul class="uploaded-file-list">${e}</ul>`}updated(e){let t=new FormData;this.files.forEach(e=>{t.append(this.name+"[]",e)}),this.internals.setFormValue(t)}render(){var e=this.extensions.map(e=>"."+e).join(", ");return html`<div class="${classMap({"ix-file-uploader":!0,error:this.error})}"><div class="dropzone" @click="${this.openFileUploadDialog}" @keyup="${this.openFileUploadDialog}" ${ref(this.dropzoneRef)}><div class="ix-file-uploader__label">${this.headerText}</div><div class="ix-file-uploader__help-text">${this.bodyText}</div><input accept="${e}" class="file-input" ?multiple="${this.allowMultipleFiles}" onchange="${e=>this.onFileChange(e)}" ${ref(this.fileRef)} type="file"></div>${this.files.length?this.renderFileList(this.files):nothing}</div>`}}IxFileUploader.styles=[IxFileUploaderStyles],IxFileUploader.formAssociated=!0,__decorate([property({type:Boolean})],IxFileUploader.prototype,"allowMultipleFiles",void 0),__decorate([property({type:Boolean})],IxFileUploader.prototype,"allowDuplicates",void 0),__decorate([property()],IxFileUploader.prototype,"bodyText",void 0),__decorate([property({type:Array})],IxFileUploader.prototype,"defaultFiles",void 0),__decorate([property({type:Boolean})],IxFileUploader.prototype,"allowDeleteDefaultFiles",void 0),__decorate([property({type:Array})],IxFileUploader.prototype,"extensions",void 0),__decorate([property()],IxFileUploader.prototype,"headerText",void 0),__decorate([property({type:Number})],IxFileUploader.prototype,"maxFileCount",void 0),__decorate([property()],IxFileUploader.prototype,"maxFileSizeUnit",void 0),__decorate([property({type:Number})],IxFileUploader.prototype,"maxFileSizeValue",void 0),__decorate([property()],IxFileUploader.prototype,"name",void 0),__decorate([property({type:Boolean})],IxFileUploader.prototype,"error",void 0),__decorate([state()],IxFileUploader.prototype,"files",void 0),customElements.define("ix-file-uploader",IxFileUploader);
13
+ );font-size:var(--ix-file-uploader-help-font-size,var(--text-small-size,.75rem));line-height:var(--ix-file-uploader-help-line-height,var(--text-small-line-height,16px));letter-spacing:var(--ix-file-uploader-help-letter-spacing,var(--text-small-letter-spacing,1.25px));text-align:center}.uploaded-file-list{display:flex;flex-wrap:wrap;gap:16px;list-style:none;margin:0;margin-top:32px;padding:0}.file-input{opacity:0;border-width:0;clip:rect(0,0,0,0);height:1px;margin:-1px;overflow:hidden;padding:0;white-space:nowrap;width:1px}.error .dropzone{border-color:var(--md-sys-color-error)}`;class IxFileUploader extends LitElement{constructor(){super(...arguments),this.internals=this.attachInternals(),this.dropzoneRef=createRef(),this.fileRef=createRef(),this.allowMultipleFiles=!1,this.allowDuplicates=!1,this.bodyText="",this.defaultFiles=[],this.allowDeleteDefaultFiles=!1,this.extensions=[],this.headerText="",this.maxFileCount=10,this.maxFileSizeUnit=DataStorageUnit$1.MB,this.maxFileSizeValue=10,this.name="ix-file-uploader",this.error=!1,this.files=[],this.maxFileSizeInBytes=0}get form(){return this.internals.form}onDrop(e){e.preventDefault(),e.dataTransfer&&(e=Array.from(e.dataTransfer.files),this.process(e))}onFileChange(e){e=e.currentTarget.files,e=Array.from(e);this.process(e),this.fileRef.value.files=(new DataTransfer).files}process(e){e=processFiles({currentFiles:this.files,extensions:this.extensions,filesToProcess:e,maxFileCount:this.allowMultipleFiles?this.maxFileCount:1,maxFileSizeInBytes:this.maxFileSizeInBytes,allowDuplicates:this.allowDuplicates});this.updateState(e),this.onFilesUploaded(e)}updateState(e=[]){let t=[];e.forEach(e=>{e.uploaded&&t.push(Object.assign(e.file,{id:e.id}))}),this.allowMultipleFiles?this.files=[...this.files,...t]:t.length&&(e=t[0],this.files=[e])}onFilesUploaded(e){e=new CustomEvent("on-files-uploaded",{detail:{allFiles:this.files,filesUploaded:e.filter(e=>e.uploaded),filesNotUploaded:e.filter(e=>!e.uploaded)}});this.dispatchEvent(e)}onFileClick(e){e=new CustomEvent("on-file-clicked",{detail:{allFiles:this.files,file:e.detail.file}});this.dispatchEvent(e)}onFileDelete(e){let t,i=null==(t=e.detail.file)?void 0:t.id;this.files=[...this.files].filter(e=>e.id!==i);e=new CustomEvent("on-file-removed",{detail:{allFiles:this.files,file:e.detail.file}});this.dispatchEvent(e)}openFileUploadDialog(){var e;null!=(e=this.fileRef.value)&&e.click()}firstUpdated(){this.files=[...this.defaultFiles];var e=this.dropzoneRef.value,e=(e&&(e.addEventListener("dragenter",e=>e.preventDefault()),e.addEventListener("dragover",e=>e.preventDefault()),e.addEventListener("drop",this.onDrop.bind(this))),this.fileRef.value),e=(e&&e.addEventListener("change",this.onFileChange.bind(this)),getTotalBytes(this.maxFileSizeUnit));this.maxFileSizeInBytes=this.maxFileSizeValue*e}update(e){super.update(e),e.has("defaultFiles")&&(this.files=[...this.files.filter(t=>!this.defaultFiles.some(e=>e.name===t.name)),...this.defaultFiles])}isFileDeletable(t){return!this.defaultFiles.some(e=>e.name===t.name)||this.allowDeleteDefaultFiles}renderFileList(e=[]){e=sortFilesAscending(e).map(e=>html`<ix-file-chip .file="${e}" .deletable="${this.isFileDeletable(e)}" @on-file-click="${this.onFileClick}" @on-file-delete="${this.onFileDelete}"></ix-file-chip>`);return html`<ul class="uploaded-file-list">${e}</ul>`}updated(e){let t=new FormData;this.files.forEach(e=>{t.append(this.name+"[]",e)}),this.internals.setFormValue(t)}render(){var e=this.extensions.map(e=>"."+e).join(", ");return html`<div class="${classMap({"ix-file-uploader":!0,error:this.error})}"><div class="dropzone" @click="${this.openFileUploadDialog}" @keyup="${this.openFileUploadDialog}" ${ref(this.dropzoneRef)}><div class="ix-file-uploader__label">${this.headerText}</div><div class="ix-file-uploader__help-text">${this.bodyText}</div><input accept="${e}" class="file-input" ?multiple="${this.allowMultipleFiles}" onchange="${e=>this.onFileChange(e)}" ${ref(this.fileRef)} type="file"></div>${this.files.length?this.renderFileList(this.files):nothing}</div>`}}IxFileUploader.styles=[IxFileUploaderStyles],IxFileUploader.formAssociated=!0,__decorate([property({type:Boolean})],IxFileUploader.prototype,"allowMultipleFiles",void 0),__decorate([property({type:Boolean})],IxFileUploader.prototype,"allowDuplicates",void 0),__decorate([property()],IxFileUploader.prototype,"bodyText",void 0),__decorate([property({type:Array})],IxFileUploader.prototype,"defaultFiles",void 0),__decorate([property({type:Boolean})],IxFileUploader.prototype,"allowDeleteDefaultFiles",void 0),__decorate([property({type:Array})],IxFileUploader.prototype,"extensions",void 0),__decorate([property()],IxFileUploader.prototype,"headerText",void 0),__decorate([property({type:Number})],IxFileUploader.prototype,"maxFileCount",void 0),__decorate([property()],IxFileUploader.prototype,"maxFileSizeUnit",void 0),__decorate([property({type:Number})],IxFileUploader.prototype,"maxFileSizeValue",void 0),__decorate([property()],IxFileUploader.prototype,"name",void 0),__decorate([property({type:Boolean})],IxFileUploader.prototype,"error",void 0),__decorate([state()],IxFileUploader.prototype,"files",void 0),customElements.define("ix-file-uploader",IxFileUploader);
@@ -12,6 +12,23 @@ const IxFileChipStyles = css `
12
12
 
13
13
  .file-chip span {
14
14
  margin-right: 10px;
15
+
16
+ font-size: var(
17
+ --ix-file-chip-font-size,
18
+ var(--text-small-size, 1rem)
19
+ );
20
+ line-height: var(
21
+ --ix-file-chip-line-height,
22
+ var(--text-small-line-height, 1.3rem)
23
+ );
24
+ letter-spacing: var(
25
+ --ix-file-chip-letter-spacing,
26
+ var(--text-small-letter-spacing, 0.15px)
27
+ );
28
+ color: var(
29
+ --ix-file-chip-color,
30
+ var(--clr-on-surface, 'inherit')
31
+ );
15
32
  }
16
33
 
17
34
  .delete-icon {
@@ -1 +1 @@
1
- {"version":3,"file":"ix-file-chip-styles.js","sourceRoot":"","sources":["../../src/styles/ix-file-chip-styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B,MAAM,gBAAgB,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;;;CAkB3B,CAAC;AAEF,eAAe,gBAAgB,CAAC","sourcesContent":["import { css } from 'lit';\n\nconst IxFileChipStyles = css`\n .file-chip {\n align-items: center;\n background: #f5f7ff;\n cursor: pointer;\n display: flex;\n flex: auto;\n padding: 4px 8px;\n height: 40px;\n }\n\n .file-chip span {\n margin-right: 10px;\n }\n\n .delete-icon {\n color: var(--md-sys-color-error);\n }\n`;\n\nexport default IxFileChipStyles;\n"]}
1
+ {"version":3,"file":"ix-file-chip-styles.js","sourceRoot":"","sources":["../../src/styles/ix-file-chip-styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B,MAAM,gBAAgB,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAmC3B,CAAC;AAEF,eAAe,gBAAgB,CAAC","sourcesContent":["import { css } from 'lit';\n\nconst IxFileChipStyles = css`\n .file-chip {\n align-items: center;\n background: #f5f7ff;\n cursor: pointer;\n display: flex;\n flex: auto;\n padding: 4px 8px;\n height: 40px;\n }\n\n .file-chip span {\n margin-right: 10px;\n\n font-size: var(\n --ix-file-chip-font-size,\n var(--text-small-size, 1rem)\n );\n line-height: var(\n --ix-file-chip-line-height,\n var(--text-small-line-height, 1.3rem)\n );\n letter-spacing: var(\n --ix-file-chip-letter-spacing,\n var(--text-small-letter-spacing, 0.15px)\n );\n color: var(\n --ix-file-chip-color,\n var(--clr-on-surface, 'inherit')\n );\n }\n\n .delete-icon {\n color: var(--md-sys-color-error);\n }\n`;\n\nexport default IxFileChipStyles;\n"]}
@@ -52,6 +52,14 @@ const IxFileUploaderStyles = css `
52
52
  --ix-file-uploader-help-font-size,
53
53
  var(--text-small-size, 0.75rem)
54
54
  );
55
+ line-height: var(
56
+ --ix-file-uploader-help-line-height,
57
+ var(--text-small-line-height, 16px)
58
+ );
59
+ letter-spacing: var(
60
+ --ix-file-uploader-help-letter-spacing,
61
+ var(--text-small-letter-spacing, 1.25px)
62
+ );
55
63
  text-align: center;
56
64
  }
57
65
  .uploaded-file-list {
@@ -1 +1 @@
1
- {"version":3,"file":"ix-file-uploader-styles.js","sourceRoot":"","sources":["../../src/styles/ix-file-uploader-styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B,MAAM,oBAAoB,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAsF/B,CAAC;AAEF,eAAe,oBAAoB,CAAC","sourcesContent":["import { css } from 'lit';\n\nconst IxFileUploaderStyles = css`\n .ix-file-uploader {\n display: flex;\n flex-direction: column;\n justify-content: center;\n min-width: 320px;\n }\n .dropzone {\n background: var(--clr-surface, #f5f7ff);\n border: 1px dashed var(--clr-info, #2196f3);\n border-radius: 3px;\n cursor: pointer;\n display: flex;\n flex-direction: column;\n gap: 4px;\n padding: 16px;\n }\n .ix-file-uploader__label {\n color: var(\n --ix-file-uploader-label-color,\n var(--clr-on-surface, 'inherit')\n );\n font-family: var(\n --ix-file-uploader-label-font-family,\n var(--root-secondary-font, 'inherit')\n );\n font-size: var(\n --ix-file-uploader-label-font-size,\n var(--text-small-size, 0.75rem)\n );\n font-style: normal;\n font-weight: var(--ix-file-uploader-label-font-weight, 700);\n line-height: var(\n --ix-file-uploader-label-line-height,\n var(--text-small-line-height, 16px)\n );\n letter-spacing: var(\n --ix-file-uploader-label-letter-spacing,\n var(--text-small-letter-spacing, 1.25px)\n );\n text-align: center;\n text-transform: var(--ix-file-uploader-label-text-transform, uppercase);\n }\n .ix-file-uploader__help-text {\n color: var(--ix-file-uploader-help-color, var(--clr-on-surface, 'inherit'));\n font-family: var(\n --ix-file-uploader-help-font-family,\n var(--root-secondary-font, 'inherit')\n );\n font-size: var(\n --ix-file-uploader-help-font-size,\n var(--text-small-size, 0.75rem)\n );\n text-align: center;\n }\n .uploaded-file-list {\n display: flex;\n flex-wrap: wrap;\n gap: 16px;\n list-style: none;\n margin: 0;\n margin-top: 32px;\n padding: 0;\n }\n .file-input {\n /*\n Per MDN -> https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input/file\n \"Note: opacity is used to hide the file input instead of visibility: hidden or display: none, because assistive technology interprets the latter two styles to mean the file input isn't interactive.\"\n */\n opacity: 0;\n\n /*\n Adapted styles from https://tailwindcss.com/docs/screen-readers\n */\n border-width: 0;\n clip: rect(0, 0, 0, 0);\n height: 1px;\n margin: -1px;\n overflow: hidden;\n padding: 0;\n white-space: nowrap;\n width: 1px;\n }\n .error .dropzone {\n border-color: var(--md-sys-color-error);\n }\n`;\n\nexport default IxFileUploaderStyles;\n"]}
1
+ {"version":3,"file":"ix-file-uploader-styles.js","sourceRoot":"","sources":["../../src/styles/ix-file-uploader-styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B,MAAM,oBAAoB,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA8F/B,CAAC;AAEF,eAAe,oBAAoB,CAAC","sourcesContent":["import { css } from 'lit';\n\nconst IxFileUploaderStyles = css`\n .ix-file-uploader {\n display: flex;\n flex-direction: column;\n justify-content: center;\n min-width: 320px;\n }\n .dropzone {\n background: var(--clr-surface, #f5f7ff);\n border: 1px dashed var(--clr-info, #2196f3);\n border-radius: 3px;\n cursor: pointer;\n display: flex;\n flex-direction: column;\n gap: 4px;\n padding: 16px;\n }\n .ix-file-uploader__label {\n color: var(\n --ix-file-uploader-label-color,\n var(--clr-on-surface, 'inherit')\n );\n font-family: var(\n --ix-file-uploader-label-font-family,\n var(--root-secondary-font, 'inherit')\n );\n font-size: var(\n --ix-file-uploader-label-font-size,\n var(--text-small-size, 0.75rem)\n );\n font-style: normal;\n font-weight: var(--ix-file-uploader-label-font-weight, 700);\n line-height: var(\n --ix-file-uploader-label-line-height,\n var(--text-small-line-height, 16px)\n );\n letter-spacing: var(\n --ix-file-uploader-label-letter-spacing,\n var(--text-small-letter-spacing, 1.25px)\n );\n text-align: center;\n text-transform: var(--ix-file-uploader-label-text-transform, uppercase);\n }\n .ix-file-uploader__help-text {\n color: var(--ix-file-uploader-help-color, var(--clr-on-surface, 'inherit'));\n font-family: var(\n --ix-file-uploader-help-font-family,\n var(--root-secondary-font, 'inherit')\n );\n font-size: var(\n --ix-file-uploader-help-font-size,\n var(--text-small-size, 0.75rem)\n );\n line-height: var(\n --ix-file-uploader-help-line-height,\n var(--text-small-line-height, 16px)\n );\n letter-spacing: var(\n --ix-file-uploader-help-letter-spacing,\n var(--text-small-letter-spacing, 1.25px)\n );\n text-align: center;\n }\n .uploaded-file-list {\n display: flex;\n flex-wrap: wrap;\n gap: 16px;\n list-style: none;\n margin: 0;\n margin-top: 32px;\n padding: 0;\n }\n .file-input {\n /*\n Per MDN -> https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input/file\n \"Note: opacity is used to hide the file input instead of visibility: hidden or display: none, because assistive technology interprets the latter two styles to mean the file input isn't interactive.\"\n */\n opacity: 0;\n\n /*\n Adapted styles from https://tailwindcss.com/docs/screen-readers\n */\n border-width: 0;\n clip: rect(0, 0, 0, 0);\n height: 1px;\n margin: -1px;\n overflow: hidden;\n padding: 0;\n white-space: nowrap;\n width: 1px;\n }\n .error .dropzone {\n border-color: var(--md-sys-color-error);\n }\n`;\n\nexport default IxFileUploaderStyles;\n"]}
package/package.json CHANGED
@@ -3,7 +3,7 @@
3
3
  "description": "Webcomponent ix-file-uploader following open-wc recommendations",
4
4
  "license": "MIT",
5
5
  "author": "Digital Realty",
6
- "version": "1.1.11",
6
+ "version": "1.1.12",
7
7
  "type": "module",
8
8
  "main": "dist/index.js",
9
9
  "module": "dist/index.js",
@@ -113,5 +113,5 @@
113
113
  "README.md",
114
114
  "LICENSE"
115
115
  ],
116
- "gitHead": "167e93ca09136e196f646005fbdba45a9a3a7f0b"
116
+ "gitHead": "c656968f99c9e2120d957e1a0002da48b0f4a953"
117
117
  }