@pisell/private-materials 3.1.3 → 3.2.1

package/lib/components/workSpaceList/components/EditableString/index.js

@@ -0,0 +1,102 @@
+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/workSpaceList/components/EditableString/index.tsx
+var EditableString_exports = {};
+__export(EditableString_exports, {
+  default: () => EditableString_default
+});
+module.exports = __toCommonJS(EditableString_exports);
+var import_icon = require("@pisell/icon");
+var import_materials = require("@pisell/materials");
+var import_utils = require("@pisell/utils");
+var import_classnames = __toESM(require("classnames"));
+var import_react = __toESM(require("react"));
+var import_index = require("./index.less");
+var EditableString = (props) => {
+  const {
+    text,
+    style,
+    onChange,
+    editable,
+    editing: editingProps,
+    maxLength,
+    className,
+    ellipsis
+  } = props;
+  const [editing, setEditing] = (0, import_react.useState)(false);
+  const [originText, setOriginText] = (0, import_react.useState)(text);
+  const [temporaryValue, setTemporaryValue] = (0, import_react.useState)(text);
+  const inputRef = (0, import_react.useRef)(null);
+  const textRef = (0, import_react.useRef)(null);
+  (0, import_react.useEffect)(() => {
+    setOriginText(text);
+    setTemporaryValue(text);
+  }, [text]);
+  (0, import_react.useEffect)(() => {
+    (0, import_utils.isBoolean)(editingProps) && setEditing(editingProps);
+  }, [editingProps]);
+  (0, import_react.useEffect)(() => {
+    if (editing) {
+      setTimeout(() => {
+        var _a;
+        (_a = inputRef.current) == null ? void 0 : _a.focus();
+      });
+    }
+  }, [editing]);
+  (0, import_react.useEffect)(() => {
+    if (textRef.current) {
+      textRef.current.style.webkitLineClamp = ellipsis == null ? void 0 : ellipsis.row;
+    }
+  }, [ellipsis, editing]);
+  const handleChangeText = () => {
+    if (!temporaryValue) return;
+    onChange == null ? void 0 : onChange(temporaryValue);
+    setEditing(false);
+  };
+  const handleEdit = () => {
+    setEditing(true);
+  };
+  return (0, import_react.useMemo)(() => {
+    if (editing) {
+      return /* @__PURE__ */ import_react.default.createElement("span", { style }, /* @__PURE__ */ import_react.default.createElement(
+        import_materials.Input,
+        {
+          ref: inputRef,
+          value: temporaryValue,
+          onChange: (e) => setTemporaryValue(e.target.value),
+          onPressEnter: handleChangeText,
+          onBlur: handleChangeText,
+          maxLength
+        }
+      ));
+    }
+    return /* @__PURE__ */ import_react.default.createElement("div", { style, size: 16, className: (0, import_classnames.default)(className, "edit-wrap") }, /* @__PURE__ */ import_react.default.createElement("span", { className: "text", ref: textRef }, temporaryValue), editable && temporaryValue && /* @__PURE__ */ import_react.default.createElement(import_icon.Edit05, { className: "edit-icon", onClick: handleEdit }));
+  }, [editing, temporaryValue, ellipsis]);
+};
+var EditableString_default = EditableString;

package/lib/components/workSpaceList/components/EditableString/index.less

