@salt-ds/lab 1.0.0-alpha.92 → 1.0.0-alpha.94

package/CHANGELOG.md

@@ -1,5 +1,121 @@
 # @salt-ds/lab
 
+## 1.0.0-alpha.94
+
+### Minor Changes
+
+- fcf295b: Removed `Tree`, `TreeNode`, `TreeNodeTrigger`, and `TreeNodeLabel` from lab and promoted to core.
+- 5fc9124: ## Summary
+
+  New `ToolbarNext`, `ToolbarContentNext`, and `TooltrayNext` components for composing horizontal toolbars with responsive overflow, grouped controls, and keyboard navigation.
+
+  **What's included**
+
+  - Flat authoring with `TooltrayNext` children aligned to start, center, or end
+  - Explicit `ToolbarContentNext` regions for start, center, and end toolbar layouts
+  - Shared, named, grouped, independent, and non-overflowing tooltray overflow modes
+  - Overflow priority control for deciding which trays collapse first
+  - Bordered and transparent appearances with primary, secondary, and tertiary variants
+  - Horizontal toolbar semantics and keyboard navigation across toolbar controls and overflow menus
+  - `TooltrayNext` as a layout-only wrapper, with optional `role="group"` and accessible labels for meaningful control groups
+
+  ## Examples
+
+  **Basic Toolbar** — place `TooltrayNext` components directly inside `ToolbarNext`; use `align="end"` for trailing actions
+
+  ```tsx
+  import { Button, Dropdown, Input, Option } from "@salt-ds/core";
+  import { GridIcon, ListIcon, SearchIcon } from "@salt-ds/icons";
+  import { ToolbarNext, TooltrayNext } from "@salt-ds/lab";
+
+  const options = ["Option A", "Option B", "Option C"];
+
+  <ToolbarNext aria-label="Data controls">
+    <TooltrayNext>
+      <Dropdown bordered defaultSelected={["Option A"]} style={{ width: 160 }}>
+        {options.map((option) => (
+          <Option value={option} key={option} />
+        ))}
+      </Dropdown>
+    </TooltrayNext>
+    <TooltrayNext role="group" aria-label="Search">
+      <Input
+        bordered
+        startAdornment={<SearchIcon />}
+        placeholder="Search"
+        style={{ width: 180 }}
+      />
+    </TooltrayNext>
+    <TooltrayNext align="end" role="group" aria-label="View and actions">
+      <Button appearance="transparent" aria-label="Grid view">
+        <GridIcon aria-hidden />
+      </Button>
+      <Button appearance="transparent" aria-label="List view">
+        <ListIcon aria-hidden />
+      </Button>
+      <Button appearance="solid">Run</Button>
+    </TooltrayNext>
+  </ToolbarNext>;
+  ```
+
+  **Centered Toolbar With Named Overflow** — use `ToolbarContentNext` when you need explicit start, center, and end regions; named overflow keeps related actions behind a labelled trigger
+
+  ```tsx
+  import { Button, ToggleButton, ToggleButtonGroup } from "@salt-ds/core";
+  import { ToolbarContentNext, ToolbarNext, TooltrayNext } from "@salt-ds/lab";
+
+  <ToolbarNext aria-label="Centered actions">
+    <ToolbarContentNext position="start">
+      <TooltrayNext
+        overflowMode="none"
+        role="group"
+        aria-label="Primary action"
+      >
+        <Button appearance="solid">Create</Button>
+      </TooltrayNext>
+    </ToolbarContentNext>
+    <ToolbarContentNext position="center">
+      <TooltrayNext overflowMode="none" role="group" aria-label="View options">
+        <ToggleButtonGroup>
+          <ToggleButton value="day">Day</ToggleButton>
+          <ToggleButton value="week">Week</ToggleButton>
+          <ToggleButton value="month">Month</ToggleButton>
+        </ToggleButtonGroup>
+      </TooltrayNext>
+    </ToolbarContentNext>
+    <ToolbarContentNext position="end">
+      <TooltrayNext
+        overflowGroup="Actions"
+        overflowLabel="Actions"
+        overflowMode="grouped"
+        overflowPriority={5}
+        role="group"
+        aria-label="Secondary actions"
+      >
+        <Button appearance="transparent">Export</Button>
+        <Button appearance="transparent">Settings</Button>
+      </TooltrayNext>
+    </ToolbarContentNext>
+  </ToolbarNext>;
+  ```
+
+### Patch Changes
+
+- Updated dependencies [fcf295b]
+  - @salt-ds/core@1.63.0
+
+## 1.0.0-alpha.93
+
+### Minor Changes
+
+- 8980f01: Removed `SidePanel` and its related components (`SidePanelProvider`, `SidePanelTrigger`, `SidePanelCloseButton`, `SidePanelHeader`, `SidePanelTitle`, `SidePanelContent`, and the `useSidePanel` hook) from lab and promoted to core.
+
+### Patch Changes
+
+- 1718878: Updated Tree node layout to use `spacing-75 + spacing-50` vertical padding and `size-icon` chevron to align with design.
+- Updated dependencies [8980f01]
+  - @salt-ds/core@1.62.0
+
 ## 1.0.0-alpha.92
 
 ### Patch Changes

