@uktrade/react-component-library 0.14.1 → 0.15.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.
Files changed (7) hide show
  1. package/dist/components/SummaryList/SummaryList.d.ts +3 -1
  2. package/dist/components/SummaryList/SummaryList.d.ts.map +1 -1
  3. package/dist/components/SummaryList/SummaryList.js +1 -1
  4. package/dist/components/SummaryList/SummaryList.module.css +1 -1
  5. package/package.json +1 -1
  6. package/src/components/SummaryList/SummaryList.module.css +1 -1
  7. package/src/components/SummaryList/SummaryList.tsx +21 -2
package/dist/components/SummaryList/SummaryList.d.ts CHANGED
@@ -12,6 +12,8 @@ export interface SummaryCardProps extends React.HTMLAttributes<HTMLDivElement> {
12
12
  children?: React.ReactNode;
13
13
  actions?: SummaryListAction[];
14
14
  className?: string;
15
+ titleBackground?: string;
16
+ subSectionNode?: React.ReactNode;
15
17
  }
16
- export declare const SummaryCard: ({ title, children, actions, className, ...props }: SummaryCardProps) => import("react/jsx-runtime").JSX.Element;
18
+ export declare const SummaryCard: ({ title, children, actions, className, titleBackground, subSectionNode, ...props }: SummaryCardProps) => import("react/jsx-runtime").JSX.Element;
17
19
  //# sourceMappingURL=SummaryList.d.ts.map
package/dist/components/SummaryList/SummaryList.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"SummaryList.d.ts","sourceRoot":"","sources":["../../../src/components/SummaryList/SummaryList.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAG/B,OAAO,EAAE,iBAAiB,EAAE,MAAM,4BAA4B,CAAC;AAG/D,MAAM,WAAW,gBAAiB,SAAQ,KAAK,CAAC,cAAc,CAAC,gBAAgB,CAAC;IAC9E,KAAK,EAAE,MAAM,CAAC;IACd,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC3B,OAAO,CAAC,EAAE,iBAAiB,EAAE,CAAC;IAC9B,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED,eAAO,MAAM,WAAW,GAAI,0CAA0C,gBAAgB,4CAOrF,CAAC;AAEF,MAAM,WAAW,gBAAiB,SAAQ,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC;IAC5E,KAAK,EAAE,MAAM,CAAC;IACd,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC3B,OAAO,CAAC,EAAE,iBAAiB,EAAE,CAAC;IAC9B,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED,eAAO,MAAM,WAAW,GAAI,mDAAmD,gBAAgB,4CAgC9F,CAAC"}
1
+ {"version":3,"file":"SummaryList.d.ts","sourceRoot":"","sources":["../../../src/components/SummaryList/SummaryList.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAG/B,OAAO,EAAE,iBAAiB,EAAE,MAAM,4BAA4B,CAAC;AAG/D,MAAM,WAAW,gBAAiB,SAAQ,KAAK,CAAC,cAAc,CAAC,gBAAgB,CAAC;IAC9E,KAAK,EAAE,MAAM,CAAC;IACd,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC3B,OAAO,CAAC,EAAE,iBAAiB,EAAE,CAAC;IAC9B,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED,eAAO,MAAM,WAAW,GAAI,0CAA0C,gBAAgB,4CAOrF,CAAC;AAEF,MAAM,WAAW,gBAAiB,SAAQ,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC;IAC5E,KAAK,EAAE,MAAM,CAAC;IACd,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC3B,OAAO,CAAC,EAAE,iBAAiB,EAAE,CAAC;IAC9B,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,cAAc,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;CAClC;AAED,eAAO,MAAM,WAAW,GAAI,oFAQzB,gBAAgB,4CAyClB,CAAC"}
package/dist/components/SummaryList/SummaryList.js CHANGED
@@ -4,4 +4,4 @@ import clsx from "clsx";
4
4
  import { SummaryListAction } from "../SummaryItem/SummaryItem";
5
5
  import styles from "./SummaryList.module.css";
6
6
  export const SummaryList = ({ title, children, className, ...props }) => (_jsxs(_Fragment, { children: [title && _jsx("h2", { className: "govuk-heading-l", children: title }), _jsx("dl", { className: clsx("govuk-summary-list", className), ...props, children: children })] }));
7
- export const SummaryCard = ({ title, children, actions, className, ...props }) => (_jsx("div", { className: clsx(styles.root, className), children: _jsxs("div", { className: "govuk-summary-card govuk-body", ...props, children: [_jsxs("div", { className: "govuk-summary-card__title-wrapper", children: [_jsx("h2", { className: "govuk-summary-card__title", children: title }), actions && (_jsx("ul", { className: clsx("govuk-summary-card__actions", styles.summaryCardTitleActions), children: actions.map((action) => (_jsx("li", { className: "govuk-summary-card__action", children: _jsx(SummaryListAction, { action: action }) }, action.text))) }))] }), _jsx("div", { className: clsx("govuk-summary-card__content", styles.govukSummaryCardContent), children: children })] }) }));
7
+ export const SummaryCard = ({ title, children, actions, className, titleBackground, subSectionNode, ...props }) => (_jsx("div", { className: clsx(styles.root, className), children: _jsxs("div", { className: "govuk-summary-card govuk-body", ...props, children: [_jsxs("div", { className: "govuk-summary-card__title-wrapper", style: titleBackground ? { background: titleBackground } : undefined, children: [_jsx("h2", { className: "govuk-summary-card__title", children: title }), actions && (_jsx("ul", { className: clsx("govuk-summary-card__actions", styles.summaryCardTitleActions), children: actions.map((action) => (_jsx("li", { className: "govuk-summary-card__action", children: _jsx(SummaryListAction, { action: action }) }, action.text))) }))] }), subSectionNode && (_jsx("div", { children: subSectionNode })), _jsx("div", { className: clsx("govuk-summary-card__content", styles.govukSummaryCardContent), children: children })] }) }));
package/dist/components/SummaryList/SummaryList.module.css CHANGED
@@ -11,4 +11,4 @@
11
11
  .summaryCardTitleActions {
12
12
  font-weight: 400;
13
13
  }
14
- }
14
+ }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@uktrade/react-component-library",
3
- "version": "0.14.1",
3
+ "version": "0.15.0",
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",
package/src/components/SummaryList/SummaryList.module.css CHANGED
@@ -11,4 +11,4 @@
11
11
  .summaryCardTitleActions {
12
12
  font-weight: 400;
13
13
  }
