ids-enterprise-wc 1.0.0-beta.21 → 1.0.0-beta.23

package/components/ids-dropdown/ids-dropdown.css

@@ -4,7 +4,7 @@
   -moz-osx-font-smoothing: grayscale;
   display: flex;
   font-family: var(--ids-font-family-default);
-  margin-top: var(--ids-space-30);
+  margin-top: var(--ids-space-xxs);
 }
 .validation-message.has-custom-icon {
   color: var(--ids-icon-color-default);
@@ -13,224 +13,71 @@
   color: var(--ids-input-color-text-disabled);
 }
 .validation-message .ids-icon {
-  margin-inline-end: var(--ids-space-30);
+  margin-inline-end: var(--ids-space-xxs);
 }
 .validation-message.alert {
   color: var(--ids-color-caution-default);
 }
 .validation-message.alert.disabled {
-  color: var(--ids-color-caution-30);
+  color: var(--ids-color-yellow-30);
 }
 .validation-message.warning {
   color: var(--ids-color-warning-default);
 }
 .validation-message.warning.disabled {
-  color: var(--ids-color-warning-30);
+  color: var(--ids-color-orange-30);
 }
 .validation-message.error {
   color: var(--ids-color-error-default);
 }
 .validation-message.error.disabled {
-  color: var(--ids-color-error-30);
+  color: var(--ids-color-red-30);
 }
 .validation-message.info {
   color: var(--ids-color-info-default);
 }
 .validation-message.info.disabled {
-  color: var(--ids-color-info-30);
+  color: var(--ids-color-blue-30);
 }
 .validation-message.success {
   color: var(--ids-color-success-default);
 }
 .validation-message.success.disabled {
-  color: var(--ids-color-success-30);
+  color: var(--ids-color-green-30);
 }
 .validation-message[hidden] {
   display: none;
 }
 
