@dxos/react-ui-list 0.9.0 → 0.9.1-main.c7dcc2e112

package/dist/types/src/components/List/ListItem.d.ts

@@ -1,49 +0,0 @@
-import { type Edge } from '@atlaskit/pragmatic-drag-and-drop-hitbox/closest-edge';
-import React, { type ComponentProps, type HTMLAttributes, type PropsWithChildren, type ReactNode, RefObject } from 'react';
-import { type IconButtonProps, type ThemedClassName } from '@dxos/react-ui';
-export type ListItemRecord = any;
-export type ItemDragState = {
-    type: 'idle';
-} | {
-    type: 'preview';
-    container: HTMLElement;
-} | {
-    type: 'is-dragging';
-} | {
-    type: 'is-dragging-over';
-    closestEdge: Edge | null;
-};
-export declare const idle: ItemDragState;
-type ListItemContext<T extends ListItemRecord> = {
-    item: T;
-    dragHandleRef: RefObject<HTMLButtonElement | null>;
-};
-export declare const ListItemProvider: React.FC<ListItemContext<any> & {
-    children: React.ReactNode;
-}>, useListItemContext: (consumerName: string) => ListItemContext<any>;
-export type ListItemProps<T extends ListItemRecord> = ThemedClassName<PropsWithChildren<{
-    item: T;
-    asChild?: boolean;
-    selected?: boolean;
-} & HTMLAttributes<HTMLDivElement>>>;
-/**
- * Draggable list item.
- */
-export declare const ListItem: <T extends ListItemRecord>({ children, classNames, item, asChild, selected, ...props }: ListItemProps<T>) => React.JSX.Element;
-export declare const ListItemIconButton: ({ autoHide, iconOnly, variant, classNames, disabled, ...props }: IconButtonProps & {
-    autoHide?: boolean;
-}) => React.JSX.Element;
-export declare const ListItemDeleteButton: ({ autoHide, classNames, disabled, icon, label, ...props }: Partial<Pick<IconButtonProps, 'icon'>> & Omit<IconButtonProps, 'icon' | 'label'> & {
-    autoHide?: boolean;
-    label?: string;
-}) => React.JSX.Element;
-export declare const ListItemDragHandle: ({ disabled }: Pick<IconButtonProps, 'disabled'>) => React.JSX.Element;
-export declare const ListItemDragPreview: <T extends ListItemRecord>({ children, }: {
-    children: ({ item }: {
-        item: T;
-    }) => ReactNode;
-}) => React.ReactPortal | null;
-export declare const ListItemWrapper: ({ classNames, children }: ThemedClassName<PropsWithChildren>) => React.JSX.Element;
-export declare const ListItemTitle: ({ classNames, children, ...props }: ThemedClassName<PropsWithChildren<ComponentProps<'div'>>>) => React.JSX.Element;
-export {};
-//# sourceMappingURL=ListItem.d.ts.map

