npm - @xplor-education/core-stencil-components - Versions diffs - 2.1.0 → 3.1.1 - Mend

@xplor-education/core-stencil-components 2.1.0 → 3.1.1

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.

Files changed (318) hide show

package/dist/collection/components/xplor-autocomplete/xplor-autocomplete.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"xplor-autocomplete.js","sourceRoot":"","sources":["../../../src/components/xplor-autocomplete/xplor-autocomplete.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, Host, h, Prop, State, Event, EventEmitter, Element, Listen } from '@stencil/core';\n\nexport interface AutocompleteItem {\n label: string;\n value: any;\n disabled?: boolean;\n [key: string]: any;\n}\n\n@Component({\n tag: 'xplor-autocomplete',\n styleUrl: 'xplor-autocomplete.scss',\n scoped: true,\n})\nexport class XplorAutocomplete {\n @Element() el: HTMLElement;\n\n /*\n Array of items to display in the dropdown\n /\n @Prop() items: AutocompleteItem[] = [];\n\n /\n Selected value\n /\n @Prop({ mutable: true }) value: any = null;\n\n /\n Placeholder text\n /\n @Prop() placeholder: string = 'Search...';\n\n /\n Label for the input\n /\n @Prop() label: string;\n\n /\n Disable the autocomplete\n /\n @Prop() disabled: boolean = false;\n\n /\n Make the autocomplete readonly\n /\n @Prop() readonly: boolean = false;\n\n /\n Clear button\n /\n @Prop() clearable: boolean = false;\n\n /\n Allow multiple selection\n /\n @Prop() multiple: boolean = false;\n\n /\n Minimum characters to trigger search\n /\n @Prop() minSearchLength: number = 0;\n\n /\n Key to extract value from item objects\n /\n @Prop() itemValue: string = 'value';\n\n /\n Key to extract display text from item objects\n /\n @Prop() itemText: string = 'label';\n\n /\n Max width of the dropdown menu\n /\n @Prop() menuMaxWidth: string = '100%';\n\n /\n Custom render function for dropdown items\n /\n @Prop() renderItem: (item: AutocompleteItem) => any;\n\n /\n Custom render function for selected items (chips)\n */\n @Prop() renderSelection: (item: AutocompleteItem) => any;\n\n @State() isOpen: boolean = false;\n @State() searchQuery: string = '';\n @State() filteredItems: AutocompleteItem[] = [];\n @State() selectedItems: any[] = [];\n @State() highlightedIndex: number = -1;\n\n @Event() xplorChange: EventEmitter<any>;\n @Event() xplorSelect: EventEmitter<AutocompleteItem>;\n @Event() xplorClear: EventEmitter<void>;\n @Event() xplorSearch: EventEmitter<string>;\n\n private inputEl: HTMLInputElement;\n private dropdownEl: HTMLDivElement;\n\n private getItemValue(item: AutocompleteItem): any {\n return item[this.itemValue] !== undefined ? item[this.itemValue] : item.value;\n }\n\n private getItemText(item: AutocompleteItem): string {\n return item[this.itemText] !== undefined ? String(item[this.itemText]) : String(item.label);\n }\n\n componentWillLoad() {\n this.filterItems();\n if (this.value !== null) {\n if (this.multiple && Array.isArray(this.value)) {\n this.selectedItems = this.value;\n } else if (!this.multiple) {\n const selectedItem = this.items.find(item => this.getItemValue(item) === this.value);\n if (selectedItem) {\n this.searchQuery = this.getItemText(selectedItem);\n }\n }\n }\n }\n\n @Listen('click', { target: 'document' })\n handleDocumentClick(event: MouseEvent) {\n const target = event.target as Node;\n if (!this.el.contains(target)) {\n this.isOpen = false;\n }\n }\n\n private filterItems() {\n if (this.searchQuery.length < this.minSearchLength) {\n this.filteredItems = this.items;\n return;\n }\n\n const query = this.searchQuery.toLowerCase();\n this.filteredItems = this.items.filter(item =>\n this.getItemText(item).toLowerCase().includes(query)\n );\n }\n\n private handleInputFocus = () => {\n if (this.disabled \|\| this.readonly) return;\n this.isOpen = true;\n this.highlightedIndex = -1;\n };\n\n private handleInputChange = (event: Event) => {\n const input = event.target as HTMLInputElement;\n this.searchQuery = input.value;\n this.filterItems();\n this.isOpen = true;\n this.highlightedIndex = -1;\n this.xplorSearch.emit(this.searchQuery);\n\n if (!this.multiple && this.searchQuery === '') {\n this.value = null;\n this.xplorChange.emit(null);\n }\n };\n\n private handleInputKeyDown = (event: KeyboardEvent) => {\n if (this.disabled \|\| this.readonly) return;\n\n switch (event.key) {\n case 'ArrowDown':\n event.preventDefault();\n this.isOpen = true;\n this.highlightedIndex = Math.min(this.highlightedIndex + 1, this.filteredItems.length - 1);\n this.scrollToHighlighted();\n break;\n\n case 'ArrowUp':\n event.preventDefault();\n this.highlightedIndex = Math.max(this.highlightedIndex - 1, -1);\n this.scrollToHighlighted();\n break;\n\n case 'Enter':\n event.preventDefault();\n if (this.highlightedIndex >= 0 && this.highlightedIndex < this.filteredItems.length) {\n this.selectItem(this.filteredItems[this.highlightedIndex]);\n }\n break;\n\n case 'Escape':\n event.preventDefault();\n this.isOpen = false;\n this.inputEl?.blur();\n break;\n\n case 'Backspace':\n if (this.multiple && this.searchQuery === '' && this.selectedItems.length > 0) {\n event.preventDefault();\n this.removeItem(this.selectedItems[this.selectedItems.length - 1]);\n }\n break;\n }\n };\n\n private scrollToHighlighted() {\n if (this.dropdownEl && this.highlightedIndex >= 0) {\n const highlightedEl = this.dropdownEl.querySelector(`[data-index=\"${this.highlightedIndex}\"]`) as HTMLElement;\n if (highlightedEl) {\n highlightedEl.scrollIntoView({ block: 'nearest' });\n }\n }\n }\n\n private selectItem(item: AutocompleteItem) {\n if (item.disabled) return;\n\n const itemVal = this.getItemValue(item);\n\n if (this.multiple) {\n if (!this.selectedItems.includes(itemVal)) {\n this.selectedItems = [...this.selectedItems, itemVal];\n this.value = this.selectedItems;\n this.xplorChange.emit(this.value);\n }\n this.searchQuery = '';\n this.filterItems();\n } else {\n this.value = itemVal;\n this.searchQuery = this.getItemText(item);\n this.isOpen = false;\n this.xplorChange.emit(this.value);\n }\n\n this.xplorSelect.emit(item);\n this.inputEl?.focus();\n }\n\n private removeItem(value: any) {\n this.selectedItems = this.selectedItems.filter(v => v !== value);\n this.value = this.selectedItems;\n this.xplorChange.emit(this.value);\n }\n\n private handleClear = () => {\n this.value = this.multiple ? [] : null;\n this.selectedItems = [];\n this.searchQuery = '';\n this.filterItems();\n this.xplorChange.emit(this.value);\n this.xplorClear.emit();\n this.inputEl?.focus();\n };\n\n private getSelectedItemLabel(value: any): string {\n const item = this.items.find(i => this.getItemValue(i) === value);\n return item ? this.getItemText(item) : value;\n }\n\n private findItemByValue(value: any): AutocompleteItem \| undefined {\n return this.items.find(i => this.getItemValue(i) === value);\n }\n\n render() {\n const hasValue = this.multiple ? this.selectedItems.length > 0 : this.value !== null && this.searchQuery !== '';\n\n return (\n <Host>\n <div\n class={{\n 'autocomplete': true,\n 'autocomplete--disabled': this.disabled,\n 'autocomplete--readonly': this.readonly,\n 'autocomplete--open': this.isOpen,\n }}\n >\n {this.label && (\n <label class=\"autocomplete__label\">{this.label}</label>\n )}\n\n <div class=\"autocomplete__input-wrapper\">\n {this.multiple && this.selectedItems.length > 0 && (\n <div class=\"autocomplete__chips\">\n {this.selectedItems.map(value => {\n const item = this.findItemByValue(value);\n return (\n <div class=\"autocomplete__chip\">\n <span class=\"autocomplete__chip-label\">\n {this.renderSelection && item ? this.renderSelection(item) : this.getSelectedItemLabel(value)}\n </span>\n <button\n type=\"button\"\n class=\"autocomplete__chip-remove\"\n onClick={() => this.removeItem(value)}\n disabled={this.disabled \|\| this.readonly}\n >\n ×\n </button>\n </div>\n );\n })}\n </div>\n )}\n\n <input\n ref={(el) => (this.inputEl = el)}\n type=\"text\"\n class=\"autocomplete__input\"\n placeholder={this.placeholder}\n value={this.searchQuery}\n onFocus={this.handleInputFocus}\n onInput={this.handleInputChange}\n onKeyDown={this.handleInputKeyDown}\n disabled={this.disabled}\n readonly={this.readonly}\n autocomplete=\"off\"\n />\n\n <div class=\"autocomplete__actions\">\n {this.clearable && hasValue && !this.disabled && !this.readonly && (\n <button\n type=\"button\"\n class=\"autocomplete__clear\"\n onClick={this.handleClear}\n aria-label=\"Clear\"\n >\n ×\n </button>\n )}\n <span class=\"autocomplete__icon\">▼</span>\n </div>\n </div>\n\n {this.isOpen && this.filteredItems.length > 0 && (\n <div class=\"autocomplete__dropdown\" ref={(el) => (this.dropdownEl = el)} style={{ maxWidth: this.menuMaxWidth }}>\n {this.filteredItems.map((item, index) => {\n const itemVal = this.getItemValue(item);\n return (\n <div\n key={itemVal}\n data-index={index}\n class={{\n 'autocomplete__item': true,\n 'autocomplete__item--highlighted': index === this.highlightedIndex,\n 'autocomplete__item--selected': this.multiple\n ? this.selectedItems.includes(itemVal)\n : this.value === itemVal,\n 'autocomplete__item--disabled': item.disabled,\n }}\n onClick={() => this.selectItem(item)}\n >\n {this.renderItem ? this.renderItem(item) : this.getItemText(item)}\n </div>\n );\n })}\n </div>\n )}\n\n {this.isOpen && this.filteredItems.length === 0 && (\n <div class=\"autocomplete__dropdown\" style={{ maxWidth: this.menuMaxWidth }}>\n <div class=\"autocomplete__no-results\">No results found</div>\n </div>\n )}\n </div>\n </Host>\n );\n }\n}\n"]}
1	+ {"version":3,"file":"xplor-autocomplete.js","sourceRoot":"","sources":["../../../src/components/xplor-autocomplete/xplor-autocomplete.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, Host, h, Prop, State, Event, EventEmitter, Element, Listen } from '@stencil/core';\n\nexport interface AutocompleteItem {\n label: string;\n value: any;\n disabled?: boolean;\n [key: string]: any;\n}\n\n@Component({\n tag: 'xplor-autocomplete',\n styleUrl: 'xplor-autocomplete.scss',\n scoped: true,\n})\nexport class XplorAutocomplete {\n @Element() el: HTMLElement;\n\n /*\n Array of items to display in the dropdown\n /\n @Prop() items: AutocompleteItem[] = [];\n\n /\n Selected value\n /\n @Prop({ mutable: true }) value: any = null;\n\n /\n Placeholder text\n /\n @Prop() placeholder: string = 'Search...';\n\n /\n Label for the input\n /\n @Prop() label: string;\n\n /\n Accessible label for the input when no visible label is provided\n /\n @Prop() ariaLabel: string;\n\n /\n Disable the autocomplete\n /\n @Prop() disabled: boolean = false;\n\n /\n Make the autocomplete readonly\n /\n @Prop() readonly: boolean = false;\n\n /\n Clear button\n /\n @Prop() clearable: boolean = false;\n\n /\n Allow multiple selection\n /\n @Prop() multiple: boolean = false;\n\n /\n Minimum characters to trigger search\n /\n @Prop() minSearchLength: number = 0;\n\n /\n Key to extract value from item objects\n /\n @Prop() itemValue: string = 'value';\n\n /\n Key to extract display text from item objects\n /\n @Prop() itemText: string = 'label';\n\n /\n Max width of the dropdown menu\n /\n @Prop() menuMaxWidth: string = '100%';\n\n /\n Custom render function for dropdown items\n /\n @Prop() renderItem: (item: AutocompleteItem) => any;\n\n /\n Custom render function for selected items (chips)\n */\n @Prop() renderSelection: (item: AutocompleteItem) => any;\n\n @State() isOpen: boolean = false;\n @State() searchQuery: string = '';\n @State() filteredItems: AutocompleteItem[] = [];\n @State() selectedItems: any[] = [];\n @State() highlightedIndex: number = -1;\n\n @Event() xplorChange: EventEmitter<any>;\n @Event() xplorSelect: EventEmitter<AutocompleteItem>;\n @Event() xplorClear: EventEmitter<void>;\n @Event() xplorSearch: EventEmitter<string>;\n\n private inputEl: HTMLInputElement;\n private dropdownEl: HTMLDivElement;\n\n private getItemValue(item: AutocompleteItem): any {\n return item[this.itemValue] !== undefined ? item[this.itemValue] : item.value;\n }\n\n private getItemText(item: AutocompleteItem): string {\n return item[this.itemText] !== undefined ? String(item[this.itemText]) : String(item.label);\n }\n\n componentWillLoad() {\n this.filterItems();\n if (this.value !== null) {\n if (this.multiple && Array.isArray(this.value)) {\n this.selectedItems = this.value;\n } else if (!this.multiple) {\n const selectedItem = this.items.find(item => this.getItemValue(item) === this.value);\n if (selectedItem) {\n this.searchQuery = this.getItemText(selectedItem);\n }\n }\n }\n }\n\n @Listen('click', { target: 'document' })\n handleDocumentClick(event: MouseEvent) {\n const target = event.target as Node;\n if (!this.el.contains(target)) {\n this.isOpen = false;\n }\n }\n\n private filterItems() {\n if (this.searchQuery.length < this.minSearchLength) {\n this.filteredItems = this.items;\n return;\n }\n\n const query = this.searchQuery.toLowerCase();\n this.filteredItems = this.items.filter(item =>\n this.getItemText(item).toLowerCase().includes(query)\n );\n }\n\n private handleInputFocus = () => {\n if (this.disabled \|\| this.readonly) return;\n this.isOpen = true;\n this.highlightedIndex = -1;\n };\n\n private handleInputChange = (event: Event) => {\n const input = event.target as HTMLInputElement;\n this.searchQuery = input.value;\n this.filterItems();\n this.isOpen = true;\n this.highlightedIndex = -1;\n this.xplorSearch.emit(this.searchQuery);\n\n if (!this.multiple && this.searchQuery === '') {\n this.value = null;\n this.xplorChange.emit(null);\n }\n };\n\n private handleInputKeyDown = (event: KeyboardEvent) => {\n if (this.disabled \|\| this.readonly) return;\n\n switch (event.key) {\n case 'ArrowDown':\n event.preventDefault();\n this.isOpen = true;\n this.highlightedIndex = Math.min(this.highlightedIndex + 1, this.filteredItems.length - 1);\n this.scrollToHighlighted();\n break;\n\n case 'ArrowUp':\n event.preventDefault();\n this.highlightedIndex = Math.max(this.highlightedIndex - 1, -1);\n this.scrollToHighlighted();\n break;\n\n case 'Enter':\n event.preventDefault();\n if (this.highlightedIndex >= 0 && this.highlightedIndex < this.filteredItems.length) {\n this.selectItem(this.filteredItems[this.highlightedIndex]);\n }\n break;\n\n case 'Escape':\n event.preventDefault();\n this.isOpen = false;\n this.inputEl?.blur();\n break;\n\n case 'Backspace':\n if (this.multiple && this.searchQuery === '' && this.selectedItems.length > 0) {\n event.preventDefault();\n this.removeItem(this.selectedItems[this.selectedItems.length - 1]);\n }\n break;\n }\n };\n\n private scrollToHighlighted() {\n if (this.dropdownEl && this.highlightedIndex >= 0) {\n const highlightedEl = this.dropdownEl.querySelector(`[data-index=\"${this.highlightedIndex}\"]`) as HTMLElement;\n if (highlightedEl) {\n highlightedEl.scrollIntoView({ block: 'nearest' });\n }\n }\n }\n\n private selectItem(item: AutocompleteItem) {\n if (item.disabled) return;\n\n const itemVal = this.getItemValue(item);\n\n if (this.multiple) {\n if (!this.selectedItems.includes(itemVal)) {\n this.selectedItems = [...this.selectedItems, itemVal];\n this.value = this.selectedItems;\n this.xplorChange.emit(this.value);\n }\n this.searchQuery = '';\n this.filterItems();\n } else {\n this.value = itemVal;\n this.searchQuery = this.getItemText(item);\n this.isOpen = false;\n this.xplorChange.emit(this.value);\n }\n\n this.xplorSelect.emit(item);\n this.inputEl?.focus();\n }\n\n private removeItem(value: any) {\n this.selectedItems = this.selectedItems.filter(v => v !== value);\n this.value = this.selectedItems;\n this.xplorChange.emit(this.value);\n }\n\n private handleClear = () => {\n this.value = this.multiple ? [] : null;\n this.selectedItems = [];\n this.searchQuery = '';\n this.filterItems();\n this.xplorChange.emit(this.value);\n this.xplorClear.emit();\n this.inputEl?.focus();\n };\n\n private getSelectedItemLabel(value: any): string {\n const item = this.items.find(i => this.getItemValue(i) === value);\n return item ? this.getItemText(item) : value;\n }\n\n private findItemByValue(value: any): AutocompleteItem \| undefined {\n return this.items.find(i => this.getItemValue(i) === value);\n }\n\n render() {\n const hasValue = this.multiple ? this.selectedItems.length > 0 : this.value !== null && this.searchQuery !== '';\n const listboxId = 'autocomplete-listbox';\n const labelId = 'autocomplete-label';\n const activeDescendantId = this.highlightedIndex >= 0 ? `autocomplete-option-${this.highlightedIndex}` : undefined;\n\n return (\n <Host>\n <div\n class={{\n 'autocomplete': true,\n 'autocomplete--disabled': this.disabled,\n 'autocomplete--readonly': this.readonly,\n 'autocomplete--open': this.isOpen,\n }}\n >\n {this.label && (\n <label class=\"autocomplete__label\" id={labelId}>{this.label}</label>\n )}\n\n <div class=\"autocomplete__input-wrapper\">\n {this.multiple && this.selectedItems.length > 0 && (\n <div class=\"autocomplete__chips\">\n {this.selectedItems.map(value => {\n const item = this.findItemByValue(value);\n const chipLabel = this.getSelectedItemLabel(value);\n return (\n <div class=\"autocomplete__chip\">\n <span class=\"autocomplete__chip-label\">\n {this.renderSelection && item ? this.renderSelection(item) : chipLabel}\n </span>\n <button\n type=\"button\"\n class=\"autocomplete__chip-remove\"\n onClick={() => this.removeItem(value)}\n disabled={this.disabled \|\| this.readonly}\n aria-label={`Remove ${chipLabel}`}\n >\n ×\n </button>\n </div>\n );\n })}\n </div>\n )}\n\n <input\n ref={(el) => (this.inputEl = el)}\n type=\"text\"\n class=\"autocomplete__input\"\n placeholder={this.placeholder}\n value={this.searchQuery}\n onFocus={this.handleInputFocus}\n onInput={this.handleInputChange}\n onKeyDown={this.handleInputKeyDown}\n disabled={this.disabled}\n readonly={this.readonly}\n autocomplete=\"off\"\n role=\"combobox\"\n aria-expanded={this.isOpen ? 'true' : 'false'}\n aria-haspopup=\"listbox\"\n aria-controls={this.isOpen ? listboxId : undefined}\n aria-activedescendant={activeDescendantId}\n aria-labelledby={this.label ? labelId : undefined}\n aria-label={!this.label ? (this.ariaLabel \|\| this.placeholder) : undefined}\n aria-autocomplete=\"list\"\n />\n\n <div class=\"autocomplete__actions\">\n {this.clearable && hasValue && !this.disabled && !this.readonly && (\n <button\n type=\"button\"\n class=\"autocomplete__clear\"\n onClick={this.handleClear}\n aria-label=\"Clear selection\"\n >\n ×\n </button>\n )}\n <span class=\"autocomplete__icon\" aria-hidden=\"true\">▼</span>\n </div>\n </div>\n\n {this.isOpen && this.filteredItems.length > 0 && (\n <div\n class=\"autocomplete__dropdown\"\n ref={(el) => (this.dropdownEl = el)}\n style={{ maxWidth: this.menuMaxWidth }}\n role=\"listbox\"\n id={listboxId}\n aria-label={this.label \|\| this.ariaLabel \|\| 'Suggestions'}\n >\n {this.filteredItems.map((item, index) => {\n const itemVal = this.getItemValue(item);\n const isSelected = this.multiple\n ? this.selectedItems.includes(itemVal)\n : this.value === itemVal;\n return (\n <div\n key={itemVal}\n id={`autocomplete-option-${index}`}\n data-index={index}\n role=\"option\"\n aria-selected={isSelected ? 'true' : 'false'}\n aria-disabled={item.disabled ? 'true' : undefined}\n class={{\n 'autocomplete__item': true,\n 'autocomplete__item--highlighted': index === this.highlightedIndex,\n 'autocomplete__item--selected': isSelected,\n 'autocomplete__item--disabled': item.disabled,\n }}\n onClick={() => this.selectItem(item)}\n >\n {this.renderItem ? this.renderItem(item) : this.getItemText(item)}\n </div>\n );\n })}\n </div>\n )}\n\n {this.isOpen && this.filteredItems.length === 0 && (\n <div class=\"autocomplete__dropdown\" style={{ maxWidth: this.menuMaxWidth }} role=\"listbox\" id={listboxId}>\n <div class=\"autocomplete__no-results\" role=\"option\" aria-disabled=\"true\">No results found</div>\n </div>\n )}\n </div>\n </Host>\n );\n }\n}\n"]}

