@moduk/frontend 1.1.16 → 1.1.18

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.
@@ -5,11 +5,11 @@
5
5
  id: "with-hint",
6
6
  maxlength: 200,
7
7
  label: {
8
- text: "What is the event about?",
8
+ text: "Can you provide more detail?",
9
9
  classes: "govuk-label--l",
10
10
  isPageHeading: true
11
11
  },
12
12
  hint: {
13
- text: "This will be shown on the public page for the event, below the event title"
13
+ text: "Do not include personal information like your service number."
14
14
  }
15
15
  }) -}}
@@ -3,14 +3,17 @@
3
3
  {{ modukCharacterCount({
4
4
  id: "exceeding-characters",
5
5
  name: "exceeding",
6
- maxlength: 350,
7
- value: "A content designer works on the end-to-end journey of a service to help users complete their goal and government deliver a policy intent. Their work may involve the creation of, or change to, a transaction, product or single piece of content that stretches across digital and offline channels. They make sure appropriate content is shown to a user in the right place and in the best format.",
6
+ maxlength: 200,
7
+ value: "I would like to request my service record and have a question about what proof of address is acceptable. The guidance doesn’t say if a digital bank statement will be accepted. Can someone please confirm if",
8
8
  label: {
9
- text: "Enter a job description",
9
+ text: "Can you provide more detail?",
10
10
  classes: "govuk-label--l",
11
11
  isPageHeading: true
12
12
  },
13
+ hint: {
14
+ text: "Do not include personal information like your service number."
15
+ },
13
16
  errorMessage: {
14
- text: "Job description must be 350 characters or less"
17
+ text: "Detail must be 200 characters or less"
15
18
  }
16
19
  }) -}}
@@ -1,22 +1,22 @@
1
1
  {% from "moduk/components/summary-list/macro.njk" import modukSummaryList -%}
2
2
 
3
3
  <div>
