@pisell/private-materials 6.5.26 → 6.5.28

package/lib/components/authentication/admin/AuthMethods/AuthMethods.less

@@ -0,0 +1,136 @@
+.auth-methods {
+  background: #fff;
+  padding: 0;
+}
+
+.auth-methods-item {
+  display: flex;
+  align-items: center;
+  border: 1px solid #f0f0f0;
+  border-radius: 8px;
+  background: #fff;
+  margin-bottom: 12px;
+}
+
+.auth-methods-item-body {
+  display: flex;
+  flex: 1;
+  padding: 20px 24px 20px 0;
+  align-items: center;
+}
+
+.auth-methods-item:hover {
+  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
+}
+
+.auth-methods-item-drag {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  color: #d9d9d9;
+  font-size: 20px;
+  padding-left: 24px;
+  padding-right: 16px;
+  cursor: grab;
+  align-self: stretch;
+}
+
+.auth-methods-item-icon {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  width: 40px;
+  height: 40px;
+  margin-right: 16px;
+}
+
+.auth-methods-item-content {
+  flex: 1;
+  min-width: 0;
+}
+
+.auth-methods-item-header {
+  display: flex;
+  align-items: center;
+  margin-bottom: 4px;
+}
+
+.auth-methods-item-title {
+  font-size: 15px;
+  font-weight: 500;
+  color: #262626;
+  margin-right: 8px;
+}
+
+.auth-methods-item-category {
+  display: inline-block;
+  padding: 2px 8px;
+  border-radius: 4px;
+  font-size: 12px;
+  font-weight: 400;
+}
+
+.auth-methods-item-category.general {
+  color: #4096ff;
+  background: #e6f4ff;
+  border: 1px solid #91caff;
+}
+
+.auth-methods-item-category.password-free {
+  color: #52c41a;
+  background: #f6ffed;
+  border: 1px solid #b7eb8f;
+}
+
+.auth-methods-item-category.auth-free {
+  color: #8c8c8c;
+  background: #f5f5f5;
+  border: 1px solid #d9d9d9;
+}
+
+.auth-methods-item-category.oauth {
+  color: #722ed1;
+  background: #f9f0ff;
+  border: 1px solid #d3adf7;
+}
+
+.auth-methods-item-description {
+  font-size: 13px;
+  color: #8c8c8c;
+  line-height: 1.5;
+}
+
+.auth-methods-item-config-link {
+  font-size: 12px;
+  color: #4096ff;
+  display: inline-block;
+}
+
+.auth-methods-item-config-link .anticon {
+  margin-right: 4px;
+  font-size: 14px;
+}
+
+.auth-methods-item-config-link:hover {
+  text-decoration: underline;
+  cursor: pointer;
+}
+
+.auth-methods-item-actions {
+  display: flex;
+  align-items: center;
+  gap: 12px;
+  margin-left: 16px;
+}
+
+.auth-methods-dragging {
+  opacity: 0.5;
+  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
+}
+
+.auth-methods-empty {
+  padding: 48px 24px;
+  text-align: center;
+  color: #8c8c8c;
+}
+

package/lib/components/authentication/admin/AuthMethods/SettingList.d.ts

@@ -0,0 +1,5 @@
+import React from 'react';
+import { AuthMethodsProps } from './types';
+import './SettingList.less';
+declare const SettingList: React.FC<AuthMethodsProps>;
+export default SettingList;

package/lib/components/authentication/admin/AuthMethods/SettingList.js

