@pisell/materials 1.0.215 → 1.0.217

package/lib/components/table/Actions/component/ColumnsSetting/utils.js

@@ -0,0 +1,59 @@
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+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 __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/components/table/Actions/component/ColumnsSetting/utils.ts
+var utils_exports = {};
+__export(utils_exports, {
+  isFixedOrderValid: () => isFixedOrderValid
+});
+module.exports = __toCommonJS(utils_exports);
+function isFixedOrderValid(columns) {
+  let leftStart = -1;
+  let leftEnd = -1;
+  let rightStart = -1;
+  for (let i = 0; i < columns.length; i++) {
+    const column = columns[i];
+    if (column.fixed === true || column.fixed === "left") {
+      if (leftStart === -1) {
+        leftStart = i;
+      }
+      if (leftEnd !== -1 || rightStart !== -1) {
+        return false;
+      }
+    } else if (column.fixed === "right") {
+      if (rightStart === -1) {
+        rightStart = i;
+      }
+      if (leftEnd === -1 && leftStart !== -1) {
+        leftEnd = i - 1;
+      }
+    } else {
+      if (leftEnd === -1 && leftStart !== -1) {
+        leftEnd = i - 1;
+      }
+      if (rightStart !== -1) {
+        return false;
+      }
+    }
+  }
+  return leftStart === -1 || leftStart === 0;
+}
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  isFixedOrderValid
+});

package/lib/components/table/Actions/component/GallerySetting/index.d.ts

@@ -0,0 +1,9 @@
+import React from "react";
+import { GallerySettingType, ModeType } from "../../../types";
+import "./index.less";
+declare type GallerySettingProps = {
+    setting: GallerySettingType;
+    currentViewMode: ModeType;
+};
+declare const GallerySetting: (props: GallerySettingProps) => React.JSX.Element;
+export default GallerySetting;

package/lib/components/table/Actions/component/GallerySetting/index.js

