@byline/ui 2.3.2 → 2.4.0

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.
@@ -1,6 +1,12 @@
1
1
  interface SignInFormProps {
2
2
  /** Destination after successful sign-in. Defaults to `/admin`. */
3
3
  callbackUrl?: string;
4
+ /**
5
+ * Optional plain "Home" link rendered on the left of the action row.
6
+ * Typically the host's configured `serverURL` so signed-out admins can
7
+ * navigate back to the public site without typing the URL.
8
+ */
9
+ homeUrl?: string;
4
10
  }
5
- export declare function SignInForm({ callbackUrl }: SignInFormProps): import("react").JSX.Element;
11
+ export declare function SignInForm({ callbackUrl, homeUrl }: SignInFormProps): import("react").JSX.Element;
6
12
  export {};
@@ -5,7 +5,7 @@ import classnames from "classnames";
5
5
  import { useBylineAdminServices } from "../../../services/admin-services-context.js";
6
6
  import { Alert, Button, Card, Input, LoaderEllipsis } from "../../../uikit.js";
7
7
  import sign_in_form_module from "./sign-in-form.module.js";
8
- function SignInForm({ callbackUrl }) {
8
+ function SignInForm({ callbackUrl, homeUrl }) {
9
9
  const { adminSignIn } = useBylineAdminServices();
10
10
  const [email, setEmail] = useState('');
11
11
  const [password, setPassword] = useState('');
@@ -85,19 +85,26 @@ function SignInForm({ callbackUrl }) {
85
85
  })
86
86
  ]
87
87
  }),
88
- /*#__PURE__*/ jsx("div", {
88
+ /*#__PURE__*/ jsxs("div", {
89
89
  className: classnames('byline-sign-in-actions', sign_in_form_module.actions),
90
- children: /*#__PURE__*/ jsx(Button, {
91
- type: "submit",
92
- disabled: pending,
93
- className: classnames('byline-sign-in-button', sign_in_form_module.button),
94
- children: pending ? /*#__PURE__*/ jsx(LoaderEllipsis, {
95
- size: 30,
96
- color: "#aaaaaa"
97
- }) : /*#__PURE__*/ jsx("span", {
98
- children: "Sign In"
90
+ children: [
91
+ homeUrl && /*#__PURE__*/ jsx("a", {
92
+ href: homeUrl,
93
+ className: classnames('byline-sign-in-home-link', sign_in_form_module["home-link"]),
94
+ children: "Home"
95
+ }),
96
+ /*#__PURE__*/ jsx(Button, {
97
+ type: "submit",
98
+ disabled: pending,
99
+ className: classnames('byline-sign-in-button', sign_in_form_module.button),
100
+ children: pending ? /*#__PURE__*/ jsx(LoaderEllipsis, {
101
+ size: 30,
102
+ color: "#aaaaaa"
103
+ }) : /*#__PURE__*/ jsx("span", {
104
+ children: "Sign In"
105
+ })
99
106
  })
100
- })
107
+ ]
101
108
  })
102
109
  ]
103
110
  })
@@ -5,6 +5,8 @@ const sign_in_form_module = {
5
5
  form: "form-fWmy7i",
6
6
  fields: "fields-PdCiqd",
7
7
  actions: "actions-PqFgXw",
8
+ "home-link": "home-link-HFDZqL",
9
+ homeLink: "home-link-HFDZqL",
8
10
  button: "button-t5aU4f"
9
11
  };
10
12
  export default sign_in_form_module;
@@ -25,11 +25,17 @@
25
25
 
26
26
  :is(.actions-PqFgXw, .byline-sign-in-actions) {
27
27
  margin-top: var(--spacing-24);
28
- justify-content: flex-end;
28
+ align-items: center;
29
29
  display: flex;
30
30
  }
31
31
 
32
+ :is(.home-link-HFDZqL, .byline-sign-in-home-link) {
33
+ font-size: .9rem;
34
+ text-decoration: underline;
35
+ }
36
+
32
37
  :is(.button-t5aU4f, .byline-sign-in-button) {
33
38
  min-width: 5rem;
39
+ margin-left: auto;
34
40
  }
35
41
 
package/package.json CHANGED
@@ -3,7 +3,7 @@
3
3
  "private": false,
4
4
  "type": "module",
5
5
  "license": "MPL-2.0",
6
- "version": "2.3.2",
6
+ "version": "2.4.0",
7
7
  "engines": {
8
8
  "node": ">=20.9.0"
9
9
  },
@@ -60,15 +60,15 @@
60
60
  "classnames": "^2.5.1",
61
61
  "date-fns": "^4.2.1",
62
62
  "lodash-es": "^4.18.1",
63
- "motion": "^12.39.0",
63
+ "motion": "^12.40.0",
64
64
  "npm-run-all": "^4.1.5",
65
65
  "react-day-picker": "^10.0.1",
66
66
  "react-diff-viewer-continued": "^4.2.2",
67
67
  "zod": "^4.4.3",
68
68
  "zod-form-data": "^3.0.1",
69
- "@byline/admin": "2.3.2",
70
- "@byline/core": "2.3.2",
71
- "@byline/client": "2.3.2"
69
+ "@byline/core": "2.4.0",
70
+ "@byline/admin": "2.4.0",
71
+ "@byline/client": "2.4.0"
72
72
  },