package/dist/collection/components/xplor-avatar/xplor-avatar.js CHANGED Viewed

@@ -10,8 +10,8 @@ export class XplorAvatar {
             className += ` xpl-avatar--${this.size}`;
         if (this.color)
             className += ` xpl-avatar--${this.color}`;
-        const inner = (h("div", { key: '2e2722f2649108b7fdc3fd51375e17ac47e6f1ff' }, this.src ? (h("img", { alt: this.name, src: this.src })) : (h("div", { class: "xpl-avatar__placeholder" }, h("slot", null))), this.status && h("div", { key: '1367e8fccd661b566d95cb1bf3a20467be7bc40f', class: `xpl-avatar__dot--${this.status}` })));
-        return (h(Host, { key: 'ac12deb4b322146d75c650ba0abe6d96c35efd67' }, this.href && !this.disabled ? (h("a", { href: this.href, class: className, target: this.target }, inner)) : this.href && this.disabled ? (h("div", { class: className + ' xpl-avatar--disabled' }, inner)) : (h("div", { class: className }, inner))));
+        const inner = (h("div", { key: '2e2722f2649108b7fdc3fd51375e17ac47e6f1ff' }, this.src ? (h("img", { alt: this.name, src: this.src })) : (h("div", { class: "xpl-avatar__placeholder" }, h("slot", null))), this.status && h("div", { key: '26fa57a9a697a110ef73434376715eda0e5134a5', class: `xpl-avatar__dot--${this.status}`, "aria-label": `Status: ${this.status}`, role: "img" })));
+        return (h(Host, { key: '9c99cec20679f0d10fbcf9dffc70877c0dc879f9' }, this.href && !this.disabled ? (h("a", { href: this.href, class: className, target: this.target }, inner)) : this.href && this.disabled ? (h("div", { class: className + ' xpl-avatar--disabled' }, inner)) : (h("div", { class: className }, inner))));
     }
     static get is() { return "xplor-avatar"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/xplor-avatar/xplor-avatar.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"xplor-avatar.js","sourceRoot":"","sources":["../../../src/components/xplor-avatar/xplor-avatar.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,IAAI,EAAE,CAAC,EAAE,IAAI,EAAE,MAAM,eAAe,CAAC;AAOzD,MAAM,OAAO,WAAW;IALxB;QAQE,mDAAmD;QAC3C,aAAQ,GAAa,KAAK,CAAC;KAiDpC;IAhCC,MAAM;QACJ,IAAI,SAAS,GAAG,YAAY,CAAC;QAC7B,IAAI,IAAI,CAAC,IAAI;YAAE,SAAS,IAAI,gBAAgB,IAAI,CAAC,IAAI,EAAE,CAAC;QACxD,IAAI,IAAI,CAAC,KAAK;YAAE,SAAS,IAAI,gBAAgB,IAAI,CAAC,KAAK,EAAE,CAAC;QAE1D,MAAM,KAAK,GAAG,CACZ;YACG,IAAI,CAAC,GAAG,CAAC,CAAC,CAAC,CACV,WAAK,GAAG,EAAE,IAAI,CAAC,IAAI,EAAE,GAAG,EAAE,IAAI,CAAC,GAAG,GAAI,CACvC,CAAC,CAAC,CAAC,CACF,WAAK,KAAK,EAAC,yBAAyB;gBAClC,eAAa,CACT,CACP;YACA,IAAI,CAAC,MAAM,IAAI,4DAAK,KAAK,EAAE,oBAAoB,IAAI,CAAC,MAAM,EAAE,~~GAAQ~~,~~CACjE~~,CACP,CAAC;QAEF,OAAO,CACL,EAAC,IAAI,uDACF,IAAI,CAAC,IAAI,IAAI,CAAC,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAC,CAC7B,SAAG,IAAI,EAAE,IAAI,CAAC,IAAI,EAAE,KAAK,EAAE,SAAS,EAAE,MAAM,EAAE,IAAI,CAAC,MAAM,IACtD,KAAK,CACJ,CACL,CAAC,CAAC,CAAC,IAAI,CAAC,IAAI,IAAI,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAC,CAC/B,WAAK,KAAK,EAAE,SAAS,GAAG,uBAAuB,IAAG,KAAK,CAAO,CAC/D,CAAC,CAAC,CAAC,CACF,WAAK,KAAK,EAAE,SAAS,IAAG,KAAK,CAAO,CACrC,CACI,CACR,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import { Component, Host, h, Prop } from '@stencil/core';\n\n@Component({\n tag: 'xplor-avatar',\n styleUrl: 'xplor-avatar.scss',\n shadow: true,\n})\nexport class XplorAvatar {\n /** Background color when there is no image src /\n @Prop() color?: 'green' \| 'yellow' \| 'pink' \| 'primary' \| 'secondary';\n // eslint-disable-next-line @stencil/required-jsdoc\n @Prop() disabled?: boolean = false;\n /* The URL if the avatar should be hyperlinked /\n @Prop() href?: string;\n /* Alt text for the image if there is an image src /\n @Prop() name?: string;\n /* Size of the avatar /\n @Prop() size?: 'md' \| 'sm';\n /* The image URL /\n @Prop() src?: string;\n /* Color styles for the dot indicator to indicate varied states /\n @Prop() status?: 'active' \| 'warning' \| 'inactive';\n /\n Where to open the URL chosen for the `href` prop:\n * `_self` (default), `_blank`, `_parent`, or `_top`\n */\n @Prop() target?: string;\n\n render() {\n let className = 'xpl-avatar';\n if (this.size) className += ` xpl-avatar--${this.size}`;\n if (this.color) className += ` xpl-avatar--${this.color}`;\n\n const inner = (\n <div>\n {this.src ? (\n <img alt={this.name} src={this.src} />\n ) : (\n <div class=\"xpl-avatar__placeholder\">\n <slot></slot>\n </div>\n )}\n {this.status && <div class={`xpl-avatar__dot--${this.status}`}></div>}\n </div>\n );\n\n return (\n <Host>\n {this.href && !this.disabled ? (\n <a href={this.href} class={className} target={this.target}>\n {inner}\n </a>\n ) : this.href && this.disabled ? (\n <div class={className + ' xpl-avatar--disabled'}>{inner}</div>\n ) : (\n <div class={className}>{inner}</div>\n )}\n </Host>\n );\n }\n}\n"]}
