@ncino/web-components 5.0.0-preview.1 → 5.0.0-preview.3

package/dist/components/checkbox-group/checkbox-group.gator.js

@@ -1,19 +1,19 @@
-import"../../node_modules/.pnpm/@lit_reactive-element@2.1.0/node_modules/@lit/reactive-element/reactive-element.js";import{html as h}from"../../node_modules/.pnpm/lit-html@3.3.0/node_modules/lit-html/lit-html.js";import"../../node_modules/.pnpm/lit-element@4.2.0/node_modules/lit-element/lit-element.js";import{customElement as m}from"../../node_modules/.pnpm/@lit_reactive-element@2.1.0/node_modules/@lit/reactive-element/decorators/custom-element.js";import{property as n}from"../../node_modules/.pnpm/@lit_reactive-element@2.1.0/node_modules/@lit/reactive-element/decorators/property.js";import{generateRandomId as g,getElementId as u}from"../../utils/string-utils.js";import b from"../../packages/web-components/src/components/checkbox-group/checkbox-group.gator.scss.js";import x from"../../packages/web-components/src/tokens/primitive.tokens.scss.js";import f from"../../packages/web-components/src/tokens/semantic.tokens.scss.js";import"../checkbox/checkbox.gator.js";import"../input/gator/input-label/input-label.gator.js";import"../input/gator/help-text/help-text.gator.js";import{handleDataTestid as y}from"../../utils/datatestid-utils.js";import{TestableLitElement as v}from"../../utils/components/testable-lit-element/testable-lit-element.js";import{ifDefined as c}from"../../node_modules/.pnpm/lit-html@3.3.0/node_modules/lit-html/directives/if-defined.js";import{unsafeCSS as d}from"../../node_modules/.pnpm/@lit_reactive-element@2.1.0/node_modules/@lit/reactive-element/css-tag.js";var $=Object.defineProperty,E=Object.getOwnPropertyDescriptor,a=(e,t,s,r)=>{for(var i=r>1?void 0:r?E(t,s):t,l=e.length-1,p;l>=0;l--)(p=e[l])&&(i=(r?p(t,s,i):p(i))||i);return r&&i&&$(t,s,i),i};let o=class extends v{constructor(){super(...arguments),this.id="",this.label="",this.helpText="",this.value=void 0,this.disabled=!1,this.hasError=!1,this.errorMessage="",this.options=[],this._randomId=g()}render(){const e=this.elementId;return h`
+import"../../node_modules/.pnpm/@lit_reactive-element@2.1.0/node_modules/@lit/reactive-element/reactive-element.js";import{html as a}from"../../node_modules/.pnpm/lit-html@3.3.0/node_modules/lit-html/lit-html.js";import"../../node_modules/.pnpm/lit-element@4.2.0/node_modules/lit-element/lit-element.js";import{customElement as m}from"../../node_modules/.pnpm/@lit_reactive-element@2.1.0/node_modules/@lit/reactive-element/decorators/custom-element.js";import{property as l}from"../../node_modules/.pnpm/@lit_reactive-element@2.1.0/node_modules/@lit/reactive-element/decorators/property.js";import{generateRandomId as g,getElementId as u}from"../../utils/string-utils.js";import b from"../../packages/web-components/src/components/checkbox-group/checkbox-group.gator.scss.js";import x from"../../packages/web-components/src/tokens/primitive.tokens.scss.js";import f from"../../packages/web-components/src/tokens/semantic.tokens.scss.js";import"../checkbox/checkbox.gator.js";import"../input/gator/input-label/input-label.gator.js";import"../input/gator/help-text/help-text.gator.js";import{handleDataTestid as y}from"../../utils/datatestid-utils.js";import{TestableLitElement as v}from"../../utils/components/testable-lit-element/testable-lit-element.js";import{ifDefined as c}from"../../node_modules/.pnpm/lit-html@3.3.0/node_modules/lit-html/directives/if-defined.js";import{unsafeCSS as d}from"../../node_modules/.pnpm/@lit_reactive-element@2.1.0/node_modules/@lit/reactive-element/css-tag.js";var $=Object.defineProperty,E=Object.getOwnPropertyDescriptor,i=(e,s,o,n)=>{for(var t=n>1?void 0:n?E(s,o):s,h=e.length-1,p;h>=0;h--)(p=e[h])&&(t=(n?p(s,o,t):p(t))||t);return n&&t&&$(s,o,t),t};let r=class extends v{constructor(){super(...arguments),this.id="",this.label="",this.helpText="",this.value=void 0,this.disabled=!1,this.hasError=!1,this.errorMessage="",this.options=[],this._randomId=g()}render(){const e=this.elementId;return a`
 			<div class="gator-checkbox-group-container">
-				${this.label?h`<ngc-input-label id="${e}-label" data-testid=${c(this.labelDataTestid)}>${this.label}</ngc-input-label>`:null}
+				${this.label?a`<ngc-input-label id="${e}-label" data-testid=${c(this.labelDataTestid)}>${this.label}</ngc-input-label>`:null}
 				<div id="${e}-group"
 					role="group"
 					class="gator-checkbox-group"
 					aria-labelledby="${e}-label"
 					aria-describedby=${this.describedBy}
 					>
-					${this.options.length>0?this.checkboxesFromOptions:h`<slot @change=${this.handleCheckboxSelectionChange}></slot>`}
+					${this.options.length>0?this.checkboxesFromOptions:a`<slot @change=${this.handleCheckboxSelectionChange}></slot>`}
 				</div>
-				${this.hasError&&this.errorMessage!==""?h`<ngc-help-text id="${e}-error" data-testid=${c(this.errorMessageDataTestid)} icon error>${this.errorMessage}</ngc-help-text>`:null}
-				${this.helpText?h`<ngc-help-text id="${e}-help" data-testid=${c(this.helpTextDataTestid)}>${this.helpText}</ngc-help-text>`:null}
+				${this.hasError&&this.errorMessage!==""?a`<ngc-help-text id="${e}-error" data-testid=${c(this.errorMessageDataTestid)} icon error>${this.errorMessage}</ngc-help-text>`:null}
+				${this.helpText?a`<ngc-help-text id="${e}-help" data-testid=${c(this.helpTextDataTestid)}>${this.helpText}</ngc-help-text>`:null}
 			</div>
-		`}get elementId(){return u(this.id,this._randomId)}get describedBy(){const e=[];return this.errorMessage&&e.push(`${this.elementId}-error`),this.helpText&&e.push(`${this.elementId}-help`),e.join(" ")}get checkboxesFromOptions(){return h`
-			${this.options.map(e=>h`
+		`}get elementId(){return u(this.id,this._randomId)}get describedBy(){const e=[];return this.errorMessage&&e.push(`${this.elementId}-error`),this.helpText&&e.push(`${this.elementId}-help`),e.join(" ")}get checkboxesFromOptions(){return a`
+			${this.options.map(e=>a`
 				<ngc-checkbox
 					value="${e.value}"
 					@change=${this.handleCheckboxSelectionChange}
@@ -21,4 +21,4 @@ import"../../node_modules/.pnpm/@lit_reactive-element@2.1.0/node_modules/@lit/re
 					>
 				</ngc-checkbox>
 			`)}
-		`}handleCheckboxSelectionChange(e){var r;const t=e;e.stopImmediatePropagation();const s=new Set((r=this.value)==null?void 0:r.split(";"));t.detail.selected?s.add(t.detail.value):s.delete(t.detail.value),this.value=Array.from(s).join(";"),this.dispatchEvent(new CustomEvent("change",{bubbles:!0,composed:!0,detail:this.value}))}get checkboxElements(){var t,s,r;if(this.options.length>0)return(t=this.shadowRoot)==null?void 0:t.querySelectorAll("ngc-checkbox");const e=(r=(s=this.shadowRoot)==null?void 0:s.querySelector("slot"))==null?void 0:r.assignedElements();return e&&e.length===1&&e[0]instanceof HTMLSlotElement?e[0].assignedElements():e}updated(){var s;const e=new Set((s=this.value)==null?void 0:s.split(";")),t=this.checkboxElements;t&&t.length>0&&t.forEach((r,i)=>{const l=r;l.selected=e.has(l.value),l.disabled=this.disabled,l.hasError=this.hasError,y(l,this.dataTestid,`checkbox-${i}`)})}};o.styles=[d(x),d(f),d(b)];a([n({type:String})],o.prototype,"id",2);a([n({type:String})],o.prototype,"label",2);a([n({type:String,attribute:"help-text"})],o.prototype,"helpText",2);a([n({type:String})],o.prototype,"value",2);a([n({type:Boolean})],o.prototype,"disabled",2);a([n({type:Boolean,attribute:"has-error"})],o.prototype,"hasError",2);a([n({type:String,attribute:"error-message"})],o.prototype,"errorMessage",2);a([n({type:Array})],o.prototype,"options",2);o=a([m("ngc-checkbox-group")],o);export{o as NgcCheckboxGroup};
+		`}handleCheckboxSelectionChange(e){const s=e;e.stopImmediatePropagation();const o=new Set(this.value?.split(";"));s.detail.selected?o.add(s.detail.value):o.delete(s.detail.value),this.value=Array.from(o).join(";"),this.dispatchEvent(new CustomEvent("change",{bubbles:!0,composed:!0,detail:this.value}))}get checkboxElements(){if(this.options.length>0)return this.shadowRoot?.querySelectorAll("ngc-checkbox");const e=this.shadowRoot?.querySelector("slot")?.assignedElements();return e&&e.length===1&&e[0]instanceof HTMLSlotElement?e[0].assignedElements():e}updated(){const e=new Set(this.value?.split(";")),s=this.checkboxElements;s&&s.length>0&&s.forEach((o,n)=>{const t=o;t.selected=e.has(t.value),t.disabled=this.disabled,t.hasError=this.hasError,y(t,this.dataTestid,`checkbox-${n}`)})}};r.styles=[d(x),d(f),d(b)];i([l({type:String})],r.prototype,"id",2);i([l({type:String})],r.prototype,"label",2);i([l({type:String,attribute:"help-text"})],r.prototype,"helpText",2);i([l({type:String})],r.prototype,"value",2);i([l({type:Boolean})],r.prototype,"disabled",2);i([l({type:Boolean,attribute:"has-error"})],r.prototype,"hasError",2);i([l({type:String,attribute:"error-message"})],r.prototype,"errorMessage",2);i([l({type:Array})],r.prototype,"options",2);r=i([m("ngc-checkbox-group")],r);export{r as NgcCheckboxGroup};

package/dist/components/combobox/base/combobox.js

@@ -1 +1 @@
-import{property as l}from"../../../node_modules/.pnpm/@lit_reactive-element@2.1.0/node_modules/@lit/reactive-element/decorators/property.js";import{state as h}from"../../../node_modules/.pnpm/@lit_reactive-element@2.1.0/node_modules/@lit/reactive-element/decorators/state.js";import{createRef as c}from"../../../node_modules/.pnpm/lit-html@3.3.0/node_modules/lit-html/directives/ref.js";import{TestableLitElement as p}from"../../../utils/components/testable-lit-element/testable-lit-element.js";var u=Object.defineProperty,r=(d,e,t,s)=>{for(var o=void 0,a=d.length-1,n;a>=0;a--)(n=d[a])&&(o=n(e,t,o)||o);return o&&u(e,t,o),o};class i extends p{constructor(){super(...arguments),this.options=[],this.value="",this.label="",this.placeholder="Search...",this.open=!1,this.required=!1,this.valid=!0,this.requiredErrorText="Select an option from the picklist or remove the search term.",this.displayedErrorText="",this._comboboxRef=c()}selectOption(e){this.open=!1,this.value=e.value,this.valid=!0,this.displayedErrorText="",this.dispatchEvent(new CustomEvent("change",{detail:e,bubbles:!0})),setTimeout(()=>{var s;let t=(s=this.shadowRoot)==null?void 0:s.querySelector('div[role="combobox"]');t==null||t.focus()})}setFocusClassForListItemAtIndex(e){var s,o,a,n;const t=(s=this.shadowRoot)==null?void 0:s.querySelectorAll('[role="option"]');(o=t[e])==null||o.classList.add("slds-has-focus"),(n=this._comboboxRef.value)==null||n.setAttribute("aria-activedescendant",(a=t[e])==null?void 0:a.id)}removeFocusClassForListItemAtIndex(e){var s,o;(o=((s=this.shadowRoot)==null?void 0:s.querySelectorAll('[role="option"]'))[e])==null||o.classList.remove("slds-has-focus")}getActiveIndexOfListItems(){var s,o;const e=(s=this.shadowRoot)==null?void 0:s.querySelectorAll('[role="option"]'),t=(o=this.shadowRoot)==null?void 0:o.querySelector(".slds-has-focus");return Array.from(e).indexOf(t)}getListItemNodes(){var e;return(e=this.shadowRoot)==null?void 0:e.querySelectorAll('[role="option"]')}scrollIntoView(){var t;const e=(t=this.shadowRoot)==null?void 0:t.querySelector(".slds-has-focus");e==null||e.scrollIntoView({block:"nearest"})}handleArrowDown(){this.open||(this.open=!0);let e=this.getActiveIndexOfListItems();e===-1&&this.setFocusClassForListItemAtIndex(0);let t=e+1;t>this.getListItemNodes().length-1&&(t=0),this.setFocusClassForListItemAtIndex(t),this.removeFocusClassForListItemAtIndex(e),this.scrollIntoView()}handleArrowUp(){this.open||(this.open=!0);let e=this.getActiveIndexOfListItems(),t=e-1;t<0&&(t=this.getListItemNodes().length-1),this.setFocusClassForListItemAtIndex(t),this.removeFocusClassForListItemAtIndex(e),this.scrollIntoView()}}r([l()],i.prototype,"options");r([l()],i.prototype,"value");r([l()],i.prototype,"label");r([l()],i.prototype,"placeholder");r([l({type:Boolean})],i.prototype,"open");r([l({type:Boolean})],i.prototype,"required");r([l({type:Boolean})],i.prototype,"valid");r([l({attribute:"required-error-text"})],i.prototype,"requiredErrorText");r([h()],i.prototype,"displayedErrorText");export{i as NjcCombobox};
+import{property as r}from"../../../node_modules/.pnpm/@lit_reactive-element@2.1.0/node_modules/@lit/reactive-element/decorators/property.js";import{state as d}from"../../../node_modules/.pnpm/@lit_reactive-element@2.1.0/node_modules/@lit/reactive-element/decorators/state.js";import{createRef as h}from"../../../node_modules/.pnpm/lit-html@3.3.0/node_modules/lit-html/directives/ref.js";import{TestableLitElement as c}from"../../../utils/components/testable-lit-element/testable-lit-element.js";var p=Object.defineProperty,o=(l,e,t,u)=>{for(var i=void 0,n=l.length-1,a;n>=0;n--)(a=l[n])&&(i=a(e,t,i)||i);return i&&p(e,t,i),i};class s extends c{constructor(){super(...arguments),this.options=[],this.value="",this.label="",this.placeholder="Search...",this.open=!1,this.required=!1,this.valid=!0,this.requiredErrorText="Select an option from the picklist or remove the search term.",this.displayedErrorText="",this._comboboxRef=h()}selectOption(e){this.open=!1,this.value=e.value,this.valid=!0,this.displayedErrorText="",this.dispatchEvent(new CustomEvent("change",{detail:e,bubbles:!0})),setTimeout(()=>{this.shadowRoot?.querySelector('div[role="combobox"]')?.focus()})}setFocusClassForListItemAtIndex(e){const t=this.shadowRoot?.querySelectorAll('[role="option"]');t[e]?.classList.add("slds-has-focus"),this._comboboxRef.value?.setAttribute("aria-activedescendant",t[e]?.id)}removeFocusClassForListItemAtIndex(e){(this.shadowRoot?.querySelectorAll('[role="option"]'))[e]?.classList.remove("slds-has-focus")}getActiveIndexOfListItems(){const e=this.shadowRoot?.querySelectorAll('[role="option"]'),t=this.shadowRoot?.querySelector(".slds-has-focus");return Array.from(e).indexOf(t)}getListItemNodes(){return this.shadowRoot?.querySelectorAll('[role="option"]')}scrollIntoView(){this.shadowRoot?.querySelector(".slds-has-focus")?.scrollIntoView({block:"nearest"})}handleArrowDown(){this.open||(this.open=!0);let e=this.getActiveIndexOfListItems();e===-1&&this.setFocusClassForListItemAtIndex(0);let t=e+1;t>this.getListItemNodes().length-1&&(t=0),this.setFocusClassForListItemAtIndex(t),this.removeFocusClassForListItemAtIndex(e),this.scrollIntoView()}handleArrowUp(){this.open||(this.open=!0);let e=this.getActiveIndexOfListItems(),t=e-1;t<0&&(t=this.getListItemNodes().length-1),this.setFocusClassForListItemAtIndex(t),this.removeFocusClassForListItemAtIndex(e),this.scrollIntoView()}}o([r()],s.prototype,"options");o([r()],s.prototype,"value");o([r()],s.prototype,"label");o([r()],s.prototype,"placeholder");o([r({type:Boolean})],s.prototype,"open");o([r({type:Boolean})],s.prototype,"required");o([r({type:Boolean})],s.prototype,"valid");o([r({attribute:"required-error-text"})],s.prototype,"requiredErrorText");o([d()],s.prototype,"displayedErrorText");export{s as NjcCombobox};

package/dist/components/combobox/base/combobox.slds.js

@@ -1,4 +1,4 @@
-import"../../../node_modules/.pnpm/@lit_reactive-element@2.1.0/node_modules/@lit/reactive-element/reactive-element.js";import{html as r}from"../../../node_modules/.pnpm/lit-html@3.3.0/node_modules/lit-html/lit-html.js";import"../../../node_modules/.pnpm/lit-element@4.2.0/node_modules/lit-element/lit-element.js";import y from"../../../packages/web-components/src/index.slds.scss.js";import{customElement as T}from"../../../node_modules/.pnpm/@lit_reactive-element@2.1.0/node_modules/@lit/reactive-element/decorators/custom-element.js";import{property as h}from"../../../node_modules/.pnpm/@lit_reactive-element@2.1.0/node_modules/@lit/reactive-element/decorators/property.js";import{state as I}from"../../../node_modules/.pnpm/@lit_reactive-element@2.1.0/node_modules/@lit/reactive-element/decorators/state.js";import{NjcCombobox as g}from"./combobox.js";import{generateRandomId as C}from"../../../utils/string-utils.js";import"../../input/slds/input-label/input-label.slds.js";import"../../input/slds/input-error/input-error.slds.js";import{KEY_CONSTANTS as p}from"../../../consts/key-constants.js";import{ref as f}from"../../../node_modules/.pnpm/lit-html@3.3.0/node_modules/lit-html/directives/ref.js";import{handleDataTestid as n}from"../../../utils/datatestid-utils.js";import"../combobox-item/combobox-item.slds.js";import"../../icon/slds/icon.slds.js";import{unsafeCSS as S,css as E}from"../../../node_modules/.pnpm/@lit_reactive-element@2.1.0/node_modules/@lit/reactive-element/css-tag.js";var L=Object.defineProperty,A=Object.getOwnPropertyDescriptor,d=(s,e,t,a)=>{for(var o=a>1?void 0:a?A(e,t):e,c=s.length-1,l;c>=0;c--)(l=s[c])&&(o=(a?l(e,t,o):l(o))||o);return a&&o&&L(e,t,o),o},v=(s=>(s.FIVE="5",s.SEVEN="7",s.TEN="10",s.NOSCROLL="",s))(v||{});let i=class extends g{constructor(){super(...arguments),this.autocomplete=!1,this.clearAssistiveText="Clear",this.comboboxAriaLabel="Dropdown Items",this.dropdownLength="10",this._searchValue="",this._generatedId=C()}updated(){this.updateDataTestids()}render(){return r`
+import"../../../node_modules/.pnpm/@lit_reactive-element@2.1.0/node_modules/@lit/reactive-element/reactive-element.js";import{html as a}from"../../../node_modules/.pnpm/lit-html@3.3.0/node_modules/lit-html/lit-html.js";import"../../../node_modules/.pnpm/lit-element@4.2.0/node_modules/lit-element/lit-element.js";import _ from"../../../packages/web-components/src/index.slds.scss.js";import{customElement as f}from"../../../node_modules/.pnpm/@lit_reactive-element@2.1.0/node_modules/@lit/reactive-element/decorators/custom-element.js";import{property as h}from"../../../node_modules/.pnpm/@lit_reactive-element@2.1.0/node_modules/@lit/reactive-element/decorators/property.js";import{state as v}from"../../../node_modules/.pnpm/@lit_reactive-element@2.1.0/node_modules/@lit/reactive-element/decorators/state.js";import{NjcCombobox as b}from"./combobox.js";import{generateRandomId as g}from"../../../utils/string-utils.js";import"../../input/slds/input-label/input-label.slds.js";import"../../input/slds/input-error/input-error.slds.js";import{KEY_CONSTANTS as p}from"../../../consts/key-constants.js";import{ref as u}from"../../../node_modules/.pnpm/lit-html@3.3.0/node_modules/lit-html/directives/ref.js";import{handleDataTestid as l}from"../../../utils/datatestid-utils.js";import"../combobox-item/combobox-item.slds.js";import"../../icon/slds/icon.slds.js";import{unsafeCSS as $,css as w}from"../../../node_modules/.pnpm/@lit_reactive-element@2.1.0/node_modules/@lit/reactive-element/css-tag.js";var y=Object.defineProperty,T=Object.getOwnPropertyDescriptor,r=(e,t,n,i)=>{for(var s=i>1?void 0:i?T(t,n):t,d=e.length-1,c;d>=0;d--)(c=e[d])&&(s=(i?c(t,n,s):c(s))||s);return i&&s&&y(t,n,s),s},m=(e=>(e.FIVE="5",e.SEVEN="7",e.TEN="10",e.NOSCROLL="",e))(m||{});let o=class extends b{constructor(){super(...arguments),this.autocomplete=!1,this.clearAssistiveText="Clear",this.comboboxAriaLabel="Dropdown Items",this.dropdownLength="10",this._searchValue="",this._generatedId=g()}updated(){this.updateDataTestids()}render(){return a`
             <div class="slds-form-element${this.valid?"":" slds-has-error"}" @focusout=${this._topLevelFocusOut}>
                 <nsc-input-label
                     .required="${this.required}"
@@ -21,12 +21,12 @@ import"../../../node_modules/.pnpm/@lit_reactive-element@2.1.0/node_modules/@lit
                                 role="listbox"
                             >
                                 <ul class="slds-listbox slds-listbox_vertical" role="presentation">
-                                    ${this._filteredOptions.map(s=>r`
+                                    ${this._filteredOptions.map(e=>a`
                                             <nsc-combobox-item
                                                 .searchValue="${this._searchValue}"
-                                                label="${s.label}"
-                                                value="${s.value}"
-                                                @change=${()=>this.selectOption(s)}
+                                                label="${e.label}"
+                                                value="${e.value}"
+                                                @change=${()=>this.selectOption(e)}
                                                 .selectedValue="${this.value}"
                                             ></nsc-combobox-item>
                                         `)}
@@ -36,13 +36,13 @@ import"../../../node_modules/.pnpm/@lit_reactive-element@2.1.0/node_modules/@lit
                         </div>
                     </div>
                 </div>
-                ${this.displayedErrorText?r`<nsc-input-error>${this.displayedErrorText}</nsc-input-error>`:null}
+                ${this.displayedErrorText?a`<nsc-input-error>${this.displayedErrorText}</nsc-input-error>`:null}
             </div>
-        `}get dropdownLengthClass(){return this.dropdownLength!=""?`slds-dropdown_length-${this.dropdownLength}`:""}get optionLabel(){var s;return((s=this.options.find(e=>e.value===this.value))==null?void 0:s.label)??""}get dropdownTriggerMarkup(){return r`
+        `}get dropdownLengthClass(){return this.dropdownLength!=""?`slds-dropdown_length-${this.dropdownLength}`:""}get optionLabel(){return this.options.find(e=>e.value===this.value)?.label??""}get dropdownTriggerMarkup(){return a`
             <div class="slds-combobox__form-element slds-input-has-icon slds-input-has-icon_right" role="none">
                 <div
                     role="combobox"
-                    ${f(this._comboboxRef)}
+                    ${u(this._comboboxRef)}
                     @keydown=${this.handleKeyDown}
                     tabindex="0"
                     class="${this._fauxInputClasses}"
@@ -59,7 +59,7 @@ import"../../../node_modules/.pnpm/@lit_reactive-element@2.1.0/node_modules/@lit
                     <nsc-icon name="down" size="x-small" svg-classes="slds-icon-text-default"></nsc-icon>
                 </span>
             </div>
-        `}get _fauxInputClasses(){return`slds-input_faux slds-combobox__input ${this.value?"slds-combobox__input-value":""}`}handleDropdownClick(){this.open=!this.open}get autocompleteMarkup(){return this.value?r`
+        `}get _fauxInputClasses(){return`slds-input_faux slds-combobox__input ${this.value?"slds-combobox__input-value":""}`}handleDropdownClick(){this.open=!this.open}get autocompleteMarkup(){return this.value?a`
                 <div role="combobox"
                      tabindex="0"
                      class="slds-input_faux slds-combobox__input slds-combobox__input-value"
@@ -74,10 +74,10 @@ import"../../../node_modules/.pnpm/@lit_reactive-element@2.1.0/node_modules/@lit
                     <nsc-icon name="close" size="x-small" svg-classes="slds-icon-text-default"></nsc-icon>
                     <span class="slds-assistive-text">${this.clearAssistiveText}</span>
                 </button>
-            `:r`
+            `:a`
             <div class="slds-combobox__form-element slds-input-has-icon slds-input-has-icon_right" role="none">
                 <input
-                    ${f(this._comboboxRef)}
+                    ${u(this._comboboxRef)}
                     type="text"
                     class="slds-input slds-combobox__input"
                     id="combobox-id-${this._generatedId}"
@@ -99,10 +99,10 @@ import"../../../node_modules/.pnpm/@lit_reactive-element@2.1.0/node_modules/@lit
                     <nsc-icon name="search" size="x-small" svg-classes="slds-icon-text-default"></nsc-icon>
                 </span>
             </div>
-        `}handleKeyDown(s){var e;switch(s.key){case p.DOWN:this.handleArrowDown(),s.preventDefault();break;case p.UP:this.handleArrowUp(),s.preventDefault();break;case p.ENTER:let t=(e=this.shadowRoot)==null?void 0:e.querySelector(".slds-has-focus");t?t.click():this.open=!this.open,s.preventDefault();break;case p.ESCAPE:this.open&&s.stopPropagation(),this.open=!1,this.clearFocusClassFromOptions(),s.preventDefault();break}}_topLevelFocusOut(s){s.currentTarget&&s.relatedTarget&&s.currentTarget.contains(s.relatedTarget)||((this.required||this._searchValue)&&!this.value?(this.valid=!1,this.displayedErrorText=this.requiredErrorText):(this.valid=!0,this.displayedErrorText=""),this.open=!1,this.clearFocusClassFromOptions())}clearFocusClassFromOptions(){var e;((e=this.shadowRoot)==null?void 0:e.querySelectorAll('[role="option"]')).forEach(t=>t.classList.remove("slds-has-focus"))}clearValue(){this.value="",this._searchValue="",this.dispatchEvent(new CustomEvent("change",{detail:void 0,bubbles:!0})),setTimeout(()=>{var e;let s=(e=this.shadowRoot)==null?void 0:e.getElementById(`combobox-id-${this._generatedId}`);s==null||s.focus()})}_handleAutocompleteInput(s){var e;this.open||(this.open=!0),this._searchValue=((e=s==null?void 0:s.target)==null?void 0:e.value)??""}get _filteredOptions(){return this._searchValue?this.options.filter(s=>s.label.toLowerCase().includes(this._searchValue.toLowerCase())):this.options}updateDataTestids(){var l,u,b,m,x,_;const s=(l=this.shadowRoot)==null?void 0:l.querySelector('[role="combobox"]');n(s,this.dataTestid,"combobox");const e=(u=this.shadowRoot)==null?void 0:u.querySelector('[role="listbox"]');n(e,this.dataTestid,"listbox");const t=(b=this.shadowRoot)==null?void 0:b.querySelector('button[title="Clear"]');n(t,this.dataTestid,"clear-button");const a=(m=this.shadowRoot)==null?void 0:m.querySelector("nsc-input-label");n(a,this.dataTestid,"label");const o=(x=this.shadowRoot)==null?void 0:x.querySelector("nsc-input-error");n(o,this.dataTestid,"error");const c=(_=this.shadowRoot)==null?void 0:_.querySelectorAll("nsc-combobox-item");for(let[$,w]of c.entries())n(w,this.dataTestid,`option-${$}`)}};i.shadowRootOptions={...g.shadowRootOptions,delegatesFocus:!0};i.styles=[S(y),E`
+        `}handleKeyDown(e){switch(e.key){case p.DOWN:this.handleArrowDown(),e.preventDefault();break;case p.UP:this.handleArrowUp(),e.preventDefault();break;case p.ENTER:let t=this.shadowRoot?.querySelector(".slds-has-focus");t?t.click():this.open=!this.open,e.preventDefault();break;case p.ESCAPE:this.open&&e.stopPropagation(),this.open=!1,this.clearFocusClassFromOptions(),e.preventDefault();break}}_topLevelFocusOut(e){e.currentTarget&&e.relatedTarget&&e.currentTarget.contains(e.relatedTarget)||((this.required||this._searchValue)&&!this.value?(this.valid=!1,this.displayedErrorText=this.requiredErrorText):(this.valid=!0,this.displayedErrorText=""),this.open=!1,this.clearFocusClassFromOptions())}clearFocusClassFromOptions(){(this.shadowRoot?.querySelectorAll('[role="option"]')).forEach(t=>t.classList.remove("slds-has-focus"))}clearValue(){this.value="",this._searchValue="",this.dispatchEvent(new CustomEvent("change",{detail:void 0,bubbles:!0})),setTimeout(()=>{this.shadowRoot?.getElementById(`combobox-id-${this._generatedId}`)?.focus()})}_handleAutocompleteInput(e){this.open||(this.open=!0),this._searchValue=e?.target?.value??""}get _filteredOptions(){return this._searchValue?this.options.filter(e=>e.label.toLowerCase().includes(this._searchValue.toLowerCase())):this.options}updateDataTestids(){const e=this.shadowRoot?.querySelector('[role="combobox"]');l(e,this.dataTestid,"combobox");const t=this.shadowRoot?.querySelector('[role="listbox"]');l(t,this.dataTestid,"listbox");const n=this.shadowRoot?.querySelector('button[title="Clear"]');l(n,this.dataTestid,"clear-button");const i=this.shadowRoot?.querySelector("nsc-input-label");l(i,this.dataTestid,"label");const s=this.shadowRoot?.querySelector("nsc-input-error");l(s,this.dataTestid,"error");const d=this.shadowRoot?.querySelectorAll("nsc-combobox-item");for(let[c,x]of d.entries())l(x,this.dataTestid,`option-${c}`)}};o.shadowRootOptions={...b.shadowRootOptions,delegatesFocus:!0};o.styles=[$(_),w`
             .clear-icon {
                 position: absolute;
                 right: 0.5rem;
                 top: 0.45rem;
             }
-        `];d([h({type:Boolean})],i.prototype,"autocomplete",2);d([h({type:String,attribute:"clear-assistive-text"})],i.prototype,"clearAssistiveText",2);d([h({type:String,attribute:"combobox-aria-label"})],i.prototype,"comboboxAriaLabel",2);d([h({type:v,attribute:"dropdown-length"})],i.prototype,"dropdownLength",2);d([I()],i.prototype,"_searchValue",2);i=d([T("nsc-combobox")],i);export{v as COMBOBOX_DROPDOWN_LENGTH,i as NjcSldsCombobox};
+        `];r([h({type:Boolean})],o.prototype,"autocomplete",2);r([h({type:String,attribute:"clear-assistive-text"})],o.prototype,"clearAssistiveText",2);r([h({type:String,attribute:"combobox-aria-label"})],o.prototype,"comboboxAriaLabel",2);r([h({type:m,attribute:"dropdown-length"})],o.prototype,"dropdownLength",2);r([v()],o.prototype,"_searchValue",2);o=r([f("nsc-combobox")],o);export{m as COMBOBOX_DROPDOWN_LENGTH,o as NjcSldsCombobox};

package/dist/components/date-picker/base/gator/datepicker.gator.js

@@ -1,4 +1,4 @@
-import"../../../../node_modules/.pnpm/@lit_reactive-element@2.1.0/node_modules/@lit/reactive-element/reactive-element.js";import{html as i}from"../../../../node_modules/.pnpm/lit-html@3.3.0/node_modules/lit-html/lit-html.js";import{LitElement as b}from"../../../../node_modules/.pnpm/lit-element@4.2.0/node_modules/lit-element/lit-element.js";import y from"../../../../packages/web-components/src/components/date-picker/base/gator/datepicker.gator.scss.js";import f from"../../../../packages/web-components/src/tokens/primitive.tokens.scss.js";import m from"../../../../packages/web-components/src/tokens/semantic.tokens.scss.js";import D from"../../../../packages/web-components/src/components/button/gator/button.gator.scss.js";import{customElement as _}from"../../../../node_modules/.pnpm/@lit_reactive-element@2.1.0/node_modules/@lit/reactive-element/decorators/custom-element.js";import{state as S}from"../../../../node_modules/.pnpm/@lit_reactive-element@2.1.0/node_modules/@lit/reactive-element/decorators/state.js";import"../../../icon-button/gator/icon-button.gator.js";import"../../../button/gator/button.gator.js";import"../../../selector/gator/selector.gator.js";import{SELECTOR_TYPE as d}from"../../year-month-selector/year-month-selector.gator.js";import{NjcDatepicker as w}from"../datepicker.js";import{KEY_CONSTANTS as n}from"../../../../consts/key-constants.js";import{msg as c}from"../../../../node_modules/.pnpm/@lit_localize@0.12.2/node_modules/@lit/localize/init/install.js";import{localized as k}from"../../../../node_modules/.pnpm/@lit_localize@0.12.2/node_modules/@lit/localize/internal/localized-decorator.js";import"../../../../node_modules/.pnpm/@lit_localize@0.12.2/node_modules/@lit/localize/init/runtime.js";import{unsafeCSS as u}from"../../../../node_modules/.pnpm/@lit_reactive-element@2.1.0/node_modules/@lit/reactive-element/css-tag.js";var M=Object.defineProperty,x=Object.getOwnPropertyDescriptor,p=(e,t,a,r)=>{for(var o=r>1?void 0:r?x(t,a):t,s=e.length-1,l;s>=0;s--)(l=e[s])&&(o=(r?l(t,a,o):l(o))||o);return r&&o&&M(t,a,o),o},Y=(e=>(e.CALENDAR="calendar",e.MONTHS="months",e.YEARS="years",e))(Y||{});let h=class extends w{constructor(){super(...arguments),this._currentView="calendar",this.previousScrollTop=0}render(){return i`
+import"../../../../node_modules/.pnpm/@lit_reactive-element@2.1.0/node_modules/@lit/reactive-element/reactive-element.js";import{html as i}from"../../../../node_modules/.pnpm/lit-html@3.3.0/node_modules/lit-html/lit-html.js";import{LitElement as f}from"../../../../node_modules/.pnpm/lit-element@4.2.0/node_modules/lit-element/lit-element.js";import b from"../../../../packages/web-components/src/components/date-picker/base/gator/datepicker.gator.scss.js";import y from"../../../../packages/web-components/src/tokens/primitive.tokens.scss.js";import m from"../../../../packages/web-components/src/tokens/semantic.tokens.scss.js";import D from"../../../../packages/web-components/src/components/button/gator/button.gator.scss.js";import{customElement as _}from"../../../../node_modules/.pnpm/@lit_reactive-element@2.1.0/node_modules/@lit/reactive-element/decorators/custom-element.js";import{state as S}from"../../../../node_modules/.pnpm/@lit_reactive-element@2.1.0/node_modules/@lit/reactive-element/decorators/state.js";import"../../../icon-button/gator/icon-button.gator.js";import"../../../button/gator/button.gator.js";import"../../../selector/gator/selector.gator.js";import{SELECTOR_TYPE as d}from"../../year-month-selector/year-month-selector.gator.js";import{NjcDatepicker as w}from"../datepicker.js";import{KEY_CONSTANTS as n}from"../../../../consts/key-constants.js";import{msg as c}from"../../../../node_modules/.pnpm/@lit_localize@0.12.2/node_modules/@lit/localize/init/install.js";import{localized as k}from"../../../../node_modules/.pnpm/@lit_localize@0.12.2/node_modules/@lit/localize/internal/localized-decorator.js";import"../../../../node_modules/.pnpm/@lit_localize@0.12.2/node_modules/@lit/localize/init/runtime.js";import{unsafeCSS as u}from"../../../../node_modules/.pnpm/@lit_reactive-element@2.1.0/node_modules/@lit/reactive-element/css-tag.js";var M=Object.defineProperty,x=Object.getOwnPropertyDescriptor,p=(e,t,r,a)=>{for(var o=a>1?void 0:a?x(t,r):t,s=e.length-1,l;s>=0;s--)(l=e[s])&&(o=(a?l(t,r,o):l(o))||o);return a&&o&&M(t,r,o),o},Y=(e=>(e.CALENDAR="calendar",e.MONTHS="months",e.YEARS="years",e))(Y||{});let h=class extends w{constructor(){super(...arguments),this._currentView="calendar",this.previousScrollTop=0}render(){return i`
             <div class="gator-datepicker"
                 role="dialog"
                 aria-modal="true"
@@ -8,7 +8,7 @@ import"../../../../node_modules/.pnpm/@lit_reactive-element@2.1.0/node_modules/@
                 ${this.headerMarkup}
                 ${this.currentViewMarkup}
             </div>
-        `}updated(e){super.updated(e),e.has("_contextMonth")&&this.shiftFocusToCalendarGrid()}shiftFocusToCalendarGrid(){setTimeout(()=>{var e;(e=this.renderRoot.querySelector('ngc-selector[tabindex="0"]'))==null||e.focus()},0)}handleDatepickerKeydown(e){this._currentView==="calendar"?this.handleCalendarViewKeydown(e):this.handleSelectionDialogKeydown(e)}get headerMarkup(){return i`
+        `}updated(e){super.updated(e),e.has("_contextMonth")&&this.shiftFocusToCalendarGrid()}shiftFocusToCalendarGrid(){setTimeout(()=>{this.renderRoot.querySelector('ngc-selector[tabindex="0"]')?.focus()},0)}handleDatepickerKeydown(e){this._currentView==="calendar"?this.handleCalendarViewKeydown(e):this.handleSelectionDialogKeydown(e)}get headerMarkup(){return i`
             <div class="gator-datepicker-header">
                 <div class="gator-datepicker-header-title">
                     <ngc-icon-button
@@ -55,7 +55,7 @@ import"../../../../node_modules/.pnpm/@lit_reactive-element@2.1.0/node_modules/@
                     </ngc-icon-button>
                 </div>
             </div>
-        `}handlePreviousMonthClicked(){this._contextDate=new Date(this._contextYear,this._contextMonth-1,1),this._currentView="calendar"}handleMonthClick(){this._currentView==="months"?this._currentView="calendar":this._currentView="months"}handleYearClick(){this._currentView==="years"?this._currentView="calendar":(this._currentView="years",this.scrollToSelectedYear())}handleNextMonthClicked(){this._contextDate=new Date(this._contextYear,this._contextMonth+1,1),this._currentView="calendar"}handleYearMonthComboboxKeydown(e){if(e.key===n.TAB&&!e.shiftKey&&this._currentView!=="calendar"){e.preventDefault();const a=this.renderRoot.querySelector('ngc-year-month-selector[tabindex="0"]');a==null||a.focus()}}get currentViewMarkup(){switch(this._currentView){case"calendar":return this.calendarMarkup;case"months":return this.getYearOrMonthSelectorGrid(d.MONTH);case"years":return this.getYearOrMonthSelectorGrid(d.YEAR);default:return null}}get calendarMarkup(){return i`
+        `}handlePreviousMonthClicked(){this._contextDate=new Date(this._contextYear,this._contextMonth-1,1),this._currentView="calendar"}handleMonthClick(){this._currentView==="months"?this._currentView="calendar":this._currentView="months"}handleYearClick(){this._currentView==="years"?this._currentView="calendar":(this._currentView="years",this.scrollToSelectedYear())}handleNextMonthClicked(){this._contextDate=new Date(this._contextYear,this._contextMonth+1,1),this._currentView="calendar"}handleYearMonthComboboxKeydown(e){e.key===n.TAB&&!e.shiftKey&&this._currentView!=="calendar"&&(e.preventDefault(),this.renderRoot.querySelector('ngc-year-month-selector[tabindex="0"]')?.focus())}get currentViewMarkup(){switch(this._currentView){case"calendar":return this.calendarMarkup;case"months":return this.getYearOrMonthSelectorGrid(d.MONTH);case"years":return this.getYearOrMonthSelectorGrid(d.YEAR);default:return null}}get calendarMarkup(){return i`
                 <table class="gator-datepicker-table" role="grid">
                     <thead role="rowgroup" class="gator-datepicker-table-header">
                         <tr role="row">
@@ -73,28 +73,28 @@ import"../../../../node_modules/.pnpm/@lit_reactive-element@2.1.0/node_modules/@
                     <div role="columnheader">
                         ${e}
                     </div>`)}
-            `}get getDatesMarkup(){const e=this._contextDays,t=[];for(let a=0;a<e.length;a+=7)t.push(e.slice(a,a+7));return i`
-                    ${t.map(a=>i`
+            `}get getDatesMarkup(){const e=this._contextDays,t=[];for(let r=0;r<e.length;r+=7)t.push(e.slice(r,r+7));return i`
+                    ${t.map(r=>i`
                         <tr role="row">
-                            ${a.map(({date:r})=>i`
+                            ${r.map(({date:a})=>i`
                                 <ngc-selector
                                     role="gridcell"
-                                    ?current=${this.isSameDate(r,this._todaysDate)}
-                                    ?selected=${this.setSelectorSelected(r)}
-                                    ?disabled=${this.isDateOutsideMinMax(r)}
-                                    type=${this.setSelectorType(r)}
-                                    tabindex='${this.isSameDate(r,this._contextDate)?0:-1}'
+                                    ?current=${this.isSameDate(a,this._todaysDate)}
+                                    ?selected=${this.setSelectorSelected(a)}
+                                    ?disabled=${this.isDateOutsideMinMax(a)}
+                                    type=${this.setSelectorType(a)}
+                                    tabindex='${this.isSameDate(a,this._contextDate)?0:-1}'
                                     @keydown=${this.handleDateKeydown}
-                                    @select=${o=>this.handleDateClick(o,r)}
-                                    data-value=${r.getDate()}
+                                    @select=${o=>this.handleDateClick(o,a)}
+                                    data-value=${a.getDate()}
                                 >
-                                    ${r.getDate()}
+                                    ${a.getDate()}
                                 </ngc-selector>
                             `)}
                         </tr>
                     `)}
                 </div>
-            `}handleDateKeydown(e){switch(e.key){case n.UP:e.preventDefault(),this.setNewContextDateAndShiftFocus(-7);break;case n.DOWN:e.preventDefault(),this.setNewContextDateAndShiftFocus(7);break;case n.LEFT:e.preventDefault(),this.setNewContextDateAndShiftFocus(-1);break;case n.RIGHT:e.preventDefault(),this.setNewContextDateAndShiftFocus(1);break}}handleDateClick(e,t){this._contextDate=t,this.range?this.handleRangeSelection(t):(e.target.selected?this.clearSelection():this.setSelectedDate(t),this.dispatchDateChangeEvent())}handleRangeSelection(e){this._startDate?this._startDate&&!this._endDate?e<this._startDate?this.setRangeStart(e):this.setRangeEnd(e):this._startDate&&this._endDate&&(e<this._startDate?this.setRangeStart(e):e>this._endDate?this.setRangeEnd(e):(this.clearSelection(),this.setRangeStart(e))):this.setRangeStart(e),this.dispatchDateRangeChangeEvent()}setSelectorType(e){if(this.range){if(this._startDate&&this._endDate&&this.isSameDate(this._startDate,this._endDate))return"base";if(this.isSameDate(e,this._startDate))return"range-start";if(this.isSameDate(e,this._endDate))return"range-end";if(this.isDateInRange(e))return"range-in-between"}return e.getMonth()===this._contextDate.getMonth()?"base":"inactive"}setSelectorSelected(e){return this.range?this.isDateInRange(e):this.isSameDate(e,this._selectedDate)}setNewContextDateAndShiftFocus(e){var t;this._contextDate=new Date(this._contextDate.getFullYear(),this._contextDate.getMonth(),this._contextDate.getDate()+e),(t=this.getSelectorByDate(this._contextDate))==null||t.focus()}getSelectorByDate(e){return this.renderRoot.querySelector(`ngc-selector[data-value="${e.getDate()}"]:not([type="inactive"])`)}handleCalendarViewKeydown(e){var t,a;if(e.key===n.TAB){const r=this.renderRoot.querySelector("#prev-month"),o=this.renderRoot.querySelector("#done-button");e.shiftKey?((t=this.shadowRoot)==null?void 0:t.activeElement)===r&&(o.focus(),e.preventDefault()):((a=this.shadowRoot)==null?void 0:a.activeElement)===o&&(r.focus(),e.preventDefault())}}getYearOrMonthSelectorGrid(e){const a=e===d.YEAR?this._years:this._localizedMonths,r=[];for(let o=0;o<a.length;o+=3)r.push(a.slice(o,o+3));return i`
+            `}handleDateKeydown(e){switch(e.key){case n.UP:e.preventDefault(),this.setNewContextDateAndShiftFocus(-7);break;case n.DOWN:e.preventDefault(),this.setNewContextDateAndShiftFocus(7);break;case n.LEFT:e.preventDefault(),this.setNewContextDateAndShiftFocus(-1);break;case n.RIGHT:e.preventDefault(),this.setNewContextDateAndShiftFocus(1);break}}handleDateClick(e,t){this._contextDate=t,this.range?this.handleRangeSelection(t):(e.target.selected?this.clearSelection():this.setSelectedDate(t),this.dispatchDateChangeEvent())}handleRangeSelection(e){this._startDate?this._startDate&&!this._endDate?e<this._startDate?this.setRangeStart(e):this.setRangeEnd(e):this._startDate&&this._endDate&&(e<this._startDate?this.setRangeStart(e):e>this._endDate?this.setRangeEnd(e):(this.clearSelection(),this.setRangeStart(e))):this.setRangeStart(e),this.dispatchDateRangeChangeEvent()}setSelectorType(e){if(this.range){if(this._startDate&&this._endDate&&this.isSameDate(this._startDate,this._endDate))return"base";if(this.isSameDate(e,this._startDate))return"range-start";if(this.isSameDate(e,this._endDate))return"range-end";if(this.isDateInRange(e))return"range-in-between"}return e.getMonth()===this._contextDate.getMonth()?"base":"inactive"}setSelectorSelected(e){return this.range?this.isDateInRange(e):this.isSameDate(e,this._selectedDate)}setNewContextDateAndShiftFocus(e){this._contextDate=new Date(this._contextDate.getFullYear(),this._contextDate.getMonth(),this._contextDate.getDate()+e),this.getSelectorByDate(this._contextDate)?.focus()}getSelectorByDate(e){return this.renderRoot.querySelector(`ngc-selector[data-value="${e.getDate()}"]:not([type="inactive"])`)}handleCalendarViewKeydown(e){if(e.key===n.TAB){const t=this.renderRoot.querySelector("#prev-month"),r=this.renderRoot.querySelector("#done-button");e.shiftKey?this.shadowRoot?.activeElement===t&&(r.focus(),e.preventDefault()):this.shadowRoot?.activeElement===r&&(t.focus(),e.preventDefault())}}getYearOrMonthSelectorGrid(e){const r=e===d.YEAR?this._years:this._localizedMonths,a=[];for(let o=0;o<r.length;o+=3)a.push(r.slice(o,o+3));return i`
                 <div role="dialog"
                     class="gator-datepicker-year-month-selectors"
                     id="${e}-selectors"
@@ -102,7 +102,7 @@ import"../../../../node_modules/.pnpm/@lit_reactive-element@2.1.0/node_modules/@
                     @keydown=${this.handleSelectionDialogKeydown}>
                     <table class="gator-datepicker-table" role="grid">
                         <tbody class="gator-datepicker-table-body gator-datepicker-table-body-year-month" @scroll=${this.onYearSelectorScroll}>
-                            ${r.map(o=>i`
+                            ${a.map(o=>i`
                                 <tr>
                                     ${o.map(({dataValue:s,selectorText:l})=>i`
                                         <ngc-year-month-selector
@@ -122,10 +122,10 @@ import"../../../../node_modules/.pnpm/@lit_reactive-element@2.1.0/node_modules/@
                     </table>
                     ${this.footerMarkup}
                 </div>
-            `}handleSelectionDialogKeydown(e){var t,a;switch(e.key){case n.TAB:const r=this.renderRoot.querySelector('ngc-year-month-selector[tabindex="0"]'),o=this.renderRoot.querySelector("#done-button");e.shiftKey?((t=this.shadowRoot)==null?void 0:t.activeElement)===r&&(o.focus(),e.preventDefault()):((a=this.shadowRoot)==null?void 0:a.activeElement)===o&&(r.focus(),e.preventDefault());break;case n.ESCAPE:e.preventDefault(),e.stopPropagation();const s=this._currentView==="years"?this.renderRoot.querySelector("#year-combobox"):this.renderRoot.querySelector("#month-combobox");this._currentView="calendar",s.focus();break}}isYearMonthSelectorCurrent(e,t){return e==="year"?this._todaysDate.getFullYear()===t:this._todaysDate.getMonth()===t}isYearMonthSelectorSelected(e,t){return e==="year"?this._contextYear===t:this._contextMonth===t}yearMonthSelectorTabindex(e,t){if(e==="year"){const a=this._years.some(s=>s.dataValue===this._contextYear),r=this._years[0].dataValue===t,o=this._contextYear===t;return a?o?0:-1:r?0:-1}return this._contextMonth===t?0:-1}handleYearMonthSelectorClick(e,t){var a;t==="month"?this._contextDate=new Date(this._contextYear,e,1):this._contextDate=new Date(e,this._contextMonth,1),this._currentView="calendar",(a=this.renderRoot.querySelector(`#${t}-combobox`))==null||a.focus()}handleYearMonthSelectorKeyDown(e,t){switch(e.key){case n.UP:e.preventDefault(),this.shiftFocusToYearMonthSelector(t-3);break;case n.DOWN:e.preventDefault(),this.shiftFocusToYearMonthSelector(t+3);break;case n.LEFT:e.preventDefault(),this.shiftFocusToYearMonthSelector(t-1);break;case n.RIGHT:e.preventDefault(),this.shiftFocusToYearMonthSelector(t+1);break}}async shiftFocusToYearMonthSelector(e){const t=this.renderRoot.querySelector(`ngc-year-month-selector[data-value="${e}"]`);if(t)t.focus();else{const a=this._years.length?this._years[0].dataValue:new Date().getFullYear();e<a&&(this.loadMoreYearsBefore(),await this.updateComplete,this.shiftFocusToYearMonthSelector(e))}}async onYearSelectorScroll(e){var r,o;const t=e.target,a=t.scrollTop>this.previousScrollTop;if(this.previousScrollTop=t.scrollTop,a&&t.scrollHeight-t.scrollTop===t.clientHeight)this.loadMoreYearsAfter();else if(!a&&t.scrollTop===0&&((o=(r=this.shadowRoot)==null?void 0:r.activeElement)==null?void 0:o.tagName)!=="NGC-YEAR-MONTH-SELECTOR"){const s=t.scrollHeight;this.loadMoreYearsBefore(),await this.updateComplete;const l=t.scrollHeight;t.scrollTop=l-s}}loadMoreYearsAfter(){const e=this._years.length?this._years[this._years.length-1].dataValue:new Date().getFullYear(),t=this.loadMoreYearsBatch(e+1);this._years=[...this._years,...t],this.requestUpdate()}loadMoreYearsBefore(){const e=this._years.length?this._years[0].dataValue:new Date().getFullYear(),t=this.loadMoreYearsBatch(e-this._yearsBatchSize,e-1);this._years=[...t,...this._years],this.requestUpdate()}async scrollToSelectedYear(){await this.updateComplete;const e=this.renderRoot.querySelector("ngc-year-month-selector[selected]");e==null||e.scrollIntoView({behavior:"auto",block:"center"})}get footerMarkup(){return i`
+            `}handleSelectionDialogKeydown(e){switch(e.key){case n.TAB:const t=this.renderRoot.querySelector('ngc-year-month-selector[tabindex="0"]'),r=this.renderRoot.querySelector("#done-button");e.shiftKey?this.shadowRoot?.activeElement===t&&(r.focus(),e.preventDefault()):this.shadowRoot?.activeElement===r&&(t.focus(),e.preventDefault());break;case n.ESCAPE:e.preventDefault(),e.stopPropagation();const a=this._currentView==="years"?this.renderRoot.querySelector("#year-combobox"):this.renderRoot.querySelector("#month-combobox");this._currentView="calendar",a.focus();break}}isYearMonthSelectorCurrent(e,t){return e==="year"?this._todaysDate.getFullYear()===t:this._todaysDate.getMonth()===t}isYearMonthSelectorSelected(e,t){return e==="year"?this._contextYear===t:this._contextMonth===t}yearMonthSelectorTabindex(e,t){if(e==="year"){const r=this._years.some(s=>s.dataValue===this._contextYear),a=this._years[0].dataValue===t,o=this._contextYear===t;return r?o?0:-1:a?0:-1}return this._contextMonth===t?0:-1}handleYearMonthSelectorClick(e,t){t==="month"?this._contextDate=new Date(this._contextYear,e,1):this._contextDate=new Date(e,this._contextMonth,1),this._currentView="calendar",this.renderRoot.querySelector(`#${t}-combobox`)?.focus()}handleYearMonthSelectorKeyDown(e,t){switch(e.key){case n.UP:e.preventDefault(),this.shiftFocusToYearMonthSelector(t-3);break;case n.DOWN:e.preventDefault(),this.shiftFocusToYearMonthSelector(t+3);break;case n.LEFT:e.preventDefault(),this.shiftFocusToYearMonthSelector(t-1);break;case n.RIGHT:e.preventDefault(),this.shiftFocusToYearMonthSelector(t+1);break}}async shiftFocusToYearMonthSelector(e){const t=this.renderRoot.querySelector(`ngc-year-month-selector[data-value="${e}"]`);if(t)t.focus();else{const r=this._years.length?this._years[0].dataValue:new Date().getFullYear();e<r&&(this.loadMoreYearsBefore(),await this.updateComplete,this.shiftFocusToYearMonthSelector(e))}}async onYearSelectorScroll(e){const t=e.target,r=t.scrollTop>this.previousScrollTop;if(this.previousScrollTop=t.scrollTop,r&&t.scrollHeight-t.scrollTop===t.clientHeight)this.loadMoreYearsAfter();else if(!r&&t.scrollTop===0&&this.shadowRoot?.activeElement?.tagName!=="NGC-YEAR-MONTH-SELECTOR"){const a=t.scrollHeight;this.loadMoreYearsBefore(),await this.updateComplete;const o=t.scrollHeight;t.scrollTop=o-a}}loadMoreYearsAfter(){const e=this._years.length?this._years[this._years.length-1].dataValue:new Date().getFullYear(),t=this.loadMoreYearsBatch(e+1);this._years=[...this._years,...t],this.requestUpdate()}loadMoreYearsBefore(){const e=this._years.length?this._years[0].dataValue:new Date().getFullYear(),t=this.loadMoreYearsBatch(e-this._yearsBatchSize,e-1);this._years=[...t,...this._years],this.requestUpdate()}async scrollToSelectedYear(){await this.updateComplete,this.renderRoot.querySelector("ngc-year-month-selector[selected]")?.scrollIntoView({behavior:"auto",block:"center"})}get footerMarkup(){return i`
             <div class="gator-datepicker-footer">
                 <ngc-button id="clear-button" variant='base' @click=${this.handleClearClick}>${c("Clear")}</ngc-button>
                 <ngc-button id="today-button" variant='base' @click=${this.handleTodayClick} ?disabled=${this.isTodayDisabled()}>${c("Today")}</ngc-button>
                 <ngc-button id="done-button" variant='base' @click=${this.handleDoneClick}>${c("Done")}</ngc-button>
             </div>
-        `}handleClearClick(){this.clearSelection(),this._contextDate=this._todaysDate,this._currentView="calendar",this.dispatchChangeEvent(),this.dispatchEvent(new CustomEvent("done"))}handleTodayClick(){this._contextDate=this._todaysDate,this.range?(this.setRangeStart(this._todaysDate),this.setRangeEnd(this._todaysDate)):this.setSelectedDate(this._todaysDate),this._currentView="calendar",this.dispatchChangeEvent()}handleDoneClick(){this.dispatchEvent(new CustomEvent("done"))}handleClose(){this.range&&this._startDate&&(this._contextDate=this._startDate),!this.range&&this._selectedDate&&(this._contextDate=this._selectedDate)}};h.shadowRootOptions={...b.shadowRootOptions,delegatesFocus:!0};h.styles=[u(y),u(f),u(m),u(D)];p([S()],h.prototype,"_currentView",2);h=p([_("ngc-datepicker"),k()],h);export{Y as DATE_PICKER_VIEW,h as NgcDatepicker};
+        `}handleClearClick(){this.clearSelection(),this._contextDate=this._todaysDate,this._currentView="calendar",this.dispatchChangeEvent(),this.dispatchEvent(new CustomEvent("done"))}handleTodayClick(){this._contextDate=this._todaysDate,this.range?(this.setRangeStart(this._todaysDate),this.setRangeEnd(this._todaysDate)):this.setSelectedDate(this._todaysDate),this._currentView="calendar",this.dispatchChangeEvent()}handleDoneClick(){this.dispatchEvent(new CustomEvent("done"))}handleClose(){this.range&&this._startDate&&(this._contextDate=this._startDate),!this.range&&this._selectedDate&&(this._contextDate=this._selectedDate)}};h.shadowRootOptions={...f.shadowRootOptions,delegatesFocus:!0};h.styles=[u(b),u(y),u(m),u(D)];p([S()],h.prototype,"_currentView",2);h=p([_("ngc-datepicker"),k()],h);export{Y as DATE_PICKER_VIEW,h as NgcDatepicker};

package/dist/components/date-picker/year-month-selector/year-month-selector.gator.js

@@ -1,4 +1,4 @@
-import"../../../node_modules/.pnpm/@lit_reactive-element@2.1.0/node_modules/@lit/reactive-element/reactive-element.js";import{html as h}from"../../../node_modules/.pnpm/lit-html@3.3.0/node_modules/lit-html/lit-html.js";import{LitElement as m}from"../../../node_modules/.pnpm/lit-element@4.2.0/node_modules/lit-element/lit-element.js";import u from"../../../packages/web-components/src/components/date-picker/year-month-selector/year-month-selector.gator.scss.js";import b from"../../../packages/web-components/src/tokens/primitive.tokens.scss.js";import f from"../../../packages/web-components/src/tokens/semantic.tokens.scss.js";import{customElement as y}from"../../../node_modules/.pnpm/@lit_reactive-element@2.1.0/node_modules/@lit/reactive-element/decorators/custom-element.js";import{property as i}from"../../../node_modules/.pnpm/@lit_reactive-element@2.1.0/node_modules/@lit/reactive-element/decorators/property.js";import{TestableLitElement as v}from"../../../utils/components/testable-lit-element/testable-lit-element.js";import{KEY_CONSTANTS as p}from"../../../consts/key-constants.js";import{unsafeCSS as c}from"../../../node_modules/.pnpm/@lit_reactive-element@2.1.0/node_modules/@lit/reactive-element/css-tag.js";var C=Object.defineProperty,g=Object.getOwnPropertyDescriptor,o=(e,r,l,a)=>{for(var s=a>1?void 0:a?g(r,l):r,n=e.length-1,d;n>=0;n--)(d=e[n])&&(s=(a?d(r,l,s):d(s))||s);return a&&s&&C(r,l,s),s},x=(e=>(e.MONTH="month",e.YEAR="year",e))(x||{});let t=class extends v{constructor(){super(),this.selected=!1,this.disabled=!1,this.current=!1,this.tabindex=0,this.addEventListener("click",this.handleClick)}render(){return h`
+import"../../../node_modules/.pnpm/@lit_reactive-element@2.1.0/node_modules/@lit/reactive-element/reactive-element.js";import{html as h}from"../../../node_modules/.pnpm/lit-html@3.3.0/node_modules/lit-html/lit-html.js";import{LitElement as m}from"../../../node_modules/.pnpm/lit-element@4.2.0/node_modules/lit-element/lit-element.js";import u from"../../../packages/web-components/src/components/date-picker/year-month-selector/year-month-selector.gator.scss.js";import b from"../../../packages/web-components/src/tokens/primitive.tokens.scss.js";import f from"../../../packages/web-components/src/tokens/semantic.tokens.scss.js";import{customElement as y}from"../../../node_modules/.pnpm/@lit_reactive-element@2.1.0/node_modules/@lit/reactive-element/decorators/custom-element.js";import{property as i}from"../../../node_modules/.pnpm/@lit_reactive-element@2.1.0/node_modules/@lit/reactive-element/decorators/property.js";import{TestableLitElement as v}from"../../../utils/components/testable-lit-element/testable-lit-element.js";import{KEY_CONSTANTS as p}from"../../../consts/key-constants.js";import{unsafeCSS as c}from"../../../node_modules/.pnpm/@lit_reactive-element@2.1.0/node_modules/@lit/reactive-element/css-tag.js";var C=Object.defineProperty,g=Object.getOwnPropertyDescriptor,s=(e,o,l,a)=>{for(var r=a>1?void 0:a?g(o,l):o,n=e.length-1,d;n>=0;n--)(d=e[n])&&(r=(a?d(o,l,r):d(r))||r);return a&&r&&C(o,l,r),r},x=(e=>(e.MONTH="month",e.YEAR="year",e))(x||{});let t=class extends v{constructor(){super(),this.selected=!1,this.disabled=!1,this.current=!1,this.tabindex=0,this.addEventListener("click",this.handleClick)}render(){return h`
             <div class="gator-year-month-selector ${this.selectedClass} ${this.disabledClass} ${this.currentClass}"
                 tabindex=${this.disabled?"-1":this.tabindex}
                 role="gridcell"
@@ -10,4 +10,4 @@ import"../../../node_modules/.pnpm/@lit_reactive-element@2.1.0/node_modules/@lit
                     <slot></slot>
                 </span>
             </div>
-        `}get selectedClass(){return this.selected?"gator-year-month-selector_selected":""}get disabledClass(){return this.disabled?"gator-year-month-selector_disabled":""}get currentClass(){return this.current?"gator-year-month-selector_current":""}handleKeydown(e){if(e.key===p.ENTER||e.key===p.SPACE){e.preventDefault(),this.handleClick(e);return}}handleClick(e){var r;e.preventDefault(),e.stopPropagation(),!this.disabled&&this.dispatchEvent(new CustomEvent("select",{bubbles:!0,detail:{value:(r=this.textContent)==null?void 0:r.trim(),selected:this.selected}}))}};t.shadowRootOptions={...m.shadowRootOptions,delegatesFocus:!0};t.styles=[c(u),c(b),c(f)];o([i({type:Boolean,attribute:"selected"})],t.prototype,"selected",2);o([i({type:Boolean,attribute:"disabled"})],t.prototype,"disabled",2);o([i({type:Boolean,attribute:"current"})],t.prototype,"current",2);o([i({type:Number,attribute:"tabindex"})],t.prototype,"tabindex",2);t=o([y("ngc-year-month-selector")],t);export{t as NgcYearMonthSelector,x as SELECTOR_TYPE};
+        `}get selectedClass(){return this.selected?"gator-year-month-selector_selected":""}get disabledClass(){return this.disabled?"gator-year-month-selector_disabled":""}get currentClass(){return this.current?"gator-year-month-selector_current":""}handleKeydown(e){if(e.key===p.ENTER||e.key===p.SPACE){e.preventDefault(),this.handleClick(e);return}}handleClick(e){e.preventDefault(),e.stopPropagation(),!this.disabled&&this.dispatchEvent(new CustomEvent("select",{bubbles:!0,detail:{value:this.textContent?.trim(),selected:this.selected}}))}};t.shadowRootOptions={...m.shadowRootOptions,delegatesFocus:!0};t.styles=[c(u),c(b),c(f)];s([i({type:Boolean,attribute:"selected"})],t.prototype,"selected",2);s([i({type:Boolean,attribute:"disabled"})],t.prototype,"disabled",2);s([i({type:Boolean,attribute:"current"})],t.prototype,"current",2);s([i({type:Number,attribute:"tabindex"})],t.prototype,"tabindex",2);t=s([y("ngc-year-month-selector")],t);export{t as NgcYearMonthSelector,x as SELECTOR_TYPE};