umwd-components 0.1.214 → 0.1.216

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 (5) hide show
  1. package/dist/cjs/components/FooterV2.js +68 -49
  2. package/dist/esm/components/FooterV2.js +68 -49
  3. package/package.json +1 -1
  4. package/src/components/FooterV2.tsx +90 -57
  5. package/src/stories/Footer.stories.js +70 -64
package/dist/cjs/components/FooterV2.js CHANGED
@@ -15,37 +15,9 @@ var Link = require('next/link');
15
15
  var Image = require('next/image');
16
16
  var getIcon = require('../lib/getIcon.js');
17
17
  var MuiLink = require('./MuiLink.js');
18
-
19
- /* Footer.propTypes = {
20
- site_title: PropTypes.string.isRequired,
21
- logo: PropTypes.shape({
22
- url: PropTypes.string.isRequired,
23
- width: PropTypes.number.isRequired,
24
- height: PropTypes.number.isRequired,
25
- alternativeText: PropTypes.string,
26
- }),
27
- company_name: PropTypes.string.isRequired,
28
- parent_company_name: PropTypes.string,
29
- company_address: PropTypes.shape({
30
- street: PropTypes.string,
31
- street_number: PropTypes.number,
32
- street_number_addition: PropTypes.string,
33
- postal_code: PropTypes.string,
34
- city: PropTypes.string,
35
- }),
36
- CoC_number: PropTypes.string.isRequired,
37
- VAT_number: PropTypes.string.isRequired,
38
- company_socials: PropTypes.arrayOf(
39
- PropTypes.shape({
40
- name: PropTypes.string.isRequired,
41
- url: PropTypes.string.isRequired,
42
- icon: PropTypes.elementType,
43
- })
44
- ),
45
- disclaimer_link: PropTypes.string,
46
- privacypolicy_link: PropTypes.string,
47
- referal: PropTypes.element,
48
- }; */
18
+ var HomeIcon = require('@mui/icons-material/Home');
19
+ var PhoneIcon = require('@mui/icons-material/Phone');
20
+ var EmailIcon = require('@mui/icons-material/Email');
49
21
 