@@ -0,0 +1,158 @@
+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/table/Actions/component/GallerySetting/index.tsx
+var GallerySetting_exports = {};
+__export(GallerySetting_exports, {
+  default: () => GallerySetting_default
+});
+module.exports = __toCommonJS(GallerySetting_exports);
+var import_react = __toESM(require("react"));
+var import_icons = require("@ant-design/icons");
+var import_antd = require("antd");
+var import_PopoverContent = __toESM(require("../ColumnsSetting/PopoverContent"));
+var import_hooks = require("../../../../../hooks");
+var import_model = require("../../../model");
+var import_ButtonIcon = __toESM(require("../ButtonIcon"));
+var import_index = require("./index.less");
+var prefix = "pisell-lowcode-";
+var LabelShow = (props) => {
+  const { value, onChange } = props;
+  return /* @__PURE__ */ import_react.default.createElement(import_react.default.Fragment, null, value ? /* @__PURE__ */ import_react.default.createElement(import_icons.EyeOutlined, { onClick: () => onChange == null ? void 0 : onChange(false) }) : /* @__PURE__ */ import_react.default.createElement(import_icons.EyeInvisibleOutlined, { onClick: () => onChange == null ? void 0 : onChange(true) }));
+};
+var GallerySetting = (props) => {
+  const { setting } = props;
+  const { state } = (0, import_hooks.useSharedState)(import_model.Context);
+  const { defaultColumns } = state;
+  const { cover } = setting;
+  const { fields, show } = cover;
+  const form = import_antd.Form.useFormInstance();
+  const column_setting = import_antd.Form.useWatch("column_setting", {
+    form,
+    preserve: true
+  }) || [];
+  const isActive = (0, import_react.useMemo)(() => {
+    return column_setting.some((item) => !item.isShow);
+  }, [column_setting]);
+  const coverFieldOptions = (0, import_react.useMemo)(() => {
+    return [
+      {
+        value: "noCover",
+        label: "无封面"
+      },
+      ...(fields || []).map((field) => {
+        const column = defaultColumns.find(
+          (col) => col.key === field
+        );
+        return {
+          value: `${column.dataIndex}`,
+          label: column.title
+        };
+      }).filter(Boolean)
+    ];
+  }, [defaultColumns, fields]);
+  const headerContent = (0, import_react.useMemo)(() => {
+    return /* @__PURE__ */ import_react.default.createElement("div", { className: `${prefix}gallery-setting-header` }, /* @__PURE__ */ import_react.default.createElement(import_antd.Space, { direction: "vertical", style: { width: "100%" } }, show && /* @__PURE__ */ import_react.default.createElement(import_react.default.Fragment, null, /* @__PURE__ */ import_react.default.createElement("div", { className: `${prefix}gallery-setting-header-item` }, /* @__PURE__ */ import_react.default.createElement("div", null, "封面内容"), /* @__PURE__ */ import_react.default.createElement("div", null, /* @__PURE__ */ import_react.default.createElement(import_antd.Form.Item, { name: ["gallery_setting", "coverField"], noStyle: true }, /* @__PURE__ */ import_react.default.createElement(
+      import_antd.Select,
+      {
+        options: coverFieldOptions,
+        style: { width: 120 }
+      }
+    )))), /* @__PURE__ */ import_react.default.createElement(
+      import_antd.Form.Item,
+      {
+        noStyle: true,
+        shouldUpdate: (prevValues, currentValues) => {
+          var _a, _b;
+          return ((_a = prevValues.gallery_setting) == null ? void 0 : _a.coverField) !== ((_b = currentValues.gallery_setting) == null ? void 0 : _b.coverField);
+        }
+      },
+      ({ getFieldValue }) => getFieldValue(["gallery_setting", "coverField"]) !== "noCover" ? /* @__PURE__ */ import_react.default.createElement("div", { className: `${prefix}gallery-setting-header-item` }, /* @__PURE__ */ import_react.default.createElement("div", null, "封面效果"), /* @__PURE__ */ import_react.default.createElement("div", null, /* @__PURE__ */ import_react.default.createElement(
+        import_antd.Form.Item,
+        {
+          name: ["gallery_setting", "coverObjectFit"],
+          noStyle: true
+        },
+        /* @__PURE__ */ import_react.default.createElement(
+          import_antd.Segmented,
+          {
+            options: [
+              { label: "适应", value: "fill" },
+              { label: "剪裁", value: "cover" }
+            ]
+          }
+        )
+      ))) : null
+    ), /* @__PURE__ */ import_react.default.createElement(import_antd.Divider, { style: { margin: "0" } })), /* @__PURE__ */ import_react.default.createElement("div", { className: `${prefix}gallery-setting-header-item` }, /* @__PURE__ */ import_react.default.createElement("div", null, "展示模式"), /* @__PURE__ */ import_react.default.createElement("div", null, /* @__PURE__ */ import_react.default.createElement(import_antd.Form.Item, { name: ["gallery_setting", "compactMode"], noStyle: true }, /* @__PURE__ */ import_react.default.createElement(
+      import_antd.Segmented,
+      {
+        options: [
+          { label: "常规", value: "default" },
+          { label: "紧凑", value: "compact" }
+        ]
+      }
+    )))), /* @__PURE__ */ import_react.default.createElement(
+      import_antd.Form.Item,
+      {
+        noStyle: true,
+        shouldUpdate: (prevValues, currentValues) => {
+          var _a, _b;
+          return ((_a = prevValues.gallery_setting) == null ? void 0 : _a.compactMode) !== ((_b = currentValues.gallery_setting) == null ? void 0 : _b.compactMode);
+        }
+      },
+      ({ getFieldValue }) => getFieldValue(["gallery_setting", "compactMode"]) === "default" ? /* @__PURE__ */ import_react.default.createElement("div", { className: `${prefix}gallery-setting-header-item` }, /* @__PURE__ */ import_react.default.createElement("div", null, "展示字段名"), /* @__PURE__ */ import_react.default.createElement(
+        "div",
+        {
+          className: `${prefix}gallery-setting-header-item-icon-wrap`
+        },
+        /* @__PURE__ */ import_react.default.createElement(
+          import_antd.Form.Item,
+          {
+            name: ["gallery_setting", "isShowLabel"],
+            noStyle: true
+          },
+          /* @__PURE__ */ import_react.default.createElement(LabelShow, null)
+        )
+      )) : null
+    )), /* @__PURE__ */ import_react.default.createElement(import_antd.Divider, { style: { margin: "8px 0 0" } }));
+  }, [coverFieldOptions]);
+  const content = (0, import_react.useMemo)(() => {
+    return /* @__PURE__ */ import_react.default.createElement(import_antd.Form.Item, { name: ["column_setting"], noStyle: true }, /* @__PURE__ */ import_react.default.createElement(import_PopoverContent.default, { isShowTitle: false, headerContent }));
+  }, [headerContent]);
+  return /* @__PURE__ */ import_react.default.createElement(
+    import_antd.Popover,
+    {
+      content,
+      arrow: false,
+      placement: "bottomRight",
+      trigger: "click"
+    },
+    /* @__PURE__ */ import_react.default.createElement(import_ButtonIcon.default, { isActive }, /* @__PURE__ */ import_react.default.createElement(import_icons.EyeOutlined, { style: { cursor: "pointer", fontSize: 18 } }))
+  );
+};
+var GallerySetting_default = GallerySetting;

