@pisell/materials 6.11.17 → 6.11.18

package/lib/components/pisellHierarchicalSummaryList/PisellHierarchicalSummaryList.less

@@ -0,0 +1,129 @@
+/**
+ * PisellHierarchicalSummaryList 组件样式
+ * 布局与结构在此定义；行内文案/颜色/字重等可由 levelConfig（labelTextStyle / valueTextStyle / metaTextStyle）
+ * 通过 Row 内联样式覆盖，便于上层 1:1 复刻设计稿。
+ */
+
+@prefix: pisell-hierarchical-summary-list;
+
+.@{prefix} {
+  width: 100%;
+  background: #fff;
+  padding: 20px;
+
+  /* 标题栏（L1/L2）上下 20px，展开后下边距 16px，由 Row 内联 style 控制 */
+
+  &-node {
+    &:first-child {
+      margin-top: 0 !important;
+    }
+  }
+
+  &-row {
+    display: flex;
+    align-items: center;
+    justify-content: space-between;
+    gap: 8px;
+    width: 100%;
+  }
+
+  &-row-expandable {
+    cursor: pointer;
+  }
+
+  &-row-left {
+    display: flex;
+    align-items: center;
+    gap: 8px;
+    min-width: 0;
+    flex: 1;
+  }
+
+  /* 默认样式，可由 levelConfig.labelTextStyle 覆盖；flex: 0 0 auto 使 itemsCount 紧挨标题左侧而非靠右 */
+
+  &-row-label {
+    flex: 0 0 auto;
+    min-width: 0;
+    color: #1b1b1b;
+    font-size: 16px;
+    line-height: 24px;
+    font-weight: 700;
+    white-space: normal;
+    word-break: break-word;
+  }
+
+  &-row-meta {
+    display: inline-flex;
+    align-items: center;
+    gap: 4px;
+    flex-shrink: 0;
+  }
+
+  /* 默认样式，可由 levelConfig.metaTextStyle 覆盖；itemsCount 等 meta 文案颜色 #667085 */
+
+  &-row-dot,
+  &-row-items-count,
+  &-row-info {
+    color: #667085;
+    font-size: 16px;
+    line-height: 24px;
+  }
+
+  &-row-items-count {
+    font-weight: 400;
+    white-space: nowrap;
+  }
+
+  /* 子项列表左侧圆点（level 3+），颜色与 meta 一致 */
+
+  &-row-bullet {
+    display: inline-flex;
+    align-items: center;
+    justify-content: center;
+    flex-shrink: 0;
+    line-height: 24px;
+  }
+
+  &-row-info {
+    display: inline-flex;
+    align-items: center;
+    justify-content: center;
+    line-height: 1;
+  }
+
+  &-row-right {
+    display: inline-flex;
+    align-items: center;
+    justify-content: flex-end;
+    gap: 6px;
+    flex-shrink: 0;
+    white-space: nowrap;
+  }
+
+  /* 默认样式，可由 levelConfig.valueTextStyle 覆盖 */
+
+  &-row-value {
+    color: #1b1b1b;
+    font-size: 16px;
+    line-height: 24px;
+    font-weight: 700;
+  }
+
+  &-row-extra {
+    display: inline-flex;
+    align-items: center;
+  }
+
+  &-row-expand-icon {
+    display: inline-flex;
+    align-items: center;
+    justify-content: center;
+    width: 24px;
+    height: 24px;
+  }
+
+  &-children {
+    width: 100%;
+  }
+}
+

package/lib/components/pisellHierarchicalSummaryList/PisellHierarchicalSummaryList.stories.d.ts

@@ -0,0 +1,10 @@
+import type { Meta, StoryObj } from '@storybook/react';
+import { PisellHierarchicalSummaryList } from './PisellHierarchicalSummaryList';
+declare const meta: Meta<typeof PisellHierarchicalSummaryList>;
+export default meta;
+declare type Story = StoryObj<typeof PisellHierarchicalSummaryList>;
+export declare const Default: Story;
+export declare const Accordion: Story;
+export declare const MaxExpandLevel: Story;
+export declare const AggregateSum: Story;
+export declare const FullFeatured: Story;

package/lib/components/pisellHierarchicalSummaryList/PisellHierarchicalSummaryList.stories.js

