@react-spectrum/s2 3.0.0-nightly-e60fb427c-240929 → 3.0.0-nightly-44fa2a512-241001
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/{Table.cjs → TableView.cjs} +170 -170
- package/dist/TableView.cjs.map +1 -0
- package/dist/{Table.css → TableView.css} +1 -1
- package/dist/TableView.css.map +1 -0
- package/dist/{Table.mjs → TableView.mjs} +166 -166
- package/dist/TableView.mjs.map +1 -0
- package/dist/main.cjs +7 -7
- package/dist/main.cjs.map +1 -1
- package/dist/module.mjs +2 -2
- package/dist/module.mjs.map +1 -1
- package/dist/types.d.ts +3 -3
- package/dist/types.d.ts.map +1 -1
- package/package.json +18 -18
- package/src/{Table.tsx → TableView.tsx} +5 -5
- package/src/index.ts +2 -2
- package/dist/Table.cjs.map +0 -1
- package/dist/Table.css.map +0 -1
- package/dist/Table.mjs.map +0 -1
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
require("./
|
|
1
|
+
require("./TableView.css");
|
|
2
2
|
var $af04e099a53d3e85$exports = require("./Checkbox.cjs");
|
|
3
3
|
var $1df9f1c9262ce5df$exports = require("./Chevron.cjs");
|
|
4
4
|
var $bde97c91243ed164$exports = require("../icons/Icon.cjs");
|
|
@@ -10,14 +10,14 @@ var $1c116ea4b0d2d023$exports = require("./ProgressCircle.cjs");
|
|
|
10
10
|
var $22bf2407c3628a21$exports = require("../icons/SortDown.cjs");
|
|
11
11
|
var $2197830b90e71c31$exports = require("../icons/SortUp.cjs");
|
|
12
12
|
var $ee7b4c497f520c08$exports = require("./utils.cjs");
|
|
13
|
-
var $
|
|
14
|
-
var $
|
|
15
|
-
var $
|
|
16
|
-
var $
|
|
17
|
-
var $
|
|
18
|
-
var $
|
|
19
|
-
var $
|
|
20
|
-
var $
|
|
13
|
+
var $iLVc8$reactjsxruntime = require("react/jsx-runtime");
|
|
14
|
+
var $iLVc8$reactariacomponents = require("react-aria-components");
|
|
15
|
+
var $iLVc8$react = require("react");
|
|
16
|
+
var $iLVc8$reactstatelyvirtualizer = require("@react-stately/virtualizer");
|
|
17
|
+
var $iLVc8$reactspectrumutils = require("@react-spectrum/utils");
|
|
18
|
+
var $iLVc8$reactariautils = require("@react-aria/utils");
|
|
19
|
+
var $iLVc8$reactariai18n = require("@react-aria/i18n");
|
|
20
|
+
var $iLVc8$reactaria = require("react-aria");
|
|
21
21
|
|
|
22
22
|
|
|
23
23
|
function $parcel$interopDefault(a) {
|
|
@@ -28,12 +28,12 @@ function $parcel$export(e, n, v, s) {
|
|
|
28
28
|
Object.defineProperty(e, n, {get: v, set: s, enumerable: true, configurable: true});
|
|
29
29
|
}
|
|
30
30
|
|
|
31
|
-
$parcel$export(module.exports, "TableBody", () => $
|
|
32
|
-
$parcel$export(module.exports, "Column", () => $
|
|
33
|
-
$parcel$export(module.exports, "TableHeader", () => $
|
|
34
|
-
$parcel$export(module.exports, "Cell", () => $
|
|
35
|
-
$parcel$export(module.exports, "Row", () => $
|
|
36
|
-
$parcel$export(module.exports, "
|
|
31
|
+
$parcel$export(module.exports, "TableBody", () => $bed37377ec7a3a9e$export$76ccd210b9029917);
|
|
32
|
+
$parcel$export(module.exports, "Column", () => $bed37377ec7a3a9e$export$816b5d811295e6bc);
|
|
33
|
+
$parcel$export(module.exports, "TableHeader", () => $bed37377ec7a3a9e$export$f850895b287ef28e);
|
|
34
|
+
$parcel$export(module.exports, "Cell", () => $bed37377ec7a3a9e$export$f6f0c3fe4ec306ea);
|
|
35
|
+
$parcel$export(module.exports, "Row", () => $bed37377ec7a3a9e$export$b59bdbef9ce70de2);
|
|
36
|
+
$parcel$export(module.exports, "TableView", () => $bed37377ec7a3a9e$export$b3c27e869d856b7);
|
|
37
37
|
/*
|
|
38
38
|
* Copyright 2024 Adobe. All rights reserved.
|
|
39
39
|
* This file is licensed to you under the Apache License, Version 2.0 (the "License");
|
|
@@ -63,9 +63,9 @@ $parcel$export(module.exports, "Table", () => $93ff1e08f8313b57$export$54ec01a60
|
|
|
63
63
|
|
|
64
64
|
|
|
65
65
|
|
|
66
|
-
let $
|
|
67
|
-
const $
|
|
68
|
-
const $
|
|
66
|
+
let $bed37377ec7a3a9e$var$InternalTableContext = /*#__PURE__*/ (0, $iLVc8$react.createContext)({});
|
|
67
|
+
const $bed37377ec7a3a9e$var$tableWrapper = " . oa oba qa qba _Zd __Fa __R-yksgrp";
|
|
68
|
+
const $bed37377ec7a3a9e$var$table = function anonymous(props, overrides) {
|
|
69
69
|
let rules = " .";
|
|
70
70
|
let matches = (overrides || '').match(/(?:^|\s)(?:y|z|A|B|_9|_8|h|_5|_4|__A|__c|__d|__a|__b|U|__Q|X|Z|V|W|l|q|r|k|o|p)[^\s]+/g) || [];
|
|
71
71
|
rules += matches.join('');
|
|
@@ -133,11 +133,11 @@ const $93ff1e08f8313b57$var$table = function anonymous(props, overrides) {
|
|
|
133
133
|
return rules;
|
|
134
134
|
};
|
|
135
135
|
// component-height-100
|
|
136
|
-
const $
|
|
136
|
+
const $bed37377ec7a3a9e$var$DEFAULT_HEADER_HEIGHT = {
|
|
137
137
|
medium: 32,
|
|
138
138
|
large: 40
|
|
139
139
|
};
|
|
140
|
-
const $
|
|
140
|
+
const $bed37377ec7a3a9e$var$ROW_HEIGHTS = {
|
|
141
141
|
compact: {
|
|
142
142
|
medium: 32,
|
|
143
143
|
large: 40
|
|
@@ -151,7 +151,7 @@ const $93ff1e08f8313b57$var$ROW_HEIGHTS = {
|
|
|
151
151
|
large: 60
|
|
152
152
|
}
|
|
153
153
|
};
|
|
154
|
-
class $
|
|
154
|
+
class $bed37377ec7a3a9e$export$4e03bdf0174fd602 extends (0, $iLVc8$reactariacomponents.UNSTABLE_TableLayout) {
|
|
155
155
|
constructor(options){
|
|
156
156
|
super({
|
|
157
157
|
...options,
|
|
@@ -187,7 +187,7 @@ class $93ff1e08f8313b57$export$4e03bdf0174fd602 extends (0, $4Eob6$reactariacomp
|
|
|
187
187
|
layoutInfo.allowOverflow = true;
|
|
188
188
|
// If loading or empty, we'll want the body to be sticky and centered
|
|
189
189
|
if (children?.length === 0) {
|
|
190
|
-
layoutInfo.rect = new (0, $
|
|
190
|
+
layoutInfo.rect = new (0, $iLVc8$reactstatelyvirtualizer.Rect)(40, 40, this.virtualizer.visibleRect.width - 80, this.virtualizer.visibleRect.height - 80);
|
|
191
191
|
layoutInfo.isSticky = true;
|
|
192
192
|
}
|
|
193
193
|
return {
|
|
@@ -214,16 +214,16 @@ class $93ff1e08f8313b57$export$4e03bdf0174fd602 extends (0, $4Eob6$reactariacomp
|
|
|
214
214
|
return layoutNode;
|
|
215
215
|
}
|
|
216
216
|
}
|
|
217
|
-
function $
|
|
217
|
+
function $bed37377ec7a3a9e$var$TableView(props, ref) {
|
|
218
218
|
let { UNSAFE_style: UNSAFE_style, UNSAFE_className: UNSAFE_className, isQuiet: isQuiet = false, density: density = 'regular', overflowMode: overflowMode = 'truncate', styles: styles, loadingState: loadingState, onLoadMore: onLoadMore, onResize: propsOnResize, onResizeStart: propsOnResizeStart, onResizeEnd: propsOnResizeEnd, onAction: onAction, ...otherProps } = props;
|
|
219
|
-
let domRef = (0, $
|
|
219
|
+
let domRef = (0, $iLVc8$reactspectrumutils.useDOMRef)(ref);
|
|
220
220
|
let scale = (0, $ee7b4c497f520c08$exports.useScale)();
|
|
221
|
-
let layout = (0, $
|
|
222
|
-
return new $
|
|
223
|
-
rowHeight: overflowMode === 'wrap' ? undefined : $
|
|
224
|
-
estimatedRowHeight: overflowMode === 'wrap' ? $
|
|
221
|
+
let layout = (0, $iLVc8$react.useMemo)(()=>{
|
|
222
|
+
return new $bed37377ec7a3a9e$export$4e03bdf0174fd602({
|
|
223
|
+
rowHeight: overflowMode === 'wrap' ? undefined : $bed37377ec7a3a9e$var$ROW_HEIGHTS[density][scale],
|
|
224
|
+
estimatedRowHeight: overflowMode === 'wrap' ? $bed37377ec7a3a9e$var$ROW_HEIGHTS[density][scale] : undefined,
|
|
225
225
|
// No need for estimated headingHeight since the headers aren't affected by overflow mode: wrap
|
|
226
|
-
headingHeight: $
|
|
226
|
+
headingHeight: $bed37377ec7a3a9e$var$DEFAULT_HEADER_HEIGHT[scale]
|
|
227
227
|
});
|
|
228
228
|
}, [
|
|
229
229
|
overflowMode,
|
|
@@ -232,20 +232,20 @@ function $93ff1e08f8313b57$var$Table(props, ref) {
|
|
|
232
232
|
]);
|
|
233
233
|
// Starts when the user selects resize from the menu, ends when resizing ends
|
|
234
234
|
// used to control the visibility of the resizer Nubbin
|
|
235
|
-
let [isInResizeMode, setIsInResizeMode] = (0, $
|
|
236
|
-
let onResizeStart = (0, $
|
|
235
|
+
let [isInResizeMode, setIsInResizeMode] = (0, $iLVc8$react.useState)(false);
|
|
236
|
+
let onResizeStart = (0, $iLVc8$react.useCallback)((widths)=>{
|
|
237
237
|
propsOnResizeStart?.(widths);
|
|
238
238
|
}, [
|
|
239
239
|
propsOnResizeStart
|
|
240
240
|
]);
|
|
241
|
-
let onResizeEnd = (0, $
|
|
241
|
+
let onResizeEnd = (0, $iLVc8$react.useCallback)((widths)=>{
|
|
242
242
|
setIsInResizeMode(false);
|
|
243
243
|
propsOnResizeEnd?.(widths);
|
|
244
244
|
}, [
|
|
245
245
|
propsOnResizeEnd,
|
|
246
246
|
setIsInResizeMode
|
|
247
247
|
]);
|
|
248
|
-
let context = (0, $
|
|
248
|
+
let context = (0, $iLVc8$react.useMemo)(()=>({
|
|
249
249
|
isQuiet: isQuiet,
|
|
250
250
|
density: density,
|
|
251
251
|
overflowMode: overflowMode,
|
|
@@ -261,35 +261,35 @@ function $93ff1e08f8313b57$var$Table(props, ref) {
|
|
|
261
261
|
setIsInResizeMode
|
|
262
262
|
]);
|
|
263
263
|
let isLoading = loadingState === 'loading' || loadingState === 'loadingMore';
|
|
264
|
-
let scrollRef = (0, $
|
|
265
|
-
let memoedLoadMoreProps = (0, $
|
|
264
|
+
let scrollRef = (0, $iLVc8$react.useRef)(null);
|
|
265
|
+
let memoedLoadMoreProps = (0, $iLVc8$react.useMemo)(()=>({
|
|
266
266
|
isLoading: isLoading,
|
|
267
267
|
onLoadMore: onLoadMore
|
|
268
268
|
}), [
|
|
269
269
|
isLoading,
|
|
270
270
|
onLoadMore
|
|
271
271
|
]);
|
|
272
|
-
(0, $
|
|
272
|
+
(0, $iLVc8$reactariautils.useLoadMore)(memoedLoadMoreProps, scrollRef);
|
|
273
273
|
let isCheckboxSelection = props.selectionMode === 'multiple' || props.selectionMode === 'single';
|
|
274
|
-
return /*#__PURE__*/ (0, $
|
|
274
|
+
return /*#__PURE__*/ (0, $iLVc8$reactjsxruntime.jsx)((0, $iLVc8$reactariacomponents.ResizableTableContainer), {
|
|
275
275
|
// TODO: perhaps this ref should be attached to the RACTable but it expects a table type ref which isn't true in the virtualized case
|
|
276
276
|
ref: domRef,
|
|
277
277
|
onResize: propsOnResize,
|
|
278
278
|
onResizeEnd: onResizeEnd,
|
|
279
279
|
onResizeStart: onResizeStart,
|
|
280
|
-
className: (UNSAFE_className || '') + (0, $308b180f49d82d28$exports.mergeStyles)($
|
|
280
|
+
className: (UNSAFE_className || '') + (0, $308b180f49d82d28$exports.mergeStyles)($bed37377ec7a3a9e$var$tableWrapper, styles),
|
|
281
281
|
style: UNSAFE_style,
|
|
282
|
-
children: /*#__PURE__*/ (0, $
|
|
282
|
+
children: /*#__PURE__*/ (0, $iLVc8$reactjsxruntime.jsx)((0, $iLVc8$reactariacomponents.UNSTABLE_Virtualizer), {
|
|
283
283
|
layout: layout,
|
|
284
|
-
children: /*#__PURE__*/ (0, $
|
|
284
|
+
children: /*#__PURE__*/ (0, $iLVc8$reactjsxruntime.jsx)($bed37377ec7a3a9e$var$InternalTableContext.Provider, {
|
|
285
285
|
value: context,
|
|
286
|
-
children: /*#__PURE__*/ (0, $
|
|
286
|
+
children: /*#__PURE__*/ (0, $iLVc8$reactjsxruntime.jsx)((0, $iLVc8$reactariacomponents.Table), {
|
|
287
287
|
ref: scrollRef,
|
|
288
288
|
// Fix webkit bug where scrollbars appear above the checkboxes/other table elements
|
|
289
289
|
style: {
|
|
290
290
|
WebkitTransform: 'translateZ(0)'
|
|
291
291
|
},
|
|
292
|
-
className: (renderProps)=>$
|
|
292
|
+
className: (renderProps)=>$bed37377ec7a3a9e$var$table({
|
|
293
293
|
...renderProps,
|
|
294
294
|
isCheckboxSelection: isCheckboxSelection,
|
|
295
295
|
isQuiet: isQuiet
|
|
@@ -302,18 +302,18 @@ function $93ff1e08f8313b57$var$Table(props, ref) {
|
|
|
302
302
|
})
|
|
303
303
|
});
|
|
304
304
|
}
|
|
305
|
-
const $
|
|
306
|
-
function $
|
|
305
|
+
const $bed37377ec7a3a9e$var$centeredWrapper = " . _Zd _1c _2d l4 k4";
|
|
306
|
+
function $bed37377ec7a3a9e$export$76ccd210b9029917(props) {
|
|
307
307
|
let { items: items, renderEmptyState: renderEmptyState, children: children } = props;
|
|
308
|
-
let { loadingState: loadingState } = (0, $
|
|
308
|
+
let { loadingState: loadingState } = (0, $iLVc8$react.useContext)($bed37377ec7a3a9e$var$InternalTableContext);
|
|
309
309
|
let emptyRender;
|
|
310
310
|
let renderer = children;
|
|
311
|
-
let stringFormatter = (0, $
|
|
312
|
-
let loadMoreSpinner = /*#__PURE__*/ (0, $
|
|
311
|
+
let stringFormatter = (0, $iLVc8$reactariai18n.useLocalizedStringFormatter)((0, ($parcel$interopDefault($4526404114e78c80$exports))), '@react-spectrum/s2');
|
|
312
|
+
let loadMoreSpinner = /*#__PURE__*/ (0, $iLVc8$reactjsxruntime.jsx)((0, $iLVc8$reactariacomponents.UNSTABLE_TableLoadingIndicator), {
|
|
313
313
|
className: " . k4 l4",
|
|
314
|
-
children: /*#__PURE__*/ (0, $
|
|
315
|
-
className: $
|
|
316
|
-
children: /*#__PURE__*/ (0, $
|
|
314
|
+
children: /*#__PURE__*/ (0, $iLVc8$reactjsxruntime.jsx)("div", {
|
|
315
|
+
className: $bed37377ec7a3a9e$var$centeredWrapper,
|
|
316
|
+
children: /*#__PURE__*/ (0, $iLVc8$reactjsxruntime.jsx)((0, $1c116ea4b0d2d023$exports.ProgressCircle), {
|
|
317
317
|
isIndeterminate: true,
|
|
318
318
|
"aria-label": stringFormatter.format('table.loadingMore')
|
|
319
319
|
})
|
|
@@ -323,33 +323,33 @@ function $93ff1e08f8313b57$export$76ccd210b9029917(props) {
|
|
|
323
323
|
// the loader. Otherwise it is a static renderer and thus we can simply add the table loader after
|
|
324
324
|
// TODO: this assumes that the user isn't providing their children in some wrapper though and/or isn't doing a map of children
|
|
325
325
|
// (though I guess they wouldn't provide items then so the check for this is still valid in the latter case)...
|
|
326
|
-
if (typeof children === 'function' && items) renderer = /*#__PURE__*/ (0, $
|
|
326
|
+
if (typeof children === 'function' && items) renderer = /*#__PURE__*/ (0, $iLVc8$reactjsxruntime.jsxs)((0, $iLVc8$reactjsxruntime.Fragment), {
|
|
327
327
|
children: [
|
|
328
|
-
/*#__PURE__*/ (0, $
|
|
328
|
+
/*#__PURE__*/ (0, $iLVc8$reactjsxruntime.jsx)((0, $iLVc8$reactariacomponents.Collection), {
|
|
329
329
|
items: items,
|
|
330
330
|
children: children
|
|
331
331
|
}),
|
|
332
332
|
loadingState === 'loadingMore' && loadMoreSpinner
|
|
333
333
|
]
|
|
334
334
|
});
|
|
335
|
-
else renderer = /*#__PURE__*/ (0, $
|
|
335
|
+
else renderer = /*#__PURE__*/ (0, $iLVc8$reactjsxruntime.jsxs)((0, $iLVc8$reactjsxruntime.Fragment), {
|
|
336
336
|
children: [
|
|
337
337
|
children,
|
|
338
338
|
loadingState === 'loadingMore' && loadMoreSpinner
|
|
339
339
|
]
|
|
340
340
|
});
|
|
341
|
-
if (renderEmptyState != null && loadingState !== 'loading') emptyRender = (props)=>/*#__PURE__*/ (0, $
|
|
342
|
-
className: $
|
|
341
|
+
if (renderEmptyState != null && loadingState !== 'loading') emptyRender = (props)=>/*#__PURE__*/ (0, $iLVc8$reactjsxruntime.jsx)("div", {
|
|
342
|
+
className: $bed37377ec7a3a9e$var$centeredWrapper,
|
|
343
343
|
children: renderEmptyState(props)
|
|
344
344
|
});
|
|
345
|
-
else if (loadingState === 'loading') emptyRender = ()=>/*#__PURE__*/ (0, $
|
|
346
|
-
className: $
|
|
347
|
-
children: /*#__PURE__*/ (0, $
|
|
345
|
+
else if (loadingState === 'loading') emptyRender = ()=>/*#__PURE__*/ (0, $iLVc8$reactjsxruntime.jsx)("div", {
|
|
346
|
+
className: $bed37377ec7a3a9e$var$centeredWrapper,
|
|
347
|
+
children: /*#__PURE__*/ (0, $iLVc8$reactjsxruntime.jsx)((0, $1c116ea4b0d2d023$exports.ProgressCircle), {
|
|
348
348
|
isIndeterminate: true,
|
|
349
349
|
"aria-label": stringFormatter.format('table.loading')
|
|
350
350
|
})
|
|
351
351
|
});
|
|
352
|
-
return /*#__PURE__*/ (0, $
|
|
352
|
+
return /*#__PURE__*/ (0, $iLVc8$reactjsxruntime.jsx)((0, $iLVc8$reactariacomponents.TableBody), {
|
|
353
353
|
className: " . k4",
|
|
354
354
|
...props,
|
|
355
355
|
renderEmptyState: emptyRender,
|
|
@@ -359,7 +359,7 @@ function $93ff1e08f8313b57$export$76ccd210b9029917(props) {
|
|
|
359
359
|
children: renderer
|
|
360
360
|
});
|
|
361
361
|
}
|
|
362
|
-
const $
|
|
362
|
+
const $bed37377ec7a3a9e$var$cellFocus = {
|
|
363
363
|
outlineStyle: {
|
|
364
364
|
default: 'none',
|
|
365
365
|
isFocusVisible: 'solid'
|
|
@@ -372,8 +372,8 @@ const $93ff1e08f8313b57$var$cellFocus = {
|
|
|
372
372
|
touch: "[0.46875rem]"
|
|
373
373
|
}
|
|
374
374
|
};
|
|
375
|
-
function $
|
|
376
|
-
return /*#__PURE__*/ (0, $
|
|
375
|
+
function $bed37377ec7a3a9e$var$CellFocusRing() {
|
|
376
|
+
return /*#__PURE__*/ (0, $iLVc8$reactjsxruntime.jsx)("div", {
|
|
377
377
|
role: "presentation",
|
|
378
378
|
className: function anonymous(props) {
|
|
379
379
|
let rules = " .";
|
|
@@ -402,7 +402,7 @@ function $93ff1e08f8313b57$var$CellFocusRing() {
|
|
|
402
402
|
})
|
|
403
403
|
});
|
|
404
404
|
}
|
|
405
|
-
const $
|
|
405
|
+
const $bed37377ec7a3a9e$var$columnStyles = function anonymous(props) {
|
|
406
406
|
let rules = " .";
|
|
407
407
|
rules += ' k-17zqamw';
|
|
408
408
|
rules += ' __na';
|
|
@@ -458,26 +458,26 @@ const $93ff1e08f8313b57$var$columnStyles = function anonymous(props) {
|
|
|
458
458
|
rules += ' _zb';
|
|
459
459
|
return rules;
|
|
460
460
|
};
|
|
461
|
-
function $
|
|
462
|
-
let { isHeaderRowHovered: isHeaderRowHovered } = (0, $
|
|
463
|
-
let { isQuiet: isQuiet } = (0, $
|
|
461
|
+
function $bed37377ec7a3a9e$export$816b5d811295e6bc(props) {
|
|
462
|
+
let { isHeaderRowHovered: isHeaderRowHovered } = (0, $iLVc8$react.useContext)($bed37377ec7a3a9e$var$InternalTableHeaderContext);
|
|
463
|
+
let { isQuiet: isQuiet } = (0, $iLVc8$react.useContext)($bed37377ec7a3a9e$var$InternalTableContext);
|
|
464
464
|
let { allowsResizing: allowsResizing, children: children, align: align = 'start' } = props;
|
|
465
465
|
let isColumnResizable = allowsResizing;
|
|
466
|
-
return /*#__PURE__*/ (0, $
|
|
466
|
+
return /*#__PURE__*/ (0, $iLVc8$reactjsxruntime.jsx)((0, $iLVc8$reactariacomponents.Column), {
|
|
467
467
|
...props,
|
|
468
468
|
style: {
|
|
469
469
|
borderInlineEndColor: 'transparent'
|
|
470
470
|
},
|
|
471
|
-
className: (renderProps)=>$
|
|
471
|
+
className: (renderProps)=>$bed37377ec7a3a9e$var$columnStyles({
|
|
472
472
|
...renderProps,
|
|
473
473
|
isColumnResizable: isColumnResizable,
|
|
474
474
|
align: align,
|
|
475
475
|
isQuiet: isQuiet
|
|
476
476
|
}),
|
|
477
|
-
children: ({ allowsSorting: allowsSorting, sortDirection: sortDirection, isFocusVisible: isFocusVisible, sort: sort, startResize: startResize, isHovered: isHovered })=>/*#__PURE__*/ (0, $
|
|
477
|
+
children: ({ allowsSorting: allowsSorting, sortDirection: sortDirection, isFocusVisible: isFocusVisible, sort: sort, startResize: startResize, isHovered: isHovered })=>/*#__PURE__*/ (0, $iLVc8$reactjsxruntime.jsxs)((0, $iLVc8$reactjsxruntime.Fragment), {
|
|
478
478
|
children: [
|
|
479
|
-
isFocusVisible && /*#__PURE__*/ (0, $
|
|
480
|
-
isColumnResizable ? /*#__PURE__*/ (0, $
|
|
479
|
+
isFocusVisible && /*#__PURE__*/ (0, $iLVc8$reactjsxruntime.jsx)($bed37377ec7a3a9e$var$CellFocusRing, {}),
|
|
480
|
+
isColumnResizable ? /*#__PURE__*/ (0, $iLVc8$reactjsxruntime.jsx)($bed37377ec7a3a9e$var$ResizableColumnContents, {
|
|
481
481
|
allowsSorting: allowsSorting,
|
|
482
482
|
sortDirection: sortDirection,
|
|
483
483
|
sort: sort,
|
|
@@ -485,7 +485,7 @@ function $93ff1e08f8313b57$export$816b5d811295e6bc(props) {
|
|
|
485
485
|
isHovered: isHeaderRowHovered || isHovered,
|
|
486
486
|
align: align,
|
|
487
487
|
children: children
|
|
488
|
-
}) : /*#__PURE__*/ (0, $
|
|
488
|
+
}) : /*#__PURE__*/ (0, $iLVc8$reactjsxruntime.jsx)($bed37377ec7a3a9e$var$ColumnContents, {
|
|
489
489
|
allowsSorting: allowsSorting,
|
|
490
490
|
sortDirection: sortDirection,
|
|
491
491
|
children: children
|
|
@@ -494,8 +494,8 @@ function $93ff1e08f8313b57$export$816b5d811295e6bc(props) {
|
|
|
494
494
|
})
|
|
495
495
|
});
|
|
496
496
|
}
|
|
497
|
-
const $
|
|
498
|
-
const $
|
|
497
|
+
const $bed37377ec7a3a9e$var$columnContentWrapper = " . qa qba _Zd _1c l4";
|
|
498
|
+
const $bed37377ec7a3a9e$var$sortIcon = function anonymous(props) {
|
|
499
499
|
let rules = " .";
|
|
500
500
|
rules += ' l-1wikn8b';
|
|
501
501
|
rules += ' k-1wikn8b';
|
|
@@ -509,30 +509,30 @@ const $93ff1e08f8313b57$var$sortIcon = function anonymous(props) {
|
|
|
509
509
|
rules += ' -rwx0fg_e-b';
|
|
510
510
|
return rules;
|
|
511
511
|
};
|
|
512
|
-
function $
|
|
512
|
+
function $bed37377ec7a3a9e$var$ColumnContents(props) {
|
|
513
513
|
let { allowsSorting: allowsSorting, sortDirection: sortDirection, children: children } = props;
|
|
514
|
-
return /*#__PURE__*/ (0, $
|
|
515
|
-
className: $
|
|
514
|
+
return /*#__PURE__*/ (0, $iLVc8$reactjsxruntime.jsxs)("div", {
|
|
515
|
+
className: $bed37377ec7a3a9e$var$columnContentWrapper,
|
|
516
516
|
children: [
|
|
517
|
-
allowsSorting && /*#__PURE__*/ (0, $
|
|
517
|
+
allowsSorting && /*#__PURE__*/ (0, $iLVc8$reactjsxruntime.jsx)((0, $iLVc8$reactariacomponents.Provider), {
|
|
518
518
|
values: [
|
|
519
519
|
[
|
|
520
520
|
(0, $bde97c91243ed164$exports.IconContext),
|
|
521
521
|
{
|
|
522
|
-
styles: $
|
|
522
|
+
styles: $bed37377ec7a3a9e$var$sortIcon({})
|
|
523
523
|
}
|
|
524
524
|
]
|
|
525
525
|
],
|
|
526
|
-
children: sortDirection != null && (sortDirection === 'ascending' ? /*#__PURE__*/ (0, $
|
|
526
|
+
children: sortDirection != null && (sortDirection === 'ascending' ? /*#__PURE__*/ (0, $iLVc8$reactjsxruntime.jsx)((0, $2197830b90e71c31$exports.default), {}) : /*#__PURE__*/ (0, $iLVc8$reactjsxruntime.jsx)((0, $22bf2407c3628a21$exports.default), {}))
|
|
527
527
|
}),
|
|
528
|
-
/*#__PURE__*/ (0, $
|
|
528
|
+
/*#__PURE__*/ (0, $iLVc8$reactjsxruntime.jsx)("span", {
|
|
529
529
|
className: " . __vb __wb _ma _pb l4",
|
|
530
530
|
children: children
|
|
531
531
|
})
|
|
532
532
|
]
|
|
533
533
|
});
|
|
534
534
|
}
|
|
535
|
-
const $
|
|
535
|
+
const $bed37377ec7a3a9e$var$resizableMenuButtonWrapper = function anonymous(props) {
|
|
536
536
|
let rules = " .";
|
|
537
537
|
if (props.isFocusVisible) rules += ' _Lb';
|
|
538
538
|
else rules += ' _La';
|
|
@@ -587,7 +587,7 @@ const $93ff1e08f8313b57$var$resizableMenuButtonWrapper = function anonymous(prop
|
|
|
587
587
|
rules += ' _ed';
|
|
588
588
|
return rules;
|
|
589
589
|
};
|
|
590
|
-
const $
|
|
590
|
+
const $bed37377ec7a3a9e$var$resizerHandleContainer = function anonymous(props) {
|
|
591
591
|
let rules = " .";
|
|
592
592
|
if (props.isHovered) rules += ' _Za';
|
|
593
593
|
else if (props.isResizing) rules += ' _Za';
|
|
@@ -607,7 +607,7 @@ const $93ff1e08f8313b57$var$resizerHandleContainer = function anonymous(props) {
|
|
|
607
607
|
rules += ' -_1m7qh0o_d-x';
|
|
608
608
|
return rules;
|
|
609
609
|
};
|
|
610
|
-
const $
|
|
610
|
+
const $bed37377ec7a3a9e$var$resizerHandle = function anonymous(props) {
|
|
611
611
|
let rules = " .";
|
|
612
612
|
if (props.isResizing) rules += ' ba_____z';
|
|
613
613
|
else if (props.isFocusVisible) rules += ' ba_____z';
|
|
@@ -631,13 +631,13 @@ const $93ff1e08f8313b57$var$resizerHandle = function anonymous(props) {
|
|
|
631
631
|
rules += ' V-6njx2e';
|
|
632
632
|
return rules;
|
|
633
633
|
};
|
|
634
|
-
const $
|
|
635
|
-
const $
|
|
636
|
-
const $
|
|
637
|
-
function $
|
|
634
|
+
const $bed37377ec7a3a9e$var$columnHeaderText = " . __vb __wb _ma _pb q-1wikn8b _9-3t1x _8-3t1y hF";
|
|
635
|
+
const $bed37377ec7a3a9e$var$chevronIcon = " . R-3hn0u yG ybH q-1wikn8b _8-3t1x -rwx0fg_e-b";
|
|
636
|
+
const $bed37377ec7a3a9e$var$nubbin = " . Ua Xa V-avx9c1 Vb-15azsa3 l-1wikn8b k-1wikn8b e-1m7qh0o ea_____U -rwx0fg_e-x -rwx0fg_e-a_____V";
|
|
637
|
+
function $bed37377ec7a3a9e$var$ResizableColumnContents(props) {
|
|
638
638
|
let { allowsSorting: allowsSorting, sortDirection: sortDirection, sort: sort, startResize: startResize, children: children, isHovered: isHovered, align: align } = props;
|
|
639
|
-
let { setIsInResizeMode: setIsInResizeMode, isInResizeMode: isInResizeMode } = (0, $
|
|
640
|
-
let stringFormatter = (0, $
|
|
639
|
+
let { setIsInResizeMode: setIsInResizeMode, isInResizeMode: isInResizeMode } = (0, $iLVc8$react.useContext)($bed37377ec7a3a9e$var$InternalTableContext);
|
|
640
|
+
let stringFormatter = (0, $iLVc8$reactariai18n.useLocalizedStringFormatter)((0, ($parcel$interopDefault($4526404114e78c80$exports))), '@react-spectrum/s2');
|
|
641
641
|
const onMenuSelect = (key)=>{
|
|
642
642
|
switch(key){
|
|
643
643
|
case 'sort-asc':
|
|
@@ -652,7 +652,7 @@ function $93ff1e08f8313b57$var$ResizableColumnContents(props) {
|
|
|
652
652
|
break;
|
|
653
653
|
}
|
|
654
654
|
};
|
|
655
|
-
let items = (0, $
|
|
655
|
+
let items = (0, $iLVc8$react.useMemo)(()=>{
|
|
656
656
|
let options = [
|
|
657
657
|
{
|
|
658
658
|
label: stringFormatter.format('table.resizeColumn'),
|
|
@@ -682,70 +682,70 @@ function $93ff1e08f8313b57$var$ResizableColumnContents(props) {
|
|
|
682
682
|
buttonAlignment = 'end';
|
|
683
683
|
menuAlign = 'end';
|
|
684
684
|
}
|
|
685
|
-
return /*#__PURE__*/ (0, $
|
|
685
|
+
return /*#__PURE__*/ (0, $iLVc8$reactjsxruntime.jsxs)((0, $iLVc8$reactjsxruntime.Fragment), {
|
|
686
686
|
children: [
|
|
687
|
-
/*#__PURE__*/ (0, $
|
|
687
|
+
/*#__PURE__*/ (0, $iLVc8$reactjsxruntime.jsxs)((0, $e741ea6b88ce4866$exports.MenuTrigger), {
|
|
688
688
|
align: menuAlign,
|
|
689
689
|
children: [
|
|
690
|
-
/*#__PURE__*/ (0, $
|
|
691
|
-
className: (renderProps)=>$
|
|
690
|
+
/*#__PURE__*/ (0, $iLVc8$reactjsxruntime.jsxs)((0, $iLVc8$reactariacomponents.Button), {
|
|
691
|
+
className: (renderProps)=>$bed37377ec7a3a9e$var$resizableMenuButtonWrapper({
|
|
692
692
|
...renderProps,
|
|
693
693
|
align: buttonAlignment
|
|
694
694
|
}),
|
|
695
695
|
children: [
|
|
696
|
-
allowsSorting && /*#__PURE__*/ (0, $
|
|
696
|
+
allowsSorting && /*#__PURE__*/ (0, $iLVc8$reactjsxruntime.jsx)((0, $iLVc8$reactariacomponents.Provider), {
|
|
697
697
|
values: [
|
|
698
698
|
[
|
|
699
699
|
(0, $bde97c91243ed164$exports.IconContext),
|
|
700
700
|
{
|
|
701
|
-
styles: $
|
|
701
|
+
styles: $bed37377ec7a3a9e$var$sortIcon({
|
|
702
702
|
isButton: true
|
|
703
703
|
})
|
|
704
704
|
}
|
|
705
705
|
]
|
|
706
706
|
],
|
|
707
|
-
children: sortDirection != null && (sortDirection === 'ascending' ? /*#__PURE__*/ (0, $
|
|
707
|
+
children: sortDirection != null && (sortDirection === 'ascending' ? /*#__PURE__*/ (0, $iLVc8$reactjsxruntime.jsx)((0, $2197830b90e71c31$exports.default), {}) : /*#__PURE__*/ (0, $iLVc8$reactjsxruntime.jsx)((0, $22bf2407c3628a21$exports.default), {}))
|
|
708
708
|
}),
|
|
709
|
-
/*#__PURE__*/ (0, $
|
|
710
|
-
className: $
|
|
709
|
+
/*#__PURE__*/ (0, $iLVc8$reactjsxruntime.jsx)("div", {
|
|
710
|
+
className: $bed37377ec7a3a9e$var$columnHeaderText,
|
|
711
711
|
children: children
|
|
712
712
|
}),
|
|
713
|
-
/*#__PURE__*/ (0, $
|
|
713
|
+
/*#__PURE__*/ (0, $iLVc8$reactjsxruntime.jsx)((0, $1df9f1c9262ce5df$exports.default), {
|
|
714
714
|
size: "M",
|
|
715
|
-
className: $
|
|
715
|
+
className: $bed37377ec7a3a9e$var$chevronIcon
|
|
716
716
|
})
|
|
717
717
|
]
|
|
718
718
|
}),
|
|
719
|
-
/*#__PURE__*/ (0, $
|
|
719
|
+
/*#__PURE__*/ (0, $iLVc8$reactjsxruntime.jsx)((0, $e741ea6b88ce4866$exports.Menu), {
|
|
720
720
|
onAction: onMenuSelect,
|
|
721
721
|
items: items,
|
|
722
722
|
styles: " . qI qbJ",
|
|
723
|
-
children: (item)=>/*#__PURE__*/ (0, $
|
|
723
|
+
children: (item)=>/*#__PURE__*/ (0, $iLVc8$reactjsxruntime.jsx)((0, $e741ea6b88ce4866$exports.MenuItem), {
|
|
724
724
|
children: item?.label
|
|
725
725
|
})
|
|
726
726
|
})
|
|
727
727
|
]
|
|
728
728
|
}),
|
|
729
|
-
/*#__PURE__*/ (0, $
|
|
729
|
+
/*#__PURE__*/ (0, $iLVc8$reactjsxruntime.jsx)("div", {
|
|
730
730
|
"data-react-aria-prevent-focus": "true",
|
|
731
|
-
children: /*#__PURE__*/ (0, $
|
|
731
|
+
children: /*#__PURE__*/ (0, $iLVc8$reactjsxruntime.jsx)((0, $iLVc8$reactariacomponents.ColumnResizer), {
|
|
732
732
|
"data-react-aria-prevent-focus": "true",
|
|
733
|
-
className: ({ resizableDirection: resizableDirection, isResizing: isResizing })=>$
|
|
733
|
+
className: ({ resizableDirection: resizableDirection, isResizing: isResizing })=>$bed37377ec7a3a9e$var$resizerHandleContainer({
|
|
734
734
|
resizableDirection: resizableDirection,
|
|
735
735
|
isResizing: isResizing,
|
|
736
736
|
isHovered: isInResizeMode || isHovered
|
|
737
737
|
}),
|
|
738
|
-
children: ({ isFocusVisible: isFocusVisible, isResizing: isResizing })=>/*#__PURE__*/ (0, $
|
|
738
|
+
children: ({ isFocusVisible: isFocusVisible, isResizing: isResizing })=>/*#__PURE__*/ (0, $iLVc8$reactjsxruntime.jsxs)((0, $iLVc8$reactjsxruntime.Fragment), {
|
|
739
739
|
children: [
|
|
740
|
-
/*#__PURE__*/ (0, $
|
|
740
|
+
/*#__PURE__*/ (0, $iLVc8$reactjsxruntime.jsx)($bed37377ec7a3a9e$var$ResizerIndicator, {
|
|
741
741
|
isInResizeMode: isInResizeMode,
|
|
742
742
|
isFocusVisible: isFocusVisible,
|
|
743
743
|
isHovered: isHovered,
|
|
744
744
|
isResizing: isResizing
|
|
745
745
|
}),
|
|
746
|
-
(isFocusVisible || isInResizeMode) && isResizing && /*#__PURE__*/ (0, $
|
|
747
|
-
className: $
|
|
748
|
-
children: /*#__PURE__*/ (0, $
|
|
746
|
+
(isFocusVisible || isInResizeMode) && isResizing && /*#__PURE__*/ (0, $iLVc8$reactjsxruntime.jsx)("div", {
|
|
747
|
+
className: $bed37377ec7a3a9e$var$nubbin,
|
|
748
|
+
children: /*#__PURE__*/ (0, $iLVc8$reactjsxruntime.jsx)((0, $d256e21c80839377$exports.default), {})
|
|
749
749
|
})
|
|
750
750
|
]
|
|
751
751
|
})
|
|
@@ -754,18 +754,18 @@ function $93ff1e08f8313b57$var$ResizableColumnContents(props) {
|
|
|
754
754
|
]
|
|
755
755
|
});
|
|
756
756
|
}
|
|
757
|
-
function $
|
|
758
|
-
return /*#__PURE__*/ (0, $
|
|
759
|
-
className: $
|
|
757
|
+
function $bed37377ec7a3a9e$var$ResizerIndicator({ isFocusVisible: isFocusVisible, isHovered: isHovered, isResizing: isResizing, isInResizeMode: isInResizeMode }) {
|
|
758
|
+
return /*#__PURE__*/ (0, $iLVc8$reactjsxruntime.jsx)("div", {
|
|
759
|
+
className: $bed37377ec7a3a9e$var$resizerHandle({
|
|
760
760
|
isFocusVisible: isFocusVisible,
|
|
761
761
|
isHovered: isHovered || isInResizeMode,
|
|
762
762
|
isResizing: isResizing
|
|
763
763
|
})
|
|
764
764
|
});
|
|
765
765
|
}
|
|
766
|
-
const $
|
|
767
|
-
const $
|
|
768
|
-
const $
|
|
766
|
+
const $bed37377ec7a3a9e$var$tableHeader = " . k4 l4 bf A-yj899n";
|
|
767
|
+
const $bed37377ec7a3a9e$var$selectAllCheckbox = " . yf";
|
|
768
|
+
const $bed37377ec7a3a9e$var$selectAllCheckboxColumn = function anonymous(props) {
|
|
769
769
|
let rules = " .";
|
|
770
770
|
rules += ' Ea';
|
|
771
771
|
rules += ' Fa';
|
|
@@ -787,48 +787,48 @@ const $93ff1e08f8313b57$var$selectAllCheckboxColumn = function anonymous(props)
|
|
|
787
787
|
rules += ' bf';
|
|
788
788
|
return rules;
|
|
789
789
|
};
|
|
790
|
-
let $
|
|
790
|
+
let $bed37377ec7a3a9e$var$InternalTableHeaderContext = /*#__PURE__*/ (0, $iLVc8$react.createContext)({
|
|
791
791
|
isHeaderRowHovered: false
|
|
792
792
|
});
|
|
793
|
-
function $
|
|
793
|
+
function $bed37377ec7a3a9e$export$f850895b287ef28e({ columns: columns, children: children }) {
|
|
794
794
|
let scale = (0, $ee7b4c497f520c08$exports.useScale)();
|
|
795
|
-
let { selectionBehavior: selectionBehavior, selectionMode: selectionMode } = (0, $
|
|
796
|
-
let { isQuiet: isQuiet } = (0, $
|
|
797
|
-
let [isHeaderRowHovered, setHeaderRowHovered] = (0, $
|
|
798
|
-
return /*#__PURE__*/ (0, $
|
|
795
|
+
let { selectionBehavior: selectionBehavior, selectionMode: selectionMode } = (0, $iLVc8$reactariacomponents.useTableOptions)();
|
|
796
|
+
let { isQuiet: isQuiet } = (0, $iLVc8$react.useContext)($bed37377ec7a3a9e$var$InternalTableContext);
|
|
797
|
+
let [isHeaderRowHovered, setHeaderRowHovered] = (0, $iLVc8$react.useState)(false);
|
|
798
|
+
return /*#__PURE__*/ (0, $iLVc8$reactjsxruntime.jsx)($bed37377ec7a3a9e$var$InternalTableHeaderContext.Provider, {
|
|
799
799
|
value: {
|
|
800
800
|
isHeaderRowHovered: isHeaderRowHovered
|
|
801
801
|
},
|
|
802
|
-
children: /*#__PURE__*/ (0, $
|
|
802
|
+
children: /*#__PURE__*/ (0, $iLVc8$reactjsxruntime.jsxs)((0, $iLVc8$reactariacomponents.TableHeader), {
|
|
803
803
|
onHoverChange: setHeaderRowHovered,
|
|
804
|
-
className: $
|
|
804
|
+
className: $bed37377ec7a3a9e$var$tableHeader,
|
|
805
805
|
children: [
|
|
806
806
|
selectionBehavior === 'toggle' && // Also isSticky prop is applied just for the layout, will decide what the RAC api should be later
|
|
807
807
|
// @ts-ignore
|
|
808
|
-
/*#__PURE__*/ (0, $
|
|
808
|
+
/*#__PURE__*/ (0, $iLVc8$reactjsxruntime.jsx)((0, $iLVc8$reactariacomponents.Column), {
|
|
809
809
|
isSticky: true,
|
|
810
810
|
width: scale === 'medium' ? 40 : 52,
|
|
811
811
|
minWidth: scale === 'medium' ? 40 : 52,
|
|
812
|
-
className: $
|
|
812
|
+
className: $bed37377ec7a3a9e$var$selectAllCheckboxColumn({
|
|
813
813
|
isQuiet: isQuiet
|
|
814
814
|
}),
|
|
815
|
-
children: ({ isFocusVisible: isFocusVisible })=>/*#__PURE__*/ (0, $
|
|
815
|
+
children: ({ isFocusVisible: isFocusVisible })=>/*#__PURE__*/ (0, $iLVc8$reactjsxruntime.jsxs)((0, $iLVc8$reactjsxruntime.Fragment), {
|
|
816
816
|
children: [
|
|
817
|
-
selectionMode === 'single' && /*#__PURE__*/ (0, $
|
|
817
|
+
selectionMode === 'single' && /*#__PURE__*/ (0, $iLVc8$reactjsxruntime.jsxs)((0, $iLVc8$reactjsxruntime.Fragment), {
|
|
818
818
|
children: [
|
|
819
|
-
isFocusVisible && /*#__PURE__*/ (0, $
|
|
820
|
-
/*#__PURE__*/ (0, $
|
|
819
|
+
isFocusVisible && /*#__PURE__*/ (0, $iLVc8$reactjsxruntime.jsx)($bed37377ec7a3a9e$var$CellFocusRing, {}),
|
|
820
|
+
/*#__PURE__*/ (0, $iLVc8$reactjsxruntime.jsx)($bed37377ec7a3a9e$var$VisuallyHiddenSelectAllLabel, {})
|
|
821
821
|
]
|
|
822
822
|
}),
|
|
823
|
-
selectionMode === 'multiple' && /*#__PURE__*/ (0, $
|
|
823
|
+
selectionMode === 'multiple' && /*#__PURE__*/ (0, $iLVc8$reactjsxruntime.jsx)((0, $af04e099a53d3e85$exports.Checkbox), {
|
|
824
824
|
isEmphasized: true,
|
|
825
|
-
styles: $
|
|
825
|
+
styles: $bed37377ec7a3a9e$var$selectAllCheckbox,
|
|
826
826
|
slot: "selection"
|
|
827
827
|
})
|
|
828
828
|
]
|
|
829
829
|
})
|
|
830
830
|
}),
|
|
831
|
-
/*#__PURE__*/ (0, $
|
|
831
|
+
/*#__PURE__*/ (0, $iLVc8$reactjsxruntime.jsx)((0, $iLVc8$reactariacomponents.Collection), {
|
|
832
832
|
items: columns,
|
|
833
833
|
children: children
|
|
834
834
|
})
|
|
@@ -836,13 +836,13 @@ function $93ff1e08f8313b57$export$f850895b287ef28e({ columns: columns, children:
|
|
|
836
836
|
})
|
|
837
837
|
});
|
|
838
838
|
}
|
|
839
|
-
function $
|
|
840
|
-
let checkboxProps = (0, $
|
|
841
|
-
return /*#__PURE__*/ (0, $
|
|
839
|
+
function $bed37377ec7a3a9e$var$VisuallyHiddenSelectAllLabel() {
|
|
840
|
+
let checkboxProps = (0, $iLVc8$reactariacomponents.useSlottedContext)((0, $iLVc8$reactariacomponents.CheckboxContext), 'selection');
|
|
841
|
+
return /*#__PURE__*/ (0, $iLVc8$reactjsxruntime.jsx)((0, $iLVc8$reactaria.VisuallyHidden), {
|
|
842
842
|
children: checkboxProps?.['aria-label']
|
|
843
843
|
});
|
|
844
844
|
}
|
|
845
|
-
const $
|
|
845
|
+
const $bed37377ec7a3a9e$var$commonCellStyles = {
|
|
846
846
|
borderColor: 'transparent',
|
|
847
847
|
borderBottomWidth: 1,
|
|
848
848
|
borderTopWidth: 0,
|
|
@@ -856,7 +856,7 @@ const $93ff1e08f8313b57$var$commonCellStyles = {
|
|
|
856
856
|
outlineStyle: 'none',
|
|
857
857
|
paddingX: 16 // table-edge-to-content
|
|
858
858
|
};
|
|
859
|
-
const $
|
|
859
|
+
const $bed37377ec7a3a9e$var$cell = function anonymous(props) {
|
|
860
860
|
let rules = " .";
|
|
861
861
|
rules += ' ca_____v';
|
|
862
862
|
rules += ' ci';
|
|
@@ -913,11 +913,11 @@ const $93ff1e08f8313b57$var$cell = function anonymous(props) {
|
|
|
913
913
|
rules += ' -_375tp1_v-b';
|
|
914
914
|
return rules;
|
|
915
915
|
};
|
|
916
|
-
const $
|
|
916
|
+
const $bed37377ec7a3a9e$var$stickyCell = {
|
|
917
917
|
backgroundColor: 'gray-25'
|
|
918
918
|
};
|
|
919
|
-
const $
|
|
920
|
-
const $
|
|
919
|
+
const $bed37377ec7a3a9e$var$checkboxCellStyle = " . ca va ua sa ta wa Uc an aa_____x _La Cf Df b-19jpv4m _0b k-1xrzxd1";
|
|
920
|
+
const $bed37377ec7a3a9e$var$cellContent = function anonymous(props) {
|
|
921
921
|
let rules = " .";
|
|
922
922
|
rules += ' __vb';
|
|
923
923
|
rules += ' __wb';
|
|
@@ -949,26 +949,26 @@ const $93ff1e08f8313b57$var$cellContent = function anonymous(props) {
|
|
|
949
949
|
else rules += ' ba';
|
|
950
950
|
return rules;
|
|
951
951
|
};
|
|
952
|
-
function $
|
|
952
|
+
function $bed37377ec7a3a9e$export$f6f0c3fe4ec306ea(props) {
|
|
953
953
|
let { children: children, isSticky: isSticky, showDivider: showDivider = false, align: align, textValue: textValue, ...otherProps } = props;
|
|
954
|
-
let tableVisualOptions = (0, $
|
|
954
|
+
let tableVisualOptions = (0, $iLVc8$react.useContext)($bed37377ec7a3a9e$var$InternalTableContext);
|
|
955
955
|
textValue ||= typeof children === 'string' ? children : undefined;
|
|
956
|
-
return /*#__PURE__*/ (0, $
|
|
956
|
+
return /*#__PURE__*/ (0, $iLVc8$reactjsxruntime.jsx)((0, $iLVc8$reactariacomponents.Cell), {
|
|
957
957
|
// Also isSticky prop is applied just for the layout, will decide what the RAC api should be later
|
|
958
958
|
// @ts-ignore
|
|
959
959
|
isSticky: isSticky,
|
|
960
|
-
className: (renderProps)=>$
|
|
960
|
+
className: (renderProps)=>$bed37377ec7a3a9e$var$cell({
|
|
961
961
|
...renderProps,
|
|
962
962
|
...tableVisualOptions,
|
|
963
963
|
isDivider: showDivider
|
|
964
964
|
}),
|
|
965
965
|
textValue: textValue,
|
|
966
966
|
...otherProps,
|
|
967
|
-
children: ({ isFocusVisible: isFocusVisible })=>/*#__PURE__*/ (0, $
|
|
967
|
+
children: ({ isFocusVisible: isFocusVisible })=>/*#__PURE__*/ (0, $iLVc8$reactjsxruntime.jsxs)((0, $iLVc8$reactjsxruntime.Fragment), {
|
|
968
968
|
children: [
|
|
969
|
-
isFocusVisible && /*#__PURE__*/ (0, $
|
|
970
|
-
/*#__PURE__*/ (0, $
|
|
971
|
-
className: $
|
|
969
|
+
isFocusVisible && /*#__PURE__*/ (0, $iLVc8$reactjsxruntime.jsx)($bed37377ec7a3a9e$var$CellFocusRing, {}),
|
|
970
|
+
/*#__PURE__*/ (0, $iLVc8$reactjsxruntime.jsx)("span", {
|
|
971
|
+
className: $bed37377ec7a3a9e$var$cellContent({
|
|
972
972
|
...tableVisualOptions,
|
|
973
973
|
isSticky: isSticky,
|
|
974
974
|
align: align || 'start'
|
|
@@ -980,9 +980,9 @@ function $93ff1e08f8313b57$export$f6f0c3fe4ec306ea(props) {
|
|
|
980
980
|
});
|
|
981
981
|
}
|
|
982
982
|
// Use color-mix instead of transparency so sticky cells work correctly.
|
|
983
|
-
const $
|
|
984
|
-
const $
|
|
985
|
-
const $
|
|
983
|
+
const $bed37377ec7a3a9e$var$selectedBackground = "[light-dark(color-mix(in srgb, light-dark(rgb(255, 255, 255), rgb(17, 17, 17)), light-dark(rgb(59, 99, 251), rgb(86, 129, 255)) 10%), color-mix(in srgb, light-dark(rgb(255, 255, 255), rgb(17, 17, 17)), light-dark(rgb(93, 137, 255), rgb(52, 91, 248)) 10%))]";
|
|
984
|
+
const $bed37377ec7a3a9e$var$selectedActiveBackground = "[light-dark(color-mix(in srgb, light-dark(rgb(255, 255, 255), rgb(17, 17, 17)), light-dark(rgb(59, 99, 251), rgb(86, 129, 255)) 15%), color-mix(in srgb, light-dark(rgb(255, 255, 255), rgb(17, 17, 17)), light-dark(rgb(93, 137, 255), rgb(52, 91, 248)) 15%))]";
|
|
985
|
+
const $bed37377ec7a3a9e$var$rowBackgroundColor = {
|
|
986
986
|
default: {
|
|
987
987
|
default: 'gray-25',
|
|
988
988
|
isQuiet: 'transparent'
|
|
@@ -991,16 +991,16 @@ const $93ff1e08f8313b57$var$rowBackgroundColor = {
|
|
|
991
991
|
isHovered: "[color-mix(in srgb, light-dark(rgb(255, 255, 255), rgb(17, 17, 17)), light-dark(rgb(19, 19, 19), rgb(242, 242, 242)) 7%)]",
|
|
992
992
|
isPressed: "[color-mix(in srgb, light-dark(rgb(255, 255, 255), rgb(17, 17, 17)), light-dark(rgb(19, 19, 19), rgb(242, 242, 242)) 10%)]",
|
|
993
993
|
isSelected: {
|
|
994
|
-
default: $
|
|
995
|
-
isFocusVisibleWithin: $
|
|
996
|
-
isHovered: $
|
|
997
|
-
isPressed: $
|
|
994
|
+
default: $bed37377ec7a3a9e$var$selectedBackground,
|
|
995
|
+
isFocusVisibleWithin: $bed37377ec7a3a9e$var$selectedActiveBackground,
|
|
996
|
+
isHovered: $bed37377ec7a3a9e$var$selectedActiveBackground,
|
|
997
|
+
isPressed: $bed37377ec7a3a9e$var$selectedActiveBackground // table-selected-row-background-color, opacity /15
|
|
998
998
|
},
|
|
999
999
|
forcedColors: {
|
|
1000
1000
|
default: 'Background'
|
|
1001
1001
|
}
|
|
1002
1002
|
};
|
|
1003
|
-
const $
|
|
1003
|
+
const $bed37377ec7a3a9e$var$row = function anonymous(props) {
|
|
1004
1004
|
let rules = " .";
|
|
1005
1005
|
rules += ' k4';
|
|
1006
1006
|
rules += ' Uc';
|
|
@@ -1030,26 +1030,26 @@ const $93ff1e08f8313b57$var$row = function anonymous(props) {
|
|
|
1030
1030
|
rules += ' _zb';
|
|
1031
1031
|
return rules;
|
|
1032
1032
|
};
|
|
1033
|
-
function $
|
|
1034
|
-
let { selectionBehavior: selectionBehavior, selectionMode: selectionMode } = (0, $
|
|
1035
|
-
let tableVisualOptions = (0, $
|
|
1036
|
-
return /*#__PURE__*/ (0, $
|
|
1033
|
+
function $bed37377ec7a3a9e$export$b59bdbef9ce70de2({ id: id, columns: columns, children: children, ...otherProps }) {
|
|
1034
|
+
let { selectionBehavior: selectionBehavior, selectionMode: selectionMode } = (0, $iLVc8$reactariacomponents.useTableOptions)();
|
|
1035
|
+
let tableVisualOptions = (0, $iLVc8$react.useContext)($bed37377ec7a3a9e$var$InternalTableContext);
|
|
1036
|
+
return /*#__PURE__*/ (0, $iLVc8$reactjsxruntime.jsxs)((0, $iLVc8$reactariacomponents.Row), {
|
|
1037
1037
|
id: id,
|
|
1038
|
-
className: (renderProps)=>$
|
|
1038
|
+
className: (renderProps)=>$bed37377ec7a3a9e$var$row({
|
|
1039
1039
|
...renderProps,
|
|
1040
1040
|
...tableVisualOptions
|
|
1041
1041
|
}) + (renderProps.isFocusVisible && " -zwoa9h"),
|
|
1042
1042
|
...otherProps,
|
|
1043
1043
|
children: [
|
|
1044
|
-
selectionMode !== 'none' && selectionBehavior === 'toggle' && /*#__PURE__*/ (0, $
|
|
1044
|
+
selectionMode !== 'none' && selectionBehavior === 'toggle' && /*#__PURE__*/ (0, $iLVc8$reactjsxruntime.jsx)($bed37377ec7a3a9e$export$f6f0c3fe4ec306ea, {
|
|
1045
1045
|
isSticky: true,
|
|
1046
|
-
className: $
|
|
1047
|
-
children: /*#__PURE__*/ (0, $
|
|
1046
|
+
className: $bed37377ec7a3a9e$var$checkboxCellStyle,
|
|
1047
|
+
children: /*#__PURE__*/ (0, $iLVc8$reactjsxruntime.jsx)((0, $af04e099a53d3e85$exports.Checkbox), {
|
|
1048
1048
|
isEmphasized: true,
|
|
1049
1049
|
slot: "selection"
|
|
1050
1050
|
})
|
|
1051
1051
|
}),
|
|
1052
|
-
/*#__PURE__*/ (0, $
|
|
1052
|
+
/*#__PURE__*/ (0, $iLVc8$reactjsxruntime.jsx)((0, $iLVc8$reactariacomponents.Collection), {
|
|
1053
1053
|
items: columns,
|
|
1054
1054
|
children: children
|
|
1055
1055
|
})
|
|
@@ -1058,7 +1058,7 @@ function $93ff1e08f8313b57$export$b59bdbef9ce70de2({ id: id, columns: columns, c
|
|
|
1058
1058
|
}
|
|
1059
1059
|
/**
|
|
1060
1060
|
* Tables are containers for displaying information. They allow users to quickly scan, sort, compare, and take action on large amounts of data.
|
|
1061
|
-
*/ const $
|
|
1061
|
+
*/ const $bed37377ec7a3a9e$export$b3c27e869d856b7 = /*#__PURE__*/ (0, $iLVc8$react.forwardRef)($bed37377ec7a3a9e$var$TableView);
|
|
1062
1062
|
|
|
1063
1063
|
|
|
1064
|
-
//# sourceMappingURL=
|
|
1064
|
+
//# sourceMappingURL=TableView.cjs.map
|