Skip to main content

fast-foundation

Classes#

ClassDescription
AccordionAn Accordion Custom HTML Element Implements ARIA Accordion.
AccordionItemAn individual item in an Accordion.
AnchorAn Anchor Custom HTML Element. Based largely on the <a> element.
AnchoredRegion(BETA) An anchored region Custom HTML Element.
ARIAGlobalStatesAndPropertiesSome states and properties are applicable to all host language elements regardless of whether a role is applied. The following global states and properties are supported by all roles and by all base markup elements. https://www.w3.org/TR/wai-aria-1.1/#global_statesThis is intended to be used as a mixin. Be sure you extend FASTElement.
AvatarAn Avatar Custom HTML Element
BadgeA Badge Custom HTML Element.
BaseProgressAn Progress HTML Element. Implements the ARIA progressbar.
BreadcrumbA Breadcrumb Custom HTML Element.
BreadcrumbItemA Breadcrumb Item Custom HTML Element.
ButtonA Button Custom HTML Element. Based largely on the <button> element.
CalendarCalendar component
CardAn Card Custom HTML Element.
CheckboxA Checkbox Custom HTML Element. Implements the ARIA checkbox.
ComboboxA Combobox Custom HTML Element. Implements the ARIA combobox.
DataGridA Data Grid Custom HTML Element.
DataGridCellA Data Grid Cell Custom HTML Element.
DataGridRowA Data Grid Row Custom HTML Element.
DateFormatterDate formatting utility
DefaultComponentPresentationThe default implementation of ComponentPresentation, used by FoundationElement.
DelegatesARIAButtonIncludes ARIA states and properties relating to the ARIA button role
DelegatesARIAComboboxIncludes ARIA states and properties relating to the ARIA combobox role.
DelegatesARIALinkIncludes ARIA states and properties relating to the ARIA link role
DelegatesARIAListboxIncludes ARIA states and properties relating to the ARIA listbox role
DelegatesARIASearchIncludes ARIA states and properties relating to the ARIA textbox role
DelegatesARIASelectIncludes ARIA states and properties relating to the ARIA select role.
DelegatesARIATextboxIncludes ARIA states and properties relating to the ARIA textbox role
DelegatesARIAToolbarIncludes ARIA states and properties relating to the ARIA toolbar role
DialogA Switch Custom HTML Element. Implements the ARIA dialog.
DisclosureA Disclosure Custom HTML Element. Based largely on the disclosure element.
DividerA Divider Custom HTML Element. Implements the ARIA separator or ARIA presentation.
FlipperA Flipper Custom HTML Element. Flippers are a form of button that implies directional content navigation, such as in a carousel.
FoundationElementDefines a foundation element class that: 1. Connects the element to its ComponentPresentation 2. Allows resolving the element template from the instance or ComponentPresentation 3. Allows resolving the element styles from the instance or ComponentPresentation
HorizontalScrollA HorizontalScroll Custom HTML Element
ListboxA Listbox Custom HTML Element. Implements the ARIA listbox.
ListboxElementA Listbox Custom HTML Element. Implements the ARIA listbox.
ListboxOptionAn Option Custom HTML Element. Implements ARIA option.
MatchMediaBehaviorAn abstract behavior to react to media queries. Implementations should implement the constructListener method to perform some action based on media query changes.
MatchMediaStyleSheetBehaviorA behavior to add or remove a stylesheet from an element based on a media query. The behavior ensures that styles are applied while the a query matches the environment and that styles are not applied if the query does not match the environment.
MenuA Menu Custom HTML Element. Implements the ARIA menu.
MenuItemA Switch Custom HTML Element. Implements ARIA menuitem, ARIA menuitemcheckbox, or ARIA menuitemradio.
NumberFieldA Number Field Custom HTML Element. Based largely on the <input type="number" /> element.
PropertyStyleSheetBehaviorA behavior to add or remove a stylesheet from an element based on a property. The behavior ensures that styles are applied while the property matches and that styles are not applied if the property does not match.
RadioA Radio Custom HTML Element. Implements the ARIA radio.
RadioGroupAn Radio Group Custom HTML Element. Implements the ARIA radiogroup.
ResolverBuilderA utility class used that constructs and registers resolvers for a dependency injection container. Supports a standard set of object lifetimes.
SearchA Search Custom HTML Element. Based largely on the <input type="search" /> element.
SelectA Select Custom HTML Element. Implements the ARIA select.
SkeletonA Skeleton Custom HTML Element.
SliderA Slider Custom HTML Element. Implements the ARIA slider.
SliderLabelA label element intended to be used with the Slider component.
StartEndA mixin class implementing start and end elements. These are generally used to decorate text elements with icons or other visual indicators.
SwitchA Switch Custom HTML Element. Implements the ARIA switch.
TabA Tab Component to be used with Tabs
TabPanelA TabPanel Component to be used with Tabs
TabsA Tabs Custom HTML Element. Implements the ARIA tablist.
TextAreaA Text Area Custom HTML Element. Based largely on the <textarea> element.
TextFieldA Text Field Custom HTML Element. Based largely on the <input type="text" /> element.
ToolbarA Toolbar Custom HTML Element. Implements the ARIA Toolbar.
TooltipAn Tooltip Custom HTML Element.
TreeItemA Tree item Custom HTML Element.
TreeViewA Tree view Custom HTML Element. Implements the ARIA TreeView.

