@getflip/swirl-components 0.20.1 → 0.21.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.
Files changed (31) hide show
  1. package/components.json +73 -51
  2. package/dist/cjs/file-manager.cjs.entry.js +1 -1
  3. package/dist/cjs/loader.cjs.js +1 -1
  4. package/dist/cjs/swirl-app-layout_7.cjs.entry.js +3 -6
  5. package/dist/cjs/swirl-components.cjs.js +1 -1
  6. package/dist/cjs/swirl-shell-layout.cjs.entry.js +1 -1
  7. package/dist/collection/components/swirl-app-layout/swirl-app-layout.css +25 -43
  8. package/dist/collection/components/swirl-app-layout/swirl-app-layout.js +11 -56
  9. package/dist/collection/components/swirl-app-layout/swirl-app-layout.stories.js +4 -6
  10. package/dist/collection/components/swirl-shell-layout/swirl-shell-layout.js +1 -1
  11. package/dist/collection/components/swirl-shell-layout/swirl-shell-layout.stories.js +25 -2
  12. package/dist/collection/prototypes/file-manager/file-manager.js +1 -1
  13. package/dist/components/file-manager.js +1 -1
  14. package/dist/components/swirl-app-layout2.js +3 -9
  15. package/dist/components/swirl-shell-layout.js +1 -1
  16. package/dist/esm/file-manager.entry.js +1 -1
  17. package/dist/esm/loader.js +1 -1
  18. package/dist/esm/swirl-app-layout_7.entry.js +3 -6
  19. package/dist/esm/swirl-components.js +1 -1
  20. package/dist/esm/swirl-shell-layout.entry.js +1 -1
  21. package/dist/swirl-components/p-11ea0551.entry.js +1 -0
  22. package/dist/swirl-components/p-ab342072.entry.js +1 -0
  23. package/dist/swirl-components/p-fd8dd92d.entry.js +1 -0
  24. package/dist/swirl-components/swirl-components.esm.js +1 -1
  25. package/dist/types/components/swirl-app-layout/swirl-app-layout.d.ts +9 -3
  26. package/dist/types/components.d.ts +0 -6
  27. package/package.json +1 -1
  28. package/vscode-data.json +0 -12
  29. package/dist/swirl-components/p-19a0622b.entry.js +0 -1
  30. package/dist/swirl-components/p-b556f2af.entry.js +0 -1
  31. package/dist/swirl-components/p-de47bad6.entry.js +0 -1
