@skbkontur/react-ui 4.5.2 → 4.5.3-theme2022.0

package/cjs/components/Token/Token.md

@@ -1,112 +1,112 @@
-Token example
-
-```jsx harmony
-import { Token } from '@skbkontur/react-ui';
-
-<Token>Example</Token>;
-```
-
-You can control color of each token
-
-```jsx harmony
-import { Gapped, Token } from '@skbkontur/react-ui';
-
-const colors = {
-  default: {
-    idle: 'defaultIdle',
-    active: 'defaultActive',
-  },
-  gray: {
-    idle: 'grayIdle',
-    active: 'grayActive',
-  },
-  blue: {
-    idle: 'blueIdle',
-    active: 'blueActive',
-  },
-  green: {
-    idle: 'greenIdle',
-    active: 'greenActive',
-  },
-  yellow: {
-    idle: 'yellowIdle',
-    active: 'yellowActive',
-  },
-  red: {
-    idle: 'redIdle',
-    active: 'redActive',
-  },
-  mono: {
-    idle: 'white',
-    active: 'black',
-  },
-};
-
-<Gapped gap={20} vertical>
-  <Gapped gap={10}>
-    <Token colors={colors.default}>Default</Token>
-    <Token isActive colors={colors.default}>
-      Default
-    </Token>
-  </Gapped>
-  <Gapped gap={10}>
-    <Token colors={colors.gray}>Gray</Token>
-    <Token isActive colors={colors.gray}>
-      Gray
-    </Token>
-  </Gapped>
-  <Gapped gap={10}>
-    <Token colors={colors.blue}>Blue</Token>
-    <Token isActive colors={colors.blue}>
-      Blue
-    </Token>
-  </Gapped>
-  <Gapped gap={10}>
-    <Token colors={colors.green}>Green</Token>
-    <Token isActive colors={colors.green}>
-      Green
-    </Token>
-  </Gapped>
-  <Gapped gap={10}>
-    <Token colors={colors.yellow}>Yellow</Token>
-    <Token isActive colors={colors.yellow}>
-      Yellow
-    </Token>
-  </Gapped>
-  <Gapped gap={10}>
-    <Token colors={colors.red}>Red</Token>
-    <Token isActive colors={colors.red}>
-      Red
-    </Token>
-  </Gapped>
-  <Gapped gap={10}>
-    <Token colors={colors.mono}>Monochrome</Token>
-    <Token isActive colors={colors.mono}>
-      Monochrome
-    </Token>
-  </Gapped>
-</Gapped>;
-```
-
-Can accept validation state
-
-```jsx harmony
-import { Gapped, Token } from '@skbkontur/react-ui';
-
-<Gapped gap={20} vertical>
-  <Gapped gap={10}>
-    <Token>Correct</Token>
-    <Token warning>Warned</Token>
-    <Token error>Errored</Token>
-  </Gapped>
-  <Gapped gap={10}>
-    <Token isActive>Correct</Token>
-    <Token isActive warning>
-      Warned
-    </Token>
-    <Token isActive error>
-      Errored
-    </Token>
-  </Gapped>
-</Gapped>;
-```
+Token example
+
+```jsx harmony
+import { Token } from '@skbkontur/react-ui';
+
+<Token>Example</Token>;
+```
+
+You can control color of each token
+
+```jsx harmony
+import { Gapped, Token } from '@skbkontur/react-ui';
+
+const colors = {
+  default: {
+    idle: 'defaultIdle',
+    active: 'defaultActive',
+  },
+  gray: {
+    idle: 'grayIdle',
+    active: 'grayActive',
+  },
+  blue: {
+    idle: 'blueIdle',
+    active: 'blueActive',
+  },
+  green: {
+    idle: 'greenIdle',
+    active: 'greenActive',
+  },
+  yellow: {
+    idle: 'yellowIdle',
+    active: 'yellowActive',
+  },
+  red: {
+    idle: 'redIdle',
+    active: 'redActive',
+  },
+  mono: {
+    idle: 'white',
+    active: 'black',
+  },
+};
+
+<Gapped gap={20} vertical>
+  <Gapped gap={10}>
+    <Token colors={colors.default}>Default</Token>
+    <Token isActive colors={colors.default}>
+      Default
+    </Token>
+  </Gapped>
+  <Gapped gap={10}>
+    <Token colors={colors.gray}>Gray</Token>
+    <Token isActive colors={colors.gray}>
+      Gray
+    </Token>
+  </Gapped>
+  <Gapped gap={10}>
+    <Token colors={colors.blue}>Blue</Token>
+    <Token isActive colors={colors.blue}>
+      Blue
+    </Token>
+  </Gapped>
+  <Gapped gap={10}>
+    <Token colors={colors.green}>Green</Token>
+    <Token isActive colors={colors.green}>
+      Green
+    </Token>
+  </Gapped>
+  <Gapped gap={10}>
+    <Token colors={colors.yellow}>Yellow</Token>
+    <Token isActive colors={colors.yellow}>
+      Yellow
+    </Token>
+  </Gapped>
+  <Gapped gap={10}>
+    <Token colors={colors.red}>Red</Token>
+    <Token isActive colors={colors.red}>
+      Red
+    </Token>
+  </Gapped>
+  <Gapped gap={10}>
+    <Token colors={colors.mono}>Monochrome</Token>
+    <Token isActive colors={colors.mono}>
+      Monochrome
+    </Token>
+  </Gapped>
+</Gapped>;
+```
+
+Can accept validation state
+
+```jsx harmony
+import { Gapped, Token } from '@skbkontur/react-ui';
+
+<Gapped gap={20} vertical>
+  <Gapped gap={10}>
+    <Token>Correct</Token>
+    <Token warning>Warned</Token>
+    <Token error>Errored</Token>
+  </Gapped>
+  <Gapped gap={10}>
+    <Token isActive>Correct</Token>
+    <Token isActive warning>
+      Warned
+    </Token>
+    <Token isActive error>
+      Errored
+    </Token>
+  </Gapped>
+</Gapped>;
+```