Enumerations#

EnumerationDescription
AccordionExpandModeExpand mode for Accordion
ComboboxAutocompleteAutocomplete values for combobox.
DataGridCellTypesEnumerates possible cell types.
DataGridRowTypesEnumerates possible row types
DividerRoleDivider roles
FlipperDirectionThe direction options for flipper.
GenerateHeaderOptionsEnumerates auto generated header options default option generates a non-sticky header row
ListboxRoleListbox role.
MenuItemRoleMenu items roles.
SelectPositionPositioning directions for the listbox when a select is open.
SelectRoleSelect role.
SliderModeThe selection modes of a Slider.
TabsOrientationThe orientation of the Tabs component
TextAreaResizeResize mode for a TextArea
TextFieldTypeText field sub-types
TooltipPositionEnumerates possible tooltip positions

Functions#

FunctionDescription
applyMixins(derivedCtor, baseCtors)Apply mixins to a constructor. Sourced from TypeScript Documentation.
composedContains(reference, test)Determines if the reference element contains the test element in a "composed" DOM tree that ignores shadow DOM boundaries.Returns true of the test element is a descendent of the reference, or exist in a shadow DOM that is a logical descendent of the reference. Otherwise returns false.
composedParent(element)Retrieves the "composed parent" element of a node, ignoring DOM tree boundaries. When the parent of a node is a shadow-root, it will return the host element of the shadow root. Otherwise it will return the parent node or null if no parent node exists.
display(displayValue)Applies a CSS display property. Also adds CSS rules to not display the element when the [hidden] attribute is applied to the element.
ignore(target, property, descriptor)A decorator that tells the container not to try to inject a dependency.
isListboxOption(el)Determines if the element is a ListboxOption
isTreeItemElement(el)check if the item is a tree item
singleton()Registers the decorated class as a singleton dependency; the class will only be created once. Each consecutive time the dependency is resolved, the same instance will be returned.
singleton(options)
singleton(target)Registers the target class as a singleton dependency; the class will only be created once. Each consecutive time the dependency is resolved, the same instance will be returned.
transient()Registers the decorated class as a transient dependency; each time the dependency is resolved a new instance will be created.
transient(target)Registers the target class as a transient dependency; each time the dependency is resolved a new instance will be created.
whitespaceFilter(value, index, array)a method to filter out any whitespace _only_ nodes, to be used inside a template

Interfaces#

InterfaceDescription
ColumnDefinitionDefines a column in the grid
ComponentPresentationApplies presentation details, such as template and styles, to a component instance.
ContainerImplemented by dependency injection containers.
ContainerConfigurationConfiguration for a dependency injection container.
CSSDesignTokenA that emits a CSS custom property.
DesignSystemRepresents a configurable design system.
DesignSystemRegistrationContextDesign system contextual APIs and configuration usable within component registries.
DesignTokenDescribes a DesignToken instance.
DesignTokenChangeRecordChange record provided to to a DesignTokenSubscriber when a token changes for a target.
DesignTokenConfigurationDescribes a configuration
DesignTokenSubscriberA subscriber that should receive change records when a token changes for a target
ElementDefinitionContextThe design system context in which an element can be defined.
ElementDefinitionParamsThe element definition context interface. Designed to be used in tryDefineElement
FactoryUsed by the default Resolver to create instances of objects when needed.
FoundationElementDefinitionAn element definition used to define a FoundationElement when registered through the design system registry.
InterfaceConfigurationUsed to configure a dependency injection interface key.
RegistrationImplemented by objects that wish to register dependencies in the container by creating resolvers.
RegistryImplemented by objects that which to register dependencies in a container.
ResolverInternally, the DI system maps "keys" to "resolvers". A resolver controls how a dependency is resolved. Resolvers for transient, singleton, etc. are provided out of the box, but you can also implement Resolver yourself and supply custom logic for resolution.
ServiceLocatorImplemented by objects capable of resolving services and other dependencies.
SliderConfigurationThe configuration structure of Slider.