@@ -0,0 +1,14 @@
+.edit-wrap {
+  display: flex;
+  .text {
+    flex: 1;
+    overflow: hidden;
+    text-overflow: ellipsis;
+    display: -webkit-box;
+    -webkit-box-orient: vertical;
+    margin-right: 16px;
+  }
+}
+.edit-icon {
+  color: var(--gray-400, #98A2B3);
+}

package/lib/components/workSpaceList/components/Modal/antdConfirmPromise.d.ts

@@ -0,0 +1,13 @@
+import { ModalFuncProps } from './index';
+/**
+ * 获取确定或者取消 true false 的promise
+ * @param type confirm
+ * @param otherProps
+ */
+export declare function antdConfirmPromiseShell({ type, ...otherProps }: ModalFuncProps): Promise<boolean>;
+/**
+ * 同步阻塞式确认弹窗
+ * @param type
+ * @param otherProps
+ */
+export declare function antdConfirmPromise({ type, ...otherProps }: ModalFuncProps): Promise<void>;

package/lib/components/workSpaceList/components/Modal/antdConfirmPromise.js

@@ -0,0 +1,71 @@
+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/workSpaceList/components/Modal/antdConfirmPromise.ts
+var antdConfirmPromise_exports = {};
+__export(antdConfirmPromise_exports, {
+  antdConfirmPromise: () => antdConfirmPromise,
+  antdConfirmPromiseShell: () => antdConfirmPromiseShell
+});
+module.exports = __toCommonJS(antdConfirmPromise_exports);
+var import_index = __toESM(require("./index"));
+function antdConfirmPromiseShell({
+  type = "confirm",
+  ...otherProps
+}) {
+  return new Promise((resolve, reject) => {
+    import_index.default[type]({
+      onOk() {
+        resolve(true);
+      },
+      onCancel() {
+        resolve(false);
+      },
+      ...otherProps
+    });
+  });
+}
+async function antdConfirmPromise({
+  type = "confirm",
+  ...otherProps
+}) {
+  const result = await antdConfirmPromiseShell({
+    type,
+    ...otherProps
+  });
+  return new Promise((resolve) => {
+    if (result) {
+      resolve();
+    }
+  });
+}
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  antdConfirmPromise,
+  antdConfirmPromiseShell
+});

package/lib/components/workSpaceList/components/Modal/index.d.ts

@@ -0,0 +1,18 @@
+/// <reference types="react" />
+import { Modal as AntModal, ModalFuncProps as AntModalFuncProps, ModalProps as AntModalProps } from 'antd';
+import './index.less';
+interface ModalProps extends AntModalProps {
+    evenlyButton?: boolean;
+}
+declare type ModalComponent = typeof OriginModal & {
+    confirm: typeof AntModal.confirm;
+    warning: typeof AntModal.warning;
+    warn: typeof AntModal.warn;
+    error: typeof AntModal.error;
+    success: typeof AntModal.success;
+    info: typeof AntModal.info;
+};
+declare const OriginModal: (props: ModalProps) => JSX.Element;
+declare const Modal: ModalComponent;
+export declare type ModalFuncProps = AntModalFuncProps;
+export default Modal;

package/lib/components/workSpaceList/components/Modal/index.js

@@ -0,0 +1,74 @@
+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/workSpaceList/components/Modal/index.tsx
+var Modal_exports = {};
+__export(Modal_exports, {
+  default: () => Modal_default
+});
+module.exports = __toCommonJS(Modal_exports);
+var import_react = __toESM(require("react"));
+var import_materials = require("@pisell/materials");
+var import_antd = require("antd");
+var import_classnames = __toESM(require("classnames"));
+var import_index = require("./index.less");
+var DeleteIcon = () => {
+  return /* @__PURE__ */ import_react.default.createElement("div", { className: "delete-icon" }, /* @__PURE__ */ import_react.default.createElement(import_materials.Icon, { type: "pisell2-a-Property3shanchu", className: "icon" }));
+};
+var OriginModal = (props) => {
+  const { evenlyButton } = props;
+  return /* @__PURE__ */ import_react.default.createElement(
+    import_antd.Modal,
+    {
+      ...props,
+      wrapClassName: (0, import_classnames.default)(props.wrapClassName, {
+        ["pisell-modal-evenly-button"]: evenlyButton
+      })
+    }
+  );
+};
+var Modal = OriginModal;
+var confirm = (props) => {
+  return import_antd.Modal.confirm({
+    ...props,
+    className: (0, import_classnames.default)("pisell-confim-modal", props.className),
+    closable: true,
+    okButtonProps: {
+      type: "primary",
+      danger: true
+    },
+    icon: /* @__PURE__ */ import_react.default.createElement(DeleteIcon, null)
+  });
+};
+Modal.confirm = confirm;
+Modal.warning = import_antd.Modal.warning;
+Modal.warn = import_antd.Modal.warn;
+Modal.error = import_antd.Modal.error;
+Modal.success = import_antd.Modal.success;
+Modal.info = import_antd.Modal.info;
+var Modal_default = Modal;

package/lib/components/workSpaceList/components/Modal/index.less