@@ -0,0 +1,75 @@
+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/authentication/admin/AuthMethods/SettingList.tsx
+var SettingList_exports = {};
+__export(SettingList_exports, {
+  default: () => SettingList_default
+});
+module.exports = __toCommonJS(SettingList_exports);
+var import_react = __toESM(require("react"));
+var import_antd = require("antd");
+var import_classnames = __toESM(require("classnames"));
+var import_utils = require("@pisell/utils");
+var import_constants = require("./constants");
+var import_locales = __toESM(require("./locales"));
+var import_useEngineContext = __toESM(require("../../../../hooks/useEngineContext"));
+var import_SettingList = require("./SettingList.less");
+var SettingList = ({
+  className,
+  style,
+  methods: initialMethods,
+  onToggle,
+  onSettings,
+  onConfigClick,
+  enableSetting = true,
+  renderTitle
+}) => {
+  var _a, _b;
+  const context = (0, import_useEngineContext.default)();
+  import_utils.locales.init(import_locales.default, ((_b = (_a = context == null ? void 0 : context.engine) == null ? void 0 : _a.props) == null ? void 0 : _b.locale) || "en");
+  const methods = initialMethods || (0, import_constants.getDefaultAuthMethods)();
+  const handleSettings = (method) => {
+    onSettings == null ? void 0 : onSettings(method);
+  };
+  const shouldShowSettings = (method) => {
+    if (!enableSetting) {
+      return false;
+    }
+    return true;
+  };
+  return /* @__PURE__ */ import_react.default.createElement("div", { className: (0, import_classnames.default)("setting-list", className), style }, methods.map((method) => /* @__PURE__ */ import_react.default.createElement("div", { key: method.id, className: "setting-list-item" }, /* @__PURE__ */ import_react.default.createElement("div", { className: "setting-list-item-icon" }, method.icon), /* @__PURE__ */ import_react.default.createElement("div", { className: "setting-list-item-content" }, /* @__PURE__ */ import_react.default.createElement("div", { className: "setting-list-item-title" }, renderTitle ? renderTitle(method) : method.title), /* @__PURE__ */ import_react.default.createElement("div", { className: "setting-list-item-description" }, method.description)), /* @__PURE__ */ import_react.default.createElement("div", { className: "setting-list-item-actions" }, shouldShowSettings(method) && /* @__PURE__ */ import_react.default.createElement(
+    import_antd.Button,
+    {
+      type: "default",
+      onClick: () => handleSettings(method)
+    },
+    import_utils.locales.getText("auth.button.settings")
+  )))));
+};
+var SettingList_default = SettingList;

package/lib/components/authentication/admin/AuthMethods/SettingList.less

@@ -0,0 +1,85 @@
+.setting-list {
+  background: #fff;
+  padding: 0;
+  display: flex;
+  flex-direction: column;
+  gap: 16px;
+}
+
+.setting-list-item {
+  display: flex;
+  align-items: center;
+  padding: 20px 24px;
+  border: 1px solid #e8e8e8;
+  border-radius: 8px;
+  background: #ffffff;
+  transition: all 0.2s;
+}
+
+.setting-list-item:hover {
+  border-color: #d9d9d9;
+  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06);
+}
+
+.setting-list-item-icon {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  width: 48px;
+  height: 48px;
+  margin-right: 16px;
+  border-radius: 8px;
+  background: #fafafa;
+}
+
+.setting-list-item-content {
+  flex: 1;
+  min-width: 0;
+  display: flex;
+  flex-direction: column;
+  gap: 4px;
+}
+
+.setting-list-item-title {
+  font-size: 16px;
+  font-weight: 500;
+  color: #262626;
+}
+
+.setting-list-item-description {
+  font-size: 13px;
+  color: #8c8c8c;
+  line-height: 1.5;
+}
+
+.setting-list-item-status {
+  display: inline-flex;
+  align-items: center;
+}
+
+.setting-list-item-actions {
+  margin-left: 16px;
+}
+
+/* 响应式设计 */
+@media (max-width: 768px) {
+  .setting-list-item {
+    flex-direction: column;
+    align-items: flex-start;
+  }
+
+  .setting-list-item-icon {
+    margin-bottom: 12px;
+  }
+
+  .setting-list-item-actions {
+    margin-left: 0;
+    margin-top: 12px;
+    width: 100%;
+  }
+
+  .setting-list-item-actions button {
+    width: 100%;
+  }
+}
+

package/lib/components/authentication/admin/AuthMethods/SettingsDrawer.d.ts

@@ -0,0 +1,22 @@
+import React from 'react';
+import { AuthMethod } from './types';
+import { EmailSettings, PhoneSettings, DefaultSettings, PasswordRulesSettings } from './components';
+import './SettingsDrawer.less';
+interface SettingsDrawerProps {
+    open: boolean;
+    method: AuthMethod | null;
+    onClose: () => void;
+    onSave?: (settings: EmailSettings | PhoneSettings | DefaultSettings | PasswordRulesSettings) => void;
+    /**
+     * 模式：
+     * - 'auth-methods': 来自AuthMethods组件，显示所有设置包括启用/禁用
+     * - 'setting-list': 来自SettingList组件，不显示默认的启用/禁用设置
+     */
+    mode?: 'auth-methods' | 'setting-list';
+    /**
+     * 初始设置值
+     */
+    initialSettings?: EmailSettings | PhoneSettings | DefaultSettings | PasswordRulesSettings;
+}
+declare const SettingsDrawer: React.FC<SettingsDrawerProps>;
+export default SettingsDrawer;

package/lib/components/authentication/admin/AuthMethods/SettingsDrawer.js

