igniteui-webcomponents 4.3.1 → 4.4.0

package/custom-elements.json

@@ -254,14 +254,10 @@
         },
         {
           "name": "disabled",
-          "description": "Determines whether the button is disabled.",
+          "description": "The disabled state of the component",
           "type": "boolean",
           "default": "false"
         },
-        {
-          "name": "aria-label",
-          "type": "string"
-        },
         {
           "name": "size",
           "description": "Determines the size of the component.",
@@ -282,6 +278,11 @@
           "type": "\"flat\" | \"contained\" | \"outlined\" | \"fab\"",
           "default": "\"contained\""
         },
+        {
+          "name": "formAssociated",
+          "type": "true",
+          "default": "true"
+        },
         {
           "name": "type",
           "attribute": "type",
@@ -315,14 +316,13 @@
         {
           "name": "disabled",
           "attribute": "disabled",
-          "description": "Determines whether the button is disabled.",
+          "description": "The disabled state of the component",
           "type": "boolean",
           "default": "false"
         },
         {
-          "name": "ariaLabel",
-          "attribute": "aria-label",
-          "type": "string"
+          "name": "form",
+          "description": "Returns the HTMLFormElement associated with this element."
         },
         {
           "name": "size",
@@ -424,14 +424,10 @@
         },
         {
           "name": "disabled",
-          "description": "Determines whether the button is disabled.",
+          "description": "The disabled state of the component",
           "type": "boolean",
           "default": "false"
         },
-        {
-          "name": "aria-label",
-          "type": "string"
-        },
         {
           "name": "size",
           "description": "Determines the size of the component.",
@@ -471,6 +467,11 @@
           "type": "\"flat\" | \"contained\" | \"outlined\"",
           "default": "\"contained\""
         },
+        {
+          "name": "formAssociated",
+          "type": "true",
+          "default": "true"
+        },
         {
           "name": "type",
           "attribute": "type",
@@ -504,14 +505,13 @@
         {
           "name": "disabled",
           "attribute": "disabled",
-          "description": "Determines whether the button is disabled.",
+          "description": "The disabled state of the component",
           "type": "boolean",
           "default": "false"
         },
         {
-          "name": "ariaLabel",
-          "attribute": "aria-label",
-          "type": "string"
+          "name": "form",
+          "description": "Returns the HTMLFormElement associated with this element."
         },
         {
           "name": "size",
@@ -1331,50 +1331,45 @@
           "type": "boolean",
           "default": "false"
         },
-        {
-          "name": "name",
-          "description": "The name attribute of the control.",
-          "type": "string"
-        },
         {
           "name": "value",
           "description": "The value attribute of the control.",
           "type": "string"
         },
-        {
-          "name": "disabled",
-          "description": "Disables the control.",
-          "type": "boolean",
-          "default": "false"
-        },
         {
           "name": "checked",
           "description": "The checked state of the control.",
           "type": "boolean",
           "default": "false"
         },
+        {
+          "name": "label-position",
+          "description": "The label position of the control.",
+          "type": "\"before\" | \"after\"",
+          "default": "\"after\""
+        },
         {
           "name": "required",
-          "description": "Makes the control a required field.",
+          "description": "Makes the control a required field in a form context.",
           "type": "boolean",
           "default": "false"
         },
         {
-          "name": "invalid",
-          "description": "Controls the validity of the control.",
-          "type": "boolean",
-          "default": "false"
+          "name": "name",
+          "description": "The name attribute of the control.",
+          "type": "string"
         },
         {
-          "name": "label-position",
-          "description": "The label position of the control.",
-          "type": "\"before\" | \"after\"",
-          "default": "\"after\""
+          "name": "disabled",
+          "description": "The disabled state of the component",
+          "type": "boolean",
+          "default": "false"
         },
         {
-          "name": "aria-labelledby",
-          "description": "Sets the aria-labelledby attribute for the control.",
-          "type": "string"
+          "name": "invalid",
+          "description": "Control the validity of the control.",
+          "type": "boolean",
+          "default": "false"
         }
       ],
       "properties": [
@@ -1390,25 +1385,12 @@
           "type": "boolean",
           "default": "false"
         },
-        {
-          "name": "name",
-          "attribute": "name",
-          "description": "The name attribute of the control.",
-          "type": "string"
-        },
         {
           "name": "value",
           "attribute": "value",
           "description": "The value attribute of the control.",
           "type": "string"
         },
-        {
-          "name": "disabled",
-          "attribute": "disabled",
-          "description": "Disables the control.",
-          "type": "boolean",
-          "default": "false"
-        },
         {
           "name": "checked",
           "attribute": "checked",
@@ -1416,32 +1398,60 @@
           "type": "boolean",
           "default": "false"
         },
+        {
+          "name": "labelPosition",
+          "attribute": "label-position",
+          "description": "The label position of the control.",
+          "type": "\"before\" | \"after\"",
+          "default": "\"after\""
+        },
         {
           "name": "required",
           "attribute": "required",
-          "description": "Makes the control a required field.",
+          "description": "Makes the control a required field in a form context.",
           "type": "boolean",
           "default": "false"
         },
         {
-          "name": "invalid",
-          "attribute": "invalid",
-          "description": "Controls the validity of the control.",
-          "type": "boolean",
-          "default": "false"
+          "name": "formAssociated",
+          "type": "true",
+          "default": "true"
         },
         {
-          "name": "labelPosition",
-          "attribute": "label-position",
-          "description": "The label position of the control.",
-          "type": "\"before\" | \"after\"",
-          "default": "\"after\""
+          "name": "name",
+          "attribute": "name",
+          "description": "The name attribute of the control.",
+          "type": "string"
         },
         {
-          "name": "ariaLabelledby",
-          "attribute": "aria-labelledby",
-          "description": "Sets the aria-labelledby attribute for the control.",
-          "type": "string"
+          "name": "form",
+          "description": "Returns the HTMLFormElement associated with this element."
+        },
+        {
+          "name": "validity",
+          "description": "Returns a ValidityState object which represents the different validity states\nthe element can be in, with respect to constraint validation."
+        },
+        {
+          "name": "validationMessage",
+          "description": "A string containing the validation message of this element."
+        },
+        {
+          "name": "willValidate",
+          "description": "A boolean value which returns true if the element is a submittable element\nthat is a candidate for constraint validation."
+        },
+        {
+          "name": "disabled",
+          "attribute": "disabled",
+          "description": "The disabled state of the component",
+          "type": "boolean",
+          "default": "false"
+        },
+        {
+          "name": "invalid",
+          "attribute": "invalid",
+          "description": "Control the validity of the control.",
+          "type": "boolean",
+          "default": "false"
         }
       ],
       "events": [
@@ -1488,50 +1498,45 @@
       "path": "./src/components/checkbox/switch.ts",
       "description": "Similar to a checkbox, a switch controls the state of a single setting on or off.",
       "attributes": [
-        {
-          "name": "name",
-          "description": "The name attribute of the control.",
-          "type": "string"
-        },
         {
           "name": "value",
           "description": "The value attribute of the control.",
           "type": "string"
         },
-        {
-          "name": "disabled",
-          "description": "Disables the control.",
-          "type": "boolean",
-          "default": "false"
-        },
         {
           "name": "checked",
           "description": "The checked state of the control.",
           "type": "boolean",
           "default": "false"
         },
+        {
+          "name": "label-position",
+          "description": "The label position of the control.",
+          "type": "\"before\" | \"after\"",
+          "default": "\"after\""
+        },
         {
           "name": "required",
-          "description": "Makes the control a required field.",
+          "description": "Makes the control a required field in a form context.",
           "type": "boolean",
           "default": "false"
         },
         {
-          "name": "invalid",
-          "description": "Controls the validity of the control.",
-          "type": "boolean",
-          "default": "false"
+          "name": "name",
+          "description": "The name attribute of the control.",
+          "type": "string"
         },
         {
-          "name": "label-position",
-          "description": "The label position of the control.",
-          "type": "\"before\" | \"after\"",
-          "default": "\"after\""
+          "name": "disabled",
+          "description": "The disabled state of the component",
+          "type": "boolean",
+          "default": "false"
         },
         {
-          "name": "aria-labelledby",
-          "description": "Sets the aria-labelledby attribute for the control.",
-          "type": "string"
+          "name": "invalid",
+          "description": "Control the validity of the control.",
+          "type": "boolean",
+          "default": "false"
         }
       ],
       "properties": [
@@ -1545,25 +1550,12 @@
           "type": "CSSResult",
           "default": "\"styles\""
         },
-        {
-          "name": "name",
-          "attribute": "name",
-          "description": "The name attribute of the control.",
-          "type": "string"
-        },
         {
           "name": "value",
           "attribute": "value",
           "description": "The value attribute of the control.",
           "type": "string"
         },
-        {
-          "name": "disabled",
-          "attribute": "disabled",
-          "description": "Disables the control.",
-          "type": "boolean",
-          "default": "false"
-        },
         {
           "name": "checked",
           "attribute": "checked",
@@ -1571,32 +1563,60 @@
           "type": "boolean",
           "default": "false"
         },
+        {
+          "name": "labelPosition",
+          "attribute": "label-position",
+          "description": "The label position of the control.",
+          "type": "\"before\" | \"after\"",
+          "default": "\"after\""
+        },
         {
           "name": "required",
           "attribute": "required",
-          "description": "Makes the control a required field.",
+          "description": "Makes the control a required field in a form context.",
           "type": "boolean",
           "default": "false"
         },
         {
-          "name": "invalid",
-          "attribute": "invalid",
-          "description": "Controls the validity of the control.",
-          "type": "boolean",
-          "default": "false"
+          "name": "formAssociated",
+          "type": "true",
+          "default": "true"
         },
         {
-          "name": "labelPosition",
-          "attribute": "label-position",
-          "description": "The label position of the control.",
-          "type": "\"before\" | \"after\"",
-          "default": "\"after\""
+          "name": "name",
+          "attribute": "name",
+          "description": "The name attribute of the control.",
+          "type": "string"
         },
         {
-          "name": "ariaLabelledby",
-          "attribute": "aria-labelledby",
-          "description": "Sets the aria-labelledby attribute for the control.",
-          "type": "string"
+          "name": "form",
+          "description": "Returns the HTMLFormElement associated with this element."
+        },
+        {
+          "name": "validity",
+          "description": "Returns a ValidityState object which represents the different validity states\nthe element can be in, with respect to constraint validation."
+        },
+        {
+          "name": "validationMessage",
+          "description": "A string containing the validation message of this element."
+        },
+        {
+          "name": "willValidate",
+          "description": "A boolean value which returns true if the element is a submittable element\nthat is a candidate for constraint validation."
+        },
+        {
+          "name": "disabled",
+          "attribute": "disabled",
+          "description": "The disabled state of the component",
+          "type": "boolean",
+          "default": "false"
+        },
+        {
+          "name": "invalid",
+          "attribute": "invalid",
+          "description": "Control the validity of the control.",
+          "type": "boolean",
+          "default": "false"
         }
       ],
       "events": [
@@ -1888,29 +1908,6 @@
       "name": "igc-combo",
       "path": "./src/components/combo/combo.ts",
       "attributes": [
-        {
-          "name": "name",
-          "description": "The name attribute of the control.",
-          "type": "string"
-        },
-        {
-          "name": "disabled",
-          "description": "The disabled attribute of the control.",
-          "type": "boolean",
-          "default": "false"
-        },
-        {
-          "name": "required",
-          "description": "The required attribute of the control.",
-          "type": "boolean",
-          "default": "false"
-        },
-        {
-          "name": "invalid",
-          "description": "The invalid attribute of the control.",
-          "type": "boolean",
-          "default": "false"
-        },
         {
           "name": "outlined",
           "description": "The outlined attribute of the control.",
@@ -1950,12 +1947,6 @@
           "type": "string",
           "default": "\"Search\""
         },
-        {
-          "name": "dir",
-          "description": "The direction attribute of the control.",
-          "type": "\"ltr\" | \"rtl\" | \"auto\"",
-          "default": "\"auto\""
-        },
         {
           "name": "open",
           "description": "Sets the open state of the component.",
@@ -2011,51 +2002,47 @@
           "name": "value",
           "description": "Sets the value (selected items). The passed value must be a valid JSON array.\nIf the data source is an array of complex objects, the `valueKey` attribute must be set.\nNote that when `displayKey` is not explicitly set, it will fall back to the value of `valueKey`.",
           "type": "ComboValue<T>[]"
-        }
-      ],
-      "properties": [
-        {
-          "name": "tagName",
-          "type": "\"igc-combo\"",
-          "default": "\"igc-combo\""
-        },
-        {
-          "name": "styles",
-          "type": "CSSResult",
-          "default": "\"styles\""
         },
         {
-          "name": "data",
-          "description": "The data source used to generate the list of options.",
-          "type": "T[]",
-          "default": "[]"
+          "name": "required",
+          "description": "Makes the control a required field in a form context.",
+          "type": "boolean",
+          "default": "false"
         },
         {
           "name": "name",
-          "attribute": "name",
           "description": "The name attribute of the control.",
           "type": "string"
         },
         {
           "name": "disabled",
-          "attribute": "disabled",
-          "description": "The disabled attribute of the control.",
+          "description": "The disabled state of the component",
           "type": "boolean",
           "default": "false"
         },
         {
-          "name": "required",
-          "attribute": "required",
-          "description": "The required attribute of the control.",
+          "name": "invalid",
+          "description": "Control the validity of the control.",
           "type": "boolean",
           "default": "false"
+        }
+      ],
+      "properties": [
+        {
+          "name": "tagName",
+          "type": "\"igc-combo\"",
+          "default": "\"igc-combo\""
         },
         {
-          "name": "invalid",
-          "attribute": "invalid",
-          "description": "The invalid attribute of the control.",
-          "type": "boolean",
-          "default": "false"
+          "name": "styles",
+          "type": "CSSResult",
+          "default": "\"styles\""
+        },
+        {
+          "name": "data",
+          "description": "The data source used to generate the list of options.",
+          "type": "T[]",
+          "default": "[]"
         },
         {
           "name": "outlined",
@@ -2103,13 +2090,6 @@
           "type": "string",
           "default": "\"Search\""
         },
-        {
-          "name": "dir",
-          "attribute": "dir",
-          "description": "The direction attribute of the control.",
-          "type": "\"ltr\" | \"rtl\" | \"auto\"",
-          "default": "\"auto\""
-        },
         {
           "name": "open",
           "attribute": "open",
@@ -2174,7 +2154,7 @@
           "name": "itemTemplate",
           "description": "The template used for the content of each combo item.",
           "type": "ComboItemTemplate<T>",
-          "default": "\"({ item }) => {\\n    if (typeof item !== 'object' || item === null) {\\n      return String(item) as any;\\n    }\\n\\n    if (this.displayKey) {\\n      return html`${item[this.displayKey]}`;\\n    }\\n\\n    return html`${String(item)}`;\\n  }\""
+          "default": "\"({ item }) => {\\n    const template = this.displayKey ? `${item[this.displayKey]}` : `${item}`;\\n    return html`${template}`;\\n  }\""
         },
         {
           "name": "groupHeaderTemplate",
@@ -2192,8 +2172,56 @@
           "name": "selection",
           "description": "Returns the current selection as an array of objects as provided in the `data` source.",
           "type": "T[]"
-        }
-      ],
+        },
+        {
+          "name": "required",
+          "attribute": "required",
+          "description": "Makes the control a required field in a form context.",
+          "type": "boolean",
+          "default": "false"
+        },
+        {
+          "name": "formAssociated",
+          "type": "true",
+          "default": "true"
+        },
+        {
+          "name": "name",
+          "attribute": "name",
+          "description": "The name attribute of the control.",
+          "type": "string"
+        },
+        {
+          "name": "form",
+          "description": "Returns the HTMLFormElement associated with this element."
+        },
+        {
+          "name": "validity",
+          "description": "Returns a ValidityState object which represents the different validity states\nthe element can be in, with respect to constraint validation."
+        },
+        {
+          "name": "validationMessage",
+          "description": "A string containing the validation message of this element."
+        },
+        {
+          "name": "willValidate",
+          "description": "A boolean value which returns true if the element is a submittable element\nthat is a candidate for constraint validation."
+        },
+        {
+          "name": "disabled",
+          "attribute": "disabled",
+          "description": "The disabled state of the component",
+          "type": "boolean",
+          "default": "false"
+        },
+        {
+          "name": "invalid",
+          "attribute": "invalid",
+          "description": "Control the validity of the control.",
+          "type": "boolean",
+          "default": "false"
+        }
+      ],
       "events": [
         {
           "name": "igcFocus",
@@ -2355,15 +2383,27 @@
           "description": "The date format to apply on the input.",
           "type": "string"
         },
+        {
+          "name": "min",
+          "description": "The minimum value required for the input to remain valid.",
+          "type": "Date"
+        },
+        {
+          "name": "max",
+          "description": "The maximum value required for the input to remain valid.",
+          "type": "Date"
+        },
         {
           "name": "min-value",
           "description": "The minimum value required for the input to remain valid.",
-          "type": "Date | null"
+          "type": "Date",
+          "deprecatedMessage": "since v4.4.0\nUse the `min` property instead."
         },
         {
           "name": "max-value",
           "description": "The maximum value required for the input to remain valid.",
-          "type": "Date | null"
+          "type": "Date",
+          "deprecatedMessage": "since v4.4.0\nUse the `max` property instead."
         },
         {
           "name": "display-format",
@@ -2387,28 +2427,11 @@
           "description": "The prompt symbol to use for unfilled parts of the mask.",
           "type": "string"
         },
-        {
-          "name": "invalid",
-          "description": "Controls the validity of the control.",
-          "type": "boolean",
-          "default": "false"
-        },
         {
           "name": "value",
           "description": "The value of the input.",
           "type": "Date | null"
         },
-        {
-          "name": "dir",
-          "description": "The direction attribute of the control.",
-          "type": "Direction",
-          "default": "\"auto\""
-        },
-        {
-          "name": "name",
-          "description": "The name attribute of the control.",
-          "type": "string"
-        },
         {
           "name": "outlined",
           "description": "Whether the control will have outlined appearance.",
@@ -2416,14 +2439,8 @@
           "default": "false"
         },
         {
-          "name": "required",
-          "description": "Makes the control a required field.",
-          "type": "boolean",
-          "default": "false"
-        },
-        {
-          "name": "disabled",
-          "description": "Makes the control a disabled field.",
+          "name": "readOnly",
+          "description": "Makes the control a readonly field.",
           "type": "boolean",
           "default": "false"
         },
@@ -2431,7 +2448,7 @@
           "name": "readonly",
           "description": "Makes the control a readonly field.",
           "type": "boolean",
-          "default": "false"
+          "deprecatedMessage": "since v4.4.0\nUse the `readOnly` property instead."
         },
         {
           "name": "placeholder",
@@ -2443,6 +2460,29 @@
           "description": "The label for the control.",
           "type": "string"
         },
