@refinedev/antd 5.36.19 → 5.37.1

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.
Files changed (19) hide show
  1. package/CHANGELOG.md +28 -0
  2. package/README.md +15 -29
  3. package/dist/components/pages/auth/components/forgotPassword/index.d.ts.map +1 -1
  4. package/dist/components/pages/auth/components/login/index.d.ts.map +1 -1
  5. package/dist/components/pages/auth/components/register/index.d.ts.map +1 -1
  6. package/dist/components/pages/auth/components/updatePassword/index.d.ts.map +1 -1
  7. package/dist/esm/index.js +1 -1
  8. package/dist/esm/index.js.map +1 -1
  9. package/dist/iife/index.js +30 -49
  10. package/dist/iife/index.js.map +1 -1
  11. package/dist/index.js +1 -1
  12. package/dist/index.js.map +1 -1
  13. package/package.json +6 -6
  14. package/src/components/pages/auth/components/forgotPassword/index.tsx +4 -3
  15. package/src/components/pages/auth/components/login/index.tsx +121 -103
  16. package/src/components/pages/auth/components/register/index.tsx +129 -93
  17. package/src/components/pages/auth/components/updatePassword/index.tsx +4 -3
  18. package/src/components/undoableNotification/index.tsx +1 -1
  19. package/src/hooks/import/index.tsx +1 -1
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@refinedev/antd",
3
- "version": "5.36.19",
3
+ "version": "5.37.1",
4
4
  "description": "refine is a React-based framework for building internal tools, rapidly. It ships with Ant Design System, an enterprise-level UI toolkit.",
5
5
  "private": false,
6
6
  "sideEffects": [
@@ -17,7 +17,7 @@
17
17
  "generate-theme": "npx @emeks/antd-custom-theme-generator -w --antd ../../node_modules/antd ./src/assets/styles/custom-theme.less ./src/assets/styles/styles.min.css"
18
18
  },
19
19
  "peerDependencies": {
20
- "@refinedev/core": "^4.40.0",
20
+ "@refinedev/core": "^4.46.1",
21
21
  "@types/react": "^17.0.0 || ^18.0.0",
22
22
  "@types/react-dom": "^17.0.0 || ^18.0.0",
23
23
  "antd": "^5.0.5",
@@ -26,9 +26,9 @@
26
26
  "react-dom": "^17.0.0 || ^18.0.0"
27
27
  },