package/cjs/internal/FakeUserActions/FakeUserActions.d.ts

@@ -0,0 +1,7 @@
+import React from 'react';
+export declare type FakeUserAction = 'hover' | 'active' | 'focus';
+export declare const FAKE_USER_ACTION_ATTR: Record<FakeUserAction, string>;
+export declare const FakeUserActions: React.FunctionComponent<{
+    children: React.ReactElement;
+    acts?: FakeUserAction[];
+}>;

package/cjs/internal/FakeUserActions/FakeUserActions.js

@@ -0,0 +1,29 @@
+"use strict";var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");exports.__esModule = true;exports.FakeUserActions = exports.FAKE_USER_ACTION_ATTR = void 0;var _react = _interopRequireDefault(require("react"));
+
+var _rootNode = require("../../lib/rootNode");
+
+
+
+var FAKE_USER_ACTION_ATTR = {
+  hover: 'data-style-hover',
+  active: 'data-style-active',
+  focus: 'data-style-focus' };exports.FAKE_USER_ACTION_ATTR = FAKE_USER_ACTION_ATTR;
+
+
+var FakeUserActions = function FakeUserActions(_ref)
+
+
+{var children = _ref.children,_ref$acts = _ref.acts,acts = _ref$acts === void 0 ? [] : _ref$acts;
+  var ref = _react.default.useRef();
+  var setProp = function setProp(node) {
+    acts.forEach(function (act) {return node.setAttribute(FAKE_USER_ACTION_ATTR[act], 'true');});
+  };
+  _react.default.useEffect(function () {
+    var node = (0, _rootNode.getRootNode)(ref.current);
+    if (node instanceof HTMLElement) {var _ref$current;
+      setProp(node);
+      (_ref$current = ref.current) == null ? void 0 : _ref$current.forceUpdate();
+    }
+  });
+  return /*#__PURE__*/_react.default.cloneElement(children, { ref: ref });
+};exports.FakeUserActions = FakeUserActions;

package/cjs/internal/FakeUserActions/FakeUserActions.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["FakeUserActions.tsx"],"names":["FAKE_USER_ACTION_ATTR","hover","active","focus","FakeUserActions","children","acts","ref","React","useRef","setProp","node","forEach","act","setAttribute","useEffect","current","HTMLElement","forceUpdate","cloneElement"],"mappings":"6LAAA;;AAEA;;;;AAIO,IAAMA,qBAAqD,GAAG;AACnEC,EAAAA,KAAK,EAAE,kBAD4D;AAEnEC,EAAAA,MAAM,EAAE,mBAF2D;AAGnEC,EAAAA,KAAK,EAAE,kBAH4D,EAA9D,C;;;AAMA,IAAMC,eAAmG,GAAG,SAAtGA,eAAsG;;;AAG7G,KAFJC,QAEI,QAFJA,QAEI,kBADJC,IACI,CADJA,IACI,0BADG,EACH;AACJ,MAAMC,GAAG,GAAGC,eAAMC,MAAN,EAAZ;AACA,MAAMC,OAAO,GAAG,SAAVA,OAAU,CAACC,IAAD,EAAuB;AACrCL,IAAAA,IAAI,CAACM,OAAL,CAAa,UAACC,GAAD,UAASF,IAAI,CAACG,YAAL,CAAkBd,qBAAqB,CAACa,GAAD,CAAvC,EAA8C,MAA9C,CAAT,EAAb;AACD,GAFD;AAGAL,iBAAMO,SAAN,CAAgB,YAAM;AACpB,QAAMJ,IAAI,GAAG,2BAAYJ,GAAG,CAACS,OAAhB,CAAb;AACA,QAAIL,IAAI,YAAYM,WAApB,EAAiC;AAC/BP,MAAAA,OAAO,CAACC,IAAD,CAAP;AACA,sBAAAJ,GAAG,CAACS,OAAJ,kCAAaE,WAAb;AACD;AACF,GAND;AAOA,sBAAOV,eAAMW,YAAN,CAAmBd,QAAnB,EAA6B,EAAEE,GAAG,EAAHA,GAAF,EAA7B,CAAP;AACD,CAhBM,C","sourcesContent":["import React from 'react';\n\nimport { getRootNode } from '../../lib/rootNode';\n\nexport type FakeUserAction = 'hover' | 'active' | 'focus';\n\nexport const FAKE_USER_ACTION_ATTR: Record<FakeUserAction, string> = {\n  hover: 'data-style-hover',\n  active: 'data-style-active',\n  focus: 'data-style-focus',\n};\n\nexport const FakeUserActions: React.FunctionComponent<{ children: React.ReactElement; acts?: FakeUserAction[] }> = ({\n  children,\n  acts = [],\n}) => {\n  const ref = React.useRef<React.Component>();\n  const setProp = (node: HTMLElement) => {\n    acts.forEach((act) => node.setAttribute(FAKE_USER_ACTION_ATTR[act], 'true'));\n  };\n  React.useEffect(() => {\n    const node = getRootNode(ref.current);\n    if (node instanceof HTMLElement) {\n      setProp(node);\n      ref.current?.forceUpdate();\n    }\n  });\n  return React.cloneElement(children, { ref });\n};\n"]}

