UNPKG

igniteui-webcomponents

Version:

Ignite UI for Web Components is a complete library of UI components, giving you the ability to build modern web applications using encapsulation and the concept of reusable components in a dependency-free approach.

4 lines 90.3 kB
{ "$schema": "https://raw.githubusercontent.com/microsoft/vscode-html-languageservice/main/docs/customData.schema.json", "version": 1.1, "tags": [{"name":"igc-avatar","description":"An avatar component is used as a representation of a user identity\ntypically in a user profile.\n---\n\n\n### **Slots:**\n - _default_ - Renders an icon inside the default slot.\n\n### **CSS Parts:**\n - **base** - The base wrapper of the avatar.\n- **initials** - The initials wrapper of the avatar.\n- **image** - The image wrapper of the avatar.\n- **icon** - The icon wrapper of the avatar.","attributes":[{"name":"src","description":"The image source to use.","values":[]},{"name":"alt","description":"Alternative text for the image.","values":[]},{"name":"initials","description":"Initials to use as a fallback when no image is available.","values":[]},{"name":"shape","description":"The shape of the avatar.","values":[{"name":"circle"},{"name":"rounded"},{"name":"square"}]}],"references":[]},{"name":"igc-icon","description":"The icon component allows visualizing collections of pre-registered SVG icons.\n---\n","attributes":[{"name":"name","description":"The name of the icon glyph to draw.","values":[]},{"name":"collection","description":"The name of the registered collection for look up of icons.\nDefaults to `default`.","values":[]},{"name":"mirrored","description":"Whether to flip the icon. Useful for RTL layouts.","values":[]}],"references":[]},{"name":"igc-expansion-panel","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.\n---\n\n\n### **Events:**\n - **igcOpening** - Emitted before opening the expansion panel.\n- **igcOpened** - Emitted after the expansion panel is opened.\n- **igcClosing** - Emitted before closing the expansion panel.\n- **igcClosed** - Emitted after the expansion panel is closed.\n\n### **Slots:**\n - _default_ - renders the default content of the panel\n- **title** - renders the title of the panel's header\n- **subtitle** - renders the subtitle of the panel's header\n- **indicator** - renders the expand/collapsed indicator\n- **indicator-expanded** - renders the expanded state of the indicator\n\n### **CSS Parts:**\n - **header** - The container of the expansion indicator, title and subtitle.\n- **title** - The title container.\n- **subtitle** - The subtitle container.\n- **indicator** - The indicator container.\n- **content** - The expansion panel's content wrapper.","attributes":[{"name":"open","description":"Indicates whether the contents of the control should be visible.","values":[]},{"name":"disabled","description":"Get/Set whether the expansion panel is disabled. Disabled panels are ignored for user interactions.","values":[]},{"name":"indicator-position","description":"The indicator position of the expansion panel.","values":[{"name":"start"},{"name":"end"},{"name":"none"}]}],"references":[]},{"name":"igc-accordion","description":"The Accordion is a container-based component that can house multiple expansion panels\nand offers keyboard navigation.\n---\n\n\n### **Slots:**\n - _default_ - Renders the expansion panels inside default slot.","attributes":[{"name":"single-expand","description":"Allows only one panel to be expanded at a time.","values":[]}],"references":[]},{"name":"igc-badge","description":"The badge is a component indicating a status on a related item or an area\nwhere some active indication is required.\n---\n\n\n### **Slots:**\n - _default_ - Default slot for the badge.\n\n### **CSS Parts:**\n - **base** - The base wrapper of the badge.","attributes":[{"name":"variant","description":"The type of badge.","values":[{"name":"StyleVariant"}]},{"name":"outlined","description":"Sets whether to draw an outlined version of the badge.","values":[]},{"name":"shape","description":"The shape of the badge.","values":[{"name":"rounded"},{"name":"square"}]}],"references":[]},{"name":"igc-button","description":"Represents a clickable button, used to submit forms or anywhere in a\ndocument for accessible, standard button functionality.\n---\n\n\n### **Events:**\n \n\n### **Slots:**\n - _default_ - Renders the label of the button.\n- **prefix** - Renders content before the label of the button.\n- **suffix** - Renders content after the label of the button.\n\n### **CSS Parts:**\n - **base** - The native button element of the igc-button component.\n- **prefix** - The prefix container of the igc-button component.\n- **suffix** - The suffix container of the igc-button component.","attributes":[{"name":"variant","description":"Sets the variant of the button.","values":[{"name":"flat"},{"name":"contained"},{"name":"outlined"},{"name":"fab"}]},{"name":"type","description":"The type of the button. Defaults to `button`.","values":[{"name":"button"},{"name":"reset"},{"name":"submit"}]},{"name":"href","description":"The URL the button points to.","values":[]},{"name":"download","description":"Prompts to save the linked URL instead of navigating to it.","values":[]},{"name":"target","description":"Where to display the linked URL, as the name for a browsing context.","values":[{"name":"_blank"},{"name":"_parent"},{"name":"_self"},{"name":"_top"}]},{"name":"rel","description":"The relationship of the linked URL.\nSee https://developer.mozilla.org/en-US/docs/Web/HTML/Link_types","values":[]},{"name":"disabled","description":"The disabled state of the component","values":[]}],"references":[]},{"name":"igc-banner","description":"The `igc-banner` component displays important and concise message(s) for a user to address, that is specific to a page or feature.\n---\n\n\n### **Events:**\n - **igcClosing** - Emitted before closing the banner - when a user interacts (click) with the default action of the banner.\n- **igcClosed** - Emitted after the banner is closed - when a user interacts (click) with the default action of the banner.\n\n### **Slots:**\n - _default_ - Renders the text content of the banner message.\n- **prefix** - Renders additional content at the start of the message block.\n- **actions** - Renders any action elements.\n\n### **CSS Parts:**\n - **base** - The base wrapper of the banner component.\n- **spacer** - The inner wrapper that sets the space around the banner.\n- **message** - The part that holds the text and the illustration.\n- **illustration** - The part that holds the banner icon/illustration.\n- **content** - The part that holds the banner text content.\n- **actions** - The part that holds the banner action buttons.","attributes":[{"name":"open","description":"Determines whether the banner is being shown/hidden.","values":[]}],"references":[]},{"name":"igc-toggle-button","description":"The `igc-toggle-button` wraps a native button element and exposes additional `value` and `selected` properties.\nIt is used in the context of an `igc-button-group` to facilitate the creation of group/toolbar like UX behaviors.\n---\n\n\n### **Slots:**\n - **Renders** - the label/content of the button.\n\n### **CSS Parts:**\n - **toggle** - The native button element.","attributes":[{"name":"value","description":"The value attribute of the control.","values":[]},{"name":"selected","description":"Determines whether the button is selected.","values":[]},{"name":"disabled","description":"Determines whether the button is disabled.","values":[]}],"references":[]},{"name":"igc-button-group","description":"The `igc-button-group` groups a series of `igc-toggle-button`s together, exposing features such as layout and selection.\n---\n\n\n### **Events:**\n - **igcSelect** - Emitted when a button is selected through user interaction.\n- **igcDeselect** - Emitted when a button is deselected through user interaction.\n\n### **Slots:**\n - _default_ - Renders `igc-toggle-button` component.\n\n### **CSS Parts:**\n - **group** - The button group container.","attributes":[{"name":"disabled","description":"Disables all buttons inside the group.","values":[]},{"name":"alignment","description":"Sets the orientation of the buttons in the group.","values":[{"name":"horizontal"},{"name":"vertical"}]},{"name":"selection","description":"Controls the mode of selection for the button group.","values":[{"name":"single"},{"name":"single-required"},{"name":"multiple"}]},{"name":"selectedItems","description":"Gets/Sets the currently selected buttons (their values).","values":[{"name":"string[]"}]}],"references":[]},{"name":"igc-days-view","description":"Instantiate a days view as a separate component in the calendar.\n---\n\n\n### **Events:**\n - **igcActiveDateChange** - Emitted when the active date changes.\n- **igcRangePreviewDateChange** - Emitted when the range preview date changes.\n\n### **CSS Parts:**\n - **days-row** - The days row container.\n- **label** - The label container.\n- **label-inner** - The inner label container.\n- **week-number** - The week number container.\n- **week-number-inner** - The inner week number container.","attributes":[{"name":"hide-leading-days","description":"Whether to show leading days which do not belong to the current month.","values":[]},{"name":"hide-trailing-days","description":"Whether to show trailing days which do not belong to the current month.","values":[]},{"name":"week-day-format","description":"The format of the days. Defaults to narrow.","values":[{"name":"long"},{"name":"short"},{"name":"narrow"}]},{"name":"active","description":"The active state of the component.","values":[]},{"name":"value","description":"The current value of the calendar.\nUsed when selection is set to single","values":[{"name":"Date"}]},{"name":"values","description":"The current values of the calendar.\nUsed when selection is set to multiple of range.","values":[{"name":"Date[]"}]},{"name":"selection","description":"Sets the type of selection in the component.","values":[{"name":"single"},{"name":"multiple"},{"name":"range"}]},{"name":"show-week-numbers","description":"Whether to show the week numbers.","values":[]},{"name":"week-start","description":"Gets/Sets the first day of the week.","values":[{"name":"WeekDays"}]},{"name":"locale","description":"Gets/Sets the locale used for formatting and displaying the dates in the component.","values":[]},{"name":"active-date","description":"Get/Set the date which is shown in view and is highlighted. By default it is the current date.","values":[{"name":"Date"}]}],"references":[]},{"name":"igc-months-view","description":"Instantiate a months view as a separate component in the calendar.\n---\n\n\n### **Events:**\n \n\n### **CSS Parts:**\n - **months-row** - The months row container.\n- **month** - The month container.\n- **month-inner** - The inner month container.","attributes":[{"name":"locale","description":"Sets the locale used for formatting and displaying the dates.","values":[]},{"name":"month-format","description":"The format of the month. Defaults to long.","values":[{"name":"numeric"},{"name":"2-digit"},{"name":"long"},{"name":"short"},{"name":"narrow"}]}],"references":[]},{"name":"igc-years-view","description":"Instantiate a years view as a separate component in the calendar.\n---\n\n\n### **Events:**\n \n\n### **CSS Parts:**\n - **years-row** - The years row container.\n- **year** - The year container.\n- **year-inner** - The inner year container.","attributes":[{"name":"years-per-page","description":"Sets how many years are displayed on a single page.","values":[]}],"references":[]},{"name":"igc-calendar","description":"Represents a calendar that lets users\nto select a date value in a variety of different ways.\n---\n\n\n### **Events:**\n - **igcChange** - Emitted when calendar changes its value.\n\n### **Slots:**\n - _default_ - The default slot for the calendar.\n- **title** - Renders the title of the calendar header.\n\n### **CSS Parts:**\n - **header** - The header element of the calendar.\n- **header-title** - The header title element of the calendar.\n- **header-date** - The header date element of the calendar.\n- **content** - The content element which contains the views and navigation elements of the calendar.\n- **navigation** - The navigation container element of the calendar.\n- **months-navigation** - The months navigation button element of the calendar.\n- **years-navigation** - The years navigation button element of the calendar.\n- **years-range** - The years range element of the calendar.\n- **navigation-buttons** - The navigation buttons container of the calendar.\n- **navigation-button** - Previous/next navigation button of the calendar.\n- **days-view-container** - The days view container element of the calendar.\n- **days-view** - Days view element of the calendar.\n- **months-view** - The months view element of the calendar.\n- **years-view** - The years view element of the calendar.\n- **days-row** - Days row element of the calendar.\n- **label** - Week header label element of the calendar.\n- **week-number** - Week number element of the calendar.\n- **week-number-inner** - Week number inner element of the calendar.\n- **date** - Date element of the calendar.\n- **date-inner** - Date inner element of the calendar.\n- **first** - The first selected date element of the calendar in range selection.\n- **last** - The last selected date element of the calendar in range selection.\n- **inactive** - Inactive date element of the calendar.\n- **hidden** - Hidden date element of the calendar.\n- **weekend** - Weekend date element of the calendar.\n- **range** - Range selected element of the calendar.\n- **special** - Special date element of the calendar.\n- **disabled** - Disabled date element of the calendar.\n- **single** - Single selected date element of the calendar.\n- **preview** - Range selection preview date element of the calendar.\n- **month** - Month element of the calendar.\n- **month-inner** - Month inner element of the calendar.\n- **year** - Year element of the calendar.\n- **year-inner** - Year inner element of the calendar.\n- **selected** - Indicates selected state. Applies to date, month and year elements of the calendar.\n- **current** - Indicates current state. Applies to date, month and year elements of the calendar.","attributes":[{"name":"hide-outside-days","description":"Whether to show the dates that do not belong to the current active month.","values":[]},{"name":"hide-header","description":"Whether to render the calendar header part.\nWhen the calendar selection is set to `multiple` the header is always hidden.","values":[]},{"name":"header-orientation","description":"The orientation of the calendar header.","values":[{"name":"vertical"},{"name":"horizontal"}]},{"name":"orientation","description":"The orientation of the calendar months when more than one month\nis being shown.","values":[{"name":"vertical"},{"name":"horizontal"}]},{"name":"visible-months","description":"The number of months displayed in the days view.","values":[]},{"name":"active-view","description":"The current active view of the component.","values":[{"name":"days"},{"name":"months"},{"name":"years"}]},{"name":"value","description":"The current value of the calendar.\nUsed when selection is set to single","values":[{"name":"Date"}]},{"name":"values","description":"The current values of the calendar.\nUsed when selection is set to multiple of range.","values":[{"name":"Date[]"}]},{"name":"selection","description":"Sets the type of selection in the component.","values":[{"name":"single"},{"name":"multiple"},{"name":"range"}]},{"name":"show-week-numbers","description":"Whether to show the week numbers.","values":[]},{"name":"week-start","description":"Gets/Sets the first day of the week.","values":[{"name":"WeekDays"}]},{"name":"locale","description":"Gets/Sets the locale used for formatting and displaying the dates in the component.","values":[]},{"name":"active-date","description":"Get/Set the date which is shown in view and is highlighted. By default it is the current date.","values":[{"name":"Date"}]}],"references":[]},{"name":"igc-card-actions","description":"A container for card action items like buttons\n---\n\n\n### **Slots:**\n - **start** - Renders items at the beginning of actions area\n- _default_ - Renders items at the middle of actions area\n- **end** - Renders items at the end of actions area","attributes":[{"name":"orientation","description":"The orientation of the actions.","values":[{"name":"vertical"},{"name":"horizontal"}]}],"references":[]},{"name":"igc-card-content","description":"A container for card's text content\n---\n\n\n### **Slots:**\n - _default_ - Renders the card text content","attributes":[],"references":[]},{"name":"igc-card-header","description":"A container for card's header\n---\n\n\n### **Slots:**\n - **thumbnail** - Renders header media like icon\n- **title** - Renders the card title\n- **subtitle** - Renders the card subtitle\n- _default_ - Renders content next to the card title\n\n### **CSS Parts:**\n - **header** - The card header container","attributes":[],"references":[]},{"name":"igc-card-media","description":"A container for card's media - could be an image, gif, video\n---\n\n\n### **Slots:**\n - _default_ - Renders the card media content","attributes":[],"references":[]},{"name":"igc-card","description":"A container which wraps different elements related to a single subject\n---\n\n\n### **Slots:**\n - _default_ - Renders card content","attributes":[{"name":"elevated","description":"Sets card elevated style, otherwise card looks outlined.","values":[]}],"references":[]},{"name":"igc-checkbox","description":"A check box allowing single values to be selected/deselected.\n---\n\n\n### **Events:**\n - **igcChange** - Emitted when the control's checked state changes.\n\n### **Slots:**\n - _default_ - The checkbox label.\n\n### **CSS Parts:**\n - **base** - The base wrapper of the checkbox.\n- **control** - The checkbox input element.\n- **label** - The checkbox label.\n- **indicator** - The checkbox indicator icon.","attributes":[{"name":"indeterminate","description":"Draws the checkbox in indeterminate state.","values":[]},{"name":"required","description":"Makes the control a required field in a form context.","values":[]},{"name":"name","description":"The name attribute of the control.","values":[]},{"name":"disabled","description":"The disabled state of the component","values":[]},{"name":"invalid","description":"Control the validity of the control.","values":[]},{"name":"value","description":"The value attribute of the control.","values":[]},{"name":"checked","description":"The checked state of the control.","values":[]},{"name":"label-position","description":"The label position of the control.","values":[{"name":"before"},{"name":"after"}]}],"references":[]},{"name":"igc-circular-gradient","description":"Used for defining gradient stops in the igc-circular-progress.\nFor each `igc-circular-gradient` defined as `gradient` slot of `igc-circular-progress` element would be created a SVG stop element.\nThe values passed as `color`, `offset` and `opacity` would be set as\n`stop-color`, `offset` and `stop-opacity` of the SVG element without further validations.\n---\n","attributes":[{"name":"offset","description":"Defines where the gradient stop is placed along the gradient vector","values":[]},{"name":"color","description":"Defines the color of the gradient stop","values":[]},{"name":"opacity","description":"Defines the opacity of the gradient stop","values":[]}],"references":[]},{"name":"igc-circular-progress","description":"A circular progress indicator used to express unspecified wait time or display\nthe length of a process.\n---\n\n\n### **Slots:**\n - _default_ - The text area container.\n- **gradient** - Customize the progress bar in order to use a color gradient instead of a solid color. Accepts `igc-circular-gradient` elements.\n\n### **CSS Parts:**\n - **svg** - The igc-circular-progress SVG element.\n- **gradient_start** - The igc-circular-progress linear-gradient start color.\n- **gradient_end** - The igc-circular-progress linear-gradient end color.\n- **track** - The igc-circular-progress ring track area.\n- **fill** - The igc-circular-progress indicator area.\n- **label** - The igc-circular-progress label.\n- **value** - The igc-circular-progress label value.\n- **indeterminate** - The igc-circular-progress indeterminate state.\n- **primary** - The igc-circular-progress primary state.\n- **danger** - The igc-circular-progress error state.\n- **warning** - The igc-circular-progress warning state.\n- **info** - The igc-circular-progress info state.\n- **success** - The igc-circular-progress success state.","attributes":[{"name":"max","description":"Maximum value of the control.","values":[]},{"name":"value","description":"The value of the control.","values":[]},{"name":"variant","description":"The variant of the control.","values":[{"name":"StyleVariant"}]},{"name":"animation-duration","description":"Animation duration in milliseconds.","values":[]},{"name":"indeterminate","description":"The indeterminate state of the control.","values":[]},{"name":"hide-label","description":"Shows/hides the label of the control.","values":[]},{"name":"label-format","description":"Format string for the default label of the control.\nPlaceholders:\n {0} - current value of the control.\n {1} - max value of the control.","values":[]}],"references":[]},{"name":"igc-chip","description":"Chips help people enter information, make selections, filter content, or trigger actions.\n---\n\n\n### **Events:**\n - **igcRemove** - Emits an event when the chip component is removed. Returns the removed chip component.\n- **igcSelect** - Emits event when the chip component is selected/deselected and any related animations and transitions also end.\n\n### **Slots:**\n - _default_ - Renders the chip data.\n- **prefix** - Renders content before the data of the chip.\n- **suffix** - Renders content after the data of the chip.\n\n### **CSS Parts:**\n - **base** - The base wrapper of the chip.\n- **prefix** - The prefix container of the chip.\n- **suffix** - The suffix container of the chip.","attributes":[{"name":"disabled","description":"Sets the disabled state for the chip.","values":[]},{"name":"removable","description":"Defines if the chip is removable or not.","values":[]},{"name":"selectable","description":"Defines if the chip is selectable or not.","values":[]},{"name":"selected","description":"Defines if the chip is selected or not.","values":[]},{"name":"variant","description":"A property that sets the color variant of the chip component.","values":[{"name":"StyleVariant"}]}],"references":[]},{"name":"igc-input","description":"\n---\n\n\n### **Events:**\n - **igcInput** - Emitted when the control input receives user input.\n- **igcChange** - Emitted when the control's checked state changes.\n\n### **Slots:**\n - **prefix** - Renders content before the input.\n- **suffix** - Renders content after input.\n- **helper-text** - Renders content below the input.\n\n### **CSS Parts:**\n - **container** - The main wrapper that holds all main input elements.\n- **input** - The native input element.\n- **label** - The native label element.\n- **prefix** - The prefix wrapper.\n- **suffix** - The suffix wrapper.\n- **helper-text** - The helper text wrapper.","attributes":[{"name":"value","description":"The value of the control.","values":[]},{"name":"type","description":"The type attribute of the control.","values":[{"name":""},{"name":"email"},{"name":"number"},{"name":"password"},{"name":"search"},{"name":"tel"},{"name":"text"},{"name":"url"}]},{"name":"inputmode","description":"The input mode attribute of the control.\nSee [relevant MDN article](https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/inputmode)","values":[]},{"name":"pattern","description":"The pattern attribute of the control.","values":[]},{"name":"minlength","description":"The minimum string length required by the control.","values":[]},{"name":"maxlength","description":"The maximum string length of the control.","values":[]},{"name":"min","description":"The min attribute of the control.","values":[]},{"name":"max","description":"The max attribute of the control.","values":[]},{"name":"step","description":"The step attribute of the control.","values":[]},{"name":"autofocus","description":"The autofocus attribute of the control.","values":[]},{"name":"autocomplete","description":"The autocomplete attribute of the control.","values":[]},{"name":"validate-only","description":"Enables validation rules to be evaluated without restricting user input. This applies to the `maxLength` property for\nstring-type inputs or allows spin buttons to exceed the predefined `min/max` limits for number-type inputs.","values":[]},{"name":"required","description":"Makes the control a required field in a form context.","values":[]},{"name":"name","description":"The name attribute of the control.","values":[]},{"name":"disabled","description":"The disabled state of the component","values":[]},{"name":"invalid","description":"Control the validity of the control.","values":[]},{"name":"outlined","description":"Whether the control will have outlined appearance.","values":[]},{"name":"readonly","description":"Makes the control a readonly field.","values":[]},{"name":"placeholder","description":"The placeholder attribute of the control.","values":[]},{"name":"label","description":"The label for the control.","values":[]}],"references":[]},{"name":"igc-popover","description":"\n---\n\n\n### **Slots:**\n - _default_ - Content of the popover.\n- **anchor** - The element the popover will be anchored to.\n\n### **CSS Parts:**\n - **container** - The container wrapping the slotted content in the popover.","attributes":[{"name":"anchor","description":"Pass an IDREF or an DOM element reference to use as the\nanchor target for the floating element.","values":[{"name":"Element"}]},{"name":"flip","description":"When enabled this changes the placement of the floating element in order to keep it\nin view along the main axis.","values":[]},{"name":"offset","description":"Placement modifier which translates the floating element along the main axis.","values":[]},{"name":"open","description":"The visibility state of the popover component.","values":[]},{"name":"placement","description":"Where to place the floating element relative to the parent anchor element.","values":[{"name":"IgcPlacement"}]},{"name":"same-width","description":"When enabled the floating element will match the width of its parent anchor element.","values":[]},{"name":"shift","description":"When enabled this tries to shift the floating element along the main axis\nkeeping it in view, preventing overflow while maintaining the desired placement.","values":[]}],"references":[]},{"name":"igc-combo","description":"The Combo component is similar to the Select component in that it provides a list of options from which the user can make a selection.\nIn contrast to the Select component, the Combo component displays all options in a virtualized list of items,\nmeaning the combo box can simultaneously show thousands of options, where one or more options can be selected.\nAdditionally, users can create custom item templates, allowing for robust data visualization.\nThe Combo component features case-sensitive filtering, grouping, complex data binding, dynamic addition of values and more.\n---\n\n\n### **Events:**\n - **igcChange** - Emitted when the control's selection has changed.\n- **igcOpening** - Emitted just before the list of options is opened.\n- **igcOpened** - Emitted after the list of options is opened.\n- **igcClosing** - Emitter just before the list of options is closed.\n- **igcClosed** - Emitted after the list of options is closed.\n\n### **Slots:**\n - **prefix** - Renders content before the input of the combo.\n- **suffix** - Renders content after the input of the combo.\n- **header** - Renders a container before the list of options of the combo.\n- **footer** - Renders a container after the list of options of the combo.\n- **helper-text** - Renders content below the input of the combo.\n- **toggle-icon** - Renders content inside the suffix container of the combo.\n- **clear-icon** - Renders content inside the suffix container of the combo.\n\n### **CSS Parts:**\n - **label** - The encapsulated text label of the combo.\n- **input** - The main input field of the combo.\n- **native-input** - The native input of the main input field of the combo.\n- **prefix** - The prefix wrapper of the combo.\n- **suffix** - The suffix wrapper of the combo.\n- **toggle-icon** - The toggle icon wrapper of the combo.\n- **clear-icon** - The clear icon wrapper of the combo.\n- **case-icon** - The case icon wrapper of the combo.\n- **helper-text** - The helper text wrapper of the combo.\n- **search-input** - The search input field of the combo.\n- **list-wrapper** - The list of options wrapper of the combo.\n- **list** - The list of options box of the combo.\n- **item** - Represents each item in the list of options of the combo.\n- **group-header** - Represents each header in the list of options of the combo.\n- **active** - Appended to the item parts list when the item is active of the combo.\n- **selected** - Appended to the item parts list when the item is selected of the combo.\n- **checkbox** - Represents each checkbox of each list item of the combo.\n- **checkbox-indicator** - Represents the checkbox indicator of each list item of the combo.\n- **checked** - Appended to checkbox parts list when checkbox is checked in the combo.\n- **header** - The container holding the header content of the combo.\n- **footer** - The container holding the footer content of the combo.\n- **empty** - The container holding the empty content of the combo.","attributes":[{"name":"outlined","description":"The outlined attribute of the control.","values":[]},{"name":"single-select","description":"Enables single selection mode and moves item filtering to the main input.","values":[]},{"name":"autofocus","description":"The autofocus attribute of the control.","values":[]},{"name":"autofocus-list","description":"Focuses the list of options when the menu opens.","values":[]},{"name":"label","description":"The label attribute of the control.","values":[]},{"name":"placeholder","description":"The placeholder attribute of the control.","values":[]},{"name":"placeholder-search","description":"The placeholder attribute of the search input.","values":[]},{"name":"open","description":"Sets the open state of the component.","values":[]},{"name":"value-key","description":"The key in the data source used when selecting items.","values":[{"name":"Keys<T>"}]},{"name":"display-key","description":"The key in the data source used to display items in the list.","values":[{"name":"Keys<T>"}]},{"name":"group-key","description":"The key in the data source used to group items in the list.","values":[{"name":"Keys<T>"}]},{"name":"group-sorting","description":"Sorts the items in each group by ascending or descending order.","values":[{"name":"asc"},{"name":"desc"},{"name":"none"}]},{"name":"filtering-options","description":"An object that configures the filtering of the combo.","values":[{"name":"FilteringOptions<T>"}]},{"name":"case-sensitive-icon","description":"Enables the case sensitive search icon in the filtering input.","values":[]},{"name":"disable-filtering","description":"Disables the filtering of the list of options.","values":[]},{"name":"value","description":"Returns the current selection as a list of comma separated values,\nrepresented by the value key, when provided.","values":[{"name":"ComboValue<T>[]"}]},{"name":"required","description":"Makes the control a required field in a form context.","values":[]},{"name":"name","description":"The name attribute of the control.","values":[]},{"name":"disabled","description":"The disabled state of the component","values":[]},{"name":"invalid","description":"Control the validity of the control.","values":[]}],"references":[]},{"name":"igc-date-time-input","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.\n---\n\n\n### **Events:**\n - **igcInput** - Emitted when the control input receives user input.\n- **igcChange** - Emitted when the control's checked state changes.\n\n### **Slots:**\n - **prefix** - Renders content before the input.\n- **suffix** - Renders content after input.\n- **helper-text** - Renders content below the input.\n\n### **CSS Parts:**\n - **container** - The main wrapper that holds all main input elements.\n- **input** - The native input element.\n- **label** - The native label element.\n- **prefix** - The prefix wrapper.\n- **suffix** - The suffix wrapper.\n- **helper-text** - The helper text wrapper.","attributes":[{"name":"input-format","description":"The date format to apply on the input.","values":[]},{"name":"value","description":"The value of the input.","values":[{"name":"Date"}]},{"name":"min","description":"The minimum value required for the input to remain valid.","values":[{"name":"Date"}]},{"name":"max","description":"The maximum value required for the input to remain valid.","values":[{"name":"Date"}]},{"name":"display-format","description":"Format to display the value in when not editing.\nDefaults to the input format if not set.","values":[]},{"name":"spin-loop","description":"Sets whether to loop over the currently spun segment.","values":[]},{"name":"locale","description":"The locale settings used to display the value.","values":[]},{"name":"prompt","description":"The prompt symbol to use for unfilled parts of the mask.","values":[]},{"name":"required","description":"Makes the control a required field in a form context.","values":[]},{"name":"name","description":"The name attribute of the control.","values":[]},{"name":"disabled","description":"The disabled state of the component","values":[]},{"name":"invalid","description":"Control the validity of the control.","values":[]},{"name":"outlined","description":"Whether the control will have outlined appearance.","values":[]},{"name":"readonly","description":"Makes the control a readonly field.","values":[]},{"name":"placeholder","description":"The placeholder attribute of the control.","values":[]},{"name":"label","description":"The label for the control.","values":[]}],"references":[]},{"name":"igc-dialog","description":"Represents a Dialog component.\n---\n\n\n### **Events:**\n - **igcClosing** - Emitter just before the dialog is closed.\n- **igcClosed** - Emitted after closing the dialog.\n\n### **Slots:**\n - _default_ - Renders content inside the default slot.\n- **title** - Renders the title of the dialog header.\n- **footer** - Renders the dialog footer.\n\n### **CSS Parts:**\n - **base** - The base wrapper of the dialog.\n- **title** - The title container.\n- **footer** - The footer container.\n- **overlay** - The overlay.","attributes":[{"name":"keep-open-on-escape","description":"Whether the dialog should be kept open when pressing the 'ESCAPE' button.","values":[]},{"name":"close-on-outside-click","description":"Whether the dialog should be closed when clicking outside of it.","values":[]},{"name":"hide-default-action","description":"Whether to hide the default action button for the dialog.\n\nWhen there is projected content in the `footer` slot this property\nhas no effect.","values":[]},{"name":"open","description":"Whether the dialog is opened.","values":[]},{"name":"title","description":"Sets the title of the dialog.","values":[]}],"references":[]},{"name":"igc-focus-trap","description":"\n---\n\n\n### **Slots:**\n - _default_ - The content of the focus trap component","attributes":[{"name":"disabled","description":"Whether to manage focus state for the slotted children.","values":[]}],"references":[]},{"name":"igc-date-picker","description":"igc-date-picker is a feature rich component used for entering a date through manual text input or\nchoosing date values from a calendar dialog that pops up.\n---\n\n\n### **Events:**\n - **igcOpening** - Emitted just before the calendar dropdown is shown.\n- **igcOpened** - Emitted after the calendar dropdown is shown.\n- **igcClosing** - Emitted just before the calendar dropdown is hidden.\n- **igcClosed** - Emitted after the calendar dropdown is hidden.\n- **igcChange** - Emitted when the user modifies and commits the elements's value.\n- **igcInput** - Emitted when when the user types in the element.\n\n### **Slots:**\n - **prefix** - Renders content before the input.\n- **suffix** - Renders content after the input.\n- **helper-text** - Renders content below the input.\n- **title** - Renders content in the calendar title.\n- **clear-icon** - Renders a clear icon template.\n- **calendar-icon** - Renders the icon/content for the calendar picker.\n- **calendar-icon-open** - Renders the icon/content for the picker in open state.\n- **actions** - Renders content in the action part of the picker in open state.\n\n### **CSS Parts:**\n - **label** - The label wrapper that renders content above the target input.\n- **container** - The main wrapper that holds all main input elements.\n- **input** - The native input element.\n- **prefix** - The prefix wrapper.\n- **suffix** - The suffix wrapper.\n- **calendar-icon** - The calendar icon wrapper for closed state.\n- **calendar-icon-open** - The calendar icon wrapper for opened state.\n- **clear-icon** - The clear icon wrapper.\n- **actions** - The actions wrapper.\n- **helper-text** - The helper-text wrapper that renders content below the target input.\n- **header** - The calendar header element.\n- **header-title** - The calendar header title element.\n- **header-date** - The calendar header date element.\n- **calendar-content** - The calendar content element which contains the views and navigation elements.\n- **navigation** - The calendar navigation container element.\n- **months-navigation** - The calendar months navigation button element.\n- **years-navigation** - The calendar years navigation button element.\n- **years-range** - The calendar years range element.\n- **navigation-buttons** - The calendar navigation buttons container.\n- **navigation-button** - The calendar previous/next navigation button.\n- **days-view-container** - The calendar days view container element.\n- **days-view** - The calendar days view element.\n- **months-view** - The calendar months view element.\n- **years-view** - The calendar years view element.\n- **days-row** - The calendar days row element.\n- **calendar-label** - The calendar week header label element.\n- **week-number** - The calendar week number element.\n- **week-number-inner** - The calendar week number inner element.\n- **date** - The calendar date element.\n- **date-inner** - The calendar date inner element.\n- **first** - The calendar first selected date element in range selection.\n- **last** - The calendar last selected date element in range selection.\n- **inactive** - The calendar inactive date element.\n- **hidden** - The calendar hidden date element.\n- **weekend** - The calendar weekend date element.\n- **range** - The calendar range selected element.\n- **special** - The calendar special date element.\n- **disabled** - The calendar disabled date element.\n- **single** - The calendar single selected date element.\n- **preview** - The calendar range selection preview date element.\n- **month** - The calendar month element.\n- **month-inner** - The calendar month inner element.\n- **year** - The calendar year element.\n- **year-inner** - The calendar year inner element.\n- **selected** - The calendar selected state for element(s). Applies to date, month and year elements.\n- **current** - The calendar current state for element(s). Applies to date, month and year elements.","attributes":[{"name":"open","description":"Sets the state of the datepicker dropdown.","values":[]},{"name":"label","description":"The label of the datepicker.","values":[]},{"name":"mode","description":"Determines whether the calendar is opened in a dropdown or a modal dialog","values":[{"name":"dropdown"},{"name":"dialog"}]},{"name":"non-editable","description":"Whether to allow typing in the input.","values":[]},{"name":"readonly","description":"Makes the control a readonly field.","values":[]},{"name":"value","description":"The value of the picker","values":[{"name":"Date"}]},{"name":"min","description":"The minimum value required for the date picker to remain valid.","values":[{"name":"Date"}]},{"name":"max","description":"The maximum value required for the date picker to remain valid.","values":[{"name":"Date"}]},{"name":"header-orientation","description":"The orientation of the calendar header.","values":[{"name":"vertical"},{"name":"horizontal"}]},{"name":"orientation","description":"The orientation of the multiple months displayed in the calendar's days view.","values":[{"name":"vertical"},{"name":"horizontal"}]},{"name":"hide-header","description":"Determines whether the calendar hides its header.","values":[]},{"name":"hide-outside-days","description":"Controls the visibility of the dates that do not belong to the current month.","values":[]},{"name":"outlined","description":"Whether the control will have outlined appearance.","values":[]},{"name":"placeholder","description":"The placeholder attribute of the control.","values":[]},{"name":"visible-months","description":"The number of months displayed in the calendar.","values":[]},{"name":"show-week-numbers","description":"Whether to show the number of the week in the calendar.","values":[]},{"name":"display-format","description":"Format to display the value in when not editing.\nDefaults to the input format if not set.","values":[]},{"name":"input-format","description":"The date format to apply on the input.\nDefaults to the current locale Intl.DateTimeFormat","values":[]},{"name":"locale","description":"The locale settings used to display the value.","values":[]},{"name":"prompt","description":"The prompt symbol to use for unfilled parts of the mask.","values":[]},{"name":"active-date","description":"Gets/Sets the date which is shown in the calendar picker and is highlighted.\nBy default it is the current date.","values":[{"name":"Date"}]},{"name":"week-start","description":"Sets the start day of the week for the calendar.","values":[{"name":"WeekDays"}]},{"name":"required","description":"Makes the control a required field in a form context.","values":[]},{"name":"name","description":"The name attribute of the control.","values":[]},{"name":"disabled","description":"The disabled state of the component","values":[]},{"name":"invalid","description":"Control the validity of the control.","values":[]},{"name":"keep-open-on-select","description":"Whether the component dropdown should be kept open on selection.","values":[]},{"name":"keep-open-on-outside-click","description":"Whether the component dropdown should be kept open on clicking outside of it.","values":[]}],"references":[]},{"name":"igc-divider","description":"The igc-divider allows the content author to easily create a horizontal/vertical rule as a break between content to better organize information on a page.\n---\n\n\n### **CSS Properties:**\n - **--color** - Sets the color of the divider. _(default: undefined)_\n- **--inset** - Shrinks the divider by the given amount from the start. If `middle` is set it will shrink from both sides. _(default: undefined)_","attributes":[{"name":"vertical","description":"Whether to render a vertical divider line.","values":[]},{"name":"middle","description":"When set and inset is provided, it will shrink the divider line from both sides.","values":[]},{"name":"type","description":"Whether to render a solid or a dashed divider line.","values":[{"name":"solid"},{"name":"dashed"}]}],"references":[]},{"name":"igc-dropdown-item","description":"Represents an item in a dropdown list.\n---\n\n\n### **Slots:**\n - **prefix** - Renders content before the item's main content.\n- _default_ - Renders the item's main content.\n- **suffix** - Renders content after the item's main content.\n\n### **CSS Parts:**\n - **prefix** - The prefix wrapper of the igc-dropdown-item.\n- **content** - The main content wrapper of the igc-dropdown-item.\n- **suffix** - The suffix wrapper of the igc-dropdown-item.","attributes":[{"name":"active","description":"Whether the item is active.","values":[]},{"name":"disabled","description":"Whether the item is disabled.","values":[]},{"name":"selected","description":"Whether the item is selected.","values":[]},{"name":"value","description":"The current value of the item.\nIf not specified, the element's text content is used.","values":[]}],"references":[]},{"name":"igc-dropdown-group","description":"A container for a group of `igc-dropdown-item` components.\n---\n\n\n### **Slots:**\n - **label** - Contains the group's label.\n- _default_ - Intended to contain the items belonging to this group.\n\n### **CSS Parts:**\n - **label** - The native label element.","attributes":[],"references":[]},{"name":"igc-dropdown-header","description":"Represents a header item in a igc-dropdown list.\n---\n\n\n### **Slots:**\n - _default_ - Renders the header.","attributes":[],"references":[]},{"name":"igc-dropdown","description":"Represents a DropDown component.\n---\n\n\n### **Events:**\n - **igcChange** - Emitted when the selected item changes.\n- **igcOpening** - Emitted just before the dropdown is open.\n- **igcOpened** - Emitted after the dropdown is open.\n- **igcClosing** - Emitter just before the dropdown is closed.\n- **igcClosed** - Emitted after closing the dropdown.\n\n### **Slots:**\n - **target** - Renders the dropdown's target element.\n- _default_ - Renders the dropdown list items.\n\n### **CSS Parts:**\n - **base** - The dropdown list wrapper container.\n- **list** - The dropdown list element.","attributes":[{"name":"placement","description":"The preferred placement of the component around the target element.","values":[{"name":"top"},{"name":"top-start"},{"name":"top-end"},{"name":"bottom"},{"name":"bottom-start"},{"name":"bottom-end"},{"name":"right"},{"name":"right-start"},{"name":"right-end"},{"name":"left"},{"name":"left-start"},{"name":"left-end"}]},{"name":"scroll-strategy","description":"Determines the behavior of the component during scrolling of the parent container.","values":[{"name":"scroll"},{"name":"block"},{"name":"close"}]},{"name":"flip","description":"Whether the component should be flipped to the opposite side of the target once it's about to overflow the visible area.\nWhen true, once enough space is detected on its preferred side, it will flip back.","values":[]},{"name":"distance","description":"The distance from the target element.","values":[]},{"name":"same-width","description":"Whether the dropdown's width should be the same as the target's one.","values":[]},{"name":"keep-open-on-select","description":"Whether the component dropdown should be kept open on selection.","values":[]},{"name":"keep-open-on-outside-click","description":"Whether the component dropdown should be kept open on clicking outside of it.","values":[]},{"name":"open","description":"Sets the open state of the component.","values":[]}],"references":[]},{"name":"igc-select-item","description":"Represents an item in a select list.\n---\n\n\n### **Slots:**\n - _default_ - Renders the all content bar the prefix and suffix.\n- **prefix** - Renders content before the main content area.\n- **suffix** - Renders content after the main content area.\n\n### **CSS Parts:**\n - **prefix** - The prefix wrapper of the igc-select-item.\n- **content** - The main content wrapper of the igc-select-item.\n- **suffix** - The suffix wrapper of the igc-select-item.","attributes":[{"name":"active","description":"Whether the item is disabled.","values":[]},{"name":"disabled","description":"Whether the item is disabled.","values":[]},{"name":"selected","description":"Whether the item is selected.","values":[]},{"name":"value","description":"The current value of the item.\nIf not specified, the element's text content is used.","values":[]}],"references":[]},{"name":"igc-select-group","description":"\n---\n\n\n### **Slots:**\n - **label** - Contains the group's label.\n- _default_ - Intended to contain the items belonging to this group.\n\n### **CSS Parts:**\n - **label** - The native label element.","attributes":[{"name":"disabled","description":"Whether the group item and all its children are disabled.","values":[]}],"references":[]},{"name":"igc-select-header","description":"Represents a header item in an igc-select component.\n---\n\n\n### **Slots:**\n - _default_ - Renders the header.","attributes":[],"references":[]},{"name":"igc-select","description":"Represents a control that provides a menu of options.\n---\n\n\n### **Events:**\n - **igcChange** - Emitted when the control's checked state changes.\n- **igcOpening** - Emitted just before the list of options is opened.\n- **igcOpened** - Emitted after the list of options is opened.\n- **igcClosing** - Emitter just before the list of options is closed.\n- **igcClosed** - Emitted after the list of options is closed.\n\n### **Slots:**\n - _default_ - Renders the list of select items.\n- **prefix** - Renders content before the input.\n- **suffix** - Renders content after input.\n- **header** - Renders a container before the list of options.\n- **footer** - Renders a container after the list of options.\n- **helper-text** - Renders content below the input.\n- **toggle-icon** - Renders content inside the suffix container.\n- **toggle-icon-expanded** - Renders content for the toggle icon when the component is in open state.\n\n### **CSS Parts:**\n - **list** - The list wrapping container for the items of the igc-select.\n- **input** - The encapsulated igc