@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,8 +1,8 @@
|
|
|
1
|
-
import "./
|
|
1
|
+
import "./TableView.css";
|
|
2
2
|
import {Checkbox as $9b405e0f8095dce0$export$48513f6b9f8ce62d} from "./Checkbox.mjs";
|
|
3
3
|
import $4b69f02ec06b9226$export$2e2bcd8739ae039 from "./Chevron.mjs";
|
|
4
4
|
import {IconContext as $ac8c32e6775ddd1f$export$a49f528ae1a4d0ed} from "../icons/Icon.mjs";
|
|
5
|
-
import $
|
|
5
|
+
import $auVFN$intlStringsmjs from "./intlStrings.mjs";
|
|
6
6
|
import {Menu as $13afb0ea5f0ed767$export$d9b273488cd8ce6f, MenuItem as $13afb0ea5f0ed767$export$2ce376c2cc3355c8, MenuTrigger as $13afb0ea5f0ed767$export$27d2ad3c5815583e} from "./Menu.mjs";
|
|
7
7
|
import {mergeStyles as $feb886035e0d4633$export$e618dc39ac9ad607} from "../icons/runtime.mjs";
|
|
8
8
|
import $59ff3896bbb9d00c$export$2e2bcd8739ae039 from "./MoveHorizontalCircleTableWidget.mjs";
|
|
@@ -10,14 +10,14 @@ import {ProgressCircle as $41ddd91dbbf0c389$export$c79b9d6b4cc92af7} from "./Pro
|
|
|
10
10
|
import $5a632e895c21f138$export$2e2bcd8739ae039 from "../icons/SortDown.mjs";
|
|
11
11
|
import $415c33109ddcfc45$export$2e2bcd8739ae039 from "../icons/SortUp.mjs";
|
|
12
12
|
import {useScale as $859432f3b3573fcb$export$a8d2043b2d807f4d} from "./utils.mjs";
|
|
13
|
-
import {jsx as $
|
|
14
|
-
import {UNSTABLE_TableLayout as $
|
|
15
|
-
import {createContext as $
|
|
16
|
-
import {Rect as $
|
|
17
|
-
import {useDOMRef as $
|
|
18
|
-
import {useLoadMore as $
|
|
19
|
-
import {useLocalizedStringFormatter as $
|
|
20
|
-
import {VisuallyHidden as $
|
|
13
|
+
import {jsx as $auVFN$jsx, jsxs as $auVFN$jsxs, Fragment as $auVFN$Fragment} from "react/jsx-runtime";
|
|
14
|
+
import {UNSTABLE_TableLayout as $auVFN$UNSTABLE_TableLayout, ResizableTableContainer as $auVFN$ResizableTableContainer, UNSTABLE_Virtualizer as $auVFN$UNSTABLE_Virtualizer, Table as $auVFN$Table, UNSTABLE_TableLoadingIndicator as $auVFN$UNSTABLE_TableLoadingIndicator, Collection as $auVFN$Collection, TableBody as $auVFN$TableBody, Column as $auVFN$Column, Provider as $auVFN$Provider, Button as $auVFN$Button, ColumnResizer as $auVFN$ColumnResizer, useTableOptions as $auVFN$useTableOptions, TableHeader as $auVFN$TableHeader, useSlottedContext as $auVFN$useSlottedContext, CheckboxContext as $auVFN$CheckboxContext, Cell as $auVFN$Cell, Row as $auVFN$Row} from "react-aria-components";
|
|
15
|
+
import {createContext as $auVFN$createContext, useMemo as $auVFN$useMemo, useState as $auVFN$useState, useCallback as $auVFN$useCallback, useRef as $auVFN$useRef, useContext as $auVFN$useContext, forwardRef as $auVFN$forwardRef} from "react";
|
|
16
|
+
import {Rect as $auVFN$Rect} from "@react-stately/virtualizer";
|
|
17
|
+
import {useDOMRef as $auVFN$useDOMRef} from "@react-spectrum/utils";
|
|
18
|
+
import {useLoadMore as $auVFN$useLoadMore} from "@react-aria/utils";
|
|
19
|
+
import {useLocalizedStringFormatter as $auVFN$useLocalizedStringFormatter} from "@react-aria/i18n";
|
|
20
|
+
import {VisuallyHidden as $auVFN$VisuallyHidden} from "react-aria";
|
|
21
21
|
|
|
22
22
|
|
|
23
23
|
function $parcel$interopDefault(a) {
|
|
@@ -52,9 +52,9 @@ function $parcel$interopDefault(a) {
|
|
|
52
52
|
|
|
53
53
|
|
|
54
54
|
|
|
55
|
-
let $
|
|
56
|
-
const $
|
|
57
|
-
const $
|
|
55
|
+
let $0fcd5fb617970a1d$var$InternalTableContext = /*#__PURE__*/ (0, $auVFN$createContext)({});
|
|
56
|
+
const $0fcd5fb617970a1d$var$tableWrapper = " . oa oba qa qba _Zd __Fa __R-yksgrp";
|
|
57
|
+
const $0fcd5fb617970a1d$var$table = function anonymous(props, overrides) {
|
|
58
58
|
let rules = " .";
|
|
59
59
|
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) || [];
|
|
60
60
|
rules += matches.join('');
|
|
@@ -122,11 +122,11 @@ const $d57818bede309747$var$table = function anonymous(props, overrides) {
|
|
|
122
122
|
return rules;
|
|
123
123
|
};
|
|
124
124
|
// component-height-100
|
|
125
|
-
const $
|
|
125
|
+
const $0fcd5fb617970a1d$var$DEFAULT_HEADER_HEIGHT = {
|
|
126
126
|
medium: 32,
|
|
127
127
|
large: 40
|
|
128
128
|
};
|
|
129
|
-
const $
|
|
129
|
+
const $0fcd5fb617970a1d$var$ROW_HEIGHTS = {
|
|
130
130
|
compact: {
|
|
131
131
|
medium: 32,
|
|
132
132
|
large: 40
|
|
@@ -140,7 +140,7 @@ const $d57818bede309747$var$ROW_HEIGHTS = {
|
|
|
140
140
|
large: 60
|
|
141
141
|
}
|
|
142
142
|
};
|
|
143
|
-
class $
|
|
143
|
+
class $0fcd5fb617970a1d$export$4e03bdf0174fd602 extends (0, $auVFN$UNSTABLE_TableLayout) {
|
|
144
144
|
constructor(options){
|
|
145
145
|
super({
|
|
146
146
|
...options,
|
|
@@ -176,7 +176,7 @@ class $d57818bede309747$export$4e03bdf0174fd602 extends (0, $l9ePO$UNSTABLE_Tabl
|
|
|
176
176
|
layoutInfo.allowOverflow = true;
|
|
177
177
|
// If loading or empty, we'll want the body to be sticky and centered
|
|
178
178
|
if (children?.length === 0) {
|
|
179
|
-
layoutInfo.rect = new (0, $
|
|
179
|
+
layoutInfo.rect = new (0, $auVFN$Rect)(40, 40, this.virtualizer.visibleRect.width - 80, this.virtualizer.visibleRect.height - 80);
|
|
180
180
|
layoutInfo.isSticky = true;
|
|
181
181
|
}
|
|
182
182
|
return {
|
|
@@ -203,16 +203,16 @@ class $d57818bede309747$export$4e03bdf0174fd602 extends (0, $l9ePO$UNSTABLE_Tabl
|
|
|
203
203
|
return layoutNode;
|
|
204
204
|
}
|
|
205
205
|
}
|
|
206
|
-
function $
|
|
206
|
+
function $0fcd5fb617970a1d$var$TableView(props, ref) {
|
|
207
207
|
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;
|
|
208
|
-
let domRef = (0, $
|
|
208
|
+
let domRef = (0, $auVFN$useDOMRef)(ref);
|
|
209
209
|
let scale = (0, $859432f3b3573fcb$export$a8d2043b2d807f4d)();
|
|
210
|
-
let layout = (0, $
|
|
211
|
-
return new $
|
|
212
|
-
rowHeight: overflowMode === 'wrap' ? undefined : $
|
|
213
|
-
estimatedRowHeight: overflowMode === 'wrap' ? $
|
|
210
|
+
let layout = (0, $auVFN$useMemo)(()=>{
|
|
211
|
+
return new $0fcd5fb617970a1d$export$4e03bdf0174fd602({
|
|
212
|
+
rowHeight: overflowMode === 'wrap' ? undefined : $0fcd5fb617970a1d$var$ROW_HEIGHTS[density][scale],
|
|
213
|
+
estimatedRowHeight: overflowMode === 'wrap' ? $0fcd5fb617970a1d$var$ROW_HEIGHTS[density][scale] : undefined,
|
|
214
214
|
// No need for estimated headingHeight since the headers aren't affected by overflow mode: wrap
|
|
215
|
-
headingHeight: $
|
|
215
|
+
headingHeight: $0fcd5fb617970a1d$var$DEFAULT_HEADER_HEIGHT[scale]
|
|
216
216
|
});
|
|
217
217
|
}, [
|
|
218
218
|
overflowMode,
|
|
@@ -221,20 +221,20 @@ function $d57818bede309747$var$Table(props, ref) {
|
|
|
221
221
|
]);
|
|
222
222
|
// Starts when the user selects resize from the menu, ends when resizing ends
|
|
223
223
|
// used to control the visibility of the resizer Nubbin
|
|
224
|
-
let [isInResizeMode, setIsInResizeMode] = (0, $
|
|
225
|
-
let onResizeStart = (0, $
|
|
224
|
+
let [isInResizeMode, setIsInResizeMode] = (0, $auVFN$useState)(false);
|
|
225
|
+
let onResizeStart = (0, $auVFN$useCallback)((widths)=>{
|
|
226
226
|
propsOnResizeStart?.(widths);
|
|
227
227
|
}, [
|
|
228
228
|
propsOnResizeStart
|
|
229
229
|
]);
|
|
230
|
-
let onResizeEnd = (0, $
|
|
230
|
+
let onResizeEnd = (0, $auVFN$useCallback)((widths)=>{
|
|
231
231
|
setIsInResizeMode(false);
|
|
232
232
|
propsOnResizeEnd?.(widths);
|
|
233
233
|
}, [
|
|
234
234
|
propsOnResizeEnd,
|
|
235
235
|
setIsInResizeMode
|
|
236
236
|
]);
|
|
237
|
-
let context = (0, $
|
|
237
|
+
let context = (0, $auVFN$useMemo)(()=>({
|
|
238
238
|
isQuiet: isQuiet,
|
|
239
239
|
density: density,
|
|
240
240
|
overflowMode: overflowMode,
|
|
@@ -250,35 +250,35 @@ function $d57818bede309747$var$Table(props, ref) {
|
|
|
250
250
|
setIsInResizeMode
|
|
251
251
|
]);
|
|
252
252
|
let isLoading = loadingState === 'loading' || loadingState === 'loadingMore';
|
|
253
|
-
let scrollRef = (0, $
|
|
254
|
-
let memoedLoadMoreProps = (0, $
|
|
253
|
+
let scrollRef = (0, $auVFN$useRef)(null);
|
|
254
|
+
let memoedLoadMoreProps = (0, $auVFN$useMemo)(()=>({
|
|
255
255
|
isLoading: isLoading,
|
|
256
256
|
onLoadMore: onLoadMore
|
|
257
257
|
}), [
|
|
258
258
|
isLoading,
|
|
259
259
|
onLoadMore
|
|
260
260
|
]);
|
|
261
|
-
(0, $
|
|
261
|
+
(0, $auVFN$useLoadMore)(memoedLoadMoreProps, scrollRef);
|
|
262
262
|
let isCheckboxSelection = props.selectionMode === 'multiple' || props.selectionMode === 'single';
|
|
263
|
-
return /*#__PURE__*/ (0, $
|
|
263
|
+
return /*#__PURE__*/ (0, $auVFN$jsx)((0, $auVFN$ResizableTableContainer), {
|
|
264
264
|
// 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
|
|
265
265
|
ref: domRef,
|
|
266
266
|
onResize: propsOnResize,
|
|
267
267
|
onResizeEnd: onResizeEnd,
|
|
268
268
|
onResizeStart: onResizeStart,
|
|
269
|
-
className: (UNSAFE_className || '') + (0, $feb886035e0d4633$export$e618dc39ac9ad607)($
|
|
269
|
+
className: (UNSAFE_className || '') + (0, $feb886035e0d4633$export$e618dc39ac9ad607)($0fcd5fb617970a1d$var$tableWrapper, styles),
|
|
270
270
|
style: UNSAFE_style,
|
|
271
|
-
children: /*#__PURE__*/ (0, $
|
|
271
|
+
children: /*#__PURE__*/ (0, $auVFN$jsx)((0, $auVFN$UNSTABLE_Virtualizer), {
|
|
272
272
|
layout: layout,
|
|
273
|
-
children: /*#__PURE__*/ (0, $
|
|
273
|
+
children: /*#__PURE__*/ (0, $auVFN$jsx)($0fcd5fb617970a1d$var$InternalTableContext.Provider, {
|
|
274
274
|
value: context,
|
|
275
|
-
children: /*#__PURE__*/ (0, $
|
|
275
|
+
children: /*#__PURE__*/ (0, $auVFN$jsx)((0, $auVFN$Table), {
|
|
276
276
|
ref: scrollRef,
|
|
277
277
|
// Fix webkit bug where scrollbars appear above the checkboxes/other table elements
|
|
278
278
|
style: {
|
|
279
279
|
WebkitTransform: 'translateZ(0)'
|
|
280
280
|
},
|
|
281
|
-
className: (renderProps)=>$
|
|
281
|
+
className: (renderProps)=>$0fcd5fb617970a1d$var$table({
|
|
282
282
|
...renderProps,
|
|
283
283
|
isCheckboxSelection: isCheckboxSelection,
|
|
284
284
|
isQuiet: isQuiet
|
|
@@ -291,18 +291,18 @@ function $d57818bede309747$var$Table(props, ref) {
|
|
|
291
291
|
})
|
|
292
292
|
});
|
|
293
293
|
}
|
|
294
|
-
const $
|
|
295
|
-
function $
|
|
294
|
+
const $0fcd5fb617970a1d$var$centeredWrapper = " . _Zd _1c _2d l4 k4";
|
|
295
|
+
function $0fcd5fb617970a1d$export$76ccd210b9029917(props) {
|
|
296
296
|
let { items: items, renderEmptyState: renderEmptyState, children: children } = props;
|
|
297
|
-
let { loadingState: loadingState } = (0, $
|
|
297
|
+
let { loadingState: loadingState } = (0, $auVFN$useContext)($0fcd5fb617970a1d$var$InternalTableContext);
|
|
298
298
|
let emptyRender;
|
|
299
299
|
let renderer = children;
|
|
300
|
-
let stringFormatter = (0, $
|
|
301
|
-
let loadMoreSpinner = /*#__PURE__*/ (0, $
|
|
300
|
+
let stringFormatter = (0, $auVFN$useLocalizedStringFormatter)((0, ($parcel$interopDefault($auVFN$intlStringsmjs))), '@react-spectrum/s2');
|
|
301
|
+
let loadMoreSpinner = /*#__PURE__*/ (0, $auVFN$jsx)((0, $auVFN$UNSTABLE_TableLoadingIndicator), {
|
|
302
302
|
className: " . k4 l4",
|
|
303
|
-
children: /*#__PURE__*/ (0, $
|
|
304
|
-
className: $
|
|
305
|
-
children: /*#__PURE__*/ (0, $
|
|
303
|
+
children: /*#__PURE__*/ (0, $auVFN$jsx)("div", {
|
|
304
|
+
className: $0fcd5fb617970a1d$var$centeredWrapper,
|
|
305
|
+
children: /*#__PURE__*/ (0, $auVFN$jsx)((0, $41ddd91dbbf0c389$export$c79b9d6b4cc92af7), {
|
|
306
306
|
isIndeterminate: true,
|
|
307
307
|
"aria-label": stringFormatter.format('table.loadingMore')
|
|
308
308
|
})
|
|
@@ -312,33 +312,33 @@ function $d57818bede309747$export$76ccd210b9029917(props) {
|
|
|
312
312
|
// the loader. Otherwise it is a static renderer and thus we can simply add the table loader after
|
|
313
313
|
// TODO: this assumes that the user isn't providing their children in some wrapper though and/or isn't doing a map of children
|
|
314
314
|
// (though I guess they wouldn't provide items then so the check for this is still valid in the latter case)...
|
|
315
|
-
if (typeof children === 'function' && items) renderer = /*#__PURE__*/ (0, $
|
|
315
|
+
if (typeof children === 'function' && items) renderer = /*#__PURE__*/ (0, $auVFN$jsxs)((0, $auVFN$Fragment), {
|
|
316
316
|
children: [
|
|
317
|
-
/*#__PURE__*/ (0, $
|
|
317
|
+
/*#__PURE__*/ (0, $auVFN$jsx)((0, $auVFN$Collection), {
|
|
318
318
|
items: items,
|
|
319
319
|
children: children
|
|
320
320
|
}),
|
|
321
321
|
loadingState === 'loadingMore' && loadMoreSpinner
|
|
322
322
|
]
|
|
323
323
|
});
|
|
324
|
-
else renderer = /*#__PURE__*/ (0, $
|
|
324
|
+
else renderer = /*#__PURE__*/ (0, $auVFN$jsxs)((0, $auVFN$Fragment), {
|
|
325
325
|
children: [
|
|
326
326
|
children,
|
|
327
327
|
loadingState === 'loadingMore' && loadMoreSpinner
|
|
328
328
|
]
|
|
329
329
|
});
|
|
330
|
-
if (renderEmptyState != null && loadingState !== 'loading') emptyRender = (props)=>/*#__PURE__*/ (0, $
|
|
331
|
-
className: $
|
|
330
|
+
if (renderEmptyState != null && loadingState !== 'loading') emptyRender = (props)=>/*#__PURE__*/ (0, $auVFN$jsx)("div", {
|
|
331
|
+
className: $0fcd5fb617970a1d$var$centeredWrapper,
|
|
332
332
|
children: renderEmptyState(props)
|
|
333
333
|
});
|
|
334
|
-
else if (loadingState === 'loading') emptyRender = ()=>/*#__PURE__*/ (0, $
|
|
335
|
-
className: $
|
|
336
|
-
children: /*#__PURE__*/ (0, $
|
|
334
|
+
else if (loadingState === 'loading') emptyRender = ()=>/*#__PURE__*/ (0, $auVFN$jsx)("div", {
|
|
335
|
+
className: $0fcd5fb617970a1d$var$centeredWrapper,
|
|
336
|
+
children: /*#__PURE__*/ (0, $auVFN$jsx)((0, $41ddd91dbbf0c389$export$c79b9d6b4cc92af7), {
|
|
337
337
|
isIndeterminate: true,
|
|
338
338
|
"aria-label": stringFormatter.format('table.loading')
|
|
339
339
|
})
|
|
340
340
|
});
|
|
341
|
-
return /*#__PURE__*/ (0, $
|
|
341
|
+
return /*#__PURE__*/ (0, $auVFN$jsx)((0, $auVFN$TableBody), {
|
|
342
342
|
className: " . k4",
|
|
343
343
|
...props,
|
|
344
344
|
renderEmptyState: emptyRender,
|
|
@@ -348,7 +348,7 @@ function $d57818bede309747$export$76ccd210b9029917(props) {
|
|
|
348
348
|
children: renderer
|
|
349
349
|
});
|
|
350
350
|
}
|
|
351
|
-
const $
|
|
351
|
+
const $0fcd5fb617970a1d$var$cellFocus = {
|
|
352
352
|
outlineStyle: {
|
|
353
353
|
default: 'none',
|
|
354
354
|
isFocusVisible: 'solid'
|
|
@@ -361,8 +361,8 @@ const $d57818bede309747$var$cellFocus = {
|
|
|
361
361
|
touch: "[0.46875rem]"
|
|
362
362
|
}
|
|
363
363
|
};
|
|
364
|
-
function $
|
|
365
|
-
return /*#__PURE__*/ (0, $
|
|
364
|
+
function $0fcd5fb617970a1d$var$CellFocusRing() {
|
|
365
|
+
return /*#__PURE__*/ (0, $auVFN$jsx)("div", {
|
|
366
366
|
role: "presentation",
|
|
367
367
|
className: function anonymous(props) {
|
|
368
368
|
let rules = " .";
|
|
@@ -391,7 +391,7 @@ function $d57818bede309747$var$CellFocusRing() {
|
|
|
391
391
|
})
|
|
392
392
|
});
|
|
393
393
|
}
|
|
394
|
-
const $
|
|
394
|
+
const $0fcd5fb617970a1d$var$columnStyles = function anonymous(props) {
|
|
395
395
|
let rules = " .";
|
|
396
396
|
rules += ' k-17zqamw';
|
|
397
397
|
rules += ' __na';
|
|
@@ -447,26 +447,26 @@ const $d57818bede309747$var$columnStyles = function anonymous(props) {
|
|
|
447
447
|
rules += ' _zb';
|
|
448
448
|
return rules;
|
|
449
449
|
};
|
|
450
|
-
function $
|
|
451
|
-
let { isHeaderRowHovered: isHeaderRowHovered } = (0, $
|
|
452
|
-
let { isQuiet: isQuiet } = (0, $
|
|
450
|
+
function $0fcd5fb617970a1d$export$816b5d811295e6bc(props) {
|
|
451
|
+
let { isHeaderRowHovered: isHeaderRowHovered } = (0, $auVFN$useContext)($0fcd5fb617970a1d$var$InternalTableHeaderContext);
|
|
452
|
+
let { isQuiet: isQuiet } = (0, $auVFN$useContext)($0fcd5fb617970a1d$var$InternalTableContext);
|
|
453
453
|
let { allowsResizing: allowsResizing, children: children, align: align = 'start' } = props;
|
|
454
454
|
let isColumnResizable = allowsResizing;
|
|
455
|
-
return /*#__PURE__*/ (0, $
|
|
455
|
+
return /*#__PURE__*/ (0, $auVFN$jsx)((0, $auVFN$Column), {
|
|
456
456
|
...props,
|
|
457
457
|
style: {
|
|
458
458
|
borderInlineEndColor: 'transparent'
|
|
459
459
|
},
|
|
460
|
-
className: (renderProps)=>$
|
|
460
|
+
className: (renderProps)=>$0fcd5fb617970a1d$var$columnStyles({
|
|
461
461
|
...renderProps,
|
|
462
462
|
isColumnResizable: isColumnResizable,
|
|
463
463
|
align: align,
|
|
464
464
|
isQuiet: isQuiet
|
|
465
465
|
}),
|
|
466
|
-
children: ({ allowsSorting: allowsSorting, sortDirection: sortDirection, isFocusVisible: isFocusVisible, sort: sort, startResize: startResize, isHovered: isHovered })=>/*#__PURE__*/ (0, $
|
|
466
|
+
children: ({ allowsSorting: allowsSorting, sortDirection: sortDirection, isFocusVisible: isFocusVisible, sort: sort, startResize: startResize, isHovered: isHovered })=>/*#__PURE__*/ (0, $auVFN$jsxs)((0, $auVFN$Fragment), {
|
|
467
467
|
children: [
|
|
468
|
-
isFocusVisible && /*#__PURE__*/ (0, $
|
|
469
|
-
isColumnResizable ? /*#__PURE__*/ (0, $
|
|
468
|
+
isFocusVisible && /*#__PURE__*/ (0, $auVFN$jsx)($0fcd5fb617970a1d$var$CellFocusRing, {}),
|
|
469
|
+
isColumnResizable ? /*#__PURE__*/ (0, $auVFN$jsx)($0fcd5fb617970a1d$var$ResizableColumnContents, {
|
|
470
470
|
allowsSorting: allowsSorting,
|
|
471
471
|
sortDirection: sortDirection,
|
|
472
472
|
sort: sort,
|
|
@@ -474,7 +474,7 @@ function $d57818bede309747$export$816b5d811295e6bc(props) {
|
|
|
474
474
|
isHovered: isHeaderRowHovered || isHovered,
|
|
475
475
|
align: align,
|
|
476
476
|
children: children
|
|
477
|
-
}) : /*#__PURE__*/ (0, $
|
|
477
|
+
}) : /*#__PURE__*/ (0, $auVFN$jsx)($0fcd5fb617970a1d$var$ColumnContents, {
|
|
478
478
|
allowsSorting: allowsSorting,
|
|
479
479
|
sortDirection: sortDirection,
|
|
480
480
|
children: children
|
|
@@ -483,8 +483,8 @@ function $d57818bede309747$export$816b5d811295e6bc(props) {
|
|
|
483
483
|
})
|
|
484
484
|
});
|
|
485
485
|
}
|
|
486
|
-
const $
|
|
487
|
-
const $
|
|
486
|
+
const $0fcd5fb617970a1d$var$columnContentWrapper = " . qa qba _Zd _1c l4";
|
|
487
|
+
const $0fcd5fb617970a1d$var$sortIcon = function anonymous(props) {
|
|
488
488
|
let rules = " .";
|
|
489
489
|
rules += ' l-1wikn8b';
|
|
490
490
|
rules += ' k-1wikn8b';
|
|
@@ -498,30 +498,30 @@ const $d57818bede309747$var$sortIcon = function anonymous(props) {
|
|
|
498
498
|
rules += ' -rwx0fg_e-b';
|
|
499
499
|
return rules;
|
|
500
500
|
};
|
|
501
|
-
function $
|
|
501
|
+
function $0fcd5fb617970a1d$var$ColumnContents(props) {
|
|
502
502
|
let { allowsSorting: allowsSorting, sortDirection: sortDirection, children: children } = props;
|
|
503
|
-
return /*#__PURE__*/ (0, $
|
|
504
|
-
className: $
|
|
503
|
+
return /*#__PURE__*/ (0, $auVFN$jsxs)("div", {
|
|
504
|
+
className: $0fcd5fb617970a1d$var$columnContentWrapper,
|
|
505
505
|
children: [
|
|
506
|
-
allowsSorting && /*#__PURE__*/ (0, $
|
|
506
|
+
allowsSorting && /*#__PURE__*/ (0, $auVFN$jsx)((0, $auVFN$Provider), {
|
|
507
507
|
values: [
|
|
508
508
|
[
|
|
509
509
|
(0, $ac8c32e6775ddd1f$export$a49f528ae1a4d0ed),
|
|
510
510
|
{
|
|
511
|
-
styles: $
|
|
511
|
+
styles: $0fcd5fb617970a1d$var$sortIcon({})
|
|
512
512
|
}
|
|
513
513
|
]
|
|
514
514
|
],
|
|
515
|
-
children: sortDirection != null && (sortDirection === 'ascending' ? /*#__PURE__*/ (0, $
|
|
515
|
+
children: sortDirection != null && (sortDirection === 'ascending' ? /*#__PURE__*/ (0, $auVFN$jsx)((0, $415c33109ddcfc45$export$2e2bcd8739ae039), {}) : /*#__PURE__*/ (0, $auVFN$jsx)((0, $5a632e895c21f138$export$2e2bcd8739ae039), {}))
|
|
516
516
|
}),
|
|
517
|
-
/*#__PURE__*/ (0, $
|
|
517
|
+
/*#__PURE__*/ (0, $auVFN$jsx)("span", {
|
|
518
518
|
className: " . __vb __wb _ma _pb l4",
|
|
519
519
|
children: children
|
|
520
520
|
})
|
|
521
521
|
]
|
|
522
522
|
});
|
|
523
523
|
}
|
|
524
|
-
const $
|
|
524
|
+
const $0fcd5fb617970a1d$var$resizableMenuButtonWrapper = function anonymous(props) {
|
|
525
525
|
let rules = " .";
|
|
526
526
|
if (props.isFocusVisible) rules += ' _Lb';
|
|
527
527
|
else rules += ' _La';
|
|
@@ -576,7 +576,7 @@ const $d57818bede309747$var$resizableMenuButtonWrapper = function anonymous(prop
|
|
|
576
576
|
rules += ' _ed';
|
|
577
577
|
return rules;
|
|
578
578
|
};
|
|
579
|
-
const $
|
|
579
|
+
const $0fcd5fb617970a1d$var$resizerHandleContainer = function anonymous(props) {
|
|
580
580
|
let rules = " .";
|
|
581
581
|
if (props.isHovered) rules += ' _Za';
|
|
582
582
|
else if (props.isResizing) rules += ' _Za';
|
|
@@ -596,7 +596,7 @@ const $d57818bede309747$var$resizerHandleContainer = function anonymous(props) {
|
|
|
596
596
|
rules += ' -_1m7qh0o_d-x';
|
|
597
597
|
return rules;
|
|
598
598
|
};
|
|
599
|
-
const $
|
|
599
|
+
const $0fcd5fb617970a1d$var$resizerHandle = function anonymous(props) {
|
|
600
600
|
let rules = " .";
|
|
601
601
|
if (props.isResizing) rules += ' ba_____z';
|
|
602
602
|
else if (props.isFocusVisible) rules += ' ba_____z';
|
|
@@ -620,13 +620,13 @@ const $d57818bede309747$var$resizerHandle = function anonymous(props) {
|
|
|
620
620
|
rules += ' V-6njx2e';
|
|
621
621
|
return rules;
|
|
622
622
|
};
|
|
623
|
-
const $
|
|
624
|
-
const $
|
|
625
|
-
const $
|
|
626
|
-
function $
|
|
623
|
+
const $0fcd5fb617970a1d$var$columnHeaderText = " . __vb __wb _ma _pb q-1wikn8b _9-3t1x _8-3t1y hF";
|
|
624
|
+
const $0fcd5fb617970a1d$var$chevronIcon = " . R-3hn0u yG ybH q-1wikn8b _8-3t1x -rwx0fg_e-b";
|
|
625
|
+
const $0fcd5fb617970a1d$var$nubbin = " . Ua Xa V-avx9c1 Vb-15azsa3 l-1wikn8b k-1wikn8b e-1m7qh0o ea_____U -rwx0fg_e-x -rwx0fg_e-a_____V";
|
|
626
|
+
function $0fcd5fb617970a1d$var$ResizableColumnContents(props) {
|
|
627
627
|
let { allowsSorting: allowsSorting, sortDirection: sortDirection, sort: sort, startResize: startResize, children: children, isHovered: isHovered, align: align } = props;
|
|
628
|
-
let { setIsInResizeMode: setIsInResizeMode, isInResizeMode: isInResizeMode } = (0, $
|
|
629
|
-
let stringFormatter = (0, $
|
|
628
|
+
let { setIsInResizeMode: setIsInResizeMode, isInResizeMode: isInResizeMode } = (0, $auVFN$useContext)($0fcd5fb617970a1d$var$InternalTableContext);
|
|
629
|
+
let stringFormatter = (0, $auVFN$useLocalizedStringFormatter)((0, ($parcel$interopDefault($auVFN$intlStringsmjs))), '@react-spectrum/s2');
|
|
630
630
|
const onMenuSelect = (key)=>{
|
|
631
631
|
switch(key){
|
|
632
632
|
case 'sort-asc':
|
|
@@ -641,7 +641,7 @@ function $d57818bede309747$var$ResizableColumnContents(props) {
|
|
|
641
641
|
break;
|
|
642
642
|
}
|
|
643
643
|
};
|
|
644
|
-
let items = (0, $
|
|
644
|
+
let items = (0, $auVFN$useMemo)(()=>{
|
|
645
645
|
let options = [
|
|
646
646
|
{
|
|
647
647
|
label: stringFormatter.format('table.resizeColumn'),
|
|
@@ -671,70 +671,70 @@ function $d57818bede309747$var$ResizableColumnContents(props) {
|
|
|
671
671
|
buttonAlignment = 'end';
|
|
672
672
|
menuAlign = 'end';
|
|
673
673
|
}
|
|
674
|
-
return /*#__PURE__*/ (0, $
|
|
674
|
+
return /*#__PURE__*/ (0, $auVFN$jsxs)((0, $auVFN$Fragment), {
|
|
675
675
|
children: [
|
|
676
|
-
/*#__PURE__*/ (0, $
|
|
676
|
+
/*#__PURE__*/ (0, $auVFN$jsxs)((0, $13afb0ea5f0ed767$export$27d2ad3c5815583e), {
|
|
677
677
|
align: menuAlign,
|
|
678
678
|
children: [
|
|
679
|
-
/*#__PURE__*/ (0, $
|
|
680
|
-
className: (renderProps)=>$
|
|
679
|
+
/*#__PURE__*/ (0, $auVFN$jsxs)((0, $auVFN$Button), {
|
|
680
|
+
className: (renderProps)=>$0fcd5fb617970a1d$var$resizableMenuButtonWrapper({
|
|
681
681
|
...renderProps,
|
|
682
682
|
align: buttonAlignment
|
|
683
683
|
}),
|
|
684
684
|
children: [
|
|
685
|
-
allowsSorting && /*#__PURE__*/ (0, $
|
|
685
|
+
allowsSorting && /*#__PURE__*/ (0, $auVFN$jsx)((0, $auVFN$Provider), {
|
|
686
686
|
values: [
|
|
687
687
|
[
|
|
688
688
|
(0, $ac8c32e6775ddd1f$export$a49f528ae1a4d0ed),
|
|
689
689
|
{
|
|
690
|
-
styles: $
|
|
690
|
+
styles: $0fcd5fb617970a1d$var$sortIcon({
|
|
691
691
|
isButton: true
|
|
692
692
|
})
|
|
693
693
|
}
|
|
694
694
|
]
|
|
695
695
|
],
|
|
696
|
-
children: sortDirection != null && (sortDirection === 'ascending' ? /*#__PURE__*/ (0, $
|
|
696
|
+
children: sortDirection != null && (sortDirection === 'ascending' ? /*#__PURE__*/ (0, $auVFN$jsx)((0, $415c33109ddcfc45$export$2e2bcd8739ae039), {}) : /*#__PURE__*/ (0, $auVFN$jsx)((0, $5a632e895c21f138$export$2e2bcd8739ae039), {}))
|
|
697
697
|
}),
|
|
698
|
-
/*#__PURE__*/ (0, $
|
|
699
|
-
className: $
|
|
698
|
+
/*#__PURE__*/ (0, $auVFN$jsx)("div", {
|
|
699
|
+
className: $0fcd5fb617970a1d$var$columnHeaderText,
|
|
700
700
|
children: children
|
|
701
701
|
}),
|
|
702
|
-
/*#__PURE__*/ (0, $
|
|
702
|
+
/*#__PURE__*/ (0, $auVFN$jsx)((0, $4b69f02ec06b9226$export$2e2bcd8739ae039), {
|
|
703
703
|
size: "M",
|
|
704
|
-
className: $
|
|
704
|
+
className: $0fcd5fb617970a1d$var$chevronIcon
|
|
705
705
|
})
|
|
706
706
|
]
|
|
707
707
|
}),
|
|
708
|
-
/*#__PURE__*/ (0, $
|
|
708
|
+
/*#__PURE__*/ (0, $auVFN$jsx)((0, $13afb0ea5f0ed767$export$d9b273488cd8ce6f), {
|
|
709
709
|
onAction: onMenuSelect,
|
|
710
710
|
items: items,
|
|
711
711
|
styles: " . qI qbJ",
|
|
712
|
-
children: (item)=>/*#__PURE__*/ (0, $
|
|
712
|
+
children: (item)=>/*#__PURE__*/ (0, $auVFN$jsx)((0, $13afb0ea5f0ed767$export$2ce376c2cc3355c8), {
|
|
713
713
|
children: item?.label
|
|
714
714
|
})
|
|
715
715
|
})
|
|
716
716
|
]
|
|
717
717
|
}),
|
|
718
|
-
/*#__PURE__*/ (0, $
|
|
718
|
+
/*#__PURE__*/ (0, $auVFN$jsx)("div", {
|
|
719
719
|
"data-react-aria-prevent-focus": "true",
|
|
720
|
-
children: /*#__PURE__*/ (0, $
|
|
720
|
+
children: /*#__PURE__*/ (0, $auVFN$jsx)((0, $auVFN$ColumnResizer), {
|
|
721
721
|
"data-react-aria-prevent-focus": "true",
|
|
722
|
-
className: ({ resizableDirection: resizableDirection, isResizing: isResizing })=>$
|
|
722
|
+
className: ({ resizableDirection: resizableDirection, isResizing: isResizing })=>$0fcd5fb617970a1d$var$resizerHandleContainer({
|
|
723
723
|
resizableDirection: resizableDirection,
|
|
724
724
|
isResizing: isResizing,
|
|
725
725
|
isHovered: isInResizeMode || isHovered
|
|
726
726
|
}),
|
|
727
|
-
children: ({ isFocusVisible: isFocusVisible, isResizing: isResizing })=>/*#__PURE__*/ (0, $
|
|
727
|
+
children: ({ isFocusVisible: isFocusVisible, isResizing: isResizing })=>/*#__PURE__*/ (0, $auVFN$jsxs)((0, $auVFN$Fragment), {
|
|
728
728
|
children: [
|
|
729
|
-
/*#__PURE__*/ (0, $
|
|
729
|
+
/*#__PURE__*/ (0, $auVFN$jsx)($0fcd5fb617970a1d$var$ResizerIndicator, {
|
|
730
730
|
isInResizeMode: isInResizeMode,
|
|
731
731
|
isFocusVisible: isFocusVisible,
|
|
732
732
|
isHovered: isHovered,
|
|
733
733
|
isResizing: isResizing
|
|
734
734
|
}),
|
|
735
|
-
(isFocusVisible || isInResizeMode) && isResizing && /*#__PURE__*/ (0, $
|
|
736
|
-
className: $
|
|
737
|
-
children: /*#__PURE__*/ (0, $
|
|
735
|
+
(isFocusVisible || isInResizeMode) && isResizing && /*#__PURE__*/ (0, $auVFN$jsx)("div", {
|
|
736
|
+
className: $0fcd5fb617970a1d$var$nubbin,
|
|
737
|
+
children: /*#__PURE__*/ (0, $auVFN$jsx)((0, $59ff3896bbb9d00c$export$2e2bcd8739ae039), {})
|
|
738
738
|
})
|
|
739
739
|
]
|
|
740
740
|
})
|
|
@@ -743,18 +743,18 @@ function $d57818bede309747$var$ResizableColumnContents(props) {
|
|
|
743
743
|
]
|
|
744
744
|
});
|
|
745
745
|
}
|
|
746
|
-
function $
|
|
747
|
-
return /*#__PURE__*/ (0, $
|
|
748
|
-
className: $
|
|
746
|
+
function $0fcd5fb617970a1d$var$ResizerIndicator({ isFocusVisible: isFocusVisible, isHovered: isHovered, isResizing: isResizing, isInResizeMode: isInResizeMode }) {
|
|
747
|
+
return /*#__PURE__*/ (0, $auVFN$jsx)("div", {
|
|
748
|
+
className: $0fcd5fb617970a1d$var$resizerHandle({
|
|
749
749
|
isFocusVisible: isFocusVisible,
|
|
750
750
|
isHovered: isHovered || isInResizeMode,
|
|
751
751
|
isResizing: isResizing
|
|
752
752
|
})
|
|
753
753
|
});
|
|
754
754
|
}
|
|
755
|
-
const $
|
|
756
|
-
const $
|
|
757
|
-
const $
|
|
755
|
+
const $0fcd5fb617970a1d$var$tableHeader = " . k4 l4 bf A-yj899n";
|
|
756
|
+
const $0fcd5fb617970a1d$var$selectAllCheckbox = " . yf";
|
|
757
|
+
const $0fcd5fb617970a1d$var$selectAllCheckboxColumn = function anonymous(props) {
|
|
758
758
|
let rules = " .";
|
|
759
759
|
rules += ' Ea';
|
|
760
760
|
rules += ' Fa';
|
|
@@ -776,48 +776,48 @@ const $d57818bede309747$var$selectAllCheckboxColumn = function anonymous(props)
|
|
|
776
776
|
rules += ' bf';
|
|
777
777
|
return rules;
|
|
778
778
|
};
|
|
779
|
-
let $
|
|
779
|
+
let $0fcd5fb617970a1d$var$InternalTableHeaderContext = /*#__PURE__*/ (0, $auVFN$createContext)({
|
|
780
780
|
isHeaderRowHovered: false
|
|
781
781
|
});
|
|
782
|
-
function $
|
|
782
|
+
function $0fcd5fb617970a1d$export$f850895b287ef28e({ columns: columns, children: children }) {
|
|
783
783
|
let scale = (0, $859432f3b3573fcb$export$a8d2043b2d807f4d)();
|
|
784
|
-
let { selectionBehavior: selectionBehavior, selectionMode: selectionMode } = (0, $
|
|
785
|
-
let { isQuiet: isQuiet } = (0, $
|
|
786
|
-
let [isHeaderRowHovered, setHeaderRowHovered] = (0, $
|
|
787
|
-
return /*#__PURE__*/ (0, $
|
|
784
|
+
let { selectionBehavior: selectionBehavior, selectionMode: selectionMode } = (0, $auVFN$useTableOptions)();
|
|
785
|
+
let { isQuiet: isQuiet } = (0, $auVFN$useContext)($0fcd5fb617970a1d$var$InternalTableContext);
|
|
786
|
+
let [isHeaderRowHovered, setHeaderRowHovered] = (0, $auVFN$useState)(false);
|
|
787
|
+
return /*#__PURE__*/ (0, $auVFN$jsx)($0fcd5fb617970a1d$var$InternalTableHeaderContext.Provider, {
|
|
788
788
|
value: {
|
|
789
789
|
isHeaderRowHovered: isHeaderRowHovered
|
|
790
790
|
},
|
|
791
|
-
children: /*#__PURE__*/ (0, $
|
|
791
|
+
children: /*#__PURE__*/ (0, $auVFN$jsxs)((0, $auVFN$TableHeader), {
|
|
792
792
|
onHoverChange: setHeaderRowHovered,
|
|
793
|
-
className: $
|
|
793
|
+
className: $0fcd5fb617970a1d$var$tableHeader,
|
|
794
794
|
children: [
|
|
795
795
|
selectionBehavior === 'toggle' && // Also isSticky prop is applied just for the layout, will decide what the RAC api should be later
|
|
796
796
|
// @ts-ignore
|
|
797
|
-
/*#__PURE__*/ (0, $
|
|
797
|
+
/*#__PURE__*/ (0, $auVFN$jsx)((0, $auVFN$Column), {
|
|
798
798
|
isSticky: true,
|
|
799
799
|
width: scale === 'medium' ? 40 : 52,
|
|
800
800
|
minWidth: scale === 'medium' ? 40 : 52,
|
|
801
|
-
className: $
|
|
801
|
+
className: $0fcd5fb617970a1d$var$selectAllCheckboxColumn({
|
|
802
802
|
isQuiet: isQuiet
|
|
803
803
|
}),
|
|
804
|
-
children: ({ isFocusVisible: isFocusVisible })=>/*#__PURE__*/ (0, $
|
|
804
|
+
children: ({ isFocusVisible: isFocusVisible })=>/*#__PURE__*/ (0, $auVFN$jsxs)((0, $auVFN$Fragment), {
|
|
805
805
|
children: [
|
|
806
|
-
selectionMode === 'single' && /*#__PURE__*/ (0, $
|
|
806
|
+
selectionMode === 'single' && /*#__PURE__*/ (0, $auVFN$jsxs)((0, $auVFN$Fragment), {
|
|
807
807
|
children: [
|
|
808
|
-
isFocusVisible && /*#__PURE__*/ (0, $
|
|
809
|
-
/*#__PURE__*/ (0, $
|
|
808
|
+
isFocusVisible && /*#__PURE__*/ (0, $auVFN$jsx)($0fcd5fb617970a1d$var$CellFocusRing, {}),
|
|
809
|
+
/*#__PURE__*/ (0, $auVFN$jsx)($0fcd5fb617970a1d$var$VisuallyHiddenSelectAllLabel, {})
|
|
810
810
|
]
|
|
811
811
|
}),
|
|
812
|
-
selectionMode === 'multiple' && /*#__PURE__*/ (0, $
|
|
812
|
+
selectionMode === 'multiple' && /*#__PURE__*/ (0, $auVFN$jsx)((0, $9b405e0f8095dce0$export$48513f6b9f8ce62d), {
|
|
813
813
|
isEmphasized: true,
|
|
814
|
-
styles: $
|
|
814
|
+
styles: $0fcd5fb617970a1d$var$selectAllCheckbox,
|
|
815
815
|
slot: "selection"
|
|
816
816
|
})
|
|
817
817
|
]
|
|
818
818
|
})
|
|
819
819
|
}),
|
|
820
|
-
/*#__PURE__*/ (0, $
|
|
820
|
+
/*#__PURE__*/ (0, $auVFN$jsx)((0, $auVFN$Collection), {
|
|
821
821
|
items: columns,
|
|
822
822
|
children: children
|
|
823
823
|
})
|
|
@@ -825,13 +825,13 @@ function $d57818bede309747$export$f850895b287ef28e({ columns: columns, children:
|
|
|
825
825
|
})
|
|
826
826
|
});
|
|
827
827
|
}
|
|
828
|
-
function $
|
|
829
|
-
let checkboxProps = (0, $
|
|
830
|
-
return /*#__PURE__*/ (0, $
|
|
828
|
+
function $0fcd5fb617970a1d$var$VisuallyHiddenSelectAllLabel() {
|
|
829
|
+
let checkboxProps = (0, $auVFN$useSlottedContext)((0, $auVFN$CheckboxContext), 'selection');
|
|
830
|
+
return /*#__PURE__*/ (0, $auVFN$jsx)((0, $auVFN$VisuallyHidden), {
|
|
831
831
|
children: checkboxProps?.['aria-label']
|
|
832
832
|
});
|
|
833
833
|
}
|
|
834
|
-
const $
|
|
834
|
+
const $0fcd5fb617970a1d$var$commonCellStyles = {
|
|
835
835
|
borderColor: 'transparent',
|
|
836
836
|
borderBottomWidth: 1,
|
|
837
837
|
borderTopWidth: 0,
|
|
@@ -845,7 +845,7 @@ const $d57818bede309747$var$commonCellStyles = {
|
|
|
845
845
|
outlineStyle: 'none',
|
|
846
846
|
paddingX: 16 // table-edge-to-content
|
|
847
847
|
};
|
|
848
|
-
const $
|
|
848
|
+
const $0fcd5fb617970a1d$var$cell = function anonymous(props) {
|
|
849
849
|
let rules = " .";
|
|
850
850
|
rules += ' ca_____v';
|
|
851
851
|
rules += ' ci';
|
|
@@ -902,11 +902,11 @@ const $d57818bede309747$var$cell = function anonymous(props) {
|
|
|
902
902
|
rules += ' -_375tp1_v-b';
|
|
903
903
|
return rules;
|
|
904
904
|
};
|
|
905
|
-
const $
|
|
905
|
+
const $0fcd5fb617970a1d$var$stickyCell = {
|
|
906
906
|
backgroundColor: 'gray-25'
|
|
907
907
|
};
|
|
908
|
-
const $
|
|
909
|
-
const $
|
|
908
|
+
const $0fcd5fb617970a1d$var$checkboxCellStyle = " . ca va ua sa ta wa Uc an aa_____x _La Cf Df b-19jpv4m _0b k-1xrzxd1";
|
|
909
|
+
const $0fcd5fb617970a1d$var$cellContent = function anonymous(props) {
|
|
910
910
|
let rules = " .";
|
|
911
911
|
rules += ' __vb';
|
|
912
912
|
rules += ' __wb';
|
|
@@ -938,26 +938,26 @@ const $d57818bede309747$var$cellContent = function anonymous(props) {
|
|
|
938
938
|
else rules += ' ba';
|
|
939
939
|
return rules;
|
|
940
940
|
};
|
|
941
|
-
function $
|
|
941
|
+
function $0fcd5fb617970a1d$export$f6f0c3fe4ec306ea(props) {
|
|
942
942
|
let { children: children, isSticky: isSticky, showDivider: showDivider = false, align: align, textValue: textValue, ...otherProps } = props;
|
|
943
|
-
let tableVisualOptions = (0, $
|
|
943
|
+
let tableVisualOptions = (0, $auVFN$useContext)($0fcd5fb617970a1d$var$InternalTableContext);
|
|
944
944
|
textValue ||= typeof children === 'string' ? children : undefined;
|
|
945
|
-
return /*#__PURE__*/ (0, $
|
|
945
|
+
return /*#__PURE__*/ (0, $auVFN$jsx)((0, $auVFN$Cell), {
|
|
946
946
|
// Also isSticky prop is applied just for the layout, will decide what the RAC api should be later
|
|
947
947
|
// @ts-ignore
|
|
948
948
|
isSticky: isSticky,
|
|
949
|
-
className: (renderProps)=>$
|
|
949
|
+
className: (renderProps)=>$0fcd5fb617970a1d$var$cell({
|
|
950
950
|
...renderProps,
|
|
951
951
|
...tableVisualOptions,
|
|
952
952
|
isDivider: showDivider
|
|
953
953
|
}),
|
|
954
954
|
textValue: textValue,
|
|
955
955
|
...otherProps,
|
|
956
|
-
children: ({ isFocusVisible: isFocusVisible })=>/*#__PURE__*/ (0, $
|
|
956
|
+
children: ({ isFocusVisible: isFocusVisible })=>/*#__PURE__*/ (0, $auVFN$jsxs)((0, $auVFN$Fragment), {
|
|
957
957
|
children: [
|
|
958
|
-
isFocusVisible && /*#__PURE__*/ (0, $
|
|
959
|
-
/*#__PURE__*/ (0, $
|
|
960
|
-
className: $
|
|
958
|
+
isFocusVisible && /*#__PURE__*/ (0, $auVFN$jsx)($0fcd5fb617970a1d$var$CellFocusRing, {}),
|
|
959
|
+
/*#__PURE__*/ (0, $auVFN$jsx)("span", {
|
|
960
|
+
className: $0fcd5fb617970a1d$var$cellContent({
|
|
961
961
|
...tableVisualOptions,
|
|
962
962
|
isSticky: isSticky,
|
|
963
963
|
align: align || 'start'
|
|
@@ -969,9 +969,9 @@ function $d57818bede309747$export$f6f0c3fe4ec306ea(props) {
|
|
|
969
969
|
});
|
|
970
970
|
}
|
|
971
971
|
// Use color-mix instead of transparency so sticky cells work correctly.
|
|
972
|
-
const $
|
|
973
|
-
const $
|
|
974
|
-
const $
|
|
972
|
+
const $0fcd5fb617970a1d$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%))]";
|
|
973
|
+
const $0fcd5fb617970a1d$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%))]";
|
|
974
|
+
const $0fcd5fb617970a1d$var$rowBackgroundColor = {
|
|
975
975
|
default: {
|
|
976
976
|
default: 'gray-25',
|
|
977
977
|
isQuiet: 'transparent'
|
|
@@ -980,16 +980,16 @@ const $d57818bede309747$var$rowBackgroundColor = {
|
|
|
980
980
|
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%)]",
|
|
981
981
|
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%)]",
|
|
982
982
|
isSelected: {
|
|
983
|
-
default: $
|
|
984
|
-
isFocusVisibleWithin: $
|
|
985
|
-
isHovered: $
|
|
986
|
-
isPressed: $
|
|
983
|
+
default: $0fcd5fb617970a1d$var$selectedBackground,
|
|
984
|
+
isFocusVisibleWithin: $0fcd5fb617970a1d$var$selectedActiveBackground,
|
|
985
|
+
isHovered: $0fcd5fb617970a1d$var$selectedActiveBackground,
|
|
986
|
+
isPressed: $0fcd5fb617970a1d$var$selectedActiveBackground // table-selected-row-background-color, opacity /15
|
|
987
987
|
},
|
|
988
988
|
forcedColors: {
|
|
989
989
|
default: 'Background'
|
|
990
990
|
}
|
|
991
991
|
};
|
|
992
|
-
const $
|
|
992
|
+
const $0fcd5fb617970a1d$var$row = function anonymous(props) {
|
|
993
993
|
let rules = " .";
|
|
994
994
|
rules += ' k4';
|
|
995
995
|
rules += ' Uc';
|
|
@@ -1019,26 +1019,26 @@ const $d57818bede309747$var$row = function anonymous(props) {
|
|
|
1019
1019
|
rules += ' _zb';
|
|
1020
1020
|
return rules;
|
|
1021
1021
|
};
|
|
1022
|
-
function $
|
|
1023
|
-
let { selectionBehavior: selectionBehavior, selectionMode: selectionMode } = (0, $
|
|
1024
|
-
let tableVisualOptions = (0, $
|
|
1025
|
-
return /*#__PURE__*/ (0, $
|
|
1022
|
+
function $0fcd5fb617970a1d$export$b59bdbef9ce70de2({ id: id, columns: columns, children: children, ...otherProps }) {
|
|
1023
|
+
let { selectionBehavior: selectionBehavior, selectionMode: selectionMode } = (0, $auVFN$useTableOptions)();
|
|
1024
|
+
let tableVisualOptions = (0, $auVFN$useContext)($0fcd5fb617970a1d$var$InternalTableContext);
|
|
1025
|
+
return /*#__PURE__*/ (0, $auVFN$jsxs)((0, $auVFN$Row), {
|
|
1026
1026
|
id: id,
|
|
1027
|
-
className: (renderProps)=>$
|
|
1027
|
+
className: (renderProps)=>$0fcd5fb617970a1d$var$row({
|
|
1028
1028
|
...renderProps,
|
|
1029
1029
|
...tableVisualOptions
|
|
1030
1030
|
}) + (renderProps.isFocusVisible && " -zwoa9h"),
|
|
1031
1031
|
...otherProps,
|
|
1032
1032
|
children: [
|
|
1033
|
-
selectionMode !== 'none' && selectionBehavior === 'toggle' && /*#__PURE__*/ (0, $
|
|
1033
|
+
selectionMode !== 'none' && selectionBehavior === 'toggle' && /*#__PURE__*/ (0, $auVFN$jsx)($0fcd5fb617970a1d$export$f6f0c3fe4ec306ea, {
|
|
1034
1034
|
isSticky: true,
|
|
1035
|
-
className: $
|
|
1036
|
-
children: /*#__PURE__*/ (0, $
|
|
1035
|
+
className: $0fcd5fb617970a1d$var$checkboxCellStyle,
|
|
1036
|
+
children: /*#__PURE__*/ (0, $auVFN$jsx)((0, $9b405e0f8095dce0$export$48513f6b9f8ce62d), {
|
|
1037
1037
|
isEmphasized: true,
|
|
1038
1038
|
slot: "selection"
|
|
1039
1039
|
})
|
|
1040
1040
|
}),
|
|
1041
|
-
/*#__PURE__*/ (0, $
|
|
1041
|
+
/*#__PURE__*/ (0, $auVFN$jsx)((0, $auVFN$Collection), {
|
|
1042
1042
|
items: columns,
|
|
1043
1043
|
children: children
|
|
1044
1044
|
})
|
|
@@ -1047,8 +1047,8 @@ function $d57818bede309747$export$b59bdbef9ce70de2({ id: id, columns: columns, c
|
|
|
1047
1047
|
}
|
|
1048
1048
|
/**
|
|
1049
1049
|
* Tables are containers for displaying information. They allow users to quickly scan, sort, compare, and take action on large amounts of data.
|
|
1050
|
-
*/ const $
|
|
1050
|
+
*/ const $0fcd5fb617970a1d$export$b3c27e869d856b7 = /*#__PURE__*/ (0, $auVFN$forwardRef)($0fcd5fb617970a1d$var$TableView);
|
|
1051
1051
|
|
|
1052
1052
|
|
|
1053
|
-
export {$
|
|
1054
|
-
//# sourceMappingURL=
|
|
1053
|
+
export {$0fcd5fb617970a1d$export$4e03bdf0174fd602 as S2TableLayout, $0fcd5fb617970a1d$export$76ccd210b9029917 as TableBody, $0fcd5fb617970a1d$export$816b5d811295e6bc as Column, $0fcd5fb617970a1d$export$f850895b287ef28e as TableHeader, $0fcd5fb617970a1d$export$f6f0c3fe4ec306ea as Cell, $0fcd5fb617970a1d$export$b59bdbef9ce70de2 as Row, $0fcd5fb617970a1d$export$b3c27e869d856b7 as TableView};
|
|
1054
|
+
//# sourceMappingURL=TableView.mjs.map
|