@pareto-engineering/design-system 2.0.0-alpha.39 → 2.0.0-alpha.41

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 (163) hide show
  1. package/dist/cjs/c/ContentSlides/common/HorizontalMenu/HorizontalMenu.js +11 -4
  2. package/dist/cjs/f/fields/RatingsInput/RatingsInput.js +39 -6
  3. package/dist/cjs/f/fields/RatingsInput/styles.scss +29 -20
  4. package/dist/cjs/f/fields/TextInput/TextInput.js +10 -3
  5. package/dist/es/c/ContentSlides/common/HorizontalMenu/HorizontalMenu.js +11 -4
  6. package/dist/es/f/fields/RatingsInput/RatingsInput.js +38 -6
  7. package/dist/es/f/fields/RatingsInput/styles.scss +29 -20
  8. package/dist/es/f/fields/TextInput/TextInput.js +10 -3
  9. package/package.json +1 -1
  10. package/src/__snapshots__/Storyshots.test.js.snap +655 -625
  11. package/src/stories/f/RatingsInput.stories.jsx +3 -2
  12. package/src/ui/c/ContentSlides/common/HorizontalMenu/HorizontalMenu.jsx +8 -1
  13. package/src/ui/f/fields/RatingsInput/RatingsInput.jsx +54 -19
  14. package/src/ui/f/fields/RatingsInput/styles.scss +29 -20
  15. package/src/ui/f/fields/TextInput/TextInput.jsx +7 -0
  16. package/dist/cjs/a/GradientBackground/GradientBackground.js +0 -140
  17. package/dist/cjs/a/GradientBackground/index.js +0 -15
  18. package/dist/cjs/a/GradientBackground/styles.scss +0 -191
  19. package/dist/cjs/c/AcceptCookies/AcceptCookies.js +0 -134
  20. package/dist/cjs/c/AcceptCookies/index.js +0 -15
  21. package/dist/cjs/c/AcceptCookies/styles.scss +0 -49
  22. package/dist/cjs/c/BlogCategoryButton/BlogCategoryButton.js +0 -95
  23. package/dist/cjs/c/BlogCategoryButton/index.js +0 -15
  24. package/dist/cjs/c/BlogContext/BlogContextProvider.js +0 -63
  25. package/dist/cjs/c/BlogContext/Context.js +0 -16
  26. package/dist/cjs/c/BlogContext/ContextProvider.js +0 -63
  27. package/dist/cjs/c/BlogContext/index.js +0 -31
  28. package/dist/cjs/c/BlogContext/useBlog.js +0 -16
  29. package/dist/cjs/c/BlogPost/BlogPost.js +0 -147
  30. package/dist/cjs/c/BlogPost/index.js +0 -15
  31. package/dist/cjs/c/BlogPost/styles.scss +0 -33
  32. package/dist/cjs/c/BlogPostsList/BlogPostsList.js +0 -73
  33. package/dist/cjs/c/BlogPostsList/common/Card/Card.js +0 -170
  34. package/dist/cjs/c/BlogPostsList/common/Card/index.js +0 -15
  35. package/dist/cjs/c/BlogPostsList/common/index.js +0 -13
  36. package/dist/cjs/c/BlogPostsList/index.js +0 -15
  37. package/dist/cjs/c/BlogPostsList/styles.scss +0 -72
  38. package/dist/cjs/c/SiteFooter/SiteFooter.js +0 -73
  39. package/dist/cjs/c/SiteFooter/common/Section/Section.js +0 -95
  40. package/dist/cjs/c/SiteFooter/common/Section/index.js +0 -15
  41. package/dist/cjs/c/SiteFooter/common/index.js +0 -13
  42. package/dist/cjs/c/SiteFooter/index.js +0 -15
  43. package/dist/cjs/c/SiteFooter/styles.scss +0 -34
  44. package/dist/cjs/c/SiteHeaderCTA/SiteHeaderCTA.js +0 -108
  45. package/dist/cjs/c/SiteHeaderCTA/index.js +0 -15
  46. package/dist/cjs/c/SiteHeaderCTA/styles.scss +0 -44
  47. package/dist/cjs/c/SiteMission/SiteMission.js +0 -113
  48. package/dist/cjs/c/SiteMission/index.js +0 -15
  49. package/dist/cjs/c/SiteMission/styles.scss +0 -30
  50. package/dist/cjs/c/SiteNavigation/SiteNavigation.js +0 -130
  51. package/dist/cjs/c/SiteNavigation/index.js +0 -15
  52. package/dist/cjs/c/SiteNavigation/styles.scss +0 -118
  53. package/dist/cjs/c/SiteOnboardingStep/SiteOnboardingStep.js +0 -98
  54. package/dist/cjs/c/SiteOnboardingStep/index.js +0 -15
  55. package/dist/cjs/c/SiteOnboardingStep/styles.scss +0 -51
  56. package/dist/cjs/c/SitePricing/SitePricing.js +0 -108
  57. package/dist/cjs/c/SitePricing/index.js +0 -15
  58. package/dist/cjs/c/SitePricing/styles.scss +0 -73
  59. package/dist/cjs/c/SiteServices/SiteServices.js +0 -211
  60. package/dist/cjs/c/SiteServices/index.js +0 -15
  61. package/dist/cjs/c/SiteServices/styles.scss +0 -138
  62. package/dist/cjs/c/TeamGallery/TeamGallery.js +0 -80
  63. package/dist/cjs/c/TeamGallery/common/PersonCard/PersonCard.js +0 -84
  64. package/dist/cjs/c/TeamGallery/common/PersonCard/index.js +0 -15
  65. package/dist/cjs/c/TeamGallery/common/index.js +0 -13
  66. package/dist/cjs/c/TeamGallery/index.js +0 -15
  67. package/dist/cjs/c/TeamGallery/styles.scss +0 -100
  68. package/dist/cjs/c/Testimonials/Testimonials.js +0 -119
  69. package/dist/cjs/c/Testimonials/index.js +0 -15
  70. package/dist/cjs/c/Testimonials/styles.scss +0 -112
  71. package/dist/cjs/experimental/GradientBackground/GradientBackground.js +0 -98
  72. package/dist/cjs/experimental/GradientBackground/index.js +0 -15
  73. package/dist/cjs/experimental/GradientBackground/styles.scss +0 -64
  74. package/dist/cjs/experimental/index.js +0 -13
  75. package/dist/cjs/f/fields/CheckboxInput/CheckboxInput.js +0 -105
  76. package/dist/cjs/f/fields/CheckboxInput/index.js +0 -15
  77. package/dist/cjs/f/fields/CheckboxInput/styles.scss +0 -28
  78. package/dist/cjs/f/fields/RadioInput/RadioInput.js +0 -110
  79. package/dist/cjs/f/fields/RadioInput/index.js +0 -15
  80. package/dist/cjs/f/fields/RadioInput/styles.scss +0 -26
  81. package/dist/cjs/f/fields/TaskRecommendation/TaskRecommendation.js +0 -129
  82. package/dist/cjs/f/fields/TaskRecommendation/index.js +0 -15
  83. package/dist/cjs/f/fields/TaskRecommendation/styles.scss +0 -37
  84. package/dist/cjs/f/fields/TaskRecommendationInput/TaskRecommendationInput.js +0 -131
  85. package/dist/cjs/f/fields/TaskRecommendationInput/index.js +0 -15
  86. package/dist/cjs/f/fields/TaskRecommendationInput/styles.scss +0 -41
  87. package/dist/cjs/f/fields/TextArea/TextArea.js +0 -141
  88. package/dist/cjs/f/fields/TextArea/index.js +0 -15
  89. package/dist/cjs/f/fields/TextArea/styles.scss +0 -19
  90. package/dist/es/a/GradientBackground/GradientBackground.js +0 -118
  91. package/dist/es/a/GradientBackground/index.js +0 -2
  92. package/dist/es/a/GradientBackground/styles.scss +0 -191
  93. package/dist/es/c/AcceptCookies/AcceptCookies.js +0 -117
  94. package/dist/es/c/AcceptCookies/index.js +0 -2
  95. package/dist/es/c/AcceptCookies/styles.scss +0 -49
  96. package/dist/es/c/BlogCategoryButton/BlogCategoryButton.js +0 -68
  97. package/dist/es/c/BlogCategoryButton/index.js +0 -2
  98. package/dist/es/c/BlogContext/BlogContextProvider.js +0 -45
  99. package/dist/es/c/BlogContext/Context.js +0 -2
  100. package/dist/es/c/BlogContext/ContextProvider.js +0 -45
  101. package/dist/es/c/BlogContext/index.js +0 -4
  102. package/dist/es/c/BlogContext/useBlog.js +0 -3
  103. package/dist/es/c/BlogPost/BlogPost.js +0 -128
  104. package/dist/es/c/BlogPost/index.js +0 -2
  105. package/dist/es/c/BlogPost/styles.scss +0 -33
  106. package/dist/es/c/BlogPostsList/BlogPostsList.js +0 -56
  107. package/dist/es/c/BlogPostsList/common/Card/Card.js +0 -143
  108. package/dist/es/c/BlogPostsList/common/Card/index.js +0 -2
  109. package/dist/es/c/BlogPostsList/common/index.js +0 -1
  110. package/dist/es/c/BlogPostsList/index.js +0 -2
  111. package/dist/es/c/BlogPostsList/styles.scss +0 -72
  112. package/dist/es/c/SiteFooter/SiteFooter.js +0 -56
  113. package/dist/es/c/SiteFooter/common/Section/Section.js +0 -73
  114. package/dist/es/c/SiteFooter/common/Section/index.js +0 -2
  115. package/dist/es/c/SiteFooter/common/index.js +0 -1
  116. package/dist/es/c/SiteFooter/index.js +0 -2
  117. package/dist/es/c/SiteFooter/styles.scss +0 -34
  118. package/dist/es/c/SiteHeaderCTA/SiteHeaderCTA.js +0 -92
  119. package/dist/es/c/SiteHeaderCTA/index.js +0 -2
  120. package/dist/es/c/SiteHeaderCTA/styles.scss +0 -44
  121. package/dist/es/c/SiteMission/SiteMission.js +0 -96
  122. package/dist/es/c/SiteMission/index.js +0 -2
  123. package/dist/es/c/SiteMission/styles.scss +0 -30
  124. package/dist/es/c/SiteNavigation/SiteNavigation.js +0 -111
  125. package/dist/es/c/SiteNavigation/index.js +0 -2
  126. package/dist/es/c/SiteNavigation/styles.scss +0 -118
  127. package/dist/es/c/SiteOnboardingStep/SiteOnboardingStep.js +0 -81
  128. package/dist/es/c/SiteOnboardingStep/index.js +0 -2
  129. package/dist/es/c/SiteOnboardingStep/styles.scss +0 -51
  130. package/dist/es/c/SitePricing/SitePricing.js +0 -91
  131. package/dist/es/c/SitePricing/index.js +0 -2
  132. package/dist/es/c/SitePricing/styles.scss +0 -73
  133. package/dist/es/c/SiteServices/SiteServices.js +0 -195
  134. package/dist/es/c/SiteServices/index.js +0 -2
  135. package/dist/es/c/SiteServices/styles.scss +0 -138
  136. package/dist/es/c/TeamGallery/TeamGallery.js +0 -64
  137. package/dist/es/c/TeamGallery/common/PersonCard/PersonCard.js +0 -64
  138. package/dist/es/c/TeamGallery/common/PersonCard/index.js +0 -2
  139. package/dist/es/c/TeamGallery/common/index.js +0 -1
  140. package/dist/es/c/TeamGallery/index.js +0 -2
  141. package/dist/es/c/TeamGallery/styles.scss +0 -100
  142. package/dist/es/c/Testimonials/Testimonials.js +0 -99
  143. package/dist/es/c/Testimonials/index.js +0 -2
  144. package/dist/es/c/Testimonials/styles.scss +0 -112
  145. package/dist/es/experimental/GradientBackground/GradientBackground.js +0 -76
  146. package/dist/es/experimental/GradientBackground/index.js +0 -2
  147. package/dist/es/experimental/GradientBackground/styles.scss +0 -64
  148. package/dist/es/experimental/index.js +0 -1
  149. package/dist/es/f/fields/CheckboxInput/CheckboxInput.js +0 -85
  150. package/dist/es/f/fields/CheckboxInput/index.js +0 -2
  151. package/dist/es/f/fields/CheckboxInput/styles.scss +0 -28
  152. package/dist/es/f/fields/RadioInput/RadioInput.js +0 -90
  153. package/dist/es/f/fields/RadioInput/index.js +0 -2
  154. package/dist/es/f/fields/RadioInput/styles.scss +0 -26
  155. package/dist/es/f/fields/TaskRecommendation/TaskRecommendation.js +0 -111
  156. package/dist/es/f/fields/TaskRecommendation/index.js +0 -2
  157. package/dist/es/f/fields/TaskRecommendation/styles.scss +0 -37
  158. package/dist/es/f/fields/TaskRecommendationInput/TaskRecommendationInput.js +0 -111
  159. package/dist/es/f/fields/TaskRecommendationInput/index.js +0 -2
  160. package/dist/es/f/fields/TaskRecommendationInput/styles.scss +0 -41
  161. package/dist/es/f/fields/TextArea/TextArea.js +0 -124
  162. package/dist/es/f/fields/TextArea/index.js +0 -2
  163. package/dist/es/f/fields/TextArea/styles.scss +0 -19