package/dist/types/src/components/List/ListItem.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"ListItem.d.ts","sourceRoot":"","sources":["../../../../../src/components/List/ListItem.tsx"],"names":[],"mappings":"AAIA,OAAO,EACL,KAAK,IAAI,EAGV,MAAM,uDAAuD,CAAC;AAM/D,OAAO,KAAK,EAAE,EACZ,KAAK,cAAc,EACnB,KAAK,cAAc,EACnB,KAAK,iBAAiB,EACtB,KAAK,SAAS,EACd,SAAS,EAIV,MAAM,OAAO,CAAC;AAIf,OAAO,EAEL,KAAK,eAAe,EAEpB,KAAK,eAAe,EAErB,MAAM,gBAAgB,CAAC;AAKxB,MAAM,MAAM,cAAc,GAAG,GAAG,CAAC;AAEjC,MAAM,MAAM,aAAa,GACrB;IACE,IAAI,EAAE,MAAM,CAAC;CACd,GACD;IACE,IAAI,EAAE,SAAS,CAAC;IAChB,SAAS,EAAE,WAAW,CAAC;CACxB,GACD;IACE,IAAI,EAAE,aAAa,CAAC;CACrB,GACD;IACE,IAAI,EAAE,kBAAkB,CAAC;IACzB,WAAW,EAAE,IAAI,GAAG,IAAI,CAAC;CAC1B,CAAC;AAEN,eAAO,MAAM,IAAI,EAAE,aAAgC,CAAC;AAMpD,KAAK,eAAe,CAAC,CAAC,SAAS,cAAc,IAAI;IAC/C,IAAI,EAAE,CAAC,CAAC;IACR,aAAa,EAAE,SAAS,CAAC,iBAAiB,GAAG,IAAI,CAAC,CAAC;CACpD,CAAC;AASF,eAAO,MAAO,gBAAgB;;IAAE,kBAAkB,gDAGjD,CAAC;AAEF,MAAM,MAAM,aAAa,CAAC,CAAC,SAAS,cAAc,IAAI,eAAe,CACnE,iBAAiB,CACf;IACE,IAAI,EAAE,CAAC,CAAC;IACR,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB,GAAG,cAAc,CAAC,cAAc,CAAC,CACnC,CACF,CAAC;AAEF;;GAEG;AACH,eAAO,MAAM,QAAQ,GAAI,CAAC,SAAS,cAAc,+DAO9C,aAAa,CAAC,CAAC,CAAC,sBAkGlB,CAAC;AAMF,eAAO,MAAM,kBAAkB,oEAO5B,eAAe,GAAG;IAAE,QAAQ,CAAC,EAAE,OAAO,CAAA;CAAE,sBAY1C,CAAC;AAGF,eAAO,MAAM,oBAAoB,8DAO9B,OAAO,CAAC,IAAI,CAAC,eAAe,EAAE,MAAM,CAAC,CAAC,GACvC,IAAI,CAAC,eAAe,EAAE,MAAM,GAAG,OAAO,CAAC,GAAG;IAAE,QAAQ,CAAC,EAAE,OAAO,CAAC;IAAC,KAAK,CAAC,EAAE,MAAM,CAAA;CAAE,sBAejF,CAAC;AAEF,eAAO,MAAM,kBAAkB,iBAAkB,IAAI,CAAC,eAAe,EAAE,UAAU,CAAC,sBAajF,CAAC;AAEF,eAAO,MAAM,mBAAmB,GAAI,CAAC,SAAS,cAAc,iBAEzD;IACD,QAAQ,EAAE,CAAC,EAAE,IAAI,EAAE,EAAE;QAAE,IAAI,EAAE,CAAC,CAAA;KAAE,KAAK,SAAS,CAAC;CAChD,6BAGA,CAAC;AAEF,eAAO,MAAM,eAAe,6BAA8B,eAAe,CAAC,iBAAiB,CAAC,sBAE3F,CAAC;AAEF,eAAO,MAAM,aAAa,uCAIvB,eAAe,CAAC,iBAAiB,CAAC,cAAc,CAAC,KAAK,CAAC,CAAC,CAAC,sBAI3D,CAAC"}

package/dist/types/src/components/List/ListRoot.d.ts

@@ -1,29 +0,0 @@
-import React, { type ReactNode } from 'react';
-import { type ItemDragState, type ListItemRecord } from './ListItem';
-type ListContext<T extends ListItemRecord> = {
-    state: ItemDragState & {
-        item?: T;
-    };
-    setState: (state: ItemDragState & {
-        item?: T;
-    }) => void;
-    readonly?: boolean;
-    dragPreview?: boolean;
-    isItem?: (item: any) => boolean;
-    getId?: (item: T) => string;
-};
-export declare const ListProvider: React.FC<ListContext<any> & {
-    children: React.ReactNode;
-}>, useListContext: (consumerName: string) => ListContext<any>;
-export type ListRendererProps<T extends ListItemRecord> = {
-    state: ListContext<T>['state'];
-    items: readonly T[];
-};
-export type ListRootProps<T extends ListItemRecord> = {
-    children?: (props: ListRendererProps<T>) => ReactNode;
-    items?: readonly T[];
-    onMove?: (fromIndex: number, toIndex: number) => void;
-} & Pick<ListContext<T>, 'isItem' | 'getId' | 'readonly' | 'dragPreview'>;
-export declare const ListRoot: <T extends ListItemRecord>({ children, items, isItem, getId, onMove, ...props }: ListRootProps<T>) => React.JSX.Element;
-export {};
-//# sourceMappingURL=ListRoot.d.ts.map

