yv01p/Umbraco-CMS
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

add open state to variant selector to affect expand symbol

Browse Source
This commit is contained in:
Jesper Møller Jensen
2023-11-23 15:18:28 +13:00
parent 3ebaf0daca
commit eae9d205c9
1 changed files with 9 additions and 2 deletions
Download Patch File Download Diff File Expand all files Collapse all files

11
src/Umbraco.Web.UI.Client/src/packages/core/components/variant-selector/variant-selector.element.ts
View File

@@ -40,6 +40,9 @@ export class UmbVariantSelectorElement extends UmbLitElement {
@state()
private _variantTitleName?: string;
@state()
private _variantSelectorOpen = false;
// TODO: make adapt to backoffice locale.
private _cultureNames = new Intl.DisplayNames('en', { type: 'language' });
@@ -152,6 +155,10 @@ export class UmbVariantSelectorElement extends UmbLitElement {
return state !== ContentStateModel.PUBLISHED && !this._isVariantActive(culture!);
}
#onPopoverToggle(event: any) {
this._variantSelectorOpen = event.newState === 'open';
}
render() {
return html`
<uui-input id="name-input" .value=${this._name} @input="${this._handleInput}">
@@ -164,7 +171,7 @@ export class UmbVariantSelectorElement extends UmbLitElement {
popovertarget="variant-selector-popover"
title=${ifDefined(this._variantTitleName)}>
${this._variantDisplayName}
<uui-symbol-expand></uui-symbol-expand>
<uui-symbol-expand .open=${this._variantSelectorOpen}></uui-symbol-expand>
</uui-button>
${this._activeVariants.length > 1
? html`
@@ -181,7 +188,7 @@ export class UmbVariantSelectorElement extends UmbLitElement {
${
this._variants && this._variants.length > 0
? html`
<uui-popover-container id="variant-selector-popover" popover>
<uui-popover-container id="variant-selector-popover" @toggle=${this.#onPopoverToggle} popover>
<div id="variant-selector-dropdown">
<uui-scroll-container>
<ul>