@aivenio/aquarium 1.9.0 → 1.10.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 +5 -8
- package/dist/atoms.mjs +5 -8
- package/dist/src/common/DropdownMenu/DropdownMenu.js +3 -3
- package/dist/src/common/LineClamp/LineClamp.d.ts +3 -1
- package/dist/src/common/LineClamp/LineClamp.js +5 -3
- package/dist/src/common/Popover/Popover.js +2 -2
- package/dist/src/components/Button/Button.js +3 -3
- package/dist/src/components/Card/Card.js +2 -2
- package/dist/src/components/Combobox/Combobox.js +2 -2
- package/dist/src/components/LineClamp/LineClamp.d.ts +9 -1
- package/dist/src/components/LineClamp/LineClamp.js +8 -4
- package/dist/src/components/MultiSelect/MultiSelect.js +2 -2
- package/dist/src/components/Popover/PopoverWrapper.js +3 -5
- package/dist/src/components/Select/Select.js +2 -2
- package/dist/styles.css +3 -0
- package/dist/styles_timescaledb.css +3 -0
- package/dist/system.cjs +30 -23
- package/dist/system.mjs +31 -24
- package/dist/tsconfig.module.tsbuildinfo +1 -1
- package/dist/types/tailwindGenerated.d.ts +1 -1
- package/package.json +1 -1
package/dist/styles.css
CHANGED
package/dist/system.cjs
CHANGED
@@ -3199,8 +3199,8 @@ var asButton = (Component, isDropdownButton) => {
|
|
3199
3199
|
!isIconOnlyButton && COLOR_CLASSNAMES[kind],
|
3200
3200
|
tw("inline-block border-0 rounded-sm transition whitespace-nowrap focus:outline-none relative", {
|
3201
3201
|
"text-grey-70 p-2 active:text-grey-70 active:bg-transparent hover:text-grey-90 hover:bg-grey-0 focus-visible:text-grey-90 focus-visible:bg-grey-0 disabled:text-grey-20 disabled:bg-transparent": isIconOnlyButton,
|
3202
|
-
"typography-default": !dense && !isIconOnlyButton,
|
3203
|
-
"typography-small": dense && !isIconOnlyButton,
|
3202
|
+
"typography-default-strong": !dense && !isIconOnlyButton,
|
3203
|
+
"typography-small-strong": dense && !isIconOnlyButton,
|
3204
3204
|
"py-3 px-4": !dense && isButton,
|
3205
3205
|
"py-2 px-3": dense && isButton,
|
3206
3206
|
"py-3": !dense && isGhost,
|
@@ -4200,10 +4200,12 @@ Card.ColorHiglight = ColorHighlight;
|
|
4200
4200
|
var import_react29 = __toESM(require("react"));
|
4201
4201
|
var LineClamp = import_react29.default.forwardRef(
|
4202
4202
|
(_a, ref) => {
|
4203
|
-
var _b = _a, { lines = 1, clamped = true, children, className } = _b, props = __objRest(_b, ["lines", "clamped", "children", "className"]);
|
4203
|
+
var _b = _a, { lines = 1, clamped = true, children, className, wordBreak = "break-words" } = _b, props = __objRest(_b, ["lines", "clamped", "children", "className", "wordBreak"]);
|
4204
4204
|
return /* @__PURE__ */ import_react29.default.createElement("div", __spreadValues({
|
4205
4205
|
ref,
|
4206
|
-
className: classNames(className, "break-
|
4206
|
+
className: classNames(className, wordBreak === "break-words" ? "break-words" : "break-all", {
|
4207
|
+
[`line-clamp-${lines}`]: clamped
|
4208
|
+
})
|
4207
4209
|
}, props), children);
|
4208
4210
|
}
|
4209
4211
|
);
|
@@ -4347,7 +4349,8 @@ var Card2 = ({
|
|
4347
4349
|
imageAlt,
|
4348
4350
|
fullSize: chips.length === 0
|
4349
4351
|
})), /* @__PURE__ */ import_react31.default.createElement(Card.Content, null, clampTitle ? /* @__PURE__ */ import_react31.default.createElement(LineClamp, {
|
4350
|
-
lines: clampTitle
|
4352
|
+
lines: clampTitle,
|
4353
|
+
wordBreak: "break-all"
|
4351
4354
|
}, titleContent) : titleContent, /* @__PURE__ */ import_react31.default.createElement(Typography2.Caption, {
|
4352
4355
|
color: "grey-70"
|
4353
4356
|
}, children || description)), (action || link) && /* @__PURE__ */ import_react31.default.createElement(Card.Actions, null, action && /* @__PURE__ */ import_react31.default.createElement(SecondaryButton, __spreadValues({
|
@@ -5038,7 +5041,7 @@ var PopoverPanel = import_react44.default.forwardRef((_a, ref) => {
|
|
5038
5041
|
className: classNames(
|
5039
5042
|
className,
|
5040
5043
|
tw(
|
5041
|
-
"rounded-sm shadow-16dp bg-white mt-1 focus-visible:outline-0 focus-visible:border-info-70 border border-grey-20"
|
5044
|
+
"rounded-sm shadow-16dp bg-white mt-1 overflow-y-auto flex flex-col focus-visible:outline-0 focus-visible:border-info-70 border border-grey-20"
|
5042
5045
|
)
|
5043
5046
|
)
|
5044
5047
|
}, props), children);
|
@@ -5098,9 +5101,7 @@ var PopoverWrapper = import_react45.default.forwardRef((props, ref) => {
|
|
5098
5101
|
}, (0, import_utils3.mergeProps)(otherProps, modalProps, overlayProps)), {
|
5099
5102
|
id: id != null ? id : overlayProps.id,
|
5100
5103
|
className
|
5101
|
-
}), children
|
5102
|
-
onDismiss: props.onClose
|
5103
|
-
}))));
|
5104
|
+
}), children)));
|
5104
5105
|
});
|
5105
5106
|
|
5106
5107
|
// src/components/Combobox/Combobox.tsx
|
@@ -5234,8 +5235,7 @@ var ComboboxBase = (_a) => {
|
|
5234
5235
|
autoFocus: true
|
5235
5236
|
}, getMenuProps({ ref: overlayRef })), {
|
5236
5237
|
style,
|
5237
|
-
onClose: closeMenu
|
5238
|
-
className: tw("overflow-y-auto")
|
5238
|
+
onClose: closeMenu
|
5239
5239
|
}), /* @__PURE__ */ import_react46.default.createElement(Select.Menu, {
|
5240
5240
|
maxHeight
|
5241
5241
|
}, isOpen && hasNoResults && /* @__PURE__ */ import_react46.default.createElement(Select.NoResults, null, noResults), isOpen && inputItems.map((item, index) => /* @__PURE__ */ import_react46.default.createElement(Select.Item, __spreadValues({
|
@@ -6308,15 +6308,12 @@ var DropdownMenu2 = import_react65.default.forwardRef(
|
|
6308
6308
|
return /* @__PURE__ */ import_react65.default.createElement("div", __spreadValues({
|
6309
6309
|
ref,
|
6310
6310
|
style: { maxHeight, minWidth, maxWidth },
|
6311
|
-
className: classNames(
|
6312
|
-
className,
|
6313
|
-
"bg-white w-full overflow-y-auto overflow-x-hidden typography-small text-grey-70"
|
6314
|
-
)
|
6311
|
+
className: classNames(className, "bg-white w-full flex flex-col overflow-x-hidden typography-small text-grey-70")
|
6315
6312
|
}, props), children);
|
6316
6313
|
}
|
6317
6314
|
);
|
6318
6315
|
var ContentContainer = ({ children }) => /* @__PURE__ */ import_react65.default.createElement("div", {
|
6319
|
-
className: tw("p-3")
|
6316
|
+
className: tw("p-3 overflow-y-auto overflow-x-hidden")
|
6320
6317
|
}, children);
|
6321
6318
|
DropdownMenu2.ContentContainer = ContentContainer;
|
6322
6319
|
var List2 = import_react65.default.forwardRef(
|
@@ -6771,7 +6768,14 @@ var GridItem = Tailwindify(
|
|
6771
6768
|
|
6772
6769
|
// src/components/LineClamp/LineClamp.tsx
|
6773
6770
|
var import_react70 = __toESM(require("react"));
|
6774
|
-
var LineClamp2 = ({
|
6771
|
+
var LineClamp2 = ({
|
6772
|
+
lines,
|
6773
|
+
children,
|
6774
|
+
wordBreak,
|
6775
|
+
expandLabel,
|
6776
|
+
collapseLabel,
|
6777
|
+
onClampedChange
|
6778
|
+
}) => {
|
6775
6779
|
const ref = import_react70.default.useRef(null);
|
6776
6780
|
const [clamped, setClamped] = import_react70.default.useState(true);
|
6777
6781
|
const [isClampingEnabled, setClampingEnabled] = import_react70.default.useState(false);
|
@@ -6780,13 +6784,18 @@ var LineClamp2 = ({ lines, children, expandLabel, collapseLabel }) => {
|
|
6780
6784
|
const el = ref.current;
|
6781
6785
|
setClampingEnabled(((_a = el == null ? void 0 : el.scrollHeight) != null ? _a : 0) > ((_b = el == null ? void 0 : el.clientHeight) != null ? _b : 0));
|
6782
6786
|
}, [ref.current]);
|
6787
|
+
const handleClampedChange = () => {
|
6788
|
+
setClamped(!clamped);
|
6789
|
+
onClampedChange == null ? void 0 : onClampedChange(!clamped);
|
6790
|
+
};
|
6783
6791
|
return /* @__PURE__ */ import_react70.default.createElement("div", null, /* @__PURE__ */ import_react70.default.createElement(LineClamp, {
|
6784
6792
|
ref,
|
6785
6793
|
lines,
|
6786
|
-
clamped
|
6794
|
+
clamped,
|
6795
|
+
wordBreak
|
6787
6796
|
}, children), expandLabel && isClampingEnabled && /* @__PURE__ */ import_react70.default.createElement(GhostButton, {
|
6788
6797
|
dense: true,
|
6789
|
-
onClick:
|
6798
|
+
onClick: handleClampedChange
|
6790
6799
|
}, clamped ? expandLabel : collapseLabel));
|
6791
6800
|
};
|
6792
6801
|
|
@@ -7642,8 +7651,7 @@ var MultiSelectBase = (_a) => {
|
|
7642
7651
|
autoFocus: true
|
7643
7652
|
}, getMenuProps({ ref: overlayRef })), {
|
7644
7653
|
style,
|
7645
|
-
onClose: closeMenu
|
7646
|
-
className: tw("overflow-y-auto")
|
7654
|
+
onClose: closeMenu
|
7647
7655
|
}), /* @__PURE__ */ import_react79.default.createElement(Select.Menu, {
|
7648
7656
|
maxHeight
|
7649
7657
|
}, isOpen && hasNoResults && /* @__PURE__ */ import_react79.default.createElement(Select.NoResults, null, noResults), isOpen && filteredOptions.map((item, index) => /* @__PURE__ */ import_react79.default.createElement(Select.Item, __spreadValues({
|
@@ -8009,8 +8017,7 @@ var _SelectBase = (props) => {
|
|
8009
8017
|
autoFocus: true
|
8010
8018
|
}, getMenuProps({ ref: overlayRef })), {
|
8011
8019
|
style,
|
8012
|
-
onClose: closeMenu
|
8013
|
-
className: tw("overflow-y-auto")
|
8020
|
+
onClose: closeMenu
|
8014
8021
|
}), /* @__PURE__ */ import_react82.default.createElement(Select.Menu, {
|
8015
8022
|
maxHeight
|
8016
8023
|
}, isOpen && options.length === 0 && /* @__PURE__ */ import_react82.default.createElement(Select.EmptyStateContainer, null, emptyState), isOpen && options.length > 0 && !hasOptionGroups(options) && options.map(renderItem), isOpen && options.length > 0 && hasOptionGroups(options) && options.map(renderGroup), isOpen && actions.length > 0 && /* @__PURE__ */ import_react82.default.createElement(import_react82.default.Fragment, null, /* @__PURE__ */ import_react82.default.createElement(Select.Divider, {
|
package/dist/system.mjs
CHANGED
@@ -3063,8 +3063,8 @@ var asButton = (Component, isDropdownButton) => {
|
|
3063
3063
|
!isIconOnlyButton && COLOR_CLASSNAMES[kind],
|
3064
3064
|
tw("inline-block border-0 rounded-sm transition whitespace-nowrap focus:outline-none relative", {
|
3065
3065
|
"text-grey-70 p-2 active:text-grey-70 active:bg-transparent hover:text-grey-90 hover:bg-grey-0 focus-visible:text-grey-90 focus-visible:bg-grey-0 disabled:text-grey-20 disabled:bg-transparent": isIconOnlyButton,
|
3066
|
-
"typography-default": !dense && !isIconOnlyButton,
|
3067
|
-
"typography-small": dense && !isIconOnlyButton,
|
3066
|
+
"typography-default-strong": !dense && !isIconOnlyButton,
|
3067
|
+
"typography-small-strong": dense && !isIconOnlyButton,
|
3068
3068
|
"py-3 px-4": !dense && isButton,
|
3069
3069
|
"py-2 px-3": dense && isButton,
|
3070
3070
|
"py-3": !dense && isGhost,
|
@@ -4064,10 +4064,12 @@ Card.ColorHiglight = ColorHighlight;
|
|
4064
4064
|
import React24 from "react";
|
4065
4065
|
var LineClamp = React24.forwardRef(
|
4066
4066
|
(_a, ref) => {
|
4067
|
-
var _b = _a, { lines = 1, clamped = true, children, className } = _b, props = __objRest(_b, ["lines", "clamped", "children", "className"]);
|
4067
|
+
var _b = _a, { lines = 1, clamped = true, children, className, wordBreak = "break-words" } = _b, props = __objRest(_b, ["lines", "clamped", "children", "className", "wordBreak"]);
|
4068
4068
|
return /* @__PURE__ */ React24.createElement("div", __spreadValues({
|
4069
4069
|
ref,
|
4070
|
-
className: classNames(className, "break-
|
4070
|
+
className: classNames(className, wordBreak === "break-words" ? "break-words" : "break-all", {
|
4071
|
+
[`line-clamp-${lines}`]: clamped
|
4072
|
+
})
|
4071
4073
|
}, props), children);
|
4072
4074
|
}
|
4073
4075
|
);
|
@@ -4211,7 +4213,8 @@ var Card2 = ({
|
|
4211
4213
|
imageAlt,
|
4212
4214
|
fullSize: chips.length === 0
|
4213
4215
|
})), /* @__PURE__ */ React26.createElement(Card.Content, null, clampTitle ? /* @__PURE__ */ React26.createElement(LineClamp, {
|
4214
|
-
lines: clampTitle
|
4216
|
+
lines: clampTitle,
|
4217
|
+
wordBreak: "break-all"
|
4215
4218
|
}, titleContent) : titleContent, /* @__PURE__ */ React26.createElement(Typography2.Caption, {
|
4216
4219
|
color: "grey-70"
|
4217
4220
|
}, children || description)), (action || link) && /* @__PURE__ */ React26.createElement(Card.Actions, null, action && /* @__PURE__ */ React26.createElement(SecondaryButton, __spreadValues({
|
@@ -4890,7 +4893,7 @@ import { matchSorter } from "match-sorter";
|
|
4890
4893
|
// src/components/Popover/PopoverWrapper.tsx
|
4891
4894
|
import React40 from "react";
|
4892
4895
|
import { FocusScope } from "@react-aria/focus";
|
4893
|
-
import {
|
4896
|
+
import { OverlayContainer as OverlayContainer2, useModal, useOverlay } from "@react-aria/overlays";
|
4894
4897
|
import { mergeProps as mergeProps2 } from "@react-aria/utils";
|
4895
4898
|
|
4896
4899
|
// src/common/Popover/Popover.tsx
|
@@ -4902,7 +4905,7 @@ var PopoverPanel = React39.forwardRef((_a, ref) => {
|
|
4902
4905
|
className: classNames(
|
4903
4906
|
className,
|
4904
4907
|
tw(
|
4905
|
-
"rounded-sm shadow-16dp bg-white mt-1 focus-visible:outline-0 focus-visible:border-info-70 border border-grey-20"
|
4908
|
+
"rounded-sm shadow-16dp bg-white mt-1 overflow-y-auto flex flex-col focus-visible:outline-0 focus-visible:border-info-70 border border-grey-20"
|
4906
4909
|
)
|
4907
4910
|
)
|
4908
4911
|
}, props), children);
|
@@ -4962,9 +4965,7 @@ var PopoverWrapper = React40.forwardRef((props, ref) => {
|
|
4962
4965
|
}, mergeProps2(otherProps, modalProps, overlayProps)), {
|
4963
4966
|
id: id != null ? id : overlayProps.id,
|
4964
4967
|
className
|
4965
|
-
}), children
|
4966
|
-
onDismiss: props.onClose
|
4967
|
-
}))));
|
4968
|
+
}), children)));
|
4968
4969
|
});
|
4969
4970
|
|
4970
4971
|
// src/components/Combobox/Combobox.tsx
|
@@ -5098,8 +5099,7 @@ var ComboboxBase = (_a) => {
|
|
5098
5099
|
autoFocus: true
|
5099
5100
|
}, getMenuProps({ ref: overlayRef })), {
|
5100
5101
|
style,
|
5101
|
-
onClose: closeMenu
|
5102
|
-
className: tw("overflow-y-auto")
|
5102
|
+
onClose: closeMenu
|
5103
5103
|
}), /* @__PURE__ */ React41.createElement(Select.Menu, {
|
5104
5104
|
maxHeight
|
5105
5105
|
}, isOpen && hasNoResults && /* @__PURE__ */ React41.createElement(Select.NoResults, null, noResults), isOpen && inputItems.map((item, index) => /* @__PURE__ */ React41.createElement(Select.Item, __spreadValues({
|
@@ -6172,15 +6172,12 @@ var DropdownMenu2 = React59.forwardRef(
|
|
6172
6172
|
return /* @__PURE__ */ React59.createElement("div", __spreadValues({
|
6173
6173
|
ref,
|
6174
6174
|
style: { maxHeight, minWidth, maxWidth },
|
6175
|
-
className: classNames(
|
6176
|
-
className,
|
6177
|
-
"bg-white w-full overflow-y-auto overflow-x-hidden typography-small text-grey-70"
|
6178
|
-
)
|
6175
|
+
className: classNames(className, "bg-white w-full flex flex-col overflow-x-hidden typography-small text-grey-70")
|
6179
6176
|
}, props), children);
|
6180
6177
|
}
|
6181
6178
|
);
|
6182
6179
|
var ContentContainer = ({ children }) => /* @__PURE__ */ React59.createElement("div", {
|
6183
|
-
className: tw("p-3")
|
6180
|
+
className: tw("p-3 overflow-y-auto overflow-x-hidden")
|
6184
6181
|
}, children);
|
6185
6182
|
DropdownMenu2.ContentContainer = ContentContainer;
|
6186
6183
|
var List2 = React59.forwardRef(
|
@@ -6635,7 +6632,14 @@ var GridItem = Tailwindify(
|
|
6635
6632
|
|
6636
6633
|
// src/components/LineClamp/LineClamp.tsx
|
6637
6634
|
import React64 from "react";
|
6638
|
-
var LineClamp2 = ({
|
6635
|
+
var LineClamp2 = ({
|
6636
|
+
lines,
|
6637
|
+
children,
|
6638
|
+
wordBreak,
|
6639
|
+
expandLabel,
|
6640
|
+
collapseLabel,
|
6641
|
+
onClampedChange
|
6642
|
+
}) => {
|
6639
6643
|
const ref = React64.useRef(null);
|
6640
6644
|
const [clamped, setClamped] = React64.useState(true);
|
6641
6645
|
const [isClampingEnabled, setClampingEnabled] = React64.useState(false);
|
@@ -6644,13 +6648,18 @@ var LineClamp2 = ({ lines, children, expandLabel, collapseLabel }) => {
|
|
6644
6648
|
const el = ref.current;
|
6645
6649
|
setClampingEnabled(((_a = el == null ? void 0 : el.scrollHeight) != null ? _a : 0) > ((_b = el == null ? void 0 : el.clientHeight) != null ? _b : 0));
|
6646
6650
|
}, [ref.current]);
|
6651
|
+
const handleClampedChange = () => {
|
6652
|
+
setClamped(!clamped);
|
6653
|
+
onClampedChange == null ? void 0 : onClampedChange(!clamped);
|
6654
|
+
};
|
6647
6655
|
return /* @__PURE__ */ React64.createElement("div", null, /* @__PURE__ */ React64.createElement(LineClamp, {
|
6648
6656
|
ref,
|
6649
6657
|
lines,
|
6650
|
-
clamped
|
6658
|
+
clamped,
|
6659
|
+
wordBreak
|
6651
6660
|
}, children), expandLabel && isClampingEnabled && /* @__PURE__ */ React64.createElement(GhostButton, {
|
6652
6661
|
dense: true,
|
6653
|
-
onClick:
|
6662
|
+
onClick: handleClampedChange
|
6654
6663
|
}, clamped ? expandLabel : collapseLabel));
|
6655
6664
|
};
|
6656
6665
|
|
@@ -7506,8 +7515,7 @@ var MultiSelectBase = (_a) => {
|
|
7506
7515
|
autoFocus: true
|
7507
7516
|
}, getMenuProps({ ref: overlayRef })), {
|
7508
7517
|
style,
|
7509
|
-
onClose: closeMenu
|
7510
|
-
className: tw("overflow-y-auto")
|
7518
|
+
onClose: closeMenu
|
7511
7519
|
}), /* @__PURE__ */ React73.createElement(Select.Menu, {
|
7512
7520
|
maxHeight
|
7513
7521
|
}, isOpen && hasNoResults && /* @__PURE__ */ React73.createElement(Select.NoResults, null, noResults), isOpen && filteredOptions.map((item, index) => /* @__PURE__ */ React73.createElement(Select.Item, __spreadValues({
|
@@ -7873,8 +7881,7 @@ var _SelectBase = (props) => {
|
|
7873
7881
|
autoFocus: true
|
7874
7882
|
}, getMenuProps({ ref: overlayRef })), {
|
7875
7883
|
style,
|
7876
|
-
onClose: closeMenu
|
7877
|
-
className: tw("overflow-y-auto")
|
7884
|
+
onClose: closeMenu
|
7878
7885
|
}), /* @__PURE__ */ React76.createElement(Select.Menu, {
|
7879
7886
|
maxHeight
|
7880
7887
|
}, isOpen && options.length === 0 && /* @__PURE__ */ React76.createElement(Select.EmptyStateContainer, null, emptyState), isOpen && options.length > 0 && !hasOptionGroups(options) && options.map(renderItem), isOpen && options.length > 0 && hasOptionGroups(options) && options.map(renderGroup), isOpen && actions.length > 0 && /* @__PURE__ */ React76.createElement(React76.Fragment, null, /* @__PURE__ */ React76.createElement(Select.Divider, {
|