@paperless/core 2.0.1-beta.13 → 2.0.1-beta.2

package/dist/components/p-navbar.js

@@ -5,7 +5,7 @@ import { d as defineCustomElement$4 } from './button.component.js';
 import { d as defineCustomElement$3 } from './icon.component.js';
 import { d as defineCustomElement$2 } from './loader.component.js';
 
-const navbarComponentCss = "*{box-sizing:border-box}:host .safe-sidebar{padding-top:calc(env(safe-area-inset-top, 0) + 1rem)!important}:host .safe-sidebar.show{--tw-translate-x:env(safe-area-inset-left,0)!important}:host .safe-topbar{height:calc(env(safe-area-inset-top, 0) + 4rem);padding-top:calc(env(safe-area-inset-top, 0) + 1rem)!important}.pointer-events-none{pointer-events:none!important}.static{position:static!important}.fixed{position:fixed!important}.relative{position:relative!important}.left-0{left:0!important}.top-0{top:0!important}.z-navbar{z-index:300!important}.z-navbar-backdrop{z-index:290!important}.z-navbar-topbar{z-index:280!important}.mt-auto{margin-top:auto!important}.flex{display:flex!important}.hidden{display:none!important}.h-screen{height:100vh!important}.w-60{width:15rem!important}.w-full{width:100%!important}.max-w-\\[16\\.5rem\\]{max-width:16.5rem!important}.-translate-x-full{--tw-translate-x:-100%!important;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))!important}.transform-gpu{transform:translate3d(var(--tw-translate-x),var(--tw-translate-y),0) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))!important}.flex-col{flex-direction:column!important}.items-center{align-items:center!important}.items-stretch{align-items:stretch!important}.justify-between{justify-content:space-between!important}.gap-6{gap:1.5rem!important}.overflow-y-auto{overflow-y:auto!important}.border-0{border-width:0!important}.border-b{border-bottom-width:1px!important}.border-r{border-right-width:1px!important}.border-solid{border-style:solid!important}.border-off-white-700{--tw-border-opacity:1!important;border-color:rgb(222 219 213/var(--tw-border-opacity,1))!important}.bg-off-white-300{--tw-bg-opacity:1!important;background-color:rgb(248 247 244/var(--tw-bg-opacity,1))!important}.p-4{padding:1rem!important}.opacity-0{opacity:0!important}.opacity-100{opacity:1!important}.transition-all{transition-duration:.15s!important;transition-property:all!important;transition-timing-function:cubic-bezier(.4,0,.2,1)!important}.transition-opacity{transition-duration:.15s!important;transition-property:opacity!important;transition-timing-function:cubic-bezier(.4,0,.2,1)!important}.will-change-transform{will-change:transform!important}.max-h-screen-safe{max-height:calc(100vh - env(safe-area-inset-top) - env(safe-area-inset-bottom))!important}@media (min-width:80rem){.layout-1280\\:relative{position:relative!important}.layout-1280\\:z-0{z-index:0!important}.layout-1280\\:flex{display:flex!important}.layout-1280\\:hidden{display:none!important}.layout-1280\\:h-full{height:100%!important}.layout-1280\\:w-60{width:15rem!important}.layout-1280\\:max-w-none{max-width:none!important}.layout-1280\\:translate-x-0{--tw-translate-x:0px!important;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))!important}}@media (min-width:105rem){.layout-1680\\:w-72{width:18rem!important}}";
+const navbarComponentCss = "*{box-sizing:border-box}:host .safe-sidebar{padding-top:calc(env(safe-area-inset-top, 0) + 1rem)!important}:host .safe-sidebar.show{--tw-translate-x:env(safe-area-inset-left,0)!important}:host .safe-topbar{height:calc(env(safe-area-inset-top, 0) + 4rem);padding-top:calc(env(safe-area-inset-top, 0) + 1rem)!important}.pointer-events-none{pointer-events:none!important}.static{position:static!important}.fixed{position:fixed!important}.relative{position:relative!important}.left-0{left:0!important}.top-0{top:0!important}.z-navbar{z-index:300!important}.z-navbar-backdrop{z-index:290!important}.z-navbar-topbar{z-index:280!important}.m-0{margin:0!important}.mt-auto{margin-top:auto!important}.flex{display:flex!important}.hidden{display:none!important}.h-screen{height:100vh!important}.w-60{width:15rem!important}.w-full{width:100%!important}.max-w-\\[16\\.5rem\\]{max-width:16.5rem!important}.-translate-x-full{--tw-translate-x:-100%!important;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))!important}.transform-gpu{transform:translate3d(var(--tw-translate-x),var(--tw-translate-y),0) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))!important}.flex-col{flex-direction:column!important}.items-center{align-items:center!important}.items-stretch{align-items:stretch!important}.justify-between{justify-content:space-between!important}.gap-6{gap:1.5rem!important}.overflow-y-auto{overflow-y:auto!important}.border-0{border-width:0!important}.border-b{border-bottom-width:1px!important}.border-r{border-right-width:1px!important}.border-solid{border-style:solid!important}.border-off-white-700{--tw-border-opacity:1!important;border-color:rgb(222 219 213/var(--tw-border-opacity,1))!important}.bg-off-white-300{--tw-bg-opacity:1!important;background-color:rgb(248 247 244/var(--tw-bg-opacity,1))!important}.p-4{padding:1rem!important}.text-xl{font-size:1.25rem!important;line-height:1.75rem!important}.font-semibold{font-weight:600!important}.text-storm-dark{--tw-text-opacity:1!important;color:rgb(39 40 56/var(--tw-text-opacity,1))!important}.opacity-0{opacity:0!important}.opacity-100{opacity:1!important}.transition-all{transition-duration:.15s!important;transition-property:all!important;transition-timing-function:cubic-bezier(.4,0,.2,1)!important}.transition-opacity{transition-duration:.15s!important;transition-property:opacity!important;transition-timing-function:cubic-bezier(.4,0,.2,1)!important}.will-change-transform{will-change:transform!important}.max-h-screen-safe{max-height:calc(100vh - env(safe-area-inset-top) - env(safe-area-inset-bottom))!important}@media (min-width:80rem){.layout-1280\\:relative{position:relative!important}.layout-1280\\:z-0{z-index:0!important}.layout-1280\\:flex{display:flex!important}.layout-1280\\:hidden{display:none!important}.layout-1280\\:h-full{height:100%!important}.layout-1280\\:w-60{width:15rem!important}.layout-1280\\:max-w-none{max-width:none!important}.layout-1280\\:translate-x-0{--tw-translate-x:0px!important;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))!important}}@media (min-width:105rem){.layout-1680\\:w-72{width:18rem!important}}";
 
 const sidebarAndTopbar = cva([
   'bg-off-white-300',
@@ -51,10 +51,11 @@ const Navbar = /*@__PURE__*/ proxyCustomElement(class Navbar extends HTMLElement
     super();
     this.__registerHost();
     this.__attachShadow();
+    this.menuText = 'Menu';
     this._show = false;
   }
   render() {
-    return (h(Host, { class: 'p-navbar w-full max-h-screen-safe layout-1280:w-60 layout-1680:w-72' }, h("p-backdrop", { class: backdrop({ show: this._show }), scrollLock: this._show, onClicked: () => (this._show = false) }), h("div", { class: sidebar({ class: sidebarAndTopbar(), show: this._show }) }, h("div", { class: 'flex w-full items-center justify-between layout-1280:hidden' }, h("p-button", { variant: 'secondary', icon: 'menu-arrow', iconFlip: 'horizontal', iconOnly: true, size: 'sm', onClick: () => (this._show = false) })), h("div", { class: 'flex w-full flex-col items-stretch' }, h("slot", { name: 'company' })), h("div", { class: 'flex w-full flex-col gap-6 overflow-y-auto' }, h("slot", { name: 'content' })), h("div", { class: 'mt-auto hidden w-full flex-col layout-1280:flex' }, h("slot", { name: 'user' }))), h("div", { class: topbar({ class: sidebarAndTopbar() }) }, h("p-button", { variant: 'secondary', iconOnly: true, icon: 'menu-arrow', size: 'sm', onClick: () => (this._show = true) }), h("slot", { name: 'topbar' }))));
+    return (h(Host, { class: 'p-navbar w-full max-h-screen-safe layout-1280:w-60 layout-1680:w-72' }, h("p-backdrop", { class: backdrop({ show: this._show }), scrollLock: this._show, onClicked: () => (this._show = false) }), h("div", { class: sidebar({ class: sidebarAndTopbar(), show: this._show }) }, h("div", { class: 'flex w-full items-center justify-between layout-1280:hidden' }, h("p", { class: 'm-0 text-xl font-semibold text-storm-dark' }, this.menuText), h("p-button", { variant: 'secondary', icon: 'negative', iconPosition: 'end', iconOnly: true, size: 'sm', onClick: () => (this._show = false) })), h("div", { class: 'flex w-full flex-col items-stretch' }, h("slot", { name: 'company' })), h("div", { class: 'flex w-full flex-col gap-6 overflow-y-auto' }, h("slot", { name: 'content' })), h("div", { class: 'mt-auto hidden w-full flex-col layout-1280:flex' }, h("slot", { name: 'user' }))), h("div", { class: topbar({ class: sidebarAndTopbar() }) }, h("p-button", { variant: 'secondary', iconOnly: true, icon: 'menu', size: 'sm', onClick: () => (this._show = true) }), h("slot", { name: 'topbar' }))));
   }
   handleCloseNavbar() {
     this._show = false;
@@ -64,6 +65,7 @@ const Navbar = /*@__PURE__*/ proxyCustomElement(class Navbar extends HTMLElement
   }
   static get style() { return navbarComponentCss; }
 }, [1, "p-navbar", {
+    "menuText": [1, "menu-text"],
     "_show": [32]
   }, [[8, "closeNavbar", "handleCloseNavbar"], [8, "openNavbar", "handleOpenNavbar"]]]);
 function defineCustomElement$1() {

package/dist/components/p-navbar.js.map

@@ -1 +1 @@
-{"file":"p-navbar.js","mappings":";;;;;;;AAAA,MAAM,kBAAkB,GAAG,ypGAAypG;;ACGprG,MAAM,gBAAgB,GAAG,GAAG,CAAC;EAC5B,kBAAkB;EAClB,4CAA4C;EAC5C,KAAK;CACL,CAAC,CAAC;AAEH,MAAM,OAAO,GAAG,GAAG,CAClB;EACC,eAAe;EAEf,2CAA2C;EAC3C,wBAAwB;EACxB,gFAAgF;EAChF,OAAO;EAEP,gBAAgB;EAChB,uBAAuB;EACvB,2DAA2D;EAE3D,UAAU;EAEV,cAAc;CACd,EACD;EACC,QAAQ,EAAE;IACT,IAAI,EAAE;MACL,KAAK,EAAE,IAAI;MACX,IAAI,EAAE,MAAM;KACZ;GACD;CACD,CACD,CAAC;AAEF,MAAM,MAAM,GAAG,GAAG,CAAC;EAClB,0CAA0C;EAC1C,0BAA0B;EAC1B,UAAU;EACV,oBAAoB;EACpB,aAAa;CACb,CAAC,CAAC;AAEH,MAAM,QAAQ,GAAG,GAAG,CACnB,CAAC,yDAAyD,CAAC,EAC3D;EACC,QAAQ,EAAE;IACT,IAAI,EAAE;MACL,KAAK,EAAE,+BAA+B;MACtC,IAAI,EAAE,aAAa;KACnB;GACD;CACD,CACD,CAAC;MAOW,MAAM;;;;;iBACO,KAAK;;EAE9B,MAAM;IACL,QACC,EAAC,IAAI,IAAC,KAAK,EAAC,qEAAqE,IAChF,kBACC,KAAK,EAAE,QAAQ,CAAC,EAAE,IAAI,EAAE,IAAI,CAAC,KAAK,EAAE,CAAC,EACrC,UAAU,EAAE,IAAI,CAAC,KAAK,EACtB,SAAS,EAAE,OAAO,IAAI,CAAC,KAAK,GAAG,KAAK,CAAC,GACxB,EACd,WAAK,KAAK,EAAE,OAAO,CAAC,EAAE,KAAK,EAAE,gBAAgB,EAAE,EAAE,IAAI,EAAE,IAAI,CAAC,KAAK,EAAE,CAAC,IACnE,WAAK,KAAK,EAAC,6DAA6D,IACvE,gBACC,OAAO,EAAC,WAAW,EACnB,IAAI,EAAC,YAAY,EACjB,QAAQ,EAAC,YAAY,EACrB,QAAQ,EAAE,IAAI,EACd,IAAI,EAAC,IAAI,EACT,OAAO,EAAE,OAAO,IAAI,CAAC,KAAK,GAAG,KAAK,CAAC,GACxB,CACP,EACN,WAAK,KAAK,EAAC,oCAAoC,IAC9C,YAAM,IAAI,EAAC,SAAS,GAAG,CAClB,EACN,WAAK,KAAK,EAAC,4CAA4C,IACtD,YAAM,IAAI,EAAC,SAAS,GAAG,CAClB,EAEN,WAAK,KAAK,EAAC,iDAAiD,IAC3D,YAAM,IAAI,EAAC,MAAM,GAAG,CACf,CACD,EACN,WAAK,KAAK,EAAE,MAAM,CAAC,EAAE,KAAK,EAAE,gBAAgB,EAAE,EAAE,CAAC,IAChD,gBACC,OAAO,EAAC,WAAW,EACnB,QAAQ,EAAE,IAAI,EACd,IAAI,EAAC,YAAY,EACjB,IAAI,EAAC,IAAI,EACT,OAAO,EAAE,OAAO,IAAI,CAAC,KAAK,GAAG,IAAI,CAAC,GACvB,EAEZ,YAAM,IAAI,EAAC,QAAQ,GAAG,CACjB,CACA,EACN;GACF;EAGD,iBAAiB;IAChB,IAAI,CAAC,KAAK,GAAG,KAAK,CAAC;GACnB;EAGD,gBAAgB;IACf,IAAI,CAAC,KAAK,GAAG,IAAI,CAAC;GAClB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":[],"sources":["src/components/organisms/navbar/navbar.component.scss?tag=p-navbar&encapsulation=shadow","src/components/organisms/navbar/navbar.component.tsx"],"sourcesContent":[":host {\n\t.safe-sidebar {\n\t\tpadding-top: calc(env(safe-area-inset-top, 0) + 1rem) !important;\n\n\t\t&.show {\n\t\t\t--tw-translate-x: env(safe-area-inset-left, 0) !important;\n\t\t}\n\t}\n\n\t.safe-topbar {\n\t\tpadding-top: calc(env(safe-area-inset-top, 0) + 1rem) !important;\n\t\theight: calc(env(safe-area-inset-top, 0) + 4rem);\n\t}\n}\n","import { Component, h, Host, Listen, State } from '@stencil/core';\nimport { cva } from 'class-variance-authority';\n\nconst sidebarAndTopbar = cva([\n\t'bg-off-white-300',\n\t'border-0 border-solid border-off-white-700',\n\t'p-4',\n]);\n\nconst sidebar = cva(\n\t[\n\t\t'flex flex-col',\n\n\t\t'fixed left-0 top-0 z-navbar h-screen w-60',\n\t\t'w-full max-w-[16.5rem]',\n\t\t'layout-1280:relative layout-1280:z-0 layout-1280:max-w-none layout-1280:h-full',\n\t\t'gap-6',\n\n\t\t'transition-all',\n\t\t'will-change-transform',\n\t\t'-translate-x-full transform-gpu layout-1280:translate-x-0',\n\n\t\t'border-r',\n\n\t\t'safe-sidebar',\n\t],\n\t{\n\t\tvariants: {\n\t\t\tshow: {\n\t\t\t\tfalse: null,\n\t\t\t\ttrue: 'show',\n\t\t\t},\n\t\t},\n\t}\n);\n\nconst topbar = cva([\n\t'flex w-full justify-between items-center',\n\t'relative z-navbar-topbar',\n\t'border-b',\n\t'layout-1280:hidden',\n\t'safe-topbar',\n]);\n\nconst backdrop = cva(\n\t['z-navbar-backdrop layout-1280:hidden transition-opacity'],\n\t{\n\t\tvariants: {\n\t\t\tshow: {\n\t\t\t\tfalse: 'opacity-0 pointer-events-none',\n\t\t\t\ttrue: 'opacity-100',\n\t\t\t},\n\t\t},\n\t}\n);\n\n@Component({\n\ttag: 'p-navbar',\n\tstyleUrl: 'navbar.component.scss',\n\tshadow: true,\n})\nexport class Navbar {\n\t@State() private _show = false;\n\n\trender() {\n\t\treturn (\n\t\t\t<Host class='p-navbar w-full max-h-screen-safe layout-1280:w-60 layout-1680:w-72'>\n\t\t\t\t<p-backdrop\n\t\t\t\t\tclass={backdrop({ show: this._show })}\n\t\t\t\t\tscrollLock={this._show}\n\t\t\t\t\tonClicked={() => (this._show = false)}\n\t\t\t\t></p-backdrop>\n\t\t\t\t<div class={sidebar({ class: sidebarAndTopbar(), show: this._show })}>\n\t\t\t\t\t<div class='flex w-full items-center justify-between layout-1280:hidden'>\n\t\t\t\t\t\t<p-button\n\t\t\t\t\t\t\tvariant='secondary'\n\t\t\t\t\t\t\ticon='menu-arrow'\n\t\t\t\t\t\t\ticonFlip='horizontal'\n\t\t\t\t\t\t\ticonOnly={true}\n\t\t\t\t\t\t\tsize='sm'\n\t\t\t\t\t\t\tonClick={() => (this._show = false)}\n\t\t\t\t\t\t></p-button>\n\t\t\t\t\t</div>\n\t\t\t\t\t<div class='flex w-full flex-col items-stretch'>\n\t\t\t\t\t\t<slot name='company' />\n\t\t\t\t\t</div>\n\t\t\t\t\t<div class='flex w-full flex-col gap-6 overflow-y-auto'>\n\t\t\t\t\t\t<slot name='content' />\n\t\t\t\t\t</div>\n\n\t\t\t\t\t<div class='mt-auto hidden w-full flex-col layout-1280:flex'>\n\t\t\t\t\t\t<slot name='user' />\n\t\t\t\t\t</div>\n\t\t\t\t</div>\n\t\t\t\t<div class={topbar({ class: sidebarAndTopbar() })}>\n\t\t\t\t\t<p-button\n\t\t\t\t\t\tvariant='secondary'\n\t\t\t\t\t\ticonOnly={true}\n\t\t\t\t\t\ticon='menu-arrow'\n\t\t\t\t\t\tsize='sm'\n\t\t\t\t\t\tonClick={() => (this._show = true)}\n\t\t\t\t\t></p-button>\n\n\t\t\t\t\t<slot name='topbar' />\n\t\t\t\t</div>\n\t\t\t</Host>\n\t\t);\n\t}\n\n\t@Listen('closeNavbar', { target: 'window' })\n\thandleCloseNavbar() {\n\t\tthis._show = false;\n\t}\n\n\t@Listen('openNavbar', { target: 'window' })\n\thandleOpenNavbar() {\n\t\tthis._show = true;\n\t}\n}\n"],"version":3}
+{"file":"p-navbar.js","mappings":";;;;;;;AAAA,MAAM,kBAAkB,GAAG,m4GAAm4G;;ACG95G,MAAM,gBAAgB,GAAG,GAAG,CAAC;EAC5B,kBAAkB;EAClB,4CAA4C;EAC5C,KAAK;CACL,CAAC,CAAC;AAEH,MAAM,OAAO,GAAG,GAAG,CAClB;EACC,eAAe;EAEf,2CAA2C;EAC3C,wBAAwB;EACxB,gFAAgF;EAChF,OAAO;EAEP,gBAAgB;EAChB,uBAAuB;EACvB,2DAA2D;EAE3D,UAAU;EAEV,cAAc;CACd,EACD;EACC,QAAQ,EAAE;IACT,IAAI,EAAE;MACL,KAAK,EAAE,IAAI;MACX,IAAI,EAAE,MAAM;KACZ;GACD;CACD,CACD,CAAC;AAEF,MAAM,MAAM,GAAG,GAAG,CAAC;EAClB,0CAA0C;EAC1C,0BAA0B;EAC1B,UAAU;EACV,oBAAoB;EACpB,aAAa;CACb,CAAC,CAAC;AAEH,MAAM,QAAQ,GAAG,GAAG,CACnB,CAAC,yDAAyD,CAAC,EAC3D;EACC,QAAQ,EAAE;IACT,IAAI,EAAE;MACL,KAAK,EAAE,+BAA+B;MACtC,IAAI,EAAE,aAAa;KACnB;GACD;CACD,CACD,CAAC;MAOW,MAAM;;;;;oBAIC,MAAM;iBAEA,KAAK;;EAE9B,MAAM;IACL,QACC,EAAC,IAAI,IAAC,KAAK,EAAC,qEAAqE,IAChF,kBACC,KAAK,EAAE,QAAQ,CAAC,EAAE,IAAI,EAAE,IAAI,CAAC,KAAK,EAAE,CAAC,EACrC,UAAU,EAAE,IAAI,CAAC,KAAK,EACtB,SAAS,EAAE,OAAO,IAAI,CAAC,KAAK,GAAG,KAAK,CAAC,GACxB,EACd,WAAK,KAAK,EAAE,OAAO,CAAC,EAAE,KAAK,EAAE,gBAAgB,EAAE,EAAE,IAAI,EAAE,IAAI,CAAC,KAAK,EAAE,CAAC,IACnE,WAAK,KAAK,EAAC,6DAA6D,IACvE,SAAG,KAAK,EAAC,2CAA2C,IAClD,IAAI,CAAC,QAAQ,CACX,EAEJ,gBACC,OAAO,EAAC,WAAW,EACnB,IAAI,EAAC,UAAU,EACf,YAAY,EAAC,KAAK,EAClB,QAAQ,EAAE,IAAI,EACd,IAAI,EAAC,IAAI,EACT,OAAO,EAAE,OAAO,IAAI,CAAC,KAAK,GAAG,KAAK,CAAC,GACxB,CACP,EACN,WAAK,KAAK,EAAC,oCAAoC,IAC9C,YAAM,IAAI,EAAC,SAAS,GAAG,CAClB,EACN,WAAK,KAAK,EAAC,4CAA4C,IACtD,YAAM,IAAI,EAAC,SAAS,GAAG,CAClB,EAEN,WAAK,KAAK,EAAC,iDAAiD,IAC3D,YAAM,IAAI,EAAC,MAAM,GAAG,CACf,CACD,EACN,WAAK,KAAK,EAAE,MAAM,CAAC,EAAE,KAAK,EAAE,gBAAgB,EAAE,EAAE,CAAC,IAChD,gBACC,OAAO,EAAC,WAAW,EACnB,QAAQ,EAAE,IAAI,EACd,IAAI,EAAC,MAAM,EACX,IAAI,EAAC,IAAI,EACT,OAAO,EAAE,OAAO,IAAI,CAAC,KAAK,GAAG,IAAI,CAAC,GACvB,EAEZ,YAAM,IAAI,EAAC,QAAQ,GAAG,CACjB,CACA,EACN;GACF;EAGD,iBAAiB;IAChB,IAAI,CAAC,KAAK,GAAG,KAAK,CAAC;GACnB;EAGD,gBAAgB;IACf,IAAI,CAAC,KAAK,GAAG,IAAI,CAAC;GAClB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":[],"sources":["src/components/organisms/navbar/navbar.component.scss?tag=p-navbar&encapsulation=shadow","src/components/organisms/navbar/navbar.component.tsx"],"sourcesContent":[":host {\n\t.safe-sidebar {\n\t\tpadding-top: calc(env(safe-area-inset-top, 0) + 1rem) !important;\n\n\t\t&.show {\n\t\t\t--tw-translate-x: env(safe-area-inset-left, 0) !important;\n\t\t}\n\t}\n\n\t.safe-topbar {\n\t\tpadding-top: calc(env(safe-area-inset-top, 0) + 1rem) !important;\n\t\theight: calc(env(safe-area-inset-top, 0) + 4rem);\n\t}\n}\n","import { Component, h, Host, Listen, Prop, State } from '@stencil/core';\nimport { cva } from 'class-variance-authority';\n\nconst sidebarAndTopbar = cva([\n\t'bg-off-white-300',\n\t'border-0 border-solid border-off-white-700',\n\t'p-4',\n]);\n\nconst sidebar = cva(\n\t[\n\t\t'flex flex-col',\n\n\t\t'fixed left-0 top-0 z-navbar h-screen w-60',\n\t\t'w-full max-w-[16.5rem]',\n\t\t'layout-1280:relative layout-1280:z-0 layout-1280:max-w-none layout-1280:h-full',\n\t\t'gap-6',\n\n\t\t'transition-all',\n\t\t'will-change-transform',\n\t\t'-translate-x-full transform-gpu layout-1280:translate-x-0',\n\n\t\t'border-r',\n\n\t\t'safe-sidebar',\n\t],\n\t{\n\t\tvariants: {\n\t\t\tshow: {\n\t\t\t\tfalse: null,\n\t\t\t\ttrue: 'show',\n\t\t\t},\n\t\t},\n\t}\n);\n\nconst topbar = cva([\n\t'flex w-full justify-between items-center',\n\t'relative z-navbar-topbar',\n\t'border-b',\n\t'layout-1280:hidden',\n\t'safe-topbar',\n]);\n\nconst backdrop = cva(\n\t['z-navbar-backdrop layout-1280:hidden transition-opacity'],\n\t{\n\t\tvariants: {\n\t\t\tshow: {\n\t\t\t\tfalse: 'opacity-0 pointer-events-none',\n\t\t\t\ttrue: 'opacity-100',\n\t\t\t},\n\t\t},\n\t}\n);\n\n@Component({\n\ttag: 'p-navbar',\n\tstyleUrl: 'navbar.component.scss',\n\tshadow: true,\n})\nexport class Navbar {\n\t/**\n\t * The text to display for the menu button & sidebar title\n\t */\n\t@Prop() menuText = 'Menu';\n\n\t@State() private _show = false;\n\n\trender() {\n\t\treturn (\n\t\t\t<Host class='p-navbar w-full max-h-screen-safe layout-1280:w-60 layout-1680:w-72'>\n\t\t\t\t<p-backdrop\n\t\t\t\t\tclass={backdrop({ show: this._show })}\n\t\t\t\t\tscrollLock={this._show}\n\t\t\t\t\tonClicked={() => (this._show = false)}\n\t\t\t\t></p-backdrop>\n\t\t\t\t<div class={sidebar({ class: sidebarAndTopbar(), show: this._show })}>\n\t\t\t\t\t<div class='flex w-full items-center justify-between layout-1280:hidden'>\n\t\t\t\t\t\t<p class='m-0 text-xl font-semibold text-storm-dark'>\n\t\t\t\t\t\t\t{this.menuText}\n\t\t\t\t\t\t</p>\n\n\t\t\t\t\t\t<p-button\n\t\t\t\t\t\t\tvariant='secondary'\n\t\t\t\t\t\t\ticon='negative'\n\t\t\t\t\t\t\ticonPosition='end'\n\t\t\t\t\t\t\ticonOnly={true}\n\t\t\t\t\t\t\tsize='sm'\n\t\t\t\t\t\t\tonClick={() => (this._show = false)}\n\t\t\t\t\t\t></p-button>\n\t\t\t\t\t</div>\n\t\t\t\t\t<div class='flex w-full flex-col items-stretch'>\n\t\t\t\t\t\t<slot name='company' />\n\t\t\t\t\t</div>\n\t\t\t\t\t<div class='flex w-full flex-col gap-6 overflow-y-auto'>\n\t\t\t\t\t\t<slot name='content' />\n\t\t\t\t\t</div>\n\n\t\t\t\t\t<div class='mt-auto hidden w-full flex-col layout-1280:flex'>\n\t\t\t\t\t\t<slot name='user' />\n\t\t\t\t\t</div>\n\t\t\t\t</div>\n\t\t\t\t<div class={topbar({ class: sidebarAndTopbar() })}>\n\t\t\t\t\t<p-button\n\t\t\t\t\t\tvariant='secondary'\n\t\t\t\t\t\ticonOnly={true}\n\t\t\t\t\t\ticon='menu'\n\t\t\t\t\t\tsize='sm'\n\t\t\t\t\t\tonClick={() => (this._show = true)}\n\t\t\t\t\t></p-button>\n\n\t\t\t\t\t<slot name='topbar' />\n\t\t\t\t</div>\n\t\t\t</Host>\n\t\t);\n\t}\n\n\t@Listen('closeNavbar', { target: 'window' })\n\thandleCloseNavbar() {\n\t\tthis._show = false;\n\t}\n\n\t@Listen('openNavbar', { target: 'window' })\n\thandleOpenNavbar() {\n\t\tthis._show = true;\n\t}\n}\n"],"version":3}