igniteui-webcomponents/igniteui-webcomponents.html-data.json

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.

{
      "$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":"AvatarShape"}]}],"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":"ExpansionPanelIndicatorPosition"}]}],"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":"BadgeShape"}]}],"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":"ButtonVariant"}]},{"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":"ContentOrientation"}]},{"name":"selection","description":"Controls the mode of selection for the button group.","values":[{"name":"ButtonGroupSelection"}]},{"name":"selectedItems","description":"Gets/Sets the currently selected buttons (their values).","values":[{"name":"string[]"}]}],"references":[]},{"name":"igc-validator","description":"\n---\n\n\n### **CSS Parts:**\n - **helper-text** - The base wrapper\n- **validation-message** - The validation error message container\n- **validation-icon** - The validation error icon","attributes":[{"name":"invalid","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- **value-missing** - Renders content when the required validation fails.\n- **range-overflow** - Renders content when the max validation fails.\n- **range-underflow** - Renders content when the min validation fails.\n- **custom-error** - Renders content when setCustomValidity(message) is set.\n- **invalid** - Renders content when the component is in invalid state (validity.valid = false).\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":"When set, makes the component a required field for validation.","values":[]},{"name":"name","description":"The name attribute of the control.","values":[]},{"name":"disabled","description":"The disabled state of the component.","values":[]},{"name":"invalid","description":"Sets the control into invalid state (visual state only).","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. Cancelable.\n- **igcClosed** - Emitted after closing the dialog.\n\n### **Slots:**\n - _default_ - Renders content inside the default slot of the dialog.\n- **title** - Renders content in the title slot of the dialog header.\n- **message** - Renders the message content of the dialog.\n- **footer** - Renders content in the dialog footer.\n\n### **CSS Parts:**\n - **base** - The base wrapper of the dialog.\n- **title** - The title container of the dialog.\n- **footer** - The footer container of the dialog.\n- **overlay** - The backdrop overlay of the dialog.","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-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- **value-missing** - Renders content when the required validation fails.\n- **type-mismatch** - Renders content when the a type url/email input pattern validation fails.\n- **pattern-mismatch** - Renders content when the pattern validation fails.\n- **too-long** - Renders content when the maxlength validation fails.\n- **too-short** - Renders content when the minlength validation fails.\n- **range-overflow** - Renders content when the max validation fails.\n- **range-underflow** - Renders content when the min validation fails.\n- **step-mismatch** - Renders content when the step validation fails.\n- **custom-error** - Renders content when setCustomValidity(message) is set.\n- **invalid** - Renders content when the component is in invalid state (validity.valid = false).\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":"InputType"}]},{"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":"When set, makes the component a required field for validation.","values":[]},{"name":"name","description":"The name attribute of the control.","values":[]},{"name":"disabled","description":"The disabled state of the component.","values":[]},{"name":"invalid","description":"Sets the control into invalid state (visual state only).","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":"arrow-offset","description":"Additional offset to apply to the arrow element if enabled.","values":[]},{"name":"inline","description":"Improves positioning for inline reference elements that span over multiple lines.\nUseful for tooltips or similar components.","values":[]},{"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":"PopoverPlacement"}]},{"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":[]},{"name":"shift-padding","description":"Virtual padding for the resolved overflow detection offsets in pixels.","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 content in the default slot of the chip.\n- **prefix** - Renders content at the start of the chip, before the default content.\n- **suffix** - Renders content at the end of the chip after the default content.\n- **select** - Content to render when the chip in selected state.\n- **remove** - Content to override the default remove chip icon.\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-predefined-ranges-area","description":"The predefined ranges area component is used within the `igc-date-range picker` element and it\ndisplays a set of chips with predefined date ranges. The component allows users to quickly select\na predefined date range value. Users can also provide custom ranges to be displayed as chips.\n---\n\n\n### **Events:**\n - **igcRangeSelect**","attributes":[{"name":"use-predefined-ranges","description":"Whether the control will show chips with predefined ranges.","values":[]}],"references":[]},{"name":"igc-date-range-picker","description":"The igc-date-range-picker allows the user to select a range of dates.\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 (single input).\n- **prefix-start** - Renders content before the start input (two inputs).\n- **prefix-end** - Renders content before the end input (two inputs).\n- **suffix** - Renders content after the input (single input).\n- **suffix-start** - Renders content after the start input (single input).\n- **suffix-end** - Renders content after the end input (single input).\n- **helper-text** - Renders content below the input.\n- **bad-input** - Renders content when the value is in the disabledDates ranges.\n- **value-missing** - Renders content when the required validation fails.\n- **range-overflow** - Renders content when the max validation fails.\n- **range-underflow** - Renders content when the min validation fails.\n- **custom-error** - Renders content when setCustomValidity(message) is set.\n- **invalid** - Renders content when the component is in invalid state (validity.valid = false).\n- **title** - Renders content in the calendar title.\n- **header-date** - Renders content instead of the current date/range in the calendar header.\n- **clear-icon** - Renders a clear icon template.\n- **clear-icon-start** - Renders a clear icon template for the start input (two inputs).\n- **clear-icon-end** - Renders a clear icon template for the end input (two inputs).\n- **calendar-icon** - Renders the icon/content for the calendar picker.\n- **calendar-icon-start** - Renders the icon/content for the calendar picker for the start input (two inputs).\n- **calendar-icon-end** - Renders the icon/content for the calendar picker for the end input (two inputs).\n- **calendar-icon-open** - Renders the icon/content for the picker in open state.\n- **calendar-icon-open-start** - Renders the icon/content for the picker in open state for the start input (two inputs).\n- **calendar-icon-open-end** - Renders the icon/content for the picker in open state for the end input (two inputs).\n- **actions** - Renders content in the action part of the picker in open state.\n- **separator** - Renders the separator element between the two inputs.\n\n### **CSS Parts:**\n - **separator** - The separator element between the two inputs.\n- **ranges** - The wrapper that renders the custom and predefined ranges.\n- **label** - The label wrapper that renders content above the target input.\n- **calendar-icon** - The calendar icon wrapper for closed state (single input).\n- **calendar-icon-start** - The calendar icon wrapper for closed state for the start input (two inputs).\n- **calendar-icon-end** - The calendar icon wrapper for closed state for the end input (two inputs).\n- **calendar-icon-open** - The calendar icon wrapper for opened state (single input).\n- **calendar-icon-open-start** - The calendar icon wrapper for opened state for the start input (two inputs).\n- **calendar-icon-open-end** - The calendar icon wrapper for opened state for the end input (two inputs).\n- **clear-icon** - The clear icon wrapper (single input).\n- **clear-icon-start** - The clear icon wrapper for the start input (two inputs).\n- **clear-icon-end** - The clear icon wrapper for the end input (two inputs).\n- **actions** - The wrapper for the custom actions area.\n- **clear-icon** - The clear icon wrapper.\n- **input** - The native input element.\n- **prefix** - The prefix wrapper.\n- **suffix** - The suffix 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":"mode","description":"Determines whether the calendar is opened in a dropdown or a modal dialog","values":[{"name":"PickerMode"}]},{"name":"use-two-inputs","description":"Use two inputs to display the date range values. Makes the input editable in dropdown mode.","values":[]},{"name":"usePredefinedRanges","description":"Whether the control will show chips with predefined ranges.","values":[]},{"name":"locale","description":"The locale settings used to display the value.","values":[]},{"name":"readonly","description":"Makes the control a readonly field.","values":[]},{"name":"non-editable","description":"Whether to allow typing in the input.","values":[]},{"name":"outlined","description":"Whether the control will have outlined appearance.","values":[]},{"name":"label","description":"The label of the control (single input).","values":[]},{"name":"label-start","description":"The label attribute of the start input.","values":[]},{"name":"label-end","description":"The label attribute of the end input.","values":[]},{"name":"placeholder","description":"The placeholder attribute of the control (single input).","values":[]},{"name":"placeholder-start","description":"The placeholder attribute of the start input.","values":[]},{"name":"placeholder-end","description":"The placeholder attribute of the end input.","values":[]},{"name":"prompt","description":"The prompt symbol to use for unfilled parts of the mask.","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 inputs.\nDefaults to the current locale Intl.DateTimeFormat","values":[]},{"name":"min","description":"The minimum value required for the date range picker to remain valid.","values":[{"name":"Date"}]},{"name":"max","description":"The maximum value required for the date range picker to remain valid.","values":[{"name":"Date"}]},{"name":"visible-months","description":"The number of months displayed in the calendar.","values":[]},{"name":"header-orientation","description":"The orientation of the calendar header.","values":[{"name":"ContentOrientation"}]},{"name":"orientation","description":"The orientation of the multiple months displayed in the calendar's days view.","values":[{"name":"ContentOrientation"}]},{"name":"hide-header","description":"Determines whether the calendar hides its header.","values":[]},{"name":"show-week-numbers","description":"Whether to show the number of the week in the calendar.","values":[]},{"name":"hide-outside-days","description":"Controls the visibility of the dates that do not belong to the current month.","values":[]},{"name":"value","values":[{"name":"DateRangeValue"}]},{"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":"When set, makes the component a required field for validation.","values":[]},{"name":"name","description":"The name attribute of the control.","values":[]},{"name":"disabled","description":"The disabled state of the component.","values":[]},{"name":"invalid","description":"Sets the control into invalid state (visual state only).","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-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":"CalendarSelection"}]},{"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- **header-date** - Renders content instead of the current date/range in 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- **content-vertical** - The content element which contains the views and navigation elements of the calendar in vertical orientation.\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":"CalendarHeaderOrientation"}]},{"name":"orientation","description":"The orientation of the calendar months when more than one month\nis being shown.","values":[{"name":"ContentOrientation"}]},{"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":"CalendarActiveView"}]},{"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":"CalendarSelection"}]},{"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":"ContentOrientation"}]}],"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-icon-button","description":"\n---\n\n\n### **Events:**\n \n\n### **CSS Parts:**\n - **base** - The wrapping element of the icon button.\n- **icon** - The icon element of the icon button.","attributes":[{"name":"name","description":"The name of the icon.","values":[]},{"name":"collection","description":"The name of the icon collection.","values":[]},{"name":"mirrored","description":"Whether to flip the icon button. Useful for RTL layouts.","values":[]},{"name":"variant","description":"The visual variant of the icon button.","values":[{"name":"IconButtonVariant"}]},{"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-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":"DividerType"}]}],"references":[]},{"name":"igc-resize","description":"\n---\n\n\n### **Events:**\n \n\n### **Slots:**\n - _default_ - renders the element(s) that should be resized\n- **side-adorner** - renders the side resize handle.\n- **corner-adorner** - renders the corner resize handle.\n- **bottom-adorner** - renders the bottom resize handle.","attributes":[{"name":"active","description":"Whether to always show the resize element adorners.","values":[]},{"name":"mode","description":"Get/Set the mode of the resizing operation.","values":[{"name":"ResizeMode"}]}],"references":[]},{"name":"igc-tile","description":"The tile component is used within the `igc-tile-manager` as a container\nfor displaying various types of information.\n---\n\n\n### **Events:**\n - **igcTileFullscreen** - Fired when tile the fullscreen state changes.\n- **igcTileMaximize** - Fired when tile the maximize state changes.\n- **igcTileDragStart** - Fired when a drag operation on a tile is about to begin. Cancelable.\n- **igcTileDragEnd** - Fired when a drag operation with a tile is successfully completed.\n- **igcTileDragCancel** - Fired when a tile drag operation is canceled by the user.\n- **igcTileResizeStart** - Fired when a resize operation on a tile is about to begin. Cancelable.\n- **igcTileResizeEnd** - Fired when a resize operation on a tile is successfully completed.\n- **igcTileResizeCancel** - Fired when a resize operation on a tile is canceled by the user.\n\n### **Slots:**\n - _default_ - Default slot for the tile's content.\n- **title** - Renders the title of the tile header.\n- **maximize-action** - Renders the maximize action element of the tile header.\n- **fullscreen-action** - Renders the fullscreen action element of the tile header.\n- **actions** - Renders items after the default actions in the tile header.\n- **side-adorner** - Renders the side resize handle of the tile.\n- **corner-adorner** - Renders the corner resize handle of the tile.\n- **bottom-adorner** - Renders the bottom resize handle of the tile.\n\n### **CSS Parts:**\n - **base** - The wrapper for the entire tile content, header and content.\n- **header** - The container for the tile header, including title and actions.\n- **title** - The title container of the tile.\n- **actions** - The actions container of the tile header.\n- **content-container** - The container wrapping the tile’s main content.\n- **trigger-side** - The part for the side adorner of the encapsulated resize element in the tile.\n- **trigger** - The part for the corner adorner of the encapsulated resize element in the tile.\n- **trigger-bottom** - The part for the bottom adorner of the encapsulated resize element in the tile.","attributes":[{"name":"col-span","description":"The number of columns the tile will span.","values":[]},{"name":"row-span","description":"The number of rows the tile will span.","values":[]},{"name":"col-start","description":"The starting column for the tile.","values":[]},{"name":"row-start","description":"The starting row for the tile.","values":[]},{"name":"maximized","description":"Indicates whether the tile occupies all available space within the layout.","values":[]},{"name":"disable-resize","description":"Indicates whether to disable tile resize behavior regardless\not its tile manager parent settings.","values":[]},{"name":"disable-fullscreen","description":"Whether to disable the rendering of the tile `fullscreen-action` slot and its\ndefault fullscreen action button.","values":[]},{"name":"disable-maximize","description":"Whether to disable the rendering of the tile `maximize-action` slot and its\ndefault maximize action button.","values":[]},{"name":"position","description":"Gets/sets the tile's visual position in the layout.\nCorresponds to the CSS `order` property.","values":[]}],"references":[]},{"name":"igc-tile-manager","description":"The tile manager component enables the dynamic arrangement, resizing, and interaction of tiles.\n---\n\n\n### **Slots:**\n - _default_ - Default slot for the tile manager. Only `igc-tile` elements will be projected inside the CSS grid container.\n\n### **CSS Properties:**\n - **--column-count** - The number of columns for the tile manager. The `column-count` attribute sets this variable. _(default: undefined)_\n- **--min-col-width** - The minimum size of the columns in the tile-manager. The `min-column-width` attribute sets this variable. _(default: undefined)_\n- **--min-row-height** - The minimum size of the rows in the tile-manager. The `min-row-height` attribute sets this variable. _(default: undefined)_\n- **--grid-gap** - The gap size of the underlying CSS grid container. The `gap` attributes sts this variable. _(default: undefined)_\n\n### **CSS Parts:**\n - **base** - The tile manager CSS Grid container.","attributes":[{"name":"resize-mode","description":"Whether resize operations are enabled.","values":[{"name":"TileManagerResizeMode"}]},{"name":"drag-mode","description":"Whether drag and drop operations are enabled.","values":[{"name":"TileManagerDragMode"}]},{"name":"column-count","description":"Sets the number of columns for the tile manager.\nSetting value <= than zero will trigger a responsive layout.","values":[]},{"name":"min-column-width","description":"Sets the minimum width for a column unit in the tile manager.","values":[]},{"name":"min-row-height","description":"Sets the minimum height for a row unit in the tile manager.","values":[]},{"name":"gap","description":"Sets the gap size between tiles in the tile manager.","values":[]}],"references":[]},{"name":"igc-carousel-indicator","description":"Used when a custom indicator needs to be passed to the `igc-carousel` component.\n---\n\n\n### **Slots:**\n - _default_ - Default slot for projected inactive indicator.\n- **active** - Default slot for projected active indicator.\n\n### **CSS Parts:**\n - **indicator** - The wrapping container of the carousel dot indicator.\n- **inactive** - The wrapping container of the inactive dot indicator.\n- **active** - The wrapping container of the active dot indicator.","attributes":[],"references":[]},{"name":"igc-carousel-indicator-container","description":"\n---\n\n\n### **Slots:**\n - _default_ - Default slot for the carousel indicator container.\n\n### **CSS Parts:**\n - **base** - The wrapping container of all carousel indicators.","attributes":[],"references":[]},{"name":"igc-carousel-slide","description":"A single content container within a set of containers used in the context of an `igc-carousel`.\n---\n\n\n### **Slots:**\n - **Default** - slot for the carousel slide.","attributes":[{"name":"active","description":"The current active slide for the carousel component.","values":[]},{"name":"previous","values":[]}],"references":[]},{"name":"igc-carousel","description":"The `igc-carousel` presents a set of `igc-carousel-slide`s by sequentially displaying a subset of one or more slides.\n---\n\n\n### **Events:**\n - **igcSlideChanged** - Emitted when the current active slide is changed either by user interaction or by the interval callback.\n- **igcPlaying** - Emitted when the carousel enters playing state by a user interaction.\n- **igcPaused** - Emitted when the carousel enters paused state by a user interaction.\n\n### **Slots:**\n - **Default** - slot for the carousel. Any projected `igc-carousel-slide` components should be projected here.\n- **previous-button** - Renders content inside the previous button.\n- **next-button** - Renders content inside the next button.\n\n### **CSS Parts:**\n - **navigation** - The wrapper container of each carousel navigation button.\n- **previous** - The wrapper container of the carousel previous navigation button.\n- **next** - The wrapper container of the carousel next navigation button.\n- **dot** - The carousel dot indicator container.\n- **active** - The carousel active dot indicator container.\n- **label** - The label container of the carousel indicators.\n- **start** - The wrapping container of all carousel indicators when indicators-orientation is set to start.","attributes":[{"name":"disable-loop","description":"Whether the carousel should skip