50
22
  function Footer(_ref) {
51
23
  let {
@@ -63,20 +35,21 @@ function Footer(_ref) {
63
35
  disclaimer_link,
64
36
  privacypolicy_link,
65
37
  maxWidth = "lg",
66
- referal
38
+ referal,
39
+ sx = {},
40
+ useIcons = false
67
41
  } = data;
68
42
  const theme = material.useTheme();
69
43
  const APIcon = getIcon.default("APIcon");
70
-
71
- //console.log(logo.url);
72
-
73
44
  return /*#__PURE__*/React.createElement(material.AppBar, {
74
45
  position: "relative",
75
46
  sx: {
76
47
  backgroundColor: theme.palette.mode === "light" ? theme.palette.primary.light : theme.palette.primary.dark,
77
48
  top: "auto",
78
- bottom: 0
79
- }
49
+ bottom: 0,
50
+ ...sx
51
+ },
52
+ component: "footer"
80
53
  }, /*#__PURE__*/React.createElement(material.Container, {
81
54
  maxWidth: maxWidth
82
55
  }, /*#__PURE__*/React.createElement(material.Toolbar, {
@@ -110,7 +83,8 @@ function Footer(_ref) {
110
83
  color: "#ffffff",
111
84
  sx: {
112
85
  mb: 2
113
- }
86
+ },
87
+ component: "h2"
114
88
  }, site_title), (logo === null || logo === void 0 ? void 0 : logo.url) !== undefined && /*#__PURE__*/React.createElement(Link, {
115
89
  href: "#home"
116
90
  }, /*#__PURE__*/React.createElement(material.Box, {
@@ -135,26 +109,70 @@ function Footer(_ref) {
135
109
  variant: "h6",
136
110
  sx: {
137
111
  mb: 2
138
- }
112
+ },
113
+ component: "h2"
139
114
  }, "Contact Information"), /*#__PURE__*/React.createElement(material.Typography, {
140
- variant: "h6"
115
+ id: "company_name",
116
+ variant: "h6",
117
+ component: "h3"
141
118
  }, company_name), parent_company_name && /*#__PURE__*/React.createElement(material.Typography, {
142
- variant: "h6"
143
- }, "By ", parent_company_name), company_address && /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(material.Typography, {
119
+ id: "parent_company_name",
120
+ variant: "h6",
121
+ component: "h4"
122
+ }, "By ", parent_company_name), useIcons === true ? /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(material.Stack, {
123
+ spacing: 1,
124
+ sx: {
125
+ width: {
126
+ xs: "80%",
127
+ sm: "60%",
128
+ md: "80%"
129
+ }
130
+ }
131
+ }, company_address && /*#__PURE__*/React.createElement(material.Stack, {
132
+ direction: "row",
133
+ justifyContent: "space-between"
134
+ }, /*#__PURE__*/React.createElement(HomeIcon, null), /*#__PURE__*/React.createElement(material.Stack, {
135
+ alignItems: "flex-end"
136
+ }, /*#__PURE__*/React.createElement(material.Typography, {
144
137
  variant: "body1"
145
138
  }, company_address.street, " ", company_address.street_number, " ", company_address.street_number_addition && company_address.street_number_addition), /*#__PURE__*/React.createElement(material.Typography, {
146
139
  variant: "body1"
147
- }, company_address.postal_code, " ", company_address.city), /*#__PURE__*/React.createElement(material.Typography, {
140
+ }, company_address.postal_code, " ", company_address.city))), /*#__PURE__*/React.createElement(material.Stack, {
141
+ direction: "row",
142
+ justifyContent: "space-between"
143
+ }, /*#__PURE__*/React.createElement(PhoneIcon, null), /*#__PURE__*/React.createElement(material.Typography, {
148
144
  variant: "body1"
149
- }, company_address.country)), /*#__PURE__*/React.createElement(material.Typography, {
145
+ }, "+3133867606")), /*#__PURE__*/React.createElement(material.Stack, {
146
+ direction: "row",
147
+ justifyContent: "space-between"
148
+ }, /*#__PURE__*/React.createElement(EmailIcon, null), /*#__PURE__*/React.createElement(material.Typography, {
150
149
  variant: "body1"
151
- }, "CoC: ", CoC_number), /*#__PURE__*/React.createElement(material.Typography, {
150
+ }, "info@jellepaulus.nl")), /*#__PURE__*/React.createElement(material.Stack, {
151
+ direction: "row",
152
+ justifyContent: "space-between"
153
+ }, /*#__PURE__*/React.createElement(material.Typography, {
154
+ variant: "body1"
155
+ }, "CoC:"), /*#__PURE__*/React.createElement(material.Typography, {
156
+ variant: "body1"
157
+ }, CoC_number)), /*#__PURE__*/React.createElement(material.Stack, {
158
+ direction: "row",
159
+ justifyContent: "space-between"
160
+ }, /*#__PURE__*/React.createElement(material.Typography, {
161
+ variant: "body1"
162
+ }, "VAT:"), /*#__PURE__*/React.createElement(material.Typography, {
163
+ variant: "body1",
164
+ align: "right"
165
+ }, VAT_number)))) : /*#__PURE__*/React.createElement(React.Fragment, null, company_address && /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(material.Typography, {
152
166
  variant: "body1"
153
- }, "VAT: ", VAT_number), /*#__PURE__*/React.createElement(material.Typography, {
167
+ }, company_address.street, " ", company_address.street_number, " ", company_address.street_number_addition && company_address.street_number_addition), /*#__PURE__*/React.createElement(material.Typography, {
168
+ variant: "body1"
169
+ }, company_address.postal_code, " ", company_address.city), /*#__PURE__*/React.createElement(material.Typography, {
154
170
  variant: "body1"
155
- }), /*#__PURE__*/React.createElement(material.Typography, {
171
+ }, company_address.country), /*#__PURE__*/React.createElement(material.Typography, {
156
172
  variant: "body1"
157
- })), /*#__PURE__*/React.createElement(material.Grid, {
173
+ }, "CoC: ", CoC_number), /*#__PURE__*/React.createElement(material.Typography, {
174
+ variant: "body1"
175
+ }, "VAT: ", VAT_number)))), /*#__PURE__*/React.createElement(material.Grid, {
158
176
  item: true,
159
177
  xs: 12,
160
178
  sm: 6,
@@ -163,7 +181,8 @@ function Footer(_ref) {
163
181
  variant: "h6",
164
182
  sx: {
165
183
  mb: 2
166
- }
184
+ },
185
+ component: "h2"
167
186
  }, "Socials"), /*#__PURE__*/React.createElement(material.Stack, {
168
187
  spacing: 2,
169
188
  sx: {
package/dist/esm/components/FooterV2.js CHANGED
@@ -11,37 +11,9 @@ import Link from 'next/link';
11
11
  import Image from 'next/image';
12
12
  import getIcon from '../lib/getIcon.js';
13
13
  import { MuiLink } from './MuiLink.js';
14
-
15
- /* Footer.propTypes = {
16
- site_title: PropTypes.string.isRequired,
17
- logo: PropTypes.shape({
18
- url: PropTypes.string.isRequired,
19
- width: PropTypes.number.isRequired,
20
- height: PropTypes.number.isRequired,
21
- alternativeText: PropTypes.string,
22
- }),
23
- company_name: PropTypes.string.isRequired,
24
- parent_company_name: PropTypes.string,
25
- company_address: PropTypes.shape({
26
- street: PropTypes.string,
27
- street_number: PropTypes.number,
28
- street_number_addition: PropTypes.string,
29
- postal_code: PropTypes.string,
30
- city: PropTypes.string,
31
- }),
32
- CoC_number: PropTypes.string.isRequired,
33
- VAT_number: PropTypes.string.isRequired,
34
- company_socials: PropTypes.arrayOf(
35
- PropTypes.shape({
36
- name: PropTypes.string.isRequired,
37
- url: PropTypes.string.isRequired,
38
- icon: PropTypes.elementType,
39
- })
40
- ),
41
- disclaimer_link: PropTypes.string,
42
- privacypolicy_link: PropTypes.string,
43
- referal: PropTypes.element,
44
- }; */
14
+ import HomeIcon from '@mui/icons-material/Home';
15
+ import PhoneIcon from '@mui/icons-material/Phone';
16
+ import EmailIcon from '@mui/icons-material/Email';
45
17
 
46
18
  function Footer(_ref) {
47
19
  let {
@@ -59,20 +31,21 @@ function Footer(_ref) {
59
31
  disclaimer_link,
60
32
  privacypolicy_link,
61
33
  maxWidth = "lg",
62
- referal
34
+ referal,
35
+ sx = {},
36
+ useIcons = false
63
37
  } = data;
64
38
  const theme = useTheme();
65
39
  const APIcon = getIcon("APIcon");
66
-
67
- //console.log(logo.url);
68
-
69
40
  return /*#__PURE__*/React__default.createElement(AppBar, {
70
41
  position: "relative",
71
42
  sx: {
72
43
  backgroundColor: theme.palette.mode === "light" ? theme.palette.primary.light : theme.palette.primary.dark,
73
44
  top: "auto",
74
- bottom: 0
75
- }
45
+ bottom: 0,
46
+ ...sx
47
+ },
48
+ component: "footer"
76
49
  }, /*#__PURE__*/React__default.createElement(Container, {
77
50
  maxWidth: maxWidth
78
51
  }, /*#__PURE__*/React__default.createElement(Toolbar, {
@@ -106,7 +79,8 @@ function Footer(_ref) {
106
79
  color: "#ffffff",
107
80
  sx: {
108
81
  mb: 2
109
- }
82
+ },
83
+ component: "h2"
110
84
  }, site_title), (logo === null || logo === void 0 ? void 0 : logo.url) !== undefined && /*#__PURE__*/React__default.createElement(Link, {
111
85
  href: "#home"
112
86
  }, /*#__PURE__*/React__default.createElement(Box, {
@@ -131,26 +105,70 @@ function Footer(_ref) {
131
105
  variant: "h6",
132
106
  sx: {
133
107
  mb: 2
134
- }
108
+ },
109
+ component: "h2"
135
110
  }, "Contact Information"), /*#__PURE__*/React__default.createElement(Typography, {
136
- variant: "h6"
111
+ id: "company_name",
112
+ variant: "h6",
113
+ component: "h3"
137
114
  }, company_name), parent_company_name && /*#__PURE__*/React__default.createElement(Typography, {
138
- variant: "h6"
139
- }, "By ", parent_company_name), company_address && /*#__PURE__*/React__default.createElement(React__default.Fragment, null, /*#__PURE__*/React__default.createElement(Typography, {
115
+ id: "parent_company_name",
116
+ variant: "h6",
117
+ component: "h4"
118
+ }, "By ", parent_company_name), useIcons === true ? /*#__PURE__*/React__default.createElement(React__default.Fragment, null, /*#__PURE__*/React__default.createElement(Stack, {
119
+ spacing: 1,
120
+ sx: {
121
+ width: {
122
+ xs: "80%",
123
+ sm: "60%",
124
+ md: "80%"
125
+ }
126
+ }
127
+ }, company_address && /*#__PURE__*/React__default.createElement(Stack, {
128
+ direction: "row",
129
+ justifyContent: "space-between"
130
+ }, /*#__PURE__*/React__default.createElement(HomeIcon, null), /*#__PURE__*/React__default.createElement(Stack, {
131
+ alignItems: "flex-end"
132
+ }, /*#__PURE__*/React__default.createElement(Typography, {
140
133
  variant: "body1"
141
134
  }, company_address.street, " ", company_address.street_number, " ", company_address.street_number_addition && company_address.street_number_addition), /*#__PURE__*/React__default.createElement(Typography, {
142
135
  variant: "body1"
143
- }, company_address.postal_code, " ", company_address.city), /*#__PURE__*/React__default.createElement(Typography, {
136
+ }, company_address.postal_code, " ", company_address.city))), /*#__PURE__*/React__default.createElement(Stack, {
137
+ direction: "row",
138
+ justifyContent: "space-between"
139
+ }, /*#__PURE__*/React__default.createElement(PhoneIcon, null), /*#__PURE__*/React__default.createElement(Typography, {
144
140
  variant: "body1"
145
- }, company_address.country)), /*#__PURE__*/React__default.createElement(Typography, {
141
+ }, "+3133867606")), /*#__PURE__*/React__default.createElement(Stack, {
142
+ direction: "row",
143
+ justifyContent: "space-between"
144
+ }, /*#__PURE__*/React__default.createElement(EmailIcon, null), /*#__PURE__*/React__default.createElement(Typography, {
146
145
  variant: "body1"
147
- }, "CoC: ", CoC_number), /*#__PURE__*/React__default.createElement(Typography, {
146
+ }, "info@jellepaulus.nl")), /*#__PURE__*/React__default.createElement(Stack, {
147
+ direction: "row",
148
+ justifyContent: "space-between"
149
+ }, /*#__PURE__*/React__default.createElement(Typography, {
150
+ variant: "body1"
151
+ }, "CoC:"), /*#__PURE__*/React__default.createElement(Typography, {
152
+ variant: "body1"
153
+ }, CoC_number)), /*#__PURE__*/React__default.createElement(Stack, {
154
+ direction: "row",
155
+ justifyContent: "space-between"
156
+ }, /*#__PURE__*/React__default.createElement(Typography, {
157
+ variant: "body1"
158
+ }, "VAT:"), /*#__PURE__*/React__default.createElement(Typography, {
159
+ variant: "body1",
160
+ align: "right"
161
+ }, VAT_number)))) : /*#__PURE__*/React__default.createElement(React__default.Fragment, null, company_address && /*#__PURE__*/React__default.createElement(React__default.Fragment, null, /*#__PURE__*/React__default.createElement(Typography, {
148
162
  variant: "body1"
149
- }, "VAT: ", VAT_number), /*#__PURE__*/React__default.createElement(Typography, {
163
+ }, company_address.street, " ", company_address.street_number, " ", company_address.street_number_addition && company_address.street_number_addition), /*#__PURE__*/React__default.createElement(Typography, {
164
+ variant: "body1"
165
+ }, company_address.postal_code, " ", company_address.city), /*#__PURE__*/React__default.createElement(Typography, {
150
166
  variant: "body1"
151
- }), /*#__PURE__*/React__default.createElement(Typography, {
167
+ }, company_address.country), /*#__PURE__*/React__default.createElement(Typography, {
152
168
  variant: "body1"
153
- })), /*#__PURE__*/React__default.createElement(Grid, {
169
+ }, "CoC: ", CoC_number), /*#__PURE__*/React__default.createElement(Typography, {
170
+ variant: "body1"
171
+ }, "VAT: ", VAT_number)))), /*#__PURE__*/React__default.createElement(Grid, {
154
172
  item: true,
155
173
  xs: 12,
156
174
  sm: 6,
@@ -159,7 +177,8 @@ function Footer(_ref) {
159
177
  variant: "h6",
160
178
  sx: {
161
179
  mb: 2
162
- }
180
+ },
181
+ component: "h2"
163
182
  }, "Socials"), /*#__PURE__*/React__default.createElement(Stack, {
164
183
  spacing: 2,
165
184
  sx: {
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "umwd-components",
3
- "version": "0.1.214",
3
+ "version": "0.1.216",
4
4
  "description": "UMWD Component library",
5
5
  "main": "dist/cjs/index.js",
6
6
  "module": "dist/esm/index.js",
package/src/components/FooterV2.tsx CHANGED
@@ -24,37 +24,9 @@ import { MuiLink } from "./MuiLink.tsx";
24
24
  import { type ReactNode } from "react";
25
25
  import { type SxProps } from "@mui/system";
26
26
  import { type StrapiImageProps } from "./StrapiImage.tsx";
27
-
28
- /* Footer.propTypes = {
29
- site_title: PropTypes.string.isRequired,
30
- logo: PropTypes.shape({
31
- url: PropTypes.string.isRequired,
32
- width: PropTypes.number.isRequired,
33
- height: PropTypes.number.isRequired,
34
- alternativeText: PropTypes.string,
35
- }),
36
- company_name: PropTypes.string.isRequired,
37
- parent_company_name: PropTypes.string,
38
- company_address: PropTypes.shape({
39
- street: PropTypes.string,
40
- street_number: PropTypes.number,
41
- street_number_addition: PropTypes.string,
42
- postal_code: PropTypes.string,
43
- city: PropTypes.string,
44
- }),
45
- CoC_number: PropTypes.string.isRequired,
46
- VAT_number: PropTypes.string.isRequired,
47
- company_socials: PropTypes.arrayOf(
48
- PropTypes.shape({
49
- name: PropTypes.string.isRequired,
50
- url: PropTypes.string.isRequired,
51
- icon: PropTypes.elementType,
52
- })
53
- ),
54
- disclaimer_link: PropTypes.string,
55
- privacypolicy_link: PropTypes.string,
56
- referal: PropTypes.element,
57
- }; */
27
+ import HomeIcon from "@mui/icons-material/Home";
28
+ import PhoneIcon from "@mui/icons-material/Phone";
29
+ import EmailIcon from "@mui/icons-material/Email";
58
30
 
59
31
  interface company_address {
60
32
  street: string;
@@ -86,7 +58,8 @@ interface FooterProps {
86
58
  privacypolicy_link: string;
87
59
  maxWidth?: MaxWidth;
88
60
  referal: ReactNode;
89
- // sx?: SxProps<Theme>;
61
+ sx?: SxProps;
62
+ useIcons?: boolean;
90
63
  }
91
64
 
92
65
  function Footer({ data }: { readonly data: FooterProps }) {
@@ -103,14 +76,14 @@ function Footer({ data }: { readonly data: FooterProps }) {
103
76
  privacypolicy_link,
104
77
  maxWidth = "lg",
105
78
  referal,
79
+ sx = {},
80
+ useIcons = false,
106
81
  } = data;
107
82
 
108
83
  const theme = useTheme();
109
84
 
110
85
  const APIcon = getIcon("APIcon");
111
86
 
112
- //console.log(logo.url);
113
-
114
87
  return (
115
88
  <AppBar
116
89
  position="relative"
@@ -121,7 +94,9 @@ function Footer({ data }: { readonly data: FooterProps }) {
121
94
  : theme.palette.primary.dark,
122
95
  top: "auto",
123
96
  bottom: 0,
97
+ ...sx,
124
98
  }}
99
+ component={"footer"}
125
100
  >
126
101
  <Container maxWidth={maxWidth}>
127
102
  <Toolbar disableGutters>
@@ -138,7 +113,12 @@ function Footer({ data }: { readonly data: FooterProps }) {
138
113
  textDecoration: "none",
139
114
  }}
140
115
  >
141
- <Typography variant="h6" color="#ffffff" sx={{ mb: 2 }}>
116
+ <Typography
117
+ variant="h6"
118
+ color="#ffffff"
119
+ sx={{ mb: 2 }}
120
+ component={"h2"}
121
+ >
142
122
  {site_title}
143
123
  </Typography>
144
124
 
@@ -165,40 +145,93 @@ function Footer({ data }: { readonly data: FooterProps }) {
165
145
  </Box>
166
146
  </Grid>
167
147
  <Grid item xs={12} sm={6} md={4}>
168
- <Typography variant="h6" sx={{ mb: 2 }}>
148
+ <Typography variant="h6" sx={{ mb: 2 }} component={"h2"}>
169
149
  Contact Information
170
150
  </Typography>
171
- <Typography variant="h6">{company_name}</Typography>
151
+ <Typography id={"company_name"} variant="h6" component={"h3"}>
152
+ {company_name}
153
+ </Typography>
172
154
  {parent_company_name && (
173
- <Typography variant="h6">By {parent_company_name}</Typography>
155
+ <Typography
156
+ id={"parent_company_name"}
157
+ variant="h6"
158
+ component={"h4"}
159
+ >
160
+ By {parent_company_name}
161
+ </Typography>
174
162
  )}
175
- {company_address && (
163
+ {useIcons === true ? (
176
164
  <>
177
- <Typography variant="body1">
178
- {company_address.street} {company_address.street_number}{" "}
179
- {company_address.street_number_addition &&
180
- company_address.street_number_addition}
181
- </Typography>
165
+ <Stack
166
+ spacing={1}
167
+ sx={{ width: { xs: "80%", sm: "60%", md: "80%" } }}
168
+ >
169
+ {company_address && (
170
+ <Stack direction="row" justifyContent={"space-between"}>
171
+ <HomeIcon />
172
+ <Stack alignItems={"flex-end"}>
173
+ <Typography variant="body1">
174
+ {company_address.street}{" "}
175
+ {company_address.street_number}{" "}
176
+ {company_address.street_number_addition &&
177
+ company_address.street_number_addition}
178
+ </Typography>
179
+ <Typography variant="body1">
180
+ {company_address.postal_code} {company_address.city}
181
+ </Typography>
182
+ </Stack>
183
+ </Stack>
184
+ )}
182
185
 
183
- <Typography variant="body1">
184
- {company_address.postal_code} {company_address.city}
185
- </Typography>
186
- <Typography variant="body1">
187
- {company_address.country}
188
- </Typography>
186
+ <Stack direction="row" justifyContent={"space-between"}>
187
+ <PhoneIcon />
188
+ <Typography variant="body1">+3133867606</Typography>
189
+ </Stack>
190
+ <Stack direction="row" justifyContent={"space-between"}>
191
+ <EmailIcon />
192
+ <Typography variant="body1">
193
+ info@jellepaulus.nl
194
+ </Typography>
195
+ </Stack>
196
+ <Stack direction="row" justifyContent={"space-between"}>
197
+ <Typography variant="body1">CoC:</Typography>
198
+ <Typography variant="body1">{CoC_number}</Typography>
199
+ </Stack>
200
+ <Stack direction="row" justifyContent={"space-between"}>
201
+ <Typography variant="body1">VAT:</Typography>
202
+ <Typography variant="body1" align="right">
203
+ {VAT_number}
204
+ </Typography>
205
+ </Stack>
206
+ </Stack>
189
207
  </>
190
- )}
191
-
192
- <Typography variant="body1">CoC: {CoC_number}</Typography>
193
- <Typography variant="body1">VAT: {VAT_number}</Typography>
208
+ ) : (
209
+ <>
210
+ {company_address && (
211
+ <>
212
+ <Typography variant="body1">
213
+ {company_address.street} {company_address.street_number}{" "}
214
+ {company_address.street_number_addition &&
215
+ company_address.street_number_addition}
216
+ </Typography>
194
217
 
195
- <Typography variant="body1"></Typography>
196
- <Typography variant="body1"></Typography>
218
+ <Typography variant="body1">
219
+ {company_address.postal_code} {company_address.city}
220
+ </Typography>
221
+ <Typography variant="body1">
222
+ {company_address.country}
223
+ </Typography>
224
+ <Typography variant="body1">CoC: {CoC_number}</Typography>
225
+ <Typography variant="body1">VAT: {VAT_number}</Typography>
226
+ </>
227
+ )}
228
+ </>
229
+ )}
197
230
  </Grid>
198
231
  <Grid item xs={12} sm={6} md={4}>
199
232
  {company_socials && company_socials.length > 0 && (
200
233
  <>
201
- <Typography variant="h6" sx={{ mb: 2 }}>
234
+ <Typography variant="h6" sx={{ mb: 2 }} component={"h2"}>
202
235
  Socials
203
236
  </Typography>
204
237
  <Stack
package/src/stories/Footer.stories.js CHANGED
@@ -1,4 +1,4 @@
1
- import Footer from "../components/Footer";
1
+ import Footer from "../components/FooterV2.tsx";
2
2
  import React from "react";
3
3
  import thumbnail from "../../public/placeholders/thumbnail_100X100.png";
4
4
  import logo from "../../public/logo.png";
@@ -45,82 +45,88 @@ export const Orefs = Template.bind({});
45
45
  }; */
46
46
 
47
47
  Orefs.args = {
48
- site_title: "Orefs",
49
- /* logo: {
48
+ data: {
49
+ site_title: "Orefs",
50
+ /* logo: {
50
51
  url: thumbnail.src,
51
52
  width: thumbnail.width,
52
53
  height: thumbnail.height,
53
54
  alt: "Logo",
54
55
  }, */
55
- company_name: "Orefs",
56
- parent_company_name: "Orefs",
57
- company_address: {
58
- street: "Molenkade",
59
- street_number: "8",
60
- street_number_addition: "A",
61
- postal_code: "1115AB",
62
- city: "Duivendrecht",
63
- },
64
- CoC_number: "12345678",
65
- VAT_number: "NL123456789B01",
66
- company_socials: [
67
- {
68
- name: "Facebook",
69
- url: "https://www.facebook.com/",
70
- icon: "FaceBookIcon",
71
- },
72
- {
73
- name: "Instagram",
74
- url: "https://www.instagram.com/",
75
- icon: "InstagramIcon",
76
- },
77
- {
78
- name: "LinkedIn",
79
- url: "https://www.linkedin.com/",
80
- icon: "LinkedInIcon",
56
+ company_name: "Orefs",
57
+ parent_company_name: "Orefs",
58
+ company_address: {
59
+ street: "Molenkade",
60
+ street_number: "8",
61
+ street_number_addition: "A",
62
+ postal_code: "1115AB",
63
+ city: "Duivendrecht",
81
64
  },
82
- ],
65
+ CoC_number: "12345678",
66
+ VAT_number: "NL123456789B01",
67
+ company_socials: [
68
+ {
69
+ name: "Facebook",
70
+ url: "https://www.facebook.com/",
71
+ icon: "FaceBookIcon",
72
+ },
73
+ {
74
+ name: "Instagram",
75
+ url: "https://www.instagram.com/",
76
+ icon: "InstagramIcon",
77
+ },
78
+ {
79
+ name: "LinkedIn",
80
+ url: "https://www.linkedin.com/",
81
+ icon: "LinkedInIcon",
82
+ },
83
+ ],
84
+ },
83
85
  };
84
86
 
85
87
  export const AMH = Template.bind({});
86
88
 
87
89
  AMH.args = {
88
- site_title: "AeroMedical Holland",
89
- logo: {
90
- url: logo.src,
91
- width: logo.width / 3,
92
- height: logo.height / 3,
93
- alt: "Logo",
94
- },
95
- company_name: "AeroMedical Holland",
96
- company_address: {
97
- street: "Straatnaam",
98
- street_number: "33",
99
- street_number_addition: "A",
100
- postal_code: "3333BS",
101
- city: "Plaatsnaam",
102
- },
103
- CoC_number: "12345678",
104
- VAT_number: "NL123456789B01",
105
- company_socials: [
106
- {
107
- name: "Facebook",
108
- url: "https://www.facebook.com/",
109
- icon: "FaceBookIcon",
90
+ data: {
91
+ site_title: "AeroMedical Holland",
92
+ logo: {
93
+ url: logo.src,
94
+ width: logo.width / 3,
95
+ height: logo.height / 3,
96
+ alt: "Logo",
110
97
  },
111
- {
112
- name: "Instagram",
113
- url: "https://www.instagram.com/",
114
- icon: "InstagramIcon",
98
+ company_name: "AeroMedical Holland",
99
+ company_address: {
100
+ street: "Straatnaam",
101
+ street_number: "33",
102
+ street_number_addition: "A",
103
+ postal_code: "3333BS",
104
+ city: "Plaatsnaam",
115
105
  },
116
- {
117
- name: "LinkedIn",
118
- url: "https://www.linkedin.com/",
119
- icon: "LinkedInIcon",
120
- },
121
- ],
122
- disclaimer_link: "#",
123
- privacypolicy_link: "#",
106
+ CoC_number: "12345678",
107
+ VAT_number: "NL123456789B01",
108
+ company_socials: [
109
+ {
110
+ name: "Facebook",
111
+ url: "https://www.facebook.com/",
112
+ icon: "FaceBookIcon",
113
+ },
114
+ {
115
+ name: "Instagram",
116
+ url: "https://www.instagram.com/",
117
+ icon: "InstagramIcon",
118
+ },
119
+ {
120
+ name: "LinkedIn",
121
+ url: "https://www.linkedin.com/",
122
+ icon: "LinkedInIcon",
123
+ },
124
+ ],
125
+ disclaimer_link: "#",
126
+ privacypolicy_link: "#",
127
+
128
+ useIcons: true,
129
+ },
124
130
  };
125
131
 
126
132
  /*