1	+ {"version":3,"file":"xplor-avatar.js","sourceRoot":"","sources":["../../../src/components/xplor-avatar/xplor-avatar.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,IAAI,EAAE,CAAC,EAAE,IAAI,EAAE,MAAM,eAAe,CAAC;AAOzD,MAAM,OAAO,WAAW;IALxB;QAQE,mDAAmD;QAC3C,aAAQ,GAAa,KAAK,CAAC;KAiDpC;IAhCC,MAAM;QACJ,IAAI,SAAS,GAAG,YAAY,CAAC;QAC7B,IAAI,IAAI,CAAC,IAAI;YAAE,SAAS,IAAI,gBAAgB,IAAI,CAAC,IAAI,EAAE,CAAC;QACxD,IAAI,IAAI,CAAC,KAAK;YAAE,SAAS,IAAI,gBAAgB,IAAI,CAAC,KAAK,EAAE,CAAC;QAE1D,MAAM,KAAK,GAAG,CACZ;YACG,IAAI,CAAC,GAAG,CAAC,CAAC,CAAC,CACV,WAAK,GAAG,EAAE,IAAI,CAAC,IAAI,EAAE,GAAG,EAAE,IAAI,CAAC,GAAG,GAAI,CACvC,CAAC,CAAC,CAAC,CACF,WAAK,KAAK,EAAC,yBAAyB;gBAClC,eAAa,CACT,CACP;YACA,IAAI,CAAC,MAAM,IAAI,4DAAK,KAAK,EAAE,oBAAoB,IAAI,CAAC,MAAM,EAAE,gBAAc,WAAW,IAAI,CAAC,MAAM,EAAE,EAAE,IAAI,EAAC,KAAK,GAAO,CAClH,CACP,CAAC;QAEF,OAAO,CACL,EAAC,IAAI,uDACF,IAAI,CAAC,IAAI,IAAI,CAAC,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAC,CAC7B,SAAG,IAAI,EAAE,IAAI,CAAC,IAAI,EAAE,KAAK,EAAE,SAAS,EAAE,MAAM,EAAE,IAAI,CAAC,MAAM,IACtD,KAAK,CACJ,CACL,CAAC,CAAC,CAAC,IAAI,CAAC,IAAI,IAAI,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAC,CAC/B,WAAK,KAAK,EAAE,SAAS,GAAG,uBAAuB,IAAG,KAAK,CAAO,CAC/D,CAAC,CAAC,CAAC,CACF,WAAK,KAAK,EAAE,SAAS,IAAG,KAAK,CAAO,CACrC,CACI,CACR,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import { Component, Host, h, Prop } from '@stencil/core';\n\n@Component({\n tag: 'xplor-avatar',\n styleUrl: 'xplor-avatar.scss',\n shadow: true,\n})\nexport class XplorAvatar {\n /** Background color when there is no image src /\n @Prop() color?: 'green' \| 'yellow' \| 'pink' \| 'primary' \| 'secondary';\n // eslint-disable-next-line @stencil/required-jsdoc\n @Prop() disabled?: boolean = false;\n /* The URL if the avatar should be hyperlinked /\n @Prop() href?: string;\n /* Alt text for the image if there is an image src /\n @Prop() name?: string;\n /* Size of the avatar /\n @Prop() size?: 'md' \| 'sm';\n /* The image URL /\n @Prop() src?: string;\n /* Color styles for the dot indicator to indicate varied states /\n @Prop() status?: 'active' \| 'warning' \| 'inactive';\n /\n Where to open the URL chosen for the `href` prop:\n * `_self` (default), `_blank`, `_parent`, or `_top`\n */\n @Prop() target?: string;\n\n render() {\n let className = 'xpl-avatar';\n if (this.size) className += ` xpl-avatar--${this.size}`;\n if (this.color) className += ` xpl-avatar--${this.color}`;\n\n const inner = (\n <div>\n {this.src ? (\n <img alt={this.name} src={this.src} />\n ) : (\n <div class=\"xpl-avatar__placeholder\">\n <slot></slot>\n </div>\n )}\n {this.status && <div class={`xpl-avatar__dot--${this.status}`} aria-label={`Status: ${this.status}`} role=\"img\"></div>}\n </div>\n );\n\n return (\n <Host>\n {this.href && !this.disabled ? (\n <a href={this.href} class={className} target={this.target}>\n {inner}\n </a>\n ) : this.href && this.disabled ? (\n <div class={className + ' xpl-avatar--disabled'}>{inner}</div>\n ) : (\n <div class={className}>{inner}</div>\n )}\n </Host>\n );\n }\n}\n"]}

package/dist/collection/components/xplor-badge-session-booking/xplor-badge-session-booking.js CHANGED Viewed

