API
<awc-accordion>
An Act! Web Component Accordion Element.
Attributes
| Name | Description | Type | Default |
| open | undefined | boolean | false |
Properties
| Name | Attribute | Description | Type | Default |
| open | open | undefined | boolean | false |
| renderRoot | undefined | Node or ShadowRoot into which element DOM should be rendered. Defaults
to an open shadowRoot. | HTMLElement | ShadowRoot | undefined |
| isUpdatePending | undefined | undefined | boolean | undefined |
| hasUpdated | undefined | undefined | boolean | undefined |
| updateComplete | undefined | Returns a Promise that resolves when the element has completed updating.
The Promise value is a boolean that is `true` if the element completed the
update without triggering another update. The Promise result is `false` if
a property was set inside `updated()`. If the Promise is rejected, an
exception was thrown during the update.
To await additional asynchronous work, override the `getUpdateComplete`
method. For example, it is sometimes useful to await a rendered element
before fulfilling this Promise. To do this, first await
`super.getUpdateComplete()`, then any subsequent state. | Promise | undefined |
Events
| Name | Description |
| accordionrender | undefined |
| openchange | Example Usage:
<awc-accordion></awc-accordion> |
API
<awc-accordion-list>
An Act! Web Component AccordionList Element.
Example Usage:
<awc-accordion-list></awc-accordion-list>
Attributes
| Name | Description | Type | Default |
| activeItem | undefined | ActAccordionElement | null | undefined |
Properties
| Name | Attribute | Description | Type | Default |
| activeItem | activeItem | undefined | ActAccordionElement | null | undefined |
| renderRoot | undefined | Node or ShadowRoot into which element DOM should be rendered. Defaults
to an open shadowRoot. | HTMLElement | ShadowRoot | undefined |
| isUpdatePending | undefined | undefined | boolean | undefined |
| hasUpdated | undefined | undefined | boolean | undefined |
| updateComplete | undefined | Returns a Promise that resolves when the element has completed updating.
The Promise value is a boolean that is `true` if the element completed the
update without triggering another update. The Promise result is `false` if
a property was set inside `updated()`. If the Promise is rejected, an
exception was thrown during the update.
To await additional asynchronous work, override the `getUpdateComplete`
method. For example, it is sometimes useful to await a rendered element
before fulfilling this Promise. To do this, first await
`super.getUpdateComplete()`, then any subsequent state. | Promise | undefined |
API
<awc-attribute>
An Act! Web Component Attribute Element.
Example Usage:
Attributes
| Name | Description | Type | Default |
| autoCapitalize | The HTML5 input `autocapitalize` attribute passed to the input element. | "none" | "off" | "on" | "sentences" | "words" | "characters" | "off" |
| clearable | Sets whether there should be a clear icon-button to clear the input. | boolean | true |
| disabled | Sets the input as disabled. | boolean | false |
| focused | Sets the input as focused. | boolean | false |
| inputHidden | Sets the input element as hidden. | boolean | false |
| inputOnActive | Whether the input should appear *only* when the element is active or focused | boolean | false |
| label | The text for the label. | string | "" |
| mask | The IMask to use with the input. | MaskedDateOptions | MaskedNumberOptions | MaskedPatternOptions | MaskedOptions | ... 12 more ... | null | undefined |
| max | The `max` attribute on the input. | string | number | "" |
| min | The `min` attribute on the input. | string | number | "" |
| name | The `name` attribute on the input. | string | "" |
| placeholder | The `placeholder` attribute on the input. | string | "" |
| readOnly | Sets the input as readonly. | boolean | false |
| required | Sets the input as required. | boolean | false |
| type | The `type` attribute of the input. | HTMLInputElementType | "text" |
| valid | Sets the input as valid.
The `awc-input--invalid` class is applied if invalid. | boolean | true |
| value | The value of the input. | string | "" |
Properties
| Name | Attribute | Description | Type | Default |
| autoCapitalize | autoCapitalize | The HTML5 input `autocapitalize` attribute passed to the input element. | "none" | "off" | "on" | "sentences" | "words" | "characters" | "off" |
| clearable | clearable | Sets whether there should be a clear icon-button to clear the input. | boolean | true |
| disabled | disabled | Sets the input as disabled. | boolean | false |
| focused | focused | Sets the input as focused. | boolean | false |
| inputHidden | inputHidden | Sets the input element as hidden. | boolean | false |
| inputOnActive | inputOnActive | Whether the input should appear *only* when the element is active or focused | boolean | false |
| label | label | The text for the label. | string | "" |
| mask | mask | The IMask to use with the input. | MaskedDateOptions | MaskedNumberOptions | MaskedPatternOptions | MaskedOptions | ... 12 more ... | null | undefined |
| max | max | The `max` attribute on the input. | string | number | "" |
| min | min | The `min` attribute on the input. | string | number | "" |
| name | name | The `name` attribute on the input. | string | "" |
| placeholder | placeholder | The `placeholder` attribute on the input. | string | "" |
| readOnly | readOnly | Sets the input as readonly. | boolean | false |
| required | required | Sets the input as required. | boolean | false |
| type | type | The `type` attribute of the input. | HTMLInputElementType | "text" |
| valid | valid | Sets the input as valid.
The `awc-input--invalid` class is applied if invalid. | boolean | true |
| value | value | The value of the input. | string | "" |
| renderRoot | undefined | Node or ShadowRoot into which element DOM should be rendered. Defaults
to an open shadowRoot. | HTMLElement | ShadowRoot | undefined |
| isUpdatePending | undefined | undefined | boolean | undefined |
| hasUpdated | undefined | undefined | boolean | undefined |
| updateComplete | undefined | Returns a Promise that resolves when the element has completed updating.
The Promise value is a boolean that is `true` if the element completed the
update without triggering another update. The Promise result is `false` if
a property was set inside `updated()`. If the Promise is rejected, an
exception was thrown during the update.
To await additional asynchronous work, override the `getUpdateComplete`
method. For example, it is sometimes useful to await a rendered element
before fulfilling this Promise. To do this, first await
`super.getUpdateComplete()`, then any subsequent state. | Promise | undefined |
Events
| Name | Description |
| clear | undefined |
| input | undefined |
| invalid | Example Usage:
<awc-input></awc-input> |
| blur | undefined |
| focus | undefined |
API
<awc-button>
The Act! Web Component Button Element. Should be used in place of the standard HTMLButtonElement.
Example Usage:
<awc-button>Button</awc-button>
Attributes
| Name | Description | Type | Default |
| color | Sets the color of the displayed button. | ActColor | "blue" |
| disabled | Disabled the button. | boolean | false |
| href | Button becomes an `a` tag with `href` property. | string | null | undefined |
| outlined | Sets the button to outlined style. | boolean | false |
| slim | Sets the button to slim style. | boolean | false |
| target | Sets the target property if `href` is set. | "_blank" | "_parent" | "_self" | "_top" | "_self" |
| type | Sets the button type. | "button" | "submit" | "reset" | "menu" | "button" |
Properties
| Name | Attribute | Description | Type | Default |
| color | color | Sets the color of the displayed button. | ActColor | "blue" |
| disabled | disabled | Disabled the button. | boolean | false |
| href | href | Button becomes an `a` tag with `href` property. | string | null | undefined |
| outlined | outlined | Sets the button to outlined style. | boolean | false |
| slim | slim | Sets the button to slim style. | boolean | false |
| target | target | Sets the target property if `href` is set. | "_blank" | "_parent" | "_self" | "_top" | "_self" |
| type | type | Sets the button type. | "button" | "submit" | "reset" | "menu" | "button" |
| buttonElement | undefined | undefined | HTMLElement | undefined |
| renderRoot | undefined | Node or ShadowRoot into which element DOM should be rendered. Defaults
to an open shadowRoot. | HTMLElement | ShadowRoot | undefined |
| isUpdatePending | undefined | undefined | boolean | undefined |
| hasUpdated | undefined | undefined | boolean | undefined |
| updateComplete | undefined | Returns a Promise that resolves when the element has completed updating.
The Promise value is a boolean that is `true` if the element completed the
update without triggering another update. The Promise result is `false` if
a property was set inside `updated()`. If the Promise is rejected, an
exception was thrown during the update.
To await additional asynchronous work, override the `getUpdateComplete`
method. For example, it is sometimes useful to await a rendered element
before fulfilling this Promise. To do this, first await
`super.getUpdateComplete()`, then any subsequent state. | Promise | undefined |
API
<awc-calendar>
An Act! Web Component Calendar Element.
Attributes
| Name | Description | Type | Default |
| formatLanguage | The language to use for localization.
Default: `navigaor.language` | string | "language" |
| headerText | The text used to show in the weekday header.
Default: iterates Sunday-Saturday and calls 'narrow' on the Date object passing the formatLanguage | string[] | "createArrayWithNumbers(7).map(day => {\n // Start on a known Sunday (getDate() === 0)\n const date = new Date(2020, 7, 2 + day);\n // Use narrow format to get the first letter for the weekday\n return date.toLocaleDateString(this.formatLanguage, { weekday: 'narrow' });\n })" |
| hideHeader | Sets whether the weekday header will be shown. | boolean | false |
| hideMonths | Sets whether the month will be shown (and the month navigation). | boolean | false |
| hideWeekends | Sets whether the weekends will be shown. | boolean | false |
| inactiveToday | Sets whether the today element should have an indicator on it. | boolean | false |
| monthText | The text used for displaying the month.
Default: gets the current language and iterates the months on the Date object. | string[] | "createArrayWithNumbers(12).map(month => {\n const date = new Date();\n date.setMonth(month);\n return date.toLocaleDateString(this.formatLanguage, { month: 'long' });\n })" |
| restrictMonth | Restricts the month to the current month via removing the ability to change the month. | boolean | false |
| singleSelection | Whether the value should only ever have one item selected. This also disables the ability
to select multiple or ranged values. | boolean | false |
| value | The value of the calendar selection.
If the length of the array is greater than one, than the multi or range selection occurred. | Date[] | [] |
Properties
| Name | Attribute | Description | Type | Default |
| formatLanguage | formatLanguage | The language to use for localization.
Default: `navigaor.language` | string | "language" |
| headerText | headerText | The text used to show in the weekday header.
Default: iterates Sunday-Saturday and calls 'narrow' on the Date object passing the formatLanguage | string[] | "createArrayWithNumbers(7).map(day => {\n // Start on a known Sunday (getDate() === 0)\n const date = new Date(2020, 7, 2 + day);\n // Use narrow format to get the first letter for the weekday\n return date.toLocaleDateString(this.formatLanguage, { weekday: 'narrow' });\n })" |
| hideHeader | hideHeader | Sets whether the weekday header will be shown. | boolean | false |
| hideMonths | hideMonths | Sets whether the month will be shown (and the month navigation). | boolean | false |
| hideWeekends | hideWeekends | Sets whether the weekends will be shown. | boolean | false |
| inactiveToday | inactiveToday | Sets whether the today element should have an indicator on it. | boolean | false |
| monthText | monthText | The text used for displaying the month.
Default: gets the current language and iterates the months on the Date object. | string[] | "createArrayWithNumbers(12).map(month => {\n const date = new Date();\n date.setMonth(month);\n return date.toLocaleDateString(this.formatLanguage, { month: 'long' });\n })" |
| restrictMonth | restrictMonth | Restricts the month to the current month via removing the ability to change the month. | boolean | false |
| singleSelection | singleSelection | Whether the value should only ever have one item selected. This also disables the ability
to select multiple or ranged values. | boolean | false |
| value | value | The value of the calendar selection.
If the length of the array is greater than one, than the multi or range selection occurred. | Date[] | [] |
| renderRoot | undefined | Node or ShadowRoot into which element DOM should be rendered. Defaults
to an open shadowRoot. | HTMLElement | ShadowRoot | undefined |
| isUpdatePending | undefined | undefined | boolean | undefined |
| hasUpdated | undefined | undefined | boolean | undefined |
| updateComplete | undefined | Returns a Promise that resolves when the element has completed updating.
The Promise value is a boolean that is `true` if the element completed the
update without triggering another update. The Promise result is `false` if
a property was set inside `updated()`. If the Promise is rejected, an
exception was thrown during the update.
To await additional asynchronous work, override the `getUpdateComplete`
method. For example, it is sometimes useful to await a rendered element
before fulfilling this Promise. To do this, first await
`super.getUpdateComplete()`, then any subsequent state. | Promise | undefined |
Events
| Name | Description |
| selected | Example Usage:
<awc-calendar></awc-calendar> |
| select | undefined |
API
<awc-checkbox>
An Act! Web Component Checkbox Element.
Example Usage:
Attributes
| Name | Description | Type | Default |
| checked | Whether the checkbox is checked or not. | boolean | false |
| disabled | Disables the checkbox. | boolean | false |
| name | The name of the checkbox element. | string | "" |
| suffixed | Whether the checkbox should suffix the text. | boolean | false |
Properties
| Name | Attribute | Description | Type | Default |
| checked | checked | Whether the checkbox is checked or not. | boolean | false |
| disabled | disabled | Disables the checkbox. | boolean | false |
| name | name | The name of the checkbox element. | string | "" |
| suffixed | suffixed | Whether the checkbox should suffix the text. | boolean | false |
| renderRoot | undefined | Node or ShadowRoot into which element DOM should be rendered. Defaults
to an open shadowRoot. | HTMLElement | ShadowRoot | undefined |
| isUpdatePending | undefined | undefined | boolean | undefined |
| hasUpdated | undefined | undefined | boolean | undefined |
| updateComplete | undefined | Returns a Promise that resolves when the element has completed updating.
The Promise value is a boolean that is `true` if the element completed the
update without triggering another update. The Promise result is `false` if
a property was set inside `updated()`. If the Promise is rejected, an
exception was thrown during the update.
To await additional asynchronous work, override the `getUpdateComplete`
method. For example, it is sometimes useful to await a rendered element
before fulfilling this Promise. To do this, first await
`super.getUpdateComplete()`, then any subsequent state. | Promise | undefined |
Events
| Name | Description |
| change | undefined |
API
<awc-chip>
An Act! Web Component Chip Element.
Attributes
| Name | Description | Type | Default |
| color | The chip color based on an `ActColor` | ActColor | "blue" |
| clearable | Whether the chip will have a button rendered to fire the chipclear event | boolean | false |
| tooltip | The text to display as the tooltip for the chip element.
The tooltip will only display if this is a non-empty string. | string | "" |
Properties
| Name | Attribute | Description | Type | Default |
| color | color | The chip color based on an `ActColor` | ActColor | "blue" |
| clearable | clearable | Whether the chip will have a button rendered to fire the chipclear event | boolean | false |
| tooltip | tooltip | The text to display as the tooltip for the chip element.
The tooltip will only display if this is a non-empty string. | string | "" |
| menuElement | undefined | The ActMenuElement for the tooltip. | ActMenuElement | undefined |
| renderRoot | undefined | Node or ShadowRoot into which element DOM should be rendered. Defaults
to an open shadowRoot. | HTMLElement | ShadowRoot | undefined |
| isUpdatePending | undefined | undefined | boolean | undefined |
| hasUpdated | undefined | undefined | boolean | undefined |
| updateComplete | undefined | Returns a Promise that resolves when the element has completed updating.
The Promise value is a boolean that is `true` if the element completed the
update without triggering another update. The Promise result is `false` if
a property was set inside `updated()`. If the Promise is rejected, an
exception was thrown during the update.
To await additional asynchronous work, override the `getUpdateComplete`
method. For example, it is sometimes useful to await a rendered element
before fulfilling this Promise. To do this, first await
`super.getUpdateComplete()`, then any subsequent state. | Promise | undefined |
Events
| Name | Description |
| chipclear | only if clearable is set to true and user action occurs |
| chiprender | when item is rendered
Example Usage:
|
API
<awc-chip-list>
An Act! Web Component ChipList Element.
Attributes
| Name | Description | Type | Default |
| addAction | undefined | boolean | true |
| modifiable | undefined | boolean | false |
Properties
| Name | Attribute | Description | Type | Default |
| addAction | addAction | undefined | boolean | true |
| modifiable | modifiable | undefined | boolean | false |
| addButton | undefined | undefined | ActIconButtonElement | undefined |
| addButtonIcon | undefined | undefined | ActIconElement | undefined |
| renderRoot | undefined | Node or ShadowRoot into which element DOM should be rendered. Defaults
to an open shadowRoot. | HTMLElement | ShadowRoot | undefined |
| isUpdatePending | undefined | undefined | boolean | undefined |
| hasUpdated | undefined | undefined | boolean | undefined |
| updateComplete | undefined | Returns a Promise that resolves when the element has completed updating.
The Promise value is a boolean that is `true` if the element completed the
update without triggering another update. The Promise result is `false` if
a property was set inside `updated()`. If the Promise is rejected, an
exception was thrown during the update.
To await additional asynchronous work, override the `getUpdateComplete`
method. For example, it is sometimes useful to await a rendered element
before fulfilling this Promise. To do this, first await
`super.getUpdateComplete()`, then any subsequent state. | Promise | undefined |
Events
| Name | Description |
| addclick | Example Usage:
<awc-chip-list></awc-chip-list> |
API
<awc-datetime>
An Act! Web Component DateTime Element.
Example Usage:
<awc-datetime></awc-datetime>
Attributes
| Name | Description | Type | Default |
| applyText | Text used for the apply button. | string | "Apply" |
| attribute | Sets the inputs to display as attribute elements. | boolean | false |
| cancelText | Text used for the cancel button. | string | "Cancel" |
| formatLanguage | What language to use in the default format function.
Defaults to the current browser language. | string | "language" |
| formatOptions | The options passed to the default format function.
Defaults to undefined. | DateTimeFormatOptions | undefined | undefined |
| hideDate | Whether the calendar should be rendered or not.
NOTE: This changes the native HTML5 control used based on the type. | boolean | false |
| hideTime | Whether the time selection should be rendered or not.
NOTE: This changes the native HTML5 control used based on the type. | boolean | false |
| hourPlaceholder | The placeholder for the hour select element. | string | "12" |
| label | The label for the inputs. | string | "" |
| minuteInterval | The interval for the minutes.
Defaults to 5. | number | 5 |
| minutePlaceholder | The placeholder for the minute select element. | string | "00" |
| placeholder | The placeholder for the inputs. | string | "" |
| required | Whether the field is required or not. | boolean | false |
| twentyFourHour | Whether the time selection should render as twenty four hour selection or not. | boolean | false |
| value | The current value of the field. | Date | null | undefined |
Properties
| Name | Attribute | Description | Type | Default |
| applyText | applyText | Text used for the apply button. | string | "Apply" |
| attribute | attribute | Sets the inputs to display as attribute elements. | boolean | false |
| cancelText | cancelText | Text used for the cancel button. | string | "Cancel" |
| formatLanguage | formatLanguage | What language to use in the default format function.
Defaults to the current browser language. | string | "language" |
| formatOptions | formatOptions | The options passed to the default format function.
Defaults to undefined. | DateTimeFormatOptions | undefined | undefined |
| hideDate | hideDate | Whether the calendar should be rendered or not.
NOTE: This changes the native HTML5 control used based on the type. | boolean | false |
| hideTime | hideTime | Whether the time selection should be rendered or not.
NOTE: This changes the native HTML5 control used based on the type. | boolean | false |
| hourPlaceholder | hourPlaceholder | The placeholder for the hour select element. | string | "12" |
| label | label | The label for the inputs. | string | "" |
| minuteInterval | minuteInterval | The interval for the minutes.
Defaults to 5. | number | 5 |
| minutePlaceholder | minutePlaceholder | The placeholder for the minute select element. | string | "00" |
| placeholder | placeholder | The placeholder for the inputs. | string | "" |
| required | required | Whether the field is required or not. | boolean | false |
| twentyFourHour | twentyFourHour | Whether the time selection should render as twenty four hour selection or not. | boolean | false |
| value | value | The current value of the field. | Date | null | undefined |
| renderRoot | undefined | Node or ShadowRoot into which element DOM should be rendered. Defaults
to an open shadowRoot. | HTMLElement | ShadowRoot | undefined |
| isUpdatePending | undefined | undefined | boolean | undefined |
| hasUpdated | undefined | undefined | boolean | undefined |
| updateComplete | undefined | Returns a Promise that resolves when the element has completed updating.
The Promise value is a boolean that is `true` if the element completed the
update without triggering another update. The Promise result is `false` if
a property was set inside `updated()`. If the Promise is rejected, an
exception was thrown during the update.
To await additional asynchronous work, override the `getUpdateComplete`
method. For example, it is sometimes useful to await a rendered element
before fulfilling this Promise. To do this, first await
`super.getUpdateComplete()`, then any subsequent state. | Promise | undefined |
Events
| Name | Description |
| blur | undefined |
| focus | undefined |
API
<awc-icon>
An icon element that displays one of Act!'s icons.
Example Usage:
<awc-icon>thumbs-up</awc-icon>
Properties
| Name | Attribute | Description | Type | Default |
| renderRoot | undefined | Node or ShadowRoot into which element DOM should be rendered. Defaults
to an open shadowRoot. | HTMLElement | ShadowRoot | undefined |
| isUpdatePending | undefined | undefined | boolean | undefined |
| hasUpdated | undefined | undefined | boolean | undefined |
| updateComplete | undefined | Returns a Promise that resolves when the element has completed updating.
The Promise value is a boolean that is `true` if the element completed the
update without triggering another update. The Promise result is `false` if
a property was set inside `updated()`. If the Promise is rejected, an
exception was thrown during the update.
To await additional asynchronous work, override the `getUpdateComplete`
method. For example, it is sometimes useful to await a rendered element
before fulfilling this Promise. To do this, first await
`super.getUpdateComplete()`, then any subsequent state. | Promise | undefined |
API
<awc-icon-button>
The Act! Web Component Icon Button Element. Should be used when an icon should awc as a button.
Example Usage:
<awc-icon-button color="none">
<awc-icon>thumbs-up</awc-icon>
</awc-icon-button>
Attributes
| Name | Description | Type | Default |
| color | Sets the color of the displayed button. | ActColor | "blue" |
| disabled | Disabled the button. | boolean | false |
| href | Button becomes an `a` tag with `href` property. | string | null | undefined |
| outlined | Sets the button to outlined style. | boolean | false |
| slim | Sets the button to slim style. | boolean | false |
| target | Sets the target property if `href` is set. | "_blank" | "_parent" | "_self" | "_top" | "_self" |
| type | Sets the button type. | "button" | "submit" | "reset" | "menu" | "button" |
Properties
| Name | Attribute | Description | Type | Default |
| color | color | Sets the color of the displayed button. | ActColor | "blue" |
| disabled | disabled | Disabled the button. | boolean | false |
| href | href | Button becomes an `a` tag with `href` property. | string | null | undefined |
| outlined | outlined | Sets the button to outlined style. | boolean | false |
| slim | slim | Sets the button to slim style. | boolean | false |
| target | target | Sets the target property if `href` is set. | "_blank" | "_parent" | "_self" | "_top" | "_self" |
| type | type | Sets the button type. | "button" | "submit" | "reset" | "menu" | "button" |
| buttonElement | undefined | undefined | HTMLElement | undefined |
| renderRoot | undefined | Node or ShadowRoot into which element DOM should be rendered. Defaults
to an open shadowRoot. | HTMLElement | ShadowRoot | undefined |
| isUpdatePending | undefined | undefined | boolean | undefined |
| hasUpdated | undefined | undefined | boolean | undefined |
| updateComplete | undefined | Returns a Promise that resolves when the element has completed updating.
The Promise value is a boolean that is `true` if the element completed the
update without triggering another update. The Promise result is `false` if
a property was set inside `updated()`. If the Promise is rejected, an
exception was thrown during the update.
To await additional asynchronous work, override the `getUpdateComplete`
method. For example, it is sometimes useful to await a rendered element
before fulfilling this Promise. To do this, first await
`super.getUpdateComplete()`, then any subsequent state. | Promise | undefined |
API
<awc-input>
An Act! Web Component Input Element.
Attributes
| Name | Description | Type | Default |
| autoCapitalize | The HTML5 input `autocapitalize` attribute passed to the input element. | "none" | "off" | "on" | "sentences" | "words" | "characters" | "off" |
| clearable | Sets whether there should be a clear icon-button to clear the input. | boolean | false |
| disabled | Sets the input as disabled. | boolean | false |
| focused | Sets the input as focused. | boolean | false |
| inputHidden | Sets the input element as hidden. | boolean | false |
| inputOnActive | Whether the input should appear *only* when the element is active or focused | boolean | false |
| label | The text for the label. | string | "" |
| mask | The IMask to use with the input. | MaskedDateOptions | MaskedNumberOptions | MaskedPatternOptions | MaskedOptions | ... 12 more ... | null | undefined |
| max | The `max` attribute on the input. | string | number | "" |
| min | The `min` attribute on the input. | string | number | "" |
| name | The `name` attribute on the input. | string | "" |
| placeholder | The `placeholder` attribute on the input. | string | "" |
| readOnly | Sets the input as readonly. | boolean | false |
| required | Sets the input as required. | boolean | false |
| type | The `type` attribute of the input. | HTMLInputElementType | "text" |
| valid | Sets the input as valid.
The `awc-input--invalid` class is applied if invalid. | boolean | true |
| value | The value of the input. | string | "" |
Properties
| Name | Attribute | Description | Type | Default |
| autoCapitalize | autoCapitalize | The HTML5 input `autocapitalize` attribute passed to the input element. | "none" | "off" | "on" | "sentences" | "words" | "characters" | "off" |
| clearable | clearable | Sets whether there should be a clear icon-button to clear the input. | boolean | false |
| disabled | disabled | Sets the input as disabled. | boolean | false |
| focused | focused | Sets the input as focused. | boolean | false |
| inputHidden | inputHidden | Sets the input element as hidden. | boolean | false |
| inputOnActive | inputOnActive | Whether the input should appear *only* when the element is active or focused | boolean | false |
| label | label | The text for the label. | string | "" |
| mask | mask | The IMask to use with the input. | MaskedDateOptions | MaskedNumberOptions | MaskedPatternOptions | MaskedOptions | ... 12 more ... | null | undefined |
| max | max | The `max` attribute on the input. | string | number | "" |
| min | min | The `min` attribute on the input. | string | number | "" |
| name | name | The `name` attribute on the input. | string | "" |
| placeholder | placeholder | The `placeholder` attribute on the input. | string | "" |
| readOnly | readOnly | Sets the input as readonly. | boolean | false |
| required | required | Sets the input as required. | boolean | false |
| type | type | The `type` attribute of the input. | HTMLInputElementType | "text" |
| valid | valid | Sets the input as valid.
The `awc-input--invalid` class is applied if invalid. | boolean | true |
| value | value | The value of the input. | string | "" |
| renderRoot | undefined | Node or ShadowRoot into which element DOM should be rendered. Defaults
to an open shadowRoot. | HTMLElement | ShadowRoot | undefined |
| isUpdatePending | undefined | undefined | boolean | undefined |
| hasUpdated | undefined | undefined | boolean | undefined |
| updateComplete | undefined | Returns a Promise that resolves when the element has completed updating.
The Promise value is a boolean that is `true` if the element completed the
update without triggering another update. The Promise result is `false` if
a property was set inside `updated()`. If the Promise is rejected, an
exception was thrown during the update.
To await additional asynchronous work, override the `getUpdateComplete`
method. For example, it is sometimes useful to await a rendered element
before fulfilling this Promise. To do this, first await
`super.getUpdateComplete()`, then any subsequent state. | Promise | undefined |
Events
| Name | Description |
| clear | undefined |
| input | undefined |
| invalid | Example Usage:
<awc-input></awc-input> |
| blur | undefined |
| focus | undefined |
API
<awc-list>
An Act! Web Component List Element. This component should be used any time
an iterable data set of items is desired.
Attributes
| Name | Description | Type | Default |
| caseSensitiveFilter | Whether the list filtering should be case sensitive | boolean | false |
| filtered | Whether the list is filtered | boolean | false |
| multi | Whether the list allows multiple values | boolean | false |
| items | The list of items slotted into this element | ActListItemElement[] | [] |
Properties
| Name | Attribute | Description | Type | Default |
| caseSensitiveFilter | caseSensitiveFilter | Whether the list filtering should be case sensitive | boolean | false |
| filtered | filtered | Whether the list is filtered | boolean | false |
| multi | multi | Whether the list allows multiple values | boolean | false |
| items | items | The list of items slotted into this element | ActListItemElement[] | [] |
| slotElement | undefined | undefined | HTMLSlotElement | undefined |
| hasFilteredValue | undefined | Whether the list has a value found by the filter | boolean | false |
| selectedItems | undefined | Returns the items that have the `selected` property set to `true` | ActListItemElement[] | undefined |
| renderRoot | undefined | Node or ShadowRoot into which element DOM should be rendered. Defaults
to an open shadowRoot. | HTMLElement | ShadowRoot | undefined |
| isUpdatePending | undefined | undefined | boolean | undefined |
| hasUpdated | undefined | undefined | boolean | undefined |
| updateComplete | undefined | Returns a Promise that resolves when the element has completed updating.
The Promise value is a boolean that is `true` if the element completed the
update without triggering another update. The Promise result is `false` if
a property was set inside `updated()`. If the Promise is rejected, an
exception was thrown during the update.
To await additional asynchronous work, override the `getUpdateComplete`
method. For example, it is sometimes useful to await a rendered element
before fulfilling this Promise. To do this, first await
`super.getUpdateComplete()`, then any subsequent state. | Promise | undefined |
Events
| Name | Description |
| itemselect | Example Usage:
<awc-list></awc-list> |
API
<awc-list-item>
An Act! Web Component List Item Element.
Attributes
| Name | Description | Type | Default |
| disabled | Flag denoting whether the list item is disabled or not | boolean | false |
| value | The value of the list item. Used for list selection | string | null | undefined |
Properties
| Name | Attribute | Description | Type | Default |
| disabled | disabled | Flag denoting whether the list item is disabled or not | boolean | false |
| selected | undefined | Flag denoting whether the list item is currently selected | boolean | undefined |
| value | value | The value of the list item. Used for list selection | string | null | undefined |
| text | undefined | undefined | string | undefined |
| renderRoot | undefined | Node or ShadowRoot into which element DOM should be rendered. Defaults
to an open shadowRoot. | HTMLElement | ShadowRoot | undefined |
| isUpdatePending | undefined | undefined | boolean | undefined |
| hasUpdated | undefined | undefined | boolean | undefined |
| updateComplete | undefined | Returns a Promise that resolves when the element has completed updating.
The Promise value is a boolean that is `true` if the element completed the
update without triggering another update. The Promise result is `false` if
a property was set inside `updated()`. If the Promise is rejected, an
exception was thrown during the update.
To await additional asynchronous work, override the `getUpdateComplete`
method. For example, it is sometimes useful to await a rendered element
before fulfilling this Promise. To do this, first await
`super.getUpdateComplete()`, then any subsequent state. | Promise | undefined |
Events
| Name | Description |
| itemrender | Example Usage:
<awc-list-item></awc-list-item> |
| itemselect | undefined |
API
<awc-list-item-divider>
An Act! Web Component List Item Divider Element.
Used in lists to separate groups of items. Styles modify based
on the type of list the divider exists in (e.g. menu list, etc.)
Example Usage:
<awc-list-item-divider></awc-list-item-divider>
Properties
| Name | Attribute | Description | Type | Default |
| renderRoot | undefined | Node or ShadowRoot into which element DOM should be rendered. Defaults
to an open shadowRoot. | HTMLElement | ShadowRoot | undefined |
| isUpdatePending | undefined | undefined | boolean | undefined |
| hasUpdated | undefined | undefined | boolean | undefined |
| updateComplete | undefined | Returns a Promise that resolves when the element has completed updating.
The Promise value is a boolean that is `true` if the element completed the
update without triggering another update. The Promise result is `false` if
a property was set inside `updated()`. If the Promise is rejected, an
exception was thrown during the update.
To await additional asynchronous work, override the `getUpdateComplete`
method. For example, it is sometimes useful to await a rendered element
before fulfilling this Promise. To do this, first await
`super.getUpdateComplete()`, then any subsequent state. | Promise | undefined |
API
<awc-loading>
An Act! Web Component Loading Element. Configure this element via the CSS variables.
CSS Overrides and Defaults:
* --awc-loading-animation-time: 2s;
* --awc-loading-animation-delay: 350ms;
* --awc-loading-dot-color: var(--green-3);
* --awc-loading-dot-size: 8px;
* --awc-loading-jump-height: 10px;
* --awc-loading-width: 68px;
Example Usage:
<awc-loading></awc-loading>
Properties
| Name | Attribute | Description | Type | Default |
| renderRoot | undefined | Node or ShadowRoot into which element DOM should be rendered. Defaults
to an open shadowRoot. | HTMLElement | ShadowRoot | undefined |
| isUpdatePending | undefined | undefined | boolean | undefined |
| hasUpdated | undefined | undefined | boolean | undefined |
| updateComplete | undefined | Returns a Promise that resolves when the element has completed updating.
The Promise value is a boolean that is `true` if the element completed the
update without triggering another update. The Promise result is `false` if
a property was set inside `updated()`. If the Promise is rejected, an
exception was thrown during the update.
To await additional asynchronous work, override the `getUpdateComplete`
method. For example, it is sometimes useful to await a rendered element
before fulfilling this Promise. To do this, first await
`super.getUpdateComplete()`, then any subsequent state. | Promise | undefined |
API
<awc-menu>
An Act! Web Component Menu Element.
Example Usage:
<awc-menu></awc-menu>
Attributes
| Name | Description | Type | Default |
| anchor | Anchor element to display off of. This is a required field. | HTMLElement | null | undefined |
| anchorPadding | Pixel value for padding between the MenuElement and the anchor. | number | 5 |
| closeonselect | Whether the menu should close once a selection is made. The selection will not persist on the list. | boolean | false |
| matchAnchorWidth | Flag for whether the MenuElement should restrict width based upon the anchor's width. | boolean | false |
| maxHeight | Unit based on vh | number | 70 |
| multi | Whether the list should act as a multi-selection list or not. | boolean | false |
| open | Flag denoting whether the menu is open or not. | boolean | false |
| positioningStrategy | undefined | PositioningStrategies | "relative" |
Properties
| Name | Attribute | Description | Type | Default |
| anchor | anchor | Anchor element to display off of. This is a required field. | HTMLElement | null | undefined |
| anchorPadding | anchorPadding | Pixel value for padding between the MenuElement and the anchor. | number | 5 |
| closeonselect | closeonselect | Whether the menu should close once a selection is made. The selection will not persist on the list. | boolean | false |
| matchAnchorWidth | matchAnchorWidth | Flag for whether the MenuElement should restrict width based upon the anchor's width. | boolean | false |
| maxHeight | maxHeight | Unit based on vh | number | 70 |
| multi | multi | Whether the list should act as a multi-selection list or not. | boolean | false |
| open | open | Flag denoting whether the menu is open or not. | boolean | false |
| positioningStrategy | positioningStrategy | undefined | PositioningStrategies | "relative" |
| listElement | undefined | The underlying `ActListElement` to handle list logic. | ActListElement | undefined |
| menuContainerElement | undefined | undefined | HTMLElement | undefined |
| slotElement | undefined | The slot element, allowing for detecting new nodes. | HTMLSlotElement | undefined |
| renderRoot | undefined | Node or ShadowRoot into which element DOM should be rendered. Defaults
to an open shadowRoot. | HTMLElement | ShadowRoot | undefined |
| isUpdatePending | undefined | undefined | boolean | undefined |
| hasUpdated | undefined | undefined | boolean | undefined |
| updateComplete | undefined | Returns a Promise that resolves when the element has completed updating.
The Promise value is a boolean that is `true` if the element completed the
update without triggering another update. The Promise result is `false` if
a property was set inside `updated()`. If the Promise is rejected, an
exception was thrown during the update.
To await additional asynchronous work, override the `getUpdateComplete`
method. For example, it is sometimes useful to await a rendered element
before fulfilling this Promise. To do this, first await
`super.getUpdateComplete()`, then any subsequent state. | Promise | undefined |
Events
| Name | Description |
| closed | undefined |
| opened | undefined |
| select | undefined |
API
<awc-select>
An Act! Web Component Select Element.
Example Usage:
<awc-select></awc-select>
Attributes
| Name | Description | Type | Default |
| autocomplete | Sets the typeahead functionality for filtering the list. | boolean | false |
| caseSensitive | Whether the autocomplete filtering should be case sensitive | boolean | undefined |
| concatenated | Sets that the items should display concatenated rather than the default bubbled. | boolean | false |
| delimiter | If multi and concatenated are set to true, this value is used to concatenate
the text for each of the selected values into the input element. | string | ", " |
| multi | Whether the select should allow multiple selection. | boolean | false |
| name | The name of the select element. Used for forms. | string | "" |
| label | The label for the element. | string | "" |
| limitToList | Whether the element is limited to the list provided,
or if the user should be allowed to enter their own value. | boolean | false |
| placeholder | The `placeholder` attribute on the input element. | string | "" |
| loading | Sets the element as in a loading state (used for async calls to the options) | boolean | false |
| value | undefined | string[] | [] |
Properties
| Name | Attribute | Description | Type | Default |
| autocomplete | autocomplete | Sets the typeahead functionality for filtering the list. | boolean | false |
| caseSensitive | caseSensitive | Whether the autocomplete filtering should be case sensitive | boolean | undefined |
| concatenated | concatenated | Sets that the items should display concatenated rather than the default bubbled. | boolean | false |
| delimiter | delimiter | If multi and concatenated are set to true, this value is used to concatenate
the text for each of the selected values into the input element. | string | ", " |
| multi | multi | Whether the select should allow multiple selection. | boolean | false |
| name | name | The name of the select element. Used for forms. | string | "" |
| label | label | The label for the element. | string | "" |
| limitToList | limitToList | Whether the element is limited to the list provided,
or if the user should be allowed to enter their own value. | boolean | false |
| placeholder | placeholder | The `placeholder` attribute on the input element. | string | "" |
| loading | loading | Sets the element as in a loading state (used for async calls to the options) | boolean | false |
| value | value | undefined | string[] | [] |
| items | undefined | Returns the items on the ActListElement. | ActListItemElement[] | undefined |
| listElement | undefined | Returns the ActListElement in the ActMenuElement. | ActListElement | undefined |
| selectedItems | undefined | Returns the selected items from the ActListElement. | ActListItemElement[] | undefined |
| renderRoot | undefined | Node or ShadowRoot into which element DOM should be rendered. Defaults
to an open shadowRoot. | HTMLElement | ShadowRoot | undefined |
| isUpdatePending | undefined | undefined | boolean | undefined |
| hasUpdated | undefined | undefined | boolean | undefined |
| updateComplete | undefined | Returns a Promise that resolves when the element has completed updating.
The Promise value is a boolean that is `true` if the element completed the
update without triggering another update. The Promise result is `false` if
a property was set inside `updated()`. If the Promise is rejected, an
exception was thrown during the update.
To await additional asynchronous work, override the `getUpdateComplete`
method. For example, it is sometimes useful to await a rendered element
before fulfilling this Promise. To do this, first await
`super.getUpdateComplete()`, then any subsequent state. | Promise | undefined |
Events
| Name | Description |
| blur | undefined |
| focus | undefined |
API
<awc-tab>
An Act! Web Component Tab Element.
Attributes
| Name | Description | Type | Default |
| href | Used when the tab should route to a new page | string | null | undefined |
| label | Sets the label for the tab item in the selection list | string | "" |
| name | Used for routing | string | "" |
| noPagePadding | Whether the tab will have page padding styles applied | boolean | false |
Properties
| Name | Attribute | Description | Type | Default |
| href | href | Used when the tab should route to a new page | string | null | undefined |
| label | label | Sets the label for the tab item in the selection list | string | "" |
| name | name | Used for routing | string | "" |
| noPagePadding | noPagePadding | Whether the tab will have page padding styles applied | boolean | false |
| renderRoot | undefined | Node or ShadowRoot into which element DOM should be rendered. Defaults
to an open shadowRoot. | HTMLElement | ShadowRoot | undefined |
| isUpdatePending | undefined | undefined | boolean | undefined |
| hasUpdated | undefined | undefined | boolean | undefined |
| updateComplete | undefined | Returns a Promise that resolves when the element has completed updating.
The Promise value is a boolean that is `true` if the element completed the
update without triggering another update. The Promise result is `false` if
a property was set inside `updated()`. If the Promise is rejected, an
exception was thrown during the update.
To await additional asynchronous work, override the `getUpdateComplete`
method. For example, it is sometimes useful to await a rendered element
before fulfilling this Promise. To do this, first await
`super.getUpdateComplete()`, then any subsequent state. | Promise | undefined |
Events
| Name | Description |
| tabrendered | Example Usage:
<awc-tab></awc-tab> |
API
<awc-table>
An Act! Web Component Table Element.
The table element displays as a 12 column grid. The grid
can be used to position your cells hows you would like.
Furthermore, the 12 grid alignment allows for customization
of the grid columns by the user via drag functionality.
NOTE: If you want a header, you need to add the `awc-table-header`
element to the `awc-table` as a slot item. You can attach the table
to a header in a different location utilizing the `for` attribute
and passing the `awc-table` id to it.
Attributes
| Name | Description | Type | Default |
| columnDefinitions | undefined | ActTableColumnDefinitionElement[] | [] |
| data | undefined | array | [] |
| gridColumns | undefined | number | "COLUMNS" |
| headerElement | undefined | ActTableHeaderElement | null | undefined |
| loading | undefined | boolean | false |
| triggerThreshold | undefined | number | 75 |
Properties
| Name | Attribute | Description | Type | Default |
| columnDefinitions | columnDefinitions | undefined | ActTableColumnDefinitionElement[] | [] |
| data | data | undefined | array | [] |
| gridColumns | gridColumns | undefined | number | "COLUMNS" |
| headerElement | headerElement | undefined | ActTableHeaderElement | null | undefined |
| loading | loading | undefined | boolean | false |
| triggerThreshold | triggerThreshold | undefined | number | 75 |
| emptySlotElement | undefined | undefined | HTMLSlotElement | undefined |
| loadingElement | undefined | undefined | ActLoadingElement | undefined |
| slotElement | undefined | undefined | HTMLSlotElement | undefined |
| keyFunction | undefined | undefined | (data: any) => any | "(data: any) => data.id" |
| showingColumnDefinitions | undefined | undefined | ActTableColumnDefinitionElement[] | undefined |
| renderRoot | undefined | Node or ShadowRoot into which element DOM should be rendered. Defaults
to an open shadowRoot. | HTMLElement | ShadowRoot | undefined |
| isUpdatePending | undefined | undefined | boolean | undefined |
| hasUpdated | undefined | undefined | boolean | undefined |
| updateComplete | undefined | Returns a Promise that resolves when the element has completed updating.
The Promise value is a boolean that is `true` if the element completed the
update without triggering another update. The Promise result is `false` if
a property was set inside `updated()`. If the Promise is rejected, an
exception was thrown during the update.
To await additional asynchronous work, override the `getUpdateComplete`
method. For example, it is sometimes useful to await a rendered element
before fulfilling this Promise. To do this, first await
`super.getUpdateComplete()`, then any subsequent state. | Promise | undefined |
Events
| Name | Description |
| itemselect | undefined |
| scrolltrigger | Example Usage:
<awc-table></awc-table> |
| rowselect | undefined |
API
<awc-table-column-definition>
An Act! Web Component Table Column Definition Element.
Attributes
| Name | Description | Type | Default |
| active | undefined | boolean | false |
| cellConditional | undefined | boolean | false |
| columnSelectable | undefined | boolean | false |
| columnSelectionHeader | undefined | boolean | false |
| columnSort | undefined | ActTableColumnSortDirection | "none" |
| columnSpan | undefined | number | 1 |
| columnStart | undefined | number | 12 |
| fixed | Whether the column can be de-selected (fixed = true cannot de-select) | boolean | false |
| fixedSpan | Fixes the value of the span for the grid column | boolean | false |
| hidden | undefined | boolean | false |
| name | undefined | string | "" |
| order | undefined | number | 12 |
| property | undefined | string | null | undefined |
Properties
| Name | Attribute | Description | Type | Default |
| active | active | undefined | boolean | false |
| cellConditional | cellConditional | undefined | boolean | false |
| columnSelectable | columnSelectable | undefined | boolean | false |
| columnSelectionHeader | columnSelectionHeader | undefined | boolean | false |
| columnSort | columnSort | undefined | ActTableColumnSortDirection | "none" |
| columnSpan | columnSpan | undefined | number | 1 |
| columnStart | columnStart | undefined | number | 12 |
| fixed | fixed | Whether the column can be de-selected (fixed = true cannot de-select) | boolean | false |
| fixedSpan | fixedSpan | Fixes the value of the span for the grid column | boolean | false |
| hidden | hidden | undefined | boolean | false |
| name | name | undefined | string | "" |
| order | order | undefined | number | 12 |
| property | property | undefined | string | null | undefined |
| cellElements | undefined | undefined | HTMLElement[] | undefined |
| headerElements | undefined | undefined | HTMLElement[] | undefined |
| headerText | undefined | undefined | string | null | undefined |
| renderRoot | undefined | Node or ShadowRoot into which element DOM should be rendered. Defaults
to an open shadowRoot. | HTMLElement | ShadowRoot | undefined |
| isUpdatePending | undefined | undefined | boolean | undefined |
| hasUpdated | undefined | undefined | boolean | undefined |
| updateComplete | undefined | Returns a Promise that resolves when the element has completed updating.
The Promise value is a boolean that is `true` if the element completed the
update without triggering another update. The Promise result is `false` if
a property was set inside `updated()`. If the Promise is rejected, an
exception was thrown during the update.
To await additional asynchronous work, override the `getUpdateComplete`
method. For example, it is sometimes useful to await a rendered element
before fulfilling this Promise. To do this, first await
`super.getUpdateComplete()`, then any subsequent state. | Promise | undefined |
Events
| Name | Description |
| columnselect | Example Usage:
<awc-table-column-definition></awc-table-column-definition> |
| tabledefinitionrender | undefined |
| tabledefinitionupdate | undefined |
| elementclick | undefined |
API
<awc-table-column-selection>
An Act! Web Component TableColumnSelection Element.
Attributes
| Name | Description | Type | Default |
| columns | undefined | ActTableColumnDefinitionElement[] | [] |
Properties
| Name | Attribute | Description | Type | Default |
| columns | columns | undefined | ActTableColumnDefinitionElement[] | [] |
| iconButtonElement | undefined | undefined | ActIconButtonElement | undefined |
| menuElement | undefined | undefined | ActMenuElement | undefined |
| items | undefined | Returns the items on the ActListElement. | ActListItemElement[] | undefined |
| listElement | undefined | Returns the ActListElement in the ActMenuElement. | ActListElement | undefined |
| selectedItems | undefined | Returns the selected items from the ActListElement. | ActListItemElement[] | undefined |
| renderRoot | undefined | Node or ShadowRoot into which element DOM should be rendered. Defaults
to an open shadowRoot. | HTMLElement | ShadowRoot | undefined |
| isUpdatePending | undefined | undefined | boolean | undefined |
| hasUpdated | undefined | undefined | boolean | undefined |
| updateComplete | undefined | Returns a Promise that resolves when the element has completed updating.
The Promise value is a boolean that is `true` if the element completed the
update without triggering another update. The Promise result is `false` if
a property was set inside `updated()`. If the Promise is rejected, an
exception was thrown during the update.
To await additional asynchronous work, override the `getUpdateComplete`
method. For example, it is sometimes useful to await a rendered element
before fulfilling this Promise. To do this, first await
`super.getUpdateComplete()`, then any subsequent state. | Promise | undefined |
Events
| Name | Description |
| columnselect | Example Usage:
<awc-table-column-selection></awc-table-column-selection> |
| tablecolumnselectionrender | undefined |
API
<awc-table-header>
An Act! Web Component Table Header Element.
Attributes
| Name | Description | Type | Default |
| columnDefinitions | undefined | ActTableColumnDefinitionElement[] | [] |
| for | undefined | string | null | undefined |
Properties
| Name | Attribute | Description | Type | Default |
| columnDefinitions | columnDefinitions | undefined | ActTableColumnDefinitionElement[] | [] |
| for | for | undefined | string | null | undefined |
| columnSelectionElement | undefined | undefined | ActTableColumnSelectionElement | undefined |
| columnHeaderList | undefined | undefined | HTMLElement | undefined |
| renderRoot | undefined | Node or ShadowRoot into which element DOM should be rendered. Defaults
to an open shadowRoot. | HTMLElement | ShadowRoot | undefined |
| isUpdatePending | undefined | undefined | boolean | undefined |
| hasUpdated | undefined | undefined | boolean | undefined |
| updateComplete | undefined | Returns a Promise that resolves when the element has completed updating.
The Promise value is a boolean that is `true` if the element completed the
update without triggering another update. The Promise result is `false` if
a property was set inside `updated()`. If the Promise is rejected, an
exception was thrown during the update.
To await additional asynchronous work, override the `getUpdateComplete`
method. For example, it is sometimes useful to await a rendered element
before fulfilling this Promise. To do this, first await
`super.getUpdateComplete()`, then any subsequent state. | Promise | undefined |
Events
| Name | Description |
| columnchange | undefined |
| columnselect | undefined |
| columnsort | Example Usage:
<awc-table-header></awc-table-header> |
| headerrender | undefined |
API
<awc-tabs>
An Act! Web Component Tabs Element.
Attributes
| Name | Description | Type | Default |
| tabs | The ActTabElements rendered by this element. | ActTabElement[] | [] |
| vertical | Flag to show the tabs as vertical, next to the content. | boolean | false |
| viewIndex | The current index of the tab that is viewed. | number | 0 |
Properties
| Name | Attribute | Description | Type | Default |
| tabs | tabs | The ActTabElements rendered by this element. | ActTabElement[] | [] |
| vertical | vertical | Flag to show the tabs as vertical, next to the content. | boolean | false |
| viewIndex | viewIndex | The current index of the tab that is viewed. | number | 0 |
| tabsListIndicator | undefined | The indicator displayed when the tabs are in horizontal positioning. | HTMLElement | undefined |
| tabsList | undefined | The list of tab labels used for tab selection. | HTMLElement | undefined |
| currentTab | undefined | Returns the currently viewed ActTabElement. | ActTabElement | null | undefined |
| renderRoot | undefined | Node or ShadowRoot into which element DOM should be rendered. Defaults
to an open shadowRoot. | HTMLElement | ShadowRoot | undefined |
| isUpdatePending | undefined | undefined | boolean | undefined |
| hasUpdated | undefined | undefined | boolean | undefined |
| updateComplete | undefined | Returns a Promise that resolves when the element has completed updating.
The Promise value is a boolean that is `true` if the element completed the
update without triggering another update. The Promise result is `false` if
a property was set inside `updated()`. If the Promise is rejected, an
exception was thrown during the update.
To await additional asynchronous work, override the `getUpdateComplete`
method. For example, it is sometimes useful to await a rendered element
before fulfilling this Promise. To do this, first await
`super.getUpdateComplete()`, then any subsequent state. | Promise | undefined |
Events
| Name | Description |
| tabchange | Example Usage:
<awc-tabs></awc-tabs> |
API
<awc-virtual-scroll>
An Act! Web Component VirtualScroll Element.
Example Usage:
<awc-virtual-scroll></awc-virtual-scroll>
Properties
| Name | Attribute | Description | Type | Default |
| renderRoot | undefined | Node or ShadowRoot into which element DOM should be rendered. Defaults
to an open shadowRoot. | HTMLElement | ShadowRoot | undefined |
| isUpdatePending | undefined | undefined | boolean | undefined |
| hasUpdated | undefined | undefined | boolean | undefined |
| updateComplete | undefined | Returns a Promise that resolves when the element has completed updating.
The Promise value is a boolean that is `true` if the element completed the
update without triggering another update. The Promise result is `false` if
a property was set inside `updated()`. If the Promise is rejected, an
exception was thrown during the update.
To await additional asynchronous work, override the `getUpdateComplete`
method. For example, it is sometimes useful to await a rendered element
before fulfilling this Promise. To do this, first await
`super.getUpdateComplete()`, then any subsequent state. | Promise | undefined |