@dxos/react-ui-mosaic 0.9.1-staging.ee54ba693a → 0.11.0

package/dist/lib/browser/testing/index.mjs

@@ -1,136 +0,0 @@
-import {
-  Focus,
-  Mosaic
-} from "../chunk-OBVIYZLR.mjs";
-
-// src/testing/decorator.tsx
-import React from "react";
-var withMosaic = () => {
-  return (Story) => /* @__PURE__ */ React.createElement(Mosaic.Root, null, /* @__PURE__ */ React.createElement(Story, null));
-};
-
-// src/testing/types.ts
-import * as Schema from "effect/Schema";
-import { DXN, Ref, Type } from "@dxos/echo";
-import { EntityId } from "@dxos/keys";
-var TestItem = class extends Type.makeObject(DXN.make("com.example.type.item", "0.1.0"))(Schema.Struct({
-  name: Schema.String,
-  description: Schema.optional(Schema.String),
-  label: Schema.optional(Schema.String)
-})) {
-};
-var TestColumn = class extends Type.makeObject(DXN.make("com.example.type.column", "0.1.0"))(Schema.Struct({
-  id: EntityId,
-  name: Schema.String,
-  items: Schema.mutable(Schema.Array(Ref.Ref(TestItem)))
-})) {
-};
-
-// src/testing/CardContainer.tsx
-import { useControllableState } from "@radix-ui/react-use-controllable-state";
-import React2 from "react";
-import { Icon, Popover } from "@dxos/react-ui";
-import { ResizeHandle, resizeAttributes, sizeStyle } from "@dxos/react-ui-dnd";
-var DEFAULT_BLOCK_SIZE = 22;
-var MIN_BLOCK_SIZE = 8;
-var CardContainer = ({ children, role, icon = "ph--arrow-line-down--regular" }) => {
-  switch (role) {
-    case "popover":
-      return /* @__PURE__ */ React2.createElement("div", {
-        className: "flex justify-center"
-      }, /* @__PURE__ */ React2.createElement(PopoverCardContainer, {
-        icon
-      }, children));
-    case "intrinsic":
-    default:
-      return /* @__PURE__ */ React2.createElement(IntrinsicCardContainer, null, children);
-  }
-};
-var PopoverCardContainer = ({ children, icon = "ph--arrow-line-down--regular" }) => {
-  return /* @__PURE__ */ React2.createElement(Popover.Root, {
-    open: true
-  }, /* @__PURE__ */ React2.createElement(Popover.Trigger, {
-    asChild: true
-  }, /* @__PURE__ */ React2.createElement(Icon, {
-    icon
-  })), /* @__PURE__ */ React2.createElement(Popover.Portal, null, /* @__PURE__ */ React2.createElement(Popover.Content, {
-    onOpenAutoFocus: (event) => event.preventDefault()
-  }, /* @__PURE__ */ React2.createElement(Popover.Viewport, {
-    classNames: "dx-card-popover"
-  }, children), /* @__PURE__ */ React2.createElement(Popover.Arrow, null))));
-};
-var IntrinsicCardContainer = ({ children, defaultSize, size: propSize, onSizeChange }) => {
-  const [size = DEFAULT_BLOCK_SIZE, setSize] = useControllableState({
-    prop: propSize,
-    defaultProp: defaultSize,
-    onChange: onSizeChange
-  });
-  return /* @__PURE__ */ React2.createElement("div", {
-    className: "relative p-2 grid overflow-hidden border-2 border-dashed border-green-500 rounded-lg",
-    style: sizeStyle(size, "horizontal"),
-    ...resizeAttributes
-  }, /* @__PURE__ */ React2.createElement("div", {
-    className: "dx-container flex flex-col"
-  }, children), /* @__PURE__ */ React2.createElement(ResizeHandle, {
-    side: "inline-end",
-    fallbackSize: DEFAULT_BLOCK_SIZE,
-    minSize: MIN_BLOCK_SIZE,
-    size,
-    onSizeChange: setSize
-  }));
-};
-
-// src/testing/DefaultStackTile.tsx
-import React3, { useMemo, useRef, useState } from "react";
-import { Obj } from "@dxos/echo";
-import { Card, IconButton } from "@dxos/react-ui";
-import { Menu, createMenuAction } from "@dxos/react-ui-menu";
-import { JsonHighlighter } from "@dxos/react-ui-syntax-highlighter";
-var DefaultStackTile = (props) => {
-  const dragHandleRef = useRef(null);
-  const [open, setOpen] = useState(false);
-  const menuItems = useMemo(() => [
-    createMenuAction("toggle-details", () => setOpen((prev) => !prev), {
-      label: open ? "Hide details" : "Show details",
-      icon: "ph--circle-dashed--regular"
-    })
-  ], [
-    open
-  ]);
-  return /* @__PURE__ */ React3.createElement(Menu.Root, null, /* @__PURE__ */ React3.createElement(Mosaic.Tile, {
-    ...props,
-    asChild: true
-  }, /* @__PURE__ */ React3.createElement(Focus.Item, {
-    asChild: true
-  }, /* @__PURE__ */ React3.createElement(Card.Root, {
-    className: "dx-current dx-hover"
-  }, /* @__PURE__ */ React3.createElement(Card.Header, null, /* @__PURE__ */ React3.createElement(Card.DragHandle, {
-    ref: dragHandleRef
-  }), /* @__PURE__ */ React3.createElement(Card.Title, null, Obj.getLabel(props.data) ?? props.data.id), /* @__PURE__ */ React3.createElement(Card.Block, {
-    end: true
-  }, /* @__PURE__ */ React3.createElement(Menu.Trigger, {
-    asChild: true,
-    disabled: !menuItems?.length
-  }, /* @__PURE__ */ React3.createElement(IconButton, {
-    iconOnly: true,
-    variant: "ghost",
-    icon: "ph--dots-three-vertical--regular",
-    label: "Menu"
-  }))), /* @__PURE__ */ React3.createElement(Menu.Content, {
-    items: menuItems
-  })), open && /* @__PURE__ */ React3.createElement(Card.Row, null, /* @__PURE__ */ React3.createElement(JsonHighlighter, {
-    data: props.data,
-    classNames: "text-xs"
-  }))))));
-};
-DefaultStackTile.displayName = "DefaultStackTile";
-export {
-  CardContainer,
-  DefaultStackTile,
-  IntrinsicCardContainer,
-  PopoverCardContainer,
-  TestColumn,
-  TestItem,
-  withMosaic
-};
-//# sourceMappingURL=index.mjs.map