package/dist/types/src/components/List/ListRoot.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"ListRoot.d.ts","sourceRoot":"","sources":["../../../../../src/components/List/ListRoot.tsx"],"names":[],"mappings":"AAQA,OAAO,KAAK,EAAE,EAAE,KAAK,SAAS,EAAoC,MAAM,OAAO,CAAC;AAEhF,OAAO,EAAE,KAAK,aAAa,EAAE,KAAK,cAAc,EAAQ,MAAM,YAAY,CAAC;AAE3E,KAAK,WAAW,CAAC,CAAC,SAAS,cAAc,IAAI;IAE3C,KAAK,EAAE,aAAa,GAAG;QAAE,IAAI,CAAC,EAAE,CAAC,CAAA;KAAE,CAAC;IACpC,QAAQ,EAAE,CAAC,KAAK,EAAE,aAAa,GAAG;QAAE,IAAI,CAAC,EAAE,CAAC,CAAA;KAAE,KAAK,IAAI,CAAC;IACxD,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,MAAM,CAAC,EAAE,CAAC,IAAI,EAAE,GAAG,KAAK,OAAO,CAAC;IAChC,KAAK,CAAC,EAAE,CAAC,IAAI,EAAE,CAAC,KAAK,MAAM,CAAC;CAC7B,CAAC;AAIF,eAAO,MAAO,YAAY;;IAAE,cAAc,4CAA8C,CAAC;AAEzF,MAAM,MAAM,iBAAiB,CAAC,CAAC,SAAS,cAAc,IAAI;IACxD,KAAK,EAAE,WAAW,CAAC,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC;IAC/B,KAAK,EAAE,SAAS,CAAC,EAAE,CAAC;CACrB,CAAC;AAIF,MAAM,MAAM,aAAa,CAAC,CAAC,SAAS,cAAc,IAAI;IACpD,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,iBAAiB,CAAC,CAAC,CAAC,KAAK,SAAS,CAAC;IACtD,KAAK,CAAC,EAAE,SAAS,CAAC,EAAE,CAAC;IACrB,MAAM,CAAC,EAAE,CAAC,SAAS,EAAE,MAAM,EAAE,OAAO,EAAE,MAAM,KAAK,IAAI,CAAC;CACvD,GAAG,IAAI,CAAC,WAAW,CAAC,CAAC,CAAC,EAAE,QAAQ,GAAG,OAAO,GAAG,UAAU,GAAG,aAAa,CAAC,CAAC;AAE1E,eAAO,MAAM,QAAQ,GAAI,CAAC,SAAS,cAAc,wDAO9C,aAAa,CAAC,CAAC,CAAC,sBA2DlB,CAAC"}

package/dist/types/src/components/List/index.d.ts

@@ -1,2 +0,0 @@
-export * from './List';
-//# sourceMappingURL=index.d.ts.map

package/dist/types/src/components/List/index.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/components/List/index.ts"],"names":[],"mappings":"AAIA,cAAc,QAAQ,CAAC"}

package/dist/types/src/components/List/testing.d.ts

@@ -1,15 +0,0 @@
-import * as Schema from 'effect/Schema';
-export declare const TestItemSchema: Schema.Struct<{
-    id: import("@dxos/keys").EntityIdClass;
-    name: typeof Schema.String;
-}>;
-export type TestItemType = Schema.Schema.Type<typeof TestItemSchema>;
-export declare const TestList: Schema.Struct<{
-    items: Schema.mutable<Schema.Array$<Schema.Struct<{
-        id: import("@dxos/keys").EntityIdClass;
-        name: typeof Schema.String;
-    }>>>;
-}>;
-export type TestList = Schema.Schema.Type<typeof TestList>;
-export declare const createList: (n?: number) => TestList;
-//# sourceMappingURL=testing.d.ts.map

package/dist/types/src/components/List/testing.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"testing.d.ts","sourceRoot":"","sources":["../../../../../src/components/List/testing.ts"],"names":[],"mappings":"AAIA,OAAO,KAAK,MAAM,MAAM,eAAe,CAAC;AAKxC,eAAO,MAAM,cAAc;;;EAGzB,CAAC;AAEH,MAAM,MAAM,YAAY,GAAG,MAAM,CAAC,MAAM,CAAC,IAAI,CAAC,OAAO,cAAc,CAAC,CAAC;AAErE,eAAO,MAAM,QAAQ;;;;;EAEnB,CAAC;AAEH,MAAM,MAAM,QAAQ,GAAG,MAAM,CAAC,MAAM,CAAC,IAAI,CAAC,OAAO,QAAQ,CAAC,CAAC;AAE3D,eAAO,MAAM,UAAU,kBAAa,QAQlC,CAAC"}