@@ -0,0 +1,126 @@
+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/authentication/admin/AuthMethods/SettingsDrawer.tsx
+var SettingsDrawer_exports = {};
+__export(SettingsDrawer_exports, {
+  default: () => SettingsDrawer_default
+});
+module.exports = __toCommonJS(SettingsDrawer_exports);
+var import_react = __toESM(require("react"));
+var import_antd = require("antd");
+var import_utils = require("@pisell/utils");
+var import_types = require("./types");
+var import_components = require("./components");
+var import_SettingsDrawer = require("./SettingsDrawer.less");
+var import_locales = __toESM(require("./locales"));
+import_utils.locales.init(import_locales.default, localStorage.getItem("umi_locale") || "en");
+var SettingsDrawer = ({ open, method, onClose, onSave, mode = "auth-methods", initialSettings }) => {
+  const [currentSettings, setCurrentSettings] = import_react.default.useState(null);
+  const handleSave = () => {
+    if (currentSettings) {
+      onSave == null ? void 0 : onSave(currentSettings);
+    }
+    onClose();
+  };
+  const handleCancel = () => {
+    onClose();
+  };
+  const getDrawerTitle = () => {
+    if (!method) return import_utils.locales.getText("auth.email.settings");
+    if (method.type === import_types.AuthMethodType.EMAIL) {
+      return import_utils.locales.getText("auth.email.settings");
+    }
+    if (method.type === import_types.AuthMethodType.PHONE) {
+      return import_utils.locales.getText("auth.phone.settings");
+    }
+    if (method.type === import_types.AuthMethodType.PASSWORD_RULES) {
+      return import_utils.locales.getText("auth.password.settings");
+    }
+    return `${method.title} Settings`;
+  };
+  const handleSettingsChange = (settings) => {
+    setCurrentSettings(settings);
+    console.log("Settings changed:", settings);
+  };
+  const renderContent = () => {
+    if (!method) return null;
+    switch (method.type) {
+      case import_types.AuthMethodType.EMAIL:
+        return /* @__PURE__ */ import_react.default.createElement(
+          import_components.EmailSettingsContent,
+          {
+            initialSettings,
+            onSettingsChange: handleSettingsChange
+          }
+        );
+      case import_types.AuthMethodType.PHONE:
+        return /* @__PURE__ */ import_react.default.createElement(
+          import_components.PhoneSettingsContent,
+          {
+            initialSettings,
+            onSettingsChange: handleSettingsChange
+          }
+        );
+      case import_types.AuthMethodType.PASSWORD_RULES:
+        return /* @__PURE__ */ import_react.default.createElement(
+          import_components.PasswordRulesSettingsContent,
+          {
+            initialSettings,
+            onSettingsChange: handleSettingsChange
+          }
+        );
+      default:
+        if (mode === "setting-list") {
+          return /* @__PURE__ */ import_react.default.createElement("div", { className: "settings-section" }, /* @__PURE__ */ import_react.default.createElement("div", { className: "settings-section-description", style: { padding: "20px 0", color: "#8c8c8c" } }, import_utils.locales.getText("auth.settings.no.additional")));
+        }
+        return /* @__PURE__ */ import_react.default.createElement(
+          import_components.DefaultSettingsContent,
+          {
+            method,
+            onSettingsChange: handleSettingsChange
+          }
+        );
+    }
+  };
+  return /* @__PURE__ */ import_react.default.createElement(
+    import_antd.Drawer,
+    {
+      title: getDrawerTitle(),
+      placement: "right",
+      width: 640,
+      open,
+      onClose: handleCancel,
+      maskClosable: true,
+      keyboard: true,
+      footer: /* @__PURE__ */ import_react.default.createElement("div", { className: "drawer-footer" }, /* @__PURE__ */ import_react.default.createElement(import_antd.Button, { onClick: handleCancel }, import_utils.locales.getText("auth.button.cancel")), /* @__PURE__ */ import_react.default.createElement(import_antd.Button, { type: "primary", onClick: handleSave, style: { marginLeft: 8 } }, import_utils.locales.getText("auth.button.save")))
+    },
+    /* @__PURE__ */ import_react.default.createElement("div", { className: "settings-drawer-content", onClick: (e) => e.stopPropagation() }, renderContent())
+  );
+};
+var SettingsDrawer_default = SettingsDrawer;

package/lib/components/authentication/admin/AuthMethods/SettingsDrawer.less

