Skip to content

2.0.0

Choose a tag to compare

@GarthDB GarthDB released this 28 Nov 22:51

Deprecations

Name changes from naming audit:

  • Accordion #414
    • spectrum-Accordion-header -> spectrum-Accordion-itemHeader
    • spectrum-Accordion-indicator -> spectrum-Accordion-itemIndicator
    • spectrum-Accordion-content -> spectrum-Accordion-itemContent
  • Action Menu #410
    • Removed wrapper class
  • Breadcrumbs #415
    • spectrum-Breadcrumbs-link -> spectrum-Breadcrumbs-itemLink
    • spectrum-Breadcrumbs-separator -> spectrum-Breadcrumbs-itemSeparator
  • Button (block) #416
    • This violates Spectrum Design conventions and is deprecated and removed from documentation, but the class still exists for backwards compatibility.
  • Button (quiet) #450
    • split up spectrum-Button--quiet--primary class into spectrum-Button--primary and spectrum-Button--quiet
  • Calendar #417
    • spectrum-Heading spectrum-Calendar-heading -> spectrum-Calendar-title
  • Clear Button #420
    • added spectrum-ClearButton-icon to the svg icon element.
  • Combobox/InputGroup #458
    • spectrum-InputGroup-input -> spectrum-InputGroup-field
  • Cyclebutton #411
    • Changed cycle button to an action button variant.
      • spectrum-CycleButton -> spectrum-ActionButton spectrum-ActionButton--quiet spectrum-CycleButton
    • Added spectrum-CycleButton-item to icon.
  • FieldGroup #413
    • Updated documentation to show it can be used with radio or checkboxes
    • Moved labelsBelow modifier to individual children
      • Removed spectrum-FieldGroup--labelsBelow
      • Added spectrum-Radio--labelBelow
  • Loader bar #462
    • Split loader bar into a new component and not just a variant.
      • spectrum-Loader--bar -> spectrum-BarLoader
  • Loader circle #462
    • Split loader circle into a new component and not just a variant.
      • spectrum-Loader -> spectrum-CircleLoader
      • spectrum-Loader-track -> spectrum-CircleLoader-track
      • spectrum-Loader-fills -> spectrum-CircleLoader-fills
      • spectrum-Loader-fill -> spectrum-CircleLoader-fill
    • Changed mask naming to better align with naming conventions
      • spectrum-Loader-fill-mask-1 -> spectrum-CircleLoader-fillMask1
      • spectrum-Loader-fill-submask-1 -> spectrum-CircleLoader-fillSubMask1
      • spectrum-Loader-fill-mask-2 -> spectrum-CircleLoader-fillMask2
      • spectrum-Loader-fill-submask-2 -> spectrum-CircleLoader-fillSubMask2
  • Miller Columns #439
    • spectrum-MillerColumn -> spectrum-MillerColumns-item
  • Pagination - Button #455
    • Moved from button to a for recommended elements.
    • Moved classes to parent
      • old: <nav><button class="spectrum-Button spectrum-Button--cta spectrum-Pagination-prevButton">
      • new: <nav class="spectrum-SplitButton spectrum-SplitButton--left"><a href="#" class="spectrum-Button spectrum-Button--cta spectrum-SplitButton-trigger">
      • old: <button class="spectrum-Button spectrum-Button--cta spectrum-Pagination-nextButton">
      • new: <a href="#" class="spectrum-Button spectrum-Button--cta spectrum-SplitButton-action">
  • Pagination - Explicit #455
    • Moved from button to a for recommended elements.
    • Moved classes to parent
      • old: <nav><button class="spectrum-ActionButton spectrum-ActionButton--quiet spectrum-Pagination-prevButton">
      • new: <nav class="spectrum-Pagination spectrum-Pagination--explicit"><a href="#" class="spectrum-ActionButton spectrum-ActionButton--quiet spectrum-Pagination-prevButton">
  • Pagination - Listing #455
    • Moved from button and span to a for recommended elements.
    • Moved classes to parent
      • old: <nav><button class="spectrum-ActionButton spectrum-ActionButton--quiet spectrum-Pagination-directionButton">Prev</button>
      • new: <nav class="spectrum-Pagination spectrum-Pagination--listing"><a href="#" class="spectrum-Button spectrum-Button--primary spectrum-Button--quiet spectrum-Pagination-prevButton">Prev</a>
  • Rating #445
    • is-active -> is-selected
  • SelectList #440
    • Renamed spectrum-SelectList to spectrum-Menu
    • spectrum-SelectList-item -> spectrum-Menu-item
    • Updated aria values
  • Slider #466
    • Changed "Double Handle" to "Range". Added spectrum-Slider--range class.
    • Added spectrum-Slider--filled
    • Removed class spectrum-Slider-track--ramp from svg
    • Added spectrum-Slider-ramp to parent container
  • Tabs #418
    • spectrum-Tabs-item-label -> spectrum-Tabs-itemLabel
  • Tags #419
    • spectrum-Tags-item-label -> spectrum-Tags-itemLabel
  • Toast #446
    • Converted close button to a HUD button
      • old: <button class="spectrum-Toast-closeButton">
      • new: <div class="spectrum-Toast-buttons"><button class="spectrum-ClearButton spectrum-ClearButton--medium spectrum-ClearButton--overBackground">
  • Treeview #438
    • spectrum-TreeView-link -> spectrum-TreeView-itemLink
  • Rating: #445
    • is-active -> is-selected
  • CycleButton: #445
    • is-active -> is-selected
  • Pagination: #445
    • is-active -> is-selected

New Features

Bug Fixes

Closed related issues