Détail du package

@spectrum-web-components/action-button

adobe29.9kApache-2.01.7.0

An <sp-action-button> represents an action a user can take.

design-system, spectrum, adobe, adobe-spectrum

readme

Overview

An <sp-action-button> represents an action a user can take.

Usage

yarn add @spectrum-web-components/action-button

Import the side effectful registration of <sp-action-button> via:

import '@spectrum-web-components/action-button/sp-action-button.js';

When looking to leverage the ActionButton base class as a type and/or for extension purposes, do so via:

import { ActionButton } from '@spectrum-web-components/action-button';

Anatomy

<sp-action-button>Try me</sp-action-button>

Content

<sp-action-button> elements can be provided a visible label, a label and an icon, or just an icon.

An icon is provided by placing an icon element in the icon slot.

If the button is icon-only, a non-visible label can be provided via the label attribute on an <sp-action-button> or on an <sp-icon*> element child to appropriately fulfill the accessibility contract of the button.

<sp-tabs selected="label" auto label="Labelling a button">

<sp-tab value="label">Label only</sp-tab>

<sp-tab-panel value="label">

```html demo

<sp-action-button variant="primary">Label only</sp-action-button>


</sp-tab-panel>
<sp-tab value="icon-label">Icon + label</sp-tab>
<sp-tab-panel value="icon-label">

```html demo
<sp-action-button variant="primary">
    <sp-icon-help slot="icon"></sp-icon-help>
    Icon + Label
</sp-action-button>

</sp-tab-panel>

<sp-tab value="svg-label">SVG Icon + label</sp-tab>

<sp-tab-panel value="svg-label">

```html demo

<sp-action-button variant="primary"> <svg slot="icon" viewBox="0 0 36 36" focusable="false" aria-hidden="true" role="img" > <path d="M16 36a4.407 4.407 0 0 0 4-4h-8a4.407 4.407 0 0 0 4 4zm9.143-24.615c0-3.437-3.206-4.891-7.143-5.268V3a1.079 1.079 0 0 0-1.143-1h-1.714A1.079 1.079 0 0 0 14 3v3.117c-3.937.377-7.143 1.831-7.143 5.268C6.857 26.8 2 26.111 2 28.154V30h28v-1.846C30 26 25.143 26.8 25.143 11.385z"

    ></path>
</svg>
SVG Icon + Label

</sp-action-button>


</sp-tab-panel>
<sp-tab value="icon-only">Icon only</sp-tab>
<sp-tab-panel value="icon-only">

```html demo
<sp-action-button variant="primary" label="Icon only">
    <sp-icon-help slot="icon"></sp-icon-help>
</sp-action-button>

</sp-tab-panel> </sp-tabs>

Options

Sizes

<sp-tabs selected="m" auto label="Size attribute options">

<sp-tab value="xs">Extra Small</sp-tab>

<sp-tab-panel value="xs">

```html demo

<sp-action-group size="xs"> <sp-action-button>Edit</sp-action-button> <sp-action-button> <sp-icon-edit slot="icon"></sp-icon-edit> Edit </sp-action-button> <sp-action-button label="Edit"> <sp-icon-edit slot="icon"></sp-icon-edit> </sp-action-button> <sp-action-button label="Edit" hold-affordance> <sp-icon-edit slot="icon"></sp-icon-edit> </sp-action-button> </sp-action-group>


</sp-tab-panel>
<sp-tab value="s">Small</sp-tab>
<sp-tab-panel value="s">

```html demo
<sp-action-group size="s">
    <sp-action-button>Edit</sp-action-button>
    <sp-action-button>
        <sp-icon-edit slot="icon"></sp-icon-edit>
        Edit
    </sp-action-button>
    <sp-action-button label="Edit">
        <sp-icon-edit slot="icon"></sp-icon-edit>
    </sp-action-button>
    <sp-action-button label="Edit" hold-affordance>
        <sp-icon-edit slot="icon"></sp-icon-edit>
    </sp-action-button>
</sp-action-group>

</sp-tab-panel>

<sp-tab value="m">Medium</sp-tab>

<sp-tab-panel value="m">

```html demo

<sp-action-group size="m"> <sp-action-button>Edit</sp-action-button> <sp-action-button> <sp-icon-edit slot="icon"></sp-icon-edit> Edit </sp-action-button> <sp-action-button label="Edit"> <sp-icon-edit slot="icon"></sp-icon-edit> </sp-action-button> <sp-action-button label="Edit" hold-affordance> <sp-icon-edit slot="icon"></sp-icon-edit> </sp-action-button> </sp-action-group>


</sp-tab-panel>
<sp-tab value="l">Large</sp-tab>
<sp-tab-panel value="l">

```html demo
<sp-action-group size="l">
    <sp-action-button>Edit</sp-action-button>
    <sp-action-button>
        <sp-icon-edit slot="icon"></sp-icon-edit>
        Edit
    </sp-action-button>
    <sp-action-button label="Edit">
        <sp-icon-edit slot="icon"></sp-icon-edit>
    </sp-action-button>
    <sp-action-button label="Edit" hold-affordance>
        <sp-icon-edit slot="icon"></sp-icon-edit>
    </sp-action-button>
</sp-action-group>

</sp-tab-panel>

<sp-tab value="xl">Extra Large</sp-tab>

<sp-tab-panel value="xl">

```html demo

<sp-action-group size="xl"> <sp-action-button>Edit</sp-action-button> <sp-action-button> <sp-icon-edit slot="icon"></sp-icon-edit> Edit </sp-action-button> <sp-action-button label="Edit"> <sp-icon-edit slot="icon"></sp-icon-edit> </sp-action-button> <sp-action-button label="Edit" hold-affordance> <sp-icon-edit slot="icon"></sp-icon-edit> </sp-action-button> </sp-action-group>


</sp-tab-panel>
</sp-tabs>

#### Variants

The `<sp-action-button>` can be customized with either or both of the `emphasized` and `quiet` attributes. These will pair with either or both of the state attributes (`selected` and `disabled`) to decide the final visual delivery of the `<sp-action-button>`. Content addressed to the `icon` slot can also be provided and will be positioned just before the rest of the the supplied button content.

<sp-tabs selected="default" auto label="Variant options">
<sp-tab value="default">Default</sp-tab>
<sp-tab-panel value="default">

```html demo
<div
    style="display: grid; grid-template-columns: repeat(auto-fill, minmax(210px, 1fr)); gap: 2em;"
>
    <div>
        <sp-field-label for="standard">Default</sp-field-label>
        <sp-action-group id="standard">
            <sp-action-button>Edit</sp-action-button>
            <sp-action-button>
                <sp-icon-edit slot="icon"></sp-icon-edit>
                Edit
            </sp-action-button>
            <sp-action-button label="Edit">
                <sp-icon-edit slot="icon"></sp-icon-edit>
            </sp-action-button>
            <sp-action-button label="Edit" hold-affordance>
                <sp-icon-edit slot="icon"></sp-icon-edit>
            </sp-action-button>
        </sp-action-group>
    </div>

    <div>
        <sp-field-label for="standard-selected">Selected</sp-field-label>
        <sp-action-group id="standard-selected">
            <sp-action-button selected>Edit</sp-action-button>
            <sp-action-button selected>
                <sp-icon-edit slot="icon"></sp-icon-edit>
                Edit
            </sp-action-button>
            <sp-action-button label="Edit" selected>
                <sp-icon-edit slot="icon"></sp-icon-edit>
            </sp-action-button>
            <sp-action-button label="Edit" selected hold-affordance>
                <sp-icon-edit slot="icon"></sp-icon-edit>
            </sp-action-button>
        </sp-action-group>
    </div>

    <div>
        <sp-field-label for="standard-disabled">Disabled</sp-field-label>
        <sp-action-group id="standard-disabled">
            <sp-action-button disabled>Edit</sp-action-button>
            <sp-action-button disabled>
                <sp-icon-edit slot="icon"></sp-icon-edit>
                Edit
            </sp-action-button>
            <sp-action-button label="Edit" disabled>
                <sp-icon-edit slot="icon"></sp-icon-edit>
            </sp-action-button>
            <sp-action-button label="Edit" disabled hold-affordance>
                <sp-icon-edit slot="icon"></sp-icon-edit>
            </sp-action-button>
        </sp-action-group>
    </div>

    <div>
        <sp-field-label for="standard-disabled-selected">
            Disabled + Selected
        </sp-field-label>
        <sp-action-group id="standard-disabled-selected">
            <sp-action-button disabled selected>Edit</sp-action-button>
            <sp-action-button disabled selected>
                <sp-icon-edit slot="icon"></sp-icon-edit>
                Edit
            </sp-action-button>
            <sp-action-button label="Edit" disabled selected>
                <sp-icon-edit slot="icon"></sp-icon-edit>
            </sp-action-button>
            <sp-action-button label="Edit" disabled selected hold-affordance>
                <sp-icon-edit slot="icon"></sp-icon-edit>
            </sp-action-button>
        </sp-action-group>
    </div>
</div>

</sp-tab-panel>

<sp-tab value="quiet">Quiet</sp-tab>

<sp-tab-panel value="quiet">

```html demo

<sp-field-label for="standard">Default</sp-field-label> <sp-action-group quiet id="standard"> <sp-action-button quiet>Edit</sp-action-button> <sp-action-button quiet> <sp-icon-edit slot="icon"></sp-icon-edit> Edit </sp-action-button> <sp-action-button label="Edit" quiet> <sp-icon-edit slot="icon"></sp-icon-edit> </sp-action-button> <sp-action-button label="Edit" quiet hold-affordance> <sp-icon-edit slot="icon"></sp-icon-edit> </sp-action-button> </sp-action-group>

<div>
    <sp-field-label for="standard-selected">Selected</sp-field-label>
    <sp-action-group quiet id="standard-selected">
        <sp-action-button quiet selected>Edit</sp-action-button>
        <sp-action-button quiet selected>
            <sp-icon-edit slot="icon"></sp-icon-edit>
            Edit
        </sp-action-button>
        <sp-action-button label="Edit" quiet selected>
            <sp-icon-edit slot="icon"></sp-icon-edit>
        </sp-action-button>
        <sp-action-button label="Edit" quiet selected hold-affordance>
            <sp-icon-edit slot="icon"></sp-icon-edit>
        </sp-action-button>
    </sp-action-group>
</div>

<div>
    <sp-field-label for="standard-disabled">Disabled</sp-field-label>
    <sp-action-group quiet id="standard-disabled">
        <sp-action-button quiet disabled>Edit</sp-action-button>
        <sp-action-button quiet disabled>
            <sp-icon-edit slot="icon"></sp-icon-edit>
            Edit
        </sp-action-button>
        <sp-action-button label="Edit" quiet disabled>
            <sp-icon-edit slot="icon"></sp-icon-edit>
        </sp-action-button>
        <sp-action-button label="Edit" quiet disabled hold-affordance>
            <sp-icon-edit slot="icon"></sp-icon-edit>
        </sp-action-button>
    </sp-action-group>
</div>

<div>
    <sp-field-label for="standard-disabled-selected">
        Disabled + Selected
    </sp-field-label>
    <sp-action-group quiet id="standard-disabled-selected">
        <sp-action-button quiet disabled selected>Edit</sp-action-button>
        <sp-action-button quiet disabled selected>
            <sp-icon-edit slot="icon"></sp-icon-edit>
            Edit
        </sp-action-button>
        <sp-action-button label="Edit" quiet disabled selected>
            <sp-icon-edit slot="icon"></sp-icon-edit>
        </sp-action-button>
        <sp-action-button
            label="Edit"
            quiet
            disabled
            selected
            hold-affordance
        >
            <sp-icon-edit slot="icon"></sp-icon-edit>
        </sp-action-button>
    </sp-action-group>
</div>


</sp-tab-panel>
<sp-tab value="emphasized">Emphasized</sp-tab>
<sp-tab-panel value="emphasized">

```html demo
<div
    style="display: grid; grid-template-columns: repeat(auto-fill, minmax(210px, 1fr)); gap: 2em;"
>
    <div>
        <sp-field-label for="standard">Default</sp-field-label>
        <sp-action-group emphasized id="standard">
            <sp-action-button emphasized>Edit</sp-action-button>
            <sp-action-button emphasized>
                <sp-icon-edit slot="icon"></sp-icon-edit>
                Edit
            </sp-action-button>
            <sp-action-button label="Edit" emphasized>
                <sp-icon-edit slot="icon"></sp-icon-edit>
            </sp-action-button>
            <sp-action-button label="Edit" emphasized hold-affordance>
                <sp-icon-edit slot="icon"></sp-icon-edit>
            </sp-action-button>
        </sp-action-group>
    </div>

    <div>
        <sp-field-label for="standard-selected">Selected</sp-field-label>
        <sp-action-group emphasized id="standard-selected">
            <sp-action-button emphasized selected>Edit</sp-action-button>
            <sp-action-button emphasized selected>
                <sp-icon-edit slot="icon"></sp-icon-edit>
                Edit
            </sp-action-button>
            <sp-action-button label="Edit" emphasized selected>
                <sp-icon-edit slot="icon"></sp-icon-edit>
            </sp-action-button>
            <sp-action-button label="Edit" emphasized selected hold-affordance>
                <sp-icon-edit slot="icon"></sp-icon-edit>
            </sp-action-button>
        </sp-action-group>
    </div>

    <div>
        <sp-field-label for="standard-disabled">Disabled</sp-field-label>
        <sp-action-group emphasized id="standard-disabled">
            <sp-action-button emphasized disabled>Edit</sp-action-button>
            <sp-action-button emphasized disabled>
                <sp-icon-edit slot="icon"></sp-icon-edit>
                Edit
            </sp-action-button>
            <sp-action-button label="Edit" emphasized disabled>
                <sp-icon-edit slot="icon"></sp-icon-edit>
            </sp-action-button>
            <sp-action-button label="Edit" emphasized disabled hold-affordance>
                <sp-icon-edit slot="icon"></sp-icon-edit>
            </sp-action-button>
        </sp-action-group>
    </div>

    <div>
        <sp-field-label for="standard-disabled-selected">
            Disabled + Selected
        </sp-field-label>
        <sp-action-group emphasized id="standard-disabled-selected">
            <sp-action-button emphasized disabled selected>
                Edit
            </sp-action-button>
            <sp-action-button emphasized disabled selected>
                <sp-icon-edit slot="icon"></sp-icon-edit>
                Edit
            </sp-action-button>
            <sp-action-button label="Edit" emphasized disabled selected>
                <sp-icon-edit slot="icon"></sp-icon-edit>
            </sp-action-button>
            <sp-action-button
                label="Edit"
                emphasized
                disabled
                selected
                hold-affordance
            >
                <sp-icon-edit slot="icon"></sp-icon-edit>
            </sp-action-button>
        </sp-action-group>
    </div>
