@nasa-terra/components 0.0.191 → 0.0.193

package/dist/chunks/chunk.MS55ACG4.js

@@ -0,0 +1,47 @@
+import{a as u}from"./chunk.VSQMTGXR.js";import{a as d}from"./chunk.URTV3MIW.js";import{a as c}from"./chunk.X5OPH5X7.js";import{b as h}from"./chunk.UTJA3S5Z.js";import{a as s}from"./chunk.6PEAAW4E.js";import{a as o}from"./chunk.J5Q4TWEG.js";import{a,b as n}from"./chunk.ROAJDBWY.js";import{e as l}from"./chunk.INFVQQSJ.js";import{classMap as m}from"lit/directives/class-map.js";import{html as p}from"lit";import{ifDefined as f}from"lit/directives/if-defined.js";import{live as y}from"lit/directives/live.js";import{property as i,query as C,state as k}from"lit/decorators.js";var e=class extends n{constructor(){super(...arguments);this.formControlController=new h(this,{value:t=>t.checked?t.value||"on":void 0,defaultValue:t=>t.defaultChecked,setValue:(t,r)=>t.checked=r});this.hasSlotController=new s(this,"help-text");this.hasFocus=!1;this.title="";this.name="";this.size="medium";this.disabled=!1;this.checked=!1;this.defaultChecked=!1;this.form="";this.required=!1;this.helpText=""}get validity(){return this.input.validity}get validationMessage(){return this.input.validationMessage}firstUpdated(){this.formControlController.updateValidity()}handleBlur(){this.hasFocus=!1,this.emit("terra-blur")}handleInput(){this.emit("terra-input")}handleInvalid(t){this.formControlController.setValidity(!1),this.formControlController.emitInvalidEvent(t)}handleClick(){this.checked=!this.checked,this.emit("terra-change")}handleFocus(){this.hasFocus=!0,this.emit("terra-focus")}handleKeyDown(t){t.key==="ArrowLeft"&&(t.preventDefault(),this.checked=!1,this.emit("terra-change"),this.emit("terra-input")),t.key==="ArrowRight"&&(t.preventDefault(),this.checked=!0,this.emit("terra-change"),this.emit("terra-input"))}handleCheckedChange(){this.input.checked=this.checked,this.formControlController.updateValidity()}handleDisabledChange(){this.formControlController.setValidity(!0)}click(){this.input.click()}focus(t){this.input.focus(t)}blur(){this.input.blur()}checkValidity(){return this.input.checkValidity()}getForm(){return this.formControlController.getForm()}reportValidity(){return this.input.reportValidity()}setCustomValidity(t){this.input.setCustomValidity(t),this.formControlController.updateValidity()}render(){let t=this.hasSlotController.test("help-text"),r=this.helpText?!0:!!t;return p`
+            <div
+                class=${m({"form-control":!0,"form-control--small":this.size==="small","form-control--medium":this.size==="medium","form-control--large":this.size==="large","form-control--has-help-text":r})}
+            >
+                <label
+                    part="base"
+                    class=${m({toggle:!0,"toggle--checked":this.checked,"toggle--disabled":this.disabled,"toggle--focused":this.hasFocus,"toggle--small":this.size==="small","toggle--medium":this.size==="medium","toggle--large":this.size==="large"})}
+                >
+                    <input
+                        class="toggle__input"
+                        type="checkbox"
+                        title=${this.title}
+                        name=${this.name}
+                        value=${f(this.value)}
+                        .checked=${y(this.checked)}
+                        .disabled=${this.disabled}
+                        .required=${this.required}
+                        role="switch"
+                        aria-checked=${this.checked?"true":"false"}
+                        aria-describedby="help-text"
+                        @click=${this.handleClick}
+                        @input=${this.handleInput}
+                        @invalid=${this.handleInvalid}
+                        @blur=${this.handleBlur}
+                        @focus=${this.handleFocus}
+                        @keydown=${this.handleKeyDown}
+                    />
+
+                    <span part="control" class="toggle__control">
+                        <span part="thumb" class="toggle__thumb"></span>
+                    </span>
+
+                    <div part="label" class="toggle__label">
+                        <slot></slot>
+                    </div>
+                </label>
+
+                <div
+                    aria-hidden=${r?"false":"true"}
+                    class="form-control__help-text"
+                    id="help-text"
+                    part="form-control-help-text"
+                >
+                    <slot name="help-text">${this.helpText}</slot>
+                </div>
+            </div>
+        `}};e.styles=[a,c,u],l([C('input[type="checkbox"]')],e.prototype,"input",2),l([k()],e.prototype,"hasFocus",2),l([i()],e.prototype,"title",2),l([i()],e.prototype,"name",2),l([i()],e.prototype,"value",2),l([i({reflect:!0})],e.prototype,"size",2),l([i({type:Boolean,reflect:!0})],e.prototype,"disabled",2),l([i({type:Boolean,reflect:!0})],e.prototype,"checked",2),l([d("checked")],e.prototype,"defaultChecked",2),l([i({reflect:!0})],e.prototype,"form",2),l([i({type:Boolean,reflect:!0})],e.prototype,"required",2),l([i({attribute:"help-text"})],e.prototype,"helpText",2),l([o("checked",{waitUntilFirstUpdate:!0})],e.prototype,"handleCheckedChange",1),l([o("disabled",{waitUntilFirstUpdate:!0})],e.prototype,"handleDisabledChange",1);export{e as a};

package/dist/chunks/chunk.MTA4NBKZ.js

@@ -0,0 +1,17 @@
+import{a as c}from"./chunk.XOXHOZNI.js";import{a as s}from"./chunk.U42TLCPB.js";import{a as m,b as u}from"./chunk.ROAJDBWY.js";import{e as i}from"./chunk.INFVQQSJ.js";import{html as f}from"lit";import{property as n}from"lit/decorators.js";var a=class extends u{constructor(){super(...arguments);this.variant="information";this.duration=3e3;this.closable=!0}get alert(){return this.shadowRoot?this.shadowRoot.querySelector("terra-alert"):null}firstUpdated(){let t=this.alert;t&&(t.addEventListener("terra-show",()=>this.emit("terra-show")),t.addEventListener("terra-after-show",()=>this.emit("terra-after-show")),t.addEventListener("terra-hide",()=>this.emit("terra-hide")),t.addEventListener("terra-after-hide",()=>this.emit("terra-after-hide")))}async toast(){return new Promise(async t=>{await this.updateComplete,this.shadowRoot||await this.updateComplete;let r=this.alert;if(r||(await customElements.whenDefined("terra-alert"),await this.updateComplete,r=this.alert),!r){t();return}await r.updateComplete;let e=s.toastStack;e.parentElement===null&&document.body.append(e),e.appendChild(this),requestAnimationFrame(async()=>{this.clientWidth,await this.updateComplete,await r.updateComplete,r.open||await r.show()}),this.addEventListener("terra-after-hide",()=>{e.contains(this)&&e.removeChild(this),t(),e.querySelector("terra-toast")===null&&e.querySelector("terra-alert")===null&&e.remove()},{once:!0})})}async show(){await this.updateComplete;let t=this.alert;if(!t)throw new Error("TerraToast: Alert element not found");return await t.updateComplete,t.show()}async hide(){await this.updateComplete;let t=this.alert;if(!t)throw new Error("TerraToast: Alert element not found");return await t.updateComplete,t.hide()}static async notify(t,r="information",e,p=3e3){let l=h=>{let d=document.createElement("div");return d.textContent=h,d.innerHTML},o=Object.assign(document.createElement("terra-toast"),{variant:r,duration:p,closable:!0,innerHTML:e?`
+                    <terra-icon name="${e}" slot="icon" library="heroicons"></terra-icon>
+                    ${l(t)}
+                `:l(t)});return document.body.append(o),await customElements.whenDefined("terra-toast"),await o.updateComplete,o.toast()}render(){return f`
+            <terra-alert
+                part="base"
+                exportparts="base:base__base, icon:base__icon, message:base__message"
+                variant=${this.variant}
+                duration=${this.duration}
+                closable=${this.closable}
+                countdown=${this.countdown||""}
+                appearance="filled"
+            >
+                <slot name="icon" slot="icon"></slot>
+                <slot></slot>
+            </terra-alert>
+        `}};a.styles=[m,c],a.dependencies={"terra-alert":s},i([n({reflect:!0})],a.prototype,"variant",2),i([n({type:Number})],a.prototype,"duration",2),i([n({type:Boolean,reflect:!0})],a.prototype,"closable",2),i([n({type:String,reflect:!0})],a.prototype,"countdown",2);export{a};

