@skbkontur/react-ui 0.0.0-0b8a8f7a39 → 0.0.0-0fe669bb2d

package/cjs/components/Tooltip/Tooltip.md

@@ -1,292 +1,293 @@
-Отступы в тултипе подобраны так, чтобы базовая линия текста со шрифтом Segoe UI в тултипе совпадала с базовой линией стандартных контролов
-
-```jsx harmony
-import SearchIcon from '@skbkontur/react-icons/Search';
-import MenuIcon from '@skbkontur/react-icons/Menu';
-import HelpDotIcon from '@skbkontur/react-icons/HelpDot';
-import { Button, Gapped, Input, Select, Tooltip } from '@skbkontur/react-ui';
-
-const [size, setSize] = React.useState('small');
-
-const render = () => (
-  <div
-    style={{
-      width: 250,
-      fontSize: size === 'large' ? 16 : 14,
-      fontFamily: 'Segoe UI',
-    }}
-  >
-    Задача организации, в особенности же рамки и место обучения кадров влечет за собой процесс внедрения и модернизации
-    форм развития.
-  </div>
-);
-
-<div style={{ fontFamily: 'Segoe UI' }}>
-  <Gapped vertical>
-    <Gapped>
-      <div style={{ width: 40 }}>Size</div>
-      <Select width={120} value={size} items={['small', 'medium', 'large']} onValueChange={setSize} size={size} />
-    </Gapped>
-    <Tooltip render={render} pos="right top">
-      <Input size={size} leftIcon={<SearchIcon />} width={170} />
-    </Tooltip>
-    <Tooltip render={render} pos="right top">
-      <Button size={size} icon={<MenuIcon />}>
-        Menu
-      </Button>
-    </Tooltip>
-    <Tooltip render={render} pos="right top">
-      <HelpDotIcon />
-    </Tooltip>
-  </Gapped>
-</div>;
-```
-
-Выравнивание базовой линии с RadioGroup требует дополнительных отступов.
-
-```jsx harmony
-import { Gapped, Tooltip, RadioGroup, Radio } from '@skbkontur/react-ui';
-
-const render = () => (
-  <div
-    style={{
-      fontSize: 14,
-      fontFamily: 'Segoe UI',
-    }}
-  >
-    Выровнено по первому Radio
-  </div>
-);
-
-<div style={{ fontFamily: 'Segoe UI' }}>
-  <Tooltip useWrapper={false} render={render} pos="right top">
-    <div style={{ padding: '10px 0', display: 'inline-block' }}>
-      <RadioGroup>
-        <Gapped vertical gap={0}>
-          <Radio value="2">Two</Radio>
-          <Radio value="4">Four</Radio>
-          <Radio value="6">Six</Radio>
-          <Radio value="8">Eight</Radio>
-        </Gapped>
-      </RadioGroup>
-    </div>
-  </Tooltip>
-</div>;
-```
-
-Тултип может располагаться в одной из 12 позиции и триггериться одним из 8 способов.
-
-```jsx harmony
-import { Button, Center, Gapped, Select, Tooltip } from '@skbkontur/react-ui';
-
-const S = 60;
-
-const Block = ({ pos, trigger, top, left, onMouseDown }) => (
-  <div
-    style={{
-      top,
-      left,
-      display: 'inline-block',
-      position: 'absolute',
-      cursor: trigger === 'click' ? 'pointer' : 'default',
-    }}
-  >
-    <Tooltip render={() => pos} pos={pos} trigger={trigger}>
-      <div
-        tabIndex={trigger === 'focus' || trigger === 'hover&focus' ? 0 : null}
-        style={{
-          height: S - 5,
-          width: S - 5,
-          background: 'white',
-          boxShadow: '0 1px 5px rgba(0, 0, 0, 0.3)',
-        }}
-      />
-    </Tooltip>
-  </div>
-);
-
-class UseManualTooltip extends React.Component {
-  constructor(props) {
-    super(props);
-    this.tooltip = null;
-  }
-
-  render() {
-    return (
-      <Gapped vertical>
-        <Gapped>
-          <Button width={1.5 * S - 5} onClick={this.handleClickOnShow.bind(this)}>
-            Show
-          </Button>
-          <Button width={1.5 * S - 5} onClick={this.handleClickOnHide.bind(this)}>
-            Hide
-          </Button>
-        </Gapped>
-        <Tooltip
-          render={() => 'Manual tooltip'}
-          pos="bottom center"
-          trigger="manual"
-          ref={element => {
-            this.tooltip = element;
-          }}
-        >
-          <div
-            style={{
-              width: 3 * S,
-              height: S,
-              lineHeight: `${S}px`,
-              background: 'white',
-              boxShadow: '0 1px 5px rgba(0, 0, 0, 0.3)',
-              textAlign: 'center',
-            }}
-          >
-            Manual control
-          </div>
-        </Tooltip>
-      </Gapped>
-    );
-  }
-
-  handleClickOnShow() {
-    if (this.tooltip) {
-      this.tooltip.show();
-    }
-  }
-  handleClickOnHide() {
-    if (this.tooltip) {
-      this.tooltip.hide();
-    }
-  }
-}
-
-const blocks = [
-  { top: S, left: S * 2, pos: 'top left' },
-  { top: S, left: S * 4, pos: 'top center' },
-  { top: S, left: S * 6, pos: 'top right' },
-  { top: S * 2, left: S * 7, pos: 'right top' },
-  { top: S * 4, left: S * 7, pos: 'right middle' },
-  { top: S * 6, left: S * 7, pos: 'right bottom' },
-  { top: S * 7, left: S * 6, pos: 'bottom right' },
-  { top: S * 7, left: S * 4, pos: 'bottom center' },
-  { top: S * 7, left: S * 2, pos: 'bottom left' },
-  { top: S * 6, left: S, pos: 'left bottom' },
-  { top: S * 4, left: S, pos: 'left middle' },
-  { top: S * 2, left: S, pos: 'left top' },
-];
-
-const [trigger, setTrigger] = React.useState('hover');
-
-const isManual = trigger === 'manual';
-
-<div
-  style={{
-    width: S * 9,
-    height: S * 9,
-    position: 'relative',
-    border: '1px solid #dfdede',
-    background: `repeating-linear-gradient(
-                   45deg,
-                   #fafafa,
-                   #fafafa ${S / 4}px,
-                   #dfdede ${S / 4}px,
-                   #dfdede ${S / 2}px
-                 )`,
-  }}
->
-  <Center>
-    <Gapped vertical>
-      <Gapped>
-        Trigger
-        <Select
-          width={S * 2}
-          size="small"
-          value={trigger}
-          items={['click', 'hover', 'focus', 'hover&focus', 'hoverAnchor', 'opened', 'closed', 'manual']}
-          onValueChange={setTrigger}
-        />
-      </Gapped>
-      {isManual ? <UseManualTooltip /> : null}
-    </Gapped>
-  </Center>
-
-  {!isManual && blocks.map((block, i) => <Block key={i} {...block} trigger={trigger} />)}
-</div>;
-```
-
-Есть возможность прицеплять тултип к любому HTML элементу на странице с помощью `anchorElement`. При этом сам `Tooltip` может рендериться в совершенно другом месте приложения.
-
-```jsx harmony
-import { Tooltip } from '@skbkontur/react-ui';
-
-const S = 60;
-const blockStyle = {
-  height: S - 5,
-  width: S - 5,
-  background: 'white',
-  boxShadow: '0 1px 5px rgba(0, 0, 0, 0.3)',
-};
-const containerStyle = {
-  width: S * 9,
-  height: S * 9,
-  position: 'relative',
-  border: '1px solid #dfdede',
-  background: `
-    repeating-linear-gradient(
-      45deg,
-      #fafafa,
-      #fafafa ${S / 4}px,
-      #dfdede ${S / 4}px,
-      #dfdede ${S / 2}px
-    )
-  `,
-};
-
-const blocks = [
-  { top: S, left: S * 2 },
-  { top: S, left: S * 4 },
-  { top: S, left: S * 6 },
-  { top: S * 2, left: S * 7 },
-  { top: S * 4, left: S * 7 },
-  { top: S * 6, left: S * 7 },
-  { top: S * 7, left: S * 6 },
-  { top: S * 7, left: S * 4 },
-  { top: S * 7, left: S * 2 },
-  { top: S * 6, left: S },
-  { top: S * 4, left: S },
-  { top: S * 2, left: S },
-];
-
-class AnchorTooltipExample extends React.Component {
-  constructor(props) {
-    super(props);
-
-    this.state = {
-      blocks,
-      anchor: null,
-    };
-  }
-
-  render() {
-    return (
-      <>
-        {this.state.anchor ? (
-          <Tooltip anchorElement={this.state.anchor} render={() => 'Hello React'} trigger="hover" />
-        ) : null}
-        <div style={containerStyle}>
-          {this.state.blocks.map(({ top, left }, i) => (
-            <div key={i} style={{ top, left, display: 'inline-block', position: 'absolute' }}>
-              <div
-                style={blockStyle}
-                onMouseEnter={event => this.setState({ anchor: event.target })}
-                onMouseLeave={() => this.setState({ anchor: null })}
-              />
-            </div>
-          ))}
-        </div>
-      </>
-    );
-  }
-}
-
-<AnchorTooltipExample />;
-```
+Отступы в тултипе подобраны так, чтобы базовая линия текста со шрифтом Segoe UI в тултипе совпадала с базовой линией стандартных контролов
+
+```jsx harmony
+import SearchIcon from '@skbkontur/react-icons/Search';
+import MenuIcon from '@skbkontur/react-icons/Menu';
+import HelpDotIcon from '@skbkontur/react-icons/HelpDot';
+import { Button, Gapped, Input, Select, Tooltip } from '@skbkontur/react-ui';
+
+const [size, setSize] = React.useState('small');
+
+const render = () => (
+  <div
+    style={{
+      width: 250,
+      fontSize: size === 'large' ? 16 : 14,
+      fontFamily: 'Segoe UI',
+    }}
+  >
+    Задача организации, в особенности же рамки и место обучения кадров влечет за собой процесс внедрения и модернизации
+    форм развития.
+  </div>
+);
+
+<div style={{ fontFamily: 'Segoe UI' }}>
+  <Gapped vertical>
+    <Gapped>
+      <div style={{ width: 40 }}>Size</div>
+      <Select width={120} value={size} items={['small', 'medium', 'large']} onValueChange={setSize} size={size} />
+    </Gapped>
+    <Tooltip render={render} pos="right top">
+      <Input size={size} leftIcon={<SearchIcon />} width={170} />
+    </Tooltip>
+    <Tooltip render={render} pos="right top">
+      <Button size={size} icon={<MenuIcon />}>
+        Menu
+      </Button>
+    </Tooltip>
+    <Tooltip render={render} pos="right top">
+      <HelpDotIcon />
+    </Tooltip>
+  </Gapped>
+</div>;
+```
+
+Выравнивание базовой линии с RadioGroup требует дополнительных отступов.
+
+```jsx harmony
+import { Gapped, Tooltip, RadioGroup, Radio } from '@skbkontur/react-ui';
+
+const render = () => (
+  <div
+    style={{
+      fontSize: 14,
+      fontFamily: 'Segoe UI',
+    }}
+  >
+    Выровнено по первому Radio
+  </div>
+);
+
+<div style={{ fontFamily: 'Segoe UI' }}>
+  <Tooltip useWrapper={false} render={render} pos="right top">
+    <div style={{ padding: '10px 0', display: 'inline-block' }}>
+      <RadioGroup>
+        <Gapped vertical gap={0}>
+          <Radio value="2">Two</Radio>
+          <Radio value="4">Four</Radio>
+          <Radio value="6">Six</Radio>
+          <Radio value="8">Eight</Radio>
+        </Gapped>
+      </RadioGroup>
+    </div>
+  </Tooltip>
+</div>;
+```
+
+Тултип может располагаться в одной из 12 позиции и триггериться одним из 8 способов.
+
+```jsx harmony
+import { Button, Center, Gapped, Select, Tooltip } from '@skbkontur/react-ui';
+
+const S = 60;
+
+const Block = ({ pos, trigger, top, left, onMouseDown }) => (
+  <div
+    style={{
+      top,
+      left,
+      display: 'inline-block',
+      position: 'absolute',
+      cursor: trigger === 'click' ? 'pointer' : 'default',
+    }}
+  >
+    <Tooltip render={() => pos} pos={pos} trigger={trigger}>
+      <div
+        tabIndex={trigger === 'focus' || trigger === 'hover&focus' ? 0 : null}
+        style={{
+          height: S - 5,
+          width: S - 5,
+          background: 'gray',
+          border: 'solid 1px',
+          boxShadow: '0 1px 5px rgba(0, 0, 0, 0.3)',
+        }}
+      />
+    </Tooltip>
+  </div>
+);
+
+class UseManualTooltip extends React.Component {
+  constructor(props) {
+    super(props);
+    this.tooltip = null;
+  }
+
+  render() {
+    return (
+      <Gapped vertical>
+        <Gapped>
+          <Button width={1.5 * S - 5} onClick={this.handleClickOnShow.bind(this)}>
+            Show
+          </Button>
+          <Button width={1.5 * S - 5} onClick={this.handleClickOnHide.bind(this)}>
+            Hide
+          </Button>
+        </Gapped>
+        <Tooltip
+          render={() => 'Manual tooltip'}
+          pos="bottom center"
+          trigger="manual"
+          ref={element => {
+            this.tooltip = element;
+          }}
+        >
+          <div
+            style={{
+              width: 3 * S,
+              height: S,
+              lineHeight: `${S}px`,
+              background: 'gray',
+              border: 'solid 1px',
+              boxShadow: '0 1px 5px rgba(0, 0, 0, 0.3)',
+              textAlign: 'center',
+            }}
+          >
+            Manual control
+          </div>
+        </Tooltip>
+      </Gapped>
+    );
+  }
+
+  handleClickOnShow() {
+    if (this.tooltip) {
+      this.tooltip.show();
+    }
+  }
+  handleClickOnHide() {
+    if (this.tooltip) {
+      this.tooltip.hide();
+    }
+  }
+}
+
+const blocks = [
+  { top: S, left: S * 2, pos: 'top left' },
+  { top: S, left: S * 4, pos: 'top center' },
+  { top: S, left: S * 6, pos: 'top right' },
+  { top: S * 2, left: S * 7, pos: 'right top' },
+  { top: S * 4, left: S * 7, pos: 'right middle' },
+  { top: S * 6, left: S * 7, pos: 'right bottom' },
+  { top: S * 7, left: S * 6, pos: 'bottom right' },
+  { top: S * 7, left: S * 4, pos: 'bottom center' },
+  { top: S * 7, left: S * 2, pos: 'bottom left' },
+  { top: S * 6, left: S, pos: 'left bottom' },
+  { top: S * 4, left: S, pos: 'left middle' },
+  { top: S * 2, left: S, pos: 'left top' },
+];
+
+const [trigger, setTrigger] = React.useState('hover');
+
+const isManual = trigger === 'manual';
+
+<div
+  style={{
+    width: S * 9,
+    height: S * 9,
+    position: 'relative',
+    border: '1px solid',
+    background: `repeating-linear-gradient(
+                            45deg,
+                            #808080,
+                            #808080 ${S / 4}px,
+                            #d3d3d3 ${S / 4}px,
+                            #d3d3d3 ${S / 2}px
+                          )`,
+  }}
+>
+  <Center>
+    <Gapped vertical>
+      <Gapped>
+        Trigger
+        <Select
+          width={S * 2}
+          size="small"
+          value={trigger}
+          items={['click', 'hover', 'focus', 'hover&focus', 'hoverAnchor', 'opened', 'closed', 'manual']}
+          onValueChange={setTrigger}
+        />
+      </Gapped>
+      {isManual ? <UseManualTooltip /> : null}
+    </Gapped>
+  </Center>
+
+  {!isManual && blocks.map((block, i) => <Block key={i} {...block} trigger={trigger} />)}
+</div>;
+```
+
+Есть возможность прицеплять тултип к любому HTML элементу на странице с помощью `anchorElement`. При этом сам `Tooltip` может рендериться в совершенно другом месте приложения.
+
+```jsx harmony
+import { Tooltip } from '@skbkontur/react-ui';
+
+const S = 60;
+const blockStyle = {
+  height: S - 5,
+  width: S - 5,
+  boxShadow: '0 1px 5px rgba(0, 0, 0, 0.3)',
+  background: 'gray',
+  border: '1px solid'
+};
+const containerStyle = {
+  width: S * 9,
+  height: S * 9,
+  position: 'relative',
+  background: `repeating-linear-gradient(
+                                45deg,
+                                #808080,
+                                #808080 ${S / 4}px,
+                                #d3d3d3 ${S / 4}px,
+                                #d3d3d3 ${S / 2}px
+                              )`,
+  border: '1px solid',
+};
+
+const blocks = [
+  { top: S, left: S * 2 },
+  { top: S, left: S * 4 },
+  { top: S, left: S * 6 },
+  { top: S * 2, left: S * 7 },
+  { top: S * 4, left: S * 7 },
+  { top: S * 6, left: S * 7 },
+  { top: S * 7, left: S * 6 },
+  { top: S * 7, left: S * 4 },
+  { top: S * 7, left: S * 2 },
+  { top: S * 6, left: S },
+  { top: S * 4, left: S },
+  { top: S * 2, left: S },
+];
+
+class AnchorTooltipExample extends React.Component {
+  constructor(props) {
+    super(props);
+
+    this.state = {
+      blocks,
+      anchor: null,
+    };
+  }
+
+  render() {
+    return (
+      <>
+        {this.state.anchor ? (
+          <Tooltip anchorElement={this.state.anchor} render={() => 'Hello React'} trigger="hover" />
+        ) : null}
+        <div style={containerStyle}>
+          {this.state.blocks.map(({ top, left }, i) => (
+            <div key={i} style={{ top, left, display: 'inline-block', position: 'absolute' }}>
+              <div
+                style={blockStyle}
+                onMouseEnter={event => this.setState({ anchor: event.target })}
+                onMouseLeave={() => this.setState({ anchor: null })}
+              />
+            </div>
+          ))}
+        </div>
+      </>
+    );
+  }
+}
+
+<AnchorTooltipExample />;
+```

