@pareto-engineering/design-system 2.0.0-alpha.24 → 2.0.0-alpha.28
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.
- package/dist/cjs/a/SVG/SVG.js +9 -3
- package/dist/cjs/b/Logo/Logo.js +10 -36
- package/dist/cjs/b/Logo/styles.scss +0 -138
- package/dist/cjs/f/fields/SelectInput/SelectInput.js +1 -2
- package/dist/es/a/SVG/SVG.js +1 -1
- package/dist/es/b/Logo/Logo.js +10 -36
- package/dist/es/b/Logo/styles.scss +0 -138
- package/dist/es/f/fields/SelectInput/SelectInput.js +1 -2
- package/package.json +2 -2
- package/src/__snapshots__/Storyshots.test.js.snap +203 -697
- package/src/stories/b/Logo.stories.jsx +9 -9
- package/src/ui/a/SVG/SVG.jsx +1 -1
- package/src/ui/b/Logo/Logo.jsx +9 -40
- package/src/ui/b/Logo/styles.scss +0 -138
- package/src/ui/f/fields/SelectInput/SelectInput.jsx +0 -1
package/dist/cjs/a/SVG/SVG.js
CHANGED
|
@@ -19,6 +19,12 @@ function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { de
|
|
|
19
19
|
|
|
20
20
|
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); }
|
|
21
21
|
|
|
22
|
+
function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) { symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); } keys.push.apply(keys, symbols); } return keys; }
|
|
23
|
+
|
|
24
|
+
function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { _defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
|
|
25
|
+
|
|
26
|
+
function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
|
|
27
|
+
|
|
22
28
|
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); }
|
|
23
29
|
|
|
24
30
|
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; }
|
|
@@ -53,10 +59,10 @@ var SVG = _ref => {
|
|
|
53
59
|
(0, React.useLayoutEffect)(() => {
|
|
54
60
|
Promise.resolve().then(() => _interopRequireWildcard(require("./styles.scss")));
|
|
55
61
|
});
|
|
56
|
-
var useSVGProps = (0, React.useMemo)(() => ({
|
|
62
|
+
var useSVGProps = (0, React.useMemo)(() => _objectSpread(_objectSpread({
|
|
57
63
|
className: useClassName,
|
|
58
|
-
source
|
|
59
|
-
|
|
64
|
+
source
|
|
65
|
+
}, target), {}, {
|
|
60
66
|
sprite,
|
|
61
67
|
strokeWidth
|
|
62
68
|
}), [useClassName, source, target, strokeWidth, sprite]);
|
package/dist/cjs/b/Logo/Logo.js
CHANGED
|
@@ -23,28 +23,17 @@ function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj &&
|
|
|
23
23
|
var baseClassName = _bem.default.base;
|
|
24
24
|
var componentClassName = 'logo';
|
|
25
25
|
var defaultTargets = [{
|
|
26
|
-
id: '
|
|
27
|
-
target: '
|
|
26
|
+
id: 'logo_squares',
|
|
27
|
+
target: 'logo_squares'
|
|
28
28
|
}, {
|
|
29
|
-
id: '
|
|
30
|
-
target: '
|
|
31
|
-
}, {
|
|
32
|
-
id: 'logo__t',
|
|
33
|
-
target: 'logo__t'
|
|
29
|
+
id: 'logo_pareto',
|
|
30
|
+
target: 'logo_pareto'
|
|
34
31
|
}];
|
|
35
32
|
var contentMap = {
|
|
36
33
|
default: {
|
|
37
|
-
sprite: '/
|
|
38
|
-
viewBox: '0 0
|
|
34
|
+
sprite: '/logo.svg',
|
|
35
|
+
viewBox: '0 0 156 30',
|
|
39
36
|
targets: defaultTargets
|
|
40
|
-
},
|
|
41
|
-
beta: {
|
|
42
|
-
sprite: '/logo_parts_beta.svg',
|
|
43
|
-
viewBox: '0 0 1000 300',
|
|
44
|
-
targets: [...defaultTargets, {
|
|
45
|
-
id: 'logo__beta',
|
|
46
|
-
target: 'logo__beta'
|
|
47
|
-
}]
|
|
48
37
|
}
|
|
49
38
|
};
|
|
50
39
|
/**
|
|
@@ -57,8 +46,6 @@ var Logo = _ref => {
|
|
|
57
46
|
className: userClassName,
|
|
58
47
|
style,
|
|
59
48
|
color,
|
|
60
|
-
animated,
|
|
61
|
-
loop,
|
|
62
49
|
height,
|
|
63
50
|
width,
|
|
64
51
|
variant // ...otherProps
|
|
@@ -75,9 +62,8 @@ var Logo = _ref => {
|
|
|
75
62
|
targets: svgConfig.targets,
|
|
76
63
|
sprite: svgConfig.sprite,
|
|
77
64
|
id: id,
|
|
78
|
-
className: [baseClassName, componentClassName, "x-".concat(color), userClassName
|
|
79
|
-
style: style
|
|
80
|
-
animated: animated // {...otherProps}
|
|
65
|
+
className: [baseClassName, componentClassName, "x-".concat(color), userClassName].filter(e => e).join(' '),
|
|
66
|
+
style: style // {...otherProps}
|
|
81
67
|
|
|
82
68
|
});
|
|
83
69
|
};
|
|
@@ -103,16 +89,6 @@ Logo.propTypes = {
|
|
|
103
89
|
*/
|
|
104
90
|
color: _propTypes.default.string,
|
|
105
91
|
|
|
106
|
-
/**
|
|
107
|
-
* Whether the logo is animated
|
|
108
|
-
*/
|
|
109
|
-
animated: _propTypes.default.bool,
|
|
110
|
-
|
|
111
|
-
/**
|
|
112
|
-
* Whether the animation loops
|
|
113
|
-
*/
|
|
114
|
-
loop: _propTypes.default.bool,
|
|
115
|
-
|
|
116
92
|
/**
|
|
117
93
|
* The height of the element
|
|
118
94
|
*/
|
|
@@ -129,10 +105,8 @@ Logo.propTypes = {
|
|
|
129
105
|
variant: _propTypes.default.string
|
|
130
106
|
};
|
|
131
107
|
Logo.defaultProps = {
|
|
132
|
-
color: '
|
|
133
|
-
|
|
134
|
-
loop: false,
|
|
135
|
-
height: '4em',
|
|
108
|
+
color: 'paragraph',
|
|
109
|
+
height: '2em',
|
|
136
110
|
variant: 'default'
|
|
137
111
|
};
|
|
138
112
|
var _default = Logo;
|
|
@@ -1,147 +1,9 @@
|
|
|
1
1
|
/* @pareto-engineering/generator-front 1.0.12 */
|
|
2
2
|
|
|
3
|
-
/* stylelint-disable selector-id-pattern, selector-max-id -- because of the custom svg */
|
|
4
|
-
|
|
5
3
|
@use "@pareto-engineering/bem";
|
|
6
4
|
|
|
7
|
-
// Main animation - finishes after the drawing
|
|
8
|
-
|
|
9
|
-
@keyframes draw-logo-p {
|
|
10
|
-
0% {
|
|
11
|
-
stroke-dashoffset: var(--svg-origin-stroke-dashoffset, 1000);
|
|
12
|
-
}
|
|
13
|
-
|
|
14
|
-
20%,
|
|
15
|
-
100% {
|
|
16
|
-
stroke-dashoffset: var(--svg-target-stroke-dashoffset, 0);
|
|
17
|
-
}
|
|
18
|
-
}
|
|
19
|
-
@keyframes draw-logo-areto {
|
|
20
|
-
0%,
|
|
21
|
-
20% {
|
|
22
|
-
stroke-dashoffset: var(--svg-origin-stroke-dashoffset, 1000);
|
|
23
|
-
}
|
|
24
|
-
|
|
25
|
-
90%,
|
|
26
|
-
100% {
|
|
27
|
-
stroke-dashoffset: var(--svg-target-stroke-dashoffset, 0);
|
|
28
|
-
}
|
|
29
|
-
}
|
|
30
|
-
@keyframes draw-logo-t {
|
|
31
|
-
0%,
|
|
32
|
-
90% {
|
|
33
|
-
stroke-dashoffset: var(--svg-origin-stroke-dashoffset, 1000);
|
|
34
|
-
}
|
|
35
|
-
|
|
36
|
-
100% {
|
|
37
|
-
stroke-dashoffset: var(--svg-target-stroke-dashoffset, 0);
|
|
38
|
-
}
|
|
39
|
-
}
|
|
40
|
-
|
|
41
|
-
// Alt animation - looping
|
|
42
|
-
|
|
43
|
-
@keyframes draw-alt-logo-p {
|
|
44
|
-
0% {
|
|
45
|
-
stroke-dashoffset: var(--svg-origin-stroke-dashoffset, 1000);
|
|
46
|
-
}
|
|
47
|
-
|
|
48
|
-
10%,
|
|
49
|
-
50% {
|
|
50
|
-
stroke-dashoffset: var(--svg-target-stroke-dashoffset, 0);
|
|
51
|
-
}
|
|
52
|
-
|
|
53
|
-
60%,
|
|
54
|
-
100% {
|
|
55
|
-
stroke-dashoffset: var(--svg-final-stroke-dashoffset, 1000);
|
|
56
|
-
}
|
|
57
|
-
}
|
|
58
|
-
@keyframes draw-alt-logo-areto {
|
|
59
|
-
0%,
|
|
60
|
-
10% {
|
|
61
|
-
stroke-dashoffset: var(--svg-origin-stroke-dashoffset, 1000);
|
|
62
|
-
}
|
|
63
|
-
|
|
64
|
-
45%,
|
|
65
|
-
60% {
|
|
66
|
-
stroke-dashoffset: var(--svg-target-stroke-dashoffset, 0);
|
|
67
|
-
}
|
|
68
|
-
|
|
69
|
-
95%,
|
|
70
|
-
100% {
|
|
71
|
-
stroke-dashoffset: var(--svg-final-stroke-dashoffset, 1000);
|
|
72
|
-
}
|
|
73
|
-
}
|
|
74
|
-
@keyframes draw-alt-logo-t {
|
|
75
|
-
0%,
|
|
76
|
-
45% {
|
|
77
|
-
stroke-dashoffset: var(--svg-origin-stroke-dashoffset, 1000);
|
|
78
|
-
}
|
|
79
|
-
|
|
80
|
-
50%,
|
|
81
|
-
95% {
|
|
82
|
-
stroke-dashoffset: var(--svg-target-stroke-dashoffset, 0);
|
|
83
|
-
}
|
|
84
|
-
|
|
85
|
-
100% {
|
|
86
|
-
stroke-dashoffset: var(--svg-final-stroke-dashoffset, 1000);
|
|
87
|
-
}
|
|
88
|
-
}
|
|
89
|
-
|
|
90
5
|
.#{bem.$base}.logo {
|
|
91
|
-
&.animated.animated {
|
|
92
|
-
--svg-animation-repeats: 1;
|
|
93
|
-
--svg-animation-time: 3.5s;
|
|
94
|
-
|
|
95
|
-
&:hover,
|
|
96
|
-
&:focus {
|
|
97
|
-
//--path-animation: dash-a 1s linear 0s 1 forwards;
|
|
98
|
-
}
|
|
99
|
-
|
|
100
|
-
use#logo__p {
|
|
101
|
-
//--svg-animation-delay: 0;
|
|
102
|
-
--svg-dasharray: 1000;
|
|
103
|
-
--svg-origin-stroke-dashoffset: -1000;
|
|
104
|
-
//--svg-target-stroke-dashoffset: 0;
|
|
105
|
-
--svg-final-stroke-dashoffset: 1000;
|
|
106
|
-
animation-name: draw-logo-p;
|
|
107
|
-
}
|
|
108
|
-
|
|
109
|
-
use#logo__areto {
|
|
110
|
-
--svg-dasharray: 2000;
|
|
111
|
-
--svg-origin-stroke-dashoffset: 2000;
|
|
112
|
-
//--svg-target-stroke-dashoffset: 0;
|
|
113
|
-
--svg-final-stroke-dashoffset: -2000;
|
|
114
|
-
animation-name: draw-logo-areto;
|
|
115
|
-
}
|
|
116
|
-
|
|
117
|
-
use#logo__t {
|
|
118
|
-
--svg-dasharray: 200;
|
|
119
|
-
--svg-origin-stroke-dashoffset: 200;
|
|
120
|
-
//--svg-target-stroke-dashoffset: 0;
|
|
121
|
-
--svg-final-stroke-dashoffset: -200;
|
|
122
|
-
animation-name: draw-logo-t;
|
|
123
|
-
}
|
|
124
|
-
|
|
125
|
-
&.loop.loop {
|
|
126
|
-
--svg-animation-time: 6s;
|
|
127
|
-
--svg-animation-repeats: infinite;
|
|
128
|
-
|
|
129
|
-
use#logo__p {
|
|
130
|
-
--svg-final-stroke-dashoffset: 1000;
|
|
131
|
-
animation-name: draw-alt-logo-p;
|
|
132
|
-
}
|
|
133
|
-
|
|
134
|
-
use#logo__areto {
|
|
135
|
-
--svg-final-stroke-dashoffset: -2000;
|
|
136
|
-
animation-name: draw-alt-logo-areto;
|
|
137
|
-
}
|
|
138
6
|
|
|
139
|
-
use#logo__t {
|
|
140
|
-
--svg-final-stroke-dashoffset: -200;
|
|
141
|
-
animation-name: draw-alt-logo-t;
|
|
142
|
-
}
|
|
143
|
-
}
|
|
144
|
-
}
|
|
145
7
|
}
|
|
146
8
|
|
|
147
9
|
|
|
@@ -74,8 +74,7 @@ var SelectInput = _ref => {
|
|
|
74
74
|
return /*#__PURE__*/React.createElement("option", {
|
|
75
75
|
key: newOption.value,
|
|
76
76
|
value: newOption.value,
|
|
77
|
-
disabled: (newOption === null || newOption === void 0 ? void 0 : newOption.disabled) || false
|
|
78
|
-
selected: (newOption === null || newOption === void 0 ? void 0 : newOption.disabled) || true
|
|
77
|
+
disabled: (newOption === null || newOption === void 0 ? void 0 : newOption.disabled) || false
|
|
79
78
|
}, newOption.label);
|
|
80
79
|
})), (description || meta.touched && meta.error) && /*#__PURE__*/React.createElement(_common.FormDescription, {
|
|
81
80
|
isError: !!meta.error,
|
package/dist/es/a/SVG/SVG.js
CHANGED
package/dist/es/b/Logo/Logo.js
CHANGED
|
@@ -8,28 +8,17 @@ import { SVG } from "../../a"; // Local Definitions
|
|
|
8
8
|
const baseClassName = styleNames.base;
|
|
9
9
|
const componentClassName = 'logo';
|
|
10
10
|
const defaultTargets = [{
|
|
11
|
-
id: '
|
|
12
|
-
target: '
|
|
11
|
+
id: 'logo_squares',
|
|
12
|
+
target: 'logo_squares'
|
|
13
13
|
}, {
|
|
14
|
-
id: '
|
|
15
|
-
target: '
|
|
16
|
-
}, {
|
|
17
|
-
id: 'logo__t',
|
|
18
|
-
target: 'logo__t'
|
|
14
|
+
id: 'logo_pareto',
|
|
15
|
+
target: 'logo_pareto'
|
|
19
16
|
}];
|
|
20
17
|
const contentMap = {
|
|
21
18
|
default: {
|
|
22
|
-
sprite: '/
|
|
23
|
-
viewBox: '0 0
|
|
19
|
+
sprite: '/logo.svg',
|
|
20
|
+
viewBox: '0 0 156 30',
|
|
24
21
|
targets: defaultTargets
|
|
25
|
-
},
|
|
26
|
-
beta: {
|
|
27
|
-
sprite: '/logo_parts_beta.svg',
|
|
28
|
-
viewBox: '0 0 1000 300',
|
|
29
|
-
targets: [...defaultTargets, {
|
|
30
|
-
id: 'logo__beta',
|
|
31
|
-
target: 'logo__beta'
|
|
32
|
-
}]
|
|
33
22
|
}
|
|
34
23
|
};
|
|
35
24
|
/**
|
|
@@ -41,8 +30,6 @@ const Logo = ({
|
|
|
41
30
|
className: userClassName,
|
|
42
31
|
style,
|
|
43
32
|
color,
|
|
44
|
-
animated,
|
|
45
|
-
loop,
|
|
46
33
|
height,
|
|
47
34
|
width,
|
|
48
35
|
variant // ...otherProps
|
|
@@ -59,9 +46,8 @@ const Logo = ({
|
|
|
59
46
|
targets: svgConfig.targets,
|
|
60
47
|
sprite: svgConfig.sprite,
|
|
61
48
|
id: id,
|
|
62
|
-
className: [baseClassName, componentClassName, `x-${color}`, userClassName
|
|
63
|
-
style: style
|
|
64
|
-
animated: animated // {...otherProps}
|
|
49
|
+
className: [baseClassName, componentClassName, `x-${color}`, userClassName].filter(e => e).join(' '),
|
|
50
|
+
style: style // {...otherProps}
|
|
65
51
|
|
|
66
52
|
});
|
|
67
53
|
};
|
|
@@ -87,16 +73,6 @@ Logo.propTypes = {
|
|
|
87
73
|
*/
|
|
88
74
|
color: PropTypes.string,
|
|
89
75
|
|
|
90
|
-
/**
|
|
91
|
-
* Whether the logo is animated
|
|
92
|
-
*/
|
|
93
|
-
animated: PropTypes.bool,
|
|
94
|
-
|
|
95
|
-
/**
|
|
96
|
-
* Whether the animation loops
|
|
97
|
-
*/
|
|
98
|
-
loop: PropTypes.bool,
|
|
99
|
-
|
|
100
76
|
/**
|
|
101
77
|
* The height of the element
|
|
102
78
|
*/
|
|
@@ -113,10 +89,8 @@ Logo.propTypes = {
|
|
|
113
89
|
variant: PropTypes.string
|
|
114
90
|
};
|
|
115
91
|
Logo.defaultProps = {
|
|
116
|
-
color: '
|
|
117
|
-
|
|
118
|
-
loop: false,
|
|
119
|
-
height: '4em',
|
|
92
|
+
color: 'paragraph',
|
|
93
|
+
height: '2em',
|
|
120
94
|
variant: 'default'
|
|
121
95
|
};
|
|
122
96
|
export default Logo;
|
|
@@ -1,147 +1,9 @@
|
|
|
1
1
|
/* @pareto-engineering/generator-front 1.0.12 */
|
|
2
2
|
|
|
3
|
-
/* stylelint-disable selector-id-pattern, selector-max-id -- because of the custom svg */
|
|
4
|
-
|
|
5
3
|
@use "@pareto-engineering/bem";
|
|
6
4
|
|
|
7
|
-
// Main animation - finishes after the drawing
|
|
8
|
-
|
|
9
|
-
@keyframes draw-logo-p {
|
|
10
|
-
0% {
|
|
11
|
-
stroke-dashoffset: var(--svg-origin-stroke-dashoffset, 1000);
|
|
12
|
-
}
|
|
13
|
-
|
|
14
|
-
20%,
|
|
15
|
-
100% {
|
|
16
|
-
stroke-dashoffset: var(--svg-target-stroke-dashoffset, 0);
|
|
17
|
-
}
|
|
18
|
-
}
|
|
19
|
-
@keyframes draw-logo-areto {
|
|
20
|
-
0%,
|
|
21
|
-
20% {
|
|
22
|
-
stroke-dashoffset: var(--svg-origin-stroke-dashoffset, 1000);
|
|
23
|
-
}
|
|
24
|
-
|
|
25
|
-
90%,
|
|
26
|
-
100% {
|
|
27
|
-
stroke-dashoffset: var(--svg-target-stroke-dashoffset, 0);
|
|
28
|
-
}
|
|
29
|
-
}
|
|
30
|
-
@keyframes draw-logo-t {
|
|
31
|
-
0%,
|
|
32
|
-
90% {
|
|
33
|
-
stroke-dashoffset: var(--svg-origin-stroke-dashoffset, 1000);
|
|
34
|
-
}
|
|
35
|
-
|
|
36
|
-
100% {
|
|
37
|
-
stroke-dashoffset: var(--svg-target-stroke-dashoffset, 0);
|
|
38
|
-
}
|
|
39
|
-
}
|
|
40
|
-
|
|
41
|
-
// Alt animation - looping
|
|
42
|
-
|
|
43
|
-
@keyframes draw-alt-logo-p {
|
|
44
|
-
0% {
|
|
45
|
-
stroke-dashoffset: var(--svg-origin-stroke-dashoffset, 1000);
|
|
46
|
-
}
|
|
47
|
-
|
|
48
|
-
10%,
|
|
49
|
-
50% {
|
|
50
|
-
stroke-dashoffset: var(--svg-target-stroke-dashoffset, 0);
|
|
51
|
-
}
|
|
52
|
-
|
|
53
|
-
60%,
|
|
54
|
-
100% {
|
|
55
|
-
stroke-dashoffset: var(--svg-final-stroke-dashoffset, 1000);
|
|
56
|
-
}
|
|
57
|
-
}
|
|
58
|
-
@keyframes draw-alt-logo-areto {
|
|
59
|
-
0%,
|
|
60
|
-
10% {
|
|
61
|
-
stroke-dashoffset: var(--svg-origin-stroke-dashoffset, 1000);
|
|
62
|
-
}
|
|
63
|
-
|
|
64
|
-
45%,
|
|
65
|
-
60% {
|
|
66
|
-
stroke-dashoffset: var(--svg-target-stroke-dashoffset, 0);
|
|
67
|
-
}
|
|
68
|
-
|
|
69
|
-
95%,
|
|
70
|
-
100% {
|
|
71
|
-
stroke-dashoffset: var(--svg-final-stroke-dashoffset, 1000);
|
|
72
|
-
}
|
|
73
|
-
}
|
|
74
|
-
@keyframes draw-alt-logo-t {
|
|
75
|
-
0%,
|
|
76
|
-
45% {
|
|
77
|
-
stroke-dashoffset: var(--svg-origin-stroke-dashoffset, 1000);
|
|
78
|
-
}
|
|
79
|
-
|
|
80
|
-
50%,
|
|
81
|
-
95% {
|
|
82
|
-
stroke-dashoffset: var(--svg-target-stroke-dashoffset, 0);
|
|
83
|
-
}
|
|
84
|
-
|
|
85
|
-
100% {
|
|
86
|
-
stroke-dashoffset: var(--svg-final-stroke-dashoffset, 1000);
|
|
87
|
-
}
|
|
88
|
-
}
|
|
89
|
-
|
|
90
5
|
.#{bem.$base}.logo {
|
|
91
|
-
&.animated.animated {
|
|
92
|
-
--svg-animation-repeats: 1;
|
|
93
|
-
--svg-animation-time: 3.5s;
|
|
94
|
-
|
|
95
|
-
&:hover,
|
|
96
|
-
&:focus {
|
|
97
|
-
//--path-animation: dash-a 1s linear 0s 1 forwards;
|
|
98
|
-
}
|
|
99
|
-
|
|
100
|
-
use#logo__p {
|
|
101
|
-
//--svg-animation-delay: 0;
|
|
102
|
-
--svg-dasharray: 1000;
|
|
103
|
-
--svg-origin-stroke-dashoffset: -1000;
|
|
104
|
-
//--svg-target-stroke-dashoffset: 0;
|
|
105
|
-
--svg-final-stroke-dashoffset: 1000;
|
|
106
|
-
animation-name: draw-logo-p;
|
|
107
|
-
}
|
|
108
|
-
|
|
109
|
-
use#logo__areto {
|
|
110
|
-
--svg-dasharray: 2000;
|
|
111
|
-
--svg-origin-stroke-dashoffset: 2000;
|
|
112
|
-
//--svg-target-stroke-dashoffset: 0;
|
|
113
|
-
--svg-final-stroke-dashoffset: -2000;
|
|
114
|
-
animation-name: draw-logo-areto;
|
|
115
|
-
}
|
|
116
|
-
|
|
117
|
-
use#logo__t {
|
|
118
|
-
--svg-dasharray: 200;
|
|
119
|
-
--svg-origin-stroke-dashoffset: 200;
|
|
120
|
-
//--svg-target-stroke-dashoffset: 0;
|
|
121
|
-
--svg-final-stroke-dashoffset: -200;
|
|
122
|
-
animation-name: draw-logo-t;
|
|
123
|
-
}
|
|
124
|
-
|
|
125
|
-
&.loop.loop {
|
|
126
|
-
--svg-animation-time: 6s;
|
|
127
|
-
--svg-animation-repeats: infinite;
|
|
128
|
-
|
|
129
|
-
use#logo__p {
|
|
130
|
-
--svg-final-stroke-dashoffset: 1000;
|
|
131
|
-
animation-name: draw-alt-logo-p;
|
|
132
|
-
}
|
|
133
|
-
|
|
134
|
-
use#logo__areto {
|
|
135
|
-
--svg-final-stroke-dashoffset: -2000;
|
|
136
|
-
animation-name: draw-alt-logo-areto;
|
|
137
|
-
}
|
|
138
6
|
|
|
139
|
-
use#logo__t {
|
|
140
|
-
--svg-final-stroke-dashoffset: -200;
|
|
141
|
-
animation-name: draw-alt-logo-t;
|
|
142
|
-
}
|
|
143
|
-
}
|
|
144
|
-
}
|
|
145
7
|
}
|
|
146
8
|
|
|
147
9
|
|
|
@@ -57,8 +57,7 @@ const SelectInput = ({
|
|
|
57
57
|
return /*#__PURE__*/React.createElement("option", {
|
|
58
58
|
key: newOption.value,
|
|
59
59
|
value: newOption.value,
|
|
60
|
-
disabled: (newOption === null || newOption === void 0 ? void 0 : newOption.disabled) || false
|
|
61
|
-
selected: (newOption === null || newOption === void 0 ? void 0 : newOption.disabled) || true
|
|
60
|
+
disabled: (newOption === null || newOption === void 0 ? void 0 : newOption.disabled) || false
|
|
62
61
|
}, newOption.label);
|
|
63
62
|
})), (description || meta.touched && meta.error) && /*#__PURE__*/React.createElement(FormDescription, {
|
|
64
63
|
isError: !!meta.error,
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@pareto-engineering/design-system",
|
|
3
|
-
"version": "2.0.0-alpha.
|
|
3
|
+
"version": "2.0.0-alpha.28",
|
|
4
4
|
"description": "",
|
|
5
5
|
"main": "dist/cjs/index.js",
|
|
6
6
|
"module": "dist/es/index.js",
|
|
@@ -79,7 +79,7 @@
|
|
|
79
79
|
"stylelint-config-palantir": "^5.1.0"
|
|
80
80
|
},
|
|
81
81
|
"dependencies": {
|
|
82
|
-
"@pareto-engineering/assets": "^2.0.0-alpha.
|
|
82
|
+
"@pareto-engineering/assets": "^2.0.0-alpha.12",
|
|
83
83
|
"@pareto-engineering/bem": "^0.1.5",
|
|
84
84
|
"@pareto-engineering/styles": "^2.0.0-alpha.8",
|
|
85
85
|
"date-fns": "^2.22.1",
|