+        {
+          "name": "required",
+          "description": "Makes the control a required field in a form context.",
+          "type": "boolean",
+          "default": "false"
+        },
+        {
+          "name": "name",
+          "description": "The name attribute of the control.",
+          "type": "string"
+        },
+        {
+          "name": "disabled",
+          "description": "The disabled state of the component",
+          "type": "boolean",
+          "default": "false"
+        },
+        {
+          "name": "invalid",
+          "description": "Control the validity of the control.",
+          "type": "boolean",
+          "default": "false"
+        },
         {
           "name": "size",
           "description": "Determines the size of the component.",
@@ -2462,17 +2502,31 @@
           "description": "The date format to apply on the input.",
           "type": "string"
         },
+        {
+          "name": "min",
+          "attribute": "min",
+          "description": "The minimum value required for the input to remain valid.",
+          "type": "Date"
+        },
+        {
+          "name": "max",
+          "attribute": "max",
+          "description": "The maximum value required for the input to remain valid.",
+          "type": "Date"
+        },
         {
           "name": "minValue",
           "attribute": "min-value",
           "description": "The minimum value required for the input to remain valid.",
-          "type": "Date | null"
+          "type": "Date",
+          "deprecatedMessage": "since v4.4.0\nUse the `min` property instead."
         },
         {
           "name": "maxValue",
           "attribute": "max-value",
           "description": "The maximum value required for the input to remain valid.",
-          "type": "Date | null"
+          "type": "Date",
+          "deprecatedMessage": "since v4.4.0\nUse the `max` property instead."
         },
         {
           "name": "displayFormat",
@@ -2505,13 +2559,6 @@
           "description": "The prompt symbol to use for unfilled parts of the mask.",
           "type": "string"
         },