package/cjs/components/Tooltip/Tooltip.styles.d.ts

@@ -1,5 +1,5 @@
 import { Theme } from '../../lib/theming/Theme';
-export declare const jsStyles: {
+export declare const styles: {
     cross(t: Theme): string;
     tooltipContent(t: Theme): string;
 };

package/cjs/components/Tooltip/Tooltip.styles.js

@@ -1,7 +1,7 @@
-"use strict";var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");exports.__esModule = true;exports.jsStyles = void 0;var _taggedTemplateLiteralLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteralLoose"));var _Emotion = require("../../lib/theming/Emotion");var _templateObject, _templateObject2;
+"use strict";var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");exports.__esModule = true;exports.styles = void 0;var _taggedTemplateLiteralLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteralLoose"));var _Emotion = require("../../lib/theming/Emotion");var _templateObject, _templateObject2;
 
 
-var styles = {
+var styles = (0, _Emotion.memoizeStyle)({
   cross: function cross(t) {
     return (0, _Emotion.css)(_templateObject || (_templateObject = (0, _taggedTemplateLiteralLoose2.default)(["\n      color: ", ";\n      cursor: pointer;\n      height: 8px;\n      line-height: 0;\n      padding: ", ";\n      position: absolute;\n      right: 0;\n      top: 0;\n      width: 8px;\n      box-sizing: content-box;\n\n      &:hover {\n        color: ", ";\n      }\n    "])),
     t.tooltipCloseBtnColor,
@@ -22,11 +22,11 @@ var styles = {
   },
 
   tooltipContent: function tooltipContent(t) {
-    return (0, _Emotion.css)(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteralLoose2.default)(["\n      padding: ", " ", ";\n      position: relative;\n    "])),
-    t.tooltipPaddingY, t.tooltipPaddingX);
+    return (0, _Emotion.css)(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteralLoose2.default)(["\n      color: ", ";\n      padding: ", " ", ";\n      position: relative;\n      font-size: ", ";\n      line-height: ", ";\n    "])),
+    t.tooltipTextColor,
+    t.tooltipPaddingY, t.tooltipPaddingX,
 
+    t.tooltipFontSize,
+    t.tooltipLineHeight);
 
-  } };
-
-
-var jsStyles = (0, _Emotion.memoizeStyle)(styles);exports.jsStyles = jsStyles;
+  } });exports.styles = styles;

