@esri/calcite-components
Version:
Web Components for Esri's Calcite Design System.
1 lines • 9.93 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{s(a.next(t))}catch(e){r(e)}}function c(t){try{s(a["throw"](t))}catch(e){r(e)}}function s(t){t.done?i(t.value):n(t.value).then(o,c)}s((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:c(0),throw:c(1),return:c(2)},typeof Symbol==="function"&&(o[Symbol.iterator]=function(){return this}),o;function c(t){return function(e){return s([t,e])}}function s(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(c){o=[6,c];n=0}finally{a=r=0}if(o[0]&5)throw o[1];return{value:o[0]?o[1]:void 0,done:true}}};import{r as registerInstance,c as createEvent,h,H as Host,g as getElement}from"./index-8fd57462.js";import{g as getElementDir}from"./dom-d9ba1da4.js";import{g as guid}from"./guid-09142681.js";var calciteRadioButtonCss="@-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}[theme=dark].sc-calcite-radio-button-h,[theme=dark] .sc-calcite-radio-button-h{--calcite-ui-blue-1:#00A0FF;--calcite-ui-blue-2:#0087D7;--calcite-ui-blue-3:#47BBFF;--calcite-ui-green-1:#36DA43;--calcite-ui-green-2:#11AD1D;--calcite-ui-green-3:#44ED51;--calcite-ui-yellow-1:#FFC900;--calcite-ui-yellow-2:#F4B000;--calcite-ui-yellow-3:#FFE24D;--calcite-ui-red-1:#FE583E;--calcite-ui-red-2:#F3381B;--calcite-ui-red-3:#FF7465;--calcite-ui-background:#202020;--calcite-ui-foreground-1:#2b2b2b;--calcite-ui-foreground-2:#353535;--calcite-ui-foreground-3:#404040;--calcite-ui-text-1:#ffffff;--calcite-ui-text-2:#bfbfbf;--calcite-ui-text-3:#9f9f9f;--calcite-ui-border-1:#4a4a4a;--calcite-ui-border-2:#404040;--calcite-ui-border-3:#353535;--calcite-ui-border-4:#757575;--calcite-ui-border-5:#9f9f9f}.sc-calcite-radio-button-h{cursor:pointer;display:inline-block}[labeled].sc-calcite-radio-button-h{--calcite-label-margin-bottom:0;-ms-flex-align:center;align-items:center;display:-ms-inline-flexbox;display:inline-flex;gap:8px}[disabled].sc-calcite-radio-button-h{cursor:default}.sc-calcite-radio-button-h[disabled]>.sc-calcite-radio-button-s>calcite-label{cursor:default}[scale=s][labeled].sc-calcite-radio-button-h{line-height:1.33;margin-bottom:8px;margin-right:12px}@supports not (display: grid){[scale=s][labeled].sc-calcite-radio-button-h calcite-radio.sc-calcite-radio-button{margin-right:8px}}[scale=m][labeled].sc-calcite-radio-button-h{line-height:1.15;margin-bottom:8px;margin-right:16px}@supports not (display: grid){[scale=m][labeled].sc-calcite-radio-button-h calcite-radio.sc-calcite-radio-button{margin-right:8px}}[scale=l][labeled].sc-calcite-radio-button-h{gap:12px;line-height:1.2;margin-bottom:10px;margin-right:20px}@supports not (display: grid){[scale=l][labeled].sc-calcite-radio-button-h calcite-radio.sc-calcite-radio-button{margin-right:12px}}[hidden].sc-calcite-radio-button-h{display:none}";var CalciteRadioButton=function(){function t(t){var e=this;registerInstance(this,t);this.calciteRadioButtonChange=createEvent(this,"calciteRadioButtonChange",7);this.calciteRadioButtonCheckedChange=createEvent(this,"calciteRadioButtonCheckedChange",7);this.calciteRadioButtonFocusedChange=createEvent(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.theme="light";this.formResetHandler=function(){var t;e.checked=e.initialChecked;e.initialChecked&&((t=e.input)===null||t===void 0?void 0:t.setAttribute("checked",""))};this.onInputBlur=function(){e.focused=false;e.calciteRadioButtonFocusedChange.emit()};this.onInputFocus=function(){e.focused=true;e.calciteRadioButtonFocusedChange.emit()}}t.prototype.checkedChanged=function(t){if(t){this.uncheckOtherRadioButtonsInGroup()}if(this.input){this.input.checked=t}this.calciteRadioButtonCheckedChange.emit(t)};t.prototype.disabledChanged=function(t){this.input.disabled=t};t.prototype.focusedChanged=function(t){if(!this.input)return;if(t&&!this.el.hasAttribute("hidden")){this.input.focus()}else{this.input.blur()}};t.prototype.hiddenChanged=function(t){this.input.hidden=t};t.prototype.nameChanged=function(t){if(this.name===t){return}if(this.input){this.input.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.input.required=t};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-"+guid();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(){if(this.focused){this.input.focus()}};t.prototype.disconnectedCallback=function(){var t=this.el.closest("form");if(t){t.removeEventListener("reset",this.formResetHandler)}};t.prototype.renderLabel=function(){if(this.el.textContent){return h("calcite-label",{dir:getElementDir(this.el),"disable-spacing":true,disabled:this.disabled,for:this.guid+"-input",layout:"inline",scale:this.scale},h("slot",null))}return h("slot",null)};t.prototype.render=function(){var t=this;var e={opacity:"0",position:"fixed",zIndex:"-1"};return h(Host,{labeled:!!this.el.textContent},h("input",{"aria-label":this.value||this.guid,checked:this.checked,disabled:this.disabled,hidden:this.hidden,id:this.guid+"-input",name:this.name,onBlur:this.onInputBlur,onFocus:this.onInputFocus,ref:function(e){return t.input=e},required:this.required,style:e,type:"radio",value:this.value}),h("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,theme:this.theme}),this.renderLabel())};Object.defineProperty(t.prototype,"el",{get:function(){return getElement(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}();CalciteRadioButton.style=calciteRadioButtonCss;export{CalciteRadioButton as calcite_radio_button};