@trimble-oss/moduswebcomponents
Version:
Modus Web Components is a modern, accessible UI library built with Stencil JS that provides reusable web components following Trimble's Modus design system. This updated version focuses on improved flexibility, enhanced theming options, comprehensive cust
1 lines • 23.3 kB
JavaScript
import{h as s,r as a,d as t,F as o,e as i,g as c}from"./p-C1-Dpkp7.js";import{S as d}from"./p-CWDD4hEM.js";import{h as e}from"./p-tWS3Egrk.js";import{i as n,b as r}from"./p-DJ2rBB6r.js";const l=({className:a})=>s("svg",{fill:"none",viewBox:"0 0 887 982",class:a||"",xmlns:"http://www.w3.org/2000/svg"},s("defs",null,s("radialGradient",{id:"gradient",cx:"18%",cy:"18%",r:"70%"},s("stop",{offset:"0%","stop-color":"#FF00FF"}),s("stop",{offset:"50%","stop-color":"#9933FF"}),s("stop",{offset:"100%","stop-color":"#0066CC"}))),s("path",{d:"m36.76 749.83v231.56l201.3-116.22c-77.25-16.64-147.52-56.92-201.3-115.34zm199.83-634.65-199.83-115.18v230.14c56.05-60.9 128.22-99.28 199.83-114.97m403.73 374.35c0-176.82-143.34-320.16-320.16-320.16s-320.17 143.33-320.17 320.16 143.34 320.16 320.16 320.16 320.16-143.34 320.16-320.16m45.08-114.58c23.68 75.15 23.76 156.75-.59 232.74l201.86-116.54c-9.54-5.51-189.55-109.44-201.26-116.2",fill:"#fff"}),s("path",{d:"m320.13 489.53c0 142.28 115.34 257.62 257.62 257.62s257.62-115.34 257.62-257.62-115.34-257.62-257.62-257.62-257.62 115.34-257.62 257.62",fill:"url(#gradient)",transform:"translate(-256, 0)"})),u=({className:a})=>s("svg",{fill:"none",viewBox:"0 0 887 982",class:a||"",xmlns:"http://www.w3.org/2000/svg"},s("defs",null,s("linearGradient",{id:"gradient",x1:"0%",y1:"0%",x2:"100%",y2:"100%"},s("stop",{offset:"20%","stop-color":"#FF00FF"}),s("stop",{offset:"60%","stop-color":"#0066CC"}),s("stop",{offset:"100%","stop-color":"#0066CC"}))),s("path",{d:"m36.76 749.83v231.56l201.3-116.22c-77.25-16.64-147.52-56.92-201.3-115.34z",fill:"#0066CC"}),s("path",{d:"m236.59 115.18-199.83-115.18v230.14c56.05-60.9 128.22-99.28 199.83-114.97z",fill:"#FF00FF"}),s("path",{d:"m685.40 374.91c23.68 75.15 23.76 156.75-.59 232.74l201.86-116.54c-9.54-5.51-189.55-109.44-201.26-116.2z",fill:"#0066CC"}),s("path",{d:"m577.75 489.53c0 142.28-115.34 257.62-257.62 257.62s-257.62-115.34-257.62-257.62 115.34-257.62 257.63-257.62 257.62 115.34 257.62 257.62m62.57-.44c0-176.82-143.34-320.16-320.16-320.16s-320.17 143.33-320.17 320.16 143.34 320.16 320.16 320.16 320.16-143.34 320.16-320.16",fill:"url(#gradient)"})),m=({className:a})=>s("svg",{xmlns:"http://www.w3.org/2000/svg",fill:"currentColor",class:`mi-solid mi-apps ${a||""}`,viewBox:"0 0 24 24"},s("path",{d:"M5 8h2c.6 0 1-.4 1-1V5c0-.6-.4-1-1-1H5c-.6 0-1 .4-1 1v2c0 .6.4 1 1 1m6 12h2c.6 0 1-.4 1-1v-2c0-.6-.4-1-1-1h-2c-.6 0-1 .4-1 1v2c0 .6.4 1 1 1m-6 0h2c.6 0 1-.4 1-1v-2c0-.6-.4-1-1-1H5c-.6 0-1 .4-1 1v2c0 .6.4 1 1 1m0-6h2c.6 0 1-.4 1-1v-2c0-.6-.4-1-1-1H5c-.6 0-1 .4-1 1v2c0 .6.4 1 1 1m6 0h2c.6 0 1-.4 1-1v-2c0-.6-.4-1-1-1h-2c-.6 0-1 .4-1 1v2c0 .6.4 1 1 1m5-9v2c0 .6.4 1 1 1h2c.6 0 1-.4 1-1V5c0-.6-.4-1-1-1h-2c-.6 0-1 .4-1 1m-5 3h2c.6 0 1-.4 1-1V5c0-.6-.4-1-1-1h-2c-.6 0-1 .4-1 1v2c0 .6.4 1 1 1m6 6h2c.6 0 1-.4 1-1v-2c0-.6-.4-1-1-1h-2c-.6 0-1 .4-1 1v2c0 .6.4 1 1 1m0 6h2c.6 0 1-.4 1-1v-2c0-.6-.4-1-1-1h-2c-.6 0-1 .4-1 1v2c0 .6.4 1 1 1"})),h=({className:a})=>s("svg",{xmlns:"http://www.w3.org/2000/svg",fill:"currentColor",class:`mi-solid mi-help ${a||""}`,viewBox:"0 0 24 24"},s("path",{d:"M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2m0 16.25a1.25 1.25 0 1 1 0-2.5 1.25 1.25 0 0 1 0 2.5m2.82-6.72-.77.79c-.42.43-.69.78-.83 1.34-.07.28-.1.58-.1.92v.25H10.9v-.68c0-.41.07-.81.2-1.21.18-.52.48-1.01.87-1.4l1.07-1.09c.35-.33.49-.81.4-1.32-.09-.52-.5-.97-1.01-1.12a1.467 1.467 0 0 0-1.81.93c-.14.44-.51.73-.94.73h-.26c-.31 0-.59-.14-.78-.39s-.25-.58-.16-.89a3.72 3.72 0 0 1 2.97-2.61c.17-.03.34-.04.51-.04 1.15 0 2.3.63 3.06 1.68 1.13 1.57.72 3.19-.19 4.1Z"})),b=({className:a})=>s("svg",{xmlns:"http://www.w3.org/2000/svg",fill:"currentColor",class:`mi-solid mi-menu ${a||""}`,viewBox:"0 0 24 24"},s("path",{d:"M4 18h16c.55 0 1-.45 1-1s-.45-1-1-1H4c-.55 0-1 .45-1 1s.45 1 1 1m0-5h16c.55 0 1-.45 1-1s-.45-1-1-1H4c-.55 0-1 .45-1 1s.45 1 1 1M3 7c0 .55.45 1 1 1h16c.55 0 1-.45 1-1s-.45-1-1-1H4c-.55 0-1 .45-1 1"})),v=({className:a})=>s("svg",{xmlns:"http://www.w3.org/2000/svg",fill:"currentColor",class:`mi-solid mi-more-vertical ${a||""}`,viewBox:"0 0 24 24"},s("path",{d:"M10.59 10.59c-.78.78-.78 2.05 0 2.83s2.05.78 2.83 0 .78-2.05 0-2.83-2.05-.78-2.83 0m0-7c-.78.78-.78 2.05 0 2.83s2.05.78 2.83 0 .78-2.05 0-2.83-2.05-.78-2.83 0m0 14c-.78.78-.78 2.05 0 2.83s2.05.78 2.83 0 .78-2.05 0-2.83-2.05-.78-2.83 0"})),w=({className:a})=>s("svg",{xmlns:"http://www.w3.org/2000/svg",fill:"currentColor",class:`mi-solid mi-notifications ${a||""}`,viewBox:"0 0 24 24"},s("path",{d:"M10 20h4c0 1.1-.9 2-2 2s-2-.9-2-2m9.67-2.69C18.36 15.96 17 13.66 17 10a5 5 0 0 0-4-4.9V4c0-.55-.45-1-1-1s-1 .45-1 1v1.1A5 5 0 0 0 7 10c0 3.66-1.37 5.96-2.67 7.31-.61.64-.16 1.69.72 1.69h13.91c.88 0 1.33-1.05.72-1.69Z"})),f=class{constructor(s){a(this,s),this.aiClick=t(this,"aiClick",7),this.appsClick=t(this,"appsClick",7),this.appsMenuOpenChange=t(this,"appsMenuOpenChange",7),this.condensedMenuOpenChange=t(this,"condensedMenuOpenChange",7),this.helpClick=t(this,"helpClick",7),this.mainMenuOpenChange=t(this,"mainMenuOpenChange",7),this.myTrimbleClick=t(this,"myTrimbleClick",7),this.notificationsClick=t(this,"notificationsClick",7),this.notificationsMenuOpenChange=t(this,"notificationsMenuOpenChange",7),this.searchChange=t(this,"searchChange",7),this.searchClick=t(this,"searchClick",7),this.searchInputOpenChange=t(this,"searchInputOpenChange",7),this.signOutClick=t(this,"signOutClick",7),this.trimbleLogoClick=t(this,"trimbleLogoClick",7),this.userMenuOpenChange=t(this,"userMenuOpenChange",7),this.inheritedAttributes={},this.searchDebounceTimer=null,this.logoName="trimble",this.appsMenuOpen=!1,this.condensed=!1,this.condensedMenuOpen=!1,this.customClass="",this.mainMenuOpen=!1,this.notificationsMenuOpen=!1,this.searchDebounceMs=300,this.searchInputOpen=!1,this.userMenuOpen=!1,this.visibility={ai:!1,apps:!1,help:!1,logo:!0,mainMenu:!1,notifications:!1,search:!1,searchInput:!1,user:!0},this.isLight=!0,this.searchValue="",this.themeObserver=null,this.handleAiClick=s=>{this.aiClick.emit(null==s?void 0:s.detail)},this.handleAppsClick=s=>{this.toggleApps(),this.appsClick.emit(null==s?void 0:s.detail)},this.handleHelpClick=s=>{this.condensed&&this.toggleCondensedMenu(),this.helpClick.emit(null==s?void 0:s.detail)},this.handleMyTrimbleClick=s=>{this.myTrimbleClick.emit(s.detail)},this.handleNotificationsClick=s=>{this.toggleNotifications(),this.notificationsClick.emit(null==s?void 0:s.detail)},this.handleSearchChange=s=>{this.searchValue=s.target.value,null!==this.searchDebounceTimer&&window.clearTimeout(this.searchDebounceTimer),this.searchDebounceTimer=window.setTimeout((()=>{this.searchChange.emit({value:this.searchValue}),this.searchDebounceTimer=null}),this.searchDebounceMs)},this.handleSearchClick=s=>{this.toggleSearch(),this.searchClick.emit(null==s?void 0:s.detail)},this.handleSignOutClick=s=>{this.signOutClick.emit(s.detail)},this.handleTrimbleLogoClick=s=>{this.trimbleLogoClick.emit(s.detail)},this.toggleApps=()=>{this.condensed?this.toggleCondensedMenu():(this.appsMenuOpen=!this.appsMenuOpen,this.appsMenuOpenChange.emit(this.appsMenuOpen))},this.toggleCondensedMenu=()=>{this.condensedMenuOpen=!this.condensedMenuOpen,this.condensedMenuOpenChange.emit(this.condensedMenuOpen)},this.toggleMainMenu=()=>{this.mainMenuOpen=!this.mainMenuOpen,this.mainMenuOpenChange.emit(this.mainMenuOpen)},this.toggleNotifications=()=>{this.condensed?this.toggleCondensedMenu():(this.notificationsMenuOpen=!this.notificationsMenuOpen,this.notificationsMenuOpenChange.emit(this.notificationsMenuOpen))},this.toggleSearch=()=>{this.condensed?this.toggleCondensedMenu():(this.searchInputOpen=!this.searchInputOpen,this.searchInputOpenChange.emit(this.searchInputOpen))},this.toggleUser=()=>{this.userMenuOpen=!this.userMenuOpen,this.userMenuOpenChange.emit(this.userMenuOpen)}}componentWillLoad(){e(this.el,!0),this.inheritedAttributes=n(this.el),this.isLight=r(),this.themeObserver=new MutationObserver((()=>{this.isLight=r()})),this.themeObserver.observe(document.documentElement,{attributes:!0,attributeFilter:["data-theme"]})}disconnectedCallback(){this.themeObserver&&this.themeObserver.disconnect()}handleClickOutside(s){const a=s.composedPath?s.composedPath():[s.target];if(this.appsMenuOpen){const s=this.el.querySelector('modus-wc-button:has(svg[class*="apps"])');!this.appsRef||a.includes(this.appsRef)||a.includes(s)||(this.appsMenuOpen=!1,this.appsMenuOpenChange.emit(!1))}if(this.condensedMenuOpen){const s=this.el.querySelector('modus-wc-button:has(svg[class*="more-vertical"])');!this.condensedMenuRef||a.includes(this.condensedMenuRef)||a.includes(s)||(this.condensedMenuOpen=!1,this.condensedMenuOpenChange.emit(!1))}if(this.mainMenuOpen){const s=this.el.querySelector('modus-wc-button:has(svg[class*="menu"])');!this.menuRef||a.includes(this.menuRef)||a.includes(s)||(this.mainMenuOpen=!1)}if(this.notificationsMenuOpen){const s=this.el.querySelector('modus-wc-button:has(svg[class*="notifications"])');!this.notificationsRef||a.includes(this.notificationsRef)||a.includes(s)||(this.notificationsMenuOpen=!1,this.notificationsMenuOpenChange.emit(!1))}if(this.userMenuOpen){const s=this.el.querySelector('modus-wc-button:has([class*="user-button"])');!this.userRef||a.includes(this.userRef)||a.includes(s)||(this.userMenuOpen=!1,this.userMenuOpenChange.emit(!1))}}getClasses(){const s=[""];return this.customClass&&s.push(this.customClass),s.join(" ")}render(){var a,t,c,e,n,r,f,p,g,k,y,C,x,z,B,M,F,S,O,H,N,I,q,$,j,A,D,V,W,_,E,G;const L=(null===(a=this.visibility)||void 0===a?void 0:a.apps)||(null===(t=this.visibility)||void 0===t?void 0:t.help)||(null===(c=this.visibility)||void 0===c?void 0:c.notifications)||(null===(e=this.visibility)||void 0===e?void 0:e.search),T=(this.logoName||"trimble").replace(/_/g," ").replace(/\b\w/g,(s=>s.toUpperCase()));return s(i,Object.assign({key:"e81f467845ddc84ac97f9908e528f78b074bfcc7",class:this.getClasses()},this.inheritedAttributes),s("modus-wc-toolbar",{key:"b836e825f1a421a904cd255c21a866b63f06a534"},s("div",{key:"f1312556025e22b9641f8ff357780398c0733f90",slot:"start"},(null===(n=this.visibility)||void 0===n?void 0:n.mainMenu)&&s(o,{key:"ec1570f643480a6ffb0d9dbd1c56387cfaf202b9"},s("modus-wc-button",{key:"c985fe5086389a1dc2376457afc25e6c7f0bfa5b","aria-label":"Main menu",onButtonClick:this.toggleMainMenu,shape:"square",size:"sm",variant:"borderless"},s(b,{key:"347c61f45af84ba3ab5c7a04cd2d73fe9fe26fac"})),s("div",{key:"7afb4640067c471a4fa02fdb575cf4ea4a84953c",class:"main-menu "+(this.mainMenuOpen?"visible":"hidden"),ref:s=>this.menuRef=s},s("slot",{key:"46d003bb728709509fc91a6b335725aa7118c147",name:"main-menu"}))),!1!==(null===(r=this.visibility)||void 0===r?void 0:r.logo)&&s("modus-wc-button",{key:"154668b70de6374fa1ed2b49c403a73201cb1ccb","aria-label":`${T} logo`,customClass:"logo",onButtonClick:this.handleTrimbleLogoClick,size:"sm",variant:"borderless"},s("modus-wc-logo",{key:"04d0698487bc0cbab4a09f374e2f876b14e814d5",name:this.logoName||"trimble",emblem:this.condensed})),s("slot",{key:"eeb4d543099ad290682a7e296a17d82a0a003206",name:"start"})),s("div",{key:"6f67ce5b7b8b5215a129f1f42ddd9e6809c4ebdc",slot:"center"},s("slot",{key:"a1de68e359bdcb9143e0109963d0b90751731df5",name:"center"})),s("div",{key:"635248595c88f5e6fe1b5f031637659dcd238ffd",slot:"end"},s("slot",{key:"c8e1bc7c4344afd043c2282ca32e78bce568c4fc",name:"end"}),(null===(f=this.visibility)||void 0===f?void 0:f.ai)&&s(o,{key:"5e33ba5bd1ad26e2dc9537a86067ad03a6cc822e"},s("modus-wc-button",{key:"07583d6e2a30751d2ae89d05e66d3a8ff6902e19","aria-label":"AI assistant",customClass:"ai",onButtonClick:this.handleAiClick,shape:"square",size:"sm",variant:"borderless"},s(this.isLight?u:l,null))),this.condensed&&L&&s(o,{key:"437ef0161ba970b54c356dcae82a78a5e2ef28c2"},s("modus-wc-button",{key:"e4b09cb33712238b6a8c2b723218759885c8b148","aria-label":"More options",onButtonClick:this.toggleCondensedMenu,shape:"square",size:"sm",variant:"borderless"},s(v,{key:"008ce9ba5c986ab3d6e75a89d63ad6321e8879ab"})),this.condensedMenuOpen&&s("modus-wc-menu",{key:"2d0c66cd41a4da0d6ac765426a61c7575d3c389c",bordered:!0,customClass:"condense-menu",ref:s=>this.condensedMenuRef=s},(null===(p=this.visibility)||void 0===p?void 0:p.search)&&s("modus-wc-menu-item",{key:"74f68a7497f8b6e40d7bd40ab92997a742720b07",label:(null===(g=this.textOverrides)||void 0===g?void 0:g.search)||"Search",onItemSelect:()=>this.handleSearchClick(),value:"search"}),(null===(k=this.visibility)||void 0===k?void 0:k.notifications)&&s("modus-wc-menu-item",{key:"6a2e56c6f19f3ea82203513629677a182282750f",label:(null===(y=this.textOverrides)||void 0===y?void 0:y.notifications)||"Notifications",onItemSelect:()=>this.handleNotificationsClick(),value:"notifications"}),(null===(C=this.visibility)||void 0===C?void 0:C.help)&&s("modus-wc-menu-item",{key:"e9051aac6fce54d2c90d8ddc0ee0417acd8974a1",label:(null===(x=this.textOverrides)||void 0===x?void 0:x.help)||"Help",onItemSelect:()=>this.handleHelpClick(),value:"help"}),(null===(z=this.visibility)||void 0===z?void 0:z.apps)&&s("modus-wc-menu-item",{key:"773d5f69712f04c0524e2ee1f0b896b5cacd21b3",label:(null===(B=this.textOverrides)||void 0===B?void 0:B.apps)||"Apps",onItemSelect:()=>this.handleAppsClick(),value:"apps"}))),(null===(M=this.visibility)||void 0===M?void 0:M.search)&&!this.condensed&&s(o,{key:"20020d8e2e25656783fd7f49ab9698b89b7de259"},(null===(F=this.visibility)||void 0===F?void 0:F.searchInput)&&this.searchInputOpen&&s("modus-wc-text-input",{key:"241f34ea342e56aed23a756e9527d28a3da8bb9a",includeClear:!0,includeSearch:!0,onInputChange:this.handleSearchChange,placeholder:(null===(S=this.textOverrides)||void 0===S?void 0:S.search)||"Search",size:"sm",value:this.searchValue}),s("modus-wc-button",{key:"5188fae659139e93c8243077ebcacf2577bd9650","aria-label":"Search",onButtonClick:this.handleSearchClick,shape:"square",size:"sm",variant:"borderless"},s(d,{key:"43fb1aa77be0a6ff7afef683c91284e447f9f10b"}))),(null===(O=this.visibility)||void 0===O?void 0:O.notifications)&&!this.condensed&&s(o,{key:"e6ac6a0886dc45caaf84f4ab53b1a2f2a1c44fae"},s("modus-wc-button",{key:"01cf7828a1e3f27fb02d748c4e2e2e40dd7d4c4d","aria-label":"Notifications",onButtonClick:this.handleNotificationsClick,shape:"square",size:"sm",variant:"borderless"},s(w,{key:"dcbedae55b5fb8fe8692f274042dffc23e72955b"})),s("div",{key:"7a159088c769d7da43c01a651114f8ed9215a9c5",class:"notifications "+(this.notificationsMenuOpen?"visible":"hidden"),ref:s=>this.notificationsRef=s},s("slot",{key:"962fb3e181cde3225dcc6793eaa36866056a13e7",name:"notifications"}))),(null===(H=this.visibility)||void 0===H?void 0:H.help)&&!this.condensed&&s("modus-wc-button",{key:"94753c3f8d33799e220929416d56882dc1436804","aria-label":"Help",onButtonClick:this.handleHelpClick,shape:"square",size:"sm",variant:"borderless"},s(h,{key:"de1d069ba4a1b3054834ac5c92a6dbe63bc1e863"})),(null===(N=this.visibility)||void 0===N?void 0:N.apps)&&!this.condensed&&s(o,{key:"975e23d359d121a788832634117946349039eb95"},s("modus-wc-button",{key:"1945d9f7f03e533c2fa665b4e7016fac68124433","aria-label":"Apps",onButtonClick:this.handleAppsClick,shape:"square",size:"sm",variant:"borderless"},s(m,{key:"1487f7476f97e81f44bc4f370cbacca0dcc8aaff"})),s("div",{key:"b0256c9f9c4019311c27be45c35534db09e10908",class:"apps "+(this.appsMenuOpen?"visible":"hidden"),ref:s=>this.appsRef=s},s("slot",{key:"cc91173aeb1525d575a0d3379a8382255b7d9f2d",name:"apps"}))),(null===(I=this.visibility)||void 0===I?void 0:I.user)&&s(o,{key:"aa83fa21c303d6545b1d700cc806f11083695efe"},s("modus-wc-button",{key:"33bf39ee23b2b2a6b3cd8754e6876339259a5e57","aria-label":"User profile",customClass:"user-button",onButtonClick:this.toggleUser,shape:"circle",size:"sm",variant:"borderless"},s("modus-wc-avatar",{key:"59349dc27c1e63722a7189cb1342ad886aaed64e",alt:(null===(q=this.userCard)||void 0===q?void 0:q.avatarAlt)||"",imgSrc:null===($=this.userCard)||void 0===$?void 0:$.avatarSrc,initials:null===(j=this.userCard)||void 0===j?void 0:j.name,size:"sm"})),s("div",{key:"aab22a1c5fcf48f16adfb0824203b330152dd82a",class:"user "+(this.userMenuOpen?"visible":"hidden"),ref:s=>this.userRef=s},s("modus-wc-card",{key:"11512df6848be43401511f79755d7b1ae7119c5f"},s("div",{key:"6d6a71ac40873635514d1baa7ef277b8df96878a",slot:"header"},s("modus-wc-avatar",{key:"71a3557df932a621c224750f87d833c82827c68a",alt:(null===(A=this.userCard)||void 0===A?void 0:A.avatarAlt)||"",imgSrc:null===(D=this.userCard)||void 0===D?void 0:D.avatarSrc,initials:null===(V=this.userCard)||void 0===V?void 0:V.name})),s("div",{key:"205438bf73e4b5ff9ce3680bb72d46c8f730a6f7",slot:"title"},null===(W=this.userCard)||void 0===W?void 0:W.name),s("div",{key:"c27c716bf06c53e8c4ed9e6868d80d7e16c3b710"},null===(_=this.userCard)||void 0===_?void 0:_.email),s("div",{key:"7e8e9badd060aae7a7df1e357f0fc14a700f6722",slot:"actions"},s("modus-wc-button",{key:"b61dab000c40e0e3d61173fc83f3ab598c43a4db",customClass:"my-trimble",onButtonClick:this.handleMyTrimbleClick},(null===(E=this.userCard)||void 0===E?void 0:E.myTrimbleButton)||"Access MyTrimble")),s("div",{key:"14c9dc321797f334d9f6ca74ea6ae3338269f113",slot:"footer"},s("modus-wc-button",{key:"557972195a711f34bfb985e5ac2d7c9e3b51c08e",customClass:"sign-out",onButtonClick:this.handleSignOutClick,variant:"borderless"},(null===(G=this.userCard)||void 0===G?void 0:G.signOutButton)||"Sign out"))))))))}get el(){return c(this)}};f.style="modus-wc-navbar .modus-wc-navbar{background-color:var(--modus-wc-color-base-page);border-radius:0;box-shadow:none;height:56px;min-height:0;padding:0 var(--modus-wc-spacing-md)}modus-wc-navbar .modus-wc-navbar modus-wc-button{display:inline-flex}modus-wc-navbar .modus-wc-navbar modus-wc-button svg{height:24px}modus-wc-navbar .modus-wc-navbar:not(.logo) .modus-wc-btn.modus-wc-btn-borderless.modus-wc-btn-primary{background:var(--modus-wc-color-base-100);border:0;box-shadow:none;color:var(--modus-wc-color-base-content)}modus-wc-navbar .modus-wc-navbar .modus-wc-btn.modus-wc-btn-borderless.modus-wc-btn-primary.logo{background:transparent}modus-wc-navbar .modus-wc-navbar [slot=end] .user,modus-wc-navbar .modus-wc-navbar [slot=end] .apps,modus-wc-navbar .modus-wc-navbar [slot=end] .notifications,modus-wc-navbar .modus-wc-navbar [slot=end] modus-wc-menu,modus-wc-navbar .modus-wc-navbar [slot=start] .main-menu{position:absolute;top:45px;z-index:99}modus-wc-navbar .modus-wc-navbar [slot=end] .hidden.user,modus-wc-navbar .modus-wc-navbar [slot=end] .hidden.apps,modus-wc-navbar .modus-wc-navbar [slot=end] .hidden.notifications,modus-wc-navbar .modus-wc-navbar [slot=end] modus-wc-menu.hidden,modus-wc-navbar .modus-wc-navbar [slot=start] .hidden.main-menu{display:none}modus-wc-navbar .modus-wc-navbar [slot=end] .visible.user,modus-wc-navbar .modus-wc-navbar [slot=end] .visible.apps,modus-wc-navbar .modus-wc-navbar [slot=end] .visible.notifications,modus-wc-navbar .modus-wc-navbar [slot=end] modus-wc-menu.visible,modus-wc-navbar .modus-wc-navbar [slot=start] .visible.main-menu{display:block}modus-wc-navbar .modus-wc-navbar [slot=end],modus-wc-navbar .modus-wc-navbar [slot=center],modus-wc-navbar .modus-wc-navbar [slot=start]{align-items:center;display:flex;position:relative}modus-wc-navbar .modus-wc-navbar [slot=start] modus-wc-button{padding-inline-end:var(--modus-wc-spacing-sm);padding-inline-start:var(--modus-wc-spacing-xs)}modus-wc-navbar .modus-wc-navbar [slot=start] .main-menu{height:calc(100dvh - 56px);left:calc(-1 * var(--modus-wc-spacing-md));min-width:256px}modus-wc-navbar .modus-wc-navbar [slot=start] .logo.modus-wc-btn.modus-wc-btn-borderless.modus-wc-btn-primary{padding:0}modus-wc-navbar .modus-wc-navbar [slot=start] .logo.modus-wc-btn.modus-wc-btn-borderless.modus-wc-btn-primary .modus-wc-logo svg{height:32px;max-width:260px}modus-wc-navbar .modus-wc-navbar [slot=end] modus-wc-button,modus-wc-navbar .modus-wc-navbar [slot=end] modus-wc-text-input{padding-inline-start:var(--modus-wc-spacing-sm)}modus-wc-navbar .modus-wc-navbar [slot=end] button.ai svg{padding:3px 0 3px 3px}modus-wc-navbar .modus-wc-navbar [slot=end] modus-wc-menu{right:var(--modus-wc-spacing-2xl);z-index:99}modus-wc-navbar .modus-wc-navbar [slot=end] .notifications{right:100px}modus-wc-navbar .modus-wc-navbar [slot=end] .apps{right:var(--modus-wc-spacing-2xl)}modus-wc-navbar .modus-wc-navbar [slot=end] .user{right:0}modus-wc-navbar .modus-wc-navbar [slot=end] .user modus-wc-card article.modus-wc-card{align-items:center;padding:var(--modus-wc-spacing-xl);width:max-content}modus-wc-navbar .modus-wc-navbar [slot=end] .user modus-wc-card article.modus-wc-card .initials{background-color:var(--modus-wc-color-black);border-radius:50%;color:var(--modus-wc-color-white);font-weight:var(--modus-wc-font-weight-semibold);padding:var(--modus-wc-spacing-sm)}modus-wc-navbar .modus-wc-navbar [slot=end] .user modus-wc-card article.modus-wc-card .modus-wc-card-body{align-items:center}modus-wc-navbar .modus-wc-navbar [slot=end] .user modus-wc-card article.modus-wc-card modus-wc-button{padding:0}modus-wc-navbar .modus-wc-navbar [slot=end] .user modus-wc-card article.modus-wc-card .sign-out.modus-wc-btn.modus-wc-btn-borderless.modus-wc-btn-primary{color:var(--modus-wc-color-primary)}modus-wc-navbar .modus-wc-navbar [slot=end] .user-button.modus-wc-btn.modus-wc-btn-borderless.modus-wc-btn-primary{background-color:var(--modus-wc-color-black);color:var(--modus-wc-color-white)}[data-theme=modus-modern-light] modus-wc-navbar .modus-wc-navbar{background-size:cover}[data-theme=modus-modern-dark] modus-wc-navbar .modus-wc-navbar{background-size:cover}[data-theme=modus-classic-light] modus-wc-navbar .modus-wc-navbar svg,[data-theme=modus-classic-dark] modus-wc-navbar .modus-wc-navbar svg{height:32px}[data-theme=modus-classic-light] modus-wc-navbar .modus-wc-navbar modus-wc-text-input .modus-wc-text-input.modus-wc-input.modus-wc-input-sm,[data-theme=modus-classic-dark] modus-wc-navbar .modus-wc-navbar modus-wc-text-input .modus-wc-text-input.modus-wc-input.modus-wc-input-sm{font-size:var(--modus-wc-font-size-md);height:var(--modus-wc-input-height-md);line-height:var(--modus-wc-line-height-md);padding:var(--modus-wc-spacing-sm)}[data-theme=modus-classic-dark] modus-wc-navbar .modus-wc-navbar{background-color:var(--modus-wc-color-gray-10)}[data-theme=modus-classic-dark] modus-wc-navbar .modus-wc-navbar:not(.logo) .modus-wc-btn.modus-wc-btn-borderless.modus-wc-btn-primary{background:transparent;color:var(--modus-wc-color-white)}[data-theme=modus-classic-dark] modus-wc-navbar .modus-wc-navbar .logo.modus-wc-btn.modus-wc-btn-borderless.modus-wc-btn-primary path{fill:var(--modus-wc-color-white)}[data-theme=modus-classic-dark] modus-wc-navbar .modus-wc-navbar .user modus-wc-card article.modus-wc-card .sign-out.modus-wc-btn.modus-wc-btn-borderless.modus-wc-btn-primary{color:var(--modus-wc-color-white)}[data-theme=connect-light] modus-wc-navbar .modus-wc-navbar,[data-theme=connect-dark] modus-wc-navbar .modus-wc-navbar{border-bottom:var(--modus-wc-border-width-xs) solid var(--modus-wc-color-base-200)}[data-theme=connect-light] modus-wc-navbar .modus-wc-navbar :not(.logo) .modus-wc-btn.modus-wc-btn-borderless.modus-wc-btn-primary,[data-theme=connect-dark] modus-wc-navbar .modus-wc-navbar :not(.logo) .modus-wc-btn.modus-wc-btn-borderless.modus-wc-btn-primary{background:transparent}";export{f as modus_wc_navbar}