@@ -49,7 +49,7 @@ export class XplorBadgeSessionBooking {
                     "references": {
                         "Booking": {
                             "location": "local",
-                            "path": "/Users/darryn.lee-warden/Documents/DEV/xplor_design_system/apps/core-stencil-components/src/components/xplor-badge-session-booking/xplor-badge-session-booking.tsx",
+                            "path": "/Users/darrynlee-warden/Documents/DEV/xplor/xplor_design_system/apps/core-stencil-components/src/components/xplor-badge-session-booking/xplor-badge-session-booking.tsx",
                             "id": "src/components/xplor-badge-session-booking/xplor-badge-session-booking.tsx::Booking"
                         }
                     }
@@ -73,7 +73,7 @@ export class XplorBadgeSessionBooking {
                     "references": {
                         "BookingItem": {
                             "location": "local",
-                            "path": "/Users/darryn.lee-warden/Documents/DEV/xplor_design_system/apps/core-stencil-components/src/components/xplor-badge-session-booking/xplor-badge-session-booking.tsx",
+                            "path": "/Users/darrynlee-warden/Documents/DEV/xplor/xplor_design_system/apps/core-stencil-components/src/components/xplor-badge-session-booking/xplor-badge-session-booking.tsx",
                             "id": "src/components/xplor-badge-session-booking/xplor-badge-session-booking.tsx::BookingItem"
                         }
                     }

package/dist/collection/components/xplor-btn-back-to-parent/xplor-btn-back-to-parent.js CHANGED Viewed

@@ -21,6 +21,10 @@ export class XplorBtnBackToParent {
          * Visual variant
          */
         this.variant = 'tonal';
+        /**
+         * Accessible label for the button
+         */
+        this.ariaLabel = 'Back to parent';
         this.handleClick = () => {
             this.back.emit();
         };
@@ -33,7 +37,7 @@ export class XplorBtnBackToParent {
         const buttonStyles = {
             '--btn-size': this.size,
         };
-        return (h(Host, { key: '9ea4d137e9f4c80d0f5586953c5d463f365f5205' }, h("button", { key: '1e1839f03ca09a8a106a6f2ee2d7ca0a7b407588', class: buttonClasses, style: buttonStyles, onClick: this.handleClick }, h("span", { key: '50f7ee25b402d4ee796670ab59ad3c1085a0138d', class: "xplor-btn-back-to-parent__icon" }, "\u2715"))));
+        return (h(Host, { key: '0962b04ae634f044dd3e7c1eacf42b7d2c8e0f1e' }, h("button", { key: '82cb8fa3218a17784a0ab360d328b68f2c0e6e81', class: buttonClasses, style: buttonStyles, onClick: this.handleClick, "aria-label": this.ariaLabel }, h("span", { key: '784853baa5b013fc85a07054e446e6166eab7068', class: "xplor-btn-back-to-parent__icon" }, "\u2715"))));
     }
     static get is() { return "xplor-btn-back-to-parent"; }
     static get encapsulation() { return "scoped"; }
@@ -148,6 +152,26 @@ export class XplorBtnBackToParent {
                 "setter": false,
                 "reflect": false,
                 "defaultValue": "'tonal'"
+            },
+            "ariaLabel": {
+                "type": "string",
+                "attribute": "aria-label",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "Accessible label for the button"
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "defaultValue": "'Back to parent'"
             }
         };
     }

package/dist/collection/components/xplor-btn-back-to-parent/xplor-btn-back-to-parent.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"xplor-btn-back-to-parent.js","sourceRoot":"","sources":["../../../src/components/xplor-btn-back-to-parent/xplor-btn-back-to-parent.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,IAAI,EAAE,CAAC,EAAE,IAAI,EAAE,KAAK,EAAgB,MAAM,eAAe,CAAC;AAO9E,MAAM,OAAO,oBAAoB;IALjC;QAME;;WAEG;QACK,SAAI,GAAW,SAAS,CAAC;QAEjC;;WAEG;QACK,WAAM,GAAY,KAAK,CAAC;QAEhC;;WAEG;QACK,YAAO,GAAW,OAAO,CAAC;QAElC;;WAEG;QACK,UAAK,GAAW,WAAW,CAAC;QAEpC;;WAEG;QACK,YAAO,GAA+C,OAAO,CAAC;~~QAO9D~~,gBAAW,GAAG,GAAG,EAAE;YACzB,IAAI,CAAC,IAAI,CAAC,IAAI,EAAE,CAAC;QACnB,CAAC,CAAC;~~KAwBH~~;~~IAtBC~~,MAAM;QACJ,MAAM,aAAa,GAAG;YACpB,0BAA0B,EAAE,IAAI;YAChC,kCAAkC,EAAE,IAAI,CAAC,MAAM;SAChD,CAAC;QAEF,MAAM,YAAY,GAAG;YACnB,YAAY,EAAE,IAAI,CAAC,IAAI;SACxB,CAAC;QAEF,OAAO,CACL,EAAC,IAAI;YACH,+DACE,KAAK,EAAE,aAAa,EACpB,KAAK,EAAE,YAAY,EACnB,OAAO,EAAE,IAAI,CAAC,WAAW;~~gBAEzB~~,6DAAM,KAAK,EAAC,gCAAgC,aAAS,CAC9C,CACJ,CACR,CAAC;IACJ,CAAC~~;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;~~CACF","sourcesContent":["import { Component, Host, h, Prop, Event, EventEmitter } from '@stencil/core';\n\n@Component({\n tag: 'xplor-btn-back-to-parent',\n styleUrl: 'xplor-btn-back-to-parent.scss',\n scoped: true,\n})\nexport class XplorBtnBackToParent {\n /*\n Button size\n /\n @Prop() size: string = '2.25rem';\n\n /\n Whether to use inline (relative) positioning instead of absolute\n /\n @Prop() inline: boolean = false;\n\n /\n Background color\n /\n @Prop() bgColor: string = 'white';\n\n /\n Text/icon color\n /\n @Prop() color: string = 'secondary';\n\n /\n Visual variant\n /\n @Prop() variant: 'text' \| 'outlined' \| 'elevated' \| 'tonal' = 'tonal';\n\n /\n Back event (emitted on click)\n */\n @Event() back: EventEmitter<void>;\n\n private handleClick = () => {\n this.back.emit();\n };\n\n render() {\n const buttonClasses = {\n 'xplor-btn-back-to-parent': true,\n 'xplor-btn-back-to-parent--inline': this.inline,\n };\n\n const buttonStyles = {\n '--btn-size': this.size,\n };\n\n return (\n <Host>\n <button\n class={buttonClasses}\n style={buttonStyles}\n onClick={this.handleClick}\n >\n <span class=\"xplor-btn-back-to-parent__icon\">✕</span>\n </button>\n </Host>\n );\n }\n}\n"]}
1	+ {"version":3,"file":"xplor-btn-back-to-parent.js","sourceRoot":"","sources":["../../../src/components/xplor-btn-back-to-parent/xplor-btn-back-to-parent.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,IAAI,EAAE,CAAC,EAAE,IAAI,EAAE,KAAK,EAAgB,MAAM,eAAe,CAAC;AAO9E,MAAM,OAAO,oBAAoB;IALjC;QAME;;WAEG;QACK,SAAI,GAAW,SAAS,CAAC;QAEjC;;WAEG;QACK,WAAM,GAAY,KAAK,CAAC;QAEhC;;WAEG;QACK,YAAO,GAAW,OAAO,CAAC;QAElC;;WAEG;QACK,UAAK,GAAW,WAAW,CAAC;QAEpC;;WAEG;QACK,YAAO,GAA+C,OAAO,CAAC;QAEtE;;WAEG;QACK,cAAS,GAAW,gBAAgB,CAAC;QAOrC,gBAAW,GAAG,GAAG,EAAE;YACzB,IAAI,CAAC,IAAI,CAAC,IAAI,EAAE,CAAC;QACnB,CAAC,CAAC;KAyBH;IAvBC,MAAM;QACJ,MAAM,aAAa,GAAG;YACpB,0BAA0B,EAAE,IAAI;YAChC,kCAAkC,EAAE,IAAI,CAAC,MAAM;SAChD,CAAC;QAEF,MAAM,YAAY,GAAG;YACnB,YAAY,EAAE,IAAI,CAAC,IAAI;SACxB,CAAC;QAEF,OAAO,CACL,EAAC,IAAI;YACH,+DACE,KAAK,EAAE,aAAa,EACpB,KAAK,EAAE,YAAY,EACnB,OAAO,EAAE,IAAI,CAAC,WAAW,gBACb,IAAI,CAAC,SAAS;gBAE1B,6DAAM,KAAK,EAAC,gCAAgC,aAAS,CAC9C,CACJ,CACR,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import { Component, Host, h, Prop, Event, EventEmitter } from '@stencil/core';\n\n@Component({\n tag: 'xplor-btn-back-to-parent',\n styleUrl: 'xplor-btn-back-to-parent.scss',\n scoped: true,\n})\nexport class XplorBtnBackToParent {\n /*\n Button size\n /\n @Prop() size: string = '2.25rem';\n\n /\n Whether to use inline (relative) positioning instead of absolute\n /\n @Prop() inline: boolean = false;\n\n /\n Background color\n /\n @Prop() bgColor: string = 'white';\n\n /\n Text/icon color\n /\n @Prop() color: string = 'secondary';\n\n /\n Visual variant\n /\n @Prop() variant: 'text' \| 'outlined' \| 'elevated' \| 'tonal' = 'tonal';\n\n /\n Accessible label for the button\n /\n @Prop() ariaLabel: string = 'Back to parent';\n\n /\n Back event (emitted on click)\n */\n @Event() back: EventEmitter<void>;\n\n private handleClick = () => {\n this.back.emit();\n };\n\n render() {\n const buttonClasses = {\n 'xplor-btn-back-to-parent': true,\n 'xplor-btn-back-to-parent--inline': this.inline,\n };\n\n const buttonStyles = {\n '--btn-size': this.size,\n };\n\n return (\n <Host>\n <button\n class={buttonClasses}\n style={buttonStyles}\n onClick={this.handleClick}\n aria-label={this.ariaLabel}\n >\n <span class=\"xplor-btn-back-to-parent__icon\">✕</span>\n </button>\n </Host>\n );\n }\n}\n"]}

package/dist/collection/components/xplor-btn-icon/xplor-btn-icon.js CHANGED Viewed

@@ -38,7 +38,7 @@ export class XplorBtnIcon {
             '--btn-size': typeof this.size === 'number' ? `${this.size}px` : this.size,
             '--icon-size': typeof this.iconSize === 'number' ? `${this.iconSize}px` : this.iconSize,
         };
-        return (h(Host, { key: 'd5077956c7999278384896a9a7a6bc011a6c84fe' }, h("button", { key: '8c58f798cdfd47607c4d7275d1a1d3c63c34d96d', class: buttonClasses, style: buttonStyles, disabled: this.disabled, onClick: this.handleClick }, h("span", { key: 'b2da80152f63a20cd4c284103c344e1c95f76f10', class: "xplor-btn-icon__content" }, h("slot", { key: 'de99b1a981800af7c0639cb0d1188268a9a408e1' })))));
+        return (h(Host, { key: '9d87aab5e3af33201c71dffeab51a5a02cc61e98' }, h("button", { key: 'c30b8c4aa51a957c84e7fff3d72e01961dec911c', class: buttonClasses, style: buttonStyles, disabled: this.disabled, onClick: this.handleClick, "aria-label": this.ariaLabel }, h("span", { key: '99773527f599523638ce8463fe308826f01202cf', class: "xplor-btn-icon__content" }, h("slot", { key: '14e1356bcecd1d2b8768cddbaf257f49bf92e5a7' })))));
     }
     static get is() { return "xplor-btn-icon"; }
     static get encapsulation() { return "scoped"; }
@@ -153,6 +153,25 @@ export class XplorBtnIcon {
                 "setter": false,
                 "reflect": false,
                 "defaultValue": "false"
+            },
+            "ariaLabel": {
+                "type": "string",
+                "attribute": "aria-label",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "Accessible label for the icon button (required for screen readers)"
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false
             }
         };
     }

