@nasa-terra/components 0.0.189 → 0.0.191

package/dist/chunks/chunk.DISVMH23.js

@@ -1,157 +0,0 @@
-import{a as $}from"./chunk.D6BNW3QR.js";import{a as I}from"./chunk.GXTFJZWR.js";import{c as D}from"./chunk.77X2UDZ7.js";import{a as E}from"./chunk.XGR6WAN6.js";import{a as f,c as g}from"./chunk.VOQBVUDI.js";import{a as b,c as v}from"./chunk.U6R2SR47.js";import{a as k}from"./chunk.X5OPH5X7.js";import{b as x}from"./chunk.UTJA3S5Z.js";import{a as w}from"./chunk.GH5NAVUP.js";import{a as m}from"./chunk.CUJNKBC6.js";import{a as y}from"./chunk.6PEAAW4E.js";import{a as d}from"./chunk.J5Q4TWEG.js";import{a as C,b as O}from"./chunk.YDDI4ELW.js";import{e as s}from"./chunk.INFVQQSJ.js";import{classMap as L}from"lit/directives/class-map.js";import{html as p}from"lit";import{property as n,query as c,state as u}from"lit/decorators.js";import{unsafeHTML as _}from"lit/directives/unsafe-html.js";var i=class extends O{constructor(){super(...arguments);this.formControlController=new x(this,{assumeInteractionOn:["terra-blur","terra-input"]});this.hasSlotController=new y(this,"help-text","label");this.typeToSelectString="";this.hasFocus=!1;this.displayLabel="";this.selectedOptions=[];this.valueHasChanged=!1;this.name="";this._value="";this.defaultValue="";this.size="medium";this.placeholder="";this.multiple=!1;this.maxOptionsVisible=3;this.disabled=!1;this.clearable=!1;this.open=!1;this.hoist=!1;this.filled=!1;this.pill=!1;this.label="";this.placement="bottom";this.helpText="";this.form="";this.required=!1;this.getTag=t=>p`
-            <terra-tag
-                part="tag"
-                variant="topic"
-                size=${this.size}
-                @terra-remove=${e=>this.handleTagRemove(e,t)}
-            >
-                ${t.getTextLabel()}
-            </terra-tag>
-        `;this.handleDocumentFocusIn=t=>{let e=t.composedPath();this&&!e.includes(this)&&this.hide()};this.handleDocumentKeyDown=t=>{let e=t.target,o=e.closest(".select__clear")!==null,l=e.closest("terra-icon-button")!==null;if(!(o||l)){if(t.key==="Escape"&&this.open&&!this.closeWatcher&&(t.preventDefault(),t.stopPropagation(),this.hide(),this.displayInput.focus({preventScroll:!0})),t.key==="Enter"||t.key===" "&&this.typeToSelectString===""){if(t.preventDefault(),t.stopImmediatePropagation(),!this.open){this.show();return}this.currentOption&&!this.currentOption.disabled&&(this.valueHasChanged=!0,this.multiple?this.toggleOptionSelection(this.currentOption):this.setSelectedOptions(this.currentOption),this.updateComplete.then(()=>{this.emit("terra-input"),this.emit("terra-change")}),this.multiple||(this.hide(),this.displayInput.focus({preventScroll:!0})));return}if(["ArrowUp","ArrowDown","Home","End"].includes(t.key)){let r=this.getAllOptions(),a=r.indexOf(this.currentOption),h=Math.max(0,a);if(t.preventDefault(),!this.open&&(this.show(),this.currentOption))return;t.key==="ArrowDown"?(h=a+1,h>r.length-1&&(h=0)):t.key==="ArrowUp"?(h=a-1,h<0&&(h=r.length-1)):t.key==="Home"?h=0:t.key==="End"&&(h=r.length-1),this.setCurrentOption(r[h])}if(t.key&&t.key.length===1||t.key==="Backspace"){let r=this.getAllOptions();if(t.metaKey||t.ctrlKey||t.altKey)return;if(!this.open){if(t.key==="Backspace")return;this.show()}t.stopPropagation(),t.preventDefault(),clearTimeout(this.typeToSelectTimeout),this.typeToSelectTimeout=window.setTimeout(()=>this.typeToSelectString="",1e3),t.key==="Backspace"?this.typeToSelectString=this.typeToSelectString.slice(0,-1):this.typeToSelectString+=t.key.toLowerCase();for(let a of r)if(a.getTextLabel().toLowerCase().startsWith(this.typeToSelectString)){this.setCurrentOption(a);break}}}};this.handleDocumentMouseDown=t=>{let e=t.composedPath();this&&!e.includes(this)&&this.hide()}}get value(){return this._value}set value(t){this.multiple?t=Array.isArray(t)?t:t.split(" "):t=Array.isArray(t)?t.join(" "):t,this._value!==t&&(this.valueHasChanged=!0,this._value=t)}get validity(){return this.valueInput.validity}get validationMessage(){return this.valueInput.validationMessage}connectedCallback(){super.connectedCallback(),setTimeout(()=>{this.handleDefaultSlotChange()}),this.open=!1}addOpenListeners(){var t;document.addEventListener("focusin",this.handleDocumentFocusIn),document.addEventListener("keydown",this.handleDocumentKeyDown),document.addEventListener("mousedown",this.handleDocumentMouseDown),this.getRootNode()!==document&&this.getRootNode().addEventListener("focusin",this.handleDocumentFocusIn),"CloseWatcher"in window&&((t=this.closeWatcher)==null||t.destroy(),this.closeWatcher=new CloseWatcher,this.closeWatcher.onclose=()=>{this.open&&(this.hide(),this.displayInput.focus({preventScroll:!0}))})}removeOpenListeners(){var t;document.removeEventListener("focusin",this.handleDocumentFocusIn),document.removeEventListener("keydown",this.handleDocumentKeyDown),document.removeEventListener("mousedown",this.handleDocumentMouseDown),this.getRootNode()!==document&&this.getRootNode().removeEventListener("focusin",this.handleDocumentFocusIn),(t=this.closeWatcher)==null||t.destroy()}handleFocus(){this.hasFocus=!0,this.displayInput.setSelectionRange(0,0),this.emit("terra-focus")}handleBlur(){this.hasFocus=!1,this.emit("terra-blur")}handleLabelClick(){this.displayInput.focus()}handleComboboxMouseDown(t){let o=t.composedPath().some(l=>l instanceof Element&&l.tagName.toLowerCase()==="terra-icon-button");this.disabled||o||(t.preventDefault(),this.displayInput.focus({preventScroll:!0}),this.open=!this.open)}handleComboboxKeyDown(t){t.key!=="Tab"&&(t.stopPropagation(),this.handleDocumentKeyDown(t))}handleClearClick(t){t.stopPropagation(),this.valueHasChanged=!0,this.value!==""&&(this.setSelectedOptions([]),this.displayInput.focus({preventScroll:!0}),this.updateComplete.then(()=>{this.emit("terra-clear"),this.emit("terra-input"),this.emit("terra-change")}))}handleClearMouseDown(t){t.stopPropagation(),t.preventDefault()}handleOptionClick(t){let o=t.target.closest("terra-option"),l=this.value;o&&!o.disabled&&(this.valueHasChanged=!0,this.multiple?this.toggleOptionSelection(o):this.setSelectedOptions(o),this.updateComplete.then(()=>this.displayInput.focus({preventScroll:!0})),this.value!==l&&this.updateComplete.then(()=>{this.emit("terra-input"),this.emit("terra-change")}),this.multiple||(this.hide(),this.displayInput.focus({preventScroll:!0})))}handleDefaultSlotChange(){customElements.get("terra-option")||customElements.whenDefined("terra-option").then(()=>this.handleDefaultSlotChange());let t=this.getAllOptions(),e=this.valueHasChanged?this.value:this.defaultValue,o=Array.isArray(e)?e:[e],l=[];t.forEach(r=>l.push(r.value)),this.setSelectedOptions(t.filter(r=>o.includes(r.value)))}handleTagRemove(t,e){t.stopPropagation(),this.valueHasChanged=!0,this.disabled||(this.toggleOptionSelection(e,!1),this.updateComplete.then(()=>{this.emit("terra-input"),this.emit("terra-change")}))}getAllOptions(){return[...this.querySelectorAll("terra-option")]}getFirstOption(){return this.querySelector("terra-option")}setCurrentOption(t){this.getAllOptions().forEach(o=>{o.current=!1,o.tabIndex=-1}),t&&(this.currentOption=t,t.current=!0,t.tabIndex=0,t.focus())}setSelectedOptions(t){let e=this.getAllOptions(),o=Array.isArray(t)?t:[t];e.forEach(l=>l.selected=!1),o.length&&o.forEach(l=>l.selected=!0),this.selectionChanged()}toggleOptionSelection(t,e){e===!0||e===!1?t.selected=e:t.selected=!t.selected,this.selectionChanged()}selectionChanged(){var o,l,r;let t=this.getAllOptions();this.selectedOptions=t.filter(a=>a.selected);let e=this.valueHasChanged;if(this.multiple)this.value=this.selectedOptions.map(a=>a.value),this.placeholder&&this.value.length===0?this.displayLabel="":this.displayLabel=`${this.selectedOptions.length} selected`;else{let a=this.selectedOptions[0];this.value=(o=a==null?void 0:a.value)!=null?o:"",this.displayLabel=(r=(l=a==null?void 0:a.getTextLabel)==null?void 0:l.call(a))!=null?r:""}this.valueHasChanged=e,this.updateComplete.then(()=>{this.formControlController.updateValidity()})}get tags(){return this.selectedOptions.map((t,e)=>{if(e<this.maxOptionsVisible||this.maxOptionsVisible<=0){let o=this.getTag(t,e);return p`<div
-                    @terra-remove=${l=>this.handleTagRemove(l,t)}
-                >
-                    ${typeof o=="string"?_(o):o}
-                </div>`}else if(e===this.maxOptionsVisible)return p`<terra-tag size=${this.size}
-                    >+${this.selectedOptions.length-e}</terra-tag
-                >`;return p``})}handleInvalid(t){this.formControlController.setValidity(!1),this.formControlController.emitInvalidEvent(t)}handleDisabledChange(){this.disabled&&(this.open=!1,this.handleOpenChange())}attributeChangedCallback(t,e,o){if(super.attributeChangedCallback(t,e,o),t==="value"){let l=this.valueHasChanged;this.value=this.defaultValue,this.valueHasChanged=l}}handleValueChange(){if(!this.valueHasChanged){let o=this.valueHasChanged;this.value=this.defaultValue,this.valueHasChanged=o}let t=this.getAllOptions(),e=Array.isArray(this.value)?this.value:[this.value];this.setSelectedOptions(t.filter(o=>e.includes(o.value)))}async handleOpenChange(){if(this.open&&!this.disabled){this.setCurrentOption(this.selectedOptions[0]||this.getFirstOption()),this.emit("terra-show"),this.addOpenListeners(),await g(this),this.listbox.hidden=!1,this.popup.active=!0,requestAnimationFrame(()=>{this.setCurrentOption(this.currentOption)});let{keyframes:t,options:e}=v(this,"select.show",{dir:"ltr"});await f(this.popup.popup,t,e),this.currentOption&&D(this.currentOption,this.listbox,"vertical","auto"),this.emit("terra-after-show")}else{this.emit("terra-hide"),this.removeOpenListeners(),await g(this);let{keyframes:t,options:e}=v(this,"select.hide",{dir:"ltr"});await f(this.popup.popup,t,e),this.listbox.hidden=!0,this.popup.active=!1,this.emit("terra-after-hide")}}async show(){if(this.open||this.disabled){this.open=!1;return}return this.open=!0,m(this,"terra-after-show")}async hide(){if(!this.open||this.disabled){this.open=!1;return}return this.open=!1,m(this,"terra-after-hide")}checkValidity(){return this.valueInput.checkValidity()}getForm(){return this.formControlController.getForm()}reportValidity(){return this.valueInput.reportValidity()}setCustomValidity(t){this.valueInput.setCustomValidity(t),this.formControlController.updateValidity()}focus(t){this.displayInput.focus(t)}blur(){this.displayInput.blur()}render(){let t=this.hasSlotController.test("label"),e=this.hasSlotController.test("help-text"),o=this.label?!0:!!t,l=this.helpText?!0:!!e,r=this.clearable&&!this.disabled&&this.value.length>0,a=this.placeholder&&this.value&&this.value.length<=0;return p`
-            <div
-                part="form-control"
-                class=${L({"form-control":!0,"form-control--small":this.size==="small","form-control--medium":this.size==="medium","form-control--large":this.size==="large","form-control--has-label":o,"form-control--has-help-text":l})}
-            >
-                <label
-                    id="label"
-                    part="form-control-label"
-                    class="form-control__label"
-                    aria-hidden=${o?"false":"true"}
-                    @click=${this.handleLabelClick}
-                >
-                    <slot name="label">${this.label}</slot>
-                </label>
-
-                <div part="form-control-input" class="form-control-input">
-                    <terra-popup
-                        class=${L({select:!0,"select--standard":!0,"select--filled":this.filled,"select--pill":this.pill,"select--open":this.open,"select--disabled":this.disabled,"select--multiple":this.multiple,"select--focused":this.hasFocus,"select--placeholder-visible":a,"select--top":this.placement==="top","select--bottom":this.placement==="bottom","select--small":this.size==="small","select--medium":this.size==="medium","select--large":this.size==="large"})}
-                        placement=${this.placement}
-                        strategy=${this.hoist?"fixed":"absolute"}
-                        flip
-                        shift
-                        sync="width"
-                        auto-size="vertical"
-                        auto-size-padding="10"
-                    >
-                        <div
-                            part="combobox"
-                            class="select__combobox"
-                            slot="anchor"
-                            @keydown=${this.handleComboboxKeyDown}
-                            @mousedown=${this.handleComboboxMouseDown}
-                        >
-                            <slot
-                                part="prefix"
-                                name="prefix"
-                                class="select__prefix"
-                            ></slot>
-
-                            <input
-                                part="display-input"
-                                class="select__display-input"
-                                type="text"
-                                placeholder=${this.placeholder}
-                                .disabled=${this.disabled}
-                                .value=${this.displayLabel}
-                                autocomplete="off"
-                                spellcheck="false"
-                                autocapitalize="off"
-                                readonly
-                                aria-controls="listbox"
-                                aria-expanded=${this.open?"true":"false"}
-                                aria-haspopup="listbox"
-                                aria-labelledby="label"
-                                aria-disabled=${this.disabled?"true":"false"}
-                                aria-describedby="help-text"
-                                role="combobox"
-                                tabindex="0"
-                                @focus=${this.handleFocus}
-                                @blur=${this.handleBlur}
-                            />
-
-                            ${this.multiple?p`<div part="tags" class="select__tags">
-                                      ${this.tags}
-                                  </div>`:""}
-
-                            <input
-                                class="select__value-input"
-                                type="text"
-                                ?disabled=${this.disabled}
-                                ?required=${this.required}
-                                .value=${Array.isArray(this.value)?this.value.join(", "):this.value}
-                                tabindex="-1"
-                                aria-hidden="true"
-                                @focus=${()=>this.focus()}
-                                @invalid=${this.handleInvalid}
-                            />
-
-                            ${r?p`
-                                      <button
-                                          part="clear-button"
-                                          class="select__clear"
-                                          type="button"
-                                          aria-label="Clear selection"
-                                          @mousedown=${this.handleClearMouseDown}
-                                          @click=${this.handleClearClick}
-                                          tabindex="-1"
-                                      >
-                                          <slot name="clear-icon">
-                                              <terra-icon
-                                                  name="solid-x-circle"
-                                                  library="heroicons"
-                                              ></terra-icon>
-                                          </slot>
-                                      </button>
-                                  `:""}
-
-                            <slot
-                                name="suffix"
-                                part="suffix"
-                                class="select__suffix"
-                            ></slot>
-
-                            <slot
-                                name="expand-icon"
-                                part="expand-icon"
-                                class="select__expand-icon"
-                            >
-                                <terra-icon
-                                    library="heroicons"
-                                    name="solid-chevron-down"
-                                ></terra-icon>
-                            </slot>
-                        </div>
-
-                        <div
-                            id="listbox"
-                            role="listbox"
-                            aria-expanded=${this.open?"true":"false"}
-                            aria-multiselectable=${this.multiple?"true":"false"}
-                            aria-labelledby="label"
-                            part="listbox"
-                            class="select__listbox"
-                            tabindex="-1"
-                            @mouseup=${this.handleOptionClick}
-                            @slotchange=${this.handleDefaultSlotChange}
-                        >
-                            <slot></slot>
-                        </div>
-                    </terra-popup>
-                </div>
-
-                <div
-                    part="form-control-help-text"
-                    id="help-text"
-                    class="form-control__help-text"
-                    aria-hidden=${l?"false":"true"}
-                >
-                    <slot name="help-text">${this.helpText}</slot>
-                </div>
-            </div>
-        `}};i.styles=[C,k,I],i.dependencies={"terra-icon":w,"terra-popup":E,"terra-tag":$},s([c(".select")],i.prototype,"popup",2),s([c(".select__combobox")],i.prototype,"combobox",2),s([c(".select__display-input")],i.prototype,"displayInput",2),s([c(".select__value-input")],i.prototype,"valueInput",2),s([c(".select__listbox")],i.prototype,"listbox",2),s([u()],i.prototype,"hasFocus",2),s([u()],i.prototype,"displayLabel",2),s([u()],i.prototype,"currentOption",2),s([u()],i.prototype,"selectedOptions",2),s([u()],i.prototype,"valueHasChanged",2),s([n()],i.prototype,"name",2),s([u()],i.prototype,"value",1),s([n({attribute:"value"})],i.prototype,"defaultValue",2),s([n({reflect:!0})],i.prototype,"size",2),s([n()],i.prototype,"placeholder",2),s([n({type:Boolean,reflect:!0})],i.prototype,"multiple",2),s([n({attribute:"max-options-visible",type:Number})],i.prototype,"maxOptionsVisible",2),s([n({type:Boolean,reflect:!0})],i.prototype,"disabled",2),s([n({type:Boolean})],i.prototype,"clearable",2),s([n({type:Boolean,reflect:!0})],i.prototype,"open",2),s([n({type:Boolean})],i.prototype,"hoist",2),s([n({type:Boolean,reflect:!0})],i.prototype,"filled",2),s([n({type:Boolean,reflect:!0})],i.prototype,"pill",2),s([n()],i.prototype,"label",2),s([n({reflect:!0})],i.prototype,"placement",2),s([n({attribute:"help-text"})],i.prototype,"helpText",2),s([n({reflect:!0})],i.prototype,"form",2),s([n({type:Boolean,reflect:!0})],i.prototype,"required",2),s([n()],i.prototype,"getTag",2),s([d("disabled",{waitUntilFirstUpdate:!0})],i.prototype,"handleDisabledChange",1),s([d(["defaultValue","value"],{waitUntilFirstUpdate:!0})],i.prototype,"handleValueChange",1),s([d("open",{waitUntilFirstUpdate:!0})],i.prototype,"handleOpenChange",1);b("select.show",{keyframes:[{opacity:0,scale:.9},{opacity:1,scale:1}],options:{duration:100,easing:"ease"}});b("select.hide",{keyframes:[{opacity:1,scale:1},{opacity:0,scale:.9}],options:{duration:100,easing:"ease"}});export{i as a};

