@react-spectrum/table 3.8.1-nightly.3856 → 3.8.1-nightly.3864

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.
Files changed (11) hide show
  1. package/dist/import.mjs +15 -33
  2. package/dist/main.css +1 -1
  3. package/dist/main.js +15 -33
  4. package/dist/main.js.map +1 -1
  5. package/dist/module.js +15 -33
  6. package/dist/module.js.map +1 -1
  7. package/dist/types.d.ts.map +1 -1
  8. package/package.json +31 -31
  9. package/src/DragPreview.tsx +31 -64
  10. package/src/TableView.tsx +6 -4
  11. package/src/table.css +6 -0
package/dist/types.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"mappings":";;;;AKmIA,oCAAoC,CAAC,CAAE,SAAQ,WAAW,CAAC,CAAC,EAAE,sBAAsB,EAAE,QAAQ,EAAE,iBAAiB,EAAE,UAAU;IAC3H;;;OAGG;IACH,OAAO,CAAC,EAAE,SAAS,GAAG,SAAS,GAAG,UAAU,CAAC;IAC7C;;;OAGG;IACH,YAAY,CAAC,EAAE,MAAM,GAAG,UAAU,CAAC;IACnC,oEAAoE;IACpE,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,iFAAiF;IACjF,gBAAgB,CAAC,EAAE,MAAM,IAAI,OAAO,CAAC;IACrC,sEAAsE;IACtE,QAAQ,CAAC,EAAE,CAAC,GAAG,EAAE,GAAG,KAAK,IAAI,CAAC;IAC9B;;OAEG;IACH,aAAa,CAAC,EAAE,CAAC,MAAM,EAAE,GAAG,CAAC,GAAG,EAAE,UAAU,CAAC,KAAK,IAAI,CAAC;IACvD;;;;OAIG;IACH,QAAQ,CAAC,EAAE,CAAC,MAAM,EAAE,GAAG,CAAC,GAAG,EAAE,UAAU,CAAC,KAAK,IAAI,CAAC;IAClD;;;OAGG;IACH,WAAW,CAAC,EAAE,CAAC,MAAM,EAAE,GAAG,CAAC,GAAG,EAAE,UAAU,CAAC,KAAK,IAAI,CAAC;IACrD;;;OAGG;IACH,gBAAgB,CAAC,EAAE,gBAAgB,CAAC,kBAAkB,CAAC,CAAA;CACxD;AA2wCD;;GAEG;AACH,OAAA,MAAM;UAAsF,OAAO,cAAc,CAAC;MAAM,YAAY,CAAC;ACn6CrI,OAAA,MAAM,8CAAiE,WAAW,CAAC;AAGnF,OAAO,EACL,WAAW,EACX,SAAS,EACT,OAAO,EACP,GAAG,EACH,IAAI,EACL,MAAM,sBAAsB,CAAC;AAE9B,YAAY,EAAC,mBAAmB,EAAE,gBAAgB,EAAE,cAAc,EAAE,QAAQ,EAAE,SAAS,EAAC,MAAM,oBAAoB,CAAC","sources":["packages/@react-spectrum/table/src/packages/@react-spectrum/table/src/InsertionIndicator.tsx","packages/@react-spectrum/table/src/packages/@react-spectrum/table/src/Nubbin.tsx","packages/@react-spectrum/table/src/packages/@react-spectrum/table/src/Resizer.tsx","packages/@react-spectrum/table/src/packages/@react-spectrum/table/src/RootDropIndicator.tsx","packages/@react-spectrum/table/src/packages/@react-spectrum/table/src/DragPreview.tsx","packages/@react-spectrum/table/src/packages/@react-spectrum/table/src/TableView.tsx","packages/@react-spectrum/table/src/packages/@react-spectrum/table/src/index.ts","packages/@react-spectrum/table/src/index.ts"],"sourcesContent":[null,null,null,null,null,null,null,"/*\n * Copyright 2020 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\n/// <reference types=\"css-module-types\" />\n\nexport {TableView} from './TableView';\nimport {Column} from '@react-stately/table';\nimport {SpectrumColumnProps} from '@react-types/table';\n\n// Override TS for Column to support spectrum specific props.\nconst SpectrumColumn = Column as <T>(props: SpectrumColumnProps<T>) => JSX.Element;\nexport {SpectrumColumn as Column};\n\nexport {\n TableHeader,\n TableBody,\n Section,\n Row,\n Cell\n} from '@react-stately/table';\n\nexport type {SpectrumColumnProps, TableHeaderProps, TableBodyProps, RowProps, CellProps} from '@react-types/table';\nexport type {SpectrumTableProps} from './TableView';\n"],"names":[],"version":3,"file":"types.d.ts.map"}
1
+ {"mappings":";;;;AKmIA,oCAAoC,CAAC,CAAE,SAAQ,WAAW,CAAC,CAAC,EAAE,sBAAsB,EAAE,QAAQ,EAAE,iBAAiB,EAAE,UAAU;IAC3H;;;OAGG;IACH,OAAO,CAAC,EAAE,SAAS,GAAG,SAAS,GAAG,UAAU,CAAC;IAC7C;;;OAGG;IACH,YAAY,CAAC,EAAE,MAAM,GAAG,UAAU,CAAC;IACnC,oEAAoE;IACpE,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,iFAAiF;IACjF,gBAAgB,CAAC,EAAE,MAAM,IAAI,OAAO,CAAC;IACrC,sEAAsE;IACtE,QAAQ,CAAC,EAAE,CAAC,GAAG,EAAE,GAAG,KAAK,IAAI,CAAC;IAC9B;;OAEG;IACH,aAAa,CAAC,EAAE,CAAC,MAAM,EAAE,GAAG,CAAC,GAAG,EAAE,UAAU,CAAC,KAAK,IAAI,CAAC;IACvD;;;;OAIG;IACH,QAAQ,CAAC,EAAE,CAAC,MAAM,EAAE,GAAG,CAAC,GAAG,EAAE,UAAU,CAAC,KAAK,IAAI,CAAC;IAClD;;;OAGG;IACH,WAAW,CAAC,EAAE,CAAC,MAAM,EAAE,GAAG,CAAC,GAAG,EAAE,UAAU,CAAC,KAAK,IAAI,CAAC;IACrD;;;OAGG;IACH,gBAAgB,CAAC,EAAE,gBAAgB,CAAC,kBAAkB,CAAC,CAAA;CACxD;AA6wCD;;GAEG;AACH,OAAA,MAAM;UAAsF,OAAO,cAAc,CAAC;MAAM,YAAY,CAAC;ACr6CrI,OAAA,MAAM,8CAAiE,WAAW,CAAC;AAGnF,OAAO,EACL,WAAW,EACX,SAAS,EACT,OAAO,EACP,GAAG,EACH,IAAI,EACL,MAAM,sBAAsB,CAAC;AAE9B,YAAY,EAAC,mBAAmB,EAAE,gBAAgB,EAAE,cAAc,EAAE,QAAQ,EAAE,SAAS,EAAC,MAAM,oBAAoB,CAAC","sources":["packages/@react-spectrum/table/src/packages/@react-spectrum/table/src/InsertionIndicator.tsx","packages/@react-spectrum/table/src/packages/@react-spectrum/table/src/Nubbin.tsx","packages/@react-spectrum/table/src/packages/@react-spectrum/table/src/Resizer.tsx","packages/@react-spectrum/table/src/packages/@react-spectrum/table/src/RootDropIndicator.tsx","packages/@react-spectrum/table/src/packages/@react-spectrum/table/src/DragPreview.tsx","packages/@react-spectrum/table/src/packages/@react-spectrum/table/src/TableView.tsx","packages/@react-spectrum/table/src/packages/@react-spectrum/table/src/index.ts","packages/@react-spectrum/table/src/index.ts"],"sourcesContent":[null,null,null,null,null,null,null,"/*\n * Copyright 2020 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\n/// <reference types=\"css-module-types\" />\n\nexport {TableView} from './TableView';\nimport {Column} from '@react-stately/table';\nimport {SpectrumColumnProps} from '@react-types/table';\n\n// Override TS for Column to support spectrum specific props.\nconst SpectrumColumn = Column as <T>(props: SpectrumColumnProps<T>) => JSX.Element;\nexport {SpectrumColumn as Column};\n\nexport {\n TableHeader,\n TableBody,\n Section,\n Row,\n Cell\n} from '@react-stately/table';\n\nexport type {SpectrumColumnProps, TableHeaderProps, TableBodyProps, RowProps, CellProps} from '@react-types/table';\nexport type {SpectrumTableProps} from './TableView';\n"],"names":[],"version":3,"file":"types.d.ts.map"}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@react-spectrum/table",
3
- "version": "3.8.1-nightly.3856+bd89c6aba",
3
+ "version": "3.8.1-nightly.3864+5a3315f56",
4
4
  "description": "Spectrum UI components in React",