-:root {
-  display: block;
-}
-:host .ids-dropdown {
-  display: inline-block;
-  max-width: 100%;
-}
-
-ids-trigger-field[readonly-background]:not([disabled])::part(input) {
-  cursor: var(--ids-cursor-pointer);
-}
-
-.ids-dropdown {
-  display: block;
-  position: relative;
-}
-.ids-dropdown ids-trigger-field[size=full] {
-  display: block;
-}
-.ids-dropdown.full {
-  display: block;
-}
-.ids-dropdown.full ids-trigger-field,
-.ids-dropdown.full .ids-trigger-field {
-  display: block;
-}
-
-.trigger-icon {
-  color: var(--ids-dropdown-color-icon);
-  margin: 0 0 0 var(--ids-dropdown-space-text);
-  position: relative;
-  top: 2px;
-}
-
-:host([mode=light]) .typeahead.is-open ids-trigger-field::part(field-container) {
-  background-color: var(--ids-dropdown-typeahead-color-background);
-}
-
-:host([dir=rtl]) .trigger-icon {
-  margin: 0 var(--ids-dropdown-space-text) 0 0;
-}
-
-::slotted(.sub-group) {
-  border-top: 1px solid var(--ids-dropdown-separator-color-border);
-  padding-top: var(--ids-dropdown-separator-padding);
-}
-
-.ids-dropdown.color-variant-borderless ids-trigger-field::part(field-container),
-.ids-dropdown.color-variant-in-cell ids-trigger-field::part(field-container) {
-  margin: 0;
-  border-radius: 0;
-}
-.ids-dropdown.color-variant-borderless ids-trigger-field::part(label),
-.ids-dropdown.color-variant-in-cell ids-trigger-field::part(label) {
-  display: none;
-}
-
-.ids-dropdown.color-variant-borderless ids-trigger-field::part(container) {
-  margin: -1px;
-}
-.ids-dropdown.color-variant-borderless ids-trigger-field::part(field-container) {
-  box-shadow: none !important;
-}
-.ids-dropdown.color-variant-borderless .ids-trigger-field-slot-trigger-end,
-.ids-dropdown.color-variant-borderless ::slotted(*[slot=trigger-end]:last-of-type:not([inline]):not([compact]):not([field-height=xs])) {
-  margin-inline-end: -3px;
-}
-.ids-dropdown.color-variant-borderless.field-height-lg ids-trigger-field::part(input) {
-  padding-inline: 16px;
-  height: 50px;
-}
-.ids-dropdown.color-variant-borderless.field-height-md ids-trigger-field::part(input) {
-  padding-inline: 12px;
-  height: 40px;
-}
-.ids-dropdown.color-variant-borderless.field-height-sm ids-trigger-field::part(input) {
-  padding-inline: 8px;
-  height: 35px;
-}
-.ids-dropdown.color-variant-borderless.field-height-xs ids-trigger-field::part(input) {
-  padding-inline: 4px;
-  height: 30px;
-}
-.ids-dropdown.color-variant-borderless.field-height-xxs ids-trigger-field::part(input) {
-  padding-inline: 2px;
-  height: 30px;
-}
-
-.ids-dropdown.color-variant-in-cell ids-trigger-field::part(container) {
-  margin: 1px 0;
-}
-
-.ids-dropdown.color-variant-module-nav {
-  color: var(--ids-module-nav-search-input-text-color);
-  display: block;
-  margin-block-end: 0;
-}
-.ids-dropdown.color-variant-module-nav ::slotted(ids-list-box) {
-  color: var(--ids-module-nav-search-input-text-color);
-}
-.ids-dropdown.color-variant-module-nav ::slotted(ids-list-box-option) {
-  color: inherit;
-}
-.ids-dropdown.color-variant-module-nav ids-trigger-field::part(field-container) {
-  background-color: var(--ids-module-nav-input-bg-color);
-  border-radius: var(--ids-module-nav-common-border-radius);
-  border: var(--ids-module-nav-input-border-width) solid var(--ids-module-nav-input-border-color);
-  box-shadow: none;
-  color: inherit;
-  overflow: hidden;
-}
-.ids-dropdown.color-variant-module-nav ids-trigger-field:hover::part(field-container) {
-  background-color: var(--ids-module-nav-input-hover-bg-color);
-}
-.ids-dropdown.color-variant-module-nav ids-trigger-field:active::part(field-container) {
-  background-color: var(--ids-module-nav-item-selected-bg-color);
-  border-color: var(--ids-module-nav-item-selected-text-color);
-  color: var(--ids-module-nav-item-selected-text-color);
-}
-.ids-dropdown.color-variant-module-nav ids-trigger-field:focus-within::part(field-container) {
-  background-color: var(--ids-module-nav-input-focus-bg-color);
-}
-.ids-dropdown.color-variant-module-nav ids-trigger-field::part(input) {
-  background-color: transparent;
-  color: inherit;
-}
-.ids-dropdown.color-variant-module-nav ids-trigger-field::part(trigger-button) {
-  background-color: transparent;
-}
-.ids-dropdown.color-variant-module-nav ids-trigger-field::part(input::placeholder) {
-  color: var(--ids-module-nav-search-input-placeholder-text-color);
-}
-.ids-dropdown.color-variant-module-nav ids-trigger-field::part(input:active) {
-  color: var(--ids-module-nav-search-input-text-color);
-}
-.ids-dropdown.color-variant-module-nav ids-dropdown-list::part(dropdown-list) {
-  max-width: var(--ids-module-nav-expanded-size);
-  width: calc(var(--ids-module-nav-switcher-dropdown-width) + var(--ids-module-nav-switcher-button-gutter-size) + var(--ids-module-nav-switcher-button-size));
-}
-.ids-dropdown.color-variant-module-nav ids-list-box-option {
-  min-height: var(--ids-module-nav-item-height);
-}
-.ids-dropdown.color-variant-module-nav .fieldset {
-  display: contents;
-}
-.ids-dropdown.color-variant-module-nav .ids-input-field {
-  padding-inline-start: var(--ids-module-nav-item-expanded-icon-text-spacing-size);
-}
-
-:host ids-dropdown-list {
+:host ids-popup {
   max-width: var(--ids-input-width-40);
 }
 
-:host([size=xs]) ids-dropdown-list {
+:host([size=xs]) ids-popup {
   max-width: var(--ids-input-width-10);
 }
 
-:host([size=sm]) ids-dropdown-list {
+:host([size=sm]) ids-popup {
   max-width: var(--ids-input-width-20);
 }
 
-:host([size=mm]) ids-dropdown-list {
+:host([size=mm]) ids-popup {
   max-width: var(--ids-input-width-30);
 }
 
-:host([size=md]) ids-dropdown-list {
-  max-width: var(--ids-input-width-40);
+:host([size=md]) ids-popup {
+  max-width: calc(var(--ids-input-width-40) - 2px);
 }
 
-:host([size=lg]) ids-dropdown-list {
+:host([size=lg]) ids-popup {
   max-width: var(--ids-input-width-50);
 }
 
-:host([size=full]) ids-dropdown-list {
+:host([size=full]) ids-popup {
   max-width: var(--ids-input-width-full);
 }
 
-:host ids-dropdown-list,
+:host ids-popup,
 :host([size=full]) {
-  width: var(--ids-input-width-full);
-}
-
-:host([list]:not([disabled])) {
-  cursor: var(--ids-cursor-pointer);
+  width: 100%;
 }

package/components/ids-dropdown/ids-dropdown.d.ts

@@ -73,7 +73,7 @@ declare const Base: {
         click(): void;
         hidePopover(): void;
         showPopover(): void;
-        togglePopover(force?: boolean | undefined): void;
+        togglePopover(force?: boolean | undefined): boolean;
         addEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions | undefined): void;
         addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions | undefined): void;
         removeEventListener<K_1 extends keyof HTMLElementEventMap>(type: K_1, listener: (this: HTMLElement, ev: HTMLElementEventMap[K_1]) => any, options?: boolean | EventListenerOptions | undefined): void;
@@ -208,6 +208,7 @@ declare const Base: {
         ariaColIndex: string | null;
         ariaColSpan: string | null;
         ariaCurrent: string | null;
+        ariaDescription: string | null;
         ariaDisabled: string | null;
         ariaExpanded: string | null;
         ariaHasPopup: string | null;
@@ -278,6 +279,7 @@ declare const Base: {
         onanimationstart: ((this: GlobalEventHandlers, ev: AnimationEvent) => any) | null;
         onauxclick: ((this: GlobalEventHandlers, ev: MouseEvent) => any) | null;
         onbeforeinput: ((this: GlobalEventHandlers, ev: InputEvent) => any) | null;
+        onbeforetoggle: ((this: GlobalEventHandlers, ev: Event) => any) | null;
         onblur: ((this: GlobalEventHandlers, ev: FocusEvent) => any) | null;
         oncancel: ((this: GlobalEventHandlers, ev: Event) => any) | null;
         oncanplay: ((this: GlobalEventHandlers, ev: Event) => any) | null;
@@ -376,6 +378,7 @@ declare const Base: {
 } & {
     new (...args: any[]): {
         connectedCallback(): void;
+        "__#47@#dirtyTrackerInitialized": boolean;
         dirty: any;
         isDirty: boolean;
         isCheckbox: boolean;
@@ -393,8 +396,9 @@ declare const Base: {
         onLanguageChange: () => void;
         resetDirtyTracker(): void;
         destroyDirtyTracker(): void;
-        "__#41@#onDirtyTrackerChange"(): void;
+        "__#47@#onDirtyTrackerChange"(): void;
         dirtyTracker: boolean;
+        "__#47@#triggerDirtyEvent"(name: "dirty" | "pristine" | "afterresetdirty"): void;
         onEvent(eventName: string, target?: any, callback?: ((evt: any) => void) | undefined, options?: import("../../mixins/ids-events-mixin/ids-events-mixin").EventOptions | undefined): void;
         offEvent(eventName: string, target?: any, options?: import("../../mixins/ids-events-mixin/ids-events-mixin").EventOptions | undefined): void;
         triggerEvent(eventName: string, target: any, options?: CustomEventInit<any> | undefined): void;
@@ -448,7 +452,7 @@ declare const Base: {
         click(): void;
         hidePopover(): void;
         showPopover(): void;
-        togglePopover(force?: boolean | undefined): void;
+        togglePopover(force?: boolean | undefined): boolean;
         addEventListener<K_17 extends keyof HTMLElementEventMap>(type: K_17, listener: (this: HTMLElement, ev: HTMLElementEventMap[K_17]) => any, options?: boolean | AddEventListenerOptions | undefined): void;
         addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions | undefined): void;
         removeEventListener<K_18 extends keyof HTMLElementEventMap>(type: K_18, listener: (this: HTMLElement, ev: HTMLElementEventMap[K_18]) => any, options?: boolean | EventListenerOptions | undefined): void;
@@ -583,6 +587,7 @@ declare const Base: {
         ariaColIndex: string | null;
         ariaColSpan: string | null;
         ariaCurrent: string | null;
+        ariaDescription: string | null;
         ariaDisabled: string | null;
         ariaExpanded: string | null;
         ariaHasPopup: string | null;
@@ -653,6 +658,7 @@ declare const Base: {
         onanimationstart: ((this: GlobalEventHandlers, ev: AnimationEvent) => any) | null;
         onauxclick: ((this: GlobalEventHandlers, ev: MouseEvent) => any) | null;
         onbeforeinput: ((this: GlobalEventHandlers, ev: InputEvent) => any) | null;
+        onbeforetoggle: ((this: GlobalEventHandlers, ev: Event) => any) | null;
         onblur: ((this: GlobalEventHandlers, ev: FocusEvent) => any) | null;
         oncancel: ((this: GlobalEventHandlers, ev: Event) => any) | null;
         oncanplay: ((this: GlobalEventHandlers, ev: Event) => any) | null;
@@ -800,7 +806,7 @@ declare const Base: {
         click(): void;
         hidePopover(): void;
         showPopover(): void;
-        togglePopover(force?: boolean | undefined): void;
+        togglePopover(force?: boolean | undefined): boolean;
         addEventListener<K_26 extends keyof HTMLElementEventMap>(type: K_26, listener: (this: HTMLElement, ev: HTMLElementEventMap[K_26]) => any, options?: boolean | AddEventListenerOptions | undefined): void;
         addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions | undefined): void;
         removeEventListener<K_27 extends keyof HTMLElementEventMap>(type: K_27, listener: (this: HTMLElement, ev: HTMLElementEventMap[K_27]) => any, options?: boolean | EventListenerOptions | undefined): void;
@@ -935,6 +941,7 @@ declare const Base: {
         ariaColIndex: string | null;
         ariaColSpan: string | null;
         ariaCurrent: string | null;
+        ariaDescription: string | null;
         ariaDisabled: string | null;
         ariaExpanded: string | null;
         ariaHasPopup: string | null;
@@ -1005,6 +1012,7 @@ declare const Base: {
         onanimationstart: ((this: GlobalEventHandlers, ev: AnimationEvent) => any) | null;
         onauxclick: ((this: GlobalEventHandlers, ev: MouseEvent) => any) | null;
         onbeforeinput: ((this: GlobalEventHandlers, ev: InputEvent) => any) | null;
+        onbeforetoggle: ((this: GlobalEventHandlers, ev: Event) => any) | null;
         onblur: ((this: GlobalEventHandlers, ev: FocusEvent) => any) | null;
         oncancel: ((this: GlobalEventHandlers, ev: Event) => any) | null;
         oncanplay: ((this: GlobalEventHandlers, ev: Event) => any) | null;
@@ -1104,9 +1112,9 @@ declare const Base: {
         connectedCallback(): void;
         showLoadingIndicator: string | boolean | null;
         loadingIndicatorOnly: string | boolean | null;
-        "__#25@#getSlottedElements"(): Node[] | undefined;
-        "__#25@#attachLoadingIndicator"(): void;
-        "__#25@#addClass"(): void;
+        "__#15@#getSlottedElements"(): Node[] | undefined;
+        "__#15@#attachLoadingIndicator"(): void;
+        "__#15@#addClass"(): void;
         name?: string | undefined;
         state: any;
         cachedNonce: string;
@@ -1152,7 +1160,7 @@ declare const Base: {
         click(): void;
         hidePopover(): void;
         showPopover(): void;
-        togglePopover(force?: boolean | undefined): void;
+        togglePopover(force?: boolean | undefined): boolean;
         addEventListener<K_35 extends keyof HTMLElementEventMap>(type: K_35, listener: (this: HTMLElement, ev: HTMLElementEventMap[K_35]) => any, options?: boolean | AddEventListenerOptions | undefined): void;
         addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions | undefined): void;
         removeEventListener<K_36 extends keyof HTMLElementEventMap>(type: K_36, listener: (this: HTMLElement, ev: HTMLElementEventMap[K_36]) => any, options?: boolean | EventListenerOptions | undefined): void;
@@ -1287,6 +1295,7 @@ declare const Base: {
         ariaColIndex: string | null;
         ariaColSpan: string | null;
         ariaCurrent: string | null;
+        ariaDescription: string | null;
         ariaDisabled: string | null;
         ariaExpanded: string | null;
         ariaHasPopup: string | null;
@@ -1357,6 +1366,7 @@ declare const Base: {
         onanimationstart: ((this: GlobalEventHandlers, ev: AnimationEvent) => any) | null;
         onauxclick: ((this: GlobalEventHandlers, ev: MouseEvent) => any) | null;
         onbeforeinput: ((this: GlobalEventHandlers, ev: InputEvent) => any) | null;
+        onbeforetoggle: ((this: GlobalEventHandlers, ev: Event) => any) | null;
         onblur: ((this: GlobalEventHandlers, ev: FocusEvent) => any) | null;
         oncancel: ((this: GlobalEventHandlers, ev: Event) => any) | null;
         oncanplay: ((this: GlobalEventHandlers, ev: Event) => any) | null;
@@ -1507,7 +1517,7 @@ declare const Base: {
         click(): void;
         hidePopover(): void;
         showPopover(): void;
-        togglePopover(force?: boolean | undefined): void;
+        togglePopover(force?: boolean | undefined): boolean;
         addEventListener<K_44 extends keyof HTMLElementEventMap>(type: K_44, listener: (this: HTMLElement, ev: HTMLElementEventMap[K_44]) => any, options?: boolean | AddEventListenerOptions | undefined): void;
         addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions | undefined): void;
         removeEventListener<K_45 extends keyof HTMLElementEventMap>(type: K_45, listener: (this: HTMLElement, ev: HTMLElementEventMap[K_45]) => any, options?: boolean | EventListenerOptions | undefined): void;
@@ -1642,6 +1652,7 @@ declare const Base: {
         ariaColIndex: string | null;
         ariaColSpan: string | null;
         ariaCurrent: string | null;
+        ariaDescription: string | null;
         ariaDisabled: string | null;
         ariaExpanded: string | null;
         ariaHasPopup: string | null;
@@ -1712,6 +1723,7 @@ declare const Base: {
         onanimationstart: ((this: GlobalEventHandlers, ev: AnimationEvent) => any) | null;
         onauxclick: ((this: GlobalEventHandlers, ev: MouseEvent) => any) | null;
         onbeforeinput: ((this: GlobalEventHandlers, ev: InputEvent) => any) | null;
+        onbeforetoggle: ((this: GlobalEventHandlers, ev: Event) => any) | null;
         onblur: ((this: GlobalEventHandlers, ev: FocusEvent) => any) | null;
         oncancel: ((this: GlobalEventHandlers, ev: Event) => any) | null;
         oncanplay: ((this: GlobalEventHandlers, ev: Event) => any) | null;
@@ -1814,7 +1826,7 @@ declare const Base: {
         compact: string | boolean;
         fieldHeight: string;
         clearHeightClasses(): void;
-        "__#43@#doFieldHeightChange"(fieldHeight: string): void;
+        "__#49@#doFieldHeightChange"(fieldHeight: string): void;
         onFieldHeightChange?(fieldHeight: string): void;
         name?: string | undefined;
         state: any;
@@ -1861,7 +1873,7 @@ declare const Base: {
         click(): void;
         hidePopover(): void;
         showPopover(): void;
-        togglePopover(force?: boolean | undefined): void;
+        togglePopover(force?: boolean | undefined): boolean;
         addEventListener<K_53 extends keyof HTMLElementEventMap>(type: K_53, listener: (this: HTMLElement, ev: HTMLElementEventMap[K_53]) => any, options?: boolean | AddEventListenerOptions | undefined): void;
         addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions | undefined): void;
         removeEventListener<K_54 extends keyof HTMLElementEventMap>(type: K_54, listener: (this: HTMLElement, ev: HTMLElementEventMap[K_54]) => any, options?: boolean | EventListenerOptions | undefined): void;
@@ -1996,6 +2008,7 @@ declare const Base: {
         ariaColIndex: string | null;
         ariaColSpan: string | null;
         ariaCurrent: string | null;
+        ariaDescription: string | null;
         ariaDisabled: string | null;
         ariaExpanded: string | null;
         ariaHasPopup: string | null;
@@ -2066,6 +2079,7 @@ declare const Base: {
         onanimationstart: ((this: GlobalEventHandlers, ev: AnimationEvent) => any) | null;
         onauxclick: ((this: GlobalEventHandlers, ev: MouseEvent) => any) | null;
         onbeforeinput: ((this: GlobalEventHandlers, ev: InputEvent) => any) | null;
+        onbeforetoggle: ((this: GlobalEventHandlers, ev: Event) => any) | null;
         onblur: ((this: GlobalEventHandlers, ev: FocusEvent) => any) | null;
         oncancel: ((this: GlobalEventHandlers, ev: Event) => any) | null;
         oncanplay: ((this: GlobalEventHandlers, ev: Event) => any) | null;
@@ -2166,7 +2180,7 @@ declare const Base: {
         connectedCallback(): void;
         colorVariants: string[];
         colorVariant: string | null;
-        "__#4@#refreshColorVariant"(oldVariantName?: string | null | undefined, newVariantName?: string | null | undefined): void;
+        "__#10@#refreshColorVariant"(oldVariantName?: string | null | undefined, newVariantName?: string | null | undefined): void;
         onColorVariantRefresh?(variantName: string | null | undefined): void;
         name?: string | undefined;
         state: any;
@@ -2213,7 +2227,7 @@ declare const Base: {
         click(): void;
         hidePopover(): void;
         showPopover(): void;
-        togglePopover(force?: boolean | undefined): void;
+        togglePopover(force?: boolean | undefined): boolean;
         addEventListener<K_62 extends keyof HTMLElementEventMap>(type: K_62, listener: (this: HTMLElement, ev: HTMLElementEventMap[K_62]) => any, options?: boolean | AddEventListenerOptions | undefined): void;
         addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions | undefined): void;
         removeEventListener<K_63 extends keyof HTMLElementEventMap>(type: K_63, listener: (this: HTMLElement, ev: HTMLElementEventMap[K_63]) => any, options?: boolean | EventListenerOptions | undefined): void;
@@ -2348,6 +2362,7 @@ declare const Base: {
         ariaColIndex: string | null;
         ariaColSpan: string | null;
         ariaCurrent: string | null;
+        ariaDescription: string | null;
         ariaDisabled: string | null;
         ariaExpanded: string | null;
         ariaHasPopup: string | null;
@@ -2418,6 +2433,7 @@ declare const Base: {
         onanimationstart: ((this: GlobalEventHandlers, ev: AnimationEvent) => any) | null;
         onauxclick: ((this: GlobalEventHandlers, ev: MouseEvent) => any) | null;
         onbeforeinput: ((this: GlobalEventHandlers, ev: InputEvent) => any) | null;
+        onbeforetoggle: ((this: GlobalEventHandlers, ev: Event) => any) | null;
         onblur: ((this: GlobalEventHandlers, ev: FocusEvent) => any) | null;
         oncancel: ((this: GlobalEventHandlers, ev: Event) => any) | null;
         oncanplay: ((this: GlobalEventHandlers, ev: Event) => any) | null;
@@ -2576,7 +2592,7 @@ declare const Base: {
         click(): void;
         hidePopover(): void;
         showPopover(): void;
-        togglePopover(force?: boolean | undefined): void;
+        togglePopover(force?: boolean | undefined): boolean;
         addEventListener<K_71 extends keyof HTMLElementEventMap>(type: K_71, listener: (this: HTMLElement, ev: HTMLElementEventMap[K_71]) => any, options?: boolean | AddEventListenerOptions | undefined): void;
         addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions | undefined): void;
         removeEventListener<K_72 extends keyof HTMLElementEventMap>(type: K_72, listener: (this: HTMLElement, ev: HTMLElementEventMap[K_72]) => any, options?: boolean | EventListenerOptions | undefined): void;
@@ -2711,6 +2727,7 @@ declare const Base: {
         ariaColIndex: string | null;
         ariaColSpan: string | null;
         ariaCurrent: string | null;
+        ariaDescription: string | null;
         ariaDisabled: string | null;
         ariaExpanded: string | null;
         ariaHasPopup: string | null;
@@ -2781,6 +2798,7 @@ declare const Base: {
         onanimationstart: ((this: GlobalEventHandlers, ev: AnimationEvent) => any) | null;
         onauxclick: ((this: GlobalEventHandlers, ev: MouseEvent) => any) | null;
         onbeforeinput: ((this: GlobalEventHandlers, ev: InputEvent) => any) | null;
+        onbeforetoggle: ((this: GlobalEventHandlers, ev: Event) => any) | null;
         onblur: ((this: GlobalEventHandlers, ev: FocusEvent) => any) | null;
         oncancel: ((this: GlobalEventHandlers, ev: Event) => any) | null;
         oncanplay: ((this: GlobalEventHandlers, ev: Event) => any) | null;
@@ -2926,7 +2944,7 @@ declare const Base: {
         click(): void;
         hidePopover(): void;
         showPopover(): void;
-        togglePopover(force?: boolean | undefined): void;
+        togglePopover(force?: boolean | undefined): boolean;
         addEventListener<K_80 extends keyof HTMLElementEventMap>(type: K_80, listener: (this: HTMLElement, ev: HTMLElementEventMap[K_80]) => any, options?: boolean | AddEventListenerOptions | undefined): void;
         addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions | undefined): void;
         removeEventListener<K_81 extends keyof HTMLElementEventMap>(type: K_81, listener: (this: HTMLElement, ev: HTMLElementEventMap[K_81]) => any, options?: boolean | EventListenerOptions | undefined): void;
@@ -3061,6 +3079,7 @@ declare const Base: {
         ariaColIndex: string | null;
         ariaColSpan: string | null;
         ariaCurrent: string | null;
+        ariaDescription: string | null;
         ariaDisabled: string | null;
         ariaExpanded: string | null;
         ariaHasPopup: string | null;
@@ -3131,6 +3150,7 @@ declare const Base: {
         onanimationstart: ((this: GlobalEventHandlers, ev: AnimationEvent) => any) | null;
         onauxclick: ((this: GlobalEventHandlers, ev: MouseEvent) => any) | null;
         onbeforeinput: ((this: GlobalEventHandlers, ev: InputEvent) => any) | null;
+        onbeforetoggle: ((this: GlobalEventHandlers, ev: Event) => any) | null;
         onblur: ((this: GlobalEventHandlers, ev: FocusEvent) => any) | null;
         oncancel: ((this: GlobalEventHandlers, ev: Event) => any) | null;
         oncanplay: ((this: GlobalEventHandlers, ev: Event) => any) | null;
@@ -3286,7 +3306,7 @@ declare const Base: {
         click(): void;
         hidePopover(): void;
         showPopover(): void;
-        togglePopover(force?: boolean | undefined): void;
+        togglePopover(force?: boolean | undefined): boolean;
         addEventListener<K_89 extends keyof HTMLElementEventMap>(type: K_89, listener: (this: HTMLElement, ev: HTMLElementEventMap[K_89]) => any, options?: boolean | AddEventListenerOptions | undefined): void;
         addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions | undefined): void;
         removeEventListener<K_90 extends keyof HTMLElementEventMap>(type: K_90, listener: (this: HTMLElement, ev: HTMLElementEventMap[K_90]) => any, options?: boolean | EventListenerOptions | undefined): void;
@@ -3421,6 +3441,7 @@ declare const Base: {
         ariaColIndex: string | null;
         ariaColSpan: string | null;
         ariaCurrent: string | null;
+        ariaDescription: string | null;
         ariaDisabled: string | null;
         ariaExpanded: string | null;
         ariaHasPopup: string | null;
@@ -3491,6 +3512,7 @@ declare const Base: {
         onanimationstart: ((this: GlobalEventHandlers, ev: AnimationEvent) => any) | null;
         onauxclick: ((this: GlobalEventHandlers, ev: MouseEvent) => any) | null;
         onbeforeinput: ((this: GlobalEventHandlers, ev: InputEvent) => any) | null;
+        onbeforetoggle: ((this: GlobalEventHandlers, ev: Event) => any) | null;
         onblur: ((this: GlobalEventHandlers, ev: FocusEvent) => any) | null;
         oncancel: ((this: GlobalEventHandlers, ev: Event) => any) | null;
         oncanplay: ((this: GlobalEventHandlers, ev: Event) => any) | null;
@@ -3651,7 +3673,7 @@ declare const Base: {
         click(): void;
         hidePopover(): void;
         showPopover(): void;
-        togglePopover(force?: boolean | undefined): void;
+        togglePopover(force?: boolean | undefined): boolean;
         addEventListener<K_98 extends keyof HTMLElementEventMap>(type: K_98, listener: (this: HTMLElement, ev: HTMLElementEventMap[K_98]) => any, options?: boolean | AddEventListenerOptions | undefined): void;
         addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions | undefined): void;
         removeEventListener<K_99 extends keyof HTMLElementEventMap>(type: K_99, listener: (this: HTMLElement, ev: HTMLElementEventMap[K_99]) => any, options?: boolean | EventListenerOptions | undefined): void;
@@ -3786,6 +3808,7 @@ declare const Base: {
         ariaColIndex: string | null;
         ariaColSpan: string | null;
         ariaCurrent: string | null;
+        ariaDescription: string | null;
         ariaDisabled: string | null;
         ariaExpanded: string | null;
         ariaHasPopup: string | null;
@@ -3856,6 +3879,7 @@ declare const Base: {
         onanimationstart: ((this: GlobalEventHandlers, ev: AnimationEvent) => any) | null;
         onauxclick: ((this: GlobalEventHandlers, ev: MouseEvent) => any) | null;
         onbeforeinput: ((this: GlobalEventHandlers, ev: InputEvent) => any) | null;
+        onbeforetoggle: ((this: GlobalEventHandlers, ev: Event) => any) | null;
         onblur: ((this: GlobalEventHandlers, ev: FocusEvent) => any) | null;
         oncancel: ((this: GlobalEventHandlers, ev: Event) => any) | null;
         oncanplay: ((this: GlobalEventHandlers, ev: Event) => any) | null;
@@ -3974,20 +3998,24 @@ declare const Base: {
         triggerVetoableEvent(eventType: string, data?: any): boolean;
         detachAllEvents(): void;
         detachEventsByName: (eventName: string) => void;
-        "__#5@#addLongPressListener"(eventName: string, target: Element, options?: import("../../mixins/ids-events-mixin/ids-events-mixin").EventOptions | undefined): void;
-        "__#5@#removeLongPressListener"(): void;
-        "__#5@#addSwipeListener"(eventName: string, target: Element, options?: import("../../mixins/ids-events-mixin/ids-events-mixin").EventOptions | undefined): void;
-        "__#5@#removeSwipeListener"(): void;
-        "__#5@#addKeyboardFocusListener"(eventName: string, target: Element): void;
-        "__#5@#removeKeyboardFocusListener"(): void;
-        "__#5@#addHoverEndListener"(eventName: string, target: Element, options?: import("../../mixins/ids-events-mixin/ids-events-mixin").EventOptions | undefined): void;
-        "__#5@#addSlopedMouseLeaveListener"(eventName: string, target: Element, options?: import("../../mixins/ids-events-mixin/ids-events-mixin").EventOptions | undefined): void;
-        "__#5@#clearSlopedMouseLeaveTimer"(): void;
-        "__#5@#removeSlopedMouseLeaveListener"(): void;
-        "__#5@#addKeyDownEndListener"(target: HTMLElement, options?: Record<string, unknown> | undefined): void;
-        clearTimer(): void;
-        "__#5@#removeHoverEndListener"(): void;
-        "__#5@#removeKeyDownEndListener"(): void;
+        "__#4@#addLongPressListener"(eventName: string, target: Element, options?: import("../../mixins/ids-events-mixin/ids-events-mixin").EventOptions | undefined): void;
+        "__#4@#removeLongPressListener"(): void;
+        "__#4@#addSwipeListener"(eventName: string, target: Element, options?: import("../../mixins/ids-events-mixin/ids-events-mixin").EventOptions | undefined): void;
+        "__#4@#removeSwipeListener"(): void;
+        "__#4@#addKeyboardFocusListener"(eventName: string, target: Element): void;
+        "__#4@#removeKeyboardFocusListener"(): void;
+        "__#4@#addHoverEndListener"(eventName: string, target: Element, options?: import("../../mixins/ids-events-mixin/ids-events-mixin").EventOptions | undefined): void;
+        "__#4@#addSlopedMouseLeaveListener"(eventName: string, target: Element, options?: import("../../mixins/ids-events-mixin/ids-events-mixin").EventOptions | undefined): void;
+        "__#4@#clearSlopedMouseLeaveTimer"(): void;
+        "__#4@#removeSlopedMouseLeaveListener"(): void;
+        "__#4@#addKeyDownEndListener"(target: HTMLElement, options?: Record<string, unknown> | undefined): void;
+        clearTimer(): void; /**
+         * Set the icon to be visible (if used)
+         * @private
+         * @param {HTMLElement} option the option to select
+         */
+        "__#4@#removeHoverEndListener"(): void;
+        "__#4@#removeKeyDownEndListener"(): void;
         name?: string | undefined;
         state: any;
         cachedNonce: string;
@@ -4033,7 +4061,7 @@ declare const Base: {
         click(): void;
         hidePopover(): void;
         showPopover(): void;
-        togglePopover(force?: boolean | undefined): void;
+        togglePopover(force?: boolean | undefined): boolean;
         addEventListener<K_107 extends keyof HTMLElementEventMap>(type: K_107, listener: (this: HTMLElement, ev: HTMLElementEventMap[K_107]) => any, options?: boolean | AddEventListenerOptions | undefined): void;
         addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions | undefined): void;
         removeEventListener<K_108 extends keyof HTMLElementEventMap>(type: K_108, listener: (this: HTMLElement, ev: HTMLElementEventMap[K_108]) => any, options?: boolean | EventListenerOptions | undefined): void;
@@ -4168,6 +4196,7 @@ declare const Base: {
         ariaColIndex: string | null;
         ariaColSpan: string | null;
         ariaCurrent: string | null;
+        ariaDescription: string | null;
         ariaDisabled: string | null;
         ariaExpanded: string | null;
         ariaHasPopup: string | null;
@@ -4238,6 +4267,7 @@ declare const Base: {
         onanimationstart: ((this: GlobalEventHandlers, ev: AnimationEvent) => any) | null;
         onauxclick: ((this: GlobalEventHandlers, ev: MouseEvent) => any) | null;
         onbeforeinput: ((this: GlobalEventHandlers, ev: InputEvent) => any) | null;
+        onbeforetoggle: ((this: GlobalEventHandlers, ev: Event) => any) | null;
         onblur: ((this: GlobalEventHandlers, ev: FocusEvent) => any) | null;
         oncancel: ((this: GlobalEventHandlers, ev: Event) => any) | null;
         oncanplay: ((this: GlobalEventHandlers, ev: Event) => any) | null;
@@ -4369,6 +4399,7 @@ export default class IdsDropdown extends Base {
      * Invoked each time the custom element is appended into a document-connected element.
      */
     connectedCallback(): void;
+    disconnectedCallback(): void;
     /**
      * Return the attributes we handle as getters/setters
      * @returns {Array} The attributes in an array
@@ -4402,7 +4433,7 @@ export default class IdsDropdown extends Base {
      */
     template(): string;
     private templateDropdownList;
-    get input(): IdsTriggerField | null | undefined;
+    get input(): IdsTriggerField | null;
     get popup(): import("../ids-popup/ids-popup").default | null | undefined;
     /**
      * Set the value of the dropdown using the value/id attribute if present