@skbkontur/react-ui 4.15.1 → 4.16.0-next.1

package/CHANGELOG.md

@@ -3,6 +3,26 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+# [4.16.0-next.1](https://github.com/skbkontur/retail-ui/compare/@skbkontur/react-ui@4.15.1...@skbkontur/react-ui@4.16.0-next.1) (2023-07-04)
+
+
+### Bug Fixes
+
+* **Calendar:** return customization of current day border in theme 2022 ([#3186](https://github.com/skbkontur/retail-ui/issues/3186)) ([1595e1d](https://github.com/skbkontur/retail-ui/commit/1595e1df80d72d42116f9604b44565733ce4895f))
+* **DropdownMenu,TooltipMenu,Kebab:** add preventIconsOffset prop ([beb6f90](https://github.com/skbkontur/retail-ui/commit/beb6f900f0e4c7c4b9e79d86f8b0066ae75b400d))
+
+
+
+
+
+# [4.16.0-next.0](https://github.com/skbkontur/retail-ui/compare/@skbkontur/react-ui@4.15.0...@skbkontur/react-ui@4.16.0-next.0) (2023-06-13)
+
+**Note:** Version bump only for package @skbkontur/react-ui
+
+
+
+
+
 ## [4.15.1](https://github.com/skbkontur/retail-ui/compare/@skbkontur/react-ui@4.15.0...@skbkontur/react-ui@4.15.1) (2023-07-04)
 
 

package/cjs/components/Calendar/DayCellView.js

@@ -43,7 +43,7 @@ function DayCellView(props) {var _cx;
       className: (0, _Emotion.cx)((_cx = {}, _cx[
       _DayCellView.styles.cell(theme)] = true, _cx[
       _DayCellView.styles.today(theme)] = isToday && !_isTheme2022, _cx[
-      _DayCellView.styles.today2022()] = isToday && _isTheme2022, _cx[
+      _DayCellView.styles.today2022(theme)] = isToday && _isTheme2022, _cx[
       _DayCellView.styles.selected(theme)] = Boolean(value && CDS.isEqual(date, value)), _cx[
       _DayCellView.styles.weekend(theme)] = Boolean(isWeekend), _cx)),
 

package/cjs/components/Calendar/DayCellView.js.map

@@ -1 +1 @@
-{"version":3,"sources":["DayCellView.tsx"],"names":["DayCellView","props","date","minDate","maxDate","today","value","isWeekend","onDateClick","theme","ThemeContext","_isTheme2022","handleClick","month","year","child","globalClasses","todayCaption","styles","isToday","Boolean","CDS","isEqual","isBetween","cell","today2022","selected","weekend"],"mappings":"yEAAA;;;AAGA;AACA;AACA;;AAEA;AACA,mD;;;;;;;;;;;;AAYO,SAASA,WAAT,CAAqBC,KAArB,EAA8C;AACnD,MAAQC,IAAR,GAAyED,KAAzE,CAAQC,IAAR,CAAcC,OAAd,GAAyEF,KAAzE,CAAcE,OAAd,CAAuBC,OAAvB,GAAyEH,KAAzE,CAAuBG,OAAvB,CAAgCC,KAAhC,GAAyEJ,KAAzE,CAAgCI,KAAhC,CAAuCC,KAAvC,GAAyEL,KAAzE,CAAuCK,KAAvC,CAA8CC,SAA9C,GAAyEN,KAAzE,CAA8CM,SAA9C,CAAyDC,WAAzD,GAAyEP,KAAzE,CAAyDO,WAAzD;AACA,MAAMC,KAAK,GAAG,uBAAWC,0BAAX,CAAd;AACA,MAAMC,YAAY,GAAG,+BAAYF,KAAZ,CAArB;;AAEA,MAAMG,WAAW,GAAG,SAAdA,WAAc,GAAM;AACxB,sBAA8BX,KAAK,CAACC,IAApC,CAAQA,IAAR,eAAQA,IAAR,CAAcW,KAAd,eAAcA,KAAd,CAAqBC,IAArB,eAAqBA,IAArB;AACAN,IAAAA,WAAW,QAAX,YAAAA,WAAW,CAAG,EAAEN,IAAI,EAAJA,IAAF,EAAQW,KAAK,EAALA,KAAR,EAAeC,IAAI,EAAJA,IAAf,EAAH,CAAX;AACD,GAHD;;AAKA,MAAMC,KAAK,GAAGJ,YAAY;AACxB,yCAAM,SAAS,EAAE,iBAAGK,2BAAcC,YAAjB,EAA+BC,oBAAOD,YAAP,EAA/B,CAAjB,IAAyEf,IAAI,CAACA,IAA9E,CADwB;;AAGxBA,EAAAA,IAAI,CAACA,IAHP;;;AAMA,MAAMiB,OAAO,GAAGC,OAAO,CAACf,KAAK,IAAIgB,GAAG,CAACC,OAAJ,CAAYpB,IAAZ,EAAkBG,KAAlB,CAAV,CAAvB;;AAEA;AACE;AACE,MAAA,QAAQ,EAAE,CAAC,CADb;AAEE,MAAA,QAAQ,EAAE,CAACgB,GAAG,CAACE,SAAJ,CAAcrB,IAAd,EAAoBC,OAApB,EAA6BC,OAA7B,CAFb;AAGE,MAAA,SAAS,EAAE;AACRc,0BAAOM,IAAP,CAAYf,KAAZ,CADQ,IACa,IADb;AAERS,0BAAOb,KAAP,CAAaI,KAAb,CAFQ,IAEcU,OAAO,IAAI,CAACR,YAF1B;AAGRO,0BAAOO,SAAP,EAHQ,IAGaN,OAAO,IAAIR,YAHxB;AAIRO,0BAAOQ,QAAP,CAAgBjB,KAAhB,CAJQ,IAIiBW,OAAO,CAACd,KAAK,IAAIe,GAAG,CAACC,OAAJ,CAAYpB,IAAZ,EAAkBI,KAAlB,CAAV,CAJxB;AAKRY,0BAAOS,OAAP,CAAelB,KAAf,CALQ,IAKgBW,OAAO,CAACb,SAAD,CALvB,OAHb;;AAUE,MAAA,OAAO,EAAEK,WAVX;;AAYGG,IAAAA,KAZH,CADF;;;AAgBD","sourcesContent":["import React, { useContext } from 'react';\n\nimport { Nullable } from '../../typings/utility-types';\nimport { ThemeContext } from '../../lib/theming/ThemeContext';\nimport { cx } from '../../lib/theming/Emotion';\nimport { isTheme2022 } from '../../lib/theming/ThemeHelpers';\n\nimport * as CDS from './CalendarDateShape';\nimport { globalClasses, styles } from './DayCellView.styles';\n\ninterface DayCellViewProps {\n  date: CDS.CalendarDateShape;\n  today?: CDS.CalendarDateShape;\n  value?: Nullable<CDS.CalendarDateShape>;\n  minDate?: CDS.CalendarDateShape;\n  maxDate?: CDS.CalendarDateShape;\n  onDateClick?: (day: CDS.CalendarDateShape) => void;\n  isWeekend?: boolean;\n}\n\nexport function DayCellView(props: DayCellViewProps) {\n  const { date, minDate, maxDate, today, value, isWeekend, onDateClick } = props;\n  const theme = useContext(ThemeContext);\n  const _isTheme2022 = isTheme2022(theme);\n\n  const handleClick = () => {\n    const { date, month, year } = props.date;\n    onDateClick?.({ date, month, year });\n  };\n\n  const child = _isTheme2022 ? (\n    <span className={cx(globalClasses.todayCaption, styles.todayCaption())}>{date.date}</span>\n  ) : (\n    date.date\n  );\n\n  const isToday = Boolean(today && CDS.isEqual(date, today));\n\n  return (\n    <button\n      tabIndex={-1}\n      disabled={!CDS.isBetween(date, minDate, maxDate)}\n      className={cx({\n        [styles.cell(theme)]: true,\n        [styles.today(theme)]: isToday && !_isTheme2022,\n        [styles.today2022()]: isToday && _isTheme2022,\n        [styles.selected(theme)]: Boolean(value && CDS.isEqual(date, value)),\n        [styles.weekend(theme)]: Boolean(isWeekend),\n      })}\n      onClick={handleClick}\n    >\n      {child}\n    </button>\n  );\n}\n"]}
+{"version":3,"sources":["DayCellView.tsx"],"names":["DayCellView","props","date","minDate","maxDate","today","value","isWeekend","onDateClick","theme","ThemeContext","_isTheme2022","handleClick","month","year","child","globalClasses","todayCaption","styles","isToday","Boolean","CDS","isEqual","isBetween","cell","today2022","selected","weekend"],"mappings":"yEAAA;;;AAGA;AACA;AACA;;AAEA;AACA,mD;;;;;;;;;;;;AAYO,SAASA,WAAT,CAAqBC,KAArB,EAA8C;AACnD,MAAQC,IAAR,GAAyED,KAAzE,CAAQC,IAAR,CAAcC,OAAd,GAAyEF,KAAzE,CAAcE,OAAd,CAAuBC,OAAvB,GAAyEH,KAAzE,CAAuBG,OAAvB,CAAgCC,KAAhC,GAAyEJ,KAAzE,CAAgCI,KAAhC,CAAuCC,KAAvC,GAAyEL,KAAzE,CAAuCK,KAAvC,CAA8CC,SAA9C,GAAyEN,KAAzE,CAA8CM,SAA9C,CAAyDC,WAAzD,GAAyEP,KAAzE,CAAyDO,WAAzD;AACA,MAAMC,KAAK,GAAG,uBAAWC,0BAAX,CAAd;AACA,MAAMC,YAAY,GAAG,+BAAYF,KAAZ,CAArB;;AAEA,MAAMG,WAAW,GAAG,SAAdA,WAAc,GAAM;AACxB,sBAA8BX,KAAK,CAACC,IAApC,CAAQA,IAAR,eAAQA,IAAR,CAAcW,KAAd,eAAcA,KAAd,CAAqBC,IAArB,eAAqBA,IAArB;AACAN,IAAAA,WAAW,QAAX,YAAAA,WAAW,CAAG,EAAEN,IAAI,EAAJA,IAAF,EAAQW,KAAK,EAALA,KAAR,EAAeC,IAAI,EAAJA,IAAf,EAAH,CAAX;AACD,GAHD;;AAKA,MAAMC,KAAK,GAAGJ,YAAY;AACxB,yCAAM,SAAS,EAAE,iBAAGK,2BAAcC,YAAjB,EAA+BC,oBAAOD,YAAP,EAA/B,CAAjB,IAAyEf,IAAI,CAACA,IAA9E,CADwB;;AAGxBA,EAAAA,IAAI,CAACA,IAHP;;;AAMA,MAAMiB,OAAO,GAAGC,OAAO,CAACf,KAAK,IAAIgB,GAAG,CAACC,OAAJ,CAAYpB,IAAZ,EAAkBG,KAAlB,CAAV,CAAvB;;AAEA;AACE;AACE,MAAA,QAAQ,EAAE,CAAC,CADb;AAEE,MAAA,QAAQ,EAAE,CAACgB,GAAG,CAACE,SAAJ,CAAcrB,IAAd,EAAoBC,OAApB,EAA6BC,OAA7B,CAFb;AAGE,MAAA,SAAS,EAAE;AACRc,0BAAOM,IAAP,CAAYf,KAAZ,CADQ,IACa,IADb;AAERS,0BAAOb,KAAP,CAAaI,KAAb,CAFQ,IAEcU,OAAO,IAAI,CAACR,YAF1B;AAGRO,0BAAOO,SAAP,CAAiBhB,KAAjB,CAHQ,IAGkBU,OAAO,IAAIR,YAH7B;AAIRO,0BAAOQ,QAAP,CAAgBjB,KAAhB,CAJQ,IAIiBW,OAAO,CAACd,KAAK,IAAIe,GAAG,CAACC,OAAJ,CAAYpB,IAAZ,EAAkBI,KAAlB,CAAV,CAJxB;AAKRY,0BAAOS,OAAP,CAAelB,KAAf,CALQ,IAKgBW,OAAO,CAACb,SAAD,CALvB,OAHb;;AAUE,MAAA,OAAO,EAAEK,WAVX;;AAYGG,IAAAA,KAZH,CADF;;;AAgBD","sourcesContent":["import React, { useContext } from 'react';\n\nimport { Nullable } from '../../typings/utility-types';\nimport { ThemeContext } from '../../lib/theming/ThemeContext';\nimport { cx } from '../../lib/theming/Emotion';\nimport { isTheme2022 } from '../../lib/theming/ThemeHelpers';\n\nimport * as CDS from './CalendarDateShape';\nimport { globalClasses, styles } from './DayCellView.styles';\n\ninterface DayCellViewProps {\n  date: CDS.CalendarDateShape;\n  today?: CDS.CalendarDateShape;\n  value?: Nullable<CDS.CalendarDateShape>;\n  minDate?: CDS.CalendarDateShape;\n  maxDate?: CDS.CalendarDateShape;\n  onDateClick?: (day: CDS.CalendarDateShape) => void;\n  isWeekend?: boolean;\n}\n\nexport function DayCellView(props: DayCellViewProps) {\n  const { date, minDate, maxDate, today, value, isWeekend, onDateClick } = props;\n  const theme = useContext(ThemeContext);\n  const _isTheme2022 = isTheme2022(theme);\n\n  const handleClick = () => {\n    const { date, month, year } = props.date;\n    onDateClick?.({ date, month, year });\n  };\n\n  const child = _isTheme2022 ? (\n    <span className={cx(globalClasses.todayCaption, styles.todayCaption())}>{date.date}</span>\n  ) : (\n    date.date\n  );\n\n  const isToday = Boolean(today && CDS.isEqual(date, today));\n\n  return (\n    <button\n      tabIndex={-1}\n      disabled={!CDS.isBetween(date, minDate, maxDate)}\n      className={cx({\n        [styles.cell(theme)]: true,\n        [styles.today(theme)]: isToday && !_isTheme2022,\n        [styles.today2022(theme)]: isToday && _isTheme2022,\n        [styles.selected(theme)]: Boolean(value && CDS.isEqual(date, value)),\n        [styles.weekend(theme)]: Boolean(isWeekend),\n      })}\n      onClick={handleClick}\n    >\n      {child}\n    </button>\n  );\n}\n"]}

package/cjs/components/Calendar/DayCellView.styles.d.ts

@@ -7,6 +7,6 @@ export declare const styles: {
     selected(t: Theme): string;
     weekend(t: Theme): string;
     today(t: Theme): string;
-    today2022(): string;
+    today2022(t: Theme): string;
     todayCaption(): string;
 };

package/cjs/components/Calendar/DayCellView.styles.js

@@ -59,10 +59,10 @@ var styles = (0, _Emotion.memoizeStyle)({
 
   },
 
-  today2022: function today2022() {
-    return (0, _Emotion.css)(_templateObject5 || (_templateObject5 = (0, _taggedTemplateLiteralLoose2.default)(["\n      .", " {\n        border-bottom: solid 1px;\n      }\n    "])),
-    globalClasses.todayCaption);
-
+  today2022: function today2022(t) {
+    return (0, _Emotion.css)(_templateObject5 || (_templateObject5 = (0, _taggedTemplateLiteralLoose2.default)(["\n      .", " {\n        border-bottom: ", ";\n      }\n    "])),
+    globalClasses.todayCaption,
+    t.calendarCellTodayBorder);
 
 
   },

package/cjs/components/Calendar/DayCellView.styles.js.map

@@ -1 +1 @@
-{"version":3,"sources":["DayCellView.styles.ts"],"names":["globalClasses","todayCaption","styles","cell","t","css","calendarCellBg","calendarCellSize","calendarCellLineHeight","calendarCellHoverBgColor","calendarCellHoverColor","calendarCellActiveHoverColor","selected","calendarCellSelectedBgColor","calendarCellSelectedFontColor","weekend","calendarCellWeekendColor","today","calendarCellTodayBorder","today2022"],"mappings":"oSAAA;;AAEA,iD;;AAEO,IAAMA,aAAa,GAAG,qBAAO,eAAP,EAAwB;AACnDC,EAAAA,YAAY,EAAE,eADqC,EAAxB,CAAtB,C;;;AAIA,IAAMC,MAAM,GAAG,2BAAa;AACjCC,EAAAA,IADiC,gBAC5BC,CAD4B,EAClB;AACb,eAAOC,YAAP;AACI,8BADJ;;AAGgBD,IAAAA,CAAC,CAACE,cAHlB;;;;;;;;;AAYWF,IAAAA,CAAC,CAACG,gBAZb;AAaYH,IAAAA,CAAC,CAACG,gBAbd;AAciBH,IAAAA,CAAC,CAACI,sBAdnB;;;;AAkBwBJ,IAAAA,CAAC,CAACK,wBAlB1B;AAmBaL,IAAAA,CAAC,CAACM,sBAnBf;;;;;;;;AA2BaN,IAAAA,CAAC,CAACO,4BA3Bf;;;AA8BD,GAhCgC;;AAkCjCC,EAAAA,QAlCiC,oBAkCxBR,CAlCwB,EAkCd;AACjB,eAAOC,YAAP;AACsBD,IAAAA,CAAC,CAACS,2BADxB;AAEWT,IAAAA,CAAC,CAACU,6BAFb;;AAID,GAvCgC;;AAyCjCC,EAAAA,OAzCiC,mBAyCzBX,CAzCyB,EAyCf;AAChB,eAAOC,YAAP;AACWD,IAAAA,CAAC,CAACY,wBADb;;AAGD,GA7CgC;;AA+CjCC,EAAAA,KA/CiC,iBA+C3Bb,CA/C2B,EA+CjB;AACd,eAAOC,YAAP;AACYD,IAAAA,CAAC,CAACc,uBADd;;AAGD,GAnDgC;;AAqDjCC,EAAAA,SArDiC,uBAqDrB;AACV,eAAOd,YAAP;AACKL,IAAAA,aAAa,CAACC,YADnB;;;;AAKD,GA3DgC;;AA6DjCA,EAAAA,YA7DiC,0BA6DlB;AACb,eAAOI,YAAP;;;AAGD,GAjEgC,EAAb,CAAf,C","sourcesContent":["import { css, memoizeStyle, prefix } from '../../lib/theming/Emotion';\nimport { Theme } from '../../lib/theming/Theme';\nimport { resetButton } from '../../lib/styles/Mixins';\n\nexport const globalClasses = prefix('day-cell-view')({\n  todayCaption: 'today-caption',\n});\n\nexport const styles = memoizeStyle({\n  cell(t: Theme) {\n    return css`\n      ${resetButton()};\n\n      background: ${t.calendarCellBg};\n      border: 1px solid transparent;\n      display: inline-block;\n      font-size: 14px;\n      padding: 0;\n      text-align: center;\n      user-select: none;\n      position: relative;\n\n      width: ${t.calendarCellSize};\n      height: ${t.calendarCellSize};\n      line-height: ${t.calendarCellLineHeight};\n      border-radius: 50%;\n\n      &:hover {\n        background-color: ${t.calendarCellHoverBgColor};\n        color: ${t.calendarCellHoverColor};\n        cursor: pointer;\n      }\n      &:disabled {\n        opacity: 0.5;\n        pointer-events: none;\n      }\n      &:active:hover:enabled {\n        color: ${t.calendarCellActiveHoverColor};\n      }\n    `;\n  },\n\n  selected(t: Theme) {\n    return css`\n      background-color: ${t.calendarCellSelectedBgColor};\n      color: ${t.calendarCellSelectedFontColor};\n    `;\n  },\n\n  weekend(t: Theme) {\n    return css`\n      color: ${t.calendarCellWeekendColor};\n    `;\n  },\n\n  today(t: Theme) {\n    return css`\n      border: ${t.calendarCellTodayBorder};\n    `;\n  },\n\n  today2022() {\n    return css`\n      .${globalClasses.todayCaption} {\n        border-bottom: solid 1px;\n      }\n    `;\n  },\n\n  todayCaption() {\n    return css`\n      padding-bottom: 2px;\n    `;\n  },\n});\n"]}
+{"version":3,"sources":["DayCellView.styles.ts"],"names":["globalClasses","todayCaption","styles","cell","t","css","calendarCellBg","calendarCellSize","calendarCellLineHeight","calendarCellHoverBgColor","calendarCellHoverColor","calendarCellActiveHoverColor","selected","calendarCellSelectedBgColor","calendarCellSelectedFontColor","weekend","calendarCellWeekendColor","today","calendarCellTodayBorder","today2022"],"mappings":"oSAAA;;AAEA,iD;;AAEO,IAAMA,aAAa,GAAG,qBAAO,eAAP,EAAwB;AACnDC,EAAAA,YAAY,EAAE,eADqC,EAAxB,CAAtB,C;;;AAIA,IAAMC,MAAM,GAAG,2BAAa;AACjCC,EAAAA,IADiC,gBAC5BC,CAD4B,EAClB;AACb,eAAOC,YAAP;AACI,8BADJ;;AAGgBD,IAAAA,CAAC,CAACE,cAHlB;;;;;;;;;AAYWF,IAAAA,CAAC,CAACG,gBAZb;AAaYH,IAAAA,CAAC,CAACG,gBAbd;AAciBH,IAAAA,CAAC,CAACI,sBAdnB;;;;AAkBwBJ,IAAAA,CAAC,CAACK,wBAlB1B;AAmBaL,IAAAA,CAAC,CAACM,sBAnBf;;;;;;;;AA2BaN,IAAAA,CAAC,CAACO,4BA3Bf;;;AA8BD,GAhCgC;;AAkCjCC,EAAAA,QAlCiC,oBAkCxBR,CAlCwB,EAkCd;AACjB,eAAOC,YAAP;AACsBD,IAAAA,CAAC,CAACS,2BADxB;AAEWT,IAAAA,CAAC,CAACU,6BAFb;;AAID,GAvCgC;;AAyCjCC,EAAAA,OAzCiC,mBAyCzBX,CAzCyB,EAyCf;AAChB,eAAOC,YAAP;AACWD,IAAAA,CAAC,CAACY,wBADb;;AAGD,GA7CgC;;AA+CjCC,EAAAA,KA/CiC,iBA+C3Bb,CA/C2B,EA+CjB;AACd,eAAOC,YAAP;AACYD,IAAAA,CAAC,CAACc,uBADd;;AAGD,GAnDgC;;AAqDjCC,EAAAA,SArDiC,qBAqDvBf,CArDuB,EAqDb;AAClB,eAAOC,YAAP;AACKL,IAAAA,aAAa,CAACC,YADnB;AAEqBG,IAAAA,CAAC,CAACc,uBAFvB;;;AAKD,GA3DgC;;AA6DjCjB,EAAAA,YA7DiC,0BA6DlB;AACb,eAAOI,YAAP;;;AAGD,GAjEgC,EAAb,CAAf,C","sourcesContent":["import { css, memoizeStyle, prefix } from '../../lib/theming/Emotion';\nimport { Theme } from '../../lib/theming/Theme';\nimport { resetButton } from '../../lib/styles/Mixins';\n\nexport const globalClasses = prefix('day-cell-view')({\n  todayCaption: 'today-caption',\n});\n\nexport const styles = memoizeStyle({\n  cell(t: Theme) {\n    return css`\n      ${resetButton()};\n\n      background: ${t.calendarCellBg};\n      border: 1px solid transparent;\n      display: inline-block;\n      font-size: 14px;\n      padding: 0;\n      text-align: center;\n      user-select: none;\n      position: relative;\n\n      width: ${t.calendarCellSize};\n      height: ${t.calendarCellSize};\n      line-height: ${t.calendarCellLineHeight};\n      border-radius: 50%;\n\n      &:hover {\n        background-color: ${t.calendarCellHoverBgColor};\n        color: ${t.calendarCellHoverColor};\n        cursor: pointer;\n      }\n      &:disabled {\n        opacity: 0.5;\n        pointer-events: none;\n      }\n      &:active:hover:enabled {\n        color: ${t.calendarCellActiveHoverColor};\n      }\n    `;\n  },\n\n  selected(t: Theme) {\n    return css`\n      background-color: ${t.calendarCellSelectedBgColor};\n      color: ${t.calendarCellSelectedFontColor};\n    `;\n  },\n\n  weekend(t: Theme) {\n    return css`\n      color: ${t.calendarCellWeekendColor};\n    `;\n  },\n\n  today(t: Theme) {\n    return css`\n      border: ${t.calendarCellTodayBorder};\n    `;\n  },\n\n  today2022(t: Theme) {\n    return css`\n      .${globalClasses.todayCaption} {\n        border-bottom: ${t.calendarCellTodayBorder};\n      }\n    `;\n  },\n\n  todayCaption() {\n    return css`\n      padding-bottom: 2px;\n    `;\n  },\n});\n"]}

package/cjs/components/DropdownMenu/DropdownMenu.d.ts

@@ -2,7 +2,7 @@ import React from 'react';
 import { PopupMenuProps } from '../../internal/PopupMenu';
 import { PopupPositionsType } from '../../internal/Popup';
 import { CommonProps } from '../../internal/CommonWrapper';
-export interface DropdownMenuProps extends CommonProps, Pick<PopupMenuProps, 'onOpen' | 'onClose' | 'popupMenuId'> {
+export interface DropdownMenuProps extends CommonProps, Pick<PopupMenuProps, 'onOpen' | 'onClose' | 'popupMenuId' | 'preventIconsOffset'> {
     /** Максимальная высота меню */
     menuMaxHeight?: React.CSSProperties['maxWidth'];
     /** Ширина меню */

package/cjs/components/DropdownMenu/DropdownMenu.js

@@ -54,6 +54,8 @@ var _getDropdownMenuTheme = require("./getDropdownMenuTheme");var _class, _class
 
 
 
+
+
 
 
 
@@ -118,6 +120,7 @@ DropdownMenu = (0, _rootNode.rootNode)(_class = (_temp = _class2 = /*#__PURE__*/
 
 
 
+
 
 
     open = function () {
@@ -132,4 +135,4 @@ DropdownMenu = (0, _rootNode.rootNode)(_class = (_temp = _class2 = /*#__PURE__*/
       }
     };_this.
 
-    refPopupMenu = function (ref) {return _this.popupMenu = ref;};if (!props.caption && !_currentEnvironment.isProductionEnv) {throw new Error('Prop "caption" is required!!!');}return _this;}var _proto = DropdownMenu.prototype;_proto.render = function render() {var _this2 = this;return /*#__PURE__*/_react.default.createElement(_ThemeContext.ThemeContext.Consumer, null, function (theme) {return /*#__PURE__*/_react.default.createElement(_ThemeContext.ThemeContext.Provider, { value: (0, _getDropdownMenuTheme.getDropdownMenuTheme)(theme) }, _this2.renderMain());});};_proto.renderMain = function renderMain() {if (!this.props.caption) {return null;}var _this$getProps = this.getProps(),positions = _this$getProps.positions,disableAnimations = _this$getProps.disableAnimations;return /*#__PURE__*/_react.default.createElement(_CommonWrapper.CommonWrapper, (0, _extends2.default)({ rootNodeRef: this.setRootNode }, this.props), /*#__PURE__*/_react.default.createElement(_PopupMenu.PopupMenu, { ref: this.refPopupMenu, caption: this.props.caption, menuMaxHeight: this.props.menuMaxHeight, menuWidth: this.props.menuWidth, popupHasPin: false, positions: positions, disableAnimations: disableAnimations, header: this.props.header, footer: this.props.footer, width: this.props.width, onClose: this.props.onClose, onOpen: this.props.onOpen, popupMenuId: this.props.popupMenuId }, this.props.children));};return DropdownMenu;}(_react.default.Component), _class2.__KONTUR_REACT_UI__ = 'DropdownMenu', _class2.defaultProps = { disableAnimations: _currentEnvironment.isTestEnv, positions: ['bottom left', 'bottom right', 'top left', 'top right'] }, _temp)) || _class;exports.DropdownMenu = DropdownMenu;
+    refPopupMenu = function (ref) {return _this.popupMenu = ref;};if (!props.caption && !_currentEnvironment.isProductionEnv) {throw new Error('Prop "caption" is required!!!');}return _this;}var _proto = DropdownMenu.prototype;_proto.render = function render() {var _this2 = this;return /*#__PURE__*/_react.default.createElement(_ThemeContext.ThemeContext.Consumer, null, function (theme) {return /*#__PURE__*/_react.default.createElement(_ThemeContext.ThemeContext.Provider, { value: (0, _getDropdownMenuTheme.getDropdownMenuTheme)(theme) }, _this2.renderMain());});};_proto.renderMain = function renderMain() {if (!this.props.caption) {return null;}var _this$getProps = this.getProps(),positions = _this$getProps.positions,disableAnimations = _this$getProps.disableAnimations;return /*#__PURE__*/_react.default.createElement(_CommonWrapper.CommonWrapper, (0, _extends2.default)({ rootNodeRef: this.setRootNode }, this.props), /*#__PURE__*/_react.default.createElement(_PopupMenu.PopupMenu, { ref: this.refPopupMenu, caption: this.props.caption, menuMaxHeight: this.props.menuMaxHeight, menuWidth: this.props.menuWidth, preventIconsOffset: this.props.preventIconsOffset, popupHasPin: false, positions: positions, disableAnimations: disableAnimations, header: this.props.header, footer: this.props.footer, width: this.props.width, onClose: this.props.onClose, onOpen: this.props.onOpen, popupMenuId: this.props.popupMenuId }, this.props.children));};return DropdownMenu;}(_react.default.Component), _class2.__KONTUR_REACT_UI__ = 'DropdownMenu', _class2.defaultProps = { disableAnimations: _currentEnvironment.isTestEnv, positions: ['bottom left', 'bottom right', 'top left', 'top right'] }, _temp)) || _class;exports.DropdownMenu = DropdownMenu;

package/cjs/components/DropdownMenu/DropdownMenu.js.map

@@ -1 +1 @@
-{"version":3,"sources":["DropdownMenu.tsx"],"names":["DropdownMenu","rootNode","props","getProps","defaultProps","popupMenu","open","close","refPopupMenu","ref","caption","isProductionEnv","Error","render","theme","renderMain","positions","disableAnimations","setRootNode","menuMaxHeight","menuWidth","header","footer","width","onClose","onOpen","popupMenuId","children","React","Component","__KONTUR_REACT_UI__","isTestEnv"],"mappings":"0UAAA;;AAEA;;AAEA;AACA;;AAEA;AACA;AACA;;AAEA,8D;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAgDA;AACA;AACA,G;;AAEaA,Y,OADZC,kB;;;;;;;;;;;;;AAcC,wBAAYC,KAAZ,EAAsC;AACpC,wCAAMA,KAAN,UADoC,MAL9BC,QAK8B,GALnB,0CAAkBH,YAAY,CAACI,YAA/B,CAKmB,OAH9BC,SAG8B,GAHG,IAGH;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA8C/BC,IAAAA,IA9C+B,GA8CxB,YAAY;AACxB,UAAI,MAAKD,SAAT,EAAoB;AAClB,cAAKA,SAAL,CAAeC,IAAf;AACD;AACF,KAlDqC;;AAoD/BC,IAAAA,KApD+B,GAoDvB,YAAY;AACzB,UAAI,MAAKF,SAAT,EAAoB;AAClB,cAAKA,SAAL,CAAeE,KAAf;AACD;AACF,KAxDqC;;AA0D9BC,IAAAA,YA1D8B,GA0Df,UAACC,GAAD,UAA+B,MAAKJ,SAAL,GAAiBI,GAAhD,EA1De,CAGpC,IAAI,CAACP,KAAK,CAACQ,OAAP,IAAkB,CAACC,mCAAvB,EAAwC,CACtC,MAAM,IAAIC,KAAJ,CAAU,+BAAV,CAAN,CACD,CALmC,aAMrC,C,2CAEMC,M,GAAP,kBAAgB,mBACd,oBACE,6BAAC,0BAAD,CAAc,QAAd,QACG,UAACC,KAAD,EAAW,CACV,oBAAO,6BAAC,0BAAD,CAAc,QAAd,IAAuB,KAAK,EAAE,gDAAqBA,KAArB,CAA9B,IAA4D,MAAI,CAACC,UAAL,EAA5D,CAAP,CACD,CAHH,CADF,CAOD,C,QAEMA,U,GAAP,sBAAoB,CAClB,IAAI,CAAC,KAAKb,KAAL,CAAWQ,OAAhB,EAAyB,CACvB,OAAO,IAAP,CACD,CACD,qBAAyC,KAAKP,QAAL,EAAzC,CAAQa,SAAR,kBAAQA,SAAR,CAAmBC,iBAAnB,kBAAmBA,iBAAnB,CACA,oBACE,6BAAC,4BAAD,2BAAe,WAAW,EAAE,KAAKC,WAAjC,IAAkD,KAAKhB,KAAvD,gBACE,6BAAC,oBAAD,IACE,GAAG,EAAE,KAAKM,YADZ,EAEE,OAAO,EAAE,KAAKN,KAAL,CAAWQ,OAFtB,EAGE,aAAa,EAAE,KAAKR,KAAL,CAAWiB,aAH5B,EAIE,SAAS,EAAE,KAAKjB,KAAL,CAAWkB,SAJxB,EAKE,WAAW,EAAE,KALf,EAME,SAAS,EAAEJ,SANb,EAOE,iBAAiB,EAAEC,iBAPrB,EAQE,MAAM,EAAE,KAAKf,KAAL,CAAWmB,MARrB,EASE,MAAM,EAAE,KAAKnB,KAAL,CAAWoB,MATrB,EAUE,KAAK,EAAE,KAAKpB,KAAL,CAAWqB,KAVpB,EAWE,OAAO,EAAE,KAAKrB,KAAL,CAAWsB,OAXtB,EAYE,MAAM,EAAE,KAAKtB,KAAL,CAAWuB,MAZrB,EAaE,WAAW,EAAE,KAAKvB,KAAL,CAAWwB,WAb1B,IAeG,KAAKxB,KAAL,CAAWyB,QAfd,CADF,CADF,CAqBD,C,uBAzD+BC,eAAMC,S,WACxBC,mB,GAAsB,c,UAEtB1B,Y,GAA6B,EACzCa,iBAAiB,EAAEc,6BADsB,EAEzCf,SAAS,EAAE,CAAC,aAAD,EAAgB,cAAhB,EAAgC,UAAhC,EAA4C,WAA5C,CAF8B,E","sourcesContent":["import React from 'react';\n\nimport { ThemeContext } from '../../lib/theming/ThemeContext';\nimport { Nullable } from '../../typings/utility-types';\nimport { PopupMenu, PopupMenuProps } from '../../internal/PopupMenu';\nimport { isProductionEnv, isTestEnv } from '../../lib/currentEnvironment';\nimport { PopupPositionsType } from '../../internal/Popup';\nimport { CommonWrapper, CommonProps } from '../../internal/CommonWrapper';\nimport { rootNode, TSetRootNode } from '../../lib/rootNode';\nimport { createPropsGetter } from '../../lib/createPropsGetter';\n\nimport { getDropdownMenuTheme } from './getDropdownMenuTheme';\n\nexport interface DropdownMenuProps extends CommonProps, Pick<PopupMenuProps, 'onOpen' | 'onClose' | 'popupMenuId'> {\n  /** Максимальная высота меню */\n  menuMaxHeight?: React.CSSProperties['maxWidth'];\n  /** Ширина меню */\n  menuWidth?: React.CSSProperties['width'];\n  /** Ширина caption */\n  width?: React.CSSProperties['width'];\n\n  /**\n   * Элемент или функция возвращающая элемент,\n   * если передана, используется вместо `caption`,\n   * в таком случае управлять открытием и закрытием меню\n   * придется в этой функции\n   */\n  caption: PopupMenuProps['caption'];\n\n  /**\n   * Произвольный элемент, который будет отрендерен в шапке меню.\n   *\n   * _Примечание_: контрол [MenuHeader](#/Components/MenuHeader) передаётся только в `children` меню-контролов. Не стоит передавать `MenuHeader` в `header`.\n   */\n  header?: React.ReactNode;\n  /**\n   * Произвольный элемент, который будет отрендерен в подвале меню.\n   *\n   * Перед элементом переданным в `footer` будет отрендерен [MenuSeparator](#/Components/MenuSeparator).\n   */\n  footer?: React.ReactNode;\n  /**\n   *  Список позиций доступных для расположения выпадашки относительно `caption`.\n   *\n   * Если во всех позициях выпадашка вылезает за пределы `viewport`, будет использована первая из этого списка.\n   *\n   * **Возможные значения**: `top left`, `top center`, `top right`, `right top`, `right middle`, `right bottom`, `bottom left`, `bottom center`, `bottom right`, `left top`, `left middle`, `left bottom`\n   * @default ['bottom left', 'bottom right', 'top left', 'top right']\n   */\n  positions?: PopupPositionsType[];\n\n  /**\n   * Не показывать анимацию\n   */\n  disableAnimations?: boolean;\n}\n\ntype DefaultProps = Required<Pick<DropdownMenuProps, 'disableAnimations' | 'positions'>>;\n\n/**\n * Меню, раскрывающееся по клику на переданный в `caption` элемент\n */\n@rootNode\nexport class DropdownMenu extends React.Component<DropdownMenuProps> {\n  public static __KONTUR_REACT_UI__ = 'DropdownMenu';\n\n  public static defaultProps: DefaultProps = {\n    disableAnimations: isTestEnv,\n    positions: ['bottom left', 'bottom right', 'top left', 'top right'],\n  };\n\n  private getProps = createPropsGetter(DropdownMenu.defaultProps);\n\n  private popupMenu: Nullable<PopupMenu> = null;\n  private setRootNode!: TSetRootNode;\n\n  constructor(props: DropdownMenuProps) {\n    super(props);\n\n    if (!props.caption && !isProductionEnv) {\n      throw new Error('Prop \"caption\" is required!!!');\n    }\n  }\n\n  public render() {\n    return (\n      <ThemeContext.Consumer>\n        {(theme) => {\n          return <ThemeContext.Provider value={getDropdownMenuTheme(theme)}>{this.renderMain()}</ThemeContext.Provider>;\n        }}\n      </ThemeContext.Consumer>\n    );\n  }\n\n  public renderMain() {\n    if (!this.props.caption) {\n      return null;\n    }\n    const { positions, disableAnimations } = this.getProps();\n    return (\n      <CommonWrapper rootNodeRef={this.setRootNode} {...this.props}>\n        <PopupMenu\n          ref={this.refPopupMenu}\n          caption={this.props.caption}\n          menuMaxHeight={this.props.menuMaxHeight}\n          menuWidth={this.props.menuWidth}\n          popupHasPin={false}\n          positions={positions}\n          disableAnimations={disableAnimations}\n          header={this.props.header}\n          footer={this.props.footer}\n          width={this.props.width}\n          onClose={this.props.onClose}\n          onOpen={this.props.onOpen}\n          popupMenuId={this.props.popupMenuId}\n        >\n          {this.props.children}\n        </PopupMenu>\n      </CommonWrapper>\n    );\n  }\n\n  public open = (): void => {\n    if (this.popupMenu) {\n      this.popupMenu.open();\n    }\n  };\n\n  public close = (): void => {\n    if (this.popupMenu) {\n      this.popupMenu.close();\n    }\n  };\n\n  private refPopupMenu = (ref: Nullable<PopupMenu>) => (this.popupMenu = ref);\n}\n"]}
+{"version":3,"sources":["DropdownMenu.tsx"],"names":["DropdownMenu","rootNode","props","getProps","defaultProps","popupMenu","open","close","refPopupMenu","ref","caption","isProductionEnv","Error","render","theme","renderMain","positions","disableAnimations","setRootNode","menuMaxHeight","menuWidth","preventIconsOffset","header","footer","width","onClose","onOpen","popupMenuId","children","React","Component","__KONTUR_REACT_UI__","isTestEnv"],"mappings":"0UAAA;;AAEA;;AAEA;AACA;;AAEA;AACA;AACA;;AAEA,8D;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAkDA;AACA;AACA,G;;AAEaA,Y,OADZC,kB;;;;;;;;;;;;;AAcC,wBAAYC,KAAZ,EAAsC;AACpC,wCAAMA,KAAN,UADoC,MAL9BC,QAK8B,GALnB,0CAAkBH,YAAY,CAACI,YAA/B,CAKmB,OAH9BC,SAG8B,GAHG,IAGH;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA+C/BC,IAAAA,IA/C+B,GA+CxB,YAAY;AACxB,UAAI,MAAKD,SAAT,EAAoB;AAClB,cAAKA,SAAL,CAAeC,IAAf;AACD;AACF,KAnDqC;;AAqD/BC,IAAAA,KArD+B,GAqDvB,YAAY;AACzB,UAAI,MAAKF,SAAT,EAAoB;AAClB,cAAKA,SAAL,CAAeE,KAAf;AACD;AACF,KAzDqC;;AA2D9BC,IAAAA,YA3D8B,GA2Df,UAACC,GAAD,UAA+B,MAAKJ,SAAL,GAAiBI,GAAhD,EA3De,CAGpC,IAAI,CAACP,KAAK,CAACQ,OAAP,IAAkB,CAACC,mCAAvB,EAAwC,CACtC,MAAM,IAAIC,KAAJ,CAAU,+BAAV,CAAN,CACD,CALmC,aAMrC,C,2CAEMC,M,GAAP,kBAAgB,mBACd,oBACE,6BAAC,0BAAD,CAAc,QAAd,QACG,UAACC,KAAD,EAAW,CACV,oBAAO,6BAAC,0BAAD,CAAc,QAAd,IAAuB,KAAK,EAAE,gDAAqBA,KAArB,CAA9B,IAA4D,MAAI,CAACC,UAAL,EAA5D,CAAP,CACD,CAHH,CADF,CAOD,C,QAEMA,U,GAAP,sBAAoB,CAClB,IAAI,CAAC,KAAKb,KAAL,CAAWQ,OAAhB,EAAyB,CACvB,OAAO,IAAP,CACD,CACD,qBAAyC,KAAKP,QAAL,EAAzC,CAAQa,SAAR,kBAAQA,SAAR,CAAmBC,iBAAnB,kBAAmBA,iBAAnB,CACA,oBACE,6BAAC,4BAAD,2BAAe,WAAW,EAAE,KAAKC,WAAjC,IAAkD,KAAKhB,KAAvD,gBACE,6BAAC,oBAAD,IACE,GAAG,EAAE,KAAKM,YADZ,EAEE,OAAO,EAAE,KAAKN,KAAL,CAAWQ,OAFtB,EAGE,aAAa,EAAE,KAAKR,KAAL,CAAWiB,aAH5B,EAIE,SAAS,EAAE,KAAKjB,KAAL,CAAWkB,SAJxB,EAKE,kBAAkB,EAAE,KAAKlB,KAAL,CAAWmB,kBALjC,EAME,WAAW,EAAE,KANf,EAOE,SAAS,EAAEL,SAPb,EAQE,iBAAiB,EAAEC,iBARrB,EASE,MAAM,EAAE,KAAKf,KAAL,CAAWoB,MATrB,EAUE,MAAM,EAAE,KAAKpB,KAAL,CAAWqB,MAVrB,EAWE,KAAK,EAAE,KAAKrB,KAAL,CAAWsB,KAXpB,EAYE,OAAO,EAAE,KAAKtB,KAAL,CAAWuB,OAZtB,EAaE,MAAM,EAAE,KAAKvB,KAAL,CAAWwB,MAbrB,EAcE,WAAW,EAAE,KAAKxB,KAAL,CAAWyB,WAd1B,IAgBG,KAAKzB,KAAL,CAAW0B,QAhBd,CADF,CADF,CAsBD,C,uBA1D+BC,eAAMC,S,WACxBC,mB,GAAsB,c,UAEtB3B,Y,GAA6B,EACzCa,iBAAiB,EAAEe,6BADsB,EAEzChB,SAAS,EAAE,CAAC,aAAD,EAAgB,cAAhB,EAAgC,UAAhC,EAA4C,WAA5C,CAF8B,E","sourcesContent":["import React from 'react';\n\nimport { ThemeContext } from '../../lib/theming/ThemeContext';\nimport { Nullable } from '../../typings/utility-types';\nimport { PopupMenu, PopupMenuProps } from '../../internal/PopupMenu';\nimport { isProductionEnv, isTestEnv } from '../../lib/currentEnvironment';\nimport { PopupPositionsType } from '../../internal/Popup';\nimport { CommonWrapper, CommonProps } from '../../internal/CommonWrapper';\nimport { rootNode, TSetRootNode } from '../../lib/rootNode';\nimport { createPropsGetter } from '../../lib/createPropsGetter';\n\nimport { getDropdownMenuTheme } from './getDropdownMenuTheme';\n\nexport interface DropdownMenuProps\n  extends CommonProps,\n    Pick<PopupMenuProps, 'onOpen' | 'onClose' | 'popupMenuId' | 'preventIconsOffset'> {\n  /** Максимальная высота меню */\n  menuMaxHeight?: React.CSSProperties['maxWidth'];\n  /** Ширина меню */\n  menuWidth?: React.CSSProperties['width'];\n  /** Ширина caption */\n  width?: React.CSSProperties['width'];\n\n  /**\n   * Элемент или функция возвращающая элемент,\n   * если передана, используется вместо `caption`,\n   * в таком случае управлять открытием и закрытием меню\n   * придется в этой функции\n   */\n  caption: PopupMenuProps['caption'];\n\n  /**\n   * Произвольный элемент, который будет отрендерен в шапке меню.\n   *\n   * _Примечание_: контрол [MenuHeader](#/Components/MenuHeader) передаётся только в `children` меню-контролов. Не стоит передавать `MenuHeader` в `header`.\n   */\n  header?: React.ReactNode;\n  /**\n   * Произвольный элемент, который будет отрендерен в подвале меню.\n   *\n   * Перед элементом переданным в `footer` будет отрендерен [MenuSeparator](#/Components/MenuSeparator).\n   */\n  footer?: React.ReactNode;\n  /**\n   *  Список позиций доступных для расположения выпадашки относительно `caption`.\n   *\n   * Если во всех позициях выпадашка вылезает за пределы `viewport`, будет использована первая из этого списка.\n   *\n   * **Возможные значения**: `top left`, `top center`, `top right`, `right top`, `right middle`, `right bottom`, `bottom left`, `bottom center`, `bottom right`, `left top`, `left middle`, `left bottom`\n   * @default ['bottom left', 'bottom right', 'top left', 'top right']\n   */\n  positions?: PopupPositionsType[];\n\n  /**\n   * Не показывать анимацию\n   */\n  disableAnimations?: boolean;\n}\n\ntype DefaultProps = Required<Pick<DropdownMenuProps, 'disableAnimations' | 'positions'>>;\n\n/**\n * Меню, раскрывающееся по клику на переданный в `caption` элемент\n */\n@rootNode\nexport class DropdownMenu extends React.Component<DropdownMenuProps> {\n  public static __KONTUR_REACT_UI__ = 'DropdownMenu';\n\n  public static defaultProps: DefaultProps = {\n    disableAnimations: isTestEnv,\n    positions: ['bottom left', 'bottom right', 'top left', 'top right'],\n  };\n\n  private getProps = createPropsGetter(DropdownMenu.defaultProps);\n\n  private popupMenu: Nullable<PopupMenu> = null;\n  private setRootNode!: TSetRootNode;\n\n  constructor(props: DropdownMenuProps) {\n    super(props);\n\n    if (!props.caption && !isProductionEnv) {\n      throw new Error('Prop \"caption\" is required!!!');\n    }\n  }\n\n  public render() {\n    return (\n      <ThemeContext.Consumer>\n        {(theme) => {\n          return <ThemeContext.Provider value={getDropdownMenuTheme(theme)}>{this.renderMain()}</ThemeContext.Provider>;\n        }}\n      </ThemeContext.Consumer>\n    );\n  }\n\n  public renderMain() {\n    if (!this.props.caption) {\n      return null;\n    }\n    const { positions, disableAnimations } = this.getProps();\n    return (\n      <CommonWrapper rootNodeRef={this.setRootNode} {...this.props}>\n        <PopupMenu\n          ref={this.refPopupMenu}\n          caption={this.props.caption}\n          menuMaxHeight={this.props.menuMaxHeight}\n          menuWidth={this.props.menuWidth}\n          preventIconsOffset={this.props.preventIconsOffset}\n          popupHasPin={false}\n          positions={positions}\n          disableAnimations={disableAnimations}\n          header={this.props.header}\n          footer={this.props.footer}\n          width={this.props.width}\n          onClose={this.props.onClose}\n          onOpen={this.props.onOpen}\n          popupMenuId={this.props.popupMenuId}\n        >\n          {this.props.children}\n        </PopupMenu>\n      </CommonWrapper>\n    );\n  }\n\n  public open = (): void => {\n    if (this.popupMenu) {\n      this.popupMenu.open();\n    }\n  };\n\n  public close = (): void => {\n    if (this.popupMenu) {\n      this.popupMenu.close();\n    }\n  };\n\n  private refPopupMenu = (ref: Nullable<PopupMenu>) => (this.popupMenu = ref);\n}\n"]}

package/cjs/components/DropdownMenu/DropdownMenu.md

@@ -113,6 +113,34 @@ import { Button, MenuHeader, MenuItem, MenuSeparator } from '@skbkontur/react-ui
 </DropdownMenu>;
 ```
 
+С иконками и включенным по-умолчанию автоматическим выравниванием текста.
+
+```jsx harmony
+import { Button, MenuHeader, MenuItem, MenuSeparator, DropdownMenu } from '@skbkontur/react-ui';
+import OkIcon from '@skbkontur/react-icons/Ok';
+
+<DropdownMenu caption={<Button use="primary">Открыть меню</Button>}>
+  <MenuHeader>MenuHeader</MenuHeader>
+  <MenuItem icon={<OkIcon />}>MenuItem1</MenuItem>
+  <MenuItem icon={<OkIcon />}>MenuItem2</MenuItem>
+  <MenuItem>MenuItem3</MenuItem>
+</DropdownMenu>;
+```
+
+С иконками и отключенным автоматическим выравниванием текста.
+
+```jsx harmony
+import { Button, MenuHeader, MenuItem, MenuSeparator, DropdownMenu } from '@skbkontur/react-ui';
+import OkIcon from '@skbkontur/react-icons/Ok';
+
+<DropdownMenu preventIconsOffset caption={<Button use="primary">Открыть меню</Button>}>
+  <MenuHeader>MenuHeader</MenuHeader>
+  <MenuItem icon={<OkIcon />}>MenuItem1</MenuItem>
+  <MenuItem icon={<OkIcon />}>MenuItem2</MenuItem>
+  <MenuItem>MenuItem3</MenuItem>
+</DropdownMenu>
+```
+
 Меню с отключенной анимацией.
 
 ```jsx harmony

package/cjs/components/Kebab/Kebab.d.ts

@@ -3,7 +3,7 @@ import { PopupMenuProps } from '../../internal/PopupMenu';
 import { Nullable } from '../../typings/utility-types';
 import { PopupPositionsType } from '../../internal/Popup';
 import { CommonProps } from '../../internal/CommonWrapper';
-export interface KebabProps extends CommonProps, Pick<PopupMenuProps, 'onOpen' | 'onClose' | 'popupMenuId'> {
+export interface KebabProps extends CommonProps, Pick<PopupMenuProps, 'onOpen' | 'onClose' | 'popupMenuId' | 'preventIconsOffset'> {
     disabled?: boolean;
     size?: 'small' | 'medium' | 'large';
     /**

package/cjs/components/Kebab/Kebab.js

@@ -48,6 +48,8 @@ var _KebabIcon = require("./KebabIcon");var _class, _class2, _temp;function _get
 
 
 
+
+
 
 
 
@@ -145,6 +147,7 @@ Kebab = (0, _rootNode.rootNode)(_class = (_temp = _class2 = /*#__PURE__*/functio
 
 
 
+
 
 
     renderCaption = function (captionProps) {
@@ -218,7 +221,7 @@ Kebab = (0, _rootNode.rootNode)(_class = (_temp = _class2 = /*#__PURE__*/functio
       _this.setState({
         focusedByTab: false });
 
-    };return _this;}var _proto = Kebab.prototype;_proto.componentDidMount = function componentDidMount() {/** addListener'у нужен колбэк в аргумент */this.listener = LayoutEvents.addListener(function () {return undefined;});};_proto.componentWillUnmount = function componentWillUnmount() {this.listener.remove();};_proto.render = function render() {var _this2 = this;return /*#__PURE__*/_react.default.createElement(_ThemeContext.ThemeContext.Consumer, null, function (theme) {_this2.theme = theme;return /*#__PURE__*/_react.default.createElement(_ThemeContext.ThemeContext.Provider, { value: _ThemeFactory.ThemeFactory.create({ popupPinOffset: theme.kebabPinOffset, popupMargin: theme.kebabMargin, popupPinSize: theme.kebabPinSize }, theme) }, _this2.renderMain());});};_proto.renderMain = function renderMain() {var disabled = this.props.disabled;var _this$getProps2 = this.getProps(),positions = _this$getProps2.positions,disableAnimations = _this$getProps2.disableAnimations,onOpen = _this$getProps2.onOpen,onClose = _this$getProps2.onClose;return /*#__PURE__*/_react.default.createElement(_CommonWrapper.CommonWrapper, (0, _extends2.default)({ rootNodeRef: this.setRootNode }, this.props), /*#__PURE__*/_react.default.createElement(_PopupMenu.PopupMenu, { popupHasPin: true, positions: positions, onChangeMenuState: this.handleChangeMenuState, caption: this.renderCaption, disableAnimations: disableAnimations, menuMaxHeight: this.props.menuMaxHeight, onOpen: onOpen, onClose: onClose, popupMenuId: this.props.popupMenuId }, !disabled && this.props.children));};_proto.
+    };return _this;}var _proto = Kebab.prototype;_proto.componentDidMount = function componentDidMount() {/** addListener'у нужен колбэк в аргумент */this.listener = LayoutEvents.addListener(function () {return undefined;});};_proto.componentWillUnmount = function componentWillUnmount() {this.listener.remove();};_proto.render = function render() {var _this2 = this;return /*#__PURE__*/_react.default.createElement(_ThemeContext.ThemeContext.Consumer, null, function (theme) {_this2.theme = theme;return /*#__PURE__*/_react.default.createElement(_ThemeContext.ThemeContext.Provider, { value: _ThemeFactory.ThemeFactory.create({ popupPinOffset: theme.kebabPinOffset, popupMargin: theme.kebabMargin, popupPinSize: theme.kebabPinSize }, theme) }, _this2.renderMain());});};_proto.renderMain = function renderMain() {var disabled = this.props.disabled;var _this$getProps2 = this.getProps(),positions = _this$getProps2.positions,disableAnimations = _this$getProps2.disableAnimations,onOpen = _this$getProps2.onOpen,onClose = _this$getProps2.onClose;return /*#__PURE__*/_react.default.createElement(_CommonWrapper.CommonWrapper, (0, _extends2.default)({ rootNodeRef: this.setRootNode }, this.props), /*#__PURE__*/_react.default.createElement(_PopupMenu.PopupMenu, { popupHasPin: true, preventIconsOffset: this.props.preventIconsOffset, positions: positions, onChangeMenuState: this.handleChangeMenuState, caption: this.renderCaption, disableAnimations: disableAnimations, menuMaxHeight: this.props.menuMaxHeight, onOpen: onOpen, onClose: onClose, popupMenuId: this.props.popupMenuId }, !disabled && this.props.children));};_proto.
 
   renderIcon = function renderIcon() {var _cx;
     var _this$getProps3 = this.getProps(),size = _this$getProps3.size,_this$getProps3$icon = _this$getProps3.icon,icon = _this$getProps3$icon === void 0 ? /*#__PURE__*/_react.default.createElement(_px.MenuKebabIcon, null) : _this$getProps3$icon;

package/cjs/components/Kebab/Kebab.js.map

@@ -1 +1 @@
-{"version":3,"sources":["Kebab.tsx"],"names":["KebabDataTids","caption","Kebab","rootNode","getProps","defaultProps","state","focusedByTab","anchor","listener","remove","undefined","renderCaption","captionProps","disabled","size","handleCaptionKeyDown","event","openMenu","handleCaptionClick","toggleMenu","handleFocus","handleBlur","styles","kebab","theme","kebabSmall","kebabMedium","kebabLarge","kebab2022","opened","focused","props","renderIcon2022","renderIcon","e","isKeyEnter","isKeySpace","isKeyArrowVertical","preventDefault","handleChangeMenuState","isOpened","restoreFocus","setState","requestAnimationFrame","keyListener","isTabPressed","componentDidMount","LayoutEvents","addListener","componentWillUnmount","render","ThemeFactory","create","popupPinOffset","kebabPinOffset","popupMargin","kebabMargin","popupPinSize","kebabPinSize","renderMain","positions","disableAnimations","onOpen","onClose","setRootNode","menuMaxHeight","popupMenuId","children","icon","iconsmall","iconmedium","iconlarge","sizes","small","parseInt","kebabIconSizeSmall","medium","kebabIconSizeMedium","large","kebabIconSizeLarge","React","cloneElement","color","kebabIconColor","Component","__KONTUR_REACT_UI__","propTypes","isTestEnv","PropTypes","node","bool","oneOfType","string","number","func"],"mappings":"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","sourcesContent":["import React, { AriaAttributes } from 'react';\nimport PropTypes from 'prop-types';\nimport { isElement } from 'react-is';\n\nimport { isKonturIcon } from '../../lib/utils';\nimport { isKeyArrowVertical, isKeyEnter, isKeySpace, someKeys } from '../../lib/events/keyboard/identifiers';\nimport * as LayoutEvents from '../../lib/LayoutEvents';\nimport { keyListener } from '../../lib/events/keyListener';\nimport { PopupMenu, PopupMenuCaptionProps, PopupMenuProps } from '../../internal/PopupMenu';\nimport { Nullable } from '../../typings/utility-types';\nimport { PopupPositionsType } from '../../internal/Popup';\nimport { ThemeContext } from '../../lib/theming/ThemeContext';\nimport { Theme } from '../../lib/theming/Theme';\nimport { MenuKebabIcon } from '../../internal/icons/16px';\nimport { isTestEnv } from '../../lib/currentEnvironment';\nimport { ThemeFactory } from '../../lib/theming/ThemeFactory';\nimport { CommonWrapper, CommonProps } from '../../internal/CommonWrapper';\nimport { cx } from '../../lib/theming/Emotion';\nimport { rootNode, TSetRootNode } from '../../lib/rootNode';\nimport { createPropsGetter } from '../../lib/createPropsGetter';\nimport { isTheme2022 } from '../../lib/theming/ThemeHelpers';\nimport { ButtonSize } from '../Button';\n\nimport { styles } from './Kebab.styles';\nimport { KebabIcon } from './KebabIcon';\n\nexport interface KebabProps extends CommonProps, Pick<PopupMenuProps, 'onOpen' | 'onClose' | 'popupMenuId'> {\n  disabled?: boolean;\n  size?: 'small' | 'medium' | 'large';\n  /**\n   * Список позиций доступных для расположения выпадашки.\n   *\n   * Если во всех позициях выпадашка вылезает за пределы `viewport`, будет использована первая из этого списка.\n   *\n   * **Возможные значения**: `top left`, `top center`, `top right`, `right top`, `right middle`, `right bottom`, `bottom left`, `bottom center`, `bottom right`, `left top`, `left middle`, `left bottom`\n   * @default ['bottom left', 'bottom right', 'top left', 'top right']\n   */\n  positions?: PopupPositionsType[];\n  menuMaxHeight?: number | string;\n  /**\n   * Не показывать анимацию\n   */\n  disableAnimations?: boolean;\n  /**\n   * Кастомная иконка\n   */\n  icon?: React.ReactNode;\n  /**\n   * Атрибут для указания id элемента(-ов), описывающих его\n   */\n  'aria-describedby'?: AriaAttributes['aria-describedby'];\n}\n\nexport const KebabDataTids = {\n  caption: 'Kebab__caption',\n} as const;\n\nexport interface KebabState {\n  anchor: Nullable<HTMLElement>;\n  focusedByTab: boolean;\n}\n\ntype DefaultProps = Required<Pick<KebabProps, 'onOpen' | 'onClose' | 'positions' | 'size' | 'disableAnimations'>>;\n\n@rootNode\nexport class Kebab extends React.Component<KebabProps, KebabState> {\n  public static __KONTUR_REACT_UI__ = 'Kebab';\n\n  public static propTypes = {};\n\n  public static defaultProps: DefaultProps = {\n    onOpen: () => undefined,\n    onClose: () => undefined,\n    positions: ['bottom left', 'bottom right', 'top left', 'top right'],\n    size: 'small',\n    disableAnimations: isTestEnv,\n  };\n\n  private getProps = createPropsGetter(Kebab.defaultProps);\n\n  public state: KebabState = {\n    focusedByTab: false,\n    anchor: null,\n  };\n\n  private theme!: Theme;\n  private setRootNode!: TSetRootNode;\n\n  private listener: {\n    remove: () => void;\n  } = {\n    remove: () => undefined,\n  };\n\n  public componentDidMount() {\n    /** addListener'у нужен колбэк в аргумент */\n    this.listener = LayoutEvents.addListener(() => undefined);\n  }\n\n  public componentWillUnmount() {\n    this.listener.remove();\n  }\n\n  public render(): JSX.Element {\n    return (\n      <ThemeContext.Consumer>\n        {(theme) => {\n          this.theme = theme;\n          return (\n            <ThemeContext.Provider\n              value={ThemeFactory.create(\n                {\n                  popupPinOffset: theme.kebabPinOffset,\n                  popupMargin: theme.kebabMargin,\n                  popupPinSize: theme.kebabPinSize,\n                },\n                theme,\n              )}\n            >\n              {this.renderMain()}\n            </ThemeContext.Provider>\n          );\n        }}\n      </ThemeContext.Consumer>\n    );\n  }\n\n  private renderMain() {\n    const { disabled } = this.props;\n    const { positions, disableAnimations, onOpen, onClose } = this.getProps();\n    return (\n      <CommonWrapper rootNodeRef={this.setRootNode} {...this.props}>\n        <PopupMenu\n          popupHasPin\n          positions={positions}\n          onChangeMenuState={this.handleChangeMenuState}\n          caption={this.renderCaption}\n          disableAnimations={disableAnimations}\n          menuMaxHeight={this.props.menuMaxHeight}\n          onOpen={onOpen}\n          onClose={onClose}\n          popupMenuId={this.props.popupMenuId}\n        >\n          {!disabled && this.props.children}\n        </PopupMenu>\n      </CommonWrapper>\n    );\n  }\n\n  private renderCaption = (captionProps: PopupMenuCaptionProps) => {\n    const { disabled, size } = this.getProps();\n    const handleCaptionKeyDown = (event: React.KeyboardEvent<HTMLDivElement>) => {\n      if (!disabled) {\n        this.handleCaptionKeyDown(event, captionProps.openMenu);\n      }\n    };\n\n    const handleCaptionClick = () => {\n      if (!disabled) {\n        captionProps.toggleMenu();\n      }\n    };\n\n    return (\n      <span\n        data-tid={KebabDataTids.caption}\n        tabIndex={disabled ? -1 : 0}\n        onClick={handleCaptionClick}\n        onKeyDown={handleCaptionKeyDown}\n        onFocus={this.handleFocus}\n        onBlur={this.handleBlur}\n        className={cx(\n          styles.kebab(this.theme),\n          size === 'small' && styles.kebabSmall(this.theme),\n          size === 'medium' && styles.kebabMedium(this.theme),\n          size === 'large' && styles.kebabLarge(this.theme),\n          isTheme2022(this.theme) && styles.kebab2022(),\n          captionProps.opened && styles.opened(this.theme),\n          disabled && styles.disabled(),\n          this.state.focusedByTab && styles.focused(this.theme),\n        )}\n        aria-describedby={this.props['aria-describedby']}\n      >\n        {isTheme2022(this.theme) ? this.renderIcon2022() : this.renderIcon()}\n      </span>\n    );\n  };\n\n  private handleCaptionKeyDown = (\n    e: React.KeyboardEvent<HTMLDivElement>,\n    openMenu: PopupMenuCaptionProps['openMenu'],\n  ) => {\n    if (someKeys(isKeyEnter, isKeySpace, isKeyArrowVertical)(e)) {\n      e.preventDefault();\n      openMenu(true);\n    }\n  };\n\n  private handleChangeMenuState = (isOpened: boolean, restoreFocus: boolean): void => {\n    this.setState({\n      focusedByTab: !isOpened && restoreFocus,\n    });\n  };\n\n  private handleFocus = () => {\n    if (!this.props.disabled) {\n      // focus event fires before keyDown eventlistener\n      // so we should check tabPressed in async way\n      requestAnimationFrame(() => {\n        if (keyListener.isTabPressed) {\n          this.setState({ focusedByTab: true });\n        }\n      });\n    }\n  };\n\n  private handleBlur = () => {\n    this.setState({\n      focusedByTab: false,\n    });\n  };\n\n  private renderIcon() {\n    const { size, icon = <MenuKebabIcon /> } = this.getProps();\n    return (\n      <div\n        className={cx({\n          [styles.icon(this.theme)]: true,\n          [styles.iconsmall(this.theme)]: size === 'small',\n          [styles.iconmedium(this.theme)]: size === 'medium',\n          [styles.iconlarge(this.theme)]: size === 'large',\n        })}\n      >\n        {icon}\n      </div>\n    );\n  }\n\n  private renderIcon2022() {\n    const { size, icon = <KebabIcon /> } = this.getProps();\n\n    if (isElement(icon) && isKonturIcon(icon)) {\n      const sizes: Record<ButtonSize, number> = {\n        small: parseInt(this.theme.kebabIconSizeSmall),\n        medium: parseInt(this.theme.kebabIconSizeMedium),\n        large: parseInt(this.theme.kebabIconSizeLarge),\n      };\n\n      return React.cloneElement(icon, {\n        size: icon.props.size ?? sizes[size],\n        color: icon.props.color ?? this.theme.kebabIconColor,\n      });\n    }\n\n    return icon;\n  }\n}\n\nKebab.propTypes = {\n  children: PropTypes.node,\n  disabled: PropTypes.bool,\n  menuMaxHeight: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),\n\n  /**\n   * Размер кебаба small 14px | large 20px\n   */\n  size: PropTypes.string,\n\n  /**\n   * Коллбек, вызывающийся перед закрытием кебаба\n   */\n  onClose: PropTypes.func,\n\n  /**\n   * Коллбек, вызывающийся перед открытием кебаба\n   */\n  onOpen: PropTypes.func,\n};\n"]}
+{"version":3,"sources":["Kebab.tsx"],"names":["KebabDataTids","caption","Kebab","rootNode","getProps","defaultProps","state","focusedByTab","anchor","listener","remove","undefined","renderCaption","captionProps","disabled","size","handleCaptionKeyDown","event","openMenu","handleCaptionClick","toggleMenu","handleFocus","handleBlur","styles","kebab","theme","kebabSmall","kebabMedium","kebabLarge","kebab2022","opened","focused","props","renderIcon2022","renderIcon","e","isKeyEnter","isKeySpace","isKeyArrowVertical","preventDefault","handleChangeMenuState","isOpened","restoreFocus","setState","requestAnimationFrame","keyListener","isTabPressed","componentDidMount","LayoutEvents","addListener","componentWillUnmount","render","ThemeFactory","create","popupPinOffset","kebabPinOffset","popupMargin","kebabMargin","popupPinSize","kebabPinSize","renderMain","positions","disableAnimations","onOpen","onClose","setRootNode","preventIconsOffset","menuMaxHeight","popupMenuId","children","icon","iconsmall","iconmedium","iconlarge","sizes","small","parseInt","kebabIconSizeSmall","medium","kebabIconSizeMedium","large","kebabIconSizeLarge","React","cloneElement","color","kebabIconColor","Component","__KONTUR_REACT_UI__","propTypes","isTestEnv","PropTypes","node","bool","oneOfType","string","number","func"],"mappings":"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","sourcesContent":["import React, { AriaAttributes } from 'react';\nimport PropTypes from 'prop-types';\nimport { isElement } from 'react-is';\n\nimport { isKonturIcon } from '../../lib/utils';\nimport { isKeyArrowVertical, isKeyEnter, isKeySpace, someKeys } from '../../lib/events/keyboard/identifiers';\nimport * as LayoutEvents from '../../lib/LayoutEvents';\nimport { keyListener } from '../../lib/events/keyListener';\nimport { PopupMenu, PopupMenuCaptionProps, PopupMenuProps } from '../../internal/PopupMenu';\nimport { Nullable } from '../../typings/utility-types';\nimport { PopupPositionsType } from '../../internal/Popup';\nimport { ThemeContext } from '../../lib/theming/ThemeContext';\nimport { Theme } from '../../lib/theming/Theme';\nimport { MenuKebabIcon } from '../../internal/icons/16px';\nimport { isTestEnv } from '../../lib/currentEnvironment';\nimport { ThemeFactory } from '../../lib/theming/ThemeFactory';\nimport { CommonWrapper, CommonProps } from '../../internal/CommonWrapper';\nimport { cx } from '../../lib/theming/Emotion';\nimport { rootNode, TSetRootNode } from '../../lib/rootNode';\nimport { createPropsGetter } from '../../lib/createPropsGetter';\nimport { isTheme2022 } from '../../lib/theming/ThemeHelpers';\nimport { ButtonSize } from '../Button';\n\nimport { styles } from './Kebab.styles';\nimport { KebabIcon } from './KebabIcon';\n\nexport interface KebabProps\n  extends CommonProps,\n    Pick<PopupMenuProps, 'onOpen' | 'onClose' | 'popupMenuId' | 'preventIconsOffset'> {\n  disabled?: boolean;\n  size?: 'small' | 'medium' | 'large';\n  /**\n   * Список позиций доступных для расположения выпадашки.\n   *\n   * Если во всех позициях выпадашка вылезает за пределы `viewport`, будет использована первая из этого списка.\n   *\n   * **Возможные значения**: `top left`, `top center`, `top right`, `right top`, `right middle`, `right bottom`, `bottom left`, `bottom center`, `bottom right`, `left top`, `left middle`, `left bottom`\n   * @default ['bottom left', 'bottom right', 'top left', 'top right']\n   */\n  positions?: PopupPositionsType[];\n  menuMaxHeight?: number | string;\n  /**\n   * Не показывать анимацию\n   */\n  disableAnimations?: boolean;\n  /**\n   * Кастомная иконка\n   */\n  icon?: React.ReactNode;\n  /**\n   * Атрибут для указания id элемента(-ов), описывающих его\n   */\n  'aria-describedby'?: AriaAttributes['aria-describedby'];\n}\n\nexport const KebabDataTids = {\n  caption: 'Kebab__caption',\n} as const;\n\nexport interface KebabState {\n  anchor: Nullable<HTMLElement>;\n  focusedByTab: boolean;\n}\n\ntype DefaultProps = Required<Pick<KebabProps, 'onOpen' | 'onClose' | 'positions' | 'size' | 'disableAnimations'>>;\n\n@rootNode\nexport class Kebab extends React.Component<KebabProps, KebabState> {\n  public static __KONTUR_REACT_UI__ = 'Kebab';\n\n  public static propTypes = {};\n\n  public static defaultProps: DefaultProps = {\n    onOpen: () => undefined,\n    onClose: () => undefined,\n    positions: ['bottom left', 'bottom right', 'top left', 'top right'],\n    size: 'small',\n    disableAnimations: isTestEnv,\n  };\n\n  private getProps = createPropsGetter(Kebab.defaultProps);\n\n  public state: KebabState = {\n    focusedByTab: false,\n    anchor: null,\n  };\n\n  private theme!: Theme;\n  private setRootNode!: TSetRootNode;\n\n  private listener: {\n    remove: () => void;\n  } = {\n    remove: () => undefined,\n  };\n\n  public componentDidMount() {\n    /** addListener'у нужен колбэк в аргумент */\n    this.listener = LayoutEvents.addListener(() => undefined);\n  }\n\n  public componentWillUnmount() {\n    this.listener.remove();\n  }\n\n  public render(): JSX.Element {\n    return (\n      <ThemeContext.Consumer>\n        {(theme) => {\n          this.theme = theme;\n          return (\n            <ThemeContext.Provider\n              value={ThemeFactory.create(\n                {\n                  popupPinOffset: theme.kebabPinOffset,\n                  popupMargin: theme.kebabMargin,\n                  popupPinSize: theme.kebabPinSize,\n                },\n                theme,\n              )}\n            >\n              {this.renderMain()}\n            </ThemeContext.Provider>\n          );\n        }}\n      </ThemeContext.Consumer>\n    );\n  }\n\n  private renderMain() {\n    const { disabled } = this.props;\n    const { positions, disableAnimations, onOpen, onClose } = this.getProps();\n    return (\n      <CommonWrapper rootNodeRef={this.setRootNode} {...this.props}>\n        <PopupMenu\n          popupHasPin\n          preventIconsOffset={this.props.preventIconsOffset}\n          positions={positions}\n          onChangeMenuState={this.handleChangeMenuState}\n          caption={this.renderCaption}\n          disableAnimations={disableAnimations}\n          menuMaxHeight={this.props.menuMaxHeight}\n          onOpen={onOpen}\n          onClose={onClose}\n          popupMenuId={this.props.popupMenuId}\n        >\n          {!disabled && this.props.children}\n        </PopupMenu>\n      </CommonWrapper>\n    );\n  }\n\n  private renderCaption = (captionProps: PopupMenuCaptionProps) => {\n    const { disabled, size } = this.getProps();\n    const handleCaptionKeyDown = (event: React.KeyboardEvent<HTMLDivElement>) => {\n      if (!disabled) {\n        this.handleCaptionKeyDown(event, captionProps.openMenu);\n      }\n    };\n\n    const handleCaptionClick = () => {\n      if (!disabled) {\n        captionProps.toggleMenu();\n      }\n    };\n\n    return (\n      <span\n        data-tid={KebabDataTids.caption}\n        tabIndex={disabled ? -1 : 0}\n        onClick={handleCaptionClick}\n        onKeyDown={handleCaptionKeyDown}\n        onFocus={this.handleFocus}\n        onBlur={this.handleBlur}\n        className={cx(\n          styles.kebab(this.theme),\n          size === 'small' && styles.kebabSmall(this.theme),\n          size === 'medium' && styles.kebabMedium(this.theme),\n          size === 'large' && styles.kebabLarge(this.theme),\n          isTheme2022(this.theme) && styles.kebab2022(),\n          captionProps.opened && styles.opened(this.theme),\n          disabled && styles.disabled(),\n          this.state.focusedByTab && styles.focused(this.theme),\n        )}\n        aria-describedby={this.props['aria-describedby']}\n      >\n        {isTheme2022(this.theme) ? this.renderIcon2022() : this.renderIcon()}\n      </span>\n    );\n  };\n\n  private handleCaptionKeyDown = (\n    e: React.KeyboardEvent<HTMLDivElement>,\n    openMenu: PopupMenuCaptionProps['openMenu'],\n  ) => {\n    if (someKeys(isKeyEnter, isKeySpace, isKeyArrowVertical)(e)) {\n      e.preventDefault();\n      openMenu(true);\n    }\n  };\n\n  private handleChangeMenuState = (isOpened: boolean, restoreFocus: boolean): void => {\n    this.setState({\n      focusedByTab: !isOpened && restoreFocus,\n    });\n  };\n\n  private handleFocus = () => {\n    if (!this.props.disabled) {\n      // focus event fires before keyDown eventlistener\n      // so we should check tabPressed in async way\n      requestAnimationFrame(() => {\n        if (keyListener.isTabPressed) {\n          this.setState({ focusedByTab: true });\n        }\n      });\n    }\n  };\n\n  private handleBlur = () => {\n    this.setState({\n      focusedByTab: false,\n    });\n  };\n\n  private renderIcon() {\n    const { size, icon = <MenuKebabIcon /> } = this.getProps();\n    return (\n      <div\n        className={cx({\n          [styles.icon(this.theme)]: true,\n          [styles.iconsmall(this.theme)]: size === 'small',\n          [styles.iconmedium(this.theme)]: size === 'medium',\n          [styles.iconlarge(this.theme)]: size === 'large',\n        })}\n      >\n        {icon}\n      </div>\n    );\n  }\n\n  private renderIcon2022() {\n    const { size, icon = <KebabIcon /> } = this.getProps();\n\n    if (isElement(icon) && isKonturIcon(icon)) {\n      const sizes: Record<ButtonSize, number> = {\n        small: parseInt(this.theme.kebabIconSizeSmall),\n        medium: parseInt(this.theme.kebabIconSizeMedium),\n        large: parseInt(this.theme.kebabIconSizeLarge),\n      };\n\n      return React.cloneElement(icon, {\n        size: icon.props.size ?? sizes[size],\n        color: icon.props.color ?? this.theme.kebabIconColor,\n      });\n    }\n\n    return icon;\n  }\n}\n\nKebab.propTypes = {\n  children: PropTypes.node,\n  disabled: PropTypes.bool,\n  menuMaxHeight: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),\n\n  /**\n   * Размер кебаба small 14px | large 20px\n   */\n  size: PropTypes.string,\n\n  /**\n   * Коллбек, вызывающийся перед закрытием кебаба\n   */\n  onClose: PropTypes.func,\n\n  /**\n   * Коллбек, вызывающийся перед открытием кебаба\n   */\n  onOpen: PropTypes.func,\n};\n"]}

package/cjs/components/Kebab/Kebab.md

@@ -160,6 +160,34 @@ let Card = ({ title }) => (
 <Card title="С кастомным действием" />
 ```
 
+С иконками и включенным по-умолчанию автоматическим выравниванием текста.
+
+```jsx harmony
+import { Button, MenuHeader, MenuItem, MenuSeparator, Kebab } from '@skbkontur/react-ui';
+import OkIcon from '@skbkontur/react-icons/Ok';
+
+<Kebab>
+  <MenuHeader>MenuHeader</MenuHeader>
+  <MenuItem icon={<OkIcon />}>MenuItem1</MenuItem>
+  <MenuItem icon={<OkIcon />}>MenuItem2</MenuItem>
+  <MenuItem>MenuItem3</MenuItem>
+</Kebab>;
+```
+
+С иконками и отключенным автоматическим выравниванием текста.
+
+```jsx harmony
+import { Button, MenuHeader, MenuItem, MenuSeparator, Kebab } from '@skbkontur/react-ui';
+import OkIcon from '@skbkontur/react-icons/Ok';
+
+<Kebab preventIconsOffset>
+  <MenuHeader>MenuHeader</MenuHeader>
+  <MenuItem icon={<OkIcon />}>MenuItem1</MenuItem>
+  <MenuItem icon={<OkIcon />}>MenuItem2</MenuItem>
+  <MenuItem>MenuItem3</MenuItem>
+</Kebab>
+```
+
 Отключенное кебаб-меню.
 
 ```jsx harmony

package/cjs/components/TooltipMenu/TooltipMenu.d.ts

@@ -5,7 +5,7 @@ import { MenuHeaderProps } from '../MenuHeader';
 import { PopupPositionsType } from '../../internal/Popup';
 import { CommonProps } from '../../internal/CommonWrapper';
 export declare type TooltipMenuChildType = React.ReactElement<MenuItemProps | unknown | MenuHeaderProps>;
-export interface TooltipMenuProps extends CommonProps, Pick<PopupMenuProps, 'onOpen' | 'onClose'> {
+export interface TooltipMenuProps extends CommonProps, Pick<PopupMenuProps, 'onOpen' | 'onClose' | 'preventIconsOffset'> {
     children?: TooltipMenuChildType | TooltipMenuChildType[];
     /** Максимальная высота меню */
     menuMaxHeight?: number | string;

package/cjs/components/TooltipMenu/TooltipMenu.js

@@ -48,6 +48,8 @@ var _createPropsGetter = require("../../lib/createPropsGetter");var _class, _cla
 
 
 
+
+
 
 
 
@@ -115,6 +117,8 @@ TooltipMenu = (0, _rootNode.rootNode)(_class = (_temp = _class2 = /*#__PURE__*/f
       return null;
     }
 
+    var _this$getProps = this.getProps(),disableAnimations = _this$getProps.disableAnimations;
+
     return /*#__PURE__*/(
       _react.default.createElement(_CommonWrapper.CommonWrapper, (0, _extends2.default)({ rootNodeRef: this.setRootNode }, this.props), /*#__PURE__*/
       _react.default.createElement(_PopupMenu.PopupMenu, {
@@ -124,11 +128,12 @@ TooltipMenu = (0, _rootNode.rootNode)(_class = (_temp = _class2 = /*#__PURE__*/f
         caption: this.props.caption,
         header: this.props.header,
         footer: this.props.footer,
+        preventIconsOffset: this.props.preventIconsOffset,
         positions: this.props.positions,
         onOpen: this.props.onOpen,
         onClose: this.props.onClose,
         popupHasPin: true,
-        disableAnimations: this.getProps().disableAnimations },
+        disableAnimations: disableAnimations },
 
       this.props.children)));
 

package/cjs/components/TooltipMenu/TooltipMenu.js.map

@@ -1 +1 @@
-{"version":3,"sources":["TooltipMenu.tsx"],"names":["TooltipMenuDataTids","root","TooltipMenu","rootNode","props","getProps","defaultProps","caption","isProductionEnv","Error","render","theme","ThemeFactory","create","popupPinOffset","tooltipMenuPinOffset","popupMargin","tooltipMenuMargin","popupPinSize","tooltipMenuPinSize","renderMain","setRootNode","menuMaxHeight","menuWidth","header","footer","positions","onOpen","onClose","disableAnimations","children","React","Component","__KONTUR_REACT_UI__","isTestEnv"],"mappings":"uWAAA;;AAEA;AACA;AACA;;AAEA;;;AAGA;AACA;AACA,gE;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA0CO,IAAMA,mBAAmB,GAAG;AACjCC,EAAAA,IAAI,EAAE,mBAD2B,EAA5B,C;;;;;AAMP;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,G;;AAEaC,W,OADZC,kB;;;;;;;;;;AAWC,uBAAYC,KAAZ,EAAqC;AACnC,wCAAMA,KAAN,UADmC,MAF7BC,QAE6B,GAFlB,0CAAkBH,WAAW,CAACI,YAA9B,CAEkB;;AAGnC,QAAI,CAACF,KAAK,CAACG,OAAP,IAAkB,CAACC,mCAAvB,EAAwC;AACtC,YAAM,IAAIC,KAAJ,CAAU,+BAAV,CAAN;AACD,KALkC;AAMpC,G;;AAEMC,EAAAA,M,GAAP,kBAAgB;AACd;AACE,mCAAC,0BAAD,CAAc,QAAd;AACG,gBAACC,KAAD,EAAW;AACV;AACE,uCAAC,0BAAD,CAAc,QAAd;AACE,YAAA,KAAK,EAAEC,2BAAaC,MAAb;AACL;AACEC,cAAAA,cAAc,EAAEH,KAAK,CAACI,oBADxB;AAEEC,cAAAA,WAAW,EAAEL,KAAK,CAACM,iBAFrB;AAGEC,cAAAA,YAAY,EAAEP,KAAK,CAACQ,kBAHtB,EADK;;AAMLR,YAAAA,KANK,CADT;;;AAUG,UAAA,MAAI,CAACS,UAAL,EAVH,CADF;;;AAcD,OAhBH,CADF;;;AAoBD,G;;AAEMA,EAAAA,U,GAAP,sBAAoB;AAClB,QAAI,CAAC,KAAKhB,KAAL,CAAWG,OAAhB,EAAyB;AACvB,aAAO,IAAP;AACD;;AAED;AACE,mCAAC,4BAAD,2BAAe,WAAW,EAAE,KAAKc,WAAjC,IAAkD,KAAKjB,KAAvD;AACE,mCAAC,oBAAD;AACE,oBAAUJ,mBAAmB,CAACC,IADhC;AAEE,QAAA,aAAa,EAAE,KAAKG,KAAL,CAAWkB,aAF5B;AAGE,QAAA,SAAS,EAAE,KAAKlB,KAAL,CAAWmB,SAHxB;AAIE,QAAA,OAAO,EAAE,KAAKnB,KAAL,CAAWG,OAJtB;AAKE,QAAA,MAAM,EAAE,KAAKH,KAAL,CAAWoB,MALrB;AAME,QAAA,MAAM,EAAE,KAAKpB,KAAL,CAAWqB,MANrB;AAOE,QAAA,SAAS,EAAE,KAAKrB,KAAL,CAAWsB,SAPxB;AAQE,QAAA,MAAM,EAAE,KAAKtB,KAAL,CAAWuB,MARrB;AASE,QAAA,OAAO,EAAE,KAAKvB,KAAL,CAAWwB,OATtB;AAUE,QAAA,WAAW,MAVb;AAWE,QAAA,iBAAiB,EAAE,KAAKvB,QAAL,GAAgBwB,iBAXrC;;AAaG,WAAKzB,KAAL,CAAW0B,QAbd,CADF,CADF;;;;AAmBD,G,sBAjE8BC,eAAMC,S,WACvBC,mB,GAAsB,a,UAGtB3B,Y,GAA6B,EACzCuB,iBAAiB,EAAEK,6BADsB,E","sourcesContent":["import React from 'react';\n\nimport { ThemeFactory } from '../../lib/theming/ThemeFactory';\nimport { ThemeContext } from '../../lib/theming/ThemeContext';\nimport { PopupMenu, PopupMenuProps } from '../../internal/PopupMenu';\nimport { MenuItemProps } from '../MenuItem';\nimport { isProductionEnv, isTestEnv } from '../../lib/currentEnvironment';\nimport { MenuHeaderProps } from '../MenuHeader';\nimport { PopupPositionsType } from '../../internal/Popup';\nimport { CommonProps, CommonWrapper } from '../../internal/CommonWrapper';\nimport { rootNode, TSetRootNode } from '../../lib/rootNode';\nimport { createPropsGetter } from '../../lib/createPropsGetter';\n\nexport type TooltipMenuChildType = React.ReactElement<MenuItemProps | unknown | MenuHeaderProps>;\n\nexport interface TooltipMenuProps extends CommonProps, Pick<PopupMenuProps, 'onOpen' | 'onClose'> {\n  children?: TooltipMenuChildType | TooltipMenuChildType[];\n  /** Максимальная высота меню */\n  menuMaxHeight?: number | string;\n  /** Ширина меню */\n  menuWidth?: number | string;\n  /**\n   * Элемент или функция возвращающая элемент,\n   * если передана, используется вместо `caption`,\n   * в таком случае управлять открытием и закрытием меню\n   * придется в этой функции\n   */\n  caption: PopupMenuProps['caption'];\n  /**\n   * Произвольный элемент, который будет отрендерен в шапке меню.\n   *\n   * _Примечание_: контрол [MenuHeader](#/Components/MenuHeader) передаётся только в `children` меню-контролов. Не стоит передавать `MenuHeader` в `header`.\n   */\n  header?: React.ReactNode;\n  /**\n   * Произвольный элемент, который будет отрендерен в подвале меню.\n   *\n   * Перед элементом переданным в `footer` будет отрендерен [MenuSeparator](#/Components/MenuSeparator).\n   */\n  footer?: React.ReactNode;\n  /**  Список позиций доступных для расположения выпадашки относительно `caption`.\n   *\n   * Если во всех позициях выпадашка вылезает за пределы `viewport`, будет использована первая из этого списка.\n   *\n   * **Возможные значения**: `top left`, `top center`, `top right`, `right top`, `right middle`, `right bottom`, `bottom left`, `bottom center`, `bottom right`, `left top`, `left middle`, `left bottom`\n   */\n  positions?: PopupPositionsType[];\n  /**\n   * Не показывать анимацию\n   */\n  disableAnimations?: boolean;\n}\n\nexport const TooltipMenuDataTids = {\n  root: 'TooltipMenu__root',\n} as const;\n\ntype DefaultProps = Required<Pick<TooltipMenuProps, 'disableAnimations'>>;\n\n/**\n * Меню, раскрывающееся по клику на переданный в `caption` элемент.\n *\n * Положение меню задаётся с помощью массива `positions` и работает так:\n * первое значение в массиве - дефолтная позиция, меню раскроется на этой позиции, если оно не будет выходить за пределы `viewport`,\n * если раскрыться в дефолтной позиции не получится - будет использована следующая позиция, и так далее, пока не будет достигнут конец массива. Если все положения из списка будут выходить за пределы `viewport`, в качестве положения будет использовано первое значение в массиве.\n *\n * Если меню должно раскрываться только в одну сторону - массив `positions` должен содержать только один элемент: сторону, в которую должно открываться меню.\n *\n * Если массив `positions` не передан (или передан пустой массив), будут использованы всевозможные значения.\n */\n@rootNode\nexport class TooltipMenu extends React.Component<TooltipMenuProps> {\n  public static __KONTUR_REACT_UI__ = 'TooltipMenu';\n  private setRootNode!: TSetRootNode;\n\n  public static defaultProps: DefaultProps = {\n    disableAnimations: isTestEnv,\n  };\n\n  private getProps = createPropsGetter(TooltipMenu.defaultProps);\n\n  constructor(props: TooltipMenuProps) {\n    super(props);\n\n    if (!props.caption && !isProductionEnv) {\n      throw new Error('Prop \"caption\" is required!!!');\n    }\n  }\n\n  public render() {\n    return (\n      <ThemeContext.Consumer>\n        {(theme) => {\n          return (\n            <ThemeContext.Provider\n              value={ThemeFactory.create(\n                {\n                  popupPinOffset: theme.tooltipMenuPinOffset,\n                  popupMargin: theme.tooltipMenuMargin,\n                  popupPinSize: theme.tooltipMenuPinSize,\n                },\n                theme,\n              )}\n            >\n              {this.renderMain()}\n            </ThemeContext.Provider>\n          );\n        }}\n      </ThemeContext.Consumer>\n    );\n  }\n\n  public renderMain() {\n    if (!this.props.caption) {\n      return null;\n    }\n\n    return (\n      <CommonWrapper rootNodeRef={this.setRootNode} {...this.props}>\n        <PopupMenu\n          data-tid={TooltipMenuDataTids.root}\n          menuMaxHeight={this.props.menuMaxHeight}\n          menuWidth={this.props.menuWidth}\n          caption={this.props.caption}\n          header={this.props.header}\n          footer={this.props.footer}\n          positions={this.props.positions}\n          onOpen={this.props.onOpen}\n          onClose={this.props.onClose}\n          popupHasPin\n          disableAnimations={this.getProps().disableAnimations}\n        >\n          {this.props.children}\n        </PopupMenu>\n      </CommonWrapper>\n    );\n  }\n}\n"]}
+{"version":3,"sources":["TooltipMenu.tsx"],"names":["TooltipMenuDataTids","root","TooltipMenu","rootNode","props","getProps","defaultProps","caption","isProductionEnv","Error","render","theme","ThemeFactory","create","popupPinOffset","tooltipMenuPinOffset","popupMargin","tooltipMenuMargin","popupPinSize","tooltipMenuPinSize","renderMain","disableAnimations","setRootNode","menuMaxHeight","menuWidth","header","footer","preventIconsOffset","positions","onOpen","onClose","children","React","Component","__KONTUR_REACT_UI__","isTestEnv"],"mappings":"uWAAA;;AAEA;AACA;AACA;;AAEA;;;AAGA;AACA;AACA,gE;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA4CO,IAAMA,mBAAmB,GAAG;AACjCC,EAAAA,IAAI,EAAE,mBAD2B,EAA5B,C;;;;;AAMP;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,G;;AAEaC,W,OADZC,kB;;;;;;;;;;AAWC,uBAAYC,KAAZ,EAAqC;AACnC,wCAAMA,KAAN,UADmC,MAF7BC,QAE6B,GAFlB,0CAAkBH,WAAW,CAACI,YAA9B,CAEkB;;AAGnC,QAAI,CAACF,KAAK,CAACG,OAAP,IAAkB,CAACC,mCAAvB,EAAwC;AACtC,YAAM,IAAIC,KAAJ,CAAU,+BAAV,CAAN;AACD,KALkC;AAMpC,G;;AAEMC,EAAAA,M,GAAP,kBAAgB;AACd;AACE,mCAAC,0BAAD,CAAc,QAAd;AACG,gBAACC,KAAD,EAAW;AACV;AACE,uCAAC,0BAAD,CAAc,QAAd;AACE,YAAA,KAAK,EAAEC,2BAAaC,MAAb;AACL;AACEC,cAAAA,cAAc,EAAEH,KAAK,CAACI,oBADxB;AAEEC,cAAAA,WAAW,EAAEL,KAAK,CAACM,iBAFrB;AAGEC,cAAAA,YAAY,EAAEP,KAAK,CAACQ,kBAHtB,EADK;;AAMLR,YAAAA,KANK,CADT;;;AAUG,UAAA,MAAI,CAACS,UAAL,EAVH,CADF;;;AAcD,OAhBH,CADF;;;AAoBD,G;;AAEMA,EAAAA,U,GAAP,sBAAoB;AAClB,QAAI,CAAC,KAAKhB,KAAL,CAAWG,OAAhB,EAAyB;AACvB,aAAO,IAAP;AACD;;AAED,yBAA8B,KAAKF,QAAL,EAA9B,CAAQgB,iBAAR,kBAAQA,iBAAR;;AAEA;AACE,mCAAC,4BAAD,2BAAe,WAAW,EAAE,KAAKC,WAAjC,IAAkD,KAAKlB,KAAvD;AACE,mCAAC,oBAAD;AACE,oBAAUJ,mBAAmB,CAACC,IADhC;AAEE,QAAA,aAAa,EAAE,KAAKG,KAAL,CAAWmB,aAF5B;AAGE,QAAA,SAAS,EAAE,KAAKnB,KAAL,CAAWoB,SAHxB;AAIE,QAAA,OAAO,EAAE,KAAKpB,KAAL,CAAWG,OAJtB;AAKE,QAAA,MAAM,EAAE,KAAKH,KAAL,CAAWqB,MALrB;AAME,QAAA,MAAM,EAAE,KAAKrB,KAAL,CAAWsB,MANrB;AAOE,QAAA,kBAAkB,EAAE,KAAKtB,KAAL,CAAWuB,kBAPjC;AAQE,QAAA,SAAS,EAAE,KAAKvB,KAAL,CAAWwB,SARxB;AASE,QAAA,MAAM,EAAE,KAAKxB,KAAL,CAAWyB,MATrB;AAUE,QAAA,OAAO,EAAE,KAAKzB,KAAL,CAAW0B,OAVtB;AAWE,QAAA,WAAW,MAXb;AAYE,QAAA,iBAAiB,EAAET,iBAZrB;;AAcG,WAAKjB,KAAL,CAAW2B,QAdd,CADF,CADF;;;;AAoBD,G,sBApE8BC,eAAMC,S,WACvBC,mB,GAAsB,a,UAGtB5B,Y,GAA6B,EACzCe,iBAAiB,EAAEc,6BADsB,E","sourcesContent":["import React from 'react';\n\nimport { ThemeFactory } from '../../lib/theming/ThemeFactory';\nimport { ThemeContext } from '../../lib/theming/ThemeContext';\nimport { PopupMenu, PopupMenuProps } from '../../internal/PopupMenu';\nimport { MenuItemProps } from '../MenuItem';\nimport { isProductionEnv, isTestEnv } from '../../lib/currentEnvironment';\nimport { MenuHeaderProps } from '../MenuHeader';\nimport { PopupPositionsType } from '../../internal/Popup';\nimport { CommonProps, CommonWrapper } from '../../internal/CommonWrapper';\nimport { rootNode, TSetRootNode } from '../../lib/rootNode';\nimport { createPropsGetter } from '../../lib/createPropsGetter';\n\nexport type TooltipMenuChildType = React.ReactElement<MenuItemProps | unknown | MenuHeaderProps>;\n\nexport interface TooltipMenuProps\n  extends CommonProps,\n    Pick<PopupMenuProps, 'onOpen' | 'onClose' | 'preventIconsOffset'> {\n  children?: TooltipMenuChildType | TooltipMenuChildType[];\n  /** Максимальная высота меню */\n  menuMaxHeight?: number | string;\n  /** Ширина меню */\n  menuWidth?: number | string;\n  /**\n   * Элемент или функция возвращающая элемент,\n   * если передана, используется вместо `caption`,\n   * в таком случае управлять открытием и закрытием меню\n   * придется в этой функции\n   */\n  caption: PopupMenuProps['caption'];\n  /**\n   * Произвольный элемент, который будет отрендерен в шапке меню.\n   *\n   * _Примечание_: контрол [MenuHeader](#/Components/MenuHeader) передаётся только в `children` меню-контролов. Не стоит передавать `MenuHeader` в `header`.\n   */\n  header?: React.ReactNode;\n  /**\n   * Произвольный элемент, который будет отрендерен в подвале меню.\n   *\n   * Перед элементом переданным в `footer` будет отрендерен [MenuSeparator](#/Components/MenuSeparator).\n   */\n  footer?: React.ReactNode;\n  /**  Список позиций доступных для расположения выпадашки относительно `caption`.\n   *\n   * Если во всех позициях выпадашка вылезает за пределы `viewport`, будет использована первая из этого списка.\n   *\n   * **Возможные значения**: `top left`, `top center`, `top right`, `right top`, `right middle`, `right bottom`, `bottom left`, `bottom center`, `bottom right`, `left top`, `left middle`, `left bottom`\n   */\n  positions?: PopupPositionsType[];\n  /**\n   * Не показывать анимацию\n   */\n  disableAnimations?: boolean;\n}\n\nexport const TooltipMenuDataTids = {\n  root: 'TooltipMenu__root',\n} as const;\n\ntype DefaultProps = Required<Pick<TooltipMenuProps, 'disableAnimations'>>;\n\n/**\n * Меню, раскрывающееся по клику на переданный в `caption` элемент.\n *\n * Положение меню задаётся с помощью массива `positions` и работает так:\n * первое значение в массиве - дефолтная позиция, меню раскроется на этой позиции, если оно не будет выходить за пределы `viewport`,\n * если раскрыться в дефолтной позиции не получится - будет использована следующая позиция, и так далее, пока не будет достигнут конец массива. Если все положения из списка будут выходить за пределы `viewport`, в качестве положения будет использовано первое значение в массиве.\n *\n * Если меню должно раскрываться только в одну сторону - массив `positions` должен содержать только один элемент: сторону, в которую должно открываться меню.\n *\n * Если массив `positions` не передан (или передан пустой массив), будут использованы всевозможные значения.\n */\n@rootNode\nexport class TooltipMenu extends React.Component<TooltipMenuProps> {\n  public static __KONTUR_REACT_UI__ = 'TooltipMenu';\n  private setRootNode!: TSetRootNode;\n\n  public static defaultProps: DefaultProps = {\n    disableAnimations: isTestEnv,\n  };\n\n  private getProps = createPropsGetter(TooltipMenu.defaultProps);\n\n  constructor(props: TooltipMenuProps) {\n    super(props);\n\n    if (!props.caption && !isProductionEnv) {\n      throw new Error('Prop \"caption\" is required!!!');\n    }\n  }\n\n  public render() {\n    return (\n      <ThemeContext.Consumer>\n        {(theme) => {\n          return (\n            <ThemeContext.Provider\n              value={ThemeFactory.create(\n                {\n                  popupPinOffset: theme.tooltipMenuPinOffset,\n                  popupMargin: theme.tooltipMenuMargin,\n                  popupPinSize: theme.tooltipMenuPinSize,\n                },\n                theme,\n              )}\n            >\n              {this.renderMain()}\n            </ThemeContext.Provider>\n          );\n        }}\n      </ThemeContext.Consumer>\n    );\n  }\n\n  public renderMain() {\n    if (!this.props.caption) {\n      return null;\n    }\n\n    const { disableAnimations } = this.getProps();\n\n    return (\n      <CommonWrapper rootNodeRef={this.setRootNode} {...this.props}>\n        <PopupMenu\n          data-tid={TooltipMenuDataTids.root}\n          menuMaxHeight={this.props.menuMaxHeight}\n          menuWidth={this.props.menuWidth}\n          caption={this.props.caption}\n          header={this.props.header}\n          footer={this.props.footer}\n          preventIconsOffset={this.props.preventIconsOffset}\n          positions={this.props.positions}\n          onOpen={this.props.onOpen}\n          onClose={this.props.onClose}\n          popupHasPin\n          disableAnimations={disableAnimations}\n        >\n          {this.props.children}\n        </PopupMenu>\n      </CommonWrapper>\n    );\n  }\n}\n"]}

package/cjs/components/TooltipMenu/TooltipMenu.md

@@ -180,6 +180,34 @@ import { Button, MenuHeader, MenuItem, MenuSeparator } from '@skbkontur/react-ui
 </TooltipMenu>;
 ```
 
+С иконками и включенным по-умолчанию автоматическим выравниванием текста.
+
+```jsx harmony
+import { Button, MenuHeader, MenuItem, MenuSeparator, TooltipMenu } from '@skbkontur/react-ui';
+import OkIcon from '@skbkontur/react-icons/Ok';
+
+<TooltipMenu caption={<Button use="primary">Открыть меню</Button>}>
+  <MenuHeader>MenuHeader</MenuHeader>
+  <MenuItem icon={<OkIcon />}>MenuItem1</MenuItem>
+  <MenuItem icon={<OkIcon />}>MenuItem2</MenuItem>
+  <MenuItem>MenuItem3</MenuItem>
+</TooltipMenu>;
+```
+
+С иконками и отключенным автоматическим выравниванием текста.
+
+```jsx harmony
+import { Button, MenuHeader, MenuItem, MenuSeparator, TooltipMenu } from '@skbkontur/react-ui';
+import OkIcon from '@skbkontur/react-icons/Ok';
+
+<TooltipMenu preventIconsOffset caption={<Button use="primary">Открыть меню</Button>}>
+  <MenuHeader>MenuHeader</MenuHeader>
+  <MenuItem icon={<OkIcon />}>MenuItem1</MenuItem>
+  <MenuItem icon={<OkIcon />}>MenuItem2</MenuItem>
+  <MenuItem>MenuItem3</MenuItem>
+</TooltipMenu>
+```
+
 Условный рендер элементов тултип-меню (с сохранением поведения [MenuItem](#/Components/MenuItem)).
 
 ```jsx harmony

package/cjs/internal/InternalMenu/InternalMenu.d.ts

@@ -1,6 +1,6 @@
 import React from 'react';
 import { ScrollContainerScrollState } from '../../components/ScrollContainer';
-interface MenuProps {
+export interface InternalMenuProps {
     children?: React.ReactNode;
     hasShadow?: boolean;
     /**
@@ -12,6 +12,11 @@ interface MenuProps {
     onItemClick?: (event: React.SyntheticEvent<HTMLElement>) => void;
     width?: number | string;
     preventWindowScroll?: boolean;
+    /**
+     * Предотвращает выравнивание текста всех пунктов меню относительно друг друга.
+     * Так, если хотя бы у одного пункта меню есть иконка, текст в  остальных пунктах меню будет выровнен относительно пункта меню с иконкой
+     */
+    preventIconsOffset?: boolean;
     onKeyDown?: (event: React.KeyboardEvent<HTMLElement>) => void;
     header?: React.ReactNode;
     footer?: React.ReactNode;
@@ -26,8 +31,8 @@ interface MenuState {
 export declare const InternalMenuDataTids: {
     readonly root: "InternalMenu__root";
 };
-declare type DefaultProps = Required<Pick<MenuProps, 'width' | 'maxHeight' | 'hasShadow' | 'preventWindowScroll' | 'cyclicSelection' | 'initialSelectedItemIndex'>>;
-export declare class InternalMenu extends React.PureComponent<MenuProps, MenuState> {
+declare type DefaultProps = Required<Pick<InternalMenuProps, 'width' | 'maxHeight' | 'hasShadow' | 'preventWindowScroll' | 'cyclicSelection' | 'initialSelectedItemIndex'>>;
+export declare class InternalMenu extends React.PureComponent<InternalMenuProps, MenuState> {
     static __KONTUR_REACT_UI__: string;
     static defaultProps: DefaultProps;
     private getProps;
@@ -39,7 +44,7 @@ export declare class InternalMenu extends React.PureComponent<MenuProps, MenuSta
     private header;
     private footer;
     componentDidMount(): void;
-    componentDidUpdate(prevProps: MenuProps): void;
+    componentDidUpdate(prevProps: InternalMenuProps): void;
     focus(): void;
     render(): JSX.Element;
     private renderMain;

package/cjs/internal/InternalMenu/InternalMenu.js

@@ -17,7 +17,13 @@ var _ThemeFactory = require("../../lib/theming/ThemeFactory");
 
 var _InternalMenu = require("./InternalMenu.styles");
 var _isActiveElement = require("./isActiveElement");
-var _addIconPaddingIfPartOfMenu = require("./addIconPaddingIfPartOfMenu");var _class, _class2, _temp;
+var _addIconPaddingIfPartOfMenu = require("./addIconPaddingIfPartOfMenu");
+var _isIconPaddingEnabled = require("./isIconPaddingEnabled");var _class, _class2, _temp;
+
+
+
+
+
 
 
 
@@ -191,8 +197,6 @@ InternalMenu = (0, _rootNode2.rootNode)(_class = (_temp = _class2 = /*#__PURE__*
 
 
 
-
-
 
 
 
@@ -426,7 +430,7 @@ InternalMenu = (0, _rootNode2.rootNode)(_class = (_temp = _class2 = /*#__PURE__*
       if (_this.state.scrollState !== scrollState) {
         _this.setState({ scrollState: scrollState });
       }
-    };return _this;}var _proto = InternalMenu.prototype;_proto.componentDidMount = function componentDidMount() {this.setInitialSelection();this.calculateMaxHeight();};_proto.componentDidUpdate = function componentDidUpdate(prevProps) {if (this.shouldRecalculateMaxHeight(prevProps)) {this.calculateMaxHeight();}if (prevProps.maxHeight !== this.getProps().maxHeight) {this.setState({ maxHeight: this.props.maxHeight || 'none' });}};_proto.focus = function focus() {this.focusOnRootElement();};_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 _cx3,_this3 = this;var enableIconPadding = _react.default.Children.toArray(this.props.children).some(function (x) {return /*#__PURE__*/_react.default.isValidElement(x) && x.props.icon;});if (this.isEmpty()) {return null;}var _this$getProps = this.getProps(),hasShadow = _this$getProps.hasShadow,width = _this$getProps.width,maxHeight = _this$getProps.maxHeight,preventWindowScroll = _this$getProps.preventWindowScroll;return /*#__PURE__*/_react.default.createElement("div", { "data-tid": InternalMenuDataTids.root, className: (0, _Emotion.cx)((_cx3 = {}, _cx3[_InternalMenu.styles.root(this.theme)] = true, _cx3[_InternalMenu.styles.shadow(this.theme)] = hasShadow, _cx3)), style: { width: width, maxHeight: this.state.maxHeight }, onKeyDown: this.handleKeyDown, ref: this.setRootNode, tabIndex: 0 }, this.props.header ? this.renderHeader() : null, /*#__PURE__*/_react.default.createElement(_ScrollContainer.ScrollContainer, { ref: this.refScrollContainer, maxHeight: maxHeight, preventWindowScroll: preventWindowScroll, onScrollStateChange: this.handleScrollStateChange }, _react.default.Children.map(this.props.children, function (child, index) {if (typeof child === 'string' || typeof child === 'number' || (0, _utils.isNullable)(child)) {return child;}if ( /*#__PURE__*/_react.default.isValidElement(child) && typeof child.type === 'string') {return child;}var modifiedChild = (0, _addIconPaddingIfPartOfMenu.addIconPaddingIfPartOfMenu)(child, enableIconPadding);if ((0, _isActiveElement.isActiveElement)(modifiedChild)) {var highlight = _this3.state.highlightedIndex === index;var ref = modifiedChild.ref;var originalRef = ref;if (highlight) {ref = function ref(menuItem) {return _this3.refHighlighted(originalRef, menuItem);};}return /*#__PURE__*/_react.default.cloneElement(modifiedChild, { ref: ref, state: highlight ? 'hover' : modifiedChild.props.state, onClick: _this3.select.bind(_this3, index, false), onMouseEnter: function onMouseEnter(event) {_this3.highlightItem(index);if ((0, _MenuItem.isMenuItem)(modifiedChild) && modifiedChild.props.onMouseEnter) {modifiedChild.props.onMouseEnter(event);}}, onMouseLeave: function onMouseLeave(event) {_this3.unhighlight();if ((0, _MenuItem.isMenuItem)(modifiedChild) && modifiedChild.props.onMouseLeave) {modifiedChild.props.onMouseLeave(event);}} });}return modifiedChild;})), this.props.footer ? this.renderFooter() : null);};_proto.refHighlighted = function refHighlighted(originalRef, menuItem) {this.highlighted = menuItem;if (!originalRef || typeof originalRef === 'string') {return;}if (typeof originalRef === 'function') {originalRef(menuItem);} else if (typeof originalRef === 'object') {// @ts-expect-error: See: https://github.com/DefinitelyTyped/DefinitelyTyped/issues/31065.
+    };return _this;}var _proto = InternalMenu.prototype;_proto.componentDidMount = function componentDidMount() {this.setInitialSelection();this.calculateMaxHeight();};_proto.componentDidUpdate = function componentDidUpdate(prevProps) {if (this.shouldRecalculateMaxHeight(prevProps)) {this.calculateMaxHeight();}if (prevProps.maxHeight !== this.getProps().maxHeight) {this.setState({ maxHeight: this.props.maxHeight || 'none' });}};_proto.focus = function focus() {this.focusOnRootElement();};_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 _cx3,_this3 = this;var enableIconPadding = (0, _isIconPaddingEnabled.isIconPaddingEnabled)(this.props.children, this.props.preventIconsOffset);if (this.isEmpty()) {return null;}var _this$getProps = this.getProps(),hasShadow = _this$getProps.hasShadow,width = _this$getProps.width,maxHeight = _this$getProps.maxHeight,preventWindowScroll = _this$getProps.preventWindowScroll;return /*#__PURE__*/_react.default.createElement("div", { "data-tid": InternalMenuDataTids.root, className: (0, _Emotion.cx)((_cx3 = {}, _cx3[_InternalMenu.styles.root(this.theme)] = true, _cx3[_InternalMenu.styles.shadow(this.theme)] = hasShadow, _cx3)), style: { width: width, maxHeight: this.state.maxHeight }, onKeyDown: this.handleKeyDown, ref: this.setRootNode, tabIndex: 0 }, this.props.header ? this.renderHeader() : null, /*#__PURE__*/_react.default.createElement(_ScrollContainer.ScrollContainer, { ref: this.refScrollContainer, maxHeight: maxHeight, preventWindowScroll: preventWindowScroll, onScrollStateChange: this.handleScrollStateChange }, _react.default.Children.map(this.props.children, function (child, index) {if (typeof child === 'string' || typeof child === 'number' || (0, _utils.isNullable)(child)) {return child;}if ( /*#__PURE__*/_react.default.isValidElement(child) && typeof child.type === 'string') {return child;}var modifiedChild = (0, _addIconPaddingIfPartOfMenu.addIconPaddingIfPartOfMenu)(child, enableIconPadding);if ((0, _isActiveElement.isActiveElement)(modifiedChild)) {var highlight = _this3.state.highlightedIndex === index;var ref = modifiedChild.ref;var originalRef = ref;if (highlight) {ref = function ref(menuItem) {return _this3.refHighlighted(originalRef, menuItem);};}return /*#__PURE__*/_react.default.cloneElement(modifiedChild, { ref: ref, state: highlight ? 'hover' : modifiedChild.props.state, onClick: _this3.select.bind(_this3, index, false), onMouseEnter: function onMouseEnter(event) {_this3.highlightItem(index);if ((0, _MenuItem.isMenuItem)(modifiedChild) && modifiedChild.props.onMouseEnter) {modifiedChild.props.onMouseEnter(event);}}, onMouseLeave: function onMouseLeave(event) {_this3.unhighlight();if ((0, _MenuItem.isMenuItem)(modifiedChild) && modifiedChild.props.onMouseLeave) {modifiedChild.props.onMouseLeave(event);}} });}return modifiedChild;})), this.props.footer ? this.renderFooter() : null);};_proto.refHighlighted = function refHighlighted(originalRef, menuItem) {this.highlighted = menuItem;if (!originalRef || typeof originalRef === 'string') {return;}if (typeof originalRef === 'function') {originalRef(menuItem);} else if (typeof originalRef === 'object') {// @ts-expect-error: See: https://github.com/DefinitelyTyped/DefinitelyTyped/issues/31065.
       originalRef.current = menuItem;}};_proto.select = function select(index, shouldHandleHref, event) {var item = childrenToArray(this.props.children)[index];if ((0, _isActiveElement.isActiveElement)(item)) {if (shouldHandleHref && item.props.href) {if (item.props.target) {window.open(item.props.href, item.props.target);} else {location.href = item.props.href;}}if (item.props.onClick) {item.props.onClick(event);}if (this.props.onItemClick) {this.props.onItemClick(event);}return true;}return false;};_proto.move = function move(step) {var _this4 = this;this.setState(function (state, props) {var children = childrenToArray(props.children);if (!children.some(_isActiveElement.isActiveElement)) {return null;}var index = state.highlightedIndex;do {index += step;if (!_this4.getProps().cyclicSelection && (index < 0 || index > children.length)) {return null;}if (index < 0) {index = children.length - 1;} else if (index > children.length) {index = 0;}var child = children[index];if ((0, _isActiveElement.isActiveElement)(child)) {return { highlightedIndex: index };}} while (index !== state.highlightedIndex);return null;}, this.scrollToSelected);};_proto.isEmpty = function isEmpty() {var children = this.props.children;return !children || !childrenToArray(children).filter(_utils.isNonNullable).length;};return InternalMenu;}(_react.default.PureComponent), _class2.__KONTUR_REACT_UI__ = 'InternalMenu', _class2.defaultProps = { width: 'auto', maxHeight: 300, hasShadow: true, preventWindowScroll: true, cyclicSelection: true, initialSelectedItemIndex: -1 }, _temp)) || _class;exports.InternalMenu = InternalMenu;
 
 function childrenToArray(children) {