@proximus/lavender-autocomplete 2.0.0-alpha.203 → 2.0.0-alpha.204

package/dist/Autocomplete.d.ts

@@ -3,26 +3,26 @@ import '@proximus/lavender-input';
 import { type Dropdown } from '@proximus/lavender-dropdown';
 import { type Input } from '@proximus/lavender-input';
 import { WithExtraAttributes } from '@proximus/lavender-common';
-/**
- * @summary An autocomplete input component with dropdown suggestions.
- * @attr {number} size - Visible width of the input in characters.
- * @attr {string} state - Validation state forwarded to the input. One of `error` or `success`.
- * @attr {boolean} extended - Makes the autocomplete take the full width of its container.
- * @attr {boolean} extended--mobile - Full width on mobile breakpoint only.
- * @attr {boolean} extended--tablet - Full width on tablet breakpoint only.
- * @attr {boolean} extended--laptop - Full width on laptop breakpoint only.
- * @attr {boolean} extended--desktop - Full width on desktop breakpoint only.
- * @attr {string} name - The name used when submitting form data.
- * @slot label - Slot for the input label.
- * @slot helper - Slot for helper text shown next to the label.
- * @slot status-text - Slot for the validation/status message (use `role="alert"` for errors, `role="status"` for success).
- * @slot dropdown-content - Slot for dropdown content items such as `px-autocomplete-header` and `px-autocomplete-option`.
- */
 export declare class Autocomplete extends WithExtraAttributes {
     #private;
+    /**
+     * @summary An autocomplete input component with dropdown suggestions.
+     * @attr {number} size - Visible width of the input in characters.
+     * @attr {string} state - Validation state forwarded to the input. One of `error` or `success`.
+     * @attr {boolean} extended - Makes the autocomplete take the full width of its container.
+     * @attr {boolean} extended--mobile - Full width on mobile breakpoint only.
+     * @attr {boolean} extended--tablet - Full width on tablet breakpoint only.
+     * @attr {boolean} extended--laptop - Full width on laptop breakpoint only.
+     * @attr {boolean} extended--desktop - Full width on desktop breakpoint only.
+     * @attr {string} name - The name used when submitting form data.
+     * @slot label - Slot for the input label.
+     * @slot helper - Slot for helper text shown next to the label.
+     * @slot status-text - Slot for the validation/status message (use `role="alert"` for errors, `role="status"` for success).
+     * @slot dropdown-content - Slot for dropdown content items such as `px-autocomplete-header` and `px-autocomplete-option`.
+     */
+    protected static readonly template: HTMLTemplateElement;
     static formAssociated: boolean;
     private internals;
-    template: () => string;
     constructor();
     static get observedAttributes(): string[];
     attributeChangedCallback(name: string, oldValue: string, newValue: string): void;

package/dist/AutocompleteHeader.d.ts

@@ -2,13 +2,13 @@ import '@proximus/lavender-icon';
 import '@proximus/lavender-container';
 import '@proximus/lavender-layout';
 import '@proximus/lavender-span';
-/**
- * @summary A header label displayed inside the autocomplete dropdown.
- * @slot - Default slot for the header text content.
- */
 export declare class AutocompleteHeader extends HTMLElement {
     #private;
-    private template;
+    /**
+     * @summary A header label displayed inside the autocomplete dropdown.
+     * @slot - Default slot for the header text content.
+     */
+    protected static readonly template: HTMLTemplateElement;
     constructor();
     connectedCallback(): void;
     get $icon(): HTMLElement;

package/dist/AutocompleteOption.d.ts

@@ -1,14 +1,14 @@
 import '@proximus/lavender-layout';
 import '@proximus/lavender-span';
-/**
- * @summary A selectable option button displayed inside the autocomplete dropdown.
- * @attr {boolean} selected - Whether the option is currently selected.
- * @attr {string} type - The type of the internal button. Defaults to 'button'.
- * @slot - Default slot for the option text content.
- */
 export declare class AutocompleteOption extends HTMLElement {
     #private;
-    private template;
+    /**
+     * @summary A selectable option button displayed inside the autocomplete dropdown.
+     * @attr {boolean} selected - Whether the option is currently selected.
+     * @attr {string} type - The type of the internal button. Defaults to 'button'.
+     * @slot - Default slot for the option text content.
+     */
+    protected static readonly template: HTMLTemplateElement;
     constructor();
     static get observedAttributes(): string[];
     attributeChangedCallback(name: string, oldValue: string, newValue: string): void;

package/dist/custom-elements.json

@@ -10,25 +10,16 @@
           "kind": "class",
           "description": "",
           "name": "Autocomplete",
-          "slots": [
-            {
-              "description": "Slot for the input label.",
-              "name": "label"
-            },
-            {
-              "description": "Slot for helper text shown next to the label.",
-              "name": "helper"
-            },
+          "members": [
             {
-              "description": "Slot for the validation/status message (use `role=\"alert\"` for errors, `role=\"status\"` for success).",
-              "name": "status-text"
+              "kind": "field",
+              "name": "template",
+              "privacy": "protected",
+              "static": true,
+              "readonly": true,
+              "summary": "An autocomplete input component with dropdown suggestions.",
+              "attribute": "size"
             },
-            {
-              "description": "Slot for dropdown content items such as `px-autocomplete-header` and `px-autocomplete-option`.",
-              "name": "dropdown-content"
-            }
-          ],
-          "members": [
             {
               "kind": "field",
               "name": "formAssociated",
@@ -51,10 +42,6 @@
               "name": "#controlId",
               "privacy": "private"
             },
-            {
-              "kind": "field",
-              "name": "template"
-            },
             {
               "kind": "field",
               "name": "#onClick",
@@ -145,78 +132,42 @@
             {
               "kind": "field",
               "name": "popoverHeight"
-            },
-            {
-              "kind": "field",
-              "name": "innerHTML"
             }
           ],
           "attributes": [
             {
               "name": "size",
-              "type": {
-                "text": "number"
-              },
+              "readonly": true,
+              "summary": "An autocomplete input component with dropdown suggestions.",
+              "fieldName": "template",
               "description": "Visible width of the input in characters."
             },
             {
-              "name": "state",
-              "type": {
-                "text": "string"
-              },
-              "description": "Validation state forwarded to the input. One of `error` or `success`."
+              "name": "state"
             },
             {
-              "name": "extended",
-              "type": {
-                "text": "boolean"
-              },
-              "description": "Makes the autocomplete take the full width of its container."
+              "name": "extended"
             },
             {
-              "name": "extended--mobile",
-              "type": {
-                "text": "boolean"
-              },
-              "description": "Full width on mobile breakpoint only."
+              "name": "extended--mobile"
             },
             {
-              "name": "extended--tablet",
-              "type": {
-                "text": "boolean"
-              },
-              "description": "Full width on tablet breakpoint only."
+              "name": "extended--tablet"
             },
             {
-              "name": "extended--laptop",
-              "type": {
-                "text": "boolean"
-              },
-              "description": "Full width on laptop breakpoint only."
+              "name": "extended--laptop"
             },
             {
-              "name": "extended--desktop",
-              "type": {
-                "text": "boolean"
-              },
-              "description": "Full width on desktop breakpoint only."
+              "name": "extended--desktop"
             },
             {
               "name": "popover-height"
-            },
-            {
-              "type": {
-                "text": "string"
-              },
-              "description": "The name used when submitting form data.",
-              "name": "name"
             }
           ],
           "superclass": {
             "name": "WithExtraAttributes",
             "package": "@proximus/lavender-common"
           },
-          "summary": "An autocomplete input component with dropdown suggestions.",
           "tagName": "px-autocomplete",
           "customElement": true
         }
@@ -248,17 +199,14 @@
           "kind": "class",
           "description": "",
           "name": "AutocompleteHeader",
-          "slots": [
-            {
-              "description": "Default slot for the header text content.",
-              "name": ""
-            }
-          ],
           "members": [
             {
               "kind": "field",
               "name": "template",
-              "privacy": "private"
+              "privacy": "protected",
+              "static": true,
+              "readonly": true,
+              "summary": "A header label displayed inside the autocomplete dropdown."
             },
             {
               "kind": "method",
@@ -275,10 +223,6 @@
               "name": "$text",
               "readonly": true
             },
-            {
-              "kind": "field",
-              "name": "innerHTML"
-            },
             {
               "kind": "field",
               "name": "adoptedStyleSheets",
@@ -291,7 +235,6 @@
           "superclass": {
             "name": "HTMLElement"
           },
-          "summary": "A header label displayed inside the autocomplete dropdown.",
           "tagName": "px-autocomplete-header",
           "customElement": true
         }
@@ -323,17 +266,15 @@
           "kind": "class",
           "description": "",
           "name": "AutocompleteOption",
-          "slots": [
-            {
-              "description": "Default slot for the option text content.",
-              "name": ""
-            }
-          ],
           "members": [
             {
               "kind": "field",
               "name": "template",
-              "privacy": "private"
+              "privacy": "protected",
+              "static": true,
+              "readonly": true,
+              "summary": "A selectable option button displayed inside the autocomplete dropdown.",
+              "attribute": "selected"
             },
             {
               "kind": "method",
@@ -366,10 +307,6 @@
               "name": "$button",
               "readonly": true
             },
-            {
-              "kind": "field",
-              "name": "innerHTML"
-            },
             {
               "kind": "field",
               "name": "adoptedStyleSheets",
@@ -382,23 +319,18 @@
           "attributes": [
             {
               "name": "selected",
-              "type": {
-                "text": "boolean"
-              },
+              "readonly": true,
+              "summary": "A selectable option button displayed inside the autocomplete dropdown.",
+              "fieldName": "template",
               "description": "Whether the option is currently selected."
             },
             {
-              "name": "type",
-              "type": {
-                "text": "string"
-              },
-              "description": "The type of the internal button. Defaults to 'button'."
+              "name": "type"
             }
           ],
           "superclass": {
             "name": "HTMLElement"
           },
-          "summary": "A selectable option button displayed inside the autocomplete dropdown.",
           "tagName": "px-autocomplete-option",
           "customElement": true
         }