@esri/calcite-components
Version:
Web Components for Esri's Calcite Design System.
1 lines • 14 kB
JavaScript
var __awaiter=this&&this.__awaiter||function(e,t,a,n){function i(e){return e instanceof a?e:new a((function(t){t(e)}))}return new(a||(a=Promise))((function(a,r){function o(e){try{s(n.next(e))}catch(t){r(t)}}function l(e){try{s(n["throw"](e))}catch(t){r(t)}}function s(e){e.done?a(e.value):i(e.value).then(o,l)}s((n=n.apply(e,t||[])).next())}))};var __generator=this&&this.__generator||function(e,t){var a={label:0,sent:function(){if(r[0]&1)throw r[1];return r[1]},trys:[],ops:[]},n,i,r,o;return o={next:l(0),throw:l(1),return:l(2)},typeof Symbol==="function"&&(o[Symbol.iterator]=function(){return this}),o;function l(e){return function(t){return s([e,t])}}function s(o){if(n)throw new TypeError("Generator is already executing.");while(a)try{if(n=1,i&&(r=o[0]&2?i["return"]:o[0]?i["throw"]||((r=i["return"])&&r.call(i),0):i.next)&&!(r=r.call(i,o[1])).done)return r;if(i=0,r)o=[o[0]&2,r.value];switch(o[0]){case 0:case 1:r=o;break;case 4:a.label++;return{value:o[1],done:false};case 5:a.label++;i=o[1];o=[0];continue;case 7:o=a.ops.pop();a.trys.pop();continue;default:if(!(r=a.trys,r=r.length>0&&r[r.length-1])&&(o[0]===6||o[0]===2)){a=0;continue}if(o[0]===3&&(!r||o[1]>r[0]&&o[1]<r[3])){a.label=o[1];break}if(o[0]===6&&a.label<r[1]){a.label=r[1];r=o;break}if(r&&a.label<r[2]){a.label=r[2];a.ops.push(o);break}if(r[2])a.ops.pop();a.trys.pop();continue}o=t.call(e,a)}catch(l){o=[6,l];i=0}finally{n=r=0}if(o[0]&5)throw o[1];return{value:o[0]?o[1]:void 0,done:true}}};System.register(["./p-1720b7a7.system.js","./p-60d9e7d4.system.js","./p-0a18b2ae.system.js","./p-2c235db8.system.js"],(function(e){"use strict";var t,a,n,i,r,o,l,s,c;return{setters:[function(e){t=e.r;a=e.c;n=e.h;i=e.F;r=e.g},function(e){o=e.g;l=e.b;s=e.C},function(e){c=e.C},function(){}],execute:function(){var d={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 h={close:"x",menu:"ellipsis",backLeft:"chevron-left",backRight:"chevron-right"};var u={headerActionsStart:"header-actions-start",headerActionsEnd:"header-actions-end",headerMenuActions:"header-menu-actions",headerContent:"header-content",fab:"fab",footer:"footer",footerActions:"footer-actions"};var f={back:"Back",close:"Close",open:"Open",options:"Options"};var m=3;var p="@-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}:root{--calcite-popper-transition:150ms ease-in-out}:host([hidden]){display:none}:host{display:-ms-flexbox;display:flex;-ms-flex:1 1 auto;flex:1 1 auto;overflow:hidden;position:relative;width:100%;--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{display:-ms-flexbox;display:flex;-ms-flex:1 1 auto;flex:1 1 auto;-ms-flex-direction:column;flex-direction:column;-ms-flex-align:stretch;align-items:stretch;background-color:var(--calcite-ui-background);width:100%;padding:0;margin:0;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}: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:calc(var(--calcite-panel-width-multiplier) * 12vw);--calcite-panel-max-width:calc(var(--calcite-panel-width-multiplier) * 300px);--calcite-panel-min-width:calc(var(--calcite-panel-width-multiplier) * 150px)}:host([width-scale=m]){--calcite-panel-width:calc(var(--calcite-panel-width-multiplier) * 20vw);--calcite-panel-max-width:calc(var(--calcite-panel-width-multiplier) * 420px);--calcite-panel-min-width:calc(var(--calcite-panel-width-multiplier) * 240px)}:host([width-scale=l]){--calcite-panel-width:calc(var(--calcite-panel-width-multiplier) * 45vw);--calcite-panel-max-width:calc(var(--calcite-panel-width-multiplier) * 680px);--calcite-panel-min-width:calc(var(--calcite-panel-width-multiplier) * 340px)}.container[hidden]{display:none}:host([loading]) .container,:host([disabled]) .container{position:relative;z-index:1}.header{border-bottom:1px solid;-ms-flex-align:stretch;align-items:stretch;background-color:var(--calcite-ui-foreground-1);-ms-flex-pack:start;justify-content:flex-start;position:-webkit-sticky;position:sticky;top:0;border-bottom-color:var(--calcite-ui-border-3);width:100%;-ms-flex:0 0 auto;flex:0 0 auto;min-height:3rem;z-index:2;width:100%}.header-content{display:block;overflow:hidden;margin-right:auto;padding-top:1rem;padding-bottom:1rem;padding-left:0.75rem;padding-right:0.75rem}.header-content .heading,.header-content .summary{padding:0;display:block;overflow:hidden;white-space:nowrap;width:100%;text-overflow:ellipsis}.header-content .heading{font-weight:var(--calcite-font-weight-medium);margin-top:0;margin-left:0;margin-right:0;margin-bottom:0.25rem;font-size:var(--calcite-font-size-0);line-height:1.25rem}.header-content .heading:only-child{margin-bottom:0}.header-content .summary{color:var(--calcite-ui-text-2);font-size:var(--calcite-font-size--1);line-height:1rem}.back-button{border-color:var(--calcite-ui-border-3);border-style:solid;border-width:0;border-right-width:1px}.calcite--rtl .back-button{border-right-width:0;border-left-width:1px}.header-actions{display:-ms-flexbox;display:flex;-ms-flex-align:stretch;align-items:stretch;-ms-flex-direction:row;flex-direction:row;-ms-flex-wrap:nowrap;flex-wrap:nowrap}.header-actions--end{margin-left:auto}.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:10rem;-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:1 1 auto;flex:1 1 auto;overflow:auto;-ms-flex-wrap:nowrap;flex-wrap:nowrap;-ms-flex-direction:column;flex-direction:column}.footer{border-top:1px solid;background-color:var(--calcite-ui-foreground-1);border-top-color:var(--calcite-ui-border-3);display:-ms-flexbox;display:flex;-ms-flex-pack:space-evenly;justify-content:space-evenly;position:-webkit-sticky;position:sticky;bottom:0;width:100%;-ms-flex:0 0 auto;flex:0 0 auto;min-height:3rem;padding:0.5rem}.calcite--rtl .header-content{margin-left:auto;margin-right:unset}.calcite--rtl .header-actions--end{margin-right:auto;margin-left:unset}.calcite--rtl .menu-container:only-child{margin-right:auto;margin-left:unset}.fab-container{display:inline-block;position:-webkit-sticky;position:sticky;margin-top:0;margin-bottom:0;margin-left:auto;margin-right:auto;padding:0.5rem;bottom:0;left:0;right:0;z-index:1}";var b=e("calcite_panel",function(){function e(e){var n=this;t(this,e);this.calcitePanelDismissedChange=a(this,"calcitePanelDismissedChange",7);this.calcitePanelScroll=a(this,"calcitePanelScroll",7);this.calcitePanelBackClick=a(this,"calcitePanelBackClick",7);this.dismissed=false;this.disabled=false;this.dismissible=false;this.showBackButton=false;this.loading=false;this.menuOpen=false;this.setContainerRef=function(e){n.containerEl=e};this.setDismissRef=function(e){n.dismissButtonEl=e};this.setBackRef=function(e){n.backButtonEl=e};this.panelKeyUpHandler=function(e){if(e.key==="Escape"){n.dismiss()}};this.dismiss=function(){n.dismissed=true};this.panelScrollHandler=function(){n.calcitePanelScroll.emit()};this.backButtonClick=function(){n.calcitePanelBackClick.emit()}}e.prototype.dismissedHandler=function(){this.calcitePanelDismissedChange.emit()};e.prototype.setFocus=function(e){return __awaiter(this,void 0,void 0,(function(){var t,a,n;return __generator(this,(function(i){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=o(e)==="rtl";var a=this,i=a.showBackButton,r=a.intlBack,l=a.backButtonClick;var s=r||f.back;var c=t?h.backRight:h.backLeft;return i?n("calcite-action",{"aria-label":s,class:d.backButton,icon:c,key:"back-button",onClick:l,ref:this.setBackRef,scale:"s",slot:u.headerActionsStart,text:s}):null};e.prototype.renderHeaderContent=function(){var e=this,t=e.heading,a=e.headingLevel,i=e.summary;var r=t?n(c,{class:d.heading,level:a||m},t):null;var o=i?n("span",{class:d.summary},i):null;return r||o?n("div",{class:d.headerContent,key:"header-content"},r,o):null};e.prototype.renderHeaderSlottedContent=function(){return n("div",{class:d.headerContent,key:"header-content"},n("slot",{name:u.headerContent}))};e.prototype.renderHeaderStartActions=function(){var e;var t=this.el;var a=l(t,u.headerActionsStart);return a?n("div",{class:(e={},e[d.headerActionsStart]=true,e[d.headerActions]=true,e),key:"header-actions-start"},n("slot",{name:u.headerActionsStart})):null};e.prototype.renderHeaderActionsEnd=function(){var e;var t=this,a=t.dismiss,i=t.dismissible,r=t.el,o=t.intlClose;var s=o||f.close;var c=i?n("calcite-action",{"aria-label":s,icon:h.close,onClick:a,ref:this.setDismissRef,text:s}):null;var m=n("slot",{name:u.headerActionsEnd});var p=l(r,u.headerActionsEnd);return p||c?n("div",{class:(e={},e[d.headerActionsEnd]=true,e[d.headerActions]=true,e),key:"header-actions-end"},m,c):null};e.prototype.renderMenu=function(){var e=this,t=e.el,a=e.intlOptions,i=e.menuOpen;var r=l(t,u.headerMenuActions);return r?n("calcite-action-menu",{flipPlacements:["top","bottom"],label:a||f.options,open:i,placement:"bottom-end"},n("slot",{name:u.headerMenuActions})):null};e.prototype.renderHeaderNode=function(){var e=this,t=e.el,a=e.showBackButton;var i=this.renderBackButton();var r=l(t,u.headerContent);var o=r?this.renderHeaderSlottedContent():this.renderHeaderContent();var s=this.renderHeaderStartActions();var c=this.renderHeaderActionsEnd();var h=this.renderMenu();return s||o||c||h||a?n("header",{class:d.header},i,s,o,c,h):null};e.prototype.renderFooterSlottedContent=function(){var e=this.el;var t=l(e,u.footer);return t?n("footer",{class:d.footer},n("slot",{name:u.footer})):null};e.prototype.renderFooterActions=function(){var e=this.el;var t=l(e,u.footerActions);return t?n("footer",{class:d.footer},n("slot",{name:u.footerActions})):null};e.prototype.renderContent=function(){return n("section",{class:d.contentContainer,onScroll:this.panelScrollHandler,tabIndex:0},n("slot",null),this.renderFab())};e.prototype.renderFab=function(){var e=this.el;var t=l(e,u.fab);return t?n("div",{class:d.fabContainer},n("slot",{name:u.fab})):null};e.prototype.render=function(){var e;var t=this,a=t.dismissed,r=t.disabled,l=t.dismissible,c=t.el,h=t.loading,u=t.panelKeyUpHandler;var f=o(c)==="rtl";var m=n("article",{"aria-busy":h.toString(),class:(e={},e[d.container]=true,e[s.rtl]=f,e),hidden:l&&a,onKeyUp:u,ref:this.setContainerRef,tabIndex:l?0:-1},this.renderHeaderNode(),this.renderContent(),this.renderFooterSlottedContent()||this.renderFooterActions());return n(i,null,h||r?n("calcite-scrim",{loading:h}):null,m)};Object.defineProperty(e.prototype,"el",{get:function(){return r(this)},enumerable:false,configurable:true});Object.defineProperty(e,"watchers",{get:function(){return{dismissed:["dismissedHandler"]}},enumerable:false,configurable:true});return e}());b.style=p}}}));