@esri/calcite-components
Version:
Web Components for Esri's Calcite Design System.
1 lines • 21 kB
JavaScript
var __awaiter=this&&this.__awaiter||function(e,t,a,n){function r(e){return e instanceof a?e:new a((function(t){t(e)}))}return new(a||(a=Promise))((function(a,i){function o(e){try{l(n.next(e))}catch(t){i(t)}}function s(e){try{l(n["throw"](e))}catch(t){i(t)}}function l(e){e.done?a(e.value):r(e.value).then(o,s)}l((n=n.apply(e,t||[])).next())}))};var __generator=this&&this.__generator||function(e,t){var a={label:0,sent:function(){if(i[0]&1)throw i[1];return i[1]},trys:[],ops:[]},n,r,i,o;return o={next:s(0),throw:s(1),return:s(2)},typeof Symbol==="function"&&(o[Symbol.iterator]=function(){return this}),o;function s(e){return function(t){return l([e,t])}}function l(o){if(n)throw new TypeError("Generator is already executing.");while(a)try{if(n=1,r&&(i=o[0]&2?r["return"]:o[0]?r["throw"]||((i=r["return"])&&i.call(r),0):r.next)&&!(i=i.call(r,o[1])).done)return i;if(r=0,i)o=[o[0]&2,i.value];switch(o[0]){case 0:case 1:i=o;break;case 4:a.label++;return{value:o[1],done:false};case 5:a.label++;r=o[1];o=[0];continue;case 7:o=a.ops.pop();a.trys.pop();continue;default:if(!(i=a.trys,i=i.length>0&&i[i.length-1])&&(o[0]===6||o[0]===2)){a=0;continue}if(o[0]===3&&(!i||o[1]>i[0]&&o[1]<i[3])){a.label=o[1];break}if(o[0]===6&&a.label<i[1]){a.label=i[1];i=o;break}if(i&&a.label<i[2]){a.label=i[2];a.ops.push(o);break}if(i[2])a.ops.pop();a.trys.pop();continue}o=t.call(e,a)}catch(s){o=[6,s];r=0}finally{n=i=0}if(o[0]&5)throw o[1];return{value:o[0]?o[1]:void 0,done:true}}};import{r as registerInstance,h,H as Host,g as getElement,c as createEvent}from"./index-8fd57462.js";import{f as focusElement,c as getSlotted,g as getElementDir}from"./dom-d9ba1da4.js";import{C as CSS_UTILITY}from"./resources-f0858a17.js";import{g as getRoundRobinIndex}from"./array-af19adb2.js";var CSS={frame:"frame",frameAdvancing:"frame--advancing",frameRetreating:"frame--retreating"};var calciteFlowCss="@-webkit-keyframes in{0%{opacity:0}100%{opacity:1}}@keyframes in{0%{opacity:0}100%{opacity:1}}@-webkit-keyframes in-down{0%{opacity:0;-webkit-transform:translate3D(0, -5px, 0);transform:translate3D(0, -5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@keyframes in-down{0%{opacity:0;-webkit-transform:translate3D(0, -5px, 0);transform:translate3D(0, -5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@-webkit-keyframes in-up{0%{opacity:0;-webkit-transform:translate3D(0, 5px, 0);transform:translate3D(0, 5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@keyframes in-up{0%{opacity:0;-webkit-transform:translate3D(0, 5px, 0);transform:translate3D(0, 5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@-webkit-keyframes in-scale{0%{opacity:0;-webkit-transform:scale3D(0.95, 0.95, 1);transform:scale3D(0.95, 0.95, 1)}100%{opacity:1;-webkit-transform:scale3D(1, 1, 1);transform:scale3D(1, 1, 1)}}@keyframes in-scale{0%{opacity:0;-webkit-transform:scale3D(0.95, 0.95, 1);transform:scale3D(0.95, 0.95, 1)}100%{opacity:1;-webkit-transform:scale3D(1, 1, 1);transform:scale3D(1, 1, 1)}}:host{-webkit-box-sizing:border-box;box-sizing:border-box;background-color:var(--calcite-ui-foreground-1);color:var(--calcite-ui-text-2);font-size:var(--calcite-font-size--1)}:host *{-webkit-box-sizing:border-box;box-sizing:border-box}:host{--calcite-icon-size:1rem;--calcite-spacing-quarter:0.25rem;--calcite-spacing-half:0.5rem;--calcite-spacing-three-quarters:0.75rem;--calcite-spacing:1rem;--calcite-spacing-plus-quarter:1.25rem;--calcite-spacing-plus-half:1.5rem;--calcite-spacing-double:2rem;--calcite-menu-min-width:10rem;--calcite-header-min-height:3rem;--calcite-footer-min-height:3rem}:root{--calcite-popper-transition:150ms ease-in-out}:host([hidden]){display:none}:host{-ms-flex-align:stretch;align-items:stretch;background-color:transparent;display:-ms-flexbox;display:flex;width:100%;height:100%;overflow:hidden;position:relative}:host .frame{-ms-flex-align:stretch;align-items:stretch;width:100%;padding:0;margin:0;display:-ms-flexbox;display:flex;-ms-flex-flow:column;flex-flow:column;position:relative}:host ::slotted(calcite-panel){height:100%}:host .frame--advancing{-webkit-animation:calcite-frame-advance 150ms ease-in-out;animation:calcite-frame-advance 150ms ease-in-out}:host .frame--retreating{-webkit-animation:calcite-frame-retreat 150ms ease-in-out;animation:calcite-frame-retreat 150ms ease-in-out}@-webkit-keyframes calcite-frame-advance{0%{opacity:0.5;-webkit-transform:translate3d(50px, 0, 0);transform:translate3d(50px, 0, 0)}100%{opacity:1;-webkit-transform:translate3d(0, 0, 0);transform:translate3d(0, 0, 0)}}@keyframes calcite-frame-advance{0%{opacity:0.5;-webkit-transform:translate3d(50px, 0, 0);transform:translate3d(50px, 0, 0)}100%{opacity:1;-webkit-transform:translate3d(0, 0, 0);transform:translate3d(0, 0, 0)}}@-webkit-keyframes calcite-frame-retreat{0%{opacity:0.5;-webkit-transform:translate3d(-50px, 0, 0);transform:translate3d(-50px, 0, 0)}100%{opacity:1;-webkit-transform:translate3d(0, 0, 0);transform:translate3d(0, 0, 0)}}@keyframes calcite-frame-retreat{0%{opacity:0.5;-webkit-transform:translate3d(-50px, 0, 0);transform:translate3d(-50px, 0, 0)}100%{opacity:1;-webkit-transform:translate3d(0, 0, 0);transform:translate3d(0, 0, 0)}}";var CalciteFlow=function(){function e(e){var t=this;registerInstance(this,e);this.panelCount=0;this.flowDirection=null;this.panels=[];this.getFlowDirection=function(e,t){var a=e>1;var n=e&&t>1;if(!n&&!a){return null}return t<e?"retreating":"advancing"};this.updateFlowProps=function(){var e=t.panels;var a=Array.from(t.el.querySelectorAll("calcite-panel"));var n=e.length;var r=a.length;var i=a[r-1];var o=a[r-2];if(r&&i){a.forEach((function(e){e.showBackButton=r>1;e.hidden=e!==i}))}if(o){o.menuOpen=false}t.panels=a;if(n!==r){var s=t.getFlowDirection(n,r);t.panelCount=r;t.flowDirection=s}};this.panelItemObserver=new MutationObserver(this.updateFlowProps)}e.prototype.back=function(){return __awaiter(this,void 0,void 0,(function(){var e,t;return __generator(this,(function(a){e=this.el.querySelector("calcite-panel:last-child");if(!e){return[2]}t=e.beforeBack?e.beforeBack:function(){return Promise.resolve()};return[2,t.call(e).then((function(){e.remove();return e}))]}))}))};e.prototype.connectedCallback=function(){this.panelItemObserver.observe(this.el,{childList:true,subtree:true});this.updateFlowProps()};e.prototype.disconnectedCallback=function(){this.panelItemObserver.disconnect()};e.prototype.handleCalcitePanelBackClick=function(){this.back()};e.prototype.render=function(){var e;var t=this,a=t.flowDirection,n=t.panelCount;var r=(e={},e[CSS.frame]=true,e[CSS.frameAdvancing]=a==="advancing",e[CSS.frameRetreating]=a==="retreating",e);return h(Host,null,h("div",{class:r,key:n},h("slot",null)))};Object.defineProperty(e.prototype,"el",{get:function(){return getElement(this)},enumerable:false,configurable:true});return e}();CalciteFlow.style=calciteFlowCss;var CSS$1={backButton:"back-button",container:"container",header:"header",heading:"heading",summary:"summary",headerContent:"header-content",headerActions:"header-actions",headerActionsEnd:"header-actions--end",headerActionsStart:"header-actions--start",contentContainer:"content-container",fabContainer:"fab-container",footer:"footer",menuContainer:"menu-container",menuButton:"menu-button",menu:"menu",menuOpen:"menu--open"};var ICONS={close:"x",menu:"ellipsis",backLeft:"chevron-left",backRight:"chevron-right"};var SLOTS={headerActionsStart:"header-actions-start",headerActionsEnd:"header-actions-end",headerMenuActions:"header-menu-actions",headerContent:"header-content",fab:"fab",footer:"footer",footerActions:"footer-actions"};var TEXT={back:"Back",close:"Close",open:"Open",options:"Options"};var calcitePanelCss="@-webkit-keyframes in{0%{opacity:0}100%{opacity:1}}@keyframes in{0%{opacity:0}100%{opacity:1}}@-webkit-keyframes in-down{0%{opacity:0;-webkit-transform:translate3D(0, -5px, 0);transform:translate3D(0, -5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@keyframes in-down{0%{opacity:0;-webkit-transform:translate3D(0, -5px, 0);transform:translate3D(0, -5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@-webkit-keyframes in-up{0%{opacity:0;-webkit-transform:translate3D(0, 5px, 0);transform:translate3D(0, 5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@keyframes in-up{0%{opacity:0;-webkit-transform:translate3D(0, 5px, 0);transform:translate3D(0, 5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@-webkit-keyframes in-scale{0%{opacity:0;-webkit-transform:scale3D(0.95, 0.95, 1);transform:scale3D(0.95, 0.95, 1)}100%{opacity:1;-webkit-transform:scale3D(1, 1, 1);transform:scale3D(1, 1, 1)}}@keyframes in-scale{0%{opacity:0;-webkit-transform:scale3D(0.95, 0.95, 1);transform:scale3D(0.95, 0.95, 1)}100%{opacity:1;-webkit-transform:scale3D(1, 1, 1);transform:scale3D(1, 1, 1)}}:host{-webkit-box-sizing:border-box;box-sizing:border-box;background-color:var(--calcite-ui-foreground-1);color:var(--calcite-ui-text-2);font-size:var(--calcite-font-size--1)}:host *{-webkit-box-sizing:border-box;box-sizing:border-box}:host{--calcite-icon-size:1rem;--calcite-spacing-quarter:0.25rem;--calcite-spacing-half:0.5rem;--calcite-spacing-three-quarters:0.75rem;--calcite-spacing:1rem;--calcite-spacing-plus-quarter:1.25rem;--calcite-spacing-plus-half:1.5rem;--calcite-spacing-double:2rem;--calcite-menu-min-width:10rem;--calcite-header-min-height:3rem;--calcite-footer-min-height:3rem}:root{--calcite-popper-transition:150ms ease-in-out}:host([hidden]){display:none}:host{display:-ms-flexbox;display:flex;position:relative;max-height:var(--calcite-panel-max-height);width:var(--calcite-panel-width);max-width:var(--calcite-panel-max-width);min-width:var(--calcite-panel-min-width);-webkit-transition:max-height 150ms ease-in-out, width 150ms ease-in-out;transition:max-height 150ms ease-in-out, width 150ms ease-in-out;--calcite-min-header-height:calc(var(--calcite-icon-size) * 3);--calcite-panel-max-height:unset;--calcite-panel-width:100%;--calcite-panel-min-width:unset;--calcite-panel-max-width:unset}.header{margin:0;display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;-ms-flex-pack:justify;justify-content:space-between;color:var(--calcite-ui-text-2);fill:var(--calcite-ui-text-2)}.heading{padding:0;margin:0;font-weight:var(--calcite-font-weight-medium);line-height:1.5}.header .heading{-ms-flex:1 0 auto;flex:1 0 auto;padding:var(--calcite-spacing-half) var(--calcite-spacing-half)}h1.heading{font-size:var(--calcite-font-size-2)}h2.heading{font-size:var(--calcite-font-size-1)}h3.heading{font-size:var(--calcite-font-size-0)}h4.heading,h5.heading{font-size:var(--calcite-font-size--1)}.container{-ms-flex-align:stretch;align-items:stretch;background-color:var(--calcite-ui-background);height:100%;width:100%;padding:0;margin:0;display:-ms-flexbox;display:flex;-ms-flex-flow:column;flex-flow:column}calcite-scrim{-ms-flex-align:stretch;align-items:stretch;width:100%;height:100%;display:-ms-flexbox;display:flex;-ms-flex-flow:column;flex-flow:column;pointer-events:none}:host([height-scale=s]){--calcite-panel-max-height:40vh}:host([height-scale=m]){--calcite-panel-max-height:60vh}:host([height-scale=l]){--calcite-panel-max-height:80vh}:host([width-scale=s]){--calcite-panel-width:12vw;--calcite-panel-max-width:300px;--calcite-panel-min-width:150px}:host([width-scale=m]){--calcite-panel-width:20vw;--calcite-panel-max-width:420px;--calcite-panel-min-width:240px}:host([width-scale=l]){--calcite-panel-width:45vw;--calcite-panel-max-width:680px;--calcite-panel-min-width:340px}.container[hidden]{display:none}:host([loading]) .container,:host([disabled]) .container{position:relative;z-index:1}.header{-ms-flex-align:stretch;align-items:stretch;background-color:var(--calcite-ui-foreground-1);-ms-flex:0 0 auto;flex:0 0 auto;-ms-flex-pack:start;justify-content:flex-start;min-height:var(--calcite-header-min-height);position:-webkit-sticky;position:sticky;top:0;z-index:2;border-bottom:1px solid var(--calcite-ui-border-3);width:100%}.header-content{display:block;overflow:hidden;margin-right:auto;padding:var(--calcite-spacing) var(--calcite-spacing-three-quarters)}.header-content .heading,.header-content .summary{padding:0;display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;width:100%}.header-content .heading{font-weight:var(--calcite-font-weight-medium);margin:0 0 var(--calcite-spacing-quarter);font-size:var(--calcite-font-size-0)}.header-content .heading:only-child{margin-bottom:0}.header-content .summary{color:var(--calcite-ui-text-3);font-size:var(--calcite-font-size--2)}.header-actions{-ms-flex-align:stretch;align-items:stretch;display:-ms-flexbox;display:flex;-ms-flex-flow:row nowrap;flex-flow:row nowrap}.menu-container:only-child{margin-left:auto}.menu-button{-ms-flex-item-align:stretch;align-self:stretch;-ms-flex:0 1 auto;flex:0 1 auto;height:100%;position:relative}.menu{min-width:var(--calcite-menu-min-width);-ms-flex-flow:column nowrap;flex-flow:column nowrap}.content-container{-ms-flex-align:stretch;align-items:stretch;background-color:var(--calcite-ui-background);display:-ms-flexbox;display:flex;-ms-flex-flow:column nowrap;flex-flow:column nowrap;-ms-flex:1 1 auto;flex:1 1 auto;overflow:auto}.footer{background-color:var(--calcite-ui-foreground-1);border-top:1px solid var(--calcite-ui-border-3);display:-ms-flexbox;display:flex;-ms-flex:0 0 auto;flex:0 0 auto;-ms-flex-pack:space-evenly;justify-content:space-evenly;min-height:var(--calcite-footer-min-height);padding:var(--calcite-spacing-half) var(--calcite-spacing-half);position:-webkit-sticky;position:sticky;bottom:0;width:100%}.calcite--rtl .header-content{margin-left:auto;margin-right:unset}.calcite--rtl .menu-container:only-child{margin-left:unset;margin-right:auto}.fab-container{position:-webkit-sticky;position:sticky;z-index:1;bottom:0;display:inline-block;margin:0 auto;padding:var(--calcite-spacing-half) var(--calcite-spacing-half);left:0;right:0}";var SUPPORTED_ARROW_KEYS=["ArrowUp","ArrowDown"];var CalcitePanel=function(){function e(e){var t=this;registerInstance(this,e);this.calcitePanelDismissedChange=createEvent(this,"calcitePanelDismissedChange",7);this.calcitePanelScroll=createEvent(this,"calcitePanelScroll",7);this.calcitePanelBackClick=createEvent(this,"calcitePanelBackClick",7);this.dismissed=false;this.disabled=false;this.dismissible=false;this.showBackButton=false;this.loading=false;this.intlOptions=TEXT.options;this.menuOpen=false;this.setContainerRef=function(e){t.containerEl=e};this.setMenuButonRef=function(e){t.menuButtonEl=e};this.setDismissRef=function(e){t.dismissButtonEl=e};this.setBackRef=function(e){t.backButtonEl=e};this.panelKeyUpHandler=function(e){if(e.key==="Escape"){t.dismiss()}};this.dismiss=function(){t.dismissed=true};this.panelScrollHandler=function(){t.calcitePanelScroll.emit()};this.backButtonClick=function(){t.calcitePanelBackClick.emit()};this.toggleMenuOpen=function(){t.menuOpen=!t.menuOpen};this.menuButtonKeyDown=function(e){var a=e.key;var n=t.menuOpen;if(!t.isValidKey(a,SUPPORTED_ARROW_KEYS)){return}var r=t.queryActions();var i=r.length;if(!i){return}e.preventDefault();if(!n){t.menuOpen=true}if(a==="ArrowUp"){var o=r[i-1];focusElement(o)}if(a==="ArrowDown"){var s=r[0];focusElement(s)}};this.menuActionsKeydown=function(e){var a=e.key,n=e.target;if(!t.isValidKey(a,SUPPORTED_ARROW_KEYS)){return}var r=t.queryActions();var i=r.length;var o=r.indexOf(n);if(!i||o===-1){return}e.preventDefault();if(a==="ArrowUp"){var s=getRoundRobinIndex(o-1,i);var l=r[s];focusElement(l)}if(a==="ArrowDown"){var s=getRoundRobinIndex(o+1,i);var c=r[s];focusElement(c)}};this.menuActionsContainerKeyDown=function(e){var a=e.key;if(a==="Escape"){t.menuOpen=false}}}e.prototype.dismissedHandler=function(){this.calcitePanelDismissedChange.emit()};e.prototype.queryActions=function(){return getSlotted(this.el,SLOTS.headerActionsEnd,{all:true})};e.prototype.isValidKey=function(e,t){return!!t.find((function(t){return t===e}))};e.prototype.setFocus=function(e){return __awaiter(this,void 0,void 0,(function(){var t,a,n;return __generator(this,(function(r){if(e==="dismiss-button"){(t=this.dismissButtonEl)===null||t===void 0?void 0:t.setFocus();return[2]}if(e==="back-button"){(a=this.backButtonEl)===null||a===void 0?void 0:a.setFocus();return[2]}(n=this.containerEl)===null||n===void 0?void 0:n.focus();return[2]}))}))};e.prototype.renderBackButton=function(){var e=this.el;var t=getElementDir(e)==="rtl";var a=this,n=a.showBackButton,r=a.intlBack,i=a.backButtonClick;var o=r||TEXT.back;var s=t?ICONS.backRight:ICONS.backLeft;return n?h("calcite-action",{"aria-label":o,class:CSS$1.backButton,icon:s,key:"back-button",onClick:i,ref:this.setBackRef,scale:"s",slot:SLOTS.headerActionsStart,text:o}):null};e.prototype.renderHeaderContent=function(){var e=this,t=e.heading,a=e.summary;var n=t?h("h3",{class:CSS$1.heading},t):null;var r=a?h("span",{class:CSS$1.summary},a):null;return n||r?h("div",{class:CSS$1.headerContent,key:"header-content"},n,r):null};e.prototype.renderHeaderSlottedContent=function(){return h("div",{class:CSS$1.headerContent,key:"header-content"},h("slot",{name:SLOTS.headerContent}))};e.prototype.renderHeaderStartActions=function(){var e;var t=this.el;var a=getSlotted(t,SLOTS.headerActionsStart);return a?h("div",{class:(e={},e[CSS$1.headerActionsStart]=true,e[CSS$1.headerActions]=true,e),key:"header-actions-start"},h("slot",{name:SLOTS.headerActionsStart})):null};e.prototype.renderHeaderActionsEnd=function(){var e;var t=this,a=t.dismiss,n=t.dismissible,r=t.el,i=t.intlClose;var o=i||TEXT.close;var s=n?h("calcite-action",{"aria-label":o,icon:ICONS.close,onClick:a,ref:this.setDismissRef,text:o}):null;var l=h("slot",{name:SLOTS.headerActionsEnd});var c=getSlotted(r,SLOTS.headerActionsEnd);return c||s?h("div",{class:(e={},e[CSS$1.headerActionsEnd]=true,e[CSS$1.headerActions]=true,e),key:"header-actions-end"},l,s):null};e.prototype.renderMenuItems=function(){var e=this,t=e.menuOpen,a=e.menuButtonEl,n=e.intlOptions;return h("calcite-popover",{disablePointer:true,flipPlacements:["bottom-end","top-end"],label:n,offsetDistance:0,onKeyDown:this.menuActionsKeydown,open:t,placement:"bottom-end",referenceElement:a},h("div",{class:CSS$1.menu},h("slot",{name:SLOTS.headerMenuActions})))};e.prototype.renderMenuButton=function(){var e=this,t=e.menuOpen,a=e.intlOpen,n=e.intlClose;var r=n||TEXT.close;var i=a||TEXT.open;var o=t?r:i;return h("calcite-action",{"aria-label":o,class:CSS$1.menuButton,icon:ICONS.menu,onClick:this.toggleMenuOpen,onKeyDown:this.menuButtonKeyDown,ref:this.setMenuButonRef,text:o})};e.prototype.renderMenu=function(){var e=this.el;var t=getSlotted(e,SLOTS.headerMenuActions);return t?h("div",{class:CSS$1.menuContainer,onKeyDown:this.menuActionsContainerKeyDown},this.renderMenuButton(),this.renderMenuItems()):null};e.prototype.renderHeaderNode=function(){var e=this,t=e.el,a=e.showBackButton;var n=this.renderBackButton();var r=getSlotted(t,SLOTS.headerContent);var i=r?this.renderHeaderSlottedContent():this.renderHeaderContent();var o=this.renderHeaderStartActions();var s=this.renderHeaderActionsEnd();var l=this.renderMenu();return o||i||s||l||a?h("header",{class:CSS$1.header},n,o,i,s,l):null};e.prototype.renderFooterSlottedContent=function(){var e=this.el;var t=getSlotted(e,SLOTS.footer);return t?h("footer",{class:CSS$1.footer},h("slot",{name:SLOTS.footer})):null};e.prototype.renderFooterActions=function(){var e=this.el;var t=getSlotted(e,SLOTS.footerActions);return t?h("footer",{class:CSS$1.footer},h("slot",{name:SLOTS.footerActions})):null};e.prototype.renderContent=function(){return h("section",{class:CSS$1.contentContainer,onScroll:this.panelScrollHandler,tabIndex:0},h("slot",null),this.renderFab())};e.prototype.renderFab=function(){var e=this.el;var t=getSlotted(e,SLOTS.fab);return t?h("div",{class:CSS$1.fabContainer},h("slot",{name:SLOTS.fab})):null};e.prototype.render=function(){var e;var t=this,a=t.dismissed,n=t.disabled,r=t.dismissible,i=t.el,o=t.loading,s=t.panelKeyUpHandler;var l=getElementDir(i)==="rtl";var c=h("article",{"aria-busy":o.toString(),class:(e={},e[CSS$1.container]=true,e[CSS_UTILITY.rtl]=l,e),hidden:r&&a,onKeyUp:s,ref:this.setContainerRef,tabIndex:r?0:-1},this.renderHeaderNode(),this.renderContent(),this.renderFooterSlottedContent()||this.renderFooterActions());return h(Host,null,o||n?h("calcite-scrim",{loading:o},c):c)};Object.defineProperty(e.prototype,"el",{get:function(){return getElement(this)},enumerable:false,configurable:true});Object.defineProperty(e,"watchers",{get:function(){return{dismissed:["dismissedHandler"]}},enumerable:false,configurable:true});return e}();CalcitePanel.style=calcitePanelCss;export{CalciteFlow as calcite_flow,CalcitePanel as calcite_panel};