@pisell/materials 1.0.27 → 1.0.28

package/lib/components/page/index.js

@@ -34,89 +34,164 @@ __export(page_exports, {
 module.exports = __toCommonJS(page_exports);
 var import_react = __toESM(require("react"));
 var import_config_provider = __toESM(require("../config-provider"));
+var import_AdapterDayjs = require("@pisell/date-picker/es/AdapterDayjs");
+var import_date_picker = require("@pisell/date-picker");
 var theme = {
-  components: {
-    Table: {
-      colorFillContent: "rgba(0, 0, 0, 0.06)",
-      colorFillSecondary: "rgba(0, 0, 0, 0.06)",
-      colorBorderSecondary: "#EAECF0",
-      colorFillAlter: "rgba(0, 0, 0, 0.02)"
+  "components": {
+    "Table": {
+      "colorFillContent": "#EAECF0",
+      "colorFillSecondary": "#F2F4F7",
+      "colorBorderSecondary": "#EAECF0",
+      "colorFillAlter": "#F9FAFB",
+      "controlItemBgHover": "#F9FAFB",
+      "colorTextHeading": "#475467",
+      "colorTextDescription": "#667085",
+      "colorText": "#101828",
+      "controlHeight": 32,
+      "padding": 24,
+      "margin": 16
+    },
+    "Button": {
+      "borderRadiusSM": 6,
+      "borderRadiusLG": 9,
+      "borderRadius": 8,
+      "controlHeight": 36,
+      "colorBgContainerDisabled": "#F2F4F7",
+      "colorBgTextHover": "#F9FAFB",
+      "colorBorder": "#D0D5DD",
+      "colorError": "#D92D20",
+      "colorErrorActive": "#D92D20",
+      "colorErrorHover": "#B42318",
+      "colorErrorBg": "#FEF3F2",
+      "colorErrorBorderHover": "#FDA29B",
+      "colorErrorOutline": "rgba(217, 45, 32, 0.06)",
+      "colorLink": "#175CD3",
+      "colorLinkActive": "#194185",
+      "colorLinkHover": "#1849A9",
+      "colorPrimaryActive": "#7f56d9",
+      "colorPrimaryBorder": "#E9D7FE",
+      "colorText": "#344054",
+      "colorTextDisabled": "#D0D5DD",
+      "colorTextLightSolid": "#fff",
+      "colorBgTextActive": "#D0D5DD",
+      "controlOutline": "rgba(127, 86, 217, 0.04)",
+      "controlTmpOutline": "#F9FAFB",
+      "paddingContentHorizontal": 14,
+      "marginXS": 8
+    },
+    "Divider": {
+      "colorSplit": "#EAECF0"
+    },
+    "Breadcrumb": {
+      "itemColor": "#475467",
+      "colorTextDescription": "#475467",
+      "lastItemColor": "#6941C6",
+      "separatorMargin": 12,
+      "separatorColor": "#D0D5DD",
+      "linkHoverColor": "#1D2939",
+      "linkColor": "#475467",
+      "colorBgTextHover": "#F9FAFB",
+      "paddingXXS": 8
+    },
+    "Dropdown": {
+      "borderRadiusLG": 8,
+      // "boxShadowPopoverArrow": "2px 2px 5px rgba(0, 0, 0, 0.05)",
+      "controlHeight": 42,
+      "fontSize": 14
+    },
+    "DatePicker": {
+      "borderRadius": 8,
+      "colorTextPlaceholder": "#667085",
+      "colorIcon": "#667085",
+      "colorTextQuaternary": "#D0D5DD",
+      "colorBgContainerDisabled": "#F9FAFB",
+      "colorTextDisabled": "#98A2B3"
     }
   },
-  token: {
-    colorPrimary: "#7F56D9",
-    colorPrimaryBg: "#F9F5FF",
-    colorPrimaryBgHover: "#F4EBFF",
-    colorPrimaryBorder: "#E9D7FE",
-    colorPrimaryBorderHover: "#D6BBFB",
-    colorPrimaryHover: "#6941C6",
-    colorPrimaryActive: "#53389E",
-    colorPrimaryTextHover: "#53389E",
-    colorPrimaryText: "#6941C6",
-    colorPrimaryTextActive: "#42307D",
-    colorSuccess: "#079455",
-    colorSuccessBg: "#ECFDF3",
-    colorSuccessBgHover: "#DCFAE6",
-    colorSuccessBorder: "#ABEFC6",
-    colorSuccessBorderHover: "#75E0A7",
-    colorSuccessHover: "#067647",
-    colorSuccessText: "#067647",
-    colorSuccessActive: "#085D3A",
-    colorSuccessTextHover: "#085D3A",
-    colorSuccessTextActive: "#074D31",
-    colorWarning: "#dc6803",
-    colorWarningBg: "#FFFAEB",
-    colorWarningBgHover: "#FEF0C7",
-    colorWarningBorder: "#FEDF89",
-    colorWarningBorderHover: "#FEC84B",
-    colorWarningHover: "#B54708",
-    colorWarningText: "#B54708",
-    colorWarningActive: "#93370D",
-    colorWarningTextHover: "#93370D",
-    colorWarningTextActive: "#7A2E0E",
-    colorError: "#d92d20",
-    colorErrorBg: "#FEF3F2",
-    colorErrorBgHover: "#FEE4E2",
-    colorErrorBorder: "#FECDCA",
-    colorErrorBorderHover: "#FDA29B",
-    colorErrorHover: "#B42318",
-    colorErrorText: "#B42318",
-    colorErrorActive: "#912018",
-    colorErrorTextHover: "#912018",
-    colorErrorTextActive: "#7A271A",
-    colorInfo: "#1570ef",
-    colorInfoBg: "#EFF8FF",
-    colorInfoBgHover: "#D1E9FF",
-    colorInfoBorder: "#B2DDFF",
-    colorInfoBorderHover: "#84CAFF",
-    colorInfoHover: "#175CD3",
-    colorInfoText: "#175CD3",
-    colorInfoActive: "#1849A9",
-    colorInfoTextHover: "#1849A9",
-    colorInfoTextActive: "#194185",
-    colorText: "#101828",
-    colorTextSecondary: "#475467",
-    colorTextTertiary: "#667085",
-    colorTextQuaternary: "#D0D5DD",
-    colorBorder: "#D0D5DD",
-    colorBorderSecondary: "#EAECF0",
-    colorFill: "#D0D5DD",
-    colorFillSecondary: "#EAECF0",
-    colorFillTertiary: "#F2F4F7",
-    colorFillQuaternary: "#F9FAFB",
-    colorBgLayout: "#F2F4F7",
-    colorBgSpotlight: "#101828",
-    colorBgMask: "rgba(0, 0, 0, 0.5)"
+  "token": {
+    "colorPrimary": "#7F56D9",
+    "colorPrimaryBg": "#F9F5FF",
+    "colorPrimaryBgHover": "#F4EBFF",
+    "colorPrimaryBorder": "#E9D7FE",
+    "colorPrimaryBorderHover": "#D6BBFB",
+    "colorPrimaryHover": "#6941C6",
+    "colorPrimaryActive": "#53389E",
+    "colorPrimaryTextHover": "#53389E",
+    "colorPrimaryText": "#6941C6",
+    "colorPrimaryTextActive": "#42307D",
+    "colorSuccess": "#079455",
+    "colorSuccessBg": "#ECFDF3",
+    "colorSuccessBgHover": "#DCFAE6",
+    "colorSuccessBorder": "#ABEFC6",
+    "colorSuccessBorderHover": "#75E0A7",
+    "colorSuccessHover": "#067647",
+    "colorSuccessText": "#067647",
+    "colorSuccessActive": "#085D3A",
+    "colorSuccessTextHover": "#085D3A",
+    "colorSuccessTextActive": "#074D31",
+    "colorWarning": "#dc6803",
+    "colorWarningBg": "#FFFAEB",
+    "colorWarningBgHover": "#FEF0C7",
+    "colorWarningBorder": "#FEDF89",
+    "colorWarningBorderHover": "#FEC84B",
+    "colorWarningHover": "#B54708",
+    "colorWarningText": "#B54708",
+    "colorWarningActive": "#93370D",
+    "colorWarningTextHover": "#93370D",
+    "colorWarningTextActive": "#7A2E0E",
+    "colorError": "#d92d20",
+    "colorErrorBg": "#FEF3F2",
+    "colorErrorBgHover": "#FEE4E2",
+    "colorErrorBorder": "#FECDCA",
+    "colorErrorBorderHover": "#FDA29B",
+    "colorErrorHover": "#B42318",
+    "colorErrorText": "#B42318",
+    "colorErrorActive": "#912018",
+    "colorErrorTextHover": "#912018",
+    "colorErrorTextActive": "#7A271A",
+    "colorInfo": "#1570ef",
+    "colorInfoBg": "#EFF8FF",
+    "colorInfoBgHover": "#D1E9FF",
+    "colorInfoBorder": "#B2DDFF",
+    "colorInfoBorderHover": "#84CAFF",
+    "colorInfoHover": "#175CD3",
+    "colorInfoText": "#175CD3",
+    "colorInfoActive": "#1849A9",
+    "colorInfoTextHover": "#1849A9",
+    "colorInfoTextActive": "#194185",
+    "colorText": "#101828",
+    "colorTextSecondary": "#475467",
+    "colorTextTertiary": "#667085",
+    "colorTextQuaternary": "#D0D5DD",
+    "colorBorder": "#D0D5DD",
+    "colorBorderSecondary": "#EAECF0",
+    "colorFill": "#D0D5DD",
+    "colorFillSecondary": "#EAECF0",
+    "colorFillTertiary": "#F2F4F7",
+    "colorFillQuaternary": "#F9FAFB",
+    "colorBgLayout": "#F2F4F7",
+    "colorBgSpotlight": "#101828",
+    "colorBgMask": "rgba(0, 0, 0, 0.5)",
+    "wireframe": false,
+    "borderRadius": 8
   }
 };
+var _a;
+var datePickerTheme = (0, import_date_picker.createTheme)({
+  palette: {
+    primary: { main: ((_a = theme.token) == null ? void 0 : _a.colorPrimary) || "#7F56D9" }
+  }
+});
 var Page = (props) => {
+  const { children, ...others } = props;
   return /* @__PURE__ */ import_react.default.createElement(
     import_config_provider.default,
     {
-      ...props,
+      ...others,
       prefixCls: props.prefixCls || "pisell-lowcode",
       theme: props.theme || theme
-    }
+    },
+    /* @__PURE__ */ import_react.default.createElement(import_date_picker.LocalizationProvider, { dateAdapter: import_AdapterDayjs.AdapterDayjs }, /* @__PURE__ */ import_react.default.createElement(import_date_picker.ThemeProvider, { theme: datePickerTheme }, children))
   );
 };
 var page_default = Page;

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

@@ -1,12 +1,12 @@
 import React from "react";
 export declare type SortItemProps = {
-    type: "single" | "input";
+    type: "date" | "string" | "number";
+    label: string;
     name: string;
-    props: object;
-    title: string;
 };
 declare type SortListProps = {
     list: SortItemProps[];
+    onChange?: (val: string) => void;
 };
 declare const Sort: React.FC<SortListProps>;
 export default Sort;

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

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAkB,MAAM,OAAO,CAAC;AAGvC,oBAAY,aAAa,GAAG;IAC3B,IAAI,EAAE,QAAQ,GAAG,OAAO,CAAC;IACzB,IAAI,EAAE,MAAM,CAAC;IACb,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,MAAM,CAAC;CACd,CAAC;AAEF,aAAK,aAAa,GAAG;IACpB,IAAI,EAAE,aAAa,EAAE,CAAC;CACtB,CAAC;AAaF,QAAA,MAAM,IAAI,EAAE,KAAK,CAAC,EAAE,CAAC,aAAa,CAEjC,CAAC;AAEF,eAAe,IAAI,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAkB,MAAM,OAAO,CAAC;AAGvC,oBAAY,aAAa,GAAG;IAC1B,IAAI,EAAE,MAAM,GAAG,QAAQ,GAAG,QAAQ,CAAC;IACnC,KAAK,EAAE,MAAM,CAAC;IACd,IAAI,EAAE,MAAM,CAAC;CACd,CAAC;AAEF,aAAK,aAAa,GAAG;IACnB,IAAI,EAAE,aAAa,EAAE,CAAC;IACtB,QAAQ,CAAC,EAAE,CAAC,GAAG,EAAE,MAAM,KAAK,IAAI,CAAC;CAClC,CAAC;AAmCF,QAAA,MAAM,IAAI,EAAE,KAAK,CAAC,EAAE,CAAC,aAAa,CAoBjC,CAAC;AAEF,eAAe,IAAI,CAAC"}

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

@@ -35,7 +35,52 @@ module.exports = __toCommonJS(Sort_exports);
 var import_react = __toESM(require("react"));
 var import_antd = require("antd");
 var import_icon = require("@pisell/icon");
-var Sort = ({ list = [] }) => {
-  return /* @__PURE__ */ import_react.default.createElement(import_antd.Button, { icon: /* @__PURE__ */ import_react.default.createElement(import_icon.SwitchVertical01, null) }, "Sort");
+var sortChildrenMap = {
+  date: (key) => [
+    {
+      key: `${key}:desc`,
+      label: "Oldest to newest"
+    },
+    {
+      key: `${key}:asc`,
+      label: "Newest to oldest"
+    }
+  ],
+  string: (key) => [
+    {
+      key: `${key}:asc`,
+      label: "A to Z"
+    },
+    {
+      key: `${key}:desc`,
+      label: "Z to A"
+    }
+  ],
+  number: (key) => [
+    {
+      key: `${key}:asc`,
+      label: "Lowest to highest"
+    },
+    {
+      key: `${key}:desc`,
+      label: "Highest to lowest"
+    }
+  ]
+};
+var Sort = ({ list = [], onChange }) => {
+  const sortItems = (0, import_react.useMemo)(() => {
+    return list.map((d) => {
+      return {
+        key: d.name,
+        label: d.label,
+        children: sortChildrenMap[d.type](d.name)
+      };
+    });
+  }, [list]);
+  const onClick = (detail) => {
+    var _a;
+    onChange == null ? void 0 : onChange((_a = detail == null ? void 0 : detail.keyPath) == null ? void 0 : _a[0]);
+  };
+  return /* @__PURE__ */ import_react.default.createElement(import_antd.Dropdown, { menu: { items: sortItems, onClick } }, /* @__PURE__ */ import_react.default.createElement(import_antd.Button, { icon: /* @__PURE__ */ import_react.default.createElement(import_icon.SwitchVertical01, null) }, "Sort"));
 };
 var Sort_default = Sort;

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

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["index.tsx"],"names":[],"mappings":";AAIA,OAAO,cAAc,CAAC;AAEtB,QAAA,MAAM,OAAO,qBAAsB,GAAG,uBAerC,CAAC;AAEF,eAAe,OAAO,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["index.tsx"],"names":[],"mappings":";AAKA,OAAO,cAAc,CAAC;AAEtB,QAAA,MAAM,OAAO,qBAAsB,GAAG,uBAmBrC,CAAC;AAEF,eAAe,OAAO,CAAC"}

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

@@ -33,12 +33,14 @@ __export(Actions_exports, {
 });
 module.exports = __toCommonJS(Actions_exports);
 var import_react = __toESM(require("react"));
+var import_antd = require("antd");
 var import_QuickFilter = __toESM(require("./Filter/QuickFilter"));
+var import_Sort = __toESM(require("./Sort"));
 var import_index = require("./index.less");
 var Actions = ({ filter, sort }) => {
   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_QuickFilter.default, null)), /* @__PURE__ */ import_react.default.createElement("div", { className: "right-wrap" })) : null;
+  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_QuickFilter.default, null)), /* @__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" }, /* @__PURE__ */ import_react.default.createElement(import_Sort.default, { list: (sort == null ? void 0 : sort.list) || [] })) : null)) : null;
 };
 var Actions_default = Actions;

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

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["index.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAS,UAAU,EAAE,MAAM,MAAM,CAAC;AAIzC,QAAA,MAAM,UAAU,UAAW,WAAW,GAAG,CAAC,gBA2EzC,CAAC;AAEF,eAAe,UAAU,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["index.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAS,UAAU,EAAE,MAAM,MAAM,CAAC;AAIzC,QAAA,MAAM,UAAU,UAAW,WAAW,GAAG,CAAC,gBAyEzC,CAAC;AAEF,eAAe,UAAU,CAAC"}

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

@@ -48,7 +48,7 @@ var BasicTable = (props) => {
     setCurrentPage(1);
   }, [dataSource]);
   (0, import_react.useEffect)(() => {
-    setPageSize(pagination == null ? void 0 : pagination.pageSize);
+    (pagination == null ? void 0 : pagination.pageSize) && setPageSize(pagination == null ? void 0 : pagination.pageSize);
   }, [pagination.pageSize]);
   const _dataSource = (0, import_react.useMemo)(() => {
     let list = (dataSource == null ? void 0 : dataSource.list) || [];
@@ -70,7 +70,6 @@ var BasicTable = (props) => {
     setCurrentPage(page);
     setPageSize(pageSize2);
   };
-  console.log(pagination, "pagination");
   return /* @__PURE__ */ import_react.default.createElement("div", null, /* @__PURE__ */ import_react.default.createElement(import_antd.Table, { ...other, pagination: false, dataSource: _dataSource == null ? void 0 : _dataSource.list }), total > (((_a = pagination == null ? void 0 : pagination.pageSizeOptions) == null ? void 0 : _a[0]) || 10) ? /* @__PURE__ */ import_react.default.createElement(
     import_Pagination.default,
     {

package/lib/components/table/Table/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["index.tsx"],"names":[],"mappings":"AAGA,OAAO,KAA+B,MAAM,OAAO,CAAC;AAIpD,OAAO,cAAc,CAAC;AAkBtB,QAAA,MAAM,aAAa,EAAE,KAAK,CAAC,EAAE,CAAC,GAAG,CAwHhC,CAAC;AAEF,eAAe,aAAa,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["index.tsx"],"names":[],"mappings":"AAGA,OAAO,KAA+B,MAAM,OAAO,CAAC;AAIpD,OAAO,cAAc,CAAC;AAkBtB,QAAA,MAAM,aAAa,EAAE,KAAK,CAAC,EAAE,CAAC,GAAG,CAuHhC,CAAC;AAEF,eAAe,aAAa,CAAC"}

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

@@ -100,7 +100,6 @@ var GridViewTable = ({ tableProps }) => {
   }, [defaultColumns]);
   const showTotal = (0, import_react.useCallback)(
     (total, range, pageSize) => {
-      console.log(range, "range");
       let start = range[0] - 1;
       let _current = start / pageSize + 1;
       return `Page ${_current} of ${Math.ceil(

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

@@ -10,4 +10,6 @@
 
   }
 
+
+
 }

package/lib/components/table/index.js

@@ -82,7 +82,7 @@ var GridView = (0, import_model.Provider)((props) => {
     });
   }, [filter]);
   const initialValues = (0, import_react.useMemo)(
-    () => (filter.list || []).reduce(
+    () => ((filter == null ? void 0 : filter.list) || []).reduce(
       (p, c) => {
         var _a;
         return {
@@ -92,7 +92,7 @@ var GridView = (0, import_model.Provider)((props) => {
       },
       {}
     ),
-    [filter.list]
+    [filter == null ? void 0 : filter.list]
   );
   return /* @__PURE__ */ import_react.default.createElement(
     import_antd.Form,

package/lowcode/table/meta.ts

@@ -966,6 +966,69 @@ export default {
           setter: 'BoolSetter',
           defaultValue: true,
         },
+        {
+          name: "sort.list",
+          condition: {
+            type: 'JSFunction',
+            value: 'target => !!target.getProps().getPropValue("sort.show")',
+          },
+          setter: {
+            componentName: 'ArraySetter',
+            props: {
+              itemSetter: {
+                componentName: 'ObjectSetter',
+                props: {
+                  config: {
+                    items: [
+                      {
+                        name: 'label',
+                        title: { label: '排序项', tip: '排序项展示文案' },
+                        propType: 'string',
+                        setter: 'StringSetter',
+                        isRequired: true,
+                      },
+                      {
+                        name: 'name',
+                        title: { label: '字段', tip: '所排序的字段' },
+                        propType: 'string',
+                        setter: 'StringSetter',
+                        isRequired: true,
+                      },
+                      {
+                        name: 'type',
+                        title: { label: '字段类型', tip: '所排序的字段类型' },
+                        propType: 'string',
+                        setter: {
+                          componentName: 'SelectSetter',
+                          mode: "single",
+                          defaultValue: "single",
+                          props: {
+                            options: [
+                              {
+                                title: '日期排序',
+                                value: 'date',
+                              },
+                              {
+                                title: '数字排序',
+                                value: 'number',
+                              },
+                              {
+                                title: 'a-z排序',
+                                value: 'string',
+                              },
+                            ],
+                          },
+                        },
+                      },
+                    ],
+                  },
+                },
+                initialValue: { label: '标题', name: "name", type: "date", },
+              },
+            },
+          },
+        }
+
       ]
     },
     {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@pisell/materials",
-  "version": "1.0.27",
+  "version": "1.0.28",
   "main": "./lib/index.js",
   "module": "./es/index.js",
   "types": "./lib/index.d.ts",
@@ -53,6 +53,7 @@
     "@dnd-kit/sortable": "^7.0.2",
     "@dnd-kit/utilities": "^3.2.1",
     "ahooks": "^3.7.6",
+    "@pisell/date-picker": "1.0.0",
     "@pisell/utils": "1.0.1",
     "@pisell/icon": "0.0.6"
   },