5
5
  "license": "Apache-2.0",
6
6
  "main": "dist/main.js",
@@ -36,38 +36,38 @@
36
36
  "url": "https://github.com/adobe/react-spectrum"
37
37
  },
38
38
  "dependencies": {
39
- "@react-aria/button": "3.0.0-nightly.2154+bd89c6aba",
40
- "@react-aria/focus": "3.0.0-nightly.2154+bd89c6aba",
41
- "@react-aria/grid": "3.7.1-nightly.3856+bd89c6aba",
42
- "@react-aria/i18n": "3.0.0-nightly.2154+bd89c6aba",
43
- "@react-aria/interactions": "3.0.0-nightly.2154+bd89c6aba",
44
- "@react-aria/table": "3.9.1-nightly.3856+bd89c6aba",
45
- "@react-aria/utils": "3.0.0-nightly.2154+bd89c6aba",
46
- "@react-aria/virtualizer": "3.8.1-nightly.3856+bd89c6aba",
47
- "@react-aria/visually-hidden": "3.0.0-nightly.2154+bd89c6aba",
48
- "@react-spectrum/button": "3.0.0-nightly.2154+bd89c6aba",
49
- "@react-spectrum/checkbox": "3.0.0-nightly.2154+bd89c6aba",
50
- "@react-spectrum/dnd": "3.1.2-nightly.3856+bd89c6aba",
51
- "@react-spectrum/layout": "3.5.2-nightly.3856+bd89c6aba",
52
- "@react-spectrum/menu": "3.11.1-nightly.3856+bd89c6aba",
53
- "@react-spectrum/progress": "3.0.0-nightly.2154+bd89c6aba",
54
- "@react-spectrum/tooltip": "3.0.0-nightly.2154+bd89c6aba",
55
- "@react-spectrum/utils": "3.0.0-nightly.2154+bd89c6aba",
56
- "@react-stately/collections": "3.0.0-nightly.2154+bd89c6aba",
57
- "@react-stately/grid": "3.6.1-nightly.3856+bd89c6aba",
58
- "@react-stately/layout": "3.12.1-nightly.3856+bd89c6aba",
59
- "@react-stately/table": "3.9.1-nightly.3856+bd89c6aba",
60
- "@react-stately/virtualizer": "3.5.2-nightly.3856+bd89c6aba",
61
- "@react-types/grid": "3.1.8-nightly.3856+bd89c6aba",
62
- "@react-types/shared": "3.0.0-nightly.2154+bd89c6aba",
63
- "@react-types/table": "3.6.1-nightly.3856+bd89c6aba",
64
- "@spectrum-icons/ui": "3.0.0-nightly.2154+bd89c6aba",
39
+ "@react-aria/button": "3.0.0-nightly.2162+5a3315f56",
40
+ "@react-aria/focus": "3.0.0-nightly.2162+5a3315f56",
41
+ "@react-aria/grid": "3.7.1-nightly.3864+5a3315f56",
42
+ "@react-aria/i18n": "3.0.0-nightly.2162+5a3315f56",
43
+ "@react-aria/interactions": "3.0.0-nightly.2162+5a3315f56",
44
+ "@react-aria/table": "3.9.1-nightly.3864+5a3315f56",
45
+ "@react-aria/utils": "3.0.0-nightly.2162+5a3315f56",
46
+ "@react-aria/virtualizer": "3.8.1-nightly.3864+5a3315f56",
47
+ "@react-aria/visually-hidden": "3.0.0-nightly.2162+5a3315f56",
48
+ "@react-spectrum/button": "3.0.0-nightly.2162+5a3315f56",
49
+ "@react-spectrum/checkbox": "3.0.0-nightly.2162+5a3315f56",
50
+ "@react-spectrum/dnd": "3.1.2-nightly.3864+5a3315f56",
51
+ "@react-spectrum/layout": "3.5.2-nightly.3864+5a3315f56",
52
+ "@react-spectrum/menu": "3.11.1-nightly.3864+5a3315f56",
53
+ "@react-spectrum/progress": "3.0.0-nightly.2162+5a3315f56",
54
+ "@react-spectrum/tooltip": "3.0.0-nightly.2162+5a3315f56",
55
+ "@react-spectrum/utils": "3.0.0-nightly.2162+5a3315f56",
56
+ "@react-stately/collections": "3.0.0-nightly.2162+5a3315f56",
57
+ "@react-stately/grid": "3.6.1-nightly.3864+5a3315f56",
58
+ "@react-stately/layout": "3.12.1-nightly.3864+5a3315f56",
59
+ "@react-stately/table": "3.9.1-nightly.3864+5a3315f56",
60
+ "@react-stately/virtualizer": "3.5.2-nightly.3864+5a3315f56",
61
+ "@react-types/grid": "3.1.8-nightly.3864+5a3315f56",
62
+ "@react-types/shared": "3.0.0-nightly.2162+5a3315f56",
63
+ "@react-types/table": "3.6.1-nightly.3864+5a3315f56",
64
+ "@spectrum-icons/ui": "3.0.0-nightly.2162+5a3315f56",
65
65
  "@swc/helpers": "^0.4.14"
66
66
  },