package/dist/chunks/chunk.MXMW4LIA.js

@@ -0,0 +1 @@
+import{a as e}from"./chunk.5YPHEG75.js";var d=e;e.define("terra-slider");export{d as a};

package/dist/chunks/chunk.MYTNYPQR.js

@@ -0,0 +1 @@
+import{a as e}from"./chunk.ZL3KC4DQ.js";var T=e;e.define("terra-tab");export{T as a};

package/dist/chunks/chunk.MYXTSWP6.js

@@ -0,0 +1,154 @@
+import{a as w}from"./chunk.WGF6ZBTK.js";import{a as C}from"./chunk.URTV3MIW.js";import{a as _}from"./chunk.X5OPH5X7.js";import{b as g}from"./chunk.UTJA3S5Z.js";import{a as x}from"./chunk.INQGHKNR.js";import{a as b}from"./chunk.6PEAAW4E.js";import{a as p}from"./chunk.J5Q4TWEG.js";import{a as v,b as y}from"./chunk.ROAJDBWY.js";import{e as i}from"./chunk.INFVQQSJ.js";import{property as s,query as M,state as $}from"lit/decorators.js";import{classMap as V}from"lit/directives/class-map.js";import{html as o}from"lit";import{ifDefined as l}from"lit/directives/if-defined.js";import{live as k}from"lit/directives/live.js";var e=class extends y{constructor(){super(...arguments);this.formControlController=new g(this,{value:t=>t.value,defaultValue:t=>t.defaultValue,setValue:(t,a)=>t.value=a});this.hasSlotController=new b(this,"help-text","error","clear-icon","show-password-icon","hide-password-icon");this.hasFocus=!1;this.validationErrorMessage="";this.__numberInput=Object.assign(document.createElement("input"),{type:"number"});this.__dateInput=Object.assign(document.createElement("input"),{type:"date"});this.title="";this.type="text";this.name="";this.value="";this.placeholder="";this.size="medium";this.filled=!1;this.pill=!1;this.disabled=!1;this.readonly=!1;this.required=!1;this.inputMode="text";this.label="";this.hideLabel=!1;this.helpText="";this.errorText="";this.clearable=!1;this.passwordToggle=!1;this.passwordVisible=!1;this.noSpinButtons=!1;this.autofocus=!1;this.spellcheck=!0;this.defaultValue="";this.resettable=!1;this.form=""}get validity(){return this.input.validity}get validationMessage(){return this.input.validationMessage}get valueAsDate(){var t;return this.__dateInput.type=this.type,this.__dateInput.value=this.value,((t=this.input)==null?void 0:t.valueAsDate)||this.__dateInput.valueAsDate}set valueAsDate(t){this.__dateInput.type=this.type,this.__dateInput.valueAsDate=t,this.value=this.__dateInput.value}get valueAsNumber(){var t;return this.__numberInput.value=this.value,((t=this.input)==null?void 0:t.valueAsNumber)||this.__numberInput.valueAsNumber}set valueAsNumber(t){this.__numberInput.valueAsNumber=t,this.value=this.__numberInput.value}firstUpdated(){this.formControlController.updateValidity()}handleInput(){this.value=this.input.value,this.formControlController.updateValidity(),this.updateValidationErrorMessage(),this.emit("terra-input")}handleChange(){this.value=this.input.value,this.formControlController.updateValidity(),this.emit("terra-change")}handleInvalid(t){this.formControlController.setValidity(!1),this.updateValidationErrorMessage(),this.formControlController.emitInvalidEvent(t)}handleFocus(){this.hasFocus=!0,this.emit("terra-focus")}handleBlur(){this.hasFocus=!1,this.formControlController.updateValidity(),this.updateValidationErrorMessage(),this.emit("terra-blur")}handleKeyDown(t){let a=t.metaKey||t.ctrlKey||t.shiftKey||t.altKey;t.key==="Enter"&&!a&&setTimeout(()=>{!t.defaultPrevented&&!t.isComposing&&this.formControlController.submit()})}updateValidationErrorMessage(){this.input?this.input.validity.valid?this.validationErrorMessage="":this.validationErrorMessage=this.input.validationMessage:this.validationErrorMessage=""}handleReset(t){t.preventDefault(),t.stopPropagation(),!(this.disabled||this.readonly)&&(this.value=this.defaultValue||"",this.input.value=this.value,this.formControlController.updateValidity(),this.emit("terra-change"),this.input.focus())}handleClearClick(t){t.preventDefault(),this.value!==""&&(this.value="",this.emit("terra-clear"),this.emit("terra-input"),this.emit("terra-change")),this.input.focus()}handlePasswordToggle(){this.passwordVisible=!this.passwordVisible}handleDisabledChange(){this.formControlController.setValidity(this.disabled)}handleStepChange(){this.input&&(this.input.step=String(this.step),this.formControlController.updateValidity())}async handleValueChange(){await this.updateComplete,this.formControlController.updateValidity()}checkValidity(){return this.input.checkValidity()}getForm(){return this.formControlController.getForm()}reportValidity(){return this.input.reportValidity()}setCustomValidity(t){this.input.setCustomValidity(t),this.formControlController.updateValidity()}focus(t){this.input.focus(t)}blur(){this.input.blur()}select(){this.input.select()}setSelectionRange(t,a,r="none"){this.input.setSelectionRange(t,a,r)}setRangeText(t,a,r,n="preserve"){let d=a!=null?a:this.input.selectionStart,h=r!=null?r:this.input.selectionEnd;this.input.setRangeText(t,d,h,n),this.value!==this.input.value&&(this.value=this.input.value)}showPicker(){"showPicker"in HTMLInputElement.prototype&&this.input.showPicker()}stepUp(){this.input.stepUp(),this.value!==this.input.value&&(this.value=this.input.value)}stepDown(){this.input.stepDown(),this.value!==this.input.value&&(this.value=this.input.value)}render(){let t=this.querySelector('[slot="prefix"]')!==null,a=this.querySelector('[slot="suffix"]')!==null,r=this.hasSlotController.test("help-text"),n=this.helpText?!0:!!r,d=this.hasSlotController.test("error"),h=this.hasAttribute("data-user-invalid"),u=h&&(this.errorText||d||this.validationErrorMessage),E=h&&(this.errorText||this.validationErrorMessage)||"",m=this.clearable&&!this.disabled&&!this.readonly,f=m&&(typeof this.value=="number"||this.value.length>0),c=this.resettable&&!this.clearable&&this.value!==""&&this.value!==this.defaultValue&&this.type!=="search",S=m||c||this.passwordToggle&&this.type==="password"||a;return o`
+            <div
+                part="form-control"
+                class=${V({"form-control":!0,"form-control--small":this.size==="small","form-control--medium":this.size==="medium","form-control--large":this.size==="large","form-control--has-help-text":n&&!u,"form-control--has-error-text":u})}
+            >
+                ${this.label?o`
+                          <label
+                              for="input"
+                              part="form-control-label"
+                              class=${this.hideLabel?"input__label input__label--hidden":"input__label"}
+                          >
+                              ${this.label}
+                              ${this.required?o`<span class="input__required-indicator"
+                                        >*</span
+                                    >`:""}
+                          </label>
+                      `:""}
+
+                <div part="form-control-input" class="form-control-input">
+                    <div
+                        part="base"
+                        class=${V({input:!0,"input--small":this.size==="small","input--medium":this.size==="medium","input--large":this.size==="large","input--pill":this.pill,"input--standard":!this.filled,"input--filled":this.filled,"input--disabled":this.disabled,"input--focused":this.hasFocus,"input--empty":!this.value,"input--no-spin-buttons":this.noSpinButtons,"input--has-prefix":t,"input--has-suffix":S})}
+                    >
+                        ${t?o`
+                                  <span part="prefix" class="input__prefix">
+                                      <slot name="prefix"></slot>
+                                  </span>
+                              `:""}
+
+                        <input
+                            part="input"
+                            id="input"
+                            class="input__control"
+                            type=${this.type==="password"&&this.passwordVisible?"text":this.type}
+                            title=${this.title}
+                            name=${l(this.name||void 0)}
+                            ?disabled=${this.disabled}
+                            ?readonly=${this.readonly}
+                            ?required=${this.required}
+                            placeholder=${l(this.placeholder||void 0)}
+                            minlength=${l(this.minlength)}
+                            maxlength=${l(this.maxlength)}
+                            min=${l(this.min)}
+                            max=${l(this.max)}
+                            step=${l(this.step)}
+                            .value=${k(this.value)}
+                            autocapitalize=${l(this.getAttribute("autocapitalize"))}
+                            autocomplete=${l(this.autocomplete)}
+                            autocorrect=${l(this.getAttribute("autocorrect"))}
+                            ?autofocus=${this.autofocus}
+                            spellcheck=${this.spellcheck}
+                            pattern=${l(this.pattern)}
+                            enterkeyhint=${l(this.enterkeyhint)}
+                            inputmode=${l(this.inputMode)}
+                            aria-describedby=${u?"error-text":n?"help-text":void 0}
+                            aria-invalid=${u?"true":void 0}
+                            @input=${this.handleInput}
+                            @change=${this.handleChange}
+                            @invalid=${this.handleInvalid}
+                            @focus=${this.handleFocus}
+                            @blur=${this.handleBlur}
+                            @keydown=${this.handleKeyDown}
+                        />
+
+                        ${f?o`
+                                  <button
+                                      part="clear-button"
+                                      class="input__clear"
+                                      type="button"
+                                      aria-label="Clear input"
+                                      @click=${this.handleClearClick}
+                                      tabindex="-1"
+                                  >
+                                      <slot name="clear-icon">
+                                          <terra-icon
+                                              name="solid-x-circle"
+                                              library="heroicons"
+                                              font-size="1.2rem"
+                                          ></terra-icon>
+                                      </slot>
+                                  </button>
+                              `:""}
+                        ${this.passwordToggle&&this.type==="password"&&!this.disabled?o`
+                                  <button
+                                      part="password-toggle-button"
+                                      class="input__password-toggle"
+                                      type="button"
+                                      aria-label=${this.passwordVisible?"Hide password":"Show password"}
+                                      @click=${this.handlePasswordToggle}
+                                      tabindex="-1"
+                                  >
+                                      ${this.passwordVisible?o`
+                                                <slot name="show-password-icon">
+                                                    <terra-icon
+                                                        name="solid-eye-slash"
+                                                        library="heroicons"
+                                                    ></terra-icon>
+                                                </slot>
+                                            `:o`
+                                                <slot name="hide-password-icon">
+                                                    <terra-icon
+                                                        name="solid-eye"
+                                                        library="heroicons"
+                                                    ></terra-icon>
+                                                </slot>
+                                            `}
+                                  </button>
+                              `:""}
+                        ${c?o`
+                                  <button
+                                      type="button"
+                                      class="input__reset"
+                                      @click=${this.handleReset}
+                                      ?disabled=${this.disabled||this.readonly}
+                                      aria-label="Clear input"
+                                      tabindex="-1"
+                                  >
+                                      <terra-icon
+                                          name="solid-x-circle"
+                                          library="heroicons"
+                                          font-size="1.2rem"
+                                      ></terra-icon>
+                                  </button>
+                              `:""}
+                        ${a&&!f&&!c&&!(this.passwordToggle&&this.type==="password")?o`
+                                  <span part="suffix" class="input__suffix">
+                                      <slot name="suffix"></slot>
+                                  </span>
+                              `:""}
+                    </div>
+                </div>
+
+                ${u?o`
+                          <div
+                              aria-live="polite"
+                              aria-hidden="false"
+                              class="form-control__error-text"
+                              id="error-text"
+                              part="form-control-error-text"
+                          >
+                              <slot name="error">${E}</slot>
+                          </div>
+                      `:n?o`
+                            <div
+                                aria-hidden="false"
+                                class="form-control__help-text"
+                                id="help-text"
+                                part="form-control-help-text"
+                            >
+                                <slot name="help-text">${this.helpText}</slot>
+                            </div>
+                        `:""}
+            </div>
+        `}};e.styles=[v,_,w],e.dependencies={"terra-icon":x},i([M(".input__control")],e.prototype,"input",2),i([$()],e.prototype,"hasFocus",2),i([$()],e.prototype,"validationErrorMessage",2),i([s()],e.prototype,"title",2),i([s({reflect:!0})],e.prototype,"type",2),i([s()],e.prototype,"name",2),i([s()],e.prototype,"value",2),i([s()],e.prototype,"placeholder",2),i([s({reflect:!0})],e.prototype,"size",2),i([s({type:Boolean,reflect:!0})],e.prototype,"filled",2),i([s({type:Boolean,reflect:!0})],e.prototype,"pill",2),i([s({type:Boolean,reflect:!0})],e.prototype,"disabled",2),i([s({type:Boolean,reflect:!0})],e.prototype,"readonly",2),i([s({type:Boolean,reflect:!0})],e.prototype,"required",2),i([s()],e.prototype,"autocomplete",2),i([s({type:Number})],e.prototype,"minlength",2),i([s({type:Number})],e.prototype,"maxlength",2),i([s()],e.prototype,"min",2),i([s()],e.prototype,"max",2),i([s()],e.prototype,"step",2),i([s()],e.prototype,"pattern",2),i([s({attribute:"input-mode"})],e.prototype,"inputMode",2),i([s()],e.prototype,"label",2),i([s({attribute:"hide-label",type:Boolean})],e.prototype,"hideLabel",2),i([s({attribute:"help-text"})],e.prototype,"helpText",2),i([s({attribute:"error-text"})],e.prototype,"errorText",2),i([s({type:Boolean})],e.prototype,"clearable",2),i([s({attribute:"password-toggle",type:Boolean})],e.prototype,"passwordToggle",2),i([s({attribute:"password-visible",type:Boolean})],e.prototype,"passwordVisible",2),i([s({attribute:"no-spin-buttons",type:Boolean})],e.prototype,"noSpinButtons",2),i([s({type:Boolean})],e.prototype,"autofocus",2),i([s()],e.prototype,"enterkeyhint",2),i([s({type:Boolean,converter:{fromAttribute:t=>!(!t||t==="false"),toAttribute:t=>t?"true":"false"}})],e.prototype,"spellcheck",2),i([C("value")],e.prototype,"defaultValue",2),i([s({type:Boolean,reflect:!0})],e.prototype,"resettable",2),i([s({reflect:!0})],e.prototype,"form",2),i([p("disabled",{waitUntilFirstUpdate:!0})],e.prototype,"handleDisabledChange",1),i([p("step",{waitUntilFirstUpdate:!0})],e.prototype,"handleStepChange",1),i([p("value",{waitUntilFirstUpdate:!0})],e.prototype,"handleValueChange",1);export{e as a};

