@getflip/swirl-components 0.472.0 → 0.473.0
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/components.json +13 -3
- package/dist/cjs/swirl-data-cell.cjs.entry.js +6 -2
- package/dist/cjs/swirl-modal-shell.cjs.entry.js +3 -3
- package/dist/cjs/swirl-shell-layout.cjs.entry.js +7 -6
- package/dist/cjs/swirl-shell-navigation-item.cjs.entry.js +3 -2
- package/dist/collection/components/swirl-data-cell/swirl-data-cell.js +6 -2
- package/dist/collection/components/swirl-modal-shell/swirl-modal-shell.js +3 -3
- package/dist/collection/components/swirl-modal-shell/swirl-modal-shell.stories.js +31 -1
- package/dist/collection/components/swirl-shell-layout/swirl-shell-layout.js +8 -6
- package/dist/collection/components/swirl-shell-navigation-item/swirl-shell-navigation-item.js +4 -2
- package/dist/components/swirl-data-cell.js +1 -1
- package/dist/components/swirl-modal-shell.js +1 -1
- package/dist/components/swirl-shell-layout.js +1 -1
- package/dist/components/swirl-shell-navigation-item.js +1 -1
- package/dist/esm/swirl-data-cell.entry.js +6 -2
- package/dist/esm/swirl-modal-shell.entry.js +3 -3
- package/dist/esm/swirl-shell-layout.entry.js +7 -6
- package/dist/esm/swirl-shell-navigation-item.entry.js +3 -2
- package/dist/swirl-components/p-00dedfee.entry.js +1 -0
- package/dist/swirl-components/p-2d11e95d.entry.js +1 -0
- package/dist/swirl-components/p-550a981d.entry.js +11 -0
- package/dist/swirl-components/p-ed4ed066.entry.js +1 -0
- package/dist/swirl-components/swirl-components.esm.js +1 -1
- package/dist/types/components/swirl-modal-shell/swirl-modal-shell.d.ts +1 -0
- package/dist/types/components/swirl-shell-layout/swirl-shell-layout.d.ts +1 -0
- package/dist/types/components/swirl-shell-navigation-item/swirl-shell-navigation-item.d.ts +1 -0
- package/dist/types/components.d.ts +24 -0
- package/package.json +1 -1
- package/dist/swirl-components/p-3431e87d.entry.js +0 -1
- package/dist/swirl-components/p-3a43e8ec.entry.js +0 -11
- package/dist/swirl-components/p-3d11e378.entry.js +0 -1
- package/dist/swirl-components/p-4b51723f.entry.js +0 -1
|
@@ -8,4 +8,4 @@ var m=["input:not([inert])","select:not([inert])","textarea:not([inert])","a[hre
|
|
|
8
8
|
* focus-trap 7.5.4
|
|
9
9
|
* @license MIT, https://github.com/focus-trap/focus-trap/blob/master/LICENSE
|
|
10
10
|
*/
|
|
11
|
-
function B(e,l){var a=Object.keys(e);if(Object.getOwnPropertySymbols){var t=Object.getOwnPropertySymbols(e);l&&(t=t.filter((function(l){return Object.getOwnPropertyDescriptor(e,l).enumerable}))),a.push.apply(a,t)}return a}function G(e){for(var l=1;l<arguments.length;l++){var a=null!=arguments[l]?arguments[l]:{};l%2?B(Object(a),!0).forEach((function(l){M(e,l,a[l])})):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(a)):B(Object(a)).forEach((function(l){Object.defineProperty(e,l,Object.getOwnPropertyDescriptor(a,l))}))}return e}function M(e,l,a){return(l=function(e){var l=function(e,l){if("object"!=typeof e||null===e)return e;var a=e[Symbol.toPrimitive];if(void 0!==a){var t=a.call(e,l);if("object"!=typeof t)return t;throw new TypeError("@@toPrimitive must return a primitive value.")}return e+""}(e,"string");return"symbol"==typeof l?l:l+""}(l))in e?Object.defineProperty(e,l,{value:a,enumerable:!0,configurable:!0,writable:!0}):e[l]=a,e}var W=function(e){return"Tab"===(null==e?void 0:e.key)||9===(null==e?void 0:e.keyCode)},V=function(e){return W(e)&&!e.shiftKey},U=function(e){return W(e)&&e.shiftKey},Y=function(e){return setTimeout(e,0)},H=function(e,l){var a=-1;return e.every((function(e,t){return!l(e)||(a=t,!1)})),a},K=function(e){for(var l=arguments.length,a=Array(l>1?l-1:0),t=1;t<l;t++)a[t-1]=arguments[t];return"function"==typeof e?e.apply(void 0,a):e},$=function(e){return e.target.shadowRoot&&"function"==typeof e.composedPath?e.composedPath()[0]:e.target},X=[],q=function(e,l){var a,t=(null==l?void 0:l.document)||document,o=(null==l?void 0:l.trapStack)||X,s=G({returnFocusOnDeactivate:!0,escapeDeactivates:!0,delayInitialFocus:!0,isKeyForward:V,isKeyBackward:U},l),i={containers:[],containerGroups:[],tabbableGroups:[],nodeFocusedBeforeActivation:null,mostRecentlyFocusedNode:null,active:!1,paused:!1,delayInitialFocusTimer:void 0,recentNavEvent:void 0},r=function(e,l,a){return e&&void 0!==e[l]?e[l]:s[a||l]},n=function(e,l){var a="function"==typeof(null==l?void 0:l.composedPath)?l.composedPath():void 0;return i.containerGroups.findIndex((function(l){var t=l.container,o=l.tabbableNodes;return t.contains(e)||(null==a?void 0:a.includes(t))||o.find((function(l){return l===e}))}))},c=function(e){var l=s[e];if("function"==typeof l){for(var a=arguments.length,o=Array(a>1?a-1:0),i=1;i<a;i++)o[i-1]=arguments[i];l=l.apply(void 0,o)}if(!0===l&&(l=void 0),!l){if(void 0===l||!1===l)return l;throw Error("`".concat(e,"` was specified but was not a node, or did not return a node"))}var r=l;if("string"==typeof l&&!(r=t.querySelector(l)))throw Error("`".concat(e,"` as selector refers to no known node"));return r},d=function(){var e=c("initialFocus");if(!1===e)return!1;if(void 0===e||!z(e,s.tabbableOptions))if(n(t.activeElement)>=0)e=t.activeElement;else{var l=i.tabbableGroups[0];e=l&&l.firstTabbableNode||c("fallbackFocus")}if(!e)throw Error("Your focus-trap needs to have at least one focusable element");return e},u=function(){if(i.containerGroups=i.containers.map((function(e){var l=function(e,l){var a;return a=(l=l||{}).getShadowRoot?S([e],l.includeContainer,{filter:I.bind(null,l),flatten:!1,getShadowRoot:l.getShadowRoot,shadowRootFilter:D}):E(e,l.includeContainer,I.bind(null,l)),F(a)}(e,s.tabbableOptions),a=function(e,l){return(l=l||{}).getShadowRoot?S([e],l.includeContainer,{filter:O.bind(null,l),flatten:!0,getShadowRoot:l.getShadowRoot}):E(e,l.includeContainer,O.bind(null,l))}(e,s.tabbableOptions),t=l.length>0?l[0]:void 0,o=l.length>0?l[l.length-1]:void 0,i=a.find((function(e){return R(e)})),r=a.slice().reverse().find((function(e){return R(e)})),n=!!l.find((function(e){return T(e)>0}));return{container:e,tabbableNodes:l,focusableNodes:a,posTabIndexesFound:n,firstTabbableNode:t,lastTabbableNode:o,firstDomTabbableNode:i,lastDomTabbableNode:r,nextTabbableNode:function(e){var t=!(arguments.length>1&&void 0!==arguments[1])||arguments[1],o=l.indexOf(e);return o<0?t?a.slice(a.indexOf(e)+1).find((function(e){return R(e)})):a.slice(0,a.indexOf(e)).reverse().find((function(e){return R(e)})):l[o+(t?1:-1)]}}})),i.tabbableGroups=i.containerGroups.filter((function(e){return e.tabbableNodes.length>0})),i.tabbableGroups.length<=0&&!c("fallbackFocus"))throw Error("Your focus-trap must have at least one container with at least one tabbable node in it at all times");if(i.containerGroups.find((function(e){return e.posTabIndexesFound}))&&i.containerGroups.length>1)throw Error("At least one node with a positive tabindex was found in one of your focus-trap's multiple containers. Positive tabindexes are only supported in single-container focus-traps.")},h=function e(l){var a=l.activeElement;if(a)return a.shadowRoot&&null!==a.shadowRoot.activeElement?e(a.shadowRoot):a},f=function e(l){!1!==l&&l!==h(document)&&(l&&l.focus?(l.focus({preventScroll:!!s.preventScroll}),i.mostRecentlyFocusedNode=l,function(e){return e.tagName&&"input"===e.tagName.toLowerCase()&&"function"==typeof e.select}(l)&&l.select()):e(d()))},y=function(e){var l=c("setReturnFocus",e);return l||!1!==l&&e},v=function(e){var l=e.target,a=e.event,t=e.isBackward,o=void 0!==t&&t;l=l||$(a),u();var r=null;if(i.tabbableGroups.length>0){var d=n(l,a),h=d>=0?i.containerGroups[d]:void 0;if(d<0)r=o?i.tabbableGroups[i.tabbableGroups.length-1].lastTabbableNode:i.tabbableGroups[0].firstTabbableNode;else if(o){var f=H(i.tabbableGroups,(function(e){return l===e.firstTabbableNode}));if(f<0&&(h.container===l||z(l,s.tabbableOptions)&&!R(l,s.tabbableOptions)&&!h.nextTabbableNode(l,!1))&&(f=d),f>=0){var y=i.tabbableGroups[0===f?i.tabbableGroups.length-1:f-1];r=T(l)>=0?y.lastTabbableNode:y.lastDomTabbableNode}else W(a)||(r=h.nextTabbableNode(l,!1))}else{var v=H(i.tabbableGroups,(function(e){return l===e.lastTabbableNode}));if(v<0&&(h.container===l||z(l,s.tabbableOptions)&&!R(l,s.tabbableOptions)&&!h.nextTabbableNode(l))&&(v=d),v>=0){var b=i.tabbableGroups[v===i.tabbableGroups.length-1?0:v+1];r=T(l)>=0?b.firstTabbableNode:b.firstDomTabbableNode}else W(a)||(r=h.nextTabbableNode(l))}}else r=c("fallbackFocus");return r},b=function(e){var l=$(e);n(l,e)>=0||(K(s.clickOutsideDeactivates,e)?a.deactivate({returnFocus:s.returnFocusOnDeactivate}):K(s.allowOutsideClick,e)||e.preventDefault())},w=function(e){var l=$(e),a=n(l,e)>=0;if(a||l instanceof Document)a&&(i.mostRecentlyFocusedNode=l);else{var t;e.stopImmediatePropagation();var o=!0;if(i.mostRecentlyFocusedNode)if(T(i.mostRecentlyFocusedNode)>0){var r=n(i.mostRecentlyFocusedNode),c=i.containerGroups[r].tabbableNodes;if(c.length>0){var u=c.findIndex((function(e){return e===i.mostRecentlyFocusedNode}));u>=0&&(s.isKeyForward(i.recentNavEvent)?u+1<c.length&&(t=c[u+1],o=!1):u-1>=0&&(t=c[u-1],o=!1))}}else i.containerGroups.some((function(e){return e.tabbableNodes.some((function(e){return T(e)>0}))}))||(o=!1);else o=!1;o&&(t=v({target:i.mostRecentlyFocusedNode,isBackward:s.isKeyBackward(i.recentNavEvent)})),f(t||i.mostRecentlyFocusedNode||d())}i.recentNavEvent=void 0},p=function(e){if(function(e){return"Escape"===(null==e?void 0:e.key)||"Esc"===(null==e?void 0:e.key)||27===(null==e?void 0:e.keyCode)}(e)&&!1!==K(s.escapeDeactivates,e))return e.preventDefault(),void a.deactivate();(s.isKeyForward(e)||s.isKeyBackward(e))&&function(e){var l=arguments.length>1&&void 0!==arguments[1]&&arguments[1];i.recentNavEvent=e;var a=v({event:e,isBackward:l});a&&(W(e)&&e.preventDefault(),f(a))}(e,s.isKeyBackward(e))},m=function(e){var l=$(e);n(l,e)>=0||K(s.clickOutsideDeactivates,e)||K(s.allowOutsideClick,e)||(e.preventDefault(),e.stopImmediatePropagation())},g=function(){if(i.active)return function(e,l){if(e.length>0){var a=e[e.length-1];a!==l&&a.pause()}var t=e.indexOf(l);-1===t||e.splice(t,1),e.push(l)}(o,a),i.delayInitialFocusTimer=s.delayInitialFocus?Y((function(){f(d())})):f(d()),t.addEventListener("focusin",w,!0),t.addEventListener("mousedown",b,{capture:!0,passive:!1}),t.addEventListener("touchstart",b,{capture:!0,passive:!1}),t.addEventListener("click",m,{capture:!0,passive:!1}),t.addEventListener("keydown",p,{capture:!0,passive:!1}),a},_=function(){if(i.active)return t.removeEventListener("focusin",w,!0),t.removeEventListener("mousedown",b,!0),t.removeEventListener("touchstart",b,!0),t.removeEventListener("click",m,!0),t.removeEventListener("keydown",p,!0),a},k="undefined"!=typeof window&&"MutationObserver"in window?new MutationObserver((function(e){e.some((function(e){return Array.from(e.removedNodes).some((function(e){return e===i.mostRecentlyFocusedNode}))}))&&f(d())})):void 0,x=function(){k&&(k.disconnect(),i.active&&!i.paused&&i.containers.map((function(e){k.observe(e,{subtree:!0,childList:!0})})))};return(a={get active(){return i.active},get paused(){return i.paused},activate:function(e){if(i.active)return this;var l=r(e,"onActivate"),a=r(e,"onPostActivate"),o=r(e,"checkCanFocusTrap");o||u(),i.active=!0,i.paused=!1,i.nodeFocusedBeforeActivation=t.activeElement,null==l||l();var s=function(){o&&u(),g(),x(),null==a||a()};return o?(o(i.containers.concat()).then(s,s),this):(s(),this)},deactivate:function(e){if(!i.active)return this;var l=G({onDeactivate:s.onDeactivate,onPostDeactivate:s.onPostDeactivate,checkCanReturnFocus:s.checkCanReturnFocus},e);clearTimeout(i.delayInitialFocusTimer),i.delayInitialFocusTimer=void 0,_(),i.active=!1,i.paused=!1,x(),function(e,l){var a=e.indexOf(l);-1!==a&&e.splice(a,1),e.length>0&&e[e.length-1].unpause()}(o,a);var t=r(l,"onDeactivate"),n=r(l,"onPostDeactivate"),c=r(l,"checkCanReturnFocus"),d=r(l,"returnFocus","returnFocusOnDeactivate");null==t||t();var u=function(){Y((function(){d&&f(y(i.nodeFocusedBeforeActivation)),null==n||n()}))};return d&&c?(c(y(i.nodeFocusedBeforeActivation)).then(u,u),this):(u(),this)},pause:function(e){if(i.paused||!i.active)return this;var l=r(e,"onPause"),a=r(e,"onPostPause");return i.paused=!0,null==l||l(),_(),x(),null==a||a(),this},unpause:function(e){if(!i.paused||!i.active)return this;var l=r(e,"onUnpause"),a=r(e,"onPostUnpause");return i.paused=!1,null==l||l(),u(),g(),x(),null==a||a(),this},updateContainerElements:function(e){var l=[].concat(e).filter(Boolean);return i.containers=l.map((function(e){return"string"==typeof e?t.querySelector(e):e})),i.active&&u(),x(),this}}).updateContainerElements(e),a};const J="SWIRL_SHELL_SECONDARY_NAVIGATION_COLLAPSE_STATE",Q="SWIRL_SHELL_SECONDARY_NAVIGATION_VIEW_STATE",Z="SWIRL_SHELL_NAVIGATION_COLLAPSE_STATE",ee=e(class extends l{constructor(e){super(),!1!==e&&this.__registerHost(),this.historyBackClick=a(this,"historyBackClick",7),this.historyForwardClick=a(this,"historyForwardClick",7),this.skipLinkClick=a(this,"skipLinkClick",7),this.browserBackButtonLabel="Navigate back",this.browserForwardButtonLabel="Navigate forward",this.collapseNavigationButtonLabel="Collapse navigation",this.enableSecondaryNavGridLayout=!0,this.secondaryNavGridLayoutVariant="tiled",this.expandNavigationButtonLabel="Expand navigation",this.gridNavLayoutToggleLabel="Grid",this.hideMobileNavigationButtonLabel="Close navigation",this.listNavLayoutToggleLabel="List",this.navigationLabel="Main",this.secondaryNavCollapseLabel="Show less",this.secondaryNavExpandLabel="Show more",this.skipLinkLabel="Skip to main content",this.isDesktopViewport=!0,this.secondaryNavView="list",this.collectNavItems=()=>{this.mainNavItems=Array.from(this.el.querySelectorAll("swirl-shell-navigation-item[slot='nav'], [slot='nav'] swirl-shell-navigation-item")),this.secondaryNavItems=Array.from(this.el.querySelectorAll("swirl-shell-navigation-item[slot='secondary-nav'], [slot='secondary-nav'] swirl-shell-navigation-item")),this.toggleNavItemLabels(),this.setSecondaryNavItemsTiled()},this.toggleSecondaryNavView=e=>{e.stopPropagation(),this.secondaryNavView="grid"===this.secondaryNavView?"list":"grid",this.setSecondaryNavItemsTiled(),localStorage.setItem(Q,this.secondaryNavView+"")},this.toggleSecondaryNavCollapse=e=>{e.stopPropagation(),this.secondaryNavCollapsed=!this.secondaryNavCollapsed,localStorage.setItem(J,this.secondaryNavCollapsed+"")},this.onNavigationToggleClick=()=>{this.navigationCollapsed=!this.navigationCollapsed},this.onNavigationClick=()=>{this.hideMobileNavigation()}}componentWillLoad(){this.isDesktopViewport=r(),this.collectNavItems();const e="true"===localStorage.getItem(Z);this.navigationCollapsed=e,this.restoreSecondaryNavState()}componentDidLoad(){this.focusTrap=q(this.navElement,{allowOutsideClick:!0,tabbableOptions:{getShadowRoot:e=>e.shadowRoot}}),this.collectNavItems(),this.navMutationObserver=new MutationObserver((()=>{this.collectNavItems()})),this.navMutationObserver.observe(this.navElement,{childList:!0,subtree:!0})}componentDidRender(){this.focusTrap?.updateContainerElements(this.navElement)}disconnectedCallback(){this.focusTrap?.deactivate(),this.navMutationObserver?.disconnect()}onWindowKeyDown(e){"Escape"===e.key&&this.mobileNavigationActive&&this.hideMobileNavigation()}watchEnableSecondaryNavGridLayout(){this.restoreSecondaryNavState()}watchMobileNavigationState(){this.mobileNavigationActive?setTimeout((()=>{this.focusTrap.activate()}),200):this.focusTrap.deactivate()}watchNavigationCollapsed(){localStorage.setItem(Z,this.navigationCollapsed+""),this.toggleNavItemLabels(),this.setSecondaryNavItemsTiled()}onWindowResize(){this.isDesktopViewport!==r()&&(this.isDesktopViewport=r(),this.collectNavItems())}async showMobileNavigation(){this.mobileNavigationActive=!0,this.collectNavItems()}async hideMobileNavigation(){this.mobileNavigationActive=!1,this.toggleNavItemLabels()}toggleNavItemLabels(){[...this.secondaryNavItems,...this.mainNavItems].forEach((e=>{e.hideLabel=this.navigationCollapsed&&this.isDesktopViewport}))}setSecondaryNavItemsTiled(){this.secondaryNavItems.forEach((e=>{e.variant=this.enableSecondaryNavGridLayout&&("grid"===this.secondaryNavView||this.navigationCollapsed&&this.isDesktopViewport)?this.secondaryNavGridLayoutVariant:"default"}))}restoreSecondaryNavState(){if(this.enableSecondaryNavGridLayout){const e="true"===localStorage.getItem(J);this.secondaryNavCollapsed=e;const l=localStorage.getItem(Q);this.secondaryNavView=l}}render(){const e=this.navigationCollapsed&&this.isDesktopViewport,l=!!this.el.querySelector("[slot='secondary-nav']"),a=i("shell-layout",{"shell-layout--branded-header":this.brandedHeader,"shell-layout--secondary-nav-collapsed":this.secondaryNavCollapsed,"shell-layout--has-secondary-nav":l,"shell-layout--mobile-navigation-active":this.mobileNavigationActive,"shell-layout--navigation-collapsed":e});return t(o,{key:"e139235339bd65d5a0fb36e25032f04f22261a0b"},t("div",{key:"ffa06f1c0dc82956016339d5175d256be3477e87",class:a},t("header",{key:"cb68d44dba28a76772235e7f33d0ee7deec4b32b",class:"shell-layout__header","data-tauri-drag-region":"true"},t("button",{key:"3eec419fff5aee8561e5ccb636cbfd4d898a7c7c",class:"shell-layout__skip-link",onClick:this.skipLinkClick.emit,type:"button"},this.skipLinkLabel),t("div",{key:"c447b9262733330a9e1f3d33430f97408bbdd637",class:"shell-layout__header-left"},t("swirl-tooltip",{key:"9dda075058b6f069218d928137d591b322c99d60",content:this.navigationCollapsed?this.expandNavigationButtonLabel:this.collapseNavigationButtonLabel,delay:100,position:"right"},t("button",{key:"ee23b4a55a74473c5c5068260f53dfc03e86e26a",class:"shell-layout__header-tool",onClick:this.onNavigationToggleClick,type:"button"},t(this.navigationCollapsed?"swirl-icon-dock-left-expand":"swirl-icon-dock-left-collapse",{size:20}),t("swirl-visually-hidden",{key:"2925638db7cbfef7d7157172bfaab68eb37fa07f"},this.navigationCollapsed?this.expandNavigationButtonLabel:this.collapseNavigationButtonLabel))),t("a",{key:"3257658b39209ed253e13c54f4cd2091e2b8c060",class:"shell-layout__header-tool",onClick:this.historyBackClick.emit,href:"javascript:history.back()"},t("swirl-icon-arrow-back",{key:"5addae8e91fb6e56faa32d3c6ecbc24598a22d06",size:20}),t("swirl-visually-hidden",{key:"bea9a21b7c414e30006bb59d08191c67af8cb2f3"},this.browserBackButtonLabel)),t("a",{key:"681f52ef62a7444317a9d0166c337bbb4956bf13",class:"shell-layout__header-tool",onClick:this.historyForwardClick.emit,href:"javascript:history.forward()"},t("swirl-icon-arrow-forward",{key:"f707719946d4bd51d4cd0a7bd076a6f187a5171c",size:20}),t("swirl-visually-hidden",{key:"8163bfeedfb31a3d2b9b72d2b15189e6091383a8"},this.browserForwardButtonLabel)),t("slot",{key:"ffeaa23afb77cbf3d27e33c703add4bafd54f9bd",name:"left-header-tools"})),t("div",{key:"23204ce79cfe133294f171d1dc21a870c15c734c",class:"shell-layout__logo"},t("slot",{key:"ef9824c10716399cdcefbe268168d9179c29be81",name:"logo"})),t("div",{key:"bae5969da488ad56f010e0426ac4cd0c1c741f73",class:"shell-layout__header-right"},t("slot",{key:"1bf17538296f1f5effa4ef40ad226de3a147abf7",name:"right-header-tools"}),t("slot",{key:"8a9651b05d3b8b8dfc26580b1e585deb4672e36a",name:"avatar"}))),t("div",{key:"d65fe6f6d1f713d4bfaf3ee300a71c71068287ec",class:"shell-layout__mobile-nav-backdrop",onClick:this.onNavigationClick}),t("nav",{key:"0280b9a2d477c54f9dc043f50a688b4b6085d196","aria-labelledby":"main-navigation-label",class:"shell-layout__nav",onClick:this.onNavigationClick,ref:e=>this.navElement=e},t("div",{key:"15ed13a3740b833a4b0f77f160ca30fcbe52c39b",class:"shell-layout__mobile-header"},t("slot",{key:"c9d15e81fcce423f3053a834c3632a478d8a9cad",name:"mobile-logo"}),t("div",{key:"6c8b3ed102f711dfcb92432cb3e54569f94d9108",class:"shell-layout__mobile-header-tools"},t("slot",{key:"5618f200282053b182f4b5f99752d64dde2d8486",name:"mobile-header-tools"}),t("button",{key:"0a12eaa2f39dff63ddad60e074910d347ebc6440",class:"shell-layout__header-tool",type:"button"},t("swirl-icon-double-arrow-left",{key:"c7d56f93db77391d2e9cf1997ccd7be156fdda88",size:20}),t("swirl-visually-hidden",{key:"354ee6d176827243ce7909cefea152b7e3508378"},this.hideMobileNavigationButtonLabel)))),t("div",{key:"b41d20a4685f3bb7f9f3382187c1275860521423",class:"shell-layout__nav-body"},t("swirl-visually-hidden",{key:"54cb0539941169b9ea7418061b7c3901ffd47bd7"},t("span",{key:"06d34b0346ebf09b69a811e9035e52416efe3b63",id:"main-navigation-label"},this.navigationLabel)),t("slot",{key:"6f38e6ef9ba1b040080c31a6b11fd4ba521567ca",name:"nav",onSlotchange:this.collectNavItems}),t("div",{key:"1a5ad0c71c428c54674696ec43e6506bd77ccf61",class:"shell-layout__secondary-nav"},t("swirl-separator",{key:"b87f02d671ae514167388ed4fdbd79271fc06b26",color:"strong",spacing:"16"}),this.enableSecondaryNavGridLayout&&t("swirl-box",{key:"20cb50ba266eb9c49ab5a8a004ea6d67c22eaf5e",paddingBlockEnd:"16"},t("swirl-stack",{key:"26a2349c1725e9ed6830facd78cab0d8d7e122a1",justify:e?"center":"space-between",orientation:"horizontal"},t("swirl-button",{key:"2a657d6ca97bd56fdbb74365614064c0dffddb9c",hideLabel:e,icon:this.secondaryNavCollapsed?"<swirl-icon-expand-more></swirl-icon-expand-more>":"<swirl-icon-expand-less></swirl-icon-expand-less>",label:this.secondaryNavCollapsed?this.secondaryNavExpandLabel:this.secondaryNavCollapseLabel,onClick:this.toggleSecondaryNavCollapse,variant:"plain"}),!e&&!this.secondaryNavCollapsed&&t("swirl-button",{key:"c7e4bc5d84d33f529563e6e48096c7cd4a0000c2",icon:"grid"===this.secondaryNavView?"<swirl-icon-menu></swirl-icon-menu>":"<swirl-icon-hamburger-menu></swirl-icon-hamburger-menu>",iconPosition:"end",label:"grid"===this.secondaryNavView?this.gridNavLayoutToggleLabel:this.listNavLayoutToggleLabel,onClick:this.toggleSecondaryNavView,variant:"plain"}))),t("div",{key:"39b0f25ebba87c949ffe11354d2725d8cbed93c3",class:{["shell-layout__secondary-nav-items--"+this.secondaryNavGridLayoutVariant]:!0,"shell-layout__secondary-nav-items":!0,"shell-layout__secondary-nav-items--grid-view":this.enableSecondaryNavGridLayout&&"grid"===this.secondaryNavView}},t("slot",{key:"9ba25ccb178dab04d09811f17b552df4656220a7",name:"secondary-nav",onSlotchange:this.collectNavItems}))))),t("main",{key:"746a0d369ebcdd293684c032a30dd3d42de31676",class:"shell-layout__main",id:"main-content"},t("slot",{key:"b37e6888ff9e4f32e93540e5932d292f63cee192"}))))}get el(){return this}static get watchers(){return{enableSecondaryNavGridLayout:[{watchEnableSecondaryNavGridLayout:0}],mobileNavigationActive:[{watchMobileNavigationState:0}],navigationCollapsed:[{watchNavigationCollapsed:0}]}}static get style(){return'.sc-swirl-shell-layout-h{--swirl-shell-background:var(--s-surface-sunken-default);--swirl-shell-text-color:var(--s-text-default);--swirl-shell-header-height:3.25rem;--swirl-shell-collapsed-nav-width:4rem;--swirl-shell-extended-nav-width:18rem;display:flex;width:100%;height:100%}.sc-swirl-shell-layout-h *.sc-swirl-shell-layout{box-sizing:border-box}.shell-layout.sc-swirl-shell-layout{display:grid;overflow:hidden;width:100%;min-height:100%;background-color:var(--swirl-shell-background);transition:grid-template-columns 0.1s;grid-template-columns:0 1fr 0;grid-template-rows:1fr;grid-template-areas:"nav main"}@media (prefers-reduced-motion){.shell-layout.sc-swirl-shell-layout{transition:none}}@media (min-width: 992px){.shell-layout.sc-swirl-shell-layout{padding-right:var(--s-space-8);padding-bottom:var(--s-space-8);-moz-column-gap:var(--s-space-8);column-gap:var(--s-space-8);grid-template-columns:var(--swirl-shell-extended-nav-width) 1fr 0;grid-template-rows:var(--swirl-shell-header-height) 1fr;grid-template-areas:"header header header" "nav main sidebar"}}.shell-layout--branded-header.sc-swirl-shell-layout .shell-layout__header.sc-swirl-shell-layout{border-bottom:none;color:var(--s-text-on-action-primary);background-color:var(--s-action-primary-default)}.shell-layout--branded-header.sc-swirl-shell-layout .shell-layout__header.sc-swirl-shell-layout .shell-layout__header-tool.sc-swirl-shell-layout{color:var(--s-text-on-action-primary);background-color:var(--s-action-primary-default)}.shell-layout--branded-header.sc-swirl-shell-layout .shell-layout__header.sc-swirl-shell-layout .shell-layout__header-tool.sc-swirl-shell-layout:hover{background-color:var(--s-action-primary-hovered)}.shell-layout--branded-header.sc-swirl-shell-layout .shell-layout__header.sc-swirl-shell-layout .shell-layout__header-tool.sc-swirl-shell-layout:active{background-color:var(--s-action-primary-pressed)}.shell-layout--branded-header.sc-swirl-shell-layout .shell-layout__header.sc-swirl-shell-layout .shell-layout__header-tool.sc-swirl-shell-layout swirl-badge.sc-swirl-shell-layout{--swirl-badge-border-color:var(--s-action-primary-default)}@media (min-width: 992px){.shell-layout--navigation-collapsed.sc-swirl-shell-layout .shell-layout__nav.sc-swirl-shell-layout{scrollbar-width:none}.shell-layout--navigation-collapsed.sc-swirl-shell-layout .shell-layout__nav.sc-swirl-shell-layout::-webkit-scrollbar{width:0;background:transparent;-webkit-appearance:none}}.shell-layout--navigation-collapsed .shell-layout__secondary-nav-items--grid-view.sc-swirl-shell-layout-s>ul>*,.shell-layout--navigation-collapsed .shell-layout__secondary-nav-items--grid-view .sc-swirl-shell-layout-s>ul>*{max-width:100%;max-height:3rem;flex-basis:100%}@media (min-width: 992px){.shell-layout--navigation-collapsed.sc-swirl-shell-layout{grid-template-columns:var(--swirl-shell-collapsed-nav-width) 1fr 0}}.shell-layout--mobile-navigation-active.sc-swirl-shell-layout .shell-layout__nav.sc-swirl-shell-layout{transform:translate3d(0, 0, 0);box-shadow:var(--s-shadow-level-3)}@media (min-width: 992px){.shell-layout--mobile-navigation-active.sc-swirl-shell-layout .shell-layout__nav.sc-swirl-shell-layout{transform:none;box-shadow:none}}.shell-layout--mobile-navigation-active.sc-swirl-shell-layout .shell-layout__mobile-nav-backdrop.sc-swirl-shell-layout{display:block}@media (min-width: 992px){.shell-layout--mobile-navigation-active.sc-swirl-shell-layout .shell-layout__mobile-nav-backdrop.sc-swirl-shell-layout{display:none}}.shell-layout--has-secondary-nav.sc-swirl-shell-layout .shell-layout__secondary-nav.sc-swirl-shell-layout{display:block}.shell-layout--secondary-nav-collapsed.sc-swirl-shell-layout .shell-layout__secondary-nav-items.sc-swirl-shell-layout{display:none}.shell-layout__header.sc-swirl-shell-layout{position:relative;display:none;width:calc(100% + var(--s-space-8));padding-top:var(--s-space-8);padding-right:var(--s-space-16);padding-bottom:var(--s-space-8);padding-left:var(--s-space-16);justify-content:space-between;align-items:center;color:var(--swirl-shell-text-color);grid-area:header}@media (min-width: 992px){.shell-layout__header.sc-swirl-shell-layout{display:flex}}.shell-layout__skip-link.sc-swirl-shell-layout{position:absolute;z-index:9;top:0;left:0;padding:var(--s-space-4);border:none;color:var(--swirl-shell-text-color);background-color:var(--swirl-shell-background);font:inherit;cursor:pointer}.shell-layout__skip-link.sc-swirl-shell-layout:not(:focus):not(:active){position:absolute;overflow:hidden;width:1px;height:1px;white-space:nowrap;clip:rect(0 0 0 0);clip-path:inset(50%)}.shell-layout__header-left.sc-swirl-shell-layout{display:flex;padding-left:var(--s-space-2);flex-basis:8rem;flex-shrink:0;align-items:center;gap:var(--s-space-8)}.shell-layout__header-right.sc-swirl-shell-layout{display:flex;flex-basis:8rem;flex-shrink:0;justify-content:flex-end;align-items:center;gap:var(--s-space-8)}.shell-layout__logo.sc-swirl-shell-layout{display:flex;flex-grow:1;justify-content:center;align-items:center}.shell-layout__logo.sc-swirl-shell-layout-s>a{display:flex}.shell-layout__logo.sc-swirl-shell-layout-s>a img,.shell-layout__logo.sc-swirl-shell-layout-s>img{max-height:1.75rem}.shell-layout__header-tool.sc-swirl-shell-layout{position:relative;width:2.25rem;height:2.25rem;padding:var(--s-space-8);flex-shrink:0;border:none;border-radius:var(--s-border-radius-sm);color:var(--swirl-shell-text-color);background-color:var(--s-surface-sunken-default);font:inherit;cursor:pointer}.shell-layout__header-tool.sc-swirl-shell-layout:hover{background-color:var(--s-state-hovered)}.shell-layout__header-tool.sc-swirl-shell-layout:active{background-color:var(--s-state-pressed)}.shell-layout__header-tool.sc-swirl-shell-layout:focus{outline:none}.shell-layout__header-tool.sc-swirl-shell-layout:focus-visible{box-shadow:0 0 0 0.125rem var(--s-focus-default)}.shell-layout__header-tool.sc-swirl-shell-layout swirl-badge.sc-swirl-shell-layout{--swirl-badge-border-color:var(--s-surface-sunken-default);position:absolute;top:var(--s-space-2);right:var(--s-space-2);padding-right:var(--s-space-2);transform:translate3d(0.1875rem, 0, 0)}.shell-layout__nav.sc-swirl-shell-layout{position:fixed;z-index:9;top:0;bottom:0;left:0;overflow-x:hidden;overflow-y:auto;width:100%;max-width:18.75rem;color:var(--swirl-shell-text-color);background-color:var(--s-surface-overlay-default);transition:transform 0.1s, box-shadow 0.1s, width 0.1s;transform:translate3d(-100%, 0, 0);grid-area:nav}@media (prefers-reduced-motion){.shell-layout__nav.sc-swirl-shell-layout{transition:none}}@media (min-width: 992px){.shell-layout__nav.sc-swirl-shell-layout{position:relative;max-width:none;padding-top:0;padding-right:var(--s-space-4);padding-bottom:var(--s-space-8);padding-left:var(--s-space-12);background-color:var(--swirl-shell-background);transform:none;box-shadow:none;inset:auto}}.shell-layout__mobile-header.sc-swirl-shell-layout{display:flex;min-height:3.5rem;margin-bottom:var(--s-space-8);padding-top:var(--s-space-8);padding-right:var(--s-space-16);padding-bottom:var(--s-space-8);padding-left:var(--s-space-16);justify-content:space-between;align-items:center;border-bottom:0.0625rem solid var(--s-border-default)}.shell-layout__mobile-header.sc-swirl-shell-layout-s>img{max-height:1.75rem}.shell-layout__mobile-header.sc-swirl-shell-layout .shell-layout__header-tool.sc-swirl-shell-layout{background-color:var(--s-surface-overlay-default)}.shell-layout__mobile-header.sc-swirl-shell-layout .shell-layout__header-tool.sc-swirl-shell-layout:hover{background-color:var(--s-state-hovered)}.shell-layout__mobile-header.sc-swirl-shell-layout .shell-layout__header-tool.sc-swirl-shell-layout:active{background-color:var(--s-state-pressed)}@media (min-width: 992px){.shell-layout__mobile-header.sc-swirl-shell-layout{display:none}}.shell-layout__mobile-header-tools.sc-swirl-shell-layout{display:flex;justify-content:flex-end;align-items:center;gap:var(--s-space-8)}.shell-layout__nav-body.sc-swirl-shell-layout{padding:var(--s-space-8)}.shell-layout__nav-body.sc-swirl-shell-layout-s ul{margin:0;padding:0;list-style:none}.shell-layout__nav-body.sc-swirl-shell-layout-s li{display:flex}@media (min-width: 992px){.shell-layout__nav-body.sc-swirl-shell-layout{padding:0}}.shell-layout__mobile-nav-backdrop.sc-swirl-shell-layout{position:fixed;z-index:8;display:none;background-color:rgba(0, 0, 0, 0.25);animation:shell-layout-backdrop-fade-in 0.1s;inset:0}.shell-layout__secondary-nav.sc-swirl-shell-layout{display:none}.shell-layout__secondary-nav-items.sc-swirl-shell-layout-s>ul,.shell-layout__secondary-nav-items .sc-swirl-shell-layout-s>ul{display:flex;flex-direction:column;gap:var(--s-space-2)}.shell-layout:not(.shell-layout--navigation-collapsed) .shell-layout__secondary-nav-items--grid-view.sc-swirl-shell-layout-s>ul,.shell-layout:not(.shell-layout--navigation-collapsed) .shell-layout__secondary-nav-items--grid-view .sc-swirl-shell-layout-s>ul{flex-wrap:wrap;flex-direction:row;gap:var(--s-space-16)}.shell-layout:not(.shell-layout--navigation-collapsed) .shell-layout__secondary-nav-items--grid-view.sc-swirl-shell-layout-s>ul>*,.shell-layout:not(.shell-layout--navigation-collapsed) .shell-layout__secondary-nav-items--grid-view .sc-swirl-shell-layout-s>ul>*{min-width:0;max-height:none}.shell-layout:not(.shell-layout--navigation-collapsed) .shell-layout__secondary-nav-items--grid-view.shell-layout__secondary-nav-items--app-icon.sc-swirl-shell-layout-s>ul,.shell-layout:not(.shell-layout--navigation-collapsed) .shell-layout__secondary-nav-items--grid-view.shell-layout__secondary-nav-items--app-icon .sc-swirl-shell-layout-s>ul{row-gap:var(--s-space-16);-moz-column-gap:0;column-gap:0}.shell-layout--navigation-collapsed .shell-layout__secondary-nav-items--tiled.sc-swirl-shell-layout-s>ul,.shell-layout--navigation-collapsed .shell-layout__secondary-nav-items--tiled .sc-swirl-shell-layout-s>ul{gap:var(--s-space-16)}.shell-layout__secondary-nav-items--tiled.sc-swirl-shell-layout-s>ul>*,.shell-layout__secondary-nav-items--tiled .sc-swirl-shell-layout-s>ul>*{flex-basis:calc(50% - var(--s-space-8))}.shell-layout__secondary-nav-items--app-icon.sc-swirl-shell-layout-s>ul>*,.shell-layout__secondary-nav-items--app-icon .sc-swirl-shell-layout-s>ul>*{flex-basis:calc(100% / 3)}.shell-layout__main.sc-swirl-shell-layout{overflow:hidden;background-color:var(--s-background-default);grid-area:main}@media (min-width: 992px){.shell-layout__main.sc-swirl-shell-layout{width:calc(100% + var(--s-space-8));border:0.0625rem solid var(--s-border-default);border-radius:var(--s-border-radius-sm)}}@keyframes shell-layout-backdrop-fade-in{from{opacity:0}to{opacity:1}}@keyframes shell-layout-no-overflow-after-transition{0%{overflow:initial}99%{overflow:initial}100%{overflow:hidden}}'}},[262,"swirl-shell-layout",{brandedHeader:[4,"branded-header"],browserBackButtonLabel:[1,"browser-back-button-label"],browserForwardButtonLabel:[1,"browser-forward-button-label"],collapseNavigationButtonLabel:[1,"collapse-navigation-button-label"],enableSecondaryNavGridLayout:[4,"enable-secondary-nav-grid-layout"],secondaryNavGridLayoutVariant:[1,"secondary-nav-grid-layout-variant"],expandNavigationButtonLabel:[1,"expand-navigation-button-label"],gridNavLayoutToggleLabel:[1,"grid-nav-layout-toggle-label"],hideMobileNavigationButtonLabel:[1,"hide-mobile-navigation-button-label"],listNavLayoutToggleLabel:[1,"list-nav-layout-toggle-label"],navigationLabel:[1,"navigation-label"],secondaryNavCollapseLabel:[1,"secondary-nav-collapse-label"],secondaryNavExpandLabel:[1,"secondary-nav-expand-label"],skipLinkLabel:[1,"skip-link-label"],isDesktopViewport:[32],mobileNavigationActive:[32],navigationCollapsed:[32],secondaryNavCollapsed:[32],secondaryNavView:[32],showMobileNavigation:[64],hideMobileNavigation:[64]},[[8,"keydown","onWindowKeyDown"],[9,"resize","onWindowResize"]],{enableSecondaryNavGridLayout:[{watchEnableSecondaryNavGridLayout:0}],mobileNavigationActive:[{watchMobileNavigationState:0}],navigationCollapsed:[{watchNavigationCollapsed:0}]}]),le=ee,ae=function(){"undefined"!=typeof customElements&&["swirl-shell-layout","swirl-box","swirl-button","swirl-icon-arrow-back","swirl-icon-arrow-forward","swirl-icon-dock-left-collapse","swirl-icon-dock-left-expand","swirl-icon-double-arrow-left","swirl-separator","swirl-stack","swirl-tooltip","swirl-visually-hidden"].forEach((e=>{switch(e){case"swirl-shell-layout":customElements.get(s(e))||customElements.define(s(e),ee);break;case"swirl-box":customElements.get(s(e))||n();break;case"swirl-button":customElements.get(s(e))||c();break;case"swirl-icon-arrow-back":customElements.get(s(e))||d();break;case"swirl-icon-arrow-forward":customElements.get(s(e))||u();break;case"swirl-icon-dock-left-collapse":customElements.get(s(e))||h();break;case"swirl-icon-dock-left-expand":customElements.get(s(e))||f();break;case"swirl-icon-double-arrow-left":customElements.get(s(e))||y();break;case"swirl-separator":customElements.get(s(e))||v();break;case"swirl-stack":customElements.get(s(e))||b();break;case"swirl-tooltip":customElements.get(s(e))||w();break;case"swirl-visually-hidden":customElements.get(s(e))||p()}}))};export{le as SwirlShellLayout,ae as defineCustomElement}
|
|
11
|
+
function B(e,l){var a=Object.keys(e);if(Object.getOwnPropertySymbols){var t=Object.getOwnPropertySymbols(e);l&&(t=t.filter((function(l){return Object.getOwnPropertyDescriptor(e,l).enumerable}))),a.push.apply(a,t)}return a}function G(e){for(var l=1;l<arguments.length;l++){var a=null!=arguments[l]?arguments[l]:{};l%2?B(Object(a),!0).forEach((function(l){M(e,l,a[l])})):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(a)):B(Object(a)).forEach((function(l){Object.defineProperty(e,l,Object.getOwnPropertyDescriptor(a,l))}))}return e}function M(e,l,a){return(l=function(e){var l=function(e,l){if("object"!=typeof e||null===e)return e;var a=e[Symbol.toPrimitive];if(void 0!==a){var t=a.call(e,l);if("object"!=typeof t)return t;throw new TypeError("@@toPrimitive must return a primitive value.")}return e+""}(e,"string");return"symbol"==typeof l?l:l+""}(l))in e?Object.defineProperty(e,l,{value:a,enumerable:!0,configurable:!0,writable:!0}):e[l]=a,e}var W=function(e){return"Tab"===(null==e?void 0:e.key)||9===(null==e?void 0:e.keyCode)},V=function(e){return W(e)&&!e.shiftKey},U=function(e){return W(e)&&e.shiftKey},Y=function(e){return setTimeout(e,0)},H=function(e,l){var a=-1;return e.every((function(e,t){return!l(e)||(a=t,!1)})),a},K=function(e){for(var l=arguments.length,a=Array(l>1?l-1:0),t=1;t<l;t++)a[t-1]=arguments[t];return"function"==typeof e?e.apply(void 0,a):e},$=function(e){return e.target.shadowRoot&&"function"==typeof e.composedPath?e.composedPath()[0]:e.target},X=[],q=function(e,l){var a,t=(null==l?void 0:l.document)||document,o=(null==l?void 0:l.trapStack)||X,s=G({returnFocusOnDeactivate:!0,escapeDeactivates:!0,delayInitialFocus:!0,isKeyForward:V,isKeyBackward:U},l),i={containers:[],containerGroups:[],tabbableGroups:[],nodeFocusedBeforeActivation:null,mostRecentlyFocusedNode:null,active:!1,paused:!1,delayInitialFocusTimer:void 0,recentNavEvent:void 0},r=function(e,l,a){return e&&void 0!==e[l]?e[l]:s[a||l]},n=function(e,l){var a="function"==typeof(null==l?void 0:l.composedPath)?l.composedPath():void 0;return i.containerGroups.findIndex((function(l){var t=l.container,o=l.tabbableNodes;return t.contains(e)||(null==a?void 0:a.includes(t))||o.find((function(l){return l===e}))}))},c=function(e){var l=s[e];if("function"==typeof l){for(var a=arguments.length,o=Array(a>1?a-1:0),i=1;i<a;i++)o[i-1]=arguments[i];l=l.apply(void 0,o)}if(!0===l&&(l=void 0),!l){if(void 0===l||!1===l)return l;throw Error("`".concat(e,"` was specified but was not a node, or did not return a node"))}var r=l;if("string"==typeof l&&!(r=t.querySelector(l)))throw Error("`".concat(e,"` as selector refers to no known node"));return r},d=function(){var e=c("initialFocus");if(!1===e)return!1;if(void 0===e||!z(e,s.tabbableOptions))if(n(t.activeElement)>=0)e=t.activeElement;else{var l=i.tabbableGroups[0];e=l&&l.firstTabbableNode||c("fallbackFocus")}if(!e)throw Error("Your focus-trap needs to have at least one focusable element");return e},u=function(){if(i.containerGroups=i.containers.map((function(e){var l=function(e,l){var a;return a=(l=l||{}).getShadowRoot?S([e],l.includeContainer,{filter:I.bind(null,l),flatten:!1,getShadowRoot:l.getShadowRoot,shadowRootFilter:D}):E(e,l.includeContainer,I.bind(null,l)),F(a)}(e,s.tabbableOptions),a=function(e,l){return(l=l||{}).getShadowRoot?S([e],l.includeContainer,{filter:O.bind(null,l),flatten:!0,getShadowRoot:l.getShadowRoot}):E(e,l.includeContainer,O.bind(null,l))}(e,s.tabbableOptions),t=l.length>0?l[0]:void 0,o=l.length>0?l[l.length-1]:void 0,i=a.find((function(e){return R(e)})),r=a.slice().reverse().find((function(e){return R(e)})),n=!!l.find((function(e){return T(e)>0}));return{container:e,tabbableNodes:l,focusableNodes:a,posTabIndexesFound:n,firstTabbableNode:t,lastTabbableNode:o,firstDomTabbableNode:i,lastDomTabbableNode:r,nextTabbableNode:function(e){var t=!(arguments.length>1&&void 0!==arguments[1])||arguments[1],o=l.indexOf(e);return o<0?t?a.slice(a.indexOf(e)+1).find((function(e){return R(e)})):a.slice(0,a.indexOf(e)).reverse().find((function(e){return R(e)})):l[o+(t?1:-1)]}}})),i.tabbableGroups=i.containerGroups.filter((function(e){return e.tabbableNodes.length>0})),i.tabbableGroups.length<=0&&!c("fallbackFocus"))throw Error("Your focus-trap must have at least one container with at least one tabbable node in it at all times");if(i.containerGroups.find((function(e){return e.posTabIndexesFound}))&&i.containerGroups.length>1)throw Error("At least one node with a positive tabindex was found in one of your focus-trap's multiple containers. Positive tabindexes are only supported in single-container focus-traps.")},h=function e(l){var a=l.activeElement;if(a)return a.shadowRoot&&null!==a.shadowRoot.activeElement?e(a.shadowRoot):a},f=function e(l){!1!==l&&l!==h(document)&&(l&&l.focus?(l.focus({preventScroll:!!s.preventScroll}),i.mostRecentlyFocusedNode=l,function(e){return e.tagName&&"input"===e.tagName.toLowerCase()&&"function"==typeof e.select}(l)&&l.select()):e(d()))},y=function(e){var l=c("setReturnFocus",e);return l||!1!==l&&e},v=function(e){var l=e.target,a=e.event,t=e.isBackward,o=void 0!==t&&t;l=l||$(a),u();var r=null;if(i.tabbableGroups.length>0){var d=n(l,a),h=d>=0?i.containerGroups[d]:void 0;if(d<0)r=o?i.tabbableGroups[i.tabbableGroups.length-1].lastTabbableNode:i.tabbableGroups[0].firstTabbableNode;else if(o){var f=H(i.tabbableGroups,(function(e){return l===e.firstTabbableNode}));if(f<0&&(h.container===l||z(l,s.tabbableOptions)&&!R(l,s.tabbableOptions)&&!h.nextTabbableNode(l,!1))&&(f=d),f>=0){var y=i.tabbableGroups[0===f?i.tabbableGroups.length-1:f-1];r=T(l)>=0?y.lastTabbableNode:y.lastDomTabbableNode}else W(a)||(r=h.nextTabbableNode(l,!1))}else{var v=H(i.tabbableGroups,(function(e){return l===e.lastTabbableNode}));if(v<0&&(h.container===l||z(l,s.tabbableOptions)&&!R(l,s.tabbableOptions)&&!h.nextTabbableNode(l))&&(v=d),v>=0){var b=i.tabbableGroups[v===i.tabbableGroups.length-1?0:v+1];r=T(l)>=0?b.firstTabbableNode:b.firstDomTabbableNode}else W(a)||(r=h.nextTabbableNode(l))}}else r=c("fallbackFocus");return r},b=function(e){var l=$(e);n(l,e)>=0||(K(s.clickOutsideDeactivates,e)?a.deactivate({returnFocus:s.returnFocusOnDeactivate}):K(s.allowOutsideClick,e)||e.preventDefault())},w=function(e){var l=$(e),a=n(l,e)>=0;if(a||l instanceof Document)a&&(i.mostRecentlyFocusedNode=l);else{var t;e.stopImmediatePropagation();var o=!0;if(i.mostRecentlyFocusedNode)if(T(i.mostRecentlyFocusedNode)>0){var r=n(i.mostRecentlyFocusedNode),c=i.containerGroups[r].tabbableNodes;if(c.length>0){var u=c.findIndex((function(e){return e===i.mostRecentlyFocusedNode}));u>=0&&(s.isKeyForward(i.recentNavEvent)?u+1<c.length&&(t=c[u+1],o=!1):u-1>=0&&(t=c[u-1],o=!1))}}else i.containerGroups.some((function(e){return e.tabbableNodes.some((function(e){return T(e)>0}))}))||(o=!1);else o=!1;o&&(t=v({target:i.mostRecentlyFocusedNode,isBackward:s.isKeyBackward(i.recentNavEvent)})),f(t||i.mostRecentlyFocusedNode||d())}i.recentNavEvent=void 0},p=function(e){if(function(e){return"Escape"===(null==e?void 0:e.key)||"Esc"===(null==e?void 0:e.key)||27===(null==e?void 0:e.keyCode)}(e)&&!1!==K(s.escapeDeactivates,e))return e.preventDefault(),void a.deactivate();(s.isKeyForward(e)||s.isKeyBackward(e))&&function(e){var l=arguments.length>1&&void 0!==arguments[1]&&arguments[1];i.recentNavEvent=e;var a=v({event:e,isBackward:l});a&&(W(e)&&e.preventDefault(),f(a))}(e,s.isKeyBackward(e))},m=function(e){var l=$(e);n(l,e)>=0||K(s.clickOutsideDeactivates,e)||K(s.allowOutsideClick,e)||(e.preventDefault(),e.stopImmediatePropagation())},g=function(){if(i.active)return function(e,l){if(e.length>0){var a=e[e.length-1];a!==l&&a.pause()}var t=e.indexOf(l);-1===t||e.splice(t,1),e.push(l)}(o,a),i.delayInitialFocusTimer=s.delayInitialFocus?Y((function(){f(d())})):f(d()),t.addEventListener("focusin",w,!0),t.addEventListener("mousedown",b,{capture:!0,passive:!1}),t.addEventListener("touchstart",b,{capture:!0,passive:!1}),t.addEventListener("click",m,{capture:!0,passive:!1}),t.addEventListener("keydown",p,{capture:!0,passive:!1}),a},_=function(){if(i.active)return t.removeEventListener("focusin",w,!0),t.removeEventListener("mousedown",b,!0),t.removeEventListener("touchstart",b,!0),t.removeEventListener("click",m,!0),t.removeEventListener("keydown",p,!0),a},k="undefined"!=typeof window&&"MutationObserver"in window?new MutationObserver((function(e){e.some((function(e){return Array.from(e.removedNodes).some((function(e){return e===i.mostRecentlyFocusedNode}))}))&&f(d())})):void 0,x=function(){k&&(k.disconnect(),i.active&&!i.paused&&i.containers.map((function(e){k.observe(e,{subtree:!0,childList:!0})})))};return(a={get active(){return i.active},get paused(){return i.paused},activate:function(e){if(i.active)return this;var l=r(e,"onActivate"),a=r(e,"onPostActivate"),o=r(e,"checkCanFocusTrap");o||u(),i.active=!0,i.paused=!1,i.nodeFocusedBeforeActivation=t.activeElement,null==l||l();var s=function(){o&&u(),g(),x(),null==a||a()};return o?(o(i.containers.concat()).then(s,s),this):(s(),this)},deactivate:function(e){if(!i.active)return this;var l=G({onDeactivate:s.onDeactivate,onPostDeactivate:s.onPostDeactivate,checkCanReturnFocus:s.checkCanReturnFocus},e);clearTimeout(i.delayInitialFocusTimer),i.delayInitialFocusTimer=void 0,_(),i.active=!1,i.paused=!1,x(),function(e,l){var a=e.indexOf(l);-1!==a&&e.splice(a,1),e.length>0&&e[e.length-1].unpause()}(o,a);var t=r(l,"onDeactivate"),n=r(l,"onPostDeactivate"),c=r(l,"checkCanReturnFocus"),d=r(l,"returnFocus","returnFocusOnDeactivate");null==t||t();var u=function(){Y((function(){d&&f(y(i.nodeFocusedBeforeActivation)),null==n||n()}))};return d&&c?(c(y(i.nodeFocusedBeforeActivation)).then(u,u),this):(u(),this)},pause:function(e){if(i.paused||!i.active)return this;var l=r(e,"onPause"),a=r(e,"onPostPause");return i.paused=!0,null==l||l(),_(),x(),null==a||a(),this},unpause:function(e){if(!i.paused||!i.active)return this;var l=r(e,"onUnpause"),a=r(e,"onPostUnpause");return i.paused=!1,null==l||l(),u(),g(),x(),null==a||a(),this},updateContainerElements:function(e){var l=[].concat(e).filter(Boolean);return i.containers=l.map((function(e){return"string"==typeof e?t.querySelector(e):e})),i.active&&u(),x(),this}}).updateContainerElements(e),a};const J="SWIRL_SHELL_SECONDARY_NAVIGATION_COLLAPSE_STATE",Q="SWIRL_SHELL_SECONDARY_NAVIGATION_VIEW_STATE",Z="SWIRL_SHELL_NAVIGATION_COLLAPSE_STATE",ee=e(class extends l{constructor(e){super(),!1!==e&&this.__registerHost(),this.historyBackClick=a(this,"historyBackClick",7),this.historyForwardClick=a(this,"historyForwardClick",7),this.skipLinkClick=a(this,"skipLinkClick",7),this.browserBackButtonLabel="Navigate back",this.browserForwardButtonLabel="Navigate forward",this.collapseNavigationButtonLabel="Collapse navigation",this.enableSecondaryNavGridLayout=!0,this.secondaryNavGridLayoutVariant="tiled",this.expandNavigationButtonLabel="Expand navigation",this.gridNavLayoutToggleLabel="Grid",this.hideMobileNavigationButtonLabel="Close navigation",this.listNavLayoutToggleLabel="List",this.navigationLabel="Main",this.secondaryNavCollapseLabel="Show less",this.secondaryNavExpandLabel="Show more",this.skipLinkLabel="Skip to main content",this.isDesktopViewport=!0,this.secondaryNavView="list",this.collectNavItems=()=>{this.mainNavItems=Array.from(this.el.querySelectorAll("swirl-shell-navigation-item[slot='nav'], [slot='nav'] swirl-shell-navigation-item")),this.secondaryNavItems=Array.from(this.el.querySelectorAll("swirl-shell-navigation-item[slot='secondary-nav'], [slot='secondary-nav'] swirl-shell-navigation-item")),this.toggleNavItemLabels(),this.setSecondaryNavItemsTiled()},this.toggleSecondaryNavView=e=>{e.stopPropagation(),this.secondaryNavView="grid"===this.secondaryNavView?"list":"grid",this.setSecondaryNavItemsTiled(),localStorage.setItem(Q,this.secondaryNavView+"")},this.toggleSecondaryNavCollapse=e=>{e.stopPropagation(),this.secondaryNavCollapsed=!this.secondaryNavCollapsed,localStorage.setItem(J,this.secondaryNavCollapsed+"")},this.onNavigationToggleClick=()=>{this.navigationCollapsed=!this.navigationCollapsed},this.onNavigationClick=()=>{this.hideMobileNavigation()}}componentWillLoad(){console.warn('[Swirl] The "swirl-shell-layout" component is deprecated and will be removed in the next major release.'),this.isDesktopViewport=r(),this.collectNavItems();const e="true"===localStorage.getItem(Z);this.navigationCollapsed=e,this.restoreSecondaryNavState()}componentDidLoad(){this.focusTrap=q(this.navElement,{allowOutsideClick:!0,tabbableOptions:{getShadowRoot:e=>e.shadowRoot}}),this.collectNavItems(),this.navMutationObserver=new MutationObserver((()=>{this.collectNavItems()})),this.navMutationObserver.observe(this.navElement,{childList:!0,subtree:!0})}componentDidRender(){this.focusTrap?.updateContainerElements(this.navElement)}disconnectedCallback(){this.focusTrap?.deactivate(),this.navMutationObserver?.disconnect()}onWindowKeyDown(e){"Escape"===e.key&&this.mobileNavigationActive&&this.hideMobileNavigation()}watchEnableSecondaryNavGridLayout(){this.restoreSecondaryNavState()}watchMobileNavigationState(){this.mobileNavigationActive?setTimeout((()=>{this.focusTrap.activate()}),200):this.focusTrap.deactivate()}watchNavigationCollapsed(){localStorage.setItem(Z,this.navigationCollapsed+""),this.toggleNavItemLabels(),this.setSecondaryNavItemsTiled()}onWindowResize(){this.isDesktopViewport!==r()&&(this.isDesktopViewport=r(),this.collectNavItems())}async showMobileNavigation(){this.mobileNavigationActive=!0,this.collectNavItems()}async hideMobileNavigation(){this.mobileNavigationActive=!1,this.toggleNavItemLabels()}toggleNavItemLabels(){[...this.secondaryNavItems,...this.mainNavItems].forEach((e=>{e.hideLabel=this.navigationCollapsed&&this.isDesktopViewport}))}setSecondaryNavItemsTiled(){this.secondaryNavItems.forEach((e=>{e.variant=this.enableSecondaryNavGridLayout&&("grid"===this.secondaryNavView||this.navigationCollapsed&&this.isDesktopViewport)?this.secondaryNavGridLayoutVariant:"default"}))}restoreSecondaryNavState(){if(this.enableSecondaryNavGridLayout){const e="true"===localStorage.getItem(J);this.secondaryNavCollapsed=e;const l=localStorage.getItem(Q);this.secondaryNavView=l}}render(){const e=this.navigationCollapsed&&this.isDesktopViewport,l=!!this.el.querySelector("[slot='secondary-nav']"),a=i("shell-layout",{"shell-layout--branded-header":this.brandedHeader,"shell-layout--secondary-nav-collapsed":this.secondaryNavCollapsed,"shell-layout--has-secondary-nav":l,"shell-layout--mobile-navigation-active":this.mobileNavigationActive,"shell-layout--navigation-collapsed":e});return t(o,{key:"5f5458f6460183f2d6a2ce7bdc95ff5d160c0b6a"},t("div",{key:"92d0471c277bf968adc8a8f4e9afc578288b53f2",class:a},t("header",{key:"dc249ffe59a95fbf9b90a79b2ac0e1d3aaf29b40",class:"shell-layout__header","data-tauri-drag-region":"true"},t("button",{key:"f667bd28c24008ee31d66ae3920038099130fff1",class:"shell-layout__skip-link",onClick:this.skipLinkClick.emit,type:"button"},this.skipLinkLabel),t("div",{key:"b2f378e9d99b1e363da281962521163473553b82",class:"shell-layout__header-left"},t("swirl-tooltip",{key:"dc2b3b695738a372f03c79c0731466b085f2ebd8",content:this.navigationCollapsed?this.expandNavigationButtonLabel:this.collapseNavigationButtonLabel,delay:100,position:"right"},t("button",{key:"a02c4615e817b81522ccd440d222ff5b840775c1",class:"shell-layout__header-tool",onClick:this.onNavigationToggleClick,type:"button"},t(this.navigationCollapsed?"swirl-icon-dock-left-expand":"swirl-icon-dock-left-collapse",{size:20}),t("swirl-visually-hidden",{key:"d9b356e34b82b0acaa2c106350f249b4a2565c90"},this.navigationCollapsed?this.expandNavigationButtonLabel:this.collapseNavigationButtonLabel))),t("a",{key:"6986f46235298e58f35bd5ad31684eb2cfabe86d",class:"shell-layout__header-tool",onClick:this.historyBackClick.emit,href:"javascript:history.back()"},t("swirl-icon-arrow-back",{key:"f68f92c0821fd6b54b8341745cf558b334edd6f0",size:20}),t("swirl-visually-hidden",{key:"22801f633563ba275ebe088d2a4c341dda758544"},this.browserBackButtonLabel)),t("a",{key:"02e4c396ccb4b076b9e1d5dd565bf3e5178cc7b5",class:"shell-layout__header-tool",onClick:this.historyForwardClick.emit,href:"javascript:history.forward()"},t("swirl-icon-arrow-forward",{key:"e1a884ed5b576ce45c36cd55be3f8301a9c25ab6",size:20}),t("swirl-visually-hidden",{key:"43e83f5f482f28003a57c25c27d337c62cd8ee64"},this.browserForwardButtonLabel)),t("slot",{key:"6aa5a13fcdd924ccce93ed986dfa9cf44ca15441",name:"left-header-tools"})),t("div",{key:"7c98d9434eb3e5398aee3c9890fd3ebd9a97ec6d",class:"shell-layout__logo"},t("slot",{key:"381b69009d83758713dcbaaef7ddbaf7408f5c3f",name:"logo"})),t("div",{key:"957cf5301164474a28ab07ad4b034ed364404a73",class:"shell-layout__header-right"},t("slot",{key:"2db7f15807045fd66d9181aa0a382674d9d35ff5",name:"right-header-tools"}),t("slot",{key:"b472d77a4420c68f93999ceeacf4bf7176c1072c",name:"avatar"}))),t("div",{key:"81e27f03e1c6d76fdd2754a0c8b33b2aa1126bc8",class:"shell-layout__mobile-nav-backdrop",onClick:this.onNavigationClick}),t("nav",{key:"308d981df11d92d1cfbe1bd1b421348a7fd0f81a","aria-labelledby":"main-navigation-label",class:"shell-layout__nav",onClick:this.onNavigationClick,ref:e=>this.navElement=e},t("div",{key:"facc60dce3cc42bf9ad138f096d00235694f01bc",class:"shell-layout__mobile-header"},t("slot",{key:"6843ea436a024963dc0f58cd42fe23dee5cbca9e",name:"mobile-logo"}),t("div",{key:"85749821ec1fd9092b646d8f643886aca9f8f393",class:"shell-layout__mobile-header-tools"},t("slot",{key:"5a30b7dfd62669531443761544477b4baeaf4a84",name:"mobile-header-tools"}),t("button",{key:"5340f5a188c5bcb98c63efa9ef3cda7b62e6b997",class:"shell-layout__header-tool",type:"button"},t("swirl-icon-double-arrow-left",{key:"40db2029f3a81e828db27e890b52ce0d2805173c",size:20}),t("swirl-visually-hidden",{key:"a25e358e0afc4027a0d52cbc1cf62df6a0719cc4"},this.hideMobileNavigationButtonLabel)))),t("div",{key:"a8b8a017a40a43f89c50f60c96bbbeb4d6181b3d",class:"shell-layout__nav-body"},t("swirl-visually-hidden",{key:"1200560f555a2e11e7bed30697283ba660e8ea52"},t("span",{key:"a2a5c11b456c91b1fe4d006c05803829a633e3d5",id:"main-navigation-label"},this.navigationLabel)),t("slot",{key:"55c3ec6a88c7e8986a7c94f4e751a4a899ffb457",name:"nav",onSlotchange:this.collectNavItems}),t("div",{key:"938ce0319668ed1aaee57cf435c5f8c8531d2114",class:"shell-layout__secondary-nav"},t("swirl-separator",{key:"8da10296cd7d1857e7b62b89da62984814111022",color:"strong",spacing:"16"}),this.enableSecondaryNavGridLayout&&t("swirl-box",{key:"bfec55992924ce4f0bab5ba5b99e7830a925d447",paddingBlockEnd:"16"},t("swirl-stack",{key:"e06da8582e4e41ccb8c210292f466233777a97f4",justify:e?"center":"space-between",orientation:"horizontal"},t("swirl-button",{key:"1960f4768f22a6d6c8b7ef1aabcaa7b77e01a8be",hideLabel:e,icon:this.secondaryNavCollapsed?"<swirl-icon-expand-more></swirl-icon-expand-more>":"<swirl-icon-expand-less></swirl-icon-expand-less>",label:this.secondaryNavCollapsed?this.secondaryNavExpandLabel:this.secondaryNavCollapseLabel,onClick:this.toggleSecondaryNavCollapse,variant:"plain"}),!e&&!this.secondaryNavCollapsed&&t("swirl-button",{key:"2fd6f3c41e1752103a32d59f152fad121e0a7ce1",icon:"grid"===this.secondaryNavView?"<swirl-icon-menu></swirl-icon-menu>":"<swirl-icon-hamburger-menu></swirl-icon-hamburger-menu>",iconPosition:"end",label:"grid"===this.secondaryNavView?this.gridNavLayoutToggleLabel:this.listNavLayoutToggleLabel,onClick:this.toggleSecondaryNavView,variant:"plain"}))),t("div",{key:"542d6a0dbcb290a175d9d9d4e9eb0f8ec2462687",class:{["shell-layout__secondary-nav-items--"+this.secondaryNavGridLayoutVariant]:!0,"shell-layout__secondary-nav-items":!0,"shell-layout__secondary-nav-items--grid-view":this.enableSecondaryNavGridLayout&&"grid"===this.secondaryNavView}},t("slot",{key:"55a2836a2dbb4b11e2dd49063e45db21941d1490",name:"secondary-nav",onSlotchange:this.collectNavItems}))))),t("main",{key:"afa4d7ab3cadc90ddd89b11dbc84bb28acac4c41",class:"shell-layout__main",id:"main-content"},t("slot",{key:"6beead6ae681df7cf8cff9734c5529668c975962"}))))}get el(){return this}static get watchers(){return{enableSecondaryNavGridLayout:[{watchEnableSecondaryNavGridLayout:0}],mobileNavigationActive:[{watchMobileNavigationState:0}],navigationCollapsed:[{watchNavigationCollapsed:0}]}}static get style(){return'.sc-swirl-shell-layout-h{--swirl-shell-background:var(--s-surface-sunken-default);--swirl-shell-text-color:var(--s-text-default);--swirl-shell-header-height:3.25rem;--swirl-shell-collapsed-nav-width:4rem;--swirl-shell-extended-nav-width:18rem;display:flex;width:100%;height:100%}.sc-swirl-shell-layout-h *.sc-swirl-shell-layout{box-sizing:border-box}.shell-layout.sc-swirl-shell-layout{display:grid;overflow:hidden;width:100%;min-height:100%;background-color:var(--swirl-shell-background);transition:grid-template-columns 0.1s;grid-template-columns:0 1fr 0;grid-template-rows:1fr;grid-template-areas:"nav main"}@media (prefers-reduced-motion){.shell-layout.sc-swirl-shell-layout{transition:none}}@media (min-width: 992px){.shell-layout.sc-swirl-shell-layout{padding-right:var(--s-space-8);padding-bottom:var(--s-space-8);-moz-column-gap:var(--s-space-8);column-gap:var(--s-space-8);grid-template-columns:var(--swirl-shell-extended-nav-width) 1fr 0;grid-template-rows:var(--swirl-shell-header-height) 1fr;grid-template-areas:"header header header" "nav main sidebar"}}.shell-layout--branded-header.sc-swirl-shell-layout .shell-layout__header.sc-swirl-shell-layout{border-bottom:none;color:var(--s-text-on-action-primary);background-color:var(--s-action-primary-default)}.shell-layout--branded-header.sc-swirl-shell-layout .shell-layout__header.sc-swirl-shell-layout .shell-layout__header-tool.sc-swirl-shell-layout{color:var(--s-text-on-action-primary);background-color:var(--s-action-primary-default)}.shell-layout--branded-header.sc-swirl-shell-layout .shell-layout__header.sc-swirl-shell-layout .shell-layout__header-tool.sc-swirl-shell-layout:hover{background-color:var(--s-action-primary-hovered)}.shell-layout--branded-header.sc-swirl-shell-layout .shell-layout__header.sc-swirl-shell-layout .shell-layout__header-tool.sc-swirl-shell-layout:active{background-color:var(--s-action-primary-pressed)}.shell-layout--branded-header.sc-swirl-shell-layout .shell-layout__header.sc-swirl-shell-layout .shell-layout__header-tool.sc-swirl-shell-layout swirl-badge.sc-swirl-shell-layout{--swirl-badge-border-color:var(--s-action-primary-default)}@media (min-width: 992px){.shell-layout--navigation-collapsed.sc-swirl-shell-layout .shell-layout__nav.sc-swirl-shell-layout{scrollbar-width:none}.shell-layout--navigation-collapsed.sc-swirl-shell-layout .shell-layout__nav.sc-swirl-shell-layout::-webkit-scrollbar{width:0;background:transparent;-webkit-appearance:none}}.shell-layout--navigation-collapsed .shell-layout__secondary-nav-items--grid-view.sc-swirl-shell-layout-s>ul>*,.shell-layout--navigation-collapsed .shell-layout__secondary-nav-items--grid-view .sc-swirl-shell-layout-s>ul>*{max-width:100%;max-height:3rem;flex-basis:100%}@media (min-width: 992px){.shell-layout--navigation-collapsed.sc-swirl-shell-layout{grid-template-columns:var(--swirl-shell-collapsed-nav-width) 1fr 0}}.shell-layout--mobile-navigation-active.sc-swirl-shell-layout .shell-layout__nav.sc-swirl-shell-layout{transform:translate3d(0, 0, 0);box-shadow:var(--s-shadow-level-3)}@media (min-width: 992px){.shell-layout--mobile-navigation-active.sc-swirl-shell-layout .shell-layout__nav.sc-swirl-shell-layout{transform:none;box-shadow:none}}.shell-layout--mobile-navigation-active.sc-swirl-shell-layout .shell-layout__mobile-nav-backdrop.sc-swirl-shell-layout{display:block}@media (min-width: 992px){.shell-layout--mobile-navigation-active.sc-swirl-shell-layout .shell-layout__mobile-nav-backdrop.sc-swirl-shell-layout{display:none}}.shell-layout--has-secondary-nav.sc-swirl-shell-layout .shell-layout__secondary-nav.sc-swirl-shell-layout{display:block}.shell-layout--secondary-nav-collapsed.sc-swirl-shell-layout .shell-layout__secondary-nav-items.sc-swirl-shell-layout{display:none}.shell-layout__header.sc-swirl-shell-layout{position:relative;display:none;width:calc(100% + var(--s-space-8));padding-top:var(--s-space-8);padding-right:var(--s-space-16);padding-bottom:var(--s-space-8);padding-left:var(--s-space-16);justify-content:space-between;align-items:center;color:var(--swirl-shell-text-color);grid-area:header}@media (min-width: 992px){.shell-layout__header.sc-swirl-shell-layout{display:flex}}.shell-layout__skip-link.sc-swirl-shell-layout{position:absolute;z-index:9;top:0;left:0;padding:var(--s-space-4);border:none;color:var(--swirl-shell-text-color);background-color:var(--swirl-shell-background);font:inherit;cursor:pointer}.shell-layout__skip-link.sc-swirl-shell-layout:not(:focus):not(:active){position:absolute;overflow:hidden;width:1px;height:1px;white-space:nowrap;clip:rect(0 0 0 0);clip-path:inset(50%)}.shell-layout__header-left.sc-swirl-shell-layout{display:flex;padding-left:var(--s-space-2);flex-basis:8rem;flex-shrink:0;align-items:center;gap:var(--s-space-8)}.shell-layout__header-right.sc-swirl-shell-layout{display:flex;flex-basis:8rem;flex-shrink:0;justify-content:flex-end;align-items:center;gap:var(--s-space-8)}.shell-layout__logo.sc-swirl-shell-layout{display:flex;flex-grow:1;justify-content:center;align-items:center}.shell-layout__logo.sc-swirl-shell-layout-s>a{display:flex}.shell-layout__logo.sc-swirl-shell-layout-s>a img,.shell-layout__logo.sc-swirl-shell-layout-s>img{max-height:1.75rem}.shell-layout__header-tool.sc-swirl-shell-layout{position:relative;width:2.25rem;height:2.25rem;padding:var(--s-space-8);flex-shrink:0;border:none;border-radius:var(--s-border-radius-sm);color:var(--swirl-shell-text-color);background-color:var(--s-surface-sunken-default);font:inherit;cursor:pointer}.shell-layout__header-tool.sc-swirl-shell-layout:hover{background-color:var(--s-state-hovered)}.shell-layout__header-tool.sc-swirl-shell-layout:active{background-color:var(--s-state-pressed)}.shell-layout__header-tool.sc-swirl-shell-layout:focus{outline:none}.shell-layout__header-tool.sc-swirl-shell-layout:focus-visible{box-shadow:0 0 0 0.125rem var(--s-focus-default)}.shell-layout__header-tool.sc-swirl-shell-layout swirl-badge.sc-swirl-shell-layout{--swirl-badge-border-color:var(--s-surface-sunken-default);position:absolute;top:var(--s-space-2);right:var(--s-space-2);padding-right:var(--s-space-2);transform:translate3d(0.1875rem, 0, 0)}.shell-layout__nav.sc-swirl-shell-layout{position:fixed;z-index:9;top:0;bottom:0;left:0;overflow-x:hidden;overflow-y:auto;width:100%;max-width:18.75rem;color:var(--swirl-shell-text-color);background-color:var(--s-surface-overlay-default);transition:transform 0.1s, box-shadow 0.1s, width 0.1s;transform:translate3d(-100%, 0, 0);grid-area:nav}@media (prefers-reduced-motion){.shell-layout__nav.sc-swirl-shell-layout{transition:none}}@media (min-width: 992px){.shell-layout__nav.sc-swirl-shell-layout{position:relative;max-width:none;padding-top:0;padding-right:var(--s-space-4);padding-bottom:var(--s-space-8);padding-left:var(--s-space-12);background-color:var(--swirl-shell-background);transform:none;box-shadow:none;inset:auto}}.shell-layout__mobile-header.sc-swirl-shell-layout{display:flex;min-height:3.5rem;margin-bottom:var(--s-space-8);padding-top:var(--s-space-8);padding-right:var(--s-space-16);padding-bottom:var(--s-space-8);padding-left:var(--s-space-16);justify-content:space-between;align-items:center;border-bottom:0.0625rem solid var(--s-border-default)}.shell-layout__mobile-header.sc-swirl-shell-layout-s>img{max-height:1.75rem}.shell-layout__mobile-header.sc-swirl-shell-layout .shell-layout__header-tool.sc-swirl-shell-layout{background-color:var(--s-surface-overlay-default)}.shell-layout__mobile-header.sc-swirl-shell-layout .shell-layout__header-tool.sc-swirl-shell-layout:hover{background-color:var(--s-state-hovered)}.shell-layout__mobile-header.sc-swirl-shell-layout .shell-layout__header-tool.sc-swirl-shell-layout:active{background-color:var(--s-state-pressed)}@media (min-width: 992px){.shell-layout__mobile-header.sc-swirl-shell-layout{display:none}}.shell-layout__mobile-header-tools.sc-swirl-shell-layout{display:flex;justify-content:flex-end;align-items:center;gap:var(--s-space-8)}.shell-layout__nav-body.sc-swirl-shell-layout{padding:var(--s-space-8)}.shell-layout__nav-body.sc-swirl-shell-layout-s ul{margin:0;padding:0;list-style:none}.shell-layout__nav-body.sc-swirl-shell-layout-s li{display:flex}@media (min-width: 992px){.shell-layout__nav-body.sc-swirl-shell-layout{padding:0}}.shell-layout__mobile-nav-backdrop.sc-swirl-shell-layout{position:fixed;z-index:8;display:none;background-color:rgba(0, 0, 0, 0.25);animation:shell-layout-backdrop-fade-in 0.1s;inset:0}.shell-layout__secondary-nav.sc-swirl-shell-layout{display:none}.shell-layout__secondary-nav-items.sc-swirl-shell-layout-s>ul,.shell-layout__secondary-nav-items .sc-swirl-shell-layout-s>ul{display:flex;flex-direction:column;gap:var(--s-space-2)}.shell-layout:not(.shell-layout--navigation-collapsed) .shell-layout__secondary-nav-items--grid-view.sc-swirl-shell-layout-s>ul,.shell-layout:not(.shell-layout--navigation-collapsed) .shell-layout__secondary-nav-items--grid-view .sc-swirl-shell-layout-s>ul{flex-wrap:wrap;flex-direction:row;gap:var(--s-space-16)}.shell-layout:not(.shell-layout--navigation-collapsed) .shell-layout__secondary-nav-items--grid-view.sc-swirl-shell-layout-s>ul>*,.shell-layout:not(.shell-layout--navigation-collapsed) .shell-layout__secondary-nav-items--grid-view .sc-swirl-shell-layout-s>ul>*{min-width:0;max-height:none}.shell-layout:not(.shell-layout--navigation-collapsed) .shell-layout__secondary-nav-items--grid-view.shell-layout__secondary-nav-items--app-icon.sc-swirl-shell-layout-s>ul,.shell-layout:not(.shell-layout--navigation-collapsed) .shell-layout__secondary-nav-items--grid-view.shell-layout__secondary-nav-items--app-icon .sc-swirl-shell-layout-s>ul{row-gap:var(--s-space-16);-moz-column-gap:0;column-gap:0}.shell-layout--navigation-collapsed .shell-layout__secondary-nav-items--tiled.sc-swirl-shell-layout-s>ul,.shell-layout--navigation-collapsed .shell-layout__secondary-nav-items--tiled .sc-swirl-shell-layout-s>ul{gap:var(--s-space-16)}.shell-layout__secondary-nav-items--tiled.sc-swirl-shell-layout-s>ul>*,.shell-layout__secondary-nav-items--tiled .sc-swirl-shell-layout-s>ul>*{flex-basis:calc(50% - var(--s-space-8))}.shell-layout__secondary-nav-items--app-icon.sc-swirl-shell-layout-s>ul>*,.shell-layout__secondary-nav-items--app-icon .sc-swirl-shell-layout-s>ul>*{flex-basis:calc(100% / 3)}.shell-layout__main.sc-swirl-shell-layout{overflow:hidden;background-color:var(--s-background-default);grid-area:main}@media (min-width: 992px){.shell-layout__main.sc-swirl-shell-layout{width:calc(100% + var(--s-space-8));border:0.0625rem solid var(--s-border-default);border-radius:var(--s-border-radius-sm)}}@keyframes shell-layout-backdrop-fade-in{from{opacity:0}to{opacity:1}}@keyframes shell-layout-no-overflow-after-transition{0%{overflow:initial}99%{overflow:initial}100%{overflow:hidden}}'}},[262,"swirl-shell-layout",{brandedHeader:[4,"branded-header"],browserBackButtonLabel:[1,"browser-back-button-label"],browserForwardButtonLabel:[1,"browser-forward-button-label"],collapseNavigationButtonLabel:[1,"collapse-navigation-button-label"],enableSecondaryNavGridLayout:[4,"enable-secondary-nav-grid-layout"],secondaryNavGridLayoutVariant:[1,"secondary-nav-grid-layout-variant"],expandNavigationButtonLabel:[1,"expand-navigation-button-label"],gridNavLayoutToggleLabel:[1,"grid-nav-layout-toggle-label"],hideMobileNavigationButtonLabel:[1,"hide-mobile-navigation-button-label"],listNavLayoutToggleLabel:[1,"list-nav-layout-toggle-label"],navigationLabel:[1,"navigation-label"],secondaryNavCollapseLabel:[1,"secondary-nav-collapse-label"],secondaryNavExpandLabel:[1,"secondary-nav-expand-label"],skipLinkLabel:[1,"skip-link-label"],isDesktopViewport:[32],mobileNavigationActive:[32],navigationCollapsed:[32],secondaryNavCollapsed:[32],secondaryNavView:[32],showMobileNavigation:[64],hideMobileNavigation:[64]},[[8,"keydown","onWindowKeyDown"],[9,"resize","onWindowResize"]],{enableSecondaryNavGridLayout:[{watchEnableSecondaryNavGridLayout:0}],mobileNavigationActive:[{watchMobileNavigationState:0}],navigationCollapsed:[{watchNavigationCollapsed:0}]}]),le=ee,ae=function(){"undefined"!=typeof customElements&&["swirl-shell-layout","swirl-box","swirl-button","swirl-icon-arrow-back","swirl-icon-arrow-forward","swirl-icon-dock-left-collapse","swirl-icon-dock-left-expand","swirl-icon-double-arrow-left","swirl-separator","swirl-stack","swirl-tooltip","swirl-visually-hidden"].forEach((e=>{switch(e){case"swirl-shell-layout":customElements.get(s(e))||customElements.define(s(e),ee);break;case"swirl-box":customElements.get(s(e))||n();break;case"swirl-button":customElements.get(s(e))||c();break;case"swirl-icon-arrow-back":customElements.get(s(e))||d();break;case"swirl-icon-arrow-forward":customElements.get(s(e))||u();break;case"swirl-icon-dock-left-collapse":customElements.get(s(e))||h();break;case"swirl-icon-dock-left-expand":customElements.get(s(e))||f();break;case"swirl-icon-double-arrow-left":customElements.get(s(e))||y();break;case"swirl-separator":customElements.get(s(e))||v();break;case"swirl-stack":customElements.get(s(e))||b();break;case"swirl-tooltip":customElements.get(s(e))||w();break;case"swirl-visually-hidden":customElements.get(s(e))||p()}}))};export{le as SwirlShellLayout,ae as defineCustomElement}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{proxyCustomElement as i,HTMLElement as e,h as a,Host as t,transformTag as l}from"@stencil/core/internal/client";import{c as n}from"./index2.js";import{d as s}from"./swirl-badge2.js";import{d as o}from"./swirl-icon-close2.js";import{d as r}from"./swirl-tag2.js";import{d as h}from"./swirl-tooltip2.js";import{d as g}from"./swirl-visually-hidden2.js";const d=i(class extends e{constructor(i){super(),!1!==i&&this.__registerHost(),this.__attachShadow(),this.hideLabel=!1,this.inlineLabelColor="default",this.markAsNewLabel="New",this.useCustomIconSize=!1,this.variant="default"}componentWillLoad(){this.forceIconProps()}componentDidRender(){this.forceIconProps()}forceIconProps(){if(this.useCustomIconSize)return;const i=this.el.querySelector("[slot='icon']"),e=this.hideLabel&&"app-icon"===this.variant||"default"===this.variant;i&&(i.tagName.startsWith("SWIRL-ICON")||i.tagName.startsWith("SWIRL-EMOJI")||i.tagName.startsWith("SWIRL-SYMBOL"))&&i.setAttribute("size",e?"20":"32")}render(){const i=!!this.el.querySelector("swirl-app-icon"),e=n("shell-navigation-item","shell-navigation-item--"+this.variant,{"shell-navigation-item--active":this.active,"shell-navigation-item--boxed":this.boxed,"shell-navigation-item--filled":this.filled,"shell-navigation-item--inline-label":this.inlineLabel,"shell-navigation-item--gradient":this.withGradient,"shell-navigation-item--hide-label":this.hideLabel,"shell-navigation-item--has-app-icon":i}),l=n("shell-navigation-item__label",{"shell-navigation-item__label--light":"light"===this.inlineLabelColor,"shell-navigation-item__label--dark":"dark"===this.inlineLabelColor,"shell-navigation-item__label--inline":this.inlineLabel}),s=null!=this.badgeLabel,o=!s&&this.markAsNew&&!this.hideLabel&&"default"===this.variant,r=!s&&this.markAsNew&&this.hideLabel&&"default"===this.variant,h=!!this.href;return a(t,{key:"1c4d8c589451f646287707da33a802baf626af5c"},a("swirl-tooltip",{key:"2bb6f3b5eb2eb24d651ad3417dda26206a21cf67",active:this.hideLabel,content:this.description?`${this.label} ${this.description}`:this.label,delay:100,position:"right"},a(h?"a":"button",{key:"9801acbdcbe8ea6c289f05244e09f5e99129c069","aria-current":this.swirlAriaCurrent,class:e,href:this.href,target:this.target,type:h?void 0:"button",title:this.hideLabel?void 0:this.label},a("span",{key:"9dc900a9f26f38b84f292637abcac397b1858420",class:"shell-navigation-item__icon"},a("slot",{key:"413fcc518da561d25e05bb4a1b770b1ac359bc6e",name:"icon"})),this.hideLabel?a("swirl-visually-hidden",null,a("span",{class:l},this.label)):"default"!==this.variant?a("span",{class:l},this.label):a("div",{class:"shell-navigation-item__text-wrapper"},a("span",{class:l},this.label),this.description&&a("span",{class:"shell-navigation-item__description"},this.description)),s&&a("span",{key:"2955d9bcc86199dde44b41335c2d1ce2a177da65",class:"shell-navigation-item__badge-wrapper"},a("swirl-badge",{key:"320347ae1c00fccdfb74ec934d8b411742e1e00d","aria-label":this.badgeLabel,class:n("shell-navigation-item__badge",{"shell-navigation-item__badge--dot":""===this.badgeLabel}),label:this.badgeLabel,size:"xs",variant:""===this.badgeLabel?"dot":"default"})),o&&a("swirl-tag",{key:"1427a2d08c87c2f6b7f32c32968ceb9c2ac78ffd",class:"shell-navigation-item__is-new-tag",intent:"info",label:this.markAsNewLabel.toLocaleUpperCase(),size:"s",variant:"strong"}),r&&a("swirl-badge",{key:"d52bf123a4ce7a66d2ae369115fea8f4c017c9ca",class:"shell-navigation-item__is-new-badge",intent:"info",label:this.markAsNewLabel.toLocaleUpperCase(),size:"xs",variant:"dot"}))))}get el(){return this}static get style(){return':host{display:inline-flex;width:100%}:host *{box-sizing:border-box}.shell-navigation-item{--swirl-app-icon-size:2rem;--swirl-shell-navigation-item-gradient:linear-gradient( rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.8) );position:relative;display:flex;width:100%;height:3rem;padding:var(--s-space-8);flex-shrink:0;justify-content:flex-start;align-items:center;border:none;border-radius:var(--s-border-radius-sm);color:var(--s-text-default);background-color:var(--s-surface-overlay-default);font:inherit;font-size:var(--s-font-size-sm);font-weight:var(--s-font-weight-medium);line-height:var(--s-line-height-sm);text-decoration:none;cursor:pointer;container-type:size;gap:var(--s-space-12)}.shell-navigation-item .shell-navigation-item__badge{--swirl-badge-border-color:var(--s-surface-overlay-default)}.shell-navigation-item:hover{background-color:var(--s-state-hovered)}.shell-navigation-item:hover .shell-navigation-item__badge,.shell-navigation-item:hover .shell-navigation-item__is-new-badge{--swirl-badge-border-color:var(--s-state-hovered)}.shell-navigation-item:active{background-color:var(--s-state-pressed)}.shell-navigation-item:active .shell-navigation-item__badge,.shell-navigation-item:active .shell-navigation-item__is-new-badge{--swirl-badge-border-color:var(--s-state-pressed)}.shell-navigation-item:focus{outline:none}.shell-navigation-item:focus-visible{z-index:1;box-shadow:0 0 0 0.125rem var(--s-focus-default)}.shell-navigation-item.shell-navigation-item--boxed{--swirl-app-icon-size:2rem}.shell-navigation-item.shell-navigation-item--boxed .shell-navigation-item__icon{overflow:hidden;border-radius:var(--s-border-radius-sm);background-color:var(--s-background-default);box-shadow:0 0 0 var(--s-border-width-default) var(--s-border-default)}.shell-navigation-item.shell-navigation-item--default.shell-navigation-item--filled .shell-navigation-item__icon{border-radius:var(--s-border-radius-sm);width:2rem;min-width:2rem;height:2rem;min-height:2rem}.shell-navigation-item.shell-navigation-item--filled{padding:var(--s-space-8)}.shell-navigation-item.shell-navigation-item--filled:not(.shell-navigation-item--has-app-icon) .shell-navigation-item__icon{color:var(--s-icon-on-action-primary);background-color:var(--s-action-primary-default)}.shell-navigation-item.shell-navigation-item--filled ::slotted(swirl-app-icon){position:inherit;width:100%;height:100%}.shell-navigation-item.shell-navigation-item--tiled{--swirl-app-icon-size:100%;height:auto;padding:0;align-items:start;border-radius:var(--s-border-radius-base);flex-direction:column;container-type:inline-size;gap:var(--s-space-8)}.shell-navigation-item.shell-navigation-item--tiled:hover{background-color:transparent}.shell-navigation-item.shell-navigation-item--tiled:hover .shell-navigation-item__label{text-decoration:underline}.shell-navigation-item.shell-navigation-item--tiled ::slotted(*){position:absolute;top:var(--s-space-12);left:var(--s-space-12)}.shell-navigation-item.shell-navigation-item--tiled ::slotted(swirl-app-icon){position:inherit;width:100%;height:100%}.shell-navigation-item.shell-navigation-item--tiled .shell-navigation-item__icon{overflow:hidden;width:100%;min-width:100%;height:auto;min-height:auto;border-radius:var(--s-border-radius-base);background-color:var(--s-state-hovered);aspect-ratio:1}.shell-navigation-item.shell-navigation-item--tiled.shell-navigation-item--gradient .shell-navigation-item__icon::after{position:absolute;display:inline-block;width:100%;border-radius:var(--s-border-radius-base);background-image:var(--swirl-shell-navigation-item-gradient);content:"";aspect-ratio:1}.shell-navigation-item.shell-navigation-item--tiled .shell-navigation-item__label{color:var(--s-text-default);font-weight:var(--s-font-weight-semibold);text-align:start}.shell-navigation-item.shell-navigation-item--tiled .shell-navigation-item__label--inline{position:absolute;bottom:var(--s-space-12);left:var(--s-space-12);margin-right:var(--s-space-12)}.shell-navigation-item.shell-navigation-item--tiled .shell-navigation-item__label--inline.shell-navigation-item__label--light{color:rgba(242, 242, 242, 1)}.shell-navigation-item.shell-navigation-item--tiled .shell-navigation-item__label--inline.shell-navigation-item__label--dark{color:rgb(25, 25, 25)}.shell-navigation-item.shell-navigation-item--app-icon{--swirl-app-icon-size:100%;font-size:var(--s-font-size-xs);padding:var(--s-space-8) var(--s-space-4);align-items:center;height:auto;border-radius:var(--s-border-radius-sm);flex-direction:column;container-type:inline-size;gap:var(--s-space-8)}.shell-navigation-item.shell-navigation-item--app-icon.shell-navigation-item--hide-label{align-items:start;padding:var(--s-space-8);--swirl-app-icon-size:2rem}.shell-navigation-item.shell-navigation-item--app-icon.shell-navigation-item--hide-label .shell-navigation-item__icon{border-radius:var(--s-border-radius-sm);max-width:2rem}.shell-navigation-item.shell-navigation-item--app-icon.shell-navigation-item--hide-label .shell-navigation-item__badge-wrapper{max-width:2rem;max-height:2rem}.shell-navigation-item.shell-navigation-item--app-icon .shell-navigation-item__icon{overflow:hidden;width:100%;max-width:3.5rem;height:auto;border-radius:var(--s-border-radius-base);color:var(--s-icon-on-action-primary);aspect-ratio:1}.shell-navigation-item.shell-navigation-item--app-icon .shell-navigation-item__badge-wrapper{max-width:3.5rem;max-height:3.5rem}.shell-navigation-item.shell-navigation-item--app-icon .shell-navigation-item__label{line-height:var(--s-line-height-xs);text-align:center}.shell-navigation-item.shell-navigation-item--app-icon .shell-navigation-item__badge-wrapper,.shell-navigation-item.shell-navigation-item--tiled .shell-navigation-item__badge-wrapper{position:absolute;width:100%;height:100%}.shell-navigation-item.shell-navigation-item--app-icon .shell-navigation-item__label,.shell-navigation-item.shell-navigation-item--tiled .shell-navigation-item__label{display:-webkit-box;overflow:hidden;white-space:normal;text-overflow:unset;overflow-wrap:anywhere;-webkit-line-clamp:2;-webkit-box-orient:vertical}.shell-navigation-item.shell-navigation-item--app-icon .shell-navigation-item__badge,.shell-navigation-item.shell-navigation-item--tiled .shell-navigation-item__badge{position:absolute;top:-0.375rem;right:-0.375rem;padding:var(--s-space-2)}.shell-navigation-item.shell-navigation-item--active{background-color:var(--s-state-hovered)}.shell-navigation-item.shell-navigation-item--active .shell-navigation-item__icon{color:var(--s-icon-highlight)}.shell-navigation-item.shell-navigation-item--active .shell-navigation-item__label{color:var(--s-text-highlight)}.shell-navigation-item.shell-navigation-item--active .shell-navigation-item__badge{--swirl-badge-border-color:var(--s-state-hovered)}.shell-navigation-item.shell-navigation-item--active:hover{background-color:var(--s-state-hovered)}.shell-navigation-item.shell-navigation-item--active:hover .shell-navigation-item__badge{--swirl-badge-border-color:var(--s-state-hovered)}.shell-navigation-item.shell-navigation-item--active:active{background-color:var(--s-state-pressed)}.shell-navigation-item.shell-navigation-item--active:active .shell-navigation-item__badge{--swirl-badge-border-color:var(--s-state-pressed)}@media (min-width: 992px){.shell-navigation-item{background-color:var(--s-surface-sunken-default)}.shell-navigation-item .shell-navigation-item__badge{--swirl-badge-border-color:var(--s-surface-sunken-default)}}.shell-navigation-item__icon{display:inline-flex;width:2rem;min-width:2rem;height:2rem;min-height:2rem;justify-content:center;align-items:center;overflow:hidden;border-radius:var(--s-border-radius-base)}.shell-navigation-item__text-wrapper{overflow:hidden;min-width:0;flex-grow:1;text-align:start;white-space:nowrap;text-overflow:ellipsis}.shell-navigation-item__description{margin-left:var(--s-space-8);font-weight:var(--s-font-weight-normal);color:var(--s-text-subdued)}.shell-navigation-item__badge{flex-shrink:0;--swirl-badge-border-color:var(--swirl-shell-background)}.shell-navigation-item__is-new-tag{flex-shrink:0}.shell-navigation-item__is-new-badge{position:absolute;top:0.625rem;right:0.625rem;flex-shrink:0;--swirl-badge-border-color:var(--swirl-shell-background)}@container (max-width: 4rem){.shell-navigation-item__badge{position:absolute;top:var(--s-space-4);right:var(--s-space-4);padding:var(--s-space-2)}.shell-navigation-item--gradient .shell-navigation-item__icon{--swirl-shell-navigation-item-gradient:none}.shell-navigation-item__badge--dot{top:var(--s-space-8);right:var(--s-space-8)}}@container (min-width: 10rem){.shell-navigation-item__badge--dot{padding-right:var(--s-space-4)}}'}},[257,"swirl-shell-navigation-item",{active:[4],badgeLabel:[1,"badge-label"],boxed:[4],description:[1],filled:[4],hideLabel:[4,"hide-label"],href:[1],inlineLabel:[4,"inline-label"],inlineLabelColor:[1,"inline-label-color"],label:[1],markAsNew:[4,"mark-as-new"],markAsNewLabel:[1,"mark-as-new-label"],swirlAriaCurrent:[1,"swirl-aria-current"],target:[1],useCustomIconSize:[4,"use-custom-icon-size"],variant:[1],withGradient:[4,"with-gradient"]}]),v=d,m=function(){"undefined"!=typeof customElements&&["swirl-shell-navigation-item","swirl-badge","swirl-icon-close","swirl-tag","swirl-tooltip","swirl-visually-hidden"].forEach((i=>{switch(i){case"swirl-shell-navigation-item":customElements.get(l(i))||customElements.define(l(i),d);break;case"swirl-badge":customElements.get(l(i))||s();break;case"swirl-icon-close":customElements.get(l(i))||o();break;case"swirl-tag":customElements.get(l(i))||r();break;case"swirl-tooltip":customElements.get(l(i))||h();break;case"swirl-visually-hidden":customElements.get(l(i))||g()}}))};export{v as SwirlShellNavigationItem,m as defineCustomElement}
|
|
1
|
+
import{proxyCustomElement as i,HTMLElement as e,h as a,Host as t,transformTag as l}from"@stencil/core/internal/client";import{c as n}from"./index2.js";import{d as s}from"./swirl-badge2.js";import{d as o}from"./swirl-icon-close2.js";import{d as r}from"./swirl-tag2.js";import{d as h}from"./swirl-tooltip2.js";import{d}from"./swirl-visually-hidden2.js";const g=i(class extends e{constructor(i){super(),!1!==i&&this.__registerHost(),this.__attachShadow(),this.hideLabel=!1,this.inlineLabelColor="default",this.markAsNewLabel="New",this.useCustomIconSize=!1,this.variant="default"}componentWillLoad(){console.warn('[Swirl] The "swirl-shell-navigation-item" component is deprecated and will be removed in the next major release.'),this.forceIconProps()}componentDidRender(){this.forceIconProps()}forceIconProps(){if(this.useCustomIconSize)return;const i=this.el.querySelector("[slot='icon']"),e=this.hideLabel&&"app-icon"===this.variant||"default"===this.variant;i&&(i.tagName.startsWith("SWIRL-ICON")||i.tagName.startsWith("SWIRL-EMOJI")||i.tagName.startsWith("SWIRL-SYMBOL"))&&i.setAttribute("size",e?"20":"32")}render(){const i=!!this.el.querySelector("swirl-app-icon"),e=n("shell-navigation-item","shell-navigation-item--"+this.variant,{"shell-navigation-item--active":this.active,"shell-navigation-item--boxed":this.boxed,"shell-navigation-item--filled":this.filled,"shell-navigation-item--inline-label":this.inlineLabel,"shell-navigation-item--gradient":this.withGradient,"shell-navigation-item--hide-label":this.hideLabel,"shell-navigation-item--has-app-icon":i}),l=n("shell-navigation-item__label",{"shell-navigation-item__label--light":"light"===this.inlineLabelColor,"shell-navigation-item__label--dark":"dark"===this.inlineLabelColor,"shell-navigation-item__label--inline":this.inlineLabel}),s=null!=this.badgeLabel,o=!s&&this.markAsNew&&!this.hideLabel&&"default"===this.variant,r=!s&&this.markAsNew&&this.hideLabel&&"default"===this.variant,h=!!this.href;return a(t,{key:"aeac0acbbe7cd9c55c0b8d4d2821aa3918d05aa4"},a("swirl-tooltip",{key:"fbd93c62eb3fba3d3e49f2a46870a23f7ef09ffa",active:this.hideLabel,content:this.description?`${this.label} ${this.description}`:this.label,delay:100,position:"right"},a(h?"a":"button",{key:"912601d126642c44f55a82886b0e5d74aa77e0b9","aria-current":this.swirlAriaCurrent,class:e,href:this.href,target:this.target,type:h?void 0:"button",title:this.hideLabel?void 0:this.label},a("span",{key:"88ff2c7cf186b1abf8d64a0e7a4df63dc0c559ef",class:"shell-navigation-item__icon"},a("slot",{key:"dfcf9b9382b959fac044b3790ecaf1b419e65937",name:"icon"})),this.hideLabel?a("swirl-visually-hidden",null,a("span",{class:l},this.label)):"default"!==this.variant?a("span",{class:l},this.label):a("div",{class:"shell-navigation-item__text-wrapper"},a("span",{class:l},this.label),this.description&&a("span",{class:"shell-navigation-item__description"},this.description)),s&&a("span",{key:"adea33c07e645202fc33b7d1463954caa4730e08",class:"shell-navigation-item__badge-wrapper"},a("swirl-badge",{key:"f92c9475d2f1060f0f3a2a2c30b9cea6d8e396df","aria-label":this.badgeLabel,class:n("shell-navigation-item__badge",{"shell-navigation-item__badge--dot":""===this.badgeLabel}),label:this.badgeLabel,size:"xs",variant:""===this.badgeLabel?"dot":"default"})),o&&a("swirl-tag",{key:"4a3b80ead81bc32dcf84c958ed0ee9ed8f15f9b7",class:"shell-navigation-item__is-new-tag",intent:"info",label:this.markAsNewLabel.toLocaleUpperCase(),size:"s",variant:"strong"}),r&&a("swirl-badge",{key:"de9667d2fd1c275b108f1df7875b6df7a39af77c",class:"shell-navigation-item__is-new-badge",intent:"info",label:this.markAsNewLabel.toLocaleUpperCase(),size:"xs",variant:"dot"}))))}get el(){return this}static get style(){return':host{display:inline-flex;width:100%}:host *{box-sizing:border-box}.shell-navigation-item{--swirl-app-icon-size:2rem;--swirl-shell-navigation-item-gradient:linear-gradient( rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.8) );position:relative;display:flex;width:100%;height:3rem;padding:var(--s-space-8);flex-shrink:0;justify-content:flex-start;align-items:center;border:none;border-radius:var(--s-border-radius-sm);color:var(--s-text-default);background-color:var(--s-surface-overlay-default);font:inherit;font-size:var(--s-font-size-sm);font-weight:var(--s-font-weight-medium);line-height:var(--s-line-height-sm);text-decoration:none;cursor:pointer;container-type:size;gap:var(--s-space-12)}.shell-navigation-item .shell-navigation-item__badge{--swirl-badge-border-color:var(--s-surface-overlay-default)}.shell-navigation-item:hover{background-color:var(--s-state-hovered)}.shell-navigation-item:hover .shell-navigation-item__badge,.shell-navigation-item:hover .shell-navigation-item__is-new-badge{--swirl-badge-border-color:var(--s-state-hovered)}.shell-navigation-item:active{background-color:var(--s-state-pressed)}.shell-navigation-item:active .shell-navigation-item__badge,.shell-navigation-item:active .shell-navigation-item__is-new-badge{--swirl-badge-border-color:var(--s-state-pressed)}.shell-navigation-item:focus{outline:none}.shell-navigation-item:focus-visible{z-index:1;box-shadow:0 0 0 0.125rem var(--s-focus-default)}.shell-navigation-item.shell-navigation-item--boxed{--swirl-app-icon-size:2rem}.shell-navigation-item.shell-navigation-item--boxed .shell-navigation-item__icon{overflow:hidden;border-radius:var(--s-border-radius-sm);background-color:var(--s-background-default);box-shadow:0 0 0 var(--s-border-width-default) var(--s-border-default)}.shell-navigation-item.shell-navigation-item--default.shell-navigation-item--filled .shell-navigation-item__icon{border-radius:var(--s-border-radius-sm);width:2rem;min-width:2rem;height:2rem;min-height:2rem}.shell-navigation-item.shell-navigation-item--filled{padding:var(--s-space-8)}.shell-navigation-item.shell-navigation-item--filled:not(.shell-navigation-item--has-app-icon) .shell-navigation-item__icon{color:var(--s-icon-on-action-primary);background-color:var(--s-action-primary-default)}.shell-navigation-item.shell-navigation-item--filled ::slotted(swirl-app-icon){position:inherit;width:100%;height:100%}.shell-navigation-item.shell-navigation-item--tiled{--swirl-app-icon-size:100%;height:auto;padding:0;align-items:start;border-radius:var(--s-border-radius-base);flex-direction:column;container-type:inline-size;gap:var(--s-space-8)}.shell-navigation-item.shell-navigation-item--tiled:hover{background-color:transparent}.shell-navigation-item.shell-navigation-item--tiled:hover .shell-navigation-item__label{text-decoration:underline}.shell-navigation-item.shell-navigation-item--tiled ::slotted(*){position:absolute;top:var(--s-space-12);left:var(--s-space-12)}.shell-navigation-item.shell-navigation-item--tiled ::slotted(swirl-app-icon){position:inherit;width:100%;height:100%}.shell-navigation-item.shell-navigation-item--tiled .shell-navigation-item__icon{overflow:hidden;width:100%;min-width:100%;height:auto;min-height:auto;border-radius:var(--s-border-radius-base);background-color:var(--s-state-hovered);aspect-ratio:1}.shell-navigation-item.shell-navigation-item--tiled.shell-navigation-item--gradient .shell-navigation-item__icon::after{position:absolute;display:inline-block;width:100%;border-radius:var(--s-border-radius-base);background-image:var(--swirl-shell-navigation-item-gradient);content:"";aspect-ratio:1}.shell-navigation-item.shell-navigation-item--tiled .shell-navigation-item__label{color:var(--s-text-default);font-weight:var(--s-font-weight-semibold);text-align:start}.shell-navigation-item.shell-navigation-item--tiled .shell-navigation-item__label--inline{position:absolute;bottom:var(--s-space-12);left:var(--s-space-12);margin-right:var(--s-space-12)}.shell-navigation-item.shell-navigation-item--tiled .shell-navigation-item__label--inline.shell-navigation-item__label--light{color:rgba(242, 242, 242, 1)}.shell-navigation-item.shell-navigation-item--tiled .shell-navigation-item__label--inline.shell-navigation-item__label--dark{color:rgb(25, 25, 25)}.shell-navigation-item.shell-navigation-item--app-icon{--swirl-app-icon-size:100%;font-size:var(--s-font-size-xs);padding:var(--s-space-8) var(--s-space-4);align-items:center;height:auto;border-radius:var(--s-border-radius-sm);flex-direction:column;container-type:inline-size;gap:var(--s-space-8)}.shell-navigation-item.shell-navigation-item--app-icon.shell-navigation-item--hide-label{align-items:start;padding:var(--s-space-8);--swirl-app-icon-size:2rem}.shell-navigation-item.shell-navigation-item--app-icon.shell-navigation-item--hide-label .shell-navigation-item__icon{border-radius:var(--s-border-radius-sm);max-width:2rem}.shell-navigation-item.shell-navigation-item--app-icon.shell-navigation-item--hide-label .shell-navigation-item__badge-wrapper{max-width:2rem;max-height:2rem}.shell-navigation-item.shell-navigation-item--app-icon .shell-navigation-item__icon{overflow:hidden;width:100%;max-width:3.5rem;height:auto;border-radius:var(--s-border-radius-base);color:var(--s-icon-on-action-primary);aspect-ratio:1}.shell-navigation-item.shell-navigation-item--app-icon .shell-navigation-item__badge-wrapper{max-width:3.5rem;max-height:3.5rem}.shell-navigation-item.shell-navigation-item--app-icon .shell-navigation-item__label{line-height:var(--s-line-height-xs);text-align:center}.shell-navigation-item.shell-navigation-item--app-icon .shell-navigation-item__badge-wrapper,.shell-navigation-item.shell-navigation-item--tiled .shell-navigation-item__badge-wrapper{position:absolute;width:100%;height:100%}.shell-navigation-item.shell-navigation-item--app-icon .shell-navigation-item__label,.shell-navigation-item.shell-navigation-item--tiled .shell-navigation-item__label{display:-webkit-box;overflow:hidden;white-space:normal;text-overflow:unset;overflow-wrap:anywhere;-webkit-line-clamp:2;-webkit-box-orient:vertical}.shell-navigation-item.shell-navigation-item--app-icon .shell-navigation-item__badge,.shell-navigation-item.shell-navigation-item--tiled .shell-navigation-item__badge{position:absolute;top:-0.375rem;right:-0.375rem;padding:var(--s-space-2)}.shell-navigation-item.shell-navigation-item--active{background-color:var(--s-state-hovered)}.shell-navigation-item.shell-navigation-item--active .shell-navigation-item__icon{color:var(--s-icon-highlight)}.shell-navigation-item.shell-navigation-item--active .shell-navigation-item__label{color:var(--s-text-highlight)}.shell-navigation-item.shell-navigation-item--active .shell-navigation-item__badge{--swirl-badge-border-color:var(--s-state-hovered)}.shell-navigation-item.shell-navigation-item--active:hover{background-color:var(--s-state-hovered)}.shell-navigation-item.shell-navigation-item--active:hover .shell-navigation-item__badge{--swirl-badge-border-color:var(--s-state-hovered)}.shell-navigation-item.shell-navigation-item--active:active{background-color:var(--s-state-pressed)}.shell-navigation-item.shell-navigation-item--active:active .shell-navigation-item__badge{--swirl-badge-border-color:var(--s-state-pressed)}@media (min-width: 992px){.shell-navigation-item{background-color:var(--s-surface-sunken-default)}.shell-navigation-item .shell-navigation-item__badge{--swirl-badge-border-color:var(--s-surface-sunken-default)}}.shell-navigation-item__icon{display:inline-flex;width:2rem;min-width:2rem;height:2rem;min-height:2rem;justify-content:center;align-items:center;overflow:hidden;border-radius:var(--s-border-radius-base)}.shell-navigation-item__text-wrapper{overflow:hidden;min-width:0;flex-grow:1;text-align:start;white-space:nowrap;text-overflow:ellipsis}.shell-navigation-item__description{margin-left:var(--s-space-8);font-weight:var(--s-font-weight-normal);color:var(--s-text-subdued)}.shell-navigation-item__badge{flex-shrink:0;--swirl-badge-border-color:var(--swirl-shell-background)}.shell-navigation-item__is-new-tag{flex-shrink:0}.shell-navigation-item__is-new-badge{position:absolute;top:0.625rem;right:0.625rem;flex-shrink:0;--swirl-badge-border-color:var(--swirl-shell-background)}@container (max-width: 4rem){.shell-navigation-item__badge{position:absolute;top:var(--s-space-4);right:var(--s-space-4);padding:var(--s-space-2)}.shell-navigation-item--gradient .shell-navigation-item__icon{--swirl-shell-navigation-item-gradient:none}.shell-navigation-item__badge--dot{top:var(--s-space-8);right:var(--s-space-8)}}@container (min-width: 10rem){.shell-navigation-item__badge--dot{padding-right:var(--s-space-4)}}'}},[257,"swirl-shell-navigation-item",{active:[4],badgeLabel:[1,"badge-label"],boxed:[4],description:[1],filled:[4],hideLabel:[4,"hide-label"],href:[1],inlineLabel:[4,"inline-label"],inlineLabelColor:[1,"inline-label-color"],label:[1],markAsNew:[4,"mark-as-new"],markAsNewLabel:[1,"mark-as-new-label"],swirlAriaCurrent:[1,"swirl-aria-current"],target:[1],useCustomIconSize:[4,"use-custom-icon-size"],variant:[1],withGradient:[4,"with-gradient"]}]),v=g,m=function(){"undefined"!=typeof customElements&&["swirl-shell-navigation-item","swirl-badge","swirl-icon-close","swirl-tag","swirl-tooltip","swirl-visually-hidden"].forEach((i=>{switch(i){case"swirl-shell-navigation-item":customElements.get(l(i))||customElements.define(l(i),g);break;case"swirl-badge":customElements.get(l(i))||s();break;case"swirl-icon-close":customElements.get(l(i))||o();break;case"swirl-tag":customElements.get(l(i))||r();break;case"swirl-tooltip":customElements.get(l(i))||h();break;case"swirl-visually-hidden":customElements.get(l(i))||d()}}))};export{v as SwirlShellNavigationItem,m as defineCustomElement}
|
|
@@ -43,8 +43,12 @@ const SwirlDataCell = class {
|
|
|
43
43
|
});
|
|
44
44
|
const labelId = `${this.elementId}-label`;
|
|
45
45
|
const valueId = `${this.elementId}-value`;
|
|
46
|
-
const
|
|
47
|
-
|
|
46
|
+
const isInDataCellStack = this.el.parentElement?.tagName === "SWIRL-DATA-CELL-STACK";
|
|
47
|
+
const hostRole = isInDataCellStack ? "listitem" : "group";
|
|
48
|
+
const contentRole = hasCheckbox || hasRadio ? "button" : undefined;
|
|
49
|
+
const wrapperRole = isInDataCellStack && !contentRole ? "group" : contentRole;
|
|
50
|
+
const labelContent = (h("swirl-stack", { key: 'c0a4a14faad9ff0c649f8594ede3401bfaace84b', orientation: "horizontal", align: "center", spacing: "4" }, h("span", { key: 'b7a45482eaef7333e7a5b4e7b2a6d3a6f3bd45f5', class: "data-cell__label", id: labelId, role: "term" }, this.label), this.tooltip && (h("swirl-tooltip", { key: '43cccb7abb557f481805cb7d2ff76a85353ded30', class: "data-cell__tooltip", content: this.tooltip, position: "right" }, h("swirl-icon-info", { key: '0e5635708a0ea574c5afe38cde05cca227f52327', size: 16, tabIndex: 0 })))));
|
|
51
|
+
return (h(Host, { key: '0b1e6388f330d36cbf7c8b40d91ff475a08a9f7d', role: hostRole }, h("div", { key: 'f5bd2b0e7d38b7b879ddd7d7f9244772583b5d7e', class: className, part: "data-cell", onClick: hasCheckbox || hasRadio ? this.handleClick : undefined, role: wrapperRole, tabIndex: hasCheckbox || hasRadio ? 0 : undefined }, hasMedia && (h("div", { key: '338a5f743913eca6a97b8e9c75e9c5372ef5af67', class: "data-cell__media", "aria-hidden": "true" }, h("slot", { key: '9f30d751976bf5ee4426fb045db57a469eb0940a', name: "media" }))), h("div", { key: '257a35f56ec56079f06edd4af9ef8a785bf23ee0', class: "data-cell__content" }, hasLabel && (h("div", { key: '64b6fc162c07b8937f91787d238f132b282c8a96', class: "data-cell__label-wrapper" }, labelContent)), (hasContent || this.value || hasSuffix) && (h("div", { key: '96a8d037bc0cffdde98ff9202657d3ab45568adc', class: "data-cell__value-wrapper", role: "definition", "aria-labelledby": hasLabel ? labelId : undefined, id: valueId }, hasContent ? (h("div", { class: "data-cell__input" }, h("slot", { name: "content" }))) : (this.value && h("div", { class: "data-cell__value" }, this.value))))), hasSuffix && (h("div", { key: '1e1464e5d2b7cf193aae179330b29e72653b6589', class: "data-cell__suffix" }, h("slot", { key: '6e385ec659b10c2f0abd6730b6dcae8f67d0d942', name: "suffix" }))))));
|
|
48
52
|
}
|
|
49
53
|
get el() { return getElement(this); }
|
|
50
54
|
};
|
|
@@ -31,7 +31,7 @@ const SwirlModalShell = class {
|
|
|
31
31
|
this.setDialogCustomProps();
|
|
32
32
|
requestAnimationFrame(() => {
|
|
33
33
|
this.modalEl.showModal();
|
|
34
|
-
disableBodyScroll(this.
|
|
34
|
+
disableBodyScroll(this.scrollContainerEl);
|
|
35
35
|
this.isClosing = false;
|
|
36
36
|
});
|
|
37
37
|
}
|
|
@@ -39,7 +39,7 @@ const SwirlModalShell = class {
|
|
|
39
39
|
if (this.modalEl?.open) {
|
|
40
40
|
this.modalEl.close();
|
|
41
41
|
}
|
|
42
|
-
enableBodyScroll(this.
|
|
42
|
+
enableBodyScroll(this.scrollContainerEl);
|
|
43
43
|
}
|
|
44
44
|
async close() {
|
|
45
45
|
this.isClosing = true;
|
|
@@ -54,7 +54,7 @@ const SwirlModalShell = class {
|
|
|
54
54
|
const className = classnames("modal-shell", {
|
|
55
55
|
"modal-shell--closing": this.isClosing,
|
|
56
56
|
});
|
|
57
|
-
return (h(Host, { key: '
|
|
57
|
+
return (h(Host, { key: '040edfa9e8ab0bc22c1f653ceadada93809465be' }, h("dialog", { key: 'b9c9724d366b5a5ea6302451c87b05cd10a34293', "aria-label": this.label, class: className, onClose: this.onDialogClose, onKeyDown: this.onKeyDown, ref: (el) => (this.modalEl = el) }, h("div", { key: '3fcb9e41c72cc03e91414b779c4ed3b054e803dc', class: "modal-shell__backdrop" }), h("div", { key: '485fba3bc5aa2e96d15aa5fd3b22d74af522fe44', class: "modal-shell__scroll-container", onClick: this.onClose, ref: (el) => (this.scrollContainerEl = el) }, h("div", { key: '4f5421cee0190f021279e95f9e3f3c4c17473a14', class: "modal-shell__scroll-container__content", onClick: this.onContentClick }, h("slot", { key: '2c36d7f74b599b15fd2de8ae12b72a67fb05fb81' }))), h("swirl-button", { key: 'c0ac4350a2a79a0fc2c56472559aae562ebb429a', class: "modal-shell__close-button", icon: "<swirl-icon-close color='strong'></swirl-icon-close>", label: this.closeButtonLabel, hideLabel: true, variant: "translucent", onClick: this.onClose }))));
|
|
58
58
|
}
|
|
59
59
|
};
|
|
60
60
|
SwirlModalShell.style = swirlModalShellCss();
|
|
@@ -1562,6 +1562,7 @@ const SwirlShellLayout = class {
|
|
|
1562
1562
|
};
|
|
1563
1563
|
}
|
|
1564
1564
|
componentWillLoad() {
|
|
1565
|
+
console.warn('[Swirl] The "swirl-shell-layout" component is deprecated and will be removed in the next major release.');
|
|
1565
1566
|
this.isDesktopViewport = isDesktopViewport();
|
|
1566
1567
|
this.collectNavItems();
|
|
1567
1568
|
const restoredNavigationCollapseState = localStorage.getItem(NAVIGATION_COLLAPSE_STORAGE_KEY) === "true";
|
|
@@ -1672,24 +1673,24 @@ const SwirlShellLayout = class {
|
|
|
1672
1673
|
"shell-layout--mobile-navigation-active": this.mobileNavigationActive,
|
|
1673
1674
|
"shell-layout--navigation-collapsed": mainNavCollapsed,
|
|
1674
1675
|
});
|
|
1675
|
-
return (h(Host, { key: '
|
|
1676
|
+
return (h(Host, { key: '5f5458f6460183f2d6a2ce7bdc95ff5d160c0b6a' }, h("div", { key: '92d0471c277bf968adc8a8f4e9afc578288b53f2', class: className }, h("header", { key: 'dc249ffe59a95fbf9b90a79b2ac0e1d3aaf29b40', class: "shell-layout__header", "data-tauri-drag-region": "true" }, h("button", { key: 'f667bd28c24008ee31d66ae3920038099130fff1', class: "shell-layout__skip-link", onClick: this.skipLinkClick.emit, type: "button" }, this.skipLinkLabel), h("div", { key: 'b2f378e9d99b1e363da281962521163473553b82', class: "shell-layout__header-left" }, h("swirl-tooltip", { key: 'dc2b3b695738a372f03c79c0731466b085f2ebd8', content: this.navigationCollapsed
|
|
1676
1677
|
? this.expandNavigationButtonLabel
|
|
1677
|
-
: this.collapseNavigationButtonLabel, delay: 100, position: "right" }, h("button", { key: '
|
|
1678
|
+
: this.collapseNavigationButtonLabel, delay: 100, position: "right" }, h("button", { key: 'a02c4615e817b81522ccd440d222ff5b840775c1', class: "shell-layout__header-tool", onClick: this.onNavigationToggleClick, type: "button" }, this.navigationCollapsed ? (h("swirl-icon-dock-left-expand", { size: 20 })) : (h("swirl-icon-dock-left-collapse", { size: 20 })), h("swirl-visually-hidden", { key: 'd9b356e34b82b0acaa2c106350f249b4a2565c90' }, this.navigationCollapsed
|
|
1678
1679
|
? this.expandNavigationButtonLabel
|
|
1679
|
-
: this.collapseNavigationButtonLabel))), h("a", { key: '
|
|
1680
|
+
: this.collapseNavigationButtonLabel))), h("a", { key: '6986f46235298e58f35bd5ad31684eb2cfabe86d', class: "shell-layout__header-tool", onClick: this.historyBackClick.emit, href: "javascript:history.back()" }, h("swirl-icon-arrow-back", { key: 'f68f92c0821fd6b54b8341745cf558b334edd6f0', size: 20 }), h("swirl-visually-hidden", { key: '22801f633563ba275ebe088d2a4c341dda758544' }, this.browserBackButtonLabel)), h("a", { key: '02e4c396ccb4b076b9e1d5dd565bf3e5178cc7b5', class: "shell-layout__header-tool", onClick: this.historyForwardClick.emit, href: "javascript:history.forward()" }, h("swirl-icon-arrow-forward", { key: 'e1a884ed5b576ce45c36cd55be3f8301a9c25ab6', size: 20 }), h("swirl-visually-hidden", { key: '43e83f5f482f28003a57c25c27d337c62cd8ee64' }, this.browserForwardButtonLabel)), h("slot", { key: '6aa5a13fcdd924ccce93ed986dfa9cf44ca15441', name: "left-header-tools" })), h("div", { key: '7c98d9434eb3e5398aee3c9890fd3ebd9a97ec6d', class: "shell-layout__logo" }, h("slot", { key: '381b69009d83758713dcbaaef7ddbaf7408f5c3f', name: "logo" })), h("div", { key: '957cf5301164474a28ab07ad4b034ed364404a73', class: "shell-layout__header-right" }, h("slot", { key: '2db7f15807045fd66d9181aa0a382674d9d35ff5', name: "right-header-tools" }), h("slot", { key: 'b472d77a4420c68f93999ceeacf4bf7176c1072c', name: "avatar" }))), h("div", { key: '81e27f03e1c6d76fdd2754a0c8b33b2aa1126bc8', class: "shell-layout__mobile-nav-backdrop", onClick: this.onNavigationClick }), h("nav", { key: '308d981df11d92d1cfbe1bd1b421348a7fd0f81a', "aria-labelledby": "main-navigation-label", class: "shell-layout__nav", onClick: this.onNavigationClick, ref: (el) => (this.navElement = el) }, h("div", { key: 'facc60dce3cc42bf9ad138f096d00235694f01bc', class: "shell-layout__mobile-header" }, h("slot", { key: '6843ea436a024963dc0f58cd42fe23dee5cbca9e', name: "mobile-logo" }), h("div", { key: '85749821ec1fd9092b646d8f643886aca9f8f393', class: "shell-layout__mobile-header-tools" }, h("slot", { key: '5a30b7dfd62669531443761544477b4baeaf4a84', name: "mobile-header-tools" }), h("button", { key: '5340f5a188c5bcb98c63efa9ef3cda7b62e6b997', class: "shell-layout__header-tool", type: "button" }, h("swirl-icon-double-arrow-left", { key: '40db2029f3a81e828db27e890b52ce0d2805173c', size: 20 }), h("swirl-visually-hidden", { key: 'a25e358e0afc4027a0d52cbc1cf62df6a0719cc4' }, this.hideMobileNavigationButtonLabel)))), h("div", { key: 'a8b8a017a40a43f89c50f60c96bbbeb4d6181b3d', class: "shell-layout__nav-body" }, h("swirl-visually-hidden", { key: '1200560f555a2e11e7bed30697283ba660e8ea52' }, h("span", { key: 'a2a5c11b456c91b1fe4d006c05803829a633e3d5', id: "main-navigation-label" }, this.navigationLabel)), h("slot", { key: '55c3ec6a88c7e8986a7c94f4e751a4a899ffb457', name: "nav", onSlotchange: this.collectNavItems }), h("div", { key: '938ce0319668ed1aaee57cf435c5f8c8531d2114', class: "shell-layout__secondary-nav" }, h("swirl-separator", { key: '8da10296cd7d1857e7b62b89da62984814111022', color: "strong", spacing: "16" }), this.enableSecondaryNavGridLayout && (h("swirl-box", { key: 'bfec55992924ce4f0bab5ba5b99e7830a925d447', paddingBlockEnd: "16" }, h("swirl-stack", { key: 'e06da8582e4e41ccb8c210292f466233777a97f4', justify: mainNavCollapsed ? "center" : "space-between", orientation: "horizontal" }, h("swirl-button", { key: '1960f4768f22a6d6c8b7ef1aabcaa7b77e01a8be', hideLabel: mainNavCollapsed, icon: this.secondaryNavCollapsed
|
|
1680
1681
|
? "<swirl-icon-expand-more></swirl-icon-expand-more>"
|
|
1681
1682
|
: "<swirl-icon-expand-less></swirl-icon-expand-less>", label: this.secondaryNavCollapsed
|
|
1682
1683
|
? this.secondaryNavExpandLabel
|
|
1683
|
-
: this.secondaryNavCollapseLabel, onClick: this.toggleSecondaryNavCollapse, variant: "plain" }), !mainNavCollapsed && !this.secondaryNavCollapsed && (h("swirl-button", { key: '
|
|
1684
|
+
: this.secondaryNavCollapseLabel, onClick: this.toggleSecondaryNavCollapse, variant: "plain" }), !mainNavCollapsed && !this.secondaryNavCollapsed && (h("swirl-button", { key: '2fd6f3c41e1752103a32d59f152fad121e0a7ce1', icon: this.secondaryNavView === "grid"
|
|
1684
1685
|
? "<swirl-icon-menu></swirl-icon-menu>"
|
|
1685
1686
|
: "<swirl-icon-hamburger-menu></swirl-icon-hamburger-menu>", iconPosition: "end", label: this.secondaryNavView === "grid"
|
|
1686
1687
|
? this.gridNavLayoutToggleLabel
|
|
1687
|
-
: this.listNavLayoutToggleLabel, onClick: this.toggleSecondaryNavView, variant: "plain" }))))), h("div", { key: '
|
|
1688
|
+
: this.listNavLayoutToggleLabel, onClick: this.toggleSecondaryNavView, variant: "plain" }))))), h("div", { key: '542d6a0dbcb290a175d9d9d4e9eb0f8ec2462687', class: {
|
|
1688
1689
|
[`shell-layout__secondary-nav-items--${this.secondaryNavGridLayoutVariant}`]: true,
|
|
1689
1690
|
"shell-layout__secondary-nav-items": true,
|
|
1690
1691
|
"shell-layout__secondary-nav-items--grid-view": this.enableSecondaryNavGridLayout &&
|
|
1691
1692
|
this.secondaryNavView === "grid",
|
|
1692
|
-
} }, h("slot", { key: '
|
|
1693
|
+
} }, h("slot", { key: '55a2836a2dbb4b11e2dd49063e45db21941d1490', name: "secondary-nav", onSlotchange: this.collectNavItems }))))), h("main", { key: 'afa4d7ab3cadc90ddd89b11dbc84bb28acac4c41', class: "shell-layout__main", id: "main-content" }, h("slot", { key: '6beead6ae681df7cf8cff9734c5529668c975962' })))));
|
|
1693
1694
|
}
|
|
1694
1695
|
get el() { return getElement(this); }
|
|
1695
1696
|
static get watchers() { return {
|
|
@@ -13,6 +13,7 @@ const SwirlShellNavigationItem = class {
|
|
|
13
13
|
this.variant = "default";
|
|
14
14
|
}
|
|
15
15
|
componentWillLoad() {
|
|
16
|
+
console.warn('[Swirl] The "swirl-shell-navigation-item" component is deprecated and will be removed in the next major release.');
|
|
16
17
|
this.forceIconProps();
|
|
17
18
|
}
|
|
18
19
|
componentDidRender() {
|
|
@@ -62,9 +63,9 @@ const SwirlShellNavigationItem = class {
|
|
|
62
63
|
const tooltipContent = this.description
|
|
63
64
|
? `${this.label} ${this.description}`
|
|
64
65
|
: this.label;
|
|
65
|
-
return (h(Host, { key: '
|
|
66
|
+
return (h(Host, { key: 'aeac0acbbe7cd9c55c0b8d4d2821aa3918d05aa4' }, h("swirl-tooltip", { key: 'fbd93c62eb3fba3d3e49f2a46870a23f7ef09ffa', active: this.hideLabel, content: tooltipContent, delay: 100, position: "right" }, h(Tag, { key: '912601d126642c44f55a82886b0e5d74aa77e0b9', "aria-current": this.swirlAriaCurrent, class: tagClassNames, href: this.href, target: this.target, type: isLink ? undefined : "button", title: !this.hideLabel ? this.label : undefined }, h("span", { key: '88ff2c7cf186b1abf8d64a0e7a4df63dc0c559ef', class: "shell-navigation-item__icon" }, h("slot", { key: 'dfcf9b9382b959fac044b3790ecaf1b419e65937', name: "icon" })), !this.hideLabel ? (this.variant !== "default" ? (h("span", { class: labelClassNames }, this.label)) : (h("div", { class: "shell-navigation-item__text-wrapper" }, h("span", { class: labelClassNames }, this.label), this.description && (h("span", { class: "shell-navigation-item__description" }, this.description))))) : (h("swirl-visually-hidden", null, h("span", { class: labelClassNames }, this.label))), hasBadge && (h("span", { key: 'adea33c07e645202fc33b7d1463954caa4730e08', class: "shell-navigation-item__badge-wrapper" }, h("swirl-badge", { key: 'f92c9475d2f1060f0f3a2a2c30b9cea6d8e396df', "aria-label": this.badgeLabel, class: classnames("shell-navigation-item__badge", {
|
|
66
67
|
"shell-navigation-item__badge--dot": this.badgeLabel === "",
|
|
67
|
-
}), label: this.badgeLabel, size: "xs", variant: this.badgeLabel === "" ? "dot" : "default" }))), showIsNewTag && (h("swirl-tag", { key: '
|
|
68
|
+
}), label: this.badgeLabel, size: "xs", variant: this.badgeLabel === "" ? "dot" : "default" }))), showIsNewTag && (h("swirl-tag", { key: '4a3b80ead81bc32dcf84c958ed0ee9ed8f15f9b7', class: "shell-navigation-item__is-new-tag", intent: "info", label: this.markAsNewLabel.toLocaleUpperCase(), size: "s", variant: "strong" })), showIsNewBadge && (h("swirl-badge", { key: 'de9667d2fd1c275b108f1df7875b6df7a39af77c', class: "shell-navigation-item__is-new-badge", intent: "info", label: this.markAsNewLabel.toLocaleUpperCase(), size: "xs", variant: "dot" }))))));
|
|
68
69
|
}
|
|
69
70
|
get el() { return getElement(this); }
|
|
70
71
|
};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
import{r as a,c as e,h as l,a as t,d as i}from"./p-N0O_JBVJ.js";import{c}from"./p-orsBiyT_.js";import{v as s}from"./p-DD3477fe.js";const d=class{constructor(l){a(this,l),this.valueChange=e(this,"valueChange",7),this.intent="default",this.vertical=!1,this.elementId=`data-cell-${s()}`,this.handleRadioClick=a=>{const e=a.target,l=this.el.querySelector('swirl-radio[slot="content"]');if(e.contains(l)){const a=l?.querySelector('input[type="radio"]');a.click()}},this.handleClick=a=>{this.handleRadioClick(a),this.valueChange.emit(a)}}render(){const a=Boolean(this.el.querySelector('[slot="media"]')),e=Boolean(this.el.querySelector('[slot="suffix"]')),i=Boolean(this.label),s=Boolean(this.el.querySelector('[slot="content"]')),d=Boolean(this.el.querySelector('swirl-checkbox[slot="content"]')),r=Boolean(this.el.querySelector('swirl-radio[slot="content"]')),o=c("data-cell",{"data-cell--vertical":this.vertical,"data-cell--has-media":a,"data-cell--has-suffix":e,"data-cell--has-content":s,"data-cell--no-label":!i,"data-cell--interactive":d||r,[`data-cell--intent-${this.intent}`]:this.intent}),n=`${this.elementId}-label`,f=`${this.elementId}-value`,u="SWIRL-DATA-CELL-STACK"===this.el.parentElement?.tagName,b=u?"listitem":"group",p=d||r?"button":void 0,h=u&&!p?"group":p,v=l("swirl-stack",{key:"c0a4a14faad9ff0c649f8594ede3401bfaace84b",orientation:"horizontal",align:"center",spacing:"4"},l("span",{key:"b7a45482eaef7333e7a5b4e7b2a6d3a6f3bd45f5",class:"data-cell__label",id:n,role:"term"},this.label),this.tooltip&&l("swirl-tooltip",{key:"43cccb7abb557f481805cb7d2ff76a85353ded30",class:"data-cell__tooltip",content:this.tooltip,position:"right"},l("swirl-icon-info",{key:"0e5635708a0ea574c5afe38cde05cca227f52327",size:16,tabIndex:0})));return l(t,{key:"0b1e6388f330d36cbf7c8b40d91ff475a08a9f7d",role:b},l("div",{key:"f5bd2b0e7d38b7b879ddd7d7f9244772583b5d7e",class:o,part:"data-cell",onClick:d||r?this.handleClick:void 0,role:h,tabIndex:d||r?0:void 0},a&&l("div",{key:"338a5f743913eca6a97b8e9c75e9c5372ef5af67",class:"data-cell__media","aria-hidden":"true"},l("slot",{key:"9f30d751976bf5ee4426fb045db57a469eb0940a",name:"media"})),l("div",{key:"257a35f56ec56079f06edd4af9ef8a785bf23ee0",class:"data-cell__content"},i&&l("div",{key:"64b6fc162c07b8937f91787d238f132b282c8a96",class:"data-cell__label-wrapper"},v),(s||this.value||e)&&l("div",{key:"96a8d037bc0cffdde98ff9202657d3ab45568adc",class:"data-cell__value-wrapper",role:"definition","aria-labelledby":i?n:void 0,id:f},s?l("div",{class:"data-cell__input"},l("slot",{name:"content"})):this.value&&l("div",{class:"data-cell__value"},this.value))),e&&l("div",{key:"1e1464e5d2b7cf193aae179330b29e72653b6589",class:"data-cell__suffix"},l("slot",{key:"6e385ec659b10c2f0abd6730b6dcae8f67d0d942",name:"suffix"}))))}get el(){return i(this)}};d.style=":host{display:block;width:100%}:host *{box-sizing:border-box}.data-cell{display:flex;align-items:center;gap:var(--s-space-8);width:100%;padding:var(--s-space-12) var(--s-space-16);background-color:var(--s-surface-raised-50-default);border-radius:var(--swirl-data-cell-border-radius, var(--s-border-radius-l))}.data-cell--interactive{cursor:pointer}.data-cell--intent-default{background-color:var(--swirl-tag-background-default)}.data-cell--intent-info{background-color:var(--s-surface-info-subdued)}.data-cell--intent-critical{background-color:var(--s-surface-critical-subdued)}.data-cell--intent-warning{background-color:var(--s-surface-warning-subdued)}.data-cell--intent-success{background-color:var(--s-surface-success-subdued)}.data-cell--intent-special{background-color:var(--s-decorative-grape-surface-subdued)}.data-cell--intent-translucent{background-color:var(--s-surface-on-image-default)}.data-cell--vertical{align-items:center}.data-cell__media{flex-shrink:0;display:flex;align-items:center}.data-cell__media ::slotted(swirl-avatar){--swirl-avatar-background-color:var(--s-surface-default)}.data-cell__content{flex:1;min-width:0;display:flex;align-items:center;justify-content:space-between;gap:var(--s-space-24)}.data-cell--no-label .data-cell__content,.data-cell--no-label .data-cell__value-wrapper,.data-cell--no-label .data-cell__input{width:100%}.data-cell--vertical .data-cell__content{flex-direction:column;align-items:flex-start;gap:var(--s-space-4)}.data-cell__label-wrapper{flex-shrink:0;min-width:0}.data-cell:not(.data-cell--vertical) .data-cell__label-wrapper{width:calc(160px + var(--s-space-4) + 16px)}.data-cell__label{display:block;font-size:var(--s-font-size-sm);line-height:var(--s-line-height-sm);color:var(--s-text-subdued);font-weight:var(--s-font-weight-normal)}.data-cell:not(.data-cell--vertical) .data-cell__label{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:160px}.data-cell__tooltip swirl-icon-info{flex-shrink:0;color:var(--s-text-subdued)}.data-cell__value-wrapper{display:flex;align-items:center;gap:var(--s-space-4);flex-shrink:1;min-width:0}.data-cell--vertical .data-cell__value-wrapper{flex-direction:column;align-items:flex-start}.data-cell__value{flex:1;min-width:0;font-size:var(--s-font-size-sm);line-height:var(--s-line-height-sm);color:var(--s-text-default);font-weight:var(--s-font-weight-semibold);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.data-cell--vertical .data-cell__value{white-space:normal;overflow:visible;text-overflow:clip}.data-cell__suffix{flex-shrink:0}.data-cell__input{width:100%}.data-cell__input ::slotted(swirl-form-control){--swirl-form-control-label-background-color:var( --swirl-data-cell-input-background, var(--s-surface-default) )}.data-cell__input ::slotted(swirl-checkbox),.data-cell__input ::slotted(swirl-radio){width:100%}@media (max-width: 767px){.data-cell:not(.data-cell--vertical) .data-cell__content{flex-direction:column;align-items:flex-start;gap:var(--s-space-4)}.data-cell:not(.data-cell--vertical) .data-cell__value-wrapper{flex-direction:column;align-items:flex-start}}";export{d as swirl_data_cell}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
import{r as i,h as e,a,d as t}from"./p-N0O_JBVJ.js";import{c as l}from"./p-orsBiyT_.js";const n=class{constructor(e){i(this,e),this.hideLabel=!1,this.inlineLabelColor="default",this.markAsNewLabel="New",this.useCustomIconSize=!1,this.variant="default"}componentWillLoad(){console.warn('[Swirl] The "swirl-shell-navigation-item" component is deprecated and will be removed in the next major release.'),this.forceIconProps()}componentDidRender(){this.forceIconProps()}forceIconProps(){if(this.useCustomIconSize)return;const i=this.el.querySelector("[slot='icon']"),e=this.hideLabel&&"app-icon"===this.variant||"default"===this.variant;i&&(i.tagName.startsWith("SWIRL-ICON")||i.tagName.startsWith("SWIRL-EMOJI")||i.tagName.startsWith("SWIRL-SYMBOL"))&&i.setAttribute("size",e?"20":"32")}render(){const i=Boolean(this.el.querySelector("swirl-app-icon")),t=l("shell-navigation-item",`shell-navigation-item--${this.variant}`,{"shell-navigation-item--active":this.active,"shell-navigation-item--boxed":this.boxed,"shell-navigation-item--filled":this.filled,"shell-navigation-item--inline-label":this.inlineLabel,"shell-navigation-item--gradient":this.withGradient,"shell-navigation-item--hide-label":this.hideLabel,"shell-navigation-item--has-app-icon":i}),n=l("shell-navigation-item__label",{"shell-navigation-item__label--light":"light"===this.inlineLabelColor,"shell-navigation-item__label--dark":"dark"===this.inlineLabelColor,"shell-navigation-item__label--inline":this.inlineLabel}),s=null!=this.badgeLabel,o=!s&&this.markAsNew&&!this.hideLabel&&"default"===this.variant,r=!s&&this.markAsNew&&this.hideLabel&&"default"===this.variant,h=Boolean(this.href);return e(a,{key:"aeac0acbbe7cd9c55c0b8d4d2821aa3918d05aa4"},e("swirl-tooltip",{key:"fbd93c62eb3fba3d3e49f2a46870a23f7ef09ffa",active:this.hideLabel,content:this.description?`${this.label} ${this.description}`:this.label,delay:100,position:"right"},e(h?"a":"button",{key:"912601d126642c44f55a82886b0e5d74aa77e0b9","aria-current":this.swirlAriaCurrent,class:t,href:this.href,target:this.target,type:h?void 0:"button",title:this.hideLabel?void 0:this.label},e("span",{key:"88ff2c7cf186b1abf8d64a0e7a4df63dc0c559ef",class:"shell-navigation-item__icon"},e("slot",{key:"dfcf9b9382b959fac044b3790ecaf1b419e65937",name:"icon"})),this.hideLabel?e("swirl-visually-hidden",null,e("span",{class:n},this.label)):"default"!==this.variant?e("span",{class:n},this.label):e("div",{class:"shell-navigation-item__text-wrapper"},e("span",{class:n},this.label),this.description&&e("span",{class:"shell-navigation-item__description"},this.description)),s&&e("span",{key:"adea33c07e645202fc33b7d1463954caa4730e08",class:"shell-navigation-item__badge-wrapper"},e("swirl-badge",{key:"f92c9475d2f1060f0f3a2a2c30b9cea6d8e396df","aria-label":this.badgeLabel,class:l("shell-navigation-item__badge",{"shell-navigation-item__badge--dot":""===this.badgeLabel}),label:this.badgeLabel,size:"xs",variant:""===this.badgeLabel?"dot":"default"})),o&&e("swirl-tag",{key:"4a3b80ead81bc32dcf84c958ed0ee9ed8f15f9b7",class:"shell-navigation-item__is-new-tag",intent:"info",label:this.markAsNewLabel.toLocaleUpperCase(),size:"s",variant:"strong"}),r&&e("swirl-badge",{key:"de9667d2fd1c275b108f1df7875b6df7a39af77c",class:"shell-navigation-item__is-new-badge",intent:"info",label:this.markAsNewLabel.toLocaleUpperCase(),size:"xs",variant:"dot"}))))}get el(){return t(this)}};n.style=':host{display:inline-flex;width:100%}:host *{box-sizing:border-box}.shell-navigation-item{--swirl-app-icon-size:2rem;--swirl-shell-navigation-item-gradient:linear-gradient( rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.8) );position:relative;display:flex;width:100%;height:3rem;padding:var(--s-space-8);flex-shrink:0;justify-content:flex-start;align-items:center;border:none;border-radius:var(--s-border-radius-sm);color:var(--s-text-default);background-color:var(--s-surface-overlay-default);font:inherit;font-size:var(--s-font-size-sm);font-weight:var(--s-font-weight-medium);line-height:var(--s-line-height-sm);text-decoration:none;cursor:pointer;container-type:size;gap:var(--s-space-12)}.shell-navigation-item .shell-navigation-item__badge{--swirl-badge-border-color:var(--s-surface-overlay-default)}.shell-navigation-item:hover{background-color:var(--s-state-hovered)}.shell-navigation-item:hover .shell-navigation-item__badge,.shell-navigation-item:hover .shell-navigation-item__is-new-badge{--swirl-badge-border-color:var(--s-state-hovered)}.shell-navigation-item:active{background-color:var(--s-state-pressed)}.shell-navigation-item:active .shell-navigation-item__badge,.shell-navigation-item:active .shell-navigation-item__is-new-badge{--swirl-badge-border-color:var(--s-state-pressed)}.shell-navigation-item:focus{outline:none}.shell-navigation-item:focus-visible{z-index:1;box-shadow:0 0 0 0.125rem var(--s-focus-default)}.shell-navigation-item.shell-navigation-item--boxed{--swirl-app-icon-size:2rem}.shell-navigation-item.shell-navigation-item--boxed .shell-navigation-item__icon{overflow:hidden;border-radius:var(--s-border-radius-sm);background-color:var(--s-background-default);box-shadow:0 0 0 var(--s-border-width-default) var(--s-border-default)}.shell-navigation-item.shell-navigation-item--default.shell-navigation-item--filled .shell-navigation-item__icon{border-radius:var(--s-border-radius-sm);width:2rem;min-width:2rem;height:2rem;min-height:2rem}.shell-navigation-item.shell-navigation-item--filled{padding:var(--s-space-8)}.shell-navigation-item.shell-navigation-item--filled:not(.shell-navigation-item--has-app-icon) .shell-navigation-item__icon{color:var(--s-icon-on-action-primary);background-color:var(--s-action-primary-default)}.shell-navigation-item.shell-navigation-item--filled ::slotted(swirl-app-icon){position:inherit;width:100%;height:100%}.shell-navigation-item.shell-navigation-item--tiled{--swirl-app-icon-size:100%;height:auto;padding:0;align-items:start;border-radius:var(--s-border-radius-base);flex-direction:column;container-type:inline-size;gap:var(--s-space-8)}.shell-navigation-item.shell-navigation-item--tiled:hover{background-color:transparent}.shell-navigation-item.shell-navigation-item--tiled:hover .shell-navigation-item__label{text-decoration:underline}.shell-navigation-item.shell-navigation-item--tiled ::slotted(*){position:absolute;top:var(--s-space-12);left:var(--s-space-12)}.shell-navigation-item.shell-navigation-item--tiled ::slotted(swirl-app-icon){position:inherit;width:100%;height:100%}.shell-navigation-item.shell-navigation-item--tiled .shell-navigation-item__icon{overflow:hidden;width:100%;min-width:100%;height:auto;min-height:auto;border-radius:var(--s-border-radius-base);background-color:var(--s-state-hovered);aspect-ratio:1}.shell-navigation-item.shell-navigation-item--tiled.shell-navigation-item--gradient .shell-navigation-item__icon::after{position:absolute;display:inline-block;width:100%;border-radius:var(--s-border-radius-base);background-image:var(--swirl-shell-navigation-item-gradient);content:"";aspect-ratio:1}.shell-navigation-item.shell-navigation-item--tiled .shell-navigation-item__label{color:var(--s-text-default);font-weight:var(--s-font-weight-semibold);text-align:start}.shell-navigation-item.shell-navigation-item--tiled .shell-navigation-item__label--inline{position:absolute;bottom:var(--s-space-12);left:var(--s-space-12);margin-right:var(--s-space-12)}.shell-navigation-item.shell-navigation-item--tiled .shell-navigation-item__label--inline.shell-navigation-item__label--light{color:rgba(242, 242, 242, 1)}.shell-navigation-item.shell-navigation-item--tiled .shell-navigation-item__label--inline.shell-navigation-item__label--dark{color:rgb(25, 25, 25)}.shell-navigation-item.shell-navigation-item--app-icon{--swirl-app-icon-size:100%;font-size:var(--s-font-size-xs);padding:var(--s-space-8) var(--s-space-4);align-items:center;height:auto;border-radius:var(--s-border-radius-sm);flex-direction:column;container-type:inline-size;gap:var(--s-space-8)}.shell-navigation-item.shell-navigation-item--app-icon.shell-navigation-item--hide-label{align-items:start;padding:var(--s-space-8);--swirl-app-icon-size:2rem}.shell-navigation-item.shell-navigation-item--app-icon.shell-navigation-item--hide-label .shell-navigation-item__icon{border-radius:var(--s-border-radius-sm);max-width:2rem}.shell-navigation-item.shell-navigation-item--app-icon.shell-navigation-item--hide-label .shell-navigation-item__badge-wrapper{max-width:2rem;max-height:2rem}.shell-navigation-item.shell-navigation-item--app-icon .shell-navigation-item__icon{overflow:hidden;width:100%;max-width:3.5rem;height:auto;border-radius:var(--s-border-radius-base);color:var(--s-icon-on-action-primary);aspect-ratio:1}.shell-navigation-item.shell-navigation-item--app-icon .shell-navigation-item__badge-wrapper{max-width:3.5rem;max-height:3.5rem}.shell-navigation-item.shell-navigation-item--app-icon .shell-navigation-item__label{line-height:var(--s-line-height-xs);text-align:center}.shell-navigation-item.shell-navigation-item--app-icon .shell-navigation-item__badge-wrapper,.shell-navigation-item.shell-navigation-item--tiled .shell-navigation-item__badge-wrapper{position:absolute;width:100%;height:100%}.shell-navigation-item.shell-navigation-item--app-icon .shell-navigation-item__label,.shell-navigation-item.shell-navigation-item--tiled .shell-navigation-item__label{display:-webkit-box;overflow:hidden;white-space:normal;text-overflow:unset;overflow-wrap:anywhere;-webkit-line-clamp:2;-webkit-box-orient:vertical}.shell-navigation-item.shell-navigation-item--app-icon .shell-navigation-item__badge,.shell-navigation-item.shell-navigation-item--tiled .shell-navigation-item__badge{position:absolute;top:-0.375rem;right:-0.375rem;padding:var(--s-space-2)}.shell-navigation-item.shell-navigation-item--active{background-color:var(--s-state-hovered)}.shell-navigation-item.shell-navigation-item--active .shell-navigation-item__icon{color:var(--s-icon-highlight)}.shell-navigation-item.shell-navigation-item--active .shell-navigation-item__label{color:var(--s-text-highlight)}.shell-navigation-item.shell-navigation-item--active .shell-navigation-item__badge{--swirl-badge-border-color:var(--s-state-hovered)}.shell-navigation-item.shell-navigation-item--active:hover{background-color:var(--s-state-hovered)}.shell-navigation-item.shell-navigation-item--active:hover .shell-navigation-item__badge{--swirl-badge-border-color:var(--s-state-hovered)}.shell-navigation-item.shell-navigation-item--active:active{background-color:var(--s-state-pressed)}.shell-navigation-item.shell-navigation-item--active:active .shell-navigation-item__badge{--swirl-badge-border-color:var(--s-state-pressed)}@media (min-width: 992px){.shell-navigation-item{background-color:var(--s-surface-sunken-default)}.shell-navigation-item .shell-navigation-item__badge{--swirl-badge-border-color:var(--s-surface-sunken-default)}}.shell-navigation-item__icon{display:inline-flex;width:2rem;min-width:2rem;height:2rem;min-height:2rem;justify-content:center;align-items:center;overflow:hidden;border-radius:var(--s-border-radius-base)}.shell-navigation-item__text-wrapper{overflow:hidden;min-width:0;flex-grow:1;text-align:start;white-space:nowrap;text-overflow:ellipsis}.shell-navigation-item__description{margin-left:var(--s-space-8);font-weight:var(--s-font-weight-normal);color:var(--s-text-subdued)}.shell-navigation-item__badge{flex-shrink:0;--swirl-badge-border-color:var(--swirl-shell-background)}.shell-navigation-item__is-new-tag{flex-shrink:0}.shell-navigation-item__is-new-badge{position:absolute;top:0.625rem;right:0.625rem;flex-shrink:0;--swirl-badge-border-color:var(--swirl-shell-background)}@container (max-width: 4rem){.shell-navigation-item__badge{position:absolute;top:var(--s-space-4);right:var(--s-space-4);padding:var(--s-space-2)}.shell-navigation-item--gradient .shell-navigation-item__icon{--swirl-shell-navigation-item-gradient:none}.shell-navigation-item__badge--dot{top:var(--s-space-8);right:var(--s-space-8)}}@container (min-width: 10rem){.shell-navigation-item__badge--dot{padding-right:var(--s-space-4)}}';export{n as swirl_shell_navigation_item}
|
|
@@ -0,0 +1,11 @@
|
|
|
1
|
+
import{r as e,c as l,h as a,a as t,d as o}from"./p-N0O_JBVJ.js";import{c as s}from"./p-orsBiyT_.js";import{r as i}from"./p-CCck-DTo.js";
|
|
2
|
+
/*!
|
|
3
|
+
* tabbable 6.2.0
|
|
4
|
+
* @license MIT, https://github.com/focus-trap/tabbable/blob/master/LICENSE
|
|
5
|
+
*/
|
|
6
|
+
var r=["input:not([inert])","select:not([inert])","textarea:not([inert])","a[href]:not([inert])","button:not([inert])","[tabindex]:not(slot):not([inert])","audio[controls]:not([inert])","video[controls]:not([inert])",'[contenteditable]:not([contenteditable="false"]):not([inert])',"details>summary:first-of-type:not([inert])","details:not([inert])"],n=r.join(","),c="undefined"==typeof Element,u=c?function(){}:Element.prototype.matches||Element.prototype.msMatchesSelector||Element.prototype.webkitMatchesSelector,d=!c&&Element.prototype.getRootNode?function(e){var l;return null==e||null===(l=e.getRootNode)||void 0===l?void 0:l.call(e)}:function(e){return null==e?void 0:e.ownerDocument},h=function e(l,a){var t;void 0===a&&(a=!0);var o=null==l||null===(t=l.getAttribute)||void 0===t?void 0:t.call(l,"inert");return""===o||"true"===o||a&&l&&e(l.parentNode)},f=function(e,l,a){if(h(e))return[];var t=Array.prototype.slice.apply(e.querySelectorAll(n));return l&&u.call(e,n)&&t.unshift(e),t.filter(a)},y=function e(l,a,t){for(var o=[],s=Array.from(l);s.length;){var i=s.shift();if(!h(i,!1))if("SLOT"===i.tagName){var r=i.assignedElements(),c=e(r.length?r:i.children,!0,t);t.flatten?o.push.apply(o,c):o.push({scopeParent:i,candidates:c})}else{u.call(i,n)&&t.filter(i)&&(a||!l.includes(i))&&o.push(i);var d=i.shadowRoot||"function"==typeof t.getShadowRoot&&t.getShadowRoot(i),f=!h(d,!1)&&(!t.shadowRootFilter||t.shadowRootFilter(i));if(d&&f){var y=e(!0===d?i.children:d.children,!0,t);t.flatten?o.push.apply(o,y):o.push({scopeParent:i,candidates:y})}else s.unshift.apply(s,i.children)}}return o},v=function(e){return!isNaN(parseInt(e.getAttribute("tabindex"),10))},b=function(e){if(!e)throw new Error("No node provided");return e.tabIndex<0&&(/^(AUDIO|VIDEO|DETAILS)$/.test(e.tagName)||function(e){var l,a=null==e||null===(l=e.getAttribute)||void 0===l?void 0:l.call(e,"contenteditable");return""===a||"true"===a}(e))&&!v(e)?0:e.tabIndex},p=function(e,l){return e.tabIndex===l.tabIndex?e.documentOrder-l.documentOrder:e.tabIndex-l.tabIndex},w=function(e){return"INPUT"===e.tagName},m=function(e){var l=e.getBoundingClientRect();return 0===l.width&&0===l.height},g=function(e,l){return!(l.disabled||h(l)||function(e){return w(e)&&"hidden"===e.type}(l)||function(e,l){var a=l.displayCheck,t=l.getShadowRoot;if("hidden"===getComputedStyle(e).visibility)return!0;var o=u.call(e,"details>summary:first-of-type");if(u.call(o?e.parentElement:e,"details:not([open]) *"))return!0;if(a&&"full"!==a&&"legacy-full"!==a){if("non-zero-area"===a)return m(e)}else{if("function"==typeof t){for(var s=e;e;){var i=e.parentElement,r=d(e);if(i&&!i.shadowRoot&&!0===t(i))return m(e);e=e.assignedSlot?e.assignedSlot:i||r===e.ownerDocument?i:r.host}e=s}if(function(e){var l,a,t,o,s=e&&d(e),i=null===(l=s)||void 0===l?void 0:l.host,r=!1;if(s&&s!==e)for(r=!!(null!==(a=i)&&void 0!==a&&null!==(t=a.ownerDocument)&&void 0!==t&&t.contains(i)||null!=e&&null!==(o=e.ownerDocument)&&void 0!==o&&o.contains(e));!r&&i;){var n,c,u;r=!(null===(c=i=null===(n=s=d(i))||void 0===n?void 0:n.host)||void 0===c||null===(u=c.ownerDocument)||void 0===u||!u.contains(i))}return r}(e))return!e.getClientRects().length;if("legacy-full"!==a)return!0}return!1}(l,e)||function(e){return"DETAILS"===e.tagName&&Array.prototype.slice.apply(e.children).some((function(e){return"SUMMARY"===e.tagName}))}(l)||function(e){if(/^(INPUT|BUTTON|SELECT|TEXTAREA)$/.test(e.tagName))for(var l=e.parentElement;l;){if("FIELDSET"===l.tagName&&l.disabled){for(var a=0;a<l.children.length;a++){var t=l.children.item(a);if("LEGEND"===t.tagName)return!!u.call(l,"fieldset[disabled] *")||!t.contains(e)}return!0}l=l.parentElement}return!1}(l))},_=function(e,l){return!(function(e){return function(e){return w(e)&&"radio"===e.type}(e)&&!function(e){if(!e.name)return!0;var l,a=e.form||d(e),t=function(e){return a.querySelectorAll('input[type="radio"][name="'+e+'"]')};if("undefined"!=typeof window&&void 0!==window.CSS&&"function"==typeof window.CSS.escape)l=t(window.CSS.escape(e.name));else try{l=t(e.name)}catch(e){return console.error("Looks like you have a radio button with a name attribute containing invalid CSS selector characters and need the CSS.escape polyfill: %s",e.message),!1}var o=function(e,l){for(var a=0;a<e.length;a++)if(e[a].checked&&e[a].form===l)return e[a]}(l,e.form);return!o||o===e}(e)}(l)||b(l)<0||!g(e,l))},k=function(e){var l=parseInt(e.getAttribute("tabindex"),10);return!!(isNaN(l)||l>=0)},x=function e(l){var a=[],t=[];return l.forEach((function(l,o){var s=!!l.scopeParent,i=s?l.scopeParent:l,r=function(e,l){var a=b(e);return a<0&&l&&!v(e)?0:a}(i,s),n=s?e(l.candidates):i;0===r?s?a.push.apply(a,n):a.push(i):t.push({documentOrder:o,tabIndex:r,item:l,isScope:s,content:n})})),t.sort(p).reduce((function(e,l){return l.isScope?e.push.apply(e,l.content):e.push(l.content),e}),[]).concat(a)},S=function(e,l){if(l=l||{},!e)throw new Error("No node provided");return!1!==u.call(e,n)&&_(l,e)},E=r.concat("iframe").join(","),N=function(e,l){if(l=l||{},!e)throw new Error("No node provided");return!1!==u.call(e,E)&&g(l,e)};
|
|
7
|
+
/*!
|
|
8
|
+
* focus-trap 7.5.4
|
|
9
|
+
* @license MIT, https://github.com/focus-trap/focus-trap/blob/master/LICENSE
|
|
10
|
+
*/
|
|
11
|
+
function T(e,l){var a=Object.keys(e);if(Object.getOwnPropertySymbols){var t=Object.getOwnPropertySymbols(e);l&&(t=t.filter((function(l){return Object.getOwnPropertyDescriptor(e,l).enumerable}))),a.push.apply(a,t)}return a}function A(e){for(var l=1;l<arguments.length;l++){var a=null!=arguments[l]?arguments[l]:{};l%2?T(Object(a),!0).forEach((function(l){var t,o,s;t=e,s=a[l],(o=function(e){var l=function(e,l){if("object"!=typeof e||null===e)return e;var a=e[Symbol.toPrimitive];if(void 0!==a){var t=a.call(e,l);if("object"!=typeof t)return t;throw new TypeError("@@toPrimitive must return a primitive value.")}return String(e)}(e,"string");return"symbol"==typeof l?l:String(l)}(o=l))in t?Object.defineProperty(t,o,{value:s,enumerable:!0,configurable:!0,writable:!0}):t[o]=s})):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(a)):T(Object(a)).forEach((function(l){Object.defineProperty(e,l,Object.getOwnPropertyDescriptor(a,l))}))}return e}var C=function(e){return"Tab"===(null==e?void 0:e.key)||9===(null==e?void 0:e.keyCode)},O=function(e){return C(e)&&!e.shiftKey},L=function(e){return C(e)&&e.shiftKey},j=function(e){return setTimeout(e,0)},I=function(e,l){var a=-1;return e.every((function(e,t){return!l(e)||(a=t,!1)})),a},D=function(e){for(var l=arguments.length,a=new Array(l>1?l-1:0),t=1;t<l;t++)a[t-1]=arguments[t];return"function"==typeof e?e.apply(void 0,a):e},F=function(e){return e.target.shadowRoot&&"function"==typeof e.composedPath?e.composedPath()[0]:e.target},R=[],P=function(e,l){var a,t=(null==l?void 0:l.document)||document,o=(null==l?void 0:l.trapStack)||R,s=A({returnFocusOnDeactivate:!0,escapeDeactivates:!0,delayInitialFocus:!0,isKeyForward:O,isKeyBackward:L},l),i={containers:[],containerGroups:[],tabbableGroups:[],nodeFocusedBeforeActivation:null,mostRecentlyFocusedNode:null,active:!1,paused:!1,delayInitialFocusTimer:void 0,recentNavEvent:void 0},r=function(e,l,a){return e&&void 0!==e[l]?e[l]:s[a||l]},n=function(e,l){var a="function"==typeof(null==l?void 0:l.composedPath)?l.composedPath():void 0;return i.containerGroups.findIndex((function(l){var t=l.container,o=l.tabbableNodes;return t.contains(e)||(null==a?void 0:a.includes(t))||o.find((function(l){return l===e}))}))},c=function(e){var l=s[e];if("function"==typeof l){for(var a=arguments.length,o=new Array(a>1?a-1:0),i=1;i<a;i++)o[i-1]=arguments[i];l=l.apply(void 0,o)}if(!0===l&&(l=void 0),!l){if(void 0===l||!1===l)return l;throw new Error("`".concat(e,"` was specified but was not a node, or did not return a node"))}var r=l;if("string"==typeof l&&!(r=t.querySelector(l)))throw new Error("`".concat(e,"` as selector refers to no known node"));return r},u=function(){var e=c("initialFocus");if(!1===e)return!1;if(void 0===e||!N(e,s.tabbableOptions))if(n(t.activeElement)>=0)e=t.activeElement;else{var l=i.tabbableGroups[0];e=l&&l.firstTabbableNode||c("fallbackFocus")}if(!e)throw new Error("Your focus-trap needs to have at least one focusable element");return e},d=function(){if(i.containerGroups=i.containers.map((function(e){var l=function(e,l){var a;return a=(l=l||{}).getShadowRoot?y([e],l.includeContainer,{filter:_.bind(null,l),flatten:!1,getShadowRoot:l.getShadowRoot,shadowRootFilter:k}):f(e,l.includeContainer,_.bind(null,l)),x(a)}(e,s.tabbableOptions),a=function(e,l){return(l=l||{}).getShadowRoot?y([e],l.includeContainer,{filter:g.bind(null,l),flatten:!0,getShadowRoot:l.getShadowRoot}):f(e,l.includeContainer,g.bind(null,l))}(e,s.tabbableOptions),t=l.length>0?l[0]:void 0,o=l.length>0?l[l.length-1]:void 0,i=a.find((function(e){return S(e)})),r=a.slice().reverse().find((function(e){return S(e)})),n=!!l.find((function(e){return b(e)>0}));return{container:e,tabbableNodes:l,focusableNodes:a,posTabIndexesFound:n,firstTabbableNode:t,lastTabbableNode:o,firstDomTabbableNode:i,lastDomTabbableNode:r,nextTabbableNode:function(e){var t=!(arguments.length>1&&void 0!==arguments[1])||arguments[1],o=l.indexOf(e);return o<0?t?a.slice(a.indexOf(e)+1).find((function(e){return S(e)})):a.slice(0,a.indexOf(e)).reverse().find((function(e){return S(e)})):l[o+(t?1:-1)]}}})),i.tabbableGroups=i.containerGroups.filter((function(e){return e.tabbableNodes.length>0})),i.tabbableGroups.length<=0&&!c("fallbackFocus"))throw new Error("Your focus-trap must have at least one container with at least one tabbable node in it at all times");if(i.containerGroups.find((function(e){return e.posTabIndexesFound}))&&i.containerGroups.length>1)throw new Error("At least one node with a positive tabindex was found in one of your focus-trap's multiple containers. Positive tabindexes are only supported in single-container focus-traps.")},h=function e(l){var a=l.activeElement;if(a)return a.shadowRoot&&null!==a.shadowRoot.activeElement?e(a.shadowRoot):a},v=function e(l){!1!==l&&l!==h(document)&&(l&&l.focus?(l.focus({preventScroll:!!s.preventScroll}),i.mostRecentlyFocusedNode=l,function(e){return e.tagName&&"input"===e.tagName.toLowerCase()&&"function"==typeof e.select}(l)&&l.select()):e(u()))},p=function(e){var l=c("setReturnFocus",e);return l||!1!==l&&e},w=function(e){var l=e.target,a=e.event,t=e.isBackward,o=void 0!==t&&t;l=l||F(a),d();var r=null;if(i.tabbableGroups.length>0){var u=n(l,a),h=u>=0?i.containerGroups[u]:void 0;if(u<0)r=o?i.tabbableGroups[i.tabbableGroups.length-1].lastTabbableNode:i.tabbableGroups[0].firstTabbableNode;else if(o){var f=I(i.tabbableGroups,(function(e){return l===e.firstTabbableNode}));if(f<0&&(h.container===l||N(l,s.tabbableOptions)&&!S(l,s.tabbableOptions)&&!h.nextTabbableNode(l,!1))&&(f=u),f>=0){var y=i.tabbableGroups[0===f?i.tabbableGroups.length-1:f-1];r=b(l)>=0?y.lastTabbableNode:y.lastDomTabbableNode}else C(a)||(r=h.nextTabbableNode(l,!1))}else{var v=I(i.tabbableGroups,(function(e){return l===e.lastTabbableNode}));if(v<0&&(h.container===l||N(l,s.tabbableOptions)&&!S(l,s.tabbableOptions)&&!h.nextTabbableNode(l))&&(v=u),v>=0){var p=i.tabbableGroups[v===i.tabbableGroups.length-1?0:v+1];r=b(l)>=0?p.firstTabbableNode:p.firstDomTabbableNode}else C(a)||(r=h.nextTabbableNode(l))}}else r=c("fallbackFocus");return r},m=function(e){var l=F(e);n(l,e)>=0||(D(s.clickOutsideDeactivates,e)?a.deactivate({returnFocus:s.returnFocusOnDeactivate}):D(s.allowOutsideClick,e)||e.preventDefault())},E=function(e){var l=F(e),a=n(l,e)>=0;if(a||l instanceof Document)a&&(i.mostRecentlyFocusedNode=l);else{var t;e.stopImmediatePropagation();var o=!0;if(i.mostRecentlyFocusedNode)if(b(i.mostRecentlyFocusedNode)>0){var r=n(i.mostRecentlyFocusedNode),c=i.containerGroups[r].tabbableNodes;if(c.length>0){var d=c.findIndex((function(e){return e===i.mostRecentlyFocusedNode}));d>=0&&(s.isKeyForward(i.recentNavEvent)?d+1<c.length&&(t=c[d+1],o=!1):d-1>=0&&(t=c[d-1],o=!1))}}else i.containerGroups.some((function(e){return e.tabbableNodes.some((function(e){return b(e)>0}))}))||(o=!1);else o=!1;o&&(t=w({target:i.mostRecentlyFocusedNode,isBackward:s.isKeyBackward(i.recentNavEvent)})),v(t||i.mostRecentlyFocusedNode||u())}i.recentNavEvent=void 0},T=function(e){if(("Escape"===(null==(l=e)?void 0:l.key)||"Esc"===(null==l?void 0:l.key)||27===(null==l?void 0:l.keyCode))&&!1!==D(s.escapeDeactivates,e))return e.preventDefault(),void a.deactivate();var l;(s.isKeyForward(e)||s.isKeyBackward(e))&&function(e){var l=arguments.length>1&&void 0!==arguments[1]&&arguments[1];i.recentNavEvent=e;var a=w({event:e,isBackward:l});a&&(C(e)&&e.preventDefault(),v(a))}(e,s.isKeyBackward(e))},P=function(e){var l=F(e);n(l,e)>=0||D(s.clickOutsideDeactivates,e)||D(s.allowOutsideClick,e)||(e.preventDefault(),e.stopImmediatePropagation())},z=function(){if(i.active)return function(e,l){if(e.length>0){var a=e[e.length-1];a!==l&&a.pause()}var t=e.indexOf(l);-1===t||e.splice(t,1),e.push(l)}(o,a),i.delayInitialFocusTimer=s.delayInitialFocus?j((function(){v(u())})):v(u()),t.addEventListener("focusin",E,!0),t.addEventListener("mousedown",m,{capture:!0,passive:!1}),t.addEventListener("touchstart",m,{capture:!0,passive:!1}),t.addEventListener("click",P,{capture:!0,passive:!1}),t.addEventListener("keydown",T,{capture:!0,passive:!1}),a},B=function(){if(i.active)return t.removeEventListener("focusin",E,!0),t.removeEventListener("mousedown",m,!0),t.removeEventListener("touchstart",m,!0),t.removeEventListener("click",P,!0),t.removeEventListener("keydown",T,!0),a},G="undefined"!=typeof window&&"MutationObserver"in window?new MutationObserver((function(e){e.some((function(e){return Array.from(e.removedNodes).some((function(e){return e===i.mostRecentlyFocusedNode}))}))&&v(u())})):void 0,M=function(){G&&(G.disconnect(),i.active&&!i.paused&&i.containers.map((function(e){G.observe(e,{subtree:!0,childList:!0})})))};return(a={get active(){return i.active},get paused(){return i.paused},activate:function(e){if(i.active)return this;var l=r(e,"onActivate"),a=r(e,"onPostActivate"),o=r(e,"checkCanFocusTrap");o||d(),i.active=!0,i.paused=!1,i.nodeFocusedBeforeActivation=t.activeElement,null==l||l();var s=function(){o&&d(),z(),M(),null==a||a()};return o?(o(i.containers.concat()).then(s,s),this):(s(),this)},deactivate:function(e){if(!i.active)return this;var l=A({onDeactivate:s.onDeactivate,onPostDeactivate:s.onPostDeactivate,checkCanReturnFocus:s.checkCanReturnFocus},e);clearTimeout(i.delayInitialFocusTimer),i.delayInitialFocusTimer=void 0,B(),i.active=!1,i.paused=!1,M(),function(e,l){var a=e.indexOf(l);-1!==a&&e.splice(a,1),e.length>0&&e[e.length-1].unpause()}(o,a);var t=r(l,"onDeactivate"),n=r(l,"onPostDeactivate"),c=r(l,"checkCanReturnFocus"),u=r(l,"returnFocus","returnFocusOnDeactivate");null==t||t();var d=function(){j((function(){u&&v(p(i.nodeFocusedBeforeActivation)),null==n||n()}))};return u&&c?(c(p(i.nodeFocusedBeforeActivation)).then(d,d),this):(d(),this)},pause:function(e){if(i.paused||!i.active)return this;var l=r(e,"onPause"),a=r(e,"onPostPause");return i.paused=!0,null==l||l(),B(),M(),null==a||a(),this},unpause:function(e){if(!i.paused||!i.active)return this;var l=r(e,"onUnpause"),a=r(e,"onPostUnpause");return i.paused=!1,null==l||l(),d(),z(),M(),null==a||a(),this},updateContainerElements:function(e){var l=[].concat(e).filter(Boolean);return i.containers=l.map((function(e){return"string"==typeof e?t.querySelector(e):e})),i.active&&d(),M(),this}}).updateContainerElements(e),a};const z="SWIRL_SHELL_SECONDARY_NAVIGATION_COLLAPSE_STATE",B="SWIRL_SHELL_SECONDARY_NAVIGATION_VIEW_STATE",G="SWIRL_SHELL_NAVIGATION_COLLAPSE_STATE",M=class{constructor(a){e(this,a),this.historyBackClick=l(this,"historyBackClick",7),this.historyForwardClick=l(this,"historyForwardClick",7),this.skipLinkClick=l(this,"skipLinkClick",7),this.browserBackButtonLabel="Navigate back",this.browserForwardButtonLabel="Navigate forward",this.collapseNavigationButtonLabel="Collapse navigation",this.enableSecondaryNavGridLayout=!0,this.secondaryNavGridLayoutVariant="tiled",this.expandNavigationButtonLabel="Expand navigation",this.gridNavLayoutToggleLabel="Grid",this.hideMobileNavigationButtonLabel="Close navigation",this.listNavLayoutToggleLabel="List",this.navigationLabel="Main",this.secondaryNavCollapseLabel="Show less",this.secondaryNavExpandLabel="Show more",this.skipLinkLabel="Skip to main content",this.isDesktopViewport=!0,this.secondaryNavView="list",this.collectNavItems=()=>{this.mainNavItems=Array.from(this.el.querySelectorAll("swirl-shell-navigation-item[slot='nav'], [slot='nav'] swirl-shell-navigation-item")),this.secondaryNavItems=Array.from(this.el.querySelectorAll("swirl-shell-navigation-item[slot='secondary-nav'], [slot='secondary-nav'] swirl-shell-navigation-item")),this.toggleNavItemLabels(),this.setSecondaryNavItemsTiled()},this.toggleSecondaryNavView=e=>{e.stopPropagation(),this.secondaryNavView="grid"===this.secondaryNavView?"list":"grid",this.setSecondaryNavItemsTiled(),localStorage.setItem(B,String(this.secondaryNavView))},this.toggleSecondaryNavCollapse=e=>{e.stopPropagation(),this.secondaryNavCollapsed=!this.secondaryNavCollapsed,localStorage.setItem(z,String(this.secondaryNavCollapsed))},this.onNavigationToggleClick=()=>{this.navigationCollapsed=!this.navigationCollapsed},this.onNavigationClick=()=>{this.hideMobileNavigation()}}componentWillLoad(){console.warn('[Swirl] The "swirl-shell-layout" component is deprecated and will be removed in the next major release.'),this.isDesktopViewport=i(),this.collectNavItems();const e="true"===localStorage.getItem(G);this.navigationCollapsed=e,this.restoreSecondaryNavState()}componentDidLoad(){this.focusTrap=P(this.navElement,{allowOutsideClick:!0,tabbableOptions:{getShadowRoot:e=>e.shadowRoot}}),this.collectNavItems(),this.navMutationObserver=new MutationObserver((()=>{this.collectNavItems()})),this.navMutationObserver.observe(this.navElement,{childList:!0,subtree:!0})}componentDidRender(){this.focusTrap?.updateContainerElements(this.navElement)}disconnectedCallback(){this.focusTrap?.deactivate(),this.navMutationObserver?.disconnect()}onWindowKeyDown(e){"Escape"===e.key&&this.mobileNavigationActive&&this.hideMobileNavigation()}watchEnableSecondaryNavGridLayout(){this.restoreSecondaryNavState()}watchMobileNavigationState(){this.mobileNavigationActive?setTimeout((()=>{this.focusTrap.activate()}),200):this.focusTrap.deactivate()}watchNavigationCollapsed(){localStorage.setItem(G,String(this.navigationCollapsed)),this.toggleNavItemLabels(),this.setSecondaryNavItemsTiled()}onWindowResize(){this.isDesktopViewport!==i()&&(this.isDesktopViewport=i(),this.collectNavItems())}async showMobileNavigation(){this.mobileNavigationActive=!0,this.collectNavItems()}async hideMobileNavigation(){this.mobileNavigationActive=!1,this.toggleNavItemLabels()}toggleNavItemLabels(){[...this.secondaryNavItems,...this.mainNavItems].forEach((e=>{e.hideLabel=this.navigationCollapsed&&this.isDesktopViewport}))}setSecondaryNavItemsTiled(){this.secondaryNavItems.forEach((e=>{e.variant=this.enableSecondaryNavGridLayout&&("grid"===this.secondaryNavView||this.navigationCollapsed&&this.isDesktopViewport)?this.secondaryNavGridLayoutVariant:"default"}))}restoreSecondaryNavState(){if(this.enableSecondaryNavGridLayout){const e="true"===localStorage.getItem(z);this.secondaryNavCollapsed=e;const l=localStorage.getItem(B);this.secondaryNavView=l}}render(){const e=this.navigationCollapsed&&this.isDesktopViewport,l=Boolean(this.el.querySelector("[slot='secondary-nav']")),o=s("shell-layout",{"shell-layout--branded-header":this.brandedHeader,"shell-layout--secondary-nav-collapsed":this.secondaryNavCollapsed,"shell-layout--has-secondary-nav":l,"shell-layout--mobile-navigation-active":this.mobileNavigationActive,"shell-layout--navigation-collapsed":e});return a(t,{key:"5f5458f6460183f2d6a2ce7bdc95ff5d160c0b6a"},a("div",{key:"92d0471c277bf968adc8a8f4e9afc578288b53f2",class:o},a("header",{key:"dc249ffe59a95fbf9b90a79b2ac0e1d3aaf29b40",class:"shell-layout__header","data-tauri-drag-region":"true"},a("button",{key:"f667bd28c24008ee31d66ae3920038099130fff1",class:"shell-layout__skip-link",onClick:this.skipLinkClick.emit,type:"button"},this.skipLinkLabel),a("div",{key:"b2f378e9d99b1e363da281962521163473553b82",class:"shell-layout__header-left"},a("swirl-tooltip",{key:"dc2b3b695738a372f03c79c0731466b085f2ebd8",content:this.navigationCollapsed?this.expandNavigationButtonLabel:this.collapseNavigationButtonLabel,delay:100,position:"right"},a("button",{key:"a02c4615e817b81522ccd440d222ff5b840775c1",class:"shell-layout__header-tool",onClick:this.onNavigationToggleClick,type:"button"},a(this.navigationCollapsed?"swirl-icon-dock-left-expand":"swirl-icon-dock-left-collapse",{size:20}),a("swirl-visually-hidden",{key:"d9b356e34b82b0acaa2c106350f249b4a2565c90"},this.navigationCollapsed?this.expandNavigationButtonLabel:this.collapseNavigationButtonLabel))),a("a",{key:"6986f46235298e58f35bd5ad31684eb2cfabe86d",class:"shell-layout__header-tool",onClick:this.historyBackClick.emit,href:"javascript:history.back()"},a("swirl-icon-arrow-back",{key:"f68f92c0821fd6b54b8341745cf558b334edd6f0",size:20}),a("swirl-visually-hidden",{key:"22801f633563ba275ebe088d2a4c341dda758544"},this.browserBackButtonLabel)),a("a",{key:"02e4c396ccb4b076b9e1d5dd565bf3e5178cc7b5",class:"shell-layout__header-tool",onClick:this.historyForwardClick.emit,href:"javascript:history.forward()"},a("swirl-icon-arrow-forward",{key:"e1a884ed5b576ce45c36cd55be3f8301a9c25ab6",size:20}),a("swirl-visually-hidden",{key:"43e83f5f482f28003a57c25c27d337c62cd8ee64"},this.browserForwardButtonLabel)),a("slot",{key:"6aa5a13fcdd924ccce93ed986dfa9cf44ca15441",name:"left-header-tools"})),a("div",{key:"7c98d9434eb3e5398aee3c9890fd3ebd9a97ec6d",class:"shell-layout__logo"},a("slot",{key:"381b69009d83758713dcbaaef7ddbaf7408f5c3f",name:"logo"})),a("div",{key:"957cf5301164474a28ab07ad4b034ed364404a73",class:"shell-layout__header-right"},a("slot",{key:"2db7f15807045fd66d9181aa0a382674d9d35ff5",name:"right-header-tools"}),a("slot",{key:"b472d77a4420c68f93999ceeacf4bf7176c1072c",name:"avatar"}))),a("div",{key:"81e27f03e1c6d76fdd2754a0c8b33b2aa1126bc8",class:"shell-layout__mobile-nav-backdrop",onClick:this.onNavigationClick}),a("nav",{key:"308d981df11d92d1cfbe1bd1b421348a7fd0f81a","aria-labelledby":"main-navigation-label",class:"shell-layout__nav",onClick:this.onNavigationClick,ref:e=>this.navElement=e},a("div",{key:"facc60dce3cc42bf9ad138f096d00235694f01bc",class:"shell-layout__mobile-header"},a("slot",{key:"6843ea436a024963dc0f58cd42fe23dee5cbca9e",name:"mobile-logo"}),a("div",{key:"85749821ec1fd9092b646d8f643886aca9f8f393",class:"shell-layout__mobile-header-tools"},a("slot",{key:"5a30b7dfd62669531443761544477b4baeaf4a84",name:"mobile-header-tools"}),a("button",{key:"5340f5a188c5bcb98c63efa9ef3cda7b62e6b997",class:"shell-layout__header-tool",type:"button"},a("swirl-icon-double-arrow-left",{key:"40db2029f3a81e828db27e890b52ce0d2805173c",size:20}),a("swirl-visually-hidden",{key:"a25e358e0afc4027a0d52cbc1cf62df6a0719cc4"},this.hideMobileNavigationButtonLabel)))),a("div",{key:"a8b8a017a40a43f89c50f60c96bbbeb4d6181b3d",class:"shell-layout__nav-body"},a("swirl-visually-hidden",{key:"1200560f555a2e11e7bed30697283ba660e8ea52"},a("span",{key:"a2a5c11b456c91b1fe4d006c05803829a633e3d5",id:"main-navigation-label"},this.navigationLabel)),a("slot",{key:"55c3ec6a88c7e8986a7c94f4e751a4a899ffb457",name:"nav",onSlotchange:this.collectNavItems}),a("div",{key:"938ce0319668ed1aaee57cf435c5f8c8531d2114",class:"shell-layout__secondary-nav"},a("swirl-separator",{key:"8da10296cd7d1857e7b62b89da62984814111022",color:"strong",spacing:"16"}),this.enableSecondaryNavGridLayout&&a("swirl-box",{key:"bfec55992924ce4f0bab5ba5b99e7830a925d447",paddingBlockEnd:"16"},a("swirl-stack",{key:"e06da8582e4e41ccb8c210292f466233777a97f4",justify:e?"center":"space-between",orientation:"horizontal"},a("swirl-button",{key:"1960f4768f22a6d6c8b7ef1aabcaa7b77e01a8be",hideLabel:e,icon:this.secondaryNavCollapsed?"<swirl-icon-expand-more></swirl-icon-expand-more>":"<swirl-icon-expand-less></swirl-icon-expand-less>",label:this.secondaryNavCollapsed?this.secondaryNavExpandLabel:this.secondaryNavCollapseLabel,onClick:this.toggleSecondaryNavCollapse,variant:"plain"}),!e&&!this.secondaryNavCollapsed&&a("swirl-button",{key:"2fd6f3c41e1752103a32d59f152fad121e0a7ce1",icon:"grid"===this.secondaryNavView?"<swirl-icon-menu></swirl-icon-menu>":"<swirl-icon-hamburger-menu></swirl-icon-hamburger-menu>",iconPosition:"end",label:"grid"===this.secondaryNavView?this.gridNavLayoutToggleLabel:this.listNavLayoutToggleLabel,onClick:this.toggleSecondaryNavView,variant:"plain"}))),a("div",{key:"542d6a0dbcb290a175d9d9d4e9eb0f8ec2462687",class:{[`shell-layout__secondary-nav-items--${this.secondaryNavGridLayoutVariant}`]:!0,"shell-layout__secondary-nav-items":!0,"shell-layout__secondary-nav-items--grid-view":this.enableSecondaryNavGridLayout&&"grid"===this.secondaryNavView}},a("slot",{key:"55a2836a2dbb4b11e2dd49063e45db21941d1490",name:"secondary-nav",onSlotchange:this.collectNavItems}))))),a("main",{key:"afa4d7ab3cadc90ddd89b11dbc84bb28acac4c41",class:"shell-layout__main",id:"main-content"},a("slot",{key:"6beead6ae681df7cf8cff9734c5529668c975962"}))))}get el(){return o(this)}static get watchers(){return{enableSecondaryNavGridLayout:[{watchEnableSecondaryNavGridLayout:0}],mobileNavigationActive:[{watchMobileNavigationState:0}],navigationCollapsed:[{watchNavigationCollapsed:0}]}}};M.style='.sc-swirl-shell-layout-h{--swirl-shell-background:var(--s-surface-sunken-default);--swirl-shell-text-color:var(--s-text-default);--swirl-shell-header-height:3.25rem;--swirl-shell-collapsed-nav-width:4rem;--swirl-shell-extended-nav-width:18rem;display:flex;width:100%;height:100%}.sc-swirl-shell-layout-h *.sc-swirl-shell-layout{box-sizing:border-box}.shell-layout.sc-swirl-shell-layout{display:grid;overflow:hidden;width:100%;min-height:100%;background-color:var(--swirl-shell-background);transition:grid-template-columns 0.1s;grid-template-columns:0 1fr 0;grid-template-rows:1fr;grid-template-areas:"nav main"}@media (prefers-reduced-motion){.shell-layout.sc-swirl-shell-layout{transition:none}}@media (min-width: 992px){.shell-layout.sc-swirl-shell-layout{padding-right:var(--s-space-8);padding-bottom:var(--s-space-8);-moz-column-gap:var(--s-space-8);column-gap:var(--s-space-8);grid-template-columns:var(--swirl-shell-extended-nav-width) 1fr 0;grid-template-rows:var(--swirl-shell-header-height) 1fr;grid-template-areas:"header header header" "nav main sidebar"}}.shell-layout--branded-header.sc-swirl-shell-layout .shell-layout__header.sc-swirl-shell-layout{border-bottom:none;color:var(--s-text-on-action-primary);background-color:var(--s-action-primary-default)}.shell-layout--branded-header.sc-swirl-shell-layout .shell-layout__header.sc-swirl-shell-layout .shell-layout__header-tool.sc-swirl-shell-layout{color:var(--s-text-on-action-primary);background-color:var(--s-action-primary-default)}.shell-layout--branded-header.sc-swirl-shell-layout .shell-layout__header.sc-swirl-shell-layout .shell-layout__header-tool.sc-swirl-shell-layout:hover{background-color:var(--s-action-primary-hovered)}.shell-layout--branded-header.sc-swirl-shell-layout .shell-layout__header.sc-swirl-shell-layout .shell-layout__header-tool.sc-swirl-shell-layout:active{background-color:var(--s-action-primary-pressed)}.shell-layout--branded-header.sc-swirl-shell-layout .shell-layout__header.sc-swirl-shell-layout .shell-layout__header-tool.sc-swirl-shell-layout swirl-badge.sc-swirl-shell-layout{--swirl-badge-border-color:var(--s-action-primary-default)}@media (min-width: 992px){.shell-layout--navigation-collapsed.sc-swirl-shell-layout .shell-layout__nav.sc-swirl-shell-layout{scrollbar-width:none}.shell-layout--navigation-collapsed.sc-swirl-shell-layout .shell-layout__nav.sc-swirl-shell-layout::-webkit-scrollbar{width:0;background:transparent;-webkit-appearance:none}}.shell-layout--navigation-collapsed .shell-layout__secondary-nav-items--grid-view.sc-swirl-shell-layout-s>ul>*,.shell-layout--navigation-collapsed .shell-layout__secondary-nav-items--grid-view .sc-swirl-shell-layout-s>ul>*{max-width:100%;max-height:3rem;flex-basis:100%}@media (min-width: 992px){.shell-layout--navigation-collapsed.sc-swirl-shell-layout{grid-template-columns:var(--swirl-shell-collapsed-nav-width) 1fr 0}}.shell-layout--mobile-navigation-active.sc-swirl-shell-layout .shell-layout__nav.sc-swirl-shell-layout{transform:translate3d(0, 0, 0);box-shadow:var(--s-shadow-level-3)}@media (min-width: 992px){.shell-layout--mobile-navigation-active.sc-swirl-shell-layout .shell-layout__nav.sc-swirl-shell-layout{transform:none;box-shadow:none}}.shell-layout--mobile-navigation-active.sc-swirl-shell-layout .shell-layout__mobile-nav-backdrop.sc-swirl-shell-layout{display:block}@media (min-width: 992px){.shell-layout--mobile-navigation-active.sc-swirl-shell-layout .shell-layout__mobile-nav-backdrop.sc-swirl-shell-layout{display:none}}.shell-layout--has-secondary-nav.sc-swirl-shell-layout .shell-layout__secondary-nav.sc-swirl-shell-layout{display:block}.shell-layout--secondary-nav-collapsed.sc-swirl-shell-layout .shell-layout__secondary-nav-items.sc-swirl-shell-layout{display:none}.shell-layout__header.sc-swirl-shell-layout{position:relative;display:none;width:calc(100% + var(--s-space-8));padding-top:var(--s-space-8);padding-right:var(--s-space-16);padding-bottom:var(--s-space-8);padding-left:var(--s-space-16);justify-content:space-between;align-items:center;color:var(--swirl-shell-text-color);grid-area:header}@media (min-width: 992px){.shell-layout__header.sc-swirl-shell-layout{display:flex}}.shell-layout__skip-link.sc-swirl-shell-layout{position:absolute;z-index:9;top:0;left:0;padding:var(--s-space-4);border:none;color:var(--swirl-shell-text-color);background-color:var(--swirl-shell-background);font:inherit;cursor:pointer}.shell-layout__skip-link.sc-swirl-shell-layout:not(:focus):not(:active){position:absolute;overflow:hidden;width:1px;height:1px;white-space:nowrap;clip:rect(0 0 0 0);clip-path:inset(50%)}.shell-layout__header-left.sc-swirl-shell-layout{display:flex;padding-left:var(--s-space-2);flex-basis:8rem;flex-shrink:0;align-items:center;gap:var(--s-space-8)}.shell-layout__header-right.sc-swirl-shell-layout{display:flex;flex-basis:8rem;flex-shrink:0;justify-content:flex-end;align-items:center;gap:var(--s-space-8)}.shell-layout__logo.sc-swirl-shell-layout{display:flex;flex-grow:1;justify-content:center;align-items:center}.shell-layout__logo.sc-swirl-shell-layout-s>a{display:flex}.shell-layout__logo.sc-swirl-shell-layout-s>a img,.shell-layout__logo.sc-swirl-shell-layout-s>img{max-height:1.75rem}.shell-layout__header-tool.sc-swirl-shell-layout{position:relative;width:2.25rem;height:2.25rem;padding:var(--s-space-8);flex-shrink:0;border:none;border-radius:var(--s-border-radius-sm);color:var(--swirl-shell-text-color);background-color:var(--s-surface-sunken-default);font:inherit;cursor:pointer}.shell-layout__header-tool.sc-swirl-shell-layout:hover{background-color:var(--s-state-hovered)}.shell-layout__header-tool.sc-swirl-shell-layout:active{background-color:var(--s-state-pressed)}.shell-layout__header-tool.sc-swirl-shell-layout:focus{outline:none}.shell-layout__header-tool.sc-swirl-shell-layout:focus-visible{box-shadow:0 0 0 0.125rem var(--s-focus-default)}.shell-layout__header-tool.sc-swirl-shell-layout swirl-badge.sc-swirl-shell-layout{--swirl-badge-border-color:var(--s-surface-sunken-default);position:absolute;top:var(--s-space-2);right:var(--s-space-2);padding-right:var(--s-space-2);transform:translate3d(0.1875rem, 0, 0)}.shell-layout__nav.sc-swirl-shell-layout{position:fixed;z-index:9;top:0;bottom:0;left:0;overflow-x:hidden;overflow-y:auto;width:100%;max-width:18.75rem;color:var(--swirl-shell-text-color);background-color:var(--s-surface-overlay-default);transition:transform 0.1s, box-shadow 0.1s, width 0.1s;transform:translate3d(-100%, 0, 0);grid-area:nav}@media (prefers-reduced-motion){.shell-layout__nav.sc-swirl-shell-layout{transition:none}}@media (min-width: 992px){.shell-layout__nav.sc-swirl-shell-layout{position:relative;max-width:none;padding-top:0;padding-right:var(--s-space-4);padding-bottom:var(--s-space-8);padding-left:var(--s-space-12);background-color:var(--swirl-shell-background);transform:none;box-shadow:none;inset:auto}}.shell-layout__mobile-header.sc-swirl-shell-layout{display:flex;min-height:3.5rem;margin-bottom:var(--s-space-8);padding-top:var(--s-space-8);padding-right:var(--s-space-16);padding-bottom:var(--s-space-8);padding-left:var(--s-space-16);justify-content:space-between;align-items:center;border-bottom:0.0625rem solid var(--s-border-default)}.shell-layout__mobile-header.sc-swirl-shell-layout-s>img{max-height:1.75rem}.shell-layout__mobile-header.sc-swirl-shell-layout .shell-layout__header-tool.sc-swirl-shell-layout{background-color:var(--s-surface-overlay-default)}.shell-layout__mobile-header.sc-swirl-shell-layout .shell-layout__header-tool.sc-swirl-shell-layout:hover{background-color:var(--s-state-hovered)}.shell-layout__mobile-header.sc-swirl-shell-layout .shell-layout__header-tool.sc-swirl-shell-layout:active{background-color:var(--s-state-pressed)}@media (min-width: 992px){.shell-layout__mobile-header.sc-swirl-shell-layout{display:none}}.shell-layout__mobile-header-tools.sc-swirl-shell-layout{display:flex;justify-content:flex-end;align-items:center;gap:var(--s-space-8)}.shell-layout__nav-body.sc-swirl-shell-layout{padding:var(--s-space-8)}.shell-layout__nav-body.sc-swirl-shell-layout-s ul{margin:0;padding:0;list-style:none}.shell-layout__nav-body.sc-swirl-shell-layout-s li{display:flex}@media (min-width: 992px){.shell-layout__nav-body.sc-swirl-shell-layout{padding:0}}.shell-layout__mobile-nav-backdrop.sc-swirl-shell-layout{position:fixed;z-index:8;display:none;background-color:rgba(0, 0, 0, 0.25);animation:shell-layout-backdrop-fade-in 0.1s;inset:0}.shell-layout__secondary-nav.sc-swirl-shell-layout{display:none}.shell-layout__secondary-nav-items.sc-swirl-shell-layout-s>ul,.shell-layout__secondary-nav-items .sc-swirl-shell-layout-s>ul{display:flex;flex-direction:column;gap:var(--s-space-2)}.shell-layout:not(.shell-layout--navigation-collapsed) .shell-layout__secondary-nav-items--grid-view.sc-swirl-shell-layout-s>ul,.shell-layout:not(.shell-layout--navigation-collapsed) .shell-layout__secondary-nav-items--grid-view .sc-swirl-shell-layout-s>ul{flex-wrap:wrap;flex-direction:row;gap:var(--s-space-16)}.shell-layout:not(.shell-layout--navigation-collapsed) .shell-layout__secondary-nav-items--grid-view.sc-swirl-shell-layout-s>ul>*,.shell-layout:not(.shell-layout--navigation-collapsed) .shell-layout__secondary-nav-items--grid-view .sc-swirl-shell-layout-s>ul>*{min-width:0;max-height:none}.shell-layout:not(.shell-layout--navigation-collapsed) .shell-layout__secondary-nav-items--grid-view.shell-layout__secondary-nav-items--app-icon.sc-swirl-shell-layout-s>ul,.shell-layout:not(.shell-layout--navigation-collapsed) .shell-layout__secondary-nav-items--grid-view.shell-layout__secondary-nav-items--app-icon .sc-swirl-shell-layout-s>ul{row-gap:var(--s-space-16);-moz-column-gap:0;column-gap:0}.shell-layout--navigation-collapsed .shell-layout__secondary-nav-items--tiled.sc-swirl-shell-layout-s>ul,.shell-layout--navigation-collapsed .shell-layout__secondary-nav-items--tiled .sc-swirl-shell-layout-s>ul{gap:var(--s-space-16)}.shell-layout__secondary-nav-items--tiled.sc-swirl-shell-layout-s>ul>*,.shell-layout__secondary-nav-items--tiled .sc-swirl-shell-layout-s>ul>*{flex-basis:calc(50% - var(--s-space-8))}.shell-layout__secondary-nav-items--app-icon.sc-swirl-shell-layout-s>ul>*,.shell-layout__secondary-nav-items--app-icon .sc-swirl-shell-layout-s>ul>*{flex-basis:calc(100% / 3)}.shell-layout__main.sc-swirl-shell-layout{overflow:hidden;background-color:var(--s-background-default);grid-area:main}@media (min-width: 992px){.shell-layout__main.sc-swirl-shell-layout{width:calc(100% + var(--s-space-8));border:0.0625rem solid var(--s-border-default);border-radius:var(--s-border-radius-sm)}}@keyframes shell-layout-backdrop-fade-in{from{opacity:0}to{opacity:1}}@keyframes shell-layout-no-overflow-after-transition{0%{overflow:initial}99%{overflow:initial}100%{overflow:hidden}}';export{M as swirl_shell_layout}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
import{r as s,c as l,h as e,a as o}from"./p-N0O_JBVJ.js";import{d as a,e as i}from"./p-B0kNlhKL.js";import{c as t}from"./p-orsBiyT_.js";const c=class{constructor(e){s(this,e),this.closeModal=l(this,"closeModal",7),this.isClosing=!0,this.onDialogClose=()=>{this.closeModal.emit()},this.onKeyDown=s=>{"Escape"===s.code&&(s.stopImmediatePropagation(),s.preventDefault(),this.close())},this.onContentClick=s=>{s.stopPropagation()},this.onClose=()=>{this.close()}}componentDidLoad(){this.setDialogCustomProps(),requestAnimationFrame((()=>{this.modalEl.showModal(),a(this.scrollContainerEl),this.isClosing=!1}))}disconnectedCallback(){this.modalEl?.open&&this.modalEl.close(),i(this.scrollContainerEl)}async close(){this.isClosing=!0,setTimeout((()=>{this.modalEl.close()}),300)}setDialogCustomProps(){this.modalEl.setAttribute("closedby","none")}render(){const s=t("modal-shell",{"modal-shell--closing":this.isClosing});return e(o,{key:"040edfa9e8ab0bc22c1f653ceadada93809465be"},e("dialog",{key:"b9c9724d366b5a5ea6302451c87b05cd10a34293","aria-label":this.label,class:s,onClose:this.onDialogClose,onKeyDown:this.onKeyDown,ref:s=>this.modalEl=s},e("div",{key:"3fcb9e41c72cc03e91414b779c4ed3b054e803dc",class:"modal-shell__backdrop"}),e("div",{key:"485fba3bc5aa2e96d15aa5fd3b22d74af522fe44",class:"modal-shell__scroll-container",onClick:this.onClose,ref:s=>this.scrollContainerEl=s},e("div",{key:"4f5421cee0190f021279e95f9e3f3c4c17473a14",class:"modal-shell__scroll-container__content",onClick:this.onContentClick},e("slot",{key:"2c36d7f74b599b15fd2de8ae12b72a67fb05fb81"}))),e("swirl-button",{key:"c0ac4350a2a79a0fc2c56472559aae562ebb429a",class:"modal-shell__close-button",icon:"<swirl-icon-close color='strong'></swirl-icon-close>",label:this.closeButtonLabel,hideLabel:!0,variant:"translucent",onClick:this.onClose})))}};c.style=".sc-swirl-modal-shell-h{display:block}.sc-swirl-modal-shell-h *.sc-swirl-modal-shell{box-sizing:border-box}.modal-shell.sc-swirl-modal-shell{position:fixed;inset:0;z-index:var(--s-z-40);border:none;padding:0;width:100%;height:100%;max-width:none;max-height:none;overflow:visible;background:transparent}.modal-shell.sc-swirl-modal-shell::backdrop{display:none}.modal-shell__backdrop.sc-swirl-modal-shell{position:fixed;inset:0;z-index:1;background-color:var(--s-translucent-medium-default);opacity:1;-webkit-backdrop-filter:blur(var(--s-blur-l));backdrop-filter:blur(var(--s-blur-l));transition:opacity 0.3s ease-out, -webkit-backdrop-filter 0.3s ease-out;transition:opacity 0.3s ease-out, backdrop-filter 0.3s ease-out;transition:opacity 0.3s ease-out, backdrop-filter 0.3s ease-out, -webkit-backdrop-filter 0.3s ease-out}.modal-shell__scroll-container.sc-swirl-modal-shell{overflow-y:auto;position:fixed;inset:0;z-index:2;display:grid;padding:var(--s-space-24);justify-content:center;align-items:center}.modal-shell__scroll-container__content.sc-swirl-modal-shell{opacity:1;transform:scale(1);transition:opacity 0.2s ease-out, transform 0.2s cubic-bezier(0.3, 0.7, 0.4, 1.1)}.modal-shell__close-button.sc-swirl-modal-shell{position:fixed;top:var(--s-space-16);right:var(--s-space-16);z-index:3;opacity:1;transform:scale(1);transition:opacity 0.2s ease-out, transform 0.2s cubic-bezier(0.3, 0.7, 0.4, 1.1)}.modal-shell--closing.sc-swirl-modal-shell .modal-shell__backdrop.sc-swirl-modal-shell{opacity:0;-webkit-backdrop-filter:blur(0px);backdrop-filter:blur(0px)}.modal-shell--closing.sc-swirl-modal-shell .modal-shell__scroll-container__content.sc-swirl-modal-shell,.modal-shell--closing.sc-swirl-modal-shell .modal-shell__close-button.sc-swirl-modal-shell{opacity:0;transform:scale(1.1)}";export{c as swirl_modal_shell}
|