npm - @dnncommunity/dnn-elements - Versions diffs - 0.25.0 → 0.25.1 - Mend

@dnncommunity/dnn-elements 0.25.0 → 0.25.1

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 (11) hide show

package/dist/cjs/dnn-dropzone.cjs.entry.js +1 -1
package/dist/cjs/dnn-dropzone.cjs.entry.js.map +1 -1
package/dist/collection/components/dnn-dropzone/dnn-dropzone.css +2 -2
package/dist/dnn/dnn.esm.js +1 -1
package/dist/dnn/p-2ff4df3f.entry.js +2 -0
package/dist/dnn/p-2ff4df3f.entry.js.map +1 -0
package/dist/esm/dnn-dropzone.entry.js +1 -1
package/dist/esm/dnn-dropzone.entry.js.map +1 -1
package/package.json +1 -1
package/dist/dnn/p-00fccd70.entry.js +0 -2
package/dist/dnn/p-00fccd70.entry.js.map +0 -1

package/dist/cjs/dnn-dropzone.cjs.entry.js CHANGED Viewed

@@ -5,7 +5,7 @@ Object.defineProperty(exports, '__esModule', { value: true });
 const index = require('./index-4f25d681.js');
 const stringUtilities = require('./stringUtilities-ffd71dc2.js');
-const dnnDropzoneCss = ":host{--border-color:var(--dnn-color-tertiary-contrast, lightgray);--border-radius:var(--dnn-controls-radius, 5px);--drop-background-color:var(--dnn-color-tertiary, lightblue);display:flex;flex-direction:column;gap:1rem;text-align:center;border:2px dashed var(--border-color);border-radius:var(--border-radius);padding:1rem;transition:all 300ms ease-in-out}:host(.dropping){background-color:var(--drop-background-color)}p{margin:0;padding:0}button{display:flex;justify-content:center;align-items:center;border:0px;margin:0;padding:0;background-color:transparent}button:hover{cursor:pointer}button svg{margin-right:0.5rem}label.upload-file{display:flex;justify-content:center;align-items:center;cursor:pointer}label.upload-file input{display:none}.video-preview{display:flex;flex-direction:column;align-items:center}.video-preview button{margin:1rem}.error{color:red}";
+const dnnDropzoneCss = ":host{--border-color:var(--dnn-color-foreground-light, lightgray);--border-radius:var(--dnn-controls-radius, 5px);--drop-background-color:var(--dnn-color-neutral, #b2b2b2);display:flex;flex-direction:column;gap:1rem;text-align:center;border:2px dashed var(--border-color);border-radius:var(--border-radius);padding:1rem;transition:all 300ms ease-in-out}:host(.dropping){background-color:var(--drop-background-color)}p{margin:0;padding:0}button{display:flex;justify-content:center;align-items:center;border:0px;margin:0;padding:0;background-color:transparent}button:hover{cursor:pointer}button svg{margin-right:0.5rem}label.upload-file{display:flex;justify-content:center;align-items:center;cursor:pointer}label.upload-file input{display:none}.video-preview{display:flex;flex-direction:column;align-items:center}.video-preview button{margin:1rem}.error{color:red}";
 const DnnDropzoneStyle0 = dnnDropzoneCss;
 const DnnDropzone = class {

package/dist/cjs/dnn-dropzone.cjs.entry.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"file":"dnn-dropzone.entry.cjs.js","mappings":"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","names":["h","Host","getReadableFileSizeString"],"sources":["src/components/dnn-dropzone/dnn-dropzone.scss?tag=dnn-dropzone&encapsulation=shadow","src/components/dnn-dropzone/dnn-dropzone.tsx"],"sourcesContent":["\n:host {\n /** \n * @prop --border-color: The color of the border.\n * @prop --border-radius: The radius of the controls borders.\n * @prop --drop-background-color: The color of the background when a file is dropping.\n /\n --border-color: var(--dnn-color-tertiary-contrast, lightgray);\n --border-radius: var(--dnn-controls-radius, 5px);\n --drop-background-color: var(--dnn-color-tertiary, lightblue);\n\n display: flex;\n flex-direction: column;\n gap: 1rem;\n text-align: center;\n border: 2px dashed var(--border-color);\n border-radius: var(--border-radius);\n padding: 1rem;\n transition: all 300ms ease-in-out;\n}\n\n:host(.dropping){\n background-color: var(--drop-background-color);\n}\np{\n margin: 0;\n padding: 0;\n}\nbutton{\n display: flex;\n justify-content: center;\n align-items: center;\n border: 0px;\n margin: 0;\n padding: 0;\n background-color: transparent;\n &:hover{\n cursor: pointer;\n }\n svg{\n margin-right: 0.5rem;\n }\n}\nlabel.upload-file{\n display: flex;\n justify-content: center;\n align-items: center;\n cursor: pointer;\n input{\n display: none;\n }\n}\n.video-preview{\n display: flex;\n flex-direction: column;\n align-items: center;\n button{\n margin: 1rem;\n }\n}\n.error {\n color:red;\n}","import { Component, Host, h, Prop, State, Event, EventEmitter, Watch, AttachInternals } from '@stencil/core';\nimport { getReadableFileSizeString } from '../../utilities/stringUtilities';\nimport { DropzoneResx } from './types';\n\n@Component({\n tag: 'dnn-dropzone',\n styleUrl: 'dnn-dropzone.scss',\n shadow: true,\n formAssociated: true,\n})\nexport class DnnDropzone {\n /* Localization strings /\n @Prop() resx:DropzoneResx;\n\n /* A list of allowed file extensions.\n * If not specified, any file is allowed.\n * Ex: [\"jpg\", \"jpeg\", \"gif\", \"png\"]\n /\n @Prop() allowedExtensions: string[];\n\n /\n If true, will allow the user to take a snapshot\n * using the device camera. (only works over https).\n /\n @Prop() allowCameraMode: boolean = false;\n\n /\n Specifies the jpeg quality for when the device\n * camera is used to generate a picture.\n * Needs to be a number between 0 and 1 and defaults to 0.8\n /\n @Prop() captureQuality: number = 0.8;\n\n /\n Max file size in bytes.\n /\n @Prop() maxFileSize?: number;\n\n /* The name of the field when used in a form. /\n @Prop() name: string;\n\n /* Fires when file were selected. */\n @Event() filesSelected: EventEmitter<File[]>;\n \n @State() canTakeSnapshots: boolean = false;\n @State() takingPicture: boolean = false;\n @State() fileTooLarge: boolean = false;\n @State() invalidExtension: boolean = false;\n @State() localResx: DropzoneResx;\n @State() focused = false;\n\n @AttachInternals() internals: ElementInternals;\n\n private dropzone: HTMLElement;\n private fileInput: HTMLInputElement;\n private videoPreview: HTMLVideoElement;\n private uploadLabel: HTMLLabelElement;\n private videoSettings!: MediaTrackSettings;\n private defaultResx: DropzoneResx = {\n dragAndDropFile: \"Drag and drop a file\",\n capture: \"Capture\",\n or: \"or\",\n takePicture: \"Take a picture\",\n uploadFile: \"Upload a file\",\n uploadSizeTooLarge: \"The file you tried to upload is too large.\",\n fileSizeLimit: \"The maximum size is {0}\",\n invalidExtension: \"The file you tried to upload has an invalid extension.\",\n allowedFileExtensions: \"Allowed file extensions: {0}\",\n }\n\n componentWillLoad() {\n this.mergeResx();\n }\n\n componentDidLoad() {\n if (this.allowCameraMode){\n this.checkIfBrowserCanTakeSnapshots()\n .then(result => this.canTakeSnapshots = result);\n }\n if (this.allowedExtensions != undefined && this.allowedExtensions.length > 0){\n var extensionsWithDots = this.allowedExtensions.map(e => `.${e}`);\n var extensionsList = extensionsWithDots.join(\",\");\n this.fileInput.accept = extensionsList;\n }\n }\n\n @Watch('resx')\n resxChanged() {\n this.mergeResx();\n }\n\n // eslint-disable-next-line @stencil-community/own-methods-must-be-private\n formResetCallback() {\n this.internals.setValidity({});\n this.fileInput.value = \"\";\n this.internals.setFormValue(\"\");\n }\n\n private mergeResx(): void {\n this.localResx = {...this.defaultResx, ...this.resx};\n }\n\n private checkIfBrowserCanTakeSnapshots(): Promise<boolean> {\n return new Promise((resolve) => {\n const mediaDevices = navigator.mediaDevices;\n if (mediaDevices == undefined \|\| mediaDevices.enumerateDevices == undefined) {\n resolve(false);\n }\n mediaDevices.enumerateDevices()\n .then(devices => {\n var result = devices.some(device => device.kind == \"videoinput\");\n resolve(result);\n });\n });\n }\n\n private getFilesFromFileList(files: FileList) : File[] {\n var fileList: File[] = [];\n for (let index = 0; index < files.length; index++) {\n const file = files[index];\n fileList.push(file);\n }\n\n return fileList;\n }\n\n private isAnyFileLargerThanAllowed (files:File[]) : boolean {\n if (this.maxFileSize == undefined \|\| this.maxFileSize <= 0) {\n return false;\n } \n\n if ( files.some(file => file.size > this.maxFileSize )) {\n return true;\n }\n\n return false;\n }\n\n private handleUploadKeyDown(event: KeyboardEvent) {\n if (event.key === 'Enter' \|\| event.key === ' ') {\n event.preventDefault();\n this.fileInput.click();\n }\n }\n\n private handleUploadButton(element: HTMLInputElement): void {\n this.fileTooLarge = false;\n this.invalidExtension = false;\n let files = this.getFilesFromFileList(element.files);\n \n if (this.isAnyFileLargerThanAllowed(files)) {\n this.fileTooLarge = true;\n return;\n }\n\n if (this.hasInvalidExtensions(files)){\n this.invalidExtension = true;\n return;\n }\n\n this.filesSelected.emit(files);\n if (this.name != undefined && this.name.length > 0){\n var data = new FormData();\n files.forEach(file => {\n data.append(this.name, file);\n });\n this.internals.setFormValue(data);\n }\n }\n\n private handleDragOver = (event: DragEvent) => \n {\n event.stopPropagation();\n event.preventDefault();\n event.dataTransfer.dropEffect = \"copy\";\n this.dropzone.classList.add(\"dropping\");\n };\n\n private hasInvalidExtensions(files: File[]): boolean{\n var hasInvalid = false;\n for (let fileIndex = 0; fileIndex < files.length; fileIndex++) {\n const file = files[fileIndex];\n var regex = /(?:\\.([^.]+))?$/;\n const fileExtension = regex.exec(file.name)[1]?.toLowerCase();\n if (fileExtension == undefined){\n hasInvalid = true;\n }\n\n var loweredAllowedExtensions = this.allowedExtensions?.map(e => e.toLowerCase());\n if (this.allowedExtensions != undefined && !loweredAllowedExtensions?.includes(fileExtension)){\n hasInvalid = true;\n }\n\n return hasInvalid;\n }\n }\n\n private handleDrop = (dropEvent: DragEvent) => {\n this.invalidExtension = false;\n this.fileTooLarge = false;\n dropEvent.stopPropagation();\n dropEvent.preventDefault();\n const files = dropEvent.dataTransfer.files;\n\n if (this.hasInvalidExtensions(Array.from(files))){\n this.invalidExtension = true;\n return;\n }\n\n if (this.isAnyFileLargerThanAllowed(Array.from(files))) {\n this.fileTooLarge = true;\n return;\n }\n\n var fileList = this.getFilesFromFileList(files);\n this.filesSelected.emit(fileList);\n };\n\n private takeSnapshot(): void {\n this.takingPicture = true;\n navigator.mediaDevices.getUserMedia({video: true, audio: false})\n .then(stream => {\n stream\n this.videoPreview.srcObject = stream;\n this.videoPreview.play()\n .then(() => {\n this.videoSettings = stream.getVideoTracks()[0].getSettings();\n });\n })\n .catch(error => alert(error));\n }\n\n private applySnapshot(): void {\n var canvas = document.createElement(\"canvas\");\n const context = canvas.getContext(\"2d\");\n canvas.width = this.videoSettings.width;\n canvas.height = this.videoSettings.height;\n context.drawImage(this.videoPreview, 0, 0);\n canvas.toBlob(blob => {\n var file = new File([blob], \"image.jpeg\", {type:\"image/jpeg\"});\n this.takingPicture = false;\n \n var fileList = [file];\n this.filesSelected.emit(fileList)\n }, \"image/jpeg\", this.captureQuality);\n }\n\n private getInvalidExtensionsMessage() {\n var message = this.localResx.allowedFileExtensions;\n var message = message.replace(\"{0}\", this.allowedExtensions.join(\", \"));\n return message;\n }\n \n render() {\n return (\n <Host\n ref={e => this.dropzone = e}\n class=\"dropzone\"\n onDragOver={e => this.handleDragOver(e)}\n onDrop={e => this.handleDrop(e)}\n onDragLeave={() => this.dropzone.classList.remove(\"dropping\")}\n tabIndex={this.focused ? -1 : 0}\n onFocus={() => this.uploadLabel.focus()}\n onBlur={() => this.uploadLabel.blur()}\n >\n {!this.takingPicture &&\n [\n <p>{this.localResx?.dragAndDropFile}</p>\n ,\n <p>- {this.localResx?.or} -</p>\n ,\n <label\n class=\"upload-file\"\n tabIndex={0}\n onKeyDown={e => this.handleUploadKeyDown(e)}\n ref={el => this.uploadLabel = el}\n onFocus={() => this.focused = true}\n onBlur={() => this.focused = false}\n >\n <input\n type=\"file\"\n ref={el => this.fileInput = el}\n onChange={e => this.handleUploadButton(e.target as HTMLInputElement)}\n >\n </input>\n <span>\n <svg\n xmlns=\"http://www.w3.org/2000/svg\"\n enable-background=\"new 0 0 24 24\"\n height=\"24px\"\n viewBox=\"0 0 24 24\"\n width=\"24px\"\n fill=\"#000000\">\n <g><rect fill=\"none\" height=\"24\" width=\"24\"/></g>\n <g><path d=\"M5,20h14v-2H5V20z M5,10h4v6h6v-6h4l-7-7L5,10z\"/></g>\n </svg>\n </span>\n  \n {this.localResx?.uploadFile}\n </label>\n ,\n this.canTakeSnapshots &&\n [\n <p>- {this.localResx?.or} -</p>\n ,\n <button\n onClick={() => this.takeSnapshot()}\n >\n <svg xmlns=\"http://www.w3.org/2000/svg\" height=\"24px\" viewBox=\"0 0 24 24\" width=\"24px\" fill=\"#000000\"><path d=\"M0 0h24v24H0z\" fill=\"none\"/><circle cx=\"12\" cy=\"12\" r=\"3.2\"/><path d=\"M9 2L7.17 4H4c-1.1 0-2 .9-2 2v12c0 1.1.9 2 2 2h16c1.1 0 2-.9 2-2V6c0-1.1-.9-2-2-2h-3.17L15 2H9zm3 15c-2.76 0-5-2.24-5-5s2.24-5 5-5 5 2.24 5 5-2.24 5-5 5z\"/></svg>\n {this.localResx?.takePicture}\n </button>\n ]\n ]\n }\n {this.takingPicture &&\n <div class=\"video-preview\">\n <video ref={e => this.videoPreview = e} />\n <button\n onClick={() => this.applySnapshot()}\n >\n <svg xmlns=\"http://www.w3.org/2000/svg\" height=\"24px\" viewBox=\"0 0 24 24\" width=\"24px\" fill=\"#000000\"><path d=\"M0 0h24v24H0z\" fill=\"none\"/><circle cx=\"12\" cy=\"12\" r=\"3.2\"/><path d=\"M9 2L7.17 4H4c-1.1 0-2 .9-2 2v12c0 1.1.9 2 2 2h16c1.1 0 2-.9 2-2V6c0-1.1-.9-2-2-2h-3.17L15 2H9zm3 15c-2.76 0-5-2.24-5-5s2.24-5 5-5 5 2.24 5 5-2.24 5-5 5z\"/></svg> \n {this.localResx?.capture}\n </button>\n </div>\n }\n { this.fileTooLarge && \n <div class='error'>\n <p>\n {this.localResx.uploadSizeTooLarge}\n <br/>\n {this.localResx.fileSizeLimit.replace(\"{0}\", getReadableFileSizeString(this.maxFileSize)) } \n </p>\n </div>\n }\n { this.invalidExtension &&\n <div class='error'>\n <p>\n {this.localResx.invalidExtension}\n <br/>\n {this.getInvalidExtensionsMessage()}\n </p>\n </div>\n }\n </Host>\n );\n }\n}\n"],"version":3}
1	+ {"file":"dnn-dropzone.entry.cjs.js","mappings":"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","names":["h","Host","getReadableFileSizeString"],"sources":["src/components/dnn-dropzone/dnn-dropzone.scss?tag=dnn-dropzone&encapsulation=shadow","src/components/dnn-dropzone/dnn-dropzone.tsx"],"sourcesContent":["\n:host {\n /** \n * @prop --border-color: The color of the border.\n * @prop --border-radius: The radius of the controls borders.\n * @prop --drop-background-color: The color of the background when a file is dropping.\n /\n --border-color: var(--dnn-color-foreground-light, lightgray);\n --border-radius: var(--dnn-controls-radius, 5px);\n --drop-background-color: var(--dnn-color-neutral, #b2b2b2);\n\n display: flex;\n flex-direction: column;\n gap: 1rem;\n text-align: center;\n border: 2px dashed var(--border-color);\n border-radius: var(--border-radius);\n padding: 1rem;\n transition: all 300ms ease-in-out;\n}\n\n:host(.dropping){\n background-color: var(--drop-background-color);\n}\np{\n margin: 0;\n padding: 0;\n}\nbutton{\n display: flex;\n justify-content: center;\n align-items: center;\n border: 0px;\n margin: 0;\n padding: 0;\n background-color: transparent;\n &:hover{\n cursor: pointer;\n }\n svg{\n margin-right: 0.5rem;\n }\n}\nlabel.upload-file{\n display: flex;\n justify-content: center;\n align-items: center;\n cursor: pointer;\n input{\n display: none;\n }\n}\n.video-preview{\n display: flex;\n flex-direction: column;\n align-items: center;\n button{\n margin: 1rem;\n }\n}\n.error {\n color:red;\n}","import { Component, Host, h, Prop, State, Event, EventEmitter, Watch, AttachInternals } from '@stencil/core';\nimport { getReadableFileSizeString } from '../../utilities/stringUtilities';\nimport { DropzoneResx } from './types';\n\n@Component({\n tag: 'dnn-dropzone',\n styleUrl: 'dnn-dropzone.scss',\n shadow: true,\n formAssociated: true,\n})\nexport class DnnDropzone {\n /* Localization strings /\n @Prop() resx:DropzoneResx;\n\n /* A list of allowed file extensions.\n * If not specified, any file is allowed.\n * Ex: [\"jpg\", \"jpeg\", \"gif\", \"png\"]\n /\n @Prop() allowedExtensions: string[];\n\n /\n If true, will allow the user to take a snapshot\n * using the device camera. (only works over https).\n /\n @Prop() allowCameraMode: boolean = false;\n\n /\n Specifies the jpeg quality for when the device\n * camera is used to generate a picture.\n * Needs to be a number between 0 and 1 and defaults to 0.8\n /\n @Prop() captureQuality: number = 0.8;\n\n /\n Max file size in bytes.\n /\n @Prop() maxFileSize?: number;\n\n /* The name of the field when used in a form. /\n @Prop() name: string;\n\n /* Fires when file were selected. */\n @Event() filesSelected: EventEmitter<File[]>;\n \n @State() canTakeSnapshots: boolean = false;\n @State() takingPicture: boolean = false;\n @State() fileTooLarge: boolean = false;\n @State() invalidExtension: boolean = false;\n @State() localResx: DropzoneResx;\n @State() focused = false;\n\n @AttachInternals() internals: ElementInternals;\n\n private dropzone: HTMLElement;\n private fileInput: HTMLInputElement;\n private videoPreview: HTMLVideoElement;\n private uploadLabel: HTMLLabelElement;\n private videoSettings!: MediaTrackSettings;\n private defaultResx: DropzoneResx = {\n dragAndDropFile: \"Drag and drop a file\",\n capture: \"Capture\",\n or: \"or\",\n takePicture: \"Take a picture\",\n uploadFile: \"Upload a file\",\n uploadSizeTooLarge: \"The file you tried to upload is too large.\",\n fileSizeLimit: \"The maximum size is {0}\",\n invalidExtension: \"The file you tried to upload has an invalid extension.\",\n allowedFileExtensions: \"Allowed file extensions: {0}\",\n }\n\n componentWillLoad() {\n this.mergeResx();\n }\n\n componentDidLoad() {\n if (this.allowCameraMode){\n this.checkIfBrowserCanTakeSnapshots()\n .then(result => this.canTakeSnapshots = result);\n }\n if (this.allowedExtensions != undefined && this.allowedExtensions.length > 0){\n var extensionsWithDots = this.allowedExtensions.map(e => `.${e}`);\n var extensionsList = extensionsWithDots.join(\",\");\n this.fileInput.accept = extensionsList;\n }\n }\n\n @Watch('resx')\n resxChanged() {\n this.mergeResx();\n }\n\n // eslint-disable-next-line @stencil-community/own-methods-must-be-private\n formResetCallback() {\n this.internals.setValidity({});\n this.fileInput.value = \"\";\n this.internals.setFormValue(\"\");\n }\n\n private mergeResx(): void {\n this.localResx = {...this.defaultResx, ...this.resx};\n }\n\n private checkIfBrowserCanTakeSnapshots(): Promise<boolean> {\n return new Promise((resolve) => {\n const mediaDevices = navigator.mediaDevices;\n if (mediaDevices == undefined \|\| mediaDevices.enumerateDevices == undefined) {\n resolve(false);\n }\n mediaDevices.enumerateDevices()\n .then(devices => {\n var result = devices.some(device => device.kind == \"videoinput\");\n resolve(result);\n });\n });\n }\n\n private getFilesFromFileList(files: FileList) : File[] {\n var fileList: File[] = [];\n for (let index = 0; index < files.length; index++) {\n const file = files[index];\n fileList.push(file);\n }\n\n return fileList;\n }\n\n private isAnyFileLargerThanAllowed (files:File[]) : boolean {\n if (this.maxFileSize == undefined \|\| this.maxFileSize <= 0) {\n return false;\n } \n\n if ( files.some(file => file.size > this.maxFileSize )) {\n return true;\n }\n\n return false;\n }\n\n private handleUploadKeyDown(event: KeyboardEvent) {\n if (event.key === 'Enter' \|\| event.key === ' ') {\n event.preventDefault();\n this.fileInput.click();\n }\n }\n\n private handleUploadButton(element: HTMLInputElement): void {\n this.fileTooLarge = false;\n this.invalidExtension = false;\n let files = this.getFilesFromFileList(element.files);\n \n if (this.isAnyFileLargerThanAllowed(files)) {\n this.fileTooLarge = true;\n return;\n }\n\n if (this.hasInvalidExtensions(files)){\n this.invalidExtension = true;\n return;\n }\n\n this.filesSelected.emit(files);\n if (this.name != undefined && this.name.length > 0){\n var data = new FormData();\n files.forEach(file => {\n data.append(this.name, file);\n });\n this.internals.setFormValue(data);\n }\n }\n\n private handleDragOver = (event: DragEvent) => \n {\n event.stopPropagation();\n event.preventDefault();\n event.dataTransfer.dropEffect = \"copy\";\n this.dropzone.classList.add(\"dropping\");\n };\n\n private hasInvalidExtensions(files: File[]): boolean{\n var hasInvalid = false;\n for (let fileIndex = 0; fileIndex < files.length; fileIndex++) {\n const file = files[fileIndex];\n var regex = /(?:\\.([^.]+))?$/;\n const fileExtension = regex.exec(file.name)[1]?.toLowerCase();\n if (fileExtension == undefined){\n hasInvalid = true;\n }\n\n var loweredAllowedExtensions = this.allowedExtensions?.map(e => e.toLowerCase());\n if (this.allowedExtensions != undefined && !loweredAllowedExtensions?.includes(fileExtension)){\n hasInvalid = true;\n }\n\n return hasInvalid;\n }\n }\n\n private handleDrop = (dropEvent: DragEvent) => {\n this.invalidExtension = false;\n this.fileTooLarge = false;\n dropEvent.stopPropagation();\n dropEvent.preventDefault();\n const files = dropEvent.dataTransfer.files;\n\n if (this.hasInvalidExtensions(Array.from(files))){\n this.invalidExtension = true;\n return;\n }\n\n if (this.isAnyFileLargerThanAllowed(Array.from(files))) {\n this.fileTooLarge = true;\n return;\n }\n\n var fileList = this.getFilesFromFileList(files);\n this.filesSelected.emit(fileList);\n };\n\n private takeSnapshot(): void {\n this.takingPicture = true;\n navigator.mediaDevices.getUserMedia({video: true, audio: false})\n .then(stream => {\n stream\n this.videoPreview.srcObject = stream;\n this.videoPreview.play()\n .then(() => {\n this.videoSettings = stream.getVideoTracks()[0].getSettings();\n });\n })\n .catch(error => alert(error));\n }\n\n private applySnapshot(): void {\n var canvas = document.createElement(\"canvas\");\n const context = canvas.getContext(\"2d\");\n canvas.width = this.videoSettings.width;\n canvas.height = this.videoSettings.height;\n context.drawImage(this.videoPreview, 0, 0);\n canvas.toBlob(blob => {\n var file = new File([blob], \"image.jpeg\", {type:\"image/jpeg\"});\n this.takingPicture = false;\n \n var fileList = [file];\n this.filesSelected.emit(fileList)\n }, \"image/jpeg\", this.captureQuality);\n }\n\n private getInvalidExtensionsMessage() {\n var message = this.localResx.allowedFileExtensions;\n var message = message.replace(\"{0}\", this.allowedExtensions.join(\", \"));\n return message;\n }\n \n render() {\n return (\n <Host\n ref={e => this.dropzone = e}\n class=\"dropzone\"\n onDragOver={e => this.handleDragOver(e)}\n onDrop={e => this.handleDrop(e)}\n onDragLeave={() => this.dropzone.classList.remove(\"dropping\")}\n tabIndex={this.focused ? -1 : 0}\n onFocus={() => this.uploadLabel.focus()}\n onBlur={() => this.uploadLabel.blur()}\n >\n {!this.takingPicture &&\n [\n <p>{this.localResx?.dragAndDropFile}</p>\n ,\n <p>- {this.localResx?.or} -</p>\n ,\n <label\n class=\"upload-file\"\n tabIndex={0}\n onKeyDown={e => this.handleUploadKeyDown(e)}\n ref={el => this.uploadLabel = el}\n onFocus={() => this.focused = true}\n onBlur={() => this.focused = false}\n >\n <input\n type=\"file\"\n ref={el => this.fileInput = el}\n onChange={e => this.handleUploadButton(e.target as HTMLInputElement)}\n >\n </input>\n <span>\n <svg\n xmlns=\"http://www.w3.org/2000/svg\"\n enable-background=\"new 0 0 24 24\"\n height=\"24px\"\n viewBox=\"0 0 24 24\"\n width=\"24px\"\n fill=\"#000000\">\n <g><rect fill=\"none\" height=\"24\" width=\"24\"/></g>\n <g><path d=\"M5,20h14v-2H5V20z M5,10h4v6h6v-6h4l-7-7L5,10z\"/></g>\n </svg>\n </span>\n  \n {this.localResx?.uploadFile}\n </label>\n ,\n this.canTakeSnapshots &&\n [\n <p>- {this.localResx?.or} -</p>\n ,\n <button\n onClick={() => this.takeSnapshot()}\n >\n <svg xmlns=\"http://www.w3.org/2000/svg\" height=\"24px\" viewBox=\"0 0 24 24\" width=\"24px\" fill=\"#000000\"><path d=\"M0 0h24v24H0z\" fill=\"none\"/><circle cx=\"12\" cy=\"12\" r=\"3.2\"/><path d=\"M9 2L7.17 4H4c-1.1 0-2 .9-2 2v12c0 1.1.9 2 2 2h16c1.1 0 2-.9 2-2V6c0-1.1-.9-2-2-2h-3.17L15 2H9zm3 15c-2.76 0-5-2.24-5-5s2.24-5 5-5 5 2.24 5 5-2.24 5-5 5z\"/></svg>\n {this.localResx?.takePicture}\n </button>\n ]\n ]\n }\n {this.takingPicture &&\n <div class=\"video-preview\">\n <video ref={e => this.videoPreview = e} />\n <button\n onClick={() => this.applySnapshot()}\n >\n <svg xmlns=\"http://www.w3.org/2000/svg\" height=\"24px\" viewBox=\"0 0 24 24\" width=\"24px\" fill=\"#000000\"><path d=\"M0 0h24v24H0z\" fill=\"none\"/><circle cx=\"12\" cy=\"12\" r=\"3.2\"/><path d=\"M9 2L7.17 4H4c-1.1 0-2 .9-2 2v12c0 1.1.9 2 2 2h16c1.1 0 2-.9 2-2V6c0-1.1-.9-2-2-2h-3.17L15 2H9zm3 15c-2.76 0-5-2.24-5-5s2.24-5 5-5 5 2.24 5 5-2.24 5-5 5z\"/></svg> \n {this.localResx?.capture}\n </button>\n </div>\n }\n { this.fileTooLarge && \n <div class='error'>\n <p>\n {this.localResx.uploadSizeTooLarge}\n <br/>\n {this.localResx.fileSizeLimit.replace(\"{0}\", getReadableFileSizeString(this.maxFileSize)) } \n </p>\n </div>\n }\n { this.invalidExtension &&\n <div class='error'>\n <p>\n {this.localResx.invalidExtension}\n <br/>\n {this.getInvalidExtensionsMessage()}\n </p>\n </div>\n }\n </Host>\n );\n }\n}\n"],"version":3}

