react-better-html 1.1.273 → 1.1.275

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/index.d.mts CHANGED
@@ -1091,6 +1091,7 @@ type SideMenuItem = {
1091
1091
  onClick?: (item: SideMenuItem) => void;
1092
1092
  } | {
1093
1093
  type: "divider";
1094
+ shortText?: string;
1094
1095
  });
1095
1096
  type SideMenuProps = {
1096
1097
  items: SideMenuItem[];
package/dist/index.d.ts CHANGED
@@ -1091,6 +1091,7 @@ type SideMenuItem = {
1091
1091
  onClick?: (item: SideMenuItem) => void;
1092
1092
  } | {
1093
1093
  type: "divider";
1094
+ shortText?: string;
1094
1095
  });
1095
1096
  type SideMenuProps = {
1096
1097
  items: SideMenuItem[];
package/dist/index.js CHANGED
@@ -8107,7 +8107,31 @@ var MenuItemTypeItem = (0, import_react31.memo)(function MenuItemTypeItem2({
8107
8107
  });
8108
8108
  var MenuItemTypeDivider = (0, import_react31.memo)(function MenuItemTypeDivider2({ item }) {
8109
8109
  const theme2 = (0, import_react_better_core29.useTheme)();
8110
- return /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(Div_default.row, { paddingTop: theme2.styles.space, paddingInline: theme2.styles.gap, children: /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(Text_default, { fontSize: 12, fontWeight: 700, textTransform: "uppercase", color: theme2.colors.textSecondary, children: item.text }) });
8110
+ const { sideMenuIsCollapsed } = useBetterHtmlContextInternal();
8111
+ const isCollapsed = sideMenuIsCollapsed && !item.shortText;
8112
+ return /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
8113
+ Div_default.row,
8114
+ {
8115
+ maxHeight: !isCollapsed ? 30 : 0,
8116
+ paddingTop: !isCollapsed ? theme2.styles.space : theme2.styles.gap,
8117
+ paddingInline: theme2.styles.gap,
8118
+ overflow: "hidden",
8119
+ transition: `max-height ${theme2.styles.transition}, padding-top ${theme2.styles.transition}`,
8120
+ children: sideMenuIsCollapsed && item.shortText || !sideMenuIsCollapsed ? /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
8121
+ Text_default,
8122
+ {
8123
+ width: "100%",
8124
+ fontSize: 12,
8125
+ fontWeight: 700,
8126
+ textTransform: "uppercase",
8127
+ textAlign: sideMenuIsCollapsed ? "center" : void 0,
8128
+ color: theme2.colors.textSecondary,
8129
+ whiteSpace: "nowrap",
8130
+ children: sideMenuIsCollapsed ? item.shortText : item.text
8131
+ }
8132
+ ) : /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(Divider_default.horizontal, {})
8133
+ }
8134
+ );
8111
8135
  });
8112
8136
  var MenuItemComponent = (0, import_react31.memo)(function MenuItemComponent2({ item, ...props }) {
8113
8137
  return /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(Div_default, { width: "100%", children: item.type === "item" ? /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(MenuItemTypeItem, { item, ...props }) : item.type === "divider" ? /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(MenuItemTypeDivider, { item }) : void 0 });