package/dist/types/src/components/RowList/RowList.d.ts

@@ -1,61 +0,0 @@
-import React, { type FocusEvent, type MouseEvent, type PropsWithChildren } from 'react';
-import { type ScrollAreaRootProps } from '@dxos/react-ui';
-declare const createRowListScope: import("@radix-ui/react-context").CreateScope;
-type RootProps = PropsWithChildren<{
-    /** Currently-selected option id (controlled). */
-    selectedId?: string;
-    /** Initial selected option for uncontrolled mode. */
-    defaultSelectedId?: string;
-    /**
-     * Called when the user picks a different option (click, arrow keys,
-     * focus). Receives the option's `id` prop.
-     */
-    onSelectChange?: (id: string) => void;
-}>;
-declare function Root({ selectedId, defaultSelectedId, onSelectChange, children }: RootProps): React.JSX.Element;
-declare namespace Root {
-    var displayName: string;
-}
-type ViewportProps = Pick<ScrollAreaRootProps, 'thin' | 'padding' | 'centered'>;
-type ContentProps = {
-    /**
-     * Accessible label for the listbox. Strongly recommended; assistive
-     * tech announces this when focus enters the list.
-     */
-    'aria-label'?: string;
-};
-type RowProps = PropsWithChildren<{
-    /** Stable identifier; matched against the parent's `selectedId`. */
-    id: string;
-    /** Disable the row — focusable but doesn't update selection, dimmed. */
-    disabled?: boolean;
-    /** Optional click handler in addition to selection. */
-    onClick?: (event: MouseEvent<HTMLLIElement>) => void;
-    /** Optional focus handler in addition to selection-follows-focus. */
-    onFocus?: (event: FocusEvent<HTMLLIElement>) => void;
-}>;
-declare const Row: React.ForwardRefExoticComponent<Omit<RowProps, "className"> & {
-    classNames?: import("@dxos/ui-types").ClassNameValue;
-} & Pick<React.HTMLAttributes<Element>, "children" | "className" | "role" | "style"> & React.RefAttributes<HTMLLIElement>>;
-/**
- * Read selection state for a single id, from inside any descendant of
- * `<RowList.Root>`. Returns `true` when the row is currently selected.
- * Lets composing components (e.g. `Listbox.OptionIndicator`) react to
- * selection without re-rendering on unrelated changes.
- */
-declare const useRowListSelection: (id: string) => boolean;
-declare const RowList: {
-    Root: {
-        ({ selectedId, defaultSelectedId, onSelectChange, children }: RootProps): React.JSX.Element;
-        displayName: string;
-    };
-    Viewport: React.ForwardRefExoticComponent<Omit<ViewportProps, "className"> & {
-        classNames?: import("@dxos/ui-types").ClassNameValue;
-    } & Pick<React.HTMLAttributes<Element>, "children" | "className" | "role" | "style"> & React.RefAttributes<HTMLDivElement>>;
-    Content: React.ForwardRefExoticComponent<Omit<ContentProps, "className"> & {
-        classNames?: import("@dxos/ui-types").ClassNameValue;
-    } & Pick<React.HTMLAttributes<Element>, "children" | "className" | "role" | "style"> & React.RefAttributes<HTMLUListElement>>;
-};
-export { RowList, Row, createRowListScope, useRowListSelection };
-export type { RootProps as RowListRootProps, ViewportProps as RowListViewportProps, ContentProps as RowListContentProps, RowProps, };
-//# sourceMappingURL=RowList.d.ts.map

