@luzmo/lucero 1.0.1-alpha.19 → 1.0.1-alpha.20
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/action-menu/index.cjs +1 -1
- package/components/action-menu/index.js +1 -1
- package/components/index.cjs +1 -1
- package/components/index.js +1 -1
- package/components/picker/index.cjs +1 -1
- package/components/picker/index.js +2 -2
- package/components/{picker-W1qNmtsh.js → picker-BsQJBF9j.js} +33 -32
- package/components/{picker-C0LvseZe.cjs → picker-X96xmLAw.cjs} +3 -3
- package/components/select/index.cjs +12 -12
- package/components/select/index.js +74 -73
- package/components/{strategies-CUMLHtQI.js → strategies-Bk97oVn1.js} +14 -49
- package/components/strategies-CNgBb6dM.cjs +18 -0
- package/package.json +1 -1
- package/components/strategies-C6HsQpU2.cjs +0 -18
|
@@ -15,7 +15,7 @@
|
|
|
15
15
|
* OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
|
|
16
16
|
* SOFTWARE.
|
|
17
17
|
* */
|
|
18
|
-
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const h=require("../luzmo-icons-CtA-TJPd.cjs"),o=require("../base-Cy0MQrPT.cjs"),b=require("../state-vf0PJN3_.cjs"),u=require("../if-defined-DaXWqfzc.cjs"),m=require("../observe-slot-presence-bc9chhsi.cjs"),p=require("../observe-slot-text-D2VAEFSd.cjs"),v=require("../slottable-request-event-BfUUt1Mh.cjs"),d=require("../picker-
|
|
18
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const h=require("../luzmo-icons-CtA-TJPd.cjs"),o=require("../base-Cy0MQrPT.cjs"),b=require("../state-vf0PJN3_.cjs"),u=require("../if-defined-DaXWqfzc.cjs"),m=require("../observe-slot-presence-bc9chhsi.cjs"),p=require("../observe-slot-text-D2VAEFSd.cjs"),v=require("../slottable-request-event-BfUUt1Mh.cjs"),d=require("../picker-X96xmLAw.cjs");require("../action-button/index.cjs");require("../icon/index.cjs");require("../overlay/index.cjs");require("../popover/index.cjs");const y=":host{display:inline-flex}:host([quiet]){min-width:0}:host>luzmo-menu{display:none}::slotted([slot=icon]){flex-shrink:0}.icon{flex-shrink:0}#popover{max-width:none}:host([dir=ltr]) ::slotted([slot=icon]),:host([dir=ltr]) .icon{margin-left:calc(-1 * (var(--luzmo-action-button-textonly-padding-left-adjusted) - var(--luzmo-action-button-padding-left-adjusted)))}:host([dir=rtl]) ::slotted([slot=icon]),:host([dir=rtl]) .icon{margin-right:calc(-1 * (var(--luzmo-action-button-textonly-padding-left-adjusted) - var(--luzmo-action-button-padding-left-adjusted)))}:host([dir]) slot[icon-only]::slotted([slot=icon]),:host([dir]) slot[icon-only] .icon{margin-inline:calc((var(--luzmo-action-button-edge-to-text, var(--action-button-edge-to-text)) - var(--luzmo-action-button-edge-to-visual-only, var(--action-button-edge-to-visual-only))) * -1)}luzmo-overlay:not(:defined){display:none}";var f=Object.defineProperty,g=Object.getOwnPropertyDescriptor,c=(l,t,s,i)=>{for(var e=i>1?void 0:i?g(t,s):t,r=l.length-1,a;r>=0;r--)(a=l[r])&&(e=(i?a(t,s,e):a(e))||e);return i&&e&&f(t,s,e),e};class n extends m.ObserveSlotPresence(p.ObserveSlotText(d.LuzmoPickerBase,"label"),'[slot="label-only"]'){constructor(){super(...arguments),this.selects=void 0,this.listRole="menu",this.itemRole="menuitem",this.handleSlottableRequest=t=>{this.dispatchEvent(new v.SlottableRequestEvent(t.name,t.data))}}static get styles(){return[o.r(y)]}get hasLabel(){return this.slotHasContent}get labelOnly(){return this.slotContentIsPresent}get buttonContent(){return[o.x`
|
|
19
19
|
${this.labelOnly?o.x``:o.x`
|
|
20
20
|
<slot
|
|
21
21
|
name="icon"
|
|
@@ -22,7 +22,7 @@ import { o as a } from "../if-defined-DULpqYwi.js";
|
|
|
22
22
|
import { O as p } from "../observe-slot-presence-CmVi0zTc.js";
|
|
23
23
|
import { O as f } from "../observe-slot-text-C3moTjwy.js";
|
|
24
24
|
import { S as g } from "../slottable-request-event-DggLA4Rx.js";
|
|
25
|
-
import { L as x, D as v } from "../picker-
|
|
25
|
+
import { L as x, D as v } from "../picker-BsQJBF9j.js";
|
|
26
26
|
import "../action-button/index.js";
|
|
27
27
|
import "../icon/index.js";
|
|
28
28
|
import "../overlay/index.js";
|
package/components/index.cjs
CHANGED
|
@@ -15,4 +15,4 @@
|
|
|
15
15
|
* OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
|
|
16
16
|
* SOFTWARE.
|
|
17
17
|
* */
|
|
18
|
-
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const l=require("./accordion/index.cjs"),d=require("./action-bar/index.cjs"),q=require("./action-button/index.cjs");require("./action-group/index.cjs");const p=require("./action-menu/index.cjs"),x=require("./avatar/index.cjs"),_=require("./button/index.cjs"),S=require("./button-group/index.cjs"),C=require("./index-hqVbNKYy.cjs"),T=require("./checkbox/index.cjs"),b=require("./color-area/index.cjs"),v=require("./color-field/index.cjs"),I=require("./color-handle/index.cjs");require("./color-loupe/index.cjs");const g=require("./color-menu/index.cjs"),A=require("./color-palette/index.cjs"),P=require("./color-palette-group/index.cjs"),O=require("./color-picker/index.cjs"),M=require("./index-CNK8wHXu.cjs"),F=require("./date-time-picker/index.cjs"),y=require("./divider/index.cjs");require("./field-group/index.cjs");require("./field-label/index.cjs");const R=require("./icon/index.cjs"),B=require("./infield-button/index.cjs"),G=require("./label/index.cjs"),i=require("./menu/index.cjs"),k=require("./multi-language-field/index.cjs"),h=require("./number-field/index.cjs"),u=require("./options/index.cjs"),r=require("./overlay/index.cjs");require("./picker/index.cjs");const D=require("./picker-button/index.cjs");require("./popover/index.cjs");require("./progress-circle/index.cjs");const m=require("./radio/index.cjs"),E=require("./search/index.cjs"),f=require("./select/index.cjs"),N=require("./slider/index.cjs"),c=require("./swatch/index.cjs"),U=require("./switch/index.cjs"),t=require("./tabs/index.cjs"),L=require("./tags/index.cjs"),w=require("./text-field/index.cjs"),H=require("./toast/index.cjs"),V=require("./tooltip/index.cjs"),K=require("./unit-input/index.cjs"),s=require("./base-Cy0MQrPT.cjs"),W=require("./focus-visible-D4BXb5RB.cjs"),Z=require("./focusable-B_KwfEec.cjs"),o=require("./platform-BiXhwqk3.cjs"),a=require("./sized-mixin-WPHH0a_D.cjs"),j=require("./streaming-listener-DeGQYM-9.cjs"),J=require("./action-group-C54IxNZk.cjs"),Q=require("./clear-button-CuPbWwZY.cjs"),X=require("./close-button-BTo4yrFR.cjs"),Y=require("./color-loupe-CrM2DVY3.cjs"),$=require("./field-group-5WQMBOk4.cjs"),ee=require("./field-label-Dz9kisdW.cjs"),e=require("./overlay-B3ajDLLq.cjs"),z=require("./slottable-request-event-BfUUt1Mh.cjs"),n=require("./picker-
|
|
18
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const l=require("./accordion/index.cjs"),d=require("./action-bar/index.cjs"),q=require("./action-button/index.cjs");require("./action-group/index.cjs");const p=require("./action-menu/index.cjs"),x=require("./avatar/index.cjs"),_=require("./button/index.cjs"),S=require("./button-group/index.cjs"),C=require("./index-hqVbNKYy.cjs"),T=require("./checkbox/index.cjs"),b=require("./color-area/index.cjs"),v=require("./color-field/index.cjs"),I=require("./color-handle/index.cjs");require("./color-loupe/index.cjs");const g=require("./color-menu/index.cjs"),A=require("./color-palette/index.cjs"),P=require("./color-palette-group/index.cjs"),O=require("./color-picker/index.cjs"),M=require("./index-CNK8wHXu.cjs"),F=require("./date-time-picker/index.cjs"),y=require("./divider/index.cjs");require("./field-group/index.cjs");require("./field-label/index.cjs");const R=require("./icon/index.cjs"),B=require("./infield-button/index.cjs"),G=require("./label/index.cjs"),i=require("./menu/index.cjs"),k=require("./multi-language-field/index.cjs"),h=require("./number-field/index.cjs"),u=require("./options/index.cjs"),r=require("./overlay/index.cjs");require("./picker/index.cjs");const D=require("./picker-button/index.cjs");require("./popover/index.cjs");require("./progress-circle/index.cjs");const m=require("./radio/index.cjs"),E=require("./search/index.cjs"),f=require("./select/index.cjs"),N=require("./slider/index.cjs"),c=require("./swatch/index.cjs"),U=require("./switch/index.cjs"),t=require("./tabs/index.cjs"),L=require("./tags/index.cjs"),w=require("./text-field/index.cjs"),H=require("./toast/index.cjs"),V=require("./tooltip/index.cjs"),K=require("./unit-input/index.cjs"),s=require("./base-Cy0MQrPT.cjs"),W=require("./focus-visible-D4BXb5RB.cjs"),Z=require("./focusable-B_KwfEec.cjs"),o=require("./platform-BiXhwqk3.cjs"),a=require("./sized-mixin-WPHH0a_D.cjs"),j=require("./streaming-listener-DeGQYM-9.cjs"),J=require("./action-group-C54IxNZk.cjs"),Q=require("./clear-button-CuPbWwZY.cjs"),X=require("./close-button-BTo4yrFR.cjs"),Y=require("./color-loupe-CrM2DVY3.cjs"),$=require("./field-group-5WQMBOk4.cjs"),ee=require("./field-label-Dz9kisdW.cjs"),e=require("./overlay-B3ajDLLq.cjs"),z=require("./slottable-request-event-BfUUt1Mh.cjs"),n=require("./picker-X96xmLAw.cjs"),oe=require("./popover-fwJeZHMQ.cjs"),re=require("./progress-circle-DZxaMe8L.cjs"),ie=require("./text-field-BkFPYo7S.cjs");exports.LuzmoAccordion=l.LuzmoAccordion;exports.LuzmoAccordionItem=l.LuzmoAccordionItem;exports.LuzmoActionBar=d.LuzmoActionBar;exports.LuzmoActionButton=q.LuzmoActionButton;exports.LuzmoActionMenu=p.LuzmoActionMenu;exports.LuzmoAvatar=x.LuzmoAvatar;exports.LuzmoButton=_.LuzmoButton;exports.LuzmoButtonGroup=S.LuzmoButtonGroup;exports.LuzmoCalendar=C.LuzmoCalendar;exports.LuzmoCheckbox=T.LuzmoCheckbox;exports.LuzmoColorArea=b.LuzmoColorArea;exports.LuzmoColorField=v.LuzmoColorField;exports.LuzmoColorHandle=I.LuzmoColorHandle;exports.LuzmoColorMenu=g.LuzmoColorMenu;exports.LuzmoColorPalette=A.LuzmoColorPalette;exports.LuzmoColorPaletteGroup=P.LuzmoColorPaletteGroup;exports.LuzmoColorPicker=O.LuzmoColorPicker;exports.LuzmoColorSlider=M.LuzmoColorSlider;exports.LuzmoDateTimePicker=F.LuzmoDateTimePicker;exports.LuzmoDivider=y.LuzmoDivider;exports.LuzmoIcon=R.LuzmoIcon;exports.LuzmoInfieldButton=B.LuzmoInfieldButton;exports.LuzmoLabel=G.LuzmoLabel;exports.LuzmoMenu=i.LuzmoMenu;exports.LuzmoMenuDivider=i.LuzmoMenuDivider;exports.LuzmoMenuGroup=i.LuzmoMenuGroup;exports.LuzmoMenuItem=i.LuzmoMenuItem;exports.MenuItemAddedOrUpdatedEvent=i.MenuItemAddedOrUpdatedEvent;exports.LuzmoMultiLangField=k.LuzmoMultiLangField;exports.LuzmoNumberField=h.LuzmoNumberField;exports.LuzmoOption=u.LuzmoOption;exports.LuzmoOptions=u.LuzmoOptions;exports.LuzmoOptionsDivider=u.LuzmoOptionsDivider;exports.VIRTUALIZE_AS_OF_NUM_ITEMS=u.VIRTUALIZE_AS_OF_NUM_ITEMS;exports.LuzmoOverlayTrigger=r.LuzmoOverlayTrigger;exports.OverlayTriggerDirective=r.OverlayTriggerDirective;exports.SlottableRequestDirective=r.SlottableRequestDirective;exports.openOverlay=r.openOverlay;exports.slottableRequest=r.slottableRequest;exports.trigger=r.trigger;exports.LuzmoPickerButton=D.LuzmoPickerButton;exports.LuzmoRadio=m.LuzmoRadio;exports.LuzmoRadioGroup=m.LuzmoRadioGroup;exports.LuzmoSearch=E.LuzmoSearch;exports.LuzmoSelect=f.LuzmoSelect;exports.LuzmoSlider=N.LuzmoSlider;exports.LuzmoSwatch=c.LuzmoSwatch;exports.LuzmoSwatchGroup=c.LuzmoSwatchGroup;exports.LuzmoSwitch=U.LuzmoSwitch;exports.LuzmoTab=t.LuzmoTab;exports.LuzmoTabPanel=t.LuzmoTabPanel;exports.LuzmoTabs=t.LuzmoTabs;exports.LuzmoTabsOverflow=t.LuzmoTabsOverflow;exports.LuzmoTag=L.LuzmoTag;exports.LuzmoTags=L.LuzmoTags;exports.LuzmoHelpText=w.LuzmoHelpText;exports.LuzmoToast=H.LuzmoToast;exports.LuzmoTooltip=V.LuzmoTooltip;exports.LuzmoUnitInput=K.LuzmoUnitInput;exports.LuzmoElement=s.LuzmoElement;exports.LuzmoMixin=s.LuzmoMixin;exports.FocusVisiblePolyfillMixin=W.FocusVisiblePolyfillMixin;exports.Focusable=Z.Focusable;exports.isAndroid=o.isAndroid;exports.isAppleDevice=o.isAppleDevice;exports.isChrome=o.isChrome;exports.isFirefox=o.isFirefox;exports.isIOS=o.isIOS;exports.isIPad=o.isIPad;exports.isIPhone=o.isIPhone;exports.isMac=o.isMac;exports.isSeamonkey=o.isSeamonkey;exports.isWebKit=o.isWebKit;exports.ElementSizes=a.ElementSizes;exports.SizedMixin=a.SizedMixin;exports.streamingListener=j.streamingListener;exports.LuzmoActionGroup=J.LuzmoActionGroup;exports.LuzmoClearButton=Q.LuzmoClearButton;exports.LuzmoCloseButton=X.LuzmoCloseButton;exports.LuzmoColorLoupe=Y.LuzmoColorLoupe;exports.LuzmoFieldGroup=$.LuzmoFieldGroup;exports.LuzmoFieldLabel=ee.LuzmoFieldLabel;exports.ClickController=e.ClickController;exports.HoverController=e.HoverController;exports.InteractionController=e.InteractionController;exports.InteractionTypes=e.InteractionTypes;exports.LONGPRESS_INSTRUCTIONS=e.LONGPRESS_INSTRUCTIONS;exports.LongpressController=e.LongpressController;exports.LuzmoAbstractOverlay=e.LuzmoAbstractOverlay;exports.LuzmoOverlay=e.LuzmoOverlay;exports.PlacementController=e.PlacementController;exports.SAFARI_FOCUS_RING_CLASS=e.SAFARI_FOCUS_RING_CLASS;exports.VirtualTrigger=e.VirtualTrigger;exports.guaranteedAllTransitionend=e.guaranteedAllTransitionend;exports.lastInteractionType=e.lastInteractionType;exports.nextFrame=e.nextFrame;exports.noop=e.noop;exports.overlayTimer=e.overlayTimer;exports.placementUpdatedSymbol=e.placementUpdatedSymbol;exports.SlottableRequestEvent=z.SlottableRequestEvent;exports.removeSlottableRequest=z.removeSlottableRequest;exports.DESCRIPTION_ID=n.DESCRIPTION_ID;exports.LuzmoPicker=n.LuzmoPicker;exports.LuzmoPickerBase=n.LuzmoPickerBase;exports.LuzmoPopover=oe.LuzmoPopover;exports.LuzmoProgressCircle=re.LuzmoProgressCircle;exports.LuzmoTextField=ie.LuzmoTextField;
|
package/components/index.js
CHANGED
|
@@ -76,7 +76,7 @@ import { L as Rr } from "./field-group-D4B0IOdA.js";
|
|
|
76
76
|
import { L as Br } from "./field-label-DxmPiC5p.js";
|
|
77
77
|
import { C as Gr, H as Ur, b as _r, I as Nr, c as Hr, d as qr, L as Vr, e as jr, P as Kr, S as Wr, V as Zr, g as Jr, l as Qr, a as Xr, n as Yr, o as $r, p as oe } from "./overlay-CUKs69yr.js";
|
|
78
78
|
import { S as ee, r as le } from "./slottable-request-event-DggLA4Rx.js";
|
|
79
|
-
import { D as te, a as ue, L as ae } from "./picker-
|
|
79
|
+
import { D as te, a as ue, L as ae } from "./picker-BsQJBF9j.js";
|
|
80
80
|
import { LuzmoPopover as ze } from "./popover-iD8f5Jkp.js";
|
|
81
81
|
import { L as se } from "./progress-circle-USIIU1up.js";
|
|
82
82
|
import { L as pe } from "./text-field-C2n3rzCK.js";
|
|
@@ -15,4 +15,4 @@
|
|
|
15
15
|
* OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
|
|
16
16
|
* SOFTWARE.
|
|
17
17
|
* */
|
|
18
|
-
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("../picker-
|
|
18
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("../picker-X96xmLAw.cjs");customElements.get("luzmo-picker")||customElements.define("luzmo-picker",e.LuzmoPicker);exports.DESCRIPTION_ID=e.DESCRIPTION_ID;exports.LuzmoPicker=e.LuzmoPicker;exports.LuzmoPickerBase=e.LuzmoPickerBase;
|
|
@@ -15,8 +15,8 @@
|
|
|
15
15
|
* OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
|
|
16
16
|
* SOFTWARE.
|
|
17
17
|
* */
|
|
18
|
-
import { a as r } from "../picker-
|
|
19
|
-
import { D as c, L as z } from "../picker-
|
|
18
|
+
import { a as r } from "../picker-BsQJBF9j.js";
|
|
19
|
+
import { D as c, L as z } from "../picker-BsQJBF9j.js";
|
|
20
20
|
const l = () => {
|
|
21
21
|
if (typeof document < "u" && !document.querySelector("style[data-luzmo-vars]")) {
|
|
22
22
|
const o = document.createElement("style");
|
|
@@ -15,15 +15,15 @@
|
|
|
15
15
|
* OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
|
|
16
16
|
* SOFTWARE.
|
|
17
17
|
* */
|
|
18
|
-
import { x as n, E as d, B as
|
|
18
|
+
import { x as n, E as d, B as m, r as g, n as l } from "./base-CFWO09N1.js";
|
|
19
19
|
import { r as h } from "./state-DwIwYPvt.js";
|
|
20
20
|
import { e as v } from "./query-D_KR_GUc.js";
|
|
21
|
-
import { e as
|
|
21
|
+
import { e as f } from "./class-map-CGfNk3Ee.js";
|
|
22
22
|
import { o as u } from "./if-defined-DULpqYwi.js";
|
|
23
|
-
import { o as
|
|
24
|
-
import { F as
|
|
25
|
-
import { D as
|
|
26
|
-
import { M as
|
|
23
|
+
import { o as z } from "./style-map-Bnhf_mVZ.js";
|
|
24
|
+
import { F as y } from "./focusable-C5JjRZmT.js";
|
|
25
|
+
import { D as w } from "./dependency-manger-CO-VPlqq.js";
|
|
26
|
+
import { M as x, I, s as $ } from "./strategies-Bk97oVn1.js";
|
|
27
27
|
import { P as S } from "./pending-state-B2wWssTo.js";
|
|
28
28
|
import { S as M } from "./sized-mixin-CJbBHWRQ.js";
|
|
29
29
|
import { T as b, c as C, $ as q } from "./luzmo-icons-CiSek5iM.js";
|
|
@@ -33,9 +33,9 @@ import "./progress-circle/index.js";
|
|
|
33
33
|
import "./tooltip/index.js";
|
|
34
34
|
const E = '#button{cursor:pointer;-webkit-user-select:none;user-select:none;font-family:var(--luzmo-button-font-family, var(--luzmo-font-family));-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;line-height:var(--luzmo-button-line-height, var(--luzmo-line-height, 1.3));text-transform:none;vertical-align:top;-webkit-appearance:button;transition:background var(--luzmo-button-animation-duration, var(--luzmo-animation-duration)) ease-out,border-color var(--luzmo-button-animation-duration, var(--luzmo-animation-duration)) ease-out,color var(--luzmo-button-animation-duration, var(--luzmo-animation-duration)) ease-out,box-shadow var(--luzmo-button-animation-duration, var(--luzmo-animation-duration)) ease-out;justify-content:center;align-items:center;margin:0;-webkit-text-decoration:none;text-decoration:none;display:inline-flex;position:relative;overflow:visible}#button::-moz-focus-inner{border-style:none;padding:0}#button:focus{outline:none}#icon{margin-inline-end:var(--luzmo-picker-spacing-text-to-icon, var(--picker-spacing-text-to-icon));font-size:var(--luzmo-picker-font-size, var(--picker-font-size))}@media (forced-colors: active){:host{--highcontrast-picker-focus-indicator-color: Highlight;--highcontrast-picker-border-color-default: ButtonBorder;--highcontrast-picker-border-color-hover: Highlight;--highcontrast-picker-border-color-disabled: GrayText;--highcontrast-picker-content-color-default: ButtonText;--highcontrast-picker-content-color-disabled: GrayText;--highcontrast-picker-background-color: ButtonFace}#button:focus-visible{--highcontrast-picker-border-color-hover: ButtonText}#button .label,#button:after{forced-color-adjust:none}}#button{box-sizing:border-box;max-inline-size:100%;min-inline-size:calc(var(--picker-minimum-width-multiplier) * var(--luzmo-picker-block-size, var(--picker-block-size)));block-size:var(--luzmo-picker-block-size, var(--picker-block-size));border-width:var(--luzmo-picker-border-width, var(--picker-border-width));border-radius:var(--luzmo-picker-border-radius, var(--picker-border-radius));box-shadow:var(--luzmo-picker-box-shadow, var(--picker-box-shadow));transition:background-color var(--luzmo-picker-animation-duration, var(--picker-animation-duration)),box-shadow var(--luzmo-picker-animation-duration, var(--picker-animation-duration)),border-color var(--luzmo-picker-animation-duration, var(--picker-animation-duration)) ease-in-out;color:var(--highcontrast-picker-content-color-default, var(--luzmo-picker-font-color-default, var(--picker-font-color-default)));background-color:var(--highcontrast-picker-background-color, var(--luzmo-picker-background-color-default, var(--picker-background-color-default)));border-style:solid;border-color:var(--highcontrast-picker-border-color-default, var(--luzmo-picker-border-color-default, var(--picker-border-color-default)));margin-block-start:var(--luzmo-picker-spacing-label-to-picker, var(--picker-spacing-label-to-picker));padding-block:0;padding-inline-start:var(--luzmo-picker-spacing-edge-to-text, var(--picker-spacing-edge-to-text));padding-inline-end:var(--luzmo-picker-spacing-edge-to-disclosure-icon, var(--picker-spacing-edge-to-disclosure-icon));display:flex}#button:after{pointer-events:none;content:"";block-size:calc(100% + var(--luzmo-picker-focus-indicator-gap, var(--picker-focus-indicator-gap)) * 2 + var(--luzmo-picker-border-width, var(--picker-border-width)) * 2);inline-size:calc(100% + var(--luzmo-picker-focus-indicator-gap, var(--picker-focus-indicator-gap)) * 2 + var(--luzmo-picker-border-width, var(--picker-border-width)) * 2);border-style:solid;border-width:var(--luzmo-picker-focus-indicator-width, var(--picker-focus-indicator-width));border-radius:calc(var(--luzmo-picker-border-radius, var(--picker-border-radius)) + var(--luzmo-picker-focus-indicator-gap, var(--picker-focus-indicator-gap)) + var(--luzmo-picker-border-width, var(--picker-border-width)));border-color:#0000;margin-block-start:calc((var(--luzmo-picker-focus-indicator-gap, var(--picker-focus-indicator-gap)) + var(--luzmo-picker-focus-indicator-width, var(--picker-focus-indicator-width)) + var(--luzmo-picker-border-width, var(--picker-border-width))) * -1);margin-inline-start:calc((var(--luzmo-picker-focus-indicator-gap, var(--picker-focus-indicator-gap)) + var(--luzmo-picker-focus-indicator-width, var(--picker-focus-indicator-width)) + var(--luzmo-picker-border-width, var(--picker-border-width))) * -1);position:absolute;inset-block:0;inset-inline:0}#button:active{background-color:var(--highcontrast-picker-background-color, var(--luzmo-picker-background-color-active, var(--picker-background-color-active)));border-color:var(--highcontrast-picker-border-color-default, var(--luzmo-picker-border-active, var(--picker-border-color-active)))}#button:active:after{border-color:#0000}#button.placeholder:active .label{color:var(--highcontrast-picker-content-color-default, var(--luzmo-picker-font-color-active, var(--picker-font-color-active)))}#button:focus-visible{background-color:var(--highcontrast-picker-background-color, var(--luzmo-picker-background-color-key-focus, var(--picker-background-color-key-focus)));border-color:var(--highcontrast-picker-border-color-default, var(--luzmo-picker-border-color-key-focus, var(--picker-border-color-key-focus)));color:var(--highcontrast-picker-content-color-default, var(--luzmo-picker-font-color-key-focus, var(--picker-font-color-key-focus)));outline:none}#button:focus-visible:after{border-color:var(--highcontrast-picker-focus-indicator-color, var(--luzmo-picker-focus-indicator-color, var(--picker-focus-indicator-color)))}#button.placeholder:focus-visible{color:var(--highcontrast-picker-content-color-default, var(--luzmo-picker-font-color-key-focus, var(--picker-font-color-key-focus)))}#button:focus-visible .disclosure-icon{color:var(--highcontrast-picker-content-color-default, var(--luzmo-picker-icon-color-key-focus, var(--picker-icon-color-key-focus)))}:host([open]) #button:not(:disabled,.is-disabled){color:var(--highcontrast-picker-content-color-default, var(--luzmo-picker-font-color-default-open, var(--picker-font-color-default-open)));background-color:var(--highcontrast-picker-background-color, var(--luzmo-picker-background-color-default-open, var(--picker-background-color-default-open)));border-color:var(--highcontrast-picker-border-color-default, var(--luzmo-picker-border-default-open, var(--picker-border-color-default-open)))}:host([open]) #button:not(:disabled,.is-disabled) .disclosure-icon{color:var(--highcontrast-picker-content-color-default, var(--luzmo-picker-icon-color-default-open, var(--picker-icon-color-default-open)))}:host([invalid]) #button:not(:disabled,.is-disabled){border-color:var(--highcontrast-picker-border-color-default, var(--luzmo-picker-border-color-error-default, var(--picker-border-color-error-default)))}:host([invalid]) #button:not(:disabled,.is-disabled) .validation-icon{color:var(--highcontrast-picker-content-color-default, var(--luzmo-picker-icon-color-error, var(--picker-icon-color-error)))}:host([invalid]) #button:not(:disabled,.is-disabled):active{border-color:var(--highcontrast-picker-border-color-default, var(--luzmo-picker-border-color-error-active, var(--picker-border-color-error-active)))}:host([invalid][open]) #button:not(:disabled,.is-disabled){border-color:var(--highcontrast-picker-border-color-default, var(--luzmo-picker-border-color-error-default-open, var(--picker-border-color-error-default-open)))}:host([invalid]) #button:not(:disabled,.is-disabled):focus-visible{border-color:var(--highcontrast-picker-border-color-default, var(--luzmo-picker-border-color-error-key-focus, var(--picker-border-color-error-key-focus)))}:host([pending]) #button .disclosure-icon{color:var(--highcontrast-picker-content-color-disabled, var(--luzmo-picker-icon-color-disabled, var(--picker-icon-color-disabled)))}.icon{flex-shrink:0}.label{white-space:nowrap;font-size:var(--luzmo-picker-font-size, var(--picker-font-size));line-height:var(--luzmo-picker-line-height, var(--picker-line-height));font-weight:var(--luzmo-picker-font-weight, var(--picker-font-weight));text-overflow:ellipsis;text-align:start;flex:auto;overflow:hidden}.label.placeholder{font-weight:var(--luzmo-picker-placeholder-font-weight, var(--picker-font-weight));font-style:var(--luzmo-picker-placeholder-font-style, var(--picker-placeholder-font-style));transition:color var(--luzmo-picker-animation-duration, var(--picker-animation-duration)) ease-in-out;color:var(--highcontrast-picker-content-color-default, var(--luzmo-picker-font-color-default, var(--picker-font-color-default)))}.label.placeholder:active{color:var(--highcontrast-picker-content-color-default, var(--luzmo-picker-font-color-active, var(--picker-font-color-active)))}.disclosure-icon{vertical-align:top;transition:color var(--luzmo-picker-animation-duration, var(--picker-animation-duration)) ease-out;margin-inline-start:var(--luzmo-picker-spacing-icon-to-disclosure-icon, var(--picker-spacing-icon-to-disclosure-icon));color:var(--highcontrast-picker-content-color-default, var(--luzmo-picker-icon-color-default, var(--picker-icon-color-default)));flex-shrink:0;display:inline-block;position:relative}.disclosure-icon:active{color:var(--highcontrast-picker-content-color-default, var(--luzmo-picker-icon-color-active, var(--picker-icon-color-active)))}luzmo-progress-circle,.validation-icon{margin-inline-start:var(--luzmo-picker-spacing-text-to-icon, var(--picker-spacing-text-to-icon))}.icon-container{display:flex;position:relative;height:100%;align-items:center;font-size:var(--luzmo-picker-disclosure-icon-size, var(--picker-disclosure-icon-size))}.icon-container.disclosure-icon{margin-inline-end:0}.label~.disclosure-icon{margin-inline-start:var(--luzmo-picker-spacing-text-to-icon, var(--picker-spacing-text-to-icon))}:host([quiet]) #button{inline-size:auto;min-inline-size:0;padding-inline:var(--luzmo-picker-spacing-edge-to-text-quiet, var(--picker-spacing-edge-to-text-quiet));color:var(--highcontrast-picker-content-color-default, var(--luzmo-picker-font-color-default, var(--picker-font-color-default)));background-color:initial;background-color:var(--highcontrast-picker-background-color, transparent);border:none;border-radius:0;box-shadow:none;margin-block-start:calc(var(--luzmo-picker-spacing-label-to-picker-quiet, var(--picker-spacing-label-to-picker-quiet)) + 1px)}:host([quiet]) #button.label-inline{margin-block-start:0}:host([quiet]) #button .disclosure-icon{margin-inline-end:var(--luzmo-picker-spacing-edge-to-disclosure-icon-quiet, var(--picker-spacing-edge-to-disclosure-icon-quiet))}:host([quiet]) #button:after{block-size:auto;inline-size:auto;border:none}@media (hover: hover){#button:hover{color:var(--highcontrast-picker-content-color-default, var(--luzmo-picker-font-color-hover, var(--picker-font-color-hover)));background-color:var(--highcontrast-picker-background-color, var(--luzmo-picker-background-color-hover, var(--picker-background-color-hover)));border-color:var(--highcontrast-picker-border-color-hover, var(--luzmo-picker-border-color-hover, var(--picker-border-color-hover)))}#button:hover .disclosure-icon{color:var(--highcontrast-picker-content-color-default, var(--luzmo-picker-icon-color-hover, var(--picker-icon-color-hover)))}:host([open]):not([quiet]) #button:not(:disabled,.is-disabled):hover{color:var(--highcontrast-picker-content-color-default, var(--luzmo-picker-font-color-hover-open, var(--picker-font-color-hover-open)));background-color:var(--highcontrast-picker-background-color, var(--luzmo-picker-background-color-hover-open, var(--picker-background-color-hover-open)));border-color:var(--highcontrast-picker-border-color-hover, var(--luzmo-picker-border-color-hover-open, var(--picker-border-color-hover-open)))}:host([open]) #button:not(:disabled,.is-disabled):hover .disclosure-icon{color:var(--highcontrast-picker-content-color-default, var(--luzmo-picker-icon-color-hover-open, var(--picker-icon-color-hover-open)))}:host([invalid]) #button:not(:disabled,.is-disabled):hover{border-color:var(--highcontrast-picker-border-color-hover, var(--luzmo-picker-border-color-error-hover, var(--picker-border-color-error-hover)))}:host([invalid][open]) #button:not(:disabled,.is-disabled):hover{border-color:var(--highcontrast-picker-border-color-hover, var(--luzmo-picker-border-color-error-hover-open, var(--picker-border-color-error-hover-open)))}.label.placeholder:hover{color:var(--highcontrast-picker-content-color-default, var(--luzmo-picker-font-color-hover, var(--picker-font-color-hover)))}:host([quiet]) #button:hover{background-color:initial;background-color:var(--highcontrast-picker-background-color, transparent)!important}}:host([quiet]) #button:focus-visible{background-color:initial;background-color:var(--highcontrast-picker-background-color, transparent)}:host([quiet]) #button:focus-visible:after{box-shadow:0 var(--luzmo-picker-focus-indicator-width, var(--picker-focus-indicator-width)) 0 0 var(--highcontrast-picker-focus-indicator-color, var(--luzmo-picker-focus-indicator-color, var(--picker-focus-indicator-color)));margin:calc((var(--luzmo-picker-focus-indicator-gap, var(--picker-focus-indicator-gap)) + var(--luzmo-picker-border-width, var(--picker-border-width))) * -1) 0;border:none;border-radius:0}:host([quiet][open]) #button,:host([quiet][disabled]) #button#button,:host([quiet]) #button#button:disabled,:host([quiet]) #button:active{background-color:initial;background-color:var(--highcontrast-picker-background-color, transparent)}.label-inline{vertical-align:top;display:inline-flex}:host([disabled]) #button,#button:disabled{cursor:default;background-color:var(--highcontrast-picker-background-color, var(--luzmo-picker-background-color-disabled, var(--picker-background-color-disabled)));border-color:#0000;border-color:var(--highcontrast-picker-border-color-disabled, transparent);color:var(--highcontrast-picker-content-color-disabled, var(--luzmo-picker-font-color-disabled, var(--picker-font-color-disabled)))}:host([disabled]) #button .icon,:host([disabled]) #button .disclosure-icon,:host([disabled]) #button .validation-icon,#button:disabled .icon,#button:disabled .disclosure-icon,#button:disabled .validation-icon{color:var(--highcontrast-picker-content-color-disabled, var(--luzmo-picker-icon-color-disabled, var(--picker-icon-color-disabled)))}:host([disabled]) #button .label.placeholder,#button:disabled .label.placeholder{color:var(--highcontrast-picker-content-color-disabled, var(--luzmo-picker-font-color-disabled, var(--picker-font-color-disabled)))}:host{--picker-box-shadow: 0px 1px 3px 0px rgba(var(--luzmo-border-color-rgb), .06);--picker-background-color-default: var(--luzmo-background-color);--picker-background-color-default-open: var(--luzmo-background-color-hover);--picker-background-color-active: var(--luzmo-background-color-down);--picker-background-color-hover: var(--luzmo-background-color-hover);--picker-background-color-hover-open: var(--luzmo-background-color-down);--picker-background-color-key-focus: var(--luzmo-background-color-down);--picker-border-color-default: var(--luzmo-border-color);--picker-border-color-default-open: var(--luzmo-border-color-hover);--picker-border-color-hover: var(--luzmo-border-color);--picker-border-color-hover-open: var(--luzmo-border-color-hover);--picker-border-color-active: var(--luzmo-border-color);--picker-border-color-key-focus: var(--luzmo-border-color);--picker-border-width: var(--luzmo-border-width);--picker-font-size: var(--luzmo-font-size);--picker-font-weight: var(--luzmo-font-weight);--picker-placeholder-font-style: var(--luzmo-font-style);--picker-line-height: var(--luzmo-line-height);--picker-block-size: 32px;--picker-border-radius: var(--luzmo-border-radius);--picker-spacing-edge-to-text: calc( var(--luzmo-spacing-3) + var(--luzmo-spacing-1) );--picker-spacing-text-to-icon: calc( var(--luzmo-spacing-3) + var(--luzmo-spacing-1) );--picker-spacing-text-to-icon-inline-end: calc( var(--luzmo-spacing-3) + var(--luzmo-spacing-1) );--picker-spacing-icon-to-disclosure-icon: calc( var(--luzmo-spacing-3) + var(--luzmo-spacing-1) );--picker-spacing-edge-to-text-quiet: 0px;--picker-spacing-label-to-picker: 0px;--picker-spacing-label-to-picker-quiet: calc( -1 * var(--luzmo-spacing-3) + var(--luzmo-spacing-1) );--picker-spacing-edge-to-disclosure-icon: calc( var(--luzmo-spacing-3) + var(--luzmo-spacing-1) );--picker-spacing-edge-to-disclosure-icon-quiet: 0px;--picker-animation-duration: var(--luzmo-animation-duration);--picker-font-color-default: var(--luzmo-font-color);--picker-font-color-default-open: var(--luzmo-font-color-hover);--picker-font-color-hover: var(--luzmo-font-color-hover);--picker-font-color-hover-open: var(--luzmo-font-color-down);--picker-font-color-active: var(--luzmo-font-color-focus);--picker-font-color-key-focus: var(--luzmo-font-color-focus);--picker-icon-color-default: var(--luzmo-font-color);--picker-icon-color-default-open: var(--luzmo-font-color-hover);--picker-icon-color-hover: var(--luzmo-font-color-hover);--picker-icon-color-hover-open: var(--luzmo-font-color-hover);--picker-icon-color-active: var(--luzmo-font-color-focus);--picker-icon-color-key-focus: var(--luzmo-font-color-focus);--picker-border-color-error-default: var(--luzmo-negative-color);--picker-border-color-error-default-open: var(--luzmo-negative-color-down);--picker-border-color-error-hover: var(--luzmo-negative-color-hover);--picker-border-color-error-hover-open: var(--luzmo-negative-color-down);--picker-border-color-error-active: var(--luzmo-negative-color-down);--picker-border-color-error-key-focus: var(--luzmo-negative-color-focus);--picker-icon-color-error: var(--luzmo-negative-color);--picker-background-color-disabled: var(--luzmo-background-color-disabled);--picker-font-color-disabled: var(--luzmo-disabled-color);--picker-icon-color-disabled: var(--luzmo-disabled-color);--picker-focus-indicator-gap: var(--luzmo-indicator-gap);--picker-focus-indicator-width: var(--luzmo-indicator-width);--picker-focus-indicator-color: var(--luzmo-indicator-color);--picker-disclosure-icon-size: var(--luzmo-font-size-s)}:host([size=s]){--picker-block-size: 28px;--picker-font-size: var(--luzmo-font-size-s);--picker-border-radius: var(--luzmo-border-radius);--picker-spacing-edge-to-text: var(--luzmo-spacing-3);--picker-spacing-text-to-icon: var(--luzmo-spacing-3);--picker-spacing-text-to-icon-inline-end: var(--luzmo-spacing-3);--picker-spacing-icon-to-disclosure-icon: var(--luzmo-spacing-3);--picker-spacing-label-to-picker-quiet: calc(-1 * var(--luzmo-spacing-3));--picker-spacing-edge-to-disclosure-icon: var(--luzmo-spacing-3);--picker-disclosure-icon-size: var(--luzmo-font-size-s)}:host([size=l]){--picker-block-size: 40px;--picker-font-size: var(--luzmo-font-size-l);--picker-border-radius: var(--luzmo-border-radius);--picker-spacing-edge-to-text: var(--luzmo-spacing-4);--picker-spacing-text-to-icon: var(--luzmo-spacing-4);--picker-spacing-text-to-icon-inline-end: var(--luzmo-spacing-4);--picker-spacing-icon-to-disclosure-icon: var(--luzmo-spacing-4);--picker-spacing-label-to-picker-quiet: calc(-1 * var(--luzmo-spacing-4));--picker-spacing-edge-to-disclosure-icon: var(--luzmo-spacing-4);--picker-disclosure-icon-size: var(--luzmo-font-size)}:host([size=xl]){--picker-block-size: 48px;--picker-font-size: var(--luzmo-font-size-xl);--picker-border-radius: var(--luzmo-border-radius-l);--picker-spacing-edge-to-text: calc( var(--luzmo-spacing-4) + var(--luzmo-spacing-1) );--picker-spacing-text-to-icon: calc( var(--luzmo-spacing-4) + var(--luzmo-spacing-1) );--picker-spacing-text-to-icon-inline-end: calc( var(--luzmo-spacing-4) + var(--luzmo-spacing-1) );--picker-spacing-icon-to-disclosure-icon: calc( var(--luzmo-spacing-4) + var(--luzmo-spacing-1) );--picker-spacing-label-to-picker-quiet: calc( -1 * var(--luzmo-spacing-4) + var(--luzmo-spacing-1) );--picker-spacing-edge-to-disclosure-icon: calc( var(--luzmo-spacing-4) + var(--luzmo-spacing-1) );--picker-disclosure-icon-size: var(--luzmo-font-size-l)}:host([variant=highlight]) ::slotted(luzmo-menu-item[selected]){--menu-item-highlight-label-content-color: var(--luzmo-primary-inverse-color);--menu-item-label-icon-color-default: var(--luzmo-primary-inverse-color);--menu-checkmark-display: var(--menu-checkmark-display-hidden);padding-inline-start:var(--luzmo-menu-item-label-inline-edge-to-content, var(--menu-item-label-inline-edge-to-content));background-color:var(--luzmo-menu-item-highlight-label-background-color, var(--menu-item-highlight-label-background-color, var(--luzmo-border-color)))}:host{display:inline-flex;vertical-align:top;max-inline-size:100%;inline-size:var(--luzmo-picker-inline-size, var(--picker-inline-size));min-inline-size:calc(var(--picker-minimum-width-multiplier) * var(--luzmo-picker-block-size, var(--picker-block-size)))}:host([quiet]){width:auto;min-width:0}:host([disabled]){pointer-events:none}#button{width:100%;min-width:100%;max-width:100%}#icon:not([hidden]){display:inline-flex}:host([readonly]) #button{-webkit-user-select:inherit;user-select:inherit}.picker,.validation-icon{flex-shrink:0}luzmo-overlay{pointer-events:none}luzmo-menu{pointer-events:initial}:host>luzmo-menu{display:none}:host([focused]:not([quiet])) #button #label.placeholder{color:var(--picker-placeholder-text-color-key-focus, var(--alias-placeholder-text-color-hover))}#label.visually-hidden~.picker{margin-inline-start:auto}:host([focused]:not([quiet],[pending])) #button .picker{color:var(--picker-icon-color-key-focus, var(--alias-icon-color-focus))}.visually-hidden{border:0;clip:rect(0,0,0,0);clip-path:inset(50%);height:1px;margin:0 -1px -1px 0;overflow:hidden;padding:0;position:absolute;width:1px;white-space:nowrap}luzmo-overlay:not(:defined){display:none}#button.remove-focus-ring-safari-hack:focus-visible{background-color:var(--highcontrast-picker-background-color, var(--luzmo-picker-background-color-default, var(--picker-background-color-default)));border-color:var(--highcontrast-picker-border-color-default, var(--luzmo-picker-border-color-default, var(--picker-border-color-default)));color:var(--highcontrast-picker-content-color-default, var(--luzmo-picker-font-color-default, var(--picker-font-color-default)))}#button.remove-focus-ring-safari-hack:after{border:none}#button.remove-focus-ring-safari-hack:focus-visible:after{box-shadow:none}#button.remove-focus-ring-safari-hack:active{background-color:var(--highcontrast-picker-background-color, var(--luzmo-picker-background-color-default, var(--picker-background-color-default)));border-color:var(--highcontrast-picker-border-color-default, var(--luzmo-picker-border-color-default, var(--picker-border-color-default)));color:var(--highcontrast-picker-content-color-default, var(--luzmo-picker-font-color-default, var(--picker-font-color-default)))}';
|
|
35
35
|
var B = Object.defineProperty, D = Object.getOwnPropertyDescriptor, i = (s, e, o, r) => {
|
|
36
|
-
for (var
|
|
37
|
-
(p = s[
|
|
38
|
-
return r &&
|
|
36
|
+
for (var a = r > 1 ? void 0 : r ? D(e, o) : e, c = s.length - 1, p; c >= 0; c--)
|
|
37
|
+
(p = s[c]) && (a = (r ? p(e, o, a) : p(a)) || a);
|
|
38
|
+
return r && a && B(e, o, a), a;
|
|
39
39
|
};
|
|
40
40
|
const A = () => n`
|
|
41
41
|
<div class="disclosure-icon icon">
|
|
@@ -45,8 +45,8 @@ const A = () => n`
|
|
|
45
45
|
<div class="icon-container validation-icon icon">
|
|
46
46
|
${b(q)}
|
|
47
47
|
</div>
|
|
48
|
-
`,
|
|
49
|
-
class t extends M(
|
|
48
|
+
`, k = "option-picker";
|
|
49
|
+
class t extends M(y, {
|
|
50
50
|
noDefaultSize: !0
|
|
51
51
|
}) {
|
|
52
52
|
/**
|
|
@@ -54,7 +54,7 @@ class t extends M(w, {
|
|
|
54
54
|
* The `PendingStateController` manages the pending state of the Picker.
|
|
55
55
|
*/
|
|
56
56
|
constructor() {
|
|
57
|
-
super(), this.disabled = !1, this.focused = !1, this.invalid = !1, this.pending = !1, this.pendingLabel = "Pending", this.open = !1, this.readonly = !1, this.placement = "bottom-start", this.quiet = !1, this.value = "", this.selects = "single", this.dependencyManager = new
|
|
57
|
+
super(), this.disabled = !1, this.focused = !1, this.invalid = !1, this.pending = !1, this.pendingLabel = "Pending", this.open = !1, this.readonly = !1, this.placement = "bottom-start", this.quiet = !1, this.value = "", this.selects = "single", this.dependencyManager = new w(this), this.isMobile = new x(this, I), this.listRole = "listbox", this.itemRole = "option", this.hasRenderedOverlay = !1, this._selfManageFocusElement = !1, this.deprecatedMenu = null, this.selectionPromise = Promise.resolve(), this.willManageSelection = !1, this.recentlyConnected = !1, this.enterKeydownOn = null, this.handleSlottableRequest = (e) => {
|
|
58
58
|
}, this.applyFocusElementLabel = (e, o) => {
|
|
59
59
|
this.appliedLabel = e, this.labelAlignment = o.sideAligned ? "inline" : void 0;
|
|
60
60
|
}, this.handleKeydown = (e) => {
|
|
@@ -128,8 +128,8 @@ class t extends M(w, {
|
|
|
128
128
|
this.readonly || this.strategy && (this.open = !1, this.strategy.open = !1);
|
|
129
129
|
}
|
|
130
130
|
bindEvents() {
|
|
131
|
-
var e;
|
|
132
|
-
(e = this.strategy) == null || e.abort(), this.strategy =
|
|
131
|
+
var e, o;
|
|
132
|
+
(e = this.strategy) == null || e.abort(), this.strategy = new $.desktop(this.button, this), (o = this.strategy) != null && o.overlay && (this.strategy.overlay.type = "auto", this.strategy.overlay.placement = this.placement);
|
|
133
133
|
}
|
|
134
134
|
connectedCallback() {
|
|
135
135
|
super.connectedCallback(), this.recentlyConnected = this.hasUpdated;
|
|
@@ -140,7 +140,7 @@ class t extends M(w, {
|
|
|
140
140
|
}
|
|
141
141
|
async setValueFromItem(e, o) {
|
|
142
142
|
this.open = !1, this.strategy && (this.strategy.open = !1);
|
|
143
|
-
const r = this.selectedItem,
|
|
143
|
+
const r = this.selectedItem, a = this.value;
|
|
144
144
|
if (this.selectedItem = e, this.value = (e == null ? void 0 : e.value) ?? "", await this.updateComplete, !this.dispatchEvent(
|
|
145
145
|
new CustomEvent("change", {
|
|
146
146
|
bubbles: !0,
|
|
@@ -150,10 +150,10 @@ class t extends M(w, {
|
|
|
150
150
|
detail: this.value
|
|
151
151
|
})
|
|
152
152
|
) && this.selects) {
|
|
153
|
-
o && o.preventDefault(), this.setMenuItemSelected(this.selectedItem, !1), r && this.setMenuItemSelected(r, !0), this.selectedItem = r, this.value =
|
|
153
|
+
o && o.preventDefault(), this.setMenuItemSelected(this.selectedItem, !1), r && this.setMenuItemSelected(r, !0), this.selectedItem = r, this.value = a, this.open = !0, this.strategy && (this.strategy.open = !0);
|
|
154
154
|
return;
|
|
155
155
|
} else if (!this.selects) {
|
|
156
|
-
this.selectedItem = r, this.value =
|
|
156
|
+
this.selectedItem = r, this.value = a;
|
|
157
157
|
return;
|
|
158
158
|
}
|
|
159
159
|
r && this.setMenuItemSelected(r, !1), this.setMenuItemSelected(e, !!this.selects);
|
|
@@ -197,7 +197,7 @@ class t extends M(w, {
|
|
|
197
197
|
${this._selectedItemIcon ? r : d}
|
|
198
198
|
<div
|
|
199
199
|
id=${u(this.value && this.selectedItem ? "label" : void 0)}
|
|
200
|
-
class=${
|
|
200
|
+
class=${f(e)}
|
|
201
201
|
>
|
|
202
202
|
${this.renderLabelContent(this.selectedItemContent.content)}
|
|
203
203
|
</div>
|
|
@@ -224,17 +224,17 @@ class t extends M(w, {
|
|
|
224
224
|
];
|
|
225
225
|
}
|
|
226
226
|
renderOverlay(e) {
|
|
227
|
-
var r,
|
|
227
|
+
var r, a, c;
|
|
228
228
|
if (((r = this.strategy) == null ? void 0 : r.overlay) === void 0)
|
|
229
229
|
return e;
|
|
230
230
|
const o = this.renderContainer(e);
|
|
231
|
-
return
|
|
231
|
+
return m(o, (a = this.strategy) == null ? void 0 : a.overlay, {
|
|
232
232
|
host: this
|
|
233
|
-
}), (
|
|
233
|
+
}), (c = this.strategy) == null ? void 0 : c.overlay;
|
|
234
234
|
}
|
|
235
235
|
get renderDescriptionSlot() {
|
|
236
236
|
return n`
|
|
237
|
-
<div id=${
|
|
237
|
+
<div id=${k}>
|
|
238
238
|
<slot name="description"></slot>
|
|
239
239
|
</div>
|
|
240
240
|
`;
|
|
@@ -247,7 +247,7 @@ class t extends M(w, {
|
|
|
247
247
|
id="focus-helper"
|
|
248
248
|
tabindex=${this.focused || this.open ? "-1" : "0"}
|
|
249
249
|
@focus=${this.handleHelperFocus}
|
|
250
|
-
aria-describedby=${
|
|
250
|
+
aria-describedby=${k}
|
|
251
251
|
></span>
|
|
252
252
|
<button
|
|
253
253
|
aria-controls=${u(this.open ? "menu" : void 0)}
|
|
@@ -280,7 +280,8 @@ class t extends M(w, {
|
|
|
280
280
|
this.button.addEventListener("keydown", this.handleKeydown);
|
|
281
281
|
}
|
|
282
282
|
updated(e) {
|
|
283
|
-
|
|
283
|
+
var o;
|
|
284
|
+
super.updated(e), e.has("open") && (this.strategy.open = this.open), (o = this.strategy) != null && o.overlay && this.strategy.overlay.type !== "auto" && (this.strategy.overlay.type = "auto", this.strategy.overlay.placement = this.placement);
|
|
284
285
|
}
|
|
285
286
|
firstUpdated(e) {
|
|
286
287
|
super.firstUpdated(e), this.bindButtonKeydownListener(), this.bindEvents();
|
|
@@ -305,7 +306,7 @@ class t extends M(w, {
|
|
|
305
306
|
id="popover"
|
|
306
307
|
size=${this.size}
|
|
307
308
|
role="presentation"
|
|
308
|
-
style=${
|
|
309
|
+
style=${z(this.containerStyles)}
|
|
309
310
|
placement=${this.placement}
|
|
310
311
|
>
|
|
311
312
|
${o}
|
|
@@ -439,15 +440,15 @@ class X extends t {
|
|
|
439
440
|
return;
|
|
440
441
|
}
|
|
441
442
|
e.preventDefault();
|
|
442
|
-
const r = this.selectedItem ? this.menuItems.indexOf(this.selectedItem) : -1,
|
|
443
|
-
let
|
|
444
|
-
for (; this.menuItems[
|
|
445
|
-
|
|
446
|
-
!this.menuItems[
|
|
443
|
+
const r = this.selectedItem ? this.menuItems.indexOf(this.selectedItem) : -1, a = r < 0 || o === "ArrowRight" ? 1 : -1;
|
|
444
|
+
let c = r + a;
|
|
445
|
+
for (; this.menuItems[c] && this.menuItems[c].disabled; )
|
|
446
|
+
c += a;
|
|
447
|
+
!this.menuItems[c] || this.menuItems[c].disabled || (!this.value || c !== r) && this.setValueFromItem(this.menuItems[c]);
|
|
447
448
|
};
|
|
448
449
|
}
|
|
449
450
|
static get styles() {
|
|
450
|
-
return [
|
|
451
|
+
return [g(E)];
|
|
451
452
|
}
|
|
452
453
|
get containerStyles() {
|
|
453
454
|
const e = super.containerStyles;
|
|
@@ -455,7 +456,7 @@ class X extends t {
|
|
|
455
456
|
}
|
|
456
457
|
}
|
|
457
458
|
export {
|
|
458
|
-
|
|
459
|
+
k as D,
|
|
459
460
|
t as L,
|
|
460
461
|
X as a
|
|
461
462
|
};
|
|
@@ -15,7 +15,7 @@
|
|
|
15
15
|
* OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
|
|
16
16
|
* SOFTWARE.
|
|
17
17
|
* */
|
|
18
|
-
"use strict";const r=require("./base-Cy0MQrPT.cjs"),v=require("./state-vf0PJN3_.cjs"),b=require("./query-BL-TJj7K.cjs"),k=require("./class-map-D-Y-hsN5.cjs"),d=require("./if-defined-DaXWqfzc.cjs"),g=require("./style-map-DuMd5xlY.cjs"),m=require("./focusable-B_KwfEec.cjs"),f=require("./dependency-manger-uthev62E.cjs"),u=require("./strategies-C6HsQpU2.cjs"),z=require("./pending-state-bJr-nEJl.cjs"),y=require("./sized-mixin-WPHH0a_D.cjs"),l=require("./luzmo-icons-CtA-TJPd.cjs");require("./menu/index.cjs");require("./overlay/index.cjs");require("./progress-circle/index.cjs");require("./tooltip/index.cjs");const w='#button{cursor:pointer;-webkit-user-select:none;user-select:none;font-family:var(--luzmo-button-font-family, var(--luzmo-font-family));-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;line-height:var(--luzmo-button-line-height, var(--luzmo-line-height, 1.3));text-transform:none;vertical-align:top;-webkit-appearance:button;transition:background var(--luzmo-button-animation-duration, var(--luzmo-animation-duration)) ease-out,border-color var(--luzmo-button-animation-duration, var(--luzmo-animation-duration)) ease-out,color var(--luzmo-button-animation-duration, var(--luzmo-animation-duration)) ease-out,box-shadow var(--luzmo-button-animation-duration, var(--luzmo-animation-duration)) ease-out;justify-content:center;align-items:center;margin:0;-webkit-text-decoration:none;text-decoration:none;display:inline-flex;position:relative;overflow:visible}#button::-moz-focus-inner{border-style:none;padding:0}#button:focus{outline:none}#icon{margin-inline-end:var(--luzmo-picker-spacing-text-to-icon, var(--picker-spacing-text-to-icon));font-size:var(--luzmo-picker-font-size, var(--picker-font-size))}@media (forced-colors: active){:host{--highcontrast-picker-focus-indicator-color: Highlight;--highcontrast-picker-border-color-default: ButtonBorder;--highcontrast-picker-border-color-hover: Highlight;--highcontrast-picker-border-color-disabled: GrayText;--highcontrast-picker-content-color-default: ButtonText;--highcontrast-picker-content-color-disabled: GrayText;--highcontrast-picker-background-color: ButtonFace}#button:focus-visible{--highcontrast-picker-border-color-hover: ButtonText}#button .label,#button:after{forced-color-adjust:none}}#button{box-sizing:border-box;max-inline-size:100%;min-inline-size:calc(var(--picker-minimum-width-multiplier) * var(--luzmo-picker-block-size, var(--picker-block-size)));block-size:var(--luzmo-picker-block-size, var(--picker-block-size));border-width:var(--luzmo-picker-border-width, var(--picker-border-width));border-radius:var(--luzmo-picker-border-radius, var(--picker-border-radius));box-shadow:var(--luzmo-picker-box-shadow, var(--picker-box-shadow));transition:background-color var(--luzmo-picker-animation-duration, var(--picker-animation-duration)),box-shadow var(--luzmo-picker-animation-duration, var(--picker-animation-duration)),border-color var(--luzmo-picker-animation-duration, var(--picker-animation-duration)) ease-in-out;color:var(--highcontrast-picker-content-color-default, var(--luzmo-picker-font-color-default, var(--picker-font-color-default)));background-color:var(--highcontrast-picker-background-color, var(--luzmo-picker-background-color-default, var(--picker-background-color-default)));border-style:solid;border-color:var(--highcontrast-picker-border-color-default, var(--luzmo-picker-border-color-default, var(--picker-border-color-default)));margin-block-start:var(--luzmo-picker-spacing-label-to-picker, var(--picker-spacing-label-to-picker));padding-block:0;padding-inline-start:var(--luzmo-picker-spacing-edge-to-text, var(--picker-spacing-edge-to-text));padding-inline-end:var(--luzmo-picker-spacing-edge-to-disclosure-icon, var(--picker-spacing-edge-to-disclosure-icon));display:flex}#button:after{pointer-events:none;content:"";block-size:calc(100% + var(--luzmo-picker-focus-indicator-gap, var(--picker-focus-indicator-gap)) * 2 + var(--luzmo-picker-border-width, var(--picker-border-width)) * 2);inline-size:calc(100% + var(--luzmo-picker-focus-indicator-gap, var(--picker-focus-indicator-gap)) * 2 + var(--luzmo-picker-border-width, var(--picker-border-width)) * 2);border-style:solid;border-width:var(--luzmo-picker-focus-indicator-width, var(--picker-focus-indicator-width));border-radius:calc(var(--luzmo-picker-border-radius, var(--picker-border-radius)) + var(--luzmo-picker-focus-indicator-gap, var(--picker-focus-indicator-gap)) + var(--luzmo-picker-border-width, var(--picker-border-width)));border-color:#0000;margin-block-start:calc((var(--luzmo-picker-focus-indicator-gap, var(--picker-focus-indicator-gap)) + var(--luzmo-picker-focus-indicator-width, var(--picker-focus-indicator-width)) + var(--luzmo-picker-border-width, var(--picker-border-width))) * -1);margin-inline-start:calc((var(--luzmo-picker-focus-indicator-gap, var(--picker-focus-indicator-gap)) + var(--luzmo-picker-focus-indicator-width, var(--picker-focus-indicator-width)) + var(--luzmo-picker-border-width, var(--picker-border-width))) * -1);position:absolute;inset-block:0;inset-inline:0}#button:active{background-color:var(--highcontrast-picker-background-color, var(--luzmo-picker-background-color-active, var(--picker-background-color-active)));border-color:var(--highcontrast-picker-border-color-default, var(--luzmo-picker-border-active, var(--picker-border-color-active)))}#button:active:after{border-color:#0000}#button.placeholder:active .label{color:var(--highcontrast-picker-content-color-default, var(--luzmo-picker-font-color-active, var(--picker-font-color-active)))}#button:focus-visible{background-color:var(--highcontrast-picker-background-color, var(--luzmo-picker-background-color-key-focus, var(--picker-background-color-key-focus)));border-color:var(--highcontrast-picker-border-color-default, var(--luzmo-picker-border-color-key-focus, var(--picker-border-color-key-focus)));color:var(--highcontrast-picker-content-color-default, var(--luzmo-picker-font-color-key-focus, var(--picker-font-color-key-focus)));outline:none}#button:focus-visible:after{border-color:var(--highcontrast-picker-focus-indicator-color, var(--luzmo-picker-focus-indicator-color, var(--picker-focus-indicator-color)))}#button.placeholder:focus-visible{color:var(--highcontrast-picker-content-color-default, var(--luzmo-picker-font-color-key-focus, var(--picker-font-color-key-focus)))}#button:focus-visible .disclosure-icon{color:var(--highcontrast-picker-content-color-default, var(--luzmo-picker-icon-color-key-focus, var(--picker-icon-color-key-focus)))}:host([open]) #button:not(:disabled,.is-disabled){color:var(--highcontrast-picker-content-color-default, var(--luzmo-picker-font-color-default-open, var(--picker-font-color-default-open)));background-color:var(--highcontrast-picker-background-color, var(--luzmo-picker-background-color-default-open, var(--picker-background-color-default-open)));border-color:var(--highcontrast-picker-border-color-default, var(--luzmo-picker-border-default-open, var(--picker-border-color-default-open)))}:host([open]) #button:not(:disabled,.is-disabled) .disclosure-icon{color:var(--highcontrast-picker-content-color-default, var(--luzmo-picker-icon-color-default-open, var(--picker-icon-color-default-open)))}:host([invalid]) #button:not(:disabled,.is-disabled){border-color:var(--highcontrast-picker-border-color-default, var(--luzmo-picker-border-color-error-default, var(--picker-border-color-error-default)))}:host([invalid]) #button:not(:disabled,.is-disabled) .validation-icon{color:var(--highcontrast-picker-content-color-default, var(--luzmo-picker-icon-color-error, var(--picker-icon-color-error)))}:host([invalid]) #button:not(:disabled,.is-disabled):active{border-color:var(--highcontrast-picker-border-color-default, var(--luzmo-picker-border-color-error-active, var(--picker-border-color-error-active)))}:host([invalid][open]) #button:not(:disabled,.is-disabled){border-color:var(--highcontrast-picker-border-color-default, var(--luzmo-picker-border-color-error-default-open, var(--picker-border-color-error-default-open)))}:host([invalid]) #button:not(:disabled,.is-disabled):focus-visible{border-color:var(--highcontrast-picker-border-color-default, var(--luzmo-picker-border-color-error-key-focus, var(--picker-border-color-error-key-focus)))}:host([pending]) #button .disclosure-icon{color:var(--highcontrast-picker-content-color-disabled, var(--luzmo-picker-icon-color-disabled, var(--picker-icon-color-disabled)))}.icon{flex-shrink:0}.label{white-space:nowrap;font-size:var(--luzmo-picker-font-size, var(--picker-font-size));line-height:var(--luzmo-picker-line-height, var(--picker-line-height));font-weight:var(--luzmo-picker-font-weight, var(--picker-font-weight));text-overflow:ellipsis;text-align:start;flex:auto;overflow:hidden}.label.placeholder{font-weight:var(--luzmo-picker-placeholder-font-weight, var(--picker-font-weight));font-style:var(--luzmo-picker-placeholder-font-style, var(--picker-placeholder-font-style));transition:color var(--luzmo-picker-animation-duration, var(--picker-animation-duration)) ease-in-out;color:var(--highcontrast-picker-content-color-default, var(--luzmo-picker-font-color-default, var(--picker-font-color-default)))}.label.placeholder:active{color:var(--highcontrast-picker-content-color-default, var(--luzmo-picker-font-color-active, var(--picker-font-color-active)))}.disclosure-icon{vertical-align:top;transition:color var(--luzmo-picker-animation-duration, var(--picker-animation-duration)) ease-out;margin-inline-start:var(--luzmo-picker-spacing-icon-to-disclosure-icon, var(--picker-spacing-icon-to-disclosure-icon));color:var(--highcontrast-picker-content-color-default, var(--luzmo-picker-icon-color-default, var(--picker-icon-color-default)));flex-shrink:0;display:inline-block;position:relative}.disclosure-icon:active{color:var(--highcontrast-picker-content-color-default, var(--luzmo-picker-icon-color-active, var(--picker-icon-color-active)))}luzmo-progress-circle,.validation-icon{margin-inline-start:var(--luzmo-picker-spacing-text-to-icon, var(--picker-spacing-text-to-icon))}.icon-container{display:flex;position:relative;height:100%;align-items:center;font-size:var(--luzmo-picker-disclosure-icon-size, var(--picker-disclosure-icon-size))}.icon-container.disclosure-icon{margin-inline-end:0}.label~.disclosure-icon{margin-inline-start:var(--luzmo-picker-spacing-text-to-icon, var(--picker-spacing-text-to-icon))}:host([quiet]) #button{inline-size:auto;min-inline-size:0;padding-inline:var(--luzmo-picker-spacing-edge-to-text-quiet, var(--picker-spacing-edge-to-text-quiet));color:var(--highcontrast-picker-content-color-default, var(--luzmo-picker-font-color-default, var(--picker-font-color-default)));background-color:initial;background-color:var(--highcontrast-picker-background-color, transparent);border:none;border-radius:0;box-shadow:none;margin-block-start:calc(var(--luzmo-picker-spacing-label-to-picker-quiet, var(--picker-spacing-label-to-picker-quiet)) + 1px)}:host([quiet]) #button.label-inline{margin-block-start:0}:host([quiet]) #button .disclosure-icon{margin-inline-end:var(--luzmo-picker-spacing-edge-to-disclosure-icon-quiet, var(--picker-spacing-edge-to-disclosure-icon-quiet))}:host([quiet]) #button:after{block-size:auto;inline-size:auto;border:none}@media (hover: hover){#button:hover{color:var(--highcontrast-picker-content-color-default, var(--luzmo-picker-font-color-hover, var(--picker-font-color-hover)));background-color:var(--highcontrast-picker-background-color, var(--luzmo-picker-background-color-hover, var(--picker-background-color-hover)));border-color:var(--highcontrast-picker-border-color-hover, var(--luzmo-picker-border-color-hover, var(--picker-border-color-hover)))}#button:hover .disclosure-icon{color:var(--highcontrast-picker-content-color-default, var(--luzmo-picker-icon-color-hover, var(--picker-icon-color-hover)))}:host([open]):not([quiet]) #button:not(:disabled,.is-disabled):hover{color:var(--highcontrast-picker-content-color-default, var(--luzmo-picker-font-color-hover-open, var(--picker-font-color-hover-open)));background-color:var(--highcontrast-picker-background-color, var(--luzmo-picker-background-color-hover-open, var(--picker-background-color-hover-open)));border-color:var(--highcontrast-picker-border-color-hover, var(--luzmo-picker-border-color-hover-open, var(--picker-border-color-hover-open)))}:host([open]) #button:not(:disabled,.is-disabled):hover .disclosure-icon{color:var(--highcontrast-picker-content-color-default, var(--luzmo-picker-icon-color-hover-open, var(--picker-icon-color-hover-open)))}:host([invalid]) #button:not(:disabled,.is-disabled):hover{border-color:var(--highcontrast-picker-border-color-hover, var(--luzmo-picker-border-color-error-hover, var(--picker-border-color-error-hover)))}:host([invalid][open]) #button:not(:disabled,.is-disabled):hover{border-color:var(--highcontrast-picker-border-color-hover, var(--luzmo-picker-border-color-error-hover-open, var(--picker-border-color-error-hover-open)))}.label.placeholder:hover{color:var(--highcontrast-picker-content-color-default, var(--luzmo-picker-font-color-hover, var(--picker-font-color-hover)))}:host([quiet]) #button:hover{background-color:initial;background-color:var(--highcontrast-picker-background-color, transparent)!important}}:host([quiet]) #button:focus-visible{background-color:initial;background-color:var(--highcontrast-picker-background-color, transparent)}:host([quiet]) #button:focus-visible:after{box-shadow:0 var(--luzmo-picker-focus-indicator-width, var(--picker-focus-indicator-width)) 0 0 var(--highcontrast-picker-focus-indicator-color, var(--luzmo-picker-focus-indicator-color, var(--picker-focus-indicator-color)));margin:calc((var(--luzmo-picker-focus-indicator-gap, var(--picker-focus-indicator-gap)) + var(--luzmo-picker-border-width, var(--picker-border-width))) * -1) 0;border:none;border-radius:0}:host([quiet][open]) #button,:host([quiet][disabled]) #button#button,:host([quiet]) #button#button:disabled,:host([quiet]) #button:active{background-color:initial;background-color:var(--highcontrast-picker-background-color, transparent)}.label-inline{vertical-align:top;display:inline-flex}:host([disabled]) #button,#button:disabled{cursor:default;background-color:var(--highcontrast-picker-background-color, var(--luzmo-picker-background-color-disabled, var(--picker-background-color-disabled)));border-color:#0000;border-color:var(--highcontrast-picker-border-color-disabled, transparent);color:var(--highcontrast-picker-content-color-disabled, var(--luzmo-picker-font-color-disabled, var(--picker-font-color-disabled)))}:host([disabled]) #button .icon,:host([disabled]) #button .disclosure-icon,:host([disabled]) #button .validation-icon,#button:disabled .icon,#button:disabled .disclosure-icon,#button:disabled .validation-icon{color:var(--highcontrast-picker-content-color-disabled, var(--luzmo-picker-icon-color-disabled, var(--picker-icon-color-disabled)))}:host([disabled]) #button .label.placeholder,#button:disabled .label.placeholder{color:var(--highcontrast-picker-content-color-disabled, var(--luzmo-picker-font-color-disabled, var(--picker-font-color-disabled)))}:host{--picker-box-shadow: 0px 1px 3px 0px rgba(var(--luzmo-border-color-rgb), .06);--picker-background-color-default: var(--luzmo-background-color);--picker-background-color-default-open: var(--luzmo-background-color-hover);--picker-background-color-active: var(--luzmo-background-color-down);--picker-background-color-hover: var(--luzmo-background-color-hover);--picker-background-color-hover-open: var(--luzmo-background-color-down);--picker-background-color-key-focus: var(--luzmo-background-color-down);--picker-border-color-default: var(--luzmo-border-color);--picker-border-color-default-open: var(--luzmo-border-color-hover);--picker-border-color-hover: var(--luzmo-border-color);--picker-border-color-hover-open: var(--luzmo-border-color-hover);--picker-border-color-active: var(--luzmo-border-color);--picker-border-color-key-focus: var(--luzmo-border-color);--picker-border-width: var(--luzmo-border-width);--picker-font-size: var(--luzmo-font-size);--picker-font-weight: var(--luzmo-font-weight);--picker-placeholder-font-style: var(--luzmo-font-style);--picker-line-height: var(--luzmo-line-height);--picker-block-size: 32px;--picker-border-radius: var(--luzmo-border-radius);--picker-spacing-edge-to-text: calc( var(--luzmo-spacing-3) + var(--luzmo-spacing-1) );--picker-spacing-text-to-icon: calc( var(--luzmo-spacing-3) + var(--luzmo-spacing-1) );--picker-spacing-text-to-icon-inline-end: calc( var(--luzmo-spacing-3) + var(--luzmo-spacing-1) );--picker-spacing-icon-to-disclosure-icon: calc( var(--luzmo-spacing-3) + var(--luzmo-spacing-1) );--picker-spacing-edge-to-text-quiet: 0px;--picker-spacing-label-to-picker: 0px;--picker-spacing-label-to-picker-quiet: calc( -1 * var(--luzmo-spacing-3) + var(--luzmo-spacing-1) );--picker-spacing-edge-to-disclosure-icon: calc( var(--luzmo-spacing-3) + var(--luzmo-spacing-1) );--picker-spacing-edge-to-disclosure-icon-quiet: 0px;--picker-animation-duration: var(--luzmo-animation-duration);--picker-font-color-default: var(--luzmo-font-color);--picker-font-color-default-open: var(--luzmo-font-color-hover);--picker-font-color-hover: var(--luzmo-font-color-hover);--picker-font-color-hover-open: var(--luzmo-font-color-down);--picker-font-color-active: var(--luzmo-font-color-focus);--picker-font-color-key-focus: var(--luzmo-font-color-focus);--picker-icon-color-default: var(--luzmo-font-color);--picker-icon-color-default-open: var(--luzmo-font-color-hover);--picker-icon-color-hover: var(--luzmo-font-color-hover);--picker-icon-color-hover-open: var(--luzmo-font-color-hover);--picker-icon-color-active: var(--luzmo-font-color-focus);--picker-icon-color-key-focus: var(--luzmo-font-color-focus);--picker-border-color-error-default: var(--luzmo-negative-color);--picker-border-color-error-default-open: var(--luzmo-negative-color-down);--picker-border-color-error-hover: var(--luzmo-negative-color-hover);--picker-border-color-error-hover-open: var(--luzmo-negative-color-down);--picker-border-color-error-active: var(--luzmo-negative-color-down);--picker-border-color-error-key-focus: var(--luzmo-negative-color-focus);--picker-icon-color-error: var(--luzmo-negative-color);--picker-background-color-disabled: var(--luzmo-background-color-disabled);--picker-font-color-disabled: var(--luzmo-disabled-color);--picker-icon-color-disabled: var(--luzmo-disabled-color);--picker-focus-indicator-gap: var(--luzmo-indicator-gap);--picker-focus-indicator-width: var(--luzmo-indicator-width);--picker-focus-indicator-color: var(--luzmo-indicator-color);--picker-disclosure-icon-size: var(--luzmo-font-size-s)}:host([size=s]){--picker-block-size: 28px;--picker-font-size: var(--luzmo-font-size-s);--picker-border-radius: var(--luzmo-border-radius);--picker-spacing-edge-to-text: var(--luzmo-spacing-3);--picker-spacing-text-to-icon: var(--luzmo-spacing-3);--picker-spacing-text-to-icon-inline-end: var(--luzmo-spacing-3);--picker-spacing-icon-to-disclosure-icon: var(--luzmo-spacing-3);--picker-spacing-label-to-picker-quiet: calc(-1 * var(--luzmo-spacing-3));--picker-spacing-edge-to-disclosure-icon: var(--luzmo-spacing-3);--picker-disclosure-icon-size: var(--luzmo-font-size-s)}:host([size=l]){--picker-block-size: 40px;--picker-font-size: var(--luzmo-font-size-l);--picker-border-radius: var(--luzmo-border-radius);--picker-spacing-edge-to-text: var(--luzmo-spacing-4);--picker-spacing-text-to-icon: var(--luzmo-spacing-4);--picker-spacing-text-to-icon-inline-end: var(--luzmo-spacing-4);--picker-spacing-icon-to-disclosure-icon: var(--luzmo-spacing-4);--picker-spacing-label-to-picker-quiet: calc(-1 * var(--luzmo-spacing-4));--picker-spacing-edge-to-disclosure-icon: var(--luzmo-spacing-4);--picker-disclosure-icon-size: var(--luzmo-font-size)}:host([size=xl]){--picker-block-size: 48px;--picker-font-size: var(--luzmo-font-size-xl);--picker-border-radius: var(--luzmo-border-radius-l);--picker-spacing-edge-to-text: calc( var(--luzmo-spacing-4) + var(--luzmo-spacing-1) );--picker-spacing-text-to-icon: calc( var(--luzmo-spacing-4) + var(--luzmo-spacing-1) );--picker-spacing-text-to-icon-inline-end: calc( var(--luzmo-spacing-4) + var(--luzmo-spacing-1) );--picker-spacing-icon-to-disclosure-icon: calc( var(--luzmo-spacing-4) + var(--luzmo-spacing-1) );--picker-spacing-label-to-picker-quiet: calc( -1 * var(--luzmo-spacing-4) + var(--luzmo-spacing-1) );--picker-spacing-edge-to-disclosure-icon: calc( var(--luzmo-spacing-4) + var(--luzmo-spacing-1) );--picker-disclosure-icon-size: var(--luzmo-font-size-l)}:host([variant=highlight]) ::slotted(luzmo-menu-item[selected]){--menu-item-highlight-label-content-color: var(--luzmo-primary-inverse-color);--menu-item-label-icon-color-default: var(--luzmo-primary-inverse-color);--menu-checkmark-display: var(--menu-checkmark-display-hidden);padding-inline-start:var(--luzmo-menu-item-label-inline-edge-to-content, var(--menu-item-label-inline-edge-to-content));background-color:var(--luzmo-menu-item-highlight-label-background-color, var(--menu-item-highlight-label-background-color, var(--luzmo-border-color)))}:host{display:inline-flex;vertical-align:top;max-inline-size:100%;inline-size:var(--luzmo-picker-inline-size, var(--picker-inline-size));min-inline-size:calc(var(--picker-minimum-width-multiplier) * var(--luzmo-picker-block-size, var(--picker-block-size)))}:host([quiet]){width:auto;min-width:0}:host([disabled]){pointer-events:none}#button{width:100%;min-width:100%;max-width:100%}#icon:not([hidden]){display:inline-flex}:host([readonly]) #button{-webkit-user-select:inherit;user-select:inherit}.picker,.validation-icon{flex-shrink:0}luzmo-overlay{pointer-events:none}luzmo-menu{pointer-events:initial}:host>luzmo-menu{display:none}:host([focused]:not([quiet])) #button #label.placeholder{color:var(--picker-placeholder-text-color-key-focus, var(--alias-placeholder-text-color-hover))}#label.visually-hidden~.picker{margin-inline-start:auto}:host([focused]:not([quiet],[pending])) #button .picker{color:var(--picker-icon-color-key-focus, var(--alias-icon-color-focus))}.visually-hidden{border:0;clip:rect(0,0,0,0);clip-path:inset(50%);height:1px;margin:0 -1px -1px 0;overflow:hidden;padding:0;position:absolute;width:1px;white-space:nowrap}luzmo-overlay:not(:defined){display:none}#button.remove-focus-ring-safari-hack:focus-visible{background-color:var(--highcontrast-picker-background-color, var(--luzmo-picker-background-color-default, var(--picker-background-color-default)));border-color:var(--highcontrast-picker-border-color-default, var(--luzmo-picker-border-color-default, var(--picker-border-color-default)));color:var(--highcontrast-picker-content-color-default, var(--luzmo-picker-font-color-default, var(--picker-font-color-default)))}#button.remove-focus-ring-safari-hack:after{border:none}#button.remove-focus-ring-safari-hack:focus-visible:after{box-shadow:none}#button.remove-focus-ring-safari-hack:active{background-color:var(--highcontrast-picker-background-color, var(--luzmo-picker-background-color-default, var(--picker-background-color-default)));border-color:var(--highcontrast-picker-border-color-default, var(--luzmo-picker-border-color-default, var(--picker-border-color-default)));color:var(--highcontrast-picker-content-color-default, var(--luzmo-picker-font-color-default, var(--picker-font-color-default)))}';var x=Object.defineProperty,I=Object.getOwnPropertyDescriptor,c=(s,e,o,t)=>{for(var a=t>1?void 0:t?I(e,o):e,n=s.length-1,p;n>=0;n--)(p=s[n])&&(a=(t?p(e,o,a):p(a))||a);return t&&a&&x(e,o,a),a};const q=()=>r.x`
|
|
18
|
+
"use strict";const r=require("./base-Cy0MQrPT.cjs"),v=require("./state-vf0PJN3_.cjs"),b=require("./query-BL-TJj7K.cjs"),k=require("./class-map-D-Y-hsN5.cjs"),d=require("./if-defined-DaXWqfzc.cjs"),g=require("./style-map-DuMd5xlY.cjs"),m=require("./focusable-B_KwfEec.cjs"),f=require("./dependency-manger-uthev62E.cjs"),p=require("./strategies-CNgBb6dM.cjs"),z=require("./pending-state-bJr-nEJl.cjs"),y=require("./sized-mixin-WPHH0a_D.cjs"),l=require("./luzmo-icons-CtA-TJPd.cjs");require("./menu/index.cjs");require("./overlay/index.cjs");require("./progress-circle/index.cjs");require("./tooltip/index.cjs");const w='#button{cursor:pointer;-webkit-user-select:none;user-select:none;font-family:var(--luzmo-button-font-family, var(--luzmo-font-family));-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;line-height:var(--luzmo-button-line-height, var(--luzmo-line-height, 1.3));text-transform:none;vertical-align:top;-webkit-appearance:button;transition:background var(--luzmo-button-animation-duration, var(--luzmo-animation-duration)) ease-out,border-color var(--luzmo-button-animation-duration, var(--luzmo-animation-duration)) ease-out,color var(--luzmo-button-animation-duration, var(--luzmo-animation-duration)) ease-out,box-shadow var(--luzmo-button-animation-duration, var(--luzmo-animation-duration)) ease-out;justify-content:center;align-items:center;margin:0;-webkit-text-decoration:none;text-decoration:none;display:inline-flex;position:relative;overflow:visible}#button::-moz-focus-inner{border-style:none;padding:0}#button:focus{outline:none}#icon{margin-inline-end:var(--luzmo-picker-spacing-text-to-icon, var(--picker-spacing-text-to-icon));font-size:var(--luzmo-picker-font-size, var(--picker-font-size))}@media (forced-colors: active){:host{--highcontrast-picker-focus-indicator-color: Highlight;--highcontrast-picker-border-color-default: ButtonBorder;--highcontrast-picker-border-color-hover: Highlight;--highcontrast-picker-border-color-disabled: GrayText;--highcontrast-picker-content-color-default: ButtonText;--highcontrast-picker-content-color-disabled: GrayText;--highcontrast-picker-background-color: ButtonFace}#button:focus-visible{--highcontrast-picker-border-color-hover: ButtonText}#button .label,#button:after{forced-color-adjust:none}}#button{box-sizing:border-box;max-inline-size:100%;min-inline-size:calc(var(--picker-minimum-width-multiplier) * var(--luzmo-picker-block-size, var(--picker-block-size)));block-size:var(--luzmo-picker-block-size, var(--picker-block-size));border-width:var(--luzmo-picker-border-width, var(--picker-border-width));border-radius:var(--luzmo-picker-border-radius, var(--picker-border-radius));box-shadow:var(--luzmo-picker-box-shadow, var(--picker-box-shadow));transition:background-color var(--luzmo-picker-animation-duration, var(--picker-animation-duration)),box-shadow var(--luzmo-picker-animation-duration, var(--picker-animation-duration)),border-color var(--luzmo-picker-animation-duration, var(--picker-animation-duration)) ease-in-out;color:var(--highcontrast-picker-content-color-default, var(--luzmo-picker-font-color-default, var(--picker-font-color-default)));background-color:var(--highcontrast-picker-background-color, var(--luzmo-picker-background-color-default, var(--picker-background-color-default)));border-style:solid;border-color:var(--highcontrast-picker-border-color-default, var(--luzmo-picker-border-color-default, var(--picker-border-color-default)));margin-block-start:var(--luzmo-picker-spacing-label-to-picker, var(--picker-spacing-label-to-picker));padding-block:0;padding-inline-start:var(--luzmo-picker-spacing-edge-to-text, var(--picker-spacing-edge-to-text));padding-inline-end:var(--luzmo-picker-spacing-edge-to-disclosure-icon, var(--picker-spacing-edge-to-disclosure-icon));display:flex}#button:after{pointer-events:none;content:"";block-size:calc(100% + var(--luzmo-picker-focus-indicator-gap, var(--picker-focus-indicator-gap)) * 2 + var(--luzmo-picker-border-width, var(--picker-border-width)) * 2);inline-size:calc(100% + var(--luzmo-picker-focus-indicator-gap, var(--picker-focus-indicator-gap)) * 2 + var(--luzmo-picker-border-width, var(--picker-border-width)) * 2);border-style:solid;border-width:var(--luzmo-picker-focus-indicator-width, var(--picker-focus-indicator-width));border-radius:calc(var(--luzmo-picker-border-radius, var(--picker-border-radius)) + var(--luzmo-picker-focus-indicator-gap, var(--picker-focus-indicator-gap)) + var(--luzmo-picker-border-width, var(--picker-border-width)));border-color:#0000;margin-block-start:calc((var(--luzmo-picker-focus-indicator-gap, var(--picker-focus-indicator-gap)) + var(--luzmo-picker-focus-indicator-width, var(--picker-focus-indicator-width)) + var(--luzmo-picker-border-width, var(--picker-border-width))) * -1);margin-inline-start:calc((var(--luzmo-picker-focus-indicator-gap, var(--picker-focus-indicator-gap)) + var(--luzmo-picker-focus-indicator-width, var(--picker-focus-indicator-width)) + var(--luzmo-picker-border-width, var(--picker-border-width))) * -1);position:absolute;inset-block:0;inset-inline:0}#button:active{background-color:var(--highcontrast-picker-background-color, var(--luzmo-picker-background-color-active, var(--picker-background-color-active)));border-color:var(--highcontrast-picker-border-color-default, var(--luzmo-picker-border-active, var(--picker-border-color-active)))}#button:active:after{border-color:#0000}#button.placeholder:active .label{color:var(--highcontrast-picker-content-color-default, var(--luzmo-picker-font-color-active, var(--picker-font-color-active)))}#button:focus-visible{background-color:var(--highcontrast-picker-background-color, var(--luzmo-picker-background-color-key-focus, var(--picker-background-color-key-focus)));border-color:var(--highcontrast-picker-border-color-default, var(--luzmo-picker-border-color-key-focus, var(--picker-border-color-key-focus)));color:var(--highcontrast-picker-content-color-default, var(--luzmo-picker-font-color-key-focus, var(--picker-font-color-key-focus)));outline:none}#button:focus-visible:after{border-color:var(--highcontrast-picker-focus-indicator-color, var(--luzmo-picker-focus-indicator-color, var(--picker-focus-indicator-color)))}#button.placeholder:focus-visible{color:var(--highcontrast-picker-content-color-default, var(--luzmo-picker-font-color-key-focus, var(--picker-font-color-key-focus)))}#button:focus-visible .disclosure-icon{color:var(--highcontrast-picker-content-color-default, var(--luzmo-picker-icon-color-key-focus, var(--picker-icon-color-key-focus)))}:host([open]) #button:not(:disabled,.is-disabled){color:var(--highcontrast-picker-content-color-default, var(--luzmo-picker-font-color-default-open, var(--picker-font-color-default-open)));background-color:var(--highcontrast-picker-background-color, var(--luzmo-picker-background-color-default-open, var(--picker-background-color-default-open)));border-color:var(--highcontrast-picker-border-color-default, var(--luzmo-picker-border-default-open, var(--picker-border-color-default-open)))}:host([open]) #button:not(:disabled,.is-disabled) .disclosure-icon{color:var(--highcontrast-picker-content-color-default, var(--luzmo-picker-icon-color-default-open, var(--picker-icon-color-default-open)))}:host([invalid]) #button:not(:disabled,.is-disabled){border-color:var(--highcontrast-picker-border-color-default, var(--luzmo-picker-border-color-error-default, var(--picker-border-color-error-default)))}:host([invalid]) #button:not(:disabled,.is-disabled) .validation-icon{color:var(--highcontrast-picker-content-color-default, var(--luzmo-picker-icon-color-error, var(--picker-icon-color-error)))}:host([invalid]) #button:not(:disabled,.is-disabled):active{border-color:var(--highcontrast-picker-border-color-default, var(--luzmo-picker-border-color-error-active, var(--picker-border-color-error-active)))}:host([invalid][open]) #button:not(:disabled,.is-disabled){border-color:var(--highcontrast-picker-border-color-default, var(--luzmo-picker-border-color-error-default-open, var(--picker-border-color-error-default-open)))}:host([invalid]) #button:not(:disabled,.is-disabled):focus-visible{border-color:var(--highcontrast-picker-border-color-default, var(--luzmo-picker-border-color-error-key-focus, var(--picker-border-color-error-key-focus)))}:host([pending]) #button .disclosure-icon{color:var(--highcontrast-picker-content-color-disabled, var(--luzmo-picker-icon-color-disabled, var(--picker-icon-color-disabled)))}.icon{flex-shrink:0}.label{white-space:nowrap;font-size:var(--luzmo-picker-font-size, var(--picker-font-size));line-height:var(--luzmo-picker-line-height, var(--picker-line-height));font-weight:var(--luzmo-picker-font-weight, var(--picker-font-weight));text-overflow:ellipsis;text-align:start;flex:auto;overflow:hidden}.label.placeholder{font-weight:var(--luzmo-picker-placeholder-font-weight, var(--picker-font-weight));font-style:var(--luzmo-picker-placeholder-font-style, var(--picker-placeholder-font-style));transition:color var(--luzmo-picker-animation-duration, var(--picker-animation-duration)) ease-in-out;color:var(--highcontrast-picker-content-color-default, var(--luzmo-picker-font-color-default, var(--picker-font-color-default)))}.label.placeholder:active{color:var(--highcontrast-picker-content-color-default, var(--luzmo-picker-font-color-active, var(--picker-font-color-active)))}.disclosure-icon{vertical-align:top;transition:color var(--luzmo-picker-animation-duration, var(--picker-animation-duration)) ease-out;margin-inline-start:var(--luzmo-picker-spacing-icon-to-disclosure-icon, var(--picker-spacing-icon-to-disclosure-icon));color:var(--highcontrast-picker-content-color-default, var(--luzmo-picker-icon-color-default, var(--picker-icon-color-default)));flex-shrink:0;display:inline-block;position:relative}.disclosure-icon:active{color:var(--highcontrast-picker-content-color-default, var(--luzmo-picker-icon-color-active, var(--picker-icon-color-active)))}luzmo-progress-circle,.validation-icon{margin-inline-start:var(--luzmo-picker-spacing-text-to-icon, var(--picker-spacing-text-to-icon))}.icon-container{display:flex;position:relative;height:100%;align-items:center;font-size:var(--luzmo-picker-disclosure-icon-size, var(--picker-disclosure-icon-size))}.icon-container.disclosure-icon{margin-inline-end:0}.label~.disclosure-icon{margin-inline-start:var(--luzmo-picker-spacing-text-to-icon, var(--picker-spacing-text-to-icon))}:host([quiet]) #button{inline-size:auto;min-inline-size:0;padding-inline:var(--luzmo-picker-spacing-edge-to-text-quiet, var(--picker-spacing-edge-to-text-quiet));color:var(--highcontrast-picker-content-color-default, var(--luzmo-picker-font-color-default, var(--picker-font-color-default)));background-color:initial;background-color:var(--highcontrast-picker-background-color, transparent);border:none;border-radius:0;box-shadow:none;margin-block-start:calc(var(--luzmo-picker-spacing-label-to-picker-quiet, var(--picker-spacing-label-to-picker-quiet)) + 1px)}:host([quiet]) #button.label-inline{margin-block-start:0}:host([quiet]) #button .disclosure-icon{margin-inline-end:var(--luzmo-picker-spacing-edge-to-disclosure-icon-quiet, var(--picker-spacing-edge-to-disclosure-icon-quiet))}:host([quiet]) #button:after{block-size:auto;inline-size:auto;border:none}@media (hover: hover){#button:hover{color:var(--highcontrast-picker-content-color-default, var(--luzmo-picker-font-color-hover, var(--picker-font-color-hover)));background-color:var(--highcontrast-picker-background-color, var(--luzmo-picker-background-color-hover, var(--picker-background-color-hover)));border-color:var(--highcontrast-picker-border-color-hover, var(--luzmo-picker-border-color-hover, var(--picker-border-color-hover)))}#button:hover .disclosure-icon{color:var(--highcontrast-picker-content-color-default, var(--luzmo-picker-icon-color-hover, var(--picker-icon-color-hover)))}:host([open]):not([quiet]) #button:not(:disabled,.is-disabled):hover{color:var(--highcontrast-picker-content-color-default, var(--luzmo-picker-font-color-hover-open, var(--picker-font-color-hover-open)));background-color:var(--highcontrast-picker-background-color, var(--luzmo-picker-background-color-hover-open, var(--picker-background-color-hover-open)));border-color:var(--highcontrast-picker-border-color-hover, var(--luzmo-picker-border-color-hover-open, var(--picker-border-color-hover-open)))}:host([open]) #button:not(:disabled,.is-disabled):hover .disclosure-icon{color:var(--highcontrast-picker-content-color-default, var(--luzmo-picker-icon-color-hover-open, var(--picker-icon-color-hover-open)))}:host([invalid]) #button:not(:disabled,.is-disabled):hover{border-color:var(--highcontrast-picker-border-color-hover, var(--luzmo-picker-border-color-error-hover, var(--picker-border-color-error-hover)))}:host([invalid][open]) #button:not(:disabled,.is-disabled):hover{border-color:var(--highcontrast-picker-border-color-hover, var(--luzmo-picker-border-color-error-hover-open, var(--picker-border-color-error-hover-open)))}.label.placeholder:hover{color:var(--highcontrast-picker-content-color-default, var(--luzmo-picker-font-color-hover, var(--picker-font-color-hover)))}:host([quiet]) #button:hover{background-color:initial;background-color:var(--highcontrast-picker-background-color, transparent)!important}}:host([quiet]) #button:focus-visible{background-color:initial;background-color:var(--highcontrast-picker-background-color, transparent)}:host([quiet]) #button:focus-visible:after{box-shadow:0 var(--luzmo-picker-focus-indicator-width, var(--picker-focus-indicator-width)) 0 0 var(--highcontrast-picker-focus-indicator-color, var(--luzmo-picker-focus-indicator-color, var(--picker-focus-indicator-color)));margin:calc((var(--luzmo-picker-focus-indicator-gap, var(--picker-focus-indicator-gap)) + var(--luzmo-picker-border-width, var(--picker-border-width))) * -1) 0;border:none;border-radius:0}:host([quiet][open]) #button,:host([quiet][disabled]) #button#button,:host([quiet]) #button#button:disabled,:host([quiet]) #button:active{background-color:initial;background-color:var(--highcontrast-picker-background-color, transparent)}.label-inline{vertical-align:top;display:inline-flex}:host([disabled]) #button,#button:disabled{cursor:default;background-color:var(--highcontrast-picker-background-color, var(--luzmo-picker-background-color-disabled, var(--picker-background-color-disabled)));border-color:#0000;border-color:var(--highcontrast-picker-border-color-disabled, transparent);color:var(--highcontrast-picker-content-color-disabled, var(--luzmo-picker-font-color-disabled, var(--picker-font-color-disabled)))}:host([disabled]) #button .icon,:host([disabled]) #button .disclosure-icon,:host([disabled]) #button .validation-icon,#button:disabled .icon,#button:disabled .disclosure-icon,#button:disabled .validation-icon{color:var(--highcontrast-picker-content-color-disabled, var(--luzmo-picker-icon-color-disabled, var(--picker-icon-color-disabled)))}:host([disabled]) #button .label.placeholder,#button:disabled .label.placeholder{color:var(--highcontrast-picker-content-color-disabled, var(--luzmo-picker-font-color-disabled, var(--picker-font-color-disabled)))}:host{--picker-box-shadow: 0px 1px 3px 0px rgba(var(--luzmo-border-color-rgb), .06);--picker-background-color-default: var(--luzmo-background-color);--picker-background-color-default-open: var(--luzmo-background-color-hover);--picker-background-color-active: var(--luzmo-background-color-down);--picker-background-color-hover: var(--luzmo-background-color-hover);--picker-background-color-hover-open: var(--luzmo-background-color-down);--picker-background-color-key-focus: var(--luzmo-background-color-down);--picker-border-color-default: var(--luzmo-border-color);--picker-border-color-default-open: var(--luzmo-border-color-hover);--picker-border-color-hover: var(--luzmo-border-color);--picker-border-color-hover-open: var(--luzmo-border-color-hover);--picker-border-color-active: var(--luzmo-border-color);--picker-border-color-key-focus: var(--luzmo-border-color);--picker-border-width: var(--luzmo-border-width);--picker-font-size: var(--luzmo-font-size);--picker-font-weight: var(--luzmo-font-weight);--picker-placeholder-font-style: var(--luzmo-font-style);--picker-line-height: var(--luzmo-line-height);--picker-block-size: 32px;--picker-border-radius: var(--luzmo-border-radius);--picker-spacing-edge-to-text: calc( var(--luzmo-spacing-3) + var(--luzmo-spacing-1) );--picker-spacing-text-to-icon: calc( var(--luzmo-spacing-3) + var(--luzmo-spacing-1) );--picker-spacing-text-to-icon-inline-end: calc( var(--luzmo-spacing-3) + var(--luzmo-spacing-1) );--picker-spacing-icon-to-disclosure-icon: calc( var(--luzmo-spacing-3) + var(--luzmo-spacing-1) );--picker-spacing-edge-to-text-quiet: 0px;--picker-spacing-label-to-picker: 0px;--picker-spacing-label-to-picker-quiet: calc( -1 * var(--luzmo-spacing-3) + var(--luzmo-spacing-1) );--picker-spacing-edge-to-disclosure-icon: calc( var(--luzmo-spacing-3) + var(--luzmo-spacing-1) );--picker-spacing-edge-to-disclosure-icon-quiet: 0px;--picker-animation-duration: var(--luzmo-animation-duration);--picker-font-color-default: var(--luzmo-font-color);--picker-font-color-default-open: var(--luzmo-font-color-hover);--picker-font-color-hover: var(--luzmo-font-color-hover);--picker-font-color-hover-open: var(--luzmo-font-color-down);--picker-font-color-active: var(--luzmo-font-color-focus);--picker-font-color-key-focus: var(--luzmo-font-color-focus);--picker-icon-color-default: var(--luzmo-font-color);--picker-icon-color-default-open: var(--luzmo-font-color-hover);--picker-icon-color-hover: var(--luzmo-font-color-hover);--picker-icon-color-hover-open: var(--luzmo-font-color-hover);--picker-icon-color-active: var(--luzmo-font-color-focus);--picker-icon-color-key-focus: var(--luzmo-font-color-focus);--picker-border-color-error-default: var(--luzmo-negative-color);--picker-border-color-error-default-open: var(--luzmo-negative-color-down);--picker-border-color-error-hover: var(--luzmo-negative-color-hover);--picker-border-color-error-hover-open: var(--luzmo-negative-color-down);--picker-border-color-error-active: var(--luzmo-negative-color-down);--picker-border-color-error-key-focus: var(--luzmo-negative-color-focus);--picker-icon-color-error: var(--luzmo-negative-color);--picker-background-color-disabled: var(--luzmo-background-color-disabled);--picker-font-color-disabled: var(--luzmo-disabled-color);--picker-icon-color-disabled: var(--luzmo-disabled-color);--picker-focus-indicator-gap: var(--luzmo-indicator-gap);--picker-focus-indicator-width: var(--luzmo-indicator-width);--picker-focus-indicator-color: var(--luzmo-indicator-color);--picker-disclosure-icon-size: var(--luzmo-font-size-s)}:host([size=s]){--picker-block-size: 28px;--picker-font-size: var(--luzmo-font-size-s);--picker-border-radius: var(--luzmo-border-radius);--picker-spacing-edge-to-text: var(--luzmo-spacing-3);--picker-spacing-text-to-icon: var(--luzmo-spacing-3);--picker-spacing-text-to-icon-inline-end: var(--luzmo-spacing-3);--picker-spacing-icon-to-disclosure-icon: var(--luzmo-spacing-3);--picker-spacing-label-to-picker-quiet: calc(-1 * var(--luzmo-spacing-3));--picker-spacing-edge-to-disclosure-icon: var(--luzmo-spacing-3);--picker-disclosure-icon-size: var(--luzmo-font-size-s)}:host([size=l]){--picker-block-size: 40px;--picker-font-size: var(--luzmo-font-size-l);--picker-border-radius: var(--luzmo-border-radius);--picker-spacing-edge-to-text: var(--luzmo-spacing-4);--picker-spacing-text-to-icon: var(--luzmo-spacing-4);--picker-spacing-text-to-icon-inline-end: var(--luzmo-spacing-4);--picker-spacing-icon-to-disclosure-icon: var(--luzmo-spacing-4);--picker-spacing-label-to-picker-quiet: calc(-1 * var(--luzmo-spacing-4));--picker-spacing-edge-to-disclosure-icon: var(--luzmo-spacing-4);--picker-disclosure-icon-size: var(--luzmo-font-size)}:host([size=xl]){--picker-block-size: 48px;--picker-font-size: var(--luzmo-font-size-xl);--picker-border-radius: var(--luzmo-border-radius-l);--picker-spacing-edge-to-text: calc( var(--luzmo-spacing-4) + var(--luzmo-spacing-1) );--picker-spacing-text-to-icon: calc( var(--luzmo-spacing-4) + var(--luzmo-spacing-1) );--picker-spacing-text-to-icon-inline-end: calc( var(--luzmo-spacing-4) + var(--luzmo-spacing-1) );--picker-spacing-icon-to-disclosure-icon: calc( var(--luzmo-spacing-4) + var(--luzmo-spacing-1) );--picker-spacing-label-to-picker-quiet: calc( -1 * var(--luzmo-spacing-4) + var(--luzmo-spacing-1) );--picker-spacing-edge-to-disclosure-icon: calc( var(--luzmo-spacing-4) + var(--luzmo-spacing-1) );--picker-disclosure-icon-size: var(--luzmo-font-size-l)}:host([variant=highlight]) ::slotted(luzmo-menu-item[selected]){--menu-item-highlight-label-content-color: var(--luzmo-primary-inverse-color);--menu-item-label-icon-color-default: var(--luzmo-primary-inverse-color);--menu-checkmark-display: var(--menu-checkmark-display-hidden);padding-inline-start:var(--luzmo-menu-item-label-inline-edge-to-content, var(--menu-item-label-inline-edge-to-content));background-color:var(--luzmo-menu-item-highlight-label-background-color, var(--menu-item-highlight-label-background-color, var(--luzmo-border-color)))}:host{display:inline-flex;vertical-align:top;max-inline-size:100%;inline-size:var(--luzmo-picker-inline-size, var(--picker-inline-size));min-inline-size:calc(var(--picker-minimum-width-multiplier) * var(--luzmo-picker-block-size, var(--picker-block-size)))}:host([quiet]){width:auto;min-width:0}:host([disabled]){pointer-events:none}#button{width:100%;min-width:100%;max-width:100%}#icon:not([hidden]){display:inline-flex}:host([readonly]) #button{-webkit-user-select:inherit;user-select:inherit}.picker,.validation-icon{flex-shrink:0}luzmo-overlay{pointer-events:none}luzmo-menu{pointer-events:initial}:host>luzmo-menu{display:none}:host([focused]:not([quiet])) #button #label.placeholder{color:var(--picker-placeholder-text-color-key-focus, var(--alias-placeholder-text-color-hover))}#label.visually-hidden~.picker{margin-inline-start:auto}:host([focused]:not([quiet],[pending])) #button .picker{color:var(--picker-icon-color-key-focus, var(--alias-icon-color-focus))}.visually-hidden{border:0;clip:rect(0,0,0,0);clip-path:inset(50%);height:1px;margin:0 -1px -1px 0;overflow:hidden;padding:0;position:absolute;width:1px;white-space:nowrap}luzmo-overlay:not(:defined){display:none}#button.remove-focus-ring-safari-hack:focus-visible{background-color:var(--highcontrast-picker-background-color, var(--luzmo-picker-background-color-default, var(--picker-background-color-default)));border-color:var(--highcontrast-picker-border-color-default, var(--luzmo-picker-border-color-default, var(--picker-border-color-default)));color:var(--highcontrast-picker-content-color-default, var(--luzmo-picker-font-color-default, var(--picker-font-color-default)))}#button.remove-focus-ring-safari-hack:after{border:none}#button.remove-focus-ring-safari-hack:focus-visible:after{box-shadow:none}#button.remove-focus-ring-safari-hack:active{background-color:var(--highcontrast-picker-background-color, var(--luzmo-picker-background-color-default, var(--picker-background-color-default)));border-color:var(--highcontrast-picker-border-color-default, var(--luzmo-picker-border-color-default, var(--picker-border-color-default)));color:var(--highcontrast-picker-content-color-default, var(--luzmo-picker-font-color-default, var(--picker-font-color-default)))}';var x=Object.defineProperty,I=Object.getOwnPropertyDescriptor,c=(s,e,o,t)=>{for(var a=t>1?void 0:t?I(e,o):e,n=s.length-1,u;n>=0;n--)(u=s[n])&&(a=(t?u(e,o,a):u(a))||a);return t&&a&&x(e,o,a),a};const q=()=>r.x`
|
|
19
19
|
<div class="disclosure-icon icon">
|
|
20
20
|
${l.T3(l.T,{className:"indicator"})}
|
|
21
21
|
</div>
|
|
@@ -23,7 +23,7 @@
|
|
|
23
23
|
<div class="icon-container validation-icon icon">
|
|
24
24
|
${l.T3(l.$)}
|
|
25
25
|
</div>
|
|
26
|
-
`,h="option-picker";class i extends y.SizedMixin(m.Focusable,{noDefaultSize:!0}){constructor(){super(),this.disabled=!1,this.focused=!1,this.invalid=!1,this.pending=!1,this.pendingLabel="Pending",this.open=!1,this.readonly=!1,this.placement="bottom-start",this.quiet=!1,this.value="",this.selects="single",this.dependencyManager=new f.DependencyManagerController(this),this.isMobile=new
|
|
26
|
+
`,h="option-picker";class i extends y.SizedMixin(m.Focusable,{noDefaultSize:!0}){constructor(){super(),this.disabled=!1,this.focused=!1,this.invalid=!1,this.pending=!1,this.pendingLabel="Pending",this.open=!1,this.readonly=!1,this.placement="bottom-start",this.quiet=!1,this.value="",this.selects="single",this.dependencyManager=new f.DependencyManagerController(this),this.isMobile=new p.MatchMediaController(this,p.IS_MOBILE),this.listRole="listbox",this.itemRole="option",this.hasRenderedOverlay=!1,this._selfManageFocusElement=!1,this.deprecatedMenu=null,this.selectionPromise=Promise.resolve(),this.willManageSelection=!1,this.recentlyConnected=!1,this.enterKeydownOn=null,this.handleSlottableRequest=e=>{},this.applyFocusElementLabel=(e,o)=>{this.appliedLabel=e,this.labelAlignment=o.sideAligned?"inline":void 0},this.handleKeydown=e=>{this.focused=!0,!(e.code!=="ArrowDown"&&e.code!=="ArrowUp")&&(e.stopPropagation(),e.preventDefault(),this.toggle(!0))},this.renderAngleIcon=()=>q(),this.renderAlertIcon=()=>S(),this.handleEnterKeydown=e=>{if(e.code==="Enter"){if(this.enterKeydownOn){e.preventDefault();return}this.enterKeydownOn=e.target,this.addEventListener("keyup",o=>{o.code==="Enter"&&(this.enterKeydownOn=null)},{once:!0})}},this.pendingStateController=new z.PendingStateController(this)}get selectedItem(){return this._selectedItem}get selectedItemContent(){return this._selectedItemContent||{icon:[],content:[]}}get selfManageFocusElement(){return this._selfManageFocusElement}get menuItems(){return this.optionsMenu.childItems}set selectedItem(e){const o=e==null?void 0:e.querySelector('[slot="icon"]');if(this.selectedItemContent=e?e.itemChildren:void 0,e===this.selectedItem)return;const t=this.selectedItem;this._selectedItem=e,this._selectedItemIcon=(o==null?void 0:o.icon)??void 0,this.requestUpdate("selectedItem",t)}get focusElement(){return this.open?this.optionsMenu:this.button}forceFocusVisible(){this.disabled||(this.focused=!0)}click(){this.disabled||this.toggle()}handleButtonBlur(){this.focused=!1}focus(e){super.focus(e),!this.disabled&&this.focusElement&&(this.focused=this.hasVisibleFocusInTree())}handleHelperFocus(){this.focused=!0,this.button.focus()}handleChange(e){this.strategy&&(this.strategy.preventNextToggle="no");const o=e.target,[t]=o.selectedItems;e.stopPropagation(),e.cancelable?this.setValueFromItem(t,e):(this.open=!1,this.strategy&&(this.strategy.open=!1))}handleButtonFocus(e){var o;(o=this.strategy)==null||o.handleButtonFocus(e)}toggle(e){this.readonly||this.pending||(this.open=e===void 0?!this.open:e,this.strategy&&(this.strategy.open=this.open),this._selfManageFocusElement=this.open)}close(){this.readonly||this.strategy&&(this.open=!1,this.strategy.open=!1)}bindEvents(){var e,o;(e=this.strategy)==null||e.abort(),this.strategy=new p.strategies.desktop(this.button,this),(o=this.strategy)!=null&&o.overlay&&(this.strategy.overlay.type="auto",this.strategy.overlay.placement=this.placement)}connectedCallback(){super.connectedCallback(),this.recentlyConnected=this.hasUpdated}disconnectedCallback(){var e;this.close(),(e=this.strategy)==null||e.releaseDescription(),super.disconnectedCallback()}async setValueFromItem(e,o){this.open=!1,this.strategy&&(this.strategy.open=!1);const t=this.selectedItem,a=this.value;if(this.selectedItem=e,this.value=(e==null?void 0:e.value)??"",await this.updateComplete,!this.dispatchEvent(new CustomEvent("change",{bubbles:!0,cancelable:!0,composed:!0,detail:this.value}))&&this.selects){o&&o.preventDefault(),this.setMenuItemSelected(this.selectedItem,!1),t&&this.setMenuItemSelected(t,!0),this.selectedItem=t,this.value=a,this.open=!0,this.strategy&&(this.strategy.open=!0);return}else if(!this.selects){this.selectedItem=t,this.value=a;return}t&&this.setMenuItemSelected(t,!1),this.setMenuItemSelected(e,!!this.selects)}setMenuItemSelected(e,o){this.selects!=null&&(e.selected=o)}get containerStyles(){return this.isMobile.matches?{"--swc-menu-width":"100%"}:{}}set selectedItemContent(e){if(e===this.selectedItemContent)return;const o=this.selectedItemContent;this._selectedItemContent=e,this.requestUpdate("selectedItemContent",o)}handleTooltipSlotchange(e){this.tooltipEl=e.target.assignedElements()[0]}renderLabelContent(e){return this.value&&this.selectedItem?e:r.x`
|
|
27
27
|
<slot name="label" id="label">
|
|
28
28
|
<span aria-hidden=${d.o(this.appliedLabel?void 0:"true")}>
|
|
29
29
|
${this.label}
|
|
@@ -85,7 +85,7 @@
|
|
|
85
85
|
${this.buttonContent}
|
|
86
86
|
</button>
|
|
87
87
|
${this.renderMenu} ${this.renderDescriptionSlot}
|
|
88
|
-
`}update(e){var o,t;this.selects&&(this.selects="single"),e.has("disabled")&&this.disabled&&this.strategy&&(this.open=!1,this.strategy.open=!1),e.has("pending")&&this.pending&&this.strategy&&(this.open=!1,this.strategy.open=!1),e.has("value")&&this.shouldScheduleManageSelection(),this.hasUpdated||(this.deprecatedMenu=this.querySelector(":scope > luzmo-menu"),(o=this.deprecatedMenu)==null||o.toggleAttribute("ignore",!0),(t=this.deprecatedMenu)==null||t.setAttribute("selects","inherit")),super.update(e)}bindButtonKeydownListener(){this.button.addEventListener("keydown",this.handleKeydown)}updated(e){super.updated(e),e.has("open")&&(this.strategy.open=this.open)}firstUpdated(e){super.firstUpdated(e),this.bindButtonKeydownListener(),this.bindEvents()}get dismissHelper(){return r.x`
|
|
88
|
+
`}update(e){var o,t;this.selects&&(this.selects="single"),e.has("disabled")&&this.disabled&&this.strategy&&(this.open=!1,this.strategy.open=!1),e.has("pending")&&this.pending&&this.strategy&&(this.open=!1,this.strategy.open=!1),e.has("value")&&this.shouldScheduleManageSelection(),this.hasUpdated||(this.deprecatedMenu=this.querySelector(":scope > luzmo-menu"),(o=this.deprecatedMenu)==null||o.toggleAttribute("ignore",!0),(t=this.deprecatedMenu)==null||t.setAttribute("selects","inherit")),super.update(e)}bindButtonKeydownListener(){this.button.addEventListener("keydown",this.handleKeydown)}updated(e){var o;super.updated(e),e.has("open")&&(this.strategy.open=this.open),(o=this.strategy)!=null&&o.overlay&&this.strategy.overlay.type!=="auto"&&(this.strategy.overlay.type="auto",this.strategy.overlay.placement=this.placement)}firstUpdated(e){super.firstUpdated(e),this.bindButtonKeydownListener(),this.bindEvents()}get dismissHelper(){return r.x`
|
|
89
89
|
<div class="visually-hidden">
|
|
90
90
|
<button
|
|
91
91
|
tabindex="-1"
|