@threadlabs/looma 0.16.5 → 0.17.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.
- package/components/ui-avatar-group/ui-avatar-group.html +8 -5
- package/components/ui-avatar-group/ui-avatar-group.js +3 -3
- package/components/ui-badge/ui-badge.html +10 -5
- package/components/ui-breadcrumb-item/ui-breadcrumb-item.html +2 -1
- package/components/ui-button/ui-button.html +33 -26
- package/components/ui-button/ui-button.js +2 -2
- package/components/ui-callout/ui-callout.html +3 -1
- package/components/ui-card/ui-card.html +5 -3
- package/components/ui-checkbox/ui-checkbox.html +36 -8
- package/components/ui-combobox/ui-combobox.html +72 -45
- package/components/ui-combobox/ui-combobox.js +7 -2
- package/components/ui-context-menu/ui-context-menu.html +2 -2
- package/components/ui-description-item/ui-description-item.html +1 -1
- package/components/ui-description-list/ui-description-list.html +2 -0
- package/components/ui-dialog/ui-dialog.html +3 -23
- package/components/ui-disclosure/ui-disclosure.html +2 -2
- package/components/ui-editor-insert-table-grid/ui-editor-insert-table-grid.html +2 -2
- package/components/ui-editor-mention-menu/ui-editor-mention-menu.html +3 -3
- package/components/ui-editor-slash-menu/ui-editor-slash-menu.html +4 -4
- package/components/ui-editor-slash-menu-item/ui-editor-slash-menu-item.html +6 -1
- package/components/ui-editor-table-context-menu/ui-editor-table-context-menu.html +2 -2
- package/components/ui-editor-table-toolbar/ui-editor-table-toolbar.html +4 -4
- package/components/ui-editor-toolbar/ui-editor-toolbar.html +5 -5
- package/components/ui-floating-action-button/ui-floating-action-button.html +4 -2
- package/components/ui-icon-button/ui-icon-button.html +57 -17
- package/components/ui-icon-button/ui-icon-button.js +1 -1
- package/components/ui-list/ui-list.html +46 -6
- package/components/ui-list-item/ui-list-item.html +1 -1
- package/components/ui-menu/ui-menu.html +4 -3
- package/components/ui-menu/ui-menu.js +9 -3
- package/components/ui-menu-item/ui-menu-item.html +43 -6
- package/components/ui-meter/ui-meter.html +4 -1
- package/components/ui-nav-item/ui-nav-item.html +0 -1
- package/components/ui-page-header/ui-page-header.html +1 -0
- package/components/ui-popover/ui-popover.html +1 -1
- package/components/ui-radio/ui-radio.html +5 -2
- package/components/ui-scroll-area/ui-scroll-area.html +9 -14
- package/components/ui-scroll-area/ui-scroll-area.js +32 -0
- package/components/ui-search-result-row/ui-search-result-row.html +5 -3
- package/components/ui-search-shell/ui-search-shell.html +8 -8
- package/components/ui-section/ui-section.html +5 -3
- package/components/ui-separator/ui-separator.html +2 -2
- package/components/ui-sidebar/ui-sidebar.html +2 -2
- package/components/ui-spinner/ui-spinner.html +28 -8
- package/components/ui-status-message/ui-status-message.html +1 -1
- package/components/ui-switch/ui-switch.html +17 -8
- package/components/ui-table/ui-table.html +1 -1
- package/components/ui-tabs/ui-tabs.html +21 -12
- package/components/ui-toast/ui-toast.html +1 -1
- package/components/ui-toast-region/ui-toast-region.html +1 -1
- package/components/ui-tooltip/ui-tooltip.html +12 -12
- package/components/ui-tooltip/ui-tooltip.js +1 -1
- package/components/ui-top-bar/ui-top-bar.html +1 -1
- package/components/ui-tree/ui-tree.js +4 -1
- package/components/ui-tree-item/ui-tree-item.html +2 -1
- package/dist/index.js +15 -14
- package/editor/chunks/extensions.js +3 -4
- package/editor/extensions/index.d.ts +1 -1
- package/editor/extensions/preset.d.ts +5 -0
- package/package.json +1 -1
- package/styles/ui-avatar-group.css +8 -5
- package/styles/ui-badge.css +10 -5
- package/styles/ui-breadcrumb-item.css +2 -1
- package/styles/ui-button.css +19 -25
- package/styles/ui-callout.css +3 -1
- package/styles/ui-card.css +4 -2
- package/styles/ui-checkbox.css +38 -8
- package/styles/ui-combobox.css +27 -8
- package/styles/ui-context-menu.css +2 -2
- package/styles/ui-description-item.css +1 -1
- package/styles/ui-description-list.css +2 -0
- package/styles/ui-dialog.css +1 -22
- package/styles/ui-disclosure.css +2 -2
- package/styles/ui-editor-insert-table-grid.css +2 -2
- package/styles/ui-editor-mention-menu.css +3 -3
- package/styles/ui-editor-slash-menu-item.css +6 -1
- package/styles/ui-editor-slash-menu.css +4 -4
- package/styles/ui-editor-table-context-menu.css +2 -2
- package/styles/ui-editor-table-toolbar.css +4 -4
- package/styles/ui-editor-toolbar.css +5 -5
- package/styles/ui-floating-action-button.css +3 -1
- package/styles/ui-icon-button.css +53 -18
- package/styles/ui-list-item.css +1 -1
- package/styles/ui-list.css +41 -6
- package/styles/ui-menu-item.css +43 -5
- package/styles/ui-menu.css +3 -3
- package/styles/ui-meter.css +4 -1
- package/styles/ui-nav-item.css +0 -1
- package/styles/ui-page-header.css +1 -0
- package/styles/ui-popover.css +1 -1
- package/styles/ui-radio.css +5 -2
- package/styles/ui-scroll-area.css +10 -16
- package/styles/ui-search-result-row.css +3 -2
- package/styles/ui-search-shell.css +7 -7
- package/styles/ui-section.css +5 -3
- package/styles/ui-separator.css +2 -2
- package/styles/ui-sidebar.css +2 -2
- package/styles/ui-spinner.css +27 -6
- package/styles/ui-status-message.css +1 -1
- package/styles/ui-switch.css +17 -8
- package/styles/ui-table.css +1 -1
- package/styles/ui-tabs.css +60 -51
- package/styles/ui-toast-region.css +1 -1
- package/styles/ui-toast.css +1 -1
- package/styles/ui-tooltip.css +12 -12
- package/styles/ui-top-bar.css +1 -1
- package/styles/ui-tree-item.css +2 -1
- package/theme-dark.css +4 -4
- package/theme-light.css +3 -3
- package/tokens.css +9 -6
- package/vanilla/UiButton.d.ts +1 -0
- package/vanilla/UiButton.js +17 -19
- package/vanilla/UiCombobox.js +162 -159
- package/vanilla/UiDialog.js +2 -2
- package/vanilla/UiIconButton.d.ts +1 -0
- package/vanilla/UiIconButton.js +1 -4
- package/vanilla/UiList.d.ts +3 -1
- package/vanilla/UiList.js +36 -19
- package/vanilla/UiMenu.d.ts +1 -0
- package/vanilla/UiMenu.js +1 -1
- package/vanilla/UiMenuItem.js +10 -13
- package/vanilla/UiScrollArea.js +11 -6
- package/vanilla/UiSearchShell.js +2 -2
- package/vanilla/UiSpinner.js +2 -4
- package/vue/UiAvatarGroup.vue +8 -5
- package/vue/UiBadge.vue +10 -5
- package/vue/UiBreadcrumbItem.vue +2 -1
- package/vue/UiButton.d.ts +2 -0
- package/vue/UiButton.vue +31 -28
- package/vue/UiCallout.vue +3 -2
- package/vue/UiCard.vue +4 -2
- package/vue/UiCheckbox.vue +36 -8
- package/vue/UiCombobox.d.ts +1 -1
- package/vue/UiCombobox.vue +55 -35
- package/vue/UiContextMenu.vue +2 -2
- package/vue/UiDescriptionItem.vue +1 -1
- package/vue/UiDescriptionList.vue +2 -0
- package/vue/UiDialog.d.ts +3 -3
- package/vue/UiDialog.vue +3 -27
- package/vue/UiDisclosure.vue +2 -2
- package/vue/UiEditorInsertTableGrid.vue +2 -2
- package/vue/UiEditorMentionMenu.d.ts +1 -1
- package/vue/UiEditorMentionMenu.vue +4 -3
- package/vue/UiEditorSlashMenu.vue +6 -4
- package/vue/UiEditorSlashMenuItem.vue +6 -1
- package/vue/UiEditorTableContextMenu.vue +2 -2
- package/vue/UiEditorTableToolbar.vue +4 -4
- package/vue/UiEditorToolbar.vue +5 -5
- package/vue/UiFloatingActionButton.vue +3 -1
- package/vue/UiIconButton.d.ts +2 -0
- package/vue/UiIconButton.vue +61 -19
- package/vue/UiList.d.ts +7 -1
- package/vue/UiList.vue +57 -6
- package/vue/UiListItem.vue +1 -1
- package/vue/UiMenu.d.ts +2 -0
- package/vue/UiMenu.vue +6 -3
- package/vue/UiMenuItem.d.ts +3 -3
- package/vue/UiMenuItem.vue +47 -7
- package/vue/UiMeter.vue +4 -1
- package/vue/UiNavItem.vue +0 -1
- package/vue/UiPageHeader.vue +1 -0
- package/vue/UiPopover.vue +1 -1
- package/vue/UiRadio.vue +5 -2
- package/vue/UiScrollArea.vue +24 -18
- package/vue/UiSearchResultRow.vue +3 -2
- package/vue/UiSearchShell.vue +8 -8
- package/vue/UiSection.vue +5 -3
- package/vue/UiSeparator.vue +2 -2
- package/vue/UiSidebar.vue +2 -2
- package/vue/UiSpinner.vue +28 -7
- package/vue/UiStatusMessage.vue +1 -1
- package/vue/UiSwitch.vue +20 -9
- package/vue/UiTable.vue +1 -1
- package/vue/UiTabs.vue +25 -12
- package/vue/UiToast.vue +1 -1
- package/vue/UiToastRegion.vue +1 -1
- package/vue/UiTooltip.vue +12 -12
- package/vue/UiTopBar.vue +1 -1
- package/vue/UiTreeItem.vue +2 -1
- package/vue/chunks/UiAvatarGroup.js +1 -1
- package/vue/chunks/UiBadge.js +1 -1
- package/vue/chunks/UiBreadcrumbItem.js +1 -1
- package/vue/chunks/UiButton.js +28 -23
- package/vue/chunks/UiCallout.js +1 -1
- package/vue/chunks/UiCard.js +1 -1
- package/vue/chunks/UiCheckbox.js +1 -1
- package/vue/chunks/UiCombobox.js +80 -77
- package/vue/chunks/UiContextMenu.js +1 -1
- package/vue/chunks/UiDescriptionItem.js +1 -1
- package/vue/chunks/UiDescriptionList.js +1 -1
- package/vue/chunks/UiDialog.js +7 -4
- package/vue/chunks/UiDisclosure.js +1 -1
- package/vue/chunks/UiEditorInsertTableGrid.js +1 -1
- package/vue/chunks/UiEditorMentionMenu.js +1 -1
- package/vue/chunks/UiEditorSlashMenu.js +1 -1
- package/vue/chunks/UiEditorSlashMenuItem.js +1 -1
- package/vue/chunks/UiEditorTableContextMenu.js +1 -1
- package/vue/chunks/UiEditorTableToolbar.js +1 -1
- package/vue/chunks/UiEditorToolbar.js +1 -1
- package/vue/chunks/UiFloatingActionButton.js +1 -1
- package/vue/chunks/UiIconButton.js +13 -8
- package/vue/chunks/UiList.js +17 -5
- package/vue/chunks/UiListItem.js +1 -1
- package/vue/chunks/UiMenu.js +10 -2
- package/vue/chunks/UiMenuItem.js +1 -4
- package/vue/chunks/UiMeter.js +1 -1
- package/vue/chunks/UiNavItem.js +1 -1
- package/vue/chunks/UiPageHeader.js +1 -1
- package/vue/chunks/UiPopover.js +1 -1
- package/vue/chunks/UiRadio.js +1 -1
- package/vue/chunks/UiScrollArea.js +22 -3
- package/vue/chunks/UiSearchResultRow.js +1 -1
- package/vue/chunks/UiSearchShell.js +2 -2
- package/vue/chunks/UiSection.js +1 -1
- package/vue/chunks/UiSeparator.js +1 -1
- package/vue/chunks/UiSidebar.js +1 -1
- package/vue/chunks/UiSpinner.js +7 -5
- package/vue/chunks/UiStatusMessage.js +1 -1
- package/vue/chunks/UiSwitch.js +1 -1
- package/vue/chunks/UiTable.js +1 -1
- package/vue/chunks/UiTabs.js +1 -1
- package/vue/chunks/UiToast.js +1 -1
- package/vue/chunks/UiToastRegion.js +1 -1
- package/vue/chunks/UiTooltip.js +1 -1
- package/vue/chunks/UiTopBar.js +1 -1
- package/vue/chunks/UiTreeItem.js +1 -1
- package/vue/components.css +1238 -1032
- package/vue/editor/LoomaEditor.d.ts +12 -1
- package/vue/editor/index.js +7 -1
- package/vue/index.js +1 -1
package/vanilla/UiCombobox.js
CHANGED
|
@@ -3,7 +3,7 @@ import { manageComponentLifecycle } from "@nextwebwg/html-next/runtime";
|
|
|
3
3
|
import * as controller from "../components/ui-combobox/ui-combobox.js";
|
|
4
4
|
import "../styles/ui-combobox.css";
|
|
5
5
|
|
|
6
|
-
const definition = {...{"contract":{"tag":"ui-combobox","props":{"allowCreate":{"type":"boolean","required":false,"target":{"attribute":"allowcreate"},"default":false},"allowFreeText":{"type":"boolean","required":false,"target":{"attribute":"allowfreetext"},"default":false},"clearable":{"type":"boolean","required":false,"target":{"attribute":"clearable"},"default":false},"disabled":{"type":"boolean","required":false,"target":{"attribute":"disabled"},"default":false},"disclosure":{"type":"boolean","required":false,"target":{"attribute":"disclosure"},"default":false},"filter":{"type":{"enum":["label","none"]},"required":false,"target":{"attribute":"filter"},"default":"label"},"help":{"type":"string","required":false,"target":{"attribute":"help"},"default":""},"invalid":{"type":"boolean","required":false,"target":{"attribute":"invalid"},"default":false},"items":{"type":{"kind":"list","item":{"kind":"object","fields":[{"name":"id","type":{"kind":"terminal","name":"string"},"optional":false},{"name":"value","type":{"kind":"terminal","name":"string"},"optional":false},{"name":"label","type":{"kind":"terminal","name":"string"},"optional":false},{"name":"group","type":{"kind":"terminal","name":"string"},"optional":true},{"name":"disabled","type":{"kind":"terminal","name":"boolean"},"optional":true},{"name":"description","type":{"kind":"terminal","name":"string"},"optional":true},{"name":"tag","type":{"kind":"object","fields":[{"name":"label","type":{"kind":"terminal","name":"string"},"optional":false},{"name":"tone","type":{"kind":"union","members":[{"kind":"keyword","value":"neutral"},{"kind":"keyword","value":"accent"},{"kind":"keyword","value":"info"},{"kind":"keyword","value":"success"},{"kind":"keyword","value":"warning"},{"kind":"keyword","value":"danger"}]},"optional":true},{"name":"color","type":{"kind":"terminal","name":"string"},"optional":true}],"open":false},"optional":true}],"open":false}},"required":false,"target":{"attribute":"items"}},"label":{"type":"string","required":false,"target":{"attribute":"label"},"default":""},"labelVisibility":{"type":{"enum":["visible","sr-only"]},"required":false,"target":{"attribute":"labelvisibility"},"default":"visible"},"loading":{"type":"boolean","required":false,"target":{"attribute":"aria-busy"},"default":false},"multiple":{"type":"boolean","required":false,"target":{"attribute":"multiple"},"default":false},"name":{"type":"string","required":false,"target":{"attribute":"name"},"default":""},"openOnFocus":{"type":"boolean","required":false,"target":{"attribute":"openonfocus"},"default":false},"placeholder":{"type":"string","required":false,"target":{"attribute":"placeholder"},"default":""},"query":{"type":"string","required":false,"target":{"attribute":"query"}},"readonly":{"type":"boolean","required":false,"target":{"attribute":"readonly"},"default":false},"required":{"type":"boolean","required":false,"target":{"attribute":"required"},"default":false},"selectedValues":{"type":{"kind":"list","item":{"kind":"terminal","name":"string"}},"required":false,"target":{"attribute":"selectedvalues"}},"size":{"type":{"enum":["sm","md","lg"]},"required":false,"target":{"attribute":"size"},"default":"md"},"tokenSeparators":{"type":{"kind":"list","item":{"kind":"terminal","name":"string"}},"required":false,"target":{"attribute":"tokenseparators"}},"value":{"type":{"kind":"union","members":[{"kind":"terminal","name":"string"},{"kind":"terminal","name":"null"}]},"required":false,"target":{"attribute":"value"}}}},"template":{"kind":"element","name":"div","attributes":[],"children":[{"kind":"element","name":"label","attributes":[{"kind":"attribute","name":"for","expression":"format('%s-input', uid)","expressionPlan":{"source":"format('%s-input', uid)","ast":{"kind":"call","fn":"format","args":[{"kind":"literal","value":"%s-input"},{"kind":"id","name":"uid"}]},"dependencies":["uid"]}},{"kind":"attribute","name":"sr-only","expression":"labelVisibility = 'sr-only'","expressionPlan":{"source":"labelVisibility = 'sr-only'","ast":{"kind":"binary","op":"=","left":{"kind":"id","name":"labelVisibility"},"right":{"kind":"literal","value":"sr-only"}},"dependencies":["labelVisibility"]},"target":"class"}],"children":[{"kind":"element","name":"template","attributes":[{"kind":"directive","name":"value","expression":"label","expressionPlan":{"source":"label","ast":{"kind":"id","name":"label"},"dependencies":["label"]}}],"children":[]},{"kind":"element","name":"template","attributes":[],"children":[{"kind":"text","value":"\n *"}],"flow":{"kind":"if","test":"required","testPlan":{"source":"required","ast":{"kind":"id","name":"required"},"dependencies":["required"]}}}]},{"kind":"element","name":"div","attributes":[{"kind":"literal","name":"class","value":"control"}],"children":[{"kind":"element","name":"div","attributes":[{"kind":"literal","name":"class","value":"field"}],"children":[{"kind":"slot","fallback":[],"name":"start"},{"kind":"element","name":"template","attributes":[],"children":[{"kind":"element","name":"button","attributes":[{"kind":"literal","name":"class","value":"item"},{"kind":"literal","name":"type","value":"button"},{"kind":"literal","name":"tabindex","value":"-1"},{"kind":"attribute","name":"data-index","expression":"index","expressionPlan":{"source":"index","ast":{"kind":"id","name":"index"},"dependencies":["index"]}},{"kind":"attribute","name":"disabled","expression":"disabled or readonly or item.disabled","expressionPlan":{"source":"disabled or readonly or item.disabled","ast":{"kind":"binary","op":"or","left":{"kind":"binary","op":"or","left":{"kind":"id","name":"disabled"},"right":{"kind":"id","name":"readonly"}},"right":{"kind":"member","object":{"kind":"id","name":"item"},"key":"disabled"}},"dependencies":["disabled","item.disabled","readonly"]}},{"kind":"attribute","name":"aria-label","expression":"format('%s, press Delete or Backspace to remove', item.label)","expressionPlan":{"source":"format('%s, press Delete or Backspace to remove', item.label)","ast":{"kind":"call","fn":"format","args":[{"kind":"literal","value":"%s, press Delete or Backspace to remove"},{"kind":"member","object":{"kind":"id","name":"item"},"key":"label"}]},"dependencies":["item.label"]}}],"children":[{"kind":"slot","fallback":[{"kind":"element","name":"ui-badge","attributes":[{"kind":"directive","name":"value","expression":"item.label","expressionPlan":{"source":"item.label","ast":{"kind":"member","object":{"kind":"id","name":"item"},"key":"label"},"dependencies":["item.label"]}}],"children":[]}],"nameExpression":{"source":"format('item-%s', item.id)","ast":{"kind":"call","fn":"format","args":[{"kind":"literal","value":"item-%s"},{"kind":"member","object":{"kind":"id","name":"item"},"key":"id"}]},"dependencies":["item.id"]}}],"flow":{"kind":"each","item":"item","list":"internalItems","listPlan":{"source":"internalItems","ast":{"kind":"id","name":"internalItems"},"dependencies":["internalItems"]},"index":"index","key":"item.id","keyPlan":{"source":"item.id","ast":{"kind":"member","object":{"kind":"id","name":"item"},"key":"id"},"dependencies":["item.id"]}}}],"flow":{"kind":"if","test":"multiple","testPlan":{"source":"multiple","ast":{"kind":"id","name":"multiple"},"dependencies":["multiple"]}}},{"kind":"element","name":"input","attributes":[{"kind":"attribute","name":"id","expression":"format('%s-input', uid)","expressionPlan":{"source":"format('%s-input', uid)","ast":{"kind":"call","fn":"format","args":[{"kind":"literal","value":"%s-input"},{"kind":"id","name":"uid"}]},"dependencies":["uid"]}},{"kind":"literal","name":"role","value":"combobox"},{"kind":"literal","name":"aria-autocomplete","value":"list"},{"kind":"literal","name":"autocomplete","value":"off"},{"kind":"attribute","name":"aria-controls","expression":"format('%s-listbox', uid)","expressionPlan":{"source":"format('%s-listbox', uid)","ast":{"kind":"call","fn":"format","args":[{"kind":"literal","value":"%s-listbox"},{"kind":"id","name":"uid"}]},"dependencies":["uid"]}},{"kind":"attribute","name":"aria-expanded","expression":"expanded","expressionPlan":{"source":"expanded","ast":{"kind":"id","name":"expanded"},"dependencies":["expanded"]}},{"kind":"attribute","name":"aria-invalid","expression":"invalid or validationStatus = 'error'","expressionPlan":{"source":"invalid or validationStatus = 'error'","ast":{"kind":"binary","op":"or","left":{"kind":"id","name":"invalid"},"right":{"kind":"binary","op":"=","left":{"kind":"id","name":"validationStatus"},"right":{"kind":"literal","value":"error"}}},"dependencies":["invalid","validationStatus"]}},{"kind":"attribute","name":"aria-busy","expression":"loading or validationStatus = 'pending'","expressionPlan":{"source":"loading or validationStatus = 'pending'","ast":{"kind":"binary","op":"or","left":{"kind":"id","name":"loading"},"right":{"kind":"binary","op":"=","left":{"kind":"id","name":"validationStatus"},"right":{"kind":"literal","value":"pending"}}},"dependencies":["loading","validationStatus"]}},{"kind":"property","key":"value","name":"value","expression":"display","expressionPlan":{"source":"display","ast":{"kind":"id","name":"display"},"dependencies":["display"]}},{"kind":"attribute","name":"placeholder","expression":"placeholder","expressionPlan":{"source":"placeholder","ast":{"kind":"id","name":"placeholder"},"dependencies":["placeholder"]}},{"kind":"attribute","name":"disabled","expression":"disabled","expressionPlan":{"source":"disabled","ast":{"kind":"id","name":"disabled"},"dependencies":["disabled"]}},{"kind":"attribute","name":"readonly","expression":"readonly","expressionPlan":{"source":"readonly","ast":{"kind":"id","name":"readonly"},"dependencies":["readonly"]}},{"kind":"attribute","name":"required","expression":"required and not (multiple and internalItems[0])","expressionPlan":{"source":"required and not (multiple and internalItems[0])","ast":{"kind":"binary","op":"and","left":{"kind":"id","name":"required"},"right":{"kind":"unary","op":"not","operand":{"kind":"binary","op":"and","left":{"kind":"id","name":"multiple"},"right":{"kind":"index","object":{"kind":"id","name":"internalItems"},"index":{"kind":"literal","value":0}}}}},"dependencies":["internalItems.0","multiple","required"]}}],"children":[],"ref":"input"},{"kind":"element","name":"input","attributes":[{"kind":"literal","name":"type","value":"hidden"},{"kind":"attribute","name":"name","expression":"name","expressionPlan":{"source":"name","ast":{"kind":"id","name":"name"},"dependencies":["name"]}},{"kind":"attribute","name":"value","expression":"submitted","expressionPlan":{"source":"submitted","ast":{"kind":"id","name":"submitted"},"dependencies":["submitted"]}},{"kind":"attribute","name":"disabled","expression":"disabled","expressionPlan":{"source":"disabled","ast":{"kind":"id","name":"disabled"},"dependencies":["disabled"]}}],"children":[],"flow":{"kind":"if","test":"name and not multiple","testPlan":{"source":"name and not multiple","ast":{"kind":"binary","op":"and","left":{"kind":"id","name":"name"},"right":{"kind":"unary","op":"not","operand":{"kind":"id","name":"multiple"}}},"dependencies":["multiple","name"]}}},{"kind":"element","name":"template","attributes":[],"children":[{"kind":"element","name":"input","attributes":[{"kind":"literal","name":"type","value":"hidden"},{"kind":"attribute","name":"name","expression":"name","expressionPlan":{"source":"name","ast":{"kind":"id","name":"name"},"dependencies":["name"]}},{"kind":"attribute","name":"value","expression":"item.value","expressionPlan":{"source":"item.value","ast":{"kind":"member","object":{"kind":"id","name":"item"},"key":"value"},"dependencies":["item.value"]}},{"kind":"attribute","name":"disabled","expression":"disabled","expressionPlan":{"source":"disabled","ast":{"kind":"id","name":"disabled"},"dependencies":["disabled"]}}],"children":[],"flow":{"kind":"each","item":"item","list":"internalItems","listPlan":{"source":"internalItems","ast":{"kind":"id","name":"internalItems"},"dependencies":["internalItems"]},"key":"item.id","keyPlan":{"source":"item.id","ast":{"kind":"member","object":{"kind":"id","name":"item"},"key":"id"},"dependencies":["item.id"]}}}],"flow":{"kind":"if","test":"name and multiple","testPlan":{"source":"name and multiple","ast":{"kind":"binary","op":"and","left":{"kind":"id","name":"name"},"right":{"kind":"id","name":"multiple"}},"dependencies":["multiple","name"]}}},{"kind":"element","name":"button","attributes":[{"kind":"literal","name":"type","value":"button"},{"kind":"literal","name":"data-combobox-action","value":"clear"},{"kind":"literal","name":"aria-label","value":"Clear"},{"kind":"attribute","name":"disabled","expression":"disabled or readonly","expressionPlan":{"source":"disabled or readonly","ast":{"kind":"binary","op":"or","left":{"kind":"id","name":"disabled"},"right":{"kind":"id","name":"readonly"}},"dependencies":["disabled","readonly"]}}],"children":[{"kind":"element","name":"svg","attributes":[{"kind":"literal","name":"class","value":"affordance-icon"},{"kind":"literal","name":"aria-hidden","value":"true"},{"kind":"literal","name":"viewBox","value":"0 0 24 24"},{"kind":"literal","name":"fill","value":"none"},{"kind":"literal","name":"stroke","value":"currentColor"},{"kind":"literal","name":"stroke-width","value":"2"},{"kind":"literal","name":"stroke-linecap","value":"round"}],"children":[{"kind":"element","name":"path","attributes":[{"kind":"literal","name":"d","value":"M7 7l10 10M17 7 7 17"}],"children":[]}]}],"flow":{"kind":"if","test":"clearable","testPlan":{"source":"clearable","ast":{"kind":"id","name":"clearable"},"dependencies":["clearable"]}}},{"kind":"element","name":"button","attributes":[{"kind":"literal","name":"type","value":"button"},{"kind":"literal","name":"data-combobox-action","value":"disclosure"},{"kind":"literal","name":"tabindex","value":"-1"},{"kind":"literal","name":"aria-label","value":"Show suggestions"},{"kind":"attribute","name":"aria-controls","expression":"format('%s-listbox', uid)","expressionPlan":{"source":"format('%s-listbox', uid)","ast":{"kind":"call","fn":"format","args":[{"kind":"literal","value":"%s-listbox"},{"kind":"id","name":"uid"}]},"dependencies":["uid"]}},{"kind":"attribute","name":"disabled","expression":"disabled or readonly","expressionPlan":{"source":"disabled or readonly","ast":{"kind":"binary","op":"or","left":{"kind":"id","name":"disabled"},"right":{"kind":"id","name":"readonly"}},"dependencies":["disabled","readonly"]}}],"children":[{"kind":"element","name":"svg","attributes":[{"kind":"literal","name":"class","value":"affordance-icon"},{"kind":"literal","name":"aria-hidden","value":"true"},{"kind":"literal","name":"viewBox","value":"0 0 24 24"},{"kind":"literal","name":"fill","value":"none"},{"kind":"literal","name":"stroke","value":"currentColor"},{"kind":"literal","name":"stroke-width","value":"2.25"},{"kind":"literal","name":"stroke-linecap","value":"round"},{"kind":"literal","name":"stroke-linejoin","value":"round"}],"children":[{"kind":"element","name":"path","attributes":[{"kind":"literal","name":"d","value":"m6 9 6 6 6-6"}],"children":[]}]}],"flow":{"kind":"if","test":"disclosure","testPlan":{"source":"disclosure","ast":{"kind":"id","name":"disclosure"},"dependencies":["disclosure"]}}}],"ref":"field"},{"kind":"element","name":"button","attributes":[{"kind":"literal","name":"class","value":"help"},{"kind":"attribute","name":"id","expression":"format('%s-help', uid)","expressionPlan":{"source":"format('%s-help', uid)","ast":{"kind":"call","fn":"format","args":[{"kind":"literal","value":"%s-help"},{"kind":"id","name":"uid"}]},"dependencies":["uid"]}},{"kind":"literal","name":"type","value":"button"},{"kind":"literal","name":"aria-label","value":"Help"},{"kind":"attribute","name":"disabled","expression":"disabled","expressionPlan":{"source":"disabled","ast":{"kind":"id","name":"disabled"},"dependencies":["disabled"]}}],"children":[{"kind":"element","name":"svg","attributes":[{"kind":"literal","name":"class","value":"help-icon"},{"kind":"literal","name":"aria-hidden","value":"true"},{"kind":"literal","name":"viewBox","value":"0 0 24 24"},{"kind":"literal","name":"fill","value":"none"},{"kind":"literal","name":"stroke","value":"currentColor"},{"kind":"literal","name":"stroke-width","value":"2"},{"kind":"literal","name":"stroke-linecap","value":"round"},{"kind":"literal","name":"stroke-linejoin","value":"round"}],"children":[{"kind":"element","name":"circle","attributes":[{"kind":"literal","name":"cx","value":"12"},{"kind":"literal","name":"cy","value":"12"},{"kind":"literal","name":"r","value":"10"}],"children":[]},{"kind":"element","name":"path","attributes":[{"kind":"literal","name":"d","value":"M9.1 9a3 3 0 0 1 5.8 1c0 2-3 3-3 3"}],"children":[]},{"kind":"element","name":"path","attributes":[{"kind":"literal","name":"d","value":"M12 17h.01"}],"children":[]}]}],"flow":{"kind":"if","test":"help","testPlan":{"source":"help","ast":{"kind":"id","name":"help"},"dependencies":["help"]}}}]},{"kind":"element","name":"ui-tooltip","attributes":[{"kind":"literal","name":"trigger","value":"click"},{"kind":"attribute","name":"id","expression":"format('%s-help-text', uid)","expressionPlan":{"source":"format('%s-help-text', uid)","ast":{"kind":"call","fn":"format","args":[{"kind":"literal","value":"%s-help-text"},{"kind":"id","name":"uid"}]},"dependencies":["uid"]}},{"kind":"attribute","name":"for","expression":"format('%s-help', uid)","expressionPlan":{"source":"format('%s-help', uid)","ast":{"kind":"call","fn":"format","args":[{"kind":"literal","value":"%s-help"},{"kind":"id","name":"uid"}]},"dependencies":["uid"]}}],"children":[{"kind":"element","name":"template","attributes":[{"kind":"directive","name":"value","expression":"help","expressionPlan":{"source":"help","ast":{"kind":"id","name":"help"},"dependencies":["help"]}}],"children":[]}],"flow":{"kind":"if","test":"help","testPlan":{"source":"help","ast":{"kind":"id","name":"help"},"dependencies":["help"]}}},{"kind":"element","name":"div","attributes":[{"kind":"literal","name":"class","value":"popup"},{"kind":"attribute","name":"hidden","expression":"not expanded","expressionPlan":{"source":"not expanded","ast":{"kind":"unary","op":"not","operand":{"kind":"id","name":"expanded"}},"dependencies":["expanded"]}}],"children":[{"kind":"element","name":"div","attributes":[{"kind":"literal","name":"role","value":"listbox"},{"kind":"attribute","name":"id","expression":"format('%s-listbox', uid)","expressionPlan":{"source":"format('%s-listbox', uid)","ast":{"kind":"call","fn":"format","args":[{"kind":"literal","value":"%s-listbox"},{"kind":"id","name":"uid"}]},"dependencies":["uid"]}},{"kind":"attribute","name":"aria-label","expression":"format('%s suggestions', label)","expressionPlan":{"source":"format('%s suggestions', label)","ast":{"kind":"call","fn":"format","args":[{"kind":"literal","value":"%s suggestions"},{"kind":"id","name":"label"}]},"dependencies":["label"]}},{"kind":"attribute","name":"aria-busy","expression":"loading","expressionPlan":{"source":"loading","ast":{"kind":"id","name":"loading"},"dependencies":["loading"]}}],"children":[{"kind":"element","name":"div","attributes":[{"kind":"attribute","name":"role","expression":"group.role","expressionPlan":{"source":"group.role","ast":{"kind":"member","object":{"kind":"id","name":"group"},"key":"role"},"dependencies":["group.role"]}},{"kind":"attribute","name":"aria-label","expression":"group.label","expressionPlan":{"source":"group.label","ast":{"kind":"member","object":{"kind":"id","name":"group"},"key":"label"},"dependencies":["group.label"]}}],"children":[{"kind":"element","name":"div","attributes":[{"kind":"literal","name":"class","value":"group"},{"kind":"directive","name":"value","expression":"group.name","expressionPlan":{"source":"group.name","ast":{"kind":"member","object":{"kind":"id","name":"group"},"key":"name"},"dependencies":["group.name"]}}],"children":[],"flow":{"kind":"if","test":"group.name","testPlan":{"source":"group.name","ast":{"kind":"member","object":{"kind":"id","name":"group"},"key":"name"},"dependencies":["group.name"]}}},{"kind":"element","name":"div","attributes":[{"kind":"literal","name":"class","value":"option"},{"kind":"attribute","name":"active","expression":"row.index = active","expressionPlan":{"source":"row.index = active","ast":{"kind":"binary","op":"=","left":{"kind":"member","object":{"kind":"id","name":"row"},"key":"index"},"right":{"kind":"id","name":"active"}},"dependencies":["active","row.index"]},"target":"class"},{"kind":"literal","name":"role","value":"option"},{"kind":"attribute","name":"id","expression":"format('%s-option-%s', uid, row.index)","expressionPlan":{"source":"format('%s-option-%s', uid, row.index)","ast":{"kind":"call","fn":"format","args":[{"kind":"literal","value":"%s-option-%s"},{"kind":"id","name":"uid"},{"kind":"member","object":{"kind":"id","name":"row"},"key":"index"}]},"dependencies":["row.index","uid"]}},{"kind":"attribute","name":"aria-selected","expression":"row.selected","expressionPlan":{"source":"row.selected","ast":{"kind":"member","object":{"kind":"id","name":"row"},"key":"selected"},"dependencies":["row.selected"]}},{"kind":"attribute","name":"aria-disabled","expression":"row.disabled","expressionPlan":{"source":"row.disabled","ast":{"kind":"member","object":{"kind":"id","name":"row"},"key":"disabled"},"dependencies":["row.disabled"]}},{"kind":"attribute","name":"data-index","expression":"row.index","expressionPlan":{"source":"row.index","ast":{"kind":"member","object":{"kind":"id","name":"row"},"key":"index"},"dependencies":["row.index"]}},{"kind":"attribute","name":"aria-labelledby","expression":"row.labelledBy","expressionPlan":{"source":"row.labelledBy","ast":{"kind":"member","object":{"kind":"id","name":"row"},"key":"labelledBy"},"dependencies":["row.labelledBy"]}},{"kind":"attribute","name":"aria-describedby","expression":"row.detail","expressionPlan":{"source":"row.detail","ast":{"kind":"member","object":{"kind":"id","name":"row"},"key":"detail"},"dependencies":["row.detail"]}}],"children":[{"kind":"slot","fallback":[{"kind":"element","name":"span","attributes":[{"kind":"literal","name":"class","value":"detail"}],"children":[{"kind":"element","name":"span","attributes":[{"kind":"literal","name":"class","value":"line"}],"children":[{"kind":"element","name":"span","attributes":[{"kind":"literal","name":"class","value":"primary"},{"kind":"attribute","name":"id","expression":"format('%s-option-%s-label', uid, row.index)","expressionPlan":{"source":"format('%s-option-%s-label', uid, row.index)","ast":{"kind":"call","fn":"format","args":[{"kind":"literal","value":"%s-option-%s-label"},{"kind":"id","name":"uid"},{"kind":"member","object":{"kind":"id","name":"row"},"key":"index"}]},"dependencies":["row.index","uid"]}},{"kind":"directive","name":"value","expression":"row.label","expressionPlan":{"source":"row.label","ast":{"kind":"member","object":{"kind":"id","name":"row"},"key":"label"},"dependencies":["row.label"]}}],"children":[]},{"kind":"element","name":"ui-badge","attributes":[{"kind":"attribute","name":"tone","expression":"row.tag.tone","expressionPlan":{"source":"row.tag.tone","ast":{"kind":"member","object":{"kind":"member","object":{"kind":"id","name":"row"},"key":"tag"},"key":"tone"},"dependencies":["row.tag.tone"]}},{"kind":"attribute","name":"--ui-badge-color","expression":"row.tag.color","expressionPlan":{"source":"row.tag.color","ast":{"kind":"member","object":{"kind":"member","object":{"kind":"id","name":"row"},"key":"tag"},"key":"color"},"dependencies":["row.tag.color"]},"target":"style"}],"children":[{"kind":"element","name":"span","attributes":[{"kind":"attribute","name":"id","expression":"format('%s-option-%s-tag', uid, row.index)","expressionPlan":{"source":"format('%s-option-%s-tag', uid, row.index)","ast":{"kind":"call","fn":"format","args":[{"kind":"literal","value":"%s-option-%s-tag"},{"kind":"id","name":"uid"},{"kind":"member","object":{"kind":"id","name":"row"},"key":"index"}]},"dependencies":["row.index","uid"]}},{"kind":"directive","name":"value","expression":"row.tag.label","expressionPlan":{"source":"row.tag.label","ast":{"kind":"member","object":{"kind":"member","object":{"kind":"id","name":"row"},"key":"tag"},"key":"label"},"dependencies":["row.tag.label"]}}],"children":[]}],"flow":{"kind":"if","test":"row.tag","testPlan":{"source":"row.tag","ast":{"kind":"member","object":{"kind":"id","name":"row"},"key":"tag"},"dependencies":["row.tag"]}}}]},{"kind":"element","name":"span","attributes":[{"kind":"literal","name":"class","value":"description"},{"kind":"attribute","name":"id","expression":"format('%s-option-%s-description', uid, row.index)","expressionPlan":{"source":"format('%s-option-%s-description', uid, row.index)","ast":{"kind":"call","fn":"format","args":[{"kind":"literal","value":"%s-option-%s-description"},{"kind":"id","name":"uid"},{"kind":"member","object":{"kind":"id","name":"row"},"key":"index"}]},"dependencies":["row.index","uid"]}},{"kind":"directive","name":"value","expression":"row.description","expressionPlan":{"source":"row.description","ast":{"kind":"member","object":{"kind":"id","name":"row"},"key":"description"},"dependencies":["row.description"]}}],"children":[],"flow":{"kind":"if","test":"row.description","testPlan":{"source":"row.description","ast":{"kind":"member","object":{"kind":"id","name":"row"},"key":"description"},"dependencies":["row.description"]}}}],"flow":{"kind":"if","test":"row.detail","testPlan":{"source":"row.detail","ast":{"kind":"member","object":{"kind":"id","name":"row"},"key":"detail"},"dependencies":["row.detail"]}}},{"kind":"element","name":"span","attributes":[{"kind":"literal","name":"class","value":"primary"},{"kind":"directive","name":"value","expression":"row.label","expressionPlan":{"source":"row.label","ast":{"kind":"member","object":{"kind":"id","name":"row"},"key":"label"},"dependencies":["row.label"]}}],"children":[],"flow":{"kind":"if","test":"not row.detail","testPlan":{"source":"not row.detail","ast":{"kind":"unary","op":"not","operand":{"kind":"member","object":{"kind":"id","name":"row"},"key":"detail"}},"dependencies":["row.detail"]}}}],"nameExpression":{"source":"format('option-%s', row.id)","ast":{"kind":"call","fn":"format","args":[{"kind":"literal","value":"option-%s"},{"kind":"member","object":{"kind":"id","name":"row"},"key":"id"}]},"dependencies":["row.id"]}}],"flow":{"kind":"each","item":"row","list":"group.rows","listPlan":{"source":"group.rows","ast":{"kind":"member","object":{"kind":"id","name":"group"},"key":"rows"},"dependencies":["group.rows"]},"key":"row.id","keyPlan":{"source":"row.id","ast":{"kind":"member","object":{"kind":"id","name":"row"},"key":"id"},"dependencies":["row.id"]}}}],"flow":{"kind":"each","item":"group","list":"groups","listPlan":{"source":"groups","ast":{"kind":"id","name":"groups"},"dependencies":["groups"]},"key":"group.name","keyPlan":{"source":"group.name","ast":{"kind":"member","object":{"kind":"id","name":"group"},"key":"name"},"dependencies":["group.name"]}}},{"kind":"element","name":"div","attributes":[{"kind":"literal","name":"class","value":"option"},{"kind":"attribute","name":"active","expression":"createIndex = active","expressionPlan":{"source":"createIndex = active","ast":{"kind":"binary","op":"=","left":{"kind":"id","name":"createIndex"},"right":{"kind":"id","name":"active"}},"dependencies":["active","createIndex"]},"target":"class"},{"kind":"literal","name":"role","value":"option"},{"kind":"literal","name":"aria-selected","value":"false"},{"kind":"attribute","name":"id","expression":"format('%s-option-%s', uid, createIndex)","expressionPlan":{"source":"format('%s-option-%s', uid, createIndex)","ast":{"kind":"call","fn":"format","args":[{"kind":"literal","value":"%s-option-%s"},{"kind":"id","name":"uid"},{"kind":"id","name":"createIndex"}]},"dependencies":["createIndex","uid"]}},{"kind":"attribute","name":"data-index","expression":"createIndex","expressionPlan":{"source":"createIndex","ast":{"kind":"id","name":"createIndex"},"dependencies":["createIndex"]}},{"kind":"directive","name":"value","expression":"format('Create “%s”', raw)","expressionPlan":{"source":"format('Create “%s”', raw)","ast":{"kind":"call","fn":"format","args":[{"kind":"literal","value":"Create “%s”"},{"kind":"id","name":"raw"}]},"dependencies":["raw"]}}],"children":[],"flow":{"kind":"if","test":"creatable","testPlan":{"source":"creatable","ast":{"kind":"id","name":"creatable"},"dependencies":["creatable"]}}},{"kind":"element","name":"div","attributes":[{"kind":"literal","name":"class","value":"message"},{"kind":"directive","name":"value","expression":"message","expressionPlan":{"source":"message","ast":{"kind":"id","name":"message"},"dependencies":["message"]}}],"children":[],"flow":{"kind":"if","test":"message","testPlan":{"source":"message","ast":{"kind":"id","name":"message"},"dependencies":["message"]}}},{"kind":"element","name":"div","attributes":[{"kind":"literal","name":"class","value":"message"}],"children":[{"kind":"slot","fallback":[{"kind":"text","value":"No suggestions."}],"name":"empty"}],"flow":{"kind":"if","test":"not loading and not rows[0] and not creatable and not lookupError","testPlan":{"source":"not loading and not rows[0] and not creatable and not lookupError","ast":{"kind":"binary","op":"and","left":{"kind":"binary","op":"and","left":{"kind":"binary","op":"and","left":{"kind":"unary","op":"not","operand":{"kind":"id","name":"loading"}},"right":{"kind":"unary","op":"not","operand":{"kind":"index","object":{"kind":"id","name":"rows"},"index":{"kind":"literal","value":0}}}},"right":{"kind":"unary","op":"not","operand":{"kind":"id","name":"creatable"}}},"right":{"kind":"unary","op":"not","operand":{"kind":"id","name":"lookupError"}}},"dependencies":["creatable","loading","lookupError","rows.0"]}}}],"ref":"listbox"},{"kind":"slot","fallback":[],"name":"footer"}],"ref":"popup"},{"kind":"element","name":"div","attributes":[{"kind":"literal","name":"class","value":"message"},{"kind":"attribute","name":"id","expression":"format('%s-validation', uid)","expressionPlan":{"source":"format('%s-validation', uid)","ast":{"kind":"call","fn":"format","args":[{"kind":"literal","value":"%s-validation"},{"kind":"id","name":"uid"}]},"dependencies":["uid"]}},{"kind":"attribute","name":"hidden","expression":"not validation.issues.length","expressionPlan":{"source":"not validation.issues.length","ast":{"kind":"unary","op":"not","operand":{"kind":"member","object":{"kind":"member","object":{"kind":"id","name":"validation"},"key":"issues"},"key":"length"}},"dependencies":["validation.issues.length"]}}],"children":[{"kind":"element","name":"div","attributes":[{"kind":"directive","name":"value","expression":"issue.message","expressionPlan":{"source":"issue.message","ast":{"kind":"member","object":{"kind":"id","name":"issue"},"key":"message"},"dependencies":["issue.message"]}}],"children":[],"flow":{"kind":"each","item":"issue","list":"validation.issues","listPlan":{"source":"validation.issues","ast":{"kind":"member","object":{"kind":"id","name":"validation"},"key":"issues"},"dependencies":["validation.issues"]}}}]},{"kind":"element","name":"div","attributes":[{"kind":"literal","name":"class","value":"sr-only"},{"kind":"literal","name":"role","value":"status"},{"kind":"literal","name":"aria-live","value":"polite"},{"kind":"literal","name":"aria-atomic","value":"true"},{"kind":"directive","name":"value","expression":"statusText","expressionPlan":{"source":"statusText","ast":{"kind":"id","name":"statusText"},"dependencies":["statusText"]}}],"children":[]},{"kind":"element","name":"div","attributes":[{"kind":"literal","name":"class","value":"authored-options"},{"kind":"literal","name":"hidden","value":""},{"kind":"literal","name":"aria-hidden","value":"true"}],"children":[{"kind":"slot"}],"ref":"options"}]},"declarations":[{"kind":"state","name":"internalItems","type":"list(object({ id: string, value: string, label: string, group?: string, disabled?: boolean, description?: string, tag?: object({ label: string, tone?: neutral | accent | info | success | warning | danger, color?: string }) }))","expression":{"source":"[]","ast":{"kind":"array","items":[]},"dependencies":[]}},{"kind":"state","name":"raw","expression":{"source":"''","ast":{"kind":"literal","value":""},"dependencies":[]}},{"kind":"state","name":"display","expression":{"source":"''","ast":{"kind":"literal","value":""},"dependencies":[]}},{"kind":"state","name":"selected","type":"string | null","expression":{"source":"null","ast":{"kind":"literal","value":null},"dependencies":[]}},{"kind":"state","name":"expanded","expression":{"source":"false","ast":{"kind":"literal","value":false},"dependencies":[]}},{"kind":"state","name":"rows","type":"list(object({ id: string, value: string, label: string, group?: string, disabled: boolean, selected: boolean, description?: string, tag?: object({ label: string, tone?: neutral | accent | info | success | warning | danger, color?: string }) }))","expression":{"source":"[]","ast":{"kind":"array","items":[]},"dependencies":[]}},{"kind":"state","name":"active","expression":{"source":"-1","ast":{"kind":"unary","op":"-","operand":{"kind":"literal","value":1}},"dependencies":[]}},{"kind":"state","name":"helpOpen","expression":{"source":"false","ast":{"kind":"literal","value":false},"dependencies":[]}},{"kind":"state","name":"lookupError","expression":{"source":"''","ast":{"kind":"literal","value":""},"dependencies":[]}},{"kind":"state","name":"validation","type":"object({ status: pristine | pending | valid | warning | error, touched: boolean, dirty: boolean, issues: list(object({ message: string })), ... })","expression":{"source":"{ status: 'pristine', touched: false, dirty: false, issues: [] }","ast":{"kind":"object","pairs":[{"key":"status","value":{"kind":"literal","value":"pristine"}},{"key":"touched","value":{"kind":"literal","value":false}},{"key":"dirty","value":{"kind":"literal","value":false}},{"key":"issues","value":{"kind":"array","items":[]}}]},"dependencies":[]}},{"kind":"state","name":"uid","expression":{"source":"''","ast":{"kind":"literal","value":""},"dependencies":[]}},{"kind":"state","name":"submitted","expression":{"source":"''","ast":{"kind":"literal","value":""},"dependencies":[]}},{"kind":"state","name":"groups","type":"list(object({ name: string, role: group | presentation, label: string | null, rows: list(object({ id: string, value: string, label: string, group?: string, disabled: boolean, selected: boolean, description?: string, tag?: object({ label: string, tone?: neutral | accent | info | success | warning | danger, color?: string }), index: integer, labelledBy: string | null, detail: string | null })) }))","expression":{"source":"[]","ast":{"kind":"array","items":[]},"dependencies":[]}},{"kind":"state","name":"creatable","expression":{"source":"false","ast":{"kind":"literal","value":false},"dependencies":[]}},{"kind":"state","name":"createIndex","expression":{"source":"0","ast":{"kind":"literal","value":0},"dependencies":[]}},{"kind":"state","name":"message","expression":{"source":"''","ast":{"kind":"literal","value":""},"dependencies":[]}},{"kind":"state","name":"statusText","expression":{"source":"''","ast":{"kind":"literal","value":""},"dependencies":[]}},{"kind":"state","name":"validationStatus","expression":{"source":"'pristine'","ast":{"kind":"literal","value":"pristine"},"dependencies":[]}},{"kind":"event","name":"query-change","type":"object({ query: string, display: string, trigger: keyboard | pointer | programmatic })","bubbles":true,"composed":true,"cancelable":false},{"kind":"event","name":"value-change","type":"object({ value: string | null, query: string, option: object({ id: string, value: string, label: string, group?: string, disabled?: boolean, description?: string, tag?: object({ label: string, tone?: neutral | accent | info | success | warning | danger, color?: string }) }) | null, kind: selection | clear | free-entry | create, trigger: keyboard | pointer | programmatic }) | list(object({ id: string, value: string, label: string, group?: string, disabled?: boolean, description?: string, tag?: object({ label: string, tone?: neutral | accent | info | success | warning | danger, color?: string }) }))","bubbles":true,"composed":true,"cancelable":false},{"kind":"event","name":"free-entry","type":"object({ value: string | null, query: string, option: object({ id: string, value: string, label: string, group?: string, disabled?: boolean, description?: string, tag?: object({ label: string, tone?: neutral | accent | info | success | warning | danger, color?: string }) }) | null, kind: selection | clear | free-entry | create, trigger: keyboard | pointer | programmatic })","bubbles":true,"composed":true,"cancelable":false},{"kind":"event","name":"create-entry","type":"object({ value: string | null, query: string, option: object({ id: string, value: string, label: string, group?: string, disabled?: boolean, description?: string, tag?: object({ label: string, tone?: neutral | accent | info | success | warning | danger, color?: string }) }) | null, kind: selection | clear | free-entry | create, trigger: keyboard | pointer | programmatic })","bubbles":true,"composed":true,"cancelable":false},{"kind":"event","name":"validation-change","type":"object({ status: pristine | pending | valid | warning | error, touched: boolean, dirty: boolean, issues: list(object({ message: string, path?: list(unknown), severity?: error | warning })), output?: unknown })","bubbles":true,"composed":true,"cancelable":false},{"kind":"event","name":"options-change","type":"list(object({ id: string, value: string, label: string, group?: string, disabled?: boolean, description?: string, tag?: object({ label: string, tone?: neutral | accent | info | success | warning | danger, color?: string }) }))","bubbles":true,"composed":true,"cancelable":false},{"kind":"event","name":"add-item","type":"object({ item: object({ id: string, value: string, label: string, group?: string, disabled?: boolean, description?: string, tag?: object({ label: string, tone?: neutral | accent | info | success | warning | danger, color?: string }) }), index: integer, trigger: keyboard | pointer | programmatic })","bubbles":true,"composed":true,"cancelable":false},{"kind":"event","name":"remove-item","type":"object({ item: object({ id: string, value: string, label: string, group?: string, disabled?: boolean, description?: string, tag?: object({ label: string, tone?: neutral | accent | info | success | warning | danger, color?: string }) }), index: integer, trigger: keyboard | pointer | programmatic })","bubbles":true,"composed":true,"cancelable":false},{"kind":"event","name":"create-item","type":"object({ query: string, trigger: keyboard | pointer | programmatic })","bubbles":true,"composed":true,"cancelable":false},{"kind":"event","name":"selected-values-change","type":"object({ selectedValues: list(string), trigger: keyboard | pointer | programmatic })","bubbles":true,"composed":true,"cancelable":false},{"kind":"method","name":"validate","exportName":"validate","returns":"promise(unknown)"},{"kind":"method","name":"focusInput","exportName":"focusInput","returns":"promise(undefined)"}],"root":{"kind":"native","element":"div","choices":["div"]}},source:{file:import.meta.url},css:""};
|
|
6
|
+
const definition = {...{"contract":{"tag":"ui-combobox","props":{"allowCreate":{"type":"boolean","required":false,"target":{"attribute":"allowcreate"},"default":false},"allowFreeText":{"type":"boolean","required":false,"target":{"attribute":"allowfreetext"},"default":false},"clearable":{"type":"boolean","required":false,"target":{"attribute":"clearable"},"default":false},"disabled":{"type":"boolean","required":false,"target":{"attribute":"disabled"},"default":false},"disclosure":{"type":"boolean","required":false,"target":{"attribute":"disclosure"},"default":false},"filter":{"type":{"enum":["label","none"]},"required":false,"target":{"attribute":"filter"},"default":"label"},"help":{"type":"string","required":false,"target":{"attribute":"help"},"default":""},"invalid":{"type":"boolean","required":false,"target":{"attribute":"invalid"},"default":false},"items":{"type":{"kind":"list","item":{"kind":"object","fields":[{"name":"id","type":{"kind":"terminal","name":"string"},"optional":false},{"name":"value","type":{"kind":"terminal","name":"string"},"optional":false},{"name":"label","type":{"kind":"terminal","name":"string"},"optional":false},{"name":"group","type":{"kind":"terminal","name":"string"},"optional":true},{"name":"disabled","type":{"kind":"terminal","name":"boolean"},"optional":true},{"name":"description","type":{"kind":"terminal","name":"string"},"optional":true},{"name":"tag","type":{"kind":"object","fields":[{"name":"label","type":{"kind":"terminal","name":"string"},"optional":false},{"name":"tone","type":{"kind":"union","members":[{"kind":"keyword","value":"neutral"},{"kind":"keyword","value":"accent"},{"kind":"keyword","value":"info"},{"kind":"keyword","value":"success"},{"kind":"keyword","value":"warning"},{"kind":"keyword","value":"danger"}]},"optional":true},{"name":"color","type":{"kind":"terminal","name":"string"},"optional":true}],"open":false},"optional":true}],"open":false}},"required":false,"target":{"attribute":"items"}},"label":{"type":"string","required":false,"target":{"attribute":"label"},"default":""},"labelVisibility":{"type":{"enum":["visible","sr-only"]},"required":false,"target":{"attribute":"labelvisibility"},"default":"visible"},"loading":{"type":"boolean","required":false,"target":{"attribute":"aria-busy"},"default":false},"multiple":{"type":"boolean","required":false,"target":{"attribute":"multiple"},"default":false},"name":{"type":"string","required":false,"target":{"attribute":"name"},"default":""},"openOnFocus":{"type":"boolean","required":false,"target":{"attribute":"openonfocus"},"default":false},"placeholder":{"type":"string","required":false,"target":{"attribute":"placeholder"},"default":""},"query":{"type":"string","required":false,"target":{"attribute":"query"}},"readonly":{"type":"boolean","required":false,"target":{"attribute":"readonly"},"default":false},"required":{"type":"boolean","required":false,"target":{"attribute":"required"},"default":false},"selectedValues":{"type":{"kind":"list","item":{"kind":"terminal","name":"string"}},"required":false,"target":{"attribute":"selectedvalues"}},"size":{"type":{"enum":["sm","md","lg"]},"required":false,"target":{"attribute":"size"},"default":"md"},"tokenSeparators":{"type":{"kind":"list","item":{"kind":"terminal","name":"string"}},"required":false,"target":{"attribute":"tokenseparators"}},"value":{"type":{"kind":"union","members":[{"kind":"terminal","name":"string"},{"kind":"terminal","name":"null"}]},"required":false,"target":{"attribute":"value"}}}},"template":{"kind":"element","name":"div","attributes":[],"children":[{"kind":"element","name":"label","attributes":[{"kind":"attribute","name":"for","expression":"format('%s-input', uid)","expressionPlan":{"source":"format('%s-input', uid)","ast":{"kind":"call","fn":"format","args":[{"kind":"literal","value":"%s-input"},{"kind":"id","name":"uid"}]},"dependencies":["uid"]}},{"kind":"attribute","name":"sr-only","expression":"labelVisibility = 'sr-only'","expressionPlan":{"source":"labelVisibility = 'sr-only'","ast":{"kind":"binary","op":"=","left":{"kind":"id","name":"labelVisibility"},"right":{"kind":"literal","value":"sr-only"}},"dependencies":["labelVisibility"]},"target":"class"}],"children":[{"kind":"element","name":"template","attributes":[{"kind":"directive","name":"value","expression":"label","expressionPlan":{"source":"label","ast":{"kind":"id","name":"label"},"dependencies":["label"]}}],"children":[]},{"kind":"element","name":"template","attributes":[],"children":[{"kind":"text","value":"\n *"}],"flow":{"kind":"if","test":"required","testPlan":{"source":"required","ast":{"kind":"id","name":"required"},"dependencies":["required"]}}}]},{"kind":"element","name":"div","attributes":[{"kind":"literal","name":"class","value":"control"}],"children":[{"kind":"element","name":"div","attributes":[{"kind":"literal","name":"class","value":"field"}],"children":[{"kind":"element","name":"div","attributes":[{"kind":"literal","name":"class","value":"entry"}],"children":[{"kind":"slot","fallback":[],"name":"start"},{"kind":"element","name":"template","attributes":[],"children":[{"kind":"element","name":"button","attributes":[{"kind":"literal","name":"class","value":"item"},{"kind":"literal","name":"type","value":"button"},{"kind":"literal","name":"tabindex","value":"-1"},{"kind":"attribute","name":"data-index","expression":"index","expressionPlan":{"source":"index","ast":{"kind":"id","name":"index"},"dependencies":["index"]}},{"kind":"attribute","name":"disabled","expression":"disabled or readonly or item.disabled","expressionPlan":{"source":"disabled or readonly or item.disabled","ast":{"kind":"binary","op":"or","left":{"kind":"binary","op":"or","left":{"kind":"id","name":"disabled"},"right":{"kind":"id","name":"readonly"}},"right":{"kind":"member","object":{"kind":"id","name":"item"},"key":"disabled"}},"dependencies":["disabled","item.disabled","readonly"]}},{"kind":"attribute","name":"aria-label","expression":"format('%s, press Delete or Backspace to remove', item.label)","expressionPlan":{"source":"format('%s, press Delete or Backspace to remove', item.label)","ast":{"kind":"call","fn":"format","args":[{"kind":"literal","value":"%s, press Delete or Backspace to remove"},{"kind":"member","object":{"kind":"id","name":"item"},"key":"label"}]},"dependencies":["item.label"]}}],"children":[{"kind":"slot","fallback":[{"kind":"element","name":"ui-badge","attributes":[{"kind":"directive","name":"value","expression":"item.label","expressionPlan":{"source":"item.label","ast":{"kind":"member","object":{"kind":"id","name":"item"},"key":"label"},"dependencies":["item.label"]}}],"children":[]}],"nameExpression":{"source":"format('item-%s', item.id)","ast":{"kind":"call","fn":"format","args":[{"kind":"literal","value":"item-%s"},{"kind":"member","object":{"kind":"id","name":"item"},"key":"id"}]},"dependencies":["item.id"]}}],"flow":{"kind":"each","item":"item","list":"internalItems","listPlan":{"source":"internalItems","ast":{"kind":"id","name":"internalItems"},"dependencies":["internalItems"]},"index":"index","key":"item.id","keyPlan":{"source":"item.id","ast":{"kind":"member","object":{"kind":"id","name":"item"},"key":"id"},"dependencies":["item.id"]}}}],"flow":{"kind":"if","test":"multiple","testPlan":{"source":"multiple","ast":{"kind":"id","name":"multiple"},"dependencies":["multiple"]}}},{"kind":"element","name":"input","attributes":[{"kind":"attribute","name":"id","expression":"format('%s-input', uid)","expressionPlan":{"source":"format('%s-input', uid)","ast":{"kind":"call","fn":"format","args":[{"kind":"literal","value":"%s-input"},{"kind":"id","name":"uid"}]},"dependencies":["uid"]}},{"kind":"literal","name":"role","value":"combobox"},{"kind":"literal","name":"aria-autocomplete","value":"list"},{"kind":"literal","name":"autocomplete","value":"off"},{"kind":"attribute","name":"aria-controls","expression":"format('%s-listbox', uid)","expressionPlan":{"source":"format('%s-listbox', uid)","ast":{"kind":"call","fn":"format","args":[{"kind":"literal","value":"%s-listbox"},{"kind":"id","name":"uid"}]},"dependencies":["uid"]}},{"kind":"attribute","name":"aria-expanded","expression":"expanded","expressionPlan":{"source":"expanded","ast":{"kind":"id","name":"expanded"},"dependencies":["expanded"]}},{"kind":"attribute","name":"aria-invalid","expression":"invalid or validationStatus = 'error'","expressionPlan":{"source":"invalid or validationStatus = 'error'","ast":{"kind":"binary","op":"or","left":{"kind":"id","name":"invalid"},"right":{"kind":"binary","op":"=","left":{"kind":"id","name":"validationStatus"},"right":{"kind":"literal","value":"error"}}},"dependencies":["invalid","validationStatus"]}},{"kind":"attribute","name":"aria-busy","expression":"loading or validationStatus = 'pending'","expressionPlan":{"source":"loading or validationStatus = 'pending'","ast":{"kind":"binary","op":"or","left":{"kind":"id","name":"loading"},"right":{"kind":"binary","op":"=","left":{"kind":"id","name":"validationStatus"},"right":{"kind":"literal","value":"pending"}}},"dependencies":["loading","validationStatus"]}},{"kind":"property","key":"value","name":"value","expression":"display","expressionPlan":{"source":"display","ast":{"kind":"id","name":"display"},"dependencies":["display"]}},{"kind":"attribute","name":"placeholder","expression":"placeholder","expressionPlan":{"source":"placeholder","ast":{"kind":"id","name":"placeholder"},"dependencies":["placeholder"]}},{"kind":"attribute","name":"disabled","expression":"disabled","expressionPlan":{"source":"disabled","ast":{"kind":"id","name":"disabled"},"dependencies":["disabled"]}},{"kind":"attribute","name":"readonly","expression":"readonly","expressionPlan":{"source":"readonly","ast":{"kind":"id","name":"readonly"},"dependencies":["readonly"]}},{"kind":"attribute","name":"required","expression":"required and not (multiple and internalItems[0])","expressionPlan":{"source":"required and not (multiple and internalItems[0])","ast":{"kind":"binary","op":"and","left":{"kind":"id","name":"required"},"right":{"kind":"unary","op":"not","operand":{"kind":"binary","op":"and","left":{"kind":"id","name":"multiple"},"right":{"kind":"index","object":{"kind":"id","name":"internalItems"},"index":{"kind":"literal","value":0}}}}},"dependencies":["internalItems.0","multiple","required"]}}],"children":[],"ref":"input"}]},{"kind":"element","name":"input","attributes":[{"kind":"literal","name":"type","value":"hidden"},{"kind":"attribute","name":"name","expression":"name","expressionPlan":{"source":"name","ast":{"kind":"id","name":"name"},"dependencies":["name"]}},{"kind":"attribute","name":"value","expression":"submitted","expressionPlan":{"source":"submitted","ast":{"kind":"id","name":"submitted"},"dependencies":["submitted"]}},{"kind":"attribute","name":"disabled","expression":"disabled","expressionPlan":{"source":"disabled","ast":{"kind":"id","name":"disabled"},"dependencies":["disabled"]}}],"children":[],"flow":{"kind":"if","test":"name and not multiple","testPlan":{"source":"name and not multiple","ast":{"kind":"binary","op":"and","left":{"kind":"id","name":"name"},"right":{"kind":"unary","op":"not","operand":{"kind":"id","name":"multiple"}}},"dependencies":["multiple","name"]}}},{"kind":"element","name":"template","attributes":[],"children":[{"kind":"element","name":"input","attributes":[{"kind":"literal","name":"type","value":"hidden"},{"kind":"attribute","name":"name","expression":"name","expressionPlan":{"source":"name","ast":{"kind":"id","name":"name"},"dependencies":["name"]}},{"kind":"attribute","name":"value","expression":"item.value","expressionPlan":{"source":"item.value","ast":{"kind":"member","object":{"kind":"id","name":"item"},"key":"value"},"dependencies":["item.value"]}},{"kind":"attribute","name":"disabled","expression":"disabled","expressionPlan":{"source":"disabled","ast":{"kind":"id","name":"disabled"},"dependencies":["disabled"]}}],"children":[],"flow":{"kind":"each","item":"item","list":"internalItems","listPlan":{"source":"internalItems","ast":{"kind":"id","name":"internalItems"},"dependencies":["internalItems"]},"key":"item.id","keyPlan":{"source":"item.id","ast":{"kind":"member","object":{"kind":"id","name":"item"},"key":"id"},"dependencies":["item.id"]}}}],"flow":{"kind":"if","test":"name and multiple","testPlan":{"source":"name and multiple","ast":{"kind":"binary","op":"and","left":{"kind":"id","name":"name"},"right":{"kind":"id","name":"multiple"}},"dependencies":["multiple","name"]}}},{"kind":"element","name":"button","attributes":[{"kind":"literal","name":"type","value":"button"},{"kind":"literal","name":"data-combobox-action","value":"clear"},{"kind":"literal","name":"aria-label","value":"Clear"},{"kind":"attribute","name":"disabled","expression":"disabled or readonly or (not raw and (multiple or selected = null))","expressionPlan":{"source":"disabled or readonly or (not raw and (multiple or selected = null))","ast":{"kind":"binary","op":"or","left":{"kind":"binary","op":"or","left":{"kind":"id","name":"disabled"},"right":{"kind":"id","name":"readonly"}},"right":{"kind":"binary","op":"and","left":{"kind":"unary","op":"not","operand":{"kind":"id","name":"raw"}},"right":{"kind":"binary","op":"or","left":{"kind":"id","name":"multiple"},"right":{"kind":"binary","op":"=","left":{"kind":"id","name":"selected"},"right":{"kind":"literal","value":null}}}}},"dependencies":["disabled","multiple","raw","readonly","selected"]}}],"children":[{"kind":"element","name":"svg","attributes":[{"kind":"literal","name":"class","value":"affordance-icon"},{"kind":"literal","name":"aria-hidden","value":"true"},{"kind":"literal","name":"viewBox","value":"0 0 24 24"},{"kind":"literal","name":"fill","value":"none"},{"kind":"literal","name":"stroke","value":"currentColor"},{"kind":"literal","name":"stroke-width","value":"2"},{"kind":"literal","name":"stroke-linecap","value":"round"}],"children":[{"kind":"element","name":"path","attributes":[{"kind":"literal","name":"d","value":"M7 7l10 10M17 7 7 17"}],"children":[]}]}],"flow":{"kind":"if","test":"clearable","testPlan":{"source":"clearable","ast":{"kind":"id","name":"clearable"},"dependencies":["clearable"]}}},{"kind":"element","name":"button","attributes":[{"kind":"literal","name":"type","value":"button"},{"kind":"literal","name":"data-combobox-action","value":"disclosure"},{"kind":"literal","name":"tabindex","value":"-1"},{"kind":"literal","name":"aria-label","value":"Show suggestions"},{"kind":"attribute","name":"aria-controls","expression":"format('%s-listbox', uid)","expressionPlan":{"source":"format('%s-listbox', uid)","ast":{"kind":"call","fn":"format","args":[{"kind":"literal","value":"%s-listbox"},{"kind":"id","name":"uid"}]},"dependencies":["uid"]}},{"kind":"attribute","name":"disabled","expression":"disabled or readonly","expressionPlan":{"source":"disabled or readonly","ast":{"kind":"binary","op":"or","left":{"kind":"id","name":"disabled"},"right":{"kind":"id","name":"readonly"}},"dependencies":["disabled","readonly"]}}],"children":[{"kind":"element","name":"svg","attributes":[{"kind":"literal","name":"class","value":"affordance-icon"},{"kind":"literal","name":"aria-hidden","value":"true"},{"kind":"literal","name":"viewBox","value":"0 0 24 24"},{"kind":"literal","name":"fill","value":"none"},{"kind":"literal","name":"stroke","value":"currentColor"},{"kind":"literal","name":"stroke-width","value":"2.25"},{"kind":"literal","name":"stroke-linecap","value":"round"},{"kind":"literal","name":"stroke-linejoin","value":"round"}],"children":[{"kind":"element","name":"path","attributes":[{"kind":"literal","name":"d","value":"m6 9 6 6 6-6"}],"children":[]}]}],"flow":{"kind":"if","test":"disclosure","testPlan":{"source":"disclosure","ast":{"kind":"id","name":"disclosure"},"dependencies":["disclosure"]}}}],"ref":"field"},{"kind":"element","name":"button","attributes":[{"kind":"literal","name":"class","value":"help"},{"kind":"attribute","name":"id","expression":"format('%s-help', uid)","expressionPlan":{"source":"format('%s-help', uid)","ast":{"kind":"call","fn":"format","args":[{"kind":"literal","value":"%s-help"},{"kind":"id","name":"uid"}]},"dependencies":["uid"]}},{"kind":"literal","name":"type","value":"button"},{"kind":"literal","name":"aria-label","value":"Help"},{"kind":"attribute","name":"disabled","expression":"disabled","expressionPlan":{"source":"disabled","ast":{"kind":"id","name":"disabled"},"dependencies":["disabled"]}}],"children":[{"kind":"element","name":"svg","attributes":[{"kind":"literal","name":"class","value":"help-icon"},{"kind":"literal","name":"aria-hidden","value":"true"},{"kind":"literal","name":"viewBox","value":"0 0 24 24"},{"kind":"literal","name":"fill","value":"none"},{"kind":"literal","name":"stroke","value":"currentColor"},{"kind":"literal","name":"stroke-width","value":"2"},{"kind":"literal","name":"stroke-linecap","value":"round"},{"kind":"literal","name":"stroke-linejoin","value":"round"}],"children":[{"kind":"element","name":"circle","attributes":[{"kind":"literal","name":"cx","value":"12"},{"kind":"literal","name":"cy","value":"12"},{"kind":"literal","name":"r","value":"10"}],"children":[]},{"kind":"element","name":"path","attributes":[{"kind":"literal","name":"d","value":"M9.1 9a3 3 0 0 1 5.8 1c0 2-3 3-3 3"}],"children":[]},{"kind":"element","name":"path","attributes":[{"kind":"literal","name":"d","value":"M12 17h.01"}],"children":[]}]}],"flow":{"kind":"if","test":"help","testPlan":{"source":"help","ast":{"kind":"id","name":"help"},"dependencies":["help"]}}}]},{"kind":"element","name":"ui-tooltip","attributes":[{"kind":"literal","name":"trigger","value":"click"},{"kind":"attribute","name":"id","expression":"format('%s-help-text', uid)","expressionPlan":{"source":"format('%s-help-text', uid)","ast":{"kind":"call","fn":"format","args":[{"kind":"literal","value":"%s-help-text"},{"kind":"id","name":"uid"}]},"dependencies":["uid"]}},{"kind":"attribute","name":"for","expression":"format('%s-help', uid)","expressionPlan":{"source":"format('%s-help', uid)","ast":{"kind":"call","fn":"format","args":[{"kind":"literal","value":"%s-help"},{"kind":"id","name":"uid"}]},"dependencies":["uid"]}}],"children":[{"kind":"element","name":"template","attributes":[{"kind":"directive","name":"value","expression":"help","expressionPlan":{"source":"help","ast":{"kind":"id","name":"help"},"dependencies":["help"]}}],"children":[]}],"flow":{"kind":"if","test":"help","testPlan":{"source":"help","ast":{"kind":"id","name":"help"},"dependencies":["help"]}}},{"kind":"element","name":"div","attributes":[{"kind":"literal","name":"class","value":"popup"},{"kind":"attribute","name":"hidden","expression":"not expanded","expressionPlan":{"source":"not expanded","ast":{"kind":"unary","op":"not","operand":{"kind":"id","name":"expanded"}},"dependencies":["expanded"]}}],"children":[{"kind":"element","name":"div","attributes":[{"kind":"literal","name":"role","value":"listbox"},{"kind":"attribute","name":"id","expression":"format('%s-listbox', uid)","expressionPlan":{"source":"format('%s-listbox', uid)","ast":{"kind":"call","fn":"format","args":[{"kind":"literal","value":"%s-listbox"},{"kind":"id","name":"uid"}]},"dependencies":["uid"]}},{"kind":"attribute","name":"aria-label","expression":"format('%s suggestions', label)","expressionPlan":{"source":"format('%s suggestions', label)","ast":{"kind":"call","fn":"format","args":[{"kind":"literal","value":"%s suggestions"},{"kind":"id","name":"label"}]},"dependencies":["label"]}},{"kind":"attribute","name":"aria-busy","expression":"loading","expressionPlan":{"source":"loading","ast":{"kind":"id","name":"loading"},"dependencies":["loading"]}}],"children":[{"kind":"element","name":"div","attributes":[{"kind":"attribute","name":"role","expression":"group.role","expressionPlan":{"source":"group.role","ast":{"kind":"member","object":{"kind":"id","name":"group"},"key":"role"},"dependencies":["group.role"]}},{"kind":"attribute","name":"aria-label","expression":"group.label","expressionPlan":{"source":"group.label","ast":{"kind":"member","object":{"kind":"id","name":"group"},"key":"label"},"dependencies":["group.label"]}}],"children":[{"kind":"element","name":"div","attributes":[{"kind":"literal","name":"class","value":"group"},{"kind":"directive","name":"value","expression":"group.name","expressionPlan":{"source":"group.name","ast":{"kind":"member","object":{"kind":"id","name":"group"},"key":"name"},"dependencies":["group.name"]}}],"children":[],"flow":{"kind":"if","test":"group.name","testPlan":{"source":"group.name","ast":{"kind":"member","object":{"kind":"id","name":"group"},"key":"name"},"dependencies":["group.name"]}}},{"kind":"element","name":"div","attributes":[{"kind":"literal","name":"class","value":"option"},{"kind":"attribute","name":"active","expression":"row.index = active","expressionPlan":{"source":"row.index = active","ast":{"kind":"binary","op":"=","left":{"kind":"member","object":{"kind":"id","name":"row"},"key":"index"},"right":{"kind":"id","name":"active"}},"dependencies":["active","row.index"]},"target":"class"},{"kind":"literal","name":"role","value":"option"},{"kind":"attribute","name":"id","expression":"format('%s-option-%s', uid, row.index)","expressionPlan":{"source":"format('%s-option-%s', uid, row.index)","ast":{"kind":"call","fn":"format","args":[{"kind":"literal","value":"%s-option-%s"},{"kind":"id","name":"uid"},{"kind":"member","object":{"kind":"id","name":"row"},"key":"index"}]},"dependencies":["row.index","uid"]}},{"kind":"attribute","name":"aria-selected","expression":"row.selected","expressionPlan":{"source":"row.selected","ast":{"kind":"member","object":{"kind":"id","name":"row"},"key":"selected"},"dependencies":["row.selected"]}},{"kind":"attribute","name":"aria-disabled","expression":"row.disabled","expressionPlan":{"source":"row.disabled","ast":{"kind":"member","object":{"kind":"id","name":"row"},"key":"disabled"},"dependencies":["row.disabled"]}},{"kind":"attribute","name":"data-index","expression":"row.index","expressionPlan":{"source":"row.index","ast":{"kind":"member","object":{"kind":"id","name":"row"},"key":"index"},"dependencies":["row.index"]}},{"kind":"attribute","name":"aria-labelledby","expression":"row.labelledBy","expressionPlan":{"source":"row.labelledBy","ast":{"kind":"member","object":{"kind":"id","name":"row"},"key":"labelledBy"},"dependencies":["row.labelledBy"]}},{"kind":"attribute","name":"aria-describedby","expression":"row.detail","expressionPlan":{"source":"row.detail","ast":{"kind":"member","object":{"kind":"id","name":"row"},"key":"detail"},"dependencies":["row.detail"]}}],"children":[{"kind":"slot","fallback":[{"kind":"element","name":"span","attributes":[{"kind":"literal","name":"class","value":"detail"}],"children":[{"kind":"element","name":"span","attributes":[{"kind":"literal","name":"class","value":"line"}],"children":[{"kind":"element","name":"span","attributes":[{"kind":"literal","name":"class","value":"primary"},{"kind":"attribute","name":"id","expression":"format('%s-option-%s-label', uid, row.index)","expressionPlan":{"source":"format('%s-option-%s-label', uid, row.index)","ast":{"kind":"call","fn":"format","args":[{"kind":"literal","value":"%s-option-%s-label"},{"kind":"id","name":"uid"},{"kind":"member","object":{"kind":"id","name":"row"},"key":"index"}]},"dependencies":["row.index","uid"]}},{"kind":"directive","name":"value","expression":"row.label","expressionPlan":{"source":"row.label","ast":{"kind":"member","object":{"kind":"id","name":"row"},"key":"label"},"dependencies":["row.label"]}}],"children":[]},{"kind":"element","name":"ui-badge","attributes":[{"kind":"attribute","name":"tone","expression":"row.tag.tone","expressionPlan":{"source":"row.tag.tone","ast":{"kind":"member","object":{"kind":"member","object":{"kind":"id","name":"row"},"key":"tag"},"key":"tone"},"dependencies":["row.tag.tone"]}},{"kind":"attribute","name":"--ui-badge-color","expression":"row.tag.color","expressionPlan":{"source":"row.tag.color","ast":{"kind":"member","object":{"kind":"member","object":{"kind":"id","name":"row"},"key":"tag"},"key":"color"},"dependencies":["row.tag.color"]},"target":"style"}],"children":[{"kind":"element","name":"span","attributes":[{"kind":"attribute","name":"id","expression":"format('%s-option-%s-tag', uid, row.index)","expressionPlan":{"source":"format('%s-option-%s-tag', uid, row.index)","ast":{"kind":"call","fn":"format","args":[{"kind":"literal","value":"%s-option-%s-tag"},{"kind":"id","name":"uid"},{"kind":"member","object":{"kind":"id","name":"row"},"key":"index"}]},"dependencies":["row.index","uid"]}},{"kind":"directive","name":"value","expression":"row.tag.label","expressionPlan":{"source":"row.tag.label","ast":{"kind":"member","object":{"kind":"member","object":{"kind":"id","name":"row"},"key":"tag"},"key":"label"},"dependencies":["row.tag.label"]}}],"children":[]}],"flow":{"kind":"if","test":"row.tag","testPlan":{"source":"row.tag","ast":{"kind":"member","object":{"kind":"id","name":"row"},"key":"tag"},"dependencies":["row.tag"]}}}]},{"kind":"element","name":"span","attributes":[{"kind":"literal","name":"class","value":"description"},{"kind":"attribute","name":"id","expression":"format('%s-option-%s-description', uid, row.index)","expressionPlan":{"source":"format('%s-option-%s-description', uid, row.index)","ast":{"kind":"call","fn":"format","args":[{"kind":"literal","value":"%s-option-%s-description"},{"kind":"id","name":"uid"},{"kind":"member","object":{"kind":"id","name":"row"},"key":"index"}]},"dependencies":["row.index","uid"]}},{"kind":"directive","name":"value","expression":"row.description","expressionPlan":{"source":"row.description","ast":{"kind":"member","object":{"kind":"id","name":"row"},"key":"description"},"dependencies":["row.description"]}}],"children":[],"flow":{"kind":"if","test":"row.description","testPlan":{"source":"row.description","ast":{"kind":"member","object":{"kind":"id","name":"row"},"key":"description"},"dependencies":["row.description"]}}}],"flow":{"kind":"if","test":"row.detail","testPlan":{"source":"row.detail","ast":{"kind":"member","object":{"kind":"id","name":"row"},"key":"detail"},"dependencies":["row.detail"]}}},{"kind":"element","name":"span","attributes":[{"kind":"literal","name":"class","value":"primary"},{"kind":"directive","name":"value","expression":"row.label","expressionPlan":{"source":"row.label","ast":{"kind":"member","object":{"kind":"id","name":"row"},"key":"label"},"dependencies":["row.label"]}}],"children":[],"flow":{"kind":"if","test":"not row.detail","testPlan":{"source":"not row.detail","ast":{"kind":"unary","op":"not","operand":{"kind":"member","object":{"kind":"id","name":"row"},"key":"detail"}},"dependencies":["row.detail"]}}}],"nameExpression":{"source":"format('option-%s', row.id)","ast":{"kind":"call","fn":"format","args":[{"kind":"literal","value":"option-%s"},{"kind":"member","object":{"kind":"id","name":"row"},"key":"id"}]},"dependencies":["row.id"]}}],"flow":{"kind":"each","item":"row","list":"group.rows","listPlan":{"source":"group.rows","ast":{"kind":"member","object":{"kind":"id","name":"group"},"key":"rows"},"dependencies":["group.rows"]},"key":"row.id","keyPlan":{"source":"row.id","ast":{"kind":"member","object":{"kind":"id","name":"row"},"key":"id"},"dependencies":["row.id"]}}}],"flow":{"kind":"each","item":"group","list":"groups","listPlan":{"source":"groups","ast":{"kind":"id","name":"groups"},"dependencies":["groups"]},"key":"group.name","keyPlan":{"source":"group.name","ast":{"kind":"member","object":{"kind":"id","name":"group"},"key":"name"},"dependencies":["group.name"]}}},{"kind":"element","name":"div","attributes":[{"kind":"literal","name":"class","value":"option"},{"kind":"attribute","name":"active","expression":"createIndex = active","expressionPlan":{"source":"createIndex = active","ast":{"kind":"binary","op":"=","left":{"kind":"id","name":"createIndex"},"right":{"kind":"id","name":"active"}},"dependencies":["active","createIndex"]},"target":"class"},{"kind":"literal","name":"role","value":"option"},{"kind":"literal","name":"aria-selected","value":"false"},{"kind":"attribute","name":"id","expression":"format('%s-option-%s', uid, createIndex)","expressionPlan":{"source":"format('%s-option-%s', uid, createIndex)","ast":{"kind":"call","fn":"format","args":[{"kind":"literal","value":"%s-option-%s"},{"kind":"id","name":"uid"},{"kind":"id","name":"createIndex"}]},"dependencies":["createIndex","uid"]}},{"kind":"attribute","name":"data-index","expression":"createIndex","expressionPlan":{"source":"createIndex","ast":{"kind":"id","name":"createIndex"},"dependencies":["createIndex"]}},{"kind":"directive","name":"value","expression":"format('Create “%s”', raw)","expressionPlan":{"source":"format('Create “%s”', raw)","ast":{"kind":"call","fn":"format","args":[{"kind":"literal","value":"Create “%s”"},{"kind":"id","name":"raw"}]},"dependencies":["raw"]}}],"children":[],"flow":{"kind":"if","test":"creatable","testPlan":{"source":"creatable","ast":{"kind":"id","name":"creatable"},"dependencies":["creatable"]}}},{"kind":"element","name":"div","attributes":[{"kind":"literal","name":"class","value":"message"},{"kind":"directive","name":"value","expression":"message","expressionPlan":{"source":"message","ast":{"kind":"id","name":"message"},"dependencies":["message"]}}],"children":[],"flow":{"kind":"if","test":"message","testPlan":{"source":"message","ast":{"kind":"id","name":"message"},"dependencies":["message"]}}},{"kind":"element","name":"div","attributes":[{"kind":"literal","name":"class","value":"message"}],"children":[{"kind":"slot","fallback":[{"kind":"text","value":"No suggestions."}],"name":"empty"}],"flow":{"kind":"if","test":"not loading and not rows[0] and not creatable and not lookupError","testPlan":{"source":"not loading and not rows[0] and not creatable and not lookupError","ast":{"kind":"binary","op":"and","left":{"kind":"binary","op":"and","left":{"kind":"binary","op":"and","left":{"kind":"unary","op":"not","operand":{"kind":"id","name":"loading"}},"right":{"kind":"unary","op":"not","operand":{"kind":"index","object":{"kind":"id","name":"rows"},"index":{"kind":"literal","value":0}}}},"right":{"kind":"unary","op":"not","operand":{"kind":"id","name":"creatable"}}},"right":{"kind":"unary","op":"not","operand":{"kind":"id","name":"lookupError"}}},"dependencies":["creatable","loading","lookupError","rows.0"]}}}],"ref":"listbox"},{"kind":"slot","fallback":[],"name":"footer"}],"ref":"popup"},{"kind":"element","name":"div","attributes":[{"kind":"literal","name":"class","value":"message"},{"kind":"attribute","name":"id","expression":"format('%s-validation', uid)","expressionPlan":{"source":"format('%s-validation', uid)","ast":{"kind":"call","fn":"format","args":[{"kind":"literal","value":"%s-validation"},{"kind":"id","name":"uid"}]},"dependencies":["uid"]}},{"kind":"attribute","name":"hidden","expression":"not validation.issues.length","expressionPlan":{"source":"not validation.issues.length","ast":{"kind":"unary","op":"not","operand":{"kind":"member","object":{"kind":"member","object":{"kind":"id","name":"validation"},"key":"issues"},"key":"length"}},"dependencies":["validation.issues.length"]}}],"children":[{"kind":"element","name":"div","attributes":[{"kind":"directive","name":"value","expression":"issue.message","expressionPlan":{"source":"issue.message","ast":{"kind":"member","object":{"kind":"id","name":"issue"},"key":"message"},"dependencies":["issue.message"]}}],"children":[],"flow":{"kind":"each","item":"issue","list":"validation.issues","listPlan":{"source":"validation.issues","ast":{"kind":"member","object":{"kind":"id","name":"validation"},"key":"issues"},"dependencies":["validation.issues"]}}}]},{"kind":"element","name":"div","attributes":[{"kind":"literal","name":"class","value":"sr-only"},{"kind":"literal","name":"role","value":"status"},{"kind":"literal","name":"aria-live","value":"polite"},{"kind":"literal","name":"aria-atomic","value":"true"},{"kind":"directive","name":"value","expression":"statusText","expressionPlan":{"source":"statusText","ast":{"kind":"id","name":"statusText"},"dependencies":["statusText"]}}],"children":[]},{"kind":"element","name":"div","attributes":[{"kind":"literal","name":"class","value":"authored-options"},{"kind":"literal","name":"hidden","value":""},{"kind":"literal","name":"aria-hidden","value":"true"}],"children":[{"kind":"slot"}],"ref":"options"}]},"declarations":[{"kind":"state","name":"internalItems","type":"list(object({ id: string, value: string, label: string, group?: string, disabled?: boolean, description?: string, tag?: object({ label: string, tone?: neutral | accent | info | success | warning | danger, color?: string }) }))","expression":{"source":"[]","ast":{"kind":"array","items":[]},"dependencies":[]}},{"kind":"state","name":"raw","expression":{"source":"''","ast":{"kind":"literal","value":""},"dependencies":[]}},{"kind":"state","name":"display","expression":{"source":"''","ast":{"kind":"literal","value":""},"dependencies":[]}},{"kind":"state","name":"selected","type":"string | null","expression":{"source":"null","ast":{"kind":"literal","value":null},"dependencies":[]}},{"kind":"state","name":"expanded","expression":{"source":"false","ast":{"kind":"literal","value":false},"dependencies":[]}},{"kind":"state","name":"rows","type":"list(object({ id: string, value: string, label: string, group?: string, disabled: boolean, selected: boolean, description?: string, tag?: object({ label: string, tone?: neutral | accent | info | success | warning | danger, color?: string }) }))","expression":{"source":"[]","ast":{"kind":"array","items":[]},"dependencies":[]}},{"kind":"state","name":"active","expression":{"source":"-1","ast":{"kind":"unary","op":"-","operand":{"kind":"literal","value":1}},"dependencies":[]}},{"kind":"state","name":"helpOpen","expression":{"source":"false","ast":{"kind":"literal","value":false},"dependencies":[]}},{"kind":"state","name":"lookupError","expression":{"source":"''","ast":{"kind":"literal","value":""},"dependencies":[]}},{"kind":"state","name":"validation","type":"object({ status: pristine | pending | valid | warning | error, touched: boolean, dirty: boolean, issues: list(object({ message: string })), ... })","expression":{"source":"{ status: 'pristine', touched: false, dirty: false, issues: [] }","ast":{"kind":"object","pairs":[{"key":"status","value":{"kind":"literal","value":"pristine"}},{"key":"touched","value":{"kind":"literal","value":false}},{"key":"dirty","value":{"kind":"literal","value":false}},{"key":"issues","value":{"kind":"array","items":[]}}]},"dependencies":[]}},{"kind":"state","name":"uid","expression":{"source":"''","ast":{"kind":"literal","value":""},"dependencies":[]}},{"kind":"state","name":"submitted","expression":{"source":"''","ast":{"kind":"literal","value":""},"dependencies":[]}},{"kind":"state","name":"groups","type":"list(object({ name: string, role: group | presentation, label: string | null, rows: list(object({ id: string, value: string, label: string, group?: string, disabled: boolean, selected: boolean, description?: string, tag?: object({ label: string, tone?: neutral | accent | info | success | warning | danger, color?: string }), index: integer, labelledBy: string | null, detail: string | null })) }))","expression":{"source":"[]","ast":{"kind":"array","items":[]},"dependencies":[]}},{"kind":"state","name":"creatable","expression":{"source":"false","ast":{"kind":"literal","value":false},"dependencies":[]}},{"kind":"state","name":"createIndex","expression":{"source":"0","ast":{"kind":"literal","value":0},"dependencies":[]}},{"kind":"state","name":"message","expression":{"source":"''","ast":{"kind":"literal","value":""},"dependencies":[]}},{"kind":"state","name":"statusText","expression":{"source":"''","ast":{"kind":"literal","value":""},"dependencies":[]}},{"kind":"state","name":"validationStatus","expression":{"source":"'pristine'","ast":{"kind":"literal","value":"pristine"},"dependencies":[]}},{"kind":"event","name":"query-change","type":"object({ query: string, display: string, trigger: keyboard | pointer | programmatic })","bubbles":true,"composed":true,"cancelable":false},{"kind":"event","name":"value-change","type":"object({ value: string | null, query: string, option: object({ id: string, value: string, label: string, group?: string, disabled?: boolean, description?: string, tag?: object({ label: string, tone?: neutral | accent | info | success | warning | danger, color?: string }) }) | null, kind: selection | clear | free-entry | create, trigger: keyboard | pointer | programmatic }) | list(object({ id: string, value: string, label: string, group?: string, disabled?: boolean, description?: string, tag?: object({ label: string, tone?: neutral | accent | info | success | warning | danger, color?: string }) }))","bubbles":true,"composed":true,"cancelable":false},{"kind":"event","name":"free-entry","type":"object({ value: string | null, query: string, option: object({ id: string, value: string, label: string, group?: string, disabled?: boolean, description?: string, tag?: object({ label: string, tone?: neutral | accent | info | success | warning | danger, color?: string }) }) | null, kind: selection | clear | free-entry | create, trigger: keyboard | pointer | programmatic })","bubbles":true,"composed":true,"cancelable":false},{"kind":"event","name":"create-entry","type":"object({ value: string | null, query: string, option: object({ id: string, value: string, label: string, group?: string, disabled?: boolean, description?: string, tag?: object({ label: string, tone?: neutral | accent | info | success | warning | danger, color?: string }) }) | null, kind: selection | clear | free-entry | create, trigger: keyboard | pointer | programmatic })","bubbles":true,"composed":true,"cancelable":false},{"kind":"event","name":"validation-change","type":"object({ status: pristine | pending | valid | warning | error, touched: boolean, dirty: boolean, issues: list(object({ message: string, path?: list(unknown), severity?: error | warning })), output?: unknown })","bubbles":true,"composed":true,"cancelable":false},{"kind":"event","name":"options-change","type":"list(object({ id: string, value: string, label: string, group?: string, disabled?: boolean, description?: string, tag?: object({ label: string, tone?: neutral | accent | info | success | warning | danger, color?: string }) }))","bubbles":true,"composed":true,"cancelable":false},{"kind":"event","name":"add-item","type":"object({ item: object({ id: string, value: string, label: string, group?: string, disabled?: boolean, description?: string, tag?: object({ label: string, tone?: neutral | accent | info | success | warning | danger, color?: string }) }), index: integer, trigger: keyboard | pointer | programmatic })","bubbles":true,"composed":true,"cancelable":false},{"kind":"event","name":"remove-item","type":"object({ item: object({ id: string, value: string, label: string, group?: string, disabled?: boolean, description?: string, tag?: object({ label: string, tone?: neutral | accent | info | success | warning | danger, color?: string }) }), index: integer, trigger: keyboard | pointer | programmatic })","bubbles":true,"composed":true,"cancelable":false},{"kind":"event","name":"create-item","type":"object({ query: string, trigger: keyboard | pointer | programmatic })","bubbles":true,"composed":true,"cancelable":false},{"kind":"event","name":"selected-values-change","type":"object({ selectedValues: list(string), trigger: keyboard | pointer | programmatic })","bubbles":true,"composed":true,"cancelable":false},{"kind":"method","name":"validate","exportName":"validate","returns":"promise(unknown)"},{"kind":"method","name":"focusInput","exportName":"focusInput","returns":"promise(undefined)"}],"root":{"kind":"native","element":"div","choices":["div"]}},source:{file:import.meta.url},css:""};
|
|
7
7
|
|
|
8
8
|
export function createUiCombobox(options = {}) {
|
|
9
9
|
const { attributes = {}, children = [], slots = {}, ...componentProps } = options;
|
|
@@ -25,234 +25,237 @@ export function createUiCombobox(options = {}) {
|
|
|
25
25
|
element3.setAttribute("class", "control");
|
|
26
26
|
const element4 = document.createElement("div");
|
|
27
27
|
element4.setAttribute("class", "field");
|
|
28
|
+
const element5 = document.createElement("div");
|
|
29
|
+
element5.setAttribute("class", "entry");
|
|
28
30
|
if (slots["start"] ?? [].length > 0) {
|
|
29
31
|
for (const child of slots["start"] ?? []) {
|
|
30
32
|
const node = typeof child === "string" ? document.createTextNode(child) : child;
|
|
31
33
|
projected.push([node, "start"]);
|
|
32
|
-
|
|
34
|
+
element5.append(node);
|
|
33
35
|
}
|
|
34
36
|
} else {
|
|
35
37
|
}
|
|
36
|
-
const
|
|
37
|
-
const
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
38
|
+
const element6 = document.createElement("template");
|
|
39
|
+
const element7 = document.createElement("button");
|
|
40
|
+
element7.setAttribute("class", "item");
|
|
41
|
+
element7.setAttribute("type", "button");
|
|
42
|
+
element7.setAttribute("tabindex", "-1");
|
|
41
43
|
if (children.length > 0) {
|
|
42
44
|
for (const child of children) {
|
|
43
45
|
const node = typeof child === "string" ? document.createTextNode(child) : child;
|
|
44
46
|
projected.push([node, ""]);
|
|
45
|
-
|
|
47
|
+
element7.append(node);
|
|
46
48
|
}
|
|
47
49
|
} else {
|
|
48
|
-
const
|
|
49
|
-
|
|
50
|
+
const element8 = document.createElement("ui-badge");
|
|
51
|
+
element7.append(element8);
|
|
50
52
|
}
|
|
53
|
+
element6.append(element7);
|
|
51
54
|
element5.append(element6);
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
element8.setAttribute("autocomplete", "off");
|
|
55
|
+
const element9 = document.createElement("input");
|
|
56
|
+
element9.setAttribute("role", "combobox");
|
|
57
|
+
element9.setAttribute("aria-autocomplete", "list");
|
|
58
|
+
element9.setAttribute("autocomplete", "off");
|
|
57
59
|
const value0 = componentProps["placeholder"] === undefined ? "" : componentProps["placeholder"];
|
|
58
|
-
if (value0 === null || value0 === undefined)
|
|
59
|
-
else
|
|
60
|
+
if (value0 === null || value0 === undefined) element9.removeAttribute("placeholder");
|
|
61
|
+
else element9.setAttribute("placeholder", String(value0));
|
|
60
62
|
const value1 = componentProps["disabled"] === undefined ? false : componentProps["disabled"];
|
|
61
|
-
if (value1 === true)
|
|
62
|
-
else
|
|
63
|
+
if (value1 === true) element9.setAttribute("disabled", "");
|
|
64
|
+
else element9.removeAttribute("disabled");
|
|
63
65
|
const value2 = componentProps["readonly"] === undefined ? false : componentProps["readonly"];
|
|
64
|
-
if (value2 === true)
|
|
65
|
-
else
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
66
|
+
if (value2 === true) element9.setAttribute("readonly", "");
|
|
67
|
+
else element9.removeAttribute("readonly");
|
|
68
|
+
element5.append(element9);
|
|
69
|
+
element4.append(element5);
|
|
70
|
+
const element10 = document.createElement("input");
|
|
71
|
+
element10.setAttribute("type", "hidden");
|
|
69
72
|
const value3 = componentProps["name"] === undefined ? "" : componentProps["name"];
|
|
70
|
-
if (value3 === null || value3 === undefined)
|
|
71
|
-
else
|
|
73
|
+
if (value3 === null || value3 === undefined) element10.removeAttribute("name");
|
|
74
|
+
else element10.setAttribute("name", String(value3));
|
|
72
75
|
const value4 = componentProps["disabled"] === undefined ? false : componentProps["disabled"];
|
|
73
|
-
if (value4 === true)
|
|
74
|
-
else
|
|
75
|
-
element4.append(
|
|
76
|
-
const
|
|
77
|
-
const
|
|
78
|
-
|
|
76
|
+
if (value4 === true) element10.setAttribute("disabled", "");
|
|
77
|
+
else element10.removeAttribute("disabled");
|
|
78
|
+
element4.append(element10);
|
|
79
|
+
const element11 = document.createElement("template");
|
|
80
|
+
const element12 = document.createElement("input");
|
|
81
|
+
element12.setAttribute("type", "hidden");
|
|
79
82
|
const value5 = componentProps["name"] === undefined ? "" : componentProps["name"];
|
|
80
|
-
if (value5 === null || value5 === undefined)
|
|
81
|
-
else
|
|
83
|
+
if (value5 === null || value5 === undefined) element12.removeAttribute("name");
|
|
84
|
+
else element12.setAttribute("name", String(value5));
|
|
82
85
|
const value6 = componentProps["disabled"] === undefined ? false : componentProps["disabled"];
|
|
83
|
-
if (value6 === true)
|
|
84
|
-
else
|
|
85
|
-
|
|
86
|
-
element4.append(
|
|
87
|
-
const
|
|
88
|
-
|
|
89
|
-
|
|
90
|
-
|
|
91
|
-
const
|
|
92
|
-
|
|
93
|
-
|
|
94
|
-
|
|
95
|
-
|
|
96
|
-
|
|
97
|
-
|
|
98
|
-
|
|
99
|
-
const
|
|
100
|
-
|
|
86
|
+
if (value6 === true) element12.setAttribute("disabled", "");
|
|
87
|
+
else element12.removeAttribute("disabled");
|
|
88
|
+
element11.append(element12);
|
|
89
|
+
element4.append(element11);
|
|
90
|
+
const element13 = document.createElement("button");
|
|
91
|
+
element13.setAttribute("type", "button");
|
|
92
|
+
element13.setAttribute("data-combobox-action", "clear");
|
|
93
|
+
element13.setAttribute("aria-label", "Clear");
|
|
94
|
+
const element14 = document.createElementNS("http://www.w3.org/2000/svg", "svg");
|
|
95
|
+
element14.setAttribute("class", "affordance-icon");
|
|
96
|
+
element14.setAttribute("aria-hidden", "true");
|
|
97
|
+
element14.setAttribute("viewBox", "0 0 24 24");
|
|
98
|
+
element14.setAttribute("fill", "none");
|
|
99
|
+
element14.setAttribute("stroke", "currentColor");
|
|
100
|
+
element14.setAttribute("stroke-width", "2");
|
|
101
|
+
element14.setAttribute("stroke-linecap", "round");
|
|
102
|
+
const element15 = document.createElementNS("http://www.w3.org/2000/svg", "path");
|
|
103
|
+
element15.setAttribute("d", "M7 7l10 10M17 7 7 17");
|
|
104
|
+
element14.append(element15);
|
|
101
105
|
element13.append(element14);
|
|
102
|
-
|
|
103
|
-
|
|
104
|
-
|
|
105
|
-
|
|
106
|
-
|
|
107
|
-
|
|
108
|
-
|
|
109
|
-
|
|
110
|
-
|
|
111
|
-
|
|
112
|
-
|
|
113
|
-
|
|
114
|
-
|
|
115
|
-
|
|
116
|
-
|
|
117
|
-
|
|
118
|
-
|
|
119
|
-
element17.
|
|
106
|
+
element4.append(element13);
|
|
107
|
+
const element16 = document.createElement("button");
|
|
108
|
+
element16.setAttribute("type", "button");
|
|
109
|
+
element16.setAttribute("data-combobox-action", "disclosure");
|
|
110
|
+
element16.setAttribute("tabindex", "-1");
|
|
111
|
+
element16.setAttribute("aria-label", "Show suggestions");
|
|
112
|
+
const element17 = document.createElementNS("http://www.w3.org/2000/svg", "svg");
|
|
113
|
+
element17.setAttribute("class", "affordance-icon");
|
|
114
|
+
element17.setAttribute("aria-hidden", "true");
|
|
115
|
+
element17.setAttribute("viewBox", "0 0 24 24");
|
|
116
|
+
element17.setAttribute("fill", "none");
|
|
117
|
+
element17.setAttribute("stroke", "currentColor");
|
|
118
|
+
element17.setAttribute("stroke-width", "2.25");
|
|
119
|
+
element17.setAttribute("stroke-linecap", "round");
|
|
120
|
+
element17.setAttribute("stroke-linejoin", "round");
|
|
121
|
+
const element18 = document.createElementNS("http://www.w3.org/2000/svg", "path");
|
|
122
|
+
element18.setAttribute("d", "m6 9 6 6 6-6");
|
|
123
|
+
element17.append(element18);
|
|
120
124
|
element16.append(element17);
|
|
121
|
-
|
|
122
|
-
element4.append(element15);
|
|
125
|
+
element4.append(element16);
|
|
123
126
|
element3.append(element4);
|
|
124
|
-
const
|
|
125
|
-
|
|
126
|
-
|
|
127
|
-
|
|
127
|
+
const element19 = document.createElement("button");
|
|
128
|
+
element19.setAttribute("class", "help");
|
|
129
|
+
element19.setAttribute("type", "button");
|
|
130
|
+
element19.setAttribute("aria-label", "Help");
|
|
128
131
|
const value7 = componentProps["disabled"] === undefined ? false : componentProps["disabled"];
|
|
129
|
-
if (value7 === true)
|
|
130
|
-
else
|
|
131
|
-
const
|
|
132
|
-
|
|
133
|
-
|
|
134
|
-
|
|
135
|
-
|
|
136
|
-
|
|
137
|
-
|
|
138
|
-
|
|
139
|
-
|
|
140
|
-
const
|
|
141
|
-
|
|
142
|
-
|
|
143
|
-
|
|
144
|
-
|
|
145
|
-
const element21 = document.createElementNS("http://www.w3.org/2000/svg", "path");
|
|
146
|
-
element21.setAttribute("d", "M9.1 9a3 3 0 0 1 5.8 1c0 2-3 3-3 3");
|
|
147
|
-
element19.append(element21);
|
|
132
|
+
if (value7 === true) element19.setAttribute("disabled", "");
|
|
133
|
+
else element19.removeAttribute("disabled");
|
|
134
|
+
const element20 = document.createElementNS("http://www.w3.org/2000/svg", "svg");
|
|
135
|
+
element20.setAttribute("class", "help-icon");
|
|
136
|
+
element20.setAttribute("aria-hidden", "true");
|
|
137
|
+
element20.setAttribute("viewBox", "0 0 24 24");
|
|
138
|
+
element20.setAttribute("fill", "none");
|
|
139
|
+
element20.setAttribute("stroke", "currentColor");
|
|
140
|
+
element20.setAttribute("stroke-width", "2");
|
|
141
|
+
element20.setAttribute("stroke-linecap", "round");
|
|
142
|
+
element20.setAttribute("stroke-linejoin", "round");
|
|
143
|
+
const element21 = document.createElementNS("http://www.w3.org/2000/svg", "circle");
|
|
144
|
+
element21.setAttribute("cx", "12");
|
|
145
|
+
element21.setAttribute("cy", "12");
|
|
146
|
+
element21.setAttribute("r", "10");
|
|
147
|
+
element20.append(element21);
|
|
148
148
|
const element22 = document.createElementNS("http://www.w3.org/2000/svg", "path");
|
|
149
|
-
element22.setAttribute("d", "
|
|
150
|
-
|
|
151
|
-
|
|
152
|
-
|
|
149
|
+
element22.setAttribute("d", "M9.1 9a3 3 0 0 1 5.8 1c0 2-3 3-3 3");
|
|
150
|
+
element20.append(element22);
|
|
151
|
+
const element23 = document.createElementNS("http://www.w3.org/2000/svg", "path");
|
|
152
|
+
element23.setAttribute("d", "M12 17h.01");
|
|
153
|
+
element20.append(element23);
|
|
154
|
+
element19.append(element20);
|
|
155
|
+
element3.append(element19);
|
|
153
156
|
element.append(element3);
|
|
154
|
-
const
|
|
155
|
-
|
|
156
|
-
const
|
|
157
|
-
|
|
158
|
-
element.append(
|
|
159
|
-
const element25 = document.createElement("div");
|
|
160
|
-
element25.setAttribute("class", "popup");
|
|
157
|
+
const element24 = document.createElement("ui-tooltip");
|
|
158
|
+
element24.setAttribute("trigger", "click");
|
|
159
|
+
const element25 = document.createElement("template");
|
|
160
|
+
element24.append(element25);
|
|
161
|
+
element.append(element24);
|
|
161
162
|
const element26 = document.createElement("div");
|
|
162
|
-
element26.setAttribute("
|
|
163
|
-
const value8 = componentProps["loading"] === undefined ? false : componentProps["loading"];
|
|
164
|
-
if (typeof value8 === "boolean") element26.setAttribute("aria-busy", String(value8));
|
|
165
|
-
else element26.removeAttribute("aria-busy");
|
|
163
|
+
element26.setAttribute("class", "popup");
|
|
166
164
|
const element27 = document.createElement("div");
|
|
165
|
+
element27.setAttribute("role", "listbox");
|
|
166
|
+
const value8 = componentProps["loading"] === undefined ? false : componentProps["loading"];
|
|
167
|
+
if (typeof value8 === "boolean") element27.setAttribute("aria-busy", String(value8));
|
|
168
|
+
else element27.removeAttribute("aria-busy");
|
|
167
169
|
const element28 = document.createElement("div");
|
|
168
|
-
element28.setAttribute("class", "group");
|
|
169
|
-
element27.append(element28);
|
|
170
170
|
const element29 = document.createElement("div");
|
|
171
|
-
element29.setAttribute("class", "
|
|
172
|
-
|
|
171
|
+
element29.setAttribute("class", "group");
|
|
172
|
+
element28.append(element29);
|
|
173
|
+
const element30 = document.createElement("div");
|
|
174
|
+
element30.setAttribute("class", "option");
|
|
175
|
+
element30.setAttribute("role", "option");
|
|
173
176
|
if (children.length > 0) {
|
|
174
177
|
for (const child of children) {
|
|
175
178
|
const node = typeof child === "string" ? document.createTextNode(child) : child;
|
|
176
179
|
projected.push([node, ""]);
|
|
177
|
-
|
|
180
|
+
element30.append(node);
|
|
178
181
|
}
|
|
179
182
|
} else {
|
|
180
|
-
const element30 = document.createElement("span");
|
|
181
|
-
element30.setAttribute("class", "detail");
|
|
182
183
|
const element31 = document.createElement("span");
|
|
183
|
-
element31.setAttribute("class", "
|
|
184
|
+
element31.setAttribute("class", "detail");
|
|
184
185
|
const element32 = document.createElement("span");
|
|
185
|
-
element32.setAttribute("class", "
|
|
186
|
-
|
|
187
|
-
|
|
188
|
-
|
|
189
|
-
|
|
190
|
-
element31.append(element33);
|
|
191
|
-
element30.append(element31);
|
|
186
|
+
element32.setAttribute("class", "line");
|
|
187
|
+
const element33 = document.createElement("span");
|
|
188
|
+
element33.setAttribute("class", "primary");
|
|
189
|
+
element32.append(element33);
|
|
190
|
+
const element34 = document.createElement("ui-badge");
|
|
192
191
|
const element35 = document.createElement("span");
|
|
193
|
-
|
|
194
|
-
|
|
195
|
-
|
|
192
|
+
element34.append(element35);
|
|
193
|
+
element32.append(element34);
|
|
194
|
+
element31.append(element32);
|
|
196
195
|
const element36 = document.createElement("span");
|
|
197
|
-
element36.setAttribute("class", "
|
|
198
|
-
|
|
196
|
+
element36.setAttribute("class", "description");
|
|
197
|
+
element31.append(element36);
|
|
198
|
+
element30.append(element31);
|
|
199
|
+
const element37 = document.createElement("span");
|
|
200
|
+
element37.setAttribute("class", "primary");
|
|
201
|
+
element30.append(element37);
|
|
199
202
|
}
|
|
200
|
-
|
|
201
|
-
|
|
202
|
-
const element37 = document.createElement("div");
|
|
203
|
-
element37.setAttribute("class", "option");
|
|
204
|
-
element37.setAttribute("role", "option");
|
|
205
|
-
element37.setAttribute("aria-selected", "false");
|
|
206
|
-
element26.append(element37);
|
|
203
|
+
element28.append(element30);
|
|
204
|
+
element27.append(element28);
|
|
207
205
|
const element38 = document.createElement("div");
|
|
208
|
-
element38.setAttribute("class", "
|
|
209
|
-
|
|
206
|
+
element38.setAttribute("class", "option");
|
|
207
|
+
element38.setAttribute("role", "option");
|
|
208
|
+
element38.setAttribute("aria-selected", "false");
|
|
209
|
+
element27.append(element38);
|
|
210
210
|
const element39 = document.createElement("div");
|
|
211
211
|
element39.setAttribute("class", "message");
|
|
212
|
+
element27.append(element39);
|
|
213
|
+
const element40 = document.createElement("div");
|
|
214
|
+
element40.setAttribute("class", "message");
|
|
212
215
|
if (slots["empty"] ?? [].length > 0) {
|
|
213
216
|
for (const child of slots["empty"] ?? []) {
|
|
214
217
|
const node = typeof child === "string" ? document.createTextNode(child) : child;
|
|
215
218
|
projected.push([node, "empty"]);
|
|
216
|
-
|
|
219
|
+
element40.append(node);
|
|
217
220
|
}
|
|
218
221
|
} else {
|
|
219
|
-
|
|
222
|
+
element40.append("No suggestions.");
|
|
220
223
|
}
|
|
221
|
-
|
|
222
|
-
|
|
224
|
+
element27.append(element40);
|
|
225
|
+
element26.append(element27);
|
|
223
226
|
if (slots["footer"] ?? [].length > 0) {
|
|
224
227
|
for (const child of slots["footer"] ?? []) {
|
|
225
228
|
const node = typeof child === "string" ? document.createTextNode(child) : child;
|
|
226
229
|
projected.push([node, "footer"]);
|
|
227
|
-
|
|
230
|
+
element26.append(node);
|
|
228
231
|
}
|
|
229
232
|
} else {
|
|
230
233
|
}
|
|
231
|
-
element.append(
|
|
232
|
-
const element40 = document.createElement("div");
|
|
233
|
-
element40.setAttribute("class", "message");
|
|
234
|
+
element.append(element26);
|
|
234
235
|
const element41 = document.createElement("div");
|
|
235
|
-
|
|
236
|
-
element.append(element40);
|
|
236
|
+
element41.setAttribute("class", "message");
|
|
237
237
|
const element42 = document.createElement("div");
|
|
238
|
-
|
|
239
|
-
|
|
240
|
-
element42.setAttribute("aria-live", "polite");
|
|
241
|
-
element42.setAttribute("aria-atomic", "true");
|
|
242
|
-
element.append(element42);
|
|
238
|
+
element41.append(element42);
|
|
239
|
+
element.append(element41);
|
|
243
240
|
const element43 = document.createElement("div");
|
|
244
|
-
element43.setAttribute("class", "
|
|
245
|
-
element43.setAttribute("
|
|
246
|
-
element43.setAttribute("aria-
|
|
241
|
+
element43.setAttribute("class", "sr-only");
|
|
242
|
+
element43.setAttribute("role", "status");
|
|
243
|
+
element43.setAttribute("aria-live", "polite");
|
|
244
|
+
element43.setAttribute("aria-atomic", "true");
|
|
245
|
+
element.append(element43);
|
|
246
|
+
const element44 = document.createElement("div");
|
|
247
|
+
element44.setAttribute("class", "authored-options");
|
|
248
|
+
element44.setAttribute("hidden", "");
|
|
249
|
+
element44.setAttribute("aria-hidden", "true");
|
|
247
250
|
if (children.length > 0) {
|
|
248
251
|
for (const child of children) {
|
|
249
252
|
const node = typeof child === "string" ? document.createTextNode(child) : child;
|
|
250
253
|
projected.push([node, ""]);
|
|
251
|
-
|
|
254
|
+
element44.append(node);
|
|
252
255
|
}
|
|
253
256
|
} else {
|
|
254
257
|
}
|
|
255
|
-
element.append(
|
|
258
|
+
element.append(element44);
|
|
256
259
|
manageComponentLifecycle(element, definition, { props: componentProps, projected,
|
|
257
260
|
controller,
|
|
258
261
|
});
|