@surflane/ui 0.12.0 → 0.13.0

package/dist/tree.js

@@ -11,7 +11,7 @@ import { ScrollArea } from './scroll-area.js';
 import { cx } from './parts.js';
 const normalize = (text) => text.normalize('NFKC').toLocaleLowerCase();
 /** Loaded, immutable hierarchy. Remote loading, permission checks and mutations remain caller-owned. */
-export function Tree({ nodes, label, expandedIds, defaultExpandedIds = [], onExpandedIdsChange, selectedIds, defaultSelectedIds = [], onSelectedIdsChange, selectionMode = 'single', height = 320, rowHeight: explicitRowHeight, size, virtualized = true, labels, emptyLabel, dir, className, }) {
+export function Tree({ nodes, label, expandedIds, defaultExpandedIds = [], onExpandedIdsChange, selectedIds, defaultSelectedIds = [], onSelectedIdsChange, selectionMode = 'single', height = 320, rowHeight: explicitRowHeight, size, virtualized = true, labels, dir, className, }) {
     const scheme = useComponentSize(size);
     const touchFloor = React.useSyncExternalStore((listener) => {
         const query = matchMedia('(max-width: 760px), (pointer: coarse)');
@@ -313,5 +313,5 @@ export function Tree({ nodes, label, expandedIds, defaultExpandedIds = [], onExp
                                 item.expand();
                         }, children: _jsx(Icon, { name: 'chevron-forward', "data-expanded": item.isExpanded() || undefined }) })) : (_jsx("span", { className: 'surf-tree-leaf', "aria-hidden": 'true' })),
                     _jsx("span", { className: 'surf-tree-label', children: node.label })));
-            }) })) : (_jsx("div", { role: 'status', className: 'surf-tree-empty', children: labels?.empty ?? emptyLabel ?? 'No items.' })) }));
+            }) })) : (_jsx("div", { role: 'status', className: 'surf-tree-empty', children: labels?.empty ?? 'No items.' })) }));
 }

package/dist/typography.d.ts

@@ -1,11 +1,18 @@
 import * as React from 'react';
-export declare function Heading({ level, size, className, ...props }: React.HTMLAttributes<HTMLHeadingElement> & {
+export type HeadingVariant = 'display' | 'title' | 'page' | 'section' | 'subsection';
+export declare function Heading({ level, variant, size, className, ...props }: React.HTMLAttributes<HTMLHeadingElement> & {
     level?: 1 | 2 | 3 | 4 | 5 | 6;
-    size?: 'display' | 'title' | 'page' | 'section' | 'subsection' | 'workspace' | 'document';
+    /** The type role, as Text's variant is: display, title, page, section or
+     * subsection. */
+    variant?: HeadingVariant;
+    /** @deprecated The earlier name for `variant`. `workspace` and `document` are
+     * earlier names for `display`. */
+    size?: HeadingVariant | 'workspace' | 'document';
 }): React.JSX.Element;
 export declare function Text({ as: Tag, variant, color, weight, className, ...props }: React.HTMLAttributes<HTMLElement> & {
     as?: 'p' | 'span' | 'div';
-    variant?: 'body' | 'reading' | 'table' | 'caption' | 'label' | 'mono' | 'metric';
+    /** `table` is the earlier name for `compact`, deprecated: it renders the same. */
+    variant?: 'body' | 'reading' | 'compact' | 'table' | 'caption' | 'label' | 'mono' | 'metric';
     color?: 'primary' | 'secondary' | 'muted';
     weight?: 'regular' | 'medium';
 }): React.JSX.Element;

package/dist/typography.js

@@ -1,11 +1,12 @@
 import { jsx as _jsx } from "react/jsx-runtime";
 import { cx } from './class-names.js';
-export function Heading({ level = 2, size = 'section', className, ...props }) {
+export function Heading({ level = 2, variant, size, className, ...props }) {
     const Tag = `h${level}`;
-    return (_jsx(Tag, { ...props, className: cx('surf-heading', className), "data-size": size }));
+    // The role stays in data-size, which @surflane/css's heading classes read.
+    return (_jsx(Tag, { ...props, className: cx('surf-heading', className), "data-size": variant ?? size ?? 'section' }));
 }
 export function Text({ as: Tag = 'p', variant = 'body', color = 'primary', weight = 'regular', className, ...props }) {
-    return (_jsx(Tag, { ...props, className: cx('surf-text', className), "data-variant": variant, "data-color": color, "data-weight": weight }));
+    return (_jsx(Tag, { ...props, className: cx('surf-text', className), "data-variant": variant === 'table' ? 'compact' : variant, "data-color": color, "data-weight": weight }));
 }
 export const Prose = function Prose({ className, ref, ...props }) {
     return _jsx("div", { ...props, ref: ref, className: cx('surf-prose', className) });

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@surflane/ui",
-  "version": "0.12.0",
+  "version": "0.13.0",
   "description": "Surflane React components built on Base UI, with data, chart, code and Markdown components.",
   "keywords": [
     "design-system",
@@ -421,8 +421,8 @@
     "@base-ui/react": "^1.9.0",
     "@headless-tree/core": "^1.8.0",
     "@headless-tree/react": "^1.8.0",
-    "@surflane/css": "^0.12.0",
-    "@surflane/design-tokens": "^0.12.0",
+    "@surflane/css": "^0.13.0",
+    "@surflane/design-tokens": "^0.13.0",
     "@tanstack/react-virtual": "^3.14.21",
     "react": "^19.0.0",
     "react-aria-components": "^1.22.1",