@arcblock/ux 2.4.47 → 2.4.49

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.
@@ -30,7 +30,11 @@ function useCopy(_ref) {
30
30
  const [copied, setCopied] = (0, _react.useState)(false);
31
31
  const containerRef = (0, _react.useRef)();
32
32
 
33
- const copy = () => {
33
+ const copy = e => {
34
+ if (e) {
35
+ e.stopPropagation();
36
+ }
37
+
34
38
  (0, _copyToClipboard.default)(content || containerRef.current.textContent);
35
39
  setCopied(true);
36
40
  };
@@ -84,8 +84,8 @@ function ClickToCopy(props) {
84
84
  width
85
85
  } = (0, _useWindowSize.default)();
86
86
 
87
- const onCopy = () => {
88
- copy();
87
+ const onCopy = e => {
88
+ copy(e);
89
89
 
90
90
  if (width < 600) {
91
91
  _Toast.default.success(_copiedTip);
@@ -122,6 +122,6 @@ Sidebar.defaultProps = {
122
122
  dense: false
123
123
  };
124
124
  const gradient = 'linear-gradient(32deg, rgba(144, 255, 230, 0.1), rgba(144, 255, 230, 0))';
125
- const Root = (0, _Theme.styled)('div')(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n display: flex;\n flex-direction: column;\n ul {\n list-style: none;\n margin: 0;\n padding: 0;\n }\n .layout-sidebar-link {\n display: flex;\n flex-direction: column;\n align-items: center;\n padding: 22px 24px;\n color: ", ";\n text-decoration: none;\n\n &:hover,\n &.layout-sidebar-link--active {\n color: ", ";\n background: ", ";\n border-left-color: ", ";\n }\n }\n .layout-sidebar-icon {\n display: inline-block;\n width: 32px;\n height: 32px;\n > img,\n > svg {\n width: 32px;\n height: 32px;\n }\n }\n .layout-sidebar-badge {\n position: relative;\n &:after {\n content: '';\n position: absolute;\n width: 10px;\n height: 10px;\n border-radius: 10px;\n background-color: #fe4e44;\n right: -2px;\n top: 0;\n box-shadow: 0px 1px 4px rgba(0, 0, 0, 0.3), 0px 0px 20px rgba(0, 0, 0, 0.1);\n }\n }\n .layout-sidebar-link-text {\n margin-top: 8px;\n font-size: 12px;\n font-weight: 500;\n text-align: center;\n text-transform: capitalize;\n letter-spacing: normal;\n }\n &.layout-sidebar-dense {\n box-sizing: border-box;\n padding: 20px 0;\n font-weight: bold;\n .layout-sidebar-item {\n padding: 0 16px;\n }\n .layout-sidebar-item + .layout-sidebar-item {\n margin-top: 1px;\n }\n .layout-sidebar-link {\n box-sizing: border-box;\n flex-direction: row;\n align-items: center;\n width: 100%;\n padding: 8px;\n &:hover,\n &.layout-sidebar-link--active {\n color: ", ";\n background: ", ";\n border: 0;\n border-radius: 4px;\n }\n }\n .layout-sidebar-icon {\n display: inline-block;\n width: 20px;\n height: 20px;\n margin-right: 8px;\n > img,\n > svg {\n width: 20px;\n height: 20px;\n }\n }\n .layout-sidebar-badge {\n &:after {\n width: 6px;\n height: 6px;\n border-radius: 6px;\n right: -2px;\n top: 0;\n }\n }\n .layout-sidebar-link-text {\n margin-top: 0;\n font-size: 14px;\n }\n .layout-sidebar-group {\n color: ", ";\n .layout-sidebar-group-title {\n display: inline-block;\n padding: 8px 0 8px 24px;\n font-size: 13px;\n text-transform: uppercase;\n }\n }\n .layout-sidebar-group + .layout-sidebar-group,\n .layout-sidebar-group + .layout-sidebar-item,\n .layout-sidebar-item + .layout-sidebar-group {\n margin-top: 16px;\n }\n }\n"])), props => props.theme.palette.text.secondary, props => props.theme.palette.primary.main, gradient, _colors.teal.A700, props => props.theme.palette.grey[900], props => props.theme.palette.grey[100], props => props.theme.palette.text.hint);
125
+ const Root = (0, _Theme.styled)('div')(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n display: flex;\n flex-direction: column;\n ul {\n list-style: none;\n margin: 0;\n padding: 0;\n }\n .layout-sidebar-link {\n display: flex;\n flex-direction: column;\n align-items: center;\n padding: 22px 24px;\n color: ", ";\n text-decoration: none;\n\n &:hover,\n &.layout-sidebar-link--active {\n color: ", ";\n background: ", ";\n border-left-color: ", ";\n }\n }\n .layout-sidebar-icon {\n display: inline-block;\n width: 32px;\n height: 32px;\n > img,\n > svg {\n width: 32px;\n height: 32px;\n }\n }\n .layout-sidebar-badge {\n position: relative;\n &:after {\n content: '';\n position: absolute;\n width: 10px;\n height: 10px;\n border-radius: 10px;\n background-color: #fe4e44;\n right: -2px;\n top: 0;\n box-shadow: 0px 1px 4px rgba(0, 0, 0, 0.3), 0px 0px 20px rgba(0, 0, 0, 0.1);\n }\n }\n .layout-sidebar-link-text {\n margin-top: 8px;\n font-size: 12px;\n font-weight: 500;\n text-align: center;\n text-transform: capitalize;\n letter-spacing: normal;\n }\n &.layout-sidebar-dense {\n box-sizing: border-box;\n padding: 20px 0;\n font-weight: bold;\n .layout-sidebar-item {\n padding: 0 16px;\n }\n .layout-sidebar-item + .layout-sidebar-item {\n margin-top: 1px;\n }\n .layout-sidebar-link {\n box-sizing: border-box;\n flex-direction: row;\n align-items: center;\n width: 100%;\n padding: 8px;\n &:hover,\n &.layout-sidebar-link--active {\n color: ", ";\n background: ", ";\n border: 0;\n border-radius: 4px;\n }\n }\n .layout-sidebar-icon {\n display: inline-block;\n width: 20px;\n height: 20px;\n margin-right: 8px;\n > img,\n > svg {\n width: 20px;\n height: 20px;\n }\n }\n .layout-sidebar-badge {\n &:after {\n width: 6px;\n height: 6px;\n border-radius: 6px;\n right: -2px;\n top: 0;\n }\n }\n .layout-sidebar-link-text {\n margin-top: 0;\n font-size: 14px;\n line-height: 1;\n }\n .layout-sidebar-group {\n color: ", ";\n .layout-sidebar-group-title {\n display: inline-block;\n padding: 8px 0 8px 24px;\n font-size: 13px;\n text-transform: uppercase;\n }\n }\n .layout-sidebar-group + .layout-sidebar-group,\n .layout-sidebar-group + .layout-sidebar-item,\n .layout-sidebar-item + .layout-sidebar-group {\n margin-top: 16px;\n }\n }\n"])), props => props.theme.palette.text.secondary, props => props.theme.palette.primary.main, gradient, _colors.teal.A700, props => props.theme.palette.grey[900], props => props.theme.palette.grey[100], props => props.theme.palette.text.hint);
126
126
  var _default = Sidebar;
127
127
  exports.default = _default;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@arcblock/ux",
3
- "version": "2.4.47",
3
+ "version": "2.4.49",
4
4
  "description": "Common used react components for arcblock products",
5
5
  "keywords": [
6
6
  "react",
@@ -47,11 +47,11 @@
47
47
  "react": ">=18.1.0",
48
48
  "react-ga": "^2.7.0"
49
49
  },
50
- "gitHead": "55b58c6300a6c7d5e31295b6d27255c41732340b",
50
+ "gitHead": "81c74068803edad783cc931fc1de7a6ad6c85022",
51
51
  "dependencies": {
52
52
  "@arcblock/did-motif": "^1.1.10",
53
- "@arcblock/icons": "^2.4.47",
54
- "@arcblock/react-hooks": "^2.4.47",
53
+ "@arcblock/icons": "^2.4.49",
54
+ "@arcblock/react-hooks": "^2.4.49",
55
55
  "@babel/plugin-syntax-dynamic-import": "^7.8.3",
56
56
  "@emotion/react": "^11.10.4",
57
57
  "@emotion/styled": "^11.10.4",
@@ -15,7 +15,11 @@ const translations = {
15
15
  export default function useCopy({ content, locale = 'en' }) {
16
16
  const [copied, setCopied] = useState(false);
17
17
  const containerRef = useRef();
18
- const copy = () => {
18
+ const copy = (e) => {
19
+ if (e) {
20
+ e.stopPropagation();
21
+ }
22
+
19
23
  Copy(content || containerRef.current.textContent);
20
24
  setCopied(true);
21
25
  };
@@ -18,8 +18,9 @@ export default function ClickToCopy(props) {
18
18
 
19
19
  const { width } = useWindowSize();
20
20
 
21
- const onCopy = () => {
22
- copy();
21
+ const onCopy = (e) => {
22
+ copy(e);
23
+
23
24
  if (width < 600) {
24
25
  Toast.success(_copiedTip);
25
26
  }
@@ -163,6 +163,7 @@ const Root = styled('div')`
163
163
  .layout-sidebar-link-text {
164
164
  margin-top: 0;
165
165
  font-size: 14px;
166
+ line-height: 1;
166
167
  }
167
168
  .layout-sidebar-group {
168
169
  color: ${(props) => props.theme.palette.text.hint};