@dxos/react-ui-stack 0.7.5-main.9d2a38b → 0.7.5-main.ff8607b
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 +80 -55
- package/dist/lib/browser/index.mjs.map +3 -3
- package/dist/lib/browser/meta.json +1 -1
- package/dist/lib/node/index.cjs +81 -55
- package/dist/lib/node/index.cjs.map +3 -3
- package/dist/lib/node/meta.json +1 -1
- package/dist/lib/node-esm/index.mjs +80 -55
- package/dist/lib/node-esm/index.mjs.map +3 -3
- package/dist/lib/node-esm/meta.json +1 -1
- package/dist/types/src/components/Stack.d.ts +3 -0
- package/dist/types/src/components/Stack.d.ts.map +1 -1
- package/dist/types/src/components/StackItem.d.ts +2 -0
- package/dist/types/src/components/StackItem.d.ts.map +1 -1
- package/dist/types/src/components/StackItemResizeHandle.d.ts.map +1 -1
- package/dist/types/src/components/StackItemSigil.d.ts.map +1 -1
- package/package.json +28 -27
- package/src/components/Stack.tsx +45 -30
- package/src/components/StackItem.tsx +42 -10
- package/src/components/StackItemHeading.tsx +1 -1
- package/src/components/StackItemResizeHandle.tsx +20 -9
- package/src/components/StackItemSigil.tsx +90 -103
package/dist/lib/node/meta.json
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"inputs":{"packages/ui/react-ui-stack/src/components/StackContext.tsx":{"bytes":3091,"imports":[{"path":"react","kind":"import-statement","external":true}],"format":"esm"},"packages/ui/react-ui-stack/src/components/Stack.tsx":{"bytes":13994,"imports":[{"path":"@atlaskit/pragmatic-drag-and-drop/element/adapter","kind":"import-statement","external":true},{"path":"@atlaskit/pragmatic-drag-and-drop-hitbox/closest-edge","kind":"import-statement","external":true},{"path":"@fluentui/react-tabster","kind":"import-statement","external":true},{"path":"@radix-ui/react-compose-refs","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true},{"path":"@dxos/react-ui","kind":"import-statement","external":true},{"path":"@dxos/react-ui-theme","kind":"import-statement","external":true},{"path":"packages/ui/react-ui-stack/src/components/StackContext.tsx","kind":"import-statement","original":"./StackContext"}],"format":"esm"},"packages/ui/react-ui-stack/src/components/StackItemContent.tsx":{"bytes":5524,"imports":[{"path":"react","kind":"import-statement","external":true},{"path":"@dxos/react-ui-theme","kind":"import-statement","external":true},{"path":"packages/ui/react-ui-stack/src/components/StackContext.tsx","kind":"import-statement","original":"./StackContext"}],"format":"esm"},"packages/ui/react-ui-stack/src/components/StackItemDragHandle.tsx":{"bytes":2101,"imports":[{"path":"@radix-ui/react-slot","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true},{"path":"packages/ui/react-ui-stack/src/components/StackContext.tsx","kind":"import-statement","original":"./StackContext"}],"format":"esm"},"packages/ui/react-ui-stack/src/components/StackItemHeading.tsx":{"bytes":5758,"imports":[{"path":"@fluentui/react-tabster","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true},{"path":"@dxos/react-ui-attention","kind":"import-statement","external":true},{"path":"@dxos/react-ui-theme","kind":"import-statement","external":true},{"path":"packages/ui/react-ui-stack/src/components/StackContext.tsx","kind":"import-statement","original":"./StackContext"}],"format":"esm"},"packages/ui/react-ui-stack/src/components/StackItemResizeHandle.tsx":{"bytes":14876,"imports":[{"path":"@atlaskit/pragmatic-drag-and-drop/element/adapter","kind":"import-statement","external":true},{"path":"@atlaskit/pragmatic-drag-and-drop/element/disable-native-drag-preview","kind":"import-statement","external":true},{"path":"@atlaskit/pragmatic-drag-and-drop/prevent-unhandled","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true},{"path":"@dxos/react-ui-theme","kind":"import-statement","external":true},{"path":"packages/ui/react-ui-stack/src/components/StackContext.tsx","kind":"import-statement","original":"./StackContext"},{"path":"packages/ui/react-ui-stack/src/components/StackItem.tsx","kind":"import-statement","original":"./StackItem"}],"format":"esm"},"packages/ui/react-ui-stack/src/components/MenuSignifier.tsx":{"bytes":3282,"imports":[{"path":"react","kind":"import-statement","external":true}],"format":"esm"},"packages/ui/react-ui-stack/src/translations.ts":{"bytes":1870,"imports":[],"format":"esm"},"packages/ui/react-ui-stack/src/components/StackItemSigil.tsx":{"bytes":20057,"imports":[{"path":"react","kind":"import-statement","external":true},{"path":"@dxos/keyboard","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-theme","kind":"import-statement","external":true},{"path":"@dxos/util","kind":"import-statement","external":true},{"path":"packages/ui/react-ui-stack/src/components/MenuSignifier.tsx","kind":"import-statement","original":"./MenuSignifier"},{"path":"packages/ui/react-ui-stack/src/translations.ts","kind":"import-statement","original":"../translations"}],"format":"esm"},"packages/ui/react-ui-stack/src/components/StackItem.tsx":{"bytes":21446,"imports":[{"path":"@atlaskit/pragmatic-drag-and-drop/combine","kind":"import-statement","external":true},{"path":"@atlaskit/pragmatic-drag-and-drop/element/adapter","kind":"import-statement","external":true},{"path":"@atlaskit/pragmatic-drag-and-drop/element/disable-native-drag-preview","kind":"import-statement","external":true},{"path":"@atlaskit/pragmatic-drag-and-drop/prevent-unhandled","kind":"import-statement","external":true},{"path":"@atlaskit/pragmatic-drag-and-drop-hitbox/closest-edge","kind":"import-statement","external":true},{"path":"@fluentui/react-tabster","kind":"import-statement","external":true},{"path":"@radix-ui/react-compose-refs","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true},{"path":"@dxos/react-ui","kind":"import-statement","external":true},{"path":"@dxos/react-ui-theme","kind":"import-statement","external":true},{"path":"packages/ui/react-ui-stack/src/components/StackContext.tsx","kind":"import-statement","original":"./StackContext"},{"path":"packages/ui/react-ui-stack/src/components/StackItemContent.tsx","kind":"import-statement","original":"./StackItemContent"},{"path":"packages/ui/react-ui-stack/src/components/StackItemDragHandle.tsx","kind":"import-statement","original":"./StackItemDragHandle"},{"path":"packages/ui/react-ui-stack/src/components/StackItemHeading.tsx","kind":"import-statement","original":"./StackItemHeading"},{"path":"packages/ui/react-ui-stack/src/components/StackItemResizeHandle.tsx","kind":"import-statement","original":"./StackItemResizeHandle"},{"path":"packages/ui/react-ui-stack/src/components/StackItemSigil.tsx","kind":"import-statement","original":"./StackItemSigil"}],"format":"esm"},"packages/ui/react-ui-stack/src/components/LayoutControls.tsx":{"bytes":11653,"imports":[{"path":"react","kind":"import-statement","external":true},{"path":"@dxos/react-ui","kind":"import-statement","external":true},{"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":801,"imports":[{"path":"packages/ui/react-ui-stack/src/components/Stack.tsx","kind":"import-statement","original":"./Stack"},{"path":"packages/ui/react-ui-stack/src/components/StackItem.tsx","kind":"import-statement","original":"./StackItem"},{"path":"packages/ui/react-ui-stack/src/components/LayoutControls.tsx","kind":"import-statement","original":"./LayoutControls"},{"path":"packages/ui/react-ui-stack/src/components/StackContext.tsx","kind":"import-statement","original":"./StackContext"}],"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/stack-manager.ts":{"bytes":7183,"imports":[],"format":"esm"},"packages/ui/react-ui-stack/src/testing/index.ts":{"bytes":519,"imports":[{"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":54279},"packages/ui/react-ui-stack/dist/lib/node/index.cjs":{"imports":[{"path":"@atlaskit/pragmatic-drag-and-drop/element/adapter","kind":"import-statement","external":true},{"path":"@atlaskit/pragmatic-drag-and-drop-hitbox/closest-edge","kind":"import-statement","external":true},{"path":"@fluentui/react-tabster","kind":"import-statement","external":true},{"path":"@radix-ui/react-compose-refs","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true},{"path":"@dxos/react-ui","kind":"import-statement","external":true},{"path":"@dxos/react-ui-theme","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true},{"path":"@atlaskit/pragmatic-drag-and-drop/combine","kind":"import-statement","external":true},{"path":"@atlaskit/pragmatic-drag-and-drop/element/adapter","kind":"import-statement","external":true},{"path":"@atlaskit/pragmatic-drag-and-drop/element/disable-native-drag-preview","kind":"import-statement","external":true},{"path":"@atlaskit/pragmatic-drag-and-drop/prevent-unhandled","kind":"import-statement","external":true},{"path":"@atlaskit/pragmatic-drag-and-drop-hitbox/closest-edge","kind":"import-statement","external":true},{"path":"@fluentui/react-tabster","kind":"import-statement","external":true},{"path":"@radix-ui/react-compose-refs","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true},{"path":"@dxos/react-ui","kind":"import-statement","external":true},{"path":"@dxos/react-ui-theme","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true},{"path":"@dxos/react-ui-theme","kind":"import-statement","external":true},{"path":"@radix-ui/react-slot","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true},{"path":"@fluentui/react-tabster","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true},{"path":"@dxos/react-ui-attention","kind":"import-statement","external":true},{"path":"@dxos/react-ui-theme","kind":"import-statement","external":true},{"path":"@atlaskit/pragmatic-drag-and-drop/element/adapter","kind":"import-statement","external":true},{"path":"@atlaskit/pragmatic-drag-and-drop/element/disable-native-drag-preview","kind":"import-statement","external":true},{"path":"@atlaskit/pragmatic-drag-and-drop/prevent-unhandled","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true},{"path":"@dxos/react-ui-theme","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true},{"path":"@dxos/keyboard","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-theme","kind":"import-statement","external":true},{"path":"@dxos/util","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true},{"path":"@dxos/react-ui","kind":"import-statement","external":true}],"exports":["DEFAULT_EXTRINSIC_SIZE","DEFAULT_HORIZONTAL_SIZE","DEFAULT_VERTICAL_SIZE","LayoutControls","Stack","StackContext","StackItem","StackItemContext","railGridHorizontal","railGridVertical","translations","useStack","useStackItem"],"entryPoint":"packages/ui/react-ui-stack/src/index.ts","inputs":{"packages/ui/react-ui-stack/src/components/Stack.tsx":{"bytesInOutput":3397},"packages/ui/react-ui-stack/src/components/StackContext.tsx":{"bytesInOutput":408},"packages/ui/react-ui-stack/src/components/index.ts":{"bytesInOutput":0},"packages/ui/react-ui-stack/src/components/StackItem.tsx":{"bytesInOutput":5094},"packages/ui/react-ui-stack/src/components/StackItemContent.tsx":{"bytesInOutput":850},"packages/ui/react-ui-stack/src/components/StackItemDragHandle.tsx":{"bytesInOutput":335},"packages/ui/react-ui-stack/src/components/StackItemHeading.tsx":{"bytesInOutput":1286},"packages/ui/react-ui-stack/src/components/StackItemResizeHandle.tsx":{"bytesInOutput":3762},"packages/ui/react-ui-stack/src/components/StackItemSigil.tsx":{"bytesInOutput":4883},"packages/ui/react-ui-stack/src/components/MenuSignifier.tsx":{"bytesInOutput":442},"packages/ui/react-ui-stack/src/translations.ts":{"bytesInOutput":444},"packages/ui/react-ui-stack/src/components/LayoutControls.tsx":{"bytesInOutput":3030},"packages/ui/react-ui-stack/src/index.ts":{"bytesInOutput":0}},"bytes":25121},"packages/ui/react-ui-stack/dist/lib/node/testing/index.cjs.map":{"imports":[],"exports":[],"inputs":{},"bytes":3597},"packages/ui/react-ui-stack/dist/lib/node/testing/index.cjs":{"imports":[],"exports":["SectionManager","StackManager"],"entryPoint":"packages/ui/react-ui-stack/src/testing/index.ts","inputs":{"packages/ui/react-ui-stack/src/testing/stack-manager.ts":{"bytesInOutput":1516},"packages/ui/react-ui-stack/src/testing/index.ts":{"bytesInOutput":0}},"bytes":1655}}}
|
|
1
|
+
{"inputs":{"packages/ui/react-ui-stack/src/components/StackContext.tsx":{"bytes":3091,"imports":[{"path":"react","kind":"import-statement","external":true}],"format":"esm"},"packages/ui/react-ui-stack/src/components/Stack.tsx":{"bytes":15800,"imports":[{"path":"@atlaskit/pragmatic-drag-and-drop/combine","kind":"import-statement","external":true},{"path":"@atlaskit/pragmatic-drag-and-drop/element/adapter","kind":"import-statement","external":true},{"path":"@atlaskit/pragmatic-drag-and-drop-auto-scroll/element","kind":"import-statement","external":true},{"path":"@atlaskit/pragmatic-drag-and-drop-hitbox/closest-edge","kind":"import-statement","external":true},{"path":"@fluentui/react-tabster","kind":"import-statement","external":true},{"path":"@radix-ui/react-compose-refs","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true},{"path":"@dxos/react-ui","kind":"import-statement","external":true},{"path":"@dxos/react-ui-theme","kind":"import-statement","external":true},{"path":"packages/ui/react-ui-stack/src/components/StackContext.tsx","kind":"import-statement","original":"./StackContext"}],"format":"esm"},"packages/ui/react-ui-stack/src/components/StackItemContent.tsx":{"bytes":5524,"imports":[{"path":"react","kind":"import-statement","external":true},{"path":"@dxos/react-ui-theme","kind":"import-statement","external":true},{"path":"packages/ui/react-ui-stack/src/components/StackContext.tsx","kind":"import-statement","original":"./StackContext"}],"format":"esm"},"packages/ui/react-ui-stack/src/components/StackItemDragHandle.tsx":{"bytes":2101,"imports":[{"path":"@radix-ui/react-slot","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true},{"path":"packages/ui/react-ui-stack/src/components/StackContext.tsx","kind":"import-statement","original":"./StackContext"}],"format":"esm"},"packages/ui/react-ui-stack/src/components/StackItemHeading.tsx":{"bytes":5758,"imports":[{"path":"@fluentui/react-tabster","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true},{"path":"@dxos/react-ui-attention","kind":"import-statement","external":true},{"path":"@dxos/react-ui-theme","kind":"import-statement","external":true},{"path":"packages/ui/react-ui-stack/src/components/StackContext.tsx","kind":"import-statement","original":"./StackContext"}],"format":"esm"},"packages/ui/react-ui-stack/src/components/StackItemResizeHandle.tsx":{"bytes":16102,"imports":[{"path":"@atlaskit/pragmatic-drag-and-drop/element/adapter","kind":"import-statement","external":true},{"path":"@atlaskit/pragmatic-drag-and-drop/element/disable-native-drag-preview","kind":"import-statement","external":true},{"path":"@atlaskit/pragmatic-drag-and-drop/prevent-unhandled","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true},{"path":"@dxos/react-ui-theme","kind":"import-statement","external":true},{"path":"packages/ui/react-ui-stack/src/components/StackContext.tsx","kind":"import-statement","original":"./StackContext"},{"path":"packages/ui/react-ui-stack/src/components/StackItem.tsx","kind":"import-statement","original":"./StackItem"}],"format":"esm"},"packages/ui/react-ui-stack/src/components/MenuSignifier.tsx":{"bytes":3282,"imports":[{"path":"react","kind":"import-statement","external":true}],"format":"esm"},"packages/ui/react-ui-stack/src/translations.ts":{"bytes":1870,"imports":[],"format":"esm"},"packages/ui/react-ui-stack/src/components/StackItemSigil.tsx":{"bytes":18750,"imports":[{"path":"react","kind":"import-statement","external":true},{"path":"@dxos/keyboard","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-theme","kind":"import-statement","external":true},{"path":"@dxos/util","kind":"import-statement","external":true},{"path":"packages/ui/react-ui-stack/src/components/MenuSignifier.tsx","kind":"import-statement","original":"./MenuSignifier"},{"path":"packages/ui/react-ui-stack/src/translations.ts","kind":"import-statement","original":"../translations"}],"format":"esm"},"packages/ui/react-ui-stack/src/components/StackItem.tsx":{"bytes":24832,"imports":[{"path":"@atlaskit/pragmatic-drag-and-drop/combine","kind":"import-statement","external":true},{"path":"@atlaskit/pragmatic-drag-and-drop/element/adapter","kind":"import-statement","external":true},{"path":"@atlaskit/pragmatic-drag-and-drop/element/preserve-offset-on-source","kind":"import-statement","external":true},{"path":"@atlaskit/pragmatic-drag-and-drop/element/scroll-just-enough-into-view","kind":"import-statement","external":true},{"path":"@atlaskit/pragmatic-drag-and-drop-hitbox/closest-edge","kind":"import-statement","external":true},{"path":"@fluentui/react-tabster","kind":"import-statement","external":true},{"path":"@radix-ui/react-compose-refs","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true},{"path":"@dxos/react-ui","kind":"import-statement","external":true},{"path":"@dxos/react-ui-theme","kind":"import-statement","external":true},{"path":"packages/ui/react-ui-stack/src/components/StackContext.tsx","kind":"import-statement","original":"./StackContext"},{"path":"packages/ui/react-ui-stack/src/components/StackItemContent.tsx","kind":"import-statement","original":"./StackItemContent"},{"path":"packages/ui/react-ui-stack/src/components/StackItemDragHandle.tsx","kind":"import-statement","original":"./StackItemDragHandle"},{"path":"packages/ui/react-ui-stack/src/components/StackItemHeading.tsx","kind":"import-statement","original":"./StackItemHeading"},{"path":"packages/ui/react-ui-stack/src/components/StackItemResizeHandle.tsx","kind":"import-statement","original":"./StackItemResizeHandle"},{"path":"packages/ui/react-ui-stack/src/components/StackItemSigil.tsx","kind":"import-statement","original":"./StackItemSigil"}],"format":"esm"},"packages/ui/react-ui-stack/src/components/LayoutControls.tsx":{"bytes":11653,"imports":[{"path":"react","kind":"import-statement","external":true},{"path":"@dxos/react-ui","kind":"import-statement","external":true},{"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":801,"imports":[{"path":"packages/ui/react-ui-stack/src/components/Stack.tsx","kind":"import-statement","original":"./Stack"},{"path":"packages/ui/react-ui-stack/src/components/StackItem.tsx","kind":"import-statement","original":"./StackItem"},{"path":"packages/ui/react-ui-stack/src/components/LayoutControls.tsx","kind":"import-statement","original":"./LayoutControls"},{"path":"packages/ui/react-ui-stack/src/components/StackContext.tsx","kind":"import-statement","original":"./StackContext"}],"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/stack-manager.ts":{"bytes":7183,"imports":[],"format":"esm"},"packages/ui/react-ui-stack/src/testing/index.ts":{"bytes":519,"imports":[{"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":56885},"packages/ui/react-ui-stack/dist/lib/node/index.cjs":{"imports":[{"path":"@atlaskit/pragmatic-drag-and-drop/combine","kind":"import-statement","external":true},{"path":"@atlaskit/pragmatic-drag-and-drop/element/adapter","kind":"import-statement","external":true},{"path":"@atlaskit/pragmatic-drag-and-drop-auto-scroll/element","kind":"import-statement","external":true},{"path":"@atlaskit/pragmatic-drag-and-drop-hitbox/closest-edge","kind":"import-statement","external":true},{"path":"@fluentui/react-tabster","kind":"import-statement","external":true},{"path":"@radix-ui/react-compose-refs","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true},{"path":"@dxos/react-ui","kind":"import-statement","external":true},{"path":"@dxos/react-ui-theme","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true},{"path":"@atlaskit/pragmatic-drag-and-drop/combine","kind":"import-statement","external":true},{"path":"@atlaskit/pragmatic-drag-and-drop/element/adapter","kind":"import-statement","external":true},{"path":"@atlaskit/pragmatic-drag-and-drop/element/preserve-offset-on-source","kind":"import-statement","external":true},{"path":"@atlaskit/pragmatic-drag-and-drop/element/scroll-just-enough-into-view","kind":"import-statement","external":true},{"path":"@atlaskit/pragmatic-drag-and-drop-hitbox/closest-edge","kind":"import-statement","external":true},{"path":"@fluentui/react-tabster","kind":"import-statement","external":true},{"path":"@radix-ui/react-compose-refs","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true},{"path":"@dxos/react-ui","kind":"import-statement","external":true},{"path":"@dxos/react-ui-theme","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true},{"path":"@dxos/react-ui-theme","kind":"import-statement","external":true},{"path":"@radix-ui/react-slot","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true},{"path":"@fluentui/react-tabster","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true},{"path":"@dxos/react-ui-attention","kind":"import-statement","external":true},{"path":"@dxos/react-ui-theme","kind":"import-statement","external":true},{"path":"@atlaskit/pragmatic-drag-and-drop/element/adapter","kind":"import-statement","external":true},{"path":"@atlaskit/pragmatic-drag-and-drop/element/disable-native-drag-preview","kind":"import-statement","external":true},{"path":"@atlaskit/pragmatic-drag-and-drop/prevent-unhandled","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true},{"path":"@dxos/react-ui-theme","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true},{"path":"@dxos/keyboard","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-theme","kind":"import-statement","external":true},{"path":"@dxos/util","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true},{"path":"@dxos/react-ui","kind":"import-statement","external":true}],"exports":["DEFAULT_EXTRINSIC_SIZE","DEFAULT_HORIZONTAL_SIZE","DEFAULT_VERTICAL_SIZE","LayoutControls","Stack","StackContext","StackItem","StackItemContext","autoScrollRootAttributes","railGridHorizontal","railGridVertical","translations","useStack","useStackItem"],"entryPoint":"packages/ui/react-ui-stack/src/index.ts","inputs":{"packages/ui/react-ui-stack/src/components/Stack.tsx":{"bytesInOutput":3846},"packages/ui/react-ui-stack/src/components/StackContext.tsx":{"bytesInOutput":408},"packages/ui/react-ui-stack/src/components/index.ts":{"bytesInOutput":0},"packages/ui/react-ui-stack/src/components/StackItem.tsx":{"bytesInOutput":5857},"packages/ui/react-ui-stack/src/components/StackItemContent.tsx":{"bytesInOutput":850},"packages/ui/react-ui-stack/src/components/StackItemDragHandle.tsx":{"bytesInOutput":335},"packages/ui/react-ui-stack/src/components/StackItemHeading.tsx":{"bytesInOutput":1286},"packages/ui/react-ui-stack/src/components/StackItemResizeHandle.tsx":{"bytesInOutput":4101},"packages/ui/react-ui-stack/src/components/StackItemSigil.tsx":{"bytesInOutput":4540},"packages/ui/react-ui-stack/src/components/MenuSignifier.tsx":{"bytesInOutput":442},"packages/ui/react-ui-stack/src/translations.ts":{"bytesInOutput":444},"packages/ui/react-ui-stack/src/components/LayoutControls.tsx":{"bytesInOutput":3014},"packages/ui/react-ui-stack/src/index.ts":{"bytesInOutput":0}},"bytes":26341},"packages/ui/react-ui-stack/dist/lib/node/testing/index.cjs.map":{"imports":[],"exports":[],"inputs":{},"bytes":3597},"packages/ui/react-ui-stack/dist/lib/node/testing/index.cjs":{"imports":[],"exports":["SectionManager","StackManager"],"entryPoint":"packages/ui/react-ui-stack/src/testing/index.ts","inputs":{"packages/ui/react-ui-stack/src/testing/stack-manager.ts":{"bytesInOutput":1516},"packages/ui/react-ui-stack/src/testing/index.ts":{"bytesInOutput":0}},"bytes":1655}}}
|
|
@@ -1,7 +1,9 @@
|
|
|
1
1
|
import { createRequire } from 'node:module';const require = createRequire(import.meta.url);
|
|
2
2
|
|
|
3
3
|
// packages/ui/react-ui-stack/src/components/Stack.tsx
|
|
4
|
+
import { combine } from "@atlaskit/pragmatic-drag-and-drop/combine";
|
|
4
5
|
import { dropTargetForElements } from "@atlaskit/pragmatic-drag-and-drop/element/adapter";
|
|
6
|
+
import { autoScrollForElements } from "@atlaskit/pragmatic-drag-and-drop-auto-scroll/element";
|
|
5
7
|
import { attachClosestEdge, extractClosestEdge } from "@atlaskit/pragmatic-drag-and-drop-hitbox/closest-edge";
|
|
6
8
|
import { useArrowNavigationGroup } from "@fluentui/react-tabster";
|
|
7
9
|
import { composeRefs } from "@radix-ui/react-compose-refs";
|
|
@@ -29,6 +31,9 @@ var useStackItem = () => useContext(StackItemContext);
|
|
|
29
31
|
// packages/ui/react-ui-stack/src/components/Stack.tsx
|
|
30
32
|
var railGridHorizontal = "grid-rows-[[rail-start]_var(--rail-size)_[content-start]_1fr_[content-end]]";
|
|
31
33
|
var railGridVertical = "grid-cols-[[rail-start]_var(--rail-size)_[content-start]_1fr_[content-end]]";
|
|
34
|
+
var autoScrollRootAttributes = {
|
|
35
|
+
"data-drag-autoscroll": "idle"
|
|
36
|
+
};
|
|
32
37
|
var Stack = /* @__PURE__ */ forwardRef(({ children, classNames, style, orientation = "vertical", rail = true, size = "intrinsic", onRearrange, itemsCount = Children.count(children), ...props }, forwardedRef) => {
|
|
33
38
|
const [stackElement, stackRef] = useState(null);
|
|
34
39
|
const composedItemRef = composeRefs(stackRef, forwardedRef);
|
|
@@ -46,7 +51,7 @@ var Stack = /* @__PURE__ */ forwardRef(({ children, classNames, style, orientati
|
|
|
46
51
|
return;
|
|
47
52
|
}
|
|
48
53
|
const acceptSourceType = orientation === "horizontal" ? "column" : "card";
|
|
49
|
-
return dropTargetForElements({
|
|
54
|
+
return combine(dropTargetForElements({
|
|
50
55
|
element: stackElement,
|
|
51
56
|
getData: ({ input, element }) => {
|
|
52
57
|
return attachClosestEdge({
|
|
@@ -77,10 +82,14 @@ var Stack = /* @__PURE__ */ forwardRef(({ children, classNames, style, orientati
|
|
|
77
82
|
onRearrange(source.data, self.data, extractClosestEdge(self.data));
|
|
78
83
|
}
|
|
79
84
|
}
|
|
80
|
-
})
|
|
85
|
+
}), autoScrollForElements({
|
|
86
|
+
element: stackElement,
|
|
87
|
+
getAllowedAxis: () => orientation
|
|
88
|
+
}));
|
|
81
89
|
}, [
|
|
82
90
|
stackElement,
|
|
83
|
-
selfDroppable
|
|
91
|
+
selfDroppable,
|
|
92
|
+
orientation
|
|
84
93
|
]);
|
|
85
94
|
return /* @__PURE__ */ React.createElement(StackContext.Provider, {
|
|
86
95
|
value: {
|
|
@@ -92,20 +101,24 @@ var Stack = /* @__PURE__ */ forwardRef(({ children, classNames, style, orientati
|
|
|
92
101
|
}, /* @__PURE__ */ React.createElement("div", {
|
|
93
102
|
...props,
|
|
94
103
|
...arrowNavigationGroup,
|
|
95
|
-
className: mx("grid relative", rail ? orientation === "horizontal" ? railGridHorizontal : railGridVertical : orientation === "horizontal" ? "grid-rows-1" : "grid-cols-1", size === "contain" && (orientation === "horizontal" ? "overflow-x-auto min-bs-0 bs-full max-bs-full" : "overflow-y-auto min-is-0 is-full max-is-full"), classNames),
|
|
104
|
+
className: mx("grid relative", rail ? orientation === "horizontal" ? railGridHorizontal : railGridVertical : orientation === "horizontal" ? "grid-rows-1 pli-1" : "grid-cols-1 plb-1", size === "contain" && (orientation === "horizontal" ? "overflow-x-auto min-bs-0 bs-full max-bs-full" : "overflow-y-auto min-is-0 is-full max-is-full"), classNames),
|
|
105
|
+
"data-rail": rail,
|
|
96
106
|
"aria-orientation": orientation,
|
|
97
107
|
style: styles,
|
|
98
108
|
ref: composedItemRef
|
|
99
109
|
}, children, selfDroppable && dropping && /* @__PURE__ */ React.createElement(ListItem.DropIndicator, {
|
|
110
|
+
lineInset: 8,
|
|
111
|
+
terminalInset: -8,
|
|
112
|
+
gap: -8,
|
|
100
113
|
edge: orientation === "horizontal" ? "left" : "top"
|
|
101
114
|
})));
|
|
102
115
|
});
|
|
103
116
|
|
|
104
117
|
// packages/ui/react-ui-stack/src/components/StackItem.tsx
|
|
105
|
-
import { combine } from "@atlaskit/pragmatic-drag-and-drop/combine";
|
|
118
|
+
import { combine as combine2 } from "@atlaskit/pragmatic-drag-and-drop/combine";
|
|
106
119
|
import { draggable as draggable2, dropTargetForElements as dropTargetForElements2 } from "@atlaskit/pragmatic-drag-and-drop/element/adapter";
|
|
107
|
-
import {
|
|
108
|
-
import {
|
|
120
|
+
import { preserveOffsetOnSource } from "@atlaskit/pragmatic-drag-and-drop/element/preserve-offset-on-source";
|
|
121
|
+
import { scrollJustEnoughIntoView } from "@atlaskit/pragmatic-drag-and-drop/element/scroll-just-enough-into-view";
|
|
109
122
|
import { attachClosestEdge as attachClosestEdge2, extractClosestEdge as extractClosestEdge2 } from "@atlaskit/pragmatic-drag-and-drop-hitbox/closest-edge";
|
|
110
123
|
import { useFocusableGroup as useFocusableGroup2 } from "@fluentui/react-tabster";
|
|
111
124
|
import { composeRefs as composeRefs2 } from "@radix-ui/react-compose-refs";
|
|
@@ -164,7 +177,7 @@ var StackItemHeading = ({ children, classNames, ...props }) => {
|
|
|
164
177
|
...props,
|
|
165
178
|
tabIndex: 0,
|
|
166
179
|
...focusableGroupAttrs,
|
|
167
|
-
className: mx3("flex items-center
|
|
180
|
+
className: mx3("flex items-center dx-focus-ring-inset-over-all relative !border-is-0", orientation === "horizontal" ? "bs-[--rail-size]" : "is-[--rail-size] flex-col", classNames)
|
|
168
181
|
}, children);
|
|
169
182
|
};
|
|
170
183
|
var StackItemHeadingLabel = /* @__PURE__ */ forwardRef3(({ attendableId, related, classNames, ...props }, forwardedRef) => {
|
|
@@ -184,7 +197,8 @@ import { preventUnhandled } from "@atlaskit/pragmatic-drag-and-drop/prevent-unha
|
|
|
184
197
|
import React5, { useLayoutEffect as useLayoutEffect2, useRef } from "react";
|
|
185
198
|
import { mx as mx4 } from "@dxos/react-ui-theme";
|
|
186
199
|
var REM = parseFloat(getComputedStyle(document.documentElement).fontSize);
|
|
187
|
-
var
|
|
200
|
+
var MIN_WIDTH = 20;
|
|
201
|
+
var MIN_HEIGHT = 3;
|
|
188
202
|
var measureStackItem = (element) => {
|
|
189
203
|
const stackItemElement = element.closest("[data-dx-stack-item]");
|
|
190
204
|
return stackItemElement?.getBoundingClientRect() ?? {
|
|
@@ -193,7 +207,7 @@ var measureStackItem = (element) => {
|
|
|
193
207
|
};
|
|
194
208
|
};
|
|
195
209
|
var getNextSize = (startSize, location, client) => {
|
|
196
|
-
return Math.max(
|
|
210
|
+
return Math.max(client === "clientX" ? MIN_WIDTH : MIN_HEIGHT, startSize + (location.current.input[client] - location.initial.input[client]) / REM);
|
|
197
211
|
};
|
|
198
212
|
var StackItemResizeHandle = () => {
|
|
199
213
|
const { orientation } = useStack();
|
|
@@ -234,18 +248,20 @@ var StackItemResizeHandle = () => {
|
|
|
234
248
|
}, []);
|
|
235
249
|
return /* @__PURE__ */ React5.createElement("button", {
|
|
236
250
|
ref: buttonRef,
|
|
237
|
-
className: mx4(orientation === "horizontal" ? "cursor-col-resize" : "cursor-row-resize
|
|
251
|
+
className: mx4("group absolute", orientation === "horizontal" ? "cursor-col-resize is-3 bs-full inline-end-[-1px] !border-lb-0 before:inset-block-0 before:inline-end-0 before:is-1" : "cursor-row-resize bs-3 is-full block-end-[-1px] !border-li-0 before:inset-inline-0 before:block-end-0 before:bs-1", "before:transition-opacity before:duration-100 before:ease-in-out before:opacity-0 hover:before:opacity-100 focus-visible:before:opacity-100 active:before:opacity-100", "before:absolute before:block before:bg-accentFocusIndicator")
|
|
238
252
|
}, /* @__PURE__ */ React5.createElement("div", {
|
|
239
253
|
role: "none",
|
|
240
|
-
className: "absolute
|
|
241
|
-
}, /* @__PURE__ */ React5.createElement(DragHandleSignifier,
|
|
254
|
+
className: mx4("absolute flex items-center group-hover:opacity-0 group-focus-visible:opacity-0 group-active:opacity-0", orientation === "horizontal" ? "block-start-0 inline-end-px bs-[--rail-size]" : "inline-start-0 block-end-px is-[--rail-size] flex justify-center")
|
|
255
|
+
}, /* @__PURE__ */ React5.createElement(DragHandleSignifier, {
|
|
256
|
+
orientation
|
|
257
|
+
})));
|
|
242
258
|
};
|
|
243
|
-
var DragHandleSignifier = () => {
|
|
259
|
+
var DragHandleSignifier = ({ orientation }) => {
|
|
244
260
|
return /* @__PURE__ */ React5.createElement("svg", {
|
|
245
261
|
xmlns: "http://www.w3.org/2000/svg",
|
|
246
262
|
viewBox: "0 0 256 256",
|
|
247
263
|
fill: "currentColor",
|
|
248
|
-
className: "shrink-0 bs-[1em] is-[1em] text-unAccent"
|
|
264
|
+
className: mx4("shrink-0 bs-[1em] is-[1em] text-unAccent", orientation === "vertical" && "rotate-90")
|
|
249
265
|
}, /* @__PURE__ */ React5.createElement("path", {
|
|
250
266
|
d: "M256,64c-8.8,0-16-7.2-16-16s7.2-16,16-16v32Z"
|
|
251
267
|
}), /* @__PURE__ */ React5.createElement("path", {
|
|
@@ -260,7 +276,7 @@ var DragHandleSignifier = () => {
|
|
|
260
276
|
// packages/ui/react-ui-stack/src/components/StackItemSigil.tsx
|
|
261
277
|
import React7, { Fragment, forwardRef as forwardRef4, useRef as useRef2, useState as useState2 } from "react";
|
|
262
278
|
import { keySymbols } from "@dxos/keyboard";
|
|
263
|
-
import { Button, DropdownMenu, Icon, toLocalizedString,
|
|
279
|
+
import { Button, DropdownMenu, Icon, toLocalizedString, useTranslation } from "@dxos/react-ui";
|
|
264
280
|
import { useAttention as useAttention2 } from "@dxos/react-ui-attention";
|
|
265
281
|
import { descriptionText, mx as mx5 } from "@dxos/react-ui-theme";
|
|
266
282
|
import { getHostPlatform } from "@dxos/util";
|
|
@@ -311,7 +327,7 @@ var StackItemSigilButton = /* @__PURE__ */ forwardRef4(({ attendableId, classNam
|
|
|
311
327
|
...props,
|
|
312
328
|
variant,
|
|
313
329
|
classNames: [
|
|
314
|
-
"shrink-0 pli-0 min-bs-0 is-[--rail-action] bs-[--rail-action] relative",
|
|
330
|
+
"shrink-0 pli-0 min-bs-0 is-[--rail-action] bs-[--rail-action] relative app-no-drag",
|
|
315
331
|
classNames
|
|
316
332
|
],
|
|
317
333
|
ref: forwardedRef
|
|
@@ -321,18 +337,23 @@ var StackItemSigil = /* @__PURE__ */ forwardRef4(({ actions: actionGroups, onAct
|
|
|
321
337
|
const { t } = useTranslation(translationKey);
|
|
322
338
|
const suppressNextTooltip = useRef2(false);
|
|
323
339
|
const [optionsMenuOpen, setOptionsMenuOpen] = useState2(false);
|
|
324
|
-
const
|
|
325
|
-
|
|
326
|
-
|
|
327
|
-
|
|
328
|
-
|
|
329
|
-
|
|
330
|
-
|
|
331
|
-
|
|
332
|
-
|
|
333
|
-
|
|
334
|
-
|
|
335
|
-
|
|
340
|
+
const hasActions = actionGroups && actionGroups.length > 0;
|
|
341
|
+
const button = /* @__PURE__ */ React7.createElement(StackItemSigilButton, {
|
|
342
|
+
attendableId,
|
|
343
|
+
related,
|
|
344
|
+
// TODO(wittjosiah): Better disabling of interactive styles when no action are available.
|
|
345
|
+
// Remove underscore icon when no actions are available?
|
|
346
|
+
classNames: !hasActions && "cursor-default"
|
|
347
|
+
}, /* @__PURE__ */ React7.createElement("span", {
|
|
348
|
+
className: "sr-only"
|
|
349
|
+
}, triggerLabel), /* @__PURE__ */ React7.createElement(Icon, {
|
|
350
|
+
icon,
|
|
351
|
+
size: 5
|
|
352
|
+
}));
|
|
353
|
+
if (!hasActions) {
|
|
354
|
+
return button;
|
|
355
|
+
}
|
|
356
|
+
return /* @__PURE__ */ React7.createElement(DropdownMenu.Root, {
|
|
336
357
|
open: optionsMenuOpen,
|
|
337
358
|
onOpenChange: (nextOpen) => {
|
|
338
359
|
if (!nextOpen) {
|
|
@@ -340,20 +361,10 @@ var StackItemSigil = /* @__PURE__ */ forwardRef4(({ actions: actionGroups, onAct
|
|
|
340
361
|
}
|
|
341
362
|
return setOptionsMenuOpen(nextOpen);
|
|
342
363
|
}
|
|
343
|
-
}, /* @__PURE__ */ React7.createElement(Tooltip.Trigger, {
|
|
344
|
-
asChild: true
|
|
345
364
|
}, /* @__PURE__ */ React7.createElement(DropdownMenu.Trigger, {
|
|
346
365
|
asChild: true,
|
|
347
366
|
ref: forwardedRef
|
|
348
|
-
}, /* @__PURE__ */ React7.createElement(
|
|
349
|
-
attendableId,
|
|
350
|
-
related
|
|
351
|
-
}, /* @__PURE__ */ React7.createElement("span", {
|
|
352
|
-
className: "sr-only"
|
|
353
|
-
}, triggerLabel), /* @__PURE__ */ React7.createElement(Icon, {
|
|
354
|
-
icon,
|
|
355
|
-
size: 5
|
|
356
|
-
})))), /* @__PURE__ */ React7.createElement(DropdownMenu.Portal, null, /* @__PURE__ */ React7.createElement(DropdownMenu.Content, {
|
|
367
|
+
}, button), /* @__PURE__ */ React7.createElement(DropdownMenu.Portal, null, /* @__PURE__ */ React7.createElement(DropdownMenu.Content, {
|
|
357
368
|
classNames: "z-[31]"
|
|
358
369
|
}, /* @__PURE__ */ React7.createElement(DropdownMenu.Viewport, null, actionGroups?.map((actions, index) => {
|
|
359
370
|
const separator = index > 0 ? /* @__PURE__ */ React7.createElement(DropdownMenu.Separator, null) : null;
|
|
@@ -394,16 +405,14 @@ var StackItemSigil = /* @__PURE__ */ forwardRef4(({ actions: actionGroups, onAct
|
|
|
394
405
|
className: mx5("shrink-0", descriptionText)
|
|
395
406
|
}, keySymbols(shortcut).join("")));
|
|
396
407
|
}));
|
|
397
|
-
}), children), /* @__PURE__ */ React7.createElement(DropdownMenu.Arrow, null))))
|
|
398
|
-
side: "bottom"
|
|
399
|
-
}, triggerLabel, /* @__PURE__ */ React7.createElement(Tooltip.Arrow, null))));
|
|
408
|
+
}), children), /* @__PURE__ */ React7.createElement(DropdownMenu.Arrow, null))));
|
|
400
409
|
});
|
|
401
410
|
|
|
402
411
|
// packages/ui/react-ui-stack/src/components/StackItem.tsx
|
|
403
412
|
var DEFAULT_HORIZONTAL_SIZE = 44;
|
|
404
413
|
var DEFAULT_VERTICAL_SIZE = "min-content";
|
|
405
414
|
var DEFAULT_EXTRINSIC_SIZE = DEFAULT_HORIZONTAL_SIZE;
|
|
406
|
-
var StackItemRoot = /* @__PURE__ */ forwardRef5(({ item, children, classNames, size: propsSize, onSizeChange, role, order, style, ...props }, forwardedRef) => {
|
|
415
|
+
var StackItemRoot = /* @__PURE__ */ forwardRef5(({ item, children, classNames, size: propsSize, onSizeChange, role, order, style, disableRearrange, focusIndicatorVariant = "over-all", ...props }, forwardedRef) => {
|
|
407
416
|
const [itemElement, itemRef] = useState3(null);
|
|
408
417
|
const [selfDragHandleElement, selfDragHandleRef] = useState3(null);
|
|
409
418
|
const [closestEdge, setEdge] = useState3(null);
|
|
@@ -421,10 +430,10 @@ var StackItemRoot = /* @__PURE__ */ forwardRef5(({ item, children, classNames, s
|
|
|
421
430
|
]);
|
|
422
431
|
const type = orientation === "horizontal" ? "column" : "card";
|
|
423
432
|
useLayoutEffect3(() => {
|
|
424
|
-
if (!itemElement || !onRearrange) {
|
|
433
|
+
if (!itemElement || !onRearrange || disableRearrange) {
|
|
425
434
|
return;
|
|
426
435
|
}
|
|
427
|
-
return
|
|
436
|
+
return combine2(draggable2({
|
|
428
437
|
element: itemElement,
|
|
429
438
|
...selfDragHandleElement && {
|
|
430
439
|
dragHandle: selfDragHandleElement
|
|
@@ -433,12 +442,25 @@ var StackItemRoot = /* @__PURE__ */ forwardRef5(({ item, children, classNames, s
|
|
|
433
442
|
id: item.id,
|
|
434
443
|
type
|
|
435
444
|
}),
|
|
436
|
-
|
|
437
|
-
|
|
438
|
-
|
|
439
|
-
|
|
445
|
+
onGenerateDragPreview: ({ nativeSetDragImage, source, location }) => {
|
|
446
|
+
document.body.setAttribute("data-drag-preview", "true");
|
|
447
|
+
scrollJustEnoughIntoView({
|
|
448
|
+
element: source.element
|
|
440
449
|
});
|
|
441
|
-
|
|
450
|
+
const { x, y } = preserveOffsetOnSource({
|
|
451
|
+
element: source.element,
|
|
452
|
+
input: location.current.input
|
|
453
|
+
})({
|
|
454
|
+
container: source.element.offsetParent ?? document.body
|
|
455
|
+
});
|
|
456
|
+
nativeSetDragImage?.(source.element, x, y);
|
|
457
|
+
},
|
|
458
|
+
onDragStart: () => {
|
|
459
|
+
document.body.removeAttribute("data-drag-preview");
|
|
460
|
+
itemElement?.closest("[data-drag-autoscroll]")?.setAttribute("data-drag-autoscroll", "active");
|
|
461
|
+
},
|
|
462
|
+
onDrop: () => {
|
|
463
|
+
itemElement?.closest("[data-drag-autoscroll]")?.setAttribute("data-drag-autoscroll", "idle");
|
|
442
464
|
}
|
|
443
465
|
}), dropTargetForElements2({
|
|
444
466
|
element: itemElement,
|
|
@@ -496,7 +518,7 @@ var StackItemRoot = /* @__PURE__ */ forwardRef5(({ item, children, classNames, s
|
|
|
496
518
|
...props,
|
|
497
519
|
tabIndex: 0,
|
|
498
520
|
...focusGroupAttrs,
|
|
499
|
-
className: mx6("group/stack-item grid relative
|
|
521
|
+
className: mx6("group/stack-item grid relative", focusIndicatorVariant === "over-all" ? "dx-focus-ring-inset-over-all" : orientation === "horizontal" ? "dx-focus-ring-group-x" : "dx-focus-ring-group-y", size === "min-content" && (orientation === "horizontal" ? "is-min" : "bs-min"), orientation === "horizontal" ? "grid-rows-subgrid" : "grid-cols-subgrid", rail && (orientation === "horizontal" ? "row-span-2" : "col-span-2"), classNames),
|
|
500
522
|
"data-dx-stack-item": true,
|
|
501
523
|
style: {
|
|
502
524
|
...size !== "min-content" && {
|
|
@@ -509,6 +531,8 @@ var StackItemRoot = /* @__PURE__ */ forwardRef5(({ item, children, classNames, s
|
|
|
509
531
|
},
|
|
510
532
|
ref: composedItemRef
|
|
511
533
|
}, children, closestEdge && /* @__PURE__ */ React8.createElement(ListItem2.DropIndicator, {
|
|
534
|
+
lineInset: 8,
|
|
535
|
+
terminalInset: -8,
|
|
512
536
|
edge: closestEdge
|
|
513
537
|
})));
|
|
514
538
|
});
|
|
@@ -525,9 +549,9 @@ var StackItem = {
|
|
|
525
549
|
|
|
526
550
|
// packages/ui/react-ui-stack/src/components/LayoutControls.tsx
|
|
527
551
|
import React9, { forwardRef as forwardRef6 } from "react";
|
|
528
|
-
import { Button as Button2, ButtonGroup, Icon as Icon2, Tooltip
|
|
552
|
+
import { Button as Button2, ButtonGroup, Icon as Icon2, Tooltip, useTranslation as useTranslation2 } from "@dxos/react-ui";
|
|
529
553
|
var LayoutControl = ({ icon, label, ...props }) => {
|
|
530
|
-
return /* @__PURE__ */ React9.createElement(
|
|
554
|
+
return /* @__PURE__ */ React9.createElement(Tooltip.Root, null, /* @__PURE__ */ React9.createElement(Tooltip.Trigger, {
|
|
531
555
|
asChild: true
|
|
532
556
|
}, /* @__PURE__ */ React9.createElement(Button2, {
|
|
533
557
|
variant: "ghost",
|
|
@@ -536,7 +560,7 @@ var LayoutControl = ({ icon, label, ...props }) => {
|
|
|
536
560
|
className: "sr-only"
|
|
537
561
|
}, label), /* @__PURE__ */ React9.createElement(Icon2, {
|
|
538
562
|
icon
|
|
539
|
-
}))), /* @__PURE__ */ React9.createElement(
|
|
563
|
+
}))), /* @__PURE__ */ React9.createElement(Tooltip.Portal, null, /* @__PURE__ */ React9.createElement(Tooltip.Content, {
|
|
540
564
|
side: "bottom"
|
|
541
565
|
}, label)));
|
|
542
566
|
};
|
|
@@ -597,6 +621,7 @@ export {
|
|
|
597
621
|
StackContext,
|
|
598
622
|
StackItem,
|
|
599
623
|
StackItemContext,
|
|
624
|
+
autoScrollRootAttributes,
|
|
600
625
|
railGridHorizontal,
|
|
601
626
|
railGridVertical,
|
|
602
627
|
translations_default as translations,
|