package/css/salt-lab.css

@@ -2227,132 +2227,6 @@
   display: none;
 }
 
-/* src/side-panel/SidePanel.css */
-.saltSidePanel {
-  --saltSidePanel-width: 300px;
-  --sidePanel-border: var(--salt-size-fixed-100) var(--salt-borderStyle-solid) var(--sidePanel-borderColor, var(--salt-container-primary-borderColor));
-  --saltSidePanel-padding: var(--salt-spacing-300);
-  position: relative;
-  display: flex;
-  flex-direction: column;
-  flex: none;
-  width: var(--saltSidePanel-width);
-  height: 100%;
-  min-height: 0;
-  align-self: stretch;
-}
-.saltSidePanel-primary {
-  --sidePanel-background: var(--salt-container-primary-background);
-  --sidePanel-borderColor: var(--salt-container-primary-borderColor);
-}
-.saltSidePanel-secondary {
-  --sidePanel-background: var(--salt-container-secondary-background);
-  --sidePanel-borderColor: var(--salt-container-secondary-borderColor);
-}
-.saltSidePanel-tertiary {
-  --sidePanel-background: var(--salt-container-tertiary-background);
-  --sidePanel-borderColor: var(--salt-container-tertiary-borderColor);
-}
-.saltSidePanel-none {
-  --sidePanel-background: none;
-  --saltSidePanel-padding: var(--salt-spacing-200);
-}
-.saltSidePanel-inner {
-  box-sizing: border-box;
-  display: flex;
-  flex-direction: column;
-  flex: 1;
-  min-height: 0;
-  padding: var(--saltSidePanel-padding);
-  width: 100%;
-  background-color: var(--sidePanel-background, var(--salt-container-primary-background));
-}
-.saltSidePanel-left .saltSidePanel-inner {
-  border-right: var(--sidePanel-border);
-}
-.saltSidePanel-right .saltSidePanel-inner {
-  border-left: var(--sidePanel-border);
-}
-.saltSidePanel-none .saltSidePanel-inner {
-  border: none;
-}
-.saltSidePanel-enterAnimation,
-.saltSidePanel-exitAnimation {
-  contain: paint;
-}
-.saltSidePanel-enterAnimation .saltSidePanel-inner,
-.saltSidePanel-exitAnimation .saltSidePanel-inner {
-  position: absolute;
-  top: 0;
-  bottom: 0;
-  flex: none;
-  width: var(--saltSidePanel-animation-width, var(--saltSidePanel-width));
-}
-.saltSidePanel-left.saltSidePanel-enterAnimation .saltSidePanel-inner,
-.saltSidePanel-left.saltSidePanel-exitAnimation .saltSidePanel-inner {
-  right: 0;
-}
-.saltSidePanel-right.saltSidePanel-enterAnimation .saltSidePanel-inner,
-.saltSidePanel-right.saltSidePanel-exitAnimation .saltSidePanel-inner {
-  left: 0;
-}
-.saltSidePanel-exitAnimation .saltSidePanel-inner {
-  pointer-events: none;
-}
-.saltSidePanel-enterAnimation {
-  animation: saltSidePanel-open var(--salt-duration-perceptible) var(--salt-animation-timing-function);
-}
-.saltSidePanel-exitAnimation {
-  animation: saltSidePanel-close var(--salt-duration-perceptible) var(--salt-animation-timing-function) both;
-}
-@keyframes saltSidePanel-open {
-  from {
-    width: 0;
-  }
-}
-@keyframes saltSidePanel-close {
-  to {
-    width: 0;
-  }
-}
-@media (prefers-reduced-motion: reduce) {
-  .saltSidePanel-enterAnimation,
-  .saltSidePanel-exitAnimation {
-    animation: none;
-  }
-}
-
-/* src/side-panel/SidePanelContent.css */
-.saltSidePanelContent {
-  display: flex;
-  flex-direction: column;
-  flex: 1;
-  min-height: 0;
-}
-.saltSidePanelContent-body {
-  flex: 1;
-  min-height: 0;
-  overflow: auto;
-}
-
-/* src/side-panel/SidePanelHeader.css */
-.saltSidePanelHeader {
-  display: flex;
-  align-items: flex-start;
-  flex-shrink: 0;
-  gap: var(--salt-spacing-100);
-  padding: 0 0 var(--salt-spacing-300);
-}
-
-/* src/side-panel/SidePanelTitle.css */
-.saltSidePanelTitle {
-  flex: 1;
-  min-width: 0;
-  min-height: var(--salt-size-base);
-  display: flex;
-  align-items: center;
-}
-
 /* src/static-list/StaticList.css */
 .saltStaticList {
   overflow-y: auto;
@@ -3247,161 +3121,204 @@
   flex-basis: 0;
 }
 