package/dist/types/src/components/RowList/RowList.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"RowList.d.ts","sourceRoot":"","sources":["../../../../../src/components/RowList/RowList.tsx"],"names":[],"mappings":"AA6EA,OAAO,KAAK,EAAE,EAAE,KAAK,UAAU,EAAqB,KAAK,UAAU,EAAE,KAAK,iBAAiB,EAAe,MAAM,OAAO,CAAC;AAGxH,OAAO,EAAc,KAAK,mBAAmB,EAAE,MAAM,gBAAgB,CAAC;AAsBtE,QAAA,MAA6B,kBAAkB,+CAAyC,CAAC;AAOzF,KAAK,SAAS,GAAG,iBAAiB,CAAC;IACjC,iDAAiD;IACjD,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,qDAAqD;IACrD,iBAAiB,CAAC,EAAE,MAAM,CAAC;IAC3B;;;OAGG;IACH,cAAc,CAAC,EAAE,CAAC,EAAE,EAAE,MAAM,KAAK,IAAI,CAAC;CACvC,CAAC,CAAC;sBAEW,EAAE,UAAU,EAAE,iBAAiB,EAAE,cAAc,EAAE,QAAQ,EAAE,EAAE,SAAS;;;;AAqCpF,KAAK,aAAa,GAAG,IAAI,CAAC,mBAAmB,EAAE,MAAM,GAAG,SAAS,GAAG,UAAU,CAAC,CAAC;AAwBhF,KAAK,YAAY,GAAG;IAClB;;;OAGG;IACH,YAAY,CAAC,EAAE,MAAM,CAAC;CACvB,CAAC;AAgEF,KAAK,QAAQ,GAAG,iBAAiB,CAAC;IAChC,oEAAoE;IACpE,EAAE,EAAE,MAAM,CAAC;IACX,wEAAwE;IACxE,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,uDAAuD;IACvD,OAAO,CAAC,EAAE,CAAC,KAAK,EAAE,UAAU,CAAC,aAAa,CAAC,KAAK,IAAI,CAAC;IACrD,qEAAqE;IACrE,OAAO,CAAC,EAAE,CAAC,KAAK,EAAE,UAAU,CAAC,aAAa,CAAC,KAAK,IAAI,CAAC;CACtD,CAAC,CAAC;AAMH,QAAA,MAAM,GAAG;;0HAmDP,CAAC;AAIH;;;;;GAKG;AACH,QAAA,MAAM,mBAAmB,OAAQ,MAAM,KAAG,OAGzC,CAAC;AAMF,QAAA,MAAM,OAAO;;sEAxN8D,SAAS;;;;;;;;;CA4NnF,CAAC;AAEF,OAAO,EAAE,OAAO,EAAE,GAAG,EAAE,kBAAkB,EAAE,mBAAmB,EAAE,CAAC;AACjE,YAAY,EACV,SAAS,IAAI,gBAAgB,EAC7B,aAAa,IAAI,oBAAoB,EACrC,YAAY,IAAI,mBAAmB,EACnC,QAAQ,GACT,CAAC"}

package/dist/types/src/components/RowList/RowList.stories.d.ts

@@ -1,35 +0,0 @@
-import { type StoryObj } from '@storybook/react-vite';
-import React from 'react';
-type TestItem = {
-    id: string;
-    name: string;
-    description: string;
-};
-type StoryArgs = {
-    /** Items to render. Defaults to the full 24-item catalog. */
-    items?: TestItem[];
-    /** Forwards to `RowList.Viewport thin`. */
-    thin?: boolean;
-    /** Forwards to `RowList.Viewport padding`. */
-    padding?: boolean;
-    /** Index into `items` that should render disabled. */
-    disabledIndex?: number;
-    /** Render the description line under each row's name. */
-    showDescription?: boolean;
-};
-declare const meta: {
-    title: string;
-    render: (args: StoryArgs) => React.JSX.Element;
-    decorators: import("@storybook/react").Decorator[];
-    parameters: {
-        layout: string;
-    };
-};
-export default meta;
-type Story = StoryObj<StoryArgs>;
-export declare const Default: Story;
-export declare const Thin: Story;
-export declare const WithDisabled: Story;
-export declare const MasterDetail: Story;
-export declare const WithToolbar: Story;
-//# sourceMappingURL=RowList.stories.d.ts.map