-        {
-          "name": "invalid",
-          "attribute": "invalid",
-          "description": "Controls the validity of the control.",
-          "type": "boolean",
-          "default": "false"
-        },
         {
           "name": "styles",
           "type": "CSSResult",
@@ -2523,19 +2570,6 @@
           "description": "The value of the input.",
           "type": "Date | null"
         },
-        {
-          "name": "dir",
-          "attribute": "dir",
-          "description": "The direction attribute of the control.",
-          "type": "Direction",
-          "default": "\"auto\""
-        },
-        {
-          "name": "name",
-          "attribute": "name",
-          "description": "The name attribute of the control.",
-          "type": "string"
-        },
         {
           "name": "outlined",
           "attribute": "outlined",
@@ -2544,16 +2578,9 @@
           "default": "false"
         },
         {
-          "name": "required",
-          "attribute": "required",
-          "description": "Makes the control a required field.",
-          "type": "boolean",
-          "default": "false"
-        },
-        {
-          "name": "disabled",
-          "attribute": "disabled",
-          "description": "Makes the control a disabled field.",
+          "name": "readOnly",
+          "attribute": "readOnly",
+          "description": "Makes the control a readonly field.",
           "type": "boolean",
           "default": "false"
         },
@@ -2562,7 +2589,7 @@
           "attribute": "readonly",
           "description": "Makes the control a readonly field.",
           "type": "boolean",
