@semcore/pills 3.5.2 → 3.5.5
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 +18 -0
- package/lib/cjs/Pills.js +24 -20
- package/lib/cjs/Pills.js.map +1 -1
- package/lib/cjs/index.js +5 -1
- package/lib/cjs/style/pills.shadow.css +2 -2
- package/lib/es6/Pills.js +18 -18
- package/lib/es6/Pills.js.map +1 -1
- package/lib/es6/style/pills.shadow.css +2 -2
- package/lib/types/index.d.ts +2 -2
- package/package.json +7 -2
- package/src/{Pills.js → Pills.jsx} +2 -8
- package/src/index.d.ts +2 -2
- package/src/style/pills.shadow.css +2 -2
package/CHANGELOG.md
CHANGED
|
@@ -2,6 +2,24 @@
|
|
|
2
2
|
|
|
3
3
|
CHANGELOG.md standards are inspired by [keepachangelog.com](https://keepachangelog.com/en/1.0.0/).
|
|
4
4
|
|
|
5
|
+
## [3.5.5] - 2022-03-14
|
|
6
|
+
|
|
7
|
+
### Changed
|
|
8
|
+
|
|
9
|
+
- Version patch update due to children dependencies update (`@semcore/utils` [3.31.2 ~> 3.31.2], `@semcore/flex-box` [4.5.0 ~> 4.5.1], `@semcore/neighbor-location` [2.3.4 ~> 2.3.5]).
|
|
10
|
+
|
|
11
|
+
## [3.5.4] - 2022-02-24
|
|
12
|
+
|
|
13
|
+
### Added
|
|
14
|
+
|
|
15
|
+
- Added repository field to package.json file.
|
|
16
|
+
|
|
17
|
+
## [3.5.3] - 2021-12-23
|
|
18
|
+
|
|
19
|
+
### Changed
|
|
20
|
+
|
|
21
|
+
- Changed `line-height` from 1.2 to 1.1 for correct display in all browsers.
|
|
22
|
+
|
|
5
23
|
## [3.5.2] - 2021-8-26
|
|
6
24
|
|
|
7
25
|
### Changed
|
package/lib/cjs/Pills.js
CHANGED
|
@@ -1,9 +1,9 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
|
|
3
|
-
var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard");
|
|
4
|
-
|
|
5
3
|
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
|
|
6
4
|
|
|
5
|
+
var _typeof = require("@babel/runtime/helpers/typeof");
|
|
6
|
+
|
|
7
7
|
Object.defineProperty(exports, "__esModule", {
|
|
8
8
|
value: true
|
|
9
9
|
});
|
|
@@ -35,9 +35,13 @@ var _keyboardFocusEnhance = _interopRequireDefault(require("@semcore/utils/lib/e
|
|
|
35
35
|
|
|
36
36
|
var _addonTextChildren = _interopRequireDefault(require("@semcore/utils/lib/addonTextChildren"));
|
|
37
37
|
|
|
38
|
-
function
|
|
38
|
+
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); }
|
|
39
|
+
|
|
40
|
+
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; }
|
|
41
|
+
|
|
42
|
+
function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
|
|
39
43
|
|
|
40
|
-
function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]
|
|
44
|
+
function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { (0, _defineProperty2["default"])(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
|
|
41
45
|
|
|
42
46
|
function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = (0, _getPrototypeOf2["default"])(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = (0, _getPrototypeOf2["default"])(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return (0, _possibleConstructorReturn2["default"])(this, result); }; }
|
|
43
47
|
|
|
@@ -48,25 +52,25 @@ var style = (
|
|
|
48
52
|
/*__reshadow_css_start__*/
|
|
49
53
|
_core.sstyled.insert(
|
|
50
54
|
/*__inner_css_start__*/
|
|
51
|
-
".
|
|
55
|
+
".___SPills_1gi6g_gg_{display:inline-flex;align-items:center;justify-content:center}.___SPill_1gi6g_gg_{display:inline-flex;align-items:center;justify-content:center;line-height:normal;position:relative;touch-action:manipulation;white-space:nowrap;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;box-sizing:border-box;padding:0;margin:0;box-shadow:none;outline:none;text-decoration:none;-webkit-tap-highlight-color:transparent;overflow:visible;outline:0;text-align:center;vertical-align:middle;font-family:inherit;cursor:pointer;color:#666666;background:#fff;border:1px solid #a6b0b3}.___SPill_1gi6g_gg_::-moz-focus-inner{border:none;padding:0}.___SPill_1gi6g_gg_:active,.___SPill_1gi6g_gg_:focus,.___SPill_1gi6g_gg_:hover{outline:0;text-decoration:none}.___SPill_1gi6g_gg_:hover{background:rgba(166,176,179,.2)}.___SPill_1gi6g_gg_.__selected_1gi6g_gg_{background:rgba(43,148,225,.2);border-color:#2b94e1;z-index:1}.___SPill_1gi6g_gg_.__selected_1gi6g_gg_:enabled:hover{background:rgba(43,148,225,.2)}.___SPill_1gi6g_gg_.__disabled_1gi6g_gg_{cursor:default;pointer-events:none}.___SPill_1gi6g_gg_.__disabled_1gi6g_gg_>*{opacity:0.3}.___SPill_1gi6g_gg_.__keyboardFocused_1gi6g_gg_{box-shadow:0 0 0 3px rgba(43, 148, 225, 0.3)}.___SText_1gi6g_gg_{color:#333333;display:inline-flex;line-height:1.1}.___SAddon_1gi6g_gg_{color:#757575;display:inline-flex;align-items:center;justify-content:center;line-height:1.1}.___SPill_1gi6g_gg_._size_s_1gi6g_gg_{height:18px;min-width:18px;border-radius:2px;font-size:10px}.___SPill_1gi6g_gg_._size_s_1gi6g_gg_ .___SText_1gi6g_gg_{margin-left:4px;margin-right:4px}.___SPill_1gi6g_gg_._size_s_1gi6g_gg_ .___SAddon_1gi6g_gg_:not(:only-child):first-child{margin-left:4px}.___SPill_1gi6g_gg_._size_s_1gi6g_gg_ .___SAddon_1gi6g_gg_:not(:only-child):last-child{margin-right:4px}.___SPill_1gi6g_gg_._size_s_1gi6g_gg_ .___SAddon_1gi6g_gg_:only-child{margin-left:-2px;margin-right:-2px}.___SPill_1gi6g_gg_._size_m_1gi6g_gg_{height:26px;min-width:26px;border-radius:3px;font-size:12px}.___SPill_1gi6g_gg_._size_m_1gi6g_gg_ .___SText_1gi6g_gg_{margin-left:8px;margin-right:8px}.___SPill_1gi6g_gg_._size_m_1gi6g_gg_ .___SAddon_1gi6g_gg_:not(:only-child):first-child{margin-left:8px}.___SPill_1gi6g_gg_._size_m_1gi6g_gg_ .___SAddon_1gi6g_gg_:not(:only-child):last-child{margin-right:8px}.___SPill_1gi6g_gg_._size_m_1gi6g_gg_ .___SAddon_1gi6g_gg_:only-child{margin-left:-4px;margin-right:-4px}.___SPill_1gi6g_gg_._size_l_1gi6g_gg_{height:32px;min-width:32px;border-radius:4px;font-size:14px}.___SPill_1gi6g_gg_._size_l_1gi6g_gg_ .___SText_1gi6g_gg_{margin-left:8px;margin-right:8px}.___SPill_1gi6g_gg_._size_l_1gi6g_gg_ .___SAddon_1gi6g_gg_:not(:only-child):first-child{margin-left:8px}.___SPill_1gi6g_gg_._size_l_1gi6g_gg_ .___SAddon_1gi6g_gg_:not(:only-child):last-child{margin-right:8px}.___SPill_1gi6g_gg_._size_l_1gi6g_gg_ .___SAddon_1gi6g_gg_:only-child{margin-left:-4px;margin-right:-4px}.___SPill_1gi6g_gg_._size_xl_1gi6g_gg_{height:42px;min-width:42px;border-radius:5px;font-size:16px}.___SPill_1gi6g_gg_._size_xl_1gi6g_gg_ .___SText_1gi6g_gg_{margin-left:12px;margin-right:12px}.___SPill_1gi6g_gg_._size_xl_1gi6g_gg_ .___SAddon_1gi6g_gg_:not(:only-child):first-child{margin-left:12px}.___SPill_1gi6g_gg_._size_xl_1gi6g_gg_ .___SAddon_1gi6g_gg_:not(:only-child):last-child{margin-right:12px}.___SPill_1gi6g_gg_._size_xl_1gi6g_gg_ .___SAddon_1gi6g_gg_:only-child{margin-left:-6px;margin-right:-6px}.___SPill_1gi6g_gg_._neighborLocation_right_1gi6g_gg_{border-top-right-radius:0;border-bottom-right-radius:0}.___SPill_1gi6g_gg_._neighborLocation_both_1gi6g_gg_{border-radius:0;margin-left:-1px}.___SPill_1gi6g_gg_._neighborLocation_left_1gi6g_gg_{border-top-left-radius:0;border-bottom-left-radius:0;margin-left:-1px}"
|
|
52
56
|
/*__inner_css_end__*/
|
|
53
|
-
, "
|
|
57
|
+
, "1y1hdgc_gg_")
|
|
54
58
|
/*__reshadow_css_end__*/
|
|
55
59
|
, {
|
|
56
|
-
"
|
|
57
|
-
"
|
|
58
|
-
"_selected": "
|
|
59
|
-
"_disabled": "
|
|
60
|
-
"_keyboardFocused": "
|
|
61
|
-
"__SText": "
|
|
62
|
-
"__SAddon": "
|
|
63
|
-
"_size_s": "
|
|
64
|
-
"_size_m": "
|
|
65
|
-
"_size_l": "
|
|
66
|
-
"_size_xl": "
|
|
67
|
-
"_neighborLocation_right": "
|
|
68
|
-
"_neighborLocation_both": "
|
|
69
|
-
"_neighborLocation_left": "
|
|
60
|
+
"__SPills": "___SPills_1gi6g_gg_",
|
|
61
|
+
"__SPill": "___SPill_1gi6g_gg_",
|
|
62
|
+
"_selected": "__selected_1gi6g_gg_",
|
|
63
|
+
"_disabled": "__disabled_1gi6g_gg_",
|
|
64
|
+
"_keyboardFocused": "__keyboardFocused_1gi6g_gg_",
|
|
65
|
+
"__SText": "___SText_1gi6g_gg_",
|
|
66
|
+
"__SAddon": "___SAddon_1gi6g_gg_",
|
|
67
|
+
"_size_s": "_size_s_1gi6g_gg_",
|
|
68
|
+
"_size_m": "_size_m_1gi6g_gg_",
|
|
69
|
+
"_size_l": "_size_l_1gi6g_gg_",
|
|
70
|
+
"_size_xl": "_size_xl_1gi6g_gg_",
|
|
71
|
+
"_neighborLocation_right": "_neighborLocation_right_1gi6g_gg_",
|
|
72
|
+
"_neighborLocation_both": "_neighborLocation_both_1gi6g_gg_",
|
|
73
|
+
"_neighborLocation_left": "_neighborLocation_left_1gi6g_gg_"
|
|
70
74
|
});
|
|
71
75
|
|
|
72
76
|
var RootPills = /*#__PURE__*/function (_Component) {
|
package/lib/cjs/Pills.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../src/Pills.
|
|
1
|
+
{"version":3,"sources":["../../src/Pills.jsx"],"names":["RootPills","value","e","handlers","props","asProps","size","disabled","selected","onClick","bindHandlerClick","SPills","Box","Children","styles","controlsLength","Component","style","defaultValue","Pill","SPill","addonLeft","addonRight","Pills","Item","Text","Addon","enhance","SText","SAddon"],"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 NeighborLocation, { neighborLocationEnhance } from '@semcore/neighbor-location';\nimport keyboardFocusEnhance from '@semcore/utils/lib/enhances/keyboardFocusEnhance';\nimport addonTextChildren from '@semcore/utils/lib/addonTextChildren';\n\nimport style from './style/pills.shadow.css';\n\nclass RootPills extends Component {\n static displayName = 'Pills';\n static style = style;\n static defaultProps = {\n size: 'm',\n defaultValue: null,\n };\n\n uncontrolledProps() {\n return {\n value: null,\n };\n }\n\n bindHandlerClick = (value) => (e) => {\n this.handlers.value(value, e);\n };\n\n getItemProps(props) {\n const { value, size, disabled } = this.asProps;\n return {\n size,\n disabled,\n selected: value === props.value,\n onClick: this.bindHandlerClick(props.value),\n };\n }\n\n render() {\n const SPills = Root;\n const { Children, styles, controlsLength } = this.asProps;\n\n return sstyled(styles)(\n <SPills render={Box}>\n <NeighborLocation controlsLength={controlsLength}>\n <Children />\n </NeighborLocation>\n </SPills>,\n );\n }\n}\n\nfunction Pill(props) {\n const SPill = Root;\n const { Children, styles, addonLeft, addonRight } = props;\n\n return sstyled(styles)(\n <SPill render={Box} type=\"button\" tag=\"button\">\n {addonLeft ? <Pills.Item.Addon tag={addonLeft} /> : null}\n {addonTextChildren(Children, Pills.Item.Text, Pills.Item.Addon)}\n {addonRight ? <Pills.Item.Addon tag={addonRight} /> : null}\n </SPill>,\n );\n}\n\nPill.enhance = [keyboardFocusEnhance(), neighborLocationEnhance()];\n\nfunction Text(props) {\n const SText = Root;\n return sstyled(props.styles)(<SText render={Box} tag=\"span\" />);\n}\n\nfunction Addon(props) {\n const SAddon = Root;\n return sstyled(props.styles)(<SAddon render={Box} tag=\"span\" />);\n}\n\nconst Pills = createComponent(RootPills, {\n Item: [Pill, { Text, Addon }],\n});\n\nexport default Pills;\n"],"file":"Pills.js"}
|
package/lib/cjs/index.js
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
|
|
3
|
-
var
|
|
3
|
+
var _typeof = require("@babel/runtime/helpers/typeof");
|
|
4
4
|
|
|
5
5
|
Object.defineProperty(exports, "__esModule", {
|
|
6
6
|
value: true
|
|
@@ -26,4 +26,8 @@ Object.keys(_Pills).forEach(function (key) {
|
|
|
26
26
|
}
|
|
27
27
|
});
|
|
28
28
|
});
|
|
29
|
+
|
|
30
|
+
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); }
|
|
31
|
+
|
|
32
|
+
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; }
|
|
29
33
|
//# sourceMappingURL=index.js.map
|
|
@@ -75,7 +75,7 @@ SPill[keyboardFocused] {
|
|
|
75
75
|
SText {
|
|
76
76
|
color: var(--gray20);
|
|
77
77
|
display: inline-flex;
|
|
78
|
-
line-height: 1.
|
|
78
|
+
line-height: 1.1;
|
|
79
79
|
}
|
|
80
80
|
|
|
81
81
|
SAddon {
|
|
@@ -83,7 +83,7 @@ SAddon {
|
|
|
83
83
|
display: inline-flex;
|
|
84
84
|
align-items: center;
|
|
85
85
|
justify-content: center;
|
|
86
|
-
line-height: 1.
|
|
86
|
+
line-height: 1.1;
|
|
87
87
|
}
|
|
88
88
|
|
|
89
89
|
SPill[size='s'] {
|
package/lib/es6/Pills.js
CHANGED
|
@@ -11,9 +11,9 @@ import { assignProps as _assignProps3 } from "@semcore/core";
|
|
|
11
11
|
import { assignProps as _assignProps2 } from "@semcore/core";
|
|
12
12
|
import { assignProps as _assignProps } from "@semcore/core";
|
|
13
13
|
|
|
14
|
-
function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object);
|
|
14
|
+
function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
|
|
15
15
|
|
|
16
|
-
function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]
|
|
16
|
+
function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
|
|
17
17
|
|
|
18
18
|
function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
|
|
19
19
|
|
|
@@ -31,25 +31,25 @@ var style = (
|
|
|
31
31
|
/*__reshadow_css_start__*/
|
|
32
32
|
_sstyled.insert(
|
|
33
33
|
/*__inner_css_start__*/
|
|
34
|
-
".
|
|
34
|
+
".___SPills_1gi6g_gg_{display:inline-flex;align-items:center;justify-content:center}.___SPill_1gi6g_gg_{display:inline-flex;align-items:center;justify-content:center;line-height:normal;position:relative;touch-action:manipulation;white-space:nowrap;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;box-sizing:border-box;padding:0;margin:0;box-shadow:none;outline:none;text-decoration:none;-webkit-tap-highlight-color:transparent;overflow:visible;outline:0;text-align:center;vertical-align:middle;font-family:inherit;cursor:pointer;color:#666666;background:#fff;border:1px solid #a6b0b3}.___SPill_1gi6g_gg_::-moz-focus-inner{border:none;padding:0}.___SPill_1gi6g_gg_:active,.___SPill_1gi6g_gg_:focus,.___SPill_1gi6g_gg_:hover{outline:0;text-decoration:none}.___SPill_1gi6g_gg_:hover{background:rgba(166,176,179,.2)}.___SPill_1gi6g_gg_.__selected_1gi6g_gg_{background:rgba(43,148,225,.2);border-color:#2b94e1;z-index:1}.___SPill_1gi6g_gg_.__selected_1gi6g_gg_:enabled:hover{background:rgba(43,148,225,.2)}.___SPill_1gi6g_gg_.__disabled_1gi6g_gg_{cursor:default;pointer-events:none}.___SPill_1gi6g_gg_.__disabled_1gi6g_gg_>*{opacity:0.3}.___SPill_1gi6g_gg_.__keyboardFocused_1gi6g_gg_{box-shadow:0 0 0 3px rgba(43, 148, 225, 0.3)}.___SText_1gi6g_gg_{color:#333333;display:inline-flex;line-height:1.1}.___SAddon_1gi6g_gg_{color:#757575;display:inline-flex;align-items:center;justify-content:center;line-height:1.1}.___SPill_1gi6g_gg_._size_s_1gi6g_gg_{height:18px;min-width:18px;border-radius:2px;font-size:10px}.___SPill_1gi6g_gg_._size_s_1gi6g_gg_ .___SText_1gi6g_gg_{margin-left:4px;margin-right:4px}.___SPill_1gi6g_gg_._size_s_1gi6g_gg_ .___SAddon_1gi6g_gg_:not(:only-child):first-child{margin-left:4px}.___SPill_1gi6g_gg_._size_s_1gi6g_gg_ .___SAddon_1gi6g_gg_:not(:only-child):last-child{margin-right:4px}.___SPill_1gi6g_gg_._size_s_1gi6g_gg_ .___SAddon_1gi6g_gg_:only-child{margin-left:-2px;margin-right:-2px}.___SPill_1gi6g_gg_._size_m_1gi6g_gg_{height:26px;min-width:26px;border-radius:3px;font-size:12px}.___SPill_1gi6g_gg_._size_m_1gi6g_gg_ .___SText_1gi6g_gg_{margin-left:8px;margin-right:8px}.___SPill_1gi6g_gg_._size_m_1gi6g_gg_ .___SAddon_1gi6g_gg_:not(:only-child):first-child{margin-left:8px}.___SPill_1gi6g_gg_._size_m_1gi6g_gg_ .___SAddon_1gi6g_gg_:not(:only-child):last-child{margin-right:8px}.___SPill_1gi6g_gg_._size_m_1gi6g_gg_ .___SAddon_1gi6g_gg_:only-child{margin-left:-4px;margin-right:-4px}.___SPill_1gi6g_gg_._size_l_1gi6g_gg_{height:32px;min-width:32px;border-radius:4px;font-size:14px}.___SPill_1gi6g_gg_._size_l_1gi6g_gg_ .___SText_1gi6g_gg_{margin-left:8px;margin-right:8px}.___SPill_1gi6g_gg_._size_l_1gi6g_gg_ .___SAddon_1gi6g_gg_:not(:only-child):first-child{margin-left:8px}.___SPill_1gi6g_gg_._size_l_1gi6g_gg_ .___SAddon_1gi6g_gg_:not(:only-child):last-child{margin-right:8px}.___SPill_1gi6g_gg_._size_l_1gi6g_gg_ .___SAddon_1gi6g_gg_:only-child{margin-left:-4px;margin-right:-4px}.___SPill_1gi6g_gg_._size_xl_1gi6g_gg_{height:42px;min-width:42px;border-radius:5px;font-size:16px}.___SPill_1gi6g_gg_._size_xl_1gi6g_gg_ .___SText_1gi6g_gg_{margin-left:12px;margin-right:12px}.___SPill_1gi6g_gg_._size_xl_1gi6g_gg_ .___SAddon_1gi6g_gg_:not(:only-child):first-child{margin-left:12px}.___SPill_1gi6g_gg_._size_xl_1gi6g_gg_ .___SAddon_1gi6g_gg_:not(:only-child):last-child{margin-right:12px}.___SPill_1gi6g_gg_._size_xl_1gi6g_gg_ .___SAddon_1gi6g_gg_:only-child{margin-left:-6px;margin-right:-6px}.___SPill_1gi6g_gg_._neighborLocation_right_1gi6g_gg_{border-top-right-radius:0;border-bottom-right-radius:0}.___SPill_1gi6g_gg_._neighborLocation_both_1gi6g_gg_{border-radius:0;margin-left:-1px}.___SPill_1gi6g_gg_._neighborLocation_left_1gi6g_gg_{border-top-left-radius:0;border-bottom-left-radius:0;margin-left:-1px}"
|
|
35
35
|
/*__inner_css_end__*/
|
|
36
|
-
, "
|
|
36
|
+
, "1y1hdgc_gg_")
|
|
37
37
|
/*__reshadow_css_end__*/
|
|
38
38
|
, {
|
|
39
|
-
"
|
|
40
|
-
"
|
|
41
|
-
"_selected": "
|
|
42
|
-
"_disabled": "
|
|
43
|
-
"_keyboardFocused": "
|
|
44
|
-
"__SText": "
|
|
45
|
-
"__SAddon": "
|
|
46
|
-
"_size_s": "
|
|
47
|
-
"_size_m": "
|
|
48
|
-
"_size_l": "
|
|
49
|
-
"_size_xl": "
|
|
50
|
-
"_neighborLocation_right": "
|
|
51
|
-
"_neighborLocation_both": "
|
|
52
|
-
"_neighborLocation_left": "
|
|
39
|
+
"__SPills": "___SPills_1gi6g_gg_",
|
|
40
|
+
"__SPill": "___SPill_1gi6g_gg_",
|
|
41
|
+
"_selected": "__selected_1gi6g_gg_",
|
|
42
|
+
"_disabled": "__disabled_1gi6g_gg_",
|
|
43
|
+
"_keyboardFocused": "__keyboardFocused_1gi6g_gg_",
|
|
44
|
+
"__SText": "___SText_1gi6g_gg_",
|
|
45
|
+
"__SAddon": "___SAddon_1gi6g_gg_",
|
|
46
|
+
"_size_s": "_size_s_1gi6g_gg_",
|
|
47
|
+
"_size_m": "_size_m_1gi6g_gg_",
|
|
48
|
+
"_size_l": "_size_l_1gi6g_gg_",
|
|
49
|
+
"_size_xl": "_size_xl_1gi6g_gg_",
|
|
50
|
+
"_neighborLocation_right": "_neighborLocation_right_1gi6g_gg_",
|
|
51
|
+
"_neighborLocation_both": "_neighborLocation_both_1gi6g_gg_",
|
|
52
|
+
"_neighborLocation_left": "_neighborLocation_left_1gi6g_gg_"
|
|
53
53
|
});
|
|
54
54
|
|
|
55
55
|
var RootPills = /*#__PURE__*/function (_Component) {
|
package/lib/es6/Pills.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../src/Pills.
|
|
1
|
+
{"version":3,"sources":["../../src/Pills.jsx"],"names":["React","createComponent","Component","sstyled","Root","Box","NeighborLocation","neighborLocationEnhance","keyboardFocusEnhance","addonTextChildren","RootPills","value","e","handlers","props","asProps","size","disabled","selected","onClick","bindHandlerClick","SPills","Children","styles","controlsLength","style","defaultValue","Pill","SPill","addonLeft","addonRight","Pills","Item","Text","Addon","enhance","SText","SAddon"],"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 NeighborLocation, { neighborLocationEnhance } from '@semcore/neighbor-location';\nimport keyboardFocusEnhance from '@semcore/utils/lib/enhances/keyboardFocusEnhance';\nimport addonTextChildren from '@semcore/utils/lib/addonTextChildren';\n\nimport style from './style/pills.shadow.css';\n\nclass RootPills extends Component {\n static displayName = 'Pills';\n static style = style;\n static defaultProps = {\n size: 'm',\n defaultValue: null,\n };\n\n uncontrolledProps() {\n return {\n value: null,\n };\n }\n\n bindHandlerClick = (value) => (e) => {\n this.handlers.value(value, e);\n };\n\n getItemProps(props) {\n const { value, size, disabled } = this.asProps;\n return {\n size,\n disabled,\n selected: value === props.value,\n onClick: this.bindHandlerClick(props.value),\n };\n }\n\n render() {\n const SPills = Root;\n const { Children, styles, controlsLength } = this.asProps;\n\n return sstyled(styles)(\n <SPills render={Box}>\n <NeighborLocation controlsLength={controlsLength}>\n <Children />\n </NeighborLocation>\n </SPills>,\n );\n }\n}\n\nfunction Pill(props) {\n const SPill = Root;\n const { Children, styles, addonLeft, addonRight } = props;\n\n return sstyled(styles)(\n <SPill render={Box} type=\"button\" tag=\"button\">\n {addonLeft ? <Pills.Item.Addon tag={addonLeft} /> : null}\n {addonTextChildren(Children, Pills.Item.Text, Pills.Item.Addon)}\n {addonRight ? <Pills.Item.Addon tag={addonRight} /> : null}\n </SPill>,\n );\n}\n\nPill.enhance = [keyboardFocusEnhance(), neighborLocationEnhance()];\n\nfunction Text(props) {\n const SText = Root;\n return sstyled(props.styles)(<SText render={Box} tag=\"span\" />);\n}\n\nfunction Addon(props) {\n const SAddon = Root;\n return sstyled(props.styles)(<SAddon render={Box} tag=\"span\" />);\n}\n\nconst Pills = createComponent(RootPills, {\n Item: [Pill, { Text, Addon }],\n});\n\nexport default Pills;\n"],"file":"Pills.js"}
|
|
@@ -75,7 +75,7 @@ SPill[keyboardFocused] {
|
|
|
75
75
|
SText {
|
|
76
76
|
color: var(--gray20);
|
|
77
77
|
display: inline-flex;
|
|
78
|
-
line-height: 1.
|
|
78
|
+
line-height: 1.1;
|
|
79
79
|
}
|
|
80
80
|
|
|
81
81
|
SAddon {
|
|
@@ -83,7 +83,7 @@ SAddon {
|
|
|
83
83
|
display: inline-flex;
|
|
84
84
|
align-items: center;
|
|
85
85
|
justify-content: center;
|
|
86
|
-
line-height: 1.
|
|
86
|
+
line-height: 1.1;
|
|
87
87
|
}
|
|
88
88
|
|
|
89
89
|
SPill[size='s'] {
|
package/lib/types/index.d.ts
CHANGED
|
@@ -42,8 +42,8 @@ declare const Pills: (<T, V extends PillsValue = PillsValue>(
|
|
|
42
42
|
props: CProps<IPillsProps<V> & T, IPillsContext, IPopperHandlers>,
|
|
43
43
|
) => ReturnEl) & {
|
|
44
44
|
Item: (<T>(props: CProps<IPillProps & T, {}, IPopperHandlers>) => ReturnEl) & {
|
|
45
|
-
Text: typeof Box
|
|
46
|
-
Addon: typeof Box
|
|
45
|
+
Text: typeof Box;
|
|
46
|
+
Addon: typeof Box;
|
|
47
47
|
};
|
|
48
48
|
};
|
|
49
49
|
|
package/package.json
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@semcore/pills",
|
|
3
3
|
"description": "SEMRush Pills Component",
|
|
4
|
-
"version": "3.5.
|
|
4
|
+
"version": "3.5.5",
|
|
5
5
|
"main": "lib/cjs/index.js",
|
|
6
6
|
"module": "lib/es6/index.js",
|
|
7
7
|
"typings": "lib/types/index.d.ts",
|
|
@@ -22,6 +22,11 @@
|
|
|
22
22
|
"react": "16.8 - 17"
|
|
23
23
|
},
|
|
24
24
|
"jest": {
|
|
25
|
-
"preset": "jest-preset-ui"
|
|
25
|
+
"preset": "@semcore/jest-preset-ui"
|
|
26
|
+
},
|
|
27
|
+
"repository": {
|
|
28
|
+
"type": "git",
|
|
29
|
+
"url": "https://github.com/semrush/intergalactic.git",
|
|
30
|
+
"directory": "semcore/pills"
|
|
26
31
|
}
|
|
27
32
|
}
|
|
@@ -1,13 +1,7 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
|
-
import createComponent, {
|
|
3
|
-
Component,
|
|
4
|
-
sstyled,
|
|
5
|
-
Root,
|
|
6
|
-
} from '@semcore/core';
|
|
2
|
+
import createComponent, { Component, sstyled, Root } from '@semcore/core';
|
|
7
3
|
import { Box } from '@semcore/flex-box';
|
|
8
|
-
import NeighborLocation, {
|
|
9
|
-
neighborLocationEnhance,
|
|
10
|
-
} from '@semcore/neighbor-location';
|
|
4
|
+
import NeighborLocation, { neighborLocationEnhance } from '@semcore/neighbor-location';
|
|
11
5
|
import keyboardFocusEnhance from '@semcore/utils/lib/enhances/keyboardFocusEnhance';
|
|
12
6
|
import addonTextChildren from '@semcore/utils/lib/addonTextChildren';
|
|
13
7
|
|
package/src/index.d.ts
CHANGED
|
@@ -42,8 +42,8 @@ declare const Pills: (<T, V extends PillsValue = PillsValue>(
|
|
|
42
42
|
props: CProps<IPillsProps<V> & T, IPillsContext, IPopperHandlers>,
|
|
43
43
|
) => ReturnEl) & {
|
|
44
44
|
Item: (<T>(props: CProps<IPillProps & T, {}, IPopperHandlers>) => ReturnEl) & {
|
|
45
|
-
Text: typeof Box
|
|
46
|
-
Addon: typeof Box
|
|
45
|
+
Text: typeof Box;
|
|
46
|
+
Addon: typeof Box;
|
|
47
47
|
};
|
|
48
48
|
};
|
|
49
49
|
|
|
@@ -75,7 +75,7 @@ SPill[keyboardFocused] {
|
|
|
75
75
|
SText {
|
|
76
76
|
color: var(--gray20);
|
|
77
77
|
display: inline-flex;
|
|
78
|
-
line-height: 1.
|
|
78
|
+
line-height: 1.1;
|
|
79
79
|
}
|
|
80
80
|
|
|
81
81
|
SAddon {
|
|
@@ -83,7 +83,7 @@ SAddon {
|
|
|
83
83
|
display: inline-flex;
|
|
84
84
|
align-items: center;
|
|
85
85
|
justify-content: center;
|
|
86
|
-
line-height: 1.
|
|
86
|
+
line-height: 1.1;
|
|
87
87
|
}
|
|
88
88
|
|
|
89
89
|
SPill[size='s'] {
|