Variables#

VariableDescription
accordionItemTemplateThe template for the AccordionItem component.
accordionTemplateThe template for the Accordion component.
allA decorator and DI resolver that will resolve an array of all dependencies registered with the specified key.
anchoredRegionTemplate(BETA) The template for the AnchoredRegion component.
anchorTemplateThe template for the Anchor component.
avatarTemplateThe template for Avatar component.
badgeTemplateThe template for the Badge component.
breadcrumbItemTemplateThe template for the BreadcrumbItem component.
breadcrumbTemplateThe template for the Breadcrumb component.
buttonTemplateThe template for the Button component.
calendarCellTemplateA calendar day template
calendarRowTemplate
calendarTemplateThe template for the Calendar component.
CalendarTitleTemplateA basic Calendar title template that includes the month and year
calendarWeekdayTemplateCalendar weekday label template
cardTemplateThe template for the Card component.
checkboxTemplateThe template for the Checkbox component.
comboboxTemplateThe template for the Combobox component.
ComponentPresentationAn API gateway to component presentation features.
ContainerThe interface key that resolves the dependency injection container itself.
ContainerConfigurationConfiguration for a dependency injection container.
darkModeStylesheetBehaviorThis can be used to construct a behavior to apply a prefers color scheme: dark only stylesheet.
dataGridCellTemplateGenerates a template for the DataGridCell component using the provided prefix.
dataGridRowTemplateGenerates a template for the DataGridRow component using the provided prefix.
dataGridTemplateGenerates a template for the DataGrid component using the provided prefix.
DefaultResolverA set of default resolvers useful in configuring a container.
DesignSystemAn API gateway to design system features.
DesignTokenFactory object for creating instances.
DIThe gateway to dependency injection APIs.
dialogTemplateThe template for the Dialog component.
disabledCursorThe CSS value for disabled cursors.
disclosureTemplateThe template for the Disclosure component.
dividerTemplateThe template for the Divider component.
ElementDisambiguationIndicates what to do with an ambiguous (duplicate) element.
endSlotTemplateThe template for the end element. For use with StartEnd
endTemplateThe template for the end element. For use with StartEnd
flipperTemplateThe template for the Flipper component.
focusVisibleThe string representing the focus selector to be used. Value will be "focus-visible" when https://drafts.csswg.org/selectors-4/\#the-focus-visible-pseudo is supported and "focus" when it is not.
forcedColorsStylesheetBehaviorThis can be used to construct a behavior to apply a forced-colors only stylesheet.
getDirectiona method to determine the current localization direction of the view
hiddenA CSS fragment to set display: none; when the host is hidden using the [hidden] attribute.
horizontalScrollTemplate
injectA decorator that specifies what to inject into its target.
lazyA decorator that lazily injects a dependency depending on whether the Key is present at the time of function call.
lightModeStylesheetBehaviorThis can be used to construct a behavior to apply a prefers color scheme: light only stylesheet.
listboxOptionTemplateThe template for the ListboxOption component.
listboxTemplateThe template for the Listbox component.
menuItemTemplateGenerates a template for the MenuItem component using the provided prefix.
menuTemplateThe template for the Menu component.
newInstanceForScopeA decorator that indicates that a new instance should be injected scoped to the container that requested the instance.
newInstanceOfA decorator that indicates that a new instance should be injected.
numberFieldTemplateThe template for the NumberField component.
optionalA decorator that allows you to optionally inject a dependency depending on whether the [[Key]] is present, for example:
pickerListItemTemplate
pickerListTemplate
pickerMenuOptionTemplate
pickerMenuTemplateThe template for the List Picker component.
pickerTemplateThe template for the List Picker component.
progressRingTemplateThe template for the BaseProgress component.
progressTemplateThe template for the BaseProgress component.
radioGroupTemplateThe template for the RadioGroup component.
radioTemplateThe template for the Radio component.
RegistrationYou can use the resulting Registration of any of the factory methods to register with the container.
searchTemplateThe template for the Search component.
selectTemplateThe template for the Select component.
ServiceLocatorThe interface key that resolves the service locator itself.
skeletonTemplateThe template for the fast-skeleton component
sliderLabelTemplateThe template for the SliderLabel component.
sliderTemplateThe template for the Slider component.
startSlotTemplateThe template for the start element. For use with StartEnd
startTemplateThe template for the start element. For use with StartEnd
switchTemplateThe template for the Switch component.
tabPanelTemplateThe template for the TabPanel component.
tabsTemplateThe template for the Tabs component.
tabTemplateThe template for the Tab component.
textAreaTemplateThe template for the TextArea component.
textFieldTemplateThe template for the TextField component.
toolbarTemplateThe template for the Toolbar component.
tooltipTemplateCreates a template for the Tooltip component using the provided prefix.
treeItemTemplateThe template for the TreeItem component.
treeViewTemplateThe template for the TreeView component.

