react-better-html 1.1.272 → 1.1.274

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.mjs CHANGED
@@ -1535,7 +1535,11 @@ var IconElement = styled3.svg.withConfig({
1535
1535
  var Icon = forwardRef4(function Icon2({ name, size = 16, ...props }, ref) {
1536
1536
  const theme2 = useTheme5();
1537
1537
  const { icons: icons2 } = useBetterCoreContext2();
1538
- const { style, hoverStyle, restProps } = useComponentPropsGrouper(props);
1538
+ const {
1539
+ style: { fill, stroke, strokeColor, ...restStyle },
1540
+ hoverStyle,
1541
+ restProps
1542
+ } = useComponentPropsGrouper(props);
1539
1543
  const dataProps = useComponentPropsWithPrefix(restProps, "data");
1540
1544
  const ariaProps = useComponentPropsWithPrefix(restProps, "aria");
1541
1545
  const svgColor = props.color ?? theme2.colors.textPrimary;
@@ -1556,7 +1560,7 @@ var Icon = forwardRef4(function Icon2({ name, size = 16, ...props }, ref) {
1556
1560
  xmlns: "http://www.w3.org/2000/svg",
1557
1561
  theme: theme2,
1558
1562
  hoverColor: svgHoverColorColor,
1559
- style,
1563
+ style: restStyle,
1560
1564
  hoverStyle,
1561
1565
  ...restProps,
1562
1566
  ...dataProps,
@@ -1567,8 +1571,8 @@ var Icon = forwardRef4(function Icon2({ name, size = 16, ...props }, ref) {
1567
1571
  {
1568
1572
  ...path,
1569
1573
  className: path.type === "fill" ? "react-better-html-icon-path-with-fill" : "react-better-html-icon-path-with-stroke",
1570
- fill: path.type === "fill" ? svgColor : void 0,
1571
- stroke: path.type === "stroke" ? svgColor : void 0,
1574
+ fill: path.type === "fill" ? fill ?? svgColor : void 0,
1575
+ stroke: path.type === "stroke" ? strokeColor ?? stroke ?? svgColor : void 0,
1572
1576
  key: path.d
1573
1577
  }
1574
1578
  ))
@@ -8070,7 +8074,31 @@ var MenuItemTypeItem = memo27(function MenuItemTypeItem2({
8070
8074
  });
8071
8075
  var MenuItemTypeDivider = memo27(function MenuItemTypeDivider2({ item }) {
8072
8076
  const theme2 = useTheme29();
8073
- return /* @__PURE__ */ jsx27(Div_default.row, { paddingTop: theme2.styles.space, paddingInline: theme2.styles.gap, children: /* @__PURE__ */ jsx27(Text_default, { fontSize: 12, fontWeight: 700, textTransform: "uppercase", color: theme2.colors.textSecondary, children: item.text }) });
8077
+ const { sideMenuIsCollapsed } = useBetterHtmlContextInternal();
8078
+ const isCollapsed = sideMenuIsCollapsed && !item.shortText;
8079
+ return /* @__PURE__ */ jsx27(
8080
+ Div_default.row,
8081
+ {
8082
+ maxHeight: !isCollapsed ? 30 : 0,
8083
+ paddingTop: !isCollapsed ? theme2.styles.space : theme2.styles.gap / 2,
8084
+ paddingInline: theme2.styles.gap,
8085
+ overflow: "hidden",
8086
+ transition: `max-height ${theme2.styles.transition}, padding-top ${theme2.styles.transition}`,
8087
+ children: /* @__PURE__ */ jsx27(
8088
+ Text_default,
8089
+ {
8090
+ width: "100%",
8091
+ fontSize: 12,
8092
+ fontWeight: 700,
8093
+ textTransform: "uppercase",
8094
+ textAlign: sideMenuIsCollapsed ? "center" : void 0,
8095
+ color: theme2.colors.textSecondary,
8096
+ whiteSpace: "nowrap",
8097
+ children: sideMenuIsCollapsed ? item.shortText : item.text
8098
+ }
8099
+ )
8100
+ }
8101
+ );
8074
8102
  });
8075
8103
  var MenuItemComponent = memo27(function MenuItemComponent2({ item, ...props }) {
8076
8104
  return /* @__PURE__ */ jsx27(Div_default, { width: "100%", children: item.type === "item" ? /* @__PURE__ */ jsx27(MenuItemTypeItem, { item, ...props }) : item.type === "divider" ? /* @__PURE__ */ jsx27(MenuItemTypeDivider, { item }) : void 0 });