@pareto-engineering/design-system 2.0.0-alpha.60 → 2.0.0-alpha.61

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 (181) hide show
  1. package/dist/cjs/{experimental/GradientBackground/GradientBackground.js → a/ColumnLabel/ColumnLabel.js} +32 -30
  2. package/dist/cjs/{c/SiteMission → a/ColumnLabel}/index.js +3 -3
  3. package/dist/cjs/a/ColumnLabel/styles.scss +22 -0
  4. package/dist/cjs/{c/BlogPostsList/BlogPostsList.js → a/Label/Label.js} +27 -13
  5. package/dist/cjs/a/{Popover/common/Item → Label}/index.js +3 -3
  6. package/dist/cjs/a/Label/styles.scss +34 -0
  7. package/dist/cjs/a/index.js +9 -1
  8. package/dist/cjs/f/fields/ChoicesInput/ChoicesInput.js +1 -1
  9. package/dist/cjs/f/fields/ChoicesInput/common/Choice/Choice.js +2 -5
  10. package/dist/cjs/f/fields/TaskRecommendationInput/TaskRecommendationInput.js +1 -1
  11. package/dist/cjs/f/fields/TaskRecommendationInput/styles.scss +0 -4
  12. package/dist/es/a/ColumnLabel/ColumnLabel.js +78 -0
  13. package/dist/es/a/ColumnLabel/index.js +2 -0
  14. package/dist/es/a/ColumnLabel/styles.scss +22 -0
  15. package/dist/es/{c/BlogPostsList/BlogPostsList.js → a/Label/Label.js} +28 -13
  16. package/dist/es/{c/BlogPostsList/common/Card → a/Label}/index.js +1 -1
  17. package/dist/es/a/Label/styles.scss +34 -0
  18. package/dist/es/a/index.js +2 -1
  19. package/dist/es/f/fields/ChoicesInput/ChoicesInput.js +1 -1
  20. package/dist/es/f/fields/ChoicesInput/common/Choice/Choice.js +2 -5
  21. package/dist/es/f/fields/TaskRecommendationInput/TaskRecommendationInput.js +1 -1
  22. package/dist/es/f/fields/TaskRecommendationInput/styles.scss +0 -4
  23. package/package.json +1 -1
  24. package/src/__snapshots__/Storyshots.test.js.snap +8270 -7917
  25. package/src/stories/a/Label.stories.jsx +49 -0
  26. package/src/stories/f/ChoicesInput.stories.jsx +10 -36
  27. package/src/ui/a/Label/Label.jsx +93 -0
  28. package/{dist/es/a/Popover/common/Item → src/ui/a/Label}/index.js +1 -1
  29. package/src/ui/a/Label/styles.scss +34 -0
  30. package/src/ui/a/index.js +1 -0
  31. package/src/ui/f/fields/ChoicesInput/ChoicesInput.jsx +1 -1
  32. package/src/ui/f/fields/ChoicesInput/common/Choice/Choice.jsx +2 -10
  33. package/dist/cjs/a/GradientBackground/GradientBackground.js +0 -140
  34. package/dist/cjs/a/GradientBackground/index.js +0 -15
  35. package/dist/cjs/a/GradientBackground/styles.scss +0 -191
  36. package/dist/cjs/a/Popover/common/Divider/Divider.js +0 -67
  37. package/dist/cjs/a/Popover/common/Divider/index.js +0 -15
  38. package/dist/cjs/a/Popover/common/Item/Item.js +0 -67
  39. package/dist/cjs/a/Popover/common/index.js +0 -21
  40. package/dist/cjs/c/AcceptCookies/AcceptCookies.js +0 -134
  41. package/dist/cjs/c/AcceptCookies/index.js +0 -15
  42. package/dist/cjs/c/AcceptCookies/styles.scss +0 -49
  43. package/dist/cjs/c/BlogCategoryButton/BlogCategoryButton.js +0 -95
  44. package/dist/cjs/c/BlogCategoryButton/index.js +0 -15
  45. package/dist/cjs/c/BlogContext/BlogContextProvider.js +0 -63
  46. package/dist/cjs/c/BlogContext/Context.js +0 -16
  47. package/dist/cjs/c/BlogContext/ContextProvider.js +0 -63
  48. package/dist/cjs/c/BlogContext/index.js +0 -31
  49. package/dist/cjs/c/BlogContext/useBlog.js +0 -16
  50. package/dist/cjs/c/BlogPost/BlogPost.js +0 -147
  51. package/dist/cjs/c/BlogPost/index.js +0 -15
  52. package/dist/cjs/c/BlogPost/styles.scss +0 -33
  53. package/dist/cjs/c/BlogPostsList/common/Card/Card.js +0 -170
  54. package/dist/cjs/c/BlogPostsList/common/Card/index.js +0 -15
  55. package/dist/cjs/c/BlogPostsList/common/index.js +0 -13
  56. package/dist/cjs/c/BlogPostsList/index.js +0 -15
  57. package/dist/cjs/c/BlogPostsList/styles.scss +0 -72
  58. package/dist/cjs/c/SiteFooter/SiteFooter.js +0 -73
  59. package/dist/cjs/c/SiteFooter/common/Section/Section.js +0 -95
  60. package/dist/cjs/c/SiteFooter/common/Section/index.js +0 -15
  61. package/dist/cjs/c/SiteFooter/common/index.js +0 -13
  62. package/dist/cjs/c/SiteFooter/index.js +0 -15
  63. package/dist/cjs/c/SiteFooter/styles.scss +0 -34
  64. package/dist/cjs/c/SiteHeaderCTA/SiteHeaderCTA.js +0 -108
  65. package/dist/cjs/c/SiteHeaderCTA/index.js +0 -15
  66. package/dist/cjs/c/SiteHeaderCTA/styles.scss +0 -44
  67. package/dist/cjs/c/SiteMission/SiteMission.js +0 -113
  68. package/dist/cjs/c/SiteMission/styles.scss +0 -30
  69. package/dist/cjs/c/SiteNavigation/SiteNavigation.js +0 -130
  70. package/dist/cjs/c/SiteNavigation/index.js +0 -15
  71. package/dist/cjs/c/SiteNavigation/styles.scss +0 -118
  72. package/dist/cjs/c/SiteOnboardingStep/SiteOnboardingStep.js +0 -98
  73. package/dist/cjs/c/SiteOnboardingStep/index.js +0 -15
  74. package/dist/cjs/c/SiteOnboardingStep/styles.scss +0 -51
  75. package/dist/cjs/c/SitePricing/SitePricing.js +0 -108
  76. package/dist/cjs/c/SitePricing/index.js +0 -15
  77. package/dist/cjs/c/SitePricing/styles.scss +0 -73
  78. package/dist/cjs/c/SiteServices/SiteServices.js +0 -211
  79. package/dist/cjs/c/SiteServices/index.js +0 -15
  80. package/dist/cjs/c/SiteServices/styles.scss +0 -138
  81. package/dist/cjs/c/TeamGallery/TeamGallery.js +0 -80
  82. package/dist/cjs/c/TeamGallery/common/PersonCard/PersonCard.js +0 -84
  83. package/dist/cjs/c/TeamGallery/common/PersonCard/index.js +0 -15
  84. package/dist/cjs/c/TeamGallery/common/index.js +0 -13
  85. package/dist/cjs/c/TeamGallery/index.js +0 -15
  86. package/dist/cjs/c/TeamGallery/styles.scss +0 -100
  87. package/dist/cjs/c/Testimonials/Testimonials.js +0 -119
  88. package/dist/cjs/c/Testimonials/index.js +0 -15
  89. package/dist/cjs/c/Testimonials/styles.scss +0 -112
  90. package/dist/cjs/experimental/GradientBackground/index.js +0 -15
  91. package/dist/cjs/experimental/GradientBackground/styles.scss +0 -64
  92. package/dist/cjs/experimental/index.js +0 -13
  93. package/dist/cjs/f/fields/IntlTelInput/IntlTelInput.js +0 -170
  94. package/dist/cjs/f/fields/IntlTelInput/index.js +0 -15
  95. package/dist/cjs/f/fields/IntlTelInput/styles.scss +0 -37
  96. package/dist/cjs/f/fields/PhoneIntlTelInput/PhoneIntlTelInput.js +0 -180
  97. package/dist/cjs/f/fields/PhoneIntlTelInput/index.js +0 -15
  98. package/dist/cjs/f/fields/PhoneIntlTelInput/styles.scss +0 -43
  99. package/dist/cjs/f/fields/QuerySelect/styles.scss +0 -21
  100. package/dist/cjs/f/fields/TaskRecommendation/TaskRecommendation.js +0 -129
  101. package/dist/cjs/f/fields/TaskRecommendation/index.js +0 -15
  102. package/dist/cjs/f/fields/TaskRecommendation/styles.scss +0 -37
  103. package/dist/cjs/f/fields/TextArea/TextArea.js +0 -141
  104. package/dist/cjs/f/fields/TextArea/index.js +0 -15
  105. package/dist/cjs/f/fields/TextArea/styles.scss +0 -19
  106. package/dist/cjs/test/QueryLoader/styles.scss +0 -9
  107. package/dist/es/a/GradientBackground/GradientBackground.js +0 -118
  108. package/dist/es/a/GradientBackground/index.js +0 -2
  109. package/dist/es/a/GradientBackground/styles.scss +0 -191
  110. package/dist/es/a/Popover/common/Divider/Divider.js +0 -47
  111. package/dist/es/a/Popover/common/Divider/index.js +0 -2
  112. package/dist/es/a/Popover/common/Item/Item.js +0 -47
  113. package/dist/es/a/Popover/common/index.js +0 -2
  114. package/dist/es/c/AcceptCookies/AcceptCookies.js +0 -117
  115. package/dist/es/c/AcceptCookies/index.js +0 -2
  116. package/dist/es/c/AcceptCookies/styles.scss +0 -49
  117. package/dist/es/c/BlogCategoryButton/BlogCategoryButton.js +0 -68
  118. package/dist/es/c/BlogCategoryButton/index.js +0 -2
  119. package/dist/es/c/BlogContext/BlogContextProvider.js +0 -45
  120. package/dist/es/c/BlogContext/Context.js +0 -2
  121. package/dist/es/c/BlogContext/ContextProvider.js +0 -45
  122. package/dist/es/c/BlogContext/index.js +0 -4
  123. package/dist/es/c/BlogContext/useBlog.js +0 -3
  124. package/dist/es/c/BlogPost/BlogPost.js +0 -128
  125. package/dist/es/c/BlogPost/index.js +0 -2
  126. package/dist/es/c/BlogPost/styles.scss +0 -33
  127. package/dist/es/c/BlogPostsList/common/Card/Card.js +0 -143
  128. package/dist/es/c/BlogPostsList/common/index.js +0 -1
  129. package/dist/es/c/BlogPostsList/index.js +0 -2
  130. package/dist/es/c/BlogPostsList/styles.scss +0 -72
  131. package/dist/es/c/SiteFooter/SiteFooter.js +0 -56
  132. package/dist/es/c/SiteFooter/common/Section/Section.js +0 -73
  133. package/dist/es/c/SiteFooter/common/Section/index.js +0 -2
  134. package/dist/es/c/SiteFooter/common/index.js +0 -1
  135. package/dist/es/c/SiteFooter/index.js +0 -2
  136. package/dist/es/c/SiteFooter/styles.scss +0 -34
  137. package/dist/es/c/SiteHeaderCTA/SiteHeaderCTA.js +0 -92
  138. package/dist/es/c/SiteHeaderCTA/index.js +0 -2
  139. package/dist/es/c/SiteHeaderCTA/styles.scss +0 -44
  140. package/dist/es/c/SiteMission/SiteMission.js +0 -96
  141. package/dist/es/c/SiteMission/index.js +0 -2
  142. package/dist/es/c/SiteMission/styles.scss +0 -30
  143. package/dist/es/c/SiteNavigation/SiteNavigation.js +0 -111
  144. package/dist/es/c/SiteNavigation/index.js +0 -2
  145. package/dist/es/c/SiteNavigation/styles.scss +0 -118
  146. package/dist/es/c/SiteOnboardingStep/SiteOnboardingStep.js +0 -81
  147. package/dist/es/c/SiteOnboardingStep/index.js +0 -2
  148. package/dist/es/c/SiteOnboardingStep/styles.scss +0 -51
  149. package/dist/es/c/SitePricing/SitePricing.js +0 -91
  150. package/dist/es/c/SitePricing/index.js +0 -2
  151. package/dist/es/c/SitePricing/styles.scss +0 -73
  152. package/dist/es/c/SiteServices/SiteServices.js +0 -195
  153. package/dist/es/c/SiteServices/index.js +0 -2
  154. package/dist/es/c/SiteServices/styles.scss +0 -138
  155. package/dist/es/c/TeamGallery/TeamGallery.js +0 -64
  156. package/dist/es/c/TeamGallery/common/PersonCard/PersonCard.js +0 -64
  157. package/dist/es/c/TeamGallery/common/PersonCard/index.js +0 -2
  158. package/dist/es/c/TeamGallery/common/index.js +0 -1
  159. package/dist/es/c/TeamGallery/index.js +0 -2
  160. package/dist/es/c/TeamGallery/styles.scss +0 -100
  161. package/dist/es/c/Testimonials/Testimonials.js +0 -99
  162. package/dist/es/c/Testimonials/index.js +0 -2
  163. package/dist/es/c/Testimonials/styles.scss +0 -112
  164. package/dist/es/experimental/GradientBackground/GradientBackground.js +0 -76
  165. package/dist/es/experimental/GradientBackground/index.js +0 -2
  166. package/dist/es/experimental/GradientBackground/styles.scss +0 -64
  167. package/dist/es/experimental/index.js +0 -1
  168. package/dist/es/f/fields/IntlTelInput/IntlTelInput.js +0 -152
  169. package/dist/es/f/fields/IntlTelInput/index.js +0 -2
  170. package/dist/es/f/fields/IntlTelInput/styles.scss +0 -37
  171. package/dist/es/f/fields/PhoneIntlTelInput/PhoneIntlTelInput.js +0 -163
  172. package/dist/es/f/fields/PhoneIntlTelInput/index.js +0 -2
  173. package/dist/es/f/fields/PhoneIntlTelInput/styles.scss +0 -43
  174. package/dist/es/f/fields/QuerySelect/styles.scss +0 -21
  175. package/dist/es/f/fields/TaskRecommendation/TaskRecommendation.js +0 -111
  176. package/dist/es/f/fields/TaskRecommendation/index.js +0 -2
  177. package/dist/es/f/fields/TaskRecommendation/styles.scss +0 -37
  178. package/dist/es/f/fields/TextArea/TextArea.js +0 -124
  179. package/dist/es/f/fields/TextArea/index.js +0 -2
  180. package/dist/es/f/fields/TextArea/styles.scss +0 -19
  181. package/dist/es/test/QueryLoader/styles.scss +0 -9