-          "default": "false"
+          "deprecatedMessage": "since v4.4.0\nUse the `readOnly` property instead."
         },
         {
           "name": "placeholder",
@@ -2576,6 +2603,54 @@
           "description": "The label for the control.",
           "type": "string"
         },
+        {
+          "name": "required",
+          "attribute": "required",
+          "description": "Makes the control a required field in a form context.",
+          "type": "boolean",
+          "default": "false"
+        },
+        {
+          "name": "formAssociated",
+          "type": "true",
+          "default": "true"
+        },
+        {
+          "name": "name",
+          "attribute": "name",
+          "description": "The name attribute of the control.",
+          "type": "string"
+        },
+        {
+          "name": "form",
+          "description": "Returns the HTMLFormElement associated with this element."
+        },
+        {
+          "name": "validity",
+          "description": "Returns a ValidityState object which represents the different validity states\nthe element can be in, with respect to constraint validation."
+        },
+        {
+          "name": "validationMessage",
+          "description": "A string containing the validation message of this element."
+        },
+        {
+          "name": "willValidate",
+          "description": "A boolean value which returns true if the element is a submittable element\nthat is a candidate for constraint validation."
+        },
+        {
+          "name": "disabled",
+          "attribute": "disabled",
+          "description": "The disabled state of the component",
+          "type": "boolean",
+          "default": "false"
+        },
+        {
+          "name": "invalid",
+          "attribute": "invalid",
+          "description": "Control the validity of the control.",
+          "type": "boolean",
+          "default": "false"
+        },
         {
           "name": "size",
           "attribute": "size",
@@ -3289,7 +3364,9 @@
           "name": "",
           "description": "Default slot for the form."
         }
-      ]
+      ],
+      "deprecated": true,
+      "deprecatedMessage": "since version 4.4.0\nUse the native `<form>` element instead."
     },
     {
       "name": "igc-icon",
@@ -3382,20 +3459,26 @@
           "type": "string"
         },
         {
-          "name": "invalid",
-          "description": "Controls the validity of the control.",
-          "type": "boolean",
-          "default": "false"
+          "name": "minLength",
+          "description": "The minimum string length required by the control.",
+          "type": "number"
         },
         {
           "name": "minlength",
           "description": "The minlength attribute of the control.",
+          "type": "number",
+          "deprecatedMessage": "since v4.4.0\nUse the `minLength` property instead."
+        },
+        {
+          "name": "maxLength",
+          "description": "The maximum string length of the control.",
           "type": "number"
         },
         {
           "name": "maxlength",
           "description": "The maxlength attribute of the control.",
-          "type": "number"
+          "type": "number",
+          "deprecatedMessage": "since v4.4.0\nUse the `maxLength` property instead."
         },
         {
           "name": "min",
@@ -3433,17 +3516,6 @@
           "type": "string",
           "default": "\"\""
         },
-        {
-          "name": "dir",
-          "description": "The direction attribute of the control.",
-          "type": "Direction",
-          "default": "\"auto\""
-        },
-        {
-          "name": "name",
-          "description": "The name attribute of the control.",
-          "type": "string"
-        },
         {
           "name": "outlined",
           "description": "Whether the control will have outlined appearance.",
@@ -3451,14 +3523,8 @@
           "default": "false"
         },
         {
-          "name": "required",
-          "description": "Makes the control a required field.",
-          "type": "boolean",
-          "default": "false"
-        },
-        {
-          "name": "disabled",
-          "description": "Makes the control a disabled field.",
+          "name": "readOnly",
+          "description": "Makes the control a readonly field.",
           "type": "boolean",
           "default": "false"
         },
@@ -3466,7 +3532,7 @@
           "name": "readonly",
           "description": "Makes the control a readonly field.",
           "type": "boolean",
-          "default": "false"
+          "deprecatedMessage": "since v4.4.0\nUse the `readOnly` property instead."
         },
         {
           "name": "placeholder",
@@ -3478,6 +3544,29 @@
           "description": "The label for the control.",
           "type": "string"
         },
