@semcore/icon 3.15.2 → 3.16.0

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 (42) hide show
  1. package/CHANGELOG.md +16 -0
  2. package/FeauturedImage/l/index.js +1 -1
  3. package/FeauturedImage/l/index.mjs +1 -1
  4. package/FeauturedImage/m/index.js +1 -1
  5. package/FeauturedImage/m/index.mjs +1 -1
  6. package/FeauturedVideo/l/index.js +1 -1
  7. package/FeauturedVideo/l/index.mjs +1 -1
  8. package/FeauturedVideo/m/index.js +1 -1
  9. package/FeauturedVideo/m/index.mjs +1 -1
  10. package/Stoller/l/index.js +1 -1
  11. package/Stoller/l/index.mjs +1 -1
  12. package/Stoller/m/index.js +1 -1
  13. package/Stoller/m/index.mjs +1 -1
  14. package/color/GoogleSheets/l/index.d.ts +6 -0
  15. package/color/GoogleSheets/l/index.js +47 -0
  16. package/color/GoogleSheets/l/index.mjs +35 -0
  17. package/color/GoogleSheets/m/index.d.ts +6 -0
  18. package/color/GoogleSheets/m/index.js +47 -0
  19. package/color/GoogleSheets/m/index.mjs +35 -0
  20. package/color/GoogleSlides/l/index.d.ts +6 -0
  21. package/color/GoogleSlides/l/index.js +47 -0
  22. package/color/GoogleSlides/l/index.mjs +35 -0
  23. package/color/GoogleSlides/m/index.d.ts +6 -0
  24. package/color/GoogleSlides/m/index.js +47 -0
  25. package/color/GoogleSlides/m/index.mjs +35 -0
  26. package/color/YoutubeAlt/l/index.js +1 -1
  27. package/color/YoutubeAlt/l/index.mjs +1 -1
  28. package/color/YoutubeAlt/m/index.js +1 -1
  29. package/color/YoutubeAlt/m/index.mjs +1 -1
  30. package/color/YoutubeRed/l/index.js +1 -1
  31. package/color/YoutubeRed/l/index.mjs +1 -1
  32. package/color/YoutubeRed/m/index.js +1 -1
  33. package/color/YoutubeRed/m/index.mjs +1 -1
  34. package/lib/cjs/Icon.js +14 -13
  35. package/lib/cjs/Icon.js.map +1 -1
  36. package/lib/es6/Icon.js +14 -13
  37. package/lib/es6/Icon.js.map +1 -1
  38. package/package.json +2 -6
  39. package/svg-new/color/GoogleSheets/l.svg +5 -0
  40. package/svg-new/color/GoogleSheets/m.svg +5 -0
  41. package/svg-new/color/GoogleSlides/l.svg +5 -0
  42. package/svg-new/color/GoogleSlides/m.svg +5 -0
package/CHANGELOG.md CHANGED
@@ -2,6 +2,22 @@
2
2
 
3
3
  CHANGELOG.md standards are inspired by [keepachangelog.com](https://keepachangelog.com/en/1.0.0/).
4
4
 
5
+ ## [3.16.0] - 2023-06-27
6
+
7
+ ### Added
8
+
9
+ - Added new `GoogleSheets` and `GoogleSlides` icons.
10
+
11
+ ### Fixed
12
+
13
+ - Removed duplication custom css class.
14
+
15
+ ## [3.15.3] - 2023-06-27
16
+
17
+ ### Changed
18
+
19
+ - Version patch update due to children dependencies update (`@semcore/flex-box` [4.7.31 ~> 4.7.32], `@semcore/utils` [3.53.4 ~> 3.54.0]).
20
+
5
21
  ## [3.15.2] - 2023-06-14
6
22
 
7
23
  ### Changed
@@ -49,7 +49,7 @@ FeauturedImage.displayName = 'FeauturedImage';
49
49
 
50
50
  var _default = (0, _core.createBaseComponent)(FeauturedImage);
51
51
 
52
- // eslint-disable-next-line no-console
52
+
53
53
  console.warn(true, 'The "FeauturedImage" icon is deprecated. Use the "FeaturedImage"', 'Icon');
54
54
 
55
55
  exports["default"] = _default;
@@ -28,7 +28,7 @@ function FeauturedImage({
28
28
  }));
29
29
  }
30
30
 
31
- // eslint-disable-next-line no-console
31
+
32
32
  console.warn(true, 'The "FeauturedImage" icon is deprecated. Use the "FeaturedImage"', 'Icon');
33
33
 
34
34
  FeauturedImage.displayName = 'FeauturedImage';
@@ -49,7 +49,7 @@ FeauturedImage.displayName = 'FeauturedImage';
49
49
 
50
50
  var _default = (0, _core.createBaseComponent)(FeauturedImage);
51
51
 
52
- // eslint-disable-next-line no-console
52
+
53
53
  console.warn(true, 'The "FeauturedImage" icon is deprecated. Use the "FeaturedImage"', 'Icon');
54
54
 
55
55
  exports["default"] = _default;
@@ -28,7 +28,7 @@ function FeauturedImage({
28
28
  }));
29
29
  }
30
30
 
31
- // eslint-disable-next-line no-console
31
+
32
32
  console.warn(true, 'The "FeauturedImage" icon is deprecated. Use the "FeaturedImage"', 'Icon');
33
33
 
34
34
  FeauturedImage.displayName = 'FeauturedImage';
@@ -49,7 +49,7 @@ FeauturedVideo.displayName = 'FeauturedVideo';
49
49
 
50
50
  var _default = (0, _core.createBaseComponent)(FeauturedVideo);
51
51
 
52
- // eslint-disable-next-line no-console
52
+
53
53
  console.warn(true, 'The "FeauturedVideo" icon is deprecated. Use the "FeaturedVideo"', 'Icon');
54
54
 
55
55
  exports["default"] = _default;
@@ -28,7 +28,7 @@ function FeauturedVideo({
28
28
  }));
29
29
  }
30
30
 
31
- // eslint-disable-next-line no-console
31
+
32
32
  console.warn(true, 'The "FeauturedVideo" icon is deprecated. Use the "FeaturedVideo"', 'Icon');
33
33
 
34
34
  FeauturedVideo.displayName = 'FeauturedVideo';
@@ -49,7 +49,7 @@ FeauturedVideo.displayName = 'FeauturedVideo';
49
49
 
50
50
  var _default = (0, _core.createBaseComponent)(FeauturedVideo);
51
51
 
52
- // eslint-disable-next-line no-console
52
+
53
53
  console.warn(true, 'The "FeauturedVideo" icon is deprecated. Use the "FeaturedVideo"', 'Icon');
54
54
 
55
55
  exports["default"] = _default;
@@ -28,7 +28,7 @@ function FeauturedVideo({
28
28
  }));
29
29
  }
30
30
 
31
- // eslint-disable-next-line no-console
31
+
32
32
  console.warn(true, 'The "FeauturedVideo" icon is deprecated. Use the "FeaturedVideo"', 'Icon');
33
33
 
34
34
  FeauturedVideo.displayName = 'FeauturedVideo';
@@ -55,7 +55,7 @@ Stoller.displayName = 'Stoller';
55
55
 
56
56
  var _default = (0, _core.createBaseComponent)(Stoller);
57
57
 
58
- // eslint-disable-next-line no-console
58
+
59
59
  console.warn(true, 'The "Stoller" icon is deprecated. Use the "Stroller"', 'Icon');
60
60
 
61
61
  exports['default'] = _default;
@@ -42,7 +42,7 @@ function Stoller({ width = '24', height = '24', viewBox = '0 0 24 24', ...props
42
42
  );
43
43
  }
44
44
 
