@megafon/ui-shared 4.20.6 → 4.21.1

package/CHANGELOG.md

@@ -3,6 +3,25 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [4.21.1](https://hq-gitlab.megafon.ru/site-portal/libraries/javascript/megafon-ui/compare/@megafon/ui-shared@4.21.0...@megafon/ui-shared@4.21.1) (2023-08-25)
+
+**Note:** Version bump only for package @megafon/ui-shared
+
+
+
+
+
+# [4.21.0](https://hq-gitlab.megafon.ru/site-portal/libraries/javascript/megafon-ui/compare/@megafon/ui-shared@4.20.5...@megafon/ui-shared@4.21.0) (2023-08-21)
+
+
+### Features
+
+* **property:** redisign component, add new not required props ([f03a822](https://hq-gitlab.megafon.ru/site-portal/libraries/javascript/megafon-ui/commit/f03a822006afed0dd20ad9c9971621c48e50655f))
+
+
+
+
+
 ## [4.20.6](https://hq-gitlab.megafon.ru/site-portal/libraries/javascript/megafon-ui/compare/@megafon/ui-shared@4.20.5...@megafon/ui-shared@4.20.6) (2023-07-18)
 
 **Note:** Version bump only for package @megafon/ui-shared

package/dist/es/components/AccordionBox/AccordionBox.d.ts

@@ -27,7 +27,7 @@ export interface IAccordionBox {
     isFullWidth?: boolean;
     /** Центрирование по горизонтали для расширения 1280+ */
     hCenterAlignWide?: boolean;
-    /** Дополнительный класс для корнеовго элемента */
+    /** Дополнительный класс для корневого элемента */
     className?: string;
     /** Дополнительные классы для корневого и внутренних элементов */
     classes?: {

package/dist/es/components/AccordionBox/AccordionBox.js

@@ -1,3 +1,4 @@
+import _extends from "@babel/runtime/helpers/extends";
 import "core-js/modules/es.array.index-of.js";
 import "core-js/modules/es.symbol.js";
 
@@ -20,6 +21,7 @@ import { cnCreate } from '@megafon/ui-helpers';
 import * as PropTypes from 'prop-types';
 import "./AccordionBox.css";
 import { getColumnConfig } from "../../helpers/getColumnConfig";
+var testIdPrefix = 'AccordionBox';
 var cn = cnCreate('mfui-accordion-box');
 
 var AccordionBox = function AccordionBox(_a) {
@@ -32,8 +34,19 @@ var AccordionBox = function AccordionBox(_a) {
   return /*#__PURE__*/React.createElement("div", {
     className: cn()
   }, /*#__PURE__*/React.createElement(Grid, {
-    hAlign: hCenterAlignWide ? 'center' : 'left'
-  }, /*#__PURE__*/React.createElement(GridColumn, getColumnConfig(isFullWidth), /*#__PURE__*/React.createElement(Accordion, restProps))));
+    hAlign: hCenterAlignWide ? 'center' : 'left',
+    dataAttrs: {
+      container: {
+        'data-testid': "".concat(testIdPrefix, "-container")
+      }
+    }
+  }, /*#__PURE__*/React.createElement(GridColumn, _extends({}, getColumnConfig(isFullWidth), {
+    dataAttrs: {
+      root: {
+        'data-testid': "".concat(testIdPrefix, "-column")
+      }
+    }
+  }), /*#__PURE__*/React.createElement(Accordion, restProps))));
 };
 
 AccordionBox.propTypes = {

package/dist/es/components/Card/Card.css

@@ -5,7 +5,7 @@ h4,
 h5 {
   margin: 0;
 }
-.mfui-card {
+.mfui-card-old {
   display: -webkit-box;
   display: -ms-flexbox;
   display: flex;
@@ -15,7 +15,7 @@ h5 {
   -webkit-box-shadow: 0 2px 12px rgba(0, 0, 0, 0.1);
           box-shadow: 0 2px 12px rgba(0, 0, 0, 0.1);
 }
-.mfui-card__inner {
+.mfui-card-old__inner {
   display: -webkit-box;
   display: -ms-flexbox;
   display: flex;
@@ -34,18 +34,18 @@ h5 {
   padding: 32px 20px;
 }
 @media screen and (max-width: 767px) {
-  .mfui-card__inner {
+  .mfui-card-old__inner {
     padding: 24px 16px;
   }
 }
-.mfui-card__text {
+.mfui-card-old__text {
   font-size: 15px;
   line-height: 24px;
   font-weight: 400;
   margin-top: 12px;
   color: var(--content);
 }
-.mfui-card__btns-wrapper {
+.mfui-card-old__btns-wrapper {
   display: -webkit-box;
   display: -ms-flexbox;
   display: flex;
@@ -60,30 +60,30 @@ h5 {
   margin-top: auto;
   padding-top: 12px;
 }
-.mfui-card__btns-wrapper_left-align {
+.mfui-card-old__btns-wrapper_left-align {
   -webkit-box-pack: start;
       -ms-flex-pack: start;
           justify-content: flex-start;
 }
-.mfui-card__fake-link {
+.mfui-card-old__fake-link {
   color: var(--systemBlue);
 }
-.mfui-card__button,
-.mfui-card__link,
-.mfui-card__fake-link {
+.mfui-card-old__button,
+.mfui-card-old__link,
+.mfui-card-old__fake-link {
   margin: 12px 10px;
 }
-.mfui-card__svg-wrapper {
+.mfui-card-old__svg-wrapper {
   margin-bottom: 24px;
 }
-.mfui-card__svg-wrapper svg {
+.mfui-card-old__svg-wrapper svg {
   width: 40px;
   height: 40px;
 }
-.mfui-card__pic-wrapper .mfui-card__img {
+.mfui-card-old__pic-wrapper .mfui-card-old__img {
   max-width: 100%;
 }
-.mfui-card__pic-wrapper {
+.mfui-card-old__pic-wrapper {
   display: -webkit-box;
   display: -ms-flexbox;
   display: flex;
@@ -99,32 +99,32 @@ h5 {
   margin-left: -20px;
 }
 @media screen and (max-width: 767px) {
-  .mfui-card__pic-wrapper {
+  .mfui-card-old__pic-wrapper {
     margin-top: -24px;
     margin-right: -16px;
     margin-bottom: 24px;
     margin-left: -16px;
   }
 }
-.mfui-card__pic-wrapper_object-fit_fill img {
+.mfui-card-old__pic-wrapper_object-fit_fill img {
   width: 100%;
   height: auto;
 }
-.mfui-card__pic-wrapper_object-fit_contain img {
+.mfui-card-old__pic-wrapper_object-fit_contain img {
   width: auto;
   height: 100%;
 }
-.mfui-card_href * {
+.mfui-card-old_href * {
   text-decoration: none !important;
 }
-.mfui-card_href:hover {
+.mfui-card-old_href:hover {
   -webkit-box-shadow: 0 8px 28px rgba(0, 0, 0, 0.1);
           box-shadow: 0 8px 28px rgba(0, 0, 0, 0.1);
 }
-.mfui-card_full-height {
+.mfui-card-old_full-height {
   height: 100%;
 }
-.mfui-card_centered-text .mfui-card__text,
-.mfui-card_centered-text .mfui-card__title {
+.mfui-card-old_centered-text .mfui-card-old__text,
+.mfui-card-old_centered-text .mfui-card-old__title {
   text-align: center;
 }

package/dist/es/components/Card/Card.js

@@ -14,7 +14,7 @@ export var ObjectFit = {
   FILL: 'fill',
   CONTAIN: 'contain'
 };
-var cn = cnCreate('mfui-card');
+var cn = cnCreate('mfui-card-old');
 
 var Card = function Card(_ref) {
   var dataAttrs = _ref.dataAttrs,

package/dist/es/components/Property/Property.css

@@ -15,98 +15,124 @@ h5 {
           flex-direction: column;
   padding: 24px 0;
 }
-@media screen and (min-width: 1280px) {
-  .mfui-property__wrapper {
-    padding: 26px 0;
-  }
+.mfui-property_border-top.mfui-property_border-color_default .mfui-property__wrapper {
+  border-top: 1px solid var(--spbSky1);
+}
+.mfui-property_border-bottom.mfui-property_border-color_default .mfui-property__wrapper {
+  border-bottom: 1px solid var(--spbSky1);
 }
-.mfui-property_border-top .mfui-property__wrapper {
+.mfui-property_border-top.mfui-property_border-color_darker .mfui-property__wrapper {
   border-top: 1px solid var(--spbSky2);
 }
-.mfui-property_border-bottom .mfui-property__wrapper {
+.mfui-property_border-bottom.mfui-property_border-color_darker .mfui-property__wrapper {
   border-bottom: 1px solid var(--spbSky2);
 }
-.mfui-property__content {
+.mfui-property__main {
   display: -webkit-box;
   display: -ms-flexbox;
   display: flex;
+  gap: 20px;
+  -webkit-box-align: baseline;
+      -ms-flex-align: baseline;
+          align-items: baseline;
+  -webkit-box-pack: justify;
+      -ms-flex-pack: justify;
+          justify-content: space-between;
 }
-.mfui-property__item {
-  display: -webkit-box;
-  display: -ms-flexbox;
-  display: flex;
+.mfui-property__main:not(:first-child) {
+  margin-top: 24px;
+}
+.mfui-property__main_with-out-title {
+  margin-top: 16px !important;
+}
+.mfui-property__main_with-badge {
+  -webkit-box-align: center;
+      -ms-flex-align: center;
+          align-items: center;
+}
+.mfui-property__title-item_size_default {
+  font-size: 15px;
+  line-height: 24px;
+  font-weight: 500;
+}
+.mfui-property__title-item_size_big {
+  font-weight: 500;
+  font-size: 18px;
+  line-height: 24px;
+  letter-spacing: 0.5px;
+}
+@media screen and (min-width: 1280px) {
+  .mfui-property__title-item_size_big {
+    font-size: 20px;
+    line-height: 28px;
+  }
+}
+@media screen and (max-width: 767px) {
+  .mfui-property__title-item {
+    font-size: 15px;
+    line-height: 24px;
+    font-weight: 500;
+  }
 }
 .mfui-property__icon {
   display: inline-block;
   width: 24px;
   height: 24px;
-  margin-right: 9px;
+  margin-right: 8px;
   margin-left: 1px;
   overflow: hidden;
   vertical-align: bottom;
 }
 .mfui-property__badge {
-  padding: 2px 8px;
-  border-radius: 2px;
-  color: var(--stcWhite);
-  font-size: 12px;
-  background: var(--137C);
-}
-.mfui-property__inner {
-  -webkit-box-flex: 1;
-      -ms-flex-positive: 1;
-          flex-grow: 1;
-  padding-right: 20px;
-}
-@media screen and (min-width: 768px) and (max-width: 1023px) {
-  .mfui-property__inner {
-    padding-right: 77px;
+  margin-bottom: 8px;
+}
+@media screen and (min-width: 768px) {
+  .mfui-property__title .mfui-property__desc {
+    width: 100%;
   }
 }
-@media screen and (max-width: 767px) {
-  .mfui-property__inner {
-    padding-right: 8px;
+.mfui-property__tooltip {
+  display: inline-block;
+  width: 20px;
+  height: 20px;
+  margin-left: 8px;
+  vertical-align: text-bottom;
+  cursor: pointer;
+  fill: var(--spbSky2);
+}
+.mfui-property__tooltip-inner {
+  max-width: 350px;
+}
+.mfui-property__desc {
+  margin-top: 12px;
+}
+@media screen and (min-width: 768px) {
+  .mfui-property__desc {
+    width: 70%;
   }
 }
-.mfui-property__items-wrapper {
-  width: 100%;
+.mfui-property__desc_collapsible {
+  margin-top: 12px;
 }
 .mfui-property__value-wrapper {
   display: -webkit-box;
   display: -ms-flexbox;
   display: flex;
-  -ms-flex-negative: 0;
-      flex-shrink: 0;
-  -webkit-box-align: start;
-      -ms-flex-align: start;
-          align-items: flex-start;
-  -webkit-box-pack: end;
-      -ms-flex-pack: end;
-          justify-content: flex-end;
-  width: 35%;
-}
-@media screen and (max-width: 479px) {
-  .mfui-property__value-wrapper {
-    width: auto;
-    padding-left: 10px;
-  }
-}
-.mfui-property__value-wrapper_merged {
-  -webkit-box-align: center;
-      -ms-flex-align: center;
-          align-items: center;
-  border-left: 1px solid var(--spbSky2);
+  -webkit-box-align: baseline;
+      -ms-flex-align: baseline;
+          align-items: baseline;
+  padding: 4px 8px;
+  border-radius: 8px;
+  white-space: pre-line;
+  text-align: right;
 }
-.mfui-property__desc {
-  margin-top: 8px;
+.mfui-property__value-wrapper_frame_default {
+  background: var(--base);
 }
-.mfui-property__item + .mfui-property__item {
-  margin-top: 16px;
+.mfui-property__value-wrapper_frame_gray {
+  background: var(--spbSky0);
 }
 .mfui-property__value {
-  max-width: 234px;
-  white-space: pre-line;
-  text-align: right;
   font-weight: 500;
   font-size: 18px;
   line-height: 24px;
@@ -125,3 +151,6 @@ h5 {
     font-weight: 500;
   }
 }
+.mfui-property__value-unit:before {
+  content: '\00a0';
+}

package/dist/es/components/Property/Property.d.ts

@@ -1,4 +1,5 @@
-import React, { Ref } from 'react';
+import React, { Ref, ComponentProps } from 'react';
+import { PromoBadge } from '@megafon/ui-core';
 import './Property.less';
 import { Item } from './types';
 export interface IProperty {
@@ -10,10 +11,16 @@ export interface IProperty {
     className?: string;
     /** Текст для бейджа */
     badge?: string;
+    /** Тип бейджа */
+    badgeType?: ComponentProps<typeof PromoBadge>['type'];
+    /** Текст тултипа */
+    tooltip?: string;
     /** Отключить верхнюю границу */
     disableBorderTop?: boolean;
     /** Наличие нижней границы */
     borderBottom?: boolean;
+    /** Цвет верхней и нижней границ */
+    borderColor?: 'default' | 'darker';
     /** Единое значение для всей строки */
     mergedValue?: string;
     /** Иконка для строки */
@@ -32,5 +39,6 @@ export interface IProperty {
         toggleDescription?: string;
     };
 }
+export declare const testIdPrefix = "Property";
 declare const Property: React.FC<IProperty>;
 export default Property;

package/dist/es/components/Property/Property.js

@@ -2,13 +2,23 @@ import _extends from "@babel/runtime/helpers/extends";
 import "core-js/modules/es.array.map.js";
 import "core-js/modules/es.symbol.js";
 import "core-js/modules/es.symbol.description.js";
-import React from 'react';
-import { Header, Grid, GridColumn } from '@megafon/ui-core';
-import { cnCreate, filterDataAttrs } from '@megafon/ui-helpers';
+import React, { Fragment, useRef } from 'react';
+import { Grid, GridColumn, PromoBadge, Caption, Tooltip } from '@megafon/ui-core';
+import { cnCreate, filterDataAttrs, convert } from '@megafon/ui-helpers';
 import PropTypes from 'prop-types';
 import "./Property.css";
 import { getColumnConfig } from "../../helpers/getColumnConfig";
 import PropertyDescription from "./PropertyDescription";
+
+var InfoIcon = function InfoIcon(props) {
+  return /*#__PURE__*/React.createElement("svg", _extends({
+    viewBox: "0 0 20 20"
+  }, props), /*#__PURE__*/React.createElement("path", {
+    d: "M10 2c4.4 0 8 3.6 8 8s-3.6 8-8 8-8-3.6-8-8 3.6-8 8-8zm0 5c.6 0 1-.4 1-1s-.4-1-1-1-1 .4-1 1 .4 1 1 1zm1 8V9H9v6h2z"
+  }));
+};
+
+export var testIdPrefix = 'Property';
 var cn = cnCreate('mfui-property');
 
 var Property = function Property(_ref) {
@@ -17,11 +27,16 @@ var Property = function Property(_ref) {
       className = _ref.className,
       _ref$badge = _ref.badge,
       badge = _ref$badge === void 0 ? '' : _ref$badge,
+      _ref$badgeType = _ref.badgeType,
+      badgeType = _ref$badgeType === void 0 ? 'popular' : _ref$badgeType,
+      tooltip = _ref.tooltip,
       icon = _ref.icon,
       _ref$disableBorderTop = _ref.disableBorderTop,
       disableBorderTop = _ref$disableBorderTop === void 0 ? false : _ref$disableBorderTop,
       _ref$borderBottom = _ref.borderBottom,
       borderBottom = _ref$borderBottom === void 0 ? false : _ref$borderBottom,
+      _ref$borderColor = _ref.borderColor,
+      borderColor = _ref$borderColor === void 0 ? 'default' : _ref$borderColor,
       _ref$mergedValue = _ref.mergedValue,
       mergedValue = _ref$mergedValue === void 0 ? '' : _ref$mergedValue,
       _ref$fullWidth = _ref.fullWidth,
@@ -29,23 +44,37 @@ var Property = function Property(_ref) {
       _ref$classes = _ref.classes,
       classes = _ref$classes === void 0 ? {} : _ref$classes,
       dataAttrs = _ref.dataAttrs;
-  var renderTitle = React.useCallback(function (title) {
+  var tooltipRef = useRef(null);
+
+  var renderTitle = function renderTitle(title, titleSize, isFirstItem) {
     return title && title.map(function (titleItem, i) {
-      return /*#__PURE__*/React.createElement(Header, {
-        as: "h5",
+      var isFirstTitle = i === 0;
+      return /*#__PURE__*/React.createElement("div", {
         key: i,
-        className: classes.title
-      }, icon && i === 0 && /*#__PURE__*/React.createElement("div", {
+        className: cn('title-item', {
+          size: titleSize
+        }, [classes.title]),
+        "data-testid": "".concat(testIdPrefix, "-title-item")
+      }, icon && isFirstTitle && /*#__PURE__*/React.createElement("div", {
         className: cn('icon')
-      }, icon), titleItem);
+      }, icon), titleItem, tooltip && isFirstItem && isFirstTitle && /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("div", {
+        className: cn('tooltip'),
+        ref: tooltipRef
+      }, /*#__PURE__*/React.createElement(InfoIcon, null)), /*#__PURE__*/React.createElement(Tooltip, {
+        className: cn('tooltip-inner'),
+        triggerElement: tooltipRef
+      }, tooltip)));
     });
-  }, [classes.title, icon]);
-  var renderDescription = React.useCallback(function (description) {
+  };
+
+  var renderDescription = function renderDescription(description) {
     return description && description.map(function (_ref2, j) {
       var value = _ref2.value,
           isCollapsible = _ref2.isCollapsible;
       return /*#__PURE__*/React.createElement("div", {
-        className: cn('desc'),
+        className: cn('desc', {
+          collapsible: isCollapsible
+        }),
         key: j
       }, /*#__PURE__*/React.createElement(PropertyDescription, {
         value: value,
@@ -59,44 +88,63 @@ var Property = function Property(_ref) {
         }
       }));
     });
-  }, [classes.openedDescription, classes.toggleDescription, dataAttrs === null || dataAttrs === void 0 ? void 0 : dataAttrs.moreLink]);
+  };
+
+  var renderValue = function renderValue(valueFrameColor, value, valueUnit) {
+    return /*#__PURE__*/React.createElement("div", {
+      className: cn('value-wrapper', {
+        frame: valueFrameColor
+      }),
+      "data-testid": "".concat(testIdPrefix, "-value")
+    }, /*#__PURE__*/React.createElement("div", {
+      className: cn('value')
+    }, convert(value, {})), valueUnit && /*#__PURE__*/React.createElement(Caption, {
+      className: cn('value-unit'),
+      hasMargin: false
+    }, convert(valueUnit, {})));
+  };
+
   return /*#__PURE__*/React.createElement("div", _extends({
     className: cn({
       'border-top': !disableBorderTop,
-      'border-bottom': borderBottom
+      'border-bottom': borderBottom,
+      'border-color': borderColor
     }, [className]),
     ref: rootRef
-  }, filterDataAttrs(dataAttrs === null || dataAttrs === void 0 ? void 0 : dataAttrs.root)), /*#__PURE__*/React.createElement(Grid, null, /*#__PURE__*/React.createElement(GridColumn, getColumnConfig(fullWidth), /*#__PURE__*/React.createElement("div", {
+  }, filterDataAttrs(dataAttrs === null || dataAttrs === void 0 ? void 0 : dataAttrs.root)), /*#__PURE__*/React.createElement(Grid, null, /*#__PURE__*/React.createElement(GridColumn, _extends({}, getColumnConfig(fullWidth), {
+    dataAttrs: {
+      root: {
+        'data-testid': "".concat(testIdPrefix, "-gridColumn")
+      }
+    }
+  }), /*#__PURE__*/React.createElement("div", {
     className: cn('wrapper')
-  }, badge && /*#__PURE__*/React.createElement("div", {
-    className: cn('badge-wrapper')
-  }, /*#__PURE__*/React.createElement("span", {
-    className: cn('badge')
-  }, badge)), /*#__PURE__*/React.createElement("div", {
-    className: cn('content')
-  }, /*#__PURE__*/React.createElement("div", {
-    className: cn('items-wrapper')
   }, items.map(function (_ref3, i) {
     var title = _ref3.title,
         value = _ref3.value,
-        description = _ref3.description;
-    return /*#__PURE__*/React.createElement("div", {
-      className: cn('item'),
+        description = _ref3.description,
+        _ref3$valueUnit = _ref3.valueUnit,
+        valueUnit = _ref3$valueUnit === void 0 ? '' : _ref3$valueUnit,
+        _ref3$titleSize = _ref3.titleSize,
+        titleSize = _ref3$titleSize === void 0 ? 'default' : _ref3$titleSize,
+        _ref3$valueFrameColor = _ref3.valueFrameColor,
+        valueFrameColor = _ref3$valueFrameColor === void 0 ? 'default' : _ref3$valueFrameColor;
+    var isFirstItem = i === 0;
+    var isRenderBadge = isFirstItem && !!badge;
+    return /*#__PURE__*/React.createElement(Fragment, {
       key: i
     }, /*#__PURE__*/React.createElement("div", {
-      className: cn('inner')
-    }, renderTitle(title), renderDescription(description)), !mergedValue && /*#__PURE__*/React.createElement("div", {
-      className: cn('value-wrapper')
-    }, value && /*#__PURE__*/React.createElement("span", {
-      className: cn('value')
-    }, value)));
-  })), mergedValue && /*#__PURE__*/React.createElement("div", {
-    className: cn('value-wrapper', {
-      merged: true
-    })
-  }, /*#__PURE__*/React.createElement(Header, {
-    as: "h3"
-  }, mergedValue)))))));
+      className: cn('main', {
+        'with-badge': isRenderBadge,
+        'with-out-title': !title
+      })
+    }, /*#__PURE__*/React.createElement("div", {
+      className: cn('title')
+    }, isRenderBadge && /*#__PURE__*/React.createElement(PromoBadge, {
+      className: cn('badge'),
+      type: badgeType
+    }, badge), title ? renderTitle(title, titleSize, isFirstItem) : renderDescription(description)), mergedValue && isFirstItem && renderValue(valueFrameColor, mergedValue, valueUnit), !mergedValue && value && renderValue(valueFrameColor, value, valueUnit)), title && renderDescription(description));
+  })))));
 };
 
 Property.propTypes = {
@@ -109,12 +157,18 @@ Property.propTypes = {
       value: PropTypes.oneOfType([PropTypes.string, PropTypes.arrayOf(PropTypes.node)]).isRequired,
       isCollapsible: PropTypes.bool
     })),
-    value: PropTypes.string
+    value: PropTypes.string,
+    titleSize: PropTypes.oneOf(['default', 'big']),
+    valueUnit: PropTypes.string,
+    valueFrameColor: PropTypes.oneOf(['default', 'gray'])
   }).isRequired).isRequired,
   className: PropTypes.string,
   badge: PropTypes.string,
+  badgeType: PropTypes.oneOf(['hit', 'new', 'vip', 'popular', 'user-choice', 'interests']),
+  tooltip: PropTypes.string,
   disableBorderTop: PropTypes.bool,
   borderBottom: PropTypes.bool,
+  borderColor: PropTypes.oneOf(['default', 'darker']),
   mergedValue: PropTypes.string,
   icon: PropTypes.node,
   fullWidth: PropTypes.bool,

package/dist/es/components/Property/PropertyDescription.css

@@ -13,5 +13,5 @@ h5 {
   cursor: pointer;
 }
 .mfui-property-description__content-inner {
-  margin-top: 8px;
+  margin-bottom: 8px;
 }

package/dist/es/components/Property/PropertyDescription.d.ts

@@ -1,5 +1,6 @@
 import * as React from 'react';
 import './PropertyDescription.less';
 import { Desc } from './types';
+export declare const testIdPrefix = "PropertyDescription";
 declare const PropertyDescription: React.FC<Desc>;
 export default PropertyDescription;