@@ -1,111 +0,0 @@
1
- function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
2
-
3
- /* @pareto-engineering/generator-front 1.0.12 */
4
- import * as React from 'react';
5
- import { useLayoutEffect } from 'react';
6
- import PropTypes from 'prop-types';
7
- import { useField } from 'formik';
8
- import styleNames from '@pareto-engineering/bem';
9
- import { FormLabel } from "../../common"; // Local Definitions
10
-
11
- const baseClassName = styleNames.base;
12
- const componentClassName = 'task-recommendation';
13
- /**
14
- * This is the component description.
15
- */
16
-
17
- const TaskRecommendation = ({
18
- id,
19
- className: userClassName,
20
- style,
21
- name,
22
- value,
23
- oneLiner,
24
- label,
25
- color,
26
- image // ...otherProps
27
-
28
- }) => {
29
- var _field$value;
30
-
31
- useLayoutEffect(() => {
32
- import("./styles.scss");
33
- }, []);
34
- const [field] = useField(name);
35
- const isOptionSelected = !!(((_field$value = field.value) === null || _field$value === void 0 ? void 0 : _field$value.length) > 0 && field.value.includes(value));
36
- return /*#__PURE__*/React.createElement("div", {
37
- id: id,
38
- className: [baseClassName, componentClassName, userClassName, `x-${color}`].filter(e => e).join(' '),
39
- style: style // {...otherProps}
40
-
41
- }, /*#__PURE__*/React.createElement("div", {
42
- className: `task-content ${isOptionSelected ? 'b-x' : 'b-on-x'}`
43
- }, /*#__PURE__*/React.createElement("div", {
44
- className: "v1 p-v task"
45
- }, /*#__PURE__*/React.createElement(FormLabel, {
46
- className: `uc mb-v ${isOptionSelected ? 'c-on-x' : 'c-x'}`,
47
- name: name
48
- }, label), /*#__PURE__*/React.createElement("input", _extends({}, field, {
49
- value: value,
50
- id: name,
51
- className: "input",
52
- type: "checkbox"
53
- })), /*#__PURE__*/React.createElement("img", {
54
- className: "image",
55
- src: image,
56
- alt: "img"
57
- }), /*#__PURE__*/React.createElement("p", {
58
- className: ['uc u2 mt-u', isOptionSelected && 'c-on-x'].filter(e => e).join(' ')
59
- }, oneLiner))));
60
- };
61
-
62
- TaskRecommendation.propTypes = {
63
- /**
64
- * The HTML id for this element
65
- */
66
- id: PropTypes.string,
67
-
68
- /**
69
- * The HTML class names for this element
70
- */
71
- className: PropTypes.string,
72
-
73
- /**
74
- * The React-written, css properties for this element.
75
- */
76
- style: PropTypes.objectOf(PropTypes.string),
77
-
78
- /**
79
- * The name of the input
80
- */
81
- name: PropTypes.string.isRequired,
82
-
83
- /**
84
- * The value of the input
85
- */
86
- value: PropTypes.string.isRequired,
87
-
88
- /**
89
- * The task one liner description
90
- */
91
- oneLiner: PropTypes.string.isRequired,
92
-
93
- /**
94
- * The task label
95
- */
96
- label: PropTypes.string.isRequired,
97
-
98
- /**
99
- * The color
100
- */
101
- color: PropTypes.string,
102
-
103
- /**
104
- * Task image
105
- */
106
- image: PropTypes.string.isRequired
107
- };
108
- TaskRecommendation.defaultProps = {
109
- color: 'main2'
110
- };
111
- export default TaskRecommendation;
@@ -1,2 +0,0 @@
1
- /* @pareto-engineering/generator-front 1.0.12 */
2
- export { default as TaskRecommendation } from "./TaskRecommendation";
@@ -1,37 +0,0 @@
1
- /* @pareto-engineering/generator-front 1.0.12 */
2
- @use "@pareto-engineering/bem";
3
-
4
- .#{bem.$base}.task-recommendation {
5
-
6
- .task-content {
7
- border-radius: var(--theme-border-radius);
8
- border: 1px solid var(--x);
9
- height: 100%;
10
-
11
- .task {
12
- position: relative;
13
- display: flex;
14
- flex-direction: column;
15
- justify-content: space-around;
16
- align-items: center;
17
- height: 100%;
18
-
19
- .input {
20
- appearance: none;
21
- position: absolute;
22
- left: 0;
23
- top: 0;
24
- bottom:0;
25
- cursor: pointer;
26
- width: 100%;
27
- }
28
-
29
- .image {
30
- width: 7rem;
31
- }
32
- }
33
- }
34
- }
35
-
36
-
37
-
@@ -1,124 +0,0 @@
1
- function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
2
-
3
- /* @pareto-engineering/generator-front 1.0.12 */
4
- import * as React from 'react';
5
- import { useLayoutEffect } from 'react';
6
- import PropTypes from 'prop-types';
7
- import styleNames from '@pareto-engineering/bem';
8
- import { useField } from 'formik'; // Local Definitions
9
-
10
- import { FormLabel, FormDescription } from "../../common";
11
- const baseClassName = styleNames.base;
12
- const componentClassName = 'text-area';
13
- /**
14
- * This is the component description.
15
- */
16
-
17
- const TextArea = ({
18
- id,
19
- className: userClassName,
20
- style,
21
- name,
22
- label,
23
- validate,
24
- labelAsDescription,
25
- textAreaId,
26
- rows,
27
- textAreaColor,
28
- labelColor,
29
- description // ...otherProps
30
-
31
- }) => {
32
- useLayoutEffect(() => {
33
- import("./styles.scss");
34
- }, []);
35
- const [field, meta] = useField({
36
- name,
37
- validate
38
- });
39
- return /*#__PURE__*/React.createElement("div", {
40
- id: id,
41
- className: [baseClassName, componentClassName, userClassName, `x-${textAreaColor}`, `y-${labelColor}`].filter(e => e).join(' '),
42
- style: style // {...otherProps}
43
-
44
- }, /*#__PURE__*/React.createElement(FormLabel, {
45
- className: ['c-y', labelAsDescription ? 'md-s2 s0 v1 mb-v' : 'v50 mb-v'].filter(e => e).join(' '),
46
- name: name
47
- }, label), /*#__PURE__*/React.createElement("textarea", _extends({
48
- id: textAreaId,
49
- className: `textarea v50 pv-v ${meta.touched && meta.error ? 'input-border-error' : 'input-border'}`
50
- }, field, {
51
- rows: rows
52
- })), (description || meta.touched && meta.error) && /*#__PURE__*/React.createElement(FormDescription, {
53
- isError: !!meta.error,
54
- className: "v50 mt-v s-1"
55
- }, meta.error || description), ' ');
56
- };
57
-
58
- TextArea.propTypes = {
59
- /**
60
- * The HTML id for this element
61
- */
62
- id: PropTypes.string,
63
-
64
- /**
65
- * The HTML class names for this element
66
- */
67
- className: PropTypes.string,
68
-
69
- /**
70
- * The React-written, css properties for this element.
71
- */
72
- style: PropTypes.objectOf(PropTypes.string),
73
-
74
- /**
75
- * The input name (html - and Formik state)
76
- */
77
- name: PropTypes.string.isRequired,
78
-
79
- /**
80
- * The input label
81
- */
82
- label: PropTypes.string.isRequired,
83
-
84
- /**
85
- * The input value validator function
86
- */
87
- validate: PropTypes.func,
88
-
89
- /**
90
- * If the text area depends on it's label's text as the default description
91
- */
92
- labelAsDescription: PropTypes.bool,
93
-
94
- /**
95
- * The textarea id
96
- */
97
- textAreaId: PropTypes.string,
98
-
99
- /**
100
- * The number of rows int the text area
101
- */
102
- rows: PropTypes.number,
103
-
104
- /**
105
- * Text area base color
106
- */
107
- textAreaColor: PropTypes.string,
108
-
109
- /**
110
- * Label base color
111
- */
112
- labelColor: PropTypes.string,
113
-
114
- /**
115
- * Text area description
116
- */
117
- description: PropTypes.string
118
- };
119
- TextArea.defaultProps = {
120
- rows: 3,
121
- textAreaColor: 'background',
122
- labelColor: 'main1'
123
- };
124
- export default TextArea;
@@ -1,2 +0,0 @@
1
- /* @pareto-engineering/generator-front 1.0.12 */
2
- export { default as TextArea } from "./TextArea";
@@ -1,19 +0,0 @@
1
- /* @pareto-engineering/generator-front 1.0.12 */
2
- @use "@pareto-engineering/bem";
3
-
4
- .#{bem.$base}.text-area{
5
- display: flex;
6
- flex-direction: column;
7
-
8
- .textarea {
9
- background: var(--light-x);
10
- color: var(--on-x);
11
-
12
- &:focus {
13
- background: var(--dark-x);
14
- }
15
- }
16
- }
17
-
18
-
19
-
@@ -1,9 +0,0 @@
1
- /* @pareto-engineering/generator-front 1.0.12 */
2
- @use "@pareto-engineering/bem";
3
-
4
- .#{bem.$base}.query-loader{
5
-
6
- }
7
-
8
-
9
-