package/dist/types/src/components/RowList/RowList.stories.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"RowList.stories.d.ts","sourceRoot":"","sources":["../../../../../src/components/RowList/RowList.stories.tsx"],"names":[],"mappings":"AAIA,OAAO,EAAa,KAAK,QAAQ,EAAE,MAAM,uBAAuB,CAAC;AACjE,OAAO,KAAmB,MAAM,OAAO,CAAC;AAUxC,KAAK,QAAQ,GAAG;IAAE,EAAE,EAAE,MAAM,CAAC;IAAC,IAAI,EAAE,MAAM,CAAC;IAAC,WAAW,EAAE,MAAM,CAAA;CAAE,CAAC;AAelE,KAAK,SAAS,GAAG;IACf,6DAA6D;IAC7D,KAAK,CAAC,EAAE,QAAQ,EAAE,CAAC;IACnB,2CAA2C;IAC3C,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,8CAA8C;IAC9C,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,sDAAsD;IACtD,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,yDAAyD;IACzD,eAAe,CAAC,EAAE,OAAO,CAAC;CAC3B,CAAC;AAwGF,QAAA,MAAM,IAAI;;;;;QAKN,MAAM;;CAEiB,CAAC;eAEb,IAAI;AAEnB,KAAK,KAAK,GAAG,QAAQ,CAAC,SAAS,CAAC,CAAC;AAEjC,eAAO,MAAM,OAAO,EAAE,KAAU,CAAC;AACjC,eAAO,MAAM,IAAI,EAAE,KAAuE,CAAC;AAC3F,eAAO,MAAM,YAAY,EAAE,KAAmE,CAAC;AAC/F,eAAO,MAAM,YAAY,EAAE,KAA+C,CAAC;AAC3E,eAAO,MAAM,WAAW,EAAE,KAA8C,CAAC"}

package/dist/types/src/components/RowList/index.d.ts

@@ -1,3 +0,0 @@
-export { RowList, Row, createRowListScope, useRowListSelection } from './RowList';
-export type { RowListRootProps, RowListViewportProps, RowListContentProps, RowProps } from './RowList';
-//# sourceMappingURL=index.d.ts.map

package/dist/types/src/components/RowList/index.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/components/RowList/index.ts"],"names":[],"mappings":"AAIA,OAAO,EAAE,OAAO,EAAE,GAAG,EAAE,kBAAkB,EAAE,mBAAmB,EAAE,MAAM,WAAW,CAAC;AAClF,YAAY,EAAE,gBAAgB,EAAE,oBAAoB,EAAE,mBAAmB,EAAE,QAAQ,EAAE,MAAM,WAAW,CAAC"}

package/src/components/List/List.stories.tsx

