@guardian/stand 0.0.43 → 0.0.44
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.
|
@@ -6,7 +6,7 @@ const require_types = require("./types.cjs");
|
|
|
6
6
|
let _emotion_react_jsx_runtime = require("@emotion/react/jsx-runtime");
|
|
7
7
|
let react_aria_components = require("react-aria-components");
|
|
8
8
|
//#region src/components/Form/Form.tsx
|
|
9
|
-
function FormInputContainer({ as: Component, size = "md", label, description, error, isDisabled = false, theme = {}, formInputContainerTheme, cssOverrides, children, ...props }) {
|
|
9
|
+
function FormInputContainer({ as: Component, size = "md", label, renderLabel, description, error, isDisabled = false, theme = {}, formInputContainerTheme, cssOverrides, children, ...props }) {
|
|
10
10
|
if (!require_types.ALLOWED_FORM_CONTAINERS.includes(Component)) return null;
|
|
11
11
|
const mergedTheme = require_mergeDeep.mergeDeep(require_mergeDeep.mergeDeep(require_styles.defaultFormInputContainerTheme, theme), formInputContainerTheme ?? {});
|
|
12
12
|
return /* @__PURE__ */ (0, _emotion_react_jsx_runtime.jsxs)(Component, {
|
|
@@ -19,7 +19,7 @@ function FormInputContainer({ as: Component, size = "md", label, description, er
|
|
|
19
19
|
size,
|
|
20
20
|
isDisabled
|
|
21
21
|
}),
|
|
22
|
-
children: label
|
|
22
|
+
children: renderLabel ? renderLabel(label) : label
|
|
23
23
|
}),
|
|
24
24
|
description && /* @__PURE__ */ (0, _emotion_react_jsx_runtime.jsx)("div", {
|
|
25
25
|
css: require_styles.formInputDescriptionStyles(mergedTheme, { isDisabled }),
|
|
@@ -5,7 +5,7 @@ import { ALLOWED_FORM_CONTAINERS } from "./types.js";
|
|
|
5
5
|
import { jsx, jsxs } from "@emotion/react/jsx-runtime";
|
|
6
6
|
import { FieldError, Label } from "react-aria-components";
|
|
7
7
|
//#region src/components/Form/Form.tsx
|
|
8
|
-
function FormInputContainer({ as: Component, size = "md", label, description, error, isDisabled = false, theme = {}, formInputContainerTheme, cssOverrides, children, ...props }) {
|
|
8
|
+
function FormInputContainer({ as: Component, size = "md", label, renderLabel, description, error, isDisabled = false, theme = {}, formInputContainerTheme, cssOverrides, children, ...props }) {
|
|
9
9
|
if (!ALLOWED_FORM_CONTAINERS.includes(Component)) return null;
|
|
10
10
|
const mergedTheme = mergeDeep(mergeDeep(defaultFormInputContainerTheme, theme), formInputContainerTheme ?? {});
|
|
11
11
|
return /* @__PURE__ */ jsxs(Component, {
|
|
@@ -18,7 +18,7 @@ function FormInputContainer({ as: Component, size = "md", label, description, er
|
|
|
18
18
|
size,
|
|
19
19
|
isDisabled
|
|
20
20
|
}),
|
|
21
|
-
children: label
|
|
21
|
+
children: renderLabel ? renderLabel(label) : label
|
|
22
22
|
}),
|
|
23
23
|
description && /* @__PURE__ */ jsx("div", {
|
|
24
24
|
css: formInputDescriptionStyles(mergedTheme, { isDisabled }),
|
|
@@ -11,9 +11,15 @@ type FormInputContainerDefaultProps<ReactAriaInput extends {
|
|
|
11
11
|
*/
|
|
12
12
|
size?: keyof Omit<ComponentTheme, 'shared'>;
|
|
13
13
|
/**
|
|
14
|
-
* The label text for the form field
|
|
14
|
+
* The label text for the form field.
|
|
15
15
|
*/
|
|
16
16
|
label?: string;
|
|
17
|
+
/**
|
|
18
|
+
* Custom render function for the label. Receives the `label` string and returns a ReactNode.
|
|
19
|
+
* Use this to add icons, badges, or other visual enhancements alongside the label text.
|
|
20
|
+
* Ensure the returned node still includes the label text so the field remains accessible.
|
|
21
|
+
*/
|
|
22
|
+
renderLabel?: (label: string) => ReactNode;
|
|
17
23
|
/**
|
|
18
24
|
* The description text for the form field
|
|
19
25
|
*/
|
|
@@ -11,9 +11,15 @@ type FormInputContainerDefaultProps<ReactAriaInput extends {
|
|
|
11
11
|
*/
|
|
12
12
|
size?: keyof Omit<ComponentTheme, 'shared'>;
|
|
13
13
|
/**
|
|
14
|
-
* The label text for the form field
|
|
14
|
+
* The label text for the form field.
|
|
15
15
|
*/
|
|
16
16
|
label?: string;
|
|
17
|
+
/**
|
|
18
|
+
* Custom render function for the label. Receives the `label` string and returns a ReactNode.
|
|
19
|
+
* Use this to add icons, badges, or other visual enhancements alongside the label text.
|
|
20
|
+
* Ensure the returned node still includes the label text so the field remains accessible.
|
|
21
|
+
*/
|
|
22
|
+
renderLabel?: (label: string) => ReactNode;
|
|
17
23
|
/**
|
|
18
24
|
* The description text for the form field
|
|
19
25
|
*/
|