@@ -0,0 +1,36 @@
+.pisell-modal-evenly-button {
+  :global {
+    .ant-modal-footer {
+      display: flex;
+      & > button {
+        flex: 1;
+      }
+    }
+  }
+}
+.delete-icon {
+  width: 48px;
+  height: 48px;
+  border-radius: 28px;
+  border: 8px solid var(--error-50, #fef3f2);
+  background: var(--error-100, #fee4e2);
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  margin-bottom: 16px;
+  .icon {
+    font-size: 24px;
+    color: var(--error-600, #d92d20);
+  }
+}
+.pisell-confim-modal {
+  :global {
+    .ant-modal-confirm-btns {
+      margin-top: 32px;
+      display: flex;
+      & > button {
+        flex: 1;
+      }
+    }
+  }
+}

package/lib/components/workSpaceList/components/SearchBar/index.d.ts

@@ -0,0 +1,17 @@
+import { CreateBaseModalProps } from './../CreateBaseModal';
+import { SortProps } from './../../../workSpaceList/components/Sort';
+import React from 'react';
+import './index.less';
+export interface SearchBarProps {
+    title: string;
+    describe?: string;
+    onTitleChange?: (value: string) => void;
+    onDescribeChange?: (value: string) => void;
+    onDelete?: () => void;
+    onSort?: SortProps['onChange'];
+    isDetail?: boolean;
+    onAddBase: CreateBaseModalProps['onAddBase'];
+    editingTitle?: boolean;
+}
+declare const SearchBar: React.FC<SearchBarProps>;
+export default SearchBar;

package/lib/components/workSpaceList/components/SearchBar/index.js

@@ -0,0 +1,163 @@
+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/workSpaceList/components/SearchBar/index.tsx
+var SearchBar_exports = {};
+__export(SearchBar_exports, {
+  default: () => SearchBar_default
+});
+module.exports = __toCommonJS(SearchBar_exports);
+var import_antdConfirmPromise = require("./../Modal/antdConfirmPromise");
+var import_CreateBaseModal = __toESM(require("./../CreateBaseModal"));
+var import_EditableString = __toESM(require("./../EditableString"));
+var import_SearchWorkspaceAndBase = __toESM(require("./../SearchWorkspaceAndBase"));
+var import_Sort = __toESM(require("./../../../workSpaceList/components/Sort"));
+var import_icons = require("@ant-design/icons");
+var import_icon = require("@pisell/icon");
+var import_materials = require("@pisell/materials");
+var import_classnames = __toESM(require("classnames"));
+var import_react = __toESM(require("react"));
+var import_index = require("./index.less");
+var operateItems = [
+  {
+    key: "rename",
+    label: "Rename workspace",
+    icon: /* @__PURE__ */ import_react.default.createElement(import_icon.Edit03, null)
+  },
+  {
+    key: "editDescription",
+    label: "Edit description",
+    icon: /* @__PURE__ */ import_react.default.createElement(import_icon.InfoCircle, null)
+  },
+  {
+    type: "divider"
+  },
+  {
+    key: "delete",
+    label: "Delete workspace",
+    icon: /* @__PURE__ */ import_react.default.createElement(import_icon.Trash01, null)
+  }
+];
+var SearchBar = (props) => {
+  const {
+    title,
+    onTitleChange,
+    onDescribeChange,
+    describe,
+    isDetail,
+    onDelete,
+    onSort,
+    onAddBase,
+    editingTitle: editingTitleProps
+  } = props;
+  const [editingTitle, setEditingTitle] = (0, import_react.useState)(editingTitleProps);
+  const [editingDescribe, setEditingDescribe] = (0, import_react.useState)(false);
+  const [open, setOpen] = (0, import_react.useState)(false);
+  const handleTitleChange = (val) => {
+    if (!val) return;
+    setEditingTitle(false);
+    if (title === val) return;
+    onTitleChange == null ? void 0 : onTitleChange(val);
+  };
+  const handleDescribeChange = (val) => {
+    setEditingDescribe(false);
+    if (val === describe) return;
+    onDescribeChange == null ? void 0 : onDescribeChange(val);
+  };
+  const handleGoBack = () => {
+    window.history.back();
+  };
+  const onDropdownClick = async ({ key }) => {
+    if (key === "rename") {
+      setEditingTitle(true);
+    } else if (key === "editDescription") {
+      setEditingDescribe(true);
+    } else if (key === "delete") {
+      await (0, import_antdConfirmPromise.antdConfirmPromise)({
+        type: "confirm",
+        title: "Are you sure you want to delete this workspace?",
+        content: "There is base in this Workspace, and deletion can cause all of the data in base and base to be deleted.",
+        okText: "Delete workspace"
+      });
+      onDelete == null ? void 0 : onDelete();
+    }
+  };
+  return /* @__PURE__ */ import_react.default.createElement(
+    "div",
+    {
+      className: (0, import_classnames.default)("search-bar-wrap", {
+        ["detail-wrap"]: isDetail
+      })
+    },
+    /* @__PURE__ */ import_react.default.createElement("div", { className: "line-1" }, /* @__PURE__ */ import_react.default.createElement("div", { className: "left", classNames: { item: "left-item" } }, isDetail && /* @__PURE__ */ import_react.default.createElement(import_icon.ArrowLeft, { onClick: handleGoBack, className: "back-icon" }), /* @__PURE__ */ import_react.default.createElement(
+      import_EditableString.default,
+      {
+        editing: editingTitle || editingTitleProps,
+        editable: isDetail,
+        text: title,
+        onChange: handleTitleChange,
+        maxLength: 200,
+        ellipsis: {
+          row: 1
+        },
+        className: "title"
+      }
+    )), /* @__PURE__ */ import_react.default.createElement(import_materials.Space, { className: "right", size: isDetail ? 24 : 16 }, isDetail && /* @__PURE__ */ import_react.default.createElement(import_SearchWorkspaceAndBase.default, null), /* @__PURE__ */ import_react.default.createElement(
+      import_materials.Button,
+      {
+        type: isDetail ? "primary" : void 0,
+        onClick: () => setOpen(true)
+      },
+      "Create a base"
+    ), /* @__PURE__ */ import_react.default.createElement(import_materials.Dropdown, { menu: { items: operateItems, onClick: onDropdownClick } }, /* @__PURE__ */ import_react.default.createElement(import_materials.Button, { icon: /* @__PURE__ */ import_react.default.createElement(import_icons.EllipsisOutlined, null) })))),
+    /* @__PURE__ */ import_react.default.createElement(
+      import_EditableString.default,
+      {
+        editing: editingDescribe,
+        editable: false,
+        text: describe || "",
+        onChange: handleDescribeChange,
+        className: "describe",
+        ellipsis: {
+          row: 3
+        },
+        maxLength: 500
+      }
+    ),
+    isDetail && /* @__PURE__ */ import_react.default.createElement("div", { className: "line-2" }, /* @__PURE__ */ import_react.default.createElement(import_Sort.default, { onChange: onSort })),
+    /* @__PURE__ */ import_react.default.createElement(
+      import_CreateBaseModal.default,
+      {
+        open,
+        onCancel: () => setOpen(false),
+        onAddBase
+      }
+    )
+  );
+};
+var SearchBar_default = SearchBar;

package/lib/components/workSpaceList/components/SearchBar/index.less

@@ -0,0 +1,60 @@
+.search-bar-wrap {
+  .line-1 {
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+    margin-bottom: 20px;
+    color: var(--gray-900, #101828);
+    font-size: 18px;
+    font-weight: 600;
+    line-height: 28px;
+    .left {
+      overflow: hidden;
+      margin-right: 24px;
+      display: flex;
+      .back-icon {
+        margin-right: 16px;
+      }
+      .title {
+        font-weight: bold;
+        width: 100%;
+      }
+    }
+  }
+  .line-2 {
+    color: var(--gray-600, #475467);
+    font-size: 14px;
+    font-weight: 600;
+    line-height: 20px;
+    display: inline-block;
+    cursor: pointer;
+    .type {
+      margin-right: 8px;
+    }
+  }
+  .describe {
+    color: var(--gray-600, #475467);
+    margin: 0 170px 20px 0;
+    display: flex;
+    overflow: hidden;
+    display: -webkit-box;
+    -webkit-line-clamp: 3; /* 设定显示的行数 */
+    -webkit-box-orient: vertical;
+    text-overflow: ellipsis;
+  }
+}
+
+.detail-wrap {
+  margin-bottom: 24px;
+  .line-1 {
+    font-size: 24px;
+    .left {
+      :global {
+        .anticon {
+          font-size: 20px;
+          cursor: pointer;
+        }
+      }
+    }
+  }
+}

package/lib/components/workSpaceList/components/SearchWorkspaceAndBase/index.d.ts

@@ -0,0 +1,3 @@
+import './../../index.less';
+declare const Search: () => JSX.Element;
+export default Search;