igniteui-webcomponents 3.0.0 → 3.3.0-beta.0

package/custom-elements.json

@@ -1717,6 +1717,302 @@
         }
       ]
     },
+    {
+      "name": "igc-date-time-input",
+      "path": "./src/components/date-time-input/date-time-input.ts",
+      "description": "A date time input is an input field that lets you set and edit the date and time in a chosen input element\nusing customizable display and input formats.",
+      "attributes": [
+        {
+          "name": "input-format",
+          "description": "The date format to apply on the input.",
+          "type": "string"
+        },
+        {
+          "name": "min-value",
+          "description": "The minimum value required for the input to remain valid.",
+          "type": "Date | null"
+        },
+        {
+          "name": "max-value",
+          "description": "The maximum value required for the input to remain valid.",
+          "type": "Date | null"
+        },
+        {
+          "name": "display-format",
+          "description": "Format to display the value in when not editing.\nDefaults to the input format if not set.",
+          "type": "string"
+        },
+        {
+          "name": "spin-loop",
+          "description": "Sets whether to loop over the currently spun segment.",
+          "type": "boolean",
+          "default": "true"
+        },
+        {
+          "name": "locale",
+          "description": "The locale settings used to display the value.",
+          "type": "string",
+          "default": "\"en\""
+        },
+        {
+          "name": "prompt",
+          "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",
+          "type": "boolean",
+          "default": "false"
+        },
+        {
+          "name": "required",
+          "description": "Makes the control a required field.",
+          "type": "boolean",
+          "default": "false"
+        },
+        {
+          "name": "disabled",
+          "description": "Makes the control a disabled field.",
+          "type": "boolean",
+          "default": "false"
+        },
+        {
+          "name": "readonly",
+          "description": "Makes the control a readonly field.",
+          "type": "boolean",
+          "default": "false"
+        },
+        {
+          "name": "placeholder",
+          "description": "The placeholder attribute of the control.",
+          "type": "string"
+        },
+        {
+          "name": "label",
+          "description": "The label for the control.",
+          "type": "string"
+        },
+        {
+          "name": "size",
+          "description": "Determines the size of the component.",
+          "type": "\"small\" | \"medium\" | \"large\"",
+          "default": "\"medium\""
+        }
+      ],
+      "properties": [
+        {
+          "name": "tagName",
+          "type": "\"igc-date-time-input\"",
+          "default": "\"igc-date-time-input\""
+        },
+        {
+          "name": "inputFormat",
+          "attribute": "input-format",
+          "description": "The date format to apply on the input.",
+          "type": "string"
+        },
+        {
+          "name": "minValue",
+          "attribute": "min-value",
+          "description": "The minimum value required for the input to remain valid.",
+          "type": "Date | null"
+        },
+        {
+          "name": "maxValue",
+          "attribute": "max-value",
+          "description": "The maximum value required for the input to remain valid.",
+          "type": "Date | null"
+        },
+        {
+          "name": "displayFormat",
+          "attribute": "display-format",
+          "description": "Format to display the value in when not editing.\nDefaults to the input format if not set.",
+          "type": "string"
+        },
+        {
+          "name": "spinDelta",
+          "description": "Delta values used to increment or decrement each date part on step actions.\nAll values default to `1`.",
+          "type": "DatePartDeltas"
+        },
+        {
+          "name": "spinLoop",
+          "attribute": "spin-loop",
+          "description": "Sets whether to loop over the currently spun segment.",
+          "type": "boolean",
+          "default": "true"
+        },
+        {
+          "name": "locale",
+          "attribute": "locale",
+          "description": "The locale settings used to display the value.",
+          "type": "string",
+          "default": "\"en\""
+        },
+        {
+          "name": "prompt",
+          "attribute": "prompt",
+          "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",
+          "default": "\"styles\""
+        },
+        {
+          "name": "value",
+          "attribute": "value",
+          "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",
+          "type": "boolean",
+          "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.",
+          "type": "boolean",
+          "default": "false"
+        },
+        {
+          "name": "readonly",
+          "attribute": "readonly",
+          "description": "Makes the control a readonly field.",
+          "type": "boolean",
+          "default": "false"
+        },
+        {
+          "name": "placeholder",
+          "attribute": "placeholder",
+          "description": "The placeholder attribute of the control.",
+          "type": "string"
+        },
+        {
+          "name": "label",
+          "attribute": "label",
+          "description": "The label for the control.",
+          "type": "string"
+        },
+        {
+          "name": "size",
+          "attribute": "size",
+          "description": "Determines the size of the component.",
+          "type": "\"small\" | \"medium\" | \"large\"",
+          "default": "\"medium\""
+        }
+      ],
+      "events": [
+        {
+          "name": "igcInput",
+          "description": "Emitted when the control input receives user input."
+        },
+        {
+          "name": "igcChange",
+          "description": "Emitted when the control's checked state changes."
+        },
+        {
+          "name": "igcFocus",
+          "description": "Emitted when the control gains focus."
+        },
+        {
+          "name": "igcBlur",
+          "description": "Emitted when the control loses focus."
+        }
+      ],
+      "slots": [
+        {
+          "name": "prefix",
+          "description": "Renders content before the input."
+        },
+        {
+          "name": "suffix",
+          "description": "Renders content after input."
+        },
+        {
+          "name": "helper-text",
+          "description": "Renders content below the input."
+        }
+      ],
+      "cssParts": [
+        {
+          "name": "container",
+          "description": "The main wrapper that holds all main input elements."
+        },
+        {
+          "name": "input",
+          "description": "The native input element."
+        },
+        {
+          "name": "label",
+          "description": "The native label element."
+        },
+        {
+          "name": "prefix",
+          "description": "The prefix wrapper."
+        },
+        {
+          "name": "suffix",
+          "description": "The suffix wrapper."
+        },
+        {
+          "name": "helper-text",
+          "description": "The helper text wrapper."
+        }
+      ]
+    },
     {
       "name": "igc-dropdown-group",
       "path": "./src/components/dropdown/dropdown-group.ts",
@@ -2065,18 +2361,130 @@
       ]
     },
     {
-      "name": "igc-form",
-      "path": "./src/components/form/form.ts",
-      "description": "The form is a component used to collect user input from\ninteractive controls.",
+      "name": "igc-expansion-panel",
+      "path": "./src/components/expansion-panel/expansion-panel.ts",
+      "description": "The Expansion Panel Component provides a way to display information in a toggleable way -\ncompact summary view containing title and description and expanded detail view containing\nadditional content to the summary header.",
       "attributes": [
         {
-          "name": "novalidate",
-          "description": "Specifies if form data validation should be skipped on submit.",
+          "name": "open",
+          "description": "Indicates whether the contents of the control should be visible.",
           "type": "boolean",
           "default": "false"
-        }
-      ],
-      "properties": [
+        },
+        {
+          "name": "disabled",
+          "description": "Get/Set whether the expansion panel is disabled. Disabled panels are ignored for user interactions.",
+          "type": "boolean",
+          "default": "false"
+        },
+        {
+          "name": "indicator-position",
+          "description": "The indicator position of the expansion panel.",
+          "type": "\"start\" | \"end\" | \"none\"",
+          "default": "\"start\""
+        }
+      ],
+      "properties": [
+        {
+          "name": "tagName",
+          "type": "\"igc-expansion-panel\"",
+          "default": "\"igc-expansion-panel\""
+        },
+        {
+          "name": "styles",
+          "type": "CSSResult",
+          "default": "\"styles\""
+        },
+        {
+          "name": "open",
+          "attribute": "open",
+          "description": "Indicates whether the contents of the control should be visible.",
+          "type": "boolean",
+          "default": "false"
+        },
+        {
+          "name": "disabled",
+          "attribute": "disabled",
+          "description": "Get/Set whether the expansion panel is disabled. Disabled panels are ignored for user interactions.",
+          "type": "boolean",
+          "default": "false"
+        },
+        {
+          "name": "indicatorPosition",
+          "attribute": "indicator-position",
+          "description": "The indicator position of the expansion panel.",
+          "type": "\"start\" | \"end\" | \"none\"",
+          "default": "\"start\""
+        }
+      ],
+      "events": [
+        {
+          "name": "igcOpening",
+          "description": "Emitted before opening the expansion panel."
+        },
+        {
+          "name": "igcOpened",
+          "description": "Emitted after the expansion panel is opened."
+        },
+        {
+          "name": "igcClosing",
+          "description": "Emitted before closing the expansion panel."
+        },
+        {
+          "name": "igcClosed",
+          "description": "Emitted after the expansion panel is closed."
+        }
+      ],
+      "slots": [
+        {
+          "name": "title",
+          "description": "renders the title of the panel's header"
+        },
+        {
+          "name": "subtitle",
+          "description": "renders the subtitle of the panel's header"
+        },
+        {
+          "name": "indicator",
+          "description": "renders the expand/collapsed indicator"
+        }
+      ],
+      "cssParts": [
+        {
+          "name": "header",
+          "description": "The container of the expansion indicator, title and subtitle."
+        },
+        {
+          "name": "title",
+          "description": "The title container."
+        },
+        {
+          "name": "subtitle",
+          "description": "The subtitle container."
+        },
+        {
+          "name": "indicator",
+          "description": "The indicator container."
+        },
+        {
+          "name": "content",
+          "description": "The expansion panel's content wrapper."
+        }
+      ]
+    },
+    {
+      "name": "igc-form",
+      "path": "./src/components/form/form.ts",
+      "description": "The form is a component used to collect user input from\ninteractive controls.",
+      "attributes": [
+        {
+          "name": "novalidate",
+          "description": "Specifies if form data validation should be skipped on submit.",
+          "type": "boolean",
+          "default": "false"
+        }
+      ],
+      "properties": [
         {
           "name": "tagName",
           "type": "\"igc-form\"",
@@ -2187,12 +2595,6 @@
       "name": "igc-input",
       "path": "./src/components/input/input.ts",
       "attributes": [
-        {
-          "name": "dir",
-          "description": "The direction attribute of the control.",
-          "type": "Direction",
-          "default": "\"auto\""
-        },
         {
           "name": "type",
           "description": "The type attribute of the control.",
@@ -2202,7 +2604,7 @@
         {
           "name": "inputmode",
           "description": "The input mode attribute of the control.",
-          "type": "\"numeric\" | \"email\" | \"search\" | \"tel\" | \"url\" | \"none\" | \"txt\" | \"decimal\""
+          "type": "\"numeric\" | \"none\" | \"email\" | \"search\" | \"tel\" | \"url\" | \"txt\" | \"decimal\""
         },
         {
           "name": "pattern",
@@ -2256,6 +2658,12 @@
           "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.",
@@ -2307,13 +2715,6 @@
           "type": "\"igc-input\"",
           "default": "\"igc-input\""
         },
-        {
-          "name": "dir",
-          "attribute": "dir",
-          "description": "The direction attribute of the control.",
-          "type": "Direction",
-          "default": "\"auto\""
-        },
         {
           "name": "type",
           "attribute": "type",
@@ -2325,7 +2726,7 @@
           "name": "inputmode",
           "attribute": "inputmode",
           "description": "The input mode attribute of the control.",
-          "type": "\"numeric\" | \"email\" | \"search\" | \"tel\" | \"url\" | \"none\" | \"txt\" | \"decimal\""
+          "type": "\"numeric\" | \"none\" | \"email\" | \"search\" | \"tel\" | \"url\" | \"txt\" | \"decimal\""
         },
         {
           "name": "pattern",
@@ -2394,6 +2795,13 @@
           "type": "string",
           "default": "\"\""
         },
+        {
+          "name": "dir",
+          "attribute": "dir",
+          "description": "The direction attribute of the control.",
+          "type": "Direction",
+          "default": "\"auto\""
+        },
         {
           "name": "name",
           "attribute": "name",
@@ -2633,120 +3041,119 @@
       ]
     },
     {
-      "name": "igc-nav-drawer-header-item",
-      "path": "./src/components/nav-drawer/nav-drawer-header-item.ts",
-      "description": "A wrapper for navigation drawer's header.",
-      "properties": [
+      "name": "igc-mask-input",
+      "path": "./src/components/mask-input/mask-input.ts",
+      "description": "A masked input is an input field where a developer can control user input and format the visible value,\nbased on configurable rules",
+      "attributes": [
         {
-          "name": "tagName",
-          "type": "\"igc-nav-drawer-header-item\"",
-          "default": "\"igc-nav-drawer-header-item\""
+          "name": "value-mode",
+          "description": "Dictates the behavior when retrieving the value of the control:\n\n- `raw` will return the clean user input.\n- `withFormatting` will return the value with all literals and prompts.",
+          "type": "\"raw\" | \"withFormatting\"",
+          "default": "\"raw\""
         },
         {
-          "name": "styles",
-          "type": "CSSResult",
-          "default": "\"styles\""
-        }
-      ],
-      "slots": [
+          "name": "mask",
+          "description": "The mask pattern to apply on the input.",
+          "type": "string"
+        },
         {
-          "name": "",
-          "description": "Renders the header content"
-        }
-      ]
-    },
-    {
-      "name": "igc-nav-drawer-item",
-      "path": "./src/components/nav-drawer/nav-drawer-item.ts",
-      "description": "Represents a navigation drawer item.",
-      "attributes": [
+          "name": "prompt",
+          "description": "The prompt symbol to use for unfilled parts of the mask.",
+          "type": "string"
+        },
         {
-          "name": "disabled",
-          "description": "Determines whether the drawer is disabled.",
+          "name": "invalid",
+          "description": "Controls the validity of the control.",
           "type": "boolean",
           "default": "false"
         },
         {
-          "name": "active",
-          "description": "Determines whether the drawer is active.",
+          "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",
           "type": "boolean",
           "default": "false"
-        }
-      ],
-      "properties": [
-        {
-          "name": "tagName",
-          "type": "\"igc-nav-drawer-item\"",
-          "default": "\"igc-nav-drawer-item\""
         },
         {
-          "name": "styles",
-          "type": "CSSResult",
-          "default": "\"styles\""
+          "name": "required",
+          "description": "Makes the control a required field.",
+          "type": "boolean",
+          "default": "false"
         },
         {
           "name": "disabled",
-          "attribute": "disabled",
-          "description": "Determines whether the drawer is disabled.",
+          "description": "Makes the control a disabled field.",
           "type": "boolean",
           "default": "false"
         },
         {
-          "name": "active",
-          "attribute": "active",
-          "description": "Determines whether the drawer is active.",
+          "name": "readonly",
+          "description": "Makes the control a readonly field.",
           "type": "boolean",
           "default": "false"
-        }
-      ],
-      "slots": [
+        },
         {
-          "name": "content",
-          "description": "The content slot for the drawer item."
+          "name": "placeholder",
+          "description": "The placeholder attribute of the control.",
+          "type": "string"
         },
         {
-          "name": "icon",
-          "description": "The slot for the icon of the drawer item."
+          "name": "label",
+          "description": "The label for the control.",
+          "type": "string"
+        },
+        {
+          "name": "size",
+          "description": "Determines the size of the component.",
+          "type": "\"small\" | \"medium\" | \"large\"",
+          "default": "\"medium\""
         }
       ],
-      "cssParts": [
+      "properties": [
         {
-          "name": "base",
-          "description": "The base wrapper of the drawer item."
+          "name": "tagName",
+          "type": "\"igc-mask-input\"",
+          "default": "\"igc-mask-input\""
         },
         {
-          "name": "icon",
-          "description": "The icon container."
+          "name": "valueMode",
+          "attribute": "value-mode",
+          "description": "Dictates the behavior when retrieving the value of the control:\n\n- `raw` will return the clean user input.\n- `withFormatting` will return the value with all literals and prompts.",
+          "type": "\"raw\" | \"withFormatting\"",
+          "default": "\"raw\""
         },
         {
-          "name": "content",
-          "description": "The content container."
-        }
-      ]
-    },
-    {
-      "name": "igc-nav-drawer",
-      "path": "./src/components/nav-drawer/nav-drawer.ts",
-      "description": "Represents a side navigation container that provides\nquick access between views.",
-      "attributes": [
+          "name": "mask",
+          "attribute": "mask",
+          "description": "The mask pattern to apply on the input.",
+          "type": "string"
+        },
         {
-          "name": "position",
-          "description": "The position of the drawer.",
-          "type": "\"start\" | \"end\" | \"top\" | \"bottom\" | \"relative\"",
-          "default": "\"start\""
+          "name": "prompt",
+          "attribute": "prompt",
+          "description": "The prompt symbol to use for unfilled parts of the mask.",
+          "type": "string"
         },
         {
-          "name": "open",
-          "description": "Determines whether the drawer is opened.",
+          "name": "invalid",
+          "attribute": "invalid",
+          "description": "Controls the validity of the control.",
           "type": "boolean",
           "default": "false"
-        }
-      ],
-      "properties": [
-        {
-          "name": "tagName",
-          "type": "\"igc-nav-drawer\"",
-          "default": "\"igc-nav-drawer\""
         },
         {
           "name": "styles",
@@ -2754,15 +3161,261 @@
           "default": "\"styles\""
         },
         {
-          "name": "position",
-          "attribute": "position",
-          "description": "The position of the drawer.",
-          "type": "\"start\" | \"end\" | \"top\" | \"bottom\" | \"relative\"",
-          "default": "\"start\""
+          "name": "value",
+          "attribute": "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": "open",
-          "attribute": "open",
+          "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",
+          "type": "boolean",
+          "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.",
+          "type": "boolean",
+          "default": "false"
+        },
+        {
+          "name": "readonly",
+          "attribute": "readonly",
+          "description": "Makes the control a readonly field.",
+          "type": "boolean",
+          "default": "false"
+        },
+        {
+          "name": "placeholder",
+          "attribute": "placeholder",
+          "description": "The placeholder attribute of the control.",
+          "type": "string"
+        },
+        {
+          "name": "label",
+          "attribute": "label",
+          "description": "The label for the control.",
+          "type": "string"
+        },
+        {
+          "name": "size",
+          "attribute": "size",
+          "description": "Determines the size of the component.",
+          "type": "\"small\" | \"medium\" | \"large\"",
+          "default": "\"medium\""
+        }
+      ],
+      "events": [
+        {
+          "name": "igcInput",
+          "description": "Emitted when the control receives user input"
+        },
+        {
+          "name": "igcChange",
+          "description": "Emitted when an alteration of the control's value is committed by the user"
+        },
+        {
+          "name": "igcFocus",
+          "description": "Emitted when the control gains focus"
+        },
+        {
+          "name": "igcBlur",
+          "description": "Emitted when the control loses focus"
+        }
+      ],
+      "slots": [
+        {
+          "name": "prefix",
+          "description": "Renders content before the input"
+        },
+        {
+          "name": "suffix",
+          "description": "Renders content after the input"
+        },
+        {
+          "name": "helper-text",
+          "description": "Renders content below the input"
+        }
+      ],
+      "cssParts": [
+        {
+          "name": "container",
+          "description": "The main wrapper that holds all main input elements"
+        },
+        {
+          "name": "input",
+          "description": "The native input element"
+        },
+        {
+          "name": "label",
+          "description": "The native label element"
+        },
+        {
+          "name": "prefix",
+          "description": "The prefix wrapper"
+        },
+        {
+          "name": "suffix",
+          "description": "The suffix wrapper"
+        },
+        {
+          "name": "helper-text",
+          "description": "The helper text wrapper"
+        }
+      ]
+    },
+    {
+      "name": "igc-nav-drawer-header-item",
+      "path": "./src/components/nav-drawer/nav-drawer-header-item.ts",
+      "description": "A wrapper for navigation drawer's header.",
+      "properties": [
+        {
+          "name": "tagName",
+          "type": "\"igc-nav-drawer-header-item\"",
+          "default": "\"igc-nav-drawer-header-item\""
+        },
+        {
+          "name": "styles",
+          "type": "CSSResult",
+          "default": "\"styles\""
+        }
+      ],
+      "slots": [
+        {
+          "name": "",
+          "description": "Renders the header content"
+        }
+      ]
+    },
+    {
+      "name": "igc-nav-drawer-item",
+      "path": "./src/components/nav-drawer/nav-drawer-item.ts",
+      "description": "Represents a navigation drawer item.",
+      "attributes": [
+        {
+          "name": "disabled",
+          "description": "Determines whether the drawer is disabled.",
+          "type": "boolean",
+          "default": "false"
+        },
+        {
+          "name": "active",
+          "description": "Determines whether the drawer is active.",
+          "type": "boolean",
+          "default": "false"
+        }
+      ],
+      "properties": [
+        {
+          "name": "tagName",
+          "type": "\"igc-nav-drawer-item\"",
+          "default": "\"igc-nav-drawer-item\""
+        },
+        {
+          "name": "styles",
+          "type": "CSSResult",
+          "default": "\"styles\""
+        },
+        {
+          "name": "disabled",
+          "attribute": "disabled",
+          "description": "Determines whether the drawer is disabled.",
+          "type": "boolean",
+          "default": "false"
+        },
+        {
+          "name": "active",
+          "attribute": "active",
+          "description": "Determines whether the drawer is active.",
+          "type": "boolean",
+          "default": "false"
+        }
+      ],
+      "slots": [
+        {
+          "name": "content",
+          "description": "The content slot for the drawer item."
+        },
+        {
+          "name": "icon",
+          "description": "The slot for the icon of the drawer item."
+        }
+      ],
+      "cssParts": [
+        {
+          "name": "base",
+          "description": "The base wrapper of the drawer item."
+        },
+        {
+          "name": "icon",
+          "description": "The icon container."
+        },
+        {
+          "name": "content",
+          "description": "The content container."
+        }
+      ]
+    },
+    {
+      "name": "igc-nav-drawer",
+      "path": "./src/components/nav-drawer/nav-drawer.ts",
+      "description": "Represents a side navigation container that provides\nquick access between views.",
+      "attributes": [
+        {
+          "name": "position",
+          "description": "The position of the drawer.",
+          "type": "\"start\" | \"end\" | \"top\" | \"bottom\" | \"relative\"",
+          "default": "\"start\""
+        },
+        {
+          "name": "open",
+          "description": "Determines whether the drawer is opened.",
+          "type": "boolean",
+          "default": "false"
+        }
+      ],
+      "properties": [
+        {
+          "name": "tagName",
+          "type": "\"igc-nav-drawer\"",
+          "default": "\"igc-nav-drawer\""
+        },
+        {
+          "name": "styles",
+          "type": "CSSResult",
+          "default": "\"styles\""
+        },
+        {
+          "name": "position",
+          "attribute": "position",
+          "description": "The position of the drawer.",
+          "type": "\"start\" | \"end\" | \"top\" | \"bottom\" | \"relative\"",
+          "default": "\"start\""
+        },
+        {
+          "name": "open",
+          "attribute": "open",
           "description": "Determines whether the drawer is opened.",
           "type": "boolean",
           "default": "false"
@@ -4382,27 +5035,236 @@
       ]
     },
     {
-      "name": "igc-toast",
-      "path": "./src/components/toast/toast.ts",
-      "description": "A toast component is used to show a notification",
-      "attributes": [
-        {
-          "name": "open",
-          "description": "Determines whether the toast is opened.",
-          "type": "boolean",
-          "default": "false"
-        },
+      "name": "igc-tab-panel",
+      "path": "./src/components/tabs/tab-panel.ts",
+      "description": "Represents the content of a tab",
+      "properties": [
         {
-          "name": "display-time",
-          "description": "Determines the time after which the toast will close",
-          "type": "number",
-          "default": "4000"
+          "name": "tagName",
+          "type": "\"igc-tab-panel\"",
+          "default": "\"igc-tab-panel\""
         },
         {
-          "name": "keep-open",
-          "description": "Determines whether the toast is closed automatically or not.",
-          "type": "boolean",
-          "default": "false"
+          "name": "styles",
+          "type": "CSSResult",
+          "default": "\"styles\""
+        }
+      ],
+      "slots": [
+        {
+          "name": "",
+          "description": "Renders the content."
+        }
+      ]
+    },
+    {
+      "name": "igc-tab",
+      "path": "./src/components/tabs/tab.ts",
+      "description": "Represents the tab header.",
+      "attributes": [
+        {
+          "name": "panel",
+          "description": "The id of the tab panel which will be controlled by the tab.",
+          "type": "string",
+          "default": "\"\""
+        },
+        {
+          "name": "selected",
+          "description": "Determines whether the tab is selected.",
+          "type": "boolean",
+          "default": "false"
+        },
+        {
+          "name": "disabled",
+          "description": "Determines whether the tab is disabled.",
+          "type": "boolean",
+          "default": "false"
+        }
+      ],
+      "properties": [
+        {
+          "name": "tagName",
+          "type": "\"igc-tab\"",
+          "default": "\"igc-tab\""
+        },
+        {
+          "name": "styles",
+          "type": "CSSResult",
+          "default": "\"styles\""
+        },
+        {
+          "name": "panel",
+          "attribute": "panel",
+          "description": "The id of the tab panel which will be controlled by the tab.",
+          "type": "string",
+          "default": "\"\""
+        },
+        {
+          "name": "selected",
+          "attribute": "selected",
+          "description": "Determines whether the tab is selected.",
+          "type": "boolean",
+          "default": "false"
+        },
+        {
+          "name": "disabled",
+          "attribute": "disabled",
+          "description": "Determines whether the tab is disabled.",
+          "type": "boolean",
+          "default": "false"
+        }
+      ],
+      "slots": [
+        {
+          "name": "prefix",
+          "description": "Renders before the tab header content."
+        },
+        {
+          "name": "",
+          "description": "Renders the tab header content."
+        },
+        {
+          "name": "suffix",
+          "description": "Renders after the tab header content."
+        }
+      ],
+      "cssParts": [
+        {
+          "name": "content",
+          "description": "The content wrapper."
+        },
+        {
+          "name": "prefix",
+          "description": "The prefix wrapper."
+        },
+        {
+          "name": "suffix",
+          "description": "The suffix wrapper."
+        }
+      ]
+    },
+    {
+      "name": "igc-tabs",
+      "path": "./src/components/tabs/tabs.ts",
+      "description": "Represents tabs component",
+      "attributes": [
+        {
+          "name": "alignment",
+          "description": "Sets the alignment for the tab headers",
+          "type": "\"start\" | \"end\" | \"center\" | \"justify\"",
+          "default": "\"start\""
+        },
+        {
+          "name": "activation",
+          "description": "Determines the tab activation. When set to auto,\nthe tab is instantly selected while navigating with the Left/Right Arrows, Home or End keys\nand the corresponding panel is displayed.\nWhen set to manual, the tab is only focused. The selection happens after pressing Space or Enter.",
+          "type": "\"auto\" | \"manual\"",
+          "default": "\"auto\""
+        }
+      ],
+      "properties": [
+        {
+          "name": "tagName",
+          "type": "\"igc-tabs\"",
+          "default": "\"igc-tabs\""
+        },
+        {
+          "name": "styles",
+          "type": "CSSResult",
+          "default": "\"styles\""
+        },
+        {
+          "name": "selected",
+          "description": "Returns the currently selected tab.",
+          "type": "string"
+        },
+        {
+          "name": "alignment",
+          "attribute": "alignment",
+          "description": "Sets the alignment for the tab headers",
+          "type": "\"start\" | \"end\" | \"center\" | \"justify\"",
+          "default": "\"start\""
+        },
+        {
+          "name": "activation",
+          "attribute": "activation",
+          "description": "Determines the tab activation. When set to auto,\nthe tab is instantly selected while navigating with the Left/Right Arrows, Home or End keys\nand the corresponding panel is displayed.\nWhen set to manual, the tab is only focused. The selection happens after pressing Space or Enter.",
+          "type": "\"auto\" | \"manual\"",
+          "default": "\"auto\""
+        }
+      ],
+      "events": [
+        {
+          "name": "igcChange",
+          "description": "Emitted when the selected tab changes."
+        }
+      ],
+      "slots": [
+        {
+          "name": "",
+          "description": "Renders the tab header."
+        },
+        {
+          "name": "panel",
+          "description": "Renders the tab content."
+        }
+      ],
+      "cssParts": [
+        {
+          "name": "headers",
+          "description": "The wrapper of the tabs including the headers content and the scroll buttons."
+        },
+        {
+          "name": "headers-content",
+          "description": "The container for the tab headers."
+        },
+        {
+          "name": "headers-wrapper",
+          "description": "The wrapper for the tab headers and the selected indicator."
+        },
+        {
+          "name": "headers-scroll",
+          "description": "The container for the headers."
+        },
+        {
+          "name": "selected-indicator",
+          "description": "The selected indicator."
+        },
+        {
+          "name": "start-scroll-button",
+          "description": "The start scroll button displayed when the tabs overflow."
+        },
+        {
+          "name": "end-scroll-button",
+          "description": "The end scroll button displayed when the tabs overflow."
+        },
+        {
+          "name": "content",
+          "description": "The container for the tabs content."
+        }
+      ]
+    },
+    {
+      "name": "igc-toast",
+      "path": "./src/components/toast/toast.ts",
+      "description": "A toast component is used to show a notification",
+      "attributes": [
+        {
+          "name": "open",
+          "description": "Determines whether the toast is opened.",
+          "type": "boolean",
+          "default": "false"
+        },
+        {
+          "name": "display-time",
+          "description": "Determines the time after which the toast will close",
+          "type": "number",
+          "default": "4000"
+        },
+        {
+          "name": "keep-open",
+          "description": "Determines whether the toast is closed automatically or not.",
+          "type": "boolean",
+          "default": "false"
         }
       ],
       "properties": [
@@ -4438,6 +5300,279 @@
     {
       "name": "test-popper",
       "path": "./src/components/toggle/toggle.spec.ts"
+    },
+    {
+      "name": "igc-tree-item",
+      "path": "./src/components/tree/tree-item.ts",
+      "description": "The tree-item component represents a child item of the tree component or another tree item.",
+      "attributes": [
+        {
+          "name": "label",
+          "description": "The tree item label.",
+          "type": "string",
+          "default": "\"\""
+        },
+        {
+          "name": "expanded",
+          "description": "The tree item expansion state.",
+          "type": "boolean",
+          "default": "false"
+        },
+        {
+          "name": "active",
+          "description": "Marks the item as the tree's active item.",
+          "type": "boolean",
+          "default": "false"
+        },
+        {
+          "name": "disabled",
+          "description": "Get/Set whether the tree item is disabled. Disabled items are ignored for user interactions.",
+          "type": "boolean",
+          "default": "false"
+        },
+        {
+          "name": "selected",
+          "description": "The tree item selection state.",
+          "type": "boolean",
+          "default": "false"
+        },
+        {
+          "name": "loading",
+          "description": "To be used for load-on-demand scenarios in order to specify whether the item is loading data.",
+          "type": "boolean",
+          "default": "false"
+        },
+        {
+          "name": "value",
+          "description": "The value entry that the tree item is visualizing. Required for searching through items.",
+          "default": "\"undefined\""
+        }
+      ],
+      "properties": [
+        {
+          "name": "tree",
+          "description": "A reference to the tree the item is a part of.",
+          "type": "IgcTreeComponent | undefined"
+        },
+        {
+          "name": "parent",
+          "description": "The parent item of the current tree item (if any)",
+          "type": "IgcTreeItemComponent | null"
+        },
+        {
+          "name": "level",
+          "description": "The depth of the item, relative to the root.",
+          "type": "number",
+          "default": "0"
+        },
+        {
+          "name": "label",
+          "attribute": "label",
+          "description": "The tree item label.",
+          "type": "string",
+          "default": "\"\""
+        },
+        {
+          "name": "expanded",
+          "attribute": "expanded",
+          "description": "The tree item expansion state.",
+          "type": "boolean",
+          "default": "false"
+        },
+        {
+          "name": "active",
+          "attribute": "active",
+          "description": "Marks the item as the tree's active item.",
+          "type": "boolean",
+          "default": "false"
+        },
+        {
+          "name": "disabled",
+          "attribute": "disabled",
+          "description": "Get/Set whether the tree item is disabled. Disabled items are ignored for user interactions.",
+          "type": "boolean",
+          "default": "false"
+        },
+        {
+          "name": "selected",
+          "attribute": "selected",
+          "description": "The tree item selection state.",
+          "type": "boolean",
+          "default": "false"
+        },
+        {
+          "name": "loading",
+          "attribute": "loading",
+          "description": "To be used for load-on-demand scenarios in order to specify whether the item is loading data.",
+          "type": "boolean",
+          "default": "false"
+        },
+        {
+          "name": "value",
+          "attribute": "value",
+          "description": "The value entry that the tree item is visualizing. Required for searching through items.",
+          "default": "\"undefined\""
+        },
+        {
+          "name": "path",
+          "description": "The full path to the tree item, starting from the top-most ancestor.",
+          "type": "IgcTreeItemComponent[]"
+        }
+      ],
+      "slots": [
+        {
+          "name": "",
+          "description": "Renders nested tree-item component."
+        },
+        {
+          "name": "label",
+          "description": "Renders the tree item container."
+        },
+        {
+          "name": "indicator",
+          "description": "Renders the expand indicator container."
+        },
+        {
+          "name": "loading",
+          "description": "Renders the tree item loading indicator container."
+        },
+        {
+          "name": "indentation",
+          "description": "Renders the container (by default the space) before the tree item."
+        }
+      ],
+      "cssParts": [
+        {
+          "name": "wrapper",
+          "description": "The wrapper for the tree item."
+        },
+        {
+          "name": "selected",
+          "description": "Indicates selected state. Applies to `wrapper`."
+        },
+        {
+          "name": "focused",
+          "description": "Indicates focused state. Applies to `wrapper`."
+        },
+        {
+          "name": "active",
+          "description": "Indicates an active state. Applies to `wrapper`."
+        },
+        {
+          "name": "indicator",
+          "description": "The expand indicator of the tree item."
+        },
+        {
+          "name": "label",
+          "description": "The tree item content."
+        },
+        {
+          "name": "text",
+          "description": "The tree item displayed text."
+        },
+        {
+          "name": "select",
+          "description": "The checkbox of the tree item when selection is enabled."
+        }
+      ]
+    },
+    {
+      "name": "igc-tree",
+      "path": "./src/components/tree/tree.ts",
+      "description": "The tree allows users to represent hierarchical data in a tree-view structure,\nmaintaining parent-child relationships, as well as to define static tree-view structure without a corresponding data model.",
+      "attributes": [
+        {
+          "name": "single-branch-expand",
+          "description": "Whether a single or multiple of a parent's child items can be expanded.",
+          "type": "boolean",
+          "default": "false"
+        },
+        {
+          "name": "selection",
+          "description": "The selection state of the tree.",
+          "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.",
+          "type": "\"small\" | \"medium\" | \"large\"",
+          "default": "\"large\""
+        }
+      ],
+      "properties": [
+        {
+          "name": "singleBranchExpand",
+          "attribute": "single-branch-expand",
+          "description": "Whether a single or multiple of a parent's child items can be expanded.",
+          "type": "boolean",
+          "default": "false"
+        },
+        {
+          "name": "selection",
+          "attribute": "selection",
+          "description": "The selection state of the tree.",
+          "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.",
+          "type": "IgcTreeItemComponent[]"
+        },
+        {
+          "name": "size",
+          "attribute": "size",
+          "description": "Determines the size of the component.",
+          "type": "\"small\" | \"medium\" | \"large\"",
+          "default": "\"large\""
+        }
+      ],
+      "events": [
+        {
+          "name": "igcSelection",
+          "description": "Emitted when item selection is changing, before the selection completes."
+        },
+        {
+          "name": "igcItemCollapsed",
+          "description": "Emitted when tree item is collapsed."
+        },
+        {
+          "name": "igcItemCollapsing",
+          "description": "Emitted when tree item is about to collapse."
+        },
+        {
+          "name": "igcItemExpanded",
+          "description": "Emitted when tree item is expanded."
+        },
+        {
+          "name": "igcItemExpanding",
+          "description": "Emitted when tree item is about to expand."
+        },
+        {
+          "name": "igcItemActivated",
+          "description": "Emitted when the tree's `active` item changes."
+        }
+      ],
+      "slots": [
+        {
+          "name": "",
+          "description": "Renders the tree items inside default slot."
+        }
+      ]
     }
   ]
 }