@megafon/ui-core 4.3.0 → 4.4.0

package/CHANGELOG.md

@@ -3,6 +3,23 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+# [4.4.0](https://github.com/MegafonWebLab/megafon-ui/compare/@megafon/ui-core@4.3.0...@megafon/ui-core@4.4.0) (2022-10-10)
+
+
+### Bug Fixes
+
+* **textfield:** fix input height in Safari ([b60e1ac](https://github.com/MegafonWebLab/megafon-ui/commit/b60e1acd76dc80b4609b55dc8256eb94e8e8ec0c))
+* **tooltip:** fix touch device controlled trigger ([e983ca8](https://github.com/MegafonWebLab/megafon-ui/commit/e983ca88636990e467b43483b0cf0df06dff8553))
+
+
+### Features
+
+* **select:** add new props useShortListItems ([31d1172](https://github.com/MegafonWebLab/megafon-ui/commit/31d1172484ca4c07060ff64eb7f3be692f5dbdec))
+
+
+
+
+
 # [4.3.0](https://github.com/MegafonWebLab/megafon-ui/compare/@megafon/ui-core@4.2.0...@megafon/ui-core@4.3.0) (2022-10-05)
 
 

package/dist/es/components/Select/Select.css

@@ -178,6 +178,9 @@
   padding: 16px;
   overflow-y: auto;
 }
+.mfui-select__list-inner_short {
+  max-height: 235px;
+}
 .mfui-select__list-inner::-webkit-scrollbar {
   width: 16px;
 }

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

@@ -56,6 +56,8 @@ export interface ISelectProps<T extends SelectItemValueType> {
     notFoundText?: string;
     /** Массив элементов селекта */
     items: Array<ISelectItem<T>>;
+    /** Отображать короткий выпадающий список */
+    shortList?: boolean;
     /** Дополнительный класс корневого элемента */
     className?: string;
     /** Дополнительные классы для внутренних элементов */
@@ -88,7 +90,7 @@ export interface ISelectProps<T extends SelectItemValueType> {
     onClosed?: () => void;
 }
 declare const Select: {
-    <T extends string | number | undefined>({ type, disabled, verification, noticeText, label, labelId, required, className, classes, dataAttrs, notFoundText, items, placeholder, currentValue, onClosed, onOpened, onSelect, }: ISelectProps<T>): JSX.Element;
+    <T extends string | number | undefined>({ type, disabled, verification, noticeText, label, labelId, required, className, classes, dataAttrs, notFoundText, items, placeholder, currentValue, shortList, onClosed, onOpened, onSelect, }: ISelectProps<T>): JSX.Element;
     propTypes: {
         type: PropTypes.Requireable<"classic" | "combobox">;
         label: PropTypes.Requireable<string>;
@@ -144,6 +146,7 @@ declare const Select: {
             value: PropTypes.Validator<string | number>;
             paddings: PropTypes.Requireable<"small" | "large">;
         }>> | null | undefined)[]>;
+        shortList: PropTypes.Requireable<boolean>;
         onSelect: PropTypes.Requireable<(...args: any[]) => any>;
         onOpened: PropTypes.Requireable<(...args: any[]) => any>;
         onClosed: PropTypes.Requireable<(...args: any[]) => any>;

package/dist/es/components/Select/Select.js

@@ -73,6 +73,8 @@ var Select = function Select(_ref) {
       items = _ref.items,
       placeholder = _ref.placeholder,
       currentValue = _ref.currentValue,
+      _ref$shortList = _ref.shortList,
+      shortList = _ref$shortList === void 0 ? false : _ref$shortList,
       onClosed = _ref.onClosed,
       onOpened = _ref.onOpened,
       onSelect = _ref.onSelect;
@@ -380,7 +382,9 @@ var Select = function Select(_ref) {
     return /*#__PURE__*/React.createElement("div", {
       className: cn('list', [classes.list])
     }, /*#__PURE__*/React.createElement("div", {
-      className: cn('list-inner', [classes.listInner]),
+      className: cn('list-inner', {
+        "short": shortList
+      }, [classes.listInner]),
       ref: itemWrapperNode
     }, currentItems.map(function (_ref3, i) {
       var title = _ref3.title,
@@ -471,6 +475,7 @@ Select.propTypes = {
     value: PropTypes.oneOfType([PropTypes.string, PropTypes.number]).isRequired,
     paddings: PropTypes.oneOf(Object.values(SelectItemsPaddings))
   })).isRequired,
+  shortList: PropTypes.bool,
   onSelect: PropTypes.func,
   onOpened: PropTypes.func,
   onClosed: PropTypes.func

package/dist/es/components/TextField/TextField.css

@@ -12,6 +12,7 @@
 .mfui-text-field__field {
   display: block;
   width: 100%;
+  margin: 0;
   padding: 25px 56px 9px 16px;
   border: 1px solid var(--spbSky2);
   border-radius: 12px;

package/dist/es/components/Tooltip/Tooltip.js

@@ -132,7 +132,11 @@ var Tooltip = function Tooltip(_ref) {
     return isTouchDevice ? TOUCH_KEY : MOUSE_KEY;
   }, [isTouchDevice]);
   var triggerEventName = useMemo(function () {
-    return isTouchDevice ? 'click' : triggerEvent;
+    if (triggerEvent === TriggerEvent.CONTROLLED || !isTouchDevice) {
+      return triggerEvent;
+    }
+
+    return TriggerEvent.CLICK;
   }, [isTouchDevice, triggerEvent]);
   var handleMouseEnter = useCallback(function (e) {
     if (!isOpen) {

package/dist/lib/components/Select/Select.css

@@ -178,6 +178,9 @@
   padding: 16px;
   overflow-y: auto;
 }
+.mfui-select__list-inner_short {
+  max-height: 235px;
+}
 .mfui-select__list-inner::-webkit-scrollbar {
   width: 16px;
 }

package/dist/lib/components/Select/Select.d.ts

@@ -56,6 +56,8 @@ export interface ISelectProps<T extends SelectItemValueType> {
     notFoundText?: string;
     /** Массив элементов селекта */
     items: Array<ISelectItem<T>>;
+    /** Отображать короткий выпадающий список */
+    shortList?: boolean;
     /** Дополнительный класс корневого элемента */
     className?: string;
     /** Дополнительные классы для внутренних элементов */
@@ -88,7 +90,7 @@ export interface ISelectProps<T extends SelectItemValueType> {
     onClosed?: () => void;
 }
 declare const Select: {
-    <T extends string | number | undefined>({ type, disabled, verification, noticeText, label, labelId, required, className, classes, dataAttrs, notFoundText, items, placeholder, currentValue, onClosed, onOpened, onSelect, }: ISelectProps<T>): JSX.Element;
+    <T extends string | number | undefined>({ type, disabled, verification, noticeText, label, labelId, required, className, classes, dataAttrs, notFoundText, items, placeholder, currentValue, shortList, onClosed, onOpened, onSelect, }: ISelectProps<T>): JSX.Element;
     propTypes: {
         type: PropTypes.Requireable<"classic" | "combobox">;
         label: PropTypes.Requireable<string>;
@@ -144,6 +146,7 @@ declare const Select: {
             value: PropTypes.Validator<string | number>;
             paddings: PropTypes.Requireable<"small" | "large">;
         }>> | null | undefined)[]>;
+        shortList: PropTypes.Requireable<boolean>;
         onSelect: PropTypes.Requireable<(...args: any[]) => any>;
         onOpened: PropTypes.Requireable<(...args: any[]) => any>;
         onClosed: PropTypes.Requireable<(...args: any[]) => any>;

package/dist/lib/components/Select/Select.js

@@ -108,6 +108,8 @@ var Select = function Select(_ref) {
       items = _ref.items,
       placeholder = _ref.placeholder,
       currentValue = _ref.currentValue,
+      _ref$shortList = _ref.shortList,
+      shortList = _ref$shortList === void 0 ? false : _ref$shortList,
       onClosed = _ref.onClosed,
       onOpened = _ref.onOpened,
       onSelect = _ref.onSelect;
@@ -415,7 +417,9 @@ var Select = function Select(_ref) {
     return /*#__PURE__*/React.createElement("div", {
       className: cn('list', [classes.list])
     }, /*#__PURE__*/React.createElement("div", {
-      className: cn('list-inner', [classes.listInner]),
+      className: cn('list-inner', {
+        "short": shortList
+      }, [classes.listInner]),
       ref: itemWrapperNode
     }, currentItems.map(function (_ref3, i) {
       var title = _ref3.title,
@@ -506,6 +510,7 @@ Select.propTypes = {
     value: PropTypes.oneOfType([PropTypes.string, PropTypes.number]).isRequired,
     paddings: PropTypes.oneOf(Object.values(SelectItemsPaddings))
   })).isRequired,
+  shortList: PropTypes.bool,
   onSelect: PropTypes.func,
   onOpened: PropTypes.func,
   onClosed: PropTypes.func

package/dist/lib/components/TextField/TextField.css

@@ -12,6 +12,7 @@
 .mfui-text-field__field {
   display: block;
   width: 100%;
+  margin: 0;
   padding: 25px 56px 9px 16px;
   border: 1px solid var(--spbSky2);
   border-radius: 12px;

package/dist/lib/components/Tooltip/Tooltip.js

@@ -161,7 +161,11 @@ var Tooltip = function Tooltip(_ref) {
     return isTouchDevice ? TOUCH_KEY : MOUSE_KEY;
   }, [isTouchDevice]);
   var triggerEventName = (0, _react.useMemo)(function () {
-    return isTouchDevice ? 'click' : triggerEvent;
+    if (triggerEvent === TriggerEvent.CONTROLLED || !isTouchDevice) {
+      return triggerEvent;
+    }
+
+    return TriggerEvent.CLICK;
   }, [isTouchDevice, triggerEvent]);
   var handleMouseEnter = (0, _react.useCallback)(function (e) {
     if (!isOpen) {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@megafon/ui-core",
-  "version": "4.3.0",
+  "version": "4.4.0",
   "files": [
     "dist",
     "styles"
@@ -97,5 +97,5 @@
     "react-popper": "^2.2.3",
     "swiper": "^6.5.6"
   },
-  "gitHead": "d46a63dbfc20ee931c4e12a82287b7385596bbcf"
+  "gitHead": "ab68c8392f13f494977b7a6e44104f9ae1b1f64b"
 }