67
67
  "devDependencies": {
68
- "@adobe/spectrum-css-temp": "3.0.0-nightly.2154+bd89c6aba",
69
- "@react-aria/dnd": "3.2.1-nightly.3856+bd89c6aba",
70
- "@react-stately/dnd": "3.2.1-nightly.3856+bd89c6aba"
68
+ "@adobe/spectrum-css-temp": "3.0.0-nightly.2162+5a3315f56",
69
+ "@react-aria/dnd": "3.2.1-nightly.3864+5a3315f56",
70
+ "@react-stately/dnd": "3.2.1-nightly.3864+5a3315f56"
71
71
  },
72
72
  "peerDependencies": {
73
73
  "@react-spectrum/provider": "^3.0.0",
@@ -77,5 +77,5 @@
77
77
  "publishConfig": {
78
78
  "access": "public"
79
79
  },
80
- "gitHead": "bd89c6aba9dd1bf763a5166d37524ab6fb612509"
80
+ "gitHead": "5a3315f560071087cacf846bd2a86d8f47692446"
81
81
  }
package/src/DragPreview.tsx CHANGED
@@ -11,77 +11,31 @@
11
11
  */
12
12
 
13
13
  import {classNames} from '@react-spectrum/utils';
14
- import {Direction, Node} from '@react-types/shared';
15
14
  import {Flex} from '@react-spectrum/layout';