package/cjs/internal/FakeUserActions/FakeUserActionsTable.d.ts

@@ -0,0 +1,6 @@
+import React from 'react';
+export declare const FakeUserActionsTable: React.FunctionComponent<{
+    children: React.ReactElement;
+    propName?: string;
+    propValues?: unknown[];
+}>;

package/cjs/internal/FakeUserActions/FakeUserActionsTable.js

@@ -0,0 +1,216 @@
+"use strict";var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");exports.__esModule = true;exports.FakeUserActionsTable = void 0;var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));var _taggedTemplateLiteralLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteralLoose"));var _react = _interopRequireWildcard(require("react"));
+
+var _Emotion = require("../../lib/theming/Emotion");
+var _Button = require("../../components/Button");
+var _Gapped = require("../../components/Gapped");
+var _Input = require("../../components/Input");
+var _Toggle = require("../../components/Toggle");
+
+var _FakeUserActions = require("./FakeUserActions");var _templateObject, _templateObject2;function _getRequireWildcardCache(nodeInterop) {if (typeof WeakMap !== "function") return null;var cacheBabelInterop = new WeakMap();var cacheNodeInterop = new WeakMap();return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) {return nodeInterop ? cacheNodeInterop : cacheBabelInterop;})(nodeInterop);}function _interopRequireWildcard(obj, nodeInterop) {if (!nodeInterop && obj && obj.__esModule) {return obj;}if (obj === null || typeof obj !== "object" && typeof obj !== "function") {return { default: obj };}var cache = _getRequireWildcardCache(nodeInterop);if (cache && cache.has(obj)) {return cache.get(obj);}var newObj = {};var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor;for (var key in obj) {if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) {var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null;if (desc && (desc.get || desc.set)) {Object.defineProperty(newObj, key, desc);} else {newObj[key] = obj[key];}}}newObj.default = obj;if (cache) {cache.set(obj, newObj);}return newObj;}
+
+
+
+
+
+
+
+
+
+
+
+var baselineAnimation = (0, _Emotion.keyframes)(_templateObject || (_templateObject = (0, _taggedTemplateLiteralLoose2.default)(["\n  0% {\n    border-bottom-color: red;\n  }\n  33% {\n    border-bottom-color: green;\n  }\n  66% {\n    border-bottom-color: white;\n  }\n  100% {\n    border-bottom-color: red;\n  }\n"])));
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+var tableClass = (0, _Emotion.css)(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteralLoose2.default)(["\n  tr td:not(:first-child) {\n    padding: 10px;\n    vertical-align: middle;\n    text-align: center;\n  }\n\n  thead td,\n  tr td:first-child {\n    white-space: pre-wrap;\n    line-height: 10px;\n    font-family: monospace;\n  }\n\n  td[colspan] {\n    text-align: left !important;\n    white-space: pre-wrap;\n    font-family: monospace;\n    font-size: 12px;\n  }\n\n  .baseline {\n    position: absolute;\n    border-bottom: solid 1px red;\n    box-shadow: 1px 0 0 0 green;\n    left: 0;\n    width: 100%;\n    z-index: 10;\n    color: transparent;\n    animation: ", " 10s infinite;\n    pointer-events: none;\n  }\n"])),
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+baselineAnimation);
+
+
+
+
+var userActsSets = [
+[],
+['hover'],
+['active'],
+['focus'],
+['hover', 'focus'],
+['active', 'focus']];
+
+
+var HelpersContext = /*#__PURE__*/_react.default.createContext({
+  background: ['', function () {return null;}],
+  content: ['Текст', function () {return null;}],
+  withText: [false, function () {return null;}],
+  hasBaseline: [false, function () {return null;}],
+  baselineShift: [0, function () {return null;}] });
+
+
+var Controls = function Controls() {
+  var _useContext =
+
+
+
+
+
+  (0, _react.useContext)(HelpersContext),_useContext$backgroun = _useContext.background,background = _useContext$backgroun[0],setBackground = _useContext$backgroun[1],_useContext$content = _useContext.content,content = _useContext$content[0],setContent = _useContext$content[1],_useContext$withText = _useContext.withText,withText = _useContext$withText[0],setWithText = _useContext$withText[1],_useContext$hasBaseli = _useContext.hasBaseline,hasBaseline = _useContext$hasBaseli[0],setHasBaseline = _useContext$hasBaseli[1],_useContext$baselineS = _useContext.baselineShift,baselineShift = _useContext$baselineS[0],setBaselineShift = _useContext$baselineS[1];
+
+  return /*#__PURE__*/(
+    _react.default.createElement(_Gapped.Gapped, { vertical: true, gap: 20, style: { margin: 10, padding: '20px 10px', background: '#eee' } }, /*#__PURE__*/
+    _react.default.createElement(_Gapped.Gapped, null, /*#__PURE__*/
+    _react.default.createElement(_Input.Input, { value: content, onValueChange: setContent, style: { width: 100 } }), "\u0421\u043E\u0434\u0435\u0440\u0436\u0438\u043C\u043E\u0435"), /*#__PURE__*/
+
+
+    _react.default.createElement(_Gapped.Gapped, null, /*#__PURE__*/
+    _react.default.createElement(_Input.Input, { value: background, onValueChange: setBackground, style: { width: 100 } }), "\u0424\u043E\u043D"), /*#__PURE__*/
+
+
+    _react.default.createElement(_Toggle.Toggle, { checked: withText, onValueChange: setWithText }, "\u0422\u0435\u043A\u0441\u0442 \u0441\u043B\u0435\u0432\u0430 \u0438 \u0441\u043F\u0440\u0430\u0432\u0430"), /*#__PURE__*/
+
+
+    _react.default.createElement(_Gapped.Gapped, null, /*#__PURE__*/
+    _react.default.createElement(_Toggle.Toggle, { checked: hasBaseline, onValueChange: setHasBaseline }, "\u0411\u0430\u0437\u043E\u0432\u0430\u044F \u043B\u0438\u043D\u0438\u044F"),
+
+
+    hasBaseline && /*#__PURE__*/
+    _react.default.createElement(_Gapped.Gapped, { style: { position: 'absolute', marginTop: -20 } }, /*#__PURE__*/
+    _react.default.createElement(_Button.Button, { onClick: function onClick() {return setBaselineShift(baselineShift - 1);} }, "\u2B06"),
+    baselineShift, /*#__PURE__*/
+    _react.default.createElement(_Button.Button, { onClick: function onClick() {return setBaselineShift(baselineShift + 1);} }, "\u2B07")))));
+
+
+
+
+
+};
+
+var ManualRow =
+
+
+
+function ManualRow(_ref) {var children = _ref.children,propName = _ref.propName,propValue = _ref.propValue;
+  var _useContext2 =
+
+
+
+
+
+  (0, _react.useContext)(HelpersContext),_useContext2$backgrou = _useContext2.background,background = _useContext2$backgrou[0],_useContext2$content = _useContext2.content,content = _useContext2$content[0],_useContext2$withText = _useContext2.withText,withText = _useContext2$withText[0],_useContext2$hasBasel = _useContext2.hasBaseline,hasBaseline = _useContext2$hasBasel[0],_useContext2$baseline = _useContext2.baselineShift,baselineShift = _useContext2$baseline[0];
+
+  return /*#__PURE__*/(
+    _react.default.createElement("tr", null, /*#__PURE__*/
+    _react.default.createElement("td", null,
+    propValue,
+    hasBaseline && /*#__PURE__*/
+    _react.default.createElement("span", { className: "baseline", style: { marginTop: baselineShift } }, "1")),
+
+
+
+
+    userActsSets.map(function (_userActs, i) {var _ref2;return /*#__PURE__*/(
+        _react.default.createElement("td", { key: i, style: { background: background } },
+        withText && /*#__PURE__*/_react.default.createElement("span", null, "\u0441\u043B\u0435\u0432\u0430"), /*#__PURE__*/
+        _react.default.createElement(_FakeUserActions.FakeUserActions, { acts: _userActs }, /*#__PURE__*/
+        _react.default.cloneElement(children, (0, _extends2.default)({
+          children: content },
+        propName ? (_ref2 = {}, _ref2[propName] = propValue, _ref2) : {}))),
+
+
+        withText && /*#__PURE__*/_react.default.createElement("span", null, "\u0441\u043F\u0440\u0430\u0432\u0430")));})));
+
+
+
+
+};
+
+var Table =
+
+
+
+function Table(_ref3) {var children = _ref3.children,_ref3$propName = _ref3.propName,propName = _ref3$propName === void 0 ? '' : _ref3$propName,_ref3$propValues = _ref3.propValues,propValues = _ref3$propValues === void 0 ? [] : _ref3$propValues;
+  return /*#__PURE__*/(
+    _react.default.createElement("table", { id: "FakeUserActionsTable", className: tableClass }, /*#__PURE__*/
+    _react.default.createElement("thead", null, /*#__PURE__*/
+    _react.default.createElement("tr", null, /*#__PURE__*/
+    _react.default.createElement("td", null, /*#__PURE__*/
+    _react.default.createElement("sub", null, propName), "\\", /*#__PURE__*/_react.default.createElement("sup", null, "style")),
+
+    userActsSets.map(function (_userActs, i) {return /*#__PURE__*/(
+        _react.default.createElement("td", { key: i }, _userActs.join('\n + \n')));}))), /*#__PURE__*/
+
+
+
+    _react.default.createElement("tbody", null, /*#__PURE__*/
+    _react.default.createElement(ManualRow, null, children),
+    propValues.map(function (value, index) {return /*#__PURE__*/(
+        _react.default.createElement(ManualRow, { key: index, propName: propName, propValue: value },
+        children));}))));
+
+
+
+
+
+};
+
+var FakeUserActionsTable =
+
+
+
+function FakeUserActionsTable(_ref4) {var children = _ref4.children,propName = _ref4.propName,propValues = _ref4.propValues;
+  var helpers = {
+    background: (0, _react.useState)('#fff'),
+    content: (0, _react.useState)('Текст'),
+    withText: (0, _react.useState)(false),
+    hasBaseline: (0, _react.useState)(false),
+    baselineShift: (0, _react.useState)(0) };
+
+
+  return /*#__PURE__*/(
+    _react.default.createElement("div", null, /*#__PURE__*/
+    _react.default.createElement(HelpersContext.Provider, { value: helpers }, /*#__PURE__*/
+    _react.default.createElement(Table, { propName: propName, propValues: propValues },
+    children), /*#__PURE__*/
+
+    _react.default.createElement(Controls, null))));
+
+
+
+};exports.FakeUserActionsTable = FakeUserActionsTable;