</div>

</sp-tab-panel>

<sp-tab value="emq">Emphasized + quiet</sp-tab>

<sp-tab-panel value="emq">

```html demo

<sp-field-label for="standard">Default</sp-field-label> <sp-action-group emphasized quiet id="standard"> <sp-action-button emphasized quiet>Edit</sp-action-button> <sp-action-button emphasized quiet> <sp-icon-edit slot="icon"></sp-icon-edit> Edit </sp-action-button> <sp-action-button label="Edit" emphasized quiet> <sp-icon-edit slot="icon"></sp-icon-edit> </sp-action-button> <sp-action-button label="Edit" emphasized quiet hold-affordance> <sp-icon-edit slot="icon"></sp-icon-edit> </sp-action-button> </sp-action-group>

<div>
    <sp-field-label for="standard-selected">Selected</sp-field-label>
    <sp-action-group emphasized quiet id="standard-selected">
        <sp-action-button emphasized quiet selected>Edit</sp-action-button>
        <sp-action-button emphasized quiet selected>
            <sp-icon-edit slot="icon"></sp-icon-edit>
            Edit
        </sp-action-button>
        <sp-action-button label="Edit" emphasized quiet selected>
            <sp-icon-edit slot="icon"></sp-icon-edit>
        </sp-action-button>
        <sp-action-button
            label="Edit"
            emphasized
            quiet
            selected
            hold-affordance
        >
            <sp-icon-edit slot="icon"></sp-icon-edit>
        </sp-action-button>
    </sp-action-group>
</div>

<div>
    <sp-field-label for="standard-disabled">Disabled</sp-field-label>
    <sp-action-group emphasized quiet id="standard-disabled">
        <sp-action-button emphasized quiet disabled>Edit</sp-action-button>
        <sp-action-button emphasized quiet disabled>
            <sp-icon-edit slot="icon"></sp-icon-edit>
            Edit
        </sp-action-button>
        <sp-action-button label="Edit" emphasized quiet disabled>
            <sp-icon-edit slot="icon"></sp-icon-edit>
        </sp-action-button>
        <sp-action-button
            label="Edit"
            emphasized
            quiet
            disabled
            hold-affordance
        >
            <sp-icon-edit slot="icon"></sp-icon-edit>
        </sp-action-button>
    </sp-action-group>
</div>

<div>
    <sp-field-label for="standard-disabled-selected">
        Disabled + Selected
    </sp-field-label>
    <sp-action-group emphasized quiet id="standard-disabled-selected">
        <sp-action-button emphasized quiet disabled selected>
            Edit
        </sp-action-button>
        <sp-action-button emphasized quiet disabled selected>
            <sp-icon-edit slot="icon"></sp-icon-edit>
            Edit
        </sp-action-button>
        <sp-action-button label="Edit" emphasized quiet disabled selected>
            <sp-icon-edit slot="icon"></sp-icon-edit>
        </sp-action-button>
        <sp-action-button
            label="Edit"
            emphasized
            quiet
            disabled
            selected
            hold-affordance
        >
            <sp-icon-edit slot="icon"></sp-icon-edit>
        </sp-action-button>
    </sp-action-group>
</div>


</sp-tab-panel>
</sp-tabs>

### Behaviors

#### Action button with hold affordance

The use of the `hold-affordance` attribute signifies that the `<sp-action-button>` in question will be delivered with a visual affordance outlining that special interaction with the button will dispatch a `longpress` event. Via a pointer input, this even will be dispatched when 300ms has passed after a `pointerdown` event without the presence of a `pointerup` or `pointercancel` event. Via the keyboard, an event with a code of `Space` or or `ArrowDown` while `altKey === true` will dispatch the event.

```html demo
<div
    style="display: grid; grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); gap: 2em;"
>
    <overlay-trigger placement="bottom-start">
        <sp-action-button label="Edit" hold-affordance slot="trigger">
            <sp-icon-edit slot="icon"></sp-icon-edit>
        </sp-action-button>
        <sp-popover slot="longpress-content" dialog tip>
            <p style="color: var(--spectrum-neutral-content-color-default);">
                This content is triggered by the "longpress" interaction.
            </p>
        </sp-popover>
    </overlay-trigger>

    <overlay-trigger placement="top">
        <sp-action-button hold-affordance quiet slot="trigger">
            Show Longpress Content
        </sp-action-button>
        <sp-popover slot="longpress-content" dialog tip>
            <p style="color: var(--spectrum-neutral-content-color-default);">
                This content is triggered by the "longpress" interaction.
            </p>
        </sp-popover>
    </overlay-trigger>

    <overlay-trigger placement="top-end">
        <sp-action-button hold-affordance selected slot="trigger">
            <sp-icon-edit slot="icon"></sp-icon-edit>
            Extended Content with Longpress
        </sp-action-button>
        <sp-popover slot="longpress-content" dialog tip>
            <p style="color: var(--spectrum-neutral-content-color-default);">
                This content is triggered by the "longpress" interaction.
            </p>
        </sp-popover>
    </overlay-trigger>
</div>

Toggles

With the application of the toggles attribute, the button will self manage its selected property on click. When this value is updated, a cancellable change event will be dispatched to inform the parent application.

<sp-tabs selected="default" auto label="Toggled action buttons">

<sp-tab value="default">Default</sp-tab>

<sp-tab-panel value="default">

```html demo

<sp-action-button toggles id="toggles-default">Toggle button</sp-action-button>

<sp-action-button toggles selected id="toggles-default"> Toggle button </sp-action-button>


</sp-tab-panel>
<sp-tab value="quiet">Quiet</sp-tab>
<sp-tab-panel value="quiet">

```html demo
<sp-action-button toggles quiet id="toggles-quiet">
    Toggle button
</sp-action-button>
<sp-action-button toggles quiet selected id="toggles-quiet">
    Toggle button
</sp-action-button>

</sp-tab-panel>

<sp-tab value="emphasized">Emphasized</sp-tab>

<sp-tab-panel value="emphasized">

```html demo

<sp-action-button toggles emphasized id="toggles-emphasized"> Toggle button </sp-action-button>

<sp-action-button toggles emphasized selected id="toggles-emphasized"> Toggle button </sp-action-button>


</sp-tab-panel>
<sp-tab value="emphasized-quiet">Emphasized + Quiet</sp-tab>
<sp-tab-panel value="emphasized-quiet">

```html demo
<sp-action-button toggles emphasized quiet id="toggles-emphasized-quiet">
    Toggle button
</sp-action-button>
<sp-action-button
    toggles
    emphasized
    quiet
    selected
    id="toggles-emphasized-quiet"
>
    Toggle button
</sp-action-button>

</sp-tab-panel> </sp-tabs>

Handling events

Events handlers for clicks and other user actions can be registered on a <sp-action-button> as on a standard HTML <button> element.

<sp-button onclick="spAlert(this, '<sp-action-button> clicked!')">
    Click me
</sp-button>

In addition to handling events like a native <button> HTML element, one can also use a <sp-action-button> in place of the <a> HTML element by using the href and optional target attribute.

<sp-action-button
    href="https://github.com/adobe/spectrum-web-components"
    target="_blank"
>
    Click me
</sp-action-button>

Accessibility

Include a label

A button is required to have either a visible text label or a label attribute on either the <sp-button> itself, or on an <sp-icon*> element child.

Don't override color

Do not use custom colors for buttons. The colors of different button variations have been designed to be consistent and accessible.

Use static black or static white to contrast with backgrounds and images

To ensure maximum contrast with the background, use static black for light backgrounds and images, and static white for dark backgrounds and images. Avoid placing static components on top of busy images with a lot of variance in contrast.

<sp-tabs selected="black" auto label="Static variants for contrast">

<sp-tab value="black">Static black on light background</sp-tab>

<sp-tab-panel value="black">

```html demo

<sp-action-button static="black">Click me</sp-action-button> <sp-action-button static="black" selected>Click me</sp-action-button>


</sp-tab-panel>
<sp-tab value="white">Static white on dark background</sp-tab>
<sp-tab-panel value="white">

```html demo
<div style="background-color: #220033; padding: 20px">
    <sp-action-button static="white">Click me</sp-action-button>
    <sp-action-button static="white" selected>Click me</sp-action-button>
</div>

</sp-tab-panel> </sp-tabs>

Clearly state the action

Make sure that an action button’s label clearly states the outcome of the action. Use the same word or phrase as found elsewhere in the experience.

changelog

Change Log

All notable changes to this project will be documented in this file. See Conventional Commits for commit guidelines.

1.6.0 (2025-05-01) — (f2b6a32)

Minor Fixes

icons-workflow: added missing S2 icons

Patch Fixes

slider: ensure tracks become properly rounded when offset variant is activated
popover: prevent overflow clipping in Safari with translateZ and visible tips
picker: fix focus to prevent setting focus on menu items when opened via mouse
button: update deprecation warning to allow variant and static-color to coexist
number-field: fix UI issues and improve width calculation
tooltip: add DelayedTooltipWithOverlay story for handling interactions
infield-button, number-field, textfield, search, styles: update disabled border colors and styling across components
close-button, dropzone, illustrated-message, menu, status-light, styles, switch, table, tabs, toast, tooltip: remove unnecessary system theme references
overlay: fix layout issues in Safari for nested trays in dialogs

1.5.0 (2025-04-15)

Minor Changes

sp-icons-workflow: Added missing S2 icons

Patch Changes

sp-popover: 📝 #3566 Thanks @aramos-adobe!

Popover overflow bug on Safari

translateZ has been added to the open popover to prevent clipping of the filter: drop-shadow when overflow is applied. translateZ or translate3d on the open state accelerates the component to the GPU layer maintaining any transformations and animations.
overflow: visible applied to CSS *--withTip so the tip is still visible if overflow is applied to the component.

sp-picker: PickerBase(used in <sp-picker> and sp-action-menu>):

Fixes focus so that it is not set on <sp-menu-item> elements when opened via mouse.

A keyboard interaction is the only interaction that should set focus on an <sp-menu-item> when the menu is opened. A user with a mouse would expect the focus to stay where the mouse is.

Fixes: #2950

sp-button: Updated the deprecation warning to allow variant and static-color exist on the same component. Added primary and secondary stories to white and black button directories on storybook. Updates documentation site to reflect this as well.

sp-infield-button: # Release Note

Infield Button

6.1.2

#3615 f09c84a Thanks @Rajdeepc! - ### Infield button fast follows
- Updated infield button disabled border color to use -spectrum-gray-300 for spectrum-two theme and -spectrum-gray-200 for other themes.

6.1.1

📝 #3536 f77aa72 Thanks @marissahuysentruyt!

S2 Foundations fixes
- Adjusts the background-color of the infield button components within stepper to use gray-100 as opposed to gray-25.
  - This corresponds to the background-color updates picker has for S2.
- Corrects the border color for the default picker for S2 foundations, using gray-500 (instead of gray-800) to align with other field/form components.
- Refactors the &.is-keyboardFocused&.is-placeholder selector to &.is-keyboardFocused.spectrum-Picker-label.is-placeholder to avoid unexpectedly targeting the nested placeholder class.

6.1.0

📝 #3541 1a3245c Thanks @castastrophe!

Dependency alignment across the project.

Updated dependencies [205182b, 1a3245c]:
- @spectrum-css/icon@9.1.0
- @spectrum-css/tokens@16.0.1

Number Field

Bump @spectrum-css/stepper to 7.1.3

7.1.3

#3621 3aec28a Thanks @marissahuysentruyt!
- Updates -spectrum-stepper-buttons-border-color-keyboard-focus from gray-900 to gray-800 to match the rest of the border color on keyboardFocus.

7.1.2

📝 #3594 6200a63 Thanks @TarunAdobe!

Updates Stepper's key-focus border color (-spectrum-stepper-border-color-keyboard-focus) to -spectrum-gray-800.

7.1.1

📝 #3536 f77aa72 Thanks @marissahuysentruyt!

S2 Foundations fixes
- Adjusts the background-color of the infield button components within stepper to use gray-100 as opposed to gray-25.
  - This corresponds to the background-color updates picker has for S2.
- Corrects the border color for the default picker for S2 foundations, using gray-500 (instead of gray-800) to align with other field/form components.
- Refactors the &.is-keyboardFocused&.is-placeholder selector to &.is-keyboardFocused.spectrum-Picker-label.is-placeholder to avoid unexpectedly targeting the nested placeholder class.

7.1.0

📝 #3541 1a3245c Thanks @castastrophe!

Dependency alignment across the project.

Updated dependencies [205182b, 9b108f7, 1a3245c]:
- @spectrum-css/actionbutton@8.0.0
- @spectrum-css/icon@9.1.0
- @spectrum-css/infieldbutton@7.0.0
- @spectrum-css/textfield@9.0.0
- @spectrum-css/tokens@16.0.1

Textfield

8.1.1

📝 #3575 2e17d10 Thanks @TarunAdobe!

Updated border color on keyboard focus state for textfield in spectrum-two theme.

8.1.0

📝 #3539 9b108f7 Thanks @rise-erpelding!

Updates invalid icon spacing to be vertically centered for S2.

📝 #3541 1a3245c Thanks @castastrophe!

Dependency alignment across the project.

Set component peerDependencies as optional to reduce console warnings on downstream projects.

Updated dependencies [205182b, 1a3245c]:
- @spectrum-css/helptext@8.0.0
- @spectrum-css/tokens@16.0.1

Search

