@dxos/plugin-stack 0.8.2-staging.7ac8446 → 0.8.3-main.672df60

package/dist/lib/browser/StackMain-HZI5H2RA.mjs

@@ -0,0 +1,315 @@
+import {
+  StackViewType
+} from "./chunk-XOUJQIK6.mjs";
+import {
+  STACK_PLUGIN
+} from "./chunk-XHZTILS3.mjs";
+
+// packages/plugins/plugin-stack/src/components/StackMain.tsx
+import { useSignals as _useSignals3 } from "@preact-signals/safe-react/tracking";
+import { Plus } from "@phosphor-icons/react";
+import { Option } from "effect";
+import React3, { useCallback, useEffect, useMemo, useState as useState2 } from "react";
+import { Capabilities, createIntent, LayoutAction, useAppGraph, useCapabilities, useIntentDispatcher } from "@dxos/app-framework";
+import { fullyQualifiedId, getTypename, isLiveObject, live, makeRef } from "@dxos/client/echo";
+import { SpaceAction } from "@dxos/plugin-space/types";
+import { Button, toLocalizedString, useTranslation as useTranslation2 } from "@dxos/react-ui";
+import { AttentionProvider } from "@dxos/react-ui-attention";
+import { Stack } from "@dxos/react-ui-stack";
+import { isNonNullable } from "@dxos/util";
+
+// packages/plugins/plugin-stack/src/components/StackContext.tsx
+import { createContext, useContext } from "react";
+var StackContext = /* @__PURE__ */ createContext({
+  onCollapse: () => {
+  },
+  onNavigate: async () => {
+  },
+  onDelete: async () => {
+  },
+  onAdd: () => {
+  }
+});
+var useStack = () => useContext(StackContext);
+
+// packages/plugins/plugin-stack/src/components/StackSection.tsx
+import { useSignals as _useSignals2 } from "@preact-signals/safe-react/tracking";
+import * as CollapsiblePrimitive from "@radix-ui/react-collapsible";
+import React2, { useState } from "react";
+import { Surface } from "@dxos/app-framework";
+import { DropdownMenu, Icon, useTranslation, IconButton } from "@dxos/react-ui";
+import { useAttentionAttributes } from "@dxos/react-ui-attention";
+import { StackItem } from "@dxos/react-ui-stack";
+import { mx, getSize, textBlockWidth } from "@dxos/react-ui-theme";
+
+// packages/plugins/plugin-stack/src/components/CaretDownUp.tsx
+import { useSignals as _useSignals } from "@preact-signals/safe-react/tracking";
+import React from "react";
+var CaretDownUp = ({ children, ...props }) => {
+  var _effect = _useSignals();
+  try {
+    return /* @__PURE__ */ React.createElement("svg", {
+      xmlns: "http://www.w3.org/2000/svg",
+      viewBox: "0 0 256 256",
+      ...props
+    }, /* @__PURE__ */ React.createElement("rect", {
+      width: "256",
+      height: "256",
+      fill: "none"
+    }), /* @__PURE__ */ React.createElement("polyline", {
+      points: "80 224 128 176 176 224",
+      fill: "none",
+      stroke: "currentColor",
+      strokeLinecap: "round",
+      strokeLinejoin: "round",
+      strokeWidth: "16"
+    }), /* @__PURE__ */ React.createElement("polyline", {
+      points: "80 32 128 80 176 32",
+      fill: "none",
+      stroke: "currentColor",
+      strokeLinecap: "round",
+      strokeLinejoin: "round",
+      strokeWidth: "16"
+    }), children);
+  } finally {
+    _effect.f();
+  }
+};
+
+// packages/plugins/plugin-stack/src/components/StackSection.tsx
+var sectionActionDimensions = "p-1 mlb-1 shrink-0 min-bs-0 is-[--rail-action] bs-min";
+var StackSection = ({ id, view, object, metadata: { icon = "ph--placeholder--regular" } }) => {
+  var _effect = _useSignals2();
+  try {
+    const { t } = useTranslation(STACK_PLUGIN);
+    const { onNavigate, onAdd, onCollapse, onDelete } = useStack();
+    const [optionsMenuOpen, setOptionsMenuOpen] = useState(false);
+    const attentionAttrs = useAttentionAttributes(id);
+    return /* @__PURE__ */ React2.createElement(CollapsiblePrimitive.Root, {
+      asChild: true,
+      open: !view.collapsed,
+      onOpenChange: (nextOpen) => onCollapse?.(id, !nextOpen)
+    }, /* @__PURE__ */ React2.createElement(StackItem.Root, {
+      item: {
+        id
+      },
+      role: "section",
+      ...attentionAttrs,
+      classNames: "border-be border-separator"
+    }, /* @__PURE__ */ React2.createElement(StackItem.Heading, {
+      classNames: "attention-surface border-ie !border-separator"
+    }, /* @__PURE__ */ React2.createElement("span", {
+      className: "sr-only"
+    }, view.title), /* @__PURE__ */ React2.createElement("div", {
+      role: "none",
+      className: "sticky -block-start-px bg-[--sticky-bg] p-1 is-full"
+    }, /* @__PURE__ */ React2.createElement(DropdownMenu.Root, {
+      open: optionsMenuOpen,
+      onOpenChange: setOptionsMenuOpen
+    }, /* @__PURE__ */ React2.createElement(DropdownMenu.Trigger, {
+      asChild: true
+    }, /* @__PURE__ */ React2.createElement(StackItem.SigilButton, null, /* @__PURE__ */ React2.createElement(Icon, {
+      icon,
+      size: 5,
+      classNames: "transition-opacity"
+    }))), /* @__PURE__ */ React2.createElement(DropdownMenu.Portal, null, /* @__PURE__ */ React2.createElement(DropdownMenu.Content, null, /* @__PURE__ */ React2.createElement(DropdownMenu.Viewport, null, view.collapsed ? /* @__PURE__ */ React2.createElement(DropdownMenu.Item, {
+      onClick: () => onNavigate(id),
+      "data-testid": "section.navigate-to"
+    }, /* @__PURE__ */ React2.createElement(Icon, {
+      icon: "ph--arrow-right--regular",
+      size: 5
+    }), /* @__PURE__ */ React2.createElement("span", {
+      className: "mis-2 grow"
+    }, t("navigate to section label"))) : /* @__PURE__ */ React2.createElement(CollapsiblePrimitive.Trigger, {
+      asChild: true
+    }, /* @__PURE__ */ React2.createElement(DropdownMenu.Item, null, /* @__PURE__ */ React2.createElement(CaretDownUp, {
+      className: getSize(5)
+    }), /* @__PURE__ */ React2.createElement("span", {
+      className: "mis-2 grow"
+    }, t("collapse label")))), /* @__PURE__ */ React2.createElement(DropdownMenu.Item, {
+      onClick: () => onAdd(id, "before"),
+      "data-testid": "section.add-before"
+    }, /* @__PURE__ */ React2.createElement(Icon, {
+      icon: "ph--arrow-line-up--regular",
+      size: 5
+    }), /* @__PURE__ */ React2.createElement("span", {
+      className: "mis-2 grow"
+    }, t("add section before label"))), /* @__PURE__ */ React2.createElement(DropdownMenu.Item, {
+      onClick: () => onAdd(id, "after"),
+      "data-testid": "section.add-after"
+    }, /* @__PURE__ */ React2.createElement(Icon, {
+      icon: "ph--arrow-line-down--regular",
+      size: 5
+    }), /* @__PURE__ */ React2.createElement("span", {
+      className: "mis-2 grow"
+    }, t("add section after label"))), /* @__PURE__ */ React2.createElement(DropdownMenu.Item, {
+      onClick: () => onDelete(id),
+      "data-testid": "section.remove"
+    }, /* @__PURE__ */ React2.createElement(Icon, {
+      icon: "ph--trash--regular",
+      size: 5
+    }), /* @__PURE__ */ React2.createElement("span", {
+      className: "mis-2 grow"
+    }, t("remove section label")))), /* @__PURE__ */ React2.createElement(DropdownMenu.Arrow, null)))), view.collapsed ? /* @__PURE__ */ React2.createElement(CollapsiblePrimitive.Trigger, {
+      asChild: true
+    }, /* @__PURE__ */ React2.createElement(IconButton, {
+      iconOnly: true,
+      variant: "ghost",
+      label: t("expand label"),
+      icon: "ph--caret-up-down--regular",
+      classNames: sectionActionDimensions
+    })) : /* @__PURE__ */ React2.createElement(IconButton, {
+      iconOnly: true,
+      variant: "ghost",
+      onClick: () => onNavigate(id),
+      label: t("navigate to section label"),
+      icon: "ph--arrow-right--regular",
+      "data-testid": "section.navigate-to",
+      classNames: sectionActionDimensions
+    }))), /* @__PURE__ */ React2.createElement(CollapsiblePrimitive.Content, null, /* @__PURE__ */ React2.createElement(Surface, {
+      role: "section",
+      data: {
+        subject: object
+      },
+      limit: 1,
+      placeholder: /* @__PURE__ */ React2.createElement(React2.Fragment, null)
+    })), view.collapsed && /* @__PURE__ */ React2.createElement(StackItem.Content, {
+      classNames: "attention-surface"
+    }, /* @__PURE__ */ React2.createElement("h2", {
+      className: mx("flex items-center p-4 font-medium", textBlockWidth)
+    }, view.title))));
+  } finally {
+    _effect.f();
+  }
+};
+
+// packages/plugins/plugin-stack/src/components/StackMain.tsx
+var StackMain = ({ id, collection }) => {
+  var _effect = _useSignals3();
+  try {
+    const { dispatchPromise: dispatch } = useIntentDispatcher();
+    const { graph } = useAppGraph();
+    const { t } = useTranslation2(STACK_PLUGIN);
+    const allMetadata = useCapabilities(Capabilities.Metadata);
+    const defaultStack = useMemo(() => live(StackViewType, {
+      sections: {}
+    }), [
+      collection
+    ]);
+    const stack = collection.views[StackViewType.typename]?.target ?? defaultStack;
+    const [collapsedSections, setCollapsedSections] = useState2({});
+    useEffect(() => {
+      if (!collection.views[StackViewType.typename]) {
+        collection.views[StackViewType.typename] = makeRef(stack);
+      }
+    }, [
+      collection,
+      stack
+    ]);
+    const items = collection.objects.map((object) => object.target).filter(isNonNullable).map((object) => {
+      const metadata = allMetadata.find((m) => m.id === (getTypename(object) ?? "never"))?.metadata;
+      const view = {
+        ...stack.sections[object.id],
+        collapsed: collapsedSections[fullyQualifiedId(object)],
+        title: object?.title ?? // TODO(wittjosiah): `getNode` is not reactive.
+        toLocalizedString(graph.getNode(fullyQualifiedId(object)).pipe(Option.getOrNull)?.properties.label, t)
+      };
+      return {
+        id: fullyQualifiedId(object),
+        object,
+        metadata,
+        view
+      };
+    }) ?? [];
+    const handleDelete = useCallback(async (id2) => {
+      const index = collection.objects.map((object2) => object2.target).filter(isNonNullable).findIndex((section) => fullyQualifiedId(section) === id2);
+      const object = collection.objects[index].target;
+      if (isLiveObject(object)) {
+        await dispatch(createIntent(SpaceAction.RemoveObjects, {
+          objects: [
+            object
+          ],
+          target: collection
+        }));
+      }
+    }, [
+      collection,
+      dispatch
+    ]);
+    const handleAdd = useCallback(async (id2, position) => {
+      await dispatch?.(
+        // TODO(wittjosiah): Use object creation dialog.
+        createIntent(LayoutAction.UpdateDialog, {
+          part: "dialog",
+          subject: `${STACK_PLUGIN}/AddSectionDialog`,
+          options: {
+            blockAlign: "start",
+            props: {
+              path: id2,
+              position,
+              collection
+            }
+          }
+        })
+      );
+    }, [
+      collection,
+      dispatch
+    ]);
+    const handleNavigate = useCallback(async (id2) => {
+      await dispatch(createIntent(LayoutAction.Open, {
+        part: "main",
+        subject: [
+          id2
+        ]
+      }));
+    }, [
+      dispatch
+    ]);
+    const handleCollapse = useCallback((id2, collapsed) => setCollapsedSections((prev) => ({
+      ...prev,
+      [id2]: collapsed
+    })), []);
+    const handleAddSection = useCallback(() => dispatch?.(createIntent(SpaceAction.OpenCreateObject, {
+      target: collection,
+      navigable: false
+    })), [
+      collection,
+      dispatch
+    ]);
+    return /* @__PURE__ */ React3.createElement(AttentionProvider, {
+      id
+    }, /* @__PURE__ */ React3.createElement(StackContext.Provider, {
+      value: {
+        onCollapse: handleCollapse,
+        onNavigate: handleNavigate,
+        onDelete: handleDelete,
+        onAdd: handleAdd
+      }
+    }, /* @__PURE__ */ React3.createElement(Stack, {
+      orientation: "vertical",
+      size: "intrinsic",
+      id,
+      "data-testid": "main.stack"
+    }, items.map((item) => /* @__PURE__ */ React3.createElement(StackSection, {
+      key: item.id,
+      ...item
+    }))), /* @__PURE__ */ React3.createElement("div", {
+      role: "none",
+      className: "flex mlb-2 pli-2 justify-center"
+    }, /* @__PURE__ */ React3.createElement(Button, {
+      "data-testid": "stack.createSection",
+      classNames: "gap-2",
+      onClick: handleAddSection
+    }, /* @__PURE__ */ React3.createElement(Plus, null), /* @__PURE__ */ React3.createElement("span", {
+      className: "sr-only"
+    }, t("add section label"))))));
+  } finally {
+    _effect.f();
+  }
+};
+var StackMain_default = StackMain;
+export {
+  StackMain_default as default
+};
+//# sourceMappingURL=StackMain-HZI5H2RA.mjs.map