+        {
+          "name": "required",
+          "description": "Makes the control a required field in a form context.",
+          "type": "boolean",
+          "default": "false"
+        },
+        {
+          "name": "name",
+          "description": "The name attribute of the control.",
+          "type": "string"
+        },
+        {
+          "name": "disabled",
+          "description": "The disabled state of the component",
+          "type": "boolean",
+          "default": "false"
+        },
+        {
+          "name": "invalid",
+          "description": "Control the validity of the control.",
+          "type": "boolean",
+          "default": "false"
+        },
         {
           "name": "size",
           "description": "Determines the size of the component.",
@@ -3511,23 +3600,30 @@
           "type": "string"
         },
         {
-          "name": "invalid",
-          "attribute": "invalid",
-          "description": "Controls the validity of the control.",
-          "type": "boolean",
-          "default": "false"
+          "name": "minLength",
+          "attribute": "minLength",
+          "description": "The minimum string length required by the control.",
+          "type": "number"
         },
         {
           "name": "minlength",
           "attribute": "minlength",
           "description": "The minlength attribute of the control.",
+          "type": "number",
+          "deprecatedMessage": "since v4.4.0\nUse the `minLength` property instead."
+        },
+        {
+          "name": "maxLength",
+          "attribute": "maxLength",
+          "description": "The maximum string length of the control.",
           "type": "number"
         },
         {
           "name": "maxlength",
           "attribute": "maxlength",
           "description": "The maxlength attribute of the control.",
-          "type": "number"
+          "type": "number",
+          "deprecatedMessage": "since v4.4.0\nUse the `maxLength` property instead."
         },
         {
           "name": "min",
@@ -3577,19 +3673,6 @@
           "type": "string",
           "default": "\"\""
         },
-        {
-          "name": "dir",
-          "attribute": "dir",
-          "description": "The direction attribute of the control.",
-          "type": "Direction",
-          "default": "\"auto\""
-        },
-        {
-          "name": "name",
-          "attribute": "name",
-          "description": "The name attribute of the control.",
-          "type": "string"
-        },
         {
           "name": "outlined",
           "attribute": "outlined",
@@ -3598,16 +3681,9 @@
           "default": "false"
         },
         {
-          "name": "required",
-          "attribute": "required",
-          "description": "Makes the control a required field.",
-          "type": "boolean",
-          "default": "false"
-        },
-        {
-          "name": "disabled",
-          "attribute": "disabled",
-          "description": "Makes the control a disabled field.",
+          "name": "readOnly",
+          "attribute": "readOnly",
+          "description": "Makes the control a readonly field.",
           "type": "boolean",
           "default": "false"
         },
@@ -3616,7 +3692,7 @@
           "attribute": "readonly",
           "description": "Makes the control a readonly field.",
           "type": "boolean",
-          "default": "false"
+          "deprecatedMessage": "since v4.4.0\nUse the `readOnly` property instead."
         },
         {
           "name": "placeholder",
@@ -3630,6 +3706,54 @@
           "description": "The label for the control.",
           "type": "string"
         },
+        {
+          "name": "required",
+          "attribute": "required",
+          "description": "Makes the control a required field in a form context.",
+          "type": "boolean",
+          "default": "false"
+        },
+        {
+          "name": "formAssociated",
+          "type": "true",
+          "default": "true"
+        },
+        {
+          "name": "name",
+          "attribute": "name",
+          "description": "The name attribute of the control.",
+          "type": "string"
+        },
+        {
+          "name": "form",
+          "description": "Returns the HTMLFormElement associated with this element."
+        },
+        {
+          "name": "validity",
+          "description": "Returns a ValidityState object which represents the different validity states\nthe element can be in, with respect to constraint validation."
+        },
+        {
+          "name": "validationMessage",
+          "description": "A string containing the validation message of this element."
+        },
+        {
+          "name": "willValidate",
+          "description": "A boolean value which returns true if the element is a submittable element\nthat is a candidate for constraint validation."
+        },
+        {
+          "name": "disabled",
+          "attribute": "disabled",
+          "description": "The disabled state of the component",
+          "type": "boolean",
+          "default": "false"
+        },
+        {
+          "name": "invalid",
+          "attribute": "invalid",
+          "description": "Control the validity of the control.",
+          "type": "boolean",
+          "default": "false"
+        },
         {
           "name": "size",
           "attribute": "size",
@@ -3844,28 +3968,11 @@
           "description": "The prompt symbol to use for unfilled parts of the mask.",
           "type": "string"
         },
-        {
-          "name": "invalid",
-          "description": "Controls the validity of the control.",
-          "type": "boolean",
-          "default": "false"
-        },
         {
           "name": "value",
           "description": "The value of the input.\n\nRegardless of the currently set `value-mode`, an empty value will return an empty string.",
           "type": "string"
         },
-        {
-          "name": "dir",
-          "description": "The direction attribute of the control.",
-          "type": "Direction",
-          "default": "\"auto\""
-        },
-        {
-          "name": "name",
-          "description": "The name attribute of the control.",
-          "type": "string"
-        },
         {
           "name": "outlined",
           "description": "Whether the control will have outlined appearance.",
@@ -3873,14 +3980,8 @@
           "default": "false"
         },
         {
-          "name": "required",
-          "description": "Makes the control a required field.",
-          "type": "boolean",
-          "default": "false"
-        },
-        {
-          "name": "disabled",
-          "description": "Makes the control a disabled field.",
+          "name": "readOnly",
+          "description": "Makes the control a readonly field.",
           "type": "boolean",
           "default": "false"
         },
@@ -3888,7 +3989,7 @@
           "name": "readonly",
           "description": "Makes the control a readonly field.",
           "type": "boolean",
-          "default": "false"
+          "deprecatedMessage": "since v4.4.0\nUse the `readOnly` property instead."
         },
         {
           "name": "placeholder",
@@ -3900,6 +4001,29 @@
           "description": "The label for the control.",
           "type": "string"
         },
+        {
+          "name": "required",
+          "description": "Makes the control a required field in a form context.",
+          "type": "boolean",
+          "default": "false"
+        },
+        {
+          "name": "name",
+          "description": "The name attribute of the control.",
+          "type": "string"
+        },
+        {
+          "name": "disabled",
+          "description": "The disabled state of the component",
+          "type": "boolean",
+          "default": "false"
+        },
+        {
+          "name": "invalid",
+          "description": "Control the validity of the control.",
+          "type": "boolean",
+          "default": "false"
+        },
         {
           "name": "size",
           "description": "Determines the size of the component.",
@@ -3932,13 +4056,6 @@
           "description": "The prompt symbol to use for unfilled parts of the mask.",
           "type": "string"
         },
-        {
-          "name": "invalid",
-          "attribute": "invalid",
-          "description": "Controls the validity of the control.",
-          "type": "boolean",
-          "default": "false"
-        },
         {
           "name": "styles",
           "type": "CSSResult",
@@ -3950,19 +4067,6 @@
           "description": "The value of the input.\n\nRegardless of the currently set `value-mode`, an empty value will return an empty string.",
           "type": "string"
         },
