UNPKG

@esri/calcite-components

Version:

Web Components for Esri's Calcite Design System.

1 lines 12.4 kB
var __awaiter=this&&this.__awaiter||function(t,e,i,a){function r(t){return t instanceof i?t:new i((function(e){e(t)}))}return new(i||(i=Promise))((function(i,n){function o(t){try{c(a.next(t))}catch(e){n(e)}}function s(t){try{c(a["throw"](t))}catch(e){n(e)}}function c(t){t.done?i(t.value):r(t.value).then(o,s)}c((a=a.apply(t,e||[])).next())}))};var __generator=this&&this.__generator||function(t,e){var i={label:0,sent:function(){if(n[0]&1)throw n[1];return n[1]},trys:[],ops:[]},a,r,n,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 c([t,e])}}function c(o){if(a)throw new TypeError("Generator is already executing.");while(i)try{if(a=1,r&&(n=o[0]&2?r["return"]:o[0]?r["throw"]||((n=r["return"])&&n.call(r),0):r.next)&&!(n=n.call(r,o[1])).done)return n;if(r=0,n)o=[o[0]&2,n.value];switch(o[0]){case 0:case 1:n=o;break;case 4:i.label++;return{value:o[1],done:false};case 5:i.label++;r=o[1];o=[0];continue;case 7:o=i.ops.pop();i.trys.pop();continue;default:if(!(n=i.trys,n=n.length>0&&n[n.length-1])&&(o[0]===6||o[0]===2)){i=0;continue}if(o[0]===3&&(!n||o[1]>n[0]&&o[1]<n[3])){i.label=o[1];break}if(o[0]===6&&i.label<n[1]){i.label=n[1];n=o;break}if(n&&i.label<n[2]){i.label=n[2];i.ops.push(o);break}if(n[2])i.ops.pop();i.trys.pop();continue}o=e.call(t,i)}catch(s){o=[6,s];r=0}finally{a=n=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-2c235db8.system.js","./p-60d9e7d4.system.js","./p-defdc464.system.js"],(function(t){"use strict";var e,i,a,r,n,o,s;return{setters:[function(t){e=t.r;i=t.h;a=t.c;r=t.g},function(t){n=t.g},function(t){o=t.f},function(t){s=t.h}],execute:function(){var c="@-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)}}:root{--calcite-popper-transition:150ms ease-in-out}:host([hidden]){display:none}:host .radio{border-radius:9999px;cursor:pointer;-webkit-transition-property:all;transition-property:all;-webkit-transition-duration:150ms;transition-duration:150ms;-webkit-transition-timing-function:cubic-bezier(0.4, 0, 0.2, 1);transition-timing-function:cubic-bezier(0.4, 0, 0.2, 1);-webkit-box-shadow:inset 0 0 0 1px var(--calcite-ui-border-input);box-shadow:inset 0 0 0 1px var(--calcite-ui-border-input)}:host([hovered]) .radio,:host(:not([checked])[focused]) .radio{-webkit-box-shadow:inset 0 0 0 2px var(--calcite-ui-brand);box-shadow:inset 0 0 0 2px var(--calcite-ui-brand)}:host([disabled]) .radio{cursor:default;opacity:var(--calcite-ui-opacity-disabled)}:host([hovered][disabled]) .radio{-webkit-box-shadow:inset 0 0 0 1px var(--calcite-ui-border-input);box-shadow:inset 0 0 0 1px var(--calcite-ui-border-input)}:host([scale=s]){--calcite-radio-size:var(--calcite-font-size--2)}:host([scale=m]){--calcite-radio-size:var(--calcite-font-size--1)}:host([scale=l]){--calcite-radio-size:var(--calcite-font-size-0)}.radio{height:var(--calcite-radio-size);max-width:var(--calcite-radio-size);min-width:var(--calcite-radio-size)}:host([scale=s][checked]) .radio,:host([hovered][scale=s][checked][disabled]) .radio{-webkit-box-shadow:inset 0 0 0 4px var(--calcite-ui-brand);box-shadow:inset 0 0 0 4px var(--calcite-ui-brand)}:host([scale=s][focused][checked]) .radio{-webkit-box-shadow:inset 0 0 0 4px var(--calcite-ui-brand), 0 0 0 2px var(--calcite-ui-foreground-1), 0 0 0 4px var(--calcite-ui-brand);box-shadow:inset 0 0 0 4px var(--calcite-ui-brand), 0 0 0 2px var(--calcite-ui-foreground-1), 0 0 0 4px var(--calcite-ui-brand)}:host([scale=m][checked]) .radio,:host([hovered][scale=m][checked][disabled]) .radio{-webkit-box-shadow:inset 0 0 0 5px var(--calcite-ui-brand);box-shadow:inset 0 0 0 5px var(--calcite-ui-brand)}:host([scale=m][focused][checked]) .radio{-webkit-box-shadow:inset 0 0 0 5px var(--calcite-ui-brand), 0 0 0 2px var(--calcite-ui-foreground-1), 0 0 0 4px var(--calcite-ui-brand);box-shadow:inset 0 0 0 5px var(--calcite-ui-brand), 0 0 0 2px var(--calcite-ui-foreground-1), 0 0 0 4px var(--calcite-ui-brand)}:host([scale=l][checked]) .radio,:host([hovered][scale=l][checked][disabled]) .radio{-webkit-box-shadow:inset 0 0 0 6px var(--calcite-ui-brand);box-shadow:inset 0 0 0 6px var(--calcite-ui-brand)}:host([scale=l][focused][checked]) .radio{-webkit-box-shadow:inset 0 0 0 6px var(--calcite-ui-brand), 0 0 0 2px var(--calcite-ui-foreground-1), 0 0 0 4px var(--calcite-ui-brand);box-shadow:inset 0 0 0 6px var(--calcite-ui-brand), 0 0 0 2px var(--calcite-ui-foreground-1), 0 0 0 4px var(--calcite-ui-brand)}:host([hidden]){display:none}";var d=t("calcite_radio",function(){function t(t){e(this,t);this.checked=false;this.disabled=false;this.focused=false;this.hidden=false;this.hovered=false;this.scale="m"}t.prototype.render=function(){return i("div",{class:"radio"})};return t}());d.style=c;var l="@-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)}}.sc-calcite-radio-button:root{--calcite-popper-transition:150ms ease-in-out}[hidden].sc-calcite-radio-button-h{display:none}.sc-calcite-radio-button-h{cursor:pointer;display:inline-block}.sc-calcite-radio-button-h .container.sc-calcite-radio-button{position:relative}[disabled].sc-calcite-radio-button-h{cursor:pointer}";var u=t("calcite_radio_button",function(){function t(t){var i=this;e(this,t);this.calciteRadioButtonChange=a(this,"calciteRadioButtonChange",7);this.calciteRadioButtonCheckedChange=a(this,"calciteRadioButtonCheckedChange",7);this.calciteRadioButtonFocusedChange=a(this,"calciteRadioButtonFocusedChange",7);this.checked=false;this.disabled=false;this.focused=false;this.hidden=false;this.hovered=false;this.required=false;this.scale="m";this.setInputEl=function(t){i.inputEl=t};this.formResetHandler=function(){var t;i.checked=i.initialChecked;i.initialChecked&&((t=i.inputEl)===null||t===void 0?void 0:t.setAttribute("checked",""))};this.hideInputEl=function(){i.inputEl.style.cssText=s};this.onInputBlur=function(){i.focused=false;i.calciteRadioButtonFocusedChange.emit()};this.onInputFocus=function(){i.focused=true;i.calciteRadioButtonFocusedChange.emit()}}t.prototype.checkedChanged=function(t){if(t){this.uncheckOtherRadioButtonsInGroup()}if(this.inputEl){this.inputEl.checked=t}this.calciteRadioButtonCheckedChange.emit(t)};t.prototype.disabledChanged=function(t){this.inputEl.disabled=t};t.prototype.focusedChanged=function(t){if(!this.inputEl){return}if(t&&!this.el.hasAttribute("hidden")){this.inputEl.focus()}else{this.inputEl.blur()}};t.prototype.hiddenChanged=function(t){this.inputEl.hidden=t};t.prototype.nameChanged=function(t){if(this.name===t){return}if(this.inputEl){this.inputEl.name=t}this.checkLastRadioButton();var e=this.rootNode.querySelector('input[name="'+this.name+'"]:checked');if(!(e===null||e===void 0?void 0:e.value)){this.uncheckAllRadioButtonsInGroup()}};t.prototype.requiredChanged=function(t){this.inputEl.required=t};t.prototype.setFocus=function(){return __awaiter(this,void 0,void 0,(function(){return __generator(this,(function(t){o(this.inputEl);return[2]}))}))};t.prototype.checkLastRadioButton=function(){var t=this;var e=Array.from(this.rootNode.querySelectorAll("calcite-radio-button")).filter((function(e){return e.name===t.name}));var i=e.filter((function(t){return t.checked}));if((i===null||i===void 0?void 0:i.length)>1){var a=i[i.length-1];i.filter((function(t){return t!==a})).forEach((function(t){t.checked=false;t.emitCheckedChange()}))}};t.prototype.emitCheckedChange=function(){return __awaiter(this,void 0,void 0,(function(){return __generator(this,(function(t){this.calciteRadioButtonCheckedChange.emit();return[2]}))}))};t.prototype.uncheckAllRadioButtonsInGroup=function(){var t=this;var e=Array.from(this.rootNode.querySelectorAll("calcite-radio-button")).filter((function(e){return e.name===t.name}));e.forEach((function(t){if(t.checked){t.checked=false;t.focused=false}}))};t.prototype.uncheckOtherRadioButtonsInGroup=function(){var t=this;var e=Array.from(this.rootNode.querySelectorAll("calcite-radio-button")).filter((function(e){return e.name===t.name&&e.guid!==t.guid}));e.forEach((function(t){if(t.checked){t.checked=false;t.focused=false}}))};t.prototype.check=function(t){if(this.el.closest("label")&&(t.target===this.el||t.target===this.radio)){t.preventDefault()}if(!this.disabled&&!this.hidden){this.uncheckOtherRadioButtonsInGroup();this.checked=true;this.focused=true;this.calciteRadioButtonChange.emit()}};t.prototype.mouseenter=function(){this.hovered=true};t.prototype.mouseleave=function(){this.hovered=false};t.prototype.connectedCallback=function(){this.rootNode=this.el.getRootNode();this.guid=this.el.id||"calcite-radio-button-"+n();this.initialChecked=this.checked;if(this.name){this.checkLastRadioButton()}var t=this.el.closest("form");if(t){t.addEventListener("reset",this.formResetHandler)}};t.prototype.componentDidLoad=function(){this.hideInputEl();if(this.focused){this.inputEl.focus()}};t.prototype.disconnectedCallback=function(){var t=this.el.closest("form");if(t){t.removeEventListener("reset",this.formResetHandler)}};t.prototype.render=function(){var t=this;var e;var a=(e=this.value)===null||e===void 0?void 0:e.toString();return i("div",{class:"container"},i("input",{"aria-label":this.label||null,checked:this.checked,disabled:this.disabled,hidden:this.hidden,id:this.guid+"-input",name:this.name,onBlur:this.onInputBlur,onFocus:this.onInputFocus,ref:this.setInputEl,required:this.required,type:"radio",value:a}),i("calcite-radio",{checked:this.checked,disabled:this.disabled,focused:this.focused,hidden:this.hidden,hovered:this.hovered,ref:function(e){return t.radio=e},scale:this.scale}))};Object.defineProperty(t.prototype,"el",{get:function(){return r(this)},enumerable:false,configurable:true});Object.defineProperty(t,"watchers",{get:function(){return{checked:["checkedChanged"],disabled:["disabledChanged"],focused:["focusedChanged"],hidden:["hiddenChanged"],name:["nameChanged"],required:["requiredChanged"]}},enumerable:false,configurable:true});return t}());u.style=l}}}));