@@ -0,0 +1,185 @@
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/components/pisellHierarchicalSummaryList/PisellHierarchicalSummaryList.stories.tsx
+var PisellHierarchicalSummaryList_stories_exports = {};
+__export(PisellHierarchicalSummaryList_stories_exports, {
+  Accordion: () => Accordion,
+  AggregateSum: () => AggregateSum,
+  Default: () => Default,
+  FullFeatured: () => FullFeatured,
+  MaxExpandLevel: () => MaxExpandLevel,
+  default: () => PisellHierarchicalSummaryList_stories_default
+});
+module.exports = __toCommonJS(PisellHierarchicalSummaryList_stories_exports);
+var import_react = __toESM(require("react"));
+var import_PisellHierarchicalSummaryList = require("./PisellHierarchicalSummaryList");
+var demoItems = [
+  {
+    key: "l1",
+    label: "Label",
+    value: /* @__PURE__ */ import_react.default.createElement("span", { style: { color: "#1570EF" } }, "Value"),
+    children: [
+      {
+        key: "l2",
+        label: "Label",
+        value: "Value",
+        children: [
+          { key: "l3-1", label: "Label", itemsCount: "N items", value: "Value" },
+          { key: "l3-2", label: "Label", infoTooltip: "Tooltip", value: "Value" },
+          { key: "l3-3", label: "Label", value: "Value" },
+          {
+            key: "l3-4",
+            label: "Label",
+            itemsCount: "2 items",
+            value: "Value",
+            children: [
+              { key: "l4-1", label: /* @__PURE__ */ import_react.default.createElement("span", { style: { color: "#667085" } }, "• Label"), value: /* @__PURE__ */ import_react.default.createElement("span", { style: { color: "#667085" } }, "Value") },
+              { key: "l4-2", label: /* @__PURE__ */ import_react.default.createElement("span", { style: { color: "#667085" } }, "• Label"), value: /* @__PURE__ */ import_react.default.createElement("span", { style: { color: "#667085" } }, "Value") }
+            ]
+          }
+        ]
+      }
+    ]
+  }
+];
+var meta = {
+  title: "Data Display/PisellHierarchicalSummaryList",
+  component: import_PisellHierarchicalSummaryList.PisellHierarchicalSummaryList,
+  tags: ["autodocs"],
+  argTypes: {
+    defaultExpandedLevel: { control: "number", description: "默认展开层级（非受控初始化）" },
+    accordion: { control: "boolean", description: "手风琴模式（同级仅一个展开）" },
+    maxRenderLevel: { control: "number", description: "最大渲染层级" },
+    maxExpandLevel: { control: "number", description: "最大可展开层级" },
+    indent: { control: "number", description: "缩进（px）" },
+    rowGap: { control: "number", description: "行间距（px）" }
+  }
+};
+var PisellHierarchicalSummaryList_stories_default = meta;
+var Default = {
+  args: {
+    items: demoItems,
+    defaultExpandedLevel: 2
+  }
+};
+var Accordion = {
+  args: {
+    items: demoItems,
+    defaultExpandedLevel: 3,
+    accordion: true
+  }
+};
+var MaxExpandLevel = {
+  args: {
+    items: demoItems,
+    defaultExpandedLevel: 5,
+    maxExpandLevel: 2
+  }
+};
+var AggregateSum = {
+  args: {
+    items: [
+      {
+        key: "sum-root",
+        label: "Total",
+        children: [
+          { key: "a", label: "A", value: 10 },
+          { key: "b", label: "B", value: 20 },
+          { key: "c", label: "C", value: 5, children: [{ key: "c-1", label: "C-1", value: 2 }] }
+        ]
+      }
+    ],
+    defaultExpandedLevel: 2,
+    aggregate: {
+      mode: "sum",
+      format: (sum) => `$${sum}`
+    }
+  }
+};
+var FullFeatured = {
+  args: {
+    items: demoItems,
+    defaultExpandedLevel: 3,
+    accordion: false,
+    maxRenderLevel: 4,
+    maxExpandLevel: 3,
+    indent: 16,
+    rowGap: 8,
+    levelConfig: {
+      1: {
+        rowStyle: { background: "#F5F5F5", padding: "8px 12px", borderRadius: 8 },
+        labelTextStyle: { fontWeight: 700 },
+        valueTextStyle: { color: "#1570EF", fontWeight: 700 }
+      },
+      2: {
+        rowStyle: { padding: "4px 8px" },
+        labelTextStyle: { fontWeight: 600 },
+        showDotSeparator: true
+      },
+      3: {
+        rowStyle: { padding: "2px 8px" },
+        labelTextStyle: { color: "#1B1B1B", fontWeight: 500 },
+        valueTextStyle: { color: "#1B1B1B", fontWeight: 500 }
+      },
+      4: {
+        rowStyle: { paddingLeft: 0 },
+        labelTextStyle: { color: "#667085", fontWeight: 400 },
+        valueTextStyle: { color: "#667085", fontWeight: 400 }
+      }
+    },
+    aggregate: {
+      mode: "sum",
+      getNumberValue: (item) => {
+        if (typeof item.value === "number") return item.value;
+        return null;
+      },
+      format: (sum, { level }) => level === 1 ? `Total $${sum}` : `$${sum}`
+    },
+    renderLabel: (item, ctx) => {
+      if (ctx.level === 1) {
+        return /* @__PURE__ */ import_react.default.createElement("span", null, item.label, " ", item.itemsCount ? /* @__PURE__ */ import_react.default.createElement("span", { style: { color: "#667085", marginLeft: 4 } }, item.itemsCount) : null);
+      }
+      return item.label;
+    },
+    renderValue: (item, ctx) => {
+      if (ctx.aggregatedValue !== void 0) {
+        return ctx.aggregatedValue;
+      }
+      return item.value ?? "—";
+    }
+  }
+};
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  Accordion,
+  AggregateSum,
+  Default,
+  FullFeatured,
+  MaxExpandLevel
+});