-        {
-          "name": "dir",
-          "attribute": "dir",
-          "description": "The direction attribute of the control.",
-          "type": "Direction",
-          "default": "\"auto\""
-        },
-        {
-          "name": "name",
-          "attribute": "name",
-          "description": "The name attribute of the control.",
-          "type": "string"
-        },
         {
           "name": "outlined",
           "attribute": "outlined",
@@ -3971,16 +4075,9 @@
           "default": "false"
         },
         {
-          "name": "required",
-          "attribute": "required",
-          "description": "Makes the control a required field.",
-          "type": "boolean",
-          "default": "false"
-        },
-        {
-          "name": "disabled",
-          "attribute": "disabled",
-          "description": "Makes the control a disabled field.",
+          "name": "readOnly",
+          "attribute": "readOnly",
+          "description": "Makes the control a readonly field.",
           "type": "boolean",
           "default": "false"
         },
@@ -3989,7 +4086,7 @@
           "attribute": "readonly",
           "description": "Makes the control a readonly field.",
           "type": "boolean",
-          "default": "false"
+          "deprecatedMessage": "since v4.4.0\nUse the `readOnly` property instead."
         },
         {
           "name": "placeholder",
@@ -4003,6 +4100,54 @@
           "description": "The label for the control.",
           "type": "string"
         },
+        {
+          "name": "required",
+          "attribute": "required",
+          "description": "Makes the control a required field in a form context.",
+          "type": "boolean",
+          "default": "false"
+        },
+        {
+          "name": "formAssociated",
+          "type": "true",
+          "default": "true"
+        },
+        {
+          "name": "name",
+          "attribute": "name",
+          "description": "The name attribute of the control.",
+          "type": "string"
+        },
+        {
+          "name": "form",
+          "description": "Returns the HTMLFormElement associated with this element."
+        },
+        {
+          "name": "validity",
+          "description": "Returns a ValidityState object which represents the different validity states\nthe element can be in, with respect to constraint validation."
+        },
+        {
+          "name": "validationMessage",
+          "description": "A string containing the validation message of this element."
+        },
+        {
+          "name": "willValidate",
+          "description": "A boolean value which returns true if the element is a submittable element\nthat is a candidate for constraint validation."
+        },
+        {
+          "name": "disabled",
+          "attribute": "disabled",
+          "description": "The disabled state of the component",
+          "type": "boolean",
+          "default": "false"
+        },
+        {
+          "name": "invalid",
+          "attribute": "invalid",
+          "description": "Control the validity of the control.",
+          "type": "boolean",
+          "default": "false"
+        },
         {
           "name": "size",
           "attribute": "size",
@@ -4702,57 +4847,84 @@
       "name": "igc-radio",
       "path": "./src/components/radio/radio.ts",
       "attributes": [
-        {
-          "name": "name",
-          "description": "The name attribute of the control.",
-          "type": "string"
-        },
         {
           "name": "value",
           "description": "The value attribute of the control.",
           "type": "string"
         },
         {
-          "name": "required",
-          "description": "Makes the control a required field.",
+          "name": "checked",
+          "description": "The checked state of the control.",
           "type": "boolean",
           "default": "false"
         },
         {
-          "name": "checked",
-          "description": "The checked state of the control.",
+          "name": "label-position",
+          "description": "The label position of the radio control.",
+          "type": "\"before\" | \"after\"",
+          "default": "\"after\""
+        },
+        {
+          "name": "required",
+          "description": "Makes the control a required field in a form context.",
           "type": "boolean",
           "default": "false"
         },
+        {
+          "name": "name",
+          "description": "The name attribute of the control.",
+          "type": "string"
+        },
         {
           "name": "disabled",
-          "description": "Disables the radio control.",
+          "description": "The disabled state of the component",
           "type": "boolean",
           "default": "false"
         },
         {
           "name": "invalid",
-          "description": "Controls the validity of the control.",
+          "description": "Control the validity of the control.",
           "type": "boolean",
           "default": "false"
+        }
+      ],
+      "properties": [
+        {
+          "name": "tagName",
+          "type": "\"igc-radio\"",
+          "default": "\"igc-radio\""
         },
         {
-          "name": "label-position",
+          "name": "value",
+          "attribute": "value",
+          "description": "The value attribute of the control.",
+          "type": "string"
+        },
+        {
+          "name": "checked",
+          "attribute": "checked",
+          "description": "The checked state of the control.",
+          "type": "boolean",
+          "default": "false"
+        },
+        {
+          "name": "labelPosition",
+          "attribute": "label-position",
           "description": "The label position of the radio control.",
           "type": "\"before\" | \"after\"",
           "default": "\"after\""
         },
         {
-          "name": "aria-labelledby",
-          "description": "Sets the aria-labelledby attribute for the radio control.",
-          "type": "string"
-        }
-      ],
-      "properties": [
+          "name": "required",
+          "attribute": "required",
+          "description": "Makes the control a required field in a form context.",
+          "type": "boolean",
+          "default": "false"
+        },
         {
-          "name": "tagName",
-          "type": "\"igc-radio\"",
-          "default": "\"igc-radio\""
+          "name": "formAssociated",
+          "type": "true",
+          "default": "true"
         },
         {
           "name": "name",
@@ -4761,51 +4933,34 @@
           "type": "string"
         },
         {
-          "name": "value",
-          "attribute": "value",
-          "description": "The value attribute of the control.",
-          "type": "string"
+          "name": "form",
+          "description": "Returns the HTMLFormElement associated with this element."
+        },
+        {
+          "name": "validity",
+          "description": "Returns a ValidityState object which represents the different validity states\nthe element can be in, with respect to constraint validation."
         },
         {
-          "name": "required",
-          "attribute": "required",
-          "description": "Makes the control a required field.",
-          "type": "boolean",
-          "default": "false"
+          "name": "validationMessage",
+          "description": "A string containing the validation message of this element."
         },
         {
-          "name": "checked",
-          "attribute": "checked",
-          "description": "The checked state of the control.",
-          "type": "boolean",
-          "default": "false"
+          "name": "willValidate",
+          "description": "A boolean value which returns true if the element is a submittable element\nthat is a candidate for constraint validation."
         },
         {
           "name": "disabled",
           "attribute": "disabled",
-          "description": "Disables the radio control.",
+          "description": "The disabled state of the component",
           "type": "boolean",
           "default": "false"
         },
         {
           "name": "invalid",
           "attribute": "invalid",
-          "description": "Controls the validity of the control.",
+          "description": "Control the validity of the control.",
           "type": "boolean",
           "default": "false"
-        },
-        {
-          "name": "labelPosition",
-          "attribute": "label-position",
-          "description": "The label position of the radio control.",
-          "type": "\"before\" | \"after\"",
-          "default": "\"after\""
-        },
-        {
-          "name": "ariaLabelledby",
-          "attribute": "aria-labelledby",
-          "description": "Sets the aria-labelledby attribute for the radio control.",
-          "type": "string"
         }
       ],
       "events": [
@@ -4901,11 +5056,6 @@
           "type": "number",
           "default": "1"
         },