package/cjs/internal/FakeUserActions/FakeUserActionsTable.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["FakeUserActionsTable.tsx"],"names":["baselineAnimation","keyframes","tableClass","css","userActsSets","HelpersContext","React","createContext","background","content","withText","hasBaseline","baselineShift","Controls","setBackground","setContent","setWithText","setHasBaseline","setBaselineShift","margin","padding","width","position","marginTop","ManualRow","children","propName","propValue","map","_userActs","i","cloneElement","Table","propValues","join","value","index","FakeUserActionsTable","helpers"],"mappings":"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","sourcesContent":["import React, { useContext, useState } from 'react';\n\nimport { css, keyframes } from '../../lib/theming/Emotion';\nimport { Button } from '../../components/Button';\nimport { Gapped } from '../../components/Gapped';\nimport { Input } from '../../components/Input';\nimport { Toggle } from '../../components/Toggle';\n\nimport { FakeUserActions, FakeUserAction } from './FakeUserActions';\n\ntype Helper<V> = [V, (value: V) => void];\n\ninterface Helpers {\n  background: Helper<string>;\n  content: Helper<string>;\n  withText: Helper<boolean>;\n  hasBaseline: Helper<boolean>;\n  baselineShift: Helper<number>;\n}\n\nconst baselineAnimation = keyframes`\n  0% {\n    border-bottom-color: red;\n  }\n  33% {\n    border-bottom-color: green;\n  }\n  66% {\n    border-bottom-color: white;\n  }\n  100% {\n    border-bottom-color: red;\n  }\n`;\n\nconst tableClass = css`\n  tr td:not(:first-child) {\n    padding: 10px;\n    vertical-align: middle;\n    text-align: center;\n  }\n\n  thead td,\n  tr td:first-child {\n    white-space: pre-wrap;\n    line-height: 10px;\n    font-family: monospace;\n  }\n\n  td[colspan] {\n    text-align: left !important;\n    white-space: pre-wrap;\n    font-family: monospace;\n    font-size: 12px;\n  }\n\n  .baseline {\n    position: absolute;\n    border-bottom: solid 1px red;\n    box-shadow: 1px 0 0 0 green;\n    left: 0;\n    width: 100%;\n    z-index: 10;\n    color: transparent;\n    animation: ${baselineAnimation} 10s infinite;\n    pointer-events: none;\n  }\n`;\n\nconst userActsSets: FakeUserAction[][] = [\n  [],\n  ['hover'],\n  ['active'],\n  ['focus'],\n  ['hover', 'focus'],\n  ['active', 'focus'],\n];\n\nconst HelpersContext = React.createContext<Helpers>({\n  background: ['', () => null],\n  content: ['Текст', () => null],\n  withText: [false, () => null],\n  hasBaseline: [false, () => null],\n  baselineShift: [0, () => null],\n});\n\nconst Controls: React.FunctionComponent = () => {\n  const {\n    background: [background, setBackground],\n    content: [content, setContent],\n    withText: [withText, setWithText],\n    hasBaseline: [hasBaseline, setHasBaseline],\n    baselineShift: [baselineShift, setBaselineShift],\n  } = useContext(HelpersContext);\n\n  return (\n    <Gapped vertical gap={20} style={{ margin: 10, padding: '20px 10px', background: '#eee' }}>\n      <Gapped>\n        <Input value={content} onValueChange={setContent} style={{ width: 100 }} />\n        Содержимое\n      </Gapped>\n      <Gapped>\n        <Input value={background} onValueChange={setBackground} style={{ width: 100 }} />\n        Фон\n      </Gapped>\n      <Toggle checked={withText} onValueChange={setWithText}>\n        Текст слева и справа\n      </Toggle>\n      <Gapped>\n        <Toggle checked={hasBaseline} onValueChange={setHasBaseline}>\n          Базовая линия\n        </Toggle>\n        {hasBaseline && (\n          <Gapped style={{ position: 'absolute', marginTop: -20 }}>\n            <Button onClick={() => setBaselineShift(baselineShift - 1)}>⬆</Button>\n            {baselineShift}\n            <Button onClick={() => setBaselineShift(baselineShift + 1)}>⬇</Button>\n          </Gapped>\n        )}\n      </Gapped>\n    </Gapped>\n  );\n};\n\nconst ManualRow: React.FunctionComponent<{\n  children: React.ReactElement;\n  propName?: string;\n  propValue?: unknown;\n}> = ({ children, propName, propValue }) => {\n  const {\n    background: [background],\n    content: [content],\n    withText: [withText],\n    hasBaseline: [hasBaseline],\n    baselineShift: [baselineShift],\n  } = useContext(HelpersContext);\n\n  return (\n    <tr>\n      <td>\n        {propValue}\n        {hasBaseline && (\n          <span className=\"baseline\" style={{ marginTop: baselineShift }}>\n            1\n          </span>\n        )}\n      </td>\n      {userActsSets.map((_userActs, i) => (\n        <td key={i} style={{ background }}>\n          {withText && <span>слева</span>}\n          <FakeUserActions acts={_userActs}>\n            {React.cloneElement(children, {\n              children: content,\n              ...(propName ? { [propName]: propValue } : {}),\n            })}\n          </FakeUserActions>\n          {withText && <span>справа</span>}\n        </td>\n      ))}\n    </tr>\n  );\n};\n\nconst Table: React.FunctionComponent<{\n  children: React.ReactElement;\n  propName?: string;\n  propValues?: unknown[];\n}> = ({ children, propName = '', propValues = [] }) => {\n  return (\n    <table id=\"FakeUserActionsTable\" className={tableClass}>\n      <thead>\n        <tr>\n          <td>\n            <sub>{propName}</sub>\\<sup>style</sup>\n          </td>\n          {userActsSets.map((_userActs, i) => (\n            <td key={i}>{_userActs.join('\\n + \\n')}</td>\n          ))}\n        </tr>\n      </thead>\n      <tbody>\n        <ManualRow>{children}</ManualRow>\n        {propValues.map((value, index) => (\n          <ManualRow key={index} propName={propName} propValue={value}>\n            {children}\n          </ManualRow>\n        ))}\n      </tbody>\n    </table>\n  );\n};\n\nexport const FakeUserActionsTable: React.FunctionComponent<{\n  children: React.ReactElement;\n  propName?: string;\n  propValues?: unknown[];\n}> = ({ children, propName, propValues }) => {\n  const helpers: Helpers = {\n    background: useState<string>('#fff'),\n    content: useState<string>('Текст'),\n    withText: useState<boolean>(false),\n    hasBaseline: useState<boolean>(false),\n    baselineShift: useState<number>(0),\n  };\n\n  return (\n    <div>\n      <HelpersContext.Provider value={helpers}>\n        <Table propName={propName} propValues={propValues}>\n          {children}\n        </Table>\n        <Controls />\n      </HelpersContext.Provider>\n    </div>\n  );\n};\n"]}