package/lib/components/pisellHierarchicalSummaryList/components/Row.d.ts

@@ -0,0 +1,35 @@
+import React from 'react';
+import type { PisellHierarchicalSummaryListAggregateConfig, PisellHierarchicalSummaryListItem, PisellHierarchicalSummaryListKey, PisellHierarchicalSummaryListLevelConfig, PisellHierarchicalSummaryListRenderContext } from '../types';
+export interface RowProps {
+    prefixCls: string;
+    item: PisellHierarchicalSummaryListItem;
+    level: number;
+    index: number;
+    parentPathKeys: PisellHierarchicalSummaryListKey[];
+    expandedKeySet: ReadonlySet<PisellHierarchicalSummaryListKey>;
+    toggleExpanded: (key: PisellHierarchicalSummaryListKey, options?: {
+        siblingKeys?: PisellHierarchicalSummaryListKey[];
+    }) => void;
+    getKey: (item: PisellHierarchicalSummaryListItem, ctx: {
+        level: number;
+        index: number;
+        parentPathKeys: PisellHierarchicalSummaryListKey[];
+    }) => PisellHierarchicalSummaryListKey;
+    levelConfig?: Record<number, PisellHierarchicalSummaryListLevelConfig>;
+    indent: number;
+    rowGap: number;
+    gaps?: {
+        row?: number;
+        rowLeft?: number;
+        meta?: number;
+        rowRight?: number;
+    };
+    maxRenderLevel?: number;
+    maxExpandLevel?: number;
+    aggregate?: PisellHierarchicalSummaryListAggregateConfig;
+    renderLabel?: (item: PisellHierarchicalSummaryListItem, ctx: PisellHierarchicalSummaryListRenderContext) => React.ReactNode;
+    renderValue?: (item: PisellHierarchicalSummaryListItem, ctx: PisellHierarchicalSummaryListRenderContext) => React.ReactNode;
+    /** 父行是否带有 itemsCount（仅此类子项显示圆点 + #667085，其他保持黑色） */
+    parentHasItemsCount?: boolean;
+}
+export declare const Row: React.FC<RowProps>;

package/lib/components/pisellHierarchicalSummaryList/components/Row.js

