@dxos/react-ui-stack 0.6.12-main.ed7cda7 → 0.6.12-staging.0b4bb48
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 +4 -6
- package/dist/lib/browser/index.mjs.map +3 -3
- package/dist/lib/browser/meta.json +1 -1
- package/dist/lib/node/index.cjs +3 -5
- package/dist/lib/node/index.cjs.map +3 -3
- package/dist/lib/node/meta.json +1 -1
- package/dist/types/src/components/CaretDownUp.d.ts.map +1 -1
- package/dist/types/src/components/Deck.stories.d.ts.map +1 -1
- package/dist/types/src/components/Section.d.ts +3 -2
- package/dist/types/src/components/Section.d.ts.map +1 -1
- package/dist/types/src/playwright/playwright.config.d.ts +2 -2
- package/dist/types/src/playwright/playwright.config.d.ts.map +1 -1
- package/dist/types/src/testing/TableContent.d.ts.map +1 -1
- package/package.json +21 -24
- package/src/components/CaretDownUp.tsx +0 -1
- package/src/components/Deck.stories.tsx +16 -6
- package/src/components/Section.tsx +13 -6
- package/src/playwright/playwright.config.ts +2 -13
- package/src/playwright/smoke.spec.ts +19 -11
- package/src/testing/TableContent.tsx +0 -1
- package/dist/lib/node-esm/index.mjs +0 -379
- package/dist/lib/node-esm/index.mjs.map +0 -7
- package/dist/lib/node-esm/meta.json +0 -1
- package/dist/lib/node-esm/testing/index.mjs +0 -161
- package/dist/lib/node-esm/testing/index.mjs.map +0 -7
|
@@ -8,10 +8,10 @@ import { dropRingInner } from "@dxos/react-ui-theme";
|
|
|
8
8
|
|
|
9
9
|
// packages/ui/react-ui-stack/src/components/Section.tsx
|
|
10
10
|
import { useFocusableGroup, useTabsterAttributes } from "@fluentui/react-tabster";
|
|
11
|
-
import { ArrowLineDown, ArrowLineUp, ArrowSquareOut, CaretUpDown, Trash } from "@phosphor-icons/react";
|
|
11
|
+
import { ArrowLineDown, ArrowLineUp, ArrowSquareOut, CaretUpDown, DotsNine, Trash } from "@phosphor-icons/react";
|
|
12
12
|
import * as CollapsiblePrimitive from "@radix-ui/react-collapsible";
|
|
13
13
|
import React2, { forwardRef, useState } from "react";
|
|
14
|
-
import { Button, DropdownMenu,
|
|
14
|
+
import { Button, DropdownMenu, List, ListItem, ScrollArea, Toolbar, toLocalizedString, useTranslation } from "@dxos/react-ui";
|
|
15
15
|
import { createAttendableAttributes, useHasAttention } from "@dxos/react-ui-attention";
|
|
16
16
|
import { DropDownMenuDragHandleTrigger, resizeHandle, resizeHandleHorizontal } from "@dxos/react-ui-deck";
|
|
17
17
|
import { useMosaic } from "@dxos/react-ui-mosaic";
|
|
@@ -70,7 +70,7 @@ var translations_default = [
|
|
|
70
70
|
// packages/ui/react-ui-stack/src/components/Section.tsx
|
|
71
71
|
var sectionActionDimensions = "p-1 shrink-0 min-bs-0 is-[--rail-action] bs-min";
|
|
72
72
|
var resizeHandleStyles = mx(resizeHandle, resizeHandleHorizontal, "is-full bs-[--rail-action] col-start-2");
|
|
73
|
-
var Section = /* @__PURE__ */ forwardRef(({ id, title, icon =
|
|
73
|
+
var Section = /* @__PURE__ */ forwardRef(({ id, title, icon: Icon = DotsNine, size = "intrinsic", collapsed, active, isResizable, draggableProps, draggableStyle, onDelete, onNavigate, onAddBefore, onAddAfter, onCollapseSection, children }, forwardedRef) => {
|
|
74
74
|
const { t } = useTranslation(translationKey);
|
|
75
75
|
const [optionsMenuOpen, setOptionsMenuOpen] = useState(false);
|
|
76
76
|
const sectionActionsToolbar = useTabsterAttributes({
|
|
@@ -122,9 +122,7 @@ var Section = /* @__PURE__ */ forwardRef(({ id, title, icon = "phosphor--placeho
|
|
|
122
122
|
classNames: "m-0",
|
|
123
123
|
...draggableProps
|
|
124
124
|
}, /* @__PURE__ */ React2.createElement(Icon, {
|
|
125
|
-
|
|
126
|
-
size: 5,
|
|
127
|
-
classNames: "transition-opacity"
|
|
125
|
+
className: mx(getSize(5), "transition-opacity")
|
|
128
126
|
})), /* @__PURE__ */ React2.createElement(DropdownMenu.Portal, null, /* @__PURE__ */ React2.createElement(DropdownMenu.Content, null, /* @__PURE__ */ React2.createElement(DropdownMenu.Viewport, null, collapsed ? /* @__PURE__ */ React2.createElement(DropdownMenu.Item, {
|
|
129
127
|
onClick: onNavigate,
|
|
130
128
|
"data-testid": "section.navigate-to"
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../src/components/Stack.tsx", "../../../src/components/Section.tsx", "../../../src/components/CaretDownUp.tsx", "../../../src/components/style-fragments.ts", "../../../src/translations.ts"],
|
|
4
|
-
"sourcesContent": ["//\n// Copyright 2023 DXOS.org\n//\n\nimport { useArrowNavigationGroup, useFocusableGroup } from '@fluentui/react-tabster';\nimport React, { forwardRef, useCallback } from 'react';\nimport { useResizeDetector } from 'react-resize-detector';\n\nimport { List, useTranslation } from '@dxos/react-ui';\nimport {\n type MosaicContainerProps,\n type MosaicTileComponent,\n Mosaic,\n Path,\n useContainer,\n useItemsWithPreview,\n useMosaic,\n} from '@dxos/react-ui-mosaic';\nimport { dropRingInner } from '@dxos/react-ui-theme';\n\nimport {\n type CollapsedSections,\n type AddSectionPosition,\n SectionTile,\n type StackContextValue,\n type StackItem,\n type StackSectionContent,\n type StackSectionItem,\n} from './Section';\nimport { stackColumns } from './style-fragments';\nimport { translationKey } from '../translations';\n\nexport type Direction = 'horizontal' | 'vertical';\n\nexport type { CollapsedSections, AddSectionPosition };\n\nexport const DEFAULT_TYPE = 'stack-section';\n\nexport type StackProps<TData extends StackSectionContent = StackSectionContent> = Omit<\n MosaicContainerProps<TData, number>,\n 'debug' | 'Component'\n> &\n Omit<StackContextValue<TData>, 'setCollapsedSections'> & {\n items?: StackSectionItem[];\n separation?: boolean; // TODO(burdon): Style.\n onCollapseSection?: (id: string, collapsed: boolean) => void;\n emptyComponent?: React.ReactNode;\n };\n\nexport const Stack = ({\n id,\n type = DEFAULT_TYPE,\n SectionContent,\n items = [],\n separation = true,\n transform,\n onOver,\n onDrop,\n onAddSection,\n onDeleteSection,\n onNavigateToSection,\n onCollapseSection,\n ...props\n}: StackProps) => {\n const { ref: containerRef, width = 0 } = useResizeDetector<HTMLDivElement>({ refreshRate: 200 });\n const { operation, overItem } = useMosaic();\n const itemsWithPreview = useItemsWithPreview({ path: id, items });\n\n const getOverlayStyle = useCallback(() => ({ width }), [width]);\n const getOverlayProps = useCallback(\n () => ({ itemContext: { transform, SectionContent } }),\n [transform, SectionContent],\n );\n\n // TODO(thure): The root cause of the discrepancy between `activeNodeRect.top` and `overlayNodeRect.top` in Composer\n // in particular is not yet known, so this solution may may backfire in unforeseeable cases.\n const stackModifier = useCallback<Exclude<MosaicContainerProps['modifier'], undefined>>(\n (_activeItem, { transform, activeNodeRect, overlayNodeRect }) => {\n if (activeNodeRect && overlayNodeRect) {\n transform.y += activeNodeRect?.top - overlayNodeRect?.top;\n }\n return transform;\n },\n [],\n );\n\n return (\n <Mosaic.Container\n {...{\n id,\n type,\n Component: SectionTile as MosaicTileComponent<StackSectionItem, HTMLDivElement>,\n getOverlayStyle,\n getOverlayProps,\n onOver,\n onDrop,\n modifier: stackModifier,\n }}\n >\n <Mosaic.DroppableTile\n path={id}\n type={type}\n item={{ id, items: itemsWithPreview }}\n // TODO(wittjosiah): Should this actually be a context?\n itemContext={{\n separation,\n transform,\n onDeleteSection,\n onNavigateToSection,\n onAddSection,\n onCollapseSection,\n SectionContent,\n }}\n isOver={\n overItem &&\n !!overItem.path &&\n Path.hasRoot(overItem.path, id) &&\n (operation === 'copy' || operation === 'transfer')\n }\n Component={StackTile}\n {...props}\n ref={containerRef}\n />\n </Mosaic.Container>\n );\n};\n\nconst StackTile: MosaicTileComponent<StackItem, HTMLOListElement, Pick<StackProps, 'emptyComponent'>> = forwardRef(\n ({ classNames, path, isOver, item: { items }, itemContext, type: _type, emptyComponent, ...props }, forwardedRef) => {\n const { t } = useTranslation(translationKey);\n const { Component, type } = useContainer();\n const domAttributes = useArrowNavigationGroup({ axis: 'grid' });\n const { activeItem } = useMosaic();\n\n // NOTE(thure): Ensure “groupper” is available, but no need to use it here.\n const _group = useFocusableGroup();\n\n // NOTE: Keep outer padding the same as MarkdownMain.\n return (\n <List\n ref={forwardedRef}\n classNames={['grid relative', stackColumns, isOver && dropRingInner, classNames]}\n {...(!activeItem && domAttributes)}\n {...props}\n >\n {items.length > 0 ? (\n <Mosaic.SortableContext items={items} direction='vertical'>\n {items.map((item, index) => (\n <Mosaic.SortableTile\n key={item.id}\n item={item}\n itemContext={itemContext}\n path={path}\n type={type}\n position={index}\n Component={Component}\n />\n ))}\n </Mosaic.SortableContext>\n ) : emptyComponent !== undefined ? (\n <>{emptyComponent}</>\n ) : (\n <p\n className='grid col-span-2 text-center p-4 border border-dashed border-neutral-500/50 rounded'\n data-testid='stack.empty'\n >\n {t('empty stack message')}\n </p>\n )}\n </List>\n );\n },\n);\n", "//\n// Copyright 2023 DXOS.org\n//\n\nimport { useFocusableGroup, useTabsterAttributes } from '@fluentui/react-tabster';\nimport { ArrowLineDown, ArrowLineUp, ArrowSquareOut, CaretUpDown, Trash } from '@phosphor-icons/react';\nimport * as CollapsiblePrimitive from '@radix-ui/react-collapsible';\nimport React, {\n forwardRef,\n useState,\n type ForwardRefExoticComponent,\n type RefAttributes,\n type FC,\n type PropsWithChildren,\n type ComponentPropsWithRef,\n} from 'react';\n\nimport {\n Button,\n DropdownMenu,\n Icon,\n type Label,\n List,\n ListItem,\n ScrollArea,\n type ThemedClassName,\n Toolbar,\n toLocalizedString,\n useTranslation,\n} from '@dxos/react-ui';\nimport { createAttendableAttributes, useHasAttention } from '@dxos/react-ui-attention';\nimport { DropDownMenuDragHandleTrigger, resizeHandle, resizeHandleHorizontal } from '@dxos/react-ui-deck';\nimport {\n type MosaicActiveType,\n type MosaicDataItem,\n type MosaicTileComponent,\n type MosaicTileProps,\n useMosaic,\n} from '@dxos/react-ui-mosaic';\nimport {\n focusRing,\n getSize,\n hoverableControlItem,\n hoverableControls,\n hoverableFocusedWithinControls,\n mx,\n} from '@dxos/react-ui-theme';\n\nimport { CaretDownUp } from './CaretDownUp';\nimport { stackColumns } from './style-fragments';\nimport { translationKey } from '../translations';\n\nconst sectionActionDimensions = 'p-1 shrink-0 min-bs-0 is-[--rail-action] bs-min';\n\nexport type StackSectionContent = MosaicDataItem;\n\nexport type CollapsedSections = Record<string, boolean>;\n\nexport type AddSectionPosition = 'before' | 'after' | 'beforeAll' | 'afterAll';\n\nexport type StackContextValue<TData extends StackSectionContent = StackSectionContent> = {\n SectionContent: FC<{ data: TData }>;\n separation?: boolean;\n isResizable?: boolean;\n transform?: (item: MosaicDataItem, type?: string) => StackSectionItem;\n onDeleteSection?: (path: string) => void;\n onAddSection?: (path: string, position: AddSectionPosition) => void;\n onNavigateToSection?: (object: MosaicDataItem) => void;\n onCollapseSection?: (id: string, collapsed: boolean) => void;\n};\n\nexport type StackItem = MosaicDataItem & {\n items: StackSectionItem[];\n};\n\nexport type StackSectionItem = MosaicDataItem & {\n object: StackSectionContent;\n // TODO(wittjosiah): Use effect schema? Share schema with echo.\n view?: {\n title?: string;\n size?: SectionSize;\n height?: number;\n collapsed?: boolean;\n custom?: Record<string, any>;\n };\n // TODO(wittjosiah): Common type? Factor out?\n metadata?: {\n icon?: string;\n placeholder?: Label;\n viewActions?: (item: StackSectionItem) => StackAction;\n };\n};\n\nexport type StackAction = {\n icon: string;\n label: Label;\n onClick: () => void;\n};\n\nexport type SectionSize = 'intrinsic' | 'extrinsic';\n\nexport type SectionProps = PropsWithChildren<\n {\n // Data props.\n id: string;\n title: string;\n\n // Tile props.\n active?: MosaicActiveType;\n } & Pick<\n MosaicTileProps,\n 'draggableProps' | 'draggableStyle' | 'onDelete' | 'onNavigate' | 'onAddAfter' | 'onAddBefore'\n > &\n Pick<StackContextValue, 'separation' | 'isResizable' | 'onCollapseSection'> &\n Pick<Required<StackSectionItem>['view'], 'collapsed' | 'size'> &\n Pick<Required<StackSectionItem>['metadata'], 'icon'>\n>;\n\nconst resizeHandleStyles = mx(resizeHandle, resizeHandleHorizontal, 'is-full bs-[--rail-action] col-start-2');\n\nexport const Section: ForwardRefExoticComponent<SectionProps & RefAttributes<HTMLLIElement>> = forwardRef<\n HTMLLIElement,\n SectionProps\n>(\n (\n {\n id,\n title,\n icon = 'phosphor--placeholder--regular',\n size = 'intrinsic',\n collapsed,\n active,\n isResizable,\n draggableProps,\n draggableStyle,\n onDelete,\n onNavigate,\n onAddBefore,\n onAddAfter,\n onCollapseSection,\n children,\n },\n forwardedRef,\n ) => {\n const { t } = useTranslation(translationKey);\n const [optionsMenuOpen, setOptionsMenuOpen] = useState(false);\n const sectionActionsToolbar = useTabsterAttributes({\n groupper: {},\n focusable: {},\n mover: { cyclic: true, direction: 1, memorizeCurrent: false },\n });\n const sectionContentGroup = useFocusableGroup({});\n const attendableAttrs = createAttendableAttributes(id);\n const hasAttention = useHasAttention(id);\n\n return (\n <CollapsiblePrimitive.Root\n asChild\n open={!collapsed}\n onOpenChange={(nextOpen) => onCollapseSection?.(id, !nextOpen)}\n >\n <ListItem.Root\n ref={forwardedRef}\n id={id}\n {...attendableAttrs}\n classNames={[\n 'grid col-span-2 group/section',\n active === 'overlay' ? stackColumns : 'grid-cols-subgrid snap-start',\n ]}\n style={draggableStyle}\n >\n <div\n role='none'\n className={mx(\n 'grid col-span-2 grid-cols-subgrid',\n 'bg-base focus-within:border-separator focus-within:attention-within',\n hoverableControls,\n hoverableFocusedWithinControls,\n (active || hasAttention) && 'attention-surface border-separator',\n (active === 'origin' || active === 'rearrange' || active === 'destination') && 'opacity-0',\n )}\n >\n <div\n role='toolbar'\n aria-orientation='vertical'\n aria-label={t('section controls label')}\n {...(!active && { tabIndex: 0 })}\n {...(!active && sectionActionsToolbar)}\n className={mx(\n 'grid grid-cols-subgrid ch-focus-ring rounded-sm grid-rows-[min-content_min-content_1fr] m-1',\n 'group-has-[[role=toolbar][aria-orientation=horizontal]]/section:pbs-[--rail-action]',\n )}\n >\n <div role='none' className='sticky -block-start-px bg-[--sticky-bg]'>\n <DropdownMenu.Root\n {...{\n open: optionsMenuOpen,\n onOpenChange: setOptionsMenuOpen,\n }}\n >\n <DropDownMenuDragHandleTrigger active={!!active} variant='ghost' classNames='m-0' {...draggableProps}>\n <Icon icon={icon} size={5} classNames='transition-opacity' />\n </DropDownMenuDragHandleTrigger>\n <DropdownMenu.Portal>\n <DropdownMenu.Content>\n <DropdownMenu.Viewport>\n {collapsed ? (\n <DropdownMenu.Item onClick={onNavigate} data-testid='section.navigate-to'>\n <ArrowSquareOut className={mx(getSize(5), 'mr-2')} />\n <span className='grow'>{t('navigate to section label')}</span>\n </DropdownMenu.Item>\n ) : (\n <CollapsiblePrimitive.Trigger asChild>\n <DropdownMenu.Item>\n <CaretDownUp className={mx(getSize(5), 'mr-2')} />\n <span className='grow'>{t('collapse label')}</span>\n </DropdownMenu.Item>\n </CollapsiblePrimitive.Trigger>\n )}\n <DropdownMenu.Item onClick={onAddBefore} data-testid='section.add-before'>\n <ArrowLineUp className={mx(getSize(5), 'mr-2')} />\n <span className='grow'>{t('add section before label')}</span>\n </DropdownMenu.Item>\n <DropdownMenu.Item onClick={onAddAfter} data-testid='section.add-after'>\n <ArrowLineDown className={mx(getSize(5), 'mr-2')} />\n <span className='grow'>{t('add section after label')}</span>\n </DropdownMenu.Item>\n <DropdownMenu.Item onClick={() => onDelete?.()} data-testid='section.remove'>\n <Trash className={mx(getSize(5), 'mr-2')} />\n <span className='grow'>{t('remove section label')}</span>\n </DropdownMenu.Item>\n </DropdownMenu.Viewport>\n <DropdownMenu.Arrow />\n </DropdownMenu.Content>\n </DropdownMenu.Portal>\n </DropdownMenu.Root>\n {collapsed ? (\n <CollapsiblePrimitive.Trigger asChild>\n <Button variant='ghost' classNames={sectionActionDimensions}>\n <span className='sr-only'>{t('expand label')}</span>\n <CaretUpDown className={getSize(4)} />\n </Button>\n </CollapsiblePrimitive.Trigger>\n ) : (\n <Button\n variant='ghost'\n classNames={sectionActionDimensions}\n onClick={onNavigate}\n data-testid='section.navigate-to'\n >\n <ArrowSquareOut className={mx(getSize(4))} />\n <span className='sr-only'>{t('navigate to section label')}</span>\n </Button>\n )}\n </div>\n </div>\n\n {/* Main content */}\n\n <ListItem.Heading\n classNames={collapsed ? ['grid grid-rows-subgrid grid-cols-subgrid items-center', focusRing] : 'sr-only'}\n {...(collapsed && { ...sectionContentGroup, tabIndex: 0 })}\n >\n {/*\n TODO(thure): This needs to be made extensible; Markdown document titles especially are difficult.\n Using `Surface` in a UI package like this would be unprecedented and needs motivation.\n Refactoring to use subcomponents is complicated by sections being a sortable Mosaic Tile.\n Reevaluate when work on collections (Folders, Stacks, etc) settles.\n */}\n <span className='truncate'>{title}</span>\n </ListItem.Heading>\n {size === 'intrinsic' ? (\n <CollapsiblePrimitive.Content\n {...(!collapsed && {\n ...sectionContentGroup,\n tabIndex: 0,\n })}\n // TODO(burdon): Add margin to fragment?\n className={mx(focusRing, 'm-[2px]')}\n >\n {children}\n </CollapsiblePrimitive.Content>\n ) : (\n <CollapsiblePrimitive.Content asChild>\n <ScrollArea.Root\n type='always'\n {...(!collapsed && { ...sectionContentGroup, tabIndex: 0 })}\n classNames={mx(focusRing, 'is-full has-[[data-radix-scroll-area-viewport]]:pbe-4')}\n >\n <ScrollArea.Viewport>{children}</ScrollArea.Viewport>\n <ScrollArea.Scrollbar\n orientation='horizontal'\n variant='coarse'\n classNames='hidden has-[div]:flex !inline-end-[max(.25rem,var(--radix-scroll-area-corner-width))]'\n >\n <ScrollArea.Thumb />\n </ScrollArea.Scrollbar>\n <ScrollArea.Scrollbar orientation='vertical' variant='coarse' classNames='hidden has-[div]:flex'>\n <ScrollArea.Thumb />\n </ScrollArea.Scrollbar>\n <ScrollArea.Corner />\n </ScrollArea.Root>\n </CollapsiblePrimitive.Content>\n )}\n </div>\n {isResizable && !collapsed && (\n <button className={resizeHandleStyles}>\n <span className='sr-only'>{t('resize section label')}</span>\n </button>\n )}\n </ListItem.Root>\n </CollapsiblePrimitive.Root>\n );\n },\n);\n\nexport type SectionToolbarProps = ThemedClassName<ComponentPropsWithRef<'div'>>;\n\n// TODO(burdon): block-start\nexport const sectionToolbarLayout =\n 'bs-[--rail-action] bg-[--sticky-bg] sticky block-start-0 __-block-start-px transition-opacity';\n\nexport const SectionToolbar = ({ children, classNames }: SectionToolbarProps) => {\n return (\n <Toolbar.Root orientation='horizontal' classNames={[sectionToolbarLayout, hoverableControlItem, classNames]}>\n {children}\n </Toolbar.Root>\n );\n};\n\nexport const SectionTile: MosaicTileComponent<\n StackSectionItem,\n HTMLLIElement\n // TODO(wittjosiah): If props is specified there is a type error with Mosaic.Container.\n // { itemContext: StackContextValue }\n> = forwardRef(({ path, type, active, draggableStyle, draggableProps, item, itemContext }, forwardedRef) => {\n const { t } = useTranslation(translationKey);\n const { activeItem } = useMosaic();\n\n const separation = !!itemContext?.separation;\n const isResizable = !!itemContext?.isResizable;\n const { transform, onDeleteSection, onNavigateToSection, onAddSection, onCollapseSection, SectionContent } =\n itemContext as StackContextValue;\n\n const transformedItem = transform\n ? transform(\n item,\n // TODO(wittjosiah): `active` doesn't always seem to be accurate here.\n activeItem?.item.id === item.id ? activeItem?.type : type,\n )\n : item;\n\n const placeholder = transformedItem.metadata?.placeholder ?? ['untitled section title', { ns: translationKey }];\n const title = transformedItem.view?.title ?? toLocalizedString(placeholder, t);\n\n const section = (\n <Section\n ref={forwardedRef}\n title={title}\n id={transformedItem.id}\n size={transformedItem.view?.size}\n icon={transformedItem.metadata?.icon}\n collapsed={transformedItem.view?.collapsed}\n separation={separation}\n active={active}\n draggableProps={draggableProps}\n draggableStyle={draggableStyle}\n onCollapseSection={onCollapseSection}\n isResizable={isResizable}\n onDelete={() => onDeleteSection?.(path)}\n onNavigate={() => onNavigateToSection?.(transformedItem)}\n onAddAfter={() => onAddSection?.(path, 'after')}\n onAddBefore={() => onAddSection?.(path, 'before')}\n >\n {SectionContent && <SectionContent data={transformedItem.object} />}\n </Section>\n );\n\n return active === 'overlay' ? <List>{section}</List> : section;\n});\n", "//\n// Copyright 2024 DXOS.org\n//\n\nimport { type IconProps } from '@phosphor-icons/react';\nimport React from 'react';\n\nexport const CaretDownUp = ({ children, weight, ...props }: IconProps) => {\n return (\n <svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 256 256' {...props}>\n <rect width='256' height='256' fill='none' />\n <polyline\n points='80 224 128 176 176 224'\n fill='none'\n stroke='currentColor'\n strokeLinecap='round'\n strokeLinejoin='round'\n strokeWidth='16'\n />\n <polyline\n points='80 32 128 80 176 32'\n fill='none'\n stroke='currentColor'\n strokeLinecap='round'\n strokeLinejoin='round'\n strokeWidth='16'\n />\n {children}\n </svg>\n );\n};\n", "//\n// Copyright 2024 DXOS.org\n//\n\nexport const stackColumns = 'grid-cols-[var(--rail-size)_calc(100%-var(--rail-size))]';\n", "//\n// Copyright 2023 DXOS.org\n//\n\nexport const translationKey = 'stack';\n\nexport default [\n {\n 'en-US': {\n [translationKey]: {\n 'empty stack message': 'Drag items into the stack.',\n 'remove section label': 'Delete',\n 'navigate to section label': 'Navigate to item',\n 'untitled section title': 'Untitled section',\n 'add section before label': 'Add before',\n 'add section after label': 'Add after',\n 'expand label': 'Expand',\n 'collapse label': 'Collapse',\n },\n },\n },\n];\n"],
|
|
5
|
-
"mappings": ";AAIA,SAASA,yBAAyBC,qBAAAA,0BAAyB;AAC3D,OAAOC,UAASC,cAAAA,aAAYC,mBAAmB;AAC/C,SAASC,yBAAyB;AAElC,SAASC,QAAAA,OAAMC,kBAAAA,uBAAsB;AACrC,SAGEC,QACAC,MACAC,cACAC,qBACAC,aAAAA,kBACK;AACP,SAASC,qBAAqB;;;ACd9B,SAASC,mBAAmBC,4BAA4B;AACxD,
|
|
6
|
-
"names": ["useArrowNavigationGroup", "useFocusableGroup", "React", "forwardRef", "useCallback", "useResizeDetector", "List", "useTranslation", "Mosaic", "Path", "useContainer", "useItemsWithPreview", "useMosaic", "dropRingInner", "useFocusableGroup", "useTabsterAttributes", "ArrowLineDown", "ArrowLineUp", "ArrowSquareOut", "CaretUpDown", "Trash", "CollapsiblePrimitive", "React", "forwardRef", "useState", "Button", "DropdownMenu", "
|
|
4
|
+
"sourcesContent": ["//\n// Copyright 2023 DXOS.org\n//\n\nimport { useArrowNavigationGroup, useFocusableGroup } from '@fluentui/react-tabster';\nimport React, { forwardRef, useCallback } from 'react';\nimport { useResizeDetector } from 'react-resize-detector';\n\nimport { List, useTranslation } from '@dxos/react-ui';\nimport {\n type MosaicContainerProps,\n type MosaicTileComponent,\n Mosaic,\n Path,\n useContainer,\n useItemsWithPreview,\n useMosaic,\n} from '@dxos/react-ui-mosaic';\nimport { dropRingInner } from '@dxos/react-ui-theme';\n\nimport {\n type CollapsedSections,\n type AddSectionPosition,\n SectionTile,\n type StackContextValue,\n type StackItem,\n type StackSectionContent,\n type StackSectionItem,\n} from './Section';\nimport { stackColumns } from './style-fragments';\nimport { translationKey } from '../translations';\n\nexport type Direction = 'horizontal' | 'vertical';\n\nexport type { CollapsedSections, AddSectionPosition };\n\nexport const DEFAULT_TYPE = 'stack-section';\n\nexport type StackProps<TData extends StackSectionContent = StackSectionContent> = Omit<\n MosaicContainerProps<TData, number>,\n 'debug' | 'Component'\n> &\n Omit<StackContextValue<TData>, 'setCollapsedSections'> & {\n items?: StackSectionItem[];\n separation?: boolean; // TODO(burdon): Style.\n onCollapseSection?: (id: string, collapsed: boolean) => void;\n emptyComponent?: React.ReactNode;\n };\n\nexport const Stack = ({\n id,\n type = DEFAULT_TYPE,\n SectionContent,\n items = [],\n separation = true,\n transform,\n onOver,\n onDrop,\n onAddSection,\n onDeleteSection,\n onNavigateToSection,\n onCollapseSection,\n ...props\n}: StackProps) => {\n const { ref: containerRef, width = 0 } = useResizeDetector<HTMLDivElement>({ refreshRate: 200 });\n const { operation, overItem } = useMosaic();\n const itemsWithPreview = useItemsWithPreview({ path: id, items });\n\n const getOverlayStyle = useCallback(() => ({ width }), [width]);\n const getOverlayProps = useCallback(\n () => ({ itemContext: { transform, SectionContent } }),\n [transform, SectionContent],\n );\n\n // TODO(thure): The root cause of the discrepancy between `activeNodeRect.top` and `overlayNodeRect.top` in Composer\n // in particular is not yet known, so this solution may may backfire in unforeseeable cases.\n const stackModifier = useCallback<Exclude<MosaicContainerProps['modifier'], undefined>>(\n (_activeItem, { transform, activeNodeRect, overlayNodeRect }) => {\n if (activeNodeRect && overlayNodeRect) {\n transform.y += activeNodeRect?.top - overlayNodeRect?.top;\n }\n return transform;\n },\n [],\n );\n\n return (\n <Mosaic.Container\n {...{\n id,\n type,\n Component: SectionTile as MosaicTileComponent<StackSectionItem, HTMLDivElement>,\n getOverlayStyle,\n getOverlayProps,\n onOver,\n onDrop,\n modifier: stackModifier,\n }}\n >\n <Mosaic.DroppableTile\n path={id}\n type={type}\n item={{ id, items: itemsWithPreview }}\n // TODO(wittjosiah): Should this actually be a context?\n itemContext={{\n separation,\n transform,\n onDeleteSection,\n onNavigateToSection,\n onAddSection,\n onCollapseSection,\n SectionContent,\n }}\n isOver={\n overItem &&\n !!overItem.path &&\n Path.hasRoot(overItem.path, id) &&\n (operation === 'copy' || operation === 'transfer')\n }\n Component={StackTile}\n {...props}\n ref={containerRef}\n />\n </Mosaic.Container>\n );\n};\n\nconst StackTile: MosaicTileComponent<StackItem, HTMLOListElement, Pick<StackProps, 'emptyComponent'>> = forwardRef(\n ({ classNames, path, isOver, item: { items }, itemContext, type: _type, emptyComponent, ...props }, forwardedRef) => {\n const { t } = useTranslation(translationKey);\n const { Component, type } = useContainer();\n const domAttributes = useArrowNavigationGroup({ axis: 'grid' });\n const { activeItem } = useMosaic();\n\n // NOTE(thure): Ensure “groupper” is available, but no need to use it here.\n const _group = useFocusableGroup();\n\n // NOTE: Keep outer padding the same as MarkdownMain.\n return (\n <List\n ref={forwardedRef}\n classNames={['grid relative', stackColumns, isOver && dropRingInner, classNames]}\n {...(!activeItem && domAttributes)}\n {...props}\n >\n {items.length > 0 ? (\n <Mosaic.SortableContext items={items} direction='vertical'>\n {items.map((item, index) => (\n <Mosaic.SortableTile\n key={item.id}\n item={item}\n itemContext={itemContext}\n path={path}\n type={type}\n position={index}\n Component={Component}\n />\n ))}\n </Mosaic.SortableContext>\n ) : emptyComponent !== undefined ? (\n <>{emptyComponent}</>\n ) : (\n <p\n className='grid col-span-2 text-center p-4 border border-dashed border-neutral-500/50 rounded'\n data-testid='stack.empty'\n >\n {t('empty stack message')}\n </p>\n )}\n </List>\n );\n },\n);\n", "//\n// Copyright 2023 DXOS.org\n//\n\nimport { useFocusableGroup, useTabsterAttributes } from '@fluentui/react-tabster';\nimport {\n ArrowLineDown,\n ArrowLineUp,\n ArrowSquareOut,\n CaretUpDown,\n DotsNine,\n type IconProps,\n Trash,\n} from '@phosphor-icons/react';\nimport * as CollapsiblePrimitive from '@radix-ui/react-collapsible';\nimport React, {\n forwardRef,\n useState,\n type ForwardRefExoticComponent,\n type RefAttributes,\n type FC,\n type PropsWithChildren,\n type ComponentPropsWithRef,\n} from 'react';\n\nimport {\n Button,\n DropdownMenu,\n type Label,\n List,\n ListItem,\n ScrollArea,\n type ThemedClassName,\n Toolbar,\n toLocalizedString,\n useTranslation,\n} from '@dxos/react-ui';\nimport { createAttendableAttributes, useHasAttention } from '@dxos/react-ui-attention';\nimport { DropDownMenuDragHandleTrigger, resizeHandle, resizeHandleHorizontal } from '@dxos/react-ui-deck';\nimport {\n type MosaicActiveType,\n type MosaicDataItem,\n type MosaicTileComponent,\n type MosaicTileProps,\n useMosaic,\n} from '@dxos/react-ui-mosaic';\nimport {\n focusRing,\n getSize,\n hoverableControlItem,\n hoverableControls,\n hoverableFocusedWithinControls,\n mx,\n} from '@dxos/react-ui-theme';\n\nimport { CaretDownUp } from './CaretDownUp';\nimport { stackColumns } from './style-fragments';\nimport { translationKey } from '../translations';\n\nconst sectionActionDimensions = 'p-1 shrink-0 min-bs-0 is-[--rail-action] bs-min';\n\nexport type StackSectionContent = MosaicDataItem;\n\nexport type CollapsedSections = Record<string, boolean>;\n\nexport type AddSectionPosition = 'before' | 'after' | 'beforeAll' | 'afterAll';\n\nexport type StackContextValue<TData extends StackSectionContent = StackSectionContent> = {\n SectionContent: FC<{ data: TData }>;\n separation?: boolean;\n isResizable?: boolean;\n transform?: (item: MosaicDataItem, type?: string) => StackSectionItem;\n onDeleteSection?: (path: string) => void;\n onAddSection?: (path: string, position: AddSectionPosition) => void;\n onNavigateToSection?: (object: MosaicDataItem) => void;\n onCollapseSection?: (id: string, collapsed: boolean) => void;\n};\n\nexport type StackItem = MosaicDataItem & {\n items: StackSectionItem[];\n};\n\nexport type StackSectionItem = MosaicDataItem & {\n object: StackSectionContent;\n // TODO(wittjosiah): Use effect schema? Share schema with echo.\n view?: {\n title?: string;\n size?: SectionSize;\n height?: number;\n collapsed?: boolean;\n custom?: Record<string, any>;\n };\n // TODO(wittjosiah): Common type? Factor out?\n metadata?: {\n icon?: FC<IconProps>;\n placeholder?: Label;\n viewActions?: (item: StackSectionItem) => StackAction;\n };\n};\n\nexport type StackAction = {\n icon: FC<IconProps>;\n label: Label;\n onClick: () => void;\n};\n\nexport type SectionSize = 'intrinsic' | 'extrinsic';\n\nexport type SectionProps = PropsWithChildren<\n {\n // Data props.\n id: string;\n title: string;\n\n // Tile props.\n active?: MosaicActiveType;\n } & Pick<\n MosaicTileProps,\n 'draggableProps' | 'draggableStyle' | 'onDelete' | 'onNavigate' | 'onAddAfter' | 'onAddBefore'\n > &\n Pick<StackContextValue, 'separation' | 'isResizable' | 'onCollapseSection'> &\n Pick<Required<StackSectionItem>['view'], 'collapsed' | 'size'> &\n Pick<Required<StackSectionItem>['metadata'], 'icon'>\n>;\n\nconst resizeHandleStyles = mx(resizeHandle, resizeHandleHorizontal, 'is-full bs-[--rail-action] col-start-2');\n\nexport const Section: ForwardRefExoticComponent<SectionProps & RefAttributes<HTMLLIElement>> = forwardRef<\n HTMLLIElement,\n SectionProps\n>(\n (\n {\n id,\n title,\n icon: Icon = DotsNine,\n size = 'intrinsic',\n collapsed,\n active,\n isResizable,\n draggableProps,\n draggableStyle,\n onDelete,\n onNavigate,\n onAddBefore,\n onAddAfter,\n onCollapseSection,\n children,\n },\n forwardedRef,\n ) => {\n const { t } = useTranslation(translationKey);\n const [optionsMenuOpen, setOptionsMenuOpen] = useState(false);\n const sectionActionsToolbar = useTabsterAttributes({\n groupper: {},\n focusable: {},\n mover: { cyclic: true, direction: 1, memorizeCurrent: false },\n });\n const sectionContentGroup = useFocusableGroup({});\n const attendableAttrs = createAttendableAttributes(id);\n const hasAttention = useHasAttention(id);\n\n return (\n <CollapsiblePrimitive.Root\n asChild\n open={!collapsed}\n onOpenChange={(nextOpen) => onCollapseSection?.(id, !nextOpen)}\n >\n <ListItem.Root\n ref={forwardedRef}\n id={id}\n {...attendableAttrs}\n classNames={[\n 'grid col-span-2 group/section',\n active === 'overlay' ? stackColumns : 'grid-cols-subgrid snap-start',\n ]}\n style={draggableStyle}\n >\n <div\n role='none'\n className={mx(\n 'grid col-span-2 grid-cols-subgrid',\n 'bg-base focus-within:border-separator focus-within:attention-within',\n hoverableControls,\n hoverableFocusedWithinControls,\n (active || hasAttention) && 'attention-surface border-separator',\n (active === 'origin' || active === 'rearrange' || active === 'destination') && 'opacity-0',\n )}\n >\n <div\n role='toolbar'\n aria-orientation='vertical'\n aria-label={t('section controls label')}\n {...(!active && { tabIndex: 0 })}\n {...(!active && sectionActionsToolbar)}\n className={mx(\n 'grid grid-cols-subgrid ch-focus-ring rounded-sm grid-rows-[min-content_min-content_1fr] m-1',\n 'group-has-[[role=toolbar][aria-orientation=horizontal]]/section:pbs-[--rail-action]',\n )}\n >\n <div role='none' className='sticky -block-start-px bg-[--sticky-bg]'>\n <DropdownMenu.Root\n {...{\n open: optionsMenuOpen,\n onOpenChange: setOptionsMenuOpen,\n }}\n >\n <DropDownMenuDragHandleTrigger active={!!active} variant='ghost' classNames='m-0' {...draggableProps}>\n <Icon className={mx(getSize(5), 'transition-opacity')} />\n </DropDownMenuDragHandleTrigger>\n <DropdownMenu.Portal>\n <DropdownMenu.Content>\n <DropdownMenu.Viewport>\n {collapsed ? (\n <DropdownMenu.Item onClick={onNavigate} data-testid='section.navigate-to'>\n <ArrowSquareOut className={mx(getSize(5), 'mr-2')} />\n <span className='grow'>{t('navigate to section label')}</span>\n </DropdownMenu.Item>\n ) : (\n <CollapsiblePrimitive.Trigger asChild>\n <DropdownMenu.Item>\n <CaretDownUp className={mx(getSize(5), 'mr-2')} />\n <span className='grow'>{t('collapse label')}</span>\n </DropdownMenu.Item>\n </CollapsiblePrimitive.Trigger>\n )}\n <DropdownMenu.Item onClick={onAddBefore} data-testid='section.add-before'>\n <ArrowLineUp className={mx(getSize(5), 'mr-2')} />\n <span className='grow'>{t('add section before label')}</span>\n </DropdownMenu.Item>\n <DropdownMenu.Item onClick={onAddAfter} data-testid='section.add-after'>\n <ArrowLineDown className={mx(getSize(5), 'mr-2')} />\n <span className='grow'>{t('add section after label')}</span>\n </DropdownMenu.Item>\n <DropdownMenu.Item onClick={() => onDelete?.()} data-testid='section.remove'>\n <Trash className={mx(getSize(5), 'mr-2')} />\n <span className='grow'>{t('remove section label')}</span>\n </DropdownMenu.Item>\n </DropdownMenu.Viewport>\n <DropdownMenu.Arrow />\n </DropdownMenu.Content>\n </DropdownMenu.Portal>\n </DropdownMenu.Root>\n {collapsed ? (\n <CollapsiblePrimitive.Trigger asChild>\n <Button variant='ghost' classNames={sectionActionDimensions}>\n <span className='sr-only'>{t('expand label')}</span>\n <CaretUpDown className={getSize(4)} />\n </Button>\n </CollapsiblePrimitive.Trigger>\n ) : (\n <Button\n variant='ghost'\n classNames={sectionActionDimensions}\n onClick={onNavigate}\n data-testid='section.navigate-to'\n >\n <ArrowSquareOut className={mx(getSize(4))} />\n <span className='sr-only'>{t('navigate to section label')}</span>\n </Button>\n )}\n </div>\n </div>\n\n {/* Main content */}\n\n <ListItem.Heading\n classNames={collapsed ? ['grid grid-rows-subgrid grid-cols-subgrid items-center', focusRing] : 'sr-only'}\n {...(collapsed && { ...sectionContentGroup, tabIndex: 0 })}\n >\n {/*\n TODO(thure): This needs to be made extensible; Markdown document titles especially are difficult.\n Using `Surface` in a UI package like this would be unprecedented and needs motivation.\n Refactoring to use subcomponents is complicated by sections being a sortable Mosaic Tile.\n Reevaluate when work on collections (Folders, Stacks, etc) settles.\n */}\n <span className='truncate'>{title}</span>\n </ListItem.Heading>\n {size === 'intrinsic' ? (\n <CollapsiblePrimitive.Content\n {...(!collapsed && {\n ...sectionContentGroup,\n tabIndex: 0,\n })}\n // TODO(burdon): Add margin to fragment?\n className={mx(focusRing, 'm-[2px]')}\n >\n {children}\n </CollapsiblePrimitive.Content>\n ) : (\n <CollapsiblePrimitive.Content asChild>\n <ScrollArea.Root\n type='always'\n {...(!collapsed && { ...sectionContentGroup, tabIndex: 0 })}\n classNames={mx(focusRing, 'is-full has-[[data-radix-scroll-area-viewport]]:pbe-4')}\n >\n <ScrollArea.Viewport>{children}</ScrollArea.Viewport>\n <ScrollArea.Scrollbar\n orientation='horizontal'\n variant='coarse'\n classNames='hidden has-[div]:flex !inline-end-[max(.25rem,var(--radix-scroll-area-corner-width))]'\n >\n <ScrollArea.Thumb />\n </ScrollArea.Scrollbar>\n <ScrollArea.Scrollbar orientation='vertical' variant='coarse' classNames='hidden has-[div]:flex'>\n <ScrollArea.Thumb />\n </ScrollArea.Scrollbar>\n <ScrollArea.Corner />\n </ScrollArea.Root>\n </CollapsiblePrimitive.Content>\n )}\n </div>\n {isResizable && !collapsed && (\n <button className={resizeHandleStyles}>\n <span className='sr-only'>{t('resize section label')}</span>\n </button>\n )}\n </ListItem.Root>\n </CollapsiblePrimitive.Root>\n );\n },\n);\n\nexport type SectionToolbarProps = ThemedClassName<ComponentPropsWithRef<'div'>>;\n\n// TODO(burdon): block-start\nexport const sectionToolbarLayout =\n 'bs-[--rail-action] bg-[--sticky-bg] sticky block-start-0 __-block-start-px transition-opacity';\n\nexport const SectionToolbar = ({ children, classNames }: SectionToolbarProps) => {\n return (\n <Toolbar.Root orientation='horizontal' classNames={[sectionToolbarLayout, hoverableControlItem, classNames]}>\n {children}\n </Toolbar.Root>\n );\n};\n\nexport const SectionTile: MosaicTileComponent<\n StackSectionItem,\n HTMLLIElement\n // TODO(wittjosiah): If props is specified there is a type error with Mosaic.Container.\n // { itemContext: StackContextValue }\n> = forwardRef(({ path, type, active, draggableStyle, draggableProps, item, itemContext }, forwardedRef) => {\n const { t } = useTranslation(translationKey);\n const { activeItem } = useMosaic();\n\n const separation = !!itemContext?.separation;\n const isResizable = !!itemContext?.isResizable;\n const { transform, onDeleteSection, onNavigateToSection, onAddSection, onCollapseSection, SectionContent } =\n itemContext as StackContextValue;\n\n const transformedItem = transform\n ? transform(\n item,\n // TODO(wittjosiah): `active` doesn't always seem to be accurate here.\n activeItem?.item.id === item.id ? activeItem?.type : type,\n )\n : item;\n\n const placeholder = transformedItem.metadata?.placeholder ?? ['untitled section title', { ns: translationKey }];\n const title = transformedItem.view?.title ?? toLocalizedString(placeholder, t);\n\n const section = (\n <Section\n ref={forwardedRef}\n title={title}\n id={transformedItem.id}\n size={transformedItem.view?.size}\n icon={transformedItem.metadata?.icon}\n collapsed={transformedItem.view?.collapsed}\n separation={separation}\n active={active}\n draggableProps={draggableProps}\n draggableStyle={draggableStyle}\n onCollapseSection={onCollapseSection}\n isResizable={isResizable}\n onDelete={() => onDeleteSection?.(path)}\n onNavigate={() => onNavigateToSection?.(transformedItem)}\n onAddAfter={() => onAddSection?.(path, 'after')}\n onAddBefore={() => onAddSection?.(path, 'before')}\n >\n {SectionContent && <SectionContent data={transformedItem.object} />}\n </Section>\n );\n\n return active === 'overlay' ? <List>{section}</List> : section;\n});\n", "//\n// Copyright 2024 DXOS.org\n//\nimport { type IconProps } from '@phosphor-icons/react';\nimport React from 'react';\n\nexport const CaretDownUp = ({ children, weight, ...props }: IconProps) => {\n return (\n <svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 256 256' {...props}>\n <rect width='256' height='256' fill='none' />\n <polyline\n points='80 224 128 176 176 224'\n fill='none'\n stroke='currentColor'\n strokeLinecap='round'\n strokeLinejoin='round'\n strokeWidth='16'\n />\n <polyline\n points='80 32 128 80 176 32'\n fill='none'\n stroke='currentColor'\n strokeLinecap='round'\n strokeLinejoin='round'\n strokeWidth='16'\n />\n {children}\n </svg>\n );\n};\n", "//\n// Copyright 2024 DXOS.org\n//\n\nexport const stackColumns = 'grid-cols-[var(--rail-size)_calc(100%-var(--rail-size))]';\n", "//\n// Copyright 2023 DXOS.org\n//\n\nexport const translationKey = 'stack';\n\nexport default [\n {\n 'en-US': {\n [translationKey]: {\n 'empty stack message': 'Drag items into the stack.',\n 'remove section label': 'Delete',\n 'navigate to section label': 'Navigate to item',\n 'untitled section title': 'Untitled section',\n 'add section before label': 'Add before',\n 'add section after label': 'Add after',\n 'expand label': 'Expand',\n 'collapse label': 'Collapse',\n },\n },\n },\n];\n"],
|
|
5
|
+
"mappings": "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",
|
|
6
|
+
"names": ["useArrowNavigationGroup", "useFocusableGroup", "React", "forwardRef", "useCallback", "useResizeDetector", "List", "useTranslation", "Mosaic", "Path", "useContainer", "useItemsWithPreview", "useMosaic", "dropRingInner", "useFocusableGroup", "useTabsterAttributes", "ArrowLineDown", "ArrowLineUp", "ArrowSquareOut", "CaretUpDown", "DotsNine", "Trash", "CollapsiblePrimitive", "React", "forwardRef", "useState", "Button", "DropdownMenu", "List", "ListItem", "ScrollArea", "Toolbar", "toLocalizedString", "useTranslation", "createAttendableAttributes", "useHasAttention", "DropDownMenuDragHandleTrigger", "resizeHandle", "resizeHandleHorizontal", "useMosaic", "focusRing", "getSize", "hoverableControlItem", "hoverableControls", "hoverableFocusedWithinControls", "mx", "React", "CaretDownUp", "children", "weight", "props", "svg", "xmlns", "viewBox", "rect", "width", "height", "fill", "polyline", "points", "stroke", "strokeLinecap", "strokeLinejoin", "strokeWidth", "stackColumns", "translationKey", "sectionActionDimensions", "resizeHandleStyles", "mx", "resizeHandle", "resizeHandleHorizontal", "Section", "forwardRef", "id", "title", "icon", "Icon", "DotsNine", "size", "collapsed", "active", "isResizable", "draggableProps", "draggableStyle", "onDelete", "onNavigate", "onAddBefore", "onAddAfter", "onCollapseSection", "children", "forwardedRef", "t", "useTranslation", "translationKey", "optionsMenuOpen", "setOptionsMenuOpen", "useState", "sectionActionsToolbar", "useTabsterAttributes", "groupper", "focusable", "mover", "cyclic", "direction", "memorizeCurrent", "sectionContentGroup", "useFocusableGroup", "attendableAttrs", "createAttendableAttributes", "hasAttention", "useHasAttention", "React", "Root", "asChild", "open", "onOpenChange", "nextOpen", "ListItem", "ref", "classNames", "stackColumns", "style", "div", "role", "className", "hoverableControls", "hoverableFocusedWithinControls", "aria-orientation", "aria-label", "tabIndex", "DropdownMenu", "DropDownMenuDragHandleTrigger", "variant", "getSize", "Portal", "Content", "Viewport", "Item", "onClick", "data-testid", "ArrowSquareOut", "span", "Trigger", "CaretDownUp", "ArrowLineUp", "ArrowLineDown", "Trash", "Arrow", "Button", "CaretUpDown", "Heading", "focusRing", "ScrollArea", "type", "Scrollbar", "orientation", "Thumb", "Corner", "button", "sectionToolbarLayout", "SectionToolbar", "Toolbar", "hoverableControlItem", "SectionTile", "path", "item", "itemContext", "activeItem", "useMosaic", "separation", "transform", "onDeleteSection", "onNavigateToSection", "onAddSection", "SectionContent", "transformedItem", "placeholder", "metadata", "ns", "view", "toLocalizedString", "section", "data", "object", "List", "DEFAULT_TYPE", "Stack", "id", "type", "SectionContent", "items", "separation", "transform", "onOver", "onDrop", "onAddSection", "onDeleteSection", "onNavigateToSection", "onCollapseSection", "props", "ref", "containerRef", "width", "useResizeDetector", "refreshRate", "operation", "overItem", "useMosaic", "itemsWithPreview", "useItemsWithPreview", "path", "getOverlayStyle", "useCallback", "getOverlayProps", "itemContext", "stackModifier", "_activeItem", "activeNodeRect", "overlayNodeRect", "y", "top", "React", "Mosaic", "Container", "Component", "SectionTile", "modifier", "DroppableTile", "item", "isOver", "Path", "hasRoot", "StackTile", "forwardRef", "classNames", "_type", "emptyComponent", "forwardedRef", "t", "useTranslation", "translationKey", "useContainer", "domAttributes", "useArrowNavigationGroup", "axis", "activeItem", "_group", "useFocusableGroup", "List", "stackColumns", "dropRingInner", "length", "SortableContext", "direction", "map", "index", "SortableTile", "key", "position", "undefined", "p", "className", "data-testid"]
|
|
7
7
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"inputs":{"packages/ui/react-ui-stack/src/components/CaretDownUp.tsx":{"bytes":3080,"imports":[{"path":"react","kind":"import-statement","external":true}],"format":"esm"},"packages/ui/react-ui-stack/src/components/style-fragments.ts":{"bytes":707,"imports":[],"format":"esm"},"packages/ui/react-ui-stack/src/translations.ts":{"bytes":2050,"imports":[],"format":"esm"},"packages/ui/react-ui-stack/src/components/Section.tsx":{"bytes":
|
|
1
|
+
{"inputs":{"packages/ui/react-ui-stack/src/components/CaretDownUp.tsx":{"bytes":3080,"imports":[{"path":"react","kind":"import-statement","external":true}],"format":"esm"},"packages/ui/react-ui-stack/src/components/style-fragments.ts":{"bytes":707,"imports":[],"format":"esm"},"packages/ui/react-ui-stack/src/translations.ts":{"bytes":2050,"imports":[],"format":"esm"},"packages/ui/react-ui-stack/src/components/Section.tsx":{"bytes":40329,"imports":[{"path":"@fluentui/react-tabster","kind":"import-statement","external":true},{"path":"@phosphor-icons/react","kind":"import-statement","external":true},{"path":"@radix-ui/react-collapsible","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-attention","kind":"import-statement","external":true},{"path":"@dxos/react-ui-deck","kind":"import-statement","external":true},{"path":"@dxos/react-ui-mosaic","kind":"import-statement","external":true},{"path":"@dxos/react-ui-theme","kind":"import-statement","external":true},{"path":"packages/ui/react-ui-stack/src/components/CaretDownUp.tsx","kind":"import-statement","original":"./CaretDownUp"},{"path":"packages/ui/react-ui-stack/src/components/style-fragments.ts","kind":"import-statement","original":"./style-fragments"},{"path":"packages/ui/react-ui-stack/src/translations.ts","kind":"import-statement","original":"../translations"}],"format":"esm"},"packages/ui/react-ui-stack/src/components/Stack.tsx":{"bytes":16626,"imports":[{"path":"@fluentui/react-tabster","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true},{"path":"react-resize-detector","kind":"import-statement","external":true},{"path":"@dxos/react-ui","kind":"import-statement","external":true},{"path":"@dxos/react-ui-mosaic","kind":"import-statement","external":true},{"path":"@dxos/react-ui-theme","kind":"import-statement","external":true},{"path":"packages/ui/react-ui-stack/src/components/Section.tsx","kind":"import-statement","original":"./Section"},{"path":"packages/ui/react-ui-stack/src/components/style-fragments.ts","kind":"import-statement","original":"./style-fragments"},{"path":"packages/ui/react-ui-stack/src/translations.ts","kind":"import-statement","original":"../translations"}],"format":"esm"},"packages/ui/react-ui-stack/src/components/index.ts":{"bytes":832,"imports":[{"path":"packages/ui/react-ui-stack/src/components/Stack.tsx","kind":"import-statement","original":"./Stack"},{"path":"packages/ui/react-ui-stack/src/components/Section.tsx","kind":"import-statement","original":"./Section"}],"format":"esm"},"packages/ui/react-ui-stack/src/index.ts":{"bytes":718,"imports":[{"path":"packages/ui/react-ui-stack/src/components/index.ts","kind":"import-statement","original":"./components"},{"path":"packages/ui/react-ui-stack/src/translations.ts","kind":"import-statement","original":"./translations"}],"format":"esm"},"packages/ui/react-ui-stack/src/testing/generator.ts":{"bytes":12332,"imports":[{"path":"@dxos/echo-schema","kind":"import-statement","external":true},{"path":"@dxos/random","kind":"import-statement","external":true}],"format":"esm"},"packages/ui/react-ui-stack/src/testing/stack-manager.ts":{"bytes":7412,"imports":[],"format":"esm"},"packages/ui/react-ui-stack/src/testing/index.ts":{"bytes":612,"imports":[{"path":"packages/ui/react-ui-stack/src/testing/generator.ts","kind":"import-statement","original":"./generator"},{"path":"packages/ui/react-ui-stack/src/testing/stack-manager.ts","kind":"import-statement","original":"./stack-manager"}],"format":"esm"}},"outputs":{"packages/ui/react-ui-stack/dist/lib/browser/index.mjs.map":{"imports":[],"exports":[],"inputs":{},"bytes":34006},"packages/ui/react-ui-stack/dist/lib/browser/index.mjs":{"imports":[{"path":"@fluentui/react-tabster","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true},{"path":"react-resize-detector","kind":"import-statement","external":true},{"path":"@dxos/react-ui","kind":"import-statement","external":true},{"path":"@dxos/react-ui-mosaic","kind":"import-statement","external":true},{"path":"@dxos/react-ui-theme","kind":"import-statement","external":true},{"path":"@fluentui/react-tabster","kind":"import-statement","external":true},{"path":"@phosphor-icons/react","kind":"import-statement","external":true},{"path":"@radix-ui/react-collapsible","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-attention","kind":"import-statement","external":true},{"path":"@dxos/react-ui-deck","kind":"import-statement","external":true},{"path":"@dxos/react-ui-mosaic","kind":"import-statement","external":true},{"path":"@dxos/react-ui-theme","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true}],"exports":["DEFAULT_TYPE","SectionToolbar","Stack","sectionToolbarLayout","translations"],"entryPoint":"packages/ui/react-ui-stack/src/index.ts","inputs":{"packages/ui/react-ui-stack/src/components/Stack.tsx":{"bytesInOutput":3542},"packages/ui/react-ui-stack/src/components/Section.tsx":{"bytesInOutput":10203},"packages/ui/react-ui-stack/src/components/CaretDownUp.tsx":{"bytesInOutput":779},"packages/ui/react-ui-stack/src/components/style-fragments.ts":{"bytesInOutput":79},"packages/ui/react-ui-stack/src/translations.ts":{"bytesInOutput":508},"packages/ui/react-ui-stack/src/components/index.ts":{"bytesInOutput":0},"packages/ui/react-ui-stack/src/index.ts":{"bytesInOutput":0}},"bytes":15669},"packages/ui/react-ui-stack/dist/lib/browser/testing/index.mjs.map":{"imports":[],"exports":[],"inputs":{},"bytes":9963},"packages/ui/react-ui-stack/dist/lib/browser/testing/index.mjs":{"imports":[{"path":"@dxos/echo-schema","kind":"import-statement","external":true},{"path":"@dxos/random","kind":"import-statement","external":true}],"exports":["Priority","SectionManager","StackManager","Status","TestObjectGenerator","defaultGenerators","range"],"entryPoint":"packages/ui/react-ui-stack/src/testing/index.ts","inputs":{"packages/ui/react-ui-stack/src/testing/generator.ts":{"bytesInOutput":2244},"packages/ui/react-ui-stack/src/testing/index.ts":{"bytesInOutput":0},"packages/ui/react-ui-stack/src/testing/stack-manager.ts":{"bytesInOutput":1569}},"bytes":4083}}}
|
package/dist/lib/node/index.cjs
CHANGED
|
@@ -96,7 +96,7 @@ var translations_default = [
|
|
|
96
96
|
];
|
|
97
97
|
var sectionActionDimensions = "p-1 shrink-0 min-bs-0 is-[--rail-action] bs-min";
|
|
98
98
|
var resizeHandleStyles = (0, import_react_ui_theme2.mx)(import_react_ui_deck.resizeHandle, import_react_ui_deck.resizeHandleHorizontal, "is-full bs-[--rail-action] col-start-2");
|
|
99
|
-
var Section = /* @__PURE__ */ (0, import_react3.forwardRef)(({ id, title, icon =
|
|
99
|
+
var Section = /* @__PURE__ */ (0, import_react3.forwardRef)(({ id, title, icon: Icon = import_react2.DotsNine, size = "intrinsic", collapsed, active, isResizable, draggableProps, draggableStyle, onDelete, onNavigate, onAddBefore, onAddAfter, onCollapseSection, children }, forwardedRef) => {
|
|
100
100
|
const { t } = (0, import_react_ui2.useTranslation)(translationKey);
|
|
101
101
|
const [optionsMenuOpen, setOptionsMenuOpen] = (0, import_react3.useState)(false);
|
|
102
102
|
const sectionActionsToolbar = (0, import_react_tabster2.useTabsterAttributes)({
|
|
@@ -147,10 +147,8 @@ var Section = /* @__PURE__ */ (0, import_react3.forwardRef)(({ id, title, icon =
|
|
|
147
147
|
variant: "ghost",
|
|
148
148
|
classNames: "m-0",
|
|
149
149
|
...draggableProps
|
|
150
|
-
}, /* @__PURE__ */ import_react3.default.createElement(
|
|
151
|
-
|
|
152
|
-
size: 5,
|
|
153
|
-
classNames: "transition-opacity"
|
|
150
|
+
}, /* @__PURE__ */ import_react3.default.createElement(Icon, {
|
|
151
|
+
className: (0, import_react_ui_theme2.mx)((0, import_react_ui_theme2.getSize)(5), "transition-opacity")
|
|
154
152
|
})), /* @__PURE__ */ import_react3.default.createElement(import_react_ui2.DropdownMenu.Portal, null, /* @__PURE__ */ import_react3.default.createElement(import_react_ui2.DropdownMenu.Content, null, /* @__PURE__ */ import_react3.default.createElement(import_react_ui2.DropdownMenu.Viewport, null, collapsed ? /* @__PURE__ */ import_react3.default.createElement(import_react_ui2.DropdownMenu.Item, {
|
|
155
153
|
onClick: onNavigate,
|
|
156
154
|
"data-testid": "section.navigate-to"
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../src/components/Stack.tsx", "../../../src/components/Section.tsx", "../../../src/components/CaretDownUp.tsx", "../../../src/components/style-fragments.ts", "../../../src/translations.ts"],
|
|
4
|
-
"sourcesContent": ["//\n// Copyright 2023 DXOS.org\n//\n\nimport { useArrowNavigationGroup, useFocusableGroup } from '@fluentui/react-tabster';\nimport React, { forwardRef, useCallback } from 'react';\nimport { useResizeDetector } from 'react-resize-detector';\n\nimport { List, useTranslation } from '@dxos/react-ui';\nimport {\n type MosaicContainerProps,\n type MosaicTileComponent,\n Mosaic,\n Path,\n useContainer,\n useItemsWithPreview,\n useMosaic,\n} from '@dxos/react-ui-mosaic';\nimport { dropRingInner } from '@dxos/react-ui-theme';\n\nimport {\n type CollapsedSections,\n type AddSectionPosition,\n SectionTile,\n type StackContextValue,\n type StackItem,\n type StackSectionContent,\n type StackSectionItem,\n} from './Section';\nimport { stackColumns } from './style-fragments';\nimport { translationKey } from '../translations';\n\nexport type Direction = 'horizontal' | 'vertical';\n\nexport type { CollapsedSections, AddSectionPosition };\n\nexport const DEFAULT_TYPE = 'stack-section';\n\nexport type StackProps<TData extends StackSectionContent = StackSectionContent> = Omit<\n MosaicContainerProps<TData, number>,\n 'debug' | 'Component'\n> &\n Omit<StackContextValue<TData>, 'setCollapsedSections'> & {\n items?: StackSectionItem[];\n separation?: boolean; // TODO(burdon): Style.\n onCollapseSection?: (id: string, collapsed: boolean) => void;\n emptyComponent?: React.ReactNode;\n };\n\nexport const Stack = ({\n id,\n type = DEFAULT_TYPE,\n SectionContent,\n items = [],\n separation = true,\n transform,\n onOver,\n onDrop,\n onAddSection,\n onDeleteSection,\n onNavigateToSection,\n onCollapseSection,\n ...props\n}: StackProps) => {\n const { ref: containerRef, width = 0 } = useResizeDetector<HTMLDivElement>({ refreshRate: 200 });\n const { operation, overItem } = useMosaic();\n const itemsWithPreview = useItemsWithPreview({ path: id, items });\n\n const getOverlayStyle = useCallback(() => ({ width }), [width]);\n const getOverlayProps = useCallback(\n () => ({ itemContext: { transform, SectionContent } }),\n [transform, SectionContent],\n );\n\n // TODO(thure): The root cause of the discrepancy between `activeNodeRect.top` and `overlayNodeRect.top` in Composer\n // in particular is not yet known, so this solution may may backfire in unforeseeable cases.\n const stackModifier = useCallback<Exclude<MosaicContainerProps['modifier'], undefined>>(\n (_activeItem, { transform, activeNodeRect, overlayNodeRect }) => {\n if (activeNodeRect && overlayNodeRect) {\n transform.y += activeNodeRect?.top - overlayNodeRect?.top;\n }\n return transform;\n },\n [],\n );\n\n return (\n <Mosaic.Container\n {...{\n id,\n type,\n Component: SectionTile as MosaicTileComponent<StackSectionItem, HTMLDivElement>,\n getOverlayStyle,\n getOverlayProps,\n onOver,\n onDrop,\n modifier: stackModifier,\n }}\n >\n <Mosaic.DroppableTile\n path={id}\n type={type}\n item={{ id, items: itemsWithPreview }}\n // TODO(wittjosiah): Should this actually be a context?\n itemContext={{\n separation,\n transform,\n onDeleteSection,\n onNavigateToSection,\n onAddSection,\n onCollapseSection,\n SectionContent,\n }}\n isOver={\n overItem &&\n !!overItem.path &&\n Path.hasRoot(overItem.path, id) &&\n (operation === 'copy' || operation === 'transfer')\n }\n Component={StackTile}\n {...props}\n ref={containerRef}\n />\n </Mosaic.Container>\n );\n};\n\nconst StackTile: MosaicTileComponent<StackItem, HTMLOListElement, Pick<StackProps, 'emptyComponent'>> = forwardRef(\n ({ classNames, path, isOver, item: { items }, itemContext, type: _type, emptyComponent, ...props }, forwardedRef) => {\n const { t } = useTranslation(translationKey);\n const { Component, type } = useContainer();\n const domAttributes = useArrowNavigationGroup({ axis: 'grid' });\n const { activeItem } = useMosaic();\n\n // NOTE(thure): Ensure “groupper” is available, but no need to use it here.\n const _group = useFocusableGroup();\n\n // NOTE: Keep outer padding the same as MarkdownMain.\n return (\n <List\n ref={forwardedRef}\n classNames={['grid relative', stackColumns, isOver && dropRingInner, classNames]}\n {...(!activeItem && domAttributes)}\n {...props}\n >\n {items.length > 0 ? (\n <Mosaic.SortableContext items={items} direction='vertical'>\n {items.map((item, index) => (\n <Mosaic.SortableTile\n key={item.id}\n item={item}\n itemContext={itemContext}\n path={path}\n type={type}\n position={index}\n Component={Component}\n />\n ))}\n </Mosaic.SortableContext>\n ) : emptyComponent !== undefined ? (\n <>{emptyComponent}</>\n ) : (\n <p\n className='grid col-span-2 text-center p-4 border border-dashed border-neutral-500/50 rounded'\n data-testid='stack.empty'\n >\n {t('empty stack message')}\n </p>\n )}\n </List>\n );\n },\n);\n", "//\n// Copyright 2023 DXOS.org\n//\n\nimport { useFocusableGroup, useTabsterAttributes } from '@fluentui/react-tabster';\nimport { ArrowLineDown, ArrowLineUp, ArrowSquareOut, CaretUpDown, Trash } from '@phosphor-icons/react';\nimport * as CollapsiblePrimitive from '@radix-ui/react-collapsible';\nimport React, {\n forwardRef,\n useState,\n type ForwardRefExoticComponent,\n type RefAttributes,\n type FC,\n type PropsWithChildren,\n type ComponentPropsWithRef,\n} from 'react';\n\nimport {\n Button,\n DropdownMenu,\n Icon,\n type Label,\n List,\n ListItem,\n ScrollArea,\n type ThemedClassName,\n Toolbar,\n toLocalizedString,\n useTranslation,\n} from '@dxos/react-ui';\nimport { createAttendableAttributes, useHasAttention } from '@dxos/react-ui-attention';\nimport { DropDownMenuDragHandleTrigger, resizeHandle, resizeHandleHorizontal } from '@dxos/react-ui-deck';\nimport {\n type MosaicActiveType,\n type MosaicDataItem,\n type MosaicTileComponent,\n type MosaicTileProps,\n useMosaic,\n} from '@dxos/react-ui-mosaic';\nimport {\n focusRing,\n getSize,\n hoverableControlItem,\n hoverableControls,\n hoverableFocusedWithinControls,\n mx,\n} from '@dxos/react-ui-theme';\n\nimport { CaretDownUp } from './CaretDownUp';\nimport { stackColumns } from './style-fragments';\nimport { translationKey } from '../translations';\n\nconst sectionActionDimensions = 'p-1 shrink-0 min-bs-0 is-[--rail-action] bs-min';\n\nexport type StackSectionContent = MosaicDataItem;\n\nexport type CollapsedSections = Record<string, boolean>;\n\nexport type AddSectionPosition = 'before' | 'after' | 'beforeAll' | 'afterAll';\n\nexport type StackContextValue<TData extends StackSectionContent = StackSectionContent> = {\n SectionContent: FC<{ data: TData }>;\n separation?: boolean;\n isResizable?: boolean;\n transform?: (item: MosaicDataItem, type?: string) => StackSectionItem;\n onDeleteSection?: (path: string) => void;\n onAddSection?: (path: string, position: AddSectionPosition) => void;\n onNavigateToSection?: (object: MosaicDataItem) => void;\n onCollapseSection?: (id: string, collapsed: boolean) => void;\n};\n\nexport type StackItem = MosaicDataItem & {\n items: StackSectionItem[];\n};\n\nexport type StackSectionItem = MosaicDataItem & {\n object: StackSectionContent;\n // TODO(wittjosiah): Use effect schema? Share schema with echo.\n view?: {\n title?: string;\n size?: SectionSize;\n height?: number;\n collapsed?: boolean;\n custom?: Record<string, any>;\n };\n // TODO(wittjosiah): Common type? Factor out?\n metadata?: {\n icon?: string;\n placeholder?: Label;\n viewActions?: (item: StackSectionItem) => StackAction;\n };\n};\n\nexport type StackAction = {\n icon: string;\n label: Label;\n onClick: () => void;\n};\n\nexport type SectionSize = 'intrinsic' | 'extrinsic';\n\nexport type SectionProps = PropsWithChildren<\n {\n // Data props.\n id: string;\n title: string;\n\n // Tile props.\n active?: MosaicActiveType;\n } & Pick<\n MosaicTileProps,\n 'draggableProps' | 'draggableStyle' | 'onDelete' | 'onNavigate' | 'onAddAfter' | 'onAddBefore'\n > &\n Pick<StackContextValue, 'separation' | 'isResizable' | 'onCollapseSection'> &\n Pick<Required<StackSectionItem>['view'], 'collapsed' | 'size'> &\n Pick<Required<StackSectionItem>['metadata'], 'icon'>\n>;\n\nconst resizeHandleStyles = mx(resizeHandle, resizeHandleHorizontal, 'is-full bs-[--rail-action] col-start-2');\n\nexport const Section: ForwardRefExoticComponent<SectionProps & RefAttributes<HTMLLIElement>> = forwardRef<\n HTMLLIElement,\n SectionProps\n>(\n (\n {\n id,\n title,\n icon = 'phosphor--placeholder--regular',\n size = 'intrinsic',\n collapsed,\n active,\n isResizable,\n draggableProps,\n draggableStyle,\n onDelete,\n onNavigate,\n onAddBefore,\n onAddAfter,\n onCollapseSection,\n children,\n },\n forwardedRef,\n ) => {\n const { t } = useTranslation(translationKey);\n const [optionsMenuOpen, setOptionsMenuOpen] = useState(false);\n const sectionActionsToolbar = useTabsterAttributes({\n groupper: {},\n focusable: {},\n mover: { cyclic: true, direction: 1, memorizeCurrent: false },\n });\n const sectionContentGroup = useFocusableGroup({});\n const attendableAttrs = createAttendableAttributes(id);\n const hasAttention = useHasAttention(id);\n\n return (\n <CollapsiblePrimitive.Root\n asChild\n open={!collapsed}\n onOpenChange={(nextOpen) => onCollapseSection?.(id, !nextOpen)}\n >\n <ListItem.Root\n ref={forwardedRef}\n id={id}\n {...attendableAttrs}\n classNames={[\n 'grid col-span-2 group/section',\n active === 'overlay' ? stackColumns : 'grid-cols-subgrid snap-start',\n ]}\n style={draggableStyle}\n >\n <div\n role='none'\n className={mx(\n 'grid col-span-2 grid-cols-subgrid',\n 'bg-base focus-within:border-separator focus-within:attention-within',\n hoverableControls,\n hoverableFocusedWithinControls,\n (active || hasAttention) && 'attention-surface border-separator',\n (active === 'origin' || active === 'rearrange' || active === 'destination') && 'opacity-0',\n )}\n >\n <div\n role='toolbar'\n aria-orientation='vertical'\n aria-label={t('section controls label')}\n {...(!active && { tabIndex: 0 })}\n {...(!active && sectionActionsToolbar)}\n className={mx(\n 'grid grid-cols-subgrid ch-focus-ring rounded-sm grid-rows-[min-content_min-content_1fr] m-1',\n 'group-has-[[role=toolbar][aria-orientation=horizontal]]/section:pbs-[--rail-action]',\n )}\n >\n <div role='none' className='sticky -block-start-px bg-[--sticky-bg]'>\n <DropdownMenu.Root\n {...{\n open: optionsMenuOpen,\n onOpenChange: setOptionsMenuOpen,\n }}\n >\n <DropDownMenuDragHandleTrigger active={!!active} variant='ghost' classNames='m-0' {...draggableProps}>\n <Icon icon={icon} size={5} classNames='transition-opacity' />\n </DropDownMenuDragHandleTrigger>\n <DropdownMenu.Portal>\n <DropdownMenu.Content>\n <DropdownMenu.Viewport>\n {collapsed ? (\n <DropdownMenu.Item onClick={onNavigate} data-testid='section.navigate-to'>\n <ArrowSquareOut className={mx(getSize(5), 'mr-2')} />\n <span className='grow'>{t('navigate to section label')}</span>\n </DropdownMenu.Item>\n ) : (\n <CollapsiblePrimitive.Trigger asChild>\n <DropdownMenu.Item>\n <CaretDownUp className={mx(getSize(5), 'mr-2')} />\n <span className='grow'>{t('collapse label')}</span>\n </DropdownMenu.Item>\n </CollapsiblePrimitive.Trigger>\n )}\n <DropdownMenu.Item onClick={onAddBefore} data-testid='section.add-before'>\n <ArrowLineUp className={mx(getSize(5), 'mr-2')} />\n <span className='grow'>{t('add section before label')}</span>\n </DropdownMenu.Item>\n <DropdownMenu.Item onClick={onAddAfter} data-testid='section.add-after'>\n <ArrowLineDown className={mx(getSize(5), 'mr-2')} />\n <span className='grow'>{t('add section after label')}</span>\n </DropdownMenu.Item>\n <DropdownMenu.Item onClick={() => onDelete?.()} data-testid='section.remove'>\n <Trash className={mx(getSize(5), 'mr-2')} />\n <span className='grow'>{t('remove section label')}</span>\n </DropdownMenu.Item>\n </DropdownMenu.Viewport>\n <DropdownMenu.Arrow />\n </DropdownMenu.Content>\n </DropdownMenu.Portal>\n </DropdownMenu.Root>\n {collapsed ? (\n <CollapsiblePrimitive.Trigger asChild>\n <Button variant='ghost' classNames={sectionActionDimensions}>\n <span className='sr-only'>{t('expand label')}</span>\n <CaretUpDown className={getSize(4)} />\n </Button>\n </CollapsiblePrimitive.Trigger>\n ) : (\n <Button\n variant='ghost'\n classNames={sectionActionDimensions}\n onClick={onNavigate}\n data-testid='section.navigate-to'\n >\n <ArrowSquareOut className={mx(getSize(4))} />\n <span className='sr-only'>{t('navigate to section label')}</span>\n </Button>\n )}\n </div>\n </div>\n\n {/* Main content */}\n\n <ListItem.Heading\n classNames={collapsed ? ['grid grid-rows-subgrid grid-cols-subgrid items-center', focusRing] : 'sr-only'}\n {...(collapsed && { ...sectionContentGroup, tabIndex: 0 })}\n >\n {/*\n TODO(thure): This needs to be made extensible; Markdown document titles especially are difficult.\n Using `Surface` in a UI package like this would be unprecedented and needs motivation.\n Refactoring to use subcomponents is complicated by sections being a sortable Mosaic Tile.\n Reevaluate when work on collections (Folders, Stacks, etc) settles.\n */}\n <span className='truncate'>{title}</span>\n </ListItem.Heading>\n {size === 'intrinsic' ? (\n <CollapsiblePrimitive.Content\n {...(!collapsed && {\n ...sectionContentGroup,\n tabIndex: 0,\n })}\n // TODO(burdon): Add margin to fragment?\n className={mx(focusRing, 'm-[2px]')}\n >\n {children}\n </CollapsiblePrimitive.Content>\n ) : (\n <CollapsiblePrimitive.Content asChild>\n <ScrollArea.Root\n type='always'\n {...(!collapsed && { ...sectionContentGroup, tabIndex: 0 })}\n classNames={mx(focusRing, 'is-full has-[[data-radix-scroll-area-viewport]]:pbe-4')}\n >\n <ScrollArea.Viewport>{children}</ScrollArea.Viewport>\n <ScrollArea.Scrollbar\n orientation='horizontal'\n variant='coarse'\n classNames='hidden has-[div]:flex !inline-end-[max(.25rem,var(--radix-scroll-area-corner-width))]'\n >\n <ScrollArea.Thumb />\n </ScrollArea.Scrollbar>\n <ScrollArea.Scrollbar orientation='vertical' variant='coarse' classNames='hidden has-[div]:flex'>\n <ScrollArea.Thumb />\n </ScrollArea.Scrollbar>\n <ScrollArea.Corner />\n </ScrollArea.Root>\n </CollapsiblePrimitive.Content>\n )}\n </div>\n {isResizable && !collapsed && (\n <button className={resizeHandleStyles}>\n <span className='sr-only'>{t('resize section label')}</span>\n </button>\n )}\n </ListItem.Root>\n </CollapsiblePrimitive.Root>\n );\n },\n);\n\nexport type SectionToolbarProps = ThemedClassName<ComponentPropsWithRef<'div'>>;\n\n// TODO(burdon): block-start\nexport const sectionToolbarLayout =\n 'bs-[--rail-action] bg-[--sticky-bg] sticky block-start-0 __-block-start-px transition-opacity';\n\nexport const SectionToolbar = ({ children, classNames }: SectionToolbarProps) => {\n return (\n <Toolbar.Root orientation='horizontal' classNames={[sectionToolbarLayout, hoverableControlItem, classNames]}>\n {children}\n </Toolbar.Root>\n );\n};\n\nexport const SectionTile: MosaicTileComponent<\n StackSectionItem,\n HTMLLIElement\n // TODO(wittjosiah): If props is specified there is a type error with Mosaic.Container.\n // { itemContext: StackContextValue }\n> = forwardRef(({ path, type, active, draggableStyle, draggableProps, item, itemContext }, forwardedRef) => {\n const { t } = useTranslation(translationKey);\n const { activeItem } = useMosaic();\n\n const separation = !!itemContext?.separation;\n const isResizable = !!itemContext?.isResizable;\n const { transform, onDeleteSection, onNavigateToSection, onAddSection, onCollapseSection, SectionContent } =\n itemContext as StackContextValue;\n\n const transformedItem = transform\n ? transform(\n item,\n // TODO(wittjosiah): `active` doesn't always seem to be accurate here.\n activeItem?.item.id === item.id ? activeItem?.type : type,\n )\n : item;\n\n const placeholder = transformedItem.metadata?.placeholder ?? ['untitled section title', { ns: translationKey }];\n const title = transformedItem.view?.title ?? toLocalizedString(placeholder, t);\n\n const section = (\n <Section\n ref={forwardedRef}\n title={title}\n id={transformedItem.id}\n size={transformedItem.view?.size}\n icon={transformedItem.metadata?.icon}\n collapsed={transformedItem.view?.collapsed}\n separation={separation}\n active={active}\n draggableProps={draggableProps}\n draggableStyle={draggableStyle}\n onCollapseSection={onCollapseSection}\n isResizable={isResizable}\n onDelete={() => onDeleteSection?.(path)}\n onNavigate={() => onNavigateToSection?.(transformedItem)}\n onAddAfter={() => onAddSection?.(path, 'after')}\n onAddBefore={() => onAddSection?.(path, 'before')}\n >\n {SectionContent && <SectionContent data={transformedItem.object} />}\n </Section>\n );\n\n return active === 'overlay' ? <List>{section}</List> : section;\n});\n", "//\n// Copyright 2024 DXOS.org\n//\n\nimport { type IconProps } from '@phosphor-icons/react';\nimport React from 'react';\n\nexport const CaretDownUp = ({ children, weight, ...props }: IconProps) => {\n return (\n <svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 256 256' {...props}>\n <rect width='256' height='256' fill='none' />\n <polyline\n points='80 224 128 176 176 224'\n fill='none'\n stroke='currentColor'\n strokeLinecap='round'\n strokeLinejoin='round'\n strokeWidth='16'\n />\n <polyline\n points='80 32 128 80 176 32'\n fill='none'\n stroke='currentColor'\n strokeLinecap='round'\n strokeLinejoin='round'\n strokeWidth='16'\n />\n {children}\n </svg>\n );\n};\n", "//\n// Copyright 2024 DXOS.org\n//\n\nexport const stackColumns = 'grid-cols-[var(--rail-size)_calc(100%-var(--rail-size))]';\n", "//\n// Copyright 2023 DXOS.org\n//\n\nexport const translationKey = 'stack';\n\nexport default [\n {\n 'en-US': {\n [translationKey]: {\n 'empty stack message': 'Drag items into the stack.',\n 'remove section label': 'Delete',\n 'navigate to section label': 'Navigate to item',\n 'untitled section title': 'Untitled section',\n 'add section before label': 'Add before',\n 'add section after label': 'Add after',\n 'expand label': 'Expand',\n 'collapse label': 'Collapse',\n },\n },\n },\n];\n"],
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAIA,2BAA2D;AAC3D,mBAA+C;AAC/C,mCAAkC;AAElC,sBAAqC;AACrC,6BAQO;AACP,4BAA8B;ACd9B,IAAAA,wBAAwD;AACxD,IAAAC,
|
|
6
|
-
"names": ["import_react_tabster", "import_react", "import_react_ui", "import_react_ui_mosaic", "import_react_ui_theme", "CaretDownUp", "children", "weight", "props", "React", "svg", "xmlns", "viewBox", "rect", "width", "height", "fill", "polyline", "points", "stroke", "strokeLinecap", "strokeLinejoin", "strokeWidth", "stackColumns", "translationKey", "sectionActionDimensions", "resizeHandleStyles", "mx", "resizeHandle", "resizeHandleHorizontal", "Section", "forwardRef", "id", "title", "icon", "size", "collapsed", "active", "isResizable", "draggableProps", "draggableStyle", "onDelete", "onNavigate", "onAddBefore", "onAddAfter", "onCollapseSection", "forwardedRef", "t", "useTranslation", "optionsMenuOpen", "setOptionsMenuOpen", "useState", "sectionActionsToolbar", "useTabsterAttributes", "groupper", "focusable", "mover", "cyclic", "direction", "memorizeCurrent", "sectionContentGroup", "useFocusableGroup", "attendableAttrs", "createAttendableAttributes", "hasAttention", "useHasAttention", "Root", "asChild", "open", "onOpenChange", "nextOpen", "ListItem", "ref", "classNames", "style", "div", "role", "className", "hoverableControls", "hoverableFocusedWithinControls", "aria-orientation", "aria-label", "tabIndex", "DropdownMenu", "DropDownMenuDragHandleTrigger", "variant", "
|
|
4
|
+
"sourcesContent": ["//\n// Copyright 2023 DXOS.org\n//\n\nimport { useArrowNavigationGroup, useFocusableGroup } from '@fluentui/react-tabster';\nimport React, { forwardRef, useCallback } from 'react';\nimport { useResizeDetector } from 'react-resize-detector';\n\nimport { List, useTranslation } from '@dxos/react-ui';\nimport {\n type MosaicContainerProps,\n type MosaicTileComponent,\n Mosaic,\n Path,\n useContainer,\n useItemsWithPreview,\n useMosaic,\n} from '@dxos/react-ui-mosaic';\nimport { dropRingInner } from '@dxos/react-ui-theme';\n\nimport {\n type CollapsedSections,\n type AddSectionPosition,\n SectionTile,\n type StackContextValue,\n type StackItem,\n type StackSectionContent,\n type StackSectionItem,\n} from './Section';\nimport { stackColumns } from './style-fragments';\nimport { translationKey } from '../translations';\n\nexport type Direction = 'horizontal' | 'vertical';\n\nexport type { CollapsedSections, AddSectionPosition };\n\nexport const DEFAULT_TYPE = 'stack-section';\n\nexport type StackProps<TData extends StackSectionContent = StackSectionContent> = Omit<\n MosaicContainerProps<TData, number>,\n 'debug' | 'Component'\n> &\n Omit<StackContextValue<TData>, 'setCollapsedSections'> & {\n items?: StackSectionItem[];\n separation?: boolean; // TODO(burdon): Style.\n onCollapseSection?: (id: string, collapsed: boolean) => void;\n emptyComponent?: React.ReactNode;\n };\n\nexport const Stack = ({\n id,\n type = DEFAULT_TYPE,\n SectionContent,\n items = [],\n separation = true,\n transform,\n onOver,\n onDrop,\n onAddSection,\n onDeleteSection,\n onNavigateToSection,\n onCollapseSection,\n ...props\n}: StackProps) => {\n const { ref: containerRef, width = 0 } = useResizeDetector<HTMLDivElement>({ refreshRate: 200 });\n const { operation, overItem } = useMosaic();\n const itemsWithPreview = useItemsWithPreview({ path: id, items });\n\n const getOverlayStyle = useCallback(() => ({ width }), [width]);\n const getOverlayProps = useCallback(\n () => ({ itemContext: { transform, SectionContent } }),\n [transform, SectionContent],\n );\n\n // TODO(thure): The root cause of the discrepancy between `activeNodeRect.top` and `overlayNodeRect.top` in Composer\n // in particular is not yet known, so this solution may may backfire in unforeseeable cases.\n const stackModifier = useCallback<Exclude<MosaicContainerProps['modifier'], undefined>>(\n (_activeItem, { transform, activeNodeRect, overlayNodeRect }) => {\n if (activeNodeRect && overlayNodeRect) {\n transform.y += activeNodeRect?.top - overlayNodeRect?.top;\n }\n return transform;\n },\n [],\n );\n\n return (\n <Mosaic.Container\n {...{\n id,\n type,\n Component: SectionTile as MosaicTileComponent<StackSectionItem, HTMLDivElement>,\n getOverlayStyle,\n getOverlayProps,\n onOver,\n onDrop,\n modifier: stackModifier,\n }}\n >\n <Mosaic.DroppableTile\n path={id}\n type={type}\n item={{ id, items: itemsWithPreview }}\n // TODO(wittjosiah): Should this actually be a context?\n itemContext={{\n separation,\n transform,\n onDeleteSection,\n onNavigateToSection,\n onAddSection,\n onCollapseSection,\n SectionContent,\n }}\n isOver={\n overItem &&\n !!overItem.path &&\n Path.hasRoot(overItem.path, id) &&\n (operation === 'copy' || operation === 'transfer')\n }\n Component={StackTile}\n {...props}\n ref={containerRef}\n />\n </Mosaic.Container>\n );\n};\n\nconst StackTile: MosaicTileComponent<StackItem, HTMLOListElement, Pick<StackProps, 'emptyComponent'>> = forwardRef(\n ({ classNames, path, isOver, item: { items }, itemContext, type: _type, emptyComponent, ...props }, forwardedRef) => {\n const { t } = useTranslation(translationKey);\n const { Component, type } = useContainer();\n const domAttributes = useArrowNavigationGroup({ axis: 'grid' });\n const { activeItem } = useMosaic();\n\n // NOTE(thure): Ensure “groupper” is available, but no need to use it here.\n const _group = useFocusableGroup();\n\n // NOTE: Keep outer padding the same as MarkdownMain.\n return (\n <List\n ref={forwardedRef}\n classNames={['grid relative', stackColumns, isOver && dropRingInner, classNames]}\n {...(!activeItem && domAttributes)}\n {...props}\n >\n {items.length > 0 ? (\n <Mosaic.SortableContext items={items} direction='vertical'>\n {items.map((item, index) => (\n <Mosaic.SortableTile\n key={item.id}\n item={item}\n itemContext={itemContext}\n path={path}\n type={type}\n position={index}\n Component={Component}\n />\n ))}\n </Mosaic.SortableContext>\n ) : emptyComponent !== undefined ? (\n <>{emptyComponent}</>\n ) : (\n <p\n className='grid col-span-2 text-center p-4 border border-dashed border-neutral-500/50 rounded'\n data-testid='stack.empty'\n >\n {t('empty stack message')}\n </p>\n )}\n </List>\n );\n },\n);\n", "//\n// Copyright 2023 DXOS.org\n//\n\nimport { useFocusableGroup, useTabsterAttributes } from '@fluentui/react-tabster';\nimport {\n ArrowLineDown,\n ArrowLineUp,\n ArrowSquareOut,\n CaretUpDown,\n DotsNine,\n type IconProps,\n Trash,\n} from '@phosphor-icons/react';\nimport * as CollapsiblePrimitive from '@radix-ui/react-collapsible';\nimport React, {\n forwardRef,\n useState,\n type ForwardRefExoticComponent,\n type RefAttributes,\n type FC,\n type PropsWithChildren,\n type ComponentPropsWithRef,\n} from 'react';\n\nimport {\n Button,\n DropdownMenu,\n type Label,\n List,\n ListItem,\n ScrollArea,\n type ThemedClassName,\n Toolbar,\n toLocalizedString,\n useTranslation,\n} from '@dxos/react-ui';\nimport { createAttendableAttributes, useHasAttention } from '@dxos/react-ui-attention';\nimport { DropDownMenuDragHandleTrigger, resizeHandle, resizeHandleHorizontal } from '@dxos/react-ui-deck';\nimport {\n type MosaicActiveType,\n type MosaicDataItem,\n type MosaicTileComponent,\n type MosaicTileProps,\n useMosaic,\n} from '@dxos/react-ui-mosaic';\nimport {\n focusRing,\n getSize,\n hoverableControlItem,\n hoverableControls,\n hoverableFocusedWithinControls,\n mx,\n} from '@dxos/react-ui-theme';\n\nimport { CaretDownUp } from './CaretDownUp';\nimport { stackColumns } from './style-fragments';\nimport { translationKey } from '../translations';\n\nconst sectionActionDimensions = 'p-1 shrink-0 min-bs-0 is-[--rail-action] bs-min';\n\nexport type StackSectionContent = MosaicDataItem;\n\nexport type CollapsedSections = Record<string, boolean>;\n\nexport type AddSectionPosition = 'before' | 'after' | 'beforeAll' | 'afterAll';\n\nexport type StackContextValue<TData extends StackSectionContent = StackSectionContent> = {\n SectionContent: FC<{ data: TData }>;\n separation?: boolean;\n isResizable?: boolean;\n transform?: (item: MosaicDataItem, type?: string) => StackSectionItem;\n onDeleteSection?: (path: string) => void;\n onAddSection?: (path: string, position: AddSectionPosition) => void;\n onNavigateToSection?: (object: MosaicDataItem) => void;\n onCollapseSection?: (id: string, collapsed: boolean) => void;\n};\n\nexport type StackItem = MosaicDataItem & {\n items: StackSectionItem[];\n};\n\nexport type StackSectionItem = MosaicDataItem & {\n object: StackSectionContent;\n // TODO(wittjosiah): Use effect schema? Share schema with echo.\n view?: {\n title?: string;\n size?: SectionSize;\n height?: number;\n collapsed?: boolean;\n custom?: Record<string, any>;\n };\n // TODO(wittjosiah): Common type? Factor out?\n metadata?: {\n icon?: FC<IconProps>;\n placeholder?: Label;\n viewActions?: (item: StackSectionItem) => StackAction;\n };\n};\n\nexport type StackAction = {\n icon: FC<IconProps>;\n label: Label;\n onClick: () => void;\n};\n\nexport type SectionSize = 'intrinsic' | 'extrinsic';\n\nexport type SectionProps = PropsWithChildren<\n {\n // Data props.\n id: string;\n title: string;\n\n // Tile props.\n active?: MosaicActiveType;\n } & Pick<\n MosaicTileProps,\n 'draggableProps' | 'draggableStyle' | 'onDelete' | 'onNavigate' | 'onAddAfter' | 'onAddBefore'\n > &\n Pick<StackContextValue, 'separation' | 'isResizable' | 'onCollapseSection'> &\n Pick<Required<StackSectionItem>['view'], 'collapsed' | 'size'> &\n Pick<Required<StackSectionItem>['metadata'], 'icon'>\n>;\n\nconst resizeHandleStyles = mx(resizeHandle, resizeHandleHorizontal, 'is-full bs-[--rail-action] col-start-2');\n\nexport const Section: ForwardRefExoticComponent<SectionProps & RefAttributes<HTMLLIElement>> = forwardRef<\n HTMLLIElement,\n SectionProps\n>(\n (\n {\n id,\n title,\n icon: Icon = DotsNine,\n size = 'intrinsic',\n collapsed,\n active,\n isResizable,\n draggableProps,\n draggableStyle,\n onDelete,\n onNavigate,\n onAddBefore,\n onAddAfter,\n onCollapseSection,\n children,\n },\n forwardedRef,\n ) => {\n const { t } = useTranslation(translationKey);\n const [optionsMenuOpen, setOptionsMenuOpen] = useState(false);\n const sectionActionsToolbar = useTabsterAttributes({\n groupper: {},\n focusable: {},\n mover: { cyclic: true, direction: 1, memorizeCurrent: false },\n });\n const sectionContentGroup = useFocusableGroup({});\n const attendableAttrs = createAttendableAttributes(id);\n const hasAttention = useHasAttention(id);\n\n return (\n <CollapsiblePrimitive.Root\n asChild\n open={!collapsed}\n onOpenChange={(nextOpen) => onCollapseSection?.(id, !nextOpen)}\n >\n <ListItem.Root\n ref={forwardedRef}\n id={id}\n {...attendableAttrs}\n classNames={[\n 'grid col-span-2 group/section',\n active === 'overlay' ? stackColumns : 'grid-cols-subgrid snap-start',\n ]}\n style={draggableStyle}\n >\n <div\n role='none'\n className={mx(\n 'grid col-span-2 grid-cols-subgrid',\n 'bg-base focus-within:border-separator focus-within:attention-within',\n hoverableControls,\n hoverableFocusedWithinControls,\n (active || hasAttention) && 'attention-surface border-separator',\n (active === 'origin' || active === 'rearrange' || active === 'destination') && 'opacity-0',\n )}\n >\n <div\n role='toolbar'\n aria-orientation='vertical'\n aria-label={t('section controls label')}\n {...(!active && { tabIndex: 0 })}\n {...(!active && sectionActionsToolbar)}\n className={mx(\n 'grid grid-cols-subgrid ch-focus-ring rounded-sm grid-rows-[min-content_min-content_1fr] m-1',\n 'group-has-[[role=toolbar][aria-orientation=horizontal]]/section:pbs-[--rail-action]',\n )}\n >\n <div role='none' className='sticky -block-start-px bg-[--sticky-bg]'>\n <DropdownMenu.Root\n {...{\n open: optionsMenuOpen,\n onOpenChange: setOptionsMenuOpen,\n }}\n >\n <DropDownMenuDragHandleTrigger active={!!active} variant='ghost' classNames='m-0' {...draggableProps}>\n <Icon className={mx(getSize(5), 'transition-opacity')} />\n </DropDownMenuDragHandleTrigger>\n <DropdownMenu.Portal>\n <DropdownMenu.Content>\n <DropdownMenu.Viewport>\n {collapsed ? (\n <DropdownMenu.Item onClick={onNavigate} data-testid='section.navigate-to'>\n <ArrowSquareOut className={mx(getSize(5), 'mr-2')} />\n <span className='grow'>{t('navigate to section label')}</span>\n </DropdownMenu.Item>\n ) : (\n <CollapsiblePrimitive.Trigger asChild>\n <DropdownMenu.Item>\n <CaretDownUp className={mx(getSize(5), 'mr-2')} />\n <span className='grow'>{t('collapse label')}</span>\n </DropdownMenu.Item>\n </CollapsiblePrimitive.Trigger>\n )}\n <DropdownMenu.Item onClick={onAddBefore} data-testid='section.add-before'>\n <ArrowLineUp className={mx(getSize(5), 'mr-2')} />\n <span className='grow'>{t('add section before label')}</span>\n </DropdownMenu.Item>\n <DropdownMenu.Item onClick={onAddAfter} data-testid='section.add-after'>\n <ArrowLineDown className={mx(getSize(5), 'mr-2')} />\n <span className='grow'>{t('add section after label')}</span>\n </DropdownMenu.Item>\n <DropdownMenu.Item onClick={() => onDelete?.()} data-testid='section.remove'>\n <Trash className={mx(getSize(5), 'mr-2')} />\n <span className='grow'>{t('remove section label')}</span>\n </DropdownMenu.Item>\n </DropdownMenu.Viewport>\n <DropdownMenu.Arrow />\n </DropdownMenu.Content>\n </DropdownMenu.Portal>\n </DropdownMenu.Root>\n {collapsed ? (\n <CollapsiblePrimitive.Trigger asChild>\n <Button variant='ghost' classNames={sectionActionDimensions}>\n <span className='sr-only'>{t('expand label')}</span>\n <CaretUpDown className={getSize(4)} />\n </Button>\n </CollapsiblePrimitive.Trigger>\n ) : (\n <Button\n variant='ghost'\n classNames={sectionActionDimensions}\n onClick={onNavigate}\n data-testid='section.navigate-to'\n >\n <ArrowSquareOut className={mx(getSize(4))} />\n <span className='sr-only'>{t('navigate to section label')}</span>\n </Button>\n )}\n </div>\n </div>\n\n {/* Main content */}\n\n <ListItem.Heading\n classNames={collapsed ? ['grid grid-rows-subgrid grid-cols-subgrid items-center', focusRing] : 'sr-only'}\n {...(collapsed && { ...sectionContentGroup, tabIndex: 0 })}\n >\n {/*\n TODO(thure): This needs to be made extensible; Markdown document titles especially are difficult.\n Using `Surface` in a UI package like this would be unprecedented and needs motivation.\n Refactoring to use subcomponents is complicated by sections being a sortable Mosaic Tile.\n Reevaluate when work on collections (Folders, Stacks, etc) settles.\n */}\n <span className='truncate'>{title}</span>\n </ListItem.Heading>\n {size === 'intrinsic' ? (\n <CollapsiblePrimitive.Content\n {...(!collapsed && {\n ...sectionContentGroup,\n tabIndex: 0,\n })}\n // TODO(burdon): Add margin to fragment?\n className={mx(focusRing, 'm-[2px]')}\n >\n {children}\n </CollapsiblePrimitive.Content>\n ) : (\n <CollapsiblePrimitive.Content asChild>\n <ScrollArea.Root\n type='always'\n {...(!collapsed && { ...sectionContentGroup, tabIndex: 0 })}\n classNames={mx(focusRing, 'is-full has-[[data-radix-scroll-area-viewport]]:pbe-4')}\n >\n <ScrollArea.Viewport>{children}</ScrollArea.Viewport>\n <ScrollArea.Scrollbar\n orientation='horizontal'\n variant='coarse'\n classNames='hidden has-[div]:flex !inline-end-[max(.25rem,var(--radix-scroll-area-corner-width))]'\n >\n <ScrollArea.Thumb />\n </ScrollArea.Scrollbar>\n <ScrollArea.Scrollbar orientation='vertical' variant='coarse' classNames='hidden has-[div]:flex'>\n <ScrollArea.Thumb />\n </ScrollArea.Scrollbar>\n <ScrollArea.Corner />\n </ScrollArea.Root>\n </CollapsiblePrimitive.Content>\n )}\n </div>\n {isResizable && !collapsed && (\n <button className={resizeHandleStyles}>\n <span className='sr-only'>{t('resize section label')}</span>\n </button>\n )}\n </ListItem.Root>\n </CollapsiblePrimitive.Root>\n );\n },\n);\n\nexport type SectionToolbarProps = ThemedClassName<ComponentPropsWithRef<'div'>>;\n\n// TODO(burdon): block-start\nexport const sectionToolbarLayout =\n 'bs-[--rail-action] bg-[--sticky-bg] sticky block-start-0 __-block-start-px transition-opacity';\n\nexport const SectionToolbar = ({ children, classNames }: SectionToolbarProps) => {\n return (\n <Toolbar.Root orientation='horizontal' classNames={[sectionToolbarLayout, hoverableControlItem, classNames]}>\n {children}\n </Toolbar.Root>\n );\n};\n\nexport const SectionTile: MosaicTileComponent<\n StackSectionItem,\n HTMLLIElement\n // TODO(wittjosiah): If props is specified there is a type error with Mosaic.Container.\n // { itemContext: StackContextValue }\n> = forwardRef(({ path, type, active, draggableStyle, draggableProps, item, itemContext }, forwardedRef) => {\n const { t } = useTranslation(translationKey);\n const { activeItem } = useMosaic();\n\n const separation = !!itemContext?.separation;\n const isResizable = !!itemContext?.isResizable;\n const { transform, onDeleteSection, onNavigateToSection, onAddSection, onCollapseSection, SectionContent } =\n itemContext as StackContextValue;\n\n const transformedItem = transform\n ? transform(\n item,\n // TODO(wittjosiah): `active` doesn't always seem to be accurate here.\n activeItem?.item.id === item.id ? activeItem?.type : type,\n )\n : item;\n\n const placeholder = transformedItem.metadata?.placeholder ?? ['untitled section title', { ns: translationKey }];\n const title = transformedItem.view?.title ?? toLocalizedString(placeholder, t);\n\n const section = (\n <Section\n ref={forwardedRef}\n title={title}\n id={transformedItem.id}\n size={transformedItem.view?.size}\n icon={transformedItem.metadata?.icon}\n collapsed={transformedItem.view?.collapsed}\n separation={separation}\n active={active}\n draggableProps={draggableProps}\n draggableStyle={draggableStyle}\n onCollapseSection={onCollapseSection}\n isResizable={isResizable}\n onDelete={() => onDeleteSection?.(path)}\n onNavigate={() => onNavigateToSection?.(transformedItem)}\n onAddAfter={() => onAddSection?.(path, 'after')}\n onAddBefore={() => onAddSection?.(path, 'before')}\n >\n {SectionContent && <SectionContent data={transformedItem.object} />}\n </Section>\n );\n\n return active === 'overlay' ? <List>{section}</List> : section;\n});\n", "//\n// Copyright 2024 DXOS.org\n//\nimport { type IconProps } from '@phosphor-icons/react';\nimport React from 'react';\n\nexport const CaretDownUp = ({ children, weight, ...props }: IconProps) => {\n return (\n <svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 256 256' {...props}>\n <rect width='256' height='256' fill='none' />\n <polyline\n points='80 224 128 176 176 224'\n fill='none'\n stroke='currentColor'\n strokeLinecap='round'\n strokeLinejoin='round'\n strokeWidth='16'\n />\n <polyline\n points='80 32 128 80 176 32'\n fill='none'\n stroke='currentColor'\n strokeLinecap='round'\n strokeLinejoin='round'\n strokeWidth='16'\n />\n {children}\n </svg>\n );\n};\n", "//\n// Copyright 2024 DXOS.org\n//\n\nexport const stackColumns = 'grid-cols-[var(--rail-size)_calc(100%-var(--rail-size))]';\n", "//\n// Copyright 2023 DXOS.org\n//\n\nexport const translationKey = 'stack';\n\nexport default [\n {\n 'en-US': {\n [translationKey]: {\n 'empty stack message': 'Drag items into the stack.',\n 'remove section label': 'Delete',\n 'navigate to section label': 'Navigate to item',\n 'untitled section title': 'Untitled section',\n 'add section before label': 'Add before',\n 'add section after label': 'Add after',\n 'expand label': 'Expand',\n 'collapse label': 'Collapse',\n },\n },\n },\n];\n"],
|
|
5
|
+
"mappings": "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",
|
|
6
|
+
"names": ["import_react_tabster", "import_react", "import_react_ui", "import_react_ui_mosaic", "import_react_ui_theme", "CaretDownUp", "children", "weight", "props", "React", "svg", "xmlns", "viewBox", "rect", "width", "height", "fill", "polyline", "points", "stroke", "strokeLinecap", "strokeLinejoin", "strokeWidth", "stackColumns", "translationKey", "sectionActionDimensions", "resizeHandleStyles", "mx", "resizeHandle", "resizeHandleHorizontal", "Section", "forwardRef", "id", "title", "icon", "Icon", "DotsNine", "size", "collapsed", "active", "isResizable", "draggableProps", "draggableStyle", "onDelete", "onNavigate", "onAddBefore", "onAddAfter", "onCollapseSection", "forwardedRef", "t", "useTranslation", "optionsMenuOpen", "setOptionsMenuOpen", "useState", "sectionActionsToolbar", "useTabsterAttributes", "groupper", "focusable", "mover", "cyclic", "direction", "memorizeCurrent", "sectionContentGroup", "useFocusableGroup", "attendableAttrs", "createAttendableAttributes", "hasAttention", "useHasAttention", "Root", "asChild", "open", "onOpenChange", "nextOpen", "ListItem", "ref", "classNames", "style", "div", "role", "className", "hoverableControls", "hoverableFocusedWithinControls", "aria-orientation", "aria-label", "tabIndex", "DropdownMenu", "DropDownMenuDragHandleTrigger", "variant", "getSize", "Portal", "Content", "Viewport", "Item", "onClick", "data-testid", "ArrowSquareOut", "span", "Trigger", "ArrowLineUp", "ArrowLineDown", "Trash", "Arrow", "Button", "CaretUpDown", "Heading", "focusRing", "ScrollArea", "type", "Scrollbar", "orientation", "Thumb", "Corner", "button", "sectionToolbarLayout", "SectionToolbar", "Toolbar", "hoverableControlItem", "SectionTile", "path", "item", "itemContext", "activeItem", "useMosaic", "separation", "transform", "onDeleteSection", "onNavigateToSection", "onAddSection", "SectionContent", "transformedItem", "placeholder", "metadata", "ns", "view", "toLocalizedString", "section", "data", "object", "List", "DEFAULT_TYPE", "Stack", "items", "onOver", "onDrop", "containerRef", "useResizeDetector", "refreshRate", "operation", "overItem", "itemsWithPreview", "useItemsWithPreview", "getOverlayStyle", "useCallback", "getOverlayProps", "stackModifier", "_activeItem", "activeNodeRect", "overlayNodeRect", "y", "top", "Mosaic", "Container", "Component", "modifier", "DroppableTile", "isOver", "Path", "hasRoot", "StackTile", "_type", "emptyComponent", "useContainer", "domAttributes", "useArrowNavigationGroup", "axis", "_group", "dropRingInner", "length", "SortableContext", "map", "index", "SortableTile", "key", "position", "undefined", "p"]
|
|
7
7
|
}
|
package/dist/lib/node/meta.json
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"inputs":{"packages/ui/react-ui-stack/src/components/CaretDownUp.tsx":{"bytes":3080,"imports":[{"path":"react","kind":"import-statement","external":true}],"format":"esm"},"packages/ui/react-ui-stack/src/components/style-fragments.ts":{"bytes":707,"imports":[],"format":"esm"},"packages/ui/react-ui-stack/src/translations.ts":{"bytes":2050,"imports":[],"format":"esm"},"packages/ui/react-ui-stack/src/components/Section.tsx":{"bytes":
|
|
1
|
+
{"inputs":{"packages/ui/react-ui-stack/src/components/CaretDownUp.tsx":{"bytes":3080,"imports":[{"path":"react","kind":"import-statement","external":true}],"format":"esm"},"packages/ui/react-ui-stack/src/components/style-fragments.ts":{"bytes":707,"imports":[],"format":"esm"},"packages/ui/react-ui-stack/src/translations.ts":{"bytes":2050,"imports":[],"format":"esm"},"packages/ui/react-ui-stack/src/components/Section.tsx":{"bytes":40329,"imports":[{"path":"@fluentui/react-tabster","kind":"import-statement","external":true},{"path":"@phosphor-icons/react","kind":"import-statement","external":true},{"path":"@radix-ui/react-collapsible","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-attention","kind":"import-statement","external":true},{"path":"@dxos/react-ui-deck","kind":"import-statement","external":true},{"path":"@dxos/react-ui-mosaic","kind":"import-statement","external":true},{"path":"@dxos/react-ui-theme","kind":"import-statement","external":true},{"path":"packages/ui/react-ui-stack/src/components/CaretDownUp.tsx","kind":"import-statement","original":"./CaretDownUp"},{"path":"packages/ui/react-ui-stack/src/components/style-fragments.ts","kind":"import-statement","original":"./style-fragments"},{"path":"packages/ui/react-ui-stack/src/translations.ts","kind":"import-statement","original":"../translations"}],"format":"esm"},"packages/ui/react-ui-stack/src/components/Stack.tsx":{"bytes":16626,"imports":[{"path":"@fluentui/react-tabster","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true},{"path":"react-resize-detector","kind":"import-statement","external":true},{"path":"@dxos/react-ui","kind":"import-statement","external":true},{"path":"@dxos/react-ui-mosaic","kind":"import-statement","external":true},{"path":"@dxos/react-ui-theme","kind":"import-statement","external":true},{"path":"packages/ui/react-ui-stack/src/components/Section.tsx","kind":"import-statement","original":"./Section"},{"path":"packages/ui/react-ui-stack/src/components/style-fragments.ts","kind":"import-statement","original":"./style-fragments"},{"path":"packages/ui/react-ui-stack/src/translations.ts","kind":"import-statement","original":"../translations"}],"format":"esm"},"packages/ui/react-ui-stack/src/components/index.ts":{"bytes":832,"imports":[{"path":"packages/ui/react-ui-stack/src/components/Stack.tsx","kind":"import-statement","original":"./Stack"},{"path":"packages/ui/react-ui-stack/src/components/Section.tsx","kind":"import-statement","original":"./Section"}],"format":"esm"},"packages/ui/react-ui-stack/src/index.ts":{"bytes":718,"imports":[{"path":"packages/ui/react-ui-stack/src/components/index.ts","kind":"import-statement","original":"./components"},{"path":"packages/ui/react-ui-stack/src/translations.ts","kind":"import-statement","original":"./translations"}],"format":"esm"},"packages/ui/react-ui-stack/src/testing/generator.ts":{"bytes":12332,"imports":[{"path":"@dxos/echo-schema","kind":"import-statement","external":true},{"path":"@dxos/random","kind":"import-statement","external":true}],"format":"esm"},"packages/ui/react-ui-stack/src/testing/stack-manager.ts":{"bytes":7412,"imports":[],"format":"esm"},"packages/ui/react-ui-stack/src/testing/index.ts":{"bytes":612,"imports":[{"path":"packages/ui/react-ui-stack/src/testing/generator.ts","kind":"import-statement","original":"./generator"},{"path":"packages/ui/react-ui-stack/src/testing/stack-manager.ts","kind":"import-statement","original":"./stack-manager"}],"format":"esm"}},"outputs":{"packages/ui/react-ui-stack/dist/lib/node/index.cjs.map":{"imports":[],"exports":[],"inputs":{},"bytes":34006},"packages/ui/react-ui-stack/dist/lib/node/index.cjs":{"imports":[{"path":"@fluentui/react-tabster","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true},{"path":"react-resize-detector","kind":"import-statement","external":true},{"path":"@dxos/react-ui","kind":"import-statement","external":true},{"path":"@dxos/react-ui-mosaic","kind":"import-statement","external":true},{"path":"@dxos/react-ui-theme","kind":"import-statement","external":true},{"path":"@fluentui/react-tabster","kind":"import-statement","external":true},{"path":"@phosphor-icons/react","kind":"import-statement","external":true},{"path":"@radix-ui/react-collapsible","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-attention","kind":"import-statement","external":true},{"path":"@dxos/react-ui-deck","kind":"import-statement","external":true},{"path":"@dxos/react-ui-mosaic","kind":"import-statement","external":true},{"path":"@dxos/react-ui-theme","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true}],"exports":["DEFAULT_TYPE","SectionToolbar","Stack","sectionToolbarLayout","translations"],"entryPoint":"packages/ui/react-ui-stack/src/index.ts","inputs":{"packages/ui/react-ui-stack/src/components/Stack.tsx":{"bytesInOutput":3542},"packages/ui/react-ui-stack/src/components/Section.tsx":{"bytesInOutput":10203},"packages/ui/react-ui-stack/src/components/CaretDownUp.tsx":{"bytesInOutput":779},"packages/ui/react-ui-stack/src/components/style-fragments.ts":{"bytesInOutput":79},"packages/ui/react-ui-stack/src/translations.ts":{"bytesInOutput":508},"packages/ui/react-ui-stack/src/components/index.ts":{"bytesInOutput":0},"packages/ui/react-ui-stack/src/index.ts":{"bytesInOutput":0}},"bytes":15669},"packages/ui/react-ui-stack/dist/lib/node/testing/index.cjs.map":{"imports":[],"exports":[],"inputs":{},"bytes":9963},"packages/ui/react-ui-stack/dist/lib/node/testing/index.cjs":{"imports":[{"path":"@dxos/echo-schema","kind":"import-statement","external":true},{"path":"@dxos/random","kind":"import-statement","external":true}],"exports":["Priority","SectionManager","StackManager","Status","TestObjectGenerator","defaultGenerators","range"],"entryPoint":"packages/ui/react-ui-stack/src/testing/index.ts","inputs":{"packages/ui/react-ui-stack/src/testing/generator.ts":{"bytesInOutput":2244},"packages/ui/react-ui-stack/src/testing/index.ts":{"bytesInOutput":0},"packages/ui/react-ui-stack/src/testing/stack-manager.ts":{"bytesInOutput":1569}},"bytes":4083}}}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"CaretDownUp.d.ts","sourceRoot":"","sources":["../../../../src/components/CaretDownUp.tsx"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"CaretDownUp.d.ts","sourceRoot":"","sources":["../../../../src/components/CaretDownUp.tsx"],"names":[],"mappings":"AAGA,OAAO,EAAE,KAAK,SAAS,EAAE,MAAM,uBAAuB,CAAC;AACvD,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,eAAO,MAAM,WAAW,mCAAoC,SAAS,sBAuBpE,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Deck.stories.d.ts","sourceRoot":"","sources":["../../../../src/components/Deck.stories.tsx"],"names":[],"mappings":"AAIA,OAAO,aAAa,CAAC;
|
|
1
|
+
{"version":3,"file":"Deck.stories.d.ts","sourceRoot":"","sources":["../../../../src/components/Deck.stories.tsx"],"names":[],"mappings":"AAIA,OAAO,aAAa,CAAC;AAarB,OAAO,KAAgE,MAAM,OAAO,CAAC;;;;;;;AAsFrF,wBAME;AAEF,eAAO,MAAM,iBAAiB;;;CAqB7B,CAAC;AAEF,eAAO,MAAM,kCAAkC;;;CAqB9C,CAAC;AA2CF,eAAO,MAAM,kBAAkB,yBAgL9B,CAAC"}
|