45
- // eslint-disable-next-line no-console
45
+
46
46
  console.warn(true, 'The "Stoller" icon is deprecated. Use the "Stroller"', 'Icon');
47
47
 
48
48
  Stoller.displayName = 'Stoller';
@@ -59,7 +59,7 @@ Stoller.displayName = 'Stoller';
59
59
 
60
60
  var _default = (0, _core.createBaseComponent)(Stoller);
61
61
 
62
- // eslint-disable-next-line no-console
62
+
63
63
  console.warn(true, 'The "Stoller" icon is deprecated. Use the "Stroller"', 'Icon');
64
64
 
65
65
  exports['default'] = _default;
@@ -48,7 +48,7 @@ function Stoller({ width = '16', height = '16', viewBox = '0 0 16 16', ...props
48
48
 
49
49
  Stoller.displayName = 'Stoller';
50
50
 
51
- // eslint-disable-next-line no-console
51
+
52
52
  console.warn(true, 'The "Stoller" icon is deprecated. Use the "Stroller"', 'Icon');
53
53
 
54
54
  export default createBaseComponent(Stoller);
@@ -0,0 +1,6 @@
1
+
2
+ import React from 'react';
3
+ import { IIconProps } from '@semcore/icon';
4
+ declare const _default: <T>(props: IIconProps & T) => React.ReactElement;
5
+ export default _default;
6
+
@@ -0,0 +1,47 @@
1
+ "use strict";
2
+
3
+ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
4
+ Object.defineProperty(exports, "__esModule", {
5
+ value: true
6
+ });
7
+ exports["default"] = void 0;
8
+ var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
9
+ var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
10
+ var _react = _interopRequireDefault(require("react"));
11
+ var _core = require("@semcore/core");
12
+ var _icon = _interopRequireDefault(require("@semcore/icon"));
13
+ var _excluded = ["width", "height", "viewBox"];
14
+ function GoogleSheets(_ref, ref) {
15
+ var _ref$width = _ref.width,
16
+ width = _ref$width === void 0 ? '24' : _ref$width,
17
+ _ref$height = _ref.height,
18
+ height = _ref$height === void 0 ? '24' : _ref$height,
19
+ _ref$viewBox = _ref.viewBox,
20
+ viewBox = _ref$viewBox === void 0 ? '0 0 24 24' : _ref$viewBox,
21
+ props = (0, _objectWithoutProperties2["default"])(_ref, _excluded);
22
+ return /*#__PURE__*/_react["default"].createElement(_icon["default"], (0, _extends2["default"])({
23
+ ref: ref,
24
+ "data-name": "GoogleSheets",
25
+ "data-group": "l",
26
+ width: width,
27
+ height: height,
28
+ viewBox: viewBox
29
+ }, props), /*#__PURE__*/_react["default"].createElement("path", {
30
+ fill: "#4D9D68",
31
+ d: "M3 2c0-1.105.93-2 2.077-2H15l6 6v16c0 1.105-.93 2-2.077 2H5.077C3.93 24 3 23.105 3 22V2Z",
32
+ shapeRendering: "geometricPrecision"
33
+ }), /*#__PURE__*/_react["default"].createElement("path", {
34
+ fill: "#fff",
35
+ fillRule: "evenodd",
36
+ d: "M12.5 10H16v2h-3.5v-2Zm0 3H16v2h-3.5v-2Zm-1 2v-2H8v2h3.5ZM8 16v2h3.5v-2H8Zm4.5 0H16v2h-3.5v-2Zm-1-6v2H8v-2h3.5Zm0-1H17v10H7V9h4.5Z",
37
+ clipRule: "evenodd",
38
+ shapeRendering: "geometricPrecision"
39
+ }), /*#__PURE__*/_react["default"].createElement("path", {
40
+ fill: "#98C8AD",
41
+ d: "m21 6-6-6v6h6Z",
42
+ shapeRendering: "geometricPrecision"
43
+ }));
44
+ }
45
+ GoogleSheets.displayName = 'GoogleSheets';
46
+ var _default = (0, _core.createBaseComponent)(GoogleSheets);
47
+ exports["default"] = _default;
@@ -0,0 +1,35 @@
1
+ function _extends() { _extends = Object.assign ? Object.assign.bind() : 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
+ import React from 'react';
3
+ import { createBaseComponent } from '@semcore/core';
4
+ import Icon from '@semcore/icon';
5
+ function GoogleSheets({
6
+ width = '24',
7
+ height = '24',
8
+ viewBox = '0 0 24 24',
9
+ ...props
10
+ }, ref) {
11
+ return /*#__PURE__*/React.createElement(Icon, _extends({
12
+ ref: ref,
13
+ "data-name": "GoogleSheets",
14
+ "data-group": "l",
15
+ width: width,
16
+ height: height,
17
+ viewBox: viewBox
18
+ }, props), /*#__PURE__*/React.createElement("path", {
19
+ fill: "#4D9D68",
20
+ d: "M3 2c0-1.105.93-2 2.077-2H15l6 6v16c0 1.105-.93 2-2.077 2H5.077C3.93 24 3 23.105 3 22V2Z",
21
+ shapeRendering: "geometricPrecision"
22
+ }), /*#__PURE__*/React.createElement("path", {
23
+ fill: "#fff",
24
+ fillRule: "evenodd",
25
+ d: "M12.5 10H16v2h-3.5v-2Zm0 3H16v2h-3.5v-2Zm-1 2v-2H8v2h3.5ZM8 16v2h3.5v-2H8Zm4.5 0H16v2h-3.5v-2Zm-1-6v2H8v-2h3.5Zm0-1H17v10H7V9h4.5Z",
26
+ clipRule: "evenodd",
27
+ shapeRendering: "geometricPrecision"
28
+ }), /*#__PURE__*/React.createElement("path", {
29
+ fill: "#98C8AD",
30
+ d: "m21 6-6-6v6h6Z",
31
+ shapeRendering: "geometricPrecision"
32
+ }));
33
+ }
34
+ GoogleSheets.displayName = 'GoogleSheets';
35
+ export default createBaseComponent(GoogleSheets);
@@ -0,0 +1,6 @@
1
+
2
+ import React from 'react';
3
+ import { IIconProps } from '@semcore/icon';
4
+ declare const _default: <T>(props: IIconProps & T) => React.ReactElement;
5
+ export default _default;
6
+
@@ -0,0 +1,47 @@
1
+ "use strict";
2
+
3
+ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
4
+ Object.defineProperty(exports, "__esModule", {
5
+ value: true
6
+ });
7
+ exports["default"] = void 0;
8
+ var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
9
+ var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
10
+ var _react = _interopRequireDefault(require("react"));
11
+ var _core = require("@semcore/core");
12
+ var _icon = _interopRequireDefault(require("@semcore/icon"));
13
+ var _excluded = ["width", "height", "viewBox"];
14
+ function GoogleSheets(_ref, ref) {
15
+ var _ref$width = _ref.width,
16
+ width = _ref$width === void 0 ? '16' : _ref$width,
17
+ _ref$height = _ref.height,
18
+ height = _ref$height === void 0 ? '16' : _ref$height,
19
+ _ref$viewBox = _ref.viewBox,
20
+ viewBox = _ref$viewBox === void 0 ? '0 0 16 16' : _ref$viewBox,
21
+ props = (0, _objectWithoutProperties2["default"])(_ref, _excluded);
22
+ return /*#__PURE__*/_react["default"].createElement(_icon["default"], (0, _extends2["default"])({
23
+ ref: ref,
24
+ "data-name": "GoogleSheets",
25
+ "data-group": "m",
26
+ width: width,
27
+ height: height,
28
+ viewBox: viewBox
29
+ }, props), /*#__PURE__*/_react["default"].createElement("path", {
30
+ fill: "#4D9D68",
31
+ d: "M2 1.333C2 .597 2.62 0 3.385 0H10l4 4v10.667c0 .736-.62 1.333-1.385 1.333h-9.23C2.62 16 2 15.403 2 14.667V1.333Z",
32
+ shapeRendering: "geometricPrecision"
33
+ }), /*#__PURE__*/_react["default"].createElement("path", {
34
+ fill: "#fff",
35
+ fillRule: "evenodd",
36
+ d: "M8.5 7H11v1H8.5V7Zm0 2H11v1H8.5V9Zm-1 1V9H5v1h2.5ZM5 11v1h2.5v-1H5Zm3.5 0H11v1H8.5v-1Zm-1-4v1H5V7h2.5Zm0 6H4V6h8v7H7.5Z",
37
+ clipRule: "evenodd",
38
+ shapeRendering: "geometricPrecision"
39
+ }), /*#__PURE__*/_react["default"].createElement("path", {
40
+ fill: "#98C8AD",
41
+ d: "m14 4-4-4v4h4Z",
42
+ shapeRendering: "geometricPrecision"
43
+ }));
44
+ }
45
+ GoogleSheets.displayName = 'GoogleSheets';
46
+ var _default = (0, _core.createBaseComponent)(GoogleSheets);
47
+ exports["default"] = _default;
@@ -0,0 +1,35 @@
1
+ function _extends() { _extends = Object.assign ? Object.assign.bind() : 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
+ import React from 'react';
3
+ import { createBaseComponent } from '@semcore/core';
4
+ import Icon from '@semcore/icon';
5
+ function GoogleSheets({
6
+ width = '16',
7
+ height = '16',
8
+ viewBox = '0 0 16 16',
9
+ ...props
10
+ }, ref) {
11
+ return /*#__PURE__*/React.createElement(Icon, _extends({
12
+ ref: ref,
13
+ "data-name": "GoogleSheets",
14
+ "data-group": "m",
15
+ width: width,
16
+ height: height,
17
+ viewBox: viewBox
18
+ }, props), /*#__PURE__*/React.createElement("path", {
19
+ fill: "#4D9D68",
20
+ d: "M2 1.333C2 .597 2.62 0 3.385 0H10l4 4v10.667c0 .736-.62 1.333-1.385 1.333h-9.23C2.62 16 2 15.403 2 14.667V1.333Z",
21
+ shapeRendering: "geometricPrecision"
22
+ }), /*#__PURE__*/React.createElement("path", {
23
+ fill: "#fff",
24
+ fillRule: "evenodd",
25
+ d: "M8.5 7H11v1H8.5V7Zm0 2H11v1H8.5V9Zm-1 1V9H5v1h2.5ZM5 11v1h2.5v-1H5Zm3.5 0H11v1H8.5v-1Zm-1-4v1H5V7h2.5Zm0 6H4V6h8v7H7.5Z",
26
+ clipRule: "evenodd",
27
+ shapeRendering: "geometricPrecision"
28
+ }), /*#__PURE__*/React.createElement("path", {
29
+ fill: "#98C8AD",
30
+ d: "m14 4-4-4v4h4Z",
31
+ shapeRendering: "geometricPrecision"
32
+ }));
33
+ }
34
+ GoogleSheets.displayName = 'GoogleSheets';
35
+ export default createBaseComponent(GoogleSheets);
@@ -0,0 +1,6 @@
1
+
2
+ import React from 'react';
3
+ import { IIconProps } from '@semcore/icon';
4
+ declare const _default: <T>(props: IIconProps & T) => React.ReactElement;
5
+ export default _default;
6
+
@@ -0,0 +1,47 @@
1
+ "use strict";
2
+
3
+ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
4
+ Object.defineProperty(exports, "__esModule", {
5
+ value: true
6
+ });
7
+ exports["default"] = void 0;
8
+ var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
9
+ var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
10
+ var _react = _interopRequireDefault(require("react"));
11
+ var _core = require("@semcore/core");
12
+ var _icon = _interopRequireDefault(require("@semcore/icon"));
13
+ var _excluded = ["width", "height", "viewBox"];
14
+ function GoogleSlides(_ref, ref) {
15
+ var _ref$width = _ref.width,
16
+ width = _ref$width === void 0 ? '24' : _ref$width,
17
+ _ref$height = _ref.height,
18
+ height = _ref$height === void 0 ? '24' : _ref$height,
19
+ _ref$viewBox = _ref.viewBox,
20
+ viewBox = _ref$viewBox === void 0 ? '0 0 24 24' : _ref$viewBox,
21
+ props = (0, _objectWithoutProperties2["default"])(_ref, _excluded);
22
+ return /*#__PURE__*/_react["default"].createElement(_icon["default"], (0, _extends2["default"])({
23
+ ref: ref,
24
+ "data-name": "GoogleSlides",
25
+ "data-group": "l",
26
+ width: width,
27
+ height: height,
28
+ viewBox: viewBox
29
+ }, props), /*#__PURE__*/_react["default"].createElement("path", {
30
+ fill: "#E6B542",
31
+ d: "M3 2c0-1.105.93-2 2.077-2H15l6 6v16c0 1.105-.93 2-2.077 2H5.077C3.93 24 3 23.105 3 22V2Z",
32
+ shapeRendering: "geometricPrecision"
33
+ }), /*#__PURE__*/_react["default"].createElement("path", {
34
+ fill: "#fff",
35
+ fillRule: "evenodd",
36
+ d: "M8 9a1 1 0 0 0-1 1v8a1 1 0 0 0 1 1h8a1 1 0 0 0 1-1v-8a1 1 0 0 0-1-1H8Zm8 3H8v4h8v-4Z",
37
+ clipRule: "evenodd",
38
+ shapeRendering: "geometricPrecision"
39
+ }), /*#__PURE__*/_react["default"].createElement("path", {
40
+ fill: "#EED58D",
41
+ d: "m21 6-6-6v6h6Z",
42
+ shapeRendering: "geometricPrecision"
43
+ }));
44
+ }
45
+ GoogleSlides.displayName = 'GoogleSlides';
46
+ var _default = (0, _core.createBaseComponent)(GoogleSlides);
47
+ exports["default"] = _default;
@@ -0,0 +1,35 @@
1
+ function _extends() { _extends = Object.assign ? Object.assign.bind() : 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
+ import React from 'react';
3
+ import { createBaseComponent } from '@semcore/core';
4
+ import Icon from '@semcore/icon';
5
+ function GoogleSlides({
6
+ width = '24',
7
+ height = '24',
8
+ viewBox = '0 0 24 24',
9
+ ...props
10
+ }, ref) {
11
+ return /*#__PURE__*/React.createElement(Icon, _extends({
12
+ ref: ref,
13
+ "data-name": "GoogleSlides",
14
+ "data-group": "l",
15
+ width: width,
16
+ height: height,
17
+ viewBox: viewBox
18
+ }, props), /*#__PURE__*/React.createElement("path", {
19
+ fill: "#E6B542",
20
+ d: "M3 2c0-1.105.93-2 2.077-2H15l6 6v16c0 1.105-.93 2-2.077 2H5.077C3.93 24 3 23.105 3 22V2Z",
21
+ shapeRendering: "geometricPrecision"
22
+ }), /*#__PURE__*/React.createElement("path", {
23
+ fill: "#fff",
24
+ fillRule: "evenodd",
25
+ d: "M8 9a1 1 0 0 0-1 1v8a1 1 0 0 0 1 1h8a1 1 0 0 0 1-1v-8a1 1 0 0 0-1-1H8Zm8 3H8v4h8v-4Z",
26
+ clipRule: "evenodd",
27
+ shapeRendering: "geometricPrecision"
28
+ }), /*#__PURE__*/React.createElement("path", {
29
+ fill: "#EED58D",
30
+ d: "m21 6-6-6v6h6Z",
31
+ shapeRendering: "geometricPrecision"
32
+ }));
33
+ }
34
+ GoogleSlides.displayName = 'GoogleSlides';
35
+ export default createBaseComponent(GoogleSlides);
@@ -0,0 +1,6 @@
1
+
2
+ import React from 'react';
3
+ import { IIconProps } from '@semcore/icon';
4
+ declare const _default: <T>(props: IIconProps & T) => React.ReactElement;
5
+ export default _default;
6
+
@@ -0,0 +1,47 @@
1
+ "use strict";
2
+
3
+ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
4
+ Object.defineProperty(exports, "__esModule", {
5
+ value: true
6
+ });
7
+ exports["default"] = void 0;
8
+ var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
9
+ var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
10
+ var _react = _interopRequireDefault(require("react"));
11
+ var _core = require("@semcore/core");
12
+ var _icon = _interopRequireDefault(require("@semcore/icon"));
13
+ var _excluded = ["width", "height", "viewBox"];
14
+ function GoogleSlides(_ref, ref) {
15
+ var _ref$width = _ref.width,
16
+ width = _ref$width === void 0 ? '16' : _ref$width,
17
+ _ref$height = _ref.height,
18
+ height = _ref$height === void 0 ? '16' : _ref$height,
19
+ _ref$viewBox = _ref.viewBox,
20
+ viewBox = _ref$viewBox === void 0 ? '0 0 16 16' : _ref$viewBox,
21
+ props = (0, _objectWithoutProperties2["default"])(_ref, _excluded);
22
+ return /*#__PURE__*/_react["default"].createElement(_icon["default"], (0, _extends2["default"])({
23
+ ref: ref,
24
+ "data-name": "GoogleSlides",
25
+ "data-group": "m",
26
+ width: width,
27
+ height: height,
28
+ viewBox: viewBox
29
+ }, props), /*#__PURE__*/_react["default"].createElement("path", {
30
+ fill: "#E6B542",
31
+ d: "M2 1.333C2 .597 2.62 0 3.385 0H10l4 4v10.667c0 .736-.62 1.333-1.385 1.333h-9.23C2.62 16 2 15.403 2 14.667V1.333Z",
32
+ shapeRendering: "geometricPrecision"
33
+ }), /*#__PURE__*/_react["default"].createElement("path", {
34
+ fill: "#fff",
35
+ fillRule: "evenodd",
36
+ d: "M5 6a1 1 0 0 0-1 1v6a1 1 0 0 0 1 1h6a1 1 0 0 0 1-1V7a1 1 0 0 0-1-1H5Zm6 2.5H5v3h6v-3Z",
37
+ clipRule: "evenodd",
38
+ shapeRendering: "geometricPrecision"
39
+ }), /*#__PURE__*/_react["default"].createElement("path", {
40
+ fill: "#EED58D",
41
+ d: "m14 4-4-4v4h4Z",
42
+ shapeRendering: "geometricPrecision"
43
+ }));
44
+ }
45
+ GoogleSlides.displayName = 'GoogleSlides';
46
+ var _default = (0, _core.createBaseComponent)(GoogleSlides);
47
+ exports["default"] = _default;
@@ -0,0 +1,35 @@
1
+ function _extends() { _extends = Object.assign ? Object.assign.bind() : 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
+ import React from 'react';
3
+ import { createBaseComponent } from '@semcore/core';
4
+ import Icon from '@semcore/icon';
5
+ function GoogleSlides({
6
+ width = '16',
7
+ height = '16',
8
+ viewBox = '0 0 16 16',
9
+ ...props
10
+ }, ref) {
11
+ return /*#__PURE__*/React.createElement(Icon, _extends({
12
+ ref: ref,
13
+ "data-name": "GoogleSlides",
14
+ "data-group": "m",
15
+ width: width,
16
+ height: height,
17
+ viewBox: viewBox
18
+ }, props), /*#__PURE__*/React.createElement("path", {
19
+ fill: "#E6B542",
20
+ d: "M2 1.333C2 .597 2.62 0 3.385 0H10l4 4v10.667c0 .736-.62 1.333-1.385 1.333h-9.23C2.62 16 2 15.403 2 14.667V1.333Z",
21
+ shapeRendering: "geometricPrecision"
22
+ }), /*#__PURE__*/React.createElement("path", {
23
+ fill: "#fff",
24
+ fillRule: "evenodd",
25
+ d: "M5 6a1 1 0 0 0-1 1v6a1 1 0 0 0 1 1h6a1 1 0 0 0 1-1V7a1 1 0 0 0-1-1H5Zm6 2.5H5v3h6v-3Z",
26
+ clipRule: "evenodd",
27
+ shapeRendering: "geometricPrecision"
28
+ }), /*#__PURE__*/React.createElement("path", {
29
+ fill: "#EED58D",
30
+ d: "m14 4-4-4v4h4Z",
31
+ shapeRendering: "geometricPrecision"
32
+ }));
33
+ }
34
+ GoogleSlides.displayName = 'GoogleSlides';
35
+ export default createBaseComponent(GoogleSlides);
@@ -49,7 +49,7 @@ YoutubeAlt.displayName = 'YoutubeAlt';
49
49
 
50
50
  var _default = (0, _core.createBaseComponent)(YoutubeAlt);
51
51
 
52
- // eslint-disable-next-line no-console
52
+
53
53
  console.warn(true, 'The "YoutubeAlt" icon is deprecated. Use the "YoutubeColored"', 'Icon');
54
54
 
55
55
  exports["default"] = _default;
@@ -28,7 +28,7 @@ function YoutubeAlt({
28
28
  }));
29
29
  }
30
30
 
31
- // eslint-disable-next-line no-console
31
+
32
32
  console.warn(true, 'The "YoutubeAlt" icon is deprecated. Use the "YoutubeColored"', 'Icon');
33
33
 
34
34
  YoutubeAlt.displayName = 'YoutubeAlt';
@@ -49,7 +49,7 @@ YoutubeAlt.displayName = 'YoutubeAlt';
49
49
 
50
50
  var _default = (0, _core.createBaseComponent)(YoutubeAlt);
51
51
 
52
- // eslint-disable-next-line no-console
52
+
53
53
  console.warn(true, 'The "YoutubeAlt" icon is deprecated. Use the "YoutubeColored"', 'Icon');
54
54
 
55
55
  exports["default"] = _default;
@@ -28,7 +28,7 @@ function YoutubeAlt({
28
28
  }));
29
29
  }
30
30
 
31
- // eslint-disable-next-line no-console
31
+
32
32
  console.warn(true, 'The "YoutubeAlt" icon is deprecated. Use the "YoutubeColored"', 'Icon');
33
33
 
34
34
  YoutubeAlt.displayName = 'YoutubeAlt';
@@ -48,7 +48,7 @@ YoutubeRed.displayName = 'YoutubeRed';
48
48
 
49
49
  var _default = (0, _core.createBaseComponent)(YoutubeRed);
50
50
 
51
- // eslint-disable-next-line no-console
51
+
52
52
  console.warn(true, 'The "YoutubeRed" icon is deprecated. Use the "YoutubeInvert"', 'Icon');
53
53
 
54
54
  exports["default"] = _default;
@@ -27,7 +27,7 @@ function YoutubeRed({
27
27
  }));
28
28
  }