14
- }
14
+ }
package/src/components/SummaryList/SummaryList.tsx CHANGED
@@ -27,12 +27,25 @@ export interface SummaryCardProps extends React.HTMLAttributes<HTMLDivElement> {
27
27
  children?: React.ReactNode;
28
28
  actions?: SummaryListAction[];
29
29
  className?: string;
30
+ titleBackground?: string;
31
+ subSectionNode?: React.ReactNode;
30
32
  }
31
33
 
32
- export const SummaryCard = ({ title, children, actions, className, ...props }: SummaryCardProps) => (
34
+ export const SummaryCard = ({
35
+ title,
36
+ children,
37
+ actions,
38
+ className,
39
+ titleBackground,
40
+ subSectionNode,
41
+ ...props
42
+ }: SummaryCardProps) => (
33
43
  <div className={clsx(styles.root, className)}>
34
44
  <div className="govuk-summary-card govuk-body" {...props}>
35
- <div className="govuk-summary-card__title-wrapper">
45
+ <div
46
+ className="govuk-summary-card__title-wrapper"
47
+ style={titleBackground ? { background: titleBackground } : undefined}
48
+ >
36
49
  <h2 className="govuk-summary-card__title">{title}</h2>
37
50
 
38
51
  {actions && (
@@ -51,6 +64,12 @@ export const SummaryCard = ({ title, children, actions, className, ...props }: S
51
64
  )}
52
65
  </div>
53
66
 
67
+ {subSectionNode && (
68
+ <div>
69
+ {subSectionNode}
70
+ </div>
71
+ )}
72
+
54
73
  <div
55
74
  className={clsx(
56
75
  "govuk-summary-card__content",