package/cjs/internal/FakeUserActions/Selectors.d.ts

@@ -0,0 +1,6 @@
+export declare const hover: (strings: TemplateStringsArray, ...args: Array<string | number>) => string;
+export declare const active: (strings: TemplateStringsArray, ...args: Array<string | number>) => string;
+export declare const focus: (strings: TemplateStringsArray, ...args: Array<string | number>) => string;
+export declare const fakeHover: string;
+export declare const fakeActive: string;
+export declare const fakeFocus: string;

package/cjs/internal/FakeUserActions/Selectors.js

@@ -0,0 +1,20 @@
+"use strict";exports.__esModule = true;exports.hover = exports.focus = exports.fakeHover = exports.fakeFocus = exports.fakeActive = exports.active = void 0;var _FakeUserActions = require("./FakeUserActions");
+
+var selector = function selector(act, extra) {if (extra === void 0) {extra = '';}return "\n[" +
+  _FakeUserActions.FAKE_USER_ACTION_ATTR[act] + "]" + extra + "\n";};
+
+
+var sampler =
+function sampler(act) {return (
+    function (strings) {for (var _len = arguments.length, args = new Array(_len > 1 ? _len - 1 : 0), _key = 1; _key < _len; _key++) {args[_key - 1] = arguments[_key];}
+      var extra = strings.reduce(function (prev, value, i) {return prev + value + (args[i] || '');}, '');
+      return selector(act, extra);
+    });};
+
+var hover = sampler('hover');exports.hover = hover;
+var active = sampler('active');exports.active = active;
+var focus = sampler('focus');exports.focus = focus;
+
+var fakeHover = selector('hover');exports.fakeHover = fakeHover;
+var fakeActive = selector('active');exports.fakeActive = fakeActive;
+var fakeFocus = selector('focus');exports.fakeFocus = fakeFocus;

