@triptease/tt-combobox 5.6.7 → 5.7.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +11 -0
- package/dist/cjs/package.json +3 -0
- package/dist/esm/src/TtCombobox.js.map +1 -0
- package/dist/esm/src/index.js.map +1 -0
- package/dist/esm/src/styles.js.map +1 -0
- package/dist/esm/src/tt-combobox.js.map +1 -0
- package/dist/esm/src/tt-option/TtOption.js.map +1 -0
- package/dist/esm/src/tt-option/styles.js.map +1 -0
- package/dist/esm/src/tt-option/tt-option.js.map +1 -0
- package/dist/esm/src/types.js.map +1 -0
- package/dist/esm/test/tt-combobox.test.d.ts +1 -0
- package/dist/esm/test/tt-combobox.test.js +490 -0
- package/dist/esm/test/tt-combobox.test.js.map +1 -0
- package/package.json +16 -11
- package/tsconfig.cjs.json +9 -0
- package/tsconfig.json +3 -3
- package/dist/src/TtCombobox.js.map +0 -1
- package/dist/src/index.js.map +0 -1
- package/dist/src/styles.js.map +0 -1
- package/dist/src/tt-combobox.js.map +0 -1
- package/dist/src/tt-option/TtOption.js.map +0 -1
- package/dist/src/tt-option/styles.js.map +0 -1
- package/dist/src/tt-option/tt-option.js.map +0 -1
- package/dist/src/types.js.map +0 -1
- /package/dist/{src → esm/src}/TtCombobox.d.ts +0 -0
- /package/dist/{src → esm/src}/TtCombobox.js +0 -0
- /package/dist/{src → esm/src}/index.d.ts +0 -0
- /package/dist/{src → esm/src}/index.js +0 -0
- /package/dist/{src → esm/src}/styles.d.ts +0 -0
- /package/dist/{src → esm/src}/styles.js +0 -0
- /package/dist/{src → esm/src}/tt-combobox.d.ts +0 -0
- /package/dist/{src → esm/src}/tt-combobox.js +0 -0
- /package/dist/{src → esm/src}/tt-option/TtOption.d.ts +0 -0
- /package/dist/{src → esm/src}/tt-option/TtOption.js +0 -0
- /package/dist/{src → esm/src}/tt-option/styles.d.ts +0 -0
- /package/dist/{src → esm/src}/tt-option/styles.js +0 -0
- /package/dist/{src → esm/src}/tt-option/tt-option.d.ts +0 -0
- /package/dist/{src → esm/src}/tt-option/tt-option.js +0 -0
- /package/dist/{src → esm/src}/types.d.ts +0 -0
- /package/dist/{src → esm/src}/types.js +0 -0
package/CHANGELOG.md
CHANGED
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"TtCombobox.js","sourceRoot":"","sources":["../../../src/TtCombobox.ts"],"names":[],"mappings":"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","sourcesContent":["import { html, LitElement, nothing, PropertyValues } from 'lit';\nimport { property, query, queryAll, queryAssignedElements, state } from 'lit/decorators.js';\nimport { ifDefined } from 'lit/directives/if-defined.js';\nimport { repeat } from 'lit/directives/repeat.js';\nimport { unsafeHTML } from 'lit/directives/unsafe-html.js';\nimport { unsafeSVG } from 'lit/directives/unsafe-svg.js';\nimport { guard } from 'lit/directives/guard.js';\nimport { alert, chevronDown } from '@triptease/icons';\nimport { styles } from './styles.js';\nimport { TtOption } from './tt-option/TtOption.js';\n\nexport class TtCombobox extends LitElement {\n static styles = styles;\n\n static formAssociated = true;\n\n static shadowRootOptions = {\n ...LitElement.shadowRootOptions,\n delegatesFocus: true,\n };\n\n @property({ type: Boolean })\n multiselect = false;\n\n @property({ type: Boolean })\n disabled = false;\n\n @property({ type: Boolean })\n invalid = false;\n\n @property({ type: Boolean, attribute: 'display-select-all' })\n displaySelectAll = false;\n\n @property({ type: Boolean })\n required = false;\n\n @property({ type: String })\n name = '';\n\n @property({ type: String, attribute: 'aria-labelledby' })\n ariaLabelledby = nothing;\n\n @property({ type: Boolean, attribute: 'hide-caret' })\n hideCaret = false;\n\n @property({ type: String })\n placeholder?: string;\n\n @property({ type: String, attribute: 'select-all-placeholder' })\n selectAllPlaceholder?: string;\n\n @property({ type: Boolean, attribute: 'open-upward' })\n openUpward = false;\n\n get form(): HTMLFormElement | null {\n return this.internals.form;\n }\n\n @state()\n protected _activeOption: number = -1;\n\n @state()\n protected _expanded = false;\n\n @state()\n protected _filter: string = '';\n\n @queryAssignedElements({ slot: 'option', selector: 'option' })\n options!: Array<HTMLOptionElement>;\n\n @queryAssignedElements({ slot: 'option', selector: 'tt-option:not([disabled])' })\n activeOptions!: Array<HTMLOptionElement>;\n\n @queryAssignedElements({ slot: 'error' })\n protected errorElements!: Array<HTMLElement>;\n\n @queryAll('tt-option:not([hidden], [disabled])')\n protected _visibleOptions!: Array<TtOption>;\n\n @queryAll('tt-option:not([hidden], .select-all)')\n protected _visibleOptionsNotSelectAll!: Array<TtOption>;\n\n @queryAll('tt-option:not([disabled], .select-all)')\n protected _selectableOptions!: NodeListOf<TtOption>;\n\n @queryAll('tt-option:not([disabled], [hidden], .select-all)')\n protected _selectableVisibleOptions!: NodeListOf<TtOption>;\n\n @query('input[role=\"combobox\"]')\n protected _comboboxInput!: HTMLInputElement;\n\n @query('button:has(svg)')\n protected _chevronButton!: HTMLButtonElement;\n\n public internals: ReturnType<typeof this.attachInternals>;\n\n @property({ type: Array<string>, attribute: 'value' })\n public value: string[] = [];\n\n private get _isAllSelected(): boolean {\n return (\n Boolean(this._visibleOptionsNotSelectAll.length) &&\n Array.from(this._visibleOptionsNotSelectAll).every((option) => this.value.includes(option.value))\n );\n }\n\n protected get _selectedVisibleOptions(): Array<TtOption> {\n return Array.from(this._visibleOptions).filter((option) => this.value.includes(option.value));\n }\n\n protected get _selectedOptions(): Array<TtOption> {\n return Array.from(this._visibleOptionsNotSelectAll).filter((option) => this.value.includes(option.value));\n }\n\n private _slotObserver: MutationObserver = new MutationObserver((mutations) => {\n mutations.forEach((mutation) => {\n if (mutation.type === 'attributes') {\n this.requestUpdate('options');\n }\n });\n });\n\n constructor() {\n super();\n this.internals = this.attachInternals();\n }\n\n private _handleFocusOut(e: FocusEvent) {\n if (!this.shadowRoot!.contains(e.relatedTarget as Node | null)) {\n this._expanded = false;\n }\n this._filter = '';\n }\n\n private _onFocus() {\n this._comboboxInput.focus();\n }\n\n public connectedCallback() {\n super.connectedCallback();\n\n this.addEventListener('focus', this._onFocus);\n }\n\n public disconnectedCallback() {\n super.disconnectedCallback();\n\n this.removeEventListener('focus', this._onFocus);\n }\n\n protected firstUpdated(changedProperties: PropertyValues) {\n this.internals.setFormValue(JSON.stringify(this.value));\n\n this._reportValidity();\n this._listenForOptionChange();\n\n super.firstUpdated(changedProperties);\n }\n\n protected update(changedProperties: PropertyValues) {\n if (changedProperties.has('value')) {\n this._valueChanged();\n\n if (\n changedProperties.get('value') !== undefined &&\n JSON.stringify(changedProperties.get('value')) !== JSON.stringify(this.value)\n ) {\n this._dispatchSelectedOptions();\n this._reportValidity();\n }\n }\n\n if (changedProperties.has('_expanded') && changedProperties.get('_expanded') && !this._expanded) {\n this.internals.states.add('interacted');\n }\n\n if (changedProperties.has('options')) {\n this.updateComplete.then(() => {\n const selectedAssignedOptions = Array.from(this.options).filter((option) => option.selected);\n this.value = Array.from(new Set([...this.value, ...selectedAssignedOptions.map((option) => option.value!)]));\n this._listenForOptionChange();\n });\n }\n super.update(changedProperties);\n }\n\n private _valueChanged = () => {\n this._selectableOptions.forEach((option) => {\n if (this.value.includes(option.value!)) {\n this._checkOption(option);\n } else {\n this._uncheckOption(option);\n }\n });\n\n this.internals.setFormValue(JSON.stringify(this.value));\n };\n\n private _listenForOptionChange = () => {\n this.options.forEach((option) => {\n this._slotObserver.observe(option, { attributes: true, attributeFilter: ['selected', 'disabled', 'hidden'] });\n });\n };\n\n private _reportValidity() {\n if (this.required && !this.value.length) {\n const errorMessage = this.multiselect ? 'Please select at least one option' : 'Please select an option';\n\n this.internals.setValidity(\n {\n valueMissing: true,\n },\n errorMessage,\n this._comboboxInput\n );\n this.internals.states.add('--invalid');\n } else if (!this.internals.validity.valid) {\n this.internals.setValidity({});\n\n if (this.internals.states.has('--invalid')) {\n this.internals.states.delete('--invalid');\n }\n }\n }\n\n private get labels(): Array<HTMLElement> {\n return <Array<HTMLElement>>[...this.internals.labels];\n }\n\n private get labelContent(): string {\n if (this.ariaLabel !== null) {\n return this.ariaLabel;\n }\n\n return this.labels.map((label) => label.innerText).join(', ');\n }\n\n private _onKeyUp(event: KeyboardEvent) {\n switch (event.key) {\n case 'ArrowDown':\n event.preventDefault();\n if (!this._expanded) {\n this._expanded = true;\n this._activeOption = -1;\n } else {\n this._activeOption = Math.min(this._visibleOptions.length - 1, this._activeOption + 1);\n }\n break;\n case 'ArrowUp':\n event.preventDefault();\n if (this._expanded) {\n this._activeOption = Math.max(0, this._activeOption - 1);\n }\n break;\n case 'Escape':\n event.preventDefault();\n if (this._expanded) {\n this._expanded = false;\n } else if (this._filter !== '') {\n this._filter = '';\n }\n break;\n case 'Enter':\n event.preventDefault();\n if (this._expanded) {\n this._visibleOptions[this._activeOption].click();\n }\n break;\n default:\n break;\n }\n }\n\n private _uncheckOption(option: HTMLElement) {\n if (option.dataset.deselectable !== 'true') return;\n\n option.setAttribute('aria-selected', 'false');\n const checkbox = <HTMLInputElement>option.querySelector('input[type=\"checkbox\"]');\n if (checkbox) {\n checkbox.checked = false;\n }\n }\n\n private _checkOption(option: HTMLElement) {\n if (!this.multiselect) {\n this._selectableOptions.forEach((opt) => {\n this._uncheckOption(opt);\n });\n }\n\n option.setAttribute('aria-selected', 'true');\n const checkbox = <HTMLInputElement>option.querySelector('input[type=\"checkbox\"]');\n if (checkbox) {\n checkbox.checked = true;\n }\n }\n\n private _getActiveOptionId(): string | undefined {\n if (this._activeOption === -1 || this._visibleOptions.length === 0) {\n return undefined;\n }\n\n const option = this._visibleOptions[this._activeOption];\n return option.id;\n }\n\n private _onClick() {\n this._expanded = !this._expanded;\n\n if (this._expanded) {\n (<HTMLElement>this.shadowRoot?.querySelector('input[role=\"combobox\"]'))?.focus();\n }\n }\n\n private _onChevronClick() {\n (<HTMLElement>this.shadowRoot?.querySelector('input[role=\"combobox\"]'))?.focus();\n }\n\n private _onClickOption(event: MouseEvent) {\n event.preventDefault();\n event.stopPropagation();\n\n const option = event.currentTarget as TtOption;\n if (option.disabled) return;\n\n const selectedValue = option.value as string;\n\n if (this.multiselect) {\n if (this.value.includes(selectedValue)) {\n this.value = this.value.filter((value) => value !== selectedValue);\n } else {\n this.value = [...this.value, selectedValue];\n }\n } else {\n this.value = [selectedValue];\n this._expanded = false;\n }\n }\n\n private _onInput(event: Event) {\n const input = event.target as HTMLInputElement;\n const filter = input.value;\n if (filter !== '' && !this._expanded) {\n this._expanded = true;\n }\n this._activeOption = -1;\n this._filter = filter;\n }\n\n private _dispatchSelectedOptions() {\n this.dispatchEvent(\n new Event('change', {\n bubbles: true,\n composed: true,\n })\n );\n }\n\n private _selectAll = (event: MouseEvent) => {\n event.preventDefault();\n event.stopPropagation();\n\n // If filtering, and all visible options are selected, deselect only visible options\n // Else if filtering, select all visible options\n\n if (this._filter !== '' && this._isAllSelected) {\n const selectedVisibleValues = this._selectedVisibleOptions.map((option) => option.value);\n this.value = this.value.filter((value) => !selectedVisibleValues.includes(value));\n } else if (this._filter !== '') {\n this.value = Array.from(\n new Set([...this.value, ...Array.from(this._selectableVisibleOptions).map((option) => option.value)])\n );\n } else if (this.value.length === this._selectableOptions.length) {\n this.value = [];\n } else {\n this.value = Array.from(this._selectableOptions).map((option) => option.value);\n }\n };\n\n private get _isValid(): boolean {\n return this.internals.validity.valid && !this.invalid;\n }\n\n private _renderCombobox() {\n const placeHolderValue = guard(\n [this.placeholder, this.disabled, this.value, this.activeOptions.length, this.selectAllPlaceholder, this._filter],\n () => {\n if (this.placeholder) {\n return this.placeholder;\n }\n\n if (this.disabled) {\n return 'Disabled';\n }\n if (!this.value.length) {\n return 'No options selected';\n }\n if (this.value.length === 1) {\n return Array.from(this._selectableVisibleOptions)\n .find((option) => option.value === this.value[0])\n ?.textContent?.trim();\n }\n\n // Count all selected values, excluding only those that correspond to permanently hidden options\n const permanentlyHiddenValues = Array.from(this.options)\n .filter((option) => option.hidden)\n .map((option) => option.value);\n\n const selectedCount = this.value.filter((val) => !permanentlyHiddenValues.includes(val)).length;\n\n // Only show \"All options selected\" when truly all non-hidden options are selected\n const totalSelectableCount = this.options.length - permanentlyHiddenValues.length;\n if (this._filter === '' && selectedCount === totalSelectableCount && totalSelectableCount > 0) {\n return this.selectAllPlaceholder || 'All options selected';\n }\n\n return `${selectedCount} options selected`;\n }\n );\n\n return html` <input\n type=\"text\"\n id=\"${this.id}\"\n name=\"${this.name}\"\n autocomplete=\"off\"\n aria-label=\"${this.labelContent}\"\n aria-labelledby=\"${this.ariaLabelledby}\"\n role=\"combobox\"\n aria-controls=\"${this.id}-list\"\n aria-expanded=\"${this._expanded}\"\n aria-autocomplete=\"list\"\n aria-haspopup=\"listbox\"\n aria-disabled=\"${this.disabled}\"\n aria-invalid=\"${!this._isValid}\"\n aria-errormessage=\"${!this._isValid ? `error-msg-${this.id}` : nothing}\"\n aria-required=\"${this.required}\"\n ?disabled=${this.disabled}\n aria-activedescendant=\"${ifDefined(this._getActiveOptionId())}\"\n @input=\"${this._onInput}\"\n .value=\"${this._filter}\"\n .placeholder=\"${placeHolderValue}\"\n @focusout=\"${this._handleFocusOut}\"\n part=\"input\"\n class=${this.hideCaret ? 'hide-caret' : ''}\n />`;\n }\n\n private _renderSelectAll = () => {\n if (!this.multiselect || !this.displaySelectAll) {\n return nothing;\n }\n const id = `${this.id}-option-select-all`;\n const active = this._getActiveOptionId() === id;\n const selected = this._isAllSelected;\n\n return html`\n <tt-option\n id=\"${id}\"\n class=\"select-all\"\n ?selected=${selected}\n ?active=${active}\n include-checkbox\n @click=\"${this._selectAll}\"\n exportparts=\"option, checkbox\"\n part=\"option\"\n value=\"select-all\"\n >Select all</tt-option\n >\n `;\n };\n\n private _renderOption(option: HTMLOptionElement) {\n const hidden = Boolean(\n (this._filter !== '' &&\n !option.value.toLowerCase().includes(this._filter.toLowerCase()) &&\n !option.innerText.toLowerCase().includes(this._filter.toLowerCase())) ||\n option.hidden\n );\n\n const id = `${this.id}-option-${option.value}`;\n const active = this._getActiveOptionId() === id;\n const selected = this.value.includes(option.value);\n\n return html`\n <tt-option\n id=\"${id}\"\n value=\"${option.value}\"\n ?selected=${selected}\n ?disabled=${option.disabled}\n ?active=${active}\n ?include-checkbox=${this.multiselect}\n ?hidden=${hidden}\n @click=\"${this._onClickOption}\"\n >\n ${unsafeHTML(option.innerHTML)}\n </tt-option>\n `;\n }\n\n private _renderChevron = () => html`\n <button\n type=\"button\"\n aria-label=\"Expand\"\n @click=\"${this._onChevronClick}\"\n aria-expanded=\"${this._expanded}\"\n aria-controls=\"${this.id}-list\"\n tabindex=\"-1\"\n ?disabled=${this.disabled}\n part=\"arrow\"\n >\n ${unsafeSVG(chevronDown)}\n </button>\n `;\n\n private _hasErrorContent(): boolean {\n return this.errorElements?.length > 0;\n }\n\n render() {\n return html`\n <div\n class=\"tt-combobox-container\"\n @focus=\"${this._onFocus}\"\n @keydown=\"${this._onKeyUp}\"\n @click=\"${this._onClick}\"\n aria-disabled=\"${this.disabled}\"\n part=\"container\"\n >\n <slot name=\"icon\" part=\"icon\"></slot>\n ${this._renderCombobox()} ${this._renderChevron()}\n <ul\n id=\"${this.id}-list\"\n role=\"listbox\"\n aria-multiselectable=\"${this.multiselect}\"\n aria-label=\"${this.labelContent}\"\n part=\"listbox\"\n ?data-open-upward=\"${this.openUpward}\"\n >\n ${this._renderSelectAll()} ${repeat(this.options, (opt) => opt.value, this._renderOption.bind(this))}\n\n <li part=\"no-results\" class=\"no-results\">No results</li>\n </ul>\n </div>\n <slot name=\"option\" @slotchange=${() => this.requestUpdate('options')}></slot>\n <div\n class=\"errormessage\"\n id=\"error-msg-${this.id}\"\n role=\"alert\"\n aria-atomic=\"true\"\n ?data-hidden=\"${!this._hasErrorContent()}\"\n part=\"error\"\n >\n ${unsafeSVG(alert)}\n <slot name=\"error\"></slot>\n </div>\n `;\n }\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'tt-combobox': TtCombobox;\n }\n}\n"]}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/index.ts"],"names":[],"mappings":"AAAA,cAAc,YAAY,CAAC;AAC3B,OAAO,EAAE,UAAU,EAAE,MAAM,kBAAkB,CAAC","sourcesContent":["export * from './types.js';\nexport { TtCombobox } from './tt-combobox.js';\n"]}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"styles.js","sourceRoot":"","sources":["../../../src/styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA2NxB,CAAC","sourcesContent":["import { css } from 'lit';\n\nexport const styles = css`\n :host {\n display: flex;\n flex-direction: var(--tt-combobox-flex-direction, row);\n align-items: var(--tt-combobox-align-items, center);\n justify-content: var(--tt-combobox-justify-content, initial);\n align-content: var(--tt-combobox-align-content, initial);\n gap: var(--tt-combobox-gap, 0.5rem);\n font-size: var(--tt-combobox-font-size, var(--font-size-200));\n color: var(--tt-combobox-color, var(--color-text-400));\n }\n\n :host([disabled]) .tt-combobox-container {\n border-color: var(--tt-combobox-disabled-border-color, var(--color-border-200));\n color: var(--tt-combobox-disabled-color, var(--color-text-200));\n background-color: var(--tt-combobox-disabled-background-color, var(--color-surface-200));\n pointer-events: none;\n }\n\n .tt-combobox-container:focus-within {\n outline: 5px auto Highlight;\n outline: 5px auto -webkit-focus-ring-color;\n }\n\n .tt-combobox-container:hover {\n background-color: var(--tt-combobox-hover-background-color, var(--color-surface-300));\n }\n\n :host([invalid]) .tt-combobox-container,\n :host(:state(interacted):invalid) .tt-combobox-container {\n outline: 1px solid var(--color-alert-strong);\n }\n\n .errormessage {\n visibility: hidden;\n display: flex;\n align-items: center;\n gap: var(--space-scale-0-5);\n color: var(--color-alert-strong);\n\n &[data-hidden] {\n display: none;\n }\n }\n\n .errormessage svg path {\n fill: var(--color-alert-strong);\n height: 20px;\n }\n\n .tt-combobox-container:has([role='combobox'][aria-invalid='true']) ~ .errormessage {\n visibility: visible;\n }\n\n :has([role='combobox'][aria-invalid='true']) ::slotted([slot='error']) {\n color: var(--color-alert-strong);\n font-size: var(--font-size-100);\n margin: 0;\n font-weight: var(--font-weight-regular);\n line-height: 1.2;\n }\n\n slot[name='option']::slotted(*) {\n display: none;\n }\n\n * {\n box-sizing: border-box;\n font-family: var(--font-family-sans);\n cursor: inherit;\n }\n\n .tt-combobox-container {\n position: relative;\n max-width: var(--tt-combobox-max-width, 300px);\n min-width: var(--tt-combobox-min-width, 250px);\n display: flex;\n flex-direction: row;\n align-items: center;\n border-radius: var(--border-radius);\n border-color: var(--tt-combobox-border-color, var(--color-border-400));\n border-style: solid;\n border-width: var(--tt-combobox-border-width, 1px);\n background-color: var(--tt-combobox-background-color, var(--color-surface-100));\n padding: 0.5rem;\n gap: 0.25rem;\n //width: 100%;\n }\n\n [role='listbox'] {\n display: none;\n }\n\n [role='combobox'] {\n width: 100%;\n border-style: none;\n background-color: transparent;\n font-size: var(--tt-combobox-font-size, var(--font-size-200));\n }\n\n .hide-caret {\n caret-color: transparent;\n }\n\n [role='combobox']::placeholder {\n color: var(--tt-combobox-placeholder-color, var(--color-text-300));\n font-family: var(--font-family-inter);\n font-size: var(--tt-combobox-font-size, var(--font-size-200));\n }\n\n :host([disabled]) [role='combobox']::placeholder {\n color: var(--tt-combobox-disabled-placeholder-color, var(--color-text-200));\n }\n\n [role='combobox']:placeholder-shown {\n text-overflow: ellipsis;\n overflow: clip;\n }\n\n [role='combobox']:focus {\n outline: none;\n }\n\n [role='combobox'] ~ button {\n appearance: none;\n padding: 0;\n border-width: 0;\n background-color: transparent;\n aspect-ratio: 1;\n }\n\n [role='combobox'] ~ button svg {\n transition: transform 0.2s ease-in-out;\n color: var(--tt-combobox-dropdown-color, var(--color-text-400));\n }\n\n [role='combobox'][aria-expanded='true'] ~ button svg {\n transform: rotate(180deg);\n }\n\n [role='combobox'][aria-expanded='true'] ~ [role='listbox'] {\n display: block;\n width: max-content;\n max-width: var(--tt-combobox-list-max-width, 35ch);\n min-width: 100%;\n background-color: var(--tt-combobox-list-background-color, var(--color-surface-100, white));\n border: 1px solid var(--tt-combobox-border-color, var(--color-border-300));\n border-radius: var(--border-radius);\n box-shadow: var(--box-shadow-lg);\n padding: 0;\n position: absolute;\n top: var(--tt-combobox-top, calc(100% + 0.5rem));\n left: var(--tt-combobox-left, 0);\n right: var(--tt-combobox-right, unset);\n bottom: var(--tt-combobox-bottom, unset);\n z-index: 2;\n margin: 0;\n list-style: none;\n max-height: var(--tt-combobox-max-height, 400px);\n overflow-y: auto;\n\n .no-results {\n display: none;\n }\n\n &:not(:has(tt-option:not([hidden], .select-all))) {\n .no-results {\n display: flex;\n padding: 0.5rem;\n box-sizing: border-box;\n text-align: left;\n text-overflow: ellipsis;\n text-wrap: nowrap;\n align-items: center;\n gap: 0.25rem;\n max-width: 100%;\n width: 100%;\n overflow-y: visible;\n flex: 1;\n\n span {\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n flex: 1;\n line-height: 1.1;\n }\n }\n\n .select-all {\n display: none;\n }\n }\n }\n\n [role='combobox'][aria-expanded='true'] ~ [role='listbox'][data-open-upward] {\n top: unset;\n bottom: calc(100% + 0.5rem);\n }\n\n slot[name='icon'] {\n display: inline-block;\n max-width: var(--tt-combobox-icon-size, 1rem);\n aspect-ratio: 1;\n }\n\n tt-option.select-all::part(option) {\n border-bottom: 1px solid var(--color-border-300);\n }\n\n label {\n font-size: var(--tt-combobox-label-font-size, inherit);\n color: var(--tt-combobox-label-color, inherit);\n font-weight: var(--tt-combobox-label-font-weight, inherit);\n\n &[data-hidden] {\n display: none;\n }\n }\n`;\n"]}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"tt-combobox.js","sourceRoot":"","sources":["../../../src/tt-combobox.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAE,MAAM,iBAAiB,CAAC;AAC7C,OAAO,0BAA0B,CAAC;AAElC,IAAI,OAAO,MAAM,KAAK,WAAW,EAAE,CAAC;IAClC,IAAI,CAAC,MAAM,CAAC,cAAc,CAAC,GAAG,CAAC,aAAa,CAAC,EAAE,CAAC;QAC9C,MAAM,CAAC,cAAc,CAAC,MAAM,CAAC,aAAa,EAAE,UAAU,CAAC,CAAC;IAC1D,CAAC;AACH,CAAC;AAED,OAAO,EAAE,UAAU,EAAE,CAAC","sourcesContent":["import { TtCombobox } from './TtCombobox.js';\nimport './tt-option/tt-option.js';\n\nif (typeof window !== 'undefined') {\n if (!window.customElements.get('tt-combobox')) {\n window.customElements.define('tt-combobox', TtCombobox);\n }\n}\n\nexport { TtCombobox };\n"]}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"TtOption.js","sourceRoot":"","sources":["../../../../src/tt-option/TtOption.ts"],"names":[],"mappings":";;;;;;AAAA,OAAO,EAAE,IAAI,EAAE,UAAU,EAAE,OAAO,EAAE,MAAM,KAAK,CAAC;AAChD,OAAO,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAC;AAC7C,OAAO,EAAE,MAAM,EAAE,MAAM,aAAa,CAAC;AAErC,MAAM,OAAO,QAAS,SAAQ,UAAU;IAAxC;;QASE,aAAQ,GAAG,KAAK,CAAC;QAGjB,aAAQ,GAAG,KAAK,CAAC;QAGjB,WAAM,GAAG,KAAK,CAAC;QAGf,UAAK,GAAG,EAAE,CAAC;QAGX,oBAAe,GAAG,KAAK,CAAC;QAahB,aAAQ,GAAG,CAAC,KAAiB,EAAE,EAAE;YACvC,IAAI,IAAI,CAAC,QAAQ,EAAE,CAAC;gBAClB,KAAK,CAAC,cAAc,EAAE,CAAC;gBACvB,KAAK,CAAC,wBAAwB,EAAE,CAAC;gBACjC,KAAK,CAAC,eAAe,EAAE,CAAC;YAC1B,CAAC;QACH,CAAC,CAAC;IAwBJ,CAAC;IAzCC,iBAAiB;QACf,KAAK,CAAC,iBAAiB,EAAE,CAAC;QAE1B,IAAI,CAAC,gBAAgB,CAAC,OAAO,EAAE,IAAI,CAAC,QAAQ,CAAC,CAAC;IAChD,CAAC;IAED,oBAAoB;QAClB,KAAK,CAAC,oBAAoB,EAAE,CAAC;QAC7B,IAAI,CAAC,mBAAmB,CAAC,OAAO,EAAE,IAAI,CAAC,QAAQ,CAAC,CAAC;IACnD,CAAC;IAUD,MAAM;QACJ,OAAO,IAAI,CAAA;;;yBAGU,IAAI,CAAC,QAAQ;yBACb,IAAI,CAAC,QAAQ;wBACd,IAAI,CAAC,MAAM;uBACZ,IAAI,CAAC,MAAM;sBACZ,IAAI,CAAC,KAAK;kBACd,IAAI,CAAC,QAAQ;sBACT,CAAC,KAAiB,EAAE,EAAE,CAAC,KAAK,CAAC,cAAc,EAAE;;;UAGzD,IAAI,CAAC,eAAe;YACpB,CAAC,CAAC,IAAI,CAAA,mCAAmC,IAAI,CAAC,QAAQ,uDAAuD;YAC7G,CAAC,CAAC,OAAO;;;;;KAKd,CAAC;IACJ,CAAC;;AA9DM,eAAM,GAAG,MAAM,AAAT,CAAU;AAEhB,0BAAiB,GAAG;IACzB,GAAG,UAAU,CAAC,iBAAiB;IAC/B,cAAc,EAAE,IAAI;CACrB,AAHuB,CAGtB;AAGF;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,CAAC;0CACX;AAGjB;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,CAAC;0CACX;AAGjB;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,CAAC;wCACb;AAGf;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;uCAChB;AAGX;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,SAAS,EAAE,kBAAkB,EAAE,CAAC;iDACnC","sourcesContent":["import { html, LitElement, nothing } from 'lit';\nimport { property } from 'lit/decorators.js';\nimport { styles } from './styles.js';\n\nexport class TtOption extends LitElement {\n static styles = styles;\n\n static shadowRootOptions = {\n ...LitElement.shadowRootOptions,\n delegatesFocus: true,\n };\n\n @property({ type: Boolean })\n disabled = false;\n\n @property({ type: Boolean })\n selected = false;\n\n @property({ type: Boolean })\n active = false;\n\n @property({ type: String })\n value = '';\n\n @property({ type: Boolean, attribute: 'include-checkbox' })\n includeCheckbox = false;\n\n connectedCallback() {\n super.connectedCallback();\n\n this.addEventListener('click', this._onClick);\n }\n\n disconnectedCallback() {\n super.disconnectedCallback();\n this.removeEventListener('click', this._onClick);\n }\n\n private _onClick = (event: MouseEvent) => {\n if (this.disabled) {\n event.preventDefault();\n event.stopImmediatePropagation();\n event.stopPropagation();\n }\n };\n\n render() {\n return html`\n <li\n role=\"option\"\n aria-selected=\"${this.selected}\"\n aria-disabled=\"${this.disabled}\"\n ?aria-hidden=\"${this.hidden}\"\n data-active=\"${this.active}\"\n data-value=\"${this.value}\"\n @click=\"${this._onClick}\"\n @mousedown=\"${(event: MouseEvent) => event.preventDefault()}\"\n part=\"option\"\n >\n ${this.includeCheckbox\n ? html`<input type=\"checkbox\" ?checked=${this.selected} role=\"presentation\" tabindex=\"-1\" part=\"checkbox\" />`\n : nothing}\n <span>\n <slot></slot>\n </span>\n </li>\n `;\n }\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'tt-option': TtOption;\n }\n}\n"]}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"styles.js","sourceRoot":"","sources":["../../../../src/tt-option/styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAqExB,CAAC","sourcesContent":["import { css } from 'lit';\n\nexport const styles = css`\n li {\n cursor: pointer;\n display: flex;\n padding: 0.5rem;\n box-sizing: border-box;\n text-align: left;\n text-overflow: ellipsis;\n text-wrap: nowrap;\n align-items: center;\n gap: 0.25rem;\n max-width: 100%;\n width: 100%;\n overflow-y: visible;\n flex: 1;\n\n input[type='checkbox'] {\n width: var(--checkbox-size, var(--space-scale-2));\n aspect-ratio: 1;\n flex: 0 0 auto;\n accent-color: var(--color-primary-400);\n pointer-events: none;\n }\n\n span {\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n flex: 1;\n line-height: 1.1;\n }\n\n &[aria-hidden='true'] {\n visibility: hidden;\n display: none;\n }\n\n &[aria-disabled='true'] {\n pointer-events: none;\n opacity: 0.5;\n }\n\n &[aria-selected='true']:not(:has(input[type='checkbox'])) {\n color: var(--tt-combobox-option-selected-color, var(--color-primary-400));\n font-weight: var(--font-weight-medium);\n }\n }\n\n :host([active]),\n :host(:hover) {\n li {\n background-color: var(--tt-combobox-option-background-color-hover, var(--color-surface-300));\n color: var(--tt-combobox-option-color-hover, inherit);\n }\n\n &:first-child li {\n border-top-left-radius: var(--border-radius);\n border-top-right-radius: var(--border-radius);\n }\n\n &:last-child li {\n border-bottom-left-radius: var(--border-radius);\n border-bottom-right-radius: var(--border-radius);\n }\n }\n\n :host([disabled]) {\n pointer-events: none;\n }\n`;\n"]}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"tt-option.js","sourceRoot":"","sources":["../../../../src/tt-option/tt-option.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,QAAQ,EAAE,MAAM,eAAe,CAAC;AAEzC,IAAI,OAAO,MAAM,KAAK,WAAW,EAAE,CAAC;IAClC,IAAI,CAAC,MAAM,CAAC,cAAc,CAAC,GAAG,CAAC,WAAW,CAAC,EAAE,CAAC;QAC5C,MAAM,CAAC,cAAc,CAAC,MAAM,CAAC,WAAW,EAAE,QAAQ,CAAC,CAAC;IACtD,CAAC;AACH,CAAC;AAED,OAAO,EAAE,QAAQ,EAAE,CAAC","sourcesContent":["import { TtOption } from './TtOption.js';\n\nif (typeof window !== 'undefined') {\n if (!window.customElements.get('tt-option')) {\n window.customElements.define('tt-option', TtOption);\n }\n}\n\nexport { TtOption };\n"]}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"types.js","sourceRoot":"","sources":["../../../src/types.ts"],"names":[],"mappings":"","sourcesContent":["import { TtCombobox } from './TtCombobox.js';\n\ninterface TtComboboxExternalAttributes {\n id?: string;\n placeholder?: string;\n disabled?: boolean;\n multiselect?: boolean;\n 'display-select-all'?: boolean;\n invalid?: boolean;\n 'open-upward'?: boolean;\n name?: string;\n required?: boolean;\n 'aria-labelledby'?: string;\n class?: string;\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'tt-combobox': TtCombobox;\n }\n\n namespace JSX {\n interface IntrinsicElements {\n 'tt-combobox': TtComboboxExternalAttributes & { style?: string };\n }\n }\n\n namespace React {\n namespace JSX {\n interface IntrinsicElements {\n 'tt-combobox': TtComboboxExternalAttributes & {\n ref?: React.Ref<unknown>;\n children?: React.ReactNode;\n style?: React.CSSProperties;\n };\n }\n }\n }\n}\n"]}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
import '../src/tt-combobox.js';
|
|
@@ -0,0 +1,490 @@
|
|
|
1
|
+
import { html } from 'lit';
|
|
2
|
+
import { elementUpdated, expect, fixture, oneEvent } from '@open-wc/testing';
|
|
3
|
+
import '../src/tt-combobox.js';
|
|
4
|
+
describe('TtCombobox', () => {
|
|
5
|
+
const getCombobox = (el) => el.shadowRoot.querySelector('[role="combobox"]');
|
|
6
|
+
const comboboxPlaceholderText = (combobox) => combobox.getAttribute('placeholder');
|
|
7
|
+
const filterCombobox = (combobox, text) => {
|
|
8
|
+
combobox.value = text;
|
|
9
|
+
combobox.dispatchEvent(new InputEvent('input', { bubbles: true, composed: true }));
|
|
10
|
+
};
|
|
11
|
+
it('Should render with the default placeholder text', async () => {
|
|
12
|
+
const el = await fixture(html ` <tt-combobox id="combobox">
|
|
13
|
+
<span slot="label">Test combobox</span>
|
|
14
|
+
<option slot="option" value="1">Option 1</option>
|
|
15
|
+
<option slot="option" value="2">Option 2</option>
|
|
16
|
+
<option slot="option" value="3">Option 3</option>
|
|
17
|
+
</tt-combobox>`);
|
|
18
|
+
const combobox = getCombobox(el);
|
|
19
|
+
await expect(comboboxPlaceholderText(combobox)).to.equal('No options selected');
|
|
20
|
+
});
|
|
21
|
+
it('should render with the options visible when clicking the combobox', async () => {
|
|
22
|
+
const el = await fixture(html ` <tt-combobox id="combobox">
|
|
23
|
+
<span slot="label">Test combobox</span>
|
|
24
|
+
<option slot="option" value="1">Option 1</option>
|
|
25
|
+
<option slot="option" value="2">Option 2</option>
|
|
26
|
+
<option slot="option" value="3">Option 3</option>
|
|
27
|
+
</tt-combobox>`);
|
|
28
|
+
const combobox = getCombobox(el);
|
|
29
|
+
combobox.click();
|
|
30
|
+
const options = el.shadowRoot.querySelectorAll('tt-option');
|
|
31
|
+
await expect(options.length).to.equal(3);
|
|
32
|
+
options.forEach((option) => {
|
|
33
|
+
expect(option.checkVisibility()).to.be.true;
|
|
34
|
+
});
|
|
35
|
+
});
|
|
36
|
+
it('should update the placeholder with the selected option', async () => {
|
|
37
|
+
const el = await fixture(html ` <tt-combobox id="combobox">
|
|
38
|
+
<span slot="label">Test combobox</span>
|
|
39
|
+
<option slot="option" value="1">Option 1</option>
|
|
40
|
+
<option slot="option" value="2">Option 2</option>
|
|
41
|
+
<option slot="option" value="3">Option 3</option>
|
|
42
|
+
</tt-combobox>`);
|
|
43
|
+
const combobox = getCombobox(el);
|
|
44
|
+
combobox.click();
|
|
45
|
+
const option = el.shadowRoot.querySelector('tt-option[value="2"]');
|
|
46
|
+
option.click();
|
|
47
|
+
await elementUpdated(el);
|
|
48
|
+
expect(comboboxPlaceholderText(combobox)).to.equal('Option 2');
|
|
49
|
+
});
|
|
50
|
+
it('should update the placeholder with the selected option when setting it via selectedValues', async () => {
|
|
51
|
+
const el = await fixture(html ` <tt-combobox id="combobox" multiselect>
|
|
52
|
+
<span slot="label">Test combobox</span>
|
|
53
|
+
<option slot="option" value="1">Option 1</option>
|
|
54
|
+
<option slot="option" value="2">Option 2</option>
|
|
55
|
+
<option slot="option" value="3">Option 3</option>
|
|
56
|
+
</tt-combobox>`);
|
|
57
|
+
const combobox = getCombobox(el);
|
|
58
|
+
el.value = ['2'];
|
|
59
|
+
await elementUpdated(el);
|
|
60
|
+
await expect(comboboxPlaceholderText(combobox)).to.equal('Option 2');
|
|
61
|
+
});
|
|
62
|
+
it('should display select all option when multiselect is true and display-select-all is true, and select all options when clicked', async () => {
|
|
63
|
+
const el = await fixture(html ` <tt-combobox id="combobox" multiselect display-select-all>
|
|
64
|
+
<span slot="label">Test combobox</span>
|
|
65
|
+
<option slot="option" value="1">Option 1</option>
|
|
66
|
+
<option slot="option" value="2">Option 2</option>
|
|
67
|
+
<option slot="option" value="3">Option 3</option>
|
|
68
|
+
</tt-combobox>`);
|
|
69
|
+
const combobox = getCombobox(el);
|
|
70
|
+
await combobox.click();
|
|
71
|
+
const selectAll = el.shadowRoot.querySelector('tt-option.select-all');
|
|
72
|
+
expect(selectAll).to.exist;
|
|
73
|
+
selectAll.click();
|
|
74
|
+
await oneEvent(el, 'change');
|
|
75
|
+
const options = el.shadowRoot.querySelectorAll('tt-option');
|
|
76
|
+
options.forEach((option) => {
|
|
77
|
+
expect(option.selected).to.be.true;
|
|
78
|
+
});
|
|
79
|
+
});
|
|
80
|
+
it('should display total selected count after filtering when options were selected before filtering', async () => {
|
|
81
|
+
const el = await fixture(html ` <tt-combobox id="combobox" multiselect>
|
|
82
|
+
<span slot="label">Test combobox</span>
|
|
83
|
+
<option slot="option" value="1">Option 1</option>
|
|
84
|
+
<option slot="option" value="2">Option 2</option>
|
|
85
|
+
<option slot="option" value="3">Option 3</option>
|
|
86
|
+
</tt-combobox>`);
|
|
87
|
+
const combobox = getCombobox(el);
|
|
88
|
+
combobox.click();
|
|
89
|
+
await elementUpdated(el);
|
|
90
|
+
// Select options 1, 2, and 3 (all of them)
|
|
91
|
+
const option1 = el.shadowRoot.querySelector('tt-option[value="1"]');
|
|
92
|
+
option1.click();
|
|
93
|
+
await elementUpdated(el);
|
|
94
|
+
const option2 = el.shadowRoot.querySelector('tt-option[value="2"]');
|
|
95
|
+
option2.click();
|
|
96
|
+
await elementUpdated(el);
|
|
97
|
+
const option3 = el.shadowRoot.querySelector('tt-option[value="3"]');
|
|
98
|
+
option3.click();
|
|
99
|
+
await elementUpdated(el);
|
|
100
|
+
// Should show 3 options selected
|
|
101
|
+
expect(comboboxPlaceholderText(combobox)).to.equal('All options selected');
|
|
102
|
+
// Now filter to show only "Option 1"
|
|
103
|
+
filterCombobox(combobox, 'Option 1');
|
|
104
|
+
await elementUpdated(el);
|
|
105
|
+
// Should still show 3 options selected (not 1)
|
|
106
|
+
expect(comboboxPlaceholderText(combobox)).to.equal('3 options selected');
|
|
107
|
+
});
|
|
108
|
+
it('should show correct count after clearing filter when only filtered options were selected', async () => {
|
|
109
|
+
const el = await fixture(html ` <tt-combobox id="combobox" multiselect>
|
|
110
|
+
<span slot="label">Test combobox</span>
|
|
111
|
+
<option slot="option" value="1">Option 1</option>
|
|
112
|
+
<option slot="option" value="11">Option 11</option>
|
|
113
|
+
<option slot="option" value="2">Option 2</option>
|
|
114
|
+
<option slot="option" value="3">Option 3</option>
|
|
115
|
+
<option slot="option" value="4">Option 4</option>
|
|
116
|
+
<option slot="option" value="5">Option 5</option>
|
|
117
|
+
</tt-combobox>`);
|
|
118
|
+
const combobox = getCombobox(el);
|
|
119
|
+
combobox.click();
|
|
120
|
+
await elementUpdated(el);
|
|
121
|
+
// Filter to show only 2 options (Option 1 and Option 11 match "1")
|
|
122
|
+
filterCombobox(combobox, '1');
|
|
123
|
+
await elementUpdated(el);
|
|
124
|
+
// Select both visible filtered options
|
|
125
|
+
const option1 = el.shadowRoot.querySelector('tt-option[value="1"]');
|
|
126
|
+
option1.click();
|
|
127
|
+
await elementUpdated(el);
|
|
128
|
+
const option11 = el.shadowRoot.querySelector('tt-option[value="11"]');
|
|
129
|
+
option11.click();
|
|
130
|
+
await elementUpdated(el);
|
|
131
|
+
// Verify 2 options selected while filter is active
|
|
132
|
+
expect(comboboxPlaceholderText(combobox)).to.equal('2 options selected');
|
|
133
|
+
// Clear the filter
|
|
134
|
+
filterCombobox(combobox, '');
|
|
135
|
+
await elementUpdated(el);
|
|
136
|
+
// Should show "2 options selected", NOT "All options selected"
|
|
137
|
+
// This is the critical test - when filter is cleared, it should count
|
|
138
|
+
// all selected options (2), not say "all" just because all visible options
|
|
139
|
+
// during filtering were selected
|
|
140
|
+
expect(comboboxPlaceholderText(combobox)).to.equal('2 options selected');
|
|
141
|
+
});
|
|
142
|
+
it('should not allow a disabled option to be selected', async () => {
|
|
143
|
+
const el = await fixture(html ` <tt-combobox id="combobox">
|
|
144
|
+
<span slot="label">Test combobox</span>
|
|
145
|
+
<option slot="option" value="1">Option 1</option>
|
|
146
|
+
<option slot="option" value="2" disabled>Option 2</option>
|
|
147
|
+
<option slot="option" value="3">Option 3</option>
|
|
148
|
+
</tt-combobox>`);
|
|
149
|
+
const combobox = getCombobox(el);
|
|
150
|
+
await combobox.click();
|
|
151
|
+
await elementUpdated(el);
|
|
152
|
+
const option = el.shadowRoot.querySelector('tt-option[value="2"]');
|
|
153
|
+
await expect(option.disabled).to.be.true;
|
|
154
|
+
option.click();
|
|
155
|
+
await elementUpdated(el);
|
|
156
|
+
await expect(comboboxPlaceholderText(combobox)).to.equal('No options selected');
|
|
157
|
+
await expect(el.value).to.deep.equal([]);
|
|
158
|
+
});
|
|
159
|
+
it('should disable the combobox when the disabled attribute is set', async () => {
|
|
160
|
+
const el = await fixture(html ` <tt-combobox id="combobox" disabled>
|
|
161
|
+
<span slot="label">Test combobox</span>
|
|
162
|
+
<option slot="option" value="1">Option 1</option>
|
|
163
|
+
<option slot="option" value="2">Option 2</option>
|
|
164
|
+
<option slot="option" value="3">Option 3</option>
|
|
165
|
+
</tt-combobox>`);
|
|
166
|
+
const combobox = getCombobox(el);
|
|
167
|
+
expect(combobox.disabled).to.be.true;
|
|
168
|
+
});
|
|
169
|
+
xit('should render the error message', async () => {
|
|
170
|
+
const el = await fixture(html ` <tt-combobox id="combobox">
|
|
171
|
+
<span slot="label">Test combobox</span>
|
|
172
|
+
<option slot="option" value="1">Option 1</option>
|
|
173
|
+
<option slot="option" value="2">Option 2</option>
|
|
174
|
+
<option slot="option" value="3">Option 3</option>
|
|
175
|
+
<span slot="error">There was an error</span>
|
|
176
|
+
</tt-combobox>`);
|
|
177
|
+
await elementUpdated(el);
|
|
178
|
+
const combobox = getCombobox(el);
|
|
179
|
+
const ariaInvalid = combobox.getAttribute('aria-invalid');
|
|
180
|
+
expect(ariaInvalid).to.equal('false');
|
|
181
|
+
const errorMessage = el.shadowRoot.querySelector('[id="error-msg-combobox"]');
|
|
182
|
+
expect(errorMessage.checkVisibility()).to.be.false;
|
|
183
|
+
el.invalid = true;
|
|
184
|
+
await elementUpdated(el);
|
|
185
|
+
expect(combobox).to.have.attribute('aria-invalid');
|
|
186
|
+
expect(errorMessage.checkVisibility()).to.be.true;
|
|
187
|
+
});
|
|
188
|
+
it('should call the event handler when the value changes', async () => {
|
|
189
|
+
const el = await fixture(html ` <tt-combobox id="combobox">
|
|
190
|
+
<span slot="label">Test combobox</span>
|
|
191
|
+
<option slot="option" value="1">Option 1</option>
|
|
192
|
+
<option slot="option" value="2">Option 2</option>
|
|
193
|
+
<option slot="option" value="3">Option 3</option>
|
|
194
|
+
</tt-combobox>`);
|
|
195
|
+
const combobox = getCombobox(el);
|
|
196
|
+
combobox.click();
|
|
197
|
+
const option = el.shadowRoot.querySelector('tt-option[value="2"]');
|
|
198
|
+
option.click();
|
|
199
|
+
const event = await oneEvent(el, 'change');
|
|
200
|
+
const eventValue = event.target.value;
|
|
201
|
+
expect(eventValue).to.be.an('array').that.includes('2');
|
|
202
|
+
});
|
|
203
|
+
it("Should prevent the form from submitting when it's required and no option is selected", async () => {
|
|
204
|
+
const el = await fixture(html ` <tt-combobox id="combobox" required>
|
|
205
|
+
<span slot="label">Test combobox</span>
|
|
206
|
+
<option slot="option" value="1">Option 1</option>
|
|
207
|
+
<option slot="option" value="2">Option 2</option>
|
|
208
|
+
<option slot="option" value="3">Option 3</option>
|
|
209
|
+
</tt-combobox>`);
|
|
210
|
+
const form = document.createElement('form');
|
|
211
|
+
form.appendChild(el);
|
|
212
|
+
document.body.appendChild(form);
|
|
213
|
+
const submitEvent = new Event('submit', { bubbles: true });
|
|
214
|
+
form.dispatchEvent(submitEvent);
|
|
215
|
+
await elementUpdated(el);
|
|
216
|
+
expect(form.checkValidity()).to.be.false;
|
|
217
|
+
});
|
|
218
|
+
it('passes the a11y audit', async () => {
|
|
219
|
+
const el = await fixture(html ` <tt-combobox></tt-combobox>`);
|
|
220
|
+
await expect(el).shadowDom.to.be.accessible();
|
|
221
|
+
});
|
|
222
|
+
it('should allow hidden options', async () => {
|
|
223
|
+
const el = await fixture(html ` <tt-combobox id="combobox" multiselect display-select-all>
|
|
224
|
+
<span slot="label">Test combobox</span>
|
|
225
|
+
<option slot="option" value="1">Option 1</option>
|
|
226
|
+
<option slot="option" value="2">Option 2</option>
|
|
227
|
+
<option slot="option" value="3">Option 3</option>
|
|
228
|
+
<option slot="option" value="4" hidden>Option 4</option>
|
|
229
|
+
</tt-combobox>`);
|
|
230
|
+
const combobox = getCombobox(el);
|
|
231
|
+
combobox.click();
|
|
232
|
+
await combobox.click();
|
|
233
|
+
const selectAll = el.shadowRoot.querySelector('tt-option.select-all');
|
|
234
|
+
expect(selectAll).to.exist;
|
|
235
|
+
selectAll.click();
|
|
236
|
+
const changeEvent = await oneEvent(el, 'change');
|
|
237
|
+
expect(changeEvent).to.exist;
|
|
238
|
+
expect(changeEvent.target.value).to.deep.equal(['1', '2', '3', '4']);
|
|
239
|
+
const hiddenOption = el.shadowRoot.querySelector('tt-option[value="4"][hidden]');
|
|
240
|
+
expect(hiddenOption).to.exist;
|
|
241
|
+
});
|
|
242
|
+
it('should not include hidden options in the placeholder text', async () => {
|
|
243
|
+
const el = await fixture(html ` <tt-combobox id="combobox" multiselect display-select-all>
|
|
244
|
+
<span slot="label">Test combobox</span>
|
|
245
|
+
<option slot="option" value="1">Option 1</option>
|
|
246
|
+
<option slot="option" value="2">Option 2</option>
|
|
247
|
+
<option slot="option" value="3">Option 3</option>
|
|
248
|
+
<option slot="option" value="4" hidden>Option 4</option>
|
|
249
|
+
</tt-combobox>`);
|
|
250
|
+
const combobox = getCombobox(el);
|
|
251
|
+
combobox.click();
|
|
252
|
+
await combobox.click();
|
|
253
|
+
const selectAll = el.shadowRoot.querySelector('tt-option.select-all');
|
|
254
|
+
expect(selectAll).to.exist;
|
|
255
|
+
selectAll.click();
|
|
256
|
+
el.shadowRoot.querySelector('tt-option[value="3"]').click();
|
|
257
|
+
const changeEvent = await oneEvent(el, 'change');
|
|
258
|
+
expect(changeEvent).to.exist;
|
|
259
|
+
expect(changeEvent.target.value).to.deep.equal(['1', '2', '4']);
|
|
260
|
+
expect(combobox.placeholder).to.equal('2 options selected');
|
|
261
|
+
});
|
|
262
|
+
it('should close after selecting an option when multiselect is false', async () => {
|
|
263
|
+
const el = await fixture(html ` <tt-combobox id="combobox">
|
|
264
|
+
<span slot="label">Test combobox</span>
|
|
265
|
+
<option slot="option" value="1">Option 1</option>
|
|
266
|
+
<option slot="option" value="2">Option 2</option>
|
|
267
|
+
<option slot="option" value="3">Option 3</option>
|
|
268
|
+
</tt-combobox>`);
|
|
269
|
+
const combobox = getCombobox(el);
|
|
270
|
+
combobox.click();
|
|
271
|
+
let options = el.shadowRoot.querySelectorAll('tt-option');
|
|
272
|
+
expect(options.length).to.equal(3);
|
|
273
|
+
const option = el.shadowRoot.querySelector('tt-option[value="2"]');
|
|
274
|
+
option.click();
|
|
275
|
+
await elementUpdated(el);
|
|
276
|
+
options = el.shadowRoot.querySelectorAll('tt-option');
|
|
277
|
+
options.forEach((o) => {
|
|
278
|
+
expect(o.checkVisibility()).to.be.false;
|
|
279
|
+
});
|
|
280
|
+
});
|
|
281
|
+
it('should include selected options in the value', async () => {
|
|
282
|
+
const el = await fixture(html ` <tt-combobox id="combobox" multiselect display-select-all>
|
|
283
|
+
<span slot="label">Test combobox</span>
|
|
284
|
+
<option slot="option" value="1">Option 1</option>
|
|
285
|
+
<option slot="option" value="2">Option 2</option>
|
|
286
|
+
<option slot="option" value="3">Option 3</option>
|
|
287
|
+
<option slot="option" value="4" selected>Option 4</option>
|
|
288
|
+
</tt-combobox>`);
|
|
289
|
+
await elementUpdated(el);
|
|
290
|
+
expect(el.value).to.deep.equal(['4']);
|
|
291
|
+
const option = el.querySelector('option[value="3"]');
|
|
292
|
+
option.setAttribute('selected', 'true');
|
|
293
|
+
await elementUpdated(el);
|
|
294
|
+
await elementUpdated(el); // We have to update twice because we handle the value change, and then rerender
|
|
295
|
+
expect(el.value).to.be.an('array').that.includes('4').and.includes('3');
|
|
296
|
+
});
|
|
297
|
+
it('should accept a JSON string as value', async () => {
|
|
298
|
+
const value = ['1', '2'];
|
|
299
|
+
const el = await fixture(html ` <tt-combobox id="combobox" multiselect display-select-all value="${JSON.stringify(value)}">
|
|
300
|
+
<span slot="label">Test combobox</span>
|
|
301
|
+
<option slot="option" value="1">Option 1</option>
|
|
302
|
+
<option slot="option" value="2">Option 2</option>
|
|
303
|
+
<option slot="option" value="3">Option 3</option>
|
|
304
|
+
</tt-combobox>`);
|
|
305
|
+
await expect(el.value).to.deep.equal(value);
|
|
306
|
+
const selectedOptions = el.shadowRoot.querySelectorAll('tt-option[selected]');
|
|
307
|
+
expect(selectedOptions).to.have.lengthOf(2);
|
|
308
|
+
await expect(Array.from(selectedOptions).map((option) => option.value)).to.deep.equal(value);
|
|
309
|
+
});
|
|
310
|
+
it('should display the passed placeholder when all options are selected', async () => {
|
|
311
|
+
const el = await fixture(html ` <tt-combobox id="combobox" multiselect display-select-all select-all-placeholder="Everything">
|
|
312
|
+
<span slot="label">Test combobox</span>
|
|
313
|
+
<option slot="option" value="1">Option 1</option>
|
|
314
|
+
<option slot="option" value="2">Option 2</option>
|
|
315
|
+
<option slot="option" value="3">Option 3</option>
|
|
316
|
+
</tt-combobox>`);
|
|
317
|
+
const combobox = getCombobox(el);
|
|
318
|
+
combobox.click();
|
|
319
|
+
const selectAll = el.shadowRoot.querySelector('tt-option.select-all');
|
|
320
|
+
expect(selectAll).to.exist;
|
|
321
|
+
selectAll.click();
|
|
322
|
+
await oneEvent(el, 'change');
|
|
323
|
+
expect(comboboxPlaceholderText(combobox)).to.equal('Everything');
|
|
324
|
+
});
|
|
325
|
+
it('should render selected options correctly after filtering and deselecting', async () => {
|
|
326
|
+
const el = await fixture(html ` <tt-combobox id="combobox" multiselect display-select-all select-all-placeholder="Everything">
|
|
327
|
+
<span slot="label">Test combobox</span>
|
|
328
|
+
<option slot="option" value="1">Option 1</option>
|
|
329
|
+
<option slot="option" value="2">Option 2</option>
|
|
330
|
+
<option slot="option" value="3">Option 3</option>
|
|
331
|
+
</tt-combobox>`);
|
|
332
|
+
const combobox = getCombobox(el);
|
|
333
|
+
combobox.click();
|
|
334
|
+
// Select all options
|
|
335
|
+
const selectAll = el.shadowRoot.querySelector('tt-option.select-all');
|
|
336
|
+
expect(selectAll).to.exist;
|
|
337
|
+
selectAll.click();
|
|
338
|
+
await elementUpdated(el);
|
|
339
|
+
// Filter options by typing "Option 1"
|
|
340
|
+
combobox.value = 'Option 1';
|
|
341
|
+
combobox.dispatchEvent(new InputEvent('input', { bubbles: true, composed: true }));
|
|
342
|
+
await elementUpdated(el);
|
|
343
|
+
// Deselect "Option 1"
|
|
344
|
+
const option1 = el.shadowRoot.querySelector('tt-option[value="1"]');
|
|
345
|
+
expect(option1).to.exist;
|
|
346
|
+
option1.click();
|
|
347
|
+
await elementUpdated(el);
|
|
348
|
+
// Clear the filter
|
|
349
|
+
combobox.value = '';
|
|
350
|
+
combobox.dispatchEvent(new InputEvent('input', { bubbles: true, composed: true }));
|
|
351
|
+
await elementUpdated(el);
|
|
352
|
+
// Verify selected options
|
|
353
|
+
const selectedOptions = el.shadowRoot.querySelectorAll('tt-option[selected]');
|
|
354
|
+
expect(selectedOptions).to.have.lengthOf(2);
|
|
355
|
+
});
|
|
356
|
+
it('should only add the visible options to the value when select all is clicked after filtering', async () => {
|
|
357
|
+
const el = await fixture(html ` <tt-combobox id="combobox" multiselect display-select-all select-all-placeholder="Everything">
|
|
358
|
+
<span slot="label">Test combobox</span>
|
|
359
|
+
<option slot="option" value="1">Option 1</option>
|
|
360
|
+
<option slot="option" value="2">Option 2</option>
|
|
361
|
+
<option slot="option" value="3">Option 3</option>
|
|
362
|
+
</tt-combobox>`);
|
|
363
|
+
// Open the combobox
|
|
364
|
+
const combobox = getCombobox(el);
|
|
365
|
+
combobox.click();
|
|
366
|
+
// Filter options by typing "Option 1" to only show that option
|
|
367
|
+
filterCombobox(combobox, 'Option 1');
|
|
368
|
+
await elementUpdated(el);
|
|
369
|
+
// Only Option 1 should be visible
|
|
370
|
+
const visibleOptions = el.shadowRoot.querySelectorAll('tt-option:not(.select-all, [hidden])');
|
|
371
|
+
await expect(visibleOptions.length).to.equal(1);
|
|
372
|
+
await expect(visibleOptions[0].getAttribute('value')).to.equal('1');
|
|
373
|
+
// Click "Select All"
|
|
374
|
+
const selectAll = el.shadowRoot.querySelector('tt-option.select-all');
|
|
375
|
+
selectAll.click();
|
|
376
|
+
await elementUpdated(el);
|
|
377
|
+
// Clear the filter
|
|
378
|
+
filterCombobox(combobox, '');
|
|
379
|
+
await elementUpdated(el);
|
|
380
|
+
// Verify that only "Option 1" is selected
|
|
381
|
+
await expect(el.value).to.deep.equal(['1']);
|
|
382
|
+
});
|
|
383
|
+
it('should only remove the visible options from the value when deselecting select all after filtering', async () => {
|
|
384
|
+
const el = await fixture(html ` <tt-combobox id="combobox" multiselect display-select-all select-all-placeholder="Everything">
|
|
385
|
+
<span slot="label">Test combobox</span>
|
|
386
|
+
<option slot="option" value="1">Option 1</option>
|
|
387
|
+
<option slot="option" value="2">Option 2</option>
|
|
388
|
+
<option slot="option" value="3">Option 3</option>
|
|
389
|
+
</tt-combobox>`);
|
|
390
|
+
// Open the combobox
|
|
391
|
+
const combobox = getCombobox(el);
|
|
392
|
+
combobox.click();
|
|
393
|
+
// Click "Select All"
|
|
394
|
+
const selectAll = el.shadowRoot.querySelector('tt-option.select-all');
|
|
395
|
+
selectAll.click();
|
|
396
|
+
await elementUpdated(el);
|
|
397
|
+
// Filter options by typing "Option 1" to only show that option
|
|
398
|
+
filterCombobox(combobox, 'Option 1');
|
|
399
|
+
await elementUpdated(el);
|
|
400
|
+
// Click "Select All" again to deselect visible options
|
|
401
|
+
selectAll.click();
|
|
402
|
+
await elementUpdated(el);
|
|
403
|
+
// Clear the filter
|
|
404
|
+
filterCombobox(combobox, '');
|
|
405
|
+
await elementUpdated(el);
|
|
406
|
+
// Verify that only "Option 1" is selected
|
|
407
|
+
await expect(el.value).to.deep.equal(['2', '3']);
|
|
408
|
+
});
|
|
409
|
+
describe('Form Integration', () => {
|
|
410
|
+
it('should include its values in FormData when submitted', async () => {
|
|
411
|
+
// Create a form with the combobox component
|
|
412
|
+
const form = await fixture(html `
|
|
413
|
+
<form method="post" action="#">
|
|
414
|
+
<input type="text" name="text_field" value="test_input" />
|
|
415
|
+
<tt-combobox name="country_select" id="combobox">
|
|
416
|
+
<option slot="option" value="us">United States</option>
|
|
417
|
+
<option slot="option" value="ca">Canada</option>
|
|
418
|
+
<option slot="option" value="mx">Mexico</option>
|
|
419
|
+
</tt-combobox>
|
|
420
|
+
<button type="submit">Submit</button>
|
|
421
|
+
</form>
|
|
422
|
+
`);
|
|
423
|
+
const combobox = form.querySelector('tt-combobox');
|
|
424
|
+
expect(combobox).to.exist;
|
|
425
|
+
// Select an option by setting the value directly
|
|
426
|
+
combobox.value = ['ca'];
|
|
427
|
+
await elementUpdated(combobox);
|
|
428
|
+
// Create FormData from the form and verify the combobox's value is included
|
|
429
|
+
const formData = new FormData(form);
|
|
430
|
+
const comboboxValue = formData.get('country_select');
|
|
431
|
+
expect(comboboxValue).to.exist;
|
|
432
|
+
const parsedValue = JSON.parse(comboboxValue);
|
|
433
|
+
expect(parsedValue).to.deep.equal(['ca']);
|
|
434
|
+
});
|
|
435
|
+
it('should include multiple selected values in FormData when multiselect is true', async () => {
|
|
436
|
+
// Create a form with a multiselect combobox
|
|
437
|
+
const form = await fixture(html `
|
|
438
|
+
<form method="post" action="#">
|
|
439
|
+
<tt-combobox name="countries" multiselect id="multiselect-combobox">
|
|
440
|
+
<option slot="option" value="us">United States</option>
|
|
441
|
+
<option slot="option" value="ca">Canada</option>
|
|
442
|
+
<option slot="option" value="mx">Mexico</option>
|
|
443
|
+
<option slot="option" value="uk">United Kingdom</option>
|
|
444
|
+
</tt-combobox>
|
|
445
|
+
<button type="submit">Submit</button>
|
|
446
|
+
</form>
|
|
447
|
+
`);
|
|
448
|
+
const combobox = form.querySelector('tt-combobox');
|
|
449
|
+
// Select multiple options
|
|
450
|
+
combobox.value = ['us', 'mx', 'uk'];
|
|
451
|
+
await elementUpdated(combobox);
|
|
452
|
+
// Verify FormData contains the multiple selected values
|
|
453
|
+
const formData = new FormData(form);
|
|
454
|
+
const comboboxValue = formData.get('countries');
|
|
455
|
+
expect(comboboxValue).to.exist;
|
|
456
|
+
const parsedValue = JSON.parse(comboboxValue);
|
|
457
|
+
expect(parsedValue).to.be.an('array').that.includes('us');
|
|
458
|
+
expect(parsedValue).to.be.an('array').that.includes('mx');
|
|
459
|
+
expect(parsedValue).to.be.an('array').that.includes('uk');
|
|
460
|
+
expect(parsedValue).to.have.lengthOf(3);
|
|
461
|
+
});
|
|
462
|
+
it('should update FormData when selections change', async () => {
|
|
463
|
+
const form = await fixture(html `
|
|
464
|
+
<form method="post" action="#">
|
|
465
|
+
<tt-combobox name="selection" id="combobox">
|
|
466
|
+
<option slot="option" value="option1">Option 1</option>
|
|
467
|
+
<option slot="option" value="option2">Option 2</option>
|
|
468
|
+
<option slot="option" value="option3">Option 3</option>
|
|
469
|
+
</tt-combobox>
|
|
470
|
+
</form>
|
|
471
|
+
`);
|
|
472
|
+
const combobox = form.querySelector('tt-combobox');
|
|
473
|
+
// Initial selection
|
|
474
|
+
combobox.value = ['option1'];
|
|
475
|
+
await elementUpdated(combobox);
|
|
476
|
+
// Check initial FormData
|
|
477
|
+
let formData = new FormData(form);
|
|
478
|
+
let value = JSON.parse(formData.get('selection'));
|
|
479
|
+
expect(value).to.deep.equal(['option1']);
|
|
480
|
+
// Change selection
|
|
481
|
+
combobox.value = ['option2'];
|
|
482
|
+
await elementUpdated(combobox);
|
|
483
|
+
// Check updated FormData
|
|
484
|
+
formData = new FormData(form);
|
|
485
|
+
value = JSON.parse(formData.get('selection'));
|
|
486
|
+
expect(value).to.deep.equal(['option2']);
|
|
487
|
+
});
|
|
488
|
+
});
|
|
489
|
+
});
|
|
490
|
+
//# sourceMappingURL=tt-combobox.test.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"tt-combobox.test.js","sourceRoot":"","sources":["../../../test/tt-combobox.test.ts"],"names":[],"mappings":"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","sourcesContent":["import { html } from 'lit';\nimport { elementUpdated, expect, fixture, oneEvent } from '@open-wc/testing';\nimport { TtCombobox } from '../src/index.js';\nimport '../src/tt-combobox.js';\nimport { TtOption } from '../src/tt-option/TtOption.js';\n\ndescribe('TtCombobox', () => {\n const getCombobox = (el: TtCombobox) => el.shadowRoot!.querySelector('[role=\"combobox\"]') as HTMLInputElement;\n\n const comboboxPlaceholderText = (combobox: HTMLInputElement) => combobox.getAttribute('placeholder');\n\n const filterCombobox = (combobox: HTMLInputElement, text: string) => {\n combobox.value = text;\n combobox.dispatchEvent(new InputEvent('input', { bubbles: true, composed: true }));\n };\n\n it('Should render with the default placeholder text', async () => {\n const el = await fixture<TtCombobox>(\n html` <tt-combobox id=\"combobox\">\n <span slot=\"label\">Test combobox</span>\n <option slot=\"option\" value=\"1\">Option 1</option>\n <option slot=\"option\" value=\"2\">Option 2</option>\n <option slot=\"option\" value=\"3\">Option 3</option>\n </tt-combobox>`\n );\n\n const combobox = getCombobox(el);\n\n await expect(comboboxPlaceholderText(combobox)).to.equal('No options selected');\n });\n\n it('should render with the options visible when clicking the combobox', async () => {\n const el = await fixture<TtCombobox>(\n html` <tt-combobox id=\"combobox\">\n <span slot=\"label\">Test combobox</span>\n <option slot=\"option\" value=\"1\">Option 1</option>\n <option slot=\"option\" value=\"2\">Option 2</option>\n <option slot=\"option\" value=\"3\">Option 3</option>\n </tt-combobox>`\n );\n\n const combobox = getCombobox(el);\n combobox.click();\n\n const options = el.shadowRoot!.querySelectorAll('tt-option');\n await expect(options.length).to.equal(3);\n options.forEach((option) => {\n expect(option.checkVisibility()).to.be.true;\n });\n });\n\n it('should update the placeholder with the selected option', async () => {\n const el = await fixture<TtCombobox>(\n html` <tt-combobox id=\"combobox\">\n <span slot=\"label\">Test combobox</span>\n <option slot=\"option\" value=\"1\">Option 1</option>\n <option slot=\"option\" value=\"2\">Option 2</option>\n <option slot=\"option\" value=\"3\">Option 3</option>\n </tt-combobox>`\n );\n\n const combobox = getCombobox(el);\n combobox.click();\n\n const option = el.shadowRoot!.querySelector('tt-option[value=\"2\"]') as HTMLLIElement;\n option.click();\n await elementUpdated(el);\n expect(comboboxPlaceholderText(combobox)).to.equal('Option 2');\n });\n\n it('should update the placeholder with the selected option when setting it via selectedValues', async () => {\n const el = await fixture<TtCombobox>(\n html` <tt-combobox id=\"combobox\" multiselect>\n <span slot=\"label\">Test combobox</span>\n <option slot=\"option\" value=\"1\">Option 1</option>\n <option slot=\"option\" value=\"2\">Option 2</option>\n <option slot=\"option\" value=\"3\">Option 3</option>\n </tt-combobox>`\n );\n\n const combobox = getCombobox(el);\n el.value = ['2'];\n await elementUpdated(el);\n await expect(comboboxPlaceholderText(combobox)).to.equal('Option 2');\n });\n\n it('should display select all option when multiselect is true and display-select-all is true, and select all options when clicked', async () => {\n const el = await fixture<TtCombobox>(\n html` <tt-combobox id=\"combobox\" multiselect display-select-all>\n <span slot=\"label\">Test combobox</span>\n <option slot=\"option\" value=\"1\">Option 1</option>\n <option slot=\"option\" value=\"2\">Option 2</option>\n <option slot=\"option\" value=\"3\">Option 3</option>\n </tt-combobox>`\n );\n\n const combobox = getCombobox(el);\n await combobox.click();\n\n const selectAll = el.shadowRoot!.querySelector('tt-option.select-all') as HTMLLIElement;\n expect(selectAll).to.exist;\n\n selectAll.click();\n await oneEvent(el, 'change');\n\n const options = el.shadowRoot!.querySelectorAll('tt-option');\n options.forEach((option) => {\n expect(option.selected).to.be.true;\n });\n });\n\n it('should display total selected count after filtering when options were selected before filtering', async () => {\n const el = await fixture<TtCombobox>(\n html` <tt-combobox id=\"combobox\" multiselect>\n <span slot=\"label\">Test combobox</span>\n <option slot=\"option\" value=\"1\">Option 1</option>\n <option slot=\"option\" value=\"2\">Option 2</option>\n <option slot=\"option\" value=\"3\">Option 3</option>\n </tt-combobox>`\n );\n\n const combobox = getCombobox(el);\n combobox.click();\n await elementUpdated(el);\n\n // Select options 1, 2, and 3 (all of them)\n const option1 = el.shadowRoot!.querySelector('tt-option[value=\"1\"]') as HTMLLIElement;\n option1.click();\n await elementUpdated(el);\n const option2 = el.shadowRoot!.querySelector('tt-option[value=\"2\"]') as HTMLLIElement;\n option2.click();\n await elementUpdated(el);\n const option3 = el.shadowRoot!.querySelector('tt-option[value=\"3\"]') as HTMLLIElement;\n option3.click();\n await elementUpdated(el);\n\n // Should show 3 options selected\n expect(comboboxPlaceholderText(combobox)).to.equal('All options selected');\n\n // Now filter to show only \"Option 1\"\n filterCombobox(combobox, 'Option 1');\n await elementUpdated(el);\n\n // Should still show 3 options selected (not 1)\n expect(comboboxPlaceholderText(combobox)).to.equal('3 options selected');\n });\n\n it('should show correct count after clearing filter when only filtered options were selected', async () => {\n const el = await fixture<TtCombobox>(\n html` <tt-combobox id=\"combobox\" multiselect>\n <span slot=\"label\">Test combobox</span>\n <option slot=\"option\" value=\"1\">Option 1</option>\n <option slot=\"option\" value=\"11\">Option 11</option>\n <option slot=\"option\" value=\"2\">Option 2</option>\n <option slot=\"option\" value=\"3\">Option 3</option>\n <option slot=\"option\" value=\"4\">Option 4</option>\n <option slot=\"option\" value=\"5\">Option 5</option>\n </tt-combobox>`\n );\n\n const combobox = getCombobox(el);\n combobox.click();\n await elementUpdated(el);\n\n // Filter to show only 2 options (Option 1 and Option 11 match \"1\")\n filterCombobox(combobox, '1');\n await elementUpdated(el);\n\n // Select both visible filtered options\n const option1 = el.shadowRoot!.querySelector('tt-option[value=\"1\"]') as HTMLLIElement;\n option1.click();\n await elementUpdated(el);\n const option11 = el.shadowRoot!.querySelector('tt-option[value=\"11\"]') as HTMLLIElement;\n option11.click();\n await elementUpdated(el);\n\n // Verify 2 options selected while filter is active\n expect(comboboxPlaceholderText(combobox)).to.equal('2 options selected');\n\n // Clear the filter\n filterCombobox(combobox, '');\n await elementUpdated(el);\n\n // Should show \"2 options selected\", NOT \"All options selected\"\n // This is the critical test - when filter is cleared, it should count\n // all selected options (2), not say \"all\" just because all visible options\n // during filtering were selected\n expect(comboboxPlaceholderText(combobox)).to.equal('2 options selected');\n });\n\n it('should not allow a disabled option to be selected', async () => {\n const el = await fixture<TtCombobox>(\n html` <tt-combobox id=\"combobox\">\n <span slot=\"label\">Test combobox</span>\n <option slot=\"option\" value=\"1\">Option 1</option>\n <option slot=\"option\" value=\"2\" disabled>Option 2</option>\n <option slot=\"option\" value=\"3\">Option 3</option>\n </tt-combobox>`\n );\n\n const combobox = getCombobox(el);\n await combobox.click();\n\n await elementUpdated(el);\n\n const option = el.shadowRoot!.querySelector('tt-option[value=\"2\"]') as TtOption;\n\n await expect(option.disabled).to.be.true;\n option.click();\n\n await elementUpdated(el);\n\n await expect(comboboxPlaceholderText(combobox)).to.equal('No options selected');\n await expect(el.value).to.deep.equal([]);\n });\n\n it('should disable the combobox when the disabled attribute is set', async () => {\n const el = await fixture<TtCombobox>(\n html` <tt-combobox id=\"combobox\" disabled>\n <span slot=\"label\">Test combobox</span>\n <option slot=\"option\" value=\"1\">Option 1</option>\n <option slot=\"option\" value=\"2\">Option 2</option>\n <option slot=\"option\" value=\"3\">Option 3</option>\n </tt-combobox>`\n );\n\n const combobox = getCombobox(el);\n expect(combobox.disabled).to.be.true;\n });\n\n xit('should render the error message', async () => {\n const el = await fixture<TtCombobox>(\n html` <tt-combobox id=\"combobox\">\n <span slot=\"label\">Test combobox</span>\n <option slot=\"option\" value=\"1\">Option 1</option>\n <option slot=\"option\" value=\"2\">Option 2</option>\n <option slot=\"option\" value=\"3\">Option 3</option>\n <span slot=\"error\">There was an error</span>\n </tt-combobox>`\n );\n await elementUpdated(el);\n const combobox = getCombobox(el);\n const ariaInvalid = combobox.getAttribute('aria-invalid');\n expect(ariaInvalid).to.equal('false');\n\n const errorMessage = el.shadowRoot!.querySelector('[id=\"error-msg-combobox\"]');\n expect(errorMessage!.checkVisibility()).to.be.false;\n\n el.invalid = true;\n\n await elementUpdated(el);\n\n expect(combobox).to.have.attribute('aria-invalid');\n expect(errorMessage!.checkVisibility()).to.be.true;\n });\n\n it('should call the event handler when the value changes', async () => {\n const el = await fixture<TtCombobox>(\n html` <tt-combobox id=\"combobox\">\n <span slot=\"label\">Test combobox</span>\n <option slot=\"option\" value=\"1\">Option 1</option>\n <option slot=\"option\" value=\"2\">Option 2</option>\n <option slot=\"option\" value=\"3\">Option 3</option>\n </tt-combobox>`\n );\n\n const combobox = getCombobox(el);\n\n combobox.click();\n\n const option = el.shadowRoot!.querySelector('tt-option[value=\"2\"]') as HTMLLIElement;\n option.click();\n\n const event = await oneEvent(el, 'change');\n const eventValue = (event.target! as HTMLLIElement).value;\n expect(eventValue).to.be.an('array').that.includes('2');\n });\n\n it(\"Should prevent the form from submitting when it's required and no option is selected\", async () => {\n const el = await fixture<TtCombobox>(\n html` <tt-combobox id=\"combobox\" required>\n <span slot=\"label\">Test combobox</span>\n <option slot=\"option\" value=\"1\">Option 1</option>\n <option slot=\"option\" value=\"2\">Option 2</option>\n <option slot=\"option\" value=\"3\">Option 3</option>\n </tt-combobox>`\n );\n\n const form = document.createElement('form');\n form.appendChild(el);\n document.body.appendChild(form);\n\n const submitEvent = new Event('submit', { bubbles: true });\n form.dispatchEvent(submitEvent);\n\n await elementUpdated(el);\n\n expect(form.checkValidity()).to.be.false;\n });\n\n it('passes the a11y audit', async () => {\n const el = await fixture<TtCombobox>(html` <tt-combobox></tt-combobox>`);\n\n await expect(el).shadowDom.to.be.accessible();\n });\n\n it('should allow hidden options', async () => {\n const el = await fixture<TtCombobox>(\n html` <tt-combobox id=\"combobox\" multiselect display-select-all>\n <span slot=\"label\">Test combobox</span>\n <option slot=\"option\" value=\"1\">Option 1</option>\n <option slot=\"option\" value=\"2\">Option 2</option>\n <option slot=\"option\" value=\"3\">Option 3</option>\n <option slot=\"option\" value=\"4\" hidden>Option 4</option>\n </tt-combobox>`\n );\n\n const combobox = getCombobox(el);\n combobox.click();\n\n await combobox.click();\n\n const selectAll = el.shadowRoot!.querySelector('tt-option.select-all') as TtOption;\n expect(selectAll).to.exist;\n\n selectAll.click();\n const changeEvent = await oneEvent<InputEvent>(el, 'change');\n\n expect(changeEvent).to.exist;\n expect((changeEvent.target as TtCombobox).value).to.deep.equal(['1', '2', '3', '4']);\n\n const hiddenOption = el.shadowRoot!.querySelector('tt-option[value=\"4\"][hidden]') as TtOption;\n expect(hiddenOption).to.exist;\n });\n\n it('should not include hidden options in the placeholder text', async () => {\n const el = await fixture<TtCombobox>(\n html` <tt-combobox id=\"combobox\" multiselect display-select-all>\n <span slot=\"label\">Test combobox</span>\n <option slot=\"option\" value=\"1\">Option 1</option>\n <option slot=\"option\" value=\"2\">Option 2</option>\n <option slot=\"option\" value=\"3\">Option 3</option>\n <option slot=\"option\" value=\"4\" hidden>Option 4</option>\n </tt-combobox>`\n );\n\n const combobox = getCombobox(el);\n combobox.click();\n\n await combobox.click();\n\n const selectAll = el.shadowRoot!.querySelector('tt-option.select-all') as TtOption;\n expect(selectAll).to.exist;\n\n selectAll.click();\n\n (<TtOption>el.shadowRoot!.querySelector('tt-option[value=\"3\"]')).click();\n\n const changeEvent = await oneEvent<InputEvent>(el, 'change');\n\n expect(changeEvent).to.exist;\n expect((changeEvent.target as TtCombobox).value).to.deep.equal(['1', '2', '4']);\n\n expect(combobox.placeholder).to.equal('2 options selected');\n });\n\n it('should close after selecting an option when multiselect is false', async () => {\n const el = await fixture<TtCombobox>(\n html` <tt-combobox id=\"combobox\">\n <span slot=\"label\">Test combobox</span>\n <option slot=\"option\" value=\"1\">Option 1</option>\n <option slot=\"option\" value=\"2\">Option 2</option>\n <option slot=\"option\" value=\"3\">Option 3</option>\n </tt-combobox>`\n );\n\n const combobox = getCombobox(el);\n combobox.click();\n\n let options = el.shadowRoot!.querySelectorAll('tt-option');\n expect(options.length).to.equal(3);\n\n const option = el.shadowRoot!.querySelector('tt-option[value=\"2\"]') as HTMLLIElement;\n option.click();\n await elementUpdated(el);\n\n options = el.shadowRoot!.querySelectorAll('tt-option');\n options.forEach((o) => {\n expect(o.checkVisibility()).to.be.false;\n });\n });\n\n it('should include selected options in the value', async () => {\n const el = await fixture<TtCombobox>(\n html` <tt-combobox id=\"combobox\" multiselect display-select-all>\n <span slot=\"label\">Test combobox</span>\n <option slot=\"option\" value=\"1\">Option 1</option>\n <option slot=\"option\" value=\"2\">Option 2</option>\n <option slot=\"option\" value=\"3\">Option 3</option>\n <option slot=\"option\" value=\"4\" selected>Option 4</option>\n </tt-combobox>`\n );\n\n await elementUpdated(el);\n expect(el.value).to.deep.equal(['4']);\n\n const option = el.querySelector('option[value=\"3\"]') as HTMLOptionElement;\n option.setAttribute('selected', 'true');\n\n await elementUpdated(el);\n await elementUpdated(el); // We have to update twice because we handle the value change, and then rerender\n\n expect(el.value).to.be.an('array').that.includes('4').and.includes('3');\n });\n\n it('should accept a JSON string as value', async () => {\n const value = ['1', '2'];\n\n const el = await fixture<TtCombobox>(\n html` <tt-combobox id=\"combobox\" multiselect display-select-all value=\"${JSON.stringify(value)}\">\n <span slot=\"label\">Test combobox</span>\n <option slot=\"option\" value=\"1\">Option 1</option>\n <option slot=\"option\" value=\"2\">Option 2</option>\n <option slot=\"option\" value=\"3\">Option 3</option>\n </tt-combobox>`\n );\n\n await expect(el.value).to.deep.equal(value);\n const selectedOptions = el.shadowRoot!.querySelectorAll('tt-option[selected]') as NodeListOf<TtOption>;\n expect(selectedOptions).to.have.lengthOf(2);\n await expect(Array.from(selectedOptions).map((option) => option.value)).to.deep.equal(value);\n });\n\n it('should display the passed placeholder when all options are selected', async () => {\n const el = await fixture<TtCombobox>(\n html` <tt-combobox id=\"combobox\" multiselect display-select-all select-all-placeholder=\"Everything\">\n <span slot=\"label\">Test combobox</span>\n <option slot=\"option\" value=\"1\">Option 1</option>\n <option slot=\"option\" value=\"2\">Option 2</option>\n <option slot=\"option\" value=\"3\">Option 3</option>\n </tt-combobox>`\n );\n\n const combobox = getCombobox(el);\n combobox.click();\n\n const selectAll = el.shadowRoot!.querySelector('tt-option.select-all') as TtOption;\n expect(selectAll).to.exist;\n\n selectAll.click();\n await oneEvent(el, 'change');\n\n expect(comboboxPlaceholderText(combobox)).to.equal('Everything');\n });\n\n it('should render selected options correctly after filtering and deselecting', async () => {\n const el = await fixture<TtCombobox>(\n html` <tt-combobox id=\"combobox\" multiselect display-select-all select-all-placeholder=\"Everything\">\n <span slot=\"label\">Test combobox</span>\n <option slot=\"option\" value=\"1\">Option 1</option>\n <option slot=\"option\" value=\"2\">Option 2</option>\n <option slot=\"option\" value=\"3\">Option 3</option>\n </tt-combobox>`\n );\n\n const combobox = getCombobox(el);\n combobox.click();\n\n // Select all options\n const selectAll = el.shadowRoot!.querySelector('tt-option.select-all') as TtOption;\n expect(selectAll).to.exist;\n\n selectAll.click();\n await elementUpdated(el);\n\n // Filter options by typing \"Option 1\"\n combobox.value = 'Option 1';\n combobox.dispatchEvent(new InputEvent('input', { bubbles: true, composed: true }));\n await elementUpdated(el);\n\n // Deselect \"Option 1\"\n const option1 = el.shadowRoot!.querySelector('tt-option[value=\"1\"]') as TtOption;\n expect(option1).to.exist;\n\n option1.click();\n await elementUpdated(el);\n\n // Clear the filter\n combobox.value = '';\n combobox.dispatchEvent(new InputEvent('input', { bubbles: true, composed: true }));\n await elementUpdated(el);\n\n // Verify selected options\n const selectedOptions = el.shadowRoot!.querySelectorAll('tt-option[selected]');\n expect(selectedOptions).to.have.lengthOf(2);\n });\n\n it('should only add the visible options to the value when select all is clicked after filtering', async () => {\n const el = await fixture<TtCombobox>(\n html` <tt-combobox id=\"combobox\" multiselect display-select-all select-all-placeholder=\"Everything\">\n <span slot=\"label\">Test combobox</span>\n <option slot=\"option\" value=\"1\">Option 1</option>\n <option slot=\"option\" value=\"2\">Option 2</option>\n <option slot=\"option\" value=\"3\">Option 3</option>\n </tt-combobox>`\n );\n\n // Open the combobox\n const combobox = getCombobox(el);\n combobox.click();\n\n // Filter options by typing \"Option 1\" to only show that option\n filterCombobox(combobox, 'Option 1');\n await elementUpdated(el);\n\n // Only Option 1 should be visible\n const visibleOptions = el.shadowRoot!.querySelectorAll('tt-option:not(.select-all, [hidden])');\n await expect(visibleOptions.length).to.equal(1);\n await expect(visibleOptions[0].getAttribute('value')).to.equal('1');\n\n // Click \"Select All\"\n const selectAll = el.shadowRoot!.querySelector('tt-option.select-all') as TtOption;\n selectAll.click();\n await elementUpdated(el);\n\n // Clear the filter\n filterCombobox(combobox, '');\n await elementUpdated(el);\n\n // Verify that only \"Option 1\" is selected\n await expect(el.value).to.deep.equal(['1']);\n });\n\n it('should only remove the visible options from the value when deselecting select all after filtering', async () => {\n const el = await fixture<TtCombobox>(\n html` <tt-combobox id=\"combobox\" multiselect display-select-all select-all-placeholder=\"Everything\">\n <span slot=\"label\">Test combobox</span>\n <option slot=\"option\" value=\"1\">Option 1</option>\n <option slot=\"option\" value=\"2\">Option 2</option>\n <option slot=\"option\" value=\"3\">Option 3</option>\n </tt-combobox>`\n );\n\n // Open the combobox\n const combobox = getCombobox(el);\n combobox.click();\n\n // Click \"Select All\"\n const selectAll = el.shadowRoot!.querySelector('tt-option.select-all') as TtOption;\n selectAll.click();\n await elementUpdated(el);\n\n // Filter options by typing \"Option 1\" to only show that option\n filterCombobox(combobox, 'Option 1');\n await elementUpdated(el);\n\n // Click \"Select All\" again to deselect visible options\n selectAll.click();\n await elementUpdated(el);\n\n // Clear the filter\n filterCombobox(combobox, '');\n await elementUpdated(el);\n\n // Verify that only \"Option 1\" is selected\n await expect(el.value).to.deep.equal(['2', '3']);\n });\n\n describe('Form Integration', () => {\n it('should include its values in FormData when submitted', async () => {\n // Create a form with the combobox component\n const form = await fixture<HTMLFormElement>(html`\n <form method=\"post\" action=\"#\">\n <input type=\"text\" name=\"text_field\" value=\"test_input\" />\n <tt-combobox name=\"country_select\" id=\"combobox\">\n <option slot=\"option\" value=\"us\">United States</option>\n <option slot=\"option\" value=\"ca\">Canada</option>\n <option slot=\"option\" value=\"mx\">Mexico</option>\n </tt-combobox>\n <button type=\"submit\">Submit</button>\n </form>\n `);\n\n const combobox = form.querySelector('tt-combobox') as TtCombobox;\n expect(combobox).to.exist;\n\n // Select an option by setting the value directly\n combobox.value = ['ca'];\n await elementUpdated(combobox);\n\n // Create FormData from the form and verify the combobox's value is included\n const formData = new FormData(form);\n const comboboxValue = formData.get('country_select');\n\n expect(comboboxValue).to.exist;\n const parsedValue = JSON.parse(comboboxValue as string);\n expect(parsedValue).to.deep.equal(['ca']);\n });\n\n it('should include multiple selected values in FormData when multiselect is true', async () => {\n // Create a form with a multiselect combobox\n const form = await fixture<HTMLFormElement>(html`\n <form method=\"post\" action=\"#\">\n <tt-combobox name=\"countries\" multiselect id=\"multiselect-combobox\">\n <option slot=\"option\" value=\"us\">United States</option>\n <option slot=\"option\" value=\"ca\">Canada</option>\n <option slot=\"option\" value=\"mx\">Mexico</option>\n <option slot=\"option\" value=\"uk\">United Kingdom</option>\n </tt-combobox>\n <button type=\"submit\">Submit</button>\n </form>\n `);\n\n const combobox = form.querySelector('tt-combobox') as TtCombobox;\n\n // Select multiple options\n combobox.value = ['us', 'mx', 'uk'];\n await elementUpdated(combobox);\n\n // Verify FormData contains the multiple selected values\n const formData = new FormData(form);\n const comboboxValue = formData.get('countries');\n\n expect(comboboxValue).to.exist;\n const parsedValue = JSON.parse(comboboxValue as string);\n expect(parsedValue).to.be.an('array').that.includes('us');\n expect(parsedValue).to.be.an('array').that.includes('mx');\n expect(parsedValue).to.be.an('array').that.includes('uk');\n expect(parsedValue).to.have.lengthOf(3);\n });\n\n it('should update FormData when selections change', async () => {\n const form = await fixture<HTMLFormElement>(html`\n <form method=\"post\" action=\"#\">\n <tt-combobox name=\"selection\" id=\"combobox\">\n <option slot=\"option\" value=\"option1\">Option 1</option>\n <option slot=\"option\" value=\"option2\">Option 2</option>\n <option slot=\"option\" value=\"option3\">Option 3</option>\n </tt-combobox>\n </form>\n `);\n\n const combobox = form.querySelector('tt-combobox') as TtCombobox;\n\n // Initial selection\n combobox.value = ['option1'];\n await elementUpdated(combobox);\n\n // Check initial FormData\n let formData = new FormData(form);\n let value = JSON.parse(formData.get('selection') as string);\n expect(value).to.deep.equal(['option1']);\n\n // Change selection\n combobox.value = ['option2'];\n await elementUpdated(combobox);\n\n // Check updated FormData\n formData = new FormData(form);\n value = JSON.parse(formData.get('selection') as string);\n expect(value).to.deep.equal(['option2']);\n });\n });\n});\n"]}
|
package/package.json
CHANGED
|
@@ -3,29 +3,34 @@
|
|
|
3
3
|
"description": "Webcomponent tt-combobox following open-wc recommendations",
|
|
4
4
|
"license": "MIT",
|
|
5
5
|
"author": "@triptease",
|
|
6
|
-
"version": "5.
|
|
6
|
+
"version": "5.7.0",
|
|
7
7
|
"type": "module",
|
|
8
|
-
"main": "dist/src/index.js",
|
|
9
|
-
"module": "dist/src/index.js",
|
|
8
|
+
"main": "dist/esm/src/index.js",
|
|
9
|
+
"module": "dist/esm/src/index.js",
|
|
10
10
|
"exports": {
|
|
11
11
|
".": {
|
|
12
|
-
"
|
|
13
|
-
"
|
|
12
|
+
"types": "./dist/esm/src/index.d.ts",
|
|
13
|
+
"import": "./dist/esm/src/index.js",
|
|
14
|
+
"require": "./dist/cjs/src/index.js"
|
|
14
15
|
},
|
|
15
16
|
"./tt-combobox.js": {
|
|
16
|
-
"
|
|
17
|
-
"
|
|
17
|
+
"types": "./dist/esm/src/tt-combobox.d.ts",
|
|
18
|
+
"import": "./dist/esm/src/tt-combobox.js",
|
|
19
|
+
"require": "./dist/cjs/src/tt-combobox.js"
|
|
18
20
|
},
|
|
19
21
|
"./tt-option.js": {
|
|
20
|
-
"
|
|
21
|
-
"
|
|
22
|
+
"types": "./dist/esm/src/tt-option.d.ts",
|
|
23
|
+
"import": "./dist/esm/src/tt-option/tt-option.js",
|
|
24
|
+
"require": "./dist/cjs/src/tt-option/tt-option.js"
|
|
22
25
|
}
|
|
23
26
|
},
|
|
24
27
|
"scripts": {
|
|
25
28
|
"analyze": "cem analyze --litelement",
|
|
26
29
|
"start": "tsc && concurrently -k -r \"tsc --watch --preserveWatchOutput\" \"web-dev-server\"",
|
|
27
30
|
"build": "yarn build:node && yarn build:web && npm run analyze -- --exclude dist",
|
|
28
|
-
"build:
|
|
31
|
+
"build:esm": "tsc",
|
|
32
|
+
"build:cjs": "tsc -p tsconfig.cjs.json && node ../../scripts/create-cjs-package.mjs",
|
|
33
|
+
"build:node": "yarn build:esm && yarn build:cjs",
|
|
29
34
|
"build:node:watch": "tsc --watch",
|
|
30
35
|
"build:web": "node ../../scripts/esbuild.mjs",
|
|
31
36
|
"prepublish": "tsc && npm run analyze -- --exclude dist",
|
|
@@ -33,7 +38,7 @@
|
|
|
33
38
|
"test:watch": "tsc && concurrently -k -r \"tsc --watch --preserveWatchOutput\" \"wtr --watch\""
|
|
34
39
|
},
|
|
35
40
|
"dependencies": {
|
|
36
|
-
"@triptease/icons": "1.
|
|
41
|
+
"@triptease/icons": "1.4.0",
|
|
37
42
|
"lit": "^3.1.4"
|
|
38
43
|
},
|
|
39
44
|
"devDependencies": {
|
package/tsconfig.json
CHANGED
|
@@ -1,9 +1,9 @@
|
|
|
1
1
|
{
|
|
2
|
-
"extends": "../../tsconfig.packages.json",
|
|
2
|
+
"extends": "../../tsconfig.packages.esm.json",
|
|
3
3
|
"compilerOptions": {
|
|
4
4
|
"rootDir": "./",
|
|
5
|
-
"outDir": "dist"
|
|
5
|
+
"outDir": "dist/esm"
|
|
6
6
|
},
|
|
7
|
-
"include": ["
|
|
7
|
+
"include": ["src/**/*.ts", "test/**/*.ts"],
|
|
8
8
|
"exclude": ["node_modules", "dist"]
|
|
9
9
|
}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"TtCombobox.js","sourceRoot":"","sources":["../../src/TtCombobox.ts"],"names":[],"mappings":"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","sourcesContent":["import { html, LitElement, nothing, PropertyValues } from 'lit';\nimport { property, query, queryAll, queryAssignedElements, state } from 'lit/decorators.js';\nimport { ifDefined } from 'lit/directives/if-defined.js';\nimport { repeat } from 'lit/directives/repeat.js';\nimport { unsafeHTML } from 'lit/directives/unsafe-html.js';\nimport { unsafeSVG } from 'lit/directives/unsafe-svg.js';\nimport { guard } from 'lit/directives/guard.js';\nimport { alert, chevronDown } from '@triptease/icons';\nimport { styles } from './styles.js';\nimport { TtOption } from './tt-option/TtOption.js';\n\nexport class TtCombobox extends LitElement {\n static styles = styles;\n\n static formAssociated = true;\n\n static shadowRootOptions = {\n ...LitElement.shadowRootOptions,\n delegatesFocus: true,\n };\n\n @property({ type: Boolean })\n multiselect = false;\n\n @property({ type: Boolean })\n disabled = false;\n\n @property({ type: Boolean })\n invalid = false;\n\n @property({ type: Boolean, attribute: 'display-select-all' })\n displaySelectAll = false;\n\n @property({ type: Boolean })\n required = false;\n\n @property({ type: String })\n name = '';\n\n @property({ type: String, attribute: 'aria-labelledby' })\n ariaLabelledby = nothing;\n\n @property({ type: Boolean, attribute: 'hide-caret' })\n hideCaret = false;\n\n @property({ type: String })\n placeholder?: string;\n\n @property({ type: String, attribute: 'select-all-placeholder' })\n selectAllPlaceholder?: string;\n\n @property({ type: Boolean, attribute: 'open-upward' })\n openUpward = false;\n\n get form(): HTMLFormElement | null {\n return this.internals.form;\n }\n\n @state()\n protected _activeOption: number = -1;\n\n @state()\n protected _expanded = false;\n\n @state()\n protected _filter: string = '';\n\n @queryAssignedElements({ slot: 'option', selector: 'option' })\n options!: Array<HTMLOptionElement>;\n\n @queryAssignedElements({ slot: 'option', selector: 'tt-option:not([disabled])' })\n activeOptions!: Array<HTMLOptionElement>;\n\n @queryAssignedElements({ slot: 'error' })\n protected errorElements!: Array<HTMLElement>;\n\n @queryAll('tt-option:not([hidden], [disabled])')\n protected _visibleOptions!: Array<TtOption>;\n\n @queryAll('tt-option:not([hidden], .select-all)')\n protected _visibleOptionsNotSelectAll!: Array<TtOption>;\n\n @queryAll('tt-option:not([disabled], .select-all)')\n protected _selectableOptions!: NodeListOf<TtOption>;\n\n @queryAll('tt-option:not([disabled], [hidden], .select-all)')\n protected _selectableVisibleOptions!: NodeListOf<TtOption>;\n\n @query('input[role=\"combobox\"]')\n protected _comboboxInput!: HTMLInputElement;\n\n @query('button:has(svg)')\n protected _chevronButton!: HTMLButtonElement;\n\n public internals: ReturnType<typeof this.attachInternals>;\n\n @property({ type: Array<string>, attribute: 'value' })\n public value: string[] = [];\n\n private get _isAllSelected(): boolean {\n return (\n Boolean(this._visibleOptionsNotSelectAll.length) &&\n Array.from(this._visibleOptionsNotSelectAll).every((option) => this.value.includes(option.value))\n );\n }\n\n protected get _selectedVisibleOptions(): Array<TtOption> {\n return Array.from(this._visibleOptions).filter((option) => this.value.includes(option.value));\n }\n\n protected get _selectedOptions(): Array<TtOption> {\n return Array.from(this._visibleOptionsNotSelectAll).filter((option) => this.value.includes(option.value));\n }\n\n private _slotObserver: MutationObserver = new MutationObserver((mutations) => {\n mutations.forEach((mutation) => {\n if (mutation.type === 'attributes') {\n this.requestUpdate('options');\n }\n });\n });\n\n constructor() {\n super();\n this.internals = this.attachInternals();\n }\n\n private _handleFocusOut(e: FocusEvent) {\n if (!this.shadowRoot!.contains(e.relatedTarget as Node | null)) {\n this._expanded = false;\n }\n this._filter = '';\n }\n\n private _onFocus() {\n this._comboboxInput.focus();\n }\n\n public connectedCallback() {\n super.connectedCallback();\n\n this.addEventListener('focus', this._onFocus);\n }\n\n public disconnectedCallback() {\n super.disconnectedCallback();\n\n this.removeEventListener('focus', this._onFocus);\n }\n\n protected firstUpdated(changedProperties: PropertyValues) {\n this.internals.setFormValue(JSON.stringify(this.value));\n\n this._reportValidity();\n this._listenForOptionChange();\n\n super.firstUpdated(changedProperties);\n }\n\n protected update(changedProperties: PropertyValues) {\n if (changedProperties.has('value')) {\n this._valueChanged();\n\n if (\n changedProperties.get('value') !== undefined &&\n JSON.stringify(changedProperties.get('value')) !== JSON.stringify(this.value)\n ) {\n this._dispatchSelectedOptions();\n this._reportValidity();\n }\n }\n\n if (changedProperties.has('_expanded') && changedProperties.get('_expanded') && !this._expanded) {\n this.internals.states.add('interacted');\n }\n\n if (changedProperties.has('options')) {\n this.updateComplete.then(() => {\n const selectedAssignedOptions = Array.from(this.options).filter((option) => option.selected);\n this.value = Array.from(new Set([...this.value, ...selectedAssignedOptions.map((option) => option.value!)]));\n this._listenForOptionChange();\n });\n }\n super.update(changedProperties);\n }\n\n private _valueChanged = () => {\n this._selectableOptions.forEach((option) => {\n if (this.value.includes(option.value!)) {\n this._checkOption(option);\n } else {\n this._uncheckOption(option);\n }\n });\n\n this.internals.setFormValue(JSON.stringify(this.value));\n };\n\n private _listenForOptionChange = () => {\n this.options.forEach((option) => {\n this._slotObserver.observe(option, { attributes: true, attributeFilter: ['selected', 'disabled', 'hidden'] });\n });\n };\n\n private _reportValidity() {\n if (this.required && !this.value.length) {\n const errorMessage = this.multiselect ? 'Please select at least one option' : 'Please select an option';\n\n this.internals.setValidity(\n {\n valueMissing: true,\n },\n errorMessage,\n this._comboboxInput\n );\n this.internals.states.add('--invalid');\n } else if (!this.internals.validity.valid) {\n this.internals.setValidity({});\n\n if (this.internals.states.has('--invalid')) {\n this.internals.states.delete('--invalid');\n }\n }\n }\n\n private get labels(): Array<HTMLElement> {\n return <Array<HTMLElement>>[...this.internals.labels];\n }\n\n private get labelContent(): string {\n if (this.ariaLabel !== null) {\n return this.ariaLabel;\n }\n\n return this.labels.map((label) => label.innerText).join(', ');\n }\n\n private _onKeyUp(event: KeyboardEvent) {\n switch (event.key) {\n case 'ArrowDown':\n event.preventDefault();\n if (!this._expanded) {\n this._expanded = true;\n this._activeOption = -1;\n } else {\n this._activeOption = Math.min(this._visibleOptions.length - 1, this._activeOption + 1);\n }\n break;\n case 'ArrowUp':\n event.preventDefault();\n if (this._expanded) {\n this._activeOption = Math.max(0, this._activeOption - 1);\n }\n break;\n case 'Escape':\n event.preventDefault();\n if (this._expanded) {\n this._expanded = false;\n } else if (this._filter !== '') {\n this._filter = '';\n }\n break;\n case 'Enter':\n event.preventDefault();\n if (this._expanded) {\n this._visibleOptions[this._activeOption].click();\n }\n break;\n default:\n break;\n }\n }\n\n private _uncheckOption(option: HTMLElement) {\n if (option.dataset.deselectable !== 'true') return;\n\n option.setAttribute('aria-selected', 'false');\n const checkbox = <HTMLInputElement>option.querySelector('input[type=\"checkbox\"]');\n if (checkbox) {\n checkbox.checked = false;\n }\n }\n\n private _checkOption(option: HTMLElement) {\n if (!this.multiselect) {\n this._selectableOptions.forEach((opt) => {\n this._uncheckOption(opt);\n });\n }\n\n option.setAttribute('aria-selected', 'true');\n const checkbox = <HTMLInputElement>option.querySelector('input[type=\"checkbox\"]');\n if (checkbox) {\n checkbox.checked = true;\n }\n }\n\n private _getActiveOptionId(): string | undefined {\n if (this._activeOption === -1 || this._visibleOptions.length === 0) {\n return undefined;\n }\n\n const option = this._visibleOptions[this._activeOption];\n return option.id;\n }\n\n private _onClick() {\n this._expanded = !this._expanded;\n\n if (this._expanded) {\n (<HTMLElement>this.shadowRoot?.querySelector('input[role=\"combobox\"]'))?.focus();\n }\n }\n\n private _onChevronClick() {\n (<HTMLElement>this.shadowRoot?.querySelector('input[role=\"combobox\"]'))?.focus();\n }\n\n private _onClickOption(event: MouseEvent) {\n event.preventDefault();\n event.stopPropagation();\n\n const option = event.currentTarget as TtOption;\n if (option.disabled) return;\n\n const selectedValue = option.value as string;\n\n if (this.multiselect) {\n if (this.value.includes(selectedValue)) {\n this.value = this.value.filter((value) => value !== selectedValue);\n } else {\n this.value = [...this.value, selectedValue];\n }\n } else {\n this.value = [selectedValue];\n this._expanded = false;\n }\n }\n\n private _onInput(event: Event) {\n const input = event.target as HTMLInputElement;\n const filter = input.value;\n if (filter !== '' && !this._expanded) {\n this._expanded = true;\n }\n this._activeOption = -1;\n this._filter = filter;\n }\n\n private _dispatchSelectedOptions() {\n this.dispatchEvent(\n new Event('change', {\n bubbles: true,\n composed: true,\n })\n );\n }\n\n private _selectAll = (event: MouseEvent) => {\n event.preventDefault();\n event.stopPropagation();\n\n // If filtering, and all visible options are selected, deselect only visible options\n // Else if filtering, select all visible options\n\n if (this._filter !== '' && this._isAllSelected) {\n const selectedVisibleValues = this._selectedVisibleOptions.map((option) => option.value);\n this.value = this.value.filter((value) => !selectedVisibleValues.includes(value));\n } else if (this._filter !== '') {\n this.value = Array.from(\n new Set([...this.value, ...Array.from(this._selectableVisibleOptions).map((option) => option.value)])\n );\n } else if (this.value.length === this._selectableOptions.length) {\n this.value = [];\n } else {\n this.value = Array.from(this._selectableOptions).map((option) => option.value);\n }\n };\n\n private get _isValid(): boolean {\n return this.internals.validity.valid && !this.invalid;\n }\n\n private _renderCombobox() {\n const placeHolderValue = guard(\n [this.placeholder, this.disabled, this.value, this.activeOptions.length, this.selectAllPlaceholder, this._filter],\n () => {\n if (this.placeholder) {\n return this.placeholder;\n }\n\n if (this.disabled) {\n return 'Disabled';\n }\n if (!this.value.length) {\n return 'No options selected';\n }\n if (this.value.length === 1) {\n return Array.from(this._selectableVisibleOptions)\n .find((option) => option.value === this.value[0])\n ?.textContent?.trim();\n }\n\n // Count all selected values, excluding only those that correspond to permanently hidden options\n const permanentlyHiddenValues = Array.from(this.options)\n .filter((option) => option.hidden)\n .map((option) => option.value);\n\n const selectedCount = this.value.filter((val) => !permanentlyHiddenValues.includes(val)).length;\n\n // Only show \"All options selected\" when truly all non-hidden options are selected\n const totalSelectableCount = this.options.length - permanentlyHiddenValues.length;\n if (this._filter === '' && selectedCount === totalSelectableCount && totalSelectableCount > 0) {\n return this.selectAllPlaceholder || 'All options selected';\n }\n\n return `${selectedCount} options selected`;\n }\n );\n\n return html` <input\n type=\"text\"\n id=\"${this.id}\"\n name=\"${this.name}\"\n autocomplete=\"off\"\n aria-label=\"${this.labelContent}\"\n aria-labelledby=\"${this.ariaLabelledby}\"\n role=\"combobox\"\n aria-controls=\"${this.id}-list\"\n aria-expanded=\"${this._expanded}\"\n aria-autocomplete=\"list\"\n aria-haspopup=\"listbox\"\n aria-disabled=\"${this.disabled}\"\n aria-invalid=\"${!this._isValid}\"\n aria-errormessage=\"${!this._isValid ? `error-msg-${this.id}` : nothing}\"\n aria-required=\"${this.required}\"\n ?disabled=${this.disabled}\n aria-activedescendant=\"${ifDefined(this._getActiveOptionId())}\"\n @input=\"${this._onInput}\"\n .value=\"${this._filter}\"\n .placeholder=\"${placeHolderValue}\"\n @focusout=\"${this._handleFocusOut}\"\n part=\"input\"\n class=${this.hideCaret ? 'hide-caret' : ''}\n />`;\n }\n\n private _renderSelectAll = () => {\n if (!this.multiselect || !this.displaySelectAll) {\n return nothing;\n }\n const id = `${this.id}-option-select-all`;\n const active = this._getActiveOptionId() === id;\n const selected = this._isAllSelected;\n\n return html`\n <tt-option\n id=\"${id}\"\n class=\"select-all\"\n ?selected=${selected}\n ?active=${active}\n include-checkbox\n @click=\"${this._selectAll}\"\n exportparts=\"option, checkbox\"\n part=\"option\"\n value=\"select-all\"\n >Select all</tt-option\n >\n `;\n };\n\n private _renderOption(option: HTMLOptionElement) {\n const hidden = Boolean(\n (this._filter !== '' &&\n !option.value.toLowerCase().includes(this._filter.toLowerCase()) &&\n !option.innerText.toLowerCase().includes(this._filter.toLowerCase())) ||\n option.hidden\n );\n\n const id = `${this.id}-option-${option.value}`;\n const active = this._getActiveOptionId() === id;\n const selected = this.value.includes(option.value);\n\n return html`\n <tt-option\n id=\"${id}\"\n value=\"${option.value}\"\n ?selected=${selected}\n ?disabled=${option.disabled}\n ?active=${active}\n ?include-checkbox=${this.multiselect}\n ?hidden=${hidden}\n @click=\"${this._onClickOption}\"\n >\n ${unsafeHTML(option.innerHTML)}\n </tt-option>\n `;\n }\n\n private _renderChevron = () => html`\n <button\n type=\"button\"\n aria-label=\"Expand\"\n @click=\"${this._onChevronClick}\"\n aria-expanded=\"${this._expanded}\"\n aria-controls=\"${this.id}-list\"\n tabindex=\"-1\"\n ?disabled=${this.disabled}\n part=\"arrow\"\n >\n ${unsafeSVG(chevronDown)}\n </button>\n `;\n\n private _hasErrorContent(): boolean {\n return this.errorElements?.length > 0;\n }\n\n render() {\n return html`\n <div\n class=\"tt-combobox-container\"\n @focus=\"${this._onFocus}\"\n @keydown=\"${this._onKeyUp}\"\n @click=\"${this._onClick}\"\n aria-disabled=\"${this.disabled}\"\n part=\"container\"\n >\n <slot name=\"icon\" part=\"icon\"></slot>\n ${this._renderCombobox()} ${this._renderChevron()}\n <ul\n id=\"${this.id}-list\"\n role=\"listbox\"\n aria-multiselectable=\"${this.multiselect}\"\n aria-label=\"${this.labelContent}\"\n part=\"listbox\"\n ?data-open-upward=\"${this.openUpward}\"\n >\n ${this._renderSelectAll()} ${repeat(this.options, (opt) => opt.value, this._renderOption.bind(this))}\n\n <li part=\"no-results\" class=\"no-results\">No results</li>\n </ul>\n </div>\n <slot name=\"option\" @slotchange=${() => this.requestUpdate('options')}></slot>\n <div\n class=\"errormessage\"\n id=\"error-msg-${this.id}\"\n role=\"alert\"\n aria-atomic=\"true\"\n ?data-hidden=\"${!this._hasErrorContent()}\"\n part=\"error\"\n >\n ${unsafeSVG(alert)}\n <slot name=\"error\"></slot>\n </div>\n `;\n }\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'tt-combobox': TtCombobox;\n }\n}\n"]}
|
package/dist/src/index.js.map
DELETED
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/index.ts"],"names":[],"mappings":"AAAA,cAAc,YAAY,CAAC;AAC3B,OAAO,EAAE,UAAU,EAAE,MAAM,kBAAkB,CAAC","sourcesContent":["export * from './types.js';\nexport { TtCombobox } from './tt-combobox.js';\n"]}
|
package/dist/src/styles.js.map
DELETED
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"styles.js","sourceRoot":"","sources":["../../src/styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA2NxB,CAAC","sourcesContent":["import { css } from 'lit';\n\nexport const styles = css`\n :host {\n display: flex;\n flex-direction: var(--tt-combobox-flex-direction, row);\n align-items: var(--tt-combobox-align-items, center);\n justify-content: var(--tt-combobox-justify-content, initial);\n align-content: var(--tt-combobox-align-content, initial);\n gap: var(--tt-combobox-gap, 0.5rem);\n font-size: var(--tt-combobox-font-size, var(--font-size-200));\n color: var(--tt-combobox-color, var(--color-text-400));\n }\n\n :host([disabled]) .tt-combobox-container {\n border-color: var(--tt-combobox-disabled-border-color, var(--color-border-200));\n color: var(--tt-combobox-disabled-color, var(--color-text-200));\n background-color: var(--tt-combobox-disabled-background-color, var(--color-surface-200));\n pointer-events: none;\n }\n\n .tt-combobox-container:focus-within {\n outline: 5px auto Highlight;\n outline: 5px auto -webkit-focus-ring-color;\n }\n\n .tt-combobox-container:hover {\n background-color: var(--tt-combobox-hover-background-color, var(--color-surface-300));\n }\n\n :host([invalid]) .tt-combobox-container,\n :host(:state(interacted):invalid) .tt-combobox-container {\n outline: 1px solid var(--color-alert-strong);\n }\n\n .errormessage {\n visibility: hidden;\n display: flex;\n align-items: center;\n gap: var(--space-scale-0-5);\n color: var(--color-alert-strong);\n\n &[data-hidden] {\n display: none;\n }\n }\n\n .errormessage svg path {\n fill: var(--color-alert-strong);\n height: 20px;\n }\n\n .tt-combobox-container:has([role='combobox'][aria-invalid='true']) ~ .errormessage {\n visibility: visible;\n }\n\n :has([role='combobox'][aria-invalid='true']) ::slotted([slot='error']) {\n color: var(--color-alert-strong);\n font-size: var(--font-size-100);\n margin: 0;\n font-weight: var(--font-weight-regular);\n line-height: 1.2;\n }\n\n slot[name='option']::slotted(*) {\n display: none;\n }\n\n * {\n box-sizing: border-box;\n font-family: var(--font-family-sans);\n cursor: inherit;\n }\n\n .tt-combobox-container {\n position: relative;\n max-width: var(--tt-combobox-max-width, 300px);\n min-width: var(--tt-combobox-min-width, 250px);\n display: flex;\n flex-direction: row;\n align-items: center;\n border-radius: var(--border-radius);\n border-color: var(--tt-combobox-border-color, var(--color-border-400));\n border-style: solid;\n border-width: var(--tt-combobox-border-width, 1px);\n background-color: var(--tt-combobox-background-color, var(--color-surface-100));\n padding: 0.5rem;\n gap: 0.25rem;\n //width: 100%;\n }\n\n [role='listbox'] {\n display: none;\n }\n\n [role='combobox'] {\n width: 100%;\n border-style: none;\n background-color: transparent;\n font-size: var(--tt-combobox-font-size, var(--font-size-200));\n }\n\n .hide-caret {\n caret-color: transparent;\n }\n\n [role='combobox']::placeholder {\n color: var(--tt-combobox-placeholder-color, var(--color-text-300));\n font-family: var(--font-family-inter);\n font-size: var(--tt-combobox-font-size, var(--font-size-200));\n }\n\n :host([disabled]) [role='combobox']::placeholder {\n color: var(--tt-combobox-disabled-placeholder-color, var(--color-text-200));\n }\n\n [role='combobox']:placeholder-shown {\n text-overflow: ellipsis;\n overflow: clip;\n }\n\n [role='combobox']:focus {\n outline: none;\n }\n\n [role='combobox'] ~ button {\n appearance: none;\n padding: 0;\n border-width: 0;\n background-color: transparent;\n aspect-ratio: 1;\n }\n\n [role='combobox'] ~ button svg {\n transition: transform 0.2s ease-in-out;\n color: var(--tt-combobox-dropdown-color, var(--color-text-400));\n }\n\n [role='combobox'][aria-expanded='true'] ~ button svg {\n transform: rotate(180deg);\n }\n\n [role='combobox'][aria-expanded='true'] ~ [role='listbox'] {\n display: block;\n width: max-content;\n max-width: var(--tt-combobox-list-max-width, 35ch);\n min-width: 100%;\n background-color: var(--tt-combobox-list-background-color, var(--color-surface-100, white));\n border: 1px solid var(--tt-combobox-border-color, var(--color-border-300));\n border-radius: var(--border-radius);\n box-shadow: var(--box-shadow-lg);\n padding: 0;\n position: absolute;\n top: var(--tt-combobox-top, calc(100% + 0.5rem));\n left: var(--tt-combobox-left, 0);\n right: var(--tt-combobox-right, unset);\n bottom: var(--tt-combobox-bottom, unset);\n z-index: 2;\n margin: 0;\n list-style: none;\n max-height: var(--tt-combobox-max-height, 400px);\n overflow-y: auto;\n\n .no-results {\n display: none;\n }\n\n &:not(:has(tt-option:not([hidden], .select-all))) {\n .no-results {\n display: flex;\n padding: 0.5rem;\n box-sizing: border-box;\n text-align: left;\n text-overflow: ellipsis;\n text-wrap: nowrap;\n align-items: center;\n gap: 0.25rem;\n max-width: 100%;\n width: 100%;\n overflow-y: visible;\n flex: 1;\n\n span {\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n flex: 1;\n line-height: 1.1;\n }\n }\n\n .select-all {\n display: none;\n }\n }\n }\n\n [role='combobox'][aria-expanded='true'] ~ [role='listbox'][data-open-upward] {\n top: unset;\n bottom: calc(100% + 0.5rem);\n }\n\n slot[name='icon'] {\n display: inline-block;\n max-width: var(--tt-combobox-icon-size, 1rem);\n aspect-ratio: 1;\n }\n\n tt-option.select-all::part(option) {\n border-bottom: 1px solid var(--color-border-300);\n }\n\n label {\n font-size: var(--tt-combobox-label-font-size, inherit);\n color: var(--tt-combobox-label-color, inherit);\n font-weight: var(--tt-combobox-label-font-weight, inherit);\n\n &[data-hidden] {\n display: none;\n }\n }\n`;\n"]}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"tt-combobox.js","sourceRoot":"","sources":["../../src/tt-combobox.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAE,MAAM,iBAAiB,CAAC;AAC7C,OAAO,0BAA0B,CAAC;AAElC,IAAI,OAAO,MAAM,KAAK,WAAW,EAAE,CAAC;IAClC,IAAI,CAAC,MAAM,CAAC,cAAc,CAAC,GAAG,CAAC,aAAa,CAAC,EAAE,CAAC;QAC9C,MAAM,CAAC,cAAc,CAAC,MAAM,CAAC,aAAa,EAAE,UAAU,CAAC,CAAC;IAC1D,CAAC;AACH,CAAC;AAED,OAAO,EAAE,UAAU,EAAE,CAAC","sourcesContent":["import { TtCombobox } from './TtCombobox.js';\nimport './tt-option/tt-option.js';\n\nif (typeof window !== 'undefined') {\n if (!window.customElements.get('tt-combobox')) {\n window.customElements.define('tt-combobox', TtCombobox);\n }\n}\n\nexport { TtCombobox };\n"]}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"TtOption.js","sourceRoot":"","sources":["../../../src/tt-option/TtOption.ts"],"names":[],"mappings":";;;;;;AAAA,OAAO,EAAE,IAAI,EAAE,UAAU,EAAE,OAAO,EAAE,MAAM,KAAK,CAAC;AAChD,OAAO,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAC;AAC7C,OAAO,EAAE,MAAM,EAAE,MAAM,aAAa,CAAC;AAErC,MAAM,OAAO,QAAS,SAAQ,UAAU;IAAxC;;QASE,aAAQ,GAAG,KAAK,CAAC;QAGjB,aAAQ,GAAG,KAAK,CAAC;QAGjB,WAAM,GAAG,KAAK,CAAC;QAGf,UAAK,GAAG,EAAE,CAAC;QAGX,oBAAe,GAAG,KAAK,CAAC;QAahB,aAAQ,GAAG,CAAC,KAAiB,EAAE,EAAE;YACvC,IAAI,IAAI,CAAC,QAAQ,EAAE,CAAC;gBAClB,KAAK,CAAC,cAAc,EAAE,CAAC;gBACvB,KAAK,CAAC,wBAAwB,EAAE,CAAC;gBACjC,KAAK,CAAC,eAAe,EAAE,CAAC;YAC1B,CAAC;QACH,CAAC,CAAC;IAwBJ,CAAC;IAzCC,iBAAiB;QACf,KAAK,CAAC,iBAAiB,EAAE,CAAC;QAE1B,IAAI,CAAC,gBAAgB,CAAC,OAAO,EAAE,IAAI,CAAC,QAAQ,CAAC,CAAC;IAChD,CAAC;IAED,oBAAoB;QAClB,KAAK,CAAC,oBAAoB,EAAE,CAAC;QAC7B,IAAI,CAAC,mBAAmB,CAAC,OAAO,EAAE,IAAI,CAAC,QAAQ,CAAC,CAAC;IACnD,CAAC;IAUD,MAAM;QACJ,OAAO,IAAI,CAAA;;;yBAGU,IAAI,CAAC,QAAQ;yBACb,IAAI,CAAC,QAAQ;wBACd,IAAI,CAAC,MAAM;uBACZ,IAAI,CAAC,MAAM;sBACZ,IAAI,CAAC,KAAK;kBACd,IAAI,CAAC,QAAQ;sBACT,CAAC,KAAiB,EAAE,EAAE,CAAC,KAAK,CAAC,cAAc,EAAE;;;UAGzD,IAAI,CAAC,eAAe;YACpB,CAAC,CAAC,IAAI,CAAA,mCAAmC,IAAI,CAAC,QAAQ,uDAAuD;YAC7G,CAAC,CAAC,OAAO;;;;;KAKd,CAAC;IACJ,CAAC;;AA9DM,eAAM,GAAG,MAAM,AAAT,CAAU;AAEhB,0BAAiB,GAAG;IACzB,GAAG,UAAU,CAAC,iBAAiB;IAC/B,cAAc,EAAE,IAAI;CACrB,AAHuB,CAGtB;AAGF;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,CAAC;0CACX;AAGjB;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,CAAC;0CACX;AAGjB;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,CAAC;wCACb;AAGf;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;uCAChB;AAGX;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,SAAS,EAAE,kBAAkB,EAAE,CAAC;iDACnC","sourcesContent":["import { html, LitElement, nothing } from 'lit';\nimport { property } from 'lit/decorators.js';\nimport { styles } from './styles.js';\n\nexport class TtOption extends LitElement {\n static styles = styles;\n\n static shadowRootOptions = {\n ...LitElement.shadowRootOptions,\n delegatesFocus: true,\n };\n\n @property({ type: Boolean })\n disabled = false;\n\n @property({ type: Boolean })\n selected = false;\n\n @property({ type: Boolean })\n active = false;\n\n @property({ type: String })\n value = '';\n\n @property({ type: Boolean, attribute: 'include-checkbox' })\n includeCheckbox = false;\n\n connectedCallback() {\n super.connectedCallback();\n\n this.addEventListener('click', this._onClick);\n }\n\n disconnectedCallback() {\n super.disconnectedCallback();\n this.removeEventListener('click', this._onClick);\n }\n\n private _onClick = (event: MouseEvent) => {\n if (this.disabled) {\n event.preventDefault();\n event.stopImmediatePropagation();\n event.stopPropagation();\n }\n };\n\n render() {\n return html`\n <li\n role=\"option\"\n aria-selected=\"${this.selected}\"\n aria-disabled=\"${this.disabled}\"\n ?aria-hidden=\"${this.hidden}\"\n data-active=\"${this.active}\"\n data-value=\"${this.value}\"\n @click=\"${this._onClick}\"\n @mousedown=\"${(event: MouseEvent) => event.preventDefault()}\"\n part=\"option\"\n >\n ${this.includeCheckbox\n ? html`<input type=\"checkbox\" ?checked=${this.selected} role=\"presentation\" tabindex=\"-1\" part=\"checkbox\" />`\n : nothing}\n <span>\n <slot></slot>\n </span>\n </li>\n `;\n }\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'tt-option': TtOption;\n }\n}\n"]}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"styles.js","sourceRoot":"","sources":["../../../src/tt-option/styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAqExB,CAAC","sourcesContent":["import { css } from 'lit';\n\nexport const styles = css`\n li {\n cursor: pointer;\n display: flex;\n padding: 0.5rem;\n box-sizing: border-box;\n text-align: left;\n text-overflow: ellipsis;\n text-wrap: nowrap;\n align-items: center;\n gap: 0.25rem;\n max-width: 100%;\n width: 100%;\n overflow-y: visible;\n flex: 1;\n\n input[type='checkbox'] {\n width: var(--checkbox-size, var(--space-scale-2));\n aspect-ratio: 1;\n flex: 0 0 auto;\n accent-color: var(--color-primary-400);\n pointer-events: none;\n }\n\n span {\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n flex: 1;\n line-height: 1.1;\n }\n\n &[aria-hidden='true'] {\n visibility: hidden;\n display: none;\n }\n\n &[aria-disabled='true'] {\n pointer-events: none;\n opacity: 0.5;\n }\n\n &[aria-selected='true']:not(:has(input[type='checkbox'])) {\n color: var(--tt-combobox-option-selected-color, var(--color-primary-400));\n font-weight: var(--font-weight-medium);\n }\n }\n\n :host([active]),\n :host(:hover) {\n li {\n background-color: var(--tt-combobox-option-background-color-hover, var(--color-surface-300));\n color: var(--tt-combobox-option-color-hover, inherit);\n }\n\n &:first-child li {\n border-top-left-radius: var(--border-radius);\n border-top-right-radius: var(--border-radius);\n }\n\n &:last-child li {\n border-bottom-left-radius: var(--border-radius);\n border-bottom-right-radius: var(--border-radius);\n }\n }\n\n :host([disabled]) {\n pointer-events: none;\n }\n`;\n"]}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"tt-option.js","sourceRoot":"","sources":["../../../src/tt-option/tt-option.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,QAAQ,EAAE,MAAM,eAAe,CAAC;AAEzC,IAAI,OAAO,MAAM,KAAK,WAAW,EAAE,CAAC;IAClC,IAAI,CAAC,MAAM,CAAC,cAAc,CAAC,GAAG,CAAC,WAAW,CAAC,EAAE,CAAC;QAC5C,MAAM,CAAC,cAAc,CAAC,MAAM,CAAC,WAAW,EAAE,QAAQ,CAAC,CAAC;IACtD,CAAC;AACH,CAAC;AAED,OAAO,EAAE,QAAQ,EAAE,CAAC","sourcesContent":["import { TtOption } from './TtOption.js';\n\nif (typeof window !== 'undefined') {\n if (!window.customElements.get('tt-option')) {\n window.customElements.define('tt-option', TtOption);\n }\n}\n\nexport { TtOption };\n"]}
|
package/dist/src/types.js.map
DELETED
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"types.js","sourceRoot":"","sources":["../../src/types.ts"],"names":[],"mappings":"","sourcesContent":["import { TtCombobox } from './TtCombobox.js';\n\ninterface TtComboboxExternalAttributes {\n id?: string;\n placeholder?: string;\n disabled?: boolean;\n multiselect?: boolean;\n 'display-select-all'?: boolean;\n invalid?: boolean;\n 'open-upward'?: boolean;\n name?: string;\n required?: boolean;\n 'aria-labelledby'?: string;\n class?: string;\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'tt-combobox': TtCombobox;\n }\n\n namespace JSX {\n interface IntrinsicElements {\n 'tt-combobox': TtComboboxExternalAttributes & { style?: string };\n }\n }\n\n namespace React {\n namespace JSX {\n interface IntrinsicElements {\n 'tt-combobox': TtComboboxExternalAttributes & {\n ref?: React.Ref<unknown>;\n children?: React.ReactNode;\n style?: React.CSSProperties;\n };\n }\n }\n }\n}\n"]}
|
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
File without changes
|