package/dist/collection/components/xplor-btn-icon/xplor-btn-icon.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"xplor-btn-icon.js","sourceRoot":"","sources":["../../../src/components/xplor-btn-icon/xplor-btn-icon.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,IAAI,EAAE,CAAC,EAAE,IAAI,EAAE,KAAK,EAAgB,MAAM,eAAe,CAAC;AAO9E,MAAM,OAAO,YAAY;IALzB;QAME;;WAEG;QACK,UAAK,GAAiD,WAAW,CAAC;QAE1E;;WAEG;QACK,SAAI,GAAoB,IAAI,CAAC;QAErC;;WAEG;QACK,aAAQ,GAAoB,IAAI,CAAC;QAEzC;;WAEG;QACK,YAAO,GAA+C,UAAU,CAAC;QAEzE;;WAEG;QACK,aAAQ,GAAY,KAAK,CAAC;~~QAO1B~~,gBAAW,GAAG,CAAC,KAAiB,EAAE,EAAE;YAC1C,IAAI,CAAC,IAAI,CAAC,QAAQ,EAAE,CAAC;gBACnB,IAAI,CAAC,UAAU,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;YAC9B,CAAC;QACH,CAAC,CAAC;~~KA8BH~~;~~IA5BC~~,MAAM;QACJ,MAAM,aAAa,GAAG;YACpB,gBAAgB,EAAE,IAAI;YACtB,CAAC,mBAAmB,IAAI,CAAC,KAAK,EAAE,CAAC,EAAE,IAAI;YACvC,CAAC,mBAAmB,IAAI,CAAC,OAAO,EAAE,CAAC,EAAE,IAAI;YACzC,0BAA0B,EAAE,IAAI,CAAC,QAAQ;SAC1C,CAAC;QAEF,MAAM,YAAY,GAAG;YACnB,YAAY,EAAE,OAAO,IAAI,CAAC,IAAI,KAAK,QAAQ,CAAC,CAAC,CAAC,GAAG,IAAI,CAAC,IAAI,IAAI,CAAC,CAAC,CAAC,IAAI,CAAC,IAAI;YAC1E,aAAa,EAAE,OAAO,IAAI,CAAC,QAAQ,KAAK,QAAQ,CAAC,CAAC,CAAC,GAAG,IAAI,CAAC,QAAQ,IAAI,CAAC,CAAC,CAAC,IAAI,CAAC,QAAQ;SACxF,CAAC;QAEF,OAAO,CACL,EAAC,IAAI;YACH,+DACE,KAAK,EAAE,aAAa,EACpB,KAAK,EAAE,YAAY,EACnB,QAAQ,EAAE,IAAI,CAAC,QAAQ,EACvB,OAAO,EAAE,IAAI,CAAC,WAAW;~~gBAEzB~~,6DAAM,KAAK,EAAC,yBAAyB;oBACnC,8DAAQ,CACH,CACA,CACJ,CACR,CAAC;IACJ,CAAC~~;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;~~CACF","sourcesContent":["import { Component, Host, h, Prop, Event, EventEmitter } from '@stencil/core';\n\n@Component({\n tag: 'xplor-btn-icon',\n styleUrl: 'xplor-btn-icon.scss',\n scoped: true,\n})\nexport class XplorBtnIcon {\n /*\n Button color variant\n /\n @Prop() color: 'primary' \| 'secondary' \| 'success' \| string = 'secondary';\n\n /\n Button size (can be pixel value like '32' or '48')\n /\n @Prop() size: string \| number = '32';\n\n /\n Icon size\n /\n @Prop() iconSize: string \| number = '18';\n\n /\n Visual variant\n /\n @Prop() variant: 'text' \| 'outlined' \| 'elevated' \| 'tonal' = 'elevated';\n\n /\n Whether the button is disabled\n /\n @Prop() disabled: boolean = false;\n\n /\n Click event\n */\n @Event() xplorClick: EventEmitter<MouseEvent>;\n\n private handleClick = (event: MouseEvent) => {\n if (!this.disabled) {\n this.xplorClick.emit(event);\n }\n };\n\n render() {\n const buttonClasses = {\n 'xplor-btn-icon': true,\n [`xplor-btn-icon--${this.color}`]: true,\n [`xplor-btn-icon--${this.variant}`]: true,\n 'xplor-btn-icon--disabled': this.disabled,\n };\n\n const buttonStyles = {\n '--btn-size': typeof this.size === 'number' ? `${this.size}px` : this.size,\n '--icon-size': typeof this.iconSize === 'number' ? `${this.iconSize}px` : this.iconSize,\n };\n\n return (\n <Host>\n <button\n class={buttonClasses}\n style={buttonStyles}\n disabled={this.disabled}\n onClick={this.handleClick}\n >\n <span class=\"xplor-btn-icon__content\">\n <slot />\n </span>\n </button>\n </Host>\n );\n }\n}\n"]}
1	+ {"version":3,"file":"xplor-btn-icon.js","sourceRoot":"","sources":["../../../src/components/xplor-btn-icon/xplor-btn-icon.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,IAAI,EAAE,CAAC,EAAE,IAAI,EAAE,KAAK,EAAgB,MAAM,eAAe,CAAC;AAO9E,MAAM,OAAO,YAAY;IALzB;QAME;;WAEG;QACK,UAAK,GAAiD,WAAW,CAAC;QAE1E;;WAEG;QACK,SAAI,GAAoB,IAAI,CAAC;QAErC;;WAEG;QACK,aAAQ,GAAoB,IAAI,CAAC;QAEzC;;WAEG;QACK,YAAO,GAA+C,UAAU,CAAC;QAEzE;;WAEG;QACK,aAAQ,GAAY,KAAK,CAAC;QAY1B,gBAAW,GAAG,CAAC,KAAiB,EAAE,EAAE;YAC1C,IAAI,CAAC,IAAI,CAAC,QAAQ,EAAE,CAAC;gBACnB,IAAI,CAAC,UAAU,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;YAC9B,CAAC;QACH,CAAC,CAAC;KA+BH;IA7BC,MAAM;QACJ,MAAM,aAAa,GAAG;YACpB,gBAAgB,EAAE,IAAI;YACtB,CAAC,mBAAmB,IAAI,CAAC,KAAK,EAAE,CAAC,EAAE,IAAI;YACvC,CAAC,mBAAmB,IAAI,CAAC,OAAO,EAAE,CAAC,EAAE,IAAI;YACzC,0BAA0B,EAAE,IAAI,CAAC,QAAQ;SAC1C,CAAC;QAEF,MAAM,YAAY,GAAG;YACnB,YAAY,EAAE,OAAO,IAAI,CAAC,IAAI,KAAK,QAAQ,CAAC,CAAC,CAAC,GAAG,IAAI,CAAC,IAAI,IAAI,CAAC,CAAC,CAAC,IAAI,CAAC,IAAI;YAC1E,aAAa,EAAE,OAAO,IAAI,CAAC,QAAQ,KAAK,QAAQ,CAAC,CAAC,CAAC,GAAG,IAAI,CAAC,QAAQ,IAAI,CAAC,CAAC,CAAC,IAAI,CAAC,QAAQ;SACxF,CAAC;QAEF,OAAO,CACL,EAAC,IAAI;YACH,+DACE,KAAK,EAAE,aAAa,EACpB,KAAK,EAAE,YAAY,EACnB,QAAQ,EAAE,IAAI,CAAC,QAAQ,EACvB,OAAO,EAAE,IAAI,CAAC,WAAW,gBACb,IAAI,CAAC,SAAS;gBAE1B,6DAAM,KAAK,EAAC,yBAAyB;oBACnC,8DAAQ,CACH,CACA,CACJ,CACR,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import { Component, Host, h, Prop, Event, EventEmitter } from '@stencil/core';\n\n@Component({\n tag: 'xplor-btn-icon',\n styleUrl: 'xplor-btn-icon.scss',\n scoped: true,\n})\nexport class XplorBtnIcon {\n /*\n Button color variant\n /\n @Prop() color: 'primary' \| 'secondary' \| 'success' \| string = 'secondary';\n\n /\n Button size (can be pixel value like '32' or '48')\n /\n @Prop() size: string \| number = '32';\n\n /\n Icon size\n /\n @Prop() iconSize: string \| number = '18';\n\n /\n Visual variant\n /\n @Prop() variant: 'text' \| 'outlined' \| 'elevated' \| 'tonal' = 'elevated';\n\n /\n Whether the button is disabled\n /\n @Prop() disabled: boolean = false;\n\n /\n Accessible label for the icon button (required for screen readers)\n /\n @Prop() ariaLabel: string;\n\n /\n Click event\n */\n @Event() xplorClick: EventEmitter<MouseEvent>;\n\n private handleClick = (event: MouseEvent) => {\n if (!this.disabled) {\n this.xplorClick.emit(event);\n }\n };\n\n render() {\n const buttonClasses = {\n 'xplor-btn-icon': true,\n [`xplor-btn-icon--${this.color}`]: true,\n [`xplor-btn-icon--${this.variant}`]: true,\n 'xplor-btn-icon--disabled': this.disabled,\n };\n\n const buttonStyles = {\n '--btn-size': typeof this.size === 'number' ? `${this.size}px` : this.size,\n '--icon-size': typeof this.iconSize === 'number' ? `${this.iconSize}px` : this.iconSize,\n };\n\n return (\n <Host>\n <button\n class={buttonClasses}\n style={buttonStyles}\n disabled={this.disabled}\n onClick={this.handleClick}\n aria-label={this.ariaLabel}\n >\n <span class=\"xplor-btn-icon__content\">\n <slot />\n </span>\n </button>\n </Host>\n );\n }\n}\n"]}

package/dist/collection/components/xplor-btn-menu/xplor-btn-menu.js CHANGED Viewed

