@aurodesignsystem-dev/auro-formkit 0.0.0-pr624.0 → 0.0.0-pr624.10

package/components/select/dist/auro-select.d.ts

@@ -6,12 +6,13 @@
  * @slot label - Defines the content of the label.
  * @slot helpText - Defines the content of the helpText.
  * @slot placeholder - Defines the content of the placeholder to be shown when there is no value
+ * @slot valueText - Dropdown value text display.
  * @event auroSelect-valueSet - Notifies that the component has a new value set.
- * @event input - Notifies every time the value prop of the element is changed.
+ * @event input - Notifies every time the value prop of the element is changed. The updated `value` and `optionSelected` will be delivered in `detail` object.
  * @event auroFormElement-validated - Notifies that the `validity` and `errorMessage` values have changed.
  * @csspart helpText - Apply CSS to the help text.
  */
-export class AuroSelect extends LitElement {
+export class AuroSelect extends AuroElement {
     static get properties(): {
         /**
          * If declared, sets the autocomplete attribute for the select element.
@@ -20,6 +21,13 @@ export class AuroSelect extends LitElement {
             type: StringConstructor;
             reflect: boolean;
         };
+        /**
+         * If declared, the label and value will be visually hidden and the displayValue will render 100% of the time.
+         */
+        forceDisplayValue: {
+            type: BooleanConstructor;
+            reflect: boolean;
+        };
         /**
          * If declared, bib's position will be automatically calculated where to appear.
          * @default false
@@ -35,6 +43,20 @@ export class AuroSelect extends LitElement {
             type: BooleanConstructor;
             reflect: boolean;
         };
+        /**
+         * @private
+         */
+        isPopoverVisible: {
+            type: BooleanConstructor;
+            reflect: boolean;
+        };
+        /**
+         * If declared, the popover and trigger will be set to the same width.
+         */
+        matchWidth: {
+            type: BooleanConstructor;
+            reflect: boolean;
+        };
         /**
          * The name for the select element.
          */
@@ -63,7 +85,7 @@ export class AuroSelect extends LitElement {
         };
         /**
          * If declared, make bib.fullscreen.headline in HeadingDisplay.
-         * Otherwise, Heading 600
+         * Otherwise, Heading 600.
          */
         largeFullscreenHeadline: {
             type: BooleanConstructor;
@@ -114,12 +136,10 @@ export class AuroSelect extends LitElement {
             type: ObjectConstructor;
         };
         /**
-         * Specifies the current selected menuOption.
+         * Specifies the current selected menuOption. Default type is `HTMLElement`, changing to `Array<HTMLElement>` when `multiSelect` is true.
+         * @type {HTMLElement|Array<HTMLElement>}
          */
-        optionSelected: {
-            converter: typeof arrayConverter;
-            hasChanged: typeof arrayOrUndefinedHasChanged;
-        };
+        optionSelected: HTMLElement | Array<HTMLElement>;
         /**
          * @private
          */
@@ -179,12 +199,10 @@ export class AuroSelect extends LitElement {
             reflect: boolean;
         };
         /**
-         * Value selected for the component.
+         * Value selected for the component. Default type is `String`, changing to `Array<String>` when `multiSelect` is true.
+         * @type {String|Array<String>}
          */
-        value: {
-            converter: typeof arrayConverter;
-            hasChanged: typeof arrayOrUndefinedHasChanged;
-        };
+        value: string | Array<string>;
         /**
          * Sets multi-select mode, allowing multiple options to be selected at once.
          */
@@ -200,6 +218,22 @@ export class AuroSelect extends LitElement {
          * @private
          */
         touched: boolean;
+        /**
+         * @private
+         */
+        hasFocus: {
+            type: BooleanConstructor;
+            reflect: boolean;
+            attribute: boolean;
+        };
+        /**
+         * @private
+         */
+        hasDisplayValueContent: {
+            type: BooleanConstructor;
+            reflect: boolean;
+            attribute: boolean;
+        };
     };
     static get styles(): import("lit").CSSResult[];
     /**
@@ -211,10 +245,14 @@ export class AuroSelect extends LitElement {
      *
      */
     static register(name?: string): void;
+    matchWidth: boolean;
+    shape: string;
+    size: string;
     placement: string;
     offset: number;
     noFlip: boolean;
     autoPlacement: boolean;
+    forceDisplayValue: boolean;
     /**
      * @private
      */
@@ -235,10 +273,22 @@ export class AuroSelect extends LitElement {
      * @private
      */
     private bibtemplateTag;
+    /**
+     * @private
+     */
+    private helpTextTag;
     /**
      * @private
      */
     private isHiddenWhileLoading;
+    /**
+     * @private
+     */
+    private hasFocus;
+    /**
+     * @private
+     */
+    private hasDisplayValueContent;
     /**
      * @private
      * @returns {void} Internal defaults.
@@ -250,6 +300,13 @@ export class AuroSelect extends LitElement {
     value: any;
     fullscreenBreakpoint: string;
     onDark: boolean;
+    isPopoverVisible: any;
+    /**
+     * Returns classmap configuration for wrapper elements in each layout.
+     * @private
+     * @return {object} - Returns classmap.
+     */
+    private get commonWrapperClasses();
     /**
      * Binds all behavior needed to the dropdown after rendering.
      * @private
@@ -257,7 +314,6 @@ export class AuroSelect extends LitElement {
      */
     private configureDropdown;
     dropdown: any;
-    menuWrapper: any;
     bibtemplate: any;
     /**
      * Updates the displayed value in an Auro dropdown component based on optionSelected.
@@ -322,6 +378,11 @@ export class AuroSelect extends LitElement {
      * @returns {void}
      */
     private generateOptionsArray;
+    /**
+     * Resets all options to their default state.
+     * @private
+     */
+    private clearSelection;
     firstUpdated(): void;
     updated(changedProperties: any): Promise<void>;
     /**
@@ -352,8 +413,39 @@ export class AuroSelect extends LitElement {
      * @private
      */
     private _updateNativeSelect;
-    render(): import("lit-html").TemplateResult;
+    renderAriaHtml(): import("lit-html").TemplateResult;
+    renderNativeSelect(): import("lit-html").TemplateResult;
+    /**
+     * Returns HTML for the help text and error message.
+     * @private
+     * @returns {html} - Returns HTML for the help text and error message.
+     */
+    private renderHtmlHelpText;
+    /**
+     * Returns HTML for the emphasized layout.
+     * @private
+     * @returns {import("lit").TemplateResult} - Returns HTML for the emphasized layout.
+     */
+    private renderLayoutEmphasized;
+    /**
+     * Returns HTML for the snowflake layout.
+     * @private
+     * @returns {import("lit").TemplateResult} - Returns HTML for the snowflake layout.
+     */
+    private renderLayoutSnowflake;
+    /**
+     * Returns HTML for the classic layout.
+     * @private
+     * @returns {import("lit").TemplateResult} - Returns HTML for the classic layout.
+     */
+    private renderLayoutClassic;
+    /**
+     * Logic to determine the layout of the component.
+     * @private
+     * @param {string} [ForcedLayout] - Used to force a specific layout, pass in the layout name to use.
+     * @returns {void}
+     */
+    private renderLayout;
+    renderBACKUP(): import("lit-html").TemplateResult;
 }
-import { LitElement } from "lit";
-import { arrayConverter } from '@aurodesignsystem/auro-menu';
-import { arrayOrUndefinedHasChanged } from '@aurodesignsystem/auro-menu';
+import { AuroElement } from '../../layoutElement/src/auroElement.js';

package/components/select/dist/helptextVersion.d.ts

@@ -0,0 +1,2 @@
+declare const _default: "1.0.0";
+export default _default;