package/cjs/internal/FakeUserActions/Selectors.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["Selectors.ts"],"names":["selector","act","extra","FAKE_USER_ACTION_ATTR","sampler","strings","args","reduce","prev","value","i","hover","active","focus","fakeHover","fakeActive","fakeFocus"],"mappings":"4JAAA;;AAEA,IAAMA,QAAQ,GAAG,SAAXA,QAAW,CAACC,GAAD,EAAsBC,KAAtB,OAAsBA,KAAtB,cAAsBA,KAAtB,GAA8B,EAA9B;AACdC,yCAAsBF,GAAtB,CADc,SACgBC,KADhB,SAAjB;;;AAIA,IAAME,OAAO;AACX,SADIA,OACJ,CAACH,GAAD;AACA,cAACI,OAAD,EAA4E,mCAAzCC,IAAyC,uEAAzCA,IAAyC;AAC1E,UAAMJ,KAAK,GAAGG,OAAO,CAACE,MAAR,CAAe,UAACC,IAAD,EAAOC,KAAP,EAAcC,CAAd,UAAoBF,IAAI,GAAGC,KAAP,IAAgBH,IAAI,CAACI,CAAD,CAAJ,IAAW,EAA3B,CAApB,EAAf,EAAmE,EAAnE,CAAd;AACA,aAAOV,QAAQ,CAACC,GAAD,EAAMC,KAAN,CAAf;AACD,KAJD,GADF;;AAOO,IAAMS,KAAK,GAAGP,OAAO,CAAC,OAAD,CAArB,C;AACA,IAAMQ,MAAM,GAAGR,OAAO,CAAC,QAAD,CAAtB,C;AACA,IAAMS,KAAK,GAAGT,OAAO,CAAC,OAAD,CAArB,C;;AAEA,IAAMU,SAAS,GAAGd,QAAQ,CAAC,OAAD,CAA1B,C;AACA,IAAMe,UAAU,GAAGf,QAAQ,CAAC,QAAD,CAA3B,C;AACA,IAAMgB,SAAS,GAAGhB,QAAQ,CAAC,OAAD,CAA1B,C","sourcesContent":["import { FAKE_USER_ACTION_ATTR, FakeUserAction } from './FakeUserActions';\n\nconst selector = (act: FakeUserAction, extra = '') => `\n[${FAKE_USER_ACTION_ATTR[act]}]${extra}\n`;\n\nconst sampler =\n  (act: FakeUserAction) =>\n  (strings: TemplateStringsArray, ...args: Array<string | number>): string => {\n    const extra = strings.reduce((prev, value, i) => prev + value + (args[i] || ''), '');\n    return selector(act, extra);\n  };\n\nexport const hover = sampler('hover');\nexport const active = sampler('active');\nexport const focus = sampler('focus');\n\nexport const fakeHover = selector('hover');\nexport const fakeActive = selector('active');\nexport const fakeFocus = selector('focus');\n"]}