package/dist/collection/components/dnn-dropzone/dnn-dropzone.css CHANGED Viewed

@@ -4,9 +4,9 @@
   * @prop --border-radius: The radius of the controls borders.
   * @prop --drop-background-color: The color of the background when a file is dropping.
   */
-  --border-color: var(--dnn-color-tertiary-contrast, lightgray);
+  --border-color: var(--dnn-color-foreground-light, lightgray);
   --border-radius: var(--dnn-controls-radius, 5px);
-  --drop-background-color: var(--dnn-color-tertiary, lightblue);
+  --drop-background-color: var(--dnn-color-neutral, #b2b2b2);
   display: flex;
   flex-direction: column;
   gap: 1rem;

package/dist/dnn/dnn.esm.js CHANGED Viewed

@@ -1,2 +1,2 @@
-import{p as e,b as a}from"./p-91d08ab2.js";export{s as setNonce}from"./p-91d08ab2.js";import{g as l}from"./p-e1255160.js";var t=()=>{const a=import.meta.url;const l={};if(a!==""){l.resourcesUrl=new URL(".",a).href}return e(l)};t().then((async e=>{await l();return a([["p-107bd5a8",[[65,"dnn-color-input",{color:[1025],contrastColor:[1025,"contrast-color"],lightColor:[1025,"light-color"],darkColor:[1025,"dark-color"],label:[1],readonly:[4],localization:[16],name:[1],helpText:[1,"help-text"],useContrastColor:[4,"use-contrast-color"],useLightColor:[4,"use-light-color"],useDarkColor:[4,"use-dark-color"],currentColor:[32],focused:[32]},null,{currentColor:["currentColorChanged"]}]]],["p-ef6a902d",[[65,"dnn-image-cropper",{width:[2],height:[2],resx:[16],quality:[2],preventUndersized:[4,"prevent-undersized"],name:[1],view:[32],localResx:[32],fileName:[32],focused:[32],clear:[64]},null,{resx:["resxChanged"]}]]],["p-a9d8a942",[[65,"dnn-autocomplete",{label:[1],name:[1],helpText:[1,"help-text"],value:[1537],required:[4],disabled:[4],suggestions:[16],renderSuggestion:[16],totalSuggestions:[2,"total-suggestions"],preloadThresholdPixels:[2,"preload-threshold-pixels"],autocomplete:[1],focused:[32],valid:[32],customValidityMessage:[32],selectedIndex:[32],positionInitialized:[32],lastScrollTop:[32],displayValue:[32],checkValidity:[64],setCustomValidity:[64]},[[4,"click","handleClick"]],{value:["handleValueChange"]}]]],["p-e6bd0f5b",[[65,"dnn-input",{type:[1025],label:[1],name:[1],value:[1544],helpText:[1,"help-text"],required:[4],disabled:[4],autocomplete:[1],min:[8],max:[8],minlength:[2],maxlength:[2],multiple:[4],pattern:[1],readonly:[4],step:[8],disableValidityReporting:[4,"disable-validity-reporting"],allowShowPassword:[4,"allow-show-password"],inputmode:[1],focused:[32],valid:[32],checkValidity:[64],setCustomValidity:[64]}]]],["p-d55632fe",[[65,"dnn-select",{label:[1],name:[1],required:[4],helpText:[1,"help-text"],disabled:[4],disableValidityReporting:[4,"disable-validity-reporting"],autocomplete:[1],value:[1537],focused:[32],valid:[32],customValidityMessage:[32],checkValidity:[64]}]]],["p-88a928f2",[[65,"dnn-textarea",{resizable:[1],value:[1025],label:[1],name:[1],helpText:[1,"help-text"],required:[4],disabled:[4],autocomplete:[1],minlength:[2],maxlength:[2],readonly:[4],rows:[2],focused:[32],valid:[32],customValidityMessage:[32],checkValidity:[64],setCustomValidity:[64]}]]],["p-c12c6683",[[1,"dnn-treeview-item",{expanded:[1540],hasChildren:[32],focused:[32]},null,{expanded:["watchExpanded"]}]]],["p-2b3d9bc1",[[1,"dnn-chevron",{expandText:[1,"expand-text"],collapseText:[1,"collapse-text"],expanded:[1540],focused:[32]},null,{expanded:["handleExpandedChanged"]}]]],["p-c15dfb8b",[[66,"dnn-monaco-editor",{language:[1],value:[1025],name:[1],focused:[32]},null,{language:["languageChanged"],value:["valueChanged"]}]]],["p-b0239140",[[1,"dnn-progress-bar",{value:[2],max:[2],useGradient:[4,"use-gradient"]}]]],["p-9b318120",[[65,"dnn-richtext",{options:[16],value:[1],name:[1],plugins:[16],customizeOptions:[16],focused:[32]},null,{value:["watchValueChanged"]}]]],["p-a645d829",[[1,"dnn-sort-icon",{sortDirection:[1025,"sort-direction"],focused:[32]}]]],["p-8056c270",[[65,"dnn-toggle",{checked:[1028],disabled:[4],name:[1],value:[1],focused:[32]},[[2,"click","handleClick"]],{checked:["checkedChanged"]}]]],["p-cf2aa06f",[[1,"dnn-vertical-overflow-menu",{showDropdownButton:[32],showDropdownMenu:[32]}]]],["p-b8ec5d70",[[1,"dnn-vertical-splitview",{splitterWidth:[2,"splitter-width"],splitWidthPercentage:[1026,"split-width-percentage"],leftWidth:[32],rightWidth:[32],setSplitWidthPercentage:[64],getSplitWidthPercentage:[64]}]]],["p-bff377d5",[[65,"dnn-checkbox",{checked:[1025],useIntermediate:[4,"use-intermediate"],value:[1],name:[1],nextStateHandler:[16],focused:[32]},[[2,"click","handleClick"]],{checked:["handleCheckedChange"]}]]],["p-f4b5a8e5",[[1,"dnn-color-picker",{color:[1],colorBoxHeight:[1,"color-box-height"],currentColor:[32],rgbDisplay:[32],hslDisplay:[32],hexDisplay:[32],focused:[32]},null,{currentColor:["handeCurrentColorChanged"]}]]],["p-00fccd70",[[65,"dnn-dropzone",{resx:[16],allowedExtensions:[16],allowCameraMode:[4,"allow-camera-mode"],captureQuality:[2,"capture-quality"],maxFileSize:[2,"max-file-size"],name:[1],canTakeSnapshots:[32],takingPicture:[32],fileTooLarge:[32],invalidExtension:[32],localResx:[32],focused:[32]},null,{resx:["resxChanged"]}]]],["p-678c5a33",[[1,"dnn-searchbox",{placeholder:[1],debounced:[4],debounceTime:[2,"debounce-time"],query:[1025],focused:[32]},null,{query:["handleQueryChanged"]}]]],["p-3279942a",[[1,"dnn-tab",{tabTitle:[1,"tab-title"],visible:[32],show:[64],hide:[64]}],[1,"dnn-tabs",{tabTitles:[32],selectedTabTitle:[32]}]]],["p-5aa5dc7b",[[1,"dnn-collapsible",{expanded:[516],transitionDuration:[2,"transition-duration"],updateSize:[64]},[[0,"dnnCollapsibleHeightChanged","handleHeightChanged"]],{expanded:["handledExpandedChanged"]}]]],["p-507074b5",[[1,"dnn-modal",{backdropDismiss:[4,"backdrop-dismiss"],closeText:[1,"close-text"],resizable:[4],showCloseButton:[4,"show-close-button"],visible:[1540],show:[64],hide:[64]}]]],["p-36dc982d",[[65,"dnn-button",{type:[1],appearance:[1],formButtonType:[1,"form-button-type"],reversed:[4],size:[1],confirm:[4],confirmYesText:[1,"confirm-yes-text"],confirmNoText:[1,"confirm-no-text"],confirmMessage:[1,"confirm-message"],disabled:[4],focused:[32],modalVisible:[32]}]]],["p-0de82dae",[[1,"dnn-permissions-grid",{permissions:[1040],roleGroups:[16],roles:[16],resx:[16],foundUsers:[16],selectedRoleGroupId:[32],userQuery:[32],pickedUser:[32],localResx:[32],focused:[32]},null,{foundUsers:["handleFoundUsersChanged"],resx:["resxChanged"]}]]],["p-bc2d2d54",[[1,"dnn-fieldset",{focused:[1540],disabled:[1540],invalid:[1540],label:[1],floatLabel:[1540,"float-label"],helpText:[1,"help-text"],resizable:[1],customValidityMessage:[32],setFocused:[64],setBlurred:[64],disable:[64],enable:[64],pinLabel:[64],unpinLabel:[64],setValidity:[64]}]]]],e)}));
+import{p as e,b as a}from"./p-91d08ab2.js";export{s as setNonce}from"./p-91d08ab2.js";import{g as l}from"./p-e1255160.js";var t=()=>{const a=import.meta.url;const l={};if(a!==""){l.resourcesUrl=new URL(".",a).href}return e(l)};t().then((async e=>{await l();return a([["p-107bd5a8",[[65,"dnn-color-input",{color:[1025],contrastColor:[1025,"contrast-color"],lightColor:[1025,"light-color"],darkColor:[1025,"dark-color"],label:[1],readonly:[4],localization:[16],name:[1],helpText:[1,"help-text"],useContrastColor:[4,"use-contrast-color"],useLightColor:[4,"use-light-color"],useDarkColor:[4,"use-dark-color"],currentColor:[32],focused:[32]},null,{currentColor:["currentColorChanged"]}]]],["p-ef6a902d",[[65,"dnn-image-cropper",{width:[2],height:[2],resx:[16],quality:[2],preventUndersized:[4,"prevent-undersized"],name:[1],view:[32],localResx:[32],fileName:[32],focused:[32],clear:[64]},null,{resx:["resxChanged"]}]]],["p-a9d8a942",[[65,"dnn-autocomplete",{label:[1],name:[1],helpText:[1,"help-text"],value:[1537],required:[4],disabled:[4],suggestions:[16],renderSuggestion:[16],totalSuggestions:[2,"total-suggestions"],preloadThresholdPixels:[2,"preload-threshold-pixels"],autocomplete:[1],focused:[32],valid:[32],customValidityMessage:[32],selectedIndex:[32],positionInitialized:[32],lastScrollTop:[32],displayValue:[32],checkValidity:[64],setCustomValidity:[64]},[[4,"click","handleClick"]],{value:["handleValueChange"]}]]],["p-e6bd0f5b",[[65,"dnn-input",{type:[1025],label:[1],name:[1],value:[1544],helpText:[1,"help-text"],required:[4],disabled:[4],autocomplete:[1],min:[8],max:[8],minlength:[2],maxlength:[2],multiple:[4],pattern:[1],readonly:[4],step:[8],disableValidityReporting:[4,"disable-validity-reporting"],allowShowPassword:[4,"allow-show-password"],inputmode:[1],focused:[32],valid:[32],checkValidity:[64],setCustomValidity:[64]}]]],["p-d55632fe",[[65,"dnn-select",{label:[1],name:[1],required:[4],helpText:[1,"help-text"],disabled:[4],disableValidityReporting:[4,"disable-validity-reporting"],autocomplete:[1],value:[1537],focused:[32],valid:[32],customValidityMessage:[32],checkValidity:[64]}]]],["p-88a928f2",[[65,"dnn-textarea",{resizable:[1],value:[1025],label:[1],name:[1],helpText:[1,"help-text"],required:[4],disabled:[4],autocomplete:[1],minlength:[2],maxlength:[2],readonly:[4],rows:[2],focused:[32],valid:[32],customValidityMessage:[32],checkValidity:[64],setCustomValidity:[64]}]]],["p-c12c6683",[[1,"dnn-treeview-item",{expanded:[1540],hasChildren:[32],focused:[32]},null,{expanded:["watchExpanded"]}]]],["p-2b3d9bc1",[[1,"dnn-chevron",{expandText:[1,"expand-text"],collapseText:[1,"collapse-text"],expanded:[1540],focused:[32]},null,{expanded:["handleExpandedChanged"]}]]],["p-c15dfb8b",[[66,"dnn-monaco-editor",{language:[1],value:[1025],name:[1],focused:[32]},null,{language:["languageChanged"],value:["valueChanged"]}]]],["p-b0239140",[[1,"dnn-progress-bar",{value:[2],max:[2],useGradient:[4,"use-gradient"]}]]],["p-9b318120",[[65,"dnn-richtext",{options:[16],value:[1],name:[1],plugins:[16],customizeOptions:[16],focused:[32]},null,{value:["watchValueChanged"]}]]],["p-a645d829",[[1,"dnn-sort-icon",{sortDirection:[1025,"sort-direction"],focused:[32]}]]],["p-8056c270",[[65,"dnn-toggle",{checked:[1028],disabled:[4],name:[1],value:[1],focused:[32]},[[2,"click","handleClick"]],{checked:["checkedChanged"]}]]],["p-cf2aa06f",[[1,"dnn-vertical-overflow-menu",{showDropdownButton:[32],showDropdownMenu:[32]}]]],["p-b8ec5d70",[[1,"dnn-vertical-splitview",{splitterWidth:[2,"splitter-width"],splitWidthPercentage:[1026,"split-width-percentage"],leftWidth:[32],rightWidth:[32],setSplitWidthPercentage:[64],getSplitWidthPercentage:[64]}]]],["p-bff377d5",[[65,"dnn-checkbox",{checked:[1025],useIntermediate:[4,"use-intermediate"],value:[1],name:[1],nextStateHandler:[16],focused:[32]},[[2,"click","handleClick"]],{checked:["handleCheckedChange"]}]]],["p-f4b5a8e5",[[1,"dnn-color-picker",{color:[1],colorBoxHeight:[1,"color-box-height"],currentColor:[32],rgbDisplay:[32],hslDisplay:[32],hexDisplay:[32],focused:[32]},null,{currentColor:["handeCurrentColorChanged"]}]]],["p-2ff4df3f",[[65,"dnn-dropzone",{resx:[16],allowedExtensions:[16],allowCameraMode:[4,"allow-camera-mode"],captureQuality:[2,"capture-quality"],maxFileSize:[2,"max-file-size"],name:[1],canTakeSnapshots:[32],takingPicture:[32],fileTooLarge:[32],invalidExtension:[32],localResx:[32],focused:[32]},null,{resx:["resxChanged"]}]]],["p-678c5a33",[[1,"dnn-searchbox",{placeholder:[1],debounced:[4],debounceTime:[2,"debounce-time"],query:[1025],focused:[32]},null,{query:["handleQueryChanged"]}]]],["p-3279942a",[[1,"dnn-tab",{tabTitle:[1,"tab-title"],visible:[32],show:[64],hide:[64]}],[1,"dnn-tabs",{tabTitles:[32],selectedTabTitle:[32]}]]],["p-5aa5dc7b",[[1,"dnn-collapsible",{expanded:[516],transitionDuration:[2,"transition-duration"],updateSize:[64]},[[0,"dnnCollapsibleHeightChanged","handleHeightChanged"]],{expanded:["handledExpandedChanged"]}]]],["p-507074b5",[[1,"dnn-modal",{backdropDismiss:[4,"backdrop-dismiss"],closeText:[1,"close-text"],resizable:[4],showCloseButton:[4,"show-close-button"],visible:[1540],show:[64],hide:[64]}]]],["p-36dc982d",[[65,"dnn-button",{type:[1],appearance:[1],formButtonType:[1,"form-button-type"],reversed:[4],size:[1],confirm:[4],confirmYesText:[1,"confirm-yes-text"],confirmNoText:[1,"confirm-no-text"],confirmMessage:[1,"confirm-message"],disabled:[4],focused:[32],modalVisible:[32]}]]],["p-0de82dae",[[1,"dnn-permissions-grid",{permissions:[1040],roleGroups:[16],roles:[16],resx:[16],foundUsers:[16],selectedRoleGroupId:[32],userQuery:[32],pickedUser:[32],localResx:[32],focused:[32]},null,{foundUsers:["handleFoundUsersChanged"],resx:["resxChanged"]}]]],["p-bc2d2d54",[[1,"dnn-fieldset",{focused:[1540],disabled:[1540],invalid:[1540],label:[1],floatLabel:[1540,"float-label"],helpText:[1,"help-text"],resizable:[1],customValidityMessage:[32],setFocused:[64],setBlurred:[64],disable:[64],enable:[64],pinLabel:[64],unpinLabel:[64],setValidity:[64]}]]]],e)}));
 //# sourceMappingURL=dnn.esm.js.map

package/dist/dnn/p-2ff4df3f.entry.js ADDED Viewed

	@@ -0,0 +1,2 @@
1	+ import{r as e,c as i,h as t,H as a}from"./p-91d08ab2.js";import{a as s}from"./p-5df01911.js";const d=":host{--border-color:var(--dnn-color-foreground-light, lightgray);--border-radius:var(--dnn-controls-radius, 5px);--drop-background-color:var(--dnn-color-neutral, #b2b2b2);display:flex;flex-direction:column;gap:1rem;text-align:center;border:2px dashed var(--border-color);border-radius:var(--border-radius);padding:1rem;transition:all 300ms ease-in-out}:host(.dropping){background-color:var(--drop-background-color)}p{margin:0;padding:0}button{display:flex;justify-content:center;align-items:center;border:0px;margin:0;padding:0;background-color:transparent}button:hover{cursor:pointer}button svg{margin-right:0.5rem}label.upload-file{display:flex;justify-content:center;align-items:center;cursor:pointer}label.upload-file input{display:none}.video-preview{display:flex;flex-direction:column;align-items:center}.video-preview button{margin:1rem}.error{color:red}";const r=d;const n=class{constructor(t){e(this,t);this.filesSelected=i(this,"filesSelected",7);if(t.$hostElement$["s-ei"]){this.internals=t.$hostElement$["s-ei"]}else{this.internals=t.$hostElement$.attachInternals();t.$hostElement$["s-ei"]=this.internals}this.defaultResx={dragAndDropFile:"Drag and drop a file",capture:"Capture",or:"or",takePicture:"Take a picture",uploadFile:"Upload a file",uploadSizeTooLarge:"The file you tried to upload is too large.",fileSizeLimit:"The maximum size is {0}",invalidExtension:"The file you tried to upload has an invalid extension.",allowedFileExtensions:"Allowed file extensions: {0}"};this.handleDragOver=e=>{e.stopPropagation();e.preventDefault();e.dataTransfer.dropEffect="copy";this.dropzone.classList.add("dropping")};this.handleDrop=e=>{this.invalidExtension=false;this.fileTooLarge=false;e.stopPropagation();e.preventDefault();const i=e.dataTransfer.files;if(this.hasInvalidExtensions(Array.from(i))){this.invalidExtension=true;return}if(this.isAnyFileLargerThanAllowed(Array.from(i))){this.fileTooLarge=true;return}var t=this.getFilesFromFileList(i);this.filesSelected.emit(t)};this.resx=undefined;this.allowedExtensions=undefined;this.allowCameraMode=false;this.captureQuality=.8;this.maxFileSize=undefined;this.name=undefined;this.canTakeSnapshots=false;this.takingPicture=false;this.fileTooLarge=false;this.invalidExtension=false;this.localResx=undefined;this.focused=false}componentWillLoad(){this.mergeResx()}componentDidLoad(){if(this.allowCameraMode){this.checkIfBrowserCanTakeSnapshots().then((e=>this.canTakeSnapshots=e))}if(this.allowedExtensions!=undefined&&this.allowedExtensions.length>0){var e=this.allowedExtensions.map((e=>`.${e}`));var i=e.join(",");this.fileInput.accept=i}}resxChanged(){this.mergeResx()}formResetCallback(){this.internals.setValidity({});this.fileInput.value="";this.internals.setFormValue("")}mergeResx(){this.localResx=Object.assign(Object.assign({},this.defaultResx),this.resx)}checkIfBrowserCanTakeSnapshots(){return new Promise((e=>{const i=navigator.mediaDevices;if(i==undefined\|\|i.enumerateDevices==undefined){e(false)}i.enumerateDevices().then((i=>{var t=i.some((e=>e.kind=="videoinput"));e(t)}))}))}getFilesFromFileList(e){var i=[];for(let t=0;t<e.length;t++){const a=e[t];i.push(a)}return i}isAnyFileLargerThanAllowed(e){if(this.maxFileSize==undefined\|\|this.maxFileSize<=0){return false}if(e.some((e=>e.size>this.maxFileSize))){return true}return false}handleUploadKeyDown(e){if(e.key==="Enter"\|\|e.key===" "){e.preventDefault();this.fileInput.click()}}handleUploadButton(e){this.fileTooLarge=false;this.invalidExtension=false;let i=this.getFilesFromFileList(e.files);if(this.isAnyFileLargerThanAllowed(i)){this.fileTooLarge=true;return}if(this.hasInvalidExtensions(i)){this.invalidExtension=true;return}this.filesSelected.emit(i);if(this.name!=undefined&&this.name.length>0){var t=new FormData;i.forEach((e=>{t.append(this.name,e)}));this.internals.setFormValue(t)}}hasInvalidExtensions(e){var i,t;var a=false;for(let r=0;r<e.length;r++){const n=e[r];var s=/(?:\.([^.]+))?$/;const o=(i=s.exec(n.name)[1])===null\|\|i===void 0?void 0:i.toLowerCase();if(o==undefined){a=true}var d=(t=this.allowedExtensions)===null\|\|t===void 0?void 0:t.map((e=>e.toLowerCase()));if(this.allowedExtensions!=undefined&&!(d===null\|\|d===void 0?void 0:d.includes(o))){a=true}return a}}takeSnapshot(){this.takingPicture=true;navigator.mediaDevices.getUserMedia({video:true,audio:false}).then((e=>{this.videoPreview.srcObject=e;this.videoPreview.play().then((()=>{this.videoSettings=e.getVideoTracks()[0].getSettings()}))})).catch((e=>alert(e)))}applySnapshot(){var e=document.createElement("canvas");const i=e.getContext("2d");e.width=this.videoSettings.width;e.height=this.videoSettings.height;i.drawImage(this.videoPreview,0,0);e.toBlob((e=>{var i=new File([e],"image.jpeg",{type:"image/jpeg"});this.takingPicture=false;var t=[i];this.filesSelected.emit(t)}),"image/jpeg",this.captureQuality)}getInvalidExtensionsMessage(){var e=this.localResx.allowedFileExtensions;var e=e.replace("{0}",this.allowedExtensions.join(", "));return e}render(){var e,i,d,r,n,o;return t(a,{key:"e8cb239b37d1be0f7c41240465cd6a158ab0097b",ref:e=>this.dropzone=e,class:"dropzone",onDragOver:e=>this.handleDragOver(e),onDrop:e=>this.handleDrop(e),onDragLeave:()=>this.dropzone.classList.remove("dropping"),tabIndex:this.focused?-1:0,onFocus:()=>this.uploadLabel.focus(),onBlur:()=>this.uploadLabel.blur()},!this.takingPicture&&[t("p",{key:"0a6f9cdb3eef3449dc2092cd6ed5d32e431f3c2d"},(e=this.localResx)===null\|\|e===void 0?void 0:e.dragAndDropFile),t("p",{key:"1179185c6fa4615e9f3ad362e7f7b663c80ee8f9"},"- ",(i=this.localResx)===null\|\|i===void 0?void 0:i.or," -"),t("label",{key:"15a2262c638dd5b4b2f5c0d51fb4d361ccdc98cc",class:"upload-file",tabIndex:0,onKeyDown:e=>this.handleUploadKeyDown(e),ref:e=>this.uploadLabel=e,onFocus:()=>this.focused=true,onBlur:()=>this.focused=false},t("input",{key:"8890c891d3805213887403528b9e8d8661f81100",type:"file",ref:e=>this.fileInput=e,onChange:e=>this.handleUploadButton(e.target)}),t("span",{key:"e4b5083f873c27f7550f29ee5d6f433a4e79ab58"},t("svg",{key:"3f3d9e3e491ab3159767da319d08b3a07c08a65d",xmlns:"http://www.w3.org/2000/svg","enable-background":"new 0 0 24 24",height:"24px",viewBox:"0 0 24 24",width:"24px",fill:"#000000"},t("g",{key:"d88531469503abfc3b33940f7f690545a6bd7c47"},t("rect",{key:"67cfd319af430b66b2c3c4db9cf043b5ca8b44d2",fill:"none",height:"24",width:"24"})),t("g",{key:"929ff336aa3a765c6b0ae3804af479152f15580e"},t("path",{key:"423d42dd1312a6e92e58112c9abb17c9747c5edc",d:"M5,20h14v-2H5V20z M5,10h4v6h6v-6h4l-7-7L5,10z"}))))," ",(d=this.localResx)===null\|\|d===void 0?void 0:d.uploadFile),this.canTakeSnapshots&&[t("p",{key:"79d4eba604972b765af99a259444017effc430d0"},"- ",(r=this.localResx)===null\|\|r===void 0?void 0:r.or," -"),t("button",{key:"181c7f2c3e0fe10a0e442f671b585d7fd52240e4",onClick:()=>this.takeSnapshot()},t("svg",{key:"a7895b7adac1558f45ccccc87f449bb2ffec557c",xmlns:"http://www.w3.org/2000/svg",height:"24px",viewBox:"0 0 24 24",width:"24px",fill:"#000000"},t("path",{key:"23128d601f71f2e8cd8af075fe74de8e7f67e92c",d:"M0 0h24v24H0z",fill:"none"}),t("circle",{key:"a082e32a026bfa4586fe203783cbd585e244f774",cx:"12",cy:"12",r:"3.2"}),t("path",{key:"8f1b6b43558cb3ad0e375b01f71da751d88afea8",d:"M9 2L7.17 4H4c-1.1 0-2 .9-2 2v12c0 1.1.9 2 2 2h16c1.1 0 2-.9 2-2V6c0-1.1-.9-2-2-2h-3.17L15 2H9zm3 15c-2.76 0-5-2.24-5-5s2.24-5 5-5 5 2.24 5 5-2.24 5-5 5z"})),(n=this.localResx)===null\|\|n===void 0?void 0:n.takePicture)]],this.takingPicture&&t("div",{key:"48ccb4be518d323659462b075f0ee2bf6d7ae052",class:"video-preview"},t("video",{key:"26659446b8ac3c291aa89352c19515978e0596f8",ref:e=>this.videoPreview=e}),t("button",{key:"9b7699d716d94611d4b3ae7590a5e76efe4f8b83",onClick:()=>this.applySnapshot()},t("svg",{key:"5576687f6e6592825ff4d89e12cc8da2cacf7b49",xmlns:"http://www.w3.org/2000/svg",height:"24px",viewBox:"0 0 24 24",width:"24px",fill:"#000000"},t("path",{key:"fb833f77e4803eb29d6eb68a92e1a9de775c756b",d:"M0 0h24v24H0z",fill:"none"}),t("circle",{key:"0abc995fbda0ce7af15004867d8cced2e153577d",cx:"12",cy:"12",r:"3.2"}),t("path",{key:"d3045fa3aecc259628598a2ed67c38a7721f1148",d:"M9 2L7.17 4H4c-1.1 0-2 .9-2 2v12c0 1.1.9 2 2 2h16c1.1 0 2-.9 2-2V6c0-1.1-.9-2-2-2h-3.17L15 2H9zm3 15c-2.76 0-5-2.24-5-5s2.24-5 5-5 5 2.24 5 5-2.24 5-5 5z"}))," ",(o=this.localResx)===null\|\|o===void 0?void 0:o.capture)),this.fileTooLarge&&t("div",{key:"b66d8d9f21a9948595df5217f9745e8ecc08f779",class:"error"},t("p",{key:"080b2779e7656c953d77a4b9719cc4984890ec87"},this.localResx.uploadSizeTooLarge,t("br",{key:"683ecdcf26529260f25e16988be94a71d570c61f"}),this.localResx.fileSizeLimit.replace("{0}",s(this.maxFileSize)))),this.invalidExtension&&t("div",{key:"3b48bf8ba1e235d2f4fb3e2192cf18735dfa35df",class:"error"},t("p",{key:"c0b42d27ae92e7d38d48fe9ac86c70d9d657b8c7"},this.localResx.invalidExtension,t("br",{key:"1e0995b7bb02db676e56840e5692b36e2ca5191a"}),this.getInvalidExtensionsMessage())))}static get formAssociated(){return true}static get watchers(){return{resx:["resxChanged"]}}};n.style=r;export{n as dnn_dropzone};
2	+ //# sourceMappingURL=p-2ff4df3f.entry.js.map

package/dist/dnn/p-2ff4df3f.entry.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"names":["dnnDropzoneCss","DnnDropzoneStyle0","DnnDropzone","this","defaultResx","dragAndDropFile","capture","or","takePicture","uploadFile","uploadSizeTooLarge","fileSizeLimit","invalidExtension","allowedFileExtensions","handleDragOver","event","stopPropagation","preventDefault","dataTransfer","dropEffect","dropzone","classList","add","handleDrop","dropEvent","fileTooLarge","files","hasInvalidExtensions","Array","from","isAnyFileLargerThanAllowed","fileList","getFilesFromFileList","filesSelected","emit","componentWillLoad","mergeResx","componentDidLoad","allowCameraMode","checkIfBrowserCanTakeSnapshots","then","result","canTakeSnapshots","allowedExtensions","undefined","length","extensionsWithDots","map","e","extensionsList","join","fileInput","accept","resxChanged","formResetCallback","internals","setValidity","value","setFormValue","localResx","Object","assign","resx","Promise","resolve","mediaDevices","navigator","enumerateDevices","devices","some","device","kind","index","file","push","maxFileSize","size","handleUploadKeyDown","key","click","handleUploadButton","element","name","data","FormData","forEach","append","hasInvalid","fileIndex","regex","fileExtension","_a","exec","toLowerCase","loweredAllowedExtensions","_b","includes","takeSnapshot","takingPicture","getUserMedia","video","audio","stream","videoPreview","srcObject","play","videoSettings","getVideoTracks","getSettings","catch","error","alert","applySnapshot","canvas","document","createElement","context","getContext","width","height","drawImage","toBlob","blob","File","type","captureQuality","getInvalidExtensionsMessage","message","replace","render","h","Host","ref","class","onDragOver","onDrop","onDragLeave","remove","tabIndex","focused","onFocus","uploadLabel","focus","onBlur","blur","onKeyDown","el","onChange","target","xmlns","viewBox","fill","d","_c","_d","onClick","cx","cy","r","_e","_f","getReadableFileSizeString"],"sources":["src/components/dnn-dropzone/dnn-dropzone.scss?tag=dnn-dropzone&encapsulation=shadow","src/components/dnn-dropzone/dnn-dropzone.tsx"],"sourcesContent":["\n:host {\n /** \n * @prop --border-color: The color of the border.\n * @prop --border-radius: The radius of the controls borders.\n * @prop --drop-background-color: The color of the background when a file is dropping.\n */\n --border-color: var(--dnn-color-foreground-light, lightgray);\n --border-radius: var(--dnn-controls-radius, 5px);\n --drop-background-color: var(--dnn-color-neutral, #b2b2b2);\n\n display: flex;\n flex-direction: column;\n gap: 1rem;\n text-align: center;\n border: 2px dashed var(--border-color);\n border-radius: var(--border-radius);\n padding: 1rem;\n transition: all 300ms ease-in-out;\n}\n\n:host(.dropping){\n background-color: var(--drop-background-color);\n}\np{\n margin: 0;\n padding: 0;\n}\nbutton{\n display: flex;\n justify-content: center;\n align-items: center;\n border: 0px;\n margin: 0;\n padding: 0;\n background-color: transparent;\n &:hover{\n cursor: pointer;\n }\n svg{\n margin-right: 0.5rem;\n }\n}\nlabel.upload-file{\n display: flex;\n justify-content: center;\n align-items: center;\n cursor: pointer;\n input{\n display: none;\n }\n}\n.video-preview{\n display: flex;\n flex-direction: column;\n align-items: center;\n button{\n margin: 1rem;\n }\n}\n.error {\n color:red;\n}","import { Component, Host, h, Prop, State, Event, EventEmitter, Watch, AttachInternals } from '@stencil/core';\nimport { getReadableFileSizeString } from '../../utilities/stringUtilities';\nimport { DropzoneResx } from './types';\n\n@Component({\n tag: 'dnn-dropzone',\n styleUrl: 'dnn-dropzone.scss',\n shadow: true,\n formAssociated: true,\n})\nexport class DnnDropzone {\n /** Localization strings */\n @Prop() resx:DropzoneResx;\n\n /** A list of allowed file extensions.\n * If not specified, any file is allowed.\n * Ex: [\"jpg\", \"jpeg\", \"gif\", \"png\"]\n */\n @Prop() allowedExtensions: string[];\n\n /**\n * If true, will allow the user to take a snapshot\n * using the device camera. (only works over https).\n */\n @Prop() allowCameraMode: boolean = false;\n\n /**\n * Specifies the jpeg quality for when the device\n * camera is used to generate a picture.\n * Needs to be a number between 0 and 1 and defaults to 0.8\n */\n @Prop() captureQuality: number = 0.8;\n\n /**\n * Max file size in bytes.\n */\n @Prop() maxFileSize?: number;\n\n /** The name of the field when used in a form. */\n @Prop() name: string;\n\n /** Fires when file were selected. */\n @Event() filesSelected: EventEmitter<File[]>;\n \n @State() canTakeSnapshots: boolean = false;\n @State() takingPicture: boolean = false;\n @State() fileTooLarge: boolean = false;\n @State() invalidExtension: boolean = false;\n @State() localResx: DropzoneResx;\n @State() focused = false;\n\n @AttachInternals() internals: ElementInternals;\n\n private dropzone: HTMLElement;\n private fileInput: HTMLInputElement;\n private videoPreview: HTMLVideoElement;\n private uploadLabel: HTMLLabelElement;\n private videoSettings!: MediaTrackSettings;\n private defaultResx: DropzoneResx = {\n dragAndDropFile: \"Drag and drop a file\",\n capture: \"Capture\",\n or: \"or\",\n takePicture: \"Take a picture\",\n uploadFile: \"Upload a file\",\n uploadSizeTooLarge: \"The file you tried to upload is too large.\",\n fileSizeLimit: \"The maximum size is {0}\",\n invalidExtension: \"The file you tried to upload has an invalid extension.\",\n allowedFileExtensions: \"Allowed file extensions: {0}\",\n }\n\n componentWillLoad() {\n this.mergeResx();\n }\n\n componentDidLoad() {\n if (this.allowCameraMode){\n this.checkIfBrowserCanTakeSnapshots()\n .then(result => this.canTakeSnapshots = result);\n }\n if (this.allowedExtensions != undefined && this.allowedExtensions.length > 0){\n var extensionsWithDots = this.allowedExtensions.map(e => `.${e}`);\n var extensionsList = extensionsWithDots.join(\",\");\n this.fileInput.accept = extensionsList;\n }\n }\n\n @Watch('resx')\n resxChanged() {\n this.mergeResx();\n }\n\n // eslint-disable-next-line @stencil-community/own-methods-must-be-private\n formResetCallback() {\n this.internals.setValidity({});\n this.fileInput.value = \"\";\n this.internals.setFormValue(\"\");\n }\n\n private mergeResx(): void {\n this.localResx = {...this.defaultResx, ...this.resx};\n }\n\n private checkIfBrowserCanTakeSnapshots(): Promise<boolean> {\n return new Promise((resolve) => {\n const mediaDevices = navigator.mediaDevices;\n if (mediaDevices == undefined || mediaDevices.enumerateDevices == undefined) {\n resolve(false);\n }\n mediaDevices.enumerateDevices()\n .then(devices => {\n var result = devices.some(device => device.kind == \"videoinput\");\n resolve(result);\n });\n });\n }\n\n private getFilesFromFileList(files: FileList) : File[] {\n var fileList: File[] = [];\n for (let index = 0; index < files.length; index++) {\n const file = files[index];\n fileList.push(file);\n }\n\n return fileList;\n }\n\n private isAnyFileLargerThanAllowed (files:File[]) : boolean {\n if (this.maxFileSize == undefined || this.maxFileSize <= 0) {\n return false;\n } \n\n if ( files.some(file => file.size > this.maxFileSize )) {\n return true;\n }\n\n return false;\n }\n\n private handleUploadKeyDown(event: KeyboardEvent) {\n if (event.key === 'Enter' || event.key === ' ') {\n event.preventDefault();\n this.fileInput.click();\n }\n }\n\n private handleUploadButton(element: HTMLInputElement): void {\n this.fileTooLarge = false;\n this.invalidExtension = false;\n let files = this.getFilesFromFileList(element.files);\n \n if (this.isAnyFileLargerThanAllowed(files)) {\n this.fileTooLarge = true;\n return;\n }\n\n if (this.hasInvalidExtensions(files)){\n this.invalidExtension = true;\n return;\n }\n\n this.filesSelected.emit(files);\n if (this.name != undefined && this.name.length > 0){\n var data = new FormData();\n files.forEach(file => {\n data.append(this.name, file);\n });\n this.internals.setFormValue(data);\n }\n }\n\n private handleDragOver = (event: DragEvent) => \n {\n event.stopPropagation();\n event.preventDefault();\n event.dataTransfer.dropEffect = \"copy\";\n this.dropzone.classList.add(\"dropping\");\n };\n\n private hasInvalidExtensions(files: File[]): boolean{\n var hasInvalid = false;\n for (let fileIndex = 0; fileIndex < files.length; fileIndex++) {\n const file = files[fileIndex];\n var regex = /(?:\\.([^.]+))?$/;\n const fileExtension = regex.exec(file.name)[1]?.toLowerCase();\n if (fileExtension == undefined){\n hasInvalid = true;\n }\n\n var loweredAllowedExtensions = this.allowedExtensions?.map(e => e.toLowerCase());\n if (this.allowedExtensions != undefined && !loweredAllowedExtensions?.includes(fileExtension)){\n hasInvalid = true;\n }\n\n return hasInvalid;\n }\n }\n\n private handleDrop = (dropEvent: DragEvent) => {\n this.invalidExtension = false;\n this.fileTooLarge = false;\n dropEvent.stopPropagation();\n dropEvent.preventDefault();\n const files = dropEvent.dataTransfer.files;\n\n if (this.hasInvalidExtensions(Array.from(files))){\n this.invalidExtension = true;\n return;\n }\n\n if (this.isAnyFileLargerThanAllowed(Array.from(files))) {\n this.fileTooLarge = true;\n return;\n }\n\n var fileList = this.getFilesFromFileList(files);\n this.filesSelected.emit(fileList);\n };\n\n private takeSnapshot(): void {\n this.takingPicture = true;\n navigator.mediaDevices.getUserMedia({video: true, audio: false})\n .then(stream => {\n stream\n this.videoPreview.srcObject = stream;\n this.videoPreview.play()\n .then(() => {\n this.videoSettings = stream.getVideoTracks()[0].getSettings();\n });\n })\n .catch(error => alert(error));\n }\n\n private applySnapshot(): void {\n var canvas = document.createElement(\"canvas\");\n const context = canvas.getContext(\"2d\");\n canvas.width = this.videoSettings.width;\n canvas.height = this.videoSettings.height;\n context.drawImage(this.videoPreview, 0, 0);\n canvas.toBlob(blob => {\n var file = new File([blob], \"image.jpeg\", {type:\"image/jpeg\"});\n this.takingPicture = false;\n \n var fileList = [file];\n this.filesSelected.emit(fileList)\n }, \"image/jpeg\", this.captureQuality);\n }\n\n private getInvalidExtensionsMessage() {\n var message = this.localResx.allowedFileExtensions;\n var message = message.replace(\"{0}\", this.allowedExtensions.join(\", \"));\n return message;\n }\n \n render() {\n return (\n <Host\n ref={e => this.dropzone = e}\n class=\"dropzone\"\n onDragOver={e => this.handleDragOver(e)}\n onDrop={e => this.handleDrop(e)}\n onDragLeave={() => this.dropzone.classList.remove(\"dropping\")}\n tabIndex={this.focused ? -1 : 0}\n onFocus={() => this.uploadLabel.focus()}\n onBlur={() => this.uploadLabel.blur()}\n >\n {!this.takingPicture &&\n [\n <p>{this.localResx?.dragAndDropFile}</p>\n ,\n <p>- {this.localResx?.or} -</p>\n ,\n <label\n class=\"upload-file\"\n tabIndex={0}\n onKeyDown={e => this.handleUploadKeyDown(e)}\n ref={el => this.uploadLabel = el}\n onFocus={() => this.focused = true}\n onBlur={() => this.focused = false}\n >\n <input\n type=\"file\"\n ref={el => this.fileInput = el}\n onChange={e => this.handleUploadButton(e.target as HTMLInputElement)}\n >\n </input>\n <span>\n <svg\n xmlns=\"http://www.w3.org/2000/svg\"\n enable-background=\"new 0 0 24 24\"\n height=\"24px\"\n viewBox=\"0 0 24 24\"\n width=\"24px\"\n fill=\"#000000\">\n <g><rect fill=\"none\" height=\"24\" width=\"24\"/></g>\n <g><path d=\"M5,20h14v-2H5V20z M5,10h4v6h6v-6h4l-7-7L5,10z\"/></g>\n </svg>\n </span>\n  \n {this.localResx?.uploadFile}\n </label>\n ,\n this.canTakeSnapshots &&\n [\n <p>- {this.localResx?.or} -</p>\n ,\n <button\n onClick={() => this.takeSnapshot()}\n >\n <svg xmlns=\"http://www.w3.org/2000/svg\" height=\"24px\" viewBox=\"0 0 24 24\" width=\"24px\" fill=\"#000000\"><path d=\"M0 0h24v24H0z\" fill=\"none\"/><circle cx=\"12\" cy=\"12\" r=\"3.2\"/><path d=\"M9 2L7.17 4H4c-1.1 0-2 .9-2 2v12c0 1.1.9 2 2 2h16c1.1 0 2-.9 2-2V6c0-1.1-.9-2-2-2h-3.17L15 2H9zm3 15c-2.76 0-5-2.24-5-5s2.24-5 5-5 5 2.24 5 5-2.24 5-5 5z\"/></svg>\n {this.localResx?.takePicture}\n </button>\n ]\n ]\n }\n {this.takingPicture &&\n <div class=\"video-preview\">\n <video ref={e => this.videoPreview = e} />\n <button\n onClick={() => this.applySnapshot()}\n >\n <svg xmlns=\"http://www.w3.org/2000/svg\" height=\"24px\" viewBox=\"0 0 24 24\" width=\"24px\" fill=\"#000000\"><path d=\"M0 0h24v24H0z\" fill=\"none\"/><circle cx=\"12\" cy=\"12\" r=\"3.2\"/><path d=\"M9 2L7.17 4H4c-1.1 0-2 .9-2 2v12c0 1.1.9 2 2 2h16c1.1 0 2-.9 2-2V6c0-1.1-.9-2-2-2h-3.17L15 2H9zm3 15c-2.76 0-5-2.24-5-5s2.24-5 5-5 5 2.24 5 5-2.24 5-5 5z\"/></svg> \n {this.localResx?.capture}\n </button>\n </div>\n }\n { this.fileTooLarge && \n <div class='error'>\n <p>\n {this.localResx.uploadSizeTooLarge}\n <br/>\n {this.localResx.fileSizeLimit.replace(\"{0}\", getReadableFileSizeString(this.maxFileSize)) } \n </p>\n </div>\n }\n { this.invalidExtension &&\n <div class='error'>\n <p>\n {this.localResx.invalidExtension}\n <br/>\n {this.getInvalidExtensionsMessage()}\n </p>\n </div>\n }\n </Host>\n );\n }\n}\n"],"mappings":"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","ignoreList":[]}

