@dxos/react-ui-list 0.7.2-main.f1adc9f → 0.7.2
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/lib/browser/index.mjs +6 -13
- package/dist/lib/browser/index.mjs.map +3 -3
- package/dist/lib/browser/meta.json +1 -1
- package/dist/lib/node/index.cjs +6 -13
- package/dist/lib/node/index.cjs.map +3 -3
- package/dist/lib/node/meta.json +1 -1
- package/dist/lib/node-esm/index.mjs +6 -13
- package/dist/lib/node-esm/index.mjs.map +3 -3
- package/dist/lib/node-esm/meta.json +1 -1
- package/dist/types/src/components/Tree/TreeItem.d.ts +0 -1
- package/dist/types/src/components/Tree/TreeItem.d.ts.map +1 -1
- package/dist/types/src/components/Tree/TreeItemHeading.d.ts +1 -1
- package/dist/types/src/components/Tree/TreeItemHeading.d.ts.map +1 -1
- package/package.json +16 -16
- package/src/components/Tree/TreeItem.tsx +6 -9
- package/src/components/Tree/TreeItemHeading.tsx +5 -14
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../src/components/List/ListItem.tsx", "../../../src/components/List/DropIndicator.tsx", "../../../src/components/List/ListRoot.tsx", "../../../src/components/List/List.tsx", "../../../src/components/Tree/Tree.tsx", "../../../src/components/Tree/TreeContext.tsx", "../../../src/components/Tree/TreeItem.tsx", "../../../src/components/Tree/DropIndicator.tsx", "../../../src/components/Tree/TreeItemHeading.tsx", "../../../src/components/Tree/TreeItemToggle.tsx", "../../../src/components/Tree/helpers.ts"],
|
|
4
|
-
"sourcesContent": ["//\n// Copyright 2024 DXOS.org\n//\n\nimport { combine } from '@atlaskit/pragmatic-drag-and-drop/combine';\nimport { draggable, dropTargetForElements } from '@atlaskit/pragmatic-drag-and-drop/element/adapter';\nimport { setCustomNativeDragPreview } from '@atlaskit/pragmatic-drag-and-drop/element/set-custom-native-drag-preview';\nimport {\n type Edge,\n attachClosestEdge,\n extractClosestEdge,\n} from '@atlaskit/pragmatic-drag-and-drop-hitbox/closest-edge';\nimport { createContext } from '@radix-ui/react-context';\nimport React, {\n type ComponentProps,\n type HTMLAttributes,\n type MutableRefObject,\n type PropsWithChildren,\n type ReactNode,\n forwardRef,\n useEffect,\n useRef,\n useState,\n} from 'react';\nimport { createPortal } from 'react-dom';\n\nimport { invariant } from '@dxos/invariant';\nimport { Icon, type ThemedClassName } from '@dxos/react-ui';\nimport { mx } from '@dxos/react-ui-theme';\n\nimport { DropIndicator } from './DropIndicator';\nimport { useListContext } from './ListRoot';\n\nexport type ListItemRecord = {};\n\nexport type ItemState =\n | {\n type: 'idle';\n }\n | {\n type: 'preview';\n container: HTMLElement;\n }\n | {\n type: 'is-dragging';\n }\n | {\n type: 'is-dragging-over';\n closestEdge: Edge | null;\n };\n\nexport const idle: ItemState = { type: 'idle' };\n\nconst stateStyles: { [Key in ItemState['type']]?: HTMLAttributes<HTMLDivElement>['className'] } = {\n 'is-dragging': 'opacity-50',\n};\n\ntype ListItemContext<T extends ListItemRecord> = {\n item: T;\n dragHandleRef: MutableRefObject<HTMLElement | null>;\n};\n\n/**\n * Default context defined for ListItemDragPreview, which is defined outside of ListItem.\n */\nconst defaultContext: ListItemContext<any> = {} as any;\n\nconst LIST_ITEM_NAME = 'ListItem';\n\nexport const [ListItemProvider, useListItemContext] = createContext<ListItemContext<any>>(\n LIST_ITEM_NAME,\n defaultContext,\n);\n\nexport type ListItemProps<T extends ListItemRecord> = ThemedClassName<\n PropsWithChildren<{\n item: T;\n }>\n>;\n\n/**\n * Draggable list item.\n */\nexport const ListItem = <T extends ListItemRecord>({ children, classNames, item }: ListItemProps<T>) => {\n const { isItem, dragPreview, setState: setRootState } = useListContext(LIST_ITEM_NAME);\n const ref = useRef<HTMLDivElement | null>(null);\n const dragHandleRef = useRef<HTMLElement | null>(null);\n const [state, setState] = useState<ItemState>(idle);\n useEffect(() => {\n const element = ref.current;\n invariant(element);\n return combine(\n //\n // https://atlassian.design/components/pragmatic-drag-and-drop/core-package/adapters/element/about#draggable\n //\n draggable({\n element,\n dragHandle: dragHandleRef.current!,\n getInitialData: () => item,\n onGenerateDragPreview: dragPreview\n ? ({ nativeSetDragImage, source }) => {\n const rect = source.element.getBoundingClientRect();\n setCustomNativeDragPreview({\n nativeSetDragImage,\n getOffset: ({ container }) => {\n const { height } = container.getBoundingClientRect();\n return {\n x: 20,\n y: height / 2,\n };\n },\n render: ({ container }) => {\n container.style.width = rect.width + 'px';\n setState({ type: 'preview', container });\n setRootState({ type: 'preview', container, item });\n },\n });\n }\n : undefined,\n onDragStart: () => {\n setState({ type: 'is-dragging' });\n setRootState({ type: 'is-dragging', item });\n },\n onDrop: () => {\n setState(idle);\n setRootState(idle);\n },\n }),\n\n //\n // https://atlassian.design/components/pragmatic-drag-and-drop/core-package/adapters/element/about#drop-target-for-elements\n //\n dropTargetForElements({\n element,\n canDrop: ({ source }) => {\n return source.element !== element && isItem(source.data);\n },\n getData: ({ input }) => {\n return attachClosestEdge(item, { element, input, allowedEdges: ['top', 'bottom'] });\n },\n getIsSticky: () => true,\n onDragEnter: ({ self }) => {\n const closestEdge = extractClosestEdge(self.data);\n setState({ type: 'is-dragging-over', closestEdge });\n },\n onDrag: ({ self }) => {\n const closestEdge = extractClosestEdge(self.data);\n setState((current) => {\n if (current.type === 'is-dragging-over' && current.closestEdge === closestEdge) {\n return current;\n }\n return { type: 'is-dragging-over', closestEdge };\n });\n },\n onDragLeave: () => {\n setState(idle);\n },\n onDrop: () => {\n setState(idle);\n },\n }),\n );\n }, [item]);\n\n return (\n <ListItemProvider item={item} dragHandleRef={dragHandleRef}>\n <div className='relative'>\n <div ref={ref} role='listitem' className={mx('flex overflow-hidden', classNames, stateStyles[state.type])}>\n {children}\n </div>\n {state.type === 'is-dragging-over' && state.closestEdge && <DropIndicator edge={state.closestEdge} />}\n </div>\n </ListItemProvider>\n );\n};\n\n//\n// List item components\n//\n\nexport type IconButtonProps = ThemedClassName<ComponentProps<'button'>> & { icon: string };\n\nexport const IconButton = forwardRef<HTMLButtonElement, IconButtonProps>(\n ({ classNames, icon, ...props }, forwardedRef) => {\n return (\n <button ref={forwardedRef} className={mx('flex items-center justify-center', classNames)} {...props}>\n <Icon icon={icon} classNames='cursor-pointer' size={4} />\n </button>\n );\n },\n);\n\nexport const ListItemDeleteButton = ({\n autoHide = true,\n classNames,\n disabled,\n ...props\n}: Omit<IconButtonProps, 'icon'> & { autoHide?: boolean }) => {\n const { state } = useListContext('DELETE_BUTTON');\n const isDisabled = state.type !== 'idle' || disabled;\n return (\n <IconButton\n icon='ph--x--regular'\n disabled={isDisabled}\n classNames={[classNames, autoHide && disabled && 'hidden']}\n {...props}\n />\n );\n};\n\nexport const ListItemDragHandle = () => {\n const { dragHandleRef } = useListItemContext('DRAG_HANDLE');\n return <IconButton ref={dragHandleRef as any} icon='ph--dots-six-vertical--regular' />;\n};\n\nexport const ListItemDragPreview = <T extends ListItemRecord>({\n children,\n}: {\n children: ({ item }: { item: T }) => ReactNode;\n}) => {\n const { state } = useListContext('DRAG_PREVIEW');\n return state?.type === 'preview' ? createPortal(children({ item: state.item }), state.container) : null;\n};\n\nexport const ListItemWrapper = ({ classNames, children }: ThemedClassName<PropsWithChildren>) => (\n <div className={mx('flex is-full gap-2', classNames)}>{children}</div>\n);\n\nexport const ListItemTitle = ({\n classNames,\n children,\n ...props\n}: ThemedClassName<PropsWithChildren<ComponentProps<'div'>>>) => (\n <div className={mx('flex grow items-center truncate', classNames)} {...props}>\n {children}\n </div>\n);\n", "//\n// Copyright 2024 DXOS.org\n//\n\nimport { type Edge } from '@atlaskit/pragmatic-drag-and-drop-hitbox/types';\nimport React, { type CSSProperties, type HTMLAttributes } from 'react';\n\nimport { mx } from '@dxos/react-ui-theme';\n\ntype Orientation = 'horizontal' | 'vertical';\n\nconst edgeToOrientationMap: Record<Edge, Orientation> = {\n top: 'horizontal',\n bottom: 'horizontal',\n left: 'vertical',\n right: 'vertical',\n};\n\nconst orientationStyles: Record<Orientation, HTMLAttributes<HTMLElement>['className']> = {\n horizontal: 'h-[--line-thickness] left-[--terminal-radius] right-0 before:left-[--negative-terminal-size]',\n vertical: 'w-[--line-thickness] top-[--terminal-radius] bottom-0 before:top-[--negative-terminal-size]',\n};\n\nconst edgeStyles: Record<Edge, HTMLAttributes<HTMLElement>['className']> = {\n top: 'top-[--line-offset] before:top-[--offset-terminal]',\n right: 'right-[--line-offset] before:right-[--offset-terminal]',\n bottom: 'bottom-[--line-offset] before:bottom-[--offset-terminal]',\n left: 'left-[--line-offset] before:left-[--offset-terminal]',\n};\n\nconst strokeSize = 2;\nconst terminalSize = 8;\nconst offsetToAlignTerminalWithLine = (strokeSize - terminalSize) / 2;\n\nexport type DropIndicatorProps = {\n edge: Edge;\n gap?: number;\n};\n\n/**\n * This is a tailwind port of `@atlaskit/pragmatic-drag-and-drop-react-drop-indicator/box`\n */\nexport const DropIndicator = ({ edge, gap = 0 }: DropIndicatorProps) => {\n const lineOffset = `calc(-0.5 * (${gap}px + ${strokeSize}px))`;\n\n const orientation = edgeToOrientationMap[edge];\n\n return (\n <div\n style={\n {\n '--line-thickness': `${strokeSize}px`,\n '--line-offset': `${lineOffset}`,\n '--terminal-size': `${terminalSize}px`,\n '--terminal-radius': `${terminalSize / 2}px`,\n '--negative-terminal-size': `-${terminalSize}px`,\n '--offset-terminal': `${offsetToAlignTerminalWithLine}px`,\n } as CSSProperties\n }\n className={mx(\n 'absolute z-10 pointer-events-none bg-blue-700',\n \"before:content-[''] before:w-[--terminal-size] before:h-[--terminal-size] box-border before:absolute\",\n 'before:border-[length:--line-thickness] before:border-solid before:border-blue-700 before:rounded-full',\n orientationStyles[orientation],\n edgeStyles[edge],\n )}\n ></div>\n );\n};\n", "//\n// Copyright 2024 DXOS.org\n//\n\nimport { monitorForElements } from '@atlaskit/pragmatic-drag-and-drop/element/adapter';\nimport { extractClosestEdge } from '@atlaskit/pragmatic-drag-and-drop-hitbox/closest-edge';\nimport { getReorderDestinationIndex } from '@atlaskit/pragmatic-drag-and-drop-hitbox/util/get-reorder-destination-index';\nimport { createContext } from '@radix-ui/react-context';\nimport React, { type ReactNode, useCallback, useEffect, useState } from 'react';\n\nimport { type ThemedClassName } from '@dxos/react-ui';\n\nimport { idle, type ItemState, type ListItemRecord } from './ListItem';\n\ntype ListContext<T extends ListItemRecord> = {\n isItem: (item: any) => boolean;\n getId?: (item: T) => string; // TODO(burdon): Require if T doesn't conform to type.\n dragPreview?: boolean;\n state: ItemState & { item?: T };\n setState: (state: ItemState & { item?: T }) => void;\n};\n\nconst LIST_NAME = 'List';\n\nexport const [ListProvider, useListContext] = createContext<ListContext<any>>(LIST_NAME);\n\nexport type ListRendererProps<T extends ListItemRecord> = {\n state: ListContext<T>['state'];\n items: T[];\n};\n\nexport type ListRootProps<T extends ListItemRecord> = ThemedClassName<{\n children?: (props: ListRendererProps<T>) => ReactNode;\n items?: T[];\n onMove?: (fromIndex: number, toIndex: number) => void;\n}> &\n Pick<ListContext<T>, 'isItem' | 'getId' | 'dragPreview'>;\n\nconst defaultGetId = <T extends ListItemRecord>(item: T) => (item as any)?.id;\n\nexport const ListRoot = <T extends ListItemRecord>({\n classNames,\n children,\n items,\n isItem,\n getId = defaultGetId,\n onMove,\n ...props\n}: ListRootProps<T>) => {\n const isEqual = useCallback(\n (a: T, b: T) => {\n const idA = getId?.(a);\n const idB = getId?.(b);\n\n if (idA !== undefined && idB !== undefined) {\n return idA === idB;\n } else {\n // Fallback for primitive values or when getId fails.\n // NOTE(ZaymonFC): After drag and drop, pragmatic internally serializes drop targets which breaks reference equality.\n // You must provide an `getId` function that returns a stable identifier for your items.\n return a === b;\n }\n },\n [getId],\n );\n\n const [state, setState] = useState<ListContext<T>['state']>(idle);\n useEffect(() => {\n if (!items) {\n return;\n }\n\n return monitorForElements({\n canMonitor: ({ source }) => isItem(source.data),\n onDrop: ({ location, source }) => {\n const target = location.current.dropTargets[0];\n if (!target) {\n return;\n }\n\n const sourceData = source.data;\n const targetData = target.data;\n\n if (!isItem(sourceData) || !isItem(targetData)) {\n return;\n }\n\n const sourceIdx = items.findIndex((item) => isEqual(item, sourceData as T));\n const targetIdx = items.findIndex((item) => isEqual(item, targetData as T));\n if (targetIdx < 0 || sourceIdx < 0) {\n return;\n }\n const closestEdgeOfTarget = extractClosestEdge(targetData);\n const destinationIndex = getReorderDestinationIndex({\n closestEdgeOfTarget,\n startIndex: sourceIdx,\n indexOfTarget: targetIdx,\n axis: 'vertical',\n });\n\n onMove?.(sourceIdx, destinationIndex);\n },\n });\n }, [items, isEqual, onMove]);\n\n return (\n <ListProvider {...{ isItem, state, setState, ...props }}>{children?.({ state, items: items ?? [] })}</ListProvider>\n );\n};\n", "//\n// Copyright 2024 DXOS.org\n//\n\nimport {\n IconButton,\n type IconButtonProps,\n ListItem,\n ListItemDeleteButton,\n ListItemDragHandle,\n ListItemDragPreview,\n type ListItemProps,\n type ListItemRecord,\n ListItemTitle,\n ListItemWrapper,\n} from './ListItem';\nimport { ListRoot, type ListRootProps } from './ListRoot';\n\n// TODO(burdon): Multi-select model.\n// TODO(burdon): Key nav.\n// TODO(burdon): Animation.\n// TODO(burdon): Constrain axis.\n// TODO(burdon): Tree view.\n// TODO(burdon): Fix autoscroll while dragging.\n\n/**\n * Draggable list.\n * Ref: https://github.com/atlassian/pragmatic-drag-and-drop\n * Ref: https://github.com/alexreardon/pdnd-react-tailwind/blob/main/src/task.tsx\n */\nexport const List = {\n Root: ListRoot,\n Item: ListItem,\n ItemDragPreview: ListItemDragPreview,\n ItemWrapper: ListItemWrapper,\n ItemDragHandle: ListItemDragHandle,\n ItemDeleteButton: ListItemDeleteButton,\n ItemTitle: ListItemTitle,\n IconButton,\n};\n\ntype ListItem = ListItemRecord;\n\nexport type { ListRootProps, ListItemProps, IconButtonProps, ListItem };\n", "//\n// Copyright 2024 DXOS.org\n//\n\nimport React, { useMemo } from 'react';\n\nimport { Treegrid, type TreegridRootProps } from '@dxos/react-ui';\n\nimport { type TreeContextType, TreeProvider } from './TreeContext';\nimport { TreeItem, type TreeItemProps } from './TreeItem';\n\nexport type TreeProps<T = any> = { id: string } & TreeContextType &\n Partial<Pick<TreegridRootProps, 'gridTemplateColumns' | 'classNames'>> &\n Pick<TreeItemProps<T>, 'draggable' | 'renderColumns' | 'canDrop' | 'onOpenChange' | 'onSelect'>;\n\nexport const Tree = <T = any,>({\n id,\n getItems,\n getProps,\n isOpen,\n isCurrent,\n draggable = false,\n gridTemplateColumns = '[tree-row-start] 1fr min-content [tree-row-end]',\n classNames,\n renderColumns,\n canDrop,\n onOpenChange,\n onSelect,\n}: TreeProps<T>) => {\n const context = useMemo(\n () => ({\n getItems,\n getProps,\n isOpen,\n isCurrent,\n }),\n [getItems, getProps, isOpen, isCurrent],\n );\n const items = getItems();\n const path = useMemo(() => [id], [id]);\n\n return (\n <Treegrid.Root gridTemplateColumns={gridTemplateColumns} classNames={classNames}>\n <TreeProvider value={context}>\n {items.map((item, index) => (\n <TreeItem\n key={item.id}\n item={item}\n last={index === items.length - 1}\n path={path}\n draggable={draggable}\n renderColumns={renderColumns}\n canDrop={canDrop}\n onOpenChange={onOpenChange}\n onSelect={onSelect}\n />\n ))}\n </TreeProvider>\n </Treegrid.Root>\n );\n};\n", "//\n// Copyright 2024 DXOS.org\n//\n\nimport { createContext, useContext } from 'react';\n\nimport { raise } from '@dxos/debug';\nimport { type Label } from '@dxos/react-ui';\n\nexport type PropsFromTreeItem = {\n id: string;\n label: Label;\n parentOf?: string[];\n icon?: string;\n disabled?: boolean;\n className?: string;\n headingClassName?: string;\n testId?: string;\n};\n\nexport type TreeContextType<T = any> = {\n getItems: (parent?: T) => T[];\n getProps: (item: T, parent: string[]) => PropsFromTreeItem;\n isOpen: (path: string[], item: T) => boolean;\n isCurrent: (path: string[], item: T) => boolean;\n};\n\nconst TreeContext = createContext<null | TreeContextType>(null);\n\nexport const useTree = () => useContext(TreeContext) ?? raise(new Error('TreeContext not found'));\n\nexport const TreeProvider = TreeContext.Provider;\n", "//\n// Copyright 2024 DXOS.org\n//\n\nimport { combine } from '@atlaskit/pragmatic-drag-and-drop/combine';\nimport {\n draggable as pragmaticDraggable,\n dropTargetForElements,\n} from '@atlaskit/pragmatic-drag-and-drop/element/adapter';\n// https://github.com/atlassian/pragmatic-drag-and-drop/blob/main/packages/hitbox/constellation/index/about.mdx\nimport {\n attachInstruction,\n extractInstruction,\n type Instruction,\n type ItemMode,\n} from '@atlaskit/pragmatic-drag-and-drop-hitbox/tree-item';\nimport React, { memo, useCallback, useEffect, useMemo, useRef, useState, type FC, type KeyboardEvent } from 'react';\n\nimport { S } from '@dxos/echo-schema';\nimport { invariant } from '@dxos/invariant';\nimport { Treegrid } from '@dxos/react-ui';\nimport {\n focusRing,\n ghostHover,\n hoverableControls,\n hoverableFocusedKeyboardControls,\n hoverableFocusedWithinControls,\n mx,\n} from '@dxos/react-ui-theme';\n\nimport { DropIndicator } from './DropIndicator';\nimport { useTree } from './TreeContext';\nimport { TreeItemHeading } from './TreeItemHeading';\nimport { TreeItemToggle } from './TreeItemToggle';\nimport { DEFAULT_INDENTATION, paddingIndendation } from './helpers';\n\ntype TreeItemState = 'idle' | 'dragging' | 'preview' | 'parent-of-instruction';\n\nconst hoverableDescriptionIcons =\n '[--icons-color:inherit] hover-hover:[--icons-color:var(--description-text)] hover-hover:hover:[--icons-color:inherit] focus-within:[--icons-color:inherit]';\n\nexport const TreeDataSchema = S.Struct({\n id: S.String,\n path: S.Array(S.String),\n item: S.Any,\n});\n\nexport type TreeData = S.Schema.Type<typeof TreeDataSchema>;\n\nexport const isTreeData = (data: unknown): data is TreeData => S.is(TreeDataSchema)(data);\n\nexport type TreeItemProps<T = any> = {\n item: T;\n path: string[];\n last: boolean;\n draggable?: boolean;\n renderColumns?: FC<{ item: T; path: string[]; menuOpen: boolean; setMenuOpen: (open: boolean) => void }>;\n canDrop?: (source: TreeData, target: TreeData) => boolean;\n onOpenChange?: (params: { item: T; path: string[]; open: boolean }) => void;\n onSelect?: (params: { item: T; path: string[]; current: boolean; option: boolean }) => void;\n};\n\nexport const RawTreeItem = <T = any,>({\n item,\n path: _path,\n last,\n draggable,\n renderColumns: Columns,\n canDrop,\n onOpenChange,\n onSelect,\n}: TreeItemProps<T>) => {\n const { getItems, getProps, isOpen, isCurrent } = useTree();\n const items = getItems(item);\n const { id, label, parentOf, icon, disabled, className, headingClassName, testId } = getProps(item, _path);\n const path = useMemo(() => [..._path, id], [_path, id]);\n const open = isOpen(path, item);\n const current = isCurrent(path, item);\n const level = path.length - 2;\n const isBranch = !!parentOf;\n const mode: ItemMode = last ? 'last-in-group' : open ? 'expanded' : 'standard';\n const data = useMemo(() => ({ id, path, item }) satisfies TreeData, [id, path, item]);\n\n const rowRef = useRef<HTMLDivElement | null>(null);\n const buttonRef = useRef<HTMLButtonElement | null>(null);\n const openRef = useRef(false);\n const cancelExpandRef = useRef<NodeJS.Timeout | null>(null);\n const [_state, setState] = useState<TreeItemState>('idle');\n const [instruction, setInstruction] = useState<Instruction | null>(null);\n const [menuOpen, setMenuOpen] = useState(false);\n\n const cancelExpand = useCallback(() => {\n if (cancelExpandRef.current) {\n clearTimeout(cancelExpandRef.current);\n cancelExpandRef.current = null;\n }\n }, []);\n\n useEffect(() => {\n if (!draggable) {\n return;\n }\n\n invariant(buttonRef.current);\n\n // https://atlassian.design/components/pragmatic-drag-and-drop/core-package/adapters/element/about\n return combine(\n pragmaticDraggable({\n element: buttonRef.current,\n getInitialData: () => data,\n onDragStart: () => {\n setState('dragging');\n if (open) {\n openRef.current = true;\n onOpenChange?.({ item, path, open: false });\n }\n },\n onDrop: () => {\n setState('idle');\n if (openRef.current) {\n onOpenChange?.({ item, path, open: true });\n }\n },\n }),\n dropTargetForElements({\n element: buttonRef.current,\n getData: ({ input, element }) => {\n return attachInstruction(data, {\n input,\n element,\n indentPerLevel: DEFAULT_INDENTATION,\n currentLevel: level,\n mode,\n block: isBranch ? [] : ['make-child'],\n });\n },\n canDrop: ({ source }) => {\n const _canDrop = canDrop ?? (() => true);\n return source.element !== buttonRef.current && _canDrop(source.data as TreeData, data);\n },\n getIsSticky: () => true,\n onDrag: ({ self, source }) => {\n const instruction = extractInstruction(self.data);\n\n if (source.data.id !== id) {\n if (instruction?.type === 'make-child' && isBranch && !open && !cancelExpandRef.current) {\n cancelExpandRef.current = setTimeout(() => {\n onOpenChange?.({ item, path, open: true });\n }, 500);\n }\n\n if (instruction?.type !== 'make-child') {\n cancelExpand();\n }\n\n setInstruction(instruction);\n } else if (instruction?.type === 'reparent') {\n // TODO(wittjosiah): This is not occurring in the current implementation.\n setInstruction(instruction);\n } else {\n setInstruction(null);\n }\n },\n onDragLeave: () => {\n cancelExpand();\n setInstruction(null);\n },\n onDrop: () => {\n cancelExpand();\n setInstruction(null);\n },\n }),\n );\n }, [draggable, item, id, mode, path, open, canDrop]);\n\n // Cancel expand on unmount.\n useEffect(() => () => cancelExpand(), [cancelExpand]);\n\n const handleOpenChange = useCallback(\n () => onOpenChange?.({ item, path, open: !open }),\n [onOpenChange, item, path, open],\n );\n\n const handleSelect = useCallback(\n (option = false) => {\n rowRef.current?.focus();\n onSelect?.({ item, path, current: !current, option });\n },\n [onSelect, item, path, current],\n );\n\n const handleKeyDown = useCallback(\n (event: KeyboardEvent) => {\n switch (event.key) {\n case 'ArrowRight':\n isBranch && !open && handleOpenChange();\n break;\n case 'ArrowLeft':\n isBranch && open && handleOpenChange();\n break;\n case ' ':\n handleSelect(event.altKey);\n break;\n }\n },\n [isBranch, open, handleOpenChange, handleSelect],\n );\n\n return (\n <>\n <Treegrid.Row\n ref={rowRef}\n key={id}\n id={id}\n aria-labelledby={`${id}__label`}\n parentOf={parentOf?.join(Treegrid.PARENT_OF_SEPARATOR)}\n classNames={mx(\n 'grid grid-cols-subgrid col-[tree-row] mt-[2px] aria-[current]:bg-input',\n hoverableControls,\n hoverableFocusedKeyboardControls,\n hoverableFocusedWithinControls,\n hoverableDescriptionIcons,\n ghostHover,\n focusRing,\n className,\n )}\n data-itemid={id}\n data-testid={testId}\n // NOTE(thure): This is intentionally an empty string to for descendents to select by in the CSS\n // without alerting the user (except for in the correct link element). See also:\n // https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Attributes/aria-current#description\n aria-current={current ? ('' as 'page') : undefined}\n onKeyDown={handleKeyDown}\n onContextMenu={(event) => {\n event.preventDefault();\n setMenuOpen(true);\n }}\n >\n <Treegrid.Cell\n indent\n classNames='relative grid grid-cols-subgrid col-[tree-row]'\n style={paddingIndendation(level)}\n >\n <div role='none' className='flex items-center'>\n <TreeItemToggle open={open} isBranch={isBranch} onToggle={handleOpenChange} />\n <TreeItemHeading\n ref={buttonRef}\n label={label}\n icon={icon}\n className={headingClassName}\n disabled={disabled}\n current={current}\n onSelect={handleSelect}\n />\n </div>\n {Columns && <Columns item={item} path={path} menuOpen={menuOpen} setMenuOpen={setMenuOpen} />}\n {instruction && <DropIndicator instruction={instruction} gap={2} />}\n </Treegrid.Cell>\n </Treegrid.Row>\n {open &&\n items.map((item, index) => (\n <TreeItem\n key={item.id}\n item={item}\n path={path}\n last={index === items.length - 1}\n draggable={draggable}\n renderColumns={Columns}\n canDrop={canDrop}\n onOpenChange={onOpenChange}\n onSelect={onSelect}\n />\n ))}\n </>\n );\n};\n\nexport const TreeItem = memo(RawTreeItem) as FC<TreeItemProps>;\n", "//\n// Copyright 2024 DXOS.org\n//\n\nimport { type Instruction } from '@atlaskit/pragmatic-drag-and-drop-hitbox/tree-item';\nimport React, { type HTMLAttributes, type CSSProperties } from 'react';\n\nimport { mx } from '@dxos/react-ui-theme';\n\n// Tree item hitbox\n// https://github.com/atlassian/pragmatic-drag-and-drop/blob/main/packages/hitbox/constellation/index/about.mdx#tree-item\n\ntype InstructionType = Exclude<Instruction, { type: 'instruction-blocked' }>['type'];\ntype Orientation = 'sibling' | 'child';\n\nconst edgeToOrientationMap: Record<InstructionType, Orientation> = {\n 'reorder-above': 'sibling',\n 'reorder-below': 'sibling',\n 'make-child': 'child',\n reparent: 'child',\n};\n\nconst orientationStyles: Record<Orientation, HTMLAttributes<HTMLElement>['className']> = {\n // TODO(wittjosiah): Stop using left/right here.\n sibling:\n 'bs-[--line-thickness] left-[--horizontal-indent] right-0 bg-accentSurface before:left-[--negative-terminal-size]',\n child: 'is-full block-start-0 block-end-0 border-[length:--line-thickness] before:invisible',\n};\n\nconst instructionStyles: Record<InstructionType, HTMLAttributes<HTMLElement>['className']> = {\n 'reorder-above': 'block-start-[--line-offset] before:block-start-[--offset-terminal]',\n 'reorder-below': 'block-end-[--line-offset] before:block-end-[--offset-terminal]',\n 'make-child': 'border-accentSurface',\n // TODO(wittjosiah): This is not occurring in the current implementation.\n reparent: '',\n};\n\nconst strokeSize = 2;\nconst terminalSize = 8;\nconst offsetToAlignTerminalWithLine = (strokeSize - terminalSize) / 2;\n\nexport type DropIndicatorProps = {\n instruction: Instruction;\n gap?: number;\n};\n\nexport const DropIndicator = ({ instruction, gap = 0 }: DropIndicatorProps) => {\n const lineOffset = `calc(-0.5 * (${gap}px + ${strokeSize}px))`;\n const isBlocked = instruction.type === 'instruction-blocked';\n const desiredInstruction = isBlocked ? instruction.desired : instruction;\n const orientation = edgeToOrientationMap[desiredInstruction.type];\n if (isBlocked) {\n return null;\n }\n\n return (\n <div\n style={\n {\n '--line-thickness': `${strokeSize}px`,\n '--line-offset': `${lineOffset}`,\n '--terminal-size': `${terminalSize}px`,\n '--terminal-radius': `${terminalSize / 2}px`,\n '--negative-terminal-size': `-${terminalSize}px`,\n '--offset-terminal': `${offsetToAlignTerminalWithLine}px`,\n '--horizontal-indent': `${desiredInstruction.currentLevel * desiredInstruction.indentPerLevel + 4}px`,\n } as CSSProperties\n }\n className={mx(\n 'absolute z-10 pointer-events-none',\n 'before:is-[--terminal-size] before:bs-[--terminal-size] box-border before:absolute',\n 'before:border-[length:--line-thickness] before:border-solid before:border-accentSurface before:rounded-full',\n orientationStyles[orientation],\n instructionStyles[desiredInstruction.type],\n )}\n ></div>\n );\n};\n", "//\n// Copyright 2024 DXOS.org\n//\n\nimport React, { type KeyboardEvent, type MouseEvent, forwardRef, memo, useCallback } from 'react';\n\nimport { Button, Icon, toLocalizedString, useTranslation, type Label } from '@dxos/react-ui';\nimport { TextTooltip } from '@dxos/react-ui-text-tooltip';\nimport { mx } from '@dxos/react-ui-theme';\n\n// TODO(wittjosiah): Consider whether there should be a separate disabled prop which was visually distinct\n// rather than just making the item unselectable.\nexport type NavTreeItemHeadingProps = {\n label: Label;\n icon?: string;\n className?: string;\n disabled?: boolean;\n current?: boolean;\n onSelect?: (option: boolean) => void;\n};\n\nexport const TreeItemHeading = memo(\n forwardRef<HTMLButtonElement, NavTreeItemHeadingProps>(\n ({ label, icon, className, disabled, current, onSelect }, forwardedRef) => {\n const { t } = useTranslation();\n\n const handleSelect = useCallback(\n (event: MouseEvent) => {\n onSelect?.(event.altKey);\n },\n [onSelect],\n );\n\n const handleButtonKeydown = useCallback(\n (event: KeyboardEvent) => {\n if (event.key === ' ' || event.key === 'Enter') {\n event.preventDefault();\n event.stopPropagation();\n onSelect?.(event.altKey);\n }\n },\n [onSelect],\n );\n\n return (\n <TextTooltip\n text={toLocalizedString(label, t)}\n side='bottom'\n truncateQuery='span[data-tooltip]'\n onlyWhenTruncating\n asChild\n ref={forwardedRef}\n >\n {/* TODO(wittjosiah): Class precedence. See #8149. */}\n <Button\n data-testid='treeItem.heading'\n variant='ghost'\n density='fine'\n classNames={mx(\n 'grow gap-2 !pis-0.5 hover:!bg-transparent dark:hover:!bg-transparent',\n 'disabled:!cursor-default disabled:!opacity-100',\n className,\n )}\n disabled={disabled}\n onClick={handleSelect}\n onKeyDown={handleButtonKeydown}\n {...(current && { 'aria-current': 'location' })}\n >\n {icon && <Icon icon={icon ?? 'ph--placeholder--regular'} size={4} classNames='is-[1em] bs-[1em] mlb-1' />}\n <span className='flex-1 is-0 truncate text-start text-sm font-normal' data-tooltip>\n {toLocalizedString(label, t)}\n </span>\n </Button>\n </TextTooltip>\n );\n },\n ),\n);\n", "//\n// Copyright 2024 DXOS.org\n//\n\nimport React, { forwardRef, memo } from 'react';\n\nimport { Button, Icon } from '@dxos/react-ui';\nimport { mx } from '@dxos/react-ui-theme';\n\nexport type TreeItemToggleProps = {\n open?: boolean;\n isBranch?: boolean;\n onToggle?: () => void;\n};\n\nexport const TreeItemToggle = memo(\n forwardRef<HTMLButtonElement, TreeItemToggleProps>(({ open, isBranch, onToggle }, forwardedRef) => {\n return (\n <Button\n ref={forwardedRef}\n data-testid='treeItem.toggle'\n aria-expanded={open}\n variant='ghost'\n density='fine'\n classNames={mx('is-6 !pli-1', !isBranch && 'invisible')}\n onClick={onToggle}\n >\n <Icon\n icon='ph--caret-right--regular'\n size={3}\n classNames={mx('transition duration-200', open && 'rotate-90')}\n />\n </Button>\n );\n }),\n);\n", "//\n// Copyright 2024 DXOS.org\n//\n\nexport const DEFAULT_INDENTATION = 8;\n\nexport const paddingIndendation = (level: number, indentation = DEFAULT_INDENTATION) => ({\n paddingInlineStart: `${(level - 1) * indentation}px`,\n});\n"],
|
|
5
|
-
"mappings": "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",
|
|
6
|
-
"names": ["import_react", "import_react_ui_theme", "import_adapter", "import_closest_edge", "import_react_context", "import_react_ui", "import_combine", "import_invariant", "edgeToOrientationMap", "top", "bottom", "left", "right", "orientationStyles", "horizontal", "vertical", "edgeStyles", "strokeSize", "terminalSize", "offsetToAlignTerminalWithLine", "DropIndicator", "edge", "gap", "lineOffset", "orientation", "React", "div", "style", "className", "mx", "LIST_NAME", "ListProvider", "useListContext", "createContext", "defaultGetId", "item", "id", "ListRoot", "classNames", "children", "items", "isItem", "getId", "onMove", "props", "isEqual", "useCallback", "a", "b", "idA", "idB", "undefined", "state", "setState", "useState", "idle", "useEffect", "monitorForElements", "canMonitor", "source", "data", "onDrop", "location", "target", "current", "dropTargets", "sourceData", "targetData", "sourceIdx", "findIndex", "targetIdx", "closestEdgeOfTarget", "extractClosestEdge", "destinationIndex", "getReorderDestinationIndex", "startIndex", "indexOfTarget", "axis", "type", "stateStyles", "defaultContext", "LIST_ITEM_NAME", "ListItemProvider", "useListItemContext", "ListItem", "dragPreview", "setRootState", "ref", "useRef", "dragHandleRef", "element", "invariant", "combine", "draggable", "dragHandle", "getInitialData", "onGenerateDragPreview", "nativeSetDragImage", "rect", "getBoundingClientRect", "setCustomNativeDragPreview", "getOffset", "container", "height", "x", "y", "render", "width", "onDragStart", "dropTargetForElements", "canDrop", "getData", "input", "attachClosestEdge", "allowedEdges", "getIsSticky", "onDragEnter", "self", "closestEdge", "onDrag", "onDragLeave", "role", "IconButton", "forwardRef", "icon", "forwardedRef", "button", "Icon", "size", "ListItemDeleteButton", "autoHide", "disabled", "isDisabled", "ListItemDragHandle", "ListItemDragPreview", "createPortal", "ListItemWrapper", "ListItemTitle", "List", "Root", "Item", "ItemDragPreview", "ItemWrapper", "ItemDragHandle", "ItemDeleteButton", "ItemTitle", "TreeContext", "useTree", "useContext", "raise", "Error", "TreeProvider", "Provider", "reparent", "sibling", "child", "instructionStyles", "instruction", "isBlocked", "desiredInstruction", "desired", "currentLevel", "indentPerLevel", "TreeItemHeading", "memo", "label", "onSelect", "t", "useTranslation", "
|
|
4
|
+
"sourcesContent": ["//\n// Copyright 2024 DXOS.org\n//\n\nimport { combine } from '@atlaskit/pragmatic-drag-and-drop/combine';\nimport { draggable, dropTargetForElements } from '@atlaskit/pragmatic-drag-and-drop/element/adapter';\nimport { setCustomNativeDragPreview } from '@atlaskit/pragmatic-drag-and-drop/element/set-custom-native-drag-preview';\nimport {\n type Edge,\n attachClosestEdge,\n extractClosestEdge,\n} from '@atlaskit/pragmatic-drag-and-drop-hitbox/closest-edge';\nimport { createContext } from '@radix-ui/react-context';\nimport React, {\n type ComponentProps,\n type HTMLAttributes,\n type MutableRefObject,\n type PropsWithChildren,\n type ReactNode,\n forwardRef,\n useEffect,\n useRef,\n useState,\n} from 'react';\nimport { createPortal } from 'react-dom';\n\nimport { invariant } from '@dxos/invariant';\nimport { Icon, type ThemedClassName } from '@dxos/react-ui';\nimport { mx } from '@dxos/react-ui-theme';\n\nimport { DropIndicator } from './DropIndicator';\nimport { useListContext } from './ListRoot';\n\nexport type ListItemRecord = {};\n\nexport type ItemState =\n | {\n type: 'idle';\n }\n | {\n type: 'preview';\n container: HTMLElement;\n }\n | {\n type: 'is-dragging';\n }\n | {\n type: 'is-dragging-over';\n closestEdge: Edge | null;\n };\n\nexport const idle: ItemState = { type: 'idle' };\n\nconst stateStyles: { [Key in ItemState['type']]?: HTMLAttributes<HTMLDivElement>['className'] } = {\n 'is-dragging': 'opacity-50',\n};\n\ntype ListItemContext<T extends ListItemRecord> = {\n item: T;\n dragHandleRef: MutableRefObject<HTMLElement | null>;\n};\n\n/**\n * Default context defined for ListItemDragPreview, which is defined outside of ListItem.\n */\nconst defaultContext: ListItemContext<any> = {} as any;\n\nconst LIST_ITEM_NAME = 'ListItem';\n\nexport const [ListItemProvider, useListItemContext] = createContext<ListItemContext<any>>(\n LIST_ITEM_NAME,\n defaultContext,\n);\n\nexport type ListItemProps<T extends ListItemRecord> = ThemedClassName<\n PropsWithChildren<{\n item: T;\n }>\n>;\n\n/**\n * Draggable list item.\n */\nexport const ListItem = <T extends ListItemRecord>({ children, classNames, item }: ListItemProps<T>) => {\n const { isItem, dragPreview, setState: setRootState } = useListContext(LIST_ITEM_NAME);\n const ref = useRef<HTMLDivElement | null>(null);\n const dragHandleRef = useRef<HTMLElement | null>(null);\n const [state, setState] = useState<ItemState>(idle);\n useEffect(() => {\n const element = ref.current;\n invariant(element);\n return combine(\n //\n // https://atlassian.design/components/pragmatic-drag-and-drop/core-package/adapters/element/about#draggable\n //\n draggable({\n element,\n dragHandle: dragHandleRef.current!,\n getInitialData: () => item,\n onGenerateDragPreview: dragPreview\n ? ({ nativeSetDragImage, source }) => {\n const rect = source.element.getBoundingClientRect();\n setCustomNativeDragPreview({\n nativeSetDragImage,\n getOffset: ({ container }) => {\n const { height } = container.getBoundingClientRect();\n return {\n x: 20,\n y: height / 2,\n };\n },\n render: ({ container }) => {\n container.style.width = rect.width + 'px';\n setState({ type: 'preview', container });\n setRootState({ type: 'preview', container, item });\n },\n });\n }\n : undefined,\n onDragStart: () => {\n setState({ type: 'is-dragging' });\n setRootState({ type: 'is-dragging', item });\n },\n onDrop: () => {\n setState(idle);\n setRootState(idle);\n },\n }),\n\n //\n // https://atlassian.design/components/pragmatic-drag-and-drop/core-package/adapters/element/about#drop-target-for-elements\n //\n dropTargetForElements({\n element,\n canDrop: ({ source }) => {\n return source.element !== element && isItem(source.data);\n },\n getData: ({ input }) => {\n return attachClosestEdge(item, { element, input, allowedEdges: ['top', 'bottom'] });\n },\n getIsSticky: () => true,\n onDragEnter: ({ self }) => {\n const closestEdge = extractClosestEdge(self.data);\n setState({ type: 'is-dragging-over', closestEdge });\n },\n onDrag: ({ self }) => {\n const closestEdge = extractClosestEdge(self.data);\n setState((current) => {\n if (current.type === 'is-dragging-over' && current.closestEdge === closestEdge) {\n return current;\n }\n return { type: 'is-dragging-over', closestEdge };\n });\n },\n onDragLeave: () => {\n setState(idle);\n },\n onDrop: () => {\n setState(idle);\n },\n }),\n );\n }, [item]);\n\n return (\n <ListItemProvider item={item} dragHandleRef={dragHandleRef}>\n <div className='relative'>\n <div ref={ref} role='listitem' className={mx('flex overflow-hidden', classNames, stateStyles[state.type])}>\n {children}\n </div>\n {state.type === 'is-dragging-over' && state.closestEdge && <DropIndicator edge={state.closestEdge} />}\n </div>\n </ListItemProvider>\n );\n};\n\n//\n// List item components\n//\n\nexport type IconButtonProps = ThemedClassName<ComponentProps<'button'>> & { icon: string };\n\nexport const IconButton = forwardRef<HTMLButtonElement, IconButtonProps>(\n ({ classNames, icon, ...props }, forwardedRef) => {\n return (\n <button ref={forwardedRef} className={mx('flex items-center justify-center', classNames)} {...props}>\n <Icon icon={icon} classNames='cursor-pointer' size={4} />\n </button>\n );\n },\n);\n\nexport const ListItemDeleteButton = ({\n autoHide = true,\n classNames,\n disabled,\n ...props\n}: Omit<IconButtonProps, 'icon'> & { autoHide?: boolean }) => {\n const { state } = useListContext('DELETE_BUTTON');\n const isDisabled = state.type !== 'idle' || disabled;\n return (\n <IconButton\n icon='ph--x--regular'\n disabled={isDisabled}\n classNames={[classNames, autoHide && disabled && 'hidden']}\n {...props}\n />\n );\n};\n\nexport const ListItemDragHandle = () => {\n const { dragHandleRef } = useListItemContext('DRAG_HANDLE');\n return <IconButton ref={dragHandleRef as any} icon='ph--dots-six-vertical--regular' />;\n};\n\nexport const ListItemDragPreview = <T extends ListItemRecord>({\n children,\n}: {\n children: ({ item }: { item: T }) => ReactNode;\n}) => {\n const { state } = useListContext('DRAG_PREVIEW');\n return state?.type === 'preview' ? createPortal(children({ item: state.item }), state.container) : null;\n};\n\nexport const ListItemWrapper = ({ classNames, children }: ThemedClassName<PropsWithChildren>) => (\n <div className={mx('flex is-full gap-2', classNames)}>{children}</div>\n);\n\nexport const ListItemTitle = ({\n classNames,\n children,\n ...props\n}: ThemedClassName<PropsWithChildren<ComponentProps<'div'>>>) => (\n <div className={mx('flex grow items-center truncate', classNames)} {...props}>\n {children}\n </div>\n);\n", "//\n// Copyright 2024 DXOS.org\n//\n\nimport { type Edge } from '@atlaskit/pragmatic-drag-and-drop-hitbox/types';\nimport React, { type CSSProperties, type HTMLAttributes } from 'react';\n\nimport { mx } from '@dxos/react-ui-theme';\n\ntype Orientation = 'horizontal' | 'vertical';\n\nconst edgeToOrientationMap: Record<Edge, Orientation> = {\n top: 'horizontal',\n bottom: 'horizontal',\n left: 'vertical',\n right: 'vertical',\n};\n\nconst orientationStyles: Record<Orientation, HTMLAttributes<HTMLElement>['className']> = {\n horizontal: 'h-[--line-thickness] left-[--terminal-radius] right-0 before:left-[--negative-terminal-size]',\n vertical: 'w-[--line-thickness] top-[--terminal-radius] bottom-0 before:top-[--negative-terminal-size]',\n};\n\nconst edgeStyles: Record<Edge, HTMLAttributes<HTMLElement>['className']> = {\n top: 'top-[--line-offset] before:top-[--offset-terminal]',\n right: 'right-[--line-offset] before:right-[--offset-terminal]',\n bottom: 'bottom-[--line-offset] before:bottom-[--offset-terminal]',\n left: 'left-[--line-offset] before:left-[--offset-terminal]',\n};\n\nconst strokeSize = 2;\nconst terminalSize = 8;\nconst offsetToAlignTerminalWithLine = (strokeSize - terminalSize) / 2;\n\nexport type DropIndicatorProps = {\n edge: Edge;\n gap?: number;\n};\n\n/**\n * This is a tailwind port of `@atlaskit/pragmatic-drag-and-drop-react-drop-indicator/box`\n */\nexport const DropIndicator = ({ edge, gap = 0 }: DropIndicatorProps) => {\n const lineOffset = `calc(-0.5 * (${gap}px + ${strokeSize}px))`;\n\n const orientation = edgeToOrientationMap[edge];\n\n return (\n <div\n style={\n {\n '--line-thickness': `${strokeSize}px`,\n '--line-offset': `${lineOffset}`,\n '--terminal-size': `${terminalSize}px`,\n '--terminal-radius': `${terminalSize / 2}px`,\n '--negative-terminal-size': `-${terminalSize}px`,\n '--offset-terminal': `${offsetToAlignTerminalWithLine}px`,\n } as CSSProperties\n }\n className={mx(\n 'absolute z-10 pointer-events-none bg-blue-700',\n \"before:content-[''] before:w-[--terminal-size] before:h-[--terminal-size] box-border before:absolute\",\n 'before:border-[length:--line-thickness] before:border-solid before:border-blue-700 before:rounded-full',\n orientationStyles[orientation],\n edgeStyles[edge],\n )}\n ></div>\n );\n};\n", "//\n// Copyright 2024 DXOS.org\n//\n\nimport { monitorForElements } from '@atlaskit/pragmatic-drag-and-drop/element/adapter';\nimport { extractClosestEdge } from '@atlaskit/pragmatic-drag-and-drop-hitbox/closest-edge';\nimport { getReorderDestinationIndex } from '@atlaskit/pragmatic-drag-and-drop-hitbox/util/get-reorder-destination-index';\nimport { createContext } from '@radix-ui/react-context';\nimport React, { type ReactNode, useCallback, useEffect, useState } from 'react';\n\nimport { type ThemedClassName } from '@dxos/react-ui';\n\nimport { idle, type ItemState, type ListItemRecord } from './ListItem';\n\ntype ListContext<T extends ListItemRecord> = {\n isItem: (item: any) => boolean;\n getId?: (item: T) => string; // TODO(burdon): Require if T doesn't conform to type.\n dragPreview?: boolean;\n state: ItemState & { item?: T };\n setState: (state: ItemState & { item?: T }) => void;\n};\n\nconst LIST_NAME = 'List';\n\nexport const [ListProvider, useListContext] = createContext<ListContext<any>>(LIST_NAME);\n\nexport type ListRendererProps<T extends ListItemRecord> = {\n state: ListContext<T>['state'];\n items: T[];\n};\n\nexport type ListRootProps<T extends ListItemRecord> = ThemedClassName<{\n children?: (props: ListRendererProps<T>) => ReactNode;\n items?: T[];\n onMove?: (fromIndex: number, toIndex: number) => void;\n}> &\n Pick<ListContext<T>, 'isItem' | 'getId' | 'dragPreview'>;\n\nconst defaultGetId = <T extends ListItemRecord>(item: T) => (item as any)?.id;\n\nexport const ListRoot = <T extends ListItemRecord>({\n classNames,\n children,\n items,\n isItem,\n getId = defaultGetId,\n onMove,\n ...props\n}: ListRootProps<T>) => {\n const isEqual = useCallback(\n (a: T, b: T) => {\n const idA = getId?.(a);\n const idB = getId?.(b);\n\n if (idA !== undefined && idB !== undefined) {\n return idA === idB;\n } else {\n // Fallback for primitive values or when getId fails.\n // NOTE(ZaymonFC): After drag and drop, pragmatic internally serializes drop targets which breaks reference equality.\n // You must provide an `getId` function that returns a stable identifier for your items.\n return a === b;\n }\n },\n [getId],\n );\n\n const [state, setState] = useState<ListContext<T>['state']>(idle);\n useEffect(() => {\n if (!items) {\n return;\n }\n\n return monitorForElements({\n canMonitor: ({ source }) => isItem(source.data),\n onDrop: ({ location, source }) => {\n const target = location.current.dropTargets[0];\n if (!target) {\n return;\n }\n\n const sourceData = source.data;\n const targetData = target.data;\n\n if (!isItem(sourceData) || !isItem(targetData)) {\n return;\n }\n\n const sourceIdx = items.findIndex((item) => isEqual(item, sourceData as T));\n const targetIdx = items.findIndex((item) => isEqual(item, targetData as T));\n if (targetIdx < 0 || sourceIdx < 0) {\n return;\n }\n const closestEdgeOfTarget = extractClosestEdge(targetData);\n const destinationIndex = getReorderDestinationIndex({\n closestEdgeOfTarget,\n startIndex: sourceIdx,\n indexOfTarget: targetIdx,\n axis: 'vertical',\n });\n\n onMove?.(sourceIdx, destinationIndex);\n },\n });\n }, [items, isEqual, onMove]);\n\n return (\n <ListProvider {...{ isItem, state, setState, ...props }}>{children?.({ state, items: items ?? [] })}</ListProvider>\n );\n};\n", "//\n// Copyright 2024 DXOS.org\n//\n\nimport {\n IconButton,\n type IconButtonProps,\n ListItem,\n ListItemDeleteButton,\n ListItemDragHandle,\n ListItemDragPreview,\n type ListItemProps,\n type ListItemRecord,\n ListItemTitle,\n ListItemWrapper,\n} from './ListItem';\nimport { ListRoot, type ListRootProps } from './ListRoot';\n\n// TODO(burdon): Multi-select model.\n// TODO(burdon): Key nav.\n// TODO(burdon): Animation.\n// TODO(burdon): Constrain axis.\n// TODO(burdon): Tree view.\n// TODO(burdon): Fix autoscroll while dragging.\n\n/**\n * Draggable list.\n * Ref: https://github.com/atlassian/pragmatic-drag-and-drop\n * Ref: https://github.com/alexreardon/pdnd-react-tailwind/blob/main/src/task.tsx\n */\nexport const List = {\n Root: ListRoot,\n Item: ListItem,\n ItemDragPreview: ListItemDragPreview,\n ItemWrapper: ListItemWrapper,\n ItemDragHandle: ListItemDragHandle,\n ItemDeleteButton: ListItemDeleteButton,\n ItemTitle: ListItemTitle,\n IconButton,\n};\n\ntype ListItem = ListItemRecord;\n\nexport type { ListRootProps, ListItemProps, IconButtonProps, ListItem };\n", "//\n// Copyright 2024 DXOS.org\n//\n\nimport React, { useMemo } from 'react';\n\nimport { Treegrid, type TreegridRootProps } from '@dxos/react-ui';\n\nimport { type TreeContextType, TreeProvider } from './TreeContext';\nimport { TreeItem, type TreeItemProps } from './TreeItem';\n\nexport type TreeProps<T = any> = { id: string } & TreeContextType &\n Partial<Pick<TreegridRootProps, 'gridTemplateColumns' | 'classNames'>> &\n Pick<TreeItemProps<T>, 'draggable' | 'renderColumns' | 'canDrop' | 'onOpenChange' | 'onSelect'>;\n\nexport const Tree = <T = any,>({\n id,\n getItems,\n getProps,\n isOpen,\n isCurrent,\n draggable = false,\n gridTemplateColumns = '[tree-row-start] 1fr min-content [tree-row-end]',\n classNames,\n renderColumns,\n canDrop,\n onOpenChange,\n onSelect,\n}: TreeProps<T>) => {\n const context = useMemo(\n () => ({\n getItems,\n getProps,\n isOpen,\n isCurrent,\n }),\n [getItems, getProps, isOpen, isCurrent],\n );\n const items = getItems();\n const path = useMemo(() => [id], [id]);\n\n return (\n <Treegrid.Root gridTemplateColumns={gridTemplateColumns} classNames={classNames}>\n <TreeProvider value={context}>\n {items.map((item, index) => (\n <TreeItem\n key={item.id}\n item={item}\n last={index === items.length - 1}\n path={path}\n draggable={draggable}\n renderColumns={renderColumns}\n canDrop={canDrop}\n onOpenChange={onOpenChange}\n onSelect={onSelect}\n />\n ))}\n </TreeProvider>\n </Treegrid.Root>\n );\n};\n", "//\n// Copyright 2024 DXOS.org\n//\n\nimport { createContext, useContext } from 'react';\n\nimport { raise } from '@dxos/debug';\nimport { type Label } from '@dxos/react-ui';\n\nexport type PropsFromTreeItem = {\n id: string;\n label: Label;\n parentOf?: string[];\n icon?: string;\n disabled?: boolean;\n className?: string;\n headingClassName?: string;\n testId?: string;\n};\n\nexport type TreeContextType<T = any> = {\n getItems: (parent?: T) => T[];\n getProps: (item: T, parent: string[]) => PropsFromTreeItem;\n isOpen: (path: string[], item: T) => boolean;\n isCurrent: (path: string[], item: T) => boolean;\n};\n\nconst TreeContext = createContext<null | TreeContextType>(null);\n\nexport const useTree = () => useContext(TreeContext) ?? raise(new Error('TreeContext not found'));\n\nexport const TreeProvider = TreeContext.Provider;\n", "//\n// Copyright 2024 DXOS.org\n//\n\nimport { combine } from '@atlaskit/pragmatic-drag-and-drop/combine';\nimport {\n draggable as pragmaticDraggable,\n dropTargetForElements,\n} from '@atlaskit/pragmatic-drag-and-drop/element/adapter';\n// https://github.com/atlassian/pragmatic-drag-and-drop/blob/main/packages/hitbox/constellation/index/about.mdx\nimport {\n attachInstruction,\n extractInstruction,\n type Instruction,\n type ItemMode,\n} from '@atlaskit/pragmatic-drag-and-drop-hitbox/tree-item';\nimport React, { memo, useCallback, useEffect, useMemo, useRef, useState, type FC, type KeyboardEvent } from 'react';\n\nimport { S } from '@dxos/echo-schema';\nimport { invariant } from '@dxos/invariant';\nimport { Treegrid } from '@dxos/react-ui';\nimport {\n focusRing,\n ghostHover,\n hoverableControls,\n hoverableFocusedKeyboardControls,\n hoverableFocusedWithinControls,\n mx,\n} from '@dxos/react-ui-theme';\n\nimport { DropIndicator } from './DropIndicator';\nimport { useTree } from './TreeContext';\nimport { TreeItemHeading } from './TreeItemHeading';\nimport { TreeItemToggle } from './TreeItemToggle';\nimport { DEFAULT_INDENTATION, paddingIndendation } from './helpers';\n\ntype TreeItemState = 'idle' | 'dragging' | 'preview' | 'parent-of-instruction';\n\nconst hoverableDescriptionIcons =\n '[--icons-color:inherit] hover-hover:[--icons-color:var(--description-text)] hover-hover:hover:[--icons-color:inherit] focus-within:[--icons-color:inherit]';\n\nexport const TreeDataSchema = S.Struct({\n id: S.String,\n path: S.Array(S.String),\n item: S.Any,\n});\n\nexport type TreeData = S.Schema.Type<typeof TreeDataSchema>;\n\nexport const isTreeData = (data: unknown): data is TreeData => S.is(TreeDataSchema)(data);\n\nexport type TreeItemProps<T = any> = {\n item: T;\n path: string[];\n last: boolean;\n draggable?: boolean;\n renderColumns?: FC<{ item: T; path: string[]; menuOpen: boolean; setMenuOpen: (open: boolean) => void }>;\n canDrop?: (source: TreeData, target: TreeData) => boolean;\n onOpenChange?: (params: { item: T; path: string[]; open: boolean }) => void;\n onSelect?: (params: { item: T; path: string[]; current: boolean }) => void;\n};\n\nexport const RawTreeItem = <T = any,>({\n item,\n path: _path,\n last,\n draggable,\n renderColumns: Columns,\n canDrop,\n onOpenChange,\n onSelect,\n}: TreeItemProps<T>) => {\n const { getItems, getProps, isOpen, isCurrent } = useTree();\n const items = getItems(item);\n const { id, label, parentOf, icon, disabled, className, headingClassName, testId } = getProps(item, _path);\n const path = useMemo(() => [..._path, id], [_path, id]);\n const open = isOpen(path, item);\n const current = isCurrent(path, item);\n const level = path.length - 2;\n const isBranch = !!parentOf;\n const mode: ItemMode = last ? 'last-in-group' : open ? 'expanded' : 'standard';\n const data = useMemo(() => ({ id, path, item }) satisfies TreeData, [id, path, item]);\n\n const rowRef = useRef<HTMLDivElement | null>(null);\n const buttonRef = useRef<HTMLButtonElement | null>(null);\n const openRef = useRef(false);\n const cancelExpandRef = useRef<NodeJS.Timeout | null>(null);\n const [_state, setState] = useState<TreeItemState>('idle');\n const [instruction, setInstruction] = useState<Instruction | null>(null);\n const [menuOpen, setMenuOpen] = useState(false);\n\n const cancelExpand = useCallback(() => {\n if (cancelExpandRef.current) {\n clearTimeout(cancelExpandRef.current);\n cancelExpandRef.current = null;\n }\n }, []);\n\n useEffect(() => {\n if (!draggable) {\n return;\n }\n\n invariant(buttonRef.current);\n\n // https://atlassian.design/components/pragmatic-drag-and-drop/core-package/adapters/element/about\n return combine(\n pragmaticDraggable({\n element: buttonRef.current,\n getInitialData: () => data,\n onDragStart: () => {\n setState('dragging');\n if (open) {\n openRef.current = true;\n onOpenChange?.({ item, path, open: false });\n }\n },\n onDrop: () => {\n setState('idle');\n if (openRef.current) {\n onOpenChange?.({ item, path, open: true });\n }\n },\n }),\n dropTargetForElements({\n element: buttonRef.current,\n getData: ({ input, element }) => {\n return attachInstruction(data, {\n input,\n element,\n indentPerLevel: DEFAULT_INDENTATION,\n currentLevel: level,\n mode,\n block: isBranch ? [] : ['make-child'],\n });\n },\n canDrop: ({ source }) => {\n const _canDrop = canDrop ?? (() => true);\n return source.element !== buttonRef.current && _canDrop(source.data as TreeData, data);\n },\n getIsSticky: () => true,\n onDrag: ({ self, source }) => {\n const instruction = extractInstruction(self.data);\n\n if (source.data.id !== id) {\n if (instruction?.type === 'make-child' && isBranch && !open && !cancelExpandRef.current) {\n cancelExpandRef.current = setTimeout(() => {\n onOpenChange?.({ item, path, open: true });\n }, 500);\n }\n\n if (instruction?.type !== 'make-child') {\n cancelExpand();\n }\n\n setInstruction(instruction);\n } else if (instruction?.type === 'reparent') {\n // TODO(wittjosiah): This is not occurring in the current implementation.\n setInstruction(instruction);\n } else {\n setInstruction(null);\n }\n },\n onDragLeave: () => {\n cancelExpand();\n setInstruction(null);\n },\n onDrop: () => {\n cancelExpand();\n setInstruction(null);\n },\n }),\n );\n }, [draggable, item, id, mode, path, open, canDrop]);\n\n // Cancel expand on unmount.\n useEffect(() => () => cancelExpand(), [cancelExpand]);\n\n const handleOpenChange = useCallback(\n () => onOpenChange?.({ item, path, open: !open }),\n [onOpenChange, item, path, open],\n );\n\n const handleSelect = useCallback(() => {\n rowRef.current?.focus();\n onSelect?.({ item, path, current: !current });\n }, [onSelect, item, path, current]);\n\n const handleKeyDown = useCallback(\n (event: KeyboardEvent) => {\n switch (event.key) {\n case 'ArrowRight':\n isBranch && !open && handleOpenChange();\n break;\n case 'ArrowLeft':\n isBranch && open && handleOpenChange();\n break;\n case ' ':\n handleSelect();\n break;\n }\n },\n [isBranch, open, handleOpenChange, handleSelect],\n );\n\n return (\n <>\n <Treegrid.Row\n ref={rowRef}\n key={id}\n id={id}\n aria-labelledby={`${id}__label`}\n parentOf={parentOf?.join(Treegrid.PARENT_OF_SEPARATOR)}\n classNames={mx(\n 'grid grid-cols-subgrid col-[tree-row] mt-[2px] aria-[current]:bg-input',\n hoverableControls,\n hoverableFocusedKeyboardControls,\n hoverableFocusedWithinControls,\n hoverableDescriptionIcons,\n ghostHover,\n focusRing,\n className,\n )}\n data-itemid={id}\n data-testid={testId}\n // NOTE(thure): This is intentionally an empty string to for descendents to select by in the CSS\n // without alerting the user (except for in the correct link element). See also:\n // https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Attributes/aria-current#description\n aria-current={current ? ('' as 'page') : undefined}\n onKeyDown={handleKeyDown}\n onContextMenu={(event) => {\n event.preventDefault();\n setMenuOpen(true);\n }}\n >\n <Treegrid.Cell\n indent\n classNames='relative grid grid-cols-subgrid col-[tree-row]'\n style={paddingIndendation(level)}\n >\n <div role='none' className='flex items-center'>\n <TreeItemToggle open={open} isBranch={isBranch} onToggle={handleOpenChange} />\n <TreeItemHeading\n ref={buttonRef}\n label={label}\n icon={icon}\n className={headingClassName}\n disabled={disabled}\n current={current}\n onSelect={handleSelect}\n />\n </div>\n {Columns && <Columns item={item} path={path} menuOpen={menuOpen} setMenuOpen={setMenuOpen} />}\n {instruction && <DropIndicator instruction={instruction} gap={2} />}\n </Treegrid.Cell>\n </Treegrid.Row>\n {open &&\n items.map((item, index) => (\n <TreeItem\n key={item.id}\n item={item}\n path={path}\n last={index === items.length - 1}\n draggable={draggable}\n renderColumns={Columns}\n canDrop={canDrop}\n onOpenChange={onOpenChange}\n onSelect={onSelect}\n />\n ))}\n </>\n );\n};\n\nexport const TreeItem = memo(RawTreeItem) as FC<TreeItemProps>;\n", "//\n// Copyright 2024 DXOS.org\n//\n\nimport { type Instruction } from '@atlaskit/pragmatic-drag-and-drop-hitbox/tree-item';\nimport React, { type HTMLAttributes, type CSSProperties } from 'react';\n\nimport { mx } from '@dxos/react-ui-theme';\n\n// Tree item hitbox\n// https://github.com/atlassian/pragmatic-drag-and-drop/blob/main/packages/hitbox/constellation/index/about.mdx#tree-item\n\ntype InstructionType = Exclude<Instruction, { type: 'instruction-blocked' }>['type'];\ntype Orientation = 'sibling' | 'child';\n\nconst edgeToOrientationMap: Record<InstructionType, Orientation> = {\n 'reorder-above': 'sibling',\n 'reorder-below': 'sibling',\n 'make-child': 'child',\n reparent: 'child',\n};\n\nconst orientationStyles: Record<Orientation, HTMLAttributes<HTMLElement>['className']> = {\n // TODO(wittjosiah): Stop using left/right here.\n sibling:\n 'bs-[--line-thickness] left-[--horizontal-indent] right-0 bg-accentSurface before:left-[--negative-terminal-size]',\n child: 'is-full block-start-0 block-end-0 border-[length:--line-thickness] before:invisible',\n};\n\nconst instructionStyles: Record<InstructionType, HTMLAttributes<HTMLElement>['className']> = {\n 'reorder-above': 'block-start-[--line-offset] before:block-start-[--offset-terminal]',\n 'reorder-below': 'block-end-[--line-offset] before:block-end-[--offset-terminal]',\n 'make-child': 'border-accentSurface',\n // TODO(wittjosiah): This is not occurring in the current implementation.\n reparent: '',\n};\n\nconst strokeSize = 2;\nconst terminalSize = 8;\nconst offsetToAlignTerminalWithLine = (strokeSize - terminalSize) / 2;\n\nexport type DropIndicatorProps = {\n instruction: Instruction;\n gap?: number;\n};\n\nexport const DropIndicator = ({ instruction, gap = 0 }: DropIndicatorProps) => {\n const lineOffset = `calc(-0.5 * (${gap}px + ${strokeSize}px))`;\n const isBlocked = instruction.type === 'instruction-blocked';\n const desiredInstruction = isBlocked ? instruction.desired : instruction;\n const orientation = edgeToOrientationMap[desiredInstruction.type];\n if (isBlocked) {\n return null;\n }\n\n return (\n <div\n style={\n {\n '--line-thickness': `${strokeSize}px`,\n '--line-offset': `${lineOffset}`,\n '--terminal-size': `${terminalSize}px`,\n '--terminal-radius': `${terminalSize / 2}px`,\n '--negative-terminal-size': `-${terminalSize}px`,\n '--offset-terminal': `${offsetToAlignTerminalWithLine}px`,\n '--horizontal-indent': `${desiredInstruction.currentLevel * desiredInstruction.indentPerLevel + 4}px`,\n } as CSSProperties\n }\n className={mx(\n 'absolute z-10 pointer-events-none',\n 'before:is-[--terminal-size] before:bs-[--terminal-size] box-border before:absolute',\n 'before:border-[length:--line-thickness] before:border-solid before:border-accentSurface before:rounded-full',\n orientationStyles[orientation],\n instructionStyles[desiredInstruction.type],\n )}\n ></div>\n );\n};\n", "//\n// Copyright 2024 DXOS.org\n//\n\nimport React, { type KeyboardEvent, forwardRef, memo, useCallback } from 'react';\n\nimport { Button, Icon, toLocalizedString, useTranslation, type Label } from '@dxos/react-ui';\nimport { TextTooltip } from '@dxos/react-ui-text-tooltip';\nimport { mx } from '@dxos/react-ui-theme';\n\n// TODO(wittjosiah): Consider whether there should be a separate disabled prop which was visually distinct\n// rather than just making the item unselectable.\nexport type NavTreeItemHeadingProps = {\n label: Label;\n icon?: string;\n className?: string;\n disabled?: boolean;\n current?: boolean;\n onSelect?: () => void;\n};\n\nexport const TreeItemHeading = memo(\n forwardRef<HTMLButtonElement, NavTreeItemHeadingProps>(\n ({ label, icon, className, disabled, current, onSelect }, forwardedRef) => {\n const { t } = useTranslation();\n\n const handleButtonKeydown = useCallback(\n (event: KeyboardEvent) => {\n if (event.key === ' ' || event.key === 'Enter') {\n event.preventDefault();\n event.stopPropagation();\n onSelect?.();\n }\n },\n [onSelect],\n );\n\n return (\n <TextTooltip\n text={toLocalizedString(label, t)}\n side='bottom'\n truncateQuery='span[data-tooltip]'\n onlyWhenTruncating\n asChild\n ref={forwardedRef}\n >\n {/* TODO(wittjosiah): Class precedence. See #8149. */}\n <Button\n data-testid='treeItem.heading'\n variant='ghost'\n density='fine'\n classNames={mx(\n 'grow gap-2 !pis-0.5 hover:!bg-transparent dark:hover:!bg-transparent',\n 'disabled:!cursor-default disabled:!opacity-100',\n className,\n )}\n disabled={disabled}\n onClick={onSelect}\n onKeyDown={handleButtonKeydown}\n {...(current && { 'aria-current': 'location' })}\n >\n {icon && <Icon icon={icon ?? 'ph--placeholder--regular'} size={4} classNames='is-[1em] bs-[1em] mlb-1' />}\n <span className='flex-1 is-0 truncate text-start text-sm font-normal'>{toLocalizedString(label, t)}</span>\n </Button>\n </TextTooltip>\n );\n },\n ),\n);\n", "//\n// Copyright 2024 DXOS.org\n//\n\nimport React, { forwardRef, memo } from 'react';\n\nimport { Button, Icon } from '@dxos/react-ui';\nimport { mx } from '@dxos/react-ui-theme';\n\nexport type TreeItemToggleProps = {\n open?: boolean;\n isBranch?: boolean;\n onToggle?: () => void;\n};\n\nexport const TreeItemToggle = memo(\n forwardRef<HTMLButtonElement, TreeItemToggleProps>(({ open, isBranch, onToggle }, forwardedRef) => {\n return (\n <Button\n ref={forwardedRef}\n data-testid='treeItem.toggle'\n aria-expanded={open}\n variant='ghost'\n density='fine'\n classNames={mx('is-6 !pli-1', !isBranch && 'invisible')}\n onClick={onToggle}\n >\n <Icon\n icon='ph--caret-right--regular'\n size={3}\n classNames={mx('transition duration-200', open && 'rotate-90')}\n />\n </Button>\n );\n }),\n);\n", "//\n// Copyright 2024 DXOS.org\n//\n\nexport const DEFAULT_INDENTATION = 8;\n\nexport const paddingIndendation = (level: number, indentation = DEFAULT_INDENTATION) => ({\n paddingInlineStart: `${(level - 1) * indentation}px`,\n});\n"],
|
|
5
|
+
"mappings": "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",
|
|
6
|
+
"names": ["import_react", "import_react_ui_theme", "import_adapter", "import_closest_edge", "import_react_context", "import_react_ui", "import_combine", "import_invariant", "edgeToOrientationMap", "top", "bottom", "left", "right", "orientationStyles", "horizontal", "vertical", "edgeStyles", "strokeSize", "terminalSize", "offsetToAlignTerminalWithLine", "DropIndicator", "edge", "gap", "lineOffset", "orientation", "React", "div", "style", "className", "mx", "LIST_NAME", "ListProvider", "useListContext", "createContext", "defaultGetId", "item", "id", "ListRoot", "classNames", "children", "items", "isItem", "getId", "onMove", "props", "isEqual", "useCallback", "a", "b", "idA", "idB", "undefined", "state", "setState", "useState", "idle", "useEffect", "monitorForElements", "canMonitor", "source", "data", "onDrop", "location", "target", "current", "dropTargets", "sourceData", "targetData", "sourceIdx", "findIndex", "targetIdx", "closestEdgeOfTarget", "extractClosestEdge", "destinationIndex", "getReorderDestinationIndex", "startIndex", "indexOfTarget", "axis", "type", "stateStyles", "defaultContext", "LIST_ITEM_NAME", "ListItemProvider", "useListItemContext", "ListItem", "dragPreview", "setRootState", "ref", "useRef", "dragHandleRef", "element", "invariant", "combine", "draggable", "dragHandle", "getInitialData", "onGenerateDragPreview", "nativeSetDragImage", "rect", "getBoundingClientRect", "setCustomNativeDragPreview", "getOffset", "container", "height", "x", "y", "render", "width", "onDragStart", "dropTargetForElements", "canDrop", "getData", "input", "attachClosestEdge", "allowedEdges", "getIsSticky", "onDragEnter", "self", "closestEdge", "onDrag", "onDragLeave", "role", "IconButton", "forwardRef", "icon", "forwardedRef", "button", "Icon", "size", "ListItemDeleteButton", "autoHide", "disabled", "isDisabled", "ListItemDragHandle", "ListItemDragPreview", "createPortal", "ListItemWrapper", "ListItemTitle", "List", "Root", "Item", "ItemDragPreview", "ItemWrapper", "ItemDragHandle", "ItemDeleteButton", "ItemTitle", "TreeContext", "useTree", "useContext", "raise", "Error", "TreeProvider", "Provider", "reparent", "sibling", "child", "instructionStyles", "instruction", "isBlocked", "desiredInstruction", "desired", "currentLevel", "indentPerLevel", "TreeItemHeading", "memo", "label", "onSelect", "t", "useTranslation", "handleButtonKeydown", "event", "key", "preventDefault", "stopPropagation", "TextTooltip", "text", "toLocalizedString", "side", "truncateQuery", "onlyWhenTruncating", "asChild", "Button", "data-testid", "variant", "density", "onClick", "onKeyDown", "span", "TreeItemToggle", "open", "isBranch", "onToggle", "aria-expanded", "DEFAULT_INDENTATION", "paddingIndendation", "level", "indentation", "paddingInlineStart", "hoverableDescriptionIcons", "TreeDataSchema", "S", "Struct", "String", "path", "Array", "Any", "isTreeData", "is", "RawTreeItem", "_path", "last", "renderColumns", "Columns", "onOpenChange", "getItems", "getProps", "isOpen", "isCurrent", "parentOf", "headingClassName", "testId", "useMemo", "length", "mode", "rowRef", "buttonRef", "openRef", "cancelExpandRef", "_state", "setInstruction", "menuOpen", "setMenuOpen", "cancelExpand", "clearTimeout", "pragmaticDraggable", "attachInstruction", "block", "_canDrop", "extractInstruction", "setTimeout", "handleOpenChange", "handleSelect", "focus", "handleKeyDown", "Treegrid", "Row", "aria-labelledby", "join", "PARENT_OF_SEPARATOR", "hoverableControls", "hoverableFocusedKeyboardControls", "hoverableFocusedWithinControls", "ghostHover", "focusRing", "data-itemid", "aria-current", "onContextMenu", "Cell", "indent", "map", "index", "TreeItem", "Tree", "gridTemplateColumns", "context", "value"]
|
|
7
7
|
}
|
package/dist/lib/node/meta.json
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"inputs":{"packages/ui/react-ui-list/src/components/List/DropIndicator.tsx":{"bytes":7070,"imports":[{"path":"react","kind":"import-statement","external":true},{"path":"@dxos/react-ui-theme","kind":"import-statement","external":true}],"format":"esm"},"packages/ui/react-ui-list/src/components/List/ListRoot.tsx":{"bytes":10900,"imports":[{"path":"@atlaskit/pragmatic-drag-and-drop/element/adapter","kind":"import-statement","external":true},{"path":"@atlaskit/pragmatic-drag-and-drop-hitbox/closest-edge","kind":"import-statement","external":true},{"path":"@atlaskit/pragmatic-drag-and-drop-hitbox/util/get-reorder-destination-index","kind":"import-statement","external":true},{"path":"@radix-ui/react-context","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true},{"path":"packages/ui/react-ui-list/src/components/List/ListItem.tsx","kind":"import-statement","original":"./ListItem"}],"format":"esm"},"packages/ui/react-ui-list/src/components/List/ListItem.tsx":{"bytes":24128,"imports":[{"path":"@atlaskit/pragmatic-drag-and-drop/combine","kind":"import-statement","external":true},{"path":"@atlaskit/pragmatic-drag-and-drop/element/adapter","kind":"import-statement","external":true},{"path":"@atlaskit/pragmatic-drag-and-drop/element/set-custom-native-drag-preview","kind":"import-statement","external":true},{"path":"@atlaskit/pragmatic-drag-and-drop-hitbox/closest-edge","kind":"import-statement","external":true},{"path":"@radix-ui/react-context","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true},{"path":"react-dom","kind":"import-statement","external":true},{"path":"@dxos/invariant","kind":"import-statement","external":true},{"path":"@dxos/react-ui","kind":"import-statement","external":true},{"path":"@dxos/react-ui-theme","kind":"import-statement","external":true},{"path":"packages/ui/react-ui-list/src/components/List/DropIndicator.tsx","kind":"import-statement","original":"./DropIndicator"},{"path":"packages/ui/react-ui-list/src/components/List/ListRoot.tsx","kind":"import-statement","original":"./ListRoot"}],"format":"esm"},"packages/ui/react-ui-list/src/components/List/List.tsx":{"bytes":3478,"imports":[{"path":"packages/ui/react-ui-list/src/components/List/ListItem.tsx","kind":"import-statement","original":"./ListItem"},{"path":"packages/ui/react-ui-list/src/components/List/ListRoot.tsx","kind":"import-statement","original":"./ListRoot"}],"format":"esm"},"packages/ui/react-ui-list/src/components/List/index.ts":{"bytes":505,"imports":[{"path":"packages/ui/react-ui-list/src/components/List/List.tsx","kind":"import-statement","original":"./List"}],"format":"esm"},"packages/ui/react-ui-list/src/components/Tree/TreeContext.tsx":{"bytes":2214,"imports":[{"path":"react","kind":"import-statement","external":true},{"path":"@dxos/debug","kind":"import-statement","external":true}],"format":"esm"},"packages/ui/react-ui-list/src/components/Tree/DropIndicator.tsx":{"bytes":8689,"imports":[{"path":"react","kind":"import-statement","external":true},{"path":"@dxos/react-ui-theme","kind":"import-statement","external":true}],"format":"esm"},"packages/ui/react-ui-list/src/components/Tree/TreeItemHeading.tsx":{"bytes":7754,"imports":[{"path":"react","kind":"import-statement","external":true},{"path":"@dxos/react-ui","kind":"import-statement","external":true},{"path":"@dxos/react-ui-text-tooltip","kind":"import-statement","external":true},{"path":"@dxos/react-ui-theme","kind":"import-statement","external":true}],"format":"esm"},"packages/ui/react-ui-list/src/components/Tree/TreeItemToggle.tsx":{"bytes":3194,"imports":[{"path":"react","kind":"import-statement","external":true},{"path":"@dxos/react-ui","kind":"import-statement","external":true},{"path":"@dxos/react-ui-theme","kind":"import-statement","external":true}],"format":"esm"},"packages/ui/react-ui-list/src/components/Tree/helpers.ts":{"bytes":1223,"imports":[],"format":"esm"},"packages/ui/react-ui-list/src/components/Tree/TreeItem.tsx":{"bytes":31318,"imports":[{"path":"@atlaskit/pragmatic-drag-and-drop/combine","kind":"import-statement","external":true},{"path":"@atlaskit/pragmatic-drag-and-drop/element/adapter","kind":"import-statement","external":true},{"path":"@atlaskit/pragmatic-drag-and-drop-hitbox/tree-item","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true},{"path":"@dxos/echo-schema","kind":"import-statement","external":true},{"path":"@dxos/invariant","kind":"import-statement","external":true},{"path":"@dxos/react-ui","kind":"import-statement","external":true},{"path":"@dxos/react-ui-theme","kind":"import-statement","external":true},{"path":"packages/ui/react-ui-list/src/components/Tree/DropIndicator.tsx","kind":"import-statement","original":"./DropIndicator"},{"path":"packages/ui/react-ui-list/src/components/Tree/TreeContext.tsx","kind":"import-statement","original":"./TreeContext"},{"path":"packages/ui/react-ui-list/src/components/Tree/TreeItemHeading.tsx","kind":"import-statement","original":"./TreeItemHeading"},{"path":"packages/ui/react-ui-list/src/components/Tree/TreeItemToggle.tsx","kind":"import-statement","original":"./TreeItemToggle"},{"path":"packages/ui/react-ui-list/src/components/Tree/helpers.ts","kind":"import-statement","original":"./helpers"}],"format":"esm"},"packages/ui/react-ui-list/src/components/Tree/Tree.tsx":{"bytes":5361,"imports":[{"path":"react","kind":"import-statement","external":true},{"path":"@dxos/react-ui","kind":"import-statement","external":true},{"path":"packages/ui/react-ui-list/src/components/Tree/TreeContext.tsx","kind":"import-statement","original":"./TreeContext"},{"path":"packages/ui/react-ui-list/src/components/Tree/TreeItem.tsx","kind":"import-statement","original":"./TreeItem"}],"format":"esm"},"packages/ui/react-ui-list/src/components/Tree/index.ts":{"bytes":692,"imports":[{"path":"packages/ui/react-ui-list/src/components/Tree/Tree.tsx","kind":"import-statement","original":"./Tree"},{"path":"packages/ui/react-ui-list/src/components/Tree/TreeContext.tsx","kind":"import-statement","original":"./TreeContext"},{"path":"packages/ui/react-ui-list/src/components/Tree/TreeItem.tsx","kind":"import-statement","original":"./TreeItem"}],"format":"esm"},"packages/ui/react-ui-list/src/components/index.ts":{"bytes":580,"imports":[{"path":"packages/ui/react-ui-list/src/components/List/index.ts","kind":"import-statement","original":"./List"},{"path":"packages/ui/react-ui-list/src/components/Tree/index.ts","kind":"import-statement","original":"./Tree"}],"format":"esm"},"packages/ui/react-ui-list/src/index.ts":{"bytes":503,"imports":[{"path":"packages/ui/react-ui-list/src/components/index.ts","kind":"import-statement","original":"./components"}],"format":"esm"}},"outputs":{"packages/ui/react-ui-list/dist/lib/node/index.cjs.map":{"imports":[],"exports":[],"inputs":{},"bytes":53868},"packages/ui/react-ui-list/dist/lib/node/index.cjs":{"imports":[{"path":"@atlaskit/pragmatic-drag-and-drop/combine","kind":"import-statement","external":true},{"path":"@atlaskit/pragmatic-drag-and-drop/element/adapter","kind":"import-statement","external":true},{"path":"@atlaskit/pragmatic-drag-and-drop/element/set-custom-native-drag-preview","kind":"import-statement","external":true},{"path":"@atlaskit/pragmatic-drag-and-drop-hitbox/closest-edge","kind":"import-statement","external":true},{"path":"@radix-ui/react-context","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true},{"path":"react-dom","kind":"import-statement","external":true},{"path":"@dxos/invariant","kind":"import-statement","external":true},{"path":"@dxos/react-ui","kind":"import-statement","external":true},{"path":"@dxos/react-ui-theme","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true},{"path":"@dxos/react-ui-theme","kind":"import-statement","external":true},{"path":"@atlaskit/pragmatic-drag-and-drop/element/adapter","kind":"import-statement","external":true},{"path":"@atlaskit/pragmatic-drag-and-drop-hitbox/closest-edge","kind":"import-statement","external":true},{"path":"@atlaskit/pragmatic-drag-and-drop-hitbox/util/get-reorder-destination-index","kind":"import-statement","external":true},{"path":"@radix-ui/react-context","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true},{"path":"@dxos/react-ui","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true},{"path":"@dxos/debug","kind":"import-statement","external":true},{"path":"@atlaskit/pragmatic-drag-and-drop/combine","kind":"import-statement","external":true},{"path":"@atlaskit/pragmatic-drag-and-drop/element/adapter","kind":"import-statement","external":true},{"path":"@atlaskit/pragmatic-drag-and-drop-hitbox/tree-item","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true},{"path":"@dxos/echo-schema","kind":"import-statement","external":true},{"path":"@dxos/invariant","kind":"import-statement","external":true},{"path":"@dxos/react-ui","kind":"import-statement","external":true},{"path":"@dxos/react-ui-theme","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true},{"path":"@dxos/react-ui-theme","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true},{"path":"@dxos/react-ui","kind":"import-statement","external":true},{"path":"@dxos/react-ui-text-tooltip","kind":"import-statement","external":true},{"path":"@dxos/react-ui-theme","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true},{"path":"@dxos/react-ui","kind":"import-statement","external":true},{"path":"@dxos/react-ui-theme","kind":"import-statement","external":true}],"exports":["List","RawTreeItem","Tree","TreeDataSchema","TreeItem","TreeProvider","isTreeData","useTree"],"entryPoint":"packages/ui/react-ui-list/src/index.ts","inputs":{"packages/ui/react-ui-list/src/components/List/ListItem.tsx":{"bytesInOutput":6389},"packages/ui/react-ui-list/src/components/List/DropIndicator.tsx":{"bytesInOutput":1700},"packages/ui/react-ui-list/src/components/List/ListRoot.tsx":{"bytesInOutput":2177},"packages/ui/react-ui-list/src/components/List/List.tsx":{"bytesInOutput":245},"packages/ui/react-ui-list/src/components/List/index.ts":{"bytesInOutput":0},"packages/ui/react-ui-list/src/components/index.ts":{"bytesInOutput":0},"packages/ui/react-ui-list/src/components/Tree/Tree.tsx":{"bytesInOutput":1022},"packages/ui/react-ui-list/src/components/Tree/TreeContext.tsx":{"bytesInOutput":293},"packages/ui/react-ui-list/src/components/Tree/TreeItem.tsx":{"bytesInOutput":7829},"packages/ui/react-ui-list/src/components/Tree/DropIndicator.tsx":{"bytesInOutput":2170},"packages/ui/react-ui-list/src/components/Tree/TreeItemHeading.tsx":{"bytesInOutput":1822},"packages/ui/react-ui-list/src/components/Tree/TreeItemToggle.tsx":{"bytesInOutput":766},"packages/ui/react-ui-list/src/components/Tree/helpers.ts":{"bytesInOutput":162},"packages/ui/react-ui-list/src/components/Tree/index.ts":{"bytesInOutput":0},"packages/ui/react-ui-list/src/index.ts":{"bytesInOutput":0}},"bytes":25616}}}
|
|
1
|
+
{"inputs":{"packages/ui/react-ui-list/src/components/List/DropIndicator.tsx":{"bytes":7070,"imports":[{"path":"react","kind":"import-statement","external":true},{"path":"@dxos/react-ui-theme","kind":"import-statement","external":true}],"format":"esm"},"packages/ui/react-ui-list/src/components/List/ListRoot.tsx":{"bytes":10900,"imports":[{"path":"@atlaskit/pragmatic-drag-and-drop/element/adapter","kind":"import-statement","external":true},{"path":"@atlaskit/pragmatic-drag-and-drop-hitbox/closest-edge","kind":"import-statement","external":true},{"path":"@atlaskit/pragmatic-drag-and-drop-hitbox/util/get-reorder-destination-index","kind":"import-statement","external":true},{"path":"@radix-ui/react-context","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true},{"path":"packages/ui/react-ui-list/src/components/List/ListItem.tsx","kind":"import-statement","original":"./ListItem"}],"format":"esm"},"packages/ui/react-ui-list/src/components/List/ListItem.tsx":{"bytes":24128,"imports":[{"path":"@atlaskit/pragmatic-drag-and-drop/combine","kind":"import-statement","external":true},{"path":"@atlaskit/pragmatic-drag-and-drop/element/adapter","kind":"import-statement","external":true},{"path":"@atlaskit/pragmatic-drag-and-drop/element/set-custom-native-drag-preview","kind":"import-statement","external":true},{"path":"@atlaskit/pragmatic-drag-and-drop-hitbox/closest-edge","kind":"import-statement","external":true},{"path":"@radix-ui/react-context","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true},{"path":"react-dom","kind":"import-statement","external":true},{"path":"@dxos/invariant","kind":"import-statement","external":true},{"path":"@dxos/react-ui","kind":"import-statement","external":true},{"path":"@dxos/react-ui-theme","kind":"import-statement","external":true},{"path":"packages/ui/react-ui-list/src/components/List/DropIndicator.tsx","kind":"import-statement","original":"./DropIndicator"},{"path":"packages/ui/react-ui-list/src/components/List/ListRoot.tsx","kind":"import-statement","original":"./ListRoot"}],"format":"esm"},"packages/ui/react-ui-list/src/components/List/List.tsx":{"bytes":3478,"imports":[{"path":"packages/ui/react-ui-list/src/components/List/ListItem.tsx","kind":"import-statement","original":"./ListItem"},{"path":"packages/ui/react-ui-list/src/components/List/ListRoot.tsx","kind":"import-statement","original":"./ListRoot"}],"format":"esm"},"packages/ui/react-ui-list/src/components/List/index.ts":{"bytes":505,"imports":[{"path":"packages/ui/react-ui-list/src/components/List/List.tsx","kind":"import-statement","original":"./List"}],"format":"esm"},"packages/ui/react-ui-list/src/components/Tree/TreeContext.tsx":{"bytes":2214,"imports":[{"path":"react","kind":"import-statement","external":true},{"path":"@dxos/debug","kind":"import-statement","external":true}],"format":"esm"},"packages/ui/react-ui-list/src/components/Tree/DropIndicator.tsx":{"bytes":8689,"imports":[{"path":"react","kind":"import-statement","external":true},{"path":"@dxos/react-ui-theme","kind":"import-statement","external":true}],"format":"esm"},"packages/ui/react-ui-list/src/components/Tree/TreeItemHeading.tsx":{"bytes":7056,"imports":[{"path":"react","kind":"import-statement","external":true},{"path":"@dxos/react-ui","kind":"import-statement","external":true},{"path":"@dxos/react-ui-text-tooltip","kind":"import-statement","external":true},{"path":"@dxos/react-ui-theme","kind":"import-statement","external":true}],"format":"esm"},"packages/ui/react-ui-list/src/components/Tree/TreeItemToggle.tsx":{"bytes":3194,"imports":[{"path":"react","kind":"import-statement","external":true},{"path":"@dxos/react-ui","kind":"import-statement","external":true},{"path":"@dxos/react-ui-theme","kind":"import-statement","external":true}],"format":"esm"},"packages/ui/react-ui-list/src/components/Tree/helpers.ts":{"bytes":1223,"imports":[],"format":"esm"},"packages/ui/react-ui-list/src/components/Tree/TreeItem.tsx":{"bytes":31092,"imports":[{"path":"@atlaskit/pragmatic-drag-and-drop/combine","kind":"import-statement","external":true},{"path":"@atlaskit/pragmatic-drag-and-drop/element/adapter","kind":"import-statement","external":true},{"path":"@atlaskit/pragmatic-drag-and-drop-hitbox/tree-item","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true},{"path":"@dxos/echo-schema","kind":"import-statement","external":true},{"path":"@dxos/invariant","kind":"import-statement","external":true},{"path":"@dxos/react-ui","kind":"import-statement","external":true},{"path":"@dxos/react-ui-theme","kind":"import-statement","external":true},{"path":"packages/ui/react-ui-list/src/components/Tree/DropIndicator.tsx","kind":"import-statement","original":"./DropIndicator"},{"path":"packages/ui/react-ui-list/src/components/Tree/TreeContext.tsx","kind":"import-statement","original":"./TreeContext"},{"path":"packages/ui/react-ui-list/src/components/Tree/TreeItemHeading.tsx","kind":"import-statement","original":"./TreeItemHeading"},{"path":"packages/ui/react-ui-list/src/components/Tree/TreeItemToggle.tsx","kind":"import-statement","original":"./TreeItemToggle"},{"path":"packages/ui/react-ui-list/src/components/Tree/helpers.ts","kind":"import-statement","original":"./helpers"}],"format":"esm"},"packages/ui/react-ui-list/src/components/Tree/Tree.tsx":{"bytes":5361,"imports":[{"path":"react","kind":"import-statement","external":true},{"path":"@dxos/react-ui","kind":"import-statement","external":true},{"path":"packages/ui/react-ui-list/src/components/Tree/TreeContext.tsx","kind":"import-statement","original":"./TreeContext"},{"path":"packages/ui/react-ui-list/src/components/Tree/TreeItem.tsx","kind":"import-statement","original":"./TreeItem"}],"format":"esm"},"packages/ui/react-ui-list/src/components/Tree/index.ts":{"bytes":692,"imports":[{"path":"packages/ui/react-ui-list/src/components/Tree/Tree.tsx","kind":"import-statement","original":"./Tree"},{"path":"packages/ui/react-ui-list/src/components/Tree/TreeContext.tsx","kind":"import-statement","original":"./TreeContext"},{"path":"packages/ui/react-ui-list/src/components/Tree/TreeItem.tsx","kind":"import-statement","original":"./TreeItem"}],"format":"esm"},"packages/ui/react-ui-list/src/components/index.ts":{"bytes":580,"imports":[{"path":"packages/ui/react-ui-list/src/components/List/index.ts","kind":"import-statement","original":"./List"},{"path":"packages/ui/react-ui-list/src/components/Tree/index.ts","kind":"import-statement","original":"./Tree"}],"format":"esm"},"packages/ui/react-ui-list/src/index.ts":{"bytes":503,"imports":[{"path":"packages/ui/react-ui-list/src/components/index.ts","kind":"import-statement","original":"./components"}],"format":"esm"}},"outputs":{"packages/ui/react-ui-list/dist/lib/node/index.cjs.map":{"imports":[],"exports":[],"inputs":{},"bytes":53345},"packages/ui/react-ui-list/dist/lib/node/index.cjs":{"imports":[{"path":"@atlaskit/pragmatic-drag-and-drop/combine","kind":"import-statement","external":true},{"path":"@atlaskit/pragmatic-drag-and-drop/element/adapter","kind":"import-statement","external":true},{"path":"@atlaskit/pragmatic-drag-and-drop/element/set-custom-native-drag-preview","kind":"import-statement","external":true},{"path":"@atlaskit/pragmatic-drag-and-drop-hitbox/closest-edge","kind":"import-statement","external":true},{"path":"@radix-ui/react-context","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true},{"path":"react-dom","kind":"import-statement","external":true},{"path":"@dxos/invariant","kind":"import-statement","external":true},{"path":"@dxos/react-ui","kind":"import-statement","external":true},{"path":"@dxos/react-ui-theme","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true},{"path":"@dxos/react-ui-theme","kind":"import-statement","external":true},{"path":"@atlaskit/pragmatic-drag-and-drop/element/adapter","kind":"import-statement","external":true},{"path":"@atlaskit/pragmatic-drag-and-drop-hitbox/closest-edge","kind":"import-statement","external":true},{"path":"@atlaskit/pragmatic-drag-and-drop-hitbox/util/get-reorder-destination-index","kind":"import-statement","external":true},{"path":"@radix-ui/react-context","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true},{"path":"@dxos/react-ui","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true},{"path":"@dxos/debug","kind":"import-statement","external":true},{"path":"@atlaskit/pragmatic-drag-and-drop/combine","kind":"import-statement","external":true},{"path":"@atlaskit/pragmatic-drag-and-drop/element/adapter","kind":"import-statement","external":true},{"path":"@atlaskit/pragmatic-drag-and-drop-hitbox/tree-item","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true},{"path":"@dxos/echo-schema","kind":"import-statement","external":true},{"path":"@dxos/invariant","kind":"import-statement","external":true},{"path":"@dxos/react-ui","kind":"import-statement","external":true},{"path":"@dxos/react-ui-theme","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true},{"path":"@dxos/react-ui-theme","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true},{"path":"@dxos/react-ui","kind":"import-statement","external":true},{"path":"@dxos/react-ui-text-tooltip","kind":"import-statement","external":true},{"path":"@dxos/react-ui-theme","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true},{"path":"@dxos/react-ui","kind":"import-statement","external":true},{"path":"@dxos/react-ui-theme","kind":"import-statement","external":true}],"exports":["List","RawTreeItem","Tree","TreeDataSchema","TreeItem","TreeProvider","isTreeData","useTree"],"entryPoint":"packages/ui/react-ui-list/src/index.ts","inputs":{"packages/ui/react-ui-list/src/components/List/ListItem.tsx":{"bytesInOutput":6389},"packages/ui/react-ui-list/src/components/List/DropIndicator.tsx":{"bytesInOutput":1700},"packages/ui/react-ui-list/src/components/List/ListRoot.tsx":{"bytesInOutput":2177},"packages/ui/react-ui-list/src/components/List/List.tsx":{"bytesInOutput":245},"packages/ui/react-ui-list/src/components/List/index.ts":{"bytesInOutput":0},"packages/ui/react-ui-list/src/components/index.ts":{"bytesInOutput":0},"packages/ui/react-ui-list/src/components/Tree/Tree.tsx":{"bytesInOutput":1022},"packages/ui/react-ui-list/src/components/Tree/TreeContext.tsx":{"bytesInOutput":293},"packages/ui/react-ui-list/src/components/Tree/TreeItem.tsx":{"bytesInOutput":7789},"packages/ui/react-ui-list/src/components/Tree/DropIndicator.tsx":{"bytesInOutput":2170},"packages/ui/react-ui-list/src/components/Tree/TreeItemHeading.tsx":{"bytesInOutput":1675},"packages/ui/react-ui-list/src/components/Tree/TreeItemToggle.tsx":{"bytesInOutput":766},"packages/ui/react-ui-list/src/components/Tree/helpers.ts":{"bytesInOutput":162},"packages/ui/react-ui-list/src/components/Tree/index.ts":{"bytesInOutput":0},"packages/ui/react-ui-list/src/index.ts":{"bytesInOutput":0}},"bytes":25429}}}
|
|
@@ -386,16 +386,11 @@ import { TextTooltip } from "@dxos/react-ui-text-tooltip";
|
|
|
386
386
|
import { mx as mx4 } from "@dxos/react-ui-theme";
|
|
387
387
|
var TreeItemHeading = /* @__PURE__ */ memo(/* @__PURE__ */ forwardRef2(({ label, icon, className, disabled, current, onSelect }, forwardedRef) => {
|
|
388
388
|
const { t } = useTranslation();
|
|
389
|
-
const handleSelect = useCallback2((event) => {
|
|
390
|
-
onSelect?.(event.altKey);
|
|
391
|
-
}, [
|
|
392
|
-
onSelect
|
|
393
|
-
]);
|
|
394
389
|
const handleButtonKeydown = useCallback2((event) => {
|
|
395
390
|
if (event.key === " " || event.key === "Enter") {
|
|
396
391
|
event.preventDefault();
|
|
397
392
|
event.stopPropagation();
|
|
398
|
-
onSelect?.(
|
|
393
|
+
onSelect?.();
|
|
399
394
|
}
|
|
400
395
|
}, [
|
|
401
396
|
onSelect
|
|
@@ -413,7 +408,7 @@ var TreeItemHeading = /* @__PURE__ */ memo(/* @__PURE__ */ forwardRef2(({ label,
|
|
|
413
408
|
density: "fine",
|
|
414
409
|
classNames: mx4("grow gap-2 !pis-0.5 hover:!bg-transparent dark:hover:!bg-transparent", "disabled:!cursor-default disabled:!opacity-100", className),
|
|
415
410
|
disabled,
|
|
416
|
-
onClick:
|
|
411
|
+
onClick: onSelect,
|
|
417
412
|
onKeyDown: handleButtonKeydown,
|
|
418
413
|
...current && {
|
|
419
414
|
"aria-current": "location"
|
|
@@ -423,8 +418,7 @@ var TreeItemHeading = /* @__PURE__ */ memo(/* @__PURE__ */ forwardRef2(({ label,
|
|
|
423
418
|
size: 4,
|
|
424
419
|
classNames: "is-[1em] bs-[1em] mlb-1"
|
|
425
420
|
}), /* @__PURE__ */ React5.createElement("span", {
|
|
426
|
-
className: "flex-1 is-0 truncate text-start text-sm font-normal"
|
|
427
|
-
"data-tooltip": true
|
|
421
|
+
className: "flex-1 is-0 truncate text-start text-sm font-normal"
|
|
428
422
|
}, toLocalizedString(label, t))));
|
|
429
423
|
}));
|
|
430
424
|
|
|
@@ -610,13 +604,12 @@ var RawTreeItem = ({ item, path: _path, last, draggable: draggable2, renderColum
|
|
|
610
604
|
path,
|
|
611
605
|
open
|
|
612
606
|
]);
|
|
613
|
-
const handleSelect = useCallback3((
|
|
607
|
+
const handleSelect = useCallback3(() => {
|
|
614
608
|
rowRef.current?.focus();
|
|
615
609
|
onSelect?.({
|
|
616
610
|
item,
|
|
617
611
|
path,
|
|
618
|
-
current: !current
|
|
619
|
-
option
|
|
612
|
+
current: !current
|
|
620
613
|
});
|
|
621
614
|
}, [
|
|
622
615
|
onSelect,
|
|
@@ -633,7 +626,7 @@ var RawTreeItem = ({ item, path: _path, last, draggable: draggable2, renderColum
|
|
|
633
626
|
isBranch && open && handleOpenChange();
|
|
634
627
|
break;
|
|
635
628
|
case " ":
|
|
636
|
-
handleSelect(
|
|
629
|
+
handleSelect();
|
|
637
630
|
break;
|
|
638
631
|
}
|
|
639
632
|
}, [
|