@abgov/jsonforms-components 1.44.0 → 1.44.2

package/index.esm.js

@@ -5333,8 +5333,8 @@ let _$5 = t => t,
   _t2$3,
   _t3$3,
   _t4$2,
-  _t5$1,
-  _t6$1,
+  _t5$2,
+  _t6$2,
   _t7$1,
   _t8$1,
   _t9$1,
@@ -5369,7 +5369,7 @@ const ReviewItemTitle = styled.div(_t4$2 || (_t4$2 = _$5`
   line-height: var(--goa-space-xl);
   font-weight: 300;
 `));
-const Anchor = styled.div(_t5$1 || (_t5$1 = _$5`
+const Anchor = styled.div(_t5$2 || (_t5$2 = _$5`
   color: #0070c4;
   text-decoration: underline;
   outline: none;
@@ -5380,7 +5380,7 @@ const Anchor = styled.div(_t5$1 || (_t5$1 = _$5`
     background-color: #e6f7ff;
   }
 `));
-styled.div(_t6$1 || (_t6$1 = _$5`
+styled.div(_t6$2 || (_t6$2 = _$5`
   margin-left: var(--goa-space-m);
 `));
 styled.div(_t7$1 || (_t7$1 = _$5`
@@ -5394,9 +5394,14 @@ styled.h3(_t9$1 || (_t9$1 = _$5`
   text-transform: capitalize;
 `));
 const RightAlignmentDiv = styled.div(_t10$1 || (_t10$1 = _$5`
-  display: flex;
-  justify-content: flex-end;
-  margin-bottom: var(--goa-space-l);
+  @media screen and (max-width: 767px) {
+    margin-bottom: var(--goa-space-l);
+  }
+  @media screen and (min-width: 768px) {
+    display: flex;
+    justify-content: flex-end;
+    margin-bottom: var(--goa-space-l);
+  }
 `));
 const FormStepperSummaryH3 = styled.h3(_t11$1 || (_t11$1 = _$5`
   flex: 1;
@@ -6387,8 +6392,8 @@ let _$2 = t => t,
   _t2$1,
   _t3$1,
   _t4$1,
-  _t5,
-  _t6,
+  _t5$1,
+  _t6$1,
   _t7,
   _t8,
   _t9,
@@ -6410,10 +6415,10 @@ const ToolBarHeader = styled.div(_t3$1 || (_t3$1 = _$2`
 const ObjectArrayTitle = styled.h2(_t4$1 || (_t4$1 = _$2`
   margin-bottom: var(--goa-space-l);
 `));
-const TextCenter = styled.div(_t5 || (_t5 = _$2`
+const TextCenter = styled.div(_t5$1 || (_t5$1 = _$2`
   text-align: center;
 `));
-const SideMenuItem = styled.div(_t6 || (_t6 = _$2`
+const SideMenuItem = styled.div(_t6$1 || (_t6$1 = _$2`
   &:hover {
     background: #f1f1f1;
   }
@@ -7541,7 +7546,9 @@ let _$1 = t => t,
   _t$1,
   _t2,
   _t3,
-  _t4;
+  _t4,
+  _t5,
+  _t6;
 const SearchBox = styled.div(_t$1 || (_t$1 = _$1`
   position: relative;
 
@@ -7587,13 +7594,23 @@ const SearchBox = styled.div(_t$1 || (_t$1 = _$1`
 `));
 const AddressIndent = styled.div(_t2 || (_t2 = _$1`
   margin: 1em 1.5em 0 1.5em;
+  textwrap: 'wrap';
+  wordbreak: 'break-word';
+`));
+const TextWrap = styled.p(_t3 || (_t3 = _$1`
+  text-wrap: auto;
+  word-break: break-word;
 `));
-const LabelDiv = styled.div(_t3 || (_t3 = _$1`
+const TextWrapDiv = styled.div(_t4 || (_t4 = _$1`
+  text-wrap: auto;
+  word-break: break-word;
+`));
+const LabelDiv = styled.div(_t5 || (_t5 = _$1`
   font-size: var(--goa-font-size-2);
   padding-bottom: var(--goa-space-l);
 `));
 /* istanbul ignore next */
-const ListItem = styled.li(_t4 || (_t4 = _$1`
+const ListItem = styled.li(_t6 || (_t6 = _$1`
   background-color: ${0};
   color: ${0};
   font-weight: ${0};
@@ -8290,12 +8307,12 @@ const AddressViews = ({
         children: [jsx(GoAFormItem, {
           label: "Address line 1",
           error: ((_a = data === null || data === void 0 ? void 0 : data.addressLine1) === null || _a === void 0 ? void 0 : _a.length) === 0 ? 'addressLine1 is required' : '',
-          children: jsx("p", {
+          children: jsx(TextWrap, {
             children: data === null || data === void 0 ? void 0 : data.addressLine1
           })
         }), (data === null || data === void 0 ? void 0 : data.addressLine2) && jsx(GoAFormItem, {
           label: "Address line 2",
-          children: jsx("p", {
+          children: jsx(TextWrap, {
             children: data.addressLine2
           })
         })]
@@ -8305,13 +8322,13 @@ const AddressViews = ({
         children: [jsx(GoAFormItem, {
           error: ((_b = data === null || data === void 0 ? void 0 : data.municipality) === null || _b === void 0 ? void 0 : _b.length) === 0 ? 'city is required' : '',
           label: "City",
-          children: jsx("p", {
+          children: jsx(TextWrap, {
             children: data === null || data === void 0 ? void 0 : data.municipality
           })
         }), jsx(GoAFormItem, {
           error: ((_c = data === null || data === void 0 ? void 0 : data.postalCode) === null || _c === void 0 ? void 0 : _c.length) === 0 ? 'postalCode is required' : '',
           label: "Postal Code",
-          children: jsx("p", {
+          children: jsx(TextWrap, {
             children: data === null || data === void 0 ? void 0 : data.postalCode
           })
         })]
@@ -8483,23 +8500,29 @@ const FullNameReviewControl = props => {
       label: "First Name",
       requirement: (requiredFields === null || requiredFields === void 0 ? void 0 : requiredFields.includes('firstName')) ? 'required' : undefined,
       error: (_a = errors === null || errors === void 0 ? void 0 : errors['firstName']) !== null && _a !== void 0 ? _a : '',
-      children: jsx("div", {
-        "data-testid": `firstName-control-${props.id}`,
-        children: (_b = props.data) === null || _b === void 0 ? void 0 : _b.firstName
+      children: jsx(TextWrapDiv, {
+        children: jsx("div", {
+          "data-testid": `firstName-control-${props.id}`,
+          children: (_b = props.data) === null || _b === void 0 ? void 0 : _b.firstName
+        })
       })
     }), jsx(GoAFormItem, {
       label: "Middle Name",
-      children: jsx("div", {
-        "data-testid": `middleName-control-${props.id}`,
-        children: (_c = props.data) === null || _c === void 0 ? void 0 : _c.middleName
+      children: jsx(TextWrapDiv, {
+        children: jsx("div", {
+          "data-testid": `middleName-control-${props.id}`,
+          children: (_c = props.data) === null || _c === void 0 ? void 0 : _c.middleName
+        })
       })
     }), jsx(GoAFormItem, {
       label: "Last Name",
       requirement: (requiredFields === null || requiredFields === void 0 ? void 0 : requiredFields.includes('lastName')) ? 'required' : undefined,
       error: (_d = errors === null || errors === void 0 ? void 0 : errors['lastName']) !== null && _d !== void 0 ? _d : '',
-      children: jsx("div", {
-        "data-testid": `lastName-control-${props.id}`,
-        children: (_e = props.data) === null || _e === void 0 ? void 0 : _e.lastName
+      children: jsx(TextWrapDiv, {
+        children: jsx("div", {
+          "data-testid": `lastName-control-${props.id}`,
+          children: (_e = props.data) === null || _e === void 0 ? void 0 : _e.lastName
+        })
       })
     })]
   });
@@ -8725,15 +8748,19 @@ const FullNameDobReviewControl = props => {
         label: "First name",
         requirement: (requiredFields === null || requiredFields === void 0 ? void 0 : requiredFields.includes('firstName')) ? 'required' : undefined,
         error: (_a = errors === null || errors === void 0 ? void 0 : errors['firstName']) !== null && _a !== void 0 ? _a : '',
-        children: jsx("div", {
-          "data-testid": `firstName-control-${props.id}`,
-          children: (_b = props.data) === null || _b === void 0 ? void 0 : _b.firstName
+        children: jsx(TextWrapDiv, {
+          children: jsx("div", {
+            "data-testid": `firstName-control-${props.id}`,
+            children: (_b = props.data) === null || _b === void 0 ? void 0 : _b.firstName
+          })
         })
       }), jsx(GoAFormItem, {
         label: "Middle name",
-        children: jsx("div", {
-          "data-testid": `middleName-control-${props.id}`,
-          children: (_c = props.data) === null || _c === void 0 ? void 0 : _c.middleName
+        children: jsx(TextWrapDiv, {
+          children: jsx("div", {
+            "data-testid": `middleName-control-${props.id}`,
+            children: (_c = props.data) === null || _c === void 0 ? void 0 : _c.middleName
+          })
         })
       }), jsx(GoAFormItem, {
         label: "Last name",
@@ -8751,9 +8778,11 @@ const FullNameDobReviewControl = props => {
         label: "Date of birth",
         requirement: (requiredFields === null || requiredFields === void 0 ? void 0 : requiredFields.includes('dateOfBirth')) ? 'required' : undefined,
         error: (_f = errors === null || errors === void 0 ? void 0 : errors['dateOfBirth']) !== null && _f !== void 0 ? _f : '',
-        children: jsx("div", {
-          "data-testid": `dob-control-${props.id}`,
-          children: (_g = props.data) === null || _g === void 0 ? void 0 : _g.dateOfBirth
+        children: jsx(TextWrapDiv, {
+          children: jsx("div", {
+            "data-testid": `dob-control-${props.id}`,
+            children: (_g = props.data) === null || _g === void 0 ? void 0 : _g.dateOfBirth
+          })
         })
       })
     })]

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@abgov/jsonforms-components",
-  "version": "1.44.0",
+  "version": "1.44.2",
   "license": "Apache-2.0",
   "description": "Government of Alberta - React renderers for JSON Forms based on the design system.",
   "repository": "https://github.com/GovAlta/adsp-monorepo",

package/src/lib/Controls/AddressLookup/styled-components.d.ts

@@ -5,6 +5,8 @@ interface ListItemProps {
 }
 export declare const SearchBox: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
 export declare const AddressIndent: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
+export declare const TextWrap: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLParagraphElement>, HTMLParagraphElement>, never>> & string;
+export declare const TextWrapDiv: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
 export declare const LabelDiv: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
 export declare const ListItem: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").LiHTMLAttributes<HTMLLIElement>, HTMLLIElement>, ListItemProps>> & string;
 export {};