@pisell/materials 1.0.4 → 1.0.6

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

@@ -0,0 +1,23 @@
+import React from "react";
+import { Button } from "antd";
+import { SwitchVertical01 } from "@pisell/icon";
+// (
+// 	<Button.Group>
+// 		{list.map((d: FilterItemProps) => {
+// 			return (
+// 				<Form.Item noStyle name={d.name}>
+// 					<FilterItem item={d} />
+// 				</Form.Item>
+// 			);
+// 		})}
+// 	</Button.Group>
+// )
+
+var Sort = function Sort(_ref) {
+  var _ref$list = _ref.list,
+    list = _ref$list === void 0 ? [] : _ref$list;
+  return /*#__PURE__*/React.createElement(Button, {
+    icon: /*#__PURE__*/React.createElement(SwitchVertical01, null)
+  }, "Sort");
+};
+export default Sort;

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

@@ -1,4 +1,4 @@
 /// <reference types="react" />
 import "./index.less";
-declare const Actions: ({ filter, buttons }: any) => JSX.Element;
+declare const Actions: ({ filter, sort }: any) => JSX.Element | null;
 export default Actions;

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

@@ -1,20 +1,24 @@
-import React from "react";
+import React, { useMemo } from "react";
 import Filter from "./Filter";
-import Buttons from "./Buttons";
+import QuickFilter from "./Filter/QuickFilter";
+import Sort from "./Sort";
 import "./index.less";
 var Actions = function Actions(_ref) {
   var filter = _ref.filter,
-    buttons = _ref.buttons;
-  return /*#__PURE__*/React.createElement("div", {
+    sort = _ref.sort;
+  var showActions = useMemo(function () {
+    return (filter === null || filter === void 0 ? void 0 : filter.show) || (sort === null || sort === void 0 ? void 0 : sort.show);
+  }, [filter === null || filter === void 0 ? void 0 : filter.show, sort === null || sort === void 0 ? void 0 : sort.show]);
+  return showActions ? /*#__PURE__*/React.createElement("div", {
     className: "materials-grid-actions"
   }, /*#__PURE__*/React.createElement("div", {
     className: "left-wrap"
-  }), /*#__PURE__*/React.createElement("div", {
+  }, /*#__PURE__*/React.createElement(QuickFilter, null)), /*#__PURE__*/React.createElement("div", {
     className: "right-wrap"
-  }, /*#__PURE__*/React.createElement(Filter, {
-    list: filter
-  }), /*#__PURE__*/React.createElement(Buttons, {
-    list: buttons
-  })));
+  }, filter !== null && filter !== void 0 && filter.show ? /*#__PURE__*/React.createElement(Filter, {
+    list: (filter === null || filter === void 0 ? void 0 : filter.list) || []
+  }) : null, sort !== null && sort !== void 0 && sort.show ? /*#__PURE__*/React.createElement(Sort, {
+    list: (sort === null || sort === void 0 ? void 0 : sort.list) || []
+  }) : null)) : null;
 };
 export default Actions;

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

@@ -2,8 +2,16 @@
   display: flex;
   align-items: center;
   justify-content: space-between;
+  margin-bottom: 16px;
 