package/dist/esm/dnn-dropzone.entry.js CHANGED Viewed

@@ -1,7 +1,7 @@
 import { r as registerInstance, c as createEvent, h, H as Host } from './index-a2e9a98f.js';
 import { a as getReadableFileSizeString } from './stringUtilities-b220cf3a.js';
-const dnnDropzoneCss = ":host{--border-color:var(--dnn-color-tertiary-contrast, lightgray);--border-radius:var(--dnn-controls-radius, 5px);--drop-background-color:var(--dnn-color-tertiary, lightblue);display:flex;flex-direction:column;gap:1rem;text-align:center;border:2px dashed var(--border-color);border-radius:var(--border-radius);padding:1rem;transition:all 300ms ease-in-out}:host(.dropping){background-color:var(--drop-background-color)}p{margin:0;padding:0}button{display:flex;justify-content:center;align-items:center;border:0px;margin:0;padding:0;background-color:transparent}button:hover{cursor:pointer}button svg{margin-right:0.5rem}label.upload-file{display:flex;justify-content:center;align-items:center;cursor:pointer}label.upload-file input{display:none}.video-preview{display:flex;flex-direction:column;align-items:center}.video-preview button{margin:1rem}.error{color:red}";
+const dnnDropzoneCss = ":host{--border-color:var(--dnn-color-foreground-light, lightgray);--border-radius:var(--dnn-controls-radius, 5px);--drop-background-color:var(--dnn-color-neutral, #b2b2b2);display:flex;flex-direction:column;gap:1rem;text-align:center;border:2px dashed var(--border-color);border-radius:var(--border-radius);padding:1rem;transition:all 300ms ease-in-out}:host(.dropping){background-color:var(--drop-background-color)}p{margin:0;padding:0}button{display:flex;justify-content:center;align-items:center;border:0px;margin:0;padding:0;background-color:transparent}button:hover{cursor:pointer}button svg{margin-right:0.5rem}label.upload-file{display:flex;justify-content:center;align-items:center;cursor:pointer}label.upload-file input{display:none}.video-preview{display:flex;flex-direction:column;align-items:center}.video-preview button{margin:1rem}.error{color:red}";
 const DnnDropzoneStyle0 = dnnDropzoneCss;
 const DnnDropzone = class {

package/dist/esm/dnn-dropzone.entry.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"file":"dnn-dropzone.entry.js","mappings":"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","names":[],"sources":["src/components/dnn-dropzone/dnn-dropzone.scss?tag=dnn-dropzone&encapsulation=shadow","src/components/dnn-dropzone/dnn-dropzone.tsx"],"sourcesContent":["\n:host {\n /** \n * @prop --border-color: The color of the border.\n * @prop --border-radius: The radius of the controls borders.\n * @prop --drop-background-color: The color of the background when a file is dropping.\n /\n --border-color: var(--dnn-color-tertiary-contrast, lightgray);\n --border-radius: var(--dnn-controls-radius, 5px);\n --drop-background-color: var(--dnn-color-tertiary, lightblue);\n\n display: flex;\n flex-direction: column;\n gap: 1rem;\n text-align: center;\n border: 2px dashed var(--border-color);\n border-radius: var(--border-radius);\n padding: 1rem;\n transition: all 300ms ease-in-out;\n}\n\n:host(.dropping){\n background-color: var(--drop-background-color);\n}\np{\n margin: 0;\n padding: 0;\n}\nbutton{\n display: flex;\n justify-content: center;\n align-items: center;\n border: 0px;\n margin: 0;\n padding: 0;\n background-color: transparent;\n &:hover{\n cursor: pointer;\n }\n svg{\n margin-right: 0.5rem;\n }\n}\nlabel.upload-file{\n display: flex;\n justify-content: center;\n align-items: center;\n cursor: pointer;\n input{\n display: none;\n }\n}\n.video-preview{\n display: flex;\n flex-direction: column;\n align-items: center;\n button{\n margin: 1rem;\n }\n}\n.error {\n color:red;\n}","import { Component, Host, h, Prop, State, Event, EventEmitter, Watch, AttachInternals } from '@stencil/core';\nimport { getReadableFileSizeString } from '../../utilities/stringUtilities';\nimport { DropzoneResx } from './types';\n\n@Component({\n tag: 'dnn-dropzone',\n styleUrl: 'dnn-dropzone.scss',\n shadow: true,\n formAssociated: true,\n})\nexport class DnnDropzone {\n /* Localization strings /\n @Prop() resx:DropzoneResx;\n\n /* A list of allowed file extensions.\n * If not specified, any file is allowed.\n * Ex: [\"jpg\", \"jpeg\", \"gif\", \"png\"]\n /\n @Prop() allowedExtensions: string[];\n\n /\n If true, will allow the user to take a snapshot\n * using the device camera. (only works over https).\n /\n @Prop() allowCameraMode: boolean = false;\n\n /\n Specifies the jpeg quality for when the device\n * camera is used to generate a picture.\n * Needs to be a number between 0 and 1 and defaults to 0.8\n /\n @Prop() captureQuality: number = 0.8;\n\n /\n Max file size in bytes.\n /\n @Prop() maxFileSize?: number;\n\n /* The name of the field when used in a form. /\n @Prop() name: string;\n\n /* Fires when file were selected. */\n @Event() filesSelected: EventEmitter<File[]>;\n \n @State() canTakeSnapshots: boolean = false;\n @State() takingPicture: boolean = false;\n @State() fileTooLarge: boolean = false;\n @State() invalidExtension: boolean = false;\n @State() localResx: DropzoneResx;\n @State() focused = false;\n\n @AttachInternals() internals: ElementInternals;\n\n private dropzone: HTMLElement;\n private fileInput: HTMLInputElement;\n private videoPreview: HTMLVideoElement;\n private uploadLabel: HTMLLabelElement;\n private videoSettings!: MediaTrackSettings;\n private defaultResx: DropzoneResx = {\n dragAndDropFile: \"Drag and drop a file\",\n capture: \"Capture\",\n or: \"or\",\n takePicture: \"Take a picture\",\n uploadFile: \"Upload a file\",\n uploadSizeTooLarge: \"The file you tried to upload is too large.\",\n fileSizeLimit: \"The maximum size is {0}\",\n invalidExtension: \"The file you tried to upload has an invalid extension.\",\n allowedFileExtensions: \"Allowed file extensions: {0}\",\n }\n\n componentWillLoad() {\n this.mergeResx();\n }\n\n componentDidLoad() {\n if (this.allowCameraMode){\n this.checkIfBrowserCanTakeSnapshots()\n .then(result => this.canTakeSnapshots = result);\n }\n if (this.allowedExtensions != undefined && this.allowedExtensions.length > 0){\n var extensionsWithDots = this.allowedExtensions.map(e => `.${e}`);\n var extensionsList = extensionsWithDots.join(\",\");\n this.fileInput.accept = extensionsList;\n }\n }\n\n @Watch('resx')\n resxChanged() {\n this.mergeResx();\n }\n\n // eslint-disable-next-line @stencil-community/own-methods-must-be-private\n formResetCallback() {\n this.internals.setValidity({});\n this.fileInput.value = \"\";\n this.internals.setFormValue(\"\");\n }\n\n private mergeResx(): void {\n this.localResx = {...this.defaultResx, ...this.resx};\n }\n\n private checkIfBrowserCanTakeSnapshots(): Promise<boolean> {\n return new Promise((resolve) => {\n const mediaDevices = navigator.mediaDevices;\n if (mediaDevices == undefined \|\| mediaDevices.enumerateDevices == undefined) {\n resolve(false);\n }\n mediaDevices.enumerateDevices()\n .then(devices => {\n var result = devices.some(device => device.kind == \"videoinput\");\n resolve(result);\n });\n });\n }\n\n private getFilesFromFileList(files: FileList) : File[] {\n var fileList: File[] = [];\n for (let index = 0; index < files.length; index++) {\n const file = files[index];\n fileList.push(file);\n }\n\n return fileList;\n }\n\n private isAnyFileLargerThanAllowed (files:File[]) : boolean {\n if (this.maxFileSize == undefined \|\| this.maxFileSize <= 0) {\n return false;\n } \n\n if ( files.some(file => file.size > this.maxFileSize )) {\n return true;\n }\n\n return false;\n }\n\n private handleUploadKeyDown(event: KeyboardEvent) {\n if (event.key === 'Enter' \|\| event.key === ' ') {\n event.preventDefault();\n this.fileInput.click();\n }\n }\n\n private handleUploadButton(element: HTMLInputElement): void {\n this.fileTooLarge = false;\n this.invalidExtension = false;\n let files = this.getFilesFromFileList(element.files);\n \n if (this.isAnyFileLargerThanAllowed(files)) {\n this.fileTooLarge = true;\n return;\n }\n\n if (this.hasInvalidExtensions(files)){\n this.invalidExtension = true;\n return;\n }\n\n this.filesSelected.emit(files);\n if (this.name != undefined && this.name.length > 0){\n var data = new FormData();\n files.forEach(file => {\n data.append(this.name, file);\n });\n this.internals.setFormValue(data);\n }\n }\n\n private handleDragOver = (event: DragEvent) => \n {\n event.stopPropagation();\n event.preventDefault();\n event.dataTransfer.dropEffect = \"copy\";\n this.dropzone.classList.add(\"dropping\");\n };\n\n private hasInvalidExtensions(files: File[]): boolean{\n var hasInvalid = false;\n for (let fileIndex = 0; fileIndex < files.length; fileIndex++) {\n const file = files[fileIndex];\n var regex = /(?:\\.([^.]+))?$/;\n const fileExtension = regex.exec(file.name)[1]?.toLowerCase();\n if (fileExtension == undefined){\n hasInvalid = true;\n }\n\n var loweredAllowedExtensions = this.allowedExtensions?.map(e => e.toLowerCase());\n if (this.allowedExtensions != undefined && !loweredAllowedExtensions?.includes(fileExtension)){\n hasInvalid = true;\n }\n\n return hasInvalid;\n }\n }\n\n private handleDrop = (dropEvent: DragEvent) => {\n this.invalidExtension = false;\n this.fileTooLarge = false;\n dropEvent.stopPropagation();\n dropEvent.preventDefault();\n const files = dropEvent.dataTransfer.files;\n\n if (this.hasInvalidExtensions(Array.from(files))){\n this.invalidExtension = true;\n return;\n }\n\n if (this.isAnyFileLargerThanAllowed(Array.from(files))) {\n this.fileTooLarge = true;\n return;\n }\n\n var fileList = this.getFilesFromFileList(files);\n this.filesSelected.emit(fileList);\n };\n\n private takeSnapshot(): void {\n this.takingPicture = true;\n navigator.mediaDevices.getUserMedia({video: true, audio: false})\n .then(stream => {\n stream\n this.videoPreview.srcObject = stream;\n this.videoPreview.play()\n .then(() => {\n this.videoSettings = stream.getVideoTracks()[0].getSettings();\n });\n })\n .catch(error => alert(error));\n }\n\n private applySnapshot(): void {\n var canvas = document.createElement(\"canvas\");\n const context = canvas.getContext(\"2d\");\n canvas.width = this.videoSettings.width;\n canvas.height = this.videoSettings.height;\n context.drawImage(this.videoPreview, 0, 0);\n canvas.toBlob(blob => {\n var file = new File([blob], \"image.jpeg\", {type:\"image/jpeg\"});\n this.takingPicture = false;\n \n var fileList = [file];\n this.filesSelected.emit(fileList)\n }, \"image/jpeg\", this.captureQuality);\n }\n\n private getInvalidExtensionsMessage() {\n var message = this.localResx.allowedFileExtensions;\n var message = message.replace(\"{0}\", this.allowedExtensions.join(\", \"));\n return message;\n }\n \n render() {\n return (\n <Host\n ref={e => this.dropzone = e}\n class=\"dropzone\"\n onDragOver={e => this.handleDragOver(e)}\n onDrop={e => this.handleDrop(e)}\n onDragLeave={() => this.dropzone.classList.remove(\"dropping\")}\n tabIndex={this.focused ? -1 : 0}\n onFocus={() => this.uploadLabel.focus()}\n onBlur={() => this.uploadLabel.blur()}\n >\n {!this.takingPicture &&\n [\n <p>{this.localResx?.dragAndDropFile}</p>\n ,\n <p>- {this.localResx?.or} -</p>\n ,\n <label\n class=\"upload-file\"\n tabIndex={0}\n onKeyDown={e => this.handleUploadKeyDown(e)}\n ref={el => this.uploadLabel = el}\n onFocus={() => this.focused = true}\n onBlur={() => this.focused = false}\n >\n <input\n type=\"file\"\n ref={el => this.fileInput = el}\n onChange={e => this.handleUploadButton(e.target as HTMLInputElement)}\n >\n </input>\n <span>\n <svg\n xmlns=\"http://www.w3.org/2000/svg\"\n enable-background=\"new 0 0 24 24\"\n height=\"24px\"\n viewBox=\"0 0 24 24\"\n width=\"24px\"\n fill=\"#000000\">\n <g><rect fill=\"none\" height=\"24\" width=\"24\"/></g>\n <g><path d=\"M5,20h14v-2H5V20z M5,10h4v6h6v-6h4l-7-7L5,10z\"/></g>\n </svg>\n </span>\n  \n {this.localResx?.uploadFile}\n </label>\n ,\n this.canTakeSnapshots &&\n [\n <p>- {this.localResx?.or} -</p>\n ,\n <button\n onClick={() => this.takeSnapshot()}\n >\n <svg xmlns=\"http://www.w3.org/2000/svg\" height=\"24px\" viewBox=\"0 0 24 24\" width=\"24px\" fill=\"#000000\"><path d=\"M0 0h24v24H0z\" fill=\"none\"/><circle cx=\"12\" cy=\"12\" r=\"3.2\"/><path d=\"M9 2L7.17 4H4c-1.1 0-2 .9-2 2v12c0 1.1.9 2 2 2h16c1.1 0 2-.9 2-2V6c0-1.1-.9-2-2-2h-3.17L15 2H9zm3 15c-2.76 0-5-2.24-5-5s2.24-5 5-5 5 2.24 5 5-2.24 5-5 5z\"/></svg>\n {this.localResx?.takePicture}\n </button>\n ]\n ]\n }\n {this.takingPicture &&\n <div class=\"video-preview\">\n <video ref={e => this.videoPreview = e} />\n <button\n onClick={() => this.applySnapshot()}\n >\n <svg xmlns=\"http://www.w3.org/2000/svg\" height=\"24px\" viewBox=\"0 0 24 24\" width=\"24px\" fill=\"#000000\"><path d=\"M0 0h24v24H0z\" fill=\"none\"/><circle cx=\"12\" cy=\"12\" r=\"3.2\"/><path d=\"M9 2L7.17 4H4c-1.1 0-2 .9-2 2v12c0 1.1.9 2 2 2h16c1.1 0 2-.9 2-2V6c0-1.1-.9-2-2-2h-3.17L15 2H9zm3 15c-2.76 0-5-2.24-5-5s2.24-5 5-5 5 2.24 5 5-2.24 5-5 5z\"/></svg> \n {this.localResx?.capture}\n </button>\n </div>\n }\n { this.fileTooLarge && \n <div class='error'>\n <p>\n {this.localResx.uploadSizeTooLarge}\n <br/>\n {this.localResx.fileSizeLimit.replace(\"{0}\", getReadableFileSizeString(this.maxFileSize)) } \n </p>\n </div>\n }\n { this.invalidExtension &&\n <div class='error'>\n <p>\n {this.localResx.invalidExtension}\n <br/>\n {this.getInvalidExtensionsMessage()}\n </p>\n </div>\n }\n </Host>\n );\n }\n}\n"],"version":3}
1	+ {"file":"dnn-dropzone.entry.js","mappings":"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","names":[],"sources":["src/components/dnn-dropzone/dnn-dropzone.scss?tag=dnn-dropzone&encapsulation=shadow","src/components/dnn-dropzone/dnn-dropzone.tsx"],"sourcesContent":["\n:host {\n /** \n * @prop --border-color: The color of the border.\n * @prop --border-radius: The radius of the controls borders.\n * @prop --drop-background-color: The color of the background when a file is dropping.\n /\n --border-color: var(--dnn-color-foreground-light, lightgray);\n --border-radius: var(--dnn-controls-radius, 5px);\n --drop-background-color: var(--dnn-color-neutral, #b2b2b2);\n\n display: flex;\n flex-direction: column;\n gap: 1rem;\n text-align: center;\n border: 2px dashed var(--border-color);\n border-radius: var(--border-radius);\n padding: 1rem;\n transition: all 300ms ease-in-out;\n}\n\n:host(.dropping){\n background-color: var(--drop-background-color);\n}\np{\n margin: 0;\n padding: 0;\n}\nbutton{\n display: flex;\n justify-content: center;\n align-items: center;\n border: 0px;\n margin: 0;\n padding: 0;\n background-color: transparent;\n &:hover{\n cursor: pointer;\n }\n svg{\n margin-right: 0.5rem;\n }\n}\nlabel.upload-file{\n display: flex;\n justify-content: center;\n align-items: center;\n cursor: pointer;\n input{\n display: none;\n }\n}\n.video-preview{\n display: flex;\n flex-direction: column;\n align-items: center;\n button{\n margin: 1rem;\n }\n}\n.error {\n color:red;\n}","import { Component, Host, h, Prop, State, Event, EventEmitter, Watch, AttachInternals } from '@stencil/core';\nimport { getReadableFileSizeString } from '../../utilities/stringUtilities';\nimport { DropzoneResx } from './types';\n\n@Component({\n tag: 'dnn-dropzone',\n styleUrl: 'dnn-dropzone.scss',\n shadow: true,\n formAssociated: true,\n})\nexport class DnnDropzone {\n /* Localization strings /\n @Prop() resx:DropzoneResx;\n\n /* A list of allowed file extensions.\n * If not specified, any file is allowed.\n * Ex: [\"jpg\", \"jpeg\", \"gif\", \"png\"]\n /\n @Prop() allowedExtensions: string[];\n\n /\n If true, will allow the user to take a snapshot\n * using the device camera. (only works over https).\n /\n @Prop() allowCameraMode: boolean = false;\n\n /\n Specifies the jpeg quality for when the device\n * camera is used to generate a picture.\n * Needs to be a number between 0 and 1 and defaults to 0.8\n /\n @Prop() captureQuality: number = 0.8;\n\n /\n Max file size in bytes.\n /\n @Prop() maxFileSize?: number;\n\n /* The name of the field when used in a form. /\n @Prop() name: string;\n\n /* Fires when file were selected. */\n @Event() filesSelected: EventEmitter<File[]>;\n \n @State() canTakeSnapshots: boolean = false;\n @State() takingPicture: boolean = false;\n @State() fileTooLarge: boolean = false;\n @State() invalidExtension: boolean = false;\n @State() localResx: DropzoneResx;\n @State() focused = false;\n\n @AttachInternals() internals: ElementInternals;\n\n private dropzone: HTMLElement;\n private fileInput: HTMLInputElement;\n private videoPreview: HTMLVideoElement;\n private uploadLabel: HTMLLabelElement;\n private videoSettings!: MediaTrackSettings;\n private defaultResx: DropzoneResx = {\n dragAndDropFile: \"Drag and drop a file\",\n capture: \"Capture\",\n or: \"or\",\n takePicture: \"Take a picture\",\n uploadFile: \"Upload a file\",\n uploadSizeTooLarge: \"The file you tried to upload is too large.\",\n fileSizeLimit: \"The maximum size is {0}\",\n invalidExtension: \"The file you tried to upload has an invalid extension.\",\n allowedFileExtensions: \"Allowed file extensions: {0}\",\n }\n\n componentWillLoad() {\n this.mergeResx();\n }\n\n componentDidLoad() {\n if (this.allowCameraMode){\n this.checkIfBrowserCanTakeSnapshots()\n .then(result => this.canTakeSnapshots = result);\n }\n if (this.allowedExtensions != undefined && this.allowedExtensions.length > 0){\n var extensionsWithDots = this.allowedExtensions.map(e => `.${e}`);\n var extensionsList = extensionsWithDots.join(\",\");\n this.fileInput.accept = extensionsList;\n }\n }\n\n @Watch('resx')\n resxChanged() {\n this.mergeResx();\n }\n\n // eslint-disable-next-line @stencil-community/own-methods-must-be-private\n formResetCallback() {\n this.internals.setValidity({});\n this.fileInput.value = \"\";\n this.internals.setFormValue(\"\");\n }\n\n private mergeResx(): void {\n this.localResx = {...this.defaultResx, ...this.resx};\n }\n\n private checkIfBrowserCanTakeSnapshots(): Promise<boolean> {\n return new Promise((resolve) => {\n const mediaDevices = navigator.mediaDevices;\n if (mediaDevices == undefined \|\| mediaDevices.enumerateDevices == undefined) {\n resolve(false);\n }\n mediaDevices.enumerateDevices()\n .then(devices => {\n var result = devices.some(device => device.kind == \"videoinput\");\n resolve(result);\n });\n });\n }\n\n private getFilesFromFileList(files: FileList) : File[] {\n var fileList: File[] = [];\n for (let index = 0; index < files.length; index++) {\n const file = files[index];\n fileList.push(file);\n }\n\n return fileList;\n }\n\n private isAnyFileLargerThanAllowed (files:File[]) : boolean {\n if (this.maxFileSize == undefined \|\| this.maxFileSize <= 0) {\n return false;\n } \n\n if ( files.some(file => file.size > this.maxFileSize )) {\n return true;\n }\n\n return false;\n }\n\n private handleUploadKeyDown(event: KeyboardEvent) {\n if (event.key === 'Enter' \|\| event.key === ' ') {\n event.preventDefault();\n this.fileInput.click();\n }\n }\n\n private handleUploadButton(element: HTMLInputElement): void {\n this.fileTooLarge = false;\n this.invalidExtension = false;\n let files = this.getFilesFromFileList(element.files);\n \n if (this.isAnyFileLargerThanAllowed(files)) {\n this.fileTooLarge = true;\n return;\n }\n\n if (this.hasInvalidExtensions(files)){\n this.invalidExtension = true;\n return;\n }\n\n this.filesSelected.emit(files);\n if (this.name != undefined && this.name.length > 0){\n var data = new FormData();\n files.forEach(file => {\n data.append(this.name, file);\n });\n this.internals.setFormValue(data);\n }\n }\n\n private handleDragOver = (event: DragEvent) => \n {\n event.stopPropagation();\n event.preventDefault();\n event.dataTransfer.dropEffect = \"copy\";\n this.dropzone.classList.add(\"dropping\");\n };\n\n private hasInvalidExtensions(files: File[]): boolean{\n var hasInvalid = false;\n for (let fileIndex = 0; fileIndex < files.length; fileIndex++) {\n const file = files[fileIndex];\n var regex = /(?:\\.([^.]+))?$/;\n const fileExtension = regex.exec(file.name)[1]?.toLowerCase();\n if (fileExtension == undefined){\n hasInvalid = true;\n }\n\n var loweredAllowedExtensions = this.allowedExtensions?.map(e => e.toLowerCase());\n if (this.allowedExtensions != undefined && !loweredAllowedExtensions?.includes(fileExtension)){\n hasInvalid = true;\n }\n\n return hasInvalid;\n }\n }\n\n private handleDrop = (dropEvent: DragEvent) => {\n this.invalidExtension = false;\n this.fileTooLarge = false;\n dropEvent.stopPropagation();\n dropEvent.preventDefault();\n const files = dropEvent.dataTransfer.files;\n\n if (this.hasInvalidExtensions(Array.from(files))){\n this.invalidExtension = true;\n return;\n }\n\n if (this.isAnyFileLargerThanAllowed(Array.from(files))) {\n this.fileTooLarge = true;\n return;\n }\n\n var fileList = this.getFilesFromFileList(files);\n this.filesSelected.emit(fileList);\n };\n\n private takeSnapshot(): void {\n this.takingPicture = true;\n navigator.mediaDevices.getUserMedia({video: true, audio: false})\n .then(stream => {\n stream\n this.videoPreview.srcObject = stream;\n this.videoPreview.play()\n .then(() => {\n this.videoSettings = stream.getVideoTracks()[0].getSettings();\n });\n })\n .catch(error => alert(error));\n }\n\n private applySnapshot(): void {\n var canvas = document.createElement(\"canvas\");\n const context = canvas.getContext(\"2d\");\n canvas.width = this.videoSettings.width;\n canvas.height = this.videoSettings.height;\n context.drawImage(this.videoPreview, 0, 0);\n canvas.toBlob(blob => {\n var file = new File([blob], \"image.jpeg\", {type:\"image/jpeg\"});\n this.takingPicture = false;\n \n var fileList = [file];\n this.filesSelected.emit(fileList)\n }, \"image/jpeg\", this.captureQuality);\n }\n\n private getInvalidExtensionsMessage() {\n var message = this.localResx.allowedFileExtensions;\n var message = message.replace(\"{0}\", this.allowedExtensions.join(\", \"));\n return message;\n }\n \n render() {\n return (\n <Host\n ref={e => this.dropzone = e}\n class=\"dropzone\"\n onDragOver={e => this.handleDragOver(e)}\n onDrop={e => this.handleDrop(e)}\n onDragLeave={() => this.dropzone.classList.remove(\"dropping\")}\n tabIndex={this.focused ? -1 : 0}\n onFocus={() => this.uploadLabel.focus()}\n onBlur={() => this.uploadLabel.blur()}\n >\n {!this.takingPicture &&\n [\n <p>{this.localResx?.dragAndDropFile}</p>\n ,\n <p>- {this.localResx?.or} -</p>\n ,\n <label\n class=\"upload-file\"\n tabIndex={0}\n onKeyDown={e => this.handleUploadKeyDown(e)}\n ref={el => this.uploadLabel = el}\n onFocus={() => this.focused = true}\n onBlur={() => this.focused = false}\n >\n <input\n type=\"file\"\n ref={el => this.fileInput = el}\n onChange={e => this.handleUploadButton(e.target as HTMLInputElement)}\n >\n </input>\n <span>\n <svg\n xmlns=\"http://www.w3.org/2000/svg\"\n enable-background=\"new 0 0 24 24\"\n height=\"24px\"\n viewBox=\"0 0 24 24\"\n width=\"24px\"\n fill=\"#000000\">\n <g><rect fill=\"none\" height=\"24\" width=\"24\"/></g>\n <g><path d=\"M5,20h14v-2H5V20z M5,10h4v6h6v-6h4l-7-7L5,10z\"/></g>\n </svg>\n </span>\n  \n {this.localResx?.uploadFile}\n </label>\n ,\n this.canTakeSnapshots &&\n [\n <p>- {this.localResx?.or} -</p>\n ,\n <button\n onClick={() => this.takeSnapshot()}\n >\n <svg xmlns=\"http://www.w3.org/2000/svg\" height=\"24px\" viewBox=\"0 0 24 24\" width=\"24px\" fill=\"#000000\"><path d=\"M0 0h24v24H0z\" fill=\"none\"/><circle cx=\"12\" cy=\"12\" r=\"3.2\"/><path d=\"M9 2L7.17 4H4c-1.1 0-2 .9-2 2v12c0 1.1.9 2 2 2h16c1.1 0 2-.9 2-2V6c0-1.1-.9-2-2-2h-3.17L15 2H9zm3 15c-2.76 0-5-2.24-5-5s2.24-5 5-5 5 2.24 5 5-2.24 5-5 5z\"/></svg>\n {this.localResx?.takePicture}\n </button>\n ]\n ]\n }\n {this.takingPicture &&\n <div class=\"video-preview\">\n <video ref={e => this.videoPreview = e} />\n <button\n onClick={() => this.applySnapshot()}\n >\n <svg xmlns=\"http://www.w3.org/2000/svg\" height=\"24px\" viewBox=\"0 0 24 24\" width=\"24px\" fill=\"#000000\"><path d=\"M0 0h24v24H0z\" fill=\"none\"/><circle cx=\"12\" cy=\"12\" r=\"3.2\"/><path d=\"M9 2L7.17 4H4c-1.1 0-2 .9-2 2v12c0 1.1.9 2 2 2h16c1.1 0 2-.9 2-2V6c0-1.1-.9-2-2-2h-3.17L15 2H9zm3 15c-2.76 0-5-2.24-5-5s2.24-5 5-5 5 2.24 5 5-2.24 5-5 5z\"/></svg> \n {this.localResx?.capture}\n </button>\n </div>\n }\n { this.fileTooLarge && \n <div class='error'>\n <p>\n {this.localResx.uploadSizeTooLarge}\n <br/>\n {this.localResx.fileSizeLimit.replace(\"{0}\", getReadableFileSizeString(this.maxFileSize)) } \n </p>\n </div>\n }\n { this.invalidExtension &&\n <div class='error'>\n <p>\n {this.localResx.invalidExtension}\n <br/>\n {this.getInvalidExtensionsMessage()}\n </p>\n </div>\n }\n </Host>\n );\n }\n}\n"],"version":3}