Type Aliases#

Type AliasDescription
AccordionItemOptionsAccordion Item configuration options
AnchoredRegionPositionLabel(BETA) Describes the possible positions of the region relative to its anchor. Depending on the axis start = left/top, end = right/bottom
AnchorOptionsAnchor configuration options
AutoUpdateMode(BETA) Defines if the component updates its position automatically. Calling update() always provokes an update. anchor - the component only updates its position when the anchor resizes (default) auto - the component updates its position when: - update() is called - the anchor resizes - the window resizes - the viewport resizes - any scroll event in the document
AvatarOptionsAvatar configuration options
AxisPositioningMode(BETA) Defines the base behavior of an anchored region on a particular axis
AxisScalingMode(BETA) Defines the scaling behavior of an anchored region on a particular axis
BreadcrumbItemOptionsBreadcrumb Item configuration options
ButtonOptionsButton configuration options
CalendarDateInfoCaldendar date info used to represent a date
CalendarInfoCalendar information needed for rendering including the next and previous months
CalendarOptionsCalendar configuration options
CheckboxOptionsCheckbox configuration options
ComboboxOptionsCombobox configuration options
ContextualElementDefinitionEnables defining an element within the context of a design system.
CSSDisplayPropertyValueDefine all possible CSS display values.
DayFormatenum representing the different day formats
DerivedDesignTokenValueA value that is derived. These values can depend on other s or arbitrary observable properties.
DesignTokenValueThe type that a can be set to.
ElementDefinitionCallbackThe callback type that is invoked when an element can be defined by a design system.
ElementDisambiguationCallbackThe callback type that is invoked when two elements are trying to define themselves with the same name.
ElementDisambiguationResultRepresents the return values expected from an ElementDisambiguationCallback.
EndOptionsEnd configuration options
FlipperOptionsFlipper configuration options
FoundationElementTemplateA foundation element template function.
HorizontalPosition(BETA) Defines the horizontal positioning options for an anchored region
HorizontalScrollOptionsHorizontal scroll configuration options
HorizontalScrollViewThe views types for a horizontal-scroll HorizontalScroll
InjectableA class that declares constructor injected dependencies through a static "inject" field array of keys.
InterfaceSymbolA constant key that can be used to represent an interface to a registered dependency. The key can be used in DI registrations but also doubles as a decorator for resolving the associated, registered dependency.
KeyA key that is used to register dependencies with a dependency injection container.
ListboxOptionOptionsListbox option configuration options
MediaQueryListListenerAn event listener fired by a MediaQueryList.
MenuItemColumnCountTypes of menu item column count.
MenuItemOptionsMenu Item configuration options
MonthFormatenum representing the different month formats
MonthInfoInformation about a month
NumberFieldOptionsNumber Field configuration options
OverrideFoundationElementDefinitionA set of properties which the component consumer can override during the element registration process.
ParentLocatorA function capable of locating the parent container based on a container's owner.
ProgressOptionsProgress configuration options
ProgressRingOptionsProgressRing configuration options
RadioControlA structure representing a Radio element
RadioOptionsRadio configuration options
RegisterSelfRepresents an object that can register itself.
ResolveCallbackRepresents a custom callback for resolving a request from the container. The handler is the container that is invoking the callback. The requestor is the original container that made the request. The handler and the requestor may not be the same if the request has bubbled up to a parent container in the DI hierarchy. The resolver is the instance of the resolver that stores the callback. This is provided in case the callback needs a place or key against which to store state across resolutions.
ResolvedRepresents something resolved from a service locator.
ScrollEasingThe easing types available for the horizontal-scroll HorizontalScroll
SearchOptionsSearch configuration options
SelectOptionsSelect configuration options
SkeletonShapeA structure representing skeleton shapes
SliderOptionsSlider configuration options
StartEndOptionsStart/End configuration options
StartOptionsStart configuration options
StaticDesignTokenValueA design token value with no observable dependencies
SwitchOptionsSwitch configuration options
TabsOptionsTabs option configuration options
TextFieldOptionsText field configuration options
ToolbarOptionsToolbar configuration options
Transformer_2Transforms an object after it is created but before it is returned to the requestor.
TreeItemOptionsTree Item configuration options
VerticalPosition(BETA) Defines the vertical positioning options for an anchored region
WeekdayFormatenum representing the different weekday formats
YearFormatenum representing the different year formats