-  .left-wrap {}
+  .left-wrap {
+    flex: 1;
+    display: flex;
+    align-items: center;
+    .ant-form-item {
+      margin-bottom: 0;
+    }
+  }
 
   .right-wrap {
     display: flex;

package/es/components/table/{Actions → Header}/Buttons/index.js

@@ -4,7 +4,7 @@ import "./index.less";
 var Buttons = function Buttons(_ref) {
   var list = _ref.list;
   return (list || []).map(function (d) {
-    return /*#__PURE__*/React.createElement(Button, null, d.title);
+    return /*#__PURE__*/React.createElement(Button, d, d.title);
   });
 };
 export default Buttons;

package/es/components/table/Header/index.d.ts

@@ -0,0 +1,4 @@
+/// <reference types="react" />
+import "./index.less";
+declare const Header: ({ buttons, title }: any) => JSX.Element | null;
+export default Header;

package/es/components/table/Header/index.js

@@ -0,0 +1,20 @@
+import React, { useMemo } from "react";
+import Buttons from "./Buttons";
+import "./index.less";
+var Header = function Header(_ref) {
+  var buttons = _ref.buttons,
+    title = _ref.title;
+  var showHeader = useMemo(function () {
+    return title || (buttons === null || buttons === void 0 ? void 0 : buttons.length);
+  }, [buttons, title]);
+  return showHeader ? /*#__PURE__*/React.createElement("div", {
+    className: "materials-grid-header"
+  }, /*#__PURE__*/React.createElement("div", {
+    className: "left-wrap"
+  }, title && title()), /*#__PURE__*/React.createElement("div", {
+    className: "right-wrap"
+  }, /*#__PURE__*/React.createElement(Buttons, {
+    list: buttons
+  }))) : null;
+};
+export default Header;

package/es/components/table/Header/index.less

@@ -0,0 +1,16 @@
+.materials-grid-header {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  margin-bottom: 16px;
+
+  .left-wrap {}
+
+  .right-wrap {
+    display: flex;
+    align-items: center;
+    gap: 8px;
+
+
+  }
+}

package/es/components/table/Pagination/index.d.ts

@@ -1,5 +1,11 @@
-/// <reference types="react" />
+import React from "react";
 import { PaginationProps } from "antd";
 import "./index.less";
-declare const Pagination: (props: PaginationProps) => JSX.Element;
+export declare const paginationConfig: {
+    className: string;
+    defaultCurrent: number;
+    showTotal: (total: number, range: [number, number]) => string;
+    itemRender: (page: number, type: "page" | "next" | "prev" | "jump-prev" | "jump-next", element: React.ReactNode) => React.ReactNode;
+};
+declare const Pagination: (props: PaginationProps) => JSX.Element | null;
 export default Pagination;

package/es/components/table/Pagination/index.js

@@ -1,35 +1,39 @@
 function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
-import React from "react";
-import Iconfont from "../../iconfont";
+import React, { useMemo } from "react";
+import { ArrowLeft, ArrowRight } from "@pisell/icon";
 import { Pagination as OriginPagination } from "antd";
 import classNames from "classnames";
 import "./index.less";
+var itemRender = function itemRender(_, type, originalElement) {
+  if (type === "prev") {
+    return /*#__PURE__*/React.createElement("div", {
+      className: classNames("paginator-page-btn", "left")
+    }, /*#__PURE__*/React.createElement(ArrowLeft, {
+      className: "paginator-page-btn-left-icon"
+    }), /*#__PURE__*/React.createElement("span", null, "Previous"));
+  }
+  if (type === "next") {
+    return /*#__PURE__*/React.createElement("div", {
+      className: classNames("paginator-page-btn", "right")
+    }, /*#__PURE__*/React.createElement("span", null, "Next"), /*#__PURE__*/React.createElement(ArrowRight, {
+      className: "paginator-page-btn-right-icon"
+    }));
+  }
+  return originalElement;
+};
+export var paginationConfig = {
+  className: "materials-grid-paginator",
+  defaultCurrent: 1,
+  showTotal: function showTotal(total, range) {
+    return "Page ".concat(range[0], " of ").concat(range[1]);
+  },
+  itemRender: itemRender
+};
 var Pagination = function Pagination(props) {
-  var itemRender = function itemRender(_, type, originalElement) {
-    if (type === "prev") {
-      return /*#__PURE__*/React.createElement("div", {
-        className: classNames("paginator-page-btn", "left")
-      }, /*#__PURE__*/React.createElement(Iconfont, {
-        type: "icona-iconArrowsLine",
-        className: "icon"
-      }), "Pre");
-    }
-    if (type === "next") {
-      return /*#__PURE__*/React.createElement("div", {
-        className: classNames("paginator-page-btn", "right")
-      }, "Next", /*#__PURE__*/React.createElement(Iconfont, {
-        type: "icona-iconArrowsLine",
-        className: "icon"
-      }));
-    }
-    return originalElement;
-  };
-  return /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement(OriginPagination, _extends({
-    className: "materials-grid-paginator",
-    defaultCurrent: 1,
-    showSizeChanger: false,
-    total: 500,
-    itemRender: itemRender
-  }, props)));
+  console.log(props);
+  var show = useMemo(function () {
+    return Object.keys(props).length;
+  }, [props]);
+  return show ? /*#__PURE__*/React.createElement(OriginPagination, _extends({}, paginationConfig, props)) : null;
 };
 export default Pagination;