-/* src/tree/Tree.css */
-.saltTree {
+/* src/toolbar-next/ToolbarContentNext.css */
+.saltToolbarContentNext {
   display: flex;
-  flex-direction: column;
-  gap: var(--salt-spacing-fixed-100);
-  list-style: none;
-  margin: 0;
-  padding: 0;
-  outline: none;
-  width: 100%;
-  box-sizing: border-box;
+  align-items: center;
+  gap: var(--salt-spacing-100);
+  min-width: 0;
+  flex-shrink: 0;
 }
-.saltTree-disabled {
-  cursor: var(--salt-cursor-disabled);
+.saltToolbarContentNext[data-position=start] {
+  justify-content: flex-start;
 }
-
-/* src/tree/TreeNode.css */
-.saltTreeNode {
-  list-style: none;
-  position: relative;
-  cursor: var(--salt-cursor-hover);
+.saltToolbarContentNext[data-position=center] {
+  justify-content: center;
 }
-.saltTreeNode:focus {
-  outline: none;
+.saltToolbarContentNext[data-position=end] {
+  justify-content: flex-end;
 }
-.saltTreeNode:focus-visible > .saltTreeNodeTrigger,
-.saltTreeNode-focusVisible > .saltTreeNodeTrigger {
-  outline: var(--salt-focused-outline);
-  outline-offset: calc(var(--salt-size-fixed-100) * -2);
+.saltToolbarContentNext[data-implicit] > .saltTooltrayNext[data-align=center],
+.saltToolbarContentNext[data-implicit] > .saltTooltrayNext[data-align=end] {
+  margin-inline-start: 0;
+  margin-inline-end: 0;
+}
+
+/* src/toolbar-next/ToolbarNext.css */
+.saltToolbarNext {
+  box-sizing: border-box;
+  inline-size: 100%;
+  min-width: 0;
   position: relative;
-  z-index: calc(var(--salt-zIndex-default) + 1);
 }
-.saltTreeNode-selected:focus-visible > .saltTreeNodeTrigger,
-.saltTreeNode-selected.saltTreeNode-focusVisible > .saltTreeNodeTrigger {
-  outline: var(--salt-focused-outline);
-  outline-offset: calc(var(--salt-size-fixed-100) * -2);
-  z-index: calc(var(--salt-zIndex-default) + 1);
+.saltToolbarNext-layout {
+  align-items: center;
+  --saltToolbarNext-band-gap: var(--salt-spacing-100);
 }
-.saltTreeNode-group {
+.saltToolbarNext-layout:not([data-centered]) {
   display: flex;
-  flex-direction: column;
-  gap: var(--salt-spacing-fixed-100);
-  list-style: none;
-  margin: 0;
-  padding: 0;
-  padding-top: var(--salt-spacing-fixed-100);
+  column-gap: var(--saltToolbarNext-band-gap);
 }
-.saltTreeNode-checkbox {
-  flex-shrink: 0;
-  height: var(--salt-size-selectable);
+.saltToolbarNext-layout[data-centered] {
+  display: grid;
+  grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr);
 }
-.saltTreeNode-icon {
+.saltToolbarNext-band {
   display: flex;
-  align-items: flex-start;
+  align-items: center;
+  gap: var(--saltToolbarNext-band-gap);
+  min-width: 0;
+}
+.saltToolbarNext-layout:not([data-centered]) > .saltToolbarNext-band[data-band-position=end] {
+  justify-content: flex-end;
+  margin-inline-start: auto;
+}
+.saltToolbarNext-layout[data-centered] > .saltToolbarNext-band[data-band-position=start] {
+  grid-column: 1;
+}
+.saltToolbarNext-layout[data-centered] > .saltToolbarNext-band[data-band-position=center] {
+  grid-column: 2;
   justify-content: center;
-  width: var(--salt-size-selectable);
-  min-width: var(--salt-size-selectable);
-  height: var(--salt-size-selectable);
-  flex-shrink: 0;
 }
-.saltTreeNode-icon > * {
-  color: var(--salt-content-primary-foreground);
+.saltToolbarNext-layout[data-centered] > .saltToolbarNext-band[data-band-position=end] {
+  grid-column: 3;
+  justify-content: flex-end;
 }
-
-/* src/tree/TreeNodeExpansionIcon.css */
-.saltTreeNodeExpansionIcon {
+.saltToolbarNext-fallback {
   display: flex;
-  align-items: flex-start;
-  justify-content: center;
-  width: var(--salt-size-selectable);
-  min-width: var(--salt-size-selectable);
-  height: var(--salt-size-selectable);
-  flex-shrink: 0;
-  position: relative;
+  align-items: center;
+  gap: var(--salt-spacing-100);
 }
-.saltTreeNodeExpansionIcon-icon {
-  color: var(--salt-content-primary-foreground);
+.saltToolbarNext-layout > * {
+  min-width: 0;
 }
-.saltTreeNodeExpansionIcon::before {
-  content: "";
-  display: block;
+.saltToolbarNext-primary {
+  --toolbarNext-background: var(--salt-container-primary-background);
+  --toolbarNext-borderColor: var(--salt-container-primary-borderColor);
+}
+.saltToolbarNext-secondary {
+  --toolbarNext-background: var(--salt-container-secondary-background);
+  --toolbarNext-borderColor: var(--salt-container-secondary-borderColor);
+}
+.saltToolbarNext-tertiary {
+  --toolbarNext-background: var(--salt-container-tertiary-background);
+  --toolbarNext-borderColor: var(--salt-container-tertiary-borderColor);
+}
+.saltToolbarNext-bordered {
+  background: var(--saltToolbarNext-background, var(--toolbarNext-background));
+  border: var(--salt-size-fixed-100) var(--salt-borderStyle-solid) var(--saltToolbarNext-borderColor, var(--toolbarNext-borderColor));
+  border-radius: var(--salt-palette-corner, 0);
+  padding: var(--salt-spacing-100);
+}
+.saltToolbarNext-transparent {
+  background: transparent;
+  border: none;
+  padding: 0;
+}
+.saltToolbarNext-measurements {
+  display: flex;
+  gap: var(--salt-spacing-100);
   position: absolute;
-  width: var(--salt-size-base);
-  height: var(--salt-size-base);
-  top: 50%;
-  left: 50%;
-  transform: translate(-50%, -50%);
+  visibility: hidden;
+  pointer-events: none;
+  inset: 0 auto auto 0;
+  block-size: 0;
+  overflow: hidden;
 }
-
-/* src/tree/TreeNodeLabel.css */
-.saltTreeNodeLabel {
-  flex: 1;
-  font-family: var(--salt-text-fontFamily);
-  font-size: var(--salt-text-fontSize);
-  font-weight: var(--salt-text-fontWeight);
-  line-height: var(--salt-text-lineHeight);
-  letter-spacing: var(--salt-text-letterSpacing);
-  word-break: break-word;
+.saltToolbarNext-measureTrigger {
+  white-space: nowrap;
 }
 
-/* src/tree/TreeNodeTrigger.css */
-.saltTreeNodeTrigger {
-  box-sizing: border-box;
+/* src/toolbar-next/ToolbarNextOverflow.css */
+.saltToolbarNextOverflow-content {
+  position: relative;
+}
+.saltToolbarNextOverflow-slot,
+.saltToolbarNextOverflow-panelItem {
+  align-items: center;
   display: flex;
-  align-items: flex-start;
+  flex-shrink: 0;
   gap: var(--salt-spacing-100);
-  width: 100%;
-  min-height: var(--salt-size-base);
-  padding-top: calc((var(--salt-size-base) - var(--salt-size-selectable)) / 2);
-  padding-bottom: calc((var(--salt-size-base) - var(--salt-size-selectable)) / 2);
-  padding-right: var(--salt-spacing-100);
-  --saltTreeNodeTrigger-indentStep: calc(var(--salt-size-selectable) + var(--salt-spacing-100));
-  --saltTreeNodeTrigger-iconOffsetY: calc((var(--salt-text-lineHeight) - max(var(--salt-size-icon), 12px)) / 2);
-  --saltTreeNodeTrigger-directIconInsetX: max(0px, calc((var(--salt-size-selectable) - max(var(--salt-size-icon), 12px)) / 2));
-  padding-left: calc(var(--salt-spacing-100) + (var(--saltTreeNodeTrigger-indentStep) * (var(--saltTreeNode-level, 1) - 1)));
-  background: var(--salt-selectable-background);
-  color: var(--salt-content-primary-foreground);
+  min-width: 0;
 }
-.saltTreeNodeTrigger:hover {
-  background: var(--salt-selectable-background-hover);
+.saltToolbarNextOverflow-slot[data-align=end] {
+  margin-inline-start: auto;
 }
-.saltTreeNode:focus-visible > .saltTreeNodeTrigger,
-.saltTreeNode-focusVisible > .saltTreeNodeTrigger {
-  background: var(--salt-selectable-background-hover);
+.saltToolbarNextOverflow-slot[data-align=center] {
+  margin-inline-start: auto;
+  margin-inline-end: auto;
 }
-.saltTreeNode-selected > .saltTreeNodeTrigger {
-  background: var(--salt-selectable-background-selected);
-  box-shadow: 0 calc(var(--salt-size-fixed-100) * -1) 0 0 var(--salt-selectable-borderColor-selected), 0 var(--salt-size-fixed-100) 0 0 var(--salt-selectable-borderColor-selected);
-  position: relative;
-  z-index: var(--salt-zIndex-default);
+.saltToolbarNextOverflow-item {
+  align-items: center;
+  display: flex;
+  flex-shrink: 0;
+  min-width: 0;
 }
-.saltTreeNode-selected:focus-visible > .saltTreeNodeTrigger,
-.saltTreeNode-selected.saltTreeNode-focusVisible > .saltTreeNodeTrigger {
-  background: var(--salt-selectable-background-selected);
+.saltToolbarNextOverflow-menu {
+  display: flex;
+  flex-shrink: 0;
 }
-.saltTreeNode-disabled > .saltTreeNodeTrigger,
-.saltTreeNode-disabled:hover > .saltTreeNodeTrigger {
-  opacity: 0.4;
-  cursor: var(--salt-cursor-disabled);
-  background: var(--salt-selectable-background);
-  color: var(--salt-content-primary-foreground);
+.saltToolbarNextOverflow-itemHost,
+.saltToolbarNextOverflow-contentHost {
+  display: contents;
 }
-.saltTreeNodeTrigger > .saltTreeNode-checkbox {
-  margin-block: calc((var(--salt-text-lineHeight) - var(--salt-size-selectable)) / 2);
+.saltToolbarNextOverflow-trigger {
+  white-space: nowrap;
 }
-.saltTreeNodeTrigger > .saltTreeNodeExpansionIcon > .saltTreeNodeExpansionIcon-icon,
-.saltTreeNodeTrigger > .saltTreeNode-icon > .saltIcon {
-  --saltIcon-margin: var(--saltTreeNodeTrigger-iconOffsetY) 0 0 0;
+.saltToolbarNextOverflow-panel {
+  background: var(--salt-container-primary-background);
+  border: var(--salt-size-fixed-100) var(--salt-borderStyle-solid) var(--salt-selectable-borderColor-selected);
+  border-radius: var(--salt-palette-corner, 0);
+  box-shadow: var(--salt-overlayable-shadow-popout);
+  box-sizing: border-box;
+  max-width: min(32rem, calc(100vw - var(--salt-spacing-300)));
+  overflow: auto;
+  position: absolute;
+  z-index: var(--salt-zIndex-flyover);
 }
-.saltTreeNodeTrigger > .saltIcon {
-  --saltIcon-margin: var(--saltTreeNodeTrigger-iconOffsetY) 0 0 0;
-  box-sizing: content-box;
-  padding-inline: var(--saltTreeNodeTrigger-directIconInsetX);
+.saltToolbarNextOverflow-floatingDescendant.saltToolbarNextOverflow-floatingDescendant {
+  z-index: calc(var(--salt-zIndex-flyover) + var(--salt-zIndex-default));
+}
+.saltToolbarNextOverflow-panelContent {
+  align-items: center;
+  display: flex;
+  flex-wrap: wrap;
+  gap: var(--salt-spacing-100);
+  max-width: inherit;
+  min-width: max-content;
+  padding: var(--salt-spacing-100);
+}
+.saltToolbarNextOverflow-panel .saltTooltrayNext[data-align=center],
+.saltToolbarNextOverflow-panel .saltTooltrayNext[data-align=end] {
+  margin-inline-start: 0;
+  margin-inline-end: 0;
+}
+.saltToolbarNextOverflow-panel .saltTooltrayNext > * {
+  inline-size: auto;
+}
+.saltToolbarNextOverflow-content > .saltToolbarNextOverflow-slot .saltTooltrayNext[data-align=center],
+.saltToolbarNextOverflow-content > .saltToolbarNextOverflow-slot .saltTooltrayNext[data-align=end] {
+  margin-inline-start: 0;
+  margin-inline-end: 0;
+}
+
+/* src/toolbar-next/TooltrayNext.css */
+.saltTooltrayNext {
+  display: flex;
+  align-items: center;
+  flex: 0 0 auto;
+  gap: var(--salt-spacing-100);
+  min-width: 0;
+}
+.saltTooltrayNext > * {
   flex-shrink: 0;
-  color: var(--salt-content-primary-foreground);
+}
+.saltTooltrayNext[data-align=end] {
+  margin-inline-start: auto;
+}
+.saltTooltrayNext[data-align=center] {
+  margin-inline-start: auto;
+  margin-inline-end: auto;
 }
 
 /* src/window/ElectronWindow.css */
@@ -3514,4 +3431,4 @@
   margin: calc(var(--salt-size-unit) / 2) 0;
 }
 
-/* src/93ce53d7-3b64-4e16-8086-ef43a2ec8a13.css */
+/* src/90f79509-9c05-4f28-ba07-621519e16301.css */

package/dist-cjs/index.js

@@ -109,14 +109,6 @@ var useResizeObserver = require('./responsive/useResizeObserver.js');
 var useWidth = require('./responsive/useWidth.js');
 var utils = require('./responsive/utils.js');
 var SearchInput = require('./search-input/SearchInput.js');
-var SidePanel = require('./side-panel/SidePanel.js');
-var SidePanelCloseButton = require('./side-panel/SidePanelCloseButton.js');
-var SidePanelContent = require('./side-panel/SidePanelContent.js');
-var SidePanelHeader = require('./side-panel/SidePanelHeader.js');
-var SidePanelProvider = require('./side-panel/SidePanelProvider.js');
-var SidePanelTitle = require('./side-panel/SidePanelTitle.js');
-var SidePanelTrigger = require('./side-panel/SidePanelTrigger.js');
-var useSidePanel = require('./side-panel/useSidePanel.js');
 var StaticList = require('./static-list/StaticList.js');
 var StaticListItem = require('./static-list/StaticListItem.js');
 var StaticListItemContent = require('./static-list/StaticListItemContent.js');
@@ -138,10 +130,9 @@ var Toolbar = require('./toolbar/Toolbar.js');
 var ToolbarButton = require('./toolbar/ToolbarButton.js');
 var Tooltray = require('./toolbar/Tooltray.js');
 var ToolbarField = require('./toolbar/toolbar-field/ToolbarField.js');
-var Tree = require('./tree/Tree.js');
-var TreeNode = require('./tree/TreeNode.js');
-var TreeNodeLabel = require('./tree/TreeNodeLabel.js');
-var TreeNodeTrigger = require('./tree/TreeNodeTrigger.js');
+var ToolbarContentNext = require('./toolbar-next/ToolbarContentNext.js');
+var ToolbarNext = require('./toolbar-next/ToolbarNext.js');
+var TooltrayNext = require('./toolbar-next/TooltrayNext.js');
 var ElectronWindow = require('./window/ElectronWindow.js');
 var WindowContext = require('./window/WindowContext.js');
 var dateComponents = require('@salt-ds/date-components');
@@ -308,14 +299,6 @@ exports.useWidth = useWidth.useWidth;
 exports.isResponsiveAttribute = utils.isResponsiveAttribute;
 exports.liftResponsivePropsToFormField = utils.liftResponsivePropsToFormField;
 exports.SearchInput = SearchInput.SearchInput;
-exports.SidePanel = SidePanel.SidePanel;
-exports.SidePanelCloseButton = SidePanelCloseButton.SidePanelCloseButton;
-exports.SidePanelContent = SidePanelContent.SidePanelContent;
-exports.SidePanelHeader = SidePanelHeader.SidePanelHeader;
-exports.SidePanelProvider = SidePanelProvider.SidePanelProvider;
-exports.SidePanelTitle = SidePanelTitle.SidePanelTitle;
-exports.SidePanelTrigger = SidePanelTrigger.SidePanelTrigger;
-exports.useSidePanel = useSidePanel.useSidePanel;
 exports.StaticList = StaticList.StaticList;
 exports.StaticListItem = StaticListItem.StaticListItem;
 exports.StaticListItemContent = StaticListItemContent.StaticListItemContent;
@@ -337,10 +320,9 @@ exports.Toolbar = Toolbar.Toolbar;
 exports.ToolbarButton = ToolbarButton.ToolbarButton;
 exports.Tooltray = Tooltray.Tooltray;
 exports.ToolbarField = ToolbarField.ToolbarField;
-exports.Tree = Tree.Tree;
-exports.TreeNode = TreeNode.TreeNode;
-exports.TreeNodeLabel = TreeNodeLabel.TreeNodeLabel;
-exports.TreeNodeTrigger = TreeNodeTrigger.TreeNodeTrigger;
+exports.ToolbarContentNext = ToolbarContentNext.ToolbarContentNext;
+exports.ToolbarNext = ToolbarNext.ToolbarNext;
+exports.TooltrayNext = TooltrayNext.TooltrayNext;
 exports.ElectronWindow = ElectronWindow.ElectronWindow;
 exports.Window = WindowContext.Window;
 exports.WindowContext = WindowContext.WindowContext;

package/dist-cjs/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist-cjs/toolbar-next/ToolbarContentNext.css.js

@@ -0,0 +1,6 @@
+'use strict';
+
+var css_248z = ".saltToolbarContentNext {\n  display: flex;\n  align-items: center;\n  gap: var(--salt-spacing-100);\n  min-width: 0;\n  flex-shrink: 0;\n}\n\n.saltToolbarContentNext[data-position=\"start\"] {\n  justify-content: flex-start;\n}\n\n.saltToolbarContentNext[data-position=\"center\"] {\n  justify-content: center;\n}\n\n.saltToolbarContentNext[data-position=\"end\"] {\n  justify-content: flex-end;\n}\n\n.saltToolbarContentNext[data-implicit] > .saltTooltrayNext[data-align=\"center\"],\n.saltToolbarContentNext[data-implicit] > .saltTooltrayNext[data-align=\"end\"] {\n  margin-inline-start: 0;\n  margin-inline-end: 0;\n}\n";
+
+module.exports = css_248z;
+//# sourceMappingURL=ToolbarContentNext.css.js.map

package/dist-cjs/toolbar-next/ToolbarContentNext.css.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ToolbarContentNext.css.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;"}