29
29
 
30
- // eslint-disable-next-line no-console
30
+
31
31
  console.warn(true, 'The "YoutubeRed" icon is deprecated. Use the "YoutubeInvert"', 'Icon');
32
32
 
33
33
  YoutubeRed.displayName = 'YoutubeRed';
@@ -48,7 +48,7 @@ YoutubeRed.displayName = 'YoutubeRed';
48
48
 
49
49
  var _default = (0, _core.createBaseComponent)(YoutubeRed);
50
50
 
51
- // eslint-disable-next-line no-console
51
+
52
52
  console.warn(true, 'The "YoutubeRed" icon is deprecated. Use the "YoutubeInvert"', 'Icon');
53
53
 
54
54
  exports["default"] = _default;
@@ -27,7 +27,7 @@ function YoutubeRed({
27
27
  }));
28
28
  }
29
29
 
30
- // eslint-disable-next-line no-console
30
+
31
31
  console.warn(true, 'The "YoutubeRed" icon is deprecated. Use the "YoutubeInvert"', 'Icon');
32
32
 
33
33
  YoutubeRed.displayName = 'YoutubeRed';
package/lib/cjs/Icon.js CHANGED
@@ -22,12 +22,12 @@ var _ref = require("@semcore/utils/lib/ref");
22
22
  var _hasLabels = _interopRequireDefault(require("@semcore/utils/lib/hasLabels"));