@@ -1,129 +0,0 @@
-//
-// Copyright 2024 DXOS.org
-//
-
-import { Atom, RegistryContext, useAtomValue } from '@effect-atom/atom-react';
-import { type Meta, type StoryObj } from '@storybook/react-vite';
-import * as Schema from 'effect/Schema';
-import React, { useContext, useMemo } from 'react';
-
-import { withLayout, withTheme } from '@dxos/react-ui/testing';
-import { withRegistry } from '@dxos/storybook-utils';
-import { mx } from '@dxos/ui-theme';
-import { arrayMove } from '@dxos/util';
-
-import { List, type ListRootProps } from './List';
-import { TestItemSchema, type TestItemType, type TestList, createList } from './testing';
-
-// TODO(burdon): var-icon-size.
-const grid = 'grid grid-cols-[32px_1fr_32px] min-h-[2rem] rounded-sm';
-
-const DefaultStory = (props: Omit<ListRootProps<TestItemType>, 'items'>) => {
-  const registry = useContext(RegistryContext);
-  const listAtom = useMemo(() => Atom.make<TestList>(createList(100)).pipe(Atom.keepAlive), []);
-  const list = useAtomValue(listAtom);
-  const items = list.items;
-
-  const handleSelect = (item: TestItemType) => {
-    console.log('select', item);
-  };
-  const handleDelete = (item: TestItemType) => {
-    const prev = registry.get(listAtom);
-    registry.set(listAtom, {
-      ...prev,
-      items: prev.items.filter((i) => i.id !== item.id),
-    });
-  };
-  const handleMove = (from: number, to: number) => {
-    const prev = registry.get(listAtom);
-    const newItems = [...prev.items];
-    arrayMove(newItems, from, to);
-    registry.set(listAtom, { ...prev, items: newItems });
-  };
-
-  return (
-    <List.Root<TestItemType> dragPreview items={items} getId={(item) => item.id} onMove={handleMove} {...props}>
-      {({ items }) => (
-        <>
-          <div className='flex flex-col w-full'>
-            <div className={grid}>
-              <div />
-              <div className='flex items-center text-sm'>Items</div>
-            </div>
-
-            <div role='list' className='h-full w-full overflow-auto'>
-              {items?.map((item) => (
-                <List.Item<TestItemType> key={item.id} item={item} classNames={mx(grid)}>
-                  <List.ItemDragHandle />
-                  <List.ItemTitle onClick={() => handleSelect(item)}>{item.name}</List.ItemTitle>
-                  <List.ItemDeleteButton onClick={() => handleDelete(item)} />
-                </List.Item>
-              ))}
-            </div>
-
-            <div className={grid}>
-              <div />
-              <div className='flex items-center text-sm'>{items?.length} Items</div>
-            </div>
-          </div>
-
-          <List.ItemDragPreview<TestItemType>>
-            {({ item }) => (
-              <List.ItemWrapper classNames={mx(grid, 'bg-modal-surface border border-separator')}>
-                <List.ItemDragHandle />
-                <div className='flex items-center'>{item.name}</div>
-              </List.ItemWrapper>
-            )}
-          </List.ItemDragPreview>
-        </>
-      )}
-    </List.Root>
-  );
-};
-
-const SimpleStory = (props: Omit<ListRootProps<TestItemType>, 'items'>) => {
-  const listAtom = useMemo(() => Atom.make<TestList>(createList(100)).pipe(Atom.keepAlive), []);
-  const list = useAtomValue(listAtom);
-  const items = list.items;
-
-  return (
-    <List.Root<TestItemType> dragPreview items={items} {...props}>
-      {({ items }) => (
-        <div role='list' className='h-full w-full overflow-auto'>
-          {items?.map((item) => (
-            <List.Item<TestItemType> key={item.id} item={item} classNames={mx(grid)}>
-              <List.ItemDragHandle />
-              <List.ItemTitle>{item.name}</List.ItemTitle>
-              <List.ItemDeleteButton />
-            </List.Item>
-          ))}
-        </div>
-      )}
-    </List.Root>
-  );
-};
-
-const meta = {
-  title: 'ui/react-ui-list/List',
-  component: List.Root,
-  decorators: [withTheme(), withLayout({ layout: 'fullscreen' }), withRegistry],
-  parameters: {
-    layout: 'fullscreen',
-  },
-} satisfies Meta<typeof List.Root>;
-
-export default meta;
-
-export const Default: StoryObj<typeof DefaultStory> = {
-  render: DefaultStory,
-  args: {
-    isItem: Schema.is(TestItemSchema),
-  },
-};
-
-export const Simple: StoryObj<typeof SimpleStory> = {
-  render: SimpleStory,
-  args: {
-    isItem: Schema.is(TestItemSchema),
-  },
-};

package/src/components/List/List.tsx

@@ -1,47 +0,0 @@
-//
-// Copyright 2024 DXOS.org
-//
-
-import {
-  ListItem,
-  ListItemIconButton,
-  ListItemDeleteButton,
-  ListItemDragHandle,
-  ListItemDragPreview,
-  type ListItemProps,
-  type ListItemRecord,
-  ListItemTitle,
-  ListItemWrapper,
-} from './ListItem';
-import { ListRoot, type ListRootProps } from './ListRoot';
-
-/**
- * Draggable list with per-row drag handles and delete buttons.
- * Ref: https://github.com/atlassian/pragmatic-drag-and-drop
- * Ref: https://github.com/alexreardon/pdnd-react-tailwind/blob/main/src/task.tsx
- *
- * @deprecated New code should use one of:
- *
- *   - `RowList` / `CardList` from this same package — for selectable
- *     pickers (master/detail). Correct ARIA + dx-* by construction.
- *   - `Mosaic.Stack` / `Mosaic.VirtualStack` from `@dxos/react-ui-mosaic`
- *     — for virtualized or drag-reorderable card stacks.
- *
- * This component is retained for the existing reorder-with-delete-button
- * use cases (plugin-meeting, plugin-automation, plugin-zen, etc.) until
- * each is migrated; see `AUDIT.md` Phase 6 for the migration plan.
- */
-export const List = {
-  Root: ListRoot,
-  Item: ListItem,
-  ItemDragPreview: ListItemDragPreview,
-  ItemWrapper: ListItemWrapper,
-  ItemDragHandle: ListItemDragHandle,
-  ItemIconButton: ListItemIconButton,
-  ItemDeleteButton: ListItemDeleteButton,
-  ItemTitle: ListItemTitle,
-};
-
-type ListItem = ListItemRecord;
-
-export type { ListRootProps, ListItemProps, ListItem, ListItemRecord };