@@ -1,15 +0,0 @@
1
- "use strict";
2
-
3
- Object.defineProperty(exports, "__esModule", {
4
- value: true
5
- });
6
- Object.defineProperty(exports, "SiteOnboardingStep", {
7
- enumerable: true,
8
- get: function get() {
9
- return _SiteOnboardingStep.default;
10
- }
11
- });
12
-
13
- var _SiteOnboardingStep = _interopRequireDefault(require("./SiteOnboardingStep"));
14
-
15
- function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
@@ -1,51 +0,0 @@
1
- /* @pareto-engineering/generator-front 1.0.12 */
2
-
3
- @use "@pareto-engineering/bem";
4
- @use "@aztlan/stylebook/src/mixins";
5
- @use "@aztlan/stylebook/src/globals" as *;
6
-
7
- $onboarding-step-img-height:10em;
8
- $index-color:var(--dark-subtitle);
9
- $title-color: var(--dark-heading);
10
- $description-color:var(--subtitle);
11
- $onboarding-step-gap:var(--u);
12
- $onboarding-step-min-max:250px;
13
-
14
- .#{bem.$base}.onboarding-step {
15
- display: grid;
16
- gap: $onboarding-step-gap;
17
- grid-template-columns: 1fr;
18
- height: auto;
19
- justify-content: center;
20
-
21
- @include mixins.media($from:$sm-md) {
22
- grid-template-columns: repeat(3, 1fr);
23
- }
24
-
25
- .content {
26
- align-items: center;
27
- display: flex;
28
- flex-direction: column;
29
- padding: var(--v);
30
-
31
- /*
32
- .img {
33
- height: $onboarding-step-img-height;
34
- object-fit: contain;
35
- } */
36
-
37
- .index {
38
- color: $index-color;
39
- }
40
-
41
- .title {
42
- color: $title-color;
43
- }
44
-
45
- .description {
46
- color: $description-color;
47
- }
48
- }
49
- }
50
-
51
-
@@ -1,108 +0,0 @@
1
- "use strict";
2
-
3
- Object.defineProperty(exports, "__esModule", {
4
- value: true
5
- });
6
- exports.default = void 0;
7
-
8
- var React = _interopRequireWildcard(require("react"));
9
-
10
- var _propTypes = _interopRequireDefault(require("prop-types"));
11
-
12
- var _bem = _interopRequireDefault(require("@pareto-engineering/bem"));
13
-
14
- var _b = require("../../b");
15
-
16
- function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
17
-
18
- function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
19
-
20
- function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
21
-
22
- // Local Definitions
23
- var baseClassName = _bem.default.base;
24
- var componentClassName = 'pricing';
25
- /**
26
- * This is the component description.
27
- */
28
-
29
- var SitePricing = _ref => {
30
- var {
31
- id,
32
- className: userClassName,
33
- style,
34
- color,
35
- pricingMap,
36
- ctaLink // ...otherProps
37
-
38
- } = _ref;
39
- (0, React.useLayoutEffect)(() => {
40
- Promise.resolve().then(() => _interopRequireWildcard(require("./styles.scss")));
41
- }, []);
42
- return /*#__PURE__*/React.createElement("div", {
43
- id: id,
44
- className: [baseClassName, componentClassName, userClassName, "y-".concat(color), 'u2'].filter(e => e).join(' '),
45
- style: style // {...otherProps}
46
-
47
- }, /*#__PURE__*/React.createElement("div", {
48
- className: "content s-1 md-s0"
49
- }, pricingMap.map((pricing, index) => /*#__PURE__*/React.createElement("div", {
50
- key: pricing.type,
51
- className: "info-content md-u2 u1 p-u"
52
- }, /*#__PURE__*/React.createElement("div", {
53
- className: "info md-v2 v1"
54
- }, /*#__PURE__*/React.createElement("span", {
55
- className: "plan-name uc s1 mb-v"
56
- }, pricing.type), /*#__PURE__*/React.createElement("span", {
57
- className: "plan-price uc s5 mb-v"
58
- }, pricing.price), /*#__PURE__*/React.createElement("ul", null, pricing.features.map(feature => /*#__PURE__*/React.createElement("li", {
59
- key: feature,
60
- className: "mb-v"
61
- }, feature)))), index === 0 && /*#__PURE__*/React.createElement("div", {
62
- className: "cta"
63
- }, /*#__PURE__*/React.createElement("a", {
64
- href: ctaLink,
65
- rel: "noreferrer"
66
- }, /*#__PURE__*/React.createElement(_b.Button, null, "Get started in 5 min")))))));
67
- };
68
-
69
- SitePricing.propTypes = {
70
- /**
71
- * The HTML id for this element
72
- */
73
- id: _propTypes.default.string,
74
-
75
- /**
76
- * The HTML class names for this element
77
- */
78
- className: _propTypes.default.string,
79
-
80
- /**
81
- * The title and background color
82
- */
83
- color: _propTypes.default.string,
84
-
85
- /**
86
- * The link of the call to action button
87
- */
88
- ctaLink: _propTypes.default.string,
89
-
90
- /**
91
- * The React-written, css properties for this element.
92
- */
93
- style: _propTypes.default.objectOf(_propTypes.default.string),
94
-
95
- /**
96
- * The pricingMap
97
- */
98
- pricingMap: _propTypes.default.arrayOf(_propTypes.default.shape({
99
- type: _propTypes.default.string.isRequired,
100
- price: _propTypes.default.string.isRequired,
101
- features: _propTypes.default.arrayOf(_propTypes.default.string).isRequired
102
- })).isRequired
103
- };
104
- SitePricing.defaultProps = {
105
- color: 'main1'
106
- };
107
- var _default = SitePricing;
108
- exports.default = _default;
@@ -1,15 +0,0 @@
1
- "use strict";
2
-
3
- Object.defineProperty(exports, "__esModule", {
4
- value: true
5
- });
6
- Object.defineProperty(exports, "SitePricing", {
7
- enumerable: true,
8
- get: function get() {
9
- return _SitePricing.default;
10
- }
11
- });
12
-
13
- var _SitePricing = _interopRequireDefault(require("./SitePricing"));
14
-
15
- function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
@@ -1,73 +0,0 @@
1
- /* @pareto-engineering/generator-front 1.0.12 */
2
-
3
- @use "@pareto-engineering/bem";
4
- @use "@aztlan/stylebook/src/mixins";
5
- @use "@aztlan/stylebook/src/globals" as *;
6
-
7
- $default-pricing-main-column-width: 220px;
8
- $desktop-pricing-main-column-width: 300px;
9
- $box-shadow:0 2px 2px 0 var(--background2);
10
-
11
- .#{bem.$base}.pricing {
12
- height: auto;
13
-
14
- .content {
15
- display: grid;
16
- gap: var(--u);
17
- grid-template-columns: repeat(auto-fit, minmax($default-pricing-main-column-width, 1fr));
18
- justify-content: center;
19
-
20
- @include mixins.media($from: $sm-md) {
21
- grid-template-columns: repeat(auto-fit, minmax($desktop-pricing-main-column-width, 1fr));
22
- }
23
- }
24
-
25
- .info-content {
26
- background-color: var(--on-main1);
27
- border-radius: var(--theme-border-radius);
28
- //box-shadow: $box-shadow;
29
- display: flex;
30
- flex-direction: column;
31
-
32
- button {
33
- margin: 0 auto;
34
- width: auto;
35
- }
36
- }
37
-
38
- .info {
39
- align-items: center;
40
- display: flex;
41
- flex-direction: column;
42
- justify-content: space-between;
43
-
44
- ul {
45
- display: flex;
46
- flex-direction: column;
47
- list-style: none;
48
- padding: 0;
49
- }
50
- }
51
-
52
- .cta {
53
- align-items: center;
54
- display: flex;
55
- flex-direction: column;
56
- justify-content: center;
57
- }
58
-
59
- .title {
60
- color: var(--on-y);
61
- }
62
-
63
- @include mixins.media($to:$sm-md) {
64
- .content {
65
- display: grid;
66
- gap: var(--u);
67
- grid-template-columns: none;
68
- justify-content: center;
69
- }
70
- }
71
- }
72
-
73
-
@@ -1,211 +0,0 @@
1
- "use strict";
2
-
3
- Object.defineProperty(exports, "__esModule", {
4
- value: true
5
- });
6
- exports.default = void 0;
7
-
8
- var React = _interopRequireWildcard(require("react"));
9
-
10
- var _propTypes = _interopRequireDefault(require("prop-types"));
11
-
12
- var _bem = _interopRequireDefault(require("@pareto-engineering/bem"));
13
-
14
- function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
15
-
16
- function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
17
-
18
- function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
19
-
20
- // Local Definitions
21
- var baseClassName = _bem.default.base;
22
- var componentClassName = 'services';
23
- /**
24
- * This is the component description.
25
- */
26
-
27
- var SiteServices = _ref => {
28
- var {
29
- id,
30
- className: userClassName,
31
- style,
32
- deletePath,
33
- servicesMap,
34
- attachmentPath,
35
- defaultService,
36
- defaultServiceTask,
37
- defaultTaskEmailContent // ...otherProps
38
-
39
- } = _ref;
40
- (0, React.useLayoutEffect)(() => {
41
- Promise.resolve().then(() => _interopRequireWildcard(require("./styles.scss")));
42
- }, []);
43
- var [service, setService] = (0, React.useState)(defaultService);
44
- var [serviceTask, setServiceTask] = (0, React.useState)(defaultServiceTask);
45
- var [serviceTaskIndx, setServiceTaskIndx] = (0, React.useState)(0);
46
- var [taskEmailContent, setTaskEmailContent] = (0, React.useState)(defaultTaskEmailContent);
47
-
48
- var handleServiceClick = serviceArg => setService(serviceArg);
49
-
50
- var handleTaskClick = taskArg => setServiceTask(taskArg);
51
-
52
- (0, React.useEffect)(() => {
53
- var serviceObjs = servicesMap[service];
54
- setServiceTask(serviceObjs[0].task);
55
- }, [service]);
56
- (0, React.useEffect)(() => {
57
- var serviceContent = servicesMap[service].find(serviceObj => serviceObj.task === serviceTask);
58
- setTaskEmailContent(serviceContent.email);
59
- }, [serviceTask]);
60
- return /*#__PURE__*/React.createElement("div", {
61
- id: id,
62
- className: [baseClassName, componentClassName, userClassName, 'u2 v1'].filter(e => e).join(' '),
63
- style: style
64
- }, /*#__PURE__*/React.createElement("div", {
65
- className: "btn-content v1 s-1 md-s0"
66
- }, Object.keys(servicesMap).map(serviceName => /*#__PURE__*/React.createElement("button", {
67
- className: "s1 ".concat(serviceName === service && 'active-service-btn'),
68
- key: serviceName,
69
- type: "button",
70
- onClick: () => {
71
- handleServiceClick(serviceName);
72
- setServiceTaskIndx(0);
73
- }
74
- }, serviceName))), /*#__PURE__*/React.createElement("div", {
75
- className: "tasks-and-content s-1 md-s0"
76
- }, /*#__PURE__*/React.createElement("div", {
77
- className: "tasks"
78
- }, servicesMap[service].map((serviceObj, index) => /*#__PURE__*/React.createElement("button", {
79
- key: serviceObj.task,
80
- className: "v1 mb-v ".concat(serviceTaskIndx === index ? 'b-dark-y c-on-y' : 'b-on-y'),
81
- type: "button",
82
- onClick: () => {
83
- handleTaskClick(serviceObj.task);
84
- setServiceTaskIndx(index);
85
- }
86
- }, /*#__PURE__*/React.createElement("span", {
87
- className: "v50 m-v"
88
- }, serviceObj.icon), /*#__PURE__*/React.createElement("p", {
89
- className: "ul"
90
- }, serviceObj.task)))), /*#__PURE__*/React.createElement("div", {
91
- className: "task-email b-on-y u2 p-u"
92
- }, /*#__PURE__*/React.createElement("div", {
93
- className: "task-email-header"
94
- }, /*#__PURE__*/React.createElement("span", null, "To"), /*#__PURE__*/React.createElement("span", {
95
- className: "ml-u"
96
- }, "camille@hellopareto.com")), /*#__PURE__*/React.createElement("span", {
97
- className: "v1 mv-v"
98
- }, taskEmailContent.subject), /*#__PURE__*/React.createElement("p", {
99
- className: "email-content v25 pb-v"
100
- }, "Hi Camille,", /*#__PURE__*/React.createElement("br", null), /*#__PURE__*/React.createElement("br", null), taskEmailContent.description, /*#__PURE__*/React.createElement("br", null), /*#__PURE__*/React.createElement("br", null), "Warmly,", /*#__PURE__*/React.createElement("br", null), "Phoebe"), /*#__PURE__*/React.createElement("div", {
101
- className: "u1 task-email-footer"
102
- }, /*#__PURE__*/React.createElement("div", {
103
- className: "task-footer-text"
104
- }, /*#__PURE__*/React.createElement("span", {
105
- className: "mr-u"
106
- }, "Send"), /*#__PURE__*/React.createElement("span", {
107
- className: "mr-u"
108
- }, "Send later"), /*#__PURE__*/React.createElement("span", {
109
- className: "mr-u"
110
- }, "Remind me")), /*#__PURE__*/React.createElement("div", {
111
- className: "task-footer-icons"
112
- }, /*#__PURE__*/React.createElement("img", {
113
- className: "ml-u",
114
- alt: "attach",
115
- src: attachmentPath
116
- }), /*#__PURE__*/React.createElement("img", {
117
- className: "ml-u",
118
- alt: "delete",
119
- src: deletePath
120
- }))))));
121
- };
122
-
123
- SiteServices.propTypes = {
124
- /**
125
- * The HTML id for this element .
126
- */
127
- id: _propTypes.default.string,
128
-
129
- /**
130
- * The HTML class names for this element
131
- */
132
- className: _propTypes.default.string,
133
-
134
- /**
135
- * The React-written, css properties for this element.
136
- */
137
- style: _propTypes.default.objectOf(_propTypes.default.string),
138
-
139
- /**
140
- * services map
141
- */
142
- servicesMap: _propTypes.default.shape({
143
- sales: _propTypes.default.arrayOf(_propTypes.default.shape({
144
- task: _propTypes.default.string.isRequired,
145
- icon: _propTypes.default.string.isRequired,
146
- email: _propTypes.default.shape({
147
- subject: _propTypes.default.string.isRequired,
148
- description: _propTypes.default.string.isRequired
149
- }).isRequired
150
- })).isRequired,
151
- product: _propTypes.default.arrayOf(_propTypes.default.shape({
152
- task: _propTypes.default.string.isRequired,
153
- icon: _propTypes.default.string.isRequired,
154
- email: _propTypes.default.shape({
155
- subject: _propTypes.default.string.isRequired,
156
- description: _propTypes.default.string.isRequired
157
- }).isRequired
158
- })).isRequired,
159
- hiring: _propTypes.default.arrayOf(_propTypes.default.shape({
160
- task: _propTypes.default.string.isRequired,
161
- icon: _propTypes.default.string.isRequired,
162
- email: _propTypes.default.shape({
163
- subject: _propTypes.default.string.isRequired,
164
- description: _propTypes.default.string.isRequired
165
- }).isRequired
166
- })).isRequired,
167
- admin: _propTypes.default.arrayOf(_propTypes.default.shape({
168
- task: _propTypes.default.string.isRequired,
169
- icon: _propTypes.default.string.isRequired,
170
- email: _propTypes.default.shape({
171
- subject: _propTypes.default.string.isRequired,
172
- description: _propTypes.default.string.isRequired
173
- }).isRequired
174
- })).isRequired
175
- }).isRequired,
176
-
177
- /**
178
- * default service
179
- */
180
- defaultService: _propTypes.default.string,
181
-
182
- /**
183
- * default service task
184
- */
185
- defaultServiceTask: _propTypes.default.string,
186
-
187
- /**
188
- * default service task
189
- */
190
- defaultTaskEmailContent: _propTypes.default.objectOf(_propTypes.default.string),
191
-
192
- /**
193
- * email attachment path
194
- */
195
- attachmentPath: _propTypes.default.string.isRequired,
196
-
197
- /**
198
- * delete attachment path
199
- */
200
- deletePath: _propTypes.default.string.isRequired
201
- };
202
- SiteServices.defaultProps = {
203
- defaultService: 'sales',
204
- defaultServiceTask: 'Generate sales leads',
205
- defaultTaskEmailContent: {
206
- subject: 'Fintech founder lead generation',
207
- description: 'I need a list of all fintech founders featured in Forbes, Business Insider, CB Insights, and AngelList newsletters. Please send me a spreadsheet containing their name, title, company website, and email address within the week.'
208
- }
209
- };
210
- var _default = SiteServices;
211
- exports.default = _default;
@@ -1,15 +0,0 @@
1
- "use strict";
2
-
3
- Object.defineProperty(exports, "__esModule", {
4
- value: true
5
- });
6
- Object.defineProperty(exports, "SiteServices", {
7
- enumerable: true,
8
- get: function get() {
9
- return _SiteServices.default;
10
- }
11
- });
12
-
13
- var _SiteServices = _interopRequireDefault(require("./SiteServices"));
14
-
15
- function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
@@ -1,138 +0,0 @@
1
- /* @pareto-engineering/generator-front 1.0.12 */
2
-
3
- @use "@pareto-engineering/bem";
4
- @use "@aztlan/stylebook/src/mixins";
5
- @use "@aztlan/stylebook/src/globals" as *;
6
-
7
- $service-btn-color:var(--on-y);
8
- $tasks-btn-width: 12em;
9
- $tasks-btn-height: 6em;
10
- $gap:2em;
11
- $active-btn-border-v:5px solid transparent;
12
- $active-btn-border-top:5px solid var(--on-y);
13
- $active-task-bg:var(--dark-y);
14
- $email-content-border-bottom:1px solid var(-metadata);
15
- $btn-content-width:75%;
16
- $tasks-and-content-sm-width:100%;
17
- $btn-content-sm-width:100%;
18
- $tasks-and-content-width:80%;
19
- $active-btn-left:48%;
20
- $active-btn-top:100%;
21
- $box-shadow:0 2px 2px 0 var(--background2);
22
-
23
-
24
- .#{bem.$base}.services {
25
- @mixin common-button-styles {
26
- border: 0;
27
- cursor: pointer;
28
- }
29
-
30
- .btn-content {
31
- column-gap: $gap;
32
- display: grid;
33
- grid-template-columns: repeat(4, 1fr);
34
- margin: var(--v) auto;
35
- width: $btn-content-width;
36
-
37
- button {
38
- @include common-button-styles;
39
- background: none;
40
- color: $service-btn-color;
41
- text-transform: capitalize;
42
- transition: all .1s;
43
-
44
- &:hover {
45
- transform: scale(1.1);
46
- }
47
- }
48
- }
49
-
50
-
51
- .active-service-btn {
52
- transform: scale(1.1);
53
-
54
- &::after {
55
- border-left: $active-btn-border-v;
56
- border-right: $active-btn-border-v;
57
- border-top: $active-btn-border-top;
58
- color: $service-btn-color;
59
- content: "";
60
- left: $active-btn-left;
61
- position: absolute;
62
- top: $active-btn-top;
63
- }
64
- }
65
-
66
-
67
- .tasks-and-content {
68
- column-gap: $gap;
69
- display: grid;
70
- grid-template-columns: 1fr 4fr;
71
- margin: 0 auto;
72
- width: $tasks-and-content-width;
73
- }
74
-
75
- .tasks {
76
- align-items: center;
77
- display: flex;
78
- flex-direction: column;
79
- justify-content: space-between;
80
-
81
- button {
82
- @include common-button-styles;
83
- align-items: center;
84
- border-radius: var(--theme-border-radius);
85
- display: flex;
86
- height: $tasks-btn-height;
87
- width: $tasks-btn-width;
88
- transition: background-color 0.5s ease-out;
89
- p {
90
- color: inherit;
91
- }
92
- }
93
- }
94
-
95
- .task-email {
96
- //box-shadow: $box-shadow;
97
- display: flex;
98
- flex-direction: column;
99
- justify-content: space-between;
100
-
101
- .email-content {
102
- border-bottom: $email-content-border-bottom;
103
- color: var(--black);
104
- }
105
-
106
- .task-email-footer {
107
- align-items: center;
108
- display: flex;
109
- justify-content: space-between;
110
- }
111
- }
112
-
113
- @include mixins.media($to:$sm-md) {
114
- padding: var(--v);
115
-
116
- .tasks-and-content {
117
- grid-template-columns: 1fr;
118
- margin: 0 auto;
119
- width: $tasks-and-content-sm-width;
120
- }
121
-
122
- .btn-content {
123
- column-gap: var(--v);
124
- width: $btn-content-sm-width;
125
- }
126
-
127
- .tasks {
128
- display: none;
129
- }
130
-
131
- .task-email-footer {
132
- display: flex;
133
- flex-direction: column;
134
- }
135
- }
136
- }
137
-
138
-