@aivenio/aquarium 1.6.0 → 1.8.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 +109 -94
- package/dist/atoms.mjs +108 -94
- package/dist/src/common/Link/Link.d.ts +3 -0
- package/dist/src/common/Link/Link.js +19 -0
- package/dist/src/common/Popover/Popover.js +2 -2
- package/dist/src/common/index.d.ts +1 -0
- package/dist/src/common/index.js +2 -1
- package/dist/src/components/Avatar/Avatar.js +2 -1
- package/dist/src/components/Badge/Badge.js +2 -1
- package/dist/src/components/Button/Button.js +3 -2
- package/dist/src/components/Checkbox/Checkbox.js +3 -1
- package/dist/src/components/CheckboxGroup/CheckboxGroup.js +2 -1
- package/dist/src/components/Chip/Chip.js +2 -1
- package/dist/src/components/Combobox/Combobox.d.ts +1 -1
- package/dist/src/components/Combobox/Combobox.js +6 -4
- package/dist/src/components/DropdownMenu/DropdownMenu.d.ts +4 -0
- package/dist/src/components/DropdownMenu/DropdownMenu.js +6 -2
- package/dist/src/components/LineClamp/LineClamp.d.ts +22 -0
- package/dist/src/components/LineClamp/LineClamp.js +17 -0
- package/dist/src/components/Link/Link.d.ts +5 -0
- package/dist/src/components/Link/Link.js +4 -0
- package/dist/src/components/MultiInput/MultiInput.d.ts +2 -1
- package/dist/src/components/MultiInput/MultiInput.js +3 -2
- package/dist/src/components/NativeSelect/NativeSelect.js +3 -1
- package/dist/src/components/ProgressBar/ProgressBar.js +4 -2
- package/dist/src/components/RadioButton/RadioButton.js +3 -1
- package/dist/src/components/RadioButtonGroup/RadioButtonGroup.js +2 -1
- package/dist/src/components/Select/Select.js +2 -1
- package/dist/src/components/Stepper/Stepper.js +2 -1
- package/dist/src/components/Switch/Switch.js +3 -1
- package/dist/src/components/SwitchGroup/SwitchGroup.js +2 -1
- package/dist/src/components/Textarea/Textarea.js +3 -1
- package/dist/src/components/Timeline/Timeline.js +2 -1
- package/dist/src/components/index.d.ts +2 -0
- package/dist/src/components/index.js +3 -1
- package/dist/src/utils/constants.d.ts +2 -0
- package/dist/src/utils/constants.js +4 -2
- package/dist/src/utils/form/HelperText/HelperText.js +2 -1
- package/dist/styles.css +58 -16
- package/dist/styles_timescaledb.css +58 -16
- package/dist/system.cjs +397 -323
- package/dist/system.mjs +363 -291
- package/dist/tailwind.config.js +12 -2
- package/dist/tsconfig.module.tsbuildinfo +1 -1
- package/dist/types/tailwindGenerated.d.ts +1 -1
- package/dist/types/utils.d.ts +3 -0
- package/package.json +2 -1
package/dist/system.mjs
CHANGED
@@ -1586,6 +1586,8 @@ __export(components_exports, {
|
|
1586
1586
|
InlineIcon: () => InlineIcon,
|
1587
1587
|
Input: () => Input2,
|
1588
1588
|
InputBase: () => InputBase,
|
1589
|
+
LineClamp: () => LineClamp,
|
1590
|
+
Link: () => Link2,
|
1589
1591
|
List: () => List,
|
1590
1592
|
ListItem: () => ListItem,
|
1591
1593
|
Modal: () => Modal2,
|
@@ -2934,6 +2936,21 @@ var Arrow = (props) => {
|
|
2934
2936
|
}, props));
|
2935
2937
|
};
|
2936
2938
|
|
2939
|
+
// src/utils/constants.ts
|
2940
|
+
var getCommonInputStyles = ({ readOnly, valid }) => tw(
|
2941
|
+
"block w-full rounded-sm disabled:cursor-not-allowed disabled:border-grey-20 disabled:bg-grey-5 typography-small text-grey-70 disabled:text-grey-40 placeholder:text-grey-40 focus:outline-none",
|
2942
|
+
{
|
2943
|
+
"px-3 py-3": !readOnly,
|
2944
|
+
"border-none resize-none cursor-default": readOnly,
|
2945
|
+
"border border-error-50": !valid && !readOnly,
|
2946
|
+
"border border-grey-20 hover:border-grey-50 focus:border-info-70": valid && !readOnly
|
2947
|
+
}
|
2948
|
+
);
|
2949
|
+
var ghostButtonStyle = tw(
|
2950
|
+
"text-primary-80 active:text-primary-70 focus-visible:text-grey-90 hover:text-primary-70 disabled:text-primary-40"
|
2951
|
+
);
|
2952
|
+
var linkStyle = classNames(ghostButtonStyle, tw("visited:text-primary-80"));
|
2953
|
+
|
2937
2954
|
// src/components/Button/Button.tsx
|
2938
2955
|
var import_chevronDown2 = __toESM(require_chevronDown());
|
2939
2956
|
var import_loading = __toESM(require_loading());
|
@@ -2946,9 +2963,7 @@ var COLOR_CLASSNAMES = {
|
|
2946
2963
|
"focus-visible:ring-2 focus-visible:ring-grey-50 focus-visible:text-grey-80",
|
2947
2964
|
"hover:ring-grey-50 hover:text-grey-80 disabled:text-grey-30 disabled:bg-grey-0 disabled:ring-grey-20"
|
2948
2965
|
),
|
2949
|
-
"ghost":
|
2950
|
-
"text-primary-80 active:text-primary-70 focus-visible:text-grey-90 hover:text-primary-70 disabled:text-primary-40"
|
2951
|
-
),
|
2966
|
+
"ghost": ghostButtonStyle,
|
2952
2967
|
"secondary-ghost": tw(
|
2953
2968
|
"text-grey-60 active:text-grey-50 focus-visible:text-grey-80 hover:text-grey-80 disabled:text-grey-30"
|
2954
2969
|
)
|
@@ -3499,6 +3514,7 @@ var AvatarSkeleton = () => /* @__PURE__ */ React15.createElement(Skeleton, {
|
|
3499
3514
|
className: tw("rounded-full")
|
3500
3515
|
});
|
3501
3516
|
Avatar.Skeleton = AvatarSkeleton;
|
3517
|
+
Avatar.Skeleton.displayName = "Avatar.Skeleton";
|
3502
3518
|
|
3503
3519
|
// src/components/Badge/Badge.tsx
|
3504
3520
|
import React16 from "react";
|
@@ -3539,6 +3555,7 @@ var createBadge = (type, displayName) => {
|
|
3539
3555
|
display: "inline-block",
|
3540
3556
|
className: tw(type === "tab" ? "rounded" : "rounded-full")
|
3541
3557
|
});
|
3558
|
+
Component.Skeleton.displayName = `${displayName}.Skeleton`;
|
3542
3559
|
return Component;
|
3543
3560
|
};
|
3544
3561
|
var Badge = createBadge("default", "Badge");
|
@@ -3833,6 +3850,7 @@ var ChipSkeleton = ({ dense = false, width = dense ? 34 : 56 }) => /* @__PURE__
|
|
3833
3850
|
height: dense ? 20 : 28
|
3834
3851
|
});
|
3835
3852
|
Chip2.Skeleton = ChipSkeleton;
|
3853
|
+
Chip2.Skeleton.displayName = "Chip.Skeleton";
|
3836
3854
|
var StatusChip = React21.forwardRef(
|
3837
3855
|
(_a, ref) => {
|
3838
3856
|
var _b = _a, { UNSAFE_icon: icon, text, dense = false, status } = _b, rest = __objRest(_b, ["UNSAFE_icon", "text", "dense", "status"]);
|
@@ -4428,6 +4446,7 @@ var Checkbox2 = React29.forwardRef(
|
|
4428
4446
|
}))) : null;
|
4429
4447
|
}
|
4430
4448
|
);
|
4449
|
+
Checkbox2.displayName = "Checkbox";
|
4431
4450
|
var CheckboxSkeleton = () => /* @__PURE__ */ React29.createElement("div", {
|
4432
4451
|
className: tw("flex gap-3")
|
4433
4452
|
}, /* @__PURE__ */ React29.createElement(Skeleton, {
|
@@ -4438,6 +4457,7 @@ var CheckboxSkeleton = () => /* @__PURE__ */ React29.createElement("div", {
|
|
4438
4457
|
width: 150
|
4439
4458
|
}));
|
4440
4459
|
Checkbox2.Skeleton = CheckboxSkeleton;
|
4460
|
+
Checkbox2.Skeleton.displayName = "Checkbox.Skeleton";
|
4441
4461
|
|
4442
4462
|
// src/components/CheckboxGroup/CheckboxGroup.tsx
|
4443
4463
|
import React36, { useState as useState3 } from "react";
|
@@ -4599,6 +4619,7 @@ var Skeleton2 = ({ className, children }) => /* @__PURE__ */ React34.createEleme
|
|
4599
4619
|
className: classNames3(className, "h-[25px]")
|
4600
4620
|
}, children);
|
4601
4621
|
HelperText.Skeleton = Skeleton2;
|
4622
|
+
HelperText.Skeleton.displayName = "HelperText.Skeleton";
|
4602
4623
|
|
4603
4624
|
// src/utils/form/Label/Label.tsx
|
4604
4625
|
var import_questionMark = __toESM(require_questionMark());
|
@@ -4784,6 +4805,7 @@ var CheckboxGroupSkeleton = ({ options = 2 }) => {
|
|
4784
4805
|
}))));
|
4785
4806
|
};
|
4786
4807
|
CheckboxGroup.Skeleton = CheckboxGroupSkeleton;
|
4808
|
+
CheckboxGroup.Skeleton.displayName = "CheckboxGroup.Skeleton";
|
4787
4809
|
|
4788
4810
|
// src/components/ChoiceChip/ChoiceChip.tsx
|
4789
4811
|
import React37, { useState as useState4 } from "react";
|
@@ -4837,7 +4859,7 @@ var PopoverPanel = React38.forwardRef((_a, ref) => {
|
|
4837
4859
|
className: classNames(
|
4838
4860
|
className,
|
4839
4861
|
tw(
|
4840
|
-
"rounded-sm shadow-16dp bg-white mt-1 focus-visible:outline-0 focus-visible:border-info-70 border border-grey-20
|
4862
|
+
"rounded-sm shadow-16dp bg-white mt-1 focus-visible:outline-0 focus-visible:border-info-70 border border-grey-20"
|
4841
4863
|
)
|
4842
4864
|
)
|
4843
4865
|
}, props), children);
|
@@ -5043,10 +5065,10 @@ var ComboboxBase = (_a) => {
|
|
5043
5065
|
highlighted: index === highlightedIndex
|
5044
5066
|
}, getItemProps({ item, index, disabled: isOptionDisabled(item, index) })), renderOption(item))))));
|
5045
5067
|
};
|
5046
|
-
var
|
5068
|
+
var ComboboxBaseSkeleton = () => /* @__PURE__ */ React40.createElement(Skeleton, {
|
5047
5069
|
height: 38
|
5048
5070
|
});
|
5049
|
-
ComboboxBase.Skeleton =
|
5071
|
+
ComboboxBase.Skeleton = ComboboxBaseSkeleton;
|
5050
5072
|
var Combobox = (_a) => {
|
5051
5073
|
var _b = _a, {
|
5052
5074
|
options,
|
@@ -5073,7 +5095,9 @@ var Combobox = (_a) => {
|
|
5073
5095
|
valid: props.valid
|
5074
5096
|
})));
|
5075
5097
|
};
|
5076
|
-
|
5098
|
+
var ComboboxSkeleton = () => /* @__PURE__ */ React40.createElement(LabelControl.Skeleton, null, /* @__PURE__ */ React40.createElement(ComboboxBase.Skeleton, null));
|
5099
|
+
Combobox.Skeleton = ComboboxSkeleton;
|
5100
|
+
Combobox.Skeleton.displayName = "Combobox.Skeleton";
|
5077
5101
|
|
5078
5102
|
// src/components/Container/Container.tsx
|
5079
5103
|
import React41 from "react";
|
@@ -5959,17 +5983,6 @@ import omit8 from "lodash/omit";
|
|
5959
5983
|
import toString from "lodash/toString";
|
5960
5984
|
import uniqueId3 from "lodash/uniqueId";
|
5961
5985
|
|
5962
|
-
// src/utils/constants.ts
|
5963
|
-
var getCommonInputStyles = ({ readOnly, valid }) => tw(
|
5964
|
-
"block w-full rounded-sm disabled:cursor-not-allowed disabled:border-grey-20 disabled:bg-grey-5 typography-small text-grey-70 disabled:text-grey-40 placeholder:text-grey-40 focus:outline-none",
|
5965
|
-
{
|
5966
|
-
"px-3 py-3": !readOnly,
|
5967
|
-
"border-none resize-none cursor-default": readOnly,
|
5968
|
-
"border border-error-50": !valid && !readOnly,
|
5969
|
-
"border border-grey-20 hover:border-grey-50 focus:border-info-70": valid && !readOnly
|
5970
|
-
}
|
5971
|
-
);
|
5972
|
-
|
5973
5986
|
// src/utils/form/InputAdornment/InputAdornment.tsx
|
5974
5987
|
import React56 from "react";
|
5975
5988
|
var import_cross4 = __toESM(require_cross());
|
@@ -6274,9 +6287,13 @@ var DropdownMenu3 = (_a) => {
|
|
6274
6287
|
var MenuTrigger = () => null;
|
6275
6288
|
var MenuItems = () => null;
|
6276
6289
|
DropdownMenu3.Trigger = MenuTrigger;
|
6290
|
+
DropdownMenu3.Trigger.displayName = "DropdownMenu.Trigger";
|
6277
6291
|
DropdownMenu3.Items = MenuItems;
|
6292
|
+
DropdownMenu3.Items.displayName = "DropdownMenu.Items";
|
6278
6293
|
DropdownMenu3.Item = Item4;
|
6294
|
+
DropdownMenu3.Item.displayName = "DropdownMenu.Item";
|
6279
6295
|
DropdownMenu3.Section = Section;
|
6296
|
+
DropdownMenu3.Section.displayName = "DropdownMenu.Section";
|
6280
6297
|
var TriggerWrapper = (_a) => {
|
6281
6298
|
var _b = _a, { children } = _b, props = __objRest(_b, ["children"]);
|
6282
6299
|
const ref = React59.useRef(null);
|
@@ -6349,7 +6366,7 @@ var MenuWrapper = (_a) => {
|
|
6349
6366
|
var ItemWrapper = ({ item, state }) => {
|
6350
6367
|
const ref = React59.useRef(null);
|
6351
6368
|
const { menuItemProps, descriptionProps, isSelected, isFocused, isDisabled } = useMenuItem(
|
6352
|
-
{ key: item.key },
|
6369
|
+
{ key: item.key, closeOnSelect: item.props.closeOnSelect },
|
6353
6370
|
state,
|
6354
6371
|
ref
|
6355
6372
|
);
|
@@ -6571,24 +6588,59 @@ var GridItem = Tailwindify(
|
|
6571
6588
|
}
|
6572
6589
|
);
|
6573
6590
|
|
6574
|
-
// src/components/
|
6591
|
+
// src/components/LineClamp/LineClamp.tsx
|
6575
6592
|
import React63 from "react";
|
6576
|
-
var
|
6593
|
+
var LineClamp = ({ lines, children, expandLabel, collapseLabel }) => {
|
6594
|
+
const ref = React63.useRef(null);
|
6595
|
+
const [clamped, setClamped] = React63.useState(true);
|
6596
|
+
const [isClampingEnabled, setClampingEnabled] = React63.useState(false);
|
6597
|
+
React63.useEffect(() => {
|
6598
|
+
var _a, _b;
|
6599
|
+
const el = ref.current;
|
6600
|
+
setClampingEnabled(((_a = el == null ? void 0 : el.scrollHeight) != null ? _a : 0) > ((_b = el == null ? void 0 : el.clientHeight) != null ? _b : 0));
|
6601
|
+
}, [ref.current]);
|
6602
|
+
return /* @__PURE__ */ React63.createElement("div", null, /* @__PURE__ */ React63.createElement("div", {
|
6603
|
+
ref,
|
6604
|
+
className: classNames({ [`line-clamp-${lines}`]: clamped })
|
6605
|
+
}, children), expandLabel && isClampingEnabled && /* @__PURE__ */ React63.createElement(GhostButton, {
|
6606
|
+
dense: true,
|
6607
|
+
onClick: () => setClamped(!clamped)
|
6608
|
+
}, clamped ? expandLabel : collapseLabel));
|
6609
|
+
};
|
6610
|
+
|
6611
|
+
// src/components/Link/Link.tsx
|
6612
|
+
import React65 from "react";
|
6613
|
+
|
6614
|
+
// src/common/Link/Link.tsx
|
6615
|
+
import React64 from "react";
|
6616
|
+
var Link = (_a) => {
|
6617
|
+
var _b = _a, { children, className } = _b, props = __objRest(_b, ["children", "className"]);
|
6618
|
+
return /* @__PURE__ */ React64.createElement("a", __spreadValues({
|
6619
|
+
className: classNames(className, linkStyle)
|
6620
|
+
}, props), children);
|
6621
|
+
};
|
6622
|
+
|
6623
|
+
// src/components/Link/Link.tsx
|
6624
|
+
var Link2 = (props) => /* @__PURE__ */ React65.createElement(Link, __spreadValues({}, props));
|
6625
|
+
|
6626
|
+
// src/components/List/List.tsx
|
6627
|
+
import React66 from "react";
|
6628
|
+
var List = ({ items, renderItem, container = React66.Fragment }) => {
|
6577
6629
|
const Component = container;
|
6578
|
-
return /* @__PURE__ */
|
6630
|
+
return /* @__PURE__ */ React66.createElement(Component, null, items.map(renderItem));
|
6579
6631
|
};
|
6580
6632
|
|
6581
6633
|
// src/components/ListItem/ListItem.tsx
|
6582
|
-
import
|
6634
|
+
import React67 from "react";
|
6583
6635
|
var ListItem = ({ name, icon, active = false }) => {
|
6584
|
-
return /* @__PURE__ */
|
6636
|
+
return /* @__PURE__ */ React67.createElement(Flexbox, {
|
6585
6637
|
alignItems: "center"
|
6586
|
-
}, /* @__PURE__ */
|
6638
|
+
}, /* @__PURE__ */ React67.createElement(Typography2, {
|
6587
6639
|
variant: active ? "small-strong" : "small",
|
6588
6640
|
color: "grey-70",
|
6589
6641
|
htmlTag: "span",
|
6590
6642
|
className: `px-4 py-2 rounded-full ${active ? "bg-grey-5" : "hover:bg-grey-0"}`
|
6591
|
-
}, /* @__PURE__ */
|
6643
|
+
}, /* @__PURE__ */ React67.createElement("img", {
|
6592
6644
|
src: icon,
|
6593
6645
|
alt: name,
|
6594
6646
|
className: "inline mr-4",
|
@@ -6598,7 +6650,7 @@ var ListItem = ({ name, icon, active = false }) => {
|
|
6598
6650
|
};
|
6599
6651
|
|
6600
6652
|
// src/components/Modal/Modal.tsx
|
6601
|
-
import
|
6653
|
+
import React69 from "react";
|
6602
6654
|
import { useDialog as useDialog2 } from "@react-aria/dialog";
|
6603
6655
|
import { FocusScope as FocusScope3 } from "@react-aria/focus";
|
6604
6656
|
import { Overlay as Overlay2, useModalOverlay as useModalOverlay2 } from "@react-aria/overlays";
|
@@ -6608,18 +6660,18 @@ import castArray from "lodash/castArray";
|
|
6608
6660
|
import omit10 from "lodash/omit";
|
6609
6661
|
|
6610
6662
|
// src/components/Tabs/Tabs.tsx
|
6611
|
-
import
|
6663
|
+
import React68, { useEffect as useEffect5, useLayoutEffect as useLayoutEffect2, useRef as useRef6, useState as useState7 } from "react";
|
6612
6664
|
import isNumber4 from "lodash/isNumber";
|
6613
6665
|
import kebabCase from "lodash/kebabCase";
|
6614
6666
|
var import_chevronLeft2 = __toESM(require_chevronLeft());
|
6615
6667
|
var import_chevronRight2 = __toESM(require_chevronRight());
|
6616
6668
|
var import_warningSign3 = __toESM(require_warningSign());
|
6617
6669
|
var isTabComponent = (c) => {
|
6618
|
-
return
|
6670
|
+
return React68.isValidElement(c) && (c.type === Tab || c.type === ModalTab);
|
6619
6671
|
};
|
6620
|
-
var Tab =
|
6672
|
+
var Tab = React68.forwardRef(
|
6621
6673
|
({ className, id, title, children }, ref) => {
|
6622
|
-
return /* @__PURE__ */
|
6674
|
+
return /* @__PURE__ */ React68.createElement("div", {
|
6623
6675
|
ref,
|
6624
6676
|
id: `${id != null ? id : kebabCase(title)}-panel`,
|
6625
6677
|
className,
|
@@ -6631,14 +6683,14 @@ var Tab = React65.forwardRef(
|
|
6631
6683
|
);
|
6632
6684
|
var TabContainer = (_a) => {
|
6633
6685
|
var _b = _a, { className, children } = _b, rest = __objRest(_b, ["className", "children"]);
|
6634
|
-
return /* @__PURE__ */
|
6686
|
+
return /* @__PURE__ */ React68.createElement("div", __spreadProps(__spreadValues({}, rest), {
|
6635
6687
|
className: classNames("py-6 z-0", className)
|
6636
6688
|
}), children);
|
6637
6689
|
};
|
6638
6690
|
var ModalTab = Tab;
|
6639
6691
|
var ModalTabContainer = TabContainer;
|
6640
6692
|
var asTabItem = (Component, displayName, { defaultUnderlineHidden } = {}) => {
|
6641
|
-
const Tab2 =
|
6693
|
+
const Tab2 = React68.forwardRef(
|
6642
6694
|
(_a, ref) => {
|
6643
6695
|
var _b = _a, {
|
6644
6696
|
id,
|
@@ -6668,17 +6720,17 @@ var asTabItem = (Component, displayName, { defaultUnderlineHidden } = {}) => {
|
|
6668
6720
|
const _id = id != null ? id : kebabCase(title);
|
6669
6721
|
let statusIcon = void 0;
|
6670
6722
|
if (status === "warning") {
|
6671
|
-
statusIcon = /* @__PURE__ */
|
6723
|
+
statusIcon = /* @__PURE__ */ React68.createElement(InlineIcon, {
|
6672
6724
|
icon: import_warningSign3.default,
|
6673
6725
|
color: "warning-80"
|
6674
6726
|
});
|
6675
6727
|
} else if (status === "error") {
|
6676
|
-
statusIcon = /* @__PURE__ */
|
6728
|
+
statusIcon = /* @__PURE__ */ React68.createElement(InlineIcon, {
|
6677
6729
|
icon: import_warningSign3.default,
|
6678
6730
|
color: "error-50"
|
6679
6731
|
});
|
6680
6732
|
}
|
6681
|
-
const tab = /* @__PURE__ */
|
6733
|
+
const tab = /* @__PURE__ */ React68.createElement(Component, __spreadValues({
|
6682
6734
|
ref,
|
6683
6735
|
id: `${_id}-tab`,
|
6684
6736
|
onClick: () => !disabled && onSelected(value != null ? value : index),
|
@@ -6695,24 +6747,24 @@ var asTabItem = (Component, displayName, { defaultUnderlineHidden } = {}) => {
|
|
6695
6747
|
"aria-selected": selected,
|
6696
6748
|
"aria-controls": `${_id}-panel`,
|
6697
6749
|
tabIndex: disabled ? void 0 : 0
|
6698
|
-
}, rest), /* @__PURE__ */
|
6750
|
+
}, rest), /* @__PURE__ */ React68.createElement(Typography2, {
|
6699
6751
|
htmlTag: "div",
|
6700
6752
|
variant: "small",
|
6701
6753
|
color: selected ? "primary-80" : disabled ? "grey-20" : "current",
|
6702
6754
|
className: tw("inline-flex items-center gap-3")
|
6703
|
-
}, /* @__PURE__ */
|
6755
|
+
}, /* @__PURE__ */ React68.createElement("span", {
|
6704
6756
|
className: tw("whitespace-nowrap")
|
6705
|
-
}, title), isNumber4(badge) && /* @__PURE__ */
|
6757
|
+
}, title), isNumber4(badge) && /* @__PURE__ */ React68.createElement(Typography2, {
|
6706
6758
|
htmlTag: "span",
|
6707
6759
|
variant: "small",
|
6708
6760
|
color: selected ? "primary-80" : "grey-5",
|
6709
6761
|
className: "leading-none"
|
6710
|
-
}, /* @__PURE__ */
|
6762
|
+
}, /* @__PURE__ */ React68.createElement(TabBadge, {
|
6711
6763
|
kind: "filled",
|
6712
6764
|
value: badge,
|
6713
6765
|
textClassname: classNames({ "text-white": selected, "text-grey-50": !selected })
|
6714
6766
|
})), statusIcon));
|
6715
|
-
return tooltip ? /* @__PURE__ */
|
6767
|
+
return tooltip ? /* @__PURE__ */ React68.createElement(Tooltip, {
|
6716
6768
|
content: tooltip
|
6717
6769
|
}, tab) : tab;
|
6718
6770
|
}
|
@@ -6726,7 +6778,7 @@ var createTabsComponent = (TabComponent, TabItemComponent, displayName, renderCh
|
|
6726
6778
|
const Tabs2 = (props) => {
|
6727
6779
|
var _a, _b;
|
6728
6780
|
const { className, value, defaultValue, onChange, children } = props;
|
6729
|
-
const childArr =
|
6781
|
+
const childArr = React68.Children.toArray(children);
|
6730
6782
|
const firstTab = childArr[0];
|
6731
6783
|
const firstTabValue = isTabComponent(firstTab) ? firstTab.props.value : -1;
|
6732
6784
|
const [selected, setSelected] = useState7((_b = (_a = value != null ? value : defaultValue) != null ? _a : firstTabValue) != null ? _b : 0);
|
@@ -6739,7 +6791,7 @@ var createTabsComponent = (TabComponent, TabItemComponent, displayName, renderCh
|
|
6739
6791
|
var _a2, _b2;
|
6740
6792
|
const container = containerRef.current;
|
6741
6793
|
const tabs = tabsRef.current;
|
6742
|
-
const values =
|
6794
|
+
const values = React68.Children.map(
|
6743
6795
|
children,
|
6744
6796
|
(tab, i) => {
|
6745
6797
|
var _a3;
|
@@ -6780,7 +6832,7 @@ var createTabsComponent = (TabComponent, TabItemComponent, displayName, renderCh
|
|
6780
6832
|
updateCarets();
|
6781
6833
|
setSelected(value);
|
6782
6834
|
revealSelectedTab({ smooth: value !== selected });
|
6783
|
-
}, [value,
|
6835
|
+
}, [value, React68.Children.count(children)]);
|
6784
6836
|
useLayoutEffect2(() => {
|
6785
6837
|
var _a2;
|
6786
6838
|
updateCarets();
|
@@ -6844,27 +6896,27 @@ var createTabsComponent = (TabComponent, TabItemComponent, displayName, renderCh
|
|
6844
6896
|
const handleSelected = (key) => {
|
6845
6897
|
(onChange != null ? onChange : setSelected)(key);
|
6846
6898
|
};
|
6847
|
-
|
6899
|
+
React68.Children.forEach(children, (c) => {
|
6848
6900
|
if (c && !isTabComponent(c)) {
|
6849
6901
|
throw new Error("<Tabs> can only have <Tabs.Tab> components as children");
|
6850
6902
|
}
|
6851
6903
|
});
|
6852
|
-
return /* @__PURE__ */
|
6904
|
+
return /* @__PURE__ */ React68.createElement("div", {
|
6853
6905
|
ref: parentRef,
|
6854
6906
|
className: classNames(tw("h-full"), className)
|
6855
|
-
}, /* @__PURE__ */
|
6907
|
+
}, /* @__PURE__ */ React68.createElement("div", {
|
6856
6908
|
className: tw("relative flex items-center h-full border-b-2 border-grey-10")
|
6857
|
-
}, /* @__PURE__ */
|
6909
|
+
}, /* @__PURE__ */ React68.createElement("div", {
|
6858
6910
|
ref: containerRef,
|
6859
6911
|
className: tw("overflow-y-auto scrollbar-hide h-full mb-[-2px]")
|
6860
|
-
}, /* @__PURE__ */
|
6912
|
+
}, /* @__PURE__ */ React68.createElement("div", {
|
6861
6913
|
ref: tabsRef,
|
6862
6914
|
role: "tablist",
|
6863
6915
|
"aria-label": "tabs",
|
6864
6916
|
className: tw("inline-flex items-center cursor-pointer font-normal h-full")
|
6865
|
-
},
|
6917
|
+
}, React68.Children.map(
|
6866
6918
|
children,
|
6867
|
-
(tab, index) => tab ? /* @__PURE__ */
|
6919
|
+
(tab, index) => tab ? /* @__PURE__ */ React68.createElement(TabItemComponent, __spreadProps(__spreadValues({
|
6868
6920
|
key: tab.props.value
|
6869
6921
|
}, tab.props), {
|
6870
6922
|
index,
|
@@ -6872,20 +6924,20 @@ var createTabsComponent = (TabComponent, TabItemComponent, displayName, renderCh
|
|
6872
6924
|
onKeyDown: handleKeyDown,
|
6873
6925
|
onSelected: handleSelected
|
6874
6926
|
})) : void 0
|
6875
|
-
))), leftCaret && /* @__PURE__ */
|
6927
|
+
))), leftCaret && /* @__PURE__ */ React68.createElement("div", {
|
6876
6928
|
className: tw("absolute left-0 bg-gradient-to-r from-white via-white z-20 py-3 pr-4")
|
6877
|
-
}, /* @__PURE__ */
|
6929
|
+
}, /* @__PURE__ */ React68.createElement("div", {
|
6878
6930
|
onClick: () => handleScrollToNext("left"),
|
6879
6931
|
className: tw("hover:bg-grey-0 p-2 leading-none cursor-pointer")
|
6880
|
-
}, /* @__PURE__ */
|
6932
|
+
}, /* @__PURE__ */ React68.createElement(InlineIcon, {
|
6881
6933
|
icon: import_chevronLeft2.default
|
6882
|
-
}))), rightCaret && /* @__PURE__ */
|
6934
|
+
}))), rightCaret && /* @__PURE__ */ React68.createElement("div", {
|
6883
6935
|
onClick: () => handleScrollToNext("right"),
|
6884
6936
|
className: tw("absolute right-0 bg-gradient-to-l from-white via-white z-20 py-3 pl-4")
|
6885
|
-
}, /* @__PURE__ */
|
6937
|
+
}, /* @__PURE__ */ React68.createElement("div", {
|
6886
6938
|
onClick: () => handleScrollToNext("right"),
|
6887
6939
|
className: tw("hover:bg-grey-0 p-2 leading-none cursor-pointer")
|
6888
|
-
}, /* @__PURE__ */
|
6940
|
+
}, /* @__PURE__ */ React68.createElement(InlineIcon, {
|
6889
6941
|
icon: import_chevronRight2.default
|
6890
6942
|
})))), renderChildren(children, selected, props));
|
6891
6943
|
};
|
@@ -6893,7 +6945,7 @@ var createTabsComponent = (TabComponent, TabItemComponent, displayName, renderCh
|
|
6893
6945
|
Tabs2.Tab = TabComponent;
|
6894
6946
|
return Tabs2;
|
6895
6947
|
};
|
6896
|
-
var Tabs = createTabsComponent(Tab, TabItem, "Tabs", (children, selected) => /* @__PURE__ */
|
6948
|
+
var Tabs = createTabsComponent(Tab, TabItem, "Tabs", (children, selected) => /* @__PURE__ */ React68.createElement(TabContainer, null, children.find(
|
6897
6949
|
(node, index) => (node == null ? void 0 : node.props.value) === selected || index === selected
|
6898
6950
|
)));
|
6899
6951
|
|
@@ -6910,7 +6962,7 @@ var Modal2 = ({
|
|
6910
6962
|
secondaryActions,
|
6911
6963
|
size
|
6912
6964
|
}) => {
|
6913
|
-
const ref =
|
6965
|
+
const ref = React69.useRef(null);
|
6914
6966
|
const state = useOverlayTriggerState4({ isOpen: open });
|
6915
6967
|
const { modalProps, underlayProps } = useModalOverlay2({ isDismissable: false }, state, ref);
|
6916
6968
|
const labelledBy = useId2();
|
@@ -6922,35 +6974,35 @@ var Modal2 = ({
|
|
6922
6974
|
if (!open) {
|
6923
6975
|
return null;
|
6924
6976
|
}
|
6925
|
-
return /* @__PURE__ */
|
6977
|
+
return /* @__PURE__ */ React69.createElement(Overlay2, null, /* @__PURE__ */ React69.createElement(Modal, {
|
6926
6978
|
open: state.isOpen
|
6927
|
-
}, /* @__PURE__ */
|
6979
|
+
}, /* @__PURE__ */ React69.createElement(Modal.BackDrop, __spreadValues({}, underlayProps)), /* @__PURE__ */ React69.createElement(FocusScope3, {
|
6928
6980
|
contain: true,
|
6929
6981
|
restoreFocus: true,
|
6930
6982
|
autoFocus: true
|
6931
|
-
}, /* @__PURE__ */
|
6983
|
+
}, /* @__PURE__ */ React69.createElement(Modal.Dialog, __spreadValues(__spreadValues({
|
6932
6984
|
ref,
|
6933
6985
|
size
|
6934
|
-
}, modalProps), dialogProps), /* @__PURE__ */
|
6986
|
+
}, modalProps), dialogProps), /* @__PURE__ */ React69.createElement(Modal.CloseButtonContainer, null, /* @__PURE__ */ React69.createElement(IconButton, {
|
6935
6987
|
"aria-label": "Close",
|
6936
6988
|
icon: import_cross5.default,
|
6937
6989
|
onClick: onClose
|
6938
|
-
})), headerImage !== void 0 && /* @__PURE__ */
|
6990
|
+
})), headerImage !== void 0 && /* @__PURE__ */ React69.createElement(Modal.HeaderImage, {
|
6939
6991
|
backgroundImage: headerImage
|
6940
|
-
}), /* @__PURE__ */
|
6992
|
+
}), /* @__PURE__ */ React69.createElement(Modal.Header, {
|
6941
6993
|
className: tw({ "pb-3": isComponentType(children, ModalTabs) })
|
6942
|
-
}, /* @__PURE__ */
|
6994
|
+
}, /* @__PURE__ */ React69.createElement(Modal.TitleContainer, null, /* @__PURE__ */ React69.createElement(Modal.Title, {
|
6943
6995
|
id: labelledBy
|
6944
|
-
}, title), subtitle && /* @__PURE__ */
|
6996
|
+
}, title), subtitle && /* @__PURE__ */ React69.createElement(Modal.Subtitle, null, subtitle))), isComponentType(children, ModalTabs) ? React69.cloneElement(children, { className: tw("[&>div:first-child]:px-5 grow") }) : /* @__PURE__ */ React69.createElement(Modal.Body, {
|
6945
6997
|
id: describedBy,
|
6946
6998
|
tabIndex: 0,
|
6947
6999
|
noFooter: !(secondaryActions || primaryAction)
|
6948
|
-
}, children), (secondaryActions || primaryAction) && /* @__PURE__ */
|
7000
|
+
}, children), (secondaryActions || primaryAction) && /* @__PURE__ */ React69.createElement(Modal.Footer, null, /* @__PURE__ */ React69.createElement(Modal.Actions, null, secondaryActions && castArray(secondaryActions).filter(Boolean).map((_a) => {
|
6949
7001
|
var _b = _a, { text } = _b, action = __objRest(_b, ["text"]);
|
6950
|
-
return /* @__PURE__ */
|
7002
|
+
return /* @__PURE__ */ React69.createElement(SecondaryButton, __spreadValues({
|
6951
7003
|
key: text
|
6952
7004
|
}, action), text);
|
6953
|
-
}), primaryAction && /* @__PURE__ */
|
7005
|
+
}), primaryAction && /* @__PURE__ */ React69.createElement(PrimaryButton, __spreadValues({
|
6954
7006
|
key: primaryAction.text
|
6955
7007
|
}, omit10(primaryAction, "text")), primaryAction.text)))))));
|
6956
7008
|
};
|
@@ -6958,24 +7010,24 @@ var ModalTabs = createTabsComponent(
|
|
6958
7010
|
ModalTab,
|
6959
7011
|
TabItem,
|
6960
7012
|
"ModalTabs",
|
6961
|
-
(children, selected, props) => /* @__PURE__ */
|
7013
|
+
(children, selected, props) => /* @__PURE__ */ React69.createElement(Modal.Body, {
|
6962
7014
|
maxHeight: props.maxHeight
|
6963
|
-
}, /* @__PURE__ */
|
7015
|
+
}, /* @__PURE__ */ React69.createElement(ModalTabContainer, null, children.find(
|
6964
7016
|
(node, index) => (node == null ? void 0 : node.props.value) === selected || index === selected
|
6965
7017
|
)))
|
6966
7018
|
);
|
6967
7019
|
|
6968
7020
|
// src/components/MultiInput/MultiInput.tsx
|
6969
|
-
import
|
7021
|
+
import React71, { useEffect as useEffect6, useRef as useRef7, useState as useState8 } from "react";
|
6970
7022
|
import castArray2 from "lodash/castArray";
|
6971
7023
|
import identity from "lodash/identity";
|
6972
7024
|
import omit11 from "lodash/omit";
|
6973
7025
|
import uniqueId4 from "lodash/uniqueId";
|
6974
7026
|
|
6975
7027
|
// src/components/MultiInput/InputChip.tsx
|
6976
|
-
import
|
7028
|
+
import React70 from "react";
|
6977
7029
|
var import_smallCross = __toESM(require_smallCross());
|
6978
|
-
var InputChip =
|
7030
|
+
var InputChip = React70.forwardRef(
|
6979
7031
|
(_a, ref) => {
|
6980
7032
|
var _b = _a, { invalid = false, disabled, readOnly, className, onClick: _onClick, children } = _b, props = __objRest(_b, ["invalid", "disabled", "readOnly", "className", "onClick", "children"]);
|
6981
7033
|
const onClick = (e) => {
|
@@ -6983,7 +7035,7 @@ var InputChip = React67.forwardRef(
|
|
6983
7035
|
_onClick == null ? void 0 : _onClick(e);
|
6984
7036
|
}
|
6985
7037
|
};
|
6986
|
-
return /* @__PURE__ */
|
7038
|
+
return /* @__PURE__ */ React70.createElement("div", __spreadValues({
|
6987
7039
|
ref,
|
6988
7040
|
role: "button",
|
6989
7041
|
className: classNames(className, "inline-flex align-middle mx-1 px-2 py-1 items-center rounded-sm break-all", {
|
@@ -6993,10 +7045,10 @@ var InputChip = React67.forwardRef(
|
|
6993
7045
|
"bg-grey-5 pointer-events-none": disabled
|
6994
7046
|
}),
|
6995
7047
|
onClick
|
6996
|
-
}, props), /* @__PURE__ */
|
7048
|
+
}, props), /* @__PURE__ */ React70.createElement(Typography2, {
|
6997
7049
|
variant: "small",
|
6998
7050
|
color: invalid ? "error-80" : disabled ? "grey-40" : "grey-70"
|
6999
|
-
}, children), !readOnly && /* @__PURE__ */
|
7051
|
+
}, children), !readOnly && /* @__PURE__ */ React70.createElement("div", null, /* @__PURE__ */ React70.createElement(Icon, {
|
7000
7052
|
icon: import_smallCross.default,
|
7001
7053
|
className: tw("ml-2", {
|
7002
7054
|
"text-error-70": invalid,
|
@@ -7024,6 +7076,7 @@ var MultiInputBase = (_a) => {
|
|
7024
7076
|
itemToString = (val) => String(val),
|
7025
7077
|
createItem = (val) => val,
|
7026
7078
|
onChange,
|
7079
|
+
onBlur,
|
7027
7080
|
onInputChange,
|
7028
7081
|
isItemValid,
|
7029
7082
|
disabled = false,
|
@@ -7045,6 +7098,7 @@ var MultiInputBase = (_a) => {
|
|
7045
7098
|
"itemToString",
|
7046
7099
|
"createItem",
|
7047
7100
|
"onChange",
|
7101
|
+
"onBlur",
|
7048
7102
|
"onInputChange",
|
7049
7103
|
"isItemValid",
|
7050
7104
|
"disabled",
|
@@ -7131,10 +7185,11 @@ var MultiInputBase = (_a) => {
|
|
7131
7185
|
if (value2) {
|
7132
7186
|
handleAddItem(value2);
|
7133
7187
|
}
|
7188
|
+
onBlur == null ? void 0 : onBlur();
|
7134
7189
|
};
|
7135
7190
|
const renderChips = () => items == null ? void 0 : items.map((item, index) => {
|
7136
7191
|
var _a3;
|
7137
|
-
return /* @__PURE__ */
|
7192
|
+
return /* @__PURE__ */ React71.createElement(InputChip, {
|
7138
7193
|
key: `${itemToString(item)}.${index}`,
|
7139
7194
|
invalid: !((_a3 = isItemValid == null ? void 0 : isItemValid(item, index)) != null ? _a3 : true),
|
7140
7195
|
readOnly,
|
@@ -7145,11 +7200,11 @@ var MultiInputBase = (_a) => {
|
|
7145
7200
|
}
|
7146
7201
|
}, itemToString(item));
|
7147
7202
|
});
|
7148
|
-
return /* @__PURE__ */
|
7203
|
+
return /* @__PURE__ */ React71.createElement("div", null, /* @__PURE__ */ React71.createElement(Select.InputContainer, {
|
7149
7204
|
variant: disabled ? "disabled" : valid === false ? "error" : readOnly ? "readOnly" : hasFocus ? "focused" : "default"
|
7150
|
-
}, /* @__PURE__ */
|
7205
|
+
}, /* @__PURE__ */ React71.createElement("div", {
|
7151
7206
|
className: "grow inline-flex flex-row flex-wrap gap-y-2"
|
7152
|
-
}, inline && renderChips(), /* @__PURE__ */
|
7207
|
+
}, inline && renderChips(), /* @__PURE__ */ React71.createElement(Select.Input, __spreadProps(__spreadValues({
|
7153
7208
|
ref: inputRef,
|
7154
7209
|
id: id != null ? id : name,
|
7155
7210
|
name,
|
@@ -7167,11 +7222,11 @@ var MultiInputBase = (_a) => {
|
|
7167
7222
|
onFocus: handleFocus,
|
7168
7223
|
onBlur: handleBlur,
|
7169
7224
|
autoComplete: "off"
|
7170
|
-
}))), endAdornment && /* @__PURE__ */
|
7225
|
+
}))), endAdornment && /* @__PURE__ */ React71.createElement(InputAdornment, null, endAdornment)), !inline && /* @__PURE__ */ React71.createElement("div", {
|
7171
7226
|
className: tw("flex flex-row flex-wrap gap-y-2 mt-2")
|
7172
7227
|
}, renderChips()));
|
7173
7228
|
};
|
7174
|
-
var BaseMultiInputSkeleton = () => /* @__PURE__ */
|
7229
|
+
var BaseMultiInputSkeleton = () => /* @__PURE__ */ React71.createElement(Skeleton, {
|
7175
7230
|
height: 38
|
7176
7231
|
});
|
7177
7232
|
MultiInputBase.Skeleton = BaseMultiInputSkeleton;
|
@@ -7188,14 +7243,14 @@ var MultiInput = (props) => {
|
|
7188
7243
|
const errorProps = props.valid === false ? { "aria-invalid": true, "aria-describedby": errorMessageId } : {};
|
7189
7244
|
const labelControlProps = getLabelControlProps(props);
|
7190
7245
|
const baseProps = omit11(props, Object.keys(labelControlProps));
|
7191
|
-
return /* @__PURE__ */
|
7246
|
+
return /* @__PURE__ */ React71.createElement(LabelControl, __spreadProps(__spreadValues({
|
7192
7247
|
id: `${id.current}-label`,
|
7193
7248
|
htmlFor: `${id.current}-input`,
|
7194
7249
|
messageId: errorMessageId
|
7195
7250
|
}, labelControlProps), {
|
7196
7251
|
length: value.length,
|
7197
7252
|
maxLength
|
7198
|
-
}), /* @__PURE__ */
|
7253
|
+
}), /* @__PURE__ */ React71.createElement(MultiInputBase, __spreadProps(__spreadValues(__spreadValues({}, baseProps), errorProps), {
|
7199
7254
|
id: `${id.current}-input`,
|
7200
7255
|
onChange: (value2) => {
|
7201
7256
|
var _a2;
|
@@ -7207,12 +7262,12 @@ var MultiInput = (props) => {
|
|
7207
7262
|
valid: props.valid
|
7208
7263
|
})));
|
7209
7264
|
};
|
7210
|
-
var MultiInputSkeleton = () => /* @__PURE__ */
|
7265
|
+
var MultiInputSkeleton = () => /* @__PURE__ */ React71.createElement(LabelControl.Skeleton, null, /* @__PURE__ */ React71.createElement(MultiInputBase.Skeleton, null));
|
7211
7266
|
MultiInput.Skeleton = MultiInputSkeleton;
|
7212
7267
|
MultiInput.Skeleton.displayName = "MultiInput.Skeleton";
|
7213
7268
|
|
7214
7269
|
// src/components/MultiSelect/MultiSelect.tsx
|
7215
|
-
import
|
7270
|
+
import React72, { useRef as useRef8, useState as useState9 } from "react";
|
7216
7271
|
import { useOverlayPosition as useOverlayPosition5 } from "@react-aria/overlays";
|
7217
7272
|
import { useCombobox as useCombobox2, useMultipleSelection } from "downshift";
|
7218
7273
|
import isNil from "lodash/isNil";
|
@@ -7340,7 +7395,7 @@ var MultiSelectBase = (_a) => {
|
|
7340
7395
|
});
|
7341
7396
|
const inputProps = getInputProps(getDropdownProps({ disabled: disabled || readOnly }));
|
7342
7397
|
const renderChips = () => {
|
7343
|
-
return selectedItems.map((selectedItem, index) => /* @__PURE__ */
|
7398
|
+
return selectedItems.map((selectedItem, index) => /* @__PURE__ */ React72.createElement(InputChip, __spreadProps(__spreadValues({
|
7344
7399
|
key: `${itemToString(selectedItem)}.chip`,
|
7345
7400
|
className: tw("mx-0"),
|
7346
7401
|
disabled,
|
@@ -7356,14 +7411,14 @@ var MultiSelectBase = (_a) => {
|
|
7356
7411
|
const hasNoResults = options.length === 0 || filteredOptions.length === 0;
|
7357
7412
|
const width = (_a2 = targetRef.current) == null ? void 0 : _a2.offsetWidth;
|
7358
7413
|
const style = isOpen ? __spreadProps(__spreadValues({}, overlayProps.style), { width }) : { display: "none" };
|
7359
|
-
return /* @__PURE__ */
|
7414
|
+
return /* @__PURE__ */ React72.createElement("div", {
|
7360
7415
|
className: tw("relative")
|
7361
|
-
}, /* @__PURE__ */
|
7416
|
+
}, /* @__PURE__ */ React72.createElement(Select.InputContainer, {
|
7362
7417
|
ref: targetRef,
|
7363
7418
|
variant: disabled ? "disabled" : !valid ? "error" : readOnly ? "readOnly" : hasFocus ? "focused" : "default"
|
7364
|
-
}, /* @__PURE__ */
|
7419
|
+
}, /* @__PURE__ */ React72.createElement("div", {
|
7365
7420
|
className: "grow inline-flex flex-row flex-wrap gap-2"
|
7366
|
-
}, !hideChips && inline && renderChips(), /* @__PURE__ */
|
7421
|
+
}, !hideChips && inline && renderChips(), /* @__PURE__ */ React72.createElement(Select.Input, __spreadProps(__spreadValues(__spreadValues({
|
7367
7422
|
id,
|
7368
7423
|
name,
|
7369
7424
|
placeholder: selectedItems.length === 0 && !readOnly ? placeholder : "",
|
@@ -7384,12 +7439,12 @@ var MultiSelectBase = (_a) => {
|
|
7384
7439
|
setFocus(false);
|
7385
7440
|
(_a3 = inputProps.onBlur) == null ? void 0 : _a3.call(inputProps, e);
|
7386
7441
|
}
|
7387
|
-
}))), !readOnly && /* @__PURE__ */
|
7442
|
+
}))), !readOnly && /* @__PURE__ */ React72.createElement(Select.Toggle, __spreadValues({
|
7388
7443
|
hasFocus,
|
7389
7444
|
isOpen
|
7390
|
-
}, getToggleButtonProps({ disabled })))), !hideChips && !inline && /* @__PURE__ */
|
7445
|
+
}, getToggleButtonProps({ disabled })))), !hideChips && !inline && /* @__PURE__ */ React72.createElement("div", {
|
7391
7446
|
className: tw("flex flex-row flex-wrap gap-2 mt-2")
|
7392
|
-
}, renderChips()), /* @__PURE__ */
|
7447
|
+
}, renderChips()), /* @__PURE__ */ React72.createElement(PopoverWrapper, __spreadProps(__spreadValues({
|
7393
7448
|
isOpen: true,
|
7394
7449
|
isDismissable: true,
|
7395
7450
|
autoFocus: true
|
@@ -7397,15 +7452,15 @@ var MultiSelectBase = (_a) => {
|
|
7397
7452
|
style,
|
7398
7453
|
onClose: closeMenu,
|
7399
7454
|
className: tw("overflow-y-auto")
|
7400
|
-
}), /* @__PURE__ */
|
7455
|
+
}), /* @__PURE__ */ React72.createElement(Select.Menu, {
|
7401
7456
|
maxHeight
|
7402
|
-
}, isOpen && hasNoResults && /* @__PURE__ */
|
7457
|
+
}, isOpen && hasNoResults && /* @__PURE__ */ React72.createElement(Select.NoResults, null, noResults), isOpen && filteredOptions.map((item, index) => /* @__PURE__ */ React72.createElement(Select.Item, __spreadValues({
|
7403
7458
|
key: itemToString(item),
|
7404
7459
|
highlighted: index === highlightedIndex,
|
7405
7460
|
selected: selectedItems.includes(item)
|
7406
7461
|
}, getItemProps({ item, index, disabled: isOptionDisabled(item, index) })), renderOption(item))))));
|
7407
7462
|
};
|
7408
|
-
var MultiSelectBaseSkeleton = () => /* @__PURE__ */
|
7463
|
+
var MultiSelectBaseSkeleton = () => /* @__PURE__ */ React72.createElement(Skeleton, {
|
7409
7464
|
height: 38
|
7410
7465
|
});
|
7411
7466
|
MultiSelectBase.Skeleton = MultiSelectBaseSkeleton;
|
@@ -7423,11 +7478,11 @@ var MultiSelect = (_a) => {
|
|
7423
7478
|
const errorProps = props.valid === false ? { "aria-invalid": true, "aria-describedby": errorMessageId } : {};
|
7424
7479
|
const labelControlProps = getLabelControlProps(props);
|
7425
7480
|
const baseProps = omit12(props, Object.keys(labelControlProps));
|
7426
|
-
return /* @__PURE__ */
|
7481
|
+
return /* @__PURE__ */ React72.createElement(LabelControl, __spreadValues({
|
7427
7482
|
id: `${id.current}-label`,
|
7428
7483
|
htmlFor: `${id.current}-input`,
|
7429
7484
|
messageId: errorMessageId
|
7430
|
-
}, labelControlProps), /* @__PURE__ */
|
7485
|
+
}, labelControlProps), /* @__PURE__ */ React72.createElement(MultiSelectBase, __spreadProps(__spreadValues(__spreadValues({}, baseProps), errorProps), {
|
7431
7486
|
id: id.current,
|
7432
7487
|
options,
|
7433
7488
|
noResults,
|
@@ -7435,16 +7490,16 @@ var MultiSelect = (_a) => {
|
|
7435
7490
|
valid: props.valid
|
7436
7491
|
})));
|
7437
7492
|
};
|
7438
|
-
var MultiSelectSkeleton = () => /* @__PURE__ */
|
7493
|
+
var MultiSelectSkeleton = () => /* @__PURE__ */ React72.createElement(LabelControl.Skeleton, null, /* @__PURE__ */ React72.createElement(MultiSelectBase.Skeleton, null));
|
7439
7494
|
MultiSelect.Skeleton = MultiSelectSkeleton;
|
7440
7495
|
MultiSelect.Skeleton.displayName = "MultiSelect.Skeleton";
|
7441
7496
|
|
7442
7497
|
// src/components/NativeSelect/NativeSelect.tsx
|
7443
|
-
import
|
7498
|
+
import React73, { useRef as useRef9 } from "react";
|
7444
7499
|
import omit13 from "lodash/omit";
|
7445
7500
|
import uniqueId6 from "lodash/uniqueId";
|
7446
7501
|
var import_caretDown = __toESM(require_caretDown());
|
7447
|
-
var NativeSelectBase =
|
7502
|
+
var NativeSelectBase = React73.forwardRef(
|
7448
7503
|
(_a, ref) => {
|
7449
7504
|
var _b = _a, { children, disabled = false, required = false, valid = true, readOnly = false } = _b, props = __objRest(_b, ["children", "disabled", "required", "valid", "readOnly"]);
|
7450
7505
|
const placeholderValue = uniqueId6("default_value_for_placeholder");
|
@@ -7461,16 +7516,16 @@ var NativeSelectBase = React70.forwardRef(
|
|
7461
7516
|
(_b2 = props.onBlur) == null ? void 0 : _b2.call(props, event);
|
7462
7517
|
}
|
7463
7518
|
};
|
7464
|
-
return /* @__PURE__ */
|
7519
|
+
return /* @__PURE__ */ React73.createElement("span", {
|
7465
7520
|
className: tw("relative block")
|
7466
|
-
}, !readOnly && /* @__PURE__ */
|
7521
|
+
}, !readOnly && /* @__PURE__ */ React73.createElement("span", {
|
7467
7522
|
className: tw(
|
7468
7523
|
"absolute right-0 inset-y-0 mr-4 text-grey-40 flex ml-3 pointer-events-none typography-default-strong mt-4"
|
7469
7524
|
)
|
7470
|
-
}, /* @__PURE__ */
|
7525
|
+
}, /* @__PURE__ */ React73.createElement(Icon, {
|
7471
7526
|
icon: import_caretDown.default,
|
7472
7527
|
"data-testid": "icon-dropdown"
|
7473
|
-
})), /* @__PURE__ */
|
7528
|
+
})), /* @__PURE__ */ React73.createElement("select", __spreadProps(__spreadValues({
|
7474
7529
|
ref,
|
7475
7530
|
disabled: disabled || readOnly,
|
7476
7531
|
required
|
@@ -7489,16 +7544,16 @@ var NativeSelectBase = React70.forwardRef(
|
|
7489
7544
|
),
|
7490
7545
|
props.className
|
7491
7546
|
)
|
7492
|
-
}), props.placeholder && /* @__PURE__ */
|
7547
|
+
}), props.placeholder && /* @__PURE__ */ React73.createElement("option", {
|
7493
7548
|
value: placeholderValue,
|
7494
7549
|
disabled: true
|
7495
7550
|
}, props.placeholder), children));
|
7496
7551
|
}
|
7497
7552
|
);
|
7498
|
-
NativeSelectBase.Skeleton = () => /* @__PURE__ */
|
7553
|
+
NativeSelectBase.Skeleton = () => /* @__PURE__ */ React73.createElement(Skeleton, {
|
7499
7554
|
height: 38
|
7500
7555
|
});
|
7501
|
-
var NativeSelect =
|
7556
|
+
var NativeSelect = React73.forwardRef(
|
7502
7557
|
(_a, ref) => {
|
7503
7558
|
var _b = _a, { readOnly } = _b, props = __objRest(_b, ["readOnly"]);
|
7504
7559
|
var _a2;
|
@@ -7507,11 +7562,11 @@ var NativeSelect = React70.forwardRef(
|
|
7507
7562
|
const errorProps = props.valid === false ? { "aria-invalid": true, "aria-describedby": errorMessageId } : {};
|
7508
7563
|
const _b2 = getLabelControlProps(props), { "data-testid": dataTestId } = _b2, labelControlProps = __objRest(_b2, ["data-testid"]);
|
7509
7564
|
const baseProps = omit13(props, Object.keys(labelControlProps));
|
7510
|
-
return /* @__PURE__ */
|
7565
|
+
return /* @__PURE__ */ React73.createElement(LabelControl, __spreadValues({
|
7511
7566
|
id: `${id.current}-label`,
|
7512
7567
|
htmlFor: id.current,
|
7513
7568
|
messageId: errorMessageId
|
7514
|
-
}, labelControlProps), /* @__PURE__ */
|
7569
|
+
}, labelControlProps), /* @__PURE__ */ React73.createElement(NativeSelectBase, __spreadProps(__spreadValues(__spreadValues({
|
7515
7570
|
ref
|
7516
7571
|
}, baseProps), errorProps), {
|
7517
7572
|
id: id.current,
|
@@ -7524,20 +7579,22 @@ var NativeSelect = React70.forwardRef(
|
|
7524
7579
|
})));
|
7525
7580
|
}
|
7526
7581
|
);
|
7527
|
-
|
7582
|
+
NativeSelect.displayName = "NativeSelect";
|
7583
|
+
var Option = React73.forwardRef((_a, ref) => {
|
7528
7584
|
var _b = _a, { children } = _b, props = __objRest(_b, ["children"]);
|
7529
|
-
return /* @__PURE__ */
|
7585
|
+
return /* @__PURE__ */ React73.createElement("option", __spreadValues({
|
7530
7586
|
ref
|
7531
7587
|
}, props), children);
|
7532
7588
|
});
|
7533
|
-
|
7589
|
+
Option.displayName = "Option";
|
7590
|
+
var NativeSelectSkeleton = () => /* @__PURE__ */ React73.createElement(LabelControl.Skeleton, null, /* @__PURE__ */ React73.createElement(NativeSelectBase.Skeleton, null), /* @__PURE__ */ React73.createElement("div", {
|
7534
7591
|
style: { height: "1px" }
|
7535
7592
|
}));
|
7536
7593
|
NativeSelect.Skeleton = NativeSelectSkeleton;
|
7537
7594
|
NativeSelect.Skeleton.displayName = "NativeSelect.Skeleton";
|
7538
7595
|
|
7539
7596
|
// src/components/PageHeader/PageHeader.tsx
|
7540
|
-
import
|
7597
|
+
import React74 from "react";
|
7541
7598
|
import castArray3 from "lodash/castArray";
|
7542
7599
|
import omit14 from "lodash/omit";
|
7543
7600
|
var PageHeader = ({
|
@@ -7549,48 +7606,48 @@ var PageHeader = ({
|
|
7549
7606
|
chips = [],
|
7550
7607
|
breadcrumbs
|
7551
7608
|
}) => {
|
7552
|
-
return /* @__PURE__ */
|
7609
|
+
return /* @__PURE__ */ React74.createElement(Flexbox, {
|
7553
7610
|
direction: "row",
|
7554
7611
|
gap: "4",
|
7555
7612
|
paddingBottom: "6"
|
7556
|
-
}, /* @__PURE__ */
|
7613
|
+
}, /* @__PURE__ */ React74.createElement(Flexbox, {
|
7557
7614
|
className: tw("grow"),
|
7558
7615
|
direction: "column",
|
7559
7616
|
gap: "0"
|
7560
|
-
}, breadcrumbs && /* @__PURE__ */
|
7617
|
+
}, breadcrumbs && /* @__PURE__ */ React74.createElement(Breadcrumbs, null, breadcrumbs), /* @__PURE__ */ React74.createElement(Flexbox, {
|
7561
7618
|
gap: "5"
|
7562
|
-
}, image && /* @__PURE__ */
|
7619
|
+
}, image && /* @__PURE__ */ React74.createElement("img", {
|
7563
7620
|
src: image,
|
7564
7621
|
alt: imageAlt,
|
7565
7622
|
className: tw("w-[56px] h-[56px]")
|
7566
|
-
}), /* @__PURE__ */
|
7623
|
+
}), /* @__PURE__ */ React74.createElement(Flexbox, {
|
7567
7624
|
direction: "column",
|
7568
7625
|
justifyContent: "center"
|
7569
|
-
}, /* @__PURE__ */
|
7626
|
+
}, /* @__PURE__ */ React74.createElement(Typography2.Heading, null, title), chips.length > 0 && /* @__PURE__ */ React74.createElement(Flexbox, {
|
7570
7627
|
gap: "3"
|
7571
|
-
}, chips.map((chip) => /* @__PURE__ */
|
7628
|
+
}, chips.map((chip) => /* @__PURE__ */ React74.createElement(Chip2, {
|
7572
7629
|
key: chip,
|
7573
7630
|
dense: true,
|
7574
7631
|
text: chip
|
7575
|
-
})))))), (secondaryActions || primaryAction) && /* @__PURE__ */
|
7632
|
+
})))))), (secondaryActions || primaryAction) && /* @__PURE__ */ React74.createElement(Flexbox, {
|
7576
7633
|
gap: "4",
|
7577
7634
|
className: tw("self-start")
|
7578
7635
|
}, secondaryActions && castArray3(secondaryActions).filter(Boolean).map((_a) => {
|
7579
7636
|
var _b = _a, { text } = _b, action = __objRest(_b, ["text"]);
|
7580
|
-
return /* @__PURE__ */
|
7637
|
+
return /* @__PURE__ */ React74.createElement(SecondaryButton, __spreadValues({
|
7581
7638
|
key: text
|
7582
7639
|
}, action), text);
|
7583
|
-
}), primaryAction && /* @__PURE__ */
|
7640
|
+
}), primaryAction && /* @__PURE__ */ React74.createElement(PrimaryButton, __spreadValues({
|
7584
7641
|
key: primaryAction.text
|
7585
7642
|
}, omit14(primaryAction, "text")), primaryAction.text)));
|
7586
7643
|
};
|
7587
7644
|
|
7588
7645
|
// src/components/Pagination/Pagination.tsx
|
7589
|
-
import
|
7646
|
+
import React76 from "react";
|
7590
7647
|
import clamp from "lodash/clamp";
|
7591
7648
|
|
7592
7649
|
// src/components/Select/Select.tsx
|
7593
|
-
import
|
7650
|
+
import React75, { useRef as useRef10, useState as useState10 } from "react";
|
7594
7651
|
import { useOverlayPosition as useOverlayPosition6 } from "@react-aria/overlays";
|
7595
7652
|
import { useSelect } from "downshift";
|
7596
7653
|
import defaults from "lodash/defaults";
|
@@ -7607,10 +7664,10 @@ var hasOptionGroups = (val) => {
|
|
7607
7664
|
};
|
7608
7665
|
var defaultRenderOption = (item, props, { selectedItem }, { getOptionKey, getValue, optionToString = getOptionLabelBuiltin }) => {
|
7609
7666
|
var _a, _b;
|
7610
|
-
return /* @__PURE__ */
|
7667
|
+
return /* @__PURE__ */ React75.createElement(Select.Item, __spreadValues({
|
7611
7668
|
key: (_b = (_a = getOptionKey == null ? void 0 : getOptionKey(item)) != null ? _a : getValue == null ? void 0 : getValue(item)) != null ? _b : optionToString(item),
|
7612
7669
|
selected: item === selectedItem
|
7613
|
-
}, props), hasIconProperty(item) && /* @__PURE__ */
|
7670
|
+
}, props), hasIconProperty(item) && /* @__PURE__ */ React75.createElement(InlineIcon, {
|
7614
7671
|
icon: item.icon
|
7615
7672
|
}), optionToString(item));
|
7616
7673
|
};
|
@@ -7727,13 +7784,13 @@ var _SelectBase = (props) => {
|
|
7727
7784
|
},
|
7728
7785
|
withDefaults
|
7729
7786
|
);
|
7730
|
-
const renderGroup = (group) => /* @__PURE__ */
|
7787
|
+
const renderGroup = (group) => /* @__PURE__ */ React75.createElement(React75.Fragment, {
|
7731
7788
|
key: group.label
|
7732
|
-
}, /* @__PURE__ */
|
7733
|
-
const input = /* @__PURE__ */
|
7789
|
+
}, /* @__PURE__ */ React75.createElement(Select.Group, null, group.label), group.options.map((opt) => renderItem(opt, items.indexOf(opt))));
|
7790
|
+
const input = /* @__PURE__ */ React75.createElement(Select.InputContainer, __spreadProps(__spreadValues({}, getToggleButtonProps({ disabled: disabled || readOnly, ref: targetRef })), {
|
7734
7791
|
variant: disabled ? "disabled" : !valid ? "error" : readOnly ? "readOnly" : hasFocus ? "focused" : "default",
|
7735
7792
|
tabIndex: 0
|
7736
|
-
}), /* @__PURE__ */
|
7793
|
+
}), /* @__PURE__ */ React75.createElement(Select.Input, __spreadProps(__spreadValues({
|
7737
7794
|
id,
|
7738
7795
|
name
|
7739
7796
|
}, rest), {
|
@@ -7745,16 +7802,16 @@ var _SelectBase = (props) => {
|
|
7745
7802
|
tabIndex: -1,
|
7746
7803
|
onFocus: () => setFocus(true),
|
7747
7804
|
onBlur: () => setFocus(false)
|
7748
|
-
})), !readOnly && /* @__PURE__ */
|
7805
|
+
})), !readOnly && /* @__PURE__ */ React75.createElement(Select.Toggle, {
|
7749
7806
|
disabled,
|
7750
7807
|
isOpen,
|
7751
7808
|
tabIndex: -1
|
7752
7809
|
}));
|
7753
7810
|
const width = (_b = targetRef.current) == null ? void 0 : _b.offsetWidth;
|
7754
7811
|
const style = isOpen ? __spreadProps(__spreadValues({}, overlayProps.style), { width }) : { display: "none" };
|
7755
|
-
return /* @__PURE__ */
|
7812
|
+
return /* @__PURE__ */ React75.createElement("div", {
|
7756
7813
|
className: tw("relative")
|
7757
|
-
}, labelWrapper ?
|
7814
|
+
}, labelWrapper ? React75.cloneElement(labelWrapper, { children: input }) : input, /* @__PURE__ */ React75.createElement(PopoverWrapper, __spreadProps(__spreadValues({
|
7758
7815
|
isOpen: true,
|
7759
7816
|
isDismissable: true,
|
7760
7817
|
autoFocus: true
|
@@ -7762,11 +7819,11 @@ var _SelectBase = (props) => {
|
|
7762
7819
|
style,
|
7763
7820
|
onClose: closeMenu,
|
7764
7821
|
className: tw("overflow-y-auto")
|
7765
|
-
}), /* @__PURE__ */
|
7822
|
+
}), /* @__PURE__ */ React75.createElement(Select.Menu, {
|
7766
7823
|
maxHeight
|
7767
|
-
}, isOpen && options.length === 0 && /* @__PURE__ */
|
7824
|
+
}, isOpen && options.length === 0 && /* @__PURE__ */ React75.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__ */ React75.createElement(React75.Fragment, null, /* @__PURE__ */ React75.createElement(Select.Divider, {
|
7768
7825
|
onMouseOver: () => setHighlightedIndex(-1)
|
7769
|
-
}), actions.map((act, index) => /* @__PURE__ */
|
7826
|
+
}), actions.map((act, index) => /* @__PURE__ */ React75.createElement(Select.ActionItem, __spreadProps(__spreadValues({
|
7770
7827
|
key: `${index}`
|
7771
7828
|
}, act), {
|
7772
7829
|
onMouseOver: () => setHighlightedIndex(-1),
|
@@ -7776,10 +7833,10 @@ var _SelectBase = (props) => {
|
|
7776
7833
|
}
|
7777
7834
|
}), act.label))))));
|
7778
7835
|
};
|
7779
|
-
var SelectBase = (props) => /* @__PURE__ */
|
7836
|
+
var SelectBase = (props) => /* @__PURE__ */ React75.createElement(_SelectBase, __spreadProps(__spreadValues({}, props), {
|
7780
7837
|
labelWrapper: void 0
|
7781
7838
|
}));
|
7782
|
-
var SelectBaseSkeleton = () => /* @__PURE__ */
|
7839
|
+
var SelectBaseSkeleton = () => /* @__PURE__ */ React75.createElement(Skeleton, {
|
7783
7840
|
height: 38
|
7784
7841
|
});
|
7785
7842
|
SelectBase.Skeleton = SelectBaseSkeleton;
|
@@ -7797,19 +7854,19 @@ var Select2 = (_a) => {
|
|
7797
7854
|
const baseProps = omit15(props, Object.keys(labelProps));
|
7798
7855
|
const legacyError = labelProps.error !== void 0 && labelProps.valid === false;
|
7799
7856
|
const variant = !labelProps.valid || legacyError ? "error" : labelProps.disabled ? "disabled" : "default";
|
7800
|
-
const label = /* @__PURE__ */
|
7857
|
+
const label = /* @__PURE__ */ React75.createElement(Label, __spreadValues({
|
7801
7858
|
id: `${id.current}-label`,
|
7802
7859
|
htmlFor: `${id.current}-input`,
|
7803
7860
|
variant,
|
7804
7861
|
messageId: errorMessageId
|
7805
7862
|
}, labelProps));
|
7806
|
-
return /* @__PURE__ */
|
7863
|
+
return /* @__PURE__ */ React75.createElement(FormControl, null, /* @__PURE__ */ React75.createElement(_SelectBase, __spreadProps(__spreadValues(__spreadValues({}, baseProps), errorProps), {
|
7807
7864
|
id: `${id.current}-input`,
|
7808
7865
|
options,
|
7809
7866
|
disabled: props.disabled,
|
7810
7867
|
valid: props.valid,
|
7811
7868
|
labelWrapper: label
|
7812
|
-
})), /* @__PURE__ */
|
7869
|
+
})), /* @__PURE__ */ React75.createElement(HelperText, {
|
7813
7870
|
messageId: errorMessageId,
|
7814
7871
|
error: !labelProps.valid,
|
7815
7872
|
helperText: labelProps.helperText,
|
@@ -7818,8 +7875,9 @@ var Select2 = (_a) => {
|
|
7818
7875
|
reserveSpaceForError: labelProps.reserveSpaceForError
|
7819
7876
|
}));
|
7820
7877
|
};
|
7821
|
-
var SelectSkeleton = () => /* @__PURE__ */
|
7878
|
+
var SelectSkeleton = () => /* @__PURE__ */ React75.createElement(LabelControl.Skeleton, null, /* @__PURE__ */ React75.createElement(SelectBase.Skeleton, null));
|
7822
7879
|
Select2.Skeleton = SelectSkeleton;
|
7880
|
+
Select2.Skeleton.displayName = "Select.Skeleton";
|
7823
7881
|
|
7824
7882
|
// src/components/Pagination/Pagination.tsx
|
7825
7883
|
var import_chevronBackward = __toESM(require_chevronBackward());
|
@@ -7836,25 +7894,25 @@ var Pagination = ({
|
|
7836
7894
|
pageSizes,
|
7837
7895
|
onPageSizeChange
|
7838
7896
|
}) => {
|
7839
|
-
const [value, setValue] =
|
7840
|
-
|
7897
|
+
const [value, setValue] = React76.useState(currentPage);
|
7898
|
+
React76.useEffect(() => {
|
7841
7899
|
setValue(currentPage);
|
7842
7900
|
}, [currentPage]);
|
7843
|
-
|
7901
|
+
React76.useEffect(() => {
|
7844
7902
|
onPageChange(1);
|
7845
7903
|
setValue(1);
|
7846
7904
|
}, [pageSize]);
|
7847
|
-
return /* @__PURE__ */
|
7905
|
+
return /* @__PURE__ */ React76.createElement(Box, {
|
7848
7906
|
className: tw("grid grid-cols-[200px_1fr_200px]"),
|
7849
7907
|
backgroundColor: "grey-0",
|
7850
7908
|
padding: "4"
|
7851
|
-
}, pageSizes && onPageSizeChange && typeof pageSize === "number" ? /* @__PURE__ */
|
7909
|
+
}, pageSizes && onPageSizeChange && typeof pageSize === "number" ? /* @__PURE__ */ React76.createElement(Box, {
|
7852
7910
|
display: "flex",
|
7853
7911
|
alignItems: "center",
|
7854
7912
|
gap: "4"
|
7855
|
-
}, /* @__PURE__ */
|
7913
|
+
}, /* @__PURE__ */ React76.createElement(Typography2.SmallText, null, "Items per page "), /* @__PURE__ */ React76.createElement("div", {
|
7856
7914
|
className: tw("max-w-[70px]")
|
7857
|
-
}, /* @__PURE__ */
|
7915
|
+
}, /* @__PURE__ */ React76.createElement(SelectBase, {
|
7858
7916
|
options: pageSizes.map((size) => size.toString()),
|
7859
7917
|
value: pageSize.toString(),
|
7860
7918
|
onChange: (size) => {
|
@@ -7865,24 +7923,24 @@ var Pagination = ({
|
|
7865
7923
|
}
|
7866
7924
|
}
|
7867
7925
|
}
|
7868
|
-
}))) : /* @__PURE__ */
|
7926
|
+
}))) : /* @__PURE__ */ React76.createElement("div", null), /* @__PURE__ */ React76.createElement(Box, {
|
7869
7927
|
display: "flex",
|
7870
7928
|
justifyContent: "center",
|
7871
7929
|
alignItems: "center",
|
7872
7930
|
className: tw("grow")
|
7873
|
-
}, /* @__PURE__ */
|
7931
|
+
}, /* @__PURE__ */ React76.createElement(IconButton, {
|
7874
7932
|
"aria-label": "First",
|
7875
7933
|
onClick: () => onPageChange(1),
|
7876
7934
|
icon: import_chevronBackward.default,
|
7877
7935
|
disabled: !hasPreviousPage
|
7878
|
-
}), /* @__PURE__ */
|
7936
|
+
}), /* @__PURE__ */ React76.createElement(IconButton, {
|
7879
7937
|
"aria-label": "Previous",
|
7880
7938
|
onClick: () => onPageChange(currentPage - 1),
|
7881
7939
|
icon: import_chevronLeft3.default,
|
7882
7940
|
disabled: !hasPreviousPage
|
7883
|
-
}), /* @__PURE__ */
|
7941
|
+
}), /* @__PURE__ */ React76.createElement(Box, {
|
7884
7942
|
paddingX: "4"
|
7885
|
-
}, /* @__PURE__ */
|
7943
|
+
}, /* @__PURE__ */ React76.createElement(Typography2.SmallText, null, "Page")), /* @__PURE__ */ React76.createElement(InputBase, {
|
7886
7944
|
className: classNames(tw("text-center max-w-[40px]"), "no-arrows"),
|
7887
7945
|
type: "number",
|
7888
7946
|
min: 1,
|
@@ -7905,43 +7963,43 @@ var Pagination = ({
|
|
7905
7963
|
setValue(1);
|
7906
7964
|
}
|
7907
7965
|
}
|
7908
|
-
}), /* @__PURE__ */
|
7966
|
+
}), /* @__PURE__ */ React76.createElement(Box, {
|
7909
7967
|
paddingX: "4"
|
7910
|
-
}, /* @__PURE__ */
|
7968
|
+
}, /* @__PURE__ */ React76.createElement(Typography2.SmallText, null, "of ", totalPages)), /* @__PURE__ */ React76.createElement(IconButton, {
|
7911
7969
|
"aria-label": "Next",
|
7912
7970
|
onClick: () => onPageChange(currentPage + 1),
|
7913
7971
|
icon: import_chevronRight3.default,
|
7914
7972
|
disabled: !hasNextPage
|
7915
|
-
}), /* @__PURE__ */
|
7973
|
+
}), /* @__PURE__ */ React76.createElement(IconButton, {
|
7916
7974
|
"aria-label": "Last",
|
7917
7975
|
onClick: () => onPageChange(totalPages),
|
7918
7976
|
icon: import_chevronForward.default,
|
7919
7977
|
disabled: !hasNextPage
|
7920
|
-
})), /* @__PURE__ */
|
7978
|
+
})), /* @__PURE__ */ React76.createElement("div", null));
|
7921
7979
|
};
|
7922
7980
|
|
7923
7981
|
// src/components/PopoverDialog/PopoverDialog.tsx
|
7924
|
-
import
|
7982
|
+
import React78 from "react";
|
7925
7983
|
import omit16 from "lodash/omit";
|
7926
7984
|
|
7927
7985
|
// src/common/PopoverDialog/PopoverDialog.tsx
|
7928
|
-
import
|
7986
|
+
import React77 from "react";
|
7929
7987
|
var Header = (_a) => {
|
7930
7988
|
var _b = _a, { children, className } = _b, rest = __objRest(_b, ["children", "className"]);
|
7931
|
-
return /* @__PURE__ */
|
7989
|
+
return /* @__PURE__ */ React77.createElement("div", __spreadProps(__spreadValues({}, rest), {
|
7932
7990
|
className: classNames(tw("p-5 gap-3 flex items-center"), className)
|
7933
7991
|
}), children);
|
7934
7992
|
};
|
7935
7993
|
var Title = (_a) => {
|
7936
7994
|
var _b = _a, { children, className } = _b, rest = __objRest(_b, ["children", "className"]);
|
7937
|
-
return /* @__PURE__ */
|
7995
|
+
return /* @__PURE__ */ React77.createElement(Typography, __spreadProps(__spreadValues({}, rest), {
|
7938
7996
|
htmlTag: "h1",
|
7939
7997
|
variant: "small-strong"
|
7940
7998
|
}), children);
|
7941
7999
|
};
|
7942
8000
|
var Body = (_a) => {
|
7943
8001
|
var _b = _a, { children, className } = _b, rest = __objRest(_b, ["children", "className"]);
|
7944
|
-
return /* @__PURE__ */
|
8002
|
+
return /* @__PURE__ */ React77.createElement(Typography, __spreadProps(__spreadValues({}, rest), {
|
7945
8003
|
htmlTag: "div",
|
7946
8004
|
variant: "caption",
|
7947
8005
|
className: classNames(tw("px-5 overflow-y-auto"), className)
|
@@ -7949,13 +8007,13 @@ var Body = (_a) => {
|
|
7949
8007
|
};
|
7950
8008
|
var Footer = (_a) => {
|
7951
8009
|
var _b = _a, { children, className } = _b, rest = __objRest(_b, ["children", "className"]);
|
7952
|
-
return /* @__PURE__ */
|
8010
|
+
return /* @__PURE__ */ React77.createElement("div", __spreadProps(__spreadValues({}, rest), {
|
7953
8011
|
className: classNames(tw("p-5"), className)
|
7954
8012
|
}), children);
|
7955
8013
|
};
|
7956
8014
|
var Actions2 = (_a) => {
|
7957
8015
|
var _b = _a, { children, className } = _b, rest = __objRest(_b, ["children", "className"]);
|
7958
|
-
return /* @__PURE__ */
|
8016
|
+
return /* @__PURE__ */ React77.createElement("div", __spreadProps(__spreadValues({}, rest), {
|
7959
8017
|
className: classNames(tw("flex gap-4"), className)
|
7960
8018
|
}), children);
|
7961
8019
|
};
|
@@ -7971,13 +8029,13 @@ var PopoverDialog = {
|
|
7971
8029
|
var PopoverDialog2 = ({ placement, open, title, secondaryAction, primaryAction, children }) => {
|
7972
8030
|
const wrapPromptWithBody = (child) => {
|
7973
8031
|
if (isComponentType(child, PopoverDialog2.Prompt)) {
|
7974
|
-
return /* @__PURE__ */
|
8032
|
+
return /* @__PURE__ */ React78.createElement(Popover2.Panel, {
|
7975
8033
|
className: tw("max-w-[300px]")
|
7976
|
-
}, /* @__PURE__ */
|
8034
|
+
}, /* @__PURE__ */ React78.createElement(PopoverDialog.Header, null, /* @__PURE__ */ React78.createElement(PopoverDialog.Title, null, title)), child, /* @__PURE__ */ React78.createElement(PopoverDialog.Footer, null, /* @__PURE__ */ React78.createElement(PopoverDialog.Actions, null, secondaryAction && /* @__PURE__ */ React78.createElement(Popover2.Button, __spreadValues({
|
7977
8035
|
kind: "secondary-ghost",
|
7978
8036
|
key: secondaryAction.text,
|
7979
8037
|
dense: true
|
7980
|
-
}, omit16(secondaryAction, "text")), secondaryAction.text), /* @__PURE__ */
|
8038
|
+
}, omit16(secondaryAction, "text")), secondaryAction.text), /* @__PURE__ */ React78.createElement(Popover2.Button, __spreadValues({
|
7981
8039
|
kind: "ghost",
|
7982
8040
|
key: primaryAction.text,
|
7983
8041
|
dense: true
|
@@ -7985,7 +8043,7 @@ var PopoverDialog2 = ({ placement, open, title, secondaryAction, primaryAction,
|
|
7985
8043
|
}
|
7986
8044
|
return child;
|
7987
8045
|
};
|
7988
|
-
return /* @__PURE__ */
|
8046
|
+
return /* @__PURE__ */ React78.createElement(Popover2, {
|
7989
8047
|
type: "dialog",
|
7990
8048
|
isOpen: open,
|
7991
8049
|
placement,
|
@@ -7993,10 +8051,10 @@ var PopoverDialog2 = ({ placement, open, title, secondaryAction, primaryAction,
|
|
7993
8051
|
isKeyboardDismissDisabled: false,
|
7994
8052
|
autoFocus: true,
|
7995
8053
|
containFocus: true
|
7996
|
-
},
|
8054
|
+
}, React78.Children.map(children, wrapPromptWithBody));
|
7997
8055
|
};
|
7998
8056
|
PopoverDialog2.Trigger = Popover2.Trigger;
|
7999
|
-
var Prompt = ({ children }) => /* @__PURE__ */
|
8057
|
+
var Prompt = ({ children }) => /* @__PURE__ */ React78.createElement(PopoverDialog.Body, null, children);
|
8000
8058
|
Prompt.displayName = "PopoverDialog.Prompt";
|
8001
8059
|
PopoverDialog2.Prompt = Prompt;
|
8002
8060
|
|
@@ -8005,14 +8063,14 @@ import { createPortal } from "react-dom";
|
|
8005
8063
|
var Portal = ({ children, to }) => createPortal(children, to);
|
8006
8064
|
|
8007
8065
|
// src/components/ProgressBar/ProgressBar.tsx
|
8008
|
-
import
|
8066
|
+
import React80 from "react";
|
8009
8067
|
|
8010
8068
|
// src/common/ProgressBar/ProgressBar.tsx
|
8011
|
-
import
|
8069
|
+
import React79 from "react";
|
8012
8070
|
import clamp2 from "lodash/clamp";
|
8013
8071
|
var ProgressBar = (_a) => {
|
8014
8072
|
var _b = _a, { children, className } = _b, rest = __objRest(_b, ["children", "className"]);
|
8015
|
-
return /* @__PURE__ */
|
8073
|
+
return /* @__PURE__ */ React79.createElement("div", __spreadProps(__spreadValues({}, rest), {
|
8016
8074
|
className: classNames(
|
8017
8075
|
tw("relative flex items-center w-full bg-grey-0 h-2 rounded-full overflow-hidden"),
|
8018
8076
|
className
|
@@ -8028,7 +8086,7 @@ var STATUS_COLORS = {
|
|
8028
8086
|
ProgressBar.Indicator = (_a) => {
|
8029
8087
|
var _b = _a, { min, max, value, "aria-label": ariaLabel, status, className } = _b, rest = __objRest(_b, ["min", "max", "value", "aria-label", "status", "className"]);
|
8030
8088
|
const completedPercentage = clamp2((value - min) / (max - min) * 100, 0, 100);
|
8031
|
-
return /* @__PURE__ */
|
8089
|
+
return /* @__PURE__ */ React79.createElement("div", __spreadProps(__spreadValues({}, rest), {
|
8032
8090
|
className: classNames(
|
8033
8091
|
tw("h-2 rounded-full transition-all ease-in-out delay-150"),
|
8034
8092
|
STATUS_COLORS[status],
|
@@ -8044,11 +8102,11 @@ ProgressBar.Indicator = (_a) => {
|
|
8044
8102
|
};
|
8045
8103
|
ProgressBar.Labels = (_a) => {
|
8046
8104
|
var _b = _a, { children, startLabel, endLabel, className } = _b, rest = __objRest(_b, ["children", "startLabel", "endLabel", "className"]);
|
8047
|
-
return /* @__PURE__ */
|
8105
|
+
return /* @__PURE__ */ React79.createElement("div", {
|
8048
8106
|
className: classNames(tw("flex flex-row"), className)
|
8049
|
-
}, /* @__PURE__ */
|
8107
|
+
}, /* @__PURE__ */ React79.createElement("span", __spreadProps(__spreadValues({}, rest), {
|
8050
8108
|
className: tw("grow text-grey-70 typography-caption")
|
8051
|
-
}), startLabel), /* @__PURE__ */
|
8109
|
+
}), startLabel), /* @__PURE__ */ React79.createElement("span", __spreadProps(__spreadValues({}, rest), {
|
8052
8110
|
className: tw("grow text-grey-70 typography-caption text-right")
|
8053
8111
|
}), endLabel));
|
8054
8112
|
};
|
@@ -8066,7 +8124,7 @@ var ProgressBar2 = (props) => {
|
|
8066
8124
|
if (min > max) {
|
8067
8125
|
throw new Error("`min` value provided to `ProgressBar` is greater than `max` value.");
|
8068
8126
|
}
|
8069
|
-
const progress = /* @__PURE__ */
|
8127
|
+
const progress = /* @__PURE__ */ React80.createElement(ProgressBar, null, /* @__PURE__ */ React80.createElement(ProgressBar.Indicator, {
|
8070
8128
|
status: value === max ? completedStatus : progresStatus,
|
8071
8129
|
min,
|
8072
8130
|
max,
|
@@ -8076,25 +8134,27 @@ var ProgressBar2 = (props) => {
|
|
8076
8134
|
if (props.dense) {
|
8077
8135
|
return progress;
|
8078
8136
|
}
|
8079
|
-
return /* @__PURE__ */
|
8137
|
+
return /* @__PURE__ */ React80.createElement("div", null, progress, /* @__PURE__ */ React80.createElement(ProgressBar.Labels, {
|
8080
8138
|
className: tw("py-2"),
|
8081
8139
|
startLabel: props.startLabel,
|
8082
8140
|
endLabel: props.endLabel
|
8083
8141
|
}));
|
8084
8142
|
};
|
8085
|
-
|
8143
|
+
var ProgressBarSkeleton = () => /* @__PURE__ */ React80.createElement(Skeleton, {
|
8086
8144
|
height: 4,
|
8087
8145
|
display: "block"
|
8088
8146
|
});
|
8147
|
+
ProgressBar2.Skeleton = ProgressBarSkeleton;
|
8148
|
+
ProgressBar2.Skeleton.displayName = "ProgressBar.Skeleton";
|
8089
8149
|
|
8090
8150
|
// src/components/RadioButton/RadioButton.tsx
|
8091
|
-
import
|
8092
|
-
var RadioButton2 =
|
8151
|
+
import React81 from "react";
|
8152
|
+
var RadioButton2 = React81.forwardRef(
|
8093
8153
|
(_a, ref) => {
|
8094
8154
|
var _b = _a, { name, id, readOnly = false, disabled = false, caption, children, "aria-label": ariaLabel } = _b, props = __objRest(_b, ["name", "id", "readOnly", "disabled", "caption", "children", "aria-label"]);
|
8095
8155
|
var _a2;
|
8096
8156
|
const isChecked = (_a2 = props.checked) != null ? _a2 : props.defaultChecked;
|
8097
|
-
return !readOnly || isChecked ? /* @__PURE__ */
|
8157
|
+
return !readOnly || isChecked ? /* @__PURE__ */ React81.createElement(ControlLabel, {
|
8098
8158
|
htmlFor: id,
|
8099
8159
|
label: children,
|
8100
8160
|
"aria-label": ariaLabel,
|
@@ -8102,7 +8162,7 @@ var RadioButton2 = React78.forwardRef(
|
|
8102
8162
|
readOnly,
|
8103
8163
|
disabled,
|
8104
8164
|
style: { gap: "0 8px" }
|
8105
|
-
}, !readOnly && /* @__PURE__ */
|
8165
|
+
}, !readOnly && /* @__PURE__ */ React81.createElement(RadioButton, __spreadProps(__spreadValues({
|
8106
8166
|
id,
|
8107
8167
|
ref,
|
8108
8168
|
name
|
@@ -8112,22 +8172,24 @@ var RadioButton2 = React78.forwardRef(
|
|
8112
8172
|
}))) : null;
|
8113
8173
|
}
|
8114
8174
|
);
|
8115
|
-
|
8175
|
+
RadioButton2.displayName = "RadioButton";
|
8176
|
+
var RadioButtonSkeleton = () => /* @__PURE__ */ React81.createElement("div", {
|
8116
8177
|
className: tw("flex gap-3")
|
8117
|
-
}, /* @__PURE__ */
|
8178
|
+
}, /* @__PURE__ */ React81.createElement(Skeleton, {
|
8118
8179
|
height: 20,
|
8119
8180
|
width: 20
|
8120
|
-
}), /* @__PURE__ */
|
8181
|
+
}), /* @__PURE__ */ React81.createElement(Skeleton, {
|
8121
8182
|
height: 20,
|
8122
8183
|
width: 150
|
8123
8184
|
}));
|
8124
8185
|
RadioButton2.Skeleton = RadioButtonSkeleton;
|
8186
|
+
RadioButton2.Skeleton.displayName = "RadioButton.Skeleton";
|
8125
8187
|
|
8126
8188
|
// src/components/RadioButtonGroup/RadioButtonGroup.tsx
|
8127
|
-
import
|
8189
|
+
import React82 from "react";
|
8128
8190
|
import uniqueId8 from "lodash/uniqueId";
|
8129
8191
|
var isRadioButton = (c) => {
|
8130
|
-
return
|
8192
|
+
return React82.isValidElement(c) && c.type === RadioButton2;
|
8131
8193
|
};
|
8132
8194
|
var RadioButtonGroup = (_a) => {
|
8133
8195
|
var _b = _a, {
|
@@ -8150,7 +8212,7 @@ var RadioButtonGroup = (_a) => {
|
|
8150
8212
|
"children"
|
8151
8213
|
]);
|
8152
8214
|
var _a2;
|
8153
|
-
const [value, setValue] =
|
8215
|
+
const [value, setValue] = React82.useState((_a2 = _value != null ? _value : defaultValue) != null ? _a2 : "");
|
8154
8216
|
const errorMessageId = uniqueId8();
|
8155
8217
|
const errorProps = props.valid === false ? { "aria-invalid": true, "aria-describedby": errorMessageId } : {};
|
8156
8218
|
const labelControlProps = getLabelControlProps(props);
|
@@ -8161,14 +8223,14 @@ var RadioButtonGroup = (_a) => {
|
|
8161
8223
|
setValue(e.target.value);
|
8162
8224
|
onChange == null ? void 0 : onChange(e.target.value);
|
8163
8225
|
};
|
8164
|
-
const content =
|
8226
|
+
const content = React82.Children.map(children, (c) => {
|
8165
8227
|
var _a3, _b2, _c;
|
8166
8228
|
if (!isRadioButton(c)) {
|
8167
8229
|
return null;
|
8168
8230
|
}
|
8169
8231
|
const defaultChecked = defaultValue === void 0 ? void 0 : c.props.value === defaultValue;
|
8170
8232
|
const checked = value === void 0 ? void 0 : c.props.value === value;
|
8171
|
-
return
|
8233
|
+
return React82.cloneElement(c, {
|
8172
8234
|
name,
|
8173
8235
|
defaultChecked: (_a3 = c.props.defaultChecked) != null ? _a3 : defaultChecked,
|
8174
8236
|
checked: (_b2 = c.props.checked) != null ? _b2 : checked,
|
@@ -8177,11 +8239,11 @@ var RadioButtonGroup = (_a) => {
|
|
8177
8239
|
readOnly
|
8178
8240
|
});
|
8179
8241
|
});
|
8180
|
-
return /* @__PURE__ */
|
8242
|
+
return /* @__PURE__ */ React82.createElement(LabelControl, __spreadValues(__spreadValues({
|
8181
8243
|
fieldset: true
|
8182
|
-
}, labelControlProps), errorProps), cols && /* @__PURE__ */
|
8244
|
+
}, labelControlProps), errorProps), cols && /* @__PURE__ */ React82.createElement(InputGroup, {
|
8183
8245
|
cols
|
8184
|
-
}, content), !cols && /* @__PURE__ */
|
8246
|
+
}, content), !cols && /* @__PURE__ */ React82.createElement(Flexbox, {
|
8185
8247
|
direction,
|
8186
8248
|
alignItems: "flex-start",
|
8187
8249
|
colGap: "8",
|
@@ -8190,80 +8252,81 @@ var RadioButtonGroup = (_a) => {
|
|
8190
8252
|
}, content));
|
8191
8253
|
};
|
8192
8254
|
var RadioButtonGroupSkeleton = ({ direction = "row", options = 2 }) => {
|
8193
|
-
return /* @__PURE__ */
|
8255
|
+
return /* @__PURE__ */ React82.createElement(LabelControl.Skeleton, null, /* @__PURE__ */ React82.createElement("div", {
|
8194
8256
|
className: tw("flex flex-wrap", {
|
8195
8257
|
"flex-row gap-8": direction === "row",
|
8196
8258
|
"flex-col gap-2": direction === "column"
|
8197
8259
|
})
|
8198
|
-
}, Array.from({ length: options }).map((_, key) => /* @__PURE__ */
|
8260
|
+
}, Array.from({ length: options }).map((_, key) => /* @__PURE__ */ React82.createElement(RadioButton2.Skeleton, {
|
8199
8261
|
key
|
8200
8262
|
}))));
|
8201
8263
|
};
|
8202
8264
|
RadioButtonGroup.Skeleton = RadioButtonGroupSkeleton;
|
8265
|
+
RadioButtonGroup.Skeleton.displayName = "RadioButtonGroup.Skeleton";
|
8203
8266
|
|
8204
8267
|
// src/components/Section/Section.tsx
|
8205
|
-
import
|
8268
|
+
import React84 from "react";
|
8206
8269
|
import castArray4 from "lodash/castArray";
|
8207
8270
|
|
8208
8271
|
// src/common/Section/Section.tsx
|
8209
|
-
import
|
8272
|
+
import React83 from "react";
|
8210
8273
|
var Section2 = (_a) => {
|
8211
8274
|
var _b = _a, { children } = _b, rest = __objRest(_b, ["children"]);
|
8212
|
-
return /* @__PURE__ */
|
8275
|
+
return /* @__PURE__ */ React83.createElement(Box, __spreadValues({
|
8213
8276
|
borderColor: "grey-5",
|
8214
8277
|
borderWidth: "1px"
|
8215
8278
|
}, rest), children);
|
8216
8279
|
};
|
8217
8280
|
Section2.Header = (_a) => {
|
8218
8281
|
var _b = _a, { children, className } = _b, rest = __objRest(_b, ["children", "className"]);
|
8219
|
-
return /* @__PURE__ */
|
8282
|
+
return /* @__PURE__ */ React83.createElement("div", __spreadProps(__spreadValues({}, rest), {
|
8220
8283
|
className: classNames(tw("px-6 py-5 flex gap-5 justify-between items-center"), className)
|
8221
8284
|
}), children);
|
8222
8285
|
};
|
8223
8286
|
Section2.TitleContainer = (_a) => {
|
8224
8287
|
var _b = _a, { children, className } = _b, rest = __objRest(_b, ["children", "className"]);
|
8225
|
-
return /* @__PURE__ */
|
8288
|
+
return /* @__PURE__ */ React83.createElement("div", __spreadProps(__spreadValues({}, rest), {
|
8226
8289
|
className: classNames(tw("flex flex-col grow gap-2"), className)
|
8227
8290
|
}), children);
|
8228
8291
|
};
|
8229
8292
|
Section2.Title = (_a) => {
|
8230
8293
|
var _b = _a, { children } = _b, rest = __objRest(_b, ["children"]);
|
8231
|
-
return /* @__PURE__ */
|
8294
|
+
return /* @__PURE__ */ React83.createElement(Typography2.Subheading, __spreadProps(__spreadValues({}, rest), {
|
8232
8295
|
color: "black"
|
8233
8296
|
}), children);
|
8234
8297
|
};
|
8235
8298
|
Section2.Subtitle = (_a) => {
|
8236
8299
|
var _b = _a, { children } = _b, rest = __objRest(_b, ["children"]);
|
8237
|
-
return /* @__PURE__ */
|
8300
|
+
return /* @__PURE__ */ React83.createElement(Typography2.SmallText, __spreadProps(__spreadValues({}, rest), {
|
8238
8301
|
color: "grey-70"
|
8239
8302
|
}), children);
|
8240
8303
|
};
|
8241
8304
|
Section2.Actions = (_a) => {
|
8242
8305
|
var _b = _a, { children, className } = _b, rest = __objRest(_b, ["children", "className"]);
|
8243
|
-
return /* @__PURE__ */
|
8306
|
+
return /* @__PURE__ */ React83.createElement("div", __spreadProps(__spreadValues({}, rest), {
|
8244
8307
|
className: classNames(tw("flex gap-4 justify-end"), className)
|
8245
8308
|
}), children);
|
8246
8309
|
};
|
8247
8310
|
Section2.Body = (_a) => {
|
8248
8311
|
var _b = _a, { children, className } = _b, rest = __objRest(_b, ["children", "className"]);
|
8249
|
-
return /* @__PURE__ */
|
8312
|
+
return /* @__PURE__ */ React83.createElement("div", __spreadProps(__spreadValues({}, rest), {
|
8250
8313
|
className: classNames(tw("p-6"), className)
|
8251
|
-
}), /* @__PURE__ */
|
8314
|
+
}), /* @__PURE__ */ React83.createElement(Typography, {
|
8252
8315
|
htmlTag: "div",
|
8253
8316
|
color: "grey-70"
|
8254
8317
|
}, children));
|
8255
8318
|
};
|
8256
8319
|
|
8257
8320
|
// src/components/Section/Section.tsx
|
8258
|
-
var Section3 = ({ title, subtitle, actions, children }) => /* @__PURE__ */
|
8321
|
+
var Section3 = ({ title, subtitle, actions, children }) => /* @__PURE__ */ React84.createElement(Section2, null, title && /* @__PURE__ */ React84.createElement(React84.Fragment, null, /* @__PURE__ */ React84.createElement(Section2.Header, null, /* @__PURE__ */ React84.createElement(Section2.TitleContainer, null, /* @__PURE__ */ React84.createElement(Section2.Title, null, title), subtitle && /* @__PURE__ */ React84.createElement(Section2.Subtitle, null, subtitle)), /* @__PURE__ */ React84.createElement(Section2.Actions, null, actions && castArray4(actions).filter(Boolean).map((_a) => {
|
8259
8322
|
var _b = _a, { text } = _b, action = __objRest(_b, ["text"]);
|
8260
|
-
return /* @__PURE__ */
|
8323
|
+
return /* @__PURE__ */ React84.createElement(SecondaryButton, __spreadValues({
|
8261
8324
|
key: text
|
8262
8325
|
}, action), text);
|
8263
|
-
}))), /* @__PURE__ */
|
8326
|
+
}))), /* @__PURE__ */ React84.createElement(Divider2, null)), /* @__PURE__ */ React84.createElement(Section2.Body, null, children));
|
8264
8327
|
|
8265
8328
|
// src/components/SegmentedControl/SegmentedControl.tsx
|
8266
|
-
import
|
8329
|
+
import React85 from "react";
|
8267
8330
|
var SegmentedControl = (_a) => {
|
8268
8331
|
var _b = _a, {
|
8269
8332
|
children,
|
@@ -8280,7 +8343,7 @@ var SegmentedControl = (_a) => {
|
|
8280
8343
|
"selected",
|
8281
8344
|
"className"
|
8282
8345
|
]);
|
8283
|
-
return /* @__PURE__ */
|
8346
|
+
return /* @__PURE__ */ React85.createElement("button", __spreadProps(__spreadValues({
|
8284
8347
|
type: "button"
|
8285
8348
|
}, rest), {
|
8286
8349
|
className: classNames(
|
@@ -8311,11 +8374,11 @@ var SegmentedControlGroup = (_a) => {
|
|
8311
8374
|
"border border-grey-20 text-grey-50": variant === "outlined",
|
8312
8375
|
"bg-grey-0": variant === "raised"
|
8313
8376
|
});
|
8314
|
-
return /* @__PURE__ */
|
8377
|
+
return /* @__PURE__ */ React85.createElement("div", __spreadProps(__spreadValues({}, rest), {
|
8315
8378
|
className: classNames(classes, className)
|
8316
|
-
}),
|
8379
|
+
}), React85.Children.map(
|
8317
8380
|
children,
|
8318
|
-
(child) =>
|
8381
|
+
(child) => React85.cloneElement(child, {
|
8319
8382
|
dense,
|
8320
8383
|
variant,
|
8321
8384
|
onClick: () => onChange(child.props.value),
|
@@ -8353,14 +8416,14 @@ var getCommonClassNames = (dense, selected) => tw(
|
|
8353
8416
|
);
|
8354
8417
|
|
8355
8418
|
// src/components/Stepper/Stepper.tsx
|
8356
|
-
import
|
8419
|
+
import React87 from "react";
|
8357
8420
|
|
8358
8421
|
// src/common/Stepper/Stepper.tsx
|
8359
|
-
import
|
8422
|
+
import React86 from "react";
|
8360
8423
|
var import_tick5 = __toESM(require_tick());
|
8361
8424
|
var Stepper = (_a) => {
|
8362
8425
|
var _b = _a, { className } = _b, rest = __objRest(_b, ["className"]);
|
8363
|
-
return /* @__PURE__ */
|
8426
|
+
return /* @__PURE__ */ React86.createElement("div", __spreadProps(__spreadValues({}, rest), {
|
8364
8427
|
className: classNames(className)
|
8365
8428
|
}));
|
8366
8429
|
};
|
@@ -8374,7 +8437,7 @@ var ConnectorContainer = (_a) => {
|
|
8374
8437
|
"completed",
|
8375
8438
|
"dense"
|
8376
8439
|
]);
|
8377
|
-
return /* @__PURE__ */
|
8440
|
+
return /* @__PURE__ */ React86.createElement("div", __spreadProps(__spreadValues({}, rest), {
|
8378
8441
|
className: classNames(
|
8379
8442
|
tw("absolute w-full -left-1/2", {
|
8380
8443
|
"top-[3px] px-[14px]": Boolean(dense),
|
@@ -8386,7 +8449,7 @@ var ConnectorContainer = (_a) => {
|
|
8386
8449
|
};
|
8387
8450
|
var Connector = (_a) => {
|
8388
8451
|
var _b = _a, { children, className, completed, dense } = _b, rest = __objRest(_b, ["children", "className", "completed", "dense"]);
|
8389
|
-
return /* @__PURE__ */
|
8452
|
+
return /* @__PURE__ */ React86.createElement("div", __spreadProps(__spreadValues({}, rest), {
|
8390
8453
|
className: classNames(
|
8391
8454
|
tw("w-full", {
|
8392
8455
|
"bg-grey-20": !completed,
|
@@ -8400,7 +8463,7 @@ var Connector = (_a) => {
|
|
8400
8463
|
};
|
8401
8464
|
var Step = (_a) => {
|
8402
8465
|
var _b = _a, { className, state } = _b, rest = __objRest(_b, ["className", "state"]);
|
8403
|
-
return /* @__PURE__ */
|
8466
|
+
return /* @__PURE__ */ React86.createElement("div", __spreadProps(__spreadValues({}, rest), {
|
8404
8467
|
className: classNames(
|
8405
8468
|
tw("flex flex-col items-center text-grey-90 relative text-center", {
|
8406
8469
|
"text-grey-20": state === "inactive"
|
@@ -8421,13 +8484,13 @@ var getDenseClassNames = (state) => tw("h-[8px] w-[8px]", {
|
|
8421
8484
|
});
|
8422
8485
|
var Indicator = (_a) => {
|
8423
8486
|
var _b = _a, { children, className, state, dense } = _b, rest = __objRest(_b, ["children", "className", "state", "dense"]);
|
8424
|
-
return /* @__PURE__ */
|
8487
|
+
return /* @__PURE__ */ React86.createElement("div", __spreadProps(__spreadValues({}, rest), {
|
8425
8488
|
className: classNames(
|
8426
8489
|
tw("rounded-full flex justify-center items-center mx-2 mb-3"),
|
8427
8490
|
dense ? getDenseClassNames(state) : getClassNames(state),
|
8428
8491
|
className
|
8429
8492
|
)
|
8430
|
-
}), state === "completed" ? /* @__PURE__ */
|
8493
|
+
}), state === "completed" ? /* @__PURE__ */ React86.createElement(InlineIcon, {
|
8431
8494
|
icon: import_tick5.default
|
8432
8495
|
}) : dense ? null : children);
|
8433
8496
|
};
|
@@ -8438,25 +8501,25 @@ Stepper.ConnectorContainer = ConnectorContainer;
|
|
8438
8501
|
|
8439
8502
|
// src/components/Stepper/Stepper.tsx
|
8440
8503
|
var Stepper2 = ({ children, activeIndex, dense }) => {
|
8441
|
-
const steps =
|
8442
|
-
return /* @__PURE__ */
|
8504
|
+
const steps = React87.Children.count(children);
|
8505
|
+
return /* @__PURE__ */ React87.createElement(Stepper, {
|
8443
8506
|
role: "list"
|
8444
|
-
}, /* @__PURE__ */
|
8507
|
+
}, /* @__PURE__ */ React87.createElement(Template, {
|
8445
8508
|
columns: steps
|
8446
|
-
},
|
8509
|
+
}, React87.Children.map(children, (child, index) => {
|
8447
8510
|
if (!isComponentType(child, Step2)) {
|
8448
8511
|
return new Error("<Stepper> can only have <Stepper.Step> components as children");
|
8449
8512
|
} else {
|
8450
8513
|
const state = index > activeIndex ? "inactive" : index === activeIndex ? "active" : "completed";
|
8451
|
-
return /* @__PURE__ */
|
8514
|
+
return /* @__PURE__ */ React87.createElement(Stepper.Step, {
|
8452
8515
|
state,
|
8453
8516
|
"aria-current": state === "active" ? "step" : false,
|
8454
8517
|
role: "listitem"
|
8455
|
-
}, index > 0 && index <= steps && /* @__PURE__ */
|
8518
|
+
}, index > 0 && index <= steps && /* @__PURE__ */ React87.createElement(Stepper.ConnectorContainer, {
|
8456
8519
|
dense
|
8457
|
-
}, /* @__PURE__ */
|
8520
|
+
}, /* @__PURE__ */ React87.createElement(Stepper.ConnectorContainer.Connector, {
|
8458
8521
|
completed: state === "completed" || state === "active"
|
8459
|
-
})), /* @__PURE__ */
|
8522
|
+
})), /* @__PURE__ */ React87.createElement(Stepper.Step.Indicator, {
|
8460
8523
|
state,
|
8461
8524
|
dense
|
8462
8525
|
}, index + 1), child.props.children);
|
@@ -8464,19 +8527,20 @@ var Stepper2 = ({ children, activeIndex, dense }) => {
|
|
8464
8527
|
})));
|
8465
8528
|
};
|
8466
8529
|
var Step2 = () => null;
|
8530
|
+
Step2.displayName = "Stepper.Step";
|
8467
8531
|
Stepper2.Step = Step2;
|
8468
8532
|
|
8469
8533
|
// src/components/Switch/Switch.tsx
|
8470
|
-
import
|
8534
|
+
import React89 from "react";
|
8471
8535
|
|
8472
8536
|
// src/common/Switch/Switch.tsx
|
8473
|
-
import
|
8474
|
-
var Switch =
|
8537
|
+
import React88 from "react";
|
8538
|
+
var Switch = React88.forwardRef(
|
8475
8539
|
(_a, ref) => {
|
8476
8540
|
var _b = _a, { id, children, name, disabled = false, readOnly = false } = _b, props = __objRest(_b, ["id", "children", "name", "disabled", "readOnly"]);
|
8477
|
-
return /* @__PURE__ */
|
8541
|
+
return /* @__PURE__ */ React88.createElement("span", {
|
8478
8542
|
className: tw("relative inline-flex justify-center items-center self-center group")
|
8479
|
-
}, /* @__PURE__ */
|
8543
|
+
}, /* @__PURE__ */ React88.createElement("input", __spreadProps(__spreadValues({
|
8480
8544
|
id,
|
8481
8545
|
ref,
|
8482
8546
|
type: "checkbox",
|
@@ -8495,7 +8559,7 @@ var Switch = React85.forwardRef(
|
|
8495
8559
|
),
|
8496
8560
|
readOnly,
|
8497
8561
|
disabled
|
8498
|
-
})), /* @__PURE__ */
|
8562
|
+
})), /* @__PURE__ */ React88.createElement("span", {
|
8499
8563
|
className: tw(
|
8500
8564
|
"pointer-events-none rounded-full absolute inline-block transition duration-300 h-4 w-4 transform peer-checked/switch:translate-x-5",
|
8501
8565
|
"bg-white peer-disabled/switch:bg-grey-0 left-2 peer-checked/switch:left-1",
|
@@ -8508,12 +8572,12 @@ var Switch = React85.forwardRef(
|
|
8508
8572
|
);
|
8509
8573
|
|
8510
8574
|
// src/components/Switch/Switch.tsx
|
8511
|
-
var Switch2 =
|
8575
|
+
var Switch2 = React89.forwardRef(
|
8512
8576
|
(_a, ref) => {
|
8513
8577
|
var _b = _a, { id, name, caption, readOnly = false, disabled = false, children, "aria-label": ariaLabel } = _b, props = __objRest(_b, ["id", "name", "caption", "readOnly", "disabled", "children", "aria-label"]);
|
8514
8578
|
var _a2;
|
8515
8579
|
const isChecked = (_a2 = props.checked) != null ? _a2 : props.defaultChecked;
|
8516
|
-
return !readOnly || isChecked ? /* @__PURE__ */
|
8580
|
+
return !readOnly || isChecked ? /* @__PURE__ */ React89.createElement(ControlLabel, {
|
8517
8581
|
htmlFor: id,
|
8518
8582
|
label: children,
|
8519
8583
|
"aria-label": ariaLabel,
|
@@ -8521,7 +8585,7 @@ var Switch2 = React86.forwardRef(
|
|
8521
8585
|
readOnly,
|
8522
8586
|
disabled,
|
8523
8587
|
style: { gap: "0 8px" }
|
8524
|
-
}, !readOnly && /* @__PURE__ */
|
8588
|
+
}, !readOnly && /* @__PURE__ */ React89.createElement(Switch, __spreadProps(__spreadValues({
|
8525
8589
|
id,
|
8526
8590
|
ref,
|
8527
8591
|
name
|
@@ -8531,19 +8595,21 @@ var Switch2 = React86.forwardRef(
|
|
8531
8595
|
}))) : null;
|
8532
8596
|
}
|
8533
8597
|
);
|
8534
|
-
|
8598
|
+
Switch2.displayName = "Switch";
|
8599
|
+
var SwitchSkeleton = () => /* @__PURE__ */ React89.createElement("div", {
|
8535
8600
|
className: tw("flex gap-3")
|
8536
|
-
}, /* @__PURE__ */
|
8601
|
+
}, /* @__PURE__ */ React89.createElement(Skeleton, {
|
8537
8602
|
height: 20,
|
8538
8603
|
width: 35
|
8539
|
-
}), /* @__PURE__ */
|
8604
|
+
}), /* @__PURE__ */ React89.createElement(Skeleton, {
|
8540
8605
|
height: 20,
|
8541
8606
|
width: 150
|
8542
8607
|
}));
|
8543
8608
|
Switch2.Skeleton = SwitchSkeleton;
|
8609
|
+
Switch2.Skeleton.displayName = "Switch.Skeleton ";
|
8544
8610
|
|
8545
8611
|
// src/components/SwitchGroup/SwitchGroup.tsx
|
8546
|
-
import
|
8612
|
+
import React90, { useState as useState11 } from "react";
|
8547
8613
|
import uniqueId9 from "lodash/uniqueId";
|
8548
8614
|
var SwitchGroup = (_a) => {
|
8549
8615
|
var _b = _a, {
|
@@ -8575,11 +8641,11 @@ var SwitchGroup = (_a) => {
|
|
8575
8641
|
setSelectedItems(updated);
|
8576
8642
|
onChange == null ? void 0 : onChange(updated);
|
8577
8643
|
};
|
8578
|
-
return /* @__PURE__ */
|
8644
|
+
return /* @__PURE__ */ React90.createElement(LabelControl, __spreadValues(__spreadValues({
|
8579
8645
|
fieldset: true
|
8580
|
-
}, labelControlProps), errorProps), /* @__PURE__ */
|
8646
|
+
}, labelControlProps), errorProps), /* @__PURE__ */ React90.createElement(InputGroup, {
|
8581
8647
|
cols
|
8582
|
-
},
|
8648
|
+
}, React90.Children.map(children, (c) => {
|
8583
8649
|
var _a3, _b2, _c, _d;
|
8584
8650
|
if (!isComponentType(c, Switch2)) {
|
8585
8651
|
return null;
|
@@ -8587,7 +8653,7 @@ var SwitchGroup = (_a) => {
|
|
8587
8653
|
const str = (_a3 = c.props.value) == null ? void 0 : _a3.toString();
|
8588
8654
|
const defaultChecked = defaultValue === void 0 ? void 0 : str !== void 0 && defaultValue.includes(str);
|
8589
8655
|
const checked = value === void 0 ? void 0 : str !== void 0 && value.includes(str);
|
8590
|
-
return
|
8656
|
+
return React90.cloneElement(c, {
|
8591
8657
|
defaultChecked: (_b2 = c.props.defaultChecked) != null ? _b2 : defaultChecked,
|
8592
8658
|
checked: (_c = c.props.checked) != null ? _c : checked,
|
8593
8659
|
onChange: (_d = c.props.onChange) != null ? _d : handleChange,
|
@@ -8597,19 +8663,20 @@ var SwitchGroup = (_a) => {
|
|
8597
8663
|
})));
|
8598
8664
|
};
|
8599
8665
|
var SwitchGroupSkeleton = ({ options = 2 }) => {
|
8600
|
-
return /* @__PURE__ */
|
8666
|
+
return /* @__PURE__ */ React90.createElement(LabelControl.Skeleton, null, /* @__PURE__ */ React90.createElement("div", {
|
8601
8667
|
className: tw("flex flex-wrap flex-col gap-2")
|
8602
|
-
}, Array.from({ length: options }).map((_, key) => /* @__PURE__ */
|
8668
|
+
}, Array.from({ length: options }).map((_, key) => /* @__PURE__ */ React90.createElement(Switch2.Skeleton, {
|
8603
8669
|
key
|
8604
8670
|
}))));
|
8605
8671
|
};
|
8606
8672
|
SwitchGroup.Skeleton = SwitchGroupSkeleton;
|
8673
|
+
SwitchGroup.Skeleton.displayName = "SwitchGroup.Skeleton";
|
8607
8674
|
|
8608
8675
|
// src/components/TagLabel/TagLabel.tsx
|
8609
|
-
import
|
8676
|
+
import React91 from "react";
|
8610
8677
|
var TagLabel = (_a) => {
|
8611
8678
|
var _b = _a, { title, dense = false } = _b, rest = __objRest(_b, ["title", "dense"]);
|
8612
|
-
return /* @__PURE__ */
|
8679
|
+
return /* @__PURE__ */ React91.createElement("span", __spreadProps(__spreadValues({}, rest), {
|
8613
8680
|
className: tw("rounded-full text-white bg-primary-70", {
|
8614
8681
|
"py-2 px-4 typography-caption": !dense,
|
8615
8682
|
"py-2 px-3 typography-caption-small": dense
|
@@ -8618,14 +8685,14 @@ var TagLabel = (_a) => {
|
|
8618
8685
|
};
|
8619
8686
|
|
8620
8687
|
// src/components/Textarea/Textarea.tsx
|
8621
|
-
import
|
8688
|
+
import React92, { useRef as useRef11, useState as useState12 } from "react";
|
8622
8689
|
import omit17 from "lodash/omit";
|
8623
8690
|
import toString2 from "lodash/toString";
|
8624
8691
|
import uniqueId10 from "lodash/uniqueId";
|
8625
|
-
var TextareaBase =
|
8692
|
+
var TextareaBase = React92.forwardRef(
|
8626
8693
|
(_a, ref) => {
|
8627
8694
|
var _b = _a, { readOnly = false, valid = true } = _b, props = __objRest(_b, ["readOnly", "valid"]);
|
8628
|
-
return /* @__PURE__ */
|
8695
|
+
return /* @__PURE__ */ React92.createElement("textarea", __spreadProps(__spreadValues({
|
8629
8696
|
ref
|
8630
8697
|
}, props), {
|
8631
8698
|
readOnly,
|
@@ -8633,10 +8700,10 @@ var TextareaBase = React89.forwardRef(
|
|
8633
8700
|
}));
|
8634
8701
|
}
|
8635
8702
|
);
|
8636
|
-
TextareaBase.Skeleton = () => /* @__PURE__ */
|
8703
|
+
TextareaBase.Skeleton = () => /* @__PURE__ */ React92.createElement(Skeleton, {
|
8637
8704
|
height: 58
|
8638
8705
|
});
|
8639
|
-
var Textarea =
|
8706
|
+
var Textarea = React92.forwardRef((props, ref) => {
|
8640
8707
|
var _a, _b, _c;
|
8641
8708
|
const [value, setValue] = useState12((_b = (_a = props.value) != null ? _a : props.defaultValue) != null ? _b : "");
|
8642
8709
|
const id = useRef11((_c = props.id) != null ? _c : `textarea-${uniqueId10()}`);
|
@@ -8644,12 +8711,12 @@ var Textarea = React89.forwardRef((props, ref) => {
|
|
8644
8711
|
const errorProps = props.valid === false ? { "aria-invalid": true, "aria-describedby": errorMessageId } : {};
|
8645
8712
|
const _d = getLabelControlProps(props), { "data-testid": dataTestId } = _d, labelControlProps = __objRest(_d, ["data-testid"]);
|
8646
8713
|
const baseProps = omit17(props, Object.keys(labelControlProps));
|
8647
|
-
return /* @__PURE__ */
|
8714
|
+
return /* @__PURE__ */ React92.createElement(LabelControl, __spreadValues({
|
8648
8715
|
id: `${id.current}-label`,
|
8649
8716
|
htmlFor: id.current,
|
8650
8717
|
messageId: errorMessageId,
|
8651
8718
|
length: value !== void 0 ? toString2(value).length : void 0
|
8652
|
-
}, labelControlProps), /* @__PURE__ */
|
8719
|
+
}, labelControlProps), /* @__PURE__ */ React92.createElement(TextareaBase, __spreadProps(__spreadValues(__spreadValues({
|
8653
8720
|
ref
|
8654
8721
|
}, baseProps), errorProps), {
|
8655
8722
|
id: id.current,
|
@@ -8665,47 +8732,49 @@ var Textarea = React89.forwardRef((props, ref) => {
|
|
8665
8732
|
valid: props.valid
|
8666
8733
|
})));
|
8667
8734
|
});
|
8668
|
-
|
8735
|
+
Textarea.displayName = "Textarea";
|
8736
|
+
var TextAreaSkeleton = () => /* @__PURE__ */ React92.createElement(LabelControl.Skeleton, null, /* @__PURE__ */ React92.createElement(TextareaBase.Skeleton, null));
|
8669
8737
|
Textarea.Skeleton = TextAreaSkeleton;
|
8738
|
+
Textarea.Skeleton.displayName = "Textarea.Skeleton";
|
8670
8739
|
|
8671
8740
|
// src/components/Timeline/Timeline.tsx
|
8672
|
-
import
|
8741
|
+
import React94 from "react";
|
8673
8742
|
|
8674
8743
|
// src/common/Timeline/Timeline.tsx
|
8675
|
-
import
|
8744
|
+
import React93 from "react";
|
8676
8745
|
var Timeline = (_a) => {
|
8677
8746
|
var _b = _a, { className } = _b, rest = __objRest(_b, ["className"]);
|
8678
|
-
return /* @__PURE__ */
|
8747
|
+
return /* @__PURE__ */ React93.createElement("div", __spreadProps(__spreadValues({}, rest), {
|
8679
8748
|
className: classNames(tw("grid grid-cols-[16px_1fr] gap-x-4"), className)
|
8680
8749
|
}));
|
8681
8750
|
};
|
8682
8751
|
var Content2 = (_a) => {
|
8683
8752
|
var _b = _a, { className } = _b, rest = __objRest(_b, ["className"]);
|
8684
|
-
return /* @__PURE__ */
|
8753
|
+
return /* @__PURE__ */ React93.createElement("div", __spreadProps(__spreadValues({}, rest), {
|
8685
8754
|
className: classNames(tw("pb-6"), className)
|
8686
8755
|
}));
|
8687
8756
|
};
|
8688
8757
|
var Separator2 = (_a) => {
|
8689
8758
|
var _b = _a, { className } = _b, rest = __objRest(_b, ["className"]);
|
8690
|
-
return /* @__PURE__ */
|
8759
|
+
return /* @__PURE__ */ React93.createElement("div", __spreadProps(__spreadValues({}, rest), {
|
8691
8760
|
className: classNames(tw("flex items-center justify-center h-5 w-5"), className)
|
8692
8761
|
}));
|
8693
8762
|
};
|
8694
8763
|
var LineContainer = (_a) => {
|
8695
8764
|
var _b = _a, { className } = _b, rest = __objRest(_b, ["className"]);
|
8696
|
-
return /* @__PURE__ */
|
8765
|
+
return /* @__PURE__ */ React93.createElement("div", __spreadProps(__spreadValues({}, rest), {
|
8697
8766
|
className: classNames(tw("flex justify-center py-1"), className)
|
8698
8767
|
}));
|
8699
8768
|
};
|
8700
8769
|
var Line = (_a) => {
|
8701
8770
|
var _b = _a, { className } = _b, rest = __objRest(_b, ["className"]);
|
8702
|
-
return /* @__PURE__ */
|
8771
|
+
return /* @__PURE__ */ React93.createElement("div", __spreadProps(__spreadValues({}, rest), {
|
8703
8772
|
className: classNames(tw("w-1 bg-grey-5 h-full justify-self-center"), className)
|
8704
8773
|
}));
|
8705
8774
|
};
|
8706
8775
|
var Dot = (_a) => {
|
8707
8776
|
var _b = _a, { className } = _b, rest = __objRest(_b, ["className"]);
|
8708
|
-
return /* @__PURE__ */
|
8777
|
+
return /* @__PURE__ */ React93.createElement("div", __spreadProps(__spreadValues({}, rest), {
|
8709
8778
|
className: classNames(tw("bg-grey-30 h-[6px] w-[6px] rounded"), className)
|
8710
8779
|
}));
|
8711
8780
|
};
|
@@ -8720,61 +8789,62 @@ var import_error4 = __toESM(require_error());
|
|
8720
8789
|
var import_time = __toESM(require_time());
|
8721
8790
|
var import_warningSign4 = __toESM(require_warningSign());
|
8722
8791
|
var TimelineItem = () => null;
|
8723
|
-
var Timeline2 = ({ children }) => /* @__PURE__ */
|
8792
|
+
var Timeline2 = ({ children }) => /* @__PURE__ */ React94.createElement("div", null, React94.Children.map(children, (item) => {
|
8724
8793
|
if (!isComponentType(item, TimelineItem)) {
|
8725
8794
|
throw new Error("<Timeline> can only have <Timeline.Item> components as children");
|
8726
8795
|
} else {
|
8727
8796
|
const { props, key } = item;
|
8728
|
-
return /* @__PURE__ */
|
8797
|
+
return /* @__PURE__ */ React94.createElement(Timeline, {
|
8729
8798
|
key: key != null ? key : props.title
|
8730
|
-
}, /* @__PURE__ */
|
8799
|
+
}, /* @__PURE__ */ React94.createElement(Timeline.Separator, null, props.variant === "error" ? /* @__PURE__ */ React94.createElement(Icon, {
|
8731
8800
|
icon: import_error4.default,
|
8732
8801
|
color: "error-30"
|
8733
|
-
}) : props.variant === "warning" ? /* @__PURE__ */
|
8802
|
+
}) : props.variant === "warning" ? /* @__PURE__ */ React94.createElement(Icon, {
|
8734
8803
|
icon: import_warningSign4.default,
|
8735
8804
|
color: "warning-30"
|
8736
|
-
}) : props.variant === "info" ? /* @__PURE__ */
|
8805
|
+
}) : props.variant === "info" ? /* @__PURE__ */ React94.createElement(Icon, {
|
8737
8806
|
icon: import_time.default,
|
8738
8807
|
color: "info-30"
|
8739
|
-
}) : /* @__PURE__ */
|
8808
|
+
}) : /* @__PURE__ */ React94.createElement(Timeline.Separator.Dot, null)), /* @__PURE__ */ React94.createElement(Typography2.Caption, {
|
8740
8809
|
color: "grey-50"
|
8741
|
-
}, props.title), /* @__PURE__ */
|
8810
|
+
}, props.title), /* @__PURE__ */ React94.createElement(Timeline.LineContainer, null, /* @__PURE__ */ React94.createElement(Timeline.LineContainer.Line, null)), /* @__PURE__ */ React94.createElement(Timeline.Content, null, /* @__PURE__ */ React94.createElement(Typography2.Small, null, props.children)));
|
8742
8811
|
}
|
8743
8812
|
}));
|
8744
|
-
var TimelineItemSkeleton = () => /* @__PURE__ */
|
8813
|
+
var TimelineItemSkeleton = () => /* @__PURE__ */ React94.createElement(Timeline, null, /* @__PURE__ */ React94.createElement(Timeline.Separator, null, /* @__PURE__ */ React94.createElement(Skeleton, {
|
8745
8814
|
width: 6,
|
8746
8815
|
height: 6,
|
8747
8816
|
rounded: true
|
8748
|
-
})), /* @__PURE__ */
|
8817
|
+
})), /* @__PURE__ */ React94.createElement(Skeleton, {
|
8749
8818
|
height: 12,
|
8750
8819
|
width: 120
|
8751
|
-
}), /* @__PURE__ */
|
8820
|
+
}), /* @__PURE__ */ React94.createElement(Timeline.LineContainer, null, /* @__PURE__ */ React94.createElement(Skeleton, {
|
8752
8821
|
width: 2,
|
8753
8822
|
height: "100%"
|
8754
|
-
})), /* @__PURE__ */
|
8823
|
+
})), /* @__PURE__ */ React94.createElement(Timeline.Content, null, /* @__PURE__ */ React94.createElement(Box, {
|
8755
8824
|
display: "flex",
|
8756
8825
|
flexDirection: "column",
|
8757
8826
|
gap: "3"
|
8758
|
-
}, /* @__PURE__ */
|
8827
|
+
}, /* @__PURE__ */ React94.createElement(Skeleton, {
|
8759
8828
|
height: 32,
|
8760
8829
|
width: "100%"
|
8761
|
-
}), /* @__PURE__ */
|
8830
|
+
}), /* @__PURE__ */ React94.createElement(Skeleton, {
|
8762
8831
|
height: 32,
|
8763
8832
|
width: "73%"
|
8764
|
-
}), /* @__PURE__ */
|
8833
|
+
}), /* @__PURE__ */ React94.createElement(Skeleton, {
|
8765
8834
|
height: 32,
|
8766
8835
|
width: "80%"
|
8767
8836
|
}))));
|
8768
|
-
var TimelineSkeleton = ({ items = 3 }) => /* @__PURE__ */
|
8837
|
+
var TimelineSkeleton = ({ items = 3 }) => /* @__PURE__ */ React94.createElement("div", null, Array.from({ length: items }).map((_, key) => /* @__PURE__ */ React94.createElement(TimelineItemSkeleton, {
|
8769
8838
|
key
|
8770
8839
|
})));
|
8771
8840
|
Timeline2.Item = TimelineItem;
|
8772
8841
|
Timeline2.Skeleton = TimelineSkeleton;
|
8842
|
+
Timeline2.Skeleton.displayName = "Timeline.Skeleton";
|
8773
8843
|
|
8774
8844
|
// src/utils/table/useTableSelect.ts
|
8775
|
-
import
|
8845
|
+
import React95 from "react";
|
8776
8846
|
var useTableSelect = (data, { key }) => {
|
8777
|
-
const [selected, setSelected] =
|
8847
|
+
const [selected, setSelected] = React95.useState([]);
|
8778
8848
|
const allSelected = selected.length === data.length;
|
8779
8849
|
const isSelected = (dot) => selected.includes(dot[key]);
|
8780
8850
|
const selectAll = () => setSelected(data.map((dot) => dot[key]));
|
@@ -9002,6 +9072,8 @@ export {
|
|
9002
9072
|
InputBase,
|
9003
9073
|
Label,
|
9004
9074
|
LabelControl,
|
9075
|
+
LineClamp,
|
9076
|
+
Link2 as Link,
|
9005
9077
|
List,
|
9006
9078
|
ListItem,
|
9007
9079
|
Modal2 as Modal,
|