@semcore/tag 3.6.3 → 3.6.4
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/CHANGELOG.md +6 -0
- package/lib/cjs/Tag.js +4 -8
- package/lib/cjs/Tag.js.map +1 -1
- package/lib/es6/Tag.js +4 -8
- package/lib/es6/Tag.js.map +1 -1
- package/lib/types/index.d.ts +0 -4
- package/package.json +6 -1
- package/src/Tag.js +6 -16
- package/src/index.d.ts +0 -4
package/CHANGELOG.md
CHANGED
package/lib/cjs/Tag.js
CHANGED
|
@@ -104,12 +104,10 @@ var RootTag = /*#__PURE__*/function (_Component) {
|
|
|
104
104
|
value: function getCloseProps() {
|
|
105
105
|
var _this$asProps = this.asProps,
|
|
106
106
|
use = _this$asProps.use,
|
|
107
|
-
theme = _this$asProps.theme
|
|
108
|
-
size = _this$asProps.size;
|
|
107
|
+
theme = _this$asProps.theme;
|
|
109
108
|
return {
|
|
110
109
|
use: use,
|
|
111
|
-
theme: theme
|
|
112
|
-
size: size
|
|
110
|
+
theme: theme
|
|
113
111
|
};
|
|
114
112
|
}
|
|
115
113
|
}, {
|
|
@@ -134,11 +132,10 @@ var RootTag = /*#__PURE__*/function (_Component) {
|
|
|
134
132
|
interactive = false;
|
|
135
133
|
}
|
|
136
134
|
|
|
137
|
-
var useTheme = getThemeName(use, theme);
|
|
138
135
|
var colorTag = theme ? (0, _color.opacity)((0, _color["default"])(theme), 0.5) : '';
|
|
139
136
|
var colorText = color ? (0, _color["default"])(color) : (0, _color["default"])(theme);
|
|
140
137
|
return _ref6 = (0, _core.sstyled)(styles), /*#__PURE__*/_react["default"].createElement(STag, _ref6.cn("STag", _objectSpread({}, (0, _core.assignProps)({
|
|
141
|
-
"use:theme":
|
|
138
|
+
"use:theme": getThemeName(use, theme),
|
|
142
139
|
"use:interactive": interactive,
|
|
143
140
|
"colorText": colorText,
|
|
144
141
|
"colorTag": colorTag
|
|
@@ -178,8 +175,7 @@ function Close(props) {
|
|
|
178
175
|
var SClose = _flexBox.Box;
|
|
179
176
|
var styles = props.styles,
|
|
180
177
|
use = props.use,
|
|
181
|
-
theme = props.theme
|
|
182
|
-
size = props.size;
|
|
178
|
+
theme = props.theme;
|
|
183
179
|
return _ref8 = (0, _core.sstyled)(styles), /*#__PURE__*/_react["default"].createElement(SClose, _ref8.cn("SClose", _objectSpread({}, (0, _core.assignProps)({
|
|
184
180
|
"use:theme": getThemeName(use, theme),
|
|
185
181
|
"tag": _m["default"]
|
package/lib/cjs/Tag.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../src/Tag.js"],"names":["isCustomTheme","use","theme","type","primary","secondary","includes","getThemeName","RootTag","asProps","
|
|
1
|
+
{"version":3,"sources":["../../src/Tag.js"],"names":["isCustomTheme","use","theme","type","primary","secondary","includes","getThemeName","RootTag","asProps","STag","Box","Children","styles","color","interactive","disabled","addonLeft","addonRight","colorTag","colorText","Tag","Text","Addon","Component","style","size","props","SText","Close","SClose","CloseM","SAddon","Circle","SCircle"],"mappings":"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","sourcesContent":["import React from 'react';\nimport createComponent, { Component, sstyled, Root } from '@semcore/core';\nimport { Box } from '@semcore/flex-box';\nimport resolveColor, { opacity } from '@semcore/utils/lib/color';\nimport addonTextChildren from '@semcore/utils/lib/addonTextChildren';\nimport CloseM from '@semcore/icon/Close/m';\n\nimport style from './style/tag.shadow.css';\n\nfunction isCustomTheme(use, theme) {\n const type = {\n primary: ['muted', 'invert', 'warning'],\n secondary: ['muted', 'invert'],\n };\n return type[use] ? !type[use].includes(theme) : true;\n}\n\nfunction getThemeName(use, theme) {\n return isCustomTheme(use, theme) ? 'custom' : `${use}-${theme}`;\n}\n\nclass RootTag extends Component {\n static displayName = 'Tag';\n static style = style;\n static defaultProps = {\n use: 'secondary',\n theme: 'muted',\n size: 'm',\n };\n\n getCloseProps() {\n const { use, theme } = this.asProps;\n return { use, theme };\n }\n\n render() {\n const STag = Root;\n let { Children, styles, theme, use, color, interactive, disabled, addonLeft, addonRight } =\n this.asProps;\n\n if (disabled) {\n interactive = false;\n }\n\n const colorTag = theme ? opacity(resolveColor(theme), 0.5) : '';\n const colorText = color ? resolveColor(color) : resolveColor(theme);\n\n return sstyled(styles)(\n <STag\n render={Box}\n use:theme={getThemeName(use, theme)}\n use:interactive={interactive}\n colorText={colorText}\n colorTag={colorTag}\n >\n {addonLeft ? <Tag.Addon tag={addonLeft} /> : null}\n {addonTextChildren(Children, Tag.Text, Tag.Addon)}\n {addonRight ? <Tag.Addon tag={addonRight} /> : null}\n </STag>,\n );\n }\n}\n\nfunction Text(props) {\n const SText = Root;\n const { styles } = props;\n return sstyled(styles)(<SText render={Box} tag=\"span\" />);\n}\n\nfunction Close(props) {\n const SClose = Root;\n const { styles, use, theme } = props;\n\n return sstyled(styles)(<SClose render={Box} use:theme={getThemeName(use, theme)} tag={CloseM} />);\n}\n\nfunction Addon(props) {\n const SAddon = Root;\n const { styles } = props;\n return sstyled(styles)(<SAddon render={Box} tag=\"span\" />);\n}\n\nfunction Circle(props) {\n const SCircle = Root;\n const { styles } = props;\n return sstyled(styles)(<SCircle render={Box} tag=\"span\" />);\n}\n\nconst Tag = createComponent(RootTag, {\n Text,\n Addon,\n Close,\n Circle,\n});\n\nexport default Tag;\n"],"file":"Tag.js"}
|
package/lib/es6/Tag.js
CHANGED
|
@@ -86,12 +86,10 @@ var RootTag = /*#__PURE__*/function (_Component) {
|
|
|
86
86
|
value: function getCloseProps() {
|
|
87
87
|
var _this$asProps = this.asProps,
|
|
88
88
|
use = _this$asProps.use,
|
|
89
|
-
theme = _this$asProps.theme
|
|
90
|
-
size = _this$asProps.size;
|
|
89
|
+
theme = _this$asProps.theme;
|
|
91
90
|
return {
|
|
92
91
|
use: use,
|
|
93
|
-
theme: theme
|
|
94
|
-
size: size
|
|
92
|
+
theme: theme
|
|
95
93
|
};
|
|
96
94
|
}
|
|
97
95
|
}, {
|
|
@@ -116,11 +114,10 @@ var RootTag = /*#__PURE__*/function (_Component) {
|
|
|
116
114
|
interactive = false;
|
|
117
115
|
}
|
|
118
116
|
|
|
119
|
-
var useTheme = getThemeName(use, theme);
|
|
120
117
|
var colorTag = theme ? opacity(resolveColor(theme), 0.5) : '';
|
|
121
118
|
var colorText = color ? resolveColor(color) : resolveColor(theme);
|
|
122
119
|
return _ref6 = sstyled(styles), /*#__PURE__*/React.createElement(STag, _ref6.cn("STag", _objectSpread({}, _assignProps({
|
|
123
|
-
"use:theme":
|
|
120
|
+
"use:theme": getThemeName(use, theme),
|
|
124
121
|
"use:interactive": interactive,
|
|
125
122
|
"colorText": colorText,
|
|
126
123
|
"colorTag": colorTag
|
|
@@ -163,8 +160,7 @@ function Close(props) {
|
|
|
163
160
|
var SClose = Box;
|
|
164
161
|
var styles = props.styles,
|
|
165
162
|
use = props.use,
|
|
166
|
-
theme = props.theme
|
|
167
|
-
size = props.size;
|
|
163
|
+
theme = props.theme;
|
|
168
164
|
return _ref8 = sstyled(styles), /*#__PURE__*/React.createElement(SClose, _ref8.cn("SClose", _objectSpread({}, _assignProps3({
|
|
169
165
|
"use:theme": getThemeName(use, theme),
|
|
170
166
|
"tag": CloseM
|
package/lib/es6/Tag.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../src/Tag.js"],"names":["React","createComponent","Component","sstyled","Root","Box","resolveColor","opacity","addonTextChildren","CloseM","isCustomTheme","use","theme","type","primary","secondary","includes","getThemeName","RootTag","asProps","
|
|
1
|
+
{"version":3,"sources":["../../src/Tag.js"],"names":["React","createComponent","Component","sstyled","Root","Box","resolveColor","opacity","addonTextChildren","CloseM","isCustomTheme","use","theme","type","primary","secondary","includes","getThemeName","RootTag","asProps","STag","Children","styles","color","interactive","disabled","addonLeft","addonRight","colorTag","colorText","Tag","Text","Addon","style","size","props","SText","Close","SClose","SAddon","Circle","SCircle"],"mappings":"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","sourcesContent":["import React from 'react';\nimport createComponent, { Component, sstyled, Root } from '@semcore/core';\nimport { Box } from '@semcore/flex-box';\nimport resolveColor, { opacity } from '@semcore/utils/lib/color';\nimport addonTextChildren from '@semcore/utils/lib/addonTextChildren';\nimport CloseM from '@semcore/icon/Close/m';\n\nimport style from './style/tag.shadow.css';\n\nfunction isCustomTheme(use, theme) {\n const type = {\n primary: ['muted', 'invert', 'warning'],\n secondary: ['muted', 'invert'],\n };\n return type[use] ? !type[use].includes(theme) : true;\n}\n\nfunction getThemeName(use, theme) {\n return isCustomTheme(use, theme) ? 'custom' : `${use}-${theme}`;\n}\n\nclass RootTag extends Component {\n static displayName = 'Tag';\n static style = style;\n static defaultProps = {\n use: 'secondary',\n theme: 'muted',\n size: 'm',\n };\n\n getCloseProps() {\n const { use, theme } = this.asProps;\n return { use, theme };\n }\n\n render() {\n const STag = Root;\n let { Children, styles, theme, use, color, interactive, disabled, addonLeft, addonRight } =\n this.asProps;\n\n if (disabled) {\n interactive = false;\n }\n\n const colorTag = theme ? opacity(resolveColor(theme), 0.5) : '';\n const colorText = color ? resolveColor(color) : resolveColor(theme);\n\n return sstyled(styles)(\n <STag\n render={Box}\n use:theme={getThemeName(use, theme)}\n use:interactive={interactive}\n colorText={colorText}\n colorTag={colorTag}\n >\n {addonLeft ? <Tag.Addon tag={addonLeft} /> : null}\n {addonTextChildren(Children, Tag.Text, Tag.Addon)}\n {addonRight ? <Tag.Addon tag={addonRight} /> : null}\n </STag>,\n );\n }\n}\n\nfunction Text(props) {\n const SText = Root;\n const { styles } = props;\n return sstyled(styles)(<SText render={Box} tag=\"span\" />);\n}\n\nfunction Close(props) {\n const SClose = Root;\n const { styles, use, theme } = props;\n\n return sstyled(styles)(<SClose render={Box} use:theme={getThemeName(use, theme)} tag={CloseM} />);\n}\n\nfunction Addon(props) {\n const SAddon = Root;\n const { styles } = props;\n return sstyled(styles)(<SAddon render={Box} tag=\"span\" />);\n}\n\nfunction Circle(props) {\n const SCircle = Root;\n const { styles } = props;\n return sstyled(styles)(<SCircle render={Box} tag=\"span\" />);\n}\n\nconst Tag = createComponent(RootTag, {\n Text,\n Addon,\n Close,\n Circle,\n});\n\nexport default Tag;\n"],"file":"Tag.js"}
|
package/lib/types/index.d.ts
CHANGED
package/package.json
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@semcore/tag",
|
|
3
3
|
"description": "SEMRush Tag Component",
|
|
4
|
-
"version": "3.6.
|
|
4
|
+
"version": "3.6.4",
|
|
5
5
|
"main": "lib/cjs/index.js",
|
|
6
6
|
"module": "lib/es6/index.js",
|
|
7
7
|
"typings": "lib/types/index.d.ts",
|
|
@@ -23,5 +23,10 @@
|
|
|
23
23
|
},
|
|
24
24
|
"jest": {
|
|
25
25
|
"preset": "@semcore/jest-preset-ui"
|
|
26
|
+
},
|
|
27
|
+
"repository": {
|
|
28
|
+
"type": "git",
|
|
29
|
+
"url": "https://github.com/semrush/intergalactic.git",
|
|
30
|
+
"directory": "semcore/tag"
|
|
26
31
|
}
|
|
27
32
|
}
|
package/src/Tag.js
CHANGED
|
@@ -29,36 +29,26 @@ class RootTag extends Component {
|
|
|
29
29
|
};
|
|
30
30
|
|
|
31
31
|
getCloseProps() {
|
|
32
|
-
const { use, theme
|
|
33
|
-
return { use, theme
|
|
32
|
+
const { use, theme } = this.asProps;
|
|
33
|
+
return { use, theme };
|
|
34
34
|
}
|
|
35
35
|
|
|
36
36
|
render() {
|
|
37
37
|
const STag = Root;
|
|
38
|
-
let {
|
|
39
|
-
|
|
40
|
-
styles,
|
|
41
|
-
theme,
|
|
42
|
-
use,
|
|
43
|
-
color,
|
|
44
|
-
interactive,
|
|
45
|
-
disabled,
|
|
46
|
-
addonLeft,
|
|
47
|
-
addonRight,
|
|
48
|
-
} = this.asProps;
|
|
38
|
+
let { Children, styles, theme, use, color, interactive, disabled, addonLeft, addonRight } =
|
|
39
|
+
this.asProps;
|
|
49
40
|
|
|
50
41
|
if (disabled) {
|
|
51
42
|
interactive = false;
|
|
52
43
|
}
|
|
53
44
|
|
|
54
|
-
const useTheme = getThemeName(use, theme);
|
|
55
45
|
const colorTag = theme ? opacity(resolveColor(theme), 0.5) : '';
|
|
56
46
|
const colorText = color ? resolveColor(color) : resolveColor(theme);
|
|
57
47
|
|
|
58
48
|
return sstyled(styles)(
|
|
59
49
|
<STag
|
|
60
50
|
render={Box}
|
|
61
|
-
use:theme={
|
|
51
|
+
use:theme={getThemeName(use, theme)}
|
|
62
52
|
use:interactive={interactive}
|
|
63
53
|
colorText={colorText}
|
|
64
54
|
colorTag={colorTag}
|
|
@@ -79,7 +69,7 @@ function Text(props) {
|
|
|
79
69
|
|
|
80
70
|
function Close(props) {
|
|
81
71
|
const SClose = Root;
|
|
82
|
-
const { styles, use, theme
|
|
72
|
+
const { styles, use, theme } = props;
|
|
83
73
|
|
|
84
74
|
return sstyled(styles)(<SClose render={Box} use:theme={getThemeName(use, theme)} tag={CloseM} />);
|
|
85
75
|
}
|