4
- {{- modukSummaryList({
4
+ {{ modukSummaryList({
5
5
  card: {
6
6
  title: {
7
- text: "Project A"
7
+ text: "University of Gloucestershire"
8
8
  },
9
9
  actions: {
10
10
  items: [
11
11
  {
12
12
  href: "#",
13
- text: "Change phase",
14
- visuallyHiddenText: "of project A"
13
+ text: "Delete choice",
14
+ visuallyHiddenText: "of University of Gloucestershire"
15
15
  },
16
16
  {
17
17
  href: "#",
18
- text: "Archive",
19
- visuallyHiddenText: "project A"
18
+ text: "Withdraw",
19
+ visuallyHiddenText: "from University of Gloucestershire"
20
20
  }
21
21
  ]
22
22
  }
@@ -24,46 +24,39 @@
24
24
  rows: [
25
25
  {
26
26
  key: {
27
- text: "Phase"
28
- },
29
- value: {
30
- html: "Beta"
31
- }
32
- },
33
- {
34
- key: {
35
- text: "Start date"
27
+ text: "Course"
36
28
  },
37
29
  value: {
38
- html: "1 November 2022"
30
+ html: "English (3DMD)<br>PGCE with QTS full time"
39
31
  }
40
32
  },
41
33
  {
42
34
  key: {
43
- text: "Team"
35
+ text: "Location"
44
36
  },
45
37
  value: {
46
- html: "Team A"
38
+ html: "School name<br>Road, City, SW1 1AA"
47
39
  }
48
40
  }
49
41
  ]
50
42
  }) -}}
43
+
51
44
  {{ modukSummaryList({
52
45
  card: {
53
46
  title: {
54
- text: "Project B"
47
+ text: "University of Bristol"
55
48
  },
56
49
  actions: {
57
50
  items: [
58
51
  {
59
52
  href: "#",
60
- text: "Change phase",
61
- visuallyHiddenText: "of project B"
53
+ text: "Delete choice",
54
+ visuallyHiddenText: "of University of Bristol"
62
55
  },
63
56
  {
64
57
  href: "#",
65
- text: "Archive",
66
- visuallyHiddenText: "project B"
58
+ text: "Withdraw",
59
+ visuallyHiddenText: "from University of Bristol"
67
60
  }
68
61
  ]
69
62
  }
@@ -71,26 +64,18 @@
71
64
  rows: [
72
65
  {
73
66
  key: {
74
- text: "Phase"
75
- },
76
- value: {
77
- html: "Live"
78
- }
79
- },
80
- {
81
- key: {
82
- text: "Start date"
67
+ text: "Course"
83
68
  },
84
69
  value: {
85
- html: "12 December 2021"
70
+ html: "English (Q3X1)<br>PGCE with QTS full time"
86
71
  }
87
72
  },
88
73
  {
89
74
  key: {
90
- text: "Team"
75
+ text: "Location"
91
76
  },
92
77
  value: {
93
- html: "Team B"
78
+ html: "School name<br>Road, City, SW2 1AA"
94
79
  }
95
80
  }
96
81
  ]
@@ -1,180 +1,217 @@
1
1
  {% from "moduk/components/summary-list/macro.njk" import modukSummaryList -%}
2
2
 
3
3
  <div>
4
- {{- modukSummaryList({
4
+
5
+ {{ modukSummaryList({
5
6
  card: {
6
7
  title: {
7
- text: "Project A"
8
+ text: "Lead tenant"
8
9
  }
9
10
  },
10
11
  rows: [
11
12
  {
12
13
  key: {
13
- text: "Phase"
14
+ text: "Age"
14
15
  },
15
16
  value: {
16
- html: "Beta"
17
+ html: "38"
17
18
  },
18
19
  actions: {
19
20
  items: [
20
21
  {
21
22
  href: "#",
22
23
  text: "Change",
23
- visuallyHiddenText: "status"
24
+ visuallyHiddenText: "age"
24
25
  }
25
26
  ]
26
27
  }
27
28
  },
28
29
  {
29
30
  key: {
30
- text: "Start date"
31
+ text: "Nationality"
31
32
  },
32
33
  value: {
33
- html: "1 November 2022"
34
+ html: "UK national resident in UK"
34
35
  },
35
36
  actions: {
36
37
  items: [
37
38
  {
38
39
  href: "#",
39
40
  text: "Change",
40
- visuallyHiddenText: "start date"
41
+ visuallyHiddenText: "nationality"
41
42
  }
42
43
  ]
43
44
  }
44
45
  },
45
46
  {
46
47
  key: {
47
- text: "Team"
48
+ text: "Working situation"
48
49
  },
49
50
  value: {
50
- html: "Team A"
51
+ html: "Part time – less than 30 hours a week"
51
52
  },
52
53
  actions: {
53
54
  items: [
54
55
  {
55
56
  href: "#",
56
57
  text: "Change",
57
- visuallyHiddenText: "team"
58
+ visuallyHiddenText: "working situation"
58
59
  }
59
60
  ]
60
61
  }
61
62
  }
62
63
  ]
63
64
  }) -}}
65
+
64
66
  {{ modukSummaryList({
65
67
  card: {
66
68
  title: {
67
- text: "Project B"
69
+ text: "Person 2"
68
70
  }
69
71
  },
70
72
  rows: [
71
73
  {
72
74
  key: {
73
- text: "Phase"
75
+ text: "Details known"
76
+ },
77
+ value: {
78
+ html: "Yes"
79
+ },
80
+ actions: {
81
+ items: [
82
+ {
83
+ href: "#",
84
+ text: "Change",
85
+ visuallyHiddenText: "whether details are known"
86
+ }
87
+ ]
88
+ }
89
+ },
90
+ {
91
+ key: {
92
+ text: "Relationship to lead tenant"
74
93
  },
75
94
  value: {
76
- html: "Live"
95
+ html: "Partner"
77
96
  },
78
97
  actions: {
79
98
  items: [
80
99
  {
81
100
  href: "#",
82
101
  text: "Change",
83
- visuallyHiddenText: "status"
102
+ visuallyHiddenText: "relationship to lead tenant"
84
103
  }
85
104
  ]
86
105
  }
87
106
  },
88
107
  {
89
108
  key: {
90
- text: "Start date"
109
+ text: "Age"
91
110
  },
92
111
  value: {
93
- html: "12 December 2021"
112
+ html: "42"
94
113
  },
95
114
  actions: {
96
115
  items: [
97
116
  {
98
117
  href: "#",
99
118
  text: "Change",
100
- visuallyHiddenText: "start date"
119
+ visuallyHiddenText: "age"
101
120
  }
102
121
  ]
103
122
  }
104
123
  },
105
124
  {
106
125
  key: {
107
- text: "Team"
126
+ text: "Working situation"
108
127
  },
109
128
  value: {
110
- html: "Team B"
129
+ html: "Unable to work because of long-term sickness or disability"
111
130
  },
112
131
  actions: {
113
132
  items: [
114
133
  {
115
134
  href: "#",
116
135
  text: "Change",
117
- visuallyHiddenText: "team"
136
+ visuallyHiddenText: "working situation"
118
137
  }
119
138
  ]
120
139
  }
121
140
  }
122
141
  ]
123
142
  }) -}}
143
+
124
144
  {{ modukSummaryList({
125
145
  card: {
126
146
  title: {
127
- text: "Project C"
147
+ text: "Person 3"
128
148
  }
129
149
  },
130
150
  rows: [
131
151
  {
132
152
  key: {
133
- text: "Phase"
153
+ text: "Details known"
154
+ },
155
+ value: {
156
+ html: "Yes"
157
+ },
158
+ actions: {
159
+ items: [
160
+ {
161
+ href: "#",
162
+ text: "Change",
163
+ visuallyHiddenText: "whether details are known"
164
+ }
165
+ ]
166
+ }
167
+ },
168
+ {
169
+ key: {
170
+ text: "Relationship to lead tenant"
134
171
  },
135
172
  value: {
136
- html: "Discovery"
173
+ html: "Child"
137
174
  },
138
175
  actions: {
139
176
  items: [
140
177
  {
141
178
  href: "#",
142
179
  text: "Change",
143
- visuallyHiddenText: "status"
180
+ visuallyHiddenText: "relationship to lead tenant"
144
181
  }
145
182
  ]
146
183
  }
147
184
  },
148
185
  {
149
186
  key: {
150
- text: "Start date"
187
+ text: "Age"
151
188
  },
152
189
  value: {
153
- html: "1 February 2023"
190
+ html: "7"
154
191
  },
155
192
  actions: {
156
193
  items: [
157
194
  {
158
195
  href: "#",
159
196
  text: "Change",
160
- visuallyHiddenText: "start date"
197
+ visuallyHiddenText: "age"
161
198
  }
162
199
  ]
163
200
  }
164
201
  },
165
202
  {
166
203
  key: {
167
- text: "Team"
204
+ text: "Working situation"
168
205
  },
169
206
  value: {
170
- html: "Team C"
207
+ html: "Child under 16"
171
208
  },
172
209
  actions: {
173
210
  items: [
174
211
  {
175
212
  href: "#",
176
213
  text: "Change",
177
- visuallyHiddenText: "team"
214
+ visuallyHiddenText: "working situation"
178
215
  }
179
216
  ]
180
217
  }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@moduk/frontend",
3
- "version": "1.1.16",
3
+ "version": "1.1.18",
4
4
  "description": "The MOD.UK Frontend contains the code you need to start building a user interface for Ministry of Defence platforms and services.",
5
5
  "main": "dist/lib/index.js",
6
6
  "sass": "src/css/index.scss",
@@ -91,7 +91,7 @@
91
91
  "@babel/core": "^7.21.4",
92
92
  "@babel/preset-env": "^7.21.4",
93
93
  "@babel/preset-react": "^7.18.6",
94
- "@babel/preset-typescript": "^7.21.0",
94
+ "@babel/preset-typescript": "^7.21.5",
95
95
  "@commitlint/cli": "^17.6.3",
96
96
  "@commitlint/config-conventional": "^17.4.4",
97
97
  "@playwright/test": "^1.32.3",
@@ -99,7 +99,7 @@
99
99
  "@testing-library/dom": "^9.2.0",
100
100
  "@testing-library/jest-dom": "^5.16.5",
101
101
  "@types/lodash": "^4.14.194",
102
- "@types/node": "^18.15.11",
102
+ "@types/node": "^18.16.14",
103
103
  "@types/nunjucks": "^3.2.2",
104
104
  "@types/react": "^18.2.6",
105
105
  "@types/react-dom": "^18.2.4",
@@ -108,11 +108,13 @@
108
108
  "babel-loader": "^9.1.2",
109
109
  "concurrently": "^8.0.1",
110
110
  "dprint": "^0.36.1",
111
- "eslint": "^8.39.0",
111
+ "eslint": "^8.41.0",
112
112
  "eslint-config-airbnb-base": "^15.0.0",
113
113
  "eslint-import-resolver-typescript": "^3.5.5",
114
114
  "eslint-plugin-eslint-comments": "^3.2.0",
115
115
  "eslint-plugin-import": "^2.27.5",
116
+ "eslint-plugin-react": "^7.32.2",
117
+ "eslint-plugin-react-hooks": "^4.6.0",
116
118
  "eslint-plugin-unicorn": "^47.0.0",
117
119
  "glob": "^10.2.2",
118
120
  "happy-dom": "^9.10.2",
@@ -120,7 +122,7 @@
120
122
  "lint-staged": "^13.1.2",
121
123
  "postcss-cli": "^10.1.0",
122
124
  "postcss-fail-on-warn": "^0.2.1",
123
- "postcss-preset-env": "^8.3.2",
125
+ "postcss-preset-env": "^8.4.1",
124
126
  "release-it": "^15.10.3",
125
127
  "sass": "^1.62.1",
126
128
  "sass-true": "^7.0.0",
@@ -128,7 +130,7 @@
128
130
  "ts-node": "^10.9.1",
129
131
  "tsconfig-paths": "^4.2.0",
130
132
  "typescript": "^5.0.4",
131
- "vitest": "^0.29.2",
133
+ "vitest": "^0.31.1",
132
134
  "webpack": "^5.76.3",
133
135
  "webpack-cli": "^5.1.1"
134
136
  },
@@ -1,3 +1,3 @@
1
1
  import { BackLink } from '@moduk/frontend/react'
2
2
 
3
- export default () => <BackLink href='#'>Back</BackLink>
3
+ export const Example = () => <BackLink href='#'>Back</BackLink>