@paperless/core 2.9.1 → 2.9.2
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.
- package/CHANGELOG.md +8 -0
- package/dist/build/p-0f2d54d2.entry.js +2 -0
- package/dist/build/p-0f2d54d2.entry.js.map +1 -0
- package/dist/build/{p-cc4d0190.js → p-4df6d390.js} +1 -1
- package/dist/build/p-attachment.entry.esm.js.map +1 -1
- package/dist/build/paperless.esm.js +1 -1
- package/dist/cjs/p-attachment.cjs.entry.js +12 -10
- package/dist/cjs/p-attachment.cjs.entry.js.map +1 -1
- package/dist/cjs/p-attachment.entry.cjs.js.map +1 -1
- package/dist/collection/components/molecules/attachment/attachment.component.css +1 -1
- package/dist/collection/components/molecules/attachment/attachment.component.js +11 -9
- package/dist/collection/components/molecules/attachment/attachment.component.js.map +1 -1
- package/dist/components/p-attachment.js +12 -10
- package/dist/components/p-attachment.js.map +1 -1
- package/dist/esm/p-attachment.entry.js +12 -10
- package/dist/esm/p-attachment.entry.js.map +1 -1
- package/dist/index.html +1 -1
- package/dist/paperless/p-0f2d54d2.entry.js +2 -0
- package/dist/paperless/p-0f2d54d2.entry.js.map +1 -0
- package/dist/paperless/p-attachment.entry.esm.js.map +1 -1
- package/dist/paperless/paperless.esm.js +1 -1
- package/dist/sw.js +1 -1
- package/dist/sw.js.map +1 -1
- package/package.json +1 -1
- package/dist/build/p-6175408c.entry.js +0 -2
- package/dist/build/p-6175408c.entry.js.map +0 -1
- package/dist/paperless/p-6175408c.entry.js +0 -2
- package/dist/paperless/p-6175408c.entry.js.map +0 -1
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"p-attachment.entry.cjs.js","sources":["src/components/molecules/attachment/attachment.component.css?tag=p-attachment&encapsulation=shadow","src/components/molecules/attachment/attachment.component.tsx"],"sourcesContent":[":host {\n\t@apply block w-full;\n}\n","import {\n\tComponent,\n\tEvent,\n\tEventEmitter,\n\tFragment,\n\th,\n\tProp,\n} from '@stencil/core';\nimport { cn, isMobile, isTablet } from '../../../utils';\nimport { cva } from 'class-variance-authority';\n\nconst attachment = cva(\n\t[\n\t\t'flex flex-1 items-center justify-start gap-2',\n\t\t'h-8 min-w-0 px-2 rounded-lg',\n\t\t'border border-solid bg-white-600',\n\t],\n\t{\n\t\tvariants: {\n\t\t\tclick: {\n\t\t\t\tfalse: null,\n\t\t\t\ttrue: 'cursor-pointer',\n\t\t\t},\n\t\t\terror: {\n\t\t\t\tfalse: 'bg-white-600 border-storm-100 text-storm-200',\n\t\t\t\ttrue: 'border-negative-red-500',\n\t\t\t},\n\t\t},\n\t}\n);\n\n@Component({\n\ttag: 'p-attachment',\n\tstyleUrl: 'attachment.component.css',\n\tshadow: true,\n})\nexport class Attachment {\n\t/**\n\t * Wether to enable the camera button on mobile\n\t */\n\t@Prop() enableCameraOnMobile = false;\n\n\t/**\n\t * The value of the attachment (usually the file name)\n\t */\n\t@Prop() value: string;\n\n\t/**\n\t * The fileID to use to track the file\n\t */\n\t@Prop() fileId: string;\n\n\t/**\n\t * The type of files to accept\n\t */\n\t@Prop() accept: string[] | string = null;\n\n\t/**\n\t * The label of the attachment\n\t */\n\t@Prop() label: string | HTMLSlotElement;\n\n\t/**\n\t * The helper of the attachment\n\t */\n\t@Prop() helper: string | HTMLSlotElement;\n\n\t/**\n\t * Wether the attachment is required\n\t */\n\t@Prop({ reflect: true }) required = true;\n\n\t/**\n\t * The variant of the attachment\n\t */\n\t@Prop() mode: 'read' | 'write' = 'read';\n\n\t/**\n\t * The placeholder of the attachment\n\t */\n\t@Prop() placeholder: string = 'Upload a file...';\n\n\t/**\n\t * The text for the camera tooltip\n\t */\n\t@Prop() cameraTooltip: string = 'Camera';\n\n\t/**\n\t * The text for the download tooltip\n\t */\n\t@Prop() downloadTooltip: string = 'Download';\n\n\t/**\n\t * The text for the upload tooltip\n\t */\n\t@Prop() uploadTooltip: string = 'Upload';\n\n\t/**\n\t * The text for the delete tooltip\n\t */\n\t@Prop() deleteTooltip: string = 'Delete';\n\n\t/**\n\t * Wether the attachment is loading\n\t */\n\t@Prop() loading = false;\n\n\t/**\n\t * The error to show\n\t */\n\t@Prop() error: string;\n\n\t/**\n\t * Event when upload is pressed\n\t */\n\t@Event({\n\t\tbubbles: false,\n\t})\n\tupload: EventEmitter<{\n\t\tfile: File;\n\t\tfileId: string;\n\t\tresult: string;\n\t}>;\n\n\t/**\n\t * Event when download is pressed\n\t */\n\t@Event({\n\t\tbubbles: false,\n\t})\n\tdownload: EventEmitter<void>;\n\n\t/**\n\t * Event when delete is pressed\n\t */\n\t@Event({\n\t\tbubbles: false,\n\t})\n\tdelete: EventEmitter<void>;\n\n\tprivate _fileRef: HTMLInputElement;\n\tprivate _cameraFileRef: HTMLInputElement;\n\n\trender() {\n\t\tlet prefix = (\n\t\t\t<p-icon\n\t\t\t\tclass='text-storm-300'\n\t\t\t\tvariant='attachment'\n\t\t\t/>\n\t\t);\n\n\t\tif (this.error) {\n\t\t\tprefix = (\n\t\t\t\t<p-icon\n\t\t\t\t\tvariant='warning'\n\t\t\t\t\tclass='text-negative-red-500'\n\t\t\t\t/>\n\t\t\t);\n\t\t}\n\n\t\t// const isMobileDevice = isMobile();\n\t\tconst isMobileDevice = isTablet();\n\n\t\tconst baseText =\n\t\t\t'min-w-0 flex-1 overflow-hidden text-ellipsis whitespace-nowrap text-sm';\n\t\treturn (\n\t\t\t<Fragment>\n\t\t\t\t<p-field-container\n\t\t\t\t\tvariant='write'\n\t\t\t\t\tlabel={this.label}\n\t\t\t\t\thelper={this.helper}\n\t\t\t\t\terror={this.error}\n\t\t\t\t\trequired={this.required}\n\t\t\t\t\tforceShowTooltip={!!this.error?.length}\n\t\t\t\t>\n\t\t\t\t\t<div\n\t\t\t\t\t\tslot='content'\n\t\t\t\t\t\tclass='flex w-full items-start gap-2'\n\t\t\t\t\t>\n\t\t\t\t\t\t<div\n\t\t\t\t\t\t\tclass={attachment({\n\t\t\t\t\t\t\t\tclick: this.mode === 'write' && !this.value?.length,\n\t\t\t\t\t\t\t\terror: !!this.error?.length,\n\t\t\t\t\t\t\t})}\n\t\t\t\t\t\t\tonClick={() => this._uploadClick()}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{prefix}\n\n\t\t\t\t\t\t\t<span class={cn(baseText, 'peer empty:hidden')}>\n\t\t\t\t\t\t\t\t{this.value}\n\t\t\t\t\t\t\t</span>\n\t\t\t\t\t\t\t<span class={cn(baseText, 'hidden peer-empty:block')}>\n\t\t\t\t\t\t\t\t{this.placeholder}\n\t\t\t\t\t\t\t</span>\n\t\t\t\t\t\t</div>\n\n\t\t\t\t\t\t<p-tooltip\n\t\t\t\t\t\t\tclass='w-8'\n\t\t\t\t\t\t\tcontent={\n\t\t\t\t\t\t\t\tthis.mode === 'read'\n\t\t\t\t\t\t\t\t\t? this.downloadTooltip\n\t\t\t\t\t\t\t\t\t: this.value?.length\n\t\t\t\t\t\t\t\t\t? this.deleteTooltip\n\t\t\t\t\t\t\t\t\t: this.uploadTooltip\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<p-button\n\t\t\t\t\t\t\t\tslot='trigger'\n\t\t\t\t\t\t\t\tvariant='secondary'\n\t\t\t\t\t\t\t\ticonOnly={true}\n\t\t\t\t\t\t\t\ticon={\n\t\t\t\t\t\t\t\t\tthis.mode === 'read'\n\t\t\t\t\t\t\t\t\t\t? 'download'\n\t\t\t\t\t\t\t\t\t\t: this.value?.length\n\t\t\t\t\t\t\t\t\t\t? 'trash'\n\t\t\t\t\t\t\t\t\t\t: 'upload'\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\tdisabled={this.loading}\n\t\t\t\t\t\t\t\tloading={this.loading}\n\t\t\t\t\t\t\t\tonOnClick={() =>\n\t\t\t\t\t\t\t\t\tthis.mode === 'write' && !this.value?.length\n\t\t\t\t\t\t\t\t\t\t? this._uploadClick()\n\t\t\t\t\t\t\t\t\t\t: (this.mode === 'read'\n\t\t\t\t\t\t\t\t\t\t\t\t? this.download\n\t\t\t\t\t\t\t\t\t\t\t\t: this.delete\n\t\t\t\t\t\t\t\t\t\t ).emit()\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t</p-tooltip>\n\n\t\t\t\t\t\t{this.enableCameraOnMobile &&\n\t\t\t\t\t\t\tthis.mode === 'write' &&\n\t\t\t\t\t\t\tisMobileDevice &&\n\t\t\t\t\t\t\t!this.value?.length && (\n\t\t\t\t\t\t\t\t<p-tooltip\n\t\t\t\t\t\t\t\t\tcontent={this.cameraTooltip}\n\t\t\t\t\t\t\t\t\tclass='w-8 desktop-xs:hidden'\n\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t<p-button\n\t\t\t\t\t\t\t\t\t\tslot='trigger'\n\t\t\t\t\t\t\t\t\t\tvariant='secondary'\n\t\t\t\t\t\t\t\t\t\ticonOnly={true}\n\t\t\t\t\t\t\t\t\t\ticon='camera'\n\t\t\t\t\t\t\t\t\t\tonOnClick={() => this._cameraClick()}\n\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t</p-tooltip>\n\t\t\t\t\t\t\t)}\n\t\t\t\t\t</div>\n\t\t\t\t</p-field-container>\n\n\t\t\t\t<input\n\t\t\t\t\tclass='hidden'\n\t\t\t\t\ttype='file'\n\t\t\t\t\taccept={\n\t\t\t\t\t\tArray.isArray(this.accept) ? this.accept?.join(',') : this.accept\n\t\t\t\t\t}\n\t\t\t\t\tref={el => (this._fileRef = el)}\n\t\t\t\t\tonChange={ev => this._onFileChange(ev)}\n\t\t\t\t/>\n\n\t\t\t\t<input\n\t\t\t\t\tclass='hidden'\n\t\t\t\t\ttype='file'\n\t\t\t\t\taccept='image/*'\n\t\t\t\t\tcapture='true'\n\t\t\t\t\tref={el => (this._cameraFileRef = el)}\n\t\t\t\t\tonChange={ev => this._onFileChange(ev)}\n\t\t\t\t/>\n\t\t\t</Fragment>\n\t\t);\n\t}\n\n\tprivate _uploadClick() {\n\t\tif (!this._fileRef || this.mode !== 'write' || this.value?.length) {\n\t\t\treturn;\n\t\t}\n\n\t\tthis._fileRef.click();\n\t}\n\n\tprivate _cameraClick() {\n\t\tif (!this.enableCameraOnMobile || isMobile()) {\n\t\t\treturn;\n\t\t}\n\n\t\tif (!this._cameraFileRef || this.mode !== 'write') {\n\t\t\treturn;\n\t\t}\n\n\t\tthis._cameraFileRef?.click();\n\t}\n\n\tprivate _onFileChange(ev: Event) {\n\t\tconst target = ev.target as HTMLInputElement;\n\t\tconst file = target.files?.[0];\n\n\t\tif (file) {\n\t\t\tthis.loading = true;\n\n\t\t\tconst reader = new FileReader();\n\t\t\treader.onload = (e: any) => this._onLoad(file, e?.currentTarget?.result);\n\t\t\treader.readAsDataURL(file);\n\t\t}\n\t}\n\n\tprivate _onLoad(file: File, result: string) {\n\t\tthis.upload.emit({\n\t\t\tfileId: this.fileId,\n\t\t\tresult,\n\t\t\tfile,\n\t\t});\n\n\t\tif (this._fileRef) {\n\t\t\tthis._fileRef.value = '';\n\t\t}\n\n\t\tif (this._cameraFileRef) {\n\t\t\tthis._cameraFileRef.value = '';\n\t\t}\n\n\t\tthis.loading = false;\n\t}\n}\n"],"names":["cva","h","isTablet","Fragment","cn","isMobile"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"p-attachment.entry.cjs.js","sources":["src/components/molecules/attachment/attachment.component.css?tag=p-attachment&encapsulation=shadow","src/components/molecules/attachment/attachment.component.tsx"],"sourcesContent":[":host {\n\t@apply block w-full;\n}\n","import {\n\tComponent,\n\tEvent,\n\tEventEmitter,\n\tFragment,\n\th,\n\tProp,\n} from '@stencil/core';\nimport { cn, isMobile, isTablet } from '../../../utils';\nimport { cva } from 'class-variance-authority';\n\nconst attachment = cva(\n\t[\n\t\t'flex flex-1 items-center justify-start gap-2',\n\t\t'h-8 min-w-0 px-2 rounded-lg',\n\t\t'border border-solid',\n\t\t'bg-white-600 text-storm-200',\n\t\t'dark:bg-white/15 dark:text-hurricane-200',\n\t],\n\t{\n\t\tvariants: {\n\t\t\tclick: {\n\t\t\t\tfalse: null,\n\t\t\t\ttrue: 'cursor-pointer',\n\t\t\t},\n\t\t\terror: {\n\t\t\t\tfalse: 'border-storm-100 dark:border-white/15',\n\t\t\t\ttrue: 'border-negative-red-500 dark:border-negative-red-alternative',\n\t\t\t},\n\t\t},\n\t}\n);\n\n@Component({\n\ttag: 'p-attachment',\n\tstyleUrl: 'attachment.component.css',\n\tshadow: true,\n})\nexport class Attachment {\n\t/**\n\t * Wether to enable the camera button on mobile\n\t */\n\t@Prop() enableCameraOnMobile = false;\n\n\t/**\n\t * The value of the attachment (usually the file name)\n\t */\n\t@Prop() value: string;\n\n\t/**\n\t * The fileID to use to track the file\n\t */\n\t@Prop() fileId: string;\n\n\t/**\n\t * The type of files to accept\n\t */\n\t@Prop() accept: string[] | string = null;\n\n\t/**\n\t * The label of the attachment\n\t */\n\t@Prop() label: string | HTMLSlotElement;\n\n\t/**\n\t * The helper of the attachment\n\t */\n\t@Prop() helper: string | HTMLSlotElement;\n\n\t/**\n\t * Wether the attachment is required\n\t */\n\t@Prop({ reflect: true }) required = true;\n\n\t/**\n\t * The variant of the attachment\n\t */\n\t@Prop() mode: 'read' | 'write' = 'read';\n\n\t/**\n\t * The placeholder of the attachment\n\t */\n\t@Prop() placeholder: string = 'Upload a file...';\n\n\t/**\n\t * The text for the camera tooltip\n\t */\n\t@Prop() cameraTooltip: string = 'Camera';\n\n\t/**\n\t * The text for the download tooltip\n\t */\n\t@Prop() downloadTooltip: string = 'Download';\n\n\t/**\n\t * The text for the upload tooltip\n\t */\n\t@Prop() uploadTooltip: string = 'Upload';\n\n\t/**\n\t * The text for the delete tooltip\n\t */\n\t@Prop() deleteTooltip: string = 'Delete';\n\n\t/**\n\t * Wether the attachment is loading\n\t */\n\t@Prop() loading = false;\n\n\t/**\n\t * The error to show\n\t */\n\t@Prop() error: string;\n\n\t/**\n\t * Event when upload is pressed\n\t */\n\t@Event({\n\t\tbubbles: false,\n\t})\n\tupload: EventEmitter<{\n\t\tfile: File;\n\t\tfileId: string;\n\t\tresult: string;\n\t}>;\n\n\t/**\n\t * Event when download is pressed\n\t */\n\t@Event({\n\t\tbubbles: false,\n\t})\n\tdownload: EventEmitter<void>;\n\n\t/**\n\t * Event when delete is pressed\n\t */\n\t@Event({\n\t\tbubbles: false,\n\t})\n\tdelete: EventEmitter<void>;\n\n\tprivate _fileRef: HTMLInputElement;\n\tprivate _cameraFileRef: HTMLInputElement;\n\n\trender() {\n\t\tlet prefix = (\n\t\t\t<p-icon\n\t\t\t\tclass='text-storm-300'\n\t\t\t\tvariant='attachment'\n\t\t\t/>\n\t\t);\n\n\t\tif (this.error) {\n\t\t\tprefix = (\n\t\t\t\t<p-icon\n\t\t\t\t\tvariant='warning'\n\t\t\t\t\tclass='text-negative-red-500'\n\t\t\t\t/>\n\t\t\t);\n\t\t}\n\n\t\t// const isMobileDevice = isMobile();\n\t\tconst isMobileDevice = isTablet();\n\n\t\tconst baseText =\n\t\t\t'min-w-0 flex-1 overflow-hidden text-ellipsis whitespace-nowrap text-sm';\n\t\treturn (\n\t\t\t<Fragment>\n\t\t\t\t<p-field-container\n\t\t\t\t\tvariant='write'\n\t\t\t\t\tlabel={this.label}\n\t\t\t\t\thelper={this.helper}\n\t\t\t\t\terror={this.error}\n\t\t\t\t\trequired={this.required}\n\t\t\t\t\tforceShowTooltip={!!this.error?.length}\n\t\t\t\t>\n\t\t\t\t\t<div\n\t\t\t\t\t\tslot='content'\n\t\t\t\t\t\tclass='flex w-full items-start gap-2'\n\t\t\t\t\t>\n\t\t\t\t\t\t<div\n\t\t\t\t\t\t\tclass={attachment({\n\t\t\t\t\t\t\t\tclick: this.mode === 'write' && !this.value?.length,\n\t\t\t\t\t\t\t\terror: !!this.error?.length,\n\t\t\t\t\t\t\t})}\n\t\t\t\t\t\t\tonClick={() => this._uploadClick()}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{prefix}\n\n\t\t\t\t\t\t\t<span class={cn(baseText, 'peer empty:hidden')}>\n\t\t\t\t\t\t\t\t{this.value}\n\t\t\t\t\t\t\t</span>\n\t\t\t\t\t\t\t<span class={cn(baseText, 'hidden peer-empty:block')}>\n\t\t\t\t\t\t\t\t{this.placeholder}\n\t\t\t\t\t\t\t</span>\n\t\t\t\t\t\t</div>\n\n\t\t\t\t\t\t<p-tooltip\n\t\t\t\t\t\t\tclass='w-8'\n\t\t\t\t\t\t\tcontent={\n\t\t\t\t\t\t\t\tthis.mode === 'read'\n\t\t\t\t\t\t\t\t\t? this.downloadTooltip\n\t\t\t\t\t\t\t\t\t: this.value?.length\n\t\t\t\t\t\t\t\t\t? this.deleteTooltip\n\t\t\t\t\t\t\t\t\t: this.uploadTooltip\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<p-button\n\t\t\t\t\t\t\t\tslot='trigger'\n\t\t\t\t\t\t\t\tvariant='secondary'\n\t\t\t\t\t\t\t\ticonOnly={true}\n\t\t\t\t\t\t\t\ticon={\n\t\t\t\t\t\t\t\t\tthis.mode === 'read'\n\t\t\t\t\t\t\t\t\t\t? 'download'\n\t\t\t\t\t\t\t\t\t\t: this.value?.length\n\t\t\t\t\t\t\t\t\t\t? 'trash'\n\t\t\t\t\t\t\t\t\t\t: 'upload'\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\tdisabled={this.loading}\n\t\t\t\t\t\t\t\tloading={this.loading}\n\t\t\t\t\t\t\t\tonOnClick={() =>\n\t\t\t\t\t\t\t\t\tthis.mode === 'write' && !this.value?.length\n\t\t\t\t\t\t\t\t\t\t? this._uploadClick()\n\t\t\t\t\t\t\t\t\t\t: (this.mode === 'read'\n\t\t\t\t\t\t\t\t\t\t\t\t? this.download\n\t\t\t\t\t\t\t\t\t\t\t\t: this.delete\n\t\t\t\t\t\t\t\t\t\t ).emit()\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t</p-tooltip>\n\n\t\t\t\t\t\t{this.enableCameraOnMobile &&\n\t\t\t\t\t\t\tthis.mode === 'write' &&\n\t\t\t\t\t\t\tisMobileDevice &&\n\t\t\t\t\t\t\t!this.value?.length && (\n\t\t\t\t\t\t\t\t<p-tooltip\n\t\t\t\t\t\t\t\t\tcontent={this.cameraTooltip}\n\t\t\t\t\t\t\t\t\tclass='w-8 desktop-xs:hidden'\n\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t<p-button\n\t\t\t\t\t\t\t\t\t\tslot='trigger'\n\t\t\t\t\t\t\t\t\t\tvariant='secondary'\n\t\t\t\t\t\t\t\t\t\ticonOnly={true}\n\t\t\t\t\t\t\t\t\t\ticon='camera'\n\t\t\t\t\t\t\t\t\t\tonOnClick={() => this._cameraClick()}\n\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t</p-tooltip>\n\t\t\t\t\t\t\t)}\n\t\t\t\t\t</div>\n\t\t\t\t</p-field-container>\n\n\t\t\t\t<input\n\t\t\t\t\tclass='hidden'\n\t\t\t\t\ttype='file'\n\t\t\t\t\taccept={\n\t\t\t\t\t\tArray.isArray(this.accept) ? this.accept?.join(',') : this.accept\n\t\t\t\t\t}\n\t\t\t\t\tref={el => (this._fileRef = el)}\n\t\t\t\t\tonChange={ev => this._onFileChange(ev)}\n\t\t\t\t/>\n\n\t\t\t\t<input\n\t\t\t\t\tclass='hidden'\n\t\t\t\t\ttype='file'\n\t\t\t\t\taccept='image/*'\n\t\t\t\t\tcapture='true'\n\t\t\t\t\tref={el => (this._cameraFileRef = el)}\n\t\t\t\t\tonChange={ev => this._onFileChange(ev)}\n\t\t\t\t/>\n\t\t\t</Fragment>\n\t\t);\n\t}\n\n\tprivate _uploadClick() {\n\t\tif (!this._fileRef || this.mode !== 'write' || this.value?.length) {\n\t\t\treturn;\n\t\t}\n\n\t\tthis._fileRef.click();\n\t}\n\n\tprivate _cameraClick() {\n\t\tif (!this.enableCameraOnMobile || isMobile()) {\n\t\t\treturn;\n\t\t}\n\n\t\tif (!this._cameraFileRef || this.mode !== 'write') {\n\t\t\treturn;\n\t\t}\n\n\t\tthis._cameraFileRef?.click();\n\t}\n\n\tprivate _onFileChange(ev: Event) {\n\t\tconst target = ev.target as HTMLInputElement;\n\t\tconst file = target.files?.[0];\n\n\t\tif (file) {\n\t\t\tthis.loading = true;\n\n\t\t\tconst reader = new FileReader();\n\t\t\treader.onload = (e: any) => this._onLoad(file, e?.currentTarget?.result);\n\t\t\treader.readAsDataURL(file);\n\t\t}\n\t}\n\n\tprivate _onLoad(file: File, result: string) {\n\t\tthis.upload.emit({\n\t\t\tfileId: this.fileId,\n\t\t\tresult,\n\t\t\tfile,\n\t\t});\n\n\t\tif (this._fileRef) {\n\t\t\tthis._fileRef.value = '';\n\t\t}\n\n\t\tif (this._cameraFileRef) {\n\t\t\tthis._cameraFileRef.value = '';\n\t\t}\n\n\t\tthis.loading = false;\n\t}\n}\n"],"names":["cva","h","isTablet","Fragment","cn","isMobile"],"mappings":"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"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
.block{display:block!important}*{box-sizing:border-box}:host{display:block;width:100%}.static{position:static!important}.flex{display:flex!important}.hidden{display:none!important}.h-8{height:2rem!important}.w-8{width:2rem!important}.w-full{width:100%!important}.min-w-0{min-width:0!important}.flex-1{flex:1 1 0%!important}.cursor-pointer{cursor:pointer!important}.items-start{align-items:flex-start!important}.items-center{align-items:center!important}.justify-start{justify-content:flex-start!important}.gap-2{gap:.5rem!important}.overflow-hidden{overflow:hidden!important}.text-ellipsis{text-overflow:ellipsis!important}.whitespace-nowrap{white-space:nowrap!important}.rounded-lg{border-radius:.5rem!important}.border{border-width:1px!important}.border-solid{border-style:solid!important}.border-negative-red-500{--tw-border-opacity:1!important;border-color:rgb(230 30 30/var(--tw-border-opacity,1))!important}.border-storm-100{--tw-border-opacity:1!important;border-color:rgb(209 210 212/var(--tw-border-opacity,1))!important}.bg-white-600{--tw-bg-opacity:1!important;background-color:rgb(250 250 250/var(--tw-bg-opacity,1))!important}.px-2{padding-left:.5rem!important;padding-right:.5rem!important}.text-sm{font-size:.875rem!important;line-height:1.25rem!important}.text-negative-red-500{--tw-text-opacity:1!important;color:rgb(230 30 30/var(--tw-text-opacity,1))!important}.text-storm-200{--tw-text-opacity:1!important;color:rgb(163 165 169/var(--tw-text-opacity,1))!important}.text-storm-300{--tw-text-opacity:1!important;color:rgb(116 120 127/var(--tw-text-opacity,1))!important}.empty\:hidden:empty{display:none!important}.peer:empty~.peer-empty\:block{display:block!important}@media (min-width:64rem){.desktop-xs\:hidden{display:none!important}}
|
|
1
|
+
.block{display:block!important}*{box-sizing:border-box}:host{display:block;width:100%}.static{position:static!important}.flex{display:flex!important}.hidden{display:none!important}.h-8{height:2rem!important}.w-8{width:2rem!important}.w-full{width:100%!important}.min-w-0{min-width:0!important}.flex-1{flex:1 1 0%!important}.cursor-pointer{cursor:pointer!important}.items-start{align-items:flex-start!important}.items-center{align-items:center!important}.justify-start{justify-content:flex-start!important}.gap-2{gap:.5rem!important}.overflow-hidden{overflow:hidden!important}.text-ellipsis{text-overflow:ellipsis!important}.whitespace-nowrap{white-space:nowrap!important}.rounded-lg{border-radius:.5rem!important}.border{border-width:1px!important}.border-solid{border-style:solid!important}.border-negative-red-500{--tw-border-opacity:1!important;border-color:rgb(230 30 30/var(--tw-border-opacity,1))!important}.border-storm-100{--tw-border-opacity:1!important;border-color:rgb(209 210 212/var(--tw-border-opacity,1))!important}.bg-white-600{--tw-bg-opacity:1!important;background-color:rgb(250 250 250/var(--tw-bg-opacity,1))!important}.px-2{padding-left:.5rem!important;padding-right:.5rem!important}.text-sm{font-size:.875rem!important;line-height:1.25rem!important}.text-negative-red-500{--tw-text-opacity:1!important;color:rgb(230 30 30/var(--tw-text-opacity,1))!important}.text-storm-200{--tw-text-opacity:1!important;color:rgb(163 165 169/var(--tw-text-opacity,1))!important}.text-storm-300{--tw-text-opacity:1!important;color:rgb(116 120 127/var(--tw-text-opacity,1))!important}.empty\:hidden:empty{display:none!important}.peer:empty~.peer-empty\:block{display:block!important}@media (min-width:64rem){.desktop-xs\:hidden{display:none!important}}.dark\:border-negative-red-alternative:where(:host([data-theme=dark]),:host([data-theme=dark]) *){--tw-border-opacity:1!important;border-color:rgb(255 92 92/var(--tw-border-opacity,1))!important}.dark\:border-white\/15:where(:host([data-theme=dark]),:host([data-theme=dark]) *){border-color:hsla(0,0%,100%,.15)!important}.dark\:bg-white\/15:where(:host([data-theme=dark]),:host([data-theme=dark]) *){background-color:hsla(0,0%,100%,.15)!important}.dark\:text-hurricane-200:where(:host([data-theme=dark]),:host([data-theme=dark]) *){--tw-text-opacity:1!important;color:rgb(163 165 169/var(--tw-text-opacity,1))!important}.dark\:border-negative-red-alternative:where([data-theme=dark],[data-theme=dark] *){--tw-border-opacity:1!important;border-color:rgb(255 92 92/var(--tw-border-opacity,1))!important}.dark\:border-white\/15:where([data-theme=dark],[data-theme=dark] *){border-color:hsla(0,0%,100%,.15)!important}.dark\:bg-white\/15:where([data-theme=dark],[data-theme=dark] *){background-color:hsla(0,0%,100%,.15)!important}.dark\:text-hurricane-200:where([data-theme=dark],[data-theme=dark] *){--tw-text-opacity:1!important;color:rgb(163 165 169/var(--tw-text-opacity,1))!important}
|
|
@@ -4,7 +4,9 @@ import { cva } from "class-variance-authority";
|
|
|
4
4
|
const attachment = cva([
|
|
5
5
|
'flex flex-1 items-center justify-start gap-2',
|
|
6
6
|
'h-8 min-w-0 px-2 rounded-lg',
|
|
7
|
-
'border border-solid
|
|
7
|
+
'border border-solid',
|
|
8
|
+
'bg-white-600 text-storm-200',
|
|
9
|
+
'dark:bg-white/15 dark:text-hurricane-200',
|
|
8
10
|
], {
|
|
9
11
|
variants: {
|
|
10
12
|
click: {
|
|
@@ -12,8 +14,8 @@ const attachment = cva([
|
|
|
12
14
|
true: 'cursor-pointer',
|
|
13
15
|
},
|
|
14
16
|
error: {
|
|
15
|
-
false: '
|
|
16
|
-
true: 'border-negative-red-500',
|
|
17
|
+
false: 'border-storm-100 dark:border-white/15',
|
|
18
|
+
true: 'border-negative-red-500 dark:border-negative-red-alternative',
|
|
17
19
|
},
|
|
18
20
|
},
|
|
19
21
|
});
|
|
@@ -93,21 +95,21 @@ export class Attachment {
|
|
|
93
95
|
_fileRef;
|
|
94
96
|
_cameraFileRef;
|
|
95
97
|
render() {
|
|
96
|
-
let prefix = (h("p-icon", { key: '
|
|
98
|
+
let prefix = (h("p-icon", { key: 'e3041d87911b3ef89be9ae6dd57d9ad51b4b6ba3', class: 'text-storm-300', variant: 'attachment' }));
|
|
97
99
|
if (this.error) {
|
|
98
|
-
prefix = (h("p-icon", { key: '
|
|
100
|
+
prefix = (h("p-icon", { key: '8cd0ea7fd1848a8f9d3ee96d42b4ecdb5f4ed27b', variant: 'warning', class: 'text-negative-red-500' }));
|
|
99
101
|
}
|
|
100
102
|
// const isMobileDevice = isMobile();
|
|
101
103
|
const isMobileDevice = isTablet();
|
|
102
104
|
const baseText = 'min-w-0 flex-1 overflow-hidden text-ellipsis whitespace-nowrap text-sm';
|
|
103
|
-
return (h(Fragment, { key: '
|
|
105
|
+
return (h(Fragment, { key: '0e75af5dc601f3cb7b24c197c532685154958e06' }, h("p-field-container", { key: '0bf08bb7ce1380635a9fc8b574ec86946e085ffe', variant: 'write', label: this.label, helper: this.helper, error: this.error, required: this.required, forceShowTooltip: !!this.error?.length }, h("div", { key: '5e5d80909c96afb1aabc9509888979fa662eaaff', slot: 'content', class: 'flex w-full items-start gap-2' }, h("div", { key: 'afee7e83fe90d843de8bf509ed3d7d451483795f', class: attachment({
|
|
104
106
|
click: this.mode === 'write' && !this.value?.length,
|
|
105
107
|
error: !!this.error?.length,
|
|
106
|
-
}), onClick: () => this._uploadClick() }, prefix, h("span", { key: '
|
|
108
|
+
}), onClick: () => this._uploadClick() }, prefix, h("span", { key: 'c59a8e66fde71d2b8423cb5f6385ebb1ee6f51d6', class: cn(baseText, 'peer empty:hidden') }, this.value), h("span", { key: 'b133def98ae61ff290371aa76918c38d209098bd', class: cn(baseText, 'hidden peer-empty:block') }, this.placeholder)), h("p-tooltip", { key: '70dd1bf027ba620e5653e0f6fecd2d2e9f8d5047', class: 'w-8', content: this.mode === 'read'
|
|
107
109
|
? this.downloadTooltip
|
|
108
110
|
: this.value?.length
|
|
109
111
|
? this.deleteTooltip
|
|
110
|
-
: this.uploadTooltip }, h("p-button", { key: '
|
|
112
|
+
: this.uploadTooltip }, h("p-button", { key: 'bad75a34fff38946e6361c2b1e467e7fc1331cdf', slot: 'trigger', variant: 'secondary', iconOnly: true, icon: this.mode === 'read'
|
|
111
113
|
? 'download'
|
|
112
114
|
: this.value?.length
|
|
113
115
|
? 'trash'
|
|
@@ -118,7 +120,7 @@ export class Attachment {
|
|
|
118
120
|
: this.delete).emit() })), this.enableCameraOnMobile &&
|
|
119
121
|
this.mode === 'write' &&
|
|
120
122
|
isMobileDevice &&
|
|
121
|
-
!this.value?.length && (h("p-tooltip", { key: '
|
|
123
|
+
!this.value?.length && (h("p-tooltip", { key: 'efdfd38ae5ca2f9e63af50d3a82339cbd0af6ef9', content: this.cameraTooltip, class: 'w-8 desktop-xs:hidden' }, h("p-button", { key: '38a9dc23149a96fd7626236b9f1b1b8794bc0c84', slot: 'trigger', variant: 'secondary', iconOnly: true, icon: 'camera', onOnClick: () => this._cameraClick() }))))), h("input", { key: 'a4e9ec4655dcdd0778a6e84638ef8fb6011ce4a8', class: 'hidden', type: 'file', accept: Array.isArray(this.accept) ? this.accept?.join(',') : this.accept, ref: el => (this._fileRef = el), onChange: ev => this._onFileChange(ev) }), h("input", { key: '3f5212b6d4602d39075254405b8177672a97acb7', class: 'hidden', type: 'file', accept: 'image/*', capture: 'true', ref: el => (this._cameraFileRef = el), onChange: ev => this._onFileChange(ev) })));
|
|
122
124
|
}
|
|
123
125
|
_uploadClick() {
|
|
124
126
|
if (!this._fileRef || this.mode !== 'write' || this.value?.length) {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"attachment.component.js","sourceRoot":"","sources":["../../../../src/components/molecules/attachment/attachment.component.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n\tComponent,\n\tEvent,\n\tEventEmitter,\n\tFragment,\n\th,\n\tProp,\n} from '@stencil/core';\nimport { cn, isMobile, isTablet } from '../../../utils';\nimport { cva } from 'class-variance-authority';\n\nconst attachment = cva(\n\t[\n\t\t'flex flex-1 items-center justify-start gap-2',\n\t\t'h-8 min-w-0 px-2 rounded-lg',\n\t\t'border border-solid bg-white-600',\n\t],\n\t{\n\t\tvariants: {\n\t\t\tclick: {\n\t\t\t\tfalse: null,\n\t\t\t\ttrue: 'cursor-pointer',\n\t\t\t},\n\t\t\terror: {\n\t\t\t\tfalse: 'bg-white-600 border-storm-100 text-storm-200',\n\t\t\t\ttrue: 'border-negative-red-500',\n\t\t\t},\n\t\t},\n\t}\n);\n\n@Component({\n\ttag: 'p-attachment',\n\tstyleUrl: 'attachment.component.css',\n\tshadow: true,\n})\nexport class Attachment {\n\t/**\n\t * Wether to enable the camera button on mobile\n\t */\n\t@Prop() enableCameraOnMobile = false;\n\n\t/**\n\t * The value of the attachment (usually the file name)\n\t */\n\t@Prop() value: string;\n\n\t/**\n\t * The fileID to use to track the file\n\t */\n\t@Prop() fileId: string;\n\n\t/**\n\t * The type of files to accept\n\t */\n\t@Prop() accept: string[] | string = null;\n\n\t/**\n\t * The label of the attachment\n\t */\n\t@Prop() label: string | HTMLSlotElement;\n\n\t/**\n\t * The helper of the attachment\n\t */\n\t@Prop() helper: string | HTMLSlotElement;\n\n\t/**\n\t * Wether the attachment is required\n\t */\n\t@Prop({ reflect: true }) required = true;\n\n\t/**\n\t * The variant of the attachment\n\t */\n\t@Prop() mode: 'read' | 'write' = 'read';\n\n\t/**\n\t * The placeholder of the attachment\n\t */\n\t@Prop() placeholder: string = 'Upload a file...';\n\n\t/**\n\t * The text for the camera tooltip\n\t */\n\t@Prop() cameraTooltip: string = 'Camera';\n\n\t/**\n\t * The text for the download tooltip\n\t */\n\t@Prop() downloadTooltip: string = 'Download';\n\n\t/**\n\t * The text for the upload tooltip\n\t */\n\t@Prop() uploadTooltip: string = 'Upload';\n\n\t/**\n\t * The text for the delete tooltip\n\t */\n\t@Prop() deleteTooltip: string = 'Delete';\n\n\t/**\n\t * Wether the attachment is loading\n\t */\n\t@Prop() loading = false;\n\n\t/**\n\t * The error to show\n\t */\n\t@Prop() error: string;\n\n\t/**\n\t * Event when upload is pressed\n\t */\n\t@Event({\n\t\tbubbles: false,\n\t})\n\tupload: EventEmitter<{\n\t\tfile: File;\n\t\tfileId: string;\n\t\tresult: string;\n\t}>;\n\n\t/**\n\t * Event when download is pressed\n\t */\n\t@Event({\n\t\tbubbles: false,\n\t})\n\tdownload: EventEmitter<void>;\n\n\t/**\n\t * Event when delete is pressed\n\t */\n\t@Event({\n\t\tbubbles: false,\n\t})\n\tdelete: EventEmitter<void>;\n\n\tprivate _fileRef: HTMLInputElement;\n\tprivate _cameraFileRef: HTMLInputElement;\n\n\trender() {\n\t\tlet prefix = (\n\t\t\t<p-icon\n\t\t\t\tclass='text-storm-300'\n\t\t\t\tvariant='attachment'\n\t\t\t/>\n\t\t);\n\n\t\tif (this.error) {\n\t\t\tprefix = (\n\t\t\t\t<p-icon\n\t\t\t\t\tvariant='warning'\n\t\t\t\t\tclass='text-negative-red-500'\n\t\t\t\t/>\n\t\t\t);\n\t\t}\n\n\t\t// const isMobileDevice = isMobile();\n\t\tconst isMobileDevice = isTablet();\n\n\t\tconst baseText =\n\t\t\t'min-w-0 flex-1 overflow-hidden text-ellipsis whitespace-nowrap text-sm';\n\t\treturn (\n\t\t\t<Fragment>\n\t\t\t\t<p-field-container\n\t\t\t\t\tvariant='write'\n\t\t\t\t\tlabel={this.label}\n\t\t\t\t\thelper={this.helper}\n\t\t\t\t\terror={this.error}\n\t\t\t\t\trequired={this.required}\n\t\t\t\t\tforceShowTooltip={!!this.error?.length}\n\t\t\t\t>\n\t\t\t\t\t<div\n\t\t\t\t\t\tslot='content'\n\t\t\t\t\t\tclass='flex w-full items-start gap-2'\n\t\t\t\t\t>\n\t\t\t\t\t\t<div\n\t\t\t\t\t\t\tclass={attachment({\n\t\t\t\t\t\t\t\tclick: this.mode === 'write' && !this.value?.length,\n\t\t\t\t\t\t\t\terror: !!this.error?.length,\n\t\t\t\t\t\t\t})}\n\t\t\t\t\t\t\tonClick={() => this._uploadClick()}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{prefix}\n\n\t\t\t\t\t\t\t<span class={cn(baseText, 'peer empty:hidden')}>\n\t\t\t\t\t\t\t\t{this.value}\n\t\t\t\t\t\t\t</span>\n\t\t\t\t\t\t\t<span class={cn(baseText, 'hidden peer-empty:block')}>\n\t\t\t\t\t\t\t\t{this.placeholder}\n\t\t\t\t\t\t\t</span>\n\t\t\t\t\t\t</div>\n\n\t\t\t\t\t\t<p-tooltip\n\t\t\t\t\t\t\tclass='w-8'\n\t\t\t\t\t\t\tcontent={\n\t\t\t\t\t\t\t\tthis.mode === 'read'\n\t\t\t\t\t\t\t\t\t? this.downloadTooltip\n\t\t\t\t\t\t\t\t\t: this.value?.length\n\t\t\t\t\t\t\t\t\t? this.deleteTooltip\n\t\t\t\t\t\t\t\t\t: this.uploadTooltip\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<p-button\n\t\t\t\t\t\t\t\tslot='trigger'\n\t\t\t\t\t\t\t\tvariant='secondary'\n\t\t\t\t\t\t\t\ticonOnly={true}\n\t\t\t\t\t\t\t\ticon={\n\t\t\t\t\t\t\t\t\tthis.mode === 'read'\n\t\t\t\t\t\t\t\t\t\t? 'download'\n\t\t\t\t\t\t\t\t\t\t: this.value?.length\n\t\t\t\t\t\t\t\t\t\t? 'trash'\n\t\t\t\t\t\t\t\t\t\t: 'upload'\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\tdisabled={this.loading}\n\t\t\t\t\t\t\t\tloading={this.loading}\n\t\t\t\t\t\t\t\tonOnClick={() =>\n\t\t\t\t\t\t\t\t\tthis.mode === 'write' && !this.value?.length\n\t\t\t\t\t\t\t\t\t\t? this._uploadClick()\n\t\t\t\t\t\t\t\t\t\t: (this.mode === 'read'\n\t\t\t\t\t\t\t\t\t\t\t\t? this.download\n\t\t\t\t\t\t\t\t\t\t\t\t: this.delete\n\t\t\t\t\t\t\t\t\t\t ).emit()\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t</p-tooltip>\n\n\t\t\t\t\t\t{this.enableCameraOnMobile &&\n\t\t\t\t\t\t\tthis.mode === 'write' &&\n\t\t\t\t\t\t\tisMobileDevice &&\n\t\t\t\t\t\t\t!this.value?.length && (\n\t\t\t\t\t\t\t\t<p-tooltip\n\t\t\t\t\t\t\t\t\tcontent={this.cameraTooltip}\n\t\t\t\t\t\t\t\t\tclass='w-8 desktop-xs:hidden'\n\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t<p-button\n\t\t\t\t\t\t\t\t\t\tslot='trigger'\n\t\t\t\t\t\t\t\t\t\tvariant='secondary'\n\t\t\t\t\t\t\t\t\t\ticonOnly={true}\n\t\t\t\t\t\t\t\t\t\ticon='camera'\n\t\t\t\t\t\t\t\t\t\tonOnClick={() => this._cameraClick()}\n\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t</p-tooltip>\n\t\t\t\t\t\t\t)}\n\t\t\t\t\t</div>\n\t\t\t\t</p-field-container>\n\n\t\t\t\t<input\n\t\t\t\t\tclass='hidden'\n\t\t\t\t\ttype='file'\n\t\t\t\t\taccept={\n\t\t\t\t\t\tArray.isArray(this.accept) ? this.accept?.join(',') : this.accept\n\t\t\t\t\t}\n\t\t\t\t\tref={el => (this._fileRef = el)}\n\t\t\t\t\tonChange={ev => this._onFileChange(ev)}\n\t\t\t\t/>\n\n\t\t\t\t<input\n\t\t\t\t\tclass='hidden'\n\t\t\t\t\ttype='file'\n\t\t\t\t\taccept='image/*'\n\t\t\t\t\tcapture='true'\n\t\t\t\t\tref={el => (this._cameraFileRef = el)}\n\t\t\t\t\tonChange={ev => this._onFileChange(ev)}\n\t\t\t\t/>\n\t\t\t</Fragment>\n\t\t);\n\t}\n\n\tprivate _uploadClick() {\n\t\tif (!this._fileRef || this.mode !== 'write' || this.value?.length) {\n\t\t\treturn;\n\t\t}\n\n\t\tthis._fileRef.click();\n\t}\n\n\tprivate _cameraClick() {\n\t\tif (!this.enableCameraOnMobile || isMobile()) {\n\t\t\treturn;\n\t\t}\n\n\t\tif (!this._cameraFileRef || this.mode !== 'write') {\n\t\t\treturn;\n\t\t}\n\n\t\tthis._cameraFileRef?.click();\n\t}\n\n\tprivate _onFileChange(ev: Event) {\n\t\tconst target = ev.target as HTMLInputElement;\n\t\tconst file = target.files?.[0];\n\n\t\tif (file) {\n\t\t\tthis.loading = true;\n\n\t\t\tconst reader = new FileReader();\n\t\t\treader.onload = (e: any) => this._onLoad(file, e?.currentTarget?.result);\n\t\t\treader.readAsDataURL(file);\n\t\t}\n\t}\n\n\tprivate _onLoad(file: File, result: string) {\n\t\tthis.upload.emit({\n\t\t\tfileId: this.fileId,\n\t\t\tresult,\n\t\t\tfile,\n\t\t});\n\n\t\tif (this._fileRef) {\n\t\t\tthis._fileRef.value = '';\n\t\t}\n\n\t\tif (this._cameraFileRef) {\n\t\t\tthis._cameraFileRef.value = '';\n\t\t}\n\n\t\tthis.loading = false;\n\t}\n}\n"]}
|
|
1
|
+
{"version":3,"file":"attachment.component.js","sourceRoot":"","sources":["../../../../src/components/molecules/attachment/attachment.component.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n\tComponent,\n\tEvent,\n\tEventEmitter,\n\tFragment,\n\th,\n\tProp,\n} from '@stencil/core';\nimport { cn, isMobile, isTablet } from '../../../utils';\nimport { cva } from 'class-variance-authority';\n\nconst attachment = cva(\n\t[\n\t\t'flex flex-1 items-center justify-start gap-2',\n\t\t'h-8 min-w-0 px-2 rounded-lg',\n\t\t'border border-solid',\n\t\t'bg-white-600 text-storm-200',\n\t\t'dark:bg-white/15 dark:text-hurricane-200',\n\t],\n\t{\n\t\tvariants: {\n\t\t\tclick: {\n\t\t\t\tfalse: null,\n\t\t\t\ttrue: 'cursor-pointer',\n\t\t\t},\n\t\t\terror: {\n\t\t\t\tfalse: 'border-storm-100 dark:border-white/15',\n\t\t\t\ttrue: 'border-negative-red-500 dark:border-negative-red-alternative',\n\t\t\t},\n\t\t},\n\t}\n);\n\n@Component({\n\ttag: 'p-attachment',\n\tstyleUrl: 'attachment.component.css',\n\tshadow: true,\n})\nexport class Attachment {\n\t/**\n\t * Wether to enable the camera button on mobile\n\t */\n\t@Prop() enableCameraOnMobile = false;\n\n\t/**\n\t * The value of the attachment (usually the file name)\n\t */\n\t@Prop() value: string;\n\n\t/**\n\t * The fileID to use to track the file\n\t */\n\t@Prop() fileId: string;\n\n\t/**\n\t * The type of files to accept\n\t */\n\t@Prop() accept: string[] | string = null;\n\n\t/**\n\t * The label of the attachment\n\t */\n\t@Prop() label: string | HTMLSlotElement;\n\n\t/**\n\t * The helper of the attachment\n\t */\n\t@Prop() helper: string | HTMLSlotElement;\n\n\t/**\n\t * Wether the attachment is required\n\t */\n\t@Prop({ reflect: true }) required = true;\n\n\t/**\n\t * The variant of the attachment\n\t */\n\t@Prop() mode: 'read' | 'write' = 'read';\n\n\t/**\n\t * The placeholder of the attachment\n\t */\n\t@Prop() placeholder: string = 'Upload a file...';\n\n\t/**\n\t * The text for the camera tooltip\n\t */\n\t@Prop() cameraTooltip: string = 'Camera';\n\n\t/**\n\t * The text for the download tooltip\n\t */\n\t@Prop() downloadTooltip: string = 'Download';\n\n\t/**\n\t * The text for the upload tooltip\n\t */\n\t@Prop() uploadTooltip: string = 'Upload';\n\n\t/**\n\t * The text for the delete tooltip\n\t */\n\t@Prop() deleteTooltip: string = 'Delete';\n\n\t/**\n\t * Wether the attachment is loading\n\t */\n\t@Prop() loading = false;\n\n\t/**\n\t * The error to show\n\t */\n\t@Prop() error: string;\n\n\t/**\n\t * Event when upload is pressed\n\t */\n\t@Event({\n\t\tbubbles: false,\n\t})\n\tupload: EventEmitter<{\n\t\tfile: File;\n\t\tfileId: string;\n\t\tresult: string;\n\t}>;\n\n\t/**\n\t * Event when download is pressed\n\t */\n\t@Event({\n\t\tbubbles: false,\n\t})\n\tdownload: EventEmitter<void>;\n\n\t/**\n\t * Event when delete is pressed\n\t */\n\t@Event({\n\t\tbubbles: false,\n\t})\n\tdelete: EventEmitter<void>;\n\n\tprivate _fileRef: HTMLInputElement;\n\tprivate _cameraFileRef: HTMLInputElement;\n\n\trender() {\n\t\tlet prefix = (\n\t\t\t<p-icon\n\t\t\t\tclass='text-storm-300'\n\t\t\t\tvariant='attachment'\n\t\t\t/>\n\t\t);\n\n\t\tif (this.error) {\n\t\t\tprefix = (\n\t\t\t\t<p-icon\n\t\t\t\t\tvariant='warning'\n\t\t\t\t\tclass='text-negative-red-500'\n\t\t\t\t/>\n\t\t\t);\n\t\t}\n\n\t\t// const isMobileDevice = isMobile();\n\t\tconst isMobileDevice = isTablet();\n\n\t\tconst baseText =\n\t\t\t'min-w-0 flex-1 overflow-hidden text-ellipsis whitespace-nowrap text-sm';\n\t\treturn (\n\t\t\t<Fragment>\n\t\t\t\t<p-field-container\n\t\t\t\t\tvariant='write'\n\t\t\t\t\tlabel={this.label}\n\t\t\t\t\thelper={this.helper}\n\t\t\t\t\terror={this.error}\n\t\t\t\t\trequired={this.required}\n\t\t\t\t\tforceShowTooltip={!!this.error?.length}\n\t\t\t\t>\n\t\t\t\t\t<div\n\t\t\t\t\t\tslot='content'\n\t\t\t\t\t\tclass='flex w-full items-start gap-2'\n\t\t\t\t\t>\n\t\t\t\t\t\t<div\n\t\t\t\t\t\t\tclass={attachment({\n\t\t\t\t\t\t\t\tclick: this.mode === 'write' && !this.value?.length,\n\t\t\t\t\t\t\t\terror: !!this.error?.length,\n\t\t\t\t\t\t\t})}\n\t\t\t\t\t\t\tonClick={() => this._uploadClick()}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{prefix}\n\n\t\t\t\t\t\t\t<span class={cn(baseText, 'peer empty:hidden')}>\n\t\t\t\t\t\t\t\t{this.value}\n\t\t\t\t\t\t\t</span>\n\t\t\t\t\t\t\t<span class={cn(baseText, 'hidden peer-empty:block')}>\n\t\t\t\t\t\t\t\t{this.placeholder}\n\t\t\t\t\t\t\t</span>\n\t\t\t\t\t\t</div>\n\n\t\t\t\t\t\t<p-tooltip\n\t\t\t\t\t\t\tclass='w-8'\n\t\t\t\t\t\t\tcontent={\n\t\t\t\t\t\t\t\tthis.mode === 'read'\n\t\t\t\t\t\t\t\t\t? this.downloadTooltip\n\t\t\t\t\t\t\t\t\t: this.value?.length\n\t\t\t\t\t\t\t\t\t? this.deleteTooltip\n\t\t\t\t\t\t\t\t\t: this.uploadTooltip\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<p-button\n\t\t\t\t\t\t\t\tslot='trigger'\n\t\t\t\t\t\t\t\tvariant='secondary'\n\t\t\t\t\t\t\t\ticonOnly={true}\n\t\t\t\t\t\t\t\ticon={\n\t\t\t\t\t\t\t\t\tthis.mode === 'read'\n\t\t\t\t\t\t\t\t\t\t? 'download'\n\t\t\t\t\t\t\t\t\t\t: this.value?.length\n\t\t\t\t\t\t\t\t\t\t? 'trash'\n\t\t\t\t\t\t\t\t\t\t: 'upload'\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\tdisabled={this.loading}\n\t\t\t\t\t\t\t\tloading={this.loading}\n\t\t\t\t\t\t\t\tonOnClick={() =>\n\t\t\t\t\t\t\t\t\tthis.mode === 'write' && !this.value?.length\n\t\t\t\t\t\t\t\t\t\t? this._uploadClick()\n\t\t\t\t\t\t\t\t\t\t: (this.mode === 'read'\n\t\t\t\t\t\t\t\t\t\t\t\t? this.download\n\t\t\t\t\t\t\t\t\t\t\t\t: this.delete\n\t\t\t\t\t\t\t\t\t\t ).emit()\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t</p-tooltip>\n\n\t\t\t\t\t\t{this.enableCameraOnMobile &&\n\t\t\t\t\t\t\tthis.mode === 'write' &&\n\t\t\t\t\t\t\tisMobileDevice &&\n\t\t\t\t\t\t\t!this.value?.length && (\n\t\t\t\t\t\t\t\t<p-tooltip\n\t\t\t\t\t\t\t\t\tcontent={this.cameraTooltip}\n\t\t\t\t\t\t\t\t\tclass='w-8 desktop-xs:hidden'\n\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t<p-button\n\t\t\t\t\t\t\t\t\t\tslot='trigger'\n\t\t\t\t\t\t\t\t\t\tvariant='secondary'\n\t\t\t\t\t\t\t\t\t\ticonOnly={true}\n\t\t\t\t\t\t\t\t\t\ticon='camera'\n\t\t\t\t\t\t\t\t\t\tonOnClick={() => this._cameraClick()}\n\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t</p-tooltip>\n\t\t\t\t\t\t\t)}\n\t\t\t\t\t</div>\n\t\t\t\t</p-field-container>\n\n\t\t\t\t<input\n\t\t\t\t\tclass='hidden'\n\t\t\t\t\ttype='file'\n\t\t\t\t\taccept={\n\t\t\t\t\t\tArray.isArray(this.accept) ? this.accept?.join(',') : this.accept\n\t\t\t\t\t}\n\t\t\t\t\tref={el => (this._fileRef = el)}\n\t\t\t\t\tonChange={ev => this._onFileChange(ev)}\n\t\t\t\t/>\n\n\t\t\t\t<input\n\t\t\t\t\tclass='hidden'\n\t\t\t\t\ttype='file'\n\t\t\t\t\taccept='image/*'\n\t\t\t\t\tcapture='true'\n\t\t\t\t\tref={el => (this._cameraFileRef = el)}\n\t\t\t\t\tonChange={ev => this._onFileChange(ev)}\n\t\t\t\t/>\n\t\t\t</Fragment>\n\t\t);\n\t}\n\n\tprivate _uploadClick() {\n\t\tif (!this._fileRef || this.mode !== 'write' || this.value?.length) {\n\t\t\treturn;\n\t\t}\n\n\t\tthis._fileRef.click();\n\t}\n\n\tprivate _cameraClick() {\n\t\tif (!this.enableCameraOnMobile || isMobile()) {\n\t\t\treturn;\n\t\t}\n\n\t\tif (!this._cameraFileRef || this.mode !== 'write') {\n\t\t\treturn;\n\t\t}\n\n\t\tthis._cameraFileRef?.click();\n\t}\n\n\tprivate _onFileChange(ev: Event) {\n\t\tconst target = ev.target as HTMLInputElement;\n\t\tconst file = target.files?.[0];\n\n\t\tif (file) {\n\t\t\tthis.loading = true;\n\n\t\t\tconst reader = new FileReader();\n\t\t\treader.onload = (e: any) => this._onLoad(file, e?.currentTarget?.result);\n\t\t\treader.readAsDataURL(file);\n\t\t}\n\t}\n\n\tprivate _onLoad(file: File, result: string) {\n\t\tthis.upload.emit({\n\t\t\tfileId: this.fileId,\n\t\t\tresult,\n\t\t\tfile,\n\t\t});\n\n\t\tif (this._fileRef) {\n\t\t\tthis._fileRef.value = '';\n\t\t}\n\n\t\tif (this._cameraFileRef) {\n\t\t\tthis._cameraFileRef.value = '';\n\t\t}\n\n\t\tthis.loading = false;\n\t}\n}\n"]}
|
|
@@ -9,12 +9,14 @@ import { d as defineCustomElement$4 } from './p-CYTBI5t8.js';
|
|
|
9
9
|
import { d as defineCustomElement$3 } from './p-BFbLqg3-.js';
|
|
10
10
|
import { d as defineCustomElement$2 } from './p-BUzthIe4.js';
|
|
11
11
|
|
|
12
|
-
const attachmentComponentCss = ".block{display:block!important}*{box-sizing:border-box}:host{display:block;width:100%}.static{position:static!important}.flex{display:flex!important}.hidden{display:none!important}.h-8{height:2rem!important}.w-8{width:2rem!important}.w-full{width:100%!important}.min-w-0{min-width:0!important}.flex-1{flex:1 1 0%!important}.cursor-pointer{cursor:pointer!important}.items-start{align-items:flex-start!important}.items-center{align-items:center!important}.justify-start{justify-content:flex-start!important}.gap-2{gap:.5rem!important}.overflow-hidden{overflow:hidden!important}.text-ellipsis{text-overflow:ellipsis!important}.whitespace-nowrap{white-space:nowrap!important}.rounded-lg{border-radius:.5rem!important}.border{border-width:1px!important}.border-solid{border-style:solid!important}.border-negative-red-500{--tw-border-opacity:1!important;border-color:rgb(230 30 30/var(--tw-border-opacity,1))!important}.border-storm-100{--tw-border-opacity:1!important;border-color:rgb(209 210 212/var(--tw-border-opacity,1))!important}.bg-white-600{--tw-bg-opacity:1!important;background-color:rgb(250 250 250/var(--tw-bg-opacity,1))!important}.px-2{padding-left:.5rem!important;padding-right:.5rem!important}.text-sm{font-size:.875rem!important;line-height:1.25rem!important}.text-negative-red-500{--tw-text-opacity:1!important;color:rgb(230 30 30/var(--tw-text-opacity,1))!important}.text-storm-200{--tw-text-opacity:1!important;color:rgb(163 165 169/var(--tw-text-opacity,1))!important}.text-storm-300{--tw-text-opacity:1!important;color:rgb(116 120 127/var(--tw-text-opacity,1))!important}.empty\\:hidden:empty{display:none!important}.peer:empty~.peer-empty\\:block{display:block!important}@media (min-width:64rem){.desktop-xs\\:hidden{display:none!important}}";
|
|
12
|
+
const attachmentComponentCss = ".block{display:block!important}*{box-sizing:border-box}:host{display:block;width:100%}.static{position:static!important}.flex{display:flex!important}.hidden{display:none!important}.h-8{height:2rem!important}.w-8{width:2rem!important}.w-full{width:100%!important}.min-w-0{min-width:0!important}.flex-1{flex:1 1 0%!important}.cursor-pointer{cursor:pointer!important}.items-start{align-items:flex-start!important}.items-center{align-items:center!important}.justify-start{justify-content:flex-start!important}.gap-2{gap:.5rem!important}.overflow-hidden{overflow:hidden!important}.text-ellipsis{text-overflow:ellipsis!important}.whitespace-nowrap{white-space:nowrap!important}.rounded-lg{border-radius:.5rem!important}.border{border-width:1px!important}.border-solid{border-style:solid!important}.border-negative-red-500{--tw-border-opacity:1!important;border-color:rgb(230 30 30/var(--tw-border-opacity,1))!important}.border-storm-100{--tw-border-opacity:1!important;border-color:rgb(209 210 212/var(--tw-border-opacity,1))!important}.bg-white-600{--tw-bg-opacity:1!important;background-color:rgb(250 250 250/var(--tw-bg-opacity,1))!important}.px-2{padding-left:.5rem!important;padding-right:.5rem!important}.text-sm{font-size:.875rem!important;line-height:1.25rem!important}.text-negative-red-500{--tw-text-opacity:1!important;color:rgb(230 30 30/var(--tw-text-opacity,1))!important}.text-storm-200{--tw-text-opacity:1!important;color:rgb(163 165 169/var(--tw-text-opacity,1))!important}.text-storm-300{--tw-text-opacity:1!important;color:rgb(116 120 127/var(--tw-text-opacity,1))!important}.empty\\:hidden:empty{display:none!important}.peer:empty~.peer-empty\\:block{display:block!important}@media (min-width:64rem){.desktop-xs\\:hidden{display:none!important}}.dark\\:border-negative-red-alternative:where(:host([data-theme=dark]),:host([data-theme=dark]) *){--tw-border-opacity:1!important;border-color:rgb(255 92 92/var(--tw-border-opacity,1))!important}.dark\\:border-white\\/15:where(:host([data-theme=dark]),:host([data-theme=dark]) *){border-color:hsla(0,0%,100%,.15)!important}.dark\\:bg-white\\/15:where(:host([data-theme=dark]),:host([data-theme=dark]) *){background-color:hsla(0,0%,100%,.15)!important}.dark\\:text-hurricane-200:where(:host([data-theme=dark]),:host([data-theme=dark]) *){--tw-text-opacity:1!important;color:rgb(163 165 169/var(--tw-text-opacity,1))!important}.dark\\:border-negative-red-alternative:where([data-theme=dark],[data-theme=dark] *){--tw-border-opacity:1!important;border-color:rgb(255 92 92/var(--tw-border-opacity,1))!important}.dark\\:border-white\\/15:where([data-theme=dark],[data-theme=dark] *){border-color:hsla(0,0%,100%,.15)!important}.dark\\:bg-white\\/15:where([data-theme=dark],[data-theme=dark] *){background-color:hsla(0,0%,100%,.15)!important}.dark\\:text-hurricane-200:where([data-theme=dark],[data-theme=dark] *){--tw-text-opacity:1!important;color:rgb(163 165 169/var(--tw-text-opacity,1))!important}";
|
|
13
13
|
|
|
14
14
|
const attachment = cva([
|
|
15
15
|
'flex flex-1 items-center justify-start gap-2',
|
|
16
16
|
'h-8 min-w-0 px-2 rounded-lg',
|
|
17
|
-
'border border-solid
|
|
17
|
+
'border border-solid',
|
|
18
|
+
'bg-white-600 text-storm-200',
|
|
19
|
+
'dark:bg-white/15 dark:text-hurricane-200',
|
|
18
20
|
], {
|
|
19
21
|
variants: {
|
|
20
22
|
click: {
|
|
@@ -22,8 +24,8 @@ const attachment = cva([
|
|
|
22
24
|
true: 'cursor-pointer',
|
|
23
25
|
},
|
|
24
26
|
error: {
|
|
25
|
-
false: '
|
|
26
|
-
true: 'border-negative-red-500',
|
|
27
|
+
false: 'border-storm-100 dark:border-white/15',
|
|
28
|
+
true: 'border-negative-red-500 dark:border-negative-red-alternative',
|
|
27
29
|
},
|
|
28
30
|
},
|
|
29
31
|
});
|
|
@@ -111,21 +113,21 @@ const Attachment = /*@__PURE__*/ proxyCustomElement(class Attachment extends H {
|
|
|
111
113
|
_fileRef;
|
|
112
114
|
_cameraFileRef;
|
|
113
115
|
render() {
|
|
114
|
-
let prefix = (h("p-icon", { key: '
|
|
116
|
+
let prefix = (h("p-icon", { key: 'e3041d87911b3ef89be9ae6dd57d9ad51b4b6ba3', class: 'text-storm-300', variant: 'attachment' }));
|
|
115
117
|
if (this.error) {
|
|
116
|
-
prefix = (h("p-icon", { key: '
|
|
118
|
+
prefix = (h("p-icon", { key: '8cd0ea7fd1848a8f9d3ee96d42b4ecdb5f4ed27b', variant: 'warning', class: 'text-negative-red-500' }));
|
|
117
119
|
}
|
|
118
120
|
// const isMobileDevice = isMobile();
|
|
119
121
|
const isMobileDevice = isTablet();
|
|
120
122
|
const baseText = 'min-w-0 flex-1 overflow-hidden text-ellipsis whitespace-nowrap text-sm';
|
|
121
|
-
return (h(Fragment, { key: '
|
|
123
|
+
return (h(Fragment, { key: '0e75af5dc601f3cb7b24c197c532685154958e06' }, h("p-field-container", { key: '0bf08bb7ce1380635a9fc8b574ec86946e085ffe', variant: 'write', label: this.label, helper: this.helper, error: this.error, required: this.required, forceShowTooltip: !!this.error?.length }, h("div", { key: '5e5d80909c96afb1aabc9509888979fa662eaaff', slot: 'content', class: 'flex w-full items-start gap-2' }, h("div", { key: 'afee7e83fe90d843de8bf509ed3d7d451483795f', class: attachment({
|
|
122
124
|
click: this.mode === 'write' && !this.value?.length,
|
|
123
125
|
error: !!this.error?.length,
|
|
124
|
-
}), onClick: () => this._uploadClick() }, prefix, h("span", { key: '
|
|
126
|
+
}), onClick: () => this._uploadClick() }, prefix, h("span", { key: 'c59a8e66fde71d2b8423cb5f6385ebb1ee6f51d6', class: cn(baseText, 'peer empty:hidden') }, this.value), h("span", { key: 'b133def98ae61ff290371aa76918c38d209098bd', class: cn(baseText, 'hidden peer-empty:block') }, this.placeholder)), h("p-tooltip", { key: '70dd1bf027ba620e5653e0f6fecd2d2e9f8d5047', class: 'w-8', content: this.mode === 'read'
|
|
125
127
|
? this.downloadTooltip
|
|
126
128
|
: this.value?.length
|
|
127
129
|
? this.deleteTooltip
|
|
128
|
-
: this.uploadTooltip }, h("p-button", { key: '
|
|
130
|
+
: this.uploadTooltip }, h("p-button", { key: 'bad75a34fff38946e6361c2b1e467e7fc1331cdf', slot: 'trigger', variant: 'secondary', iconOnly: true, icon: this.mode === 'read'
|
|
129
131
|
? 'download'
|
|
130
132
|
: this.value?.length
|
|
131
133
|
? 'trash'
|
|
@@ -136,7 +138,7 @@ const Attachment = /*@__PURE__*/ proxyCustomElement(class Attachment extends H {
|
|
|
136
138
|
: this.delete).emit() })), this.enableCameraOnMobile &&
|
|
137
139
|
this.mode === 'write' &&
|
|
138
140
|
isMobileDevice &&
|
|
139
|
-
!this.value?.length && (h("p-tooltip", { key: '
|
|
141
|
+
!this.value?.length && (h("p-tooltip", { key: 'efdfd38ae5ca2f9e63af50d3a82339cbd0af6ef9', content: this.cameraTooltip, class: 'w-8 desktop-xs:hidden' }, h("p-button", { key: '38a9dc23149a96fd7626236b9f1b1b8794bc0c84', slot: 'trigger', variant: 'secondary', iconOnly: true, icon: 'camera', onOnClick: () => this._cameraClick() }))))), h("input", { key: 'a4e9ec4655dcdd0778a6e84638ef8fb6011ce4a8', class: 'hidden', type: 'file', accept: Array.isArray(this.accept) ? this.accept?.join(',') : this.accept, ref: el => (this._fileRef = el), onChange: ev => this._onFileChange(ev) }), h("input", { key: '3f5212b6d4602d39075254405b8177672a97acb7', class: 'hidden', type: 'file', accept: 'image/*', capture: 'true', ref: el => (this._cameraFileRef = el), onChange: ev => this._onFileChange(ev) })));
|
|
140
142
|
}
|
|
141
143
|
_uploadClick() {
|
|
142
144
|
if (!this._fileRef || this.mode !== 'write' || this.value?.length) {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"file":"p-attachment.js","mappings":"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","names":["__stencil_proxyCustomElement","HTMLElement"],"sources":["src/components/molecules/attachment/attachment.component.css?tag=p-attachment&encapsulation=shadow","src/components/molecules/attachment/attachment.component.tsx"],"sourcesContent":[":host {\n\t@apply block w-full;\n}\n","import {\n\tComponent,\n\tEvent,\n\tEventEmitter,\n\tFragment,\n\th,\n\tProp,\n} from '@stencil/core';\nimport { cn, isMobile, isTablet } from '../../../utils';\nimport { cva } from 'class-variance-authority';\n\nconst attachment = cva(\n\t[\n\t\t'flex flex-1 items-center justify-start gap-2',\n\t\t'h-8 min-w-0 px-2 rounded-lg',\n\t\t'border border-solid bg-white-600',\n\t],\n\t{\n\t\tvariants: {\n\t\t\tclick: {\n\t\t\t\tfalse: null,\n\t\t\t\ttrue: 'cursor-pointer',\n\t\t\t},\n\t\t\terror: {\n\t\t\t\tfalse: 'bg-white-600 border-storm-100 text-storm-200',\n\t\t\t\ttrue: 'border-negative-red-500',\n\t\t\t},\n\t\t},\n\t}\n);\n\n@Component({\n\ttag: 'p-attachment',\n\tstyleUrl: 'attachment.component.css',\n\tshadow: true,\n})\nexport class Attachment {\n\t/**\n\t * Wether to enable the camera button on mobile\n\t */\n\t@Prop() enableCameraOnMobile = false;\n\n\t/**\n\t * The value of the attachment (usually the file name)\n\t */\n\t@Prop() value: string;\n\n\t/**\n\t * The fileID to use to track the file\n\t */\n\t@Prop() fileId: string;\n\n\t/**\n\t * The type of files to accept\n\t */\n\t@Prop() accept: string[] | string = null;\n\n\t/**\n\t * The label of the attachment\n\t */\n\t@Prop() label: string | HTMLSlotElement;\n\n\t/**\n\t * The helper of the attachment\n\t */\n\t@Prop() helper: string | HTMLSlotElement;\n\n\t/**\n\t * Wether the attachment is required\n\t */\n\t@Prop({ reflect: true }) required = true;\n\n\t/**\n\t * The variant of the attachment\n\t */\n\t@Prop() mode: 'read' | 'write' = 'read';\n\n\t/**\n\t * The placeholder of the attachment\n\t */\n\t@Prop() placeholder: string = 'Upload a file...';\n\n\t/**\n\t * The text for the camera tooltip\n\t */\n\t@Prop() cameraTooltip: string = 'Camera';\n\n\t/**\n\t * The text for the download tooltip\n\t */\n\t@Prop() downloadTooltip: string = 'Download';\n\n\t/**\n\t * The text for the upload tooltip\n\t */\n\t@Prop() uploadTooltip: string = 'Upload';\n\n\t/**\n\t * The text for the delete tooltip\n\t */\n\t@Prop() deleteTooltip: string = 'Delete';\n\n\t/**\n\t * Wether the attachment is loading\n\t */\n\t@Prop() loading = false;\n\n\t/**\n\t * The error to show\n\t */\n\t@Prop() error: string;\n\n\t/**\n\t * Event when upload is pressed\n\t */\n\t@Event({\n\t\tbubbles: false,\n\t})\n\tupload: EventEmitter<{\n\t\tfile: File;\n\t\tfileId: string;\n\t\tresult: string;\n\t}>;\n\n\t/**\n\t * Event when download is pressed\n\t */\n\t@Event({\n\t\tbubbles: false,\n\t})\n\tdownload: EventEmitter<void>;\n\n\t/**\n\t * Event when delete is pressed\n\t */\n\t@Event({\n\t\tbubbles: false,\n\t})\n\tdelete: EventEmitter<void>;\n\n\tprivate _fileRef: HTMLInputElement;\n\tprivate _cameraFileRef: HTMLInputElement;\n\n\trender() {\n\t\tlet prefix = (\n\t\t\t<p-icon\n\t\t\t\tclass='text-storm-300'\n\t\t\t\tvariant='attachment'\n\t\t\t/>\n\t\t);\n\n\t\tif (this.error) {\n\t\t\tprefix = (\n\t\t\t\t<p-icon\n\t\t\t\t\tvariant='warning'\n\t\t\t\t\tclass='text-negative-red-500'\n\t\t\t\t/>\n\t\t\t);\n\t\t}\n\n\t\t// const isMobileDevice = isMobile();\n\t\tconst isMobileDevice = isTablet();\n\n\t\tconst baseText =\n\t\t\t'min-w-0 flex-1 overflow-hidden text-ellipsis whitespace-nowrap text-sm';\n\t\treturn (\n\t\t\t<Fragment>\n\t\t\t\t<p-field-container\n\t\t\t\t\tvariant='write'\n\t\t\t\t\tlabel={this.label}\n\t\t\t\t\thelper={this.helper}\n\t\t\t\t\terror={this.error}\n\t\t\t\t\trequired={this.required}\n\t\t\t\t\tforceShowTooltip={!!this.error?.length}\n\t\t\t\t>\n\t\t\t\t\t<div\n\t\t\t\t\t\tslot='content'\n\t\t\t\t\t\tclass='flex w-full items-start gap-2'\n\t\t\t\t\t>\n\t\t\t\t\t\t<div\n\t\t\t\t\t\t\tclass={attachment({\n\t\t\t\t\t\t\t\tclick: this.mode === 'write' && !this.value?.length,\n\t\t\t\t\t\t\t\terror: !!this.error?.length,\n\t\t\t\t\t\t\t})}\n\t\t\t\t\t\t\tonClick={() => this._uploadClick()}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{prefix}\n\n\t\t\t\t\t\t\t<span class={cn(baseText, 'peer empty:hidden')}>\n\t\t\t\t\t\t\t\t{this.value}\n\t\t\t\t\t\t\t</span>\n\t\t\t\t\t\t\t<span class={cn(baseText, 'hidden peer-empty:block')}>\n\t\t\t\t\t\t\t\t{this.placeholder}\n\t\t\t\t\t\t\t</span>\n\t\t\t\t\t\t</div>\n\n\t\t\t\t\t\t<p-tooltip\n\t\t\t\t\t\t\tclass='w-8'\n\t\t\t\t\t\t\tcontent={\n\t\t\t\t\t\t\t\tthis.mode === 'read'\n\t\t\t\t\t\t\t\t\t? this.downloadTooltip\n\t\t\t\t\t\t\t\t\t: this.value?.length\n\t\t\t\t\t\t\t\t\t? this.deleteTooltip\n\t\t\t\t\t\t\t\t\t: this.uploadTooltip\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<p-button\n\t\t\t\t\t\t\t\tslot='trigger'\n\t\t\t\t\t\t\t\tvariant='secondary'\n\t\t\t\t\t\t\t\ticonOnly={true}\n\t\t\t\t\t\t\t\ticon={\n\t\t\t\t\t\t\t\t\tthis.mode === 'read'\n\t\t\t\t\t\t\t\t\t\t? 'download'\n\t\t\t\t\t\t\t\t\t\t: this.value?.length\n\t\t\t\t\t\t\t\t\t\t? 'trash'\n\t\t\t\t\t\t\t\t\t\t: 'upload'\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\tdisabled={this.loading}\n\t\t\t\t\t\t\t\tloading={this.loading}\n\t\t\t\t\t\t\t\tonOnClick={() =>\n\t\t\t\t\t\t\t\t\tthis.mode === 'write' && !this.value?.length\n\t\t\t\t\t\t\t\t\t\t? this._uploadClick()\n\t\t\t\t\t\t\t\t\t\t: (this.mode === 'read'\n\t\t\t\t\t\t\t\t\t\t\t\t? this.download\n\t\t\t\t\t\t\t\t\t\t\t\t: this.delete\n\t\t\t\t\t\t\t\t\t\t ).emit()\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t</p-tooltip>\n\n\t\t\t\t\t\t{this.enableCameraOnMobile &&\n\t\t\t\t\t\t\tthis.mode === 'write' &&\n\t\t\t\t\t\t\tisMobileDevice &&\n\t\t\t\t\t\t\t!this.value?.length && (\n\t\t\t\t\t\t\t\t<p-tooltip\n\t\t\t\t\t\t\t\t\tcontent={this.cameraTooltip}\n\t\t\t\t\t\t\t\t\tclass='w-8 desktop-xs:hidden'\n\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t<p-button\n\t\t\t\t\t\t\t\t\t\tslot='trigger'\n\t\t\t\t\t\t\t\t\t\tvariant='secondary'\n\t\t\t\t\t\t\t\t\t\ticonOnly={true}\n\t\t\t\t\t\t\t\t\t\ticon='camera'\n\t\t\t\t\t\t\t\t\t\tonOnClick={() => this._cameraClick()}\n\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t</p-tooltip>\n\t\t\t\t\t\t\t)}\n\t\t\t\t\t</div>\n\t\t\t\t</p-field-container>\n\n\t\t\t\t<input\n\t\t\t\t\tclass='hidden'\n\t\t\t\t\ttype='file'\n\t\t\t\t\taccept={\n\t\t\t\t\t\tArray.isArray(this.accept) ? this.accept?.join(',') : this.accept\n\t\t\t\t\t}\n\t\t\t\t\tref={el => (this._fileRef = el)}\n\t\t\t\t\tonChange={ev => this._onFileChange(ev)}\n\t\t\t\t/>\n\n\t\t\t\t<input\n\t\t\t\t\tclass='hidden'\n\t\t\t\t\ttype='file'\n\t\t\t\t\taccept='image/*'\n\t\t\t\t\tcapture='true'\n\t\t\t\t\tref={el => (this._cameraFileRef = el)}\n\t\t\t\t\tonChange={ev => this._onFileChange(ev)}\n\t\t\t\t/>\n\t\t\t</Fragment>\n\t\t);\n\t}\n\n\tprivate _uploadClick() {\n\t\tif (!this._fileRef || this.mode !== 'write' || this.value?.length) {\n\t\t\treturn;\n\t\t}\n\n\t\tthis._fileRef.click();\n\t}\n\n\tprivate _cameraClick() {\n\t\tif (!this.enableCameraOnMobile || isMobile()) {\n\t\t\treturn;\n\t\t}\n\n\t\tif (!this._cameraFileRef || this.mode !== 'write') {\n\t\t\treturn;\n\t\t}\n\n\t\tthis._cameraFileRef?.click();\n\t}\n\n\tprivate _onFileChange(ev: Event) {\n\t\tconst target = ev.target as HTMLInputElement;\n\t\tconst file = target.files?.[0];\n\n\t\tif (file) {\n\t\t\tthis.loading = true;\n\n\t\t\tconst reader = new FileReader();\n\t\t\treader.onload = (e: any) => this._onLoad(file, e?.currentTarget?.result);\n\t\t\treader.readAsDataURL(file);\n\t\t}\n\t}\n\n\tprivate _onLoad(file: File, result: string) {\n\t\tthis.upload.emit({\n\t\t\tfileId: this.fileId,\n\t\t\tresult,\n\t\t\tfile,\n\t\t});\n\n\t\tif (this._fileRef) {\n\t\t\tthis._fileRef.value = '';\n\t\t}\n\n\t\tif (this._cameraFileRef) {\n\t\t\tthis._cameraFileRef.value = '';\n\t\t}\n\n\t\tthis.loading = false;\n\t}\n}\n"],"version":3}
|
|
1
|
+
{"file":"p-attachment.js","mappings":";;;;;;;;;;;AAAA,MAAM,sBAAsB,GAAG,64FAA64F;;ACW56F,MAAM,UAAU,GAAG,GAAG,CACrB;IACC,8CAA8C;IAC9C,6BAA6B;IAC7B,qBAAqB;IACrB,6BAA6B;IAC7B,0CAA0C;CAC1C,EACD;AACC,IAAA,QAAQ,EAAE;AACT,QAAA,KAAK,EAAE;AACN,YAAA,KAAK,EAAE,IAAI;AACX,YAAA,IAAI,EAAE,gBAAgB;AACtB,SAAA;AACD,QAAA,KAAK,EAAE;AACN,YAAA,KAAK,EAAE,uCAAuC;AAC9C,YAAA,IAAI,EAAE,8DAA8D;AACpE,SAAA;AACD,KAAA;AACD,CAAA,CACD;MAOY,UAAU,iBAAAA,kBAAA,CAAA,MAAA,UAAA,SAAAC,CAAA,CAAA;;;;;;;;;AACtB;;AAEG;IACK,oBAAoB,GAAG,KAAK;AAEpC;;AAEG;AACK,IAAA,KAAK;AAEb;;AAEG;AACK,IAAA,MAAM;AAEd;;AAEG;IACK,MAAM,GAAsB,IAAI;AAExC;;AAEG;AACK,IAAA,KAAK;AAEb;;AAEG;AACK,IAAA,MAAM;AAEd;;AAEG;IACsB,QAAQ,GAAG,IAAI;AAExC;;AAEG;IACK,IAAI,GAAqB,MAAM;AAEvC;;AAEG;IACK,WAAW,GAAW,kBAAkB;AAEhD;;AAEG;IACK,aAAa,GAAW,QAAQ;AAExC;;AAEG;IACK,eAAe,GAAW,UAAU;AAE5C;;AAEG;IACK,aAAa,GAAW,QAAQ;AAExC;;AAEG;IACK,aAAa,GAAW,QAAQ;AAExC;;AAEG;IACK,OAAO,GAAG,KAAK;AAEvB;;AAEG;AACK,IAAA,KAAK;AAEb;;AAEG;AAIH,IAAA,MAAM;AAMN;;AAEG;AAIH,IAAA,QAAQ;AAER;;AAEG;AAIH,IAAA,MAAM;AAEE,IAAA,QAAQ;AACR,IAAA,cAAc;IAEtB,MAAM,GAAA;QACL,IAAI,MAAM,IACT,CAAA,CAAA,QAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EACC,KAAK,EAAC,gBAAgB,EACtB,OAAO,EAAC,YAAY,EAAA,CACnB,CACF;AAED,QAAA,IAAI,IAAI,CAAC,KAAK,EAAE;YACf,MAAM,IACL,CACC,CAAA,QAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,OAAO,EAAC,SAAS,EACjB,KAAK,EAAC,uBAAuB,EAC5B,CAAA,CACF;;;AAIF,QAAA,MAAM,cAAc,GAAG,QAAQ,EAAE;QAEjC,MAAM,QAAQ,GACb,yEAAyE;AAC1E,QAAA,QACC,EAAC,QAAQ,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,EACR,CAAA,CAAA,mBAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EACC,OAAO,EAAC,OAAO,EACf,KAAK,EAAE,IAAI,CAAC,KAAK,EACjB,MAAM,EAAE,IAAI,CAAC,MAAM,EACnB,KAAK,EAAE,IAAI,CAAC,KAAK,EACjB,QAAQ,EAAE,IAAI,CAAC,QAAQ,EACvB,gBAAgB,EAAE,CAAC,CAAC,IAAI,CAAC,KAAK,EAAE,MAAM,EAAA,EAEtC,CAAA,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EACC,IAAI,EAAC,SAAS,EACd,KAAK,EAAC,+BAA+B,EAAA,EAErC,CACC,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAE,UAAU,CAAC;AACjB,gBAAA,KAAK,EAAE,IAAI,CAAC,IAAI,KAAK,OAAO,IAAI,CAAC,IAAI,CAAC,KAAK,EAAE,MAAM;AACnD,gBAAA,KAAK,EAAE,CAAC,CAAC,IAAI,CAAC,KAAK,EAAE,MAAM;AAC3B,aAAA,CAAC,EACF,OAAO,EAAE,MAAM,IAAI,CAAC,YAAY,EAAE,EAAA,EAEjC,MAAM,EAEP,CAAA,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAM,KAAK,EAAE,EAAE,CAAC,QAAQ,EAAE,mBAAmB,CAAC,EAC5C,EAAA,IAAI,CAAC,KAAK,CACL,EACP,CAAA,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAM,KAAK,EAAE,EAAE,CAAC,QAAQ,EAAE,yBAAyB,CAAC,EAClD,EAAA,IAAI,CAAC,WAAW,CACX,CACF,EAEN,CACC,CAAA,WAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAC,KAAK,EACX,OAAO,EACN,IAAI,CAAC,IAAI,KAAK;kBACX,IAAI,CAAC;AACP,kBAAE,IAAI,CAAC,KAAK,EAAE;sBACZ,IAAI,CAAC;AACP,sBAAE,IAAI,CAAC,aAAa,EAAA,EAGtB,CAAA,CAAA,UAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EACC,IAAI,EAAC,SAAS,EACd,OAAO,EAAC,WAAW,EACnB,QAAQ,EAAE,IAAI,EACd,IAAI,EACH,IAAI,CAAC,IAAI,KAAK;AACb,kBAAE;AACF,kBAAE,IAAI,CAAC,KAAK,EAAE;AACd,sBAAE;AACF,sBAAE,QAAQ,EAEZ,QAAQ,EAAE,IAAI,CAAC,OAAO,EACtB,OAAO,EAAE,IAAI,CAAC,OAAO,EACrB,SAAS,EAAE,MACV,IAAI,CAAC,IAAI,KAAK,OAAO,IAAI,CAAC,IAAI,CAAC,KAAK,EAAE;AACrC,kBAAE,IAAI,CAAC,YAAY;AACnB,kBAAE,CAAC,IAAI,CAAC,IAAI,KAAK;sBACb,IAAI,CAAC;AACP,sBAAE,IAAI,CAAC,MAAM,EACX,IAAI,EAAE,EAAA,CAEX,CACS,EAEX,IAAI,CAAC,oBAAoB;YACzB,IAAI,CAAC,IAAI,KAAK,OAAO;YACrB,cAAc;YACd,CAAC,IAAI,CAAC,KAAK,EAAE,MAAM,KAClB,CAAA,CAAA,WAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EACC,OAAO,EAAE,IAAI,CAAC,aAAa,EAC3B,KAAK,EAAC,uBAAuB,EAAA,EAE7B,CAAA,CAAA,UAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EACC,IAAI,EAAC,SAAS,EACd,OAAO,EAAC,WAAW,EACnB,QAAQ,EAAE,IAAI,EACd,IAAI,EAAC,QAAQ,EACb,SAAS,EAAE,MAAM,IAAI,CAAC,YAAY,EAAE,EAAA,CACnC,CACS,CACZ,CACG,CACa,EAEpB,CAAA,CAAA,OAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EACC,KAAK,EAAC,QAAQ,EACd,IAAI,EAAC,MAAM,EACX,MAAM,EACL,KAAK,CAAC,OAAO,CAAC,IAAI,CAAC,MAAM,CAAC,GAAG,IAAI,CAAC,MAAM,EAAE,IAAI,CAAC,GAAG,CAAC,GAAG,IAAI,CAAC,MAAM,EAElE,GAAG,EAAE,EAAE,KAAK,IAAI,CAAC,QAAQ,GAAG,EAAE,CAAC,EAC/B,QAAQ,EAAE,EAAE,IAAI,IAAI,CAAC,aAAa,CAAC,EAAE,CAAC,EACrC,CAAA,EAEF,CACC,CAAA,OAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAC,QAAQ,EACd,IAAI,EAAC,MAAM,EACX,MAAM,EAAC,SAAS,EAChB,OAAO,EAAC,MAAM,EACd,GAAG,EAAE,EAAE,KAAK,IAAI,CAAC,cAAc,GAAG,EAAE,CAAC,EACrC,QAAQ,EAAE,EAAE,IAAI,IAAI,CAAC,aAAa,CAAC,EAAE,CAAC,EAAA,CACrC,CACQ;;IAIL,YAAY,GAAA;AACnB,QAAA,IAAI,CAAC,IAAI,CAAC,QAAQ,IAAI,IAAI,CAAC,IAAI,KAAK,OAAO,IAAI,IAAI,CAAC,KAAK,EAAE,MAAM,EAAE;YAClE;;AAGD,QAAA,IAAI,CAAC,QAAQ,CAAC,KAAK,EAAE;;IAGd,YAAY,GAAA;QACnB,IAAI,CAAC,IAAI,CAAC,oBAAoB,IAAI,QAAQ,EAAE,EAAE;YAC7C;;QAGD,IAAI,CAAC,IAAI,CAAC,cAAc,IAAI,IAAI,CAAC,IAAI,KAAK,OAAO,EAAE;YAClD;;AAGD,QAAA,IAAI,CAAC,cAAc,EAAE,KAAK,EAAE;;AAGrB,IAAA,aAAa,CAAC,EAAS,EAAA;AAC9B,QAAA,MAAM,MAAM,GAAG,EAAE,CAAC,MAA0B;QAC5C,MAAM,IAAI,GAAG,MAAM,CAAC,KAAK,GAAG,CAAC,CAAC;QAE9B,IAAI,IAAI,EAAE;AACT,YAAA,IAAI,CAAC,OAAO,GAAG,IAAI;AAEnB,YAAA,MAAM,MAAM,GAAG,IAAI,UAAU,EAAE;YAC/B,MAAM,CAAC,MAAM,GAAG,CAAC,CAAM,KAAK,IAAI,CAAC,OAAO,CAAC,IAAI,EAAE,CAAC,EAAE,aAAa,EAAE,MAAM,CAAC;AACxE,YAAA,MAAM,CAAC,aAAa,CAAC,IAAI,CAAC;;;IAIpB,OAAO,CAAC,IAAU,EAAE,MAAc,EAAA;AACzC,QAAA,IAAI,CAAC,MAAM,CAAC,IAAI,CAAC;YAChB,MAAM,EAAE,IAAI,CAAC,MAAM;YACnB,MAAM;YACN,IAAI;AACJ,SAAA,CAAC;AAEF,QAAA,IAAI,IAAI,CAAC,QAAQ,EAAE;AAClB,YAAA,IAAI,CAAC,QAAQ,CAAC,KAAK,GAAG,EAAE;;AAGzB,QAAA,IAAI,IAAI,CAAC,cAAc,EAAE;AACxB,YAAA,IAAI,CAAC,cAAc,CAAC,KAAK,GAAG,EAAE;;AAG/B,QAAA,IAAI,CAAC,OAAO,GAAG,KAAK;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":["__stencil_proxyCustomElement","HTMLElement"],"sources":["src/components/molecules/attachment/attachment.component.css?tag=p-attachment&encapsulation=shadow","src/components/molecules/attachment/attachment.component.tsx"],"sourcesContent":[":host {\n\t@apply block w-full;\n}\n","import {\n\tComponent,\n\tEvent,\n\tEventEmitter,\n\tFragment,\n\th,\n\tProp,\n} from '@stencil/core';\nimport { cn, isMobile, isTablet } from '../../../utils';\nimport { cva } from 'class-variance-authority';\n\nconst attachment = cva(\n\t[\n\t\t'flex flex-1 items-center justify-start gap-2',\n\t\t'h-8 min-w-0 px-2 rounded-lg',\n\t\t'border border-solid',\n\t\t'bg-white-600 text-storm-200',\n\t\t'dark:bg-white/15 dark:text-hurricane-200',\n\t],\n\t{\n\t\tvariants: {\n\t\t\tclick: {\n\t\t\t\tfalse: null,\n\t\t\t\ttrue: 'cursor-pointer',\n\t\t\t},\n\t\t\terror: {\n\t\t\t\tfalse: 'border-storm-100 dark:border-white/15',\n\t\t\t\ttrue: 'border-negative-red-500 dark:border-negative-red-alternative',\n\t\t\t},\n\t\t},\n\t}\n);\n\n@Component({\n\ttag: 'p-attachment',\n\tstyleUrl: 'attachment.component.css',\n\tshadow: true,\n})\nexport class Attachment {\n\t/**\n\t * Wether to enable the camera button on mobile\n\t */\n\t@Prop() enableCameraOnMobile = false;\n\n\t/**\n\t * The value of the attachment (usually the file name)\n\t */\n\t@Prop() value: string;\n\n\t/**\n\t * The fileID to use to track the file\n\t */\n\t@Prop() fileId: string;\n\n\t/**\n\t * The type of files to accept\n\t */\n\t@Prop() accept: string[] | string = null;\n\n\t/**\n\t * The label of the attachment\n\t */\n\t@Prop() label: string | HTMLSlotElement;\n\n\t/**\n\t * The helper of the attachment\n\t */\n\t@Prop() helper: string | HTMLSlotElement;\n\n\t/**\n\t * Wether the attachment is required\n\t */\n\t@Prop({ reflect: true }) required = true;\n\n\t/**\n\t * The variant of the attachment\n\t */\n\t@Prop() mode: 'read' | 'write' = 'read';\n\n\t/**\n\t * The placeholder of the attachment\n\t */\n\t@Prop() placeholder: string = 'Upload a file...';\n\n\t/**\n\t * The text for the camera tooltip\n\t */\n\t@Prop() cameraTooltip: string = 'Camera';\n\n\t/**\n\t * The text for the download tooltip\n\t */\n\t@Prop() downloadTooltip: string = 'Download';\n\n\t/**\n\t * The text for the upload tooltip\n\t */\n\t@Prop() uploadTooltip: string = 'Upload';\n\n\t/**\n\t * The text for the delete tooltip\n\t */\n\t@Prop() deleteTooltip: string = 'Delete';\n\n\t/**\n\t * Wether the attachment is loading\n\t */\n\t@Prop() loading = false;\n\n\t/**\n\t * The error to show\n\t */\n\t@Prop() error: string;\n\n\t/**\n\t * Event when upload is pressed\n\t */\n\t@Event({\n\t\tbubbles: false,\n\t})\n\tupload: EventEmitter<{\n\t\tfile: File;\n\t\tfileId: string;\n\t\tresult: string;\n\t}>;\n\n\t/**\n\t * Event when download is pressed\n\t */\n\t@Event({\n\t\tbubbles: false,\n\t})\n\tdownload: EventEmitter<void>;\n\n\t/**\n\t * Event when delete is pressed\n\t */\n\t@Event({\n\t\tbubbles: false,\n\t})\n\tdelete: EventEmitter<void>;\n\n\tprivate _fileRef: HTMLInputElement;\n\tprivate _cameraFileRef: HTMLInputElement;\n\n\trender() {\n\t\tlet prefix = (\n\t\t\t<p-icon\n\t\t\t\tclass='text-storm-300'\n\t\t\t\tvariant='attachment'\n\t\t\t/>\n\t\t);\n\n\t\tif (this.error) {\n\t\t\tprefix = (\n\t\t\t\t<p-icon\n\t\t\t\t\tvariant='warning'\n\t\t\t\t\tclass='text-negative-red-500'\n\t\t\t\t/>\n\t\t\t);\n\t\t}\n\n\t\t// const isMobileDevice = isMobile();\n\t\tconst isMobileDevice = isTablet();\n\n\t\tconst baseText =\n\t\t\t'min-w-0 flex-1 overflow-hidden text-ellipsis whitespace-nowrap text-sm';\n\t\treturn (\n\t\t\t<Fragment>\n\t\t\t\t<p-field-container\n\t\t\t\t\tvariant='write'\n\t\t\t\t\tlabel={this.label}\n\t\t\t\t\thelper={this.helper}\n\t\t\t\t\terror={this.error}\n\t\t\t\t\trequired={this.required}\n\t\t\t\t\tforceShowTooltip={!!this.error?.length}\n\t\t\t\t>\n\t\t\t\t\t<div\n\t\t\t\t\t\tslot='content'\n\t\t\t\t\t\tclass='flex w-full items-start gap-2'\n\t\t\t\t\t>\n\t\t\t\t\t\t<div\n\t\t\t\t\t\t\tclass={attachment({\n\t\t\t\t\t\t\t\tclick: this.mode === 'write' && !this.value?.length,\n\t\t\t\t\t\t\t\terror: !!this.error?.length,\n\t\t\t\t\t\t\t})}\n\t\t\t\t\t\t\tonClick={() => this._uploadClick()}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{prefix}\n\n\t\t\t\t\t\t\t<span class={cn(baseText, 'peer empty:hidden')}>\n\t\t\t\t\t\t\t\t{this.value}\n\t\t\t\t\t\t\t</span>\n\t\t\t\t\t\t\t<span class={cn(baseText, 'hidden peer-empty:block')}>\n\t\t\t\t\t\t\t\t{this.placeholder}\n\t\t\t\t\t\t\t</span>\n\t\t\t\t\t\t</div>\n\n\t\t\t\t\t\t<p-tooltip\n\t\t\t\t\t\t\tclass='w-8'\n\t\t\t\t\t\t\tcontent={\n\t\t\t\t\t\t\t\tthis.mode === 'read'\n\t\t\t\t\t\t\t\t\t? this.downloadTooltip\n\t\t\t\t\t\t\t\t\t: this.value?.length\n\t\t\t\t\t\t\t\t\t? this.deleteTooltip\n\t\t\t\t\t\t\t\t\t: this.uploadTooltip\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<p-button\n\t\t\t\t\t\t\t\tslot='trigger'\n\t\t\t\t\t\t\t\tvariant='secondary'\n\t\t\t\t\t\t\t\ticonOnly={true}\n\t\t\t\t\t\t\t\ticon={\n\t\t\t\t\t\t\t\t\tthis.mode === 'read'\n\t\t\t\t\t\t\t\t\t\t? 'download'\n\t\t\t\t\t\t\t\t\t\t: this.value?.length\n\t\t\t\t\t\t\t\t\t\t? 'trash'\n\t\t\t\t\t\t\t\t\t\t: 'upload'\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\tdisabled={this.loading}\n\t\t\t\t\t\t\t\tloading={this.loading}\n\t\t\t\t\t\t\t\tonOnClick={() =>\n\t\t\t\t\t\t\t\t\tthis.mode === 'write' && !this.value?.length\n\t\t\t\t\t\t\t\t\t\t? this._uploadClick()\n\t\t\t\t\t\t\t\t\t\t: (this.mode === 'read'\n\t\t\t\t\t\t\t\t\t\t\t\t? this.download\n\t\t\t\t\t\t\t\t\t\t\t\t: this.delete\n\t\t\t\t\t\t\t\t\t\t ).emit()\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t</p-tooltip>\n\n\t\t\t\t\t\t{this.enableCameraOnMobile &&\n\t\t\t\t\t\t\tthis.mode === 'write' &&\n\t\t\t\t\t\t\tisMobileDevice &&\n\t\t\t\t\t\t\t!this.value?.length && (\n\t\t\t\t\t\t\t\t<p-tooltip\n\t\t\t\t\t\t\t\t\tcontent={this.cameraTooltip}\n\t\t\t\t\t\t\t\t\tclass='w-8 desktop-xs:hidden'\n\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t<p-button\n\t\t\t\t\t\t\t\t\t\tslot='trigger'\n\t\t\t\t\t\t\t\t\t\tvariant='secondary'\n\t\t\t\t\t\t\t\t\t\ticonOnly={true}\n\t\t\t\t\t\t\t\t\t\ticon='camera'\n\t\t\t\t\t\t\t\t\t\tonOnClick={() => this._cameraClick()}\n\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t</p-tooltip>\n\t\t\t\t\t\t\t)}\n\t\t\t\t\t</div>\n\t\t\t\t</p-field-container>\n\n\t\t\t\t<input\n\t\t\t\t\tclass='hidden'\n\t\t\t\t\ttype='file'\n\t\t\t\t\taccept={\n\t\t\t\t\t\tArray.isArray(this.accept) ? this.accept?.join(',') : this.accept\n\t\t\t\t\t}\n\t\t\t\t\tref={el => (this._fileRef = el)}\n\t\t\t\t\tonChange={ev => this._onFileChange(ev)}\n\t\t\t\t/>\n\n\t\t\t\t<input\n\t\t\t\t\tclass='hidden'\n\t\t\t\t\ttype='file'\n\t\t\t\t\taccept='image/*'\n\t\t\t\t\tcapture='true'\n\t\t\t\t\tref={el => (this._cameraFileRef = el)}\n\t\t\t\t\tonChange={ev => this._onFileChange(ev)}\n\t\t\t\t/>\n\t\t\t</Fragment>\n\t\t);\n\t}\n\n\tprivate _uploadClick() {\n\t\tif (!this._fileRef || this.mode !== 'write' || this.value?.length) {\n\t\t\treturn;\n\t\t}\n\n\t\tthis._fileRef.click();\n\t}\n\n\tprivate _cameraClick() {\n\t\tif (!this.enableCameraOnMobile || isMobile()) {\n\t\t\treturn;\n\t\t}\n\n\t\tif (!this._cameraFileRef || this.mode !== 'write') {\n\t\t\treturn;\n\t\t}\n\n\t\tthis._cameraFileRef?.click();\n\t}\n\n\tprivate _onFileChange(ev: Event) {\n\t\tconst target = ev.target as HTMLInputElement;\n\t\tconst file = target.files?.[0];\n\n\t\tif (file) {\n\t\t\tthis.loading = true;\n\n\t\t\tconst reader = new FileReader();\n\t\t\treader.onload = (e: any) => this._onLoad(file, e?.currentTarget?.result);\n\t\t\treader.readAsDataURL(file);\n\t\t}\n\t}\n\n\tprivate _onLoad(file: File, result: string) {\n\t\tthis.upload.emit({\n\t\t\tfileId: this.fileId,\n\t\t\tresult,\n\t\t\tfile,\n\t\t});\n\n\t\tif (this._fileRef) {\n\t\t\tthis._fileRef.value = '';\n\t\t}\n\n\t\tif (this._cameraFileRef) {\n\t\t\tthis._cameraFileRef.value = '';\n\t\t}\n\n\t\tthis.loading = false;\n\t}\n}\n"],"version":3}
|
|
@@ -4,12 +4,14 @@ import { h as isTablet, f as isMobile } from './screens-B3sNjfzc.js';
|
|
|
4
4
|
import { c as cn } from './cn-BniKgfyU.js';
|
|
5
5
|
import './clsx-ChV9xqsO.js';
|
|
6
6
|
|
|
7
|
-
const attachmentComponentCss = ".block{display:block!important}*{box-sizing:border-box}:host{display:block;width:100%}.static{position:static!important}.flex{display:flex!important}.hidden{display:none!important}.h-8{height:2rem!important}.w-8{width:2rem!important}.w-full{width:100%!important}.min-w-0{min-width:0!important}.flex-1{flex:1 1 0%!important}.cursor-pointer{cursor:pointer!important}.items-start{align-items:flex-start!important}.items-center{align-items:center!important}.justify-start{justify-content:flex-start!important}.gap-2{gap:.5rem!important}.overflow-hidden{overflow:hidden!important}.text-ellipsis{text-overflow:ellipsis!important}.whitespace-nowrap{white-space:nowrap!important}.rounded-lg{border-radius:.5rem!important}.border{border-width:1px!important}.border-solid{border-style:solid!important}.border-negative-red-500{--tw-border-opacity:1!important;border-color:rgb(230 30 30/var(--tw-border-opacity,1))!important}.border-storm-100{--tw-border-opacity:1!important;border-color:rgb(209 210 212/var(--tw-border-opacity,1))!important}.bg-white-600{--tw-bg-opacity:1!important;background-color:rgb(250 250 250/var(--tw-bg-opacity,1))!important}.px-2{padding-left:.5rem!important;padding-right:.5rem!important}.text-sm{font-size:.875rem!important;line-height:1.25rem!important}.text-negative-red-500{--tw-text-opacity:1!important;color:rgb(230 30 30/var(--tw-text-opacity,1))!important}.text-storm-200{--tw-text-opacity:1!important;color:rgb(163 165 169/var(--tw-text-opacity,1))!important}.text-storm-300{--tw-text-opacity:1!important;color:rgb(116 120 127/var(--tw-text-opacity,1))!important}.empty\\:hidden:empty{display:none!important}.peer:empty~.peer-empty\\:block{display:block!important}@media (min-width:64rem){.desktop-xs\\:hidden{display:none!important}}";
|
|
7
|
+
const attachmentComponentCss = ".block{display:block!important}*{box-sizing:border-box}:host{display:block;width:100%}.static{position:static!important}.flex{display:flex!important}.hidden{display:none!important}.h-8{height:2rem!important}.w-8{width:2rem!important}.w-full{width:100%!important}.min-w-0{min-width:0!important}.flex-1{flex:1 1 0%!important}.cursor-pointer{cursor:pointer!important}.items-start{align-items:flex-start!important}.items-center{align-items:center!important}.justify-start{justify-content:flex-start!important}.gap-2{gap:.5rem!important}.overflow-hidden{overflow:hidden!important}.text-ellipsis{text-overflow:ellipsis!important}.whitespace-nowrap{white-space:nowrap!important}.rounded-lg{border-radius:.5rem!important}.border{border-width:1px!important}.border-solid{border-style:solid!important}.border-negative-red-500{--tw-border-opacity:1!important;border-color:rgb(230 30 30/var(--tw-border-opacity,1))!important}.border-storm-100{--tw-border-opacity:1!important;border-color:rgb(209 210 212/var(--tw-border-opacity,1))!important}.bg-white-600{--tw-bg-opacity:1!important;background-color:rgb(250 250 250/var(--tw-bg-opacity,1))!important}.px-2{padding-left:.5rem!important;padding-right:.5rem!important}.text-sm{font-size:.875rem!important;line-height:1.25rem!important}.text-negative-red-500{--tw-text-opacity:1!important;color:rgb(230 30 30/var(--tw-text-opacity,1))!important}.text-storm-200{--tw-text-opacity:1!important;color:rgb(163 165 169/var(--tw-text-opacity,1))!important}.text-storm-300{--tw-text-opacity:1!important;color:rgb(116 120 127/var(--tw-text-opacity,1))!important}.empty\\:hidden:empty{display:none!important}.peer:empty~.peer-empty\\:block{display:block!important}@media (min-width:64rem){.desktop-xs\\:hidden{display:none!important}}.dark\\:border-negative-red-alternative:where(:host([data-theme=dark]),:host([data-theme=dark]) *){--tw-border-opacity:1!important;border-color:rgb(255 92 92/var(--tw-border-opacity,1))!important}.dark\\:border-white\\/15:where(:host([data-theme=dark]),:host([data-theme=dark]) *){border-color:hsla(0,0%,100%,.15)!important}.dark\\:bg-white\\/15:where(:host([data-theme=dark]),:host([data-theme=dark]) *){background-color:hsla(0,0%,100%,.15)!important}.dark\\:text-hurricane-200:where(:host([data-theme=dark]),:host([data-theme=dark]) *){--tw-text-opacity:1!important;color:rgb(163 165 169/var(--tw-text-opacity,1))!important}.dark\\:border-negative-red-alternative:where([data-theme=dark],[data-theme=dark] *){--tw-border-opacity:1!important;border-color:rgb(255 92 92/var(--tw-border-opacity,1))!important}.dark\\:border-white\\/15:where([data-theme=dark],[data-theme=dark] *){border-color:hsla(0,0%,100%,.15)!important}.dark\\:bg-white\\/15:where([data-theme=dark],[data-theme=dark] *){background-color:hsla(0,0%,100%,.15)!important}.dark\\:text-hurricane-200:where([data-theme=dark],[data-theme=dark] *){--tw-text-opacity:1!important;color:rgb(163 165 169/var(--tw-text-opacity,1))!important}";
|
|
8
8
|
|
|
9
9
|
const attachment = cva([
|
|
10
10
|
'flex flex-1 items-center justify-start gap-2',
|
|
11
11
|
'h-8 min-w-0 px-2 rounded-lg',
|
|
12
|
-
'border border-solid
|
|
12
|
+
'border border-solid',
|
|
13
|
+
'bg-white-600 text-storm-200',
|
|
14
|
+
'dark:bg-white/15 dark:text-hurricane-200',
|
|
13
15
|
], {
|
|
14
16
|
variants: {
|
|
15
17
|
click: {
|
|
@@ -17,8 +19,8 @@ const attachment = cva([
|
|
|
17
19
|
true: 'cursor-pointer',
|
|
18
20
|
},
|
|
19
21
|
error: {
|
|
20
|
-
false: '
|
|
21
|
-
true: 'border-negative-red-500',
|
|
22
|
+
false: 'border-storm-100 dark:border-white/15',
|
|
23
|
+
true: 'border-negative-red-500 dark:border-negative-red-alternative',
|
|
22
24
|
},
|
|
23
25
|
},
|
|
24
26
|
});
|
|
@@ -104,21 +106,21 @@ const Attachment = class {
|
|
|
104
106
|
_fileRef;
|
|
105
107
|
_cameraFileRef;
|
|
106
108
|
render() {
|
|
107
|
-
let prefix = (h("p-icon", { key: '
|
|
109
|
+
let prefix = (h("p-icon", { key: 'e3041d87911b3ef89be9ae6dd57d9ad51b4b6ba3', class: 'text-storm-300', variant: 'attachment' }));
|
|
108
110
|
if (this.error) {
|
|
109
|
-
prefix = (h("p-icon", { key: '
|
|
111
|
+
prefix = (h("p-icon", { key: '8cd0ea7fd1848a8f9d3ee96d42b4ecdb5f4ed27b', variant: 'warning', class: 'text-negative-red-500' }));
|
|
110
112
|
}
|
|
111
113
|
// const isMobileDevice = isMobile();
|
|
112
114
|
const isMobileDevice = isTablet();
|
|
113
115
|
const baseText = 'min-w-0 flex-1 overflow-hidden text-ellipsis whitespace-nowrap text-sm';
|
|
114
|
-
return (h(Fragment, { key: '
|
|
116
|
+
return (h(Fragment, { key: '0e75af5dc601f3cb7b24c197c532685154958e06' }, h("p-field-container", { key: '0bf08bb7ce1380635a9fc8b574ec86946e085ffe', variant: 'write', label: this.label, helper: this.helper, error: this.error, required: this.required, forceShowTooltip: !!this.error?.length }, h("div", { key: '5e5d80909c96afb1aabc9509888979fa662eaaff', slot: 'content', class: 'flex w-full items-start gap-2' }, h("div", { key: 'afee7e83fe90d843de8bf509ed3d7d451483795f', class: attachment({
|
|
115
117
|
click: this.mode === 'write' && !this.value?.length,
|
|
116
118
|
error: !!this.error?.length,
|
|
117
|
-
}), onClick: () => this._uploadClick() }, prefix, h("span", { key: '
|
|
119
|
+
}), onClick: () => this._uploadClick() }, prefix, h("span", { key: 'c59a8e66fde71d2b8423cb5f6385ebb1ee6f51d6', class: cn(baseText, 'peer empty:hidden') }, this.value), h("span", { key: 'b133def98ae61ff290371aa76918c38d209098bd', class: cn(baseText, 'hidden peer-empty:block') }, this.placeholder)), h("p-tooltip", { key: '70dd1bf027ba620e5653e0f6fecd2d2e9f8d5047', class: 'w-8', content: this.mode === 'read'
|
|
118
120
|
? this.downloadTooltip
|
|
119
121
|
: this.value?.length
|
|
120
122
|
? this.deleteTooltip
|
|
121
|
-
: this.uploadTooltip }, h("p-button", { key: '
|
|
123
|
+
: this.uploadTooltip }, h("p-button", { key: 'bad75a34fff38946e6361c2b1e467e7fc1331cdf', slot: 'trigger', variant: 'secondary', iconOnly: true, icon: this.mode === 'read'
|
|
122
124
|
? 'download'
|
|
123
125
|
: this.value?.length
|
|
124
126
|
? 'trash'
|
|
@@ -129,7 +131,7 @@ const Attachment = class {
|
|
|
129
131
|
: this.delete).emit() })), this.enableCameraOnMobile &&
|
|
130
132
|
this.mode === 'write' &&
|
|
131
133
|
isMobileDevice &&
|
|
132
|
-
!this.value?.length && (h("p-tooltip", { key: '
|
|
134
|
+
!this.value?.length && (h("p-tooltip", { key: 'efdfd38ae5ca2f9e63af50d3a82339cbd0af6ef9', content: this.cameraTooltip, class: 'w-8 desktop-xs:hidden' }, h("p-button", { key: '38a9dc23149a96fd7626236b9f1b1b8794bc0c84', slot: 'trigger', variant: 'secondary', iconOnly: true, icon: 'camera', onOnClick: () => this._cameraClick() }))))), h("input", { key: 'a4e9ec4655dcdd0778a6e84638ef8fb6011ce4a8', class: 'hidden', type: 'file', accept: Array.isArray(this.accept) ? this.accept?.join(',') : this.accept, ref: el => (this._fileRef = el), onChange: ev => this._onFileChange(ev) }), h("input", { key: '3f5212b6d4602d39075254405b8177672a97acb7', class: 'hidden', type: 'file', accept: 'image/*', capture: 'true', ref: el => (this._cameraFileRef = el), onChange: ev => this._onFileChange(ev) })));
|
|
133
135
|
}
|
|
134
136
|
_uploadClick() {
|
|
135
137
|
if (!this._fileRef || this.mode !== 'write' || this.value?.length) {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"p-attachment.entry.js","sources":["src/components/molecules/attachment/attachment.component.css?tag=p-attachment&encapsulation=shadow","src/components/molecules/attachment/attachment.component.tsx"],"sourcesContent":[":host {\n\t@apply block w-full;\n}\n","import {\n\tComponent,\n\tEvent,\n\tEventEmitter,\n\tFragment,\n\th,\n\tProp,\n} from '@stencil/core';\nimport { cn, isMobile, isTablet } from '../../../utils';\nimport { cva } from 'class-variance-authority';\n\nconst attachment = cva(\n\t[\n\t\t'flex flex-1 items-center justify-start gap-2',\n\t\t'h-8 min-w-0 px-2 rounded-lg',\n\t\t'border border-solid bg-white-600',\n\t],\n\t{\n\t\tvariants: {\n\t\t\tclick: {\n\t\t\t\tfalse: null,\n\t\t\t\ttrue: 'cursor-pointer',\n\t\t\t},\n\t\t\terror: {\n\t\t\t\tfalse: 'bg-white-600 border-storm-100 text-storm-200',\n\t\t\t\ttrue: 'border-negative-red-500',\n\t\t\t},\n\t\t},\n\t}\n);\n\n@Component({\n\ttag: 'p-attachment',\n\tstyleUrl: 'attachment.component.css',\n\tshadow: true,\n})\nexport class Attachment {\n\t/**\n\t * Wether to enable the camera button on mobile\n\t */\n\t@Prop() enableCameraOnMobile = false;\n\n\t/**\n\t * The value of the attachment (usually the file name)\n\t */\n\t@Prop() value: string;\n\n\t/**\n\t * The fileID to use to track the file\n\t */\n\t@Prop() fileId: string;\n\n\t/**\n\t * The type of files to accept\n\t */\n\t@Prop() accept: string[] | string = null;\n\n\t/**\n\t * The label of the attachment\n\t */\n\t@Prop() label: string | HTMLSlotElement;\n\n\t/**\n\t * The helper of the attachment\n\t */\n\t@Prop() helper: string | HTMLSlotElement;\n\n\t/**\n\t * Wether the attachment is required\n\t */\n\t@Prop({ reflect: true }) required = true;\n\n\t/**\n\t * The variant of the attachment\n\t */\n\t@Prop() mode: 'read' | 'write' = 'read';\n\n\t/**\n\t * The placeholder of the attachment\n\t */\n\t@Prop() placeholder: string = 'Upload a file...';\n\n\t/**\n\t * The text for the camera tooltip\n\t */\n\t@Prop() cameraTooltip: string = 'Camera';\n\n\t/**\n\t * The text for the download tooltip\n\t */\n\t@Prop() downloadTooltip: string = 'Download';\n\n\t/**\n\t * The text for the upload tooltip\n\t */\n\t@Prop() uploadTooltip: string = 'Upload';\n\n\t/**\n\t * The text for the delete tooltip\n\t */\n\t@Prop() deleteTooltip: string = 'Delete';\n\n\t/**\n\t * Wether the attachment is loading\n\t */\n\t@Prop() loading = false;\n\n\t/**\n\t * The error to show\n\t */\n\t@Prop() error: string;\n\n\t/**\n\t * Event when upload is pressed\n\t */\n\t@Event({\n\t\tbubbles: false,\n\t})\n\tupload: EventEmitter<{\n\t\tfile: File;\n\t\tfileId: string;\n\t\tresult: string;\n\t}>;\n\n\t/**\n\t * Event when download is pressed\n\t */\n\t@Event({\n\t\tbubbles: false,\n\t})\n\tdownload: EventEmitter<void>;\n\n\t/**\n\t * Event when delete is pressed\n\t */\n\t@Event({\n\t\tbubbles: false,\n\t})\n\tdelete: EventEmitter<void>;\n\n\tprivate _fileRef: HTMLInputElement;\n\tprivate _cameraFileRef: HTMLInputElement;\n\n\trender() {\n\t\tlet prefix = (\n\t\t\t<p-icon\n\t\t\t\tclass='text-storm-300'\n\t\t\t\tvariant='attachment'\n\t\t\t/>\n\t\t);\n\n\t\tif (this.error) {\n\t\t\tprefix = (\n\t\t\t\t<p-icon\n\t\t\t\t\tvariant='warning'\n\t\t\t\t\tclass='text-negative-red-500'\n\t\t\t\t/>\n\t\t\t);\n\t\t}\n\n\t\t// const isMobileDevice = isMobile();\n\t\tconst isMobileDevice = isTablet();\n\n\t\tconst baseText =\n\t\t\t'min-w-0 flex-1 overflow-hidden text-ellipsis whitespace-nowrap text-sm';\n\t\treturn (\n\t\t\t<Fragment>\n\t\t\t\t<p-field-container\n\t\t\t\t\tvariant='write'\n\t\t\t\t\tlabel={this.label}\n\t\t\t\t\thelper={this.helper}\n\t\t\t\t\terror={this.error}\n\t\t\t\t\trequired={this.required}\n\t\t\t\t\tforceShowTooltip={!!this.error?.length}\n\t\t\t\t>\n\t\t\t\t\t<div\n\t\t\t\t\t\tslot='content'\n\t\t\t\t\t\tclass='flex w-full items-start gap-2'\n\t\t\t\t\t>\n\t\t\t\t\t\t<div\n\t\t\t\t\t\t\tclass={attachment({\n\t\t\t\t\t\t\t\tclick: this.mode === 'write' && !this.value?.length,\n\t\t\t\t\t\t\t\terror: !!this.error?.length,\n\t\t\t\t\t\t\t})}\n\t\t\t\t\t\t\tonClick={() => this._uploadClick()}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{prefix}\n\n\t\t\t\t\t\t\t<span class={cn(baseText, 'peer empty:hidden')}>\n\t\t\t\t\t\t\t\t{this.value}\n\t\t\t\t\t\t\t</span>\n\t\t\t\t\t\t\t<span class={cn(baseText, 'hidden peer-empty:block')}>\n\t\t\t\t\t\t\t\t{this.placeholder}\n\t\t\t\t\t\t\t</span>\n\t\t\t\t\t\t</div>\n\n\t\t\t\t\t\t<p-tooltip\n\t\t\t\t\t\t\tclass='w-8'\n\t\t\t\t\t\t\tcontent={\n\t\t\t\t\t\t\t\tthis.mode === 'read'\n\t\t\t\t\t\t\t\t\t? this.downloadTooltip\n\t\t\t\t\t\t\t\t\t: this.value?.length\n\t\t\t\t\t\t\t\t\t? this.deleteTooltip\n\t\t\t\t\t\t\t\t\t: this.uploadTooltip\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<p-button\n\t\t\t\t\t\t\t\tslot='trigger'\n\t\t\t\t\t\t\t\tvariant='secondary'\n\t\t\t\t\t\t\t\ticonOnly={true}\n\t\t\t\t\t\t\t\ticon={\n\t\t\t\t\t\t\t\t\tthis.mode === 'read'\n\t\t\t\t\t\t\t\t\t\t? 'download'\n\t\t\t\t\t\t\t\t\t\t: this.value?.length\n\t\t\t\t\t\t\t\t\t\t? 'trash'\n\t\t\t\t\t\t\t\t\t\t: 'upload'\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\tdisabled={this.loading}\n\t\t\t\t\t\t\t\tloading={this.loading}\n\t\t\t\t\t\t\t\tonOnClick={() =>\n\t\t\t\t\t\t\t\t\tthis.mode === 'write' && !this.value?.length\n\t\t\t\t\t\t\t\t\t\t? this._uploadClick()\n\t\t\t\t\t\t\t\t\t\t: (this.mode === 'read'\n\t\t\t\t\t\t\t\t\t\t\t\t? this.download\n\t\t\t\t\t\t\t\t\t\t\t\t: this.delete\n\t\t\t\t\t\t\t\t\t\t ).emit()\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t</p-tooltip>\n\n\t\t\t\t\t\t{this.enableCameraOnMobile &&\n\t\t\t\t\t\t\tthis.mode === 'write' &&\n\t\t\t\t\t\t\tisMobileDevice &&\n\t\t\t\t\t\t\t!this.value?.length && (\n\t\t\t\t\t\t\t\t<p-tooltip\n\t\t\t\t\t\t\t\t\tcontent={this.cameraTooltip}\n\t\t\t\t\t\t\t\t\tclass='w-8 desktop-xs:hidden'\n\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t<p-button\n\t\t\t\t\t\t\t\t\t\tslot='trigger'\n\t\t\t\t\t\t\t\t\t\tvariant='secondary'\n\t\t\t\t\t\t\t\t\t\ticonOnly={true}\n\t\t\t\t\t\t\t\t\t\ticon='camera'\n\t\t\t\t\t\t\t\t\t\tonOnClick={() => this._cameraClick()}\n\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t</p-tooltip>\n\t\t\t\t\t\t\t)}\n\t\t\t\t\t</div>\n\t\t\t\t</p-field-container>\n\n\t\t\t\t<input\n\t\t\t\t\tclass='hidden'\n\t\t\t\t\ttype='file'\n\t\t\t\t\taccept={\n\t\t\t\t\t\tArray.isArray(this.accept) ? this.accept?.join(',') : this.accept\n\t\t\t\t\t}\n\t\t\t\t\tref={el => (this._fileRef = el)}\n\t\t\t\t\tonChange={ev => this._onFileChange(ev)}\n\t\t\t\t/>\n\n\t\t\t\t<input\n\t\t\t\t\tclass='hidden'\n\t\t\t\t\ttype='file'\n\t\t\t\t\taccept='image/*'\n\t\t\t\t\tcapture='true'\n\t\t\t\t\tref={el => (this._cameraFileRef = el)}\n\t\t\t\t\tonChange={ev => this._onFileChange(ev)}\n\t\t\t\t/>\n\t\t\t</Fragment>\n\t\t);\n\t}\n\n\tprivate _uploadClick() {\n\t\tif (!this._fileRef || this.mode !== 'write' || this.value?.length) {\n\t\t\treturn;\n\t\t}\n\n\t\tthis._fileRef.click();\n\t}\n\n\tprivate _cameraClick() {\n\t\tif (!this.enableCameraOnMobile || isMobile()) {\n\t\t\treturn;\n\t\t}\n\n\t\tif (!this._cameraFileRef || this.mode !== 'write') {\n\t\t\treturn;\n\t\t}\n\n\t\tthis._cameraFileRef?.click();\n\t}\n\n\tprivate _onFileChange(ev: Event) {\n\t\tconst target = ev.target as HTMLInputElement;\n\t\tconst file = target.files?.[0];\n\n\t\tif (file) {\n\t\t\tthis.loading = true;\n\n\t\t\tconst reader = new FileReader();\n\t\t\treader.onload = (e: any) => this._onLoad(file, e?.currentTarget?.result);\n\t\t\treader.readAsDataURL(file);\n\t\t}\n\t}\n\n\tprivate _onLoad(file: File, result: string) {\n\t\tthis.upload.emit({\n\t\t\tfileId: this.fileId,\n\t\t\tresult,\n\t\t\tfile,\n\t\t});\n\n\t\tif (this._fileRef) {\n\t\t\tthis._fileRef.value = '';\n\t\t}\n\n\t\tif (this._cameraFileRef) {\n\t\t\tthis._cameraFileRef.value = '';\n\t\t}\n\n\t\tthis.loading = false;\n\t}\n}\n"],"names":[],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"p-attachment.entry.js","sources":["src/components/molecules/attachment/attachment.component.css?tag=p-attachment&encapsulation=shadow","src/components/molecules/attachment/attachment.component.tsx"],"sourcesContent":[":host {\n\t@apply block w-full;\n}\n","import {\n\tComponent,\n\tEvent,\n\tEventEmitter,\n\tFragment,\n\th,\n\tProp,\n} from '@stencil/core';\nimport { cn, isMobile, isTablet } from '../../../utils';\nimport { cva } from 'class-variance-authority';\n\nconst attachment = cva(\n\t[\n\t\t'flex flex-1 items-center justify-start gap-2',\n\t\t'h-8 min-w-0 px-2 rounded-lg',\n\t\t'border border-solid',\n\t\t'bg-white-600 text-storm-200',\n\t\t'dark:bg-white/15 dark:text-hurricane-200',\n\t],\n\t{\n\t\tvariants: {\n\t\t\tclick: {\n\t\t\t\tfalse: null,\n\t\t\t\ttrue: 'cursor-pointer',\n\t\t\t},\n\t\t\terror: {\n\t\t\t\tfalse: 'border-storm-100 dark:border-white/15',\n\t\t\t\ttrue: 'border-negative-red-500 dark:border-negative-red-alternative',\n\t\t\t},\n\t\t},\n\t}\n);\n\n@Component({\n\ttag: 'p-attachment',\n\tstyleUrl: 'attachment.component.css',\n\tshadow: true,\n})\nexport class Attachment {\n\t/**\n\t * Wether to enable the camera button on mobile\n\t */\n\t@Prop() enableCameraOnMobile = false;\n\n\t/**\n\t * The value of the attachment (usually the file name)\n\t */\n\t@Prop() value: string;\n\n\t/**\n\t * The fileID to use to track the file\n\t */\n\t@Prop() fileId: string;\n\n\t/**\n\t * The type of files to accept\n\t */\n\t@Prop() accept: string[] | string = null;\n\n\t/**\n\t * The label of the attachment\n\t */\n\t@Prop() label: string | HTMLSlotElement;\n\n\t/**\n\t * The helper of the attachment\n\t */\n\t@Prop() helper: string | HTMLSlotElement;\n\n\t/**\n\t * Wether the attachment is required\n\t */\n\t@Prop({ reflect: true }) required = true;\n\n\t/**\n\t * The variant of the attachment\n\t */\n\t@Prop() mode: 'read' | 'write' = 'read';\n\n\t/**\n\t * The placeholder of the attachment\n\t */\n\t@Prop() placeholder: string = 'Upload a file...';\n\n\t/**\n\t * The text for the camera tooltip\n\t */\n\t@Prop() cameraTooltip: string = 'Camera';\n\n\t/**\n\t * The text for the download tooltip\n\t */\n\t@Prop() downloadTooltip: string = 'Download';\n\n\t/**\n\t * The text for the upload tooltip\n\t */\n\t@Prop() uploadTooltip: string = 'Upload';\n\n\t/**\n\t * The text for the delete tooltip\n\t */\n\t@Prop() deleteTooltip: string = 'Delete';\n\n\t/**\n\t * Wether the attachment is loading\n\t */\n\t@Prop() loading = false;\n\n\t/**\n\t * The error to show\n\t */\n\t@Prop() error: string;\n\n\t/**\n\t * Event when upload is pressed\n\t */\n\t@Event({\n\t\tbubbles: false,\n\t})\n\tupload: EventEmitter<{\n\t\tfile: File;\n\t\tfileId: string;\n\t\tresult: string;\n\t}>;\n\n\t/**\n\t * Event when download is pressed\n\t */\n\t@Event({\n\t\tbubbles: false,\n\t})\n\tdownload: EventEmitter<void>;\n\n\t/**\n\t * Event when delete is pressed\n\t */\n\t@Event({\n\t\tbubbles: false,\n\t})\n\tdelete: EventEmitter<void>;\n\n\tprivate _fileRef: HTMLInputElement;\n\tprivate _cameraFileRef: HTMLInputElement;\n\n\trender() {\n\t\tlet prefix = (\n\t\t\t<p-icon\n\t\t\t\tclass='text-storm-300'\n\t\t\t\tvariant='attachment'\n\t\t\t/>\n\t\t);\n\n\t\tif (this.error) {\n\t\t\tprefix = (\n\t\t\t\t<p-icon\n\t\t\t\t\tvariant='warning'\n\t\t\t\t\tclass='text-negative-red-500'\n\t\t\t\t/>\n\t\t\t);\n\t\t}\n\n\t\t// const isMobileDevice = isMobile();\n\t\tconst isMobileDevice = isTablet();\n\n\t\tconst baseText =\n\t\t\t'min-w-0 flex-1 overflow-hidden text-ellipsis whitespace-nowrap text-sm';\n\t\treturn (\n\t\t\t<Fragment>\n\t\t\t\t<p-field-container\n\t\t\t\t\tvariant='write'\n\t\t\t\t\tlabel={this.label}\n\t\t\t\t\thelper={this.helper}\n\t\t\t\t\terror={this.error}\n\t\t\t\t\trequired={this.required}\n\t\t\t\t\tforceShowTooltip={!!this.error?.length}\n\t\t\t\t>\n\t\t\t\t\t<div\n\t\t\t\t\t\tslot='content'\n\t\t\t\t\t\tclass='flex w-full items-start gap-2'\n\t\t\t\t\t>\n\t\t\t\t\t\t<div\n\t\t\t\t\t\t\tclass={attachment({\n\t\t\t\t\t\t\t\tclick: this.mode === 'write' && !this.value?.length,\n\t\t\t\t\t\t\t\terror: !!this.error?.length,\n\t\t\t\t\t\t\t})}\n\t\t\t\t\t\t\tonClick={() => this._uploadClick()}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{prefix}\n\n\t\t\t\t\t\t\t<span class={cn(baseText, 'peer empty:hidden')}>\n\t\t\t\t\t\t\t\t{this.value}\n\t\t\t\t\t\t\t</span>\n\t\t\t\t\t\t\t<span class={cn(baseText, 'hidden peer-empty:block')}>\n\t\t\t\t\t\t\t\t{this.placeholder}\n\t\t\t\t\t\t\t</span>\n\t\t\t\t\t\t</div>\n\n\t\t\t\t\t\t<p-tooltip\n\t\t\t\t\t\t\tclass='w-8'\n\t\t\t\t\t\t\tcontent={\n\t\t\t\t\t\t\t\tthis.mode === 'read'\n\t\t\t\t\t\t\t\t\t? this.downloadTooltip\n\t\t\t\t\t\t\t\t\t: this.value?.length\n\t\t\t\t\t\t\t\t\t? this.deleteTooltip\n\t\t\t\t\t\t\t\t\t: this.uploadTooltip\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<p-button\n\t\t\t\t\t\t\t\tslot='trigger'\n\t\t\t\t\t\t\t\tvariant='secondary'\n\t\t\t\t\t\t\t\ticonOnly={true}\n\t\t\t\t\t\t\t\ticon={\n\t\t\t\t\t\t\t\t\tthis.mode === 'read'\n\t\t\t\t\t\t\t\t\t\t? 'download'\n\t\t\t\t\t\t\t\t\t\t: this.value?.length\n\t\t\t\t\t\t\t\t\t\t? 'trash'\n\t\t\t\t\t\t\t\t\t\t: 'upload'\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\tdisabled={this.loading}\n\t\t\t\t\t\t\t\tloading={this.loading}\n\t\t\t\t\t\t\t\tonOnClick={() =>\n\t\t\t\t\t\t\t\t\tthis.mode === 'write' && !this.value?.length\n\t\t\t\t\t\t\t\t\t\t? this._uploadClick()\n\t\t\t\t\t\t\t\t\t\t: (this.mode === 'read'\n\t\t\t\t\t\t\t\t\t\t\t\t? this.download\n\t\t\t\t\t\t\t\t\t\t\t\t: this.delete\n\t\t\t\t\t\t\t\t\t\t ).emit()\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t</p-tooltip>\n\n\t\t\t\t\t\t{this.enableCameraOnMobile &&\n\t\t\t\t\t\t\tthis.mode === 'write' &&\n\t\t\t\t\t\t\tisMobileDevice &&\n\t\t\t\t\t\t\t!this.value?.length && (\n\t\t\t\t\t\t\t\t<p-tooltip\n\t\t\t\t\t\t\t\t\tcontent={this.cameraTooltip}\n\t\t\t\t\t\t\t\t\tclass='w-8 desktop-xs:hidden'\n\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t<p-button\n\t\t\t\t\t\t\t\t\t\tslot='trigger'\n\t\t\t\t\t\t\t\t\t\tvariant='secondary'\n\t\t\t\t\t\t\t\t\t\ticonOnly={true}\n\t\t\t\t\t\t\t\t\t\ticon='camera'\n\t\t\t\t\t\t\t\t\t\tonOnClick={() => this._cameraClick()}\n\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t</p-tooltip>\n\t\t\t\t\t\t\t)}\n\t\t\t\t\t</div>\n\t\t\t\t</p-field-container>\n\n\t\t\t\t<input\n\t\t\t\t\tclass='hidden'\n\t\t\t\t\ttype='file'\n\t\t\t\t\taccept={\n\t\t\t\t\t\tArray.isArray(this.accept) ? this.accept?.join(',') : this.accept\n\t\t\t\t\t}\n\t\t\t\t\tref={el => (this._fileRef = el)}\n\t\t\t\t\tonChange={ev => this._onFileChange(ev)}\n\t\t\t\t/>\n\n\t\t\t\t<input\n\t\t\t\t\tclass='hidden'\n\t\t\t\t\ttype='file'\n\t\t\t\t\taccept='image/*'\n\t\t\t\t\tcapture='true'\n\t\t\t\t\tref={el => (this._cameraFileRef = el)}\n\t\t\t\t\tonChange={ev => this._onFileChange(ev)}\n\t\t\t\t/>\n\t\t\t</Fragment>\n\t\t);\n\t}\n\n\tprivate _uploadClick() {\n\t\tif (!this._fileRef || this.mode !== 'write' || this.value?.length) {\n\t\t\treturn;\n\t\t}\n\n\t\tthis._fileRef.click();\n\t}\n\n\tprivate _cameraClick() {\n\t\tif (!this.enableCameraOnMobile || isMobile()) {\n\t\t\treturn;\n\t\t}\n\n\t\tif (!this._cameraFileRef || this.mode !== 'write') {\n\t\t\treturn;\n\t\t}\n\n\t\tthis._cameraFileRef?.click();\n\t}\n\n\tprivate _onFileChange(ev: Event) {\n\t\tconst target = ev.target as HTMLInputElement;\n\t\tconst file = target.files?.[0];\n\n\t\tif (file) {\n\t\t\tthis.loading = true;\n\n\t\t\tconst reader = new FileReader();\n\t\t\treader.onload = (e: any) => this._onLoad(file, e?.currentTarget?.result);\n\t\t\treader.readAsDataURL(file);\n\t\t}\n\t}\n\n\tprivate _onLoad(file: File, result: string) {\n\t\tthis.upload.emit({\n\t\t\tfileId: this.fileId,\n\t\t\tresult,\n\t\t\tfile,\n\t\t});\n\n\t\tif (this._fileRef) {\n\t\t\tthis._fileRef.value = '';\n\t\t}\n\n\t\tif (this._cameraFileRef) {\n\t\t\tthis._cameraFileRef.value = '';\n\t\t}\n\n\t\tthis.loading = false;\n\t}\n}\n"],"names":[],"mappings":";;;;;;AAAA,MAAM,sBAAsB,GAAG,64FAA64F;;ACW56F,MAAM,UAAU,GAAG,GAAG,CACrB;IACC,8CAA8C;IAC9C,6BAA6B;IAC7B,qBAAqB;IACrB,6BAA6B;IAC7B,0CAA0C;CAC1C,EACD;AACC,IAAA,QAAQ,EAAE;AACT,QAAA,KAAK,EAAE;AACN,YAAA,KAAK,EAAE,IAAI;AACX,YAAA,IAAI,EAAE,gBAAgB;AACtB,SAAA;AACD,QAAA,KAAK,EAAE;AACN,YAAA,KAAK,EAAE,uCAAuC;AAC9C,YAAA,IAAI,EAAE,8DAA8D;AACpE,SAAA;AACD,KAAA;AACD,CAAA,CACD;MAOY,UAAU,GAAA,MAAA;;;;;;;AACtB;;AAEG;IACK,oBAAoB,GAAG,KAAK;AAEpC;;AAEG;AACK,IAAA,KAAK;AAEb;;AAEG;AACK,IAAA,MAAM;AAEd;;AAEG;IACK,MAAM,GAAsB,IAAI;AAExC;;AAEG;AACK,IAAA,KAAK;AAEb;;AAEG;AACK,IAAA,MAAM;AAEd;;AAEG;IACsB,QAAQ,GAAG,IAAI;AAExC;;AAEG;IACK,IAAI,GAAqB,MAAM;AAEvC;;AAEG;IACK,WAAW,GAAW,kBAAkB;AAEhD;;AAEG;IACK,aAAa,GAAW,QAAQ;AAExC;;AAEG;IACK,eAAe,GAAW,UAAU;AAE5C;;AAEG;IACK,aAAa,GAAW,QAAQ;AAExC;;AAEG;IACK,aAAa,GAAW,QAAQ;AAExC;;AAEG;IACK,OAAO,GAAG,KAAK;AAEvB;;AAEG;AACK,IAAA,KAAK;AAEb;;AAEG;AAIH,IAAA,MAAM;AAMN;;AAEG;AAIH,IAAA,QAAQ;AAER;;AAEG;AAIH,IAAA,MAAM;AAEE,IAAA,QAAQ;AACR,IAAA,cAAc;IAEtB,MAAM,GAAA;QACL,IAAI,MAAM,IACT,CAAA,CAAA,QAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EACC,KAAK,EAAC,gBAAgB,EACtB,OAAO,EAAC,YAAY,EAAA,CACnB,CACF;AAED,QAAA,IAAI,IAAI,CAAC,KAAK,EAAE;YACf,MAAM,IACL,CACC,CAAA,QAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,OAAO,EAAC,SAAS,EACjB,KAAK,EAAC,uBAAuB,EAC5B,CAAA,CACF;;;AAIF,QAAA,MAAM,cAAc,GAAG,QAAQ,EAAE;QAEjC,MAAM,QAAQ,GACb,yEAAyE;AAC1E,QAAA,QACC,EAAC,QAAQ,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,EACR,CAAA,CAAA,mBAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EACC,OAAO,EAAC,OAAO,EACf,KAAK,EAAE,IAAI,CAAC,KAAK,EACjB,MAAM,EAAE,IAAI,CAAC,MAAM,EACnB,KAAK,EAAE,IAAI,CAAC,KAAK,EACjB,QAAQ,EAAE,IAAI,CAAC,QAAQ,EACvB,gBAAgB,EAAE,CAAC,CAAC,IAAI,CAAC,KAAK,EAAE,MAAM,EAAA,EAEtC,CAAA,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EACC,IAAI,EAAC,SAAS,EACd,KAAK,EAAC,+BAA+B,EAAA,EAErC,CACC,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAE,UAAU,CAAC;AACjB,gBAAA,KAAK,EAAE,IAAI,CAAC,IAAI,KAAK,OAAO,IAAI,CAAC,IAAI,CAAC,KAAK,EAAE,MAAM;AACnD,gBAAA,KAAK,EAAE,CAAC,CAAC,IAAI,CAAC,KAAK,EAAE,MAAM;AAC3B,aAAA,CAAC,EACF,OAAO,EAAE,MAAM,IAAI,CAAC,YAAY,EAAE,EAAA,EAEjC,MAAM,EAEP,CAAA,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAM,KAAK,EAAE,EAAE,CAAC,QAAQ,EAAE,mBAAmB,CAAC,EAC5C,EAAA,IAAI,CAAC,KAAK,CACL,EACP,CAAA,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAM,KAAK,EAAE,EAAE,CAAC,QAAQ,EAAE,yBAAyB,CAAC,EAClD,EAAA,IAAI,CAAC,WAAW,CACX,CACF,EAEN,CACC,CAAA,WAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAC,KAAK,EACX,OAAO,EACN,IAAI,CAAC,IAAI,KAAK;kBACX,IAAI,CAAC;AACP,kBAAE,IAAI,CAAC,KAAK,EAAE;sBACZ,IAAI,CAAC;AACP,sBAAE,IAAI,CAAC,aAAa,EAAA,EAGtB,CAAA,CAAA,UAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EACC,IAAI,EAAC,SAAS,EACd,OAAO,EAAC,WAAW,EACnB,QAAQ,EAAE,IAAI,EACd,IAAI,EACH,IAAI,CAAC,IAAI,KAAK;AACb,kBAAE;AACF,kBAAE,IAAI,CAAC,KAAK,EAAE;AACd,sBAAE;AACF,sBAAE,QAAQ,EAEZ,QAAQ,EAAE,IAAI,CAAC,OAAO,EACtB,OAAO,EAAE,IAAI,CAAC,OAAO,EACrB,SAAS,EAAE,MACV,IAAI,CAAC,IAAI,KAAK,OAAO,IAAI,CAAC,IAAI,CAAC,KAAK,EAAE;AACrC,kBAAE,IAAI,CAAC,YAAY;AACnB,kBAAE,CAAC,IAAI,CAAC,IAAI,KAAK;sBACb,IAAI,CAAC;AACP,sBAAE,IAAI,CAAC,MAAM,EACX,IAAI,EAAE,EAAA,CAEX,CACS,EAEX,IAAI,CAAC,oBAAoB;YACzB,IAAI,CAAC,IAAI,KAAK,OAAO;YACrB,cAAc;YACd,CAAC,IAAI,CAAC,KAAK,EAAE,MAAM,KAClB,CAAA,CAAA,WAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EACC,OAAO,EAAE,IAAI,CAAC,aAAa,EAC3B,KAAK,EAAC,uBAAuB,EAAA,EAE7B,CAAA,CAAA,UAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EACC,IAAI,EAAC,SAAS,EACd,OAAO,EAAC,WAAW,EACnB,QAAQ,EAAE,IAAI,EACd,IAAI,EAAC,QAAQ,EACb,SAAS,EAAE,MAAM,IAAI,CAAC,YAAY,EAAE,EAAA,CACnC,CACS,CACZ,CACG,CACa,EAEpB,CAAA,CAAA,OAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EACC,KAAK,EAAC,QAAQ,EACd,IAAI,EAAC,MAAM,EACX,MAAM,EACL,KAAK,CAAC,OAAO,CAAC,IAAI,CAAC,MAAM,CAAC,GAAG,IAAI,CAAC,MAAM,EAAE,IAAI,CAAC,GAAG,CAAC,GAAG,IAAI,CAAC,MAAM,EAElE,GAAG,EAAE,EAAE,KAAK,IAAI,CAAC,QAAQ,GAAG,EAAE,CAAC,EAC/B,QAAQ,EAAE,EAAE,IAAI,IAAI,CAAC,aAAa,CAAC,EAAE,CAAC,EACrC,CAAA,EAEF,CACC,CAAA,OAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAC,QAAQ,EACd,IAAI,EAAC,MAAM,EACX,MAAM,EAAC,SAAS,EAChB,OAAO,EAAC,MAAM,EACd,GAAG,EAAE,EAAE,KAAK,IAAI,CAAC,cAAc,GAAG,EAAE,CAAC,EACrC,QAAQ,EAAE,EAAE,IAAI,IAAI,CAAC,aAAa,CAAC,EAAE,CAAC,EAAA,CACrC,CACQ;;IAIL,YAAY,GAAA;AACnB,QAAA,IAAI,CAAC,IAAI,CAAC,QAAQ,IAAI,IAAI,CAAC,IAAI,KAAK,OAAO,IAAI,IAAI,CAAC,KAAK,EAAE,MAAM,EAAE;YAClE;;AAGD,QAAA,IAAI,CAAC,QAAQ,CAAC,KAAK,EAAE;;IAGd,YAAY,GAAA;QACnB,IAAI,CAAC,IAAI,CAAC,oBAAoB,IAAI,QAAQ,EAAE,EAAE;YAC7C;;QAGD,IAAI,CAAC,IAAI,CAAC,cAAc,IAAI,IAAI,CAAC,IAAI,KAAK,OAAO,EAAE;YAClD;;AAGD,QAAA,IAAI,CAAC,cAAc,EAAE,KAAK,EAAE;;AAGrB,IAAA,aAAa,CAAC,EAAS,EAAA;AAC9B,QAAA,MAAM,MAAM,GAAG,EAAE,CAAC,MAA0B;QAC5C,MAAM,IAAI,GAAG,MAAM,CAAC,KAAK,GAAG,CAAC,CAAC;QAE9B,IAAI,IAAI,EAAE;AACT,YAAA,IAAI,CAAC,OAAO,GAAG,IAAI;AAEnB,YAAA,MAAM,MAAM,GAAG,IAAI,UAAU,EAAE;YAC/B,MAAM,CAAC,MAAM,GAAG,CAAC,CAAM,KAAK,IAAI,CAAC,OAAO,CAAC,IAAI,EAAE,CAAC,EAAE,aAAa,EAAE,MAAM,CAAC;AACxE,YAAA,MAAM,CAAC,aAAa,CAAC,IAAI,CAAC;;;IAIpB,OAAO,CAAC,IAAU,EAAE,MAAc,EAAA;AACzC,QAAA,IAAI,CAAC,MAAM,CAAC,IAAI,CAAC;YAChB,MAAM,EAAE,IAAI,CAAC,MAAM;YACnB,MAAM;YACN,IAAI;AACJ,SAAA,CAAC;AAEF,QAAA,IAAI,IAAI,CAAC,QAAQ,EAAE;AAClB,YAAA,IAAI,CAAC,QAAQ,CAAC,KAAK,GAAG,EAAE;;AAGzB,QAAA,IAAI,IAAI,CAAC,cAAc,EAAE;AACxB,YAAA,IAAI,CAAC,cAAc,CAAC,KAAK,GAAG,EAAE;;AAG/B,QAAA,IAAI,CAAC,OAAO,GAAG,KAAK;;;;;;;"}
|
package/dist/index.html
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
<!doctype html><html dir="ltr" lang="en"><head> <meta charset="utf-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=5.0"> <title>Stencil Component Starter</title> <link rel="modulepreload" href="/build/p-
|
|
1
|
+
<!doctype html><html dir="ltr" lang="en"><head> <meta charset="utf-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=5.0"> <title>Stencil Component Starter</title> <link rel="modulepreload" href="/build/p-4df6d390.js"><link rel="modulepreload" href="/build/p-BIwGgs9f.js"><link rel="modulepreload" href="/build/p-C1iNEsnH.js"><link rel="modulepreload" href="/build/p-C5CTp9IA.js"><link rel="modulepreload" href="/build/p-CBWjHURv.js"><link rel="modulepreload" href="/build/p-CT54OXR2.js"><link rel="modulepreload" href="/build/p-ChV9xqsO.js"><link rel="modulepreload" href="/build/p-Cm2Hxgjz.js"><link rel="modulepreload" href="/build/p-Dpmiv2da.js"><script type="module" src="/build/p-4df6d390.js" data-stencil data-resources-url="/build/" data-stencil-namespace="paperless"></script> <script nomodule="" src="/build/paperless.js" data-stencil></script> <link rel="stylesheet" href="/build/p-1536d957.css"> </head> <body> <p-button>Test</p-button> <script data-build="2025-09-04T08:18:26">
|
|
2
2
|
if ('serviceWorker' in navigator && location.protocol !== 'file:') {
|
|
3
3
|
window.addEventListener('load', function() {
|
|
4
4
|
navigator.serviceWorker.register('/sw.js')
|
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
import{r as t,c as e,h as r,F as a}from"./p-Dpmiv2da.js";import{c as i}from"./p-CBWjHURv.js";import{h as o,f as d}from"./p-B3sNjfzc.js";import{c as s}from"./p-CT54OXR2.js";import"./p-ChV9xqsO.js";const n=".block{display:block!important}*{box-sizing:border-box}:host{display:block;width:100%}.static{position:static!important}.flex{display:flex!important}.hidden{display:none!important}.h-8{height:2rem!important}.w-8{width:2rem!important}.w-full{width:100%!important}.min-w-0{min-width:0!important}.flex-1{flex:1 1 0%!important}.cursor-pointer{cursor:pointer!important}.items-start{align-items:flex-start!important}.items-center{align-items:center!important}.justify-start{justify-content:flex-start!important}.gap-2{gap:.5rem!important}.overflow-hidden{overflow:hidden!important}.text-ellipsis{text-overflow:ellipsis!important}.whitespace-nowrap{white-space:nowrap!important}.rounded-lg{border-radius:.5rem!important}.border{border-width:1px!important}.border-solid{border-style:solid!important}.border-negative-red-500{--tw-border-opacity:1!important;border-color:rgb(230 30 30/var(--tw-border-opacity,1))!important}.border-storm-100{--tw-border-opacity:1!important;border-color:rgb(209 210 212/var(--tw-border-opacity,1))!important}.bg-white-600{--tw-bg-opacity:1!important;background-color:rgb(250 250 250/var(--tw-bg-opacity,1))!important}.px-2{padding-left:.5rem!important;padding-right:.5rem!important}.text-sm{font-size:.875rem!important;line-height:1.25rem!important}.text-negative-red-500{--tw-text-opacity:1!important;color:rgb(230 30 30/var(--tw-text-opacity,1))!important}.text-storm-200{--tw-text-opacity:1!important;color:rgb(163 165 169/var(--tw-text-opacity,1))!important}.text-storm-300{--tw-text-opacity:1!important;color:rgb(116 120 127/var(--tw-text-opacity,1))!important}.empty\\:hidden:empty{display:none!important}.peer:empty~.peer-empty\\:block{display:block!important}@media (min-width:64rem){.desktop-xs\\:hidden{display:none!important}}.dark\\:border-negative-red-alternative:where(:host([data-theme=dark]),:host([data-theme=dark]) *){--tw-border-opacity:1!important;border-color:rgb(255 92 92/var(--tw-border-opacity,1))!important}.dark\\:border-white\\/15:where(:host([data-theme=dark]),:host([data-theme=dark]) *){border-color:hsla(0,0%,100%,.15)!important}.dark\\:bg-white\\/15:where(:host([data-theme=dark]),:host([data-theme=dark]) *){background-color:hsla(0,0%,100%,.15)!important}.dark\\:text-hurricane-200:where(:host([data-theme=dark]),:host([data-theme=dark]) *){--tw-text-opacity:1!important;color:rgb(163 165 169/var(--tw-text-opacity,1))!important}.dark\\:border-negative-red-alternative:where([data-theme=dark],[data-theme=dark] *){--tw-border-opacity:1!important;border-color:rgb(255 92 92/var(--tw-border-opacity,1))!important}.dark\\:border-white\\/15:where([data-theme=dark],[data-theme=dark] *){border-color:hsla(0,0%,100%,.15)!important}.dark\\:bg-white\\/15:where([data-theme=dark],[data-theme=dark] *){background-color:hsla(0,0%,100%,.15)!important}.dark\\:text-hurricane-200:where([data-theme=dark],[data-theme=dark] *){--tw-text-opacity:1!important;color:rgb(163 165 169/var(--tw-text-opacity,1))!important}";const p=i(["flex flex-1 items-center justify-start gap-2","h-8 min-w-0 px-2 rounded-lg","border border-solid","bg-white-600 text-storm-200","dark:bg-white/15 dark:text-hurricane-200"],{variants:{click:{false:null,true:"cursor-pointer"},error:{false:"border-storm-100 dark:border-white/15",true:"border-negative-red-500 dark:border-negative-red-alternative"}}});const h=class{constructor(r){t(this,r);this.upload=e(this,"upload",3);this.download=e(this,"download",3);this.delete=e(this,"delete",3)}enableCameraOnMobile=false;value;fileId;accept=null;label;helper;required=true;mode="read";placeholder="Upload a file...";cameraTooltip="Camera";downloadTooltip="Download";uploadTooltip="Upload";deleteTooltip="Delete";loading=false;error;upload;download;delete;_fileRef;_cameraFileRef;render(){let t=r("p-icon",{key:"e3041d87911b3ef89be9ae6dd57d9ad51b4b6ba3",class:"text-storm-300",variant:"attachment"});if(this.error){t=r("p-icon",{key:"8cd0ea7fd1848a8f9d3ee96d42b4ecdb5f4ed27b",variant:"warning",class:"text-negative-red-500"})}const e=o();const i="min-w-0 flex-1 overflow-hidden text-ellipsis whitespace-nowrap text-sm";return r(a,{key:"0e75af5dc601f3cb7b24c197c532685154958e06"},r("p-field-container",{key:"0bf08bb7ce1380635a9fc8b574ec86946e085ffe",variant:"write",label:this.label,helper:this.helper,error:this.error,required:this.required,forceShowTooltip:!!this.error?.length},r("div",{key:"5e5d80909c96afb1aabc9509888979fa662eaaff",slot:"content",class:"flex w-full items-start gap-2"},r("div",{key:"afee7e83fe90d843de8bf509ed3d7d451483795f",class:p({click:this.mode==="write"&&!this.value?.length,error:!!this.error?.length}),onClick:()=>this._uploadClick()},t,r("span",{key:"c59a8e66fde71d2b8423cb5f6385ebb1ee6f51d6",class:s(i,"peer empty:hidden")},this.value),r("span",{key:"b133def98ae61ff290371aa76918c38d209098bd",class:s(i,"hidden peer-empty:block")},this.placeholder)),r("p-tooltip",{key:"70dd1bf027ba620e5653e0f6fecd2d2e9f8d5047",class:"w-8",content:this.mode==="read"?this.downloadTooltip:this.value?.length?this.deleteTooltip:this.uploadTooltip},r("p-button",{key:"bad75a34fff38946e6361c2b1e467e7fc1331cdf",slot:"trigger",variant:"secondary",iconOnly:true,icon:this.mode==="read"?"download":this.value?.length?"trash":"upload",disabled:this.loading,loading:this.loading,onOnClick:()=>this.mode==="write"&&!this.value?.length?this._uploadClick():(this.mode==="read"?this.download:this.delete).emit()})),this.enableCameraOnMobile&&this.mode==="write"&&e&&!this.value?.length&&r("p-tooltip",{key:"efdfd38ae5ca2f9e63af50d3a82339cbd0af6ef9",content:this.cameraTooltip,class:"w-8 desktop-xs:hidden"},r("p-button",{key:"38a9dc23149a96fd7626236b9f1b1b8794bc0c84",slot:"trigger",variant:"secondary",iconOnly:true,icon:"camera",onOnClick:()=>this._cameraClick()})))),r("input",{key:"a4e9ec4655dcdd0778a6e84638ef8fb6011ce4a8",class:"hidden",type:"file",accept:Array.isArray(this.accept)?this.accept?.join(","):this.accept,ref:t=>this._fileRef=t,onChange:t=>this._onFileChange(t)}),r("input",{key:"3f5212b6d4602d39075254405b8177672a97acb7",class:"hidden",type:"file",accept:"image/*",capture:"true",ref:t=>this._cameraFileRef=t,onChange:t=>this._onFileChange(t)}))}_uploadClick(){if(!this._fileRef||this.mode!=="write"||this.value?.length){return}this._fileRef.click()}_cameraClick(){if(!this.enableCameraOnMobile||d()){return}if(!this._cameraFileRef||this.mode!=="write"){return}this._cameraFileRef?.click()}_onFileChange(t){const e=t.target;const r=e.files?.[0];if(r){this.loading=true;const t=new FileReader;t.onload=t=>this._onLoad(r,t?.currentTarget?.result);t.readAsDataURL(r)}}_onLoad(t,e){this.upload.emit({fileId:this.fileId,result:e,file:t});if(this._fileRef){this._fileRef.value=""}if(this._cameraFileRef){this._cameraFileRef.value=""}this.loading=false}};h.style=n;export{h as p_attachment};
|
|
2
|
+
//# sourceMappingURL=p-0f2d54d2.entry.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":["attachmentComponentCss","attachment","cva","variants","click","false","true","error","Attachment","enableCameraOnMobile","value","fileId","accept","label","helper","required","mode","placeholder","cameraTooltip","downloadTooltip","uploadTooltip","deleteTooltip","loading","upload","download","delete","_fileRef","_cameraFileRef","render","prefix","h","key","class","variant","this","isMobileDevice","isTablet","baseText","Fragment","forceShowTooltip","length","slot","onClick","_uploadClick","cn","content","iconOnly","icon","disabled","onOnClick","emit","_cameraClick","type","Array","isArray","join","ref","el","onChange","ev","_onFileChange","capture","isMobile","target","file","files","reader","FileReader","onload","e","_onLoad","currentTarget","result","readAsDataURL"],"sources":["src/components/molecules/attachment/attachment.component.css?tag=p-attachment&encapsulation=shadow","src/components/molecules/attachment/attachment.component.tsx"],"sourcesContent":[":host {\n\t@apply block w-full;\n}\n","import {\n\tComponent,\n\tEvent,\n\tEventEmitter,\n\tFragment,\n\th,\n\tProp,\n} from '@stencil/core';\nimport { cn, isMobile, isTablet } from '../../../utils';\nimport { cva } from 'class-variance-authority';\n\nconst attachment = cva(\n\t[\n\t\t'flex flex-1 items-center justify-start gap-2',\n\t\t'h-8 min-w-0 px-2 rounded-lg',\n\t\t'border border-solid',\n\t\t'bg-white-600 text-storm-200',\n\t\t'dark:bg-white/15 dark:text-hurricane-200',\n\t],\n\t{\n\t\tvariants: {\n\t\t\tclick: {\n\t\t\t\tfalse: null,\n\t\t\t\ttrue: 'cursor-pointer',\n\t\t\t},\n\t\t\terror: {\n\t\t\t\tfalse: 'border-storm-100 dark:border-white/15',\n\t\t\t\ttrue: 'border-negative-red-500 dark:border-negative-red-alternative',\n\t\t\t},\n\t\t},\n\t}\n);\n\n@Component({\n\ttag: 'p-attachment',\n\tstyleUrl: 'attachment.component.css',\n\tshadow: true,\n})\nexport class Attachment {\n\t/**\n\t * Wether to enable the camera button on mobile\n\t */\n\t@Prop() enableCameraOnMobile = false;\n\n\t/**\n\t * The value of the attachment (usually the file name)\n\t */\n\t@Prop() value: string;\n\n\t/**\n\t * The fileID to use to track the file\n\t */\n\t@Prop() fileId: string;\n\n\t/**\n\t * The type of files to accept\n\t */\n\t@Prop() accept: string[] | string = null;\n\n\t/**\n\t * The label of the attachment\n\t */\n\t@Prop() label: string | HTMLSlotElement;\n\n\t/**\n\t * The helper of the attachment\n\t */\n\t@Prop() helper: string | HTMLSlotElement;\n\n\t/**\n\t * Wether the attachment is required\n\t */\n\t@Prop({ reflect: true }) required = true;\n\n\t/**\n\t * The variant of the attachment\n\t */\n\t@Prop() mode: 'read' | 'write' = 'read';\n\n\t/**\n\t * The placeholder of the attachment\n\t */\n\t@Prop() placeholder: string = 'Upload a file...';\n\n\t/**\n\t * The text for the camera tooltip\n\t */\n\t@Prop() cameraTooltip: string = 'Camera';\n\n\t/**\n\t * The text for the download tooltip\n\t */\n\t@Prop() downloadTooltip: string = 'Download';\n\n\t/**\n\t * The text for the upload tooltip\n\t */\n\t@Prop() uploadTooltip: string = 'Upload';\n\n\t/**\n\t * The text for the delete tooltip\n\t */\n\t@Prop() deleteTooltip: string = 'Delete';\n\n\t/**\n\t * Wether the attachment is loading\n\t */\n\t@Prop() loading = false;\n\n\t/**\n\t * The error to show\n\t */\n\t@Prop() error: string;\n\n\t/**\n\t * Event when upload is pressed\n\t */\n\t@Event({\n\t\tbubbles: false,\n\t})\n\tupload: EventEmitter<{\n\t\tfile: File;\n\t\tfileId: string;\n\t\tresult: string;\n\t}>;\n\n\t/**\n\t * Event when download is pressed\n\t */\n\t@Event({\n\t\tbubbles: false,\n\t})\n\tdownload: EventEmitter<void>;\n\n\t/**\n\t * Event when delete is pressed\n\t */\n\t@Event({\n\t\tbubbles: false,\n\t})\n\tdelete: EventEmitter<void>;\n\n\tprivate _fileRef: HTMLInputElement;\n\tprivate _cameraFileRef: HTMLInputElement;\n\n\trender() {\n\t\tlet prefix = (\n\t\t\t<p-icon\n\t\t\t\tclass='text-storm-300'\n\t\t\t\tvariant='attachment'\n\t\t\t/>\n\t\t);\n\n\t\tif (this.error) {\n\t\t\tprefix = (\n\t\t\t\t<p-icon\n\t\t\t\t\tvariant='warning'\n\t\t\t\t\tclass='text-negative-red-500'\n\t\t\t\t/>\n\t\t\t);\n\t\t}\n\n\t\t// const isMobileDevice = isMobile();\n\t\tconst isMobileDevice = isTablet();\n\n\t\tconst baseText =\n\t\t\t'min-w-0 flex-1 overflow-hidden text-ellipsis whitespace-nowrap text-sm';\n\t\treturn (\n\t\t\t<Fragment>\n\t\t\t\t<p-field-container\n\t\t\t\t\tvariant='write'\n\t\t\t\t\tlabel={this.label}\n\t\t\t\t\thelper={this.helper}\n\t\t\t\t\terror={this.error}\n\t\t\t\t\trequired={this.required}\n\t\t\t\t\tforceShowTooltip={!!this.error?.length}\n\t\t\t\t>\n\t\t\t\t\t<div\n\t\t\t\t\t\tslot='content'\n\t\t\t\t\t\tclass='flex w-full items-start gap-2'\n\t\t\t\t\t>\n\t\t\t\t\t\t<div\n\t\t\t\t\t\t\tclass={attachment({\n\t\t\t\t\t\t\t\tclick: this.mode === 'write' && !this.value?.length,\n\t\t\t\t\t\t\t\terror: !!this.error?.length,\n\t\t\t\t\t\t\t})}\n\t\t\t\t\t\t\tonClick={() => this._uploadClick()}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{prefix}\n\n\t\t\t\t\t\t\t<span class={cn(baseText, 'peer empty:hidden')}>\n\t\t\t\t\t\t\t\t{this.value}\n\t\t\t\t\t\t\t</span>\n\t\t\t\t\t\t\t<span class={cn(baseText, 'hidden peer-empty:block')}>\n\t\t\t\t\t\t\t\t{this.placeholder}\n\t\t\t\t\t\t\t</span>\n\t\t\t\t\t\t</div>\n\n\t\t\t\t\t\t<p-tooltip\n\t\t\t\t\t\t\tclass='w-8'\n\t\t\t\t\t\t\tcontent={\n\t\t\t\t\t\t\t\tthis.mode === 'read'\n\t\t\t\t\t\t\t\t\t? this.downloadTooltip\n\t\t\t\t\t\t\t\t\t: this.value?.length\n\t\t\t\t\t\t\t\t\t? this.deleteTooltip\n\t\t\t\t\t\t\t\t\t: this.uploadTooltip\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<p-button\n\t\t\t\t\t\t\t\tslot='trigger'\n\t\t\t\t\t\t\t\tvariant='secondary'\n\t\t\t\t\t\t\t\ticonOnly={true}\n\t\t\t\t\t\t\t\ticon={\n\t\t\t\t\t\t\t\t\tthis.mode === 'read'\n\t\t\t\t\t\t\t\t\t\t? 'download'\n\t\t\t\t\t\t\t\t\t\t: this.value?.length\n\t\t\t\t\t\t\t\t\t\t? 'trash'\n\t\t\t\t\t\t\t\t\t\t: 'upload'\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\tdisabled={this.loading}\n\t\t\t\t\t\t\t\tloading={this.loading}\n\t\t\t\t\t\t\t\tonOnClick={() =>\n\t\t\t\t\t\t\t\t\tthis.mode === 'write' && !this.value?.length\n\t\t\t\t\t\t\t\t\t\t? this._uploadClick()\n\t\t\t\t\t\t\t\t\t\t: (this.mode === 'read'\n\t\t\t\t\t\t\t\t\t\t\t\t? this.download\n\t\t\t\t\t\t\t\t\t\t\t\t: this.delete\n\t\t\t\t\t\t\t\t\t\t ).emit()\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t</p-tooltip>\n\n\t\t\t\t\t\t{this.enableCameraOnMobile &&\n\t\t\t\t\t\t\tthis.mode === 'write' &&\n\t\t\t\t\t\t\tisMobileDevice &&\n\t\t\t\t\t\t\t!this.value?.length && (\n\t\t\t\t\t\t\t\t<p-tooltip\n\t\t\t\t\t\t\t\t\tcontent={this.cameraTooltip}\n\t\t\t\t\t\t\t\t\tclass='w-8 desktop-xs:hidden'\n\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t<p-button\n\t\t\t\t\t\t\t\t\t\tslot='trigger'\n\t\t\t\t\t\t\t\t\t\tvariant='secondary'\n\t\t\t\t\t\t\t\t\t\ticonOnly={true}\n\t\t\t\t\t\t\t\t\t\ticon='camera'\n\t\t\t\t\t\t\t\t\t\tonOnClick={() => this._cameraClick()}\n\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t</p-tooltip>\n\t\t\t\t\t\t\t)}\n\t\t\t\t\t</div>\n\t\t\t\t</p-field-container>\n\n\t\t\t\t<input\n\t\t\t\t\tclass='hidden'\n\t\t\t\t\ttype='file'\n\t\t\t\t\taccept={\n\t\t\t\t\t\tArray.isArray(this.accept) ? this.accept?.join(',') : this.accept\n\t\t\t\t\t}\n\t\t\t\t\tref={el => (this._fileRef = el)}\n\t\t\t\t\tonChange={ev => this._onFileChange(ev)}\n\t\t\t\t/>\n\n\t\t\t\t<input\n\t\t\t\t\tclass='hidden'\n\t\t\t\t\ttype='file'\n\t\t\t\t\taccept='image/*'\n\t\t\t\t\tcapture='true'\n\t\t\t\t\tref={el => (this._cameraFileRef = el)}\n\t\t\t\t\tonChange={ev => this._onFileChange(ev)}\n\t\t\t\t/>\n\t\t\t</Fragment>\n\t\t);\n\t}\n\n\tprivate _uploadClick() {\n\t\tif (!this._fileRef || this.mode !== 'write' || this.value?.length) {\n\t\t\treturn;\n\t\t}\n\n\t\tthis._fileRef.click();\n\t}\n\n\tprivate _cameraClick() {\n\t\tif (!this.enableCameraOnMobile || isMobile()) {\n\t\t\treturn;\n\t\t}\n\n\t\tif (!this._cameraFileRef || this.mode !== 'write') {\n\t\t\treturn;\n\t\t}\n\n\t\tthis._cameraFileRef?.click();\n\t}\n\n\tprivate _onFileChange(ev: Event) {\n\t\tconst target = ev.target as HTMLInputElement;\n\t\tconst file = target.files?.[0];\n\n\t\tif (file) {\n\t\t\tthis.loading = true;\n\n\t\t\tconst reader = new FileReader();\n\t\t\treader.onload = (e: any) => this._onLoad(file, e?.currentTarget?.result);\n\t\t\treader.readAsDataURL(file);\n\t\t}\n\t}\n\n\tprivate _onLoad(file: File, result: string) {\n\t\tthis.upload.emit({\n\t\t\tfileId: this.fileId,\n\t\t\tresult,\n\t\t\tfile,\n\t\t});\n\n\t\tif (this._fileRef) {\n\t\t\tthis._fileRef.value = '';\n\t\t}\n\n\t\tif (this._cameraFileRef) {\n\t\t\tthis._cameraFileRef.value = '';\n\t\t}\n\n\t\tthis.loading = false;\n\t}\n}\n"],"mappings":"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","ignoreList":[]}
|