npm - @limetech/lime-elements - Versions diffs - 37.1.0-next.55 → 37.1.0-next.57 - Mend

@limetech/lime-elements 37.1.0-next.55 → 37.1.0-next.57

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.

Files changed (175) hide show

package/dist/cjs/limel-file-viewer.cjs.entry.js CHANGED Viewed

@@ -123,33 +123,37 @@ const FileViewer = class {
     this.renderPdf = () => {
       return [
         index.h("div", { class: "action-menu-for-pdf-files" }, this.renderActionMenu()),
-        index.h("object", { data: this.url, type: "application/pdf" }),
+        index.h("iframe", { src: this.fileUrl }),
       ];
     };
     this.renderImage = () => {
-      return [this.renderButtons(), index.h("img", { src: this.url, alt: this.alt })];
+      return [
+        this.renderButtons(),
+        index.h("img", { src: this.fileUrl, alt: this.alt }),
+      ];
     };
     this.renderVideo = () => {
-      return (index.h("video", { controls: true }, index.h("source", { src: this.url })));
+      return (index.h("video", { controls: true }, index.h("source", { src: this.fileUrl })));
     };
     this.renderAudio = () => {
-      return (index.h("audio", { controls: true }, index.h("source", { src: this.url })));
+      return (index.h("audio", { controls: true }, index.h("source", { src: this.fileUrl })));
     };
     this.renderText = () => {
       return [
         this.renderButtons(),
-        index.h("object", { data: this.url, type: "text/plain" }),
+        index.h("object", { data: this.fileUrl, type: "text/plain" }),
       ];
     };
     this.renderOffice = () => {
       return [
         index.h("div", { class: "action-menu-for-office-files" }, this.renderActionMenu()),
-        index.h("iframe", { src: this.getOfficeViewerUrl() + this.url + '&embedded=true', frameborder: "0" }),
+        index.h("iframe", { src: this.getOfficeViewerUrl() + this.fileUrl + '&embedded=true', frameborder: "0" }),
       ];
     };
     this.isOfficeFileAccessibleViaURL = () => {
       return (this.fileType === 'office' &&
-        !(this.url.startsWith('http://') || this.url.startsWith('https://')));
+        !(this.fileUrl.startsWith('http://') ||
+          this.fileUrl.startsWith('https://')));
     };
     this.getOfficeViewerUrl = () => {
       const officeViewers = {
@@ -182,13 +186,13 @@ const FileViewer = class {
       if (!this.allowDownload || this.isFullscreen) {
         return;
       }
-      return (index.h("a", { class: "button--download", id: "tooltip-download", role: "button", download: this.filename ? this.filename : '', href: this.url, target: "_blank" }, index.h("limel-icon", { name: "download_2" }), index.h("limel-tooltip", { label: this.getTranslation('download'), elementId: "tooltip-download", openDirection: "left" })));
+      return (index.h("a", { class: "button--download", id: "tooltip-download", role: "button", download: this.filename ? this.filename : '', href: this.fileUrl, target: "_blank" }, index.h("limel-icon", { name: "download_2" }), index.h("limel-tooltip", { label: this.getTranslation('download'), elementId: "tooltip-download", openDirection: "left" })));
     };
     this.renderOpenInNewTabButton = () => {
       if (!this.allowOpenInNewTab || this.isFullscreen) {
         return;
       }
-      return (index.h("a", { class: "button--new-tab", id: "tooltip-new-tab", role: "button", href: this.url, target: "_blank", rel: "noopener noreferrer" }, index.h("limel-icon", { name: "external_link" }), index.h("limel-tooltip", { label: this.getTranslation('open-in-new-tab'), elementId: "tooltip-new-tab", openDirection: "left" })));
+      return (index.h("a", { class: "button--new-tab", id: "tooltip-new-tab", role: "button", href: this.fileUrl, target: "_blank", rel: "noopener noreferrer" }, index.h("limel-icon", { name: "external_link" }), index.h("limel-tooltip", { label: this.getTranslation('open-in-new-tab'), elementId: "tooltip-new-tab", openDirection: "left" })));
     };
     this.renderActionMenu = () => {
       if (!this.actions || this.isFullscreen) {
@@ -196,6 +200,17 @@ const FileViewer = class {
       }
       return (index.h("limel-menu", { class: "action-menu", items: this.actions, onSelect: this.emitOnAction, "open-direction": "left" }, index.h("button", { class: "button--action", id: "tooltip-more", role: "button", slot: "trigger" }, index.h("limel-icon", { name: "menu_2" }), index.h("limel-tooltip", { label: this.getTranslation('more-actions'), elementId: "tooltip-more", openDirection: "left" }))));
     };
+    this.createURL = async (fileType) => {
+      if (['pdf'].includes(fileType)) {
+        const response = await fetch(this.url);
+        const blob = await response.blob();
+        this.fileUrl = URL.createObjectURL(blob);
+      }
+      else {
+        this.fileUrl = this.url;
+      }
+      this.loading = false;
+    };
     this.handleToggleFullscreen = () => {
       if (this.fullscreen.isSupported()) {
         this.fullscreen.toggle();
@@ -217,20 +232,30 @@ const FileViewer = class {
     this.actions = undefined;
     this.isFullscreen = false;
     this.fileType = undefined;
+    this.loading = true;
+    this.fileUrl = '';
     this.fullscreen = new Fullscreen(this.HostElement);
+  }
+  async componentWillLoad() {
     this.fileType = detectExtension(this.filename, this.url);
+    await this.createURL(this.url);
   }
   render() {
     if (!this.isOfficeFileAccessibleViaURL) {
       return this.renderNoFileSupportMessage();
     }
+    if (this.loading) {
+      return index.h("limel-spinner", { size: "x-small", limeBranded: false });
+    }
     return this.renderFileViewer();
   }
-  watchUrl(newUrl, oldUrl) {
+  async watchUrl(newUrl, oldUrl) {
     if (newUrl === oldUrl) {
       return;
     }
-    this.fileType = detectExtension(this.filename, this.url);
+    this.loading = true;
+    this.fileType = detectExtension(this.filename, this.fileUrl);
+    await this.createURL(this.fileType);
   }
   renderFileViewer() {
     const fileViewerFunctions = {

package/dist/cjs/limel-file-viewer.cjs.entry.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"file":"limel-file-viewer.entry.cjs.js","mappings":"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","names":["h","translate"],"sources":["./src/components/file-viewer/extension-mapping.tsx","./src/components/file-viewer/fullscreen.ts","./src/components/file-viewer/file-viewer.scss?tag=limel-file-viewer&encapsulation=shadow","./src/components/file-viewer/file-viewer.tsx"],"sourcesContent":["export function detectExtension(fileName, url): any {\n const pathLike = fileName \|\| url;\n if (!pathLike) {\n return 'unknown';\n }\n\n const extension = pathLike.split('.').pop().toLowerCase();\n const extensionsToTypes = {\n pdf: 'pdf',\n jpg: 'image',\n jpeg: 'image',\n heic: 'image',\n bmp: 'image',\n png: 'image',\n gif: 'image',\n svg: 'image',\n svgz: 'image',\n ep: 'image',\n eps: 'image',\n avi: 'video',\n flv: 'video',\n h264: 'video',\n mov: 'video',\n mp4: 'video',\n mwv: 'video',\n mkv: 'video',\n mp3: 'audio',\n wav: 'audio',\n wma: 'audio',\n ogg: 'audio',\n txt: 'text',\n json: 'text',\n html: 'text',\n xml: 'text',\n // Word\n doc: 'office',\n docx: 'office',\n odt: 'office',\n dot: 'office',\n dotx: 'office',\n docm: 'office', // not supported\n dotm: 'office', // not yet tested\n // Presentation\n pot: 'office', // not tested\n ppt: 'office',\n pptx: 'office',\n odp: 'office',\n potx: 'office', // not supported\n potm: 'office', // not supported\n pps: 'office',\n ppsx: 'office',\n ppsm: 'office', // not supported\n pptm: 'office', // not supported\n ppam: 'office', // not tested\n pages: 'office', // not supported (Apple)\n // Spreadsheet\n xls: 'office',\n xlsx: 'office',\n xlsm: 'office',\n xlsb: 'office',\n ods: 'office',\n csv: 'office', // not supported\n numbers: 'office', // not supported (Apple)\n };\n\n return extensionsToTypes[extension] \|\| 'unknown';\n}\n","export class Fullscreen {\n private enter: () => void;\n private exit: () => void;\n\n constructor(element: any) {\n this.enter =\n element.requestFullscreen \|\|\n element.msRequestFullscreen \|\|\n element.mozRequestFullScreen \|\|\n element.webkitRequestFullscreen;\n this.enter = this.enter.bind(element);\n const doc: any = window.document;\n this.exit =\n doc.exitFullscreen \|\|\n doc.msExitFullscreen \|\|\n doc.mozCancelFullScreen \|\|\n doc.webkitExitFullscreen;\n }\n\n public requestFullscreen = () => {\n if (this.enter) {\n this.enter();\n }\n };\n\n public exitFullscreen = () => {\n if (this.exit) {\n this.exit.bind(window.document)();\n }\n };\n\n public toggle = () => {\n const doc: any = window.document;\n const isFullscreen =\n doc.fullscreenElement \|\|\n doc.mozFullScreenElement \|\|\n doc.webkitFullscreenElement \|\|\n doc.msFullscreenElement;\n\n if (isFullscreen) {\n this.exitFullscreen();\n } else {\n this.requestFullscreen();\n }\n };\n\n public isSupported(): boolean {\n return !!this.requestFullscreen;\n }\n}\n","@use '../../style/internal/variables';\n@use '../../style/internal/shared_input-select-picker';\n@use '../../style/mixins';\n\n$size-of-buttons: 2rem;\n\n:host {\n isolation: isolate;\n position: relative;\n box-sizing: border-box;\n display: flex;\n align-items: center;\n justify-content: center;\n width: 100%;\n height: 100%;\n}\n\n* {\n box-sizing: border-box;\n}\n\nimg,\nvideo,\naudio,\nobject,\niframe {\n max-height: 100%;\n max-width: 100%;\n box-sizing: border-box;\n}\n\niframe {\n border: none;\n width: 100%;\n height: 100%;\n min-height: 20rem; // makes sure to get minimum comfortable space for viewing office files, and Microsoft Office viewers toolbars\n}\n\nimg {\n min-width: 7rem;\n object-fit: contain; // increases or decreases the size of the image to fill the box whilst preserving its aspect-ratio.\n}\n\nvideo {\n width: 100%;\n height: auto;\n}\n\naudio {\n width: 100%;\n}\n\nobject {\n width: 100%;\n height: 100%;\n}\n\nobject[type='application/pdf'] {\n min-height: 20rem;\n // makes sure to get browsers' native controls for the PDF\n}\n\nobject[type='text/plain'] {\n border-radius: 0.25rem;\n padding-right: $size-of-buttons;\n\n overflow-y: auto;\n}\n\n@mixin plain-text-in-fullscreen {\n background-color: rgb(var(--color-gray-darker));\n\n object[type='text/plain'] {\n max-width: 50rem;\n max-height: calc(100% - 2rem);\n }\n}\n\n:host(:fullscreen) {\n @include plain-text-in-fullscreen;\n}\n:host(:-webkit-full-screen) {\n // this is repetition of the previous block,\n // but needed for Safari to work.\n // Cannot write SCSS rules for `:host` using commas for some reason.\n // e.g.: `:host(:fullscreen), :host(:-webkit-full-screen)`.\n // So you have to repeat it sadly.\n @include plain-text-in-fullscreen;\n}\n\n@import './partial-styles/ui-controls.scss';\n","import {\n Component,\n Element,\n h,\n Prop,\n State,\n Event,\n EventEmitter,\n Watch,\n} from '@stencil/core';\nimport { Languages, ListItem } from '@limetech/lime-elements';\nimport translate from '../../global/translations';\nimport { detectExtension } from './extension-mapping';\nimport { Fullscreen } from './fullscreen';\nimport { FileType, OfficeViewer } from './file-viewer.types';\n\n/*\n This is a smart component that automatically detects\n * the most common file types such as image, audio, video, and text,\n * and properly displays them in the browser.\n * The component is also capable to render the most common office files.\n \n :::note\n * Image files will always be contained in their containers, which means\n * they automatically increase or decrease in size to fill their containing box\n * whilst preserving their aspect-ratio.\n \n Text and PDF files will also always respect the width and height of the\n * container in which the `limel-file-viewer` is loaded.\n * :::\n \n For some file types such as text and images, the component will display a\n * download button and a button to open the file in a new browser tab.\n * This will allow users to preview the file in a fullscreen mode with the\n * browser and take advantage of for example native zooming and panning\n * functionalities.\n * @exampleComponent limel-example-file-viewer\n * @exampleComponent limel-example-file-viewer-office\n * @exampleComponent limel-example-file-viewer-filename\n * @exampleComponent limel-example-file-viewer-inbuilt-actions\n * @exampleComponent limel-example-file-viewer-custom-actions\n * @exampleComponent limel-example-file-viewer-with-picker\n * @private\n /\n\n@Component({\n tag: 'limel-file-viewer',\n shadow: true,\n styleUrl: 'file-viewer.scss',\n})\nexport class FileViewer {\n /\n Link to the file\n /\n @Prop({ reflect: true })\n public url: string;\n\n /\n The name of the file that must also contains its extension.\n * This overrides the filename that the `url` ends with.\n * Useful when the `url` does not contain the filename.\n * When specified, the `filename` will be used as filename of\n * the downloaded file.\n /\n @Prop({ reflect: true })\n public filename?: string;\n\n /\n An optional alternative text, mainly for assistive technologies and screen readers.\n * It is used for only image files, as an `alt` attribute.\n * Should optimally hold a description of the image,\n * which is also displayed on the page if the image can't be loaded for some reason.\n /\n @Prop({ reflect: true })\n public alt?: string;\n\n /\n Displays a button that allows the user to view the file\n * in fullscreen mode.\n * Not displayed for office files!\n /\n @Prop({ reflect: true })\n public allowFullscreen?: boolean = false;\n\n /\n Displays a button that allows the user to open the file\n * in a new browser tab.\n * Not displayed for office files!\n /\n @Prop({ reflect: true })\n public allowOpenInNewTab?: boolean = false;\n\n /\n Displays a button that allows the user to download the file.\n * Note that due to the browser's security policies,\n * the file should be hosted on the same domain\n * for the download button to work properly.\n * Not displayed for office files!\n /\n @Prop({ reflect: true })\n public allowDownload?: boolean = false;\n\n /\n Defines the localization for translations.\n /\n @Prop()\n public language: Languages = 'en';\n\n /\n Defines the third-party viewer that should be used to render\n * the content of office files, such as word processing documents,\n * presentations, or spreadsheets.\n /\n @Prop({ reflect: true })\n public officeViewer: OfficeViewer = 'microsoft-office';\n\n /\n An array of custom actions that can be displayed\n * as an action menu on the file which is being displayed.\n /\n @Prop()\n public actions: ListItem[];\n\n /\n Emitted when a custom action is selected from the action menu.\n */\n @Event()\n public action: EventEmitter<ListItem>;\n\n @Element()\n public HostElement: HTMLLimelFileViewerElement;\n\n private fullscreen: Fullscreen;\n\n @State()\n private isFullscreen: boolean = false;\n\n @State()\n public fileType: FileType;\n\n constructor() {\n this.fullscreen = new Fullscreen(this.HostElement);\n this.fileType = detectExtension(this.filename, this.url);\n }\n\n public render() {\n if (!this.isOfficeFileAccessibleViaURL) {\n return this.renderNoFileSupportMessage();\n }\n\n return this.renderFileViewer();\n }\n\n @Watch('url')\n protected watchUrl(newUrl: string, oldUrl: string) {\n if (newUrl === oldUrl) {\n return;\n }\n\n this.fileType = detectExtension(this.filename, this.url);\n }\n\n private renderFileViewer() {\n const fileViewerFunctions = {\n pdf: this.renderPdf,\n image: this.renderImage,\n video: this.renderVideo,\n audio: this.renderAudio,\n text: this.renderText,\n office: this.renderOffice,\n };\n const fileViewerFunction =\n fileViewerFunctions[this.fileType] \|\|\n this.renderNoFileSupportMessage;\n\n return fileViewerFunction();\n }\n\n private renderPdf = () => {\n return [\n <div class=\"action-menu-for-pdf-files\">\n {this.renderActionMenu()}\n </div>,\n <object data={this.url} type=\"application/pdf\" />,\n ];\n };\n\n private renderImage = () => {\n return [this.renderButtons(), <img src={this.url} alt={this.alt} />];\n };\n\n private renderVideo = () => {\n return (\n <video controls>\n <source src={this.url} />\n </video>\n );\n };\n\n private renderAudio = () => {\n return (\n <audio controls>\n <source src={this.url} />\n </audio>\n );\n };\n\n private renderText = () => {\n return [\n this.renderButtons(),\n <object data={this.url} type=\"text/plain\" />,\n ];\n };\n\n private renderOffice = () => {\n return [\n <div class=\"action-menu-for-office-files\">\n {this.renderActionMenu()}\n </div>,\n <iframe\n src={this.getOfficeViewerUrl() + this.url + '&embedded=true'}\n frameborder=\"0\"\n />,\n ];\n };\n\n private isOfficeFileAccessibleViaURL = () => {\n return (\n this.fileType === 'office' &&\n !(this.url.startsWith('http://') \|\| this.url.startsWith('https://'))\n );\n };\n\n private getOfficeViewerUrl = () => {\n const officeViewers = {\n 'microsoft-office':\n 'https://view.officeapps.live.com/op/embed.aspx?src=',\n 'google-drive': 'https://docs.google.com/gview?url=',\n };\n\n return officeViewers[this.officeViewer];\n };\n\n private renderNoFileSupportMessage = () => {\n return (\n <div class=\"no-support\">\n <limel-icon\n class=\"icon--warning\"\n name=\"brake_warning\"\n size=\"large\"\n role=\"presentation\"\n />\n <p>{this.getTranslation('message.unsupported-filetype')}</p>\n {this.renderDownloadButton()}\n </div>\n );\n };\n\n private renderButtons = () => {\n return (\n <div class=\"buttons\">\n {this.renderActionMenu()}\n {this.renderToggleFullscreenButton()}\n {this.renderDownloadButton()}\n {this.renderOpenInNewTabButton()}\n </div>\n );\n };\n\n private renderToggleFullscreenButton = () => {\n if (!this.allowFullscreen \|\| !this.fullscreen.isSupported()) {\n return;\n }\n\n const icon = this.isFullscreen ? 'multiply' : 'fit_to_width';\n // eslint-disable-next-line multiline-ternary\n const label = this.isFullscreen\n ? // eslint-disable-next-line multiline-ternary\n this.getTranslation('exit-fullscreen')\n : this.getTranslation('open-in-fullscreen');\n\n return [\n <button\n class=\"button--toggle-fullscreen\"\n id=\"tooltip-toggle-fullscreen\"\n role=\"button\"\n onClick={this.handleToggleFullscreen}\n >\n <limel-icon name={icon} />\n <limel-tooltip\n label={label}\n elementId=\"tooltip-toggle-fullscreen\"\n openDirection=\"left\"\n />\n </button>,\n ];\n };\n\n private renderDownloadButton = () => {\n if (!this.allowDownload \|\| this.isFullscreen) {\n return;\n }\n\n return (\n <a\n class=\"button--download\"\n id=\"tooltip-download\"\n role=\"button\"\n download={this.filename ? this.filename : ''}\n href={this.url}\n target=\"_blank\"\n >\n <limel-icon name=\"download_2\" />\n <limel-tooltip\n label={this.getTranslation('download')}\n elementId=\"tooltip-download\"\n openDirection=\"left\"\n />\n </a>\n );\n };\n\n private renderOpenInNewTabButton = () => {\n if (!this.allowOpenInNewTab \|\| this.isFullscreen) {\n return;\n }\n\n return (\n <a\n class=\"button--new-tab\"\n id=\"tooltip-new-tab\"\n role=\"button\"\n href={this.url}\n target=\"_blank\"\n rel=\"noopener noreferrer\"\n >\n <limel-icon name=\"external_link\" />\n <limel-tooltip\n label={this.getTranslation('open-in-new-tab')}\n elementId=\"tooltip-new-tab\"\n openDirection=\"left\"\n />\n </a>\n );\n };\n\n private renderActionMenu = () => {\n if (!this.actions \|\| this.isFullscreen) {\n return;\n }\n\n return (\n <limel-menu\n class=\"action-menu\"\n items={this.actions}\n onSelect={this.emitOnAction}\n open-direction=\"left\"\n >\n <button\n class=\"button--action\"\n id=\"tooltip-more\"\n role=\"button\"\n slot=\"trigger\"\n >\n <limel-icon name=\"menu_2\" />\n <limel-tooltip\n label={this.getTranslation('more-actions')}\n elementId=\"tooltip-more\"\n openDirection=\"left\"\n />\n </button>\n </limel-menu>\n );\n };\n\n private handleToggleFullscreen = () => {\n if (this.fullscreen.isSupported()) {\n this.fullscreen.toggle();\n this.isFullscreen = !this.isFullscreen;\n }\n };\n\n private emitOnAction = (event: CustomEvent<ListItem>) => {\n event.stopPropagation();\n this.action.emit(event.detail);\n };\n\n private getTranslation(key: string) {\n return translate.get(`file-viewer.${key}`, this.language);\n }\n}\n"],"version":3}
1	+ {"file":"limel-file-viewer.entry.cjs.js","mappings":"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","names":["h","translate"],"sources":["./src/components/file-viewer/extension-mapping.tsx","./src/components/file-viewer/fullscreen.ts","./src/components/file-viewer/file-viewer.scss?tag=limel-file-viewer&encapsulation=shadow","./src/components/file-viewer/file-viewer.tsx"],"sourcesContent":["export function detectExtension(fileName, url): any {\n const pathLike = fileName \|\| url;\n if (!pathLike) {\n return 'unknown';\n }\n\n const extension = pathLike.split('.').pop().toLowerCase();\n const extensionsToTypes = {\n pdf: 'pdf',\n jpg: 'image',\n jpeg: 'image',\n heic: 'image',\n bmp: 'image',\n png: 'image',\n gif: 'image',\n svg: 'image',\n svgz: 'image',\n ep: 'image',\n eps: 'image',\n avi: 'video',\n flv: 'video',\n h264: 'video',\n mov: 'video',\n mp4: 'video',\n mwv: 'video',\n mkv: 'video',\n mp3: 'audio',\n wav: 'audio',\n wma: 'audio',\n ogg: 'audio',\n txt: 'text',\n json: 'text',\n html: 'text',\n xml: 'text',\n // Word\n doc: 'office',\n docx: 'office',\n odt: 'office',\n dot: 'office',\n dotx: 'office',\n docm: 'office', // not supported\n dotm: 'office', // not yet tested\n // Presentation\n pot: 'office', // not tested\n ppt: 'office',\n pptx: 'office',\n odp: 'office',\n potx: 'office', // not supported\n potm: 'office', // not supported\n pps: 'office',\n ppsx: 'office',\n ppsm: 'office', // not supported\n pptm: 'office', // not supported\n ppam: 'office', // not tested\n pages: 'office', // not supported (Apple)\n // Spreadsheet\n xls: 'office',\n xlsx: 'office',\n xlsm: 'office',\n xlsb: 'office',\n ods: 'office',\n csv: 'office', // not supported\n numbers: 'office', // not supported (Apple)\n };\n\n return extensionsToTypes[extension] \|\| 'unknown';\n}\n","export class Fullscreen {\n private enter: () => void;\n private exit: () => void;\n\n constructor(element: any) {\n this.enter =\n element.requestFullscreen \|\|\n element.msRequestFullscreen \|\|\n element.mozRequestFullScreen \|\|\n element.webkitRequestFullscreen;\n this.enter = this.enter.bind(element);\n const doc: any = window.document;\n this.exit =\n doc.exitFullscreen \|\|\n doc.msExitFullscreen \|\|\n doc.mozCancelFullScreen \|\|\n doc.webkitExitFullscreen;\n }\n\n public requestFullscreen = () => {\n if (this.enter) {\n this.enter();\n }\n };\n\n public exitFullscreen = () => {\n if (this.exit) {\n this.exit.bind(window.document)();\n }\n };\n\n public toggle = () => {\n const doc: any = window.document;\n const isFullscreen =\n doc.fullscreenElement \|\|\n doc.mozFullScreenElement \|\|\n doc.webkitFullscreenElement \|\|\n doc.msFullscreenElement;\n\n if (isFullscreen) {\n this.exitFullscreen();\n } else {\n this.requestFullscreen();\n }\n };\n\n public isSupported(): boolean {\n return !!this.requestFullscreen;\n }\n}\n","@use '../../style/internal/variables';\n@use '../../style/internal/shared_input-select-picker';\n@use '../../style/mixins';\n\n$size-of-buttons: 2rem;\n\n:host {\n isolation: isolate;\n position: relative;\n box-sizing: border-box;\n display: flex;\n align-items: center;\n justify-content: center;\n width: 100%;\n height: 100%;\n}\n\n* {\n box-sizing: border-box;\n}\n\nimg,\nvideo,\naudio,\nobject,\niframe {\n max-height: 100%;\n max-width: 100%;\n box-sizing: border-box;\n}\n\niframe {\n border: none;\n width: 100%;\n height: 100%;\n min-height: 20rem; // makes sure to get minimum comfortable space for viewing office files, and Microsoft Office viewers toolbars\n}\n\nimg {\n min-width: 7rem;\n object-fit: contain; // increases or decreases the size of the image to fill the box whilst preserving its aspect-ratio.\n}\n\nvideo {\n width: 100%;\n height: auto;\n}\n\naudio {\n width: 100%;\n}\n\nobject {\n width: 100%;\n height: 100%;\n}\n\nobject[type='application/pdf'] {\n min-height: 20rem;\n // makes sure to get browsers' native controls for the PDF\n}\n\nobject[type='text/plain'] {\n border-radius: 0.25rem;\n padding-right: $size-of-buttons;\n\n overflow-y: auto;\n}\n\n@mixin plain-text-in-fullscreen {\n background-color: rgb(var(--color-gray-darker));\n\n object[type='text/plain'] {\n max-width: 50rem;\n max-height: calc(100% - 2rem);\n }\n}\n\n:host(:fullscreen) {\n @include plain-text-in-fullscreen;\n}\n:host(:-webkit-full-screen) {\n // this is repetition of the previous block,\n // but needed for Safari to work.\n // Cannot write SCSS rules for `:host` using commas for some reason.\n // e.g.: `:host(:fullscreen), :host(:-webkit-full-screen)`.\n // So you have to repeat it sadly.\n @include plain-text-in-fullscreen;\n}\n\n@import './partial-styles/ui-controls.scss';\n","import {\n Component,\n Element,\n h,\n Prop,\n State,\n Event,\n EventEmitter,\n Watch,\n} from '@stencil/core';\nimport { Languages, ListItem } from '@limetech/lime-elements';\nimport translate from '../../global/translations';\nimport { detectExtension } from './extension-mapping';\nimport { Fullscreen } from './fullscreen';\nimport { FileType, OfficeViewer } from './file-viewer.types';\n\n/*\n This is a smart component that automatically detects\n * the most common file types such as image, audio, video, and text,\n * and properly displays them in the browser.\n * The component is also capable to render the most common office files.\n \n :::note\n * Image files will always be contained in their containers, which means\n * they automatically increase or decrease in size to fill their containing box\n * whilst preserving their aspect-ratio.\n \n Text and PDF files will also always respect the width and height of the\n * container in which the `limel-file-viewer` is loaded.\n * :::\n \n For some file types such as text and images, the component will display a\n * download button and a button to open the file in a new browser tab.\n * This will allow users to preview the file in a fullscreen mode with the\n * browser and take advantage of for example native zooming and panning\n * functionalities.\n * @exampleComponent limel-example-file-viewer\n * @exampleComponent limel-example-file-viewer-office\n * @exampleComponent limel-example-file-viewer-filename\n * @exampleComponent limel-example-file-viewer-inbuilt-actions\n * @exampleComponent limel-example-file-viewer-custom-actions\n * @exampleComponent limel-example-file-viewer-with-picker\n * @private\n /\n\n@Component({\n tag: 'limel-file-viewer',\n shadow: true,\n styleUrl: 'file-viewer.scss',\n})\nexport class FileViewer {\n /\n Link to the file\n /\n @Prop({ reflect: true })\n public url: string;\n\n /\n The name of the file that must also contains its extension.\n * This overrides the filename that the `url` ends with.\n * Useful when the `url` does not contain the filename.\n * When specified, the `filename` will be used as filename of\n * the downloaded file.\n /\n @Prop({ reflect: true })\n public filename?: string;\n\n /\n An optional alternative text, mainly for assistive technologies and screen readers.\n * It is used for only image files, as an `alt` attribute.\n * Should optimally hold a description of the image,\n * which is also displayed on the page if the image can't be loaded for some reason.\n /\n @Prop({ reflect: true })\n public alt?: string;\n\n /\n Displays a button that allows the user to view the file\n * in fullscreen mode.\n * Not displayed for office files!\n /\n @Prop({ reflect: true })\n public allowFullscreen?: boolean = false;\n\n /\n Displays a button that allows the user to open the file\n * in a new browser tab.\n * Not displayed for office files!\n /\n @Prop({ reflect: true })\n public allowOpenInNewTab?: boolean = false;\n\n /\n Displays a button that allows the user to download the file.\n * Note that due to the browser's security policies,\n * the file should be hosted on the same domain\n * for the download button to work properly.\n * Not displayed for office files!\n /\n @Prop({ reflect: true })\n public allowDownload?: boolean = false;\n\n /\n Defines the localization for translations.\n /\n @Prop()\n public language: Languages = 'en';\n\n /\n Defines the third-party viewer that should be used to render\n * the content of office files, such as word processing documents,\n * presentations, or spreadsheets.\n /\n @Prop({ reflect: true })\n public officeViewer: OfficeViewer = 'microsoft-office';\n\n /\n An array of custom actions that can be displayed\n * as an action menu on the file which is being displayed.\n /\n @Prop()\n public actions: ListItem[];\n\n /\n Emitted when a custom action is selected from the action menu.\n /\n @Event()\n public action: EventEmitter<ListItem>;\n\n @Element()\n public HostElement: HTMLLimelFileViewerElement;\n\n private fullscreen: Fullscreen;\n\n @State()\n private isFullscreen: boolean = false;\n\n @State()\n private fileType: FileType;\n\n /\n True while the file is being loaded.\n */\n @State()\n private loading: boolean = true;\n\n @State()\n private fileUrl: string = '';\n\n constructor() {\n this.fullscreen = new Fullscreen(this.HostElement);\n }\n\n public async componentWillLoad() {\n this.fileType = detectExtension(this.filename, this.url);\n await this.createURL(this.url);\n }\n\n public render() {\n if (!this.isOfficeFileAccessibleViaURL) {\n return this.renderNoFileSupportMessage();\n }\n\n if (this.loading) {\n return <limel-spinner size=\"x-small\" limeBranded={false} />;\n }\n\n return this.renderFileViewer();\n }\n\n @Watch('url')\n protected async watchUrl(newUrl: string, oldUrl: string) {\n if (newUrl === oldUrl) {\n return;\n }\n\n this.loading = true;\n this.fileType = detectExtension(this.filename, this.fileUrl);\n await this.createURL(this.fileType);\n }\n\n private renderFileViewer() {\n const fileViewerFunctions = {\n pdf: this.renderPdf,\n image: this.renderImage,\n video: this.renderVideo,\n audio: this.renderAudio,\n text: this.renderText,\n office: this.renderOffice,\n };\n const fileViewerFunction =\n fileViewerFunctions[this.fileType] \|\|\n this.renderNoFileSupportMessage;\n\n return fileViewerFunction();\n }\n\n private renderPdf = () => {\n return [\n <div class=\"action-menu-for-pdf-files\">\n {this.renderActionMenu()}\n </div>,\n <iframe src={this.fileUrl} />,\n ];\n };\n\n private renderImage = () => {\n return [\n this.renderButtons(),\n <img src={this.fileUrl} alt={this.alt} />,\n ];\n };\n\n private renderVideo = () => {\n return (\n <video controls>\n <source src={this.fileUrl} />\n </video>\n );\n };\n\n private renderAudio = () => {\n return (\n <audio controls>\n <source src={this.fileUrl} />\n </audio>\n );\n };\n\n private renderText = () => {\n return [\n this.renderButtons(),\n <object data={this.fileUrl} type=\"text/plain\" />,\n ];\n };\n\n private renderOffice = () => {\n return [\n <div class=\"action-menu-for-office-files\">\n {this.renderActionMenu()}\n </div>,\n <iframe\n src={\n this.getOfficeViewerUrl() + this.fileUrl + '&embedded=true'\n }\n frameborder=\"0\"\n />,\n ];\n };\n\n private isOfficeFileAccessibleViaURL = () => {\n return (\n this.fileType === 'office' &&\n !(\n this.fileUrl.startsWith('http://') \|\|\n this.fileUrl.startsWith('https://')\n )\n );\n };\n\n private getOfficeViewerUrl = () => {\n const officeViewers = {\n 'microsoft-office':\n 'https://view.officeapps.live.com/op/embed.aspx?src=',\n 'google-drive': 'https://docs.google.com/gview?url=',\n };\n\n return officeViewers[this.officeViewer];\n };\n\n private renderNoFileSupportMessage = () => {\n return (\n <div class=\"no-support\">\n <limel-icon\n class=\"icon--warning\"\n name=\"brake_warning\"\n size=\"large\"\n role=\"presentation\"\n />\n <p>{this.getTranslation('message.unsupported-filetype')}</p>\n {this.renderDownloadButton()}\n </div>\n );\n };\n\n private renderButtons = () => {\n return (\n <div class=\"buttons\">\n {this.renderActionMenu()}\n {this.renderToggleFullscreenButton()}\n {this.renderDownloadButton()}\n {this.renderOpenInNewTabButton()}\n </div>\n );\n };\n\n private renderToggleFullscreenButton = () => {\n if (!this.allowFullscreen \|\| !this.fullscreen.isSupported()) {\n return;\n }\n\n const icon = this.isFullscreen ? 'multiply' : 'fit_to_width';\n // eslint-disable-next-line multiline-ternary\n const label = this.isFullscreen\n ? // eslint-disable-next-line multiline-ternary\n this.getTranslation('exit-fullscreen')\n : this.getTranslation('open-in-fullscreen');\n\n return [\n <button\n class=\"button--toggle-fullscreen\"\n id=\"tooltip-toggle-fullscreen\"\n role=\"button\"\n onClick={this.handleToggleFullscreen}\n >\n <limel-icon name={icon} />\n <limel-tooltip\n label={label}\n elementId=\"tooltip-toggle-fullscreen\"\n openDirection=\"left\"\n />\n </button>,\n ];\n };\n\n private renderDownloadButton = () => {\n if (!this.allowDownload \|\| this.isFullscreen) {\n return;\n }\n\n return (\n <a\n class=\"button--download\"\n id=\"tooltip-download\"\n role=\"button\"\n download={this.filename ? this.filename : ''}\n href={this.fileUrl}\n target=\"_blank\"\n >\n <limel-icon name=\"download_2\" />\n <limel-tooltip\n label={this.getTranslation('download')}\n elementId=\"tooltip-download\"\n openDirection=\"left\"\n />\n </a>\n );\n };\n\n private renderOpenInNewTabButton = () => {\n if (!this.allowOpenInNewTab \|\| this.isFullscreen) {\n return;\n }\n\n return (\n <a\n class=\"button--new-tab\"\n id=\"tooltip-new-tab\"\n role=\"button\"\n href={this.fileUrl}\n target=\"_blank\"\n rel=\"noopener noreferrer\"\n >\n <limel-icon name=\"external_link\" />\n <limel-tooltip\n label={this.getTranslation('open-in-new-tab')}\n elementId=\"tooltip-new-tab\"\n openDirection=\"left\"\n />\n </a>\n );\n };\n\n private renderActionMenu = () => {\n if (!this.actions \|\| this.isFullscreen) {\n return;\n }\n\n return (\n <limel-menu\n class=\"action-menu\"\n items={this.actions}\n onSelect={this.emitOnAction}\n open-direction=\"left\"\n >\n <button\n class=\"button--action\"\n id=\"tooltip-more\"\n role=\"button\"\n slot=\"trigger\"\n >\n <limel-icon name=\"menu_2\" />\n <limel-tooltip\n label={this.getTranslation('more-actions')}\n elementId=\"tooltip-more\"\n openDirection=\"left\"\n />\n </button>\n </limel-menu>\n );\n };\n\n private createURL = async (fileType: string) => {\n if (['pdf'].includes(fileType)) {\n const response = await fetch(this.url);\n const blob = await response.blob();\n\n this.fileUrl = URL.createObjectURL(blob);\n } else {\n this.fileUrl = this.url;\n }\n\n this.loading = false;\n };\n\n private handleToggleFullscreen = () => {\n if (this.fullscreen.isSupported()) {\n this.fullscreen.toggle();\n this.isFullscreen = !this.isFullscreen;\n }\n };\n\n private emitOnAction = (event: CustomEvent<ListItem>) => {\n event.stopPropagation();\n this.action.emit(event.detail);\n };\n\n private getTranslation(key: string) {\n return translate.get(`file-viewer.${key}`, this.language);\n }\n}\n"],"version":3}

package/dist/cjs/limel-file.cjs.entry.js CHANGED Viewed

@@ -5,6 +5,7 @@ Object.defineProperty(exports, '__esModule', { value: true });
 const index = require('./index-38eb64b5.js');
 const translations = require('./translations-a384b596.js');
 const randomString = require('./random-string-c8445652.js');
+const getIconProps = require('./get-icon-props-46a7e937.js');
 const component = require('./component-ae3bfacf.js');
 require('./component-67144c1c.js');
 require('./component-cf490570.js');
@@ -351,8 +352,9 @@ function getIconBackgroundColorForFile(extension) {
 }
 function getFileIcon(file) {
-  if (file === null || file === void 0 ? void 0 : file.icon) {
-    return file.icon;
+  const name = getIconProps.getIconName(file.icon);
+  if (name) {
+    return name;
   }
   const extension = getExtension(file);
   if (!extension) {
@@ -361,8 +363,9 @@ function getFileIcon(file) {
   return getIconForFile(extension);
 }
 function getFileColor(file) {
-  if (file === null || file === void 0 ? void 0 : file.iconColor) {
-    return file.iconColor;
+  const color = getIconProps.getIconColor(file.icon, file.iconColor);
+  if (color) {
+    return color;
   }
   const extension = getExtension(file);
   if (!extension) {
@@ -371,8 +374,9 @@ function getFileColor(file) {
   return getIconFillColorForFile(extension);
 }
 function getFileBackgroundColor(file) {
-  if (file === null || file === void 0 ? void 0 : file.iconBackgroundColor) {
-    return file.iconBackgroundColor;
+  const backgroundColor = getIconProps.getIconBackgroundColor(file.icon, file.iconBackgroundColor);
+  if (backgroundColor) {
+    return backgroundColor;
   }
   const extension = getExtension(file);
   if (!extension) {
@@ -381,8 +385,9 @@ function getFileBackgroundColor(file) {
   return getIconBackgroundColorForFile(extension);
 }
 function getFileExtensionTitle(file) {
-  if (file === null || file === void 0 ? void 0 : file.icon) {
-    return file.icon;
+  const name = getIconProps.getIconName(file.icon);
+  if (name) {
+    return name;
   }
   return getExtension(file);
 }
@@ -471,7 +476,12 @@ const File = class {
       return [];
     }
     return [
-      Object.assign(Object.assign({}, DEFAULT_FILE_CHIP), { text: this.value.filename, id: this.value.id, icon: getFileIcon(this.value), iconFillColor: getFileColor(this.value), iconBackgroundColor: getFileBackgroundColor(this.value), href: this.value.href, iconTitle: getFileExtensionTitle(this.value) }),
+      Object.assign(Object.assign({}, DEFAULT_FILE_CHIP), { text: this.value.filename, id: this.value.id, icon: {
+          name: getFileIcon(this.value),
+          title: getFileExtensionTitle(this.value),
+          color: getFileColor(this.value),
+          backgroundColor: getFileBackgroundColor(this.value),
+        }, href: this.value.href }),
     ];
   }
   handleKeyDown(event) {

package/dist/cjs/limel-file.cjs.entry.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"file":"limel-file.entry.cjs.js","mappings":";;;;;;;;;;;;;AAAA,MAAM,YAAY,GAAG,MAAM,CAAC;AAC5B,MAAM,aAAa,GAAG,mBAAmB,CAAC;AAC1C,MAAM,UAAU,GAAG,OAAO,CAAC;AAC3B,MAAM,SAAS,GAAG,UAAU,CAAC;AAC7B,MAAM,SAAS,GAAG,UAAU,CAAC;AAC7B,MAAM,UAAU,GAAG,sBAAsB,CAAC;AAC1C,MAAM,SAAS,GAAG,qBAAqB,CAAC;AACxC,MAAM,eAAe,GAAG,2BAA2B,CAAC;AACpD,MAAM,UAAU,GAAG,SAAS,CAAC;AAC7B,MAAM,UAAU,GAAG,QAAQ,CAAC;AAC5B,MAAM,mBAAmB,GAAG,QAAQ,CAAC;AACrC,MAAM,iBAAiB,GAAG,qBAAqB,CAAC;AAChD,MAAM,aAAa,GAAG,kBAAkB,CAAC;AACzC,MAAM,gBAAgB,GAAG,YAAY,CAAC;AACtC,MAAM,UAAU,GAAG,YAAY,CAAC;AAChC,MAAM,UAAU,GAAG,YAAY,CAAC;AAChC,MAAM,eAAe,GAAG,gBAAgB,CAAC;AACzC,MAAM,YAAY,GAAG,wBAAwB,CAAC;AAC9C,MAAM,SAAS,GAAG,UAAU,CAAC;AAE7B,MAAM,iBAAiB,GAA2B;;EAE9C,GAAG,EAAE,YAAY;;EAGjB,GAAG,EAAE,aAAa;EAClB,IAAI,EAAE,aAAa;EACnB,SAAS,EAAE,aAAa;EACxB,GAAG,EAAE,aAAa;;EAGlB,KAAK,EAAE,UAAU;EACjB,GAAG,EAAE,UAAU;EACf,GAAG,EAAE,UAAU;EACf,GAAG,EAAE,UAAU;EACf,IAAI,EAAE,UAAU;;EAGhB,IAAI,EAAE,SAAS;EACf,GAAG,EAAE,SAAS;;EAGd,GAAG,EAAE,SAAS;EACd,GAAG,EAAE,SAAS;;EAGd,GAAG,EAAE,SAAS;EACd,GAAG,EAAE,SAAS;EACd,IAAI,EAAE,SAAS;EACf,IAAI,EAAE,SAAS;EACf,IAAI,EAAE,SAAS;EACf,IAAI,EAAE,SAAS;EACf,GAAG,EAAE,aAAa;EAClB,KAAK,EAAE,aAAa;;EAGpB,GAAG,EAAE,OAAO;;EAGZ,GAAG,EAAE,eAAe;EACpB,GAAG,EAAE,eAAe;EACpB,GAAG,EAAE,eAAe;EACpB,IAAI,EAAE,eAAe;EACrB,IAAI,EAAE,eAAe;EACrB,IAAI,EAAE,eAAe;EACrB,IAAI,EAAE,eAAe;EACrB,IAAI,EAAE,eAAe;EACrB,IAAI,EAAE,eAAe;EACrB,IAAI,EAAE,eAAe;EACrB,IAAI,EAAE,eAAe;EACrB,IAAI,EAAE,eAAe;EACrB,GAAG,EAAE,iBAAiB;EACtB,GAAG,EAAE,iBAAiB;;EAGtB,GAAG,EAAE,UAAU;EACf,IAAI,EAAE,UAAU;EAChB,GAAG,EAAE,gBAAgB;EACrB,OAAO,EAAE,gBAAgB;;EAGzB,GAAG,EAAE,UAAU;EACf,IAAI,EAAE,UAAU;EAChB,IAAI,EAAE,UAAU;EAChB,GAAG,EAAE,UAAU;EACf,GAAG,EAAE,UAAU;EACf,GAAG,EAAE,UAAU;;EAGf,GAAG,EAAE,6BAA6B;EAClC,EAAE,EAAE,+BAA+B;;EAGnC,GAAG,EAAE,mBAAmB;EACxB,IAAI,EAAE,mBAAmB;EACzB,EAAE,EAAE,mBAAmB;EACvB,GAAG,EAAE,mBAAmB;EACxB,MAAM,EAAE,mBAAmB;;EAG3B,GAAG,EAAE,UAAU;EACf,GAAG,EAAE,UAAU;EACf,GAAG,EAAE,UAAU;EACf,GAAG,EAAE,UAAU;;EAGf,GAAG,EAAE,UAAU;EACf,GAAG,EAAE,UAAU;EACf,IAAI,EAAE,UAAU;EAChB,GAAG,EAAE,UAAU;EACf,GAAG,EAAE,UAAU;EACf,GAAG,EAAE,UAAU;;EAGf,GAAG,EAAE,eAAe;EACpB,IAAI,EAAE,eAAe;EACrB,GAAG,EAAE,eAAe;;EAGpB,IAAI,EAAE,MAAM;EACZ,IAAI,EAAE,SAAS;EACf,GAAG,EAAE,SAAS;EACd,EAAE,EAAE,SAAS;EACb,GAAG,EAAE,SAAS;CACjB,CAAC;SAEc,cAAc,CAAC,SAAiB;EAC5C,OAAO,iBAAiB,CAAC,SAAS,CAAC,WAAW,EAAE,CAAC,IAAI,YAAY,CAAC;AACtE;;AChIA,MAAM,uBAAuB,GAAG,6BAA6B,CAAC;AAC9D,MAAM,wBAAwB,GAAG,6BAA6B,CAAC;AAC/D,MAAM,qBAAqB,GAAG,6BAA6B,CAAC;AAC5D,MAAM,oBAAoB,GAAG,6BAA6B,CAAC;AAC3D,MAAM,oBAAoB,GAAG,iCAAiC,CAAC;AAC/D,MAAM,qBAAqB,GAAG,8BAA8B,CAAC;AAC7D,MAAM,0BAA0B,GAAG,8BAA8B,CAAC;AAClE,MAAM,oBAAoB,GAAG,4BAA4B,CAAC;AAC1D,MAAM,qBAAqB,GAAG,6BAA6B,CAAC;AAC5D,MAAM,yBAAyB,GAAG,gCAAgC,CAAC;AACnE,MAAM,4BAA4B,GAAG,6BAA6B,CAAC;AACnE,MAAM,wBAAwB,GAAG,+BAA+B,CAAC;AACjE,MAAM,2BAA2B,GAAG,8BAA8B,CAAC;AACnE,MAAM,qBAAqB,GAAG,+BAA+B,CAAC;AAC9D,MAAM,qBAAqB,GAAG,4BAA4B,CAAC;AAC3D,MAAM,0BAA0B,GAAG,iCAAiC,CAAC;AACrE,MAAM,uBAAuB,GAAG,+BAA+B,CAAC;AAChE,MAAM,mBAAmB,GAAG,4BAA4B,CAAC;AACzD,MAAM,oBAAoB,GAAG,iCAAiC,CAAC;AAE/D,MAAM,sBAAsB,GAA2B;;EAEnD,GAAG,EAAE,uBAAuB;;EAG5B,GAAG,EAAE,wBAAwB;EAC7B,IAAI,EAAE,wBAAwB;EAC9B,SAAS,EAAE,wBAAwB;EACnC,GAAG,EAAE,wBAAwB;;EAG7B,KAAK,EAAE,qBAAqB;EAC5B,GAAG,EAAE,qBAAqB;EAC1B,GAAG,EAAE,qBAAqB;EAC1B,GAAG,EAAE,qBAAqB;EAC1B,IAAI,EAAE,qBAAqB;;EAG3B,IAAI,EAAE,oBAAoB;EAC1B,GAAG,EAAE,oBAAoB;;EAGzB,GAAG,EAAE,oBAAoB;EACzB,GAAG,EAAE,oBAAoB;;EAGzB,GAAG,EAAE,oBAAoB;EACzB,GAAG,EAAE,oBAAoB;EACzB,IAAI,EAAE,oBAAoB;EAC1B,IAAI,EAAE,oBAAoB;EAC1B,IAAI,EAAE,oBAAoB;EAC1B,IAAI,EAAE,oBAAoB;EAC1B,GAAG,EAAE,wBAAwB;EAC7B,KAAK,EAAE,wBAAwB;;EAG/B,GAAG,EAAE,mBAAmB;;EAGxB,GAAG,EAAE,0BAA0B;EAC/B,GAAG,EAAE,0BAA0B;EAC/B,GAAG,EAAE,0BAA0B;EAC/B,IAAI,EAAE,0BAA0B;EAChC,IAAI,EAAE,0BAA0B;EAChC,IAAI,EAAE,0BAA0B;EAChC,IAAI,EAAE,0BAA0B;EAChC,IAAI,EAAE,0BAA0B;EAChC,IAAI,EAAE,0BAA0B;EAChC,IAAI,EAAE,0BAA0B;EAChC,IAAI,EAAE,0BAA0B;EAChC,IAAI,EAAE,0BAA0B;EAChC,GAAG,EAAE,4BAA4B;EACjC,GAAG,EAAE,4BAA4B;;EAGjC,GAAG,EAAE,qBAAqB;EAC1B,IAAI,EAAE,qBAAqB;EAC3B,GAAG,EAAE,uBAAuB;EAC5B,OAAO,EAAE,2BAA2B;;EAGpC,GAAG,EAAE,qBAAqB;EAC1B,GAAG,EAAE,qBAAqB;EAC1B,IAAI,EAAE,qBAAqB;EAC3B,IAAI,EAAE,qBAAqB;EAC3B,GAAG,EAAE,qBAAqB;EAC1B,GAAG,EAAE,qBAAqB;;EAG1B,GAAG,EAAE,4BAA4B;EACjC,EAAE,EAAE,wBAAwB;;EAG5B,GAAG,EAAE,yBAAyB;EAC9B,IAAI,EAAE,yBAAyB;EAC/B,EAAE,EAAE,yBAAyB;EAC7B,GAAG,EAAE,yBAAyB;EAC9B,MAAM,EAAE,yBAAyB;;EAGjC,GAAG,EAAE,qBAAqB;EAC1B,GAAG,EAAE,qBAAqB;EAC1B,GAAG,EAAE,qBAAqB;EAC1B,GAAG,EAAE,qBAAqB;;EAG1B,GAAG,EAAE,qBAAqB;EAC1B,IAAI,EAAE,qBAAqB;EAC3B,GAAG,EAAE,qBAAqB;EAC1B,GAAG,EAAE,qBAAqB;EAC1B,GAAG,EAAE,qBAAqB;;EAG1B,GAAG,EAAE,0BAA0B;EAC/B,IAAI,EAAE,0BAA0B;EAChC,GAAG,EAAE,0BAA0B;;EAG/B,IAAI,EAAE,oBAAoB;EAC1B,IAAI,EAAE,oBAAoB;EAC1B,GAAG,EAAE,oBAAoB;EACzB,EAAE,EAAE,oBAAoB;EACxB,GAAG,EAAE,oBAAoB;CAC5B,CAAC;SAEc,uBAAuB,CAAC,SAAiB;EACrD,QACI,sBAAsB,CAAC,SAAS,CAAC,WAAW,EAAE,CAAC;IAC/C,uBAAuB,EACzB;AACN;;AClIA,MAAM,6BAA6B,GAAG,sCAAsC,CAAC;AAC7E,MAAM,8BAA8B,GAAG,sCAAsC,CAAC;AAC9E,MAAM,2BAA2B,GAAG,sCAAsC,CAAC;AAC3E,MAAM,0BAA0B,GAAG,sCAAsC,CAAC;AAC1E,MAAM,0BAA0B,GAAG,wCAAwC,CAAC;AAC5E,MAAM,2BAA2B,GAAG,uCAAuC,CAAC;AAC5E,MAAM,gCAAgC,GAClC,uCAAuC,CAAC;AAC5C,MAAM,0BAA0B,GAAG,qCAAqC,CAAC;AACzE,MAAM,2BAA2B,GAAG,sCAAsC,CAAC;AAC3E,MAAM,oCAAoC,GACtC,yCAAyC,CAAC;AAC9C,MAAM,6BAA6B,GAAG,sCAAsC,CAAC;AAC7E,MAAM,8BAA8B,GAAG,wCAAwC,CAAC;AAChF,MAAM,iCAAiC,GACnC,uCAAuC,CAAC;AAC5C,MAAM,2BAA2B,GAAG,wCAAwC,CAAC;AAC7E,MAAM,2BAA2B,GAAG,qCAAqC,CAAC;AAC1E,MAAM,gCAAgC,GAClC,wCAAwC,CAAC;AAC7C,MAAM,6BAA6B,GAAG,wCAAwC,CAAC;AAC/E,MAAM,yBAAyB,GAAG,qCAAqC,CAAC;AACxE,MAAM,0BAA0B,GAAG,0CAA0C,CAAC;AAE9E,MAAM,4BAA4B,GAA2B;;EAEzD,GAAG,EAAE,6BAA6B;;EAGlC,GAAG,EAAE,8BAA8B;EACnC,IAAI,EAAE,8BAA8B;EACpC,SAAS,EAAE,8BAA8B;;EAGzC,GAAG,EAAE,8BAA8B;EACnC,KAAK,EAAE,2BAA2B;EAClC,GAAG,EAAE,2BAA2B;EAChC,GAAG,EAAE,2BAA2B;EAChC,GAAG,EAAE,2BAA2B;EAChC,IAAI,EAAE,2BAA2B;;EAGjC,IAAI,EAAE,0BAA0B;EAChC,GAAG,EAAE,0BAA0B;;EAG/B,GAAG,EAAE,0BAA0B;EAC/B,GAAG,EAAE,0BAA0B;;EAG/B,GAAG,EAAE,0BAA0B;EAC/B,GAAG,EAAE,0BAA0B;EAC/B,IAAI,EAAE,0BAA0B;EAChC,IAAI,EAAE,0BAA0B;EAChC,IAAI,EAAE,0BAA0B;EAChC,IAAI,EAAE,0BAA0B;EAChC,GAAG,EAAE,8BAA8B;EACnC,KAAK,EAAE,8BAA8B;;EAGrC,GAAG,EAAE,yBAAyB;;EAG9B,GAAG,EAAE,gCAAgC;EACrC,GAAG,EAAE,gCAAgC;EACrC,GAAG,EAAE,gCAAgC;EACrC,IAAI,EAAE,gCAAgC;EACtC,IAAI,EAAE,gCAAgC;EACtC,IAAI,EAAE,gCAAgC;EACtC,IAAI,EAAE,gCAAgC;EACtC,IAAI,EAAE,gCAAgC;EACtC,IAAI,EAAE,gCAAgC;EACtC,IAAI,EAAE,gCAAgC;EACtC,IAAI,EAAE,gCAAgC;EACtC,IAAI,EAAE,gCAAgC;EACtC,GAAG,EAAE,6BAA6B;EAClC,GAAG,EAAE,6BAA6B;;EAGlC,GAAG,EAAE,2BAA2B;EAChC,IAAI,EAAE,2BAA2B;EACjC,GAAG,EAAE,6BAA6B;EAClC,OAAO,EAAE,iCAAiC;;EAG1C,GAAG,EAAE,2BAA2B;EAChC,GAAG,EAAE,2BAA2B;EAChC,IAAI,EAAE,2BAA2B;EACjC,IAAI,EAAE,2BAA2B;EACjC,GAAG,EAAE,2BAA2B;EAChC,GAAG,EAAE,2BAA2B;;EAGhC,GAAG,EAAE,6BAA6B;EAClC,EAAE,EAAE,8BAA8B;;EAGlC,GAAG,EAAE,oCAAoC;EACzC,IAAI,EAAE,oCAAoC;EAC1C,EAAE,EAAE,oCAAoC;EACxC,GAAG,EAAE,oCAAoC;EACzC,MAAM,EAAE,oCAAoC;;EAG5C,GAAG,EAAE,2BAA2B;EAChC,GAAG,EAAE,2BAA2B;EAChC,GAAG,EAAE,2BAA2B;EAChC,GAAG,EAAE,2BAA2B;;EAGhC,GAAG,EAAE,2BAA2B;EAChC,IAAI,EAAE,2BAA2B;EACjC,GAAG,EAAE,2BAA2B;EAChC,GAAG,EAAE,2BAA2B;EAChC,GAAG,EAAE,2BAA2B;;EAGhC,GAAG,EAAE,gCAAgC;EACrC,IAAI,EAAE,gCAAgC;EACtC,GAAG,EAAE,gCAAgC;;EAGrC,IAAI,EAAE,0BAA0B;EAChC,IAAI,EAAE,0BAA0B;EAChC,GAAG,EAAE,0BAA0B;EAC/B,EAAE,EAAE,0BAA0B;EAC9B,GAAG,EAAE,0BAA0B;CAClC,CAAC;SAEc,6BAA6B,CAAC,SAAiB;EAC3D,QACI,4BAA4B,CAAC,SAAS,CAAC,WAAW,EAAE,CAAC;IACrD,6BAA6B,EAC/B;AACN;;SCjIgB,WAAW,CAAC,IAAc;EACtC,IAAI,IAAI,aAAJ,IAAI,uBAAJ,IAAI,CAAE,IAAI,EAAE;IACZ,OAAO,IAAI,CAAC,IAAI,CAAC;GACpB;EAED,MAAM,SAAS,GAAG,YAAY,CAAC,IAAI,CAAC,CAAC;EACrC,IAAI,CAAC,SAAS,EAAE;IACZ,OAAO;GACV;EAED,OAAO,cAAc,CAAC,SAAS,CAAC,CAAC;AACrC,CAAC;SAEe,YAAY,CAAC,IAAc;EACvC,IAAI,IAAI,aAAJ,IAAI,uBAAJ,IAAI,CAAE,SAAS,EAAE;IACjB,OAAO,IAAI,CAAC,SAAS,CAAC;GACzB;EAED,MAAM,SAAS,GAAG,YAAY,CAAC,IAAI,CAAC,CAAC;EACrC,IAAI,CAAC,SAAS,EAAE;IACZ,OAAO;GACV;EAED,OAAO,uBAAuB,CAAC,SAAS,CAAC,CAAC;AAC9C,CAAC;SAEe,sBAAsB,CAAC,IAAc;EACjD,IAAI,IAAI,aAAJ,IAAI,uBAAJ,IAAI,CAAE,mBAAmB,EAAE;IAC3B,OAAO,IAAI,CAAC,mBAAmB,CAAC;GACnC;EAED,MAAM,SAAS,GAAG,YAAY,CAAC,IAAI,CAAC,CAAC;EACrC,IAAI,CAAC,SAAS,EAAE;IACZ,OAAO;GACV;EAED,OAAO,6BAA6B,CAAC,SAAS,CAAC,CAAC;AACpD,CAAC;SAEe,qBAAqB,CAAC,IAAc;EAChD,IAAI,IAAI,aAAJ,IAAI,uBAAJ,IAAI,CAAE,IAAI,EAAE;IACZ,OAAO,IAAI,CAAC,IAAI,CAAC;GACpB;EAED,OAAO,YAAY,CAAC,IAAI,CAAC,CAAC;AAC9B,CAAC;SAEe,YAAY,CAAC,IAAc;EACvC,IAAI,CAAC,IAAI,EAAE;IACP,OAAO;GACV;EAED,OAAO,IAAI,CAAC,QAAQ,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC,GAAG,EAAE,CAAC;AAC1C;;AC1DA,MAAM,OAAO,GAAG,gGAAgG;;ACoBhH,MAAM,iBAAiB,GAAG,gBAAgB,CAAC;AAC3C,MAAM,iBAAiB,GAAS;EAC5B,EAAE,EAAE,IAAI;EACR,IAAI,EAAE,IAAI;EACV,SAAS,EAAE,IAAI;CAClB,CAAC;MAwCW,IAAI;EA0Eb;;;;IAJQ,gBAAW,GAAGA,+BAAkB,EAAE,CAAC;IAiFnC,oBAAe,GAAG,CAAC,KAAgB;MACvC,IAAI,CAAC,sBAAsB,GAAG,IAAI,CAAC;MACnC,IAAI,CAAC,cAAc,CAAC,KAAK,CAAC,CAAC;KAC9B,CAAC;IAEM,oBAAe,GAAG;MACtB,IAAI,CAAC,sBAAsB,GAAG,KAAK,CAAC;KACvC,CAAC;IAEM,mBAAc,GAAG,CAAC,KAAgB;MACtC,IAAI,CAAC,cAAc,CAAC,KAAK,CAAC,CAAC;MAC3B,IAAI,CAAC,sBAAsB,GAAG,KAAK,CAAC;MACpC,MAAM,YAAY,GAAG,KAAK,CAAC,YAAY,CAAC;MACxC,IAAI,CAAC,UAAU,CAAC,YAAY,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,CAAC;KAC1C,CAAC;;;oBApJyB,KAAK;oBAML,KAAK;oBAOL,KAAK;mBAOf,KAAK;kBAME,GAAG;oBAME,IAAI;kCAkBA,KAAK;IAQlC,IAAI,CAAC,mBAAmB,GAAG,IAAI,CAAC,mBAAmB,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;IAC/D,IAAI,CAAC,gBAAgB,GAAG,IAAI,CAAC,gBAAgB,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;IACzD,IAAI,CAAC,mBAAmB,GAAG,IAAI,CAAC,mBAAmB,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;IAC/D,IAAI,CAAC,cAAc,GAAG,IAAI,CAAC,cAAc,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;IACrD,IAAI,CAAC,aAAa,GAAG,IAAI,CAAC,aAAa,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;IACnD,IAAI,CAAC,WAAW,GAAG,IAAI,CAAC,WAAW,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;IAC/C,IAAI,CAAC,kBAAkB,GAAG,IAAI,CAAC,kBAAkB,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;GAChE;EAEM,iBAAiB;IACpB,IAAI,CAAC,UAAU,EAAE,CAAC;GACrB;EAEM,gBAAgB;IACnB,IAAI,CAAC,SAAS,GAAG,IAAI,CAAC,OAAO,CAAC,UAAU,CAAC,cAAc,CACnD,IAAI,CAAC,WAAW,CACC,CAAC;IACtB,IAAI,CAAC,OAAO,GAAG,IAAI,CAAC,OAAO,CAAC,UAAU,CAAC,aAAa,CAAC,iBAAiB,CAAC,CAAC;IACxE,IAAI,CAAC,UAAU,EAAE,CAAC;GACrB;EAEO,UAAU;IACd,IAAI,CAAC,IAAI,CAAC,OAAO,EAAE;MACf,OAAO;KACV;IAED,IAAI,CAAC,YAAY,GAAG,IAAIC,sBAAY,CAChC,IAAI,CAAC,OAAO,CAAC,UAAU,CAAC,aAAa,CAAC,iBAAiB,CAAC,CAC3D,CAAC;GACL;EAEM,oBAAoB;IACvB,IAAI,IAAI,CAAC,YAAY,EAAE;MACnB,IAAI,CAAC,YAAY,CAAC,OAAO,EAAE,CAAC;KAC/B;GACJ;EAEM,MAAM;IACT,OAAO;MACHC,mBACI,MAAM,EAAE,IAAI,EACZ,EAAE,EAAE,IAAI,CAAC,WAAW,EACpB,QAAQ,EAAE,IAAI,CAAC,gBAAgB,EAC/B,IAAI,EAAC,MAAM,EACX,MAAM,EAAE,IAAI,CAAC,MAAM,EACnB,QAAQ,EAAE,IAAI,CAAC,QAAQ,IAAI,IAAI,CAAC,QAAQ,GAC1C;MACFA,4BACI,KAAK,EAAE;UACH,gBAAgB,EAAE,IAAI;UACtB,gBAAgB,EAAE,IAAI;UACtB,oBAAoB,EAAE,IAAI,CAAC,sBAAsB;SACpD,EACD,QAAQ,EAAE,IAAI,CAAC,QAAQ,EACvB,QAAQ,EAAE,IAAI,CAAC,QAAQ,EACvB,OAAO,EAAE,IAAI,CAAC,OAAO,EACrB,KAAK,EAAE,IAAI,CAAC,KAAK,EACjB,WAAW,EAAC,iBAAiB,EAC7B,QAAQ,EAAE,IAAI,CAAC,QAAQ,EACvB,QAAQ,EAAE,IAAI,CAAC,mBAAmB,EAClC,OAAO,EAAE,IAAI,CAAC,mBAAmB,EACjC,UAAU,EAAE,IAAI,CAAC,kBAAkB,EACnC,SAAS,EAAE,IAAI,CAAC,aAAa,EAC7B,OAAO,EAAE,IAAI,CAAC,WAAW,EACzB,QAAQ,EAAE,IAAI,CAAC,QAAQ,EACvB,IAAI,EAAC,OAAO,EACZ,KAAK,EAAE,IAAI,CAAC,SAAS,EACrB,KAAK,EAAE,IAAI,CAAC,cAAc,CAAC,oBAAoB,CAAC,EAChD,WAAW,EAAE,IAAI,CAAC,eAAe,EACjC,UAAU,EAAE,IAAI,CAAC,cAAc,EAC/B,WAAW,EAAE,IAAI,CAAC,eAAe,EACjC,MAAM,EAAE,IAAI,CAAC,cAAc,GAC7B;KACL,CAAC;GACL;EAkBD,IAAY,SAAS;IACjB,IAAI,CAAC,IAAI,CAAC,KAAK,EAAE;MACb,OAAO,EAAE,CAAC;KACb;IAED,OAAO;sCAEI,iBAAiB,KACpB,IAAI,EAAE,IAAI,CAAC,KAAK,CAAC,QAAQ,EACzB,EAAE,EAAE,IAAI,CAAC,KAAK,CAAC,EAAE,EACjB,IAAI,EAAE,WAAW,CAAC,IAAI,CAAC,KAAK,CAAC,EAC7B,aAAa,EAAE,YAAY,CAAC,IAAI,CAAC,KAAK,CAAC,EACvC,mBAAmB,EAAE,sBAAsB,CAAC,IAAI,CAAC,KAAK,CAAC,EACvD,IAAI,EAAE,IAAI,CAAC,KAAK,CAAC,IAAI,EACrB,SAAS,EAAE,qBAAqB,CAAC,IAAI,CAAC,KAAK,CAAC;KAEnD,CAAC;GACL;EAEO,aAAa,CAAC,KAAoB;IACtC,IACI,KAAK,CAAC,IAAI,KAAK,KAAK;MACpB,KAAK,CAAC,IAAI,KAAK,WAAW;MAC1B,KAAK,CAAC,IAAI,KAAK,OAAO,EACxB;MACE,OAAO;KACV;IAED,KAAK,CAAC,cAAc,EAAE,CAAC;IACvB,KAAK,CAAC,eAAe,EAAE,CAAC;GAC3B;EAEO,WAAW,CAAC,KAAoB;IACpC,IAAI,KAAK,CAAC,IAAI,KAAK,OAAO,IAAI,CAAC,IAAI,CAAC,KAAK,EAAE;MACvC,IAAI,CAAC,SAAS,CAAC,KAAK,EAAE,CAAC;KAC1B;GACJ;EAEO,mBAAmB,CAAC,KAAY;IACpC,KAAK,CAAC,eAAe,EAAE,CAAC;IACxB,KAAK,CAAC,cAAc,EAAE,CAAC;IACvB,IAAI,CAAC,IAAI,CAAC,KAAK,EAAE;MACb,IAAI,CAAC,SAAS,CAAC,KAAK,EAAE,CAAC;KAC1B;GACJ;EAEO,gBAAgB,CAAC,KAAY;IACjC,IAAI,IAAI,CAAC,SAAS,CAAC,KAAK,CAAC,MAAM,GAAG,CAAC,EAAE;MACjC,KAAK,CAAC,eAAe,EAAE,CAAC;MACxB,IAAI,CAAC,UAAU,CAAC,IAAI,CAAC,SAAS,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,CAAC;KAC5C;GACJ;EAEO,UAAU,CAAC,IAAI;IACnB,MAAM,QAAQ,GAAa;MACvB,EAAE,EAAEF,+BAAkB,EAAE;MACxB,QAAQ,EAAE,IAAI,CAAC,IAAI;MACnB,WAAW,EAAE,IAAI,CAAC,IAAI;MACtB,IAAI,EAAE,IAAI,CAAC,IAAI;MACf,WAAW,EAAE,IAAI;KACpB,CAAC;IACF,IAAI,CAAC,MAAM,CAAC,IAAI,CAAC,QAAQ,CAAC,CAAC;IAC3B,IAAI,CAAC,OAAO,CAAC,IAAI,EAAE,CAAC;IACpB,IAAI,CAAC,YAAY,CAAC,KAAK,GAAG,IAAI,CAAC;GAClC;EAEO,mBAAmB,CAAC,KAAkB;IAC1C,KAAK,CAAC,eAAe,EAAE,CAAC;IACxB,MAAM,IAAI,GAAG,CAAC,KAAK,CAAC,MAAM,CAAC,MAAM,GAAG,KAAK,CAAC,MAAM,CAAC,CAAC,CAAC,GAAG,IAAI,CAAC;IAC3D,IAAI,CAAC,OAAO,CAAC,IAAI,EAAE,CAAC;IACpB,IAAI,CAAC,IAAI,EAAE;MACP,IAAI,CAAC,SAAS,CAAC,KAAK,GAAG,EAAE,CAAC;MAC1B,IAAI,CAAC,MAAM,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;MACvB,IAAI,IAAI,CAAC,QAAQ,EAAE;QACf,IAAI,CAAC,YAAY,CAAC,KAAK,GAAG,KAAK,CAAC;OACnC;KACJ;GACJ;EAEO,kBAAkB,CAAC,KAAwB;IAC/C,KAAK,CAAC,eAAe,EAAE,CAAC;IACxB,KAAK,CAAC,cAAc,EAAE,CAAC;IACvB,IAAI,CAAC,QAAQ,CAAC,IAAI,CAAC,KAAK,CAAC,MAAM,CAAC,EAAE,CAAC,CAAC;GACvC;EAEO,cAAc,CAAC,KAAY;IAC/B,KAAK,CAAC,eAAe,EAAE,CAAC;IACxB,KAAK,CAAC,cAAc,EAAE,CAAC;GAC1B;EAEO,cAAc,CAAC,GAAW;IAC9B,OAAOG,sBAAS,CAAC,GAAG,CAAC,QAAQ,GAAG,EAAE,EAAE,IAAI,CAAC,QAAQ,CAAC,CAAC;GACtD;;;;;;;","names":["createRandomString","MDCTextField","h","translate"],"sources":["./src/components/file/icons.ts","./src/components/file/icon-fill-colors.ts","./src/components/file/icon-background-colors.ts","./src/components/file/file-metadata.ts","./src/components/file/file.scss?tag=limel-file&encapsulation=shadow","./src/components/file/file.tsx"],"sourcesContent":["const DEFAULT_ICON = 'file';\nconst CALENDAR_ICON = 'tear_off_calendar';\nconst EMAIL_ICON = 'email';\nconst HTML_ICON = 'internet';\nconst TEXT_ICON = 'text_box';\nconst EXCEL_ICON = 'ms_excel_copyrighted';\nconst WORD_ICON = 'ms_word_copyrighted';\nconst POWERPOINT_ICON = 'ms_powerpoint_copyrighted';\nconst IMAGE_ICON = 'picture';\nconst PHOTO_ICON = 'camera';\nconst VECTOR_GRAPHIC_ICON = 'vector';\nconst PRESENTATION_ICON = 'presentation_filled';\nconst DOCUMENT_ICON = 'overview_pages_2';\nconst SPREADSHEET_ICON = 'data_sheet';\nconst AUDIO_ICON = 'audio_wave';\nconst VIDEO_ICON = 'video_file';\nconst COMPRESSED_ICON = 'condom_package';\nconst MESSAGE_ICON = 'ms_outlook_copyrighted';\nconst DATA_ICON = 'database';\n\nconst filetypeIconTable: Record<string, string> = {\n // Message\n msg: MESSAGE_ICON,\n\n // Calendar\n ics: CALENDAR_ICON,\n ical: CALENDAR_ICON,\n icalendar: CALENDAR_ICON,\n ifb: CALENDAR_ICON,\n\n // Email\n email: EMAIL_ICON,\n eml: EMAIL_ICON,\n oft: EMAIL_ICON,\n ost: EMAIL_ICON,\n emlx: EMAIL_ICON,\n\n // Web\n html: HTML_ICON,\n xml: HTML_ICON,\n\n // Editable text\n txt: TEXT_ICON,\n rtf: TEXT_ICON,\n\n // Editable document\n dot: WORD_ICON,\n doc: WORD_ICON,\n docx: WORD_ICON,\n dotx: WORD_ICON,\n docm: WORD_ICON,\n dotm: WORD_ICON,\n odt: DOCUMENT_ICON,\n pages: DOCUMENT_ICON,\n\n // Portable document\n pdf: 'PDF_2',\n\n // Presentation\n ppt: POWERPOINT_ICON,\n pot: POWERPOINT_ICON,\n pps: POWERPOINT_ICON,\n pptx: POWERPOINT_ICON,\n pptm: POWERPOINT_ICON,\n potx: POWERPOINT_ICON,\n potm: POWERPOINT_ICON,\n ppam: POWERPOINT_ICON,\n ppsx: POWERPOINT_ICON,\n ppsm: POWERPOINT_ICON,\n sldx: POWERPOINT_ICON,\n sldm: POWERPOINT_ICON,\n odp: PRESENTATION_ICON,\n key: PRESENTATION_ICON,\n\n // Spreadsheet\n xls: EXCEL_ICON,\n xlsx: EXCEL_ICON,\n csv: SPREADSHEET_ICON,\n numbers: SPREADSHEET_ICON,\n\n // Image\n jpg: PHOTO_ICON,\n jpeg: PHOTO_ICON,\n heic: PHOTO_ICON,\n bmp: IMAGE_ICON,\n png: IMAGE_ICON,\n gif: IMAGE_ICON,\n\n // Editable image\n psd: 'adobe_photoshop_copyrighted',\n ai: 'adobe_illustrator_copyrighted',\n\n // Vector graphic\n svg: VECTOR_GRAPHIC_ICON,\n svgz: VECTOR_GRAPHIC_ICON,\n ep: VECTOR_GRAPHIC_ICON,\n eps: VECTOR_GRAPHIC_ICON,\n sketch: VECTOR_GRAPHIC_ICON,\n\n // Audio\n mp3: AUDIO_ICON,\n wav: AUDIO_ICON,\n wma: AUDIO_ICON,\n ogg: AUDIO_ICON,\n\n // Video\n avi: VIDEO_ICON,\n flv: VIDEO_ICON,\n h264: VIDEO_ICON,\n mov: VIDEO_ICON,\n mp4: VIDEO_ICON,\n mwv: VIDEO_ICON,\n\n // Compressed\n zip: COMPRESSED_ICON,\n '7z': COMPRESSED_ICON,\n rar: COMPRESSED_ICON,\n\n // Data\n json: 'json',\n yaml: DATA_ICON,\n sql: DATA_ICON,\n db: DATA_ICON,\n dbf: DATA_ICON,\n};\n\nexport function getIconForFile(extension: string): string {\n return filetypeIconTable[extension.toLowerCase()] \|\| DEFAULT_ICON;\n}\n","const DEFAULT_ICON_FILL_COLOR = 'rgb(var(--color-gray-dark))';\nconst CALENDAR_ICON_FILL_COLOR = 'rgb(var(--color-cyan-dark))';\nconst EMAIL_ICON_FILL_COLOR = 'rgb(var(--color-gray-dark))';\nconst HTML_ICON_FILL_COLOR = 'rgb(var(--color-blue-dark))';\nconst TEXT_ICON_FILL_COLOR = 'rgb(var(--color-yellow-darker))';\nconst EXCEL_ICON_FILL_COLOR = 'rgb(var(--color-green-dark))';\nconst POWERPOINT_ICON_FILL_COLOR = 'rgb(var(--color-coral-dark))';\nconst WORD_ICON_FILL_COLOR = 'rgb(var(--color-sky-dark))';\nconst IMAGE_ICON_FILL_COLOR = 'rgb(var(--color-lime-dark))';\nconst VECTOR_GRAPHIC_FILL_COLOR = 'rgb(var(--color-magenta-dark))';\nconst PRESENTATION_ICON_FILL_COLOR = 'rgb(var(--color-blue-dark))';\nconst DOCUMENT_ICON_FILL_COLOR = 'rgb(var(--color-orange-dark))';\nconst SPREADSHEET_ICON_FILL_COLOR = 'rgb(var(--color-green-dark))';\nconst AUDIO_ICON_FILL_COLOR = 'rgb(var(--color-indigo-dark))';\nconst VIDEO_ICON_FILL_COLOR = 'rgb(var(--color-red-dark))';\nconst COMPRESSED_ICON_FILL_COLOR = 'rgb(var(--color-brown-default))';\nconst MESSAGE_ICON_FILL_COLOR = 'rgb(var(--color-yellow-dark))';\nconst PDF_ICON_FILL_COLOR = 'rgb(var(--color-red-dark))';\nconst DATA_ICON_FILL_COLOR = 'rgb(var(--color-glaucous-dark))';\n\nconst filetypeFillColorTable: Record<string, string> = {\n // Message\n msg: MESSAGE_ICON_FILL_COLOR,\n\n // Calendar\n ics: CALENDAR_ICON_FILL_COLOR,\n ical: CALENDAR_ICON_FILL_COLOR,\n icalendar: CALENDAR_ICON_FILL_COLOR,\n ifb: CALENDAR_ICON_FILL_COLOR,\n\n // Email\n email: EMAIL_ICON_FILL_COLOR,\n eml: EMAIL_ICON_FILL_COLOR,\n oft: EMAIL_ICON_FILL_COLOR,\n ost: EMAIL_ICON_FILL_COLOR,\n emlx: EMAIL_ICON_FILL_COLOR,\n\n // Web\n html: HTML_ICON_FILL_COLOR,\n xml: HTML_ICON_FILL_COLOR,\n\n // Editable text\n txt: TEXT_ICON_FILL_COLOR,\n rtf: TEXT_ICON_FILL_COLOR,\n\n // Editable document\n dot: WORD_ICON_FILL_COLOR,\n doc: WORD_ICON_FILL_COLOR,\n docx: WORD_ICON_FILL_COLOR,\n dotx: WORD_ICON_FILL_COLOR,\n docm: WORD_ICON_FILL_COLOR,\n dotm: WORD_ICON_FILL_COLOR,\n odt: DOCUMENT_ICON_FILL_COLOR,\n pages: DOCUMENT_ICON_FILL_COLOR,\n\n // Portable document\n pdf: PDF_ICON_FILL_COLOR,\n\n // Presentation\n ppt: POWERPOINT_ICON_FILL_COLOR,\n pot: POWERPOINT_ICON_FILL_COLOR,\n pps: POWERPOINT_ICON_FILL_COLOR,\n pptx: POWERPOINT_ICON_FILL_COLOR,\n pptm: POWERPOINT_ICON_FILL_COLOR,\n potx: POWERPOINT_ICON_FILL_COLOR,\n potm: POWERPOINT_ICON_FILL_COLOR,\n ppam: POWERPOINT_ICON_FILL_COLOR,\n ppsx: POWERPOINT_ICON_FILL_COLOR,\n ppsm: POWERPOINT_ICON_FILL_COLOR,\n sldx: POWERPOINT_ICON_FILL_COLOR,\n sldm: POWERPOINT_ICON_FILL_COLOR,\n odp: PRESENTATION_ICON_FILL_COLOR,\n key: PRESENTATION_ICON_FILL_COLOR,\n\n // Spreadsheet\n xls: EXCEL_ICON_FILL_COLOR,\n xlsx: EXCEL_ICON_FILL_COLOR,\n csv: DEFAULT_ICON_FILL_COLOR,\n numbers: SPREADSHEET_ICON_FILL_COLOR,\n\n // Image\n bmp: IMAGE_ICON_FILL_COLOR,\n jpg: IMAGE_ICON_FILL_COLOR,\n jpeg: IMAGE_ICON_FILL_COLOR,\n heic: IMAGE_ICON_FILL_COLOR,\n png: IMAGE_ICON_FILL_COLOR,\n gif: IMAGE_ICON_FILL_COLOR,\n\n // Editable image\n psd: PRESENTATION_ICON_FILL_COLOR,\n ai: DOCUMENT_ICON_FILL_COLOR,\n\n // Vector graphic\n svg: VECTOR_GRAPHIC_FILL_COLOR,\n svgz: VECTOR_GRAPHIC_FILL_COLOR,\n ep: VECTOR_GRAPHIC_FILL_COLOR,\n eps: VECTOR_GRAPHIC_FILL_COLOR,\n sketch: VECTOR_GRAPHIC_FILL_COLOR,\n\n // Audio\n mp3: AUDIO_ICON_FILL_COLOR,\n wav: AUDIO_ICON_FILL_COLOR,\n wma: AUDIO_ICON_FILL_COLOR,\n ogg: AUDIO_ICON_FILL_COLOR,\n\n // Video\n flv: VIDEO_ICON_FILL_COLOR,\n h264: VIDEO_ICON_FILL_COLOR,\n mov: VIDEO_ICON_FILL_COLOR,\n mp4: VIDEO_ICON_FILL_COLOR,\n mwv: VIDEO_ICON_FILL_COLOR,\n\n // Compressed\n zip: COMPRESSED_ICON_FILL_COLOR,\n '7z': COMPRESSED_ICON_FILL_COLOR,\n rar: COMPRESSED_ICON_FILL_COLOR,\n\n // Data\n json: DATA_ICON_FILL_COLOR,\n yaml: DATA_ICON_FILL_COLOR,\n sql: DATA_ICON_FILL_COLOR,\n db: DATA_ICON_FILL_COLOR,\n dbf: DATA_ICON_FILL_COLOR,\n};\n\nexport function getIconFillColorForFile(extension: string): string {\n return (\n filetypeFillColorTable[extension.toLowerCase()] \|\|\n DEFAULT_ICON_FILL_COLOR\n );\n}\n","const DEFAULT_ICON_BACKGROUND_COLOR = 'rgba(var(--color-gray-lighter), 0.4)';\nconst CALENDAR_ICON_BACKGROUND_COLOR = 'rgba(var(--color-cyan-lighter), 0.4)';\nconst EMAIL_ICON_BACKGROUND_COLOR = 'rgba(var(--color-gray-lighter), 0.4)';\nconst HTML_ICON_BACKGROUND_COLOR = 'rgba(var(--color-blue-lighter), 0.4)';\nconst TEXT_ICON_BACKGROUND_COLOR = 'rgba(var(--color-yellow-lighter), 0.4)';\nconst EXCEL_ICON_BACKGROUND_COLOR = 'rgba(var(--color-green-lighter), 0.4)';\nconst POWERPOINT_ICON_BACKGROUND_COLOR =\n 'rgba(var(--color-coral-lighter), 0.4)';\nconst WORD_ICON_BACKGROUND_COLOR = 'rgba(var(--color-sky-lighter), 0.4)';\nconst IMAGE_ICON_BACKGROUND_COLOR = 'rgba(var(--color-lime-lighter), 0.4)';\nconst VECTOR_GRAPHIC_ICON_BACKGROUND_COLOR =\n 'rgba(var(--color-magenta-lighter), 0.4)';\nconst PRESENTATION_BACKGROUND_COLOR = 'rgba(var(--color-blue-lighter), 0.4)';\nconst DOCUMENT_ICON_BACKGROUND_COLOR = 'rgba(var(--color-orange-lighter), 0.4)';\nconst SPREADSHEET_ICON_BACKGROUND_COLOR =\n 'rgba(var(--color-green-lighter), 0.4)';\nconst AUDIO_ICON_BACKGROUND_COLOR = 'rgba(var(--color-indigo-lighter), 0.4)';\nconst VIDEO_ICON_BACKGROUND_COLOR = 'rgba(var(--color-red-lighter), 0.4)';\nconst COMPRESSED_ICON_BACKGROUND_COLOR =\n 'rgba(var(--color-orange-lighter), 0.4)';\nconst MESSAGE_ICON_BACKGROUND_COLOR = 'rgba(var(--color-yellow-lighter), 0.4)';\nconst PDF_ICON_BACKGROUND_COLOR = 'rgba(var(--color-red-lighter), 0.4)';\nconst DATA_ICON_BACKGROUND_COLOR = 'rgba(var(--color-glaucous-lighter), 0.4)';\n\nconst filetypeBackgroundColorTable: Record<string, string> = {\n // Message\n msg: MESSAGE_ICON_BACKGROUND_COLOR,\n\n // Calendar\n ics: CALENDAR_ICON_BACKGROUND_COLOR,\n ical: CALENDAR_ICON_BACKGROUND_COLOR,\n icalendar: CALENDAR_ICON_BACKGROUND_COLOR,\n\n // Email\n ifb: CALENDAR_ICON_BACKGROUND_COLOR,\n email: EMAIL_ICON_BACKGROUND_COLOR,\n eml: EMAIL_ICON_BACKGROUND_COLOR,\n oft: EMAIL_ICON_BACKGROUND_COLOR,\n ost: EMAIL_ICON_BACKGROUND_COLOR,\n emlx: EMAIL_ICON_BACKGROUND_COLOR,\n\n // Web\n html: HTML_ICON_BACKGROUND_COLOR,\n xml: HTML_ICON_BACKGROUND_COLOR,\n\n // Editable text\n txt: TEXT_ICON_BACKGROUND_COLOR,\n rtf: TEXT_ICON_BACKGROUND_COLOR,\n\n // Editable document\n dot: WORD_ICON_BACKGROUND_COLOR,\n doc: WORD_ICON_BACKGROUND_COLOR,\n docx: WORD_ICON_BACKGROUND_COLOR,\n dotx: WORD_ICON_BACKGROUND_COLOR,\n docm: WORD_ICON_BACKGROUND_COLOR,\n dotm: WORD_ICON_BACKGROUND_COLOR,\n odt: DOCUMENT_ICON_BACKGROUND_COLOR,\n pages: DOCUMENT_ICON_BACKGROUND_COLOR,\n\n // Portable document\n pdf: PDF_ICON_BACKGROUND_COLOR,\n\n // Presentation\n ppt: POWERPOINT_ICON_BACKGROUND_COLOR,\n pot: POWERPOINT_ICON_BACKGROUND_COLOR,\n pps: POWERPOINT_ICON_BACKGROUND_COLOR,\n pptx: POWERPOINT_ICON_BACKGROUND_COLOR,\n pptm: POWERPOINT_ICON_BACKGROUND_COLOR,\n potx: POWERPOINT_ICON_BACKGROUND_COLOR,\n potm: POWERPOINT_ICON_BACKGROUND_COLOR,\n ppam: POWERPOINT_ICON_BACKGROUND_COLOR,\n ppsx: POWERPOINT_ICON_BACKGROUND_COLOR,\n ppsm: POWERPOINT_ICON_BACKGROUND_COLOR,\n sldx: POWERPOINT_ICON_BACKGROUND_COLOR,\n sldm: POWERPOINT_ICON_BACKGROUND_COLOR,\n odp: PRESENTATION_BACKGROUND_COLOR,\n key: PRESENTATION_BACKGROUND_COLOR,\n\n // Spreadsheet\n xls: EXCEL_ICON_BACKGROUND_COLOR,\n xlsx: EXCEL_ICON_BACKGROUND_COLOR,\n csv: DEFAULT_ICON_BACKGROUND_COLOR,\n numbers: SPREADSHEET_ICON_BACKGROUND_COLOR,\n\n // Image\n bmp: IMAGE_ICON_BACKGROUND_COLOR,\n jpg: IMAGE_ICON_BACKGROUND_COLOR,\n jpeg: IMAGE_ICON_BACKGROUND_COLOR,\n heic: IMAGE_ICON_BACKGROUND_COLOR,\n png: IMAGE_ICON_BACKGROUND_COLOR,\n gif: IMAGE_ICON_BACKGROUND_COLOR,\n\n // Editable image\n psd: PRESENTATION_BACKGROUND_COLOR,\n ai: DOCUMENT_ICON_BACKGROUND_COLOR,\n\n // Vector graphic\n svg: VECTOR_GRAPHIC_ICON_BACKGROUND_COLOR,\n svgz: VECTOR_GRAPHIC_ICON_BACKGROUND_COLOR,\n ep: VECTOR_GRAPHIC_ICON_BACKGROUND_COLOR,\n eps: VECTOR_GRAPHIC_ICON_BACKGROUND_COLOR,\n sketch: VECTOR_GRAPHIC_ICON_BACKGROUND_COLOR,\n\n // Audio\n mp3: AUDIO_ICON_BACKGROUND_COLOR,\n wav: AUDIO_ICON_BACKGROUND_COLOR,\n wma: AUDIO_ICON_BACKGROUND_COLOR,\n ogg: AUDIO_ICON_BACKGROUND_COLOR,\n\n // Video\n flv: VIDEO_ICON_BACKGROUND_COLOR,\n h264: VIDEO_ICON_BACKGROUND_COLOR,\n mov: VIDEO_ICON_BACKGROUND_COLOR,\n mp4: VIDEO_ICON_BACKGROUND_COLOR,\n mwv: VIDEO_ICON_BACKGROUND_COLOR,\n\n // Compressed:\n zip: COMPRESSED_ICON_BACKGROUND_COLOR,\n '7z': COMPRESSED_ICON_BACKGROUND_COLOR,\n rar: COMPRESSED_ICON_BACKGROUND_COLOR,\n\n // Data\n json: DATA_ICON_BACKGROUND_COLOR,\n yaml: DATA_ICON_BACKGROUND_COLOR,\n sql: DATA_ICON_BACKGROUND_COLOR,\n db: DATA_ICON_BACKGROUND_COLOR,\n dbf: DATA_ICON_BACKGROUND_COLOR,\n};\n\nexport function getIconBackgroundColorForFile(extension: string): string {\n return (\n filetypeBackgroundColorTable[extension.toLowerCase()] \|\|\n DEFAULT_ICON_BACKGROUND_COLOR\n );\n}\n","import { FileInfo } from '../../interface';\nimport { getIconForFile } from './icons';\nimport { getIconFillColorForFile } from './icon-fill-colors';\nimport { getIconBackgroundColorForFile } from './icon-background-colors';\n\nexport function getFileIcon(file: FileInfo) {\n if (file?.icon) {\n return file.icon;\n }\n\n const extension = getExtension(file);\n if (!extension) {\n return;\n }\n\n return getIconForFile(extension);\n}\n\nexport function getFileColor(file: FileInfo) {\n if (file?.iconColor) {\n return file.iconColor;\n }\n\n const extension = getExtension(file);\n if (!extension) {\n return;\n }\n\n return getIconFillColorForFile(extension);\n}\n\nexport function getFileBackgroundColor(file: FileInfo) {\n if (file?.iconBackgroundColor) {\n return file.iconBackgroundColor;\n }\n\n const extension = getExtension(file);\n if (!extension) {\n return;\n }\n\n return getIconBackgroundColorForFile(extension);\n}\n\nexport function getFileExtensionTitle(file: FileInfo) {\n if (file?.icon) {\n return file.icon;\n }\n\n return getExtension(file);\n}\n\nexport function getExtension(file: FileInfo) {\n if (!file) {\n return;\n }\n\n return file.filename.split('.').pop();\n}\n","/*\n @prop --icon-background-color: Background color of the icon. Defaults to `--contrast-400`.\n * @prop --icon-color: Color of the icon. Defaults to `--contrast-1100`.\n /\n\n:host {\n --icon-background-color: rgb(var(--contrast-400));\n --icon-color: rgb(var(--contrast-1100));\n}\n","import translate from '../../global/translations';\nimport { Chip, FileInfo, Languages } from '../../interface';\nimport { MDCTextField } from '@material/textfield';\nimport {\n Component,\n Element,\n Event,\n EventEmitter,\n h,\n Prop,\n State,\n} from '@stencil/core';\nimport { createRandomString } from '../../util/random-string';\nimport {\n getFileBackgroundColor,\n getFileColor,\n getFileExtensionTitle,\n getFileIcon,\n} from './file-metadata';\n\nconst CHIP_SET_TAG_NAME = 'limel-chip-set';\nconst DEFAULT_FILE_CHIP: Chip = {\n id: null,\n text: null,\n removable: true,\n};\n\n/\n This component lets end-users select a single file from their device\n * storage. Regardless of the user's device or operating system, this component\n * opens up a file picker dialog that allows the user to choose a file.\n \n ## Using correct labels\n \n This file picker can be used in different contexts. The component's distinct\n * visual design including the upload icon hints end-users that this is not a\n * normal input field like other fields in the form for example.\n \n :::important\n * you need to use a descriptive `label` that clarifies the\n * functionality of the file picker, and/or provides users with clear\n * instructions.\n \n Depending on the context, you may need to avoid labels such as:\n * - File\n * - Document\n \n and instead consider using labels like:\n * - Attach a file\n * - Upload a file\n * - Choose a document\n * - Choose a file\n \n and similar phrases...\n * :::\n * @exampleComponent limel-example-file\n * @exampleComponent limel-example-file-custom-icon\n * @exampleComponent limel-example-file-accepted-types\n * @exampleComponent limel-example-file-composite\n /\n@Component({\n tag: 'limel-file',\n shadow: true,\n styleUrl: 'file.scss',\n})\nexport class File {\n /\n The selected file.\n /\n @Prop()\n public value: FileInfo;\n\n /\n The input label.\n /\n @Prop({ reflect: true })\n public label: string;\n\n /\n Set to `true` to indicate that the field is required.\n /\n @Prop({ reflect: true })\n public required: boolean = false;\n\n /\n True if the input should be disabled\n /\n @Prop({ reflect: true })\n public disabled: boolean = false;\n\n /\n Set to `true` to disable adding and removing files, but allow interaction\n * with any already existing file.\n /\n @Prop({ reflect: true })\n public readonly: boolean = false;\n\n /\n Set to `true` to indicate that the current value of the chosen file is\n * invalid.\n /\n @Prop({ reflect: true })\n public invalid = false;\n\n /\n The [accepted file types](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input/file#unique_file_type_specifiers)\n /\n @Prop({ reflect: true })\n public accept: string = '';\n\n /*\n Defines the localisation for translations.\n /\n @Prop()\n public language: Languages = 'en';\n\n /\n Dispatched when a file is selected/deselected\n /\n @Event()\n private change: EventEmitter<FileInfo>;\n\n /\n Dispatched when clicking on a chip\n */\n @Event()\n private interact: EventEmitter<number \| string>;\n\n @Element()\n private element: HTMLLimelFileElement;\n\n @State()\n private isDraggingOverDropZone = false;\n\n private fileInput: HTMLInputElement;\n private fileInputId = createRandomString();\n private chipSet;\n private mdcTextField;\n\n constructor() {\n this.handleFileSelection = this.handleFileSelection.bind(this);\n this.handleFileChange = this.handleFileChange.bind(this);\n this.handleChipSetChange = this.handleChipSetChange.bind(this);\n this.handleFileDrop = this.handleFileDrop.bind(this);\n this.handleKeyDown = this.handleKeyDown.bind(this);\n this.handleKeyUp = this.handleKeyUp.bind(this);\n this.handleChipInteract = this.handleChipInteract.bind(this);\n }\n\n public connectedCallback() {\n this.initialize();\n }\n\n public componentDidLoad() {\n this.fileInput = this.element.shadowRoot.getElementById(\n this.fileInputId\n ) as HTMLInputElement;\n this.chipSet = this.element.shadowRoot.querySelector(CHIP_SET_TAG_NAME);\n this.initialize();\n }\n\n private initialize() {\n if (!this.chipSet) {\n return;\n }\n\n this.mdcTextField = new MDCTextField(\n this.chipSet.shadowRoot.querySelector('.mdc-text-field')\n );\n }\n\n public disconnectedCallback() {\n if (this.mdcTextField) {\n this.mdcTextField.destroy();\n }\n }\n\n public render() {\n return [\n <input\n hidden={true}\n id={this.fileInputId}\n onChange={this.handleFileChange}\n type=\"file\"\n accept={this.accept}\n disabled={this.disabled \|\| this.readonly}\n />,\n <limel-chip-set\n class={{\n 'is-file-picker': true,\n 'shows-dropzone': true,\n 'highlight-dropzone': this.isDraggingOverDropZone,\n }}\n disabled={this.disabled}\n readonly={this.readonly}\n invalid={this.invalid}\n label={this.label}\n leadingIcon=\"upload_to_cloud\"\n language={this.language}\n onChange={this.handleChipSetChange}\n onClick={this.handleFileSelection}\n onInteract={this.handleChipInteract}\n onKeyDown={this.handleKeyDown}\n onKeyUp={this.handleKeyUp}\n required={this.required}\n type=\"input\"\n value={this.chipArray}\n title={this.getTranslation('drag-and-drop-tips')}\n onDragEnter={this.handleDragEnter}\n onDragOver={this.preventAndStop}\n onDragLeave={this.handleDragLeave}\n onDrop={this.handleFileDrop}\n />,\n ];\n }\n\n private handleDragEnter = (event: DragEvent) => {\n this.isDraggingOverDropZone = true;\n this.preventAndStop(event);\n };\n\n private handleDragLeave = () => {\n this.isDraggingOverDropZone = false;\n };\n\n private handleFileDrop = (event: DragEvent) => {\n this.preventAndStop(event);\n this.isDraggingOverDropZone = false;\n const dataTransfer = event.dataTransfer;\n this.handleFile(dataTransfer.files[0]);\n };\n\n private get chipArray() {\n if (!this.value) {\n return [];\n }\n\n return [\n {\n ...DEFAULT_FILE_CHIP,\n text: this.value.filename,\n id: this.value.id,\n icon: getFileIcon(this.value),\n iconFillColor: getFileColor(this.value),\n iconBackgroundColor: getFileBackgroundColor(this.value),\n href: this.value.href,\n iconTitle: getFileExtensionTitle(this.value),\n },\n ];\n }\n\n private handleKeyDown(event: KeyboardEvent) {\n if (\n event.code === 'Tab' \|\|\n event.code === 'Backspace' \|\|\n event.code === 'Enter'\n ) {\n return;\n }\n\n event.preventDefault();\n event.stopPropagation();\n }\n\n private handleKeyUp(event: KeyboardEvent) {\n if (event.code === 'Enter' && !this.value) {\n this.fileInput.click();\n }\n }\n\n private handleFileSelection(event: Event) {\n event.stopPropagation();\n event.preventDefault();\n if (!this.value) {\n this.fileInput.click();\n }\n }\n\n private handleFileChange(event: Event) {\n if (this.fileInput.files.length > 0) {\n event.stopPropagation();\n this.handleFile(this.fileInput.files[0]);\n }\n }\n\n private handleFile(file) {\n const limeFile: FileInfo = {\n id: createRandomString(),\n filename: file.name,\n contentType: file.type,\n size: file.size,\n fileContent: file,\n };\n this.change.emit(limeFile);\n this.chipSet.blur();\n this.mdcTextField.valid = true;\n }\n\n private handleChipSetChange(event: CustomEvent) {\n event.stopPropagation();\n const file = !event.detail.length ? event.detail[0] : null;\n this.chipSet.blur();\n if (!file) {\n this.fileInput.value = '';\n this.change.emit(file);\n if (this.required) {\n this.mdcTextField.valid = false;\n }\n }\n }\n\n private handleChipInteract(event: CustomEvent<Chip>) {\n event.stopPropagation();\n event.preventDefault();\n this.interact.emit(event.detail.id);\n }\n\n private preventAndStop(event: Event) {\n event.stopPropagation();\n event.preventDefault();\n }\n\n private getTranslation(key: string) {\n return translate.get(`file.${key}`, this.language);\n }\n}\n"],"version":3}
1	+ {"file":"limel-file.entry.cjs.js","mappings":"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","names":["getIconName","getIconColor","getIconBackgroundColor","createRandomString","MDCTextField","h","translate"],"sources":["./src/components/file/icons.ts","./src/components/file/icon-fill-colors.ts","./src/components/file/icon-background-colors.ts","./src/components/file/file-metadata.ts","./src/components/file/file.scss?tag=limel-file&encapsulation=shadow","./src/components/file/file.tsx"],"sourcesContent":["const DEFAULT_ICON = 'file';\nconst CALENDAR_ICON = 'tear_off_calendar';\nconst EMAIL_ICON = 'email';\nconst HTML_ICON = 'internet';\nconst TEXT_ICON = 'text_box';\nconst EXCEL_ICON = 'ms_excel_copyrighted';\nconst WORD_ICON = 'ms_word_copyrighted';\nconst POWERPOINT_ICON = 'ms_powerpoint_copyrighted';\nconst IMAGE_ICON = 'picture';\nconst PHOTO_ICON = 'camera';\nconst VECTOR_GRAPHIC_ICON = 'vector';\nconst PRESENTATION_ICON = 'presentation_filled';\nconst DOCUMENT_ICON = 'overview_pages_2';\nconst SPREADSHEET_ICON = 'data_sheet';\nconst AUDIO_ICON = 'audio_wave';\nconst VIDEO_ICON = 'video_file';\nconst COMPRESSED_ICON = 'condom_package';\nconst MESSAGE_ICON = 'ms_outlook_copyrighted';\nconst DATA_ICON = 'database';\n\nconst filetypeIconTable: Record<string, string> = {\n // Message\n msg: MESSAGE_ICON,\n\n // Calendar\n ics: CALENDAR_ICON,\n ical: CALENDAR_ICON,\n icalendar: CALENDAR_ICON,\n ifb: CALENDAR_ICON,\n\n // Email\n email: EMAIL_ICON,\n eml: EMAIL_ICON,\n oft: EMAIL_ICON,\n ost: EMAIL_ICON,\n emlx: EMAIL_ICON,\n\n // Web\n html: HTML_ICON,\n xml: HTML_ICON,\n\n // Editable text\n txt: TEXT_ICON,\n rtf: TEXT_ICON,\n\n // Editable document\n dot: WORD_ICON,\n doc: WORD_ICON,\n docx: WORD_ICON,\n dotx: WORD_ICON,\n docm: WORD_ICON,\n dotm: WORD_ICON,\n odt: DOCUMENT_ICON,\n pages: DOCUMENT_ICON,\n\n // Portable document\n pdf: 'PDF_2',\n\n // Presentation\n ppt: POWERPOINT_ICON,\n pot: POWERPOINT_ICON,\n pps: POWERPOINT_ICON,\n pptx: POWERPOINT_ICON,\n pptm: POWERPOINT_ICON,\n potx: POWERPOINT_ICON,\n potm: POWERPOINT_ICON,\n ppam: POWERPOINT_ICON,\n ppsx: POWERPOINT_ICON,\n ppsm: POWERPOINT_ICON,\n sldx: POWERPOINT_ICON,\n sldm: POWERPOINT_ICON,\n odp: PRESENTATION_ICON,\n key: PRESENTATION_ICON,\n\n // Spreadsheet\n xls: EXCEL_ICON,\n xlsx: EXCEL_ICON,\n csv: SPREADSHEET_ICON,\n numbers: SPREADSHEET_ICON,\n\n // Image\n jpg: PHOTO_ICON,\n jpeg: PHOTO_ICON,\n heic: PHOTO_ICON,\n bmp: IMAGE_ICON,\n png: IMAGE_ICON,\n gif: IMAGE_ICON,\n\n // Editable image\n psd: 'adobe_photoshop_copyrighted',\n ai: 'adobe_illustrator_copyrighted',\n\n // Vector graphic\n svg: VECTOR_GRAPHIC_ICON,\n svgz: VECTOR_GRAPHIC_ICON,\n ep: VECTOR_GRAPHIC_ICON,\n eps: VECTOR_GRAPHIC_ICON,\n sketch: VECTOR_GRAPHIC_ICON,\n\n // Audio\n mp3: AUDIO_ICON,\n wav: AUDIO_ICON,\n wma: AUDIO_ICON,\n ogg: AUDIO_ICON,\n\n // Video\n avi: VIDEO_ICON,\n flv: VIDEO_ICON,\n h264: VIDEO_ICON,\n mov: VIDEO_ICON,\n mp4: VIDEO_ICON,\n mwv: VIDEO_ICON,\n\n // Compressed\n zip: COMPRESSED_ICON,\n '7z': COMPRESSED_ICON,\n rar: COMPRESSED_ICON,\n\n // Data\n json: 'json',\n yaml: DATA_ICON,\n sql: DATA_ICON,\n db: DATA_ICON,\n dbf: DATA_ICON,\n};\n\nexport function getIconForFile(extension: string): string {\n return filetypeIconTable[extension.toLowerCase()] \|\| DEFAULT_ICON;\n}\n","const DEFAULT_ICON_FILL_COLOR = 'rgb(var(--color-gray-dark))';\nconst CALENDAR_ICON_FILL_COLOR = 'rgb(var(--color-cyan-dark))';\nconst EMAIL_ICON_FILL_COLOR = 'rgb(var(--color-gray-dark))';\nconst HTML_ICON_FILL_COLOR = 'rgb(var(--color-blue-dark))';\nconst TEXT_ICON_FILL_COLOR = 'rgb(var(--color-yellow-darker))';\nconst EXCEL_ICON_FILL_COLOR = 'rgb(var(--color-green-dark))';\nconst POWERPOINT_ICON_FILL_COLOR = 'rgb(var(--color-coral-dark))';\nconst WORD_ICON_FILL_COLOR = 'rgb(var(--color-sky-dark))';\nconst IMAGE_ICON_FILL_COLOR = 'rgb(var(--color-lime-dark))';\nconst VECTOR_GRAPHIC_FILL_COLOR = 'rgb(var(--color-magenta-dark))';\nconst PRESENTATION_ICON_FILL_COLOR = 'rgb(var(--color-blue-dark))';\nconst DOCUMENT_ICON_FILL_COLOR = 'rgb(var(--color-orange-dark))';\nconst SPREADSHEET_ICON_FILL_COLOR = 'rgb(var(--color-green-dark))';\nconst AUDIO_ICON_FILL_COLOR = 'rgb(var(--color-indigo-dark))';\nconst VIDEO_ICON_FILL_COLOR = 'rgb(var(--color-red-dark))';\nconst COMPRESSED_ICON_FILL_COLOR = 'rgb(var(--color-brown-default))';\nconst MESSAGE_ICON_FILL_COLOR = 'rgb(var(--color-yellow-dark))';\nconst PDF_ICON_FILL_COLOR = 'rgb(var(--color-red-dark))';\nconst DATA_ICON_FILL_COLOR = 'rgb(var(--color-glaucous-dark))';\n\nconst filetypeFillColorTable: Record<string, string> = {\n // Message\n msg: MESSAGE_ICON_FILL_COLOR,\n\n // Calendar\n ics: CALENDAR_ICON_FILL_COLOR,\n ical: CALENDAR_ICON_FILL_COLOR,\n icalendar: CALENDAR_ICON_FILL_COLOR,\n ifb: CALENDAR_ICON_FILL_COLOR,\n\n // Email\n email: EMAIL_ICON_FILL_COLOR,\n eml: EMAIL_ICON_FILL_COLOR,\n oft: EMAIL_ICON_FILL_COLOR,\n ost: EMAIL_ICON_FILL_COLOR,\n emlx: EMAIL_ICON_FILL_COLOR,\n\n // Web\n html: HTML_ICON_FILL_COLOR,\n xml: HTML_ICON_FILL_COLOR,\n\n // Editable text\n txt: TEXT_ICON_FILL_COLOR,\n rtf: TEXT_ICON_FILL_COLOR,\n\n // Editable document\n dot: WORD_ICON_FILL_COLOR,\n doc: WORD_ICON_FILL_COLOR,\n docx: WORD_ICON_FILL_COLOR,\n dotx: WORD_ICON_FILL_COLOR,\n docm: WORD_ICON_FILL_COLOR,\n dotm: WORD_ICON_FILL_COLOR,\n odt: DOCUMENT_ICON_FILL_COLOR,\n pages: DOCUMENT_ICON_FILL_COLOR,\n\n // Portable document\n pdf: PDF_ICON_FILL_COLOR,\n\n // Presentation\n ppt: POWERPOINT_ICON_FILL_COLOR,\n pot: POWERPOINT_ICON_FILL_COLOR,\n pps: POWERPOINT_ICON_FILL_COLOR,\n pptx: POWERPOINT_ICON_FILL_COLOR,\n pptm: POWERPOINT_ICON_FILL_COLOR,\n potx: POWERPOINT_ICON_FILL_COLOR,\n potm: POWERPOINT_ICON_FILL_COLOR,\n ppam: POWERPOINT_ICON_FILL_COLOR,\n ppsx: POWERPOINT_ICON_FILL_COLOR,\n ppsm: POWERPOINT_ICON_FILL_COLOR,\n sldx: POWERPOINT_ICON_FILL_COLOR,\n sldm: POWERPOINT_ICON_FILL_COLOR,\n odp: PRESENTATION_ICON_FILL_COLOR,\n key: PRESENTATION_ICON_FILL_COLOR,\n\n // Spreadsheet\n xls: EXCEL_ICON_FILL_COLOR,\n xlsx: EXCEL_ICON_FILL_COLOR,\n csv: DEFAULT_ICON_FILL_COLOR,\n numbers: SPREADSHEET_ICON_FILL_COLOR,\n\n // Image\n bmp: IMAGE_ICON_FILL_COLOR,\n jpg: IMAGE_ICON_FILL_COLOR,\n jpeg: IMAGE_ICON_FILL_COLOR,\n heic: IMAGE_ICON_FILL_COLOR,\n png: IMAGE_ICON_FILL_COLOR,\n gif: IMAGE_ICON_FILL_COLOR,\n\n // Editable image\n psd: PRESENTATION_ICON_FILL_COLOR,\n ai: DOCUMENT_ICON_FILL_COLOR,\n\n // Vector graphic\n svg: VECTOR_GRAPHIC_FILL_COLOR,\n svgz: VECTOR_GRAPHIC_FILL_COLOR,\n ep: VECTOR_GRAPHIC_FILL_COLOR,\n eps: VECTOR_GRAPHIC_FILL_COLOR,\n sketch: VECTOR_GRAPHIC_FILL_COLOR,\n\n // Audio\n mp3: AUDIO_ICON_FILL_COLOR,\n wav: AUDIO_ICON_FILL_COLOR,\n wma: AUDIO_ICON_FILL_COLOR,\n ogg: AUDIO_ICON_FILL_COLOR,\n\n // Video\n flv: VIDEO_ICON_FILL_COLOR,\n h264: VIDEO_ICON_FILL_COLOR,\n mov: VIDEO_ICON_FILL_COLOR,\n mp4: VIDEO_ICON_FILL_COLOR,\n mwv: VIDEO_ICON_FILL_COLOR,\n\n // Compressed\n zip: COMPRESSED_ICON_FILL_COLOR,\n '7z': COMPRESSED_ICON_FILL_COLOR,\n rar: COMPRESSED_ICON_FILL_COLOR,\n\n // Data\n json: DATA_ICON_FILL_COLOR,\n yaml: DATA_ICON_FILL_COLOR,\n sql: DATA_ICON_FILL_COLOR,\n db: DATA_ICON_FILL_COLOR,\n dbf: DATA_ICON_FILL_COLOR,\n};\n\nexport function getIconFillColorForFile(extension: string): string {\n return (\n filetypeFillColorTable[extension.toLowerCase()] \|\|\n DEFAULT_ICON_FILL_COLOR\n );\n}\n","const DEFAULT_ICON_BACKGROUND_COLOR = 'rgba(var(--color-gray-lighter), 0.4)';\nconst CALENDAR_ICON_BACKGROUND_COLOR = 'rgba(var(--color-cyan-lighter), 0.4)';\nconst EMAIL_ICON_BACKGROUND_COLOR = 'rgba(var(--color-gray-lighter), 0.4)';\nconst HTML_ICON_BACKGROUND_COLOR = 'rgba(var(--color-blue-lighter), 0.4)';\nconst TEXT_ICON_BACKGROUND_COLOR = 'rgba(var(--color-yellow-lighter), 0.4)';\nconst EXCEL_ICON_BACKGROUND_COLOR = 'rgba(var(--color-green-lighter), 0.4)';\nconst POWERPOINT_ICON_BACKGROUND_COLOR =\n 'rgba(var(--color-coral-lighter), 0.4)';\nconst WORD_ICON_BACKGROUND_COLOR = 'rgba(var(--color-sky-lighter), 0.4)';\nconst IMAGE_ICON_BACKGROUND_COLOR = 'rgba(var(--color-lime-lighter), 0.4)';\nconst VECTOR_GRAPHIC_ICON_BACKGROUND_COLOR =\n 'rgba(var(--color-magenta-lighter), 0.4)';\nconst PRESENTATION_BACKGROUND_COLOR = 'rgba(var(--color-blue-lighter), 0.4)';\nconst DOCUMENT_ICON_BACKGROUND_COLOR = 'rgba(var(--color-orange-lighter), 0.4)';\nconst SPREADSHEET_ICON_BACKGROUND_COLOR =\n 'rgba(var(--color-green-lighter), 0.4)';\nconst AUDIO_ICON_BACKGROUND_COLOR = 'rgba(var(--color-indigo-lighter), 0.4)';\nconst VIDEO_ICON_BACKGROUND_COLOR = 'rgba(var(--color-red-lighter), 0.4)';\nconst COMPRESSED_ICON_BACKGROUND_COLOR =\n 'rgba(var(--color-orange-lighter), 0.4)';\nconst MESSAGE_ICON_BACKGROUND_COLOR = 'rgba(var(--color-yellow-lighter), 0.4)';\nconst PDF_ICON_BACKGROUND_COLOR = 'rgba(var(--color-red-lighter), 0.4)';\nconst DATA_ICON_BACKGROUND_COLOR = 'rgba(var(--color-glaucous-lighter), 0.4)';\n\nconst filetypeBackgroundColorTable: Record<string, string> = {\n // Message\n msg: MESSAGE_ICON_BACKGROUND_COLOR,\n\n // Calendar\n ics: CALENDAR_ICON_BACKGROUND_COLOR,\n ical: CALENDAR_ICON_BACKGROUND_COLOR,\n icalendar: CALENDAR_ICON_BACKGROUND_COLOR,\n\n // Email\n ifb: CALENDAR_ICON_BACKGROUND_COLOR,\n email: EMAIL_ICON_BACKGROUND_COLOR,\n eml: EMAIL_ICON_BACKGROUND_COLOR,\n oft: EMAIL_ICON_BACKGROUND_COLOR,\n ost: EMAIL_ICON_BACKGROUND_COLOR,\n emlx: EMAIL_ICON_BACKGROUND_COLOR,\n\n // Web\n html: HTML_ICON_BACKGROUND_COLOR,\n xml: HTML_ICON_BACKGROUND_COLOR,\n\n // Editable text\n txt: TEXT_ICON_BACKGROUND_COLOR,\n rtf: TEXT_ICON_BACKGROUND_COLOR,\n\n // Editable document\n dot: WORD_ICON_BACKGROUND_COLOR,\n doc: WORD_ICON_BACKGROUND_COLOR,\n docx: WORD_ICON_BACKGROUND_COLOR,\n dotx: WORD_ICON_BACKGROUND_COLOR,\n docm: WORD_ICON_BACKGROUND_COLOR,\n dotm: WORD_ICON_BACKGROUND_COLOR,\n odt: DOCUMENT_ICON_BACKGROUND_COLOR,\n pages: DOCUMENT_ICON_BACKGROUND_COLOR,\n\n // Portable document\n pdf: PDF_ICON_BACKGROUND_COLOR,\n\n // Presentation\n ppt: POWERPOINT_ICON_BACKGROUND_COLOR,\n pot: POWERPOINT_ICON_BACKGROUND_COLOR,\n pps: POWERPOINT_ICON_BACKGROUND_COLOR,\n pptx: POWERPOINT_ICON_BACKGROUND_COLOR,\n pptm: POWERPOINT_ICON_BACKGROUND_COLOR,\n potx: POWERPOINT_ICON_BACKGROUND_COLOR,\n potm: POWERPOINT_ICON_BACKGROUND_COLOR,\n ppam: POWERPOINT_ICON_BACKGROUND_COLOR,\n ppsx: POWERPOINT_ICON_BACKGROUND_COLOR,\n ppsm: POWERPOINT_ICON_BACKGROUND_COLOR,\n sldx: POWERPOINT_ICON_BACKGROUND_COLOR,\n sldm: POWERPOINT_ICON_BACKGROUND_COLOR,\n odp: PRESENTATION_BACKGROUND_COLOR,\n key: PRESENTATION_BACKGROUND_COLOR,\n\n // Spreadsheet\n xls: EXCEL_ICON_BACKGROUND_COLOR,\n xlsx: EXCEL_ICON_BACKGROUND_COLOR,\n csv: DEFAULT_ICON_BACKGROUND_COLOR,\n numbers: SPREADSHEET_ICON_BACKGROUND_COLOR,\n\n // Image\n bmp: IMAGE_ICON_BACKGROUND_COLOR,\n jpg: IMAGE_ICON_BACKGROUND_COLOR,\n jpeg: IMAGE_ICON_BACKGROUND_COLOR,\n heic: IMAGE_ICON_BACKGROUND_COLOR,\n png: IMAGE_ICON_BACKGROUND_COLOR,\n gif: IMAGE_ICON_BACKGROUND_COLOR,\n\n // Editable image\n psd: PRESENTATION_BACKGROUND_COLOR,\n ai: DOCUMENT_ICON_BACKGROUND_COLOR,\n\n // Vector graphic\n svg: VECTOR_GRAPHIC_ICON_BACKGROUND_COLOR,\n svgz: VECTOR_GRAPHIC_ICON_BACKGROUND_COLOR,\n ep: VECTOR_GRAPHIC_ICON_BACKGROUND_COLOR,\n eps: VECTOR_GRAPHIC_ICON_BACKGROUND_COLOR,\n sketch: VECTOR_GRAPHIC_ICON_BACKGROUND_COLOR,\n\n // Audio\n mp3: AUDIO_ICON_BACKGROUND_COLOR,\n wav: AUDIO_ICON_BACKGROUND_COLOR,\n wma: AUDIO_ICON_BACKGROUND_COLOR,\n ogg: AUDIO_ICON_BACKGROUND_COLOR,\n\n // Video\n flv: VIDEO_ICON_BACKGROUND_COLOR,\n h264: VIDEO_ICON_BACKGROUND_COLOR,\n mov: VIDEO_ICON_BACKGROUND_COLOR,\n mp4: VIDEO_ICON_BACKGROUND_COLOR,\n mwv: VIDEO_ICON_BACKGROUND_COLOR,\n\n // Compressed:\n zip: COMPRESSED_ICON_BACKGROUND_COLOR,\n '7z': COMPRESSED_ICON_BACKGROUND_COLOR,\n rar: COMPRESSED_ICON_BACKGROUND_COLOR,\n\n // Data\n json: DATA_ICON_BACKGROUND_COLOR,\n yaml: DATA_ICON_BACKGROUND_COLOR,\n sql: DATA_ICON_BACKGROUND_COLOR,\n db: DATA_ICON_BACKGROUND_COLOR,\n dbf: DATA_ICON_BACKGROUND_COLOR,\n};\n\nexport function getIconBackgroundColorForFile(extension: string): string {\n return (\n filetypeBackgroundColorTable[extension.toLowerCase()] \|\|\n DEFAULT_ICON_BACKGROUND_COLOR\n );\n}\n","import { FileInfo } from '../../interface';\nimport { getIconForFile } from './icons';\nimport { getIconFillColorForFile } from './icon-fill-colors';\nimport { getIconBackgroundColorForFile } from './icon-background-colors';\nimport {\n getIconBackgroundColor,\n getIconColor,\n getIconName,\n} from '../icon/get-icon-props';\n\nexport function getFileIcon(file: FileInfo) {\n const name = getIconName(file.icon);\n\n if (name) {\n return name;\n }\n\n const extension = getExtension(file);\n if (!extension) {\n return;\n }\n\n return getIconForFile(extension);\n}\n\nexport function getFileColor(file: FileInfo) {\n const color = getIconColor(file.icon, file.iconColor);\n\n if (color) {\n return color;\n }\n\n const extension = getExtension(file);\n if (!extension) {\n return;\n }\n\n return getIconFillColorForFile(extension);\n}\n\nexport function getFileBackgroundColor(file: FileInfo) {\n const backgroundColor = getIconBackgroundColor(\n file.icon,\n file.iconBackgroundColor\n );\n\n if (backgroundColor) {\n return backgroundColor;\n }\n\n const extension = getExtension(file);\n if (!extension) {\n return;\n }\n\n return getIconBackgroundColorForFile(extension);\n}\n\nexport function getFileExtensionTitle(file: FileInfo) {\n const name = getIconName(file.icon);\n\n if (name) {\n return name;\n }\n\n return getExtension(file);\n}\n\nexport function getExtension(file: FileInfo) {\n if (!file) {\n return;\n }\n\n return file.filename.split('.').pop();\n}\n","/*\n @prop --icon-background-color: Background color of the icon. Defaults to `--contrast-400`.\n * @prop --icon-color: Color of the icon. Defaults to `--contrast-1100`.\n /\n\n:host {\n --icon-background-color: rgb(var(--contrast-400));\n --icon-color: rgb(var(--contrast-1100));\n}\n","import translate from '../../global/translations';\nimport { Chip, FileInfo, Languages } from '../../interface';\nimport { MDCTextField } from '@material/textfield';\nimport {\n Component,\n Element,\n Event,\n EventEmitter,\n h,\n Prop,\n State,\n} from '@stencil/core';\nimport { createRandomString } from '../../util/random-string';\nimport {\n getFileBackgroundColor,\n getFileColor,\n getFileExtensionTitle,\n getFileIcon,\n} from './file-metadata';\n\nconst CHIP_SET_TAG_NAME = 'limel-chip-set';\nconst DEFAULT_FILE_CHIP: Chip = {\n id: null,\n text: null,\n removable: true,\n};\n\n/\n This component lets end-users select a single file from their device\n * storage. Regardless of the user's device or operating system, this component\n * opens up a file picker dialog that allows the user to choose a file.\n \n ## Using correct labels\n \n This file picker can be used in different contexts. The component's distinct\n * visual design including the upload icon hints end-users that this is not a\n * normal input field like other fields in the form for example.\n \n :::important\n * you need to use a descriptive `label` that clarifies the\n * functionality of the file picker, and/or provides users with clear\n * instructions.\n \n Depending on the context, you may need to avoid labels such as:\n * - File\n * - Document\n \n and instead consider using labels like:\n * - Attach a file\n * - Upload a file\n * - Choose a document\n * - Choose a file\n \n and similar phrases...\n * :::\n * @exampleComponent limel-example-file\n * @exampleComponent limel-example-file-custom-icon\n * @exampleComponent limel-example-file-accepted-types\n * @exampleComponent limel-example-file-composite\n /\n@Component({\n tag: 'limel-file',\n shadow: true,\n styleUrl: 'file.scss',\n})\nexport class File {\n /\n The selected file.\n /\n @Prop()\n public value: FileInfo;\n\n /\n The input label.\n /\n @Prop({ reflect: true })\n public label: string;\n\n /\n Set to `true` to indicate that the field is required.\n /\n @Prop({ reflect: true })\n public required: boolean = false;\n\n /\n True if the input should be disabled\n /\n @Prop({ reflect: true })\n public disabled: boolean = false;\n\n /\n Set to `true` to disable adding and removing files, but allow interaction\n * with any already existing file.\n /\n @Prop({ reflect: true })\n public readonly: boolean = false;\n\n /\n Set to `true` to indicate that the current value of the chosen file is\n * invalid.\n /\n @Prop({ reflect: true })\n public invalid = false;\n\n /\n The [accepted file types](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input/file#unique_file_type_specifiers)\n /\n @Prop({ reflect: true })\n public accept: string = '';\n\n /*\n Defines the localisation for translations.\n /\n @Prop()\n public language: Languages = 'en';\n\n /\n Dispatched when a file is selected/deselected\n /\n @Event()\n private change: EventEmitter<FileInfo>;\n\n /\n Dispatched when clicking on a chip\n */\n @Event()\n private interact: EventEmitter<number \| string>;\n\n @Element()\n private element: HTMLLimelFileElement;\n\n @State()\n private isDraggingOverDropZone = false;\n\n private fileInput: HTMLInputElement;\n private fileInputId = createRandomString();\n private chipSet;\n private mdcTextField;\n\n constructor() {\n this.handleFileSelection = this.handleFileSelection.bind(this);\n this.handleFileChange = this.handleFileChange.bind(this);\n this.handleChipSetChange = this.handleChipSetChange.bind(this);\n this.handleFileDrop = this.handleFileDrop.bind(this);\n this.handleKeyDown = this.handleKeyDown.bind(this);\n this.handleKeyUp = this.handleKeyUp.bind(this);\n this.handleChipInteract = this.handleChipInteract.bind(this);\n }\n\n public connectedCallback() {\n this.initialize();\n }\n\n public componentDidLoad() {\n this.fileInput = this.element.shadowRoot.getElementById(\n this.fileInputId\n ) as HTMLInputElement;\n this.chipSet = this.element.shadowRoot.querySelector(CHIP_SET_TAG_NAME);\n this.initialize();\n }\n\n private initialize() {\n if (!this.chipSet) {\n return;\n }\n\n this.mdcTextField = new MDCTextField(\n this.chipSet.shadowRoot.querySelector('.mdc-text-field')\n );\n }\n\n public disconnectedCallback() {\n if (this.mdcTextField) {\n this.mdcTextField.destroy();\n }\n }\n\n public render() {\n return [\n <input\n hidden={true}\n id={this.fileInputId}\n onChange={this.handleFileChange}\n type=\"file\"\n accept={this.accept}\n disabled={this.disabled \|\| this.readonly}\n />,\n <limel-chip-set\n class={{\n 'is-file-picker': true,\n 'shows-dropzone': true,\n 'highlight-dropzone': this.isDraggingOverDropZone,\n }}\n disabled={this.disabled}\n readonly={this.readonly}\n invalid={this.invalid}\n label={this.label}\n leadingIcon=\"upload_to_cloud\"\n language={this.language}\n onChange={this.handleChipSetChange}\n onClick={this.handleFileSelection}\n onInteract={this.handleChipInteract}\n onKeyDown={this.handleKeyDown}\n onKeyUp={this.handleKeyUp}\n required={this.required}\n type=\"input\"\n value={this.chipArray}\n title={this.getTranslation('drag-and-drop-tips')}\n onDragEnter={this.handleDragEnter}\n onDragOver={this.preventAndStop}\n onDragLeave={this.handleDragLeave}\n onDrop={this.handleFileDrop}\n />,\n ];\n }\n\n private handleDragEnter = (event: DragEvent) => {\n this.isDraggingOverDropZone = true;\n this.preventAndStop(event);\n };\n\n private handleDragLeave = () => {\n this.isDraggingOverDropZone = false;\n };\n\n private handleFileDrop = (event: DragEvent) => {\n this.preventAndStop(event);\n this.isDraggingOverDropZone = false;\n const dataTransfer = event.dataTransfer;\n this.handleFile(dataTransfer.files[0]);\n };\n\n private get chipArray() {\n if (!this.value) {\n return [];\n }\n\n return [\n {\n ...DEFAULT_FILE_CHIP,\n text: this.value.filename,\n id: this.value.id,\n icon: {\n name: getFileIcon(this.value),\n title: getFileExtensionTitle(this.value),\n color: getFileColor(this.value),\n backgroundColor: getFileBackgroundColor(this.value),\n },\n href: this.value.href,\n },\n ];\n }\n\n private handleKeyDown(event: KeyboardEvent) {\n if (\n event.code === 'Tab' \|\|\n event.code === 'Backspace' \|\|\n event.code === 'Enter'\n ) {\n return;\n }\n\n event.preventDefault();\n event.stopPropagation();\n }\n\n private handleKeyUp(event: KeyboardEvent) {\n if (event.code === 'Enter' && !this.value) {\n this.fileInput.click();\n }\n }\n\n private handleFileSelection(event: Event) {\n event.stopPropagation();\n event.preventDefault();\n if (!this.value) {\n this.fileInput.click();\n }\n }\n\n private handleFileChange(event: Event) {\n if (this.fileInput.files.length > 0) {\n event.stopPropagation();\n this.handleFile(this.fileInput.files[0]);\n }\n }\n\n private handleFile(file) {\n const limeFile: FileInfo = {\n id: createRandomString(),\n filename: file.name,\n contentType: file.type,\n size: file.size,\n fileContent: file,\n };\n this.change.emit(limeFile);\n this.chipSet.blur();\n this.mdcTextField.valid = true;\n }\n\n private handleChipSetChange(event: CustomEvent) {\n event.stopPropagation();\n const file = !event.detail.length ? event.detail[0] : null;\n this.chipSet.blur();\n if (!file) {\n this.fileInput.value = '';\n this.change.emit(file);\n if (this.required) {\n this.mdcTextField.valid = false;\n }\n }\n }\n\n private handleChipInteract(event: CustomEvent<Chip>) {\n event.stopPropagation();\n event.preventDefault();\n this.interact.emit(event.detail.id);\n }\n\n private preventAndStop(event: Event) {\n event.stopPropagation();\n event.preventDefault();\n }\n\n private getTranslation(key: string) {\n return translate.get(`file.${key}`, this.language);\n }\n}\n"],"version":3}

package/dist/cjs/limel-helper-line.cjs.entry.js CHANGED Viewed

@@ -4,7 +4,7 @@ Object.defineProperty(exports, '__esModule', { value: true });
 const index = require('./index-38eb64b5.js');
-const helperLineCss = ":host(limel-helper-line){transition:opacity 0.2s ease;box-sizing:border-box;display:grid;min-width:0;font-family:Roboto, sans-serif;-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;font-size:0.6875rem;font-weight:400;letter-spacing:0.0333333333em;line-height:normal;color:rgb(var(--contrast-1200))}div{display:flex;justify-content:space-between;gap:0.75rem;overflow:hidden;padding:0 1rem}:host(limel-helper-line.invalid) .helper-text{color:var(--mdc-theme-error)}.counter{flex-shrink:0;margin-left:auto}.helper-text,.counter{padding-top:0.125rem}:host(limel-helper-line){--limel-h-l-grid-template-rows-transition-speed:0.46s;transition:grid-template-rows var(--limel-h-l-grid-template-rows-transition-speed) cubic-bezier(1, 0.09, 0, 0.89);grid-template-rows:1fr}:host(limel-helper-line.hide){--limel-h-l-grid-template-rows-transition-speed:0.3s;grid-template-rows:0fr}";
+const helperLineCss = ":host(limel-helper-line){transition:opacity 0.2s ease;box-sizing:border-box;display:grid;min-width:0;font-family:Roboto, sans-serif;-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;font-size:0.6875rem;font-weight:400;letter-spacing:0.0333333333em;line-height:normal;color:rgb(var(--contrast-1200))}div{display:flex;justify-content:space-between;gap:0.75rem;overflow:hidden;padding:0 1rem}:host(limel-helper-line.invalid) .helper-text{color:var(--mdc-theme-error)}.counter{flex-shrink:0;margin-left:auto}.helper-text,.counter{padding-top:0.125rem}:host(limel-helper-line){transition:grid-template-rows var(--limel-h-l-grid-template-rows-transition-speed, 0.46s) cubic-bezier(1, 0.09, 0, 0.89);grid-template-rows:var(--limel-h-l-grid-template-rows, 1fr)}:host(limel-helper-line.hide){--limel-h-l-grid-template-rows-transition-speed:0.3s;--limel-h-l-grid-template-rows:0fr}";
 const HelperLine = class {
   constructor(hostRef) {

package/dist/cjs/limel-helper-line.cjs.entry.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"file":"limel-helper-line.entry.cjs.js","mappings":";;;;;;AAAA,MAAM,aAAa,GAAG,~~03BAA03B~~;;~~MC0Bn4B~~,UAAU;;;IAqDX,eAAU,GAAG;MACjB,OAAO,CAAC,EACJ,IAAI,CAAC,SAAS,GAAG,CAAC;SACjB,IAAI,CAAC,UAAU,IAAI,IAAI,CAAC,UAAU,CAAC,MAAM,GAAG,CAAC,CAAC,CAClD,CAAC;KACL,CAAC;IAEM,qBAAgB,GAAG;MACvB,IAAI,CAAC,IAAI,CAAC,UAAU,EAAE;QAClB,OAAO;OACV;MAED,QACIA,kBAAM,KAAK,EAAC,aAAa,EAAC,EAAE,EAAE,IAAI,CAAC,YAAY,IAC1C,IAAI,CAAC,UAAU,CACb,EACT;KACL,CAAC;IAEM,2BAAsB,GAAG;MAC7B,MAAM,OAAO,GAAG,GAAG,IAAI,CAAC,MAAM,MAAM,IAAI,CAAC,SAAS,EAAE,CAAC;MAErD,IAAI,CAAC,IAAI,CAAC,SAAS,EAAE;QACjB,OAAO;OACV;MAED,OAAOA,kBAAM,KAAK,EAAC,SAAS,IAAE,OAAO,CAAQ,CAAC;KACjD,CAAC;;;;mBArDyB,KAAK;;;EAQzB,MAAM;IACT,QACIA,QAACC,UAAI,IACD,QAAQ,EAAE,CAAC,CAAC,EACZ,KAAK,EAAE;QACH,OAAO,EAAE,IAAI,CAAC,OAAO;OACxB,EACD,KAAK,EAAE,CAAC,IAAI,CAAC,UAAU,EAAE,GAAG,EAAE,OAAO,EAAE,MAAM,EAAE,GAAG,EAAE,iBACvC,CAAC,IAAI,CAAC,UAAU,EAAE,IAE/BD,qBACK,IAAI,CAAC,gBAAgB,EAAE,EACvB,IAAI,CAAC,sBAAsB,EAAE,CAC5B,CACH,EACT;GACL;;;;;;","names":["h","Host"],"sources":["./src/components/helper-line/helper-line.scss?tag=limel-helper-line&encapsulation=shadow","./src/components/helper-line/helper-line.tsx"],"sourcesContent":[":host(limel-helper-line) {\n transition: opacity 0.2s ease;\n\n box-sizing: border-box;\n display: grid;\n\n min-width: 0; // prevents overflowing, if component is placed in flex containers\n\n font-family: Roboto, sans-serif;\n -moz-osx-font-smoothing: grayscale;\n -webkit-font-smoothing: antialiased;\n font-size: 0.6875rem;\n font-weight: 400;\n letter-spacing: 0.0333333333em; // keeping this for now for consistency, until we get rid of all of them\n line-height: normal;\n\n color: rgb(var(--contrast-1200));\n}\n\ndiv {\n display: flex;\n justify-content: space-between;\n gap: 0.75rem;\n overflow: hidden;\n padding: 0 1rem;\n}\n\n:host(limel-helper-line.invalid) {\n .helper-text {\n color: var(--mdc-theme-error);\n }\n}\n\n.counter {\n flex-shrink: 0;\n margin-left: auto;\n}\n\n.helper-text,\n.counter {\n padding-top: 0.125rem;\n}\n\n// This animates height of the helper line, from `0` to `auto`.\n// To get this animation effect, the consumer component should\n// add `hide` classed accordingly.\n:host(limel-helper-line) {\n ~~--limel-h-l-grid-template-rows-~~transition~~-speed~~: ~~0.46s; // for internal use only!\n\n transition:~~ grid-template-rows\n var(--limel-h-l-grid-template-rows-transition-speed)\n cubic-bezier(1, 0.09, 0, 0.89);\n grid-template-rows: 1fr;\n}\n\n:host(limel-helper-line.hide) {\n --limel-h-l-grid-template-rows-transition-speed: 0.3s;\n grid-template-rows: 0fr;\n}\n// End: animating height\n","import { Component, Host, Prop, h } from '@stencil/core';\n\n/*\n This is an internal and private component that many input fields\n * use to display a helper text, along with a character counter below the\n * input field.\n \n We created this to keep the visual styles the same everywhere\n * and to avoid importing styles separately.\n \n Also this enables us to open the helper line in limel-portal,\n * more easily without having to send the styles to the portal.\n * @exampleComponent limel-example-helper-line\n * @exampleComponent limel-example-helper-line-invalid\n * @exampleComponent limel-example-helper-line-long-text\n * @exampleComponent limel-example-helper-line-long-text-no-counter\n * @exampleComponent limel-example-helper-line-character-counter\n * @exampleComponent limel-example-helper-line-empty\n * @exampleComponent limel-example-helper-line-animation\n * @private\n /\n@Component({\n tag: 'limel-helper-line',\n shadow: true,\n styleUrl: 'helper-line.scss',\n})\nexport class HelperLine {\n /\n The helper text that is displayed on the left side.\n /\n @Prop({ reflect: true })\n public helperText?: string;\n\n /\n Length of the current input value, coming from the parent component.\n * Used in the character counter section on the right side.\n /\n @Prop({ reflect: true })\n public length?: number;\n\n /\n Maximum length of the characters, defined on the parent component.\n * Used in the character counter section on the right side.\n /\n @Prop({ reflect: true })\n public maxLength?: number;\n\n /\n Turns `true`, when the parent component is invalid.\n * For example, when the parent component is `required` but is left empty.\n * Or when the input format is invalid.\n /\n @Prop({ reflect: true })\n public invalid?: boolean = false;\n\n /\n Used by `aria-controls` and `aria-describedby` in the parent component.\n */\n @Prop({ reflect: true })\n public helperTextId?: string;\n\n public render() {\n return (\n <Host\n tabIndex={-1}\n class={{\n invalid: this.invalid,\n }}\n style={!this.hasContent() ? { display: 'none' } : {}}\n aria-hidden={!this.hasContent()}\n >\n <div>\n {this.renderHelperText()}\n {this.renderCharacterCounter()}\n </div>\n </Host>\n );\n }\n\n private hasContent = () => {\n return !!(\n this.maxLength > 0 \|\|\n (this.helperText && this.helperText.length > 0)\n );\n };\n\n private renderHelperText = () => {\n if (!this.helperText) {\n return;\n }\n\n return (\n <span class=\"helper-text\" id={this.helperTextId}>\n {this.helperText}\n </span>\n );\n };\n\n private renderCharacterCounter = () => {\n const counter = `${this.length} / ${this.maxLength}`;\n\n if (!this.maxLength) {\n return;\n }\n\n return <span class=\"counter\">{counter}</span>;\n };\n}\n"],"version":3}
1	+ {"file":"limel-helper-line.entry.cjs.js","mappings":";;;;;;AAAA,MAAM,aAAa,GAAG,43BAA43B;;MC0Br4B,UAAU;;;IAqDX,eAAU,GAAG;MACjB,OAAO,CAAC,EACJ,IAAI,CAAC,SAAS,GAAG,CAAC;SACjB,IAAI,CAAC,UAAU,IAAI,IAAI,CAAC,UAAU,CAAC,MAAM,GAAG,CAAC,CAAC,CAClD,CAAC;KACL,CAAC;IAEM,qBAAgB,GAAG;MACvB,IAAI,CAAC,IAAI,CAAC,UAAU,EAAE;QAClB,OAAO;OACV;MAED,QACIA,kBAAM,KAAK,EAAC,aAAa,EAAC,EAAE,EAAE,IAAI,CAAC,YAAY,IAC1C,IAAI,CAAC,UAAU,CACb,EACT;KACL,CAAC;IAEM,2BAAsB,GAAG;MAC7B,MAAM,OAAO,GAAG,GAAG,IAAI,CAAC,MAAM,MAAM,IAAI,CAAC,SAAS,EAAE,CAAC;MAErD,IAAI,CAAC,IAAI,CAAC,SAAS,EAAE;QACjB,OAAO;OACV;MAED,OAAOA,kBAAM,KAAK,EAAC,SAAS,IAAE,OAAO,CAAQ,CAAC;KACjD,CAAC;;;;mBArDyB,KAAK;;;EAQzB,MAAM;IACT,QACIA,QAACC,UAAI,IACD,QAAQ,EAAE,CAAC,CAAC,EACZ,KAAK,EAAE;QACH,OAAO,EAAE,IAAI,CAAC,OAAO;OACxB,EACD,KAAK,EAAE,CAAC,IAAI,CAAC,UAAU,EAAE,GAAG,EAAE,OAAO,EAAE,MAAM,EAAE,GAAG,EAAE,iBACvC,CAAC,IAAI,CAAC,UAAU,EAAE,IAE/BD,qBACK,IAAI,CAAC,gBAAgB,EAAE,EACvB,IAAI,CAAC,sBAAsB,EAAE,CAC5B,CACH,EACT;GACL;;;;;;","names":["h","Host"],"sources":["./src/components/helper-line/helper-line.scss?tag=limel-helper-line&encapsulation=shadow","./src/components/helper-line/helper-line.tsx"],"sourcesContent":[":host(limel-helper-line) {\n transition: opacity 0.2s ease;\n\n box-sizing: border-box;\n display: grid;\n\n min-width: 0; // prevents overflowing, if component is placed in flex containers\n\n font-family: Roboto, sans-serif;\n -moz-osx-font-smoothing: grayscale;\n -webkit-font-smoothing: antialiased;\n font-size: 0.6875rem;\n font-weight: 400;\n letter-spacing: 0.0333333333em; // keeping this for now for consistency, until we get rid of all of them\n line-height: normal;\n\n color: rgb(var(--contrast-1200));\n}\n\ndiv {\n display: flex;\n justify-content: space-between;\n gap: 0.75rem;\n overflow: hidden;\n padding: 0 1rem;\n}\n\n:host(limel-helper-line.invalid) {\n .helper-text {\n color: var(--mdc-theme-error);\n }\n}\n\n.counter {\n flex-shrink: 0;\n margin-left: auto;\n}\n\n.helper-text,\n.counter {\n padding-top: 0.125rem;\n}\n\n// This animates height of the helper line, from `0` to `auto`.\n// To get this animation effect, the consumer component should\n// add `hide` classed accordingly.\n:host(limel-helper-line) {\n transition: grid-template-rows\n var(--limel-h-l-grid-template-rows-transition-speed, 0.46s)\n cubic-bezier(1, 0.09, 0, 0.89);\n grid-template-rows: var(--limel-h-l-grid-template-rows, 1fr);\n}\n\n:host(limel-helper-line.hide) {\n --limel-h-l-grid-template-rows-transition-speed: 0.3s;\n --limel-h-l-grid-template-rows: 0fr;\n}\n// End: animating height\n","import { Component, Host, Prop, h } from '@stencil/core';\n\n/*\n This is an internal and private component that many input fields\n * use to display a helper text, along with a character counter below the\n * input field.\n \n We created this to keep the visual styles the same everywhere\n * and to avoid importing styles separately.\n \n Also this enables us to open the helper line in limel-portal,\n * more easily without having to send the styles to the portal.\n * @exampleComponent limel-example-helper-line\n * @exampleComponent limel-example-helper-line-invalid\n * @exampleComponent limel-example-helper-line-long-text\n * @exampleComponent limel-example-helper-line-long-text-no-counter\n * @exampleComponent limel-example-helper-line-character-counter\n * @exampleComponent limel-example-helper-line-empty\n * @exampleComponent limel-example-helper-line-animation\n * @private\n /\n@Component({\n tag: 'limel-helper-line',\n shadow: true,\n styleUrl: 'helper-line.scss',\n})\nexport class HelperLine {\n /\n The helper text that is displayed on the left side.\n /\n @Prop({ reflect: true })\n public helperText?: string;\n\n /\n Length of the current input value, coming from the parent component.\n * Used in the character counter section on the right side.\n /\n @Prop({ reflect: true })\n public length?: number;\n\n /\n Maximum length of the characters, defined on the parent component.\n * Used in the character counter section on the right side.\n /\n @Prop({ reflect: true })\n public maxLength?: number;\n\n /\n Turns `true`, when the parent component is invalid.\n * For example, when the parent component is `required` but is left empty.\n * Or when the input format is invalid.\n /\n @Prop({ reflect: true })\n public invalid?: boolean = false;\n\n /\n Used by `aria-controls` and `aria-describedby` in the parent component.\n */\n @Prop({ reflect: true })\n public helperTextId?: string;\n\n public render() {\n return (\n <Host\n tabIndex={-1}\n class={{\n invalid: this.invalid,\n }}\n style={!this.hasContent() ? { display: 'none' } : {}}\n aria-hidden={!this.hasContent()}\n >\n <div>\n {this.renderHelperText()}\n {this.renderCharacterCounter()}\n </div>\n </Host>\n );\n }\n\n private hasContent = () => {\n return !!(\n this.maxLength > 0 \|\|\n (this.helperText && this.helperText.length > 0)\n );\n };\n\n private renderHelperText = () => {\n if (!this.helperText) {\n return;\n }\n\n return (\n <span class=\"helper-text\" id={this.helperTextId}>\n {this.helperText}\n </span>\n );\n };\n\n private renderCharacterCounter = () => {\n const counter = `${this.length} / ${this.maxLength}`;\n\n if (!this.maxLength) {\n return;\n }\n\n return <span class=\"counter\">{counter}</span>;\n };\n}\n"],"version":3}

package/dist/cjs/limel-list.cjs.entry.js CHANGED Viewed

@@ -5,6 +5,7 @@ Object.defineProperty(exports, '__esModule', { value: true });
 const index = require('./index-38eb64b5.js');
 const component = require('./component-9c3fa668.js');
 const checkbox_template = require('./checkbox.template-df6fc114.js');
+const getIconProps = require('./get-icon-props-46a7e937.js');
 require('./component-67144c1c.js');
 require('./ponyfill-98ca4766.js');
 require('./keyboard-9477d3a8.js');
@@ -121,15 +122,17 @@ class ListRenderer {
      */
     this.renderIcon = (config, item) => {
       const style = {};
-      if (item.iconColor) {
+      const name = getIconProps.getIconName(item.icon);
+      const color = getIconProps.getIconColor(item.icon, item.iconColor);
+      if (color) {
         if (config.badgeIcons) {
-          style['--icon-background-color'] = item.iconColor;
+          style['--icon-background-color'] = color;
         }
         else {
-          style.color = item.iconColor;
+          style.color = color;
         }
       }
-      return (index.h("limel-icon", { badge: config.badgeIcons, class: "mdc-deprecated-list-item__graphic", name: item.icon, style: style, size: config.iconSize }));
+      return (index.h("limel-icon", { badge: config.badgeIcons, class: "mdc-deprecated-list-item__graphic", name: name, style: style, size: config.iconSize }));
     };
     this.renderDivider = () => {
       const classes = {
@@ -331,6 +334,7 @@ const List = class {
   }
   componentDidLoad() {
     this.setup();
+    this.triggerIconColorWarning();
   }
   render() {
     var _a;
@@ -374,6 +378,12 @@ const List = class {
       }
     }, 0);
   }
+  triggerIconColorWarning() {
+    if (this.items.some((item) => 'iconColor' in item)) {
+      /* eslint-disable-next-line no-console */
+      console.warn("The `iconColor` prop is deprecated now! Use the new `Icon` interface and instead of `iconColor: 'color-name'` write `icon {name: 'icon-name', color: 'color-name'}`.");
+    }
+  }
   get element() { return index.getElement(this); }
   static get watchers() { return {
     "type": ["handleType"],