package/cjs/internal/FakeUserActions/hasFakeUserAction.d.ts

@@ -0,0 +1,3 @@
+import { Nullable } from '../../typings/utility-types';
+import { FakeUserAction } from './FakeUserActions';
+export declare const hasFakeUserAction: (instance: Nullable<React.ReactInstance>, act: FakeUserAction) => boolean;

package/cjs/internal/FakeUserActions/hasFakeUserAction.js

@@ -0,0 +1,9 @@
+"use strict";exports.__esModule = true;exports.hasFakeUserAction = void 0;
+var _rootNode = require("../../lib/rootNode");
+
+var _FakeUserActions = require("./FakeUserActions");
+
+var hasFakeUserAction = function hasFakeUserAction(instance, act) {
+  var node = (0, _rootNode.getRootNode)(instance);
+  return node ? node.hasAttribute(_FakeUserActions.FAKE_USER_ACTION_ATTR[act]) : false;
+};exports.hasFakeUserAction = hasFakeUserAction;

package/cjs/internal/FakeUserActions/hasFakeUserAction.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["hasFakeUserAction.tsx"],"names":["hasFakeUserAction","instance","act","node","hasAttribute","FAKE_USER_ACTION_ATTR"],"mappings":";AACA;;AAEA;;AAEO,IAAMA,iBAAiB,GAAG,SAApBA,iBAAoB,CAACC,QAAD,EAA0CC,GAA1C,EAA2E;AAC1G,MAAMC,IAAI,GAAG,2BAAYF,QAAZ,CAAb;AACA,SAAOE,IAAI,GAAGA,IAAI,CAACC,YAAL,CAAkBC,uCAAsBH,GAAtB,CAAlB,CAAH,GAAmD,KAA9D;AACD,CAHM,C","sourcesContent":["import { Nullable } from '../../typings/utility-types';\nimport { getRootNode } from '../../lib/rootNode';\n\nimport { FAKE_USER_ACTION_ATTR, FakeUserAction } from './FakeUserActions';\n\nexport const hasFakeUserAction = (instance: Nullable<React.ReactInstance>, act: FakeUserAction): boolean => {\n  const node = getRootNode(instance);\n  return node ? node.hasAttribute(FAKE_USER_ACTION_ATTR[act]) : false;\n};\n"]}

package/cjs/internal/Menu/Menu.styles.js

