rubenc


  • The `<sp-icons-medium>` and `<sp-icons-large>` elements that are included in this package supply your application with the Spectrum CSS Icons at both the medium and large sizes for use via the `<sp-icon>` element also provided by the Spectrum Web Componen

    published version 1.0.3, 12 days 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 version 0.1.11, 5 years ago
  • An **overlay-root** defines the DOM element which defines the bounds in which overlay elements (e.g. `sp-popover`) are rendered. An overlay root is intended to be used with an [`overlay-trigger`](/components/overlay-trigger). Please see the documentation

    published version 0.1.7, 5 years ago
  • Extend either the `Iconset` or `IconsetSVG` exports of this package to supply your application with a custom icon set to power the use of `<sp-icon>` elements throughout. Give your new icon set a custom name, and you'll be ready to supply them as `<sp-ico

    published version 1.0.3, 12 days ago
  • An `<sp-banner>` is an additional label an existing component may have. Banners cannot be interacted with. Banners in Spectrum have three variations for different uses as well as the ability to place it overlaid in the top-right corner of a container.

    published version 0.49.0, 2 months ago
  • **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 version 0.1.18, 5 years ago
  • An `<sp-link>` allow users to navigate to a different location. They can be presented in-line inside a paragraph or as a standalone text.

    published version 1.0.3, 12 days ago
  • An `<sp-card>` represents a rectangular card that contains a variety of text and image layouts. Cards are typically used to encapsulate units of a data set, such as a gallery of image/caption pairs.

    published version 1.0.3, 13 days ago
  • An `<sp-popover>` is used to display transient content (menus, options, additional actions etc.) and appears when clicking/tapping on a source (tools, buttons, etc.) It stands out via its visual style (stroke and drop shadow) and floats on top of the rest

    published version 1.0.3, 13 days ago
  • An **overlay-trigger** is used to overlay content that is positioned relative to another control. Two kinds of triggers are supported, `hover` and `click`. Each may have it's own content.

    published version 0.1.7, 5 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>`. Often a `<sp-menu>` element will appear in a `<sp-popover>` element so that it displays as a togg

    published version 1.0.3, 13 days ago
  • A `<sp-dropzone>` is an area on the screen into which an object can be dragged and dropped to accomplish a task. For example, a DropZone might be used in an upload workflow to enable the user to drop a file from their operating system into the DropZone, w

    published version 1.0.3, 12 days ago
  • `<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 version 1.0.3, 13 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 version 1.0.3, 13 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 version 1.0.3, 13 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 version 1.0.3, 13 days ago
  • Shared mixins, tools, etc. that support developing Spectrum Web Components.

    published version 1.0.3, 10 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 version 1.0.3, 13 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 version 1.0.3, 13 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 version 1.0.3, 13 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 version 1.0.3, 13 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 version 0.3.11, 5 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 version 0.3.10, 5 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 version 0.2.3, 5 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 version 0.5.4, 5 years ago
show more packages