@dxos/lit-grid 0.8.3-staging.0fa589b → 0.8.4-main.3a94e84
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/src/dx-grid.d.ts +2 -1
- package/dist/src/dx-grid.d.ts.map +1 -1
- package/dist/src/dx-grid.js +52 -9
- package/dist/src/dx-grid.js.map +1 -1
- package/dist/src/dx-grid.lit-stories.d.ts +1 -0
- package/dist/src/dx-grid.lit-stories.d.ts.map +1 -1
- package/dist/src/dx-grid.lit-stories.js +4 -2
- package/dist/src/dx-grid.lit-stories.js.map +1 -1
- package/dist/src/playwright/dx-grid.spec.d.ts.map +1 -0
- package/dist/src/{testing/playwright → playwright}/dx-grid.spec.js +3 -3
- package/dist/src/playwright/dx-grid.spec.js.map +1 -0
- package/dist/src/playwright/playwright.config.d.ts +3 -0
- package/dist/src/playwright/playwright.config.d.ts.map +1 -0
- package/dist/src/playwright/playwright.config.js +15 -0
- package/dist/src/playwright/playwright.config.js.map +1 -0
- package/dist/src/testing/{playwright/dx-grid-manager.d.ts → dx-grid-manager.d.ts} +1 -1
- package/dist/src/testing/dx-grid-manager.d.ts.map +1 -0
- package/dist/src/testing/dx-grid-manager.js.map +1 -0
- package/dist/src/testing/index.d.ts +1 -1
- package/dist/src/testing/index.d.ts.map +1 -1
- package/dist/src/testing/index.js +1 -1
- package/dist/src/testing/index.js.map +1 -1
- package/dist/src/util.js +1 -1
- package/dist/src/util.js.map +1 -1
- package/dist/tsconfig.tsbuildinfo +1 -1
- package/package.json +6 -5
- package/src/dx-grid-axis-resize-handle.pcss +1 -0
- package/src/dx-grid-multiselect-cell.pcss +2 -2
- package/src/dx-grid.lit-stories.ts +6 -2
- package/src/dx-grid.pcss +120 -15
- package/src/dx-grid.ts +68 -9
- package/src/{testing/playwright → playwright}/dx-grid.spec.ts +4 -4
- package/src/playwright/playwright.config.ts +17 -0
- package/src/testing/{playwright/dx-grid-manager.ts → dx-grid-manager.ts} +1 -1
- package/src/testing/index.ts +1 -1
- package/src/util.ts +1 -1
- package/dist/src/testing/playwright/dx-grid-manager.d.ts.map +0 -1
- package/dist/src/testing/playwright/dx-grid-manager.js.map +0 -1
- package/dist/src/testing/playwright/dx-grid.spec.d.ts.map +0 -1
- package/dist/src/testing/playwright/dx-grid.spec.js.map +0 -1
- package/dist/types/src/defs.d.ts +0 -3
- package/dist/types/src/defs.d.ts.map +0 -1
- package/dist/types/src/defs.js +0 -6
- package/dist/types/src/defs.js.map +0 -1
- package/dist/types/src/dx-grid-axis-resize-handle.d.ts +0 -16
- package/dist/types/src/dx-grid-axis-resize-handle.d.ts.map +0 -1
- package/dist/types/src/dx-grid-axis-resize-handle.js +0 -100
- package/dist/types/src/dx-grid-axis-resize-handle.js.map +0 -1
- package/dist/types/src/dx-grid-multiselect-cell.d.ts +0 -13
- package/dist/types/src/dx-grid-multiselect-cell.d.ts.map +0 -1
- package/dist/types/src/dx-grid-multiselect-cell.js +0 -56
- package/dist/types/src/dx-grid-multiselect-cell.js.map +0 -1
- package/dist/types/src/dx-grid.d.ts +0 -170
- package/dist/types/src/dx-grid.d.ts.map +0 -1
- package/dist/types/src/dx-grid.js +0 -1347
- package/dist/types/src/dx-grid.js.map +0 -1
- package/dist/types/src/dx-grid.lit-stories.d.ts +0 -46
- package/dist/types/src/dx-grid.lit-stories.d.ts.map +0 -1
- package/dist/types/src/dx-grid.lit-stories.js +0 -179
- package/dist/types/src/dx-grid.lit-stories.js.map +0 -1
- package/dist/types/src/index.d.ts +0 -5
- package/dist/types/src/index.d.ts.map +0 -1
- package/dist/types/src/index.js +0 -8
- package/dist/types/src/index.js.map +0 -1
- package/dist/types/src/testing/index.d.ts +0 -2
- package/dist/types/src/testing/index.d.ts.map +0 -1
- package/dist/types/src/testing/index.js +0 -5
- package/dist/types/src/testing/index.js.map +0 -1
- package/dist/types/src/testing/playwright/dx-grid-manager.d.ts +0 -24
- package/dist/types/src/testing/playwright/dx-grid-manager.d.ts.map +0 -1
- package/dist/types/src/testing/playwright/dx-grid-manager.js +0 -79
- package/dist/types/src/testing/playwright/dx-grid-manager.js.map +0 -1
- package/dist/types/src/testing/playwright/dx-grid.spec.d.ts +0 -2
- package/dist/types/src/testing/playwright/dx-grid.spec.d.ts.map +0 -1
- package/dist/types/src/testing/playwright/dx-grid.spec.js +0 -92
- package/dist/types/src/testing/playwright/dx-grid.spec.js.map +0 -1
- package/dist/types/src/types.d.ts +0 -137
- package/dist/types/src/types.d.ts.map +0 -1
- package/dist/types/src/types.js +0 -46
- package/dist/types/src/types.js.map +0 -1
- package/dist/types/src/util.d.ts +0 -39
- package/dist/types/src/util.d.ts.map +0 -1
- package/dist/types/src/util.js +0 -165
- package/dist/types/src/util.js.map +0 -1
- package/dist/types/tsconfig.tsbuildinfo +0 -1
- package/src/testing/playwright/playwright.config.cts +0 -18
- /package/dist/src/{testing/playwright → playwright}/dx-grid.spec.d.ts +0 -0
- /package/dist/src/testing/{playwright/dx-grid-manager.js → dx-grid-manager.js} +0 -0
package/src/dx-grid.pcss
CHANGED
|
@@ -4,7 +4,11 @@
|
|
|
4
4
|
@layer dx-tokens {
|
|
5
5
|
:root {
|
|
6
6
|
--dx-grid-cell-padding-block: 0.2rem;
|
|
7
|
+
--dx-grid-cell-content-padding-block: calc(var(--dx-grid-cell-padding-block) - 1px);
|
|
8
|
+
--dx-grid-cell-editor-padding-block: var(--dx-grid-cell-content-padding-block);
|
|
7
9
|
--dx-grid-cell-padding-inline: 0.25rem;
|
|
10
|
+
--dx-grid-cell-content-padding-inline: calc(var(--dx-grid-cell-padding-inline) - 1px);
|
|
11
|
+
--dx-grid-cell-editor-padding-inline: var(--dx-grid-cell-content-padding-inline);
|
|
8
12
|
}
|
|
9
13
|
}
|
|
10
14
|
|
|
@@ -63,19 +67,14 @@
|
|
|
63
67
|
}
|
|
64
68
|
|
|
65
69
|
.dx-grid {
|
|
70
|
+
--dx-grid-cell-surface: var(--dx-grid-base, var(--dx-baseSurface));
|
|
71
|
+
|
|
66
72
|
[role='gridcell'],
|
|
67
73
|
[role='columnheader'],
|
|
68
74
|
[role='rowheader'] {
|
|
69
|
-
|
|
70
|
-
background: var(--dx-grid-base, var(--dx-baseSurface));
|
|
71
|
-
/** This must match CellEditor styling in `CellEditor.tsx`. */
|
|
72
|
-
padding: var(--dx-grid-cell-padding-block) var(--dx-grid-cell-padding-inline);
|
|
73
|
-
box-sizing: border-box;
|
|
74
|
-
border: 1px solid transparent;
|
|
75
|
-
overflow: hidden;
|
|
76
|
-
text-overflow: ellipsis;
|
|
77
|
-
white-space: nowrap;
|
|
75
|
+
background: var(--dx-grid-cell-surface);
|
|
78
76
|
cursor: pointer;
|
|
77
|
+
position: relative;
|
|
79
78
|
|
|
80
79
|
&[aria-readonly='true'] {
|
|
81
80
|
cursor: default;
|
|
@@ -86,13 +85,30 @@
|
|
|
86
85
|
user-select: text;
|
|
87
86
|
}
|
|
88
87
|
|
|
89
|
-
&:focus
|
|
90
|
-
&:focus-visible {
|
|
91
|
-
z-index: 2;
|
|
92
|
-
border-color: var(--dx-accentSurface);
|
|
88
|
+
&:focus {
|
|
93
89
|
outline: none;
|
|
94
90
|
}
|
|
95
91
|
|
|
92
|
+
& > .dx-grid__cell__content {
|
|
93
|
+
padding-inline: var(--dx-grid-cell-content-padding-inline);
|
|
94
|
+
padding-block: var(--dx-grid-cell-content-padding-block);
|
|
95
|
+
box-sizing: border-box;
|
|
96
|
+
overflow: hidden;
|
|
97
|
+
text-overflow: ellipsis;
|
|
98
|
+
white-space: nowrap;
|
|
99
|
+
block-size: 100%;
|
|
100
|
+
position: relative;
|
|
101
|
+
border: 1px solid transparent;
|
|
102
|
+
border-radius: 2px;
|
|
103
|
+
|
|
104
|
+
&:has(.dx-tag), &:has(dx-tag-picker-item) {
|
|
105
|
+
text-overflow: clip;
|
|
106
|
+
line-height: 0;
|
|
107
|
+
--dx-grid-cell-content-padding-inline: 1px;
|
|
108
|
+
--dx-grid-cell-content-padding-block: 1px;
|
|
109
|
+
}
|
|
110
|
+
}
|
|
111
|
+
|
|
96
112
|
&.dx-grid__cell--commented {
|
|
97
113
|
background: var(--dx-grid-commented, var(--dx-gridCommented));
|
|
98
114
|
}
|
|
@@ -103,17 +119,93 @@
|
|
|
103
119
|
[role='columnheader'],
|
|
104
120
|
[role='rowheader'] {
|
|
105
121
|
&[aria-selected] {
|
|
106
|
-
|
|
122
|
+
--dx-grid-cell-surface: var(--dx-gridSelectionOverlay);
|
|
123
|
+
|
|
124
|
+
&:focus:not([aria-readonly='true']),
|
|
125
|
+
&:focus-visible, &:focus-within {
|
|
126
|
+
& > .dx-grid__cell__content {
|
|
127
|
+
background: transparent;
|
|
128
|
+
}
|
|
129
|
+
}
|
|
130
|
+
}
|
|
131
|
+
}
|
|
132
|
+
}
|
|
133
|
+
}
|
|
134
|
+
|
|
135
|
+
/* Editor and focused cell styles; be sure to keep these two blocks in-sync. */
|
|
136
|
+
.dx-grid {
|
|
137
|
+
[role='gridcell'],
|
|
138
|
+
[role='columnheader'],
|
|
139
|
+
[role='rowheader'] {
|
|
140
|
+
&:not(.dx-grid__cell--no-focus-unfurl){
|
|
141
|
+
&:focus,
|
|
142
|
+
&:focus-within {
|
|
143
|
+
& > .dx-grid__cell__content {
|
|
144
|
+
min-block-size: 100%;
|
|
145
|
+
block-size: min-content;
|
|
146
|
+
max-block-size: min(12em, 50vh);
|
|
147
|
+
|
|
148
|
+
min-inline-size: 100%;
|
|
149
|
+
inline-size: min-content;
|
|
150
|
+
max-inline-size: min(60ch, 90vw);
|
|
151
|
+
|
|
152
|
+
overflow: auto;
|
|
153
|
+
scrollbar-width: thin;
|
|
154
|
+
overscroll-behavior: contain;
|
|
155
|
+
|
|
156
|
+
white-space: normal;
|
|
157
|
+
hyphens: auto;
|
|
158
|
+
overflow-wrap: break-word;
|
|
159
|
+
|
|
160
|
+
z-index: 1;
|
|
161
|
+
|
|
162
|
+
background: var(--dx-grid-cell-surface);
|
|
163
|
+
}
|
|
164
|
+
|
|
165
|
+
&:not([aria-readonly='true']) > .dx-grid__cell__content {
|
|
166
|
+
border-color: var(--dx-accentSurface);
|
|
167
|
+
}
|
|
107
168
|
}
|
|
108
169
|
}
|
|
170
|
+
|
|
171
|
+
&:focus-visible > .dx-grid__cell__content {
|
|
172
|
+
border-color: var(--dx-accentSurface);
|
|
173
|
+
}
|
|
174
|
+
}
|
|
175
|
+
}
|
|
176
|
+
|
|
177
|
+
.dx-grid__cell-editor {
|
|
178
|
+
font-variant-numeric: tabular-nums;
|
|
179
|
+
white-space: normal;
|
|
180
|
+
hyphens: auto;
|
|
181
|
+
overflow-wrap: break-word;
|
|
182
|
+
|
|
183
|
+
background: var(--dx-grid-base, var(--dx-baseSurface));
|
|
184
|
+
border: 1px solid var(--dx-accentSurface);
|
|
185
|
+
border-radius: 2px;
|
|
186
|
+
|
|
187
|
+
--dx-grid-cell-editor-max-block-size: min(12em, 50vh);
|
|
188
|
+
--dx-grid-cell-editor-max-inline-size: min(60ch, 90vw);
|
|
189
|
+
|
|
190
|
+
block-size: min-content;
|
|
191
|
+
max-block-size: var(--dx-grid-cell-editor-max-block-size);
|
|
192
|
+
inline-size: min-content;
|
|
193
|
+
max-inline-size: var(--dx-grid-cell-editor-max-inline-size);
|
|
194
|
+
|
|
195
|
+
&:has(.dx-tag), &:has(dx-tag-picker-item) {
|
|
196
|
+
text-overflow: clip;
|
|
197
|
+
line-height: 0;
|
|
198
|
+
--dx-grid-cell-editor-padding-inline: 1px;
|
|
199
|
+
--dx-grid-cell-editor-padding-block: 1px;
|
|
109
200
|
}
|
|
110
201
|
}
|
|
111
202
|
|
|
203
|
+
/* /// */
|
|
112
204
|
.dx-grid-host:focus-within .dx-grid:not(:focus-within) {
|
|
113
205
|
[role='gridcell'],
|
|
114
206
|
[role='columnheader'],
|
|
115
207
|
[role='rowheader'] {
|
|
116
|
-
&[data-dx-active]:not([aria-readonly='true']) {
|
|
208
|
+
&[data-dx-active]:not([aria-readonly='true']) > .dx-grid__cell__content {
|
|
117
209
|
border-color: var(--dx-accentSurface);
|
|
118
210
|
}
|
|
119
211
|
}
|
|
@@ -132,6 +224,19 @@
|
|
|
132
224
|
background: rgba(0, 255, 0, 0.1);
|
|
133
225
|
}
|
|
134
226
|
}
|
|
227
|
+
|
|
228
|
+
.dx-grid__cell--flagged {
|
|
229
|
+
&::after {
|
|
230
|
+
content: '';
|
|
231
|
+
position: absolute;
|
|
232
|
+
inset-block-start: 0;
|
|
233
|
+
inset-inline-end: 0;
|
|
234
|
+
inline-size: 0;
|
|
235
|
+
block-size: 0;
|
|
236
|
+
border-inline-start: 0.5em solid transparent;
|
|
237
|
+
border-block-start: 0.5em solid var(--dx-warningText);
|
|
238
|
+
}
|
|
239
|
+
}
|
|
135
240
|
}
|
|
136
241
|
|
|
137
242
|
/* TODO(thure): Move this somewhere better. */
|
package/src/dx-grid.ts
CHANGED
|
@@ -640,16 +640,29 @@ export class DxGrid extends LitElement {
|
|
|
640
640
|
(this.overscroll === 'inline' && event.overscrollInline === 0) ||
|
|
641
641
|
(this.overscroll === 'block' && event.overscrollBlock === 0)
|
|
642
642
|
) {
|
|
643
|
-
event.
|
|
644
|
-
|
|
643
|
+
const element = event.target as HTMLElement;
|
|
644
|
+
const activeCell = element.closest('[data-dx-active]');
|
|
645
|
+
const contentEl = element.closest('.dx-grid__cell__content');
|
|
646
|
+
if (
|
|
647
|
+
!(
|
|
648
|
+
element &&
|
|
649
|
+
activeCell &&
|
|
650
|
+
contentEl &&
|
|
651
|
+
(contentEl.scrollWidth > contentEl.clientWidth || contentEl.scrollHeight > contentEl.clientHeight)
|
|
652
|
+
)
|
|
653
|
+
) {
|
|
654
|
+
event.preventDefault();
|
|
655
|
+
event.stopPropagation();
|
|
656
|
+
}
|
|
645
657
|
}
|
|
646
658
|
}
|
|
647
659
|
};
|
|
648
660
|
|
|
649
661
|
private handleWheel = (event: DxGridAnnotatedPanEvent) => {
|
|
650
662
|
if (this.mode === 'browse') {
|
|
651
|
-
const
|
|
652
|
-
const
|
|
663
|
+
const { deltaX, deltaY } = this.getOverflowingCellModifiedDeltas(event);
|
|
664
|
+
const nextPosInline = this.posInline + deltaX;
|
|
665
|
+
const nextPosBlock = this.posBlock + deltaY;
|
|
653
666
|
const maxPosInline = this.maxPosInline();
|
|
654
667
|
const maxPosBlock = this.maxPosBlock();
|
|
655
668
|
this.updatePos(nextPosInline, nextPosBlock, maxPosInline, maxPosBlock);
|
|
@@ -1262,6 +1275,44 @@ export class DxGrid extends LitElement {
|
|
|
1262
1275
|
return colReadonly === 'text-select' || rowReadonly === 'text-select';
|
|
1263
1276
|
}
|
|
1264
1277
|
|
|
1278
|
+
private getOverflowingCellModifiedDeltas(
|
|
1279
|
+
event: DxGridAnnotatedPanEvent,
|
|
1280
|
+
): Pick<DxGridAnnotatedPanEvent, 'deltaX' | 'deltaY'> {
|
|
1281
|
+
if (!event.target) {
|
|
1282
|
+
return event;
|
|
1283
|
+
}
|
|
1284
|
+
const element = event.target as HTMLElement;
|
|
1285
|
+
const activeCell = element.closest('[data-dx-active]');
|
|
1286
|
+
const contentEl = element.closest('.dx-grid__cell__content');
|
|
1287
|
+
|
|
1288
|
+
if (!activeCell || !contentEl || !document.activeElement?.contains(element)) {
|
|
1289
|
+
return event;
|
|
1290
|
+
}
|
|
1291
|
+
|
|
1292
|
+
// Commented-out code will let the event delta through unmodified if the cell can scroll but is scrolled to the end
|
|
1293
|
+
// in the same direction as the wheel event, a.k.a. “overscroll”; this is probably undesirable, though.
|
|
1294
|
+
|
|
1295
|
+
const { scrollWidth, clientWidth, scrollHeight, clientHeight /*, scrollLeft, scrollTop */ } = contentEl;
|
|
1296
|
+
|
|
1297
|
+
if (scrollWidth <= clientWidth && scrollHeight <= clientHeight) {
|
|
1298
|
+
return event;
|
|
1299
|
+
}
|
|
1300
|
+
|
|
1301
|
+
const deltaX =
|
|
1302
|
+
scrollWidth > clientWidth /* &&
|
|
1303
|
+
((event.deltaX < 0 && scrollLeft > 0) || (event.deltaX > 0 && scrollLeft < scrollWidth - clientWidth)) */
|
|
1304
|
+
? 0
|
|
1305
|
+
: event.deltaX;
|
|
1306
|
+
|
|
1307
|
+
const deltaY =
|
|
1308
|
+
scrollHeight > clientHeight /* &&
|
|
1309
|
+
((event.deltaY < 0 && scrollTop > 0) || (event.deltaY > 0 && scrollTop < scrollHeight - clientHeight)) */
|
|
1310
|
+
? 0
|
|
1311
|
+
: event.deltaY;
|
|
1312
|
+
|
|
1313
|
+
return { deltaX, deltaY };
|
|
1314
|
+
}
|
|
1315
|
+
|
|
1265
1316
|
private renderCell(col: number, row: number, plane: DxGridPlane, selected?: boolean, visCol = col, visRow = row) {
|
|
1266
1317
|
const cell = this.cell(col, row, plane);
|
|
1267
1318
|
const active = this.cellActive(col, row, plane);
|
|
@@ -1284,9 +1335,8 @@ export class DxGrid extends LitElement {
|
|
|
1284
1335
|
aria-rowindex=${row}
|
|
1285
1336
|
style="grid-column:${visCol + 1};grid-row:${visRow + 1}"
|
|
1286
1337
|
>
|
|
1287
|
-
|
|
1288
|
-
|
|
1289
|
-
: accessory}${cell?.resizeHandle &&
|
|
1338
|
+
<div role="none" class="dx-grid__cell__content">${cell?.value}${accessory}</div>
|
|
1339
|
+
${cell?.resizeHandle &&
|
|
1290
1340
|
this.mode === 'browse' &&
|
|
1291
1341
|
this.axisResizeable(resizePlane!, cell.resizeHandle, resizeIndex!)
|
|
1292
1342
|
? html`<dx-grid-axis-resize-handle
|
|
@@ -1490,6 +1540,13 @@ export class DxGrid extends LitElement {
|
|
|
1490
1540
|
this.updateVisInline();
|
|
1491
1541
|
}
|
|
1492
1542
|
|
|
1543
|
+
if (changedProperties.has('frozen')) {
|
|
1544
|
+
this.updateIntrinsicBlockSize();
|
|
1545
|
+
this.updateIntrinsicInlineSize();
|
|
1546
|
+
this.updateVisBlock();
|
|
1547
|
+
this.updateVisInline();
|
|
1548
|
+
}
|
|
1549
|
+
|
|
1493
1550
|
if (
|
|
1494
1551
|
this.getCells &&
|
|
1495
1552
|
(changedProperties.has('initialCells') ||
|
|
@@ -1500,7 +1557,8 @@ export class DxGrid extends LitElement {
|
|
|
1500
1557
|
changedProperties.has('columns') ||
|
|
1501
1558
|
changedProperties.has('rows') ||
|
|
1502
1559
|
changedProperties.has('limitColumns') ||
|
|
1503
|
-
changedProperties.has('limitRows')
|
|
1560
|
+
changedProperties.has('limitRows') ||
|
|
1561
|
+
changedProperties.has('frozen'))
|
|
1504
1562
|
) {
|
|
1505
1563
|
this.updateCells(true);
|
|
1506
1564
|
}
|
|
@@ -1520,8 +1578,9 @@ export class DxGrid extends LitElement {
|
|
|
1520
1578
|
}
|
|
1521
1579
|
}
|
|
1522
1580
|
|
|
1523
|
-
public updateIfWithinBounds({ col, row }: { col: number; row: number }): boolean {
|
|
1581
|
+
public updateIfWithinBounds({ col, row }: { col: number; row: number }, includeFixed?: boolean): boolean {
|
|
1524
1582
|
if (col >= this.visColMin && col <= this.visColMax && row >= this.visRowMin && row <= this.visRowMax) {
|
|
1583
|
+
this.updateCells(includeFixed);
|
|
1525
1584
|
this.requestUpdate();
|
|
1526
1585
|
return true;
|
|
1527
1586
|
}
|
|
@@ -6,9 +6,9 @@ import { expect, test, type Page } from '@playwright/test';
|
|
|
6
6
|
|
|
7
7
|
import { setupPage, storybookUrl } from '@dxos/test-utils/playwright';
|
|
8
8
|
|
|
9
|
-
import { DxGridManager } from '
|
|
10
|
-
import { type DxGridCellsSelect } from '
|
|
11
|
-
import { toPlaneCellIndex } from '
|
|
9
|
+
import { DxGridManager } from '../testing';
|
|
10
|
+
import { type DxGridCellsSelect } from '../types';
|
|
11
|
+
import { toPlaneCellIndex } from '../util';
|
|
12
12
|
|
|
13
13
|
const gridPlaneCellSize = 31;
|
|
14
14
|
const gap = 1;
|
|
@@ -21,7 +21,7 @@ test.describe('dx-grid', () => {
|
|
|
21
21
|
|
|
22
22
|
test.beforeEach(async ({ browser }) => {
|
|
23
23
|
const setup = await setupPage(browser, {
|
|
24
|
-
url: storybookUrl('dx-grid--spec'),
|
|
24
|
+
url: storybookUrl('dx-grid--spec', 9002),
|
|
25
25
|
viewportSize: {
|
|
26
26
|
width: (gridPlaneCellSize + gap) * (nCols + 1.5),
|
|
27
27
|
height: (gridPlaneCellSize + gap) * (nRows + 1.5),
|
|
@@ -0,0 +1,17 @@
|
|
|
1
|
+
//
|
|
2
|
+
// Copyright 2023 DXOS.org
|
|
3
|
+
//
|
|
4
|
+
|
|
5
|
+
import { defineConfig } from '@playwright/test';
|
|
6
|
+
|
|
7
|
+
import { e2ePreset } from '@dxos/test-utils/playwright';
|
|
8
|
+
|
|
9
|
+
export default defineConfig({
|
|
10
|
+
...e2ePreset(import.meta.dirname),
|
|
11
|
+
// TODO(wittjosiah): Avoid hard-coding ports.
|
|
12
|
+
webServer: {
|
|
13
|
+
command: 'moon run lit-storybook:serve-e2e -- --port=9002',
|
|
14
|
+
port: 9002,
|
|
15
|
+
reuseExistingServer: false,
|
|
16
|
+
},
|
|
17
|
+
});
|
|
@@ -4,7 +4,7 @@
|
|
|
4
4
|
|
|
5
5
|
import { expect, type Locator, type Page } from '@playwright/test';
|
|
6
6
|
|
|
7
|
-
import type { DxGridPlanePosition } from '
|
|
7
|
+
import type { DxGridPlanePosition } from '../types';
|
|
8
8
|
|
|
9
9
|
/**
|
|
10
10
|
* Test helper for managing dx-grid interactions and assertions in Playwright tests.
|
package/src/testing/index.ts
CHANGED
package/src/util.ts
CHANGED
|
@@ -25,7 +25,7 @@ export const toPlaneCellIndex = (cellCoords: Partial<DxGridPosition> & DxGridPla
|
|
|
25
25
|
|
|
26
26
|
export function parseCellIndex(index: DxGridCellIndex): DxGridPosition;
|
|
27
27
|
export function parseCellIndex(index: DxGridPlaneCellIndex): DxGridPlanePosition;
|
|
28
|
-
// eslint-disable-next-line
|
|
28
|
+
// eslint-disable-next-line prefer-arrow-functions/prefer-arrow-functions
|
|
29
29
|
export function parseCellIndex(index: DxGridPlaneCellIndex | DxGridCellIndex): DxGridPlanePosition | DxGridPosition {
|
|
30
30
|
const coords = index.split(separator);
|
|
31
31
|
if (coords.length === 3) {
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"dx-grid-manager.d.ts","sourceRoot":"","sources":["../../../../src/testing/playwright/dx-grid-manager.ts"],"names":[],"mappings":"AAIA,OAAO,EAAU,KAAK,OAAO,EAAE,KAAK,IAAI,EAAE,MAAM,kBAAkB,CAAC;AAEnE,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,aAAa,CAAC;AAEvD;;;GAGG;AACH,qBAAa,aAAa;gBACZ,IAAI,EAAE,IAAI,EAAE,IAAI,GAAE,OAAiC;IAK/D,IAAI,EAAE,OAAO,CAAC;IACd,IAAI,EAAE,IAAI,CAAC;IAEL,KAAK,IAAI,OAAO,CAAC,IAAI,CAAC;IAI5B,MAAM,IAAI,OAAO;IAIjB,gBAAgB,CAAC,KAAK,EAAE,MAAM,GAAG,OAAO;IAIxC,IAAI,CAAC,GAAG,EAAE,MAAM,EAAE,GAAG,EAAE,MAAM,EAAE,KAAK,EAAE,MAAM,GAAG,OAAO;IAMtD,IAAI,IAAI,OAAO,CAAC,MAAM,GAAG,IAAI,CAAC;IAI9B,UAAU,CAAC,MAAM,EAAE,MAAM,EAAE,MAAM,EAAE,MAAM,GAAG,OAAO,CAAC,IAAI,CAAC;IAInD,eAAe,CACnB,KAAK,EAAE,mBAAmB,EAC1B,GAAG,EAAE,mBAAmB,EACxB,QAAQ,EAAE,CAAC,GAAG,EAAE,MAAM,EAAE,GAAG,EAAE,MAAM,KAAK,OAAO,CAAC,IAAI,CAAC,GACpD,OAAO,CAAC,IAAI,CAAC;IAeV,qBAAqB,CAAC,KAAK,EAAE,mBAAmB,EAAE,GAAG,EAAE,mBAAmB,GAAG,OAAO,CAAC,IAAI,CAAC;IAM1F,0BAA0B,CAAC,IAAI,EAAE,MAAM,EAAE,IAAI,EAAE,MAAM,EAAE,WAAW,SAAI,EAAE,WAAW,SAAI,GAAG,OAAO,CAAC,IAAI,CAAC;IAgBvG,WAAW,CAAC,OAAO,EAAE,OAAO,GAAG,OAAO,CAAC,IAAI,CAAC;IAIlD,eAAe,IAAI,OAAO,CAAC,IAAI,CAAC;IAQ1B,cAAc,CAAC,CAAC,KAAK,OAAO,CAAC,CAAC,CAAC;CAStC"}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"dx-grid-manager.js","sourceRoot":"","sources":["../../../../src/testing/playwright/dx-grid-manager.ts"],"names":[],"mappings":"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"}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"dx-grid.spec.d.ts","sourceRoot":"","sources":["../../../../src/testing/playwright/dx-grid.spec.ts"],"names":[],"mappings":""}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"dx-grid.spec.js","sourceRoot":"","sources":["../../../../src/testing/playwright/dx-grid.spec.ts"],"names":[],"mappings":"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"}
|
package/dist/types/src/defs.d.ts
DELETED
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"defs.d.ts","sourceRoot":"","sources":["../../../src/defs.ts"],"names":[],"mappings":"AAIA,eAAO,MAAM,cAAc,MAAM,CAAC;AAClC,eAAO,MAAM,cAAc,KAAK,CAAC"}
|
package/dist/types/src/defs.js
DELETED
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"defs.js","sourceRoot":"","sources":["../../../src/defs.ts"],"names":[],"mappings":"AAAA,EAAE;AACF,0BAA0B;AAC1B,EAAE;AAEF,MAAM,CAAC,MAAM,cAAc,GAAG,GAAG,CAAC;AAClC,MAAM,CAAC,MAAM,cAAc,GAAG,EAAE,CAAC"}
|
|
@@ -1,16 +0,0 @@
|
|
|
1
|
-
import { LitElement } from 'lit';
|
|
2
|
-
import { type DxGridAxis, type DxGridFrozenPlane } from './types';
|
|
3
|
-
export declare class DxGridAxisResizeHandle extends LitElement {
|
|
4
|
-
axis: DxGridAxis;
|
|
5
|
-
plane: 'grid' | DxGridFrozenPlane;
|
|
6
|
-
index: string;
|
|
7
|
-
size: number;
|
|
8
|
-
private dragStartSize;
|
|
9
|
-
render(): import("lit").TemplateResult<1>;
|
|
10
|
-
private cleanup;
|
|
11
|
-
private dispatchResize;
|
|
12
|
-
private mount;
|
|
13
|
-
disconnectedCallback(): void;
|
|
14
|
-
createRenderRoot(): this;
|
|
15
|
-
}
|
|
16
|
-
//# sourceMappingURL=dx-grid-axis-resize-handle.d.ts.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"dx-grid-axis-resize-handle.d.ts","sourceRoot":"","sources":["../../../src/dx-grid-axis-resize-handle.ts"],"names":[],"mappings":"AAQA,OAAO,EAAQ,UAAU,EAAE,MAAM,KAAK,CAAC;AAIvC,OAAO,EAAwB,KAAK,UAAU,EAAE,KAAK,iBAAiB,EAAE,MAAM,SAAS,CAAC;AAExF,qBACa,sBAAuB,SAAQ,UAAU;IAEpD,IAAI,EAAE,UAAU,CAAS;IAGzB,KAAK,EAAE,MAAM,GAAG,iBAAiB,CAAU;IAG3C,KAAK,EAAE,MAAM,CAAQ;IAGrB,IAAI,EAAE,MAAM,CAAO;IAEnB,OAAO,CAAC,aAAa,CAAe;IAE3B,MAAM;IAWf,OAAO,CAAC,OAAO,CAA0B;IAEzC,OAAO,CAAC,cAAc;IAatB,OAAO,CAAC,KAAK;IA0BJ,oBAAoB,IAAI,IAAI;IAK5B,gBAAgB,IAAI,IAAI;CAGlC"}
|
|
@@ -1,100 +0,0 @@
|
|
|
1
|
-
//
|
|
2
|
-
// Copyright 2024 DXOS.org
|
|
3
|
-
//
|
|
4
|
-
var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
|
|
5
|
-
var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
|
|
6
|
-
if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
|
|
7
|
-
else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
|
|
8
|
-
return c > 3 && r && Object.defineProperty(target, key, r), r;
|
|
9
|
-
};
|
|
10
|
-
import { draggable } from '@atlaskit/pragmatic-drag-and-drop/element/adapter';
|
|
11
|
-
import { disableNativeDragPreview } from '@atlaskit/pragmatic-drag-and-drop/element/disable-native-drag-preview';
|
|
12
|
-
import { preventUnhandled } from '@atlaskit/pragmatic-drag-and-drop/prevent-unhandled';
|
|
13
|
-
import { html, LitElement } from 'lit';
|
|
14
|
-
import { customElement, property } from 'lit/decorators.js';
|
|
15
|
-
import { ref } from 'lit/directives/ref.js';
|
|
16
|
-
import { DxAxisResizeInternal } from './types';
|
|
17
|
-
let DxGridAxisResizeHandle = class DxGridAxisResizeHandle extends LitElement {
|
|
18
|
-
constructor() {
|
|
19
|
-
super(...arguments);
|
|
20
|
-
this.axis = 'row';
|
|
21
|
-
this.plane = 'grid';
|
|
22
|
-
this.index = '-1';
|
|
23
|
-
this.size = 128;
|
|
24
|
-
this.dragStartSize = 128;
|
|
25
|
-
this.cleanup = null;
|
|
26
|
-
}
|
|
27
|
-
render() {
|
|
28
|
-
return html `<button
|
|
29
|
-
class="dx-grid__resize-handle"
|
|
30
|
-
data-dx-grid-axis=${this.axis}
|
|
31
|
-
data-dx-grid-action="resize"
|
|
32
|
-
${ref(this.mount)}
|
|
33
|
-
>
|
|
34
|
-
<span class="sr-only">Resize</span>
|
|
35
|
-
</button>`;
|
|
36
|
-
}
|
|
37
|
-
dispatchResize(location, state) {
|
|
38
|
-
const client = this.axis === 'row' ? 'clientY' : 'clientX';
|
|
39
|
-
const event = new DxAxisResizeInternal({
|
|
40
|
-
axis: this.axis,
|
|
41
|
-
plane: this.plane,
|
|
42
|
-
size: this.dragStartSize,
|
|
43
|
-
index: this.index,
|
|
44
|
-
delta: location.current.input[client] - location.initial.input[client],
|
|
45
|
-
state,
|
|
46
|
-
});
|
|
47
|
-
this.dispatchEvent(event);
|
|
48
|
-
}
|
|
49
|
-
mount(element) {
|
|
50
|
-
var _a;
|
|
51
|
-
(_a = this.cleanup) === null || _a === void 0 ? void 0 : _a.call(this);
|
|
52
|
-
const host = this;
|
|
53
|
-
if (element) {
|
|
54
|
-
this.cleanup = draggable({
|
|
55
|
-
element: element,
|
|
56
|
-
onGenerateDragPreview: ({ nativeSetDragImage }) => {
|
|
57
|
-
// We will be moving the line to indicate a drag; we can disable the native drag preview.
|
|
58
|
-
disableNativeDragPreview({ nativeSetDragImage });
|
|
59
|
-
// We don't want any native drop animation for when the user does not drop on a drop target.
|
|
60
|
-
// We want the drag to finish immediately.
|
|
61
|
-
preventUnhandled.start();
|
|
62
|
-
},
|
|
63
|
-
onDragStart() {
|
|
64
|
-
host.dragStartSize = host.size;
|
|
65
|
-
},
|
|
66
|
-
onDrag({ location }) {
|
|
67
|
-
host.dispatchResize(location, 'dragging');
|
|
68
|
-
},
|
|
69
|
-
onDrop({ location }) {
|
|
70
|
-
host.dispatchResize(location, 'dropped');
|
|
71
|
-
},
|
|
72
|
-
});
|
|
73
|
-
}
|
|
74
|
-
}
|
|
75
|
-
disconnectedCallback() {
|
|
76
|
-
var _a;
|
|
77
|
-
super.disconnectedCallback();
|
|
78
|
-
(_a = this.cleanup) === null || _a === void 0 ? void 0 : _a.call(this);
|
|
79
|
-
}
|
|
80
|
-
createRenderRoot() {
|
|
81
|
-
return this;
|
|
82
|
-
}
|
|
83
|
-
};
|
|
84
|
-
__decorate([
|
|
85
|
-
property({ type: String })
|
|
86
|
-
], DxGridAxisResizeHandle.prototype, "axis", void 0);
|
|
87
|
-
__decorate([
|
|
88
|
-
property({ type: String })
|
|
89
|
-
], DxGridAxisResizeHandle.prototype, "plane", void 0);
|
|
90
|
-
__decorate([
|
|
91
|
-
property({ type: String })
|
|
92
|
-
], DxGridAxisResizeHandle.prototype, "index", void 0);
|
|
93
|
-
__decorate([
|
|
94
|
-
property({ type: Number })
|
|
95
|
-
], DxGridAxisResizeHandle.prototype, "size", void 0);
|
|
96
|
-
DxGridAxisResizeHandle = __decorate([
|
|
97
|
-
customElement('dx-grid-axis-resize-handle')
|
|
98
|
-
], DxGridAxisResizeHandle);
|
|
99
|
-
export { DxGridAxisResizeHandle };
|
|
100
|
-
//# sourceMappingURL=dx-grid-axis-resize-handle.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"dx-grid-axis-resize-handle.js","sourceRoot":"","sources":["../../../src/dx-grid-axis-resize-handle.ts"],"names":[],"mappings":"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"}
|
|
@@ -1,13 +0,0 @@
|
|
|
1
|
-
import { LitElement } from 'lit';
|
|
2
|
-
export type DxGridSelectValue = {
|
|
3
|
-
label: string;
|
|
4
|
-
};
|
|
5
|
-
export declare class DxGridMultiselectCell extends LitElement {
|
|
6
|
-
values: DxGridSelectValue[];
|
|
7
|
-
expanded: boolean;
|
|
8
|
-
controls: string;
|
|
9
|
-
placeholder: string;
|
|
10
|
-
render(): import("lit").TemplateResult<1>;
|
|
11
|
-
createRenderRoot(): this;
|
|
12
|
-
}
|
|
13
|
-
//# sourceMappingURL=dx-grid-multiselect-cell.d.ts.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"dx-grid-multiselect-cell.d.ts","sourceRoot":"","sources":["../../../src/dx-grid-multiselect-cell.ts"],"names":[],"mappings":"AAIA,OAAO,EAAQ,UAAU,EAAE,MAAM,KAAK,CAAC;AAGvC,MAAM,MAAM,iBAAiB,GAAG;IAC9B,KAAK,EAAE,MAAM,CAAC;CACf,CAAC;AAEF,qBACa,qBAAsB,SAAQ,UAAU;IAEnD,MAAM,EAAE,iBAAiB,EAAE,CAAM;IAGjC,QAAQ,EAAE,OAAO,CAAS;IAG1B,QAAQ,EAAE,MAAM,CAAM;IAGtB,WAAW,EAAE,MAAM,CAAM;IAEhB,MAAM;IAiBN,gBAAgB,IAAI,IAAI;CAGlC"}
|
|
@@ -1,56 +0,0 @@
|
|
|
1
|
-
//
|
|
2
|
-
// Copyright 2024 DXOS.org
|
|
3
|
-
//
|
|
4
|
-
var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
|
|
5
|
-
var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
|
|
6
|
-
if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
|
|
7
|
-
else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
|
|
8
|
-
return c > 3 && r && Object.defineProperty(target, key, r), r;
|
|
9
|
-
};
|
|
10
|
-
import { html, LitElement } from 'lit';
|
|
11
|
-
import { customElement, property } from 'lit/decorators.js';
|
|
12
|
-
let DxGridMultiselectCell = class DxGridMultiselectCell extends LitElement {
|
|
13
|
-
constructor() {
|
|
14
|
-
super(...arguments);
|
|
15
|
-
this.values = [];
|
|
16
|
-
this.expanded = false;
|
|
17
|
-
this.controls = '';
|
|
18
|
-
this.placeholder = '';
|
|
19
|
-
}
|
|
20
|
-
render() {
|
|
21
|
-
return html `<button
|
|
22
|
-
role="combobox"
|
|
23
|
-
aria-expanded=${this.expanded}
|
|
24
|
-
?aria-controls=${this.controls}
|
|
25
|
-
aria-haspopup="dialog"
|
|
26
|
-
class="dx-grid__cell__multiselect"
|
|
27
|
-
data-dx-grid-accessory="invoke-multiselect"
|
|
28
|
-
>
|
|
29
|
-
${this.values.length > 0
|
|
30
|
-
? this.values.map(({ label }) => html `<span class="dx-grid__cell__multiselect__value">${label}</span>`)
|
|
31
|
-
: html `<span class="dx-grid__cell__multiselect__placeholder">${this.placeholder}</span>`}
|
|
32
|
-
<span role="none" class="dx-grid__cell__multiselect__separator"></span>
|
|
33
|
-
<svg><use href="/icons.svg#ph--caret-down--regular" /></svg>
|
|
34
|
-
</button>`;
|
|
35
|
-
}
|
|
36
|
-
createRenderRoot() {
|
|
37
|
-
return this;
|
|
38
|
-
}
|
|
39
|
-
};
|
|
40
|
-
__decorate([
|
|
41
|
-
property({ type: Array })
|
|
42
|
-
], DxGridMultiselectCell.prototype, "values", void 0);
|
|
43
|
-
__decorate([
|
|
44
|
-
property({ type: Boolean })
|
|
45
|
-
], DxGridMultiselectCell.prototype, "expanded", void 0);
|
|
46
|
-
__decorate([
|
|
47
|
-
property({ type: String })
|
|
48
|
-
], DxGridMultiselectCell.prototype, "controls", void 0);
|
|
49
|
-
__decorate([
|
|
50
|
-
property({ type: String })
|
|
51
|
-
], DxGridMultiselectCell.prototype, "placeholder", void 0);
|
|
52
|
-
DxGridMultiselectCell = __decorate([
|
|
53
|
-
customElement('dx-grid-multiselect-cell')
|
|
54
|
-
], DxGridMultiselectCell);
|
|
55
|
-
export { DxGridMultiselectCell };
|
|
56
|
-
//# sourceMappingURL=dx-grid-multiselect-cell.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"dx-grid-multiselect-cell.js","sourceRoot":"","sources":["../../../src/dx-grid-multiselect-cell.ts"],"names":[],"mappings":"AAAA,EAAE;AACF,0BAA0B;AAC1B,EAAE;;;;;;;AAEF,OAAO,EAAE,IAAI,EAAE,UAAU,EAAE,MAAM,KAAK,CAAC;AACvC,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAC;AAOrD,IAAM,qBAAqB,GAA3B,MAAM,qBAAsB,SAAQ,UAAU;IAA9C;;QAEL,WAAM,GAAwB,EAAE,CAAC;QAGjC,aAAQ,GAAY,KAAK,CAAC;QAG1B,aAAQ,GAAW,EAAE,CAAC;QAGtB,gBAAW,GAAW,EAAE,CAAC;IAsB3B,CAAC;IApBU,MAAM;QACb,OAAO,IAAI,CAAA;;sBAEO,IAAI,CAAC,QAAQ;uBACZ,IAAI,CAAC,QAAQ;;;;;QAK5B,IAAI,CAAC,MAAM,CAAC,MAAM,GAAG,CAAC;YACtB,CAAC,CAAC,IAAI,CAAC,MAAM,CAAC,GAAG,CAAC,CAAC,EAAE,KAAK,EAAE,EAAE,EAAE,CAAC,IAAI,CAAA,mDAAmD,KAAK,SAAS,CAAC;YACvG,CAAC,CAAC,IAAI,CAAA,yDAAyD,IAAI,CAAC,WAAW,SAAS;;;cAGlF,CAAC;IACb,CAAC;IAEQ,gBAAgB;QACvB,OAAO,IAAI,CAAC;IACd,CAAC;CACF,CAAA;AA/BC;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,KAAK,EAAE,CAAC;qDACO;AAGjC;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,CAAC;uDACF;AAG1B;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;uDACL;AAGtB;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;0DACF;AAXd,qBAAqB;IADjC,aAAa,CAAC,0BAA0B,CAAC;GAC7B,qBAAqB,CAiCjC"}
|