q2-tecton-elements 1.37.0 → 1.37.2
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/cjs/loader.cjs.js +1 -1
- package/dist/cjs/q2-btn_2.cjs.entry.js +4 -0
- package/dist/cjs/q2-btn_2.cjs.entry.js.map +1 -1
- package/dist/cjs/q2-dropdown.cjs.entry.js +8 -10
- package/dist/cjs/q2-dropdown.cjs.entry.js.map +1 -1
- package/dist/cjs/q2-editable-field.cjs.entry.js +5 -6
- package/dist/cjs/q2-editable-field.cjs.entry.js.map +1 -1
- package/dist/cjs/q2-select.cjs.entry.js +13 -11
- package/dist/cjs/q2-select.cjs.entry.js.map +1 -1
- package/dist/cjs/q2-tecton-elements.cjs.js +1 -1
- package/dist/collection/components/q2-btn/index.js +4 -0
- package/dist/collection/components/q2-btn/index.js.map +1 -1
- package/dist/collection/components/q2-data-table/index.js +6 -6
- package/dist/collection/components/q2-dropdown/index.js +8 -10
- package/dist/collection/components/q2-dropdown/index.js.map +1 -1
- package/dist/collection/components/q2-editable-field/index.js +11 -6
- package/dist/collection/components/q2-editable-field/index.js.map +1 -1
- package/dist/collection/components/q2-input/index.js +1 -1
- package/dist/collection/components/q2-option-list/index.js +2 -2
- package/dist/collection/components/q2-select/index.js +13 -11
- package/dist/collection/components/q2-select/index.js.map +1 -1
- package/dist/collection/components/q2-stepper-pane/index.js +2 -2
- package/dist/components/index5.js +4 -0
- package/dist/components/index5.js.map +1 -1
- package/dist/components/q2-dropdown.js +8 -10
- package/dist/components/q2-dropdown.js.map +1 -1
- package/dist/components/q2-editable-field.js +6 -7
- package/dist/components/q2-editable-field.js.map +1 -1
- package/dist/components/q2-select.js +13 -11
- package/dist/components/q2-select.js.map +1 -1
- package/dist/docs.json +6 -1
- package/dist/esm/loader.js +1 -1
- package/dist/esm/q2-btn_2.entry.js +4 -0
- package/dist/esm/q2-btn_2.entry.js.map +1 -1
- package/dist/esm/q2-dropdown.entry.js +8 -10
- package/dist/esm/q2-dropdown.entry.js.map +1 -1
- package/dist/esm/q2-editable-field.entry.js +5 -6
- package/dist/esm/q2-editable-field.entry.js.map +1 -1
- package/dist/esm/q2-select.entry.js +13 -11
- package/dist/esm/q2-select.entry.js.map +1 -1
- package/dist/esm/q2-tecton-elements.js +1 -1
- package/dist/q2-tecton-elements/p-6156f952.entry.js +2 -0
- package/dist/q2-tecton-elements/p-6156f952.entry.js.map +1 -0
- package/dist/q2-tecton-elements/p-680929be.entry.js +2 -0
- package/dist/q2-tecton-elements/p-680929be.entry.js.map +1 -0
- package/dist/q2-tecton-elements/p-d4e3414e.entry.js +2 -0
- package/dist/q2-tecton-elements/p-d4e3414e.entry.js.map +1 -0
- package/dist/q2-tecton-elements/{p-578e3f98.entry.js → p-e68970b1.entry.js} +2 -2
- package/dist/q2-tecton-elements/p-e68970b1.entry.js.map +1 -0
- package/dist/q2-tecton-elements/q2-tecton-elements.esm.js +1 -1
- package/dist/q2-tecton-elements/q2-tecton-elements.esm.js.map +1 -1
- package/dist/test/elements/q2-select-test.e2e.js +131 -55
- package/dist/test/elements/q2-select-test.e2e.js.map +1 -1
- package/dist/types/components/q2-btn/index.d.ts +1 -0
- package/dist/types/components/q2-dropdown/index.d.ts +1 -4
- package/dist/types/components/q2-editable-field/index.d.ts +2 -1
- package/dist/types/components/q2-select/index.d.ts +1 -1
- package/package.json +4 -3
- package/dist/q2-tecton-elements/p-2a975246.entry.js +0 -2
- package/dist/q2-tecton-elements/p-2a975246.entry.js.map +0 -1
- package/dist/q2-tecton-elements/p-3798ad96.entry.js +0 -2
- package/dist/q2-tecton-elements/p-3798ad96.entry.js.map +0 -1
- package/dist/q2-tecton-elements/p-578e3f98.entry.js.map +0 -1
- package/dist/q2-tecton-elements/p-9d743327.entry.js +0 -2
- package/dist/q2-tecton-elements/p-9d743327.entry.js.map +0 -1
- /package/dist/types/{workspace/workspace/_Gitlab_tecton-production_master → builds/q2e/development/tecton/tecton}/packages/q2-tecton-elements/.stencil/test/helpers.d.ts +0 -0
|
@@ -146,10 +146,16 @@ export class Q2Dropdown {
|
|
|
146
146
|
}
|
|
147
147
|
switch (menuItemData.action) {
|
|
148
148
|
case 'navigateTo':
|
|
149
|
-
onClickFn = ()
|
|
149
|
+
onClickFn = function () {
|
|
150
|
+
var _a, _b;
|
|
151
|
+
return (_b = (_a = window.TectonElements) === null || _a === void 0 ? void 0 : _a.navigateTo) === null || _b === void 0 ? void 0 : _b.call(_a, menuItemData.featureName, menuItemData.moduleName, queryParams);
|
|
152
|
+
};
|
|
150
153
|
break;
|
|
151
154
|
case 'showOverpanel':
|
|
152
|
-
onClickFn = ()
|
|
155
|
+
onClickFn = function () {
|
|
156
|
+
var _a, _b;
|
|
157
|
+
return (_b = (_a = window.TectonElements) === null || _a === void 0 ? void 0 : _a.showOverpanel) === null || _b === void 0 ? void 0 : _b.call(_a, `${menuItemData.featureName}.${menuItemData.moduleName}`, queryParams, undefined, true);
|
|
158
|
+
};
|
|
153
159
|
break;
|
|
154
160
|
}
|
|
155
161
|
const newDropdownItem = document.createElement('q2-dropdown-item');
|
|
@@ -161,14 +167,6 @@ export class Q2Dropdown {
|
|
|
161
167
|
});
|
|
162
168
|
});
|
|
163
169
|
}
|
|
164
|
-
navigateTo(featureName, moduleName, queryParams) {
|
|
165
|
-
var _a, _b;
|
|
166
|
-
return (_b = (_a = window.TectonElements) === null || _a === void 0 ? void 0 : _a.navigateTo) === null || _b === void 0 ? void 0 : _b.call(_a, featureName, moduleName, queryParams);
|
|
167
|
-
}
|
|
168
|
-
showOverpanel(overpanelPath, params) {
|
|
169
|
-
var _a, _b;
|
|
170
|
-
return (_b = (_a = window.TectonElements) === null || _a === void 0 ? void 0 : _a.showOverpanel) === null || _b === void 0 ? void 0 : _b.call(_a, overpanelPath, params, undefined, true);
|
|
171
|
-
}
|
|
172
170
|
get hasCustomButton() {
|
|
173
171
|
return !!this.hostElement.querySelector('[slot=custom-dropdown-button]');
|
|
174
172
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/components/q2-dropdown/index.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, ComponentInterface, Prop, Element, Watch, h, Fragment, Listen } from '@stencil/core';\nimport { IDict } from 'src/util';\nimport { handleAriaLabel, handleRenamedProp, isEventFromElement, loc, overrideFocus } from 'src/utils';\n\n@Component({\n tag: 'q2-dropdown',\n shadow: true,\n styleUrl: 'styles.scss',\n})\nexport class Q2Dropdown implements ComponentInterface {\n @Prop({ reflect: true }) type: 'icon' | 'fab' | 'custom' | 'primary' | 'secondary' | 'neutral' = 'icon';\n @Prop({ reflect: true }) icon: string;\n @Prop({ reflect: true, mutable: true }) label: string;\n @Prop({ reflect: true, mutable: true }) hideLabel: boolean;\n @Prop({ reflect: true }) disabled: boolean;\n @Prop({ reflect: true }) name: string;\n @Prop({ reflect: true }) context: string;\n @Prop({ reflect: true }) contextValue: string;\n @Prop({ reflect: true }) resolvedType: string;\n @Prop({ reflect: true }) additionalContext: string;\n @Prop({ reflect: true }) block: boolean;\n @Prop({ reflect: true, mutable: true }) open: boolean;\n @Prop() popoverMinHeight: number = 150;\n @Prop({ mutable: true }) popoverDirection: 'up' | 'down';\n @Prop({ mutable: true }) popoverAlignment: 'left' | 'right' = 'left'; // being used in dropdown.scss\n\n /** @deprecated */\n @Prop({ reflect: true }) alignment: 'left' | 'right';\n\n /** @deprecated */\n @Prop({ reflect: true }) popDirection: 'up' | 'down';\n\n /** @deprecated */\n @Prop({ reflect: true, mutable: true }) ariaLabel: string;\n\n @Element() hostElement: HTMLElement;\n privatePopDirection: 'down' | 'up';\n controlElement?: HTMLQ2BtnElement;\n popoverElement?: HTMLQ2PopoverElement;\n dropdownItemSelector: string = 'q2-dropdown-item:not([disabled]):not([separator])';\n\n resolveMenu() {\n return (\n this.name &&\n window.TectonElements &&\n window.TectonElements.resolveMenu(this.name, this.contextValue, this.resolvedType, this.additionalContext)\n );\n }\n\n orchestrateResolvedMenuItems() {\n if (!this.name || !this.context) {\n // this is only for contextual menu outlets\n this.removeResolvedElements();\n return;\n }\n\n this.resolveMenuItemElements()\n .then(data => {\n this.removeResolvedElements();\n data.forEach(element => {\n this.hostElement.appendChild(element);\n });\n })\n .catch(err => {\n this.removeResolvedElements();\n throw err;\n });\n }\n\n removeResolvedElements() {\n const resolvedElements = this.hostElement.querySelectorAll('q2-dropdown-item.resolved-menu-item');\n resolvedElements.forEach(element => this.hostElement.removeChild(element));\n }\n\n resolveMenuItemElements() {\n return this.resolveMenu().then(datas => {\n return datas.map(menuItemData => {\n let onClickFn;\n let queryParams;\n if (menuItemData['tct-ctxid']) {\n queryParams = {};\n queryParams[menuItemData.contextIdParamName] = menuItemData['tct-ctxid'];\n }\n\n switch (menuItemData.action) {\n case 'navigateTo':\n onClickFn = () =>\n this.navigateTo(menuItemData.featureName, menuItemData.moduleName, queryParams);\n break;\n case 'showOverpanel':\n onClickFn = () =>\n this.showOverpanel(`${menuItemData.featureName}.${menuItemData.moduleName}`, queryParams);\n break;\n }\n\n const newDropdownItem = document.createElement('q2-dropdown-item');\n newDropdownItem.setAttribute('value', menuItemData.itemLabel);\n newDropdownItem.classList.add('resolved-menu-item');\n newDropdownItem.innerHTML = menuItemData.itemLabel;\n newDropdownItem.onclick = onClickFn;\n\n return newDropdownItem;\n });\n });\n }\n\n navigateTo(featureName: string, moduleName?: string, queryParams?: IDict<string>) {\n return window.TectonElements?.navigateTo?.(featureName, moduleName, queryParams);\n }\n\n showOverpanel(overpanelPath: string, params: IDict<string>) {\n return window.TectonElements?.showOverpanel?.(overpanelPath, params, undefined, true);\n }\n\n get hasCustomButton() {\n return !!this.hostElement.querySelector('[slot=custom-dropdown-button]');\n }\n\n get determineDropdownItemCount() {\n return this.hostElement.querySelectorAll(this.dropdownItemSelector).length;\n }\n\n get toggleButtonProps() {\n const allowedIntents = ['primary', 'secondary', 'neutral'];\n const allowedTypes = ['icon', 'fab', 'custom', ...allowedIntents];\n const type = allowedTypes.includes(this.type) ? this.type : '';\n const icon = type === 'icon';\n const fab = type === 'fab';\n const custom = type === 'custom';\n let intent;\n if (allowedIntents.includes(type)) {\n intent = type === 'neutral' ? type : `workflow-${type}`;\n }\n const active = this.open;\n const disabled = !!this.disabled;\n const ariaExpanded = this.open;\n const className = !icon && !fab && !intent ? 'unstyled' : '';\n\n return {\n icon,\n fab,\n intent,\n active,\n disabled,\n ariaExpanded,\n className,\n custom,\n };\n }\n\n //////// Observers //////////\n @Watch('popDirection')\n popDirectionHandler() {\n handleRenamedProp(this, 'popDirection', 'popoverDirection');\n }\n\n @Watch('alignment')\n alignmentHandler() {\n handleRenamedProp(this, 'alignment', 'popoverAlignment');\n }\n\n @Watch('ariaLabel')\n ariaLabelHandler() {\n handleAriaLabel(this);\n }\n\n @Watch('name')\n nameHandler() {\n this.orchestrateResolvedMenuItems();\n }\n\n @Watch('context')\n contextHandler() {\n this.orchestrateResolvedMenuItems();\n }\n\n @Watch('contextValue')\n contextValueHandler() {\n this.orchestrateResolvedMenuItems();\n }\n\n @Watch('resolvedType')\n resolvedTypeHandler() {\n this.orchestrateResolvedMenuItems();\n }\n\n @Watch('additionalContext')\n additionalContextHandler() {\n this.orchestrateResolvedMenuItems();\n }\n\n @Listen('focus')\n delegateFocus(event: FocusEvent) {\n if (!isEventFromElement(event, this.hostElement)) return;\n this.focusToggle();\n }\n\n @Listen('popoverStateChanged')\n popoverStateHandler({ detail: { open } }: CustomEvent<{ open: boolean }>) {\n if (this.open !== open) this.open = open;\n this.popoverElement?.scrollContainerTo({ top: 0 });\n }\n\n ///// Lifecycle Hooks ////////\n componentWillLoad() {\n this.popDirectionHandler();\n this.alignmentHandler();\n this.ariaLabelHandler();\n }\n\n componentDidLoad() {\n this.orchestrateResolvedMenuItems();\n overrideFocus(this.hostElement);\n }\n\n ///// Actions ////////\n focusToggle = () => {\n this.controlElement.shadowRoot.querySelector<HTMLButtonElement>('button').focus();\n };\n\n openDropdown = () => {\n if (this.open) return;\n this.open = true;\n };\n\n closeDropdown = () => {\n if (!this.open) return;\n this.open = false;\n };\n\n onClickElsewhere = (event: CustomEvent) => {\n const target = event.target as HTMLClickElsewhereElement;\n if (target.localName === 'click-elsewhere') {\n event.stopPropagation();\n const { popoverElement } = this;\n if (!popoverElement) return;\n popoverElement.open = false;\n }\n };\n\n onToggleClick = () => {\n if (this.open) {\n this.closeDropdown();\n } else {\n this.openDropdown();\n }\n };\n\n onToggleKeydown = (event: KeyboardEvent) => {\n if (['ArrowUp', 'Up'].includes(event.key)) {\n event.preventDefault();\n this.openDropdown();\n this.focusLastItem();\n return;\n }\n\n if (['ArrowDown', 'Down'].includes(event.key)) {\n event.preventDefault();\n this.openDropdown();\n this.focusFirstItem();\n return;\n }\n\n if (['Escape', 'Esc'].includes(event.key)) {\n event.preventDefault();\n this.focusToggle();\n this.closeDropdown();\n return;\n }\n };\n\n onDropdownMenuClick = (event: MouseEvent | CustomEvent) => {\n if ((event.target as HTMLElement).localName !== 'q2-dropdown-item') {\n return;\n }\n const item = event.target as HTMLQ2DropdownItemElement;\n if (!item.disabled && !item.separator) {\n this.focusToggle();\n this.closeDropdown();\n }\n };\n\n focusFirstItem() {\n const firstItem = this.hostElement.querySelector<HTMLQ2DropdownItemElement>(\n `${this.dropdownItemSelector}:first-child`\n );\n\n firstItem?.dispatchEvent(new FocusEvent('focus'));\n }\n\n focusLastItem() {\n const lastItem = this.hostElement.querySelector<HTMLQ2DropdownItemElement>(\n `${this.dropdownItemSelector}:last-child`\n );\n lastItem?.dispatchEvent(new FocusEvent('focus'));\n }\n\n focusAdjacentItem(activeItem: HTMLQ2DropdownItemElement, direction: 'next' | 'prev') {\n const dropdownItems: HTMLQ2DropdownItemElement[] = Array.from(\n this.hostElement.querySelectorAll(this.dropdownItemSelector)\n );\n\n const activeIndex = dropdownItems.indexOf(activeItem);\n\n if (activeIndex === -1) {\n return;\n }\n\n let targetIndex: number = 0;\n if (direction === 'next') {\n targetIndex = activeIndex < dropdownItems.length - 1 ? activeIndex + 1 : 0;\n } else if (direction === 'prev') {\n if (activeIndex > 0) {\n targetIndex = activeIndex - 1;\n } else {\n targetIndex = dropdownItems.length - 1;\n }\n }\n const targetItem = dropdownItems[targetIndex];\n targetItem && targetItem.dispatchEvent(new Event('focus'));\n }\n\n onDropdownMenuKeydown = (event: KeyboardEvent) => {\n if (['Escape', 'Esc'].includes(event.key)) {\n this.closeDropdown();\n this.focusToggle();\n return;\n }\n\n if ((event.target as HTMLElement).localName !== 'q2-dropdown-item') {\n return;\n }\n\n const item = event.target as HTMLQ2DropdownItemElement;\n if (['ArrowUp', 'Up'].includes(event.key)) {\n event.preventDefault();\n this.focusAdjacentItem(item, 'prev');\n return;\n }\n\n if (['ArrowDown', 'Down'].includes(event.key)) {\n event.preventDefault();\n this.focusAdjacentItem(item, 'next');\n return;\n }\n if (event.key === 'Tab') {\n event.preventDefault();\n }\n };\n\n /// DOM ///\n\n render() {\n const btnProps = this.toggleButtonProps;\n\n return (\n <click-elsewhere\n class={this.open ? 'dropdown-open' : ''}\n onChange={this.onClickElsewhere}\n test-id=\"dropdownContainer\"\n >\n <q2-btn\n ref={el => (this.controlElement = el)}\n class={btnProps.className}\n onClick={this.onToggleClick}\n onKeyDown={this.onToggleKeydown}\n fab={btnProps.fab}\n intent={btnProps.intent}\n active={btnProps.active}\n disabled={btnProps.disabled}\n ariaExpanded={`${!!btnProps.ariaExpanded}`}\n label={this.hideLabel && this.label ? loc(this.label) : undefined}\n hideLabel={this.hideLabel}\n ariaHasPopup=\"menu\"\n test-id=\"dropdownButton\"\n block={this.block}\n description={loc('tecton.element.dropdown.itemCount', [this.determineDropdownItemCount])}\n >\n {this.hasCustomButton ? (\n <div\n test-id=\"dropdownCustom\"\n class={btnProps.custom ? '' : 'hidden'}\n >\n <slot name=\"custom-dropdown-button\" />\n </div>\n ) : (\n <Fragment>\n {this.icon ? <q2-icon type={this.icon} /> : ' '}\n {this.label && !this.hideLabel && (\n <span class=\"dropdown-button-text\">{loc(this.label)}</span>\n )}\n </Fragment>\n )}\n </q2-btn>\n <q2-popover\n ref={el => (this.popoverElement = el)}\n controlElement={this.controlElement}\n open={this.open}\n minHeight={this.popoverMinHeight}\n direction={this.popoverDirection}\n align={this.popoverAlignment}\n block={this.block}\n >\n <div\n onClick={this.onDropdownMenuClick}\n onKeyDown={this.onDropdownMenuKeydown}\n >\n <slot />\n {this.open && (\n <q2-btn\n class=\"sr close-dropdown\"\n onFocus={this.closeDropdown}\n />\n )}\n </div>\n </q2-popover>\n </click-elsewhere>\n );\n }\n}\n"]}
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/components/q2-dropdown/index.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, ComponentInterface, Prop, Element, Watch, h, Fragment, Listen } from '@stencil/core';\nimport { handleAriaLabel, handleRenamedProp, isEventFromElement, loc, overrideFocus } from 'src/utils';\n\n@Component({\n tag: 'q2-dropdown',\n shadow: true,\n styleUrl: 'styles.scss',\n})\nexport class Q2Dropdown implements ComponentInterface {\n @Prop({ reflect: true }) type: 'icon' | 'fab' | 'custom' | 'primary' | 'secondary' | 'neutral' = 'icon';\n @Prop({ reflect: true }) icon: string;\n @Prop({ reflect: true, mutable: true }) label: string;\n @Prop({ reflect: true, mutable: true }) hideLabel: boolean;\n @Prop({ reflect: true }) disabled: boolean;\n @Prop({ reflect: true }) name: string;\n @Prop({ reflect: true }) context: string;\n @Prop({ reflect: true }) contextValue: string;\n @Prop({ reflect: true }) resolvedType: string;\n @Prop({ reflect: true }) additionalContext: string;\n @Prop({ reflect: true }) block: boolean;\n @Prop({ reflect: true, mutable: true }) open: boolean;\n @Prop() popoverMinHeight: number = 150;\n @Prop({ mutable: true }) popoverDirection: 'up' | 'down';\n @Prop({ mutable: true }) popoverAlignment: 'left' | 'right' = 'left'; // being used in dropdown.scss\n\n /** @deprecated */\n @Prop({ reflect: true }) alignment: 'left' | 'right';\n\n /** @deprecated */\n @Prop({ reflect: true }) popDirection: 'up' | 'down';\n\n /** @deprecated */\n @Prop({ reflect: true, mutable: true }) ariaLabel: string;\n\n @Element() hostElement: HTMLElement;\n privatePopDirection: 'down' | 'up';\n controlElement?: HTMLQ2BtnElement;\n popoverElement?: HTMLQ2PopoverElement;\n dropdownItemSelector: string = 'q2-dropdown-item:not([disabled]):not([separator])';\n\n resolveMenu() {\n return (\n this.name &&\n window.TectonElements &&\n window.TectonElements.resolveMenu(this.name, this.contextValue, this.resolvedType, this.additionalContext)\n );\n }\n\n orchestrateResolvedMenuItems() {\n if (!this.name || !this.context) {\n // this is only for contextual menu outlets\n this.removeResolvedElements();\n return;\n }\n\n this.resolveMenuItemElements()\n .then(data => {\n this.removeResolvedElements();\n data.forEach(element => {\n this.hostElement.appendChild(element);\n });\n })\n .catch(err => {\n this.removeResolvedElements();\n throw err;\n });\n }\n\n removeResolvedElements() {\n const resolvedElements = this.hostElement.querySelectorAll('q2-dropdown-item.resolved-menu-item');\n resolvedElements.forEach(element => this.hostElement.removeChild(element));\n }\n\n resolveMenuItemElements() {\n return this.resolveMenu().then(datas => {\n return datas.map(menuItemData => {\n let onClickFn;\n let queryParams;\n if (menuItemData['tct-ctxid']) {\n queryParams = {};\n queryParams[menuItemData.contextIdParamName] = menuItemData['tct-ctxid'];\n }\n\n switch (menuItemData.action) {\n case 'navigateTo':\n onClickFn = function () {\n return window.TectonElements?.navigateTo?.(\n menuItemData.featureName,\n menuItemData.moduleName,\n queryParams\n );\n };\n break;\n case 'showOverpanel':\n onClickFn = function () {\n return window.TectonElements?.showOverpanel?.(\n `${menuItemData.featureName}.${menuItemData.moduleName}`,\n queryParams,\n undefined,\n true\n );\n };\n break;\n }\n\n const newDropdownItem = document.createElement('q2-dropdown-item');\n newDropdownItem.setAttribute('value', menuItemData.itemLabel);\n newDropdownItem.classList.add('resolved-menu-item');\n newDropdownItem.innerHTML = menuItemData.itemLabel;\n newDropdownItem.onclick = onClickFn;\n\n return newDropdownItem;\n });\n });\n }\n\n get hasCustomButton() {\n return !!this.hostElement.querySelector('[slot=custom-dropdown-button]');\n }\n\n get determineDropdownItemCount() {\n return this.hostElement.querySelectorAll(this.dropdownItemSelector).length;\n }\n\n get toggleButtonProps() {\n const allowedIntents = ['primary', 'secondary', 'neutral'];\n const allowedTypes = ['icon', 'fab', 'custom', ...allowedIntents];\n const type = allowedTypes.includes(this.type) ? this.type : '';\n const icon = type === 'icon';\n const fab = type === 'fab';\n const custom = type === 'custom';\n let intent;\n if (allowedIntents.includes(type)) {\n intent = type === 'neutral' ? type : `workflow-${type}`;\n }\n const active = this.open;\n const disabled = !!this.disabled;\n const ariaExpanded = this.open;\n const className = !icon && !fab && !intent ? 'unstyled' : '';\n\n return {\n icon,\n fab,\n intent,\n active,\n disabled,\n ariaExpanded,\n className,\n custom,\n };\n }\n\n //////// Observers //////////\n @Watch('popDirection')\n popDirectionHandler() {\n handleRenamedProp(this, 'popDirection', 'popoverDirection');\n }\n\n @Watch('alignment')\n alignmentHandler() {\n handleRenamedProp(this, 'alignment', 'popoverAlignment');\n }\n\n @Watch('ariaLabel')\n ariaLabelHandler() {\n handleAriaLabel(this);\n }\n\n @Watch('name')\n nameHandler() {\n this.orchestrateResolvedMenuItems();\n }\n\n @Watch('context')\n contextHandler() {\n this.orchestrateResolvedMenuItems();\n }\n\n @Watch('contextValue')\n contextValueHandler() {\n this.orchestrateResolvedMenuItems();\n }\n\n @Watch('resolvedType')\n resolvedTypeHandler() {\n this.orchestrateResolvedMenuItems();\n }\n\n @Watch('additionalContext')\n additionalContextHandler() {\n this.orchestrateResolvedMenuItems();\n }\n\n @Listen('focus')\n delegateFocus(event: FocusEvent) {\n if (!isEventFromElement(event, this.hostElement)) return;\n this.focusToggle();\n }\n\n @Listen('popoverStateChanged')\n popoverStateHandler({ detail: { open } }: CustomEvent<{ open: boolean }>) {\n if (this.open !== open) this.open = open;\n this.popoverElement?.scrollContainerTo({ top: 0 });\n }\n\n ///// Lifecycle Hooks ////////\n componentWillLoad() {\n this.popDirectionHandler();\n this.alignmentHandler();\n this.ariaLabelHandler();\n }\n\n componentDidLoad() {\n this.orchestrateResolvedMenuItems();\n overrideFocus(this.hostElement);\n }\n\n ///// Actions ////////\n focusToggle = () => {\n this.controlElement.shadowRoot.querySelector<HTMLButtonElement>('button').focus();\n };\n\n openDropdown = () => {\n if (this.open) return;\n this.open = true;\n };\n\n closeDropdown = () => {\n if (!this.open) return;\n this.open = false;\n };\n\n onClickElsewhere = (event: CustomEvent) => {\n const target = event.target as HTMLClickElsewhereElement;\n if (target.localName === 'click-elsewhere') {\n event.stopPropagation();\n const { popoverElement } = this;\n if (!popoverElement) return;\n popoverElement.open = false;\n }\n };\n\n onToggleClick = () => {\n if (this.open) {\n this.closeDropdown();\n } else {\n this.openDropdown();\n }\n };\n\n onToggleKeydown = (event: KeyboardEvent) => {\n if (['ArrowUp', 'Up'].includes(event.key)) {\n event.preventDefault();\n this.openDropdown();\n this.focusLastItem();\n return;\n }\n\n if (['ArrowDown', 'Down'].includes(event.key)) {\n event.preventDefault();\n this.openDropdown();\n this.focusFirstItem();\n return;\n }\n\n if (['Escape', 'Esc'].includes(event.key)) {\n event.preventDefault();\n this.focusToggle();\n this.closeDropdown();\n return;\n }\n };\n\n onDropdownMenuClick = (event: MouseEvent | CustomEvent) => {\n if ((event.target as HTMLElement).localName !== 'q2-dropdown-item') {\n return;\n }\n const item = event.target as HTMLQ2DropdownItemElement;\n if (!item.disabled && !item.separator) {\n this.focusToggle();\n this.closeDropdown();\n }\n };\n\n focusFirstItem() {\n const firstItem = this.hostElement.querySelector<HTMLQ2DropdownItemElement>(\n `${this.dropdownItemSelector}:first-child`\n );\n\n firstItem?.dispatchEvent(new FocusEvent('focus'));\n }\n\n focusLastItem() {\n const lastItem = this.hostElement.querySelector<HTMLQ2DropdownItemElement>(\n `${this.dropdownItemSelector}:last-child`\n );\n lastItem?.dispatchEvent(new FocusEvent('focus'));\n }\n\n focusAdjacentItem(activeItem: HTMLQ2DropdownItemElement, direction: 'next' | 'prev') {\n const dropdownItems: HTMLQ2DropdownItemElement[] = Array.from(\n this.hostElement.querySelectorAll(this.dropdownItemSelector)\n );\n\n const activeIndex = dropdownItems.indexOf(activeItem);\n\n if (activeIndex === -1) {\n return;\n }\n\n let targetIndex: number = 0;\n if (direction === 'next') {\n targetIndex = activeIndex < dropdownItems.length - 1 ? activeIndex + 1 : 0;\n } else if (direction === 'prev') {\n if (activeIndex > 0) {\n targetIndex = activeIndex - 1;\n } else {\n targetIndex = dropdownItems.length - 1;\n }\n }\n const targetItem = dropdownItems[targetIndex];\n targetItem && targetItem.dispatchEvent(new Event('focus'));\n }\n\n onDropdownMenuKeydown = (event: KeyboardEvent) => {\n if (['Escape', 'Esc'].includes(event.key)) {\n this.closeDropdown();\n this.focusToggle();\n return;\n }\n\n if ((event.target as HTMLElement).localName !== 'q2-dropdown-item') {\n return;\n }\n\n const item = event.target as HTMLQ2DropdownItemElement;\n if (['ArrowUp', 'Up'].includes(event.key)) {\n event.preventDefault();\n this.focusAdjacentItem(item, 'prev');\n return;\n }\n\n if (['ArrowDown', 'Down'].includes(event.key)) {\n event.preventDefault();\n this.focusAdjacentItem(item, 'next');\n return;\n }\n if (event.key === 'Tab') {\n event.preventDefault();\n }\n };\n\n /// DOM ///\n\n render() {\n const btnProps = this.toggleButtonProps;\n\n return (\n <click-elsewhere\n class={this.open ? 'dropdown-open' : ''}\n onChange={this.onClickElsewhere}\n test-id=\"dropdownContainer\"\n >\n <q2-btn\n ref={el => (this.controlElement = el)}\n class={btnProps.className}\n onClick={this.onToggleClick}\n onKeyDown={this.onToggleKeydown}\n fab={btnProps.fab}\n intent={btnProps.intent}\n active={btnProps.active}\n disabled={btnProps.disabled}\n ariaExpanded={`${!!btnProps.ariaExpanded}`}\n label={this.hideLabel && this.label ? loc(this.label) : undefined}\n hideLabel={this.hideLabel}\n ariaHasPopup=\"menu\"\n test-id=\"dropdownButton\"\n block={this.block}\n description={loc('tecton.element.dropdown.itemCount', [this.determineDropdownItemCount])}\n >\n {this.hasCustomButton ? (\n <div\n test-id=\"dropdownCustom\"\n class={btnProps.custom ? '' : 'hidden'}\n >\n <slot name=\"custom-dropdown-button\" />\n </div>\n ) : (\n <Fragment>\n {this.icon ? <q2-icon type={this.icon} /> : ' '}\n {this.label && !this.hideLabel && (\n <span class=\"dropdown-button-text\">{loc(this.label)}</span>\n )}\n </Fragment>\n )}\n </q2-btn>\n <q2-popover\n ref={el => (this.popoverElement = el)}\n controlElement={this.controlElement}\n open={this.open}\n minHeight={this.popoverMinHeight}\n direction={this.popoverDirection}\n align={this.popoverAlignment}\n block={this.block}\n >\n <div\n onClick={this.onDropdownMenuClick}\n onKeyDown={this.onDropdownMenuKeydown}\n >\n <slot />\n {this.open && (\n <q2-btn\n class=\"sr close-dropdown\"\n onFocus={this.closeDropdown}\n />\n )}\n </div>\n </q2-popover>\n </click-elsewhere>\n );\n }\n}\n"]}
|
|
@@ -81,7 +81,6 @@ export class Q2EditableField {
|
|
|
81
81
|
componentDidRender() {
|
|
82
82
|
this.scheduledAfterRender.forEach(fn => fn());
|
|
83
83
|
this.scheduledAfterRender = [];
|
|
84
|
-
this.formattedValue = this.inputElement.formattedValue;
|
|
85
84
|
}
|
|
86
85
|
componentDidLoad() {
|
|
87
86
|
overrideFocus(this.hostElement);
|
|
@@ -127,6 +126,9 @@ export class Q2EditableField {
|
|
|
127
126
|
return;
|
|
128
127
|
this.hostElement.shadowRoot.querySelector(this.editing ? 'q2-input' : 'q2-btn.begin-edit').focus();
|
|
129
128
|
}
|
|
129
|
+
inputFormatted(event) {
|
|
130
|
+
this.formattedValue = event.detail.formattedValue;
|
|
131
|
+
}
|
|
130
132
|
/// Methods ///
|
|
131
133
|
clickEdit() {
|
|
132
134
|
var _a;
|
|
@@ -163,12 +165,9 @@ export class Q2EditableField {
|
|
|
163
165
|
}
|
|
164
166
|
generateReadStateDOM() {
|
|
165
167
|
if (this.persistentLabel && this.locLabel) {
|
|
166
|
-
return (h("div", { class: this.wrapperClass, hidden: this.editing }, h("dl", null, h("dt", { class: "read-state-label" }, this.locLabel), h("dd", null, h("span", { class: "text-wrapper" }, this.formattedValue || this.value), this.
|
|
168
|
+
return (h("div", { class: this.wrapperClass, hidden: this.editing }, h("dl", null, h("dt", { class: "read-state-label" }, this.locLabel), h("dd", null, h("span", { class: "text-wrapper" }, this.formattedValue || this.value), h("q2-btn", { ref: el => (this.editBtnElement = el), class: "begin-edit", label: `${loc('tecton.element.editableField.edit')} ${this.locLabel}`, "hide-label": true, disabled: this.disabled, "test-id": "editButton", onClick: this.editClick }, h("q2-icon", { type: "edit" }))))));
|
|
167
169
|
}
|
|
168
|
-
return (h("div", { class: this.wrapperClass, hidden: this.editing }, h("div", { class: "text-wrapper" }, this.formattedValue || this.value), this.
|
|
169
|
-
}
|
|
170
|
-
generateEditBtn() {
|
|
171
|
-
return (h("q2-btn", { ref: el => (this.editBtnElement = el), class: "begin-edit", label: `${loc('tecton.element.editableField.edit')} ${this.locLabel}`, "hide-label": true, disabled: this.disabled, "test-id": "editButton", onClick: this.editClick }, h("q2-icon", { type: "edit" })));
|
|
170
|
+
return (h("div", { class: this.wrapperClass, hidden: this.editing }, h("div", { class: "text-wrapper" }, this.formattedValue || this.value), h("q2-btn", { ref: el => (this.editBtnElement = el), class: "begin-edit", label: `${loc('tecton.element.editableField.edit')} ${this.locLabel}`, "hide-label": true, disabled: this.disabled, "test-id": "editButton", onClick: this.editClick }, h("q2-icon", { type: "edit" }))));
|
|
172
171
|
}
|
|
173
172
|
static get is() { return "q2-editable-field"; }
|
|
174
173
|
static get encapsulation() { return "shadow"; }
|
|
@@ -557,6 +556,12 @@ export class Q2EditableField {
|
|
|
557
556
|
"target": undefined,
|
|
558
557
|
"capture": false,
|
|
559
558
|
"passive": false
|
|
559
|
+
}, {
|
|
560
|
+
"name": "formatted",
|
|
561
|
+
"method": "inputFormatted",
|
|
562
|
+
"target": undefined,
|
|
563
|
+
"capture": false,
|
|
564
|
+
"passive": false
|
|
560
565
|
}];
|
|
561
566
|
}
|
|
562
567
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/components/q2-editable-field/index.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, State, Prop, h, Listen, Element, Event, EventEmitter, Method, Watch } from '@stencil/core';\nimport { IEventDetail, Q2InputCustomEvent } from 'src/components';\nimport { handleAriaLabel, isEventFromElement, loc, overrideFocus, waitForNextPaint } from 'src/utils';\nimport { Q2Input } from '../q2-input';\nimport { IFormatterValueObject } from '../q2-input/types';\n\ninterface IExtendedQ2InputElement extends HTMLQ2InputElement {\n formattedValue: IFormatterValueObject['formattedValue'];\n}\n\n@Component({\n tag: 'q2-editable-field',\n shadow: true,\n styleUrl: 'styles.scss',\n})\nexport class Q2EditableField {\n @Prop({ reflect: true, mutable: true }) value: string = '';\n @Prop({ reflect: true, mutable: true }) editing: boolean = false;\n @Prop({ reflect: true, mutable: true }) label: string = '';\n @Prop({ reflect: true, mutable: true }) hideLabel: boolean;\n @Prop({ reflect: true }) type: Q2Input['type'];\n @Prop({ reflect: true }) formatModifier: string;\n @Prop({ reflect: true }) truncated: boolean;\n @Prop({ reflect: true }) maxlength: number;\n @Prop({ reflect: true }) persistentLabel: boolean;\n @Prop({ reflect: true }) disabled: boolean;\n @Prop({ reflect: true }) block: boolean;\n @Prop() hints: string[];\n @Prop() errors: string[];\n\n /** @deprecated */\n @Prop({ reflect: true, mutable: true }) ariaLabel: string;\n\n scheduledAfterRender: (() => void)[] = [];\n\n @Element() hostElement: HTMLElement;\n inputElement: HTMLQ2InputElement;\n editBtnElement: HTMLQ2BtnElement;\n cancelBtnElement: HTMLQ2BtnElement;\n saveBtnElement: HTMLQ2BtnElement;\n\n @State() formattedValue: string;\n innerValue: string;\n defaultValue: string = this.value;\n\n get locLabel() {\n return (this.label && loc(this.label)) || '';\n }\n\n /////// LIFECYCLE HOOKS ///////\n\n componentWillLoad() {\n handleAriaLabel(this);\n }\n\n componentDidRender() {\n this.scheduledAfterRender.forEach(fn => fn());\n this.scheduledAfterRender = [];\n this.formattedValue = (this.inputElement as IExtendedQ2InputElement).formattedValue;\n }\n\n componentDidLoad() {\n overrideFocus(this.hostElement);\n }\n\n //////// OBSERVERS ////////\n\n @Watch('errors')\n errorsObserver() {\n const { editing, errors = [] } = this;\n const focusedElement = this.hostElement.shadowRoot.activeElement;\n const isInputFocused = focusedElement?.tagName === 'Q2-INPUT' ?? false;\n const hasErrors = errors.length;\n if (isInputFocused || !focusedElement || !editing || !hasErrors) return;\n this.inputElement.focus();\n }\n\n @Watch('ariaLabel')\n ariaLabelObserver() {\n handleAriaLabel(this);\n }\n\n @Watch('editing')\n observesEditing(newValue: boolean, oldValue: boolean) {\n if (newValue === oldValue) return;\n this.scheduledAfterRender.push(this.hostElement.focus);\n }\n\n get wrapperClass() {\n return `q2-editable-field-wrapper ${this.editing ? 'editing' : ''}`;\n }\n\n ///////// HOST ELEMENT EVENTS //////\n\n @Listen('change')\n onHostElementChange(event: CustomEvent) {\n if (!isEventFromElement(event, this.hostElement) || this.hostElement.onchange) return;\n switch (event.detail.name) {\n case 'save':\n this.value = event.detail.value;\n break;\n\n case 'cancel':\n this.inputElement.value = this.value;\n break;\n }\n\n this.editing = event.detail.editing;\n }\n\n @Listen('focus')\n delegateFocus(event: FocusEvent) {\n if (!isEventFromElement(event, this.hostElement)) return;\n this.hostElement.shadowRoot.querySelector<HTMLElement>(this.editing ? 'q2-input' : 'q2-btn.begin-edit').focus();\n }\n\n ///////// EVENTS /////////\n\n @Event() input: EventEmitter;\n @Event() change: EventEmitter;\n\n /// Methods ///\n @Method()\n clickEdit() {\n if (this.editing) return;\n this.editBtnElement?.click();\n }\n\n @Method()\n clickCancel() {\n if (!this.editing) return;\n this.cancelBtnElement?.click();\n }\n\n @Method()\n clickSave() {\n if (!this.editing) return;\n this.saveBtnElement?.click();\n }\n\n @Method()\n async setValue(value: string, options: { clickSave?: boolean } = { clickSave: true }) {\n await this.clickEdit();\n await waitForNextPaint();\n\n await this.inputElement.setValue(value);\n\n if (options.clickSave) {\n await this.clickSave();\n await waitForNextPaint();\n }\n }\n\n //////// ACTIONS /////////\n\n inputInput = (event: Q2InputCustomEvent<IEventDetail> & InputEvent) => {\n event.stopPropagation();\n this.input.emit(event.detail);\n this.formattedValue = event.detail.formattedValue;\n this.innerValue = event.detail.value;\n };\n\n inputChange = (e: CustomEvent) => {\n e.stopPropagation();\n };\n\n inputKeyDown = (e: KeyboardEvent) => {\n if (e.key === 'Escape' || e.key === 'Esc') {\n e.preventDefault();\n this.cancelClick();\n return;\n }\n\n if (e.key === 'Enter') {\n e.preventDefault();\n this.saveClick();\n return;\n }\n };\n\n inputClick = (event: MouseEvent) => {\n event.stopPropagation();\n };\n\n saveClick = (event?: MouseEvent) => {\n event && event.stopPropagation();\n const valueFromInputProp = this.hostElement.shadowRoot.querySelector('q2-input').value;\n this.defaultValue = valueFromInputProp;\n this.change.emit({\n editing: false,\n name: 'save',\n value: this.innerValue || valueFromInputProp,\n formattedValue: this.formattedValue || valueFromInputProp,\n });\n\n setTimeout(() => {\n const { errors = [] } = this;\n if (!errors.length) return;\n this.hostElement.focus();\n }, 1);\n };\n\n editClick = (event: MouseEvent) => {\n event?.stopPropagation();\n this.change.emit({ editing: true, name: 'edit' });\n };\n\n cancelClick = (event?: MouseEvent) => {\n event?.stopPropagation();\n this.change.emit({ editing: false, name: 'cancel' });\n this.hostElement.shadowRoot.querySelector('q2-input').value = this.defaultValue;\n };\n\n render() {\n return (\n <div>\n {this.generateEditStateDOM()}\n {this.generateReadStateDOM()}\n </div>\n );\n }\n\n generateEditStateDOM() {\n return (\n <div\n class={this.wrapperClass}\n hidden={!this.editing}\n >\n <q2-input\n ref={el => (this.inputElement = el)}\n label={this.locLabel}\n hideLabel={this.hideLabel}\n value={this.value}\n hints={(Array.isArray(this.hints) && this.hints.map(str => loc(str))) || undefined}\n errors={(Array.isArray(this.errors) && this.errors.map(str => loc(str))) || undefined}\n type={this.type}\n disabled={this.disabled}\n formatModifier={this.formatModifier}\n maxlength={this.maxlength}\n test-id=\"editableInput\"\n onInput={this.inputInput}\n onChange={this.inputChange}\n onKeyDown={this.inputKeyDown}\n onClick={this.inputClick}\n />\n <q2-btn\n ref={el => (this.cancelBtnElement = el)}\n class=\"cancel-edit\"\n label={`${loc('tecton.element.editableField.cancel')} ${this.locLabel}`}\n hide-label\n test-id=\"cancelButton\"\n onClick={this.cancelClick}\n >\n <q2-icon type=\"close\" />\n </q2-btn>\n <q2-btn\n ref={el => (this.saveBtnElement = el)}\n class=\"save-edit\"\n label={`${loc('tecton.element.editableField.save')} ${this.locLabel}`}\n hide-label\n test-id=\"saveButton\"\n onClick={this.saveClick}\n >\n <q2-icon type=\"checkmark\" />\n </q2-btn>\n </div>\n );\n }\n\n generateReadStateDOM() {\n if (this.persistentLabel && this.locLabel) {\n return (\n <div\n class={this.wrapperClass}\n hidden={this.editing}\n >\n <dl>\n <dt class=\"read-state-label\">{this.locLabel}</dt>\n <dd>\n <span class=\"text-wrapper\">{this.formattedValue || this.value}</span>\n {this.generateEditBtn()}\n </dd>\n </dl>\n </div>\n );\n }\n return (\n <div\n class={this.wrapperClass}\n hidden={this.editing}\n >\n <div class=\"text-wrapper\">{this.formattedValue || this.value}</div>\n {this.generateEditBtn()}\n </div>\n );\n }\n\n generateEditBtn() {\n return (\n <q2-btn\n ref={el => (this.editBtnElement = el)}\n class=\"begin-edit\"\n label={`${loc('tecton.element.editableField.edit')} ${this.locLabel}`}\n hide-label\n disabled={this.disabled}\n test-id=\"editButton\"\n onClick={this.editClick}\n >\n <q2-icon type=\"edit\" />\n </q2-btn>\n );\n }\n}\n"]}
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/components/q2-editable-field/index.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, State, Prop, h, Listen, Element, Event, EventEmitter, Method, Watch } from '@stencil/core';\nimport { IEventDetail, Q2InputCustomEvent } from 'src/components';\nimport { handleAriaLabel, isEventFromElement, loc, overrideFocus, waitForNextPaint } from 'src/utils';\nimport { Q2Input } from '../q2-input';\nimport { IFormatterValueObject } from '../q2-input/types';\n\n@Component({\n tag: 'q2-editable-field',\n shadow: true,\n styleUrl: 'styles.scss',\n})\nexport class Q2EditableField {\n @Prop({ reflect: true, mutable: true }) value: string = '';\n @Prop({ reflect: true, mutable: true }) editing: boolean = false;\n @Prop({ reflect: true, mutable: true }) label: string = '';\n @Prop({ reflect: true, mutable: true }) hideLabel: boolean;\n @Prop({ reflect: true }) type: Q2Input['type'];\n @Prop({ reflect: true }) formatModifier: string;\n @Prop({ reflect: true }) truncated: boolean;\n @Prop({ reflect: true }) maxlength: number;\n @Prop({ reflect: true }) persistentLabel: boolean;\n @Prop({ reflect: true }) disabled: boolean;\n @Prop({ reflect: true }) block: boolean;\n @Prop() hints: string[];\n @Prop() errors: string[];\n\n /** @deprecated */\n @Prop({ reflect: true, mutable: true }) ariaLabel: string;\n\n scheduledAfterRender: (() => void)[] = [];\n\n @Element() hostElement: HTMLElement;\n inputElement: HTMLQ2InputElement;\n editBtnElement: HTMLQ2BtnElement;\n cancelBtnElement: HTMLQ2BtnElement;\n saveBtnElement: HTMLQ2BtnElement;\n\n @State() formattedValue: string;\n innerValue: string;\n defaultValue: string = this.value;\n\n get locLabel() {\n return (this.label && loc(this.label)) || '';\n }\n\n /////// LIFECYCLE HOOKS ///////\n\n componentWillLoad() {\n handleAriaLabel(this);\n }\n\n componentDidRender() {\n this.scheduledAfterRender.forEach(fn => fn());\n this.scheduledAfterRender = [];\n }\n\n componentDidLoad() {\n overrideFocus(this.hostElement);\n }\n\n //////// OBSERVERS ////////\n\n @Watch('errors')\n errorsObserver() {\n const { editing, errors = [] } = this;\n const focusedElement = this.hostElement.shadowRoot.activeElement;\n const isInputFocused = focusedElement?.tagName === 'Q2-INPUT' ?? false;\n const hasErrors = errors.length;\n if (isInputFocused || !focusedElement || !editing || !hasErrors) return;\n this.inputElement.focus();\n }\n\n @Watch('ariaLabel')\n ariaLabelObserver() {\n handleAriaLabel(this);\n }\n\n @Watch('editing')\n observesEditing(newValue: boolean, oldValue: boolean) {\n if (newValue === oldValue) return;\n this.scheduledAfterRender.push(this.hostElement.focus);\n }\n\n get wrapperClass() {\n return `q2-editable-field-wrapper ${this.editing ? 'editing' : ''}`;\n }\n\n ///////// HOST ELEMENT EVENTS //////\n\n @Listen('change')\n onHostElementChange(event: CustomEvent) {\n if (!isEventFromElement(event, this.hostElement) || this.hostElement.onchange) return;\n switch (event.detail.name) {\n case 'save':\n this.value = event.detail.value;\n break;\n\n case 'cancel':\n this.inputElement.value = this.value;\n break;\n }\n\n this.editing = event.detail.editing;\n }\n\n @Listen('focus')\n delegateFocus(event: FocusEvent) {\n if (!isEventFromElement(event, this.hostElement)) return;\n this.hostElement.shadowRoot.querySelector<HTMLElement>(this.editing ? 'q2-input' : 'q2-btn.begin-edit').focus();\n }\n\n @Listen('formatted')\n inputFormatted(event: CustomEvent<IFormatterValueObject>) {\n this.formattedValue = event.detail.formattedValue;\n }\n\n ///////// EVENTS /////////\n\n @Event() input: EventEmitter;\n @Event() change: EventEmitter;\n\n /// Methods ///\n @Method()\n clickEdit() {\n if (this.editing) return;\n this.editBtnElement?.click();\n }\n\n @Method()\n clickCancel() {\n if (!this.editing) return;\n this.cancelBtnElement?.click();\n }\n\n @Method()\n clickSave() {\n if (!this.editing) return;\n this.saveBtnElement?.click();\n }\n\n @Method()\n async setValue(value: string, options: { clickSave?: boolean } = { clickSave: true }) {\n await this.clickEdit();\n await waitForNextPaint();\n\n await this.inputElement.setValue(value);\n\n if (options.clickSave) {\n await this.clickSave();\n await waitForNextPaint();\n }\n }\n\n //////// ACTIONS /////////\n\n inputInput = (event: Q2InputCustomEvent<IEventDetail> & InputEvent) => {\n event.stopPropagation();\n this.input.emit(event.detail);\n this.formattedValue = event.detail.formattedValue;\n this.innerValue = event.detail.value;\n };\n\n inputChange = (e: CustomEvent) => {\n e.stopPropagation();\n };\n\n inputKeyDown = (e: KeyboardEvent) => {\n if (e.key === 'Escape' || e.key === 'Esc') {\n e.preventDefault();\n this.cancelClick();\n return;\n }\n\n if (e.key === 'Enter') {\n e.preventDefault();\n this.saveClick();\n return;\n }\n };\n\n inputClick = (event: MouseEvent) => {\n event.stopPropagation();\n };\n\n saveClick = (event?: MouseEvent) => {\n event && event.stopPropagation();\n const valueFromInputProp = this.hostElement.shadowRoot.querySelector('q2-input').value;\n this.defaultValue = valueFromInputProp;\n this.change.emit({\n editing: false,\n name: 'save',\n value: this.innerValue || valueFromInputProp,\n formattedValue: this.formattedValue || valueFromInputProp,\n });\n\n setTimeout(() => {\n const { errors = [] } = this;\n if (!errors.length) return;\n this.hostElement.focus();\n }, 1);\n };\n\n editClick = (event: MouseEvent) => {\n event?.stopPropagation();\n this.change.emit({ editing: true, name: 'edit' });\n };\n\n cancelClick = (event?: MouseEvent) => {\n event?.stopPropagation();\n this.change.emit({ editing: false, name: 'cancel' });\n this.hostElement.shadowRoot.querySelector('q2-input').value = this.defaultValue;\n };\n\n render() {\n return (\n <div>\n {this.generateEditStateDOM()}\n {this.generateReadStateDOM()}\n </div>\n );\n }\n\n generateEditStateDOM() {\n return (\n <div\n class={this.wrapperClass}\n hidden={!this.editing}\n >\n <q2-input\n ref={el => (this.inputElement = el)}\n label={this.locLabel}\n hideLabel={this.hideLabel}\n value={this.value}\n hints={(Array.isArray(this.hints) && this.hints.map(str => loc(str))) || undefined}\n errors={(Array.isArray(this.errors) && this.errors.map(str => loc(str))) || undefined}\n type={this.type}\n disabled={this.disabled}\n formatModifier={this.formatModifier}\n maxlength={this.maxlength}\n test-id=\"editableInput\"\n onInput={this.inputInput}\n onChange={this.inputChange}\n onKeyDown={this.inputKeyDown}\n onClick={this.inputClick}\n />\n <q2-btn\n ref={el => (this.cancelBtnElement = el)}\n class=\"cancel-edit\"\n label={`${loc('tecton.element.editableField.cancel')} ${this.locLabel}`}\n hide-label\n test-id=\"cancelButton\"\n onClick={this.cancelClick}\n >\n <q2-icon type=\"close\" />\n </q2-btn>\n <q2-btn\n ref={el => (this.saveBtnElement = el)}\n class=\"save-edit\"\n label={`${loc('tecton.element.editableField.save')} ${this.locLabel}`}\n hide-label\n test-id=\"saveButton\"\n onClick={this.saveClick}\n >\n <q2-icon type=\"checkmark\" />\n </q2-btn>\n </div>\n );\n }\n\n generateReadStateDOM() {\n if (this.persistentLabel && this.locLabel) {\n return (\n <div\n class={this.wrapperClass}\n hidden={this.editing}\n >\n <dl>\n <dt class=\"read-state-label\">{this.locLabel}</dt>\n <dd>\n <span class=\"text-wrapper\">{this.formattedValue || this.value}</span>\n <q2-btn\n ref={el => (this.editBtnElement = el)}\n class=\"begin-edit\"\n label={`${loc('tecton.element.editableField.edit')} ${this.locLabel}`}\n hide-label\n disabled={this.disabled}\n test-id=\"editButton\"\n onClick={this.editClick}\n >\n <q2-icon type=\"edit\" />\n </q2-btn>\n </dd>\n </dl>\n </div>\n );\n }\n return (\n <div\n class={this.wrapperClass}\n hidden={this.editing}\n >\n <div class=\"text-wrapper\">{this.formattedValue || this.value}</div>\n <q2-btn\n ref={el => (this.editBtnElement = el)}\n class=\"begin-edit\"\n label={`${loc('tecton.element.editableField.edit')} ${this.locLabel}`}\n hide-label\n disabled={this.disabled}\n test-id=\"editButton\"\n onClick={this.editClick}\n >\n <q2-icon type=\"edit\" />\n </q2-btn>\n </div>\n );\n }\n}\n"]}
|
|
@@ -562,7 +562,7 @@ export class Q2Input {
|
|
|
562
562
|
"references": {
|
|
563
563
|
"InputType": {
|
|
564
564
|
"location": "local",
|
|
565
|
-
"path": "/
|
|
565
|
+
"path": "/builds/q2e/development/tecton/tecton/packages/q2-tecton-elements/src/components/q2-input/index.tsx"
|
|
566
566
|
}
|
|
567
567
|
}
|
|
568
568
|
},
|
|
@@ -596,7 +596,7 @@ export class Q2OptionList {
|
|
|
596
596
|
"references": {
|
|
597
597
|
"IOptionValue": {
|
|
598
598
|
"location": "local",
|
|
599
|
-
"path": "/
|
|
599
|
+
"path": "/builds/q2e/development/tecton/tecton/packages/q2-tecton-elements/src/components/q2-option-list/index.tsx"
|
|
600
600
|
}
|
|
601
601
|
}
|
|
602
602
|
},
|
|
@@ -722,7 +722,7 @@ export class Q2OptionList {
|
|
|
722
722
|
"references": {
|
|
723
723
|
"IOptionValue": {
|
|
724
724
|
"location": "local",
|
|
725
|
-
"path": "/
|
|
725
|
+
"path": "/builds/q2e/development/tecton/tecton/packages/q2-tecton-elements/src/components/q2-option-list/index.tsx"
|
|
726
726
|
}
|
|
727
727
|
}
|
|
728
728
|
}
|
|
@@ -20,6 +20,7 @@ export class Q2Select {
|
|
|
20
20
|
if (this.hasCustomDisplay !== hasCustomDisplay) {
|
|
21
21
|
this.hasCustomDisplay = hasCustomDisplay;
|
|
22
22
|
}
|
|
23
|
+
this.checkSelectedOptions();
|
|
23
24
|
};
|
|
24
25
|
this.onOptionListChange = (event) => {
|
|
25
26
|
event.stopPropagation();
|
|
@@ -117,16 +118,6 @@ export class Q2Select {
|
|
|
117
118
|
this.focusInput();
|
|
118
119
|
this.toggleDropdown();
|
|
119
120
|
};
|
|
120
|
-
this.onOptionListSlotChange = async () => {
|
|
121
|
-
const options = (await this.optionList.getOptions()).map(option => option.value);
|
|
122
|
-
if (this.multiple) {
|
|
123
|
-
// allow only intersectioned value
|
|
124
|
-
this.selectedOptions = this.selectedOptions.filter(option => options.includes(option));
|
|
125
|
-
}
|
|
126
|
-
else if (!options.includes(this.value)) {
|
|
127
|
-
this.value = undefined;
|
|
128
|
-
}
|
|
129
|
-
};
|
|
130
121
|
this.label = undefined;
|
|
131
122
|
this.hideLabel = undefined;
|
|
132
123
|
this.value = undefined;
|
|
@@ -466,6 +457,17 @@ export class Q2Select {
|
|
|
466
457
|
this.statusMessage = message;
|
|
467
458
|
}, 1000);
|
|
468
459
|
}
|
|
460
|
+
checkSelectedOptions() {
|
|
461
|
+
const { multiple, selectedOptions, value } = this;
|
|
462
|
+
this.optionElements.forEach(option => {
|
|
463
|
+
if (multiple) {
|
|
464
|
+
option.selected = selectedOptions.includes(option.value);
|
|
465
|
+
}
|
|
466
|
+
else {
|
|
467
|
+
option.selected = option.value === value;
|
|
468
|
+
}
|
|
469
|
+
});
|
|
470
|
+
}
|
|
469
471
|
clearSelectedDisplay() {
|
|
470
472
|
var _a;
|
|
471
473
|
(_a = this.selectedDisplaySlot) === null || _a === void 0 ? void 0 : _a.remove();
|
|
@@ -522,7 +524,7 @@ export class Q2Select {
|
|
|
522
524
|
[], disabled: this.disabled, optional: this.optional, readonly: this.readonly, placeholder: this.placeholder || undefined, hideLabel: this.hideLabel, ariaExpanded: `${this.open}`, ariaControls: "option-list", ariaHaspopup: "listbox", role: "combobox", pseudo: showAsPseudo, "test-id": "toggleDropdown", "hide-messages": true, iconRight: "chevron-down", onClick: this.inputClickHandler, onInput: this.inputInputHandler, onKeyDown: this.inputKeydownHandler, onFocus: this.inputFocusHandler, onBlur: this.inputBlurHandler, onChange: this.inputChangeHandler, badgeValue: this.badgeValue, badgeTheme: this.inputFocused ? 'primary' : undefined }, this.renderCustomDisplay()), h("div", { class: "custom-display-content", hidden: !this.hasCustomDisplay || !!this.searchText, onClick: this.onCustomDisplayClick }, h("slot", { name: "q2-select-display" })), this.optionsDropdown()));
|
|
523
525
|
}
|
|
524
526
|
optionsDropdown() {
|
|
525
|
-
return (h("q2-popover", { ref: el => (this.popoverElement = el), controlElement: this.innerInputField, open: this.open, minHeight: this.popoverMinHeight, direction: this.popDirection, onPopoverStateChanged: this.popoverStateChanged, block: true }, h("div", { class: "popover-content", tabindex: "-1" }, h("q2-option-list", { ref: el => (this.optionList = el), type: "listbox", id: "option-list", "show-selected": this.showSelected, "aria-label": this.listLabel, multiple: this.multiple, selectedOptions: this.structuredSelectedOptions, onChange: this.onOptionListChange }, h("slot",
|
|
527
|
+
return (h("q2-popover", { ref: el => (this.popoverElement = el), controlElement: this.innerInputField, open: this.open, minHeight: this.popoverMinHeight, direction: this.popDirection, onPopoverStateChanged: this.popoverStateChanged, block: true }, h("div", { class: "popover-content", tabindex: "-1" }, h("q2-option-list", { ref: el => (this.optionList = el), type: "listbox", id: "option-list", "show-selected": this.showSelected, "aria-label": this.listLabel, multiple: this.multiple, selectedOptions: this.structuredSelectedOptions, onChange: this.onOptionListChange }, h("slot", null)), this.multiple && this.visibilityToggle())));
|
|
526
528
|
}
|
|
527
529
|
visibilityToggle() {
|
|
528
530
|
var _a, _b;
|