@digital-realty/ix-filter-select 1.1.4 → 1.1.6
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/IxFilterSelect.d.ts
CHANGED
|
@@ -1,8 +1,9 @@
|
|
|
1
|
-
import { LitElement, PropertyValues } from 'lit';
|
|
1
|
+
import { LitElement, nothing, PropertyValues } from 'lit';
|
|
2
2
|
import '@digital-realty/ix-field/ix-field.js';
|
|
3
3
|
import '@digital-realty/ix-menu/ix-menu.js';
|
|
4
4
|
import '@digital-realty/ix-menu/ix-menu-item.js';
|
|
5
5
|
import '@digital-realty/ix-icon-button/ix-icon-button.js';
|
|
6
|
+
import '@digital-realty/ix-button';
|
|
6
7
|
import { IxMenu } from '@digital-realty/ix-menu';
|
|
7
8
|
import { onReportValidity } from '@material/web/labs/behaviors/on-report-validity.js';
|
|
8
9
|
import { createValidator, getValidityAnchor } from '@material/web/labs/behaviors/constraint-validation.js';
|
|
@@ -35,6 +36,10 @@ export declare class IxFilterSelect extends filterSelectBaseClass {
|
|
|
35
36
|
error: boolean;
|
|
36
37
|
tabIndex: number;
|
|
37
38
|
required: boolean;
|
|
39
|
+
onViewMoreButtonClick: any;
|
|
40
|
+
isViewMoreButtonVisible: boolean;
|
|
41
|
+
isViewMoreButtonLoading: boolean;
|
|
42
|
+
viewMoreButtonLabel: string;
|
|
38
43
|
private filteredOptions;
|
|
39
44
|
selectedItem: IFilterSelectOption | undefined;
|
|
40
45
|
private filterValue;
|
|
@@ -85,6 +90,7 @@ export declare class IxFilterSelect extends filterSelectBaseClass {
|
|
|
85
90
|
formStateRestoreCallback(formState: string): void;
|
|
86
91
|
private handleFocusChange;
|
|
87
92
|
focus(): void;
|
|
93
|
+
renderViewMoreButton(): typeof nothing | import("lit").TemplateResult<1>;
|
|
88
94
|
render(): import("lit").TemplateResult<1>;
|
|
89
95
|
}
|
|
90
96
|
export {};
|
package/dist/IxFilterSelect.js
CHANGED
|
@@ -7,6 +7,7 @@ import '@digital-realty/ix-field/ix-field.js';
|
|
|
7
7
|
import '@digital-realty/ix-menu/ix-menu.js';
|
|
8
8
|
import '@digital-realty/ix-menu/ix-menu-item.js';
|
|
9
9
|
import '@digital-realty/ix-icon-button/ix-icon-button.js';
|
|
10
|
+
import '@digital-realty/ix-button';
|
|
10
11
|
import { repeat } from 'lit/directives/repeat.js';
|
|
11
12
|
import { mixinOnReportValidity, onReportValidity, } from '@material/web/labs/behaviors/on-report-validity.js';
|
|
12
13
|
import { createValidator, getValidityAnchor, mixinConstraintValidation, } from '@material/web/labs/behaviors/constraint-validation.js';
|
|
@@ -27,6 +28,9 @@ export class IxFilterSelect extends filterSelectBaseClass {
|
|
|
27
28
|
this.error = false;
|
|
28
29
|
this.tabIndex = 0;
|
|
29
30
|
this.required = false;
|
|
31
|
+
this.isViewMoreButtonVisible = false;
|
|
32
|
+
this.isViewMoreButtonLoading = false;
|
|
33
|
+
this.viewMoreButtonLabel = 'View More';
|
|
30
34
|
this.filteredOptions = [];
|
|
31
35
|
this.selectedItem = undefined;
|
|
32
36
|
this.filterValue = '';
|
|
@@ -227,6 +231,21 @@ export class IxFilterSelect extends filterSelectBaseClass {
|
|
|
227
231
|
// leading icon slot such as an iconbutton due to how delegatesFocus works.
|
|
228
232
|
this.getInput().focus();
|
|
229
233
|
}
|
|
234
|
+
renderViewMoreButton() {
|
|
235
|
+
if (!this.isViewMoreButtonVisible)
|
|
236
|
+
return nothing;
|
|
237
|
+
return html ` <div class="filter-select-footer-section">
|
|
238
|
+
<ix-button
|
|
239
|
+
type="button"
|
|
240
|
+
appearance="text"
|
|
241
|
+
?disabled=${this.isViewMoreButtonLoading}
|
|
242
|
+
.submitting=${this.isViewMoreButtonLoading}
|
|
243
|
+
@click=${() => this.onViewMoreButtonClick()}
|
|
244
|
+
>
|
|
245
|
+
<span class="button-label">${this.viewMoreButtonLabel}</span>
|
|
246
|
+
</ix-button>
|
|
247
|
+
</div>`;
|
|
248
|
+
}
|
|
230
249
|
render() {
|
|
231
250
|
var _a;
|
|
232
251
|
const classes = {
|
|
@@ -303,6 +322,7 @@ export class IxFilterSelect extends filterSelectBaseClass {
|
|
|
303
322
|
<div slot="headline">${item.label}</div>
|
|
304
323
|
</ix-menu-item>`)
|
|
305
324
|
: html `<ix-menu-item>${this.noFilteredOptions}</ix-menu-item>`}
|
|
325
|
+
${this.renderViewMoreButton()}
|
|
306
326
|
</ix-menu>
|
|
307
327
|
</div>
|
|
308
328
|
</div>
|
|
@@ -353,6 +373,18 @@ __decorate([
|
|
|
353
373
|
__decorate([
|
|
354
374
|
property({ type: Boolean, reflect: true })
|
|
355
375
|
], IxFilterSelect.prototype, "required", void 0);
|
|
376
|
+
__decorate([
|
|
377
|
+
property({ type: Function })
|
|
378
|
+
], IxFilterSelect.prototype, "onViewMoreButtonClick", void 0);
|
|
379
|
+
__decorate([
|
|
380
|
+
property({ type: Boolean })
|
|
381
|
+
], IxFilterSelect.prototype, "isViewMoreButtonVisible", void 0);
|
|
382
|
+
__decorate([
|
|
383
|
+
property({ type: Boolean })
|
|
384
|
+
], IxFilterSelect.prototype, "isViewMoreButtonLoading", void 0);
|
|
385
|
+
__decorate([
|
|
386
|
+
property({ type: String })
|
|
387
|
+
], IxFilterSelect.prototype, "viewMoreButtonLabel", void 0);
|
|
356
388
|
__decorate([
|
|
357
389
|
state()
|
|
358
390
|
], IxFilterSelect.prototype, "filteredOptions", void 0);
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"IxFilterSelect.js","sourceRoot":"","sources":["../src/IxFilterSelect.ts"],"names":[],"mappings":"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","sourcesContent":["import { html, LitElement, nothing, PropertyValues } from 'lit';\nimport { property, query, state } from 'lit/decorators.js';\nimport { classMap } from 'lit/directives/class-map.js';\nimport { requestUpdateOnAriaChange } from '@material/web/internal/aria/delegate.js';\nimport '@digital-realty/ix-field/ix-field.js';\nimport '@digital-realty/ix-menu/ix-menu.js';\nimport '@digital-realty/ix-menu/ix-menu-item.js';\nimport '@digital-realty/ix-icon-button/ix-icon-button.js';\nimport { IxMenu } from '@digital-realty/ix-menu';\nimport { IxField } from '@digital-realty/ix-field';\nimport { repeat } from 'lit/directives/repeat.js';\nimport {\n mixinOnReportValidity,\n onReportValidity,\n} from '@material/web/labs/behaviors/on-report-validity.js';\nimport {\n createValidator,\n getValidityAnchor,\n mixinConstraintValidation,\n} from '@material/web/labs/behaviors/constraint-validation.js';\nimport {\n getFormValue,\n mixinFormAssociated,\n} from '@material/web/labs/behaviors/form-associated.js';\nimport { mixinElementInternals } from '@material/web/labs/behaviors/element-internals.js';\nimport { TextFieldValidator } from '@material/web/labs/behaviors/validators/text-field-validator.js';\nimport { Validator } from '@material/web/labs/behaviors/validators/validator.js';\nimport { IxFilterSelectStyles } from './ix-filter-select-styles.js';\n\nexport interface IFilterSelectOption {\n value: string;\n label: string;\n}\n\nconst filterSelectBaseClass = mixinOnReportValidity(\n mixinConstraintValidation(\n mixinFormAssociated(mixinElementInternals(LitElement))\n )\n);\n\nexport class IxFilterSelect extends filterSelectBaseClass {\n static get styles() {\n return [IxFilterSelectStyles];\n }\n\n static {\n requestUpdateOnAriaChange(IxFilterSelect);\n }\n\n /** @nocollapse */\n static override shadowRootOptions = {\n ...LitElement.shadowRootOptions,\n delegatesFocus: true,\n };\n\n @query('ix-menu') menu!: IxMenu;\n\n @query('input')\n readonly input!: HTMLInputElement;\n\n @query('.field') private readonly field!: IxField | null;\n\n @property({ type: Array }) options: IFilterSelectOption[] = [];\n\n @property({ type: String }) value: string = '';\n\n @property({ type: String }) label = '';\n\n @property({ type: String, attribute: 'error-text' }) errorText =\n 'Invalid error text';\n\n @property({ type: String, attribute: 'no-options-text' }) noFilteredOptions =\n 'No options';\n\n @property({ attribute: 'supporting-text' }) supportingText = '';\n\n @property({ type: Boolean, reflect: true }) error = false;\n\n @property({ type: Number, reflect: true }) tabIndex = 0;\n\n @property({ type: Boolean, reflect: true }) required = false;\n\n @state() private filteredOptions: IFilterSelectOption[] = [];\n\n @state() public selectedItem: IFilterSelectOption | undefined = undefined;\n\n @state() private filterValue = '';\n\n @state() private menuOpen = false;\n\n /**\n * Returns true when the text field has been interacted with. Native\n * validation errors only display in response to user interactions.\n */\n @state() private dirty = false;\n\n @state() private focused = false;\n\n /**\n * Whether or not a native error has been reported via `reportValidity()`.\n */\n @state() private nativeError = false;\n\n /**\n * The validation message displayed from a native error via\n * `reportValidity()`.\n */\n @state() private nativeErrorText = '';\n\n @state() private menuOpening = false;\n\n private get hasError() {\n return !this.dirty && (this.error || this.nativeError);\n }\n\n private getErrorText() {\n return this.error ? this.errorText : this.nativeErrorText;\n }\n\n private getInput() {\n if (!this.input) {\n // If the input is not yet defined, synchronously render.\n // e.g.\n // const textField = document.createElement('md-outlined-text-field');\n // document.body.appendChild(textField);\n // textField.focus(); // synchronously render\n this.connectedCallback();\n this.scheduleUpdate();\n }\n\n if (this.isUpdatePending) {\n // If there are pending updates, synchronously perform them. This ensures\n // that constraint validation properties (like `required`) are synced\n // before interacting with input APIs that depend on them.\n this.scheduleUpdate();\n }\n\n return this.input!;\n }\n\n firstUpdated() {\n this.filterOptions();\n }\n\n protected override updated(changedProperties: PropertyValues) {\n if (changedProperties.has('disabled')) {\n this.tabIndex = this.disabled ? -1 : 0;\n }\n\n if (changedProperties.has('options')) {\n this.filteredOptions = this.options;\n\n if (!this.selectedItem) {\n const item = this.options.find(({ value }) => value === this.value);\n this.selectItem(item);\n }\n }\n\n this.setMenuPosition();\n }\n\n handleMenuOpening = () => {\n this.menuOpening = true;\n this.menuOpen = true;\n this.setMenuPosition();\n };\n\n menuOpened = () => {\n this.setMenuPosition();\n this.menuOpening = false;\n };\n\n setMenuPosition = () => {\n const innerMenu = this.menu?.shadowRoot?.querySelector(\n '.menu'\n ) as HTMLElement;\n if (innerMenu) {\n innerMenu.style.width = '100%';\n innerMenu.style.height = 'auto';\n innerMenu.style.insetBlockStart = this.supportingText ? '-1rem' : '0';\n }\n };\n\n handleMenuClosed = () => {\n this.menuOpening = false;\n this.menuOpen = false;\n };\n\n handleInput = (e: InputEvent) => {\n const { value } = e.target as HTMLInputElement;\n this.dirty = true;\n this.filterValue = value;\n this.value = value;\n this.filterOptions();\n };\n\n selectItem = (item: IFilterSelectOption | undefined) => {\n if (item) {\n this.selectedItem = item;\n this.value = item.value;\n this.filterValue = item.label;\n this.filteredOptions = this.options;\n if (this.menuOpen || this.menuOpening) {\n this.menu.close();\n }\n this.dispatchEvent(\n new CustomEvent('select-filter-select', {\n detail: { value: item.value, label: item.label },\n bubbles: true,\n composed: true,\n })\n );\n }\n };\n\n toggleOpen = (e: Event) => {\n e.stopPropagation();\n if (!this.menu.open) {\n this.filterOptions();\n this.menu.show();\n this.menuOpening = true;\n this.setMenuPosition();\n } else {\n this.menu.close();\n }\n };\n\n filterOptions() {\n const filterValue =\n this.filterValue.trim().toLowerCase() ||\n this.value.trim().toLocaleLowerCase();\n\n if (!filterValue) {\n this.filteredOptions = this.options;\n }\n\n this.filteredOptions = this.options.filter(item =>\n item.label.toLowerCase().includes(filterValue)\n );\n }\n\n clear() {\n this.value = '';\n this.filterValue = '';\n this.selectedItem = undefined;\n this.focus();\n this.dispatchEvent(\n new CustomEvent('clear-filter-select', {\n bubbles: true,\n composed: true,\n })\n );\n }\n\n /** @private */\n formResetCallback() {\n this.reset();\n }\n\n /**\n * Reset the text field to its default value.\n */\n reset() {\n this.value = '';\n const originalValue = this.getAttribute('value');\n const item = this.options.find(({ value }) => value === originalValue);\n this.selectItem(item);\n this.dirty = false;\n this.nativeError = false;\n this.nativeErrorText = '';\n }\n\n override attributeChangedCallback(\n attribute: string,\n newValue: string | null,\n oldValue: string | null\n ) {\n if (attribute === 'value' && this.dirty) {\n // After user input, changing the value attribute no longer updates the\n // text field's value (until reset). This matches native <input> behavior.\n return;\n }\n\n super.attributeChangedCallback(attribute, newValue, oldValue);\n }\n\n [createValidator](): Validator<unknown> {\n return new TextFieldValidator(() => ({\n state: this as any,\n renderedControl: this.input,\n }));\n }\n\n [getValidityAnchor](): HTMLElement | null {\n return this.input;\n }\n\n [onReportValidity](invalidEvent: Event | null) {\n // Prevent default pop-up behavior.\n invalidEvent?.preventDefault();\n\n this.nativeError = !!invalidEvent;\n this.nativeErrorText = this.validationMessage;\n }\n\n // Writable mixin properties for lit-html binding, needed for lit-analyzer\n declare disabled: boolean;\n\n declare name: string;\n\n override [getFormValue]() {\n return this.value;\n }\n\n override formStateRestoreCallback(formState: string) {\n this.value = formState;\n }\n\n private handleFocusChange() {\n this.focused = this.input?.matches(':focus') ?? false;\n\n if (this.menuOpen || this.menuOpening) return;\n\n if (this.focused) {\n this.menu.show();\n this.menuOpening = true;\n this.setMenuPosition();\n }\n }\n\n override focus() {\n // Required for the case that the user slots a focusable element into the\n // leading icon slot such as an iconbutton due to how delegatesFocus works.\n this.getInput().focus();\n }\n\n render() {\n const classes = {\n disabled: this.disabled,\n error: !this.disabled && this.hasError,\n };\n\n return html`\n <div class=\"filter-select\">\n <ix-field\n class=\"${classMap(classes)}\"\n id=\"anchor\"\n ?focused=${this.focused}\n ?disabled=${this.disabled}\n ?required=${this.required}\n ?error=${this.hasError}\n error-text=${!this.menuOpen && !this.menuOpening\n ? this.getErrorText()\n : nothing}\n label=${this.label}\n @click=${() => (!this.disabled ? this.input.focus() : null)}\n supporting-text=${this.supportingText}\n ?populated=${this.filterValue.length || this.value.length}\n >\n <input\n id=\"filter\"\n aria-invalid=${this.hasError}\n @input=${this.handleInput}\n .value=${this.filterValue}\n class=\"flex-fill input\"\n type=\"text\"\n ?disabled=${this.disabled}\n ?required=${this.required}\n @focus=${this.handleFocusChange}\n @blur=${this.handleFocusChange}\n />\n <slot name=\"end\" slot=\"end\">\n ${this.value.length\n ? html`<ix-icon-button\n @click=${this.clear}\n icon=\"close\"\n aria-label=\"clear\"\n ></ix-icon-button>`\n : nothing}\n <ix-icon-button\n @click=${this.toggleOpen}\n class=\"open-icon\"\n icon=${`arrow_drop_${this.menuOpen ? 'up' : 'down'}`}\n aria-label=\"options\"\n ></ix-icon-button>\n </slot>\n </ix-field>\n <div class=\"menu\">\n <ix-menu\n anchor=\"anchor\"\n @opening=${this.handleMenuOpening}\n @opened=${this.menuOpened}\n @closed=${this.handleMenuClosed}\n default-focus=\"none\"\n skip-restore-focus\n >\n ${this.filteredOptions?.length\n ? repeat(\n this.filteredOptions,\n (item, index) => `${item.value}-${index}`,\n item =>\n html`<ix-menu-item\n @click=${() => {\n this.selectItem(item);\n }}\n @keydown=${(e: KeyboardEvent) => {\n const selectionKeys = ['Space', 'Enter'];\n if (selectionKeys.includes(e.key)) {\n this.selectItem(item);\n }\n }}\n class=${this.value === item.value ? 'selected' : ''}\n >\n <div slot=\"headline\">${item.label}</div>\n </ix-menu-item>`\n )\n : html`<ix-menu-item>${this.noFilteredOptions}</ix-menu-item>`}\n </ix-menu>\n </div>\n </div>\n `;\n }\n}\n"]}
|
|
1
|
+
{"version":3,"file":"IxFilterSelect.js","sourceRoot":"","sources":["../src/IxFilterSelect.ts"],"names":[],"mappings":"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","sourcesContent":["import { html, LitElement, nothing, PropertyValues } from 'lit';\nimport { property, query, state } from 'lit/decorators.js';\nimport { classMap } from 'lit/directives/class-map.js';\nimport { requestUpdateOnAriaChange } from '@material/web/internal/aria/delegate.js';\nimport '@digital-realty/ix-field/ix-field.js';\nimport '@digital-realty/ix-menu/ix-menu.js';\nimport '@digital-realty/ix-menu/ix-menu-item.js';\nimport '@digital-realty/ix-icon-button/ix-icon-button.js';\nimport '@digital-realty/ix-button';\nimport { IxMenu } from '@digital-realty/ix-menu';\nimport { IxField } from '@digital-realty/ix-field';\nimport { repeat } from 'lit/directives/repeat.js';\nimport {\n mixinOnReportValidity,\n onReportValidity,\n} from '@material/web/labs/behaviors/on-report-validity.js';\nimport {\n createValidator,\n getValidityAnchor,\n mixinConstraintValidation,\n} from '@material/web/labs/behaviors/constraint-validation.js';\nimport {\n getFormValue,\n mixinFormAssociated,\n} from '@material/web/labs/behaviors/form-associated.js';\nimport { mixinElementInternals } from '@material/web/labs/behaviors/element-internals.js';\nimport { TextFieldValidator } from '@material/web/labs/behaviors/validators/text-field-validator.js';\nimport { Validator } from '@material/web/labs/behaviors/validators/validator.js';\nimport { IxFilterSelectStyles } from './ix-filter-select-styles.js';\n\nexport interface IFilterSelectOption {\n value: string;\n label: string;\n}\n\nconst filterSelectBaseClass = mixinOnReportValidity(\n mixinConstraintValidation(\n mixinFormAssociated(mixinElementInternals(LitElement))\n )\n);\n\nexport class IxFilterSelect extends filterSelectBaseClass {\n static get styles() {\n return [IxFilterSelectStyles];\n }\n\n static {\n requestUpdateOnAriaChange(IxFilterSelect);\n }\n\n /** @nocollapse */\n static override shadowRootOptions = {\n ...LitElement.shadowRootOptions,\n delegatesFocus: true,\n };\n\n @query('ix-menu') menu!: IxMenu;\n\n @query('input')\n readonly input!: HTMLInputElement;\n\n @query('.field') private readonly field!: IxField | null;\n\n @property({ type: Array }) options: IFilterSelectOption[] = [];\n\n @property({ type: String }) value: string = '';\n\n @property({ type: String }) label = '';\n\n @property({ type: String, attribute: 'error-text' }) errorText =\n 'Invalid error text';\n\n @property({ type: String, attribute: 'no-options-text' }) noFilteredOptions =\n 'No options';\n\n @property({ attribute: 'supporting-text' }) supportingText = '';\n\n @property({ type: Boolean, reflect: true }) error = false;\n\n @property({ type: Number, reflect: true }) tabIndex = 0;\n\n @property({ type: Boolean, reflect: true }) required = false;\n\n @property({ type: Function }) onViewMoreButtonClick: any;\n\n @property({ type: Boolean }) isViewMoreButtonVisible = false;\n\n @property({ type: Boolean }) isViewMoreButtonLoading = false;\n\n @property({ type: String }) viewMoreButtonLabel = 'View More';\n\n @state() private filteredOptions: IFilterSelectOption[] = [];\n\n @state() public selectedItem: IFilterSelectOption | undefined = undefined;\n\n @state() private filterValue = '';\n\n @state() private menuOpen = false;\n\n /**\n * Returns true when the text field has been interacted with. Native\n * validation errors only display in response to user interactions.\n */\n @state() private dirty = false;\n\n @state() private focused = false;\n\n /**\n * Whether or not a native error has been reported via `reportValidity()`.\n */\n @state() private nativeError = false;\n\n /**\n * The validation message displayed from a native error via\n * `reportValidity()`.\n */\n @state() private nativeErrorText = '';\n\n @state() private menuOpening = false;\n\n private get hasError() {\n return !this.dirty && (this.error || this.nativeError);\n }\n\n private getErrorText() {\n return this.error ? this.errorText : this.nativeErrorText;\n }\n\n private getInput() {\n if (!this.input) {\n // If the input is not yet defined, synchronously render.\n // e.g.\n // const textField = document.createElement('md-outlined-text-field');\n // document.body.appendChild(textField);\n // textField.focus(); // synchronously render\n this.connectedCallback();\n this.scheduleUpdate();\n }\n\n if (this.isUpdatePending) {\n // If there are pending updates, synchronously perform them. This ensures\n // that constraint validation properties (like `required`) are synced\n // before interacting with input APIs that depend on them.\n this.scheduleUpdate();\n }\n\n return this.input!;\n }\n\n firstUpdated() {\n this.filterOptions();\n }\n\n protected override updated(changedProperties: PropertyValues) {\n if (changedProperties.has('disabled')) {\n this.tabIndex = this.disabled ? -1 : 0;\n }\n\n if (changedProperties.has('options')) {\n this.filteredOptions = this.options;\n\n if (!this.selectedItem) {\n const item = this.options.find(({ value }) => value === this.value);\n this.selectItem(item);\n }\n }\n\n this.setMenuPosition();\n }\n\n handleMenuOpening = () => {\n this.menuOpening = true;\n this.menuOpen = true;\n this.setMenuPosition();\n };\n\n menuOpened = () => {\n this.setMenuPosition();\n this.menuOpening = false;\n };\n\n setMenuPosition = () => {\n const innerMenu = this.menu?.shadowRoot?.querySelector(\n '.menu'\n ) as HTMLElement;\n if (innerMenu) {\n innerMenu.style.width = '100%';\n innerMenu.style.height = 'auto';\n innerMenu.style.insetBlockStart = this.supportingText ? '-1rem' : '0';\n }\n };\n\n handleMenuClosed = () => {\n this.menuOpening = false;\n this.menuOpen = false;\n };\n\n handleInput = (e: InputEvent) => {\n const { value } = e.target as HTMLInputElement;\n this.dirty = true;\n this.filterValue = value;\n this.value = value;\n this.filterOptions();\n };\n\n selectItem = (item: IFilterSelectOption | undefined) => {\n if (item) {\n this.selectedItem = item;\n this.value = item.value;\n this.filterValue = item.label;\n this.filteredOptions = this.options;\n if (this.menuOpen || this.menuOpening) {\n this.menu.close();\n }\n this.dispatchEvent(\n new CustomEvent('select-filter-select', {\n detail: { value: item.value, label: item.label },\n bubbles: true,\n composed: true,\n })\n );\n }\n };\n\n toggleOpen = (e: Event) => {\n e.stopPropagation();\n if (!this.menu.open) {\n this.filterOptions();\n this.menu.show();\n this.menuOpening = true;\n this.setMenuPosition();\n } else {\n this.menu.close();\n }\n };\n\n filterOptions() {\n const filterValue =\n this.filterValue.trim().toLowerCase() ||\n this.value.trim().toLocaleLowerCase();\n\n if (!filterValue) {\n this.filteredOptions = this.options;\n }\n\n this.filteredOptions = this.options.filter(item =>\n item.label.toLowerCase().includes(filterValue)\n );\n }\n\n clear() {\n this.value = '';\n this.filterValue = '';\n this.selectedItem = undefined;\n this.focus();\n this.dispatchEvent(\n new CustomEvent('clear-filter-select', {\n bubbles: true,\n composed: true,\n })\n );\n }\n\n /** @private */\n formResetCallback() {\n this.reset();\n }\n\n /**\n * Reset the text field to its default value.\n */\n reset() {\n this.value = '';\n const originalValue = this.getAttribute('value');\n const item = this.options.find(({ value }) => value === originalValue);\n this.selectItem(item);\n this.dirty = false;\n this.nativeError = false;\n this.nativeErrorText = '';\n }\n\n override attributeChangedCallback(\n attribute: string,\n newValue: string | null,\n oldValue: string | null\n ) {\n if (attribute === 'value' && this.dirty) {\n // After user input, changing the value attribute no longer updates the\n // text field's value (until reset). This matches native <input> behavior.\n return;\n }\n\n super.attributeChangedCallback(attribute, newValue, oldValue);\n }\n\n [createValidator](): Validator<unknown> {\n return new TextFieldValidator(() => ({\n state: this as any,\n renderedControl: this.input,\n }));\n }\n\n [getValidityAnchor](): HTMLElement | null {\n return this.input;\n }\n\n [onReportValidity](invalidEvent: Event | null) {\n // Prevent default pop-up behavior.\n invalidEvent?.preventDefault();\n\n this.nativeError = !!invalidEvent;\n this.nativeErrorText = this.validationMessage;\n }\n\n // Writable mixin properties for lit-html binding, needed for lit-analyzer\n declare disabled: boolean;\n\n declare name: string;\n\n override [getFormValue]() {\n return this.value;\n }\n\n override formStateRestoreCallback(formState: string) {\n this.value = formState;\n }\n\n private handleFocusChange() {\n this.focused = this.input?.matches(':focus') ?? false;\n\n if (this.menuOpen || this.menuOpening) return;\n\n if (this.focused) {\n this.menu.show();\n this.menuOpening = true;\n this.setMenuPosition();\n }\n }\n\n override focus() {\n // Required for the case that the user slots a focusable element into the\n // leading icon slot such as an iconbutton due to how delegatesFocus works.\n this.getInput().focus();\n }\n\n renderViewMoreButton() {\n if (!this.isViewMoreButtonVisible) return nothing;\n\n return html` <div class=\"filter-select-footer-section\">\n <ix-button\n type=\"button\"\n appearance=\"text\"\n ?disabled=${this.isViewMoreButtonLoading}\n .submitting=${this.isViewMoreButtonLoading}\n @click=${() => this.onViewMoreButtonClick()}\n >\n <span class=\"button-label\">${this.viewMoreButtonLabel}</span>\n </ix-button>\n </div>`;\n }\n\n render() {\n const classes = {\n disabled: this.disabled,\n error: !this.disabled && this.hasError,\n };\n\n return html`\n <div class=\"filter-select\">\n <ix-field\n class=\"${classMap(classes)}\"\n id=\"anchor\"\n ?focused=${this.focused}\n ?disabled=${this.disabled}\n ?required=${this.required}\n ?error=${this.hasError}\n error-text=${!this.menuOpen && !this.menuOpening\n ? this.getErrorText()\n : nothing}\n label=${this.label}\n @click=${() => (!this.disabled ? this.input.focus() : null)}\n supporting-text=${this.supportingText}\n ?populated=${this.filterValue.length || this.value.length}\n >\n <input\n id=\"filter\"\n aria-invalid=${this.hasError}\n @input=${this.handleInput}\n .value=${this.filterValue}\n class=\"flex-fill input\"\n type=\"text\"\n ?disabled=${this.disabled}\n ?required=${this.required}\n @focus=${this.handleFocusChange}\n @blur=${this.handleFocusChange}\n />\n <slot name=\"end\" slot=\"end\">\n ${this.value.length\n ? html`<ix-icon-button\n @click=${this.clear}\n icon=\"close\"\n aria-label=\"clear\"\n ></ix-icon-button>`\n : nothing}\n <ix-icon-button\n @click=${this.toggleOpen}\n class=\"open-icon\"\n icon=${`arrow_drop_${this.menuOpen ? 'up' : 'down'}`}\n aria-label=\"options\"\n ></ix-icon-button>\n </slot>\n </ix-field>\n <div class=\"menu\">\n <ix-menu\n anchor=\"anchor\"\n @opening=${this.handleMenuOpening}\n @opened=${this.menuOpened}\n @closed=${this.handleMenuClosed}\n default-focus=\"none\"\n skip-restore-focus\n >\n ${this.filteredOptions?.length\n ? repeat(\n this.filteredOptions,\n (item, index) => `${item.value}-${index}`,\n item =>\n html`<ix-menu-item\n @click=${() => {\n this.selectItem(item);\n }}\n @keydown=${(e: KeyboardEvent) => {\n const selectionKeys = ['Space', 'Enter'];\n if (selectionKeys.includes(e.key)) {\n this.selectItem(item);\n }\n }}\n class=${this.value === item.value ? 'selected' : ''}\n >\n <div slot=\"headline\">${item.label}</div>\n </ix-menu-item>`\n )\n : html`<ix-menu-item>${this.noFilteredOptions}</ix-menu-item>`}\n ${this.renderViewMoreButton()}\n </ix-menu>\n </div>\n </div>\n `;\n }\n}\n"]}
|
|
@@ -32,7 +32,7 @@ export const IxFilterSelectStyles = css `
|
|
|
32
32
|
min-height: var(--_content-line-height);
|
|
33
33
|
}
|
|
34
34
|
ix-menu {
|
|
35
|
-
--md-menu-container-color: #fff;
|
|
35
|
+
--md-menu-container-color: var(--md-sys-color-surface-variant, #fff);
|
|
36
36
|
max-height: 500px;
|
|
37
37
|
}
|
|
38
38
|
ix-menu-item {
|
|
@@ -73,5 +73,11 @@ export const IxFilterSelectStyles = css `
|
|
|
73
73
|
.filter-select {
|
|
74
74
|
position: relative;
|
|
75
75
|
}
|
|
76
|
+
|
|
77
|
+
.filter-select-footer-section {
|
|
78
|
+
display: flex;
|
|
79
|
+
justify-content: space-between;
|
|
80
|
+
padding: 0.5rem 1rem;
|
|
81
|
+
}
|
|
76
82
|
`;
|
|
77
83
|
//# sourceMappingURL=ix-filter-select-styles.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ix-filter-select-styles.js","sourceRoot":"","sources":["../src/ix-filter-select-styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B,MAAM,CAAC,MAAM,oBAAoB,GAAG,GAAG,CAAA
|
|
1
|
+
{"version":3,"file":"ix-filter-select-styles.js","sourceRoot":"","sources":["../src/ix-filter-select-styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B,MAAM,CAAC,MAAM,oBAAoB,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAgFtC,CAAC","sourcesContent":["import { css } from 'lit';\n\nexport const IxFilterSelectStyles = css`\n :host {\n display: block;\n }\n :host([disabled]) {\n pointer-events: none;\n }\n ix-field {\n display: block;\n }\n ix-field label {\n display: none;\n }\n .flex-fill {\n flex: 1;\n }\n .menu {\n position: relative;\n }\n .menu label,\n .menu input {\n cursor: pointer;\n }\n input {\n border: none;\n background: transparent;\n outline: none;\n min-width: 3rem;\n }\n ix-chip-set {\n min-height: var(--_content-line-height);\n }\n ix-menu {\n --md-menu-container-color: var(--md-sys-color-surface-variant, #fff);\n max-height: 500px;\n }\n ix-menu-item {\n position: relative;\n }\n ix-menu-item label {\n display: flex;\n align-items: center;\n position: absolute;\n top: 0;\n left: 0;\n right: 0;\n bottom: 0;\n }\n ix-menu-item label input[type='checkbox'] {\n margin: 0 1rem 2px;\n }\n ix-menu-item.selected {\n background: var(\n --md-menu-item-selected-container-color,\n --md-sys-color-tertiary-container\n );\n }\n ix-icon-button {\n --md-icon-button-icon-color: var(--md-sys-text-color-secondary);\n --md-icon-button-hover-icon-color: var(--md-sys-text-color-secondary);\n --md-icon-button-hover-state-layer-color: var(\n --md-sys-text-color-secondary\n );\n --md-icon-button-pressed-icon-color: var(--md-sys-text-color-secondary);\n --md-icon-button-pressed-state-layer-color: var(\n --md-sys-text-color-secondary\n );\n }\n .open-icon {\n margin-right: 0.5rem;\n }\n .filter-select {\n position: relative;\n }\n\n .filter-select-footer-section {\n display: flex;\n justify-content: space-between;\n padding: 0.5rem 1rem;\n }\n`;\n"]}
|
|
@@ -1,5 +1,5 @@
|
|
|
1
|
-
import{__decorate}from"tslib";import{css,LitElement,html
|
|
1
|
+
import{__decorate}from"tslib";import{css,LitElement,nothing,html}from"lit";import{query,property,state}from"lit/decorators.js";import{classMap}from"lit/directives/class-map.js";import{requestUpdateOnAriaChange}from"@material/web/internal/aria/delegate.js";import"@digital-realty/ix-field/ix-field.js";import"@digital-realty/ix-menu/ix-menu.js";import"@digital-realty/ix-menu/ix-menu-item.js";import"@digital-realty/ix-icon-button/ix-icon-button.js";import"@digital-realty/ix-button";import{repeat}from"lit/directives/repeat.js";import{mixinOnReportValidity,onReportValidity}from"@material/web/labs/behaviors/on-report-validity.js";import{mixinConstraintValidation,createValidator,getValidityAnchor}from"@material/web/labs/behaviors/constraint-validation.js";import{mixinFormAssociated,getFormValue}from"@material/web/labs/behaviors/form-associated.js";import{mixinElementInternals}from"@material/web/labs/behaviors/element-internals.js";import{TextFieldValidator}from"@material/web/labs/behaviors/validators/text-field-validator.js";let IxFilterSelectStyles=css`:host{display:block}:host([disabled]){pointer-events:none}ix-field{display:block}ix-field label{display:none}.flex-fill{flex:1}.menu{position:relative}.menu input,.menu label{cursor:pointer}input{border:none;background:0 0;outline:0;min-width:3rem}ix-chip-set{min-height:var(--_content-line-height)}ix-menu{--md-menu-container-color:var(--md-sys-color-surface-variant, #fff);max-height:500px}ix-menu-item{position:relative}ix-menu-item label{display:flex;align-items:center;position:absolute;top:0;left:0;right:0;bottom:0}ix-menu-item label input[type=checkbox]{margin:0 1rem 2px}ix-menu-item.selected{background:var(--md-menu-item-selected-container-color,--md-sys-color-tertiary-container)}ix-icon-button{--md-icon-button-icon-color:var(--md-sys-text-color-secondary);--md-icon-button-hover-icon-color:var(--md-sys-text-color-secondary);--md-icon-button-hover-state-layer-color:var(
|
|
2
2
|
--md-sys-text-color-secondary
|
|
3
3
|
);--md-icon-button-pressed-icon-color:var(--md-sys-text-color-secondary);--md-icon-button-pressed-state-layer-color:var(
|
|
4
4
|
--md-sys-text-color-secondary
|
|
5
|
-
)}.open-icon{margin-right:.5rem}.filter-select{position:relative}`,filterSelectBaseClass=mixinOnReportValidity(mixinConstraintValidation(mixinFormAssociated(mixinElementInternals(LitElement))));class IxFilterSelect extends filterSelectBaseClass{constructor(){super(...arguments),this.options=[],this.value="",this.label="",this.errorText="Invalid error text",this.noFilteredOptions="No options",this.supportingText="",this.error=!1,this.tabIndex=0,this.required=!1,this.filteredOptions=[],this.selectedItem=void 0,this.filterValue="",this.menuOpen=!1,this.dirty=!1,this.focused=!1,this.nativeError=!1,this.nativeErrorText="",this.menuOpening=!1,this.handleMenuOpening=()=>{this.menuOpening=!0,this.menuOpen=!0,this.setMenuPosition()},this.menuOpened=()=>{this.setMenuPosition(),this.menuOpening=!1},this.setMenuPosition=()=>{var e=null==(e=null==(e=this.menu)?void 0:e.shadowRoot)?void 0:e.querySelector(".menu");e&&(e.style.width="100%",e.style.height="auto",e.style.insetBlockStart=this.supportingText?"-1rem":"0")},this.handleMenuClosed=()=>{this.menuOpening=!1,this.menuOpen=!1},this.handleInput=e=>{e=e.target.value;this.dirty=!0,this.filterValue=e,this.value=e,this.filterOptions()},this.selectItem=e=>{e&&(this.selectedItem=e,this.value=e.value,this.filterValue=e.label,this.filteredOptions=this.options,(this.menuOpen||this.menuOpening)&&this.menu.close(),this.dispatchEvent(new CustomEvent("select-filter-select",{detail:{value:e.value,label:e.label},bubbles:!0,composed:!0})))},this.toggleOpen=e=>{e.stopPropagation(),this.menu.open?this.menu.close():(this.filterOptions(),this.menu.show(),this.menuOpening=!0,this.setMenuPosition())}}static get styles(){return[IxFilterSelectStyles]}get hasError(){return!this.dirty&&(this.error||this.nativeError)}getErrorText(){return this.error?this.errorText:this.nativeErrorText}getInput(){return this.input||(this.connectedCallback(),this.scheduleUpdate()),this.isUpdatePending&&this.scheduleUpdate(),this.input}firstUpdated(){this.filterOptions()}updated(e){e.has("disabled")&&(this.tabIndex=this.disabled?-1:0),e.has("options")&&(this.filteredOptions=this.options,this.selectedItem||(e=this.options.find(({value:e})=>e===this.value),this.selectItem(e))),this.setMenuPosition()}filterOptions(){let t=this.filterValue.trim().toLowerCase()||this.value.trim().toLocaleLowerCase();t||(this.filteredOptions=this.options),this.filteredOptions=this.options.filter(e=>e.label.toLowerCase().includes(t))}clear(){this.value="",this.filterValue="",this.selectedItem=void 0,this.focus(),this.dispatchEvent(new CustomEvent("clear-filter-select",{bubbles:!0,composed:!0}))}formResetCallback(){this.reset()}reset(){this.value="";let t=this.getAttribute("value");var e=this.options.find(({value:e})=>e===t);this.selectItem(e),this.dirty=!1,this.nativeError=!1,this.nativeErrorText=""}attributeChangedCallback(e,t,i){"value"===e&&this.dirty||super.attributeChangedCallback(e,t,i)}[createValidator](){return new TextFieldValidator(()=>({state:this,renderedControl:this.input}))}[getValidityAnchor](){return this.input}[onReportValidity](e){null!=e&&e.preventDefault(),this.nativeError=!!e,this.nativeErrorText=this.validationMessage}[getFormValue](){return this.value}formStateRestoreCallback(e){this.value=e}handleFocusChange(){var e;this.focused=null!=(e=null==(e=this.input)?void 0:e.matches(":focus"))&&e,this.menuOpen||this.menuOpening||this.focused&&(this.menu.show(),this.menuOpening=!0,this.setMenuPosition())}focus(){this.getInput().focus()}render(){var e={disabled:this.disabled,error:!this.disabled&&this.hasError};return html`<div class="filter-select"><ix-field class="${classMap(e)}" id="anchor" ?focused="${this.focused}" ?disabled="${this.disabled}" ?required="${this.required}" ?error="${this.hasError}" error-text="${this.menuOpen||this.menuOpening?nothing:this.getErrorText()}" label="${this.label}" @click="${()=>this.disabled?null:this.input.focus()}" supporting-text="${this.supportingText}" ?populated="${this.filterValue.length||this.value.length}"><input id="filter" aria-invalid="${this.hasError}" @input="${this.handleInput}" .value="${this.filterValue}" class="flex-fill input" type="text" ?disabled="${this.disabled}" ?required="${this.required}" @focus="${this.handleFocusChange}" @blur="${this.handleFocusChange}"><slot name="end" slot="end">${this.value.length?html`<ix-icon-button @click="${this.clear}" icon="close" aria-label="clear"></ix-icon-button>`:nothing}<ix-icon-button @click="${this.toggleOpen}" class="open-icon" icon="${"arrow_drop_"+(this.menuOpen?"up":"down")}" aria-label="options"></ix-icon-button></slot></ix-field><div class="menu"><ix-menu anchor="anchor" @opening="${this.handleMenuOpening}" @opened="${this.menuOpened}" @closed="${this.handleMenuClosed}" default-focus="none" skip-restore-focus>${null!=(e=this.filteredOptions)&&e.length?repeat(this.filteredOptions,(e,t)=>e.value+"-"+t,t=>html`<ix-menu-item @click="${()=>{this.selectItem(t)}}" @keydown="${e=>{["Space","Enter"].includes(e.key)&&this.selectItem(t)}}" class="${this.value===t.value?"selected":""}"><div slot="headline">${t.label}</div></ix-menu-item>`):html`<ix-menu-item>${this.noFilteredOptions}</ix-menu-item>`}</ix-menu></div></div>`}}requestUpdateOnAriaChange(IxFilterSelect),IxFilterSelect.shadowRootOptions={...LitElement.shadowRootOptions,delegatesFocus:!0},__decorate([query("ix-menu")],IxFilterSelect.prototype,"menu",void 0),__decorate([query("input")],IxFilterSelect.prototype,"input",void 0),__decorate([query(".field")],IxFilterSelect.prototype,"field",void 0),__decorate([property({type:Array})],IxFilterSelect.prototype,"options",void 0),__decorate([property({type:String})],IxFilterSelect.prototype,"value",void 0),__decorate([property({type:String})],IxFilterSelect.prototype,"label",void 0),__decorate([property({type:String,attribute:"error-text"})],IxFilterSelect.prototype,"errorText",void 0),__decorate([property({type:String,attribute:"no-options-text"})],IxFilterSelect.prototype,"noFilteredOptions",void 0),__decorate([property({attribute:"supporting-text"})],IxFilterSelect.prototype,"supportingText",void 0),__decorate([property({type:Boolean,reflect:!0})],IxFilterSelect.prototype,"error",void 0),__decorate([property({type:Number,reflect:!0})],IxFilterSelect.prototype,"tabIndex",void 0),__decorate([property({type:Boolean,reflect:!0})],IxFilterSelect.prototype,"required",void 0),__decorate([state()],IxFilterSelect.prototype,"filteredOptions",void 0),__decorate([state()],IxFilterSelect.prototype,"selectedItem",void 0),__decorate([state()],IxFilterSelect.prototype,"filterValue",void 0),__decorate([state()],IxFilterSelect.prototype,"menuOpen",void 0),__decorate([state()],IxFilterSelect.prototype,"dirty",void 0),__decorate([state()],IxFilterSelect.prototype,"focused",void 0),__decorate([state()],IxFilterSelect.prototype,"nativeError",void 0),__decorate([state()],IxFilterSelect.prototype,"nativeErrorText",void 0),__decorate([state()],IxFilterSelect.prototype,"menuOpening",void 0),window.customElements.define("ix-filter-select",IxFilterSelect);
|
|
5
|
+
)}.open-icon{margin-right:.5rem}.filter-select{position:relative}.filter-select-footer-section{display:flex;justify-content:space-between;padding:.5rem 1rem}`,filterSelectBaseClass=mixinOnReportValidity(mixinConstraintValidation(mixinFormAssociated(mixinElementInternals(LitElement))));class IxFilterSelect extends filterSelectBaseClass{constructor(){super(...arguments),this.options=[],this.value="",this.label="",this.errorText="Invalid error text",this.noFilteredOptions="No options",this.supportingText="",this.error=!1,this.tabIndex=0,this.required=!1,this.isViewMoreButtonVisible=!1,this.isViewMoreButtonLoading=!1,this.viewMoreButtonLabel="View More",this.filteredOptions=[],this.selectedItem=void 0,this.filterValue="",this.menuOpen=!1,this.dirty=!1,this.focused=!1,this.nativeError=!1,this.nativeErrorText="",this.menuOpening=!1,this.handleMenuOpening=()=>{this.menuOpening=!0,this.menuOpen=!0,this.setMenuPosition()},this.menuOpened=()=>{this.setMenuPosition(),this.menuOpening=!1},this.setMenuPosition=()=>{var e=null==(e=null==(e=this.menu)?void 0:e.shadowRoot)?void 0:e.querySelector(".menu");e&&(e.style.width="100%",e.style.height="auto",e.style.insetBlockStart=this.supportingText?"-1rem":"0")},this.handleMenuClosed=()=>{this.menuOpening=!1,this.menuOpen=!1},this.handleInput=e=>{e=e.target.value;this.dirty=!0,this.filterValue=e,this.value=e,this.filterOptions()},this.selectItem=e=>{e&&(this.selectedItem=e,this.value=e.value,this.filterValue=e.label,this.filteredOptions=this.options,(this.menuOpen||this.menuOpening)&&this.menu.close(),this.dispatchEvent(new CustomEvent("select-filter-select",{detail:{value:e.value,label:e.label},bubbles:!0,composed:!0})))},this.toggleOpen=e=>{e.stopPropagation(),this.menu.open?this.menu.close():(this.filterOptions(),this.menu.show(),this.menuOpening=!0,this.setMenuPosition())}}static get styles(){return[IxFilterSelectStyles]}get hasError(){return!this.dirty&&(this.error||this.nativeError)}getErrorText(){return this.error?this.errorText:this.nativeErrorText}getInput(){return this.input||(this.connectedCallback(),this.scheduleUpdate()),this.isUpdatePending&&this.scheduleUpdate(),this.input}firstUpdated(){this.filterOptions()}updated(e){e.has("disabled")&&(this.tabIndex=this.disabled?-1:0),e.has("options")&&(this.filteredOptions=this.options,this.selectedItem||(e=this.options.find(({value:e})=>e===this.value),this.selectItem(e))),this.setMenuPosition()}filterOptions(){let t=this.filterValue.trim().toLowerCase()||this.value.trim().toLocaleLowerCase();t||(this.filteredOptions=this.options),this.filteredOptions=this.options.filter(e=>e.label.toLowerCase().includes(t))}clear(){this.value="",this.filterValue="",this.selectedItem=void 0,this.focus(),this.dispatchEvent(new CustomEvent("clear-filter-select",{bubbles:!0,composed:!0}))}formResetCallback(){this.reset()}reset(){this.value="";let t=this.getAttribute("value");var e=this.options.find(({value:e})=>e===t);this.selectItem(e),this.dirty=!1,this.nativeError=!1,this.nativeErrorText=""}attributeChangedCallback(e,t,i){"value"===e&&this.dirty||super.attributeChangedCallback(e,t,i)}[createValidator](){return new TextFieldValidator(()=>({state:this,renderedControl:this.input}))}[getValidityAnchor](){return this.input}[onReportValidity](e){null!=e&&e.preventDefault(),this.nativeError=!!e,this.nativeErrorText=this.validationMessage}[getFormValue](){return this.value}formStateRestoreCallback(e){this.value=e}handleFocusChange(){var e;this.focused=null!=(e=null==(e=this.input)?void 0:e.matches(":focus"))&&e,this.menuOpen||this.menuOpening||this.focused&&(this.menu.show(),this.menuOpening=!0,this.setMenuPosition())}focus(){this.getInput().focus()}renderViewMoreButton(){return this.isViewMoreButtonVisible?html`<div class="filter-select-footer-section"><ix-button type="button" appearance="text" ?disabled="${this.isViewMoreButtonLoading}" .submitting="${this.isViewMoreButtonLoading}" @click="${()=>this.onViewMoreButtonClick()}"><span class="button-label">${this.viewMoreButtonLabel}</span></ix-button></div>`:nothing}render(){var e={disabled:this.disabled,error:!this.disabled&&this.hasError};return html`<div class="filter-select"><ix-field class="${classMap(e)}" id="anchor" ?focused="${this.focused}" ?disabled="${this.disabled}" ?required="${this.required}" ?error="${this.hasError}" error-text="${this.menuOpen||this.menuOpening?nothing:this.getErrorText()}" label="${this.label}" @click="${()=>this.disabled?null:this.input.focus()}" supporting-text="${this.supportingText}" ?populated="${this.filterValue.length||this.value.length}"><input id="filter" aria-invalid="${this.hasError}" @input="${this.handleInput}" .value="${this.filterValue}" class="flex-fill input" type="text" ?disabled="${this.disabled}" ?required="${this.required}" @focus="${this.handleFocusChange}" @blur="${this.handleFocusChange}"><slot name="end" slot="end">${this.value.length?html`<ix-icon-button @click="${this.clear}" icon="close" aria-label="clear"></ix-icon-button>`:nothing}<ix-icon-button @click="${this.toggleOpen}" class="open-icon" icon="${"arrow_drop_"+(this.menuOpen?"up":"down")}" aria-label="options"></ix-icon-button></slot></ix-field><div class="menu"><ix-menu anchor="anchor" @opening="${this.handleMenuOpening}" @opened="${this.menuOpened}" @closed="${this.handleMenuClosed}" default-focus="none" skip-restore-focus>${null!=(e=this.filteredOptions)&&e.length?repeat(this.filteredOptions,(e,t)=>e.value+"-"+t,t=>html`<ix-menu-item @click="${()=>{this.selectItem(t)}}" @keydown="${e=>{["Space","Enter"].includes(e.key)&&this.selectItem(t)}}" class="${this.value===t.value?"selected":""}"><div slot="headline">${t.label}</div></ix-menu-item>`):html`<ix-menu-item>${this.noFilteredOptions}</ix-menu-item>`} ${this.renderViewMoreButton()}</ix-menu></div></div>`}}requestUpdateOnAriaChange(IxFilterSelect),IxFilterSelect.shadowRootOptions={...LitElement.shadowRootOptions,delegatesFocus:!0},__decorate([query("ix-menu")],IxFilterSelect.prototype,"menu",void 0),__decorate([query("input")],IxFilterSelect.prototype,"input",void 0),__decorate([query(".field")],IxFilterSelect.prototype,"field",void 0),__decorate([property({type:Array})],IxFilterSelect.prototype,"options",void 0),__decorate([property({type:String})],IxFilterSelect.prototype,"value",void 0),__decorate([property({type:String})],IxFilterSelect.prototype,"label",void 0),__decorate([property({type:String,attribute:"error-text"})],IxFilterSelect.prototype,"errorText",void 0),__decorate([property({type:String,attribute:"no-options-text"})],IxFilterSelect.prototype,"noFilteredOptions",void 0),__decorate([property({attribute:"supporting-text"})],IxFilterSelect.prototype,"supportingText",void 0),__decorate([property({type:Boolean,reflect:!0})],IxFilterSelect.prototype,"error",void 0),__decorate([property({type:Number,reflect:!0})],IxFilterSelect.prototype,"tabIndex",void 0),__decorate([property({type:Boolean,reflect:!0})],IxFilterSelect.prototype,"required",void 0),__decorate([property({type:Function})],IxFilterSelect.prototype,"onViewMoreButtonClick",void 0),__decorate([property({type:Boolean})],IxFilterSelect.prototype,"isViewMoreButtonVisible",void 0),__decorate([property({type:Boolean})],IxFilterSelect.prototype,"isViewMoreButtonLoading",void 0),__decorate([property({type:String})],IxFilterSelect.prototype,"viewMoreButtonLabel",void 0),__decorate([state()],IxFilterSelect.prototype,"filteredOptions",void 0),__decorate([state()],IxFilterSelect.prototype,"selectedItem",void 0),__decorate([state()],IxFilterSelect.prototype,"filterValue",void 0),__decorate([state()],IxFilterSelect.prototype,"menuOpen",void 0),__decorate([state()],IxFilterSelect.prototype,"dirty",void 0),__decorate([state()],IxFilterSelect.prototype,"focused",void 0),__decorate([state()],IxFilterSelect.prototype,"nativeError",void 0),__decorate([state()],IxFilterSelect.prototype,"nativeErrorText",void 0),__decorate([state()],IxFilterSelect.prototype,"menuOpening",void 0),window.customElements.define("ix-filter-select",IxFilterSelect);
|
package/package.json
CHANGED
|
@@ -3,7 +3,7 @@
|
|
|
3
3
|
"description": "Webcomponent ix-filter-select following open-wc recommendations",
|
|
4
4
|
"license": "MIT",
|
|
5
5
|
"author": "Digital Realty",
|
|
6
|
-
"version": "1.1.
|
|
6
|
+
"version": "1.1.6",
|
|
7
7
|
"type": "module",
|
|
8
8
|
"main": "dist/index.js",
|
|
9
9
|
"module": "dist/index.js",
|
|
@@ -17,7 +17,7 @@
|
|
|
17
17
|
},
|
|
18
18
|
"scripts": {
|
|
19
19
|
"analyze": "cem analyze --litelement",
|
|
20
|
-
"start": "
|
|
20
|
+
"start": "npm run build && concurrently -k -r \"tsc --watch --preserveWatchOutput\" \"wds\"",
|
|
21
21
|
"build": "tsc && npm run analyze -- --exclude dist && rollup -c",
|
|
22
22
|
"prepublish": "tsc && npm run analyze -- --exclude dist",
|
|
23
23
|
"lint": "eslint --ext .ts,.html . --ignore-path .gitignore && prettier \"**/*.ts\" --check --ignore-path .gitignore",
|
|
@@ -26,9 +26,10 @@
|
|
|
26
26
|
"test:watch": "tsc && concurrently -k -r \"tsc --watch --preserveWatchOutput\" \"wtr --watch\""
|
|
27
27
|
},
|
|
28
28
|
"dependencies": {
|
|
29
|
-
"@digital-realty/ix-
|
|
30
|
-
"@digital-realty/ix-
|
|
31
|
-
"@digital-realty/ix-
|
|
29
|
+
"@digital-realty/ix-button": "^3.3.5",
|
|
30
|
+
"@digital-realty/ix-field": "^1.1.5",
|
|
31
|
+
"@digital-realty/ix-icon-button": "^1.1.5",
|
|
32
|
+
"@digital-realty/ix-menu": "^1.1.5",
|
|
32
33
|
"@material/web": "1.2.0",
|
|
33
34
|
"lit": "^2.8.0 || ^3.0.0"
|
|
34
35
|
},
|
|
@@ -47,6 +48,7 @@
|
|
|
47
48
|
"husky": "^4.3.8",
|
|
48
49
|
"lint-staged": "^10.5.4",
|
|
49
50
|
"prettier": "^2.4.1",
|
|
51
|
+
"rollup": "^4.29.1",
|
|
50
52
|
"rollup-plugin-minify-html-literals": "^1.2.6",
|
|
51
53
|
"rollup-plugin-summary": "^2.0.0",
|
|
52
54
|
"rollup-plugin-uglify": "^6.0.4",
|
|
@@ -100,5 +102,5 @@
|
|
|
100
102
|
"README.md",
|
|
101
103
|
"LICENSE"
|
|
102
104
|
],
|
|
103
|
-
"gitHead": "
|
|
105
|
+
"gitHead": "92c0f42cb9c15996c1f970b15bd1a0222bd8f45e"
|
|
104
106
|
}
|