npm - @skbkontur/react-ui - Versions diffs - 5.5.2 → 5.6.1-85c65.0 - Mend

@skbkontur/react-ui 5.5.2 → 5.6.1-85c65.0

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.

Files changed (1989) hide show

package/internal/ThemeShowcase/ThemeShowcase/ThemeShowcase.js CHANGED Viewed

@@ -1,5 +1,7 @@
 import _inheritsLoose from "@babel/runtime/helpers/esm/inheritsLoose";
+var _class, _class2, _class3, _class4, _class5;
 import React from 'react';
+import { useEmotion, useStyles, withRenderEnvironment } from "../../../lib/renderEnvironment";
 import { isColor } from "../../../lib/styles/ColorHelpers";
 import { LIGHT_THEME as lightVariables } from "../../../lib/theming/themes/LightTheme";
 import { DARK_THEME as darkVariables } from "../../../lib/theming/themes/DarkTheme";
@@ -10,13 +12,12 @@ import { Sticky } from "../../../components/Sticky";
 import * as ColorFunctions from "../../../lib/styles/ColorFunctions";
 import { Tooltip } from "../../../components/Tooltip";
 import { IS_PROXY_SUPPORTED } from "../../../lib/Supports";
-import { cx } from "../../../lib/theming/Emotion";
 import { ThemeContext } from "../../../lib/theming/ThemeContext";
 import { ALL_USED_VARIABLES, CALLS_COUNT, COMPONENT_DESCRIPTIONS, COMPONENT_DESCRIPTIONS_BY_VARIABLE, EXECUTION_TIME } from "../VariablesCollector";
-import { styles } from "../ThemeShowcase.styles";
+import { getStyles } from "../ThemeShowcase.styles";
 var EMPTY_ARRAY = [];
 var ALL_VARIABLES = Object.keys(lightVariables);
