bianic-ui 1.13.0 → 1.13.2
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/cjs/index.js +18 -12
- package/dist/cjs/lib.css +1 -1
- package/dist/cjs/types/components/Menu/MenuContainer.d.ts +1 -0
- package/dist/cjs/types/components/Menu/MenuItem.d.ts +2 -1
- package/dist/esm/index.js +18 -12
- package/dist/esm/lib.css +1 -1
- package/dist/esm/types/components/Menu/MenuContainer.d.ts +1 -0
- package/dist/esm/types/components/Menu/MenuItem.d.ts +2 -1
- package/dist/index.d.ts +3 -1
- package/package.json +1 -1
package/dist/cjs/index.js
CHANGED
|
@@ -1523,10 +1523,11 @@ var ContextualButton = function (_a) {
|
|
|
1523
1523
|
: 'text-primary-white'
|
|
1524
1524
|
: textColorConfig[variant];
|
|
1525
1525
|
var stateColor = stateColorConfig[isSelected ? 'selected' : 'default'];
|
|
1526
|
-
return (React.createElement("button", __assign({ className: "contextual-button box-border flex flex-row items-center rounded-radius-sm border border-transparent p-[1px] outline-none ".concat(stateColor, " ").concat(textColor) }, props, { disabled: disabled }),
|
|
1526
|
+
return (React.createElement("button", __assign({ className: "bianic-contextual-button box-border flex flex-row items-center rounded-radius-sm border border-transparent p-[1px] outline-none ".concat(stateColor, " ").concat(textColor) }, props, { disabled: disabled }),
|
|
1527
1527
|
icon,
|
|
1528
|
-
label && (React.createElement("div", { className: "label max-h-[46px] px-[5px] text-[12px] leading-none" },
|
|
1529
|
-
|
|
1528
|
+
label && (React.createElement("div", { className: "label flex max-h-[46px] items-center px-[5px] text-[12px] leading-none" },
|
|
1529
|
+
React.createElement("span", { className: "mr-0.5" }, label),
|
|
1530
|
+
actionElement))));
|
|
1530
1531
|
};
|
|
1531
1532
|
|
|
1532
1533
|
function Color() {
|
|
@@ -1657,7 +1658,7 @@ var FileTree = function (_a) {
|
|
|
1657
1658
|
var _b = useDetectOutsideClick(popupRef, false), isOpenContMenu = _b[0], setIsOpenContMenu = _b[1];
|
|
1658
1659
|
var _c = React.useState({ x: 0, y: 0 }), contMenuPosition = _c[0], setContMenuPosition = _c[1];
|
|
1659
1660
|
var menuStyle = {
|
|
1660
|
-
position: '
|
|
1661
|
+
position: 'fixed',
|
|
1661
1662
|
top: "".concat(contMenuPosition.y, "px"),
|
|
1662
1663
|
left: "".concat(contMenuPosition.x, "px"),
|
|
1663
1664
|
// Pastikan z-index cukup tinggi agar muncul di atas elemen lain
|
|
@@ -1672,9 +1673,12 @@ var FileTree = function (_a) {
|
|
|
1672
1673
|
var label = _a.label, nodes = _a.nodes, props = __rest(_a, ["label", "nodes"]);
|
|
1673
1674
|
return (React.createElement(TreeItem, __assign({ label: label, nodes: nodes, key: index, color: color, chevronColor: chevronColor, handleRightClick: handleRightClick, onMouseDownTreeItem: onMouseDown }, props)));
|
|
1674
1675
|
}),
|
|
1675
|
-
isOpenContMenu && (React.createElement("div", { style: menuStyle, ref: popupRef, className: "bianic-filetree-contextmenu
|
|
1676
|
+
isOpenContMenu && (React.createElement("div", { style: menuStyle, ref: popupRef, className: "bianic-filetree-contextmenu" }, React.isValidElement(contextMenu)
|
|
1676
1677
|
? // Kirimkan handleItemClick sebagai props onClick ke setiap MenuItem
|
|
1677
|
-
React.cloneElement(contextMenu, {
|
|
1678
|
+
React.cloneElement(contextMenu, {
|
|
1679
|
+
isWithOverlay: false,
|
|
1680
|
+
onClickItem: function () { return setIsOpenContMenu(false); },
|
|
1681
|
+
})
|
|
1678
1682
|
: contextMenu))));
|
|
1679
1683
|
};
|
|
1680
1684
|
var TreeItem = function (_a) {
|
|
@@ -1723,7 +1727,7 @@ var TreeItem = function (_a) {
|
|
|
1723
1727
|
};
|
|
1724
1728
|
|
|
1725
1729
|
var MenuContainer = React.forwardRef(function MenuContainer(propsComp, ref) {
|
|
1726
|
-
var _a = propsComp.isTopFlat, isTopFlat = _a === void 0 ? false : _a, children = propsComp.children, _b = propsComp.open, open = _b === void 0 ? true : _b, _c = propsComp.onClose, onClose = _c === void 0 ? function () { } : _c, _d = propsComp.className, className = _d === void 0 ? '' : _d, _e = propsComp.isWithOverlay, isWithOverlay = _e === void 0 ? true : _e, _f = propsComp.zIndex, zIndex = _f === void 0 ? 100 : _f, restProps = __rest(propsComp, ["isTopFlat", "children", "open", "onClose", "className", "isWithOverlay", "zIndex"]);
|
|
1730
|
+
var _a = propsComp.isTopFlat, isTopFlat = _a === void 0 ? false : _a, children = propsComp.children, _b = propsComp.open, open = _b === void 0 ? true : _b, _c = propsComp.onClose, onClose = _c === void 0 ? function () { } : _c, _d = propsComp.className, className = _d === void 0 ? '' : _d, _e = propsComp.isWithOverlay, isWithOverlay = _e === void 0 ? true : _e, _f = propsComp.zIndex, zIndex = _f === void 0 ? 100 : _f, _g = propsComp.onClickItem, onClickItem = _g === void 0 ? function () { } : _g, restProps = __rest(propsComp, ["isTopFlat", "children", "open", "onClose", "className", "isWithOverlay", "zIndex", "onClickItem"]);
|
|
1727
1731
|
var radiusClass = "rounded-b-radius-sm ".concat(!isTopFlat && 'rounded-t-radius-sm');
|
|
1728
1732
|
return (open && (React.createElement(React.Fragment, null,
|
|
1729
1733
|
isWithOverlay && (React.createElement("div", { className: "bianic-menu-overlay fixed left-0 top-0 z-0 h-screen w-screen", onClick: function () { return onClose(); }, style: { zIndex: zIndex } })),
|
|
@@ -1735,6 +1739,7 @@ var MenuContainer = React.forwardRef(function MenuContainer(propsComp, ref) {
|
|
|
1735
1739
|
React.cloneElement(child, {
|
|
1736
1740
|
onClose: function () { return onClose(); },
|
|
1737
1741
|
zIndex: zIndex + 10,
|
|
1742
|
+
inheritedOnClick: function () { return onClickItem(); },
|
|
1738
1743
|
})
|
|
1739
1744
|
: child;
|
|
1740
1745
|
})))));
|
|
@@ -1744,9 +1749,9 @@ MenuContainer.defaultProps = {
|
|
|
1744
1749
|
};
|
|
1745
1750
|
|
|
1746
1751
|
function MenuItem(_a) {
|
|
1747
|
-
var _b = _a.className, className = _b === void 0 ? '' : _b, label = _a.label, _c = _a.onClick, onClick = _c === void 0 ? function () { } : _c, _d = _a.caption, caption = _d === void 0 ? undefined : _d, _e = _a.isChecked, isChecked = _e === void 0 ? undefined : _e, _f = _a.onClose, onClose = _f === void 0 ? function () { } : _f, children = _a.children, _g = _a.zIndex, zIndex = _g === void 0 ? 100 : _g, props = __rest(_a, ["className", "label", "onClick", "caption", "isChecked", "onClose", "children", "zIndex"]);
|
|
1748
|
-
var
|
|
1749
|
-
var
|
|
1752
|
+
var _b = _a.className, className = _b === void 0 ? '' : _b, label = _a.label, _c = _a.onClick, onClick = _c === void 0 ? function () { } : _c, _d = _a.caption, caption = _d === void 0 ? undefined : _d, _e = _a.isChecked, isChecked = _e === void 0 ? undefined : _e, _f = _a.onClose, onClose = _f === void 0 ? function () { } : _f, children = _a.children, _g = _a.zIndex, zIndex = _g === void 0 ? 100 : _g, _h = _a.inheritedOnClick, inheritedOnClick = _h === void 0 ? function () { } : _h, props = __rest(_a, ["className", "label", "onClick", "caption", "isChecked", "onClose", "children", "zIndex", "inheritedOnClick"]);
|
|
1753
|
+
var _j = React.useState(false), isHovered = _j[0], setIsHovered = _j[1];
|
|
1754
|
+
var _k = React.useState(false), isLeft = _k[0], setIsLeft = _k[1];
|
|
1750
1755
|
var isWithChecked = isChecked !== undefined;
|
|
1751
1756
|
var leftPadding = isWithChecked ? 'pl-[5px]' : 'pl-[10px]';
|
|
1752
1757
|
var rightPadding = caption || children ? 'pr-[5px]' : 'pr-[10px]';
|
|
@@ -1771,6 +1776,7 @@ function MenuItem(_a) {
|
|
|
1771
1776
|
var currentZIndex = zIndex + 10;
|
|
1772
1777
|
return (React.createElement("div", { className: "group/main relative cursor-pointer first:rounded-t-radius-sm first:pt-[6px] last:rounded-b-radius-sm last:pb-[6px]", onMouseEnter: function () { return setIsHovered(true); }, onMouseLeave: function () { return setIsHovered(false); } },
|
|
1773
1778
|
React.createElement("div", __assign({ className: "relative flex items-center py-[5px] hover:bg-bia-blue-pastel ".concat(itemClass), role: "button", tabIndex: 0, onClick: function (e) {
|
|
1779
|
+
inheritedOnClick();
|
|
1774
1780
|
onClick(e);
|
|
1775
1781
|
}, onKeyDown: function () { }, style: {
|
|
1776
1782
|
zIndex: isHovered ? currentZIndex : currentZIndex + 15,
|
|
@@ -1780,7 +1786,7 @@ function MenuItem(_a) {
|
|
|
1780
1786
|
React.createElement("div", { className: "ml-auto flex items-center" },
|
|
1781
1787
|
children && (React.createElement(TbChevronRight, { className: "ml-[10px] text-bia-coolgrey" })),
|
|
1782
1788
|
children === undefined && caption && (React.createElement("span", { className: "ml-[30px] whitespace-nowrap text-[11px] text-bia-coolgrey" }, caption)))),
|
|
1783
|
-
children && (React.createElement(MenuContainer, { open: isHovered, onClose: onClose, className: "absolute top-0 bg-primary-white shadow-[0px_3px_20px_0px_rgba(0,0,0,0.20)] group-first/main:top-[6px] ".concat(translateClass), ref: MenuContRef, zIndex: currentZIndex + 10 }, children))));
|
|
1789
|
+
children && (React.createElement(MenuContainer, { open: isHovered, onClose: onClose, className: "absolute top-0 bg-primary-white shadow-[0px_3px_20px_0px_rgba(0,0,0,0.20)] group-first/main:top-[6px] ".concat(translateClass), ref: MenuContRef, zIndex: currentZIndex + 10, onClickItem: function () { return inheritedOnClick(); } }, children))));
|
|
1784
1790
|
}
|
|
1785
1791
|
MenuItem.defaultProps = {
|
|
1786
1792
|
className: '',
|
|
@@ -2352,7 +2358,7 @@ function LiveSearch(_a) {
|
|
|
2352
2358
|
setIsDropUp(false);
|
|
2353
2359
|
}
|
|
2354
2360
|
}, [isOpen]);
|
|
2355
|
-
var filteredOptions = options.filter(function (item) {
|
|
2361
|
+
var filteredOptions = options === null || options === void 0 ? void 0 : options.filter(function (item) {
|
|
2356
2362
|
return item.label.toLowerCase().includes(value.label.toLowerCase());
|
|
2357
2363
|
});
|
|
2358
2364
|
var handleInputChange = function (e) {
|