package/package.json CHANGED Viewed

@@ -1,6 +1,6 @@
 {
   "name": "@dnncommunity/dnn-elements",
-  "version": "0.25.0",
+  "version": "0.25.1",
   "description": "Dnn themed custom elements.",
   "repository": "https://github.com/dnncommunity/dnn-elements",
   "homepage": "https://dnncommunity.github.io/dnn-elements",

package/dist/dnn/p-00fccd70.entry.js DELETED Viewed

	@@ -1,2 +0,0 @@
1	- import{r as e,c as i,h as t,H as a}from"./p-91d08ab2.js";import{a as s}from"./p-5df01911.js";const d=":host{--border-color:var(--dnn-color-tertiary-contrast, lightgray);--border-radius:var(--dnn-controls-radius, 5px);--drop-background-color:var(--dnn-color-tertiary, lightblue);display:flex;flex-direction:column;gap:1rem;text-align:center;border:2px dashed var(--border-color);border-radius:var(--border-radius);padding:1rem;transition:all 300ms ease-in-out}:host(.dropping){background-color:var(--drop-background-color)}p{margin:0;padding:0}button{display:flex;justify-content:center;align-items:center;border:0px;margin:0;padding:0;background-color:transparent}button:hover{cursor:pointer}button svg{margin-right:0.5rem}label.upload-file{display:flex;justify-content:center;align-items:center;cursor:pointer}label.upload-file input{display:none}.video-preview{display:flex;flex-direction:column;align-items:center}.video-preview button{margin:1rem}.error{color:red}";const r=d;const n=class{constructor(t){e(this,t);this.filesSelected=i(this,"filesSelected",7);if(t.$hostElement$["s-ei"]){this.internals=t.$hostElement$["s-ei"]}else{this.internals=t.$hostElement$.attachInternals();t.$hostElement$["s-ei"]=this.internals}this.defaultResx={dragAndDropFile:"Drag and drop a file",capture:"Capture",or:"or",takePicture:"Take a picture",uploadFile:"Upload a file",uploadSizeTooLarge:"The file you tried to upload is too large.",fileSizeLimit:"The maximum size is {0}",invalidExtension:"The file you tried to upload has an invalid extension.",allowedFileExtensions:"Allowed file extensions: {0}"};this.handleDragOver=e=>{e.stopPropagation();e.preventDefault();e.dataTransfer.dropEffect="copy";this.dropzone.classList.add("dropping")};this.handleDrop=e=>{this.invalidExtension=false;this.fileTooLarge=false;e.stopPropagation();e.preventDefault();const i=e.dataTransfer.files;if(this.hasInvalidExtensions(Array.from(i))){this.invalidExtension=true;return}if(this.isAnyFileLargerThanAllowed(Array.from(i))){this.fileTooLarge=true;return}var t=this.getFilesFromFileList(i);this.filesSelected.emit(t)};this.resx=undefined;this.allowedExtensions=undefined;this.allowCameraMode=false;this.captureQuality=.8;this.maxFileSize=undefined;this.name=undefined;this.canTakeSnapshots=false;this.takingPicture=false;this.fileTooLarge=false;this.invalidExtension=false;this.localResx=undefined;this.focused=false}componentWillLoad(){this.mergeResx()}componentDidLoad(){if(this.allowCameraMode){this.checkIfBrowserCanTakeSnapshots().then((e=>this.canTakeSnapshots=e))}if(this.allowedExtensions!=undefined&&this.allowedExtensions.length>0){var e=this.allowedExtensions.map((e=>`.${e}`));var i=e.join(",");this.fileInput.accept=i}}resxChanged(){this.mergeResx()}formResetCallback(){this.internals.setValidity({});this.fileInput.value="";this.internals.setFormValue("")}mergeResx(){this.localResx=Object.assign(Object.assign({},this.defaultResx),this.resx)}checkIfBrowserCanTakeSnapshots(){return new Promise((e=>{const i=navigator.mediaDevices;if(i==undefined\|\|i.enumerateDevices==undefined){e(false)}i.enumerateDevices().then((i=>{var t=i.some((e=>e.kind=="videoinput"));e(t)}))}))}getFilesFromFileList(e){var i=[];for(let t=0;t<e.length;t++){const a=e[t];i.push(a)}return i}isAnyFileLargerThanAllowed(e){if(this.maxFileSize==undefined\|\|this.maxFileSize<=0){return false}if(e.some((e=>e.size>this.maxFileSize))){return true}return false}handleUploadKeyDown(e){if(e.key==="Enter"\|\|e.key===" "){e.preventDefault();this.fileInput.click()}}handleUploadButton(e){this.fileTooLarge=false;this.invalidExtension=false;let i=this.getFilesFromFileList(e.files);if(this.isAnyFileLargerThanAllowed(i)){this.fileTooLarge=true;return}if(this.hasInvalidExtensions(i)){this.invalidExtension=true;return}this.filesSelected.emit(i);if(this.name!=undefined&&this.name.length>0){var t=new FormData;i.forEach((e=>{t.append(this.name,e)}));this.internals.setFormValue(t)}}hasInvalidExtensions(e){var i,t;var a=false;for(let r=0;r<e.length;r++){const n=e[r];var s=/(?:\.([^.]+))?$/;const o=(i=s.exec(n.name)[1])===null\|\|i===void 0?void 0:i.toLowerCase();if(o==undefined){a=true}var d=(t=this.allowedExtensions)===null\|\|t===void 0?void 0:t.map((e=>e.toLowerCase()));if(this.allowedExtensions!=undefined&&!(d===null\|\|d===void 0?void 0:d.includes(o))){a=true}return a}}takeSnapshot(){this.takingPicture=true;navigator.mediaDevices.getUserMedia({video:true,audio:false}).then((e=>{this.videoPreview.srcObject=e;this.videoPreview.play().then((()=>{this.videoSettings=e.getVideoTracks()[0].getSettings()}))})).catch((e=>alert(e)))}applySnapshot(){var e=document.createElement("canvas");const i=e.getContext("2d");e.width=this.videoSettings.width;e.height=this.videoSettings.height;i.drawImage(this.videoPreview,0,0);e.toBlob((e=>{var i=new File([e],"image.jpeg",{type:"image/jpeg"});this.takingPicture=false;var t=[i];this.filesSelected.emit(t)}),"image/jpeg",this.captureQuality)}getInvalidExtensionsMessage(){var e=this.localResx.allowedFileExtensions;var e=e.replace("{0}",this.allowedExtensions.join(", "));return e}render(){var e,i,d,r,n,o;return t(a,{key:"e8cb239b37d1be0f7c41240465cd6a158ab0097b",ref:e=>this.dropzone=e,class:"dropzone",onDragOver:e=>this.handleDragOver(e),onDrop:e=>this.handleDrop(e),onDragLeave:()=>this.dropzone.classList.remove("dropping"),tabIndex:this.focused?-1:0,onFocus:()=>this.uploadLabel.focus(),onBlur:()=>this.uploadLabel.blur()},!this.takingPicture&&[t("p",{key:"0a6f9cdb3eef3449dc2092cd6ed5d32e431f3c2d"},(e=this.localResx)===null\|\|e===void 0?void 0:e.dragAndDropFile),t("p",{key:"1179185c6fa4615e9f3ad362e7f7b663c80ee8f9"},"- ",(i=this.localResx)===null\|\|i===void 0?void 0:i.or," -"),t("label",{key:"15a2262c638dd5b4b2f5c0d51fb4d361ccdc98cc",class:"upload-file",tabIndex:0,onKeyDown:e=>this.handleUploadKeyDown(e),ref:e=>this.uploadLabel=e,onFocus:()=>this.focused=true,onBlur:()=>this.focused=false},t("input",{key:"8890c891d3805213887403528b9e8d8661f81100",type:"file",ref:e=>this.fileInput=e,onChange:e=>this.handleUploadButton(e.target)}),t("span",{key:"e4b5083f873c27f7550f29ee5d6f433a4e79ab58"},t("svg",{key:"3f3d9e3e491ab3159767da319d08b3a07c08a65d",xmlns:"http://www.w3.org/2000/svg","enable-background":"new 0 0 24 24",height:"24px",viewBox:"0 0 24 24",width:"24px",fill:"#000000"},t("g",{key:"d88531469503abfc3b33940f7f690545a6bd7c47"},t("rect",{key:"67cfd319af430b66b2c3c4db9cf043b5ca8b44d2",fill:"none",height:"24",width:"24"})),t("g",{key:"929ff336aa3a765c6b0ae3804af479152f15580e"},t("path",{key:"423d42dd1312a6e92e58112c9abb17c9747c5edc",d:"M5,20h14v-2H5V20z M5,10h4v6h6v-6h4l-7-7L5,10z"}))))," ",(d=this.localResx)===null\|\|d===void 0?void 0:d.uploadFile),this.canTakeSnapshots&&[t("p",{key:"79d4eba604972b765af99a259444017effc430d0"},"- ",(r=this.localResx)===null\|\|r===void 0?void 0:r.or," -"),t("button",{key:"181c7f2c3e0fe10a0e442f671b585d7fd52240e4",onClick:()=>this.takeSnapshot()},t("svg",{key:"a7895b7adac1558f45ccccc87f449bb2ffec557c",xmlns:"http://www.w3.org/2000/svg",height:"24px",viewBox:"0 0 24 24",width:"24px",fill:"#000000"},t("path",{key:"23128d601f71f2e8cd8af075fe74de8e7f67e92c",d:"M0 0h24v24H0z",fill:"none"}),t("circle",{key:"a082e32a026bfa4586fe203783cbd585e244f774",cx:"12",cy:"12",r:"3.2"}),t("path",{key:"8f1b6b43558cb3ad0e375b01f71da751d88afea8",d:"M9 2L7.17 4H4c-1.1 0-2 .9-2 2v12c0 1.1.9 2 2 2h16c1.1 0 2-.9 2-2V6c0-1.1-.9-2-2-2h-3.17L15 2H9zm3 15c-2.76 0-5-2.24-5-5s2.24-5 5-5 5 2.24 5 5-2.24 5-5 5z"})),(n=this.localResx)===null\|\|n===void 0?void 0:n.takePicture)]],this.takingPicture&&t("div",{key:"48ccb4be518d323659462b075f0ee2bf6d7ae052",class:"video-preview"},t("video",{key:"26659446b8ac3c291aa89352c19515978e0596f8",ref:e=>this.videoPreview=e}),t("button",{key:"9b7699d716d94611d4b3ae7590a5e76efe4f8b83",onClick:()=>this.applySnapshot()},t("svg",{key:"5576687f6e6592825ff4d89e12cc8da2cacf7b49",xmlns:"http://www.w3.org/2000/svg",height:"24px",viewBox:"0 0 24 24",width:"24px",fill:"#000000"},t("path",{key:"fb833f77e4803eb29d6eb68a92e1a9de775c756b",d:"M0 0h24v24H0z",fill:"none"}),t("circle",{key:"0abc995fbda0ce7af15004867d8cced2e153577d",cx:"12",cy:"12",r:"3.2"}),t("path",{key:"d3045fa3aecc259628598a2ed67c38a7721f1148",d:"M9 2L7.17 4H4c-1.1 0-2 .9-2 2v12c0 1.1.9 2 2 2h16c1.1 0 2-.9 2-2V6c0-1.1-.9-2-2-2h-3.17L15 2H9zm3 15c-2.76 0-5-2.24-5-5s2.24-5 5-5 5 2.24 5 5-2.24 5-5 5z"}))," ",(o=this.localResx)===null\|\|o===void 0?void 0:o.capture)),this.fileTooLarge&&t("div",{key:"b66d8d9f21a9948595df5217f9745e8ecc08f779",class:"error"},t("p",{key:"080b2779e7656c953d77a4b9719cc4984890ec87"},this.localResx.uploadSizeTooLarge,t("br",{key:"683ecdcf26529260f25e16988be94a71d570c61f"}),this.localResx.fileSizeLimit.replace("{0}",s(this.maxFileSize)))),this.invalidExtension&&t("div",{key:"3b48bf8ba1e235d2f4fb3e2192cf18735dfa35df",class:"error"},t("p",{key:"c0b42d27ae92e7d38d48fe9ac86c70d9d657b8c7"},this.localResx.invalidExtension,t("br",{key:"1e0995b7bb02db676e56840e5692b36e2ca5191a"}),this.getInvalidExtensionsMessage())))}static get formAssociated(){return true}static get watchers(){return{resx:["resxChanged"]}}};n.style=r;export{n as dnn_dropzone};
2	- //# sourceMappingURL=p-00fccd70.entry.js.map

package/dist/dnn/p-00fccd70.entry.js.map DELETED Viewed

@@ -1 +0,0 @@

- {"version":3,"names":["dnnDropzoneCss","DnnDropzoneStyle0","DnnDropzone","this","defaultResx","dragAndDropFile","capture","or","takePicture","uploadFile","uploadSizeTooLarge","fileSizeLimit","invalidExtension","allowedFileExtensions","handleDragOver","event","stopPropagation","preventDefault","dataTransfer","dropEffect","dropzone","classList","add","handleDrop","dropEvent","fileTooLarge","files","hasInvalidExtensions","Array","from","isAnyFileLargerThanAllowed","fileList","getFilesFromFileList","filesSelected","emit","componentWillLoad","mergeResx","componentDidLoad","allowCameraMode","checkIfBrowserCanTakeSnapshots","then","result","canTakeSnapshots","allowedExtensions","undefined","length","extensionsWithDots","map","e","extensionsList","join","fileInput","accept","resxChanged","formResetCallback","internals","setValidity","value","setFormValue","localResx","Object","assign","resx","Promise","resolve","mediaDevices","navigator","enumerateDevices","devices","some","device","kind","index","file","push","maxFileSize","size","handleUploadKeyDown","key","click","handleUploadButton","element","name","data","FormData","forEach","append","hasInvalid","fileIndex","regex","fileExtension","_a","exec","toLowerCase","loweredAllowedExtensions","_b","includes","takeSnapshot","takingPicture","getUserMedia","video","audio","stream","videoPreview","srcObject","play","videoSettings","getVideoTracks","getSettings","catch","error","alert","applySnapshot","canvas","document","createElement","context","getContext","width","height","drawImage","toBlob","blob","File","type","captureQuality","getInvalidExtensionsMessage","message","replace","render","h","Host","ref","class","onDragOver","onDrop","onDragLeave","remove","tabIndex","focused","onFocus","uploadLabel","focus","onBlur","blur","onKeyDown","el","onChange","target","xmlns","viewBox","fill","d","_c","_d","onClick","cx","cy","r","_e","_f","getReadableFileSizeString"],"sources":["src/components/dnn-dropzone/dnn-dropzone.scss?tag=dnn-dropzone&encapsulation=shadow","src/components/dnn-dropzone/dnn-dropzone.tsx"],"sourcesContent":["\n:host {\n /** \n * @prop --border-color: The color of the border.\n * @prop --border-radius: The radius of the controls borders.\n * @prop --drop-background-color: The color of the background when a file is dropping.\n */\n --border-color: var(--dnn-color-tertiary-contrast, lightgray);\n --border-radius: var(--dnn-controls-radius, 5px);\n --drop-background-color: var(--dnn-color-tertiary, lightblue);\n\n display: flex;\n flex-direction: column;\n gap: 1rem;\n text-align: center;\n border: 2px dashed var(--border-color);\n border-radius: var(--border-radius);\n padding: 1rem;\n transition: all 300ms ease-in-out;\n}\n\n:host(.dropping){\n background-color: var(--drop-background-color);\n}\np{\n margin: 0;\n padding: 0;\n}\nbutton{\n display: flex;\n justify-content: center;\n align-items: center;\n border: 0px;\n margin: 0;\n padding: 0;\n background-color: transparent;\n &:hover{\n cursor: pointer;\n }\n svg{\n margin-right: 0.5rem;\n }\n}\nlabel.upload-file{\n display: flex;\n justify-content: center;\n align-items: center;\n cursor: pointer;\n input{\n display: none;\n }\n}\n.video-preview{\n display: flex;\n flex-direction: column;\n align-items: center;\n button{\n margin: 1rem;\n }\n}\n.error {\n color:red;\n}","import { Component, Host, h, Prop, State, Event, EventEmitter, Watch, AttachInternals } from '@stencil/core';\nimport { getReadableFileSizeString } from '../../utilities/stringUtilities';\nimport { DropzoneResx } from './types';\n\n@Component({\n tag: 'dnn-dropzone',\n styleUrl: 'dnn-dropzone.scss',\n shadow: true,\n formAssociated: true,\n})\nexport class DnnDropzone {\n /** Localization strings */\n @Prop() resx:DropzoneResx;\n\n /** A list of allowed file extensions.\n * If not specified, any file is allowed.\n * Ex: [\"jpg\", \"jpeg\", \"gif\", \"png\"]\n */\n @Prop() allowedExtensions: string[];\n\n /**\n * If true, will allow the user to take a snapshot\n * using the device camera. (only works over https).\n */\n @Prop() allowCameraMode: boolean = false;\n\n /**\n * Specifies the jpeg quality for when the device\n * camera is used to generate a picture.\n * Needs to be a number between 0 and 1 and defaults to 0.8\n */\n @Prop() captureQuality: number = 0.8;\n\n /**\n * Max file size in bytes.\n */\n @Prop() maxFileSize?: number;\n\n /** The name of the field when used in a form. */\n @Prop() name: string;\n\n /** Fires when file were selected. */\n @Event() filesSelected: EventEmitter<File[]>;\n \n @State() canTakeSnapshots: boolean = false;\n @State() takingPicture: boolean = false;\n @State() fileTooLarge: boolean = false;\n @State() invalidExtension: boolean = false;\n @State() localResx: DropzoneResx;\n @State() focused = false;\n\n @AttachInternals() internals: ElementInternals;\n\n private dropzone: HTMLElement;\n private fileInput: HTMLInputElement;\n private videoPreview: HTMLVideoElement;\n private uploadLabel: HTMLLabelElement;\n private videoSettings!: MediaTrackSettings;\n private defaultResx: DropzoneResx = {\n dragAndDropFile: \"Drag and drop a file\",\n capture: \"Capture\",\n or: \"or\",\n takePicture: \"Take a picture\",\n uploadFile: \"Upload a file\",\n uploadSizeTooLarge: \"The file you tried to upload is too large.\",\n fileSizeLimit: \"The maximum size is {0}\",\n invalidExtension: \"The file you tried to upload has an invalid extension.\",\n allowedFileExtensions: \"Allowed file extensions: {0}\",\n }\n\n componentWillLoad() {\n this.mergeResx();\n }\n\n componentDidLoad() {\n if (this.allowCameraMode){\n this.checkIfBrowserCanTakeSnapshots()\n .then(result => this.canTakeSnapshots = result);\n }\n if (this.allowedExtensions != undefined && this.allowedExtensions.length > 0){\n var extensionsWithDots = this.allowedExtensions.map(e => `.${e}`);\n var extensionsList = extensionsWithDots.join(\",\");\n this.fileInput.accept = extensionsList;\n }\n }\n\n @Watch('resx')\n resxChanged() {\n this.mergeResx();\n }\n\n // eslint-disable-next-line @stencil-community/own-methods-must-be-private\n formResetCallback() {\n this.internals.setValidity({});\n this.fileInput.value = \"\";\n this.internals.setFormValue(\"\");\n }\n\n private mergeResx(): void {\n this.localResx = {...this.defaultResx, ...this.resx};\n }\n\n private checkIfBrowserCanTakeSnapshots(): Promise<boolean> {\n return new Promise((resolve) => {\n const mediaDevices = navigator.mediaDevices;\n if (mediaDevices == undefined || mediaDevices.enumerateDevices == undefined) {\n resolve(false);\n }\n mediaDevices.enumerateDevices()\n .then(devices => {\n var result = devices.some(device => device.kind == \"videoinput\");\n resolve(result);\n });\n });\n }\n\n private getFilesFromFileList(files: FileList) : File[] {\n var fileList: File[] = [];\n for (let index = 0; index < files.length; index++) {\n const file = files[index];\n fileList.push(file);\n }\n\n return fileList;\n }\n\n private isAnyFileLargerThanAllowed (files:File[]) : boolean {\n if (this.maxFileSize == undefined || this.maxFileSize <= 0) {\n return false;\n } \n\n if ( files.some(file => file.size > this.maxFileSize )) {\n return true;\n }\n\n return false;\n }\n\n private handleUploadKeyDown(event: KeyboardEvent) {\n if (event.key === 'Enter' || event.key === ' ') {\n event.preventDefault();\n this.fileInput.click();\n }\n }\n\n private handleUploadButton(element: HTMLInputElement): void {\n this.fileTooLarge = false;\n this.invalidExtension = false;\n let files = this.getFilesFromFileList(element.files);\n \n if (this.isAnyFileLargerThanAllowed(files)) {\n this.fileTooLarge = true;\n return;\n }\n\n if (this.hasInvalidExtensions(files)){\n this.invalidExtension = true;\n return;\n }\n\n this.filesSelected.emit(files);\n if (this.name != undefined && this.name.length > 0){\n var data = new FormData();\n files.forEach(file => {\n data.append(this.name, file);\n });\n this.internals.setFormValue(data);\n }\n }\n\n private handleDragOver = (event: DragEvent) => \n {\n event.stopPropagation();\n event.preventDefault();\n event.dataTransfer.dropEffect = \"copy\";\n this.dropzone.classList.add(\"dropping\");\n };\n\n private hasInvalidExtensions(files: File[]): boolean{\n var hasInvalid = false;\n for (let fileIndex = 0; fileIndex < files.length; fileIndex++) {\n const file = files[fileIndex];\n var regex = /(?:\\.([^.]+))?$/;\n const fileExtension = regex.exec(file.name)[1]?.toLowerCase();\n if (fileExtension == undefined){\n hasInvalid = true;\n }\n\n var loweredAllowedExtensions = this.allowedExtensions?.map(e => e.toLowerCase());\n if (this.allowedExtensions != undefined && !loweredAllowedExtensions?.includes(fileExtension)){\n hasInvalid = true;\n }\n\n return hasInvalid;\n }\n }\n\n private handleDrop = (dropEvent: DragEvent) => {\n this.invalidExtension = false;\n this.fileTooLarge = false;\n dropEvent.stopPropagation();\n dropEvent.preventDefault();\n const files = dropEvent.dataTransfer.files;\n\n if (this.hasInvalidExtensions(Array.from(files))){\n this.invalidExtension = true;\n return;\n }\n\n if (this.isAnyFileLargerThanAllowed(Array.from(files))) {\n this.fileTooLarge = true;\n return;\n }\n\n var fileList = this.getFilesFromFileList(files);\n this.filesSelected.emit(fileList);\n };\n\n private takeSnapshot(): void {\n this.takingPicture = true;\n navigator.mediaDevices.getUserMedia({video: true, audio: false})\n .then(stream => {\n stream\n this.videoPreview.srcObject = stream;\n this.videoPreview.play()\n .then(() => {\n this.videoSettings = stream.getVideoTracks()[0].getSettings();\n });\n })\n .catch(error => alert(error));\n }\n\n private applySnapshot(): void {\n var canvas = document.createElement(\"canvas\");\n const context = canvas.getContext(\"2d\");\n canvas.width = this.videoSettings.width;\n canvas.height = this.videoSettings.height;\n context.drawImage(this.videoPreview, 0, 0);\n canvas.toBlob(blob => {\n var file = new File([blob], \"image.jpeg\", {type:\"image/jpeg\"});\n this.takingPicture = false;\n \n var fileList = [file];\n this.filesSelected.emit(fileList)\n }, \"image/jpeg\", this.captureQuality);\n }\n\n private getInvalidExtensionsMessage() {\n var message = this.localResx.allowedFileExtensions;\n var message = message.replace(\"{0}\", this.allowedExtensions.join(\", \"));\n return message;\n }\n \n render() {\n return (\n <Host\n ref={e => this.dropzone = e}\n class=\"dropzone\"\n onDragOver={e => this.handleDragOver(e)}\n onDrop={e => this.handleDrop(e)}\n onDragLeave={() => this.dropzone.classList.remove(\"dropping\")}\n tabIndex={this.focused ? -1 : 0}\n onFocus={() => this.uploadLabel.focus()}\n onBlur={() => this.uploadLabel.blur()}\n >\n {!this.takingPicture &&\n [\n <p>{this.localResx?.dragAndDropFile}</p>\n ,\n <p>- {this.localResx?.or} -</p>\n ,\n <label\n class=\"upload-file\"\n tabIndex={0}\n onKeyDown={e => this.handleUploadKeyDown(e)}\n ref={el => this.uploadLabel = el}\n onFocus={() => this.focused = true}\n onBlur={() => this.focused = false}\n >\n <input\n type=\"file\"\n ref={el => this.fileInput = el}\n onChange={e => this.handleUploadButton(e.target as HTMLInputElement)}\n >\n </input>\n <span>\n <svg\n xmlns=\"http://www.w3.org/2000/svg\"\n enable-background=\"new 0 0 24 24\"\n height=\"24px\"\n viewBox=\"0 0 24 24\"\n width=\"24px\"\n fill=\"#000000\">\n <g><rect fill=\"none\" height=\"24\" width=\"24\"/></g>\n <g><path d=\"M5,20h14v-2H5V20z M5,10h4v6h6v-6h4l-7-7L5,10z\"/></g>\n </svg>\n </span>\n  \n {this.localResx?.uploadFile}\n </label>\n ,\n this.canTakeSnapshots &&\n [\n <p>- {this.localResx?.or} -</p>\n ,\n <button\n onClick={() => this.takeSnapshot()}\n >\n <svg xmlns=\"http://www.w3.org/2000/svg\" height=\"24px\" viewBox=\"0 0 24 24\" width=\"24px\" fill=\"#000000\"><path d=\"M0 0h24v24H0z\" fill=\"none\"/><circle cx=\"12\" cy=\"12\" r=\"3.2\"/><path d=\"M9 2L7.17 4H4c-1.1 0-2 .9-2 2v12c0 1.1.9 2 2 2h16c1.1 0 2-.9 2-2V6c0-1.1-.9-2-2-2h-3.17L15 2H9zm3 15c-2.76 0-5-2.24-5-5s2.24-5 5-5 5 2.24 5 5-2.24 5-5 5z\"/></svg>\n {this.localResx?.takePicture}\n </button>\n ]\n ]\n }\n {this.takingPicture &&\n <div class=\"video-preview\">\n <video ref={e => this.videoPreview = e} />\n <button\n onClick={() => this.applySnapshot()}\n >\n <svg xmlns=\"http://www.w3.org/2000/svg\" height=\"24px\" viewBox=\"0 0 24 24\" width=\"24px\" fill=\"#000000\"><path d=\"M0 0h24v24H0z\" fill=\"none\"/><circle cx=\"12\" cy=\"12\" r=\"3.2\"/><path d=\"M9 2L7.17 4H4c-1.1 0-2 .9-2 2v12c0 1.1.9 2 2 2h16c1.1 0 2-.9 2-2V6c0-1.1-.9-2-2-2h-3.17L15 2H9zm3 15c-2.76 0-5-2.24-5-5s2.24-5 5-5 5 2.24 5 5-2.24 5-5 5z\"/></svg> \n {this.localResx?.capture}\n </button>\n </div>\n }\n { this.fileTooLarge && \n <div class='error'>\n <p>\n {this.localResx.uploadSizeTooLarge}\n <br/>\n {this.localResx.fileSizeLimit.replace(\"{0}\", getReadableFileSizeString(this.maxFileSize)) } \n </p>\n </div>\n }\n { this.invalidExtension &&\n <div class='error'>\n <p>\n {this.localResx.invalidExtension}\n <br/>\n {this.getInvalidExtensionsMessage()}\n </p>\n </div>\n }\n </Host>\n );\n }\n}\n"],"mappings":"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","ignoreList":[]}