@lumx/react 3.20.1-alpha.36 → 3.20.1-alpha.38
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/index.d.ts +4 -15
- package/index.js +13966 -64
- package/index.js.map +1 -0
- package/package.json +3 -3
- package/utils/index.js +159 -3
- package/utils/index.js.map +1 -0
- package/_internal/035c132d.js +0 -314
- package/_internal/0b9c76cb.js +0 -5
- package/_internal/0ea95af1.js +0 -819
- package/_internal/230173a8.js +0 -12
- package/_internal/2a3d237c.js +0 -11
- package/_internal/2c2b6a89.js +0 -51
- package/_internal/3181f000.js +0 -13
- package/_internal/36bd7352.js +0 -218
- package/_internal/3864a6c1.js +0 -436
- package/_internal/3a1facc0.js +0 -17
- package/_internal/49bbeed3.js +0 -5
- package/_internal/4daccdd5.js +0 -24
- package/_internal/4f4c0582.js +0 -2169
- package/_internal/5cef5e8c.js +0 -74
- package/_internal/6a60381c.js +0 -117
- package/_internal/6f084a40.js +0 -111
- package/_internal/76ddefd4.js +0 -61
- package/_internal/78df9309.js +0 -19
- package/_internal/7ad474e4.js +0 -98
- package/_internal/7b293665.js +0 -19
- package/_internal/7daf0f24.js +0 -76
- package/_internal/825ac334.js +0 -129
- package/_internal/827b804a.js +0 -5
- package/_internal/8bce732e.js +0 -8
- package/_internal/9d1336a1.js +0 -18
- package/_internal/a38bdcd0.js +0 -49
- package/_internal/b326655a.js +0 -682
- package/_internal/b83e864b.js +0 -76
- package/_internal/bace1bf1.js +0 -103
- package/_internal/c57190eb.js +0 -146
- package/_internal/components/alert-dialog/index-284fed80.js +0 -163
- package/_internal/components/autocomplete/__mockData__/index-96fc7ea7.js +0 -27
- package/_internal/components/autocomplete/index-27a49d5d.js +0 -261
- package/_internal/components/avatar/index-b8bc3cae.js +0 -83
- package/_internal/components/badge/index-9880f056.js +0 -81
- package/_internal/components/button/index-d919f96d.js +0 -47
- package/_internal/components/checkbox/index-dd478de9.js +0 -143
- package/_internal/components/chip/index-7f84cdbd.js +0 -102
- package/_internal/components/comment-block/index-e942de30.js +0 -138
- package/_internal/components/date-picker/index-a258d3ce.js +0 -596
- package/_internal/components/dialog/index-c7066813.js +0 -238
- package/_internal/components/divider/index-b6934baf.js +0 -50
- package/_internal/components/drag-handle/index-80e5af6c.js +0 -52
- package/_internal/components/dropdown/index-cebfc268.js +0 -147
- package/_internal/components/expansion-panel/index-9d45a211.js +0 -167
- package/_internal/components/flag/index-33e9d909.js +0 -59
- package/_internal/components/flex-box/index-0d6b6b43.js +0 -56
- package/_internal/components/generic-block/index-836c4352.js +0 -124
- package/_internal/components/grid/index-8c16a4f1.js +0 -104
- package/_internal/components/grid-column/index-4a2f56bb.js +0 -59
- package/_internal/components/heading/index-fd558a9a.js +0 -53
- package/_internal/components/icon/index-e7b9b40e.js +0 -1
- package/_internal/components/image-block/index-7021c2f1.js +0 -110
- package/_internal/components/image-lightbox/index-27017547.js +0 -759
- package/_internal/components/inline-list/index-52efec7f.js +0 -74
- package/_internal/components/input-helper/index-5a837e7c.js +0 -71
- package/_internal/components/input-label/index-0113f382.js +0 -59
- package/_internal/components/lightbox/index-fad5a9f2.js +0 -155
- package/_internal/components/link/index-008bae4b.js +0 -72
- package/_internal/components/link-preview/index-3e9c32f2.js +0 -117
- package/_internal/components/list/index-da88c6e9.js +0 -71
- package/_internal/components/message/index-17b568f2.js +0 -98
- package/_internal/components/mosaic/index-2d40e01c.js +0 -95
- package/_internal/components/navigation/index-dc17c639.js +0 -225
- package/_internal/components/notification/index-a1101015.js +0 -146
- package/_internal/components/popover/index-dbca63f1.js +0 -2
- package/_internal/components/popover-dialog/index-654d2abc.js +0 -66
- package/_internal/components/post-block/index-4b6b4dcb.js +0 -109
- package/_internal/components/progress/index-6f578c31.js +0 -182
- package/_internal/components/progress-tracker/index-700bc4c2.js +0 -309
- package/_internal/components/radio-button/index-89b725af.js +0 -149
- package/_internal/components/select/index-2755aa32.js +0 -458
- package/_internal/components/side-navigation/index-0bbe1fdd.js +0 -165
- package/_internal/components/skeleton/index-b2f8501c.js +0 -166
- package/_internal/components/slider/index-4f9b891b.js +0 -311
- package/_internal/components/slideshow/index-d4604589.js +0 -150
- package/_internal/components/switch/index-58fe0f0c.js +0 -122
- package/_internal/components/table/index-d541aa88.js +0 -297
- package/_internal/components/tabs/index-af1538d6.js +0 -298
- package/_internal/components/text/index-5bfc6d5e.js +0 -1
- package/_internal/components/text-field/index-47c98d09.js +0 -360
- package/_internal/components/thumbnail/index-71545d95.js +0 -41
- package/_internal/components/toolbar/index-7041a5a6.js +0 -61
- package/_internal/components/tooltip/index-8bb97e60.js +0 -327
- package/_internal/components/uploader/index-8f6f55de.js +0 -153
- package/_internal/components/user-block/index-70d4ce8f.js +0 -145
- package/_internal/d0e3f49e.js +0 -23
- package/_internal/de24f857.js +0 -3
- package/_internal/e806b848.js +0 -8
- package/_internal/e913a3af.js +0 -117
- package/_internal/ea04260d.js +0 -28
- package/_internal/eaf6c45a.js +0 -3
- package/_internal/ebdcb0c7.js +0 -60
- package/_internal/ef5d1aac.js +0 -3
- package/_internal/f0d7d6ea.js +0 -29
- package/_internal/utils/ClickAwayProvider/index-1234ce76.js +0 -94
- package/_internal/utils/MaterialThemeSwitcher/index-8d22de5a.js +0 -48
- package/_internal/utils/Portal/index-6e0a7404.js +0 -44
- package/_internal/utils/disabled/index-075b99c3.js +0 -36
- package/_internal/utils/type/index-ea9fc197.js +0 -2
|
@@ -1,150 +0,0 @@
|
|
|
1
|
-
import React__default, { useEffect } from 'react';
|
|
2
|
-
import { a as SlideshowControls, b as Slides, c as buildSlideShowGroupId, D as DEFAULT_OPTIONS } from '../../b326655a.js';
|
|
3
|
-
export { S as SlideshowItem } from '../../b326655a.js';
|
|
4
|
-
import { m as mergeRefs } from '../../f0d7d6ea.js';
|
|
5
|
-
import { u as useTheme } from '../../3181f000.js';
|
|
6
|
-
import { f as forwardRef } from '../../8bce732e.js';
|
|
7
|
-
import { jsx } from 'react/jsx-runtime';
|
|
8
|
-
import { Theme } from '@lumx/core/js/constants';
|
|
9
|
-
|
|
10
|
-
/**
|
|
11
|
-
* Hook that allows to control when there is a focus event within a given element, meaning
|
|
12
|
-
* that any element within the given target will trigger the focus in and focus out events.
|
|
13
|
-
* @param options - UseFocusWithinOptions
|
|
14
|
-
*/
|
|
15
|
-
const useFocusWithin = ({
|
|
16
|
-
element,
|
|
17
|
-
onFocusIn,
|
|
18
|
-
onFocusOut
|
|
19
|
-
}) => {
|
|
20
|
-
useEffect(() => {
|
|
21
|
-
if (element) {
|
|
22
|
-
element.addEventListener('focusin', onFocusIn);
|
|
23
|
-
element.addEventListener('focusout', onFocusOut);
|
|
24
|
-
}
|
|
25
|
-
return () => {
|
|
26
|
-
if (element) {
|
|
27
|
-
element.removeEventListener('focusin', onFocusIn);
|
|
28
|
-
element.removeEventListener('focusout', onFocusOut);
|
|
29
|
-
}
|
|
30
|
-
};
|
|
31
|
-
}, [onFocusIn, element, onFocusOut]);
|
|
32
|
-
};
|
|
33
|
-
|
|
34
|
-
/**
|
|
35
|
-
* Component default props.
|
|
36
|
-
*/
|
|
37
|
-
const DEFAULT_PROPS = DEFAULT_OPTIONS;
|
|
38
|
-
|
|
39
|
-
/**
|
|
40
|
-
* Slideshow component.
|
|
41
|
-
*
|
|
42
|
-
* @param props Component props.
|
|
43
|
-
* @param ref Component ref.
|
|
44
|
-
* @return React element.
|
|
45
|
-
*/
|
|
46
|
-
const Slideshow = forwardRef((props, ref) => {
|
|
47
|
-
const defaultTheme = useTheme() || Theme.light;
|
|
48
|
-
const {
|
|
49
|
-
activeIndex,
|
|
50
|
-
autoPlay = DEFAULT_PROPS.autoPlay,
|
|
51
|
-
children,
|
|
52
|
-
className,
|
|
53
|
-
fillHeight,
|
|
54
|
-
groupBy = DEFAULT_OPTIONS.groupBy,
|
|
55
|
-
interval = DEFAULT_PROPS.interval,
|
|
56
|
-
onChange,
|
|
57
|
-
slideshowControlsProps,
|
|
58
|
-
theme = defaultTheme,
|
|
59
|
-
id,
|
|
60
|
-
slidesId,
|
|
61
|
-
slideGroupLabel,
|
|
62
|
-
...forwardedProps
|
|
63
|
-
} = props;
|
|
64
|
-
// Number of slideshow items.
|
|
65
|
-
const itemsCount = React__default.Children.count(children);
|
|
66
|
-
const {
|
|
67
|
-
activeIndex: currentIndex,
|
|
68
|
-
slideshowId,
|
|
69
|
-
setSlideshow,
|
|
70
|
-
isAutoPlaying,
|
|
71
|
-
slideshowSlidesId,
|
|
72
|
-
slidesCount,
|
|
73
|
-
onNextClick,
|
|
74
|
-
onPaginationClick,
|
|
75
|
-
onPreviousClick,
|
|
76
|
-
slideshow,
|
|
77
|
-
stopAutoPlay,
|
|
78
|
-
startAutoPlay,
|
|
79
|
-
toggleAutoPlay,
|
|
80
|
-
toggleForcePause
|
|
81
|
-
} = SlideshowControls.useSlideshowControls({
|
|
82
|
-
activeIndex,
|
|
83
|
-
defaultActiveIndex: DEFAULT_PROPS.activeIndex,
|
|
84
|
-
autoPlay: Boolean(autoPlay),
|
|
85
|
-
itemsCount,
|
|
86
|
-
groupBy,
|
|
87
|
-
id,
|
|
88
|
-
interval,
|
|
89
|
-
onChange,
|
|
90
|
-
slidesId
|
|
91
|
-
});
|
|
92
|
-
useFocusWithin({
|
|
93
|
-
element: slideshow,
|
|
94
|
-
onFocusIn: stopAutoPlay,
|
|
95
|
-
onFocusOut: startAutoPlay
|
|
96
|
-
});
|
|
97
|
-
const showControls = slideshowControlsProps && slidesCount > 1;
|
|
98
|
-
return /*#__PURE__*/jsx(Slides, {
|
|
99
|
-
activeIndex: currentIndex,
|
|
100
|
-
id: slideshowId,
|
|
101
|
-
className: className,
|
|
102
|
-
theme: theme,
|
|
103
|
-
fillHeight: fillHeight,
|
|
104
|
-
groupBy: groupBy,
|
|
105
|
-
isAutoPlaying: isAutoPlaying,
|
|
106
|
-
autoPlay: autoPlay,
|
|
107
|
-
slidesId: slideshowSlidesId,
|
|
108
|
-
toggleAutoPlay: toggleAutoPlay,
|
|
109
|
-
ref: mergeRefs(ref, setSlideshow),
|
|
110
|
-
hasControls: showControls,
|
|
111
|
-
slideGroupLabel: slideGroupLabel,
|
|
112
|
-
afterSlides: slideshowControlsProps && slidesCount > 1 ? /*#__PURE__*/jsx("div", {
|
|
113
|
-
className: `${Slides.className}__controls`,
|
|
114
|
-
children: /*#__PURE__*/jsx(SlideshowControls, {
|
|
115
|
-
...slideshowControlsProps,
|
|
116
|
-
activeIndex: currentIndex,
|
|
117
|
-
onPaginationClick: onPaginationClick,
|
|
118
|
-
onNextClick: onNextClick,
|
|
119
|
-
onPreviousClick: onPreviousClick,
|
|
120
|
-
slidesCount: slidesCount,
|
|
121
|
-
parentRef: slideshow,
|
|
122
|
-
theme: theme,
|
|
123
|
-
isAutoPlaying: isAutoPlaying,
|
|
124
|
-
nextButtonProps: {
|
|
125
|
-
'aria-controls': slideshowSlidesId,
|
|
126
|
-
...slideshowControlsProps.nextButtonProps
|
|
127
|
-
},
|
|
128
|
-
previousButtonProps: {
|
|
129
|
-
'aria-controls': slideshowSlidesId,
|
|
130
|
-
...slideshowControlsProps.previousButtonProps
|
|
131
|
-
},
|
|
132
|
-
playButtonProps: autoPlay ? {
|
|
133
|
-
'aria-controls': slideshowSlidesId,
|
|
134
|
-
onClick: toggleForcePause,
|
|
135
|
-
...slideshowControlsProps.playButtonProps
|
|
136
|
-
} : undefined,
|
|
137
|
-
paginationItemProps: index => ({
|
|
138
|
-
'aria-controls': buildSlideShowGroupId(slideshowSlidesId, index),
|
|
139
|
-
...slideshowControlsProps.paginationItemProps?.(index)
|
|
140
|
-
})
|
|
141
|
-
})
|
|
142
|
-
}) : undefined,
|
|
143
|
-
...forwardedProps,
|
|
144
|
-
children: children
|
|
145
|
-
});
|
|
146
|
-
});
|
|
147
|
-
Slideshow.displayName = 'Slideshow';
|
|
148
|
-
Slideshow.defaultProps = DEFAULT_PROPS;
|
|
149
|
-
|
|
150
|
-
export { Slides, Slideshow, SlideshowControls };
|
|
@@ -1,122 +0,0 @@
|
|
|
1
|
-
import { Children } from 'react';
|
|
2
|
-
import classNames from 'classnames';
|
|
3
|
-
import isEmpty from 'lodash/isEmpty';
|
|
4
|
-
import { getRootClassName, handleBasicClasses } from '@lumx/core/js/utils/className';
|
|
5
|
-
import { u as useId } from '../../3a1facc0.js';
|
|
6
|
-
import { u as useTheme } from '../../3181f000.js';
|
|
7
|
-
import { f as forwardRef } from '../../8bce732e.js';
|
|
8
|
-
import { useDisableStateProps } from '../../utils/disabled/index-075b99c3.js';
|
|
9
|
-
import { jsxs, jsx } from 'react/jsx-runtime';
|
|
10
|
-
import { Alignment, Theme } from '@lumx/core/js/constants';
|
|
11
|
-
import { InputLabel } from '../input-label/index-0113f382.js';
|
|
12
|
-
import { InputHelper } from '../input-helper/index-5a837e7c.js';
|
|
13
|
-
|
|
14
|
-
/**
|
|
15
|
-
* Component display name.
|
|
16
|
-
*/
|
|
17
|
-
const COMPONENT_NAME = 'Switch';
|
|
18
|
-
|
|
19
|
-
/**
|
|
20
|
-
* Component default class name and class prefix.
|
|
21
|
-
*/
|
|
22
|
-
const CLASSNAME = getRootClassName(COMPONENT_NAME);
|
|
23
|
-
|
|
24
|
-
/**
|
|
25
|
-
* Component default props.
|
|
26
|
-
*/
|
|
27
|
-
const DEFAULT_PROPS = {
|
|
28
|
-
position: Alignment.left
|
|
29
|
-
};
|
|
30
|
-
|
|
31
|
-
/**
|
|
32
|
-
* Switch component.
|
|
33
|
-
*
|
|
34
|
-
* @param props Component props.
|
|
35
|
-
* @param ref Component ref.
|
|
36
|
-
* @return React element.
|
|
37
|
-
*/
|
|
38
|
-
const Switch = forwardRef((props, ref) => {
|
|
39
|
-
const {
|
|
40
|
-
isAnyDisabled,
|
|
41
|
-
disabledStateProps,
|
|
42
|
-
otherProps
|
|
43
|
-
} = useDisableStateProps(props);
|
|
44
|
-
const defaultTheme = useTheme() || Theme.light;
|
|
45
|
-
const {
|
|
46
|
-
checked,
|
|
47
|
-
children,
|
|
48
|
-
className,
|
|
49
|
-
helper,
|
|
50
|
-
id,
|
|
51
|
-
isChecked = checked,
|
|
52
|
-
name,
|
|
53
|
-
onChange,
|
|
54
|
-
position = DEFAULT_PROPS.position,
|
|
55
|
-
theme = defaultTheme,
|
|
56
|
-
value,
|
|
57
|
-
inputProps = {},
|
|
58
|
-
...forwardedProps
|
|
59
|
-
} = otherProps;
|
|
60
|
-
const generatedInputId = useId();
|
|
61
|
-
const inputId = id || generatedInputId;
|
|
62
|
-
const handleChange = event => {
|
|
63
|
-
if (onChange) {
|
|
64
|
-
onChange(!isChecked, value, name, event);
|
|
65
|
-
}
|
|
66
|
-
};
|
|
67
|
-
return /*#__PURE__*/jsxs("div", {
|
|
68
|
-
ref: ref,
|
|
69
|
-
...forwardedProps,
|
|
70
|
-
className: classNames(className, handleBasicClasses({
|
|
71
|
-
prefix: CLASSNAME,
|
|
72
|
-
isChecked,
|
|
73
|
-
isDisabled: isAnyDisabled,
|
|
74
|
-
position,
|
|
75
|
-
theme,
|
|
76
|
-
isUnchecked: !isChecked
|
|
77
|
-
})),
|
|
78
|
-
children: [/*#__PURE__*/jsxs("div", {
|
|
79
|
-
className: `${CLASSNAME}__input-wrapper`,
|
|
80
|
-
children: [/*#__PURE__*/jsx("input", {
|
|
81
|
-
type: "checkbox",
|
|
82
|
-
role: "switch",
|
|
83
|
-
id: inputId,
|
|
84
|
-
className: `${CLASSNAME}__input-native`,
|
|
85
|
-
name: name,
|
|
86
|
-
value: value,
|
|
87
|
-
...disabledStateProps,
|
|
88
|
-
readOnly: inputProps.readOnly || isAnyDisabled,
|
|
89
|
-
checked: isChecked,
|
|
90
|
-
"aria-checked": Boolean(isChecked),
|
|
91
|
-
onChange: handleChange,
|
|
92
|
-
"aria-describedby": helper ? `${inputId}-helper` : undefined,
|
|
93
|
-
...inputProps
|
|
94
|
-
}), /*#__PURE__*/jsxs("div", {
|
|
95
|
-
className: `${CLASSNAME}__input-placeholder`,
|
|
96
|
-
children: [/*#__PURE__*/jsx("div", {
|
|
97
|
-
className: `${CLASSNAME}__input-background`
|
|
98
|
-
}), /*#__PURE__*/jsx("div", {
|
|
99
|
-
className: `${CLASSNAME}__input-indicator`
|
|
100
|
-
})]
|
|
101
|
-
})]
|
|
102
|
-
}), Children.count(children) > 0 && /*#__PURE__*/jsxs("div", {
|
|
103
|
-
className: `${CLASSNAME}__content`,
|
|
104
|
-
children: [/*#__PURE__*/jsx(InputLabel, {
|
|
105
|
-
htmlFor: inputId,
|
|
106
|
-
theme: theme,
|
|
107
|
-
className: `${CLASSNAME}__label`,
|
|
108
|
-
children: children
|
|
109
|
-
}), !isEmpty(helper) && /*#__PURE__*/jsx(InputHelper, {
|
|
110
|
-
id: `${inputId}-helper`,
|
|
111
|
-
theme: theme,
|
|
112
|
-
className: `${CLASSNAME}__helper`,
|
|
113
|
-
children: helper
|
|
114
|
-
})]
|
|
115
|
-
})]
|
|
116
|
-
});
|
|
117
|
-
});
|
|
118
|
-
Switch.displayName = COMPONENT_NAME;
|
|
119
|
-
Switch.className = CLASSNAME;
|
|
120
|
-
Switch.defaultProps = DEFAULT_PROPS;
|
|
121
|
-
|
|
122
|
-
export { Switch };
|
|
@@ -1,297 +0,0 @@
|
|
|
1
|
-
import classNames from 'classnames';
|
|
2
|
-
import { getRootClassName, handleBasicClasses } from '@lumx/core/js/utils/className';
|
|
3
|
-
import { u as useTheme } from '../../3181f000.js';
|
|
4
|
-
import { f as forwardRef } from '../../8bce732e.js';
|
|
5
|
-
import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
|
|
6
|
-
import { Theme, Size } from '@lumx/core/js/constants';
|
|
7
|
-
import { I as Icon } from '../../bace1bf1.js';
|
|
8
|
-
import { useDisableStateProps } from '../../utils/disabled/index-075b99c3.js';
|
|
9
|
-
|
|
10
|
-
const mdiArrowDown = 'M11 4h2v12l5.5-5.5 1.42 1.42L12 19.84l-7.92-7.92L5.5 10.5 11 16z';
|
|
11
|
-
|
|
12
|
-
const mdiArrowUp = 'M13 20h-2V8l-5.5 5.5-1.42-1.42L12 4.16l7.92 7.92-1.42 1.42L13 8z';
|
|
13
|
-
|
|
14
|
-
/**
|
|
15
|
-
* Component display name.
|
|
16
|
-
*/
|
|
17
|
-
const COMPONENT_NAME$4 = 'Table';
|
|
18
|
-
|
|
19
|
-
/**
|
|
20
|
-
* Component default class name and class prefix.
|
|
21
|
-
*/
|
|
22
|
-
const CLASSNAME$4 = getRootClassName(COMPONENT_NAME$4);
|
|
23
|
-
|
|
24
|
-
/**
|
|
25
|
-
* Component default props.
|
|
26
|
-
*/
|
|
27
|
-
const DEFAULT_PROPS$3 = {};
|
|
28
|
-
|
|
29
|
-
/**
|
|
30
|
-
* Table component.
|
|
31
|
-
*
|
|
32
|
-
* @param props Component props.
|
|
33
|
-
* @param ref Component ref.
|
|
34
|
-
* @return React element.
|
|
35
|
-
*/
|
|
36
|
-
const Table = forwardRef((props, ref) => {
|
|
37
|
-
const defaultTheme = useTheme() || Theme.light;
|
|
38
|
-
const {
|
|
39
|
-
children,
|
|
40
|
-
className,
|
|
41
|
-
hasBefore,
|
|
42
|
-
hasDividers,
|
|
43
|
-
theme = defaultTheme,
|
|
44
|
-
...forwardedProps
|
|
45
|
-
} = props;
|
|
46
|
-
return /*#__PURE__*/jsx("table", {
|
|
47
|
-
ref: ref,
|
|
48
|
-
...forwardedProps,
|
|
49
|
-
className: classNames(className, handleBasicClasses({
|
|
50
|
-
prefix: CLASSNAME$4,
|
|
51
|
-
hasBefore,
|
|
52
|
-
hasDividers,
|
|
53
|
-
theme
|
|
54
|
-
})),
|
|
55
|
-
children: children
|
|
56
|
-
});
|
|
57
|
-
});
|
|
58
|
-
Table.displayName = COMPONENT_NAME$4;
|
|
59
|
-
Table.className = CLASSNAME$4;
|
|
60
|
-
Table.defaultProps = DEFAULT_PROPS$3;
|
|
61
|
-
|
|
62
|
-
/**
|
|
63
|
-
* Component display name.
|
|
64
|
-
*/
|
|
65
|
-
const COMPONENT_NAME$3 = 'TableBody';
|
|
66
|
-
|
|
67
|
-
/**
|
|
68
|
-
* Component default class name and class prefix.
|
|
69
|
-
*/
|
|
70
|
-
const CLASSNAME$3 = getRootClassName(COMPONENT_NAME$3, true);
|
|
71
|
-
|
|
72
|
-
/**
|
|
73
|
-
* TableBody component.
|
|
74
|
-
*
|
|
75
|
-
* @param props Component props.
|
|
76
|
-
* @param ref Component ref.
|
|
77
|
-
* @return React element.
|
|
78
|
-
*/
|
|
79
|
-
const TableBody = forwardRef((props, ref) => {
|
|
80
|
-
const {
|
|
81
|
-
children,
|
|
82
|
-
className,
|
|
83
|
-
...forwardedProps
|
|
84
|
-
} = props;
|
|
85
|
-
return /*#__PURE__*/jsx("tbody", {
|
|
86
|
-
ref: ref,
|
|
87
|
-
...forwardedProps,
|
|
88
|
-
className: classNames(className, CLASSNAME$3),
|
|
89
|
-
children: children
|
|
90
|
-
});
|
|
91
|
-
});
|
|
92
|
-
TableBody.displayName = COMPONENT_NAME$3;
|
|
93
|
-
TableBody.className = CLASSNAME$3;
|
|
94
|
-
|
|
95
|
-
const ThOrder = {
|
|
96
|
-
asc: 'asc',
|
|
97
|
-
desc: 'desc'
|
|
98
|
-
};
|
|
99
|
-
/**
|
|
100
|
-
* Table cell variants.
|
|
101
|
-
*/
|
|
102
|
-
const TableCellVariant = {
|
|
103
|
-
body: 'body',
|
|
104
|
-
head: 'head'
|
|
105
|
-
};
|
|
106
|
-
|
|
107
|
-
/**
|
|
108
|
-
* Defines the props of the component.
|
|
109
|
-
*/
|
|
110
|
-
|
|
111
|
-
/**
|
|
112
|
-
* Component display name.
|
|
113
|
-
*/
|
|
114
|
-
const COMPONENT_NAME$2 = 'TableCell';
|
|
115
|
-
|
|
116
|
-
/**
|
|
117
|
-
* Component default class name and class prefix.
|
|
118
|
-
*/
|
|
119
|
-
const CLASSNAME$2 = getRootClassName(COMPONENT_NAME$2, true);
|
|
120
|
-
|
|
121
|
-
/**
|
|
122
|
-
* Component default props.
|
|
123
|
-
*/
|
|
124
|
-
const DEFAULT_PROPS$2 = {
|
|
125
|
-
variant: TableCellVariant.body
|
|
126
|
-
};
|
|
127
|
-
|
|
128
|
-
/**
|
|
129
|
-
* TableCell component.
|
|
130
|
-
*
|
|
131
|
-
* @param props Component props.
|
|
132
|
-
* @param ref Component ref.
|
|
133
|
-
* @return React element.
|
|
134
|
-
*/
|
|
135
|
-
const TableCell = forwardRef((props, ref) => {
|
|
136
|
-
const {
|
|
137
|
-
children,
|
|
138
|
-
className,
|
|
139
|
-
icon,
|
|
140
|
-
isSortable,
|
|
141
|
-
onHeaderClick,
|
|
142
|
-
sortOrder,
|
|
143
|
-
variant = DEFAULT_PROPS$2.variant,
|
|
144
|
-
...forwardedProps
|
|
145
|
-
} = props;
|
|
146
|
-
|
|
147
|
-
// Use button if clickable
|
|
148
|
-
const Wrapper = onHeaderClick ? 'button' : 'div';
|
|
149
|
-
const wrapperProps = Wrapper === 'button' ? {
|
|
150
|
-
type: 'button',
|
|
151
|
-
onClick: onHeaderClick
|
|
152
|
-
} : undefined;
|
|
153
|
-
|
|
154
|
-
// ARIA sort
|
|
155
|
-
let ariaSort;
|
|
156
|
-
if (isSortable) {
|
|
157
|
-
ariaSort = 'none';
|
|
158
|
-
if (sortOrder === ThOrder.asc) ariaSort = 'ascending';
|
|
159
|
-
if (sortOrder === ThOrder.desc) ariaSort = 'descending';
|
|
160
|
-
}
|
|
161
|
-
return /*#__PURE__*/jsxs(Fragment, {
|
|
162
|
-
children: [variant === TableCellVariant.head && /*#__PURE__*/jsx("th", {
|
|
163
|
-
ref: ref,
|
|
164
|
-
...forwardedProps,
|
|
165
|
-
className: classNames(handleBasicClasses({
|
|
166
|
-
prefix: CLASSNAME$2,
|
|
167
|
-
isSortable,
|
|
168
|
-
isSorted: isSortable && !!sortOrder
|
|
169
|
-
}), className, `${CLASSNAME$2}--head`),
|
|
170
|
-
"aria-sort": ariaSort,
|
|
171
|
-
children: /*#__PURE__*/jsxs(Wrapper, {
|
|
172
|
-
className: `${CLASSNAME$2}-wrapper`,
|
|
173
|
-
...wrapperProps,
|
|
174
|
-
children: [icon && !isSortable && /*#__PURE__*/jsx(Icon, {
|
|
175
|
-
className: `${CLASSNAME$2}-icon`,
|
|
176
|
-
icon: icon,
|
|
177
|
-
size: Size.xxs
|
|
178
|
-
}), isSortable && sortOrder === ThOrder.asc && /*#__PURE__*/jsx(Icon, {
|
|
179
|
-
className: `${CLASSNAME$2}-icon`,
|
|
180
|
-
icon: mdiArrowUp,
|
|
181
|
-
size: Size.xxs
|
|
182
|
-
}), isSortable && sortOrder === ThOrder.desc && /*#__PURE__*/jsx(Icon, {
|
|
183
|
-
className: `${CLASSNAME$2}-icon`,
|
|
184
|
-
icon: mdiArrowDown,
|
|
185
|
-
size: Size.xxs
|
|
186
|
-
}), /*#__PURE__*/jsx("div", {
|
|
187
|
-
className: `${CLASSNAME$2}-content`,
|
|
188
|
-
children: children
|
|
189
|
-
})]
|
|
190
|
-
})
|
|
191
|
-
}), variant === TableCellVariant.body && /*#__PURE__*/jsx("td", {
|
|
192
|
-
...forwardedProps,
|
|
193
|
-
className: classNames(className, CLASSNAME$2, `${CLASSNAME$2}--body`),
|
|
194
|
-
children: /*#__PURE__*/jsx("div", {
|
|
195
|
-
className: `${CLASSNAME$2}-content`,
|
|
196
|
-
children: children
|
|
197
|
-
})
|
|
198
|
-
})]
|
|
199
|
-
});
|
|
200
|
-
});
|
|
201
|
-
TableCell.displayName = COMPONENT_NAME$2;
|
|
202
|
-
TableCell.className = CLASSNAME$2;
|
|
203
|
-
TableCell.defaultProps = DEFAULT_PROPS$2;
|
|
204
|
-
|
|
205
|
-
/**
|
|
206
|
-
* Component display name.
|
|
207
|
-
*/
|
|
208
|
-
const COMPONENT_NAME$1 = 'TableHeader';
|
|
209
|
-
|
|
210
|
-
/**
|
|
211
|
-
* Component default class name and class prefix.
|
|
212
|
-
*/
|
|
213
|
-
const CLASSNAME$1 = getRootClassName(COMPONENT_NAME$1, true);
|
|
214
|
-
|
|
215
|
-
/**
|
|
216
|
-
* Component default props.
|
|
217
|
-
*/
|
|
218
|
-
const DEFAULT_PROPS$1 = {};
|
|
219
|
-
|
|
220
|
-
/**
|
|
221
|
-
* TableHeader component.
|
|
222
|
-
*
|
|
223
|
-
* @param props Component props.
|
|
224
|
-
* @param ref Component ref.
|
|
225
|
-
* @return React element.
|
|
226
|
-
*/
|
|
227
|
-
const TableHeader = forwardRef((props, ref) => {
|
|
228
|
-
const {
|
|
229
|
-
children,
|
|
230
|
-
className,
|
|
231
|
-
...forwardedProps
|
|
232
|
-
} = props;
|
|
233
|
-
return /*#__PURE__*/jsx("thead", {
|
|
234
|
-
ref: ref,
|
|
235
|
-
...forwardedProps,
|
|
236
|
-
className: classNames(className, CLASSNAME$1),
|
|
237
|
-
children: children
|
|
238
|
-
});
|
|
239
|
-
});
|
|
240
|
-
TableHeader.displayName = COMPONENT_NAME$1;
|
|
241
|
-
TableHeader.className = CLASSNAME$1;
|
|
242
|
-
TableHeader.defaultProps = DEFAULT_PROPS$1;
|
|
243
|
-
|
|
244
|
-
/**
|
|
245
|
-
* Component display name.
|
|
246
|
-
*/
|
|
247
|
-
const COMPONENT_NAME = 'TableRow';
|
|
248
|
-
|
|
249
|
-
/**
|
|
250
|
-
* Component default class name and class prefix.
|
|
251
|
-
*/
|
|
252
|
-
const CLASSNAME = getRootClassName(COMPONENT_NAME, true);
|
|
253
|
-
|
|
254
|
-
/**
|
|
255
|
-
* Component default props.
|
|
256
|
-
*/
|
|
257
|
-
const DEFAULT_PROPS = {};
|
|
258
|
-
|
|
259
|
-
/**
|
|
260
|
-
* TableRow component.
|
|
261
|
-
*
|
|
262
|
-
* @param props Component props.
|
|
263
|
-
* @param ref Component ref.
|
|
264
|
-
* @return React element.
|
|
265
|
-
*/
|
|
266
|
-
const TableRow = forwardRef((props, ref) => {
|
|
267
|
-
const {
|
|
268
|
-
isAnyDisabled,
|
|
269
|
-
disabledStateProps,
|
|
270
|
-
otherProps
|
|
271
|
-
} = useDisableStateProps(props);
|
|
272
|
-
const {
|
|
273
|
-
children,
|
|
274
|
-
className,
|
|
275
|
-
isClickable,
|
|
276
|
-
isSelected,
|
|
277
|
-
...forwardedProps
|
|
278
|
-
} = otherProps;
|
|
279
|
-
return /*#__PURE__*/jsx("tr", {
|
|
280
|
-
ref: ref,
|
|
281
|
-
tabIndex: isClickable && !disabledStateProps.disabled ? 0 : -1,
|
|
282
|
-
...forwardedProps,
|
|
283
|
-
className: classNames(className, handleBasicClasses({
|
|
284
|
-
isClickable: isClickable && !isAnyDisabled,
|
|
285
|
-
isDisabled: isAnyDisabled,
|
|
286
|
-
isSelected: isSelected && !isAnyDisabled,
|
|
287
|
-
prefix: CLASSNAME
|
|
288
|
-
})),
|
|
289
|
-
"aria-disabled": isAnyDisabled,
|
|
290
|
-
children: children
|
|
291
|
-
});
|
|
292
|
-
});
|
|
293
|
-
TableRow.displayName = COMPONENT_NAME;
|
|
294
|
-
TableRow.className = CLASSNAME;
|
|
295
|
-
TableRow.defaultProps = DEFAULT_PROPS;
|
|
296
|
-
|
|
297
|
-
export { Table, TableBody, TableCell, TableCellVariant, TableHeader, TableRow, ThOrder };
|