package/lib/components/table/Actions/component/GallerySetting/index.less

@@ -0,0 +1,15 @@
+@pisell-prefix: pisell-lowcode;
+
+.@{pisell-prefix} {
+  &-gallery-setting-header {
+    &-item {
+      display: flex;
+      justify-content: space-between;
+      align-items: center;
+      &-icon-wrap {
+        font-size: 20px;
+        cursor: pointer;
+      }
+    }
+  }
+}

package/lib/components/table/Actions/component/Group/PopoverContent.d.ts

@@ -0,0 +1,13 @@
+import React from "react";
+import "./PopoverContent.less";
+declare type FieldType = string | number;
+export declare type GroupValue = {
+    field: FieldType;
+}[];
+declare type PopoverContentProps = {
+    columns: Record<string, any>[];
+    onChange?: (value: GroupValue) => void;
+    value?: GroupValue;
+};
+declare const PopoverContent: (props: PopoverContentProps) => React.JSX.Element;
+export default PopoverContent;

package/lib/components/table/Actions/component/Group/PopoverContent.js

@@ -0,0 +1,72 @@
+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/table/Actions/component/Group/PopoverContent.tsx
+var PopoverContent_exports = {};
+__export(PopoverContent_exports, {
+  default: () => PopoverContent_default
+});
+module.exports = __toCommonJS(PopoverContent_exports);
+var import_react = __toESM(require("react"));
+var import_antd = require("antd");
+var import_HelpCircle = __toESM(require("@pisell/icon/es/HelpCircle"));
+var import_locales = require("../../../../../locales");
+var import_PopoverContent = require("./PopoverContent.less");
+var prefix = "pisell-lowcode-";
+var PopoverContent = (props) => {
+  const { columns, value = [], onChange } = props;
+  const firstValue = (value == null ? void 0 : value[0]) || {};
+  const handleFieldChange = (value2) => {
+    if (!value2) {
+      onChange == null ? void 0 : onChange([]);
+      return;
+    }
+    onChange == null ? void 0 : onChange([
+      {
+        field: value2
+      }
+    ]);
+  };
+  const options = (0, import_react.useMemo)(() => {
+    return (columns || []).map((item) => ({
+      label: item.label,
+      value: `${item.name}`
+    }));
+  }, [columns]);
+  return /* @__PURE__ */ import_react.default.createElement("div", { className: `${prefix}table-action-group-popover-content-wrap` }, /* @__PURE__ */ import_react.default.createElement("div", { className: `${prefix}table-action-group-header` }, /* @__PURE__ */ import_react.default.createElement("span", { className: `${prefix}table-action-group-header-title` }, (0, import_locales.getText)("table-action-group-by-title")), /* @__PURE__ */ import_react.default.createElement(import_antd.Tooltip, { title: (0, import_locales.getText)("table-action-group-by-title-tip") }, /* @__PURE__ */ import_react.default.createElement(import_HelpCircle.default, null))), /* @__PURE__ */ import_react.default.createElement("div", null, /* @__PURE__ */ import_react.default.createElement("div", null, /* @__PURE__ */ import_react.default.createElement(
+    import_antd.Select,
+    {
+      options,
+      value: firstValue.field,
+      onChange: handleFieldChange,
+      style: { width: 200 },
+      allowClear: true
+    }
+  ))));
+};
+var PopoverContent_default = PopoverContent;