-export var ThemeShowcase = /*#__PURE__*/function (_React$Component) {
+export var ThemeShowcase = withRenderEnvironment(_class = /*#__PURE__*/function (_React$Component) {
   function ThemeShowcase(props) {
     var _this;
     _this = _React$Component.call(this, props) || this;
@@ -61,6 +62,7 @@ export var ThemeShowcase = /*#__PURE__*/function (_React$Component) {
   var _proto = ThemeShowcase.prototype;
   _proto.render = function render() {
     var _this2 = this;
+    this.styles = getStyles(this.emotion);
     if (!IS_PROXY_SUPPORTED) {
       return /*#__PURE__*/React.createElement("div", null, "\u0422\u0430\u0431\u043B\u0438\u0446\u0430 \u0438\u0441\u043F\u043E\u043B\u044C\u0437\u043E\u0432\u0430\u043D\u0438\u044F \u043F\u0435\u0440\u0435\u043C\u0435\u043D\u043D\u044B\u0445 \u0434\u043E\u0441\u0442\u0443\u043F\u043D\u0430 \u0442\u043E\u043B\u044C\u043A\u043E \u0432", ' ', /*#__PURE__*/React.createElement(Link, {
         href: 'https://caniuse.com/#feat=proxy',
@@ -80,7 +82,7 @@ export var ThemeShowcase = /*#__PURE__*/function (_React$Component) {
       }, /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement(Sticky, {
         side: 'top'
       }, /*#__PURE__*/React.createElement("div", {
-        className: styles.searchBar(theme),
+        className: _this2.styles.searchBar(theme),
         "data-perf-info": executionTime + " " + callsCount
       }, /*#__PURE__*/React.createElement(Gapped, {
         gap: 15
@@ -124,8 +126,8 @@ export var ThemeShowcase = /*#__PURE__*/function (_React$Component) {
     });
   };
   return ThemeShowcase;
-}(React.Component);
-var ComponentShowcase = /*#__PURE__*/function (_React$Component2) {
+}(React.Component)) || _class;
+var ComponentShowcase = withRenderEnvironment(_class2 = /*#__PURE__*/function (_React$Component2) {
   function ComponentShowcase() {
     return _React$Component2.apply(this, arguments) || this;
   }
@@ -139,6 +141,7 @@ var ComponentShowcase = /*#__PURE__*/function (_React$Component2) {
       onVariableSelect = _this$props.onVariableSelect,
       isDebugMode = _this$props.isDebugMode;
     var elements = Object.keys(description);
+    this.styles = getStyles(this.emotion);
     return elements.length ? /*#__PURE__*/
     React.createElement(ThemeContext.Consumer, null, function (theme) {
       return /*#__PURE__*/(
@@ -147,38 +150,38 @@ var ComponentShowcase = /*#__PURE__*/function (_React$Component2) {
           side: 'top',
           offset: 40
         }, function (isSticky) {
-          var _cx;
+          var _this3$cx;
           return /*#__PURE__*/(
             React.createElement("h2", {
-              className: cx((_cx = {}, _cx[styles.heading(theme)] = true, _cx[styles.headingSticky()] = isSticky, _cx))
+              className: _this3.cx((_this3$cx = {}, _this3$cx[_this3.styles.heading(theme)] = true, _this3$cx[_this3.styles.headingSticky()] = isSticky, _this3$cx))
             }, _this3.props.name)
           );
         }), /*#__PURE__*/
         React.createElement("table", {
-          className: styles.table()
+          className: _this3.styles.table()
         }, /*#__PURE__*/
         React.createElement("thead", null, /*#__PURE__*/
         React.createElement("tr", null, /*#__PURE__*/
         React.createElement("th", {
-          className: styles.headerCell(),
+          className: _this3.styles.headerCell(),
           style: {
             width: 170
           }
         }, "ClassName"), /*#__PURE__*/
         React.createElement("th", {
-          className: styles.headerCell(),
+          className: _this3.styles.headerCell(),
           style: {
             width: 210
           }
         }, "Variable Name"), /*#__PURE__*/
         React.createElement("th", {
-          className: styles.headerCell(),
+          className: _this3.styles.headerCell(),
           style: {
             width: 250
           }
         }, "Default Value"), /*#__PURE__*/
         React.createElement("th", {
-          className: styles.headerCell(),
+          className: _this3.styles.headerCell(),
           style: {
             width: 250
           }
@@ -198,8 +201,8 @@ var ComponentShowcase = /*#__PURE__*/function (_React$Component2) {
     }) : null;
   };
   return ComponentShowcase;
-}(React.Component);
-var ComponentShowcaseRow = /*#__PURE__*/function (_React$Component3) {
+}(React.Component)) || _class2;
+var ComponentShowcaseRow = withRenderEnvironment(_class3 = /*#__PURE__*/function (_React$Component3) {
   function ComponentShowcaseRow() {
     return _React$Component3.apply(this, arguments) || this;
   }
@@ -212,31 +215,33 @@ var ComponentShowcaseRow = /*#__PURE__*/function (_React$Component3) {
       row = _this$props2.row,
       isDebugMode = _this$props2.isDebugMode;
     var rowSpan = row.variables.length + 1;
+    this.styles = getStyles(this.emotion);
     return /*#__PURE__*/(
       React.createElement(ThemeContext.Consumer, null, function (theme) {
-        var _cx2;
+        var _this4$cx;
         return /*#__PURE__*/(
           React.createElement(React.Fragment, null, /*#__PURE__*/
           React.createElement("tr", {
-            className: cx(styles.invisibleRow(), (_cx2 = {}, _cx2[styles.invisibleDarkRow()] = theme === darkVariables, _cx2))
+            className: _this4.cx(_this4.styles.invisibleRow(), (_this4$cx = {}, _this4$cx[_this4.styles.invisibleDarkRow()] = theme === darkVariables, _this4$cx))
           }, /*#__PURE__*/
           React.createElement("td", {
-            className: cx(styles.cell(), styles.majorCell()),
+            className: _this4.cx(_this4.styles.cell(), _this4.styles.majorCell()),
             rowSpan: rowSpan
           }, /*#__PURE__*/
           React.createElement("span", {
-            className: styles.elementName()
+            className: _this4.styles.elementName()
           }, ".", el)), /*#__PURE__*/
           React.createElement("td", {
-            className: styles.invisibleCell()
+            className: _this4.styles.invisibleCell()
           }), /*#__PURE__*/
           React.createElement("td", {
-            className: styles.invisibleCell()
+            className: _this4.styles.invisibleCell()
           }), /*#__PURE__*/
           React.createElement("td", {
-            className: styles.invisibleCell()
+            className: _this4.styles.invisibleCell()
           })), row.variables.map(function (varName) {
-            var _cx3;
+            var _this4$cx2;
             var dependencies = row.dependencies[varName] || EMPTY_ARRAY;
             var variableDefault = lightVariables[varName];
             var variableDark = darkVariables[varName];
@@ -244,11 +249,11 @@ var ComponentShowcaseRow = /*#__PURE__*/function (_React$Component3) {
             return /*#__PURE__*/(
               React.createElement("tr", {
                 key: el + "_" + varName,
-                className: cx(styles.row(), (_cx3 = {}, _cx3[styles.suspiciousRow()] = hasNoVariables, _cx3[styles.darkRow()] = theme === darkVariables, _cx3))
+                className: _this4.cx(_this4.styles.row(), (_this4$cx2 = {}, _this4$cx2[_this4.styles.suspiciousRow()] = hasNoVariables, _this4$cx2[_this4.styles.darkRow()] = theme === darkVariables, _this4$cx2))
               }, /*#__PURE__*/
               React.createElement("td", {
-                className: styles.cell()
+                className: _this4.styles.cell()
               }, /*#__PURE__*/
               React.createElement(VariableName, {
                 variableName: varName,
@@ -256,13 +261,13 @@ var ComponentShowcaseRow = /*#__PURE__*/function (_React$Component3) {
                 onVariableSelect: _this4.props.onVariableSelect
               })), /*#__PURE__*/
               React.createElement("td", {
-                className: styles.cell()
+                className: _this4.styles.cell()
               }, /*#__PURE__*/
               React.createElement(VariableValue, {
                 value: variableDefault
               })), /*#__PURE__*/
               React.createElement("td", {
-                className: styles.cell()
+                className: _this4.styles.cell()
               }, /*#__PURE__*/
               React.createElement(VariableValue, {
                 value: variableDark
@@ -274,8 +279,8 @@ var ComponentShowcaseRow = /*#__PURE__*/function (_React$Component3) {
     );
   };
   return ComponentShowcaseRow;
-}(React.Component);
-var VariableName = /*#__PURE__*/function (_React$Component4) {
+}(React.Component)) || _class3;
+var VariableName = withRenderEnvironment(_class4 = /*#__PURE__*/function (_React$Component4) {
   function VariableName() {
     var _this5;
     for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
@@ -298,8 +303,9 @@ var VariableName = /*#__PURE__*/function (_React$Component4) {
   _inheritsLoose(VariableName, _React$Component4);
   var _proto4 = VariableName.prototype;
   _proto4.render = function render() {
+    this.styles = getStyles(this.emotion);
     return /*#__PURE__*/React.createElement("span", null, /*#__PURE__*/React.createElement("span", {
-      className: styles.variableName(),
+      className: this.styles.variableName(),
       onClick: this.handleVariableSelect
     }, this.props.variableName), this.props.dependencies.length > 0 && this.renderDependencies());
   };
@@ -316,8 +322,8 @@ var VariableName = /*#__PURE__*/function (_React$Component4) {
     }));
   };
   return VariableName;
-}(React.Component);
-var DependencyName = /*#__PURE__*/function (_React$Component5) {
+}(React.Component)) || _class4;
+var DependencyName = withRenderEnvironment(_class5 = /*#__PURE__*/function (_React$Component5) {
   function DependencyName() {
     var _this6;
     for (var _len2 = arguments.length, args = new Array(_len2), _key2 = 0; _key2 < _len2; _key2++) {
@@ -354,19 +360,23 @@ var DependencyName = /*#__PURE__*/function (_React$Component5) {
   _inheritsLoose(DependencyName, _React$Component5);
   var _proto5 = DependencyName.prototype;
   _proto5.render = function render() {
+    this.styles = getStyles(this.emotion);
     return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("br", null), "\u2013", ' ', /*#__PURE__*/React.createElement(Tooltip, {
       trigger: 'hover',
       render: this.getValues,
       pos: 'right middle'
     }, /*#__PURE__*/React.createElement("span", {
-      className: styles.variableName(),
+      className: this.styles.variableName(),
       onClick: this.handleDependencySelect
     }, this.props.dependencyName)));
   };
   return DependencyName;
-}(React.Component);
+}(React.Component)) || _class5;
 var VariableValue = function VariableValue(props) {
-  var _cx4;
+  var _cx;
+  var _useEmotion = useEmotion(),
+    cx = _useEmotion.cx;
+  var styles = useStyles(getStyles);
   var value = props.value;
   var valueIsColor = isColor(value);
   var valueIsGradient = isGradient(value);
@@ -377,7 +387,7 @@ var VariableValue = function VariableValue(props) {
   }
   return /*#__PURE__*/(
     React.createElement("span", {
-      className: cx((_cx4 = {}, _cx4[styles.undefined()] = !value, _cx4))
+      className: cx((_cx = {}, _cx[styles.undefined()] = !value, _cx))
     }, hasExample && /*#__PURE__*/React.createElement("span", {
       className: styles.colorExample(),
       style: {
@@ -388,6 +398,7 @@ var VariableValue = function VariableValue(props) {
   );
 };
 var ShowUnusedVariables = function ShowUnusedVariables(props) {
+  var styles = getStyles(useEmotion());
   if (props.diff.length === 0) {
     return null;
   }

package/internal/ThemeShowcase/ThemeShowcase/ThemeShowcase.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"names":["React","isColor","LIGHT_THEME","lightVariables","DARK_THEME","darkVariables","ComboBox","Gapped","Link","Sticky","ColorFunctions","Tooltip","IS_PROXY_SUPPORTED","cx","ThemeContext","ALL_USED_VARIABLES","CALLS_COUNT","COMPONENT_DESCRIPTIONS","COMPONENT_DESCRIPTIONS_BY_VARIABLE","EXECUTION_TIME","styles","EMPTY_ARRAY","ALL_VARIABLES","Object","keys","ThemeShowcase","_React$Component","props","_this","call","state","isUnmounting","variablesDiff","getItems","query","Promise","resolve","getValues","handleVariableChange","item","setState","selectedVariable","handleUnexpectedVariableInput","values","length","resetVariable","undefined","isDebugMode","forEach","variable","found","includes","push","_inheritsLoose","_proto","prototype","render","_this2","createElement","href","target","descriptionsToRender","value","callsCount","executionTime","toFixed","Consumer","theme","wrap","gap","verticalAlign","side","className","searchBar","onValueChange","onUnexpectedInput","placeholder","onClick","sort","map","componentName","ComponentShowcase","key","name","description","onVariableSelect","ShowUnusedVariables","diff","componentWillUnmount","lowerCaseQuery","toLowerCase","trim","allItems","filter","usedVariable","startsWith","usedVariableName","label","Component","_React$Component2","apply","arguments","_proto2","_this3","_this$props","elements","Fragment","offset","isSticky","_cx","heading","headingSticky","table","headerCell","style","width","el","ComponentShowcaseRow","element","row","_React$Component3","_proto3","_this4","_this$props2","rowSpan","variables","_cx2","invisibleRow","invisibleDarkRow","cell","majorCell","elementName","invisibleCell","varName","_cx3","dependencies","variableDefault","variableDark","hasNoVariables","suspiciousRow","darkRow","VariableName","variableName","VariableValue","_React$Component4","_this5","_len","args","Array","_key","concat","handleVariableSelect","_this5$props","_proto4","renderDependencies","_this$props3","dependency","DependencyName","dependencyName","onDependencySelect","_React$Component5","_this6","_len2","_key2","dependencyDefault","dependencyDark","handleDependencySelect","_this6$props","_proto5","trigger","pos","_cx4","valueIsColor","valueIsGradient","isGradient","hasExample","borderColor","contrast","colorExample","background","unusedVariablesWarning","v","input"],"sources":["ThemeShowcase.tsx"],"sourcesContent":["import React from 'react';\n\nimport { isColor } from '../../lib/styles/ColorHelpers';\nimport { LIGHT_THEME as lightVariables } from '../../lib/theming/themes/LightTheme';\nimport { DARK_THEME as darkVariables } from '../../lib/theming/themes/DarkTheme';\nimport type { ComboBoxItem } from '../../components/ComboBox';\nimport { ComboBox } from '../../components/ComboBox';\nimport { Gapped } from '../../components/Gapped';\nimport { Link } from '../../components/Link';\nimport { Sticky } from '../../components/Sticky';\nimport * as ColorFunctions from '../../lib/styles/ColorFunctions';\nimport { Tooltip } from '../../components/Tooltip';\nimport { IS_PROXY_SUPPORTED } from '../../lib/Supports';\nimport type { Theme } from '../../lib/theming/Theme';\nimport { cx } from '../../lib/theming/Emotion';\nimport { ThemeContext } from '../../lib/theming/ThemeContext';\n\nimport type { ComponentDescriptionType, ComponentRowDescriptionType } from './VariablesCollector';\nimport {\n ALL_USED_VARIABLES,\n CALLS_COUNT,\n COMPONENT_DESCRIPTIONS,\n COMPONENT_DESCRIPTIONS_BY_VARIABLE,\n EXECUTION_TIME,\n} from './VariablesCollector';\nimport { styles } from './ThemeShowcase.styles';\n\nconst EMPTY_ARRAY: string[] = [];\n\nconst ALL_VARIABLES = Object.keys(lightVariables) as Array<keyof Theme>;\n\ninterface ShowcaseProps {\n isDebugMode?: boolean;\n}\ninterface ShowcaseState {\n selectedVariable?: ComboBoxItem;\n}\n\nexport class ThemeShowcase extends React.Component<ShowcaseProps, ShowcaseState> {\n public state: ShowcaseState = {};\n\n private isUnmounting = false;\n private variablesDiff: string[] = [];\n\n constructor(props: ShowcaseProps) {\n super(props);\n if (props.isDebugMode) {\n ALL_VARIABLES.forEach((variable) => {\n const found = ALL_USED_VARIABLES.includes(variable);\n if (!found) {\n this.variablesDiff.push(variable);\n }\n });\n }\n }\n\n public render() {\n if (!IS_PROXY_SUPPORTED) {\n return (\n <div>\n Таблица использования переменных доступна только в{' '}\n <Link href={'https://caniuse.com/#feat=proxy'} target={'_blank'}>\n браузерах с поддержкой Proxy\n </Link>\n .\n </div>\n );\n }\n\n const selectedVariable = this.state.selectedVariable;\n const descriptionsToRender = selectedVariable\n ? COMPONENT_DESCRIPTIONS_BY_VARIABLE[selectedVariable.value] \|\| {}\n : COMPONENT_DESCRIPTIONS;\n\n const isDebugMode = this.props.isDebugMode;\n const callsCount = isDebugMode ? `(${CALLS_COUNT} вызовов)` : '';\n const executionTime = isDebugMode ? `Сгенерировано за ${EXECUTION_TIME.toFixed(3)}ms` : '';\n\n return (\n <ThemeContext.Consumer>\n {(theme) => {\n return (\n <Gapped wrap gap={30} verticalAlign={'top'}>\n <div>\n <Sticky side={'top'}>\n <div className={styles.searchBar(theme)} data-perf-info={`${executionTime} ${callsCount}`}>\n <Gapped gap={15}>\n <ComboBox\n getItems={this.getItems}\n value={selectedVariable}\n onValueChange={this.handleVariableChange}\n onUnexpectedInput={this.handleUnexpectedVariableInput}\n placeholder={'поиск по названию переменной'}\n />\n {!!selectedVariable && <Link onClick={this.resetVariable}>сбросить</Link>}\n </Gapped>\n </div>\n </Sticky>\n {Object.keys(descriptionsToRender)\n .sort()\n .map((componentName) => (\n <ComponentShowcase\n key={componentName}\n name={componentName}\n description={descriptionsToRender[componentName]}\n isDebugMode={isDebugMode}\n onVariableSelect={this.handleVariableChange}\n />\n ))}\n </div>\n <ShowUnusedVariables diff={this.variablesDiff} />\n </Gapped>\n );\n }}\n </ThemeContext.Consumer>\n );\n }\n public componentWillUnmount(): void {\n this.isUnmounting = true;\n }\n\n private getValues(query: string) {\n const lowerCaseQuery = query && query.toLowerCase().trim();\n let allItems = ALL_USED_VARIABLES;\n if (lowerCaseQuery) {\n allItems = ALL_USED_VARIABLES.filter((usedVariable) => usedVariable.toLowerCase().startsWith(lowerCaseQuery));\n }\n return allItems.map((usedVariableName) => ({\n value: usedVariableName,\n label: usedVariableName,\n }));\n }\n private getItems = (query: string) => {\n return Promise.resolve(this.getValues(query));\n };\n private handleVariableChange = (item: ComboBoxItem) => {\n if (!this.isUnmounting) {\n this.setState({ selectedVariable: item });\n }\n };\n private handleUnexpectedVariableInput = (query: string) => {\n const values = this.getValues(query);\n if (values.length > 0) {\n return values[0];\n }\n\n return this.resetVariable();\n };\n private resetVariable = () => {\n if (!this.isUnmounting) {\n this.setState({ selectedVariable: undefined });\n }\n };\n}\n\ninterface ComponentShowcaseProps {\n name: string;\n description: ComponentDescriptionType;\n isDebugMode?: boolean;\n onVariableSelect: (item: ComboBoxItem) => void;\n}\nclass ComponentShowcase extends React.Component<ComponentShowcaseProps> {\n public render() {\n const { name, description, onVariableSelect, isDebugMode } = this.props;\n const elements = Object.keys(description);\n\n return elements.length ? (\n <ThemeContext.Consumer>\n {(theme) => {\n return (\n <React.Fragment>\n <Sticky side={'top'} offset={40}>\n {(isSticky) => (\n <h2\n className={cx({\n [styles.heading(theme)]: true,\n [styles.headingSticky()]: isSticky,\n })}\n >\n {this.props.name}\n </h2>\n )}\n </Sticky>\n <table className={styles.table()}>\n <thead>\n <tr>\n <th className={styles.headerCell()} style={{ width: 170 }}>\n ClassName\n </th>\n <th className={styles.headerCell()} style={{ width: 210 }}>\n Variable Name\n </th>\n <th className={styles.headerCell()} style={{ width: 250 }}>\n Default Value\n </th>\n <th className={styles.headerCell()} style={{ width: 250 }}>\n Dark Value\n </th>\n </tr>\n </thead>\n <tbody>\n {elements.map((el) => (\n <ComponentShowcaseRow\n key={`${name}_${el}`}\n element={el}\n row={description[el]}\n onVariableSelect={onVariableSelect}\n isDebugMode={isDebugMode}\n />\n ))}\n </tbody>\n </table>\n </React.Fragment>\n );\n }}\n </ThemeContext.Consumer>\n ) : null;\n }\n}\n\ninterface ComponentShowcaseRowProps {\n element: string;\n row: ComponentRowDescriptionType;\n isDebugMode?: boolean;\n onVariableSelect: (item: ComboBoxItem) => void;\n}\n\nclass ComponentShowcaseRow extends React.Component<ComponentShowcaseRowProps> {\n public render() {\n const { element: el, row, isDebugMode } = this.props;\n const rowSpan = row.variables.length + 1;\n\n return (\n <ThemeContext.Consumer>\n {(theme) => {\n return (\n <React.Fragment>\n <tr className={cx(styles.invisibleRow(), { [styles.invisibleDarkRow()]: theme === darkVariables })}>\n <td className={cx(styles.cell(), styles.majorCell())} rowSpan={rowSpan}>\n <span className={styles.elementName()}>.{el}</span>\n </td>\n <td className={styles.invisibleCell()} />\n <td className={styles.invisibleCell()} />\n <td className={styles.invisibleCell()} />\n </tr>\n {row.variables.map((varName) => {\n const dependencies = row.dependencies[varName] \|\| EMPTY_ARRAY;\n const variableDefault = lightVariables[varName] as string;\n const variableDark = darkVariables[varName] as string;\n const hasNoVariables = isDebugMode && !variableDefault;\n return (\n <tr\n key={`${el}_${varName}`}\n className={cx(styles.row(), {\n [styles.suspiciousRow()]: hasNoVariables,\n [styles.darkRow()]: theme === darkVariables,\n })}\n >\n <td className={styles.cell()}>\n <VariableName\n variableName={varName as string}\n dependencies={dependencies}\n onVariableSelect={this.props.onVariableSelect}\n />\n </td>\n <td className={styles.cell()}>\n <VariableValue value={variableDefault} />\n </td>\n <td className={styles.cell()}>\n <VariableValue value={variableDark} />\n </td>\n </tr>\n );\n })}\n </React.Fragment>\n );\n }}\n </ThemeContext.Consumer>\n );\n }\n}\n\ninterface VariableNameProps {\n variableName: string;\n dependencies: Array<keyof Theme>;\n onVariableSelect: (item: ComboBoxItem) => void;\n}\n\nclass VariableName extends React.Component<VariableNameProps> {\n public render() {\n return (\n <span>\n <span className={styles.variableName()} onClick={this.handleVariableSelect}>\n {this.props.variableName}\n </span>\n {this.props.dependencies.length > 0 && this.renderDependencies()}\n </span>\n );\n }\n\n private renderDependencies() {\n const { dependencies, onVariableSelect } = this.props;\n return (\n <React.Fragment>\n <br />\n <br />\n зависит от:\n {dependencies.map((dependency) => (\n <DependencyName\n key={`dependency_${dependency}`}\n dependencyName={dependency}\n onDependencySelect={onVariableSelect}\n />\n ))}\n </React.Fragment>\n );\n }\n\n private handleVariableSelect = () => {\n const { variableName, onVariableSelect } = this.props;\n if (onVariableSelect) {\n onVariableSelect({ value: variableName, label: variableName });\n }\n };\n}\n\ninterface DependencyNameProps {\n dependencyName: keyof Theme;\n onDependencySelect: (item: ComboBoxItem) => void;\n}\nclass DependencyName extends React.Component<DependencyNameProps> {\n public render() {\n return (\n <React.Fragment>\n <br />\n –{' '}\n <Tooltip trigger={'hover'} render={this.getValues} pos={'right middle'}>\n <span className={styles.variableName()} onClick={this.handleDependencySelect}>\n {this.props.dependencyName}\n </span>\n </Tooltip>\n </React.Fragment>\n );\n }\n\n private getValues = () => {\n const dependencyName = this.props.dependencyName;\n const dependencyDefault = lightVariables[dependencyName] as string;\n const dependencyDark = darkVariables[dependencyName] as string;\n return (\n <React.Fragment>\n <span>Default value: {<VariableValue value={dependencyDefault} />}</span>\n <span>Dark value: {<VariableValue value={dependencyDark} />}</span>\n </React.Fragment>\n );\n };\n\n private handleDependencySelect = () => {\n const { dependencyName, onDependencySelect } = this.props;\n if (onDependencySelect) {\n onDependencySelect({ value: dependencyName, label: dependencyName });\n }\n };\n}\n\nconst VariableValue = (props: { value: string }) => {\n const value = props.value;\n const valueIsColor = isColor(value);\n const valueIsGradient = isGradient(value);\n const hasExample = valueIsColor \|\| valueIsGradient;\n let borderColor = 'transparent';\n if (hasExample) {\n borderColor = valueIsColor ? ColorFunctions.contrast(value) : '#000';\n }\n\n return (\n <span className={cx({ [styles.undefined()]: !value })}>\n {hasExample && <span className={styles.colorExample()} style={{ background: value, borderColor }} />}\n {value \|\| 'undefined'}\n </span>\n );\n};\n\nconst ShowUnusedVariables = (props: { diff: string[] }) => {\n if (props.diff.length === 0) {\n return null;\n }\n\n return (\n <div className={styles.unusedVariablesWarning()}>\n Неиспользованные переменные ({props.diff.length}\n ):\n <ul>\n {props.diff.sort().map((v) => (\n <li key={v}>{v}</li>\n ))}\n </ul>\n </div>\n );\n};\n\nfunction isGradient(input: string) {\n return !!input && input.startsWith('linear-gradient');\n}\n"],"mappings":"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","ignoreList":[]}
1	+ {"version":3,"names":["React","useEmotion","useStyles","withRenderEnvironment","isColor","LIGHT_THEME","lightVariables","DARK_THEME","darkVariables","ComboBox","Gapped","Link","Sticky","ColorFunctions","Tooltip","IS_PROXY_SUPPORTED","ThemeContext","ALL_USED_VARIABLES","CALLS_COUNT","COMPONENT_DESCRIPTIONS","COMPONENT_DESCRIPTIONS_BY_VARIABLE","EXECUTION_TIME","getStyles","EMPTY_ARRAY","ALL_VARIABLES","Object","keys","ThemeShowcase","_class","_React$Component","props","_this","call","state","isUnmounting","variablesDiff","getItems","query","Promise","resolve","getValues","handleVariableChange","item","setState","selectedVariable","handleUnexpectedVariableInput","values","length","resetVariable","undefined","isDebugMode","forEach","variable","found","includes","push","_inheritsLoose","_proto","prototype","render","_this2","styles","emotion","createElement","href","target","descriptionsToRender","value","callsCount","executionTime","toFixed","Consumer","theme","wrap","gap","verticalAlign","side","className","searchBar","onValueChange","onUnexpectedInput","placeholder","onClick","sort","map","componentName","ComponentShowcase","key","name","description","onVariableSelect","ShowUnusedVariables","diff","componentWillUnmount","lowerCaseQuery","toLowerCase","trim","allItems","filter","usedVariable","startsWith","usedVariableName","label","Component","_class2","_React$Component2","apply","arguments","_proto2","_this3","_this$props","elements","Fragment","offset","isSticky","_this3$cx","cx","heading","headingSticky","table","headerCell","style","width","el","ComponentShowcaseRow","element","row","_class3","_React$Component3","_proto3","_this4","_this$props2","rowSpan","variables","_this4$cx","invisibleRow","invisibleDarkRow","cell","majorCell","elementName","invisibleCell","varName","_this4$cx2","dependencies","variableDefault","variableDark","hasNoVariables","suspiciousRow","darkRow","VariableName","variableName","VariableValue","_class4","_React$Component4","_this5","_len","args","Array","_key","concat","handleVariableSelect","_this5$props","_proto4","renderDependencies","_this$props3","dependency","DependencyName","dependencyName","onDependencySelect","_class5","_React$Component5","_this6","_len2","_key2","dependencyDefault","dependencyDark","handleDependencySelect","_this6$props","_proto5","trigger","pos","_cx","_useEmotion","valueIsColor","valueIsGradient","isGradient","hasExample","borderColor","contrast","colorExample","background","unusedVariablesWarning","v","input"],"sources":["ThemeShowcase.tsx"],"sourcesContent":["import React from 'react';\nimport type { Emotion } from '@emotion/css/types/create-instance';\n\nimport { useEmotion, useStyles, withRenderEnvironment } from '../../lib/renderEnvironment';\nimport { isColor } from '../../lib/styles/ColorHelpers';\nimport { LIGHT_THEME as lightVariables } from '../../lib/theming/themes/LightTheme';\nimport { DARK_THEME as darkVariables } from '../../lib/theming/themes/DarkTheme';\nimport type { ComboBoxItem } from '../../components/ComboBox';\nimport { ComboBox } from '../../components/ComboBox';\nimport { Gapped } from '../../components/Gapped';\nimport { Link } from '../../components/Link';\nimport { Sticky } from '../../components/Sticky';\nimport * as ColorFunctions from '../../lib/styles/ColorFunctions';\nimport { Tooltip } from '../../components/Tooltip';\nimport { IS_PROXY_SUPPORTED } from '../../lib/Supports';\nimport type { Theme } from '../../lib/theming/Theme';\nimport { ThemeContext } from '../../lib/theming/ThemeContext';\n\nimport type { ComponentDescriptionType, ComponentRowDescriptionType } from './VariablesCollector';\nimport {\n ALL_USED_VARIABLES,\n CALLS_COUNT,\n COMPONENT_DESCRIPTIONS,\n COMPONENT_DESCRIPTIONS_BY_VARIABLE,\n EXECUTION_TIME,\n} from './VariablesCollector';\nimport { getStyles } from './ThemeShowcase.styles';\n\nconst EMPTY_ARRAY: string[] = [];\n\nconst ALL_VARIABLES = Object.keys(lightVariables) as Array<keyof Theme>;\n\ninterface ShowcaseProps {\n isDebugMode?: boolean;\n}\ninterface ShowcaseState {\n selectedVariable?: ComboBoxItem;\n}\n\n@withRenderEnvironment\nexport class ThemeShowcase extends React.Component<ShowcaseProps, ShowcaseState> {\n public state: ShowcaseState = {};\n\n private emotion!: Emotion;\n private styles!: ReturnType<typeof getStyles>;\n private isUnmounting = false;\n private variablesDiff: string[] = [];\n\n constructor(props: ShowcaseProps) {\n super(props);\n if (props.isDebugMode) {\n ALL_VARIABLES.forEach((variable) => {\n const found = ALL_USED_VARIABLES.includes(variable);\n if (!found) {\n this.variablesDiff.push(variable);\n }\n });\n }\n }\n\n public render() {\n this.styles = getStyles(this.emotion);\n\n if (!IS_PROXY_SUPPORTED) {\n return (\n <div>\n Таблица использования переменных доступна только в{' '}\n <Link href={'https://caniuse.com/#feat=proxy'} target={'_blank'}>\n браузерах с поддержкой Proxy\n </Link>\n .\n </div>\n );\n }\n\n const selectedVariable = this.state.selectedVariable;\n const descriptionsToRender = selectedVariable\n ? COMPONENT_DESCRIPTIONS_BY_VARIABLE[selectedVariable.value] \|\| {}\n : COMPONENT_DESCRIPTIONS;\n\n const isDebugMode = this.props.isDebugMode;\n const callsCount = isDebugMode ? `(${CALLS_COUNT} вызовов)` : '';\n const executionTime = isDebugMode ? `Сгенерировано за ${EXECUTION_TIME.toFixed(3)}ms` : '';\n\n return (\n <ThemeContext.Consumer>\n {(theme) => {\n return (\n <Gapped wrap gap={30} verticalAlign={'top'}>\n <div>\n <Sticky side={'top'}>\n <div className={this.styles.searchBar(theme)} data-perf-info={`${executionTime} ${callsCount}`}>\n <Gapped gap={15}>\n <ComboBox\n getItems={this.getItems}\n value={selectedVariable}\n onValueChange={this.handleVariableChange}\n onUnexpectedInput={this.handleUnexpectedVariableInput}\n placeholder={'поиск по названию переменной'}\n />\n {!!selectedVariable && <Link onClick={this.resetVariable}>сбросить</Link>}\n </Gapped>\n </div>\n </Sticky>\n {Object.keys(descriptionsToRender)\n .sort()\n .map((componentName) => (\n <ComponentShowcase\n key={componentName}\n name={componentName}\n description={descriptionsToRender[componentName]}\n isDebugMode={isDebugMode}\n onVariableSelect={this.handleVariableChange}\n />\n ))}\n </div>\n <ShowUnusedVariables diff={this.variablesDiff} />\n </Gapped>\n );\n }}\n </ThemeContext.Consumer>\n );\n }\n public componentWillUnmount(): void {\n this.isUnmounting = true;\n }\n\n private getValues(query: string) {\n const lowerCaseQuery = query && query.toLowerCase().trim();\n let allItems = ALL_USED_VARIABLES;\n if (lowerCaseQuery) {\n allItems = ALL_USED_VARIABLES.filter((usedVariable) => usedVariable.toLowerCase().startsWith(lowerCaseQuery));\n }\n return allItems.map((usedVariableName) => ({\n value: usedVariableName,\n label: usedVariableName,\n }));\n }\n private getItems = (query: string) => {\n return Promise.resolve(this.getValues(query));\n };\n private handleVariableChange = (item: ComboBoxItem) => {\n if (!this.isUnmounting) {\n this.setState({ selectedVariable: item });\n }\n };\n private handleUnexpectedVariableInput = (query: string) => {\n const values = this.getValues(query);\n if (values.length > 0) {\n return values[0];\n }\n\n return this.resetVariable();\n };\n private resetVariable = () => {\n if (!this.isUnmounting) {\n this.setState({ selectedVariable: undefined });\n }\n };\n}\n\ninterface ComponentShowcaseProps {\n name: string;\n description: ComponentDescriptionType;\n isDebugMode?: boolean;\n onVariableSelect: (item: ComboBoxItem) => void;\n}\n@withRenderEnvironment\nclass ComponentShowcase extends React.Component<ComponentShowcaseProps> {\n private emotion!: Emotion;\n private cx!: Emotion['cx'];\n private styles!: ReturnType<typeof getStyles>;\n\n public render() {\n const { name, description, onVariableSelect, isDebugMode } = this.props;\n const elements = Object.keys(description);\n this.styles = getStyles(this.emotion);\n\n return elements.length ? (\n <ThemeContext.Consumer>\n {(theme) => {\n return (\n <React.Fragment>\n <Sticky side={'top'} offset={40}>\n {(isSticky) => (\n <h2\n className={this.cx({\n [this.styles.heading(theme)]: true,\n [this.styles.headingSticky()]: isSticky,\n })}\n >\n {this.props.name}\n </h2>\n )}\n </Sticky>\n <table className={this.styles.table()}>\n <thead>\n <tr>\n <th className={this.styles.headerCell()} style={{ width: 170 }}>\n ClassName\n </th>\n <th className={this.styles.headerCell()} style={{ width: 210 }}>\n Variable Name\n </th>\n <th className={this.styles.headerCell()} style={{ width: 250 }}>\n Default Value\n </th>\n <th className={this.styles.headerCell()} style={{ width: 250 }}>\n Dark Value\n </th>\n </tr>\n </thead>\n <tbody>\n {elements.map((el) => (\n <ComponentShowcaseRow\n key={`${name}_${el}`}\n element={el}\n row={description[el]}\n onVariableSelect={onVariableSelect}\n isDebugMode={isDebugMode}\n />\n ))}\n </tbody>\n </table>\n </React.Fragment>\n );\n }}\n </ThemeContext.Consumer>\n ) : null;\n }\n}\n\ninterface ComponentShowcaseRowProps {\n element: string;\n row: ComponentRowDescriptionType;\n isDebugMode?: boolean;\n onVariableSelect: (item: ComboBoxItem) => void;\n}\n\n@withRenderEnvironment\nclass ComponentShowcaseRow extends React.Component<ComponentShowcaseRowProps> {\n private emotion!: Emotion;\n private cx!: Emotion['cx'];\n private styles!: ReturnType<typeof getStyles>;\n\n public render() {\n const { element: el, row, isDebugMode } = this.props;\n const rowSpan = row.variables.length + 1;\n this.styles = getStyles(this.emotion);\n\n return (\n <ThemeContext.Consumer>\n {(theme) => {\n return (\n <React.Fragment>\n <tr\n className={this.cx(this.styles.invisibleRow(), {\n [this.styles.invisibleDarkRow()]: theme === darkVariables,\n })}\n >\n <td className={this.cx(this.styles.cell(), this.styles.majorCell())} rowSpan={rowSpan}>\n <span className={this.styles.elementName()}>.{el}</span>\n </td>\n <td className={this.styles.invisibleCell()} />\n <td className={this.styles.invisibleCell()} />\n <td className={this.styles.invisibleCell()} />\n </tr>\n {row.variables.map((varName) => {\n const dependencies = row.dependencies[varName] \|\| EMPTY_ARRAY;\n const variableDefault = lightVariables[varName] as string;\n const variableDark = darkVariables[varName] as string;\n const hasNoVariables = isDebugMode && !variableDefault;\n return (\n <tr\n key={`${el}_${varName}`}\n className={this.cx(this.styles.row(), {\n [this.styles.suspiciousRow()]: hasNoVariables,\n [this.styles.darkRow()]: theme === darkVariables,\n })}\n >\n <td className={this.styles.cell()}>\n <VariableName\n variableName={varName as string}\n dependencies={dependencies}\n onVariableSelect={this.props.onVariableSelect}\n />\n </td>\n <td className={this.styles.cell()}>\n <VariableValue value={variableDefault} />\n </td>\n <td className={this.styles.cell()}>\n <VariableValue value={variableDark} />\n </td>\n </tr>\n );\n })}\n </React.Fragment>\n );\n }}\n </ThemeContext.Consumer>\n );\n }\n}\n\ninterface VariableNameProps {\n variableName: string;\n dependencies: Array<keyof Theme>;\n onVariableSelect: (item: ComboBoxItem) => void;\n}\n\n@withRenderEnvironment\nclass VariableName extends React.Component<VariableNameProps> {\n private emotion!: Emotion;\n private styles!: ReturnType<typeof getStyles>;\n\n public render() {\n this.styles = getStyles(this.emotion);\n\n return (\n <span>\n <span className={this.styles.variableName()} onClick={this.handleVariableSelect}>\n {this.props.variableName}\n </span>\n {this.props.dependencies.length > 0 && this.renderDependencies()}\n </span>\n );\n }\n\n private renderDependencies() {\n const { dependencies, onVariableSelect } = this.props;\n return (\n <React.Fragment>\n <br />\n <br />\n зависит от:\n {dependencies.map((dependency) => (\n <DependencyName\n key={`dependency_${dependency}`}\n dependencyName={dependency}\n onDependencySelect={onVariableSelect}\n />\n ))}\n </React.Fragment>\n );\n }\n\n private handleVariableSelect = () => {\n const { variableName, onVariableSelect } = this.props;\n if (onVariableSelect) {\n onVariableSelect({ value: variableName, label: variableName });\n }\n };\n}\n\ninterface DependencyNameProps {\n dependencyName: keyof Theme;\n onDependencySelect: (item: ComboBoxItem) => void;\n}\n\n@withRenderEnvironment\nclass DependencyName extends React.Component<DependencyNameProps> {\n private emotion!: Emotion;\n private styles!: ReturnType<typeof getStyles>;\n\n public render() {\n this.styles = getStyles(this.emotion);\n\n return (\n <React.Fragment>\n <br />\n –{' '}\n <Tooltip trigger={'hover'} render={this.getValues} pos={'right middle'}>\n <span className={this.styles.variableName()} onClick={this.handleDependencySelect}>\n {this.props.dependencyName}\n </span>\n </Tooltip>\n </React.Fragment>\n );\n }\n\n private getValues = () => {\n const dependencyName = this.props.dependencyName;\n const dependencyDefault = lightVariables[dependencyName] as string;\n const dependencyDark = darkVariables[dependencyName] as string;\n return (\n <React.Fragment>\n <span>Default value: {<VariableValue value={dependencyDefault} />}</span>\n <span>Dark value: {<VariableValue value={dependencyDark} />}</span>\n </React.Fragment>\n );\n };\n\n private handleDependencySelect = () => {\n const { dependencyName, onDependencySelect } = this.props;\n if (onDependencySelect) {\n onDependencySelect({ value: dependencyName, label: dependencyName });\n }\n };\n}\n\nconst VariableValue = (props: { value: string }) => {\n const { cx } = useEmotion();\n const styles = useStyles(getStyles);\n const value = props.value;\n const valueIsColor = isColor(value);\n const valueIsGradient = isGradient(value);\n const hasExample = valueIsColor \|\| valueIsGradient;\n let borderColor = 'transparent';\n if (hasExample) {\n borderColor = valueIsColor ? ColorFunctions.contrast(value) : '#000';\n }\n\n return (\n <span className={cx({ [styles.undefined()]: !value })}>\n {hasExample && <span className={styles.colorExample()} style={{ background: value, borderColor }} />}\n {value \|\| 'undefined'}\n </span>\n );\n};\n\nconst ShowUnusedVariables = (props: { diff: string[] }) => {\n const styles = getStyles(useEmotion());\n if (props.diff.length === 0) {\n return null;\n }\n\n return (\n <div className={styles.unusedVariablesWarning()}>\n Неиспользованные переменные ({props.diff.length}\n ):\n <ul>\n {props.diff.sort().map((v) => (\n <li key={v}>{v}</li>\n ))}\n </ul>\n </div>\n );\n};\n\nfunction isGradient(input: string) {\n return !!input && input.startsWith('linear-gradient');\n}\n"],"mappings":"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","ignoreList":[]}

package/internal/ThemeShowcase/ThemeShowcase.d.ts CHANGED Viewed

@@ -8,6 +8,8 @@ interface ShowcaseState {
 }
 export declare class ThemeShowcase extends React.Component<ShowcaseProps, ShowcaseState> {
     state: ShowcaseState;
+    private emotion;
+    private styles;
     private isUnmounting;
     private variablesDiff;
     constructor(props: ShowcaseProps);

package/internal/ThemeShowcase/ThemeShowcase.styles/ThemeShowcase.styles.js CHANGED Viewed

@@ -1,78 +1,81 @@
 import _taggedTemplateLiteralLoose from "@babel/runtime/helpers/esm/taggedTemplateLiteralLoose";
 var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8, _templateObject9, _templateObject10, _templateObject11, _templateObject12, _templateObject13, _templateObject14, _templateObject15, _templateObject16, _templateObject17, _templateObject18, _templateObject19, _templateObject20, _templateObject21, _templateObject22, _templateObject23, _templateObject24;
-import { css, memoizeStyle } from "../../../lib/theming/Emotion";
-export var styles = memoizeStyle({
-  searchBar: function searchBar(t) {
-    return css(_templateObject || (_templateObject = _taggedTemplateLiteralLoose(["\n      position: relative;\n      box-sizing: border-box;\n      height: 40px;\n      padding: 5px;\n      background-color: ", ";\n\n      &::after {\n        content: attr(data-perf-info);\n        position: absolute;\n        top: 11px;\n        right: 20px;\n        color: #808080;\n        height: 20px;\n        line-height: 20px;\n      }\n    "])), t.bgDefault);
-  },
-  heading: function heading(t) {
-    return css(_templateObject2 || (_templateObject2 = _taggedTemplateLiteralLoose(["\n      padding: 24px 0 16px 5px;\n      margin: 0;\n      background-color: ", ";\n    "])), t.bgDefault);
-  },
-  headingSticky: function headingSticky() {
-    return css(_templateObject3 || (_templateObject3 = _taggedTemplateLiteralLoose(["\n      border-bottom: 1px solid #e8e8e8;\n    "])));
-  },
-  table: function table() {
-    return css(_templateObject4 || (_templateObject4 = _taggedTemplateLiteralLoose(["\n      width: 880px;\n      border-collapse: collapse;\n    "])));
-  },
-  headerCell: function headerCell() {
-    return css(_templateObject5 || (_templateObject5 = _taggedTemplateLiteralLoose(["\n      text-align: left;\n      padding-left: 5px;\n    "])));
-  },
-  row: function row() {
-    return css(_templateObject6 || (_templateObject6 = _taggedTemplateLiteralLoose(["\n      &:hover {\n        background-color: #f8f8f8;\n      }\n    "])));
-  },
-  darkRow: function darkRow() {
-    return css(_templateObject7 || (_templateObject7 = _taggedTemplateLiteralLoose(["\n      &:hover {\n        background-color: rgba(255, 255, 255, 0.04);\n      }\n    "])));
-  },
-  cell: function cell() {
-    return css(_templateObject8 || (_templateObject8 = _taggedTemplateLiteralLoose(["\n      border-top: 0 none;\n      border-bottom: 1px solid #e8e8e8;\n      vertical-align: top;\n      padding: 10px 5px;\n    "])));
-  },
-  invisibleRow: function invisibleRow() {
-    return css(_templateObject9 || (_templateObject9 = _taggedTemplateLiteralLoose(["\n      padding: 0;\n      height: 0;\n\n      &:hover,\n      &:hover ~ tr {\n        background-color: #f8f8f8;\n      }\n\n      &:hover ~ &,\n      &:hover ~ & ~ tr {\n        background-color: transparent;\n      }\n    "])));
-  },
-  invisibleDarkRow: function invisibleDarkRow() {
-    return css(_templateObject10 || (_templateObject10 = _taggedTemplateLiteralLoose(["\n      &:hover,\n      &:hover ~ tr {\n        background-color: rgba(255, 255, 255, 0.04);\n      }\n    "])));
-  },
-  suspiciousRow: function suspiciousRow() {
-    return css(_templateObject11 || (_templateObject11 = _taggedTemplateLiteralLoose(["\n      background-color: red;\n    "])));
-  },
-  //noinspection CssReplaceWithShorthandSafely
-  majorCell: function majorCell() {
-    return css(_templateObject12 || (_templateObject12 = _taggedTemplateLiteralLoose(["\n      border-top: 1px solid #e8e8e8;\n    "])));
-  },
-  invisibleCell: function invisibleCell() {
-    return css(_templateObject13 || (_templateObject13 = _taggedTemplateLiteralLoose(["\n      padding: 0;\n      height: 0;\n      font-size: 0;\n      line-height: 0;\n      border: 0 none;\n      border-top: 1px solid #e8e8e8;\n    "])));
-  },
-  suspiciousCell: function suspiciousCell() {
-    return css(_templateObject14 || (_templateObject14 = _taggedTemplateLiteralLoose(["\n      background-color: #fff0bc;\n    "])));
-  },
-  elementName: function elementName() {
-    return css(_templateObject15 || (_templateObject15 = _taggedTemplateLiteralLoose(["\n      color: #7f9a44;\n      font-weight: 400;\n    "])));
-  },
-  relativeCss: function relativeCss() {
-    return css(_templateObject16 || (_templateObject16 = _taggedTemplateLiteralLoose(["\n      white-space: pre;\n      color: #333;\n    "])));
-  },
-  variableName: function variableName() {
-    return css(_templateObject17 || (_templateObject17 = _taggedTemplateLiteralLoose(["\n      color: #b77daa;\n      font-weight: 400;\n      cursor: pointer;\n    "])));
-  },
-  colorExample: function colorExample() {
-    return css(_templateObject18 || (_templateObject18 = _taggedTemplateLiteralLoose(["\n      display: inline-block;\n      box-sizing: border-box;\n      width: 16px;\n      height: 16px;\n      border: 1px solid transparent;\n      margin-right: 4px;\n      vertical-align: -3px;\n    "])));
-  },
-  undefined: function undefined() {
-    return css(_templateObject19 || (_templateObject19 = _taggedTemplateLiteralLoose(["\n      text-decoration: line-through;\n    "])));
-  },
-  unusedVariablesWarning: function unusedVariablesWarning() {
-    return css(_templateObject20 || (_templateObject20 = _taggedTemplateLiteralLoose(["\n      padding: 16px;\n      margin: 20px 0;\n      background-color: #fff0bc;\n      border-radius: 3px;\n    "])));
-  },
-  cssClassObject: function cssClassObject() {
-    return css(_templateObject21 || (_templateObject21 = _taggedTemplateLiteralLoose(["\n      color: #d28445;\n    "])));
-  },
-  cssClassName: function cssClassName() {
-    return css(_templateObject22 || (_templateObject22 = _taggedTemplateLiteralLoose(["\n      color: #7f9a44;\n    "])));
-  },
-  cssThemeObject: function cssThemeObject() {
-    return css(_templateObject23 || (_templateObject23 = _taggedTemplateLiteralLoose(["\n      color: #ac4142;\n    "])));
-  },
-  cssThemeProp: function cssThemeProp() {
-    return css(_templateObject24 || (_templateObject24 = _taggedTemplateLiteralLoose(["\n      color: #b77daa;\n    "])));
-  }
+import { memoizeGetStyles } from "../../../lib/theming/Emotion";
+export var getStyles = memoizeGetStyles(function (_ref) {
+  var css = _ref.css;
+  return {
+    searchBar: function searchBar(t) {
+      return css(_templateObject || (_templateObject = _taggedTemplateLiteralLoose(["\n      position: relative;\n      box-sizing: border-box;\n      height: 40px;\n      padding: 5px;\n      background-color: ", ";\n\n      &::after {\n        content: attr(data-perf-info);\n        position: absolute;\n        top: 11px;\n        right: 20px;\n        color: #808080;\n        height: 20px;\n        line-height: 20px;\n      }\n    "])), t.bgDefault);
+    },
+    heading: function heading(t) {
+      return css(_templateObject2 || (_templateObject2 = _taggedTemplateLiteralLoose(["\n      padding: 24px 0 16px 5px;\n      margin: 0;\n      background-color: ", ";\n    "])), t.bgDefault);
+    },
+    headingSticky: function headingSticky() {
+      return css(_templateObject3 || (_templateObject3 = _taggedTemplateLiteralLoose(["\n      border-bottom: 1px solid #e8e8e8;\n    "])));
+    },
+    table: function table() {
+      return css(_templateObject4 || (_templateObject4 = _taggedTemplateLiteralLoose(["\n      width: 880px;\n      border-collapse: collapse;\n    "])));
+    },
+    headerCell: function headerCell() {
+      return css(_templateObject5 || (_templateObject5 = _taggedTemplateLiteralLoose(["\n      text-align: left;\n      padding-left: 5px;\n    "])));
+    },
+    row: function row() {
+      return css(_templateObject6 || (_templateObject6 = _taggedTemplateLiteralLoose(["\n      &:hover {\n        background-color: #f8f8f8;\n      }\n    "])));
+    },
+    darkRow: function darkRow() {
+      return css(_templateObject7 || (_templateObject7 = _taggedTemplateLiteralLoose(["\n      &:hover {\n        background-color: rgba(255, 255, 255, 0.04);\n      }\n    "])));
+    },
+    cell: function cell() {
+      return css(_templateObject8 || (_templateObject8 = _taggedTemplateLiteralLoose(["\n      border-top: 0 none;\n      border-bottom: 1px solid #e8e8e8;\n      vertical-align: top;\n      padding: 10px 5px;\n    "])));
+    },
+    invisibleRow: function invisibleRow() {
+      return css(_templateObject9 || (_templateObject9 = _taggedTemplateLiteralLoose(["\n      padding: 0;\n      height: 0;\n\n      &:hover,\n      &:hover ~ tr {\n        background-color: #f8f8f8;\n      }\n\n      &:hover ~ &,\n      &:hover ~ & ~ tr {\n        background-color: transparent;\n      }\n    "])));
+    },
+    invisibleDarkRow: function invisibleDarkRow() {
+      return css(_templateObject10 || (_templateObject10 = _taggedTemplateLiteralLoose(["\n      &:hover,\n      &:hover ~ tr {\n        background-color: rgba(255, 255, 255, 0.04);\n      }\n    "])));
+    },
+    suspiciousRow: function suspiciousRow() {
+      return css(_templateObject11 || (_templateObject11 = _taggedTemplateLiteralLoose(["\n      background-color: red;\n    "])));
+    },
+    //noinspection CssReplaceWithShorthandSafely
+    majorCell: function majorCell() {
+      return css(_templateObject12 || (_templateObject12 = _taggedTemplateLiteralLoose(["\n      border-top: 1px solid #e8e8e8;\n    "])));
+    },
+    invisibleCell: function invisibleCell() {
+      return css(_templateObject13 || (_templateObject13 = _taggedTemplateLiteralLoose(["\n      padding: 0;\n      height: 0;\n      font-size: 0;\n      line-height: 0;\n      border: 0 none;\n      border-top: 1px solid #e8e8e8;\n    "])));
+    },
+    suspiciousCell: function suspiciousCell() {
+      return css(_templateObject14 || (_templateObject14 = _taggedTemplateLiteralLoose(["\n      background-color: #fff0bc;\n    "])));
+    },
+    elementName: function elementName() {
+      return css(_templateObject15 || (_templateObject15 = _taggedTemplateLiteralLoose(["\n      color: #7f9a44;\n      font-weight: 400;\n    "])));
+    },
+    relativeCss: function relativeCss() {
+      return css(_templateObject16 || (_templateObject16 = _taggedTemplateLiteralLoose(["\n      white-space: pre;\n      color: #333;\n    "])));
+    },
+    variableName: function variableName() {
+      return css(_templateObject17 || (_templateObject17 = _taggedTemplateLiteralLoose(["\n      color: #b77daa;\n      font-weight: 400;\n      cursor: pointer;\n    "])));
+    },
+    colorExample: function colorExample() {
+      return css(_templateObject18 || (_templateObject18 = _taggedTemplateLiteralLoose(["\n      display: inline-block;\n      box-sizing: border-box;\n      width: 16px;\n      height: 16px;\n      border: 1px solid transparent;\n      margin-right: 4px;\n      vertical-align: -3px;\n    "])));
+    },
+    undefined: function undefined() {
+      return css(_templateObject19 || (_templateObject19 = _taggedTemplateLiteralLoose(["\n      text-decoration: line-through;\n    "])));
+    },
+    unusedVariablesWarning: function unusedVariablesWarning() {
+      return css(_templateObject20 || (_templateObject20 = _taggedTemplateLiteralLoose(["\n      padding: 16px;\n      margin: 20px 0;\n      background-color: #fff0bc;\n      border-radius: 3px;\n    "])));
+    },
+    cssClassObject: function cssClassObject() {
+      return css(_templateObject21 || (_templateObject21 = _taggedTemplateLiteralLoose(["\n      color: #d28445;\n    "])));
+    },
+    cssClassName: function cssClassName() {
+      return css(_templateObject22 || (_templateObject22 = _taggedTemplateLiteralLoose(["\n      color: #7f9a44;\n    "])));
+    },
+    cssThemeObject: function cssThemeObject() {
+      return css(_templateObject23 || (_templateObject23 = _taggedTemplateLiteralLoose(["\n      color: #ac4142;\n    "])));
+    },
+    cssThemeProp: function cssThemeProp() {
+      return css(_templateObject24 || (_templateObject24 = _taggedTemplateLiteralLoose(["\n      color: #b77daa;\n    "])));
+    }
+  };
 });