package/es/components/table/Pagination/index.less

@@ -10,14 +10,56 @@
   border: 1px solid #f0f0f0;
   border-top: none;
   padding: 0 20px;
+  margin: 0 !important;
+
+  .ant-pagination-total-text {
+    margin-right: auto;
+    color: var(--gray-500, #667085);
+    /* Text sm/Medium */
+    font-family: Inter;
+    font-size: 14px;
+    font-style: normal;
+    font-weight: 500;
+    /* 142.857% */
+  }
 
   .ant-pagination-item {
     position: relative;
     border: none;
+    margin: 0;
+    border-radius: 0;
+    border: 1px solid #D0D5DD;
+    border-right: 0;
+  }
+
+  .ant-pagination-jump-prev {
+    border: 1px solid #D0D5DD;
+    margin: 0;
+    border-radius: 0;
+    border-right: none;
+  }
+
+  .ant-pagination-jump-next {
+    border: 1px solid #D0D5DD;
+    margin: 0;
+    border-radius: 0;
+    border-right: none;
+  }
+
+  .ant-pagination-item-link:hover {
+    font-weight: 450 !important;
+    color: rgba(0, 0, 0, 0.88) !important;
+
+    .ant-pagination-item-link-icon {
+      font-weight: 450 !important;
+      color: rgba(0, 0, 0, 0.88) !important;
+    }
   }
 
-  .ant-pagination-disabled {
-    opacity: 0.4;
+  .ant-pagination-disabled {}
+
+  .ant-pagination-item-active:hover {
+    border-color: #D0D5DD !important;
   }
 
   .ant-pagination-item-active {
@@ -34,18 +76,23 @@
     display: flex;
     align-items: center;
     justify-content: center;
-    margin-right: auto;
     min-width: auto;
+    border: 1px solid #D0D5DD;
+    margin: 0;
+    border-radius: 8px 0 0 8px;
+    border-right: none;
   }
 
-  .ant-pagination-item-active {}
 
   .ant-pagination-next {
     display: flex;
     align-items: center;
     justify-content: center;
-    margin-left: auto;
     min-width: auto;
+    border: 1px solid #D0D5DD;
+    // border-left: none;
+    margin: 0;
+    border-radius: 0 8px 8px 0;
   }
 }
 
@@ -54,14 +101,22 @@
   align-items: center;
   justify-content: center;
   border-radius: 4px 4px 4px 4px;
-  padding: 0 4px;
   transition: 0.2s;
   font-size: 12px;
   font-weight: 400;
   color: #6f6f6f;
   cursor: pointer;
   user-select: none;
-  height: 20px;
+  padding: 10px 16px;
+
+  .paginator-page-btn-left-icon,
+  .paginator-page-btn-right-icon {
+    font-size: 20px;
+  }
+
+  .paginator-page-btn-left-icon {}
+
+  .paginator-page-btn-right-icon {}
 
   &:hover {
     // background: #f2f2f2;

package/es/components/table/Summary/index.d.ts

@@ -0,0 +1,4 @@
+/// <reference types="react" />
+import "./index.less";
+declare const Summary: ({ summary }: any) => JSX.Element | null;
+export default Summary;

package/es/components/table/Summary/index.js

@@ -0,0 +1,12 @@
+import React, { useMemo } from "react";
+import "./index.less";
+var Summary = function Summary(_ref) {
+  var summary = _ref.summary;
+  var showSummary = useMemo(function () {
+    return !!summary;
+  }, [summary]);
+  return showSummary ? /*#__PURE__*/React.createElement("div", {
+    className: "materials-grid-summary"
+  }, summary()) : null;
+};
+export default Summary;

package/es/components/table/Summary/index.less

@@ -0,0 +1,5 @@
+.materials-grid-summary {
+
+  margin-bottom: 16px;
+
+}

package/es/components/table/Table/fields/date/Config/index.d.ts

@@ -0,0 +1,3 @@
+/// <reference types="react" />
+declare const Config: () => JSX.Element;
+export default Config;

package/es/components/table/Table/fields/date/Config/index.js

@@ -0,0 +1,4 @@
+var Config = function Config() {
+  return /*#__PURE__*/React.createElement("div", null);
+};
+export default Config;

package/es/components/table/Table/fields/date/Edit/index.d.ts

@@ -0,0 +1,4 @@
+/// <reference types="react" />
+import { EditPropsType } from "../../types";
+declare const _default: import("react").ForwardRefExoticComponent<Omit<EditPropsType, "ref"> & import("react").RefAttributes<any>>;
+export default _default;

package/es/components/table/Table/fields/date/Edit/index.js

@@ -0,0 +1,42 @@
+import { isString } from "@pisell/utils";
+import dayjs from "dayjs";
+import { forwardRef, useMemo } from "react";
+import DatePicker from "../../../../../date-picker";
+var Edit = function Edit(props, ref) {
+  var value = props.value,
+    _onChange = props.onChange,
+    onPressEnter = props.onPressEnter,
+    onBlur = props.onBlur,
+    style = props.style,
+    bordered = props.bordered;
+  var dayjsVal = useMemo(function () {
+    if (value && isString(value)) {
+      return dayjs(value);
+    }
+    return value;
+  }, [value]);
+  return /*#__PURE__*/React.createElement(DatePicker, {
+    controls: false,
+    ref: ref,
+    value: dayjsVal,
+    onChange: function onChange(date, dateStr) {
+      _onChange === null || _onChange === void 0 ? void 0 : _onChange(dateStr);
+    },
+    onPressEnter: onPressEnter,
+    onBlur: onBlur,
+    style: style,
+    bordered: bordered,
+    onClick: function onClick(e) {
+      return e.stopPropagation();
+    },
+    panelRender: function panelRender(dom) {
+      // 面板点击时阻止外部toggleEdit
+      return /*#__PURE__*/React.createElement("div", {
+        onClick: function onClick(e) {
+          return e.stopPropagation();
+        }
+      }, dom);
+    }
+  });
+};
+export default /*#__PURE__*/forwardRef(Edit);

package/es/components/table/Table/fields/date/Show/index.d.ts

@@ -0,0 +1,4 @@
+/// <reference types="react" />
+import { FieldPropsType } from "../../types";
+declare const Show: (props: FieldPropsType) => JSX.Element;
+export default Show;

package/es/components/table/Table/fields/{text/Preview → date/Show}/index.js

@@ -1,11 +1,9 @@
-var _excluded = ["title", "editable", "children", "dataIndex", "field_type", "record", "handleSave"];
+var _excluded = ["title", "editable", "dataIndex", "field_type", "record", "handleSave"];
 function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
 function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
-import React from "react";
-var Text = function Text(props) {
+var Show = function Show(props) {
   var title = props.title,
     editable = props.editable,
-    children = props.children,
     dataIndex = props.dataIndex,
     field_type = props.field_type,
     record = props.record,
@@ -15,4 +13,4 @@ var Text = function Text(props) {
     className: ""
   }, record[dataIndex]);
 };
-export default Text;
+export default Show;

package/es/components/table/Table/fields/date/Sort/index.d.ts

@@ -0,0 +1,3 @@
+/// <reference types="react" />
+declare const Sort: () => JSX.Element;
+export default Sort;

package/es/components/table/Table/fields/date/Sort/index.js

@@ -0,0 +1,4 @@
+var Sort = function Sort() {
+  return /*#__PURE__*/React.createElement("div", null);
+};
+export default Sort;

package/es/components/table/Table/fields/date/index.d.ts

@@ -0,0 +1,14 @@
+/// <reference types="react" />
+declare const _default: {
+    field: {
+        field_icon: string;
+        field_name: string;
+        field_type: string;
+        default_value: string;
+    };
+    config: () => JSX.Element;
+    edit: import("react").ForwardRefExoticComponent<Omit<import("../types").EditPropsType, "ref"> & import("react").RefAttributes<any>>;
+    sort: () => JSX.Element;
+    show: (props: import("../types").FieldPropsType) => JSX.Element;
+};
+export default _default;

package/es/components/table/Table/fields/date/index.js

@@ -0,0 +1,17 @@
+import Config from "./Config";
+import Edit from "./Edit";
+import Show from "./Show";
+import Sort from "./Sort";
+var field = {
+  field_icon: 'pi-a-Property3Singlelinetext',
+  field_name: 'Date',
+  field_type: 'date',
+  default_value: 'Date'
+};
+export default {
+  field: field,
+  config: Config,
+  edit: Edit,
+  sort: Sort,
+  show: Show
+};

package/es/components/table/Table/fields/image/Config/index.d.ts

@@ -0,0 +1,3 @@
+/// <reference types="react" />
+declare const Config: () => JSX.Element;
+export default Config;

package/es/components/table/Table/fields/image/Config/index.js

@@ -0,0 +1,4 @@
+var Config = function Config() {
+  return /*#__PURE__*/React.createElement("div", null);
+};
+export default Config;

package/es/components/table/Table/fields/image/Edit/index.d.ts

@@ -0,0 +1,4 @@
+/// <reference types="react" />
+import { EditPropsType } from "../../types";
+declare const _default: import("react").ForwardRefExoticComponent<Omit<EditPropsType, "ref"> & import("react").RefAttributes<any>>;
+export default _default;

package/es/components/table/Table/fields/image/Edit/index.js

@@ -0,0 +1,23 @@
+import { forwardRef } from "react";
+import Input from "../../../../../input";
+var Edit = function Edit(props, ref) {
+  var value = props.value,
+    onChange = props.onChange,
+    onPressEnter = props.onPressEnter,
+    onBlur = props.onBlur,
+    style = props.style,
+    bordered = props.bordered;
+  return /*#__PURE__*/React.createElement(Input, {
+    bordered: bordered,
+    ref: ref,
+    value: value,
+    onChange: onChange,
+    style: style,
+    onBlur: onBlur,
+    onPressEnter: onPressEnter,
+    onClick: function onClick(e) {
+      return e.stopPropagation();
+    }
+  });
+};
+export default /*#__PURE__*/forwardRef(Edit);

package/es/components/table/Table/fields/image/Show/index.d.ts

@@ -0,0 +1,4 @@
+/// <reference types="react" />
+import { FieldPropsType } from "../../types";
+declare const Show: (props: FieldPropsType) => JSX.Element;
+export default Show;

package/es/components/table/Table/fields/image/Show/index.js

@@ -0,0 +1,19 @@
+var _excluded = ["title", "editable", "dataIndex", "field_type", "record", "handleSave"];
+function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
+function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
+var Show = function Show(props) {
+  var title = props.title,
+    editable = props.editable,
+    dataIndex = props.dataIndex,
+    field_type = props.field_type,
+    record = props.record,
+    handleSave = props.handleSave,
+    restProps = _objectWithoutProperties(props, _excluded);
+  return /*#__PURE__*/React.createElement("div", {
+    className: ""
+  }, /*#__PURE__*/React.createElement("img", {
+    src: record[dataIndex],
+    alt: ""
+  }));
+};
+export default Show;

package/es/components/table/Table/fields/image/Sort/index.d.ts

@@ -0,0 +1,3 @@
+/// <reference types="react" />
+declare const Sort: () => JSX.Element;
+export default Sort;

package/es/components/table/Table/fields/image/Sort/index.js

@@ -0,0 +1,4 @@
+var Sort = function Sort() {
+  return /*#__PURE__*/React.createElement("div", null);
+};
+export default Sort;

package/es/components/table/Table/fields/image/index.d.ts

@@ -0,0 +1,14 @@
+/// <reference types="react" />
+declare const _default: {
+    field: {
+        field_icon: string;
+        field_name: string;
+        field_type: string;
+        default_value: string;
+    };
+    config: () => JSX.Element;
+    edit: import("react").ForwardRefExoticComponent<Omit<import("../types").EditPropsType, "ref"> & import("react").RefAttributes<any>>;
+    sort: () => JSX.Element;
+    show: (props: import("../types").FieldPropsType) => JSX.Element;
+};
+export default _default;

package/es/components/table/Table/fields/image/index.js

@@ -0,0 +1,17 @@
+import Config from "./Config";
+import Edit from "./Edit";
+import Show from "./Show";
+import Sort from "./Sort";
+var field = {
+  field_icon: "pi-a-Property3Singlelinetext",
+  field_name: "Image",
+  field_type: "image",
+  default_value: "image"
+};
+export default {
+  field: field,
+  config: Config,
+  edit: Edit,
+  sort: Sort,
+  show: Show
+};