package/dist/chunks/chunk.MZZ2VFEY.js

@@ -0,0 +1,113 @@
+import{a as r}from"./chunk.3HLTQ7HX.js";import{a as f}from"./chunk.Y4QBAUPW.js";import{a as m}from"./chunk.L5A5OIFC.js";import{a as d}from"./chunk.IZZFNAC5.js";import{a as c}from"./chunk.NWPIYKNB.js";import{a as g}from"./chunk.MYXTSWP6.js";import{a as h,b as u}from"./chunk.ROAJDBWY.js";import{e as a}from"./chunk.INFVQQSJ.js";import{html as l,nothing as p}from"lit";import{property as s,query as w,state as b}from"lit/decorators.js";import{createRef as _,ref as y}from"lit/directives/ref.js";var i=class extends u{constructor(){super(...arguments);this.minZoom=0;this.maxZoom=23;this.zoom=1;this.hasNavigation=!0;this.hasCoordTracker=!0;this.hasShapeSelector=!1;this.showBoundingBoxSelection=!0;this.showPolygonSelection=!1;this.showPointSelection=!0;this.initialValue="";this.hideLabel=!1;this.label="Select Region";this.spatialConstraints="-180, -90, 180, 90";this.isExpanded=!1;this.worldWrap=!1;this.inline=!1;this.showMapOnFocus=!1;this.urlState=!1;this.helpText="";this.showClose=!1;this.error="";this.dropdownRef=_()}set hideBoundingBoxSelection(t){console.warn('"hide-bounding-box-selection" is deprecated. Use "show-bounding-box-selection" instead.'),this.showBoundingBoxSelection=!t}get hideBoundingBoxSelection(){return!this.showBoundingBoxSelection}set hidePointSelection(t){console.warn('"hide-point-selection" is deprecated. Use "show-point-selection" instead.'),this.showPointSelection=!t}get hidePointSelection(){return!this.showPointSelection}get _allowedTypes(){return{allowPoint:this.showPointSelection,allowBbox:this.showBoundingBoxSelection}}firstUpdated(){let e=new URLSearchParams(window.location.search).get("spatial"),o=this.urlState&&e?e:this.initialValue;o&&(typeof o=="string"?this._applyValue(o,{emit:!1}):this._commit(r.serialize(o),o))}setValue(t){this._applyValue(t,{emit:!0})}clear(){this._clearValue()}open(){var t;this.inline||(t=this.dropdownRef.value)==null||t.show()}close(){var t;this.inline||(t=this.dropdownRef.value)==null||t.hide()}setOpen(t){t?this.open():this.close()}_input(){var t;this.error="",(t=this.terraInput)==null||t.setCustomValidity("")}_change(){var e,o;this._input();let t=(o=(e=this.terraInput)==null?void 0:e.value)!=null?o:"";if(!t.trim()){this._clearValue();return}this._validateAndCommit(t)}_keydown(t){var e,o,n;if(t.key===" "){t.stopPropagation();return}t.key==="Enter"&&(t.preventDefault(),this._validateAndCommit((o=(e=this.terraInput)==null?void 0:e.value)!=null?o:""),(n=this.terraInput)==null||n.blur())}_blur(){var t,e;this._validateAndCommit((e=(t=this.terraInput)==null?void 0:t.value)!=null?e:"")}_focus(){var t;this.showMapOnFocus&&!this.inline&&((t=this.dropdownRef.value)==null||t.show())}_click(t){t.stopPropagation(),this.inline||(this.isExpanded?this.close():this.open())}_handleMapChange(t){let e=t.detail;if(e.cause==="clear"){this._clearValue();return}if(e.cause!=="draw")return;let o;if(e.type==="bbox"&&e.bounds)o=e.bounds;else if(e.type==="point"&&e.latLng)o=e.latLng;else{this.emit("terra-map-change",{detail:e});return}let n=r.validateConstraints(o,this.spatialConstraints);if(n){this.error=n,this.mapValue=void 0;return}let v=r.serialize(o);this._commit(v,o)}handleDropdownShow(){this.isExpanded=!0}handleDropdownHide(){this.isExpanded=!1}_validateAndCommit(t){var o;if(!t.trim()){this._clearValue();return}let e=r.validate(t,this._allowedTypes,this.spatialConstraints);if(!e.ok){this.error=e.error,(o=this.terraInput)==null||o.setCustomValidity(e.error);return}this._commit(e.serialized,e.value)}_applyValue(t,{emit:e}){if(typeof t!="string"){let n=r.serialize(t);this.error="",this.mapValue=n,this.terraInput&&(this.terraInput.value=n),e&&this._emitChange(t),this._updateURLParam(n);return}let o=r.validate(t,this._allowedTypes,this.spatialConstraints);if(!o.ok){this.error=o.error;return}this.error="",this.mapValue=o.serialized,this.terraInput&&(this.terraInput.value=o.serialized),e&&this._emitChange(o.value),this._updateURLParam(o.serialized)}_commit(t,e){var o;this.error="",(o=this.terraInput)==null||o.setCustomValidity(""),this.mapValue=t,this.terraInput&&(this.terraInput.value=t),this.initialValue=t,this._updateURLParam(t),this._emitChange(e)}_clearValue(){var t;this.error="",this.mapValue=void 0,(t=this.terraInput)==null||t.setCustomValidity(""),this.terraInput&&(this.terraInput.value=""),this._updateURLParam(null)}_emitChange(t){t instanceof d?this.emit("terra-map-change",{detail:{cause:"draw",type:"point",latLng:t}}):this.emit("terra-map-change",{detail:{cause:"draw",type:"bbox",bounds:t}})}_updateURLParam(t){if(!this.urlState)return;let e=new URL(window.location.href);t?e.searchParams.set("spatial",t):e.searchParams.delete("spatial"),window.history.replaceState({},"",e.toString())}renderMap(){return l`<terra-map
+            class="${this.inline?"inline":""}"
+            exportparts="map"
+            min-zoom=${this.minZoom}
+            max-zoom=${this.maxZoom}
+            zoom=${this.zoom}
+            ?show-mouse-coordinates=${this.hasCoordTracker}
+            .value=${this.mapValue}
+            ?has-navigation=${this.hasNavigation}
+            ?has-shape-selector=${this.hasShapeSelector}
+            ?show-bounding-box-selection=${this.showBoundingBoxSelection}
+            ?show-polygon-selection=${this.showPolygonSelection}
+            ?show-point-selection=${this.showPointSelection}
+            ?no-world-wrap=${!this.worldWrap}
+            spatial-constraints=${this.spatialConstraints}
+            @terra-map-change=${this._handleMapChange}
+        ></terra-map>`}_inputTemplate(t){return l`<terra-input
+            slot=${t!=null?t:p}
+            .label=${this.label}
+            .hideLabel=${this.hideLabel}
+            .value=${r.serialize(this.initialValue)}
+            placeholder="${this.spatialConstraints}"
+            aria-controls="map"
+            aria-expanded=${this.inline?!0:this.isExpanded}
+            @terra-input=${this._input}
+            @terra-change=${this._change}
+            @terra-blur=${this._blur}
+            @terra-focus=${this._focus}
+            @keydown=${this._keydown}
+            @click=${e=>{e.stopPropagation(),this._click(e)}}
+            name="spatial"
+            .helpText=${this.helpText}
+        >
+            <div slot="suffix" class="spatial-picker__suffix-icons">
+                ${this.mapValue?l`<button
+                          type="button"
+                          class="spatial-picker__clear-btn"
+                          aria-label="Clear input"
+                          tabindex="-1"
+                          @click=${e=>{e.stopPropagation(),this._clearValue()}}
+                      >
+                          <svg
+                              xmlns="http://www.w3.org/2000/svg"
+                              viewBox="0 0 24 24"
+                              fill="currentColor"
+                          >
+                              <path
+                                  fill-rule="evenodd"
+                                  d="M12 2.25c-5.385 0-9.75 4.365-9.75 9.75s4.365 9.75 9.75 9.75 9.75-4.365 9.75-9.75S17.385 2.25 12 2.25Zm-1.72 6.97a.75.75 0 1 0-1.06 1.06L10.94 12l-1.72 1.72a.75.75 0 1 0 1.06 1.06L12 13.06l1.72 1.72a.75.75 0 1 0 1.06-1.06L13.06 12l1.72-1.72a.75.75 0 1 0-1.06-1.06L12 10.94l-1.72-1.72Z"
+                                  clip-rule="evenodd"
+                              />
+                          </svg>
+                      </button>`:p}
+                <svg
+                    class="spatial-picker__input_icon"
+                    xmlns="http://www.w3.org/2000/svg"
+                    fill="none"
+                    viewBox="0 0 24 24"
+                    stroke-width="1.5"
+                    stroke="currentColor"
+                    @click=${this._click}
+                >
+                    <path
+                        stroke-linecap="round"
+                        stroke-linejoin="round"
+                        d="M9 6.75V15m6-6v8.25m.503 3.498 4.875-2.437c.381-.19.622-.58.622-1.006V4.82c0-.836-.88-1.38-1.628-1.006l-3.869 1.934c-.317.159-.69.159-1.006 0L9.503 3.252a1.125 1.125 0 0 0-1.006 0L3.622 5.689C3.24 5.88 3 6.27 3 6.695V19.18c0 .836.88 1.38 1.628 1.006l3.869-1.934c.317-.159.69-.159 1.006 0l4.994 2.497c.317.158.69.158 1.006 0Z"
+                    />
+                </svg>
+            </div>
+        </terra-input>`}render(){return this.inline?l`
+                <div class="spatial-picker">
+                    ${this._inputTemplate()}
+                    <slot name="additional-text"></slot>
+                    <div
+                        class="spatial-picker__map-container spatial-picker__map-container--inline"
+                    >
+                        ${this.renderMap()}
+                    </div>
+                    ${this.error?l`<div class="spatial-picker__error">${this.error}</div>`:p}
+                </div>
+            `:l`
+            <div class="spatial-picker">
+                <terra-dropdown
+                    ${y(this.dropdownRef)}
+                    placement="bottom-start"
+                    distance="4"
+                    @terra-show=${this.handleDropdownShow}
+                    @terra-hide=${this.handleDropdownHide}
+                    hoist
+                >
+                    ${this._inputTemplate("trigger")}
+                    <slot name="additional-text"></slot>
+                    <div
+                        class="spatial-picker__map-container"
+                        @click=${t=>t.stopPropagation()}
+                    >
+                        ${this.showClose?l`
+                                  <div class="dropdown-header">
+                                      <button
+                                          class="spatial-picker__close-btn"
+                                          @click=${t=>{t.stopPropagation(),this.close()}}
+                                          aria-label="Close"
+                                      >
+                                          ✕
+                                      </button>
+                                  </div>
+                              `:p}
+                        ${this.renderMap()}
+                    </div>
+                </terra-dropdown>
+                ${this.error?l`<div class="spatial-picker__error">${this.error}</div>`:p}
+            </div>
+        `}};i.styles=[h,f],i.dependencies={"terra-map":m,"terra-input":g,"terra-dropdown":c},a([s({attribute:"min-zoom",type:Number})],i.prototype,"minZoom",2),a([s({attribute:"max-zoom",type:Number})],i.prototype,"maxZoom",2),a([s({type:Number})],i.prototype,"zoom",2),a([s({attribute:"has-navigation",type:Boolean})],i.prototype,"hasNavigation",2),a([s({attribute:"has-coord-tracker",type:Boolean})],i.prototype,"hasCoordTracker",2),a([s({attribute:"has-shape-selector",type:Boolean})],i.prototype,"hasShapeSelector",2),a([s({attribute:"show-bounding-box-selection",type:Boolean})],i.prototype,"showBoundingBoxSelection",2),a([s({attribute:"show-polygon-selection",type:Boolean})],i.prototype,"showPolygonSelection",2),a([s({attribute:"hide-bounding-box-selection",type:Boolean})],i.prototype,"hideBoundingBoxSelection",1),a([s({attribute:"show-point-selection",type:Boolean})],i.prototype,"showPointSelection",2),a([s({attribute:"hide-point-selection",type:Boolean})],i.prototype,"hidePointSelection",1),a([s({attribute:"initial-value"})],i.prototype,"initialValue",2),a([s({attribute:"hide-label",type:Boolean})],i.prototype,"hideLabel",2),a([s()],i.prototype,"label",2),a([s({attribute:"spatial-constraints"})],i.prototype,"spatialConstraints",2),a([s({attribute:"is-expanded",type:Boolean,reflect:!0})],i.prototype,"isExpanded",2),a([s({attribute:"world-wrap",type:Boolean})],i.prototype,"worldWrap",2),a([s({type:Boolean})],i.prototype,"inline",2),a([s({attribute:"show-map-on-focus",type:Boolean})],i.prototype,"showMapOnFocus",2),a([s({attribute:"url-state",type:Boolean})],i.prototype,"urlState",2),a([s({attribute:"help-text"})],i.prototype,"helpText",2),a([s({attribute:"closable",type:Boolean})],i.prototype,"showClose",2),a([b()],i.prototype,"mapValue",2),a([b()],i.prototype,"error",2),a([w("terra-input")],i.prototype,"terraInput",2),a([w("terra-map")],i.prototype,"map",2);export{i as a};

