@skbkontur/react-ui 0.0.0-044e274f2c → 0.0.0-07d08325b0

package/cjs/components/CurrencyLabel/CurrencyLabel.d.ts

@@ -1,19 +1,22 @@
 import React, { HTMLAttributes } from 'react';
 import { CommonProps } from '../../internal/CommonWrapper';
 export interface CurrencyLabelProps extends CommonProps, Pick<HTMLAttributes<HTMLElement>, 'id'> {
-    /**
-     * Минимальное количество отображаемых знаков после запятой
-     * @default 2
-     */
+    /** Устанавливает минимальное количество отображаемых знаков после запятой.
+     * @default 2 */
     fractionDigits?: number;
+    /** Устанавливает значение. */
     value: number;
+    /** Задает символ валюты. */
     currencySymbol?: React.ReactNode;
-    /** Убрать лишние нули после запятой */
+    /** Убирает лишние нули после запятой. */
     hideTrailingZeros?: boolean;
 }
 export declare const CurrencyLabelDataTids: {
     readonly root: "CurrencyLabel__root";
 };
+/**
+ * `CurrencyLabel` — подпись для денежных сумм (и других числовых значений).
+ */
 export declare const CurrencyLabel: {
     ({ id, value, fractionDigits, currencySymbol, hideTrailingZeros, ...rest }: CurrencyLabelProps): JSX.Element;
     __KONTUR_REACT_UI__: string;

package/cjs/components/CurrencyLabel/CurrencyLabel.js

@@ -16,12 +16,18 @@ var _CommonWrapper = require("../../internal/CommonWrapper");var _excluded = ["i
 
 
 
+
+
+
 var FRACTION_DIGITS_DEFAULT = 2;
 
 var CurrencyLabelDataTids = exports.CurrencyLabelDataTids = {
   root: 'CurrencyLabel__root'
 };
 
+/**
+ * `CurrencyLabel` — подпись для денежных сумм (и других числовых значений).
+ */
 var CurrencyLabel = exports.CurrencyLabel = function CurrencyLabel(_ref)
 
 

package/cjs/components/CurrencyLabel/CurrencyLabel.js.map

@@ -1 +1 @@
-{"version":3,"names":["_react","_interopRequireDefault","require","_constants","_CurrencyHelper","_CommonWrapper","_excluded","FRACTION_DIGITS_DEFAULT","CurrencyLabelDataTids","exports","root","CurrencyLabel","_ref","id","value","_ref$fractionDigits","fractionDigits","currencySymbol","_ref$hideTrailingZero","hideTrailingZeros","rest","_objectWithoutPropertiesLoose2","default","createElement","CommonWrapper","CurrencyHelper","format","String","fromCharCode","__KONTUR_REACT_UI__","displayName","propTypes","_ref2","_ref2$fractionDigits","MAX_SAFE_DIGITS","Error","_ref3","destructString","fraction","length","Number","isInteger"],"sources":["CurrencyLabel.tsx"],"sourcesContent":["import React, { HTMLAttributes } from 'react';\n\nimport { MAX_SAFE_DIGITS } from '../CurrencyInput/constants';\nimport { CurrencyHelper } from '../CurrencyInput/CurrencyHelper';\nimport { CommonWrapper, CommonProps } from '../../internal/CommonWrapper';\n\nexport interface CurrencyLabelProps extends CommonProps, Pick<HTMLAttributes<HTMLElement>, 'id'> {\n  /**\n   * Минимальное количество отображаемых знаков после запятой\n   * @default 2\n   */\n  fractionDigits?: number;\n  value: number;\n  currencySymbol?: React.ReactNode;\n  /** Убрать лишние нули после запятой */\n  hideTrailingZeros?: boolean;\n}\n\nconst FRACTION_DIGITS_DEFAULT = 2;\n\nexport const CurrencyLabelDataTids = {\n  root: 'CurrencyLabel__root',\n} as const;\n\nexport const CurrencyLabel = ({\n  id,\n  value,\n  fractionDigits = FRACTION_DIGITS_DEFAULT,\n  currencySymbol,\n  hideTrailingZeros = false,\n  ...rest\n}: CurrencyLabelProps): JSX.Element => {\n  return (\n    <CommonWrapper {...rest}>\n      <span id={id} data-tid={CurrencyLabelDataTids.root}>\n        {CurrencyHelper.format(value, { fractionDigits, hideTrailingZeros })}\n        {currencySymbol && String.fromCharCode(0xa0) /* &nbsp; */}\n        {currencySymbol}\n      </span>\n    </CommonWrapper>\n  );\n};\n\nCurrencyLabel.__KONTUR_REACT_UI__ = 'CurrencyLabel';\nCurrencyLabel.displayName = 'CurrencyLabel';\n\nCurrencyLabel.propTypes = {\n  fractionDigits: ({ fractionDigits = FRACTION_DIGITS_DEFAULT, value }: CurrencyLabelProps) => {\n    if (fractionDigits > MAX_SAFE_DIGITS) {\n      return new Error(\n        `[CurrencyLabel]: Prop 'fractionDigits' exceeds ${MAX_SAFE_DIGITS}.` +\n          `\\nSee https://tech.skbkontur.ru/react-ui/#/CurrencyInput?id=why15`,\n      );\n    }\n\n    const { fraction } = CurrencyHelper.destructString(String(value)) || { fraction: '' };\n    if (fraction.length > fractionDigits) {\n      return new Error(\n        `[CurrencyLabel]: Prop 'fractionDigits' less than fractional part of the 'value' property,` +\n          `'value' will not be cutted`,\n      );\n    }\n\n    if (!Number.isInteger(fractionDigits)) {\n      return new Error(\n        `[CurrencyLabel]: Prop 'fractionDigits' is not integer, fraction part of these property will not be used`,\n      );\n    }\n\n    return null;\n  },\n};\n"],"mappings":"+TAAA,IAAAA,MAAA,GAAAC,sBAAA,CAAAC,OAAA;;AAEA,IAAAC,UAAA,GAAAD,OAAA;AACA,IAAAE,eAAA,GAAAF,OAAA;AACA,IAAAG,cAAA,GAAAH,OAAA,iCAA0E,IAAAI,SAAA;;;;;;;;;;;;;;AAc1E,IAAMC,uBAAuB,GAAG,CAAC;;AAE1B,IAAMC,qBAAqB,GAAAC,OAAA,CAAAD,qBAAA,GAAG;EACnCE,IAAI,EAAE;AACR,CAAU;;AAEH,IAAMC,aAAa,GAAAF,OAAA,CAAAE,aAAA,GAAG,SAAhBA,aAAaA,CAAAC,IAAA;;;;;;;AAOa,KANrCC,EAAE,GAAAD,IAAA,CAAFC,EAAE,CACFC,KAAK,GAAAF,IAAA,CAALE,KAAK,CAAAC,mBAAA,GAAAH,IAAA,CACLI,cAAc,CAAdA,cAAc,GAAAD,mBAAA,cAAGR,uBAAuB,GAAAQ,mBAAA,CACxCE,cAAc,GAAAL,IAAA,CAAdK,cAAc,CAAAC,qBAAA,GAAAN,IAAA,CACdO,iBAAiB,CAAjBA,iBAAiB,GAAAD,qBAAA,cAAG,KAAK,GAAAA,qBAAA,CACtBE,IAAI,OAAAC,8BAAA,CAAAC,OAAA,EAAAV,IAAA,EAAAN,SAAA;EAEP;IACEN,MAAA,CAAAsB,OAAA,CAAAC,aAAA,CAAClB,cAAA,CAAAmB,aAAa,EAAKJ,IAAI;IACrBpB,MAAA,CAAAsB,OAAA,CAAAC,aAAA,WAAMV,EAAE,EAAEA,EAAG,EAAC,YAAUL,qBAAqB,CAACE,IAAK;IAChDe,8BAAc,CAACC,MAAM,CAACZ,KAAK,EAAE,EAAEE,cAAc,EAAdA,cAAc,EAAEG,iBAAiB,EAAjBA,iBAAiB,CAAC,CAAC,CAAC;IACnEF,cAAc,IAAIU,MAAM,CAACC,YAAY,CAAC,IAAI,CAAC,CAAC;IAC5CX;IACG;IACO,CAAC;;AAEpB,CAAC;;AAEDN,aAAa,CAACkB,mBAAmB,GAAG,eAAe;AACnDlB,aAAa,CAACmB,WAAW,GAAG,eAAe;;AAE3CnB,aAAa,CAACoB,SAAS,GAAG;EACxBf,cAAc,EAAE,SAAAA,eAAAgB,KAAA,EAA6E,KAAAC,oBAAA,GAAAD,KAAA,CAA1EhB,cAAc,CAAdA,eAAc,GAAAiB,oBAAA,cAAG1B,uBAAuB,GAAA0B,oBAAA,CAAEnB,KAAK,GAAAkB,KAAA,CAALlB,KAAK;IAChE,IAAIE,eAAc,GAAGkB,0BAAe,EAAE;MACpC,OAAO,IAAIC,KAAK;QACd,oDAAkDD,0BAAe;;MAEnE,CAAC;IACH;;IAEA,IAAAE,KAAA,GAAqBX,8BAAc,CAACY,cAAc,CAACV,MAAM,CAACb,KAAK,CAAC,CAAC,IAAI,EAAEwB,QAAQ,EAAE,EAAE,CAAC,CAAC,CAA7EA,QAAQ,GAAAF,KAAA,CAARE,QAAQ;IAChB,IAAIA,QAAQ,CAACC,MAAM,GAAGvB,eAAc,EAAE;MACpC,OAAO,IAAImB,KAAK;QACd;;MAEF,CAAC;IACH;;IAEA,IAAI,CAACK,MAAM,CAACC,SAAS,CAACzB,eAAc,CAAC,EAAE;MACrC,OAAO,IAAImB,KAAK;;MAEhB,CAAC;IACH;;IAEA,OAAO,IAAI;EACb;AACF,CAAC","ignoreList":[]}
+{"version":3,"names":["_react","_interopRequireDefault","require","_constants","_CurrencyHelper","_CommonWrapper","_excluded","FRACTION_DIGITS_DEFAULT","CurrencyLabelDataTids","exports","root","CurrencyLabel","_ref","id","value","_ref$fractionDigits","fractionDigits","currencySymbol","_ref$hideTrailingZero","hideTrailingZeros","rest","_objectWithoutPropertiesLoose2","default","createElement","CommonWrapper","CurrencyHelper","format","String","fromCharCode","__KONTUR_REACT_UI__","displayName","propTypes","_ref2","_ref2$fractionDigits","MAX_SAFE_DIGITS","Error","_ref3","destructString","fraction","length","Number","isInteger"],"sources":["CurrencyLabel.tsx"],"sourcesContent":["import React, { HTMLAttributes } from 'react';\n\nimport { MAX_SAFE_DIGITS } from '../CurrencyInput/constants';\nimport { CurrencyHelper } from '../CurrencyInput/CurrencyHelper';\nimport { CommonWrapper, CommonProps } from '../../internal/CommonWrapper';\n\nexport interface CurrencyLabelProps extends CommonProps, Pick<HTMLAttributes<HTMLElement>, 'id'> {\n  /** Устанавливает минимальное количество отображаемых знаков после запятой.\n   * @default 2 */\n  fractionDigits?: number;\n\n  /** Устанавливает значение. */\n  value: number;\n\n  /** Задает символ валюты. */\n  currencySymbol?: React.ReactNode;\n\n  /** Убирает лишние нули после запятой. */\n  hideTrailingZeros?: boolean;\n}\n\nconst FRACTION_DIGITS_DEFAULT = 2;\n\nexport const CurrencyLabelDataTids = {\n  root: 'CurrencyLabel__root',\n} as const;\n\n/**\n * `CurrencyLabel` — подпись для денежных сумм (и других числовых значений).\n */\nexport const CurrencyLabel = ({\n  id,\n  value,\n  fractionDigits = FRACTION_DIGITS_DEFAULT,\n  currencySymbol,\n  hideTrailingZeros = false,\n  ...rest\n}: CurrencyLabelProps): JSX.Element => {\n  return (\n    <CommonWrapper {...rest}>\n      <span id={id} data-tid={CurrencyLabelDataTids.root}>\n        {CurrencyHelper.format(value, { fractionDigits, hideTrailingZeros })}\n        {currencySymbol && String.fromCharCode(0xa0) /* &nbsp; */}\n        {currencySymbol}\n      </span>\n    </CommonWrapper>\n  );\n};\n\nCurrencyLabel.__KONTUR_REACT_UI__ = 'CurrencyLabel';\nCurrencyLabel.displayName = 'CurrencyLabel';\n\nCurrencyLabel.propTypes = {\n  fractionDigits: ({ fractionDigits = FRACTION_DIGITS_DEFAULT, value }: CurrencyLabelProps) => {\n    if (fractionDigits > MAX_SAFE_DIGITS) {\n      return new Error(\n        `[CurrencyLabel]: Prop 'fractionDigits' exceeds ${MAX_SAFE_DIGITS}.` +\n          `\\nSee https://tech.skbkontur.ru/react-ui/#/CurrencyInput?id=why15`,\n      );\n    }\n\n    const { fraction } = CurrencyHelper.destructString(String(value)) || { fraction: '' };\n    if (fraction.length > fractionDigits) {\n      return new Error(\n        `[CurrencyLabel]: Prop 'fractionDigits' less than fractional part of the 'value' property,` +\n          `'value' will not be cutted`,\n      );\n    }\n\n    if (!Number.isInteger(fractionDigits)) {\n      return new Error(\n        `[CurrencyLabel]: Prop 'fractionDigits' is not integer, fraction part of these property will not be used`,\n      );\n    }\n\n    return null;\n  },\n};\n"],"mappings":"+TAAA,IAAAA,MAAA,GAAAC,sBAAA,CAAAC,OAAA;;AAEA,IAAAC,UAAA,GAAAD,OAAA;AACA,IAAAE,eAAA,GAAAF,OAAA;AACA,IAAAG,cAAA,GAAAH,OAAA,iCAA0E,IAAAI,SAAA;;;;;;;;;;;;;;;;;AAiB1E,IAAMC,uBAAuB,GAAG,CAAC;;AAE1B,IAAMC,qBAAqB,GAAAC,OAAA,CAAAD,qBAAA,GAAG;EACnCE,IAAI,EAAE;AACR,CAAU;;AAEV;AACA;AACA;AACO,IAAMC,aAAa,GAAAF,OAAA,CAAAE,aAAA,GAAG,SAAhBA,aAAaA,CAAAC,IAAA;;;;;;;AAOa,KANrCC,EAAE,GAAAD,IAAA,CAAFC,EAAE,CACFC,KAAK,GAAAF,IAAA,CAALE,KAAK,CAAAC,mBAAA,GAAAH,IAAA,CACLI,cAAc,CAAdA,cAAc,GAAAD,mBAAA,cAAGR,uBAAuB,GAAAQ,mBAAA,CACxCE,cAAc,GAAAL,IAAA,CAAdK,cAAc,CAAAC,qBAAA,GAAAN,IAAA,CACdO,iBAAiB,CAAjBA,iBAAiB,GAAAD,qBAAA,cAAG,KAAK,GAAAA,qBAAA,CACtBE,IAAI,OAAAC,8BAAA,CAAAC,OAAA,EAAAV,IAAA,EAAAN,SAAA;EAEP;IACEN,MAAA,CAAAsB,OAAA,CAAAC,aAAA,CAAClB,cAAA,CAAAmB,aAAa,EAAKJ,IAAI;IACrBpB,MAAA,CAAAsB,OAAA,CAAAC,aAAA,WAAMV,EAAE,EAAEA,EAAG,EAAC,YAAUL,qBAAqB,CAACE,IAAK;IAChDe,8BAAc,CAACC,MAAM,CAACZ,KAAK,EAAE,EAAEE,cAAc,EAAdA,cAAc,EAAEG,iBAAiB,EAAjBA,iBAAiB,CAAC,CAAC,CAAC;IACnEF,cAAc,IAAIU,MAAM,CAACC,YAAY,CAAC,IAAI,CAAC,CAAC;IAC5CX;IACG;IACO,CAAC;;AAEpB,CAAC;;AAEDN,aAAa,CAACkB,mBAAmB,GAAG,eAAe;AACnDlB,aAAa,CAACmB,WAAW,GAAG,eAAe;;AAE3CnB,aAAa,CAACoB,SAAS,GAAG;EACxBf,cAAc,EAAE,SAAAA,eAAAgB,KAAA,EAA6E,KAAAC,oBAAA,GAAAD,KAAA,CAA1EhB,cAAc,CAAdA,eAAc,GAAAiB,oBAAA,cAAG1B,uBAAuB,GAAA0B,oBAAA,CAAEnB,KAAK,GAAAkB,KAAA,CAALlB,KAAK;IAChE,IAAIE,eAAc,GAAGkB,0BAAe,EAAE;MACpC,OAAO,IAAIC,KAAK;QACd,oDAAkDD,0BAAe;;MAEnE,CAAC;IACH;;IAEA,IAAAE,KAAA,GAAqBX,8BAAc,CAACY,cAAc,CAACV,MAAM,CAACb,KAAK,CAAC,CAAC,IAAI,EAAEwB,QAAQ,EAAE,EAAE,CAAC,CAAC,CAA7EA,QAAQ,GAAAF,KAAA,CAARE,QAAQ;IAChB,IAAIA,QAAQ,CAACC,MAAM,GAAGvB,eAAc,EAAE;MACpC,OAAO,IAAImB,KAAK;QACd;;MAEF,CAAC;IACH;;IAEA,IAAI,CAACK,MAAM,CAACC,SAAS,CAACzB,eAAc,CAAC,EAAE;MACrC,OAAO,IAAImB,KAAK;;MAEhB,CAAC;IACH;;IAEA,OAAO,IAAI;EACb;AACF,CAAC","ignoreList":[]}

package/cjs/components/CurrencyLabel/CurrencyLabel.md

@@ -1,28 +1,28 @@
-To render rubles
+### To render rubles
 
 ```jsx
 <CurrencyLabel value={12356.1} currencySymbol={'₽'} />
 ```
 
-...or dollars
+### ...or dollars
 
 ```jsx
 <CurrencyLabel value={12356.1} currencySymbol={'$'} />
 ```
 
-...or nothing
+### ...or nothing
 
 ```jsx
 <CurrencyLabel value={12356.1} />
 ```
 
-Count of fraction digits can be changed
+### Count of fraction digits can be changed
 
 ```jsx
 <CurrencyLabel value={3562001.1} fractionDigits={3} currencySymbol={'₽'} />
 ```
 
-Can hide trailing zeros
+### Can hide trailing zeros
 
 ```jsx
 <CurrencyLabel value={356.167} fractionDigits={5} hideTrailingZeros />

package/cjs/components/CurrencyLabel/__docs__/CurrencyLabel.mdx

@@ -0,0 +1,24 @@
+import * as CurrencyLabelStories from './CurrencyLabel.docs.stories.tsx';
+import { Primary, ArgTypes, Stories, Description } from '@storybook/blocks';
+import { Meta } from '../../../.storybook/Meta';
+
+<Meta of={CurrencyLabelStories} />
+
+# CurrencyLabel
+
+<Description />
+
+## Базовый пример
+
+<Primary />
+
+## Пропы
+
+<details>
+  <summary>Открыть таблицу с пропами</summary>
+  <ArgTypes />
+</details>
+
+## Примеры использования
+
+<Stories title="" includePrimary={false} />

package/cjs/components/DateInput/DateFragmentsView.d.ts

@@ -8,8 +8,6 @@ interface DateFragmentViewProps {
 }
 export declare class DateFragmentsView extends React.Component<DateFragmentViewProps> {
     private theme;
-    private emotion;
-    private styles;
     private rootNode;
     isFragment: (el: HTMLElement | EventTarget) => boolean;
     getRootNode: () => HTMLSpanElement | null;

package/cjs/components/DateInput/DateFragmentsView.js

@@ -1,13 +1,12 @@
 "use strict";var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;exports.__esModule = true;exports.DateFragmentsView = void 0;var _inheritsLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/inheritsLoose"));var _react = _interopRequireDefault(require("react"));
 var _globalObject = require("@skbkontur/global-object");
 
-
 var _MaskCharLowLine = require("../../internal/MaskCharLowLine");
 var _InternalDateValidator = require("../../lib/date/InternalDateValidator");
 var _types = require("../../lib/date/types");
 
-var _Emotion = require("../../lib/theming/Emotion");
 var _ThemeContext = require("../../lib/theming/ThemeContext");
+var _Emotion = require("../../lib/theming/Emotion");
 
 var _DateFragmentsView2 = require("./DateFragmentsView.styles");var
 
@@ -20,8 +19,6 @@ var _DateFragmentsView2 = require("./DateFragmentsView.styles");var
 
 DateFragmentsView = exports.DateFragmentsView = /*#__PURE__*/function (_React$Component) {function DateFragmentsView() {var _this;for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {args[_key] = arguments[_key];}_this = _React$Component.call.apply(_React$Component, [this].concat(args)) || this;_this.
 
-
-
     rootNode = null;_this.
 
     isFragment = function (el) {
@@ -104,16 +101,6 @@ DateFragmentsView = exports.DateFragmentsView = /*#__PURE__*/function (_React$Co
 
 
 
-
-
-
-
-
-
-
-
-
-
 
 
 
@@ -127,4 +114,4 @@ DateFragmentsView = exports.DateFragmentsView = /*#__PURE__*/function (_React$Co
 
     rootRef = function (el) {
       _this.rootNode = el;
-    };return _this;}(0, _inheritsLoose2.default)(DateFragmentsView, _React$Component);var _proto = DateFragmentsView.prototype;_proto.render = function render() {var _this2 = this;return /*#__PURE__*/_react.default.createElement(_Emotion.EmotionConsumer, null, function (emotion) {_this2.emotion = emotion;_this2.styles = (0, _DateFragmentsView2.getStyles)(_this2.emotion);return /*#__PURE__*/_react.default.createElement(_ThemeContext.ThemeContext.Consumer, null, function (theme) {_this2.theme = theme;return _this2.renderMain();});});};_proto.renderMain = function renderMain() {var _this$emotion$cx,_this3 = this;var styles = this.styles;return /*#__PURE__*/_react.default.createElement("span", { ref: this.rootRef, className: this.emotion.cx((_this$emotion$cx = {}, _this$emotion$cx[styles.root()] = true, _this$emotion$cx[styles.selected(this.theme)] = true, _this$emotion$cx)) }, this.props.fragments.map(function (fragment, index) {return fragment.type === _types.InternalDateComponentType.Separator ? _this3.renderSeparator(fragment, index) : _this3.renderDateComponent(fragment, index);}));};_proto.renderSeparator = function renderSeparator(fragment, index) {var _this$emotion$cx2;var styles = this.styles;var separatorClassName = this.emotion.cx((_this$emotion$cx2 = {}, _this$emotion$cx2[styles.mask(this.theme)] = true, _this$emotion$cx2[styles.delimiterFilled()] = this.props.fragments[index + 1].value !== null, _this$emotion$cx2));return /*#__PURE__*/_react.default.createElement("span", { key: index, className: separatorClassName }, fragment.value);};_proto.renderDateComponent = function renderDateComponent(fragment, index) {var _this$props = this.props,inputMode = _this$props.inputMode,onSelectDateComponent = _this$props.onSelectDateComponent,selected = _this$props.selected;var type = fragment.type,value = fragment.value,length = fragment.length,valueWithPad = fragment.valueWithPad;var getValueMask = function getValueMask() {if (value === null || selected === type && inputMode) {return value;}return valueWithPad || value;};var valueMask = getValueMask();var lengthMask = _InternalDateValidator.InternalDateValidator.testParseToNumber(valueMask) ? Math.max(length - valueMask.toString().length, 0) : length;var handleMouseUp = function handleMouseUp(e) {var _globalObject$documen;if ((_globalObject$documen = _globalObject.globalObject.document) != null && (_globalObject$documen = _globalObject$documen.activeElement) != null && _globalObject$documen.contains(e.currentTarget)) {onSelectDateComponent(type, e);}};return /*#__PURE__*/_react.default.createElement("span", { key: index, "data-fragment": "", onMouseUp: handleMouseUp }, valueMask, /*#__PURE__*/_react.default.createElement("span", { "data-tid": "DateFragmentsView__placeholder", className: this.styles.mask(this.theme) }, Array(lengthMask).fill('').map(function (_, i) {return /*#__PURE__*/_react.default.createElement(_MaskCharLowLine.MaskCharLowLine, { key: i });})));};return DateFragmentsView;}(_react.default.Component);
+    };return _this;}(0, _inheritsLoose2.default)(DateFragmentsView, _React$Component);var _proto = DateFragmentsView.prototype;_proto.render = function render() {var _this2 = this;return /*#__PURE__*/_react.default.createElement(_ThemeContext.ThemeContext.Consumer, null, function (theme) {_this2.theme = theme;return _this2.renderMain();});};_proto.renderMain = function renderMain() {var _cx,_this3 = this;return /*#__PURE__*/_react.default.createElement("span", { ref: this.rootRef, className: (0, _Emotion.cx)((_cx = {}, _cx[_DateFragmentsView2.styles.root()] = true, _cx[_DateFragmentsView2.styles.selected(this.theme)] = true, _cx)) }, this.props.fragments.map(function (fragment, index) {return fragment.type === _types.InternalDateComponentType.Separator ? _this3.renderSeparator(fragment, index) : _this3.renderDateComponent(fragment, index);}));};_proto.renderSeparator = function renderSeparator(fragment, index) {var _cx2;var separatorClassName = (0, _Emotion.cx)((_cx2 = {}, _cx2[_DateFragmentsView2.styles.mask(this.theme)] = true, _cx2[_DateFragmentsView2.styles.delimiterFilled()] = this.props.fragments[index + 1].value !== null, _cx2));return /*#__PURE__*/_react.default.createElement("span", { key: index, className: separatorClassName }, fragment.value);};_proto.renderDateComponent = function renderDateComponent(fragment, index) {var _this$props = this.props,inputMode = _this$props.inputMode,onSelectDateComponent = _this$props.onSelectDateComponent,selected = _this$props.selected;var type = fragment.type,value = fragment.value,length = fragment.length,valueWithPad = fragment.valueWithPad;var getValueMask = function getValueMask() {if (value === null || selected === type && inputMode) {return value;}return valueWithPad || value;};var valueMask = getValueMask();var lengthMask = _InternalDateValidator.InternalDateValidator.testParseToNumber(valueMask) ? Math.max(length - valueMask.toString().length, 0) : length;var handleMouseUp = function handleMouseUp(e) {var _globalObject$documen;if ((_globalObject$documen = _globalObject.globalObject.document) != null && (_globalObject$documen = _globalObject$documen.activeElement) != null && _globalObject$documen.contains(e.currentTarget)) {onSelectDateComponent(type, e);}};return /*#__PURE__*/_react.default.createElement("span", { key: index, "data-fragment": "", onMouseUp: handleMouseUp }, valueMask, /*#__PURE__*/_react.default.createElement("span", { "data-tid": "DateFragmentsView__placeholder", className: _DateFragmentsView2.styles.mask(this.theme) }, Array(lengthMask).fill('').map(function (_, i) {return /*#__PURE__*/_react.default.createElement(_MaskCharLowLine.MaskCharLowLine, { key: i });})));};return DateFragmentsView;}(_react.default.Component);

package/cjs/components/DateInput/DateFragmentsView.js.map

@@ -1 +1 @@
-{"version":3,"names":["_react","_interopRequireDefault","require","_globalObject","_MaskCharLowLine","_InternalDateValidator","_types","_Emotion","_ThemeContext","_DateFragmentsView2","DateFragmentsView","exports","_React$Component","_this","_len","arguments","length","args","Array","_key","call","apply","concat","rootNode","isFragment","el","fragments","from","querySelectorAll","some","fragment","contains","getRootNode","rootRef","_inheritsLoose2","default","_proto","prototype","render","_this2","createElement","EmotionConsumer","emotion","styles","getStyles","ThemeContext","Consumer","theme","renderMain","_this$emotion$cx","_this3","ref","className","cx","root","selected","props","map","index","type","InternalDateComponentType","Separator","renderSeparator","renderDateComponent","_this$emotion$cx2","separatorClassName","mask","delimiterFilled","value","key","_this$props","inputMode","onSelectDateComponent","valueWithPad","getValueMask","valueMask","lengthMask","InternalDateValidator","testParseToNumber","Math","max","toString","handleMouseUp","e","_globalObject$documen","globalObject","document","activeElement","currentTarget","onMouseUp","fill","_","i","MaskCharLowLine","React","Component"],"sources":["DateFragmentsView.tsx"],"sourcesContent":["import React from 'react';\nimport { globalObject } from '@skbkontur/global-object';\nimport type { Emotion } from '@emotion/css/create-instance';\n\nimport { MaskCharLowLine } from '../../internal/MaskCharLowLine';\nimport { InternalDateValidator } from '../../lib/date/InternalDateValidator';\nimport { InternalDateComponentType, InternalDateFragment } from '../../lib/date/types';\nimport { Theme } from '../../lib/theming/Theme';\nimport { EmotionConsumer } from '../../lib/theming/Emotion';\nimport { ThemeContext } from '../../lib/theming/ThemeContext';\n\nimport { getStyles } from './DateFragmentsView.styles';\n\ninterface DateFragmentViewProps {\n  selected: InternalDateComponentType | null;\n  fragments: InternalDateFragment[];\n  inputMode: boolean;\n  onSelectDateComponent: (type: InternalDateComponentType, e: React.MouseEvent<HTMLSpanElement>) => void;\n}\n\nexport class DateFragmentsView extends React.Component<DateFragmentViewProps> {\n  private theme!: Theme;\n  private emotion!: Emotion;\n  private styles!: ReturnType<typeof getStyles>;\n  private rootNode: HTMLSpanElement | null = null;\n\n  public isFragment = (el: HTMLElement | EventTarget): boolean => {\n    if (this.rootNode) {\n      // NOTE: NodeList doesn't support method 'forEach' in IE11\n      const fragments: HTMLSpanElement[] = Array.from(this.rootNode.querySelectorAll('[data-fragment]'));\n      return fragments.some((fragment) => fragment === el || fragment.contains(el as HTMLSpanElement));\n    }\n    return false;\n  };\n\n  public getRootNode = () => this.rootNode;\n\n  public render() {\n    return (\n      <EmotionConsumer>\n        {(emotion) => {\n          this.emotion = emotion;\n          this.styles = getStyles(this.emotion);\n          return (\n            <ThemeContext.Consumer>\n              {(theme) => {\n                this.theme = theme;\n                return this.renderMain();\n              }}\n            </ThemeContext.Consumer>\n          );\n        }}\n      </EmotionConsumer>\n    );\n  }\n\n  private renderMain() {\n    const styles = this.styles;\n    return (\n      <span\n        ref={this.rootRef}\n        className={this.emotion.cx({\n          [styles.root()]: true,\n          [styles.selected(this.theme)]: true,\n        })}\n      >\n        {this.props.fragments.map((fragment, index) =>\n          fragment.type === InternalDateComponentType.Separator\n            ? this.renderSeparator(fragment, index)\n            : this.renderDateComponent(fragment, index),\n        )}\n      </span>\n    );\n  }\n\n  private renderSeparator(fragment: InternalDateFragment, index: number): JSX.Element {\n    const styles = this.styles;\n    const separatorClassName = this.emotion.cx({\n      [styles.mask(this.theme)]: true,\n      [styles.delimiterFilled()]: this.props.fragments[index + 1].value !== null,\n    });\n\n    return (\n      <span key={index} className={separatorClassName}>\n        {fragment.value}\n      </span>\n    );\n  }\n\n  private renderDateComponent(fragment: InternalDateFragment, index: number): JSX.Element {\n    const { inputMode, onSelectDateComponent, selected } = this.props;\n    const { type, value, length, valueWithPad } = fragment;\n\n    const getValueMask = () => {\n      if (value === null || (selected === type && inputMode)) {\n        return value;\n      }\n\n      return valueWithPad || value;\n    };\n\n    const valueMask = getValueMask();\n\n    const lengthMask = InternalDateValidator.testParseToNumber(valueMask)\n      ? Math.max(length - valueMask.toString().length, 0)\n      : length;\n\n    const handleMouseUp = (e: React.MouseEvent<HTMLSpanElement>) => {\n      if (globalObject.document?.activeElement?.contains(e.currentTarget)) {\n        onSelectDateComponent(type, e);\n      }\n    };\n\n    return (\n      <span key={index} data-fragment=\"\" onMouseUp={handleMouseUp}>\n        {valueMask}\n        <span data-tid=\"DateFragmentsView__placeholder\" className={this.styles.mask(this.theme)}>\n          {Array(lengthMask)\n            .fill('')\n            .map((_, i) => (\n              <MaskCharLowLine key={i} />\n            ))}\n        </span>\n      </span>\n    );\n  }\n\n  private rootRef = (el: HTMLSpanElement | null) => {\n    this.rootNode = el;\n  };\n}\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"names":["_react","_interopRequireDefault","require","_globalObject","_MaskCharLowLine","_InternalDateValidator","_types","_ThemeContext","_Emotion","_DateFragmentsView2","DateFragmentsView","exports","_React$Component","_this","_len","arguments","length","args","Array","_key","call","apply","concat","rootNode","isFragment","el","fragments","from","querySelectorAll","some","fragment","contains","getRootNode","rootRef","_inheritsLoose2","default","_proto","prototype","render","_this2","createElement","ThemeContext","Consumer","theme","renderMain","_cx","_this3","ref","className","cx","styles","root","selected","props","map","index","type","InternalDateComponentType","Separator","renderSeparator","renderDateComponent","_cx2","separatorClassName","mask","delimiterFilled","value","key","_this$props","inputMode","onSelectDateComponent","valueWithPad","getValueMask","valueMask","lengthMask","InternalDateValidator","testParseToNumber","Math","max","toString","handleMouseUp","e","_globalObject$documen","globalObject","document","activeElement","currentTarget","onMouseUp","fill","_","i","MaskCharLowLine","React","Component"],"sources":["DateFragmentsView.tsx"],"sourcesContent":["import React from 'react';\nimport { globalObject } from '@skbkontur/global-object';\n\nimport { MaskCharLowLine } from '../../internal/MaskCharLowLine';\nimport { InternalDateValidator } from '../../lib/date/InternalDateValidator';\nimport { InternalDateComponentType, InternalDateFragment } from '../../lib/date/types';\nimport { Theme } from '../../lib/theming/Theme';\nimport { ThemeContext } from '../../lib/theming/ThemeContext';\nimport { cx } from '../../lib/theming/Emotion';\n\nimport { styles } from './DateFragmentsView.styles';\n\ninterface DateFragmentViewProps {\n  selected: InternalDateComponentType | null;\n  fragments: InternalDateFragment[];\n  inputMode: boolean;\n  onSelectDateComponent: (type: InternalDateComponentType, e: React.MouseEvent<HTMLSpanElement>) => void;\n}\n\nexport class DateFragmentsView extends React.Component<DateFragmentViewProps> {\n  private theme!: Theme;\n  private rootNode: HTMLSpanElement | null = null;\n\n  public isFragment = (el: HTMLElement | EventTarget): boolean => {\n    if (this.rootNode) {\n      // NOTE: NodeList doesn't support method 'forEach' in IE11\n      const fragments: HTMLSpanElement[] = Array.from(this.rootNode.querySelectorAll('[data-fragment]'));\n      return fragments.some((fragment) => fragment === el || fragment.contains(el as HTMLSpanElement));\n    }\n    return false;\n  };\n\n  public getRootNode = () => this.rootNode;\n\n  public render() {\n    return (\n      <ThemeContext.Consumer>\n        {(theme) => {\n          this.theme = theme;\n          return this.renderMain();\n        }}\n      </ThemeContext.Consumer>\n    );\n  }\n\n  private renderMain() {\n    return (\n      <span\n        ref={this.rootRef}\n        className={cx({\n          [styles.root()]: true,\n          [styles.selected(this.theme)]: true,\n        })}\n      >\n        {this.props.fragments.map((fragment, index) =>\n          fragment.type === InternalDateComponentType.Separator\n            ? this.renderSeparator(fragment, index)\n            : this.renderDateComponent(fragment, index),\n        )}\n      </span>\n    );\n  }\n\n  private renderSeparator(fragment: InternalDateFragment, index: number): JSX.Element {\n    const separatorClassName = cx({\n      [styles.mask(this.theme)]: true,\n      [styles.delimiterFilled()]: this.props.fragments[index + 1].value !== null,\n    });\n\n    return (\n      <span key={index} className={separatorClassName}>\n        {fragment.value}\n      </span>\n    );\n  }\n\n  private renderDateComponent(fragment: InternalDateFragment, index: number): JSX.Element {\n    const { inputMode, onSelectDateComponent, selected } = this.props;\n    const { type, value, length, valueWithPad } = fragment;\n\n    const getValueMask = () => {\n      if (value === null || (selected === type && inputMode)) {\n        return value;\n      }\n\n      return valueWithPad || value;\n    };\n\n    const valueMask = getValueMask();\n\n    const lengthMask = InternalDateValidator.testParseToNumber(valueMask)\n      ? Math.max(length - valueMask.toString().length, 0)\n      : length;\n\n    const handleMouseUp = (e: React.MouseEvent<HTMLSpanElement>) => {\n      if (globalObject.document?.activeElement?.contains(e.currentTarget)) {\n        onSelectDateComponent(type, e);\n      }\n    };\n\n    return (\n      <span key={index} data-fragment=\"\" onMouseUp={handleMouseUp}>\n        {valueMask}\n        <span data-tid=\"DateFragmentsView__placeholder\" className={styles.mask(this.theme)}>\n          {Array(lengthMask)\n            .fill('')\n            .map((_, i) => (\n              <MaskCharLowLine key={i} />\n            ))}\n        </span>\n      </span>\n    );\n  }\n\n  private rootRef = (el: HTMLSpanElement | null) => {\n    this.rootNode = el;\n  };\n}\n"],"mappings":"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","ignoreList":[]}

package/cjs/components/DateInput/DateFragmentsView.styles.d.ts

@@ -1,6 +1,5 @@
-import type { Emotion } from '@emotion/css/create-instance';
 import { Theme } from '../../lib/theming/Theme';
-export declare const getStyles: (emotion: Emotion) => {
+export declare const styles: {
     root(): string;
     selected(t: Theme): string;
     mask(t: Theme): string;

package/cjs/components/DateInput/DateFragmentsView.styles.js

@@ -1,40 +1,37 @@
-"use strict";var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;exports.__esModule = true;exports.getStyles = void 0;var _taggedTemplateLiteralLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteralLoose"));
+"use strict";var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;exports.__esModule = true;exports.styles = void 0;var _taggedTemplateLiteralLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteralLoose"));var _Emotion = require("../../lib/theming/Emotion");var _templateObject, _templateObject2, _templateObject3, _templateObject4;
 
-var _Emotion = require("../../lib/theming/Emotion");var _templateObject, _templateObject2, _templateObject3, _templateObject4;
 
+var styles = exports.styles = (0, _Emotion.memoizeStyle)({
+  root: function root() {
+    return (0, _Emotion.css)(_templateObject || (_templateObject = (0, _taggedTemplateLiteralLoose2.default)(["\n      cursor: text;\n    "])));
 
-var getStyles = exports.getStyles = function getStyles(emotion) {return (
-    (0, _Emotion.memoizeStyle)({
-      root: function root() {
-        return emotion.css(_templateObject || (_templateObject = (0, _taggedTemplateLiteralLoose2.default)(["\n        cursor: text;\n      "])));
 
+  },
 
-      },
+  selected: function selected(t) {
+    var getSelection = function getSelection(background, color) {return (
+        (background || color) && "& ::selection {\n      background: " +
 
-      selected: function selected(t) {
-        var getSelection = function getSelection(background, color) {return (
-            (background || color) && "& ::selection {\n      background: " +
+        background + ";\n      color: " +
+        color + ";\n    }");};
 
-            background + ";\n      color: " +
-            color + ";\n    }");};
 
+    return (0, _Emotion.css)(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteralLoose2.default)(["\n      cursor: text;\n\n      ", "\n    "])),
 
-        return emotion.css(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteralLoose2.default)(["\n        cursor: text;\n\n        ", "\n      "])),
 
+    getSelection(t.dateInputComponentSelectedBgColor, t.dateInputComponentSelectedTextColor));
 
-        getSelection(t.dateInputComponentSelectedBgColor, t.dateInputComponentSelectedTextColor));
+  },
 
-      },
+  mask: function mask(t) {
+    return (0, _Emotion.css)(_templateObject3 || (_templateObject3 = (0, _taggedTemplateLiteralLoose2.default)(["\n      color: ", ";\n    "])),
+    t.dateInputMaskColor);
 
-      mask: function mask(t) {
-        return emotion.css(_templateObject3 || (_templateObject3 = (0, _taggedTemplateLiteralLoose2.default)(["\n        color: ", ";\n      "])),
-        t.dateInputMaskColor);
+  },
 
-      },
+  delimiterFilled: function delimiterFilled() {
+    return (0, _Emotion.css)(_templateObject4 || (_templateObject4 = (0, _taggedTemplateLiteralLoose2.default)(["\n      color: inherit;\n    "])));
 
-      delimiterFilled: function delimiterFilled() {
-        return emotion.css(_templateObject4 || (_templateObject4 = (0, _taggedTemplateLiteralLoose2.default)(["\n        color: inherit;\n      "])));
 
-
-      }
-    }));};
+  }
+});

package/cjs/components/DateInput/DateFragmentsView.styles.js.map

@@ -1 +1 @@
-{"version":3,"names":["_Emotion","require","_templateObject","_templateObject2","_templateObject3","_templateObject4","getStyles","exports","emotion","memoizeStyle","root","css","_taggedTemplateLiteralLoose2","default","selected","t","getSelection","background","color","dateInputComponentSelectedBgColor","dateInputComponentSelectedTextColor","mask","dateInputMaskColor","delimiterFilled"],"sources":["DateFragmentsView.styles.ts"],"sourcesContent":["import type { Emotion } from '@emotion/css/create-instance';\n\nimport { memoizeStyle } from '../../lib/theming/Emotion';\nimport { Theme } from '../../lib/theming/Theme';\n\nexport const getStyles = (emotion: Emotion) =>\n  memoizeStyle({\n    root() {\n      return emotion.css`\n        cursor: text;\n      `;\n    },\n\n    selected(t: Theme) {\n      const getSelection = (background: string, color: string) =>\n        (background || color) &&\n        `& ::selection {\n      background: ${background};\n      color: ${color};\n    }`;\n\n      return emotion.css`\n        cursor: text;\n\n        ${getSelection(t.dateInputComponentSelectedBgColor, t.dateInputComponentSelectedTextColor)}\n      `;\n    },\n\n    mask(t: Theme) {\n      return emotion.css`\n        color: ${t.dateInputMaskColor};\n      `;\n    },\n\n    delimiterFilled() {\n      return emotion.css`\n        color: inherit;\n      `;\n    },\n  });\n"],"mappings":";;AAEA,IAAAA,QAAA,GAAAC,OAAA,8BAAyD,IAAAC,eAAA,EAAAC,gBAAA,EAAAC,gBAAA,EAAAC,gBAAA;;;AAGlD,IAAMC,SAAS,GAAAC,OAAA,CAAAD,SAAA,GAAG,SAAZA,SAASA,CAAIE,OAAgB;IACxC,IAAAC,qBAAY,EAAC;MACXC,IAAI,WAAAA,KAAA,EAAG;QACL,OAAOF,OAAO,CAACG,GAAG,CAAAT,eAAA,KAAAA,eAAA,OAAAU,4BAAA,CAAAC,OAAA;;;MAGpB,CAAC;;MAEDC,QAAQ,WAAAA,SAACC,CAAQ,EAAE;QACjB,IAAMC,YAAY,GAAG,SAAfA,YAAYA,CAAIC,UAAkB,EAAEC,KAAa;YACrD,CAACD,UAAU,IAAIC,KAAK;;YAERD,UAAU;YACfC,KAAK,aACd;;;QAEA,OAAOV,OAAO,CAACG,GAAG,CAAAR,gBAAA,KAAAA,gBAAA,OAAAS,4BAAA,CAAAC,OAAA;;;QAGdG,YAAY,CAACD,CAAC,CAACI,iCAAiC,EAAEJ,CAAC,CAACK,mCAAmC,CAAC;;MAE9F,CAAC;;MAEDC,IAAI,WAAAA,KAACN,CAAQ,EAAE;QACb,OAAOP,OAAO,CAACG,GAAG,CAAAP,gBAAA,KAAAA,gBAAA,OAAAQ,4BAAA,CAAAC,OAAA;QACPE,CAAC,CAACO,kBAAkB;;MAEjC,CAAC;;MAEDC,eAAe,WAAAA,gBAAA,EAAG;QAChB,OAAOf,OAAO,CAACG,GAAG,CAAAN,gBAAA,KAAAA,gBAAA,OAAAO,4BAAA,CAAAC,OAAA;;;MAGpB;IACF,CAAC,CAAC","ignoreList":[]}
+{"version":3,"names":["_Emotion","require","_templateObject","_templateObject2","_templateObject3","_templateObject4","styles","exports","memoizeStyle","root","css","_taggedTemplateLiteralLoose2","default","selected","t","getSelection","background","color","dateInputComponentSelectedBgColor","dateInputComponentSelectedTextColor","mask","dateInputMaskColor","delimiterFilled"],"sources":["DateFragmentsView.styles.ts"],"sourcesContent":["import { css, memoizeStyle } from '../../lib/theming/Emotion';\nimport { Theme } from '../../lib/theming/Theme';\n\nexport const styles = memoizeStyle({\n  root() {\n    return css`\n      cursor: text;\n    `;\n  },\n\n  selected(t: Theme) {\n    const getSelection = (background: string, color: string) =>\n      (background || color) &&\n      `& ::selection {\n      background: ${background};\n      color: ${color};\n    }`;\n\n    return css`\n      cursor: text;\n\n      ${getSelection(t.dateInputComponentSelectedBgColor, t.dateInputComponentSelectedTextColor)}\n    `;\n  },\n\n  mask(t: Theme) {\n    return css`\n      color: ${t.dateInputMaskColor};\n    `;\n  },\n\n  delimiterFilled() {\n    return css`\n      color: inherit;\n    `;\n  },\n});\n"],"mappings":"oRAAA,IAAAA,QAAA,GAAAC,OAAA,8BAA8D,IAAAC,eAAA,EAAAC,gBAAA,EAAAC,gBAAA,EAAAC,gBAAA;;;AAGvD,IAAMC,MAAM,GAAAC,OAAA,CAAAD,MAAA,GAAG,IAAAE,qBAAY,EAAC;EACjCC,IAAI,WAAAA,KAAA,EAAG;IACL,WAAOC,YAAG,EAAAR,eAAA,KAAAA,eAAA,OAAAS,4BAAA,CAAAC,OAAA;;;EAGZ,CAAC;;EAEDC,QAAQ,WAAAA,SAACC,CAAQ,EAAE;IACjB,IAAMC,YAAY,GAAG,SAAfA,YAAYA,CAAIC,UAAkB,EAAEC,KAAa;QACrD,CAACD,UAAU,IAAIC,KAAK;;QAEND,UAAU;QACfC,KAAK,aACd;;;IAEF,WAAOP,YAAG,EAAAP,gBAAA,KAAAA,gBAAA,OAAAQ,4BAAA,CAAAC,OAAA;;;IAGNG,YAAY,CAACD,CAAC,CAACI,iCAAiC,EAAEJ,CAAC,CAACK,mCAAmC,CAAC;;EAE9F,CAAC;;EAEDC,IAAI,WAAAA,KAACN,CAAQ,EAAE;IACb,WAAOJ,YAAG,EAAAN,gBAAA,KAAAA,gBAAA,OAAAO,4BAAA,CAAAC,OAAA;IACCE,CAAC,CAACO,kBAAkB;;EAEjC,CAAC;;EAEDC,eAAe,WAAAA,gBAAA,EAAG;IAChB,WAAOZ,YAAG,EAAAL,gBAAA,KAAAA,gBAAA,OAAAM,4BAAA,CAAAC,OAAA;;;EAGZ;AACF,CAAC,CAAC","ignoreList":[]}

package/cjs/components/DateInput/DateInput.d.ts

@@ -1,4 +1,4 @@
-import React, { HTMLAttributes } from 'react';
+import React, { AriaAttributes, HTMLAttributes } from 'react';
 import { InternalDateComponentType } from '../../lib/date/types';
 import { CommonProps } from '../../internal/CommonWrapper';
 import { SizeProp } from '../../lib/types/props';
@@ -12,51 +12,43 @@ export interface DateInputState {
 export declare const DateInputDataTids: {
     readonly icon: "DateInput__icon";
 };
-export interface DateInputProps extends CommonProps, Pick<HTMLAttributes<HTMLElement>, 'id'> {
+export interface DateInputProps extends CommonProps, Pick<AriaAttributes, 'aria-describedby' | 'aria-label' | 'aria-labelledby'>, Pick<HTMLAttributes<HTMLElement>, 'id'> {
+    /** Устанавливает фокус на контроле после окончания загрузки страницы. */
     autoFocus?: boolean;
+    /** Устанавливает значение датаинпута. */
     value?: string;
-    /**
-     * Состояние валидации при ошибке.
-     */
+    /** Переводит контрол в состояние валидации "ошибка". */
     error?: boolean;
-    /**
-     * Состояние валидации при предупреждении.
-     */
+    /** Переводит контрол в состояние валидации "предупреждение". */
     warning?: boolean;
+    /** Делает компонент недоступным. */
     disabled?: boolean;
-    /**
-     * Минимальная дата.
-     * @default '01.01.1900'
-     */
+    /** Задает минимальную возможную дату в формате `dd.mm.yyyy`. */
     minDate?: string;
-    /**
-     * Максимальная дата
-     * @default '31.12.2099'
-     */
+    /** Задает максимальную возможную дату в формате `dd.mm.yyyy` */
     maxDate?: string;
-    /**
-     * Ширина поля
-     * @default 125
-     */
+    /** Задает ширину поля. */
     width?: string | number;
+    /** Добавляет иконку календаря. */
     withIcon?: boolean;
-    /**
-     * Размер поля
-     * @default 'small'
-     */
+    /** Задает размер поля. */
     size?: SizeProp;
+    /** Задает функцию, которая вызывается при потере датаинпутом фокуса. */
     onBlur?: (x0: React.FocusEvent<HTMLElement>) => void;
+    /** Задает функцию, которая вызывается при клике на датаинпут. */
     onClick?: (x0: React.MouseEvent<HTMLElement>) => void;
+    /** Задает функцию, которая вызывается при получении датаинпутом фокуса. */
     onFocus?: (x0: React.FocusEvent<HTMLElement>) => void;
-    /**
-     * Вызывается при изменении `value`
-     *
-     * @param value - строка в формате `dd.mm.yyyy`.
-     */
+    /** Задает функцию, которая вызывается при изменении value.
+     * @param value - строка в формате `dd.mm.yyyy`. */
     onValueChange?: (value: string) => void;
+    /** Задает функцию, которая вызывается при нажатии кнопки на клавиатуре. */
     onKeyDown?: (x0: React.KeyboardEvent<HTMLElement>) => void;
 }
 type DefaultProps = Required<Pick<DateInputProps, 'value' | 'minDate' | 'maxDate' | 'size' | 'width'>>;
+/**
+ * Компонент поля `DateInput` из DatePicker'а помогает выбирать дату с клавиатуры.
+ */
 export declare class DateInput extends React.Component<DateInputProps, DateInputState> {
     static __KONTUR_REACT_UI__: string;
     static displayName: string;
@@ -71,8 +63,6 @@ export declare class DateInput extends React.Component<DateInputProps, DateInput
     private locale;
     private blurEvent;
     private theme;
-    private emotion;
-    private styles;
     private setRootNode;
     private conditionalHandler;
     constructor(props: DateInputProps);

package/cjs/components/DateInput/DateInput.js

@@ -2,7 +2,6 @@
 var _reactDom = _interopRequireDefault(require("react-dom"));
 var _globalObject = require("@skbkontur/global-object");
 
-
 var _ConditionalHandler = require("../../lib/ConditionalHandler");
 var _constants = require("../../lib/date/constants");
 var _types = require("../../lib/date/types");
@@ -10,13 +9,13 @@ var _types = require("../../lib/date/types");
 var _locale = require("../DatePicker/locale");
 var _InputLikeText = require("../../internal/InputLikeText");
 var _decorators = require("../../lib/locale/decorators");
+var _ThemeContext = require("../../lib/theming/ThemeContext");
 var _CommonWrapper = require("../../internal/CommonWrapper");
+var _Emotion = require("../../lib/theming/Emotion");
 var _rootNode = require("../../lib/rootNode");
 var _createPropsGetter = require("../../lib/createPropsGetter");
 
 var _FocusControlWrapper = require("../../internal/FocusControlWrapper");
-var _ThemeContext = require("../../lib/theming/ThemeContext");
-var _Emotion = require("../../lib/theming/Emotion");
 
 var _CalendarIcon = require("./CalendarIcon");
 var _DateFragmentsView = require("./DateFragmentsView");
@@ -34,7 +33,8 @@ var _InternalDateMediator = require("./helpers/InternalDateMediator");var _dec,
 
 var DateInputDataTids = exports.DateInputDataTids = {
   icon: 'DateInput__icon'
-};var
+};
+
 
 
 
@@ -85,10 +85,16 @@ var DateInputDataTids = exports.DateInputDataTids = {
 
 
 
-DateInput = exports.DateInput = (_dec = (0, _decorators.locale)('DatePicker', _locale.DatePickerLocaleHelper), (0, _rootNode.rootNode)(_class = _dec(_class = (_DateInput = /*#__PURE__*/function (_React$Component) {
 
 
 
+/**
+ * Компонент поля `DateInput` из DatePicker'а помогает выбирать дату с клавиатуры.
+ */var
+
+
+DateInput = exports.DateInput = (_dec = (0, _decorators.locale)('DatePicker', _locale.DatePickerLocaleHelper), (0, _rootNode.rootNode)(_class = _dec(_class = (_DateInput = /*#__PURE__*/function (_React$Component) {
+
 
 
 
@@ -245,11 +251,6 @@ DateInput = exports.DateInput = (_dec = (0, _decorators.locale)('DatePicker', _l
 
 
 
-
-
-
-
-
 
 
 
@@ -259,16 +260,16 @@ DateInput = exports.DateInput = (_dec = (0, _decorators.locale)('DatePicker', _l
     renderIcon = function () {
       var _this$props = _this.props,withIcon = _this$props.withIcon,_this$props$disabled = _this$props.disabled,disabled = _this$props$disabled === void 0 ? false : _this$props$disabled;
       var size = _this.getProps().size;
-      var styles = _this.styles;
-      if (withIcon) {var _this$emotion$cx;
+
+      if (withIcon) {var _cx;
         var theme = _this.theme;
         var icon = /*#__PURE__*/_react.default.createElement(_CalendarIcon.CalendarIcon, { size: size });
-        var iconStyles = _this.emotion.cx((_this$emotion$cx = {}, _this$emotion$cx[
-        styles.icon(theme)] = true, _this$emotion$cx[
-        styles.iconSmall(theme)] = size === 'small', _this$emotion$cx[
-        styles.iconMedium(theme)] = size === 'medium', _this$emotion$cx[
-        styles.iconLarge(theme)] = size === 'large', _this$emotion$cx[
-        styles.iconDisabled(theme)] = disabled, _this$emotion$cx)
+        var iconStyles = (0, _Emotion.cx)((_cx = {}, _cx[
+        _DateInput2.styles.icon(theme)] = true, _cx[
+        _DateInput2.styles.iconSmall(theme)] = size === 'small', _cx[
+        _DateInput2.styles.iconMedium(theme)] = size === 'medium', _cx[
+        _DateInput2.styles.iconLarge(theme)] = size === 'large', _cx[
+        _DateInput2.styles.iconDisabled(theme)] = disabled, _cx)
         );
         return /*#__PURE__*/(
           _react.default.createElement("span", { className: iconStyles, "data-tid": DateInputDataTids.icon },
@@ -483,4 +484,4 @@ DateInput = exports.DateInput = (_dec = (0, _decorators.locale)('DatePicker', _l
         _this.shiftSelection(1);
       }
       _this.updateValue({ inputMode: inputMode });
-    };_this.state = { valueFormatted: '', selected: null, inputMode: false, focused: false, dragged: false };return _this;}(0, _inheritsLoose2.default)(DateInput, _React$Component);var _proto = DateInput.prototype;_proto.componentDidUpdate = function componentDidUpdate(prevProps) {var _this$getProps = this.getProps(),value = _this$getProps.value,minDate = _this$getProps.minDate,maxDate = _this$getProps.maxDate;if (prevProps.value !== value || prevProps.minDate !== minDate || prevProps.maxDate !== maxDate || this.iDateMediator.isChangedLocale(this.locale)) {this.updateFromProps(false);}this.selectNode();};_proto.componentDidMount = function componentDidMount() {this.updateFromProps(false);if (this.props.autoFocus) {this.focus();}};_proto.blur = function blur() {if (this.inputLikeText) {this.inputLikeText.blur();}};_proto.focus = function focus() {if (this.inputLikeText) {this.inputLikeText.focus();}};_proto.blink = function blink() {if (this.inputLikeText) {this.inputLikeText.blink();}};_proto.render = function render() {var _this2 = this;return /*#__PURE__*/_react.default.createElement(_Emotion.EmotionConsumer, null, function (emotion) {_this2.emotion = emotion;_this2.styles = (0, _DateInput2.getStyles)(_this2.emotion);return /*#__PURE__*/_react.default.createElement(_ThemeContext.ThemeContext.Consumer, null, function (theme) {_this2.theme = theme;return _this2.renderMain();});});};_proto.renderMain = function renderMain() {var _this$emotion$cx2;var _this$state2 = this.state,focused = _this$state2.focused,selected = _this$state2.selected,inputMode = _this$state2.inputMode,valueFormatted = _this$state2.valueFormatted;var showValue = Boolean(focused || valueFormatted);var _this$getProps2 = this.getProps(),width = _this$getProps2.width,size = _this$getProps2.size;return /*#__PURE__*/_react.default.createElement(_CommonWrapper.CommonWrapper, (0, _extends2.default)({ rootNodeRef: this.setRootNode }, this.props), /*#__PURE__*/_react.default.createElement(_FocusControlWrapper.FocusControlWrapper, { onBlurWhenDisabled: this.resetFocus }, /*#__PURE__*/_react.default.createElement(_InputLikeText.InputLikeText, { id: this.props.id, width: width, ref: this.inputLikeTextRef, size: size, disabled: this.props.disabled, error: this.props.error, warning: this.props.warning, onBlur: this.handleBlur, onFocus: this.handleFocus, onClick: this.props.onClick, onKeyDown: this.handleKeyDown, onMouseDownCapture: this.handleMouseDownCapture, onPaste: this.handlePaste, rightIcon: this.renderIcon(), onDoubleClickCapture: this.handleDoubleClick, onMouseDragStart: this.handleMouseDragStart, onMouseDragEnd: this.handleMouseDragEnd, value: this.iDateMediator.getInternalString(), inputMode: 'numeric', takeContentWidth: true }, /*#__PURE__*/_react.default.createElement("span", { className: this.emotion.cx(this.styles.value(), (_this$emotion$cx2 = {}, _this$emotion$cx2[this.styles.valueVisible()] = showValue, _this$emotion$cx2)) }, /*#__PURE__*/_react.default.createElement(_DateFragmentsView.DateFragmentsView, { ref: this.dateFragmentsViewRef, fragments: this.iDateMediator.getFragments(), onSelectDateComponent: this.handleSelectDateComponent, selected: selected, inputMode: inputMode })))));};return DateInput;}(_react.default.Component), _DateInput.__KONTUR_REACT_UI__ = 'DateInput', _DateInput.displayName = 'DateInput', _DateInput.defaultProps = { value: '', minDate: _constants.MIN_FULLDATE, maxDate: _constants.MAX_FULLDATE, size: 'small', width: 125 }, _DateInput)) || _class) || _class);
+    };_this.state = { valueFormatted: '', selected: null, inputMode: false, focused: false, dragged: false };return _this;}(0, _inheritsLoose2.default)(DateInput, _React$Component);var _proto = DateInput.prototype;_proto.componentDidUpdate = function componentDidUpdate(prevProps) {var _this$getProps = this.getProps(),value = _this$getProps.value,minDate = _this$getProps.minDate,maxDate = _this$getProps.maxDate;if (prevProps.value !== value || prevProps.minDate !== minDate || prevProps.maxDate !== maxDate || this.iDateMediator.isChangedLocale(this.locale)) {this.updateFromProps(false);}!this.props.disabled && this.selectNode();};_proto.componentDidMount = function componentDidMount() {this.updateFromProps(false);if (this.props.autoFocus) {this.focus();}};_proto.blur = function blur() {if (this.inputLikeText) {this.inputLikeText.blur();}};_proto.focus = function focus() {if (this.inputLikeText) {this.inputLikeText.focus();}};_proto.blink = function blink() {if (this.inputLikeText) {this.inputLikeText.blink();}};_proto.render = function render() {var _this2 = this;return /*#__PURE__*/_react.default.createElement(_ThemeContext.ThemeContext.Consumer, null, function (theme) {_this2.theme = theme;return _this2.renderMain();});};_proto.renderMain = function renderMain() {var _cx2;var _this$state2 = this.state,focused = _this$state2.focused,selected = _this$state2.selected,inputMode = _this$state2.inputMode,valueFormatted = _this$state2.valueFormatted;var showValue = Boolean(focused || valueFormatted);var _this$getProps2 = this.getProps(),width = _this$getProps2.width,size = _this$getProps2.size;return /*#__PURE__*/_react.default.createElement(_CommonWrapper.CommonWrapper, (0, _extends2.default)({ rootNodeRef: this.setRootNode }, this.props), /*#__PURE__*/_react.default.createElement(_FocusControlWrapper.FocusControlWrapper, { onBlurWhenDisabled: this.resetFocus }, /*#__PURE__*/_react.default.createElement(_InputLikeText.InputLikeText, { id: this.props.id, width: width, ref: this.inputLikeTextRef, size: size, disabled: this.props.disabled, error: this.props.error, warning: this.props.warning, onBlur: this.handleBlur, onFocus: this.handleFocus, onClick: this.props.onClick, onKeyDown: this.handleKeyDown, onMouseDownCapture: this.handleMouseDownCapture, onPaste: this.handlePaste, rightIcon: this.renderIcon(), onDoubleClickCapture: this.handleDoubleClick, onMouseDragStart: this.handleMouseDragStart, onMouseDragEnd: this.handleMouseDragEnd, value: this.iDateMediator.getInternalString(), inputMode: 'numeric', takeContentWidth: true, "aria-describedby": this.props['aria-describedby'], "aria-label": this.props['aria-label'], "aria-labelledby": this.props['aria-labelledby'] }, /*#__PURE__*/_react.default.createElement("span", { className: (0, _Emotion.cx)(_DateInput2.styles.value(), (_cx2 = {}, _cx2[_DateInput2.styles.valueVisible()] = showValue, _cx2)) }, /*#__PURE__*/_react.default.createElement(_DateFragmentsView.DateFragmentsView, { ref: this.dateFragmentsViewRef, fragments: this.iDateMediator.getFragments(), onSelectDateComponent: this.handleSelectDateComponent, selected: selected, inputMode: inputMode })))));};return DateInput;}(_react.default.Component), _DateInput.__KONTUR_REACT_UI__ = 'DateInput', _DateInput.displayName = 'DateInput', _DateInput.defaultProps = { value: '', minDate: _constants.MIN_FULLDATE, maxDate: _constants.MAX_FULLDATE, size: 'small', width: 125 }, _DateInput)) || _class) || _class);