@aurodesignsystem-dev/auro-formkit 0.0.0-pr622.1 → 0.0.0-pr624.1

package/components/dropdown/demo/readme.md

@@ -107,7 +107,7 @@ The use of any Auro custom element has a dependency on the [Auro Design Tokens](
 In cases where the project is not able to process JS assets, there are pre-processed assets available for use. Legacy browsers such as IE11 are no longer supported.
 
 ```html
-<script type="module" src="https://cdn.jsdelivr.net/npm/@aurodesignsystem/auro-formkit@0.0.0/auro-dropdown/+esm"></script>
+<script type="module" src="https://cdn.jsdelivr.net/npm/@aurodesignsystem/auro-formkit@latest/auro-dropdown/+esm"></script>
 ```
 <!-- AURO-GENERATED-CONTENT:END -->
 

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

@@ -11,7 +11,7 @@
  * @event auroDropdown-toggled - Notifies that the visibility of the dropdown bib has changed.
  * @event auroDropdown-idAdded - Notifies consumers that the unique ID for the dropdown bib has been generated.
  */
-export class AuroDropdown extends LitElement {
+export class AuroDropdown extends AuroElement {
     static get properties(): {
         /**
          * If declared, bib's position will be automatically calculated where to appear.
@@ -24,7 +24,7 @@ export class AuroDropdown extends LitElement {
         /**
          * If declared, applies a border around the trigger slot.
          */
-        bordered: {
+        simple: {
             type: BooleanConstructor;
             reflect: boolean;
         };
@@ -66,12 +66,18 @@ export class AuroDropdown extends LitElement {
             attribute: boolean;
         };
         /**
-         * If declared in combination with `bordered` property or `helpText` slot content, will apply red color to both.
+         * If declared in combination with not using the `simple` property or `helpText` slot content, will apply red color to both.
          */
         error: {
             type: BooleanConstructor;
             reflect: boolean;
         };
+        /**
+         * Contains the help text message for the current validity error.
+         */
+        errorMessage: {
+            type: StringConstructor;
+        };
         /**
          * If declared, the bib will display when focus is applied to the trigger.
          */
@@ -190,11 +196,6 @@ export class AuroDropdown extends LitElement {
         };
         /**
          * Position where the bib should appear relative to the trigger.
-         * Accepted values:
-         * "top" | "right" | "bottom" | "left" |
-         * "bottom-start" | "top-start" | "top-end" |
-         * "right-start" | "right-end" | "bottom-end" |
-         * "left-start" | "left-end"
          * @default bottom-start
          */
         placement: {
@@ -244,20 +245,21 @@ export class AuroDropdown extends LitElement {
     isBibFullscreen: boolean;
     matchWidth: boolean;
     noHideOnThisFocusLoss: boolean;
-    /**
-     * @private
-     */
-    private triggerContentFocusable;
-    /**
-     * @private
-     */
-    private showTriggerBorders;
+    errorMessage: string;
+    shape: string;
+    size: string;
+    get commonLabelClasses(): {};
+    get commonWrapperClasses(): {
+        trigger: boolean;
+        wrapper: boolean;
+        hasFocus: boolean;
+        simple: boolean;
+    };
     /**
      * @private
      * @returns {void} Internal defaults.
      */
     private privateDefaults;
-    bordered: boolean;
     chevron: boolean;
     disabled: boolean;
     error: boolean;
@@ -268,6 +270,9 @@ export class AuroDropdown extends LitElement {
     labeled: boolean;
     a11yRole: string;
     onDark: boolean;
+    showTriggerBorders: boolean;
+    triggerContentFocusable: any;
+    simple: boolean;
     placement: string;
     offset: number;
     noFlip: boolean;
@@ -301,8 +306,8 @@ export class AuroDropdown extends LitElement {
      */
     private helpTextTag;
     /**
-     * @private
      * Creates and dispatches a duplicate focus event on the trigger element.
+     * @private
      * @param {Event} event - The original focus event.
      */
     private bindFocusEventToTrigger;
@@ -347,6 +352,19 @@ export class AuroDropdown extends LitElement {
      * @returns {Boolean}
      */
     private isCustomSlotContent;
+    /**
+     * Function to support @focusin event.
+     * @private
+     * @return {void}
+     */
+    private handleFocusin;
+    hasFocus: boolean;
+    /**
+     * Function to support @focusout event.
+     * @private
+     * @return {void}
+     */
+    private handleFocusout;
     /**
      * Determines if the element or any children are focusable.
      * @private
@@ -355,9 +373,9 @@ export class AuroDropdown extends LitElement {
      */
     private containsFocusableElement;
     /**
-     * @private
      * Sets up event listeners to deliver focus and blur events from nested Auro components within the trigger slot to trigger.
      * This ensures that focus/blur events originating from within these components are propagated to the trigger element itself.
+     * @private
      */
     private setupTriggerFocusEventBinding;
     /**
@@ -401,6 +419,37 @@ export class AuroDropdown extends LitElement {
      * @description Handles the slot change event for the label slot.
      */
     private handleLabelSlotChange;
-    render(): import("lit-html").TemplateResult;
+    /**
+     * Returns HTML for the common portion of the layouts.
+     * @private
+     * @param {Object} helpTextClasses - Classes to apply to the help text container.
+     * @returns {html} - Returns HTML.
+     */
+    private renderBasicHtml;
+    /**
+     * Returns HTML for the classic layout. Does not support type="*".
+     * @private
+     * @returns {html} - Returns HTML for the classic layout.
+     */
+    private renderLayoutClassic;
+    /**
+     * Returns HTML for the snowflake layout. Does not support type="*".
+     * @private
+     * @returns {html} - Returns HTML for the snowflake layout.
+     */
+    private renderLayoutSnowflake;
+    /**
+     * Returns HTML for the emphasized layout. Does not support type="*".
+     * @private
+     * @returns {html} - Returns HTML for the emphasized layout.
+     */
+    private renderLayoutEmphasized;
+    /**
+     * 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 {HTMLCollection} - Returns the HTML for the layout.
+     */
+    private renderLayout;
 }
-import { LitElement } from "lit";
+import { AuroElement } from '../../layoutElement/src/auroElement.js';