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 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" }, label)),
1529
- actionElement));
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: 'absolute',
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 absolute z-10" }, React.isValidElement(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, { isWithOverlay: false })
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 _h = React.useState(false), isHovered = _h[0], setIsHovered = _h[1];
1749
- var _j = React.useState(false), isLeft = _j[0], setIsLeft = _j[1];
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) {