@@ -3,9 +3,8 @@
 
 var styles = (0, _Emotion.memoizeStyle)({
   root: function root(t) {
-    return (0, _Emotion.css)(_templateObject || (_templateObject = (0, _taggedTemplateLiteralLoose2.default)(["\n      background: ", ";\n      border-radius: ", ";\n      box-sizing: content-box;\n      overflow: auto;\n      padding: 0 ", ";\n      border-radius: ", ";\n    "])),
+    return (0, _Emotion.css)(_templateObject || (_templateObject = (0, _taggedTemplateLiteralLoose2.default)(["\n      background: ", ";\n      box-sizing: content-box;\n      overflow: auto;\n      padding: 0 ", ";\n      border-radius: ", ";\n    "])),
     t.menuBgDefault,
-    t.menuBorderRadius,
 
 
     t.menuPaddingX,

package/cjs/internal/Menu/Menu.styles.js.map

@@ -1 +1 @@
-{"version":3,"sources":["Menu.styles.ts"],"names":["styles","root","t","css","menuBgDefault","menuBorderRadius","menuPaddingX","alignRight","alignRightIE11","alignRightIE11FixAutoWidth","scrollContainer","menuPaddingY","shadow","menuBorder","menuShadow"],"mappings":"4QAAA,oD;;;AAGO,IAAMA,MAAM,GAAG,2BAAa;AACjCC,EAAAA,IADiC,gBAC5BC,CAD4B,EAClB;AACb,eAAOC,YAAP;AACgBD,IAAAA,CAAC,CAACE,aADlB;AAEmBF,IAAAA,CAAC,CAACG,gBAFrB;;;AAKeH,IAAAA,CAAC,CAACI,YALjB;AAMmBJ,IAAAA,CAAC,CAACG,gBANrB;;AAQD,GAVgC;;AAYjCE,EAAAA,UAZiC,wBAYpB;AACX,eAAOJ,YAAP;;;AAGD,GAhBgC;;AAkBjCK,EAAAA,cAlBiC,4BAkBhB;AACf,eAAOL,YAAP;;;;AAID,GAvBgC;;AAyBjCM,EAAAA,0BAzBiC,wCAyBJ;AAC3B,eAAON,YAAP;;;;AAID,GA9BgC;;AAgCjCO,EAAAA,eAhCiC,2BAgCjBR,CAhCiB,EAgCP;AACxB,eAAOC,YAAP;AACaD,IAAAA,CAAC,CAACS,YADf;;AAGD,GApCgC;;AAsCjCC,EAAAA,MAtCiC,kBAsC1BV,CAtC0B,EAsChB;AACf,eAAOC,YAAP;AACYD,IAAAA,CAAC,CAACW,UADd;AAEgBX,IAAAA,CAAC,CAACY,UAFlB;;AAID,GA3CgC,EAAb,CAAf,C","sourcesContent":["import { css, memoizeStyle } from '../../lib/theming/Emotion';\nimport { Theme } from '../../lib/theming/Theme';\n\nexport const styles = memoizeStyle({\n  root(t: Theme) {\n    return css`\n      background: ${t.menuBgDefault};\n      border-radius: ${t.menuBorderRadius};\n      box-sizing: content-box;\n      overflow: auto;\n      padding: 0 ${t.menuPaddingX};\n      border-radius: ${t.menuBorderRadius};\n    `;\n  },\n\n  alignRight() {\n    return css`\n      flex: 1 1 100%;\n    `;\n  },\n\n  alignRightIE11() {\n    return css`\n      float: right;\n      width: 100%;\n    `;\n  },\n\n  alignRightIE11FixAutoWidth() {\n    return css`\n      box-sizing: border-box !important; // override root styles\n      overflow: hidden !important; // override root styles\n    `;\n  },\n\n  scrollContainer(t: Theme) {\n    return css`\n      padding: ${t.menuPaddingY} 0;\n    `;\n  },\n\n  shadow(t: Theme) {\n    return css`\n      border: ${t.menuBorder};\n      box-shadow: ${t.menuShadow};\n    `;\n  },\n});\n"]}
+{"version":3,"sources":["Menu.styles.ts"],"names":["styles","root","t","css","menuBgDefault","menuPaddingX","menuBorderRadius","alignRight","alignRightIE11","alignRightIE11FixAutoWidth","scrollContainer","menuPaddingY","shadow","menuBorder","menuShadow"],"mappings":"4QAAA,oD;;;AAGO,IAAMA,MAAM,GAAG,2BAAa;AACjCC,EAAAA,IADiC,gBAC5BC,CAD4B,EAClB;AACb,eAAOC,YAAP;AACgBD,IAAAA,CAAC,CAACE,aADlB;;;AAIeF,IAAAA,CAAC,CAACG,YAJjB;AAKmBH,IAAAA,CAAC,CAACI,gBALrB;;AAOD,GATgC;;AAWjCC,EAAAA,UAXiC,wBAWpB;AACX,eAAOJ,YAAP;;;AAGD,GAfgC;;AAiBjCK,EAAAA,cAjBiC,4BAiBhB;AACf,eAAOL,YAAP;;;;AAID,GAtBgC;;AAwBjCM,EAAAA,0BAxBiC,wCAwBJ;AAC3B,eAAON,YAAP;;;;AAID,GA7BgC;;AA+BjCO,EAAAA,eA/BiC,2BA+BjBR,CA/BiB,EA+BP;AACxB,eAAOC,YAAP;AACaD,IAAAA,CAAC,CAACS,YADf;;AAGD,GAnCgC;;AAqCjCC,EAAAA,MArCiC,kBAqC1BV,CArC0B,EAqChB;AACf,eAAOC,YAAP;AACYD,IAAAA,CAAC,CAACW,UADd;AAEgBX,IAAAA,CAAC,CAACY,UAFlB;;AAID,GA1CgC,EAAb,CAAf,C","sourcesContent":["import { css, memoizeStyle } from '../../lib/theming/Emotion';\nimport { Theme } from '../../lib/theming/Theme';\n\nexport const styles = memoizeStyle({\n  root(t: Theme) {\n    return css`\n      background: ${t.menuBgDefault};\n      box-sizing: content-box;\n      overflow: auto;\n      padding: 0 ${t.menuPaddingX};\n      border-radius: ${t.menuBorderRadius};\n    `;\n  },\n\n  alignRight() {\n    return css`\n      flex: 1 1 100%;\n    `;\n  },\n\n  alignRightIE11() {\n    return css`\n      float: right;\n      width: 100%;\n    `;\n  },\n\n  alignRightIE11FixAutoWidth() {\n    return css`\n      box-sizing: border-box !important; // override root styles\n      overflow: hidden !important; // override root styles\n    `;\n  },\n\n  scrollContainer(t: Theme) {\n    return css`\n      padding: ${t.menuPaddingY} 0;\n    `;\n  },\n\n  shadow(t: Theme) {\n    return css`\n      border: ${t.menuBorder};\n      box-shadow: ${t.menuShadow};\n    `;\n  },\n});\n"]}

package/cjs/internal/ThemeShowcase/ThemeShowcase.md

@@ -1,13 +1,13 @@
-### Таблица переменных
-
-Список использующихся переменных для каждого кастомизируемого компонента.
-<br/>
-Таблица фильтруется по названию переменной.
-<br/>
-Значения в колонке `Variable name` кликабельны.
-
-```jsx harmony
-import { ThemeShowcase } from '@skbkontur/react-ui/internal/ThemeShowcase/ThemeShowcase';
-
-<ThemeShowcase />;
-```
+### Таблица переменных
+
+Список использующихся переменных для каждого кастомизируемого компонента.
+<br/>
+Таблица фильтруется по названию переменной.
+<br/>
+Значения в колонке `Variable name` кликабельны.
+
+```jsx harmony
+import { ThemeShowcase } from '@skbkontur/react-ui/internal/ThemeShowcase/ThemeShowcase';
+
+<ThemeShowcase />;
+```