28
28
  "devDependencies": {
29
- "@refinedev/cli": "^2.16.6",
30
- "@refinedev/ui-tests": "^1.13.0",
31
- "@refinedev/core": "^4.45.0",
29
+ "@refinedev/cli": "^2.16.21",
30
+ "@refinedev/ui-tests": "^1.14.1",
31
+ "@refinedev/core": "^4.46.1",
32
32
  "@esbuild-plugins/node-resolve": "^0.1.4",
33
33
  "@testing-library/jest-dom": "^5.16.4",
34
34
  "@testing-library/react": "^13.1.1",
@@ -52,7 +52,7 @@
52
52
  "dependencies": {
53
53
  "@ant-design/icons": "5.0.1",
54
54
  "@ant-design/pro-layout": "7.17.12",
55
- "@refinedev/ui-types": "^1.22.0",
55
+ "@refinedev/ui-types": "^1.22.4",
56
56
  "@tanstack/react-query": "^4.10.1",
57
57
  "antd": "^5.0.5",
58
58
  "dayjs": "^1.10.7",
package/src/components/pages/auth/components/forgotPassword/index.tsx CHANGED
@@ -32,7 +32,7 @@ import {
32
32
  headStyles,
33
33
  bodyStyles,
34
34
  } from "../styles";
35
- import { ThemedTitle } from "@components";
35
+ import { ThemedTitleV2 } from "@components";
36
36
 
37
37
  type ResetPassworProps = ForgotPasswordPageProps<
38
38
  LayoutProps,
@@ -78,7 +78,7 @@ export const ForgotPasswordPage: React.FC<ResetPassworProps> = ({
78
78
  fontSize: "20px",
79
79
  }}
80
80
  >
81
- {title ?? <ThemedTitle collapsed={false} />}
81
+ {title ?? <ThemedTitleV2 collapsed={false} />}
82
82
  </div>
83
83
  );
84
84
 
@@ -195,7 +195,8 @@ export const ForgotPasswordPage: React.FC<ResetPassworProps> = ({
195
195
  justify="center"
196
196
  align="middle"
197
197
  style={{
198
- height: "100vh",
198
+ padding: "16px 0",
199
+ minHeight: "100dvh",
199
200
  }}
200
201
  >
201
202
  <Col xs={22}>
package/src/components/pages/auth/components/login/index.tsx CHANGED
@@ -31,7 +31,7 @@ import {
31
31
  layoutStyles,
32
32
  titleStyles,
33
33
  } from "../styles";
34
- import { ThemedTitle } from "@components";
34
+ import { ThemedTitleV2 } from "@components";
35
35
 
36
36
  const { Text, Title } = Typography;
37
37
  const { useToken } = theme;
@@ -52,6 +52,7 @@ export const LoginPage: React.FC<LoginProps> = ({
52
52
  renderContent,
53
53
  formProps,
54
54
  title,
55
+ hideForm,
55
56
  }) => {
56
57
  const { token } = useToken();
57
58
  const [form] = Form.useForm<LoginFormTypes>();
@@ -77,7 +78,7 @@ export const LoginPage: React.FC<LoginProps> = ({
77
78
  fontSize: "20px",
78
79
  }}
79
80
  >
80
- {title ?? <ThemedTitle collapsed={false} />}
81
+ {title ?? <ThemedTitleV2 collapsed={false} />}
81
82
  </div>
82
83
  );
83
84
 
@@ -121,15 +122,17 @@ export const LoginPage: React.FC<LoginProps> = ({
121
122
  </Button>
122
123
  );
123
124
  })}
124
- <Divider>
125
- <Text
126
- style={{
127
- color: token.colorTextLabel,
128
- }}
129
- >
130
- {translate("pages.login.divider", "or")}
131
- </Text>
132
- </Divider>
125
+ {!hideForm && (
126
+ <Divider>
127
+ <Text
128
+ style={{
129
+ color: token.colorTextLabel,
130
+ }}
131
+ >
132
+ {translate("pages.login.divider", "or")}
133
+ </Text>
134
+ </Divider>
135
+ )}
133
136
  </>
134
137
  );
135
138
  }