73
73
  "peerDependencies": {
74
74
  "react": "^19.0.0",
@@ -92,7 +92,7 @@
92
92
  "rimraf": "^6.1.3",
93
93
  "typescript": "6.0.3",
94
94
  "typescript-plugin-css-modules": "^5.2.0",
95
- "vite": "^8.0.13",
95
+ "vite": "^8.0.14",
96
96
  "vitest": "^4.1.7"
97
97
  },
98
98
  "publishConfig": {
@@ -2,12 +2,13 @@
2
2
  * SignInForm — admin sign-in card form.
3
3
  *
4
4
  * Override handles:
5
- * .byline-sign-in-card — outer Card (responsive width)
6
- * .byline-sign-in-alert — error alert spacing
7
- * .byline-sign-in-form — the form element
8
- * .byline-sign-in-fields — vertical stack of inputs
9
- * .byline-sign-in-actions — submit-button row
10
- * .byline-sign-in-button the submit button (min-width)
5
+ * .byline-sign-in-card — outer Card (responsive width)
6
+ * .byline-sign-in-alert — error alert spacing
7
+ * .byline-sign-in-form — the form element
8
+ * .byline-sign-in-fields — vertical stack of inputs
9
+ * .byline-sign-in-actions action row (optional Home link + submit button)
10
+ * .byline-sign-in-home-link left-side "Home" link (rendered when homeUrl is set)
11
+ * .byline-sign-in-button — the submit button (min-width)
11
12
  */
12
13
 
13
14
  .card,
@@ -43,11 +44,19 @@
43
44
  .actions,
44
45
  :global(.byline-sign-in-actions) {
45
46
  display: flex;
46
- justify-content: flex-end;
47
+ align-items: center;
47
48
  margin-top: var(--spacing-24);
48
49
  }
49
50
 
51
+ .home-link,
52
+ :global(.byline-sign-in-home-link) {
53
+ font-size: 0.9rem;
54
+ text-decoration: underline;
55
+ }
56
+
50
57
  .button,
51
58
  :global(.byline-sign-in-button) {
52
59
  min-width: 5rem;
60
+ /* Always floats right whether or not a Home link is present on the left. */
61
+ margin-left: auto;
53
62
  }
@@ -19,7 +19,8 @@
19
19
  *
20
20
  * Stable override handles: `.byline-sign-in-card`, `.byline-sign-in-alert`,
21
21
  * `.byline-sign-in-form`, `.byline-sign-in-fields`,
22
- * `.byline-sign-in-actions`, `.byline-sign-in-button`.
22
+ * `.byline-sign-in-actions`, `.byline-sign-in-button`,
23
+ * `.byline-sign-in-home-link`.
23
24
  */
24
25
 
25
26
  import { type FormEvent, useState } from 'react'
@@ -33,9 +34,15 @@ import styles from './sign-in-form.module.css'
33
34
  interface SignInFormProps {
34
35
  /** Destination after successful sign-in. Defaults to `/admin`. */
35
36
  callbackUrl?: string
37
+ /**
38
+ * Optional plain "Home" link rendered on the left of the action row.
39
+ * Typically the host's configured `serverURL` so signed-out admins can
40
+ * navigate back to the public site without typing the URL.
41
+ */
42
+ homeUrl?: string
36
43
  }
37
44
 
38
- export function SignInForm({ callbackUrl }: SignInFormProps) {
45
+ export function SignInForm({ callbackUrl, homeUrl }: SignInFormProps) {
39
46
  const { adminSignIn } = useBylineAdminServices()
40
47
  const [email, setEmail] = useState('')
41
48
  const [password, setPassword] = useState('')
@@ -105,6 +112,11 @@ export function SignInForm({ callbackUrl }: SignInFormProps) {
105
112
  />
106
113
  </div>
107
114
  <div className={cx('byline-sign-in-actions', styles.actions)}>
115
+ {homeUrl && (
116
+ <a href={homeUrl} className={cx('byline-sign-in-home-link', styles['home-link'])}>
117
+ Home
118
+ </a>
119
+ )}
108
120
  <Button
109
121
  type="submit"
110
122
  disabled={pending}