@aivenio/aquarium 1.36.1 → 1.38.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 +90 -8
- package/dist/atoms.mjs +90 -8
- package/dist/src/atoms/Banner/Banner.js +2 -2
- package/dist/src/atoms/Section/Section.js +3 -3
- package/dist/src/atoms/Switch/Switch.js +8 -6
- package/dist/src/atoms/Typography/Typography.js +1 -1
- package/dist/src/icons/ban.d.ts +9 -0
- package/dist/src/icons/ban.js +11 -0
- package/dist/src/icons/index.d.ts +1 -0
- package/dist/src/icons/index.js +2 -1
- package/dist/src/molecules/Checkbox/Checkbox.d.ts +2 -0
- package/dist/src/molecules/Checkbox/Checkbox.js +3 -3
- package/dist/src/molecules/Chip/Chip.js +2 -2
- package/dist/src/molecules/Combobox/Combobox.d.ts +10 -3
- package/dist/src/molecules/Combobox/Combobox.js +5 -5
- package/dist/src/molecules/ControlLabel/ControlLabel.d.ts +1 -1
- package/dist/src/molecules/ControlLabel/ControlLabel.js +11 -7
- package/dist/src/molecules/DataList/DataList.d.ts +3 -8
- package/dist/src/molecules/DataList/DataList.js +16 -32
- package/dist/src/molecules/DataTable/DataTable.d.ts +3 -8
- package/dist/src/molecules/DataTable/DataTable.js +24 -29
- package/dist/src/molecules/Dialog/Dialog.js +6 -4
- package/dist/src/molecules/EmptyState/EmptyState.js +5 -11
- package/dist/src/molecules/Grid/Grid.d.ts +25 -2
- package/dist/src/molecules/Grid/Grid.js +43 -2
- package/dist/src/molecules/Grid/GridItem.d.ts +3 -0
- package/dist/src/molecules/Grid/GridItem.js +4 -1
- package/dist/src/molecules/Input/Input.js +2 -1
- package/dist/src/molecules/List/List.d.ts +11 -1
- package/dist/src/molecules/List/List.js +13 -3
- package/dist/src/molecules/MultiSelect/MultiSelect.d.ts +2 -2
- package/dist/src/molecules/MultiSelect/MultiSelect.js +5 -5
- package/dist/src/molecules/PageHeader/PageHeader.d.ts +2 -21
- package/dist/src/molecules/PageHeader/PageHeader.js +6 -9
- package/dist/src/molecules/Section/Section.d.ts +21 -7
- package/dist/src/molecules/Section/Section.js +32 -15
- package/dist/src/molecules/Switch/Switch.d.ts +2 -0
- package/dist/src/molecules/Switch/Switch.js +3 -3
- package/dist/src/test/config.js +2 -2
- package/dist/src/utils/actions.d.ts +3 -0
- package/dist/src/utils/actions.js +8 -0
- package/dist/src/utils/form/Label/Label.js +1 -1
- package/dist/src/utils/table/types.d.ts +20 -19
- package/dist/src/utils/table/types.js +1 -1
- package/dist/styles.css +22 -15
- package/dist/styles_timescaledb.css +22 -15
- package/dist/system.cjs +743 -566
- package/dist/system.mjs +708 -531
- package/dist/tsconfig.module.tsbuildinfo +1 -1
- package/dist/types/ContextualMenu.d.ts +26 -0
- package/dist/types/ContextualMenu.js +2 -0
- package/dist/types/tailwindGenerated.d.ts +1 -1
- package/package.json +1 -1
@@ -52,7 +52,7 @@ Chip.Skeleton = ChipSkeleton;
|
|
52
52
|
Chip.Skeleton.displayName = 'Chip.Skeleton';
|
53
53
|
export const StatusChip = React.forwardRef((_a, ref) => {
|
54
54
|
var { UNSAFE_icon: icon, text, dense = false, status } = _a, rest = __rest(_a, ["UNSAFE_icon", "text", "dense", "status"]);
|
55
|
-
return (React.createElement(BaseChip.Container, Object.assign({ ref: ref, dense: dense }, rest, { className: getStatusClassNames(status) }),
|
55
|
+
return (React.createElement(BaseChip.Container, Object.assign({ ref: ref, role: "status", "aria-label": text ? text.toString() : undefined, dense: dense }, rest, { className: getStatusClassNames(status) }),
|
56
56
|
icon && React.createElement(InlineIcon, { icon: icon }),
|
57
57
|
text));
|
58
58
|
});
|
@@ -62,4 +62,4 @@ export const ChipContainer = ({ dense, children }) => (React.createElement("div"
|
|
62
62
|
}) }, React.Children.map(children, (child) => isComponentType(child, Chip) || isComponentType(child, StatusChip) || isComponentType(child, ChipSkeleton)
|
63
63
|
? React.cloneElement(child, { dense })
|
64
64
|
: undefined)));
|
65
|
-
//# sourceMappingURL=data:application/json;base64,
|
65
|
+
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiQ2hpcC5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uL3NyYy9tb2xlY3VsZXMvQ2hpcC9DaGlwLnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiOzs7Ozs7Ozs7OztBQUFBLE9BQU8sS0FBSyxNQUFNLE9BQU8sQ0FBQztBQUMxQixPQUFPLFVBQVUsTUFBTSxZQUFZLENBQUM7QUFDcEMsT0FBTyxRQUFRLE1BQU0saUJBQWlCLENBQUM7QUFFdkMsT0FBTyxFQUFFLFNBQVMsRUFBRSxNQUFNLDJCQUEyQixDQUFDO0FBQ3RELE9BQU8sRUFBa0IsVUFBVSxFQUFFLE1BQU0seUJBQXlCLENBQUM7QUFDckUsT0FBTyxFQUFFLFFBQVEsRUFBRSxNQUFNLGlDQUFpQyxDQUFDO0FBRTNELE9BQU8sRUFBRSxJQUFJLElBQUksUUFBUSxFQUFFLE1BQU0scUJBQXFCLENBQUM7QUFFdkQsT0FBTyxFQUFFLEVBQUUsRUFBRSxNQUFNLG9CQUFvQixDQUFDO0FBQ3hDLE9BQU8sRUFBRSxlQUFlLEVBQUUsTUFBTSxhQUFhLENBQUM7QUFFOUMsT0FBTyxTQUFTLE1BQU0saUJBQWlCLENBQUM7QUFDeEMsT0FBTyxRQUFRLE1BQU0sZ0JBQWdCLENBQUM7QUF1Q3RDLE1BQU0sbUJBQW1CLEdBQUcsQ0FBQyxTQUFxQixTQUFTLEVBQVUsRUFBRTtJQUNyRSxRQUFRLE1BQU0sRUFBRTtRQUNkLEtBQUssTUFBTTtZQUNULE9BQU8sRUFBRSxDQUFDLHlCQUF5QixDQUFDLENBQUM7UUFFdkMsS0FBSyxTQUFTO1lBQ1osT0FBTyxFQUFFLENBQUMsa0NBQWtDLENBQUMsQ0FBQztRQUVoRCxLQUFLLFFBQVE7WUFDWCxPQUFPLEVBQUUsQ0FBQywyQkFBMkIsQ0FBQyxDQUFDO1FBRXpDLEtBQUssU0FBUztZQUNaLE9BQU8sRUFBRSxDQUFDLCtCQUErQixDQUFDLENBQUM7UUFFN0MsS0FBSyxTQUFTLENBQUM7UUFDZjtZQUNFLE9BQU8sRUFBRSxDQUFDLHdCQUF3QixDQUFD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
|
@@ -10,7 +10,14 @@ export declare type ComboboxBaseProps<Option> = {
|
|
10
10
|
maxHeight?: string;
|
11
11
|
options: Option[];
|
12
12
|
optionKeys?: string[];
|
13
|
-
|
13
|
+
/**
|
14
|
+
* @deprecated Please use `emptyState` property instead.
|
15
|
+
*/
|
16
|
+
noResults?: string;
|
17
|
+
/**
|
18
|
+
* Empty state to be displayed when there are no results. Defaults to `noResults` property.
|
19
|
+
*/
|
20
|
+
emptyState?: React.ReactNode;
|
14
21
|
optionToString?: (opt: Option | null) => string;
|
15
22
|
createOption?: (value: string | undefined) => Option | undefined;
|
16
23
|
renderOption?: (opt: Option) => React.ReactNode;
|
@@ -20,11 +27,11 @@ export declare type ComboboxBaseProps<Option> = {
|
|
20
27
|
onChange?: (value?: Option | null) => void;
|
21
28
|
};
|
22
29
|
export declare const ComboboxBase: {
|
23
|
-
<Option>({ id, name, placeholder, maxHeight, options, optionKeys, noResults, optionToString: itemToString, createOption, renderOption, isOptionDisabled, defaultValue, value, onChange, children, valid, disabled, readOnly, ...props }: React.PropsWithChildren<ComboboxBaseProps<Option>>): React.ReactElement<ComboboxBaseProps<Option>, string | React.JSXElementConstructor<any>>;
|
30
|
+
<Option>({ id, name, placeholder, maxHeight, options, optionKeys, noResults, emptyState, optionToString: itemToString, createOption, renderOption, isOptionDisabled, defaultValue, value, onChange, children, valid, disabled, readOnly, ...props }: React.PropsWithChildren<ComboboxBaseProps<Option>>): React.ReactElement<ComboboxBaseProps<Option>, string | React.JSXElementConstructor<any>>;
|
24
31
|
Skeleton: React.FC<{}>;
|
25
32
|
};
|
26
33
|
export declare type ComboboxProps<Option> = ComboboxBaseProps<Option> & Omit<LabelControlProps, 'length' | 'maxLength'>;
|
27
34
|
export declare const Combobox: {
|
28
|
-
<Option>({ options, noResults, ...props }: ComboboxProps<Option>): React.ReactElement<ComboboxProps<Option>, string | React.JSXElementConstructor<any>>;
|
35
|
+
<Option>({ options, noResults, emptyState, ...props }: ComboboxProps<Option>): React.ReactElement<ComboboxProps<Option>, string | React.JSXElementConstructor<any>>;
|
29
36
|
Skeleton: React.FC<{}>;
|
30
37
|
};
|
@@ -23,7 +23,7 @@ import { getLabelControlProps, LabelControl } from '../../../src/utils/form/Labe
|
|
23
23
|
import { classNames, tw } from '../../../src/utils/tailwind';
|
24
24
|
export const ComboboxBase = (_a) => {
|
25
25
|
var _b;
|
26
|
-
var { id, name, placeholder, maxHeight, options, optionKeys = ['label', 'value'], noResults, optionToString: itemToString = getOptionLabelBuiltin, createOption, renderOption = (opt) => itemToString(opt), isOptionDisabled = isOptionDisabledBuiltin, defaultValue, value, onChange, children, valid = true, disabled = false, readOnly = false } = _a, props = __rest(_a, ["id", "name", "placeholder", "maxHeight", "options", "optionKeys", "noResults", "optionToString", "createOption", "renderOption", "isOptionDisabled", "defaultValue", "value", "onChange", "children", "valid", "disabled", "readOnly"]);
|
26
|
+
var { id, name, placeholder, maxHeight, options, optionKeys = ['label', 'value'], noResults, emptyState = noResults, optionToString: itemToString = getOptionLabelBuiltin, createOption, renderOption = (opt) => itemToString(opt), isOptionDisabled = isOptionDisabledBuiltin, defaultValue, value, onChange, children, valid = true, disabled = false, readOnly = false } = _a, props = __rest(_a, ["id", "name", "placeholder", "maxHeight", "options", "optionKeys", "noResults", "emptyState", "optionToString", "createOption", "renderOption", "isOptionDisabled", "defaultValue", "value", "onChange", "children", "valid", "disabled", "readOnly"]);
|
27
27
|
const popoverRef = useRef(null);
|
28
28
|
const targetRef = useRef(null);
|
29
29
|
const menuRef = useRef(null);
|
@@ -86,14 +86,14 @@ export const ComboboxBase = (_a) => {
|
|
86
86
|
!readOnly && React.createElement(Select.Toggle, Object.assign({ hasFocus: hasFocus, isOpen: isOpen }, getToggleButtonProps({ disabled })))),
|
87
87
|
isOpen && (React.createElement(PopoverOverlay, { ref: popoverRef, triggerRef: targetRef, state: state, placement: "bottom-left", shouldFlip: true, isNonModal: true, style: { width: (_b = targetRef.current) === null || _b === void 0 ? void 0 : _b.offsetWidth } },
|
88
88
|
React.createElement(Select.Menu, Object.assign({ ref: menuRef, maxHeight: maxHeight }, menuProps),
|
89
|
-
hasNoResults && React.createElement(Select.NoResults, null,
|
89
|
+
hasNoResults && React.createElement(Select.NoResults, null, emptyState),
|
90
90
|
inputItems.map((item, index) => (React.createElement(Select.Item, Object.assign({ key: itemToString(item), selected: item === selectedItem, highlighted: index === highlightedIndex }, getItemProps({ item, index, disabled: isOptionDisabled(item, index) })), renderOption(item)))))))));
|
91
91
|
};
|
92
92
|
const ComboboxBaseSkeleton = () => React.createElement(Skeleton, { height: 38 });
|
93
93
|
ComboboxBase.Skeleton = ComboboxBaseSkeleton;
|
94
94
|
export const Combobox = (_a) => {
|
95
95
|
var _b;
|
96
|
-
var { options, noResults } = _a, props = __rest(_a, ["options", "noResults"]);
|
96
|
+
var { options, noResults, emptyState = noResults } = _a, props = __rest(_a, ["options", "noResults", "emptyState"]);
|
97
97
|
// we need a unique ID to be used for an accessible connection between the input and its error message
|
98
98
|
const id = useRef((_b = props.id) !== null && _b !== void 0 ? _b : `combobox-${uniqueId()}`);
|
99
99
|
const errorMessageId = uniqueId();
|
@@ -101,10 +101,10 @@ export const Combobox = (_a) => {
|
|
101
101
|
const labelControlProps = getLabelControlProps(props);
|
102
102
|
const baseProps = omit(props, Object.keys(labelControlProps));
|
103
103
|
return (React.createElement(LabelControl, Object.assign({ id: `${id.current}-label`, htmlFor: `${id.current}-input`, messageId: errorMessageId }, labelControlProps, { className: "Aquarium-Combobox" }),
|
104
|
-
React.createElement(ComboboxBase, Object.assign({}, baseProps, errorProps, { id: id.current, options: options,
|
104
|
+
React.createElement(ComboboxBase, Object.assign({}, baseProps, errorProps, { id: id.current, options: options, emptyState: emptyState, disabled: props.disabled, valid: props.valid }))));
|
105
105
|
};
|
106
106
|
const ComboboxSkeleton = () => (React.createElement(LabelControl.Skeleton, null,
|
107
107
|
React.createElement(ComboboxBase.Skeleton, null)));
|
108
108
|
Combobox.Skeleton = ComboboxSkeleton;
|
109
109
|
Combobox.Skeleton.displayName = 'Combobox.Skeleton';
|
110
|
-
//# sourceMappingURL=data:application/json;base64,
|
110
|
+
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiQ29tYm9ib3guanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi9zcmMvbW9sZWN1bGVzL0NvbWJvYm94L0NvbWJvYm94LnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiOzs7Ozs7Ozs7OztBQUFBLHFGQUFxRjtBQUNyRixPQUFPLEtBQUssRUFBRSxFQUFFLFNBQVMsRUFBRSxNQUFNLEVBQUUsUUFBUSxFQUFFLE1BQU0sT0FBTyxDQUFDO0FBQzNELE9BQU8sRUFBRSxlQUFlLEVBQUUsTUFBTSxzQkFBc0IsQ0FBQztBQUN2RCxPQUFPLEVBQUUsV0FBVyxFQUFFLE1BQU0sV0FBVyxDQUFDO0FBQ3hDLE9BQU8sSUFBSSxNQUFNLGFBQWEsQ0FBQztBQUMvQixPQUFPLFFBQVEsTUFBTSxpQkFBaUIsQ0FBQztBQUN2QyxPQUFPLEVBQUUsV0FBVyxFQUFFLE1BQU0sY0FBYyxDQUFDO0FBRTNDLE9BQU8sRUFBRSxjQUFjLEVBQUUsTUFBTSxzQ0FBc0MsQ0FBQztBQUN0RSxPQUFPLEVBQUUsUUFBUSxFQUFFLE1BQU0saUNBQWlDLENBQUM7QUFFM0QsT0FBTyxFQUFFLHFCQUFxQixFQUFFLHVCQUF1QixFQUFFLE1BQU0sRUFBRSxNQUFNLHlCQUF5QixDQUFDO0FBRWpHLE9BQU8sRUFBRSxvQkFBb0IsRUFBRSxZQUFZLEVBQTBCLE1BQU0sNEJBQTRCLENBQUM7QUFDeEcsT0FBTyxFQUFFLFVBQVUsRUFBRSxFQUFFLEVBQUUsTUFBTSxvQkFBb0IsQ0FBQztBQTZCcEQsTUFBTSxDQUFDLE1BQU0sWUFBWSxHQUFHLENBQVUsRUFxQmUsRUFBaUQsRUFBRTs7UUFyQmxFLEVBQ3BDLEVBQUUsRUFDRixJQUFJLEVBQ0osV0FBVyxFQUNYLFNBQVMsRUFDVCxPQUFPLEVBQ1AsVUFBVSxHQUFHLENBQUMsT0FBTyxFQUFFLE9BQU8sQ0FBQyxFQUMvQixTQUFTLEVBQ1QsVUFBVSxHQUFHLFNBQVMsRUFDdEIsY0FBYyxFQUFFLFlBQVksR0FBRyxxQkFBcUIsRUFD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
|
@@ -1,6 +1,6 @@
|
|
1
1
|
import React from 'react';
|
2
2
|
import { type ElementProps } from '../../../src/molecules';
|
3
|
-
declare type LabelPlacement = '
|
3
|
+
declare type LabelPlacement = 'left' | 'right';
|
4
4
|
export declare type ControlLabelProps = Omit<ElementProps<'label'>, 'component'> & {
|
5
5
|
label?: React.ReactNode;
|
6
6
|
labelPlacement?: LabelPlacement;
|
@@ -13,14 +13,18 @@ import React from 'react';
|
|
13
13
|
import { Typography } from '../../../src/molecules/Typography/Typography';
|
14
14
|
import { classNames, tw } from '../../../src/utils/tailwind';
|
15
15
|
export const ControlLabel = (_a) => {
|
16
|
-
var { label, caption, disabled = false, readOnly = false, children, style, className } = _a, rest = __rest(_a, ["label", "caption", "disabled", "readOnly", "children", "style", "className"]);
|
17
|
-
const textClass = disabled ? 'text-grey-40' : 'text-grey-
|
18
|
-
|
16
|
+
var { label, labelPlacement = 'right', caption, disabled = false, readOnly = false, children, style, className } = _a, rest = __rest(_a, ["label", "labelPlacement", "caption", "disabled", "readOnly", "children", "style", "className"]);
|
17
|
+
const textClass = disabled ? 'text-grey-40' : 'text-grey-70';
|
18
|
+
const rtl = labelPlacement === 'left';
|
19
|
+
const labelEl = label && React.createElement("span", { className: tw('typography-small self-center', { 'text-right': rtl }) }, label);
|
20
|
+
return (React.createElement("label", Object.assign({ className: classNames(className, tw('inline-grid', {
|
21
|
+
'grid-cols-[auto_1fr]': !rtl,
|
22
|
+
'grid-cols-[1fr_auto]': rtl,
|
19
23
|
'cursor-pointer': !disabled && !readOnly,
|
20
24
|
'cursor-not-allowed': disabled,
|
21
25
|
}, textClass)), style: Object.assign({}, style) }, rest),
|
22
|
-
children,
|
23
|
-
|
24
|
-
caption && (React.createElement(Typography, { className: tw('col-start-2'), variant: "caption", color: disabled ? 'grey-40' : 'grey-50' }, caption))));
|
26
|
+
rtl ? labelEl : children,
|
27
|
+
rtl ? children : labelEl,
|
28
|
+
caption && (React.createElement(Typography, { className: tw({ 'col-start-2': !rtl }), variant: "caption", color: disabled ? 'grey-40' : 'grey-50' }, caption))));
|
25
29
|
};
|
26
|
-
//# sourceMappingURL=data:application/json;base64,
|
30
|
+
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiQ29udHJvbExhYmVsLmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vc3JjL21vbGVjdWxlcy9Db250cm9sTGFiZWwvQ29udHJvbExhYmVsLnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiOzs7Ozs7Ozs7OztBQUFBLE9BQU8sS0FBSyxNQUFNLE9BQU8sQ0FBQztBQUUxQixPQUFPLEVBQUUsVUFBVSxFQUFFLE1BQU0scUNBQXFDLENBQUM7QUFHakUsT0FBTyxFQUFFLFVBQVUsRUFBRSxFQUFFLEVBQUUsTUFBTSxvQkFBb0IsQ0FBQztBQVlwRCxNQUFNLENBQUMsTUFBTSxZQUFZLEdBQWdDLENBQUMsRUFVekQsRUFBRSxFQUFFO1FBVnFELEVBQ3hELEtBQUssRUFDTCxjQUFjLEdBQUcsT0FBTyxFQUN4QixPQUFPLEVBQ1AsUUFBUSxHQUFHLEtBQUssRUFDaEIsUUFBUSxHQUFHLEtBQUssRUFDaEIsUUFBUSxFQUNSLEtBQUssRUFDTCxTQUFTLE9BRVYsRUFESSxJQUFJLGNBVGlELGdHQVV6RCxDQURRO0lBRVAsTUFBTSxTQUFTLEdBQUcsUUFBUSxDQUFDLENBQUMsQ0FBQyxjQUFjLENBQUMsQ0FBQyxDQUFDLGNBQWMsQ0FBQztJQUM3RCxNQUFNLEdBQUcsR0FBRyxjQUFjLEtBQUssTUFBTSxDQUFDO0lBRXRDLE1BQU0sT0FBTyxHQUFHLEtBQUssSUFBSSw4QkFBTSxTQUFTLEVBQUUsRUFBRSxDQUFDLDhCQUE4QixFQUFFLEVBQUUsWUFBWSxFQUFFLEdBQUcsRUFBRSxDQUFDLElBQUcsS0FBSyxDQUFRLENBQUM7SUFFcEgsT0FBTyxDQUNMLDZDQUNFLFNBQVMsRUFBRSxVQUFVLENBQ25CLFNBQVMsRUFDVCxFQUFFLENBQ0EsYUFBYSxFQUNiO1lBQ0Usc0JBQXNCLEVBQUUsQ0FBQyxHQUFHO1lBQzVCLHNCQUFzQixFQUFFLEdBQUc7WUFDM0IsZ0JBQWdCLEVBQUUsQ0FBQyxRQUFRLElBQUksQ0FBQyxRQUFRO1lBQ3hDLG9CQUFvQixFQUFFLFFBQVE7U0FDL0IsRUFDRCxTQUFTLENBQ1YsQ0FDRixFQUNELEtBQUssb0JBQU8sS0FBSyxLQUNiLElBQUk7UUFFUCxHQUFHLENBQUMsQ0FBQyxDQUFDLE9BQU8sQ0FBQyxDQUFDLENBQUMsUUFBUTtRQUN4QixHQUFHLENBQUMsQ0FBQyxDQUFDLFFBQVEsQ0FBQyxDQUFDLENBQUMsT0FBTztRQUN4QixPQUFPLElBQUksQ0FDVixvQkFBQyxVQUFVLElBQUMsU0FBUyxFQUFFLEVBQUUsQ0FBQyxFQUFFLGFBQWEsRUFBRSxDQUFDLEdBQUcsRUFBRSxDQUFDLEVBQUUsT0FBTyxFQUFDLFNBQVMsRUFBQyxLQUFLLEVBQUUsUUFBUSxDQUFDLENBQUMsQ0FBQyxTQUFTLENBQUMsQ0FBQyxDQUFDLFNBQVMsSUFDMUcsT0FBTyxDQUNHLENBQ2QsQ0FDSyxDQUNULENBQUM7QUFDSixDQUFDLENBQUMifQ==
|
@@ -1,7 +1,7 @@
|
|
1
1
|
import React from 'react';
|
2
|
-
import { type
|
2
|
+
import { type ListProps } from '../../../src/molecules/List/List';
|
3
3
|
import { type DataListColumn, type DataTableMenuProps, type DataTableRow } from '../../../src/utils/table/types';
|
4
|
-
export declare type DataListProps<C extends DataListColumn<R>, R extends DataTableRow> = DataTableMenuProps<R> & {
|
4
|
+
export declare type DataListProps<C extends DataListColumn<R>, R extends DataTableRow> = DataTableMenuProps<R> & Pick<ListProps<R>, 'pagination'> & {
|
5
5
|
/**
|
6
6
|
* Array of column definitions that correspond to the data rows.
|
7
7
|
*/
|
@@ -16,14 +16,9 @@ export declare type DataListProps<C extends DataListColumn<R>, R extends DataTab
|
|
16
16
|
* @default true
|
17
17
|
*/
|
18
18
|
sticky?: boolean;
|
19
|
-
/**
|
20
|
-
* Optional pagination props for the data table. Use boolean `true` to enable pagination with default settings and use
|
21
|
-
* object to pass in custom settings for pagination such as page size.
|
22
|
-
*/
|
23
|
-
pagination?: ListPaginationProps | true;
|
24
19
|
};
|
25
20
|
export declare const DataList: {
|
26
|
-
<C extends DataListColumn<R>, R extends DataTableRow>({ columns, rows
|
21
|
+
<C extends DataListColumn<R>, R extends DataTableRow>({ columns, rows, sticky, menu, menuLabel, menuAriaLabel, menuHeaderName, onAction, onMenuOpenChange, pagination, }: DataListProps<C, R>): React.JSX.Element;
|
27
22
|
Skeleton: React.FC<{
|
28
23
|
columns?: number | (number | `${number}`)[] | undefined;
|
29
24
|
rows?: number | undefined;
|
@@ -1,24 +1,10 @@
|
|
1
|
-
var __rest = (this && this.__rest) || function (s, e) {
|
2
|
-
var t = {};
|
3
|
-
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
|
4
|
-
t[p] = s[p];
|
5
|
-
if (s != null && typeof Object.getOwnPropertySymbols === "function")
|
6
|
-
for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
|
7
|
-
if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
|
8
|
-
t[p[i]] = s[p[i]];
|
9
|
-
}
|
10
|
-
return t;
|
11
|
-
};
|
12
1
|
import React from 'react';
|
13
2
|
import compact from 'lodash/compact';
|
14
3
|
import isFunction from 'lodash/isFunction';
|
15
|
-
import isObject from 'lodash/isObject';
|
16
4
|
import { Button } from '../../../src/molecules/Button/Button';
|
17
5
|
import { StatusChip } from '../../../src/molecules/Chip/Chip';
|
18
6
|
import { DropdownMenu } from '../../../src/molecules/DropdownMenu/DropdownMenu';
|
19
7
|
import { List } from '../../../src/molecules/List/List';
|
20
|
-
import { Pagination } from '../../../src/molecules/Pagination/Pagination';
|
21
|
-
import { usePagination } from '../../../src/molecules/Pagination/usePagination';
|
22
8
|
import { Template } from '../../../src/molecules/Template/Template';
|
23
9
|
import { DataList as DataListBase } from '../../../src/atoms/DataList/DataList';
|
24
10
|
import { Item } from '../../../src/atoms/Table/Table';
|
@@ -27,35 +13,33 @@ import { cellProps, columnIsFieldColumn, } from '../../../src/utils/table/types'
|
|
27
13
|
import { useTableSort } from '../../../src/utils/table/useTableSort';
|
28
14
|
import { sortRowsBy } from '../../../src/utils/table/utils';
|
29
15
|
import more from '../../../src/icons/more';
|
16
|
+
import { Tooltip } from '../Tooltip/Tooltip';
|
30
17
|
import { DataListSkeleton } from './DataListSkeleton';
|
31
|
-
export const DataList = ({ columns, rows
|
18
|
+
export const DataList = ({ columns, rows, sticky, menu, menuLabel, menuAriaLabel = menuLabel !== null && menuLabel !== void 0 ? menuLabel : 'Context menu', menuHeaderName = 'Actions', onAction, onMenuOpenChange, pagination, }) => {
|
32
19
|
const [sort, updateSort] = useTableSort();
|
33
|
-
const sortedRows = sortRowsBy(
|
34
|
-
const _a = isObject(_pagination)
|
35
|
-
? _pagination
|
36
|
-
: {}, { initialPage, initialPageSize } = _a, paginationProps = __rest(_a, ["initialPage", "initialPageSize"]);
|
37
|
-
const [paginatedItems, paginationState] = usePagination(sortedRows, { initialPage, initialPageSize });
|
38
|
-
const rows = _pagination ? paginatedItems : sortedRows;
|
20
|
+
const sortedRows = sortRowsBy(rows, sort);
|
39
21
|
const templateColumns = compact([
|
40
22
|
...columns.map((column) => { var _a; return (_a = column.width) !== null && _a !== void 0 ? _a : 'auto'; }),
|
41
23
|
menu ? 'auto' : undefined,
|
42
24
|
]);
|
43
|
-
const
|
44
|
-
|
25
|
+
const PaginationFooter = React.useCallback(({ children }) => React.createElement("div", { style: { gridColumn: `span ${templateColumns.length}` } }, children), [templateColumns.length]);
|
26
|
+
return (React.createElement(Template, { className: "Aquarium-DataList", columns: templateColumns },
|
27
|
+
columns.map((column) => {
|
28
|
+
const content = column.headerTooltip ? (React.createElement(Tooltip, { placement: column.headerTooltip.placement, content: column.headerTooltip.content }, column.headerName)) : (column.headerName);
|
29
|
+
return (columnIsFieldColumn(column) && column.sortable) || column.sort ? (React.createElement(DataListBase.SortCell, Object.assign({ direction: sort && sort.column.headerName === column.headerName ? sort.direction : 'none', onClick: () => updateSort(column), sticky: sticky }, cellProps(column)), content)) : (React.createElement(DataListBase.HeadCell, Object.assign({}, cellProps(column), { sticky: sticky }), content));
|
30
|
+
}),
|
45
31
|
menu && (React.createElement(DataListBase.HeadCell, { align: "right", "aria-label": menuAriaLabel }, menuHeaderName)),
|
46
|
-
React.createElement(List, { items:
|
47
|
-
React.createElement(List, { items: columns, renderItem: (column) =>
|
48
|
-
React.createElement(StatusChip, Object.assign({ dense: true }, column.status(row, index, sortedRows))))) : column.type === 'action' ? (React.createElement(DataListBase.Cell, Object.assign({}, cellProps(column)),
|
49
|
-
React.createElement(Button.Secondary, Object.assign({ dense: true }, renameProperty('text', 'children', column.action(row, index, sortedRows)))))) : column.type === 'custom' ? (React.createElement(DataListBase.Cell, Object.assign({}, cellProps(column)), column.UNSAFE_render(row, index, sortedRows))) : column.type === 'item' ? (React.createElement(DataListBase.Cell, Object.assign({}, cellProps(column)),
|
50
|
-
React.createElement(Item, Object.assign({}, column.item(row, index, sortedRows))))) : (React.createElement(DataListBase.Cell, Object.assign({}, cellProps(column)), column.formatter ? column.formatter(row[column.field], row, index, sortedRows) : row[column.field])) }),
|
32
|
+
React.createElement(List, { pagination: pagination, paginationContainer: PaginationFooter, items: sortedRows, renderItem: (row, index) => (React.createElement(DataListBase.Row, { key: row.id },
|
33
|
+
React.createElement(List, { items: columns, renderItem: (column) => (React.createElement(DataListBase.Cell, Object.assign({}, cellProps(column)), renderItem(column, row, index, sortedRows))) }),
|
51
34
|
menu && (React.createElement(DataListBase.Cell, { align: "right" },
|
52
35
|
React.createElement(DropdownMenu, { onAction: (action) => onAction === null || onAction === void 0 ? void 0 : onAction(action, row, index), onOpenChange: onMenuOpenChange },
|
53
36
|
React.createElement(DropdownMenu.Trigger, null,
|
54
37
|
React.createElement(Button.Icon, { "aria-label": menuAriaLabel, icon: more })),
|
55
38
|
isFunction(menu) ? menu(row, index) : menu))))) })));
|
56
|
-
|
57
|
-
|
58
|
-
|
39
|
+
};
|
40
|
+
const renderItem = (column, row, index, sortedRows) => {
|
41
|
+
const cellContent = column.type === 'status' ? (React.createElement(StatusChip, Object.assign({ dense: true }, column.status(row, index, sortedRows)))) : column.type === 'action' ? (React.createElement(Button.Secondary, Object.assign({ dense: true }, renameProperty('text', 'children', column.action(row, index, sortedRows))))) : column.type === 'custom' ? (column.UNSAFE_render(row, index, sortedRows)) : column.type === 'item' ? (React.createElement(Item, Object.assign({}, column.item(row, index, sortedRows)))) : column.formatter ? (column.formatter(row[column.field], row, index, sortedRows)) : (row[column.field]);
|
42
|
+
return column.tooltip ? React.createElement(Tooltip, Object.assign({}, column.tooltip(row, index, sortedRows)), cellContent) : cellContent;
|
59
43
|
};
|
60
44
|
DataList.Skeleton = DataListSkeleton;
|
61
|
-
//# sourceMappingURL=data:application/json;base64,
|
45
|
+
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiRGF0YUxpc3QuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi9zcmMvbW9sZWN1bGVzL0RhdGFMaXN0L0RhdGFMaXN0LnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQSxPQUFPLEtBQUssTUFBTSxPQUFPLENBQUM7QUFDMUIsT0FBTyxPQUFPLE1BQU0sZ0JBQWdCLENBQUM7QUFDckMsT0FBTyxVQUFVLE1BQU0sbUJBQW1CLENBQUM7QUFFM0MsT0FBTyxFQUFFLE1BQU0sRUFBRSxNQUFNLDZCQUE2QixDQUFDO0FBQ3JELE9BQU8sRUFBRSxVQUFVLEVBQUUsTUFBTSx5QkFBeUIsQ0FBQztBQUNyRCxPQUFPLEVBQUUsWUFBWSxFQUFFLE1BQU0seUNBQXlDLENBQUM7QUFDdkUsT0FBTyxFQUFFLElBQUksRUFBa0IsTUFBTSx5QkFBeUIsQ0FBQztBQUMvRCxPQUFPLEVBQUUsUUFBUSxFQUFlLE1BQU0saUNBQWlDLENBQUM7QUFFeEUsT0FBTyxFQUFFLFFBQVEsSUFBSSxZQUFZLEVBQUUsTUFBTSw2QkFBNkIsQ0FBQztBQUN2RSxPQUFPLEVBQUUsSUFBSSxFQUFFLE1BQU0sdUJBQXVCLENBQUM7QUFFN0MsT0FBTyxFQUFFLGNBQWMsRUFBRSxNQUFNLGtCQUFrQixDQUFDO0FBQ2xELE9BQU8sRUFDTCxTQUFTLEVBQ1QsbUJBQW1CLEdBSXBCLE1BQU0sdUJBQXVCLENBQUM7QUFDL0IsT0FBTyxFQUFFLFlBQVksRUFBRSxNQUFNLDhCQUE4QixDQUFDO0FBQzVELE9BQU8sRUFBRSxVQUFVLEVBQUUsTUFBTSx1QkFBdUIsQ0FBQztBQUVuRCxPQUFPLElBQUksTUFBTSxnQkFBZ0IsQ0FBQztBQUVsQyxPQUFPLEVBQUUsT0FBTyxFQUFFLE1BQU0sb0JBQW9CLENBQUM7QUFFN0MsT0FBTyxFQUFFLGdCQUFnQixFQUFFLE1BQU0sb0JBQW9CLENBQUM7QUFzQnRELE1BQU0sQ0FBQyxNQUFNLFFBQVEsR0FBRyxDQUFzRCxFQUM1RSxPQUFPLEVB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
|
@@ -1,8 +1,8 @@
|
|
1
1
|
import React from 'react';
|
2
|
-
import { type
|
2
|
+
import { type ListProps } from '../../../src/molecules/List/List';
|
3
3
|
import { type TableProps } from '../../../src/molecules/Table/Table';
|
4
4
|
import { type DataTableColumn, type DataTableMenuProps, type DataTableRow } from '../../../src/utils/table/types';
|
5
|
-
export declare type DataTableProps<C extends DataTableColumn<R>, R extends DataTableRow> = DataTableMenuProps<R> & Pick<TableProps, 'ariaLabel' | 'onNext' | 'onPrev'> & {
|
5
|
+
export declare type DataTableProps<C extends DataTableColumn<R>, R extends DataTableRow> = DataTableMenuProps<R> & Pick<ListProps<R>, 'pagination'> & Pick<TableProps, 'ariaLabel' | 'onNext' | 'onPrev'> & {
|
6
6
|
/**
|
7
7
|
* Array of column definitions that correspond to the data rows.
|
8
8
|
*/
|
@@ -26,14 +26,9 @@ export declare type DataTableProps<C extends DataTableColumn<R>, R extends DataT
|
|
26
26
|
* @default true
|
27
27
|
*/
|
28
28
|
sticky?: boolean;
|
29
|
-
/**
|
30
|
-
* Optional pagination props for the data table. Use boolean `true` to enable pagination with default settings and use
|
31
|
-
* object to pass in custom settings for pagination such as page size.
|
32
|
-
*/
|
33
|
-
pagination?: ListPaginationProps | true;
|
34
29
|
};
|
35
30
|
export declare const DataTable: {
|
36
|
-
<C extends DataTableColumn<R>, R extends DataTableRow>({ columns, rows
|
31
|
+
<C extends DataTableColumn<R>, R extends DataTableRow>({ columns, rows, noWrap, layout, sticky, menu, menuLabel, menuAriaLabel, menuHeaderName, onAction, onMenuOpenChange, pagination, ...rest }: DataTableProps<C, R>): React.JSX.Element;
|
37
32
|
Skeleton: React.FC<{
|
38
33
|
columns?: number | (number | `${number}`)[] | undefined;
|
39
34
|
rows?: number | undefined;
|
@@ -12,14 +12,11 @@ var __rest = (this && this.__rest) || function (s, e) {
|
|
12
12
|
import React from 'react';
|
13
13
|
import compact from 'lodash/compact';
|
14
14
|
import isFunction from 'lodash/isFunction';
|
15
|
-
import isObject from 'lodash/isObject';
|
16
15
|
import { Button } from '../../../src/molecules/Button/Button';
|
17
16
|
import { StatusChip } from '../../../src/molecules/Chip/Chip';
|
18
17
|
import { DataListSkeleton } from '../../../src/molecules/DataList/DataListSkeleton';
|
19
18
|
import { DropdownMenu } from '../../../src/molecules/DropdownMenu/DropdownMenu';
|
20
19
|
import { List } from '../../../src/molecules/List/List';
|
21
|
-
import { Pagination } from '../../../src/molecules/Pagination/Pagination';
|
22
|
-
import { usePagination } from '../../../src/molecules/Pagination/usePagination';
|
23
20
|
import { Table } from '../../../src/molecules/Table/Table';
|
24
21
|
import { Item } from '../../../src/atoms/Table/Table';
|
25
22
|
import { renameProperty } from '../../../src/utils/object';
|
@@ -28,40 +25,38 @@ import { useTableSort } from '../../../src/utils/table/useTableSort';
|
|
28
25
|
import { sortRowsBy } from '../../../src/utils/table/utils';
|
29
26
|
import { classNames, tw } from '../../../src/utils/tailwind';
|
30
27
|
import more from '../../../src/icons/more';
|
28
|
+
import { Tooltip } from '../Tooltip/Tooltip';
|
31
29
|
export const DataTable = (_a) => {
|
32
|
-
var { columns, rows
|
30
|
+
var { columns, rows, noWrap = false, layout = 'auto', sticky, menu, menuLabel, menuAriaLabel = menuLabel !== null && menuLabel !== void 0 ? menuLabel : 'Context menu', menuHeaderName = 'Actions', onAction, onMenuOpenChange, pagination } = _a, rest = __rest(_a, ["columns", "rows", "noWrap", "layout", "sticky", "menu", "menuLabel", "menuAriaLabel", "menuHeaderName", "onAction", "onMenuOpenChange", "pagination"]);
|
33
31
|
const [sort, updateSort] = useTableSort();
|
34
|
-
const sortedRows = sortRowsBy(
|
35
|
-
const
|
36
|
-
|
37
|
-
|
38
|
-
|
39
|
-
|
40
|
-
const content = (React.createElement(Table, Object.assign({}, rest, { className: classNames('Aquarium-DataTable', tw({
|
32
|
+
const sortedRows = sortRowsBy(rows, sort);
|
33
|
+
const amountOfColumns = columns.length + (menu ? 1 : 0);
|
34
|
+
const PaginationFooter = React.useCallback(({ children }) => (React.createElement("tfoot", null,
|
35
|
+
React.createElement("tr", null,
|
36
|
+
React.createElement("td", { colSpan: amountOfColumns }, children)))), [amountOfColumns]);
|
37
|
+
return (React.createElement(Table, Object.assign({}, rest, { className: classNames('Aquarium-DataTable', tw({
|
41
38
|
'whitespace-nowrap': noWrap,
|
42
39
|
'table-auto': layout === 'auto',
|
43
40
|
'table-fixed': layout === 'fixed',
|
44
41
|
})) }),
|
45
42
|
React.createElement(Table.Head, { sticky: sticky }, compact([
|
46
|
-
...columns.map((column) =>
|
43
|
+
...columns.map((column) => {
|
44
|
+
const content = column.headerTooltip && !column.headerInvisible ? (React.createElement(Tooltip, { placement: column.headerTooltip.placement, content: column.headerTooltip.content }, column.headerName)) : (!column.headerInvisible && column.headerName);
|
45
|
+
return (columnIsFieldColumn(column) && column.sortable) || column.sort ? (React.createElement(Table.SortCell, Object.assign({ direction: sort && sort.column.headerName === column.headerName ? sort.direction : 'none', onClick: () => updateSort(column), style: { width: column.width }, "aria-label": column.headerInvisible ? column.headerName : undefined }, cellProps(column)), content)) : (React.createElement(Table.Cell, Object.assign({}, cellProps(column), { style: { width: column.width }, "aria-label": column.headerInvisible ? column.headerName : undefined }), content));
|
46
|
+
}),
|
47
47
|
menu ? (React.createElement(Table.Cell, { key: "__contextMenu", align: "right", "aria-label": menuAriaLabel }, menuHeaderName)) : null,
|
48
48
|
])),
|
49
|
-
React.createElement(Table.Body,
|
50
|
-
|
51
|
-
|
52
|
-
|
53
|
-
|
54
|
-
React.createElement(
|
55
|
-
|
56
|
-
|
57
|
-
|
58
|
-
|
59
|
-
|
60
|
-
React.createElement(Button.Icon, { "aria-label": menuAriaLabel, icon: more })),
|
61
|
-
isFunction(menu) ? menu(row, index) : menu))))) }))));
|
62
|
-
return _pagination ? (React.createElement("div", null,
|
63
|
-
content,
|
64
|
-
React.createElement(Pagination, Object.assign({}, paginationState, paginationProps)))) : (content);
|
49
|
+
React.createElement(List, { container: Table.Body, paginationContainer: PaginationFooter, pagination: pagination, items: sortedRows, renderItem: (row, index) => (React.createElement(Table.Row, { key: row.id },
|
50
|
+
React.createElement(List, { items: columns, renderItem: (column) => (React.createElement(Table.Cell, Object.assign({}, cellProps(column)), renderItem(column, row, index, sortedRows))) }),
|
51
|
+
menu && (React.createElement(Table.Cell, { align: "right" },
|
52
|
+
React.createElement(DropdownMenu, { onAction: (action) => onAction === null || onAction === void 0 ? void 0 : onAction(action, row, index), onOpenChange: onMenuOpenChange },
|
53
|
+
React.createElement(DropdownMenu.Trigger, null,
|
54
|
+
React.createElement(Button.Icon, { "aria-label": menuAriaLabel, icon: more })),
|
55
|
+
isFunction(menu) ? menu(row, index) : menu))))) })));
|
56
|
+
};
|
57
|
+
const renderItem = (column, row, index, sortedRows) => {
|
58
|
+
const cellContent = column.type === 'status' ? (React.createElement(StatusChip, Object.assign({ dense: true }, column.status(row, index, sortedRows)))) : column.type === 'action' ? (React.createElement(Button.Secondary, Object.assign({ dense: true }, renameProperty('text', 'children', column.action(row, index, sortedRows))))) : column.type === 'custom' ? (column.UNSAFE_render(row, index, sortedRows)) : column.type === 'item' ? (React.createElement(Item, Object.assign({}, column.item(row, index, sortedRows)))) : column.formatter ? (column.formatter(row[column.field], row, index, sortedRows)) : (row[column.field]);
|
59
|
+
return column.tooltip ? React.createElement(Tooltip, Object.assign({}, column.tooltip(row, index, sortedRows)), cellContent) : cellContent;
|
65
60
|
};
|
66
61
|
DataTable.Skeleton = DataListSkeleton;
|
67
|
-
//# sourceMappingURL=data:application/json;base64,
|
62
|
+
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiRGF0YVRhYmxlLmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vc3JjL21vbGVjdWxlcy9EYXRhVGFibGUvRGF0YVRhYmxlLnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiOzs7Ozs7Ozs7OztBQUFBLE9BQU8sS0FBSyxNQUFNLE9BQU8sQ0FBQztBQUMxQixPQUFPLE9BQU8sTUFBTSxnQkFBZ0IsQ0FBQztBQUNyQyxPQUFPLFVBQVUsTUFBTSxtQkFBbUIsQ0FBQztBQUUzQyxPQUFPLEVBQUUsTUFBTSxFQUFFLE1BQU0sNkJBQTZCLENBQUM7QUFDckQsT0FBTyxFQUFFLFVBQVUsRUFBRSxNQUFNLHlCQUF5QixDQUFDO0FBQ3JELE9BQU8sRUFBRSxnQkFBZ0IsRUFBRSxNQUFNLHlDQUF5QyxDQUFDO0FBQzNFLE9BQU8sRUFBRSxZQUFZLEVBQUUsTUFBTSx5Q0FBeUMsQ0FBQztBQUN2RSxPQUFPLEVBQUUsSUFBSSxFQUFrQixNQUFNLHlCQUF5QixDQUFDO0FBQy9ELE9BQU8sRUFBRSxLQUFLLEVBQW1CLE1BQU0sMkJBQTJCLENBQUM7QUFFbkUsT0FBTyxFQUFFLElBQUksRUFBRSxNQUFNLHVCQUF1QixDQUFDO0FBRTdDLE9BQU8sRUFBRSxjQUFjLEVBQUUsTUFBTSxrQkFBa0IsQ0FBQztBQUNsRCxPQUFPLEVBQ0wsU0FBUyxFQUNULG1CQUFtQixHQUlwQixNQUFNLHVCQUF1QixDQUFDO0FBQy9CLE9BQU8sRUFBRSxZQUFZLEVBQUUsTUFBTSw4QkFBOEIsQ0FBQztBQUM1RCxPQUFPLEVBQUUsVUFBVSxFQUFFLE1BQU0sdUJBQXVCLENBQUM7QUFDbkQsT0FBTyxFQUFFLFVBQVUsRUFBRSxFQUFFLEVBQUUsTUFBTSxvQkFBb0IsQ0FBQztBQUVwRCxPQUFPLElBQUksTUFBTSxnQkFBZ0IsQ0FBQztBQUVsQyxPQUFPLEVBQUUsT0FBTyxFQUFFLE1BQU0sb0JBQW9CLENBQUM7QUFrQzdDLE1BQU0sQ0FBQyxNQUFNLFNBQVMsR0FBRyxDQUF1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
|
@@ -6,6 +6,7 @@ import { useOverlayTriggerState } from '@react-stately/overlays';
|
|
6
6
|
import omit from 'lodash/omit';
|
7
7
|
import { Button } from '../../../src/molecules/Button/Button';
|
8
8
|
import { Icon } from '../../../src/molecules/Icon/Icon';
|
9
|
+
import { Typography } from '../../../src/molecules/Typography/Typography';
|
9
10
|
import { DIALOG_ICONS_AND_COLORS } from '../../../src/atoms/Dialog/Dialog';
|
10
11
|
import { Modal as BaseModal } from '../../../src/atoms/Modal/Modal';
|
11
12
|
import { tw } from '../../../src/utils/tailwind';
|
@@ -35,13 +36,14 @@ const DialogWrapper = ({ title, type = 'confirmation', children, primaryAction,
|
|
35
36
|
*/
|
36
37
|
const { dialogProps } = useDialog({ 'role': 'alertdialog', 'aria-labelledby': labelledBy, 'aria-describedby': describedBy }, ref);
|
37
38
|
return (React.createElement("div", Object.assign({ ref: ref }, dialogProps, { className: tw('outline-none') }),
|
38
|
-
React.createElement(BaseModal.Header,
|
39
|
+
React.createElement(BaseModal.Header, { className: tw('icon-stroke-2') },
|
39
40
|
React.createElement(Icon, { icon: DIALOG_ICONS_AND_COLORS[type].icon, color: DIALOG_ICONS_AND_COLORS[type].color, fontSize: 20 }),
|
40
|
-
React.createElement(BaseModal.Title, { id: labelledBy, variant: "large
|
41
|
-
React.createElement(BaseModal.Body, { id: describedBy },
|
41
|
+
React.createElement(BaseModal.Title, { id: labelledBy, variant: "large", color: DIALOG_ICONS_AND_COLORS[type].color }, title)),
|
42
|
+
React.createElement(BaseModal.Body, { id: describedBy },
|
43
|
+
React.createElement(Typography.Default, null, children)),
|
42
44
|
React.createElement(BaseModal.Footer, null,
|
43
45
|
React.createElement(BaseModal.Actions, null,
|
44
46
|
secondaryAction && (React.createElement(Button.Ghost, Object.assign({ key: secondaryAction.text }, omit(secondaryAction, 'text')), secondaryAction.text)),
|
45
47
|
React.createElement(Button.Secondary, Object.assign({ key: primaryAction.text }, omit(primaryAction, 'text')), primaryAction.text)))));
|
46
48
|
};
|
47
|
-
//# sourceMappingURL=data:application/json;base64,
|
49
|
+
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiRGlhbG9nLmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vc3JjL21vbGVjdWxlcy9EaWFsb2cvRGlhbG9nLnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQSxPQUFPLEtBQUssTUFBTSxPQUFPLENBQUM7QUFDMUIsT0FBTyxFQUFFLFNBQVMsRUFBRSxNQUFNLG9CQUFvQixDQUFDO0FBQy9DLE9BQU8sRUFBRSxPQUFPLEVBQUUsZUFBZSxFQUFFLE1BQU0sc0JBQXNCLENBQUM7QUFDaEUsT0FBTyxFQUFFLEtBQUssRUFBRSxNQUFNLG1CQUFtQixDQUFDO0FBQzFDLE9BQU8sRUFBRSxzQkFBc0IsRUFBRSxNQUFNLHlCQUF5QixDQUFDO0FBQ2pFLE9BQU8sSUFBSSxNQUFNLGFBQWEsQ0FBQztBQUUvQixPQUFPLEVBQUUsTUFBTSxFQUFFLE1BQU0sNkJBQTZCLENBQUM7QUFDckQsT0FBTyxFQUFFLElBQUksRUFBRSxNQUFNLHlCQUF5QixDQUFDO0FBQy9DLE9BQU8sRUFBRSxVQUFVLEVBQUUsTUFBTSxxQ0FBcUMsQ0FBQztBQUVqRSxPQUFPLEVBQUUsdUJBQXVCLEVBQW1CLE1BQU0seUJBQXlCLENBQUM7QUFDbkYsT0FBTyxFQUFFLEtBQUssSUFBSSxTQUFTLEVBQUUsTUFBTSx1QkFBdUIsQ0FBQztBQUUzRCxPQUFPLEVBQUUsRUFBRSxFQUFFLE1BQU0sb0JBQW9CLENBQUM7QUF1QnhDLE1BQU0sQ0FBQyxNQUFNLE1BQU0sR0FBMEIsQ0FBQyxLQUFLLEVBQUUsRUFBRTtJQUNyRCxNQUFNLEdBQUcsR0FBRyxLQUFLLENBQUMsTUFBTSxDQUFpQixJQUFJLENBQUMsQ0FBQztJQUMvQyxNQUFNLEtBQUssR0FBRyxzQkFBc0IsQ0FBQyxFQUFFLE1BQU0sRUFBRSxLQUFLLENBQUMsSUFBSSxFQUFFLENBQUMsQ0FBQztJQUM3RCxNQUFNLEVBQUUsVUFBVSxFQUFFLGFBQWEsRUFBRSxHQUFHLGVBQWUsQ0FBQyxFQUFFLEVBQUUsS0FBSyxF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
|
@@ -1,9 +1,7 @@
|
|
1
1
|
import React from 'react';
|
2
|
-
import omit from 'lodash/omit';
|
3
2
|
import { Box } from '../../../src/molecules/Box/Box';
|
4
|
-
import { Button } from '../../../src/molecules/Button/Button';
|
5
3
|
import { Typography } from '../../../src/molecules/Typography/Typography';
|
6
|
-
import {
|
4
|
+
import { renderAction } from '../../../src/utils/actions';
|
7
5
|
import { classNames, tw } from '../../../src/utils/tailwind';
|
8
6
|
export var EmptyStateLayout;
|
9
7
|
(function (EmptyStateLayout) {
|
@@ -80,15 +78,11 @@ export const EmptyState = ({ title, image, imageAlt = '', imageWidth, descriptio
|
|
80
78
|
React.createElement(Box.Flex, { flexDirection: "column", justifyContent: template.justifyContent, alignItems: template.alignItems },
|
81
79
|
React.createElement(Typography.Heading, { htmlTag: "h2" }, title),
|
82
80
|
(description || children) && (React.createElement(Box, { marginTop: "5" },
|
83
|
-
React.createElement(Typography.Default,
|
81
|
+
React.createElement(Typography.Default, null, children || description))),
|
84
82
|
(secondaryAction || primaryAction) && (React.createElement(Box.Flex, { marginTop: "7", gap: "4", justifyContent: "center", alignItems: "center", wrap: "wrap" },
|
85
|
-
primaryAction && (
|
86
|
-
|
87
|
-
isLink(primaryAction) && (React.createElement(Button.ExternalLink, Object.assign({ kind: "primary" }, omit(primaryAction, 'text')), primaryAction.text)))),
|
88
|
-
secondaryAction && (React.createElement(React.Fragment, null,
|
89
|
-
!isLink(secondaryAction) && (React.createElement(Button.Secondary, Object.assign({}, omit(secondaryAction, 'text')), secondaryAction.text)),
|
90
|
-
isLink(secondaryAction) && (React.createElement(Button.ExternalLink, Object.assign({ kind: "secondary" }, omit(secondaryAction, 'text')), secondaryAction.text)))))),
|
83
|
+
primaryAction && renderAction('primary', primaryAction),
|
84
|
+
secondaryAction && renderAction('secondary', secondaryAction))),
|
91
85
|
footer && (React.createElement(Box, { marginTop: "5" },
|
92
86
|
React.createElement(Typography.Small, { color: "grey-60" }, footer)))))));
|
93
87
|
};
|
94
|
-
//# sourceMappingURL=data:application/json;base64,
|
88
|
+
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiRW1wdHlTdGF0ZS5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uL3NyYy9tb2xlY3VsZXMvRW1wdHlTdGF0ZS9FbXB0eVN0YXRlLnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQSxPQUFPLEtBQUssTUFBTSxPQUFPLENBQUM7QUFFMUIsT0FBTyxFQUFFLEdBQUcsRUFBRSxNQUFNLHVCQUF1QixDQUFDO0FBQzVDLE9BQU8sRUFBRSxVQUFVLEVBQUUsTUFBTSxxQ0FBcUMsQ0FBQztBQUVqRSxPQUFPLEVBQUUsWUFBWSxFQUFFLE1BQU0sbUJBQW1CLENBQUM7QUFDakQsT0FBTyxFQUFFLFVBQVUsRUFBRSxFQUFFLEVBQUUsTUFBTSxvQkFBb0IsQ0FBQztBQUdwRCxNQUFNLENBQU4sSUFBWSxnQkFtQlg7QUFuQkQsV0FBWSxnQkFBZ0I7SUFDMUIseUNBQXFCLENBQUE7SUFDckIsNkNBQXlCLENBQUE7SUFDekI7O09BRUc7SUFDSCxzREFBa0MsQ0FBQTtJQUNsQzs7T0FFRztJQUNILGtEQUE4QixDQUFBO0lBQzlCOztPQUVHO0lBQ0gsMERBQXNDLENBQUE7SUFDdEM7O09BRUc7SUFDSCxzREFBa0MsQ0FBQTtBQUNwQyxDQUFDLEVBbkJXLGdCQUFnQixLQUFoQixnQkFBZ0IsUUFtQjNCO0FBd0ZELE1BQU0sV0FBVyxHQUFHLENBQUMsTUFBd0IsRUFBb0IsRUFBRTtJQUNqRSxRQUFRLE1BQU0sRUFBRTtRQUNkLEtBQUssZ0JBQWdCLENBQUMsWUFBWTtZQUNoQyxPQUFPO2dCQUNMLE1BQU0sRUFBRSxRQUFRO2dCQUNoQixjQUFjLEVBQUUsWUFBWTtnQkFDNUIsVUFBVSxFQUFFLFlBQVk7YUFDekIsQ0FBQztRQUNKLEtBQUssZ0JBQWdCLENBQUMsY0FBYyxDQUFDO1FBQ3JDLEtBQUssZ0JBQWdCLENBQUMsVUFBVTtZQUM5QixPQUFPO2dCQUNMLE1BQU0sRUFBRSxLQUFLO2dCQUNiLGNBQWMsRUFBRSxZQUFZO2dCQUM1QixVQUFVLEVB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
|