@@ -0,0 +1,343 @@
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/components/pisellHierarchicalSummaryList/components/Row.tsx
+var Row_exports = {};
+__export(Row_exports, {
+  Row: () => Row
+});
+module.exports = __toCommonJS(Row_exports);
+var import_react = __toESM(require("react"));
+var import_antd = require("antd");
+var import_icons = require("@ant-design/icons");
+var import_classnames = __toESM(require("classnames"));
+function getLevelCfg(levelConfig, level) {
+  for (let lv = level; lv >= 1; lv--) {
+    const cfg = levelConfig == null ? void 0 : levelConfig[lv];
+    if (cfg) return cfg;
+  }
+  return void 0;
+}
+function normalizeChildren(children) {
+  if (!(children == null ? void 0 : children.length)) return [];
+  return children.filter((c) => !c.hidden).slice().sort((a, b) => (a.order ?? 0) - (b.order ?? 0));
+}
+function defaultGetNumberValue(item) {
+  return typeof item.value === "number" ? item.value : null;
+}
+function aggregateSum(item, getNumberValue) {
+  var _a;
+  const children = normalizeChildren(item.children);
+  if (!children.length) return 0;
+  let sum = 0;
+  for (const child of children) {
+    const self = getNumberValue(child);
+    if (typeof self === "number" && !Number.isNaN(self)) {
+      sum += self;
+    }
+    if ((_a = child.children) == null ? void 0 : _a.length) {
+      sum += aggregateSum(child, getNumberValue);
+    }
+  }
+  return sum;
+}
+var Row = import_react.default.memo((props) => {
+  var _a, _b, _c;
+  const {
+    prefixCls,
+    item,
+    level,
+    index,
+    parentPathKeys,
+    expandedKeySet,
+    toggleExpanded,
+    getKey,
+    levelConfig,
+    indent,
+    rowGap,
+    gaps,
+    maxRenderLevel,
+    maxExpandLevel,
+    aggregate,
+    renderLabel,
+    renderValue,
+    parentHasItemsCount = false
+  } = props;
+  const key = (0, import_react.useMemo)(
+    () => item.key ?? getKey(item, { level, index, parentPathKeys }),
+    [getKey, index, item, level, parentPathKeys]
+  );
+  const pathKeys = (0, import_react.useMemo)(
+    () => [...parentPathKeys, key],
+    [parentPathKeys, key]
+  );
+  const children = (0, import_react.useMemo)(
+    () => normalizeChildren(item.children),
+    [item.children]
+  );
+  const hasExpandedContent = item.expandedContent != null;
+  const canRenderChildren = maxRenderLevel ? level < maxRenderLevel : true;
+  const hasChildren = canRenderChildren && children.length > 0 || hasExpandedContent;
+  const canExpand = hasChildren && (maxExpandLevel ? level < maxExpandLevel : true);
+  const expanded = canExpand && expandedKeySet.has(key);
+  const cfg = getLevelCfg(levelConfig, level);
+  const nextIndent = (cfg == null ? void 0 : cfg.indent) ?? indent;
+  const rowStyleMerged = {
+    ...cfg == null ? void 0 : cfg.rowStyle,
+    ...item.rowStyle
+  };
+  if (level === 1) {
+    rowStyleMerged.paddingTop = 20;
+    rowStyleMerged.paddingBottom = 20;
+  }
+  if (level === 2) {
+    rowStyleMerged.paddingTop = 20;
+    rowStyleMerged.paddingBottom = expanded ? 16 : 20;
+  }
+  const aggregatedValue = (0, import_react.useMemo)(() => {
+    if (item.value !== void 0) return void 0;
+    if (!aggregate || (aggregate.mode ?? "none") === "none") return void 0;
+    if ((aggregate.mode ?? "none") !== "sum") return void 0;
+    const sum = aggregateSum(
+      item,
+      aggregate.getNumberValue ?? defaultGetNumberValue
+    );
+    return aggregate.format ? aggregate.format(sum, { item, level }) : sum;
+  }, [aggregate, item, level]);
+  const ctx = (0, import_react.useMemo)(
+    () => ({
+      level,
+      pathKeys,
+      expanded,
+      hasChildren,
+      aggregatedValue
+    }),
+    [aggregatedValue, expanded, hasChildren, level, pathKeys]
+  );
+  const siblingKeys = (0, import_react.useMemo)(
+    () => hasExpandedContent ? [] : children.map(
+      (c, i) => c.key ?? getKey(c, {
+        level: level + 1,
+        index: i,
+        parentPathKeys: pathKeys
+      })
+    ),
+    [children, getKey, hasExpandedContent, level, pathKeys]
+  );
+  const onToggle = (0, import_react.useCallback)(() => {
+    if (!canExpand) return;
+    toggleExpanded(key, { siblingKeys });
+  }, [canExpand, key, siblingKeys, toggleExpanded]);
+  const left = renderLabel ? renderLabel(item, ctx) : item.label;
+  const right = renderValue ? renderValue(item, ctx) : aggregatedValue ?? item.value;
+  const showDotSeparator = (cfg == null ? void 0 : cfg.showDotSeparator) ?? true;
+  const showItemsCount = item.itemsCount !== void 0 && item.itemsCount !== null;
+  const showInfo = item.infoTooltip !== void 0 && item.infoTooltip !== null;
+  const metaStyle = cfg == null ? void 0 : cfg.metaTextStyle;
+  const infoIconStyleObj = (cfg == null ? void 0 : cfg.infoIconStyle) != null ? {
+    fontSize: cfg.infoIconStyle.size,
+    color: cfg.infoIconStyle.color,
+    width: cfg.infoIconStyle.width ?? cfg.infoIconStyle.size ?? 16,
+    height: cfg.infoIconStyle.height ?? cfg.infoIconStyle.size ?? 16,
+    display: "inline-flex",
+    alignItems: "center",
+    justifyContent: "center"
+  } : showInfo ? {
+    fontSize: 16,
+    width: 16,
+    height: 16,
+    display: "inline-flex",
+    alignItems: "center",
+    justifyContent: "center"
+  } : void 0;
+  const leftMeta = (showItemsCount || showInfo) && /* @__PURE__ */ import_react.default.createElement(
+    "span",
+    {
+      className: `${prefixCls}-row-meta`,
+      style: {
+        ...metaStyle,
+        ...(gaps == null ? void 0 : gaps.meta) !== void 0 ? { gap: gaps.meta } : void 0
+      }
+    },
+    showItemsCount ? /* @__PURE__ */ import_react.default.createElement("span", { className: `${prefixCls}-row-items-count`, style: metaStyle }, item.itemsCount) : null,
+    showInfo ? /* @__PURE__ */ import_react.default.createElement(import_antd.Tooltip, { title: item.infoTooltip }, /* @__PURE__ */ import_react.default.createElement(
+      "span",
+      {
+        className: `${prefixCls}-row-info`,
+        "aria-label": "info",
+        style: infoIconStyleObj
+      },
+      /* @__PURE__ */ import_react.default.createElement(import_icons.QuestionCircleOutlined, null)
+    )) : null
+  );
+  const isTitleRow = level <= 2;
+  const nodeStyle = {
+    ...isTitleRow ? expanded ? { paddingBottom: 20 } : {} : { marginTop: rowGap },
+    ...level === 2 ? { paddingLeft: 20, paddingRight: 20 } : {},
+    ...level === 2 && ((_a = cfg == null ? void 0 : cfg.divider) == null ? void 0 : _a.show) ? {
+      borderTop: `1px ${cfg.divider.style ?? "solid"} ${cfg.divider.color ?? "#D0D5DD"}`
+    } : {}
+  };
+  const isGroupOnly = hasChildren && (item.label === "" || item.label === null || item.label === void 0) && item.value === void 0;
+  if (isGroupOnly) {
+    return /* @__PURE__ */ import_react.default.createElement(import_react.default.Fragment, null, children.map((child, childIndex) => /* @__PURE__ */ import_react.default.createElement(
+      Row,
+      {
+        key: child.key ?? getKey(child, {
+          level,
+          index: childIndex,
+          parentPathKeys: pathKeys
+        }),
+        ...props,
+        item: child,
+        level,
+        index: childIndex,
+        parentPathKeys: pathKeys
+      }
+    )));
+  }
+  return /* @__PURE__ */ import_react.default.createElement("div", { className: `${prefixCls}-node`, style: nodeStyle }, /* @__PURE__ */ import_react.default.createElement(
+    "div",
+    {
+      className: (0, import_classnames.default)(
+        `${prefixCls}-row`,
+        cfg == null ? void 0 : cfg.rowClassName,
+        item.rowClassName,
+        {
+          [`${prefixCls}-row-expandable`]: canExpand,
+          [`${prefixCls}-row-expanded`]: expanded
+        }
+      ),
+      style: {
+        ...rowStyleMerged,
+        ...(gaps == null ? void 0 : gaps.row) !== void 0 ? { gap: gaps.row } : void 0
+      },
+      onClick: onToggle,
+      role: canExpand ? "button" : void 0,
+      tabIndex: canExpand ? 0 : void 0,
+      onKeyDown: (e) => {
+        if (!canExpand) return;
+        if (e.key === "Enter" || e.key === " ") {
+          e.preventDefault();
+          onToggle();
+        }
+      }
+    },
+    /* @__PURE__ */ import_react.default.createElement(
+      "div",
+      {
+        className: `${prefixCls}-row-left`,
+        style: (gaps == null ? void 0 : gaps.rowLeft) !== void 0 ? { gap: gaps.rowLeft } : void 0
+      },
+      parentHasItemsCount && !showItemsCount ? /* @__PURE__ */ import_react.default.createElement(
+        "span",
+        {
+          className: `${prefixCls}-row-bullet`,
+          style: { color: "#667085", flexShrink: 0 },
+          "aria-hidden": true
+        },
+        "•"
+      ) : null,
+      /* @__PURE__ */ import_react.default.createElement(
+        "span",
+        {
+          className: `${prefixCls}-row-label`,
+          style: parentHasItemsCount ? { ...cfg == null ? void 0 : cfg.labelTextStyle, color: "#667085", fontWeight: 400 } : cfg == null ? void 0 : cfg.labelTextStyle,
+          title: typeof item.label === "string" ? item.label : void 0
+        },
+        left
+      ),
+      leftMeta,
+      /* @__PURE__ */ import_react.default.createElement("span", { style: { flex: 1, minWidth: 0 }, "aria-hidden": true })
+    ),
+    /* @__PURE__ */ import_react.default.createElement(
+      "div",
+      {
+        className: `${prefixCls}-row-right`,
+        style: (gaps == null ? void 0 : gaps.rowRight) !== void 0 ? { gap: gaps.rowRight } : void 0
+      },
+      /* @__PURE__ */ import_react.default.createElement(
+        "span",
+        {
+          className: `${prefixCls}-row-value`,
+          style: parentHasItemsCount ? { ...cfg == null ? void 0 : cfg.valueTextStyle, color: "#667085", fontWeight: 400 } : cfg == null ? void 0 : cfg.valueTextStyle
+        },
+        right
+      ),
+      item.extra ? /* @__PURE__ */ import_react.default.createElement("span", { className: `${prefixCls}-row-extra` }, item.extra) : null,
+      canExpand ? /* @__PURE__ */ import_react.default.createElement(
+        "span",
+        {
+          className: `${prefixCls}-row-expand-icon`,
+          "aria-label": expanded ? "collapse" : "expand",
+          style: (cfg == null ? void 0 : cfg.expandIconStyle) ? {
+            width: cfg.expandIconStyle.width ?? cfg.expandIconStyle.size ?? 24,
+            height: cfg.expandIconStyle.height ?? cfg.expandIconStyle.size ?? 24
+          } : void 0
+        },
+        /* @__PURE__ */ import_react.default.createElement(
+          import_icons.UpOutlined,
+          {
+            style: {
+              transform: expanded ? "rotate(0deg)" : "rotate(180deg)",
+              ...((_b = cfg == null ? void 0 : cfg.expandIconStyle) == null ? void 0 : _b.color) ? { color: cfg.expandIconStyle.color } : null,
+              ...((_c = cfg == null ? void 0 : cfg.expandIconStyle) == null ? void 0 : _c.size) ? { fontSize: cfg.expandIconStyle.size } : null
+            }
+          }
+        )
+      ) : null
+    )
+  ), hasChildren && expanded ? /* @__PURE__ */ import_react.default.createElement(
+    "div",
+    {
+      className: `${prefixCls}-children`,
+      style: { paddingLeft: 0, marginTop: 8 }
+    },
+    hasExpandedContent ? item.expandedContent : children.map((child, childIndex) => /* @__PURE__ */ import_react.default.createElement(
+      Row,
+      {
+        key: child.key ?? getKey(child, {
+          level: level + 1,
+          index: childIndex,
+          parentPathKeys: pathKeys
+        }),
+        ...props,
+        item: child,
+        level: level + 1,
+        index: childIndex,
+        parentPathKeys: pathKeys,
+        parentHasItemsCount: showItemsCount || parentHasItemsCount
+      }
+    ))
+  ) : null);
+});
+Row.displayName = "PisellHierarchicalSummaryListRow";
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  Row
+});