package/dist/chunks/chunk.NA26KJ6N.js

@@ -0,0 +1 @@
+import{e as u}from"./chunk.3OKIF2KP.js";import{a as m}from"./chunk.BF5VMLO3.js";import{f as i,g as p,h as y}from"./chunk.INFVQQSJ.js";var r,f=class{constructor(t){p(this,r,void 0);y(this,r,new m(t,()=>u()))}get taskComplete(){var t,e;return(e=(t=i(this,r).result)==null?void 0:t.isSuccess)!=null?e:!1}get value(){var t;return(t=i(this,r).result)==null?void 0:t.data}get taskStatus(){var t,e,a;return(t=i(this,r).result)!=null&&t.isError?"ERROR":(e=i(this,r).result)!=null&&e.isSuccess?"COMPLETE":(a=i(this,r).result)!=null&&a.isPending?"PENDING":"INITIAL"}render(t){var a,s,l,o;let e=i(this,r).result;return!e||e.isPending&&e.fetchStatus==="idle"?(a=t.initial)==null?void 0:a.call(t):e.isPending||e.isFetching?(s=t.pending)==null?void 0:s.call(t):e.isError?(l=t.error)==null?void 0:l.call(t,e.error):(o=t.complete)==null?void 0:o.call(t,e.data)}};r=new WeakMap;export{f as a};