package/lib/components/table/Actions/component/Group/PopoverContent.less

@@ -0,0 +1,29 @@
+@pisell-prefix: pisell-lowcode;
+
+.@{pisell-prefix} {
+  &-table-action-group-popover-content-wrap {
+    width: 200px;
+  }
+  &-table-action-group-footer {
+    padding: 16px;
+    border-top: 1px solid var(--Gray-200, #EAECF0);
+  }
+  &-table-action-group-header {
+    //padding: 16px 16px 0;
+    display: flex;
+    align-items: center;
+    margin-bottom: 16px;
+    .anticon {
+      font-size: 20px;
+      color: var(--gray-400,#98a2b3);
+    }
+    &-title {
+      color: var(--Gray-900, #101828);
+      font-size: 16px;
+      font-style: normal;
+      font-weight: 600;
+      line-height: 24px;
+      margin-right: 6px;
+    }
+  }
+}

package/lib/components/table/Actions/component/Group/index.d.ts

@@ -0,0 +1,13 @@
+import React from "react";
+import { DataSourceGroupType } from "../../../types";
+declare type GroupProps = {
+    setting: DataSourceGroupType;
+    value?: {
+        field: string | number;
+    }[];
+    onChange?: (value: {
+        field: string | number;
+    }[]) => void;
+};
+declare const Group: (props: GroupProps) => React.JSX.Element;
+export default Group;

package/lib/components/table/Actions/component/Group/index.js

@@ -0,0 +1,64 @@
+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/table/Actions/component/Group/index.tsx
+var Group_exports = {};
+__export(Group_exports, {
+  default: () => Group_default
+});
+module.exports = __toCommonJS(Group_exports);
+var import_react = __toESM(require("react"));
+var import_antd = require("antd");
+var import_Rows01 = __toESM(require("@pisell/icon/es/Rows01"));
+var import_ButtonIcon = __toESM(require("../ButtonIcon"));
+var import_PopoverContent = __toESM(require("./PopoverContent"));
+var Group = (props) => {
+  const { value, onChange, setting } = props;
+  const { list } = setting;
+  const content = (0, import_react.useMemo)(() => {
+    return /* @__PURE__ */ import_react.default.createElement(
+      import_PopoverContent.default,
+      {
+        columns: list,
+        onChange,
+        value
+      }
+    );
+  }, [list, value]);
+  return /* @__PURE__ */ import_react.default.createElement(
+    import_antd.Popover,
+    {
+      content,
+      arrow: false,
+      placement: "bottomRight",
+      trigger: "click"
+    },
+    /* @__PURE__ */ import_react.default.createElement(import_ButtonIcon.default, { isActive: !!(value == null ? void 0 : value.length) }, /* @__PURE__ */ import_react.default.createElement(import_Rows01.default, { style: { cursor: "pointer", fontSize: 18 } }))
+  );
+};
+var Group_default = Group;

package/lib/components/table/Actions/component/ViewMode/index.d.ts

@@ -0,0 +1,9 @@
+import React from "react";
+import { GridViewType, ModeType } from "../../../types";
+declare type ViewModeProps = {
+    view: GridViewType;
+    value?: ModeType;
+    onChange?: (value: ModeType) => void;
+};
+declare const ViewMode: (props: ViewModeProps) => React.JSX.Element;
+export default ViewMode;

package/lib/components/table/Actions/component/ViewMode/index.js

@@ -0,0 +1,77 @@
+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/table/Actions/component/ViewMode/index.tsx
+var ViewMode_exports = {};
+__export(ViewMode_exports, {
+  default: () => ViewMode_default
+});
+module.exports = __toCommonJS(ViewMode_exports);
+var import_react = __toESM(require("react"));
+var import_icons = require("@ant-design/icons");
+var import_antd = require("antd");
+var import_ButtonIcon = __toESM(require("../ButtonIcon"));
+var itemsMap = {
+  grid: {
+    key: "grid",
+    label: "Grid"
+  },
+  gallery: {
+    key: "gallery",
+    label: "Gallery"
+  },
+  kanban: {
+    key: "kanban",
+    label: "Kanban"
+  }
+};
+var defaultArr = [];
+var ViewMode = (props) => {
+  const { view, value, onChange } = props;
+  const { defaultViewMode, modeList = defaultArr } = view;
+  const items = (0, import_react.useMemo)(() => {
+    return modeList.map((item) => itemsMap[item]);
+  }, [modeList]);
+  const handleClick = (e) => {
+    onChange == null ? void 0 : onChange(e.key);
+  };
+  return /* @__PURE__ */ import_react.default.createElement(
+    import_antd.Dropdown,
+    {
+      menu: {
+        items,
+        selectable: true,
+        selectedKeys: value ? [value] : [defaultViewMode],
+        onClick: handleClick
+      },
+      placement: "bottomRight"
+    },
+    /* @__PURE__ */ import_react.default.createElement(import_ButtonIcon.default, { isActive: false }, /* @__PURE__ */ import_react.default.createElement(import_icons.BarChartOutlined, { style: { cursor: "pointer", fontSize: 18 } }))
+  );
+};
+var ViewMode_default = ViewMode;

package/lib/components/table/Actions/index.d.ts

@@ -1,4 +1,17 @@
-/// <reference types="react" />
+import React from "react";
+import { FilterType } from "../../filter/types";
+import { ColumnSettingType, DataSourceGroupType, GallerySettingType, GridViewType, SortType } from "../types";
 import "./index.less";
-declare const Actions: ({ filter, sort }: any) => JSX.Element | null;
+declare type ActionsProps = {
+    filter: FilterType;
+    tableId?: string;
+    columnSetting?: ColumnSettingType;
+    dataSourceGroup?: DataSourceGroupType;
+    sort: SortType;
+    localPagination?: boolean;
+    buttons: any[];
+    view: GridViewType;
+    gallery: GallerySettingType;
+};
+declare const Actions: ({ filter, sort, columnSetting, dataSourceGroup, tableId, localPagination, buttons, view, gallery, }: ActionsProps) => React.JSX.Element | null;
 export default Actions;

package/lib/components/table/Actions/index.js

@@ -33,14 +33,48 @@ __export(Actions_exports, {
 });
 module.exports = __toCommonJS(Actions_exports);
 var import_react = __toESM(require("react"));
-var import_filter = __toESM(require("../../filter"));
 var import_antd = require("antd");
-var import_Sort = __toESM(require("./Sort"));
+var import_filter = __toESM(require("../../filter"));
+var import_sort = __toESM(require("../../sort"));
+var import_ColumnsSetting = __toESM(require("./component/ColumnsSetting"));
+var import_Group = __toESM(require("./component/Group"));
+var import_Buttons = __toESM(require("../Header/Buttons"));
+var import_ViewMode = __toESM(require("./component/ViewMode"));
+var import_GallerySetting = __toESM(require("./component/GallerySetting"));
 var import_index = require("./index.less");
-var Actions = ({ filter, sort }) => {
+var Actions = ({
+  filter,
+  sort,
+  columnSetting,
+  dataSourceGroup,
+  tableId,
+  localPagination,
+  buttons,
+  view,
+  gallery
+}) => {
+  const form = import_antd.Form.useFormInstance();
+  const viewMode = import_antd.Form.useWatch("view_mode", {
+    form,
+    preserve: true
+  });
   const showActions = (0, import_react.useMemo)(() => {
-    return (filter == null ? void 0 : filter.show) || (sort == null ? void 0 : sort.show);
-  }, [filter == null ? void 0 : filter.show, sort == null ? void 0 : sort.show]);
-  return showActions ? /* @__PURE__ */ import_react.default.createElement("div", { className: "materials-grid-actions" }, /* @__PURE__ */ import_react.default.createElement("div", { className: "left-wrap" }, /* @__PURE__ */ import_react.default.createElement(import_filter.default, { filter, isRenderFormContent: false })), /* @__PURE__ */ import_react.default.createElement("div", { className: "right-wrap" }, (sort == null ? void 0 : sort.show) ? /* @__PURE__ */ import_react.default.createElement(import_antd.Form.Item, { name: "order_by", noStyle: true }, /* @__PURE__ */ import_react.default.createElement(import_Sort.default, { list: (sort == null ? void 0 : sort.list) || [] })) : null)) : null;
+    return (filter == null ? void 0 : filter.show) || (sort == null ? void 0 : sort.show) || (columnSetting == null ? void 0 : columnSetting.show) || (dataSourceGroup == null ? void 0 : dataSourceGroup.show) || view.multiple;
+  }, [
+    filter == null ? void 0 : filter.show,
+    sort == null ? void 0 : sort.show,
+    columnSetting == null ? void 0 : columnSetting.show,
+    dataSourceGroup == null ? void 0 : dataSourceGroup.show,
+    view.multiple
+  ]);
+  return showActions ? /* @__PURE__ */ import_react.default.createElement("div", { className: "materials-grid-actions" }, /* @__PURE__ */ import_react.default.createElement("div", { className: "left-wrap" }, /* @__PURE__ */ import_react.default.createElement(
+    import_filter.default,
+    {
+      filter,
+      isRenderFormContent: false,
+      tableId,
+      viewMode
+    }
+  )), /* @__PURE__ */ import_react.default.createElement("div", { className: "right-wrap" }, view.multiple && /* @__PURE__ */ import_react.default.createElement(import_antd.Form.Item, { name: "view_mode", noStyle: true }, /* @__PURE__ */ import_react.default.createElement(import_ViewMode.default, { view })), (dataSourceGroup == null ? void 0 : dataSourceGroup.show) && viewMode === "grid" && /* @__PURE__ */ import_react.default.createElement(import_antd.Form.Item, { name: "group_by", noStyle: true }, /* @__PURE__ */ import_react.default.createElement(import_Group.default, { setting: dataSourceGroup })), (columnSetting == null ? void 0 : columnSetting.show) && viewMode === "grid" && /* @__PURE__ */ import_react.default.createElement(import_antd.Form.Item, { name: ["column_setting"], noStyle: true }, /* @__PURE__ */ import_react.default.createElement(import_ColumnsSetting.default, null)), (columnSetting == null ? void 0 : columnSetting.show) && viewMode === "gallery" && /* @__PURE__ */ import_react.default.createElement(import_GallerySetting.default, { setting: gallery, currentViewMode: viewMode }), (sort == null ? void 0 : sort.show) ? /* @__PURE__ */ import_react.default.createElement(import_antd.Form.Item, { name: "order_by", noStyle: true }, /* @__PURE__ */ import_react.default.createElement(import_sort.default, { list: (sort == null ? void 0 : sort.list) || [], localPagination })) : null, !!(buttons == null ? void 0 : buttons.length) && /* @__PURE__ */ import_react.default.createElement(import_Buttons.default, { list: buttons }))) : null;
 };
 var Actions_default = Actions;

package/lib/components/table/Actions/index.less

@@ -1,6 +1,6 @@
 .materials-grid-actions {
   display: flex;
-  align-items: center;
+  align-items: start;
   justify-content: space-between;
   margin-bottom: 16px;
   gap: 16px;
@@ -8,7 +8,8 @@
   .left-wrap {
     flex: 1;
     display: flex;
-    align-items: center;
+    align-items: start;
+    gap: 8px;
 
     .pisell-lowcode-form-item {
       margin-bottom: 0;
@@ -18,7 +19,7 @@
   .right-wrap {
     display: flex;
     align-items: center;
-    gap: 8px;
+    gap: 12px;
 
     .icon {
       cursor: pointer;

package/lib/components/table/BasicTable/index.d.ts

@@ -1,4 +1,4 @@
-/// <reference types="react" />
 import { TableProps } from "antd";
-declare const BasicTable: (props: TableProps<any>) => JSX.Element;
+import React from "react";
+declare const BasicTable: (props: TableProps<any>) => React.JSX.Element;
 export default BasicTable;