-        {
-          "name": "name",
-          "description": "The name attribute of the control",
-          "type": "string"
-        },
         {
           "name": "label",
           "description": "The label of the control.",
@@ -4923,14 +5073,14 @@
           "default": "0"
         },
         {
-          "name": "disabled",
-          "description": "Sets the disabled state of the component",
+          "name": "hover-preview",
+          "description": "Sets hover preview behavior for the component",
           "type": "boolean",
           "default": "false"
         },
         {
-          "name": "hover-preview",
-          "description": "Sets hover preview behavior for the component",
+          "name": "readOnly",
+          "description": "Makes the control a readonly field.",
           "type": "boolean",
           "default": "false"
         },
@@ -4938,7 +5088,7 @@
           "name": "readonly",
           "description": "Sets the readonly state of the component",
           "type": "boolean",
-          "default": "false"
+          "deprecatedMessage": "since v4.4.0\nUse the `readOnly` property instead."
         },
         {
           "name": "single",
@@ -4946,6 +5096,23 @@
           "type": "boolean",
           "default": "false"
         },
+        {
+          "name": "name",
+          "description": "The name attribute of the control.",
+          "type": "string"
+        },
+        {
+          "name": "disabled",
+          "description": "The disabled state of the component",
+          "type": "boolean",
+          "default": "false"
+        },
+        {
+          "name": "invalid",
+          "description": "Control the validity of the control.",
+          "type": "boolean",
+          "default": "false"
+        },
         {
           "name": "size",
           "description": "Determines the size of the component.",
@@ -4978,12 +5145,6 @@
           "type": "number",
           "default": "1"
         },
-        {
-          "name": "name",
-          "attribute": "name",
-          "description": "The name attribute of the control",
-          "type": "string"
-        },
         {
           "name": "label",
           "attribute": "label",
@@ -5004,16 +5165,16 @@
           "default": "0"
         },
         {
-          "name": "disabled",
-          "attribute": "disabled",
-          "description": "Sets the disabled state of the component",
+          "name": "hoverPreview",
+          "attribute": "hover-preview",
+          "description": "Sets hover preview behavior for the component",
           "type": "boolean",
           "default": "false"
         },
         {
-          "name": "hoverPreview",
-          "attribute": "hover-preview",
-          "description": "Sets hover preview behavior for the component",
+          "name": "readOnly",
+          "attribute": "readOnly",
+          "description": "Makes the control a readonly field.",
           "type": "boolean",
           "default": "false"
         },
@@ -5022,7 +5183,7 @@
           "attribute": "readonly",
           "description": "Sets the readonly state of the component",
           "type": "boolean",
-          "default": "false"
+          "deprecatedMessage": "since v4.4.0\nUse the `readOnly` property instead."
         },
         {
           "name": "single",
@@ -5031,6 +5192,47 @@
           "type": "boolean",
           "default": "false"
         },
+        {
+          "name": "formAssociated",
+          "type": "true",
+          "default": "true"
+        },
+        {
+          "name": "name",
+          "attribute": "name",
+          "description": "The name attribute of the control.",
+          "type": "string"
+        },
+        {
+          "name": "form",
+          "description": "Returns the HTMLFormElement associated with this element."
+        },
+        {
+          "name": "validity",
+          "description": "Returns a ValidityState object which represents the different validity states\nthe element can be in, with respect to constraint validation."
+        },
+        {
+          "name": "validationMessage",
+          "description": "A string containing the validation message of this element."
+        },
+        {
+          "name": "willValidate",
+          "description": "A boolean value which returns true if the element is a submittable element\nthat is a candidate for constraint validation."
+        },
+        {
+          "name": "disabled",
+          "attribute": "disabled",
+          "description": "The disabled state of the component",
+          "type": "boolean",
+          "default": "false"
+        },
+        {
+          "name": "invalid",
+          "attribute": "invalid",
+          "description": "Control the validity of the control.",
+          "type": "boolean",
+          "default": "false"
+        },
         {
           "name": "size",
           "attribute": "size",
@@ -5218,6 +5420,11 @@
           "description": "Returns the text of the item without the prefix and suffix content.",
           "type": "string"
         },
+        {
+          "name": "tagName",
+          "type": "\"igc-select-item\"",
+          "default": "\"igc-select-item\""
+        },
         {
           "name": "styles",
           "type": "CSSResult",
@@ -5289,29 +5496,6 @@
           "description": "The value attribute of the control.",
           "type": "string | undefined"
         },
-        {
-          "name": "name",
-          "description": "The name attribute of the control.",
-          "type": "string"
-        },
-        {
-          "name": "disabled",
-          "description": "The disabled attribute of the control.",
-          "type": "boolean",
-          "default": "false"
-        },
-        {
-          "name": "required",
-          "description": "The required attribute of the control.",
-          "type": "boolean",
-          "default": "false"
-        },
-        {
-          "name": "invalid",
-          "description": "The invalid attribute of the control.",
-          "type": "boolean",
-          "default": "false"
-        },
         {
           "name": "outlined",
           "description": "The outlined attribute of the control.",
@@ -5334,10 +5518,27 @@
           "type": "string"
         },
         {
-          "name": "dir",
-          "description": "The direction attribute of the control.",
-          "type": "\"ltr\" | \"rtl\" | \"auto\"",
-          "default": "\"auto\""
+          "name": "required",
+          "description": "Makes the control a required field in a form context.",
+          "type": "boolean",
+          "default": "false"
+        },
+        {
+          "name": "name",
+          "description": "The name attribute of the control.",
+          "type": "string"
+        },
+        {
+          "name": "disabled",
+          "description": "The disabled state of the component",
+          "type": "boolean",
+          "default": "false"
+        },
+        {
+          "name": "invalid",
+          "description": "Control the validity of the control.",
+          "type": "boolean",
+          "default": "false"
         },
         {
           "name": "keep-open-on-select",
@@ -5389,33 +5590,6 @@
           "description": "The value attribute of the control.",
           "type": "string | undefined"
         },
