@pisell/materials 6.0.6 → 6.0.7
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/build/lowcode/assets-daily.json +11 -11
- package/build/lowcode/assets-dev.json +2 -2
- package/build/lowcode/assets-prod.json +11 -11
- package/build/lowcode/index.js +1 -1
- package/build/lowcode/meta.js +7 -7
- package/build/lowcode/preview.js +8 -8
- package/build/lowcode/render/default/view.css +1 -1
- package/build/lowcode/render/default/view.js +21 -53
- package/build/lowcode/view.css +1 -1
- package/build/lowcode/view.js +18 -50
- package/es/components/config-provider/index.js +1 -1
- package/es/components/dataSourceComponents/dataSourceForm/BaseForm.js +20 -11
- package/es/components/dataSourceComponents/dataSourceForm/formItem.js +1 -1
- package/es/components/dataSourceComponents/dataSourceForm/group/index.less +2 -2
- package/es/components/dataSourceComponents/dataSourceForm/index.js +4 -2
- package/es/components/dataSourceComponents/dataSourceForm/provider/formSetting/FormSettingContext.d.ts +4 -0
- package/es/components/dataSourceComponents/dataSourceForm/provider/formSetting/FormSettingProvider.js +11 -3
- package/es/components/dataSourceComponents/dataSourceForm/provider/jsonWrapper/JsonWrapperProvider.js +10 -3
- package/es/components/dataSourceComponents/dataSourceForm/serve.d.ts +3 -2
- package/es/components/dataSourceComponents/dataSourceForm/serve.js +36 -20
- package/es/components/dataSourceComponents/dataSourceForm/submitButton/index.js +46 -25
- package/es/components/dataSourceComponents/dataSourceForm/type.d.ts +5 -0
- package/es/components/dataSourceComponents/dataSourceForm/utils.d.ts +3 -1
- package/es/components/dataSourceComponents/dataSourceForm/utils.js +38 -10
- package/es/components/dataSourceComponents/dataSourceTable/filter/index.js +1 -1
- package/es/components/dataSourceComponents/dataSourceTable/hooks/useColumns.js +4 -1
- package/es/components/dataSourceComponents/dataSourceTable/hooks/useTableProps.d.ts +7 -0
- package/es/components/dataSourceComponents/dataSourceTable/hooks/useTableProps.js +28 -5
- package/es/components/dataSourceComponents/dataSourceTable/index.js +4 -2
- package/es/components/dataSourceComponents/dataSourceTable/type.d.ts +9 -1
- package/es/components/dataSourceComponents/fields/Input.Phone/WithMode.js +7 -1
- package/es/components/dataSourceComponents/fields/Input.Url/ReadPretty.d.ts +1 -0
- package/es/components/dataSourceComponents/fields/Input.Url/ReadPretty.js +16 -1
- package/es/components/dataSourceComponents/fields/Input.Url/ReadPretty.less +1 -1
- package/es/components/dataSourceComponents/fields/Select/index.js +7 -1
- package/es/components/dataSourceComponents/fields/Upload/serve.d.ts +4 -1
- package/es/components/dataSourceComponents/fields/Upload/serve.js +10 -31
- package/es/components/dataSourceComponents/hooks/useActions.d.ts +2 -1
- package/es/components/dataSourceComponents/hooks/useActions.js +73 -36
- package/es/components/dataSourceComponents/provider/dataSource/DataSourceContext.d.ts +7 -0
- package/es/components/dataSourceComponents/provider/dataSource/DataSourceProvider.js +3 -1
- package/es/components/dataSourceComponents/provider/variables/VariablesProvider.js +49 -3
- package/es/components/login-and-register/index.d.ts +82 -0
- package/es/components/login-and-register/index.js +360 -0
- package/es/components/login-and-register/index.less +211 -0
- package/es/components/organizationTenantSwitcher/defaultLogo.png +0 -0
- package/es/components/organizationTenantSwitcher/index.d.ts +17 -0
- package/es/components/organizationTenantSwitcher/index.js +96 -0
- package/es/components/organizationTenantSwitcher/index.less +88 -0
- package/es/components/page/index.js +4 -4
- package/es/components/page-header/index.d.ts +14 -0
- package/es/components/page-header/index.js +36 -0
- package/es/components/page-header/index.less +45 -0
- package/es/components/pisellAvatar/index.d.ts +19 -0
- package/es/components/pisellAvatar/index.js +89 -0
- package/es/components/pisellAvatar/index.less +26 -0
- package/es/components/pisellModal/components/PcModal/index.js +1 -1
- package/es/components/pisellTags/index.d.ts +13 -0
- package/es/components/pisellTags/index.js +83 -0
- package/es/components/pisellTags/index.less +17 -0
- package/es/components/pisellTags/utils.d.ts +1 -0
- package/es/components/pisellTags/utils.js +89 -0
- package/es/components/pisellText/components/Amount/index.js +1 -1
- package/es/components/profileMenu/index.d.ts +26 -0
- package/es/components/profileMenu/index.js +115 -0
- package/es/components/profileMenu/index.less +135 -0
- package/es/components/table/Header/index.js +8 -11
- package/es/index.d.ts +6 -0
- package/es/index.js +7 -1
- package/es/locales/en-US.d.ts +1 -0
- package/es/locales/en-US.js +1 -0
- package/es/locales/zh-CN.d.ts +1 -0
- package/es/locales/zh-CN.js +1 -0
- package/es/locales/zh-TW.d.ts +1 -0
- package/es/locales/zh-TW.js +1 -0
- package/lib/components/config-provider/index.js +1 -1
- package/lib/components/dataSourceComponents/dataSourceForm/BaseForm.js +22 -4
- package/lib/components/dataSourceComponents/dataSourceForm/formItem.js +1 -1
- package/lib/components/dataSourceComponents/dataSourceForm/group/index.less +2 -2
- package/lib/components/dataSourceComponents/dataSourceForm/index.js +3 -2
- package/lib/components/dataSourceComponents/dataSourceForm/provider/formSetting/FormSettingContext.d.ts +4 -0
- package/lib/components/dataSourceComponents/dataSourceForm/provider/formSetting/FormSettingProvider.js +17 -3
- package/lib/components/dataSourceComponents/dataSourceForm/provider/jsonWrapper/JsonWrapperProvider.js +16 -6
- package/lib/components/dataSourceComponents/dataSourceForm/serve.d.ts +3 -2
- package/lib/components/dataSourceComponents/dataSourceForm/serve.js +9 -5
- package/lib/components/dataSourceComponents/dataSourceForm/submitButton/index.js +15 -4
- package/lib/components/dataSourceComponents/dataSourceForm/type.d.ts +5 -0
- package/lib/components/dataSourceComponents/dataSourceForm/utils.d.ts +3 -1
- package/lib/components/dataSourceComponents/dataSourceForm/utils.js +51 -5
- package/lib/components/dataSourceComponents/dataSourceTable/filter/index.js +1 -1
- package/lib/components/dataSourceComponents/dataSourceTable/hooks/useColumns.js +4 -1
- package/lib/components/dataSourceComponents/dataSourceTable/hooks/useTableProps.d.ts +7 -0
- package/lib/components/dataSourceComponents/dataSourceTable/hooks/useTableProps.js +24 -3
- package/lib/components/dataSourceComponents/dataSourceTable/index.js +2 -2
- package/lib/components/dataSourceComponents/dataSourceTable/type.d.ts +9 -1
- package/lib/components/dataSourceComponents/fields/Input.Phone/WithMode.js +6 -1
- package/lib/components/dataSourceComponents/fields/Input.Url/ReadPretty.d.ts +1 -0
- package/lib/components/dataSourceComponents/fields/Input.Url/ReadPretty.js +17 -2
- package/lib/components/dataSourceComponents/fields/Input.Url/ReadPretty.less +1 -1
- package/lib/components/dataSourceComponents/fields/Select/index.js +5 -1
- package/lib/components/dataSourceComponents/fields/Upload/serve.d.ts +4 -1
- package/lib/components/dataSourceComponents/fields/Upload/serve.js +20 -12
- package/lib/components/dataSourceComponents/hooks/useActions.d.ts +2 -1
- package/lib/components/dataSourceComponents/hooks/useActions.js +25 -7
- package/lib/components/dataSourceComponents/provider/dataSource/DataSourceContext.d.ts +7 -0
- package/lib/components/dataSourceComponents/provider/dataSource/DataSourceProvider.js +3 -1
- package/lib/components/dataSourceComponents/provider/variables/VariablesProvider.js +49 -3
- package/lib/components/login-and-register/index.d.ts +82 -0
- package/lib/components/login-and-register/index.js +261 -0
- package/lib/components/login-and-register/index.less +211 -0
- package/lib/components/organizationTenantSwitcher/defaultLogo.png +0 -0
- package/lib/components/organizationTenantSwitcher/index.d.ts +17 -0
- package/lib/components/organizationTenantSwitcher/index.js +119 -0
- package/lib/components/organizationTenantSwitcher/index.less +88 -0
- package/lib/components/page/index.js +4 -4
- package/lib/components/page-header/index.d.ts +14 -0
- package/lib/components/page-header/index.js +63 -0
- package/lib/components/page-header/index.less +45 -0
- package/lib/components/pisellAvatar/index.d.ts +19 -0
- package/lib/components/pisellAvatar/index.js +108 -0
- package/lib/components/pisellAvatar/index.less +26 -0
- package/lib/components/pisellModal/components/PcModal/index.js +1 -1
- package/lib/components/pisellTags/index.d.ts +13 -0
- package/lib/components/pisellTags/index.js +113 -0
- package/lib/components/pisellTags/index.less +17 -0
- package/lib/components/pisellTags/utils.d.ts +1 -0
- package/lib/components/pisellTags/utils.js +86 -0
- package/lib/components/pisellText/components/Amount/index.js +2 -2
- package/lib/components/profileMenu/index.d.ts +26 -0
- package/lib/components/profileMenu/index.js +113 -0
- package/lib/components/profileMenu/index.less +135 -0
- package/lib/components/table/Header/index.js +11 -1
- package/lib/index.d.ts +6 -0
- package/lib/index.js +18 -0
- package/lib/locales/en-US.d.ts +1 -0
- package/lib/locales/en-US.js +1 -0
- package/lib/locales/zh-CN.d.ts +1 -0
- package/lib/locales/zh-CN.js +1 -0
- package/lib/locales/zh-TW.d.ts +1 -0
- package/lib/locales/zh-TW.js +1 -0
- package/lowcode/_utils/defaultSchema.ts +64 -0
- package/lowcode/data-source-form/meta.ts +130 -0
- package/lowcode/data-source-form/utils.ts +33 -3
- package/lowcode/data-source-table/meta.ts +139 -3
- package/lowcode/data-source-table/utils.tsx +6 -0
- package/lowcode/form-item-date-picker/snippets.ts +3 -0
- package/lowcode/form-item-input/snippets.ts +3 -1
- package/lowcode/form-item-input-number/snippets.ts +4 -0
- package/lowcode/form-item-input.email/snippets.ts +3 -0
- package/lowcode/form-item-input.json/snippets.ts +4 -1
- package/lowcode/form-item-input.password/snippets.ts +3 -0
- package/lowcode/form-item-input.phone/snippets.ts +3 -0
- package/lowcode/form-item-input.text-area/snippets.ts +3 -1
- package/lowcode/form-item-input.url/snippets.ts +3 -0
- package/lowcode/form-item-select/meta.ts +2 -1
- package/lowcode/form-item-select/snippets.ts +6 -0
- package/lowcode/form-item-time-picker/snippets.ts +3 -0
- package/lowcode/form-item-translation/snippets.ts +3 -1
- package/lowcode/login-and-register/meta.ts +541 -0
- package/lowcode/login-and-register/snippets.ts +38 -0
- package/lowcode/organization-tenant-switch/meta.ts +127 -0
- package/lowcode/page-header/meta.ts +68 -124
- package/lowcode/page-header/snippets.ts +1 -1
- package/lowcode/pisell-avatar/__screenshots__/avatar-1.jpg +0 -0
- package/lowcode/pisell-avatar/meta.ts +111 -0
- package/lowcode/pisell-avatar/snippets.ts +14 -0
- package/lowcode/pisell-tags/__screenshots__/tag-1.png +0 -0
- package/lowcode/pisell-tags/meta.ts +123 -0
- package/lowcode/pisell-tags/snippets.ts +14 -0
- package/lowcode/profile-menu/meta.ts +175 -0
- package/lowcode/profile-menu/snippets.ts +71 -0
- package/lowcode/submit-button/meta.ts +6 -0
- package/package.json +3 -3
|
@@ -88,6 +88,13 @@ export declare type DataSourceContextProps = {
|
|
|
88
88
|
list?: boolean;
|
|
89
89
|
get?: boolean;
|
|
90
90
|
};
|
|
91
|
+
extraParams?: {
|
|
92
|
+
list?: Record<string, any>;
|
|
93
|
+
get?: Record<string, any>;
|
|
94
|
+
update?: Record<string, any>;
|
|
95
|
+
create?: Record<string, any>;
|
|
96
|
+
destroy?: Record<string, any>;
|
|
97
|
+
};
|
|
91
98
|
__id?: string;
|
|
92
99
|
__designMode?: string;
|
|
93
100
|
};
|
|
@@ -44,6 +44,7 @@ var DataSourceProvider = (props) => {
|
|
|
44
44
|
children,
|
|
45
45
|
dataSource: propsDataSource,
|
|
46
46
|
currentValue,
|
|
47
|
+
extraParams,
|
|
47
48
|
actions: externalActions,
|
|
48
49
|
overrideData,
|
|
49
50
|
autoRun,
|
|
@@ -55,7 +56,8 @@ var DataSourceProvider = (props) => {
|
|
|
55
56
|
const standardActions = (0, import_useActions.default)({
|
|
56
57
|
dataSource,
|
|
57
58
|
currentValue,
|
|
58
|
-
__designMode
|
|
59
|
+
__designMode,
|
|
60
|
+
extraParams
|
|
59
61
|
});
|
|
60
62
|
const list = (externalActions == null ? void 0 : externalActions.list) || standardActions.list;
|
|
61
63
|
const get = (externalActions == null ? void 0 : externalActions.get) || standardActions.get;
|
|
@@ -35,6 +35,7 @@ module.exports = __toCommonJS(VariablesProvider_exports);
|
|
|
35
35
|
var import_react = __toESM(require("react"));
|
|
36
36
|
var import_utils = require("@pisell/utils");
|
|
37
37
|
var import_ahooks = require("ahooks");
|
|
38
|
+
var import_useEngineContext = __toESM(require("../../../../hooks/useEngineContext"));
|
|
38
39
|
var import_VariablesContext = __toESM(require("./VariablesContext"));
|
|
39
40
|
var import_utils2 = require("../../dataSourceForm/utils");
|
|
40
41
|
var import_utils3 = require("../../../../utils");
|
|
@@ -46,9 +47,54 @@ var defaultCustomizer = (objValue, srcValue) => {
|
|
|
46
47
|
};
|
|
47
48
|
var VARIABLE_PATTERN = /{{([^}]+)}}/g;
|
|
48
49
|
var VariablesProvider = (props) => {
|
|
50
|
+
var _a;
|
|
49
51
|
const { children, variables } = props;
|
|
50
|
-
const
|
|
52
|
+
const context = (0, import_useEngineContext.default)();
|
|
53
|
+
const { getApp } = ((_a = context == null ? void 0 : context.appHelper) == null ? void 0 : _a.utils) || {};
|
|
54
|
+
const initialQuery = (0, import_react.useMemo)(() => {
|
|
55
|
+
var _a2, _b, _c;
|
|
56
|
+
const currentLocation = (_c = (_b = (_a2 = getApp == null ? void 0 : getApp()) == null ? void 0 : _a2.history) == null ? void 0 : _b.instance) == null ? void 0 : _c.location;
|
|
57
|
+
if (currentLocation == null ? void 0 : currentLocation.search) {
|
|
58
|
+
const searchParams = new URLSearchParams(currentLocation.search);
|
|
59
|
+
const query = {};
|
|
60
|
+
searchParams.forEach((value2, key) => {
|
|
61
|
+
query[key] = value2;
|
|
62
|
+
});
|
|
63
|
+
return query;
|
|
64
|
+
}
|
|
65
|
+
return {};
|
|
66
|
+
}, []);
|
|
67
|
+
const variablesRef = (0, import_react.useRef)(
|
|
68
|
+
(0, import_utils3.mergeWith)(
|
|
69
|
+
variables,
|
|
70
|
+
{
|
|
71
|
+
global: {
|
|
72
|
+
query: initialQuery
|
|
73
|
+
}
|
|
74
|
+
},
|
|
75
|
+
defaultCustomizer
|
|
76
|
+
)
|
|
77
|
+
);
|
|
51
78
|
const listenersRef = (0, import_react.useRef)(/* @__PURE__ */ new Set());
|
|
79
|
+
const setQueryVariable = (0, import_ahooks.useMemoizedFn)((search) => {
|
|
80
|
+
const searchParams = new URLSearchParams(search);
|
|
81
|
+
const query = {};
|
|
82
|
+
searchParams.forEach((value2, key) => {
|
|
83
|
+
query[key] = value2;
|
|
84
|
+
});
|
|
85
|
+
registerVariable({
|
|
86
|
+
global: query
|
|
87
|
+
});
|
|
88
|
+
});
|
|
89
|
+
(0, import_react.useEffect)(() => {
|
|
90
|
+
var _a2, _b, _c;
|
|
91
|
+
const unlisten = (_c = (_b = (_a2 = getApp == null ? void 0 : getApp()) == null ? void 0 : _a2.history) == null ? void 0 : _b.instance) == null ? void 0 : _c.listen((location) => {
|
|
92
|
+
setQueryVariable(location.search);
|
|
93
|
+
});
|
|
94
|
+
return () => {
|
|
95
|
+
unlisten == null ? void 0 : unlisten();
|
|
96
|
+
};
|
|
97
|
+
}, []);
|
|
52
98
|
const registerVariable = (0, import_ahooks.useMemoizedFn)((value2) => {
|
|
53
99
|
variablesRef.current = (0, import_utils3.mergeWith)(
|
|
54
100
|
variablesRef.current,
|
|
@@ -82,11 +128,11 @@ var VariablesProvider = (props) => {
|
|
|
82
128
|
);
|
|
83
129
|
const parseVariable = (0, import_ahooks.useMemoizedFn)(
|
|
84
130
|
(str, localVariables = {}) => {
|
|
85
|
-
var
|
|
131
|
+
var _a2;
|
|
86
132
|
if (!(0, import_utils.isString)(str)) {
|
|
87
133
|
return str;
|
|
88
134
|
}
|
|
89
|
-
if (((
|
|
135
|
+
if (((_a2 = str.match(VARIABLE_PATTERN)) == null ? void 0 : _a2[0]) === str) {
|
|
90
136
|
const key = (0, import_utils4.getVariableKey)(str);
|
|
91
137
|
if (!key)
|
|
92
138
|
return str;
|
|
@@ -0,0 +1,82 @@
|
|
|
1
|
+
import React from 'react';
|
|
2
|
+
import './index.less';
|
|
3
|
+
/**
|
|
4
|
+
* loginAndRegister组件的属性接口
|
|
5
|
+
*/
|
|
6
|
+
export interface loginAndRegisterProps {
|
|
7
|
+
/** Logo相关配置 */
|
|
8
|
+
showLogo?: boolean;
|
|
9
|
+
logo?: string;
|
|
10
|
+
logoPosition?: 'left' | 'center' | 'right';
|
|
11
|
+
logoSize?: {
|
|
12
|
+
width?: number;
|
|
13
|
+
height?: number;
|
|
14
|
+
};
|
|
15
|
+
/** 标题相关配置 */
|
|
16
|
+
title?: string;
|
|
17
|
+
showTitle?: boolean;
|
|
18
|
+
titleAlign?: 'left' | 'center' | 'right';
|
|
19
|
+
/** 副标题相关配置 */
|
|
20
|
+
subtitle?: string;
|
|
21
|
+
showSubtitle?: boolean;
|
|
22
|
+
subtitleAlign?: 'left' | 'center' | 'right';
|
|
23
|
+
/** 登录方式配置 */
|
|
24
|
+
loginMethods?: ('email' | 'google' | 'facebook' | 'apple')[];
|
|
25
|
+
defaultLoginMethod?: 'email' | 'google' | 'facebook' | 'apple';
|
|
26
|
+
/** 表单配置 */
|
|
27
|
+
emailLabel?: string;
|
|
28
|
+
passwordLabel?: string;
|
|
29
|
+
emailPlaceholder?: string;
|
|
30
|
+
passwordPlaceholder?: string;
|
|
31
|
+
emailRules?: any[];
|
|
32
|
+
buttonText?: string;
|
|
33
|
+
rememberMeText?: string;
|
|
34
|
+
forgotPasswordText?: string;
|
|
35
|
+
showRememberMe?: boolean;
|
|
36
|
+
showForgotPassword?: boolean;
|
|
37
|
+
/** 社交登录配置 */
|
|
38
|
+
socialLoginTexts?: {
|
|
39
|
+
google?: string;
|
|
40
|
+
facebook?: string;
|
|
41
|
+
apple?: string;
|
|
42
|
+
};
|
|
43
|
+
/** 底部配置 */
|
|
44
|
+
showFooter?: boolean;
|
|
45
|
+
showSignUp?: boolean;
|
|
46
|
+
signUpText?: string;
|
|
47
|
+
signUpLink?: string;
|
|
48
|
+
signUpPosition?: 'left' | 'center' | 'right';
|
|
49
|
+
otherLinks?: Array<{
|
|
50
|
+
text: string;
|
|
51
|
+
url: string;
|
|
52
|
+
}>;
|
|
53
|
+
otherLinksPosition?: 'left' | 'center' | 'right';
|
|
54
|
+
/** 登录/注册切换配置 */
|
|
55
|
+
showTabs?: boolean;
|
|
56
|
+
loginTabText?: string;
|
|
57
|
+
registerTabText?: string;
|
|
58
|
+
/** 注册表单配置 */
|
|
59
|
+
registerEmailPlaceholder?: string;
|
|
60
|
+
registerPasswordPlaceholder?: string;
|
|
61
|
+
registerButtonText?: string;
|
|
62
|
+
/** 事件回调 */
|
|
63
|
+
onLogin?: (values: {
|
|
64
|
+
email: string;
|
|
65
|
+
loginMethod: string;
|
|
66
|
+
}) => void;
|
|
67
|
+
onSocialLogin?: (type: 'google' | 'facebook' | 'apple') => void;
|
|
68
|
+
onSignUp?: () => void;
|
|
69
|
+
onRegister?: (values: {
|
|
70
|
+
email: string;
|
|
71
|
+
password: string;
|
|
72
|
+
}) => void;
|
|
73
|
+
/** 新增背景图片属性 */
|
|
74
|
+
backgroundImage?: string;
|
|
75
|
+
}
|
|
76
|
+
/**
|
|
77
|
+
* Saas登录组件
|
|
78
|
+
* @param props - 组件属性
|
|
79
|
+
* @returns React组件
|
|
80
|
+
*/
|
|
81
|
+
declare const loginAndRegister: React.FC<loginAndRegisterProps>;
|
|
82
|
+
export default loginAndRegister;
|
|
@@ -0,0 +1,261 @@
|
|
|
1
|
+
var __create = Object.create;
|
|
2
|
+
var __defProp = Object.defineProperty;
|
|
3
|
+
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
|
|
4
|
+
var __getOwnPropNames = Object.getOwnPropertyNames;
|
|
5
|
+
var __getProtoOf = Object.getPrototypeOf;
|
|
6
|
+
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
|
7
|
+
var __export = (target, all) => {
|
|
8
|
+
for (var name in all)
|
|
9
|
+
__defProp(target, name, { get: all[name], enumerable: true });
|
|
10
|
+
};
|
|
11
|
+
var __copyProps = (to, from, except, desc) => {
|
|
12
|
+
if (from && typeof from === "object" || typeof from === "function") {
|
|
13
|
+
for (let key of __getOwnPropNames(from))
|
|
14
|
+
if (!__hasOwnProp.call(to, key) && key !== except)
|
|
15
|
+
__defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
|
|
16
|
+
}
|
|
17
|
+
return to;
|
|
18
|
+
};
|
|
19
|
+
var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
|
|
20
|
+
// If the importer is in node compatibility mode or this is not an ESM
|
|
21
|
+
// file that has been converted to a CommonJS file using a Babel-
|
|
22
|
+
// compatible transform (i.e. "__esModule" has not been set), then set
|
|
23
|
+
// "default" to the CommonJS "module.exports" for node compatibility.
|
|
24
|
+
isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
|
|
25
|
+
mod
|
|
26
|
+
));
|
|
27
|
+
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
|
|
28
|
+
|
|
29
|
+
// src/components/login-and-register/index.tsx
|
|
30
|
+
var login_and_register_exports = {};
|
|
31
|
+
__export(login_and_register_exports, {
|
|
32
|
+
default: () => login_and_register_default
|
|
33
|
+
});
|
|
34
|
+
module.exports = __toCommonJS(login_and_register_exports);
|
|
35
|
+
var import_react = __toESM(require("react"));
|
|
36
|
+
var import_antd = require("antd");
|
|
37
|
+
var import_icons = require("@ant-design/icons");
|
|
38
|
+
var import_index = require("./index.less");
|
|
39
|
+
var loginAndRegister = ({
|
|
40
|
+
showLogo = true,
|
|
41
|
+
logo,
|
|
42
|
+
logoPosition = "center",
|
|
43
|
+
logoSize = { width: 48, height: 48 },
|
|
44
|
+
title = "Log in to your account",
|
|
45
|
+
showTitle = false,
|
|
46
|
+
titleAlign = "center",
|
|
47
|
+
subtitle = "Welcome back! Please enter your details.",
|
|
48
|
+
showSubtitle = false,
|
|
49
|
+
subtitleAlign = "center",
|
|
50
|
+
loginMethods = ["email", "google", "facebook", "apple"],
|
|
51
|
+
defaultLoginMethod = "email",
|
|
52
|
+
emailLabel = "Email",
|
|
53
|
+
passwordLabel = "Password",
|
|
54
|
+
emailPlaceholder = "Enter your email",
|
|
55
|
+
passwordPlaceholder = "Enter your password",
|
|
56
|
+
emailRules = [
|
|
57
|
+
{ required: true, message: "Please input your email!" },
|
|
58
|
+
{ type: "email", message: "Please enter a valid email!" }
|
|
59
|
+
],
|
|
60
|
+
buttonText = "Log in",
|
|
61
|
+
socialLoginTexts = {
|
|
62
|
+
google: "Continue with Google",
|
|
63
|
+
facebook: "Continue with Facebook",
|
|
64
|
+
apple: "Continue with Apple"
|
|
65
|
+
},
|
|
66
|
+
showFooter = true,
|
|
67
|
+
showSignUp = true,
|
|
68
|
+
signUpText = "Don't have an account? Sign up",
|
|
69
|
+
signUpLink = "",
|
|
70
|
+
signUpPosition = "center",
|
|
71
|
+
otherLinks = [],
|
|
72
|
+
otherLinksPosition = "center",
|
|
73
|
+
showTabs = true,
|
|
74
|
+
loginTabText = "Login",
|
|
75
|
+
registerTabText = "Register",
|
|
76
|
+
registerEmailPlaceholder = "Enter your email",
|
|
77
|
+
registerPasswordPlaceholder = "Create a password",
|
|
78
|
+
registerButtonText = "Create account",
|
|
79
|
+
rememberMeText = "Remember me",
|
|
80
|
+
forgotPasswordText = "Forgot password?",
|
|
81
|
+
showRememberMe = false,
|
|
82
|
+
showForgotPassword = false,
|
|
83
|
+
onLogin,
|
|
84
|
+
onSocialLogin,
|
|
85
|
+
onSignUp,
|
|
86
|
+
onRegister,
|
|
87
|
+
backgroundImage = "/login-illustration.png"
|
|
88
|
+
}) => {
|
|
89
|
+
const [form] = import_antd.Form.useForm();
|
|
90
|
+
const [loading, setLoading] = (0, import_react.useState)(false);
|
|
91
|
+
const [activeTab, setActiveTab] = (0, import_react.useState)("login");
|
|
92
|
+
(0, import_react.useEffect)(() => {
|
|
93
|
+
document.body.id = "body";
|
|
94
|
+
}, []);
|
|
95
|
+
const handleEmailLogin = async () => {
|
|
96
|
+
try {
|
|
97
|
+
setLoading(true);
|
|
98
|
+
const values = await form.validateFields();
|
|
99
|
+
onLogin == null ? void 0 : onLogin({ ...values, loginMethod: "email" });
|
|
100
|
+
} catch (error) {
|
|
101
|
+
console.error("Validation failed:", error);
|
|
102
|
+
} finally {
|
|
103
|
+
setLoading(false);
|
|
104
|
+
}
|
|
105
|
+
};
|
|
106
|
+
const handleSocialLogin = (type) => {
|
|
107
|
+
onSocialLogin == null ? void 0 : onSocialLogin(type);
|
|
108
|
+
};
|
|
109
|
+
const handleRegister = async () => {
|
|
110
|
+
try {
|
|
111
|
+
setLoading(true);
|
|
112
|
+
const values = await form.validateFields();
|
|
113
|
+
onRegister == null ? void 0 : onRegister(values);
|
|
114
|
+
} catch (error) {
|
|
115
|
+
console.error("Validation failed:", error);
|
|
116
|
+
} finally {
|
|
117
|
+
setLoading(false);
|
|
118
|
+
}
|
|
119
|
+
};
|
|
120
|
+
return /* @__PURE__ */ import_react.default.createElement("div", { className: "saas-login-main" }, /* @__PURE__ */ import_react.default.createElement("div", { className: "saas-login-container" }, showLogo && /* @__PURE__ */ import_react.default.createElement(
|
|
121
|
+
"div",
|
|
122
|
+
{
|
|
123
|
+
className: `saas-login-logo ${logoPosition}`
|
|
124
|
+
},
|
|
125
|
+
logo && /* @__PURE__ */ import_react.default.createElement("img", { src: logo, alt: "logo" })
|
|
126
|
+
), showTitle && /* @__PURE__ */ import_react.default.createElement("h1", { className: "saas-login-title", style: { textAlign: titleAlign } }, title), showSubtitle && /* @__PURE__ */ import_react.default.createElement("p", { className: "saas-login-subtitle", style: { textAlign: subtitleAlign } }, subtitle), showTabs && /* @__PURE__ */ import_react.default.createElement("div", { className: "saas-login-tabs" }, /* @__PURE__ */ import_react.default.createElement(
|
|
127
|
+
"div",
|
|
128
|
+
{
|
|
129
|
+
className: `tab ${activeTab === "login" ? "active" : ""}`,
|
|
130
|
+
onClick: () => setActiveTab("login")
|
|
131
|
+
},
|
|
132
|
+
loginTabText
|
|
133
|
+
), /* @__PURE__ */ import_react.default.createElement(
|
|
134
|
+
"div",
|
|
135
|
+
{
|
|
136
|
+
className: `tab ${activeTab === "register" ? "active" : ""}`,
|
|
137
|
+
onClick: () => setActiveTab("register")
|
|
138
|
+
},
|
|
139
|
+
registerTabText
|
|
140
|
+
)), /* @__PURE__ */ import_react.default.createElement("div", { className: "saas-login-form" }, activeTab === "login" ? /* @__PURE__ */ import_react.default.createElement(import_antd.Form, { form }, /* @__PURE__ */ import_react.default.createElement("div", { className: "form-item-label" }, emailLabel), /* @__PURE__ */ import_react.default.createElement(
|
|
141
|
+
import_antd.Form.Item,
|
|
142
|
+
{
|
|
143
|
+
name: "email",
|
|
144
|
+
rules: emailRules
|
|
145
|
+
},
|
|
146
|
+
/* @__PURE__ */ import_react.default.createElement(
|
|
147
|
+
import_antd.Input,
|
|
148
|
+
{
|
|
149
|
+
placeholder: emailPlaceholder,
|
|
150
|
+
size: "large",
|
|
151
|
+
className: "saas-login-input"
|
|
152
|
+
}
|
|
153
|
+
)
|
|
154
|
+
), /* @__PURE__ */ import_react.default.createElement("div", { className: "form-item-label" }, passwordLabel), /* @__PURE__ */ import_react.default.createElement(
|
|
155
|
+
import_antd.Form.Item,
|
|
156
|
+
{
|
|
157
|
+
name: "password",
|
|
158
|
+
rules: [
|
|
159
|
+
{ required: true, message: "Please input your password!" }
|
|
160
|
+
]
|
|
161
|
+
},
|
|
162
|
+
/* @__PURE__ */ import_react.default.createElement(
|
|
163
|
+
import_antd.Input.Password,
|
|
164
|
+
{
|
|
165
|
+
placeholder: passwordPlaceholder,
|
|
166
|
+
size: "large",
|
|
167
|
+
className: "saas-login-input"
|
|
168
|
+
}
|
|
169
|
+
)
|
|
170
|
+
), (showRememberMe || showForgotPassword) && /* @__PURE__ */ import_react.default.createElement("div", { className: "saas-login-options" }, showRememberMe && /* @__PURE__ */ import_react.default.createElement(import_antd.Checkbox, null, rememberMeText), showForgotPassword && /* @__PURE__ */ import_react.default.createElement("a", { className: "forgot-password" }, forgotPasswordText)), /* @__PURE__ */ import_react.default.createElement(
|
|
171
|
+
import_antd.Button,
|
|
172
|
+
{
|
|
173
|
+
type: "primary",
|
|
174
|
+
block: true,
|
|
175
|
+
size: "large",
|
|
176
|
+
loading,
|
|
177
|
+
onClick: handleEmailLogin,
|
|
178
|
+
className: "saas-login-button"
|
|
179
|
+
},
|
|
180
|
+
"Log in"
|
|
181
|
+
)) : /* @__PURE__ */ import_react.default.createElement(import_antd.Form, { form }, /* @__PURE__ */ import_react.default.createElement(
|
|
182
|
+
import_antd.Form.Item,
|
|
183
|
+
{
|
|
184
|
+
name: "email",
|
|
185
|
+
rules: emailRules
|
|
186
|
+
},
|
|
187
|
+
/* @__PURE__ */ import_react.default.createElement(
|
|
188
|
+
import_antd.Input,
|
|
189
|
+
{
|
|
190
|
+
placeholder: registerEmailPlaceholder,
|
|
191
|
+
size: "large",
|
|
192
|
+
className: "saas-login-input"
|
|
193
|
+
}
|
|
194
|
+
)
|
|
195
|
+
), /* @__PURE__ */ import_react.default.createElement(
|
|
196
|
+
import_antd.Form.Item,
|
|
197
|
+
{
|
|
198
|
+
name: "password",
|
|
199
|
+
rules: [
|
|
200
|
+
{ required: true, message: "Please input your password!" },
|
|
201
|
+
{ min: 6, message: "Password must be at least 6 characters!" }
|
|
202
|
+
]
|
|
203
|
+
},
|
|
204
|
+
/* @__PURE__ */ import_react.default.createElement(
|
|
205
|
+
import_antd.Input.Password,
|
|
206
|
+
{
|
|
207
|
+
placeholder: registerPasswordPlaceholder,
|
|
208
|
+
size: "large",
|
|
209
|
+
className: "saas-login-input"
|
|
210
|
+
}
|
|
211
|
+
)
|
|
212
|
+
), /* @__PURE__ */ import_react.default.createElement(
|
|
213
|
+
import_antd.Button,
|
|
214
|
+
{
|
|
215
|
+
type: "primary",
|
|
216
|
+
block: true,
|
|
217
|
+
size: "large",
|
|
218
|
+
loading,
|
|
219
|
+
onClick: handleRegister,
|
|
220
|
+
className: "saas-login-button"
|
|
221
|
+
},
|
|
222
|
+
registerButtonText
|
|
223
|
+
)), /* @__PURE__ */ import_react.default.createElement(import_antd.Space, { direction: "vertical", className: "saas-login-social" }, loginMethods.includes("google") && /* @__PURE__ */ import_react.default.createElement(
|
|
224
|
+
import_antd.Button,
|
|
225
|
+
{
|
|
226
|
+
block: true,
|
|
227
|
+
icon: /* @__PURE__ */ import_react.default.createElement(import_icons.GoogleOutlined, null),
|
|
228
|
+
className: "saas-login-social-button google",
|
|
229
|
+
onClick: () => handleSocialLogin("google")
|
|
230
|
+
},
|
|
231
|
+
socialLoginTexts.google
|
|
232
|
+
), loginMethods.includes("facebook") && /* @__PURE__ */ import_react.default.createElement(
|
|
233
|
+
import_antd.Button,
|
|
234
|
+
{
|
|
235
|
+
block: true,
|
|
236
|
+
icon: /* @__PURE__ */ import_react.default.createElement(import_icons.FacebookOutlined, null),
|
|
237
|
+
className: "saas-login-social-button facebook",
|
|
238
|
+
onClick: () => handleSocialLogin("facebook")
|
|
239
|
+
},
|
|
240
|
+
socialLoginTexts.facebook
|
|
241
|
+
), loginMethods.includes("apple") && /* @__PURE__ */ import_react.default.createElement(
|
|
242
|
+
import_antd.Button,
|
|
243
|
+
{
|
|
244
|
+
block: true,
|
|
245
|
+
icon: /* @__PURE__ */ import_react.default.createElement(import_icons.AppleOutlined, null),
|
|
246
|
+
className: "saas-login-social-button apple",
|
|
247
|
+
onClick: () => handleSocialLogin("apple")
|
|
248
|
+
},
|
|
249
|
+
socialLoginTexts.apple
|
|
250
|
+
))), showFooter && /* @__PURE__ */ import_react.default.createElement("div", { className: "saas-login-footer" }, showSignUp && /* @__PURE__ */ import_react.default.createElement("p", { className: "saas-login-signup" }, signUpText, signUpLink ? /* @__PURE__ */ import_react.default.createElement("a", { href: signUpLink }, "Sign up") : /* @__PURE__ */ import_react.default.createElement("a", { onClick: onSignUp }, "Sign up")), otherLinks.length > 0 && /* @__PURE__ */ import_react.default.createElement("div", { className: "saas-login-links" }, otherLinks.map((link, index) => /* @__PURE__ */ import_react.default.createElement(
|
|
251
|
+
"a",
|
|
252
|
+
{
|
|
253
|
+
key: index,
|
|
254
|
+
href: link.url,
|
|
255
|
+
target: "_blank",
|
|
256
|
+
rel: "noopener noreferrer"
|
|
257
|
+
},
|
|
258
|
+
link.text
|
|
259
|
+
))))));
|
|
260
|
+
};
|
|
261
|
+
var login_and_register_default = loginAndRegister;
|
|
@@ -0,0 +1,211 @@
|
|
|
1
|
+
.saas-login-container {
|
|
2
|
+
// width: 100%;
|
|
3
|
+
max-width: 360px;
|
|
4
|
+
overflow-x: hidden;
|
|
5
|
+
// margin: 0 auto;
|
|
6
|
+
// padding: 24px;
|
|
7
|
+
text-align: center;
|
|
8
|
+
// height: 100%;
|
|
9
|
+
// overflow-y: auto;
|
|
10
|
+
|
|
11
|
+
// Logo样式
|
|
12
|
+
.saas-login-logo {
|
|
13
|
+
height: 48px;
|
|
14
|
+
margin-bottom: 24px;
|
|
15
|
+
border-radius: 8px;
|
|
16
|
+
|
|
17
|
+
&.left {
|
|
18
|
+
margin-right: auto;
|
|
19
|
+
margin-left: 0;
|
|
20
|
+
}
|
|
21
|
+
|
|
22
|
+
&.center {
|
|
23
|
+
margin: 0 auto;
|
|
24
|
+
}
|
|
25
|
+
|
|
26
|
+
&.right {
|
|
27
|
+
margin-left: auto;
|
|
28
|
+
margin-right: 0;
|
|
29
|
+
}
|
|
30
|
+
|
|
31
|
+
img {
|
|
32
|
+
height: 48px;
|
|
33
|
+
object-fit: contain;
|
|
34
|
+
}
|
|
35
|
+
}
|
|
36
|
+
|
|
37
|
+
.saas-login-title {
|
|
38
|
+
font-size: 24px;
|
|
39
|
+
font-weight: 600;
|
|
40
|
+
color: #101828;
|
|
41
|
+
margin-top: 0;
|
|
42
|
+
margin-bottom: 12px;
|
|
43
|
+
}
|
|
44
|
+
|
|
45
|
+
.saas-login-subtitle {
|
|
46
|
+
font-size: 14px;
|
|
47
|
+
color: #667085;
|
|
48
|
+
margin-top: 0;
|
|
49
|
+
margin-bottom: 32px;
|
|
50
|
+
}
|
|
51
|
+
|
|
52
|
+
.saas-login-tabs {
|
|
53
|
+
display: flex;
|
|
54
|
+
justify-content: center;
|
|
55
|
+
gap: 24px;
|
|
56
|
+
margin-bottom: 32px;
|
|
57
|
+
border-bottom: 1px solid #E4E7EC;
|
|
58
|
+
|
|
59
|
+
.tab {
|
|
60
|
+
padding: 12px 24px;
|
|
61
|
+
cursor: pointer;
|
|
62
|
+
color: #667085;
|
|
63
|
+
font-weight: 500;
|
|
64
|
+
position: relative;
|
|
65
|
+
|
|
66
|
+
&.active {
|
|
67
|
+
color: #7F56D9;
|
|
68
|
+
|
|
69
|
+
&:after {
|
|
70
|
+
content: '';
|
|
71
|
+
position: absolute;
|
|
72
|
+
bottom: -1px;
|
|
73
|
+
left: 0;
|
|
74
|
+
right: 0;
|
|
75
|
+
height: 2px;
|
|
76
|
+
background: #7F56D9;
|
|
77
|
+
}
|
|
78
|
+
}
|
|
79
|
+
|
|
80
|
+
&:hover {
|
|
81
|
+
color: #6941C6;
|
|
82
|
+
}
|
|
83
|
+
}
|
|
84
|
+
}
|
|
85
|
+
|
|
86
|
+
// 表单区域样式
|
|
87
|
+
.saas-login-form {
|
|
88
|
+
// 表单项标题
|
|
89
|
+
.form-item-label {
|
|
90
|
+
font-size: 14px;
|
|
91
|
+
font-weight: 500;
|
|
92
|
+
color: #344054;
|
|
93
|
+
margin-bottom: 6px;
|
|
94
|
+
text-align: left;
|
|
95
|
+
}
|
|
96
|
+
|
|
97
|
+
// 输入框样式
|
|
98
|
+
.saas-login-input {
|
|
99
|
+
height: 44px;
|
|
100
|
+
border-radius: 8px;
|
|
101
|
+
border: 1px solid #D0D5DD;
|
|
102
|
+
background: #FFF;
|
|
103
|
+
|
|
104
|
+
&:hover {
|
|
105
|
+
border-color: #7F56D9;
|
|
106
|
+
}
|
|
107
|
+
|
|
108
|
+
&:focus {
|
|
109
|
+
border-color: #7F56D9;
|
|
110
|
+
box-shadow: 0 0 0 4px rgba(127, 86, 217, 0.1);
|
|
111
|
+
}
|
|
112
|
+
|
|
113
|
+
&.ant-input-password {
|
|
114
|
+
padding: 4px 11px;
|
|
115
|
+
|
|
116
|
+
.ant-input {
|
|
117
|
+
height: 34px;
|
|
118
|
+
}
|
|
119
|
+
}
|
|
120
|
+
}
|
|
121
|
+
|
|
122
|
+
// 登录按钮样式
|
|
123
|
+
.saas-login-button {
|
|
124
|
+
height: 44px;
|
|
125
|
+
border-radius: 8px;
|
|
126
|
+
background: #7F56D9;
|
|
127
|
+
border: none;
|
|
128
|
+
font-weight: 500;
|
|
129
|
+
|
|
130
|
+
&:hover {
|
|
131
|
+
background: #6941C6;
|
|
132
|
+
}
|
|
133
|
+
|
|
134
|
+
&:focus {
|
|
135
|
+
background: #7F56D9;
|
|
136
|
+
box-shadow: 0 0 0 4px rgba(127, 86, 217, 0.1);
|
|
137
|
+
}
|
|
138
|
+
}
|
|
139
|
+
|
|
140
|
+
// 社交登录按钮样式
|
|
141
|
+
.saas-login-social {
|
|
142
|
+
width: 100%;
|
|
143
|
+
|
|
144
|
+
.saas-login-social-button {
|
|
145
|
+
height: 44px;
|
|
146
|
+
border-radius: 8px;
|
|
147
|
+
|
|
148
|
+
&.google {
|
|
149
|
+
border-color: #D0D5DD;
|
|
150
|
+
|
|
151
|
+
&:hover {
|
|
152
|
+
background: #F9FAFB;
|
|
153
|
+
}
|
|
154
|
+
}
|
|
155
|
+
|
|
156
|
+
&.facebook {
|
|
157
|
+
border-color: #D0D5DD;
|
|
158
|
+
|
|
159
|
+
&:hover {
|
|
160
|
+
background: #F9FAFB;
|
|
161
|
+
}
|
|
162
|
+
}
|
|
163
|
+
|
|
164
|
+
&.apple {
|
|
165
|
+
border-color: #D0D5DD;
|
|
166
|
+
|
|
167
|
+
&:hover {
|
|
168
|
+
background: #F9FAFB;
|
|
169
|
+
}
|
|
170
|
+
}
|
|
171
|
+
}
|
|
172
|
+
}
|
|
173
|
+
}
|
|
174
|
+
|
|
175
|
+
// 页脚样式
|
|
176
|
+
.saas-login-footer {
|
|
177
|
+
margin-top: 32px;
|
|
178
|
+
|
|
179
|
+
.saas-login-signup {
|
|
180
|
+
font-size: 14px;
|
|
181
|
+
color: #667085;
|
|
182
|
+
margin-bottom: 16px;
|
|
183
|
+
|
|
184
|
+
a {
|
|
185
|
+
color: #7F56D9;
|
|
186
|
+
margin-left: 4px;
|
|
187
|
+
cursor: pointer;
|
|
188
|
+
|
|
189
|
+
&:hover {
|
|
190
|
+
color: #6941C6;
|
|
191
|
+
}
|
|
192
|
+
}
|
|
193
|
+
}
|
|
194
|
+
|
|
195
|
+
.saas-login-links {
|
|
196
|
+
display: flex;
|
|
197
|
+
justify-content: center;
|
|
198
|
+
gap: 24px;
|
|
199
|
+
|
|
200
|
+
a {
|
|
201
|
+
font-size: 14px;
|
|
202
|
+
color: #667085;
|
|
203
|
+
cursor: pointer;
|
|
204
|
+
|
|
205
|
+
&:hover {
|
|
206
|
+
color: #101828;
|
|
207
|
+
}
|
|
208
|
+
}
|
|
209
|
+
}
|
|
210
|
+
}
|
|
211
|
+
}
|
|
Binary file
|
|
@@ -0,0 +1,17 @@
|
|
|
1
|
+
import React from 'react';
|
|
2
|
+
import './index.less';
|
|
3
|
+
interface OrganizationTenantSwitcherProps {
|
|
4
|
+
onChange?: (value: string, option: any) => void;
|
|
5
|
+
value: string;
|
|
6
|
+
options: {
|
|
7
|
+
label: string;
|
|
8
|
+
value: string;
|
|
9
|
+
logo?: string;
|
|
10
|
+
}[];
|
|
11
|
+
showLogo?: boolean;
|
|
12
|
+
showName?: boolean;
|
|
13
|
+
readOnly?: boolean;
|
|
14
|
+
onClick?: React.MouseEventHandler<HTMLDivElement>;
|
|
15
|
+
}
|
|
16
|
+
declare const OrganizationTenantSwitcher: React.FC<OrganizationTenantSwitcherProps>;
|
|
17
|
+
export default OrganizationTenantSwitcher;
|