@aurodesignsystem/auro-formkit 2.0.0-beta.5 → 2.0.0-beta.51

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

@@ -1,19 +1,6 @@
 /**
- * @prop {Object} optionSelected - Specifies the current selected option.
- * @prop {String} value - Value selected for the dropdown menu.
- * @prop {Boolean} checkmark - When attribute is present auro-menu will apply checkmarks to selected options.
- * @attr {String} error - When defined, sets persistent validity to `customError` and sets the validation message to the attribute value.
- * @attr {String} validity - Specifies the `validityState` this element is in.
- * @attr {String} setCustomValidity - Sets a custom help text message to display for all validityStates.
- * @attr {String} setCustomValidityCustomError - Custom help text message to display when validity = `customError`.
- * @attr {String} setCustomValidityValueMissing - Custom help text message to display when validity = `valueMissing`.
- * @attr {Boolean} disabled - If set, disables the combobox.
- * @attr {Boolean} noFilter - If set, combobox will not filter menuoptions based in input.
- * @attr {Boolean} noValidate - If set, disables auto-validation on blur.
- * @attr {Boolean} required - Populates the `required` attribute on the input. Used for client-side validation.
- * @attr {Boolean} triggerIcon - If set, the `icon` attribute will be applied to the trigger `auro-input` element.
- * @attr {String} type - Applies the defined value as the type attribute on auro-input.
  * @slot - Default slot for the menu content.
+ * @slot bib.fullscreen.headline - Defines the headline to display above menu-options
  * @slot label - Defines the content of the label.
  * @slot helpText - Defines the content of the helpText.
  * @event auroCombobox-valueSet - Notifies that the component has a new value set.
@@ -21,127 +8,147 @@
  */
 export class AuroCombobox extends LitElement {
     static get properties(): {
-        error: {
+        /**
+         * An enumerated attribute that defines what the user agent can suggest for autofill. At this time, only `autocomplete="off"` is supported.
+         */
+        autocomplete: {
             type: StringConstructor;
             reflect: boolean;
         };
-        setCustomValidity: {
-            type: StringConstructor;
-        };
-        setCustomValidityCustomError: {
-            type: StringConstructor;
-        };
-        setCustomValidityValueMissing: {
-            type: StringConstructor;
-        };
-        validity: {
-            type: StringConstructor;
+        /**
+         * When attribute is present auro-menu will apply checkmarks to selected options.
+         */
+        checkmark: {
+            type: BooleanConstructor;
             reflect: boolean;
         };
+        /**
+         * If set, disables the combobox.
+         */
         disabled: {
             type: BooleanConstructor;
             reflect: boolean;
         };
+        /**
+         * When defined, sets persistent validity to `customError` and sets the validation message to the attribute value.
+         */
+        error: {
+            type: StringConstructor;
+            reflect: boolean;
+        };
+        /**
+         * If set, combobox will not filter menuoptions based in input.
+         */
         noFilter: {
             type: BooleanConstructor;
             reflect: boolean;
         };
-        optionSelected: {
-            type: ObjectConstructor;
-        };
+        /**
+         * If set, disables auto-validation on blur.
+         */
         noValidate: {
             type: BooleanConstructor;
         };
-        required: {
-            type: BooleanConstructor;
-            reflect: boolean;
+        /**
+         * Specifies the current selected option.
+         */
+        optionSelected: {
+            type: ObjectConstructor;
+            converter: typeof arrayConverter;
+            hasChanged: typeof arrayOrUndefinedHasChanged;
         };
-        triggerIcon: {
+        /**
+         * Populates the `required` attribute on the input. Used for client-side validation.
+         */
+        required: {
             type: BooleanConstructor;
             reflect: boolean;
         };
-        type: {
+        /**
+         * Sets a custom help text message to display for all validityStates.
+         */
+        setCustomValidity: {
             type: StringConstructor;
-            reflect: boolean;
         };
-        value: {
+        /**
+         * Custom help text message to display when validity = `customError`.
+         */
+        setCustomValidityCustomError: {
             type: StringConstructor;
         };
-        checkmark: {
-            type: BooleanConstructor;
-            reflect: boolean;
-        };
         /**
-         * @private
+         * Custom help text message to display when validity = `valueMissing`.
          */
-        availableOptions: {
-            type: ArrayConstructor;
+        setCustomValidityValueMissing: {
+            type: StringConstructor;
         };
         /**
-         * @private
+         * If set, the `icon` attribute will be applied to the trigger `auro-input` element.
          */
-        optionActive: {
-            type: ObjectConstructor;
+        triggerIcon: {
+            type: BooleanConstructor;
+            reflect: boolean;
         };
         /**
-         * @private
+         * Applies the defined value as the type attribute on auro-input.
          */
-        msgSelectionMissing: {
+        type: {
             type: StringConstructor;
+            reflect: boolean;
         };
         /**
-         * @private
+         * Specifies the `validityState` this element is in.
          */
-        dropdownElementName: {
+        validity: {
             type: StringConstructor;
+            reflect: boolean;
         };
         /**
-         * @private
+         * Value selected for the dropdown menu.
          */
-        dropdownTag: {
-            type: ObjectConstructor;
+        value: {
+            converter: typeof arrayConverter;
+            hasChanged: typeof arrayOrUndefinedHasChanged;
         };
         /**
-         * @private
+         * If declared, make mobileHeadline in HeadingDisplay.
+         * Otherwise, Heading 600
+         */
+        largeFullscreenHeadline: {
+            type: BooleanConstructor;
+            reflect: boolean;
+        };
+        /**
+         * Defines the screen size breakpoint (`lg`, `md`, `sm`, or `xs`) at which the dropdown switches to fullscreen mode on mobile.
+         * When expanded, the dropdown will automatically display in fullscreen mode if the screen size is equal to or smaller than the selected breakpoint.
+         * @default sm
          */
-        inputElementName: {
+        fullscreenBreakpoint: {
             type: StringConstructor;
+            reflect: boolean;
         };
         /**
          * @private
          */
-        inputTag: {
-            type: ObjectConstructor;
+        isDropdownFullscreen: {
+            type: BooleanConstructor;
+            reflect: boolean;
         };
     };
     static get styles(): import("lit").CSSResult[];
     /**
      * This will register this element with the browser.
-     * @param {string} [name="auro-combobox"] - The name of element that you want to register to.
+     * @param {string} [name='auro-combobox'] - The name of element that you want to register to.
      *
      * @example
-     * AuroCombobox.register("custom-combobox") // this will register this element to <custom-combobox/>
+     * AuroCombobox.register('custom-combobox') // this will register this element to <custom-combobox/>
      *
      */
     static register(name?: string): void;
     noFilter: boolean;
     validity: any;
     value: any;
-    optionSelected: any;
-    /**
-     * @private
-     */
-    private validation;
-    /**
-     * @private
-     */
-    private runtimeUtils;
-    /**
-     * @private
-     */
-    private isHiddenWhileLoading;
-    dropdownTag: any;
-    inputTag: any;
+    optionSelected: any[];
     /**
      * @private
      * @returns {void} Internal defaults.
@@ -150,6 +157,13 @@ export class AuroCombobox extends LitElement {
     availableOptions: any[];
     optionActive: any;
     msgSelectionMissing: string;
+    fullscreenBreakpoint: string;
+    validation: AuroFormValidation;
+    runtimeUtils: any;
+    isHiddenWhileLoading: boolean;
+    dropdownTag: any;
+    bibtemplateTag: any;
+    inputTag: any;
     /**
      * Processes hidden state of all menu options and determines if there are any available options not hidden.
      * @private
@@ -176,6 +190,7 @@ export class AuroCombobox extends LitElement {
      * @returns {void}
      */
     private showBib;
+    isDropdownFullscreen: any;
     /**
      * Binds all behavior needed to the dropdown after rendering.
      * @private
@@ -183,6 +198,15 @@ export class AuroCombobox extends LitElement {
      */
     private configureDropdown;
     menuWrapper: any;
+    bibtemplate: any;
+    /**
+     * @private
+     * When the dropdown is visible in fullscreen mode, the input is moved to the subheader slot of bibtemplate.
+     * Otherwise, it's moved back to the trigger slot.
+     * @private
+     * @returns {void}
+     */
+    private transportInput;
     /**
      * Binds all behavior needed to the menu after rendering.
      * @private
@@ -190,6 +214,13 @@ export class AuroCombobox extends LitElement {
      */
     private configureMenu;
     menu: Element;
+    /**
+     * @private
+     * Dispatches input's keyboard events from host
+     * This allows key events from the input to be handled by the parent.
+     * @param {KeyboardEvent} event - The keyboard event.
+     */
+    private bubbleUpInputKeyEvent;
     /**
      * Binds all behavior needed to the input after rendering.
      * @private
@@ -238,15 +269,31 @@ export class AuroCombobox extends LitElement {
      * @returns {void}
      */
     reset(): void;
+    /**
+     * Validates value.
+     * @param {boolean} [force=false] - Whether to force validation.
+     */
+    validate(force?: boolean): void;
     updated(changedProperties: any): void;
+    /**
+     * Applies slotted nodes to a target element with a new slot name.
+     * @private
+     * @param {HTMLSlotElement} slot - The slot element containing the nodes to apply.
+     * @param {HTMLElement} target - The target element to apply the nodes to.
+     * @param {string} newSlotName - The new slot name for the applied nodes.
+     * @returns {void}
+     */
+    private transportAssignedNodes;
     /**
      * Watch for slot changes and recalculate the menuoptions.
      * @private
-     * @param {Event} event - slotchange event
+     * @param {Event} event - `slotchange` event.
      * @returns {void}
      */
     private handleSlotChange;
     render(): import("lit-html").TemplateResult;
 }
 import { LitElement } from "lit";
-//# sourceMappingURL=auro-combobox.d.ts.map
+import AuroFormValidation from '@auro-formkit/form-validation';
+import { arrayConverter } from '@aurodesignsystem/auro-menu';
+import { arrayOrUndefinedHasChanged } from '@aurodesignsystem/auro-menu';

package/components/combobox/dist/bibtemplateVersion.d.ts

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

package/components/{select/dist/formkit/auro-dropdownVersion.d.ts → combobox/dist/dropdownVersion.d.ts}

@@ -1,3 +1,2 @@
 declare const _default: "3.0.0";
 export default _default;
-//# sourceMappingURL=auro-dropdownVersion.d.ts.map

package/components/combobox/dist/index.d.ts

@@ -1,3 +1,2 @@
 export { AuroCombobox };
 import { AuroCombobox } from './auro-combobox.js';
-//# sourceMappingURL=index.d.ts.map