@esri/calcite-components
Version:
Web Components for Esri's Calcite Design System.
1 lines • 16.9 kB
JavaScript
var __awaiter=this&&this.__awaiter||function(t,e,i,a){function n(t){return t instanceof i?t:new i((function(e){e(t)}))}return new(i||(i=Promise))((function(i,r){function o(t){try{l(a.next(t))}catch(e){r(e)}}function s(t){try{l(a["throw"](t))}catch(e){r(e)}}function l(t){t.done?i(t.value):n(t.value).then(o,s)}l((a=a.apply(t,e||[])).next())}))};var __generator=this&&this.__generator||function(t,e){var i={label:0,sent:function(){if(r[0]&1)throw r[1];return r[1]},trys:[],ops:[]},a,n,r,o;return o={next:s(0),throw:s(1),return:s(2)},typeof Symbol==="function"&&(o[Symbol.iterator]=function(){return this}),o;function s(t){return function(e){return l([t,e])}}function l(o){if(a)throw new TypeError("Generator is already executing.");while(i)try{if(a=1,n&&(r=o[0]&2?n["return"]:o[0]?n["throw"]||((r=n["return"])&&r.call(n),0):n.next)&&!(r=r.call(n,o[1])).done)return r;if(n=0,r)o=[o[0]&2,r.value];switch(o[0]){case 0:case 1:r=o;break;case 4:i.label++;return{value:o[1],done:false};case 5:i.label++;n=o[1];o=[0];continue;case 7:o=i.ops.pop();i.trys.pop();continue;default:if(!(r=i.trys,r=r.length>0&&r[r.length-1])&&(o[0]===6||o[0]===2)){i=0;continue}if(o[0]===3&&(!r||o[1]>r[0]&&o[1]<r[3])){i.label=o[1];break}if(o[0]===6&&i.label<r[1]){i.label=r[1];r=o;break}if(r&&i.label<r[2]){i.label=r[2];i.ops.push(o);break}if(r[2])i.ops.pop();i.trys.pop();continue}o=e.call(t,i)}catch(s){o=[6,s];n=0}finally{a=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-8e306db9.system.js","./p-60d9e7d4.system.js","./p-0a18b2ae.system.js","./p-482ec054.system.js","./p-53caa311.system.js","./p-2c235db8.system.js"],(function(t){"use strict";var e,i,a,n,r,o,s,l,c,f,p,d,u,m,h,b,y,g,k,x,v,w,D,I,_,z,C,L,H,j,P;return{setters:[function(t){e=t.r;i=t.c;a=t.h;n=t.g;r=t.F},function(t){o=t.m;s=t.d;l=t.s;c=t.h;f=t.g;p=t.k;d=t.i;u=t.a;m=t.c;h=t.r;b=t.b;y=t.e;g=t.l;k=t.f;x=t.j;v=t.I;w=t.L;D=t.T;I=t.n;_=t.C;z=t.S},function(t){C=t.g;L=t.b;H=t.C},function(t){j=t.C;P=t.c},function(){},function(){},function(){}],execute:function(){var F="@-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{-ms-flex-align:stretch;align-items:stretch;background-color:transparent;display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;position:relative;padding-bottom:0;-ms-flex-positive:1;flex-grow:1;-ms-flex-negative:0;flex-shrink:0}:host([filter-enabled]) header{background-color:var(--calcite-ui-foreground-1);display:-ms-flexbox;display:flex;-ms-flex-pack:end;justify-content:flex-end;-ms-flex-align:stretch;align-items:stretch;margin-bottom:0.25rem;-webkit-box-shadow:0 1px 0 var(--calcite-ui-border-3);box-shadow:0 1px 0 var(--calcite-ui-border-3)}:host([filter-enabled]) header.sticky{position:-webkit-sticky;position:sticky;top:0;z-index:1}calcite-filter{margin-bottom:1px}:host([loading][disabled]){min-height:2rem}";var S=t("calcite_pick_list",function(){function t(t){var a=this;e(this,t);this.calciteListChange=i(this,"calciteListChange",7);this.disabled=false;this.filterEnabled=false;this.loading=false;this.multiple=false;this.selectionFollowsFocus=false;this.selectedValues=new Map;this.dataForFilter=[];this.lastSelectedItem=null;this.observer=new MutationObserver(o.bind(this));this.setFilterEl=function(t){a.filterEl=t};this.deselectSiblingItems=s.bind(this);this.selectSiblings=l.bind(this);this.handleFilter=c.bind(this);this.getItemData=f.bind(this);this.keyDownHandler=p.bind(this)}t.prototype.connectedCallback=function(){d.call(this);u.call(this)};t.prototype.disconnectedCallback=function(){m.call(this)};t.prototype.calciteListItemRemoveHandler=function(t){h.call(this,t)};t.prototype.calciteListItemChangeHandler=function(t){b.call(this,t)};t.prototype.calciteListItemPropsChangeHandler=function(t){t.stopPropagation();this.setUpFilter()};t.prototype.calciteListItemValueChangeHandler=function(t){y.call(this,t)};t.prototype.calciteListFocusOutHandler=function(t){g.call(this,t)};t.prototype.setUpItems=function(){k.call(this,"calcite-pick-list-item")};t.prototype.setUpFilter=function(){if(this.filterEnabled){this.dataForFilter=this.getItemData()}};t.prototype.getSelectedItems=function(){return __awaiter(this,void 0,void 0,(function(){return __generator(this,(function(t){return[2,this.selectedValues]}))}))};t.prototype.setFocus=function(t){return __awaiter(this,void 0,void 0,(function(){return __generator(this,(function(e){return[2,x.call(this,t)]}))}))};t.prototype.getIconType=function(){return this.multiple?v.square:v.circle};t.prototype.render=function(){return a(w,{onKeyDown:this.keyDownHandler,props:this})};Object.defineProperty(t.prototype,"el",{get:function(){return n(this)},enumerable:false,configurable:true});return t}());S.style=F;var E={heading:"heading",container:"container",indented:"container--indented"};var W={parentItem:"parent-item"};var R=3;var V="@-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{background-color:transparent;display:block;margin-bottom:0.25rem}:host(:last-child){margin-bottom:0}.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)}h3.heading{font-size:var(--calcite-font-size--1);line-height:1.375;color:var(--calcite-ui-text-3);margin:0.5rem 1rem}.container--indented{margin-left:1.5rem}.calcite--rtl.container--indented{margin-left:0;margin-right:1.5rem}";var A=t("calcite_pick_list_group",function(){function t(t){e(this,t)}t.prototype.render=function(){var t;var e;var i=this,n=i.el,o=i.groupTitle,s=i.headingLevel;var l=C(n)==="rtl";var c=L(n,W.parentItem)!==null;var f=(t={},t[E.container]=true,t[E.indented]=c,t[H.rtl]=l,t);var p=o;var d=(e=n.closest("calcite-pick-list"))===null||e===void 0?void 0:e.headingLevel;var u=d?P(d+1):null;var m=s||u||R;return a(r,null,p?a(j,{class:E.heading,level:m},p):null,a("slot",{name:W.parentItem}),a("section",{class:f},a("slot",null)))};Object.defineProperty(t.prototype,"el",{get:function(){return n(this)},enumerable:false,configurable:true});return t}());A.style=V;var O='@charset "UTF-8";@-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{-ms-flex-align:stretch;align-items:stretch;display:-ms-flexbox;display:flex;color:var(--calcite-ui-text-1);-webkit-box-shadow:0 1px 0 var(--calcite-ui-border-3);box-shadow:0 1px 0 var(--calcite-ui-border-3);margin:0;margin-bottom:1px;-webkit-transition:background-color 150ms ease-in-out;transition:background-color 150ms ease-in-out;-webkit-animation:calcite-fade-in 150ms ease-in-out;animation:calcite-fade-in 150ms ease-in-out}:host(:hover){background-color:var(--calcite-ui-foreground-2)}.icon{-ms-flex-align:center;align-items:center;display:-ms-flexbox;display:flex;margin-top:0;margin-bottom:0;margin-left:0.5rem;margin-right:0.5rem;opacity:0;cursor:pointer;color:var(--calcite-ui-brand);-ms-flex:0 0 auto;flex:0 0 auto;line-height:0}.icon-dot{width:0.5rem;margin:0.5rem}.icon-dot:before{content:"•"}:host([selected]) .icon{-webkit-transition:opacity 150ms ease-in-out;transition:opacity 150ms ease-in-out;opacity:1}.label{background-color:transparent;display:-ms-flexbox;display:flex;-ms-flex:1 1 auto;flex:1 1 auto;padding-left:0.75rem;padding-right:0.75rem;padding-top:0.5rem;padding-bottom:0.5rem;-ms-flex-align:center;align-items:center;cursor:pointer;outline-offset:0;outline-color:transparent;-webkit-transition:outline-offset 100ms ease-in-out, outline-color 100ms ease-in-out;transition:outline-offset 100ms ease-in-out, outline-color 100ms ease-in-out}.label:focus{outline:2px solid var(--calcite-ui-brand);outline-offset:-2px}.text-container{display:-ms-flexbox;display:flex;overflow:hidden;pointer-events:none;padding-top:0;padding-bottom:0;padding-left:0.25rem;padding-right:0.25rem;font-size:var(--calcite-font-size--2);line-height:1.375;word-wrap:break-word;word-break:break-word;-ms-flex-flow:column nowrap;flex-flow:column nowrap}.title{color:var(--calcite-ui-text-1)}.description{margin-top:0.125rem;color:var(--calcite-ui-text-3)}.actions{-ms-flex-align:stretch;align-items:stretch;display:-ms-flexbox;display:flex;-ms-flex-pack:end;justify-content:flex-end;margin:0;-ms-flex:0 0 auto;flex:0 0 auto}.actions--start~.label{padding-left:0.25rem}.calcite--rtl .actions--start~.label{padding-left:unset;padding-right:0.25rem}';var K=t("calcite_pick_list_item",function(){function t(t){var a=this;e(this,t);this.calciteListItemChange=i(this,"calciteListItemChange",7);this.calciteListItemRemove=i(this,"calciteListItemRemove",7);this.calciteListItemPropsChange=i(this,"calciteListItemPropsChange",7);this.calciteListItemValueChange=i(this,"calciteListItemValueChange",7);this.disabled=false;this.disableDeselect=false;this.icon=null;this.removable=false;this.selected=false;this.intlRemove=D.remove;this.pickListClickHandler=function(t){if(a.disabled||a.disableDeselect&&a.selected){return}a.shiftPressed=t.shiftKey;a.selected=!a.selected};this.pickListKeyDownHandler=function(t){if(t.key===" "){t.preventDefault();if(a.disableDeselect&&a.selected){return}a.selected=!a.selected}};this.removeClickHandler=function(){a.calciteListItemRemove.emit()}}t.prototype.descriptionWatchHandler=function(){this.calciteListItemPropsChange.emit()};t.prototype.labelWatchHandler=function(){this.calciteListItemPropsChange.emit()};t.prototype.metadataWatchHandler=function(){this.calciteListItemPropsChange.emit()};t.prototype.selectedWatchHandler=function(){this.calciteListItemChange.emit({item:this.el,value:this.value,selected:this.selected,shiftPressed:this.shiftPressed});this.shiftPressed=false};t.prototype.valueWatchHandler=function(t,e){this.calciteListItemValueChange.emit({oldValue:e,newValue:t})};t.prototype.toggleSelected=function(t){return __awaiter(this,void 0,void 0,(function(){return __generator(this,(function(e){if(this.disabled){return[2]}this.selected=typeof t==="boolean"?t:!this.selected;return[2]}))}))};t.prototype.setFocus=function(){return __awaiter(this,void 0,void 0,(function(){var t;return __generator(this,(function(e){(t=this.focusEl)===null||t===void 0?void 0:t.focus();return[2]}))}))};t.prototype.renderIcon=function(){var t;var e=this.icon;if(!e){return null}return a("span",{class:(t={},t[_.icon]=true,t[_.iconDot]=e===v.circle,t),onClick:this.pickListClickHandler},e===v.square?a("calcite-icon",{icon:I.checked,scale:"s"}):null)};t.prototype.renderRemoveAction=function(){return this.removable?a("calcite-action",{class:_.remove,icon:I.remove,onCalciteActionClick:this.removeClickHandler,slot:z.actionsEnd,text:this.intlRemove}):null};t.prototype.renderActionsStart=function(){var t;var e=this.el;var i=L(e,z.actionsStart);return i?a("div",{class:(t={},t[_.actions]=true,t[_.actionsStart]=true,t)},a("slot",{name:z.actionsStart})):null};t.prototype.renderActionsEnd=function(){var t;var e=this,i=e.el,n=e.removable;var r=L(i,z.actionsEnd);return r||n?a("div",{class:(t={},t[_.actions]=true,t[_.actionsEnd]=true,t)},a("slot",{name:z.actionsEnd}),this.renderRemoveAction()):null};t.prototype.render=function(){var t=this;var e=this,i=e.description,n=e.label;return a(r,null,this.renderIcon(),this.renderActionsStart(),a("label",{"aria-label":n,class:_.label,onClick:this.pickListClickHandler,onKeyDown:this.pickListKeyDownHandler,ref:function(e){return t.focusEl=e},tabIndex:0},a("div",{"aria-checked":this.selected.toString(),class:_.textContainer,role:"menuitemcheckbox"},a("span",{class:_.title},n),i?a("span",{class:_.description},i):null)),this.renderActionsEnd())};Object.defineProperty(t.prototype,"el",{get:function(){return n(this)},enumerable:false,configurable:true});Object.defineProperty(t,"watchers",{get:function(){return{description:["descriptionWatchHandler"],label:["labelWatchHandler"],metadata:["metadataWatchHandler"],selected:["selectedWatchHandler"],value:["valueWatchHandler"]}},enumerable:false,configurable:true});return t}());K.style=O}}}));