package/dist/lib/browser/StackMain-HZI5H2RA.mjs.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../src/components/StackMain.tsx", "../../../src/components/StackContext.tsx", "../../../src/components/StackSection.tsx", "../../../src/components/CaretDownUp.tsx"],
+  "sourcesContent": ["//\n// Copyright 2023 DXOS.org\n//\n\nimport { Plus } from '@phosphor-icons/react';\nimport { Option } from 'effect';\nimport React, { useCallback, useEffect, useMemo, useState } from 'react';\n\nimport {\n  Capabilities,\n  createIntent,\n  LayoutAction,\n  useAppGraph,\n  useCapabilities,\n  useIntentDispatcher,\n} from '@dxos/app-framework';\nimport { fullyQualifiedId, getTypename, isLiveObject, live, makeRef } from '@dxos/client/echo';\nimport { SpaceAction, type CollectionType } from '@dxos/plugin-space/types';\nimport { Button, toLocalizedString, useTranslation } from '@dxos/react-ui';\nimport { AttentionProvider } from '@dxos/react-ui-attention';\nimport { Stack } from '@dxos/react-ui-stack';\nimport { isNonNullable } from '@dxos/util';\n\nimport { StackContext } from './StackContext';\nimport { StackSection } from './StackSection';\nimport { STACK_PLUGIN } from '../meta';\nimport {\n  StackViewType,\n  type AddSectionPosition,\n  type CollapsedSections,\n  type StackSectionItem,\n  type StackSectionMetadata,\n  type StackSectionView,\n} from '../types';\n\ntype StackMainProps = {\n  id: string;\n  collection: CollectionType;\n};\n\nconst StackMain = ({ id, collection }: StackMainProps) => {\n  const { dispatchPromise: dispatch } = useIntentDispatcher();\n  const { graph } = useAppGraph();\n  const { t } = useTranslation(STACK_PLUGIN);\n  const allMetadata = useCapabilities(Capabilities.Metadata);\n  const defaultStack = useMemo(() => live(StackViewType, { sections: {} }), [collection]);\n  const stack = (collection.views[StackViewType.typename]?.target as StackViewType | undefined) ?? defaultStack;\n  const [collapsedSections, setCollapsedSections] = useState<CollapsedSections>({});\n\n  useEffect(() => {\n    if (!collection.views[StackViewType.typename]) {\n      collection.views[StackViewType.typename] = makeRef(stack);\n    }\n  }, [collection, stack]);\n\n  const items =\n    collection.objects\n      // TODO(wittjosiah): Should the database handle this differently?\n      // TODO(wittjosiah): Render placeholders for missing objects so they can be removed from the stack?\n      .map((object) => object.target)\n      .filter(isNonNullable)\n      .map((object) => {\n        const metadata = allMetadata.find((m) => m.id === (getTypename(object) ?? 'never'))\n          ?.metadata as StackSectionMetadata;\n        const view = {\n          ...stack.sections[object.id],\n          collapsed: collapsedSections[fullyQualifiedId(object)],\n          title:\n            (object as any)?.title ??\n            // TODO(wittjosiah): `getNode` is not reactive.\n            toLocalizedString(graph.getNode(fullyQualifiedId(object)).pipe(Option.getOrNull)?.properties.label, t),\n        } as StackSectionView;\n        return { id: fullyQualifiedId(object), object, metadata, view } satisfies StackSectionItem;\n      }) ?? [];\n\n  const handleDelete = useCallback(\n    async (id: string) => {\n      const index = collection.objects\n        .map((object) => object.target)\n        .filter(isNonNullable)\n        .findIndex((section) => fullyQualifiedId(section) === id);\n      const object = collection.objects[index].target;\n      if (isLiveObject(object)) {\n        await dispatch(createIntent(SpaceAction.RemoveObjects, { objects: [object], target: collection }));\n\n        // TODO(wittjosiah): The section should also be removed, but needs to be restored if the action is undone.\n        // delete stack.sections[Path.last(path)];\n      }\n    },\n    [collection, dispatch],\n  );\n\n  const handleAdd = useCallback(\n    async (id: string, position: AddSectionPosition) => {\n      await dispatch?.(\n        // TODO(wittjosiah): Use object creation dialog.\n        createIntent(LayoutAction.UpdateDialog, {\n          part: 'dialog',\n          subject: `${STACK_PLUGIN}/AddSectionDialog`,\n          options: {\n            blockAlign: 'start',\n            props: {\n              path: id,\n              position,\n              collection,\n            },\n          },\n        }),\n      );\n    },\n    [collection, dispatch],\n  );\n\n  const handleNavigate = useCallback(\n    async (id: string) => {\n      await dispatch(createIntent(LayoutAction.Open, { part: 'main', subject: [id] }));\n    },\n    [dispatch],\n  );\n\n  const handleCollapse = useCallback(\n    (id: string, collapsed: boolean) => setCollapsedSections((prev) => ({ ...prev, [id]: collapsed })),\n    [],\n  );\n\n  const handleAddSection = useCallback(\n    () => dispatch?.(createIntent(SpaceAction.OpenCreateObject, { target: collection, navigable: false })),\n    [collection, dispatch],\n  );\n\n  return (\n    <AttentionProvider id={id}>\n      <StackContext.Provider\n        value={{\n          onCollapse: handleCollapse,\n          onNavigate: handleNavigate,\n          onDelete: handleDelete,\n          onAdd: handleAdd,\n        }}\n      >\n        <Stack orientation='vertical' size='intrinsic' id={id} data-testid='main.stack'>\n          {items.map((item) => (\n            <StackSection key={item.id} {...item} />\n          ))}\n        </Stack>\n\n        <div role='none' className='flex mlb-2 pli-2 justify-center'>\n          <Button data-testid='stack.createSection' classNames='gap-2' onClick={handleAddSection}>\n            <Plus />\n            <span className='sr-only'>{t('add section label')}</span>\n          </Button>\n        </div>\n      </StackContext.Provider>\n    </AttentionProvider>\n  );\n};\n\nexport default StackMain;\n", "//\n// Copyright 2024 DXOS.org\n//\n\nimport { createContext, useContext } from 'react';\n\nimport { type AddSectionPosition } from '../types';\n\nexport type StackContextValue = {\n  onCollapse: (id: string, collapsed: boolean) => void;\n  onNavigate: (id: string) => Promise<void>;\n  onDelete: (id: string) => Promise<void>;\n  onAdd: (id: string, position: AddSectionPosition) => void;\n};\n\nexport const StackContext = createContext<StackContextValue>({\n  onCollapse: () => {},\n  onNavigate: async () => {},\n  onDelete: async () => {},\n  onAdd: () => {},\n});\n\nexport const useStack = () => useContext(StackContext);\n", "//\n// Copyright 2024 DXOS.org\n//\n\nimport * as CollapsiblePrimitive from '@radix-ui/react-collapsible';\nimport React, { useState } from 'react';\n\nimport { Surface } from '@dxos/app-framework';\nimport { DropdownMenu, Icon, useTranslation, IconButton } from '@dxos/react-ui';\nimport { useAttentionAttributes } from '@dxos/react-ui-attention';\nimport { StackItem } from '@dxos/react-ui-stack';\nimport { mx, getSize, textBlockWidth } from '@dxos/react-ui-theme';\n\nimport { CaretDownUp } from './CaretDownUp';\nimport { useStack } from './StackContext';\nimport { STACK_PLUGIN } from '../meta';\nimport { type StackSectionItem } from '../types';\n\nconst sectionActionDimensions = 'p-1 mlb-1 shrink-0 min-bs-0 is-[--rail-action] bs-min';\n\nexport type StackSectionProps = StackSectionItem;\n\nexport const StackSection = ({\n  id,\n  view,\n  object,\n  metadata: { icon = 'ph--placeholder--regular' },\n}: StackSectionProps) => {\n  const { t } = useTranslation(STACK_PLUGIN);\n  const { onNavigate, onAdd, onCollapse, onDelete } = useStack();\n  const [optionsMenuOpen, setOptionsMenuOpen] = useState(false);\n  const attentionAttrs = useAttentionAttributes(id);\n\n  return (\n    <CollapsiblePrimitive.Root asChild open={!view.collapsed} onOpenChange={(nextOpen) => onCollapse?.(id, !nextOpen)}>\n      <StackItem.Root item={{ id }} role='section' {...attentionAttrs} classNames='border-be border-separator'>\n        <StackItem.Heading classNames='attention-surface border-ie !border-separator'>\n          <span className='sr-only'>{view.title}</span>\n          <div role='none' className='sticky -block-start-px bg-[--sticky-bg] p-1 is-full'>\n            <DropdownMenu.Root\n              {...{\n                open: optionsMenuOpen,\n                onOpenChange: setOptionsMenuOpen,\n              }}\n            >\n              <DropdownMenu.Trigger asChild>\n                <StackItem.SigilButton>\n                  <Icon icon={icon} size={5} classNames='transition-opacity' />\n                </StackItem.SigilButton>\n              </DropdownMenu.Trigger>\n              <DropdownMenu.Portal>\n                <DropdownMenu.Content>\n                  <DropdownMenu.Viewport>\n                    {view.collapsed ? (\n                      <DropdownMenu.Item onClick={() => onNavigate(id)} data-testid='section.navigate-to'>\n                        <Icon icon='ph--arrow-right--regular' size={5} />\n                        <span className='mis-2 grow'>{t('navigate to section label')}</span>\n                      </DropdownMenu.Item>\n                    ) : (\n                      <CollapsiblePrimitive.Trigger asChild>\n                        <DropdownMenu.Item>\n                          <CaretDownUp className={getSize(5)} />\n                          <span className='mis-2 grow'>{t('collapse label')}</span>\n                        </DropdownMenu.Item>\n                      </CollapsiblePrimitive.Trigger>\n                    )}\n                    <DropdownMenu.Item onClick={() => onAdd(id, 'before')} data-testid='section.add-before'>\n                      <Icon icon='ph--arrow-line-up--regular' size={5} />\n                      <span className='mis-2 grow'>{t('add section before label')}</span>\n                    </DropdownMenu.Item>\n                    <DropdownMenu.Item onClick={() => onAdd(id, 'after')} data-testid='section.add-after'>\n                      <Icon icon='ph--arrow-line-down--regular' size={5} />\n                      <span className='mis-2 grow'>{t('add section after label')}</span>\n                    </DropdownMenu.Item>\n                    <DropdownMenu.Item onClick={() => onDelete(id)} data-testid='section.remove'>\n                      <Icon icon='ph--trash--regular' size={5} />\n                      <span className='mis-2 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            {view.collapsed ? (\n              <CollapsiblePrimitive.Trigger asChild>\n                <IconButton\n                  iconOnly\n                  variant='ghost'\n                  label={t('expand label')}\n                  icon='ph--caret-up-down--regular'\n                  classNames={sectionActionDimensions}\n                />\n              </CollapsiblePrimitive.Trigger>\n            ) : (\n              <IconButton\n                iconOnly\n                variant='ghost'\n                onClick={() => onNavigate(id)}\n                label={t('navigate to section label')}\n                icon='ph--arrow-right--regular'\n                data-testid='section.navigate-to'\n                classNames={sectionActionDimensions}\n              />\n            )}\n          </div>\n        </StackItem.Heading>\n        <CollapsiblePrimitive.Content>\n          <Surface role='section' data={{ subject: object }} limit={1} placeholder={<></>} />\n        </CollapsiblePrimitive.Content>\n        {view.collapsed && (\n          <StackItem.Content classNames='attention-surface'>\n            <h2 className={mx('flex items-center p-4 font-medium', textBlockWidth)}>{view.title}</h2>\n          </StackItem.Content>\n        )}\n      </StackItem.Root>\n    </CollapsiblePrimitive.Root>\n  );\n};\n", "//\n// Copyright 2024 DXOS.org\n//\n\nimport React, { type ComponentPropsWithoutRef } from 'react';\n\nexport const CaretDownUp = ({ children, ...props }: ComponentPropsWithoutRef<'svg'>) => {\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"],
+  "mappings": "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",
+  "names": ["Plus", "Option", "React", "useCallback", "useEffect", "useMemo", "useState", "Capabilities", "createIntent", "LayoutAction", "useAppGraph", "useCapabilities", "useIntentDispatcher", "fullyQualifiedId", "getTypename", "isLiveObject", "live", "makeRef", "SpaceAction", "Button", "toLocalizedString", "useTranslation", "AttentionProvider", "Stack", "isNonNullable", "createContext", "useContext", "StackContext", "createContext", "onCollapse", "onNavigate", "onDelete", "onAdd", "useStack", "useContext", "CollapsiblePrimitive", "React", "useState", "Surface", "DropdownMenu", "Icon", "useTranslation", "IconButton", "useAttentionAttributes", "StackItem", "mx", "getSize", "textBlockWidth", "React", "CaretDownUp", "children", "props", "svg", "xmlns", "viewBox", "rect", "width", "height", "fill", "polyline", "points", "stroke", "strokeLinecap", "strokeLinejoin", "strokeWidth", "sectionActionDimensions", "StackSection", "id", "view", "object", "metadata", "icon", "t", "useTranslation", "STACK_PLUGIN", "onNavigate", "onAdd", "onCollapse", "onDelete", "useStack", "optionsMenuOpen", "setOptionsMenuOpen", "useState", "attentionAttrs", "useAttentionAttributes", "React", "Root", "asChild", "open", "collapsed", "onOpenChange", "nextOpen", "StackItem", "item", "role", "classNames", "Heading", "span", "className", "title", "div", "DropdownMenu", "Trigger", "SigilButton", "Icon", "size", "Portal", "Content", "Viewport", "Item", "onClick", "data-testid", "CaretDownUp", "getSize", "Arrow", "IconButton", "iconOnly", "variant", "label", "Surface", "data", "subject", "limit", "placeholder", "h2", "mx", "textBlockWidth", "StackMain", "id", "collection", "dispatchPromise", "dispatch", "useIntentDispatcher", "graph", "useAppGraph", "t", "useTranslation", "STACK_PLUGIN", "allMetadata", "useCapabilities", "Capabilities", "Metadata", "defaultStack", "useMemo", "live", "StackViewType", "sections", "stack", "views", "typename", "target", "collapsedSections", "setCollapsedSections", "useState", "useEffect", "makeRef", "items", "objects", "map", "object", "filter", "isNonNullable", "metadata", "find", "m", "getTypename", "view", "collapsed", "fullyQualifiedId", "title", "toLocalizedString", "getNode", "pipe", "Option", "getOrNull", "properties", "label", "handleDelete", "useCallback", "index", "findIndex", "section", "isLiveObject", "createIntent", "SpaceAction", "RemoveObjects", "handleAdd", "position", "LayoutAction", "UpdateDialog", "part", "subject", "options", "blockAlign", "props", "path", "handleNavigate", "Open", "handleCollapse", "prev", "handleAddSection", "OpenCreateObject", "navigable", "React", "AttentionProvider", "StackContext", "Provider", "value", "onCollapse", "onNavigate", "onDelete", "onAdd", "Stack", "orientation", "size", "data-testid", "item", "StackSection", "key", "div", "role", "className", "Button", "classNames", "onClick", "Plus", "span"]
+}

