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/pisellRecordBoard/PisellRecordBoard.stories.tsx
var PisellRecordBoard_stories_exports = {};
__export(PisellRecordBoard_stories_exports, {
  CardLayoutPlaceholder: () => CardLayoutPlaceholder,
  CustomComposition: () => CustomComposition,
  CustomFilterSortRender: () => CustomFilterSortRender,
  CustomQuickFilterAndColumnsRender: () => CustomQuickFilterAndColumnsRender,
  Default: () => Default,
  GridLayoutFull: () => GridLayoutFull,
  GridLayoutToolBarSearchInput: () => GridLayoutToolBarSearchInput,
  GridLayoutToolBarSortAndFilter: () => GridLayoutToolBarSortAndFilter,
  GridLayoutWithCollapseUniformColumns: () => GridLayoutWithCollapseUniformColumns,
  GridLayoutWithColumnType: () => GridLayoutWithColumnType,
  GridLayoutWithPisellFindInToolBar: () => GridLayoutWithPisellFindInToolBar,
  GridLayoutWithQuickFilterOnLeft: () => GridLayoutWithQuickFilterOnLeft,
  GridLayoutWithTable: () => GridLayoutWithTable,
  GridLayoutWithUniformCompare: () => GridLayoutWithUniformCompare,
  GridWithMultiplePages: () => GridWithMultiplePages,
  GridWithOnRow: () => GridWithOnRow,
  Placeholder: () => Placeholder,
  SearchAndGridOnly: () => SearchAndGridOnly,
  WithPisellFindSearch: () => WithPisellFindSearch,
  default: () => PisellRecordBoard_stories_default
});
module.exports = __toCommonJS(PisellRecordBoard_stories_exports);
var import_react = __toESM(require("react"));
var import_antd = require("antd");
var import_types = require("../pisellFloorMapLayout/types");
var import_FigmaTableCard = require("../pisellFloorMapLayout/components/FigmaTableCard");
var import_index = __toESM(require("./index"));
var meta = {
  title: "Pro Components/PisellRecordBoard",
  component: import_index.default,
  parameters: {
    layout: "padded",
    docs: {
      description: {
        component: "记录看板容器，提供统一的 data / 分页 / 搜索 / 多选上下文。可选根级 **dataSources** + **gridDataSourceKey**：不传 **data** 时由容器从 `dataSources[key]` 客户端分页推导表格；平面图在 ShellFrame 内合并根级与 `FloorMap` 的 `dataSources` 后传入 PisellFloorMapLayout。ToolBar 左侧可放搜索（PisellFind）与内联快速筛选（toolBar.quickFilter）；右侧为 Sort、PisellFilter、ToolBarReset。多选通过 grid.selectedKeys / grid.selectedRows / grid.onSelectionChange 传入。grid 支持 antd Table 透传（onRow、expandable 等）。**平面图**：`ShellFrame` 内与 `GridLayout` 并列声明 `PisellRecordBoard.FloorMap`。根级 `floorMap` 仍兼容。**平面图模式下底部分页隐藏**。详见 **Default** Story。"
      }
    }
  },
  tags: ["autodocs"],
  argTypes: {
    rowKey: {
      description: "行主键，用于多选与列表",
      control: "text"
    },
    layoutType: {
      description: "布局类型",
      control: "select",
      options: ["grid", "card"]
    }
  }
};
var PisellRecordBoard_stories_default = meta;
var orderStatusList = [
  "pending_pay",
  "paid",
  "shipped",
  "completed",
  "cancelled"
];
var payStatusList = ["unpaid", "paid", "refunded"];
var mockData = Array.from({ length: 30 }, (_, i) => ({
  id: `order-${i + 1}`,
  orderNo: `ORD${String(20240001 + i).padStart(8, "0")}`,
  orderStatus: orderStatusList[i % orderStatusList.length],
  payStatus: payStatusList[i % payStatusList.length],
  amount: 99.9 + i % 15 * 88.5,
  createTime: `2024-01-${String(15 + i % 14).padStart(2, "0")} 10:${String(
    i % 60
  ).padStart(2, "0")}`,
  buyerName: ["张三", "李四", "王五", "赵六", "钱七"][i % 5],
  buyerPhone: `138${String(1e7 + i).padStart(8, "0")}`,
  shipTo: ["北京市朝阳区", "上海市浦东新区", "广州市天河区", "深圳市南山区"][i % 4]
}));
var mockDataMultiplePages = Array.from({ length: 250 }, (_, i) => ({
  id: `order-p${i + 1}`,
  orderNo: `ORD${String(20300001 + i).padStart(8, "0")}`,
  orderStatus: orderStatusList[i % orderStatusList.length],
  payStatus: payStatusList[i % payStatusList.length],
  amount: 99.9 + i % 15 * 88.5,
  createTime: `2024-02-${String(1 + i % 28).padStart(2, "0")} 10:${String(
    i % 60
  ).padStart(2, "0")}`,
  buyerName: ["张三", "李四", "王五", "赵六", "钱七"][i % 5],
  buyerPhone: `139${String(1e7 + i).padStart(8, "0")}`,
  shipTo: ["北京市朝阳区", "上海市浦东新区", "广州市天河区", "深圳市南山区"][i % 4]
}));
var columns = [
  { title: "订单号", dataIndex: "orderNo", key: "orderNo", width: 160 },
  {
    title: "订单状态",
    dataIndex: "orderStatus",
    key: "orderStatus",
    width: 140
  },
  { title: "支付状态", dataIndex: "payStatus", key: "payStatus", width: 140 },
  { title: "订单金额", dataIndex: "amount", key: "amount", width: 110 },
  {
    title: "下单时间",
    dataIndex: "createTime",
    key: "createTime",
    width: 180,
    type: "dateTime",
    fieldProps: { customFormat: "YYYY-MM-DD HH:mm" },
    filterable: true,
    filter: { quickFilter: true }
  },
  { title: "买家", dataIndex: "buyerName", key: "buyerName", width: 100 },
  { title: "手机号", dataIndex: "buyerPhone", key: "buyerPhone", width: 200 },
  { title: "收货地址", dataIndex: "shipTo", key: "shipTo", width: 200 }
];
var columnsWithType = [
  {
    title: "订单号",
    dataIndex: "orderNo",
    key: "orderNo",
    width: 160,
    type: "singleLineText"
  },
  {
    title: "订单状态",
    dataIndex: "orderStatus",
    key: "orderStatus",
    width: 140,
    type: "singleSelect",
    fieldProps: {
      options: [
        { label: "全部", value: "all" },
        { label: "待付款", value: "pending_pay" },
        { label: "已付款", value: "paid" },
        { label: "已发货", value: "shipped" },
        { label: "已完成", value: "completed" },
        { label: "已取消", value: "cancelled" }
      ]
    },
    filterable: true,
    filter: { quickFilter: false }
  },
  {
    title: "支付状态",
    dataIndex: "payStatus",
    key: "payStatus",
    width: 140,
    type: "singleSelect",
    fieldProps: {
      options: [
        { label: "全部", value: "all" },
        { label: "未支付", value: "unpaid" },
        { label: "已支付", value: "paid" },
        { label: "已退款", value: "refunded" }
      ]
    },
    filterable: true,
    filter: { quickFilter: false }
  },
  {
    title: "订单金额",
    dataIndex: "amount",
    key: "amount",
    width: 110,
    type: "currency",
    fieldProps: { precision: 2, currencySymbol: "¥" },
    filterable: true,
    filter: { quickFilter: false }
  },
  {
    title: "下单时间",
    dataIndex: "createTime",
    key: "createTime",
    width: 180,
    type: "dateTime",
    fieldProps: { customFormat: "YYYY-MM-DD HH:mm" },
    filterable: true,
    filter: { quickFilter: true }
  },
  {
    title: "买家",
    dataIndex: "buyerName",
    key: "buyerName",
    width: 100,
    type: "singleLineText",
    fieldProps: { placeholder: "买家" },
    filterable: true,
    filter: { quickFilter: false }
  },
  {
    title: "手机号",
    dataIndex: "buyerPhone",
    key: "buyerPhone",
    width: 200,
    type: "phone"
  },
  {
    title: "收货地址",
    dataIndex: "shipTo",
    key: "shipTo",
    width: 200,
    type: "singleLineText"
  }
];
var customQuickFilterList = [
  {
    type: "rangePickerNew",
    key: "createTime",
    name: "createTime",
    label: "下单时间",
    props: {
      placeholder: ["开始日期", "结束日期"],
      style: { width: 260 }
    },
    other: {}
  }
];
var orderStatusLabel = {
  pending_pay: "待付款",
  paid: "已付款",
  shipped: "已发货",
  completed: "已完成",
  cancelled: "已取消"
};
var payStatusLabel = {
  unpaid: "未支付",
  paid: "已支付",
  refunded: "已退款"
};
var columnsWithCustomRender = [
  {
    title: "订单号",
    dataIndex: "orderNo",
    key: "orderNo",
    width: 160,
    render: (val) => /* @__PURE__ */ import_react.default.createElement("span", { style: { fontWeight: 600 } }, val)
  },
  {
    title: "订单状态",
    dataIndex: "orderStatus",
    key: "orderStatus",
    width: 140,
    render: (val) => /* @__PURE__ */ import_react.default.createElement(
      "span",
      {
        style: {
          padding: "2px 8px",
          borderRadius: 4,
          background: val === "pending_pay" ? "#fff7e6" : val === "paid" ? "#e6f7ff" : val === "shipped" ? "#f6ffed" : val === "completed" ? "#f9f0ff" : "#fff1f0",
          color: val === "pending_pay" ? "#fa8c16" : val === "paid" ? "#1890ff" : val === "shipped" ? "#52c41a" : val === "completed" ? "#722ed1" : "#ff4d4f"
        }
      },
      orderStatusLabel[val] ?? val
    )
  },
  {
    title: "支付状态",
    dataIndex: "payStatus",
    key: "payStatus",
    width: 140,
    render: (val) => /* @__PURE__ */ import_react.default.createElement(
      "span",
      {
        style: {
          padding: "2px 8px",
          borderRadius: 4,
          background: val === "paid" ? "#e6f7ff" : val === "refunded" ? "#fff1f0" : "#fff7e6",
          color: val === "paid" ? "#1890ff" : val === "refunded" ? "#ff4d4f" : "#faad14"
        }
      },
      payStatusLabel[val] ?? val
    )
  },
  {
    title: "订单金额",
    dataIndex: "amount",
    key: "amount",
    width: 110,
    type: "currency",
    fieldProps: { precision: 2, currencySymbol: "¥" }
  },
  {
    title: "下单时间",
    dataIndex: "createTime",
    key: "createTime",
    width: 180,
    type: "dateTime",
    fieldProps: { customFormat: "YYYY-MM-DD HH:mm" }
  },
  { title: "买家", dataIndex: "buyerName", key: "buyerName", width: 100 },
  { title: "收货地址", dataIndex: "shipTo", key: "shipTo", width: 200 }
];
var columnsWithCustomFilterSortRender = [
  {
    title: "订单号",
    dataIndex: "orderNo",
    key: "orderNo",
    width: 160,
    render: (val) => /* @__PURE__ */ import_react.default.createElement("span", { style: { fontWeight: 700, color: "#1890ff" } }, val)
  },
  {
    title: "订单状态",
    dataIndex: "orderStatus",
    key: "orderStatus",
    width: 140,
    filterable: true,
    filter: {
      type: "single",
      quickFilter: false,
      options: [
        { label: "全部", value: "all" },
        { label: "待付款", value: "pending_pay" },
        { label: "已付款", value: "paid" },
        { label: "已发货", value: "shipped" },
        { label: "已完成", value: "completed" },
        { label: "已取消", value: "cancelled" }
      ]
    },
    sortable: true,
    sort: {
      getSortItems: (fieldKey) => [
        { key: `${fieldKey}:asc`, label: "状态 A-Z" },
        { key: `${fieldKey}:desc`, label: "状态 Z-A" }
      ]
    },
    render: (val) => /* @__PURE__ */ import_react.default.createElement(
      "span",
      {
        style: {
          padding: "2px 8px",
          borderRadius: 4,
          background: val === "pending_pay" ? "#fff7e6" : val === "paid" ? "#e6f7ff" : val === "shipped" ? "#f6ffed" : val === "completed" ? "#f9f0ff" : "#fff1f0",
          color: val === "pending_pay" ? "#fa8c16" : val === "paid" ? "#1890ff" : val === "shipped" ? "#52c41a" : val === "completed" ? "#722ed1" : "#ff4d4f"
        }
      },
      orderStatusLabel[val] ?? val
    )
  },
  {
    title: "支付状态",
    dataIndex: "payStatus",
    key: "payStatus",
    width: 140,
    render: (val) => /* @__PURE__ */ import_react.default.createElement(
      "span",
      {
        style: {
          padding: "2px 8px",
          borderRadius: 4,
          background: val === "paid" ? "#e6f7ff" : val === "refunded" ? "#fff1f0" : "#fff7e6",
          color: val === "paid" ? "#1890ff" : val === "refunded" ? "#ff4d4f" : "#faad14"
        }
      },
      payStatusLabel[val] ?? val
    )
  },
  {
    title: "订单金额",
    dataIndex: "amount",
    key: "amount",
    width: 110,
    type: "currency",
    fieldProps: { precision: 2, currencySymbol: "¥" }
  },
  {
    title: "下单时间",
    dataIndex: "createTime",
    key: "createTime",
    width: 180,
    type: "dateTime",
    fieldProps: { customFormat: "YYYY-MM-DD HH:mm" },
    filterable: true,
    filter: {
      type: "rangePickerNew",
      quickFilter: true,
      props: { placeholder: ["开始日期", "结束日期"], style: { width: 260 } }
    }
  },
  {
    title: "买家",
    dataIndex: "buyerName",
    key: "buyerName",
    width: 100,
    render: (val) => /* @__PURE__ */ import_react.default.createElement("span", { style: { fontWeight: 500 } }, val)
  },
  { title: "收货地址", dataIndex: "shipTo", key: "shipTo", width: 200 }
];
function toTimestamp(v) {
  if (v == null) return null;
  if (typeof v === "number" && !Number.isNaN(v)) return v;
  if (v && typeof v.toDate === "function")
    return v.toDate().getTime();
  const s = String(v).trim();
  if (!s) return null;
  const t = Date.parse(s);
  return Number.isNaN(t) ? null : t;
}
function filterDataByCriteria(list, filterValues) {
  if (!filterValues || typeof filterValues !== "object") return list;
  const entries = Object.entries(filterValues).filter(
    ([_, val]) => val !== void 0 && val !== null && val !== "" && val !== "all"
  );
  if (entries.length === 0) return list;
  return list.filter((row) => {
    return entries.every(([key, val]) => {
      if (key === "createTime" && Array.isArray(val) && val.length >= 2) {
        const rowTime = toTimestamp(row.createTime);
        if (rowTime == null) return false;
        const start = toTimestamp(val[0]);
        const end = toTimestamp(val[1]);
        if (start != null && end != null)
          return rowTime >= start && rowTime <= end;
        if (start != null) return rowTime >= start;
        if (end != null) return rowTime <= end;
        return true;
      }
      const cell = row[key];
      if (typeof val === "string") {
        const s = cell != null ? String(cell) : "";
        return s.toLowerCase().includes(val.toLowerCase());
      }
      if (typeof val === "number" || typeof cell === "number") {
        const n = Number(cell);
        const v = Number(val);
        if (Number.isNaN(v)) return true;
        return !Number.isNaN(n) && n === v;
      }
      return cell === val;
    });
  });
}
var FLOOR_MAP_DIM_OPACITY = 0.2;
function recordBoardStoryRowMatchesToolbar(row, searchParams) {
  var _a;
  if (!searchParams) return true;
  const filterValues = (_a = searchParams.filter) == null ? void 0 : _a.values;
  const afterFilter = filterDataByCriteria(
    [row],
    filterValues
  );
  if (afterFilter.length === 0) return false;
  const kw = String(searchParams.keyword ?? "").trim().toLowerCase();
  if (!kw) return true;
  const parts = Object.values(row).filter(
    (v) => v != null && typeof v !== "object"
  );
  return parts.some((v) => String(v).toLowerCase().includes(kw));
}
function sortDataBySortKey(list, sortKey) {
  if (!sortKey || typeof sortKey !== "string") return list;
  const match = sortKey.match(/^([^:]+):(asc|desc)/);
  if (!match) return list;
  const [, field, order] = match;
  return [...list].sort((a, b) => {
    const va = a[field];
    const vb = b[field];
    const cmp = typeof va === "number" && typeof vb === "number" ? va - vb : String(va ?? "").localeCompare(String(vb ?? ""), "zh-CN");
    return order === "asc" ? cmp : -cmp;
  });
}
var RESTAURANT_DS_KEY = "tables";
var CONDIMENT_STATION_DS_KEY = "condimentStations";
function createInitialCondimentStations() {
  return [
    {
      id: "cs1",
      name: "大厅·自助蘸料区",
      status: "正常",
      flavorCount: 12,
      area: "大厅"
    },
    {
      id: "cs2",
      name: "包厢走道补料台",
      status: "需补货",
      flavorCount: 6,
      area: "包厢A",
      note: "辣椒油低于 30%"
    },
    {
      id: "cs3",
      name: "露台·酱料小推位",
      status: "正常",
      flavorCount: 8,
      area: "露台"
    },
    /**
     * 以下记录在初始平面图**无落位**，用于编辑态「蘸料摆台」新建时可选绑定；
     * 若列表与落位一一占满是，工具栏会提示「均已落位，或列表为空」。
     */
    {
      id: "cs4",
      name: "后厨·备用蘸料车",
      status: "正常",
      flavorCount: 4,
      area: "后厨",
      note: "待摆到平面图"
    },
    {
      id: "cs5",
      name: "入口处试味台（筹建）",
      status: "维护中",
      flavorCount: 0,
      area: "门厅"
    }
  ];
}
function getRenderItemByKindCondimentStation(dataSources) {
  return (item) => {
    const merged = item;
    const el = merged._sceneElement;
    const b = el == null ? void 0 : el.dataBinding;
    const titleFromElement = (el == null ? void 0 : el.name) != null && String(el.name).trim() ? String(el.name).trim() : "蘸料摆台";
    const hasCondimentDs = (b == null ? void 0 : b.dataSourceKey) === CONDIMENT_STATION_DS_KEY;
    const condimentRid = (b == null ? void 0 : b.recordId) != null ? String(b.recordId).trim() : "";
    const boundToCondiment = hasCondimentDs && Boolean(condimentRid);
    const list = dataSources[CONDIMENT_STATION_DS_KEY];
    const row = boundToCondiment && list ? list.find((r) => r.id === condimentRid) : void 0;
    const hasLiveRow = Boolean(row);
    const borderColor = hasLiveRow ? row.status === "需补货" ? "#fa8c16" : row.status === "维护中" ? "#8c8c8c" : "#52c41a" : "#bfbfbf";
    const isPlaceholder = !boundToCondiment || !hasLiveRow;
    return /* @__PURE__ */ import_react.default.createElement(
      "div",
      {
        style: {
          width: "100%",
          height: "100%",
          boxSizing: "border-box",
          padding: "8px 10px",
          display: "flex",
          flexDirection: "column",
          justifyContent: "center",
          minHeight: 0,
          fontSize: 11,
          lineHeight: 1.35,
          background: isPlaceholder ? "#fafafa" : "#fff",
          borderRadius: 8,
          border: isPlaceholder ? `2px dashed ${borderColor}` : `2px solid ${borderColor}`,
          boxShadow: isPlaceholder ? "none" : "0 2px 8px rgba(0,0,0,.08)",
          overflow: "hidden"
        }
      },
      /* @__PURE__ */ import_react.default.createElement(
        "div",
        {
          style: {
            fontWeight: 600,
            color: isPlaceholder ? "#595959" : "#262626",
            overflow: "hidden",
            textOverflow: "ellipsis",
            whiteSpace: "nowrap"
          }
        },
        hasLiveRow ? row.name : titleFromElement
      ),
      hasLiveRow ? /* @__PURE__ */ import_react.default.createElement(import_react.default.Fragment, null, /* @__PURE__ */ import_react.default.createElement("div", { style: { color: "#595959", marginTop: 4, flexShrink: 0 } }, row.status), /* @__PURE__ */ import_react.default.createElement("div", { style: { color: "#8c8c8c", marginTop: 4, flexShrink: 0 } }, row.flavorCount ?? "—", " 种蘸料")) : /* @__PURE__ */ import_react.default.createElement(
        "div",
        {
          style: {
            color: "#8c8c8c",
            marginTop: 6,
            flexShrink: 0,
            fontSize: 10
          }
        },
        !hasCondimentDs || !condimentRid ? hasCondimentDs && !condimentRid ? "已选择数据源，请在侧栏选择数据行" : "未绑定数据行：请在侧栏选择数据源与记录" : condimentRid.startsWith("new_") ? "新摆台占位，可在侧栏绑定具体记录" : "未找到对应记录：请检查绑定或数据列表"
      )
    );
  };
}
function createInitialRestaurantTables() {
  return [
    { id: "t1", name: "1号桌", status: "空闲", capacity: 4, area: "大厅" },
    {
      id: "t2",
      name: "2号桌",
      status: "用餐中",
      capacity: 4,
      area: "大厅",
      guests: 3,
      customerName: "王女士"
    },
    {
      id: "t3",
      name: "3号桌",
      status: "已预订",
      capacity: 6,
      area: "大厅",
      reserveTime: "18:30"
    },
    { id: "t4", name: "4号桌", status: "空闲", capacity: 2, area: "露台" },
    {
      id: "t5",
      name: "5号桌",
      status: "用餐中",
      capacity: 8,
      area: "包厢A",
      guests: 6
    },
    { id: "t6", name: "6号桌", status: "空闲", capacity: 4, area: "大厅" },
    { id: "t7", name: "7号桌", status: "已预订", capacity: 2, area: "大厅" },
    { id: "t8", name: "8号桌", status: "空闲", capacity: 4, area: "露台" },
    { id: "r1", name: "圆桌1", status: "空闲", capacity: 6, area: "大厅" }
  ];
}
function createInitialRestaurantFloorMapConfig() {
  return {
    canvases: [{ id: "main", name: "大厅平面图", order: 0, enabled: true }],
    canvasUi: { canCreate: true, canEdit: true },
    elementKindCategories: [
      { id: "background", label: "底图", order: 0 },
      { id: "dining", label: "餐桌", order: 1 },
      { id: "station", label: "摆台", order: 2 },
      { id: "area", label: "区域", order: 3 }
    ],
    elementKinds: [
      {
        value: import_types.FLOOR_MAP_IMAGE_ELEMENT_KIND,
        label: "图片（底图）",
        categoryId: "background",
        dataBindingPolicy: "none",
        showInPalette: true
      },
      {
        value: "table",
        label: "方桌",
        categoryId: "dining",
        dataBindingPolicy: "optional",
        showInPalette: true
      },
      {
        value: "roundTable",
        label: "圆桌",
        categoryId: "dining",
        dataBindingPolicy: "optional",
        defaultShape: "circle",
        showInPalette: true
      },
      {
        value: "condimentStation",
        label: "蘸料摆台",
        categoryId: "station",
        dataBindingPolicy: "optional",
        showInPalette: true
      },
      {
        value: "stage",
        label: "舞台/区域",
        categoryId: "area",
        dataBindingPolicy: "none",
        showInPalette: true
      }
    ],
    /**
     * 四列栅格（同原 dataSourcePlacements 布局），现统一为 sceneElements + dataBinding
     */
    sceneElements: [
      {
        instanceId: "elm_t1",
        canvasId: "main",
        x: 80,
        y: 80,
        name: "1号桌",
        width: 180,
        height: 120,
        zIndex: 0,
        elementKind: "table",
        dataBinding: {
          dataSourceKey: RESTAURANT_DS_KEY,
          recordId: "t1"
        }
      },
      {
        instanceId: "elm_t2",
        canvasId: "main",
        x: 280,
        y: 80,
        name: "2号桌",
        width: 180,
        height: 160,
        zIndex: 0,
        elementKind: "table",
        dataBinding: {
          dataSourceKey: RESTAURANT_DS_KEY,
          recordId: "t2"
        }
      },
      {
        instanceId: "elm_t3",
        canvasId: "main",
        x: 480,
        y: 80,
        name: "3号桌",
        width: 180,
        height: 160,
        zIndex: 0,
        elementKind: "table",
        dataBinding: {
          dataSourceKey: RESTAURANT_DS_KEY,
          recordId: "t3"
        }
      },
      {
        instanceId: "elm_cs1",
        canvasId: "main",
        x: 680,
        y: 80,
        name: "大厅·自助蘸料区",
        width: 108,
        height: 88,
        zIndex: 0,
        elementKind: "condimentStation",
        dataBinding: {
          dataSourceKey: CONDIMENT_STATION_DS_KEY,
          recordId: "cs1"
        }
      },
      {
        instanceId: "elm_cs2",
        canvasId: "main",
        x: 80,
        y: 264,
        name: "包厢走道补料台",
        width: 108,
        height: 88,
        zIndex: 0,
        elementKind: "condimentStation",
        dataBinding: {
          dataSourceKey: CONDIMENT_STATION_DS_KEY,
          recordId: "cs2"
        }
      },
      {
        instanceId: "elm_t4",
        canvasId: "main",
        x: 280,
        y: 264,
        name: "4号桌",
        width: 180,
        height: 120,
        zIndex: 0,
        elementKind: "table",
        dataBinding: {
          dataSourceKey: RESTAURANT_DS_KEY,
          recordId: "t4"
        }
      },
      {
        instanceId: "elm_t5",
        canvasId: "main",
        x: 480,
        y: 264,
        name: "5号桌",
        width: 180,
        height: 160,
        zIndex: 0,
        elementKind: "table",
        dataBinding: {
          dataSourceKey: RESTAURANT_DS_KEY,
          recordId: "t5"
        }
      },
      {
        instanceId: "elm_t6",
        canvasId: "main",
        x: 680,
        y: 264,
        name: "6号桌",
        width: 180,
        height: 120,
        zIndex: 0,
        elementKind: "table",
        dataBinding: {
          dataSourceKey: RESTAURANT_DS_KEY,
          recordId: "t6"
        }
      },
      {
        instanceId: "elm_r1",
        canvasId: "main",
        x: 80,
        y: 448,
        name: "圆桌1",
        width: 120,
        height: 120,
        zIndex: 0,
        elementKind: "roundTable",
        dataBinding: {
          dataSourceKey: RESTAURANT_DS_KEY,
          recordId: "r1"
        }
      },
      {
        instanceId: "elm_cs3",
        canvasId: "main",
        x: 220,
        y: 448,
        name: "露台·酱料小推位",
        width: 108,
        height: 88,
        zIndex: 0,
        elementKind: "condimentStation",
        dataBinding: {
          dataSourceKey: CONDIMENT_STATION_DS_KEY,
          recordId: "cs3"
        }
      },
      {
        instanceId: "elm_t7",
        canvasId: "main",
        x: 480,
        y: 448,
        name: "7号桌",
        width: 180,
        height: 120,
        zIndex: 0,
        elementKind: "table",
        dataBinding: {
          dataSourceKey: RESTAURANT_DS_KEY,
          recordId: "t7"
        }
      },
      {
        instanceId: "elm_t8",
        canvasId: "main",
        x: 680,
        y: 448,
        name: "8号桌",
        width: 180,
        height: 120,
        zIndex: 0,
        elementKind: "table",
        dataBinding: {
          dataSourceKey: RESTAURANT_DS_KEY,
          recordId: "t8"
        }
      }
    ]
  };
}
var restaurantTableColumns = [
  {
    title: "桌号",
    dataIndex: "name",
    key: "name",
    width: 120,
    type: "singleLineText"
  },
  {
    title: "状态",
    dataIndex: "status",
    key: "status",
    width: 120,
    type: "singleSelect",
    fieldProps: {
      options: [
        { label: "全部", value: "all" },
        { label: "空闲", value: "空闲" },
        { label: "已预订", value: "已预订" },
        { label: "用餐中", value: "用餐中" },
        { label: "等待", value: "等待" },
        { label: "已结账", value: "已结账" }
      ]
    },
    filterable: true,
    filter: { quickFilter: true }
  },
  {
    title: "可坐人数",
    dataIndex: "capacity",
    key: "capacity",
    width: 110,
    type: "number"
  },
  {
    title: "区域",
    dataIndex: "area",
    key: "area",
    width: 140,
    type: "singleLineText"
  },
  {
    title: "当前用餐人数",
    dataIndex: "guests",
    key: "guests",
    width: 130,
    type: "number"
  },
  {
    title: "顾客",
    dataIndex: "customerName",
    key: "customerName",
    width: 120,
    type: "singleLineText"
  },
  {
    title: "预订时间",
    dataIndex: "reserveTime",
    key: "reserveTime",
    width: 120,
    type: "singleLineText"
  }
];
var condimentRecordFormColumns = [
  { key: "name", label: "摆台名称", type: "string" },
  {
    key: "status",
    label: "状态",
    type: "select",
    options: [
      { label: "正常", value: "正常" },
      { label: "需补货", value: "需补货" },
      { label: "维护中", value: "维护中" }
    ]
  },
  { key: "flavorCount", label: "蘸料种类数", type: "number" },
  { key: "area", label: "区域", type: "string" },
  { key: "note", label: "备注", type: "string" }
];
function RestaurantTableRecordCustomForm(props) {
  const { ctx } = props;
  const [form] = import_antd.Form.useForm();
  (0, import_react.useEffect)(() => {
    form.setFieldsValue(ctx.record);
  }, [ctx.recordId, ctx.record, form]);
  return /* @__PURE__ */ import_react.default.createElement(
    import_antd.Form,
    {
      form,
      layout: "vertical",
      size: "small",
      onFinish: (values) => {
        var _a;
        (_a = ctx.onSaveRecord) == null ? void 0 : _a.call(ctx, values);
      }
    },
    /* @__PURE__ */ import_react.default.createElement("p", { style: { margin: "0 0 8px", fontSize: 12, color: "#8c8c8c" } }, "以下为自定义 React 表单示例（仍可 `ctx.onSaveRecord` 写回与内置 FloorMapDataForm 相同的数据通道）。"),
    /* @__PURE__ */ import_react.default.createElement(import_antd.Form.Item, { name: "guests", label: "当前用餐人数" }, /* @__PURE__ */ import_react.default.createElement(import_antd.InputNumber, { min: 0, style: { width: "100%" } })),
    /* @__PURE__ */ import_react.default.createElement(import_antd.Form.Item, { name: "customerName", label: "顾客" }, /* @__PURE__ */ import_react.default.createElement(import_antd.Input, { allowClear: true })),
    /* @__PURE__ */ import_react.default.createElement(import_antd.Form.Item, { name: "reserveTime", label: "预订时间" }, /* @__PURE__ */ import_react.default.createElement(import_antd.Input, { placeholder: "如 18:30", allowClear: true })),
    /* @__PURE__ */ import_react.default.createElement(
      import_antd.Button,
      {
        type: "primary",
        htmlType: "submit",
        loading: ctx.savingRecord,
        block: true,
        size: "small"
      },
      "保存记录"
    )
  );
}
var restaurantRecordFormColumns = [
  { key: "name", label: "桌号", type: "string" },
  {
    key: "status",
    label: "状态",
    type: "select",
    options: [
      { label: "空闲", value: "空闲" },
      { label: "已预订", value: "已预订" },
      { label: "用餐中", value: "用餐中" },
      { label: "等待", value: "等待" },
      { label: "已结账", value: "已结账" }
    ]
  },
  { key: "capacity", label: "可坐人数", type: "number" },
  { key: "area", label: "区域", type: "string" },
  { key: "guests", label: "当前用餐人数", type: "number" },
  { key: "customerName", label: "顾客", type: "string" },
  { key: "reserveTime", label: "预订时间", type: "string" }
];
var Default = {
  parameters: {
    layout: "fullscreen",
    docs: {
      description: {
        story: [
          "### 多数据源：餐桌 + 蘸料摆台（表格 ⇄ 平面图）",
          "",
          "- **`dataSources`**（根级）：`{ tables, condimentStations }`，与 `dataSourceKey` 一致；ShellFrame 与 `FloorMap` props 合并后传入平面图。",
          "- **`floorMapLayoutContext`**：本 Story 将 `floorMapConfig` / `onSave` / 侧栏表单等放在根级 Context，`FloorMap` 仅保留 `mode`、`renderItemByKind`、`mapLayer` 等展示向 props。",
          "- **表格**：传根级 `data`（快筛 + 关键词过滤后分页）；`dataSources.tables` 为**全量排序**餐桌，供平面图绑定。",
          "- **平面图**：始终渲染全部落位；未命中快筛/搜索的绑定行 **opacity=0.2**（`getMergedItemWrapperStyle`）。",
          "- **侧栏保存**：`onDataSourceRecordSave(key, id, patch)` 按 `key` 写回 `tables` 或 `condimentStations`。",
          "- **自定义表单开关**仍仅作用于 **餐桌** 数据源侧栏。",
          "",
          "```tsx",
          "<PisellRecordBoard data={...} dataSources={全量} floorMap={{ getMergedItemWrapperStyle: ... }} />",
          "```"
        ].join("\n")
      }
    }
  },
  render: function DefaultRender() {
    const [pageNumber, setPageNumber] = (0, import_react.useState)(1);
    const [pageSize, setPageSize] = (0, import_react.useState)(10);
    const [loading] = (0, import_react.useState)(false);
    const [searchParams, setSearchParams] = (0, import_react.useState)({});
    const [selectedKeys, setSelectedKeys] = (0, import_react.useState)([]);
    const [selectedRows, setSelectedRows] = (0, import_react.useState)([]);
    const [tables, setTables] = (0, import_react.useState)(
      createInitialRestaurantTables
    );
    const [condimentStations, setCondimentStations] = (0, import_react.useState)(createInitialCondimentStations);
    const [floorMapConfig, setFloorMapConfig] = (0, import_react.useState)(
      createInitialRestaurantFloorMapConfig
    );
    const [mapEditMode, setMapEditMode] = (0, import_react.useState)(false);
    const [useCustomRecordForm, setUseCustomRecordForm] = (0, import_react.useState)(false);
    const sortedAllTables = (0, import_react.useMemo)(
      () => sortDataBySortKey(tables, searchParams == null ? void 0 : searchParams.sort),
      [tables, searchParams == null ? void 0 : searchParams.sort]
    );
    const filteredSortedTables = (0, import_react.useMemo)(
      () => sortedAllTables.filter(
        (row) => recordBoardStoryRowMatchesToolbar(
          row,
          searchParams
        )
      ),
      [sortedAllTables, searchParams]
    );
    const total = filteredSortedTables.length;
    const data = (0, import_react.useMemo)(() => {
      const start = (pageNumber - 1) * pageSize;
      return filteredSortedTables.slice(start, start + pageSize);
    }, [pageNumber, pageSize, filteredSortedTables]);
    const value = (0, import_react.useMemo)(
      () => ({
        data,
        loading,
        total,
        pagination: { pageNumber, pageSize },
        onPageChange: (num, size) => {
          setPageNumber(num);
          setPageSize(size);
        },
        searchParams,
        onSearch: (params) => {
          setSearchParams(params);
          setPageNumber(1);
        },
        onReset: () => {
          setSearchParams({});
          setPageNumber(1);
        },
        layoutType: "grid",
        rowKey: "id"
      }),
      [data, loading, total, pageNumber, pageSize, searchParams]
    );
    const dataSources = (0, import_react.useMemo)(
      () => ({
        [RESTAURANT_DS_KEY]: sortedAllTables,
        [CONDIMENT_STATION_DS_KEY]: condimentStations
      }),
      [sortedAllTables, condimentStations]
    );
    const handleFloorMapSave = (0, import_react.useCallback)((config) => {
      setFloorMapConfig(config);
      console.log("[PisellRecordBoard Restaurant] floorMap onSave", config);
    }, []);
    const handleDataSourceRecordSave = (0, import_react.useCallback)(
      (dataSourceKey, id, newData) => {
        if (dataSourceKey === RESTAURANT_DS_KEY) {
          setTables(
            (prev) => prev.map((row) => row.id === id ? { ...row, ...newData } : row)
          );
        } else if (dataSourceKey === CONDIMENT_STATION_DS_KEY) {
          setCondimentStations(
            (prev) => prev.map((row) => row.id === id ? { ...row, ...newData } : row)
          );
        }
        console.log("[PisellRecordBoard Restaurant] onDataSourceRecordSave", {
          dataSourceKey,
          id,
          newData
        });
      },
      []
    );
    const floorMapLayoutContext = (0, import_react.useMemo)(
      () => ({
        floorMapConfig,
        onSave: handleFloorMapSave,
        onDataSourceRecordSave: handleDataSourceRecordSave,
        dataSourceLabels: {
          [RESTAURANT_DS_KEY]: "餐桌",
          [CONDIMENT_STATION_DS_KEY]: "蘸料摆台"
        },
        dataSourceFormColumns: {
          [RESTAURANT_DS_KEY]: restaurantRecordFormColumns,
          [CONDIMENT_STATION_DS_KEY]: condimentRecordFormColumns
        },
        ...useCustomRecordForm ? {
          dataSourceRecordForm: {
            [RESTAURANT_DS_KEY]: (ctx) => /* @__PURE__ */ import_react.default.createElement(RestaurantTableRecordCustomForm, { ctx })
          }
        } : {}
      }),
      [
        floorMapConfig,
        handleFloorMapSave,
        handleDataSourceRecordSave,
        useCustomRecordForm
      ]
    );
    const floorMap = (0, import_react.useMemo)(
      () => ({
        mode: mapEditMode ? "edit" : "read",
        renderItemByKind: {
          table: (0, import_FigmaTableCard.getRenderItemByKindTable)(dataSources),
          roundTable: (0, import_FigmaTableCard.getRenderItemByKindRoundTable)(dataSources),
          condimentStation: getRenderItemByKindCondimentStation(dataSources)
        },
        mapLayer: {
          backgroundType: "color",
          backgroundColor: "#f5f5f5",
          padding: 24
        },
        zoom: { defaultScale: 1, min: 0.4, max: 2.2, step: 0.1 },
        pan: { enabled: true, boundary: "clamp" },
        controls: {
          showZoom: true,
          showReset: true,
          showFitBounds: true
        },
        enableHover: true,
        getMergedItemWrapperStyle: (item) => {
          var _a;
          const m = item;
          const b = (_a = m._sceneElement) == null ? void 0 : _a.dataBinding;
          if (!(b == null ? void 0 : b.dataSourceKey)) return void 0;
          const recordId = b.recordId != null ? String(b.recordId).trim() : "";
          if (!recordId || recordId.startsWith("new_")) return void 0;
          const rows = dataSources[b.dataSourceKey];
          const row = rows == null ? void 0 : rows.find((r) => r.id === recordId);
          if (!row) return void 0;
          if (recordBoardStoryRowMatchesToolbar(
            row,
            searchParams
          ))
            return void 0;
          return { opacity: FLOOR_MAP_DIM_OPACITY };
        }
      }),
      [dataSources, mapEditMode, searchParams]
    );
    return /* @__PURE__ */ import_react.default.createElement(
      "div",
      {
        style: {
          boxSizing: "border-box",
          height: "100vh",
          minHeight: "100vh",
          padding: 16,
          background: "#f5f5f5",
          display: "flex",
          flexDirection: "column",
          overflow: "hidden"
        }
      },
      /* @__PURE__ */ import_react.default.createElement(
        "div",
        {
          style: {
            flexShrink: 0,
            marginBottom: 12,
            padding: "10px 12px",
            background: "#e6f4ff",
            border: "1px solid #91caff",
            borderRadius: 8,
            fontSize: 13,
            lineHeight: 1.65,
            color: "#0958d9"
          }
        },
        /* @__PURE__ */ import_react.default.createElement(import_antd.Space, { size: "large", wrap: true, align: "center" }, /* @__PURE__ */ import_react.default.createElement("span", null, /* @__PURE__ */ import_react.default.createElement("strong", null, "表格："), "快筛 + 搜索过滤 + 分页；平面图为全量落位，未命中行半透明显示。"), /* @__PURE__ */ import_react.default.createElement("span", null, /* @__PURE__ */ import_react.default.createElement("strong", null, "平面图："), "`tables` + `condimentStations` 同时渲染；工具栏「表格 / 平面图」切换视图。"), /* @__PURE__ */ import_react.default.createElement("span", null, /* @__PURE__ */ import_react.default.createElement(import_antd.Switch, { checked: mapEditMode, onChange: setMapEditMode }), /* @__PURE__ */ import_react.default.createElement("span", { style: { marginLeft: 8 } }, "平面图编辑模式（关=只读，开=可拖桌位、侧栏改记录并写回对应数据源）")), /* @__PURE__ */ import_react.default.createElement("span", null, /* @__PURE__ */ import_react.default.createElement(
          import_antd.Switch,
          {
            checked: useCustomRecordForm,
            onChange: setUseCustomRecordForm
          }
        ), /* @__PURE__ */ import_react.default.createElement("span", { style: { marginLeft: 8 } }, "侧栏自定义表单（仅", /* @__PURE__ */ import_react.default.createElement("strong", null, "餐桌"), "数据源；蘸料台仍用列配置表单）"))),
        /* @__PURE__ */ import_react.default.createElement("div", { style: { marginTop: 8, fontSize: 12, color: "#1677ff" } }, "提示：平面图为全量落位；仅当", /* @__PURE__ */ import_react.default.createElement("strong", null, "已绑定有效数据行"), "且该行未命中快筛/搜索时透明度", " ", Math.round(FLOOR_MAP_DIM_OPACITY * 100), "%（未选行、new_ 占位、行已删不参与淡化）。保存布局仍会输出 `onSave` 日志。")
      ),
      /* @__PURE__ */ import_react.default.createElement(
        "div",
        {
          style: {
            flex: 1,
            minHeight: 0,
            minWidth: 0,
            display: "flex",
            flexDirection: "column"
          }
        },
        /* @__PURE__ */ import_react.default.createElement(
          import_index.default,
          {
            rowKey: "id",
            ...value,
            dataSources,
            floorMapLayoutContext,
            defaultBodyView: "grid",
            style: { height: "100%", minHeight: 0, flex: 1 },
            grid: {
              columns: restaurantTableColumns,
              scroll: { x: 1460 },
              selectedKeys,
              selectedRows,
              onSelectionChange: (keys, rows) => {
                setSelectedKeys(keys);
                setSelectedRows(rows);
              }
            },
            toolBar: {
              search: true,
              quickFilter: true,
              filter: { hiddenQuickFilter: true }
            }
          },
          /* @__PURE__ */ import_react.default.createElement(import_index.default.ShellFrame, null, /* @__PURE__ */ import_react.default.createElement(import_index.default.GridLayout, null), /* @__PURE__ */ import_react.default.createElement(
            import_index.default.FloorMap,
            {
              ...floorMap
            }
          ))
        )
      )
    );
  }
};
var GridLayoutWithTable = {
  parameters: {
    docs: {
      description: {
        story: "列配置 type + fieldProps，筛选项与排序由 columns 派生；快速筛选在右侧「筛选」弹层内。"
      }
    }
  },
  render: function GridLayoutWithTableRender() {
    var _a;
    const [pageNumber, setPageNumber] = (0, import_react.useState)(1);
    const [pageSize, setPageSize] = (0, import_react.useState)(10);
    const [loading, setLoading] = (0, import_react.useState)(false);
    const [searchParams, setSearchParams] = (0, import_react.useState)({});
    const [selectedKeys, setSelectedKeys] = (0, import_react.useState)([]);
    const [selectedRows, setSelectedRows] = (0, import_react.useState)([]);
    const filterValues = (_a = searchParams == null ? void 0 : searchParams.filter) == null ? void 0 : _a.values;
    const filteredList = (0, import_react.useMemo)(
      () => filterDataByCriteria(mockData, filterValues),
      [searchParams]
    );
    const sortedList = (0, import_react.useMemo)(
      () => sortDataBySortKey(filteredList, searchParams == null ? void 0 : searchParams.sort),
      [filteredList, searchParams == null ? void 0 : searchParams.sort]
    );
    const total = sortedList.length;
    const data = (0, import_react.useMemo)(() => {
      const start = (pageNumber - 1) * pageSize;
      return sortedList.slice(start, start + pageSize);
    }, [pageNumber, pageSize, sortedList]);
    const value = (0, import_react.useMemo)(
      () => ({
        data,
        loading,
        total,
        pagination: { pageNumber, pageSize },
        onPageChange: (num, size) => {
          setPageNumber(num);
          setPageSize(size);
        },
        searchParams,
        onSearch: (params) => {
          setSearchParams(params);
          setPageNumber(1);
        },
        onReset: () => {
          setSearchParams({});
          setPageNumber(1);
        },
        layoutType: "grid",
        rowKey: "id"
      }),
      [data, loading, total, pageNumber, pageSize, searchParams]
    );
    return /* @__PURE__ */ import_react.default.createElement("div", { style: { padding: 16, background: "#f5f5f5", minHeight: 400 } }, /* @__PURE__ */ import_react.default.createElement(
      import_index.default,
      {
        rowKey: "id",
        ...value,
        grid: {
          columns: columnsWithType,
          scroll: { x: 1300 },
          selectedKeys,
          selectedRows,
          onSelectionChange: (keys, rows) => {
            setSelectedKeys(keys);
            setSelectedRows(rows);
          }
        },
        toolBar: { quickFilter: true, filter: { hiddenQuickFilter: true } }
      },
      /* @__PURE__ */ import_react.default.createElement(import_index.default.ShellFrame, null, /* @__PURE__ */ import_react.default.createElement(import_index.default.GridLayout, null))
    ));
  }
};
var GridWithMultiplePages = {
  parameters: {
    docs: {
      description: {
        story: "多页分页示例：共 250 条数据，每页 10 条，共 25 页。可切换页码、修改每页条数，验证分页器与多页跳转等行为。"
      }
    }
  },
  render: function GridWithMultiplePagesRender() {
    const [pageNumber, setPageNumber] = (0, import_react.useState)(1);
    const [pageSize, setPageSize] = (0, import_react.useState)(10);
    const [searchParams, setSearchParams] = (0, import_react.useState)({});
    const [selectedKeys, setSelectedKeys] = (0, import_react.useState)([]);
    const [selectedRows, setSelectedRows] = (0, import_react.useState)([]);
    const total = mockDataMultiplePages.length;
    const data = (0, import_react.useMemo)(() => {
      const start = (pageNumber - 1) * pageSize;
      return mockDataMultiplePages.slice(start, start + pageSize);
    }, [pageNumber, pageSize]);
    const value = (0, import_react.useMemo)(
      () => ({
        data,
        loading: false,
        total,
        pagination: { pageNumber, pageSize },
        onPageChange: (num, size) => {
          setPageNumber(num);
          setPageSize(size);
        },
        searchParams,
        onSearch: (params) => {
          setSearchParams(params);
          setPageNumber(1);
        },
        onReset: () => {
          setSearchParams({});
          setPageNumber(1);
        },
        layoutType: "grid",
        rowKey: "id"
      }),
      [data, total, pageNumber, pageSize, searchParams]
    );
    return /* @__PURE__ */ import_react.default.createElement("div", { style: { padding: 16, background: "#f5f5f5", minHeight: 500 } }, /* @__PURE__ */ import_react.default.createElement(
      import_index.default,
      {
        rowKey: "id",
        ...value,
        grid: {
          columns: columnsWithType,
          scroll: { x: 1300 },
          selectedKeys,
          selectedRows,
          onSelectionChange: (keys, rows) => {
            setSelectedKeys(keys);
            setSelectedRows(rows);
          }
        },
        toolBar: { quickFilter: true, filter: { hiddenQuickFilter: true } }
      },
      /* @__PURE__ */ import_react.default.createElement(import_index.default.ShellFrame, null, /* @__PURE__ */ import_react.default.createElement(import_index.default.GridLayout, null))
    ));
  }
};
var GridLayoutWithCollapseUniformColumns = {
  parameters: {
    docs: {
      description: {
        story: "grid.collapseUniformColumns: true 时，当前页某列全部同值或全部为空则隐藏该列，在表格上方显示总结区。本示例数据当前页「支付状态」均为已支付、「备注」均为空，故两列折叠并出现在总结区。"
      }
    }
  },
  render: function GridLayoutWithCollapseUniformColumnsRender() {
    const [pageNumber, setPageNumber] = (0, import_react.useState)(1);
    const [pageSize, setPageSize] = (0, import_react.useState)(10);
    const [selectedKeys, setSelectedKeys] = (0, import_react.useState)([]);
    const [selectedRows, setSelectedRows] = (0, import_react.useState)([]);
    const uniformData = (0, import_react.useMemo)(
      () => Array.from({ length: 8 }, (_, i) => ({
        id: `u-${i + 1}`,
        orderNo: `U${String(10001 + i).padStart(6, "0")}`,
        payStatus: "paid",
        amount: 100 + i * 10,
        note: ""
      })),
      []
    );
    const total = uniformData.length;
    const data = (0, import_react.useMemo)(() => {
      const start = (pageNumber - 1) * pageSize;
      return uniformData.slice(start, start + pageSize);
    }, [pageNumber, pageSize, uniformData]);
    const columnsUniform = [
      { title: "订单号", dataIndex: "orderNo", key: "orderNo", width: 140 },
      {
        title: "支付状态",
        dataIndex: "payStatus",
        key: "payStatus",
        width: 120
      },
      { title: "订单金额", dataIndex: "amount", key: "amount", width: 120 },
      { title: "备注", dataIndex: "note", key: "note", width: 160 }
    ];
    const value = (0, import_react.useMemo)(
      () => ({
        data,
        loading: false,
        total,
        pagination: { pageNumber, pageSize },
        onPageChange: (num, size) => {
          setPageNumber(num);
          setPageSize(size);
        },
        searchParams: {},
        onSearch: () => {
        },
        onReset: () => {
        },
        layoutType: "grid",
        rowKey: "id"
      }),
      [data, total, pageNumber, pageSize]
    );
    return /* @__PURE__ */ import_react.default.createElement("div", { style: { padding: 16, background: "#f5f5f5", minHeight: 400 } }, /* @__PURE__ */ import_react.default.createElement(
      import_index.default,
      {
        rowKey: "id",
        ...value,
        grid: {
          columns: columnsUniform,
          scroll: { x: 600 },
          collapseUniformColumns: true,
          selectedKeys,
          selectedRows,
          onSelectionChange: (keys, rows) => {
            setSelectedKeys(keys);
            setSelectedRows(rows);
          }
        }
      },
      /* @__PURE__ */ import_react.default.createElement(import_index.default.ShellFrame, null, /* @__PURE__ */ import_react.default.createElement(import_index.default.GridLayout, null))
    ));
  }
};
var GridLayoutWithUniformCompare = {
  parameters: {
    docs: {
      description: {
        story: "列「支付分类」的 dataIndex 取值为对象 { id, name }。通过 uniformCompare(value, record) 返回 String(value.id) 参与比较，当前页全部为同一 id 时该列折叠，总结区优先用列 render 展示（如「已支付」）。"
      }
    }
  },
  render: function GridLayoutWithUniformCompareRender() {
    const [pageNumber, setPageNumber] = (0, import_react.useState)(1);
    const [pageSize, setPageSize] = (0, import_react.useState)(10);
    const [selectedKeys, setSelectedKeys] = (0, import_react.useState)([]);
    const [selectedRows, setSelectedRows] = (0, import_react.useState)([]);
    const uniformCompareData = (0, import_react.useMemo)(
      () => Array.from({ length: 6 }, (_, i) => ({
        id: `uc-${i + 1}`,
        orderNo: `UC${String(20001 + i).padStart(6, "0")}`,
        payCategory: { id: 1, name: "已支付" },
        amount: 50 + i * 5
      })),
      []
    );
    const total = uniformCompareData.length;
    const data = (0, import_react.useMemo)(() => {
      const start = (pageNumber - 1) * pageSize;
      return uniformCompareData.slice(start, start + pageSize);
    }, [pageNumber, pageSize, uniformCompareData]);
    const columnsWithUniformCompare = [
      { title: "订单号", dataIndex: "orderNo", key: "orderNo", width: 140 },
      {
        title: "支付分类",
        dataIndex: "payCategory",
        key: "payCategory",
        width: 120,
        uniformCompare: (value2) => value2 != null && typeof value2 === "object" && "id" in value2 && value2.id != null ? String(value2.id) : void 0,
        render: (value2) => (value2 == null ? void 0 : value2.name) != null ? value2.name : "-"
      },
      { title: "订单金额", dataIndex: "amount", key: "amount", width: 120 }
    ];
    const value = (0, import_react.useMemo)(
      () => ({
        data,
        loading: false,
        total,
        pagination: { pageNumber, pageSize },
        onPageChange: (num, size) => {
          setPageNumber(num);
          setPageSize(size);
        },
        searchParams: {},
        onSearch: () => {
        },
        onReset: () => {
        },
        layoutType: "grid",
        rowKey: "id"
      }),
      [data, total, pageNumber, pageSize]
    );
    return /* @__PURE__ */ import_react.default.createElement("div", { style: { padding: 16, background: "#f5f5f5", minHeight: 400 } }, /* @__PURE__ */ import_react.default.createElement(
      import_index.default,
      {
        rowKey: "id",
        ...value,
        grid: {
          columns: columnsWithUniformCompare,
          scroll: { x: 450 },
          collapseUniformColumns: true,
          selectedKeys,
          selectedRows,
          onSelectionChange: (keys, rows) => {
            setSelectedKeys(keys);
            setSelectedRows(rows);
          }
        }
      },
      /* @__PURE__ */ import_react.default.createElement(import_index.default.ShellFrame, null, /* @__PURE__ */ import_react.default.createElement(import_index.default.GridLayout, null))
    ));
  }
};
var GridWithOnRow = {
  parameters: {
    docs: {
      description: {
        story: "grid 支持 antd Table 透传。此处演示 onRow.onClick（行点击）与 rowClassName（按订单状态高亮行）。类型为 RecordBoardGridProps，基于 TableProps 省略 dataSource/loading/pagination/columns/scroll/size/rowSelection。"
      }
    }
  },
  render: function GridWithOnRowRender() {
    var _a;
    const [pageNumber, setPageNumber] = (0, import_react.useState)(1);
    const [pageSize, setPageSize] = (0, import_react.useState)(10);
    const [searchParams, setSearchParams] = (0, import_react.useState)({});
    const [selectedKeys, setSelectedKeys] = (0, import_react.useState)([]);
    const [selectedRows, setSelectedRows] = (0, import_react.useState)([]);
    const filterValues = (_a = searchParams == null ? void 0 : searchParams.filter) == null ? void 0 : _a.values;
    const filteredList = (0, import_react.useMemo)(
      () => filterDataByCriteria(mockData, filterValues),
      [searchParams]
    );
    const sortedList = (0, import_react.useMemo)(
      () => sortDataBySortKey(filteredList, searchParams == null ? void 0 : searchParams.sort),
      [filteredList, searchParams == null ? void 0 : searchParams.sort]
    );
    const total = sortedList.length;
    const data = (0, import_react.useMemo)(() => {
      const start = (pageNumber - 1) * pageSize;
      return sortedList.slice(start, start + pageSize);
    }, [pageNumber, pageSize, sortedList]);
    const value = (0, import_react.useMemo)(
      () => ({
        data,
        loading: false,
        total,
        pagination: { pageNumber, pageSize },
        onPageChange: (num, size) => {
          setPageNumber(num);
          setPageSize(size);
        },
        searchParams,
        onSearch: (params) => {
          setSearchParams(params);
          setPageNumber(1);
        },
        onReset: () => {
          setSearchParams({});
          setPageNumber(1);
        },
        layoutType: "grid",
        rowKey: "id"
      }),
      [data, total, pageNumber, pageSize, searchParams]
    );
    return /* @__PURE__ */ import_react.default.createElement("div", { style: { padding: 16, background: "#f5f5f5", minHeight: 400 } }, /* @__PURE__ */ import_react.default.createElement(
      import_index.default,
      {
        rowKey: "id",
        ...value,
        grid: {
          columns: columnsWithType,
          scroll: { x: 1300 },
          selectedKeys,
          selectedRows,
          onSelectionChange: (keys, rows) => {
            setSelectedKeys(keys);
            setSelectedRows(rows);
          },
          onRow: (record) => ({
            onClick: () => {
              const r = record;
              console.log("行点击", r.orderNo, r);
              alert(`点击订单：${r.orderNo}`);
            }
          }),
          rowClassName: (record) => record.orderStatus === "cancelled" ? "pisell-record-board-row-cancelled" : ""
        },
        toolBar: { quickFilter: true, filter: { hiddenQuickFilter: true } }
      },
      /* @__PURE__ */ import_react.default.createElement(import_index.default.ShellFrame, null, /* @__PURE__ */ import_react.default.createElement(import_index.default.GridLayout, null))
    ));
  }
};
var GridLayoutWithColumnType = {
  parameters: {
    docs: {
      description: {
        story: "与 GridLayoutWithTable 相同能力，可点排序、筛选、重置验证行为。"
      }
    }
  },
  render: function GridLayoutWithColumnTypeRender() {
    var _a;
    const [pageNumber, setPageNumber] = (0, import_react.useState)(1);
    const [pageSize, setPageSize] = (0, import_react.useState)(10);
    const [loading, setLoading] = (0, import_react.useState)(false);
    const [searchParams, setSearchParams] = (0, import_react.useState)({});
    const [selectedKeys, setSelectedKeys] = (0, import_react.useState)([]);
    const [selectedRows, setSelectedRows] = (0, import_react.useState)([]);
    const filterValues = (_a = searchParams == null ? void 0 : searchParams.filter) == null ? void 0 : _a.values;
    const filteredList = (0, import_react.useMemo)(
      () => filterDataByCriteria(mockData, filterValues),
      [searchParams]
    );
    const sortedList = (0, import_react.useMemo)(
      () => sortDataBySortKey(filteredList, searchParams == null ? void 0 : searchParams.sort),
      [filteredList, searchParams == null ? void 0 : searchParams.sort]
    );
    const total = sortedList.length;
    const data = (0, import_react.useMemo)(() => {
      const start = (pageNumber - 1) * pageSize;
      return sortedList.slice(start, start + pageSize);
    }, [pageNumber, pageSize, sortedList]);
    const value = (0, import_react.useMemo)(
      () => ({
        data,
        loading,
        total,
        pagination: { pageNumber, pageSize },
        onPageChange: (num, size) => {
          setPageNumber(num);
          setPageSize(size);
        },
        searchParams,
        onSearch: (params) => {
          setSearchParams(params);
          setPageNumber(1);
        },
        onReset: () => {
          setSearchParams({});
          setPageNumber(1);
        },
        layoutType: "grid",
        rowKey: "id"
      }),
      [data, loading, total, pageNumber, pageSize, searchParams]
    );
    return /* @__PURE__ */ import_react.default.createElement("div", { style: { padding: 16, background: "#f5f5f5", minHeight: 400 } }, /* @__PURE__ */ import_react.default.createElement(
      import_index.default,
      {
        rowKey: "id",
        ...value,
        grid: {
          columns: columnsWithType,
          scroll: { x: 1300 },
          selectedKeys,
          selectedRows,
          onSelectionChange: (keys, rows) => {
            setSelectedKeys(keys);
            setSelectedRows(rows);
          }
        },
        toolBar: { quickFilter: true, filter: { hiddenQuickFilter: true } }
      },
      /* @__PURE__ */ import_react.default.createElement(import_index.default.ShellFrame, null, /* @__PURE__ */ import_react.default.createElement(import_index.default.GridLayout, null))
    ));
  }
};
var GridLayoutToolBarSortAndFilter = {
  parameters: {
    docs: {
      description: {
        story: "在 toolBar 里直接配置排序与筛选：toolBar.sort 传 { list: [{ name, label, getSortItems }] } 手动配置排序子项，toolBar.filter 传 { defaultFilterValue: { otherFilter, values } }。排序写入 searchParams.sort，筛选写入 searchParams.filter，不依赖 columns 派生。"
      }
    }
  },
  render: function GridLayoutToolBarSortAndFilterRender() {
    var _a;
    const [pageNumber, setPageNumber] = (0, import_react.useState)(1);
    const [pageSize, setPageSize] = (0, import_react.useState)(10);
    const [searchParams, setSearchParams] = (0, import_react.useState)({});
    const [selectedKeys, setSelectedKeys] = (0, import_react.useState)([]);
    const [selectedRows, setSelectedRows] = (0, import_react.useState)([]);
    const filterValues = (_a = searchParams == null ? void 0 : searchParams.filter) == null ? void 0 : _a.values;
    const filteredList = (0, import_react.useMemo)(
      () => filterDataByCriteria(mockData, filterValues),
      [searchParams]
    );
    const sortedList = (0, import_react.useMemo)(
      () => sortDataBySortKey(filteredList, searchParams == null ? void 0 : searchParams.sort),
      [filteredList, searchParams == null ? void 0 : searchParams.sort]
    );
    const total = sortedList.length;
    const data = (0, import_react.useMemo)(() => {
      const start = (pageNumber - 1) * pageSize;
      return sortedList.slice(start, start + pageSize);
    }, [pageNumber, pageSize, sortedList]);
    const value = (0, import_react.useMemo)(
      () => ({
        data,
        loading: false,
        total,
        pagination: { pageNumber, pageSize },
        onPageChange: (num, size) => {
          setPageNumber(num);
          setPageSize(size);
        },
        searchParams,
        onSearch: (params) => {
          setSearchParams(params);
          setPageNumber(1);
        },
        onReset: () => {
          setSearchParams({});
          setPageNumber(1);
        },
        layoutType: "grid",
        rowKey: "id"
      }),
      [data, total, pageNumber, pageSize, searchParams]
    );
    return /* @__PURE__ */ import_react.default.createElement("div", { style: { padding: 16, background: "#f5f5f5", minHeight: 400 } }, /* @__PURE__ */ import_react.default.createElement(
      import_index.default,
      {
        rowKey: "id",
        ...value,
        grid: {
          columns,
          scroll: { x: 1300 },
          selectedKeys,
          selectedRows,
          onSelectionChange: (keys, rows) => {
            setSelectedKeys(keys);
            setSelectedRows(rows);
          }
        },
        toolBar: {
          sort: {
            list: [
              {
                name: "amount",
                label: "按金额",
                isCustom: true,
                getSortItems: (fieldKey) => [
                  { key: `${fieldKey}:asc`, label: "从低到高" },
                  { key: `${fieldKey}:desc`, label: "从高到低" }
                ]
              },
              {
                name: "createTime",
                label: "按下单时间",
                isCustom: true,
                getSortItems: (fieldKey) => [
                  { key: `${fieldKey}:asc`, label: "从旧到新" },
                  { key: `${fieldKey}:desc`, label: "从新到旧" }
                ]
              },
              {
                name: "orderNo",
                label: "按订单号",
                isCustom: true,
                getSortItems: (fieldKey) => [
                  { key: `${fieldKey}:asc`, label: "A → Z" },
                  { key: `${fieldKey}:desc`, label: "Z → A" }
                ]
              }
            ]
          },
          filter: {
            hiddenQuickFilter: true,
            defaultFilterValue: {
              quickFilter: [],
              otherFilter: [
                {
                  type: "single",
                  key: "orderStatus",
                  name: "orderStatus",
                  label: "订单状态",
                  props: {
                    options: [
                      { label: "全部", value: "all" },
                      { label: "待付款", value: "pending_pay" },
                      { label: "已付款", value: "paid" },
                      { label: "已发货", value: "shipped" },
                      { label: "已完成", value: "completed" },
                      { label: "已取消", value: "cancelled" }
                    ]
                  },
                  other: {}
                },
                {
                  type: "single",
                  key: "payStatus",
                  name: "payStatus",
                  label: "支付状态",
                  props: {
                    options: [
                      { label: "全部", value: "all" },
                      { label: "未支付", value: "unpaid" },
                      { label: "已支付", value: "paid" },
                      { label: "已退款", value: "refunded" }
                    ]
                  },
                  other: {}
                },
                {
                  type: "input",
                  key: "buyerName",
                  name: "buyerName",
                  label: "买家",
                  props: { placeholder: "买家姓名" },
                  other: {}
                },
                {
                  type: "rangePickerNew",
                  key: "createTime",
                  name: "createTime",
                  label: "下单时间",
                  props: {
                    placeholder: ["开始日期", "结束日期"],
                    style: { width: 260 }
                  },
                  other: {}
                }
              ],
              values: {}
            }
          }
        }
      },
      /* @__PURE__ */ import_react.default.createElement(import_index.default.ShellFrame, null, /* @__PURE__ */ import_react.default.createElement(import_index.default.GridLayout, null))
    ));
  }
};
var GridLayoutWithQuickFilterOnLeft = {
  parameters: {
    docs: {
      description: {
        story: "toolBar.quickFilter: true 时，快速筛选项（状态、城市等）内联在 ToolBar 左侧，与搜索并列；右侧「筛选」弹层仅保留高级筛选。"
      }
    }
  },
  render: function GridLayoutWithQuickFilterOnLeftRender() {
    var _a;
    const [pageNumber, setPageNumber] = (0, import_react.useState)(1);
    const [pageSize, setPageSize] = (0, import_react.useState)(10);
    const [loading, setLoading] = (0, import_react.useState)(false);
    const [searchParams, setSearchParams] = (0, import_react.useState)({});
    const [selectedKeys, setSelectedKeys] = (0, import_react.useState)([]);
    const [selectedRows, setSelectedRows] = (0, import_react.useState)([]);
    const filterValues = (_a = searchParams == null ? void 0 : searchParams.filter) == null ? void 0 : _a.values;
    const filteredList = (0, import_react.useMemo)(
      () => filterDataByCriteria(mockData, filterValues),
      [searchParams]
    );
    const sortedList = (0, import_react.useMemo)(
      () => sortDataBySortKey(filteredList, searchParams == null ? void 0 : searchParams.sort),
      [filteredList, searchParams == null ? void 0 : searchParams.sort]
    );
    const total = sortedList.length;
    const data = (0, import_react.useMemo)(() => {
      const start = (pageNumber - 1) * pageSize;
      return sortedList.slice(start, start + pageSize);
    }, [pageNumber, pageSize, sortedList]);
    const value = (0, import_react.useMemo)(
      () => ({
        data,
        loading,
        total,
        pagination: { pageNumber, pageSize },
        onPageChange: (num, size) => {
          setPageNumber(num);
          setPageSize(size);
        },
        searchParams,
        onSearch: (params) => {
          setSearchParams(params);
          setPageNumber(1);
        },
        onReset: () => {
          setSearchParams({});
          setPageNumber(1);
        },
        layoutType: "grid",
        rowKey: "id"
      }),
      [data, loading, total, pageNumber, pageSize, searchParams]
    );
    return /* @__PURE__ */ import_react.default.createElement("div", { style: { padding: 16, background: "#f5f5f5", minHeight: 400 } }, /* @__PURE__ */ import_react.default.createElement(
      import_index.default,
      {
        rowKey: "id",
        ...value,
        grid: {
          columns: columnsWithType,
          scroll: { x: 1300 },
          selectedKeys,
          selectedRows,
          onSelectionChange: (keys, rows) => {
            setSelectedKeys(keys);
            setSelectedRows(rows);
          }
        },
        toolBar: {
          search: true,
          quickFilter: true,
          filter: { hiddenQuickFilter: true }
        }
      },
      /* @__PURE__ */ import_react.default.createElement(import_index.default.ShellFrame, null, /* @__PURE__ */ import_react.default.createElement(import_index.default.GridLayout, null))
    ));
  }
};
var CustomQuickFilterAndColumnsRender = {
  parameters: {
    docs: {
      description: {
        story: "订单列表：左侧快速筛选用自定义 filterList（订单状态、支付状态）；部分列用自定义 render（订单号加粗、状态标签）；右侧筛选弹层仅高级筛选（订单号/买家关键词）。"
      }
    }
  },
  render: function CustomQuickFilterAndColumnsRenderFn() {
    var _a;
    const [pageNumber, setPageNumber] = (0, import_react.useState)(1);
    const [pageSize, setPageSize] = (0, import_react.useState)(10);
    const [searchParams, setSearchParams] = (0, import_react.useState)({});
    const [selectedKeys, setSelectedKeys] = (0, import_react.useState)([]);
    const [selectedRows, setSelectedRows] = (0, import_react.useState)([]);
    const filterValues = (_a = searchParams == null ? void 0 : searchParams.filter) == null ? void 0 : _a.values;
    const filteredList = (0, import_react.useMemo)(() => {
      const byCriteria = filterDataByCriteria(mockData, filterValues);
      const kw = filterValues == null ? void 0 : filterValues.keyword;
      if (kw != null && String(kw).trim() !== "") {
        const lower = String(kw).toLowerCase();
        return byCriteria.filter(
          (row) => String(row.orderNo ?? "").toLowerCase().includes(lower) || String(row.buyerName ?? "").toLowerCase().includes(lower)
        );
      }
      return byCriteria;
    }, [searchParams]);
    const sortedList = (0, import_react.useMemo)(
      () => sortDataBySortKey(filteredList, searchParams == null ? void 0 : searchParams.sort),
      [filteredList, searchParams == null ? void 0 : searchParams.sort]
    );
    const total = sortedList.length;
    const data = (0, import_react.useMemo)(() => {
      const start = (pageNumber - 1) * pageSize;
      return sortedList.slice(start, start + pageSize);
    }, [pageNumber, pageSize, sortedList]);
    const value = (0, import_react.useMemo)(
      () => ({
        data,
        loading: false,
        total,
        pagination: { pageNumber, pageSize },
        onPageChange: (num, size) => {
          setPageNumber(num);
          setPageSize(size);
        },
        searchParams,
        onSearch: (params) => {
          setSearchParams(params);
          setPageNumber(1);
        },
        onReset: () => {
          setSearchParams({});
          setPageNumber(1);
        },
        layoutType: "grid",
        rowKey: "id"
      }),
      [data, total, pageNumber, pageSize, searchParams]
    );
    return /* @__PURE__ */ import_react.default.createElement("div", { style: { padding: 16, background: "#f5f5f5", minHeight: 400 } }, /* @__PURE__ */ import_react.default.createElement(
      import_index.default,
      {
        rowKey: "id",
        ...value,
        grid: {
          columns: columnsWithCustomRender,
          scroll: { x: 1300 },
          selectedKeys,
          selectedRows,
          onSelectionChange: (keys, rows) => {
            setSelectedKeys(keys);
            setSelectedRows(rows);
          }
        },
        toolBar: {
          search: true,
          quickFilter: { filterList: customQuickFilterList },
          filter: {
            hiddenQuickFilter: true,
            defaultFilterValue: {
              quickFilter: [],
              otherFilter: [
                {
                  type: "input",
                  key: "keyword",
                  name: "keyword",
                  label: "关键词",
                  props: { placeholder: "订单号/买家" },
                  other: {}
                },
                {
                  type: "rangePickerNew",
                  key: "orderDate",
                  name: "orderDate",
                  label: "下单时间",
                  props: {
                    placeholder: ["开始日期", "结束日期"],
                    style: { width: 260 }
                  },
                  other: {}
                }
              ],
              values: {}
            }
          }
        }
      },
      /* @__PURE__ */ import_react.default.createElement(import_index.default.ShellFrame, null, /* @__PURE__ */ import_react.default.createElement(import_index.default.GridLayout, null))
    ));
  }
};
var CustomFilterSortRender = {
  parameters: {
    docs: {
      description: {
        story: "列上自定义 filter（下单时间 rangePickerNew 并配置 placeholder、宽度；订单状态 single 在高级筛选）、自定义 sort（订单状态列无 type，用 sort.getSortItems 自定义排序项「状态 A-Z / Z-A」）、自定义 render（订单号蓝色加粗、状态标签、买家加粗）。左侧快筛仅下单时间，其余在右侧高级筛选。"
      }
    }
  },
  render: function CustomFilterSortRenderFn() {
    var _a;
    const [pageNumber, setPageNumber] = (0, import_react.useState)(1);
    const [pageSize, setPageSize] = (0, import_react.useState)(10);
    const [searchParams, setSearchParams] = (0, import_react.useState)({});
    const [selectedKeys, setSelectedKeys] = (0, import_react.useState)([]);
    const [selectedRows, setSelectedRows] = (0, import_react.useState)([]);
    const filterValues = (_a = searchParams == null ? void 0 : searchParams.filter) == null ? void 0 : _a.values;
    const filteredList = (0, import_react.useMemo)(
      () => filterDataByCriteria(mockData, filterValues),
      [searchParams]
    );
    const sortedList = (0, import_react.useMemo)(
      () => sortDataBySortKey(filteredList, searchParams == null ? void 0 : searchParams.sort),
      [filteredList, searchParams == null ? void 0 : searchParams.sort]
    );
    const total = sortedList.length;
    const data = (0, import_react.useMemo)(() => {
      const start = (pageNumber - 1) * pageSize;
      return sortedList.slice(start, start + pageSize);
    }, [pageNumber, pageSize, sortedList]);
    const value = (0, import_react.useMemo)(
      () => ({
        data,
        loading: false,
        total,
        pagination: { pageNumber, pageSize },
        onPageChange: (num, size) => {
          setPageNumber(num);
          setPageSize(size);
        },
        searchParams,
        onSearch: (params) => {
          setSearchParams(params);
          setPageNumber(1);
        },
        onReset: () => {
          setSearchParams({});
          setPageNumber(1);
        },
        layoutType: "grid",
        rowKey: "id"
      }),
      [data, total, pageNumber, pageSize, searchParams]
    );
    return /* @__PURE__ */ import_react.default.createElement("div", { style: { padding: 16, background: "#f5f5f5", minHeight: 400 } }, /* @__PURE__ */ import_react.default.createElement(
      import_index.default,
      {
        rowKey: "id",
        ...value,
        grid: {
          columns: columnsWithCustomFilterSortRender,
          scroll: { x: 1300 },
          selectedKeys,
          selectedRows,
          onSelectionChange: (keys, rows) => {
            setSelectedKeys(keys);
            setSelectedRows(rows);
          }
        },
        toolBar: {
          search: true,
          quickFilter: true,
          filter: { hiddenQuickFilter: true }
        }
      },
      /* @__PURE__ */ import_react.default.createElement(import_index.default.ShellFrame, null, /* @__PURE__ */ import_react.default.createElement(import_index.default.GridLayout, null))
    ));
  }
};
var GridLayoutWithPisellFindInToolBar = {
  render: function GridLayoutWithPisellFindInToolBarRender() {
    const [pageNumber, setPageNumber] = (0, import_react.useState)(1);
    const [pageSize, setPageSize] = (0, import_react.useState)(10);
    const [loading, setLoading] = (0, import_react.useState)(false);
    const [searchParams, setSearchParams] = (0, import_react.useState)({});
    const [selectedKeys, setSelectedKeys] = (0, import_react.useState)([]);
    const [selectedRows, setSelectedRows] = (0, import_react.useState)([]);
    const total = mockData.length;
    const data = (0, import_react.useMemo)(() => {
      const start = (pageNumber - 1) * pageSize;
      return mockData.slice(start, start + pageSize);
    }, [pageNumber, pageSize]);
    const value = (0, import_react.useMemo)(
      () => ({
        data,
        loading,
        total,
        pagination: { pageNumber, pageSize },
        onPageChange: (num, size) => {
          setPageNumber(num);
          setPageSize(size);
        },
        searchParams,
        onSearch: (params) => {
          setSearchParams(params);
          setPageNumber(1);
        },
        onReset: () => {
          setSearchParams({});
          setPageNumber(1);
        },
        layoutType: "grid",
        rowKey: "id"
      }),
      [data, loading, total, pageNumber, pageSize, searchParams]
    );
    return /* @__PURE__ */ import_react.default.createElement("div", { style: { padding: 16, background: "#fff", minHeight: 500 } }, /* @__PURE__ */ import_react.default.createElement(
      import_index.default,
      {
        rowKey: "id",
        ...value,
        toolBar: {
          search: true,
          quickFilter: true,
          filter: { hiddenQuickFilter: true }
        },
        grid: {
          columns,
          size: "small",
          scroll: { x: 1300 },
          selectedKeys,
          selectedRows,
          onSelectionChange: (keys, rows) => {
            setSelectedKeys(keys);
            setSelectedRows(rows);
          }
        }
      },
      /* @__PURE__ */ import_react.default.createElement(import_index.default.ShellFrame, null, /* @__PURE__ */ import_react.default.createElement(import_index.default.GridLayout, null))
    ));
  }
};
var GridLayoutToolBarSearchInput = {
  render: function GridLayoutToolBarSearchInputRender() {
    const [pageNumber, setPageNumber] = (0, import_react.useState)(1);
    const [pageSize, setPageSize] = (0, import_react.useState)(10);
    const [searchParams, setSearchParams] = (0, import_react.useState)({});
    const [selectedKeys, setSelectedKeys] = (0, import_react.useState)([]);
    const [selectedRows, setSelectedRows] = (0, import_react.useState)([]);
    const total = mockData.length;
    const data = (0, import_react.useMemo)(() => {
      const start = (pageNumber - 1) * pageSize;
      return mockData.slice(start, start + pageSize);
    }, [pageNumber, pageSize]);
    const value = (0, import_react.useMemo)(
      () => ({
        data,
        loading: false,
        total,
        pagination: { pageNumber, pageSize },
        onPageChange: (num, size) => {
          setPageNumber(num);
          setPageSize(size);
        },
        searchParams,
        onSearch: (params) => {
          setSearchParams(params);
          setPageNumber(1);
        },
        layoutType: "grid",
        rowKey: "id"
      }),
      [data, total, pageNumber, pageSize, searchParams]
    );
    return /* @__PURE__ */ import_react.default.createElement("div", { style: { padding: 16 } }, /* @__PURE__ */ import_react.default.createElement(
      import_index.default,
      {
        rowKey: "id",
        ...value,
        toolBar: {
          search: { triggerType: "input", placeholder: "输入关键词" },
          quickFilter: true,
          filter: { hiddenQuickFilter: true }
        },
        grid: {
          columns,
          scroll: { x: 1300 },
          selectedKeys,
          selectedRows,
          onSelectionChange: (keys, rows) => {
            setSelectedKeys(keys);
            setSelectedRows(rows);
          }
        }
      },
      /* @__PURE__ */ import_react.default.createElement(import_index.default.ShellFrame, null, /* @__PURE__ */ import_react.default.createElement(import_index.default.GridLayout, null))
    ));
  }
};
var GridLayoutFull = {
  parameters: {
    docs: {
      description: {
        story: "勾选行后显示批量操作栏，可配置 onDelete 等；含搜索、筛选、排序、重置。"
      }
    }
  },
  render: function GridLayoutFullRender() {
    const [pageNumber, setPageNumber] = (0, import_react.useState)(1);
    const [pageSize, setPageSize] = (0, import_react.useState)(10);
    const [loading, setLoading] = (0, import_react.useState)(false);
    const [searchParams, setSearchParams] = (0, import_react.useState)({});
    const [selectedKeys, setSelectedKeys] = (0, import_react.useState)([]);
    const [selectedRows, setSelectedRows] = (0, import_react.useState)([]);
    const total = mockData.length;
    const data = (0, import_react.useMemo)(() => {
      const start = (pageNumber - 1) * pageSize;
      return mockData.slice(start, start + pageSize);
    }, [pageNumber, pageSize]);
    const value = (0, import_react.useMemo)(
      () => ({
        data,
        loading,
        total,
        pagination: { pageNumber, pageSize },
        onPageChange: (num, size) => {
          setPageNumber(num);
          setPageSize(size);
        },
        searchParams,
        onSearch: (params) => {
          setSearchParams(params);
          setPageNumber(1);
        },
        onReset: () => {
          setSearchParams({});
          setPageNumber(1);
        },
        layoutType: "grid",
        rowKey: "id"
      }),
      [data, loading, total, pageNumber, pageSize, searchParams]
    );
    return /* @__PURE__ */ import_react.default.createElement("div", { style: { padding: 16, background: "#fff", minHeight: 500 } }, /* @__PURE__ */ import_react.default.createElement(
      import_index.default,
      {
        rowKey: "id",
        ...value,
        toolBar: { quickFilter: true, filter: { hiddenQuickFilter: true } },
        grid: {
          columns,
          size: "small",
          scroll: { x: 1300 },
          selectedKeys,
          selectedRows,
          onSelectionChange: (keys, rows) => {
            setSelectedKeys(keys);
            setSelectedRows(rows);
          }
        },
        batchActionBar: {
          onDelete: (keys, rows) => {
            console.log("批量删除", keys, rows);
            alert(`已选择 ${keys.length} 项，可在此执行删除`);
          }
        }
      },
      /* @__PURE__ */ import_react.default.createElement(import_index.default.ShellFrame, null, /* @__PURE__ */ import_react.default.createElement(import_index.default.GridLayout, null))
    ));
  }
};
var Placeholder = {
  parameters: {
    docs: {
      description: {
        story: "不传 value 时的占位态，用于设计态或未接数据源时。"
      }
    }
  },
  args: {
    rowKey: "id"
  },
  render: (args) => /* @__PURE__ */ import_react.default.createElement("div", { style: { padding: 16, background: "#fafafa" } }, /* @__PURE__ */ import_react.default.createElement(import_index.default, { ...args }, /* @__PURE__ */ import_react.default.createElement(import_index.default.ShellFrame, null, /* @__PURE__ */ import_react.default.createElement(import_index.default.GridLayout, null))))
};
var CardLayoutPlaceholder = {
  parameters: {
    docs: { description: { story: "Card 布局占位，不传 value。" } }
  },
  args: {
    rowKey: "id",
    layoutType: "card"
  },
  render: (args) => /* @__PURE__ */ import_react.default.createElement("div", { style: { padding: 16, background: "#fafafa" } }, /* @__PURE__ */ import_react.default.createElement(import_index.default, { ...args }, /* @__PURE__ */ import_react.default.createElement(import_index.default.ShellFrame, null, /* @__PURE__ */ import_react.default.createElement(import_index.default.CardLayout, null))))
};
var CustomComposition = {
  parameters: {
    docs: {
      description: {
        story: "未用 ShellFrame，手动组合 ToolBar、BatchActionBar、Grid、Pagination。"
      }
    }
  },
  render: function CustomCompositionRender() {
    const [pageNumber, setPageNumber] = (0, import_react.useState)(1);
    const [pageSize, setPageSize] = (0, import_react.useState)(10);
    const [searchParams, setSearchParams] = (0, import_react.useState)({});
    const [selectedKeys, setSelectedKeys] = (0, import_react.useState)([]);
    const [selectedRows, setSelectedRows] = (0, import_react.useState)([]);
    const total = mockData.length;
    const data = (0, import_react.useMemo)(() => {
      const start = (pageNumber - 1) * pageSize;
      return mockData.slice(start, start + pageSize);
    }, [pageNumber, pageSize]);
    const value = (0, import_react.useMemo)(
      () => ({
        data,
        loading: false,
        total,
        pagination: { pageNumber, pageSize },
        onPageChange: (num, size) => {
          setPageNumber(num);
          setPageSize(size);
        },
        searchParams,
        onSearch: (params) => {
          setSearchParams(params);
          setPageNumber(1);
        },
        layoutType: "grid",
        rowKey: "id"
      }),
      [data, total, pageNumber, pageSize, searchParams]
    );
    return /* @__PURE__ */ import_react.default.createElement("div", { style: { padding: 16 } }, /* @__PURE__ */ import_react.default.createElement(
      import_index.default,
      {
        rowKey: "id",
        ...value,
        grid: {
          columns,
          selectedKeys,
          selectedRows,
          onSelectionChange: (keys, rows) => {
            setSelectedKeys(keys);
            setSelectedRows(rows);
          }
        },
        toolBar: { quickFilter: true, filter: { hiddenQuickFilter: true } }
      },
      /* @__PURE__ */ import_react.default.createElement(import_index.default.ToolBar, null),
      /* @__PURE__ */ import_react.default.createElement(import_index.default.BatchActionBar, null),
      /* @__PURE__ */ import_react.default.createElement(import_index.default.Grid, { style: { marginTop: 8 } }),
      /* @__PURE__ */ import_react.default.createElement(import_index.default.Pagination, null)
    ));
  }
};
var WithPisellFindSearch = {
  render: function WithPisellFindSearchRender() {
    const [pageNumber, setPageNumber] = (0, import_react.useState)(1);
    const [pageSize, setPageSize] = (0, import_react.useState)(10);
    const [searchParams, setSearchParams] = (0, import_react.useState)({});
    const [selectedKeys, setSelectedKeys] = (0, import_react.useState)([]);
    const [selectedRows, setSelectedRows] = (0, import_react.useState)([]);
    const total = mockData.length;
    const data = (0, import_react.useMemo)(() => {
      const start = (pageNumber - 1) * pageSize;
      return mockData.slice(start, start + pageSize);
    }, [pageNumber, pageSize]);
    const value = (0, import_react.useMemo)(
      () => ({
        data,
        loading: false,
        total,
        pagination: { pageNumber, pageSize },
        onPageChange: (num, size) => {
          setPageNumber(num);
          setPageSize(size);
        },
        searchParams,
        onSearch: (params) => {
          setSearchParams(params);
          setPageNumber(1);
        },
        layoutType: "grid",
        rowKey: "id"
      }),
      [data, total, pageNumber, pageSize, searchParams]
    );
    return /* @__PURE__ */ import_react.default.createElement("div", { style: { padding: 16 } }, /* @__PURE__ */ import_react.default.createElement(
      import_index.default,
      {
        rowKey: "id",
        ...value,
        search: { triggerType: "input", placeholder: "输入关键词搜索" },
        toolBar: { quickFilter: true, filter: { hiddenQuickFilter: true } },
        grid: {
          columns,
          scroll: { x: 1300 },
          selectedKeys,
          selectedRows,
          onSelectionChange: (keys, rows) => {
            setSelectedKeys(keys);
            setSelectedRows(rows);
          }
        }
      },
      /* @__PURE__ */ import_react.default.createElement(import_index.default.Search, null),
      /* @__PURE__ */ import_react.default.createElement(import_index.default.ToolBar, null),
      /* @__PURE__ */ import_react.default.createElement(import_index.default.BatchActionBar, null),
      /* @__PURE__ */ import_react.default.createElement(import_index.default.Grid, { columns, style: { marginTop: 8 } }),
      /* @__PURE__ */ import_react.default.createElement(import_index.default.Pagination, null)
    ));
  }
};
var SearchAndGridOnly = {
  render: function SearchAndGridOnlyRender() {
    const [pageNumber, setPageNumber] = (0, import_react.useState)(1);
    const [pageSize, setPageSize] = (0, import_react.useState)(10);
    const [searchParams, setSearchParams] = (0, import_react.useState)({});
    const [selectedKeys, setSelectedKeys] = (0, import_react.useState)([]);
    const [selectedRows, setSelectedRows] = (0, import_react.useState)([]);
    const total = mockData.length;
    const data = (0, import_react.useMemo)(() => {
      const start = (pageNumber - 1) * pageSize;
      return mockData.slice(start, start + pageSize);
    }, [pageNumber, pageSize]);
    const value = (0, import_react.useMemo)(
      () => ({
        data,
        loading: false,
        total,
        pagination: { pageNumber, pageSize },
        onPageChange: (num, size) => {
          setPageNumber(num);
          setPageSize(size);
        },
        searchParams,
        onSearch: (params) => {
          setSearchParams(params);
          setPageNumber(1);
        },
        layoutType: "grid",
        rowKey: "id"
      }),
      [data, total, pageNumber, pageSize, searchParams]
    );
    return /* @__PURE__ */ import_react.default.createElement("div", { style: { padding: 16 } }, /* @__PURE__ */ import_react.default.createElement(
      import_index.default,
      {
        rowKey: "id",
        ...value,
        grid: {
          columns,
          scroll: { x: 1300 },
          selectedKeys,
          selectedRows,
          onSelectionChange: (keys, rows) => {
            setSelectedKeys(keys);
            setSelectedRows(rows);
          }
        }
      },
      /* @__PURE__ */ import_react.default.createElement(import_index.default.Search, null),
      /* @__PURE__ */ import_react.default.createElement(import_index.default.Grid, { style: { marginTop: 8 } }),
      /* @__PURE__ */ import_react.default.createElement(import_index.default.Pagination, null)
    ));
  }
};
// Annotate the CommonJS export names for ESM import in node:
0 && (module.exports = {
  CardLayoutPlaceholder,
  CustomComposition,
  CustomFilterSortRender,
  CustomQuickFilterAndColumnsRender,
  Default,
  GridLayoutFull,
  GridLayoutToolBarSearchInput,
  GridLayoutToolBarSortAndFilter,
  GridLayoutWithCollapseUniformColumns,
  GridLayoutWithColumnType,
  GridLayoutWithPisellFindInToolBar,
  GridLayoutWithQuickFilterOnLeft,
  GridLayoutWithTable,
  GridLayoutWithUniformCompare,
  GridWithMultiplePages,
  GridWithOnRow,
  Placeholder,
  SearchAndGridOnly,
  WithPisellFindSearch
});
