@semcore/card 4.2.2 → 4.2.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 CHANGED
@@ -2,11 +2,17 @@
2
2
 
3
3
  CHANGELOG.md standards are inspired by [keepachangelog.com](https://keepachangelog.com/en/1.0.0/).
4
4
 
5
- ## [4.2.2] - 2022-12-16
5
+ ## [4.2.4] - 2022-12-23
6
+
7
+ ### Fixed
8
+
9
+ - Hint tooltip is centered vertically.
10
+
11
+ ## [4.2.3] - 2022-12-19
6
12
 
7
13
  ### Changed
8
14
 
9
- - Version patch update due to children dependencies update (`@semcore/utils` [3.43.0 ~> 3.44.0]).
15
+ - Version patch update due to children dependencies update (`@semcore/utils` [3.44.0 ~> 3.44.1]).
10
16
 
11
17
  ## [4.2.1] - 2022-12-13
12
18
 
package/lib/cjs/Card.js CHANGED
@@ -52,18 +52,19 @@ var style = (
52
52
  /*__reshadow_css_start__*/
53
53
  _core.sstyled.insert(
54
54
  /*__inner_css_start__*/
55
- ".___SCard_hxcqy_gg_{box-sizing:border-box;background:var(--intergalactic-bg-primary-neutral,#fff);padding:0;border:none;border-radius:var(--intergalactic-rounded-medium,6px);box-shadow:var(--intergalactic-box-shadow-card,0 0 1px 0 rgba(25,27,35,.16),0 1px 2px 0 rgba(25,27,35,.12));font-family:var(--intergalactic-base,Inter),sans-serif}.___STitle_hxcqy_gg_{color:var(--intergalactic-text-primary,#191b23);font-size:var(--intergalactic-fs-300,16px);line-height:var(--intergalactic-lh-300,150%);font-weight:var(--intergalactic-bold,700);margin-right:var(--intergalactic-spacing-1x,4px)}.___SIcon_hxcqy_gg_{color:var(--intergalactic-icon-secondary-neutral,#a9abb6);cursor:help;margin-right:var(--intergalactic-spacing-1x,4px)}.___STooltip_hxcqy_gg_{display:inline-flex;vertical-align:middle}.___SDescription_hxcqy_gg_{margin-bottom:0;margin-top:var(--intergalactic-spacing-2x,8px);font-size:var(--intergalactic-fs-200,14px);color:var(--intergalactic-text-secondary,#6c6e79)}.___SHeader_hxcqy_gg_{padding-top:var(--intergalactic-spacing-2x,8px);padding-bottom:var(--intergalactic-spacing-2x,8px);padding-left:var(--intergalactic-spacing-5x,20px);padding-right:var(--intergalactic-spacing-5x,20px);box-shadow:inset 0 -1px 0 var(--intergalactic-border-secondary,#e0e1e9)}.___SBody_hxcqy_gg_{color:var(--intergalactic-text-primary,#191b23);padding-bottom:var(--intergalactic-spacing-5x,20px);padding-left:var(--intergalactic-spacing-5x,20px);padding-right:var(--intergalactic-spacing-5x,20px);padding-top:var(--intergalactic-spacing-5x,20px)}"
55
+ ".___SCard_1hsgg_gg_{box-sizing:border-box;background:var(--intergalactic-bg-primary-neutral,#fff);padding:0;border:none;border-radius:var(--intergalactic-rounded-medium,6px);box-shadow:var(--intergalactic-box-shadow-card,0 0 1px 0 rgba(25,27,35,.16),0 1px 2px 0 rgba(25,27,35,.12));font-family:var(--intergalactic-base,Inter),sans-serif}.___SWrapper_1hsgg_gg_{display:inline-flex;align-items:center}.___STitle_1hsgg_gg_{color:var(--intergalactic-text-primary,#191b23);font-size:var(--intergalactic-fs-300,16px);line-height:var(--intergalactic-lh-300,150%);font-weight:var(--intergalactic-bold,700);margin-right:var(--intergalactic-spacing-1x,4px)}.___SIcon_1hsgg_gg_{color:var(--intergalactic-icon-secondary-neutral,#a9abb6);cursor:help;margin-right:var(--intergalactic-spacing-1x,4px)}.___STooltip_1hsgg_gg_{display:inline-flex;vertical-align:middle}.___SDescription_1hsgg_gg_{margin-bottom:0;margin-top:var(--intergalactic-spacing-2x,8px);font-size:var(--intergalactic-fs-200,14px);color:var(--intergalactic-text-secondary,#6c6e79)}.___SHeader_1hsgg_gg_{padding-top:var(--intergalactic-spacing-2x,8px);padding-bottom:var(--intergalactic-spacing-2x,8px);padding-left:var(--intergalactic-spacing-5x,20px);padding-right:var(--intergalactic-spacing-5x,20px);box-shadow:inset 0 -1px 0 var(--intergalactic-border-secondary,#e0e1e9)}.___SBody_1hsgg_gg_{color:var(--intergalactic-text-primary,#191b23);padding-bottom:var(--intergalactic-spacing-5x,20px);padding-left:var(--intergalactic-spacing-5x,20px);padding-right:var(--intergalactic-spacing-5x,20px);padding-top:var(--intergalactic-spacing-5x,20px)}"
56
56
  /*__inner_css_end__*/
57
- , "hxcqy_gg_")
57
+ , "1hsgg_gg_")
58
58
  /*__reshadow_css_end__*/
59
59
  , {
60
- "__SCard": "___SCard_hxcqy_gg_",
61
- "__STitle": "___STitle_hxcqy_gg_",
62
- "__SIcon": "___SIcon_hxcqy_gg_",
63
- "__STooltip": "___STooltip_hxcqy_gg_",
64
- "__SDescription": "___SDescription_hxcqy_gg_",
65
- "__SHeader": "___SHeader_hxcqy_gg_",
66
- "__SBody": "___SBody_hxcqy_gg_"
60
+ "__SCard": "___SCard_1hsgg_gg_",
61
+ "__SWrapper": "___SWrapper_1hsgg_gg_",
62
+ "__STitle": "___STitle_1hsgg_gg_",
63
+ "__SIcon": "___SIcon_1hsgg_gg_",
64
+ "__STooltip": "___STooltip_1hsgg_gg_",
65
+ "__SDescription": "___SDescription_1hsgg_gg_",
66
+ "__SHeader": "___SHeader_1hsgg_gg_",
67
+ "__SBody": "___SBody_1hsgg_gg_"
67
68
  });