@@ -1 +0,0 @@
1
- import{r as l,h as a,H as e}from"./p-05c15d47.js";import{c as s}from"./p-b7898321.js";import{g as o,a as i}from"./p-438b3941.js";const t=class{constructor(a){l(this,a),this.desktopMediaQuery=o(),this.desktopMediaQueryHandler=l=>{l.matches?this.showSidebar():this.hideSidebar()},this.hideSidebar=()=>{this.collapsedSidebar=!0,this.collapsing=!0,setTimeout((()=>{this.collapsing=!1,this.sidebarHovered=!1}),200)},this.showSidebar=()=>{this.collapsedSidebar=!1},this.toggleSidebar=()=>{this.collapsedSidebar?this.showSidebar():this.hideSidebar()},this.onBackdropClick=()=>{this.collapsedSidebar||this.hideSidebar()},this.onSidebarClick=()=>{var l;this.collapsedSidebar&&(null===(l=i())||void 0===l||l.blur())},this.onSidebarMouseEnter=()=>{this.sidebarHovered=!0},this.onSidebarMouseLeave=()=>{this.sidebarHovered=!1},this.mainNavigationLabel="Main",this.sidebarToggleLabel="Toggle sidebar",this.collapsedSidebar=void 0,this.collapsing=void 0,this.sidebarHovered=void 0}componentWillLoad(){var l,a;this.desktopMediaQuery.matches||this.hideSidebar(),null===(a=(l=this.desktopMediaQuery).addEventListener)||void 0===a||a.call(l,"change",this.desktopMediaQueryHandler)}async collapseSidebar(){this.hideSidebar()}async extendSidebar(){this.showSidebar()}render(){const l=s("shell-layout",{"shell-layout--collapsed-sidebar":this.collapsedSidebar,"shell-layout--collapsing":this.collapsing}),o=s("shell-layout__sidebar-wrapper",{"shell-layout__sidebar-wrapper--hovered":this.sidebarHovered}),i=s("shell-layout__backdrop",{"shell-layout__backdrop--fading":this.collapsing});return a(e,null,a("div",{class:l},a("div",{class:o,onClick:this.onSidebarClick,onMouseEnter:this.onSidebarMouseEnter,onMouseLeave:this.onSidebarMouseLeave},a("div",{class:"shell-layout__sidebar"},a("header",{class:"shell-layout__header"},a("div",{class:"shell-layout__logo-bar"},a("div",{class:"shell-layout__expanded-logo"},a("slot",{name:"logo-expanded"})),a("div",{class:"shell-layout__collapsed-logo"},a("slot",{name:"logo-collapsed"})),a("div",{class:"shell-layout__toggle"},a("swirl-button",{swirlAriaExpanded:String(!this.collapsedSidebar),hideLabel:!0,icon:this.collapsedSidebar?"<swirl-icon-double-arrow-right></swirl-icon-double-arrow-right>":"<swirl-icon-double-arrow-left></swirl-icon-double-arrow-left>",label:this.sidebarToggleLabel,onClick:this.toggleSidebar}))),a("div",{class:"shell-layout__tools"},a("slot",{name:"tools"}))),a("nav",{"aria-label":this.mainNavigationLabel,class:"shell-layout__main-navigation"},a("slot",{name:"main-navigation"})),this.collapsedSidebar&&!this.collapsing&&a("div",{class:"shell-layout__mobile-toggle"},a("swirl-button",{swirlAriaExpanded:String(!this.collapsedSidebar),hideLabel:!0,icon:"<swirl-icon-menu></swirl-icon-menu>",label:this.sidebarToggleLabel,onClick:this.showSidebar})))),a("main",{class:"shell-layout__main"},a("slot",{name:"main"})),(!this.collapsedSidebar||this.collapsing)&&a("div",{class:i,onClick:this.onBackdropClick})))}};t.style=":host{--extended-sidebar-width:17.5rem;--collapsed-sidebar-width:4rem;display:flex;width:100%;height:100%}:host *{box-sizing:border-box}.shell-layout{display:flex;width:100%;min-height:100%}@media (min-width: 992px){.shell-layout--collapsed-sidebar:not(.shell-layout--collapsing) .shell-layout__sidebar-wrapper.shell-layout__sidebar-wrapper--hovered .shell-layout__sidebar,.shell-layout--collapsed-sidebar:not(.shell-layout--collapsing) .shell-layout__sidebar-wrapper:focus-within .shell-layout__sidebar{width:var(--extended-sidebar-width);box-shadow:0 0.75rem 2rem rgba(25, 26, 28, 0.12),\n 0 0.25rem 0.75rem rgba(25, 26, 28, 0.08)}}.shell-layout--collapsed-sidebar .shell-layout__sidebar-wrapper{min-height:100%;transform:translate3d(-100%, 0, 0)}.shell-layout--collapsed-sidebar .shell-layout__sidebar-wrapper .shell-layout__sidebar{width:100%;box-shadow:none}@media (min-width: 992px){.shell-layout--collapsed-sidebar .shell-layout__sidebar-wrapper{max-width:var(--collapsed-sidebar-width);flex-basis:var(--collapsed-sidebar-width);transform:none}.shell-layout--collapsed-sidebar .shell-layout__sidebar-wrapper:not(.shell-layout__sidebar-wrapper--hovered):not(:focus-within) .shell-layout__sidebar{box-shadow:none}.shell-layout--collapsed-sidebar .shell-layout__sidebar-wrapper:not(.shell-layout__sidebar-wrapper--hovered):not(:focus-within) .shell-layout__collapsed-logo{display:block}.shell-layout--collapsed-sidebar .shell-layout__sidebar-wrapper:not(.shell-layout__sidebar-wrapper--hovered):not(:focus-within) .shell-layout__expanded-logo{display:none}.shell-layout--collapsed-sidebar .shell-layout__sidebar-wrapper:not(.shell-layout__sidebar-wrapper--hovered):not(:focus-within) .shell-layout__toggle{display:none}}.shell-layout__sidebar-wrapper{position:absolute;z-index:2;top:0;bottom:0;left:0;width:100%;max-width:var(--extended-sidebar-width);flex-basis:var(--extended-sidebar-width);flex-shrink:0;transition:max-width 0.2s, transform 0.2s}@media (min-width: 992px){.shell-layout__sidebar-wrapper{position:relative;inset:auto}}.shell-layout__sidebar{display:flex;width:var(--extended-sidebar-width);height:100%;border-right:var(--s-border-width-default) solid var(--s-border-default);flex-direction:column;transition:box-shadow 0.2s, width 0.2s;box-shadow:0 0.75rem 2rem rgba(25, 26, 28, 0.12),\n 0 0.25rem 0.75rem rgba(25, 26, 28, 0.08)}@media (min-width: 992px){.shell-layout__sidebar{box-shadow:none}}.shell-layout__header{padding:var(--s-space-8);flex-shrink:0;background-color:var(--s-background-default);border-bottom:var(--s-border-width-default) solid var(--s-border-default)}.shell-layout__logo-bar{display:flex;overflow:hidden;align-items:center}.shell-layout__expanded-logo{padding-top:var(--s-space-8);padding-right:calc(var(--s-space-12) + var(--s-space-2));padding-bottom:var(--s-space-8);padding-left:calc(var(--s-space-12) + var(--s-space-2));flex-grow:1}.shell-layout__collapsed-logo{display:none;padding-top:var(--s-space-8);padding-right:calc(var(--s-space-12) + var(--s-space-2));padding-bottom:var(--s-space-8);padding-left:calc(var(--s-space-12) + var(--s-space-2));flex-grow:1}.shell-layout__toggle{padding-right:var(--s-space-8);padding-left:var(--s-space-12);flex-grow:0;flex-shrink:0}.shell-layout__mobile-toggle{position:absolute;z-index:2;top:var(--s-space-12);left:calc(100% + var(--s-space-16))}@media (min-width: 992px){.shell-layout__mobile-toggle{display:none}}.shell-layout__tools{margin-top:var(--s-space-4);flex-basis:100%;flex-shrink:0}.shell-layout__main-navigation{overflow:auto;padding:var(--s-space-8);flex-grow:1;background-color:var(--s-background-default)}.shell-layout__main{flex-grow:1;background-color:var(--s-background-default)}.shell-layout__main>*,.shell-layout__main ::slotted(*){height:100%}.shell-layout__backdrop{position:fixed;z-index:1;background-color:rgba(0, 0, 0, 0.4);-webkit-animation:shell-layout-backdrop-fade-in 0.1s;animation:shell-layout-backdrop-fade-in 0.1s;inset:0}@media (min-width: 992px){.shell-layout__backdrop{display:none}}.shell-layout__backdrop--fading{-webkit-animation:shell-layout-backdrop-fade-out 0.2s;animation:shell-layout-backdrop-fade-out 0.2s}@-webkit-keyframes shell-layout-backdrop-fade-in{from{opacity:0}to{opacity:1}}@keyframes shell-layout-backdrop-fade-in{from{opacity:0}to{opacity:1}}@-webkit-keyframes shell-layout-backdrop-fade-out{from{opacity:1}to{opacity:0}}@keyframes shell-layout-backdrop-fade-out{from{opacity:1}to{opacity:0}}";export{t as swirl_shell_layout}
@@ -1 +0,0 @@
1
- import{r as i,h as e,H as t}from"./p-05c15d47.js";const o={directories:[{name:"Development",description:"Updated 2 days ago.",children:[{description:"1.02 MB, updated 2 days ago.",name:"sample.pdf",type:"application/pdf",url:"/sample.pdf"},{description:"124 KB, updated a month ago.",name:"sample.jpg",type:"image/jpeg",url:"/sample.jpg"}]},{name:"People",description:"Updated just now.",children:[]}]},s=class{constructor(e){i(this,e),this.selectItem=i=>{"type"in i?(this.selectedFile=i,this.layout.changeMobileView("body")):this.selectedDirectory=i},this.resetSelectedDirectory=()=>{this.selectedDirectory=void 0},this.toggleSidebar=()=>{var i;null===(i=this.layout)||void 0===i||i.toggleSidebar()},this.selectedDirectory=void 0,this.selectedFile=void 0}renderNavigation(){const i=Boolean(this.selectedDirectory)?this.selectedDirectory.children:o.directories;return i.length>0?i.map((i=>e("swirl-resource-list-item",{description:i.description,key:i.name,label:i.name,onClick:()=>this.selectItem(i)},e("type"in i?"swirl-icon-file":"swirl-icon-folder-shared",{slot:"media"})))):e("swirl-box",{padding:"16"},e("swirl-text",{color:"subdued",weight:"medium"},"This directory is empty."))}render(){var i,o;return e(t,null,e("swirl-app-layout",{appName:"Documents",backToNavigationViewButtonLabel:"Back to documents list",ctaIcon:"<swirl-icon-add></swirl-icon-add>",ctaLabel:"Upload file",heading:null===(i=this.selectedFile)||void 0===i?void 0:i.name,navigationLabel:"Documents",onNavigationBackButtonClick:this.resetSelectedDirectory,ref:i=>this.layout=i,sidebarCloseButtonLabel:"Close file info",sidebarHeading:"File info",showNavigationBackButton:Boolean(this.selectedDirectory),subheading:null===(o=this.selectedFile)||void 0===o?void 0:o.description,transitionStyle:"dialog"},e("swirl-resource-list",{label:"Documents",slot:"navigation"},this.renderNavigation()),e("swirl-button",{id:"sort-button",label:"Sort items",slot:"navigation-controls"}),Boolean(this.selectedFile)?e("swirl-file-viewer",{file:this.selectedFile.url,slot:"content",type:this.selectedFile.type}):e("swirl-box",{cover:!0,centerBlock:!0,centerInline:!0,padding:"16",slot:"content"},e("swirl-empty-state",{heading:"Nothing to see here.",illustration:"/images/empty-state-1.svg"},"Please select a file from the list.")),e("div",{slot:"app-bar-controls"},this.selectedFile&&e("swirl-button",{"hide-label":!0,class:"info-button",icon:"<swirl-icon-info></swirl-icon-info>",label:"Open file info",onClick:this.toggleSidebar})),e("swirl-box",{padding:"16",slot:"sidebar"},e("swirl-text",{color:"subdued",weight:"medium"},"File info goes here …"))),e("swirl-popover",{label:"Sort items",popoverId:"sort-menu",trigger:"sort-button"},e("swirl-option-list",{value:["ascending"]},e("swirl-option-list-item",{icon:"<swirl-icon-expand-less></swirl-icon-expand-less>",label:"Ascending",value:"ascending"}),e("swirl-option-list-item",{icon:"<swirl-icon-expand-more></swirl-icon-expand-more>",label:"Descending",value:"descending"}),e("swirl-option-list-item",{icon:"<swirl-icon-time-outlined></swirl-icon-time-outlined>",label:"By date",value:"date"}))))}};export{s as file_manager}
@@ -1 +0,0 @@
1
- import{r as a,c as i,h as t,H as o,g as e,F as s}from"./p-05c15d47.js";import{c as n}from"./p-b7898321.js";import{i as r}from"./p-438b3941.js";const l=class{constructor(t){a(this,t),this.ctaClick=i(this,"ctaClick",7),this.mobileViewChange=i(this,"mobileViewChange",7),this.navigationBackButtonClick=i(this,"navigationBackButtonClick",7),this.sidebarToggle=i(this,"sidebarToggle",7),this.onBackToNavigationViewButtonClick=()=>{this.changeMobileView("navigation")},this.onCtaClick=a=>{this.ctaClick.emit(a)},this.onNavigationBackButtonClick=a=>{this.navigationBackButtonClick.emit(a)},this.onSidebarCloseButtonClick=()=>{this.hideSidebar()},this.appBarMedia=void 0,this.appName=void 0,this.backToNavigationViewButtonLabel="Back to navigation",this.ctaIcon=void 0,this.ctaLabel=void 0,this.heading=void 0,this.navigationBackButtonLabel="Go back",this.navigationLabel=void 0,this.showNavigationBackButton=void 0,this.sidebarCloseButtonLabel="Close sidebar",this.sidebarHeading=void 0,this.subheading=void 0,this.transitionStyle="slides",this.hasNavigation=void 0,this.hasSidebar=void 0,this.mobileView="navigation",this.sidebarActive=void 0,this.sidebarClosing=void 0,this.transitioningFrom=void 0,this.transitioningTo=void 0}componentWillLoad(){this.mutationObserver=new MutationObserver((()=>{this.updateNavigationStatus(),this.updateSidebarStatus()})),this.mutationObserver.observe(this.el,{childList:!0}),queueMicrotask((()=>{this.updateSidebarStatus(),this.updateNavigationStatus(),this.checkMobileView()}))}disconnectedCallback(){var a;null===(a=this.mutationObserver)||void 0===a||a.disconnect()}watchMobileView(){this.checkMobileView()}async showSidebar(){!this.sidebarActive&&this.hasSidebar&&(this.sidebarActive=!0,this.changeMobileView("sidebar"),this.sidebarToggle.emit(!0))}async hideSidebar(){if(!this.sidebarActive||!this.hasSidebar)return;Boolean(this.sidebarClosingTimeout)&&clearTimeout(this.sidebarClosingTimeout),this.sidebarClosing=!0;const a=r()?0:300;this.sidebarClosingTimeout=setTimeout((()=>{this.sidebarActive=!1,this.sidebarClosing=!1,this.changeMobileView("body"),this.sidebarToggle.emit(!1)}),a)}async toggleSidebar(){this.hasSidebar&&(this.sidebarActive?this.hideSidebar():this.showSidebar())}async changeMobileView(a,i=!0){if(this.mobileView===a||"navigation"===a&&!this.hasNavigation||"sidebar"===a&&!this.hasSidebar)return;if(!r()||!i)return this.mobileView=a,void this.mobileViewChange.emit(this.mobileView);Boolean(this.transitionTimeout)&&clearTimeout(this.transitionTimeout),this.transitioningFrom=this.mobileView,this.transitioningTo=a;let t=0;"slides"===this.transitionStyle?t=400:"dialog"===this.transitionStyle&&(t=300),this.transitionTimeout=setTimeout((()=>{this.mobileView=a,this.transitioningFrom=void 0,this.transitioningTo=void 0,this.mobileViewChange.emit(this.mobileView)}),t)}checkMobileView(){if("navigation"===this.mobileView&&!this.hasNavigation||"sidebar"===this.mobileView&&!this.hasSidebar)return void(this.mobileView="body");const a="sidebar"===this.mobileView||this.sidebarActive;a!==this.sidebarActive&&(a?this.showSidebar():this.hideSidebar())}updateNavigationStatus(){this.hasNavigation=Boolean(this.el.querySelector('[slot="navigation"]'))}updateSidebarStatus(){this.hasSidebar=Boolean(this.el.querySelector('[slot="sidebar"]'))}render(){const a=("body"===this.mobileView||this.transitioningTo)&&this.hasNavigation,i=n("app-layout",`app-layout--mobile-view-${this.mobileView}`,`app-layout--transitioning-from-${this.transitioningFrom}`,`app-layout--transitioning-to-${this.transitioningTo}`,`app-layout--transition-style-${this.transitionStyle}`,{"app-layout--has-navigation":this.hasNavigation,"app-layout--has-sidebar":this.hasSidebar,"app-layout--sidebar-active":"sidebar"===this.mobileView||this.sidebarActive,"app-layout--sidebar-closing":this.sidebarClosing});return t(o,null,t("section",{"aria-labelledby":"app-name",class:i,role:"document",tabIndex:0},t("div",{class:"app-layout__grid"},t("header",{class:"app-layout__header"},this.showNavigationBackButton&&t("span",{class:"app-layout__navigation-back-button"},t("swirl-button",{hideLabel:!0,icon:"<swirl-icon-arrow-back></swirl-icon-arrow-back>",label:this.navigationBackButtonLabel,onClick:this.onNavigationBackButtonClick})),t("swirl-heading",{as:"h1",class:"app-layout__app-name",headingId:"app-name",level:3,text:this.appName}),this.hasNavigation&&t("span",{class:"app-layout__navigation-controls"},t("slot",{name:"navigation-controls"}))),t("nav",{"aria-label":this.navigationLabel,class:"app-layout__navigation"},t("slot",{name:"navigation"})),t("section",{"aria-labelledby":this.hasNavigation?"heading":"app-name",class:"app-layout__body"},this.hasNavigation?t("header",{class:"app-layout__app-bar"},a&&t("span",{class:"app-layout__back-to-navigation-button"},t("swirl-button",{hideLabel:!0,icon:"dialog"===this.transitionStyle?"<swirl-icon-close></swirl-icon-close>":"<swirl-icon-arrow-back></swirl-icon-arrow-back>",label:this.backToNavigationViewButtonLabel,onClick:this.onBackToNavigationViewButtonClick})),this.appBarMedia&&t("div",{class:"app-layout__app-bar-media",innerHTML:this.appBarMedia}),t("div",{class:"app-layout__app-bar-heading"},this.heading&&t("swirl-heading",{as:"h2",headingId:"heading",level:4,text:this.heading}),this.subheading&&t("span",{class:"app-layout__app-bar-subheading"},this.subheading)),t("div",{class:"app-layout__app-bar-controls"},t("slot",{name:"app-bar-controls"}))):t("header",{class:"app-layout__app-bar"},t("swirl-heading",{as:"h1",headingId:"app-name",level:2,text:this.appName}),t("span",{class:"app-layout__navigation-controls"},t("slot",{name:"navigation-controls"}))),t("div",{class:"app-layout__content"},t("slot",{name:"content"}))),t("aside",{class:"app-layout__sidebar"},t("header",{class:"app-layout__sidebar-header"},t("swirl-button",{class:"app-layout__sidebar-close-button",hideLabel:!0,icon:"<swirl-icon-close></swirl-icon-close>",label:this.sidebarCloseButtonLabel,onClick:this.onSidebarCloseButtonClick}),t("swirl-heading",{as:"h3",class:"app-layout__sidebar-heading",headingId:"sidebar-heading",level:3,text:this.sidebarHeading})),t("div",{class:"app-layout__sidebar-content"},t("slot",{name:"sidebar"}))),this.ctaLabel&&t("span",{class:"app-layout__floating-cta"},t("swirl-button",{hideLabel:Boolean(this.ctaIcon),icon:this.ctaIcon,intent:"primary",label:this.ctaLabel,onClick:this.onCtaClick,variant:"floating"})))))}get el(){return e(this)}static get watchers(){return{mobileView:["watchMobileView"]}}};l.style=':host{position:relative;z-index:1;display:flex;width:100%;height:100%}:host *{box-sizing:border-box}.app-layout{display:flex;overflow:hidden;width:100%;height:100%;margin-right:auto;margin-left:auto}.app-layout__grid{position:relative;display:grid;width:100%;height:100%;grid-template-columns:100%;grid-template-rows:4rem 1fr;grid-template-areas:"body"\n "body"}.app-layout:not(.app-layout--has-navigation) .app-layout__header,.app-layout:not(.app-layout--has-navigation) .app-layout__navigation{display:none}.app-layout:not(.app-layout--has-sidebar) .app-layout__sidebar{display:none}@media (max-width: 767px){.app-layout:not(.app-layout--mobile-view-body) .app-layout__body{display:none}}@media (max-width: 767px){.app-layout:not(.app-layout--mobile-view-sidebar) .app-layout__sidebar{display:none}}.app-layout--has-navigation .app-layout__grid{grid-template-columns:100%;grid-template-areas:"header"\n "navigation"}@media (min-width: 768px){.app-layout--has-navigation .app-layout__grid{grid-template-columns:min(50%, 25rem) 1fr;grid-template-areas:"header body"\n "navigation body"}}@media (min-width: 768px){.app-layout--has-sidebar.app-layout--sidebar-active .app-layout__grid{grid-template-columns:1fr min(50%, 25rem);grid-template-areas:"body sidebar"\n "body sidebar"}}.app-layout--has-sidebar .app-layout__grid{grid-template-columns:100%;grid-template-areas:"body"\n "body"}@media (min-width: 1440px){.app-layout--has-navigation.app-layout--has-sidebar.app-layout--sidebar-active .app-layout__grid{-webkit-animation:app-layout-sidebar-slide-in 0.3s;animation:app-layout-sidebar-slide-in 0.3s;grid-template-columns:25rem 1fr 25rem;grid-template-areas:"header body sidebar"\n "navigation body sidebar"}}@media (min-width: 1440px){.app-layout--has-navigation.app-layout--has-sidebar.app-layout--sidebar-closing .app-layout__grid{-webkit-animation:app-layout-sidebar-slide-out 0.3s;animation:app-layout-sidebar-slide-out 0.3s}}@media (min-width: 768px){.app-layout--has-navigation.app-layout--has-sidebar .app-layout__grid{grid-template-columns:min(50%, 25rem) 1fr;grid-template-areas:"header body"\n "navigation body"}}@media (min-width: 992px){.app-layout--has-navigation.app-layout--has-sidebar .app-layout__grid{grid-template-columns:25rem 1fr;grid-template-areas:"header body"\n "navigation body"}}@media (min-width: 768px) and (max-width: 1439px){.app-layout--has-navigation.app-layout--has-sidebar .app-layout__sidebar{position:absolute;top:0;right:0;bottom:0;width:min(40%, 25rem);border-left:var(--s-border-width-default) solid var(--s-border-default);box-shadow:var(--s-shadow-level-3)}}@media (max-width: 767px){.app-layout--mobile-view-navigation .app-layout__grid{grid-template-areas:"header"\n "navigation"}.app-layout--mobile-view-navigation .app-layout__body,.app-layout--mobile-view-navigation .app-layout__sidebar{display:none}}@media (max-width: 767px){.app-layout--mobile-view-body .app-layout__grid{grid-template-areas:"body"\n "body"}.app-layout--mobile-view-body .app-layout__header,.app-layout--mobile-view-body .app-layout__navigation,.app-layout--mobile-view-body .app-layout__sidebar{display:none}}@media (max-width: 767px){.app-layout--mobile-view-sidebar .app-layout__grid{grid-template-areas:"sidebar"\n "sidebar"}.app-layout--mobile-view-sidebar .app-layout__header,.app-layout--mobile-view-sidebar .app-layout__navigation,.app-layout--mobile-view-sidebar .app-layout__body{display:none}}.app-layout--has-sidebar:not(.app-layout--sidebar-active) .app-layout__sidebar{display:none}@media (min-width: 768px){.app-layout--sidebar-closing .app-layout__sidebar{-webkit-animation:app-layout-sidebar-overlay-slide-out 0.3s;animation:app-layout-sidebar-overlay-slide-out 0.3s}}@media (min-width: 1440px){.app-layout--sidebar-closing .app-layout__sidebar{-webkit-animation:none;animation:none}}.app-layout__header{z-index:1;display:flex;padding-top:var(--s-space-12);padding-right:var(--s-space-16);padding-bottom:var(--s-space-12);padding-left:calc(var(--s-space-16) + var(--s-space-8) + 2.5rem);align-items:center;border-bottom:var(--s-border-width-default) solid var(--s-border-default);background-color:var(--s-background-default);grid-area:header;will-change:transform;gap:var(--s-space-8)}@media (min-width: 768px){.app-layout__header{border-right:var(--s-border-width-default) solid var(--s-border-default)}}@media (min-width: 992px){.app-layout__header{padding-left:var(--s-space-16)}}.app-layout__app-name{min-width:0}.app-layout__app-name .heading{overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.app-layout__navigation-back-button{margin-left:calc(-1 * var(--s-space-4))}.app-layout__floating-cta{position:absolute;z-index:4;right:var(--s-space-16);bottom:var(--s-space-16)}.app-layout__navigation-controls{flex-shrink:0}.app-layout__navigation{z-index:1;overflow-y:auto;border-right:var(--s-border-width-default) solid var(--s-border-default);background-color:var(--s-background-default);grid-area:navigation;will-change:transform}.app-layout__body{z-index:2;display:grid;width:100%;height:100%;grid-area:body;grid-template-rows:4rem 1fr;grid-template-areas:"app-bar"\n "content";will-change:transform}.app-layout__app-bar{display:flex;min-width:0;padding-top:var(--s-space-12);padding-right:var(--s-space-16);padding-bottom:var(--s-space-12);padding-left:calc(var(--s-space-16) + var(--s-space-8) + 2.5rem);align-items:center;border-bottom:var(--s-border-width-default) solid var(--s-border-default);background-color:var(--s-background-default);grid-area:app-bar;gap:var(--s-space-8)}@media (min-width: 992px){.app-layout__app-bar{padding-left:var(--s-space-16)}}.app-layout__back-to-navigation-button{margin-left:calc(-1 * var(--s-space-4))}@media (min-width: 768px){.app-layout__back-to-navigation-button{display:none}}.app-layout__app-bar-media{display:inline-flex;flex-shrink:0}.app-layout__app-bar-heading{min-width:0;flex-grow:1}.app-layout__app-bar-heading .heading{overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.app-layout__app-bar-subheading{display:block;overflow:hidden;max-width:100%;color:var(--s-text-subdued);font-size:var(--s-font-size-sm);line-height:var(--s-line-height-sm);white-space:nowrap;text-overflow:ellipsis}.app-layout__content{overflow:auto;background-color:var(--s-background-default);grid-area:content}.app-layout__sidebar{z-index:3;display:grid;width:100%;height:100%;border-left:var(--s-border-width-default) solid var(--s-border-default);will-change:transform;grid-area:sidebar;grid-template-rows:4rem 1fr;grid-template-areas:"sidebar-header"\n "sidebar-content"}@media (min-width: 768px){.app-layout__sidebar{-webkit-animation:app-layout-slide-in 0.3s;animation:app-layout-slide-in 0.3s}}@media (min-width: 1440px){.app-layout__sidebar{width:25rem;-webkit-animation:none;animation:none}}.app-layout__sidebar-header{display:flex;min-width:0;padding-top:var(--s-space-12);padding-right:var(--s-space-16);padding-bottom:var(--s-space-12);padding-left:calc(var(--s-space-16) + var(--s-space-8) + 2.5rem);align-items:center;border-bottom:var(--s-border-width-default) solid var(--s-border-default);background-color:var(--s-background-default);grid-area:sidebar-header;gap:var(--s-space-8)}@media (min-width: 992px){.app-layout__sidebar-header{padding-left:var(--s-space-16)}}.app-layout__sidebar-heading{min-width:0;flex-grow:1}.app-layout__sidebar-heading .heading{overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.app-layout__sidebar-close-button{margin-left:calc(-1 * var(--s-space-4))}.app-layout__sidebar-content{overflow-y:auto;background-color:var(--s-background-default);grid-area:sidebar-content}@media (max-width: 767px){.app-layout:not(.app-layout--transition-none).app-layout--transitioning-to-body.app-layout--transitioning-from-navigation:not(.app-layout--mobile-view-body) .app-layout__grid,.app-layout:not(.app-layout--transition-none).app-layout--transitioning-to-navigation.app-layout--transitioning-from-body:not(.app-layout--mobile-view-navigation) .app-layout__grid{grid-template-columns:100%;grid-template-areas:"header"\n "navigation"}.app-layout:not(.app-layout--transition-none).app-layout--transitioning-to-body.app-layout--transitioning-from-navigation:not(.app-layout--mobile-view-body) .app-layout__body,.app-layout:not(.app-layout--transition-none).app-layout--transitioning-to-navigation.app-layout--transitioning-from-body:not(.app-layout--mobile-view-navigation) .app-layout__body{position:absolute;top:0;left:0;display:grid;width:100%;transform:translate3d(100%, 0, 0)}}@media (max-width: 767px){.app-layout:not(.app-layout--transition-none).app-layout--transitioning-to-navigation.app-layout--transitioning-from-body:not(.app-layout--mobile-view-navigation) .app-layout__header{display:flex}.app-layout:not(.app-layout--transition-none).app-layout--transitioning-to-navigation.app-layout--transitioning-from-body:not(.app-layout--mobile-view-navigation) .app-layout__navigation{display:block}}@media (max-width: 991px){.app-layout:not(.app-layout--transition-none).app-layout--transitioning-to-sidebar.app-layout--transitioning-from-body:not(.app-layout--mobile-view-sidebar) .app-layout__grid,.app-layout:not(.app-layout--transition-none).app-layout--transitioning-to-body.app-layout--transitioning-from-sidebar:not(.app-layout--mobile-view-body) .app-layout__grid{grid-template-columns:100%;grid-template-areas:"body"\n "body"}.app-layout:not(.app-layout--transition-none).app-layout--transitioning-to-sidebar.app-layout--transitioning-from-body:not(.app-layout--mobile-view-sidebar) .app-layout__sidebar,.app-layout:not(.app-layout--transition-none).app-layout--transitioning-to-body.app-layout--transitioning-from-sidebar:not(.app-layout--mobile-view-body) .app-layout__sidebar{position:absolute;top:0;left:0;display:grid;border-left:var(--s-border-width-default) solid var(--s-border-default)}}@media (max-width: 991px){.app-layout:not(.app-layout--transition-none).app-layout--transitioning-to-body.app-layout--transitioning-from-sidebar:not(.app-layout--mobile-view-body) .app-layout__body{display:grid}.app-layout:not(.app-layout--transition-none).app-layout--transitioning-to-body.app-layout--transitioning-from-sidebar:not(.app-layout--mobile-view-body) .app-layout__sidebar{display:grid}}@media (max-width: 767px){.app-layout--transition-style-slides.app-layout--transitioning-to-body.app-layout--transitioning-from-navigation:not(.app-layout--mobile-view-body) .app-layout__header,.app-layout--transition-style-slides.app-layout--transitioning-to-body.app-layout--transitioning-from-navigation:not(.app-layout--mobile-view-body) .app-layout__navigation,.app-layout--transition-style-slides.app-layout--transitioning-to-navigation.app-layout--transitioning-from-body:not(.app-layout--mobile-view-navigation) .app-layout__header,.app-layout--transition-style-slides.app-layout--transitioning-to-navigation.app-layout--transitioning-from-body:not(.app-layout--mobile-view-navigation) .app-layout__navigation{-webkit-animation:app-layout-slide-out 0.4s;animation:app-layout-slide-out 0.4s}.app-layout--transition-style-slides.app-layout--transitioning-to-body.app-layout--transitioning-from-navigation:not(.app-layout--mobile-view-body) .app-layout__body,.app-layout--transition-style-slides.app-layout--transitioning-to-navigation.app-layout--transitioning-from-body:not(.app-layout--mobile-view-navigation) .app-layout__body{-webkit-animation:app-layout-slide-in 0.4s;animation:app-layout-slide-in 0.4s}.app-layout--transition-style-slides.app-layout--transitioning-to-body.app-layout--transitioning-from-navigation:not(.app-layout--mobile-view-body) .app-layout__body:after,.app-layout--transition-style-slides.app-layout--transitioning-to-navigation.app-layout--transitioning-from-body:not(.app-layout--mobile-view-navigation) .app-layout__body:after{position:absolute;top:0;right:100%;bottom:0;display:block;width:100%;background-color:rgba(0, 0, 0, 0.3);content:"";-webkit-animation:app-layout-fade-in 0.4s;animation:app-layout-fade-in 0.4s}}@media (max-width: 767px){.app-layout--transition-style-slides.app-layout--transitioning-to-navigation.app-layout--transitioning-from-body:not(.app-layout--mobile-view-navigation) .app-layout__header{animation-direction:reverse}.app-layout--transition-style-slides.app-layout--transitioning-to-navigation.app-layout--transitioning-from-body:not(.app-layout--mobile-view-navigation) .app-layout__navigation{animation-direction:reverse}.app-layout--transition-style-slides.app-layout--transitioning-to-navigation.app-layout--transitioning-from-body:not(.app-layout--mobile-view-navigation) .app-layout__body{animation-direction:reverse}.app-layout--transition-style-slides.app-layout--transitioning-to-navigation.app-layout--transitioning-from-body:not(.app-layout--mobile-view-navigation) .app-layout__body:after{animation-direction:reverse}}@media (max-width: 991px){.app-layout--transition-style-slides.app-layout--transitioning-to-sidebar.app-layout--transitioning-from-body:not(.app-layout--mobile-view-sidebar) .app-layout__body,.app-layout--transition-style-slides.app-layout--transitioning-to-body.app-layout--transitioning-from-sidebar:not(.app-layout--mobile-view-body) .app-layout__body{-webkit-animation:app-layout-slide-out 0.4s;animation:app-layout-slide-out 0.4s}.app-layout--transition-style-slides.app-layout--transitioning-to-sidebar.app-layout--transitioning-from-body:not(.app-layout--mobile-view-sidebar) .app-layout__sidebar,.app-layout--transition-style-slides.app-layout--transitioning-to-body.app-layout--transitioning-from-sidebar:not(.app-layout--mobile-view-body) .app-layout__sidebar{-webkit-animation:app-layout-slide-in 0.4s;animation:app-layout-slide-in 0.4s}.app-layout--transition-style-slides.app-layout--transitioning-to-sidebar.app-layout--transitioning-from-body:not(.app-layout--mobile-view-sidebar) .app-layout__sidebar:after,.app-layout--transition-style-slides.app-layout--transitioning-to-body.app-layout--transitioning-from-sidebar:not(.app-layout--mobile-view-body) .app-layout__sidebar:after{position:absolute;top:0;right:100%;bottom:0;display:block;width:100%;background-color:rgba(0, 0, 0, 0.3);content:"";-webkit-animation:app-layout-fade-in 0.4s;animation:app-layout-fade-in 0.4s}}@media (max-width: 991px){.app-layout--transition-style-slides.app-layout--transitioning-to-body.app-layout--transitioning-from-sidebar:not(.app-layout--mobile-view-body) .app-layout__body{animation-direction:reverse}.app-layout--transition-style-slides.app-layout--transitioning-to-body.app-layout--transitioning-from-sidebar:not(.app-layout--mobile-view-body) .app-layout__sidebar{animation-direction:reverse}.app-layout--transition-style-slides.app-layout--transitioning-to-body.app-layout--transitioning-from-sidebar:not(.app-layout--mobile-view-body) .app-layout__sidebar:after{animation-direction:reverse}}@media (max-width: 767px){.app-layout--transition-style-dialog.app-layout--transitioning-to-body.app-layout--transitioning-from-navigation:not(.app-layout--mobile-view-body) .app-layout__body,.app-layout--transition-style-dialog.app-layout--transitioning-to-navigation.app-layout--transitioning-from-body:not(.app-layout--mobile-view-navigation) .app-layout__body{-webkit-animation:app-layout-scale-in 0.3s;animation:app-layout-scale-in 0.3s}}@media (max-width: 767px){.app-layout--transition-style-dialog.app-layout--transitioning-to-navigation.app-layout--transitioning-from-body:not(.app-layout--mobile-view-navigation) .app-layout__header{animation-direction:reverse}.app-layout--transition-style-dialog.app-layout--transitioning-to-navigation.app-layout--transitioning-from-body:not(.app-layout--mobile-view-navigation) .app-layout__navigation{animation-direction:reverse}.app-layout--transition-style-dialog.app-layout--transitioning-to-navigation.app-layout--transitioning-from-body:not(.app-layout--mobile-view-navigation) .app-layout__body{animation-direction:reverse}}@media (max-width: 991px){.app-layout--transition-style-dialog.app-layout--transitioning-to-sidebar.app-layout--transitioning-from-body:not(.app-layout--mobile-view-sidebar) .app-layout__sidebar,.app-layout--transition-style-dialog.app-layout--transitioning-to-body.app-layout--transitioning-from-sidebar:not(.app-layout--mobile-view-body) .app-layout__sidebar{-webkit-animation:app-layout-scale-in 0.3s;animation:app-layout-scale-in 0.3s}}@media (max-width: 991px){.app-layout--transition-style-dialog.app-layout--transitioning-to-body.app-layout--transitioning-from-sidebar:not(.app-layout--mobile-view-body) .app-layout__body{animation-direction:reverse}.app-layout--transition-style-dialog.app-layout--transitioning-to-body.app-layout--transitioning-from-sidebar:not(.app-layout--mobile-view-body) .app-layout__sidebar{animation-direction:reverse}}@-webkit-keyframes app-layout-sidebar-overlay-slide-out{0%{transform:translate3d(0, 0, 0)}100%{transform:translate3d(100%, 0, 0)}}@keyframes app-layout-sidebar-overlay-slide-out{0%{transform:translate3d(0, 0, 0)}100%{transform:translate3d(100%, 0, 0)}}@-webkit-keyframes app-layout-slide-in{0%{transform:translate3d(100%, 0, 0)}100%{transform:translate3d(0, 0, 0)}}@keyframes app-layout-slide-in{0%{transform:translate3d(100%, 0, 0)}100%{transform:translate3d(0, 0, 0)}}@-webkit-keyframes app-layout-slide-out{0%{transform:translate3d(0, 0, 0)}100%{transform:translate3d(-20%, 0, 0)}}@keyframes app-layout-slide-out{0%{transform:translate3d(0, 0, 0)}100%{transform:translate3d(-20%, 0, 0)}}@-webkit-keyframes app-layout-fade-in{0%{opacity:0}100%{opacity:1}}@keyframes app-layout-fade-in{0%{opacity:0}100%{opacity:1}}@-webkit-keyframes app-layout-scale-in{from{transform:scale(0);box-shadow:0 0 0 100rem rgba(0, 0, 0, 0)}to{transform:scale(1);box-shadow:0 0 0 100rem rgba(0, 0, 0, 0.25)}}@keyframes app-layout-scale-in{from{transform:scale(0);box-shadow:0 0 0 100rem rgba(0, 0, 0, 0)}to{transform:scale(1);box-shadow:0 0 0 100rem rgba(0, 0, 0, 0.25)}}@-webkit-keyframes app-layout-sidebar-slide-in{from{overflow:hidden;grid-template-columns:25rem 1fr 0}to{overflow:hidden;grid-template-columns:25rem 1fr 25rem}}@keyframes app-layout-sidebar-slide-in{from{overflow:hidden;grid-template-columns:25rem 1fr 0}to{overflow:hidden;grid-template-columns:25rem 1fr 25rem}}@-webkit-keyframes app-layout-sidebar-slide-out{from{overflow:hidden;grid-template-columns:25rem 1fr 25rem}to{overflow:hidden;grid-template-columns:25rem 1fr 0}}@keyframes app-layout-sidebar-slide-out{from{overflow:hidden;grid-template-columns:25rem 1fr 25rem}to{overflow:hidden;grid-template-columns:25rem 1fr 0}}';const p=class{constructor(i){a(this,i),this.bordered=void 0,this.centerBlock=void 0,this.centerInline=void 0,this.cover=void 0,this.maxWidth=void 0,this.overflow="visible",this.padding="0"}render(){const a={alignItems:this.centerBlock?"center":void 0,display:this.centerBlock||this.centerInline?"flex":void 0,height:this.cover?"100%":void 0,justifyContent:this.centerInline?"center":void 0,overflow:this.overflow,padding:`var(--s-space-${this.padding})`,position:Boolean(this.overflow)?"relative":"",maxWidth:this.maxWidth,width:this.cover?"100%":void 0},i=n("box",{"box--bordered":this.bordered,"box--cover":this.cover});return t(o,{class:i,style:a},t("slot",null))}};p.style=":host{display:block;width:100%}:host(.box--bordered){border:var(--s-border-width-default) solid var(--s-border-default)}:host(.box--cover){width:100%;height:100%}:host *{box-sizing:border-box}";const d=class{constructor(i){a(this,i),this.heading=void 0,this.illustration=void 0}render(){return t(o,null,t("div",{class:"empty-state"},this.illustration&&t("img",{alt:"",class:"empty-state__illustration",src:this.illustration}),t("div",{class:"empty-state__body"},this.heading&&t("swirl-heading",{align:"center",as:"p",text:this.heading}),t("div",{class:"empty-state__content"},t("swirl-text",{align:"center",color:"subdued"},t("slot",null))))))}};d.style=":host{display:block}:host *{box-sizing:border-box}.empty-state{display:flex;max-width:28rem;align-items:center;flex-direction:column;gap:var(--s-space-16)}.empty-state__illustration{max-width:16rem}.empty-state__body{display:flex;align-items:center;flex-direction:column;gap:var(--s-space-8)}";const u=class{constructor(i){a(this,i),this.size=24}render(){const a=20===this.size?24:this.size,i=n("swirl-icon",`swirl-icon--size-${this.size}`);return t("svg",{class:i,fill:"none",height:this.size,part:"icon",viewBox:`0 0 ${a} ${a}`,width:this.size,xmlns:"http://www.w3.org/2000/svg"},16===this.size&&t(s,null,t("path",{d:"M3.99999 1.33334C3.26666 1.33334 2.67332 1.93334 2.67332 2.66668L2.66666 13.3333C2.66666 14.0667 3.25999 14.6667 3.99332 14.6667H12C12.7333 14.6667 13.3333 14.0667 13.3333 13.3333V5.88668C13.3333 5.53334 13.1933 5.19334 12.94 4.94668L9.71999 1.72668C9.47332 1.47334 9.13332 1.33334 8.77999 1.33334H3.99999ZM8.66666 5.33334V2.33334L12.3333 6.00001H9.33332C8.96666 6.00001 8.66666 5.70001 8.66666 5.33334Z",fill:"currentColor"})),(20===this.size||24===this.size)&&t(s,null,t("path",{d:"M6 2C4.9 2 4.01 2.9 4.01 4L4 20C4 21.1 4.89 22 5.99 22H18C19.1 22 20 21.1 20 20V8.83C20 8.3 19.79 7.79 19.41 7.42L14.58 2.59C14.21 2.21 13.7 2 13.17 2H6ZM13 8V3.5L18.5 9H14C13.45 9 13 8.55 13 8Z",fill:"currentColor"})),28===this.size&&t(s,null,t("path",{d:"M6.99999 2.33334C5.71666 2.33334 4.67832 3.38334 4.67832 4.66668L4.66666 23.3333C4.66666 24.6167 5.70499 25.6667 6.98832 25.6667H21C22.2833 25.6667 23.3333 24.6167 23.3333 23.3333V10.3017C23.3333 9.68334 23.0883 9.08834 22.645 8.65668L17.01 3.02168C16.5783 2.57834 15.9833 2.33334 15.365 2.33334H6.99999ZM15.1667 9.33334V4.08334L21.5833 10.5H16.3333C15.6917 10.5 15.1667 9.97501 15.1667 9.33334Z",fill:"currentColor"})))}};u.style=":host{display:inline-flex}";const y=class{constructor(i){a(this,i),this.size=24}render(){const a=20===this.size?24:this.size,i=n("swirl-icon",`swirl-icon--size-${this.size}`);return t("svg",{class:i,fill:"none",height:this.size,part:"icon",viewBox:`0 0 ${a} ${a}`,width:this.size,xmlns:"http://www.w3.org/2000/svg"},16===this.size&&t(s,null,t("path",{d:"M13.3333 3.99996H8.00001L7.06001 3.05996C6.80668 2.80663 6.46668 2.66663 6.11334 2.66663H2.66668C1.93334 2.66663 1.34001 3.26663 1.34001 3.99996L1.33334 12C1.33334 12.7333 1.93334 13.3333 2.66668 13.3333H13.3333C14.0667 13.3333 14.6667 12.7333 14.6667 12V5.33329C14.6667 4.59996 14.0667 3.99996 13.3333 3.99996ZM10 5.99996C10.7333 5.99996 11.3333 6.59996 11.3333 7.33329C11.3333 8.06663 10.7333 8.66663 10 8.66663C9.26668 8.66663 8.66668 8.06663 8.66668 7.33329C8.66668 6.59996 9.26668 5.99996 10 5.99996ZM12.6667 11.3333H7.33334V10.6666C7.33334 9.77996 9.11334 9.33329 10 9.33329C10.8867 9.33329 12.6667 9.77996 12.6667 10.6666V11.3333Z",fill:"currentColor"})),(20===this.size||24===this.size)&&t(s,null,t("path",{d:"M20 6H12L10.59 4.59C10.21 4.21 9.7 4 9.17 4H4C2.9 4 2.01 4.9 2.01 6L2 18C2 19.1 2.9 20 4 20H20C21.1 20 22 19.1 22 18V8C22 6.9 21.1 6 20 6ZM15 9C16.1 9 17 9.9 17 11C17 12.1 16.1 13 15 13C13.9 13 13 12.1 13 11C13 9.9 13.9 9 15 9ZM19 17H11V16C11 14.67 13.67 14 15 14C16.33 14 19 14.67 19 16V17Z",fill:"currentColor"})),28===this.size&&t(s,null,t("path",{d:"M23.3333 6.99996H14L12.355 5.35496C11.9117 4.91163 11.3167 4.66663 10.6983 4.66663H4.66668C3.38334 4.66663 2.34501 5.71663 2.34501 6.99996L2.33334 21C2.33334 22.2833 3.38334 23.3333 4.66668 23.3333H23.3333C24.6167 23.3333 25.6667 22.2833 25.6667 21V9.33329C25.6667 8.04996 24.6167 6.99996 23.3333 6.99996ZM17.5 10.5C18.7833 10.5 19.8333 11.55 19.8333 12.8333C19.8333 14.1166 18.7833 15.1666 17.5 15.1666C16.2167 15.1666 15.1667 14.1166 15.1667 12.8333C15.1667 11.55 16.2167 10.5 17.5 10.5ZM22.1667 19.8333H12.8333V18.6666C12.8333 17.115 15.9483 16.3333 17.5 16.3333C19.0517 16.3333 22.1667 17.115 22.1667 18.6666V19.8333Z",fill:"currentColor"})))}};y.style=":host{display:inline-flex}";const h=class{constructor(i){a(this,i),this.focusedIndex=0,this.onFocus=()=>{this.focusItemAtIndex(this.focusedIndex)},this.onKeyDown=a=>{"ArrowDown"===a.key?(a.preventDefault(),this.focusItemAtIndex((this.focusedIndex+1)%this.items.length)):"ArrowUp"===a.key?(a.preventDefault(),this.focusItemAtIndex(0===this.focusedIndex?this.items.length-1:this.focusedIndex-1)):"Home"===a.key?(a.preventDefault(),this.focusItemAtIndex(0)):"End"===a.key&&(a.preventDefault(),this.focusItemAtIndex(this.items.length-1))},this.label=void 0}componentDidLoad(){this.collectItems(),this.removeItemsFromTabOrder()}collectItems(){this.items=Array.from(this.el.querySelectorAll("swirl-resource-list-item, swirl-resource-list-file-item"))}removeItemsFromTabOrder(){this.items.forEach((a=>{var i,t;return null===(t=null===(i=a.shadowRoot)||void 0===i?void 0:i.querySelector(".resource-list-item__content, .resource-list-file-item"))||void 0===t?void 0:t.setAttribute("tabIndex","-1")}))}focusItemAtIndex(a){this.removeItemsFromTabOrder();const i=this.items[a];if(!Boolean(i))return;const t=i.shadowRoot.querySelector(".resource-list-item__content, .resource-list-file-item");t.setAttribute("tabIndex","0"),t.focus(),this.focusedIndex=a}render(){return t(o,{onKeyDown:this.onKeyDown},t("swirl-stack",{"aria-label":this.label,onFocus:this.onFocus,role:"grid",tabIndex:0},t("slot",null)))}get el(){return e(this)}};h.style=":host{display:block;width:100%}:host *{box-sizing:border-box}";const b=class{constructor(t){a(this,t),this.valueChange=i(this,"valueChange",7),this.onClick=()=>{this.selectable&&(this.checked=!this.checked,this.valueChange.emit(this.checked))},this.onMenuTriggerClick=a=>{this.disabled&&!Boolean(this.href)&&a.stopPropagation()},this.checked=!1,this.description=void 0,this.disabled=void 0,this.hideDivider=void 0,this.href=void 0,this.label=void 0,this.menuTriggerId=void 0,this.menuTriggerLabel="Options",this.meta=void 0,this.selectable=void 0,this.value=void 0,this.hasMedia=!1}async componentWillLoad(){this.updateMediaState()}updateMediaState(){const a=this.el.querySelector('[slot="media"]'),i=Boolean(a);i!==this.hasMedia&&(this.hasMedia=i)}render(){const a=Boolean(this.href)&&!this.selectable?"a":"button",i=this.disabled&&!Boolean(this.href),e=Boolean(this.menuTriggerId),s=e&&!Boolean(this.meta)&&!this.selectable,r=Boolean(this.meta)&&!this.selectable,l=this.selectable?String(this.checked):void 0,p=this.selectable?"checkbox":void 0,d=n("resource-list-item",{"resource-list-item--checked":this.checked,"resource-list-item--has-menu":e,"resource-list-item--hide-divider":this.hideDivider,"resource-list-item--selectable":this.selectable});return t(o,{role:"row"},t("div",{class:d,role:"gridcell"},t(a,{"aria-checked":l,"aria-disabled":i?"true":void 0,"aria-labelledby":"label",class:"resource-list-item__content",href:this.href,disabled:i,onClick:this.onClick,part:"resource-list-item__content",role:p,tabIndex:0},this.hasMedia&&t("span",{class:"resource-list-item__media"},t("slot",{name:"media"})),t("span",{class:"resource-list-item__label-container"},t("span",{class:"resource-list-item__label",id:"label"},this.label),this.description&&t("span",{class:"resource-list-item__description"},this.description))),this.selectable&&t("span",{"aria-hidden":"true",class:"resource-list-item__checkbox"},t("span",{class:"resource-list-item__checkbox-icon"},this.checked&&t("swirl-icon-check-strong",null))),r&&t("span",{class:"resource-list-item__meta"},this.meta),s&&t("swirl-button",{"aria-disabled":i?"true":void 0,class:"resource-list-item__menu-trigger",disabled:i,hideLabel:!0,icon:"<swirl-icon-more-horizontal></swirl-icon-more-horizontal>",id:this.menuTriggerId,intent:"primary",label:this.menuTriggerLabel,onClick:this.onMenuTriggerClick})))}get el(){return e(this)}};b.style=':host{display:block;width:100%}:host *{box-sizing:border-box}.resource-list-item{position:relative;width:100%}.resource-list-item--checked .resource-list-item__checkbox{border-color:var(--s-icon-highlight);color:var(--s-text-on-status);background-color:var(--s-icon-highlight)}.resource-list-item--has-menu .resource-list-item__label-container{padding-right:calc(var(--s-space-16) + 2.5rem + var(--s-space-12))}@media (min-width: 768px){.resource-list-item--selectable .resource-list-item__content{padding-left:calc(var(--s-space-16) + 1.5rem + var(--s-space-12))}}.resource-list-item--selectable .resource-list-item__label-container{padding-right:calc(var(--s-space-16) + 1.5rem + var(--s-space-12))}@media (min-width: 768px){.resource-list-item--selectable .resource-list-item__label-container{padding-right:var(--s-space-16)}}.resource-list-item--hide-divider .resource-list-item__label-container:after{display:none}.resource-list-item__content{--swirl-avatar-group-border-color:var(--s-background-default);--swirl-badge-border-color:var(--s-background-default);display:flex;width:100%;margin:0;padding-top:var(--s-space-12);padding-right:0;padding-bottom:var(--s-space-12);padding-left:var(--s-space-16);align-items:center;border:none;color:var(--s-text-default);background-color:var(--s-background-default);font:inherit;line-height:var(--s-line-height-base);text-align:left;text-decoration:none;cursor:pointer;gap:var(--s-space-12)}.resource-list-item__content:hover:not(:disabled){background-color:var(--s-background-hovered)}.resource-list-item__content:hover:not(:disabled) .resource-list-item__media{--swirl-avatar-group-border-color:var(--s-background-hovered);--swirl-badge-border-color:var(--s-background-hovered)}.resource-list-item__content:active:not(:disabled){background-color:var(--s-background-pressed)}.resource-list-item__content:active:not(:disabled) .resource-list-item__media{--swirl-avatar-group-border-color:var(--s-background-pressed);--swirl-badge-border-color:var(--s-background-pressed)}.resource-list-item__content:focus{outline:none}.resource-list-item__content:focus-visible{background-color:var(--s-background-hovered)}.resource-list-item__content:focus-visible .resource-list-item__media{--swirl-avatar-group-border-color:var(--s-background-hovered);--swirl-badge-border-color:var(--s-background-hovered)}.resource-list-item__content:disabled{color:var(--s-text-disabled);background-color:var(--s-background-default);cursor:default}.resource-list-item__content:disabled .resource-list-item__description{color:var(--s-text-disabled)}@media (min-width: 992px) and (max-width: 1439px) and (hover: hover),(min-width: 1440px){.resource-list-item__content{padding:var(--s-space-12);font-size:var(--s-font-size-sm);line-height:var(--s-line-height-sm)}}.resource-list-item__media{display:inline-flex}.resource-list-item__label-container{position:relative;display:flex;min-width:0;min-height:2.875rem;padding-right:var(--s-space-16);flex-grow:1;justify-content:center;flex-direction:column}.resource-list-item__label-container:after{position:absolute;right:0;bottom:calc(-1 * var(--s-space-12));left:0;height:0.0625rem;background-color:var(--s-border-default);content:""}.resource-list-item__label{overflow:hidden;font-weight:var(--s-font-weight-medium);white-space:nowrap;text-overflow:ellipsis}.resource-list-item__description{overflow:hidden;margin-top:var(--s-space-2);color:var(--s-text-subdued);font-size:var(--s-font-size-sm);line-height:var(--s-line-height-sm);white-space:nowrap;text-overflow:ellipsis}.resource-list-item__menu-trigger{position:absolute;top:50%;right:var(--s-space-16);transform:translateY(-50%)}.resource-list-item__checkbox{position:absolute;top:50%;right:var(--s-space-16);display:flex;width:1.25rem;height:1.25rem;justify-content:center;align-items:center;border:0.125rem solid var(--s-icon-default);border-radius:var(--s-border-radius-s);transform:translateY(-50%)}@media (min-width: 768px){.resource-list-item__checkbox{right:auto;left:var(--s-space-16)}}.resource-list-item__checkbox-icon{display:inline-flex;width:1.0625rem;height:1.0625rem}.resource-list-item__checkbox-icon>*::part(icon){width:1.0625rem;height:1.0625rem}.resource-list-item__meta{position:absolute;top:calc(var(--s-space-12) + var(--s-space-4));right:var(--s-space-16);color:var(--s-text-subdued);font-size:var(--s-font-size-sm)}';export{l as swirl_app_layout,p as swirl_box,d as swirl_empty_state,u as swirl_icon_file,y as swirl_icon_folder_shared,h as swirl_resource_list,b as swirl_resource_list_item}