@ringcentral/juno 2.16.0 → 2.18.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (81) hide show
  1. package/components/Backdrop/styles/BackdropStyle.js +2 -1
  2. package/components/Backdrop/utils/BackdropUtils.js +1 -1
  3. package/components/Dialog/Dialog.js +2 -1
  4. package/components/Downshift/Downshift.d.ts +1 -1
  5. package/components/Drawer/Drawer.js +2 -1
  6. package/components/Text/index.d.ts +0 -1
  7. package/components/Text/index.js +0 -1
  8. package/components/index.d.ts +0 -1
  9. package/components/index.js +0 -1
  10. package/es6/components/Backdrop/styles/BackdropStyle.js +2 -1
  11. package/es6/components/Backdrop/utils/BackdropUtils.js +1 -1
  12. package/es6/components/Dialog/Dialog.js +2 -1
  13. package/es6/components/Drawer/Drawer.js +2 -1
  14. package/es6/components/Text/index.js +0 -1
  15. package/es6/components/index.js +0 -1
  16. package/foundation/theme/ThemeHandler.d.ts +1 -1
  17. package/foundation/theme/ThemeSwitcherProvider/ThemeSwitcherProvider.d.ts +2 -2
  18. package/package.json +1 -1
  19. package/components/Autocomplete/Autocomplete.d.ts +0 -4
  20. package/components/Autocomplete/Autocomplete.js +0 -7
  21. package/components/Autocomplete/index.d.ts +0 -1
  22. package/components/Autocomplete/index.js +0 -4
  23. package/components/Grid/deprecated/Grid.d.ts +0 -6
  24. package/components/Grid/deprecated/Grid.js +0 -8
  25. package/components/Grid/deprecated/index.d.ts +0 -1
  26. package/components/Grid/deprecated/index.js +0 -4
  27. package/components/ImageView/ImageView.d.ts +0 -311
  28. package/components/ImageView/ImageView.js +0 -206
  29. package/components/ImageView/index.d.ts +0 -1
  30. package/components/ImageView/index.js +0 -4
  31. package/components/Tables/Table.d.ts +0 -34
  32. package/components/Tables/Table.js +0 -31
  33. package/components/Tables/TableBodyCellContent.d.ts +0 -10
  34. package/components/Tables/TableBodyCellContent.js +0 -16
  35. package/components/Tables/TableHead.d.ts +0 -4
  36. package/components/Tables/TableHead.js +0 -18
  37. package/components/Tables/TableHeadCell.d.ts +0 -4
  38. package/components/Tables/TableHeadCell.js +0 -64
  39. package/components/Tables/TableRow.d.ts +0 -3
  40. package/components/Tables/TableRow.js +0 -6
  41. package/components/Tables/index.d.ts +0 -7
  42. package/components/Tables/index.js +0 -10
  43. package/components/Tables/styled.d.ts +0 -24
  44. package/components/Tables/styled.js +0 -46
  45. package/components/Tables/types.d.ts +0 -60
  46. package/components/Tables/types.js +0 -49
  47. package/components/Text/TextWithEllipsis.d.ts +0 -6
  48. package/components/Text/TextWithEllipsis.js +0 -21
  49. package/components/TextWithHighlight/TextWithHighlight.d.ts +0 -6
  50. package/components/TextWithHighlight/TextWithHighlight.js +0 -20
  51. package/components/TextWithHighlight/index.d.ts +0 -1
  52. package/components/TextWithHighlight/index.js +0 -4
  53. package/components/TextWithLink/TextWithLink.d.ts +0 -14
  54. package/components/TextWithLink/TextWithLink.js +0 -31
  55. package/components/TextWithLink/index.d.ts +0 -1
  56. package/components/TextWithLink/index.js +0 -4
  57. package/components/TextWithTooltip/TextWithTooltip.d.ts +0 -8
  58. package/components/TextWithTooltip/TextWithTooltip.js +0 -35
  59. package/components/TextWithTooltip/index.d.ts +0 -1
  60. package/components/TextWithTooltip/index.js +0 -4
  61. package/es6/components/Autocomplete/Autocomplete.js +0 -4
  62. package/es6/components/Autocomplete/index.js +0 -1
  63. package/es6/components/Grid/deprecated/Grid.js +0 -6
  64. package/es6/components/Grid/deprecated/index.js +0 -1
  65. package/es6/components/ImageView/ImageView.js +0 -204
  66. package/es6/components/ImageView/index.js +0 -1
  67. package/es6/components/Tables/Table.js +0 -29
  68. package/es6/components/Tables/TableBodyCellContent.js +0 -14
  69. package/es6/components/Tables/TableHead.js +0 -15
  70. package/es6/components/Tables/TableHeadCell.js +0 -62
  71. package/es6/components/Tables/TableRow.js +0 -4
  72. package/es6/components/Tables/index.js +0 -7
  73. package/es6/components/Tables/styled.js +0 -38
  74. package/es6/components/Tables/types.js +0 -41
  75. package/es6/components/Text/TextWithEllipsis.js +0 -19
  76. package/es6/components/TextWithHighlight/TextWithHighlight.js +0 -18
  77. package/es6/components/TextWithHighlight/index.js +0 -1
  78. package/es6/components/TextWithLink/TextWithLink.js +0 -29
  79. package/es6/components/TextWithLink/index.js +0 -1
  80. package/es6/components/TextWithTooltip/TextWithTooltip.js +0 -33
  81. package/es6/components/TextWithTooltip/index.js +0 -1