package/dist/lib/browser/{chunk-L34RFJ2L.mjs → chunk-XOUJQIK6.mjs}

@@ -1,20 +1,21 @@
 // packages/plugins/plugin-stack/src/types/stack.ts
-import { S, TypedObject } from "@dxos/echo-schema";
-var SectionSchema = S.Struct({
-  height: S.optional(S.Number),
+import { Schema } from "effect";
+import { TypedObject } from "@dxos/echo-schema";
+var SectionSchema = Schema.Struct({
+  height: Schema.optional(Schema.Number),
   // Space for data that isn't stack-specific but is specific to this view instance.
   //  e.g. cover/fill for an image
-  custom: S.optional(S.Record({
-    key: S.String,
-    value: S.Any
+  custom: Schema.optional(Schema.Record({
+    key: Schema.String,
+    value: Schema.Any
   }))
 });
 var StackViewType = class extends TypedObject({
   typename: "dxos.org/type/StackView",
   version: "0.1.0"
 })({
-  sections: S.mutable(S.Record({
-    key: S.String,
+  sections: Schema.mutable(Schema.Record({
+    key: Schema.String,
     value: SectionSchema
   }))
 }) {
@@ -24,4 +25,4 @@ export {
   SectionSchema,
   StackViewType
 };
-//# sourceMappingURL=chunk-L34RFJ2L.mjs.map
+//# sourceMappingURL=chunk-XOUJQIK6.mjs.map

package/dist/lib/browser/chunk-XOUJQIK6.mjs.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../src/types/stack.ts"],
+  "sourcesContent": ["//\n// Copyright 2024 DXOS.org\n//\n\nimport { Schema } from 'effect';\n\nimport { TypedObject } from '@dxos/echo-schema';\n\n// All section metadata needs to be optional/have defaults.\n// Any objects added to the collection will start with the section defaults.\n// If an object is removed from the collection without removing the section metadata this is fine.\n// Stack components should clean-up the superfluous data on future edits.\n\nexport const SectionSchema = Schema.Struct({\n  height: Schema.optional(Schema.Number),\n  // Space for data that isn't stack-specific but is specific to this view instance.\n  //  e.g. cover/fill for an image\n  custom: Schema.optional(Schema.Record({ key: Schema.String, value: Schema.Any })),\n});\n\n// TODO(burdon): Should be just type/Stack?\nexport class StackViewType extends TypedObject({ typename: 'dxos.org/type/StackView', version: '0.1.0' })({\n  sections: Schema.mutable(Schema.Record({ key: Schema.String, value: SectionSchema })),\n}) {}\n"],
+  "mappings": ";AAIA,SAASA,cAAc;AAEvB,SAASC,mBAAmB;AAOrB,IAAMC,gBAAgBC,OAAOC,OAAO;EACzCC,QAAQF,OAAOG,SAASH,OAAOI,MAAM;;;EAGrCC,QAAQL,OAAOG,SAASH,OAAOM,OAAO;IAAEC,KAAKP,OAAOQ;IAAQC,OAAOT,OAAOU;EAAI,CAAA,CAAA;AAChF,CAAA;AAGO,IAAMC,gBAAN,cAA4BC,YAAY;EAAEC,UAAU;EAA2BC,SAAS;AAAQ,CAAA,EAAG;EACxGC,UAAUf,OAAOgB,QAAQhB,OAAOM,OAAO;IAAEC,KAAKP,OAAOQ;IAAQC,OAAOV;EAAc,CAAA,CAAA;AACpF,CAAA,EAAA;AAAI;",
+  "names": ["Schema", "TypedObject", "SectionSchema", "Schema", "Struct", "height", "optional", "Number", "custom", "Record", "key", "String", "value", "Any", "StackViewType", "TypedObject", "typename", "version", "sections", "mutable"]
+}

package/dist/lib/browser/index.mjs

@@ -1,30 +1,19 @@
+import {
+  StackViewType
+} from "./chunk-XOUJQIK6.mjs";
 import {
   SECTION_IDENTIFIER,
   STACK_PLUGIN,
   meta
 } from "./chunk-XHZTILS3.mjs";
-import {
-  StackViewType
-} from "./chunk-L34RFJ2L.mjs";
 
-// packages/plugins/plugin-stack/src/StackPlugin.tsx
-import React2 from "react";
-import { Capabilities, contributes, createSurface, defineModule, definePlugin, Events } from "@dxos/app-framework";
-import { fullyQualifiedId } from "@dxos/client/echo";
-import { isInstanceOf } from "@dxos/echo-schema";
+// packages/plugins/plugin-stack/src/StackPlugin.ts
+import { Capabilities, contributes, defineModule, definePlugin, Events } from "@dxos/app-framework";
 import { ClientCapabilities, ClientEvents } from "@dxos/plugin-client";
-import { CollectionType } from "@dxos/plugin-space/types";
 
-// packages/plugins/plugin-stack/src/components/index.ts
-import { lazy } from "react";
-
-// packages/plugins/plugin-stack/src/components/StackSettings.tsx
-import React from "react";
-import { Input, useTranslation } from "@dxos/react-ui";
-import { DeprecatedFormContainer, DeprecatedFormInput } from "@dxos/react-ui-form";
-
-// packages/plugins/plugin-stack/src/components/index.ts
-var StackMain = lazy(() => import("./StackMain-E42SHTS6.mjs"));
+// packages/plugins/plugin-stack/src/capabilities/index.ts
+import { lazy } from "@dxos/app-framework";
+var ReactSurface = lazy(() => import("./react-surface-FIWIAQRE.mjs"));
 
 // packages/plugins/plugin-stack/src/translations.ts
 import { translations as stackTranslations } from "@dxos/react-ui-stack";
@@ -57,7 +46,7 @@ var translations_default = [
   ...stackTranslations
 ];
 
-// packages/plugins/plugin-stack/src/StackPlugin.tsx
+// packages/plugins/plugin-stack/src/StackPlugin.ts
 var StackPlugin = () => definePlugin(meta, [
   defineModule({
     id: `${meta.id}/module/translations`,
@@ -99,24 +88,7 @@ var StackPlugin = () => definePlugin(meta, [
   defineModule({
     id: `${meta.id}/module/react-surface`,
     activatesOn: Events.SetupReactSurface,
-    activate: () => contributes(Capabilities.ReactSurface, createSurface({
-      id: `${STACK_PLUGIN}/article`,
-      role: "article",
-      filter: (data) => isInstanceOf(CollectionType, data.subject),
-      component: ({ data }) => {
-        const id = typeof data.id === "string" ? data.id : void 0;
-        return /* @__PURE__ */ React2.createElement("div", {
-          role: "none",
-          className: "overflow-auto",
-          style: {
-            contain: "layout"
-          }
-        }, /* @__PURE__ */ React2.createElement(StackMain, {
-          id: id ?? fullyQualifiedId(data.subject),
-          collection: data.subject
-        }));
-      }
-    }))
+    activate: ReactSurface
   })
 ]);
 export {

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

@@ -1,7 +1,7 @@
 {
   "version": 3,
-  "sources": ["../../../src/StackPlugin.tsx", "../../../src/components/index.ts", "../../../src/components/StackSettings.tsx", "../../../src/translations.ts"],
-  "sourcesContent": ["//\n// Copyright 2023 DXOS.org\n//\n\nimport React from 'react';\n\nimport { Capabilities, contributes, createSurface, defineModule, definePlugin, Events } from '@dxos/app-framework';\nimport { type ReactiveEchoObject, fullyQualifiedId } from '@dxos/client/echo';\nimport { isInstanceOf } from '@dxos/echo-schema';\nimport { ClientCapabilities, ClientEvents } from '@dxos/plugin-client';\nimport { CollectionType } from '@dxos/plugin-space/types';\n\nimport { StackMain } from './components';\nimport { meta, SECTION_IDENTIFIER, STACK_PLUGIN } from './meta';\nimport translations from './translations';\nimport { StackViewType } from './types';\n\nexport const StackPlugin = () =>\n  definePlugin(meta, [\n    defineModule({\n      id: `${meta.id}/module/translations`,\n      activatesOn: Events.SetupTranslations,\n      activate: () => contributes(Capabilities.Translations, translations),\n    }),\n    defineModule({\n      id: `${meta.id}/module/metadata`,\n      activatesOn: Events.SetupMetadata,\n      activate: () => [\n        contributes(Capabilities.Metadata, {\n          id: SECTION_IDENTIFIER,\n          metadata: {\n            parse: (section: { object: ReactiveEchoObject<any> }, type: string) => {\n              switch (type) {\n                case 'node':\n                  // TODO(wittjosiah): Remove cast.\n                  return { id: section.object.id, label: section.object.title, data: section.object };\n                case 'object':\n                  return section.object;\n                case 'view-object':\n                  return section;\n              }\n            },\n          },\n        }),\n      ],\n    }),\n    defineModule({\n      id: `${meta.id}/module/schema`,\n      activatesOn: ClientEvents.SetupSchema,\n      activate: () => contributes(ClientCapabilities.Schema, [StackViewType]),\n    }),\n    defineModule({\n      id: `${meta.id}/module/react-surface`,\n      activatesOn: Events.SetupReactSurface,\n      activate: () =>\n        contributes(\n          Capabilities.ReactSurface,\n          createSurface({\n            id: `${STACK_PLUGIN}/article`,\n            role: 'article',\n            filter: (data): data is { id?: string; subject: CollectionType } =>\n              isInstanceOf(CollectionType, data.subject),\n            component: ({ data }) => {\n              // This allows the id to be overridden by the surface for situations where the id of the collection\n              // is not the same as the id of what is being represented (e.g., a space with a root collection).\n              const id = typeof data.id === 'string' ? data.id : undefined;\n              return (\n                <div role='none' className='overflow-auto' style={{ contain: 'layout' }}>\n                  <StackMain id={id ?? fullyQualifiedId(data.subject)} collection={data.subject} />\n                </div>\n              );\n            },\n          }),\n        ),\n    }),\n  ]);\n", "//\n// Copyright 2023 DXOS.org\n//\n\nimport { lazy } from 'react';\n\nexport const StackMain = lazy(() => import('./StackMain'));\n\nexport * from './StackSettings';\n", "//\n// Copyright 2023 DXOS.org\n//\n\nimport React from 'react';\n\nimport { Input, useTranslation } from '@dxos/react-ui';\nimport { DeprecatedFormContainer, DeprecatedFormInput } from '@dxos/react-ui-form';\n\nimport { STACK_PLUGIN } from '../meta';\nimport { type StackSettingsProps } from '../types';\n\nexport const StackSettings = ({ settings }: { settings: StackSettingsProps }) => {\n  const { t } = useTranslation(STACK_PLUGIN);\n\n  return (\n    <DeprecatedFormContainer>\n      <DeprecatedFormInput label={t('settings separation label')}>\n        <Input.Switch checked={settings.separation} onCheckedChange={(checked) => (settings.separation = !!checked)} />\n      </DeprecatedFormInput>\n    </DeprecatedFormContainer>\n  );\n};\n", "//\n// Copyright 2023 DXOS.org\n//\n\nimport { translations as stackTranslations } from '@dxos/react-ui-stack';\n\nimport { STACK_PLUGIN } from './meta';\n\nexport default [\n  {\n    'en-US': {\n      [STACK_PLUGIN]: {\n        'plugin name': 'Stacks',\n        'settings separation label': 'Separate sections',\n        'add section beforeAll dialog title': 'Add a section to the start',\n        'add section afterAll dialog title': 'Add a section to the end',\n        'add section before dialog title': 'Add a section',\n        'add section after dialog title': 'Add a section',\n        'add section input placeholder': 'Find the type of section to add',\n        'upload file label': 'Add file',\n        'add section label': 'Add section',\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        'open chat thread label': 'Open chat thread',\n        'drag handle label': 'Press space or enter to begin dragging this item.',\n      },\n    },\n  },\n  ...stackTranslations,\n];\n"],
-  "mappings": ";;;;;;;;;;AAIA,OAAOA,YAAW;AAElB,SAASC,cAAcC,aAAaC,eAAeC,cAAcC,cAAcC,cAAc;AAC7F,SAAkCC,wBAAwB;AAC1D,SAASC,oBAAoB;AAC7B,SAASC,oBAAoBC,oBAAoB;AACjD,SAASC,sBAAsB;;;ACN/B,SAASC,YAAY;;;ACArB,OAAOC,WAAW;AAElB,SAASC,OAAOC,sBAAsB;AACtC,SAASC,yBAAyBC,2BAA2B;;;ADDtD,IAAMC,YAAYC,KAAK,MAAM,OAAO,0BAAA,CAAA;;;AEF3C,SAASC,gBAAgBC,yBAAyB;AAIlD,IAAA,uBAAe;EACb;IACE,SAAS;MACP,CAACC,YAAAA,GAAe;QACd,eAAe;QACf,6BAA6B;QAC7B,sCAAsC;QACtC,qCAAqC;QACrC,mCAAmC;QACnC,kCAAkC;QAClC,iCAAiC;QACjC,qBAAqB;QACrB,qBAAqB;QACrB,uBAAuB;QACvB,wBAAwB;QACxB,6BAA6B;QAC7B,0BAA0B;QAC1B,4BAA4B;QAC5B,2BAA2B;QAC3B,gBAAgB;QAChB,kBAAkB;QAClB,0BAA0B;QAC1B,qBAAqB;MACvB;IACF;EACF;KACGC;;;;AHjBE,IAAMC,cAAc,MACzBC,aAAaC,MAAM;EACjBC,aAAa;IACXC,IAAI,GAAGF,KAAKE,EAAE;IACdC,aAAaC,OAAOC;IACpBC,UAAU,MAAMC,YAAYC,aAAaC,cAAcC,oBAAAA;EACzD,CAAA;EACAT,aAAa;IACXC,IAAI,GAAGF,KAAKE,EAAE;IACdC,aAAaC,OAAOO;IACpBL,UAAU,MAAM;MACdC,YAAYC,aAAaI,UAAU;QACjCV,IAAIW;QACJC,UAAU;UACRC,OAAO,CAACC,SAA8CC,SAAAA;AACpD,oBAAQA,MAAAA;cACN,KAAK;AAEH,uBAAO;kBAAEf,IAAIc,QAAQE,OAAOhB;kBAAIiB,OAAOH,QAAQE,OAAOE;kBAAOC,MAAML,QAAQE;gBAAO;cACpF,KAAK;AACH,uBAAOF,QAAQE;cACjB,KAAK;AACH,uBAAOF;YACX;UACF;QACF;MACF,CAAA;;EAEJ,CAAA;EACAf,aAAa;IACXC,IAAI,GAAGF,KAAKE,EAAE;IACdC,aAAamB,aAAaC;IAC1BjB,UAAU,MAAMC,YAAYiB,mBAAmBC,QAAQ;MAACC;KAAc;EACxE,CAAA;EACAzB,aAAa;IACXC,IAAI,GAAGF,KAAKE,EAAE;IACdC,aAAaC,OAAOuB;IACpBrB,UAAU,MACRC,YACEC,aAAaoB,cACbC,cAAc;MACZ3B,IAAI,GAAG4B,YAAAA;MACPC,MAAM;MACNC,QAAQ,CAACX,SACPY,aAAaC,gBAAgBb,KAAKc,OAAO;MAC3CC,WAAW,CAAC,EAAEf,KAAI,MAAE;AAGlB,cAAMnB,KAAK,OAAOmB,KAAKnB,OAAO,WAAWmB,KAAKnB,KAAKmC;AACnD,eACE,gBAAAC,OAAA,cAACC,OAAAA;UAAIR,MAAK;UAAOS,WAAU;UAAgBC,OAAO;YAAEC,SAAS;UAAS;WACpE,gBAAAJ,OAAA,cAACK,WAAAA;UAAUzC,IAAIA,MAAM0C,iBAAiBvB,KAAKc,OAAO;UAAGU,YAAYxB,KAAKc;;MAG5E;IACF,CAAA,CAAA;EAEN,CAAA;CACD;",
-  "names": ["React", "Capabilities", "contributes", "createSurface", "defineModule", "definePlugin", "Events", "fullyQualifiedId", "isInstanceOf", "ClientCapabilities", "ClientEvents", "CollectionType", "lazy", "React", "Input", "useTranslation", "DeprecatedFormContainer", "DeprecatedFormInput", "StackMain", "lazy", "translations", "stackTranslations", "STACK_PLUGIN", "stackTranslations", "StackPlugin", "definePlugin", "meta", "defineModule", "id", "activatesOn", "Events", "SetupTranslations", "activate", "contributes", "Capabilities", "Translations", "translations", "SetupMetadata", "Metadata", "SECTION_IDENTIFIER", "metadata", "parse", "section", "type", "object", "label", "title", "data", "ClientEvents", "SetupSchema", "ClientCapabilities", "Schema", "StackViewType", "SetupReactSurface", "ReactSurface", "createSurface", "STACK_PLUGIN", "role", "filter", "isInstanceOf", "CollectionType", "subject", "component", "undefined", "React", "div", "className", "style", "contain", "StackMain", "fullyQualifiedId", "collection"]
+  "sources": ["../../../src/StackPlugin.ts", "../../../src/capabilities/index.ts", "../../../src/translations.ts"],
+  "sourcesContent": ["//\n// Copyright 2023 DXOS.org\n//\n\nimport { Capabilities, contributes, defineModule, definePlugin, Events } from '@dxos/app-framework';\nimport { type AnyLiveObject } from '@dxos/client/echo';\nimport { ClientCapabilities, ClientEvents } from '@dxos/plugin-client';\n\nimport { ReactSurface } from './capabilities';\nimport { meta, SECTION_IDENTIFIER } from './meta';\nimport translations from './translations';\nimport { StackViewType } from './types';\n\nexport const StackPlugin = () =>\n  definePlugin(meta, [\n    defineModule({\n      id: `${meta.id}/module/translations`,\n      activatesOn: Events.SetupTranslations,\n      activate: () => contributes(Capabilities.Translations, translations),\n    }),\n    defineModule({\n      id: `${meta.id}/module/metadata`,\n      activatesOn: Events.SetupMetadata,\n      activate: () => [\n        contributes(Capabilities.Metadata, {\n          id: SECTION_IDENTIFIER,\n          metadata: {\n            parse: (section: { object: AnyLiveObject<any> }, type: string) => {\n              switch (type) {\n                case 'node':\n                  // TODO(wittjosiah): Remove cast.\n                  return { id: section.object.id, label: section.object.title, data: section.object };\n                case 'object':\n                  return section.object;\n                case 'view-object':\n                  return section;\n              }\n            },\n          },\n        }),\n      ],\n    }),\n    defineModule({\n      id: `${meta.id}/module/schema`,\n      activatesOn: ClientEvents.SetupSchema,\n      activate: () => contributes(ClientCapabilities.Schema, [StackViewType]),\n    }),\n    defineModule({\n      id: `${meta.id}/module/react-surface`,\n      activatesOn: Events.SetupReactSurface,\n      activate: ReactSurface,\n    }),\n  ]);\n", "//\n// Copyright 2025 DXOS.org\n//\n\nimport { lazy } from '@dxos/app-framework';\n\nexport const ReactSurface = lazy(() => import('./react-surface'));\n", "//\n// Copyright 2023 DXOS.org\n//\n\nimport { translations as stackTranslations } from '@dxos/react-ui-stack';\n\nimport { STACK_PLUGIN } from './meta';\n\nexport default [\n  {\n    'en-US': {\n      [STACK_PLUGIN]: {\n        'plugin name': 'Stacks',\n        'settings separation label': 'Separate sections',\n        'add section beforeAll dialog title': 'Add a section to the start',\n        'add section afterAll dialog title': 'Add a section to the end',\n        'add section before dialog title': 'Add a section',\n        'add section after dialog title': 'Add a section',\n        'add section input placeholder': 'Find the type of section to add',\n        'upload file label': 'Add file',\n        'add section label': 'Add section',\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        'open chat thread label': 'Open chat thread',\n        'drag handle label': 'Press space or enter to begin dragging this item.',\n      },\n    },\n  },\n  ...stackTranslations,\n];\n"],
+  "mappings": ";;;;;;;;;;AAIA,SAASA,cAAcC,aAAaC,cAAcC,cAAcC,cAAc;AAE9E,SAASC,oBAAoBC,oBAAoB;;;ACFjD,SAASC,YAAY;AAEd,IAAMC,eAAeC,KAAK,MAAM,OAAO,8BAAA,CAAA;;;ACF9C,SAASC,gBAAgBC,yBAAyB;AAIlD,IAAA,uBAAe;EACb;IACE,SAAS;MACP,CAACC,YAAAA,GAAe;QACd,eAAe;QACf,6BAA6B;QAC7B,sCAAsC;QACtC,qCAAqC;QACrC,mCAAmC;QACnC,kCAAkC;QAClC,iCAAiC;QACjC,qBAAqB;QACrB,qBAAqB;QACrB,uBAAuB;QACvB,wBAAwB;QACxB,6BAA6B;QAC7B,0BAA0B;QAC1B,4BAA4B;QAC5B,2BAA2B;QAC3B,gBAAgB;QAChB,kBAAkB;QAClB,0BAA0B;QAC1B,qBAAqB;MACvB;IACF;EACF;KACGC;;;;AFrBE,IAAMC,cAAc,MACzBC,aAAaC,MAAM;EACjBC,aAAa;IACXC,IAAI,GAAGF,KAAKE,EAAE;IACdC,aAAaC,OAAOC;IACpBC,UAAU,MAAMC,YAAYC,aAAaC,cAAcC,oBAAAA;EACzD,CAAA;EACAT,aAAa;IACXC,IAAI,GAAGF,KAAKE,EAAE;IACdC,aAAaC,OAAOO;IACpBL,UAAU,MAAM;MACdC,YAAYC,aAAaI,UAAU;QACjCV,IAAIW;QACJC,UAAU;UACRC,OAAO,CAACC,SAAyCC,SAAAA;AAC/C,oBAAQA,MAAAA;cACN,KAAK;AAEH,uBAAO;kBAAEf,IAAIc,QAAQE,OAAOhB;kBAAIiB,OAAOH,QAAQE,OAAOE;kBAAOC,MAAML,QAAQE;gBAAO;cACpF,KAAK;AACH,uBAAOF,QAAQE;cACjB,KAAK;AACH,uBAAOF;YACX;UACF;QACF;MACF,CAAA;;EAEJ,CAAA;EACAf,aAAa;IACXC,IAAI,GAAGF,KAAKE,EAAE;IACdC,aAAamB,aAAaC;IAC1BjB,UAAU,MAAMC,YAAYiB,mBAAmBC,QAAQ;MAACC;KAAc;EACxE,CAAA;EACAzB,aAAa;IACXC,IAAI,GAAGF,KAAKE,EAAE;IACdC,aAAaC,OAAOuB;IACpBrB,UAAUsB;EACZ,CAAA;CACD;",
+  "names": ["Capabilities", "contributes", "defineModule", "definePlugin", "Events", "ClientCapabilities", "ClientEvents", "lazy", "ReactSurface", "lazy", "translations", "stackTranslations", "STACK_PLUGIN", "stackTranslations", "StackPlugin", "definePlugin", "meta", "defineModule", "id", "activatesOn", "Events", "SetupTranslations", "activate", "contributes", "Capabilities", "Translations", "translations", "SetupMetadata", "Metadata", "SECTION_IDENTIFIER", "metadata", "parse", "section", "type", "object", "label", "title", "data", "ClientEvents", "SetupSchema", "ClientCapabilities", "Schema", "StackViewType", "SetupReactSurface", "ReactSurface"]
 }