68
69
 
69
70
  var CardRoot = /*#__PURE__*/function (_Component) {
@@ -102,10 +103,11 @@ function Title(props) {
102
103
 
103
104
  var styles = props.styles,
104
105
  hint = props.hint;
106
+ var SWrapper = 'div';
105
107
  var STitle = _typography.Text;
106
108
  var SIcon = _m["default"];
107
109
  var STooltip = _tooltip["default"];
108
- return _ref7 = (0, _core.sstyled)(styles), /*#__PURE__*/_react["default"].createElement(_react["default"].Fragment, null, /*#__PURE__*/_react["default"].createElement(STitle, _ref7.cn("STitle", _objectSpread({}, (0, _core.assignProps)({}, _ref2)))), hint && /*#__PURE__*/_react["default"].createElement(STooltip, _ref7.cn("STooltip", {
110
+ return _ref7 = (0, _core.sstyled)(styles), /*#__PURE__*/_react["default"].createElement(SWrapper, _ref7.cn("SWrapper", {}), /*#__PURE__*/_react["default"].createElement(STitle, _ref7.cn("STitle", _objectSpread({}, (0, _core.assignProps)({}, _ref2)))), hint && /*#__PURE__*/_react["default"].createElement(STooltip, _ref7.cn("STooltip", {
109
111
  "title": hint
110
112
  }), /*#__PURE__*/_react["default"].createElement(SIcon, _ref7.cn("SIcon", {}))));
111
113
  }
@@ -1 +1 @@
1
- {"version":3,"file":"Card.js","names":["CardRoot","SCard","Box","asProps","Children","styles","advanceMode","isAdvanceMode","Card","Header","displayName","Body","sstyled","Component","style","Title","props","hint","STitle","Text","SIcon","InfoM","STooltip","Tooltip","Description","SDescription","SHeader","SBody","createComponent"],"sources":["../../src/Card.jsx"],"sourcesContent":["import React from 'react';\nimport createComponent, { Component, sstyled, Root } from '@semcore/core';\nimport { Box } from '@semcore/flex-box';\nimport { Text } from '@semcore/typography';\nimport Tooltip from '@semcore/tooltip';\nimport InfoM from '@semcore/icon/Info/m';\n\nimport style from './style/card.shadow.css';\nimport { isAdvanceMode } from '@semcore/utils/lib/findComponent';\n\nclass CardRoot extends Component {\n static displayName = 'Card';\n\n static style = style;\n\n render() {\n const SCard = Root;\n const { Children, styles } = this.asProps;\n\n const advanceMode = isAdvanceMode(Children, [Card.Header.displayName, Card.Body.displayName]);\n\n return sstyled(styles)(\n <SCard render={Box}>\n {advanceMode ? (\n <Children />\n ) : (\n <Card.Body>\n <Children />\n </Card.Body>\n )}\n </SCard>,\n );\n }\n}\n\nfunction Title(props) {\n const { styles, hint } = props;\n const STitle = Root;\n const SIcon = InfoM;\n const STooltip = Tooltip;\n return sstyled(styles)(\n <>\n <STitle render={Text} />\n {hint && (\n <STooltip title={hint}>\n <SIcon />\n </STooltip>\n )}\n </>,\n );\n}\n\nfunction Description(props) {\n const { styles } = props;\n const SDescription = Root;\n return sstyled(styles)(<SDescription render={Text} tag=\"p\" />);\n}\n\nfunction Header(props) {\n const { styles } = props;\n const SHeader = Root;\n return sstyled(styles)(<SHeader render={Box} {...props} />);\n}\n\nfunction Body(props) {\n const { styles } = props;\n const SBody = Root;\n return sstyled(styles)(<SBody render={Box} {...props} />);\n}\n\nconst Card = createComponent(CardRoot, {\n Title,\n Description,\n Header,\n Body,\n});\n\nexport default Card;\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;AACA;;AADA;;AAEA;;AACA;;AACA;;AACA;;AAGA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;IAEMA,Q;;;;;;;;;;;;WAKJ,kBAAS;MAAA;MAAA;;MACP,IAAMC,KAAK,GAMMC,YANjB;MACA,oBAA6B,KAAKC,OAAlC;MAAA,IAAQC,QAAR,iBAAQA,QAAR;MAAA,IAAkBC,MAAlB,iBAAkBA,MAAlB;MAEA,IAAMC,WAAW,GAAG,IAAAC,4BAAA,EAAcH,QAAd,EAAwB,CAACI,IAAI,CAACC,MAAL,CAAYC,WAAb,EAA0BF,IAAI,CAACG,IAAL,CAAUD,WAApC,CAAxB,CAApB;MAEA,eAAO,IAAAE,aAAA,EAAQP,MAAR,CAAP,eACE,gCAAC,KAAD,0EACGC,WAAW,gBACV,gCAAC,QAAD,2BADU,gBAGV,gCAAC,IAAD,CAAM,IAAN,qBACE,gCAAC,QAAD,2BADF,CAJJ,CADF;IAWD;;;EAtBoBO,e;;iCAAjBb,Q,iBACiB,M;iCADjBA,Q,WAGWc,K;;AAsBjB,SAASC,KAAT,CAAeC,KAAf,EAAsB;EAAA;EAAA;;EACpB,IAAQX,MAAR,GAAyBW,KAAzB,CAAQX,MAAR;EAAA,IAAgBY,IAAhB,GAAyBD,KAAzB,CAAgBC,IAAhB;EACA,IAAMC,MAAM,GAKQC,gBALpB;EACA,IAAMC,KAAK,GAAGC,aAAd;EACA,IAAMC,QAAQ,GAAGC,mBAAjB;EACA,eAAO,IAAAX,aAAA,EAAQP,MAAR,CAAP,eACE,+EACE,gCAAC,MAAD,2EADF,EAEGY,IAAI,iBACH,gCAAC,QAAD;IAAA,SAAiBA;EAAjB,iBACE,gCAAC,KAAD,wBADF,CAHJ,CADF;AAUD;;AAED,SAASO,WAAT,CAAqBR,KAArB,EAA4B;EAAA;EAAA;;EAC1B,IAAQX,MAAR,GAAmBW,KAAnB,CAAQX,MAAR;EACA,IAAMoB,YAAY,GAC2BN,gBAD7C;EACA,eAAO,IAAAP,aAAA,EAAQP,MAAR,CAAP,eAAuB,gCAAC,YAAD;IAAA,OAAgC;EAAhC,YAAvB;AACD;;AAED,SAASI,MAAT,CAAgBO,KAAhB,EAAuB;EAAA;EAAA;;EACrB,IAAQX,MAAR,GAAmBW,KAAnB,CAAQX,MAAR;EACA,IAAMqB,OAAO,GAC2BxB,YADxC;EACA,eAAO,IAAAU,aAAA,EAAQP,MAAR,CAAP,eAAuB,gCAAC,OAAD,iFAA0BW,KAA1B,YAAvB;AACD;;AAED,SAASL,IAAT,CAAcK,KAAd,EAAqB;EAAA;EAAA;;EACnB,IAAQX,MAAR,GAAmBW,KAAnB,CAAQX,MAAR;EACA,IAAMsB,KAAK,GAC2BzB,YADtC;EACA,gBAAO,IAAAU,aAAA,EAAQP,MAAR,CAAP,eAAuB,gCAAC,KAAD,gFAAwBW,KAAxB,YAAvB;AACD;;AAED,IAAMR,IAAI,GAAG,IAAAoB,gBAAA,EAAgB5B,QAAhB,EAA0B;EACrCe,KAAK,EAALA,KADqC;EAErCS,WAAW,EAAXA,WAFqC;EAGrCf,MAAM,EAANA,MAHqC;EAIrCE,IAAI,EAAJA;AAJqC,CAA1B,CAAb;eAOeH,I"}
1
+ {"version":3,"file":"Card.js","names":["CardRoot","SCard","Box","asProps","Children","styles","advanceMode","isAdvanceMode","Card","Header","displayName","Body","sstyled","Component","style","Title","props","hint","SWrapper","STitle","Text","SIcon","InfoM","STooltip","Tooltip","Description","SDescription","SHeader","SBody","createComponent"],"sources":["../../src/Card.jsx"],"sourcesContent":["import React from 'react';\nimport createComponent, { Component, sstyled, Root } from '@semcore/core';\nimport { Box } from '@semcore/flex-box';\nimport { Text } from '@semcore/typography';\nimport Tooltip from '@semcore/tooltip';\nimport InfoM from '@semcore/icon/Info/m';\n\nimport style from './style/card.shadow.css';\nimport { isAdvanceMode } from '@semcore/utils/lib/findComponent';\n\nclass CardRoot extends Component {\n static displayName = 'Card';\n\n static style = style;\n\n render() {\n const SCard = Root;\n const { Children, styles } = this.asProps;\n\n const advanceMode = isAdvanceMode(Children, [Card.Header.displayName, Card.Body.displayName]);\n\n return sstyled(styles)(\n <SCard render={Box}>\n {advanceMode ? (\n <Children />\n ) : (\n <Card.Body>\n <Children />\n </Card.Body>\n )}\n </SCard>,\n );\n }\n}\n\nfunction Title(props) {\n const { styles, hint } = props;\n const SWrapper = 'div';\n const STitle = Root;\n const SIcon = InfoM;\n const STooltip = Tooltip;\n return sstyled(styles)(\n <SWrapper>\n <STitle render={Text} />\n {hint && (\n <STooltip title={hint}>\n <SIcon />\n </STooltip>\n )}\n </SWrapper>,\n );\n}\n\nfunction Description(props) {\n const { styles } = props;\n const SDescription = Root;\n return sstyled(styles)(<SDescription render={Text} tag=\"p\" />);\n}\n\nfunction Header(props) {\n const { styles } = props;\n const SHeader = Root;\n return sstyled(styles)(<SHeader render={Box} {...props} />);\n}\n\nfunction Body(props) {\n const { styles } = props;\n const SBody = Root;\n return sstyled(styles)(<SBody render={Box} {...props} />);\n}\n\nconst Card = createComponent(CardRoot, {\n Title,\n Description,\n Header,\n Body,\n});\n\nexport default Card;\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;AACA;;AADA;;AAEA;;AACA;;AACA;;AACA;;AAGA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;IAEMA,Q;;;;;;;;;;;;WAKJ,kBAAS;MAAA;MAAA;;MACP,IAAMC,KAAK,GAMMC,YANjB;MACA,oBAA6B,KAAKC,OAAlC;MAAA,IAAQC,QAAR,iBAAQA,QAAR;MAAA,IAAkBC,MAAlB,iBAAkBA,MAAlB;MAEA,IAAMC,WAAW,GAAG,IAAAC,4BAAA,EAAcH,QAAd,EAAwB,CAACI,IAAI,CAACC,MAAL,CAAYC,WAAb,EAA0BF,IAAI,CAACG,IAAL,CAAUD,WAApC,CAAxB,CAApB;MAEA,eAAO,IAAAE,aAAA,EAAQP,MAAR,CAAP,eACE,gCAAC,KAAD,0EACGC,WAAW,gBACV,gCAAC,QAAD,2BADU,gBAGV,gCAAC,IAAD,CAAM,IAAN,qBACE,gCAAC,QAAD,2BADF,CAJJ,CADF;IAWD;;;EAtBoBO,e;;iCAAjBb,Q,iBACiB,M;iCADjBA,Q,WAGWc,K;;AAsBjB,SAASC,KAAT,CAAeC,KAAf,EAAsB;EAAA;EAAA;;EACpB,IAAQX,MAAR,GAAyBW,KAAzB,CAAQX,MAAR;EAAA,IAAgBY,IAAhB,GAAyBD,KAAzB,CAAgBC,IAAhB;EACA,IAAMC,QAAQ,GAAG,KAAjB;EACA,IAAMC,MAAM,GAKQC,gBALpB;EACA,IAAMC,KAAK,GAAGC,aAAd;EACA,IAAMC,QAAQ,GAAGC,mBAAjB;EACA,eAAO,IAAAZ,aAAA,EAAQP,MAAR,CAAP,eACE,gCAAC,QAAD,yCACE,gCAAC,MAAD,2EADF,EAEGY,IAAI,iBACH,gCAAC,QAAD;IAAA,SAAiBA;EAAjB,iBACE,gCAAC,KAAD,wBADF,CAHJ,CADF;AAUD;;AAED,SAASQ,WAAT,CAAqBT,KAArB,EAA4B;EAAA;EAAA;;EAC1B,IAAQX,MAAR,GAAmBW,KAAnB,CAAQX,MAAR;EACA,IAAMqB,YAAY,GAC2BN,gBAD7C;EACA,eAAO,IAAAR,aAAA,EAAQP,MAAR,CAAP,eAAuB,gCAAC,YAAD;IAAA,OAAgC;EAAhC,YAAvB;AACD;;AAED,SAASI,MAAT,CAAgBO,KAAhB,EAAuB;EAAA;EAAA;;EACrB,IAAQX,MAAR,GAAmBW,KAAnB,CAAQX,MAAR;EACA,IAAMsB,OAAO,GAC2BzB,YADxC;EACA,eAAO,IAAAU,aAAA,EAAQP,MAAR,CAAP,eAAuB,gCAAC,OAAD,iFAA0BW,KAA1B,YAAvB;AACD;;AAED,SAASL,IAAT,CAAcK,KAAd,EAAqB;EAAA;EAAA;;EACnB,IAAQX,MAAR,GAAmBW,KAAnB,CAAQX,MAAR;EACA,IAAMuB,KAAK,GAC2B1B,YADtC;EACA,gBAAO,IAAAU,aAAA,EAAQP,MAAR,CAAP,eAAuB,gCAAC,KAAD,gFAAwBW,KAAxB,YAAvB;AACD;;AAED,IAAMR,IAAI,GAAG,IAAAqB,gBAAA,EAAgB7B,QAAhB,EAA0B;EACrCe,KAAK,EAALA,KADqC;EAErCU,WAAW,EAAXA,WAFqC;EAGrChB,MAAM,EAANA,MAHqC;EAIrCE,IAAI,EAAJA;AAJqC,CAA1B,CAAb;eAOeH,I"}
@@ -12,6 +12,11 @@ SCard {
12
12
  font-family: var(--intergalactic-base, Inter), sans-serif;
13
13
  }
14
14
 
15
+ SWrapper {
16
+ display: inline-flex;
17
+ align-items: center;
18
+ }
19
+
15
20
  STitle {
16
21
  color: var(--intergalactic-text-primary, #191b23);
17
22
  font-size: var(--intergalactic-fs-300, 16px);
package/lib/es6/Card.js CHANGED
@@ -31,18 +31,19 @@ var style = (
31
31
  /*__reshadow_css_start__*/
32
32
  _sstyled.insert(
33
33
  /*__inner_css_start__*/
34
- ".___SCard_hxcqy_gg_{box-sizing:border-box;background:var(--intergalactic-bg-primary-neutral,#fff);padding:0;border:none;border-radius:var(--intergalactic-rounded-medium,6px);box-shadow:var(--intergalactic-box-shadow-card,0 0 1px 0 rgba(25,27,35,.16),0 1px 2px 0 rgba(25,27,35,.12));font-family:var(--intergalactic-base,Inter),sans-serif}.___STitle_hxcqy_gg_{color:var(--intergalactic-text-primary,#191b23);font-size:var(--intergalactic-fs-300,16px);line-height:var(--intergalactic-lh-300,150%);font-weight:var(--intergalactic-bold,700);margin-right:var(--intergalactic-spacing-1x,4px)}.___SIcon_hxcqy_gg_{color:var(--intergalactic-icon-secondary-neutral,#a9abb6);cursor:help;margin-right:var(--intergalactic-spacing-1x,4px)}.___STooltip_hxcqy_gg_{display:inline-flex;vertical-align:middle}.___SDescription_hxcqy_gg_{margin-bottom:0;margin-top:var(--intergalactic-spacing-2x,8px);font-size:var(--intergalactic-fs-200,14px);color:var(--intergalactic-text-secondary,#6c6e79)}.___SHeader_hxcqy_gg_{padding-top:var(--intergalactic-spacing-2x,8px);padding-bottom:var(--intergalactic-spacing-2x,8px);padding-left:var(--intergalactic-spacing-5x,20px);padding-right:var(--intergalactic-spacing-5x,20px);box-shadow:inset 0 -1px 0 var(--intergalactic-border-secondary,#e0e1e9)}.___SBody_hxcqy_gg_{color:var(--intergalactic-text-primary,#191b23);padding-bottom:var(--intergalactic-spacing-5x,20px);padding-left:var(--intergalactic-spacing-5x,20px);padding-right:var(--intergalactic-spacing-5x,20px);padding-top:var(--intergalactic-spacing-5x,20px)}"
34
+ ".___SCard_1hsgg_gg_{box-sizing:border-box;background:var(--intergalactic-bg-primary-neutral,#fff);padding:0;border:none;border-radius:var(--intergalactic-rounded-medium,6px);box-shadow:var(--intergalactic-box-shadow-card,0 0 1px 0 rgba(25,27,35,.16),0 1px 2px 0 rgba(25,27,35,.12));font-family:var(--intergalactic-base,Inter),sans-serif}.___SWrapper_1hsgg_gg_{display:inline-flex;align-items:center}.___STitle_1hsgg_gg_{color:var(--intergalactic-text-primary,#191b23);font-size:var(--intergalactic-fs-300,16px);line-height:var(--intergalactic-lh-300,150%);font-weight:var(--intergalactic-bold,700);margin-right:var(--intergalactic-spacing-1x,4px)}.___SIcon_1hsgg_gg_{color:var(--intergalactic-icon-secondary-neutral,#a9abb6);cursor:help;margin-right:var(--intergalactic-spacing-1x,4px)}.___STooltip_1hsgg_gg_{display:inline-flex;vertical-align:middle}.___SDescription_1hsgg_gg_{margin-bottom:0;margin-top:var(--intergalactic-spacing-2x,8px);font-size:var(--intergalactic-fs-200,14px);color:var(--intergalactic-text-secondary,#6c6e79)}.___SHeader_1hsgg_gg_{padding-top:var(--intergalactic-spacing-2x,8px);padding-bottom:var(--intergalactic-spacing-2x,8px);padding-left:var(--intergalactic-spacing-5x,20px);padding-right:var(--intergalactic-spacing-5x,20px);box-shadow:inset 0 -1px 0 var(--intergalactic-border-secondary,#e0e1e9)}.___SBody_1hsgg_gg_{color:var(--intergalactic-text-primary,#191b23);padding-bottom:var(--intergalactic-spacing-5x,20px);padding-left:var(--intergalactic-spacing-5x,20px);padding-right:var(--intergalactic-spacing-5x,20px);padding-top:var(--intergalactic-spacing-5x,20px)}"
35
35
  /*__inner_css_end__*/
36
- , "hxcqy_gg_")
36
+ , "1hsgg_gg_")
37
37
  /*__reshadow_css_end__*/
38
38
  , {
39
- "__SCard": "___SCard_hxcqy_gg_",
40
- "__STitle": "___STitle_hxcqy_gg_",
41
- "__SIcon": "___SIcon_hxcqy_gg_",
42
- "__STooltip": "___STooltip_hxcqy_gg_",
43
- "__SDescription": "___SDescription_hxcqy_gg_",
44
- "__SHeader": "___SHeader_hxcqy_gg_",
45
- "__SBody": "___SBody_hxcqy_gg_"
39
+ "__SCard": "___SCard_1hsgg_gg_",
40
+ "__SWrapper": "___SWrapper_1hsgg_gg_",
41
+ "__STitle": "___STitle_1hsgg_gg_",
42
+ "__SIcon": "___SIcon_1hsgg_gg_",
43
+ "__STooltip": "___STooltip_1hsgg_gg_",
44
+ "__SDescription": "___SDescription_1hsgg_gg_",
45
+ "__SHeader": "___SHeader_1hsgg_gg_",
46
+ "__SBody": "___SBody_1hsgg_gg_"
46
47
  });
47
48
  import { isAdvanceMode } from '@semcore/utils/lib/findComponent';
48
49
 
@@ -85,10 +86,11 @@ function Title(props) {
85
86
 
86
87
  var styles = props.styles,
87
88
  hint = props.hint;
89
+ var SWrapper = 'div';
88
90
  var STitle = Text;
89
91
  var SIcon = InfoM;
90
92
  var STooltip = Tooltip;
91
- return _ref7 = sstyled(styles), /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(STitle, _ref7.cn("STitle", _objectSpread({}, _assignProps2({}, _ref2)))), hint && /*#__PURE__*/React.createElement(STooltip, _ref7.cn("STooltip", {
93
+ return _ref7 = sstyled(styles), /*#__PURE__*/React.createElement(SWrapper, _ref7.cn("SWrapper", {}), /*#__PURE__*/React.createElement(STitle, _ref7.cn("STitle", _objectSpread({}, _assignProps2({}, _ref2)))), hint && /*#__PURE__*/React.createElement(STooltip, _ref7.cn("STooltip", {
92
94
  "title": hint
93
95
  }), /*#__PURE__*/React.createElement(SIcon, _ref7.cn("SIcon", {}))));
94
96
  }
@@ -1 +1 @@
1
- {"version":3,"file":"Card.js","names":["React","createComponent","Component","sstyled","Root","Box","Text","Tooltip","InfoM","isAdvanceMode","CardRoot","SCard","asProps","Children","styles","advanceMode","Card","Header","displayName","Body","style","Title","props","hint","STitle","SIcon","STooltip","Description","SDescription","SHeader","SBody"],"sources":["../../src/Card.jsx"],"sourcesContent":["import React from 'react';\nimport createComponent, { Component, sstyled, Root } from '@semcore/core';\nimport { Box } from '@semcore/flex-box';\nimport { Text } from '@semcore/typography';\nimport Tooltip from '@semcore/tooltip';\nimport InfoM from '@semcore/icon/Info/m';\n\nimport style from './style/card.shadow.css';\nimport { isAdvanceMode } from '@semcore/utils/lib/findComponent';\n\nclass CardRoot extends Component {\n static displayName = 'Card';\n\n static style = style;\n\n render() {\n const SCard = Root;\n const { Children, styles } = this.asProps;\n\n const advanceMode = isAdvanceMode(Children, [Card.Header.displayName, Card.Body.displayName]);\n\n return sstyled(styles)(\n <SCard render={Box}>\n {advanceMode ? (\n <Children />\n ) : (\n <Card.Body>\n <Children />\n </Card.Body>\n )}\n </SCard>,\n );\n }\n}\n\nfunction Title(props) {\n const { styles, hint } = props;\n const STitle = Root;\n const SIcon = InfoM;\n const STooltip = Tooltip;\n return sstyled(styles)(\n <>\n <STitle render={Text} />\n {hint && (\n <STooltip title={hint}>\n <SIcon />\n </STooltip>\n )}\n </>,\n );\n}\n\nfunction Description(props) {\n const { styles } = props;\n const SDescription = Root;\n return sstyled(styles)(<SDescription render={Text} tag=\"p\" />);\n}\n\nfunction Header(props) {\n const { styles } = props;\n const SHeader = Root;\n return sstyled(styles)(<SHeader render={Box} {...props} />);\n}\n\nfunction Body(props) {\n const { styles } = props;\n const SBody = Root;\n return sstyled(styles)(<SBody render={Box} {...props} />);\n}\n\nconst Card = createComponent(CardRoot, {\n Title,\n Description,\n Header,\n Body,\n});\n\nexport default Card;\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;AAAA,OAAOA,KAAP,MAAkB,OAAlB;AACA,OAAOC,eAAP,IAA0BC,SAA1B,EAAqCC,OAArC,EAA8CC,IAA9C,QAA0D,eAA1D;AACA,SAASC,GAAT,QAAoB,mBAApB;AACA,SAASC,IAAT,QAAqB,qBAArB;AACA,OAAOC,OAAP,MAAoB,kBAApB;AACA,OAAOC,KAAP,MAAkB,sBAAlB;;;;;;;;;;;;;;;;;;;;AAGA,SAASC,aAAT,QAA8B,kCAA9B;;IAEMC,Q;;;;;;;;;;;;;WAKJ,kBAAS;MAAA;MAAA;;MACP,IAAMC,KAAK,GAMMN,GANjB;MACA,oBAA6B,KAAKO,OAAlC;MAAA,IAAQC,QAAR,iBAAQA,QAAR;MAAA,IAAkBC,MAAlB,iBAAkBA,MAAlB;MAEA,IAAMC,WAAW,GAAGN,aAAa,CAACI,QAAD,EAAW,CAACG,IAAI,CAACC,MAAL,CAAYC,WAAb,EAA0BF,IAAI,CAACG,IAAL,CAAUD,WAApC,CAAX,CAAjC;MAEA,eAAOf,OAAO,CAACW,MAAD,CAAd,eACE,oBAAC,KAAD,gEACGC,WAAW,gBACV,oBAAC,QAAD,2BADU,gBAGV,oBAAC,IAAD,CAAM,IAAN,qBACE,oBAAC,QAAD,2BADF,CAJJ,CADF;IAWD;;;;EAtBoBb,S;;gBAAjBQ,Q,iBACiB,M;;gBADjBA,Q,WAGWU,K;;AAsBjB,SAASC,KAAT,CAAeC,KAAf,EAAsB;EAAA;EAAA;;EACpB,IAAQR,MAAR,GAAyBQ,KAAzB,CAAQR,MAAR;EAAA,IAAgBS,IAAhB,GAAyBD,KAAzB,CAAgBC,IAAhB;EACA,IAAMC,MAAM,GAKQlB,IALpB;EACA,IAAMmB,KAAK,GAAGjB,KAAd;EACA,IAAMkB,QAAQ,GAAGnB,OAAjB;EACA,eAAOJ,OAAO,CAACW,MAAD,CAAd,eACE,uDACE,oBAAC,MAAD,kEADF,EAEGS,IAAI,iBACH,oBAAC,QAAD;IAAA,SAAiBA;EAAjB,iBACE,oBAAC,KAAD,wBADF,CAHJ,CADF;AAUD;;AAED,SAASI,WAAT,CAAqBL,KAArB,EAA4B;EAAA;EAAA;;EAC1B,IAAQR,MAAR,GAAmBQ,KAAnB,CAAQR,MAAR;EACA,IAAMc,YAAY,GAC2BtB,IAD7C;EACA,eAAOH,OAAO,CAACW,MAAD,CAAd,eAAuB,oBAAC,YAAD;IAAA,OAAgC;EAAhC,YAAvB;AACD;;AAED,SAASG,MAAT,CAAgBK,KAAhB,EAAuB;EAAA;EAAA;;EACrB,IAAQR,MAAR,GAAmBQ,KAAnB,CAAQR,MAAR;EACA,IAAMe,OAAO,GAC2BxB,GADxC;EACA,eAAOF,OAAO,CAACW,MAAD,CAAd,eAAuB,oBAAC,OAAD,wEAA0BQ,KAA1B,YAAvB;AACD;;AAED,SAASH,IAAT,CAAcG,KAAd,EAAqB;EAAA;EAAA;;EACnB,IAAQR,MAAR,GAAmBQ,KAAnB,CAAQR,MAAR;EACA,IAAMgB,KAAK,GAC2BzB,GADtC;EACA,gBAAOF,OAAO,CAACW,MAAD,CAAd,eAAuB,oBAAC,KAAD,uEAAwBQ,KAAxB,YAAvB;AACD;;AAED,IAAMN,IAAI,GAAGf,eAAe,CAACS,QAAD,EAAW;EACrCW,KAAK,EAALA,KADqC;EAErCM,WAAW,EAAXA,WAFqC;EAGrCV,MAAM,EAANA,MAHqC;EAIrCE,IAAI,EAAJA;AAJqC,CAAX,CAA5B;AAOA,eAAeH,IAAf"}
1
+ {"version":3,"file":"Card.js","names":["React","createComponent","Component","sstyled","Root","Box","Text","Tooltip","InfoM","isAdvanceMode","CardRoot","SCard","asProps","Children","styles","advanceMode","Card","Header","displayName","Body","style","Title","props","hint","SWrapper","STitle","SIcon","STooltip","Description","SDescription","SHeader","SBody"],"sources":["../../src/Card.jsx"],"sourcesContent":["import React from 'react';\nimport createComponent, { Component, sstyled, Root } from '@semcore/core';\nimport { Box } from '@semcore/flex-box';\nimport { Text } from '@semcore/typography';\nimport Tooltip from '@semcore/tooltip';\nimport InfoM from '@semcore/icon/Info/m';\n\nimport style from './style/card.shadow.css';\nimport { isAdvanceMode } from '@semcore/utils/lib/findComponent';\n\nclass CardRoot extends Component {\n static displayName = 'Card';\n\n static style = style;\n\n render() {\n const SCard = Root;\n const { Children, styles } = this.asProps;\n\n const advanceMode = isAdvanceMode(Children, [Card.Header.displayName, Card.Body.displayName]);\n\n return sstyled(styles)(\n <SCard render={Box}>\n {advanceMode ? (\n <Children />\n ) : (\n <Card.Body>\n <Children />\n </Card.Body>\n )}\n </SCard>,\n );\n }\n}\n\nfunction Title(props) {\n const { styles, hint } = props;\n const SWrapper = 'div';\n const STitle = Root;\n const SIcon = InfoM;\n const STooltip = Tooltip;\n return sstyled(styles)(\n <SWrapper>\n <STitle render={Text} />\n {hint && (\n <STooltip title={hint}>\n <SIcon />\n </STooltip>\n )}\n </SWrapper>,\n );\n}\n\nfunction Description(props) {\n const { styles } = props;\n const SDescription = Root;\n return sstyled(styles)(<SDescription render={Text} tag=\"p\" />);\n}\n\nfunction Header(props) {\n const { styles } = props;\n const SHeader = Root;\n return sstyled(styles)(<SHeader render={Box} {...props} />);\n}\n\nfunction Body(props) {\n const { styles } = props;\n const SBody = Root;\n return sstyled(styles)(<SBody render={Box} {...props} />);\n}\n\nconst Card = createComponent(CardRoot, {\n Title,\n Description,\n Header,\n Body,\n});\n\nexport default Card;\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;AAAA,OAAOA,KAAP,MAAkB,OAAlB;AACA,OAAOC,eAAP,IAA0BC,SAA1B,EAAqCC,OAArC,EAA8CC,IAA9C,QAA0D,eAA1D;AACA,SAASC,GAAT,QAAoB,mBAApB;AACA,SAASC,IAAT,QAAqB,qBAArB;AACA,OAAOC,OAAP,MAAoB,kBAApB;AACA,OAAOC,KAAP,MAAkB,sBAAlB;;;;;;;;;;;;;;;;;;;;;AAGA,SAASC,aAAT,QAA8B,kCAA9B;;IAEMC,Q;;;;;;;;;;;;;WAKJ,kBAAS;MAAA;MAAA;;MACP,IAAMC,KAAK,GAMMN,GANjB;MACA,oBAA6B,KAAKO,OAAlC;MAAA,IAAQC,QAAR,iBAAQA,QAAR;MAAA,IAAkBC,MAAlB,iBAAkBA,MAAlB;MAEA,IAAMC,WAAW,GAAGN,aAAa,CAACI,QAAD,EAAW,CAACG,IAAI,CAACC,MAAL,CAAYC,WAAb,EAA0BF,IAAI,CAACG,IAAL,CAAUD,WAApC,CAAX,CAAjC;MAEA,eAAOf,OAAO,CAACW,MAAD,CAAd,eACE,oBAAC,KAAD,gEACGC,WAAW,gBACV,oBAAC,QAAD,2BADU,gBAGV,oBAAC,IAAD,CAAM,IAAN,qBACE,oBAAC,QAAD,2BADF,CAJJ,CADF;IAWD;;;;EAtBoBb,S;;gBAAjBQ,Q,iBACiB,M;;gBADjBA,Q,WAGWU,K;;AAsBjB,SAASC,KAAT,CAAeC,KAAf,EAAsB;EAAA;EAAA;;EACpB,IAAQR,MAAR,GAAyBQ,KAAzB,CAAQR,MAAR;EAAA,IAAgBS,IAAhB,GAAyBD,KAAzB,CAAgBC,IAAhB;EACA,IAAMC,QAAQ,GAAG,KAAjB;EACA,IAAMC,MAAM,GAKQnB,IALpB;EACA,IAAMoB,KAAK,GAAGlB,KAAd;EACA,IAAMmB,QAAQ,GAAGpB,OAAjB;EACA,eAAOJ,OAAO,CAACW,MAAD,CAAd,eACE,oBAAC,QAAD,yCACE,oBAAC,MAAD,kEADF,EAEGS,IAAI,iBACH,oBAAC,QAAD;IAAA,SAAiBA;EAAjB,iBACE,oBAAC,KAAD,wBADF,CAHJ,CADF;AAUD;;AAED,SAASK,WAAT,CAAqBN,KAArB,EAA4B;EAAA;EAAA;;EAC1B,IAAQR,MAAR,GAAmBQ,KAAnB,CAAQR,MAAR;EACA,IAAMe,YAAY,GAC2BvB,IAD7C;EACA,eAAOH,OAAO,CAACW,MAAD,CAAd,eAAuB,oBAAC,YAAD;IAAA,OAAgC;EAAhC,YAAvB;AACD;;AAED,SAASG,MAAT,CAAgBK,KAAhB,EAAuB;EAAA;EAAA;;EACrB,IAAQR,MAAR,GAAmBQ,KAAnB,CAAQR,MAAR;EACA,IAAMgB,OAAO,GAC2BzB,GADxC;EACA,eAAOF,OAAO,CAACW,MAAD,CAAd,eAAuB,oBAAC,OAAD,wEAA0BQ,KAA1B,YAAvB;AACD;;AAED,SAASH,IAAT,CAAcG,KAAd,EAAqB;EAAA;EAAA;;EACnB,IAAQR,MAAR,GAAmBQ,KAAnB,CAAQR,MAAR;EACA,IAAMiB,KAAK,GAC2B1B,GADtC;EACA,gBAAOF,OAAO,CAACW,MAAD,CAAd,eAAuB,oBAAC,KAAD,uEAAwBQ,KAAxB,YAAvB;AACD;;AAED,IAAMN,IAAI,GAAGf,eAAe,CAACS,QAAD,EAAW;EACrCW,KAAK,EAALA,KADqC;EAErCO,WAAW,EAAXA,WAFqC;EAGrCX,MAAM,EAANA,MAHqC;EAIrCE,IAAI,EAAJA;AAJqC,CAAX,CAA5B;AAOA,eAAeH,IAAf"}
@@ -12,6 +12,11 @@ SCard {
12
12
  font-family: var(--intergalactic-base, Inter), sans-serif;
13
13
  }
14
14
 
15
+ SWrapper {
16
+ display: inline-flex;
17
+ align-items: center;
18
+ }
19
+
15
20
  STitle {
16
21
  color: var(--intergalactic-text-primary, #191b23);
17
22
  font-size: var(--intergalactic-fs-300, 16px);
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@semcore/card",
3
3
  "description": "Semrush Card Component",
4
- "version": "4.2.2",
4
+ "version": "4.2.4",
5
5
  "main": "lib/cjs/index.js",
6
6
  "module": "lib/es6/index.js",
7
7
  "typings": "lib/types/index.d.ts",