@@ -1,206 +0,0 @@
1
- "use strict";
2
- Object.defineProperty(exports, "__esModule", { value: true });
3
- var tslib_1 = require("tslib");
4
- var react_1 = tslib_1.__importStar(require("react"));
5
- var cloneDeep_1 = tslib_1.__importDefault(require("lodash/cloneDeep"));
6
- var values_1 = tslib_1.__importDefault(require("lodash/values"));
7
- var juno_icon_1 = require("@ringcentral/juno-icon");
8
- var styled_components_1 = tslib_1.__importDefault(require("../../foundation/styled-components"));
9
- var Icon_1 = require("../Icon");
10
- var StyledLoadingPage = styled_components_1.default.div(templateObject_1 || (templateObject_1 = tslib_1.__makeTemplateObject(["\n position: absolute;\n width: 100%;\n height: 100%;\n top: 0;\n left: 0;\n display: flex;\n align-items: center;\n justify-content: center;\n"], ["\n position: absolute;\n width: 100%;\n height: 100%;\n top: 0;\n left: 0;\n display: flex;\n align-items: center;\n justify-content: center;\n"])));
11
- var StyledBackground = styled_components_1.default.div(templateObject_2 || (templateObject_2 = tslib_1.__makeTemplateObject(["\n display: block;\n overflow: hidden;\n box-shadow: ", ";\n visibility: ", ";\n user-select: none;\n height: ", "px;\n width: ", "px;\n"], ["\n display: block;\n overflow: hidden;\n box-shadow: ", ";\n visibility: ", ";\n user-select: none;\n height: ", "px;\n width: ", "px;\n"])), function (_a) {
12
- var theme = _a.theme;
13
- return theme.shadows[7];
14
- }, function (_a) {
15
- var visibility = _a.visibility;
16
- return visibility;
17
- }, function (_a) {
18
- var height = _a.height;
19
- return height;
20
- }, function (_a) {
21
- var width = _a.width;
22
- return width;
23
- });
24
- var HiddenImage = styled_components_1.default.img(templateObject_3 || (templateObject_3 = tslib_1.__makeTemplateObject(["\n visibility: hidden;\n display: none;\n"], ["\n visibility: hidden;\n display: none;\n"])));
25
- function isThumbnailMode(props) {
26
- return props.thumbnailSrc && props.thumbnailSrc !== props.src;
27
- }
28
- var RcImageView = /** @class */ (function (_super) {
29
- tslib_1.__extends(RcImageView, _super);
30
- function RcImageView(props) {
31
- var _this = _super.call(this, props) || this;
32
- _this._imageRef = react_1.createRef();
33
- _this._canvasRef = react_1.createRef();
34
- _this.getImageRef = function () {
35
- return _this.props.imageRef || _this._imageRef;
36
- };
37
- _this._drawToCanvas = function (imgBitmap) {
38
- var canvasE = _this._canvasRef.current;
39
- if (!canvasE) {
40
- return;
41
- }
42
- var ctx = canvasE.getContext('2d');
43
- if (ctx) {
44
- if (!imgBitmap) {
45
- return;
46
- }
47
- var naturalWidth = imgBitmap.width, naturalHeight = imgBitmap.height;
48
- canvasE.width = naturalWidth;
49
- canvasE.height = naturalHeight;
50
- ctx.drawImage(imgBitmap, 0, 0, naturalWidth, naturalHeight, 0, 0, naturalWidth, naturalHeight);
51
- }
52
- };
53
- _this._loadHandler = function (event) { return tslib_1.__awaiter(_this, void 0, void 0, function () {
54
- var _a, loadings, currentShow, _b, onSizeLoad, onLoad, _c, naturalWidth, naturalHeight, performanceTracerEnd, target, bitmap;
55
- var _d;
56
- return tslib_1.__generator(this, function (_e) {
57
- switch (_e.label) {
58
- case 0:
59
- _a = this.state, loadings = _a.loadings, currentShow = _a.currentShow;
60
- _b = this.props, onSizeLoad = _b.onSizeLoad, onLoad = _b.onLoad;
61
- if (currentShow === 'raw') {
62
- _c = event.currentTarget, naturalWidth = _c.naturalWidth, naturalHeight = _c.naturalHeight;
63
- onSizeLoad === null || onSizeLoad === void 0 ? void 0 : onSizeLoad(naturalWidth, naturalHeight);
64
- onLoad === null || onLoad === void 0 ? void 0 : onLoad();
65
- performanceTracerEnd = this.props.performanceTracerEnd;
66
- performanceTracerEnd === null || performanceTracerEnd === void 0 ? void 0 : performanceTracerEnd();
67
- }
68
- this.setState({
69
- loadings: tslib_1.__assign(tslib_1.__assign({}, loadings), (_d = {}, _d[currentShow] = false, _d)),
70
- });
71
- if (!this._canvasRef.current) {
72
- return [2 /*return*/];
73
- }
74
- target = event.target;
75
- if (!('createImageBitmap' in window)) return [3 /*break*/, 2];
76
- return [4 /*yield*/, createImageBitmap(target)];
77
- case 1:
78
- bitmap = _e.sent();
79
- this._drawToCanvas(bitmap);
80
- return [3 /*break*/, 3];
81
- case 2:
82
- this._drawToCanvas(target);
83
- _e.label = 3;
84
- case 3: return [2 /*return*/];
85
- }
86
- });
87
- }); };
88
- _this._errorHandler = function () {
89
- var _a, _b;
90
- var _c = _this.state, loadings = _c.loadings, errors = _c.errors, currentShow = _c.currentShow;
91
- var onError = _this.props.onError;
92
- if (currentShow === 'raw') {
93
- onError === null || onError === void 0 ? void 0 : onError();
94
- }
95
- _this.setState({
96
- loadings: tslib_1.__assign(tslib_1.__assign({}, loadings), (_a = {}, _a[currentShow] = false, _a)),
97
- errors: tslib_1.__assign(tslib_1.__assign({}, errors), (_b = {}, _b[currentShow] = true, _b)),
98
- });
99
- onError === null || onError === void 0 ? void 0 : onError();
100
- };
101
- _this.rawImageLoader = function () {
102
- var currentShow = _this.state.currentShow;
103
- var _a = _this.props, thumbnailSrc = _a.thumbnailSrc, src = _a.src;
104
- var currentShowSrc = currentShow === 'raw' ? src : thumbnailSrc;
105
- if (!currentShowSrc) {
106
- return null;
107
- }
108
- var pathName = new URL(currentShowSrc).pathname;
109
- var isGif = /\.gif$/.test(pathName);
110
- if (isGif) {
111
- return (react_1.default.createElement("img", tslib_1.__assign({ src: currentShowSrc, alt: "", onLoad: _this._loadHandler, onError: _this._errorHandler }, _this._imageAttributes)));
112
- }
113
- return (react_1.default.createElement(react_1.default.Fragment, null,
114
- _this.canvasRenderer(),
115
- react_1.default.createElement(HiddenImage, { src: currentShowSrc, onLoad: _this._loadHandler, onError: _this._errorHandler })));
116
- };
117
- _this.canvasRenderer = function () {
118
- return (react_1.default.createElement(StyledBackground, tslib_1.__assign({}, _this._imageAttributes, { visibility: _this.error ? 'hidden' : 'visible' }),
119
- react_1.default.createElement("canvas", { ref: _this._canvasRef, style: { width: '100%' } })));
120
- };
121
- var performanceTracerStart = _this.props.performanceTracerStart;
122
- performanceTracerStart === null || performanceTracerStart === void 0 ? void 0 : performanceTracerStart();
123
- _this.state = _this.getInitState(props);
124
- var _a = _this.props, width = _a.width, height = _a.height, onSizeLoad = _a.onSizeLoad;
125
- if (width && height && onSizeLoad) {
126
- onSizeLoad === null || onSizeLoad === void 0 ? void 0 : onSizeLoad(Number(width), Number(height));
127
- }
128
- return _this;
129
- }
130
- RcImageView.prototype.getInitState = function (props) {
131
- if (isThumbnailMode(props)) {
132
- return cloneDeep_1.default(RcImageView.initThumbnailModeState);
133
- }
134
- return cloneDeep_1.default(RcImageView.initState);
135
- };
136
- RcImageView.prototype._errorView = function () {
137
- if (!this.error) {
138
- return null;
139
- }
140
- return (react_1.default.createElement(StyledLoadingPage, null,
141
- react_1.default.createElement(Icon_1.RcIcon, { size: "xxxlarge", color: "neutral.f02", symbol: juno_icon_1.ImageBroken })));
142
- };
143
- RcImageView.prototype._hiddenRawLoader = function () {
144
- var _this = this;
145
- var _a = this.state, loadings = _a.loadings, errors = _a.errors, currentShow = _a.currentShow;
146
- var _b = this.props, onSizeLoad = _b.onSizeLoad, src = _b.src;
147
- return (currentShow !== 'raw' && (react_1.default.createElement(HiddenImage, { src: src, onLoad: function (event) {
148
- var _a = event.currentTarget, naturalWidth = _a.naturalWidth, naturalHeight = _a.naturalHeight;
149
- onSizeLoad === null || onSizeLoad === void 0 ? void 0 : onSizeLoad(naturalWidth, naturalHeight);
150
- _this.setState({
151
- loadings: tslib_1.__assign(tslib_1.__assign({}, loadings), { raw: false }),
152
- currentShow: 'raw',
153
- });
154
- }, onError: function () {
155
- _this.setState({
156
- loadings: tslib_1.__assign(tslib_1.__assign({}, loadings), { raw: false }),
157
- errors: tslib_1.__assign(tslib_1.__assign({}, errors), { raw: true }),
158
- });
159
- } })));
160
- };
161
- Object.defineProperty(RcImageView.prototype, "error", {
162
- get: function () {
163
- var errors = this.state.errors;
164
- return values_1.default(errors).every(function (status) { return !!status; });
165
- },
166
- enumerable: true,
167
- configurable: true
168
- });
169
- Object.defineProperty(RcImageView.prototype, "_imageAttributes", {
170
- get: function () {
171
- var _a = this.props, onSizeLoad = _a.onSizeLoad, onLoad = _a.onLoad, onError = _a.onError, loadingPlaceHolder = _a.loadingPlaceHolder, viewRef = _a.imageRef, thumbnailSrc = _a.thumbnailSrc, src = _a.src, performanceTracerEnd = _a.performanceTracerEnd, performanceTracerStart = _a.performanceTracerStart, rest = tslib_1.__rest(_a, ["onSizeLoad", "onLoad", "onError", "loadingPlaceHolder", "imageRef", "thumbnailSrc", "src", "performanceTracerEnd", "performanceTracerStart"]);
172
- return tslib_1.__assign(tslib_1.__assign({}, rest), { ref: this.getImageRef() });
173
- },
174
- enumerable: true,
175
- configurable: true
176
- });
177
- RcImageView.prototype.render = function () {
178
- return (react_1.default.createElement(react_1.default.Fragment, null,
179
- this.rawImageLoader(),
180
- this._hiddenRawLoader(),
181
- this._errorView()));
182
- };
183
- RcImageView.initState = {
184
- loadings: {
185
- raw: true,
186
- },
187
- errors: {
188
- raw: false,
189
- },
190
- currentShow: 'raw',
191
- };
192
- RcImageView.initThumbnailModeState = {
193
- loadings: {
194
- raw: true,
195
- thumbnail: true,
196
- },
197
- errors: {
198
- raw: false,
199
- thumbnail: false,
200
- },
201
- currentShow: 'thumbnail',
202
- };
203
- return RcImageView;
204
- }(react_1.default.Component));
205
- exports.RcImageView = RcImageView;
206
- var templateObject_1, templateObject_2, templateObject_3;
@@ -1 +0,0 @@
1
- export * from './ImageView';
@@ -1,4 +0,0 @@
1
- "use strict";
2
- Object.defineProperty(exports, "__esModule", { value: true });
3
- var tslib_1 = require("tslib");
4
- tslib_1.__exportStar(require("./ImageView"), exports);
@@ -1,34 +0,0 @@
1
- import React from 'react';
2
- import { RcClassesProps } from '../../foundation';
3
- import { TABLE_BORDER_TYPE, TABLE_STICKY_TYPE, TABLE_TYPE } from './types';
4
- declare type RcTableClasses = RcClassesProps<'root' | 'table'>;
5
- declare type RcTableProps = {
6
- desc?: string;
7
- header?: JSX.Element;
8
- tableSticky?: TABLE_STICKY_TYPE;
9
- tableBorder?: TABLE_BORDER_TYPE;
10
- tableType?: TABLE_TYPE;
11
- /** className for that table root */
12
- className?: string;
13
- } & RcTableClasses;
14
- declare const RcTable: import("styled-components").StyledComponentClass<{
15
- desc?: string | undefined;
16
- header?: JSX.Element | undefined;
17
- tableSticky?: TABLE_STICKY_TYPE | undefined;
18
- tableBorder?: TABLE_BORDER_TYPE | undefined;
19
- tableType?: TABLE_TYPE | undefined;
20
- /** className for that table root */
21
- className?: string | undefined;
22
- } & RcClassesProps<"table" | "root"> & React.RefAttributes<any>, import("../../foundation").RcTheme, Pick<{
23
- desc?: string | undefined;
24
- header?: JSX.Element | undefined;
25
- tableSticky?: TABLE_STICKY_TYPE | undefined;
26
- tableBorder?: TABLE_BORDER_TYPE | undefined;
27
- tableType?: TABLE_TYPE | undefined;
28
- /** className for that table root */
29
- className?: string | undefined;
30
- } & RcClassesProps<"table" | "root"> & React.RefAttributes<any>, "ref" | "key" | "className" | "header" | "desc" | "classes" | "tableSticky" | "tableBorder" | "tableType"> & {
31
- theme?: import("../../foundation").RcTheme | undefined;
32
- }>;
33
- export { RcTable };
34
- export type { RcTableProps };
@@ -1,31 +0,0 @@
1
- "use strict";
2
- Object.defineProperty(exports, "__esModule", { value: true });
3
- var tslib_1 = require("tslib");
4
- var react_1 = tslib_1.__importStar(require("react"));
5
- var clsx_1 = tslib_1.__importDefault(require("clsx"));
6
- var foundation_1 = require("../../foundation");
7
- var styled_1 = require("./styled");
8
- var types_1 = require("./types");
9
- var _RcTable = react_1.forwardRef(function (inProps, ref) {
10
- var props = foundation_1.useThemeProps({ props: inProps, name: 'RcTable' });
11
- var header = props.header, children = props.children, desc = props.desc, tableSticky = props.tableSticky, tableType = props.tableType, tableBorder = props.tableBorder, classes = props.classes, className = props.className;
12
- var containerClass = react_1.useMemo(function () {
13
- var _a;
14
- return clsx_1.default(className, classes === null || classes === void 0 ? void 0 : classes.root, (_a = {},
15
- _a[types_1.TABLE_BORDER_TYPE.BORDERED] = tableBorder === types_1.TABLE_BORDER_TYPE.BORDERED,
16
- _a));
17
- }, [className, classes, tableBorder]);
18
- var tableClass = react_1.useMemo(function () {
19
- var _a;
20
- return clsx_1.default(classes === null || classes === void 0 ? void 0 : classes.table, tableType || types_1.TABLE_TYPE.CARD, (_a = {},
21
- _a[types_1.TABLE_STICKY_TYPE.STICKY] = tableSticky === types_1.TABLE_STICKY_TYPE.STICKY,
22
- _a));
23
- }, [classes, tableSticky, tableType]);
24
- return (react_1.default.createElement(styled_1.TableWrapper, { className: containerClass },
25
- react_1.default.createElement(styled_1.StyledTable, { className: tableClass, "aria-label": desc, ref: ref },
26
- header ? header : null,
27
- react_1.default.createElement("tbody", null, children))));
28
- });
29
- var RcTable = foundation_1.styled(_RcTable)(templateObject_1 || (templateObject_1 = tslib_1.__makeTemplateObject([""], [""])));
30
- exports.RcTable = RcTable;
31
- var templateObject_1;
@@ -1,10 +0,0 @@
1
- import React from 'react';
2
- import { RcTypographyProps } from '../Typography';
3
- import { COLUMN_TEXT_ALIGN } from './types';
4
- declare type RcTableBodyCellContentProps = {
5
- readonly textAlign?: COLUMN_TEXT_ALIGN;
6
- } & RcTypographyProps;
7
- declare const RcTableBodyCellContent: import("styled-components").StyledComponentClass<Pick<RcTableBodyCellContentProps, "key" | "className" | "color" | "id" | "lang" | "style" | "role" | "tabIndex" | "display" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "children" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocus" | "onFocusCapture" | "onBlur" | "onBlurCapture" | "onChange" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDown" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClick" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerEnterCapture" | "onPointerLeave" | "onPointerLeaveCapture" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture" | "slot" | "title" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "contentEditable" | "contextMenu" | "dir" | "draggable" | "hidden" | "placeholder" | "spellCheck" | "translate" | "radioGroup" | "about" | "datatype" | "inlist" | "prefix" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "inputMode" | "is" | "variant" | "innerRef" | "component" | "textAlign" | "useRcTooltip" | "TooltipProps" | "align" | "gutterBottom" | "noWrap" | "paragraph" | "weight"> & React.RefAttributes<any>, import("../../foundation").RcTheme, Pick<Pick<RcTableBodyCellContentProps, "key" | "className" | "color" | "id" | "lang" | "style" | "role" | "tabIndex" | "display" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "children" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocus" | "onFocusCapture" | "onBlur" | "onBlurCapture" | "onChange" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDown" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClick" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerEnterCapture" | "onPointerLeave" | "onPointerLeaveCapture" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture" | "slot" | "title" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "contentEditable" | "contextMenu" | "dir" | "draggable" | "hidden" | "placeholder" | "spellCheck" | "translate" | "radioGroup" | "about" | "datatype" | "inlist" | "prefix" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "inputMode" | "is" | "variant" | "innerRef" | "component" | "textAlign" | "useRcTooltip" | "TooltipProps" | "align" | "gutterBottom" | "noWrap" | "paragraph" | "weight"> & React.RefAttributes<any>, "ref" | "key" | "className" | "color" | "id" | "lang" | "style" | "role" | "tabIndex" | "display" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "children" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocus" | "onFocusCapture" | "onBlur" | "onBlurCapture" | "onChange" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDown" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClick" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerEnterCapture" | "onPointerLeave" | "onPointerLeaveCapture" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture" | "slot" | "title" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "contentEditable" | "contextMenu" | "dir" | "draggable" | "hidden" | "placeholder" | "spellCheck" | "translate" | "radioGroup" | "about" | "datatype" | "inlist" | "prefix" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "inputMode" | "is" | "variant" | "innerRef" | "component" | "textAlign" | "useRcTooltip" | "TooltipProps" | "align" | "gutterBottom" | "noWrap" | "paragraph" | "weight"> & {
8
- theme?: import("../../foundation").RcTheme | undefined;
9
- }>;
10
- export { RcTableBodyCellContent };
@@ -1,16 +0,0 @@
1
- "use strict";
2
- Object.defineProperty(exports, "__esModule", { value: true });
3
- var tslib_1 = require("tslib");
4
- var react_1 = tslib_1.__importStar(require("react"));
5
- var foundation_1 = require("../../foundation");
6
- var Typography_1 = require("../Typography");
7
- var _RcTableBodyCellContent = react_1.forwardRef(function (_a, ref) {
8
- var children = _a.children, _b = _a.noWrap, noWrap = _b === void 0 ? true : _b, rest = tslib_1.__rest(_a, ["children", "noWrap"]);
9
- return (react_1.default.createElement(Typography_1.RcTypography, tslib_1.__assign({ ref: ref, noWrap: noWrap, component: "div", color: "neutral.f05" }, rest), children));
10
- });
11
- var RcTableBodyCellContent = foundation_1.styled(_RcTableBodyCellContent)(templateObject_1 || (templateObject_1 = tslib_1.__makeTemplateObject(["\n text-align: ", ";\n"], ["\n text-align: ", ";\n"])), function (_a) {
12
- var textAlign = _a.textAlign;
13
- return textAlign;
14
- });
15
- exports.RcTableBodyCellContent = RcTableBodyCellContent;
16
- var templateObject_1;
@@ -1,4 +0,0 @@
1
- /// <reference types="react" />
2
- import { TableHeadProps } from './types';
3
- declare const RcTableHeadView: (props: TableHeadProps) => JSX.Element;
4
- export { RcTableHeadView };
@@ -1,18 +0,0 @@
1
- "use strict";
2
- Object.defineProperty(exports, "__esModule", { value: true });
3
- var tslib_1 = require("tslib");
4
- var react_1 = tslib_1.__importDefault(require("react"));
5
- var styled_1 = require("./styled");
6
- var TableHeadCell_1 = require("./TableHeadCell");
7
- var types_1 = require("./types");
8
- var RcTableHeadView = function (props) {
9
- var columnData = props.columnData, sortMap = props.sortMap, sortHandler = props.sortHandler;
10
- return (react_1.default.createElement("thead", null,
11
- react_1.default.createElement(styled_1.StyledTableRow, null, columnData.map(function (column) {
12
- var sortDirection = sortMap && sortMap.sortKey === column.sortKey
13
- ? sortMap.sortDirection
14
- : types_1.ORDER_TABLE_BY.NONE;
15
- return (react_1.default.createElement(TableHeadCell_1.RcTableHeadCell, { key: column.sortKey + "-" + column.title, width: column.width, title: column.title, sortDirection: sortDirection, sortKey: column.sortKey, sortHandler: sortHandler, textAlign: column.textAlign, automationID: column.automationID }));
16
- }))));
17
- };
18
- exports.RcTableHeadView = RcTableHeadView;
@@ -1,4 +0,0 @@
1
- /// <reference types="react" />
2
- import { TableHeadCellProps } from './types';
3
- declare const RcTableHeadCell: (props: TableHeadCellProps) => JSX.Element;
4
- export { RcTableHeadCell };
@@ -1,64 +0,0 @@
1
- "use strict";
2
- Object.defineProperty(exports, "__esModule", { value: true });
3
- var tslib_1 = require("tslib");
4
- var react_1 = tslib_1.__importStar(require("react"));
5
- var isFunction_1 = tslib_1.__importDefault(require("lodash/isFunction"));
6
- var isNumber_1 = tslib_1.__importDefault(require("lodash/isNumber"));
7
- var juno_icon_1 = require("@ringcentral/juno-icon");
8
- var foundation_1 = require("../../foundation");
9
- var Icon_1 = require("../Icon");
10
- var styled_1 = require("./styled");
11
- var types_1 = require("./types");
12
- var RcTableHeadCell = function (props) {
13
- var automationID = props.automationID, title = props.title, width = props.width, sortDirection = props.sortDirection, sortKey = props.sortKey, textAlign = props.textAlign;
14
- var onClick = function () {
15
- var sortHandler = props.sortHandler, sortKey = props.sortKey, sortDirection = props.sortDirection;
16
- if (sortKey === undefined || !sortHandler) {
17
- return;
18
- }
19
- if (sortDirection === types_1.ORDER_TABLE_BY.ASC) {
20
- sortHandler(types_1.ORDER_TABLE_BY.DESC, sortKey);
21
- }
22
- else {
23
- sortHandler(types_1.ORDER_TABLE_BY.ASC, sortKey);
24
- }
25
- };
26
- var onKeyDown = foundation_1.useA11yKeyEvent(onClick);
27
- // eslint-disable-next-line react-hooks/exhaustive-deps
28
- var shouldSort = function () {
29
- var sortHandler = props.sortHandler, sortKey = props.sortKey;
30
- return isFunction_1.default(sortHandler) && isNumber_1.default(sortKey);
31
- };
32
- var sortDirectionArrow = react_1.useMemo(function () {
33
- var sortClass = '';
34
- switch (sortDirection) {
35
- case types_1.ORDER_TABLE_BY.ASC:
36
- sortClass = types_1.SORT_ICON_CLASS.SORT_UP;
37
- break;
38
- case types_1.ORDER_TABLE_BY.DESC:
39
- sortClass = types_1.SORT_ICON_CLASS.SORT_DOWN;
40
- break;
41
- default:
42
- }
43
- if (shouldSort()) {
44
- return (react_1.default.createElement(styled_1.StyledSortIconWrapper, { className: sortClass },
45
- react_1.default.createElement(Icon_1.RcIcon, { symbol: sortDirection === types_1.ORDER_TABLE_BY.ASC ? juno_icon_1.JumpToUnread : juno_icon_1.JumpToLatest, size: "small" })));
46
- }
47
- return react_1.default.createElement(react_1.default.Fragment, null);
48
- }, [shouldSort, sortDirection]);
49
- var ariaSort = tslib_1.__assign({}, (sortDirection !== undefined &&
50
- [types_1.ORDER_TABLE_BY.ASC, types_1.ORDER_TABLE_BY.DESC].includes(sortDirection) && {
51
- 'aria-sort': types_1.ARIA_SORT_VALUES[types_1.ORDER_TABLE_BY[sortDirection]],
52
- }));
53
- var headCellSortProps = tslib_1.__assign({}, (shouldSort() && tslib_1.__assign({ onKeyDown: onKeyDown }, ariaSort)));
54
- var cellContentSortProps = tslib_1.__assign({}, (shouldSort() && {
55
- role: 'button',
56
- onClickCapture: onClick,
57
- }));
58
- var hasSortKey = sortKey !== undefined;
59
- return (react_1.default.createElement(styled_1.StyledTableHeadCell, tslib_1.__assign({ scope: "col", tabIndex: hasSortKey ? 0 : undefined, width: width, hasSortKey: hasSortKey, sortDirection: sortDirection, "data-test-automation-value": automationID, "data-test-automation-class": "table-header-cell" }, headCellSortProps),
60
- react_1.default.createElement(styled_1.StyledTableHeadCellContent, tslib_1.__assign({ textAlign: textAlign }, cellContentSortProps),
61
- react_1.default.createElement(styled_1.StyledTableHeadText, null, title),
62
- sortDirectionArrow)));
63
- };
64
- exports.RcTableHeadCell = RcTableHeadCell;
@@ -1,3 +0,0 @@
1
- /// <reference types="react" />
2
- /// <reference types="styled-jsx" />
3
- export declare const RcTableRow: import("styled-components").StyledComponentClass<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLTableRowElement>, HTMLTableRowElement>, import("../../foundation").RcTheme, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLTableRowElement>, HTMLTableRowElement>>;
@@ -1,6 +0,0 @@
1
- "use strict";
2
- Object.defineProperty(exports, "__esModule", { value: true });
3
- var tslib_1 = require("tslib");
4
- var foundation_1 = require("../../foundation");
5
- exports.RcTableRow = foundation_1.styled.tr(templateObject_1 || (templateObject_1 = tslib_1.__makeTemplateObject(["\n outline: none;\n\n &:not(:last-child) {\n border-bottom: 1px solid ", ";\n }\n\n &:hover {\n background-color: ", ";\n }\n"], ["\n outline: none;\n\n &:not(:last-child) {\n border-bottom: 1px solid ", ";\n }\n\n &:hover {\n background-color: ", ";\n }\n"])), foundation_1.palette2('neutral', 'l02'), foundation_1.setOpacity(foundation_1.palette2('action', 'grayLight'), '08'));
6
- var templateObject_1;
@@ -1,7 +0,0 @@
1
- export * from './Table';
2
- export * from './TableHead';
3
- export * from './TableHeadCell';
4
- export * from './types';
5
- export * from './TableRow';
6
- export * from './TableBodyCellContent';
7
- export * from './styled';
@@ -1,10 +0,0 @@
1
- "use strict";
2
- Object.defineProperty(exports, "__esModule", { value: true });
3
- var tslib_1 = require("tslib");
4
- tslib_1.__exportStar(require("./Table"), exports);
5
- tslib_1.__exportStar(require("./TableHead"), exports);
6
- tslib_1.__exportStar(require("./TableHeadCell"), exports);
7
- tslib_1.__exportStar(require("./types"), exports);
8
- tslib_1.__exportStar(require("./TableRow"), exports);
9
- tslib_1.__exportStar(require("./TableBodyCellContent"), exports);
10
- tslib_1.__exportStar(require("./styled"), exports);
@@ -1,24 +0,0 @@
1
- /// <reference types="styled-jsx" />
2
- import { KeyboardEventHandler } from 'react';
3
- import { COLUMN_TEXT_ALIGN } from './types';
4
- interface StyledTableCellProps {
5
- readonly width?: number | string;
6
- readonly sortDirection: any;
7
- readonly hasSortKey?: boolean;
8
- readonly onClickCapture?: KeyboardEventHandler<HTMLTableHeaderCellElement>;
9
- readonly onKeyDown?: KeyboardEventHandler<HTMLTableHeaderCellElement>;
10
- }
11
- interface StyledTableHeadCellContentProps {
12
- readonly textAlign?: COLUMN_TEXT_ALIGN;
13
- }
14
- declare const TableWrapper: import("styled-components").StyledComponentClass<unknown, import("../../foundation").RcTheme, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>>;
15
- interface StyledTableProps {
16
- readonly minWidth?: number | string;
17
- }
18
- declare const StyledTable: import("styled-components").StyledComponentClass<StyledTableProps, import("../../foundation").RcTheme, import("react").ClassAttributes<HTMLTableElement> & import("react").TableHTMLAttributes<HTMLTableElement> & StyledTableProps>;
19
- declare const StyledTableRow: import("styled-components").StyledComponentClass<unknown, import("../../foundation").RcTheme, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLTableRowElement>, HTMLTableRowElement>>;
20
- declare const StyledSortIconWrapper: import("styled-components").StyledComponentClass<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, import("../../foundation").RcTheme, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>>;
21
- declare const StyledTableHeadText: import("styled-components").StyledComponentClass<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, import("../../foundation").RcTheme, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>>;
22
- declare const StyledTableHeadCell: import("styled-components").StyledComponentClass<StyledTableCellProps, import("../../foundation").RcTheme, import("react").ClassAttributes<HTMLTableHeaderCellElement> & import("react").ThHTMLAttributes<HTMLTableHeaderCellElement> & StyledTableCellProps>;
23
- declare const StyledTableHeadCellContent: import("styled-components").StyledComponentClass<import("react").ClassAttributes<HTMLDivElement> & import("react").HTMLAttributes<HTMLDivElement> & StyledTableHeadCellContentProps, import("../../foundation").RcTheme, import("react").ClassAttributes<HTMLDivElement> & import("react").HTMLAttributes<HTMLDivElement> & StyledTableHeadCellContentProps>;
24
- export { TableWrapper, StyledTable, StyledTableRow, StyledSortIconWrapper, StyledTableHeadCell, StyledTableHeadText, StyledTableHeadCellContent, };
@@ -1,46 +0,0 @@
1
- "use strict";
2
- Object.defineProperty(exports, "__esModule", { value: true });
3
- var tslib_1 = require("tslib");
4
- var foundation_1 = require("../../foundation");
5
- var types_1 = require("./types");
6
- var TableWrapper = foundation_1.styled('div')(templateObject_1 || (templateObject_1 = tslib_1.__makeTemplateObject(["\n height: 100%;\n width: 100%;\n overflow: auto;\n\n background-color: ", ";\n &.", " {\n border-radius: 4px;\n border: 1px solid ", ";\n }\n"], ["\n height: 100%;\n width: 100%;\n overflow: auto;\n\n background-color: ", ";\n &.", " {\n border-radius: 4px;\n border: 1px solid ", ";\n }\n"])), foundation_1.palette2('neutral', 'b01'), types_1.TABLE_BORDER_TYPE.BORDERED, foundation_1.palette2('neutral', 'l02'));
7
- exports.TableWrapper = TableWrapper;
8
- var StyledTable = foundation_1.styled('table')(templateObject_2 || (templateObject_2 = tslib_1.__makeTemplateObject(["\n border-collapse: collapse;\n table-layout: fixed;\n width: 100%;\n display: table;\n /* scroll when viewport is less than 960px including the 332px from left navs */\n min-width: ", ";\n\n @media only screen and (max-width: ", ") {\n table-layout: auto;\n }\n\n &.", " th {\n position: sticky;\n top: 0;\n }\n\n thead {\n border-bottom: 1px solid ", ";\n width: 100%;\n position: sticky;\n top: 0;\n display: table-header-group;\n z-index: 5;\n }\n\n tbody {\n display: table-row-group;\n }\n\n tr {\n display: table-row;\n padding-left: ", ";\n\n th,\n td {\n -webkit-box-sizing: border-box;\n -moz-box-sizing: border-box;\n box-sizing: border-box;\n vertical-align: middle;\n }\n td:first-child {\n padding-left: ", ";\n margin-left: -", ";\n }\n td:not(:first-child) {\n padding-left: ", ";\n padding-right: ", ";\n }\n }\n\n &.", " tr td {\n overflow: hidden;\n height: 40px;\n }\n\n &.", " tr td {\n overflow: hidden;\n height: 52px;\n }\n\n &.", " tr td {\n overflow: hidden;\n height: 64px;\n }\n\n &.", " tr td {\n overflow: hidden;\n padding: ", ";\n height: auto;\n }\n"], ["\n border-collapse: collapse;\n table-layout: fixed;\n width: 100%;\n display: table;\n /* scroll when viewport is less than 960px including the 332px from left navs */\n min-width: ", ";\n\n @media only screen and (max-width: ", ") {\n table-layout: auto;\n }\n\n &.", " th {\n position: sticky;\n top: 0;\n }\n\n thead {\n border-bottom: 1px solid ", ";\n width: 100%;\n position: sticky;\n top: 0;\n display: table-header-group;\n z-index: 5;\n }\n\n tbody {\n display: table-row-group;\n }\n\n tr {\n display: table-row;\n padding-left: ", ";\n\n th,\n td {\n -webkit-box-sizing: border-box;\n -moz-box-sizing: border-box;\n box-sizing: border-box;\n vertical-align: middle;\n }\n td:first-child {\n padding-left: ", ";\n margin-left: -", ";\n }\n td:not(:first-child) {\n padding-left: ", ";\n padding-right: ", ";\n }\n }\n\n &.", " tr td {\n overflow: hidden;\n height: 40px;\n }\n\n &.", " tr td {\n overflow: hidden;\n height: 52px;\n }\n\n &.", " tr td {\n overflow: hidden;\n height: 64px;\n }\n\n &.", " tr td {\n overflow: hidden;\n padding: ", ";\n height: auto;\n }\n"])), foundation_1.spacing(157), foundation_1.spacing(157), types_1.TABLE_STICKY_TYPE.STICKY, foundation_1.palette2('neutral', 'l02'), foundation_1.spacing(4), foundation_1.spacing(4), foundation_1.spacing(4), foundation_1.spacing(4), foundation_1.spacing(4), types_1.TABLE_TYPE.MODAL, types_1.TABLE_TYPE.CARD, types_1.TABLE_TYPE.FULL, types_1.TABLE_TYPE.AUTO, foundation_1.spacing(3, 4));
9
- exports.StyledTable = StyledTable;
10
- var StyledTableRow = foundation_1.styled('tr')(templateObject_3 || (templateObject_3 = tslib_1.__makeTemplateObject(["\n height: 25px;\n display: table-row;\n font-size: 12px;\n text-align: left;\n vertical-align: middle;\n"], ["\n height: 25px;\n display: table-row;\n font-size: 12px;\n text-align: left;\n vertical-align: middle;\n"])));
11
- exports.StyledTableRow = StyledTableRow;
12
- var StyledSortIconWrapper = foundation_1.styled.div(templateObject_4 || (templateObject_4 = tslib_1.__makeTemplateObject(["\n padding-left: 8px;\n padding-right: 8px;\n vertical-align: middle;\n display: inline-flex;\n\n & path {\n fill: ", ";\n }\n"], ["\n padding-left: 8px;\n padding-right: 8px;\n vertical-align: middle;\n display: inline-flex;\n\n & path {\n fill: ", ";\n }\n"])), foundation_1.palette2('neutral', 'f04'));
13
- exports.StyledSortIconWrapper = StyledSortIconWrapper;
14
- var StyledTableHeadText = foundation_1.styled.div(templateObject_5 || (templateObject_5 = tslib_1.__makeTemplateObject(["\n text-overflow: ellipsis;\n overflow: auto;\n"], ["\n text-overflow: ellipsis;\n overflow: auto;\n"])));
15
- exports.StyledTableHeadText = StyledTableHeadText;
16
- var StyledTableHeadCell = foundation_1.styled('th')(templateObject_7 || (templateObject_7 = tslib_1.__makeTemplateObject(["\n color: ", ";\n user-select: none;\n text-align: left;\n background-color: ", ";\n z-index: 100;\n line-height: 32px;\n width: ", ";\n padding-top: 0;\n padding-bottom: 0;\n display: table-cell;\n white-space: nowrap;\n overflow: hidden;\n\n & > div {\n border: 1px solid inherit;\n padding-left: ", ";\n -webkit-box-sizing: border-box;\n -moz-box-sizing: border-box;\n box-sizing: border-box;\n }\n\n ", "\n"], ["\n color: ",
17
- ";\n user-select: none;\n text-align: left;\n background-color: ",
18
- ";\n z-index: 100;\n line-height: 32px;\n width: ", ";\n padding-top: 0;\n padding-bottom: 0;\n display: table-cell;\n white-space: nowrap;\n overflow: hidden;\n\n & > div {\n border: 1px solid inherit;\n padding-left: ", ";\n -webkit-box-sizing: border-box;\n -moz-box-sizing: border-box;\n box-sizing: border-box;\n }\n\n ",
19
- "\n"])), function (props) {
20
- return props.sortDirection === types_1.ORDER_TABLE_BY.NONE
21
- ? foundation_1.palette2('neutral', 'f06')
22
- : foundation_1.palette2('interactive', 'f01');
23
- }, function (props) {
24
- return props.sortDirection === types_1.ORDER_TABLE_BY.NONE
25
- ? foundation_1.palette2('neutral', 'b02')
26
- : foundation_1.palette2('neutral', 'b03');
27
- }, function (props) { return props.width; }, foundation_1.spacing(4), function (_a) {
28
- var hasSortKey = _a.hasSortKey;
29
- return hasSortKey && foundation_1.css(templateObject_6 || (templateObject_6 = tslib_1.__makeTemplateObject(["\n ", " {\n background-color: ", ";\n ", ";\n cursor: pointer;\n outline: none;\n }\n position: relative;\n ", ";\n "], ["\n ", " {\n background-color: ", ";\n ", ";\n cursor: pointer;\n outline: none;\n }\n position: relative;\n ", ";\n "])), foundation_1.focusWithin, foundation_1.palette2('neutral', 'b03'), foundation_1.fakeBorder(), foundation_1.focusVisibleShadowStyle());
30
- });
31
- exports.StyledTableHeadCell = StyledTableHeadCell;
32
- var StyledTableHeadCellContent = foundation_1.styled.div(templateObject_8 || (templateObject_8 = tslib_1.__makeTemplateObject(["\n display: flex;\n align-items: center;\n\n flex-direction: ", ";\n padding-left: ", ";\n padding-right: ", ";\n"], ["\n display: flex;\n align-items: center;\n\n flex-direction: ",
33
- ";\n padding-left: ",
34
- ";\n padding-right: ",
35
- ";\n"])), function (_a) {
36
- var textAlign = _a.textAlign;
37
- return textAlign === types_1.COLUMN_TEXT_ALIGN.RIGHT ? 'row-reverse' : 'row';
38
- }, function (_a) {
39
- var textAlign = _a.textAlign;
40
- return textAlign === types_1.COLUMN_TEXT_ALIGN.RIGHT ? 0 : foundation_1.spacing(4);
41
- }, function (_a) {
42
- var textAlign = _a.textAlign;
43
- return textAlign === types_1.COLUMN_TEXT_ALIGN.RIGHT ? foundation_1.spacing(4) : 0;
44
- });
45
- exports.StyledTableHeadCellContent = StyledTableHeadCellContent;
46
- var templateObject_1, templateObject_2, templateObject_3, templateObject_4, templateObject_5, templateObject_6, templateObject_7, templateObject_8;