package/dist/chunks/chunk.NCU4D7Y7.js

@@ -0,0 +1 @@
+import{a as e}from"./chunk.VVD6IBEH.js";import*as t from"react";import{createComponent as r}from"@lit/react";import"@lit/react";var a="terra-menu";e.define("terra-menu");var n=r({tagName:a,elementClass:e,react:t,events:{onTerraSelect:"terra-select"},displayName:"TerraMenu"}),l=n;export{l as a};

package/dist/chunks/chunk.NIO6L3GW.js

@@ -0,0 +1,115 @@
+import{a as J}from"./chunk.22TWFDJS.js";import{a as R,b as S,c as q,e as E,f as N,g as z}from"./chunk.A6SIGE3C.js";import{a as X}from"./chunk.HRWEJEUM.js";import{a as j}from"./chunk.6QHJZKK3.js";import{a as K}from"./chunk.6FC5HIHI.js";import{a as P}from"./chunk.J5Q4TWEG.js";import{a as A,b as G}from"./chunk.ROAJDBWY.js";import{a as O,b as U,e as r,f as t,g as n,h as c,i as D}from"./chunk.INFVQQSJ.js";import Z from"fuse.js";import{LitElement as V,html as h,nothing as y}from"lit";import{property as p,state as L}from"lit/decorators.js";import{cache as _}from"lit/directives/cache.js";import{map as C}from"lit/directives/map.js";import{ref as F}from"lit/directives/ref.js";var o,u,g,d,f,m,x,b,k,T,M,w,v,$,H,Y,s=class s extends G{constructor(){super(...arguments);n(this,H);n(this,o,null);n(this,u,void 0);n(this,g,[]);n(this,d,null);n(this,f,null);n(this,m,null);n(this,x,null);this.label="Search for Variables";this.hideHelp=!1;this.hideLabel=!1;this.useTags=!1;this.isExpanded=!1;this.query=s.initialQuery;this.searchResults=[];this.tags=[];this.tagContainerWidth=0;n(this,b,a=>{this.emit("terra-combobox-change",{detail:JSON.parse(a)})});n(this,k,()=>{var a;this.isExpanded=!this.isExpanded,(a=t(this,o))==null||a.focus()});n(this,T,a=>{var i;let e=a.target;this.query=e.value,e.value&&(this.isExpanded=!0),this.searchResults=(i=t(this,f))==null?void 0:i.search(e.value).map(({item:l})=>l)});n(this,M,a=>{let e=a.composedPath(),[i]=e.filter(l=>l.role==="option");i&&t(this,$).call(this,i)});n(this,w,a=>{var e;switch(a.key){case"ArrowDown":{if(E(t(this,o),t(this,d)),this.isExpanded||(this.isExpanded=!0),a.altKey)break;N(t(this,m),t(this,o),"next");break}case"ArrowUp":{E(t(this,o),t(this,d)),this.isExpanded||(this.isExpanded=!0),N(t(this,m),t(this,o),"previous");break}case"Enter":{t(this,$).call(this,(e=t(this,m))==null?void 0:e.currentNode);break}case"Escape":{E(t(this,o),t(this,d)),this.isExpanded?(this.isExpanded=!1,this.dispatchEvent(new Event("cancel"))):this.query=s.initialQuery;break}default:break}});n(this,v,a=>{a.composedPath().some(l=>l.localName===s.tagName)||(this.isExpanded=!1)});n(this,$,a=>{let{longName:e,eventDetail:i}=a.dataset;this.query=`${e}`,t(this,b).call(this,i),this.isExpanded=!1,E(t(this,o),t(this,d)),this.useTags&&(this.tags=[`${e}`],t(this,o).value=s.initialQuery,this.query=s.initialQuery)})}async valueChanged(a,e){var W,B;if(a===e)return;await t(this,u).taskComplete;let i=z(this.value),l=(W=t(this,u).value)==null?void 0:W.find(I=>i===I.entryId);l&&(this.query=l.longName,this.searchResults=(B=t(this,f))==null?void 0:B.search(this.query).map(({item:I})=>I),t(this,b).call(this,l.eventDetail),this.useTags&&(this.tags=[`${l.longName}`],t(this,o).value=s.initialQuery,this.query=s.initialQuery))}connectedCallback(){super.connectedCallback(),c(this,u,new J(this,this.bearerToken)),globalThis.addEventListener("click",t(this,v))}disconnectedCallback(){super.disconnectedCallback(),globalThis.removeEventListener("click",t(this,v))}clear(){this.query=s.initialQuery}close(){this.isExpanded=!1}toggle(){this.isExpanded=!this.isExpanded}render(){var a;return h`<search part="base" title="Search through the list.">
+            <label for="combobox" class=${this.hideLabel?"sr-only":"input-label"}
+                >${this.label}</label
+            >
+            <div class="search-input-group">
+                ${this.useTags?h`<div
+                          ${F(e=>{var i;e&&((i=t(this,x))!=null||c(this,x,e),this.tagContainerWidth=e.getBoundingClientRect().width)})}
+                          class="tag-container"
+                          id="tag-container"
+                      >
+                          ${C(this.tags,(e,i)=>D(this,H,Y).call(this,e,i))}
+                      </div>`:y}
+                <input
+                    ${F(e=>{var i;e&&((i=t(this,o))!=null||c(this,o,e))})}
+                    autocomplete="off"
+                    aria-autocomplete="list"
+                    aria-controls="listbox"
+                    aria-haspopup="list"
+                    aria-expanded=${this.isExpanded}
+                    class="combobox"
+                    id="combobox"
+                    part="combobox"
+                    role="combobox"
+                    type="text"
+                    style=${this.useTags?`padding-inline-start: calc(${this.tagContainerWidth}px + 0.25rem);`:y}
+                    aria-describedby=${this.useTags?"tag-container":y}
+                    placeholder=${this.useTags?y:(a=this.placeholder)!=null?a:`${this.label}\u2026`}
+                    .value=${this.useTags?s.initialQuery:this.query}
+                    @input=${t(this,T)}
+                    @keydown=${t(this,w)}
+                    @click=${t(this,k)}
+                />
+                <terra-button
+                    shape="square-left"
+                    aria-controls="listbox"
+                    aria-expanded=${this.isExpanded}
+                    aria-label="List of Searchable Variables"
+                    class="combobox-button"
+                    id="combobox-button"
+                    variant="text"
+                    part="button"
+                    tabindex="-1"
+                    type="button"
+                    @click=${t(this,k)}
+                >
+                    ${["COMPLETE","ERROR"].includes(t(this,u).taskStatus)?h`<terra-icon
+                              class="chevron"
+                              name="chevron-down"
+                          ></terra-icon>`:h`<svg
+                              class="button-icon spinner"
+                              stroke="currentColor"
+                              viewBox="0 0 24 24"
+                              xmlns="http://www.w3.org/2000/svg"
+                          >
+                              <circle
+                                  cx="12"
+                                  cy="12"
+                                  r="9.5"
+                                  fill="none"
+                                  stroke-width="3"
+                              ></circle>
+                          </svg>`}
+                </terra-button>
+
+                ${this.hideHelp?y:h`<p class="search-help">
+                          See
+                          <a
+                              href="https://www.fusejs.io/examples.html#extended-search"
+                              rel="noopener noreferrer"
+                              tabindex=${this.isExpanded?"-1 ":"0"}
+                              target="_blank"
+                              >extended search syntax
+                              <terra-icon
+                                  name="outline-arrow-top-right-on-square"
+                                  library="heroicons"
+                              ></terra-icon></a
+                          >.
+                      </p>`}
+            </div>
+
+            <ul
+                ${F(e=>{var i;e&&((i=t(this,d))!=null||c(this,d,e),c(this,m,document.createTreeWalker(e,NodeFilter.SHOW_ELEMENT,l=>l.dataset.treeWalker==="filter_skip"?NodeFilter.FILTER_SKIP:NodeFilter.FILTER_ACCEPT)))})}
+                ?inert=${!this.isExpanded}
+                ?open=${this.isExpanded}
+                @click=${t(this,M)}
+                aria-label=${this.query?`Variables Matching ${this.query}`:"Variables"}
+                id="listbox"
+                part="listbox"
+                role="listbox"
+                class="search-results"
+            >
+                ${t(this,u).render({initial:()=>h`<li class="updating">Updating List of Variables</li>`,pending:()=>h`<li class="updating">Updating List of Variables</li>`,complete:e=>{let i=e.filter(l=>!(l.collectionShortName==="GPM_3IMERGHH"&&l.collectionVersion==="06"));return c(this,g,i),c(this,f,new Z(t(this,g),{findAllMatches:!0,keys:["entryId","longName","name","standardName","units"],useExtendedSearch:!0})),_(this.query===s.initialQuery?C(S(q(t(this,g))),R):C(S(q(this.searchResults)),R))},error:e=>h`<li class="error" data-tree-walker="filter_skip">
+                            ${e}
+                        </li>`})}
+            </ul>
+        </search>`}};o=new WeakMap,u=new WeakMap,g=new WeakMap,d=new WeakMap,f=new WeakMap,m=new WeakMap,x=new WeakMap,b=new WeakMap,k=new WeakMap,T=new WeakMap,M=new WeakMap,w=new WeakMap,v=new WeakMap,$=new WeakMap,H=new WeakSet,Y=function(a,e){return h`
+            <terra-button
+                size="small"
+                variant="default"
+                outline
+                class="tag"
+                title=${a}
+                aria-label=${`Clear tag ${a}`}
+                @click=${()=>{this.tags=[],this.clear(),setTimeout(()=>{var i;this.tagContainerWidth=(i=t(this,x))==null?void 0:i.getBoundingClientRect().width},100)}}
+                title=${a}
+            >
+                ${a}
+                <terra-icon
+                    class="tag-icon"
+                    slot="suffix"
+                    name="outline-x-circle"
+                    library="heroicons"
+                ></terra-icon>
+            </terra-button>
+        `},s.dependencies={"terra-button":K,"terra-icon":j},s.styles=[A,X],s.shadowRootOptions=U(O({},V.shadowRootOptions),{delegatesFocus:!0}),s.tagName="terra-variable-combobox",s.initialQuery="",r([p()],s.prototype,"label",2),r([p()],s.prototype,"placeholder",2),r([p({attribute:"hide-help",type:Boolean,reflect:!0})],s.prototype,"hideHelp",2),r([p({attribute:"hide-label",type:Boolean,reflect:!0})],s.prototype,"hideLabel",2),r([p({attribute:"use-tags",type:Boolean,reflect:!0})],s.prototype,"useTags",2),r([p()],s.prototype,"value",2),r([p({attribute:"bearer-token",reflect:!1})],s.prototype,"bearerToken",2),r([L()],s.prototype,"isExpanded",2),r([L()],s.prototype,"query",2),r([L()],s.prototype,"searchResults",2),r([L()],s.prototype,"tags",2),r([L()],s.prototype,"tagContainerWidth",2),r([P("value")],s.prototype,"valueChanged",1);var Q=s;export{Q as a};

