Components

Groups filter controls and their explanatory content.

react-and-vue

Navigates between pages of a collection.

proven-in-generated-apps

Edits a search query for a collection.

proven-in-generated-apps

Shows a collection column's current sort direction.

react-and-vue

Edits the tags assigned to a record.

proven-in-generated-apps

Presents a list of tags with tag editing controls.

react-and-vue

Displays tags as individual compact labels.

proven-in-generated-apps

Summarizes a record's tags.

proven-in-generated-apps

Displays a communication's recipients, channel and content.

proven-in-generated-apps

Lists recorded events in a message's lifecycle.

react-and-vue

Shows a message's delivery status.

react-and-vue

Selects a template from supplied choices.

proven-in-generated-apps

Labels a card with a title and supporting text.

proven-in-generated-apps

Names a record with a heading and optional supporting text.

proven-in-generated-apps

Groups a form label with supporting text.

react-and-vue

Displays a compact record label within a line of text.

proven-in-generated-apps

Shows a record label in a collection cell.

proven-in-generated-apps

Labels a timeline entry with a title and supporting text.

proven-in-generated-apps

Groups an address heading, summary and authored address content.

proven-in-generated-apps

Edits street, city, region and postal code through labelled inputs.

proven-in-generated-apps

Shows a compact address label or role.

react-and-vue

Lists recorded address validation events in time order.

react-and-vue

Shows a compact classification label.

react-and-vue

Presents category, tags and classification mode controls.

proven-in-generated-apps

Groups classification details and authored category content.

proven-in-generated-apps

Lists recorded membership changes over time.

react-and-vue

Groups membership information and authored content.

proven-in-generated-apps

Presents controls for a preference record.

proven-in-generated-apps

Groups preference details and authored content.

proven-in-generated-apps

Shows a compact preference summary.

react-and-vue

Lists recorded preference changes over time.

react-and-vue

Displays a timestamp relative to a reference time.

proven-in-generated-apps

Presents controls for assigning a role.

proven-in-generated-apps

Displays the roles assigned to a record.

react-and-vue

Displays a readable lifecycle status with its semantic tone.

proven-in-generated-apps

Displays text with a chosen semantic HTML element.

proven-in-generated-apps

Shows compact billing amount and interval metadata.

proven-in-generated-apps

Displays a formatted billing amount and optional interval.

proven-in-generated-apps

Edits a billing amount in the selected currency.

proven-in-generated-apps

Selects the interval for a recurring charge.

proven-in-generated-apps

Shows billing cycle progress and remaining days.

proven-in-generated-apps

Lists recorded payment events and timestamps.

proven-in-generated-apps

Shows payment status, method and scheduled payment dates.

proven-in-generated-apps

Displays a compact formatted price.

proven-in-generated-apps

Shows pricing metadata within a card.

react-and-vue

Summarizes an amount, currency and pricing model.

proven-in-generated-apps

Marks an archived collection row while retaining its content.

proven-in-generated-apps

Describes an archive event with its recorded timestamp.

react-and-vue

Marks whether a record is archived.

proven-in-generated-apps

Shows a record's archive status and related details.

proven-in-generated-apps

Shows one recorded audit event and its time.

react-and-vue

Summarizes audit coverage and recorded results.

react-and-vue

Lists entries from a record's audit log.

react-and-vue

Shows whether cancellation is scheduled.

proven-in-generated-apps

Describes a recorded cancellation and its time.

proven-in-generated-apps

Collects a cancellation reason and code.

proven-in-generated-apps

Shows the recorded cancellation terms for an item.

proven-in-generated-apps

Describes a recorded transition between lifecycle states.

react-and-vue

Selects a record's lifecycle status.

proven-in-generated-apps

Shows the current status and recorded lifecycle events.

proven-in-generated-apps

Displays a short label with a semantic status treatment.

react-and-vue

Presents a prominent message with optional actions and dismissal.

proven-in-generated-apps

Triggers an action using a labelled native button.

proven-in-generated-apps

Groups related content within a bordered surface.

proven-in-generated-apps

Toggles a labelled boolean value.

proven-in-generated-apps

Picks one value from a list by typing to filter it.

react-and-vue

Selects a date with a labelled native control.

proven-in-generated-apps

Asks for a decision or shows focused content in a window with a title, actions and a close button.

react-and-vue

Arranges child content in a responsive grid.

react-and-vue

Edits a scalar value with a labelled native input.

proven-in-generated-apps

Chooses one of two to five options shown as joined segments.

react-and-vue

Chooses one value from a labelled list of options.

proven-in-generated-apps

Arranges related child content vertically or horizontally.

proven-in-generated-apps

Turns a labelled setting on or off at once.

react-and-vue

Displays labelled columns and rows of tabular data.

react-and-vue

Switches between labelled panels of related content.

proven-in-generated-apps

Edits a multiline text value.

proven-in-generated-apps

Shows a compact owner label or supplied identifier.

proven-in-generated-apps

Displays compact ownership metadata.

proven-in-generated-apps

Summarizes the recorded owner, role and transfer information.

proven-in-generated-apps

Shows a label using an explicitly supplied color treatment.

react-and-vue

Edits the color state of a visual encoding.

react-and-vue

Displays a color sample with its label.

react-and-vue

Explains the colors assigned to lifecycle states.

react-and-vue

Edits axis labels, visibility and formatting.

react-and-vue

Summarizes the configured chart axes.

react-and-vue

Edits the chart's color encoding.

react-and-vue

Configures the chart's color legend.

react-and-vue

Labels a field's visual encoding.

react-and-vue

Edits the chart's opacity encoding.

react-and-vue

Summarizes the configured opacity encoding.

react-and-vue

Edits the chart's shape encoding.

react-and-vue

Explains the shapes assigned to chart categories.

react-and-vue

Edits the chart's size encoding.

react-and-vue

Summarizes the configured size encoding.

react-and-vue

Edits the settings for an area chart.

react-and-vue

Displays an area chart from bound chart data.

react-and-vue

Displays a graph or network chart from bound data.

proven-in-generated-apps

Edits the settings for a heatmap.

react-and-vue

Displays a heatmap from bound chart data.

react-and-vue

Edits the settings for a line chart.

react-and-vue

Displays a line chart from bound chart data.

proven-in-generated-apps

Edits the mark settings for a chart.

react-and-vue

Displays a chart using the bound mark specification.

proven-in-generated-apps

Edits the settings for point marks.

react-and-vue

Displays point marks from bound chart data.

react-and-vue

Labels a field's role in a chart.

react-and-vue

Edits the settings for a scatter plot.

react-and-vue

Displays a scatter plot from bound chart data.

react-and-vue

Edits scale settings for a visual encoding.

react-and-vue

Summarizes the configured visual scales.

react-and-vue

Displays a location preview from supplied geographic data.

react-and-vue

Maps record fields to geographic coordinates and identifiers.

react-and-vue

Shows the resolution state of a geographic lookup.

react-and-vue