@esri/calcite-components 5.1.0-next.41 → 5.1.0-next.43

package/dist/loader.js

@@ -63,9 +63,9 @@ const defineCustomElements = makeDefineCustomElements(runtime, {
   "calcite-menu": [() => import("./components/calcite-menu/customElement.js"), "label,layout,messageOverrides:;setFocus"],
   "calcite-menu-item": [() => import("./components/calcite-menu-item/customElement.js"), "active,breadcrumb,href,iconEnd,iconFlipRtl,iconStart,isTopLevelItem,label,layout,messageOverrides:,open,rel,target,text,topLevelMenuLayout;setFocus"],
   "calcite-meter": [() => import("./components/calcite-meter/customElement.js"), "appearance,disabled,fillType,form,groupSeparator,high,label,low,max,messages:,min,name,numberingSystem,rangeLabels,rangeLabelType,scale,unitLabel,value,valueLabel,valueLabelType"],
-  "calcite-navigation": [() => import("./components/calcite-navigation/customElement.js"), "label,navigationAction;setFocus"],
-  "calcite-navigation-logo": [() => import("./components/calcite-navigation-logo/customElement.js"), "active,description,heading,headingLevel,href,icon,iconFlipRtl,label,rel,target,thumbnail;setFocus"],
-  "calcite-navigation-user": [() => import("./components/calcite-navigation-user/customElement.js"), "active,fullName,label,textDisabled,thumbnail,userId,username;setFocus"],
+  "calcite-navigation": [() => import("./components/calcite-navigation/customElement.js"), "label,navigationAction,scale;setFocus"],
+  "calcite-navigation-logo": [() => import("./components/calcite-navigation-logo/customElement.js"), "active,description,heading,headingLevel,href,icon,iconFlipRtl,label,rel,scale,target,thumbnail;setFocus"],
+  "calcite-navigation-user": [() => import("./components/calcite-navigation-user/customElement.js"), "active,fullName,label,scale,textDisabled,thumbnail,userId,username;setFocus"],
   "calcite-notice": [() => import("./components/calcite-notice/customElement.js"), "appearance,closable,icon,iconFlipRtl,kind,messageOverrides:,open,scale,width;setFocus"],
   "calcite-option": [() => import("./components/calcite-option/customElement.js"), "disabled,label,selected,value"],
   "calcite-option-group": [() => import("./components/calcite-option-group/customElement.js"), "disabled,label"],

package/dist/types/lumina.d.ts

@@ -198,7 +198,7 @@ interface LuminaCalciteBlockSection extends Partial<Pick<BlockSection, "expanded
 interface LuminaCalciteButton extends Partial<Pick<Button, "alignment" | "appearance" | "disabled" | "download" | "form" | "href" | "iconEnd" | "iconFlipRtl" | "iconStart" | "kind" | "label" | "loading" | "messageOverrides" | "name" | "rel" | "round" | "scale" | "splitChild" | "target" | "type" | "width">>, h.JSX.HTMLAttributes<Button> {
 }
 
-interface LuminaCalciteCard extends Partial<Pick<Card, "disabled" | "label" | "loading" | "messageOverrides" | "selectable" | "selected" | "thumbnailPosition">>, h.JSX.HTMLAttributes<Card> {
+interface LuminaCalciteCard extends Partial<Pick<Card, "disabled" | "label" | "loading" | "messageOverrides" | "scale" | "selectable" | "selected" | "thumbnailPosition">>, h.JSX.HTMLAttributes<Card> {
   oncalciteCardSelect?: EventHandler<Card["calciteCardSelect"]>;
 }
 
@@ -413,7 +413,7 @@ interface LuminaCalciteMenuItem extends Required<Pick<MenuItem, "label">>, Parti
 interface LuminaCalciteMeter extends Required<Pick<Meter, "label">>, Partial<Pick<Meter, "appearance" | "disabled" | "fillType" | "form" | "groupSeparator" | "high" | "low" | "max" | "min" | "name" | "numberingSystem" | "rangeLabels" | "rangeLabelType" | "scale" | "unitLabel" | "value" | "valueLabel" | "valueLabelType">>, h.JSX.HTMLAttributes<Meter> {
 }
 
-interface LuminaCalciteNavigation extends Partial<Pick<Navigation, "label" | "navigationAction">>, h.JSX.HTMLAttributes<Navigation> {
+interface LuminaCalciteNavigation extends Partial<Pick<Navigation, "label" | "navigationAction" | "scale">>, h.JSX.HTMLAttributes<Navigation> {
   oncalciteNavigationActionSelect?: EventHandler<Navigation["calciteNavigationActionSelect"]>;
 }
 

package/dist/types/preact.d.ts

@@ -199,7 +199,7 @@ interface PreactCalciteBlockSection extends Partial<Pick<BlockSection, "expanded
 interface PreactCalciteButton extends Partial<Pick<Button, "alignment" | "appearance" | "disabled" | "download" | "form" | "href" | "iconEnd" | "iconFlipRtl" | "iconStart" | "kind" | "label" | "loading" | "messageOverrides" | "name" | "rel" | "round" | "scale" | "splitChild" | "target" | "type" | "width">>, HTMLAttributes<Button> {
 }
 
-interface PreactCalciteCard extends Partial<Pick<Card, "disabled" | "label" | "loading" | "messageOverrides" | "selectable" | "selected" | "thumbnailPosition">>, HTMLAttributes<Card> {
+interface PreactCalciteCard extends Partial<Pick<Card, "disabled" | "label" | "loading" | "messageOverrides" | "scale" | "selectable" | "selected" | "thumbnailPosition">>, HTMLAttributes<Card> {
   oncalciteCardSelect?: EventHandler<Card["calciteCardSelect"]>;
 }
 
@@ -414,7 +414,7 @@ interface PreactCalciteMenuItem extends Required<Pick<MenuItem, "label">>, Parti
 interface PreactCalciteMeter extends Required<Pick<Meter, "label">>, Partial<Pick<Meter, "appearance" | "disabled" | "fillType" | "form" | "groupSeparator" | "high" | "low" | "max" | "min" | "name" | "numberingSystem" | "rangeLabels" | "rangeLabelType" | "scale" | "unitLabel" | "value" | "valueLabel" | "valueLabelType">>, HTMLAttributes<Meter> {
 }
 
-interface PreactCalciteNavigation extends Partial<Pick<Navigation, "label" | "navigationAction">>, HTMLAttributes<Navigation> {
+interface PreactCalciteNavigation extends Partial<Pick<Navigation, "label" | "navigationAction" | "scale">>, HTMLAttributes<Navigation> {
   oncalciteNavigationActionSelect?: EventHandler<Navigation["calciteNavigationActionSelect"]>;
 }
 

package/dist/types/react.d.ts

@@ -199,7 +199,7 @@ interface ReactCalciteBlockSection extends Partial<Pick<BlockSection, "expanded"
 interface ReactCalciteButton extends Partial<Pick<Button, "alignment" | "appearance" | "disabled" | "download" | "form" | "href" | "iconEnd" | "iconFlipRtl" | "iconStart" | "kind" | "label" | "loading" | "messageOverrides" | "name" | "rel" | "round" | "scale" | "splitChild" | "target" | "type" | "width">>, HTMLProps<Button> {
 }
 
-interface ReactCalciteCard extends Partial<Pick<Card, "disabled" | "label" | "loading" | "messageOverrides" | "selectable" | "selected" | "thumbnailPosition">>, HTMLProps<Card> {
+interface ReactCalciteCard extends Partial<Pick<Card, "disabled" | "label" | "loading" | "messageOverrides" | "scale" | "selectable" | "selected" | "thumbnailPosition">>, HTMLProps<Card> {
   oncalciteCardSelect?: EventHandler<Card["calciteCardSelect"]>;
 }
 
@@ -414,7 +414,7 @@ interface ReactCalciteMenuItem extends Required<Pick<MenuItem, "label">>, Partia
 interface ReactCalciteMeter extends Required<Pick<Meter, "label">>, Partial<Pick<Meter, "appearance" | "disabled" | "fillType" | "form" | "groupSeparator" | "high" | "low" | "max" | "min" | "name" | "numberingSystem" | "rangeLabels" | "rangeLabelType" | "scale" | "unitLabel" | "value" | "valueLabel" | "valueLabelType">>, HTMLProps<Meter> {
 }
 
-interface ReactCalciteNavigation extends Partial<Pick<Navigation, "label" | "navigationAction">>, HTMLProps<Navigation> {
+interface ReactCalciteNavigation extends Partial<Pick<Navigation, "label" | "navigationAction" | "scale">>, HTMLProps<Navigation> {
   oncalciteNavigationActionSelect?: EventHandler<Navigation["calciteNavigationActionSelect"]>;
 }
 

package/dist/types/stencil.d.ts

@@ -199,7 +199,7 @@ interface StencilCalciteBlockSection extends Partial<Pick<BlockSection, "expande
 interface StencilCalciteButton extends Partial<Pick<Button, "alignment" | "appearance" | "disabled" | "download" | "form" | "href" | "iconEnd" | "iconFlipRtl" | "iconStart" | "kind" | "label" | "loading" | "messageOverrides" | "name" | "rel" | "round" | "scale" | "splitChild" | "target" | "type" | "width">>, StencilJsx.HTMLAttributes<Button> {
 }
 
-interface StencilCalciteCard extends Partial<Pick<Card, "disabled" | "label" | "loading" | "messageOverrides" | "selectable" | "selected" | "thumbnailPosition">>, StencilJsx.HTMLAttributes<Card> {
+interface StencilCalciteCard extends Partial<Pick<Card, "disabled" | "label" | "loading" | "messageOverrides" | "scale" | "selectable" | "selected" | "thumbnailPosition">>, StencilJsx.HTMLAttributes<Card> {
   onCalciteCardSelect?: EventHandler<Card["calciteCardSelect"]>;
 }
 
@@ -414,7 +414,7 @@ interface StencilCalciteMenuItem extends Required<Pick<MenuItem, "label">>, Part
 interface StencilCalciteMeter extends Required<Pick<Meter, "label">>, Partial<Pick<Meter, "appearance" | "disabled" | "fillType" | "form" | "groupSeparator" | "high" | "low" | "max" | "min" | "name" | "numberingSystem" | "rangeLabels" | "rangeLabelType" | "scale" | "unitLabel" | "value" | "valueLabel" | "valueLabelType">>, StencilJsx.HTMLAttributes<Meter> {
 }
 
-interface StencilCalciteNavigation extends Partial<Pick<Navigation, "label" | "navigationAction">>, StencilJsx.HTMLAttributes<Navigation> {
+interface StencilCalciteNavigation extends Partial<Pick<Navigation, "label" | "navigationAction" | "scale">>, StencilJsx.HTMLAttributes<Navigation> {
   onCalciteNavigationActionSelect?: EventHandler<Navigation["calciteNavigationActionSelect"]>;
 }
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@esri/calcite-components",
-  "version": "5.1.0-next.41",
+  "version": "5.1.0-next.43",
   "description": "Web Components for Esri's Calcite Design System.",
   "homepage": "https://developers.arcgis.com/calcite-design-system/",
   "repository": {
@@ -108,5 +108,5 @@
     "dist/docs/vscode.html-custom-data.json"
   ],
   "web-types": "dist/docs/web-types.json",
-  "gitHead": "468780de34308cfab0c96683dc5f637d5b122783"
+  "gitHead": "2e082b63a10396805813e077efdfac5d61af7a41"
 }

package/dist/cdn/GA7UTPCH.js

@@ -1,2 +0,0 @@
-/* COPYRIGHT Esri - https://js.arcgis.com/5.1/LICENSE.txt */
-import{a as m}from"./AGT4E2MR.js";import"./RGLX6ZUD.js";import{a as s}from"./5YJHDAMC.js";import{a as u}from"./I2C2U4EG.js";import"./RH6ZIP65.js";import"./RVXWIAKA.js";import"./CX6NYW6U.js";import"./CUEFJU5M.js";import"./OAOQ5BXS.js";import{G as f,H as i,J as n,S as p,g as v,h as t}from"./RBNGWGBY.js";var e={container:"container",containerLink:"container--link",textContainer:"text-container",heading:"heading",description:"description",image:"image",standalone:"standalone",icon:"icon"},x=v`:host{display:inline-flex}.container{margin:0;display:flex;align-items:center;justify-content:center;font-size:var(--calcite-font-size-relative-md);line-height:var(--calcite-font-line-height-md);background-color:var(--calcite-navigation-background-color, var(--calcite-internal-navigation-logo-background-color, var(--calcite-color-foreground-1)));border-block-end:2px solid var(--calcite-color-transparent);transition-property:background-color;transition-duration:var(--calcite-animation-timing);transition-timing-function:ease-in-out}.container--link{cursor:pointer;text-decoration-line:none;outline-color:transparent}:host(:focus) .container--link{outline:var(--calcite-border-width-md) solid var(--calcite-color-focus, var(--calcite-ui-focus-color, var(--calcite-color-brand)));outline-offset:calc(calc(-1 * var(--calcite-spacing-base)) * calc(1 - (2*clamp(0,var(--calcite-offset-invert-focus),1))))}.image,.icon{margin:0;display:flex;block-size:1.75rem;padding-inline:1rem;color:var(--calcite-navigation-logo-text-color, var(--calcite-icon-color, var(--calcite-internal-navigation-logo-text-color, var(--calcite-ui-icon-color, inherit))))}.image~.icon{padding-inline-start:0px}.image~.text-container,.icon~.text-container{padding-inline-start:0px}:host([href]:hover),:host([href]:focus){--calcite-internal-navigation-logo-background-color: var(--calcite-color-foreground-2)}:host([href]:active){--calcite-internal-navigation-logo-background-color: var(--calcite-color-foreground-3)}:host([active]) .container{border-block-end-color:var(--calcite-navigation-accent-color, var(--calcite-color-brand))}:host([active]),:host([href]:active){--calcite-internal-navigation-logo-text-color: var(--calcite-color-brand)}.text-container{margin-block-start:.125rem;display:flex;flex-direction:column;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;padding-inline:1rem;text-align:start}.heading{margin-inline-start:0px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:var(--calcite-font-size-relative-md);font-weight:var(--calcite-font-weight-medium);color:var(--calcite-navigation-logo-heading-text-color, var(--calcite-color-text-1))}.standalone{font-size:var(--calcite-font-size-relative-lg)}.description{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--calcite-color-text-2);color:var(--calcite-navigation-logo-text-color, var(--calcite-color-text-2));font-size:var(--calcite-font-size--1)}:host([hidden]){display:none}[hidden]{display:none}`,d=class extends f{constructor(){super(...arguments),this.focusSetter=u()(this),this.iconFlipRtl=!1}static{this.properties={active:[7,{},{reflect:!0,type:Boolean}],description:1,heading:1,headingLevel:[11,{},{type:Number,reflect:!0}],href:[3,{},{reflect:!0}],icon:[3,{type:String},{reflect:!0}],iconFlipRtl:[7,{},{reflect:!0,type:Boolean}],label:1,rel:[3,{},{reflect:!0}],target:[3,{},{reflect:!0}],thumbnail:1}}static{this.shadowRootOptions={mode:"open",delegatesFocus:!0}}static{this.styles=x}async setFocus(o){return this.focusSetter(()=>this.href?this.el:void 0,o)}renderIcon(){return t`<calcite-icon class=${i(e.icon)} .flipRtl=${this.iconFlipRtl} .icon=${this.icon} scale=l></calcite-icon>`}renderHeaderContent(){let{heading:o,headingLevel:a,description:r}=this,c=o?s(e.heading,m({class:{[e.heading]:!0,[e.standalone]:!this.description},level:a,children:o})):null,l=r?s(e.description,t`<span class=${i(e.description)}>${r}</span>`):null;return c||l?s(e.textContainer,t`<div class=${i(e.textContainer)}>${c}${l}</div>`):null}render(){let{icon:o,href:a,label:r,rel:c,target:l,thumbnail:g}=this,h=t`${g&&t`<img alt=${(r||"")??n} class=${i(e.image)} src=${g??n}>`||""}${o&&this.renderIcon()||""}${this.renderHeaderContent()}`;return a?t`<a class=${i({[e.container]:!0,[e.containerLink]:!0})} href=${a??n} rel=${c??n} target=${l??n}>${h}</a>`:t`<div class=${i(e.container)}>${h}</div>`}};p("calcite-navigation-logo",d);export{d as NavigationLogo};

package/dist/cdn/GPB37IZK.js

@@ -1,2 +0,0 @@
-/* COPYRIGHT Esri - https://js.arcgis.com/5.1/LICENSE.txt */
-import{a as S}from"./I2C2U4EG.js";import"./RH6ZIP65.js";import"./RVXWIAKA.js";import"./CX6NYW6U.js";import{t as n}from"./CUEFJU5M.js";import"./OAOQ5BXS.js";import{E as m,F as h,G as g,H as o,S as d,g as l,h as s,p as c}from"./RBNGWGBY.js";var a={container:"container",containerContent:"container-content",hasProgress:"progress-bar",hide:"hide",primary:"primary",secondary:"secondary",tertiary:"tertiary"},e={logo:"logo",user:"user",progress:"progress",navigationAction:"navigation-action",contentStart:"content-start",contentEnd:"content-end",contentCenter:"content-center",navSecondary:"navigation-secondary",navTertiary:"navigation-tertiary"},y={hamburger:"hamburger"},v=l`:host([hidden]){display:none}[hidden]{display:none}:host{display:block}.container{display:flex;inline-size:100%;flex-direction:column;margin-block:0;margin-inline:auto;background-color:var(--calcite-navigation-background-color, var(--calcite-navigation-background, var(--calcite-color-foreground-1)))}.container.primary,.container.secondary,.container.tertiary{border-block-end:1px solid;border-block-end-color:var(--calcite-navigation-border-color, var(--calcite-color-border-3))}.user,.logo{display:flex}.hide{display:none}.primary{block-size:4rem}.secondary,.tertiary{block-size:3rem}.container-content{margin-inline:auto;display:flex;block-size:100%;inline-size:100%;margin-block:0;inline-size:var(--calcite-navigation-width, 100%);max-inline-size:100%}.container-content.progress-bar{margin-block-start:.125rem}slot[name]{display:flex;flex-direction:row}slot[name=navigation-secondary]::slotted(calcite-navigation),slot[name=navigation-tertiary]::slotted(calcite-navigation){inline-size:100%}slot[name=content-start]::slotted(*),slot[name=content-center]::slotted(*),slot[name=content-end]::slotted(*){display:flex;flex-direction:row;align-items:center}slot[name=progress],slot[name=progress] calcite-progress{inset-block-start:0;inset-inline:0}slot[name=content-end]{margin-inline-start:auto}slot[name=content-start]{margin-inline-end:auto}slot[name=content-end],slot[name=logo]~slot[name=user],slot[name=user]:only-child{margin-inline-start:auto}slot[name=content-center]{margin-inline-start:auto;margin-inline-end:auto}slot[name=content-start]~slot[name=content-center]{margin-inline-start:0px}slot[name=content-start]~slot[name=content-end],slot[name=content-center]~slot[name=content-end],slot[name=content-center]~slot[name=user],slot[name=content-end]~slot[name=user]{margin:0}slot[name=navigation-action] calcite-action{align-self:center;margin-inline-start:var(--calcite-spacing-sm)}`,i=class extends g{constructor(){super(...arguments),this.navigationActionRef=m(),this.focusSetter=S()(this),this.navigationAction=!1,this.calciteNavigationActionSelect=c({cancelable:!1})}static{this.properties={logoSlotHasElements:[16,{},{state:!0}],navigationActionSlotHasElements:[16,{},{state:!0}],primaryContentCenterSlotHasElements:[16,{},{state:!0}],primaryContentEndSlotHasElements:[16,{},{state:!0}],primaryContentStartSlotHasElements:[16,{},{state:!0}],progressSlotHasElement:[16,{},{state:!0}],secondarySlotHasElements:[16,{},{state:!0}],tertiarySlotHasElements:[16,{},{state:!0}],userSlotHasElements:[16,{},{state:!0}],label:1,navigationAction:[7,{},{reflect:!0,type:Boolean}]}}static{this.styles=v}async setFocus(t){return this.focusSetter(()=>this.navigationActionRef.value,t)}actionClickHandler(){this.calciteNavigationActionSelect.emit()}handleUserSlotChange(t){this.isPrimaryLevel()&&(this.userSlotHasElements=n(t))}handleLogoSlotChange(t){this.isPrimaryLevel()&&(this.logoSlotHasElements=n(t))}handleContentStartSlotChange(t){this.isPrimaryLevel()&&(this.primaryContentStartSlotHasElements=n(t))}handleContentEndSlotChange(t){this.isPrimaryLevel()&&(this.primaryContentEndSlotHasElements=n(t))}handleContentCenterSlotChange(t){this.isPrimaryLevel()&&(this.primaryContentCenterSlotHasElements=n(t))}handleSecondarySlotChange(t){this.secondarySlotHasElements=n(t)}handleTertiarySlotChange(t){this.tertiarySlotHasElements=n(t)}handleMenuActionSlotChange(t){this.isPrimaryLevel()&&(this.navigationActionSlotHasElements=n(t),this.navigationActionSlotHasElements&&(this.navigationAction=!1))}handleProgressSlotChange(t){this.isPrimaryLevel()&&(this.progressSlotHasElement=n(t))}isPrimaryLevel(){return this.el.slot!==e.navSecondary&&this.el.slot!==e.navTertiary}renderMenuAction(){return s`<slot name=${e.navigationAction} @slotchange=${this.handleMenuActionSlotChange}>${this.navigationAction&&s`<calcite-action .icon=${y.hamburger} @click=${this.actionClickHandler} .text=${this.label} ${h(this.navigationActionRef)}></calcite-action>`||""}</slot>`}render(){let t=this.logoSlotHasElements||this.userSlotHasElements||this.navigationActionSlotHasElements||this.primaryContentCenterSlotHasElements||this.primaryContentEndSlotHasElements||this.primaryContentStartSlotHasElements||this.navigationAction,r=this.el.slot;return s`<div class=${o({[a.container]:!0,[a.secondary]:r===e.navSecondary,[a.tertiary]:r===e.navTertiary,[a.primary]:t})}><div class=${o({[a.hide]:!this.progressSlotHasElement,[e.progress]:!0})}><slot name=${e.progress} @slotchange=${this.handleProgressSlotChange}></slot></div><div class=${o({[a.containerContent]:!0,[a.hasProgress]:this.progressSlotHasElement})}>${this.renderMenuAction()}<div class=${o({[a.hide]:!this.logoSlotHasElements,[e.logo]:!0})}><slot name=${e.logo} @slotchange=${this.handleLogoSlotChange}></slot></div><slot name=${e.contentStart} @slotchange=${this.handleContentStartSlotChange}></slot><slot name=${e.contentCenter} @slotchange=${this.handleContentCenterSlotChange}></slot><slot name=${e.contentEnd} @slotchange=${this.handleContentEndSlotChange}></slot><div class=${o({[a.hide]:!this.userSlotHasElements,[e.user]:!0})}><slot name=${e.user} @slotchange=${this.handleUserSlotChange}></slot></div></div></div><slot name=${e.navSecondary} @slotchange=${this.handleSecondarySlotChange}></slot><slot name=${e.navTertiary} @slotchange=${this.handleTertiarySlotChange}></slot>`}};d("calcite-navigation",i);export{i as Navigation};

package/dist/cdn/TDPJ5IO7.js

@@ -1,2 +0,0 @@
-/* COPYRIGHT Esri - https://js.arcgis.com/5.1/LICENSE.txt */
-import{a as i}from"./5YJHDAMC.js";import{a as c}from"./I2C2U4EG.js";import"./RH6ZIP65.js";import"./RVXWIAKA.js";import"./CX6NYW6U.js";import"./CUEFJU5M.js";import"./OAOQ5BXS.js";import{G as n,H as a,S as l,g as r,h as e}from"./RBNGWGBY.js";var t={textContainer:"text-container",fullName:"full-name",username:"username",button:"button"},u=r`:host{display:inline-flex;outline:2px solid transparent;outline-offset:2px}:host .button{margin:0;display:flex;cursor:pointer;align-items:center;justify-content:center;font-size:var(--calcite-font-size-relative-md);line-height:var(--calcite-font-line-height-md);outline-color:transparent;transition-property:background-color,block-size,border-color,box-shadow,color,inset-block-end,inset-block-start,inset-inline-end,inset-inline-start,inset-size,opacity,outline-color,transform;transition-duration:var(--calcite-animation-timing);transition-timing-function:ease-in-out;font-family:inherit;border:none;background-color:var(--calcite-navigation-background-color, var(--calcite-internal-navigation-user-background-color, var(--calcite-color-transparent)));border-block-end:2px solid var(--calcite-color-transparent)}.text-container{margin-block-start:.125rem;display:flex;flex-direction:column;padding-inline:1rem;text-align:start}calcite-avatar{padding-inline:1rem;--calcite-avatar-corner-radius: var(--calcite-navigation-user-avatar-corner-radius);--calcite-avatar-color: var(--calcite-navigation-user-avatar-color)}calcite-avatar~.text-container{padding-inline-start:0px}.full-name{margin-inline-start:0px;font-size:var(--calcite-font-size-relative-md);font-weight:var(--calcite-font-weight-medium);color:var(--calcite-navigation-user-full-name-text-color, var(--calcite-color-text-1))}.username{font-size:var(--calcite-font-size--1);color:var(--calcite-navigation-user-name-text-color, var(--calcite-color-text-2))}:host(:hover) .button,:host(:focus) .button{--calcite-internal-navigation-user-background-color: var(--calcite-color-foreground-2)}:host(:focus) .button{outline:var(--calcite-border-width-md) solid var(--calcite-color-focus, var(--calcite-ui-focus-color, var(--calcite-color-brand)));outline-offset:calc(calc(-1 * var(--calcite-spacing-base)) * calc(1 - (2*clamp(0,var(--calcite-offset-invert-focus),1))))}:host(:active) .button{--calcite-internal-navigation-user-background-color: var(--calcite-color-foreground-3)}:host([active]) .button{border-block-end-color:var(--calcite-navigation-accent-color, var(--calcite-color-brand))}:host([hidden]){display:none}[hidden]{display:none}`,o=class extends n{constructor(){super(...arguments),this.focusSetter=c()(this),this.textDisabled=!1}static{this.properties={active:[7,{},{reflect:!0,type:Boolean}],fullName:1,label:1,textDisabled:[7,{},{reflect:!0,type:Boolean}],thumbnail:1,userId:1,username:1}}static{this.shadowRootOptions={mode:"open",delegatesFocus:!0}}static{this.styles=u}async setFocus(s){return this.focusSetter(()=>this.el,s)}render(){return e`<button .ariaLabel=${this.label} class=${a(t.button)}><calcite-avatar .fullName=${this.fullName} .label=${this.label} .thumbnail=${this.thumbnail} .userId=${this.userId} .username=${this.username}></calcite-avatar>${(this.fullName||this.username)&&!this.textDisabled&&e`<div class=${a(t.textContainer)}>${this.fullName&&i(t.fullName,e`<span class=${a(t.fullName)}>${this.fullName}</span>`)||""}${this.username&&i(t.username,e`<span class=${a(t.username)}>${this.username}</span>`)||""}</div>`||""}</button>`}};l("calcite-navigation-user",o);export{o as NavigationUser};