package/dist/chunks/chunk.NIPNHY7U.js

@@ -0,0 +1,67 @@
+import{a as k}from"./chunk.W6DGR4DK.js";import{c as v}from"./chunk.77X2UDZ7.js";import{a as E}from"./chunk.INQGHKNR.js";import{a as p}from"./chunk.J5Q4TWEG.js";import{a as y,b as S}from"./chunk.ROAJDBWY.js";import{a as g,e as r}from"./chunk.INFVQQSJ.js";var _=(h,d)=>{let t=0;return function(...i){window.clearTimeout(t),t=window.setTimeout(()=>{h.call(this,...i)},d)}},A=(h,d,t)=>{let i=h[d];h[d]=function(...e){i.call(this,...e),t.call(this,i,...e)}},M="onscrollend"in window;if(!M){let h=new Set,d=new WeakMap,t=e=>{for(let s of e.changedTouches)h.add(s.identifier)},i=e=>{for(let s of e.changedTouches)h.delete(s.identifier)};document.addEventListener("touchstart",t,!0),document.addEventListener("touchend",i,!0),document.addEventListener("touchcancel",i,!0),A(EventTarget.prototype,"addEventListener",function(e,s){if(s!=="scrollend")return;let a=_(()=>{h.size?a():this.dispatchEvent(new Event("scrollend"))},100);e.call(this,"scroll",a,{passive:!0}),d.set(this,a)}),A(EventTarget.prototype,"removeEventListener",function(e,s){if(s!=="scrollend")return;let a=d.get(this);a&&e.call(this,"scroll",a,{passive:!0})})}import{classMap as m}from"lit/directives/class-map.js";import{eventOptions as O,property as u,query as f,state as T}from"lit/decorators.js";import{html as w}from"lit";var n=class extends S{constructor(){super(...arguments);this.tabs=[];this.focusableTabs=[];this.panels=[];this.hasScrollControls=!1;this.shouldHideScrollStartButton=!1;this.shouldHideScrollEndButton=!1;this.placement="top";this.activation="auto";this.noScrollControls=!1;this.fixedScrollControls=!1;this.size="large";this.scrollOffset=1}connectedCallback(){let t=Promise.all([customElements.whenDefined("terra-tab"),customElements.whenDefined("terra-tab-panel")]);super.connectedCallback(),this.resizeObserver=new ResizeObserver(()=>{this.repositionIndicator(),this.updateScrollControls()}),this.mutationObserver=new MutationObserver(i=>{let e=i.filter(({target:s})=>{if(s===this)return!0;if(s.closest("terra-tabs")!==this)return!1;let a=s.tagName.toLowerCase();return a==="terra-tab"||a==="terra-tab-panel"});if(e.length!==0){if(e.some(s=>!["aria-labelledby","aria-controls"].includes(s.attributeName))&&setTimeout(()=>this.setAriaLabels()),e.some(s=>s.attributeName==="disabled"))this.syncTabsAndPanels();else if(e.some(s=>s.attributeName==="active")){let a=e.filter(c=>c.attributeName==="active"&&c.target.tagName.toLowerCase()==="terra-tab").map(c=>c.target).find(c=>c.active);a&&this.setActiveTab(a)}}}),this.updateComplete.then(()=>{this.syncTabsAndPanels(),this.mutationObserver.observe(this,{attributes:!0,attributeFilter:["active","disabled","name","panel"],childList:!0,subtree:!0}),this.nav&&this.resizeObserver.observe(this.nav),t.then(()=>{let i=new IntersectionObserver((e,s)=>{var a;e[0].intersectionRatio>0&&(this.setAriaLabels(),this.setActiveTab((a=this.getActiveTab())!=null?a:this.tabs[0],{emitEvents:!1}),s.unobserve(e[0].target))});this.tabsElement&&i.observe(this.tabsElement)})})}disconnectedCallback(){var t,i;super.disconnectedCallback(),(t=this.mutationObserver)==null||t.disconnect(),this.nav&&((i=this.resizeObserver)==null||i.unobserve(this.nav))}getAllTabs(){return this.shadowRoot.querySelector('slot[name="nav"]').assignedElements()}getAllPanels(){return[...this.body.assignedElements()].filter(t=>t.tagName.toLowerCase()==="terra-tab-panel")}getActiveTab(){return this.tabs.find(t=>t.active)}handleClick(t){let e=t.target.closest("terra-tab");(e==null?void 0:e.closest("terra-tabs"))===this&&e!==null&&this.setActiveTab(e,{scrollBehavior:"smooth"})}handleKeyDown(t){let e=t.target.closest("terra-tab");if((e==null?void 0:e.closest("terra-tabs"))===this&&(["Enter"," "].includes(t.key)&&e!==null&&(this.setActiveTab(e,{scrollBehavior:"smooth"}),t.preventDefault()),["ArrowLeft","ArrowRight","ArrowUp","ArrowDown","Home","End"].includes(t.key))){let a=this.tabs.find(l=>l.matches(":focus")),c=getComputedStyle(this).direction==="rtl",o=null;if((a==null?void 0:a.tagName.toLowerCase())==="terra-tab"){if(t.key==="Home")o=this.focusableTabs[0];else if(t.key==="End")o=this.focusableTabs[this.focusableTabs.length-1];else if(["top","bottom"].includes(this.placement)&&t.key===(c?"ArrowRight":"ArrowLeft")||["start","end"].includes(this.placement)&&t.key==="ArrowUp"){let l=this.tabs.findIndex(b=>b===a);o=this.findNextFocusableTab(l,"backward")}else if(["top","bottom"].includes(this.placement)&&t.key===(c?"ArrowLeft":"ArrowRight")||["start","end"].includes(this.placement)&&t.key==="ArrowDown"){let l=this.tabs.findIndex(b=>b===a);o=this.findNextFocusableTab(l,"forward")}if(!o)return;o.tabIndex=0,o.focus({preventScroll:!0}),this.activation==="auto"?this.setActiveTab(o,{scrollBehavior:"smooth"}):this.tabs.forEach(l=>{l.tabIndex=l===o?0:-1}),["top","bottom"].includes(this.placement)&&v(o,this.nav,"horizontal"),t.preventDefault()}}}handleScrollToStart(){let t=getComputedStyle(this).direction==="rtl";this.nav.scroll({left:t?this.nav.scrollLeft+this.nav.clientWidth:this.nav.scrollLeft-this.nav.clientWidth,behavior:"smooth"})}handleScrollToEnd(){let t=getComputedStyle(this).direction==="rtl";this.nav.scroll({left:t?this.nav.scrollLeft-this.nav.clientWidth:this.nav.scrollLeft+this.nav.clientWidth,behavior:"smooth"})}setActiveTab(t,i){if(i=g({emitEvents:!0,scrollBehavior:"auto"},i),t!==this.activeTab&&!t.disabled){let e=this.activeTab;this.activeTab=t,this.tabs.forEach(s=>{s.active=s===this.activeTab,s.tabIndex=s===this.activeTab?0:-1}),this.panels.forEach(s=>{var a;return s.active=s.name===((a=this.activeTab)==null?void 0:a.panel)}),this.syncIndicator(),["top","bottom"].includes(this.placement)&&v(this.activeTab,this.nav,"horizontal",i.scrollBehavior),i.emitEvents&&(e&&this.emit("terra-tab-hide",{detail:{name:e.panel}}),this.emit("terra-tab-show",{detail:{name:this.activeTab.panel}}))}}setAriaLabels(){this.tabs.forEach(t=>{let i=this.panels.find(e=>e.name===t.panel);i&&(t.setAttribute("aria-controls",i.getAttribute("id")),i.setAttribute("aria-labelledby",t.getAttribute("id")))})}repositionIndicator(){let t=this.getActiveTab();if(!t)return;let i=t.clientWidth,e=t.clientHeight,s=getComputedStyle(this).direction==="rtl",a=this.getAllTabs(),o=a.slice(0,a.indexOf(t)).reduce((l,b)=>({left:l.left+b.clientWidth,top:l.top+b.clientHeight}),{left:0,top:0});switch(this.placement){case"top":case"bottom":this.indicator.style.width=`${i}px`,this.indicator.style.translate=s?`${-1*o.left}px`:`${o.left}px`;break;case"start":case"end":this.indicator.style.height=`${e}px`,this.indicator.style.translate=`0 ${o.top}px`;break}}syncTabsAndPanels(){this.tabs=this.getAllTabs(),this.focusableTabs=this.tabs.filter(t=>!t.disabled),this.tabs.forEach(t=>{t.hasAttribute("size")||(t.size=this.size)}),this.panels=this.getAllPanels(),this.syncIndicator(),this.updateComplete.then(()=>this.updateScrollControls())}findNextFocusableTab(t,i){let e=null,s=i==="forward"?1:-1,a=t+s;for(;t<this.tabs.length;){if(e=this.tabs[a]||null,e===null){i==="forward"?e=this.focusableTabs[0]:e=this.focusableTabs[this.focusableTabs.length-1];break}if(!e.disabled)break;a+=s}return e}updateScrollButtons(){this.hasScrollControls&&!this.fixedScrollControls&&(this.shouldHideScrollStartButton=this.scrollFromStart()<=this.scrollOffset,this.shouldHideScrollEndButton=this.isScrolledToEnd())}isScrolledToEnd(){return this.scrollFromStart()+this.nav.clientWidth>=this.nav.scrollWidth-this.scrollOffset}scrollFromStart(){return getComputedStyle(this).direction==="rtl"?-this.nav.scrollLeft:this.nav.scrollLeft}updateScrollControls(){this.noScrollControls?this.hasScrollControls=!1:this.hasScrollControls=["top","bottom"].includes(this.placement)&&this.nav.scrollWidth>this.nav.clientWidth+1,this.updateScrollButtons()}syncIndicator(){this.getActiveTab()?(this.indicator.style.display="block",this.repositionIndicator()):this.indicator.style.display="none"}syncSize(){this.tabs.forEach(t=>{t.hasAttribute("size")||(t.size=this.size)})}show(t){let i=this.tabs.find(e=>e.panel===t);i&&this.setActiveTab(i,{scrollBehavior:"smooth"})}render(){let t=getComputedStyle(this).direction==="rtl";return w`
+            <div
+                part="base"
+                class=${m({tabs:!0,"tabs--top":this.placement==="top","tabs--bottom":this.placement==="bottom","tabs--start":this.placement==="start","tabs--end":this.placement==="end","tabs--rtl":t,"tabs--has-scroll-controls":this.hasScrollControls,"tabs--large":this.size==="large","tabs--small":this.size==="small"})}
+                @click=${this.handleClick}
+                @keydown=${this.handleKeyDown}
+            >
+                <div class="tabs__nav-container" part="nav">
+                    ${this.hasScrollControls?w`
+                              <button
+                                  part="scroll-button scroll-button--start"
+                                  class=${m({"tabs__scroll-button":!0,"tabs__scroll-button--start":!0,"tabs__scroll-button--start--hidden":this.shouldHideScrollStartButton})}
+                                  tabindex="-1"
+                                  aria-hidden="true"
+                                  aria-label="Scroll to start"
+                                  @click=${this.handleScrollToStart}
+                                  type="button"
+                              >
+                                  <terra-icon
+                                      name=${t?"chevron-right":"chevron-left"}
+                                      library="heroicons"
+                                      font-size="1rem"
+                                  ></terra-icon>
+                              </button>
+                          `:""}
+
+                    <div class="tabs__nav" @scrollend=${this.updateScrollButtons}>
+                        <div part="tabs" class="tabs__tabs" role="tablist">
+                            <div
+                                part="active-tab-indicator"
+                                class="tabs__indicator"
+                            ></div>
+                            <div class="tabs__resize-observer">
+                                <slot
+                                    name="nav"
+                                    @slotchange=${this.syncTabsAndPanels}
+                                ></slot>
+                            </div>
+                        </div>
+                    </div>
+
+                    ${this.hasScrollControls?w`
+                              <button
+                                  part="scroll-button scroll-button--end"
+                                  class=${m({"tabs__scroll-button":!0,"tabs__scroll-button--end":!0,"tabs__scroll-button--end--hidden":this.shouldHideScrollEndButton})}
+                                  tabindex="-1"
+                                  aria-hidden="true"
+                                  aria-label="Scroll to end"
+                                  @click=${this.handleScrollToEnd}
+                                  type="button"
+                              >
+                                  <terra-icon
+                                      name=${t?"chevron-left":"chevron-right"}
+                                      library="heroicons"
+                                      font-size="1rem"
+                                  ></terra-icon>
+                              </button>
+                          `:""}
+                </div>
+
+                <slot
+                    part="body"
+                    class="tabs__body"
+                    @slotchange=${this.syncTabsAndPanels}
+                ></slot>
+            </div>
+        `}};n.styles=[y,k],n.dependencies={"terra-icon":E},r([f(".tabs")],n.prototype,"tabsElement",2),r([f(".tabs__body")],n.prototype,"body",2),r([f(".tabs__nav")],n.prototype,"nav",2),r([f(".tabs__indicator")],n.prototype,"indicator",2),r([T()],n.prototype,"hasScrollControls",2),r([T()],n.prototype,"shouldHideScrollStartButton",2),r([T()],n.prototype,"shouldHideScrollEndButton",2),r([u()],n.prototype,"placement",2),r([u()],n.prototype,"activation",2),r([u({attribute:"no-scroll-controls",type:Boolean})],n.prototype,"noScrollControls",2),r([u({attribute:"fixed-scroll-controls",type:Boolean})],n.prototype,"fixedScrollControls",2),r([u({reflect:!0})],n.prototype,"size",2),r([O({passive:!0})],n.prototype,"updateScrollButtons",1),r([p("noScrollControls",{waitUntilFirstUpdate:!0})],n.prototype,"updateScrollControls",1),r([p("placement",{waitUntilFirstUpdate:!0})],n.prototype,"syncIndicator",1),r([p("size",{waitUntilFirstUpdate:!0})],n.prototype,"syncSize",1);export{n as a};