23
23
  var _excluded = ["keyboardFocused"];
24
24
  /*__reshadow-styles__:"./style/icon.shadow.css"*/
25
- var styles = ( /*__reshadow_css_start__*/_core.sstyled.insert( /*__inner_css_start__*/".___SIcon_yrenf_gg_{display:inline-block;-webkit-user-select:none;-moz-user-select:none;user-select:none;shape-rendering:geometricPrecision;box-sizing:content-box;fill:currentColor;flex-shrink:0;outline:0;color:var(--color_yrenf)}.___SIcon_yrenf_gg_.__keyboardFocused_yrenf_gg_{box-shadow:var(--intergalactic-keyboard-focus, 0px 0px 0px 3px rgba(0, 143, 248, 0.5))}.___SIcon_yrenf_gg_.__interactive_yrenf_gg_{cursor:pointer}@media (hover:hover){.___SIcon_yrenf_gg_.__interactive_yrenf_gg_:hover{color:var(--color-interactive_yrenf)}}" /*__inner_css_end__*/, "yrenf_gg_") /*__reshadow_css_end__*/, {
26
- "__SIcon": "___SIcon_yrenf_gg_",
27
- "--color": "--color_yrenf",
28
- "_keyboardFocused": "__keyboardFocused_yrenf_gg_",
29
- "_interactive": "__interactive_yrenf_gg_",
30
- "--color-interactive": "--color-interactive_yrenf"
25
+ var styles = ( /*__reshadow_css_start__*/_core.sstyled.insert( /*__inner_css_start__*/".___SIcon_p9grf_gg_{display:inline-block;-webkit-user-select:none;-moz-user-select:none;user-select:none;shape-rendering:geometricPrecision;box-sizing:content-box;fill:currentColor;flex-shrink:0;outline:0;color:var(--color_p9grf)}.___SIcon_p9grf_gg_.__keyboardFocused_p9grf_gg_{box-shadow:var(--intergalactic-keyboard-focus, 0px 0px 0px 3px rgba(0, 143, 248, 0.5))}.___SIcon_p9grf_gg_.__interactive_p9grf_gg_{cursor:pointer}@media (hover:hover){.___SIcon_p9grf_gg_.__interactive_p9grf_gg_:hover{color:var(--color-interactive_p9grf)}}" /*__inner_css_end__*/, "p9grf_gg_") /*__reshadow_css_end__*/, {
26
+ "__SIcon": "___SIcon_p9grf_gg_",
27
+ "--color": "--color_p9grf",
28
+ "_keyboardFocused": "__keyboardFocused_p9grf_gg_",
29
+ "_interactive": "__interactive_p9grf_gg_",
30
+ "--color-interactive": "--color-interactive_p9grf"
31
31
  });
32
32
  function Icon(props, ref) {
33
33
  var _useBox = (0, _flexBox.useBox)((0, _objectSpread2["default"])({
@@ -48,7 +48,7 @@ function Icon(props, ref) {
48
48
  disabled: !interactive
49
49
  }, other)),
50
50
  keyboardFocused = _keyboardFocusEnhance.keyboardFocused,
51
- propsWithKeyboardEnhance = (0, _objectWithoutProperties2["default"])(_keyboardFocusEnhance, _excluded);
51
+ propsEnhance = (0, _objectWithoutProperties2["default"])(_keyboardFocusEnhance, _excluded);
52
52
  var sstyles = (0, _core.sstyled)(styles);
53
53
  var _sstyles$cn = sstyles.cn('SIcon', {
54
54
  'color-interactive': (0, _color.shade)(color, -0.12),
@@ -59,11 +59,12 @@ function Icon(props, ref) {
59
59
  className = _sstyles$cn.className,
60
60
  style = _sstyles$cn.style;
61
61
  function onKeyDown(event) {
62
- if (props.onKeyDown) {
63
- return props.onKeyDown(event);
62
+ if (propsEnhance.onKeyDown) {
63
+ return propsEnhance.onKeyDown(event);
64
64
  }
65
65
  if (interactive && event.code === 'Enter') {
66
- props.onClick && props.onClick(event);
66
+ var _propsEnhance$onClick;
67
+ (_propsEnhance$onClick = propsEnhance.onClick) === null || _propsEnhance$onClick === void 0 ? void 0 : _propsEnhance$onClick.call(propsEnhance, event);
67
68
  }
68
69
  }
69
70
  var labelCheckRef = _react["default"].useRef();
@@ -77,9 +78,9 @@ function Icon(props, ref) {
77
78
  return /*#__PURE__*/_react["default"].createElement(SIcon, (0, _extends2["default"])({
78
79
  role: interactive ? 'button' : undefined,
79
80
  "aria-hidden": interactive ? undefined : 'true'
80
- }, (0, _propsForElement["default"])(propsWithKeyboardEnhance), {
81
- style: Object.assign({}, style, propsWithKeyboardEnhance.style, props.style),
82
- className: (0, _classnames["default"])(className, propsWithKeyboardEnhance.className, props.className) || undefined,
81
+ }, (0, _propsForElement["default"])(propsEnhance), {
82
+ style: Object.assign({}, style, propsEnhance.style),
83
+ className: (0, _classnames["default"])(className, propsEnhance.className) || undefined,
83
84
  onKeyDown: onKeyDown,
84
85
  ref: forkedRef
85
86
  }));
@@ -1 +1 @@
1
- {"version":3,"file":"Icon.js","names":["_core","require","_react","_interopRequireDefault","_classnames","_flexBox","_color","_interopRequireWildcard","_keyboardFocusEnhance2","_propsForElement","_logger","_ref","_hasLabels","_excluded","styles","sstyled","insert","Icon","props","ref","_useBox","useBox","_objectSpread2","tag","width","height","viewBox","focusable","interactive","_useBox2","_slicedToArray2","SIcon","other","colorProps","color","resolveColor","_keyboardFocusEnhance","keyboardFocusEnhance","disabled","keyboardFocused","propsWithKeyboardEnhance","_objectWithoutProperties2","sstyles","_sstyles$cn","cn","shade","className","style","onKeyDown","event","code","onClick","labelCheckRef","React","useRef","useEffect","process","env","NODE_ENV","logger","warn","hasLabels","current","displayName","forkedRef","useForkRef","createElement","_extends2","role","undefined","propsForElement","Object","assign","_default","createBaseComponent","exports"],"sources":["../../src/Icon.jsx"],"sourcesContent":["import React from 'react';\nimport cn from 'classnames';\nimport { createBaseComponent, sstyled } from '@semcore/core';\nimport { useBox } from '@semcore/flex-box';\nimport resolveColor, { shade } from '@semcore/utils/lib/color';\nimport keyboardFocusEnhance from '@semcore/utils/lib/enhances/keyboardFocusEnhance';\nimport propsForElement from '@semcore/utils/lib/propsForElement';\nimport logger from '@semcore/utils/lib/logger';\nimport { useForkRef } from '@semcore/utils/lib/ref';\nimport hasLabels from '@semcore/utils/lib/hasLabels';\n\nimport styles from './style/icon.shadow.css';\n\nfunction Icon(props, ref) {\n const [SIcon, other] = useBox(\n {\n tag: 'svg',\n 'data-ui-name': 'Icon',\n width: 16,\n height: 16,\n viewBox: '0 0 16 16',\n focusable: props.interactive,\n ...props,\n },\n ref,\n );\n\n const { interactive, color: colorProps } = props;\n const color = resolveColor(colorProps);\n const { keyboardFocused, ...propsWithKeyboardEnhance } = keyboardFocusEnhance()({\n disabled: !interactive,\n ...other,\n });\n const sstyles = sstyled(styles);\n const { className, style } = sstyles.cn('SIcon', {\n 'color-interactive': shade(color, -0.12),\n 'use:color': color,\n interactive: interactive,\n keyboardFocused: keyboardFocused,\n });\n\n function onKeyDown(event) {\n if (props.onKeyDown) {\n return props.onKeyDown(event);\n }\n\n if (interactive && event.code === 'Enter') {\n props.onClick && props.onClick(event);\n }\n }\n\n const labelCheckRef = React.useRef();\n React.useEffect(() => {\n if (!interactive) return;\n if (process.env.NODE_ENV !== 'production') {\n logger.warn(\n !hasLabels(labelCheckRef.current),\n `'aria-label' or 'aria-labelledby' are required props for interactive icons`,\n props['data-ui-name'] || Icon.displayName,\n );\n }\n }, [interactive]);\n const forkedRef = useForkRef(ref, labelCheckRef);\n\n return (\n <SIcon\n role={interactive ? 'button' : undefined}\n aria-hidden={interactive ? undefined : 'true'}\n {...propsForElement(propsWithKeyboardEnhance)}\n style={Object.assign({}, style, propsWithKeyboardEnhance.style, props.style)}\n className={cn(className, propsWithKeyboardEnhance.className, props.className) || undefined}\n onKeyDown={onKeyDown}\n ref={forkedRef}\n />\n );\n}\n\nIcon.displayName = 'Icon';\n\nexport default createBaseComponent(Icon);\n"],"mappings":"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"}
1
+ {"version":3,"file":"Icon.js","names":["_core","require","_react","_interopRequireDefault","_classnames","_flexBox","_color","_interopRequireWildcard","_keyboardFocusEnhance2","_propsForElement","_logger","_ref","_hasLabels","_excluded","styles","sstyled","insert","Icon","props","ref","_useBox","useBox","_objectSpread2","tag","width","height","viewBox","focusable","interactive","_useBox2","_slicedToArray2","SIcon","other","colorProps","color","resolveColor","_keyboardFocusEnhance","keyboardFocusEnhance","disabled","keyboardFocused","propsEnhance","_objectWithoutProperties2","sstyles","_sstyles$cn","cn","shade","className","style","onKeyDown","event","code","_propsEnhance$onClick","onClick","call","labelCheckRef","React","useRef","useEffect","process","env","NODE_ENV","logger","warn","hasLabels","current","displayName","forkedRef","useForkRef","createElement","_extends2","role","undefined","propsForElement","Object","assign","_default","createBaseComponent","exports"],"sources":["../../src/Icon.jsx"],"sourcesContent":["import React from 'react';\nimport cn from 'classnames';\nimport { createBaseComponent, sstyled } from '@semcore/core';\nimport { useBox } from '@semcore/flex-box';\nimport resolveColor, { shade } from '@semcore/utils/lib/color';\nimport keyboardFocusEnhance from '@semcore/utils/lib/enhances/keyboardFocusEnhance';\nimport propsForElement from '@semcore/utils/lib/propsForElement';\nimport logger from '@semcore/utils/lib/logger';\nimport { useForkRef } from '@semcore/utils/lib/ref';\nimport hasLabels from '@semcore/utils/lib/hasLabels';\n\nimport styles from './style/icon.shadow.css';\n\nfunction Icon(props, ref) {\n const [SIcon, other] = useBox(\n {\n tag: 'svg',\n 'data-ui-name': 'Icon',\n width: 16,\n height: 16,\n viewBox: '0 0 16 16',\n focusable: props.interactive,\n ...props,\n },\n ref,\n );\n\n const { interactive, color: colorProps } = props;\n const color = resolveColor(colorProps);\n const { keyboardFocused, ...propsEnhance } = keyboardFocusEnhance()({\n disabled: !interactive,\n ...other,\n });\n const sstyles = sstyled(styles);\n const { className, style } = sstyles.cn('SIcon', {\n 'color-interactive': shade(color, -0.12),\n 'use:color': color,\n interactive: interactive,\n keyboardFocused: keyboardFocused,\n });\n\n function onKeyDown(event) {\n if (propsEnhance.onKeyDown) {\n return propsEnhance.onKeyDown(event);\n }\n\n if (interactive && event.code === 'Enter') {\n propsEnhance.onClick?.(event);\n }\n }\n\n const labelCheckRef = React.useRef();\n React.useEffect(() => {\n if (!interactive) return;\n if (process.env.NODE_ENV !== 'production') {\n logger.warn(\n !hasLabels(labelCheckRef.current),\n `'aria-label' or 'aria-labelledby' are required props for interactive icons`,\n props['data-ui-name'] || Icon.displayName,\n );\n }\n }, [interactive]);\n const forkedRef = useForkRef(ref, labelCheckRef);\n\n return (\n <SIcon\n role={interactive ? 'button' : undefined}\n aria-hidden={interactive ? undefined : 'true'}\n {...propsForElement(propsEnhance)}\n style={Object.assign({}, style, propsEnhance.style)}\n className={cn(className, propsEnhance.className) || undefined}\n onKeyDown={onKeyDown}\n ref={forkedRef}\n />\n );\n}\n\nIcon.displayName = 'Icon';\n\nexport default createBaseComponent(Icon);\n"],"mappings":"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"}
package/lib/es6/Icon.js CHANGED
@@ -15,12 +15,12 @@ import logger from '@semcore/utils/lib/logger';
15
15
  import { useForkRef } from '@semcore/utils/lib/ref';
16
16
  import hasLabels from '@semcore/utils/lib/hasLabels';
17
17
  /*__reshadow-styles__:"./style/icon.shadow.css"*/
18
- var styles = ( /*__reshadow_css_start__*/_sstyled.insert( /*__inner_css_start__*/".___SIcon_yrenf_gg_{display:inline-block;-webkit-user-select:none;-moz-user-select:none;user-select:none;shape-rendering:geometricPrecision;box-sizing:content-box;fill:currentColor;flex-shrink:0;outline:0;color:var(--color_yrenf)}.___SIcon_yrenf_gg_.__keyboardFocused_yrenf_gg_{box-shadow:var(--intergalactic-keyboard-focus, 0px 0px 0px 3px rgba(0, 143, 248, 0.5))}.___SIcon_yrenf_gg_.__interactive_yrenf_gg_{cursor:pointer}@media (hover:hover){.___SIcon_yrenf_gg_.__interactive_yrenf_gg_:hover{color:var(--color-interactive_yrenf)}}" /*__inner_css_end__*/, "yrenf_gg_") /*__reshadow_css_end__*/, {
19
- "__SIcon": "___SIcon_yrenf_gg_",
20
- "--color": "--color_yrenf",
21
- "_keyboardFocused": "__keyboardFocused_yrenf_gg_",
22
- "_interactive": "__interactive_yrenf_gg_",
23
- "--color-interactive": "--color-interactive_yrenf"
18
+ var styles = ( /*__reshadow_css_start__*/_sstyled.insert( /*__inner_css_start__*/".___SIcon_p9grf_gg_{display:inline-block;-webkit-user-select:none;-moz-user-select:none;user-select:none;shape-rendering:geometricPrecision;box-sizing:content-box;fill:currentColor;flex-shrink:0;outline:0;color:var(--color_p9grf)}.___SIcon_p9grf_gg_.__keyboardFocused_p9grf_gg_{box-shadow:var(--intergalactic-keyboard-focus, 0px 0px 0px 3px rgba(0, 143, 248, 0.5))}.___SIcon_p9grf_gg_.__interactive_p9grf_gg_{cursor:pointer}@media (hover:hover){.___SIcon_p9grf_gg_.__interactive_p9grf_gg_:hover{color:var(--color-interactive_p9grf)}}" /*__inner_css_end__*/, "p9grf_gg_") /*__reshadow_css_end__*/, {
19
+ "__SIcon": "___SIcon_p9grf_gg_",
20
+ "--color": "--color_p9grf",
21
+ "_keyboardFocused": "__keyboardFocused_p9grf_gg_",
22
+ "_interactive": "__interactive_p9grf_gg_",
23
+ "--color-interactive": "--color-interactive_p9grf"
24
24
  });
25
25
  function Icon(props, ref) {
26
26
  var _useBox = useBox(_objectSpread({
@@ -41,7 +41,7 @@ function Icon(props, ref) {
41
41
  disabled: !interactive
42
42
  }, other)),
43
43
  keyboardFocused = _keyboardFocusEnhance.keyboardFocused,
44
- propsWithKeyboardEnhance = _objectWithoutProperties(_keyboardFocusEnhance, _excluded);
44
+ propsEnhance = _objectWithoutProperties(_keyboardFocusEnhance, _excluded);
45
45
  var sstyles = sstyled(styles);
46
46
  var _sstyles$cn = sstyles.cn('SIcon', {
47
47
  'color-interactive': shade(color, -0.12),
@@ -52,11 +52,12 @@ function Icon(props, ref) {
52
52
  className = _sstyles$cn.className,
53
53
  style = _sstyles$cn.style;
54
54
  function onKeyDown(event) {
55
- if (props.onKeyDown) {
56
- return props.onKeyDown(event);
55
+ if (propsEnhance.onKeyDown) {
56
+ return propsEnhance.onKeyDown(event);
57
57
  }
58
58
  if (interactive && event.code === 'Enter') {
59
- props.onClick && props.onClick(event);
59
+ var _propsEnhance$onClick;
60
+ (_propsEnhance$onClick = propsEnhance.onClick) === null || _propsEnhance$onClick === void 0 ? void 0 : _propsEnhance$onClick.call(propsEnhance, event);
60
61
  }
61
62
  }
62
63
  var labelCheckRef = React.useRef();
@@ -70,9 +71,9 @@ function Icon(props, ref) {
70
71
  return /*#__PURE__*/React.createElement(SIcon, _extends({
71
72
  role: interactive ? 'button' : undefined,
72
73
  "aria-hidden": interactive ? undefined : 'true'
73
- }, propsForElement(propsWithKeyboardEnhance), {
74
- style: Object.assign({}, style, propsWithKeyboardEnhance.style, props.style),
75
- className: cn(className, propsWithKeyboardEnhance.className, props.className) || undefined,
74
+ }, propsForElement(propsEnhance), {
75
+ style: Object.assign({}, style, propsEnhance.style),
76
+ className: cn(className, propsEnhance.className) || undefined,
76
77
  onKeyDown: onKeyDown,
77
78
  ref: forkedRef
78
79
  }));
@@ -1 +1 @@
1
- {"version":3,"file":"Icon.js","names":["React","cn","createBaseComponent","sstyled","useBox","resolveColor","shade","keyboardFocusEnhance","propsForElement","logger","useForkRef","hasLabels","styles","_sstyled","insert","Icon","props","ref","_useBox","_objectSpread","tag","width","height","viewBox","focusable","interactive","_useBox2","_slicedToArray","SIcon","other","colorProps","color","_keyboardFocusEnhance","disabled","keyboardFocused","propsWithKeyboardEnhance","_objectWithoutProperties","_excluded","sstyles","_sstyles$cn","className","style","onKeyDown","event","code","onClick","labelCheckRef","useRef","useEffect","process","env","NODE_ENV","warn","current","displayName","forkedRef","createElement","_extends","role","undefined","Object","assign"],"sources":["../../src/Icon.jsx"],"sourcesContent":["import React from 'react';\nimport cn from 'classnames';\nimport { createBaseComponent, sstyled } from '@semcore/core';\nimport { useBox } from '@semcore/flex-box';\nimport resolveColor, { shade } from '@semcore/utils/lib/color';\nimport keyboardFocusEnhance from '@semcore/utils/lib/enhances/keyboardFocusEnhance';\nimport propsForElement from '@semcore/utils/lib/propsForElement';\nimport logger from '@semcore/utils/lib/logger';\nimport { useForkRef } from '@semcore/utils/lib/ref';\nimport hasLabels from '@semcore/utils/lib/hasLabels';\n\nimport styles from './style/icon.shadow.css';\n\nfunction Icon(props, ref) {\n const [SIcon, other] = useBox(\n {\n tag: 'svg',\n 'data-ui-name': 'Icon',\n width: 16,\n height: 16,\n viewBox: '0 0 16 16',\n focusable: props.interactive,\n ...props,\n },\n ref,\n );\n\n const { interactive, color: colorProps } = props;\n const color = resolveColor(colorProps);\n const { keyboardFocused, ...propsWithKeyboardEnhance } = keyboardFocusEnhance()({\n disabled: !interactive,\n ...other,\n });\n const sstyles = sstyled(styles);\n const { className, style } = sstyles.cn('SIcon', {\n 'color-interactive': shade(color, -0.12),\n 'use:color': color,\n interactive: interactive,\n keyboardFocused: keyboardFocused,\n });\n\n function onKeyDown(event) {\n if (props.onKeyDown) {\n return props.onKeyDown(event);\n }\n\n if (interactive && event.code === 'Enter') {\n props.onClick && props.onClick(event);\n }\n }\n\n const labelCheckRef = React.useRef();\n React.useEffect(() => {\n if (!interactive) return;\n if (process.env.NODE_ENV !== 'production') {\n logger.warn(\n !hasLabels(labelCheckRef.current),\n `'aria-label' or 'aria-labelledby' are required props for interactive icons`,\n props['data-ui-name'] || Icon.displayName,\n );\n }\n }, [interactive]);\n const forkedRef = useForkRef(ref, labelCheckRef);\n\n return (\n <SIcon\n role={interactive ? 'button' : undefined}\n aria-hidden={interactive ? undefined : 'true'}\n {...propsForElement(propsWithKeyboardEnhance)}\n style={Object.assign({}, style, propsWithKeyboardEnhance.style, props.style)}\n className={cn(className, propsWithKeyboardEnhance.className, props.className) || undefined}\n onKeyDown={onKeyDown}\n ref={forkedRef}\n />\n );\n}\n\nIcon.displayName = 'Icon';\n\nexport default createBaseComponent(Icon);\n"],"mappings":"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"}
1
+ {"version":3,"file":"Icon.js","names":["React","cn","createBaseComponent","sstyled","useBox","resolveColor","shade","keyboardFocusEnhance","propsForElement","logger","useForkRef","hasLabels","styles","_sstyled","insert","Icon","props","ref","_useBox","_objectSpread","tag","width","height","viewBox","focusable","interactive","_useBox2","_slicedToArray","SIcon","other","colorProps","color","_keyboardFocusEnhance","disabled","keyboardFocused","propsEnhance","_objectWithoutProperties","_excluded","sstyles","_sstyles$cn","className","style","onKeyDown","event","code","_propsEnhance$onClick","onClick","call","labelCheckRef","useRef","useEffect","process","env","NODE_ENV","warn","current","displayName","forkedRef","createElement","_extends","role","undefined","Object","assign"],"sources":["../../src/Icon.jsx"],"sourcesContent":["import React from 'react';\nimport cn from 'classnames';\nimport { createBaseComponent, sstyled } from '@semcore/core';\nimport { useBox } from '@semcore/flex-box';\nimport resolveColor, { shade } from '@semcore/utils/lib/color';\nimport keyboardFocusEnhance from '@semcore/utils/lib/enhances/keyboardFocusEnhance';\nimport propsForElement from '@semcore/utils/lib/propsForElement';\nimport logger from '@semcore/utils/lib/logger';\nimport { useForkRef } from '@semcore/utils/lib/ref';\nimport hasLabels from '@semcore/utils/lib/hasLabels';\n\nimport styles from './style/icon.shadow.css';\n\nfunction Icon(props, ref) {\n const [SIcon, other] = useBox(\n {\n tag: 'svg',\n 'data-ui-name': 'Icon',\n width: 16,\n height: 16,\n viewBox: '0 0 16 16',\n focusable: props.interactive,\n ...props,\n },\n ref,\n );\n\n const { interactive, color: colorProps } = props;\n const color = resolveColor(colorProps);\n const { keyboardFocused, ...propsEnhance } = keyboardFocusEnhance()({\n disabled: !interactive,\n ...other,\n });\n const sstyles = sstyled(styles);\n const { className, style } = sstyles.cn('SIcon', {\n 'color-interactive': shade(color, -0.12),\n 'use:color': color,\n interactive: interactive,\n keyboardFocused: keyboardFocused,\n });\n\n function onKeyDown(event) {\n if (propsEnhance.onKeyDown) {\n return propsEnhance.onKeyDown(event);\n }\n\n if (interactive && event.code === 'Enter') {\n propsEnhance.onClick?.(event);\n }\n }\n\n const labelCheckRef = React.useRef();\n React.useEffect(() => {\n if (!interactive) return;\n if (process.env.NODE_ENV !== 'production') {\n logger.warn(\n !hasLabels(labelCheckRef.current),\n `'aria-label' or 'aria-labelledby' are required props for interactive icons`,\n props['data-ui-name'] || Icon.displayName,\n );\n }\n }, [interactive]);\n const forkedRef = useForkRef(ref, labelCheckRef);\n\n return (\n <SIcon\n role={interactive ? 'button' : undefined}\n aria-hidden={interactive ? undefined : 'true'}\n {...propsForElement(propsEnhance)}\n style={Object.assign({}, style, propsEnhance.style)}\n className={cn(className, propsEnhance.className) || undefined}\n onKeyDown={onKeyDown}\n ref={forkedRef}\n />\n );\n}\n\nIcon.displayName = 'Icon';\n\nexport default createBaseComponent(Icon);\n"],"mappings":"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"}
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@semcore/icon",
3
3
  "description": "Semrush Icon Component",
4
- "version": "3.15.2",
4
+ "version": "3.16.0",
5
5
  "main": "lib/cjs/index.js",
6
6
  "module": "lib/es6/index.js",
7
7
  "typings": "lib/types/index.d.ts",
@@ -19,9 +19,6 @@
19
19
  "react": "16.8 - 18",
20
20
  "react-dom": "16.8 - 18"
21
21
  },
22
- "jest": {
23
- "preset": "@semcore/jest-preset-ui"
24
- },
25
22
  "repository": {
26
23
  "type": "git",
27
24
  "url": "https://github.com/semrush/intergalactic.git",
@@ -29,13 +26,12 @@
29
26
  },
30
27
  "devDependencies": {
31
28
  "@semcore/icon-transform-svg": "1.1.0",
32
- "@semcore/jest-preset-ui": "1.0.0",
29
+ "@semcore/testing-utils": "1.0.0",
33
30
  "@types/react": "18.0.21"
34
31
  },
35
32
  "scripts": {
36
33
  "transform": "pnpm icon-transform-svg",
37
34
  "build": "pnpm run clean && pnpm semcore-builder --source=js && pnpm run transform --configFile=./transform-svg-legacy.config.js && pnpm run transform --configFile=./transform-svg.config.js",
38
- "test": "jest",
39
35
  "clean": "node clean.js"
40
36
  }
41
37
  }
@@ -0,0 +1,5 @@
1
+ <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24">
2
+ <path fill="#4D9D68" d="M3 2c0-1.105.93-2 2.077-2H15l6 6v16c0 1.105-.93 2-2.077 2H5.077C3.93 24 3 23.105 3 22V2Z"/>
3
+ <path fill="#fff" fill-rule="evenodd" d="M12.5 10H16v2h-3.5v-2Zm0 3H16v2h-3.5v-2Zm-1 2v-2H8v2h3.5ZM8 16v2h3.5v-2H8Zm4.5 0H16v2h-3.5v-2Zm-1-6v2H8v-2h3.5Zm0-1H17v10H7V9h4.5Z" clip-rule="evenodd"/>
4
+ <path fill="#98C8AD" d="m21 6-6-6v6h6Z"/>
5
+ </svg>
@@ -0,0 +1,5 @@
1
+ <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 16 16">
2
+ <path fill="#4D9D68" d="M2 1.333C2 .597 2.62 0 3.385 0H10l4 4v10.667c0 .736-.62 1.333-1.385 1.333h-9.23C2.62 16 2 15.403 2 14.667V1.333Z"/>
3
+ <path fill="#fff" fill-rule="evenodd" d="M8.5 7H11v1H8.5V7Zm0 2H11v1H8.5V9Zm-1 1V9H5v1h2.5ZM5 11v1h2.5v-1H5Zm3.5 0H11v1H8.5v-1Zm-1-4v1H5V7h2.5Zm0 6H4V6h8v7H7.5Z" clip-rule="evenodd"/>
4
+ <path fill="#98C8AD" d="m14 4-4-4v4h4Z"/>
5
+ </svg>
@@ -0,0 +1,5 @@
1
+ <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24">
2
+ <path fill="#E6B542" d="M3 2c0-1.105.93-2 2.077-2H15l6 6v16c0 1.105-.93 2-2.077 2H5.077C3.93 24 3 23.105 3 22V2Z"/>
3
+ <path fill="#fff" fill-rule="evenodd" d="M8 9a1 1 0 0 0-1 1v8a1 1 0 0 0 1 1h8a1 1 0 0 0 1-1v-8a1 1 0 0 0-1-1H8Zm8 3H8v4h8v-4Z" clip-rule="evenodd"/>
4
+ <path fill="#EED58D" d="m21 6-6-6v6h6Z"/>
5
+ </svg>
@@ -0,0 +1,5 @@
1
+ <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 16 16">
2
+ <path fill="#E6B542" d="M2 1.333C2 .597 2.62 0 3.385 0H10l4 4v10.667c0 .736-.62 1.333-1.385 1.333h-9.23C2.62 16 2 15.403 2 14.667V1.333Z"/>
3
+ <path fill="#fff" fill-rule="evenodd" d="M5 6a1 1 0 0 0-1 1v6a1 1 0 0 0 1 1h6a1 1 0 0 0 1-1V7a1 1 0 0 0-1-1H5Zm6 2.5H5v3h6v-3Z" clip-rule="evenodd"/>
4
+ <path fill="#EED58D" d="m14 4-4-4v4h4Z"/>
5
+ </svg>