@@ -148,104 +151,117 @@ export const LoginPage: React.FC<LoginProps> = ({
148
151
  {...(contentProps ?? {})}
149
152
  >
150
153
  {renderProviders()}
151
- <Form<LoginFormTypes>
152
- layout="vertical"
153
- form={form}
154
- onFinish={(values) => login(values)}
155
- requiredMark={false}
156
- initialValues={{
157
- remember: false,
158
- }}
159
- {...formProps}
160
- >
161
- <Form.Item
162
- name="email"
163
- label={translate("pages.login.fields.email", "Email")}
164
- rules={[
165
- { required: true },
166
- {
167
- type: "email",
168
- message: translate(
169
- "pages.login.errors.validEmail",
170
- "Invalid email address",
171
- ),
172
- },
173
- ]}
174
- >
175
- <Input
176
- size="large"
177
- placeholder={translate(
178
- "pages.login.fields.email",
179
- "Email",
180
- )}
181
- />
182
- </Form.Item>
183
- <Form.Item
184
- name="password"
185
- label={translate("pages.login.fields.password", "Password")}
186
- rules={[{ required: true }]}
187
- >
188
- <Input
189
- type="password"
190
- placeholder="●●●●●●●●"
191
- size="large"
192
- />
193
- </Form.Item>
194
- <div
195
- style={{
196
- display: "flex",
197
- justifyContent: "space-between",
198
- marginBottom: "24px",
154
+ {!hideForm && (
155
+ <Form<LoginFormTypes>
156
+ layout="vertical"
157
+ form={form}
158
+ onFinish={(values) => login(values)}
159
+ requiredMark={false}
160
+ initialValues={{
161
+ remember: false,
199
162
  }}
163
+ {...formProps}
200
164
  >
201
- {rememberMe ?? (
202
- <Form.Item
203
- name="remember"
204
- valuePropName="checked"
205
- noStyle
206
- >
207
- <Checkbox
165
+ <Form.Item
166
+ name="email"
167
+ label={translate("pages.login.fields.email", "Email")}
168
+ rules={[
169
+ { required: true },
170
+ {
171
+ type: "email",
172
+ message: translate(
173
+ "pages.login.errors.validEmail",
174
+ "Invalid email address",
175
+ ),
176
+ },
177
+ ]}
178
+ >
179
+ <Input
180
+ size="large"
181
+ placeholder={translate(
182
+ "pages.login.fields.email",
183
+ "Email",
184
+ )}
185
+ />
186
+ </Form.Item>
187
+ <Form.Item
188
+ name="password"
189
+ label={translate(
190
+ "pages.login.fields.password",
191
+ "Password",
192
+ )}
193
+ rules={[{ required: true }]}
194
+ >
195
+ <Input
196
+ type="password"
197
+ autoComplete="current-password"
198
+ placeholder="●●●●●●●●"
199
+ size="large"
200
+ />
201
+ </Form.Item>
202
+ <div
203
+ style={{
204
+ display: "flex",
205
+ justifyContent: "space-between",
206
+ marginBottom: "24px",
207
+ }}
208
+ >
209
+ {rememberMe ?? (
210
+ <Form.Item
211
+ name="remember"
212
+ valuePropName="checked"
213
+ noStyle
214
+ >
215
+ <Checkbox
216
+ style={{
217
+ fontSize: "12px",
218
+ }}
219
+ >
220
+ {translate(
221
+ "pages.login.buttons.rememberMe",
222
+ "Remember me",
223
+ )}
224
+ </Checkbox>
225
+ </Form.Item>
226
+ )}
227
+ {forgotPasswordLink ?? (
228
+ <ActiveLink
208
229
  style={{
230
+ color: token.colorPrimaryTextHover,
209
231
  fontSize: "12px",
232
+ marginLeft: "auto",
210
233
  }}
234
+ to="/forgot-password"
211
235
  >
212
236
  {translate(
213
- "pages.login.buttons.rememberMe",
214
- "Remember me",
237
+ "pages.login.buttons.forgotPassword",
238
+ "Forgot password?",
215
239
  )}
216
- </Checkbox>
240
+ </ActiveLink>
241
+ )}
242
+ </div>
243
+ {!hideForm && (
244
+ <Form.Item>
245
+ <Button
246
+ type="primary"
247
+ size="large"
248
+ htmlType="submit"
249
+ loading={isLoading}
250
+ block
251
+ >
252
+ {translate("pages.login.signin", "Sign in")}
253
+ </Button>
217
254
  </Form.Item>
218
255
  )}
219
- {forgotPasswordLink ?? (
220
- <ActiveLink
221
- style={{
222
- color: token.colorPrimaryTextHover,
223
- fontSize: "12px",
224
- marginLeft: "auto",
225
- }}
226
- to="/forgot-password"
227
- >
228
- {translate(
229
- "pages.login.buttons.forgotPassword",
230
- "Forgot password?",
231
- )}
232
- </ActiveLink>
233
- )}
234
- </div>
235
- <Form.Item>
236
- <Button
237
- type="primary"
238
- size="large"
239
- htmlType="submit"
240
- loading={isLoading}
241
- block
242
- >
243
- {translate("pages.login.signin", "Sign in")}
244
- </Button>
245
- </Form.Item>
246
- </Form>
247
- <div style={{ marginTop: 8 }}>
248
- {registerLink ?? (
256
+ </Form>
257
+ )}
258
+
259
+ {registerLink ?? (
260
+ <div
261
+ style={{
262
+ marginTop: hideForm ? 16 : 8,
263
+ }}
264
+ >
249
265
  <Text style={{ fontSize: 12 }}>
250
266
  {translate(
251
267
  "pages.login.buttons.noAccount",
@@ -261,8 +277,8 @@ export const LoginPage: React.FC<LoginProps> = ({
261
277
  {translate("pages.login.signup", "Sign up")}
262
278
  </ActiveLink>
263
279
  </Text>
264
- )}
265
- </div>
280
+ </div>
281
+ )}
266
282
  </Card>
267
283
  );
268
284
 
@@ -270,9 +286,11 @@ export const LoginPage: React.FC<LoginProps> = ({
270
286
  <Layout style={layoutStyles} {...(wrapperProps ?? {})}>
271
287
  <Row
272
288
  justify="center"
273
- align="middle"
289
+ align={hideForm ? "top" : "middle"}
274
290
  style={{
275
- height: "100vh",
291
+ padding: "16px 0",
292
+ minHeight: "100dvh",
293
+ paddingTop: hideForm ? "15dvh" : "16px",
276
294
  }}
277
295
  >
278
296
  <Col xs={22}>
package/src/components/pages/auth/components/register/index.tsx CHANGED
@@ -30,7 +30,7 @@ import {
30
30
  headStyles,
31
31
  bodyStyles,
32
32
  } from "../styles";
33
- import { ThemedTitle } from "@components";
33
+ import { ThemedTitleV2 } from "@components";
34
34
 
35
35
  const { Text, Title } = Typography;
36
36
  const { useToken } = theme;
@@ -49,6 +49,7 @@ export const RegisterPage: React.FC<RegisterProps> = ({
49
49
  renderContent,
50
50
  formProps,
51
51
  title,
52
+ hideForm,
52
53
  }) => {
53
54
  const { token } = useToken();
54
55
  const [form] = Form.useForm<RegisterFormTypes>();
@@ -74,7 +75,7 @@ export const RegisterPage: React.FC<RegisterProps> = ({
74
75
  fontSize: "20px",
75
76
  }}
76
77
  >
77
- {title ?? <ThemedTitle collapsed={false} />}
78
+ {title ?? <ThemedTitleV2 collapsed={false} />}
78
79
  </div>
79
80
  );
80
81
 
@@ -118,15 +119,17 @@ export const RegisterPage: React.FC<RegisterProps> = ({
118
119
  </Button>
119
120
  );
120
121
  })}
121
- <Divider>
122
- <Text
123
- style={{
124
- color: token.colorTextLabel,
125
- }}
126
- >
127
- {translate("pages.login.divider", "or")}
128
- </Text>
129
- </Divider>
122
+ {!hideForm && (
123
+ <Divider>
124
+ <Text
125
+ style={{
126
+ color: token.colorTextLabel,
127
+ }}
128
+ >
129
+ {translate("pages.login.divider", "or")}
130
+ </Text>
131
+ </Divider>
132
+ )}
130
133
  </>
131
134
  );
132
135
  }
@@ -145,96 +148,127 @@ export const RegisterPage: React.FC<RegisterProps> = ({
145
148
  {...(contentProps ?? {})}
146
149
  >
147
150
  {renderProviders()}
148
- <Form<RegisterFormTypes>
149
- layout="vertical"
150
- form={form}
151
- onFinish={(values) => register(values)}
152
- requiredMark={false}
153
- {...formProps}
154
- >
155
- <Form.Item
156
- name="email"
157
- label={translate("pages.register.email", "Email")}
158
- rules={[
159
- { required: true },
160
- {
161
- type: "email",
162
- message: translate(
163
- "pages.register.errors.validEmail",
164
- "Invalid email address",
165
- ),
166
- },
167
- ]}
151
+ {!hideForm && (
152
+ <Form<RegisterFormTypes>
153
+ layout="vertical"
154
+ form={form}
155
+ onFinish={(values) => register(values)}
156
+ requiredMark={false}
157
+ {...formProps}
168
158
  >
169
- <Input
170
- size="large"
171
- placeholder={translate(
172
- "pages.register.fields.email",
173
- "Email",
159
+ <Form.Item
160
+ name="email"
161
+ label={translate("pages.register.email", "Email")}
162
+ rules={[
163
+ { required: true },
164
+ {
165
+ type: "email",
166
+ message: translate(
167
+ "pages.register.errors.validEmail",
168
+ "Invalid email address",
169
+ ),
170
+ },
171
+ ]}
172
+ >
173
+ <Input
174
+ size="large"
175
+ placeholder={translate(
176
+ "pages.register.fields.email",
177
+ "Email",
178
+ )}
179
+ />
180
+ </Form.Item>
181
+ <Form.Item
182
+ name="password"
183
+ label={translate(
184
+ "pages.register.fields.password",
185
+ "Password",
174
186
  )}
175
- />
176
- </Form.Item>
177
- <Form.Item
178
- name="password"
179
- label={translate(
180
- "pages.register.fields.password",
181
- "Password",
182
- )}
183
- rules={[{ required: true }]}
184
- >
185
- <Input
186
- type="password"
187
- placeholder="●●●●●●●●"
188
- size="large"
189
- />
190
- </Form.Item>
187
+ rules={[{ required: true }]}
188
+ >
189
+ <Input
190
+ type="password"
191
+ placeholder="●●●●●●●●"
192
+ size="large"
193
+ />
194
+ </Form.Item>
195
+ <div
196
+ style={{
197
+ display: "flex",
198
+ justifyContent: "space-between",
199
+ marginBottom: "24px",
200
+ }}
201
+ >
202
+ {loginLink ?? (
203
+ <Text
204
+ style={{
205
+ fontSize: 12,
206
+ marginLeft: "auto",
207
+ }}
208
+ >
209
+ {translate(
210
+ "pages.login.buttons.haveAccount",
211
+ "Have an account?",
212
+ )}{" "}
213
+ <ActiveLink
214
+ style={{
215
+ fontWeight: "bold",
216
+ color: token.colorPrimaryTextHover,
217
+ }}
218
+ to="/login"
219
+ >
220
+ {translate("pages.login.signin", "Sign in")}
221
+ </ActiveLink>
222
+ </Text>
223
+ )}
224
+ </div>
225
+ <Form.Item
226
+ style={{
227
+ marginBottom: 0,
228
+ }}
229
+ >
230
+ <Button
231
+ type="primary"
232
+ size="large"
233
+ htmlType="submit"
234
+ loading={isLoading}
235
+ block
236
+ >
237
+ {translate(
238
+ "pages.register.buttons.submit",
239
+ "Sign up",
240
+ )}
241
+ </Button>
242
+ </Form.Item>
243
+ </Form>
244
+ )}
245
+ {hideForm && loginLink !== false && (
191
246
  <div
192
247
  style={{
193
- display: "flex",
194
- justifyContent: "space-between",
195
- marginBottom: "24px",
248
+ marginTop: hideForm ? 16 : 8,
196
249
  }}
197
250
  >
198
- {loginLink ?? (
199
- <Text
251
+ <Text
252
+ style={{
253
+ fontSize: 12,
254
+ }}
255
+ >
256
+ {translate(
257
+ "pages.login.buttons.haveAccount",
258
+ "Have an account?",
259
+ )}{" "}
260
+ <ActiveLink
200
261
  style={{
201
- fontSize: 12,
202
- marginLeft: "auto",
262
+ fontWeight: "bold",
263
+ color: token.colorPrimaryTextHover,
203
264
  }}
265
+ to="/login"
204
266
  >
205
- {translate(
206
- "pages.login.buttons.haveAccount",
207
- "Have an account?",
208
- )}{" "}
209
- <ActiveLink
210
- style={{
211
- fontWeight: "bold",
212
- color: token.colorPrimaryTextHover,
213
- }}
214
- to="/login"
215
- >
216
- {translate("pages.login.signin", "Sign in")}
217
- </ActiveLink>
218
- </Text>
219
- )}
267
+ {translate("pages.login.signin", "Sign in")}
268
+ </ActiveLink>
269
+ </Text>
220
270
  </div>
221
-
222
- <Form.Item
223
- style={{
224
- marginBottom: 0,
225
- }}
226
- >
227
- <Button
228
- type="primary"
229
- size="large"
230
- htmlType="submit"
231
- loading={isLoading}
232
- block
233
- >
234
- {translate("pages.register.buttons.submit", "Sign up")}
235
- </Button>
236
- </Form.Item>
237
- </Form>
271
+ )}
238
272
  </Card>
239
273
  );
240
274
 
@@ -242,9 +276,11 @@ export const RegisterPage: React.FC<RegisterProps> = ({
242
276
  <Layout style={layoutStyles} {...(wrapperProps ?? {})}>
243
277
  <Row
244
278
  justify="center"
245
- align="middle"
279
+ align={hideForm ? "top" : "middle"}
246
280
  style={{
247
- height: "100vh",
281
+ padding: "16px 0",
282
+ minHeight: "100dvh",
283
+ paddingTop: hideForm ? "15dvh" : "16px",
248
284
  }}
249
285
  >
250
286
  <Col xs={22}>
package/src/components/pages/auth/components/updatePassword/index.tsx CHANGED
@@ -27,7 +27,7 @@ import {
27
27
  headStyles,
28
28
  bodyStyles,
29
29
  } from "../styles";
30
- import { ThemedTitle } from "@components";
30
+ import { ThemedTitleV2 } from "@components";
31
31
 
32
32
  const { Title } = Typography;
33
33
  const { useToken } = theme;
@@ -69,7 +69,7 @@ export const UpdatePasswordPage: React.FC<UpdatePasswordProps> = ({
69
69
  fontSize: "20px",
70
70
  }}
71
71
  >
72
- {title ?? <ThemedTitle collapsed={false} />}
72
+ {title ?? <ThemedTitleV2 collapsed={false} />}
73
73
  </div>
74
74
  );
75
75
 
@@ -184,7 +184,8 @@ export const UpdatePasswordPage: React.FC<UpdatePasswordProps> = ({
184
184
  justify="center"
185
185
  align="middle"
186
186
  style={{
187
- height: "100vh",
187
+ padding: "16px 0",
188
+ minHeight: "100dvh",
188
189
  }}
189
190
  >
190
191
  <Col xs={22}>
package/src/components/undoableNotification/index.tsx CHANGED
@@ -27,7 +27,7 @@ export const UndoableNotification: React.FC<UndoableNotificationProps> = ({
27
27
  type="circle"
28
28
  percent={(undoableTimeout ?? 0) * 20}
29
29
  format={(time) => time && time / 20}
30
- width={50}
30
+ size={50}
31
31
  strokeColor="#1890ff"
32
32
  status="normal"
33
33
  />
package/src/hooks/import/index.tsx CHANGED
@@ -81,7 +81,7 @@ export const useImport = <
81
81
  percent={Math.floor(
82
82
  (processedAmount / totalAmount) * 100,
83
83
  )}
84
- width={50}
84
+ size={50}
85
85
  strokeColor="#1890ff"
86
86
  status="normal"
87
87
  />