-        {
-          "name": "name",
-          "attribute": "name",
-          "description": "The name attribute of the control.",
-          "type": "string"
-        },
-        {
-          "name": "disabled",
-          "attribute": "disabled",
-          "description": "The disabled attribute of the control.",
-          "type": "boolean",
-          "default": "false"
-        },
-        {
-          "name": "required",
-          "attribute": "required",
-          "description": "The required attribute of the control.",
-          "type": "boolean",
-          "default": "false"
-        },
-        {
-          "name": "invalid",
-          "attribute": "invalid",
-          "description": "The invalid attribute of the control.",
-          "type": "boolean",
-          "default": "false"
-        },
         {
           "name": "outlined",
           "attribute": "outlined",
@@ -5442,11 +5616,57 @@
           "type": "string"
         },
         {
-          "name": "dir",
-          "attribute": "dir",
-          "description": "The direction attribute of the control.",
-          "type": "\"ltr\" | \"rtl\" | \"auto\"",
-          "default": "\"auto\""
+          "name": "required",
+          "attribute": "required",
+          "description": "Makes the control a required field in a form context.",
+          "type": "boolean",
+          "default": "false"
+        },
+        {
+          "name": "formAssociated",
+          "type": "true",
+          "default": "true"
+        },
+        {
+          "name": "name",
+          "attribute": "name",
+          "description": "The name attribute of the control.",
+          "type": "string"
+        },
+        {
+          "name": "form",
+          "description": "Returns the HTMLFormElement associated with this element."
+        },
+        {
+          "name": "validity",
+          "description": "Returns a ValidityState object which represents the different validity states\nthe element can be in, with respect to constraint validation."
+        },
+        {
+          "name": "validationMessage",
+          "description": "A string containing the validation message of this element."
+        },
+        {
+          "name": "willValidate",
+          "description": "A boolean value which returns true if the element is a submittable element\nthat is a candidate for constraint validation."
+        },
+        {
+          "name": "disabled",
+          "attribute": "disabled",
+          "description": "The disabled state of the component",
+          "type": "boolean",
+          "default": "false"
+        },
+        {
+          "name": "invalid",
+          "attribute": "invalid",
+          "description": "Control the validity of the control.",
+          "type": "boolean",
+          "default": "false"
+        },
+        {
+          "name": "tagName",
+          "type": "\"igc-select\"",
+          "default": "\"igc-select\""
         },
         {
           "name": "styles",
@@ -5901,14 +6121,21 @@
       "attributes": [
         {
           "name": "value",
-          "description": "The current value of the slider.",
-          "type": "number"
+          "description": "The current value of the component.",
+          "type": "number",
+          "default": "0"
         },
         {
-          "name": "aria-label",
-          "description": "The aria label of the slider thumb.",
+          "name": "name",
+          "description": "The name attribute of the control.",
           "type": "string"
         },
+        {
+          "name": "invalid",
+          "description": "Control the validity of the control.",
+          "type": "boolean",
+          "default": "false"
+        },
         {
           "name": "min",
           "description": "The minimum value of the slider scale. Defaults to 0.",
@@ -5931,7 +6158,7 @@
         },
         {
           "name": "disabled",
-          "description": "Disables the UI interactions of the slider.",
+          "description": "The disabled state of the component",
           "type": "boolean",
           "default": "false"
         },
@@ -6009,15 +6236,44 @@
         {
           "name": "value",
           "attribute": "value",
-          "description": "The current value of the slider.",
-          "type": "number"
+          "description": "The current value of the component.",
+          "type": "number",
+          "default": "0"
+        },
+        {
+          "name": "formAssociated",
+          "type": "true",
+          "default": "true"
         },
         {
-          "name": "ariaLabel",
-          "attribute": "aria-label",
-          "description": "The aria label of the slider thumb.",
+          "name": "name",
+          "attribute": "name",
+          "description": "The name attribute of the control.",
           "type": "string"
         },
+        {
+          "name": "form",
+          "description": "Returns the HTMLFormElement associated with this element."
+        },
+        {
+          "name": "validity",
+          "description": "Returns a ValidityState object which represents the different validity states\nthe element can be in, with respect to constraint validation."
+        },
+        {
+          "name": "validationMessage",
+          "description": "A string containing the validation message of this element."
+        },
+        {
+          "name": "willValidate",
+          "description": "A boolean value which returns true if the element is a submittable element\nthat is a candidate for constraint validation."
+        },
+        {
+          "name": "invalid",
+          "attribute": "invalid",
+          "description": "Control the validity of the control.",
+          "type": "boolean",
+          "default": "false"
+        },
         {
           "name": "styles",
           "type": "CSSResult",
@@ -6050,7 +6306,7 @@
         {
           "name": "disabled",
           "attribute": "disabled",
-          "description": "Disables the UI interactions of the slider.",
+          "description": "The disabled state of the component",
           "type": "boolean",
           "default": "false"
         },
@@ -6334,6 +6590,10 @@
           "name": "contentBody",
           "type": "HTMLElement"
         },
+        {
+          "name": "body",
+          "type": "HTMLElement"
+        },
         {
           "name": "invalid",
           "attribute": "invalid",
@@ -6511,10 +6771,22 @@
           "default": "false"
         },
         {
-          "name": "dir",
-          "description": "The direction attribute of the control.",
-          "type": "Direction",
-          "default": "\"auto\""
+          "name": "vertical-animation",
+          "description": "The animation type when in vertical mode.",
+          "type": "\"none\" | \"grow\" | \"fade\"",
+          "default": "\"grow\""
+        },
+        {
+          "name": "horizontal-animation",
+          "description": "The animation type when in horizontal mode.",
+          "type": "\"none\" | \"fade\" | \"slide\"",
+          "default": "\"slide\""
+        },
+        {
+          "name": "animation-duration",
+          "description": "The animation duration in either vertical or horizontal mode.",
+          "type": "number",
+          "default": "320"
         },
         {
           "name": "title-position",
@@ -6557,11 +6829,25 @@
           "default": "false"
         },
         {
-          "name": "dir",
-          "attribute": "dir",
-          "description": "The direction attribute of the control.",
-          "type": "Direction",
-          "default": "\"auto\""
+          "name": "verticalAnimation",
+          "attribute": "vertical-animation",
+          "description": "The animation type when in vertical mode.",
+          "type": "\"none\" | \"grow\" | \"fade\"",
+          "default": "\"grow\""
+        },
+        {
+          "name": "horizontalAnimation",
+          "attribute": "horizontal-animation",
+          "description": "The animation type when in horizontal mode.",
+          "type": "\"none\" | \"fade\" | \"slide\"",
+          "default": "\"slide\""
+        },
+        {
+          "name": "animationDuration",
+          "attribute": "animation-duration",
+          "description": "The animation duration in either vertical or horizontal mode.",
+          "type": "number",
+          "default": "320"
         },
         {
           "name": "titlePosition",
@@ -7056,12 +7342,6 @@
           "type": "\"multiple\" | \"none\" | \"cascade\"",
           "default": "\"none\""
         },
-        {
-          "name": "dir",
-          "description": "The direction attribute of the control.",
-          "type": "Direction",
-          "default": "\"auto\""
-        },
         {
           "name": "size",
           "description": "Determines the size of the component.",
@@ -7084,13 +7364,6 @@
           "type": "\"multiple\" | \"none\" | \"cascade\"",
           "default": "\"none\""
         },
-        {
-          "name": "dir",
-          "attribute": "dir",
-          "description": "The direction attribute of the control.",
-          "type": "Direction",
-          "default": "\"auto\""
-        },
         {
           "name": "items",
           "description": "Returns all of the tree's items.",