package/dist/chunks/chunk.DP2KMN7P.js

@@ -1,27 +0,0 @@
-import{a as h}from"./chunk.AGJNJSIX.js";import{a as i}from"./chunk.CUJNKBC6.js";import{a as o}from"./chunk.6PEAAW4E.js";import{a}from"./chunk.J5Q4TWEG.js";import{a as n,b as l}from"./chunk.YDDI4ELW.js";import{e as t}from"./chunk.INFVQQSJ.js";import{classMap as p}from"lit/directives/class-map.js";import{html as s}from"lit";import{property as r,query as m}from"lit/decorators.js";var e=class extends l{constructor(){super(...arguments);this.hasSlotController=new o(this,"icon","suffix");this.open=!1;this.closable=!1;this.variant="primary";this.sticky=!0;this.handleClose=()=>{this.hide()}}firstUpdated(){this.base.hidden=!this.open}async handleOpenChange(){this.base.hidden=!this.open,this.open?(this.emit("terra-show"),this.emit("terra-after-show")):(this.emit("terra-hide"),this.emit("terra-after-hide"))}async show(){if(!this.open)return this.open=!0,i(this,"terra-after-show")}async hide(){if(this.open)return this.open=!1,i(this,"terra-after-hide")}render(){return s`
-            <div
-                part="base"
-                class=${p({banner:!0,"banner--open":this.open,"banner--closable":this.closable,"banner--sticky":this.sticky,"banner--has-icon":this.hasSlotController.test("icon"),"banner--primary":this.variant==="primary","banner--neutral":this.variant==="neutral","banner--danger":this.variant==="danger"})}
-                role="banner"
-                aria-hidden=${this.open?"false":"true"}
-            >
-                ${this.hasSlotController.test("icon")?s`
-                          <div part="icon" class="banner__icon">
-                              <slot name="icon"></slot>
-                          </div>
-                      `:""}
-
-                <div part="message" class="banner__message" aria-live="polite">
-                    <slot></slot>
-                </div>
-
-                ${this.closable?s`
-                          <terra-icon
-                              class="banner__close"
-                              name="solid-x-mark"
-                              library="heroicons"
-                              @click=${this.handleClose}
-                          ></terra-icon>
-                      `:""}
-            </div>
-        `}};e.styles=[n,h],t([m('[part="base"]')],e.prototype,"base",2),t([r({type:Boolean,reflect:!0})],e.prototype,"open",2),t([r({type:Boolean,reflect:!0})],e.prototype,"closable",2),t([r({reflect:!0})],e.prototype,"variant",2),t([r({type:Boolean,reflect:!0})],e.prototype,"sticky",2),t([a("open",{waitUntilFirstUpdate:!0})],e.prototype,"handleOpenChange",1);export{e as a};

package/dist/chunks/chunk.DZ7UG2F5.js

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