@aivenio/aquarium 1.34.0 → 1.35.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.
- package/dist/_variables.scss +1 -1
- package/dist/_variables_timescale.scss +1 -1
- package/dist/atoms.cjs +1 -1
- package/dist/atoms.mjs +1 -1
- package/dist/src/icons/loading.js +1 -1
- package/dist/src/molecules/EmptyState/EmptyState.d.ts +37 -6
- package/dist/src/molecules/EmptyState/EmptyState.js +33 -18
- package/dist/styles.css +3 -0
- package/dist/styles_timescaledb.css +3 -0
- package/dist/system.cjs +52 -53
- package/dist/system.mjs +52 -53
- package/dist/tsconfig.module.tsbuildinfo +1 -1
- package/dist/types/tailwindGenerated.d.ts +1 -1
- package/package.json +1 -1
package/dist/_variables.scss
CHANGED
package/dist/atoms.cjs
CHANGED
|
@@ -2364,7 +2364,7 @@ var require_loading = __commonJS({
|
|
|
2364
2364
|
"src/icons/loading.js"(exports) {
|
|
2365
2365
|
"use strict";
|
|
2366
2366
|
var data = {
|
|
2367
|
-
"body": '<g fill="none" fill-rule="evenodd" stroke="currentColor" stroke-width="
|
|
2367
|
+
"body": '<g fill="none" fill-rule="evenodd" stroke="currentColor" stroke-width="3" transform="translate(1 1)"><circle cx="18" cy="18" r="18" stroke-opacity=".5"/><path d="M36 18c0-9.94-8.06-18-18-18"><animateTransform attributeName="transform" dur="1s" from="0 18 18" repeatCount="indefinite" to="360 18 18" type="rotate"/></path></g>',
|
|
2368
2368
|
"left": 0,
|
|
2369
2369
|
"top": 0,
|
|
2370
2370
|
"width": 38,
|
package/dist/atoms.mjs
CHANGED
|
@@ -2358,7 +2358,7 @@ var require_loading = __commonJS({
|
|
|
2358
2358
|
"src/icons/loading.js"(exports) {
|
|
2359
2359
|
"use strict";
|
|
2360
2360
|
var data = {
|
|
2361
|
-
"body": '<g fill="none" fill-rule="evenodd" stroke="currentColor" stroke-width="
|
|
2361
|
+
"body": '<g fill="none" fill-rule="evenodd" stroke="currentColor" stroke-width="3" transform="translate(1 1)"><circle cx="18" cy="18" r="18" stroke-opacity=".5"/><path d="M36 18c0-9.94-8.06-18-18-18"><animateTransform attributeName="transform" dur="1s" from="0 18 18" repeatCount="indefinite" to="360 18 18" type="rotate"/></path></g>',
|
|
2362
2362
|
"left": 0,
|
|
2363
2363
|
"top": 0,
|
|
2364
2364
|
"width": 38,
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
const data = {
|
|
3
|
-
"body": "<g fill=\"none\" fill-rule=\"evenodd\" stroke=\"currentColor\" stroke-width=\"
|
|
3
|
+
"body": "<g fill=\"none\" fill-rule=\"evenodd\" stroke=\"currentColor\" stroke-width=\"3\" transform=\"translate(1 1)\"><circle cx=\"18\" cy=\"18\" r=\"18\" stroke-opacity=\".5\"/><path d=\"M36 18c0-9.94-8.06-18-18-18\"><animateTransform attributeName=\"transform\" dur=\"1s\" from=\"0 18 18\" repeatCount=\"indefinite\" to=\"360 18 18\" type=\"rotate\"/></path></g>",
|
|
4
4
|
"left": 0,
|
|
5
5
|
"top": 0,
|
|
6
6
|
"width": 38,
|
|
@@ -1,12 +1,47 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
2
|
import { type AsyncActionType, type LinkActionType } from '../../../types/ActionType';
|
|
3
3
|
export declare enum EmptyStateLayout {
|
|
4
|
+
Vertical = "vertical",
|
|
5
|
+
Horizontal = "horizontal",
|
|
6
|
+
/**
|
|
7
|
+
* @deprecated in favor of "Vertical" layout
|
|
8
|
+
*/
|
|
4
9
|
CenterVertical = "center-vertical",
|
|
10
|
+
/**
|
|
11
|
+
* @deprecated in favor of "Vertical" layout
|
|
12
|
+
*/
|
|
5
13
|
LeftVertical = "left-vertical",
|
|
14
|
+
/**
|
|
15
|
+
* @deprecated in favor of "Horizontal" layout
|
|
16
|
+
*/
|
|
6
17
|
CenterHorizontal = "center-horizontal",
|
|
18
|
+
/**
|
|
19
|
+
* @deprecated in favor of "Horizontal" layout
|
|
20
|
+
*/
|
|
7
21
|
LeftHorizontal = "left-horizontal"
|
|
8
22
|
}
|
|
9
|
-
|
|
23
|
+
declare type Vertical = {
|
|
24
|
+
/**
|
|
25
|
+
* Define horizontal/vertical layout of the whole component, item alignment inside the component, and text alignment based on variant of layout. Other values than `vertical` or `horizontal` are currently deprecated.
|
|
26
|
+
* @default 'vertical'.
|
|
27
|
+
*/
|
|
28
|
+
layout?: EmptyStateLayout.CenterVertical | EmptyStateLayout.Vertical;
|
|
29
|
+
/**
|
|
30
|
+
* Optional prop for controlling whether the component will occupy all the available height.
|
|
31
|
+
* @default true
|
|
32
|
+
*/
|
|
33
|
+
fullHeight?: boolean;
|
|
34
|
+
};
|
|
35
|
+
declare type Horizontal = {
|
|
36
|
+
/**
|
|
37
|
+
* Define horizontal/vertical layout of the whole component, item alignment inside the component, and text alignment based on variant of layout. Other values than `vertical` or `horizontal` are currently deprecated.
|
|
38
|
+
* @default 'vertical'
|
|
39
|
+
*/
|
|
40
|
+
layout?: Exclude<EmptyStateLayout, EmptyStateLayout.CenterVertical | EmptyStateLayout.Vertical>;
|
|
41
|
+
fullHeight?: never;
|
|
42
|
+
};
|
|
43
|
+
declare type LayoutProps = Horizontal | Vertical;
|
|
44
|
+
export declare type EmptyStateProps = LayoutProps & {
|
|
10
45
|
/**
|
|
11
46
|
* Provide a short and concise explanation.
|
|
12
47
|
*/
|
|
@@ -45,11 +80,6 @@ export declare type EmptyStateProps = {
|
|
|
45
80
|
* Use Typography component if possible. By default, this is wrapped by typography 'small' size.
|
|
46
81
|
*/
|
|
47
82
|
footer?: React.ReactNode;
|
|
48
|
-
/**
|
|
49
|
-
* Define horizontal/vertical layout of the whole component, item alignment inside the component, and text alignment based on variant of layout.
|
|
50
|
-
* Default value is 'center-vertical'.
|
|
51
|
-
*/
|
|
52
|
-
layout?: EmptyStateLayout;
|
|
53
83
|
/**
|
|
54
84
|
* Define a style of the border of the component.
|
|
55
85
|
* Default value is 'dashed' style.
|
|
@@ -63,3 +93,4 @@ export declare type EmptyStateProps = {
|
|
|
63
93
|
* @returns React.ReactElement
|
|
64
94
|
*/
|
|
65
95
|
export declare const EmptyState: React.FC<EmptyStateProps>;
|
|
96
|
+
export {};
|
|
@@ -2,16 +2,28 @@ import React from 'react';
|
|
|
2
2
|
import omit from 'lodash/omit';
|
|
3
3
|
import { Box } from '../../../src/molecules/Box/Box';
|
|
4
4
|
import { Button } from '../../../src/molecules/Button/Button';
|
|
5
|
-
import { Flexbox } from '../../../src/molecules/Flexbox/Flexbox';
|
|
6
|
-
import { FlexboxItem } from '../../../src/molecules/Flexbox/FlexboxItem';
|
|
7
5
|
import { Typography } from '../../../src/molecules/Typography/Typography';
|
|
8
6
|
import { isLink } from '../../../src/utils/link';
|
|
9
7
|
import { classNames, tw } from '../../../src/utils/tailwind';
|
|
10
8
|
export var EmptyStateLayout;
|
|
11
9
|
(function (EmptyStateLayout) {
|
|
10
|
+
EmptyStateLayout["Vertical"] = "vertical";
|
|
11
|
+
EmptyStateLayout["Horizontal"] = "horizontal";
|
|
12
|
+
/**
|
|
13
|
+
* @deprecated in favor of "Vertical" layout
|
|
14
|
+
*/
|
|
12
15
|
EmptyStateLayout["CenterVertical"] = "center-vertical";
|
|
16
|
+
/**
|
|
17
|
+
* @deprecated in favor of "Vertical" layout
|
|
18
|
+
*/
|
|
13
19
|
EmptyStateLayout["LeftVertical"] = "left-vertical";
|
|
20
|
+
/**
|
|
21
|
+
* @deprecated in favor of "Horizontal" layout
|
|
22
|
+
*/
|
|
14
23
|
EmptyStateLayout["CenterHorizontal"] = "center-horizontal";
|
|
24
|
+
/**
|
|
25
|
+
* @deprecated in favor of "Horizontal" layout
|
|
26
|
+
*/
|
|
15
27
|
EmptyStateLayout["LeftHorizontal"] = "left-horizontal";
|
|
16
28
|
})(EmptyStateLayout || (EmptyStateLayout = {}));
|
|
17
29
|
const layoutStyle = (layout) => {
|
|
@@ -23,6 +35,7 @@ const layoutStyle = (layout) => {
|
|
|
23
35
|
alignItems: 'flex-start',
|
|
24
36
|
};
|
|
25
37
|
case EmptyStateLayout.LeftHorizontal:
|
|
38
|
+
case EmptyStateLayout.Horizontal:
|
|
26
39
|
return {
|
|
27
40
|
layout: 'row',
|
|
28
41
|
justifyContent: 'flex-start',
|
|
@@ -35,6 +48,7 @@ const layoutStyle = (layout) => {
|
|
|
35
48
|
alignItems: 'flex-start',
|
|
36
49
|
};
|
|
37
50
|
case EmptyStateLayout.CenterVertical:
|
|
51
|
+
case EmptyStateLayout.Vertical:
|
|
38
52
|
default:
|
|
39
53
|
return {
|
|
40
54
|
layout: 'column',
|
|
@@ -43,37 +57,38 @@ const layoutStyle = (layout) => {
|
|
|
43
57
|
};
|
|
44
58
|
}
|
|
45
59
|
};
|
|
60
|
+
const isVerticalLayout = (layout) => layout === EmptyStateLayout.Vertical || layout === EmptyStateLayout.CenterVertical;
|
|
46
61
|
/**
|
|
47
62
|
* ## A EmptyState component to call extra attention to featured content or information, for example, an empty stage of a feature.
|
|
48
63
|
*
|
|
49
64
|
* @param props EmptyStateProps
|
|
50
65
|
* @returns React.ReactElement
|
|
51
66
|
*/
|
|
52
|
-
export const EmptyState = ({ title, image, imageAlt = '', imageWidth, description, children, primaryAction, secondaryAction, footer, layout = EmptyStateLayout.
|
|
67
|
+
export const EmptyState = ({ title, image, imageAlt = '', imageWidth, description, children, primaryAction, secondaryAction, footer, layout = EmptyStateLayout.Vertical, borderStyle = 'dashed', fullHeight = isVerticalLayout(layout) ? true : false, }) => {
|
|
53
68
|
const template = layoutStyle(layout);
|
|
54
|
-
return (React.createElement(Box, { className: classNames('Aquarium-EmptyState', tw('rounded', {
|
|
69
|
+
return (React.createElement(Box, { className: classNames('Aquarium-EmptyState', tw('rounded p-[56px]', {
|
|
55
70
|
'border border-dashed': borderStyle === 'dashed',
|
|
56
71
|
'border border-solid': borderStyle === 'solid',
|
|
57
|
-
'text-left': layout
|
|
58
|
-
'text-center': layout
|
|
59
|
-
|
|
60
|
-
|
|
72
|
+
'text-left': !isVerticalLayout(layout),
|
|
73
|
+
'text-center': isVerticalLayout(layout),
|
|
74
|
+
'h-full': fullHeight,
|
|
75
|
+
})), backgroundColor: "transparent", borderColor: "grey-10" },
|
|
76
|
+
React.createElement(Box.Flex, { style: { gap: '56px' }, flexDirection: template.layout, justifyContent: template.justifyContent,
|
|
61
77
|
// in case of horizontal layouts, the content inside the 2nd col should align center with image.
|
|
62
|
-
alignItems: template.layout === 'row' ? 'center' : template.alignItems,
|
|
63
|
-
image && (React.createElement(
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
React.createElement(Typography, { variant: "heading", htmlTag: "h2" }, title),
|
|
78
|
+
alignItems: template.layout === 'row' ? 'center' : template.alignItems, height: fullHeight ? 'full' : undefined },
|
|
79
|
+
image && (React.createElement("img", { src: image, alt: imageAlt, style: { width: imageWidth ? `${imageWidth}px` : undefined, height: 'auto' } })),
|
|
80
|
+
React.createElement(Box.Flex, { flexDirection: "column", justifyContent: template.justifyContent, alignItems: template.alignItems },
|
|
81
|
+
React.createElement(Typography.Heading, { htmlTag: "h2" }, title),
|
|
67
82
|
(description || children) && (React.createElement(Box, { marginTop: "5" },
|
|
68
|
-
React.createElement(Typography, {
|
|
69
|
-
(secondaryAction || primaryAction) && (React.createElement(
|
|
83
|
+
React.createElement(Typography.Default, { color: "grey-60" }, children || description))),
|
|
84
|
+
(secondaryAction || primaryAction) && (React.createElement(Box.Flex, { marginTop: "7", gap: "4", justifyContent: "center", alignItems: "center", wrap: "wrap" },
|
|
70
85
|
primaryAction && (React.createElement(React.Fragment, null,
|
|
71
86
|
!isLink(primaryAction) && (React.createElement(Button.Primary, Object.assign({}, omit(primaryAction, 'text')), primaryAction.text)),
|
|
72
87
|
isLink(primaryAction) && (React.createElement(Button.ExternalLink, Object.assign({ kind: "primary" }, omit(primaryAction, 'text')), primaryAction.text)))),
|
|
73
88
|
secondaryAction && (React.createElement(React.Fragment, null,
|
|
74
89
|
!isLink(secondaryAction) && (React.createElement(Button.Secondary, Object.assign({}, omit(secondaryAction, 'text')), secondaryAction.text)),
|
|
75
90
|
isLink(secondaryAction) && (React.createElement(Button.ExternalLink, Object.assign({ kind: "secondary" }, omit(secondaryAction, 'text')), secondaryAction.text)))))),
|
|
76
|
-
footer && (React.createElement(Box, { marginTop: "
|
|
77
|
-
React.createElement(Typography, {
|
|
91
|
+
footer && (React.createElement(Box, { marginTop: "5" },
|
|
92
|
+
React.createElement(Typography.Small, { color: "grey-60" }, footer)))))));
|
|
78
93
|
};
|
|
79
|
-
//# sourceMappingURL=data:application/json;base64,
|
|
94
|
+
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiRW1wdHlTdGF0ZS5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uL3NyYy9tb2xlY3VsZXMvRW1wdHlTdGF0ZS9FbXB0eVN0YXRlLnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQSxPQUFPLEtBQUssTUFBTSxPQUFPLENBQUM7QUFDMUIsT0FBTyxJQUFJLE1BQU0sYUFBYSxDQUFDO0FBRS9CLE9BQU8sRUFBRSxHQUFHLEVBQUUsTUFBTSx1QkFBdUIsQ0FBQztBQUM1QyxPQUFPLEVBQUUsTUFBTSxFQUFFLE1BQU0sNkJBQTZCLENBQUM7QUFDckQsT0FBTyxFQUFFLFVBQVUsRUFBRSxNQUFNLHFDQUFxQyxDQUFDO0FBRWpFLE9BQU8sRUFBRSxNQUFNLEVBQUUsTUFBTSxnQkFBZ0IsQ0FBQztBQUN4QyxPQUFPLEVBQUUsVUFBVSxFQUFFLEVBQUUsRUFBRSxNQUFNLG9CQUFvQixDQUFDO0FBR3BELE1BQU0sQ0FBTixJQUFZLGdCQW1CWDtBQW5CRCxXQUFZLGdCQUFnQjtJQUMxQix5Q0FBcUIsQ0FBQTtJQUNyQiw2Q0FBeUIsQ0FBQTtJQUN6Qjs7T0FFRztJQUNILHNEQUFrQyxDQUFBO0lBQ2xDOztPQUVHO0lBQ0gsa0RBQThCLENBQUE7SUFDOUI7O09BRUc7SUFDSCwwREFBc0MsQ0FBQTtJQUN0Qzs7T0FFRztJQUNILHNEQUFrQyxDQUFBO0FBQ3BDLENBQUMsRUFuQlcsZ0JBQWdCLEtBQWhCLGdCQUFnQixRQW1CM0I7QUF3RkQsTUFBTSxXQUFXLEdBQUcsQ0FBQyxNQUF3QixFQUFvQixFQUFFO0lBQ2pFLFFBQVEsTUFBTSxFQUFFO1FBQ2QsS0FBSyxnQkFBZ0IsQ0FBQyxZQUFZO1lBQ2hDLE9BQU87Z0JBQ0wsTUFBTSxFQUFFLFFBQVE7Z0JBQ2hCLGNBQWMsRUFBRSxZQUFZO2dCQUM1QixVQUFVLEVBQUUsWUFBWTthQUN6QixDQUFDO1FBQ0osS0FBSyxnQkFBZ0IsQ0FBQyxjQUFjLENBQUM7UUFDckMsS0FBSyxnQkFBZ0IsQ0FB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
|
package/dist/styles.css
CHANGED
package/dist/system.cjs
CHANGED
|
@@ -3563,7 +3563,7 @@ var require_loading = __commonJS({
|
|
|
3563
3563
|
"src/icons/loading.js"(exports) {
|
|
3564
3564
|
"use strict";
|
|
3565
3565
|
var data = {
|
|
3566
|
-
"body": '<g fill="none" fill-rule="evenodd" stroke="currentColor" stroke-width="
|
|
3566
|
+
"body": '<g fill="none" fill-rule="evenodd" stroke="currentColor" stroke-width="3" transform="translate(1 1)"><circle cx="18" cy="18" r="18" stroke-opacity=".5"/><path d="M36 18c0-9.94-8.06-18-18-18"><animateTransform attributeName="transform" dur="1s" from="0 18 18" repeatCount="indefinite" to="360 18 18" type="rotate"/></path></g>',
|
|
3567
3567
|
"left": 0,
|
|
3568
3568
|
"top": 0,
|
|
3569
3569
|
"width": 38,
|
|
@@ -11179,31 +11179,11 @@ Dropdown.Menu = DropdownMenu3;
|
|
|
11179
11179
|
Dropdown.Item = DropdownItem;
|
|
11180
11180
|
|
|
11181
11181
|
// src/molecules/EmptyState/EmptyState.tsx
|
|
11182
|
-
var import_react79 = __toESM(require("react"));
|
|
11183
|
-
var import_omit9 = __toESM(require("lodash/omit"));
|
|
11184
|
-
|
|
11185
|
-
// src/molecules/Flexbox/FlexboxItem.tsx
|
|
11186
11182
|
var import_react78 = __toESM(require("react"));
|
|
11187
|
-
var
|
|
11188
|
-
({ htmlTag = "div", className, style, children, display, flex, grow, shrink, order, alignSelf }) => {
|
|
11189
|
-
const hookStyle = useStyle({
|
|
11190
|
-
display,
|
|
11191
|
-
flex,
|
|
11192
|
-
flexGrow: grow,
|
|
11193
|
-
flexShrink: shrink,
|
|
11194
|
-
order,
|
|
11195
|
-
alignSelf
|
|
11196
|
-
});
|
|
11197
|
-
const HtmlElement = htmlTag;
|
|
11198
|
-
return /* @__PURE__ */ import_react78.default.createElement(HtmlElement, {
|
|
11199
|
-
style: __spreadValues(__spreadValues({}, hookStyle), style),
|
|
11200
|
-
className
|
|
11201
|
-
}, children);
|
|
11202
|
-
}
|
|
11203
|
-
);
|
|
11204
|
-
|
|
11205
|
-
// src/molecules/EmptyState/EmptyState.tsx
|
|
11183
|
+
var import_omit9 = __toESM(require("lodash/omit"));
|
|
11206
11184
|
var EmptyStateLayout = /* @__PURE__ */ ((EmptyStateLayout2) => {
|
|
11185
|
+
EmptyStateLayout2["Vertical"] = "vertical";
|
|
11186
|
+
EmptyStateLayout2["Horizontal"] = "horizontal";
|
|
11207
11187
|
EmptyStateLayout2["CenterVertical"] = "center-vertical";
|
|
11208
11188
|
EmptyStateLayout2["LeftVertical"] = "left-vertical";
|
|
11209
11189
|
EmptyStateLayout2["CenterHorizontal"] = "center-horizontal";
|
|
@@ -11219,6 +11199,7 @@ var layoutStyle = (layout) => {
|
|
|
11219
11199
|
alignItems: "flex-start"
|
|
11220
11200
|
};
|
|
11221
11201
|
case "left-horizontal" /* LeftHorizontal */:
|
|
11202
|
+
case "horizontal" /* Horizontal */:
|
|
11222
11203
|
return {
|
|
11223
11204
|
layout: "row",
|
|
11224
11205
|
justifyContent: "flex-start",
|
|
@@ -11231,6 +11212,7 @@ var layoutStyle = (layout) => {
|
|
|
11231
11212
|
alignItems: "flex-start"
|
|
11232
11213
|
};
|
|
11233
11214
|
case "center-vertical" /* CenterVertical */:
|
|
11215
|
+
case "vertical" /* Vertical */:
|
|
11234
11216
|
default:
|
|
11235
11217
|
return {
|
|
11236
11218
|
layout: "column",
|
|
@@ -11239,6 +11221,7 @@ var layoutStyle = (layout) => {
|
|
|
11239
11221
|
};
|
|
11240
11222
|
}
|
|
11241
11223
|
};
|
|
11224
|
+
var isVerticalLayout = (layout) => layout === "vertical" /* Vertical */ || layout === "center-vertical" /* CenterVertical */;
|
|
11242
11225
|
var EmptyState = ({
|
|
11243
11226
|
title,
|
|
11244
11227
|
image,
|
|
@@ -11249,65 +11232,81 @@ var EmptyState = ({
|
|
|
11249
11232
|
primaryAction,
|
|
11250
11233
|
secondaryAction,
|
|
11251
11234
|
footer,
|
|
11252
|
-
layout = "
|
|
11253
|
-
borderStyle = "dashed"
|
|
11235
|
+
layout = "vertical" /* Vertical */,
|
|
11236
|
+
borderStyle = "dashed",
|
|
11237
|
+
fullHeight = isVerticalLayout(layout) ? true : false
|
|
11254
11238
|
}) => {
|
|
11255
11239
|
const template = layoutStyle(layout);
|
|
11256
|
-
return /* @__PURE__ */
|
|
11240
|
+
return /* @__PURE__ */ import_react78.default.createElement(Box, {
|
|
11257
11241
|
className: classNames(
|
|
11258
11242
|
"Aquarium-EmptyState",
|
|
11259
|
-
tw("rounded", {
|
|
11243
|
+
tw("rounded p-[56px]", {
|
|
11260
11244
|
"border border-dashed": borderStyle === "dashed",
|
|
11261
11245
|
"border border-solid": borderStyle === "solid",
|
|
11262
|
-
"text-left": layout
|
|
11263
|
-
"text-center": layout
|
|
11246
|
+
"text-left": !isVerticalLayout(layout),
|
|
11247
|
+
"text-center": isVerticalLayout(layout),
|
|
11248
|
+
"h-full": fullHeight
|
|
11264
11249
|
})
|
|
11265
11250
|
),
|
|
11266
11251
|
backgroundColor: "transparent",
|
|
11267
|
-
borderColor: "grey-10"
|
|
11268
|
-
|
|
11269
|
-
|
|
11270
|
-
|
|
11252
|
+
borderColor: "grey-10"
|
|
11253
|
+
}, /* @__PURE__ */ import_react78.default.createElement(Box.Flex, {
|
|
11254
|
+
style: { gap: "56px" },
|
|
11255
|
+
flexDirection: template.layout,
|
|
11271
11256
|
justifyContent: template.justifyContent,
|
|
11272
11257
|
alignItems: template.layout === "row" ? "center" : template.alignItems,
|
|
11273
|
-
|
|
11274
|
-
|
|
11275
|
-
}, image && /* @__PURE__ */ import_react79.default.createElement(FlexboxItem, null, /* @__PURE__ */ import_react79.default.createElement("img", {
|
|
11258
|
+
height: fullHeight ? "full" : void 0
|
|
11259
|
+
}, image && /* @__PURE__ */ import_react78.default.createElement("img", {
|
|
11276
11260
|
src: image,
|
|
11277
11261
|
alt: imageAlt,
|
|
11278
11262
|
style: { width: imageWidth ? `${imageWidth}px` : void 0, height: "auto" }
|
|
11279
|
-
})
|
|
11280
|
-
|
|
11281
|
-
direction: "column",
|
|
11263
|
+
}), /* @__PURE__ */ import_react78.default.createElement(Box.Flex, {
|
|
11264
|
+
flexDirection: "column",
|
|
11282
11265
|
justifyContent: template.justifyContent,
|
|
11283
11266
|
alignItems: template.alignItems
|
|
11284
|
-
}, /* @__PURE__ */
|
|
11285
|
-
variant: "heading",
|
|
11267
|
+
}, /* @__PURE__ */ import_react78.default.createElement(Typography2.Heading, {
|
|
11286
11268
|
htmlTag: "h2"
|
|
11287
|
-
}, title), (description || children) && /* @__PURE__ */
|
|
11269
|
+
}, title), (description || children) && /* @__PURE__ */ import_react78.default.createElement(Box, {
|
|
11288
11270
|
marginTop: "5"
|
|
11289
|
-
}, /* @__PURE__ */
|
|
11290
|
-
variant: "default",
|
|
11271
|
+
}, /* @__PURE__ */ import_react78.default.createElement(Typography2.Default, {
|
|
11291
11272
|
color: "grey-60"
|
|
11292
|
-
}, children || description)), (secondaryAction || primaryAction) && /* @__PURE__ */
|
|
11273
|
+
}, children || description)), (secondaryAction || primaryAction) && /* @__PURE__ */ import_react78.default.createElement(Box.Flex, {
|
|
11293
11274
|
marginTop: "7",
|
|
11294
11275
|
gap: "4",
|
|
11295
11276
|
justifyContent: "center",
|
|
11296
11277
|
alignItems: "center",
|
|
11297
11278
|
wrap: "wrap"
|
|
11298
|
-
}, primaryAction && /* @__PURE__ */
|
|
11279
|
+
}, primaryAction && /* @__PURE__ */ import_react78.default.createElement(import_react78.default.Fragment, null, !isLink(primaryAction) && /* @__PURE__ */ import_react78.default.createElement(Button.Primary, __spreadValues({}, (0, import_omit9.default)(primaryAction, "text")), primaryAction.text), isLink(primaryAction) && /* @__PURE__ */ import_react78.default.createElement(Button.ExternalLink, __spreadValues({
|
|
11299
11280
|
kind: "primary"
|
|
11300
|
-
}, (0, import_omit9.default)(primaryAction, "text")), primaryAction.text)), secondaryAction && /* @__PURE__ */
|
|
11281
|
+
}, (0, import_omit9.default)(primaryAction, "text")), primaryAction.text)), secondaryAction && /* @__PURE__ */ import_react78.default.createElement(import_react78.default.Fragment, null, !isLink(secondaryAction) && /* @__PURE__ */ import_react78.default.createElement(Button.Secondary, __spreadValues({}, (0, import_omit9.default)(secondaryAction, "text")), secondaryAction.text), isLink(secondaryAction) && /* @__PURE__ */ import_react78.default.createElement(Button.ExternalLink, __spreadValues({
|
|
11301
11282
|
kind: "secondary"
|
|
11302
|
-
}, (0, import_omit9.default)(secondaryAction, "text")), secondaryAction.text))), footer && /* @__PURE__ */
|
|
11303
|
-
marginTop: "
|
|
11304
|
-
}, /* @__PURE__ */
|
|
11305
|
-
htmlTag: "div",
|
|
11306
|
-
variant: "small",
|
|
11283
|
+
}, (0, import_omit9.default)(secondaryAction, "text")), secondaryAction.text))), footer && /* @__PURE__ */ import_react78.default.createElement(Box, {
|
|
11284
|
+
marginTop: "5"
|
|
11285
|
+
}, /* @__PURE__ */ import_react78.default.createElement(Typography2.Small, {
|
|
11307
11286
|
color: "grey-60"
|
|
11308
11287
|
}, footer)))));
|
|
11309
11288
|
};
|
|
11310
11289
|
|
|
11290
|
+
// src/molecules/Flexbox/FlexboxItem.tsx
|
|
11291
|
+
var import_react79 = __toESM(require("react"));
|
|
11292
|
+
var FlexboxItem = Tailwindify(
|
|
11293
|
+
({ htmlTag = "div", className, style, children, display, flex, grow, shrink, order, alignSelf }) => {
|
|
11294
|
+
const hookStyle = useStyle({
|
|
11295
|
+
display,
|
|
11296
|
+
flex,
|
|
11297
|
+
flexGrow: grow,
|
|
11298
|
+
flexShrink: shrink,
|
|
11299
|
+
order,
|
|
11300
|
+
alignSelf
|
|
11301
|
+
});
|
|
11302
|
+
const HtmlElement = htmlTag;
|
|
11303
|
+
return /* @__PURE__ */ import_react79.default.createElement(HtmlElement, {
|
|
11304
|
+
style: __spreadValues(__spreadValues({}, hookStyle), style),
|
|
11305
|
+
className
|
|
11306
|
+
}, children);
|
|
11307
|
+
}
|
|
11308
|
+
);
|
|
11309
|
+
|
|
11311
11310
|
// src/molecules/Grid/GridItem.tsx
|
|
11312
11311
|
var import_react80 = __toESM(require("react"));
|
|
11313
11312
|
var GridItem = Tailwindify(
|
package/dist/system.mjs
CHANGED
|
@@ -3561,7 +3561,7 @@ var require_loading = __commonJS({
|
|
|
3561
3561
|
"src/icons/loading.js"(exports) {
|
|
3562
3562
|
"use strict";
|
|
3563
3563
|
var data = {
|
|
3564
|
-
"body": '<g fill="none" fill-rule="evenodd" stroke="currentColor" stroke-width="
|
|
3564
|
+
"body": '<g fill="none" fill-rule="evenodd" stroke="currentColor" stroke-width="3" transform="translate(1 1)"><circle cx="18" cy="18" r="18" stroke-opacity=".5"/><path d="M36 18c0-9.94-8.06-18-18-18"><animateTransform attributeName="transform" dur="1s" from="0 18 18" repeatCount="indefinite" to="360 18 18" type="rotate"/></path></g>',
|
|
3565
3565
|
"left": 0,
|
|
3566
3566
|
"top": 0,
|
|
3567
3567
|
"width": 38,
|
|
@@ -11036,31 +11036,11 @@ Dropdown.Menu = DropdownMenu3;
|
|
|
11036
11036
|
Dropdown.Item = DropdownItem;
|
|
11037
11037
|
|
|
11038
11038
|
// src/molecules/EmptyState/EmptyState.tsx
|
|
11039
|
-
import React72 from "react";
|
|
11040
|
-
import omit10 from "lodash/omit";
|
|
11041
|
-
|
|
11042
|
-
// src/molecules/Flexbox/FlexboxItem.tsx
|
|
11043
11039
|
import React71 from "react";
|
|
11044
|
-
|
|
11045
|
-
({ htmlTag = "div", className, style, children, display, flex, grow, shrink, order, alignSelf }) => {
|
|
11046
|
-
const hookStyle = useStyle({
|
|
11047
|
-
display,
|
|
11048
|
-
flex,
|
|
11049
|
-
flexGrow: grow,
|
|
11050
|
-
flexShrink: shrink,
|
|
11051
|
-
order,
|
|
11052
|
-
alignSelf
|
|
11053
|
-
});
|
|
11054
|
-
const HtmlElement = htmlTag;
|
|
11055
|
-
return /* @__PURE__ */ React71.createElement(HtmlElement, {
|
|
11056
|
-
style: __spreadValues(__spreadValues({}, hookStyle), style),
|
|
11057
|
-
className
|
|
11058
|
-
}, children);
|
|
11059
|
-
}
|
|
11060
|
-
);
|
|
11061
|
-
|
|
11062
|
-
// src/molecules/EmptyState/EmptyState.tsx
|
|
11040
|
+
import omit10 from "lodash/omit";
|
|
11063
11041
|
var EmptyStateLayout = /* @__PURE__ */ ((EmptyStateLayout2) => {
|
|
11042
|
+
EmptyStateLayout2["Vertical"] = "vertical";
|
|
11043
|
+
EmptyStateLayout2["Horizontal"] = "horizontal";
|
|
11064
11044
|
EmptyStateLayout2["CenterVertical"] = "center-vertical";
|
|
11065
11045
|
EmptyStateLayout2["LeftVertical"] = "left-vertical";
|
|
11066
11046
|
EmptyStateLayout2["CenterHorizontal"] = "center-horizontal";
|
|
@@ -11076,6 +11056,7 @@ var layoutStyle = (layout) => {
|
|
|
11076
11056
|
alignItems: "flex-start"
|
|
11077
11057
|
};
|
|
11078
11058
|
case "left-horizontal" /* LeftHorizontal */:
|
|
11059
|
+
case "horizontal" /* Horizontal */:
|
|
11079
11060
|
return {
|
|
11080
11061
|
layout: "row",
|
|
11081
11062
|
justifyContent: "flex-start",
|
|
@@ -11088,6 +11069,7 @@ var layoutStyle = (layout) => {
|
|
|
11088
11069
|
alignItems: "flex-start"
|
|
11089
11070
|
};
|
|
11090
11071
|
case "center-vertical" /* CenterVertical */:
|
|
11072
|
+
case "vertical" /* Vertical */:
|
|
11091
11073
|
default:
|
|
11092
11074
|
return {
|
|
11093
11075
|
layout: "column",
|
|
@@ -11096,6 +11078,7 @@ var layoutStyle = (layout) => {
|
|
|
11096
11078
|
};
|
|
11097
11079
|
}
|
|
11098
11080
|
};
|
|
11081
|
+
var isVerticalLayout = (layout) => layout === "vertical" /* Vertical */ || layout === "center-vertical" /* CenterVertical */;
|
|
11099
11082
|
var EmptyState = ({
|
|
11100
11083
|
title,
|
|
11101
11084
|
image,
|
|
@@ -11106,65 +11089,81 @@ var EmptyState = ({
|
|
|
11106
11089
|
primaryAction,
|
|
11107
11090
|
secondaryAction,
|
|
11108
11091
|
footer,
|
|
11109
|
-
layout = "
|
|
11110
|
-
borderStyle = "dashed"
|
|
11092
|
+
layout = "vertical" /* Vertical */,
|
|
11093
|
+
borderStyle = "dashed",
|
|
11094
|
+
fullHeight = isVerticalLayout(layout) ? true : false
|
|
11111
11095
|
}) => {
|
|
11112
11096
|
const template = layoutStyle(layout);
|
|
11113
|
-
return /* @__PURE__ */
|
|
11097
|
+
return /* @__PURE__ */ React71.createElement(Box, {
|
|
11114
11098
|
className: classNames(
|
|
11115
11099
|
"Aquarium-EmptyState",
|
|
11116
|
-
tw("rounded", {
|
|
11100
|
+
tw("rounded p-[56px]", {
|
|
11117
11101
|
"border border-dashed": borderStyle === "dashed",
|
|
11118
11102
|
"border border-solid": borderStyle === "solid",
|
|
11119
|
-
"text-left": layout
|
|
11120
|
-
"text-center": layout
|
|
11103
|
+
"text-left": !isVerticalLayout(layout),
|
|
11104
|
+
"text-center": isVerticalLayout(layout),
|
|
11105
|
+
"h-full": fullHeight
|
|
11121
11106
|
})
|
|
11122
11107
|
),
|
|
11123
11108
|
backgroundColor: "transparent",
|
|
11124
|
-
borderColor: "grey-10"
|
|
11125
|
-
|
|
11126
|
-
|
|
11127
|
-
|
|
11109
|
+
borderColor: "grey-10"
|
|
11110
|
+
}, /* @__PURE__ */ React71.createElement(Box.Flex, {
|
|
11111
|
+
style: { gap: "56px" },
|
|
11112
|
+
flexDirection: template.layout,
|
|
11128
11113
|
justifyContent: template.justifyContent,
|
|
11129
11114
|
alignItems: template.layout === "row" ? "center" : template.alignItems,
|
|
11130
|
-
|
|
11131
|
-
|
|
11132
|
-
}, image && /* @__PURE__ */ React72.createElement(FlexboxItem, null, /* @__PURE__ */ React72.createElement("img", {
|
|
11115
|
+
height: fullHeight ? "full" : void 0
|
|
11116
|
+
}, image && /* @__PURE__ */ React71.createElement("img", {
|
|
11133
11117
|
src: image,
|
|
11134
11118
|
alt: imageAlt,
|
|
11135
11119
|
style: { width: imageWidth ? `${imageWidth}px` : void 0, height: "auto" }
|
|
11136
|
-
})
|
|
11137
|
-
|
|
11138
|
-
direction: "column",
|
|
11120
|
+
}), /* @__PURE__ */ React71.createElement(Box.Flex, {
|
|
11121
|
+
flexDirection: "column",
|
|
11139
11122
|
justifyContent: template.justifyContent,
|
|
11140
11123
|
alignItems: template.alignItems
|
|
11141
|
-
}, /* @__PURE__ */
|
|
11142
|
-
variant: "heading",
|
|
11124
|
+
}, /* @__PURE__ */ React71.createElement(Typography2.Heading, {
|
|
11143
11125
|
htmlTag: "h2"
|
|
11144
|
-
}, title), (description || children) && /* @__PURE__ */
|
|
11126
|
+
}, title), (description || children) && /* @__PURE__ */ React71.createElement(Box, {
|
|
11145
11127
|
marginTop: "5"
|
|
11146
|
-
}, /* @__PURE__ */
|
|
11147
|
-
variant: "default",
|
|
11128
|
+
}, /* @__PURE__ */ React71.createElement(Typography2.Default, {
|
|
11148
11129
|
color: "grey-60"
|
|
11149
|
-
}, children || description)), (secondaryAction || primaryAction) && /* @__PURE__ */
|
|
11130
|
+
}, children || description)), (secondaryAction || primaryAction) && /* @__PURE__ */ React71.createElement(Box.Flex, {
|
|
11150
11131
|
marginTop: "7",
|
|
11151
11132
|
gap: "4",
|
|
11152
11133
|
justifyContent: "center",
|
|
11153
11134
|
alignItems: "center",
|
|
11154
11135
|
wrap: "wrap"
|
|
11155
|
-
}, primaryAction && /* @__PURE__ */
|
|
11136
|
+
}, primaryAction && /* @__PURE__ */ React71.createElement(React71.Fragment, null, !isLink(primaryAction) && /* @__PURE__ */ React71.createElement(Button.Primary, __spreadValues({}, omit10(primaryAction, "text")), primaryAction.text), isLink(primaryAction) && /* @__PURE__ */ React71.createElement(Button.ExternalLink, __spreadValues({
|
|
11156
11137
|
kind: "primary"
|
|
11157
|
-
}, omit10(primaryAction, "text")), primaryAction.text)), secondaryAction && /* @__PURE__ */
|
|
11138
|
+
}, omit10(primaryAction, "text")), primaryAction.text)), secondaryAction && /* @__PURE__ */ React71.createElement(React71.Fragment, null, !isLink(secondaryAction) && /* @__PURE__ */ React71.createElement(Button.Secondary, __spreadValues({}, omit10(secondaryAction, "text")), secondaryAction.text), isLink(secondaryAction) && /* @__PURE__ */ React71.createElement(Button.ExternalLink, __spreadValues({
|
|
11158
11139
|
kind: "secondary"
|
|
11159
|
-
}, omit10(secondaryAction, "text")), secondaryAction.text))), footer && /* @__PURE__ */
|
|
11160
|
-
marginTop: "
|
|
11161
|
-
}, /* @__PURE__ */
|
|
11162
|
-
htmlTag: "div",
|
|
11163
|
-
variant: "small",
|
|
11140
|
+
}, omit10(secondaryAction, "text")), secondaryAction.text))), footer && /* @__PURE__ */ React71.createElement(Box, {
|
|
11141
|
+
marginTop: "5"
|
|
11142
|
+
}, /* @__PURE__ */ React71.createElement(Typography2.Small, {
|
|
11164
11143
|
color: "grey-60"
|
|
11165
11144
|
}, footer)))));
|
|
11166
11145
|
};
|
|
11167
11146
|
|
|
11147
|
+
// src/molecules/Flexbox/FlexboxItem.tsx
|
|
11148
|
+
import React72 from "react";
|
|
11149
|
+
var FlexboxItem = Tailwindify(
|
|
11150
|
+
({ htmlTag = "div", className, style, children, display, flex, grow, shrink, order, alignSelf }) => {
|
|
11151
|
+
const hookStyle = useStyle({
|
|
11152
|
+
display,
|
|
11153
|
+
flex,
|
|
11154
|
+
flexGrow: grow,
|
|
11155
|
+
flexShrink: shrink,
|
|
11156
|
+
order,
|
|
11157
|
+
alignSelf
|
|
11158
|
+
});
|
|
11159
|
+
const HtmlElement = htmlTag;
|
|
11160
|
+
return /* @__PURE__ */ React72.createElement(HtmlElement, {
|
|
11161
|
+
style: __spreadValues(__spreadValues({}, hookStyle), style),
|
|
11162
|
+
className
|
|
11163
|
+
}, children);
|
|
11164
|
+
}
|
|
11165
|
+
);
|
|
11166
|
+
|
|
11168
11167
|
// src/molecules/Grid/GridItem.tsx
|
|
11169
11168
|
import React73 from "react";
|
|
11170
11169
|
var GridItem = Tailwindify(
|