8.1.2

#3658 e9fde67 Thanks @rise-erpelding! - Change S2 theme border color to gray-800 on keyfocus per design request in order to align with text field.

8.1.1

📝 #3593 d829abb Thanks @TarunAdobe!

Updated --spectrum-search-background-color-disabled to --spectrum-gray-25 and --spectrum-search-border-color-disabled to --spectrum-gray-300 for the S2 foundations contexts.

Also defines disabled quiet border and background colors (--system-search-quiet-background-color-disabled and --system-search-quiet-border-color-disabled) in order to maintain disabled quiet styling.

8.1.0

📝 #3541 1a3245c Thanks @castastrophe!

Dependency alignment across the project.

Updated dependencies [205182b, 9b108f7, 1a3245c]:
- @spectrum-css/clearbutton@8.0.0
- @spectrum-css/icon@9.1.0
- @spectrum-css/textfield@9.0.0
- @spectrum-css/tokens@16.0.1

sp-close-button: Remove unnecessary system theme references to reduce complexity for components that don't need the additional mapping layer.

1.4.0 (2025-03-26)

Bug Fixes

split-view,styles: use latest CSS (fccb0a5c72)
menu: menuitem focus and hover styles (#5270) (a69accb8b4)
alert-banner,styles: style updates from latest release (7d091c2702)
menu: capture touchend on mobile (#5313) (4c2f908a92)
sidenav,styles: remove unneeded system layer (fd41b13f8e)
help-text,styles: remove unneeded system layer (be0ae4c899)
tags,styles: remove unneeded system layer (03340e94ed)
color-wheel,styles: use latest CSS (fb62c6a93a)
color-slider,styles: remove unneeded system layer (d48ba7aa4c)
overlay: prevent overlay close on document scroll (#5308) (8f8735c9ec)
buttongroup,styles: use latest CSS (a05dceaffd)
card,styles: use latest CSS (9eed256391)
tray,styles: use latest CSS (f9f3e6e60e)
action-bar,styles: bump to latest release for action-bar (b6cd115cda)
color-loupe,styles: use latest CSS (4a796cffc1)
color-handle,styles: use latest CSS (600d80700f)
breadcrumb,styles: use latest CSS (daeb11f187)
badge,styles: bump to latest release (95c511ef62)
avatar,styles: bump to latest release (3899709eb8)
asset,styles: bump to latest release (f9861fddff)
alert-dialog,styles: bump to latest release (0c088ae3a2)
number-field: prevent keyboard on mobile devices by setting inpu… (#5284) (5a3bc6d24e)
tachometer: update file path pattern for tachometer (#5287) (50d20bb8e5)
modal,styles: remove unneeded system layer (5bc73542fa)
pre-commit: update linting commands for to be compatible with POSIX (#5286) (24e7e47ab4)
accordion,styles: remove unneeded system layer (165a904bd0)
field-label,styles: remove unneeded system layer (8931718347)
link,styles: remove unneeded system layer (186774daa2)
help-text,styles: remove unneeded system layer (ff56ea2fa5)
opacity-checkerboard: bring in styles from latest tag (f26b2ccf3b)
illustrated-message,styles: remove unneeded system layer (f8b4560852)
picker: disable drag and select for mobile picker (#5187) (2a0422ec1b)
overlay: stays open when interacting with elements inside (#5248) (70f5f6f3a9)
color-field: respects alpha value in hex form (#5246) (e247de9a2e)
picker: move tooltip outside of action menu's button (#5077) (549ff4ac36)
overlay: remove pointer events from disabled overlay trigger (#5205) (cf8db5e94b)
menu: focuson mouseover (#5197) (6618422848)

Features

sp-contextual-help: stays open when interacting with elements inside.(#5248) (3cca7ea)

1.3.0 (2025-03-13)

Bug Fixes

overlay sp-overlay with type="manual" should close on pressing ESC key. (#5160) (be28fdd)
sp-slider: Now correctly centers alignment for a slider with no visible label (#5144) (946899d)
sp-dialog, sp-dialog-wrapper: The error property deprecation has been removed to prevent confusion and false urgency in migration.(#5156) (596f864)
sp-picker: Added Spectrum 2 corrected border-radius and background-color.(#5153) (d780fd1)

1.2.0 (2025-02-27)

Bug Fixes

action menu: keyboard accessibility omnibus (#5031) (ea38ef0), closes #4623
breadcrumbs: show maxvisibleitems on dynamic updates (#5100) (199f989)
menu: make submenu scrollable (#5082) (a13dac2)
picker: update picker when menu item icons change (#5088) (63ef1ad)
slider: make label not disappear when using overlays in Safari (#5118) (191a15b)

Features

combobox: allow support for disabled items (#5104) (b78d412)
overlay: add triggeredBy property to overlay-trigger for performance optimization (#5046) (fd504aa)
reactive-controllers: Migrate to Colorjs from Tinycolor (#4713) (9d740f0)

1.1.2 (2025-02-12)

Bug Fixes

overlay: derive popover placement from host in interaction controller (#5078) (635cf53)
picker: stop the click events from reaching the elements below picker-tray (#5060) (7e4fdbf)
tooltip: make tooltip delivery consistent across all browsers (#5056) (d01d5cd)

1.1.1 (2025-01-29)

Bug Fixes

overlay: make :focus-visible consistent when using overlay type modal (#4912) (7a5f786), closes #5021

Features

opacity-checkerboard: bump CSS version (#5040) (e3bf6d3)
picker: add forcePopover property (#5041) (3651e57)
sp-button-group: sp-button-group react to size updates (#5037) (63bc618)
thumbnail: bump thumbnail to use foundations release (7490324)

1.1.0 (2025-01-29)

Bug Fixes

lock prerelease versions for Spectrum CSS (#5014) (8aa7734)
overlay: make :focus-visible consistent when using overlay type modal (#4912) (7a5f786), closes #5021

Features

add an optional chromatic vrt action (7d2f840)
opacity-checkerboard: bump CSS version (#5040) (e3bf6d3)
picker: add forcePopover property (#5041) (3651e57)
sp-button-group: sp-button-group react to size updates (#5037) (63bc618)
thumbnail: bump thumbnail to use foundations release (7490324)
use globals to enable VRT modes in chromatic (5b674b4)

1.0.3 (2024-12-09)

Bug Fixes

action-button: action-button with href can be perceived by screen reader (#4927) (2a0b3a5)
dialog: fade-out animation when lazy loaded on popover overlays (#4937) (d36fc6e)
number-field: added aria-hidden attribute for inc/dec buttons (#4933) (b16a839)
overlay: overlay scroll in safari and firefox (#4969) (05d24ff)
toast: adds iconLabel to address accessibility (#4944) (8121057)

1.0.1 (2024-11-11)

Bug Fixes

action-group: add null check for slotElement in manageButtons (#4924) (60db5ab)
icon: remove size300 suffix from chevron and checkmark icons in Spectrum 2 (#4904) (a22f42b)
menu: prevent sp-menu-item text-align cascading (#4868) (6663820)
number-field, slider: ensure cached value is cleared when toggling between different steps (#4846) (1c84c96)
number-field: allow only numeric characters for Japanese/Chinese IME (#4817) (a791bd1)
overlay: ensure smooth animation when opening modal overlays (#4879) (cd8dad7)
overlay: overlay closing another overlay (#4880) (30434fa)
overlay: remove flex display for dialog (#4902) (48448ea)
picker: don't handle pointerdown for touch devices (#4850) (3a62d13)
search: clear button ui in express (#4910) (f88e1e2)
slider: update slider config to process the tick css correctly (#4905) (7b1dfd0)

1.0.0 (2024-10-31)

Bug Fixes

dialog-wrapper: update heading to fully span grid area (#4810) (7d1f461)
help-text: apply aria-live to ensure full help text is read to user (#4210) (049dc56)

Features

spectrum-web-components now supports Spectrum 2 system (#4829)

BREAKING CHANGES

coach-indicator: remove 'variant' and 'static' attributes from coach-indicator (#4772)
split-button: remove split-button component (#4729)
banner: remove banner component (#4723)
badge: remove deprecated badge values (#4742)
quick-actions: remove sp-quick-actions (#4761)
popover: remove popover's dialog property (#4751)
thumbnail: remove thumbnail deprecated sizes (#4760)
progress-circle: remove progress-circle overBackground property (#4750)
action-button, action-group, action-menu, button, link, meter, progress-bar: remove deprecated 'static' references (#4818)
action-button: remove action-button variant property (#4741)
theme: remove 'theme' attribute from sp-theme (#4765)

0.49.0 (2024-10-15)

Bug Fixes

number-field: show decimal on iPad minimized keyboard (#4784) (deb7a1c)
tabs: scroll exceeding tabs limit (#4722) (fc9a448)

Features

add static-color to replace static (#4808) (43cf086)
button: add noWrap property (#4779) (6760ec2)

0.48.1 (2024-10-01)

Bug Fixes

add file extension to Theme imports and respective eslint rule (#4771) (a2b6bea)
breadcrumbs: trigger change event on breadcrumbs via keyboard (#4769) (e14d082)

0.48.0 (2024-09-17)

Bug Fixes

action-menu: dispatch scroll event (#4715) (c76f3f5)
add null check in updated method of sp-number-field (#4709) (7b1eeab)
combobox: update selected item state in menu (#4730) (c4cfd2a)
menu: allow menu-item to support arbitrary element as the submenu root (#4720) (4c6a0dc)
picker: added a custom class to make :focus-visible styles consistent across all browsers (#4724) (d667d08)
toast: added ability to wrap toast content with long words (#4738) (302d6fe)

Features

locale picker in the storybook's decorator (#4687) (9e0cd08)
reactive-controller: new pending state controller (#4605) (68baf94)

0.47.2 (2024-09-03)

Bug Fixes

slider: update variant attribute correctly (#4714) (9c22dd6)

0.47.1 (2024-08-27)

Bug Fixes

breadcrumbs: adjust ref directives imports (#4681) (6e7ba13)
reactive-controllers: update focusable element's tab-index to 0 on accepting focus (#4630) (d359e84)
slider: bump css version to increase slider z-index (#4682) (04bba95)

0.47.0 (2024-08-20)

Bug Fixes

number-field: update IME change detection (#4672) (de05aee)
picker: updated type for mobile and desktop (#4666) (d11da1f)
tray: removed nonNull operator and initialized resolveTransitionPromise with dummy func (#4658) (1a8a479)

Features

breadcrumbs: add Breadcrumbs component (#4578) (acd4b5e)

0.46.0 (2024-08-08)

Bug Fixes

contextual-help: export typings (#4655) (8febc38)
docummentation demo controls should should have their changes reflected (#4636) (adc8af9)
menu: should not make a selection on right click (#4642) (d269629)
rtl mobile layout view (#4645) (4b2d688)

Features

upgrade menu and dialog grid css (#4638) (ab9d468)

0.45.0 (2024-07-30)

Bug Fixes

progress-bar: removed duplicate label (#4494) (39b6622)
tabs: prevent vertical auto scroll (#4613) (e1ef097)
overlay replace at() polyfill (#4628) (8cef2c6)
picker pointerup in mobile does not automatically make a selection (4227) ([56366ce] (https://github.com/adobe/spectrum-web-components/commit/56366ce2750bb4bb5c6e3fa5fe7d809434497adb))
action-menu clicking a menu item in an action menu tray doesn't register a click behind it ([4461] (https://github.com/adobe/spectrum-web-components/issues/4461)) ([56366ce] (https://github.com/adobe/spectrum-web-components/commit/56366ce2750bb4bb5c6e3fa5fe7d809434497adb))
tray sp-tray now doesn't automatically retract when opened with fewer items in the iOS simulator ([4572] (https://github.com/adobe/spectrum-web-components/issues/4572)) ([56366ce] (https://github.com/adobe/spectrum-web-components/commit/56366ce2750bb4bb5c6e3fa5fe7d809434497adb))
action-menu ActionMenu tray in mobile device doesn't dispatch multiple events ([4459] (https://github.com/adobe/spectrum-web-components/issues/4459)) ([56366ce] (https://github.com/adobe/spectrum-web-components/commit/56366ce2750bb4bb5c6e3fa5fe7d809434497adb))

Features

add filled state to dropzone component (#4617) (f6b7144)

0.44.0 (2024-07-15)

Bug Fixes

add keyboard handlers to sp-table-cell-head (#4473) (794263e)
number-field: multiple separators use-cases in decimal inputs in iOS devices (#4571) (6319da8)

Features

action-bar: support for action-menus (#3780) (4aff599)
alert-banner: add alert banner component (#4266) (10d456e)
sp-slider: adjust fillStart calculation for value=0 and normalization function (#4573) (369fee7), closes #4558

0.43.0 (2024-06-11)

Bug Fixes

duplicate code to empty global-vars before generating (#4507) (83215b6)
menu: enable numpad arrow and Enter keys (#4492) (012c411)
number-field: updated number field to respect all locales (#4508) (cc6e928)
swatch: sync aria-label with changes in label, color, and mixed state (#4519) (50aef31)

Features

combobox: add pending state (#4462) (2d0c388)
contextual-help: add contextual help pattern (#4285) (a259aa3)

0.42.5 (2024-05-24)

Bug Fixes

coachmark,overlay: adjust imports of overlay and coachmark (#4455) (39706da)
number-field: select full value when using Tab to enter a field with a unit (#4340) (a9d5cef)
overlay: ensure hint Overlays within shadow roots open as expected (#4443) (7dd64b9)
overlay: ensure that passing "open" to the directive manages a single strategy (#4474) (15d6ac7)
overlay: persist "host" in directive rendered Overlay content (#4475) (5d189c2)

0.42.4 (2024-05-14)

Bug Fixes

action-bar: include focus-visible polyfilling (#4273) (fd71ca1)
action-menu: allow menu groups to handle their own selections (#4397) (5a19051)
base: move lit imports to base (#4416) (b7cb07e)
color-area: providing x and y attributes renders color handle correctly (#4240) (9eb5056)
combobox: add missing React TS typings (#4419) (fd9b485)
combobox: allow numeric values and trigger change event on keybo… (#4405) (235ae7c)
combobox: correct package.json listings (35a69a2)
combobox: process styles for invalid state (#4344) (c2b952e)
link: added feature to stop click propagation for disabled link (#4251) (64f26a5)
number-field, slider: floating point roundoff precision bug (#4263) (74480ef)
number-field: handles values greater than 1000 (#4417) (45d69d0)
overlay: prevent "receivesFocus=false" overlays from returning focus (607819f)
picker-button: update quiet styles (#4383) (42bf291)
revert back netlify to v15 (#4446) (7835eb8)
slider,overlay: ensure that pointer events in Slider are handled as expected in Overlay (#4438) (db193e8)
styles,theme: add S2 tokens and theme (#4241) (a29e4a2), closes #4232 #4228
textfield: textarea actually grows with multiline (#4271) (d8d0e84)
theme: deprecate theme property for system (#4230) (ac26168)
tooltip: fix infinite loop in self-managed tooltips (#4269) (b66ee49)
update dependency @ctrl/tinycolor to v4.1.0 (#4357) (a0e2182)
update dependency @floating-ui/dom to v1.6.3 (#4322) (3ba0018)
update dependency @floating-ui/dom to v1.6.4 (#4326) (8183df3)
update dependency @floating-ui/dom to v1.6.5 (#4399) (bc8df32)
update dependency @floating-ui/utils to v0.2.2 (#4327) (81b570d)
update dependency @internationalized/number to v3.5.1 (#4323) (56d5a63)
update dependency @internationalized/number to v3.5.2 (#4390) (4d10460)
update dependency @web/dev-server-rollup to v0.6.2 (#4400) (08ee7f7)

0.42.3 (2024-05-01)

Bug Fixes

color-area: providing x and y attributes renders color handle correctly (#4240) (9eb5056)
combobox: correct package.json listings (35a69a2)
link: added feature to stop click propagation for disabled link (#4251) (64f26a5)
number-field, slider: floating point roundoff precision bug (#4263) (74480ef)
overlay: prevent "receivesFocus=false" overlays from returning focus (607819f)
textfield: textarea actually grows with multiline (#4271) (d8d0e84)
theme: deprecate theme property for system (#4230) (ac26168)
tooltip: fix infinite loop in self-managed tooltips (#4269) (b66ee49)
update dependency @ctrl/tinycolor to v4.1.0 (#4357) (a0e2182)
update dependency @floating-ui/dom to v1.6.3 (#4322) (3ba0018)
update dependency @floating-ui/dom to v1.6.4 (#4326) (8183df3)
update dependency @floating-ui/utils to v0.2.2 (#4327) (81b570d)
update dependency @internationalized/number to v3.5.1 (#4323) (56d5a63)

0.42.2 (2024-04-03)

Note: Version bump only for package @adobe/spectrum-web-components

0.42.1 (2024-04-02)

Bug Fixes

coachmark: add "step-count" slot for custom/internationalized pagination content (#4215) (f4136a6)
dialog-wrapper: add dismiss-label attribute for the close button's label (#4154) (c450a09)
reactive-controllers: add DependencyManagerController (c7f7dea)
shared: ensure the "updateComplete" in Focusable is stable (885b4a5)
slider: skip variant="filled" css when fill-start (#4217) (b6d389d)
table: Add aria-rowcount to virtualized tables (#4156) (b4136ab)

0.42.0 (2024-03-19)

Bug Fixes

action-group: manage Action Button selection through multiple slots (4d02b46)
allowing split view to have a custom aria label (#4155) (d9abed7)
badge: expand and update variant availability and mod override usage (#4162) (19e1a49)
button: prevent pointer interaction of child/slotted content (2cd5823)
color-field: added missing dependencies (#4141) (b3bb23a)
menu: release synthetic "click" promise to unblock keyboard interactions (f8aecf3)
overlay: prevent focus based hover interaction without :focus-visible (79337ff)
overlay: prioritize non-"hint" Overlays on the same trigger (b9833f3)
picker: add loading state to the picker (#3110) (d91e2c9)
picker: allow open/close in tablet (dcfc96e)
picker: correctly process the CSS for the quiet hover effect (#4167) (eb282fa)
progress-bar: remove aria-label only if set by label and label is empty; add tests (d351451)
progress-circle: remove aria-label only when set by label and changed label is empty (cdd181a)
styles, theme: surface exports that omit Spectrum Vars proactively (#4142) (5b524c1)
swatch: allow Swatch Group to manage selection through multiple slots (f333379)
tab-overflow: improve tab navigation experience and support custom aria labels (#4165) (9c9bf95)
theme: deprecate lightest and darkest color stops (#4179) (0c01a66)
truncated: add truncated package (#4163) (4ba0480)

Features

asset: use core tokens (99e76f4)

Reverts

Revert "Truncated element (#4125)" (#4160) (da88bbe), closes #4125 #4160

0.41.2 (2024-03-05)

Bug Fixes

button: add missing progress-circle dependency (#4086) (2dfeeb3)
color-field: add color-field package (#3870) (5081634)
menu: fix css for disabled "value" slots in menu items (#4113) (3c5855d)
overlay: ensure "manual" Overlays ignore "light dismiss" when [popover] is not supported (#4121) (eb5e1ad)
overlay: leverage "transition-behavior" to persist top-layer content while closing (#4050) (e3dea14)
picker: support inline labeling of quiet Picker (#3704) (3372286)
slider: double click on slider handle to reset slider position (#3991) (64c594a)

0.41.1 (2024-02-22)

Bug Fixes

menu: correct disabled menu item's chevron to appropriate colour (#4052) (30f5bb5)
picker: correct implementation of "disabled", expand stories and documentation (#4040) (84c2fef)
progress-circle: ensure size can be applied to non-"size" attribute bearing elements (2bc1065)
slider: revert handle ui at min/max values (#4042) (da13af7)
tabs: bring selected tab into view (#4032) (a187057)
textfield: clearly mark/support "multiline" as a requirement of "grows" (a3e464d)
top-nav: focus loupe on :focus-visible only (50d6870)

0.41.0 (2024-02-13)

Bug Fixes

popover: correct tip delivery size (#4018) (4ff403e)
slider: high contrast improvements for filled track (#3952) (782560d)
support generating random IDs outside of secure contexts (485a67c)
tray: only allow "click" events when they "pointerdown"ed on the Underlay (#4020) (4f9aa4a)

Features

coachmark: rename "sp-coachmark" to "sp-coachmark-indicator", add "sp-coachmark" (#3639) (a94389c)
icon: use core tokens (a11ef6b)

Performance Improvements

combobox: prevent initial list render and update tests to prove that reduces render time (3dc5b1f)

0.40.5 (2024-02-05)

Bug Fixes

button: use larger icons in Close Button (c4aa02c)
combobox: add combobox pattern (#3894) (47d7d71), closes #3887
menu: process ":active" styles (7917583)
slider: reimplement gradient slider track application (a10b91e)
tabs: account for the indicator bar in the overflow decorator (f4a8744)
theme: expose version property (#3978) (d42bb71)
theme: include custom Spectrum color tokens in Express color tokens (370a1f1)

0.40.4 (2024-01-29)

Bug Fixes

overlay: clean position data on close (edac590)
picker,action-menu,split-button: update interaction model (#3935) (bae7d52)
shared: update and expand attribute coverage in likeAnchor (5cb5f1d)
slider: add "fill-start" attribute/property and associated "variant="filled" visual delivery (#3876) (2c3e35e)

0.40.3 (2024-01-11)

Bug Fixes

button: adds pending button, fixes #3162 (#3163) (71254ec)
overlay: automatically reposition overlay when the contents resize (83be807)
overlay: move closed overlays to "display: none" (fc0278b)
overlay: normalize popover toggling between native and synthetic [popover] usage (26fa692)
overlay: support positioning overlays within parents leveraging container-type rules (21044b3)
overlay: surface "overlay" property to "sp-opened" and "sp-closed" events (957f8e9)
picker: force close slotted Tooltip elements with disabled when Menu openes (82c8f12)
picker: prevent the Menu opening until required dependencies are loaded (55e6174)
tooltip: surface "delayed" and "disabled" functionality (#3882) (ae9fcd2)
top-nav: allow consumers to "ignore-url-parts" or "search" or "hash" (#3923) (83bf70b)

0.40.2 (2023-12-18)

Bug Fixes

checkbox: add missing readonly prop (#3859) (35b5649)
menu: support navigating to and selecting Menu Items in Menu Groups (8469ab2)
number-field: validate min/max in more contexts (2328a62)
slider: update handle alignment and color application (#3860) (bed73c0)

0.40.1 (2023-12-05)

Bug Fixes

action-menu: allow tray to display full width (31415e4)
overlay: ensure events are only bound once (abe57ce)
picker: ensure menu placement in mobile (#3835) (4aba1c6)
slider: align editable slider when no label provided (#3816) (a5f4900)
tabs: prevent vertical scrolling in overflow tabs (eb0592f)

Performance Improvements

checkbox: refactor architecture for more rendering perf and DOM element count (7c2277f)

0.40.0 (2023-11-16)

Bug Fixes

button: support [icon-only] delivery (#3716) (e236a50)
field-group: apply role when none present (3616199)
number-field: update display value on scroll and arrow up/down (fc59a18)
overlay: ensure manual overlays persist through interactions outside of their subtree (#3788) (ef5617f)
split-view: expand accessible attribute usage and HCM delivery (cb7c71f)
tags: make the 'delete' event cancelable (#3778) (d9afd41)

Features

textfield: added name attribute to textfield (#3752) (593005a)

0.39.4 (2023-11-02)

Bug Fixes

action-bar: allow "close" event to be cancelled (17cf55e)
infield-button: add infield-button package (057b885)
overlay: add delay resolution from overlaid content (#3748) (5c4f1f6)
overlay: calculate more transforms (6538a45)
overlay: place longpress helper content in a more accessible, less layout affecting location (dd12c23)
support numeric IDs when resolving elements (f62bf0d)
table: update row selection aria (6c8c706)
top-nav: default to role="navigation", sprout aria-label when "label" applied (bbcea4a)

0.39.3 (2023-10-18)

Bug Fixes

grid: plug a mememory leak from the render process (4414bd9)
number-field: prevent over excited "change" events (7b93724)
update deps graph, fix imports (f633005)

0.39.2 (2023-10-13)

Bug Fixes

menu: conditionally access slots for their assigned content (#3717) (c045822)
overlay: allow overlay to persist on hover (#3706) (7707040)
update deps graph, update link docs (#3709) (2deb284)

0.39.1 (2023-10-06)

Bug Fixes

action-button: allow change events to bubble and pierce shadowdom (#3614) (3f76e04)
alert-dialog: use resize observer in place of page resize event for content measurement work (b963813)
grid: grid focusgroup fix on mutationObserver (#3684) (5d47db5)
menu: allow change events to be direct (#3689) (b2cd3da)
number-field: handle negative numbers (#3673) (62553dd)
number-field: update number-field value on pressing "enter" (#3638) (649eb2f)
progress-circle,toast,tooltip: ensure complete dependency graph (#3701) (a5dfada)
slider: ensure z-index in Express theme (c0cc655)

0.39.0 (2023-09-25)

Bug Fixes

action-menu: stack a "label-only" slot on top of the others to allow no icon menu buttons (6b5817d)
alert-dialog: add Alert Dialog package (#3501) (1062847)
base: add re-export of lit/directive.js (#3616) (d2e237f)
base: introduce static version property for component class (#3582) (e7e2b76)
color-handle,color-loupe,swatch,thumbnail: use the Opacity Checkerboard package (47e1fc4)
menu: allow Menu elements to be controlled (74ed7fb)
menu: manage deeply slotted menu items and initial focus (7f9ad69)
opacity checkerboard inclusion order (#3651) (4f417dc)
overlay: allow "receives-focus" to target the root of an overlay (#3658) (0db1025)
overlay: ensure position when closing overlays over the top-layer (55fab0d)
overlay: reduce circular dependencies (25eeb71)
picker,split-button: include "tooltip" slot in the main button (699b8af)
shared: scope querySelector to direct children, like slots are (515eaee)
slider: add t-shirt sizing (24dac78)

Features

color-slider: migrate to core tokens (#3507) (96d0d40)
meter: add "variant" (coalescing various boolean attributes) and remove "over-background" attributes (#3514) (40e5f8a)
table: migrate to core tokens (#3441) (b866bab)
underlay: use core tokens (9c555ab)

0.38.0 (2023-09-05)

Bug Fixes

action-menu,split-button: ensure toggling the Menu closed completes (2dd0f98)
action-menu: added static attribute support (#3573) (25889a8)
correct composition entry of multi-byte numbers (#3610) (5e11934)
dialog: include tab order management at slotchange time (0c7a079)
menu: added support for menu item description (#3559) (ce99528)
menu: correct types import for .d.ts file creation (a11d264)
overlay: position for transformed and contained parents (ca8fd8a)
picker: ensure the Menu opens in a Tray on mobile (6be2bed)
radio-group: onChange event not triggering on keyboard navigation (#3592) (8501239)
search: add mod to remove clear button padding (65168fe)
sidenav: reintroduce support for slotted label content (26c7e6e)
slider: ensure first render when no "value" is supplied (eed860b)
slider: update CSS conversion for more correct visual delivery (99c83e4)
tags: add mod for clear button width (bea891f)

Features

clear-button: migrate to core tokens (64be98a)

0.37.0 (2023-08-18)

Bug Fixes

address margin effected positioning (38c8cf2)
allow non-selection carying Picker derivatives to report value (02c0134)
ensure submenus stay open when root it clicked again (83ced1c)
handle longpress and over filter overlays (483e52d)

Features

dialog: leverage Overlay v2 (5c21ab5)
menu: prepare for Overlay v2 and less connnected/disconnected responsibilities (5dfb71e)
overlay: ship Overlay API v2 (67b5d1b)
picker,action-group,split-button: leverage Overlay v2 (170a223)
popover: leverage Overlay v2 (cde0a16)
tooltip: leverage Overlay v2 (346edac)

Performance Improvements

make lots of things lazy (b8fa3ad)
make submenus lazier (a2d661c)
make submenus lazy (93531b9)
open/close timing update (d4ebcd3)

0.36.0 (2023-08-18)

Bug Fixes

action-group: separate first selection management from later selection management (783b206)
action-menu: add a slot for Tooltip content (#3488) (23cef3a)
added default focus in focus group (1abe7e7)
added default focus in focus group (cd59f18)
added Mutation Observer in the tags workflow (3af1861)
close button static white (d324017)
parentNode declaration (c45fdc3)
picker-button: include missing dependency on @spectrum-web-components/button (#3515) (ed44c2b)
radio: aria-disabled misspelling (b3fbd25), closes adobe/spectrum-web-components#3526
reactive-controllers: functionality debugged (f98013b)
reactive-controllers: handleItemMutation (d0e32a2)
removed disabled property check (816732f)
removed mutation controller from tags and added to focusgroup (aaa1bc0)
tags: corner cases handled (8ec6b6a)
tags: delete functionality working (60e6c2e)
tags: documented the function (f97c7a7)
tags: handled corner cases (55a95b7)
tags: performed the suggested changes (6e3ef36)
tags: removed comment (771dc0e)
tags: removed extra white spaces (196bdae)
tags: some extra chnages (45f1a9d)
tags: some minor chnages (36886fc)
tags: suggested changes done (8aca49e)
toast: switches toast[open] to use visibility hidden to fix overlay handling (#3511) (8428cad), closes #3510

Features

menu: convert to core tokens (#3254) (da43540)
opacity-checkerboard: add component (#3416) (90202f9)
picker-button: migrate to core tokens (b39219c)
sidenav: migrate to core tokens (1846aa3)

0.35.0 (2023-07-31)

Bug Fixes

color-wheel: reorient reactively to "dir" changes (#3319) (6a9dcec)
grid: added lit dependency (#3489) (fb5f166)
menu item missing aria labels (#3417) (0d04869)
meter, progress-bar, progress-circle: use innerText when label is not provided (#3483) (59358c7)
meter: added role meter progressbar in meter component (#3459) (d2eccef)
number-field: update button label to use number-field-labels as part of the text (#3474) (b92daf2)
setting title when textfield is invalid (36d0537)
split-button: update more button label application (#3354) (b4c9595), closes #3305
swatch: clear previously selected children when updating selected (ce1bd36)
swatch: warn when mixed-value used with selects !== 'multiple' (#3460) (89c288e)
tabs: allow bi-directional arrow key navigation in both orientations (#3410) (ea10049)
textfield: add support for [grows] when [multiline] (3b306d4)
textfield: update focus state when [multiline][quiet] (#3452) (a7f563a)

Features

action-bar: use core tokens (4e21edf)

0.34.0 (2023-07-11)

Bug Fixes

action-button,action-menu,picker,split-button: expand and update application of aria-* attributes (52c0156)
action-group: ensure Action Button clicks are attributed to the right element (#3292) (ddccab7)
added role for href button (5a4ad98)
color-area,color-slider: color-area labeling, RTL support, vertical slider orientation(#3315) (ca2acda), closes #3313
color-loupe: hide svg from screen readers (#3318) (01e75b7)
color-slider,color-wheel: fix focused state #3278 (96b83f7)
color-slider: announce new value on change after keydown (#3304) (d70d0ae), closes #3303
number-field,search,textfield: add t-shirt sizes (fda8f96)
picker: correct label application for screen readers (8ce0cb0)
radio: fix radio documentation usage of sp-field-label[for] and sp-radio-group[id] (60f54fb)
sidenav: express hierarchy using list and listitem (f9019d7), closes #3348 #3348
slider: #3340 fix visual regression (88e0bda)
slider: slider input aria-valuetext omits formatOptions for unit #3340 (d5ff7e6)
swatch: mixed-value state must be conveyed to screen readers using ARIA (#3330) (7711264)
table: include all dependencies, @lit-labs/observers was missing (98d0370)
text fixes (0121fd6)
textfield: add rows attribute (#3356) (1ee1c37)
vrt-compare: updating the readme about vrt tests (#3380) (8eb28c8)

Features

accordion: core token migration (#3300) (9650b71)
card: use core tokens (9cccd26)
tabs,top-nav: use Core Tokens (c6ba355)

0.33.2 (2023-06-14)

Note: Version bump only for package @adobe/spectrum-web-components

0.33.1 (2023-06-14)

Bug Fixes

color-slider: use inset-block- and inset-inline- and fix RTL orientation and behavior #3301 (52aa328)
menu: #3164 plug memory leak with gobal events (ff589d4)

Reverts

Revert "chore: bump @playwright/test from 1.30.0 to 1.35.0" (0fa99a7)

0.33.0 (2023-06-08)

Bug Fixes

color-slider: vertical variant orientation is upside down #3291 (67c7e0a)
number-field: simplify width management (ef4765a)
removed usage of id in accordion (c26c81f)

Features

search: use core tokens (c62a7cd)

0.32.0 (2023-06-01)

Bug Fixes

action-group: update application/management of "role" on group and buttons (533873b), closes #3221 #3221 #3221
base: ensure streaming listener "streams" on the animation frame (1478db1)
color-handle,color-loupe: accept updated CSS token names (8c28f6d)
overlay: ensure CSS calcs resolve to the expected measurement value (51a3feb)
picker: correct attribute spelling of "aria-label" in dismiss button (5fc9b30)
process "defineElement()" to CEM files (cd8c99f)

Features

dropzone: use core tokens (11f7560)
initial impl of next.js wrapper for the swc (af911e0)
number-field: use core tokens (23a924e)
popover: use core tokens (68328cc)
search,textfield: use core tokens (2ed5135)
slider: use spectrum-tokens (8b1e72c)
thumbnail: use core tokens (e298035)

0.31.0 (2023-05-17)

Bug Fixes

generate react/picker and pass react TS checks (101b88c)
meter,progress-bar: add i18n to progress delivery (c7e4020)
overlay: address review comments (dd8b985)
overlay: removes use of px units in overlay stack (122f96c)
overlay: stop the tab trapping if shadow root is not found (4f0ec46)
shared: allow "disabled" first to return to "tabindex=0" in "focusable" (160bc59)

Features

icon: image src invalid error api (19e06f9)
icon: review comment changes (ba75d94)
icon: review comment changes (4597713)
icon: review comment changes (19287fb)
icon: review comment changes (dee1929)
icon: review comment changes (cb41b33)
icon: skipping test case for webkit (fa4b903)

0.30.0 (2023-05-03)

Bug Fixes

#2933 by adding optional variant property to SideNav (9c45c33)
#353 with a temporary override (e6b4e37)
abstract "hasVisibleFocusInTree" functionality and return trigger focus after close (4f39f2c)
accordion: ensure item toggle events can be prevented from the outside (30dbfc8)
accordion: update a11y tree to not double label (cc91a6b)
action-button: add support for XS t-shirt size (75440ce)
action-button: all "selected" Action Buttons should be "aria-pressed=true" (d85e235)
action-button: ensure disabled buttons are not interactable (b81c3ba)
action-button: expand Spectrum CSS processing (ff1a424)
action-group: add custom focus() method and use sendKeys for correct "Enter" key testing (638aa35)
action-group: allow direct setting aria-label on first update (84f7fdd)
action-group: allow for initial button being "disabled" (a1e3939)
action-group: allow quiet and emphasized attributes to be passed to slotted action buttons (aadfddb)
action-group: pass styles to nested children, too (12f1be3)
action-group: support ActionButtons that are not direct children (1d4efd5)
action-group: use the correct role for buttons when not selects (0aae8ed)
action-menu: apply slot text observer pattern (bbe6bb5)
action-menu: call super.firstUpdated for focus control (88bad85)
action-menu: fix 2510, unable to control top-level action-menu selection (c9198c2)
action-menu: never set item selected values when selects is undefined (5237fdb)
action-menu: provide action menu size to action button (b963f57)
action-menu: spectrum adherence update (6eb1860)
action-menu: stop stripping selected state from submenu items (968d1f2)
actionbar: include dependencies and outline API (2fc42e5)
actionbar: reflect "open" property to attribute (ec9979e)
adapt and improve css (649eeed)
adapt golden hash of new images for split-view visual stories (0135d03)
adapt tests (88a2ff7)
add "editable" option to "sp-slider" (e86d7fa)
add "value" slot to sp-menu-item (e1bd264)
add @slot description (03019d6)
add content flow fallbacks to the position manager (c008957)
add docs and address PR comments (568062a)
add grid areas workaround locally until available in Spectrum CSS (4c5ed9d)
add Grid pattern (341f493)
add icon present and icon-only support to Picker (f6887a3)
add input validation to Number Field (b1dd5ea)
add likeAnchor API to Card element (5c338fb)
add missing "elements.js" export for sp-table component (ab8e2a7)
add missing dependency (9f74e7d)
add support for "padding" attribute (e43078f)
add support for "readonly" attribute (4bce3b7)
add support for Element Resolution (d6a65d0)
add t-shirt sizing to Thumbnail and support for "xxs"/"xs" sizes (520a642)
add tabs sizes to TopNav (159bc89)
add the missing quiet property to Link component (867ea43)
add tslib as dependency where needed (78885d9)
add value/selection checks to the tests and fix up the value logic (933106f)
add when directive (18b7405)
address a11y issues raised by updating our dependencies (4f06477)
address westbrooks comments (634af60)
allow "updateComplete" to resolve to a boolean like the LitElement default (6127946)
allow ActiveOverlay to manage open state (a7c4cff)
allow contextmenu event passing to pierce shadow roots (05b69e9)
allow detached elements to be used as content for an overlay (3ad8383)
allow dir to be managed across multiple connections and disconnections (6d93170)
allow direct child selectors when processing Spectrum CSS (0ce79be)
allow for late loading theme scopes (4c7a124)
allow Picker to be reparented (39e7309)
allow rendered anchors to be aria-hidden (2e9aa23)
allow sp-dropdown to accept focus visibly from sp-field-label (134bafc)
allow sp-dropdown to accept focus visibly from sp-field-label (31e6fdf)
allow Tab elements to accept slotted DOM content (29c9517)
allow tick labels to start counting from "min" (e7e44e3)
allow user input of extemely large number when a max is applied (0644b7f)
allow value when step=0 (41de75a)
analyze errors, properly this time (df685a2)
analyze type errors, and add deprecated syntax tests (b7e67a1)
apply "HelpTextMixin" to form elements (a952447)
apply Focuable styles in class extensions (38f7afd)
asset: include alternative text for the file/folder versions (92a091c)
asset: include alternative text for the file/folder versions (7bf317e)
asset: surface label attribute for folder/file "assets" (861696b)
avatar: ensure there is ALWAYS a focusElement (c1c8644)
avoid registering lit-virtualizer globally (281071f)
bad merge conflict resolution (e408d61)
badge: ensure built assets as publish time (0b13319)
base: use full file extension (6ea4d9d)
bundle: bundle does not export its own custom-elements.json (a362886)
button: add "toggles" attribute to action button (3e2d80c)
button: add excludeSourceSelector to reduce duplication of styles (683e88e)
button: add multiple ui icon imports to sp-button (2f17fa9)
button: allow element content in the default/label slot (7b0ef58)
button: apply icon as slotted content in action-button styles (3b1487b)
button: clean up clear button for reuse across elements (4c71eb1)
button: delivery hold affordance when attribute available (aecc6fe)
button: delivery hold affordance when attribute available (8efbf0d)
button: include "pointerleave" in management of the "active" state (2e702e4)
button: minor docs spelling fix (a7a1359)
button: no double link clicks (02d576c)
button: prevent default on "space" based activations (708d587)
button: relate to this.href correctly (fade3ea)
button: remove old package export listings (32e8573)
button: revert default "variant" application when missing (fab993e)
button: use slot text observer pattern (a7288c3)
card: allow for preview or cover-photo (2d2f42b)
card: correctly apply :focus-visible styling to variants (d7c7539)
card: create no preview image variant of card instead of no imageless variant at all (7b102b9)
card: do not transform subheadling text to uppercase (4244390)
card: do not transform subheadling text to uppercase (ea3119b)
card: include dependencies (18beaf6)
card: normalize sizing technique to align with future t-shirt size usage (6f05b3b)
card: remove duplicate stories (f266e41)
card: removed empty card from documentation/stories (8322894)
card: stop event propogation on handleselectedchange (0ef95e5)
card: update golden image cache (b06e92d)
centralize updated first focusable selector (300e84c)
check if current selected value exists before setting selected attr (1878ca3)
checkbox: allow events to be cancelled on checkboxbase (aab568c)
checkbox: work around specificity changes when processing Spectrum CSS and cover with tests (d53a871)
cleaning up spectrum-config (0fde625)
click on docs sidenav links in Edge (fc999bf)
close modal overlays with contextmenu events and pass those to the underlying page (9e83f3c)
code review feedback (23b84fc)
code review feedback (441bbb7)
color-area: fix hue value for hsv and hsl (a66e111)
color-area: up and down arrows now work properly (44b9f74)
color-slider: use correct focus events in test (b974c12)
color-wheel: use correct focus events in test (f6f35ec)
complete deprecation of "quiet" attribute in checkbox and radio (29d8452)
constrain overlay to available window size (9729b55)
contain activation to header content (10183ce)
convert the langage resolution workflow to a Reactive Controller (b7781db)
correct @element jsDoc listing across library (c97a632)
correct a11y representation of a radio group (24ed0b8)
correct a11y tree (f7e54e5)
correct add/remove timing of overlay events (474ec6e)
correct calculation of height when using primary-size='auto' (0ff67c0)
correct custom property hoisting (a1d98dc)
correct dependency graph (69165eb)
correct max size calculation for overlays (0585f7f)
correct overlay closure order or operations for manual override (0b7a8c4)
correct sizing of sp-theme in storybook (976e691)
correct slider math in RTL contexts (4d73fa9)
correct sp-textfield[multiline][grows] styling and add story for regression testing (58c9331)
correct specificity of webkit appearance work around (f0d06bf)
correct the origin on "maximumFractionDigits" when deciding "inputMode" (e2fe9c8)
correct the relationship between overlayWillCloseCallback and phased animations (c63db8d)
correct theme calculation for triggering warnings (5576329)
correct viewSize calc and test (2befdd5)
correct yarn.lock branch (47e419f)
correctly apply CSS Custom Props to docs site (e87911f)
correctly apply tab order to Accordion Items (fd7a7f9)
correctly delivery visuals and mouse interactions for litAnchor and extensions (0ae889a)
correctly track "activeElement" across shadow boundaries (8b9f93a)
css fixes for action-menu (8c804c8)
delete the used cleanup method (942ef0f)
describe longpress button to screen readers (acdcaf4)
dialog: dialog wrapper headline a11y (205e8f7)
dialog: don't show DialogWrapper divider when there's no headline (b46f724)
dialog: ensure :focus-visible polyfill availability (b50e396)
dialog: include all dependencies (9be0da0)
dialog: include all dependencies (7090320)
dialog: more complete support for Spectrum CSS input (925934a)
dialog: more complete support for Spectrum CSS input (c77a00c)
dialog: normalize sizing technique to align with future t-shirt size usage (da33797)
dialog: prevent "fullscreen*" dialogs from being "dissmisable" (c3a6420)
dialog: support "error" in wrapper, prevent undelay closure when not dismissable (6789102)
dialog: support "error" in wrapper, prevent undelay closure when not dismissable (f52d428)
dialog: swap secondary and cancel button order (3df1705)
dialog: updates for delivering dialog content accessibly (f0ed33c)
dialog: use default value for "resolveTransitionPromise" for open by default dialogs (7317a3f)
dialog: use styles from the modal package (0f04ce1)
dialog: use styles from the modal package (d98f812)
dir should never fall back to null (6b16c6d)
disallow undefined property for min and maxlength (21547f7)
divider: update a11y semantics (46e6a12)
docs button variant usage (894282c)
docs: revert greenkeeper so that docs can be built again (b29b432)
documentation: add base search url (#2799) (f7af7cd)
dropdown: connect "label" attribute to "aria-label" (49b89a9)
dropdown: correct conditional check (a3a790f)
dropdown: correctly support "quiet" variant (2a51a2b)
dropdown: improve accessibility (389d9d9)
dropdown: remove unexpected width constraint (c625853)
dropzone: show dragged color in new illustratedmessage version (0591acf)
ensure "click" on "NumpadEnter" key press (450fa01)
ensure "wheel" interactions lead to a "change" event (3be87cd)
ensure [disabled] styling (4c067eb)
ensure Action Menu Item with [href] close the menu (6b3d87f)
ensure all theme data is exported and listed for side effects (14efdc7)
ensure aria attributes based on state (6369ff3)
ensure aria attributes based on state (6ee43de)
ensure browser understandable extensions (f4e59f7)
ensure CCX search visual delivery (22b90b9)
ensure color wheel in not opinionated about saturation and lightness (8e0fd9c)
ensure correct Menu Items are "selected" when passed into the overlay (46a25db)
ensure dependencies included in package.json (eb77858)
ensure focus is managed when tabbing out of a menu (9bfa81d)
ensure icon packages get properly processed for custom-elements.json listings (38a5706)
ensure item exists when attempting to acquire next item to focus (fb52cea)
ensure lazily loaded focusElements do not crash (64f2a54)
ensure library readiness on "yarn install" (fde2408)
ensure library readiness on "yarn install" (#265) (26f0fc7)
ensure Overlay.update bypasses the auto close mechanism (8f2aa2e)
ensure reactivity of resolved language (5863a15)
ensure streamingListener ends even if pointercancel not fired (74105f2)
ensure that "selected" can be set more than once from the outside (5f1996c)
ensure that all paths to user change of selected trigger a change event (2eee81e)
ensure that an overlay can be released even if it does not complete its fade in animation (4cbb36f)
ensure that entering an ancestor Menu Item without a submen closes related submenus (efe5fa1)
ensure that updates to Tab element content update the Selection Indicator (94891eb)
ensure themes are registered before adopting (a7ffb84)
excluded custom-vars-viewer from gen-react-wrapper (9f748e7)
expand sized functionality to support no default and returning to default values (acf3cfb)
expand support for maintaining hue and saturation across customization (fe18944)
expand sync offering for elements with overlay content (0195843)
explicitly setting NumberField wheel event handler as not passive (fad1496)
export CSS with appropriate scoping (3cf9f40)
extract and share tshirt size styles (3acfc30)
extract and share tshirt size styles (b1440f7)
factor theme to use a single DOM node (7641228), closes #154
fast forward changes in #2905 (3a30b27)
field-label: do not assume a target is available and surface t-shirt sizing (c5daead)
final prerelease review of canary builds (1fc032f)
fix expanding sidenav item that has no value (b28cdac)
flappy Slider/Color Area tests (c769c87)
flatten assigned nodes to observe text of nested slots (08ffd68)
focusable style (48ea3e7)
font.css not auto-generated from spectrum-css (2621a8a), closes #308
for docs, add webcomponent polyfill for Edge (6edc30b)
get theme element working in storybook (4c5e478)
give Picker a focus helper to enable tab navigation in Safari (e796525)
handle ta[ highlight color for android (fe9d430)
have sp-dialog-wrapper confirm scroll management of its dialog when opening (fed9536)
hopefully fix CI (ea87245)
icon: clean up docs and types for available size values (c38850d)
icon: prevent async race resulting in multiple inner SVG elements (b05e2d5)
icons-workflow: rename icons/files to avoid ad blocking (842b081)
icons: process icons for use as UIIcons (47a43d7)
illustrated-message: use accessibile tagnames (e47b469)
implement "emphasized" styles (750bbe7)
implement "emphasized" styles (74a7bfb)
import LitVirtualizer from @lit-labs/virtualizer@0.7.0-pre.3 (9886ce4)
improve accessibility through aria-label attribute usage (66752b7)
improve css class handling, %-test and increase base dependency (2f2c28d)
improve css, simplify attributes & properties (6ddd47c)
include "type" in package.json, generate custom-elements.json (1a8d716)
include all dependencies (c80d244)
include default export in the "exports" fields (f32407d)
include element is bundle side effects (ce320f8)
include late added items in the item list for the Picker (9232eb1)
include sync builds in publication configuration (e731673)
include the ":root" selector in tokens CSS for use in the docs site (a51e465)
include the "types" entry in package.json files (b432f59)
include the "types" entry in package.json files (a1f91f4)
include touch-action rule for draggable content (53221da)
include touch-action rule for draggable content (3f507e6)
issues with optionsMenu & menuItems (01a7e35)
keep compact property (904df71)
keep compact property (b5af15f)
keep parent overlays open when not closing child hover overlays (643fcff)
key interaction handling no longer prevents "tab" presses (b542ce8)
leverage "dvh" rather than measured screen height (84b9df0)
leverage Color Controller to unify color interface across packages (fb71690)
link: correct custom CSS processing configuration (2a24d5a)
link: correct white space in template/docs site (a48bd06)
link: correct white space management (a7a63dc)
link: process Spectrum CSS without overwriting specificity (9eb3d5c)
link: support "secondary" variant (3808b96)
link: test inner anchor attribute by accessing via focusElement (f4e97a1)
lint away debugger statements (34a498e)
make overlays open in correct position on Edge (5e57b0a)
make sp-tab-list work in Edge (948559a)
manage "focused" across more contexts (9273c15)
manage "lang" via context provided by "sp-theme" (b1e3457)
manage updated node types (0517fc1)
manually support WHCM in tabs (11884f1)
match "pointerup" listeners with "pointercancel" for full coverage (7f2ce92)
match footer default color to content (fd2b6f9)
menu: add support for submenu interactions (68399af)
menu: allow for settign "selected" async from above (9d7f622)
menu: cache item parent element to correct disconnecting event dispatch (f375510)
menu: clarify menu internal focus management via preventScroll option (9ae092c)
menu: disabled menu-item should not open submenu (33848bc)
menu: ensure active descendant is in view when activated (6edc351)
menu: ensure that Groups in Action Menus are rendered with the correct width (a996a10)
menu: include all direct dependencies (aa7327f)
menu: manage tabindex and focus entry correctly (3b1a250)
menu: only scrollIntoView when keyboard navigating (f4e9278)
menu: pass current focus visibility to menu items (2d3bf80)
menu: patch undefined lastFocusedItem (772a7ea)
menu: prevent infinite loop when focus() (e4e98a3)
menu: prevent infinite loop when focus() (98cc45b)
menu: support menu item list change in deep decendents (b2b47f3)
meter: remove comment (27687ec)
meter: remove comment (df726a6)
minlength now accepted as minimum length for value.toString (bc3b1c2)
missed ActionMenu for type changes (fa66d56)
missing dependency (bb411b5)
missing new-line preventing commits (d88e2a9)
modify overrides for new Button CSS (8a36124)
move hover/focus hoisting into conditioning (15ac2f7)
move property management into update or willUpdate (f66069f)
no scroll update when managing elements outside of the tab order (144c548)
normalize "event" and "error" argument names (8d382cd)
normalize "lit" dependency versions (9e09b0c)
normalize focus passing during and after pointer events (357931b)
normalize wheel input directionally for more predictable input (e4383a8)
number-field: add an "indeterminate" state (8bde8a1)
number-field: add support for modified stepping (#1534) (f8ec763)
number-field: added flag to scroll event to allow slider component to update on scroll (4199eb0)
number-field: clean up delivery of quiet variant (cd93964)
number-field: dispatch input/change events as expected (4a457ee)
number-field: ensure "quiet" Number Field is sized correctly in the DOM (3ea2c8f)
number-field: include dependancy listings (5c9031d)
number-field: prevent changes by user when readonly (64a7e93)
number-field: prevent interactin with stepper buttons when disabled (ae20343)
number-field: process 2 byte characters as their single byte cousins (f424c0a)
number-field: readonly - no pointer events for stepper buttons (05364fb)
number-field: support non-supported units in "Intl.numberFormat" (d846c0b)
number-field: validate value before dispatching "change" event (8c2ad89)
overlay react wrapper generation (922e30f)
overlay-root: measure "active-overlay" after styles are applied (d1a9e38)
overlay-root: open/close with the same scheduling consideration (919b64e)
overlay-trigger: allow trigger to be [disabled] (fe9541e)
overlay: add overlay lifecycle methods to stack management (9361527)
overlay: allow [type="modal"] hover overlays to be closed (5a6802b)
overlay: allow external style access to "sp-theme" elements in overlays as a CSS part (a107f66)
overlay: allow overlay-trigger to declaratively open overlay content (194a44e)
overlay: close when overlay-trigger becomes [disabled] (6f27e25)
overlay: correct overlay content sizing (d9bcd6f)
overlay: do not focus the trigger when closing an overlay, unless expected (21d7dfe)
overlay: do not focus the trigger when closing an overlay, unless expected (bed817f)
overlay: enforce the full frame (63628e9)
overlay: ensure overlay addition occurs after closing previous (7d2b102)
overlay: ensure undefined data is not passed into theme (3e2e1ca)
overlay: export OverlayTriggerInteractions type (4caec7f)
overlay: extend state machine to manage disposal process (f0f26af)
overlay: focus closure action on ancestor scroll, not participant resize (925af0a)
overlay: handle hover/longpress more directly via the "open" attribute (7b2b64b)
overlay: init tab trapping on OverlayStack construction (a3121e3)
overlay: measure initial overlay data offscreen (fecda5a)
overlay: move "escape" listener to "keydown" (813b341)
overlay: new popper version tracks scroll through assigned slots (ea2bac4)
overlay: only "tab trap" when you mean to (74e1bd2)
overlay: override SpectrumCSS tip rules and process usage in popper (aad3dec)
overlay: persist hover overlay when there is not click content (27111a9)
overlay: place return focus element on demand (d262237)
overlay: reduce DOM and use of "display: contents" for simplicity and accessibility (2e02075)
overlay: reduce the control active-overlay places on its content (9d12571)
overlay: remove trapped content from a11y tree, manage focus, open projected content (6c496c0)
overlay: remove unused dependency (a3f3a72)
overlay: reset cached values and applied CSS before "updating" overlays (b871e52)
overlay: resolve async races with closeOverlays and manageOpen (ff3738e)
overlay: track "modalRoots" for expanded overlay management (dceccb1)
overlay: traverse up through shadow roots when determining parent overlay (27f232c)
overlay: use esm build from popper and point through to types (078ca0f)
overlay: use esm build from popper and point through to types (853f77f)
overlay: use isolatedModules in tsconfig (48d6069)
overlay: use isolatedModules in tsconfig (ad376a4)
overlay: use tabindex=-1 but always remove it on open (6047003)
overlay: vend a VirtualTrigger for overlays with no element trigger (a359c60)
override and clear text-transform: uppercase (dddce4b)
package: update @spectrum-web-components/button to version 0.3.1 (37a9c0e)
package: update @spectrum-web-components/button to version 0.4.1 (e8540b7)
package: update @spectrum-web-components/styles to version 0.4.1 (2b1f1fa)
picker: accept new "value" and new option post first render (8f8c93f)
picker: add "quick select" action to right/left arrow keys (21895ee)
picker: allow menu items to be added, updated, and removed (73511ba)
picker: ensure focus visibility application (2679081)
picker: ensure that width is customizable from the outside (702b052)
picker: make "change" event bubbling and composed (1fdd33d)
picker: query less strictly to support automatically selecting values (969f966)
picker: use "modal" as the menu overlay interaction (c8fbbe2)
pin back gh-pages to allow publishing (d7a0c59)
polishing (d112875)
position tip shapes for bi-directional delivery (35654de)
prepare for future core token consumption that leverages component names (99f466b)
prepare for querying child items while disconnected (f4152a5)
prevent "hover" overlays from receiving focus (7bd5ac2)
prevent "hover" overlays from returning focus to the root of a parent modal (ceb8fa7)
prevent active pointer events when slider toggles to [disabled] (ceb4d74)
prevent console.log in source and test files (3ee082c)
prevent default hoisting of custom pseudo elements (7f66346)
prevent Dialog Wrapper from dispatching two "close" events (be6d23b)
prevent focus outline (af2b077)
prevent Grid clicks from throwing focus unexpectedly (872e9fd)
prevent infinite loops when all children are [disabled] (2deac3d)
prevent leaving multiple submenus open at a time (d2bfbb2)
prevent longpress when interacting with context menu (f8b0732)
prevent mobile interactions from triggering the virtual keyboard (d06ad17)
prevent reuse of applied IDs when associating Dialogs to their content (962c3e8)
prevent runaway event listeners by not rendering while disconnected (aa8e8b2)
prevent tabindex=-1 elements from placing focus on their host (1ac1293)
prevent touch scolling on non-modal content (e471feb)
proper overflow rtl support (9b1c9d4)
propogate open to child sp-popover (ae97677)
pull out rendering for Dialog into individual methods (84aa3ec)
radio: ensure radio-group first selected value is followed (074bff8)
radio: process :focus and :focus-visible (77bc0e9)
radio: select in response to arrow keys not focus (b6acb59)
README: broken link to documentation site (1784344)
reduce cycles (66a4efb)
reduce cycles (8917a5e)
remove ":" based namespacing of events (d77a843)
remove "type: "module"" in package.json for node 12 (c9f76e2)
remove <sp-menu> usage where deprecated (387db3b)
remove attribute binding logic (1f6833f)
remove attribute binding logic (7bce0ae)
remove duplicate box-sizing style from storybook-decorator (3f45dd7)
remove errant readme content, correct icon selector (3dd1fb1)
remove nothing update (b066ebc)
remove outdated CEM listing (2e110d9)
remove right click value setting (a44968d)
remove standard variant from image getter (97e4713)
remove unused dependencies and imports (fad4c9b)
renamed the file but not this (ad94e53)
replace missing globby.sync with fg.sync in build:component-inventory (d180658)
resolve "updateComplete" with a boolean like LitElement (2ebcd44)
review deque accessibility testing of docs site (31f43aa)
search: ensure "reset" surfaces "input" and "change" events (d8204a9)
search: prevent overflow content from going behind clear button (956f947)
shared: fixes focus-visible types in test (0dc7d68)
shared: fixes search input - fixes #463 (6833944)
shared: further tweaks for test types (ee45173)
shared: improves types for focus-visible (b980f2a)
shared: include an actual entry point for bundlephobia (00fd6ab)
shared: make Focusable pass disabled always (a339d6f)
shared: prevent focusable returning focus to host (745f7b0)
shared: prevent focusing focusable root on second click (0fb5006)
shared: quiet the angry soul of the explicit any linter (c278263)
shared: removes mousedown event handling in focusable (4e90d4c)
shared: removes unnecessary global module definition (07ec506)
sidenav: add aria-current when using href with sidenav-item (9172639)
sidenav: add support for icons and document icons/headlines (9ddb363)
sidenav: manage tabindex when interacting with keyboard (ea977cf)
sidenav: prevent items with hrefs from toggling expanded or selection (7ff4920)
sidenav: tighten Spectrum adherence and sharpen docs delivery (d4c70cd)
simplify focus application in Menu (6140169)
simplify optionsMenu usage and fix tests (91241b7)
simplify touch-action application (d23f735)
slider: add less visually effectacious style to the slider output when editable (8702294)
slider: add quiet and indeterminate (8990573)
slider: allow irregular tick spacing and correct RTL value application (a83f879)
slider: allow irregular tick spacing and correct RTL value application (ca0c937)
slider: allow pointer interactions that start at the very begin/end to be tracked (ff8c95c)
slider: allow pointer interactions that start at the very begin/end to be tracked (28c5ef4)
slider: allow slot based label content (d2d474e)
slider: apply "handle.highlight = true" when using the keyboard to interact with handles (94e6349)
slider: dispatch synthetic pointerdown event (7dc74af)
slider: ensure "sp-slider:input" is dispatched appropriately (ded5440)
slider: ensure min/max/value application order (80e8cb5)
slider: ensure pointer events on the track and handle act the same (03adb36)
slider: ensure that handles are upgraded before extracting a model from them (bbbb21f)
slider: ensure track widths follow dynamic Spectrum CSS values (5ad1c1a)
slider: ensure value is bound as a property (96bd01a)
slider: fixes usage of aria-valuetext, adds aria-valuenow (4b25a89)
slider: make implicit dependency on sp-slider-handle explicit (cb8d84b)
slider: manage focus more like a native rage input (865115e)
slider: manage value and max changing in unison (4359fbe)
slider: prevent pointercancel events by container touch-action (4687d03)
slider: prevent pointercancel events by container touch-action (9f55520)
slider: renamed flag from stepperActive to managed input to allow verified (scroll) input event (89d6ac5)
slider: response to orientation changes when measuring the bounding box (c1412f1)
slider: simplify application of the gradient backgrounds (f96a97e)
slider: support customizing visible label delivery (a55b585)
slider: support non-supported units in "Intl.numberFormat" (ac32355)
slider: update a11y tree and default max value (3cbf222)
slider: use internal "input" for value sanitation (dd588c9)
slider: use standard "change" and "input" events (59cf786)
slider: work around Spectrum CSS bug in variant="range" styling (e5810a9)
slot documentation (0ebd260)
special case the possibility of leaving an overlay trigger by entering its overlay content (c32a075)
split-button tests & lots of cleanup based on review feedback (10b4a04), closes #1189
split-button: correct style application (a954fdf)
split-button: follow visible tab order (966d3b6)
split-button: hide "selected" item from menu (322a966)
split-button: remove "popover" from render path (f1cd7ca)
split-button: test a11y correctly, find issues, fix them (4283994)
split-view: end drag on pointerleave (85e5258)
split-view: prevent touch-action on handle for delivery in mobile (b68c497)
split-view: redraw when primary-size change (665d238)
status-light: extend docs and styling for [disabled] (3d9fd16)
status-light: manage aria-disabled from disabled attribute (8bc9be7)
status-light: review comments for status-light (80caa08)
status-light: update version in bundle pjson (a8eabdb)
stop merging selectors in a way that alters the cascade (369388f)
stop merging selectors in a way that alters the cascade (532304f)
stop propagation of sp-radio "change" events at sp-radio-group boundary (f618460)
story-decorator: ensure reduce motion application in overlays (3f1bc23)
story-decorator: use sp-field-label (5992c98)
style clean up (49e1537)
style icons in Picker correctly (0bbdf84)
styles: add basic color-scheme support (1ccf110)
styles: ensure ",map" file inclusion in the published package (54a2b13)
styles: move @spectrum-web-components/base from devDependencies to dependencies (246411c)
styles: process CSS in package for use directly in a browser (cf52924)
styles: process CSS in package for use directly in a browser (d85779f)
styles: update exports listing (535113d)
support --spectrum-global-dimension-dividers token (59fda81)
support a wider number of sizes (ee44978)
support matching keydown to [dir] (70b40a9)
support non-flat "color" application (efc0159)
swap the order here so the variables are defined first (01d8724)
swatch: normalize repeat selection of same item in "selects=single" (ee0fb0c)
swc-templates: ensure the styles filename is correct (13916ab)
swc-templates: update naming, imports, and dependencies (12d43ed)
switch to heading/subheading instead of title (d182a0f)
switch: process CSS correction (292fff1)
switch: track aria-checked (1980046)
tab indicator positioning (8c20769)
tab-list: add support for "vertical-right" (da740c0)
tab-list: correct specificity collision (622887e)
tab-list: hide indicator without selection, listen to resize events (feadf3c)
tab-list: position the indicator correctly when sized (e956758)
tab-list: remove logging (dc73329)
tab-list: size indicator on font load, click/focus ring management (254815b)
tab-list: transition indicator "width" as well as position (b26ab76)
tab: allow icon only, expand visual regression suite (a167550)
table: add resize controller to TableBody for a11y reasons (85dd406)
table: allow "change" events from table row content (97699a0)
table: allow tablebody to be resized via flex-grow (f797202)
table: update element tag in sp table sub components (4e94d70)
table: update sp-table import in elements.js (0cfe25a)
tabs: add "emphasized" and correct WHCM delivery (27940bd)
tabs: add "quiet", "compact", and "emphasized" "direction=vertical" (26fff53)
tabs: add "tablist" part to manage list styles (bbf8074)
tabs: added test (7d5f41f)
tabs: bind tabindicator update to dir value (09598b5)
tabs: bind tabs overflow state with sp-tabs (a07c45b)
tabs: bind tabs overflow state with sp-tabs (570a2cd)
tabs: correct entry focus element (64407d3)
tabs: correct indicator size by scaling from 100px (a3fb68b)
tabs: ensure only one active tab stop in the tabs (68b2523)
tabs: ensure tabs has layout (7aba515)
tabs: ensure that "auto" attribute is respected (d200775)
tabs: error on click - undefined tab target (9742227)
tabs: include sp-tab-panel.js in the export map (1619ae8)
tabs: manage disabled state on tabs and tab elements (58def1f)
tabs: update css workarounds (c2a17e0)
tab: use Spectrum CSS relative values for overrides (f2e22f8)
tags: correct render types (ecfb6ab)
tags: gate focus with deletable attribute (d5e79f6)
tags: support distant sibling selectors (a8dcf7f)
tests weren't fully updated (22bf3b1)
textfield: add 'u' flag to keep consistency with native input element (0af779f)
textfield: add maxlength and minlength attributes (5326649)
textfield: add select() API mapping to shadow DOM element (d467a34)
textfield: break very long words within the Textarea's sizer element (2f95ac0)
textfield: correct "multiline" and "grows" delivery (fa0ac34)
textfield: leverage aria-invalid attribute (e718c0a)
textfield: prevent IME selection misalignment in Safari when using hiragana input modality (f8e1e70)
textfield: process ".is-focused" and ".is-keyboardFocused" styles (48fd67d)
textfield: process ".is-focused" and ".is-keyboardFocused" styles (9fe6a42)
textfield: reimplement min/maxlength (23a4c2e)
textfield: remove use of sp-icons-* (9a5c213)
textfield: respect resize styling (04993c3)
textfield: respect type=text|url|tel|email|password (1b7a59a)
textfield: update for easier extensibility (9deaf9e)
textfield: update validation path, add "allowed-keys" (ae9f85d)
textfield: Use correct filename in exports field (637b166)
theme: include "large" scale (67577e7)
theme: make typescript happy (a9aa377)
theme: prevent property sets attribute set property stack overflow (28d8a07)
theme: stop language resolution propagation and demo using local languages (6b81391)
theme: support lazily loading theme fragments (3c3b634)
theme: track default theme values dynamically (a0c306c)
theme: Use correct filename in exports field (d5da506)
these selectors didn't actually change (a5ac275)
toast: ensure "close" event only triggers when open===false (7fa08ba)
toast: include dependencies (1b82212)
tooltip: correct arrow orientation, remove popper-arrow-rotate (fcd6ea2)
tooltip: ensure delayed and self-managed tooltips do not disrupt the page layout (0f43b25)
tooltip: manage describedby attributes non-destructively (8443136)
top-nav: ensure focus state in all contexts (6de83be)
top-nav: initialize nav with an undefined selection (3473f63)
top-nav: initialize nav with an undefined selection (d801d64)
top-nav: match indicator management strategy from Tabs (ecc76a0)
top-nav: minor edits to description, typos (bc2ee48)
top-nav: prototype top-nav pattern (9708f6f)
tray: add tray pattern (0915fa5)
tray: include correct dependency listing (51cb231)
update "reparentChildren" types for flexibility (2d358be)
update colour slider (9acda67)
update configuration for Spectrum CSS processing for specificity (5c2e21e)
update consumption of Spectrum CSS for latest version (ed2305b)
update export patterns (b2da444)
update file path access (8898bf7)
update indicator animation for loading and content direction (f607f8b)
update latest Spectrum CSS beta releases (d8d3acc)
update latest Spectrum CSS beta releases (11b47df)
update method extension types to match (6eb686f)
update package.json (455b626)
update Picker label via MutationObserver instead of "slotchange" (196998e)
update presence confirmation so popper is available on update (24f8380)
update role application logic to not overwrite menu* roles (94b6aec)
update screen reader interface with menu items list (16756b5)
update side effect listings (8160d3a)
update slotting in "sp-sidenav-item" to allow for labelling in HTML (928c476)
update spelling (283d10a)
update the ci visual baselines (dc9cf05)
update timing to support non-virtualized rows (11ff752)
update to latest spectrum-css packages (a5ca19f)
update when events are added to manage overlays (60cddac)
updating spectrum-config to support new label styles (cefeaad)
use "fixed" strategy to prevent unexpected overlay placement (e39e108)
use CSS Custom Property name supplied by Spectrum for dividers (e6977c3)
use CSS position relative and revert Tabs.ts changes (a682bcf)
use height: 100% to avoid layout breaks (1498129)
use hue normalized color in handle and allow focus (f9e1fa2)
use icons without "size" values (3fc7c91)
use latest @spectrum-css/* versions (c35eb86)
use latest @spectrum-css/* versions (d0d67a2)
use latest @spectrum-css/thumbnail with built in "cover" support (d152b4e)
use less restrictive overlay sizing (f6917aa)
use local declaration of ShadowRoot.adoptedStyleSheets (43f1c63)
use ObserveSlotText mixin to prevent white space from overriding label attribute (610fb4b)
use the "browsers" listing in postcss-preset-env (4eaf6a2)
use type="search" for nicer virtual keyboards (c439eb3)
use typescript@^4.5 for "native" document.fonts typings (a3e4aea)
visual test name change (a06676a)
wait for fonts ready before positioning overlays (cb8026a)
work around icon positioning error in CSS source (ef5271c)
workaround bug in Edge with switches (7014a2c)

Features

accordion: add accordion pattern (97529d8)
accordion: allow accordion items to close (3c715ab)
accordion: allow accordion items to close (e930e43)
accordion: update spectrum css input (d94e059)
action-bar: create sp-action-bar component to replace sp-actionbar (38004b4)
action-button: add action button pattern (03ac00a)
action-group: add action-group pattern (d2de766)
action-group: manage "one" and "multiple" selections (6fad59e)
action-group: update spectrum css input (9840b19)
action-group: use core tokens (73f3b51)
action-menu: allow icon customization (cffd49a)
action-menu: remove menu selection by default (54d636f)
action-menu: update spectrum css input (62a5065)
actionbar: add actionbar component package (36dd7e9)
actionbar: update spectrum css input (8c888aa)
add "darkest" theme styles (fe38025)
add and use icons-ui package (d9c3ab2)
add badge component (cabfdfe)
add dialog, dialog-wrapped, and underlay elements (3df9050)
add Help Text pattern (fdbb812)
add open/close events for some menus and overlays (17f0a58)
add Picker Button pattern (31337b8)
add plop templating to get started fast (2b415bf)
add reactive controllers package (d434e9d)
add screenshot regression testing to CI (8205dfe)
add selects attribute to menu (bdf2578)
add support for replacement of complexSelectors in CSS processsing (bbbe391)
add support for Spectrum Express (12bfe99)
add swatch pattern (0cdc04b)
add t-shirt sizing to the Radio pattern (fc49343)
add t-shirt sizing with visual regressions to checkbox and picker elements (ce47ec8)
adopt DNA@7 base Spectrum CSS (e08cafd)
allow activation of longpress content (55e71fd)
allow CSS processing to manage :host(:before) (bee3ca1)
allow dir management by sp-theme elements (2d10158)
allow slotted title for card (aaf7157)
apply sizedMixin for t-shirt sizing (d7b63fb)
asset: add the asset pattern (a7c00bb)
asset: update spectrum css input (b3f0d70)
avatar: add avatar component (a6882b4)
avatar: update spectrum css input (0a6f35a)
avatar: use core tokens (6937e68)
badge: use core tokens (83e566c)
bar-loader: add bar-loader pattern (eff18e7)
bar-loader: update spectrum css input (7c41293)
base: insert Spectrum base class/mixin (37c2ee9)
bundle: add search (0e00123)
bundle: include sp-actionbar (af4b09f)
button-group: add ButtonGroup pattern (c4d85b5)
button-group: update spectrum css input (d8b1218)
button-group: use core tokens and add t-shirt sizing (960e972)
button: accept update Spectrum Tokens (d6d6db1)
button: action-buttons with icons AND text (aa788b1)
button: add support for "sp-clear-button" (9028b6d)
button: allow icon only buttons (25623d6)
button: move "white" and "black" out of "variant" and into "static" (5cf51df)
button: pass "label" property to "aria-label" (78ae59d)
button: update spectrum css input (7b5b200)
button: use latest @spectrum-css/button beta (b3b20ed)
button: use latest @spectrum-css/button beta (9360b60)
button: use synthetic button instead of native (49e94bc)
button: use synthetic button instead of native (ed30d82)
button: using core-tokens for button (a4a6d42)
card: update spectrum css input (18b6dae)
card: upgrade to Spectrum CSS v3.0.0 (84cf1a9)
checkbox: update spectrum css input (e894cb4)
circle-loader: update spectrum css input (75dcf52)
circleloader: add circleloader component (ebab180)
close-button: add Close Button pattern (8e9e1ad)
close-button: use core tokens (e6a4efe)
coachmark: add coachmark pattern (f53ae70)
coachmark: update spectrum css input (a099ee6)
color-area: add color-area pattern (dc15e1c)
color-area: separate X and Y aria labels to improve accessibility (e8d9768)
color-area: use core tokens (51a89de)
color-handle: add color-handle pattern (e3856d8)
color-handle: use core tokens (e0c1468)
color-loupe: add color-loupe pattern (e2f0d15)
color-loupe: use core tokens (149165c)
color-slider: add color-slider pattern (625f6fe)
color-wheel: add color-wheel pattern (8b2a56d)
color-wheel: use core tokens (57159a2)
conditionally load focus-visible polyfill (6b5e5cf)
debug colour elements for a11y (7008f7c)
delivery dev mode messages in various packages (62370a1)
deprecate "icon-right" in buttons as per Spectrum (064a775)
deprecate sp-menu in PickerBase derived classes (bbb773c)
dialog: descendent attribute support, responsive attribute added (568cedb)
dialog: update spectrum css input (405ca5e)
dialog: use latest @spectrum-css/dialog beta (b5d5718)
dialog: use latest @spectrum-css/dialog beta (1a599a6)
divider: create sp-divider from sp-rule (ec26d81)
divider: use core tokens (e30c969)
dropdown: add 'selectedItemText', acquire 'value' from menu-item (ee991af)
dropdown: check open in fixture in tests (02c0b9d)
dropdown: handle being set from outside again and disabaled items (81e5cab)
dropdown: open menu UI with overlay system (9811eeb)
dropdown: pull request changes (661165b)
dropdown: update spectrum css input (4fd3585)
dropzone: update spectrum css input (0f5a667)
example-project-rollup: add an exmaple project powered by rollup (975c243)
field-group: add field-group pattern (f8d265c)
field-group: add field-group pattern (b027f27)
field-group: update spectrum css input (b2160a9)
field-group: use core tokens (7433e59)
field-label: add field label pattern (2fa7c7e)
field-label: add field label pattern (efdcbf1)
field-label: update spectrum css input (80a993d)
field-label: use core tokens (8db7ac4)
icon: add UIIcon styles (6f03b1a)
icon: allow <sp-icon> to accept a slotted icon (cbf7a07)
icons-ui: update spectrum css input (4cb87ff)
icons-ui: vend fully registered icon components (915a7b5)
icons-workflow: add workflow icons package (6b09287)
icons-workflow: update spectrum css input (549b4b6)
icons-workflow: vend fully registered icon components (941f3a4)
iconset: update spectrum css input (914150a)
icons: update spectrum css input (296738e)
icon: update spectrum css input (42f17db)
illustrated-message: update spectrum css input (25c0545)
illustrated-message: use core tokens (5f34473)
implement #2964 for sidenav component (99afac9)
implement #2964 for sidenav component (5bf36e5)
include all Dev Mode files in side effects (f70817c)
join overlay-root and overlay-trigger as overlay (dcde42c)
leverage "exports" field in package.json (321abd7)
leverage latest Spectrum button API (9faeade)
leverage latest Spectrum button API (9caf2f6)
link: add download attribute to <sp-link> (fb02104)
link: add download attribute to <sp-link> (fefb28e)
link: add download attribute to <sp-link> (4811653)
link: add download attribute to <sp-link> (aed8639)
link: add download attribute to <sp-link> (16894ba)
link: add download attribute to <sp-link> (0763504)
link: support rel attribute (df4b5a8)
link: update spectrum css input (e8cd359)
link: use core tokens (510173b)
menu-item: added 'value' and 'itemText' properties (2c187b5)
menu: update spectrum css input (8c7e18a)
meter: add meter pattern (fa092ba)
meter: add meter pattern (42a6951)
meter: update spectrum css input (683bb1a)
modal: add modal CSS only pattern (44c7655)
modal: add modal CSS only pattern (f2bb4ad)
modal: update spectrum css input (bbcfc2a)
modified .selected to make <sp-action-group> a controllable component (#2006) (4c69b25)
multi-handle slider implementation (8d5a743), closes #1385
number-field: add number field pattern (384ab34)
number-field: use new config (8d42d69)
observe document.documentElement for dir value (da84a9a)
overlay: manage focus throwing and tab trapping (27a0b53)
overlay: move entire package behind dynamic import by default (9b0a74d)
pass through autocomplete attribute to inputs (5416510)
picker: process field-label content for more accurate a11y tree (dc9df54)
picker: replace dropdown with picker component (30b8bc7)
picker: support responsive delivery of menu (20031d1)
picker: update "icons-only" to "icons=only" to support more variations (de16a62)
picker: use new tokens (7d65b69)
popover: update spectrum css input (0f7a00e)
progress-bar: replace bar-loader with progress-bar (182935c)
progress-bar: use core tokens (540552e)
progress-circle: replace circle-loader with progress-circle (a852140)
progress-circle: use core tokens (587ac63)
quick-actions: add quick-actions pattern (3664b51)
quick-actions: update spectrum css input (efec525)
radio: update spectrum css input (4fef340)
react: react wrapper generator (#2745) (2c9d006)
reparentChildren - insertAdjacentElement style API (07f966f)
reparentChildren - refactored arguments - breaking change (dea2bc5)
rework overlays to use popper (e17d1bb)
rule: add Spectrum rule pattern and apply to docs (f4c52ae)
rule: update spectrum css input (1e9f240)
search: adds sp-search element (d484fc2)
search: introduce API to control form interactions (42fac00)
search: submit will bubble (8014345)
search: support "quiet" variant (d0f85f1)
search: update spectrum css input (05d8131)
search: use Spectrum CSS ^3.0.0 (7830ac0)
select row when clicking row (294523c)
sets action-menu quiet to false by default, fixes #3040 (8414cab)
setup SplitView component from rebase main (32f3272)
shared pkg versions, devmode define warning, registry-conflicts docs (6e49565)
shared: add mixing for observing text content changes in a slot (1318150)
shared: conditionally apply focus-visible polyfill (b854df6)
shared: conditionally apply focus-visible polyfill (ca1de8d)
sidenav: add a "change" event to track the "value" property (8d3a0bd)
sidenav: add keyboard accessibility (6ff622b)
sidenav: update spectrum css input (bd43201)
slider: add "ramp" and "tick" variant support (bb98bb6)
slider: add "ramp" and "tick" variant support (6b4e4a4)
slider: adds getAriaValueText property, fixes #381 (5800915)
slider: mouse event fallback from pointer events (b69e7fc)
slider: support tick labels and tick steps (1ccf8d6)
slider: update "value" default to match browser native range input (0050f63)
slider: update spectrum css input (21ebe36)
slider: use latest @spectrum-css/slider beta (9f29bbe)
slider: use latest @spectrum-css/slider beta (b8c6488)
split icons into their own export (98dac4c)
split-button: add split-button pattern (d3d8240)
split-button: add split-button pattern (012b7f8)
split-button: add split-button pattern (4833a59)
split-button: update spectrum css input (7d83331)
status-light: add status-light component (e3a5b3d)
status-light: update spectrum css input (e10fd45)
story-decorator: add story decorator to replace knobs for theme application (7c0c6be)
story-decorator: ensure version (dd39772)
styles: add typography coverage (e8ab4dd)
styles: bump to latest tokens (077434a)
styles: process, deliver, document the "large" scale (89d4911)
styles: update spectrum css input (88314bb)
styles: update typography to leverage Core Tokens (2f86560)
styles: vend CSS literal versions of the typography system (6406c96)
styles: vend CSS literal versions of the typography system (1658efa)
support processing CSS from individual Spectrum CSS packages (a1d6938)
support rel attribute for sidenav item (90522e7)
support Spectrum Token consumption and update Action Button to use them (743ab16)
support static white and static black variants of Action Button (7f1e25b)
swatch: use core tokens (821aebe)
swc-templates: update create process to require less manual interference (1342649)
swc-templates: update generator for new dir structure (72b631e)
switch: update spectrum css input (1d2ce17)
switch: use core tokens (8011ead)
tab-list: autofocus, :before/after processing, visual test (83dddb0)
tabs-overflow: address comments (b0e3398)
tabs-overflow: first round implementation of sp-tabs-overflow (c5b589a)
tabs-overflow: first round of feedback (3701e8a)
tabs-overflow: fix style and update unittest (59843df)
tabs-overflow: testing cli (fb08ed9)
tabs-overflow: update CSS and component to be more spectrum compliant (8c92ae9)
tabs-overflow: update documentation (13a6da6)
tabs: add sp-tab-panel element (b17d276)
tabs: add test coverage, remove unused property from component class (9933ad8)
tabs: add test coverage, update import paths (d104b52)
tabs: moving tabs overflow under tabs package (a18c692)
tabs: update bundle setup and readme (0249b94)
tabs: update imports to get correct coverage (2e421cd)
tabs: update spectrum css input (d875a0c)
tab: use @spectrum-css/tab, support :host(:before) selector (ace96f9)
tags: add tags pattern (ae91865)
tags: manage aria-disabled from disabled attribute (657eba8)
tags: update spectrum css input (f8a59ed)
textfield: add support for setSelectionRange (#2070) (dd17ba0)
textfield: update spectrum css input (2ce4ba2)
textfield: use Spectrum CSS ^3.0.0 (1c1acb9)
theme: filter css variables (1761f3a)
thumbnail: add the thumbnail package (56935d5)
toast: add "sp-toast" pattern (d0a5f00)
toast: default to "open === false", always dispatch "close" event (fcb3729)
toast: default to "open === false", always dispatch "close" event (544b6e5)
toast: update spectrum css input (183ee95)
tooltip: initial release (c1331c9)
tooltip: update spectrum css input (a946b1c)
track the associated Spectrum CSS package (86b1be5)
tray: use spectrum tokens (cdd78b2)
underlay: update spectrum css input (edf1a4b)
update card and tabs to latest spectrum-css (55b8d67)
update lit-* dependencies, wip (377f3c8)
update Menu Divider for new Spectrum CSS output (aca7e2d)
update to Spectrum CSS v3.0.0 (e8b3d8f)
upgrade accessibility of tab/tab-list family of elements (c7ea803)
use :focus-visable (via polyfill) instead of :focus (11c6fc7)
use @adobe/spectrum-css@2.15.1 (3918888)
use 3.0.0-beta.* release for styles (877b485)
use core tokens (d569672)
use latest exports specification (a7ecf4b)
use SixedMixin to manage "size" property (8819821)

Performance Improvements

accept new Spectrum CSS featuring simpler DOM structure (a0b042b)
button: recentralize shared styles in base (85d3d0a)
reduce render cycles when managing "dir" attribute (7b28309)
reorganize inheritance and composition in Menu Items (d96ccb6)
shared: focus-visible, lazily instantiate the focus-visible polyfilling (fe257c1)
shared: focus-visible, lazily instantiate the focus-visible polyfilling (1ffcedb)
use "sideEffects" listing in package.json (7271614)
use imported TypeScript helpers instead of inlining them (cc2bd0a)