16
- import {GridNode} from '@react-types/grid';
17
15
  import React from 'react';
18
- import type {SpectrumTableProps} from './TableView';
19
16
  import styles from '@adobe/spectrum-css-temp/components/table/vars.css';
20
17
  import stylesOverrides from './table.css';
21
- import type {TableLayout} from '@react-stately/layout';
22
18
 
23
- interface DragPreviewProps<T> {
24
- item: Node<T>,
25
- children: Iterable<Node<T>>,
19
+ interface DragPreviewProps {
20
+ itemText: string,
26
21
  itemCount: number,
27
- density: SpectrumTableProps<T>['density'],
28
- layout: TableLayout<T>,
29
- direction: Direction,
30
- maxWidth: number,
31
- rowHeaderColumnKeys: Set<React.Key>
22
+ height: number,
23
+ maxWidth: number
32
24
  }
33
25
 
34
- interface TableCellPreviewProps {
35
- cell: GridNode<any>
36
- }
37
-
38
- export function TableCellPreview(props: TableCellPreviewProps) {
39
- let {cell} = props;
40
-
41
- return (
42
- <div
43
- className={
44
- classNames(
45
- styles,
46
- 'spectrum-Table-cell',
47
- classNames(
48
- stylesOverrides,
49
- 'react-spectrum-Table-cell'
50
- )
51
- )
52
- }>
53
- <span
54
- className={
55
- classNames(
56
- styles,
57
- 'spectrum-Table-cellContents'
58
- )
59
- }>
60
- {cell.rendered}
61
- </span>
62
- </div>
63
- );
64
- }
65
-
66
- export function DragPreview(props: DragPreviewProps<unknown>) {
26
+ export function DragPreview(props: DragPreviewProps) {
67
27
  let {
68
- item,
69
- children,
28
+ itemText,
70
29
  itemCount,
71
- density,
72
- layout,
73
- maxWidth,
74
- rowHeaderColumnKeys
30
+ height,
31
+ maxWidth
75
32
  } = props;
76
- let {height} = layout.getLayoutInfo(item.key).rect;
77
33
  let isDraggingMultiple = itemCount > 1;
78
- // @ts-ignore
79
- let cells = [...children].filter(cell => rowHeaderColumnKeys.has(cell.column.key));
80
-
81
34
  return (
82
35
  <Flex
83
36
  justifyContent="space-between"
84
- UNSAFE_style={{height, maxWidth}}
37
+ height={height}
38
+ maxWidth={maxWidth}
85
39
  UNSAFE_className={
86
40
  classNames(
87
41
  styles,
@@ -90,17 +44,30 @@ export function DragPreview(props: DragPreviewProps<unknown>) {
90
44
  stylesOverrides,
91
45
  'react-spectrum-Table-row',
92
46
  'react-spectrum-Table-row-dragPreview',
93
- {'react-spectrum-Table-row-dragPreview--multiple': isDraggingMultiple},
94
- `react-spectrum-Table-row-dragPreview--${density}`
47
+ {'react-spectrum-Table-row-dragPreview--multiple': isDraggingMultiple}
48
+ )
49
+ )
50
+ }>
51
+ <div
52
+ className={
53
+ classNames(
54
+ styles,
55
+ 'spectrum-Table-cell',
56
+ classNames(
57
+ stylesOverrides,
58
+ 'react-spectrum-Table-cell'
95
59
  )
96
60
  )
97
61
  }>
98
- <div>
99
- {cells.map((cell) => (
100
- <TableCellPreview
101
- key={cell.key}
102
- cell={cell} />
103
- ))}
62
+ <span
63
+ className={
64
+ classNames(
65
+ styles,
66
+ 'spectrum-Table-cellContents'
67
+ )
68
+ }>
69
+ {itemText}
70
+ </span>
104
71
  </div>
105
72
  {isDraggingMultiple &&
106
73
  <div className={classNames(stylesOverrides, 'react-spectrum-Table-row-badge')}>{itemCount}</div>
package/src/TableView.tsx CHANGED
@@ -562,12 +562,14 @@ function TableView<T extends object>(props: SpectrumTableProps<T>, ref: DOMRef<H
562
562
  {DragPreview && isTableDraggable &&
563
563
  <DragPreview ref={preview}>
564
564
  {() => {
565
- let item = state.collection.getItem(dragState.draggedKey);
566
- let rowHeaderColumnKeys = state.collection.rowHeaderColumnKeys;
565
+ if (dragAndDropHooks.renderPreview) {
566
+ return dragAndDropHooks.renderPreview(dragState.draggingKeys, dragState.draggedKey);
567
+ }
567
568
  let itemCount = dragState.draggingKeys.size;
568
569
  let maxWidth = bodyRef.current.getBoundingClientRect().width;
569
- let children = state.collection.getChildren(item.key);
570
- return <SpectrumDragPreview layout={layout} item={item} children={children} itemCount={itemCount} density={density} direction={direction} maxWidth={maxWidth} rowHeaderColumnKeys={rowHeaderColumnKeys} />;
570
+ let height = ROW_HEIGHTS[density][scale];
571
+ let itemText = state.collection.getTextValue(dragState.draggedKey);
572
+ return <SpectrumDragPreview itemText={itemText} itemCount={itemCount} height={height} maxWidth={maxWidth} />;
571
573
  }}
572
574
  </DragPreview>
573
575
  }
package/src/table.css CHANGED
@@ -79,6 +79,12 @@
79
79
  box-shadow: none;
80
80
  }
81
81
 
82
+ .react-spectrum-Table-cell {
83
+ overflow: hidden;
84
+ white-space: nowrap;
85
+ text-overflow: ellipsis;
86
+ }
87
+
82
88
  &.react-spectrum-Table-row-dragPreview--multiple {
83
89
  position: relative;
84
90