umwd-components 0.1.93 → 0.1.95

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 (9) hide show
  1. package/dist/cjs/components/HeroSection.js +2 -3
  2. package/dist/cjs/components/PersonaliaSection.js +3 -3
  3. package/dist/esm/components/HeroSection.js +2 -3
  4. package/dist/esm/components/PersonaliaSection.js +3 -3
  5. package/package.json +1 -1
  6. package/src/components/HeroSection.tsx +2 -3
  7. package/src/components/PersonaliaSection.tsx +64 -59
  8. package/src/stories/HeroSection.stories.js +31 -4
  9. package/src/stories/Page.stories.js +1 -0
package/dist/cjs/components/HeroSection.js CHANGED
@@ -47,9 +47,9 @@ function HeroSection(_ref) {
47
47
  width: "100%",
48
48
  height: "100%"
49
49
  },
50
- height: 1080,
50
+ height: bgImage.height || 1080,
51
51
  src: bgImage.url,
52
- width: 1920
52
+ width: bgImage.width || 1920
53
53
  }), /*#__PURE__*/React.createElement(material.Stack, {
54
54
  spacing: 2,
55
55
  alignItems: "center",
@@ -62,7 +62,6 @@ function HeroSection(_ref) {
62
62
  }, logoImage && /*#__PURE__*/React.createElement(StrapiImage.StrapiImage, {
63
63
  alt: logoImage.alternativeText,
64
64
  height: logoImage.height || 100,
65
- style: logoImage.style || {},
66
65
  src: logoImage.url,
67
66
  width: logoImage.width || 100
68
67
  }), /*#__PURE__*/React.createElement(material.Typography, {
package/dist/cjs/components/PersonaliaSection.js CHANGED
@@ -29,8 +29,8 @@ function PersonaliaSection(_ref) {
29
29
  }, /*#__PURE__*/React.createElement(material.Grid, {
30
30
  container: true,
31
31
  spacing: 2
32
- }, partner.map(partner => {
33
- var _partner$links;
32
+ }, partner && partner.map(partner => {
33
+ var _partner$links, _partner$photo;
34
34
  return /*#__PURE__*/React.createElement(material.Grid, {
35
35
  item: true,
36
36
  xs: 12,
@@ -70,7 +70,7 @@ function PersonaliaSection(_ref) {
70
70
  }), partner.linkedIn && /*#__PURE__*/React.createElement(material.Typography, null, /*#__PURE__*/React.createElement(material.IconButton, null, /*#__PURE__*/React.createElement(iconsMaterial.LinkedIn, null))), partner.email && /*#__PURE__*/React.createElement(material.Typography, null, partner.email)), /*#__PURE__*/React.createElement(material.Grid, {
71
71
  item: true,
72
72
  xs: 3
73
- }, /*#__PURE__*/React.createElement(StrapiImage.StrapiImage, {
73
+ }, ((_partner$photo = partner.photo) === null || _partner$photo === void 0 ? void 0 : _partner$photo.url) && /*#__PURE__*/React.createElement(StrapiImage.StrapiImage, {
74
74
  src: partner.photo.url,
75
75
  alt: partner.photo.alternativeText,
76
76
  width: partner.photo.width,
package/dist/esm/components/HeroSection.js CHANGED
@@ -45,9 +45,9 @@ function HeroSection(_ref) {
45
45
  width: "100%",
46
46
  height: "100%"
47
47
  },
48
- height: 1080,
48
+ height: bgImage.height || 1080,
49
49
  src: bgImage.url,
50
- width: 1920
50
+ width: bgImage.width || 1920
51
51
  }), /*#__PURE__*/React__default.createElement(Stack, {
52
52
  spacing: 2,
53
53
  alignItems: "center",
@@ -60,7 +60,6 @@ function HeroSection(_ref) {
60
60
  }, logoImage && /*#__PURE__*/React__default.createElement(StrapiImage, {
61
61
  alt: logoImage.alternativeText,
62
62
  height: logoImage.height || 100,
63
- style: logoImage.style || {},
64
63
  src: logoImage.url,
65
64
  width: logoImage.width || 100
66
65
  }), /*#__PURE__*/React__default.createElement(Typography, {
package/dist/esm/components/PersonaliaSection.js CHANGED
@@ -27,8 +27,8 @@ function PersonaliaSection(_ref) {
27
27
  }, /*#__PURE__*/React__default.createElement(Grid, {
28
28
  container: true,
29
29
  spacing: 2
30
- }, partner.map(partner => {
31
- var _partner$links;
30
+ }, partner && partner.map(partner => {
31
+ var _partner$links, _partner$photo;
32
32
  return /*#__PURE__*/React__default.createElement(Grid, {
33
33
  item: true,
34
34
  xs: 12,
@@ -68,7 +68,7 @@ function PersonaliaSection(_ref) {
68
68
  }), partner.linkedIn && /*#__PURE__*/React__default.createElement(Typography, null, /*#__PURE__*/React__default.createElement(IconButton, null, /*#__PURE__*/React__default.createElement(LinkedIn, null))), partner.email && /*#__PURE__*/React__default.createElement(Typography, null, partner.email)), /*#__PURE__*/React__default.createElement(Grid, {
69
69
  item: true,
70
70
  xs: 3
71
- }, /*#__PURE__*/React__default.createElement(StrapiImage, {
71
+ }, ((_partner$photo = partner.photo) === null || _partner$photo === void 0 ? void 0 : _partner$photo.url) && /*#__PURE__*/React__default.createElement(StrapiImage, {
72
72
  src: partner.photo.url,
73
73
  alt: partner.photo.alternativeText,
74
74
  width: partner.photo.width,
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "umwd-components",
3
- "version": "0.1.93",
3
+ "version": "0.1.95",
4
4
  "description": "UMWD Component library",
5
5
  "main": "dist/cjs/index.js",
6
6
  "module": "dist/esm/index.js",
package/src/components/HeroSection.tsx CHANGED
@@ -56,9 +56,9 @@ export function HeroSection({ data }: Readonly<HeroSectionProps>) {
56
56
  width: "100%",
57
57
  height: "100%",
58
58
  }}
59
- height={1080}
59
+ height={bgImage.height || 1080}
60
60
  src={bgImage.url}
61
- width={1920}
61
+ width={bgImage.width || 1920}
62
62
  />
63
63
  )}
64
64
  <Stack
@@ -71,7 +71,6 @@ export function HeroSection({ data }: Readonly<HeroSectionProps>) {
71
71
  <StrapiImage
72
72
  alt={logoImage.alternativeText}
73
73
  height={logoImage.height || 100}
74
- style={logoImage.style || {}}
75
74
  src={logoImage.url}
76
75
  width={logoImage.width || 100}
77
76
  />
package/src/components/PersonaliaSection.tsx CHANGED
@@ -46,7 +46,7 @@ interface PersonaliaSectionProps {
46
46
  __component: string;
47
47
  title: string;
48
48
  description: string;
49
- partner: PartnerProps[];
49
+ partner?: PartnerProps[];
50
50
  maxWidth: MaxWidth;
51
51
  }
52
52
 
@@ -62,66 +62,71 @@ export function PersonaliaSection({
62
62
  return (
63
63
  <Container maxWidth={maxWidth || "lg"} sx={{ my: 1 }}>
64
64
  <Grid container spacing={2}>
65
- {partner.map((partner) => {
66
- return (
67
- <Grid item xs={12} md={6} key={partner.id}>
68
- <Paper sx={{ p: 2, height: "100%" }}>
69
- <Grid container>
70
- <Grid item xs={9}>
71
- <Typography
72
- variant="h5"
73
- sx={{
74
- mb: 2,
75
- display: "flex",
76
- justifyContent: "flex-start",
77
- alignItems: "center",
78
- }}
79
- >
80
- {partner.name}
81
- </Typography>
82
- <Typography
83
- variant="body2"
84
- color="text.secondary"
85
- component="div"
86
- >
87
- {partner.function}
88
- </Typography>
89
- {partner.links?.length > 0 &&
90
- partner.links.map((link) => {
91
- return (
92
- // TODO use and create MuiLink Component
93
- <Link href={link.url} key={link.id}>
94
- {link.text}
95
- </Link>
96
- );
97
- })}
98
- {partner.linkedIn && (
99
- <Typography>
100
- <IconButton>
101
- <LinkedIn />
102
- </IconButton>
65
+ {partner &&
66
+ partner.map((partner) => {
67
+ return (
68
+ <Grid item xs={12} md={6} key={partner.id}>
69
+ <Paper sx={{ p: 2, height: "100%" }}>
70
+ <Grid container>
71
+ <Grid item xs={9}>
72
+ <Typography
73
+ variant="h5"
74
+ sx={{
75
+ mb: 2,
76
+ display: "flex",
77
+ justifyContent: "flex-start",
78
+ alignItems: "center",
79
+ }}
80
+ >
81
+ {partner.name}
103
82
  </Typography>
104
- )}
105
- {partner.email && <Typography>{partner.email}</Typography>}
106
- </Grid>
107
- <Grid item xs={3}>
108
- <StrapiImage
109
- src={partner.photo.url}
110
- alt={partner.photo.alternativeText}
111
- width={partner.photo.width}
112
- height={partner.photo.height}
113
- style={{
114
- objectFit: "contain",
115
- width: "100%",
116
- height: "100%",
117
- }}
118
- />
83
+ <Typography
84
+ variant="body2"
85
+ color="text.secondary"
86
+ component="div"
87
+ >
88
+ {partner.function}
89
+ </Typography>
90
+ {partner.links?.length > 0 &&
91
+ partner.links.map((link) => {
92
+ return (
93
+ // TODO use and create MuiLink Component
94
+ <Link href={link.url} key={link.id}>
95
+ {link.text}
96
+ </Link>
97
+ );
98
+ })}
99
+ {partner.linkedIn && (
100
+ <Typography>
101
+ <IconButton>
102
+ <LinkedIn />
103
+ </IconButton>
104
+ </Typography>
105
+ )}
106
+ {partner.email && (
107
+ <Typography>{partner.email}</Typography>
108
+ )}
109
+ </Grid>
110
+ <Grid item xs={3}>
111
+ {partner.photo?.url && (
112
+ <StrapiImage
113
+ src={partner.photo.url}
114
+ alt={partner.photo.alternativeText}
115
+ width={partner.photo.width}
116
+ height={partner.photo.height}
117
+ style={{
118
+ objectFit: "contain",
119
+ width: "100%",
120
+ height: "100%",
121
+ }}
122
+ />
123
+ )}
124
+ </Grid>
119
125
  </Grid>
120
- </Grid>
121
- </Paper>
122
- </Grid>
123
- );
124
- })}
126
+ </Paper>
127
+ </Grid>
128
+ );
129
+ })}
125
130
  </Grid>
126
131
  </Container>
127
132
  );
package/src/stories/HeroSection.stories.js CHANGED
@@ -1,5 +1,5 @@
1
1
  import React from "react";
2
- import { HeroSection } from "../components/custom/HeroSection";
2
+ import { HeroSection } from "../components/HeroSection";
3
3
 
4
4
  export default {
5
5
  title: "UMWD/HeroSection",
@@ -15,7 +15,7 @@ export const Orefs = Template.bind({});
15
15
  Orefs.args = {
16
16
  data: {
17
17
  id: 1,
18
- __component: "custom.hero-section",
18
+ __component: "layout.hero-section",
19
19
  heading: "Orefs",
20
20
  subHeading: "A place for all your resources",
21
21
  image: {
@@ -33,7 +33,7 @@ Orefs.args = {
33
33
 
34
34
  export const AMH = Template.bind({});
35
35
 
36
- AMH.args = {
36
+ /* AMH.args = {
37
37
  data: {
38
38
  id: 2,
39
39
  __component: "custom.hero-section",
@@ -50,6 +50,33 @@ AMH.args = {
50
50
  text: "Resources",
51
51
  },
52
52
  },
53
+ }; */
54
+
55
+ AMH.args = {
56
+ data: {
57
+ id: 1,
58
+ __component: "layout.hero-section",
59
+ heading: null,
60
+ subHeading:
61
+ "We offer world wide, around the clock patient transport by air ambulance. Our aircrafts are equipped with state of the art medical equipment and staffed with highly qualified flying crews and medical teams. We will bring the patient back home, reliable and safely for affordable pricing.",
62
+ bgImage: {
63
+ id: 2,
64
+ name: "dm_masked@2x.png",
65
+ alternativeText: null,
66
+ width: 3841,
67
+ height: 2161,
68
+ url: "/uploads/dm_masked_2x_3eabdcd56c.png",
69
+ },
70
+ logoImage: {
71
+ id: 9,
72
+ name: "Airplane Cover-07.png",
73
+ alternativeText: null,
74
+ width: 1280,
75
+ height: 720,
76
+ url: "/uploads/Airplane_Cover_07_f71759b898.png",
77
+ },
78
+ link: { id: 1, url: "/contact", text: "Contact us", isExternal: false },
79
+ },
53
80
  };
54
81
 
55
82
  export const UMWD = Template.bind({});
@@ -57,7 +84,7 @@ export const UMWD = Template.bind({});
57
84
  UMWD.args = {
58
85
  data: {
59
86
  id: 3,
60
- __component: "custom.hero-section",
87
+ __component: "layout.hero-section",
61
88
  heading: "UMWD",
62
89
  subHeading: "A place for all your resources",
63
90
  image: {
package/src/stories/Page.stories.js CHANGED
@@ -155,6 +155,7 @@ export const AMH = Template.bind({});
155
155
 
156
156
  AMH.args = {
157
157
  sx: {
158
+ gap: 2,
158
159
  header: {
159
160
  h1: {
160
161
  color: "red",