@trimble-oss/moduswebcomponents/modus-wc/p-bd26675c.entry.js

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

import{r as i,h as t,H as e,g as s}from"./p-dzXW86AR.js";import{i as o}from"./p-B5lx0dpl.js";const a=class{constructor(t){i(this,t),this.inheritedAttributes={},this.minWidth="4rem",this.collapseOnClickOutside=!0,this.customClass="",this.expanded=!1,this.maxWidth="256px",this.handleClickOutside=i=>{this.expanded&&this.collapseOnClickOutside&&this.navRef&&((i.composedPath?i.composedPath():[i.target]).includes(this.navRef)||(this.expanded=!1))}}componentWillLoad(){this.inheritedAttributes=o(this.el)}connectedCallback(){this.collapseOnClickOutside&&document.addEventListener("click",this.handleClickOutside,!0)}disconnectedCallback(){document.removeEventListener("click",this.handleClickOutside,!0)}getClasses(){const i=["modus-wc-side-navigation"],t=(({expanded:i})=>{let t="";return i&&(t=`${t} modus-wc-side-navigation-expanded`),t.trim()})({expanded:this.expanded});return t&&i.push(t),this.customClass&&i.push(this.customClass),i.join(" ")}render(){return t(e,{key:"ae2bb252f4337e4724ef6fb131d6e8704a2005fe"},t("nav",Object.assign({key:"4a24b5ac6bf92dd1022403655adc821f37a836e0"},this.inheritedAttributes,{class:this.getClasses(),ref:i=>this.navRef=i,style:{width:this.expanded?this.maxWidth:this.minWidth}}),t("div",{key:"6663c0731510e0797ecc24784a09fe202e687e1b",class:"side-navigation-content"},t("slot",{key:"0eea5a1c5bb3c34e0499fd3829e2284ff00b807c"}))))}get el(){return s(this)}};a.style="modus-wc-side-navigation{display:block;height:100vh;position:relative}modus-wc-side-navigation .modus-wc-side-navigation{background:var(--modus-wc-color-white);box-shadow:rgba(36, 35, 45, 0.3) 1px 0 4px;color:var(--modus-wc-color-trimble-gray);display:flex;flex-direction:column;flex-shrink:0;height:100%;max-height:100vh;min-height:0;overflow:hidden;overflow-y:auto;position:absolute;transition:width 0.2s ease-out;width:4rem;z-index:999}modus-wc-side-navigation .modus-wc-side-navigation.expanded{width:256px}modus-wc-side-navigation .side-navigation-content{background:var(--modus-wc-color-white);color:var(--modus-wc-color-trimble-gray);flex:1 1 auto}[data-theme=modus-classic-dark] modus-wc-side-navigation .side-navigation-content,[data-theme=modus-modern-dark] modus-wc-side-navigation .side-navigation-content{background:var(--modus-wc-color-gray-10);color:var(--modus-wc-color-white)}";export{a as modus_wc_side_navigation}