https://www.trainwithkickoff.com/_next/static/chunks/6828.3db7fb51fd09bf69.js

1"use strict";(self.webpackChunk_N_E=self.webpackChunk_N_E||[]).push([[6828],{76828:function(e,t,o){o.r(t),o.d(t,{input_dropdown:function(){return s},time_period_selector:function(){return l}});var i=o(39986),r=o(38182);o(67294),o(85893),o(73935);let s=class{constructor(e){(0,i.r)(this,e),this.inputOptionChanged=(0,i.a)(this,"inputOptionChanged",7),this.name=void 0,this.options=[],this.defaultInputOption=void 0,this.inputValue=void 0,this.pluralizedLabel="",this.filterable=!1,this.selectedOption=this.defaultInputOption||null,this.isOpen=!1,this.typedValue="",this.filteredOptions=[...this.options],this.ariaActivedescendant="",this.shouldAutoScroll=!1}optionsChangedHandler(e,t){e!==t&&(this.filteredOptions=this.getFilteredOptions(e))}defaultSelectedOptionChangedHandler(e,t){(null==e?void 0:e.label)!==(null==t?void 0:t.label)&&(this.selectedOption=e)}inputValueChangedHandler(e,t){e!==t&&(this.filteredOptions=this.getFilteredOptions(this.options))}componentWillLoad(){this.filteredOptions=this.getFilteredOptions(this.options),!this.selectedOption&&this.defaultInputOption&&(this.selectedOption=this.defaultInputOption),!this.selectedOption&&this.options.length>0&&(this.selectedOption=this.options[0])}getFilteredOptions(e){return this.filterable?e.filter(e=>{var t,o,i,r;return(null==(o=null==e?void 0:e.value)?void 0:o.toString().toLowerCase().includes(null==(t=this.typedValue)?void 0:t.toLowerCase()))||(null==(r=null==e?void 0:e.label)?void 0:r.toLowerCase().includes(null==(i=this.typedValue)?void 0:i.toLowerCase()))}):e}toggleDropdown(){this.isOpen=!this.isOpen}selectOption(e){this.selectedOption=e,this.toggleDropdown(),this.inputOptionChanged.emit({value:e.value,name:this.name})}handleOnInput(e){let t=e.target.value;this.typedValue=t;let o=this.options.findIndex(e=>e.label.toLowerCase().includes(t.toLowerCase()));o>-1&&this.scrollToViewWithinParent(o),this.inputOptionChanged.emit({value:t,name:this.name})}scrollToViewWithinParent(e){var t;let o=this.options[e],i=null==(t=this.el.shadowRoot)?void 0:t.getElementById(o.value.toString()),r=this.optionsRef;if(this.ariaActivedescendant=o.value.toString(),!i||!r)return;let s=i.getBoundingClientRect(),n=r.getBoundingClientRect();s.top<n.top?r.scrollTop-=n.top-s.top:s.bottom>n.bottom&&(r.scrollTop+=s.bottom-n.bottom)}handleSelectButtonKeyDown(e){var t;switch(e.key){case"ArrowDown":case"Enter":e.preventDefault(),this.isOpen||this.toggleDropdown(),null==(t=this.inputRef)||t.focu

1s();break;case"Escape":this.isOpen=!1}}handleClick(e){if(this.isOpen){let t=e.target.value,o=this.options.findIndex(e=>e.label.toLowerCase().includes(t.toLowerCase()));o>-1&&setTimeout(()=>{this.scrollToViewWithinParent(o)},10)}}handleListboxKeydown(e){var t,o;let i=this.filteredOptions,r=i.findIndex(e=>e.value===this.ariaActivedescendant);if("ArrowDown"!==e.key&&("Tab"!==e.key||e.shiftKey)){if("ArrowUp"===e.key||"Tab"===e.key&&e.shiftKey){if(e.preventDefault(),0===r){this.ariaActivedescendant="",null==(o=this.inputRef)||o.focus();return}let t=r-1>=0?r-1:i.length-1;this.ariaActivedescendant=i[t].value,this.focusOption(t)}else"Enter"===e.key?(e.preventDefault(),this.ariaActivedescendant&&this.selectOption(i[r])):"Escape"===e.key&&(this.isOpen=!1)}else{if(e.preventDefault(),r===i.length-1){this.ariaActivedescendant="",null==(t=this.inputRef)||t.focus();return}let o=r+1<i.length?r+1:0;this.ariaActivedescendant=i[o].value,this.focusOption(o)}}focusOption(e){var t;let o=this.filteredOptions[e];if(!o)return;let i=o.value,r=null==(t=this.el.shadowRoot)?void 0:t.getElementById(i);r&&(r.focus(),r.scrollIntoView({behavior:"smooth",block:"nearest"}))}handleComboboxKeyDown(e){if("ArrowDown"!==e.key&&("Tab"!=e.key||e.shiftKey))"ArrowUp"===e.key||"Tab"===e.key&&e.shiftKey?(e.preventDefault(),this.ariaActivedescendant=this.filteredOptions[this.filteredOptions.length-1].value,this.focusOption(this.filteredOptions.length-1)):"Escape"===e.key&&(this.isOpen=!1);else{if(e.preventDefault(),!this.isOpen){this.isOpen=!0,this.shouldAutoScroll=!0;return}this.ariaActivedescendant=this.filteredOptions[0].value,this.focusOption(0)}}handleOutsideClick(e){!e.composedPath().includes(this.el)&&this.isOpen&&(this.isOpen=!1)}render(){return(0,i.h)("div",{key:"70ce0875e6bff7252d4a68e13c699c6da196164b",class:"dropdown",part:"id_dropdown"},(0,i.h)("input",{key:"20f6121f0516d56858e6fb677981564fbdaae31e",type:"text",name:this.name,id:this.name,part:"id_dropdown-input",class:{dropbtn:!0,open:this.isOpen},value:this.inputValue,onClick:e=>{this.toggleDropdown(),this.shouldAutoScroll=!0,this.handleClick(e)},"aria-haspopup":"listbox","aria-label":this.name,"aria-expanded":this.isOpen?"true":"false",onKeyDown:e=>this.handleComboboxKeyDown(e),onInput:e=>this.handleOnInput(e)}),this.isOpen?(0,i.h)("div",{class:"dropdown-content",part:"id_dropdown-content",ref:e=>this.optionsRef=e},(0,i.h)("ul",{tabindex:"-1",role:"listbox","aria-label":this.name,"aria-activedescendant":this.ariaActivedescendant,onKeyDown:e=>this.handleListboxKeydown(e)},this.filteredOptions.map(e=>(0,i.h)("li",{tabindex:"0",key:e.value,id:e.value,onClick:()=>this.selectOption(e),role:"option",class:{focused:this.ariaActivedescendant===e.value.toString()}},e.labelHTML?e.labelHTML:e.label)))):null)}get el(){return(0,i.g)(this)}static get watchers(){return{options:["optionsChangedHandler"],defaultInputOption:["defaultSelectedOptionChangedH

1andler"],inputValue:["inputValueChangedHandler"]}}};s.style=':host{display:block;position:relative;--nylas-primary:#2563eb;--nylas-error:#cc4841;--nylas-error-pressed:#992222;--nylas-wraning:#f06c00;--nylas-success:#16a392;--nylas-info:#2b8fc2;--nylas-base-0:#ffffff;--nylas-base-25:#fcfcfd;--nylas-base-50:#f8f9fc;--nylas-base-100:#eaecf5;--nylas-base-200:#d5d9eb;--nylas-base-300:#b3b8d8;--nylas-base-400:#717bbc;--nylas-base-500:#4e5ba6;--nylas-base-600:#3e4784;--nylas-base-700:#263f72;--nylas-base-800:#293056;--nylas-base-900:#101323;--nylas-base-950:#0e101b;--nylas-color-blue-100:#e0e6f9;--nylas-border-radius:0.25rem;--nylas-border-radius-2x:0.5rem;--nylas-border-radius-3x:0.75rem;--nylas-font-family:"Inter", sans-serif;--nylas-color-black:#000000;--nylas-color-grey-900:#2c2c2c;--nylas-color-grey-800:#4b4b4b;--nylas-color-grey-700:#6e6e6e;--nylas-color-grey-600:#8e8e8e;--nylas-color-grey-500:#b3b3b3;--nylas-color-grey-400:#cacaca;--nylas-color-grey-300:#e1e1e1;--nylas-color-grey-200:#eaeaea;--nylas-color-grey-100:#f5f5f5;--nylas-color-grey-50:#fbfcfe;--nylas-color-white:#ffffff;--nylas-color-red-900:#992222;--nylas-color-red-700:#cc4841;--nylas-color-red-500:#ff786a;--nylas-color-red-300:#ffa79e;--nylas-color-red-100:#ffc5bf;--nylas-color-red-50:#ffeae8;--nylas-color-blue-900:#213571;--nylas-color-blue-700:#314fa9;--nylas-color-blue-500:#4169e1;--nylas-color-blue-300:#bdccf9;--nylas-color-blue-100:#e0e6f9;--nylas-color-blue-50:#f6f8fd;--nylas-color-yellow-900:#7c6506;--nylas-color-yellow-700:#c29f09;--nylas-color-yellow-500:#f7c90b;--nylas-color-yellow-300:#f9de70;--nylas-color-yellow-100:#fceba9;--nylas-color-yellow-50:#fdf4ce;--nylas-color-green-900:#0e6b60;--nylas-color-green-700:#16a392;--nylas-color-green-500:#17c3b2;--nylas-color-green-300:#74dbd1;--nylas-color-green-100:#a2e7e0;--nylas-color-green-50:#d1f3f0;--nylas-color-purple-900:#643554;--nylas-color-purple-700:#954f7d;--nylas-color-purple-500:#c769a7;--nylas-color-purple-300:#dda5ca;--nylas-color-purple-100:#e0bdd6;--nylas-color-purple-50:#e9dde5;--nylas-color-sky-900:#20698f;--nylas-color-sky-700:#2b8fc2;--nylas-color-sky-500:#6dceff;--nylas-color-sky-300:#8fdaff;--nylas-color-sky-100:#b8e7ff;--nylas-color-sky-50:#d9f2ff}@media screen and (max-width: 768px){:host{position:unset}}.dropdown{display:inline-block;width:inherit}.dropbtn{color:var(--nylas-base-800);padding:10px;font-size:16px;font-family:var(--nylas-font-family);cursor:pointer;display:flex;gap:0.5rem;background:transparent;border:none;border-radius:var(--nylas-border-radius-2x);padding:14px 16px;border-radius:var(--nylas-border-radius-2x)}.dropbtn.focus{background:transparent}.dropbtn:hover,.dropbtn:active{outline:1px solid var(--nylas-primary)}.dropbtn:active{outline:2px solid var(--nylas-primary)}.dropbtn span.chevron{display:flex;align-self:center}.dropbtn span.open{transform:rotate(90deg)}.dropbtn span.closed{transform:rotate(270deg)}.dropbtn span.selected-option{text-overflow:ellipsis;overflow:hidden;white-space:nowrap;max-width:144px;font-size:14px;line-height:20px}@media screen and (max-width: 768px){.dropbtn span.selected-option{max-width:124px;font-size:16px}}.dropdown-content{display:block;margin-top:0.5rem;background-color:var(--nylas-base-0);max-width:306px;width:max-content;max-height:336px;overflow:auto;z-index:1;border-radius:4px;position:absolute;box-shadow:0px 4px 6px -2px rgba(0, 0, 0, 0.05);box-shadow:0px 10px 15px -3px rgba(0, 0, 0, 0.1)}@media screen and (max-width: 768px){.dropdown-content{right:0;width:325px;max-width:unset}}.search-box{border-bottom:1px solid var(--nylas-base-200);padding:10px;position:sticky;top:0;background:var(--nylas-base-0)}.search-box .icon{position:absolute;top:1.25rem;left:1.25rem;color:var(--nylas-base-300)}.dropdown-content ul{padding:0;list-style-type:none;color:var(--nylas-base-900);max-height:336px}.dropdown-content ul li{padding:16px, 12px, 16px, 12px;color:var(--nylas-base-900);padding:12px 16px;text-decoration:none;display:block;font-family:inherit;font-size:14px;font-weight:400;line-height:20px;letter-spacing:0px;text-align:left;cursor:pointer}.dropdown-content ul li:hover,.dropdown-content ul li:focus{background-color:var(--nylas-base-100)}.dropdown-content .selected{background-color:#e7e7e7}input[type=text]{width:-webkit-fill-available;padding:inherit;border:1px solid #ccc;border-radius:4px;position:sticky;background:no-repeat scroll 7px 7px;padding-left:30px;background-size:16px 16px}';let n={hours:"hour",days:"day",weeks:"week",months:"month",years:"year"},l=class{constructor(e){(0,i.r)(this,e),this.timePeriodChanged=(0,i.a)(this,"timePeriodChanged",7),this.timePeriods=r.g,this.defaultSelectedPeriod=void 0,this.defaultSelectedNumber=void 0,this.hasError=!1,this.selectedPeriod=this.defaultSelectedPeriod,this.selectedNumber=this.defaultSelectedNumber,this.numberOptions=this.calculateOptions(this.defaultSelectedPeriod||"hour").map(e=>({label:e.toString(),value:e.toString()})),this.timePeriodOptions=this.timePeriods.map(e=>({label:e.label,value:e.value}))}defaultSelectedPeriodChanged(e){this.selectedPeriod=e,this.updateNumberOptionsAndSelectedNumber(e)}defaultSelectedNumberChanged(e){this.selectedNumber=e}timePeriodsChanged(e){this.timePeriodOptions=[...e]}componentDidLoad(){this.selectedNumber=this.defaultSelectedNumber,this.selectedPeriod=this.defaultSelectedPeriod;let e=n[this.selectedPeriod]??this.selectedPeriod,t=this.calculateOptions(e);this.numberOptions=t.map(e=>({label:e.toString(),value:e.toString()}))}calculateOptions(e){switch(e){case"hour":return Array.from({length:23},(e,t)=>t+1);case"minute":return Array.from({length:13},(e,t)=>5*t);case"day":return Array.from({length:30},(e,t)=>t+1);case"week":return Array.from({length:4},(e,t)=>t+1);case"month":return Array.from({length:12},(e,t)=>t+1);case"year":return Array.from({length:10},(e,t)=>t+1);default:return[]}}

1inputOptionChangedHandler(e){(0,i.b)("time-period-selector","inputOptionChangedHandler",e.detail);let{value:t,name:o}=e.detail;"time-number"===o&&(this.selectedNumber=t?parseInt(t):this.defaultSelectedNumber);let r={number:this.selectedNumber,period:this.selectedPeriod};this.timePeriodChanged.emit(r)}nylasFormDropdownChangedHandler(e){(0,i.b)("time-period-selector","nylasFormDropdownChangedHandler",e.detail);let{value:t,name:o}=e.detail;"time-period"===o?(this.selectedPeriod=t,this.updateNumberOptionsAndSelectedNumber(t)):"time-number"===o&&(this.selectedNumber=parseInt(t));let r={number:this.selectedNumber,period:this.selectedPeriod};this.timePeriodChanged.emit(r)}updateNumberOptionsAndSelectedNumber(e){let t=this.calculateOptions(e);this.numberOptions=t.map(e=>({label:e.toString(),value:e.toString()}))}render(){var e;return(0,i.h)("div",{key:"52a3390ed7fc0389e192d0cfa0e4bf90189f4400",class:"time-period-selector"},"number"==typeof this.selectedNumber&&(0,i.h)("input-dropdown",{id:"time-number",name:"time-number",class:{error:this.hasError},inputValue:this.selectedNumber.toString(),exportparts:"id_dropdown: tps__number-dropdown, id_dropdown-input: tps__number-dropdown-button, id_dropdown-content: tps__number-dropdown-content",options:this.numberOptions,defaultInputOption:this.numberOptions.find(e=>e.value==this.selectedNumber.toString())}),"string"==typeof this.selectedPeriod&&(0,i.h)("select-dropdown",{id:"time-period",name:"time-period",options:this.timePeriodOptions,exportparts:"sd_dropdown: tps__period-dropdown, sd_dropdown-button: tps__period-dropdown-button, sd_dropdown-content: tps__period-dropdown-content",pluralizedLabel:this.selectedNumber>1?i.i.t(`time.${this.selectedPeriod}s`):i.i.t(`time.${this.selectedPeriod}`),defaultSelectedOption:null==(e=this.timePeriodOptions)?void 0:e.find(e=>e.value==this.selectedPeriod),withSearch:!1}))}get host(){return(0,i.g)(this)}static get watchers(){return{defaultSelectedPeriod:["defaultSelectedPeriodChanged"],defaultSelectedNumber:["defaultSelectedNumberChanged"],timePeriods:["timePeriodsChanged"]}}};l.style=".time-period-selector.sc-time-period-selector{display:grid;gap:0.5rem;grid-template-columns:auto 1fr}.time-period-selector.sc-time-period-selector select-dropdown.sc-time-period-selector,.time-period-selector.sc-time-period-selector input-dropdown.sc-time-period-selector{border:1px solid var(--nylas-base-200);border-radius:var(--nylas-border-radius-2x)}.time-period-selector.sc-time-period-selector select-dropdown.sc-time-period-selector{width:116px}.time-period-selector.sc-time-period-selector input-dropdown.sc-time-period-selector{width:84px;display:flex;align-items:center}.time-period-selector.sc-time-period-selector select-dropdown#time-period.sc-time-period-selector::part(sd_dropdown-button){width:100%}.time-period-selector.sc-time-period-selector input-dropdown.sc-time-period-selector::part(id_dropdown){width:inherit;height:100%}.time-period-selector.sc-time-period-selector input-dropdown#time-number.sc-time-period-selector::part(id_dropdown-input){border:none;border-radius:var(--nylas-border-radius-2x)}.time-period-selector.sc-time-period-selector input-dropdown#time-number.error.sc-time-period-selector::part(id_dropdown-input){border:1px solid var(--nylas-error)}.time-period-selector.sc-time-period-selector input-dropdown.sc-time-period-selector:hover{outline:1px solid var(--nylas-primary);border:none}.time-period-selector.sc-time-period-selector input-dropdown.sc-time-period-selector::part(id_dropdown-input){padding:16px;gap:1rem}.time-period-selector.sc-time-period-selector input-dropdown.sc-time-period-selector::part(id_dropdown-input):hover{border:none;outline:none}.time-period-selector.sc-time-period-selector input-dropdown.sc-time-period-selector::part(id_dropdown-content){width:100%;max-height:200px}.time-period-selector.sc-time-period-selector select-dropdown.sc-time-period-selector::part(sd_dropdown){width:inherit;height:100%}.time-period-selector.sc-time-period-selector select-dropdown.sc-time-period-selector::part(sd_dropdown_label){height:100%}.time-period-selector.sc-time-period-selector select-dropdown.sc-time-period-selector::part(sd_dropdown-button){padding:1rem;gap:1rem;justify-content:space-between;border:none;align-items:center;height:100%}.time-period-selector.sc-time-period-selector select-dropdown.sc-time-period-selector::part(sd_dropdown-content){width:100%;max-height:200px}"}}]);
2//# sourceMappingURL=6828.3db7fb51fd09bf69.js.map