hunterloftis


  • `<sp-radio>` and `<sp-radio-group>` allow users to select a single option from a list of mutually exclusive options. All possible options are exposed up front for users to compare.

    published 0.42.5 2 days ago
  • An `<sp-illustrated-message>` displays an illustration icon and a message, usually in an empty state or on an error page. It is also used inside a DropZone.

    published 0.42.5 2 days ago
  • An `<sp-button>` represents an action a user can take. sp-buttons can be clicked or tapped to perform an action or to navigate to another page. sp-buttons in Spectrum have several variations for different uses and multiple levels of loudness for various a

    published 0.42.5 2 days ago
  • `<sp-icon>` renders an icon to the page. By default the `name` attribute will pair with separately registered icon sets to deliver the icons. When not present, `<sp-icon>` will subsequently check for its `src` attribute which could populate the icon via a

    published 0.42.5 2 days ago
  • Shared mixins, tools, etc. that support developing Spectrum Web Components.

    published 0.42.5 2 days ago
  • `<sp-slider>` allows users to quickly select a value within a range. They should be used when the upper and lower bounds of the range are invariable.

    published 0.42.5 2 days ago
  • Side navigation allows users to locate information and features within the UI. It can be used for either hierarchical or flat navigation, and gives the ability to group navigable items categorically. Side navigation is an opportunity to prioritize content

    published 0.42.5 2 days ago
  • Spectrum Web Components are a [`LitElement`](https://lit-element.polymer-project.org)-powered web component library of patterns built on top of the [Spectrum CSS](https://opensource.adobe.com/spectrum-css) specification. Styles for these components are ma

    published 0.42.5 2 days ago
  • An `<sp-switch>` is used to turn an option on or off. Switches allow users to select the state of a single option at a time. Use a switch rather than a checkbox when activating (or deactivating) an option, instead of selecting.

    published 0.42.5 2 days ago
  • The `<sp-tab-list>` component contains set of tab-item elements. This is typically used as the interface for controlling a set of layered sections of content that display one panel of content at a time

    published 0.3.11 4 years ago
  • The `<sp-tab>` component is intended to be the child of an `<sp-tab-list>` element and accepts both a `label` attribute and a `[slot="icon"]` child to define its contents. Those contents can be further customized with the `vertical` attribute which stacks

    published 0.3.10 4 years ago
  • An **sp-theme** sets the rendering theme for all child components. The Spectrum design system supports four color themes and two different scales. `spectrum-web-components` currently supports two of the four color themes (dark and light) one one of the sc

    published 0.2.3 4 years ago
  • An `<sp-menu />` is used for creating a menu list. The various elements inside a menu are given as `<sp-menu-group/>`, `<sp-menu-item />`, or `<sp-menu-divider />`.

    published 0.5.4 4 years ago
  • `<sp-checkbox>` allow users to select multiple items from a list of independent options, or to mark an individual option as selected.

    published 0.42.5 2 days ago
  • `sp-textfield` components are text boxes that allow users to input custom text entries with a keyboard. Various decorations can be displayed around the field to communicate the entry requirements.

    published 0.42.5 2 days ago
  • An `<sp-dropdown>` is an alternative to HTML's `<select>` element. Use an `<sp-menu>` element to outline the options that will be made available to the user when interacting with the `<sp-dropdown>` element.

    published 0.10.1 3 years ago
  • An `<sp-action-menu>` is an action button that triggers an overlay with `<sp-menu-items>` for activation. Use an `<sp-menu>` element to outline the items that will be made available to the user when interacting with the `<sp-action-menu>` element. By defa

    published 0.42.5 2 days ago
  • `@spectrum-web-components/bundle` is a master dependency that allows a project to import any and all of the Spectrum Web Components. While it is a great approach to prototyping, the fact that is versions all of the Spectrum Web Components packages collect

    published 0.42.5 2 days ago
  • `sp-tooltip` allow users to get contextual help or information about specific components when hovering or focusing on them.

    published 0.42.5 2 days ago
  • A `<sp-actionbar>` delivers a floating action bar that is a convenient way to deliver stateful actions in cases like selection mode. `<sp-actionbar>` can be deployed in two variants beyond the default: `[varient="fixed"]`, to position the element in relat

    published 0.6.1 3 years ago
  • The `<sp-search>` element delivers a single input field with a "reset" button as well as a mangifying glass icon with which to power search interactions.

    published 0.42.5 2 days ago
  • An `<sp-avatar>` is a great way to feature a visual representation of a user.

    published 0.42.5 2 days ago
  • An `<sp-status-light>` is a great way to convey semantic meaning, such as statuses and categories.

    published 0.42.5 2 days ago
  • An `<sp-circleloader>` shows the progression of a system operation such as downloading, uploading, processing, etc. in a visual way. It can represent determinate or indeterminate progress.

    published 0.1.6 4 years ago
  • `sp-toast` elements display brief, temporary notifications. They are noticeable but do not disrupt the user experience and do not require an action to be taken.

    published 0.42.5 2 days ago
show more packages