package/dist/lib/browser/testing/index.mjs.map

@@ -1,7 +0,0 @@
-{
-  "version": 3,
-  "sources": ["../../../../src/testing/decorator.tsx", "../../../../src/testing/types.ts", "../../../../src/testing/CardContainer.tsx", "../../../../src/testing/DefaultStackTile.tsx"],
-  "sourcesContent": ["//\n// Copyright 2026 DXOS.org\n//\n\nimport { type Decorator } from '@storybook/react-vite';\nimport React from 'react';\n\nimport { Mosaic } from '../components';\n\nexport const withMosaic = (): Decorator => {\n  return (Story) => (\n    <Mosaic.Root>\n      <Story />\n    </Mosaic.Root>\n  );\n};\n", "//\n// Copyright 2023 DXOS.org\n//\n\nimport * as Schema from 'effect/Schema';\n\nimport { DXN, Ref, Type } from '@dxos/echo';\nimport { EntityId } from '@dxos/keys';\n\n//\n// Test Data\n//\n\nexport class TestItem extends Type.makeObject<TestItem>(DXN.make('com.example.type.item', '0.1.0'))(\n  Schema.Struct({\n    name: Schema.String,\n    description: Schema.optional(Schema.String),\n    label: Schema.optional(Schema.String),\n  }),\n) {}\n\nexport class TestColumn extends Type.makeObject<TestColumn>(DXN.make('com.example.type.column', '0.1.0'))(\n  Schema.Struct({\n    id: EntityId,\n    name: Schema.String,\n    items: Schema.mutable(Schema.Array(Ref.Ref(TestItem))),\n  }),\n) {}\n", "//\n// Copyright 2025 DXOS.org\n//\n\nimport { useControllableState } from '@radix-ui/react-use-controllable-state';\nimport React, { type PropsWithChildren } from 'react';\n\nimport { Icon, Popover } from '@dxos/react-ui';\nimport { ResizeHandle, type Size, resizeAttributes, sizeStyle } from '@dxos/react-ui-dnd';\n\nconst DEFAULT_BLOCK_SIZE = 22;\nconst MIN_BLOCK_SIZE = 8;\n\n//\n// Card container.\n//\n\nexport type CardContainerProps = PropsWithChildren<{ role?: 'popover' | 'intrinsic'; icon?: string }>;\n\nexport const CardContainer = ({ children, role, icon = 'ph--arrow-line-down--regular' }: CardContainerProps) => {\n  switch (role) {\n    case 'popover':\n      return (\n        <div className='flex justify-center'>\n          <PopoverCardContainer icon={icon}>{children}</PopoverCardContainer>\n        </div>\n      );\n    case 'intrinsic':\n    default:\n      return <IntrinsicCardContainer>{children}</IntrinsicCardContainer>;\n  }\n};\n\n//\n// Popover\n//\n\nexport type PopoverCardContainerProps = PropsWithChildren<{ icon?: string }>;\n\nexport const PopoverCardContainer = ({\n  children,\n  icon = 'ph--arrow-line-down--regular',\n}: PopoverCardContainerProps) => {\n  return (\n    <Popover.Root open>\n      <Popover.Trigger asChild>\n        <Icon icon={icon} />\n      </Popover.Trigger>\n      <Popover.Portal>\n        <Popover.Content onOpenAutoFocus={(event: Event) => event.preventDefault()}>\n          <Popover.Viewport classNames='dx-card-popover'>{children}</Popover.Viewport>\n          <Popover.Arrow />\n        </Popover.Content>\n      </Popover.Portal>\n    </Popover.Root>\n  );\n};\n\n//\n// Intrinsic card container (size constrained by card itself).\n//\n\nexport type IntrinsicCardContainerProps = PropsWithChildren<{\n  defaultSize?: Size;\n  size?: Size;\n  onSizeChange?: (size: Size, commit?: boolean) => void;\n}>;\n\nexport const IntrinsicCardContainer = ({\n  children,\n  defaultSize,\n  size: propSize,\n  onSizeChange,\n}: IntrinsicCardContainerProps) => {\n  const [size = DEFAULT_BLOCK_SIZE, setSize] = useControllableState<Size>({\n    prop: propSize,\n    defaultProp: defaultSize,\n    onChange: onSizeChange,\n  });\n\n  return (\n    <div\n      className='relative p-2 grid overflow-hidden border-2 border-dashed border-green-500 rounded-lg'\n      style={sizeStyle(size, 'horizontal')}\n      {...resizeAttributes}\n    >\n      <div className='dx-container flex flex-col'>{children}</div>\n      <ResizeHandle\n        side='inline-end'\n        fallbackSize={DEFAULT_BLOCK_SIZE}\n        minSize={MIN_BLOCK_SIZE}\n        size={size}\n        onSizeChange={setSize}\n      />\n    </div>\n  );\n};\n", "//\n// Copyright 2026 DXOS.org\n//\n\nimport React, { useMemo, useRef, useState } from 'react';\n\nimport { Obj } from '@dxos/echo';\nimport { Card, IconButton } from '@dxos/react-ui';\nimport { Menu, createMenuAction } from '@dxos/react-ui-menu';\nimport { JsonHighlighter } from '@dxos/react-ui-syntax-highlighter';\n\nimport { Focus, Mosaic, type MosaicStackTileComponent } from '../components';\n\nexport const DefaultStackTile: MosaicStackTileComponent<Obj.Any> = (props) => {\n  const dragHandleRef = useRef<HTMLButtonElement>(null);\n  const [open, setOpen] = useState(false);\n  const menuItems = useMemo(\n    () => [\n      createMenuAction('toggle-details', () => setOpen((prev) => !prev), {\n        label: open ? 'Hide details' : 'Show details',\n        icon: 'ph--circle-dashed--regular',\n      }),\n    ],\n    [open],\n  );\n\n  return (\n    <Menu.Root>\n      {/*\n       * `Mosaic.Tile` sets `aria-current` from `props.current`, which the\n       * Slot composition propagates down to `Card.Root`'s div. That's what\n       * makes `dx-current` (an `aria-[current=true]:` utility) actually\n       * fire here. See `ui-theme/src/css/components/selected.md`.\n       */}\n      <Mosaic.Tile {...props} asChild>\n        <Focus.Item asChild>\n          <Card.Root className='dx-current dx-hover'>\n            <Card.Header>\n              <Card.DragHandle ref={dragHandleRef} />\n              <Card.Title>{Obj.getLabel(props.data) ?? props.data.id}</Card.Title>\n              <Card.Block end>\n                <Menu.Trigger asChild disabled={!menuItems?.length}>\n                  <IconButton iconOnly variant='ghost' icon='ph--dots-three-vertical--regular' label='Menu' />\n                </Menu.Trigger>\n              </Card.Block>\n              <Menu.Content items={menuItems} />\n            </Card.Header>\n            {open && (\n              <Card.Row>\n                <JsonHighlighter data={props.data} classNames='text-xs' />\n              </Card.Row>\n            )}\n          </Card.Root>\n        </Focus.Item>\n      </Mosaic.Tile>\n    </Menu.Root>\n  );\n};\n\nDefaultStackTile.displayName = 'DefaultStackTile';\n"],
-  "mappings": "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",
-  "names": ["React", "withMosaic", "Story", "Mosaic", "Root", "Schema", "DXN", "Ref", "Type", "EntityId", "TestItem", "makeObject", "make", "Struct", "name", "String", "description", "optional", "label", "TestColumn", "id", "items", "mutable", "Array", "useControllableState", "React", "Icon", "Popover", "ResizeHandle", "resizeAttributes", "sizeStyle", "DEFAULT_BLOCK_SIZE", "MIN_BLOCK_SIZE", "CardContainer", "children", "role", "icon", "div", "className", "PopoverCardContainer", "IntrinsicCardContainer", "Root", "open", "Trigger", "asChild", "Portal", "Content", "onOpenAutoFocus", "event", "preventDefault", "Viewport", "classNames", "Arrow", "defaultSize", "size", "propSize", "onSizeChange", "setSize", "prop", "defaultProp", "onChange", "style", "side", "fallbackSize", "minSize", "React", "useMemo", "useRef", "useState", "Obj", "Card", "IconButton", "Menu", "createMenuAction", "JsonHighlighter", "DefaultStackTile", "props", "dragHandleRef", "useRef", "open", "setOpen", "useState", "menuItems", "useMemo", "createMenuAction", "prev", "label", "icon", "React", "Menu", "Root", "Mosaic", "Tile", "asChild", "Focus", "Item", "Card", "className", "Header", "DragHandle", "ref", "Title", "Obj", "getLabel", "data", "id", "Block", "end", "Trigger", "disabled", "length", "IconButton", "iconOnly", "variant", "Content", "items", "Row", "JsonHighlighter", "classNames", "displayName"]
-}

