@uktrade/react-component-library 0.21.0 → 0.21.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 (7) hide show
  1. package/dist/components/SummaryItem/SummaryItem.d.ts +3 -1
  2. package/dist/components/SummaryItem/SummaryItem.d.ts.map +1 -1
  3. package/dist/components/SummaryItem/SummaryItem.js +4 -2
  4. package/dist/components/SummaryItem/SummaryItem.module.css +3 -0
  5. package/package.json +2 -2
  6. package/src/components/SummaryItem/SummaryItem.module.css +3 -0
  7. package/src/components/SummaryItem/SummaryItem.tsx +9 -1
package/dist/components/SummaryItem/SummaryItem.d.ts CHANGED
@@ -3,6 +3,7 @@ export interface SummaryItemConfig {
3
3
  name: string;
4
4
  value: React.ReactNode;
5
5
  actions?: SummaryListAction[];
6
+ wordWrap?: boolean;
6
7
  }
7
8
  export type SummaryListAction = {
8
9
  text: string;
@@ -19,6 +20,7 @@ interface SummaryItemProps {
19
20
  name: string;
20
21
  children: React.ReactNode;
21
22
  actions?: SummaryListAction[];
23
+ wordWrap?: boolean;
22
24
  }
23
25
  /**
24
26
  * Single action link
@@ -34,6 +36,6 @@ export declare const SummaryListActionsList: ({ actions, }: SummaryListActionsLi
34
36
  /**
35
37
  * Standard GOV.UK Summary List row
36
38
  */
37
- export declare const SummaryItem: ({ name, children, actions, }: SummaryItemProps) => React.JSX.Element;
39
+ export declare const SummaryItem: ({ name, children, actions, wordWrap, }: SummaryItemProps) => React.JSX.Element;
38
40
  export {};
39
41
  //# sourceMappingURL=SummaryItem.d.ts.map
package/dist/components/SummaryItem/SummaryItem.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"SummaryItem.d.ts","sourceRoot":"","sources":["../../../src/components/SummaryItem/SummaryItem.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,MAAM,WAAW,iBAAiB;IAChC,IAAI,EAAE,MAAM,CAAC;IACb,KAAK,EAAE,KAAK,CAAC,SAAS,CAAC;IACvB,OAAO,CAAC,EAAE,iBAAiB,EAAE,CAAC;CAC/B;AAED,MAAM,MAAM,iBAAiB,GAAG;IAC9B,IAAI,EAAE,MAAM,CAAC;IACb,IAAI,EAAE,MAAM,CAAC;IACb,cAAc,CAAC,EAAE,MAAM,CAAC;CACzB,CAAC;AAEF,MAAM,WAAW,sBAAsB;IACrC,MAAM,EAAE,iBAAiB,CAAC;CAC3B;AAED,MAAM,WAAW,2BAA2B;IAC1C,OAAO,CAAC,EAAE,iBAAiB,EAAE,CAAC;CAC/B;AAED,UAAU,gBAAgB;IACxB,IAAI,EAAE,MAAM,CAAC;IACb,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B,OAAO,CAAC,EAAE,iBAAiB,EAAE,CAAC;CAC/B;AAED;;GAEG;AACH,eAAO,MAAM,iBAAiB,GAAI,aAE/B,sBAAsB,KAAG,KAAK,CAAC,GAAG,CAAC,OAYrC,CAAC;AAEF;;;;;GAKG;AACH,eAAO,MAAM,sBAAsB,GAAI,cAEpC,2BAA2B,KAAG,KAAK,CAAC,GAAG,CAAC,OAAO,GAAG,IAqBpD,CAAC;AAEF;;GAEG;AACH,eAAO,MAAM,WAAW,GAAI,8BAIzB,gBAAgB,KAAG,KAAK,CAAC,GAAG,CAAC,OAQ/B,CAAC"}
1
+ {"version":3,"file":"SummaryItem.d.ts","sourceRoot":"","sources":["../../../src/components/SummaryItem/SummaryItem.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAI/B,MAAM,WAAW,iBAAiB;IAChC,IAAI,EAAE,MAAM,CAAC;IACb,KAAK,EAAE,KAAK,CAAC,SAAS,CAAC;IACvB,OAAO,CAAC,EAAE,iBAAiB,EAAE,CAAC;IAC9B,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB;AAED,MAAM,MAAM,iBAAiB,GAAG;IAC9B,IAAI,EAAE,MAAM,CAAC;IACb,IAAI,EAAE,MAAM,CAAC;IACb,cAAc,CAAC,EAAE,MAAM,CAAC;CACzB,CAAC;AAEF,MAAM,WAAW,sBAAsB;IACrC,MAAM,EAAE,iBAAiB,CAAC;CAC3B;AAED,MAAM,WAAW,2BAA2B;IAC1C,OAAO,CAAC,EAAE,iBAAiB,EAAE,CAAC;CAC/B;AAED,UAAU,gBAAgB;IACxB,IAAI,EAAE,MAAM,CAAC;IACb,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B,OAAO,CAAC,EAAE,iBAAiB,EAAE,CAAC;IAC9B,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB;AAED;;GAEG;AACH,eAAO,MAAM,iBAAiB,GAAI,aAE/B,sBAAsB,KAAG,KAAK,CAAC,GAAG,CAAC,OAYrC,CAAC;AAEF;;;;;GAKG;AACH,eAAO,MAAM,sBAAsB,GAAI,cAEpC,2BAA2B,KAAG,KAAK,CAAC,GAAG,CAAC,OAAO,GAAG,IAqBpD,CAAC;AAEF;;GAEG;AACH,eAAO,MAAM,WAAW,GAAI,wCAKzB,gBAAgB,KAAG,KAAK,CAAC,GAAG,CAAC,OAU/B,CAAC"}
package/dist/components/SummaryItem/SummaryItem.js CHANGED
@@ -1,5 +1,7 @@
1
1
  "use client";
2
2
  import { jsxs as _jsxs, jsx as _jsx } from "react/jsx-runtime";
3
+ import clsx from "clsx";
4
+ import styles from "./SummaryItem.module.css";
3
5
  /**
4
6
  * Single action link
5
7
  */
@@ -20,6 +22,6 @@ export const SummaryListActionsList = ({ actions, }) => {
20
22
  /**
21
23
  * Standard GOV.UK Summary List row
22
24
  */
23
- export const SummaryItem = ({ name, children, actions, }) => {
24
- return (_jsxs("div", { className: "govuk-summary-list__row", children: [_jsx("dt", { className: "govuk-summary-list__key", children: name }), _jsx("dd", { className: "govuk-summary-list__value", children: children }), _jsx(SummaryListActionsList, { actions: actions })] }));
25
+ export const SummaryItem = ({ name, children, actions, wordWrap, }) => {
26
+ return (_jsxs("div", { className: "govuk-summary-list__row", children: [_jsx("dt", { className: "govuk-summary-list__key", children: name }), _jsx("dd", { className: clsx("govuk-summary-list__value", wordWrap && styles.wordWrap), children: children }), _jsx(SummaryListActionsList, { actions: actions })] }));
25
27
  };
package/dist/components/SummaryItem/SummaryItem.module.css ADDED
@@ -0,0 +1,3 @@
1
+ .wordWrap {
2
+ word-wrap: break-word;
3
+ }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@uktrade/react-component-library",
3
- "version": "0.21.0",
3
+ "version": "0.21.1",
4
4
  "description": "A collection of reusable React components following GOV.UK design patterns.",
5
5
  "main": "./dist/index.js",
6
6
  "types": "./dist/index.d.ts",
@@ -76,4 +76,4 @@
76
76
  "clsx": "^2.1.0",
77
77
  "openapi-fetch": "^0.15.0"
78
78
  }
79
- }
79
+ }
package/src/components/SummaryItem/SummaryItem.module.css ADDED
@@ -0,0 +1,3 @@
1
+ .wordWrap {
2
+ word-wrap: break-word;
3
+ }
package/src/components/SummaryItem/SummaryItem.tsx CHANGED
@@ -1,11 +1,15 @@
1
1
  "use client"
2
2
 
3
+ import clsx from "clsx";
3
4
  import type React from "react";
5
+ import styles from "./SummaryItem.module.css"
6
+
4
7
 
5
8
  export interface SummaryItemConfig {
6
9
  name: string;
7
10
  value: React.ReactNode;
8
11
  actions?: SummaryListAction[];
12
+ wordWrap?: boolean;
9
13
  }
10
14
 
11
15
  export type SummaryListAction = {
@@ -26,6 +30,7 @@ interface SummaryItemProps {
26
30
  name: string;
27
31
  children: React.ReactNode;
28
32
  actions?: SummaryListAction[];
33
+ wordWrap?: boolean;
29
34
  }
30
35
 
31
36
  /**
@@ -85,11 +90,14 @@ export const SummaryItem = ({
85
90
  name,
86
91
  children,
87
92
  actions,
93
+ wordWrap,
88
94
  }: SummaryItemProps): React.JSX.Element => {
89
95
  return (
90
96
  <div className="govuk-summary-list__row">
91
97
  <dt className="govuk-summary-list__key">{name}</dt>
92
- <dd className="govuk-summary-list__value">{children}</dd>
98
+ <dd className={clsx("govuk-summary-list__value", wordWrap && styles.wordWrap)}>
99
+ {children}
100
+ </dd>
93
101
  <SummaryListActionsList actions={actions} />
94
102
  </div>
95
103
  );