package/cjs/components/Tooltip/Tooltip.styles.js.map

@@ -1 +1 @@
-{"version":3,"sources":["Tooltip.styles.ts"],"names":["styles","cross","t","css","tooltipCloseBtnColor","tooltipCloseBtnPadding","tooltipCloseBtnHoverColor","tooltipContent","tooltipPaddingY","tooltipPaddingX","jsStyles"],"mappings":"8QAAA,oD;;;AAGA,IAAMA,MAAM,GAAG;AACbC,EAAAA,KADa,iBACPC,CADO,EACG;AACd,eAAOC,YAAP;AACWD,IAAAA,CAAC,CAACE,oBADb;;;;AAKaF,IAAAA,CAAC,CAACG,sBALf;;;;;;;;AAaaH,IAAAA,CAAC,CAACI,yBAbf;;;AAgBD,GAlBY;;AAoBbC,EAAAA,cApBa,0BAoBEL,CApBF,EAoBY;AACvB,eAAOC,YAAP;AACaD,IAAAA,CAAC,CAACM,eADf,EACkCN,CAAC,CAACO,eADpC;;;AAID,GAzBY,EAAf;;;AA4BO,IAAMC,QAAQ,GAAG,2BAAaV,MAAb,CAAjB,C","sourcesContent":["import { css, memoizeStyle } from '../../lib/theming/Emotion';\r\nimport { Theme } from '../../lib/theming/Theme';\r\n\r\nconst styles = {\r\n  cross(t: Theme) {\r\n    return css`\r\n      color: ${t.tooltipCloseBtnColor};\r\n      cursor: pointer;\r\n      height: 8px;\r\n      line-height: 0;\r\n      padding: ${t.tooltipCloseBtnPadding};\r\n      position: absolute;\r\n      right: 0;\r\n      top: 0;\r\n      width: 8px;\r\n      box-sizing: content-box;\r\n\r\n      &:hover {\r\n        color: ${t.tooltipCloseBtnHoverColor};\r\n      }\r\n    `;\r\n  },\r\n\r\n  tooltipContent(t: Theme) {\r\n    return css`\r\n      padding: ${t.tooltipPaddingY} ${t.tooltipPaddingX};\r\n      position: relative;\r\n    `;\r\n  },\r\n};\r\n\r\nexport const jsStyles = memoizeStyle(styles);\r\n"]}
+{"version":3,"sources":["Tooltip.styles.ts"],"names":["styles","cross","t","css","tooltipCloseBtnColor","tooltipCloseBtnPadding","tooltipCloseBtnHoverColor","tooltipContent","tooltipTextColor","tooltipPaddingY","tooltipPaddingX","tooltipFontSize","tooltipLineHeight"],"mappings":"4QAAA,oD;;;AAGO,IAAMA,MAAM,GAAG,2BAAa;AACjCC,EAAAA,KADiC,iBAC3BC,CAD2B,EACjB;AACd,eAAOC,YAAP;AACWD,IAAAA,CAAC,CAACE,oBADb;;;;AAKaF,IAAAA,CAAC,CAACG,sBALf;;;;;;;;AAaaH,IAAAA,CAAC,CAACI,yBAbf;;;AAgBD,GAlBgC;;AAoBjCC,EAAAA,cApBiC,0BAoBlBL,CApBkB,EAoBR;AACvB,eAAOC,YAAP;AACWD,IAAAA,CAAC,CAACM,gBADb;AAEaN,IAAAA,CAAC,CAACO,eAFf,EAEkCP,CAAC,CAACQ,eAFpC;;AAIeR,IAAAA,CAAC,CAACS,eAJjB;AAKiBT,IAAAA,CAAC,CAACU,iBALnB;;AAOD,GA5BgC,EAAb,CAAf,C","sourcesContent":["import { css, memoizeStyle } from '../../lib/theming/Emotion';\nimport { Theme } from '../../lib/theming/Theme';\n\nexport const styles = memoizeStyle({\n  cross(t: Theme) {\n    return css`\n      color: ${t.tooltipCloseBtnColor};\n      cursor: pointer;\n      height: 8px;\n      line-height: 0;\n      padding: ${t.tooltipCloseBtnPadding};\n      position: absolute;\n      right: 0;\n      top: 0;\n      width: 8px;\n      box-sizing: content-box;\n\n      &:hover {\n        color: ${t.tooltipCloseBtnHoverColor};\n      }\n    `;\n  },\n\n  tooltipContent(t: Theme) {\n    return css`\n      color: ${t.tooltipTextColor};\n      padding: ${t.tooltipPaddingY} ${t.tooltipPaddingX};\n      position: relative;\n      font-size: ${t.tooltipFontSize};\n      line-height: ${t.tooltipLineHeight};\n    `;\n  },\n});\n"]}

package/cjs/components/Tooltip/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["index.ts"],"names":[],"mappings":"uCAAA","sourcesContent":["export * from './Tooltip';\r\n"]}
+{"version":3,"sources":["index.ts"],"names":[],"mappings":"uCAAA","sourcesContent":["export * from './Tooltip';\n"]}