package/dist/lib/browser/translations.mjs

@@ -1,18 +0,0 @@
-// src/translations.ts
-var translationKey = "@dxos/react-ui-mosaic";
-var translations = [
-  {
-    "en-US": {
-      [translationKey]: {
-        "action-menu.label": "Actions",
-        "add-item.label": "Add item",
-        "delete-menu.label": "Delete"
-      }
-    }
-  }
-];
-export {
-  translationKey,
-  translations
-};
-//# sourceMappingURL=translations.mjs.map

package/dist/lib/browser/translations.mjs.map

@@ -1,7 +0,0 @@
-{
-  "version": 3,
-  "sources": ["../../../src/translations.ts"],
-  "sourcesContent": ["//\n// Copyright 2023 DXOS.org\n//\n\nimport { type Resource } from '@dxos/react-ui';\n\nexport const translationKey = '@dxos/react-ui-mosaic';\n\nexport const translations = [\n  {\n    'en-US': {\n      [translationKey]: {\n        'action-menu.label': 'Actions',\n        'add-item.label': 'Add item',\n        'delete-menu.label': 'Delete',\n      },\n    },\n  },\n] as const satisfies Resource[];\n"],
-  "mappings": ";AAMO,IAAMA,iBAAiB;AAEvB,IAAMC,eAAe;EAC1B;IACE,SAAS;MACP,CAACD,cAAAA,GAAiB;QAChB,qBAAqB;QACrB,kBAAkB;QAClB,qBAAqB;MACvB;IACF;EACF;;",
-  "names": ["translationKey", "translations"]
-}