@paperless/core 1.26.0 → 1.26.2
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/CHANGELOG.md +19 -0
- package/dist/build/p-21e5da04.entry.js +2 -0
- package/dist/build/p-21e5da04.entry.js.map +1 -0
- package/dist/build/p-de4ae1ca.entry.js +2 -0
- package/dist/build/p-de4ae1ca.entry.js.map +1 -0
- package/dist/build/{p-dfa8eae9.entry.js → p-f6c6919a.entry.js} +2 -2
- package/dist/build/{p-dfa8eae9.entry.js.map → p-f6c6919a.entry.js.map} +1 -1
- package/dist/build/paperless.css +1 -1
- package/dist/build/paperless.esm.js +1 -1
- package/dist/cjs/p-dropdown_2.cjs.entry.js +1 -1
- package/dist/cjs/p-dropdown_2.cjs.entry.js.map +1 -1
- package/dist/cjs/p-layout.cjs.entry.js +1 -1
- package/dist/cjs/p-layout.cjs.entry.js.map +1 -1
- package/dist/cjs/p-navbar.cjs.entry.js +1 -1
- package/dist/cjs/p-navbar.cjs.entry.js.map +1 -1
- package/dist/collection/components/atoms/dropdown-menu-item/dropdown-menu-item.component.css +1 -1
- package/dist/collection/components/atoms/layout/layout.component.css +1 -1
- package/dist/collection/components/atoms/layout/layout.component.js +2 -2
- package/dist/collection/components/atoms/layout/layout.component.js.map +1 -1
- package/dist/collection/components/organisms/navbar/navbar.component.css +1 -1
- package/dist/collection/tailwind/screens.js +14 -6
- package/dist/collection/tailwind/width.js +14 -19
- package/dist/components/dropdown-menu-item.component.js +1 -1
- package/dist/components/dropdown-menu-item.component.js.map +1 -1
- package/dist/components/p-layout.js +1 -1
- package/dist/components/p-layout.js.map +1 -1
- package/dist/components/p-navbar.js +1 -1
- package/dist/components/p-navbar.js.map +1 -1
- package/dist/esm/p-dropdown_2.entry.js +1 -1
- package/dist/esm/p-dropdown_2.entry.js.map +1 -1
- package/dist/esm/p-layout.entry.js +1 -1
- package/dist/esm/p-layout.entry.js.map +1 -1
- package/dist/esm/p-navbar.entry.js +1 -1
- package/dist/esm/p-navbar.entry.js.map +1 -1
- package/dist/index.html +1 -1
- package/dist/paperless/p-21e5da04.entry.js +2 -0
- package/dist/paperless/p-21e5da04.entry.js.map +1 -0
- package/dist/paperless/p-de4ae1ca.entry.js +2 -0
- package/dist/paperless/p-de4ae1ca.entry.js.map +1 -0
- package/dist/paperless/{p-dfa8eae9.entry.js → p-f6c6919a.entry.js} +2 -2
- package/dist/paperless/{p-dfa8eae9.entry.js.map → p-f6c6919a.entry.js.map} +1 -1
- package/dist/paperless/paperless.css +8 -2
- package/dist/paperless/paperless.esm.js +1 -1
- package/dist/style/form/_checkbox.scss +128 -108
- package/dist/sw.js +1 -1
- package/dist/sw.js.map +1 -1
- package/dist/tailwind/screens.js +14 -6
- package/dist/tailwind/width.js +14 -19
- package/dist/types/components/atoms/layout/layout.component.d.ts +1 -1
- package/dist/types/components.d.ts +2 -2
- package/hydrate/index.js +3 -3
- package/package.json +1 -1
- package/dist/build/p-03090f03.entry.js +0 -2
- package/dist/build/p-03090f03.entry.js.map +0 -1
- package/dist/build/p-46a939e2.entry.js +0 -2
- package/dist/build/p-46a939e2.entry.js.map +0 -1
- package/dist/paperless/p-03090f03.entry.js +0 -2
- package/dist/paperless/p-03090f03.entry.js.map +0 -1
- package/dist/paperless/p-46a939e2.entry.js +0 -2
- package/dist/paperless/p-46a939e2.entry.js.map +0 -1
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import { proxyCustomElement, HTMLElement, h, Host } from '@stencil/core/internal/client';
|
|
2
2
|
import { d as defineCustomElement$1 } from './icon.component.js';
|
|
3
3
|
|
|
4
|
-
const dropdownMenuItemComponentCss = ".block{display:block!important}.flex{display:flex!important}.h-4{height:1rem!important}.h-6{height:1.5rem!important}.h-8{height:2rem!important}.w-4{width:1rem!important}.w-6{width:1.5rem!important}.w-\\[2\\.375rem\\]{width:2.375rem!important}.w-full{width:100%!important}.translate-x-0{--tw-translate-x:0px!important}.translate-x-0,.translate-x-3{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}.translate-x-3{--tw-translate-x:0.75rem!important}.transform{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}.appearance-none{-webkit-appearance:none!important;-moz-appearance:none!important;appearance:none!important}.items-center{align-items:center!important}.gap-2{gap:.5rem!important}.overflow-hidden{overflow:hidden!important}.text-ellipsis{text-overflow:ellipsis!important}.rounded{border-radius:.25rem!important}.border{border-width:1px!important}.border-solid{border-style:solid!important}.border-indigo{--tw-border-opacity:1!important;border-color:rgb(82 138 250/var(--tw-border-opacity))!important}.border-negative{--tw-border-opacity:1!important;border-color:rgb(185 30 40/var(--tw-border-opacity))!important}.bg-indigo-light{--tw-bg-opacity:1!important;background-color:rgb(241 246 255/var(--tw-bg-opacity))!important}.bg-mystic-dark{background-color:rgb(218 230 240/var(--tw-bg-opacity))!important}.bg-mystic-dark,.bg-white{--tw-bg-opacity:1!important}.bg-white{background-color:rgb(255 255 255/var(--tw-bg-opacity))!important}.bg-center{background-position:50%!important}.text-sm{font-size:.875rem!important;line-height:1.25rem!important}.font-semibold{font-weight:600!important}.outline-none{outline:2px solid transparent!important;outline-offset:2px!important}.transition-transform{transition-duration:.15s!important;transition-property:transform!important;transition-timing-function:cubic-bezier(.4,0,.2,1)!important}*{box-sizing:border-box}:host{--tw-text-opacity:1;align-items:center;border-radius:.25rem;color:rgb(81 83 107/var(--tw-text-opacity));cursor:pointer;display:flex;font-size:.875rem;font-weight:600;gap:.5rem;height:2rem;line-height:1.25rem;padding-left:.5rem;padding-right:.5rem;width:100%}:host input[type=checkbox].p-input{--tw-bg-opacity:1;--tw-border-opacity:1;-webkit-appearance:none;-moz-appearance:none;appearance:none;background-color:rgb(255 255 255/var(--tw-bg-opacity));background-position:50%;background-repeat:no-repeat;background-size:1rem;border-color:rgb(218 230 240/var(--tw-border-opacity));border-radius:.25rem;border-style:solid;border-width:1px;height:1.5rem;outline:2px solid transparent!important;outline-offset:2px!important;width:1.5rem}:host input[type=checkbox].p-input+label{margin-left:.2rem;margin-top:.05rem}:host input[type=checkbox].p-input:hover:not(:disabled):not([disabled]):not(.disabled){cursor:pointer}:host input[type=checkbox].p-input:hover:not(:disabled):not([disabled]):not(.disabled):not(:checked):not([checked]):not(.checked):not(:indeterminate):not([indeterminate]):not(.indeterminate){--tw-border-opacity:1;background-image:url(\"data:image/svg+xml;charset=utf-8,%3Csvg width='1em' height='1em' viewBox='0 0 16 16' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M5.965 11.487 13.53 1.53c.435-.572 1.22-.7 1.8-.292l.108.077c.294.206.492.53.546.895.054.365-.04.737-.26 1.026L7.26 14.38a1.34 1.34 0 0 1-.642.463 1.302 1.302 0 0 1-1.575-.263L.362 9.6a1.356 1.356 0 0 1-.36-.99c.017-.37.181-.713.452-.95l.1-.088a1.302 1.302 0 0 1 1.82.093l3.592 3.82h-.001Z' fill='%23dae6f0' fill-rule='evenodd'/%3E%3C/svg%3E\");border-color:rgb(82 138 250/var(--tw-border-opacity))}:host input[type=checkbox].p-input.checked,:host input[type=checkbox].p-input.indeterminate,:host input[type=checkbox].p-input:checked,:host input[type=checkbox].p-input:indeterminate,:host input[type=checkbox].p-input[checked],:host input[type=checkbox].p-input[indeterminate]{--tw-border-opacity:1;--tw-bg-opacity:1;background-color:rgb(82 138 250/var(--tw-bg-opacity));border-color:rgb(82 138 250/var(--tw-border-opacity))}:host input[type=checkbox].p-input.checked,:host input[type=checkbox].p-input:checked,:host input[type=checkbox].p-input[checked]{background-image:url(\"data:image/svg+xml;charset=utf-8,%3Csvg width='1em' height='1em' viewBox='0 0 16 16' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M5.965 11.487 13.53 1.53c.435-.572 1.22-.7 1.8-.292l.108.077c.294.206.492.53.546.895.054.365-.04.737-.26 1.026L7.26 14.38a1.34 1.34 0 0 1-.642.463 1.302 1.302 0 0 1-1.575-.263L.362 9.6a1.356 1.356 0 0 1-.36-.99c.017-.37.181-.713.452-.95l.1-.088a1.302 1.302 0 0 1 1.82.093l3.592 3.82h-.001Z' fill='%23fff' fill-rule='evenodd'/%3E%3C/svg%3E\")}:host input[type=checkbox].p-input.indeterminate,:host input[type=checkbox].p-input:indeterminate,:host input[type=checkbox].p-input[indeterminate]{background-image:url(\"data:image/svg+xml;charset=utf-8,%3Csvg width='1em' height='1em' viewBox='0 0 16 16' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M4 7h8a1 1 0 0 1 0 2H4a1 1 0 1 1 0-2Z' fill='%23fff' fill-rule='evenodd'/%3E%3C/svg%3E\")}:host input[type=checkbox].p-input.disabled,:host input[type=checkbox].p-input:disabled,:host input[type=checkbox].p-input[disabled]{opacity:.4}:host input[type=checkbox].p-input.error,:host input[type=checkbox].p-input[error]{--tw-text-opacity:1;--tw-border-opacity:1!important;border-color:rgb(185 30 40/var(--tw-border-opacity))!important;color:rgb(138 15 29/var(--tw-text-opacity))}:host input[type=checkbox].p-input.error::-moz-placeholder,:host input[type=checkbox].p-input[error]::-moz-placeholder{--tw-text-opacity:1;color:rgb(255 204 211/var(--tw-text-opacity))}:host input[type=checkbox].p-input.error::placeholder,:host input[type=checkbox].p-input[error]::placeholder{--tw-text-opacity:1;color:rgb(255 204 211/var(--tw-text-opacity))}:host input[type=checkbox].p-input.error.checked,:host input[type=checkbox].p-input.error:checked,:host input[type=checkbox].p-input.error[checked],:host input[type=checkbox].p-input[error].checked,:host input[type=checkbox].p-input[error]:checked,:host input[type=checkbox].p-input[error][checked]{--tw-bg-opacity:1;background-color:rgb(185 30 40/var(--tw-bg-opacity))}:host input[type=checkbox].p-input.size-small{font-size:.75rem;height:1rem;line-height:1rem;width:1rem}:host input[type=checkbox].p-toggle{--tw-bg-opacity:1;--tw-border-opacity:1;align-items:center;-webkit-appearance:none;-moz-appearance:none;appearance:none;background-color:rgb(255 255 255/var(--tw-bg-opacity));border-color:rgb(218 230 240/var(--tw-border-opacity));border-radius:1.5625rem;border-style:solid;border-width:1px;display:flex;height:1.5rem;justify-content:flex-start;padding:.25rem;width:2.375rem}:host input[type=checkbox].p-toggle:after{--tw-translate-x:0px;--tw-bg-opacity:1;background-color:rgb(218 230 240/var(--tw-bg-opacity));border-radius:100%;content:\"\";display:block;height:1rem;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));transition-duration:.1s;transition-property:transform;transition-timing-function:cubic-bezier(.4,0,.2,1);width:1rem}:host input[type=checkbox].p-toggle.checked,:host input[type=checkbox].p-toggle:checked,:host input[type=checkbox].p-toggle[checked]{--tw-border-opacity:1;--tw-bg-opacity:1;background-color:rgb(82 138 250/var(--tw-bg-opacity));border-color:rgb(82 138 250/var(--tw-border-opacity))}:host input[type=checkbox].p-toggle.checked:after,:host input[type=checkbox].p-toggle:checked:after,:host input[type=checkbox].p-toggle[checked]:after{--tw-translate-x:0.75rem;--tw-bg-opacity:1;background-color:rgb(255 255 255/var(--tw-bg-opacity));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))}:host input[type=checkbox].p-toggle.disabled,:host input[type=checkbox].p-toggle:disabled,:host input[type=checkbox].p-toggle[disabled]{opacity:.4}:host input[type=checkbox].p-toggle:hover:not(:disabled):not([disabled]):not(.disabled){cursor:pointer}:host input[type=checkbox].p-toggle:hover:not(:disabled):not([disabled]):not(.disabled):not(:checked):not([checked]):not(.checked){--tw-border-opacity:1;border-color:rgb(82 138 250/var(--tw-border-opacity))}:host input[type=checkbox].p-toggle.error,:host input[type=checkbox].p-toggle[error]{--tw-text-opacity:1;--tw-border-opacity:1!important;border-color:rgb(185 30 40/var(--tw-border-opacity))!important;color:rgb(138 15 29/var(--tw-text-opacity))}:host input[type=checkbox].p-toggle.error::-moz-placeholder,:host input[type=checkbox].p-toggle[error]::-moz-placeholder{--tw-text-opacity:1;color:rgb(255 204 211/var(--tw-text-opacity))}:host input[type=checkbox].p-toggle.error::placeholder,:host input[type=checkbox].p-toggle[error]::placeholder{--tw-text-opacity:1;color:rgb(255 204 211/var(--tw-text-opacity))}:host input[type=checkbox].p-toggle.error.checked,:host input[type=checkbox].p-toggle.error:checked,:host input[type=checkbox].p-toggle.error[checked],:host input[type=checkbox].p-toggle[error].checked,:host input[type=checkbox].p-toggle[error]:checked,:host input[type=checkbox].p-toggle[error][checked]{--tw-bg-opacity:1;background-color:rgb(185 30 40/var(--tw-bg-opacity))}:host .text-container{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;width:100%}:host(.hover:hover){--tw-bg-opacity:1;--tw-text-opacity:1;background-color:rgb(241 246 255/var(--tw-bg-opacity));color:rgb(81 83 107/var(--tw-text-opacity))}:host(.active){--tw-bg-opacity:1;--tw-text-opacity:1;background-color:rgb(241 246 255/var(--tw-bg-opacity));color:rgb(82 138 250/var(--tw-text-opacity))}.static{position:static!important}.flex-shrink-0{flex-shrink:0!important}";
|
|
4
|
+
const dropdownMenuItemComponentCss = ".block{display:block!important}.flex{display:flex!important}.h-4{height:1rem!important}.h-6{height:1.5rem!important}.h-8{height:2rem!important}.w-4{width:1rem!important}.w-6{width:1.5rem!important}.w-\\[2\\.375rem\\]{width:2.375rem!important}.w-full{width:100%!important}.translate-x-0{--tw-translate-x:0px!important}.translate-x-0,.translate-x-3{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}.translate-x-3{--tw-translate-x:0.75rem!important}.transform{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}.appearance-none{-webkit-appearance:none!important;-moz-appearance:none!important;appearance:none!important}.items-center{align-items:center!important}.gap-2{gap:.5rem!important}.overflow-hidden{overflow:hidden!important}.text-ellipsis{text-overflow:ellipsis!important}.rounded{border-radius:.25rem!important}.border{border-width:1px!important}.border-solid{border-style:solid!important}.border-indigo{--tw-border-opacity:1!important;border-color:rgb(82 138 250/var(--tw-border-opacity))!important}.border-negative{--tw-border-opacity:1!important;border-color:rgb(185 30 40/var(--tw-border-opacity))!important}.bg-indigo-light{--tw-bg-opacity:1!important;background-color:rgb(241 246 255/var(--tw-bg-opacity))!important}.bg-mystic-dark{background-color:rgb(218 230 240/var(--tw-bg-opacity))!important}.bg-mystic-dark,.bg-white{--tw-bg-opacity:1!important}.bg-white{background-color:rgb(255 255 255/var(--tw-bg-opacity))!important}.bg-center{background-position:50%!important}.text-sm{font-size:.875rem!important;line-height:1.25rem!important}.font-semibold{font-weight:600!important}.outline-none{outline:2px solid transparent!important;outline-offset:2px!important}.transition-transform{transition-duration:.15s!important;transition-property:transform!important;transition-timing-function:cubic-bezier(.4,0,.2,1)!important}*{box-sizing:border-box}:host{--tw-text-opacity:1;align-items:center;border-radius:.25rem;color:rgb(81 83 107/var(--tw-text-opacity));cursor:pointer;display:flex;font-size:.875rem;font-weight:600;gap:.5rem;height:2rem;line-height:1.25rem;padding-left:.5rem;padding-right:.5rem;width:100%}:host input[type=checkbox].p-input{--tw-bg-opacity:1;--tw-border-opacity:1;-webkit-appearance:none;-moz-appearance:none;appearance:none;background-color:rgb(255 255 255/var(--tw-bg-opacity));background-position:50%;background-repeat:no-repeat;background-size:1rem;border-color:rgb(218 230 240/var(--tw-border-opacity));border-radius:.25rem;border-style:solid;border-width:1px;height:1.5rem;outline:2px solid transparent!important;outline-offset:2px!important;width:1.5rem}:host input[type=checkbox].p-input+label{margin-left:.2rem;margin-top:.05rem}:host input[type=checkbox].p-input:hover:not(:disabled):not([disabled]):not(.disabled){cursor:pointer}:host input[type=checkbox].p-input:hover:not(:disabled):not([disabled]):not(.disabled):not(:checked):not([checked]):not(.checked):not(:indeterminate):not([indeterminate]):not(.indeterminate){--tw-border-opacity:1;background-image:url(\"data:image/svg+xml;charset=utf-8,%3Csvg width='1em' height='1em' viewBox='0 0 16 16' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M5.965 11.487 13.53 1.53c.435-.572 1.22-.7 1.8-.292l.108.077c.294.206.492.53.546.895.054.365-.04.737-.26 1.026L7.26 14.38a1.34 1.34 0 0 1-.642.463 1.302 1.302 0 0 1-1.575-.263L.362 9.6a1.356 1.356 0 0 1-.36-.99c.017-.37.181-.713.452-.95l.1-.088a1.302 1.302 0 0 1 1.82.093l3.592 3.82h-.001Z' fill='%23dae6f0' fill-rule='evenodd'/%3E%3C/svg%3E\");border-color:rgb(82 138 250/var(--tw-border-opacity))}:host input[type=checkbox].p-input.checked,:host input[type=checkbox].p-input.indeterminate,:host input[type=checkbox].p-input:checked,:host input[type=checkbox].p-input:indeterminate,:host input[type=checkbox].p-input[checked],:host input[type=checkbox].p-input[indeterminate]{--tw-border-opacity:1;--tw-bg-opacity:1;background-color:rgb(82 138 250/var(--tw-bg-opacity));border-color:rgb(82 138 250/var(--tw-border-opacity))}:host input[type=checkbox].p-input.checked,:host input[type=checkbox].p-input:checked,:host input[type=checkbox].p-input[checked]{background-image:url(\"data:image/svg+xml;charset=utf-8,%3Csvg width='1em' height='1em' viewBox='0 0 16 16' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M5.965 11.487 13.53 1.53c.435-.572 1.22-.7 1.8-.292l.108.077c.294.206.492.53.546.895.054.365-.04.737-.26 1.026L7.26 14.38a1.34 1.34 0 0 1-.642.463 1.302 1.302 0 0 1-1.575-.263L.362 9.6a1.356 1.356 0 0 1-.36-.99c.017-.37.181-.713.452-.95l.1-.088a1.302 1.302 0 0 1 1.82.093l3.592 3.82h-.001Z' fill='%23fff' fill-rule='evenodd'/%3E%3C/svg%3E\")}:host input[type=checkbox].p-input.indeterminate,:host input[type=checkbox].p-input:indeterminate,:host input[type=checkbox].p-input[indeterminate]{background-image:url(\"data:image/svg+xml;charset=utf-8,%3Csvg width='1em' height='1em' viewBox='0 0 16 16' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M4 7h8a1 1 0 0 1 0 2H4a1 1 0 1 1 0-2Z' fill='%23fff' fill-rule='evenodd'/%3E%3C/svg%3E\")}:host input[type=checkbox].p-input.disabled,:host input[type=checkbox].p-input:disabled,:host input[type=checkbox].p-input[disabled]{opacity:.4}:host input[type=checkbox].p-input.error,:host input[type=checkbox].p-input[error]{--tw-text-opacity:1;--tw-border-opacity:1!important;border-color:rgb(185 30 40/var(--tw-border-opacity))!important;color:rgb(138 15 29/var(--tw-text-opacity))}:host input[type=checkbox].p-input.error::-moz-placeholder,:host input[type=checkbox].p-input[error]::-moz-placeholder{--tw-text-opacity:1;color:rgb(255 204 211/var(--tw-text-opacity))}:host input[type=checkbox].p-input.error::placeholder,:host input[type=checkbox].p-input[error]::placeholder{--tw-text-opacity:1;color:rgb(255 204 211/var(--tw-text-opacity))}:host input[type=checkbox].p-input.error.checked,:host input[type=checkbox].p-input.error:checked,:host input[type=checkbox].p-input.error[checked],:host input[type=checkbox].p-input[error].checked,:host input[type=checkbox].p-input[error]:checked,:host input[type=checkbox].p-input[error][checked]{--tw-bg-opacity:1;background-color:rgb(185 30 40/var(--tw-bg-opacity))}:host input[type=checkbox].p-input.size-small{height:1rem;width:1rem}:host input[type=checkbox].p-input.size-small:hover:not(:disabled):not([disabled]):not(.disabled):not(:checked):not([checked]):not(.checked):not(:indeterminate):not([indeterminate]):not(.indeterminate){background-image:url(\"data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16'%3E%3Cg fill='none' fill-rule='evenodd'%3E%3Cpath d='M2.667 2.667h10.667v10.667H2.667z'/%3E%3Cpath fill='%23DAE6F0' d='m6.644 10.325 5.044-6.638a.87.87 0 0 1 1.2-.194l.072.05a.91.91 0 0 1 .19 1.28l-5.644 7.43a.89.89 0 0 1-.427.31.868.868 0 0 1-1.05-.176l-3.12-3.32a.904.904 0 0 1-.241-.66.897.897 0 0 1 .302-.633l.067-.058a.868.868 0 0 1 1.213.062l2.394 2.547Z'/%3E%3C/g%3E%3C/svg%3E\")}:host input[type=checkbox].p-input.size-small.checked,:host input[type=checkbox].p-input.size-small:checked,:host input[type=checkbox].p-input.size-small[checked]{background-image:url(\"data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16'%3E%3Cg fill='none' fill-rule='evenodd'%3E%3Cpath d='M2.667 2.667h10.667v10.667H2.667z'/%3E%3Cpath fill='%23FFF' d='m6.644 10.325 5.044-6.638a.87.87 0 0 1 1.2-.194l.072.05a.91.91 0 0 1 .19 1.28l-5.644 7.43a.89.89 0 0 1-.427.31.868.868 0 0 1-1.05-.176l-3.12-3.32a.904.904 0 0 1-.241-.66.897.897 0 0 1 .302-.633l.067-.058a.868.868 0 0 1 1.213.062l2.394 2.547Z'/%3E%3C/g%3E%3C/svg%3E\")}:host input[type=checkbox].p-toggle{--tw-bg-opacity:1;--tw-border-opacity:1;align-items:center;-webkit-appearance:none;-moz-appearance:none;appearance:none;background-color:rgb(255 255 255/var(--tw-bg-opacity));border-color:rgb(218 230 240/var(--tw-border-opacity));border-radius:1.5625rem;border-style:solid;border-width:1px;display:flex;height:1.5rem;justify-content:flex-start;padding:.25rem;width:2.375rem}:host input[type=checkbox].p-toggle:after{--tw-translate-x:0px;--tw-bg-opacity:1;background-color:rgb(218 230 240/var(--tw-bg-opacity));border-radius:100%;content:\"\";display:block;height:1rem;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));transition-duration:.1s;transition-property:transform;transition-timing-function:cubic-bezier(.4,0,.2,1);width:1rem}:host input[type=checkbox].p-toggle.checked,:host input[type=checkbox].p-toggle:checked,:host input[type=checkbox].p-toggle[checked]{--tw-border-opacity:1;--tw-bg-opacity:1;background-color:rgb(82 138 250/var(--tw-bg-opacity));border-color:rgb(82 138 250/var(--tw-border-opacity))}:host input[type=checkbox].p-toggle.checked:after,:host input[type=checkbox].p-toggle:checked:after,:host input[type=checkbox].p-toggle[checked]:after{--tw-translate-x:0.75rem;--tw-bg-opacity:1;background-color:rgb(255 255 255/var(--tw-bg-opacity));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))}:host input[type=checkbox].p-toggle.disabled,:host input[type=checkbox].p-toggle:disabled,:host input[type=checkbox].p-toggle[disabled]{opacity:.4}:host input[type=checkbox].p-toggle:hover:not(:disabled):not([disabled]):not(.disabled){cursor:pointer}:host input[type=checkbox].p-toggle:hover:not(:disabled):not([disabled]):not(.disabled):not(:checked):not([checked]):not(.checked){--tw-border-opacity:1;border-color:rgb(82 138 250/var(--tw-border-opacity))}:host input[type=checkbox].p-toggle.error,:host input[type=checkbox].p-toggle[error]{--tw-text-opacity:1;--tw-border-opacity:1!important;border-color:rgb(185 30 40/var(--tw-border-opacity))!important;color:rgb(138 15 29/var(--tw-text-opacity))}:host input[type=checkbox].p-toggle.error::-moz-placeholder,:host input[type=checkbox].p-toggle[error]::-moz-placeholder{--tw-text-opacity:1;color:rgb(255 204 211/var(--tw-text-opacity))}:host input[type=checkbox].p-toggle.error::placeholder,:host input[type=checkbox].p-toggle[error]::placeholder{--tw-text-opacity:1;color:rgb(255 204 211/var(--tw-text-opacity))}:host input[type=checkbox].p-toggle.error.checked,:host input[type=checkbox].p-toggle.error:checked,:host input[type=checkbox].p-toggle.error[checked],:host input[type=checkbox].p-toggle[error].checked,:host input[type=checkbox].p-toggle[error]:checked,:host input[type=checkbox].p-toggle[error][checked]{--tw-bg-opacity:1;background-color:rgb(185 30 40/var(--tw-bg-opacity))}:host .text-container{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;width:100%}:host(.hover:hover){--tw-bg-opacity:1;--tw-text-opacity:1;background-color:rgb(241 246 255/var(--tw-bg-opacity));color:rgb(81 83 107/var(--tw-text-opacity))}:host(.active){--tw-bg-opacity:1;--tw-text-opacity:1;background-color:rgb(241 246 255/var(--tw-bg-opacity));color:rgb(82 138 250/var(--tw-text-opacity))}.static{position:static!important}.flex-shrink-0{flex-shrink:0!important}";
|
|
5
5
|
|
|
6
6
|
const DropdownMenuItem = /*@__PURE__*/ proxyCustomElement(class DropdownMenuItem extends HTMLElement {
|
|
7
7
|
constructor() {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"file":"dropdown-menu-item.component.js","mappings":";;;AAAA,MAAM,4BAA4B,GAAG,
|
|
1
|
+
{"file":"dropdown-menu-item.component.js","mappings":";;;AAAA,MAAM,4BAA4B,GAAG,ipWAAipW;;MCQzqW,gBAAgB;;;;;kBAIF,KAAK;mBAKW,SAAS;uBAKpB,IAAI;;;EAOnC,MAAM;IACL,QACC,EAAC,IAAI,IACJ,KAAK,EAAE,wBAAwB,IAAI,CAAC,MAAM,IAAI,QAAQ,IACrD,IAAI,CAAC,WAAW,IAAI,OACrB,EAAE,IAED,IAAI,CAAC,IAAI,IAAI,cAAQ,OAAO,EAAE,IAAI,CAAC,IAAI,GAAI,EAE3C,IAAI,CAAC,OAAO,KAAK,UAAU,KAC3B,aACC,IAAI,EAAC,UAAU,EACf,KAAK,EAAC,kCAAkC,EACxC,OAAO,EAAE,IAAI,CAAC,MAAM,GACnB,CACF,EAED,WAAK,KAAK,EAAC,gBAAgB,IAC1B,eAAQ,CACH,CACA,EACN;GACF;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":[],"sources":["src/components/atoms/dropdown-menu-item/dropdown-menu-item.component.scss?tag=p-dropdown-menu-item&encapsulation=shadow","src/components/atoms/dropdown-menu-item/dropdown-menu-item.component.tsx"],"sourcesContent":[":host {\n\t@import '../../../style/form/checkbox';\n\n\t@apply flex h-8 w-full items-center gap-2 rounded px-2;\n\t@apply text-sm font-semibold text-storm;\n\t@apply cursor-pointer;\n\n\t.text-container {\n\t\t@apply block w-full overflow-hidden text-ellipsis whitespace-nowrap;\n\t}\n}\n\n:host(.hover:hover) {\n\t@apply bg-indigo-light text-storm;\n}\n\n:host(.active) {\n\t@apply bg-indigo-light text-indigo;\n}\n","import { Component, Host, Prop, h } from '@stencil/core';\nimport { IconVariant } from '../icon/icon.component';\n\n@Component({\n\ttag: 'p-dropdown-menu-item',\n\tstyleUrl: 'dropdown-menu-item.component.scss',\n\tshadow: true,\n})\nexport class DropdownMenuItem {\n\t/**\n\t * Wether the dropdown menu item is active\n\t */\n\t@Prop() active: boolean = false;\n\n\t/**\n\t * The variant of the item\n\t */\n\t@Prop() variant: 'default' | 'checkbox' = 'default';\n\n\t/**\n\t * Wether to enable the hover state\n\t */\n\t@Prop() enableHover: boolean = true;\n\n\t/**\n\t * Icon of the navigation item\n\t */\n\t@Prop() icon: IconVariant;\n\n\trender() {\n\t\treturn (\n\t\t\t<Host\n\t\t\t\tclass={`p-dropdown-menu-item ${this.active && 'active'} ${\n\t\t\t\t\tthis.enableHover && 'hover'\n\t\t\t\t}`}\n\t\t\t>\n\t\t\t\t{this.icon && <p-icon variant={this.icon} />}\n\n\t\t\t\t{this.variant === 'checkbox' && (\n\t\t\t\t\t<input\n\t\t\t\t\t\ttype=\"checkbox\"\n\t\t\t\t\t\tclass=\"p-input size-small flex-shrink-0\"\n\t\t\t\t\t\tchecked={this.active}\n\t\t\t\t\t/>\n\t\t\t\t)}\n\n\t\t\t\t<div class=\"text-container\">\n\t\t\t\t\t<slot />\n\t\t\t\t</div>\n\t\t\t</Host>\n\t\t);\n\t}\n}\n"],"version":3}
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { proxyCustomElement, HTMLElement, h, Host } from '@stencil/core/internal/client';
|
|
2
2
|
|
|
3
|
-
const layoutComponentCss = ".relative{position:relative!important}.sticky{position:sticky!important}.order-1{order:1!important}.order-2{order:2!important}.order-3{order:3!important}.box-border{box-sizing:border-box!important}.flex{display:flex!important}.grid{display:grid!important}.hidden{display:none!important}.h-full{height:100%!important}.h-screen{height:100vh!important}.w-full{width:100%!important}.w-screen{width:100vw!important}.w-
|
|
3
|
+
const layoutComponentCss = ".relative{position:relative!important}.sticky{position:sticky!important}.order-1{order:1!important}.order-2{order:2!important}.order-3{order:3!important}.box-border{box-sizing:border-box!important}.flex{display:flex!important}.grid{display:grid!important}.hidden{display:none!important}.h-full{height:100%!important}.h-screen{height:100vh!important}.w-full{width:100%!important}.w-screen{width:100vw!important}.w-unset{width:unset!important}.flex-1{flex:1 1 0%!important}.flex-col{flex-direction:column!important}.content-start{align-content:flex-start!important}.items-center{align-items:center!important}.overflow-y-auto{overflow-y:auto!important}.px-content-mobile-x{padding-left:1rem!important;padding-right:1rem!important}*{box-sizing:border-box}:host{align-content:flex-start;display:grid;gap:0;grid-template-areas:\"sidebar\" \"topbar\" \"content\";grid-template-columns:1fr;grid-template-rows:repeat(1fr,3);height:100vh;overflow:hidden;width:100vw}@media (min-width:80rem){:host{grid-template-areas:\"topbar topbar\" \"sidebar content\";grid-template-columns:auto 1fr;grid-template-rows:auto 1fr}}:host .content,:host .sidebar,:host .topbar{align-self:flex-start}:host .topbar{grid-area:topbar;order:2;position:sticky;width:100%}@media (min-width:80rem){:host .topbar{order:1}}:host .sidebar{box-sizing:border-box;display:flex;grid-area:sidebar;height:100%;order:1;width:100%}@media (min-width:80rem){:host .sidebar{order:2;width:15rem}}@media (min-width:105rem){:host .sidebar{width:18rem}}:host .content{display:flex;flex-direction:column;grid-area:content;height:100%;order:3;overflow-x:hidden;overflow-y:auto;padding:0 env(safe-area-inset-right) env(safe-area-inset-bottom) env(safe-area-inset-left);position:relative}:host .content .inner-content{padding:1.5rem 1rem;position:relative}@media (min-width:40rem){:host .content .inner-content{padding:2rem}}@media (min-width:80rem){:host .content .inner-content{padding:2rem 1.5rem 1.5rem;width:65rem}}@media (min-width:90rem){:host .content .inner-content{padding:2rem;width:75rem}}@media (min-width:96rem){:host .content .inner-content{width:81rem}}@media (min-width:105rem){:host .content .inner-content{width:87rem}}@media (min-width:120rem){:host .content .inner-content{padding-bottom:5rem;padding-left:5rem;padding-right:2rem;width:90rem}}@media (min-width:160rem){:host .content .inner-content{padding-bottom:7.5rem;padding-left:7.5rem;padding-top:4rem;width:92.5rem}}:host(.variant-default) .content{flex:1 1 0%}:host(.variant-login){grid-template-areas:\"topbar topbar\" \"content content\"}@media (min-width:80rem){:host(.variant-login){grid-template-areas:\"topbar topbar\" \"content sidebar\"}}:host(.variant-login) .sidebar{display:none;flex:1 1 0%;order:3;overflow:hidden;padding:.5rem;width:unset}@media (min-width:80rem){:host(.variant-login) .sidebar{display:flex}}:host(.variant-login) .sidebar .inner-content{padding:.5rem}:host(.variant-login) .content{align-items:center;order:3}@media (min-width:80rem){:host(.variant-login) .content{justify-content:center;order:2}}:host(.variant-login) .content .inner-content{box-sizing:border-box;padding:calc(env(safe-area-inset-top) + 3.5rem) 1rem 1.5rem;width:100%}@media (min-width:64rem){:host(.variant-login) .content .inner-content{padding-bottom:0;padding-top:0}}@media (min-width:80rem){:host(.variant-login) .content .inner-content{padding-left:4.5rem;padding-right:4.5rem;padding-top:1.5rem}}@media (min-width:40rem){:host(.variant-login) .content .inner-content{width:30rem}}@media (min-width:80rem){.layout-1280\\:flex{display:flex!important}.layout-1280\\:w-60{width:15rem!important}.layout-1280\\:w-content-1280{width:65rem!important}.layout-1280\\:p-6{padding:1.5rem!important}.layout-1280\\:px-18{padding-left:4.5rem!important;padding-right:4.5rem!important}}@media (min-width:90rem){.layout-1440\\:w-content-1440{width:75rem!important}}@media (min-width:120rem){.layout-1920\\:w-content-1920{width:90rem!important}.layout-1920\\:pl-20{padding-left:5rem!important}.layout-1920\\:pr-8{padding-right:2rem!important}}@media (min-width:160rem){.layout-2560\\:w-content-2560{width:92.5rem!important}.layout-2560\\:pb-\\[7\\.5rem\\]{padding-bottom:7.5rem!important}.layout-2560\\:pl-\\[7\\.5rem\\]{padding-left:7.5rem!important}.layout-2560\\:pt-16{padding-top:4rem!important}}.static{position:static!important}";
|
|
4
4
|
|
|
5
5
|
const Layout = /*@__PURE__*/ proxyCustomElement(class Layout extends HTMLElement {
|
|
6
6
|
constructor() {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"file":"p-layout.js","mappings":";;AAAA,MAAM,kBAAkB,GAAG,
|
|
1
|
+
{"file":"p-layout.js","mappings":";;AAAA,MAAM,kBAAkB,GAAG,wvIAAwvI;;MCOtwI,MAAM;;;;;mBAIqB,SAAS;;EAEhD,MAAM;IACL,QACC,EAAC,IAAI,IAAC,KAAK,EAAE,oBAAoB,IAAI,CAAC,OAAO,EAAE,IAC9C,WAAK,KAAK,EAAC,QAAQ,IAClB,YAAM,IAAI,EAAC,QAAQ,GAAG,CACjB,EACN,WAAK,KAAK,EAAC,SAAS,IACnB,YAAM,IAAI,EAAC,SAAS,GAAG,CAClB,EACN,WAAK,KAAK,EAAC,SAAS,IACnB,WAAK,KAAK,EAAC,eAAe,IACzB,YAAM,IAAI,EAAC,SAAS,GAAG,CAClB,CACD,CACA,EACN;GACF;;;;;;;;;;;;;;;;;;;;;;;;","names":[],"sources":["src/components/atoms/layout/layout.component.scss?tag=p-layout&encapsulation=shadow","src/components/atoms/layout/layout.component.tsx"],"sourcesContent":[":host {\n\t@apply grid h-screen w-screen content-start overflow-hidden;\n\n\tgrid-template-columns: 1fr;\n\tgrid-template-rows: repeat(1fr, 3);\n\tgap: 0;\n\tgrid-template-areas:\n\t\t'sidebar'\n\t\t'topbar'\n\t\t'content';\n\n\t@screen layout-1280 {\n\t\tgrid-template-columns: auto 1fr;\n\t\tgrid-template-rows: auto 1fr;\n\t\tgrid-template-areas:\n\t\t\t'topbar topbar'\n\t\t\t'sidebar content';\n\t}\n\n\t.topbar,\n\t.sidebar,\n\t.content {\n\t\t@apply self-start;\n\t}\n\n\t.topbar {\n\t\tgrid-area: topbar;\n\n\t\t@apply sticky w-full;\n\t\t@apply order-2 desktop-sm:order-1;\n\t}\n\n\t.sidebar {\n\t\tgrid-area: sidebar;\n\n\t\t@apply box-border flex h-full;\n\t\t@apply w-full;\n\t\t@apply layout-1280:w-60 layout-1680:w-72;\n\t\t@apply order-1 desktop-sm:order-2;\n\t}\n\n\t.content {\n\t\tgrid-area: content;\n\n\t\t@apply relative flex h-full flex-col overflow-y-auto overflow-x-hidden;\n\t\t@apply order-3;\n\n\t\tpadding: 0 env(safe-area-inset-right) env(safe-area-inset-bottom)\n\t\t\tenv(safe-area-inset-left);\n\n\t\t.inner-content {\n\t\t\t@apply relative pb-24;\n\n\t\t\t// https://linear.app/employes/issue/PRO-9053/%E2%9A%9B%EF%B8%8F-component-wijzigen-layout\n\t\t\t@apply px-content-mobile-x py-content-mobile-y;\n\t\t\t@apply tablet:p-8;\n\t\t\t@apply layout-1280:w-content-1280 layout-1280:p-6 layout-1280:pt-8;\n\t\t\t@apply layout-1440:w-content-1440 layout-1440:p-8;\n\t\t\t@apply layout-1536:w-content-1536;\n\t\t\t@apply layout-1680:w-content-1680;\n\t\t\t@apply layout-1920:w-content-1920 layout-1920:pr-8 layout-1920:pl-20 layout-1920:pb-20;\n\t\t\t@apply layout-2560:w-content-2560 layout-2560:pt-16 layout-2560:pl-[7.5rem] layout-2560:pb-[7.5rem];\n\t\t}\n\t}\n}\n\n:host(.variant-default) {\n\t.content {\n\t\t@apply flex-1;\n\t}\n}\n\n:host(.variant-login) {\n\tgrid-template-areas:\n\t\t'topbar topbar'\n\t\t'content content';\n\n\t@screen layout-1280 {\n\t\tgrid-template-areas:\n\t\t\t'topbar topbar'\n\t\t\t'content sidebar';\n\t}\n\n\t.sidebar {\n\t\t@apply hidden w-unset layout-1280:flex;\n\t\t@apply order-3 p-2;\n\t\t@apply flex-1 overflow-hidden;\n\n\t\t.inner-content {\n\t\t\t@apply p-2;\n\t\t}\n\t}\n\n\t.content {\n\t\t@apply order-3 layout-1280:order-2;\n\t\t@apply items-center layout-1280:justify-center;\n\n\t\t.inner-content {\n\t\t\t@apply box-border;\n\t\t\t@apply layout-1280:px-18 desktop-xs:py-0;\n\t\t\t@apply w-full tablet:w-content-desktop-login;\n\n\t\t\t@apply px-content-mobile-x py-content-mobile-y;\n\t\t\tpadding-top: calc(env(safe-area-inset-top) + 3.5rem);\n\n\t\t\t@screen layout-1280 {\n\t\t\t\t@apply pt-content-mobile-y;\n\t\t\t}\n\t\t}\n\t}\n}\n","import { Component, h, Host, Prop } from '@stencil/core';\n\n@Component({\n\ttag: 'p-layout',\n\tstyleUrl: 'layout.component.scss',\n\tshadow: true,\n})\nexport class Layout {\n\t/**\n\t * Variant of the layout\n\t */\n\t@Prop() variant: 'default' | 'login' = 'default';\n\n\trender() {\n\t\treturn (\n\t\t\t<Host class={`p-layout variant-${this.variant}`}>\n\t\t\t\t<div class=\"topbar\">\n\t\t\t\t\t<slot name=\"topbar\" />\n\t\t\t\t</div>\n\t\t\t\t<div class=\"sidebar\">\n\t\t\t\t\t<slot name=\"sidebar\" />\n\t\t\t\t</div>\n\t\t\t\t<div class=\"content\">\n\t\t\t\t\t<div class=\"inner-content\">\n\t\t\t\t\t\t<slot name=\"content\" />\n\t\t\t\t\t</div>\n\t\t\t\t</div>\n\t\t\t</Host>\n\t\t);\n\t}\n}\n"],"version":3}
|
|
@@ -4,7 +4,7 @@ import { d as defineCustomElement$4 } from './button.component.js';
|
|
|
4
4
|
import { d as defineCustomElement$3 } from './icon.component.js';
|
|
5
5
|
import { d as defineCustomElement$2 } from './loader.component.js';
|
|
6
6
|
|
|
7
|
-
const navbarComponentCss = ".fixed{position:fixed!important}.left-0{left:0!important}.top-0{top:0!important}.z-navbar{z-index:300!important}.mt-auto{margin-top:auto!important}.block{display:block!important}.flex{display:flex!important}.hidden{display:none!important}.h-screen{height:100vh!important}.w-60{width:15rem!important}.w-full{width:100%!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}.items-center{align-items:center!important}.justify-between{justify-content:space-between!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-mystic-dark{--tw-border-opacity:1!important;border-color:rgb(218 230 240/var(--tw-border-opacity))!important}.px-4{padding-left:1rem!important;padding-right:1rem!important}*{box-sizing:border-box}:host{max-height:calc(100vh - env(safe-area-inset-top) - env(safe-area-inset-bottom));width:100%}@media (min-width:
|
|
7
|
+
const navbarComponentCss = ".fixed{position:fixed!important}.left-0{left:0!important}.top-0{top:0!important}.z-navbar{z-index:300!important}.mt-auto{margin-top:auto!important}.block{display:block!important}.flex{display:flex!important}.hidden{display:none!important}.h-screen{height:100vh!important}.w-60{width:15rem!important}.w-full{width:100%!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}.items-center{align-items:center!important}.justify-between{justify-content:space-between!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-mystic-dark{--tw-border-opacity:1!important;border-color:rgb(218 230 240/var(--tw-border-opacity))!important}.px-4{padding-left:1rem!important;padding-right:1rem!important}*{box-sizing:border-box}:host{max-height:calc(100vh - env(safe-area-inset-top) - env(safe-area-inset-bottom));width:100%}@media (min-width:80rem){:host{width:15rem}}@media (min-width:105rem){:host{width:18rem}}:host .sidebar,:host .sidebar .company,:host .sidebar .content,:host .sidebar .user,:host .userbar{display:flex;flex-direction:column;width:100%}:host .sidebar,:host .top-bar{--tw-bg-opacity:1;--tw-border-opacity:1!important;background-color:rgb(255 255 255/var(--tw-bg-opacity));border-color:rgb(218 230 240/var(--tw-border-opacity))!important;border-style:solid!important;border-width:0!important}:host .sidebar{--tw-bg-opacity:1;--tw-translate-x:-100%;background-color:rgb(255 255 255/var(--tw-bg-opacity));border-right-width:1px!important;gap:1.5rem;height:100vh;left:0;padding-bottom:1rem;padding-top:calc(env(safe-area-inset-top, 0) + 1rem);position:fixed;top:0;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));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));transition-duration:.15s;transition-property:all;transition-timing-function:cubic-bezier(.4,0,.2,1);width:15rem;will-change:transform;z-index:300}@media (min-width:80rem){:host .sidebar{--tw-translate-x:0px;height:100%;position:relative;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));width:100%}}:host .sidebar .company,:host .sidebar .content,:host .sidebar .header,:host .sidebar .user{padding-left:1rem;padding-right:1rem}:host .sidebar .header{align-items:center;display:flex;justify-content:space-between;width:100%}@media (min-width:80rem){:host .sidebar .header{display:none}}:host .sidebar .content{overflow-y:auto;scrollbar-color:#528afa #dae6f0;scrollbar-width:thin}:host .sidebar .content::-webkit-scrollbar{width:.25rem}:host .sidebar .content::-webkit-scrollbar-track{background:#dae6f0}:host .sidebar .content::-webkit-scrollbar-thumb{background:#528afa}:host .sidebar .content::-webkit-scrollbar-thumb:hover{background:#528afa}:host .sidebar .user{display:none;margin-top:auto}@media (min-width:80rem){:host .sidebar .user{display:flex}}:host .sidebar.show{--tw-translate-x:env(safe-area-inset-left,0)}:host .top-bar{border-bottom-width:1px!important;display:flex;height:calc(env(safe-area-inset-top, 0) + 3rem);justify-content:space-between;padding:calc(env(safe-area-inset-top, 0) + .5rem) 1rem .5rem;width:100%}@media (min-width:80rem){:host .top-bar{display:none}}:host p-backdrop{display:none}:host p-backdrop.show{display:block}@media (min-width:80rem){.layout-1280\\:relative{position:relative!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}}.static{position:static!important}.z-navbar-backdrop{z-index:290!important}.m-0{margin:0!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))!important}@media (min-width:64rem){.desktop-xs\\:hidden{display:none!important}}";
|
|
8
8
|
|
|
9
9
|
const Navbar = /*@__PURE__*/ proxyCustomElement(class Navbar extends HTMLElement {
|
|
10
10
|
constructor() {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"file":"p-navbar.js","mappings":";;;;;;AAAA,MAAM,kBAAkB,GAAG,
|
|
1
|
+
{"file":"p-navbar.js","mappings":";;;;;;AAAA,MAAM,kBAAkB,GAAG,ynJAAynJ;;MCOvoJ,MAAM;;;;;qBAIE,OAAO;oBAKR,MAAM;qBAEI,KAAK;;EAElC,MAAM;IACL,QACC,EAAC,IAAI,IAAC,KAAK,EAAC,UAAU,IACrB,kBACC,SAAS,EAAE,IAAI,EACf,KAAK,EAAE,uCACN,IAAI,CAAC,SAAS,IAAI,MACnB,EAAE,EACF,SAAS,EAAE,OAAO,IAAI,CAAC,SAAS,GAAG,KAAK,CAAC,GAC5B,EACd,WAAK,KAAK,EAAE,WAAW,IAAI,CAAC,SAAS,IAAI,MAAM,EAAE,IAChD,WAAK,KAAK,EAAC,QAAQ,IAClB,SAAG,KAAK,EAAC,2CAA2C,IAClD,IAAI,CAAC,QAAQ,CACX,EAEJ,gBACC,OAAO,EAAC,WAAW,EACnB,IAAI,EAAC,UAAU,EACf,YAAY,EAAC,KAAK,EAClB,IAAI,EAAC,OAAO,EACZ,OAAO,EAAE,OAAO,IAAI,CAAC,SAAS,GAAG,KAAK,CAAC,IAEtC,IAAI,CAAC,SAAS,CACL,CACN,EACN,WAAK,KAAK,EAAC,SAAS,IACnB,YAAM,IAAI,EAAC,SAAS,GAAG,CAClB,EACN,WAAK,KAAK,EAAC,SAAS,IACnB,YAAM,IAAI,EAAC,SAAS,GAAG,CAClB,EAEN,WAAK,KAAK,EAAC,MAAM,IAChB,YAAM,IAAI,EAAC,MAAM,GAAG,CACf,CACD,EAEN,WAAK,KAAK,EAAC,SAAS,IACnB,gBACC,OAAO,EAAC,WAAW,EACnB,IAAI,EAAC,MAAM,EACX,IAAI,EAAC,OAAO,EACZ,OAAO,EAAE,OAAO,IAAI,CAAC,SAAS,GAAG,IAAI,CAAC,IAErC,IAAI,CAAC,QAAQ,CACJ,EAEX,YAAM,IAAI,EAAC,QAAQ,GAAG,CACjB,CACA,EACN;GACF;EAGD,iBAAiB;IAChB,IAAI,CAAC,SAAS,GAAG,KAAK,CAAC;GACvB;EAGD,gBAAgB;IACf,IAAI,CAAC,SAAS,GAAG,IAAI,CAAC;GACtB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":[],"sources":["src/components/organisms/navbar/navbar.component.scss?tag=p-navbar&encapsulation=shadow","src/components/organisms/navbar/navbar.component.tsx"],"sourcesContent":["@import '../../../style/mixins';\n\n:host {\n\t@apply w-full max-h-screen-safe;\n\t@apply layout-1280:w-60 layout-1680:w-72;\n\n\t.sidebar,\n\t.sidebar .company,\n\t.sidebar .content,\n\t.sidebar .user,\n\t.userbar {\n\t\t@apply flex w-full flex-col;\n\t}\n\n\t.sidebar,\n\t.top-bar {\n\t\t@apply bg-white;\n\t\t@apply border-0 border-solid border-mystic-dark #{!important};\n\t}\n\n\t.sidebar {\n\t\t@apply fixed top-0 left-0 z-navbar h-screen w-60 bg-white;\n\t\t@apply layout-1280:relative layout-1280:h-full layout-1280:w-full;\n\t\t@apply gap-6;\n\n\t\t@apply will-change-transform;\n\t\t@apply -translate-x-full transform-gpu layout-1280:translate-x-0;\n\n\t\t@apply py-4;\n\n\t\tpadding-top: calc(env(safe-area-inset-top, 0) + 1rem);\n\n\t\t@apply border-r #{!important};\n\n\t\t@apply transition-all;\n\n\t\t.company,\n\t\t.content,\n\t\t.user,\n\t\t.header {\n\t\t\t@apply px-4;\n\t\t}\n\n\t\t.header {\n\t\t\t@apply flex w-full items-center justify-between;\n\t\t\t@apply layout-1280:hidden;\n\t\t}\n\n\t\t.content {\n\t\t\t@apply overflow-y-auto;\n\n\t\t\t@include scrollbarY();\n\t\t}\n\n\t\t.user {\n\t\t\t@apply mt-auto hidden;\n\t\t\t@apply layout-1280:flex;\n\t\t}\n\n\t\t&.show {\n\t\t\t--tw-translate-x: env(safe-area-inset-left, 0);\n\t\t}\n\t}\n\n\t.top-bar {\n\t\t@apply flex w-full justify-between px-4 py-2;\n\n\t\tpadding-top: calc(env(safe-area-inset-top, 0) + 0.5rem);\n\t\theight: calc(env(safe-area-inset-top, 0) + 3rem);\n\n\t\t@apply border-b #{!important};\n\n\t\t@apply layout-1280:hidden;\n\t}\n\n\tp-backdrop {\n\t\t@apply hidden;\n\n\t\t&.show {\n\t\t\t@apply block;\n\t\t}\n\t}\n}\n","import { Component, h, Host, Listen, Prop, State } from '@stencil/core';\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 close button\n\t */\n\t@Prop() closeText = 'Close';\n\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 _showMenu = false;\n\n\trender() {\n\t\treturn (\n\t\t\t<Host class=\"p-navbar\">\n\t\t\t\t<p-backdrop\n\t\t\t\t\tapplyBlur={true}\n\t\t\t\t\tclass={`z-navbar-backdrop desktop-xs:hidden ${\n\t\t\t\t\t\tthis._showMenu && 'show'\n\t\t\t\t\t}`}\n\t\t\t\t\tonClicked={() => (this._showMenu = false)}\n\t\t\t\t></p-backdrop>\n\t\t\t\t<div class={`sidebar ${this._showMenu && 'show'}`}>\n\t\t\t\t\t<div class=\"header\">\n\t\t\t\t\t\t<p class=\"text-xl m-0 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\tsize=\"small\"\n\t\t\t\t\t\t\tonClick={() => (this._showMenu = false)}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{this.closeText}\n\t\t\t\t\t\t</p-button>\n\t\t\t\t\t</div>\n\t\t\t\t\t<div class=\"company\">\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=\"content\">\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=\"user\">\n\t\t\t\t\t\t<slot name=\"user\" />\n\t\t\t\t\t</div>\n\t\t\t\t</div>\n\n\t\t\t\t<div class=\"top-bar\">\n\t\t\t\t\t<p-button\n\t\t\t\t\t\tvariant=\"secondary\"\n\t\t\t\t\t\ticon=\"menu\"\n\t\t\t\t\t\tsize=\"small\"\n\t\t\t\t\t\tonClick={() => (this._showMenu = true)}\n\t\t\t\t\t>\n\t\t\t\t\t\t{this.menuText}\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._showMenu = false;\n\t}\n\n\t@Listen('openNavbar', { target: 'window' })\n\thandleOpenNavbar() {\n\t\tthis._showMenu = true;\n\t}\n}\n"],"version":3}
|
|
@@ -143,7 +143,7 @@ const Dropdown = class {
|
|
|
143
143
|
};
|
|
144
144
|
Dropdown.style = dropdownComponentCss;
|
|
145
145
|
|
|
146
|
-
const dropdownMenuItemComponentCss = ".block{display:block!important}.flex{display:flex!important}.h-4{height:1rem!important}.h-6{height:1.5rem!important}.h-8{height:2rem!important}.w-4{width:1rem!important}.w-6{width:1.5rem!important}.w-\\[2\\.375rem\\]{width:2.375rem!important}.w-full{width:100%!important}.translate-x-0{--tw-translate-x:0px!important}.translate-x-0,.translate-x-3{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}.translate-x-3{--tw-translate-x:0.75rem!important}.transform{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}.appearance-none{-webkit-appearance:none!important;-moz-appearance:none!important;appearance:none!important}.items-center{align-items:center!important}.gap-2{gap:.5rem!important}.overflow-hidden{overflow:hidden!important}.text-ellipsis{text-overflow:ellipsis!important}.rounded{border-radius:.25rem!important}.border{border-width:1px!important}.border-solid{border-style:solid!important}.border-indigo{--tw-border-opacity:1!important;border-color:rgb(82 138 250/var(--tw-border-opacity))!important}.border-negative{--tw-border-opacity:1!important;border-color:rgb(185 30 40/var(--tw-border-opacity))!important}.bg-indigo-light{--tw-bg-opacity:1!important;background-color:rgb(241 246 255/var(--tw-bg-opacity))!important}.bg-mystic-dark{background-color:rgb(218 230 240/var(--tw-bg-opacity))!important}.bg-mystic-dark,.bg-white{--tw-bg-opacity:1!important}.bg-white{background-color:rgb(255 255 255/var(--tw-bg-opacity))!important}.bg-center{background-position:50%!important}.text-sm{font-size:.875rem!important;line-height:1.25rem!important}.font-semibold{font-weight:600!important}.outline-none{outline:2px solid transparent!important;outline-offset:2px!important}.transition-transform{transition-duration:.15s!important;transition-property:transform!important;transition-timing-function:cubic-bezier(.4,0,.2,1)!important}*{box-sizing:border-box}:host{--tw-text-opacity:1;align-items:center;border-radius:.25rem;color:rgb(81 83 107/var(--tw-text-opacity));cursor:pointer;display:flex;font-size:.875rem;font-weight:600;gap:.5rem;height:2rem;line-height:1.25rem;padding-left:.5rem;padding-right:.5rem;width:100%}:host input[type=checkbox].p-input{--tw-bg-opacity:1;--tw-border-opacity:1;-webkit-appearance:none;-moz-appearance:none;appearance:none;background-color:rgb(255 255 255/var(--tw-bg-opacity));background-position:50%;background-repeat:no-repeat;background-size:1rem;border-color:rgb(218 230 240/var(--tw-border-opacity));border-radius:.25rem;border-style:solid;border-width:1px;height:1.5rem;outline:2px solid transparent!important;outline-offset:2px!important;width:1.5rem}:host input[type=checkbox].p-input+label{margin-left:.2rem;margin-top:.05rem}:host input[type=checkbox].p-input:hover:not(:disabled):not([disabled]):not(.disabled){cursor:pointer}:host input[type=checkbox].p-input:hover:not(:disabled):not([disabled]):not(.disabled):not(:checked):not([checked]):not(.checked):not(:indeterminate):not([indeterminate]):not(.indeterminate){--tw-border-opacity:1;background-image:url(\"data:image/svg+xml;charset=utf-8,%3Csvg width='1em' height='1em' viewBox='0 0 16 16' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M5.965 11.487 13.53 1.53c.435-.572 1.22-.7 1.8-.292l.108.077c.294.206.492.53.546.895.054.365-.04.737-.26 1.026L7.26 14.38a1.34 1.34 0 0 1-.642.463 1.302 1.302 0 0 1-1.575-.263L.362 9.6a1.356 1.356 0 0 1-.36-.99c.017-.37.181-.713.452-.95l.1-.088a1.302 1.302 0 0 1 1.82.093l3.592 3.82h-.001Z' fill='%23dae6f0' fill-rule='evenodd'/%3E%3C/svg%3E\");border-color:rgb(82 138 250/var(--tw-border-opacity))}:host input[type=checkbox].p-input.checked,:host input[type=checkbox].p-input.indeterminate,:host input[type=checkbox].p-input:checked,:host input[type=checkbox].p-input:indeterminate,:host input[type=checkbox].p-input[checked],:host input[type=checkbox].p-input[indeterminate]{--tw-border-opacity:1;--tw-bg-opacity:1;background-color:rgb(82 138 250/var(--tw-bg-opacity));border-color:rgb(82 138 250/var(--tw-border-opacity))}:host input[type=checkbox].p-input.checked,:host input[type=checkbox].p-input:checked,:host input[type=checkbox].p-input[checked]{background-image:url(\"data:image/svg+xml;charset=utf-8,%3Csvg width='1em' height='1em' viewBox='0 0 16 16' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M5.965 11.487 13.53 1.53c.435-.572 1.22-.7 1.8-.292l.108.077c.294.206.492.53.546.895.054.365-.04.737-.26 1.026L7.26 14.38a1.34 1.34 0 0 1-.642.463 1.302 1.302 0 0 1-1.575-.263L.362 9.6a1.356 1.356 0 0 1-.36-.99c.017-.37.181-.713.452-.95l.1-.088a1.302 1.302 0 0 1 1.82.093l3.592 3.82h-.001Z' fill='%23fff' fill-rule='evenodd'/%3E%3C/svg%3E\")}:host input[type=checkbox].p-input.indeterminate,:host input[type=checkbox].p-input:indeterminate,:host input[type=checkbox].p-input[indeterminate]{background-image:url(\"data:image/svg+xml;charset=utf-8,%3Csvg width='1em' height='1em' viewBox='0 0 16 16' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M4 7h8a1 1 0 0 1 0 2H4a1 1 0 1 1 0-2Z' fill='%23fff' fill-rule='evenodd'/%3E%3C/svg%3E\")}:host input[type=checkbox].p-input.disabled,:host input[type=checkbox].p-input:disabled,:host input[type=checkbox].p-input[disabled]{opacity:.4}:host input[type=checkbox].p-input.error,:host input[type=checkbox].p-input[error]{--tw-text-opacity:1;--tw-border-opacity:1!important;border-color:rgb(185 30 40/var(--tw-border-opacity))!important;color:rgb(138 15 29/var(--tw-text-opacity))}:host input[type=checkbox].p-input.error::-moz-placeholder,:host input[type=checkbox].p-input[error]::-moz-placeholder{--tw-text-opacity:1;color:rgb(255 204 211/var(--tw-text-opacity))}:host input[type=checkbox].p-input.error::placeholder,:host input[type=checkbox].p-input[error]::placeholder{--tw-text-opacity:1;color:rgb(255 204 211/var(--tw-text-opacity))}:host input[type=checkbox].p-input.error.checked,:host input[type=checkbox].p-input.error:checked,:host input[type=checkbox].p-input.error[checked],:host input[type=checkbox].p-input[error].checked,:host input[type=checkbox].p-input[error]:checked,:host input[type=checkbox].p-input[error][checked]{--tw-bg-opacity:1;background-color:rgb(185 30 40/var(--tw-bg-opacity))}:host input[type=checkbox].p-input.size-small{font-size:.75rem;height:1rem;line-height:1rem;width:1rem}:host input[type=checkbox].p-toggle{--tw-bg-opacity:1;--tw-border-opacity:1;align-items:center;-webkit-appearance:none;-moz-appearance:none;appearance:none;background-color:rgb(255 255 255/var(--tw-bg-opacity));border-color:rgb(218 230 240/var(--tw-border-opacity));border-radius:1.5625rem;border-style:solid;border-width:1px;display:flex;height:1.5rem;justify-content:flex-start;padding:.25rem;width:2.375rem}:host input[type=checkbox].p-toggle:after{--tw-translate-x:0px;--tw-bg-opacity:1;background-color:rgb(218 230 240/var(--tw-bg-opacity));border-radius:100%;content:\"\";display:block;height:1rem;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));transition-duration:.1s;transition-property:transform;transition-timing-function:cubic-bezier(.4,0,.2,1);width:1rem}:host input[type=checkbox].p-toggle.checked,:host input[type=checkbox].p-toggle:checked,:host input[type=checkbox].p-toggle[checked]{--tw-border-opacity:1;--tw-bg-opacity:1;background-color:rgb(82 138 250/var(--tw-bg-opacity));border-color:rgb(82 138 250/var(--tw-border-opacity))}:host input[type=checkbox].p-toggle.checked:after,:host input[type=checkbox].p-toggle:checked:after,:host input[type=checkbox].p-toggle[checked]:after{--tw-translate-x:0.75rem;--tw-bg-opacity:1;background-color:rgb(255 255 255/var(--tw-bg-opacity));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))}:host input[type=checkbox].p-toggle.disabled,:host input[type=checkbox].p-toggle:disabled,:host input[type=checkbox].p-toggle[disabled]{opacity:.4}:host input[type=checkbox].p-toggle:hover:not(:disabled):not([disabled]):not(.disabled){cursor:pointer}:host input[type=checkbox].p-toggle:hover:not(:disabled):not([disabled]):not(.disabled):not(:checked):not([checked]):not(.checked){--tw-border-opacity:1;border-color:rgb(82 138 250/var(--tw-border-opacity))}:host input[type=checkbox].p-toggle.error,:host input[type=checkbox].p-toggle[error]{--tw-text-opacity:1;--tw-border-opacity:1!important;border-color:rgb(185 30 40/var(--tw-border-opacity))!important;color:rgb(138 15 29/var(--tw-text-opacity))}:host input[type=checkbox].p-toggle.error::-moz-placeholder,:host input[type=checkbox].p-toggle[error]::-moz-placeholder{--tw-text-opacity:1;color:rgb(255 204 211/var(--tw-text-opacity))}:host input[type=checkbox].p-toggle.error::placeholder,:host input[type=checkbox].p-toggle[error]::placeholder{--tw-text-opacity:1;color:rgb(255 204 211/var(--tw-text-opacity))}:host input[type=checkbox].p-toggle.error.checked,:host input[type=checkbox].p-toggle.error:checked,:host input[type=checkbox].p-toggle.error[checked],:host input[type=checkbox].p-toggle[error].checked,:host input[type=checkbox].p-toggle[error]:checked,:host input[type=checkbox].p-toggle[error][checked]{--tw-bg-opacity:1;background-color:rgb(185 30 40/var(--tw-bg-opacity))}:host .text-container{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;width:100%}:host(.hover:hover){--tw-bg-opacity:1;--tw-text-opacity:1;background-color:rgb(241 246 255/var(--tw-bg-opacity));color:rgb(81 83 107/var(--tw-text-opacity))}:host(.active){--tw-bg-opacity:1;--tw-text-opacity:1;background-color:rgb(241 246 255/var(--tw-bg-opacity));color:rgb(82 138 250/var(--tw-text-opacity))}.static{position:static!important}.flex-shrink-0{flex-shrink:0!important}";
|
|
146
|
+
const dropdownMenuItemComponentCss = ".block{display:block!important}.flex{display:flex!important}.h-4{height:1rem!important}.h-6{height:1.5rem!important}.h-8{height:2rem!important}.w-4{width:1rem!important}.w-6{width:1.5rem!important}.w-\\[2\\.375rem\\]{width:2.375rem!important}.w-full{width:100%!important}.translate-x-0{--tw-translate-x:0px!important}.translate-x-0,.translate-x-3{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}.translate-x-3{--tw-translate-x:0.75rem!important}.transform{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}.appearance-none{-webkit-appearance:none!important;-moz-appearance:none!important;appearance:none!important}.items-center{align-items:center!important}.gap-2{gap:.5rem!important}.overflow-hidden{overflow:hidden!important}.text-ellipsis{text-overflow:ellipsis!important}.rounded{border-radius:.25rem!important}.border{border-width:1px!important}.border-solid{border-style:solid!important}.border-indigo{--tw-border-opacity:1!important;border-color:rgb(82 138 250/var(--tw-border-opacity))!important}.border-negative{--tw-border-opacity:1!important;border-color:rgb(185 30 40/var(--tw-border-opacity))!important}.bg-indigo-light{--tw-bg-opacity:1!important;background-color:rgb(241 246 255/var(--tw-bg-opacity))!important}.bg-mystic-dark{background-color:rgb(218 230 240/var(--tw-bg-opacity))!important}.bg-mystic-dark,.bg-white{--tw-bg-opacity:1!important}.bg-white{background-color:rgb(255 255 255/var(--tw-bg-opacity))!important}.bg-center{background-position:50%!important}.text-sm{font-size:.875rem!important;line-height:1.25rem!important}.font-semibold{font-weight:600!important}.outline-none{outline:2px solid transparent!important;outline-offset:2px!important}.transition-transform{transition-duration:.15s!important;transition-property:transform!important;transition-timing-function:cubic-bezier(.4,0,.2,1)!important}*{box-sizing:border-box}:host{--tw-text-opacity:1;align-items:center;border-radius:.25rem;color:rgb(81 83 107/var(--tw-text-opacity));cursor:pointer;display:flex;font-size:.875rem;font-weight:600;gap:.5rem;height:2rem;line-height:1.25rem;padding-left:.5rem;padding-right:.5rem;width:100%}:host input[type=checkbox].p-input{--tw-bg-opacity:1;--tw-border-opacity:1;-webkit-appearance:none;-moz-appearance:none;appearance:none;background-color:rgb(255 255 255/var(--tw-bg-opacity));background-position:50%;background-repeat:no-repeat;background-size:1rem;border-color:rgb(218 230 240/var(--tw-border-opacity));border-radius:.25rem;border-style:solid;border-width:1px;height:1.5rem;outline:2px solid transparent!important;outline-offset:2px!important;width:1.5rem}:host input[type=checkbox].p-input+label{margin-left:.2rem;margin-top:.05rem}:host input[type=checkbox].p-input:hover:not(:disabled):not([disabled]):not(.disabled){cursor:pointer}:host input[type=checkbox].p-input:hover:not(:disabled):not([disabled]):not(.disabled):not(:checked):not([checked]):not(.checked):not(:indeterminate):not([indeterminate]):not(.indeterminate){--tw-border-opacity:1;background-image:url(\"data:image/svg+xml;charset=utf-8,%3Csvg width='1em' height='1em' viewBox='0 0 16 16' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M5.965 11.487 13.53 1.53c.435-.572 1.22-.7 1.8-.292l.108.077c.294.206.492.53.546.895.054.365-.04.737-.26 1.026L7.26 14.38a1.34 1.34 0 0 1-.642.463 1.302 1.302 0 0 1-1.575-.263L.362 9.6a1.356 1.356 0 0 1-.36-.99c.017-.37.181-.713.452-.95l.1-.088a1.302 1.302 0 0 1 1.82.093l3.592 3.82h-.001Z' fill='%23dae6f0' fill-rule='evenodd'/%3E%3C/svg%3E\");border-color:rgb(82 138 250/var(--tw-border-opacity))}:host input[type=checkbox].p-input.checked,:host input[type=checkbox].p-input.indeterminate,:host input[type=checkbox].p-input:checked,:host input[type=checkbox].p-input:indeterminate,:host input[type=checkbox].p-input[checked],:host input[type=checkbox].p-input[indeterminate]{--tw-border-opacity:1;--tw-bg-opacity:1;background-color:rgb(82 138 250/var(--tw-bg-opacity));border-color:rgb(82 138 250/var(--tw-border-opacity))}:host input[type=checkbox].p-input.checked,:host input[type=checkbox].p-input:checked,:host input[type=checkbox].p-input[checked]{background-image:url(\"data:image/svg+xml;charset=utf-8,%3Csvg width='1em' height='1em' viewBox='0 0 16 16' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M5.965 11.487 13.53 1.53c.435-.572 1.22-.7 1.8-.292l.108.077c.294.206.492.53.546.895.054.365-.04.737-.26 1.026L7.26 14.38a1.34 1.34 0 0 1-.642.463 1.302 1.302 0 0 1-1.575-.263L.362 9.6a1.356 1.356 0 0 1-.36-.99c.017-.37.181-.713.452-.95l.1-.088a1.302 1.302 0 0 1 1.82.093l3.592 3.82h-.001Z' fill='%23fff' fill-rule='evenodd'/%3E%3C/svg%3E\")}:host input[type=checkbox].p-input.indeterminate,:host input[type=checkbox].p-input:indeterminate,:host input[type=checkbox].p-input[indeterminate]{background-image:url(\"data:image/svg+xml;charset=utf-8,%3Csvg width='1em' height='1em' viewBox='0 0 16 16' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M4 7h8a1 1 0 0 1 0 2H4a1 1 0 1 1 0-2Z' fill='%23fff' fill-rule='evenodd'/%3E%3C/svg%3E\")}:host input[type=checkbox].p-input.disabled,:host input[type=checkbox].p-input:disabled,:host input[type=checkbox].p-input[disabled]{opacity:.4}:host input[type=checkbox].p-input.error,:host input[type=checkbox].p-input[error]{--tw-text-opacity:1;--tw-border-opacity:1!important;border-color:rgb(185 30 40/var(--tw-border-opacity))!important;color:rgb(138 15 29/var(--tw-text-opacity))}:host input[type=checkbox].p-input.error::-moz-placeholder,:host input[type=checkbox].p-input[error]::-moz-placeholder{--tw-text-opacity:1;color:rgb(255 204 211/var(--tw-text-opacity))}:host input[type=checkbox].p-input.error::placeholder,:host input[type=checkbox].p-input[error]::placeholder{--tw-text-opacity:1;color:rgb(255 204 211/var(--tw-text-opacity))}:host input[type=checkbox].p-input.error.checked,:host input[type=checkbox].p-input.error:checked,:host input[type=checkbox].p-input.error[checked],:host input[type=checkbox].p-input[error].checked,:host input[type=checkbox].p-input[error]:checked,:host input[type=checkbox].p-input[error][checked]{--tw-bg-opacity:1;background-color:rgb(185 30 40/var(--tw-bg-opacity))}:host input[type=checkbox].p-input.size-small{height:1rem;width:1rem}:host input[type=checkbox].p-input.size-small:hover:not(:disabled):not([disabled]):not(.disabled):not(:checked):not([checked]):not(.checked):not(:indeterminate):not([indeterminate]):not(.indeterminate){background-image:url(\"data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16'%3E%3Cg fill='none' fill-rule='evenodd'%3E%3Cpath d='M2.667 2.667h10.667v10.667H2.667z'/%3E%3Cpath fill='%23DAE6F0' d='m6.644 10.325 5.044-6.638a.87.87 0 0 1 1.2-.194l.072.05a.91.91 0 0 1 .19 1.28l-5.644 7.43a.89.89 0 0 1-.427.31.868.868 0 0 1-1.05-.176l-3.12-3.32a.904.904 0 0 1-.241-.66.897.897 0 0 1 .302-.633l.067-.058a.868.868 0 0 1 1.213.062l2.394 2.547Z'/%3E%3C/g%3E%3C/svg%3E\")}:host input[type=checkbox].p-input.size-small.checked,:host input[type=checkbox].p-input.size-small:checked,:host input[type=checkbox].p-input.size-small[checked]{background-image:url(\"data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16'%3E%3Cg fill='none' fill-rule='evenodd'%3E%3Cpath d='M2.667 2.667h10.667v10.667H2.667z'/%3E%3Cpath fill='%23FFF' d='m6.644 10.325 5.044-6.638a.87.87 0 0 1 1.2-.194l.072.05a.91.91 0 0 1 .19 1.28l-5.644 7.43a.89.89 0 0 1-.427.31.868.868 0 0 1-1.05-.176l-3.12-3.32a.904.904 0 0 1-.241-.66.897.897 0 0 1 .302-.633l.067-.058a.868.868 0 0 1 1.213.062l2.394 2.547Z'/%3E%3C/g%3E%3C/svg%3E\")}:host input[type=checkbox].p-toggle{--tw-bg-opacity:1;--tw-border-opacity:1;align-items:center;-webkit-appearance:none;-moz-appearance:none;appearance:none;background-color:rgb(255 255 255/var(--tw-bg-opacity));border-color:rgb(218 230 240/var(--tw-border-opacity));border-radius:1.5625rem;border-style:solid;border-width:1px;display:flex;height:1.5rem;justify-content:flex-start;padding:.25rem;width:2.375rem}:host input[type=checkbox].p-toggle:after{--tw-translate-x:0px;--tw-bg-opacity:1;background-color:rgb(218 230 240/var(--tw-bg-opacity));border-radius:100%;content:\"\";display:block;height:1rem;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));transition-duration:.1s;transition-property:transform;transition-timing-function:cubic-bezier(.4,0,.2,1);width:1rem}:host input[type=checkbox].p-toggle.checked,:host input[type=checkbox].p-toggle:checked,:host input[type=checkbox].p-toggle[checked]{--tw-border-opacity:1;--tw-bg-opacity:1;background-color:rgb(82 138 250/var(--tw-bg-opacity));border-color:rgb(82 138 250/var(--tw-border-opacity))}:host input[type=checkbox].p-toggle.checked:after,:host input[type=checkbox].p-toggle:checked:after,:host input[type=checkbox].p-toggle[checked]:after{--tw-translate-x:0.75rem;--tw-bg-opacity:1;background-color:rgb(255 255 255/var(--tw-bg-opacity));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))}:host input[type=checkbox].p-toggle.disabled,:host input[type=checkbox].p-toggle:disabled,:host input[type=checkbox].p-toggle[disabled]{opacity:.4}:host input[type=checkbox].p-toggle:hover:not(:disabled):not([disabled]):not(.disabled){cursor:pointer}:host input[type=checkbox].p-toggle:hover:not(:disabled):not([disabled]):not(.disabled):not(:checked):not([checked]):not(.checked){--tw-border-opacity:1;border-color:rgb(82 138 250/var(--tw-border-opacity))}:host input[type=checkbox].p-toggle.error,:host input[type=checkbox].p-toggle[error]{--tw-text-opacity:1;--tw-border-opacity:1!important;border-color:rgb(185 30 40/var(--tw-border-opacity))!important;color:rgb(138 15 29/var(--tw-text-opacity))}:host input[type=checkbox].p-toggle.error::-moz-placeholder,:host input[type=checkbox].p-toggle[error]::-moz-placeholder{--tw-text-opacity:1;color:rgb(255 204 211/var(--tw-text-opacity))}:host input[type=checkbox].p-toggle.error::placeholder,:host input[type=checkbox].p-toggle[error]::placeholder{--tw-text-opacity:1;color:rgb(255 204 211/var(--tw-text-opacity))}:host input[type=checkbox].p-toggle.error.checked,:host input[type=checkbox].p-toggle.error:checked,:host input[type=checkbox].p-toggle.error[checked],:host input[type=checkbox].p-toggle[error].checked,:host input[type=checkbox].p-toggle[error]:checked,:host input[type=checkbox].p-toggle[error][checked]{--tw-bg-opacity:1;background-color:rgb(185 30 40/var(--tw-bg-opacity))}:host .text-container{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;width:100%}:host(.hover:hover){--tw-bg-opacity:1;--tw-text-opacity:1;background-color:rgb(241 246 255/var(--tw-bg-opacity));color:rgb(81 83 107/var(--tw-text-opacity))}:host(.active){--tw-bg-opacity:1;--tw-text-opacity:1;background-color:rgb(241 246 255/var(--tw-bg-opacity));color:rgb(82 138 250/var(--tw-text-opacity))}.static{position:static!important}.flex-shrink-0{flex-shrink:0!important}";
|
|
147
147
|
|
|
148
148
|
const DropdownMenuItem = class {
|
|
149
149
|
constructor(hostRef) {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"file":"p-dropdown.p-dropdown-menu-item.entry.js","mappings":"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","names":[],"sources":["src/components/molecules/dropdown/dropdown.component.scss?tag=p-dropdown&encapsulation=shadow","src/components/molecules/dropdown/dropdown.component.tsx","src/components/atoms/dropdown-menu-item/dropdown-menu-item.component.scss?tag=p-dropdown-menu-item&encapsulation=shadow","src/components/atoms/dropdown-menu-item/dropdown-menu-item.component.tsx"],"sourcesContent":[":host {\n\t@apply relative block;\n\n\t.trigger {\n\t\t@apply relative block h-auto w-auto;\n\t}\n\n\tp-dropdown-menu-container {\n\t\t@apply left-0 top-0 z-dropdown hidden;\n\n\t\t&[data-show] {\n\t\t\t@apply flex;\n\t\t}\n\n\t\t&[data-strategy='absolute'] {\n\t\t\t@apply absolute;\n\t\t}\n\n\t\t&[data-strategy='fixed'] {\n\t\t\t@apply fixed;\n\t\t}\n\t}\n}\n","import {\n\tautoUpdate,\n\tcomputePosition,\n\tflip,\n\toffset,\n\tPlacement,\n\tshift,\n\tStrategy,\n} from '@floating-ui/dom';\nimport {\n\tComponent,\n\tElement,\n\tEvent,\n\tEventEmitter,\n\th,\n\tHost,\n\tListen,\n\tProp,\n\tWatch,\n} from '@stencil/core';\nimport { childOf } from '../../../utils/child-of';\n\n@Component({\n\ttag: 'p-dropdown',\n\tstyleUrl: 'dropdown.component.scss',\n\tshadow: true,\n})\nexport class Dropdown {\n\t/**\n\t * The content of the dropdown menu\n\t */\n\t@Prop({ reflect: true }) placement: Placement = 'bottom-start';\n\n\t/**\n\t * The strategy of the popover placement\n\t */\n\t@Prop() strategy: Strategy = 'absolute';\n\n\t/**\n\t * Wether to show the dropdown menu\n\t */\n\t@Prop() show: boolean = false;\n\n\t/**\n\t * Wether to automatically calculate the width of the menu based on the trigger\n\t */\n\t@Prop() calculateWidth: boolean = false;\n\n\t/**\n\t * Wether to apply the max width\n\t */\n\t@Prop() applyMaxWidth: boolean = true;\n\n\t/**\n\t * Wether to apply the full width\n\t */\n\t@Prop() applyFullWidth: boolean = true;\n\n\t/**\n\t * Wether the dropdown container should be scrollable when the threshold is met.\n\t */\n\t@Prop() scrollable: boolean = false;\n\n\t/**\n\t * Wether to automatically close the dropdown menu after clicking inside\n\t */\n\t@Prop() insideClick: boolean = false;\n\n\t/**\n\t * Wether to automatically close the dropdown menu after clicking inside\n\t */\n\t@Prop() disableTriggerClick: boolean = false;\n\n\t/**\n\t * Wether to apply chevron automatically\n\t */\n\t@Prop() applyChevron: boolean = true;\n\n\t/**\n\t * Chevron position\n\t */\n\t@Prop() chevronPosition: 'start' | 'end' = 'end';\n\n\t/**\n\t * Chevron direction\n\t */\n\t@Prop() chevronDirection: 'up' | 'down';\n\n\t/**\n\t * The host element\n\t */\n\t@Element() private _el: HTMLElement;\n\n\t/**\n\t * Open change event\n\t */\n\t@Event({\n\t\tbubbles: false,\n\t})\n\tisOpen: EventEmitter<boolean>;\n\n\tprivate _loaded = false;\n\tprivate _trigger: HTMLElement;\n\tprivate _menu: HTMLElement;\n\tprivate _cleanup: () => void;\n\n\tcomponentShouldUpdate() {\n\t\tthis._update();\n\t}\n\n\tdisconnectedCallback() {\n\t\tif (this._cleanup) {\n\t\t\tthis._cleanup();\n\t\t\tthis._cleanup = null;\n\t\t}\n\t}\n\n\trender() {\n\t\treturn (\n\t\t\t<Host class=\"p-dropdown\">\n\t\t\t\t<div\n\t\t\t\t\tclass=\"trigger\"\n\t\t\t\t\tref={(ref) => (this._trigger = ref)}\n\t\t\t\t\tonClick={() => this._triggerClickHandler()}\n\t\t\t\t>\n\t\t\t\t\t<slot\n\t\t\t\t\t\tonSlotchange={(ev) => this._checkButton(ev)}\n\t\t\t\t\t\tname=\"trigger\"\n\t\t\t\t\t/>\n\t\t\t\t</div>\n\t\t\t\t<p-dropdown-menu-container\n\t\t\t\t\trole=\"popover\"\n\t\t\t\t\tmaxWidth={!this.calculateWidth && this.applyMaxWidth}\n\t\t\t\t\tfullWidth={this.applyFullWidth && !this.applyMaxWidth}\n\t\t\t\t\tref={(el) => this._load(el)}\n\t\t\t\t\tdata-placement={this.placement}\n\t\t\t\t\tdata-strategy={this.strategy}\n\t\t\t\t\tonClick={() => this._containerClickHandler()}\n\t\t\t\t\tscrollable={this.scrollable}\n\t\t\t\t>\n\t\t\t\t\t<slot name=\"items\" />\n\t\t\t\t</p-dropdown-menu-container>\n\t\t\t</Host>\n\t\t);\n\t}\n\n\tprivate _checkButton({ target }: Event) {\n\t\tif (!this.applyChevron) {\n\t\t\treturn;\n\t\t}\n\n\t\tconst slot = target as HTMLSlotElement;\n\t\tconst children = slot.assignedElements();\n\n\t\tfor (let child of children) {\n\t\t\tif (child.nodeName === 'P-BUTTON') {\n\t\t\t\t(child as any).chevronPosition = this.chevronPosition;\n\t\t\t\t(child as any).chevron = this.chevronDirection\n\t\t\t\t\t? this.chevronDirection\n\t\t\t\t\t: this.placement.indexOf('top') >= 0\n\t\t\t\t\t\t? 'up'\n\t\t\t\t\t\t: 'down';\n\t\t\t}\n\t\t}\n\t}\n\n\t@Watch('show')\n\tprotected onShowChange(show) {\n\t\tif (!this._loaded) {\n\t\t\treturn;\n\t\t}\n\n\t\tif (!show) {\n\t\t\tthis._hide();\n\t\t\treturn;\n\t\t}\n\n\t\tthis._show();\n\t}\n\n\t@Listen('click', { target: 'document', capture: true })\n\tprotected documentClickHandler({ target }) {\n\t\tif (\n\t\t\t!this._menu.hasAttribute('data-show') ||\n\t\t\tchildOf(target, this._el)\n\t\t) {\n\t\t\treturn;\n\t\t}\n\n\t\tthis._hide();\n\t}\n\n\tprivate _containerClickHandler() {\n\t\tif (this.insideClick) {\n\t\t\treturn;\n\t\t}\n\n\t\tif (this._menu.hasAttribute('data-show')) {\n\t\t\tthis._hide();\n\t\t}\n\t}\n\n\tprivate _triggerClickHandler() {\n\t\tif (this.disableTriggerClick) {\n\t\t\treturn;\n\t\t}\n\n\t\tif (this._menu.hasAttribute('data-show')) {\n\t\t\tthis._hide();\n\t\t\treturn;\n\t\t}\n\n\t\tthis._show();\n\t}\n\n\tprivate _load(popover: HTMLElement) {\n\t\tthis._menu = popover;\n\t\tif (popover) {\n\t\t\tthis._update();\n\t\t\tthis._loaded = true;\n\n\t\t\tif (this.show) {\n\t\t\t\tsetTimeout(() => this._show(), 100);\n\t\t\t}\n\t\t}\n\t}\n\n\tprivate _show() {\n\t\tif (!this._loaded) {\n\t\t\treturn;\n\t\t}\n\n\t\t// Make the popover visible\n\t\tif (this.calculateWidth) {\n\t\t\tthis._menu.style.width = `${this._trigger.clientWidth}px`;\n\t\t}\n\n\t\tthis._cleanup = autoUpdate(this._el, this._menu, () => this._update());\n\n\t\tthis._menu.setAttribute('data-show', '');\n\t\tthis.isOpen.emit(true);\n\t}\n\n\tprivate _hide() {\n\t\tif (!this._loaded || this.show) {\n\t\t\treturn;\n\t\t}\n\n\t\tif (this._cleanup) {\n\t\t\tthis._cleanup();\n\t\t\tthis._cleanup = null;\n\t\t}\n\n\t\t// Hide the popover\n\t\tthis._menu.removeAttribute('data-show');\n\t\tthis.isOpen.emit(false);\n\t}\n\n\tprivate _update() {\n\t\tif (!this._menu) {\n\t\t\treturn;\n\t\t}\n\n\t\tcomputePosition(this._el, this._menu, {\n\t\t\tplacement: this.placement,\n\t\t\tstrategy: this.strategy,\n\t\t\tmiddleware: [offset(8), flip(), shift()],\n\t\t}).then(({ x, y, placement }) => {\n\t\t\tthis._menu.dataset.placement = placement;\n\t\t\tObject.assign(this._menu.style, {\n\t\t\t\ttop: `${y}px`,\n\t\t\t\tleft: `${x}px`,\n\t\t\t});\n\t\t});\n\t}\n}\n",":host {\n\t@import '../../../style/form/checkbox';\n\n\t@apply flex h-8 w-full items-center gap-2 rounded px-2;\n\t@apply text-sm font-semibold text-storm;\n\t@apply cursor-pointer;\n\n\t.text-container {\n\t\t@apply block w-full overflow-hidden text-ellipsis whitespace-nowrap;\n\t}\n}\n\n:host(.hover:hover) {\n\t@apply bg-indigo-light text-storm;\n}\n\n:host(.active) {\n\t@apply bg-indigo-light text-indigo;\n}\n","import { Component, Host, Prop, h } from '@stencil/core';\nimport { IconVariant } from '../icon/icon.component';\n\n@Component({\n\ttag: 'p-dropdown-menu-item',\n\tstyleUrl: 'dropdown-menu-item.component.scss',\n\tshadow: true,\n})\nexport class DropdownMenuItem {\n\t/**\n\t * Wether the dropdown menu item is active\n\t */\n\t@Prop() active: boolean = false;\n\n\t/**\n\t * The variant of the item\n\t */\n\t@Prop() variant: 'default' | 'checkbox' = 'default';\n\n\t/**\n\t * Wether to enable the hover state\n\t */\n\t@Prop() enableHover: boolean = true;\n\n\t/**\n\t * Icon of the navigation item\n\t */\n\t@Prop() icon: IconVariant;\n\n\trender() {\n\t\treturn (\n\t\t\t<Host\n\t\t\t\tclass={`p-dropdown-menu-item ${this.active && 'active'} ${\n\t\t\t\t\tthis.enableHover && 'hover'\n\t\t\t\t}`}\n\t\t\t>\n\t\t\t\t{this.icon && <p-icon variant={this.icon} />}\n\n\t\t\t\t{this.variant === 'checkbox' && (\n\t\t\t\t\t<input\n\t\t\t\t\t\ttype=\"checkbox\"\n\t\t\t\t\t\tclass=\"p-input size-small flex-shrink-0\"\n\t\t\t\t\t\tchecked={this.active}\n\t\t\t\t\t/>\n\t\t\t\t)}\n\n\t\t\t\t<div class=\"text-container\">\n\t\t\t\t\t<slot />\n\t\t\t\t</div>\n\t\t\t</Host>\n\t\t);\n\t}\n}\n"],"version":3}
|
|
1
|
+
{"file":"p-dropdown.p-dropdown-menu-item.entry.js","mappings":"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","names":[],"sources":["src/components/molecules/dropdown/dropdown.component.scss?tag=p-dropdown&encapsulation=shadow","src/components/molecules/dropdown/dropdown.component.tsx","src/components/atoms/dropdown-menu-item/dropdown-menu-item.component.scss?tag=p-dropdown-menu-item&encapsulation=shadow","src/components/atoms/dropdown-menu-item/dropdown-menu-item.component.tsx"],"sourcesContent":[":host {\n\t@apply relative block;\n\n\t.trigger {\n\t\t@apply relative block h-auto w-auto;\n\t}\n\n\tp-dropdown-menu-container {\n\t\t@apply left-0 top-0 z-dropdown hidden;\n\n\t\t&[data-show] {\n\t\t\t@apply flex;\n\t\t}\n\n\t\t&[data-strategy='absolute'] {\n\t\t\t@apply absolute;\n\t\t}\n\n\t\t&[data-strategy='fixed'] {\n\t\t\t@apply fixed;\n\t\t}\n\t}\n}\n","import {\n\tautoUpdate,\n\tcomputePosition,\n\tflip,\n\toffset,\n\tPlacement,\n\tshift,\n\tStrategy,\n} from '@floating-ui/dom';\nimport {\n\tComponent,\n\tElement,\n\tEvent,\n\tEventEmitter,\n\th,\n\tHost,\n\tListen,\n\tProp,\n\tWatch,\n} from '@stencil/core';\nimport { childOf } from '../../../utils/child-of';\n\n@Component({\n\ttag: 'p-dropdown',\n\tstyleUrl: 'dropdown.component.scss',\n\tshadow: true,\n})\nexport class Dropdown {\n\t/**\n\t * The content of the dropdown menu\n\t */\n\t@Prop({ reflect: true }) placement: Placement = 'bottom-start';\n\n\t/**\n\t * The strategy of the popover placement\n\t */\n\t@Prop() strategy: Strategy = 'absolute';\n\n\t/**\n\t * Wether to show the dropdown menu\n\t */\n\t@Prop() show: boolean = false;\n\n\t/**\n\t * Wether to automatically calculate the width of the menu based on the trigger\n\t */\n\t@Prop() calculateWidth: boolean = false;\n\n\t/**\n\t * Wether to apply the max width\n\t */\n\t@Prop() applyMaxWidth: boolean = true;\n\n\t/**\n\t * Wether to apply the full width\n\t */\n\t@Prop() applyFullWidth: boolean = true;\n\n\t/**\n\t * Wether the dropdown container should be scrollable when the threshold is met.\n\t */\n\t@Prop() scrollable: boolean = false;\n\n\t/**\n\t * Wether to automatically close the dropdown menu after clicking inside\n\t */\n\t@Prop() insideClick: boolean = false;\n\n\t/**\n\t * Wether to automatically close the dropdown menu after clicking inside\n\t */\n\t@Prop() disableTriggerClick: boolean = false;\n\n\t/**\n\t * Wether to apply chevron automatically\n\t */\n\t@Prop() applyChevron: boolean = true;\n\n\t/**\n\t * Chevron position\n\t */\n\t@Prop() chevronPosition: 'start' | 'end' = 'end';\n\n\t/**\n\t * Chevron direction\n\t */\n\t@Prop() chevronDirection: 'up' | 'down';\n\n\t/**\n\t * The host element\n\t */\n\t@Element() private _el: HTMLElement;\n\n\t/**\n\t * Open change event\n\t */\n\t@Event({\n\t\tbubbles: false,\n\t})\n\tisOpen: EventEmitter<boolean>;\n\n\tprivate _loaded = false;\n\tprivate _trigger: HTMLElement;\n\tprivate _menu: HTMLElement;\n\tprivate _cleanup: () => void;\n\n\tcomponentShouldUpdate() {\n\t\tthis._update();\n\t}\n\n\tdisconnectedCallback() {\n\t\tif (this._cleanup) {\n\t\t\tthis._cleanup();\n\t\t\tthis._cleanup = null;\n\t\t}\n\t}\n\n\trender() {\n\t\treturn (\n\t\t\t<Host class=\"p-dropdown\">\n\t\t\t\t<div\n\t\t\t\t\tclass=\"trigger\"\n\t\t\t\t\tref={(ref) => (this._trigger = ref)}\n\t\t\t\t\tonClick={() => this._triggerClickHandler()}\n\t\t\t\t>\n\t\t\t\t\t<slot\n\t\t\t\t\t\tonSlotchange={(ev) => this._checkButton(ev)}\n\t\t\t\t\t\tname=\"trigger\"\n\t\t\t\t\t/>\n\t\t\t\t</div>\n\t\t\t\t<p-dropdown-menu-container\n\t\t\t\t\trole=\"popover\"\n\t\t\t\t\tmaxWidth={!this.calculateWidth && this.applyMaxWidth}\n\t\t\t\t\tfullWidth={this.applyFullWidth && !this.applyMaxWidth}\n\t\t\t\t\tref={(el) => this._load(el)}\n\t\t\t\t\tdata-placement={this.placement}\n\t\t\t\t\tdata-strategy={this.strategy}\n\t\t\t\t\tonClick={() => this._containerClickHandler()}\n\t\t\t\t\tscrollable={this.scrollable}\n\t\t\t\t>\n\t\t\t\t\t<slot name=\"items\" />\n\t\t\t\t</p-dropdown-menu-container>\n\t\t\t</Host>\n\t\t);\n\t}\n\n\tprivate _checkButton({ target }: Event) {\n\t\tif (!this.applyChevron) {\n\t\t\treturn;\n\t\t}\n\n\t\tconst slot = target as HTMLSlotElement;\n\t\tconst children = slot.assignedElements();\n\n\t\tfor (let child of children) {\n\t\t\tif (child.nodeName === 'P-BUTTON') {\n\t\t\t\t(child as any).chevronPosition = this.chevronPosition;\n\t\t\t\t(child as any).chevron = this.chevronDirection\n\t\t\t\t\t? this.chevronDirection\n\t\t\t\t\t: this.placement.indexOf('top') >= 0\n\t\t\t\t\t\t? 'up'\n\t\t\t\t\t\t: 'down';\n\t\t\t}\n\t\t}\n\t}\n\n\t@Watch('show')\n\tprotected onShowChange(show) {\n\t\tif (!this._loaded) {\n\t\t\treturn;\n\t\t}\n\n\t\tif (!show) {\n\t\t\tthis._hide();\n\t\t\treturn;\n\t\t}\n\n\t\tthis._show();\n\t}\n\n\t@Listen('click', { target: 'document', capture: true })\n\tprotected documentClickHandler({ target }) {\n\t\tif (\n\t\t\t!this._menu.hasAttribute('data-show') ||\n\t\t\tchildOf(target, this._el)\n\t\t) {\n\t\t\treturn;\n\t\t}\n\n\t\tthis._hide();\n\t}\n\n\tprivate _containerClickHandler() {\n\t\tif (this.insideClick) {\n\t\t\treturn;\n\t\t}\n\n\t\tif (this._menu.hasAttribute('data-show')) {\n\t\t\tthis._hide();\n\t\t}\n\t}\n\n\tprivate _triggerClickHandler() {\n\t\tif (this.disableTriggerClick) {\n\t\t\treturn;\n\t\t}\n\n\t\tif (this._menu.hasAttribute('data-show')) {\n\t\t\tthis._hide();\n\t\t\treturn;\n\t\t}\n\n\t\tthis._show();\n\t}\n\n\tprivate _load(popover: HTMLElement) {\n\t\tthis._menu = popover;\n\t\tif (popover) {\n\t\t\tthis._update();\n\t\t\tthis._loaded = true;\n\n\t\t\tif (this.show) {\n\t\t\t\tsetTimeout(() => this._show(), 100);\n\t\t\t}\n\t\t}\n\t}\n\n\tprivate _show() {\n\t\tif (!this._loaded) {\n\t\t\treturn;\n\t\t}\n\n\t\t// Make the popover visible\n\t\tif (this.calculateWidth) {\n\t\t\tthis._menu.style.width = `${this._trigger.clientWidth}px`;\n\t\t}\n\n\t\tthis._cleanup = autoUpdate(this._el, this._menu, () => this._update());\n\n\t\tthis._menu.setAttribute('data-show', '');\n\t\tthis.isOpen.emit(true);\n\t}\n\n\tprivate _hide() {\n\t\tif (!this._loaded || this.show) {\n\t\t\treturn;\n\t\t}\n\n\t\tif (this._cleanup) {\n\t\t\tthis._cleanup();\n\t\t\tthis._cleanup = null;\n\t\t}\n\n\t\t// Hide the popover\n\t\tthis._menu.removeAttribute('data-show');\n\t\tthis.isOpen.emit(false);\n\t}\n\n\tprivate _update() {\n\t\tif (!this._menu) {\n\t\t\treturn;\n\t\t}\n\n\t\tcomputePosition(this._el, this._menu, {\n\t\t\tplacement: this.placement,\n\t\t\tstrategy: this.strategy,\n\t\t\tmiddleware: [offset(8), flip(), shift()],\n\t\t}).then(({ x, y, placement }) => {\n\t\t\tthis._menu.dataset.placement = placement;\n\t\t\tObject.assign(this._menu.style, {\n\t\t\t\ttop: `${y}px`,\n\t\t\t\tleft: `${x}px`,\n\t\t\t});\n\t\t});\n\t}\n}\n",":host {\n\t@import '../../../style/form/checkbox';\n\n\t@apply flex h-8 w-full items-center gap-2 rounded px-2;\n\t@apply text-sm font-semibold text-storm;\n\t@apply cursor-pointer;\n\n\t.text-container {\n\t\t@apply block w-full overflow-hidden text-ellipsis whitespace-nowrap;\n\t}\n}\n\n:host(.hover:hover) {\n\t@apply bg-indigo-light text-storm;\n}\n\n:host(.active) {\n\t@apply bg-indigo-light text-indigo;\n}\n","import { Component, Host, Prop, h } from '@stencil/core';\nimport { IconVariant } from '../icon/icon.component';\n\n@Component({\n\ttag: 'p-dropdown-menu-item',\n\tstyleUrl: 'dropdown-menu-item.component.scss',\n\tshadow: true,\n})\nexport class DropdownMenuItem {\n\t/**\n\t * Wether the dropdown menu item is active\n\t */\n\t@Prop() active: boolean = false;\n\n\t/**\n\t * The variant of the item\n\t */\n\t@Prop() variant: 'default' | 'checkbox' = 'default';\n\n\t/**\n\t * Wether to enable the hover state\n\t */\n\t@Prop() enableHover: boolean = true;\n\n\t/**\n\t * Icon of the navigation item\n\t */\n\t@Prop() icon: IconVariant;\n\n\trender() {\n\t\treturn (\n\t\t\t<Host\n\t\t\t\tclass={`p-dropdown-menu-item ${this.active && 'active'} ${\n\t\t\t\t\tthis.enableHover && 'hover'\n\t\t\t\t}`}\n\t\t\t>\n\t\t\t\t{this.icon && <p-icon variant={this.icon} />}\n\n\t\t\t\t{this.variant === 'checkbox' && (\n\t\t\t\t\t<input\n\t\t\t\t\t\ttype=\"checkbox\"\n\t\t\t\t\t\tclass=\"p-input size-small flex-shrink-0\"\n\t\t\t\t\t\tchecked={this.active}\n\t\t\t\t\t/>\n\t\t\t\t)}\n\n\t\t\t\t<div class=\"text-container\">\n\t\t\t\t\t<slot />\n\t\t\t\t</div>\n\t\t\t</Host>\n\t\t);\n\t}\n}\n"],"version":3}
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { r as registerInstance, h, H as Host } from './index-7b917f6b.js';
|
|
2
2
|
|
|
3
|
-
const layoutComponentCss = ".relative{position:relative!important}.sticky{position:sticky!important}.order-1{order:1!important}.order-2{order:2!important}.order-3{order:3!important}.box-border{box-sizing:border-box!important}.flex{display:flex!important}.grid{display:grid!important}.hidden{display:none!important}.h-full{height:100%!important}.h-screen{height:100vh!important}.w-full{width:100%!important}.w-screen{width:100vw!important}.w-
|
|
3
|
+
const layoutComponentCss = ".relative{position:relative!important}.sticky{position:sticky!important}.order-1{order:1!important}.order-2{order:2!important}.order-3{order:3!important}.box-border{box-sizing:border-box!important}.flex{display:flex!important}.grid{display:grid!important}.hidden{display:none!important}.h-full{height:100%!important}.h-screen{height:100vh!important}.w-full{width:100%!important}.w-screen{width:100vw!important}.w-unset{width:unset!important}.flex-1{flex:1 1 0%!important}.flex-col{flex-direction:column!important}.content-start{align-content:flex-start!important}.items-center{align-items:center!important}.overflow-y-auto{overflow-y:auto!important}.px-content-mobile-x{padding-left:1rem!important;padding-right:1rem!important}*{box-sizing:border-box}:host{align-content:flex-start;display:grid;gap:0;grid-template-areas:\"sidebar\" \"topbar\" \"content\";grid-template-columns:1fr;grid-template-rows:repeat(1fr,3);height:100vh;overflow:hidden;width:100vw}@media (min-width:80rem){:host{grid-template-areas:\"topbar topbar\" \"sidebar content\";grid-template-columns:auto 1fr;grid-template-rows:auto 1fr}}:host .content,:host .sidebar,:host .topbar{align-self:flex-start}:host .topbar{grid-area:topbar;order:2;position:sticky;width:100%}@media (min-width:80rem){:host .topbar{order:1}}:host .sidebar{box-sizing:border-box;display:flex;grid-area:sidebar;height:100%;order:1;width:100%}@media (min-width:80rem){:host .sidebar{order:2;width:15rem}}@media (min-width:105rem){:host .sidebar{width:18rem}}:host .content{display:flex;flex-direction:column;grid-area:content;height:100%;order:3;overflow-x:hidden;overflow-y:auto;padding:0 env(safe-area-inset-right) env(safe-area-inset-bottom) env(safe-area-inset-left);position:relative}:host .content .inner-content{padding:1.5rem 1rem;position:relative}@media (min-width:40rem){:host .content .inner-content{padding:2rem}}@media (min-width:80rem){:host .content .inner-content{padding:2rem 1.5rem 1.5rem;width:65rem}}@media (min-width:90rem){:host .content .inner-content{padding:2rem;width:75rem}}@media (min-width:96rem){:host .content .inner-content{width:81rem}}@media (min-width:105rem){:host .content .inner-content{width:87rem}}@media (min-width:120rem){:host .content .inner-content{padding-bottom:5rem;padding-left:5rem;padding-right:2rem;width:90rem}}@media (min-width:160rem){:host .content .inner-content{padding-bottom:7.5rem;padding-left:7.5rem;padding-top:4rem;width:92.5rem}}:host(.variant-default) .content{flex:1 1 0%}:host(.variant-login){grid-template-areas:\"topbar topbar\" \"content content\"}@media (min-width:80rem){:host(.variant-login){grid-template-areas:\"topbar topbar\" \"content sidebar\"}}:host(.variant-login) .sidebar{display:none;flex:1 1 0%;order:3;overflow:hidden;padding:.5rem;width:unset}@media (min-width:80rem){:host(.variant-login) .sidebar{display:flex}}:host(.variant-login) .sidebar .inner-content{padding:.5rem}:host(.variant-login) .content{align-items:center;order:3}@media (min-width:80rem){:host(.variant-login) .content{justify-content:center;order:2}}:host(.variant-login) .content .inner-content{box-sizing:border-box;padding:calc(env(safe-area-inset-top) + 3.5rem) 1rem 1.5rem;width:100%}@media (min-width:64rem){:host(.variant-login) .content .inner-content{padding-bottom:0;padding-top:0}}@media (min-width:80rem){:host(.variant-login) .content .inner-content{padding-left:4.5rem;padding-right:4.5rem;padding-top:1.5rem}}@media (min-width:40rem){:host(.variant-login) .content .inner-content{width:30rem}}@media (min-width:80rem){.layout-1280\\:flex{display:flex!important}.layout-1280\\:w-60{width:15rem!important}.layout-1280\\:w-content-1280{width:65rem!important}.layout-1280\\:p-6{padding:1.5rem!important}.layout-1280\\:px-18{padding-left:4.5rem!important;padding-right:4.5rem!important}}@media (min-width:90rem){.layout-1440\\:w-content-1440{width:75rem!important}}@media (min-width:120rem){.layout-1920\\:w-content-1920{width:90rem!important}.layout-1920\\:pl-20{padding-left:5rem!important}.layout-1920\\:pr-8{padding-right:2rem!important}}@media (min-width:160rem){.layout-2560\\:w-content-2560{width:92.5rem!important}.layout-2560\\:pb-\\[7\\.5rem\\]{padding-bottom:7.5rem!important}.layout-2560\\:pl-\\[7\\.5rem\\]{padding-left:7.5rem!important}.layout-2560\\:pt-16{padding-top:4rem!important}}.static{position:static!important}";
|
|
4
4
|
|
|
5
5
|
const Layout = class {
|
|
6
6
|
constructor(hostRef) {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"file":"p-layout.entry.js","mappings":";;AAAA,MAAM,kBAAkB,GAAG,
|
|
1
|
+
{"file":"p-layout.entry.js","mappings":";;AAAA,MAAM,kBAAkB,GAAG,wvIAAwvI;;MCOtwI,MAAM;;;mBAIqB,SAAS;;EAEhD,MAAM;IACL,QACC,EAAC,IAAI,IAAC,KAAK,EAAE,oBAAoB,IAAI,CAAC,OAAO,EAAE,IAC9C,WAAK,KAAK,EAAC,QAAQ,IAClB,YAAM,IAAI,EAAC,QAAQ,GAAG,CACjB,EACN,WAAK,KAAK,EAAC,SAAS,IACnB,YAAM,IAAI,EAAC,SAAS,GAAG,CAClB,EACN,WAAK,KAAK,EAAC,SAAS,IACnB,WAAK,KAAK,EAAC,eAAe,IACzB,YAAM,IAAI,EAAC,SAAS,GAAG,CAClB,CACD,CACA,EACN;GACF;;;;;;","names":[],"sources":["src/components/atoms/layout/layout.component.scss?tag=p-layout&encapsulation=shadow","src/components/atoms/layout/layout.component.tsx"],"sourcesContent":[":host {\n\t@apply grid h-screen w-screen content-start overflow-hidden;\n\n\tgrid-template-columns: 1fr;\n\tgrid-template-rows: repeat(1fr, 3);\n\tgap: 0;\n\tgrid-template-areas:\n\t\t'sidebar'\n\t\t'topbar'\n\t\t'content';\n\n\t@screen layout-1280 {\n\t\tgrid-template-columns: auto 1fr;\n\t\tgrid-template-rows: auto 1fr;\n\t\tgrid-template-areas:\n\t\t\t'topbar topbar'\n\t\t\t'sidebar content';\n\t}\n\n\t.topbar,\n\t.sidebar,\n\t.content {\n\t\t@apply self-start;\n\t}\n\n\t.topbar {\n\t\tgrid-area: topbar;\n\n\t\t@apply sticky w-full;\n\t\t@apply order-2 desktop-sm:order-1;\n\t}\n\n\t.sidebar {\n\t\tgrid-area: sidebar;\n\n\t\t@apply box-border flex h-full;\n\t\t@apply w-full;\n\t\t@apply layout-1280:w-60 layout-1680:w-72;\n\t\t@apply order-1 desktop-sm:order-2;\n\t}\n\n\t.content {\n\t\tgrid-area: content;\n\n\t\t@apply relative flex h-full flex-col overflow-y-auto overflow-x-hidden;\n\t\t@apply order-3;\n\n\t\tpadding: 0 env(safe-area-inset-right) env(safe-area-inset-bottom)\n\t\t\tenv(safe-area-inset-left);\n\n\t\t.inner-content {\n\t\t\t@apply relative pb-24;\n\n\t\t\t// https://linear.app/employes/issue/PRO-9053/%E2%9A%9B%EF%B8%8F-component-wijzigen-layout\n\t\t\t@apply px-content-mobile-x py-content-mobile-y;\n\t\t\t@apply tablet:p-8;\n\t\t\t@apply layout-1280:w-content-1280 layout-1280:p-6 layout-1280:pt-8;\n\t\t\t@apply layout-1440:w-content-1440 layout-1440:p-8;\n\t\t\t@apply layout-1536:w-content-1536;\n\t\t\t@apply layout-1680:w-content-1680;\n\t\t\t@apply layout-1920:w-content-1920 layout-1920:pr-8 layout-1920:pl-20 layout-1920:pb-20;\n\t\t\t@apply layout-2560:w-content-2560 layout-2560:pt-16 layout-2560:pl-[7.5rem] layout-2560:pb-[7.5rem];\n\t\t}\n\t}\n}\n\n:host(.variant-default) {\n\t.content {\n\t\t@apply flex-1;\n\t}\n}\n\n:host(.variant-login) {\n\tgrid-template-areas:\n\t\t'topbar topbar'\n\t\t'content content';\n\n\t@screen layout-1280 {\n\t\tgrid-template-areas:\n\t\t\t'topbar topbar'\n\t\t\t'content sidebar';\n\t}\n\n\t.sidebar {\n\t\t@apply hidden w-unset layout-1280:flex;\n\t\t@apply order-3 p-2;\n\t\t@apply flex-1 overflow-hidden;\n\n\t\t.inner-content {\n\t\t\t@apply p-2;\n\t\t}\n\t}\n\n\t.content {\n\t\t@apply order-3 layout-1280:order-2;\n\t\t@apply items-center layout-1280:justify-center;\n\n\t\t.inner-content {\n\t\t\t@apply box-border;\n\t\t\t@apply layout-1280:px-18 desktop-xs:py-0;\n\t\t\t@apply w-full tablet:w-content-desktop-login;\n\n\t\t\t@apply px-content-mobile-x py-content-mobile-y;\n\t\t\tpadding-top: calc(env(safe-area-inset-top) + 3.5rem);\n\n\t\t\t@screen layout-1280 {\n\t\t\t\t@apply pt-content-mobile-y;\n\t\t\t}\n\t\t}\n\t}\n}\n","import { Component, h, Host, Prop } from '@stencil/core';\n\n@Component({\n\ttag: 'p-layout',\n\tstyleUrl: 'layout.component.scss',\n\tshadow: true,\n})\nexport class Layout {\n\t/**\n\t * Variant of the layout\n\t */\n\t@Prop() variant: 'default' | 'login' = 'default';\n\n\trender() {\n\t\treturn (\n\t\t\t<Host class={`p-layout variant-${this.variant}`}>\n\t\t\t\t<div class=\"topbar\">\n\t\t\t\t\t<slot name=\"topbar\" />\n\t\t\t\t</div>\n\t\t\t\t<div class=\"sidebar\">\n\t\t\t\t\t<slot name=\"sidebar\" />\n\t\t\t\t</div>\n\t\t\t\t<div class=\"content\">\n\t\t\t\t\t<div class=\"inner-content\">\n\t\t\t\t\t\t<slot name=\"content\" />\n\t\t\t\t\t</div>\n\t\t\t\t</div>\n\t\t\t</Host>\n\t\t);\n\t}\n}\n"],"version":3}
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { r as registerInstance, h, H as Host } from './index-7b917f6b.js';
|
|
2
2
|
|
|
3
|
-
const navbarComponentCss = ".fixed{position:fixed!important}.left-0{left:0!important}.top-0{top:0!important}.z-navbar{z-index:300!important}.mt-auto{margin-top:auto!important}.block{display:block!important}.flex{display:flex!important}.hidden{display:none!important}.h-screen{height:100vh!important}.w-60{width:15rem!important}.w-full{width:100%!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}.items-center{align-items:center!important}.justify-between{justify-content:space-between!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-mystic-dark{--tw-border-opacity:1!important;border-color:rgb(218 230 240/var(--tw-border-opacity))!important}.px-4{padding-left:1rem!important;padding-right:1rem!important}*{box-sizing:border-box}:host{max-height:calc(100vh - env(safe-area-inset-top) - env(safe-area-inset-bottom));width:100%}@media (min-width:
|
|
3
|
+
const navbarComponentCss = ".fixed{position:fixed!important}.left-0{left:0!important}.top-0{top:0!important}.z-navbar{z-index:300!important}.mt-auto{margin-top:auto!important}.block{display:block!important}.flex{display:flex!important}.hidden{display:none!important}.h-screen{height:100vh!important}.w-60{width:15rem!important}.w-full{width:100%!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}.items-center{align-items:center!important}.justify-between{justify-content:space-between!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-mystic-dark{--tw-border-opacity:1!important;border-color:rgb(218 230 240/var(--tw-border-opacity))!important}.px-4{padding-left:1rem!important;padding-right:1rem!important}*{box-sizing:border-box}:host{max-height:calc(100vh - env(safe-area-inset-top) - env(safe-area-inset-bottom));width:100%}@media (min-width:80rem){:host{width:15rem}}@media (min-width:105rem){:host{width:18rem}}:host .sidebar,:host .sidebar .company,:host .sidebar .content,:host .sidebar .user,:host .userbar{display:flex;flex-direction:column;width:100%}:host .sidebar,:host .top-bar{--tw-bg-opacity:1;--tw-border-opacity:1!important;background-color:rgb(255 255 255/var(--tw-bg-opacity));border-color:rgb(218 230 240/var(--tw-border-opacity))!important;border-style:solid!important;border-width:0!important}:host .sidebar{--tw-bg-opacity:1;--tw-translate-x:-100%;background-color:rgb(255 255 255/var(--tw-bg-opacity));border-right-width:1px!important;gap:1.5rem;height:100vh;left:0;padding-bottom:1rem;padding-top:calc(env(safe-area-inset-top, 0) + 1rem);position:fixed;top:0;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));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));transition-duration:.15s;transition-property:all;transition-timing-function:cubic-bezier(.4,0,.2,1);width:15rem;will-change:transform;z-index:300}@media (min-width:80rem){:host .sidebar{--tw-translate-x:0px;height:100%;position:relative;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));width:100%}}:host .sidebar .company,:host .sidebar .content,:host .sidebar .header,:host .sidebar .user{padding-left:1rem;padding-right:1rem}:host .sidebar .header{align-items:center;display:flex;justify-content:space-between;width:100%}@media (min-width:80rem){:host .sidebar .header{display:none}}:host .sidebar .content{overflow-y:auto;scrollbar-color:#528afa #dae6f0;scrollbar-width:thin}:host .sidebar .content::-webkit-scrollbar{width:.25rem}:host .sidebar .content::-webkit-scrollbar-track{background:#dae6f0}:host .sidebar .content::-webkit-scrollbar-thumb{background:#528afa}:host .sidebar .content::-webkit-scrollbar-thumb:hover{background:#528afa}:host .sidebar .user{display:none;margin-top:auto}@media (min-width:80rem){:host .sidebar .user{display:flex}}:host .sidebar.show{--tw-translate-x:env(safe-area-inset-left,0)}:host .top-bar{border-bottom-width:1px!important;display:flex;height:calc(env(safe-area-inset-top, 0) + 3rem);justify-content:space-between;padding:calc(env(safe-area-inset-top, 0) + .5rem) 1rem .5rem;width:100%}@media (min-width:80rem){:host .top-bar{display:none}}:host p-backdrop{display:none}:host p-backdrop.show{display:block}@media (min-width:80rem){.layout-1280\\:relative{position:relative!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}}.static{position:static!important}.z-navbar-backdrop{z-index:290!important}.m-0{margin:0!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))!important}@media (min-width:64rem){.desktop-xs\\:hidden{display:none!important}}";
|
|
4
4
|
|
|
5
5
|
const Navbar = class {
|
|
6
6
|
constructor(hostRef) {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"file":"p-navbar.entry.js","mappings":";;AAAA,MAAM,kBAAkB,GAAG,
|
|
1
|
+
{"file":"p-navbar.entry.js","mappings":";;AAAA,MAAM,kBAAkB,GAAG,ynJAAynJ;;MCOvoJ,MAAM;;;qBAIE,OAAO;oBAKR,MAAM;qBAEI,KAAK;;EAElC,MAAM;IACL,QACC,EAAC,IAAI,IAAC,KAAK,EAAC,UAAU,IACrB,kBACC,SAAS,EAAE,IAAI,EACf,KAAK,EAAE,uCACN,IAAI,CAAC,SAAS,IAAI,MACnB,EAAE,EACF,SAAS,EAAE,OAAO,IAAI,CAAC,SAAS,GAAG,KAAK,CAAC,GAC5B,EACd,WAAK,KAAK,EAAE,WAAW,IAAI,CAAC,SAAS,IAAI,MAAM,EAAE,IAChD,WAAK,KAAK,EAAC,QAAQ,IAClB,SAAG,KAAK,EAAC,2CAA2C,IAClD,IAAI,CAAC,QAAQ,CACX,EAEJ,gBACC,OAAO,EAAC,WAAW,EACnB,IAAI,EAAC,UAAU,EACf,YAAY,EAAC,KAAK,EAClB,IAAI,EAAC,OAAO,EACZ,OAAO,EAAE,OAAO,IAAI,CAAC,SAAS,GAAG,KAAK,CAAC,IAEtC,IAAI,CAAC,SAAS,CACL,CACN,EACN,WAAK,KAAK,EAAC,SAAS,IACnB,YAAM,IAAI,EAAC,SAAS,GAAG,CAClB,EACN,WAAK,KAAK,EAAC,SAAS,IACnB,YAAM,IAAI,EAAC,SAAS,GAAG,CAClB,EAEN,WAAK,KAAK,EAAC,MAAM,IAChB,YAAM,IAAI,EAAC,MAAM,GAAG,CACf,CACD,EAEN,WAAK,KAAK,EAAC,SAAS,IACnB,gBACC,OAAO,EAAC,WAAW,EACnB,IAAI,EAAC,MAAM,EACX,IAAI,EAAC,OAAO,EACZ,OAAO,EAAE,OAAO,IAAI,CAAC,SAAS,GAAG,IAAI,CAAC,IAErC,IAAI,CAAC,QAAQ,CACJ,EAEX,YAAM,IAAI,EAAC,QAAQ,GAAG,CACjB,CACA,EACN;GACF;EAGD,iBAAiB;IAChB,IAAI,CAAC,SAAS,GAAG,KAAK,CAAC;GACvB;EAGD,gBAAgB;IACf,IAAI,CAAC,SAAS,GAAG,IAAI,CAAC;GACtB;;;;;;","names":[],"sources":["src/components/organisms/navbar/navbar.component.scss?tag=p-navbar&encapsulation=shadow","src/components/organisms/navbar/navbar.component.tsx"],"sourcesContent":["@import '../../../style/mixins';\n\n:host {\n\t@apply w-full max-h-screen-safe;\n\t@apply layout-1280:w-60 layout-1680:w-72;\n\n\t.sidebar,\n\t.sidebar .company,\n\t.sidebar .content,\n\t.sidebar .user,\n\t.userbar {\n\t\t@apply flex w-full flex-col;\n\t}\n\n\t.sidebar,\n\t.top-bar {\n\t\t@apply bg-white;\n\t\t@apply border-0 border-solid border-mystic-dark #{!important};\n\t}\n\n\t.sidebar {\n\t\t@apply fixed top-0 left-0 z-navbar h-screen w-60 bg-white;\n\t\t@apply layout-1280:relative layout-1280:h-full layout-1280:w-full;\n\t\t@apply gap-6;\n\n\t\t@apply will-change-transform;\n\t\t@apply -translate-x-full transform-gpu layout-1280:translate-x-0;\n\n\t\t@apply py-4;\n\n\t\tpadding-top: calc(env(safe-area-inset-top, 0) + 1rem);\n\n\t\t@apply border-r #{!important};\n\n\t\t@apply transition-all;\n\n\t\t.company,\n\t\t.content,\n\t\t.user,\n\t\t.header {\n\t\t\t@apply px-4;\n\t\t}\n\n\t\t.header {\n\t\t\t@apply flex w-full items-center justify-between;\n\t\t\t@apply layout-1280:hidden;\n\t\t}\n\n\t\t.content {\n\t\t\t@apply overflow-y-auto;\n\n\t\t\t@include scrollbarY();\n\t\t}\n\n\t\t.user {\n\t\t\t@apply mt-auto hidden;\n\t\t\t@apply layout-1280:flex;\n\t\t}\n\n\t\t&.show {\n\t\t\t--tw-translate-x: env(safe-area-inset-left, 0);\n\t\t}\n\t}\n\n\t.top-bar {\n\t\t@apply flex w-full justify-between px-4 py-2;\n\n\t\tpadding-top: calc(env(safe-area-inset-top, 0) + 0.5rem);\n\t\theight: calc(env(safe-area-inset-top, 0) + 3rem);\n\n\t\t@apply border-b #{!important};\n\n\t\t@apply layout-1280:hidden;\n\t}\n\n\tp-backdrop {\n\t\t@apply hidden;\n\n\t\t&.show {\n\t\t\t@apply block;\n\t\t}\n\t}\n}\n","import { Component, h, Host, Listen, Prop, State } from '@stencil/core';\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 close button\n\t */\n\t@Prop() closeText = 'Close';\n\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 _showMenu = false;\n\n\trender() {\n\t\treturn (\n\t\t\t<Host class=\"p-navbar\">\n\t\t\t\t<p-backdrop\n\t\t\t\t\tapplyBlur={true}\n\t\t\t\t\tclass={`z-navbar-backdrop desktop-xs:hidden ${\n\t\t\t\t\t\tthis._showMenu && 'show'\n\t\t\t\t\t}`}\n\t\t\t\t\tonClicked={() => (this._showMenu = false)}\n\t\t\t\t></p-backdrop>\n\t\t\t\t<div class={`sidebar ${this._showMenu && 'show'}`}>\n\t\t\t\t\t<div class=\"header\">\n\t\t\t\t\t\t<p class=\"text-xl m-0 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\tsize=\"small\"\n\t\t\t\t\t\t\tonClick={() => (this._showMenu = false)}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{this.closeText}\n\t\t\t\t\t\t</p-button>\n\t\t\t\t\t</div>\n\t\t\t\t\t<div class=\"company\">\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=\"content\">\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=\"user\">\n\t\t\t\t\t\t<slot name=\"user\" />\n\t\t\t\t\t</div>\n\t\t\t\t</div>\n\n\t\t\t\t<div class=\"top-bar\">\n\t\t\t\t\t<p-button\n\t\t\t\t\t\tvariant=\"secondary\"\n\t\t\t\t\t\ticon=\"menu\"\n\t\t\t\t\t\tsize=\"small\"\n\t\t\t\t\t\tonClick={() => (this._showMenu = true)}\n\t\t\t\t\t>\n\t\t\t\t\t\t{this.menuText}\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._showMenu = false;\n\t}\n\n\t@Listen('openNavbar', { target: 'window' })\n\thandleOpenNavbar() {\n\t\tthis._showMenu = true;\n\t}\n}\n"],"version":3}
|
package/dist/index.html
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
<!doctype html><html dir="ltr" lang="en"><head> <meta charset="utf-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=5.0"> <title>Stencil Component Starter</title> <script type="module" src="/build/paperless.esm.js" data-stencil data-resources-url="/build/" data-stencil-namespace="paperless"></script> <script nomodule="" src="/build/paperless.js" data-stencil></script> </head> <body> <p-button>Buttono</p-button> <script data-build="2024-02-
|
|
1
|
+
<!doctype html><html dir="ltr" lang="en"><head> <meta charset="utf-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=5.0"> <title>Stencil Component Starter</title> <script type="module" src="/build/paperless.esm.js" data-stencil data-resources-url="/build/" data-stencil-namespace="paperless"></script> <script nomodule="" src="/build/paperless.js" data-stencil></script> </head> <body> <p-button>Buttono</p-button> <script data-build="2024-02-28T10:38:34">
|
|
2
2
|
if ('serviceWorker' in navigator && location.protocol !== 'file:') {
|
|
3
3
|
window.addEventListener('load', function() {
|
|
4
4
|
navigator.serviceWorker.register('/sw.js')
|
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
import{r as t,h as a,H as e}from"./p-e4d5e7a7.js";const r=".fixed{position:fixed!important}.left-0{left:0!important}.top-0{top:0!important}.z-navbar{z-index:300!important}.mt-auto{margin-top:auto!important}.block{display:block!important}.flex{display:flex!important}.hidden{display:none!important}.h-screen{height:100vh!important}.w-60{width:15rem!important}.w-full{width:100%!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}.items-center{align-items:center!important}.justify-between{justify-content:space-between!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-mystic-dark{--tw-border-opacity:1!important;border-color:rgb(218 230 240/var(--tw-border-opacity))!important}.px-4{padding-left:1rem!important;padding-right:1rem!important}*{box-sizing:border-box}:host{max-height:calc(100vh - env(safe-area-inset-top) - env(safe-area-inset-bottom));width:100%}@media (min-width:80rem){:host{width:15rem}}@media (min-width:105rem){:host{width:18rem}}:host .sidebar,:host .sidebar .company,:host .sidebar .content,:host .sidebar .user,:host .userbar{display:flex;flex-direction:column;width:100%}:host .sidebar,:host .top-bar{--tw-bg-opacity:1;--tw-border-opacity:1!important;background-color:rgb(255 255 255/var(--tw-bg-opacity));border-color:rgb(218 230 240/var(--tw-border-opacity))!important;border-style:solid!important;border-width:0!important}:host .sidebar{--tw-bg-opacity:1;--tw-translate-x:-100%;background-color:rgb(255 255 255/var(--tw-bg-opacity));border-right-width:1px!important;gap:1.5rem;height:100vh;left:0;padding-bottom:1rem;padding-top:calc(env(safe-area-inset-top, 0) + 1rem);position:fixed;top:0;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));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));transition-duration:.15s;transition-property:all;transition-timing-function:cubic-bezier(.4,0,.2,1);width:15rem;will-change:transform;z-index:300}@media (min-width:80rem){:host .sidebar{--tw-translate-x:0px;height:100%;position:relative;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));width:100%}}:host .sidebar .company,:host .sidebar .content,:host .sidebar .header,:host .sidebar .user{padding-left:1rem;padding-right:1rem}:host .sidebar .header{align-items:center;display:flex;justify-content:space-between;width:100%}@media (min-width:80rem){:host .sidebar .header{display:none}}:host .sidebar .content{overflow-y:auto;scrollbar-color:#528afa #dae6f0;scrollbar-width:thin}:host .sidebar .content::-webkit-scrollbar{width:.25rem}:host .sidebar .content::-webkit-scrollbar-track{background:#dae6f0}:host .sidebar .content::-webkit-scrollbar-thumb{background:#528afa}:host .sidebar .content::-webkit-scrollbar-thumb:hover{background:#528afa}:host .sidebar .user{display:none;margin-top:auto}@media (min-width:80rem){:host .sidebar .user{display:flex}}:host .sidebar.show{--tw-translate-x:env(safe-area-inset-left,0)}:host .top-bar{border-bottom-width:1px!important;display:flex;height:calc(env(safe-area-inset-top, 0) + 3rem);justify-content:space-between;padding:calc(env(safe-area-inset-top, 0) + .5rem) 1rem .5rem;width:100%}@media (min-width:80rem){:host .top-bar{display:none}}:host p-backdrop{display:none}:host p-backdrop.show{display:block}@media (min-width:80rem){.layout-1280\\:relative{position:relative!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}}.static{position:static!important}.z-navbar-backdrop{z-index:290!important}.m-0{margin:0!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))!important}@media (min-width:64rem){.desktop-xs\\:hidden{display:none!important}}";const o=class{constructor(a){t(this,a);this.closeText="Close";this.menuText="Menu";this._showMenu=false}render(){return a(e,{class:"p-navbar"},a("p-backdrop",{applyBlur:true,class:`z-navbar-backdrop desktop-xs:hidden ${this._showMenu&&"show"}`,onClicked:()=>this._showMenu=false}),a("div",{class:`sidebar ${this._showMenu&&"show"}`},a("div",{class:"header"},a("p",{class:"text-xl m-0 font-semibold text-storm-dark"},this.menuText),a("p-button",{variant:"secondary",icon:"negative",iconPosition:"end",size:"small",onClick:()=>this._showMenu=false},this.closeText)),a("div",{class:"company"},a("slot",{name:"company"})),a("div",{class:"content"},a("slot",{name:"content"})),a("div",{class:"user"},a("slot",{name:"user"}))),a("div",{class:"top-bar"},a("p-button",{variant:"secondary",icon:"menu",size:"small",onClick:()=>this._showMenu=true},this.menuText),a("slot",{name:"topbar"})))}handleCloseNavbar(){this._showMenu=false}handleOpenNavbar(){this._showMenu=true}};o.style=r;export{o as p_navbar};
|
|
2
|
+
//# sourceMappingURL=p-21e5da04.entry.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":["navbarComponentCss","Navbar","render","h","Host","class","applyBlur","this","_showMenu","onClicked","menuText","variant","icon","iconPosition","size","onClick","closeText","name","handleCloseNavbar","handleOpenNavbar"],"sources":["src/components/organisms/navbar/navbar.component.scss?tag=p-navbar&encapsulation=shadow","src/components/organisms/navbar/navbar.component.tsx"],"sourcesContent":["@import '../../../style/mixins';\n\n:host {\n\t@apply w-full max-h-screen-safe;\n\t@apply layout-1280:w-60 layout-1680:w-72;\n\n\t.sidebar,\n\t.sidebar .company,\n\t.sidebar .content,\n\t.sidebar .user,\n\t.userbar {\n\t\t@apply flex w-full flex-col;\n\t}\n\n\t.sidebar,\n\t.top-bar {\n\t\t@apply bg-white;\n\t\t@apply border-0 border-solid border-mystic-dark #{!important};\n\t}\n\n\t.sidebar {\n\t\t@apply fixed top-0 left-0 z-navbar h-screen w-60 bg-white;\n\t\t@apply layout-1280:relative layout-1280:h-full layout-1280:w-full;\n\t\t@apply gap-6;\n\n\t\t@apply will-change-transform;\n\t\t@apply -translate-x-full transform-gpu layout-1280:translate-x-0;\n\n\t\t@apply py-4;\n\n\t\tpadding-top: calc(env(safe-area-inset-top, 0) + 1rem);\n\n\t\t@apply border-r #{!important};\n\n\t\t@apply transition-all;\n\n\t\t.company,\n\t\t.content,\n\t\t.user,\n\t\t.header {\n\t\t\t@apply px-4;\n\t\t}\n\n\t\t.header {\n\t\t\t@apply flex w-full items-center justify-between;\n\t\t\t@apply layout-1280:hidden;\n\t\t}\n\n\t\t.content {\n\t\t\t@apply overflow-y-auto;\n\n\t\t\t@include scrollbarY();\n\t\t}\n\n\t\t.user {\n\t\t\t@apply mt-auto hidden;\n\t\t\t@apply layout-1280:flex;\n\t\t}\n\n\t\t&.show {\n\t\t\t--tw-translate-x: env(safe-area-inset-left, 0);\n\t\t}\n\t}\n\n\t.top-bar {\n\t\t@apply flex w-full justify-between px-4 py-2;\n\n\t\tpadding-top: calc(env(safe-area-inset-top, 0) + 0.5rem);\n\t\theight: calc(env(safe-area-inset-top, 0) + 3rem);\n\n\t\t@apply border-b #{!important};\n\n\t\t@apply layout-1280:hidden;\n\t}\n\n\tp-backdrop {\n\t\t@apply hidden;\n\n\t\t&.show {\n\t\t\t@apply block;\n\t\t}\n\t}\n}\n","import { Component, h, Host, Listen, Prop, State } from '@stencil/core';\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 close button\n\t */\n\t@Prop() closeText = 'Close';\n\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 _showMenu = false;\n\n\trender() {\n\t\treturn (\n\t\t\t<Host class=\"p-navbar\">\n\t\t\t\t<p-backdrop\n\t\t\t\t\tapplyBlur={true}\n\t\t\t\t\tclass={`z-navbar-backdrop desktop-xs:hidden ${\n\t\t\t\t\t\tthis._showMenu && 'show'\n\t\t\t\t\t}`}\n\t\t\t\t\tonClicked={() => (this._showMenu = false)}\n\t\t\t\t></p-backdrop>\n\t\t\t\t<div class={`sidebar ${this._showMenu && 'show'}`}>\n\t\t\t\t\t<div class=\"header\">\n\t\t\t\t\t\t<p class=\"text-xl m-0 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\tsize=\"small\"\n\t\t\t\t\t\t\tonClick={() => (this._showMenu = false)}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{this.closeText}\n\t\t\t\t\t\t</p-button>\n\t\t\t\t\t</div>\n\t\t\t\t\t<div class=\"company\">\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=\"content\">\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=\"user\">\n\t\t\t\t\t\t<slot name=\"user\" />\n\t\t\t\t\t</div>\n\t\t\t\t</div>\n\n\t\t\t\t<div class=\"top-bar\">\n\t\t\t\t\t<p-button\n\t\t\t\t\t\tvariant=\"secondary\"\n\t\t\t\t\t\ticon=\"menu\"\n\t\t\t\t\t\tsize=\"small\"\n\t\t\t\t\t\tonClick={() => (this._showMenu = true)}\n\t\t\t\t\t>\n\t\t\t\t\t\t{this.menuText}\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._showMenu = false;\n\t}\n\n\t@Listen('openNavbar', { target: 'window' })\n\thandleOpenNavbar() {\n\t\tthis._showMenu = true;\n\t}\n}\n"],"mappings":"kDAAA,MAAMA,EAAqB,0nJ,MCOdC,EAAM,M,wCAIE,Q,cAKD,O,eAEU,K,CAE7B,MAAAC,GACC,OACCC,EAACC,EAAI,CAACC,MAAM,YACXF,EAAA,cACCG,UAAW,KACXD,MAAO,uCACNE,KAAKC,WAAa,SAEnBC,UAAW,IAAOF,KAAKC,UAAY,QAEpCL,EAAA,OAAKE,MAAO,WAAWE,KAAKC,WAAa,UACxCL,EAAA,OAAKE,MAAM,UACVF,EAAA,KAAGE,MAAM,6CACPE,KAAKG,UAGPP,EAAA,YACCQ,QAAQ,YACRC,KAAK,WACLC,aAAa,MACbC,KAAK,QACLC,QAAS,IAAOR,KAAKC,UAAY,OAEhCD,KAAKS,YAGRb,EAAA,OAAKE,MAAM,WACVF,EAAA,QAAMc,KAAK,aAEZd,EAAA,OAAKE,MAAM,WACVF,EAAA,QAAMc,KAAK,aAGZd,EAAA,OAAKE,MAAM,QACVF,EAAA,QAAMc,KAAK,WAIbd,EAAA,OAAKE,MAAM,WACVF,EAAA,YACCQ,QAAQ,YACRC,KAAK,OACLE,KAAK,QACLC,QAAS,IAAOR,KAAKC,UAAY,MAEhCD,KAAKG,UAGPP,EAAA,QAAMc,KAAK,Y,CAOf,iBAAAC,GACCX,KAAKC,UAAY,K,CAIlB,gBAAAW,GACCZ,KAAKC,UAAY,I"}
|
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
import{r as t,h as e,H as i}from"./p-e4d5e7a7.js";const n='.relative{position:relative!important}.sticky{position:sticky!important}.order-1{order:1!important}.order-2{order:2!important}.order-3{order:3!important}.box-border{box-sizing:border-box!important}.flex{display:flex!important}.grid{display:grid!important}.hidden{display:none!important}.h-full{height:100%!important}.h-screen{height:100vh!important}.w-full{width:100%!important}.w-screen{width:100vw!important}.w-unset{width:unset!important}.flex-1{flex:1 1 0%!important}.flex-col{flex-direction:column!important}.content-start{align-content:flex-start!important}.items-center{align-items:center!important}.overflow-y-auto{overflow-y:auto!important}.px-content-mobile-x{padding-left:1rem!important;padding-right:1rem!important}*{box-sizing:border-box}:host{align-content:flex-start;display:grid;gap:0;grid-template-areas:"sidebar" "topbar" "content";grid-template-columns:1fr;grid-template-rows:repeat(1fr,3);height:100vh;overflow:hidden;width:100vw}@media (min-width:80rem){:host{grid-template-areas:"topbar topbar" "sidebar content";grid-template-columns:auto 1fr;grid-template-rows:auto 1fr}}:host .content,:host .sidebar,:host .topbar{align-self:flex-start}:host .topbar{grid-area:topbar;order:2;position:sticky;width:100%}@media (min-width:80rem){:host .topbar{order:1}}:host .sidebar{box-sizing:border-box;display:flex;grid-area:sidebar;height:100%;order:1;width:100%}@media (min-width:80rem){:host .sidebar{order:2;width:15rem}}@media (min-width:105rem){:host .sidebar{width:18rem}}:host .content{display:flex;flex-direction:column;grid-area:content;height:100%;order:3;overflow-x:hidden;overflow-y:auto;padding:0 env(safe-area-inset-right) env(safe-area-inset-bottom) env(safe-area-inset-left);position:relative}:host .content .inner-content{padding:1.5rem 1rem;position:relative}@media (min-width:40rem){:host .content .inner-content{padding:2rem}}@media (min-width:80rem){:host .content .inner-content{padding:2rem 1.5rem 1.5rem;width:65rem}}@media (min-width:90rem){:host .content .inner-content{padding:2rem;width:75rem}}@media (min-width:96rem){:host .content .inner-content{width:81rem}}@media (min-width:105rem){:host .content .inner-content{width:87rem}}@media (min-width:120rem){:host .content .inner-content{padding-bottom:5rem;padding-left:5rem;padding-right:2rem;width:90rem}}@media (min-width:160rem){:host .content .inner-content{padding-bottom:7.5rem;padding-left:7.5rem;padding-top:4rem;width:92.5rem}}:host(.variant-default) .content{flex:1 1 0%}:host(.variant-login){grid-template-areas:"topbar topbar" "content content"}@media (min-width:80rem){:host(.variant-login){grid-template-areas:"topbar topbar" "content sidebar"}}:host(.variant-login) .sidebar{display:none;flex:1 1 0%;order:3;overflow:hidden;padding:.5rem;width:unset}@media (min-width:80rem){:host(.variant-login) .sidebar{display:flex}}:host(.variant-login) .sidebar .inner-content{padding:.5rem}:host(.variant-login) .content{align-items:center;order:3}@media (min-width:80rem){:host(.variant-login) .content{justify-content:center;order:2}}:host(.variant-login) .content .inner-content{box-sizing:border-box;padding:calc(env(safe-area-inset-top) + 3.5rem) 1rem 1.5rem;width:100%}@media (min-width:64rem){:host(.variant-login) .content .inner-content{padding-bottom:0;padding-top:0}}@media (min-width:80rem){:host(.variant-login) .content .inner-content{padding-left:4.5rem;padding-right:4.5rem;padding-top:1.5rem}}@media (min-width:40rem){:host(.variant-login) .content .inner-content{width:30rem}}@media (min-width:80rem){.layout-1280\\:flex{display:flex!important}.layout-1280\\:w-60{width:15rem!important}.layout-1280\\:w-content-1280{width:65rem!important}.layout-1280\\:p-6{padding:1.5rem!important}.layout-1280\\:px-18{padding-left:4.5rem!important;padding-right:4.5rem!important}}@media (min-width:90rem){.layout-1440\\:w-content-1440{width:75rem!important}}@media (min-width:120rem){.layout-1920\\:w-content-1920{width:90rem!important}.layout-1920\\:pl-20{padding-left:5rem!important}.layout-1920\\:pr-8{padding-right:2rem!important}}@media (min-width:160rem){.layout-2560\\:w-content-2560{width:92.5rem!important}.layout-2560\\:pb-\\[7\\.5rem\\]{padding-bottom:7.5rem!important}.layout-2560\\:pl-\\[7\\.5rem\\]{padding-left:7.5rem!important}.layout-2560\\:pt-16{padding-top:4rem!important}}.static{position:static!important}';const r=class{constructor(e){t(this,e);this.variant="default"}render(){return e(i,{class:`p-layout variant-${this.variant}`},e("div",{class:"topbar"},e("slot",{name:"topbar"})),e("div",{class:"sidebar"},e("slot",{name:"sidebar"})),e("div",{class:"content"},e("div",{class:"inner-content"},e("slot",{name:"content"}))))}};r.style=n;export{r as p_layout};
|
|
2
|
+
//# sourceMappingURL=p-de4ae1ca.entry.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":["layoutComponentCss","Layout","render","h","Host","class","this","variant","name"],"sources":["src/components/atoms/layout/layout.component.scss?tag=p-layout&encapsulation=shadow","src/components/atoms/layout/layout.component.tsx"],"sourcesContent":[":host {\n\t@apply grid h-screen w-screen content-start overflow-hidden;\n\n\tgrid-template-columns: 1fr;\n\tgrid-template-rows: repeat(1fr, 3);\n\tgap: 0;\n\tgrid-template-areas:\n\t\t'sidebar'\n\t\t'topbar'\n\t\t'content';\n\n\t@screen layout-1280 {\n\t\tgrid-template-columns: auto 1fr;\n\t\tgrid-template-rows: auto 1fr;\n\t\tgrid-template-areas:\n\t\t\t'topbar topbar'\n\t\t\t'sidebar content';\n\t}\n\n\t.topbar,\n\t.sidebar,\n\t.content {\n\t\t@apply self-start;\n\t}\n\n\t.topbar {\n\t\tgrid-area: topbar;\n\n\t\t@apply sticky w-full;\n\t\t@apply order-2 desktop-sm:order-1;\n\t}\n\n\t.sidebar {\n\t\tgrid-area: sidebar;\n\n\t\t@apply box-border flex h-full;\n\t\t@apply w-full;\n\t\t@apply layout-1280:w-60 layout-1680:w-72;\n\t\t@apply order-1 desktop-sm:order-2;\n\t}\n\n\t.content {\n\t\tgrid-area: content;\n\n\t\t@apply relative flex h-full flex-col overflow-y-auto overflow-x-hidden;\n\t\t@apply order-3;\n\n\t\tpadding: 0 env(safe-area-inset-right) env(safe-area-inset-bottom)\n\t\t\tenv(safe-area-inset-left);\n\n\t\t.inner-content {\n\t\t\t@apply relative pb-24;\n\n\t\t\t// https://linear.app/employes/issue/PRO-9053/%E2%9A%9B%EF%B8%8F-component-wijzigen-layout\n\t\t\t@apply px-content-mobile-x py-content-mobile-y;\n\t\t\t@apply tablet:p-8;\n\t\t\t@apply layout-1280:w-content-1280 layout-1280:p-6 layout-1280:pt-8;\n\t\t\t@apply layout-1440:w-content-1440 layout-1440:p-8;\n\t\t\t@apply layout-1536:w-content-1536;\n\t\t\t@apply layout-1680:w-content-1680;\n\t\t\t@apply layout-1920:w-content-1920 layout-1920:pr-8 layout-1920:pl-20 layout-1920:pb-20;\n\t\t\t@apply layout-2560:w-content-2560 layout-2560:pt-16 layout-2560:pl-[7.5rem] layout-2560:pb-[7.5rem];\n\t\t}\n\t}\n}\n\n:host(.variant-default) {\n\t.content {\n\t\t@apply flex-1;\n\t}\n}\n\n:host(.variant-login) {\n\tgrid-template-areas:\n\t\t'topbar topbar'\n\t\t'content content';\n\n\t@screen layout-1280 {\n\t\tgrid-template-areas:\n\t\t\t'topbar topbar'\n\t\t\t'content sidebar';\n\t}\n\n\t.sidebar {\n\t\t@apply hidden w-unset layout-1280:flex;\n\t\t@apply order-3 p-2;\n\t\t@apply flex-1 overflow-hidden;\n\n\t\t.inner-content {\n\t\t\t@apply p-2;\n\t\t}\n\t}\n\n\t.content {\n\t\t@apply order-3 layout-1280:order-2;\n\t\t@apply items-center layout-1280:justify-center;\n\n\t\t.inner-content {\n\t\t\t@apply box-border;\n\t\t\t@apply layout-1280:px-18 desktop-xs:py-0;\n\t\t\t@apply w-full tablet:w-content-desktop-login;\n\n\t\t\t@apply px-content-mobile-x py-content-mobile-y;\n\t\t\tpadding-top: calc(env(safe-area-inset-top) + 3.5rem);\n\n\t\t\t@screen layout-1280 {\n\t\t\t\t@apply pt-content-mobile-y;\n\t\t\t}\n\t\t}\n\t}\n}\n","import { Component, h, Host, Prop } from '@stencil/core';\n\n@Component({\n\ttag: 'p-layout',\n\tstyleUrl: 'layout.component.scss',\n\tshadow: true,\n})\nexport class Layout {\n\t/**\n\t * Variant of the layout\n\t */\n\t@Prop() variant: 'default' | 'login' = 'default';\n\n\trender() {\n\t\treturn (\n\t\t\t<Host class={`p-layout variant-${this.variant}`}>\n\t\t\t\t<div class=\"topbar\">\n\t\t\t\t\t<slot name=\"topbar\" />\n\t\t\t\t</div>\n\t\t\t\t<div class=\"sidebar\">\n\t\t\t\t\t<slot name=\"sidebar\" />\n\t\t\t\t</div>\n\t\t\t\t<div class=\"content\">\n\t\t\t\t\t<div class=\"inner-content\">\n\t\t\t\t\t\t<slot name=\"content\" />\n\t\t\t\t\t</div>\n\t\t\t\t</div>\n\t\t\t</Host>\n\t\t);\n\t}\n}\n"],"mappings":"kDAAA,MAAMA,EAAqB,uuI,MCOdC,EAAM,M,sCAIqB,S,CAEvC,MAAAC,GACC,OACCC,EAACC,EAAI,CAACC,MAAO,oBAAoBC,KAAKC,WACrCJ,EAAA,OAAKE,MAAM,UACVF,EAAA,QAAMK,KAAK,YAEZL,EAAA,OAAKE,MAAM,WACVF,EAAA,QAAMK,KAAK,aAEZL,EAAA,OAAKE,MAAM,WACVF,EAAA,OAAKE,MAAM,iBACVF,EAAA,QAAMK,KAAK,c"}
|