globuswebcomponents 2.14.3 → 2.14.4
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-action-panel_67.cjs.entry.js +34 -16
- package/dist/cjs/gb-modal.cjs.entry.js +1 -2
- package/dist/cjs/gb-modal.entry.cjs.js.map +1 -1
- package/dist/collection/components/gb-date-picker/gb-date-picker.js +5 -4
- package/dist/collection/components/gb-date-picker/gb-date-picker.js.map +1 -1
- package/dist/collection/components/gb-modal/gb-modal.js +1 -2
- package/dist/collection/components/gb-modal/gb-modal.js.map +1 -1
- package/dist/collection/components/gb-stepper-horizontal-icons-centered/gb-stepper-horizontal-icons-centered.js +1 -2
- package/dist/collection/components/gb-stepper-horizontal-icons-centered/gb-stepper-horizontal-icons-centered.js.map +1 -1
- package/dist/collection/components/gb-table/gb-table.js +28 -8
- package/dist/collection/components/gb-table/gb-table.js.map +1 -1
- package/dist/collection/components/gb-table-header/gb-table-header.js +2 -3
- package/dist/collection/components/gb-table-header/gb-table-header.js.map +1 -1
- package/dist/components/gb-date-picker.js +1 -1
- package/dist/components/gb-filter-modal.js +1 -1
- package/dist/components/gb-modal.js +1 -2
- package/dist/components/gb-modal.js.map +1 -1
- package/dist/components/gb-stepper-horizontal-icons-centered.js +1 -2
- package/dist/components/gb-stepper-horizontal-icons-centered.js.map +1 -1
- package/dist/components/gb-table-header.js +1 -1
- package/dist/components/gb-table.js +29 -10
- package/dist/components/gb-table.js.map +1 -1
- package/dist/components/{p-CVFUF7Jf.js → p-B8o86Fu9.js} +5 -6
- package/dist/components/p-B8o86Fu9.js.map +1 -0
- package/dist/components/{p-DUaQzOE2.js → p-BnfYep32.js} +7 -6
- package/dist/components/{p-DUaQzOE2.js.map → p-BnfYep32.js.map} +1 -1
- package/dist/components/{p-Dg4_wWPZ.js → p-D1d9Mgpu.js} +3 -3
- package/dist/components/{p-Dg4_wWPZ.js.map → p-D1d9Mgpu.js.map} +1 -1
- package/dist/docs.json +8 -2
- package/dist/esm/gb-action-panel_67.entry.js +34 -16
- package/dist/esm/gb-modal.entry.js +1 -2
- package/dist/esm/gb-modal.entry.js.map +1 -1
- package/dist/globuscomponents/gb-modal.entry.esm.js.map +1 -1
- package/dist/globuscomponents/globuscomponents.esm.js +1 -1
- package/dist/globuscomponents/{p-d3773d27.entry.js → p-22e3afeb.entry.js} +2 -2
- package/dist/globuscomponents/p-22e3afeb.entry.js.map +1 -0
- package/dist/globuscomponents/p-983944cd.entry.js +2 -0
- package/dist/globuscomponents/p-983944cd.entry.js.map +1 -0
- package/dist/types/components.d.ts +6 -0
- package/package.json +1 -1
- package/dist/components/p-CVFUF7Jf.js.map +0 -1
- package/dist/globuscomponents/p-d3773d27.entry.js.map +0 -1
- package/dist/globuscomponents/p-d81ea038.entry.js +0 -2
- package/dist/globuscomponents/p-d81ea038.entry.js.map +0 -1
|
@@ -73,7 +73,6 @@ export class GbTableHeader {
|
|
|
73
73
|
this.filterButtonClicked.emit();
|
|
74
74
|
}
|
|
75
75
|
emitSelection(selection) {
|
|
76
|
-
console.log(selection);
|
|
77
76
|
this.exportClicked.emit(selection);
|
|
78
77
|
}
|
|
79
78
|
onRefreshButtonClicked() {
|
|
@@ -95,10 +94,10 @@ export class GbTableHeader {
|
|
|
95
94
|
window.removeEventListener('resize', this.handleResize);
|
|
96
95
|
}
|
|
97
96
|
render() {
|
|
98
|
-
return (h("div", { key: '
|
|
97
|
+
return (h("div", { key: '8ce84e66b3cb98a2c992cf92ad6944909dc88b65', class: "table_header_div" }, this.tableHeading && h("p", { key: 'ca07d7494ddc0b83ccc34e834aa019e6948dba1b', class: "table_heading text-lg-semi-bold" }, this.tableHeadingLabel), this.showDateFilter && (h("div", { key: 'eb0842b660509b5ede0a7d38c467e25d49331e23', class: "date_filters" }, h("div", { key: 'df5c9742a6c78fec416a10e3d6e5fd853a248a12', class: "date_input" }, h("gb-date-picker", { key: '488c08ef921c0a8f43c76786fb4b100d7d7ca9f7', mode: this.mode, disabled: this.datePickerDisabled, format: this.format, "icon-position": this.datePickerIconPosition, placeholder: this.datePickerPlaceholder, "dropdown-alignment": this.datePickerDropdownPosition, "enable-time": this.enableTime, "no-calendar": this.noCalendar, "twentyfour-hr": this.twentyfourHr, "show-months": this.showMonths, "full-width": this.isDatePickerFullWidth, onDateChange: this.emitDateSelected.bind(this) })))), h("div", { key: '5a6aa3d20584b26bfb24ff53fe03e12e541435e9', class: `actions ${!this.showDateFilter && !this.tableHeading ? 'full_width' : ''}` }, this.showSearch && (h("div", { key: 'ef79933d7c7e7887614d708dc1763c94ffe014ec', class: "input_field" }, h("gb-input-field", { key: 'a6163c02df5a2f0c05aaaefa9d830d8294ed68cd', size: "sm", type: "icon_leading", "icon-swap": "assets/search-01.svg", placeholder: this.inputPlaceholder, "enable-cancel-button-function": true, onInputValueChanged: this.emitValue.bind(this) }))), h("div", { key: '166caa2e8952954e3089c8684523ed8511f95b3b', class: "action" }, this.showLayoutToggle && h("gb-button-group", { key: 'b19ed4040494d48ad2251142569be7c3a77cba18', items: this.items, icon: "only", onOptionChange: this.onLayoutButtonClicked.bind(this) }), this.showColumnOptions && this.width > 768 && (h("gb-button", { key: '9c1225d3593964584f66803ab426ea781d635907', size: "md", hierarchy: "secondary_gray", icon: this.width <= 1007 ? 'only' : 'default', "icon-leading": true, "icon-leading-swap": "assets/column-insert.svg", onClick: () => this.onColumnOptionsButtonClicked() }, h("p", { key: 'f5f5eb9dd6e88c95236c6698951eb6c713f806a5' }, "Columns"))), this.showFilter && (h("gb-filter-button", { key: 'f0174fd2e26841f595138c9dca302a96924bc3cd', state: this.filterState, "icon-only": this.width <= 1007 ? true : false, onClick: () => this.onFilterButtonClicked() }, h("p", { key: 'cc1c96e1a78a1da8b4dd6fec8a57371afe2af5a1', slot: "filter_count" }, this.filterCount))), this.showExport && (h("div", { key: '0ff5d1533933cf94d99aeb2afb1e45e374f4ec6a', class: "export" }, h("gb-button", { key: '91da67986a1919a8e52bf9f85369f6211293a6ea', size: "md", state: this.exportButtonState, hierarchy: "secondary_gray", icon: this.width <= 1007 ? 'only' : 'default', "icon-leading": true, "icon-leading-swap": "assets/file-export.svg", "icon-trailing": this.width <= 1007 ? false : true, "icon-trailing-swap": "assets/arrow-down-01.svg", onClick: e => {
|
|
99
98
|
e.stopPropagation();
|
|
100
99
|
this.toggleDropdown();
|
|
101
|
-
} }, h("p", { key: '
|
|
100
|
+
} }, h("p", { key: 'b4fdab578851ea5d1872c613ed14c310086960c4' }, "Export")), this.showExportDropdown && (h("gb-export-dropdown", { key: '616c0540a8faa62da0419e2c89d6ce35b8a5af91', ref: el => (this.exportDropdown = el), "show-entire-data": this.showEntireData, "pdf-state": this.pdfState, "csv-state": this.csvState, onExportClicked: event => this.emitSelection(event.detail), class: `dropdown ${this.exportDropdownPosition}` })))), this.showRefreshButton && (h("div", { key: 'c3b1c82a95689e43200402c4d2e4c5619f8b517e', class: "refresh_button" }, h("gb-button", { key: '4dc49f709e1bcc6ab355219af596e57f40107496', size: "md", hierarchy: "secondary_gray", icon: this.width <= 1007 ? 'only' : 'default', "icon-leading": true, "icon-leading-swap": "assets/refresh.svg", onClick: () => this.onRefreshButtonClicked() })))))));
|
|
102
101
|
}
|
|
103
102
|
static get is() { return "gb-table-header"; }
|
|
104
103
|
static get encapsulation() { return "shadow"; }
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"gb-table-header.js","sourceRoot":"","sources":["../../../src/components/gb-table-header/gb-table-header.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, Element, Event, EventEmitter, Listen, Prop, State, h } from '@stencil/core';\r\nimport { CloseButtonPositions, StateEnum, StateType } from '../../models/reusableModels';\r\n\r\n@Component({\r\n tag: 'gb-table-header',\r\n styleUrl: 'gb-table-header.css',\r\n shadow: true,\r\n})\r\nexport class GbTableHeader {\r\n @Prop() showFilter: boolean = false;\r\n @Prop() showColumnOptions: boolean = false;\r\n @Prop() tableHeading: boolean = false;\r\n @Prop() tableHeadingLabel: string = '';\r\n @Prop() showSearch: boolean = false;\r\n @Prop() showExport: boolean = false;\r\n @Prop() showRefreshButton: boolean = false;\r\n @Prop() showLayoutToggle: boolean = false;\r\n @Prop() filterState: StateType;\r\n @Prop() filterCount: number = 0;\r\n @Prop() showEntireData: boolean = false;\r\n @Prop() exportButtonState: StateType = 'default';\r\n @Prop() pdfState: StateEnum = StateEnum.Default;\r\n @Prop() csvState: StateEnum = StateEnum.Default;\r\n @Prop() showDateFilter: boolean = false;\r\n @State() items = [\r\n { label: 'grid', current: false, icon: 'assets/grid-view.svg' },\r\n { label: 'list', current: true, icon: 'assets/left-to-right-list-dash.svg' },\r\n ];\r\n @Prop() mode: 'single' | 'range' = 'single';\r\n @Prop() format: string = 'M j, Y';\r\n @Prop() datePickerDisabled: boolean = false;\r\n @Prop() datePickerPlaceholder: string = 'Start date - end date';\r\n @Prop() datePickerIconPosition: CloseButtonPositions = 'left';\r\n @Prop() datePickerDropdownPosition: CloseButtonPositions = 'left';\r\n @Prop() exportDropdownPosition: CloseButtonPositions = 'right';\r\n @Prop() enableTime: boolean = false;\r\n @Prop() noCalendar: boolean = false;\r\n @Prop() twentyfourHr: boolean = false;\r\n @Prop() showMonths: number = 2;\r\n @Prop() inputPlaceholder: string = 'Search';\r\n @State() width: number = window.innerWidth;\r\n @State() buttonIcon: 'default' | 'only';\r\n @State() showExportDropdown: boolean = false;\r\n @State() isDatePickerShown: boolean = false;\r\n @State() isDatePickerFullWidth: boolean = false;\r\n @Event() inputValueChanged: EventEmitter<void>;\r\n @Event() filterButtonClicked: EventEmitter<void>;\r\n @Event() exportClicked: EventEmitter<{ dataType: string; exportType: string }>;\r\n @Event() refreshButtonClicked: EventEmitter<void>;\r\n @Event() layoutButtonClicked: EventEmitter<string>;\r\n @Event() columnOptionsButtonClicked: EventEmitter<string>;\r\n @Event() dateChange: EventEmitter<string | string[]>;\r\n @Element() el: HTMLElement;\r\n\r\n exportDropdown!: HTMLElement;\r\n\r\n isMobile = this.width < 768;\r\n\r\n componentDidLoad() {\r\n document.addEventListener('click', this.handleClickOutside.bind(this));\r\n }\r\n\r\n componentWillLoad() {\r\n this.updateParameters();\r\n window.addEventListener('resize', this.handleResize.bind(this));\r\n }\r\n\r\n // extractDropdownItemSelected(item) {\r\n // if (item.detail === 'Custom') {\r\n // this.isDatePickerShown = true;\r\n // } else {\r\n // this.isDatePickerShown = false;\r\n // }\r\n // }\r\n\r\n emitDateSelected(date) {\r\n this.dateChange.emit(date.detail);\r\n }\r\n\r\n toggleDropdown() {\r\n this.showExportDropdown = !this.showExportDropdown;\r\n }\r\n\r\n @Listen('resize', { target: 'window' })\r\n handleResize() {\r\n this.width = window.innerWidth;\r\n this.updateParameters();\r\n }\r\n\r\n private updateParameters() {\r\n this.buttonIcon = this.width < 1007 ? 'only' : 'default';\r\n this.isDatePickerFullWidth = this.width <= 700 ? true : false;\r\n }\r\n\r\n emitValue(inputValue) {\r\n this.inputValueChanged.emit(inputValue);\r\n }\r\n\r\n onFilterButtonClicked() {\r\n this.filterButtonClicked.emit();\r\n }\r\n\r\n emitSelection(selection) {\r\n console.log(selection)\r\n this.exportClicked.emit(selection);\r\n }\r\n\r\n onRefreshButtonClicked() {\r\n this.refreshButtonClicked.emit();\r\n }\r\n\r\n onColumnOptionsButtonClicked() {\r\n this.columnOptionsButtonClicked.emit();\r\n }\r\n\r\n onLayoutButtonClicked(layout) {\r\n this.layoutButtonClicked.emit(layout.detail);\r\n }\r\n\r\n @Listen('click', { target: 'document' })\r\n handleClickOutside(event: MouseEvent) {\r\n if (this.showExportDropdown && !this.el.contains(event.target as Node)) {\r\n this.showExportDropdown = false;\r\n }\r\n }\r\n\r\n disconnectedCallback() {\r\n document.removeEventListener('click', this.handleClickOutside);\r\n window.removeEventListener('resize', this.handleResize);\r\n }\r\n\r\n render() {\r\n return (\r\n <div class=\"table_header_div\">\r\n {this.tableHeading && <p class=\"table_heading text-lg-semi-bold\">{this.tableHeadingLabel}</p>}\r\n {this.showDateFilter && (\r\n <div class=\"date_filters\">\r\n <div class=\"date_input\">\r\n <gb-date-picker\r\n mode={this.mode}\r\n disabled={this.datePickerDisabled}\r\n format={this.format}\r\n icon-position={this.datePickerIconPosition}\r\n placeholder={this.datePickerPlaceholder}\r\n dropdown-alignment={this.datePickerDropdownPosition}\r\n enable-time={this.enableTime}\r\n no-calendar={this.noCalendar}\r\n twentyfour-hr={this.twentyfourHr}\r\n show-months={this.showMonths}\r\n full-width={this.isDatePickerFullWidth}\r\n onDateChange={this.emitDateSelected.bind(this)}\r\n ></gb-date-picker>\r\n </div>\r\n </div>\r\n )}\r\n <div class={`actions ${!this.showDateFilter && !this.tableHeading ? 'full_width' : ''}`}>\r\n {this.showSearch && (\r\n <div class=\"input_field\">\r\n <gb-input-field\r\n size=\"sm\"\r\n type=\"icon_leading\"\r\n icon-swap=\"assets/search-01.svg\"\r\n placeholder={this.inputPlaceholder}\r\n enable-cancel-button-function={true}\r\n onInputValueChanged={this.emitValue.bind(this)}\r\n ></gb-input-field>\r\n </div>\r\n )}\r\n <div class=\"action\">\r\n {this.showLayoutToggle && <gb-button-group items={this.items} icon=\"only\" onOptionChange={this.onLayoutButtonClicked.bind(this)}></gb-button-group>}\r\n {this.showColumnOptions && this.width > 768 && (\r\n <gb-button\r\n size=\"md\"\r\n hierarchy=\"secondary_gray\"\r\n icon={this.width <= 1007 ? 'only' : 'default'}\r\n icon-leading={true}\r\n icon-leading-swap=\"assets/column-insert.svg\"\r\n onClick={() => this.onColumnOptionsButtonClicked()}\r\n >\r\n <p>Columns</p>\r\n </gb-button>\r\n )}\r\n {this.showFilter && (\r\n <gb-filter-button state={this.filterState} icon-only={this.width <= 1007 ? true : false} onClick={() => this.onFilterButtonClicked()}>\r\n <p slot=\"filter_count\">{this.filterCount}</p>\r\n </gb-filter-button>\r\n )}\r\n {this.showExport && (\r\n <div class=\"export\">\r\n <gb-button\r\n size=\"md\"\r\n state={this.exportButtonState}\r\n hierarchy=\"secondary_gray\"\r\n icon={this.width <= 1007 ? 'only' : 'default'}\r\n icon-leading={true}\r\n icon-leading-swap=\"assets/file-export.svg\"\r\n icon-trailing={this.width <= 1007 ? false : true}\r\n icon-trailing-swap=\"assets/arrow-down-01.svg\"\r\n onClick={e => {\r\n e.stopPropagation();\r\n this.toggleDropdown();\r\n }}\r\n >\r\n <p>Export</p>\r\n </gb-button>\r\n {this.showExportDropdown && (\r\n <gb-export-dropdown\r\n ref={el => (this.exportDropdown = el)}\r\n show-entire-data={this.showEntireData}\r\n pdf-state={this.pdfState}\r\n csv-state={this.csvState}\r\n onExportClicked={event => this.emitSelection(event.detail)}\r\n class={`dropdown ${this.exportDropdownPosition}`}\r\n ></gb-export-dropdown>\r\n )}\r\n </div>\r\n )}\r\n {this.showRefreshButton && (\r\n <div class=\"refresh_button\">\r\n <gb-button\r\n size=\"md\"\r\n hierarchy=\"secondary_gray\"\r\n icon={this.width <= 1007 ? 'only' : 'default'}\r\n icon-leading={true}\r\n icon-leading-swap=\"assets/refresh.svg\"\r\n onClick={() => this.onRefreshButtonClicked()}\r\n ></gb-button>\r\n </div>\r\n )}\r\n </div>\r\n </div>\r\n </div>\r\n );\r\n }\r\n}\r\n"]}
|
|
1
|
+
{"version":3,"file":"gb-table-header.js","sourceRoot":"","sources":["../../../src/components/gb-table-header/gb-table-header.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, Element, Event, EventEmitter, Listen, Prop, State, h } from '@stencil/core';\r\nimport { CloseButtonPositions, StateEnum, StateType } from '../../models/reusableModels';\r\n\r\n@Component({\r\n tag: 'gb-table-header',\r\n styleUrl: 'gb-table-header.css',\r\n shadow: true,\r\n})\r\nexport class GbTableHeader {\r\n @Prop() showFilter: boolean = false;\r\n @Prop() showColumnOptions: boolean = false;\r\n @Prop() tableHeading: boolean = false;\r\n @Prop() tableHeadingLabel: string = '';\r\n @Prop() showSearch: boolean = false;\r\n @Prop() showExport: boolean = false;\r\n @Prop() showRefreshButton: boolean = false;\r\n @Prop() showLayoutToggle: boolean = false;\r\n @Prop() filterState: StateType;\r\n @Prop() filterCount: number = 0;\r\n @Prop() showEntireData: boolean = false;\r\n @Prop() exportButtonState: StateType = 'default';\r\n @Prop() pdfState: StateEnum = StateEnum.Default;\r\n @Prop() csvState: StateEnum = StateEnum.Default;\r\n @Prop() showDateFilter: boolean = false;\r\n @State() items = [\r\n { label: 'grid', current: false, icon: 'assets/grid-view.svg' },\r\n { label: 'list', current: true, icon: 'assets/left-to-right-list-dash.svg' },\r\n ];\r\n @Prop() mode: 'single' | 'range' = 'single';\r\n @Prop() format: string = 'M j, Y';\r\n @Prop() datePickerDisabled: boolean = false;\r\n @Prop() datePickerPlaceholder: string = 'Start date - end date';\r\n @Prop() datePickerIconPosition: CloseButtonPositions = 'left';\r\n @Prop() datePickerDropdownPosition: CloseButtonPositions = 'left';\r\n @Prop() exportDropdownPosition: CloseButtonPositions = 'right';\r\n @Prop() enableTime: boolean = false;\r\n @Prop() noCalendar: boolean = false;\r\n @Prop() twentyfourHr: boolean = false;\r\n @Prop() showMonths: number = 2;\r\n @Prop() inputPlaceholder: string = 'Search';\r\n @State() width: number = window.innerWidth;\r\n @State() buttonIcon: 'default' | 'only';\r\n @State() showExportDropdown: boolean = false;\r\n @State() isDatePickerShown: boolean = false;\r\n @State() isDatePickerFullWidth: boolean = false;\r\n @Event() inputValueChanged: EventEmitter<void>;\r\n @Event() filterButtonClicked: EventEmitter<void>;\r\n @Event() exportClicked: EventEmitter<{ dataType: string; exportType: string }>;\r\n @Event() refreshButtonClicked: EventEmitter<void>;\r\n @Event() layoutButtonClicked: EventEmitter<string>;\r\n @Event() columnOptionsButtonClicked: EventEmitter<string>;\r\n @Event({ bubbles: true, composed: true }) dateChange: EventEmitter<string | string[]>;\r\n @Element() el: HTMLElement;\r\n\r\n exportDropdown!: HTMLElement;\r\n\r\n isMobile = this.width < 768;\r\n\r\n componentDidLoad() {\r\n document.addEventListener('click', this.handleClickOutside.bind(this));\r\n }\r\n\r\n componentWillLoad() {\r\n this.updateParameters();\r\n window.addEventListener('resize', this.handleResize.bind(this));\r\n }\r\n\r\n // extractDropdownItemSelected(item) {\r\n // if (item.detail === 'Custom') {\r\n // this.isDatePickerShown = true;\r\n // } else {\r\n // this.isDatePickerShown = false;\r\n // }\r\n // }\r\n\r\n emitDateSelected(date) {\r\n this.dateChange.emit(date.detail);\r\n }\r\n\r\n toggleDropdown() {\r\n this.showExportDropdown = !this.showExportDropdown;\r\n }\r\n\r\n @Listen('resize', { target: 'window' })\r\n handleResize() {\r\n this.width = window.innerWidth;\r\n this.updateParameters();\r\n }\r\n\r\n private updateParameters() {\r\n this.buttonIcon = this.width < 1007 ? 'only' : 'default';\r\n this.isDatePickerFullWidth = this.width <= 700 ? true : false;\r\n }\r\n\r\n emitValue(inputValue) {\r\n this.inputValueChanged.emit(inputValue);\r\n }\r\n\r\n onFilterButtonClicked() {\r\n this.filterButtonClicked.emit();\r\n }\r\n\r\n emitSelection(selection) {\r\n this.exportClicked.emit(selection);\r\n }\r\n\r\n onRefreshButtonClicked() {\r\n this.refreshButtonClicked.emit();\r\n }\r\n\r\n onColumnOptionsButtonClicked() {\r\n this.columnOptionsButtonClicked.emit();\r\n }\r\n\r\n onLayoutButtonClicked(layout) {\r\n this.layoutButtonClicked.emit(layout.detail);\r\n }\r\n\r\n @Listen('click', { target: 'document' })\r\n handleClickOutside(event: MouseEvent) {\r\n if (this.showExportDropdown && !this.el.contains(event.target as Node)) {\r\n this.showExportDropdown = false;\r\n }\r\n }\r\n\r\n disconnectedCallback() {\r\n document.removeEventListener('click', this.handleClickOutside);\r\n window.removeEventListener('resize', this.handleResize);\r\n }\r\n\r\n render() {\r\n return (\r\n <div class=\"table_header_div\">\r\n {this.tableHeading && <p class=\"table_heading text-lg-semi-bold\">{this.tableHeadingLabel}</p>}\r\n {this.showDateFilter && (\r\n <div class=\"date_filters\">\r\n <div class=\"date_input\">\r\n <gb-date-picker\r\n mode={this.mode}\r\n disabled={this.datePickerDisabled}\r\n format={this.format}\r\n icon-position={this.datePickerIconPosition}\r\n placeholder={this.datePickerPlaceholder}\r\n dropdown-alignment={this.datePickerDropdownPosition}\r\n enable-time={this.enableTime}\r\n no-calendar={this.noCalendar}\r\n twentyfour-hr={this.twentyfourHr}\r\n show-months={this.showMonths}\r\n full-width={this.isDatePickerFullWidth}\r\n onDateChange={this.emitDateSelected.bind(this)}\r\n ></gb-date-picker>\r\n </div>\r\n </div>\r\n )}\r\n <div class={`actions ${!this.showDateFilter && !this.tableHeading ? 'full_width' : ''}`}>\r\n {this.showSearch && (\r\n <div class=\"input_field\">\r\n <gb-input-field\r\n size=\"sm\"\r\n type=\"icon_leading\"\r\n icon-swap=\"assets/search-01.svg\"\r\n placeholder={this.inputPlaceholder}\r\n enable-cancel-button-function={true}\r\n onInputValueChanged={this.emitValue.bind(this)}\r\n ></gb-input-field>\r\n </div>\r\n )}\r\n <div class=\"action\">\r\n {this.showLayoutToggle && <gb-button-group items={this.items} icon=\"only\" onOptionChange={this.onLayoutButtonClicked.bind(this)}></gb-button-group>}\r\n {this.showColumnOptions && this.width > 768 && (\r\n <gb-button\r\n size=\"md\"\r\n hierarchy=\"secondary_gray\"\r\n icon={this.width <= 1007 ? 'only' : 'default'}\r\n icon-leading={true}\r\n icon-leading-swap=\"assets/column-insert.svg\"\r\n onClick={() => this.onColumnOptionsButtonClicked()}\r\n >\r\n <p>Columns</p>\r\n </gb-button>\r\n )}\r\n {this.showFilter && (\r\n <gb-filter-button state={this.filterState} icon-only={this.width <= 1007 ? true : false} onClick={() => this.onFilterButtonClicked()}>\r\n <p slot=\"filter_count\">{this.filterCount}</p>\r\n </gb-filter-button>\r\n )}\r\n {this.showExport && (\r\n <div class=\"export\">\r\n <gb-button\r\n size=\"md\"\r\n state={this.exportButtonState}\r\n hierarchy=\"secondary_gray\"\r\n icon={this.width <= 1007 ? 'only' : 'default'}\r\n icon-leading={true}\r\n icon-leading-swap=\"assets/file-export.svg\"\r\n icon-trailing={this.width <= 1007 ? false : true}\r\n icon-trailing-swap=\"assets/arrow-down-01.svg\"\r\n onClick={e => {\r\n e.stopPropagation();\r\n this.toggleDropdown();\r\n }}\r\n >\r\n <p>Export</p>\r\n </gb-button>\r\n {this.showExportDropdown && (\r\n <gb-export-dropdown\r\n ref={el => (this.exportDropdown = el)}\r\n show-entire-data={this.showEntireData}\r\n pdf-state={this.pdfState}\r\n csv-state={this.csvState}\r\n onExportClicked={event => this.emitSelection(event.detail)}\r\n class={`dropdown ${this.exportDropdownPosition}`}\r\n ></gb-export-dropdown>\r\n )}\r\n </div>\r\n )}\r\n {this.showRefreshButton && (\r\n <div class=\"refresh_button\">\r\n <gb-button\r\n size=\"md\"\r\n hierarchy=\"secondary_gray\"\r\n icon={this.width <= 1007 ? 'only' : 'default'}\r\n icon-leading={true}\r\n icon-leading-swap=\"assets/refresh.svg\"\r\n onClick={() => this.onRefreshButtonClicked()}\r\n ></gb-button>\r\n </div>\r\n )}\r\n </div>\r\n </div>\r\n </div>\r\n );\r\n }\r\n}\r\n"]}
|
|
@@ -62,7 +62,6 @@ const GbModal$1 = /*@__PURE__*/ proxyCustomElement(class GbModal extends H {
|
|
|
62
62
|
}
|
|
63
63
|
}
|
|
64
64
|
closeModalButtonClicked() {
|
|
65
|
-
console.log('Clicked');
|
|
66
65
|
this.closeModalClicked.emit();
|
|
67
66
|
}
|
|
68
67
|
firstButtonClickedOnModalAction() {
|
|
@@ -75,7 +74,7 @@ const GbModal$1 = /*@__PURE__*/ proxyCustomElement(class GbModal extends H {
|
|
|
75
74
|
this.thirdButtonClicked.emit();
|
|
76
75
|
}
|
|
77
76
|
render() {
|
|
78
|
-
return (h("div", { key: '
|
|
77
|
+
return (h("div", { key: '3e044cedfd990ca5ab502d055d863b03f6819f67', class: "overlay" }, h("div", { key: 'cc3fcc0da0665bda76ff472dd6f7e0837263677a', class: "modal_wrapper", style: { width: this.width } }, h("div", { key: 'fce3e4474bbc7ce44a8828ab5e6664511313270e', class: "modal_header" }, h("gb-modal-header", { key: 'f178eb4df4e57f4ee68e3de9054c2ed064c62b60', "close-button-position": this.closeButtonPosition, text: this.heading, onCloseButtonClicked: () => this.closeModalButtonClicked() })), h("div", { key: '5cf299afc7b41bbeb99da1eda28f96dc0b5a2549', class: "modal_content" }, h("slot", { key: 'a79f1afd15531fcb3f256c668a3a2f58743b357d', name: "content" })), this.footer && (h("div", { key: 'd60ef1dd364b50e7ebffb8cb24edb2a84df8ef6a', class: "modal_footer" }, this.hasFooterSlot ? (h("slot", { name: "footer" })) : (h("gb-modal-action", { "action-type": this.actionType, "full-width": this.fullWidth, "first-button-text": this.firstButtonText, "second-button-text": this.secondButtonText, "third-button-text": this.thirdButtonText, "first-button-state": this.firstButtonState, "second-button-state": this.secondButtonState, "third-button-state": this.thirdButtonState, "first-button-icon-leading-swap": this.firstButtonIconLeadingSwap, "second-button-icon-leading-swap": this.secondButtonIconLeadingSwap, "third-button-icon-leading-swap": this.thirdButtonIconLeadingSwap, "first-button-icon-trailing-swap": this.firstButtonIconTrailingSwap, "second-button-icon-trailing-swap": this.secondButtonIconTrailingSwap, "third-button-icon-trailing-swap": this.thirdButtonIconTrailingSwap, "show-secondary-actions": this.showSecondaryActions, "show-first-icon-button": this.showFirstIconButton, "show-second-icon-button": this.showSecondIconButton, "first-icon-button-swap": this.firstIconButtonSwap, "second-icon-button-swap": this.secondIconButtonSwap, "show-check-box": this.showCheckBox, "checkbox-label": this.checkboxLabel, destructive: this.destructive, onFirstButtonClicked: () => this.firstButtonClickedOnModalAction(), onSecondButtonClicked: () => this.secondButtonClickedOnModalAction(), onThirdButtonClicked: () => this.thirdButtonClickedOnModalAction() })))))));
|
|
79
78
|
}
|
|
80
79
|
get el() { return this; }
|
|
81
80
|
static get style() { return gbModalCss; }
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"file":"gb-modal.js","mappings":";;;;;;;;;AAAA,MAAM,UAAU,GAAG,0eAA0e;;MCMhfA,SAAO,iBAAAC,kBAAA,CAAA,MAAA,OAAA,SAAAC,CAAA,CAAA;AAJpB,IAAA,WAAA,CAAA,YAAA,EAAA;;;;;;;;;AAOU,QAAA,IAAK,CAAA,KAAA,GAAW,EAAE;AAClB,QAAA,IAAM,CAAA,MAAA,GAAY,IAAI;AACtB,QAAA,IAAmB,CAAA,mBAAA,GAAqB,OAAO;AAC/C,QAAA,IAAO,CAAA,OAAA,GAAW,EAAE;AACpB,QAAA,IAAU,CAAA,UAAA,GAAwB,QAAQ;AAC1C,QAAA,IAAS,CAAA,SAAA,GAAY,KAAK;AAC1B,QAAA,IAAW,CAAA,WAAA,GAAY,KAAK;;AAG5B,QAAA,IAAe,CAAA,eAAA,GAAW,EAAE;AAC5B,QAAA,IAAgB,CAAA,gBAAA,GAAW,EAAE;AAC7B,QAAA,IAAe,CAAA,eAAA,GAAW,EAAE;AAC5B,QAAA,IAAgB,CAAA,gBAAA,GAA2B,SAAS;AACpD,QAAA,IAAiB,CAAA,iBAAA,GAA2B,SAAS;AACrD,QAAA,IAAgB,CAAA,gBAAA,GAA2B,SAAS;AACpD,QAAA,IAA0B,CAAA,0BAAA,GAAW,EAAE;AACvC,QAAA,IAA2B,CAAA,2BAAA,GAAW,EAAE;AACxC,QAAA,IAA0B,CAAA,0BAAA,GAAW,EAAE;AACvC,QAAA,IAA2B,CAAA,2BAAA,GAAW,EAAE;AACxC,QAAA,IAA4B,CAAA,4BAAA,GAAW,EAAE;AACzC,QAAA,IAA2B,CAAA,2BAAA,GAAW,EAAE;;AAGxC,QAAA,IAAoB,CAAA,oBAAA,GAAY,KAAK;AACrC,QAAA,IAAmB,CAAA,mBAAA,GAAY,KAAK;AACpC,QAAA,IAAoB,CAAA,oBAAA,GAAY,KAAK;AACrC,QAAA,IAAmB,CAAA,mBAAA,GAAW,EAAE;AAChC,QAAA,IAAoB,CAAA,oBAAA,GAAW,EAAE;AACjC,QAAA,IAAY,CAAA,YAAA,GAAY,IAAI;AAC5B,QAAA,IAAa,CAAA,aAAA,GAAW,EAAE;AAEzB,QAAA,IAAa,CAAA,aAAA,GAAY,IAAI;
|
|
1
|
+
{"file":"gb-modal.js","mappings":"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","names":["GbModal","__stencil_proxyCustomElement","HTMLElement"],"sources":["src/components/gb-modal/gb-modal.css?tag=gb-modal","src/components/gb-modal/gb-modal.tsx"],"sourcesContent":[".overlay{\r\n /* width: 100vw; */\r\n height: 100vh;\r\n overflow: hidden;\r\n backdrop-filter: blur(4px);\r\n position: relative;\r\n box-sizing: border-box;\r\n background: var(--color-blanket-subtle, rgba(33, 44, 101, 0.3));\r\n}\r\n\r\n.modal_wrapper{\r\n position: absolute;\r\n top: 50%;\r\n left: 50%;\r\n transform: translate(-50%, -50%);\r\n overflow: hidden;\r\n border-radius: var(--rounded-md);\r\n box-shadow: var(--shadow-sm);\r\n background: var(--color-background-card, #FFFFFF);\r\n}\r\n\r\n.modal_footer{\r\n padding: var(--spacing-4) var(--spacing-6);\r\n border-top: 1px solid var(--color-border-subtler, #e3e8ef);\r\n}","import { Component, Element, Event, EventEmitter, Prop, State, h } from '@stencil/core';\r\n\r\n@Component({\r\n tag: 'gb-modal',\r\n styleUrl: 'gb-modal.css',\r\n})\r\nexport class GbModal {\r\n @Element() el: HTMLElement;\r\n\r\n @Prop() width: string = '';\r\n @Prop() footer: boolean = true;\r\n @Prop() closeButtonPosition: 'left' | 'right' = 'right';\r\n @Prop() heading: string = '';\r\n @Prop() actionType: 'single' | 'double' = 'single';\r\n @Prop() fullWidth: boolean = false;\r\n @Prop() destructive: boolean = false;\r\n\r\n // For the 'multiple' modal action type\r\n @Prop() firstButtonText: string = '';\r\n @Prop() secondButtonText: string = '';\r\n @Prop() thirdButtonText: string = '';\r\n @Prop() firstButtonState: 'default' | 'disabled' = 'default';\r\n @Prop() secondButtonState: 'default' | 'disabled' = 'default';\r\n @Prop() thirdButtonState: 'default' | 'disabled' = 'default';\r\n @Prop() firstButtonIconLeadingSwap: string = '';\r\n @Prop() secondButtonIconLeadingSwap: string = '';\r\n @Prop() thirdButtonIconLeadingSwap: string = '';\r\n @Prop() firstButtonIconTrailingSwap: string = '';\r\n @Prop() secondButtonIconTrailingSwap: string = '';\r\n @Prop() thirdButtonIconTrailingSwap: string = '';\r\n\r\n // If secondary action is shown on modal action\r\n @Prop() showSecondaryActions: boolean = false;\r\n @Prop() showFirstIconButton: boolean = false;\r\n @Prop() showSecondIconButton: boolean = false;\r\n @Prop() firstIconButtonSwap: string = '';\r\n @Prop() secondIconButtonSwap: string = '';\r\n @Prop() showCheckBox: boolean = true;\r\n @Prop() checkboxLabel: string = '';\r\n\r\n @State() hasFooterSlot: boolean = true;\r\n @Event() closeModalClicked: EventEmitter<void>;\r\n @Event() firstButtonClicked: EventEmitter<void>;\r\n @Event() secondButtonClicked: EventEmitter<void>;\r\n @Event() thirdButtonClicked: EventEmitter<void>;\r\n\r\n componentDidLoad() {\r\n this.checkFooterSlot();\r\n }\r\n\r\n private checkFooterSlot() {\r\n const footerSlot = this.el.querySelector('[slot=\"footer\"]');\r\n if (footerSlot) {\r\n this.hasFooterSlot = true;\r\n } else {\r\n this.hasFooterSlot = false;\r\n }\r\n }\r\n\r\n closeModalButtonClicked() {\r\n this.closeModalClicked.emit();\r\n }\r\n\r\n firstButtonClickedOnModalAction() {\r\n this.firstButtonClicked.emit();\r\n }\r\n\r\n secondButtonClickedOnModalAction() {\r\n this.secondButtonClicked.emit();\r\n }\r\n\r\n thirdButtonClickedOnModalAction() {\r\n this.thirdButtonClicked.emit();\r\n }\r\n\r\n render() {\r\n return (\r\n <div class=\"overlay\">\r\n <div class=\"modal_wrapper\" style={{ width: this.width }}>\r\n <div class=\"modal_header\">\r\n <gb-modal-header\r\n close-button-position={this.closeButtonPosition}\r\n text={this.heading}\r\n onCloseButtonClicked={() => this.closeModalButtonClicked()}\r\n ></gb-modal-header>\r\n </div>\r\n <div class=\"modal_content\">\r\n <slot name=\"content\"></slot>\r\n </div>\r\n {this.footer && (\r\n <div class=\"modal_footer\">\r\n {this.hasFooterSlot ? (\r\n <slot name=\"footer\"></slot>\r\n ) : (\r\n <gb-modal-action\r\n action-type={this.actionType}\r\n full-width={this.fullWidth}\r\n first-button-text={this.firstButtonText}\r\n second-button-text={this.secondButtonText}\r\n third-button-text={this.thirdButtonText}\r\n first-button-state={this.firstButtonState}\r\n second-button-state={this.secondButtonState}\r\n third-button-state={this.thirdButtonState}\r\n first-button-icon-leading-swap={this.firstButtonIconLeadingSwap}\r\n second-button-icon-leading-swap={this.secondButtonIconLeadingSwap}\r\n third-button-icon-leading-swap={this.thirdButtonIconLeadingSwap}\r\n first-button-icon-trailing-swap={this.firstButtonIconTrailingSwap}\r\n second-button-icon-trailing-swap={this.secondButtonIconTrailingSwap}\r\n third-button-icon-trailing-swap={this.thirdButtonIconTrailingSwap}\r\n show-secondary-actions={this.showSecondaryActions}\r\n show-first-icon-button={this.showFirstIconButton}\r\n show-second-icon-button={this.showSecondIconButton}\r\n first-icon-button-swap={this.firstIconButtonSwap}\r\n second-icon-button-swap={this.secondIconButtonSwap}\r\n show-check-box={this.showCheckBox}\r\n checkbox-label={this.checkboxLabel}\r\n destructive={this.destructive}\r\n onFirstButtonClicked={() => this.firstButtonClickedOnModalAction()}\r\n onSecondButtonClicked={() => this.secondButtonClickedOnModalAction()}\r\n onThirdButtonClicked={() => this.thirdButtonClickedOnModalAction()}\r\n ></gb-modal-action>\r\n )}\r\n </div>\r\n )}\r\n </div>\r\n </div>\r\n );\r\n }\r\n}\r\n"],"version":3}
|
|
@@ -42,14 +42,13 @@ const GbStepperHorizontalIconsCentered$1 = /*@__PURE__*/ proxyCustomElement(clas
|
|
|
42
42
|
;
|
|
43
43
|
updateStepperBreakpoint() {
|
|
44
44
|
this.breakpoint = this.width < 900 ? 'mobile' : 'desktop';
|
|
45
|
-
console.log(this.breakpoint);
|
|
46
45
|
}
|
|
47
46
|
componentWillLoad() {
|
|
48
47
|
document.addEventListener('resize', this.handleResize);
|
|
49
48
|
this.updateStepperBreakpoint();
|
|
50
49
|
}
|
|
51
50
|
render() {
|
|
52
|
-
return (h(Fragment, null, this.type === 'icon' && (h("div", { key: '
|
|
51
|
+
return (h(Fragment, null, this.type === 'icon' && (h("div", { key: '4efba94e5d62ed363d6fbc94695d32fc6c87a52e', class: "icons_centered_div" }, this.breakpoint === 'desktop' && (h("div", { key: '431fb4fdff9d39b19ab984cc42c45026adbdd4ac', class: "step_div" }, this.steps.map((step, index) => (h(Fragment, null, h("gb-step-base", { size: this.size, type: "icon_top", state: step.state, status: step.status, connector: index === this.steps.length - 1 ? false : true, label: step.label, "supporting-text": step.supportingText }), index !== this.steps.length - 1 ? (h("div", { class: `connector_div ${this.type} ${this.size}` }, h("div", { class: `icon_top_connector ${step.state} ${this.type} ${step.status}` }))) : null))))), this.breakpoint === 'mobile' && (h(Fragment, null, this.steps.map((step, index) => (h(Fragment, null, h("gb-step-base", { size: this.size, type: "icon_left", state: step.state, status: step.status, connector: index === this.steps.length - 1 ? false : true, label: step.label, "supporting-text": step.supportingText })))))))), this.type === 'featured_icon' && (h("div", { key: '79685bc2602452fa5a2046d2d109b3eefcc5c427', class: "icons_centered_div" }, this.breakpoint === 'desktop' && (h("div", { key: 'd0ce47bc058c98a1788a28cde722dc3484a37fcd', class: "step_div" }, this.steps.map((step, index) => (h(Fragment, null, h("gb-step-base", { size: this.size, type: "featured_icon_top", state: step.state, status: step.status, connector: index === this.steps.length - 1 ? false : true, label: step.label, "supporting-text": step.supportingText }), index !== this.steps.length - 1 ? (h("div", { class: `connector_div ${this.type} ${this.size}` }, h("div", { class: `icon_top_connector ${step.state} ${this.type} ${step.status}` }))) : null))))), this.breakpoint === 'mobile' && (h(Fragment, null, this.steps.map((step, index) => (h(Fragment, null, h("gb-step-base", { size: this.size, type: "featured_icon_left", state: step.state, status: step.status, connector: index === this.steps.length - 1 ? false : true, label: step.label, "supporting-text": step.supportingText }))))))))));
|
|
53
52
|
}
|
|
54
53
|
static get style() { return gbStepperHorizontalIconsCenteredCss; }
|
|
55
54
|
}, [257, "gb-stepper-horizontal-icons-centered", {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"file":"gb-stepper-horizontal-icons-centered.js","mappings":"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","names":["GbStepperHorizontalIconsCentered","__stencil_proxyCustomElement","HTMLElement"],"sources":["src/components/gb-stepper-horizontal-icons-centered/gb-stepper-horizontal-icons-centered.css?tag=gb-stepper-horizontal-icons-centered&encapsulation=shadow","src/components/gb-stepper-horizontal-icons-centered/gb-stepper-horizontal-icons-centered.tsx"],"sourcesContent":[".icons_centered_div {\r\n display: flex;\r\n justify-content: center;\r\n width: 100%;\r\n padding: 2rem 0;\r\n flex-direction: column;\r\n}\r\n\r\n.step_div {\r\n display: flex;\r\n justify-content: center;\r\n align-items: flex-start;\r\n width: 100%;\r\n}\r\n\r\n.connector_div {\r\n display: flex;\r\n padding: 0 1.5rem;\r\n min-height: 60px;\r\n}\r\n\r\n.connector_div.icon.sm{\r\n margin-top: 0.85rem;\r\n}\r\n\r\n.connector_div.icon.md{\r\n margin-top: 1.1rem;\r\n}\r\n\r\n.connector_div.icon.lg{\r\n margin-top: 1.4rem;\r\n}\r\n\r\n.connector_div.featured_icon.sm{\r\n margin-top: 1.2rem;\r\n}\r\n\r\n.connector_div.featured_icon.md{\r\n margin-top: 1.5rem;\r\n}\r\n\r\n.connector_div.featured_icon.lg{\r\n margin-top: 1.7rem;\r\n}\r\n\r\n.icon_top_connector {\r\n width: 21rem;\r\n height: 0.13rem;\r\n border-radius: 5px;\r\n margin-left: -8rem;\r\n margin-right: -8rem;\r\n z-index: -1;\r\n}\r\n\r\n.icon_top_connector.icon.incomplete,\r\n.icon_top_connector.icon.current,\r\n.icon_top_connector.featured_icon.incomplete,\r\n.icon_top_connector.featured_icon.current {\r\n background: var(--color-border-subtler, #e3e8ef); /* Change the color as needed */\r\n}\r\n\r\n.icon_top_connector.default.icon.complete {\r\n background: var(--color-border-selected, #075db2);\r\n}\r\n\r\n.icon_top_connector.default.featured_icon.complete {\r\n background: var(--color-border, #808C9E);\r\n}\r\n\r\n.icon_top_connector.incomplete.destructive,\r\n.icon_top_connector.current.destructive,\r\n.icon_top_connector.complete.destructive {\r\n background-color: var(--color-border-danger, #b51726);\r\n}\r\n","import { Component, Prop, h, Fragment, State, Listen } from '@stencil/core';\r\nimport { BreakPoints, GeneralSizes, StepperType } from '../../models/reusableModels';\r\n\r\n@Component({\r\n tag: 'gb-stepper-horizontal-icons-centered',\r\n styleUrl: 'gb-stepper-horizontal-icons-centered.css',\r\n shadow: true,\r\n})\r\nexport class GbStepperHorizontalIconsCentered {\r\n @Prop() size: GeneralSizes;\r\n @Prop() steps: StepperType[] = [\r\n // {\r\n // state: 'default',\r\n // status: 'complete',\r\n // label: 'Your details',\r\n // supportingText: 'Please provide your name and email',\r\n // },\r\n // {\r\n // state: 'default',\r\n // status: 'current',\r\n // label: 'Company details',\r\n // supportingText: 'A few details about your company',\r\n // },\r\n // {\r\n // state: 'default',\r\n // status: 'incomplete',\r\n // label: 'Invite your team',\r\n // supportingText: 'Start collaborating with your team',\r\n // },\r\n ];\r\n @Prop() type: 'icon' | 'featured_icon' = 'icon';\r\n @State() breakpoint: BreakPoints;\r\n @State() width: number = window.innerWidth;\r\n\r\n @Listen('resize', { target: 'window' })\r\n handleResize() {\r\n this.width = window.innerWidth;\r\n this.updateStepperBreakpoint();\r\n };\r\n\r\n updateStepperBreakpoint() {\r\n this.breakpoint = this.width < 900 ? 'mobile' : 'desktop';\r\n console.log(this.breakpoint);\r\n }\r\n\r\n componentWillLoad() {\r\n document.addEventListener('resize', this.handleResize);\r\n this.updateStepperBreakpoint();\r\n }\r\n\r\n render() {\r\n return (\r\n <>\r\n {this.type === 'icon' && (\r\n <div class=\"icons_centered_div\">\r\n {this.breakpoint === 'desktop' && (\r\n <div class=\"step_div\">\r\n {this.steps.map((step, index) => (\r\n <>\r\n <gb-step-base\r\n size={this.size}\r\n type=\"icon_top\"\r\n state={step.state}\r\n status={step.status}\r\n connector={index === this.steps.length - 1 ? false : true}\r\n label={step.label}\r\n supporting-text={step.supportingText}\r\n ></gb-step-base>\r\n {index !== this.steps.length - 1 ? (\r\n <div class={`connector_div ${this.type} ${this.size}`}>\r\n <div class={`icon_top_connector ${step.state} ${this.type} ${step.status}`}></div>\r\n </div>\r\n ) : null}\r\n </>\r\n ))}\r\n </div>\r\n )}\r\n {this.breakpoint === 'mobile' && (\r\n <>\r\n {this.steps.map((step, index) => (\r\n <>\r\n <gb-step-base\r\n size={this.size}\r\n type=\"icon_left\"\r\n state={step.state}\r\n status={step.status}\r\n connector={index === this.steps.length - 1 ? false : true}\r\n label={step.label}\r\n supporting-text={step.supportingText}\r\n ></gb-step-base>\r\n </>\r\n ))}\r\n </>\r\n )}\r\n </div>\r\n )}\r\n {this.type === 'featured_icon' && (\r\n <div class=\"icons_centered_div\">\r\n {this.breakpoint === 'desktop' && (\r\n <div class=\"step_div\">\r\n {this.steps.map((step, index) => (\r\n <>\r\n <gb-step-base\r\n size={this.size}\r\n type=\"featured_icon_top\"\r\n state={step.state}\r\n status={step.status}\r\n connector={index === this.steps.length - 1 ? false : true}\r\n label={step.label}\r\n supporting-text={step.supportingText}\r\n ></gb-step-base>\r\n {index !== this.steps.length - 1 ? (\r\n <div class={`connector_div ${this.type} ${this.size}`}>\r\n <div class={`icon_top_connector ${step.state} ${this.type} ${step.status}`}></div>\r\n </div>\r\n ) : null}\r\n </>\r\n ))}\r\n </div>\r\n )}\r\n {this.breakpoint === 'mobile' && (\r\n <>\r\n {this.steps.map((step, index) => (\r\n <>\r\n <gb-step-base\r\n size={this.size}\r\n type=\"featured_icon_left\"\r\n state={step.state}\r\n status={step.status}\r\n connector={index === this.steps.length - 1 ? false : true}\r\n label={step.label}\r\n supporting-text={step.supportingText}\r\n ></gb-step-base>\r\n </>\r\n ))}\r\n </>\r\n )}\r\n </div>\r\n )}\r\n </>\r\n );\r\n }\r\n}\r\n"],"version":3}
|
|
1
|
+
{"file":"gb-stepper-horizontal-icons-centered.js","mappings":"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","names":["GbStepperHorizontalIconsCentered","__stencil_proxyCustomElement","HTMLElement"],"sources":["src/components/gb-stepper-horizontal-icons-centered/gb-stepper-horizontal-icons-centered.css?tag=gb-stepper-horizontal-icons-centered&encapsulation=shadow","src/components/gb-stepper-horizontal-icons-centered/gb-stepper-horizontal-icons-centered.tsx"],"sourcesContent":[".icons_centered_div {\r\n display: flex;\r\n justify-content: center;\r\n width: 100%;\r\n padding: 2rem 0;\r\n flex-direction: column;\r\n}\r\n\r\n.step_div {\r\n display: flex;\r\n justify-content: center;\r\n align-items: flex-start;\r\n width: 100%;\r\n}\r\n\r\n.connector_div {\r\n display: flex;\r\n padding: 0 1.5rem;\r\n min-height: 60px;\r\n}\r\n\r\n.connector_div.icon.sm{\r\n margin-top: 0.85rem;\r\n}\r\n\r\n.connector_div.icon.md{\r\n margin-top: 1.1rem;\r\n}\r\n\r\n.connector_div.icon.lg{\r\n margin-top: 1.4rem;\r\n}\r\n\r\n.connector_div.featured_icon.sm{\r\n margin-top: 1.2rem;\r\n}\r\n\r\n.connector_div.featured_icon.md{\r\n margin-top: 1.5rem;\r\n}\r\n\r\n.connector_div.featured_icon.lg{\r\n margin-top: 1.7rem;\r\n}\r\n\r\n.icon_top_connector {\r\n width: 21rem;\r\n height: 0.13rem;\r\n border-radius: 5px;\r\n margin-left: -8rem;\r\n margin-right: -8rem;\r\n z-index: -1;\r\n}\r\n\r\n.icon_top_connector.icon.incomplete,\r\n.icon_top_connector.icon.current,\r\n.icon_top_connector.featured_icon.incomplete,\r\n.icon_top_connector.featured_icon.current {\r\n background: var(--color-border-subtler, #e3e8ef); /* Change the color as needed */\r\n}\r\n\r\n.icon_top_connector.default.icon.complete {\r\n background: var(--color-border-selected, #075db2);\r\n}\r\n\r\n.icon_top_connector.default.featured_icon.complete {\r\n background: var(--color-border, #808C9E);\r\n}\r\n\r\n.icon_top_connector.incomplete.destructive,\r\n.icon_top_connector.current.destructive,\r\n.icon_top_connector.complete.destructive {\r\n background-color: var(--color-border-danger, #b51726);\r\n}\r\n","import { Component, Prop, h, Fragment, State, Listen } from '@stencil/core';\r\nimport { BreakPoints, GeneralSizes, StepperType } from '../../models/reusableModels';\r\n\r\n@Component({\r\n tag: 'gb-stepper-horizontal-icons-centered',\r\n styleUrl: 'gb-stepper-horizontal-icons-centered.css',\r\n shadow: true,\r\n})\r\nexport class GbStepperHorizontalIconsCentered {\r\n @Prop() size: GeneralSizes;\r\n @Prop() steps: StepperType[] = [\r\n // {\r\n // state: 'default',\r\n // status: 'complete',\r\n // label: 'Your details',\r\n // supportingText: 'Please provide your name and email',\r\n // },\r\n // {\r\n // state: 'default',\r\n // status: 'current',\r\n // label: 'Company details',\r\n // supportingText: 'A few details about your company',\r\n // },\r\n // {\r\n // state: 'default',\r\n // status: 'incomplete',\r\n // label: 'Invite your team',\r\n // supportingText: 'Start collaborating with your team',\r\n // },\r\n ];\r\n @Prop() type: 'icon' | 'featured_icon' = 'icon';\r\n @State() breakpoint: BreakPoints;\r\n @State() width: number = window.innerWidth;\r\n\r\n @Listen('resize', { target: 'window' })\r\n handleResize() {\r\n this.width = window.innerWidth;\r\n this.updateStepperBreakpoint();\r\n };\r\n\r\n updateStepperBreakpoint() {\r\n this.breakpoint = this.width < 900 ? 'mobile' : 'desktop';\r\n }\r\n\r\n componentWillLoad() {\r\n document.addEventListener('resize', this.handleResize);\r\n this.updateStepperBreakpoint();\r\n }\r\n\r\n render() {\r\n return (\r\n <>\r\n {this.type === 'icon' && (\r\n <div class=\"icons_centered_div\">\r\n {this.breakpoint === 'desktop' && (\r\n <div class=\"step_div\">\r\n {this.steps.map((step, index) => (\r\n <>\r\n <gb-step-base\r\n size={this.size}\r\n type=\"icon_top\"\r\n state={step.state}\r\n status={step.status}\r\n connector={index === this.steps.length - 1 ? false : true}\r\n label={step.label}\r\n supporting-text={step.supportingText}\r\n ></gb-step-base>\r\n {index !== this.steps.length - 1 ? (\r\n <div class={`connector_div ${this.type} ${this.size}`}>\r\n <div class={`icon_top_connector ${step.state} ${this.type} ${step.status}`}></div>\r\n </div>\r\n ) : null}\r\n </>\r\n ))}\r\n </div>\r\n )}\r\n {this.breakpoint === 'mobile' && (\r\n <>\r\n {this.steps.map((step, index) => (\r\n <>\r\n <gb-step-base\r\n size={this.size}\r\n type=\"icon_left\"\r\n state={step.state}\r\n status={step.status}\r\n connector={index === this.steps.length - 1 ? false : true}\r\n label={step.label}\r\n supporting-text={step.supportingText}\r\n ></gb-step-base>\r\n </>\r\n ))}\r\n </>\r\n )}\r\n </div>\r\n )}\r\n {this.type === 'featured_icon' && (\r\n <div class=\"icons_centered_div\">\r\n {this.breakpoint === 'desktop' && (\r\n <div class=\"step_div\">\r\n {this.steps.map((step, index) => (\r\n <>\r\n <gb-step-base\r\n size={this.size}\r\n type=\"featured_icon_top\"\r\n state={step.state}\r\n status={step.status}\r\n connector={index === this.steps.length - 1 ? false : true}\r\n label={step.label}\r\n supporting-text={step.supportingText}\r\n ></gb-step-base>\r\n {index !== this.steps.length - 1 ? (\r\n <div class={`connector_div ${this.type} ${this.size}`}>\r\n <div class={`icon_top_connector ${step.state} ${this.type} ${step.status}`}></div>\r\n </div>\r\n ) : null}\r\n </>\r\n ))}\r\n </div>\r\n )}\r\n {this.breakpoint === 'mobile' && (\r\n <>\r\n {this.steps.map((step, index) => (\r\n <>\r\n <gb-step-base\r\n size={this.size}\r\n type=\"featured_icon_left\"\r\n state={step.state}\r\n status={step.status}\r\n connector={index === this.steps.length - 1 ? false : true}\r\n label={step.label}\r\n supporting-text={step.supportingText}\r\n ></gb-step-base>\r\n </>\r\n ))}\r\n </>\r\n )}\r\n </div>\r\n )}\r\n </>\r\n );\r\n }\r\n}\r\n"],"version":3}
|
|
@@ -10,7 +10,7 @@ import { d as defineCustomElement$D } from './p-DIxw05_K.js';
|
|
|
10
10
|
import { d as defineCustomElement$C } from './p-CBuFpTEj.js';
|
|
11
11
|
import { d as defineCustomElement$B } from './p-zchpoi2I.js';
|
|
12
12
|
import { d as defineCustomElement$A } from './p-BChRlvEK.js';
|
|
13
|
-
import { d as defineCustomElement$z } from './p-
|
|
13
|
+
import { d as defineCustomElement$z } from './p-BnfYep32.js';
|
|
14
14
|
import { d as defineCustomElement$y } from './p-BGbrZd6N.js';
|
|
15
15
|
import { d as defineCustomElement$x } from './p-DVdANjHj.js';
|
|
16
16
|
import { d as defineCustomElement$w } from './p-DEzF6er7.js';
|
|
@@ -21,7 +21,7 @@ import { d as defineCustomElement$s } from './p-AL5KgxpT.js';
|
|
|
21
21
|
import { d as defineCustomElement$r } from './p-BFCdkGF1.js';
|
|
22
22
|
import { d as defineCustomElement$q } from './p-zxY6iDVS.js';
|
|
23
23
|
import { d as defineCustomElement$p } from './p-CgVJBrXf.js';
|
|
24
|
-
import { d as defineCustomElement$o } from './p-
|
|
24
|
+
import { d as defineCustomElement$o } from './p-D1d9Mgpu.js';
|
|
25
25
|
import { d as defineCustomElement$n } from './p-D449gHbv.js';
|
|
26
26
|
import { d as defineCustomElement$m } from './p-DPgzfv5f.js';
|
|
27
27
|
import { d as defineCustomElement$l } from './p-Dahz1TX7.js';
|
|
@@ -34,7 +34,7 @@ import { d as defineCustomElement$f } from './p-ByZavslg.js';
|
|
|
34
34
|
import { d as defineCustomElement$e } from './p-BFCCj9F3.js';
|
|
35
35
|
import { d as defineCustomElement$d } from './p-D8BrBTRA.js';
|
|
36
36
|
import { d as defineCustomElement$c } from './p-CzeiCe0J.js';
|
|
37
|
-
import { d as defineCustomElement$b } from './p-
|
|
37
|
+
import { d as defineCustomElement$b } from './p-B8o86Fu9.js';
|
|
38
38
|
import { d as defineCustomElement$a } from './p-B_KMpSuF.js';
|
|
39
39
|
import { d as defineCustomElement$9 } from './p-CWV6T742.js';
|
|
40
40
|
import { d as defineCustomElement$8 } from './p-DDp4uvg2.js';
|
|
@@ -477,6 +477,28 @@ const GbTable$1 = /*@__PURE__*/ proxyCustomElement(class GbTable extends H {
|
|
|
477
477
|
// },
|
|
478
478
|
];
|
|
479
479
|
// = {
|
|
480
|
+
// name: { key: 'name' },
|
|
481
|
+
// badges: [
|
|
482
|
+
// { key: 'role', label: 'Role' },
|
|
483
|
+
// { key: 'amount', label: 'Amount' },
|
|
484
|
+
// ],
|
|
485
|
+
// button: { icon: 'assets/sent.svg', text: 'Send Money', action: 'send_money' },
|
|
486
|
+
// };
|
|
487
|
+
this.tableHeaderConfig = {
|
|
488
|
+
tableHeading: false,
|
|
489
|
+
tableHeadingLabel: 'Suspicious outflows',
|
|
490
|
+
showDateFilter: true,
|
|
491
|
+
showFilter: true,
|
|
492
|
+
showColumnOptions: true,
|
|
493
|
+
showSearch: true,
|
|
494
|
+
showExport: true,
|
|
495
|
+
showRefreshButton: false,
|
|
496
|
+
showLayoutToggle: true,
|
|
497
|
+
datePickerMode: 'range',
|
|
498
|
+
inputPlaceholder: 'Transaction reference',
|
|
499
|
+
showEntireData: true,
|
|
500
|
+
};
|
|
501
|
+
// = {
|
|
480
502
|
// paginationMode: 'internal',
|
|
481
503
|
// entriesDropdownMenuPosition: 'top',
|
|
482
504
|
// currentPage: 1,
|
|
@@ -632,7 +654,6 @@ const GbTable$1 = /*@__PURE__*/ proxyCustomElement(class GbTable extends H {
|
|
|
632
654
|
}
|
|
633
655
|
}
|
|
634
656
|
handleAction(action, row) {
|
|
635
|
-
console.log('Action clicked:', action, row);
|
|
636
657
|
this.rowActionClicked.emit({ action, row });
|
|
637
658
|
}
|
|
638
659
|
renderCell(col, row) {
|
|
@@ -836,7 +857,6 @@ const GbTable$1 = /*@__PURE__*/ proxyCustomElement(class GbTable extends H {
|
|
|
836
857
|
}
|
|
837
858
|
emitSelection() {
|
|
838
859
|
const selected = this.sortedData.filter(row => this.selectedRowIds.has(this.getRowId(row)));
|
|
839
|
-
console.log(selected);
|
|
840
860
|
this.selectionChanged.emit(selected);
|
|
841
861
|
}
|
|
842
862
|
get displayedData() {
|
|
@@ -984,7 +1004,6 @@ const GbTable$1 = /*@__PURE__*/ proxyCustomElement(class GbTable extends H {
|
|
|
984
1004
|
};
|
|
985
1005
|
}
|
|
986
1006
|
exportButtonClicked(detail) {
|
|
987
|
-
console.log(detail.detail);
|
|
988
1007
|
this.exportClicked.emit(detail.detail);
|
|
989
1008
|
}
|
|
990
1009
|
onRefreshButtonClicked() {
|
|
@@ -1146,16 +1165,16 @@ const GbTable$1 = /*@__PURE__*/ proxyCustomElement(class GbTable extends H {
|
|
|
1146
1165
|
window.removeEventListener('resize', this.checkViewport);
|
|
1147
1166
|
}
|
|
1148
1167
|
render() {
|
|
1149
|
-
return (h("div", { key: '
|
|
1168
|
+
return (h("div", { key: '0700854e4c5b8e19a11a32d66a7e8e9ac891eec2', class: `table_wrapper ${this.currentTableLayout}` }, this.tableHeaderConfig && (h("div", { key: 'f2be97c9209dc2c6c12cb299b64057f24b4dfa07', class: `table-header ${this.currentTableLayout}` }, h("gb-table-header", { key: '7007188403fb8e123d6d54bbf4f6bbc5048f401e', mode: this.tableHeaderConfig.datePickerMode, "table-heading": this.tableHeaderConfig.tableHeading, "table-heading-label": this.tableHeaderConfig.tableHeadingLabel, "show-search": this.tableHeaderConfig.showSearch, "show-date-filter": this.tableHeaderConfig.showDateFilter, "show-filter": this.tableHeaderConfig.showFilter, "show-export": this.tableHeaderConfig.showExport, "show-column-options": this.tableHeaderConfig.showColumnOptions, "show-refresh-button": this.tableHeaderConfig.showRefreshButton, "input-placeholder": this.tableHeaderConfig.inputPlaceholder, "date-picker-placeholder": this.tableHeaderConfig.datePickerPlaceholder, "show-entire-data": this.tableHeaderConfig.showEntireData, "show-layout-toggle": this.tableHeaderConfig.showLayoutToggle, "filter-state": Object.keys(this.appliedFilterValues).length > 0 ? 'applied' : 'default', "filter-count": Object.keys(this.appliedFilterValues).length, "export-button-state": this.tableHeaderConfig.exportButtonState, "pdf-state": this.tableHeaderConfig.pdfState, "csv-state": this.tableHeaderConfig.csvState, onInputValueChanged: this.emitSearchValue.bind(this), onDateChange: this.emitDateChange.bind(this), onColumnOptionsButtonClicked: this.columnOptionsButtonClicked(), onExportClicked: e => this.exportButtonClicked(e), onFilterButtonClicked: () => this.openFilterModal(), onRefreshButtonClicked: () => this.onRefreshButtonClicked(), onLayoutButtonClicked: e => this.switchTableLayout(e) }))), this.showColumnsPanel && this.columns.length > 0 && (h("div", { key: '30cb8238470d6120c165aaa4a19cd69f96feddd1', class: "dialog", style: {
|
|
1150
1169
|
transform: `translate(${this.modalPosition.x}px, ${this.modalPosition.y}px)`,
|
|
1151
|
-
} }, h("div", { key: '
|
|
1170
|
+
} }, h("div", { key: '365b823e15575a5142339b488c9b7ce0aadd449c', class: "column-modal" }, h("div", { key: 'aca6d1b50a4702c420f1c63fa9be9e391a114063', class: "modal_header" }, h("div", { key: '85e3779943c04c39a6f4adb6e014a4d1e8ee8f1f', class: "modal_header_content", onPointerDown: this.onModalPointerDown }, h("h4", { key: 'f6357c0e6f78f01ef6b3f9c213169c41eb4461bf', class: "heading display-xs-semi-bold" }, "Column Options"), h("gb-button-close", { key: '51aa07b2f32610ccc60e239e5de993cc3a3884ba', class: "close_button", color: "gray", size: "sm", onClick: () => (this.showColumnsPanel = false) }))), h("div", { key: 'fd9c0a3f350e3a13b9536f85129116220b37e22d', class: "content_wrapper" }, h("div", { key: 'd9d0cc7f9edbaf487382ae05c5e00c8323771b44', class: "modal_content" }, this.internalColumns.map((col, index) => (h("div", { class: "column_option", draggable: true, onDragStart: () => (this.draggedIndex = index), onDragOver: e => e.preventDefault(), onDrop: () => {
|
|
1152
1171
|
if (this.draggedIndex !== null && this.draggedIndex !== index) {
|
|
1153
1172
|
this.reorderColumns(this.draggedIndex, index);
|
|
1154
1173
|
}
|
|
1155
1174
|
this.draggedIndex = null;
|
|
1156
1175
|
} }, h("div", { class: "label_and_dragger" }, h("svg", { xmlns: "http://www.w3.org/2000/svg", width: "24", height: "24", viewBox: "0 0 24 24", fill: "none" }, h("path", { d: "M8 6H8.00635M8 12H8.00635M8 18H8.00635M15.9937 6H16M15.9937 12H16M15.9937 18H16", stroke: "var(--color-icon, #4B5565)", "stroke-width": "2.5", "stroke-linecap": "round", "stroke-linejoin": "round" })), h("p", { class: "label text-md-regular" }, col.label)), h("gb-toggle", { size: "sm", state: StateEnum.Default, position: "right", pressed: col.visible, text: false, onToggleClicked: e => {
|
|
1157
1176
|
this.toggleColumn(e, col.key);
|
|
1158
|
-
} })))), h("div", { key: '
|
|
1177
|
+
} })))), h("div", { key: '673dbe8f5ad303744b4bfd2737913fc1ba6020e8', class: "modal-actions" })))))), this.showFilterModalInternal && this.filterConfig && (h("div", { key: 'f767421c763d599bc5ccc2c1c0b36fb83dbeb422', class: `filter_modal_wrapper ${this.isFilterModalVisible ? 'open' : 'closing'}` }, h("gb-filter-modal", { key: '082bed1775129e1b3a25d0ca83006afb98e5d1d7', class: "filter_modal", filterConfig: this.mergedFilterConfig, onClose: e => {
|
|
1159
1178
|
e.stopPropagation();
|
|
1160
1179
|
this.closeFilterModal();
|
|
1161
1180
|
}, onApplyFilters: e => this.onApplyFilters(e), onClearFilters: () => this.handleClearFilters() }))), this.internalLoading ? (
|
|
@@ -1202,7 +1221,7 @@ const GbTable$1 = /*@__PURE__*/ proxyCustomElement(class GbTable extends H {
|
|
|
1202
1221
|
? this.renderDesktopView()
|
|
1203
1222
|
: this.currentTableLayout === 'grid'
|
|
1204
1223
|
? this.renderGridView()
|
|
1205
|
-
: null)), this.paginationConfig && (h("div", { key: '
|
|
1224
|
+
: null)), this.paginationConfig && (h("div", { key: '58adec96eb25b1c8d71adaa2a2bd986758e2cfe6', class: `pagination ${this.currentTableLayout}` }, h("gb-pagination", { key: '6b21847500f569522de0f60f03c0ea52b2291d37', "entries-dropdown-menu-position": this.paginationConfig.entriesDropdownMenuPosition, "page-size": this.paginationConfig.paginationMode === 'internal' ? this.internalPageSize : this.paginationConfig.pageSize, "current-page": this.paginationConfig.paginationMode === 'internal' ? this.internalCurrentPage : this.paginationConfig.currentPage, "total-pages": this.totalPages, onPageItemSelected: this.handlePageChange.bind(this) }))), this.showToast && (h("gb-toast", { key: '145a64dd5290869234bc7a160052b7342df3de79', class: `toast ${this.toastVisible ? 'visible' : ''}`, color: "information", "main-text": this.filterMessage, breakpoint: "desktop", size: "floating", onClose: () => this.hideToast() }))));
|
|
1206
1225
|
}
|
|
1207
1226
|
static get watchers() { return {
|
|
1208
1227
|
"data": ["onDataChange"],
|