@@ -0,0 +1,163 @@
+.settings-drawer-content {
+  padding-bottom: 80px;
+}
+
+.settings-section {
+  margin-bottom: 32px;
+}
+
+.settings-section-title {
+  font-size: 16px;
+  font-weight: 600;
+  color: #262626;
+  margin: 0 0 8px 0;
+}
+
+.settings-section-description {
+  font-size: 14px;
+  color: #8c8c8c;
+  margin-bottom: 16px;
+  line-height: 1.5;
+}
+
+.settings-item {
+  padding: 16px 0;
+}
+
+.settings-item-main {
+  display: flex;
+  align-items: flex-start;
+  gap: 12px;
+}
+
+.settings-item-content {
+  flex: 1;
+}
+
+.settings-item-title {
+  font-size: 15px;
+  font-weight: 500;
+  color: #262626;
+  margin-bottom: 4px;
+}
+
+.settings-item-description {
+  font-size: 13px;
+  color: #8c8c8c;
+  line-height: 1.5;
+}
+
+/* Verification Radio Group */
+.verification-radio-group {
+  width: 100%;
+  display: flex !important;
+  flex-direction: column !important;
+  gap: 12px;
+}
+
+.verification-option {
+  border: 1px solid #d9d9d9;
+  border-radius: 8px;
+  padding: 16px;
+  transition: all 0.3s;
+}
+
+.verification-option:hover {
+  border-color: #4096ff;
+  background: #fff;
+}
+
+.verification-option .ant-radio-wrapper {
+  width: 100%;
+  margin: 0;
+  align-items: flex-start;
+}
+
+.verification-option-content {
+  flex: 1;
+  margin-left: 8px;
+}
+
+.verification-option-title {
+  font-size: 15px;
+  font-weight: 500;
+  color: #262626;
+  margin-bottom: 4px;
+}
+
+.verification-option-description {
+  font-size: 13px;
+  color: #8c8c8c;
+  line-height: 1.5;
+}
+
+.verification-note {
+  margin-top: 16px !important;
+}
+
+/* Login Methods List */
+.login-methods-list {
+  display: flex;
+  flex-direction: column;
+  gap: 12px;
+}
+
+.login-method-item {
+  display: flex;
+  align-items: center;
+  padding: 16px;
+  border: 1px solid #d9d9d9;
+  border-radius: 8px;
+  background: #fff;
+  transition: all 0.3s;
+  cursor: move;
+}
+
+.login-method-item:hover {
+  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
+}
+
+.login-method-item.dragging {
+  opacity: 0.5;
+  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
+}
+
+.login-method-drag {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  margin-right: 12px;
+  color: #d9d9d9;
+  font-size: 16px;
+  cursor: grab;
+}
+
+.login-method-drag:active {
+  cursor: grabbing;
+}
+
+.login-method-content {
+  flex: 1;
+  min-width: 0;
+}
+
+.login-method-title {
+  font-size: 15px;
+  font-weight: 500;
+  color: #262626;
+  margin-bottom: 4px;
+}
+
+.login-method-description {
+  font-size: 13px;
+  color: #8c8c8c;
+  line-height: 1.5;
+}
+
+/* Drawer Footer */
+.drawer-footer {
+  display: flex;
+  justify-content: flex-end;
+  padding: 16px 0;
+}
+

package/lib/components/authentication/admin/AuthMethods/components/DefaultSettingsContent.d.ts

@@ -0,0 +1,11 @@
+import React from 'react';
+import { AuthMethod } from '../types';
+interface DefaultSettingsContentProps {
+    method: AuthMethod;
+    onSettingsChange?: (settings: DefaultSettings) => void;
+}
+export interface DefaultSettings {
+    enabled: boolean;
+}
+declare const DefaultSettingsContent: React.FC<DefaultSettingsContentProps>;
+export default DefaultSettingsContent;

package/lib/components/authentication/admin/AuthMethods/components/DefaultSettingsContent.js

@@ -0,0 +1,42 @@
+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/authentication/admin/AuthMethods/components/DefaultSettingsContent.tsx
+var DefaultSettingsContent_exports = {};
+__export(DefaultSettingsContent_exports, {
+  default: () => DefaultSettingsContent_default
+});
+module.exports = __toCommonJS(DefaultSettingsContent_exports);
+var import_react = __toESM(require("react"));
+var DefaultSettingsContent = ({
+  method,
+  onSettingsChange
+}) => {
+  return /* @__PURE__ */ import_react.default.createElement("div", { className: "settings-section" }, /* @__PURE__ */ import_react.default.createElement("div", { className: "settings-section-description", style: { padding: "20px 0", color: "#8c8c8c" } }, "No additional settings available for ", method.title));
+};
+var DefaultSettingsContent_default = DefaultSettingsContent;

package/lib/components/authentication/admin/AuthMethods/components/EmailSettingsContent.d.ts

@@ -0,0 +1,13 @@
+import React from 'react';
+import { LoginMethod } from './LoginMethodsList';
+interface EmailSettingsContentProps {
+    onSettingsChange?: (settings: EmailSettings) => void;
+    initialSettings?: EmailSettings;
+}
+export interface EmailSettings {
+    enableRegistration: boolean;
+    verificationType: 'link' | 'code';
+    loginMethods: LoginMethod[];
+}
+declare const EmailSettingsContent: React.FC<EmailSettingsContentProps>;
+export default EmailSettingsContent;