@digital-realty/ix-grid 1.3.8 → 1.3.10
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/IxGrid.d.ts +4 -0
- package/dist/IxGrid.js +39 -11
- package/dist/IxGrid.js.map +1 -1
- package/dist/components/IxGridRowFilter.d.ts +2 -0
- package/dist/components/IxGridRowFilter.js +37 -13
- package/dist/components/IxGridRowFilter.js.map +1 -1
- package/dist/components/IxPagination.d.ts +1 -0
- package/dist/components/IxPagination.js +6 -2
- package/dist/components/IxPagination.js.map +1 -1
- package/dist/components/grid-row-filter-styles.js +7 -1
- package/dist/components/grid-row-filter-styles.js.map +1 -1
- package/dist/components/pagination-styles.js +8 -0
- package/dist/components/pagination-styles.js.map +1 -1
- package/dist/grid-view-styles.js +15 -9
- package/dist/grid-view-styles.js.map +1 -1
- package/dist/ix-grid.min.js +5 -5
- package/dist/test/ix-grid-row-filter.test.js +21 -0
- package/dist/test/ix-grid-row-filter.test.js.map +1 -1
- package/package.json +4 -3
- package/src/IxGrid.ts +35 -7
- package/src/components/IxGridRowFilter.ts +36 -15
- package/src/components/IxPagination.ts +4 -2
- package/src/components/grid-row-filter-styles.ts +7 -1
- package/src/components/pagination-styles.ts +8 -0
- package/src/grid-view-styles.ts +15 -9
- package/src/test/ix-grid-row-filter.test.ts +30 -0
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"IxGridRowFilter.js","sourceRoot":"","sources":["../../src/components/IxGridRowFilter.ts"],"names":[],"mappings":"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","sourcesContent":["import '@digital-realty/ix-button/ix-button.js';\nimport '@digital-realty/ix-date/ix-date.js';\nimport '@digital-realty/ix-icon-button/ix-icon-button.js';\nimport '@digital-realty/ix-icon/ix-icon.js';\nimport '@digital-realty/ix-select/ix-select.js';\nimport { formatDate } from 'date-fns/format.js';\nimport { LitElement, html, nothing } from 'lit';\nimport { customElement, property, state } from 'lit/decorators.js';\nimport { repeat } from 'lit/directives/repeat.js';\nimport type { Column, DataType, FilterOperator } from '../IxGrid.js';\nimport { IxGridViewStyles } from '../grid-view-styles.js';\nimport { copy } from '../ix-grid-copy.js';\nimport { IxGridRowFilterStyles } from './grid-row-filter-styles.js';\n\nexport interface Filter {\n columnField: string;\n operatorValue: string;\n dataType?: DataType;\n value: string;\n}\n\n@customElement('ix-grid-row-filter')\nexport class IxGridRowFilter extends LitElement {\n static readonly styles = [IxGridViewStyles, IxGridRowFilterStyles];\n\n @property({ type: Array }) columns: Column[] = [];\n\n @property({ type: Number }) filterValueChangeDebounceTime: number = 300;\n\n @property({ type: Boolean }) readParamsFromURL = false;\n\n @property({ type: String }) maxDate: string = formatDate(\n new Date(),\n 'yyyy-MM-dd'\n );\n\n @state() private isDropdownVisible: boolean = false;\n\n @state() private filters: Filter[] = [];\n\n @state() private filterableColumns: Column[] = [];\n\n @state() private filterColumns: string[] = [];\n\n @state() private activeFilters: Filter[] = [];\n\n @state() private mapSelect: boolean = false;\n\n @state() private fromDateErrorText? = '';\n\n @state() private oldValueLength: number = 0;\n\n private debounceEvent: ReturnType<typeof setTimeout> | undefined;\n\n private debouncedOnFilterValueChange: (\n index: number,\n target: EventTarget\n ) => void = () => {};\n\n updateActiveFilters() {\n this.activeFilters = this.filters.filter(filter => filter.value.length > 0);\n }\n\n connectedCallback() {\n super.connectedCallback();\n document.addEventListener('click', this.closeOnOuterClick);\n window.addEventListener('popstate', this.handlePopState);\n }\n\n disconnectedCallback() {\n super.disconnectedCallback();\n document.removeEventListener('click', this.closeOnOuterClick);\n window.removeEventListener('popstate', this.handlePopState);\n }\n\n firstUpdated() {\n this.filterableColumns = this.columns.filter(column => column.filterable);\n this.filterColumns = this.filterableColumns.map(column => column.name);\n\n if (this.readParamsFromURL) {\n this.filters = this.parseFilterQueryString();\n }\n\n if (!this.filters.length) {\n this.addFilter();\n }\n\n this.updateActiveFilters();\n this.dispatchUpdate(false);\n this.debouncedOnFilterValueChange = (index, target) => {\n clearTimeout(this.debounceEvent);\n this.debounceEvent = setTimeout(\n () => this.onfilterValueChange.bind(this)(index, target),\n this.filterValueChangeDebounceTime\n );\n };\n }\n\n get filterNames() {\n return this.filters.map(filter => filter.columnField);\n }\n\n get unselectedFilters() {\n return this.filterColumns.filter(f => !this.filterNames.includes(f));\n }\n\n closeOnOuterClick = (e: Event) => {\n if (!e.composedPath().includes(this)) {\n this.isDropdownVisible = false;\n }\n };\n\n parseFilterQueryString(): Filter[] {\n const params = new URLSearchParams(window.location.search);\n const filters: Filter[] = [];\n\n this.filterableColumns.forEach(fc => {\n fc.filterOperators?.forEach(operator => {\n const key = `${fc.name}_${operator}`;\n\n if (params.has(key)) {\n filters.push({\n columnField: fc.name,\n operatorValue: operator,\n dataType: fc.dataType,\n value: params.get(key) ?? '',\n });\n }\n });\n });\n\n return filters;\n }\n\n dispatchUpdate(resetPage = true) {\n this.dispatchEvent(\n new CustomEvent('rowFilter', {\n detail: {\n filters: this.filters.filter(filter => filter.value.length),\n resetPage,\n },\n bubbles: true,\n composed: true,\n })\n );\n }\n\n addFilter() {\n const nextFilter =\n this.filterColumns.find(filter => !this.filterNames.includes(filter)) ||\n '';\n const filterOperators = this.filterableColumns.find(\n c => c.name === nextFilter\n )?.filterOperators || ['contains'];\n\n const filterDataType =\n this.filterableColumns.find(c => c.name === nextFilter)?.dataType ||\n 'string';\n\n this.filters = [\n ...this.filters,\n {\n columnField: nextFilter,\n operatorValue: filterOperators[0],\n dataType: filterDataType,\n value: '',\n },\n ];\n this.updateActiveFilters();\n }\n\n clearFilters() {\n this.filters = [];\n this.addFilter();\n this.dispatchUpdate();\n }\n\n removeFilter(index: number) {\n this.filters = this.filters.filter((_, i) => i !== index);\n this.dispatchUpdate();\n if (this.filters.length === 0) {\n this.isDropdownVisible = false;\n this.addFilter();\n }\n\n this.updateActiveFilters();\n }\n\n private handlePopState = () => {\n this.filters = this.parseFilterQueryString();\n if (this.filters.length === 0) {\n this.isDropdownVisible = false;\n this.addFilter();\n }\n this.updateActiveFilters();\n };\n\n private onfilterColumnChange(index: number, e: Event) {\n const selectedValue = (e.target as HTMLSelectElement).value;\n const selectedColumn = this.filterableColumns.find(\n column => column.name === selectedValue\n );\n this.filters[index].columnField = selectedValue;\n this.filters[index].dataType = selectedColumn?.dataType;\n this.filters[index].operatorValue =\n selectedColumn?.filterOperators?.[0] || 'contains';\n\n this.filters = [...this.filters];\n\n this.dispatchUpdate();\n }\n\n private onfilterOperatorChange(index: number, e: Event) {\n const selectedValue = (e.target as HTMLSelectElement).value;\n this.filters[index].operatorValue = selectedValue;\n\n this.filters = [...this.filters];\n\n this.dispatchUpdate();\n }\n\n private onDatefilterValueChange(index: number, value: string) {\n this.filters[index].value = value;\n this.dispatchUpdate();\n this.updateActiveFilters();\n }\n\n private onfilterValueChange(index: number, target: EventTarget) {\n const { value } = target as HTMLInputElement;\n this.filters[index].value = value;\n\n const newValueLength = this.filters[index].value.length;\n if (\n this.filters[index].columnField.length > 0 &&\n (newValueLength >= 3 || newValueLength < this.oldValueLength)\n ) {\n this.dispatchUpdate();\n }\n this.updateActiveFilters();\n this.oldValueLength = newValueLength;\n }\n\n formatCamelCaseToEnglish(text: string) {\n const spaced = text.replace(/([A-Z])/g, ' $1').toLowerCase();\n const english = spaced.charAt(0).toUpperCase() + spaced.slice(1);\n return english;\n }\n\n renderToolTip() {\n if (this.isDropdownVisible) {\n return copy.hideFilters;\n }\n if (!this.activeFilters.length) {\n return copy.showFilters;\n }\n return html` <p>${this.activeFilters.length} ${copy.activeFilter}</p>\n <ul>\n ${this.activeFilters.map(\n filter => html`<li>\n ${this.formatCamelCaseToEnglish(filter.columnField)}\n ${filter.operatorValue} ${filter.value}\n </li>`\n )}\n </ul>`;\n }\n\n private renderStringInput(value: any, index: number) {\n return html`<label class=\"form-group-operator-label\">\n <span>Value</span>\n <input\n data-testid=${`filterValueInput-${index}`}\n placeholder=\"Filter value\"\n @input=${(e: Event) =>\n this.debouncedOnFilterValueChange(index, e.target!)}\n .value=${value.value}\n />\n </label>`;\n }\n\n private renderDateInput(value: any, index: number) {\n return html` <ix-date\n data-testid=${`filterValueInput-${index}`}\n .value=${value.value}\n max=${this.maxDate}\n name=\"${value.columnField}-valueDate\"\n .errorText=${this.fromDateErrorText}\n .onChanged=${e => this.onDatefilterValueChange(index, e)}\n >\n </ix-date>`;\n }\n\n private renderFilterInputControl(value: any, index: number) {\n switch (value.dataType) {\n case 'string':\n case undefined:\n return this.renderStringInput(value, index);\n case 'dateTime':\n return this.renderDateInput(value, index);\n default:\n return nothing;\n }\n }\n\n renderFilterInput(value: Filter, index: number) {\n const options = [value.columnField, ...this.unselectedFilters];\n const filterOptions = this.filterableColumns.filter(column =>\n options.includes(column.name)\n );\n return html`\n <div class=\"filter-form\">\n <div class=\"filter-remove filter-form-column\">\n <div class=\"form-group\">\n <ix-icon-button\n icon=\"close\"\n data-testid=\"clearFilterButton\"\n @click=${() => this.removeFilter(index)}\n @keyDown=${(e: KeyboardEvent) => {\n if (e.key === ' ' || e.key === 'Enter') {\n this.removeFilter(index);\n }\n }}\n ></ix-icon-button>\n </div>\n </div>\n ${this.mapSelect\n ? html`<div\n class=\"filter-form-column filter-form-column-border filterColumnField\"\n >\n <div class=\"form-group\">\n <label\n class=\"form-group-column-label\"\n title=\"select: ${value.columnField}, options: ${filterOptions.map(\n column => `value=${column.name}, selected=${\n column.name === value.columnField\n }, ${column.header}\n `\n )}\"\n >Columns</label\n >\n\n <select\n @change=${(e: Event) => this.onfilterColumnChange(index, e)}\n .value=${value.columnField}\n data-v=${value.columnField}\n >\n ${filterOptions.map(\n column => html`\n <option\n value=${column.name}\n ?selected=${column.name === value.columnField}\n >\n ${column.header}\n </option>\n `\n )}\n </select>\n </div>\n </div>`\n : nothing}\n\n <div\n class=\"filter-form-column filter-form-column-border filterColumnField\"\n >\n <div class=\"filter-form-group\">\n <label class=\"form-group-column-label\"\n ><span>Columns</span>\n <select\n data-testid=${`filterColumnInput-${index}`}\n @change=${(e: Event) => this.onfilterColumnChange(index, e)}\n .value=${value.columnField}\n data-v=${value.columnField}\n >\n ${repeat(\n filterOptions,\n (column: Column) => column.name,\n (column: Column) => html`\n <option\n value=${column.name}\n ?selected=${column.name === value.columnField}\n >\n ${column.header}\n </option>\n `\n )}\n </select>\n </label>\n </div>\n </div>\n\n <div\n class=\"filter-form-column filter-form-column-border filterOperatorField\"\n >\n <div class=\"filter-form-group\">\n <label class=\"form-group-operator-label\"\n ><span>Operator</span>\n <select\n data-testid=${`filterOperatorInput-${index}`}\n class=\"filterOperatorInput\"\n @change=${(e: Event) => this.onfilterOperatorChange(index, e)}\n .value=${value.operatorValue}\n data-v=${value.operatorValue}\n >\n ${repeat(\n filterOptions.find(\n column => column.name === value.columnField\n )?.filterOperators ?? ['contains'],\n (filter: FilterOperator) => html`\n <option\n value=${filter}\n ?selected=${filter === value.operatorValue}\n >\n ${filter}\n </option>\n `\n )}\n </select>\n </label>\n </div>\n </div>\n <div\n class=\"filter-form-column filter-form-column-border filterValueField\"\n >\n <div class=\"filter-form-group\">\n ${this.renderFilterInputControl(value, index)}\n </div>\n </div>\n </div>\n `;\n }\n\n renderDropdown() {\n const disableAddButton =\n this.filters.length >= this.filterColumns.length ||\n this.activeFilters.length < this.filters.length;\n return html` <div class=\"filter-dropdown-content\">\n <div class=\"filter-body\">\n ${this.filters.map((filter, index) =>\n this.renderFilterInput(filter, index)\n )}\n </div>\n <div class=\"filter-footer\">\n <ix-button\n data-testid=\"addFilterButton\"\n class=\"add-filter-button\"\n @click=\"${() => this.addFilter()}\"\n ?disabled=${disableAddButton}\n appearance=\"text\"\n >\n <ix-icon slot=\"icon\">add</ix-icon>\n Add filter\n </ix-button>\n <ix-button\n data-testid=\"clearAllFiltersButton\"\n @click=\"${() => this.clearFilters()}\"\n ?disabled=${this.activeFilters.length === 0}\n appearance=\"text\"\n >\n Clear all\n </ix-button>\n </div>\n </div>`;\n }\n\n render() {\n return html` <div class=\"grid-menu\">\n <div class=\"filter-container tooltip-container\">\n ${this.activeFilters.length > 0\n ? html`<span class=\"filter-superscript\"\n >${this.activeFilters.length}</span\n >`\n : nothing}\n <ix-button\n data-testid=\"showFiltersButton\"\n appearance=\"text\"\n class=\"filter_list filter-button\"\n @click=${() => {\n this.isDropdownVisible = !this.isDropdownVisible;\n }}\n @keyDown=${() => {\n this.isDropdownVisible = !this.isDropdownVisible;\n }}\n >\n <div class=\"slot-wrap\">\n <ix-icon appearance=\"default\" class=\"filter-icon\"\n >filter_list</ix-icon\n >\n <span class=\"filter\">${copy.filters}</span>\n </div>\n </ix-button>\n <div class=\"tool-tip\">${this.renderToolTip()}</div>\n ${this.isDropdownVisible ? this.renderDropdown() : nothing}\n </div>\n </div>`;\n }\n}\n"]}
|
|
1
|
+
{"version":3,"file":"IxGridRowFilter.js","sourceRoot":"","sources":["../../src/components/IxGridRowFilter.ts"],"names":[],"mappings":"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","sourcesContent":["import '@digital-realty/ix-button/ix-button.js';\nimport '@digital-realty/ix-date/ix-date.js';\nimport '@digital-realty/ix-date-next/ix-date-next.js';\nimport '@digital-realty/ix-icon-button/ix-icon-button.js';\nimport '@digital-realty/ix-icon/ix-icon.js';\nimport '@digital-realty/ix-select/ix-select.js';\nimport { format, formatDate } from 'date-fns/format.js';\nimport { LitElement, html, nothing } from 'lit';\nimport { customElement, property, state } from 'lit/decorators.js';\nimport { repeat } from 'lit/directives/repeat.js';\nimport type { Column, DataType, FilterOperator } from '../IxGrid.js';\nimport { IxGridViewStyles } from '../grid-view-styles.js';\nimport { copy } from '../ix-grid-copy.js';\nimport { IxGridRowFilterStyles } from './grid-row-filter-styles.js';\n\nexport interface Filter {\n columnField: string;\n operatorValue: string;\n dataType?: DataType;\n value: string;\n}\n\n@customElement('ix-grid-row-filter')\nexport class IxGridRowFilter extends LitElement {\n static readonly styles = [IxGridViewStyles, IxGridRowFilterStyles];\n\n @property({ type: Array }) columns: Column[] = [];\n\n @property({ type: Number }) filterValueChangeDebounceTime: number = 300;\n\n @property({ type: Boolean }) readParamsFromURL = false;\n\n @property({ type: Boolean }) useNewDatePicker = false;\n\n @property({ type: String }) maxDate: string = formatDate(\n new Date(),\n 'yyyy-MM-dd'\n );\n\n @state() private isDropdownVisible: boolean = false;\n\n @state() private filters: Filter[] = [];\n\n @state() private filterableColumns: Column[] = [];\n\n @state() private filterColumns: string[] = [];\n\n @state() private activeFilters: Filter[] = [];\n\n @state() private mapSelect: boolean = false;\n\n @state() private fromDateErrorText? = '';\n\n @state() private oldValueLength: number = 0;\n\n private debounceEvent: ReturnType<typeof setTimeout> | undefined;\n\n private debouncedOnFilterValueChange: (\n index: number,\n target: EventTarget\n ) => void = () => {};\n\n updateActiveFilters() {\n this.activeFilters = this.filters.filter(filter => filter.value.length > 0);\n }\n\n connectedCallback() {\n super.connectedCallback();\n document.addEventListener('click', this.closeOnOuterClick);\n window.addEventListener('popstate', this.handlePopState);\n }\n\n disconnectedCallback() {\n super.disconnectedCallback();\n document.removeEventListener('click', this.closeOnOuterClick);\n window.removeEventListener('popstate', this.handlePopState);\n }\n\n firstUpdated() {\n this.filterableColumns = this.columns.filter(column => column.filterable);\n this.filterColumns = this.filterableColumns.map(column => column.name);\n\n if (this.readParamsFromURL) {\n this.filters = this.parseFilterQueryString();\n }\n\n if (!this.filters.length) {\n this.addFilter();\n }\n\n this.updateActiveFilters();\n this.dispatchUpdate(false);\n this.debouncedOnFilterValueChange = (index, target) => {\n clearTimeout(this.debounceEvent);\n this.debounceEvent = setTimeout(\n () => this.onfilterValueChange.bind(this)(index, target),\n this.filterValueChangeDebounceTime\n );\n };\n }\n\n get filterNames() {\n return this.filters.map(filter => filter.columnField);\n }\n\n get unselectedFilters() {\n return this.filterColumns.filter(f => !this.filterNames.includes(f));\n }\n\n closeOnOuterClick = (e: Event) => {\n if (!e.composedPath().includes(this)) {\n this.isDropdownVisible = false;\n }\n };\n\n parseFilterQueryString(): Filter[] {\n const params = new URLSearchParams(window.location.search);\n const filters: Filter[] = [];\n\n this.filterableColumns.forEach(fc => {\n fc.filterOperators?.forEach(operator => {\n const key = `${fc.name}_${operator}`;\n\n if (params.has(key)) {\n filters.push({\n columnField: fc.name,\n operatorValue: operator,\n dataType: fc.dataType,\n value: params.get(key) ?? '',\n });\n }\n });\n });\n\n return filters;\n }\n\n dispatchUpdate(resetPage = true) {\n this.dispatchEvent(\n new CustomEvent('rowFilter', {\n detail: {\n filters: this.filters.filter(filter => filter.value.length),\n resetPage,\n },\n bubbles: true,\n composed: true,\n })\n );\n }\n\n addFilter() {\n const nextFilter =\n this.filterColumns.find(filter => !this.filterNames.includes(filter)) ||\n '';\n const filterOperators = this.filterableColumns.find(\n c => c.name === nextFilter\n )?.filterOperators || ['contains'];\n\n const filterDataType =\n this.filterableColumns.find(c => c.name === nextFilter)?.dataType ||\n 'string';\n\n this.filters = [\n ...this.filters,\n {\n columnField: nextFilter,\n operatorValue: filterOperators[0],\n dataType: filterDataType,\n value: '',\n },\n ];\n this.updateActiveFilters();\n }\n\n clearFilters() {\n this.filters = [];\n this.addFilter();\n this.dispatchUpdate();\n }\n\n removeFilter(index: number) {\n this.filters = this.filters.filter((_, i) => i !== index);\n this.dispatchUpdate();\n if (this.filters.length === 0) {\n this.isDropdownVisible = false;\n this.addFilter();\n }\n\n this.updateActiveFilters();\n }\n\n private handlePopState = () => {\n this.filters = this.parseFilterQueryString();\n if (this.filters.length === 0) {\n this.isDropdownVisible = false;\n this.addFilter();\n }\n this.updateActiveFilters();\n };\n\n private onfilterColumnChange(index: number, e: Event) {\n const selectedValue = (e.target as HTMLSelectElement).value;\n const selectedColumn = this.filterableColumns.find(\n column => column.name === selectedValue\n );\n this.filters[index].columnField = selectedValue;\n this.filters[index].dataType = selectedColumn?.dataType;\n this.filters[index].operatorValue =\n selectedColumn?.filterOperators?.[0] || 'contains';\n\n this.filters = [...this.filters];\n\n this.dispatchUpdate();\n }\n\n private onfilterOperatorChange(index: number, e: Event) {\n const selectedValue = (e.target as HTMLSelectElement).value;\n this.filters[index].operatorValue = selectedValue;\n\n this.filters = [...this.filters];\n\n this.dispatchUpdate();\n }\n\n private onDatefilterValueChange(index: number, value: string) {\n this.filters[index].value = value;\n this.dispatchUpdate();\n this.updateActiveFilters();\n }\n\n private onfilterValueChange(index: number, target: EventTarget) {\n const { value } = target as HTMLInputElement;\n this.filters[index].value = value;\n\n const newValueLength = this.filters[index].value.length;\n if (\n this.filters[index].columnField.length > 0 &&\n (newValueLength >= 3 || newValueLength < this.oldValueLength)\n ) {\n this.dispatchUpdate();\n }\n this.updateActiveFilters();\n this.oldValueLength = newValueLength;\n }\n\n formatCamelCaseToEnglish(text: string) {\n const spaced = text.replace(/([A-Z])/g, ' $1').toLowerCase();\n const english = spaced.charAt(0).toUpperCase() + spaced.slice(1);\n return english;\n }\n\n renderToolTip() {\n if (this.isDropdownVisible) {\n return copy.hideFilters;\n }\n if (!this.activeFilters.length) {\n return copy.showFilters;\n }\n return html` <p>${this.activeFilters.length} ${copy.activeFilter}</p>\n <ul>\n ${this.activeFilters.map(filter => {\n let displayValue = filter.value;\n\n if (filter.dataType === 'dateTime' && this.useNewDatePicker) {\n const date = this.shadowRoot?.querySelector(`ix-date-next`) as any;\n displayValue = format(displayValue, date.format);\n }\n\n return html`<li>\n ${this.formatCamelCaseToEnglish(filter.columnField)}\n ${filter.operatorValue} ${displayValue}\n </li>`;\n })}\n </ul>`;\n }\n\n private renderStringInput(value: any, index: number) {\n return html`<label class=\"form-group-operator-label\">\n <span>Value</span>\n <input\n data-testid=${`filterValueInput-${index}`}\n placeholder=\"Filter value\"\n @input=${(e: Event) =>\n this.debouncedOnFilterValueChange(index, e.target!)}\n .value=${value.value}\n />\n </label>`;\n }\n\n private renderDateInput(value: any, index: number) {\n return this.useNewDatePicker\n ? html`<ix-date-next\n data-testid=${`filterValueInput-${index}`}\n .value=${value.value}\n max=${this.maxDate}\n name=\"${value.columnField}-valueDate\"\n showCalendarOnMouseDown=\"true\"\n .errorText=${this.fromDateErrorText}\n .onChanged=${e => this.onDatefilterValueChange(index, e)}\n >\n </ix-date-next>`\n : html`<ix-date\n data-testid=${`filterValueInput-${index}`}\n .value=${value.value}\n max=${this.maxDate}\n name=\"${value.columnField}-valueDate\"\n .errorText=${this.fromDateErrorText}\n .onChanged=${e => this.onDatefilterValueChange(index, e)}\n >\n </ix-date>`;\n }\n\n private renderFilterInputControl(value: any, index: number) {\n switch (value.dataType) {\n case 'string':\n case undefined:\n return this.renderStringInput(value, index);\n case 'dateTime':\n return this.renderDateInput(value, index);\n default:\n return nothing;\n }\n }\n\n renderFilterInput(value: Filter, index: number) {\n const options = [value.columnField, ...this.unselectedFilters];\n const filterOptions = this.filterableColumns.filter(column =>\n options.includes(column.name)\n );\n return html`\n <div class=\"filter-form\">\n <div class=\"filter-remove filter-form-column\">\n <div class=\"form-group\">\n <ix-icon-button\n icon=\"close\"\n data-testid=\"clearFilterButton\"\n @click=${() => this.removeFilter(index)}\n @keyDown=${(e: KeyboardEvent) => {\n if (e.key === ' ' || e.key === 'Enter') {\n this.removeFilter(index);\n }\n }}\n ></ix-icon-button>\n </div>\n </div>\n ${this.mapSelect\n ? html`<div\n class=\"filter-form-column filter-form-column-border filterColumnField\"\n >\n <div class=\"form-group\">\n <label\n class=\"form-group-column-label\"\n title=\"select: ${value.columnField}, options: ${filterOptions.map(\n column => `value=${column.name}, selected=${\n column.name === value.columnField\n }, ${column.header}\n `\n )}\"\n >Columns</label\n >\n\n <select\n @change=${(e: Event) => this.onfilterColumnChange(index, e)}\n .value=${value.columnField}\n data-v=${value.columnField}\n >\n ${filterOptions.map(\n column => html`\n <option\n value=${column.name}\n ?selected=${column.name === value.columnField}\n >\n ${column.header}\n </option>\n `\n )}\n </select>\n </div>\n </div>`\n : nothing}\n\n <div\n class=\"filter-form-column filter-form-column-border filterColumnField\"\n >\n <div class=\"filter-form-group\">\n <label class=\"form-group-column-label\"\n ><span>Columns</span>\n <select\n data-testid=${`filterColumnInput-${index}`}\n @change=${(e: Event) => this.onfilterColumnChange(index, e)}\n .value=${value.columnField}\n data-v=${value.columnField}\n >\n ${repeat(\n filterOptions,\n (column: Column) => column.name,\n (column: Column) => html`\n <option\n value=${column.name}\n ?selected=${column.name === value.columnField}\n >\n ${column.header}\n </option>\n `\n )}\n </select>\n </label>\n </div>\n </div>\n\n <div\n class=\"filter-form-column filter-form-column-border filterOperatorField\"\n >\n <div class=\"filter-form-group\">\n <label class=\"form-group-operator-label\"\n ><span>Operator</span>\n <select\n data-testid=${`filterOperatorInput-${index}`}\n class=\"filterOperatorInput\"\n @change=${(e: Event) => this.onfilterOperatorChange(index, e)}\n .value=${value.operatorValue}\n data-v=${value.operatorValue}\n >\n ${repeat(\n filterOptions.find(\n column => column.name === value.columnField\n )?.filterOperators ?? ['contains'],\n (filter: FilterOperator) => html`\n <option\n value=${filter}\n ?selected=${filter === value.operatorValue}\n >\n ${filter}\n </option>\n `\n )}\n </select>\n </label>\n </div>\n </div>\n <div\n class=\"filter-form-column filter-form-column-border filterValueField\"\n >\n <div class=\"filter-form-group\">\n ${this.renderFilterInputControl(value, index)}\n </div>\n </div>\n </div>\n `;\n }\n\n renderDropdown() {\n const disableAddButton =\n this.filters.length >= this.filterColumns.length ||\n this.activeFilters.length < this.filters.length;\n return html` <div class=\"filter-dropdown-content\">\n <div class=\"filter-body\">\n ${this.filters.map((filter, index) =>\n this.renderFilterInput(filter, index)\n )}\n </div>\n <div class=\"filter-footer\">\n <ix-button\n data-testid=\"addFilterButton\"\n class=\"add-filter-button\"\n @click=\"${() => this.addFilter()}\"\n ?disabled=${disableAddButton}\n appearance=\"text\"\n >\n <ix-icon slot=\"icon\">add</ix-icon>\n Add filter\n </ix-button>\n <ix-button\n data-testid=\"clearAllFiltersButton\"\n @click=\"${() => this.clearFilters()}\"\n ?disabled=${this.activeFilters.length === 0}\n appearance=\"text\"\n >\n Clear all\n </ix-button>\n </div>\n </div>`;\n }\n\n render() {\n return html` <div class=\"grid-menu\">\n <div class=\"filter-container tooltip-container\">\n ${this.activeFilters.length > 0\n ? html`<span class=\"filter-superscript\"\n >${this.activeFilters.length}</span\n >`\n : nothing}\n <ix-button\n data-testid=\"showFiltersButton\"\n appearance=\"text\"\n class=\"filter_list filter-button\"\n @click=${() => {\n this.isDropdownVisible = !this.isDropdownVisible;\n }}\n @keyDown=${() => {\n this.isDropdownVisible = !this.isDropdownVisible;\n }}\n >\n <div class=\"slot-wrap\">\n <ix-icon appearance=\"default\" class=\"filter-icon\"\n >filter_list</ix-icon\n >\n <span class=\"filter\">${copy.filters}</span>\n </div>\n </ix-button>\n <div class=\"tool-tip\">${this.renderToolTip()}</div>\n ${this.isDropdownVisible ? this.renderDropdown() : nothing}\n </div>\n </div>`;\n }\n}\n"]}
|
|
@@ -13,6 +13,7 @@ let IxPagination = class IxPagination extends LitElement {
|
|
|
13
13
|
this.page = 1;
|
|
14
14
|
this.pageSize = 10;
|
|
15
15
|
this.pageSizes = [5, 10, 25, 100];
|
|
16
|
+
this.isSimple = false;
|
|
16
17
|
}
|
|
17
18
|
changePage(offset) {
|
|
18
19
|
this.page += offset;
|
|
@@ -38,8 +39,8 @@ let IxPagination = class IxPagination extends LitElement {
|
|
|
38
39
|
render() {
|
|
39
40
|
const back = this.page > 1;
|
|
40
41
|
const next = this.recordCount > this.page * this.pageSize;
|
|
41
|
-
return html ` <div class="pagination">
|
|
42
|
-
<div>
|
|
42
|
+
return html ` <div class="pagination ${this.isSimple ? 'simple' : ''}">
|
|
43
|
+
<div ?hidden=${this.isSimple}>
|
|
43
44
|
<p class="rows-per-page" data-testid="ix-pagination-rows-per-page">
|
|
44
45
|
${copy.rowsPerPage}:
|
|
45
46
|
</p>
|
|
@@ -103,6 +104,9 @@ __decorate([
|
|
|
103
104
|
__decorate([
|
|
104
105
|
property({ type: Array })
|
|
105
106
|
], IxPagination.prototype, "pageSizes", void 0);
|
|
107
|
+
__decorate([
|
|
108
|
+
property({ type: Boolean, attribute: 'simple' })
|
|
109
|
+
], IxPagination.prototype, "isSimple", void 0);
|
|
106
110
|
IxPagination = __decorate([
|
|
107
111
|
customElement('ix-pagination')
|
|
108
112
|
], IxPagination);
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"IxPagination.js","sourceRoot":"","sources":["../../src/components/IxPagination.ts"],"names":[],"mappings":";AAAA,OAAO,EAAE,UAAU,EAAE,IAAI,EAAE,MAAM,KAAK,CAAC;AACvC,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAC;AAC5D,OAAO,kDAAkD,CAAC;AAC1D,OAAO,wCAAwC,CAAC;AAChD,OAAO,EAAE,gBAAgB,EAAE,MAAM,wBAAwB,CAAC;AAC1D,OAAO,EAAE,gBAAgB,EAAE,MAAM,wBAAwB,CAAC;AAC1D,OAAO,EAAE,IAAI,EAAE,MAAM,oBAAoB,CAAC;AAGnC,IAAM,YAAY,GAAlB,MAAM,YAAa,SAAQ,UAAU;IAArC;;QAGuB,gBAAW,GAAG,CAAC,CAAC;QAEhB,SAAI,GAAG,CAAC,CAAC;QAET,aAAQ,GAAG,EAAE,CAAC;QAEf,cAAS,GAAa,CAAC,CAAC,EAAE,EAAE,EAAE,EAAE,EAAE,GAAG,CAAC,CAAC;
|
|
1
|
+
{"version":3,"file":"IxPagination.js","sourceRoot":"","sources":["../../src/components/IxPagination.ts"],"names":[],"mappings":"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","sourcesContent":["import { LitElement, html } from 'lit';\nimport { customElement, property } from 'lit/decorators.js';\nimport '@digital-realty/ix-icon-button/ix-icon-button.js';\nimport '@digital-realty/ix-select/ix-select.js';\nimport { IxGridViewStyles } from '../grid-view-styles.js';\nimport { PaginationStyles } from './pagination-styles.js';\nimport { copy } from '../ix-grid-copy.js';\n\n@customElement('ix-pagination')\nexport class IxPagination extends LitElement {\n static readonly styles = [IxGridViewStyles, PaginationStyles];\n\n @property({ type: Number }) recordCount = 0;\n\n @property({ type: Number }) page = 1;\n\n @property({ type: Number }) pageSize = 10;\n\n @property({ type: Array }) pageSizes: number[] = [5, 10, 25, 100];\n\n @property({ type: Boolean, attribute: 'simple' }) isSimple = false;\n\n private changePage(offset: number) {\n this.page += offset;\n this.updatePagination();\n }\n\n private handlePageSizeSelection(e: Event) {\n const el = e.target as HTMLInputElement;\n const newPageSize = Number(el.value);\n\n const currentFirstRecord = (this.page - 1) * this.pageSize + 1;\n const newPageNum = Math.ceil(currentFirstRecord / newPageSize);\n\n this.updatePagination(newPageNum, newPageSize);\n }\n\n updatePagination(page = this.page, pageSize = this.pageSize) {\n this.dispatchEvent(\n new CustomEvent('updatePagination', {\n detail: {\n page,\n pageSize,\n },\n bubbles: true,\n composed: true,\n })\n );\n }\n\n render() {\n const back = this.page > 1;\n const next = this.recordCount > this.page * this.pageSize;\n return html` <div class=\"pagination ${this.isSimple ? 'simple' : ''}\">\n <div ?hidden=${this.isSimple}>\n <p class=\"rows-per-page\" data-testid=\"ix-pagination-rows-per-page\">\n ${copy.rowsPerPage}:\n </p>\n <ix-select\n wide-menu\n menu-positioning=\"fixed\"\n class=\"pagination__select-input\"\n @request-selection=${this.handlePageSizeSelection}\n selected-index=${this.pageSizes.indexOf(this.pageSize)}\n filled\n >\n ${this.pageSizes.map(\n option => html`\n <ix-select-option\n class=\"select-option\"\n value=${option}\n ?selected=${option === this.pageSize}\n >\n <div slot=\"headline\">${option}</div>\n </ix-select-option>\n `\n )}\n </ix-select>\n </div>\n <div>\n <p data-testid=\"ix-pagination-page-of-page\">\n ${this.recordCount > 0 ? (this.page - 1) * this.pageSize + 1 : 0} -\n ${this.page * this.pageSize > this.recordCount\n ? html`${this.recordCount}`\n : html`${this.page * this.pageSize}`}\n of ${this.recordCount > 0 ? this.recordCount : 0}\n </p>\n <div class=\"pagination-nav\">\n <ix-icon-button\n ?disabled=${!back}\n @click=${() => back && this.changePage(-1)}\n icon=\"chevron_left\"\n data-testid=\"ix-pagination-prev\"\n >\n </ix-icon-button>\n <ix-icon-button\n ?disabled=${!next}\n @click=${() => next && this.changePage(+1)}\n icon=\"chevron_right\"\n data-testid=\"ix-pagination-next\"\n >\n </ix-icon-button>\n </div>\n </div>\n </div>`;\n }\n}\n"]}
|
|
@@ -159,8 +159,14 @@ export const IxGridRowFilterStyles = css `
|
|
|
159
159
|
flex-direction: column;
|
|
160
160
|
align-items: baseline;
|
|
161
161
|
height: 54px;
|
|
162
|
-
justify-content:
|
|
162
|
+
justify-content: space-between;
|
|
163
163
|
font-family: var(--text-default-font, sans-serif);
|
|
164
|
+
white-space: wrap;
|
|
165
|
+
|
|
166
|
+
ix-date-next,
|
|
167
|
+
ix-date {
|
|
168
|
+
margin-top: 10px;
|
|
169
|
+
}
|
|
164
170
|
}
|
|
165
171
|
|
|
166
172
|
option {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"grid-row-filter-styles.js","sourceRoot":"","sources":["../../src/components/grid-row-filter-styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B,MAAM,CAAC,MAAM,qBAAqB,GAAG,GAAG,CAAA
|
|
1
|
+
{"version":3,"file":"grid-row-filter-styles.js","sourceRoot":"","sources":["../../src/components/grid-row-filter-styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B,MAAM,CAAC,MAAM,qBAAqB,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA2TvC,CAAC","sourcesContent":["import { css } from 'lit';\n\nexport const IxGridRowFilterStyles = css`\n .slot-wrap {\n display: flex;\n }\n\n .slot-wrap ix-icon {\n --ix-icon-font-size: 24px;\n color: var(--clr-primary, #1456e0);\n margin-right: 5px;\n }\n\n .grid-menu ix-button .filter {\n margin-top: 2px;\n }\n\n .filter-form {\n white-space: nowrap;\n padding: 9px;\n color: var(--clr-on-surface-variant, #092241b3);\n }\n\n .filter-form-column {\n display: inline-block;\n vertical-align: middle;\n }\n\n .filter-remove span {\n margin-right: 0px;\n color: var(--clr-on-surface-variant, #092241b3);\n }\n\n .filter-dropdown-content {\n position: absolute;\n display: inline;\n right: 0;\n top: 78%;\n box-shadow: 0px 8px 16px 0px rgba(0, 0, 0, 0.2);\n z-index: 3;\n transition: box-shadow 300ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;\n border-radius: 12px;\n box-shadow: rgba(0, 0, 0, 0.2) 0px 5px 5px -3px,\n rgba(0, 0, 0, 0.14) 0px 8px 10px 1px, rgba(0, 0, 0, 0.12) 0px 3px 14px 2px;\n background-color: #ffffff;\n z-index: 10;\n }\n\n .filter-form input,\n .filter-form select,\n .filter-form option {\n font-family: var(--text-default-font, sans-serif);\n font-size: var(--text-default-size, 16px);\n letter-spacing: var(--text-default-letter-spacing, 0.0275em);\n line-height: var(--text-default-line-height, 1.75em);\n font-weight: var(--text-default-weight, normal);\n text-transform: var(--text-default-decoration, none);\n text-decoration: var(--text-default-transform, none);\n border-radius: 0px;\n cursor: pointer;\n box-sizing: content-box;\n background: none;\n height: 1.4375em;\n margin: 0px;\n animation-name: mui-auto-fill-cancel;\n animation-duration: 10ms;\n border: none;\n border-image: initial;\n box-sizing: border-box;\n cursor: text;\n user-select: none;\n color: currentcolor;\n -webkit-tap-highlight-color: transparent;\n display: block;\n min-width: 0px;\n width: 100%;\n height: 25px;\n border-bottom: 1px solid black;\n }\n\n .filter-form option {\n -webkit-tap-highlight-color: #9ca6b2;\n }\n\n .filter-form input:hover,\n .filter-form select:hover {\n outline: none !important;\n border-bottom: 2px solid black;\n }\n\n .filter-form input:focus,\n .filter-form select:focus {\n outline: none !important;\n border-bottom: 2px solid #1456e0;\n }\n\n .filter-form select:focus {\n background-color: rgba(0, 0, 0, 0.05);\n }\n\n .form-group {\n display: flex;\n flex-direction: column;\n align-items: baseline;\n height: 54px;\n justify-content: flex-end;\n font-family: var(--text-default-font, sans-serif);\n }\n\n .form-group label {\n font-family: var(--text-default-font, sans-serif);\n font-size: var(--text-default-size, 16px);\n letter-spacing: var(--text-default-letter-spacing, 0.0275em);\n line-height: var(--text-default-line-height, 1.75em);\n font-weight: var(--text-default-weight, normal);\n text-transform: var(--text-default-decoration, none);\n text-decoration: var(--text-default-transform, none);\n padding: 0px;\n color: #092241;\n display: block;\n transform-origin: left top;\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n max-width: 133%;\n transform: translate(0px, -1.5px) scale(0.75);\n transition: color 200ms cubic-bezier(0, 0, 0.2, 1) 0ms,\n transform 200ms cubic-bezier(0, 0, 0.2, 1) 0ms,\n max-width 200ms cubic-bezier(0, 0, 0.2, 1) 0ms;\n }\n\n .filter-form-group label span {\n font-family: var(--text-default-font, sans-serif);\n font-size: var(--text-default-size, 16px);\n letter-spacing: var(--text-default-letter-spacing, 0.0275em);\n line-height: var(--text-default-line-height, 1.75em);\n font-weight: var(--text-default-weight, normal);\n text-transform: var(--text-default-decoration, none);\n text-decoration: var(--text-default-transform, none);\n padding: 0px;\n color: #092241;\n display: block;\n transform-origin: left top;\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n max-width: 133%;\n transform: translate(0px, -1.5px) scale(0.75);\n transition: color 200ms cubic-bezier(0, 0, 0.2, 1) 0ms,\n transform 200ms cubic-bezier(0, 0, 0.2, 1) 0ms,\n max-width 200ms cubic-bezier(0, 0, 0.2, 1) 0ms;\n }\n\n .filter-form-group label:focus-within span {\n color: #1456e0;\n }\n\n .filter-form-group {\n display: flex;\n flex-direction: column;\n align-items: baseline;\n height: 54px;\n justify-content: space-between;\n font-family: var(--text-default-font, sans-serif);\n white-space: wrap;\n\n ix-date-next,\n ix-date {\n margin-top: 10px;\n }\n }\n\n option {\n font-weight: normal;\n display: block;\n min-height: 1.2em;\n padding: 0px 2px 1px;\n white-space: nowrap;\n }\n\n .filter-footer {\n padding: 9px;\n display: flex;\n justify-content: space-between;\n }\n\n .no-display {\n display: none;\n }\n\n .filter-local-operator-empty {\n width: 54px;\n border: none;\n }\n\n .grid-menu span.filter-superscript {\n position: absolute;\n top: 6px;\n left: 14px;\n z-index: 1;\n display: flex;\n align-items: center;\n justify-content: center;\n font-family: var(--text-caption-font, sans-serif);\n font-size: var(--text-caption-size, 0.75rem);\n letter-spacing: var(--text-caption-letter-spacing, 0.03333333em);\n line-height: var(--text-caption-line-height, 1.33333333em);\n font-weight: var(--text-caption-weight, normal);\n text-transform: var(--text-caption-transform, none);\n text-decoration: var(--text-caption-decoration, none);\n padding: 0;\n height: 16px;\n width: 16px;\n border-radius: 50%;\n background-color: var(--clr-primary, #1456e0);\n color: var(--clr-on-primary, #fff);\n }\n\n .filterlist {\n width: 40px;\n }\n\n .filterColumnField {\n width: 150px;\n }\n\n .filterValueField {\n width: 190px;\n }\n\n .filterOperatorField {\n width: 120px;\n }\n\n .form-group-operator-label {\n width: 100%;\n }\n\n .filter-form .filterOperatorInput {\n min-width: 96px;\n }\n\n select:hover {\n cursor: pointer;\n }\n\n input:hover {\n cursor: text;\n }\n\n .tooltip-container {\n position: relative;\n display: inline-block;\n }\n\n .tool-tip {\n color: var(--clr-on-secondary, #fff);\n overflow-wrap: break-word;\n border-radius: 3px;\n background-color: var(--clr-secondary, #071454);\n padding: 5px 8px;\n font-family: var(--text-caption-font, sans-serif);\n font-size: var(--text-caption-size, 0.75rem);\n letter-spacing: var(--text-caption-letter-spacing, 0.03333333em);\n line-height: var(--text-caption-line-height, 1.33333333em);\n font-weight: var(--text-caption-weight, normal);\n text-transform: var(--text-caption-transform, none);\n text-decoration: var(--text-caption-decoration, none);\n\n position: absolute;\n top: 42px;\n right: 0;\n z-index: 3;\n white-space: nowrap;\n display: none;\n }\n\n .filter-button:hover ~ .tool-tip {\n display: block;\n }\n\n .tool-tip li {\n margin-left: -21px;\n overflow-wrap: break-word;\n border-radius: 3px;\n max-width: 250px;\n min-width: 200px;\n white-space: wrap;\n }\n\n .tool-tip p {\n margin: 0;\n padding: 0;\n }\n\n .grid-menu ix-button {\n align-items: center;\n display: flex;\n }\n\n @media only screen and (max-width: 840px) {\n .filter-dropdown-content {\n right: inherit;\n top: 0;\n }\n }\n\n @media only screen and (max-width: 600px) {\n .grid-menu ix-button .filter {\n display: none;\n }\n .grid-menu ix-button {\n --md-text-button-leading-space: 6px;\n --md-text-button-trailing-space: 0;\n margin-left: 4px;\n }\n }\n`;\n"]}
|
|
@@ -7,6 +7,10 @@ export const PaginationStyles = css `
|
|
|
7
7
|
);
|
|
8
8
|
}
|
|
9
9
|
|
|
10
|
+
[hidden] {
|
|
11
|
+
display: none !important;
|
|
12
|
+
}
|
|
13
|
+
|
|
10
14
|
.pagination {
|
|
11
15
|
display: flex;
|
|
12
16
|
align-items: center;
|
|
@@ -22,6 +26,10 @@ export const PaginationStyles = css `
|
|
|
22
26
|
margin: 1.25rem 0.5rem 1.25rem 1rem;
|
|
23
27
|
}
|
|
24
28
|
|
|
29
|
+
.pagination.simple {
|
|
30
|
+
margin: 0;
|
|
31
|
+
}
|
|
32
|
+
|
|
25
33
|
.pagination > div {
|
|
26
34
|
display: flex;
|
|
27
35
|
align-items: center;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"pagination-styles.js","sourceRoot":"","sources":["../../src/components/pagination-styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B,MAAM,CAAC,MAAM,gBAAgB,GAAG,GAAG,CAAA
|
|
1
|
+
{"version":3,"file":"pagination-styles.js","sourceRoot":"","sources":["../../src/components/pagination-styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B,MAAM,CAAC,MAAM,gBAAgB,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA0FlC,CAAC","sourcesContent":["import { css } from 'lit';\n\nexport const PaginationStyles = css`\n :host {\n --md-filled-select-text-field-input-text-size: var(\n --ix-filled-select-text-field-input-text-size,\n 12px\n );\n }\n\n [hidden] {\n display: none !important;\n }\n\n .pagination {\n display: flex;\n align-items: center;\n justify-content: end;\n gap: 0;\n font-family: var(--text-caption-font, sans-serif);\n font-size: var(--text-caption-size, 0.75rem);\n letter-spacing: var(--text-caption-letter-spacing, 0.03333333em);\n line-height: var(--text-caption-line-height, 1.33333333em);\n font-weight: var(--text-caption-weight, normal);\n text-transform: var(--text-caption-transform, none);\n text-decoration: var(--text-caption-decoration, none);\n margin: 1.25rem 0.5rem 1.25rem 1rem;\n }\n\n .pagination.simple {\n margin: 0;\n }\n\n .pagination > div {\n display: flex;\n align-items: center;\n gap: 0.5rem;\n }\n\n .pagination p {\n margin: 0;\n }\n\n .pagination-nav {\n display: flex;\n margin-left: 1.5rem;\n height: 1.5rem;\n gap: 0.5rem;\n }\n\n .pagination-nav > ix-icon-button {\n margin-top: -0.5rem;\n }\n\n .rows-per-page {\n color: var(--clr-on-surface, #092241);\n }\n\n ix-select {\n --md-menu-container-color: var(--bg-surface-container-lowest, #fff);\n --md-filled-select-text-field-container-color: var(\n --bg-surface-container-lowest,\n #fff\n );\n --md-filled-select-text-field-active-indicator-height: 0px;\n --md-filled-select-text-field-hover-indicator-height: 0px;\n --md-filled-field-hover-active-indicator-height: 0px;\n --md-filled-field-focus-active-indicator-height: 0px;\n --md-filled-field-bottom-space: 4px;\n --md-filled-field-top-space: 4px;\n\n --md-filled-select-text-field-focus-trailing-icon-color: var(\n --clr-primary,\n #1456e0\n );\n --md-filled-select-text-field-focus-active-indicator-color: var(\n --md-filled-select-text-field-focus-trailing-icon-color\n );\n }\n\n ix-select-option {\n --md-menu-item-selected-container-color: rgba(20, 86, 224, 0.1);\n }\n\n @media only screen and (max-width: 600px) {\n .pagination {\n justify-content: space-between;\n }\n .pagination > div {\n gap: 0;\n }\n }\n`;\n"]}
|
package/dist/grid-view-styles.js
CHANGED
|
@@ -153,7 +153,7 @@ export const IxGridViewStyles = css `
|
|
|
153
153
|
|
|
154
154
|
.progress-container {
|
|
155
155
|
position: relative;
|
|
156
|
-
top: 60px;
|
|
156
|
+
top: var(--progress-bar-top, 60px);
|
|
157
157
|
z-index: 1;
|
|
158
158
|
}
|
|
159
159
|
|
|
@@ -192,6 +192,17 @@ export const IxGridViewStyles = css `
|
|
|
192
192
|
|
|
193
193
|
.row-controls {
|
|
194
194
|
border-top: solid 1px var(--clr-border-outline, #0922411f);
|
|
195
|
+
padding: 8px;
|
|
196
|
+
}
|
|
197
|
+
|
|
198
|
+
.more-pagination {
|
|
199
|
+
align-items: center;
|
|
200
|
+
display: flex;
|
|
201
|
+
justify-content: flex-end;
|
|
202
|
+
}
|
|
203
|
+
|
|
204
|
+
.pagination {
|
|
205
|
+
flex-grow: 1;
|
|
195
206
|
}
|
|
196
207
|
|
|
197
208
|
.row-limit {
|
|
@@ -205,17 +216,12 @@ export const IxGridViewStyles = css `
|
|
|
205
216
|
|
|
206
217
|
/* launchpad variant */
|
|
207
218
|
.launchpad vaadin-grid {
|
|
208
|
-
--_lumo-grid-border-width: 0;
|
|
209
219
|
--lumo-size-xl: auto;
|
|
210
220
|
}
|
|
211
221
|
|
|
212
|
-
.launchpad
|
|
213
|
-
|
|
214
|
-
|
|
215
|
-
}
|
|
216
|
-
|
|
217
|
-
.launchpad vaadin-grid::part(body-row) {
|
|
218
|
-
border-bottom: 1px solid var(--clr-border-outline, rgba(9, 34, 65, 0.12));
|
|
222
|
+
.launchpad {
|
|
223
|
+
--ix-grid-cell-height: 44px;
|
|
224
|
+
--ix-grid-cell-padding: 14px 24px;
|
|
219
225
|
}
|
|
220
226
|
|
|
221
227
|
.launchpad .grid-header {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"grid-view-styles.js","sourceRoot":"","sources":["../src/grid-view-styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B,MAAM,CAAC,MAAM,gBAAgB,GAAG,GAAG,CAAA
|
|
1
|
+
{"version":3,"file":"grid-view-styles.js","sourceRoot":"","sources":["../src/grid-view-styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B,MAAM,CAAC,MAAM,gBAAgB,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA+RlC,CAAC","sourcesContent":["import { css } from 'lit';\n\nexport const IxGridViewStyles = css`\n :host {\n --_ix-grid-cell-padding: var(--ix-grid-cell-padding, 1rem);\n --lumo-primary-color-50pct: transparent;\n }\n\n vaadin-grid::part(first-frozen-to-end-cell) {\n border-left: 0.063rem solid var(--_lumo-grid-border-color);\n box-shadow: -0.375rem 0 0.375rem -0.375rem #0000001a;\n }\n\n * {\n font-family: inherit;\n }\n\n vaadin-grid::part(cell) {\n cursor: var(--ix-grid-cell-pointer, pointer);\n }\n\n vaadin-grid::part(header-cell) {\n cursor: default;\n --vaadin-grid-cell-background: #fff;\n }\n\n vaadin-grid::part(row):hover {\n --vaadin-grid-cell-background: var(--ix-grid-hover-background, #f5f5f5);\n }\n\n vaadin-grid-cell-content {\n font-size: 14px;\n --_cell-padding: var(--ix-grid-cell-padding, 14px 10px);\n }\n\n .hide-column-headers::part(header-cell) {\n display: none;\n }\n\n vaadin-grid::part(ix-disabled-cell) {\n cursor: default;\n color: var(--cp-neutral-blue-60p);\n --vaadin-grid-cell-background: var(--cp-neutral-blue-12p);\n }\n\n ix-grid-download-menu {\n width: 38px;\n margin-right: 2px;\n }\n\n ix-grid-column-filter {\n width: 36px;\n }\n\n .grid-container {\n background-color: var(--clr-surface-container-lowest, #ffffff);\n border-radius: 8px;\n box-shadow: rgba(0, 0, 0, 0.12) 0px 12px 20px -12px,\n #e1e4e8 0px 0px 0px 1px inset;\n box-sizing: border-box;\n padding: 2px;\n }\n\n .touch-edge {\n margin: 0 -3px;\n }\n\n .grid-header {\n display: flex;\n -webkit-box-pack: justify;\n place-content: space-between;\n -webkit-box-align: center;\n align-items: center;\n padding: 1rem;\n flex-wrap: wrap;\n gap: 18px;\n }\n\n .grid-menu {\n display: flex;\n align-items: center;\n margin-left: auto;\n }\n\n .grid-menu ix-button {\n --md-text-button-leading-space: 4px;\n --md-text-button-trailing-space: 4px;\n }\n\n .grid-menu span {\n color: var(--clr-primary, #1456e0);\n cursor: pointer;\n }\n\n .header {\n font-weight: bold;\n display: flex;\n user-select: none;\n align-items: center;\n padding-right: calc(var(--_ix-grid-cell-padding) + 2px);\n position: relative;\n\n &:not(.frozen):not(.last).border::after {\n content: '';\n display: block;\n position: absolute;\n border: 0;\n border-right-width: var(--ix-grid-header-border-width, 2px);\n border-color: var(\n --ix-grid-header-border-color,\n var(--clr-outline, #0922411f)\n );\n border-style: solid;\n margin-right: 0;\n top: 0;\n right: 0;\n bottom: 0;\n left: 0;\n z-index: 1;\n }\n\n .header-label {\n position: relative;\n text-overflow: ellipsis;\n overflow: hidden;\n flex-grow: 1;\n z-index: 2;\n padding-left: 0.25rem;\n }\n }\n\n .header .header-sort-icon {\n background: #fff;\n display: none;\n padding-left: 5px;\n font-size: 17px;\n color: rgba(0, 0, 0, 0.54);\n cursor: pointer;\n height: 18px;\n position: absolute;\n top: 0;\n right: 0;\n bottom: 0;\n z-index: 3;\n }\n\n .header:hover .header-sort-icon {\n display: block;\n }\n\n .columns-reordering {\n opacity: 0.25;\n }\n\n .progress-container {\n position: relative;\n top: var(--progress-bar-top, 60px);\n z-index: 1;\n }\n\n span .disabled {\n color: var(--clr-on-surface-variant, rgba(9, 34, 65, 0.7));\n }\n\n .disable-cursor {\n cursor: default !important;\n }\n\n .accounts {\n display: flex;\n align-items: center;\n }\n\n .account-name {\n margin: 0 8px 0 3px;\n }\n\n vaadin-grid-cell-content {\n font-family: var(--text-small-font, sans-serif);\n font-size: var(--text-small-size, 0.875rem);\n letter-spacing: var(--text-small-letter-spacing, 0.0275em);\n line-height: var(--text-small-line-height, 1.42857143em);\n font-weight: var(--text-small-weight, normal);\n text-decoration: var(--text-small-decoration, none);\n text-transform: var(--text-small-transform, none);\n --_cell-padding: var(--ix-grid-cell-padding, 14px 10px);\n }\n\n vaadin-grid-cell-content > div {\n overflow: hidden;\n text-overflow: ellipsis;\n }\n\n .row-controls {\n border-top: solid 1px var(--clr-border-outline, #0922411f);\n padding: 8px;\n }\n\n .more-pagination {\n align-items: center;\n display: flex;\n justify-content: flex-end;\n }\n\n .pagination {\n flex-grow: 1;\n }\n\n .row-limit {\n display: flex;\n padding: 8px;\n }\n\n .remove-all-button {\n margin-left: auto;\n }\n\n /* launchpad variant */\n .launchpad vaadin-grid {\n --lumo-size-xl: auto;\n }\n\n .launchpad {\n --ix-grid-cell-height: 44px;\n --ix-grid-cell-padding: 14px 24px;\n }\n\n .launchpad .grid-header {\n padding: 0.5rem 18px 0;\n }\n\n .launchpad .header {\n font-family: var(--text-caption-font, sans-serif);\n font-size: var(--text-caption-size, 0.75rem);\n letter-spacing: var(--text-caption-letter-spacing, 0.03333333em);\n line-height: var(--text-caption-line-height, 1.33333333em);\n font-weight: var(--text-caption-weight, normal);\n text-transform: var(--text-caption-transform, none);\n text-decoration: var(--text-caption-decoration, none);\n }\n\n .launchpad .grid-header h2 {\n font-family: var(--text-page-title-font, sans-serif);\n font-size: var(--text-page-title-size, 2.125rem);\n letter-spacing: var(--text-page-title-letter-spacing, 0.01029412em);\n line-height: var(--text-page-title-line-height, 1.17647059em);\n font-weight: var(--text-page-title-weight, bold);\n text-decoration: var(--text-page-title-decoration, none);\n text-transform: var(--text-page-title-transform, none);\n }\n\n vaadin-grid-cell-content {\n height: var(--ix-grid-cell-height, 52px);\n }\n\n @media only screen and (max-width: 840px) {\n .grid-header {\n display: flex;\n flex-direction: row;\n padding: 1rem;\n justify-content: space-between;\n }\n .grid-menu {\n padding-left: 0;\n margin-left: -4px;\n }\n }\n\n @media only screen and (max-width: 600px) {\n .grid-header {\n display: flex;\n align-items: flex-start;\n flex-direction: column;\n padding: 1rem;\n gap: 12px;\n }\n .grid-container {\n border-radius: 0;\n box-shadow: none;\n padding: 0;\n overflow: hidden;\n }\n }\n .column-max-width-set {\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n display: block;\n }\n`;\n"]}
|