@@ -29,6 +29,10 @@ export class XplorBtnMenu {
          * Whether the menu is open
          */
         this.show = false;
+        /**
+         * Index of the currently focused menu item for keyboard navigation
+         */
+        this.focusedIndex = -1;
         this.handleOutsideClick = (event) => {
             if (this.menuRef && !this.menuRef.contains(event.target)) {
                 this.show = false;
@@ -36,10 +40,16 @@ export class XplorBtnMenu {
         };
         this.toggleMenu = () => {
             this.show = !this.show;
+            if (!this.show) {
+                this.focusedIndex = -1;
+            }
         };
         this.handleClickOption = (option) => {
+            var _a;
             this.xplorClick.emit(option);
             this.show = false;
+            this.focusedIndex = -1;
+            (_a = this.triggerBtnRef) === null || _a === void 0 ? void 0 : _a.focus();
         };
         this.isHidden = (key) => {
             return key !== null && this.hiddenKeys.includes(key);
@@ -54,16 +64,100 @@ export class XplorBtnMenu {
     disconnectedCallback() {
         document.removeEventListener('click', this.handleOutsideClick);
     }
+    /**
+     * Returns the list of visible (non-hidden) options for keyboard navigation
+     */
+    getVisibleOptions() {
+        return this.options
+            .map((option, index) => ({ option, key: option.key || String(index) }))
+            .filter(({ key }) => !this.isHidden(key));
+    }
+    /**
+     * Focuses the menu item at the given index in the visible options list
+     */
+    focusMenuItem(index) {
+        if (this.menuRef) {
+            const items = this.menuRef.querySelectorAll('[role="menuitem"]');
+            if (items[index]) {
+                items[index].focus();
+            }
+        }
+    }
+    handleKeyDown(event) {
+        var _a, _b;
+        if (!this.show && (event.key === 'ArrowDown' || event.key === 'Enter' || event.key === ' ')) {
+            const target = event.target;
+            if (target === this.triggerBtnRef || ((_a = this.el.querySelector('[slot="activator"]')) === null || _a === void 0 ? void 0 : _a.contains(target))) {
+                if (event.key === 'ArrowDown') {
+                    event.preventDefault();
+                    this.show = true;
+                    this.focusedIndex = 0;
+                    requestAnimationFrame(() => this.focusMenuItem(0));
+                }
+            }
+            return;
+        }
+        if (!this.show)
+            return;
+        const visibleOptions = this.getVisibleOptions();
+        const totalVisible = visibleOptions.length;
+        switch (event.key) {
+            case 'ArrowDown':
+                event.preventDefault();
+                this.focusedIndex = this.focusedIndex < totalVisible - 1 ? this.focusedIndex + 1 : 0;
+                this.focusMenuItem(this.focusedIndex);
+                break;
+            case 'ArrowUp':
+                event.preventDefault();
+                this.focusedIndex = this.focusedIndex > 0 ? this.focusedIndex - 1 : totalVisible - 1;
+                this.focusMenuItem(this.focusedIndex);
+                break;
+            case 'Escape':
+                event.preventDefault();
+                this.show = false;
+                this.focusedIndex = -1;
+                (_b = this.triggerBtnRef) === null || _b === void 0 ? void 0 : _b.focus();
+                break;
+            case 'Enter':
+            case ' ':
+                event.preventDefault();
+                if (this.focusedIndex >= 0 && this.focusedIndex < totalVisible) {
+                    const { option, key } = visibleOptions[this.focusedIndex];
+                    if (!this.isDisabled(key)) {
+                        this.handleClickOption(option);
+                    }
+                }
+                break;
+            case 'Home':
+                event.preventDefault();
+                this.focusedIndex = 0;
+                this.focusMenuItem(this.focusedIndex);
+                break;
+            case 'End':
+                event.preventDefault();
+                this.focusedIndex = totalVisible - 1;
+                this.focusMenuItem(this.focusedIndex);
+                break;
+            case 'Tab':
+                this.show = false;
+                this.focusedIndex = -1;
+                break;
+        }
+    }
     render() {
-        return (h(Host, { key: '3e9516c7c2b31794bf8d71eb5672e46d3210dbc8' }, h("div", { key: 'e030d7ab1b7eee7fc8de9a6a519c69c285d01529', class: "xplor-btn-menu", ref: (el) => (this.menuRef = el) }, h("slot", { key: '185cb5433a18d51ea7e2f9b9309f7570050fdcea', name: "activator" }, h("button", { key: 'de5afd1f3e58b56301ea75724f0f1a5e04697f39', class: "xplor-btn-menu__button", onClick: this.toggleMenu }, h("span", { key: '73eaed41e0a754d06753f0fa30ef32864f2841f8' }, this.label), h("span", { key: '63bc890fe97154d02eb4da50e689f1db5226870f', class: "xplor-btn-menu__icon" }, "\u25BC"))), this.show && (h("div", { key: '6f231d7e1feac5dca59c9ef03d45dcfeffcedcbf', class: "xplor-btn-menu__list" }, this.options.map((option, index) => {
+        const menuId = 'xplor-btn-menu-list';
+        let visibleIndex = 0;
+        return (h(Host, { key: '20b1a4d54b992d5ea4b1a4cd8fbaa5699b1bc6ab' }, h("div", { key: 'e23725f6fa432e19b59a3c0809706df45df02def', class: "xplor-btn-menu", ref: (el) => (this.menuRef = el) }, h("slot", { key: 'ed385faab26b9a1bf83ed583261b0d22744a5b10', name: "activator" }, h("button", { key: 'f0539b0092489e356b087cddd67bfb84cb31acf8', ref: (el) => (this.triggerBtnRef = el), class: "xplor-btn-menu__button", onClick: this.toggleMenu, "aria-haspopup": "menu", "aria-expanded": this.show ? 'true' : 'false', "aria-controls": this.show ? menuId : undefined, "aria-label": this.ariaLabel || this.label || 'Menu' }, h("span", { key: 'b1126eb8ffc12a89b3dd1a83afd5f644226496ee' }, this.label), h("span", { key: 'f9053a73065841d35278612e8f9d5345b3e1daf4', class: "xplor-btn-menu__icon", "aria-hidden": "true" }, "\u25BC"))), this.show && (h("div", { key: '7b294e8b3702051c2adc317736d9bb3085137f27', class: "xplor-btn-menu__list", role: "menu", id: menuId, "aria-label": this.ariaLabel || this.label || 'Menu' }, this.options.map((option, index) => {
             const key = option.key || String(index);
             if (this.isHidden(key)) {
                 return null;
             }
-            return (h("div", { key: key, class: {
+            const disabled = this.isDisabled(key);
+            const currentVisibleIndex = visibleIndex++;
+            return (h("div", { key: key, role: "menuitem", tabindex: currentVisibleIndex === this.focusedIndex ? 0 : -1, "aria-disabled": disabled ? 'true' : undefined, class: {
                     'xplor-btn-menu__item': true,
-                    'xplor-btn-menu__item--disabled': this.isDisabled(key),
-                }, onClick: () => !this.isDisabled(key) && this.handleClickOption(option) }, h("slot", { name: key }, option.label || '')));
+                    'xplor-btn-menu__item--disabled': disabled,
+                }, onClick: () => !disabled && this.handleClickOption(option) }, h("slot", { name: key }, option.label || '')));
         }))))));
     }
     static get is() { return "xplor-btn-menu"; }
@@ -80,6 +174,25 @@ export class XplorBtnMenu {
     }
     static get properties() {
         return {
+            "ariaLabel": {
+                "type": "string",
+                "attribute": "aria-label",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "Accessible label for the menu trigger button when no visible label is provided"
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false
+            },
             "label": {
                 "type": "string",
                 "attribute": "label",
@@ -110,7 +223,7 @@ export class XplorBtnMenu {
                     "references": {
                         "MenuOption": {
                             "location": "local",
-                            "path": "/Users/darryn.lee-warden/Documents/DEV/xplor_design_system/apps/core-stencil-components/src/components/xplor-btn-menu/xplor-btn-menu.tsx",
+                            "path": "/Users/darrynlee-warden/Documents/DEV/xplor/xplor_design_system/apps/core-stencil-components/src/components/xplor-btn-menu/xplor-btn-menu.tsx",
                             "id": "src/components/xplor-btn-menu/xplor-btn-menu.tsx::MenuOption"
                         }
                     }
@@ -207,7 +320,8 @@ export class XplorBtnMenu {
     }
     static get states() {
         return {
-            "show": {}
+            "show": {},
+            "focusedIndex": {}
         };
     }
     static get events() {
@@ -227,12 +341,22 @@ export class XplorBtnMenu {
                     "references": {
                         "MenuOption": {
                             "location": "local",
-                            "path": "/Users/darryn.lee-warden/Documents/DEV/xplor_design_system/apps/core-stencil-components/src/components/xplor-btn-menu/xplor-btn-menu.tsx",
+                            "path": "/Users/darrynlee-warden/Documents/DEV/xplor/xplor_design_system/apps/core-stencil-components/src/components/xplor-btn-menu/xplor-btn-menu.tsx",
                             "id": "src/components/xplor-btn-menu/xplor-btn-menu.tsx::MenuOption"
                         }
                     }
                 }
             }];
     }
+    static get elementRef() { return "el"; }
+    static get listeners() {
+        return [{
+                "name": "keydown",
+                "method": "handleKeyDown",
+                "target": undefined,
+                "capture": false,
+                "passive": false
+            }];
+    }
 }
 //# sourceMappingURL=xplor-btn-menu.js.map

package/dist/collection/components/xplor-btn-menu/xplor-btn-menu.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"xplor-btn-menu.js","sourceRoot":"","sources":["../../../src/components/xplor-btn-menu/xplor-btn-menu.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, Host, h, Prop, State, Event, EventEmitter } from '@stencil/core';\n\nexport interface MenuOption {\n key?: string;\n label: string;\n [key: string]: any;\n}\n\n@Component({\n tag: 'xplor-btn-menu',\n styleUrl: 'xplor-btn-menu.scss',\n scoped: true,\n})\nexport class XplorBtnMenu {\n /*\n Button label\n /\n @Prop() label: string = '';\n\n /\n Menu options\n /\n @Prop() options: MenuOption[] = [];\n\n /\n Hidden option keys\n /\n @Prop() hiddenKeys: string[] = [];\n\n /\n Disabled option keys\n /\n @Prop() disabledKeys: string[] = [];\n\n /\n Button color\n /\n @Prop() color: string = 'secondary';\n\n /\n Button density (compact, default, comfortable)\n /\n @Prop() density: string = 'default';\n\n /\n Whether the menu is open\n /\n @State() show: boolean = false;\n\n /\n Click event - emits the clicked option\n */\n @Event() xplorClick: EventEmitter<MenuOption>;\n\n private menuRef: HTMLDivElement;\n\n componentDidLoad() {\n document.addEventListener('click', this.handleOutsideClick);\n }\n\n disconnectedCallback() {\n document.removeEventListener('click', this.handleOutsideClick);\n }\n\n private handleOutsideClick = (event: MouseEvent) => {\n if (this.menuRef && !this.menuRef.contains(event.target as Node)) {\n this.show = false;\n }\n };\n\n private toggleMenu = () => {\n this.show = !this.show;\n };\n\n private handleClickOption = (option: MenuOption) => {\n this.xplorClick.emit(option);\n this.show = false;\n };\n\n private isHidden = (key: string \| null): boolean => {\n return key !== null && this.hiddenKeys.includes(key);\n };\n\n private isDisabled = (key: string \| null): boolean => {\n return key !== null && this.disabledKeys.includes(key);\n };\n\n render() {\n return (\n <Host>\n <div class=\"xplor-btn-menu\" ref={(el) => (this.menuRef = el)}>\n <slot name=\"activator\">\n <button\n class=\"xplor-btn-menu__button\"\n onClick={this.toggleMenu}\n >\n <span>{this.label}</span>\n <span class=\"xplor-btn-menu__icon\">▼</span>\n </button>\n </slot>\n\n {this.show && (\n <div class=\"xplor-btn-menu__list\">\n {this.options.map((option, index) => {\n const key = option.key \|\| String(index);\n if (this.isHidden(key)) {\n return null;\n }\n\n return (\n <div\n key={key}\n class={{\n 'xplor-btn-menu__item': true,\n 'xplor-btn-menu__item--disabled': this.isDisabled(key),\n }}\n onClick={() => !this.isDisabled(key) && this.handleClickOption(option)}\n >\n <slot name={key}>{option.label \|\| ''}</slot>\n </div>\n );\n })}\n </div>\n )}\n </div>\n </Host>\n );\n }\n}\n"]}
1	+ {"version":3,"file":"xplor-btn-menu.js","sourceRoot":"","sources":["../../../src/components/xplor-btn-menu/xplor-btn-menu.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,IAAI,EAAE,CAAC,EAAE,IAAI,EAAE,KAAK,EAAE,KAAK,EAAgB,OAAO,EAAE,MAAM,EAAE,MAAM,eAAe,CAAC;AAatG,MAAM,OAAO,YAAY;IALzB;QAaE;;WAEG;QACK,UAAK,GAAW,EAAE,CAAC;QAE3B;;WAEG;QACK,YAAO,GAAiB,EAAE,CAAC;QAEnC;;WAEG;QACK,eAAU,GAAa,EAAE,CAAC;QAElC;;WAEG;QACK,iBAAY,GAAa,EAAE,CAAC;QAEpC;;WAEG;QACK,UAAK,GAAW,WAAW,CAAC;QAEpC;;WAEG;QACK,YAAO,GAAW,SAAS,CAAC;QAEpC;;WAEG;QACM,SAAI,GAAY,KAAK,CAAC;QAE/B;;WAEG;QACM,iBAAY,GAAW,CAAC,CAAC,CAAC;QAkB3B,uBAAkB,GAAG,CAAC,KAAiB,EAAE,EAAE;YACjD,IAAI,IAAI,CAAC,OAAO,IAAI,CAAC,IAAI,CAAC,OAAO,CAAC,QAAQ,CAAC,KAAK,CAAC,MAAc,CAAC,EAAE,CAAC;gBACjE,IAAI,CAAC,IAAI,GAAG,KAAK,CAAC;YACpB,CAAC;QACH,CAAC,CAAC;QAEM,eAAU,GAAG,GAAG,EAAE;YACxB,IAAI,CAAC,IAAI,GAAG,CAAC,IAAI,CAAC,IAAI,CAAC;YACvB,IAAI,CAAC,IAAI,CAAC,IAAI,EAAE,CAAC;gBACf,IAAI,CAAC,YAAY,GAAG,CAAC,CAAC,CAAC;YACzB,CAAC;QACH,CAAC,CAAC;QAEM,sBAAiB,GAAG,CAAC,MAAkB,EAAE,EAAE;;YACjD,IAAI,CAAC,UAAU,CAAC,IAAI,CAAC,MAAM,CAAC,CAAC;YAC7B,IAAI,CAAC,IAAI,GAAG,KAAK,CAAC;YAClB,IAAI,CAAC,YAAY,GAAG,CAAC,CAAC,CAAC;YACvB,MAAA,IAAI,CAAC,aAAa,0CAAE,KAAK,EAAE,CAAC;QAC9B,CAAC,CAAC;QA6FM,aAAQ,GAAG,CAAC,GAAkB,EAAW,EAAE;YACjD,OAAO,GAAG,KAAK,IAAI,IAAI,IAAI,CAAC,UAAU,CAAC,QAAQ,CAAC,GAAG,CAAC,CAAC;QACvD,CAAC,CAAC;QAEM,eAAU,GAAG,CAAC,GAAkB,EAAW,EAAE;YACnD,OAAO,GAAG,KAAK,IAAI,IAAI,IAAI,CAAC,YAAY,CAAC,QAAQ,CAAC,GAAG,CAAC,CAAC;QACzD,CAAC,CAAC;KAyDH;IAtLC,gBAAgB;QACd,QAAQ,CAAC,gBAAgB,CAAC,OAAO,EAAE,IAAI,CAAC,kBAAkB,CAAC,CAAC;IAC9D,CAAC;IAED,oBAAoB;QAClB,QAAQ,CAAC,mBAAmB,CAAC,OAAO,EAAE,IAAI,CAAC,kBAAkB,CAAC,CAAC;IACjE,CAAC;IAsBD;;OAEG;IACK,iBAAiB;QACvB,OAAO,IAAI,CAAC,OAAO;aAChB,GAAG,CAAC,CAAC,MAAM,EAAE,KAAK,EAAE,EAAE,CAAC,CAAC,EAAE,MAAM,EAAE,GAAG,EAAE,MAAM,CAAC,GAAG,IAAI,MAAM,CAAC,KAAK,CAAC,EAAE,CAAC,CAAC;aACtE,MAAM,CAAC,CAAC,EAAE,GAAG,EAAE,EAAE,EAAE,CAAC,CAAC,IAAI,CAAC,QAAQ,CAAC,GAAG,CAAC,CAAC,CAAC;IAC9C,CAAC;IAED;;OAEG;IACK,aAAa,CAAC,KAAa;QACjC,IAAI,IAAI,CAAC,OAAO,EAAE,CAAC;YACjB,MAAM,KAAK,GAAG,IAAI,CAAC,OAAO,CAAC,gBAAgB,CAAC,mBAAmB,CAAC,CAAC;YACjE,IAAI,KAAK,CAAC,KAAK,CAAC,EAAE,CAAC;gBAChB,KAAK,CAAC,KAAK,CAAiB,CAAC,KAAK,EAAE,CAAC;YACxC,CAAC;QACH,CAAC;IACH,CAAC;IAGD,aAAa,CAAC,KAAoB;;QAChC,IAAI,CAAC,IAAI,CAAC,IAAI,IAAI,CAAC,KAAK,CAAC,GAAG,KAAK,WAAW,IAAI,KAAK,CAAC,GAAG,KAAK,OAAO,IAAI,KAAK,CAAC,GAAG,KAAK,GAAG,CAAC,EAAE,CAAC;YAC5F,MAAM,MAAM,GAAG,KAAK,CAAC,MAAqB,CAAC;YAC3C,IAAI,MAAM,KAAK,IAAI,CAAC,aAAa,KAAI,MAAA,IAAI,CAAC,EAAE,CAAC,aAAa,CAAC,oBAAoB,CAAC,0CAAE,QAAQ,CAAC,MAAM,CAAC,CAAA,EAAE,CAAC;gBACnG,IAAI,KAAK,CAAC,GAAG,KAAK,WAAW,EAAE,CAAC;oBAC9B,KAAK,CAAC,cAAc,EAAE,CAAC;oBACvB,IAAI,CAAC,IAAI,GAAG,IAAI,CAAC;oBACjB,IAAI,CAAC,YAAY,GAAG,CAAC,CAAC;oBACtB,qBAAqB,CAAC,GAAG,EAAE,CAAC,IAAI,CAAC,aAAa,CAAC,CAAC,CAAC,CAAC,CAAC;gBACrD,CAAC;YACH,CAAC;YACD,OAAO;QACT,CAAC;QAED,IAAI,CAAC,IAAI,CAAC,IAAI;YAAE,OAAO;QAEvB,MAAM,cAAc,GAAG,IAAI,CAAC,iBAAiB,EAAE,CAAC;QAChD,MAAM,YAAY,GAAG,cAAc,CAAC,MAAM,CAAC;QAE3C,QAAQ,KAAK,CAAC,GAAG,EAAE,CAAC;YAClB,KAAK,WAAW;gBACd,KAAK,CAAC,cAAc,EAAE,CAAC;gBACvB,IAAI,CAAC,YAAY,GAAG,IAAI,CAAC,YAAY,GAAG,YAAY,GAAG,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC,YAAY,GAAG,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC;gBACrF,IAAI,CAAC,aAAa,CAAC,IAAI,CAAC,YAAY,CAAC,CAAC;gBACtC,MAAM;YAER,KAAK,SAAS;gBACZ,KAAK,CAAC,cAAc,EAAE,CAAC;gBACvB,IAAI,CAAC,YAAY,GAAG,IAAI,CAAC,YAAY,GAAG,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC,YAAY,GAAG,CAAC,CAAC,CAAC,CAAC,YAAY,GAAG,CAAC,CAAC;gBACrF,IAAI,CAAC,aAAa,CAAC,IAAI,CAAC,YAAY,CAAC,CAAC;gBACtC,MAAM;YAER,KAAK,QAAQ;gBACX,KAAK,CAAC,cAAc,EAAE,CAAC;gBACvB,IAAI,CAAC,IAAI,GAAG,KAAK,CAAC;gBAClB,IAAI,CAAC,YAAY,GAAG,CAAC,CAAC,CAAC;gBACvB,MAAA,IAAI,CAAC,aAAa,0CAAE,KAAK,EAAE,CAAC;gBAC5B,MAAM;YAER,KAAK,OAAO,CAAC;YACb,KAAK,GAAG;gBACN,KAAK,CAAC,cAAc,EAAE,CAAC;gBACvB,IAAI,IAAI,CAAC,YAAY,IAAI,CAAC,IAAI,IAAI,CAAC,YAAY,GAAG,YAAY,EAAE,CAAC;oBAC/D,MAAM,EAAE,MAAM,EAAE,GAAG,EAAE,GAAG,cAAc,CAAC,IAAI,CAAC,YAAY,CAAC,CAAC;oBAC1D,IAAI,CAAC,IAAI,CAAC,UAAU,CAAC,GAAG,CAAC,EAAE,CAAC;wBAC1B,IAAI,CAAC,iBAAiB,CAAC,MAAM,CAAC,CAAC;oBACjC,CAAC;gBACH,CAAC;gBACD,MAAM;YAER,KAAK,MAAM;gBACT,KAAK,CAAC,cAAc,EAAE,CAAC;gBACvB,IAAI,CAAC,YAAY,GAAG,CAAC,CAAC;gBACtB,IAAI,CAAC,aAAa,CAAC,IAAI,CAAC,YAAY,CAAC,CAAC;gBACtC,MAAM;YAER,KAAK,KAAK;gBACR,KAAK,CAAC,cAAc,EAAE,CAAC;gBACvB,IAAI,CAAC,YAAY,GAAG,YAAY,GAAG,CAAC,CAAC;gBACrC,IAAI,CAAC,aAAa,CAAC,IAAI,CAAC,YAAY,CAAC,CAAC;gBACtC,MAAM;YAER,KAAK,KAAK;gBACR,IAAI,CAAC,IAAI,GAAG,KAAK,CAAC;gBAClB,IAAI,CAAC,YAAY,GAAG,CAAC,CAAC,CAAC;gBACvB,MAAM;QACV,CAAC;IACH,CAAC;IAUD,MAAM;QACJ,MAAM,MAAM,GAAG,qBAAqB,CAAC;QACrC,IAAI,YAAY,GAAG,CAAC,CAAC;QAErB,OAAO,CACL,EAAC,IAAI;YACH,4DAAK,KAAK,EAAC,gBAAgB,EAAC,GAAG,EAAE,CAAC,EAAE,EAAE,EAAE,CAAC,CAAC,IAAI,CAAC,OAAO,GAAG,EAAE,CAAC;gBAC1D,6DAAM,IAAI,EAAC,WAAW;oBACpB,+DACE,GAAG,EAAE,CAAC,EAAE,EAAE,EAAE,CAAC,CAAC,IAAI,CAAC,aAAa,GAAG,EAAE,CAAC,EACtC,KAAK,EAAC,wBAAwB,EAC9B,OAAO,EAAE,IAAI,CAAC,UAAU,mBACV,MAAM,mBACL,IAAI,CAAC,IAAI,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,OAAO,mBAC5B,IAAI,CAAC,IAAI,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,SAAS,gBACjC,IAAI,CAAC,SAAS,IAAI,IAAI,CAAC,KAAK,IAAI,MAAM;wBAElD,+DAAO,IAAI,CAAC,KAAK,CAAQ;wBACzB,6DAAM,KAAK,EAAC,sBAAsB,iBAAa,MAAM,aAAS,CACvD,CACJ;gBAEN,IAAI,CAAC,IAAI,IAAI,CACZ,4DAAK,KAAK,EAAC,sBAAsB,EAAC,IAAI,EAAC,MAAM,EAAC,EAAE,EAAE,MAAM,gBAAc,IAAI,CAAC,SAAS,IAAI,IAAI,CAAC,KAAK,IAAI,MAAM,IACzG,IAAI,CAAC,OAAO,CAAC,GAAG,CAAC,CAAC,MAAM,EAAE,KAAK,EAAE,EAAE;oBAClC,MAAM,GAAG,GAAG,MAAM,CAAC,GAAG,IAAI,MAAM,CAAC,KAAK,CAAC,CAAC;oBACxC,IAAI,IAAI,CAAC,QAAQ,CAAC,GAAG,CAAC,EAAE,CAAC;wBACvB,OAAO,IAAI,CAAC;oBACd,CAAC;oBAED,MAAM,QAAQ,GAAG,IAAI,CAAC,UAAU,CAAC,GAAG,CAAC,CAAC;oBACtC,MAAM,mBAAmB,GAAG,YAAY,EAAE,CAAC;oBAE3C,OAAO,CACL,WACE,GAAG,EAAE,GAAG,EACR,IAAI,EAAC,UAAU,EACf,QAAQ,EAAE,mBAAmB,KAAK,IAAI,CAAC,YAAY,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,mBAC7C,QAAQ,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,SAAS,EAC5C,KAAK,EAAE;4BACL,sBAAsB,EAAE,IAAI;4BAC5B,gCAAgC,EAAE,QAAQ;yBAC3C,EACD,OAAO,EAAE,GAAG,EAAE,CAAC,CAAC,QAAQ,IAAI,IAAI,CAAC,iBAAiB,CAAC,MAAM,CAAC;wBAE1D,YAAM,IAAI,EAAE,GAAG,IAAG,MAAM,CAAC,KAAK,IAAI,EAAE,CAAQ,CACxC,CACP,CAAC;gBACJ,CAAC,CAAC,CACE,CACP,CACG,CACD,CACR,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import { Component, Host, h, Prop, State, Event, EventEmitter, Element, Listen } from '@stencil/core';\n\nexport interface MenuOption {\n key?: string;\n label: string;\n [key: string]: any;\n}\n\n@Component({\n tag: 'xplor-btn-menu',\n styleUrl: 'xplor-btn-menu.scss',\n scoped: true,\n})\nexport class XplorBtnMenu {\n @Element() el: HTMLElement;\n\n /*\n Accessible label for the menu trigger button when no visible label is provided\n /\n @Prop() ariaLabel: string;\n\n /\n Button label\n /\n @Prop() label: string = '';\n\n /\n Menu options\n /\n @Prop() options: MenuOption[] = [];\n\n /\n Hidden option keys\n /\n @Prop() hiddenKeys: string[] = [];\n\n /\n Disabled option keys\n /\n @Prop() disabledKeys: string[] = [];\n\n /\n Button color\n /\n @Prop() color: string = 'secondary';\n\n /\n Button density (compact, default, comfortable)\n /\n @Prop() density: string = 'default';\n\n /\n Whether the menu is open\n /\n @State() show: boolean = false;\n\n /\n Index of the currently focused menu item for keyboard navigation\n /\n @State() focusedIndex: number = -1;\n\n /\n Click event - emits the clicked option\n /\n @Event() xplorClick: EventEmitter<MenuOption>;\n\n private menuRef: HTMLDivElement;\n private triggerBtnRef: HTMLButtonElement;\n\n componentDidLoad() {\n document.addEventListener('click', this.handleOutsideClick);\n }\n\n disconnectedCallback() {\n document.removeEventListener('click', this.handleOutsideClick);\n }\n\n private handleOutsideClick = (event: MouseEvent) => {\n if (this.menuRef && !this.menuRef.contains(event.target as Node)) {\n this.show = false;\n }\n };\n\n private toggleMenu = () => {\n this.show = !this.show;\n if (!this.show) {\n this.focusedIndex = -1;\n }\n };\n\n private handleClickOption = (option: MenuOption) => {\n this.xplorClick.emit(option);\n this.show = false;\n this.focusedIndex = -1;\n this.triggerBtnRef?.focus();\n };\n\n /\n Returns the list of visible (non-hidden) options for keyboard navigation\n /\n private getVisibleOptions(): { option: MenuOption; key: string }[] {\n return this.options\n .map((option, index) => ({ option, key: option.key \|\| String(index) }))\n .filter(({ key }) => !this.isHidden(key));\n }\n\n /\n Focuses the menu item at the given index in the visible options list\n */\n private focusMenuItem(index: number) {\n if (this.menuRef) {\n const items = this.menuRef.querySelectorAll('[role=\"menuitem\"]');\n if (items[index]) {\n (items[index] as HTMLElement).focus();\n }\n }\n }\n\n @Listen('keydown')\n handleKeyDown(event: KeyboardEvent) {\n if (!this.show && (event.key === 'ArrowDown' \|\| event.key === 'Enter' \|\| event.key === ' ')) {\n const target = event.target as HTMLElement;\n if (target === this.triggerBtnRef \|\| this.el.querySelector('[slot=\"activator\"]')?.contains(target)) {\n if (event.key === 'ArrowDown') {\n event.preventDefault();\n this.show = true;\n this.focusedIndex = 0;\n requestAnimationFrame(() => this.focusMenuItem(0));\n }\n }\n return;\n }\n\n if (!this.show) return;\n\n const visibleOptions = this.getVisibleOptions();\n const totalVisible = visibleOptions.length;\n\n switch (event.key) {\n case 'ArrowDown':\n event.preventDefault();\n this.focusedIndex = this.focusedIndex < totalVisible - 1 ? this.focusedIndex + 1 : 0;\n this.focusMenuItem(this.focusedIndex);\n break;\n\n case 'ArrowUp':\n event.preventDefault();\n this.focusedIndex = this.focusedIndex > 0 ? this.focusedIndex - 1 : totalVisible - 1;\n this.focusMenuItem(this.focusedIndex);\n break;\n\n case 'Escape':\n event.preventDefault();\n this.show = false;\n this.focusedIndex = -1;\n this.triggerBtnRef?.focus();\n break;\n\n case 'Enter':\n case ' ':\n event.preventDefault();\n if (this.focusedIndex >= 0 && this.focusedIndex < totalVisible) {\n const { option, key } = visibleOptions[this.focusedIndex];\n if (!this.isDisabled(key)) {\n this.handleClickOption(option);\n }\n }\n break;\n\n case 'Home':\n event.preventDefault();\n this.focusedIndex = 0;\n this.focusMenuItem(this.focusedIndex);\n break;\n\n case 'End':\n event.preventDefault();\n this.focusedIndex = totalVisible - 1;\n this.focusMenuItem(this.focusedIndex);\n break;\n\n case 'Tab':\n this.show = false;\n this.focusedIndex = -1;\n break;\n }\n }\n\n private isHidden = (key: string \| null): boolean => {\n return key !== null && this.hiddenKeys.includes(key);\n };\n\n private isDisabled = (key: string \| null): boolean => {\n return key !== null && this.disabledKeys.includes(key);\n };\n\n render() {\n const menuId = 'xplor-btn-menu-list';\n let visibleIndex = 0;\n\n return (\n <Host>\n <div class=\"xplor-btn-menu\" ref={(el) => (this.menuRef = el)}>\n <slot name=\"activator\">\n <button\n ref={(el) => (this.triggerBtnRef = el)}\n class=\"xplor-btn-menu__button\"\n onClick={this.toggleMenu}\n aria-haspopup=\"menu\"\n aria-expanded={this.show ? 'true' : 'false'}\n aria-controls={this.show ? menuId : undefined}\n aria-label={this.ariaLabel \|\| this.label \|\| 'Menu'}\n >\n <span>{this.label}</span>\n <span class=\"xplor-btn-menu__icon\" aria-hidden=\"true\">▼</span>\n </button>\n </slot>\n\n {this.show && (\n <div class=\"xplor-btn-menu__list\" role=\"menu\" id={menuId} aria-label={this.ariaLabel \|\| this.label \|\| 'Menu'}>\n {this.options.map((option, index) => {\n const key = option.key \|\| String(index);\n if (this.isHidden(key)) {\n return null;\n }\n\n const disabled = this.isDisabled(key);\n const currentVisibleIndex = visibleIndex++;\n\n return (\n <div\n key={key}\n role=\"menuitem\"\n tabindex={currentVisibleIndex === this.focusedIndex ? 0 : -1}\n aria-disabled={disabled ? 'true' : undefined}\n class={{\n 'xplor-btn-menu__item': true,\n 'xplor-btn-menu__item--disabled': disabled,\n }}\n onClick={() => !disabled && this.handleClickOption(option)}\n >\n <slot name={key}>{option.label \|\| ''}</slot>\n </div>\n );\n })}\n </div>\n )}\n </div>\n </Host>\n );\n }\n}\n"]}

package/dist/collection/components/xplor-button/xplor-button.js CHANGED Viewed

@@ -3,6 +3,8 @@ export class XplorButton {
     constructor() {
         this.type = 'secondary';
         this.mode = 'pg'; // 'dark', 'pg', 'office' (default: 'dark')
+        /** Whether the button is disabled */
+        this.disabled = false;
         /**
          * Icon to display (defaults to plus sign)
          */
@@ -17,7 +19,7 @@ export class XplorButton {
     render() {
         const isIconOnly = !this.text && this.iconPosition !== null;
         const hasIcon = this.iconPosition !== null;
-        return (h(Host, { key: '94fed7b7f39f8aca0273d5b6da123e1ce7d87d01' }, h("slot", { key: 'fd6a53ce8ce00175207dff16d976379a0ab8040b' }, h("button", { key: 'a688aabc8675ef63f3c18c2af4b0a24c8bc29de7', role: "button", class: Object.assign({ 'x-button': true, [this.type]: true, 'shadow': this.type !== 'minimal' && this.type !== 'text', 'x-button--icon-only': isIconOnly, 'x-button--with-icon': hasIcon && !isIconOnly, 'x-button--icon-start': this.iconPosition === 'start' && !isIconOnly, 'x-button--icon-end': this.iconPosition === 'end' && !isIconOnly }, (this.styles ? { [this.styles]: true } : {})), onClick: () => this.clickAction && this.clickAction() }, hasIcon && this.iconPosition === 'start' && this.renderIcon(), this.text && h("span", { key: '82d9558a551bcc23ead90b3f42d0fcd94bd7301f', class: "button-text" }, this.text), hasIcon && this.iconPosition === 'end' && this.renderIcon()))));
+        return (h(Host, { key: '193c8139b43bdbaf108bf09d220b20d746f72cd7' }, h("slot", { key: '61b731d8173a15bcd76fbbf16f0d1d97cbab6e34' }, h("button", { key: '04486cbf547798161e7756a5999898bc46b298b5', role: "button", class: Object.assign({ 'x-button': true, [this.type]: true, 'shadow': this.type !== 'minimal' && this.type !== 'text', 'x-button--icon-only': isIconOnly, 'x-button--with-icon': hasIcon && !isIconOnly, 'x-button--icon-start': this.iconPosition === 'start' && !isIconOnly, 'x-button--icon-end': this.iconPosition === 'end' && !isIconOnly }, (this.styles ? { [this.styles]: true } : {})), onClick: () => this.clickAction && this.clickAction(), "aria-label": this.ariaLabel, "aria-disabled": this.disabled ? 'true' : null, disabled: this.disabled }, hasIcon && this.iconPosition === 'start' && this.renderIcon(), this.text && h("span", { key: '07e204d356d830444e1b26979be6f1f3926ba551', class: "button-text" }, this.text), hasIcon && this.iconPosition === 'end' && this.renderIcon()))));
     }
     static get is() { return "xplor-button"; }
     static get encapsulation() { return "scoped"; }
@@ -148,6 +150,45 @@ export class XplorButton {
                 "getter": false,
                 "setter": false
             },
+            "ariaLabel": {
+                "type": "string",
+                "attribute": "aria-label",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "Accessible label for icon-only buttons"
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false
+            },
+            "disabled": {
+                "type": "boolean",
+                "attribute": "disabled",
+                "mutable": false,
+                "complexType": {
+                    "original": "boolean",
+                    "resolved": "boolean",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "Whether the button is disabled"
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "defaultValue": "false"
+            },
             "iconPosition": {
                 "type": "string",
                 "attribute": "icon-position",