globuswebcomponents 1.7.4 → 1.7.5
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/dist/cjs/gb-avatar_24.cjs.entry.js +4 -2
- package/dist/cjs/gb-avatar_24.cjs.entry.js.map +1 -1
- package/dist/cjs/globuscomponents.cjs.js +1 -1
- package/dist/cjs/loader.cjs.js +1 -1
- package/dist/cjs/reusableModels-_LRAKnsh.js.map +1 -1
- package/dist/collection/components/gb-badge/gb-badge.js +9 -3
- package/dist/collection/components/gb-badge/gb-badge.js.map +1 -1
- package/dist/collection/components/gb-detail-cell/gb-detail-cell.js +68 -1
- package/dist/collection/components/gb-detail-cell/gb-detail-cell.js.map +1 -1
- package/dist/collection/models/reusableModels.js.map +1 -1
- package/dist/components/gb-badge.js +1 -1
- package/dist/components/gb-detail-cell.js +7 -2
- package/dist/components/gb-detail-cell.js.map +1 -1
- package/dist/components/gb-filter-button.js +1 -1
- package/dist/components/gb-horizontal-tabs.js +2 -2
- package/dist/components/gb-sidebar.js +2 -2
- package/dist/components/gb-simple-side-bar-item.js +1 -1
- package/dist/components/gb-tab-button-base.js +1 -1
- package/dist/components/gb-top-bar-sidemenu.js +3 -3
- package/dist/components/gb-vertical-tabs.js +1 -1
- package/dist/components/{p-5RpAZ8Y6.js → p-B3vwqSMg.js} +3 -3
- package/dist/components/{p-5RpAZ8Y6.js.map → p-B3vwqSMg.js.map} +1 -1
- package/dist/components/{p-BSVEFKEf.js → p-BK2fLoR1.js} +4 -4
- package/dist/components/{p-BSVEFKEf.js.map → p-BK2fLoR1.js.map} +1 -1
- package/dist/components/{p-GDNc5Jlc.js → p-BxVBZl-X.js} +3 -3
- package/dist/components/{p-GDNc5Jlc.js.map → p-BxVBZl-X.js.map} +1 -1
- package/dist/components/p-cHn6O-Kf.js.map +1 -1
- package/dist/components/{p-_huP9NbJ.js → p-rvs_81wL.js} +3 -3
- package/dist/components/{p-_huP9NbJ.js.map → p-rvs_81wL.js.map} +1 -1
- package/dist/docs.json +116 -3
- package/dist/esm/gb-avatar_24.entry.js +4 -2
- package/dist/esm/gb-avatar_24.entry.js.map +1 -1
- package/dist/esm/globuscomponents.js +1 -1
- package/dist/esm/loader.js +1 -1
- package/dist/esm/reusableModels-cHn6O-Kf.js.map +1 -1
- package/dist/globuscomponents/globuscomponents.esm.js +1 -1
- package/dist/globuscomponents/{p-a7e01fee.entry.js → p-5948b2e6.entry.js} +2 -2
- package/dist/globuscomponents/p-5948b2e6.entry.js.map +1 -0
- package/dist/globuscomponents/p-cHn6O-Kf.js.map +1 -1
- package/dist/types/components/gb-badge/gb-badge.d.ts +2 -2
- package/dist/types/components/gb-detail-cell/gb-detail-cell.d.ts +4 -1
- package/dist/types/components.d.ts +10 -4
- package/dist/types/models/reusableModels.d.ts +1 -0
- package/package.json +1 -1
- package/dist/globuscomponents/p-a7e01fee.entry.js.map +0 -1
|
@@ -3,6 +3,8 @@ export class GbDetailCell {
|
|
|
3
3
|
constructor() {
|
|
4
4
|
this.label = '';
|
|
5
5
|
this.detail = '';
|
|
6
|
+
this.badgeIconLeading = '';
|
|
7
|
+
this.badgeIconTrailing = '';
|
|
6
8
|
this.badgeLabel = '';
|
|
7
9
|
this.showActionButtons = false;
|
|
8
10
|
this.showViewButton = false;
|
|
@@ -58,7 +60,7 @@ export class GbDetailCell {
|
|
|
58
60
|
}
|
|
59
61
|
}
|
|
60
62
|
render() {
|
|
61
|
-
return (h("div", { key: '
|
|
63
|
+
return (h("div", { key: '4f4ab6cdf4e8b9ed6fd2c3831e3aed096a8849d0', class: `detail_cell_div ${this.type} ${this.cellStyle}`, onMouseEnter: () => this.onShowCopyButton(), onMouseLeave: () => this.onHideCopyButton() }, this.type === 'information' && this.cellStyle === 'standard' && (h(Fragment, null, h("div", { key: '80be269e3f69e4d0567be3e1a8a59098ff89f354', class: "info_text_div" }, h("p", { key: '898b5413ba3e98f2cd3df4c8cf394aac70549401', class: "label text-sm-regular" }, this.label), h("p", { key: '6650cebae733d89ecfa4df4debcb3cd90c7700ee', class: "detail text-md-medium", onMouseEnter: () => (this.showTooltip = true), onMouseLeave: () => (this.showTooltip = false) }, this.detail), this.showTooltip && (h("gb-tooltip", { key: '1ecc82255ee9e5adbb55ac4e67cd78e2d75e2927', "show-arrow": false, class: "information_text_tooltip" }, h("p", { key: '067c62163cfe15b8558ffef92aa1c9bd5379c74e', slot: "label" }, this.detail)))), this.showStandardCopyButton && (h("gb-button", { key: '194dfa1e66e0744d50bf9637f4d9a8fdfeed52e6', size: "sm", hierarchy: "tertiary_gray", icon: "only", "icon-leading": "true", "icon-leading-swap": "assets/copy.svg", onClick: () => this.copyToClipboard() })), this.copied && (h("gb-tooltip", { key: 'c8d90d17e85dfc9ab9aa4e69f7bf369059133710', "show-arrow": false, class: "copied_tooltip" }, h("p", { key: '20e713c5b4ba95c507c7fe2d518a4fd1bf595da5', slot: "label" }, "Copied!"))))), this.type === 'document' && this.cellStyle === 'standard' && (h(Fragment, null, h("gb-file-type-icon", { key: '15b55b738499ff9b3ef37527353def96960b7cb6', "file-style": this.fileStyle, "file-type": this.fileType }), h("div", { key: 'b9b0fc3372ac45516bdd197f0f6696dd1c58e790', class: "document_text_div" }, h("p", { key: 'affaadeb36c666c02d57832161274f5d57ef23dc', class: "label text-sm-regular" }, this.label), h("p", { key: 'bd19a980919c86634c26ac59c93db850e9ea459b', class: "detail text-md-medium", onMouseEnter: () => (this.showTooltip = true), onMouseLeave: () => (this.showTooltip = false) }, this.detail), this.showTooltip && (h("gb-tooltip", { key: '47acc3cc9adeb2148a9cbe783c36c56385179087', "show-arrow": false, class: "document_detail_tooltip" }, h("p", { key: '4bc7264cec542bcbc3f11fdd90adf764d23b1532', slot: "label" }, this.detail)))), !this.isDownloaded ? (h(Fragment, null, this.showActionButtons && (h(Fragment, null, this.showViewButton && (h("gb-button", { size: "sm", hierarchy: "tertiary_gray", icon: "only", "icon-leading": "true", "icon-leading-swap": "assets/view.svg", onClick: () => this.onViewButtonClicked() })), this.showDownloadButton && (h("gb-button", { size: "sm", hierarchy: "tertiary_gray", icon: "only", "icon-leading": "true", "icon-leading-swap": "assets/download-03.svg", onClick: () => this.onDownloadButtonClicked() })))))) : (h("gb-tooltip", { "show-arrow": false, class: "downloaded_tooltip" }, h("p", { slot: "label" }, "Downloaded!"))))), this.type === 'status' && this.cellStyle === 'standard' && (h("div", { key: '5defa52f1590aa63155e94197f4a11affb0f17bc', class: "status_text_div" }, h("p", { key: '5994a27a212cf68f3fdad2a5693ecbd7155fb629', class: "label text-sm-regular" }, this.label), h("gb-badge", { key: 'c4b61f93aa2a8f0f9eaef0431a45033e1d16d282', size: "sm", type: this.badgeType, icon: this.badgeIcon, color: this.badgeColor, "icon-leading-swap": this.badgeIconLeading, "icon-trailing-swap": this.badgeIconTrailing }, h("p", { key: '2d390ae2f447cab465b0eff441bd2d4e4df93553' }, this.badgeLabel)))), this.type === 'information' && this.cellStyle === 'compact' && (h("div", { key: 'b82dae47bbcd6bf0a6602426cc0a432862d40d60', class: "compact_info_div" }, h("div", { key: '05bdae092a4f318db96d5b419da7af79af5612af', class: "compact_info_text_div" }, h("div", { key: 'aff0a21c728991b8a8115f3bd4aeff7c62b887ab', class: "compact_label" }, h("p", { key: '8251dec3096ddba686115702b9babd0d238869d2', class: "label text-sm-regular" }, this.label)), h("div", { key: '68ffbe6b912786c3a064ef954dbea3aa17d82199', class: "compact_detail" }, h("p", { key: '0bb5adaec06a5591d4a7a22f709c387ac5aa60d0', class: "detail_compact_text text-md-medium" }, this.detail), this.copied && (h("gb-tooltip", { key: '8daf6c7fabfd1df48b0dae298c58ded3f1e1c4d0', "show-arrow": false, class: "compact_copied_tooltip" }, h("p", { key: '8117dbe351d9ccedd37d05601d61b9260284091b', slot: "label" }, "Copied!")))), this.showCopyButton && (h("gb-button", { key: '4655d3674335c512a53662a5870fb21057b5daff', size: "sm", hierarchy: "tertiary_gray", icon: "only", "icon-leading": "true", "icon-leading-swap": "assets/copy.svg", onClick: () => this.copyToClipboard() }))))), this.type === 'document' && this.cellStyle === 'compact' && (h("div", { key: 'b93c088a29da24e1cf123395ad24b3550097ee55', class: "compact_doc_div" }, h("gb-file-type-icon", { key: 'b0e5acd6c5d9c49e229222bc3c9735ef7a27de23', "file-style": this.fileStyle, "file-type": this.fileType }), h("div", { key: '06f8f8a874900c72eed34f94e8117ad3c8a2051d', class: "compact_doc_text_div" }, h("p", { key: 'b5db5db38f9923cfba203c9f418d6b10ec3d9864', class: "doc_label text-sm-regular" }, this.label), h("div", { key: 'e6208d5deb754e27faf60189db4a2af2f73f6728', class: "compact_doc_detail" }, h("p", { key: '28a64fe452c2c380c5403f0513bbd29f8b5ad0fc', class: "detaill text-md-medium", onMouseEnter: () => (this.showTooltip = true), onMouseLeave: () => (this.showTooltip = false) }, this.detail)), this.isDownloaded && (h("gb-tooltip", { key: '48b9a82d740159fca3ab52adfa6e6cbede8ba26d', "show-arrow": false, class: "compact_downloaded_tooltip" }, h("p", { key: '93718b8a57a5b9cc6d8fc466c5b8a7ac23516a31', slot: "label" }, "Downloaded!"))), this.showActionButtons && (h("div", { key: '965cbd9ee226394839692dc4b5d81e6cace0e3e3', class: "button_container" }, this.showViewButton && (h("gb-button", { key: '126352f3a035232a9a9f26122870c7d060c14769', size: "sm", hierarchy: "tertiary_gray", icon: "only", "icon-leading": "true", "icon-leading-swap": "assets/view.svg", onClick: () => this.onViewButtonClicked() })), this.showDownloadButton && (h("gb-button", { key: '146a6ec05e49feb32ee80af7f7082cd09b8e2851', size: "sm", hierarchy: "tertiary_gray", icon: "only", "icon-leading": "true", "icon-leading-swap": "assets/download-03.svg", onClick: () => this.onDownloadButtonClicked() }))))))), this.type === 'status' && this.cellStyle === 'compact' && (h("div", { key: 'adb9ed14016ca677bea1dbb46cb4f13773264bba', class: "compact_status_div" }, h("div", { key: '844a06f58d403fae254fe46e97361891c933a02b', class: "compact_status_text_div" }, h("div", { key: '91ffaa7b1edb40ff3d115bdc9da69edb575b14bf', class: "compact_label" }, h("p", { key: 'd3aaeeb3f2b21c6d627b616a32a572b897bbe5d8', class: "label text-sm-regular" }, this.label)), h("gb-badge", { key: '77c8a50719a2e2a6460decd943a07967e1e067bd', size: "sm", type: this.badgeType, icon: "dot", color: this.badgeColor }, h("p", { key: '00f3b40f35e40c310e2ee5266014a4cb01fb2842' }, this.badgeLabel)))))));
|
|
62
64
|
}
|
|
63
65
|
static get is() { return "gb-detail-cell"; }
|
|
64
66
|
static get encapsulation() { return "shadow"; }
|
|
@@ -177,6 +179,71 @@ export class GbDetailCell {
|
|
|
177
179
|
"reflect": false,
|
|
178
180
|
"defaultValue": "''"
|
|
179
181
|
},
|
|
182
|
+
"badgeIcon": {
|
|
183
|
+
"type": "string",
|
|
184
|
+
"mutable": false,
|
|
185
|
+
"complexType": {
|
|
186
|
+
"original": "BadgeIconTypes",
|
|
187
|
+
"resolved": "\"avatar\" | \"country\" | \"dot\" | \"false\" | \"icon_leading\" | \"icon_trailing\" | \"only\"",
|
|
188
|
+
"references": {
|
|
189
|
+
"BadgeIconTypes": {
|
|
190
|
+
"location": "import",
|
|
191
|
+
"path": "../../models/reusableModels",
|
|
192
|
+
"id": "src/models/reusableModels.ts::BadgeIconTypes"
|
|
193
|
+
}
|
|
194
|
+
}
|
|
195
|
+
},
|
|
196
|
+
"required": false,
|
|
197
|
+
"optional": false,
|
|
198
|
+
"docs": {
|
|
199
|
+
"tags": [],
|
|
200
|
+
"text": ""
|
|
201
|
+
},
|
|
202
|
+
"getter": false,
|
|
203
|
+
"setter": false,
|
|
204
|
+
"attribute": "badge-icon",
|
|
205
|
+
"reflect": false
|
|
206
|
+
},
|
|
207
|
+
"badgeIconLeading": {
|
|
208
|
+
"type": "string",
|
|
209
|
+
"mutable": false,
|
|
210
|
+
"complexType": {
|
|
211
|
+
"original": "string",
|
|
212
|
+
"resolved": "string",
|
|
213
|
+
"references": {}
|
|
214
|
+
},
|
|
215
|
+
"required": false,
|
|
216
|
+
"optional": false,
|
|
217
|
+
"docs": {
|
|
218
|
+
"tags": [],
|
|
219
|
+
"text": ""
|
|
220
|
+
},
|
|
221
|
+
"getter": false,
|
|
222
|
+
"setter": false,
|
|
223
|
+
"attribute": "badge-icon-leading",
|
|
224
|
+
"reflect": false,
|
|
225
|
+
"defaultValue": "''"
|
|
226
|
+
},
|
|
227
|
+
"badgeIconTrailing": {
|
|
228
|
+
"type": "string",
|
|
229
|
+
"mutable": false,
|
|
230
|
+
"complexType": {
|
|
231
|
+
"original": "string",
|
|
232
|
+
"resolved": "string",
|
|
233
|
+
"references": {}
|
|
234
|
+
},
|
|
235
|
+
"required": false,
|
|
236
|
+
"optional": false,
|
|
237
|
+
"docs": {
|
|
238
|
+
"tags": [],
|
|
239
|
+
"text": ""
|
|
240
|
+
},
|
|
241
|
+
"getter": false,
|
|
242
|
+
"setter": false,
|
|
243
|
+
"attribute": "badge-icon-trailing",
|
|
244
|
+
"reflect": false,
|
|
245
|
+
"defaultValue": "''"
|
|
246
|
+
},
|
|
180
247
|
"badgeColor": {
|
|
181
248
|
"type": "string",
|
|
182
249
|
"mutable": false,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"gb-detail-cell.js","sourceRoot":"","sources":["../../../src/components/gb-detail-cell/gb-detail-cell.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, Prop, State, h, Fragment, Event, EventEmitter } from '@stencil/core';\r\nimport { BadgeTypes, FileIconStyles, FileIconTypes, GeneralColors, GeneralStyles } from '../../models/reusableModels';\r\n\r\n@Component({\r\n tag: 'gb-detail-cell',\r\n styleUrl: 'gb-detail-cell.css',\r\n shadow: true,\r\n})\r\nexport class GbDetailCell {\r\n @Prop() state: 'default' | 'disabled';\r\n @Prop({ mutable: true }) cellStyle: GeneralStyles;\r\n @Prop() type: 'information' | 'document' | 'status';\r\n @Prop() label: string = '';\r\n @Prop() detail: string = '';\r\n @Prop() badgeColor: GeneralColors;\r\n @Prop() badgeLabel: string = '';\r\n @Prop() badgeType: BadgeTypes;\r\n @Prop() fileType: FileIconTypes;\r\n @Prop() fileStyle: FileIconStyles;\r\n @Prop() showActionButtons: boolean = false;\r\n @Prop() showViewButton: boolean = false;\r\n @Prop() showDownloadButton: boolean = false;\r\n @Prop({ mutable: true }) showCopyButton: boolean = false;\r\n @State() showStandardCopyButton: boolean = false;\r\n @State() showTooltip: boolean = false;\r\n @State() copied: boolean = false;\r\n @State() isDownloaded: boolean = false;\r\n @State() width: number = window.innerWidth;\r\n @Event() viewButtonClicked: EventEmitter<void>;\r\n @Event() downloadButtonClicked: EventEmitter<void>;\r\n\r\n componentWillLoad() {\r\n this.updateCellStyle(); // Set initial variant\r\n window.addEventListener('resize', this.handleResize);\r\n }\r\n\r\n private handleResize = () => {\r\n this.width = window.innerWidth;\r\n this.updateCellStyle();\r\n };\r\n\r\n private updateCellStyle() {\r\n this.cellStyle = this.width < 768 ? 'compact' : this.cellStyle;\r\n }\r\n\r\n onViewButtonClicked() {\r\n this.viewButtonClicked.emit();\r\n }\r\n\r\n onDownloadButtonClicked() {\r\n this.isDownloaded = true;\r\n\r\n setTimeout(() => {\r\n this.isDownloaded = false;\r\n }, 2000);\r\n\r\n this.downloadButtonClicked.emit();\r\n }\r\n\r\n onShowCopyButton() {\r\n if (this.cellStyle === 'standard') {\r\n this.showStandardCopyButton = true;\r\n }\r\n }\r\n\r\n onHideCopyButton() {\r\n if (this.cellStyle === 'standard') {\r\n this.showStandardCopyButton = false;\r\n }\r\n }\r\n\r\n async copyToClipboard() {\r\n try {\r\n await navigator.clipboard.writeText(this.detail);\r\n this.copied = true;\r\n\r\n setTimeout(() => {\r\n this.copied = false;\r\n }, 2000); // Reset copied state after 2 seconds\r\n } catch (error) {\r\n console.error('Failed to copy:', error);\r\n }\r\n }\r\n\r\n render() {\r\n return (\r\n <div class={`detail_cell_div ${this.type} ${this.cellStyle}`} onMouseEnter={() => this.onShowCopyButton()} onMouseLeave={() => this.onHideCopyButton()}>\r\n {this.type === 'information' && this.cellStyle === 'standard' && (\r\n <>\r\n <div class=\"info_text_div\">\r\n <p class=\"label text-sm-regular\">{this.label}</p>\r\n <p class=\"detail text-md-medium\" onMouseEnter={() => (this.showTooltip = true)} onMouseLeave={() => (this.showTooltip = false)}>\r\n {this.detail}\r\n </p>\r\n {this.showTooltip && (\r\n <gb-tooltip show-arrow={false} class=\"information_text_tooltip\">\r\n <p slot=\"label\">{this.detail}</p>\r\n </gb-tooltip>\r\n )}\r\n </div>\r\n {this.showStandardCopyButton && (\r\n <gb-button size=\"sm\" hierarchy=\"tertiary_gray\" icon=\"only\" icon-leading=\"true\" icon-leading-swap=\"assets/copy.svg\" onClick={() => this.copyToClipboard()}></gb-button>\r\n )}\r\n {this.copied && (\r\n <gb-tooltip show-arrow={false} class=\"copied_tooltip\">\r\n <p slot=\"label\">Copied!</p>\r\n </gb-tooltip>\r\n )}\r\n </>\r\n )}\r\n {this.type === 'document' && this.cellStyle === 'standard' && (\r\n <>\r\n <gb-file-type-icon file-style={this.fileStyle} file-type={this.fileType}></gb-file-type-icon>\r\n <div class=\"document_text_div\">\r\n <p class=\"label text-sm-regular\">{this.label}</p>\r\n <p class=\"detail text-md-medium\" onMouseEnter={() => (this.showTooltip = true)} onMouseLeave={() => (this.showTooltip = false)}>\r\n {this.detail}\r\n </p>\r\n {this.showTooltip && (\r\n <gb-tooltip show-arrow={false} class=\"document_detail_tooltip\">\r\n <p slot=\"label\">{this.detail}</p>\r\n </gb-tooltip>\r\n )}\r\n </div>\r\n {!this.isDownloaded ? (\r\n <>\r\n {this.showActionButtons && (\r\n <>\r\n {this.showViewButton && (\r\n <gb-button\r\n size=\"sm\"\r\n hierarchy=\"tertiary_gray\"\r\n icon=\"only\"\r\n icon-leading=\"true\"\r\n icon-leading-swap=\"assets/view.svg\"\r\n onClick={() => this.onViewButtonClicked()}\r\n ></gb-button>\r\n )}\r\n {this.showDownloadButton && (\r\n <gb-button\r\n size=\"sm\"\r\n hierarchy=\"tertiary_gray\"\r\n icon=\"only\"\r\n icon-leading=\"true\"\r\n icon-leading-swap=\"assets/download-03.svg\"\r\n onClick={() => this.onDownloadButtonClicked()}\r\n ></gb-button>\r\n )}\r\n </>\r\n )}\r\n </>\r\n ) : (\r\n <gb-tooltip show-arrow={false} class=\"downloaded_tooltip\">\r\n <p slot=\"label\">Downloaded!</p>\r\n </gb-tooltip>\r\n )}\r\n </>\r\n )}\r\n {this.type === 'status' && this.cellStyle === 'standard' && (\r\n <div class=\"status_text_div\">\r\n <p class=\"label text-sm-regular\">{this.label}</p>\r\n <gb-badge size=\"sm\" type={this.badgeType} icon=\"dot\" color={this.badgeColor}>\r\n <p>{this.badgeLabel}</p>\r\n </gb-badge>\r\n </div>\r\n )}\r\n {this.type === 'information' && this.cellStyle === 'compact' && (\r\n <div class=\"compact_info_div\">\r\n <div class=\"compact_info_text_div\">\r\n <div class=\"compact_label\">\r\n <p class=\"label text-sm-regular\">{this.label}</p>\r\n </div>\r\n <div class=\"compact_detail\">\r\n <p class=\"detail_compact_text text-md-medium\">{this.detail}</p>\r\n {this.copied && (\r\n <gb-tooltip show-arrow={false} class=\"compact_copied_tooltip\">\r\n <p slot=\"label\">Copied!</p>\r\n </gb-tooltip>\r\n )}\r\n </div>\r\n {this.showCopyButton && (\r\n <gb-button\r\n size=\"sm\"\r\n hierarchy=\"tertiary_gray\"\r\n icon=\"only\"\r\n icon-leading=\"true\"\r\n icon-leading-swap=\"assets/copy.svg\"\r\n onClick={() => this.copyToClipboard()}\r\n ></gb-button>\r\n )}\r\n </div>\r\n </div>\r\n )}\r\n {this.type === 'document' && this.cellStyle === 'compact' && (\r\n <div class=\"compact_doc_div\">\r\n <gb-file-type-icon file-style={this.fileStyle} file-type={this.fileType}></gb-file-type-icon>\r\n <div class=\"compact_doc_text_div\">\r\n <p class=\"doc_label text-sm-regular\">{this.label}</p>\r\n <div class=\"compact_doc_detail\">\r\n <p class=\"detaill text-md-medium\" onMouseEnter={() => (this.showTooltip = true)} onMouseLeave={() => (this.showTooltip = false)}>\r\n {this.detail}\r\n </p>\r\n </div>\r\n {this.isDownloaded && (\r\n <gb-tooltip show-arrow={false} class=\"compact_downloaded_tooltip\">\r\n <p slot=\"label\">Downloaded!</p>\r\n </gb-tooltip>\r\n )}\r\n {this.showActionButtons && (\r\n <div class=\"button_container\">\r\n {this.showViewButton && (\r\n <gb-button\r\n size=\"sm\"\r\n hierarchy=\"tertiary_gray\"\r\n icon=\"only\"\r\n icon-leading=\"true\"\r\n icon-leading-swap=\"assets/view.svg\"\r\n onClick={() => this.onViewButtonClicked()}\r\n ></gb-button>\r\n )}\r\n {this.showDownloadButton && (\r\n <gb-button\r\n size=\"sm\"\r\n hierarchy=\"tertiary_gray\"\r\n icon=\"only\"\r\n icon-leading=\"true\"\r\n icon-leading-swap=\"assets/download-03.svg\"\r\n onClick={() => this.onDownloadButtonClicked()}\r\n ></gb-button>\r\n )}\r\n </div>\r\n )}\r\n </div>\r\n </div>\r\n )}\r\n {this.type === 'status' && this.cellStyle === 'compact' && (\r\n <div class=\"compact_status_div\">\r\n <div class=\"compact_status_text_div\">\r\n <div class=\"compact_label\">\r\n <p class=\"label text-sm-regular\">{this.label}</p>\r\n </div>\r\n <gb-badge size=\"sm\" type={this.badgeType} icon=\"dot\" color={this.badgeColor}>\r\n <p>{this.badgeLabel}</p>\r\n </gb-badge>\r\n </div>\r\n </div>\r\n )}\r\n </div>\r\n );\r\n }\r\n}\r\n"]}
|
|
1
|
+
{"version":3,"file":"gb-detail-cell.js","sourceRoot":"","sources":["../../../src/components/gb-detail-cell/gb-detail-cell.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, Prop, State, h, Fragment, Event, EventEmitter } from '@stencil/core';\r\nimport { BadgeIconTypes, BadgeTypes, FileIconStyles, FileIconTypes, GeneralColors, GeneralStyles } from '../../models/reusableModels';\r\n\r\n@Component({\r\n tag: 'gb-detail-cell',\r\n styleUrl: 'gb-detail-cell.css',\r\n shadow: true,\r\n})\r\nexport class GbDetailCell {\r\n @Prop() state: 'default' | 'disabled';\r\n @Prop({ mutable: true }) cellStyle: GeneralStyles;\r\n @Prop() type: 'information' | 'document' | 'status';\r\n @Prop() label: string = '';\r\n @Prop() detail: string = '';\r\n @Prop() badgeIcon: BadgeIconTypes;\r\n @Prop() badgeIconLeading: string = '';\r\n @Prop() badgeIconTrailing: string = '';\r\n @Prop() badgeColor: GeneralColors;\r\n @Prop() badgeLabel: string = '';\r\n @Prop() badgeType: BadgeTypes;\r\n @Prop() fileType: FileIconTypes;\r\n @Prop() fileStyle: FileIconStyles;\r\n @Prop() showActionButtons: boolean = false;\r\n @Prop() showViewButton: boolean = false;\r\n @Prop() showDownloadButton: boolean = false;\r\n @Prop({ mutable: true }) showCopyButton: boolean = false;\r\n @State() showStandardCopyButton: boolean = false;\r\n @State() showTooltip: boolean = false;\r\n @State() copied: boolean = false;\r\n @State() isDownloaded: boolean = false;\r\n @State() width: number = window.innerWidth;\r\n @Event() viewButtonClicked: EventEmitter<void>;\r\n @Event() downloadButtonClicked: EventEmitter<void>;\r\n\r\n componentWillLoad() {\r\n this.updateCellStyle(); // Set initial variant\r\n window.addEventListener('resize', this.handleResize);\r\n }\r\n\r\n private handleResize = () => {\r\n this.width = window.innerWidth;\r\n this.updateCellStyle();\r\n };\r\n\r\n private updateCellStyle() {\r\n this.cellStyle = this.width < 768 ? 'compact' : this.cellStyle;\r\n }\r\n\r\n onViewButtonClicked() {\r\n this.viewButtonClicked.emit();\r\n }\r\n\r\n onDownloadButtonClicked() {\r\n this.isDownloaded = true;\r\n\r\n setTimeout(() => {\r\n this.isDownloaded = false;\r\n }, 2000);\r\n\r\n this.downloadButtonClicked.emit();\r\n }\r\n\r\n onShowCopyButton() {\r\n if (this.cellStyle === 'standard') {\r\n this.showStandardCopyButton = true;\r\n }\r\n }\r\n\r\n onHideCopyButton() {\r\n if (this.cellStyle === 'standard') {\r\n this.showStandardCopyButton = false;\r\n }\r\n }\r\n\r\n async copyToClipboard() {\r\n try {\r\n await navigator.clipboard.writeText(this.detail);\r\n this.copied = true;\r\n\r\n setTimeout(() => {\r\n this.copied = false;\r\n }, 2000); // Reset copied state after 2 seconds\r\n } catch (error) {\r\n console.error('Failed to copy:', error);\r\n }\r\n }\r\n\r\n render() {\r\n return (\r\n <div class={`detail_cell_div ${this.type} ${this.cellStyle}`} onMouseEnter={() => this.onShowCopyButton()} onMouseLeave={() => this.onHideCopyButton()}>\r\n {this.type === 'information' && this.cellStyle === 'standard' && (\r\n <>\r\n <div class=\"info_text_div\">\r\n <p class=\"label text-sm-regular\">{this.label}</p>\r\n <p class=\"detail text-md-medium\" onMouseEnter={() => (this.showTooltip = true)} onMouseLeave={() => (this.showTooltip = false)}>\r\n {this.detail}\r\n </p>\r\n {this.showTooltip && (\r\n <gb-tooltip show-arrow={false} class=\"information_text_tooltip\">\r\n <p slot=\"label\">{this.detail}</p>\r\n </gb-tooltip>\r\n )}\r\n </div>\r\n {this.showStandardCopyButton && (\r\n <gb-button size=\"sm\" hierarchy=\"tertiary_gray\" icon=\"only\" icon-leading=\"true\" icon-leading-swap=\"assets/copy.svg\" onClick={() => this.copyToClipboard()}></gb-button>\r\n )}\r\n {this.copied && (\r\n <gb-tooltip show-arrow={false} class=\"copied_tooltip\">\r\n <p slot=\"label\">Copied!</p>\r\n </gb-tooltip>\r\n )}\r\n </>\r\n )}\r\n {this.type === 'document' && this.cellStyle === 'standard' && (\r\n <>\r\n <gb-file-type-icon file-style={this.fileStyle} file-type={this.fileType}></gb-file-type-icon>\r\n <div class=\"document_text_div\">\r\n <p class=\"label text-sm-regular\">{this.label}</p>\r\n <p class=\"detail text-md-medium\" onMouseEnter={() => (this.showTooltip = true)} onMouseLeave={() => (this.showTooltip = false)}>\r\n {this.detail}\r\n </p>\r\n {this.showTooltip && (\r\n <gb-tooltip show-arrow={false} class=\"document_detail_tooltip\">\r\n <p slot=\"label\">{this.detail}</p>\r\n </gb-tooltip>\r\n )}\r\n </div>\r\n {!this.isDownloaded ? (\r\n <>\r\n {this.showActionButtons && (\r\n <>\r\n {this.showViewButton && (\r\n <gb-button\r\n size=\"sm\"\r\n hierarchy=\"tertiary_gray\"\r\n icon=\"only\"\r\n icon-leading=\"true\"\r\n icon-leading-swap=\"assets/view.svg\"\r\n onClick={() => this.onViewButtonClicked()}\r\n ></gb-button>\r\n )}\r\n {this.showDownloadButton && (\r\n <gb-button\r\n size=\"sm\"\r\n hierarchy=\"tertiary_gray\"\r\n icon=\"only\"\r\n icon-leading=\"true\"\r\n icon-leading-swap=\"assets/download-03.svg\"\r\n onClick={() => this.onDownloadButtonClicked()}\r\n ></gb-button>\r\n )}\r\n </>\r\n )}\r\n </>\r\n ) : (\r\n <gb-tooltip show-arrow={false} class=\"downloaded_tooltip\">\r\n <p slot=\"label\">Downloaded!</p>\r\n </gb-tooltip>\r\n )}\r\n </>\r\n )}\r\n {this.type === 'status' && this.cellStyle === 'standard' && (\r\n <div class=\"status_text_div\">\r\n <p class=\"label text-sm-regular\">{this.label}</p>\r\n <gb-badge size=\"sm\" type={this.badgeType} icon={this.badgeIcon} color={this.badgeColor} icon-leading-swap={this.badgeIconLeading} icon-trailing-swap={this.badgeIconTrailing}>\r\n <p>{this.badgeLabel}</p>\r\n </gb-badge>\r\n </div>\r\n )}\r\n {this.type === 'information' && this.cellStyle === 'compact' && (\r\n <div class=\"compact_info_div\">\r\n <div class=\"compact_info_text_div\">\r\n <div class=\"compact_label\">\r\n <p class=\"label text-sm-regular\">{this.label}</p>\r\n </div>\r\n <div class=\"compact_detail\">\r\n <p class=\"detail_compact_text text-md-medium\">{this.detail}</p>\r\n {this.copied && (\r\n <gb-tooltip show-arrow={false} class=\"compact_copied_tooltip\">\r\n <p slot=\"label\">Copied!</p>\r\n </gb-tooltip>\r\n )}\r\n </div>\r\n {this.showCopyButton && (\r\n <gb-button\r\n size=\"sm\"\r\n hierarchy=\"tertiary_gray\"\r\n icon=\"only\"\r\n icon-leading=\"true\"\r\n icon-leading-swap=\"assets/copy.svg\"\r\n onClick={() => this.copyToClipboard()}\r\n ></gb-button>\r\n )}\r\n </div>\r\n </div>\r\n )}\r\n {this.type === 'document' && this.cellStyle === 'compact' && (\r\n <div class=\"compact_doc_div\">\r\n <gb-file-type-icon file-style={this.fileStyle} file-type={this.fileType}></gb-file-type-icon>\r\n <div class=\"compact_doc_text_div\">\r\n <p class=\"doc_label text-sm-regular\">{this.label}</p>\r\n <div class=\"compact_doc_detail\">\r\n <p class=\"detaill text-md-medium\" onMouseEnter={() => (this.showTooltip = true)} onMouseLeave={() => (this.showTooltip = false)}>\r\n {this.detail}\r\n </p>\r\n </div>\r\n {this.isDownloaded && (\r\n <gb-tooltip show-arrow={false} class=\"compact_downloaded_tooltip\">\r\n <p slot=\"label\">Downloaded!</p>\r\n </gb-tooltip>\r\n )}\r\n {this.showActionButtons && (\r\n <div class=\"button_container\">\r\n {this.showViewButton && (\r\n <gb-button\r\n size=\"sm\"\r\n hierarchy=\"tertiary_gray\"\r\n icon=\"only\"\r\n icon-leading=\"true\"\r\n icon-leading-swap=\"assets/view.svg\"\r\n onClick={() => this.onViewButtonClicked()}\r\n ></gb-button>\r\n )}\r\n {this.showDownloadButton && (\r\n <gb-button\r\n size=\"sm\"\r\n hierarchy=\"tertiary_gray\"\r\n icon=\"only\"\r\n icon-leading=\"true\"\r\n icon-leading-swap=\"assets/download-03.svg\"\r\n onClick={() => this.onDownloadButtonClicked()}\r\n ></gb-button>\r\n )}\r\n </div>\r\n )}\r\n </div>\r\n </div>\r\n )}\r\n {this.type === 'status' && this.cellStyle === 'compact' && (\r\n <div class=\"compact_status_div\">\r\n <div class=\"compact_status_text_div\">\r\n <div class=\"compact_label\">\r\n <p class=\"label text-sm-regular\">{this.label}</p>\r\n </div>\r\n <gb-badge size=\"sm\" type={this.badgeType} icon=\"dot\" color={this.badgeColor}>\r\n <p>{this.badgeLabel}</p>\r\n </gb-badge>\r\n </div>\r\n </div>\r\n )}\r\n </div>\r\n );\r\n }\r\n}\r\n"]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"reusableModels.js","sourceRoot":"","sources":["../../src/models/reusableModels.ts"],"names":[],"mappings":"AAIA,MAAM,CAAN,IAAY,SAGX;AAHD,WAAY,SAAS;IACnB,gCAAmB,CAAA;IACnB,kCAAqB,CAAA;AACvB,CAAC,EAHW,SAAS,KAAT,SAAS,QAGpB;AAMD,MAAM,CAAN,IAAY,aAKX;AALD,WAAY,aAAa;IACvB,yCAAwB,CAAA;IACxB,gCAAe,CAAA;IACf,oCAAmB,CAAA;IACnB,gCAAe,CAAA;AACjB,CAAC,EALW,aAAa,KAAb,aAAa,QAKxB;AAED,MAAM,CAAN,IAAY,qBAGX;AAHD,WAAY,qBAAqB;IAC/B,0CAAiB,CAAA;IACjB,4CAAmB,CAAA;AACrB,CAAC,EAHW,qBAAqB,KAArB,qBAAqB,QAGhC","sourcesContent":["export type GeneralSizes = 'xl4' | 'xl3' | 'xl2' | 'xl' | 'lg' | 'md' | 'sm' | 'xs' | 'xxs' | 'profile_lg' | 'profile_md' | 'profile_sm';\r\n\r\nexport type GeneralHierarchies = 'primary' | 'secondary_gray' | 'secondary_color' | 'tertiary_gray' | 'tertiary_color' | 'link_gray' | 'link_color';\r\n\r\nexport enum StateEnum {\r\n Default = 'default',\r\n Disabled = 'disabled',\r\n}\r\n\r\nexport type ArrowPositions = 'bottom_center' | 'bottom_left' | 'bottom_right' | 'top_center' | 'left' | 'right' | 'none' | 'center';\r\n\r\nexport type CheckBoxVariants = 'checkbox' | 'check_circle' | 'radio';\r\n\r\nexport enum BorderWeights {\r\n VeryLight = 'very_light',\r\n Light = 'light',\r\n Regular = 'regular',\r\n Heavy = 'heavy',\r\n}\r\n\r\nexport enum OnlineIndicatorStates {\r\n Online = 'online',\r\n Offline = 'offline',\r\n}\r\n\r\nexport type BreakPoints = 'desktop' | 'mobile';\r\n\r\nexport type FileUploadIconType = 'solid' | 'outline';\r\n\r\nexport type FileUploadStates = 'default' | 'in_progress' | 'complete' | 'hover' | 'disabled' | 'error';\r\n\r\nexport type FileType = '';\r\n\r\nexport type GeneralColors = 'default' | 'gray' | 'primary' | 'error' | 'warning' | 'success' | 'discovery' | 'information' | 'pink' | 'purple';\r\n\r\nexport type PaginationNumberShapes = 'square' | 'circle';\r\n\r\nexport type PaginationTypes =\r\n | 'page_default'\r\n | 'page_minimal_center_aligned'\r\n | 'card_default'\r\n | 'card_minimal_right_aligned'\r\n | 'card_minimal_left_aligned'\r\n | 'card_minimal_center_aligned'\r\n | 'card_button_group_right_aligned'\r\n | 'card_button_group_left_aligned'\r\n | 'card_button_group_center_aligned';\r\n\r\nexport type TabTypes =\r\n | 'button_primary'\r\n | 'button_gray'\r\n | 'button_white'\r\n | 'rounded_button_white'\r\n | 'underline'\r\n | 'underline_filled'\r\n | 'line'\r\n | 'button_white_border'\r\n | 'rounded_button_white_border'\r\n | 'button_gray_border';\r\n\r\nexport type GeneralBackgroundCategories = 'plain_background' | 'colored_background';\r\n\r\nexport type InputFieldTypes =\r\n | 'default'\r\n | 'icon_leading'\r\n | 'leading_dropdown'\r\n | 'trailing_dropdown'\r\n | 'leading_text'\r\n | 'payment_input'\r\n | 'tags'\r\n | 'trailing_button'\r\n | 'password'\r\n | 'password_icon_leading'\r\n | 'count';\r\n\r\nexport type DropdownTypes = 'default' | 'icon_leading' | 'avatar_leading' | 'dot_leading' | 'checkbox' | 'search' | 'tags';\r\n\r\nexport type ColorTypes = 'gray' | 'blue' | 'cyan' | 'pink' | 'purple' | 'green' | 'yellow' | 'red' | 'white';\r\n\r\nexport type DropdownItemTypes = string | number | { name: string | number; username: string; selected?: boolean };\r\n\r\nexport type PaginationDotTypes = 'dot' | 'line';\r\n\r\nexport type FileIconStyles = 'default' | 'gray' | 'solid';\r\n\r\nexport type FileIconTypes = 'pdf' | 'csv' | 'jpg' | 'jpeg' | 'ppt' | 'pptx' | 'doc' | 'docx' | 'xls' | 'xlsx' | 'svg' | 'txt' | 'zip' | 'rar' | 'mp3' | 'mp4' | 'png';\r\n\r\nexport type TableCellTypes = 'text' | 'lead_text' | 'lead_checkbox' | 'badge';\r\n\r\nexport type ProgressStepStatus = 'incomplete' | 'current' | 'complete';\r\n\r\nexport type ProgressStepTypes = 'icon_only' | 'icon_left' | 'icon_top' | 'text_line' | 'featured_icon_left' | 'featured_icon_top';\r\n\r\nexport type ProgressStepStates = 'default' | 'destructive';\r\n\r\nexport type BadgeTypes = 'pill_color' | 'pill_outline' | 'badge_color' | 'badge_modern';\r\n\r\nexport type GeneralStyles = 'standard' | 'compact';\r\n\r\nexport type StateType = 'default' | 'disabled' | 'applied';\r\n\r\nexport type ButtonGroupTypes = 'false' | 'leading' | 'only' | 'dot' | 'checkbox';\r\n\r\nexport type ThemeTypes = 'system' | 'light' | 'dark';"]}
|
|
1
|
+
{"version":3,"file":"reusableModels.js","sourceRoot":"","sources":["../../src/models/reusableModels.ts"],"names":[],"mappings":"AAIA,MAAM,CAAN,IAAY,SAGX;AAHD,WAAY,SAAS;IACnB,gCAAmB,CAAA;IACnB,kCAAqB,CAAA;AACvB,CAAC,EAHW,SAAS,KAAT,SAAS,QAGpB;AAMD,MAAM,CAAN,IAAY,aAKX;AALD,WAAY,aAAa;IACvB,yCAAwB,CAAA;IACxB,gCAAe,CAAA;IACf,oCAAmB,CAAA;IACnB,gCAAe,CAAA;AACjB,CAAC,EALW,aAAa,KAAb,aAAa,QAKxB;AAED,MAAM,CAAN,IAAY,qBAGX;AAHD,WAAY,qBAAqB;IAC/B,0CAAiB,CAAA;IACjB,4CAAmB,CAAA;AACrB,CAAC,EAHW,qBAAqB,KAArB,qBAAqB,QAGhC","sourcesContent":["export type GeneralSizes = 'xl4' | 'xl3' | 'xl2' | 'xl' | 'lg' | 'md' | 'sm' | 'xs' | 'xxs' | 'profile_lg' | 'profile_md' | 'profile_sm';\r\n\r\nexport type GeneralHierarchies = 'primary' | 'secondary_gray' | 'secondary_color' | 'tertiary_gray' | 'tertiary_color' | 'link_gray' | 'link_color';\r\n\r\nexport enum StateEnum {\r\n Default = 'default',\r\n Disabled = 'disabled',\r\n}\r\n\r\nexport type ArrowPositions = 'bottom_center' | 'bottom_left' | 'bottom_right' | 'top_center' | 'left' | 'right' | 'none' | 'center';\r\n\r\nexport type CheckBoxVariants = 'checkbox' | 'check_circle' | 'radio';\r\n\r\nexport enum BorderWeights {\r\n VeryLight = 'very_light',\r\n Light = 'light',\r\n Regular = 'regular',\r\n Heavy = 'heavy',\r\n}\r\n\r\nexport enum OnlineIndicatorStates {\r\n Online = 'online',\r\n Offline = 'offline',\r\n}\r\n\r\nexport type BreakPoints = 'desktop' | 'mobile';\r\n\r\nexport type FileUploadIconType = 'solid' | 'outline';\r\n\r\nexport type FileUploadStates = 'default' | 'in_progress' | 'complete' | 'hover' | 'disabled' | 'error';\r\n\r\nexport type FileType = '';\r\n\r\nexport type GeneralColors = 'default' | 'gray' | 'primary' | 'error' | 'warning' | 'success' | 'discovery' | 'information' | 'pink' | 'purple';\r\n\r\nexport type PaginationNumberShapes = 'square' | 'circle';\r\n\r\nexport type PaginationTypes =\r\n | 'page_default'\r\n | 'page_minimal_center_aligned'\r\n | 'card_default'\r\n | 'card_minimal_right_aligned'\r\n | 'card_minimal_left_aligned'\r\n | 'card_minimal_center_aligned'\r\n | 'card_button_group_right_aligned'\r\n | 'card_button_group_left_aligned'\r\n | 'card_button_group_center_aligned';\r\n\r\nexport type TabTypes =\r\n | 'button_primary'\r\n | 'button_gray'\r\n | 'button_white'\r\n | 'rounded_button_white'\r\n | 'underline'\r\n | 'underline_filled'\r\n | 'line'\r\n | 'button_white_border'\r\n | 'rounded_button_white_border'\r\n | 'button_gray_border';\r\n\r\nexport type GeneralBackgroundCategories = 'plain_background' | 'colored_background';\r\n\r\nexport type InputFieldTypes =\r\n | 'default'\r\n | 'icon_leading'\r\n | 'leading_dropdown'\r\n | 'trailing_dropdown'\r\n | 'leading_text'\r\n | 'payment_input'\r\n | 'tags'\r\n | 'trailing_button'\r\n | 'password'\r\n | 'password_icon_leading'\r\n | 'count';\r\n\r\nexport type DropdownTypes = 'default' | 'icon_leading' | 'avatar_leading' | 'dot_leading' | 'checkbox' | 'search' | 'tags';\r\n\r\nexport type ColorTypes = 'gray' | 'blue' | 'cyan' | 'pink' | 'purple' | 'green' | 'yellow' | 'red' | 'white';\r\n\r\nexport type DropdownItemTypes = string | number | { name: string | number; username: string; selected?: boolean };\r\n\r\nexport type PaginationDotTypes = 'dot' | 'line';\r\n\r\nexport type FileIconStyles = 'default' | 'gray' | 'solid';\r\n\r\nexport type FileIconTypes = 'pdf' | 'csv' | 'jpg' | 'jpeg' | 'ppt' | 'pptx' | 'doc' | 'docx' | 'xls' | 'xlsx' | 'svg' | 'txt' | 'zip' | 'rar' | 'mp3' | 'mp4' | 'png';\r\n\r\nexport type TableCellTypes = 'text' | 'lead_text' | 'lead_checkbox' | 'badge';\r\n\r\nexport type ProgressStepStatus = 'incomplete' | 'current' | 'complete';\r\n\r\nexport type ProgressStepTypes = 'icon_only' | 'icon_left' | 'icon_top' | 'text_line' | 'featured_icon_left' | 'featured_icon_top';\r\n\r\nexport type ProgressStepStates = 'default' | 'destructive';\r\n\r\nexport type BadgeTypes = 'pill_color' | 'pill_outline' | 'badge_color' | 'badge_modern';\r\n\r\nexport type GeneralStyles = 'standard' | 'compact';\r\n\r\nexport type StateType = 'default' | 'disabled' | 'applied';\r\n\r\nexport type ButtonGroupTypes = 'false' | 'leading' | 'only' | 'dot' | 'checkbox';\r\n\r\nexport type ThemeTypes = 'system' | 'light' | 'dark';\r\n\r\nexport type BadgeIconTypes = 'dot' | 'avatar' | 'icon_leading' | 'icon_trailing' | 'country' | 'only' | 'false';"]}
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import { p as proxyCustomElement, H, c as createEvent, h, F as Fragment } from './p-C_NOJI7O.js';
|
|
2
2
|
import { d as defineCustomElement$9 } from './p-58s1T6zX.js';
|
|
3
3
|
import { d as defineCustomElement$8 } from './p-CXLJa2-n.js';
|
|
4
|
-
import { d as defineCustomElement$7 } from './p-
|
|
4
|
+
import { d as defineCustomElement$7 } from './p-rvs_81wL.js';
|
|
5
5
|
import { d as defineCustomElement$6 } from './p-BC9XJeP1.js';
|
|
6
6
|
import { d as defineCustomElement$5 } from './p-DNVipIEI.js';
|
|
7
7
|
import { d as defineCustomElement$4 } from './p-C27wAUgy.js';
|
|
@@ -19,6 +19,8 @@ const GbDetailCell$1 = /*@__PURE__*/ proxyCustomElement(class GbDetailCell exten
|
|
|
19
19
|
this.downloadButtonClicked = createEvent(this, "downloadButtonClicked");
|
|
20
20
|
this.label = '';
|
|
21
21
|
this.detail = '';
|
|
22
|
+
this.badgeIconLeading = '';
|
|
23
|
+
this.badgeIconTrailing = '';
|
|
22
24
|
this.badgeLabel = '';
|
|
23
25
|
this.showActionButtons = false;
|
|
24
26
|
this.showViewButton = false;
|
|
@@ -74,7 +76,7 @@ const GbDetailCell$1 = /*@__PURE__*/ proxyCustomElement(class GbDetailCell exten
|
|
|
74
76
|
}
|
|
75
77
|
}
|
|
76
78
|
render() {
|
|
77
|
-
return (h("div", { key: '
|
|
79
|
+
return (h("div", { key: '4f4ab6cdf4e8b9ed6fd2c3831e3aed096a8849d0', class: `detail_cell_div ${this.type} ${this.cellStyle}`, onMouseEnter: () => this.onShowCopyButton(), onMouseLeave: () => this.onHideCopyButton() }, this.type === 'information' && this.cellStyle === 'standard' && (h(Fragment, null, h("div", { key: '80be269e3f69e4d0567be3e1a8a59098ff89f354', class: "info_text_div" }, h("p", { key: '898b5413ba3e98f2cd3df4c8cf394aac70549401', class: "label text-sm-regular" }, this.label), h("p", { key: '6650cebae733d89ecfa4df4debcb3cd90c7700ee', class: "detail text-md-medium", onMouseEnter: () => (this.showTooltip = true), onMouseLeave: () => (this.showTooltip = false) }, this.detail), this.showTooltip && (h("gb-tooltip", { key: '1ecc82255ee9e5adbb55ac4e67cd78e2d75e2927', "show-arrow": false, class: "information_text_tooltip" }, h("p", { key: '067c62163cfe15b8558ffef92aa1c9bd5379c74e', slot: "label" }, this.detail)))), this.showStandardCopyButton && (h("gb-button", { key: '194dfa1e66e0744d50bf9637f4d9a8fdfeed52e6', size: "sm", hierarchy: "tertiary_gray", icon: "only", "icon-leading": "true", "icon-leading-swap": "assets/copy.svg", onClick: () => this.copyToClipboard() })), this.copied && (h("gb-tooltip", { key: 'c8d90d17e85dfc9ab9aa4e69f7bf369059133710', "show-arrow": false, class: "copied_tooltip" }, h("p", { key: '20e713c5b4ba95c507c7fe2d518a4fd1bf595da5', slot: "label" }, "Copied!"))))), this.type === 'document' && this.cellStyle === 'standard' && (h(Fragment, null, h("gb-file-type-icon", { key: '15b55b738499ff9b3ef37527353def96960b7cb6', "file-style": this.fileStyle, "file-type": this.fileType }), h("div", { key: 'b9b0fc3372ac45516bdd197f0f6696dd1c58e790', class: "document_text_div" }, h("p", { key: 'affaadeb36c666c02d57832161274f5d57ef23dc', class: "label text-sm-regular" }, this.label), h("p", { key: 'bd19a980919c86634c26ac59c93db850e9ea459b', class: "detail text-md-medium", onMouseEnter: () => (this.showTooltip = true), onMouseLeave: () => (this.showTooltip = false) }, this.detail), this.showTooltip && (h("gb-tooltip", { key: '47acc3cc9adeb2148a9cbe783c36c56385179087', "show-arrow": false, class: "document_detail_tooltip" }, h("p", { key: '4bc7264cec542bcbc3f11fdd90adf764d23b1532', slot: "label" }, this.detail)))), !this.isDownloaded ? (h(Fragment, null, this.showActionButtons && (h(Fragment, null, this.showViewButton && (h("gb-button", { size: "sm", hierarchy: "tertiary_gray", icon: "only", "icon-leading": "true", "icon-leading-swap": "assets/view.svg", onClick: () => this.onViewButtonClicked() })), this.showDownloadButton && (h("gb-button", { size: "sm", hierarchy: "tertiary_gray", icon: "only", "icon-leading": "true", "icon-leading-swap": "assets/download-03.svg", onClick: () => this.onDownloadButtonClicked() })))))) : (h("gb-tooltip", { "show-arrow": false, class: "downloaded_tooltip" }, h("p", { slot: "label" }, "Downloaded!"))))), this.type === 'status' && this.cellStyle === 'standard' && (h("div", { key: '5defa52f1590aa63155e94197f4a11affb0f17bc', class: "status_text_div" }, h("p", { key: '5994a27a212cf68f3fdad2a5693ecbd7155fb629', class: "label text-sm-regular" }, this.label), h("gb-badge", { key: 'c4b61f93aa2a8f0f9eaef0431a45033e1d16d282', size: "sm", type: this.badgeType, icon: this.badgeIcon, color: this.badgeColor, "icon-leading-swap": this.badgeIconLeading, "icon-trailing-swap": this.badgeIconTrailing }, h("p", { key: '2d390ae2f447cab465b0eff441bd2d4e4df93553' }, this.badgeLabel)))), this.type === 'information' && this.cellStyle === 'compact' && (h("div", { key: 'b82dae47bbcd6bf0a6602426cc0a432862d40d60', class: "compact_info_div" }, h("div", { key: '05bdae092a4f318db96d5b419da7af79af5612af', class: "compact_info_text_div" }, h("div", { key: 'aff0a21c728991b8a8115f3bd4aeff7c62b887ab', class: "compact_label" }, h("p", { key: '8251dec3096ddba686115702b9babd0d238869d2', class: "label text-sm-regular" }, this.label)), h("div", { key: '68ffbe6b912786c3a064ef954dbea3aa17d82199', class: "compact_detail" }, h("p", { key: '0bb5adaec06a5591d4a7a22f709c387ac5aa60d0', class: "detail_compact_text text-md-medium" }, this.detail), this.copied && (h("gb-tooltip", { key: '8daf6c7fabfd1df48b0dae298c58ded3f1e1c4d0', "show-arrow": false, class: "compact_copied_tooltip" }, h("p", { key: '8117dbe351d9ccedd37d05601d61b9260284091b', slot: "label" }, "Copied!")))), this.showCopyButton && (h("gb-button", { key: '4655d3674335c512a53662a5870fb21057b5daff', size: "sm", hierarchy: "tertiary_gray", icon: "only", "icon-leading": "true", "icon-leading-swap": "assets/copy.svg", onClick: () => this.copyToClipboard() }))))), this.type === 'document' && this.cellStyle === 'compact' && (h("div", { key: 'b93c088a29da24e1cf123395ad24b3550097ee55', class: "compact_doc_div" }, h("gb-file-type-icon", { key: 'b0e5acd6c5d9c49e229222bc3c9735ef7a27de23', "file-style": this.fileStyle, "file-type": this.fileType }), h("div", { key: '06f8f8a874900c72eed34f94e8117ad3c8a2051d', class: "compact_doc_text_div" }, h("p", { key: 'b5db5db38f9923cfba203c9f418d6b10ec3d9864', class: "doc_label text-sm-regular" }, this.label), h("div", { key: 'e6208d5deb754e27faf60189db4a2af2f73f6728', class: "compact_doc_detail" }, h("p", { key: '28a64fe452c2c380c5403f0513bbd29f8b5ad0fc', class: "detaill text-md-medium", onMouseEnter: () => (this.showTooltip = true), onMouseLeave: () => (this.showTooltip = false) }, this.detail)), this.isDownloaded && (h("gb-tooltip", { key: '48b9a82d740159fca3ab52adfa6e6cbede8ba26d', "show-arrow": false, class: "compact_downloaded_tooltip" }, h("p", { key: '93718b8a57a5b9cc6d8fc466c5b8a7ac23516a31', slot: "label" }, "Downloaded!"))), this.showActionButtons && (h("div", { key: '965cbd9ee226394839692dc4b5d81e6cace0e3e3', class: "button_container" }, this.showViewButton && (h("gb-button", { key: '126352f3a035232a9a9f26122870c7d060c14769', size: "sm", hierarchy: "tertiary_gray", icon: "only", "icon-leading": "true", "icon-leading-swap": "assets/view.svg", onClick: () => this.onViewButtonClicked() })), this.showDownloadButton && (h("gb-button", { key: '146a6ec05e49feb32ee80af7f7082cd09b8e2851', size: "sm", hierarchy: "tertiary_gray", icon: "only", "icon-leading": "true", "icon-leading-swap": "assets/download-03.svg", onClick: () => this.onDownloadButtonClicked() }))))))), this.type === 'status' && this.cellStyle === 'compact' && (h("div", { key: 'adb9ed14016ca677bea1dbb46cb4f13773264bba', class: "compact_status_div" }, h("div", { key: '844a06f58d403fae254fe46e97361891c933a02b', class: "compact_status_text_div" }, h("div", { key: '91ffaa7b1edb40ff3d115bdc9da69edb575b14bf', class: "compact_label" }, h("p", { key: 'd3aaeeb3f2b21c6d627b616a32a572b897bbe5d8', class: "label text-sm-regular" }, this.label)), h("gb-badge", { key: '77c8a50719a2e2a6460decd943a07967e1e067bd', size: "sm", type: this.badgeType, icon: "dot", color: this.badgeColor }, h("p", { key: '00f3b40f35e40c310e2ee5266014a4cb01fb2842' }, this.badgeLabel)))))));
|
|
78
80
|
}
|
|
79
81
|
static get style() { return gbDetailCellCss; }
|
|
80
82
|
}, [1, "gb-detail-cell", {
|
|
@@ -83,6 +85,9 @@ const GbDetailCell$1 = /*@__PURE__*/ proxyCustomElement(class GbDetailCell exten
|
|
|
83
85
|
"type": [1],
|
|
84
86
|
"label": [1],
|
|
85
87
|
"detail": [1],
|
|
88
|
+
"badgeIcon": [1, "badge-icon"],
|
|
89
|
+
"badgeIconLeading": [1, "badge-icon-leading"],
|
|
90
|
+
"badgeIconTrailing": [1, "badge-icon-trailing"],
|
|
86
91
|
"badgeColor": [1, "badge-color"],
|
|
87
92
|
"badgeLabel": [1, "badge-label"],
|
|
88
93
|
"badgeType": [1, "badge-type"],
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"file":"gb-detail-cell.js","mappings":"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","names":["GbDetailCell","__stencil_proxyCustomElement","HTMLElement"],"sources":["src/components/gb-detail-cell/gb-detail-cell.css?tag=gb-detail-cell&encapsulation=shadow","src/components/gb-detail-cell/gb-detail-cell.tsx"],"sourcesContent":["@import './../../global/global.css';\r\n\r\n:host {\r\n min-width: 0;\r\n width: 100%;\r\n}\r\n\r\n.detail_cell_div {\r\n display: flex;\r\n justify-content: space-between;\r\n align-items: center;\r\n border-bottom: 1px solid var(--color-border-subtler, #e3e8ef);\r\n cursor: pointer;\r\n position: relative;\r\n text-overflow: ellipsis;\r\n white-space: nowrap;\r\n gap: var(--spacing-2);\r\n}\r\n\r\n.detail_cell_div:hover {\r\n background: var(--color-background-gray-subtlest, #f6f8fa);\r\n}\r\n\r\n.detail_cell_div.standard {\r\n height: 5rem;\r\n padding: var(--spacing-none) var(--spacing-6);\r\n}\r\n\r\n.detail_cell_div.compact {\r\n padding: 0;\r\n}\r\n\r\n.info_text_div,\r\n.status_text_div,\r\n.document_text_div {\r\n overflow: hidden;\r\n text-overflow: ellipsis;\r\n white-space: nowrap;\r\n display: flex;\r\n flex-direction: column;\r\n gap: var(--spacing-3);\r\n flex: 1;\r\n}\r\n\r\n.status_text_div {\r\n gap: var(--spacing-2);\r\n}\r\n\r\n.label {\r\n color: var(--color-text-subtle, #697586);\r\n display: block; /* Ensure block or inline-block */\r\n max-width: 100%; /* Set a fixed or max width */\r\n white-space: nowrap; /* Prevent text from wrapping */\r\n overflow: hidden; /* Hide overflowing text */\r\n text-overflow: ellipsis; /* Apply ellipsis */\r\n flex: 1;\r\n min-width: 0; /* Ensure it can shrink properly */\r\n}\r\n\r\n.detail_div {\r\n width: 100%;\r\n overflow: hidden;\r\n}\r\n\r\n.detail {\r\n color: var(--color-text, #4b5565);\r\n display: block; /* Ensure block or inline-block */\r\n max-width: 100%; /* Set a fixed or max width */\r\n white-space: nowrap; /* Prevent text from wrapping */\r\n overflow: hidden; /* Hide overflowing text */\r\n text-overflow: ellipsis; /* Apply ellipsis */\r\n flex: 1;\r\n min-width: 0; /* Ensure it can shrink properly */\r\n}\r\n\r\n.information_text_tooltip {\r\n position: absolute;\r\n bottom: 90%;\r\n}\r\n\r\n.document_detail_tooltip {\r\n position: absolute;\r\n left: 4rem;\r\n bottom: 90%;\r\n}\r\n\r\n.copied_tooltip {\r\n position: absolute;\r\n right: 6rem;\r\n bottom: 3.5rem;\r\n}\r\n\r\n.downloaded_tooltip {\r\n position: absolute;\r\n right: 8rem;\r\n bottom: 3.5rem;\r\n}\r\n\r\n/* Compact Information Styles */\r\n.compact_info_div {\r\n display: flex;\r\n width: 100%;\r\n padding: var(--spacing-3) var(--spacing-2);\r\n align-items: center;\r\n}\r\n\r\n.compact_info_text_div {\r\n display: flex;\r\n min-height: 2.25rem;\r\n /* justify-content: space-between; */\r\n align-items: center;\r\n gap: var(--spacing-5);\r\n flex: 1 0 0;\r\n width: 100%;\r\n}\r\n\r\n.compact_detail {\r\n display: flex;\r\n flex-direction: column-reverse;\r\n flex: 1 0 0;\r\n align-items: flex-end;\r\n position: relative;\r\n flex-wrap: wrap;\r\n word-wrap: break-word; /* Ensures words break if needed */\r\n overflow-wrap: break-word; /* Helps in modern browsers */\r\n white-space: normal; /* Allows text wrapping */\r\n text-align: right; /* Keeps text aligned to the right */\r\n}\r\n\r\n.detail_compact_text {\r\n color: var(--color-text, #4b5565);\r\n word-break: break-word; /* Ensures long words break */\r\n overflow-wrap: anywhere; /* Allows breaking at any point */\r\n white-space: normal; /* Ensures wrapping is allowed */\r\n hyphens: auto;\r\n}\r\n\r\n.compact_copied_tooltip {\r\n position: absolute;\r\n right: 4rem;\r\n bottom: 2rem;\r\n}\r\n\r\n.compact_status_div {\r\n display: flex;\r\n width: 100%;\r\n padding: var(--spacing-3) var(--spacing-2);\r\n align-items: center;\r\n}\r\n\r\n.compact_status_text_div {\r\n display: flex;\r\n min-height: 2.25rem;\r\n justify-content: space-between;\r\n align-items: center;\r\n flex: 1 0 0;\r\n}\r\n\r\n.compact_doc_div {\r\n display: flex;\r\n width: 100%;\r\n justify-content: space-between;\r\n padding: var(--spacing-3) var(--spacing-2);\r\n align-items: center;\r\n gap: var(--spacing-2);\r\n}\r\n\r\n.compact_doc_text_div {\r\n display: flex;\r\n min-height: 2.25rem;\r\n align-items: center;\r\n gap: 1.25rem;\r\n flex: 1 0 0;\r\n}\r\n\r\n.compact_doc_textt_div {\r\n display: flex;\r\n flex-direction: column; /* Allows stacking if necessary */\r\n align-items: flex-start; /* Aligns text to the left */\r\n gap: 0.5rem;\r\n flex: 1 1 auto;\r\n word-wrap: break-word; /* Ensures words break properly */\r\n overflow-wrap: break-word;\r\n white-space: normal; /* Allows wrapping */\r\n max-width: 100%; /* Prevents overflow */\r\n}\r\n\r\n.compact_doc_detail {\r\n display: flex;\r\n flex: 1 0 0;\r\n text-align: right;\r\n justify-content: flex-end;\r\n}\r\n\r\n.doc_label {\r\n color: var(--color-text-subtle, #697586);\r\n display: block; /* Ensure block or inline-block */\r\n white-space: nowrap; /* Prevent text from wrapping */\r\n text-overflow: ellipsis; /* Apply ellipsis */\r\n}\r\n\r\n.detaill {\r\n max-width: 100%; /* Ensures it doesn’t stretch too far */\r\n word-break: break-word; /* Breaks long words */\r\n white-space: normal; /* Allows text to wrap */\r\n overflow-wrap: break-word;\r\n display: flex;\r\n color: var(--color-text, #4b5565);\r\n}\r\n\r\n.button_container {\r\n display: flex;\r\n align-items: center;\r\n gap: var(--spacing-2);\r\n}\r\n\r\n.downloaded_toolip_div {\r\n position: relative;\r\n width: 100%;\r\n}\r\n\r\n.compact_downloaded_tooltip {\r\n position: absolute;\r\n bottom: 3rem;\r\n right: 10rem;\r\n}\r\n","import { Component, Prop, State, h, Fragment, Event, EventEmitter } from '@stencil/core';\r\nimport { BadgeTypes, FileIconStyles, FileIconTypes, GeneralColors, GeneralStyles } from '../../models/reusableModels';\r\n\r\n@Component({\r\n tag: 'gb-detail-cell',\r\n styleUrl: 'gb-detail-cell.css',\r\n shadow: true,\r\n})\r\nexport class GbDetailCell {\r\n @Prop() state: 'default' | 'disabled';\r\n @Prop({ mutable: true }) cellStyle: GeneralStyles;\r\n @Prop() type: 'information' | 'document' | 'status';\r\n @Prop() label: string = '';\r\n @Prop() detail: string = '';\r\n @Prop() badgeColor: GeneralColors;\r\n @Prop() badgeLabel: string = '';\r\n @Prop() badgeType: BadgeTypes;\r\n @Prop() fileType: FileIconTypes;\r\n @Prop() fileStyle: FileIconStyles;\r\n @Prop() showActionButtons: boolean = false;\r\n @Prop() showViewButton: boolean = false;\r\n @Prop() showDownloadButton: boolean = false;\r\n @Prop({ mutable: true }) showCopyButton: boolean = false;\r\n @State() showStandardCopyButton: boolean = false;\r\n @State() showTooltip: boolean = false;\r\n @State() copied: boolean = false;\r\n @State() isDownloaded: boolean = false;\r\n @State() width: number = window.innerWidth;\r\n @Event() viewButtonClicked: EventEmitter<void>;\r\n @Event() downloadButtonClicked: EventEmitter<void>;\r\n\r\n componentWillLoad() {\r\n this.updateCellStyle(); // Set initial variant\r\n window.addEventListener('resize', this.handleResize);\r\n }\r\n\r\n private handleResize = () => {\r\n this.width = window.innerWidth;\r\n this.updateCellStyle();\r\n };\r\n\r\n private updateCellStyle() {\r\n this.cellStyle = this.width < 768 ? 'compact' : this.cellStyle;\r\n }\r\n\r\n onViewButtonClicked() {\r\n this.viewButtonClicked.emit();\r\n }\r\n\r\n onDownloadButtonClicked() {\r\n this.isDownloaded = true;\r\n\r\n setTimeout(() => {\r\n this.isDownloaded = false;\r\n }, 2000);\r\n\r\n this.downloadButtonClicked.emit();\r\n }\r\n\r\n onShowCopyButton() {\r\n if (this.cellStyle === 'standard') {\r\n this.showStandardCopyButton = true;\r\n }\r\n }\r\n\r\n onHideCopyButton() {\r\n if (this.cellStyle === 'standard') {\r\n this.showStandardCopyButton = false;\r\n }\r\n }\r\n\r\n async copyToClipboard() {\r\n try {\r\n await navigator.clipboard.writeText(this.detail);\r\n this.copied = true;\r\n\r\n setTimeout(() => {\r\n this.copied = false;\r\n }, 2000); // Reset copied state after 2 seconds\r\n } catch (error) {\r\n console.error('Failed to copy:', error);\r\n }\r\n }\r\n\r\n render() {\r\n return (\r\n <div class={`detail_cell_div ${this.type} ${this.cellStyle}`} onMouseEnter={() => this.onShowCopyButton()} onMouseLeave={() => this.onHideCopyButton()}>\r\n {this.type === 'information' && this.cellStyle === 'standard' && (\r\n <>\r\n <div class=\"info_text_div\">\r\n <p class=\"label text-sm-regular\">{this.label}</p>\r\n <p class=\"detail text-md-medium\" onMouseEnter={() => (this.showTooltip = true)} onMouseLeave={() => (this.showTooltip = false)}>\r\n {this.detail}\r\n </p>\r\n {this.showTooltip && (\r\n <gb-tooltip show-arrow={false} class=\"information_text_tooltip\">\r\n <p slot=\"label\">{this.detail}</p>\r\n </gb-tooltip>\r\n )}\r\n </div>\r\n {this.showStandardCopyButton && (\r\n <gb-button size=\"sm\" hierarchy=\"tertiary_gray\" icon=\"only\" icon-leading=\"true\" icon-leading-swap=\"assets/copy.svg\" onClick={() => this.copyToClipboard()}></gb-button>\r\n )}\r\n {this.copied && (\r\n <gb-tooltip show-arrow={false} class=\"copied_tooltip\">\r\n <p slot=\"label\">Copied!</p>\r\n </gb-tooltip>\r\n )}\r\n </>\r\n )}\r\n {this.type === 'document' && this.cellStyle === 'standard' && (\r\n <>\r\n <gb-file-type-icon file-style={this.fileStyle} file-type={this.fileType}></gb-file-type-icon>\r\n <div class=\"document_text_div\">\r\n <p class=\"label text-sm-regular\">{this.label}</p>\r\n <p class=\"detail text-md-medium\" onMouseEnter={() => (this.showTooltip = true)} onMouseLeave={() => (this.showTooltip = false)}>\r\n {this.detail}\r\n </p>\r\n {this.showTooltip && (\r\n <gb-tooltip show-arrow={false} class=\"document_detail_tooltip\">\r\n <p slot=\"label\">{this.detail}</p>\r\n </gb-tooltip>\r\n )}\r\n </div>\r\n {!this.isDownloaded ? (\r\n <>\r\n {this.showActionButtons && (\r\n <>\r\n {this.showViewButton && (\r\n <gb-button\r\n size=\"sm\"\r\n hierarchy=\"tertiary_gray\"\r\n icon=\"only\"\r\n icon-leading=\"true\"\r\n icon-leading-swap=\"assets/view.svg\"\r\n onClick={() => this.onViewButtonClicked()}\r\n ></gb-button>\r\n )}\r\n {this.showDownloadButton && (\r\n <gb-button\r\n size=\"sm\"\r\n hierarchy=\"tertiary_gray\"\r\n icon=\"only\"\r\n icon-leading=\"true\"\r\n icon-leading-swap=\"assets/download-03.svg\"\r\n onClick={() => this.onDownloadButtonClicked()}\r\n ></gb-button>\r\n )}\r\n </>\r\n )}\r\n </>\r\n ) : (\r\n <gb-tooltip show-arrow={false} class=\"downloaded_tooltip\">\r\n <p slot=\"label\">Downloaded!</p>\r\n </gb-tooltip>\r\n )}\r\n </>\r\n )}\r\n {this.type === 'status' && this.cellStyle === 'standard' && (\r\n <div class=\"status_text_div\">\r\n <p class=\"label text-sm-regular\">{this.label}</p>\r\n <gb-badge size=\"sm\" type={this.badgeType} icon=\"dot\" color={this.badgeColor}>\r\n <p>{this.badgeLabel}</p>\r\n </gb-badge>\r\n </div>\r\n )}\r\n {this.type === 'information' && this.cellStyle === 'compact' && (\r\n <div class=\"compact_info_div\">\r\n <div class=\"compact_info_text_div\">\r\n <div class=\"compact_label\">\r\n <p class=\"label text-sm-regular\">{this.label}</p>\r\n </div>\r\n <div class=\"compact_detail\">\r\n <p class=\"detail_compact_text text-md-medium\">{this.detail}</p>\r\n {this.copied && (\r\n <gb-tooltip show-arrow={false} class=\"compact_copied_tooltip\">\r\n <p slot=\"label\">Copied!</p>\r\n </gb-tooltip>\r\n )}\r\n </div>\r\n {this.showCopyButton && (\r\n <gb-button\r\n size=\"sm\"\r\n hierarchy=\"tertiary_gray\"\r\n icon=\"only\"\r\n icon-leading=\"true\"\r\n icon-leading-swap=\"assets/copy.svg\"\r\n onClick={() => this.copyToClipboard()}\r\n ></gb-button>\r\n )}\r\n </div>\r\n </div>\r\n )}\r\n {this.type === 'document' && this.cellStyle === 'compact' && (\r\n <div class=\"compact_doc_div\">\r\n <gb-file-type-icon file-style={this.fileStyle} file-type={this.fileType}></gb-file-type-icon>\r\n <div class=\"compact_doc_text_div\">\r\n <p class=\"doc_label text-sm-regular\">{this.label}</p>\r\n <div class=\"compact_doc_detail\">\r\n <p class=\"detaill text-md-medium\" onMouseEnter={() => (this.showTooltip = true)} onMouseLeave={() => (this.showTooltip = false)}>\r\n {this.detail}\r\n </p>\r\n </div>\r\n {this.isDownloaded && (\r\n <gb-tooltip show-arrow={false} class=\"compact_downloaded_tooltip\">\r\n <p slot=\"label\">Downloaded!</p>\r\n </gb-tooltip>\r\n )}\r\n {this.showActionButtons && (\r\n <div class=\"button_container\">\r\n {this.showViewButton && (\r\n <gb-button\r\n size=\"sm\"\r\n hierarchy=\"tertiary_gray\"\r\n icon=\"only\"\r\n icon-leading=\"true\"\r\n icon-leading-swap=\"assets/view.svg\"\r\n onClick={() => this.onViewButtonClicked()}\r\n ></gb-button>\r\n )}\r\n {this.showDownloadButton && (\r\n <gb-button\r\n size=\"sm\"\r\n hierarchy=\"tertiary_gray\"\r\n icon=\"only\"\r\n icon-leading=\"true\"\r\n icon-leading-swap=\"assets/download-03.svg\"\r\n onClick={() => this.onDownloadButtonClicked()}\r\n ></gb-button>\r\n )}\r\n </div>\r\n )}\r\n </div>\r\n </div>\r\n )}\r\n {this.type === 'status' && this.cellStyle === 'compact' && (\r\n <div class=\"compact_status_div\">\r\n <div class=\"compact_status_text_div\">\r\n <div class=\"compact_label\">\r\n <p class=\"label text-sm-regular\">{this.label}</p>\r\n </div>\r\n <gb-badge size=\"sm\" type={this.badgeType} icon=\"dot\" color={this.badgeColor}>\r\n <p>{this.badgeLabel}</p>\r\n </gb-badge>\r\n </div>\r\n </div>\r\n )}\r\n </div>\r\n );\r\n }\r\n}\r\n"],"version":3}
|
|
1
|
+
{"file":"gb-detail-cell.js","mappings":"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","names":["GbDetailCell","__stencil_proxyCustomElement","HTMLElement"],"sources":["src/components/gb-detail-cell/gb-detail-cell.css?tag=gb-detail-cell&encapsulation=shadow","src/components/gb-detail-cell/gb-detail-cell.tsx"],"sourcesContent":["@import './../../global/global.css';\r\n\r\n:host {\r\n min-width: 0;\r\n width: 100%;\r\n}\r\n\r\n.detail_cell_div {\r\n display: flex;\r\n justify-content: space-between;\r\n align-items: center;\r\n border-bottom: 1px solid var(--color-border-subtler, #e3e8ef);\r\n cursor: pointer;\r\n position: relative;\r\n text-overflow: ellipsis;\r\n white-space: nowrap;\r\n gap: var(--spacing-2);\r\n}\r\n\r\n.detail_cell_div:hover {\r\n background: var(--color-background-gray-subtlest, #f6f8fa);\r\n}\r\n\r\n.detail_cell_div.standard {\r\n height: 5rem;\r\n padding: var(--spacing-none) var(--spacing-6);\r\n}\r\n\r\n.detail_cell_div.compact {\r\n padding: 0;\r\n}\r\n\r\n.info_text_div,\r\n.status_text_div,\r\n.document_text_div {\r\n overflow: hidden;\r\n text-overflow: ellipsis;\r\n white-space: nowrap;\r\n display: flex;\r\n flex-direction: column;\r\n gap: var(--spacing-3);\r\n flex: 1;\r\n}\r\n\r\n.status_text_div {\r\n gap: var(--spacing-2);\r\n}\r\n\r\n.label {\r\n color: var(--color-text-subtle, #697586);\r\n display: block; /* Ensure block or inline-block */\r\n max-width: 100%; /* Set a fixed or max width */\r\n white-space: nowrap; /* Prevent text from wrapping */\r\n overflow: hidden; /* Hide overflowing text */\r\n text-overflow: ellipsis; /* Apply ellipsis */\r\n flex: 1;\r\n min-width: 0; /* Ensure it can shrink properly */\r\n}\r\n\r\n.detail_div {\r\n width: 100%;\r\n overflow: hidden;\r\n}\r\n\r\n.detail {\r\n color: var(--color-text, #4b5565);\r\n display: block; /* Ensure block or inline-block */\r\n max-width: 100%; /* Set a fixed or max width */\r\n white-space: nowrap; /* Prevent text from wrapping */\r\n overflow: hidden; /* Hide overflowing text */\r\n text-overflow: ellipsis; /* Apply ellipsis */\r\n flex: 1;\r\n min-width: 0; /* Ensure it can shrink properly */\r\n}\r\n\r\n.information_text_tooltip {\r\n position: absolute;\r\n bottom: 90%;\r\n}\r\n\r\n.document_detail_tooltip {\r\n position: absolute;\r\n left: 4rem;\r\n bottom: 90%;\r\n}\r\n\r\n.copied_tooltip {\r\n position: absolute;\r\n right: 6rem;\r\n bottom: 3.5rem;\r\n}\r\n\r\n.downloaded_tooltip {\r\n position: absolute;\r\n right: 8rem;\r\n bottom: 3.5rem;\r\n}\r\n\r\n/* Compact Information Styles */\r\n.compact_info_div {\r\n display: flex;\r\n width: 100%;\r\n padding: var(--spacing-3) var(--spacing-2);\r\n align-items: center;\r\n}\r\n\r\n.compact_info_text_div {\r\n display: flex;\r\n min-height: 2.25rem;\r\n /* justify-content: space-between; */\r\n align-items: center;\r\n gap: var(--spacing-5);\r\n flex: 1 0 0;\r\n width: 100%;\r\n}\r\n\r\n.compact_detail {\r\n display: flex;\r\n flex-direction: column-reverse;\r\n flex: 1 0 0;\r\n align-items: flex-end;\r\n position: relative;\r\n flex-wrap: wrap;\r\n word-wrap: break-word; /* Ensures words break if needed */\r\n overflow-wrap: break-word; /* Helps in modern browsers */\r\n white-space: normal; /* Allows text wrapping */\r\n text-align: right; /* Keeps text aligned to the right */\r\n}\r\n\r\n.detail_compact_text {\r\n color: var(--color-text, #4b5565);\r\n word-break: break-word; /* Ensures long words break */\r\n overflow-wrap: anywhere; /* Allows breaking at any point */\r\n white-space: normal; /* Ensures wrapping is allowed */\r\n hyphens: auto;\r\n}\r\n\r\n.compact_copied_tooltip {\r\n position: absolute;\r\n right: 4rem;\r\n bottom: 2rem;\r\n}\r\n\r\n.compact_status_div {\r\n display: flex;\r\n width: 100%;\r\n padding: var(--spacing-3) var(--spacing-2);\r\n align-items: center;\r\n}\r\n\r\n.compact_status_text_div {\r\n display: flex;\r\n min-height: 2.25rem;\r\n justify-content: space-between;\r\n align-items: center;\r\n flex: 1 0 0;\r\n}\r\n\r\n.compact_doc_div {\r\n display: flex;\r\n width: 100%;\r\n justify-content: space-between;\r\n padding: var(--spacing-3) var(--spacing-2);\r\n align-items: center;\r\n gap: var(--spacing-2);\r\n}\r\n\r\n.compact_doc_text_div {\r\n display: flex;\r\n min-height: 2.25rem;\r\n align-items: center;\r\n gap: 1.25rem;\r\n flex: 1 0 0;\r\n}\r\n\r\n.compact_doc_textt_div {\r\n display: flex;\r\n flex-direction: column; /* Allows stacking if necessary */\r\n align-items: flex-start; /* Aligns text to the left */\r\n gap: 0.5rem;\r\n flex: 1 1 auto;\r\n word-wrap: break-word; /* Ensures words break properly */\r\n overflow-wrap: break-word;\r\n white-space: normal; /* Allows wrapping */\r\n max-width: 100%; /* Prevents overflow */\r\n}\r\n\r\n.compact_doc_detail {\r\n display: flex;\r\n flex: 1 0 0;\r\n text-align: right;\r\n justify-content: flex-end;\r\n}\r\n\r\n.doc_label {\r\n color: var(--color-text-subtle, #697586);\r\n display: block; /* Ensure block or inline-block */\r\n white-space: nowrap; /* Prevent text from wrapping */\r\n text-overflow: ellipsis; /* Apply ellipsis */\r\n}\r\n\r\n.detaill {\r\n max-width: 100%; /* Ensures it doesn’t stretch too far */\r\n word-break: break-word; /* Breaks long words */\r\n white-space: normal; /* Allows text to wrap */\r\n overflow-wrap: break-word;\r\n display: flex;\r\n color: var(--color-text, #4b5565);\r\n}\r\n\r\n.button_container {\r\n display: flex;\r\n align-items: center;\r\n gap: var(--spacing-2);\r\n}\r\n\r\n.downloaded_toolip_div {\r\n position: relative;\r\n width: 100%;\r\n}\r\n\r\n.compact_downloaded_tooltip {\r\n position: absolute;\r\n bottom: 3rem;\r\n right: 10rem;\r\n}\r\n","import { Component, Prop, State, h, Fragment, Event, EventEmitter } from '@stencil/core';\r\nimport { BadgeIconTypes, BadgeTypes, FileIconStyles, FileIconTypes, GeneralColors, GeneralStyles } from '../../models/reusableModels';\r\n\r\n@Component({\r\n tag: 'gb-detail-cell',\r\n styleUrl: 'gb-detail-cell.css',\r\n shadow: true,\r\n})\r\nexport class GbDetailCell {\r\n @Prop() state: 'default' | 'disabled';\r\n @Prop({ mutable: true }) cellStyle: GeneralStyles;\r\n @Prop() type: 'information' | 'document' | 'status';\r\n @Prop() label: string = '';\r\n @Prop() detail: string = '';\r\n @Prop() badgeIcon: BadgeIconTypes;\r\n @Prop() badgeIconLeading: string = '';\r\n @Prop() badgeIconTrailing: string = '';\r\n @Prop() badgeColor: GeneralColors;\r\n @Prop() badgeLabel: string = '';\r\n @Prop() badgeType: BadgeTypes;\r\n @Prop() fileType: FileIconTypes;\r\n @Prop() fileStyle: FileIconStyles;\r\n @Prop() showActionButtons: boolean = false;\r\n @Prop() showViewButton: boolean = false;\r\n @Prop() showDownloadButton: boolean = false;\r\n @Prop({ mutable: true }) showCopyButton: boolean = false;\r\n @State() showStandardCopyButton: boolean = false;\r\n @State() showTooltip: boolean = false;\r\n @State() copied: boolean = false;\r\n @State() isDownloaded: boolean = false;\r\n @State() width: number = window.innerWidth;\r\n @Event() viewButtonClicked: EventEmitter<void>;\r\n @Event() downloadButtonClicked: EventEmitter<void>;\r\n\r\n componentWillLoad() {\r\n this.updateCellStyle(); // Set initial variant\r\n window.addEventListener('resize', this.handleResize);\r\n }\r\n\r\n private handleResize = () => {\r\n this.width = window.innerWidth;\r\n this.updateCellStyle();\r\n };\r\n\r\n private updateCellStyle() {\r\n this.cellStyle = this.width < 768 ? 'compact' : this.cellStyle;\r\n }\r\n\r\n onViewButtonClicked() {\r\n this.viewButtonClicked.emit();\r\n }\r\n\r\n onDownloadButtonClicked() {\r\n this.isDownloaded = true;\r\n\r\n setTimeout(() => {\r\n this.isDownloaded = false;\r\n }, 2000);\r\n\r\n this.downloadButtonClicked.emit();\r\n }\r\n\r\n onShowCopyButton() {\r\n if (this.cellStyle === 'standard') {\r\n this.showStandardCopyButton = true;\r\n }\r\n }\r\n\r\n onHideCopyButton() {\r\n if (this.cellStyle === 'standard') {\r\n this.showStandardCopyButton = false;\r\n }\r\n }\r\n\r\n async copyToClipboard() {\r\n try {\r\n await navigator.clipboard.writeText(this.detail);\r\n this.copied = true;\r\n\r\n setTimeout(() => {\r\n this.copied = false;\r\n }, 2000); // Reset copied state after 2 seconds\r\n } catch (error) {\r\n console.error('Failed to copy:', error);\r\n }\r\n }\r\n\r\n render() {\r\n return (\r\n <div class={`detail_cell_div ${this.type} ${this.cellStyle}`} onMouseEnter={() => this.onShowCopyButton()} onMouseLeave={() => this.onHideCopyButton()}>\r\n {this.type === 'information' && this.cellStyle === 'standard' && (\r\n <>\r\n <div class=\"info_text_div\">\r\n <p class=\"label text-sm-regular\">{this.label}</p>\r\n <p class=\"detail text-md-medium\" onMouseEnter={() => (this.showTooltip = true)} onMouseLeave={() => (this.showTooltip = false)}>\r\n {this.detail}\r\n </p>\r\n {this.showTooltip && (\r\n <gb-tooltip show-arrow={false} class=\"information_text_tooltip\">\r\n <p slot=\"label\">{this.detail}</p>\r\n </gb-tooltip>\r\n )}\r\n </div>\r\n {this.showStandardCopyButton && (\r\n <gb-button size=\"sm\" hierarchy=\"tertiary_gray\" icon=\"only\" icon-leading=\"true\" icon-leading-swap=\"assets/copy.svg\" onClick={() => this.copyToClipboard()}></gb-button>\r\n )}\r\n {this.copied && (\r\n <gb-tooltip show-arrow={false} class=\"copied_tooltip\">\r\n <p slot=\"label\">Copied!</p>\r\n </gb-tooltip>\r\n )}\r\n </>\r\n )}\r\n {this.type === 'document' && this.cellStyle === 'standard' && (\r\n <>\r\n <gb-file-type-icon file-style={this.fileStyle} file-type={this.fileType}></gb-file-type-icon>\r\n <div class=\"document_text_div\">\r\n <p class=\"label text-sm-regular\">{this.label}</p>\r\n <p class=\"detail text-md-medium\" onMouseEnter={() => (this.showTooltip = true)} onMouseLeave={() => (this.showTooltip = false)}>\r\n {this.detail}\r\n </p>\r\n {this.showTooltip && (\r\n <gb-tooltip show-arrow={false} class=\"document_detail_tooltip\">\r\n <p slot=\"label\">{this.detail}</p>\r\n </gb-tooltip>\r\n )}\r\n </div>\r\n {!this.isDownloaded ? (\r\n <>\r\n {this.showActionButtons && (\r\n <>\r\n {this.showViewButton && (\r\n <gb-button\r\n size=\"sm\"\r\n hierarchy=\"tertiary_gray\"\r\n icon=\"only\"\r\n icon-leading=\"true\"\r\n icon-leading-swap=\"assets/view.svg\"\r\n onClick={() => this.onViewButtonClicked()}\r\n ></gb-button>\r\n )}\r\n {this.showDownloadButton && (\r\n <gb-button\r\n size=\"sm\"\r\n hierarchy=\"tertiary_gray\"\r\n icon=\"only\"\r\n icon-leading=\"true\"\r\n icon-leading-swap=\"assets/download-03.svg\"\r\n onClick={() => this.onDownloadButtonClicked()}\r\n ></gb-button>\r\n )}\r\n </>\r\n )}\r\n </>\r\n ) : (\r\n <gb-tooltip show-arrow={false} class=\"downloaded_tooltip\">\r\n <p slot=\"label\">Downloaded!</p>\r\n </gb-tooltip>\r\n )}\r\n </>\r\n )}\r\n {this.type === 'status' && this.cellStyle === 'standard' && (\r\n <div class=\"status_text_div\">\r\n <p class=\"label text-sm-regular\">{this.label}</p>\r\n <gb-badge size=\"sm\" type={this.badgeType} icon={this.badgeIcon} color={this.badgeColor} icon-leading-swap={this.badgeIconLeading} icon-trailing-swap={this.badgeIconTrailing}>\r\n <p>{this.badgeLabel}</p>\r\n </gb-badge>\r\n </div>\r\n )}\r\n {this.type === 'information' && this.cellStyle === 'compact' && (\r\n <div class=\"compact_info_div\">\r\n <div class=\"compact_info_text_div\">\r\n <div class=\"compact_label\">\r\n <p class=\"label text-sm-regular\">{this.label}</p>\r\n </div>\r\n <div class=\"compact_detail\">\r\n <p class=\"detail_compact_text text-md-medium\">{this.detail}</p>\r\n {this.copied && (\r\n <gb-tooltip show-arrow={false} class=\"compact_copied_tooltip\">\r\n <p slot=\"label\">Copied!</p>\r\n </gb-tooltip>\r\n )}\r\n </div>\r\n {this.showCopyButton && (\r\n <gb-button\r\n size=\"sm\"\r\n hierarchy=\"tertiary_gray\"\r\n icon=\"only\"\r\n icon-leading=\"true\"\r\n icon-leading-swap=\"assets/copy.svg\"\r\n onClick={() => this.copyToClipboard()}\r\n ></gb-button>\r\n )}\r\n </div>\r\n </div>\r\n )}\r\n {this.type === 'document' && this.cellStyle === 'compact' && (\r\n <div class=\"compact_doc_div\">\r\n <gb-file-type-icon file-style={this.fileStyle} file-type={this.fileType}></gb-file-type-icon>\r\n <div class=\"compact_doc_text_div\">\r\n <p class=\"doc_label text-sm-regular\">{this.label}</p>\r\n <div class=\"compact_doc_detail\">\r\n <p class=\"detaill text-md-medium\" onMouseEnter={() => (this.showTooltip = true)} onMouseLeave={() => (this.showTooltip = false)}>\r\n {this.detail}\r\n </p>\r\n </div>\r\n {this.isDownloaded && (\r\n <gb-tooltip show-arrow={false} class=\"compact_downloaded_tooltip\">\r\n <p slot=\"label\">Downloaded!</p>\r\n </gb-tooltip>\r\n )}\r\n {this.showActionButtons && (\r\n <div class=\"button_container\">\r\n {this.showViewButton && (\r\n <gb-button\r\n size=\"sm\"\r\n hierarchy=\"tertiary_gray\"\r\n icon=\"only\"\r\n icon-leading=\"true\"\r\n icon-leading-swap=\"assets/view.svg\"\r\n onClick={() => this.onViewButtonClicked()}\r\n ></gb-button>\r\n )}\r\n {this.showDownloadButton && (\r\n <gb-button\r\n size=\"sm\"\r\n hierarchy=\"tertiary_gray\"\r\n icon=\"only\"\r\n icon-leading=\"true\"\r\n icon-leading-swap=\"assets/download-03.svg\"\r\n onClick={() => this.onDownloadButtonClicked()}\r\n ></gb-button>\r\n )}\r\n </div>\r\n )}\r\n </div>\r\n </div>\r\n )}\r\n {this.type === 'status' && this.cellStyle === 'compact' && (\r\n <div class=\"compact_status_div\">\r\n <div class=\"compact_status_text_div\">\r\n <div class=\"compact_label\">\r\n <p class=\"label text-sm-regular\">{this.label}</p>\r\n </div>\r\n <gb-badge size=\"sm\" type={this.badgeType} icon=\"dot\" color={this.badgeColor}>\r\n <p>{this.badgeLabel}</p>\r\n </gb-badge>\r\n </div>\r\n </div>\r\n )}\r\n </div>\r\n );\r\n }\r\n}\r\n"],"version":3}
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import { p as proxyCustomElement, H, h } from './p-C_NOJI7O.js';
|
|
2
2
|
import { d as defineCustomElement$7 } from './p-58s1T6zX.js';
|
|
3
3
|
import { d as defineCustomElement$6 } from './p-CXLJa2-n.js';
|
|
4
|
-
import { d as defineCustomElement$5 } from './p-
|
|
4
|
+
import { d as defineCustomElement$5 } from './p-rvs_81wL.js';
|
|
5
5
|
import { d as defineCustomElement$4 } from './p-BC9XJeP1.js';
|
|
6
6
|
import { d as defineCustomElement$3 } from './p-DNVipIEI.js';
|
|
7
7
|
import { d as defineCustomElement$2 } from './p-CQGTfRDL.js';
|