@paperless/core 2.9.0 → 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 +19 -0
- package/dist/{paperless/p-e5934335.entry.js → build/p-08b625cd.entry.js} +2 -2
- package/dist/build/p-08b625cd.entry.js.map +1 -0
- package/dist/build/p-0f2d54d2.entry.js +2 -0
- package/dist/build/p-0f2d54d2.entry.js.map +1 -0
- package/dist/build/{p-6f12eb4b.js → p-4df6d390.js} +1 -1
- package/dist/build/p-attachment.entry.esm.js.map +1 -1
- package/dist/build/p-empty-state.p-floating-menu-container.p-table-cell.p-table-container.p-table-footer.p-table-header.p-table-row.p-table-row-actions-container.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/cjs/p-empty-state.p-floating-menu-container.p-table-cell.p-table-container.p-table-footer.p-table-header.p-table-row.p-table-row-actions-container.entry.cjs.js.map +1 -1
- package/dist/cjs/p-empty-state_8.cjs.entry.js +4 -5
- package/dist/cjs/p-empty-state_8.cjs.entry.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/collection/components/molecules/table/header/table-header.component.js +4 -5
- package/dist/collection/components/molecules/table/header/table-header.component.js.map +1 -1
- package/dist/components/{p--8Wk5rpW.js → p-CbfQ0Wci.js} +6 -7
- package/dist/components/{p--8Wk5rpW.js.map → p-CbfQ0Wci.js.map} +1 -1
- package/dist/components/p-attachment.js +12 -10
- package/dist/components/p-attachment.js.map +1 -1
- package/dist/components/p-table-header.js +1 -1
- package/dist/components/p-table.js +1 -1
- package/dist/esm/p-attachment.entry.js +12 -10
- package/dist/esm/p-attachment.entry.js.map +1 -1
- package/dist/esm/p-empty-state.p-floating-menu-container.p-table-cell.p-table-container.p-table-footer.p-table-header.p-table-row.p-table-row-actions-container.entry.js.map +1 -1
- package/dist/esm/p-empty-state_8.entry.js +4 -5
- package/dist/esm/p-empty-state_8.entry.js.map +1 -1
- package/dist/index.html +1 -1
- package/dist/{build/p-e5934335.entry.js → paperless/p-08b625cd.entry.js} +2 -2
- package/dist/paperless/p-08b625cd.entry.js.map +1 -0
- 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/p-empty-state.p-floating-menu-container.p-table-cell.p-table-container.p-table-footer.p-table-header.p-table-row.p-table-row-actions-container.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/build/p-e5934335.entry.js.map +0 -1
- package/dist/paperless/p-6175408c.entry.js +0 -2
- package/dist/paperless/p-6175408c.entry.js.map +0 -1
- package/dist/paperless/p-e5934335.entry.js.map +0 -1
|
@@ -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"]}
|
|
@@ -124,7 +124,6 @@ export class TableHeader {
|
|
|
124
124
|
.subscribe(value => this.queryChange.emit(value));
|
|
125
125
|
}
|
|
126
126
|
render() {
|
|
127
|
-
console.log(this.quickFilters);
|
|
128
127
|
const quickFilters = typeof this.quickFilters === 'string'
|
|
129
128
|
? JSON.parse(this.quickFilters)
|
|
130
129
|
: this.quickFilters;
|
|
@@ -132,15 +131,15 @@ export class TableHeader {
|
|
|
132
131
|
const mobileTotal = (this.selectedFiltersAmount || 0) + (activeQuickFilter?.default ? 0 : 1);
|
|
133
132
|
const hasCustomFilterSlot = !!this._el.querySelector(':scope > [slot="custom-filter"]');
|
|
134
133
|
const hasCustomActionsSlot = !!this._el.querySelector(':scope > [slot="custom-actions"]');
|
|
135
|
-
return (h(ThemedHost, { key: '
|
|
136
|
-
(hasCustomFilterSlot || quickFilters.length > 0) && (h("div", { key: '
|
|
134
|
+
return (h(ThemedHost, { key: 'b853afc278bcdc5615fe52928e49a08216f807e0' }, h("div", { key: 'cc1fb1ffe7376263d17fa0948160fa73b1d49f68', class: header() }, this.loading && (h("p-loader", { key: '156ab2edb7bb6e9ffe697ab547ec24c287d1ab4c', variant: 'ghost', class: 'hidden h-8 w-3/4 rounded desktop-xs:flex' })), !this.loading &&
|
|
135
|
+
(hasCustomFilterSlot || quickFilters.length > 0) && (h("div", { key: 'f96b1d33ff36ddbb19fb4198554f74265923a1b9', class: 'flex flex-col justify-start gap-4 justify-self-start desktop-xs:flex-row' }, hasCustomFilterSlot && h("slot", { key: '5d401f179a913db5511a67d8ad1968df432ab722', name: 'custom-filter' }), quickFilters.length > 0 && (h("p-segment-container", { key: '37c7315ced7f7be6e39f59a8334eae08260b772e', class: 'hidden desktop-xs:flex' }, quickFilters.map(item => (h("p-segment-item", { active: item.identifier === this.activeQuickFilterIdentifier, onClick: () => this.quickFilter.emit(item) }, typeof item.text === 'string'
|
|
137
136
|
? item.text
|
|
138
|
-
: item.text(), ' ', item?.count >= 0 ? `(${item.count})` : ''))))))), h("div", { key: '
|
|
137
|
+
: item.text(), ' ', item?.count >= 0 ? `(${item.count})` : ''))))))), h("div", { key: '0199cc10cc0d7d992e8bc08097f7d0462db1e8f5', class: 'flex flex-col justify-end gap-2 desktop-xs:ml-auto desktop-xs:flex-row desktop-xs:items-center' }, this.enableSearch && (h("p-field", { key: 'e4daaddd95257ba880a0803242c492aa6888bc66', icon: 'search', class: 'desktop-xs:max-w-60', placeholder: 'Zoeken...', value: this.query, onValueChange: ev => this._queryObserver.next(ev.detail) })), h("div", { key: '89e51f87a89f629c77b22c5fd0714662d452a5c6', class: 'flex items-center gap-2' }, this.enableFilter && (h("p-button", { key: '933b0ff84cb98c91d3bdb9bfa761bac3096b6d82', icon: 'filter', variant: 'secondary', class: `w-full ${this.enableFilterDesktop
|
|
139
138
|
? 'desktop-xs:w-auto'
|
|
140
139
|
: 'desktop-xs:hidden'}`, onClick: () => this.filter.emit() }, this.filterButtonTemplate
|
|
141
140
|
? this.filterButtonTemplate()
|
|
142
141
|
: this._defaultFilterButtonTemplate(), this.selectedFiltersAmount &&
|
|
143
|
-
this._getLabel(this.selectedFiltersAmount), mobileTotal > 0 && this._getLabel(mobileTotal, 'mobile'))), !this.loading && this.enableExport && this.enableFilter && (h("p-divider", { key: '
|
|
142
|
+
this._getLabel(this.selectedFiltersAmount), mobileTotal > 0 && this._getLabel(mobileTotal, 'mobile'))), !this.loading && this.enableExport && this.enableFilter && (h("p-divider", { key: 'f1432c63cb0b9758338dcc5eba1446cbce6e6494', variant: 'vertical', class: 'hidden h-4 tablet:flex dark:text-white/15' })), !this.loading && this.enableExport && (h("p-button", { key: '9599f305f6e200246a889177e4c3b3fd7a99d493', variant: 'secondary', icon: 'upload', class: 'desktop-xs:auto w-full', onClick: () => this.export.emit() }, formatTranslation(this._locales.export)))), this.enableAction && this._buttonTemplate(), hasCustomActionsSlot && h("slot", { key: '8afdb5ab4234df9aa5574fa8fb78d5fc51e14c2f', name: 'custom-actions' })), this.enableAction && this.canUseAction && (h("div", { key: '126a654009f3837c7aa9bc028a4e616c54c4f399', class: 'border-t-mystic-dark fixed bottom-0 left-0 block w-full border border-solid border-transparent bg-white p-4 desktop-xs:hidden' }, this._buttonTemplate(true))))));
|
|
144
143
|
}
|
|
145
144
|
async _setLocales() {
|
|
146
145
|
this._locales = await getLocaleComponentStrings(this._el);
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"table-header.component.js","sourceRoot":"","sources":["../../../../../src/components/molecules/table/header/table-header.component.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n\tComponent,\n\tElement,\n\tEvent,\n\tEventEmitter,\n\th,\n\tListen,\n\tProp,\n\tState,\n} from '@stencil/core';\nimport { cva } from 'class-variance-authority';\nimport { debounceTime, distinctUntilChanged, Subject } from 'rxjs';\nimport { QuickFilter } from '../../../../types/table';\nimport {\n\tformatTranslation,\n\tgetLocaleComponentStrings,\n} from '../../../../utils/localization';\nimport { IconVariant } from '../../../atoms/icon/icon.component';\nimport { ThemedHost } from '../../../../internal/themed-host.component';\n\nexport type templateFunc = () => string;\nexport type buttonTemplateFunc = (amount: number) => string;\n\nconst header = cva([\n\t'flex flex-col gap-2 z-[1]',\n\t'w-full',\n\t'px-4 tablet:px-0',\n\n\t'desktop-xs:flex-row',\n]);\n\n@Component({\n\ttag: 'p-table-header',\n\tstyleUrl: 'table-header.component.css',\n\tshadow: true,\n})\nexport class TableHeader {\n\tprivate _defaultFilterButtonTemplate: templateFunc = () =>\n\t\tformatTranslation(this._locales.filter);\n\tprivate _defaultActionButtonTemplate: buttonTemplateFunc = (amount: number) =>\n\t\tthis.actionText\n\t\t\t? this.actionText\n\t\t\t: formatTranslation(\n\t\t\t\t\tamount === 0\n\t\t\t\t\t\t? this._locales.edit\n\t\t\t\t\t\t: amount === 1\n\t\t\t\t\t\t? this._locales.edit_single\n\t\t\t\t\t\t: this._locales.edit_plural,\n\t\t\t\t\t{ amount }\n\t\t\t );\n\n\t/**\n\t * Quick filters to show\n\t */\n\t@Prop() quickFilters: QuickFilter[] | string = [];\n\n\t/**\n\t * Active quick filter identifier\n\t */\n\t@Prop() activeQuickFilterIdentifier: string;\n\n\t/**\n\t * Wether we want to show loading state\n\t */\n\t@Prop() loading: boolean = false;\n\n\t/**\n\t * Wether to show the search input\n\t */\n\t@Prop() enableSearch: boolean = true;\n\n\t/**\n\t * The amount of items that are selected\n\t */\n\t@Prop() itemsSelectedAmount: number = 0;\n\n\t/**\n\t * The query to show in the search bar\n\t */\n\t@Prop({ mutable: true }) query: string;\n\n\t/**\n\t * Wether to show the filter button\n\t */\n\t@Prop() enableFilter: boolean = true;\n\n\t/**\n\t * Wether to show the export button\n\t */\n\t@Prop() enableExport: boolean = true;\n\n\t/**\n\t * Wether to show the filter button on desktop\n\t */\n\t@Prop() enableFilterDesktop: boolean = true;\n\n\t/**\n\t * The amount of filters being selected\n\t */\n\t@Prop() selectedFiltersAmount: number;\n\n\t/**\n\t * The template for the filter button text\n\t */\n\t@Prop() filterButtonTemplate: templateFunc =\n\t\tthis._defaultFilterButtonTemplate;\n\n\t/**\n\t * Wether to show the action button\n\t */\n\t@Prop() enableAction: boolean = true;\n\n\t/**\n\t * Wether the action button is loading\n\t */\n\t@Prop() actionLoading: boolean = false;\n\n\t/**\n\t * The action button icon\n\t */\n\t@Prop() actionIcon: IconVariant = 'pencil';\n\n\t/**\n\t * The action button text if changed\n\t */\n\t@Prop() actionText: string;\n\n\t/**\n\t * Wether to enable the action button\n\t */\n\t@Prop({ mutable: true }) canUseAction: boolean = false;\n\n\t/**\n\t * The template for the action button text\n\t */\n\t@Prop() actionButtonTemplate: buttonTemplateFunc =\n\t\tthis._defaultActionButtonTemplate;\n\n\t/**\n\t * Event when one of the quick filters is clicked\n\t */\n\t@Event({\n\t\tbubbles: false,\n\t})\n\tquickFilter: EventEmitter<QuickFilter>;\n\n\t/**\n\t * Event when the query changes\n\t */\n\t@Event({\n\t\tbubbles: false,\n\t})\n\tqueryChange: EventEmitter<string>;\n\n\t/**\n\t * Event when the filter button is clicked\n\t */\n\t@Event({\n\t\tbubbles: false,\n\t})\n\tfilter: EventEmitter<null>;\n\n\t/**\n\t * Event when the action button is clicked\n\t */\n\t@Event({\n\t\tbubbles: false,\n\t})\n\taction: EventEmitter<null>;\n\n\t/**\n\t * Event whenever the export button is clicked\n\t */\n\t@Event({\n\t\tbubbles: false,\n\t})\n\texport: EventEmitter<number>;\n\n\t/**\n\t * The host element\n\t */\n\t@Element() private _el: HTMLElement;\n\n\t/**\n\t * Locales used for this component\n\t */\n\t@State() private _locales: any = {};\n\n\tprivate _queryObserver = new Subject<string>();\n\n\tcomponentWillLoad() {\n\t\tthis._setLocales();\n\t}\n\n\tcomponentDidLoad() {\n\t\tthis._queryObserver\n\t\t\t.pipe(debounceTime(300), distinctUntilChanged())\n\t\t\t.subscribe(value => this.queryChange.emit(value));\n\t}\n\n\trender() {\n\t\tconsole.log(this.quickFilters);\n\t\tconst quickFilters =\n\t\t\ttypeof this.quickFilters === 'string'\n\t\t\t\t? JSON.parse(this.quickFilters)\n\t\t\t\t: this.quickFilters;\n\n\t\tconst activeQuickFilter = quickFilters.find(\n\t\t\tf => f.identifier === this.activeQuickFilterIdentifier\n\t\t);\n\t\tconst mobileTotal =\n\t\t\t(this.selectedFiltersAmount || 0) + (activeQuickFilter?.default ? 0 : 1);\n\n\t\tconst hasCustomFilterSlot = !!this._el.querySelector(\n\t\t\t':scope > [slot=\"custom-filter\"]'\n\t\t);\n\n\t\tconst hasCustomActionsSlot = !!this._el.querySelector(\n\t\t\t':scope > [slot=\"custom-actions\"]'\n\t\t);\n\n\t\treturn (\n\t\t\t<ThemedHost>\n\t\t\t\t<div class={header()}>\n\t\t\t\t\t{this.loading && (\n\t\t\t\t\t\t<p-loader\n\t\t\t\t\t\t\tvariant='ghost'\n\t\t\t\t\t\t\tclass='hidden h-8 w-3/4 rounded desktop-xs:flex'\n\t\t\t\t\t\t></p-loader>\n\t\t\t\t\t)}\n\n\t\t\t\t\t{!this.loading &&\n\t\t\t\t\t\t(hasCustomFilterSlot || quickFilters.length > 0) && (\n\t\t\t\t\t\t\t<div class='flex flex-col justify-start gap-4 justify-self-start desktop-xs:flex-row'>\n\t\t\t\t\t\t\t\t{hasCustomFilterSlot && <slot name='custom-filter' />}\n\n\t\t\t\t\t\t\t\t{quickFilters.length > 0 && (\n\t\t\t\t\t\t\t\t\t<p-segment-container class='hidden desktop-xs:flex'>\n\t\t\t\t\t\t\t\t\t\t{quickFilters.map(item => (\n\t\t\t\t\t\t\t\t\t\t\t<p-segment-item\n\t\t\t\t\t\t\t\t\t\t\t\tactive={\n\t\t\t\t\t\t\t\t\t\t\t\t\titem.identifier === this.activeQuickFilterIdentifier\n\t\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t\t\tonClick={() => this.quickFilter.emit(item)}\n\t\t\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t\t\t{typeof item.text === 'string'\n\t\t\t\t\t\t\t\t\t\t\t\t\t? item.text\n\t\t\t\t\t\t\t\t\t\t\t\t\t: item.text()}{' '}\n\t\t\t\t\t\t\t\t\t\t\t\t{item?.count >= 0 ? `(${item.count})` : ''}\n\t\t\t\t\t\t\t\t\t\t\t</p-segment-item>\n\t\t\t\t\t\t\t\t\t\t))}\n\t\t\t\t\t\t\t\t\t</p-segment-container>\n\t\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t)}\n\n\t\t\t\t\t<div class='flex flex-col justify-end gap-2 desktop-xs:ml-auto desktop-xs:flex-row desktop-xs:items-center'>\n\t\t\t\t\t\t{this.enableSearch && (\n\t\t\t\t\t\t\t<p-field\n\t\t\t\t\t\t\t\ticon='search'\n\t\t\t\t\t\t\t\tclass='desktop-xs:max-w-60'\n\t\t\t\t\t\t\t\tplaceholder='Zoeken...'\n\t\t\t\t\t\t\t\tvalue={this.query}\n\t\t\t\t\t\t\t\tonValueChange={ev =>\n\t\t\t\t\t\t\t\t\tthis._queryObserver.next(ev.detail as string)\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t)}\n\n\t\t\t\t\t\t<div class='flex items-center gap-2'>\n\t\t\t\t\t\t\t{this.enableFilter && (\n\t\t\t\t\t\t\t\t<p-button\n\t\t\t\t\t\t\t\t\ticon='filter'\n\t\t\t\t\t\t\t\t\tvariant='secondary'\n\t\t\t\t\t\t\t\t\tclass={`w-full ${\n\t\t\t\t\t\t\t\t\t\tthis.enableFilterDesktop\n\t\t\t\t\t\t\t\t\t\t\t? 'desktop-xs:w-auto'\n\t\t\t\t\t\t\t\t\t\t\t: 'desktop-xs:hidden'\n\t\t\t\t\t\t\t\t\t}`}\n\t\t\t\t\t\t\t\t\tonClick={() => this.filter.emit()}\n\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t{this.filterButtonTemplate\n\t\t\t\t\t\t\t\t\t\t? this.filterButtonTemplate()\n\t\t\t\t\t\t\t\t\t\t: this._defaultFilterButtonTemplate()}\n\t\t\t\t\t\t\t\t\t{this.selectedFiltersAmount &&\n\t\t\t\t\t\t\t\t\t\tthis._getLabel(this.selectedFiltersAmount)}\n\t\t\t\t\t\t\t\t\t{mobileTotal > 0 && this._getLabel(mobileTotal, 'mobile')}\n\t\t\t\t\t\t\t\t</p-button>\n\t\t\t\t\t\t\t)}\n\n\t\t\t\t\t\t\t{!this.loading && this.enableExport && this.enableFilter && (\n\t\t\t\t\t\t\t\t<p-divider\n\t\t\t\t\t\t\t\t\tvariant='vertical'\n\t\t\t\t\t\t\t\t\tclass='hidden h-4 tablet:flex dark:text-white/15'\n\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t)}\n\n\t\t\t\t\t\t\t{!this.loading && this.enableExport && (\n\t\t\t\t\t\t\t\t<p-button\n\t\t\t\t\t\t\t\t\tvariant='secondary'\n\t\t\t\t\t\t\t\t\ticon='upload'\n\t\t\t\t\t\t\t\t\tclass='desktop-xs:auto w-full'\n\t\t\t\t\t\t\t\t\tonClick={() => this.export.emit()}\n\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t{formatTranslation(this._locales.export)}\n\t\t\t\t\t\t\t\t</p-button>\n\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t</div>\n\n\t\t\t\t\t\t{this.enableAction && this._buttonTemplate()}\n\n\t\t\t\t\t\t{hasCustomActionsSlot && <slot name='custom-actions' />}\n\t\t\t\t\t</div>\n\n\t\t\t\t\t{this.enableAction && this.canUseAction && (\n\t\t\t\t\t\t<div class='border-t-mystic-dark fixed bottom-0 left-0 block w-full border border-solid border-transparent bg-white p-4 desktop-xs:hidden'>\n\t\t\t\t\t\t\t{this._buttonTemplate(true)}\n\t\t\t\t\t\t</div>\n\t\t\t\t\t)}\n\t\t\t\t</div>\n\t\t\t</ThemedHost>\n\t\t);\n\t}\n\n\t@Listen('localeChanged', { target: 'body' })\n\tprivate async _setLocales(): Promise<void> {\n\t\tthis._locales = await getLocaleComponentStrings(this._el);\n\t}\n\n\tprivate _buttonTemplate(mobile = false) {\n\t\treturn (\n\t\t\t<p-button\n\t\t\t\tclass={mobile ? 'w-full' : 'hidden desktop-xs:flex'}\n\t\t\t\ticon={this.actionIcon}\n\t\t\t\tdisabled={!this.canUseAction}\n\t\t\t\tonClick={() => this.action.emit()}\n\t\t\t\tloading={this.actionLoading}\n\t\t\t>\n\t\t\t\t{this.actionButtonTemplate\n\t\t\t\t\t? this.actionButtonTemplate(mobile ? this.itemsSelectedAmount : 0)\n\t\t\t\t\t: this._defaultActionButtonTemplate(\n\t\t\t\t\t\t\tmobile ? this.itemsSelectedAmount : 0\n\t\t\t\t\t )}\n\t\t\t</p-button>\n\t\t);\n\t}\n\n\tprivate _getLabel(amount, variant: 'mobile' | 'default' = 'default') {\n\t\treturn (\n\t\t\t<p-badge\n\t\t\t\tclass={`ml-1 ${\n\t\t\t\t\tvariant === 'default'\n\t\t\t\t\t\t? 'hidden desktop-xs:flex'\n\t\t\t\t\t\t: 'flex desktop-xs:hidden'\n\t\t\t\t}`}\n\t\t\t>\n\t\t\t\t{amount}\n\t\t\t</p-badge>\n\t\t);\n\t}\n}\n"]}
|
|
1
|
+
{"version":3,"file":"table-header.component.js","sourceRoot":"","sources":["../../../../../src/components/molecules/table/header/table-header.component.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n\tComponent,\n\tElement,\n\tEvent,\n\tEventEmitter,\n\th,\n\tListen,\n\tProp,\n\tState,\n} from '@stencil/core';\nimport { cva } from 'class-variance-authority';\nimport { debounceTime, distinctUntilChanged, Subject } from 'rxjs';\nimport { QuickFilter } from '../../../../types/table';\nimport {\n\tformatTranslation,\n\tgetLocaleComponentStrings,\n} from '../../../../utils/localization';\nimport { IconVariant } from '../../../atoms/icon/icon.component';\nimport { ThemedHost } from '../../../../internal/themed-host.component';\n\nexport type templateFunc = () => string;\nexport type buttonTemplateFunc = (amount: number) => string;\n\nconst header = cva([\n\t'flex flex-col gap-2 z-[1]',\n\t'w-full',\n\t'px-4 tablet:px-0',\n\n\t'desktop-xs:flex-row',\n]);\n\n@Component({\n\ttag: 'p-table-header',\n\tstyleUrl: 'table-header.component.css',\n\tshadow: true,\n})\nexport class TableHeader {\n\tprivate _defaultFilterButtonTemplate: templateFunc = () =>\n\t\tformatTranslation(this._locales.filter);\n\tprivate _defaultActionButtonTemplate: buttonTemplateFunc = (amount: number) =>\n\t\tthis.actionText\n\t\t\t? this.actionText\n\t\t\t: formatTranslation(\n\t\t\t\t\tamount === 0\n\t\t\t\t\t\t? this._locales.edit\n\t\t\t\t\t\t: amount === 1\n\t\t\t\t\t\t? this._locales.edit_single\n\t\t\t\t\t\t: this._locales.edit_plural,\n\t\t\t\t\t{ amount }\n\t\t\t );\n\n\t/**\n\t * Quick filters to show\n\t */\n\t@Prop() quickFilters: QuickFilter[] | string = [];\n\n\t/**\n\t * Active quick filter identifier\n\t */\n\t@Prop() activeQuickFilterIdentifier: string;\n\n\t/**\n\t * Wether we want to show loading state\n\t */\n\t@Prop() loading: boolean = false;\n\n\t/**\n\t * Wether to show the search input\n\t */\n\t@Prop() enableSearch: boolean = true;\n\n\t/**\n\t * The amount of items that are selected\n\t */\n\t@Prop() itemsSelectedAmount: number = 0;\n\n\t/**\n\t * The query to show in the search bar\n\t */\n\t@Prop({ mutable: true }) query: string;\n\n\t/**\n\t * Wether to show the filter button\n\t */\n\t@Prop() enableFilter: boolean = true;\n\n\t/**\n\t * Wether to show the export button\n\t */\n\t@Prop() enableExport: boolean = true;\n\n\t/**\n\t * Wether to show the filter button on desktop\n\t */\n\t@Prop() enableFilterDesktop: boolean = true;\n\n\t/**\n\t * The amount of filters being selected\n\t */\n\t@Prop() selectedFiltersAmount: number;\n\n\t/**\n\t * The template for the filter button text\n\t */\n\t@Prop() filterButtonTemplate: templateFunc =\n\t\tthis._defaultFilterButtonTemplate;\n\n\t/**\n\t * Wether to show the action button\n\t */\n\t@Prop() enableAction: boolean = true;\n\n\t/**\n\t * Wether the action button is loading\n\t */\n\t@Prop() actionLoading: boolean = false;\n\n\t/**\n\t * The action button icon\n\t */\n\t@Prop() actionIcon: IconVariant = 'pencil';\n\n\t/**\n\t * The action button text if changed\n\t */\n\t@Prop() actionText: string;\n\n\t/**\n\t * Wether to enable the action button\n\t */\n\t@Prop({ mutable: true }) canUseAction: boolean = false;\n\n\t/**\n\t * The template for the action button text\n\t */\n\t@Prop() actionButtonTemplate: buttonTemplateFunc =\n\t\tthis._defaultActionButtonTemplate;\n\n\t/**\n\t * Event when one of the quick filters is clicked\n\t */\n\t@Event({\n\t\tbubbles: false,\n\t})\n\tquickFilter: EventEmitter<QuickFilter>;\n\n\t/**\n\t * Event when the query changes\n\t */\n\t@Event({\n\t\tbubbles: false,\n\t})\n\tqueryChange: EventEmitter<string>;\n\n\t/**\n\t * Event when the filter button is clicked\n\t */\n\t@Event({\n\t\tbubbles: false,\n\t})\n\tfilter: EventEmitter<null>;\n\n\t/**\n\t * Event when the action button is clicked\n\t */\n\t@Event({\n\t\tbubbles: false,\n\t})\n\taction: EventEmitter<null>;\n\n\t/**\n\t * Event whenever the export button is clicked\n\t */\n\t@Event({\n\t\tbubbles: false,\n\t})\n\texport: EventEmitter<number>;\n\n\t/**\n\t * The host element\n\t */\n\t@Element() private _el: HTMLElement;\n\n\t/**\n\t * Locales used for this component\n\t */\n\t@State() private _locales: any = {};\n\n\tprivate _queryObserver = new Subject<string>();\n\n\tcomponentWillLoad() {\n\t\tthis._setLocales();\n\t}\n\n\tcomponentDidLoad() {\n\t\tthis._queryObserver\n\t\t\t.pipe(debounceTime(300), distinctUntilChanged())\n\t\t\t.subscribe(value => this.queryChange.emit(value));\n\t}\n\n\trender() {\n\t\tconst quickFilters =\n\t\t\ttypeof this.quickFilters === 'string'\n\t\t\t\t? JSON.parse(this.quickFilters)\n\t\t\t\t: this.quickFilters;\n\n\t\tconst activeQuickFilter = quickFilters.find(\n\t\t\tf => f.identifier === this.activeQuickFilterIdentifier\n\t\t);\n\t\tconst mobileTotal =\n\t\t\t(this.selectedFiltersAmount || 0) + (activeQuickFilter?.default ? 0 : 1);\n\n\t\tconst hasCustomFilterSlot = !!this._el.querySelector(\n\t\t\t':scope > [slot=\"custom-filter\"]'\n\t\t);\n\n\t\tconst hasCustomActionsSlot = !!this._el.querySelector(\n\t\t\t':scope > [slot=\"custom-actions\"]'\n\t\t);\n\n\t\treturn (\n\t\t\t<ThemedHost>\n\t\t\t\t<div class={header()}>\n\t\t\t\t\t{this.loading && (\n\t\t\t\t\t\t<p-loader\n\t\t\t\t\t\t\tvariant='ghost'\n\t\t\t\t\t\t\tclass='hidden h-8 w-3/4 rounded desktop-xs:flex'\n\t\t\t\t\t\t></p-loader>\n\t\t\t\t\t)}\n\n\t\t\t\t\t{!this.loading &&\n\t\t\t\t\t\t(hasCustomFilterSlot || quickFilters.length > 0) && (\n\t\t\t\t\t\t\t<div class='flex flex-col justify-start gap-4 justify-self-start desktop-xs:flex-row'>\n\t\t\t\t\t\t\t\t{hasCustomFilterSlot && <slot name='custom-filter' />}\n\n\t\t\t\t\t\t\t\t{quickFilters.length > 0 && (\n\t\t\t\t\t\t\t\t\t<p-segment-container class='hidden desktop-xs:flex'>\n\t\t\t\t\t\t\t\t\t\t{quickFilters.map(item => (\n\t\t\t\t\t\t\t\t\t\t\t<p-segment-item\n\t\t\t\t\t\t\t\t\t\t\t\tactive={\n\t\t\t\t\t\t\t\t\t\t\t\t\titem.identifier === this.activeQuickFilterIdentifier\n\t\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t\t\tonClick={() => this.quickFilter.emit(item)}\n\t\t\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t\t\t{typeof item.text === 'string'\n\t\t\t\t\t\t\t\t\t\t\t\t\t? item.text\n\t\t\t\t\t\t\t\t\t\t\t\t\t: item.text()}{' '}\n\t\t\t\t\t\t\t\t\t\t\t\t{item?.count >= 0 ? `(${item.count})` : ''}\n\t\t\t\t\t\t\t\t\t\t\t</p-segment-item>\n\t\t\t\t\t\t\t\t\t\t))}\n\t\t\t\t\t\t\t\t\t</p-segment-container>\n\t\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t)}\n\n\t\t\t\t\t<div class='flex flex-col justify-end gap-2 desktop-xs:ml-auto desktop-xs:flex-row desktop-xs:items-center'>\n\t\t\t\t\t\t{this.enableSearch && (\n\t\t\t\t\t\t\t<p-field\n\t\t\t\t\t\t\t\ticon='search'\n\t\t\t\t\t\t\t\tclass='desktop-xs:max-w-60'\n\t\t\t\t\t\t\t\tplaceholder='Zoeken...'\n\t\t\t\t\t\t\t\tvalue={this.query}\n\t\t\t\t\t\t\t\tonValueChange={ev =>\n\t\t\t\t\t\t\t\t\tthis._queryObserver.next(ev.detail as string)\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t)}\n\n\t\t\t\t\t\t<div class='flex items-center gap-2'>\n\t\t\t\t\t\t\t{this.enableFilter && (\n\t\t\t\t\t\t\t\t<p-button\n\t\t\t\t\t\t\t\t\ticon='filter'\n\t\t\t\t\t\t\t\t\tvariant='secondary'\n\t\t\t\t\t\t\t\t\tclass={`w-full ${\n\t\t\t\t\t\t\t\t\t\tthis.enableFilterDesktop\n\t\t\t\t\t\t\t\t\t\t\t? 'desktop-xs:w-auto'\n\t\t\t\t\t\t\t\t\t\t\t: 'desktop-xs:hidden'\n\t\t\t\t\t\t\t\t\t}`}\n\t\t\t\t\t\t\t\t\tonClick={() => this.filter.emit()}\n\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t{this.filterButtonTemplate\n\t\t\t\t\t\t\t\t\t\t? this.filterButtonTemplate()\n\t\t\t\t\t\t\t\t\t\t: this._defaultFilterButtonTemplate()}\n\t\t\t\t\t\t\t\t\t{this.selectedFiltersAmount &&\n\t\t\t\t\t\t\t\t\t\tthis._getLabel(this.selectedFiltersAmount)}\n\t\t\t\t\t\t\t\t\t{mobileTotal > 0 && this._getLabel(mobileTotal, 'mobile')}\n\t\t\t\t\t\t\t\t</p-button>\n\t\t\t\t\t\t\t)}\n\n\t\t\t\t\t\t\t{!this.loading && this.enableExport && this.enableFilter && (\n\t\t\t\t\t\t\t\t<p-divider\n\t\t\t\t\t\t\t\t\tvariant='vertical'\n\t\t\t\t\t\t\t\t\tclass='hidden h-4 tablet:flex dark:text-white/15'\n\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t)}\n\n\t\t\t\t\t\t\t{!this.loading && this.enableExport && (\n\t\t\t\t\t\t\t\t<p-button\n\t\t\t\t\t\t\t\t\tvariant='secondary'\n\t\t\t\t\t\t\t\t\ticon='upload'\n\t\t\t\t\t\t\t\t\tclass='desktop-xs:auto w-full'\n\t\t\t\t\t\t\t\t\tonClick={() => this.export.emit()}\n\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t{formatTranslation(this._locales.export)}\n\t\t\t\t\t\t\t\t</p-button>\n\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t</div>\n\n\t\t\t\t\t\t{this.enableAction && this._buttonTemplate()}\n\n\t\t\t\t\t\t{hasCustomActionsSlot && <slot name='custom-actions' />}\n\t\t\t\t\t</div>\n\n\t\t\t\t\t{this.enableAction && this.canUseAction && (\n\t\t\t\t\t\t<div class='border-t-mystic-dark fixed bottom-0 left-0 block w-full border border-solid border-transparent bg-white p-4 desktop-xs:hidden'>\n\t\t\t\t\t\t\t{this._buttonTemplate(true)}\n\t\t\t\t\t\t</div>\n\t\t\t\t\t)}\n\t\t\t\t</div>\n\t\t\t</ThemedHost>\n\t\t);\n\t}\n\n\t@Listen('localeChanged', { target: 'body' })\n\tprivate async _setLocales(): Promise<void> {\n\t\tthis._locales = await getLocaleComponentStrings(this._el);\n\t}\n\n\tprivate _buttonTemplate(mobile = false) {\n\t\treturn (\n\t\t\t<p-button\n\t\t\t\tclass={mobile ? 'w-full' : 'hidden desktop-xs:flex'}\n\t\t\t\ticon={this.actionIcon}\n\t\t\t\tdisabled={!this.canUseAction}\n\t\t\t\tonClick={() => this.action.emit()}\n\t\t\t\tloading={this.actionLoading}\n\t\t\t>\n\t\t\t\t{this.actionButtonTemplate\n\t\t\t\t\t? this.actionButtonTemplate(mobile ? this.itemsSelectedAmount : 0)\n\t\t\t\t\t: this._defaultActionButtonTemplate(\n\t\t\t\t\t\t\tmobile ? this.itemsSelectedAmount : 0\n\t\t\t\t\t )}\n\t\t\t</p-button>\n\t\t);\n\t}\n\n\tprivate _getLabel(amount, variant: 'mobile' | 'default' = 'default') {\n\t\treturn (\n\t\t\t<p-badge\n\t\t\t\tclass={`ml-1 ${\n\t\t\t\t\tvariant === 'default'\n\t\t\t\t\t\t? 'hidden desktop-xs:flex'\n\t\t\t\t\t\t: 'flex desktop-xs:hidden'\n\t\t\t\t}`}\n\t\t\t>\n\t\t\t\t{amount}\n\t\t\t</p-badge>\n\t\t);\n\t}\n}\n"]}
|
|
@@ -9602,7 +9602,6 @@ const TableHeader = /*@__PURE__*/ proxyCustomElement(class TableHeader extends H
|
|
|
9602
9602
|
.subscribe(value => this.queryChange.emit(value));
|
|
9603
9603
|
}
|
|
9604
9604
|
render() {
|
|
9605
|
-
console.log(this.quickFilters);
|
|
9606
9605
|
const quickFilters = typeof this.quickFilters === 'string'
|
|
9607
9606
|
? JSON.parse(this.quickFilters)
|
|
9608
9607
|
: this.quickFilters;
|
|
@@ -9610,15 +9609,15 @@ const TableHeader = /*@__PURE__*/ proxyCustomElement(class TableHeader extends H
|
|
|
9610
9609
|
const mobileTotal = (this.selectedFiltersAmount || 0) + (activeQuickFilter?.default ? 0 : 1);
|
|
9611
9610
|
const hasCustomFilterSlot = !!this._el.querySelector(':scope > [slot="custom-filter"]');
|
|
9612
9611
|
const hasCustomActionsSlot = !!this._el.querySelector(':scope > [slot="custom-actions"]');
|
|
9613
|
-
return (h(ThemedHost, { key: '
|
|
9614
|
-
(hasCustomFilterSlot || quickFilters.length > 0) && (h("div", { key: '
|
|
9612
|
+
return (h(ThemedHost, { key: 'b853afc278bcdc5615fe52928e49a08216f807e0' }, h("div", { key: 'cc1fb1ffe7376263d17fa0948160fa73b1d49f68', class: header() }, this.loading && (h("p-loader", { key: '156ab2edb7bb6e9ffe697ab547ec24c287d1ab4c', variant: 'ghost', class: 'hidden h-8 w-3/4 rounded desktop-xs:flex' })), !this.loading &&
|
|
9613
|
+
(hasCustomFilterSlot || quickFilters.length > 0) && (h("div", { key: 'f96b1d33ff36ddbb19fb4198554f74265923a1b9', class: 'flex flex-col justify-start gap-4 justify-self-start desktop-xs:flex-row' }, hasCustomFilterSlot && h("slot", { key: '5d401f179a913db5511a67d8ad1968df432ab722', name: 'custom-filter' }), quickFilters.length > 0 && (h("p-segment-container", { key: '37c7315ced7f7be6e39f59a8334eae08260b772e', class: 'hidden desktop-xs:flex' }, quickFilters.map(item => (h("p-segment-item", { active: item.identifier === this.activeQuickFilterIdentifier, onClick: () => this.quickFilter.emit(item) }, typeof item.text === 'string'
|
|
9615
9614
|
? item.text
|
|
9616
|
-
: item.text(), ' ', item?.count >= 0 ? `(${item.count})` : ''))))))), h("div", { key: '
|
|
9615
|
+
: item.text(), ' ', item?.count >= 0 ? `(${item.count})` : ''))))))), h("div", { key: '0199cc10cc0d7d992e8bc08097f7d0462db1e8f5', class: 'flex flex-col justify-end gap-2 desktop-xs:ml-auto desktop-xs:flex-row desktop-xs:items-center' }, this.enableSearch && (h("p-field", { key: 'e4daaddd95257ba880a0803242c492aa6888bc66', icon: 'search', class: 'desktop-xs:max-w-60', placeholder: 'Zoeken...', value: this.query, onValueChange: ev => this._queryObserver.next(ev.detail) })), h("div", { key: '89e51f87a89f629c77b22c5fd0714662d452a5c6', class: 'flex items-center gap-2' }, this.enableFilter && (h("p-button", { key: '933b0ff84cb98c91d3bdb9bfa761bac3096b6d82', icon: 'filter', variant: 'secondary', class: `w-full ${this.enableFilterDesktop
|
|
9617
9616
|
? 'desktop-xs:w-auto'
|
|
9618
9617
|
: 'desktop-xs:hidden'}`, onClick: () => this.filter.emit() }, this.filterButtonTemplate
|
|
9619
9618
|
? this.filterButtonTemplate()
|
|
9620
9619
|
: this._defaultFilterButtonTemplate(), this.selectedFiltersAmount &&
|
|
9621
|
-
this._getLabel(this.selectedFiltersAmount), mobileTotal > 0 && this._getLabel(mobileTotal, 'mobile'))), !this.loading && this.enableExport && this.enableFilter && (h("p-divider", { key: '
|
|
9620
|
+
this._getLabel(this.selectedFiltersAmount), mobileTotal > 0 && this._getLabel(mobileTotal, 'mobile'))), !this.loading && this.enableExport && this.enableFilter && (h("p-divider", { key: 'f1432c63cb0b9758338dcc5eba1446cbce6e6494', variant: 'vertical', class: 'hidden h-4 tablet:flex dark:text-white/15' })), !this.loading && this.enableExport && (h("p-button", { key: '9599f305f6e200246a889177e4c3b3fd7a99d493', variant: 'secondary', icon: 'upload', class: 'desktop-xs:auto w-full', onClick: () => this.export.emit() }, formatTranslation(this._locales.export)))), this.enableAction && this._buttonTemplate(), hasCustomActionsSlot && h("slot", { key: '8afdb5ab4234df9aa5574fa8fb78d5fc51e14c2f', name: 'custom-actions' })), this.enableAction && this.canUseAction && (h("div", { key: '126a654009f3837c7aa9bc028a4e616c54c4f399', class: 'border-t-mystic-dark fixed bottom-0 left-0 block w-full border border-solid border-transparent bg-white p-4 desktop-xs:hidden' }, this._buttonTemplate(true))))));
|
|
9622
9621
|
}
|
|
9623
9622
|
async _setLocales() {
|
|
9624
9623
|
this._locales = await getLocaleComponentStrings(this._el);
|
|
@@ -9725,6 +9724,6 @@ function defineCustomElement() {
|
|
|
9725
9724
|
defineCustomElement();
|
|
9726
9725
|
|
|
9727
9726
|
export { TableHeader as T, defineCustomElement as d };
|
|
9728
|
-
//# sourceMappingURL=p
|
|
9727
|
+
//# sourceMappingURL=p-CbfQ0Wci.js.map
|
|
9729
9728
|
|
|
9730
|
-
//# sourceMappingURL=p
|
|
9729
|
+
//# sourceMappingURL=p-CbfQ0Wci.js.map
|