@sproutsocial/seeds-react-tree 0.3.1

package/.turbo/turbo-build.log

@@ -0,0 +1,21 @@
+yarn run v1.22.22
+$ tsup --dts
+CLI Building entry: src/index.ts
+CLI Using tsconfig: tsconfig.json
+CLI tsup v8.5.0
+CLI Using tsup config: /home/runner/_work/seeds/seeds/seeds-react/seeds-react-tree/tsup.config.ts
+CLI Target: es2022
+CLI Cleaning output folder
+CJS Build start
+ESM Build start
+CJS dist/index.js     29.75 KB
+CJS dist/index.js.map 58.64 KB
+CJS ⚡️ Build success in 26ms
+ESM dist/esm/index.js     26.95 KB
+ESM dist/esm/index.js.map 58.29 KB
+ESM ⚡️ Build success in 27ms
+DTS Build start
+DTS ⚡️ Build success in 1655ms
+DTS dist/index.d.ts  4.11 KB
+DTS dist/index.d.mts 4.11 KB
+Done in 2.39s.

package/CHANGELOG.md

@@ -0,0 +1,112 @@
+# @sproutsocial/seeds-react-tree
+
+## 0.3.1
+
+### Patch Changes
+
+- Updated dependencies [69c9d02]
+  - @sproutsocial/seeds-react-icon@2.4.0
+
+## 0.3.0
+
+### Minor Changes
+
+- 1aa4c29: Add `TreeCombobox` — pairs `Tree` with a `role="combobox"` input following the
+  WAI-ARIA combobox pattern. DOM focus stays on the input; the active treeitem
+  is tracked via `aria-activedescendant`. Filters items by label and
+  auto-expands the ancestors of matches; restores user expansion state when the
+  query clears, and renders an `aria-live` empty state when nothing matches.
+
+  Keyboard support on the input: arrow keys, Home/End move the active item;
+  Enter selects/expands the active row (inheriting `Tree`'s selection
+  semantics); Escape clears the query. The query is controllable via
+  `query` / `defaultQuery` / `onQueryChange`.
+
+  `Tree` gains controlled `focusedId` / `onFocusedIdChange` props and a
+  `manageDomFocus` prop so hosts (like `TreeCombobox`) can drive the active
+  item externally without `Tree` calling `.focus()` on treeitems.
+
+### Patch Changes
+
+- Updated dependencies [5892f44]
+  - @sproutsocial/seeds-react-system-props@3.1.1
+  - @sproutsocial/seeds-react-icon@2.3.13
+
+## 0.2.5
+
+### Patch Changes
+
+- Updated dependencies [5114a32]
+  - @sproutsocial/seeds-react-theme@4.1.0
+  - @sproutsocial/seeds-react-icon@2.3.12
+  - @sproutsocial/seeds-react-mixins@4.3.7
+
+## 0.2.4
+
+### Patch Changes
+
+- Updated dependencies [132ef9d]
+- Updated dependencies [132ef9d]
+  - @sproutsocial/seeds-react-theme@4.0.0
+  - @sproutsocial/seeds-react-system-props@3.1.0
+  - @sproutsocial/seeds-react-icon@2.3.11
+  - @sproutsocial/seeds-react-mixins@4.3.6
+
+## 0.2.3
+
+### Patch Changes
+
+- @sproutsocial/seeds-react-icon@2.3.10
+
+## 0.2.2
+
+### Patch Changes
+
+- Updated dependencies [47c62b3]
+  - @sproutsocial/seeds-react-theme@3.7.1
+  - @sproutsocial/seeds-react-icon@2.3.9
+  - @sproutsocial/seeds-react-mixins@4.3.5
+
+## 0.2.1
+
+### Patch Changes
+
+- Updated dependencies [06da9c2]
+  - @sproutsocial/seeds-react-theme@3.7.0
+  - @sproutsocial/seeds-react-icon@2.3.8
+  - @sproutsocial/seeds-react-mixins@4.3.4
+
+## 0.2.0
+
+### Minor Changes
+
+- d7d64ab: Add new `@sproutsocial/seeds-react-tree` package with two components that
+  implement the WAI-ARIA treeview pattern.
+
+  **Components**
+
+  - `Tree` — composition root. Owns expansion + selection state, manages a single
+    roving `tabindex`, and applies `role="tree"` with the correct ARIA wiring.
+  - `TreeItem` — branch (when children are provided) or leaf. Renders `role="treeitem"`
+    with `aria-level`, `aria-expanded`, `aria-selected` / `aria-checked`,
+    `aria-disabled`, and `aria-labelledby`. Disclosure chevron sits on the
+    trailing edge (accordion-style).
+
+  **Behavior**
+
+  - Selection modes: `"single"`, `"multiple"`, or `"none"` (controlled or uncontrolled).
+  - `selectableNodes` prop: `"all"` (default) or `"leaves"` — in `"leaves"` mode,
+    parents are pure containers (no selection indicator rendered, click toggles
+    expansion only).
+  - `renderSelectionIndicator` render-prop slot for radio/checkbox/check variants.
+  - Full keyboard model: `↑/↓`, `←/→`, `Home`, `End`, `Enter`, `Space`, `*`
+    (expand all siblings), and first-letter type-ahead.
+  - Inset focus ring so the focused row doesn't bleed into adjacent rows or the
+    expanded children below.
+
+  **Accessibility**
+
+  Follows the [WAI-ARIA APG treeview pattern 1b](https://www.w3.org/WAI/ARIA/apg/patterns/treeview/examples/treeview-1b/),
+  including correct event-target handling so ancestor `treeitem`s don't intercept
+  keyboard navigation from their descendants. Stories include a `SelectionReadout`
+  helper with `aria-live="polite"` for announcing changes.

package/README.md

@@ -0,0 +1,51 @@
+# @sproutsocial/seeds-react-tree
+
+A WAI-ARIA treeview component for the Seeds design system. Provides a primitive
+`Tree` + `TreeItem` API plus a `TreeCombobox` wrapper that pairs the tree with
+a `role="combobox"` input following the WAI-ARIA combobox pattern.
+
+> Status: **under development.** Exported under the `./base` subpath
+> (`@sproutsocial/seeds-react-tree/base`) and shown in Storybook under
+> "Really Under Development / Tree".
+
+## Usage
+
+```tsx
+import { Tree, TreeItem } from "@sproutsocial/seeds-react-tree/base";
+
+<Tree aria-label="Files" defaultExpanded={["src"]}>
+  <TreeItem id="src" label="src">
+    <TreeItem id="Button.tsx" label="Button.tsx" />
+    <TreeItem id="Modal.tsx" label="Modal.tsx" />
+  </TreeItem>
+  <TreeItem id="package.json" label="package.json" />
+</Tree>;
+```
+
+For the combobox variant:
+
+```tsx
+import { TreeCombobox } from "@sproutsocial/seeds-react-tree/base";
+
+<TreeCombobox
+  aria-label="Pick a collection"
+  items={collections}
+  selectionMode="single"
+  renderSelectionIndicator={radioIndicator}
+/>;
+```
+
+## Accessibility
+
+The base `Tree` follows [WAI-ARIA APG Treeview pattern 1b](https://www.w3.org/WAI/ARIA/apg/patterns/treeview/examples/treeview-1b/):
+
+- `role="tree"`, `role="treeitem"`, `role="group"`
+- `aria-level`, `aria-expanded`, `aria-selected` / `aria-checked`, `aria-disabled`
+- Single tab stop with roving `tabindex`
+- Keyboard: `↑/↓ ← → Home End Enter Space *` + type-ahead first-letter
+
+`TreeCombobox` follows the [combobox-autocomplete-list](https://www.w3.org/WAI/ARIA/apg/patterns/combobox/examples/combobox-autocomplete-list/) example, with a tree as the popup:
+
+- `<input role="combobox" aria-expanded aria-controls aria-haspopup="tree" aria-autocomplete="list" aria-activedescendant>`
+- DOM focus stays on the input; the active treeitem is tracked via `aria-activedescendant`
+- Keyboard on the input: `↑/↓ ← → Home End` move the active item, `Enter` toggles selection (or expansion for branches in `selectionMode="none"`), `Escape` clears a non-empty query