@megafon/ui-shared 9.0.0-alpha.2 → 9.0.0-alpha.21

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (207) hide show
  1. package/dist/es/components/AccordionBox/AccordionBox.d.ts +3 -1
  2. package/dist/es/components/BenefitCards/BenefitCard/BenefitCard.css +1 -0
  3. package/dist/es/components/BenefitCards/BenefitCard/BenefitCard.d.ts +13 -0
  4. package/dist/es/components/BenefitCards/BenefitCard/BenefitCard.js +59 -0
  5. package/dist/es/components/BenefitCards/BenefitCards.css +1 -0
  6. package/dist/es/components/BenefitCards/BenefitCards.d.ts +27 -0
  7. package/dist/es/components/BenefitCards/BenefitCards.js +35 -0
  8. package/dist/es/components/BenefitCards/helpers.d.ts +1 -0
  9. package/dist/es/components/BenefitCards/helpers.js +19 -0
  10. package/dist/es/components/BenefitCards/types.d.ts +24 -0
  11. package/dist/es/components/BenefitCards/types.js +1 -0
  12. package/dist/es/components/BlogBox/BlogBox.d.ts +3 -0
  13. package/dist/es/components/BlogBox/BlogBox.js +8 -3
  14. package/dist/es/components/BlogBox/components/BlogBoxTile.css +1 -1
  15. package/dist/es/components/BlogBox/components/BlogBoxTile.d.ts +5 -1
  16. package/dist/es/components/BlogBox/components/BlogBoxTile.js +3 -2
  17. package/dist/es/components/Breadcrumbs/Breadcrumbs.d.ts +2 -0
  18. package/dist/es/components/Breadcrumbs/Breadcrumbs.js +3 -0
  19. package/dist/es/components/Breadcrumbs/components/BreadcrumbsItem.d.ts +1 -0
  20. package/dist/es/components/Breadcrumbs/components/BreadcrumbsItem.js +18 -13
  21. package/dist/es/components/Card/Card.css +1 -1
  22. package/dist/es/components/Card/Card.d.ts +2 -1
  23. package/dist/es/components/Card/Card.js +23 -16
  24. package/dist/es/components/Card/types.d.ts +3 -5
  25. package/dist/es/components/CardsOnBackground/CardsOnBackground.css +1 -0
  26. package/dist/es/components/CardsOnBackground/CardsOnBackground.d.ts +34 -0
  27. package/dist/es/components/CardsOnBackground/CardsOnBackground.js +99 -0
  28. package/dist/es/components/CardsOnBackground/components/CardOnBackground.css +1 -0
  29. package/dist/es/components/CardsOnBackground/components/CardOnBackground.d.ts +22 -0
  30. package/dist/es/components/CardsOnBackground/components/CardOnBackground.js +94 -0
  31. package/dist/es/components/CardsOnBackground/types.d.ts +42 -0
  32. package/dist/es/components/CardsOnBackground/types.js +6 -0
  33. package/dist/es/components/CardsOnBackground/useUniformHeights.d.ts +9 -0
  34. package/dist/es/components/CardsOnBackground/useUniformHeights.js +88 -0
  35. package/dist/es/components/Container/Container.css +1 -1
  36. package/dist/es/components/Container/Container.d.ts +4 -0
  37. package/dist/es/components/Container/Container.js +4 -1
  38. package/dist/es/components/DarkGradientCards/DarkGradientCards.d.ts +5 -0
  39. package/dist/es/components/DarkGradientCards/DarkGradientCards.js +9 -4
  40. package/dist/es/components/DarkGradientCards/components/DarkGradientCard.css +1 -1
  41. package/dist/es/components/DarkGradientCards/components/DarkGradientCard.d.ts +1 -0
  42. package/dist/es/components/DarkGradientCards/components/DarkGradientCard.js +1 -1
  43. package/dist/es/components/DownloadLinks/DownloadLink.css +1 -1
  44. package/dist/es/components/DownloadLinks/DownloadLink.js +3 -1
  45. package/dist/es/components/InfoCards/components/InfoCard/InfoCard.css +1 -1
  46. package/dist/es/components/InfoCards/components/InfoCard/InfoCard.js +4 -2
  47. package/dist/es/components/Instructions/Instructions.css +1 -1
  48. package/dist/es/components/Instructions/Instructions.d.ts +0 -2
  49. package/dist/es/components/Instructions/Instructions.js +19 -22
  50. package/dist/es/components/NotificationBox/NotificationBox.d.ts +1 -1
  51. package/dist/es/components/NotificationBox/NotificationBox.js +1 -4
  52. package/dist/es/components/Partners/Partners.css +1 -1
  53. package/dist/es/components/Partners/Partners.d.ts +3 -8
  54. package/dist/es/components/Partners/Partners.js +20 -31
  55. package/dist/es/components/Partners/components/PartnersItem/PartnersItem.css +1 -0
  56. package/dist/es/components/Partners/components/PartnersItem/PartnersItem.d.ts +12 -0
  57. package/dist/es/components/Partners/components/PartnersItem/PartnersItem.js +33 -0
  58. package/dist/es/components/Partners/types.d.ts +7 -0
  59. package/dist/es/components/Partners/types.js +1 -0
  60. package/dist/es/components/PictureBox/PictureBox.d.ts +1 -0
  61. package/dist/es/components/PictureBox/PictureBox.js +2 -0
  62. package/dist/es/components/PromoBanner/components/PromoBannerSlide/PromoBannerSlide.d.ts +2 -0
  63. package/dist/es/components/PromoBanner/components/PromoBannerSlide/PromoBannerSlide.js +2 -0
  64. package/dist/es/components/PromoCards/PromoCards.d.ts +3 -0
  65. package/dist/es/components/PromoCards/PromoCards.js +6 -1
  66. package/dist/es/components/PromoCards/components/PromoCard/PromoCard.css +1 -1
  67. package/dist/es/components/PromoCards/components/PromoCard/PromoCard.d.ts +2 -0
  68. package/dist/es/components/PromoCards/components/PromoCard/PromoCard.js +17 -9
  69. package/dist/es/components/ServiceCards/components/ServiceCard/ServiceCard.css +1 -1
  70. package/dist/es/components/ServiceCards/components/ServiceCard/ServiceCard.js +1 -1
  71. package/dist/es/components/SidePictureCards/SidePictureCards.d.ts +5 -0
  72. package/dist/es/components/SidePictureCards/SidePictureCards.js +5 -2
  73. package/dist/es/components/SidePictureCards/components/SidePictureCard.d.ts +2 -0
  74. package/dist/es/components/SidePictureCards/components/SidePictureCard.js +8 -3
  75. package/dist/es/components/SidePictureCards/types.d.ts +3 -1
  76. package/dist/es/components/StepperBox/StepperBox.d.ts +11 -0
  77. package/dist/es/components/StepperBox/StepperBox.js +36 -0
  78. package/dist/es/components/Steps/Steps.css +1 -1
  79. package/dist/es/components/Steps/Steps.d.ts +2 -2
  80. package/dist/es/components/Steps/Steps.js +1 -1
  81. package/dist/es/components/StoreBanner/StoreBanner.css +1 -1
  82. package/dist/es/components/StoreBanner/StoreBanner.d.ts +1 -5
  83. package/dist/es/components/StoreBanner/StoreBanner.js +1 -5
  84. package/dist/es/components/StoreButton/StoreButton.css +1 -1
  85. package/dist/es/components/TitleDescriptionBox/TitleDescriptionBox.css +1 -1
  86. package/dist/es/components/TitleDescriptionBox/TitleDescriptionBox.d.ts +27 -1
  87. package/dist/es/components/TitleDescriptionBox/TitleDescriptionBox.js +31 -24
  88. package/dist/es/hooks/useIsomorphicLayoutEffect.d.ts +3 -0
  89. package/dist/es/hooks/useIsomorphicLayoutEffect.js +6 -0
  90. package/dist/es/index.d.ts +7 -2
  91. package/dist/es/index.js +7 -2
  92. package/dist/lib/components/AccordionBox/AccordionBox.d.ts +3 -1
  93. package/dist/lib/components/BenefitCards/BenefitCard/BenefitCard.css +1 -0
  94. package/dist/lib/components/BenefitCards/BenefitCard/BenefitCard.d.ts +13 -0
  95. package/dist/lib/components/BenefitCards/BenefitCard/BenefitCard.js +68 -0
  96. package/dist/lib/components/BenefitCards/BenefitCards.css +1 -0
  97. package/dist/lib/components/BenefitCards/BenefitCards.d.ts +27 -0
  98. package/dist/lib/components/BenefitCards/BenefitCards.js +44 -0
  99. package/dist/lib/components/BenefitCards/helpers.d.ts +1 -0
  100. package/dist/lib/components/BenefitCards/helpers.js +26 -0
  101. package/dist/lib/components/BenefitCards/types.d.ts +24 -0
  102. package/dist/lib/components/BenefitCards/types.js +5 -0
  103. package/dist/lib/components/BlogBox/BlogBox.d.ts +3 -0
  104. package/dist/lib/components/BlogBox/BlogBox.js +8 -3
  105. package/dist/lib/components/BlogBox/components/BlogBoxTile.css +1 -1
  106. package/dist/lib/components/BlogBox/components/BlogBoxTile.d.ts +5 -1
  107. package/dist/lib/components/BlogBox/components/BlogBoxTile.js +3 -2
  108. package/dist/lib/components/Breadcrumbs/Breadcrumbs.d.ts +2 -0
  109. package/dist/lib/components/Breadcrumbs/Breadcrumbs.js +3 -0
  110. package/dist/lib/components/Breadcrumbs/components/BreadcrumbsItem.d.ts +1 -0
  111. package/dist/lib/components/Breadcrumbs/components/BreadcrumbsItem.js +18 -13
  112. package/dist/lib/components/Card/Card.css +1 -1
  113. package/dist/lib/components/Card/Card.d.ts +2 -1
  114. package/dist/lib/components/Card/Card.js +22 -15
  115. package/dist/lib/components/Card/types.d.ts +3 -5
  116. package/dist/lib/components/CardsOnBackground/CardsOnBackground.css +1 -0
  117. package/dist/lib/components/CardsOnBackground/CardsOnBackground.d.ts +34 -0
  118. package/dist/lib/components/CardsOnBackground/CardsOnBackground.js +108 -0
  119. package/dist/lib/components/CardsOnBackground/components/CardOnBackground.css +1 -0
  120. package/dist/lib/components/CardsOnBackground/components/CardOnBackground.d.ts +22 -0
  121. package/dist/lib/components/CardsOnBackground/components/CardOnBackground.js +100 -0
  122. package/dist/lib/components/CardsOnBackground/types.d.ts +42 -0
  123. package/dist/lib/components/CardsOnBackground/types.js +12 -0
  124. package/dist/lib/components/CardsOnBackground/useUniformHeights.d.ts +9 -0
  125. package/dist/lib/components/CardsOnBackground/useUniformHeights.js +95 -0
  126. package/dist/lib/components/Container/Container.css +1 -1
  127. package/dist/lib/components/Container/Container.d.ts +4 -0
  128. package/dist/lib/components/Container/Container.js +4 -1
  129. package/dist/lib/components/DarkGradientCards/DarkGradientCards.d.ts +5 -0
  130. package/dist/lib/components/DarkGradientCards/DarkGradientCards.js +9 -4
  131. package/dist/lib/components/DarkGradientCards/components/DarkGradientCard.css +1 -1
  132. package/dist/lib/components/DarkGradientCards/components/DarkGradientCard.d.ts +1 -0
  133. package/dist/lib/components/DarkGradientCards/components/DarkGradientCard.js +1 -1
  134. package/dist/lib/components/DownloadLinks/DownloadLink.css +1 -1
  135. package/dist/lib/components/DownloadLinks/DownloadLink.js +3 -1
  136. package/dist/lib/components/InfoCards/components/InfoCard/InfoCard.css +1 -1
  137. package/dist/lib/components/InfoCards/components/InfoCard/InfoCard.js +4 -2
  138. package/dist/lib/components/Instructions/Instructions.css +1 -1
  139. package/dist/lib/components/Instructions/Instructions.d.ts +0 -2
  140. package/dist/lib/components/Instructions/Instructions.js +19 -21
  141. package/dist/lib/components/NotificationBox/NotificationBox.d.ts +1 -1
  142. package/dist/lib/components/NotificationBox/NotificationBox.js +1 -5
  143. package/dist/lib/components/Partners/Partners.css +1 -1
  144. package/dist/lib/components/Partners/Partners.d.ts +3 -8
  145. package/dist/lib/components/Partners/Partners.js +19 -30
  146. package/dist/lib/components/Partners/components/PartnersItem/PartnersItem.css +1 -0
  147. package/dist/lib/components/Partners/components/PartnersItem/PartnersItem.d.ts +12 -0
  148. package/dist/lib/components/Partners/components/PartnersItem/PartnersItem.js +42 -0
  149. package/dist/lib/components/Partners/types.d.ts +7 -0
  150. package/dist/lib/components/Partners/types.js +5 -0
  151. package/dist/lib/components/PictureBox/PictureBox.d.ts +1 -0
  152. package/dist/lib/components/PictureBox/PictureBox.js +2 -0
  153. package/dist/lib/components/PromoBanner/components/PromoBannerSlide/PromoBannerSlide.d.ts +2 -0
  154. package/dist/lib/components/PromoBanner/components/PromoBannerSlide/PromoBannerSlide.js +2 -0
  155. package/dist/lib/components/PromoCards/PromoCards.d.ts +3 -0
  156. package/dist/lib/components/PromoCards/PromoCards.js +6 -1
  157. package/dist/lib/components/PromoCards/components/PromoCard/PromoCard.css +1 -1
  158. package/dist/lib/components/PromoCards/components/PromoCard/PromoCard.d.ts +2 -0
  159. package/dist/lib/components/PromoCards/components/PromoCard/PromoCard.js +16 -9
  160. package/dist/lib/components/ServiceCards/components/ServiceCard/ServiceCard.css +1 -1
  161. package/dist/lib/components/ServiceCards/components/ServiceCard/ServiceCard.js +1 -1
  162. package/dist/lib/components/SidePictureCards/SidePictureCards.d.ts +5 -0
  163. package/dist/lib/components/SidePictureCards/SidePictureCards.js +5 -2
  164. package/dist/lib/components/SidePictureCards/components/SidePictureCard.d.ts +2 -0
  165. package/dist/lib/components/SidePictureCards/components/SidePictureCard.js +8 -3
  166. package/dist/lib/components/SidePictureCards/types.d.ts +3 -1
  167. package/dist/lib/components/StepperBox/StepperBox.d.ts +11 -0
  168. package/dist/lib/components/StepperBox/StepperBox.js +46 -0
  169. package/dist/lib/components/Steps/Steps.css +1 -1
  170. package/dist/lib/components/Steps/Steps.d.ts +2 -2
  171. package/dist/lib/components/Steps/Steps.js +1 -1
  172. package/dist/lib/components/StoreBanner/StoreBanner.css +1 -1
  173. package/dist/lib/components/StoreBanner/StoreBanner.d.ts +1 -5
  174. package/dist/lib/components/StoreBanner/StoreBanner.js +1 -5
  175. package/dist/lib/components/StoreButton/StoreButton.css +1 -1
  176. package/dist/lib/components/TitleDescriptionBox/TitleDescriptionBox.css +1 -1
  177. package/dist/lib/components/TitleDescriptionBox/TitleDescriptionBox.d.ts +27 -1
  178. package/dist/lib/components/TitleDescriptionBox/TitleDescriptionBox.js +30 -23
  179. package/dist/lib/hooks/useIsomorphicLayoutEffect.d.ts +3 -0
  180. package/dist/lib/hooks/useIsomorphicLayoutEffect.js +13 -0
  181. package/dist/lib/index.d.ts +7 -2
  182. package/dist/lib/index.js +45 -10
  183. package/package.json +6 -6
  184. package/dist/es/components/Stepper/Stepper.css +0 -1
  185. package/dist/es/components/Stepper/Stepper.d.ts +0 -52
  186. package/dist/es/components/Stepper/Stepper.js +0 -159
  187. package/dist/es/components/Stepper/StepperItem.css +0 -1
  188. package/dist/es/components/Stepper/StepperItem.d.ts +0 -57
  189. package/dist/es/components/Stepper/StepperItem.js +0 -99
  190. package/dist/es/components/Stepper/img/separator-mobile.png +0 -0
  191. package/dist/es/components/Stepper/img/separator-vertical.png +0 -0
  192. package/dist/es/components/Stepper/img/separator.png +0 -0
  193. package/dist/es/components/StoreBanner/img/black-iphone.png +0 -0
  194. package/dist/es/components/StoreBanner/img/iphone12.png +0 -0
  195. package/dist/es/components/StoreBanner/img/white-iphone.png +0 -0
  196. package/dist/lib/components/Stepper/Stepper.css +0 -1
  197. package/dist/lib/components/Stepper/Stepper.d.ts +0 -52
  198. package/dist/lib/components/Stepper/Stepper.js +0 -168
  199. package/dist/lib/components/Stepper/StepperItem.css +0 -1
  200. package/dist/lib/components/Stepper/StepperItem.d.ts +0 -57
  201. package/dist/lib/components/Stepper/StepperItem.js +0 -108
  202. package/dist/lib/components/Stepper/img/separator-mobile.png +0 -0
  203. package/dist/lib/components/Stepper/img/separator-vertical.png +0 -0
  204. package/dist/lib/components/Stepper/img/separator.png +0 -0
  205. package/dist/lib/components/StoreBanner/img/black-iphone.png +0 -0
  206. package/dist/lib/components/StoreBanner/img/iphone12.png +0 -0
  207. package/dist/lib/components/StoreBanner/img/white-iphone.png +0 -0
@@ -1,99 +0,0 @@
1
- import _extends from "@babel/runtime/helpers/extends";
2
- import "core-js/modules/es.string.link.js";
3
- import * as React from 'react';
4
- import { Button, Header, Paragraph } from '@megafon/ui-core';
5
- import { cnCreate, filterDataAttrs } from '@megafon/ui-helpers';
6
- import "./StepperItem.css";
7
- export var STEPPER_ITEM_THEME_ENUM;
8
- (function (STEPPER_ITEM_THEME_ENUM) {
9
- STEPPER_ITEM_THEME_ENUM["CHECKED"] = "checked";
10
- STEPPER_ITEM_THEME_ENUM["ACTIVE"] = "active";
11
- STEPPER_ITEM_THEME_ENUM["DEFAULT"] = "default";
12
- })(STEPPER_ITEM_THEME_ENUM || (STEPPER_ITEM_THEME_ENUM = {}));
13
- export var STEPPER_ITEM_VIEW_ENUM;
14
- (function (STEPPER_ITEM_VIEW_ENUM) {
15
- STEPPER_ITEM_VIEW_ENUM["ICON"] = "icon";
16
- STEPPER_ITEM_VIEW_ENUM["CONTENT"] = "content";
17
- STEPPER_ITEM_VIEW_ENUM["DEFAULT"] = "default";
18
- })(STEPPER_ITEM_VIEW_ENUM || (STEPPER_ITEM_VIEW_ENUM = {}));
19
- var cn = cnCreate('mfui-9-stepper-item');
20
- var StepperItem = function StepperItem(_ref) {
21
- var className = _ref.className,
22
- _ref$classes = _ref.classes,
23
- _ref$classes2 = _ref$classes === void 0 ? {} : _ref$classes,
24
- iconButtonClassName = _ref$classes2.iconButton,
25
- titleClassName = _ref$classes2.title,
26
- textClassName = _ref$classes2.text,
27
- linkClassName = _ref$classes2.link,
28
- _ref$theme = _ref.theme,
29
- theme = _ref$theme === void 0 ? STEPPER_ITEM_THEME_ENUM.DEFAULT : _ref$theme,
30
- title = _ref.title,
31
- text = _ref.text,
32
- linkText = _ref.linkText,
33
- linkUrl = _ref.linkUrl,
34
- icon = _ref.icon,
35
- hasSeparator = _ref.hasSeparator,
36
- _ref$isHorizontal = _ref.isHorizontal,
37
- isHorizontal = _ref$isHorizontal === void 0 ? true : _ref$isHorizontal,
38
- isDisabled = _ref.isDisabled,
39
- _ref$align = _ref.align,
40
- align = _ref$align === void 0 ? 'center' : _ref$align,
41
- _ref$view = _ref.view,
42
- view = _ref$view === void 0 ? STEPPER_ITEM_VIEW_ENUM.DEFAULT : _ref$view,
43
- _ref$dataAttrs = _ref.dataAttrs,
44
- _ref$dataAttrs2 = _ref$dataAttrs === void 0 ? {} : _ref$dataAttrs,
45
- rootAttrs = _ref$dataAttrs2.root,
46
- iconButtonAttrs = _ref$dataAttrs2.iconButton,
47
- titleAttrs = _ref$dataAttrs2.title,
48
- textAttrs = _ref$dataAttrs2.text,
49
- linkAttrs = _ref$dataAttrs2.link,
50
- onClick = _ref.onClick;
51
- var hasLink = !!linkText && !!linkUrl;
52
- var hasContent = !!title || !!text || hasLink;
53
- var showContent = view !== STEPPER_ITEM_VIEW_ENUM.ICON && hasContent;
54
- var showIcon = view !== STEPPER_ITEM_VIEW_ENUM.CONTENT;
55
- var renderContent = /*#__PURE__*/React.createElement("div", {
56
- className: cn('content')
57
- }, title && /*#__PURE__*/React.createElement(Header, {
58
- className: cn([titleClassName]),
59
- dataAttrs: {
60
- root: titleAttrs
61
- },
62
- as: "h5",
63
- align: align
64
- }, title), text && /*#__PURE__*/React.createElement(Paragraph, {
65
- className: cn([textClassName]),
66
- dataAttrs: {
67
- root: textAttrs
68
- },
69
- hasMargin: false,
70
- align: align
71
- }, text), hasLink && /*#__PURE__*/React.createElement(Button, {
72
- className: cn('link', [linkClassName]),
73
- dataAttrs: {
74
- root: linkAttrs
75
- },
76
- href: linkUrl,
77
- type: "text",
78
- sizeAll: "extra-small"
79
- }, linkText));
80
- return /*#__PURE__*/React.createElement("div", _extends({}, filterDataAttrs(rootAttrs), {
81
- className: cn([className], {
82
- theme: theme,
83
- align: align,
84
- 'is-horizontal': isHorizontal
85
- })
86
- }), showIcon && /*#__PURE__*/React.createElement("div", {
87
- className: cn('icon-button-area')
88
- }, /*#__PURE__*/React.createElement("button", _extends({}, filterDataAttrs(iconButtonAttrs), {
89
- className: cn('icon-button', [iconButtonClassName]),
90
- type: "button",
91
- disabled: isDisabled,
92
- onClick: onClick
93
- }), /*#__PURE__*/React.createElement("span", {
94
- className: cn('icon')
95
- }, icon)), hasSeparator && /*#__PURE__*/React.createElement("span", {
96
- className: cn('separator')
97
- })), showContent && renderContent);
98
- };
99
- export default StepperItem;
@@ -1 +0,0 @@
1
- h1,h2,h3,h4,h5{margin:0}.mfui-9-stepper{gap:16px}.mfui-9-stepper,.mfui-9-stepper__items-wrap{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column}.mfui-9-stepper__items-wrap{gap:12px;overflow-x:auto}.mfui-9-stepper::-webkit-scrollbar{height:8px}.mfui-9-stepper::-webkit-scrollbar-thumb{background-color:var(--spbSky2);border-radius:8px}.mfui-9-stepper_is-horizontal .mfui-9-stepper__items-wrap{-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-direction:row;flex-direction:row}
@@ -1,52 +0,0 @@
1
- import * as React from 'react';
2
- import type { IStepperItemProps } from './StepperItem';
3
- import './Stepper.scss';
4
- export type StepperItemType = Pick<IStepperItemProps, 'title' | 'text' | 'icon' | 'linkText' | 'linkUrl'>;
5
- export interface IStepperProps {
6
- /** Дополнительный класс корневого элемента */
7
- className?: string;
8
- /** Дополнительные классы элементов */
9
- classes?: {
10
- root?: string;
11
- itemsWrap?: string;
12
- item?: string;
13
- itemIconButton?: string;
14
- itemTitle?: string;
15
- itemText?: string;
16
- itemLink?: string;
17
- };
18
- /** Ссылка на корневой элемент */
19
- rootRef?: React.Ref<HTMLDivElement>;
20
- /** Индекс активного шага */
21
- activeStep?: number;
22
- /** Количество шагов */
23
- stepCount?: number;
24
- /** Шаги */
25
- items?: StepperItemType[];
26
- /** Направление */
27
- isHorizontal?: boolean;
28
- /** Цифры вместо галочек */
29
- isNumeric?: boolean;
30
- /** Отключение кнопок */
31
- isDisabled?: boolean;
32
- /** Все шаги пройдены */
33
- isAllChecked?: boolean;
34
- /** Отображение контента только активного шага */
35
- showActiveStepContent?: boolean;
36
- /** Выравнивание */
37
- align?: 'center' | 'left';
38
- /** Дополнительные data атрибуты к внутренним элементам */
39
- dataAttrs?: {
40
- root?: Record<string, string>;
41
- itemsWrap?: Record<string, string>;
42
- item?: Record<string, string>;
43
- itemIconButton?: Record<string, string>;
44
- itemTitle?: Record<string, string>;
45
- itemText?: Record<string, string>;
46
- itemLink?: Record<string, string>;
47
- };
48
- /** Обработчик события смены шага */
49
- onChange?: (index: number) => void;
50
- }
51
- declare const Stepper: React.FC<IStepperProps>;
52
- export default Stepper;
@@ -1,168 +0,0 @@
1
- "use strict";
2
-
3
- function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
4
- Object.defineProperty(exports, "__esModule", {
5
- value: true
6
- });
7
- exports["default"] = void 0;
8
- var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
9
- var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
10
- require("core-js/modules/es.array.from.js");
11
- require("core-js/modules/es.array.map.js");
12
- require("core-js/modules/es.string.iterator.js");
13
- var React = _interopRequireWildcard(require("react"));
14
- var _uiHelpers = require("@megafon/ui-helpers");
15
- var _StepperItem = _interopRequireWildcard(require("./StepperItem"));
16
- function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
17
- function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { "default": e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n["default"] = e, t && t.set(e, n), n; }
18
- function _interopRequireDefault(e) { return e && e.__esModule ? e : { "default": e }; }
19
- var CheckedIcon = function CheckedIcon(props) {
20
- return /*#__PURE__*/React.createElement("svg", (0, _extends2["default"])({
21
- viewBox: "0 0 20 20"
22
- }, props), /*#__PURE__*/React.createElement("path", {
23
- d: "M8.832 11.547L6.619 9.335l-1.414 1.413 2.462 2.462 1.445 1.446 5.932-8.486-1.638-1.148-4.574 6.525z"
24
- }));
25
- };
26
- var cn = (0, _uiHelpers.cnCreate)('mfui-9-stepper');
27
- var Stepper = function Stepper(_ref) {
28
- var className = _ref.className,
29
- _ref$classes = _ref.classes,
30
- _ref$classes2 = _ref$classes === void 0 ? {} : _ref$classes,
31
- rootClassName = _ref$classes2.root,
32
- itemsWrapClassName = _ref$classes2.itemsWrap,
33
- itemClassName = _ref$classes2.item,
34
- itemIconButtonClassName = _ref$classes2.itemIconButton,
35
- itemTitleClassName = _ref$classes2.itemTitle,
36
- itemTextClassname = _ref$classes2.itemText,
37
- itemLinkClassName = _ref$classes2.itemLink,
38
- rootRef = _ref.rootRef,
39
- _ref$activeStep = _ref.activeStep,
40
- activeStep = _ref$activeStep === void 0 ? 0 : _ref$activeStep,
41
- _ref$stepCount = _ref.stepCount,
42
- stepCount = _ref$stepCount === void 0 ? 2 : _ref$stepCount,
43
- _ref$items = _ref.items,
44
- items = _ref$items === void 0 ? [] : _ref$items,
45
- _ref$isHorizontal = _ref.isHorizontal,
46
- isHorizontal = _ref$isHorizontal === void 0 ? true : _ref$isHorizontal,
47
- isNumeric = _ref.isNumeric,
48
- isDisabled = _ref.isDisabled,
49
- isAllChecked = _ref.isAllChecked,
50
- _ref$showActiveStepCo = _ref.showActiveStepContent,
51
- showActiveStepContent = _ref$showActiveStepCo === void 0 ? false : _ref$showActiveStepCo,
52
- _ref$align = _ref.align,
53
- align = _ref$align === void 0 ? 'center' : _ref$align,
54
- _ref$dataAttrs = _ref.dataAttrs,
55
- _ref$dataAttrs2 = _ref$dataAttrs === void 0 ? {} : _ref$dataAttrs,
56
- rootAttrs = _ref$dataAttrs2.root,
57
- itemsWrapAttrs = _ref$dataAttrs2.itemsWrap,
58
- itemAttrs = _ref$dataAttrs2.item,
59
- itemIconButtonAttrs = _ref$dataAttrs2.itemIconButton,
60
- itemTitleAttrs = _ref$dataAttrs2.itemTitle,
61
- itemTextAttrs = _ref$dataAttrs2.itemText,
62
- itemLinkAttrs = _ref$dataAttrs2.itemLink,
63
- _ref$onChange = _ref.onChange,
64
- onChange = _ref$onChange === void 0 ? function () {
65
- return null;
66
- } : _ref$onChange;
67
- var _React$useState = React.useState(activeStep),
68
- _React$useState2 = (0, _slicedToArray2["default"])(_React$useState, 2),
69
- currentIndex = _React$useState2[0],
70
- setCurrentIndex = _React$useState2[1];
71
- var hasCustomItems = !!items.length;
72
- var isHorizontalContent = isHorizontal || showActiveStepContent;
73
- var currentItems = hasCustomItems ? items : Array.from({
74
- length: stepCount
75
- });
76
- var isCorrectDisabled = React.useMemo(function () {
77
- return !!isAllChecked || !!isDisabled;
78
- }, [isAllChecked, isDisabled]);
79
- var defineItemTheme = React.useCallback(function (index) {
80
- switch (true) {
81
- case isAllChecked:
82
- case index < currentIndex:
83
- {
84
- return _StepperItem.STEPPER_ITEM_THEME_ENUM.CHECKED;
85
- }
86
- case index === currentIndex:
87
- {
88
- return _StepperItem.STEPPER_ITEM_THEME_ENUM.ACTIVE;
89
- }
90
- default:
91
- {
92
- return _StepperItem.STEPPER_ITEM_THEME_ENUM.DEFAULT;
93
- }
94
- }
95
- }, [currentIndex, isAllChecked]);
96
- var handleClickItem = React.useCallback(function (index) {
97
- return function () {
98
- if (isCorrectDisabled) {
99
- return;
100
- }
101
- setCurrentIndex(index);
102
- onChange(index);
103
- };
104
- }, [isCorrectDisabled, onChange]);
105
- React.useEffect(function () {
106
- if (activeStep === undefined) {
107
- return;
108
- }
109
- setCurrentIndex(activeStep);
110
- }, [activeStep]);
111
- var renderIcon = React.useCallback(function (index, theme) {
112
- var isChecked = theme === _StepperItem.STEPPER_ITEM_THEME_ENUM.CHECKED;
113
- if (isNumeric || !isChecked) {
114
- return index + 1;
115
- }
116
- return /*#__PURE__*/React.createElement(CheckedIcon, null);
117
- }, [isNumeric]);
118
- var renderItem = React.useCallback(function (props, index) {
119
- return /*#__PURE__*/React.createElement(_StepperItem["default"], (0, _extends2["default"])({}, props, {
120
- key: index,
121
- className: itemClassName,
122
- classes: {
123
- iconButton: itemIconButtonClassName,
124
- title: itemTitleClassName,
125
- text: itemTextClassname,
126
- link: itemLinkClassName
127
- },
128
- dataAttrs: {
129
- root: itemAttrs,
130
- iconButton: itemIconButtonAttrs,
131
- title: itemTitleAttrs,
132
- text: itemTextAttrs,
133
- link: itemLinkAttrs
134
- }
135
- }));
136
- }, [itemAttrs, itemIconButtonAttrs, itemIconButtonClassName, itemClassName, itemLinkAttrs, itemLinkClassName, itemTextAttrs, itemTextClassname, itemTitleAttrs, itemTitleClassName]);
137
- var renderItems = React.useMemo(function () {
138
- return currentItems.map(function (elem, i) {
139
- var item = elem || {};
140
- var itemTheme = defineItemTheme(i);
141
- var itemIcon = item.icon || renderIcon(i, itemTheme);
142
- return renderItem((0, _extends2["default"])((0, _extends2["default"])({}, item), {
143
- icon: itemIcon,
144
- hasSeparator: i < currentItems.length - 1,
145
- isHorizontal: isHorizontalContent,
146
- isDisabled: isCorrectDisabled,
147
- align: align,
148
- theme: itemTheme,
149
- view: showActiveStepContent ? _StepperItem.STEPPER_ITEM_VIEW_ENUM.ICON : _StepperItem.STEPPER_ITEM_VIEW_ENUM.DEFAULT,
150
- onClick: handleClickItem(i)
151
- }), i);
152
- });
153
- }, [align, currentItems, isCorrectDisabled, showActiveStepContent, isHorizontalContent, defineItemTheme, handleClickItem, renderIcon, renderItem]);
154
- var renderSingleItem = renderItem((0, _extends2["default"])((0, _extends2["default"])({}, currentItems[currentIndex]), {
155
- isDisabled: isCorrectDisabled,
156
- align: align,
157
- view: _StepperItem.STEPPER_ITEM_VIEW_ENUM.CONTENT
158
- }));
159
- return /*#__PURE__*/React.createElement("div", (0, _extends2["default"])({}, (0, _uiHelpers.filterDataAttrs)(rootAttrs), {
160
- className: cn([className, rootClassName], {
161
- 'is-horizontal': isHorizontalContent
162
- }),
163
- ref: rootRef
164
- }), /*#__PURE__*/React.createElement("div", (0, _extends2["default"])({}, (0, _uiHelpers.filterDataAttrs)(itemsWrapAttrs), {
165
- className: cn('items-wrap', [itemsWrapClassName])
166
- }), renderItems), showActiveStepContent && renderSingleItem);
167
- };
168
- var _default = exports["default"] = Stepper;
@@ -1 +0,0 @@
1
- h1,h2,h3,h4,h5{margin:0}.mfui-9-stepper-item{display:-webkit-box;display:-ms-flexbox;display:flex;position:relative;-webkit-box-flex:1;-ms-flex:1 1 auto;flex:1 1 auto;-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-direction:row;flex-direction:row;gap:16px}.mfui-9-stepper-item_is-horizontal{-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;-webkit-box-align:center;-ms-flex-align:center;align-items:center}.mfui-9-stepper-item_is-horizontal .mfui-9-stepper-item__separator{-o-border-image:url(img/separator-mobile.png) 2 round;border-image:url(img/separator-mobile.png) 2 round;border-left:none;border-radius:100px;border-top:2px solid transparent;height:2px;left:calc(50% + 22px);min-height:2px;position:absolute;top:19px;width:calc(100% - 32px)}@media screen and (min-width:768px){.mfui-9-stepper-item_is-horizontal .mfui-9-stepper-item__separator{-o-border-image:url(img/separator.png) 2 repeat;border-image:url(img/separator.png) 2 repeat}}@media screen and (min-width:1024px){.mfui-9-stepper-item_is-horizontal .mfui-9-stepper-item__separator{left:calc(50% + 32px);width:calc(100% - 52px)}}.mfui-9-stepper-item_theme_active .mfui-9-stepper-item__icon-button{background-color:var(--night20)}.mfui-9-stepper-item_theme_active .mfui-9-stepper-item__icon{background-color:var(--night)}.mfui-9-stepper-item_theme_checked .mfui-9-stepper-item__icon-button{background-color:var(--brandGreen20)}.mfui-9-stepper-item_theme_checked .mfui-9-stepper-item__icon{background-color:var(--brandGreen)}.mfui-9-stepper-item_theme_checked .mfui-9-stepper-item__separator{border-color:var(--brandGreen);-o-border-image:none;border-image:none}.mfui-9-stepper-item_align_left{-webkit-box-align:start;-ms-flex-align:start;align-items:flex-start}.mfui-9-stepper-item_align_left .mfui-9-stepper-item__separator{left:42px;right:0}@media screen and (min-width:1024px){.mfui-9-stepper-item_align_left .mfui-9-stepper-item__separator{left:auto}}.mfui-9-stepper-item_align_left .mfui-9-stepper-item__content,.mfui-9-stepper-item_align_left .mfui-9-stepper-item__icon-button-area{-webkit-box-align:start;-ms-flex-align:start;align-items:flex-start}.mfui-9-stepper-item__icon-button-area{-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;gap:12px;-ms-flex-align:center;-ms-flex-item-align:stretch;align-self:stretch}.mfui-9-stepper-item__icon-button,.mfui-9-stepper-item__icon-button-area{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;align-items:center}.mfui-9-stepper-item__icon-button{-webkit-box-flex:0;-ms-flex:0 0 auto;flex:0 0 auto;-ms-flex-align:center;-webkit-box-pack:center;-ms-flex-pack:center;background-color:var(--spbSky0);border:none;border-radius:100%;-webkit-box-sizing:border-box;box-sizing:border-box;cursor:pointer;height:40px;justify-content:center;outline:none;-webkit-transition:background-color .25s ease-out;transition:background-color .25s ease-out;width:40px}.mfui-9-stepper-item__icon-button:disabled{cursor:default}.mfui-9-stepper-item__icon{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;background-color:var(--spbSky2);border-radius:100%;color:var(--stcWhite);font-weight:500;height:24px;justify-content:center;-webkit-transition:background-color .25s ease-out;transition:background-color .25s ease-out;width:24px}.mfui-9-stepper-item__icon svg{height:20px;width:20px;fill:var(--stcWhite)}.mfui-9-stepper-item__separator{-o-border-image:url(img/separator-vertical.png) 2 repeat;border-image:url(img/separator-vertical.png) 2 repeat;border-left:2px solid transparent;border-top:none;height:100%;min-height:20px;position:static;-webkit-transition:border-color .25s ease-out;transition:border-color .25s ease-out;width:2px}.mfui-9-stepper-item__content{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;gap:4px;-webkit-box-align:center;-ms-flex-align:center;align-items:center;min-width:160px;padding-bottom:20px}.mfui-9-stepper-item__link{margin-top:13px}
@@ -1,57 +0,0 @@
1
- import * as React from 'react';
2
- import './StepperItem.scss';
3
- export declare enum STEPPER_ITEM_THEME_ENUM {
4
- CHECKED = "checked",
5
- ACTIVE = "active",
6
- DEFAULT = "default"
7
- }
8
- export declare enum STEPPER_ITEM_VIEW_ENUM {
9
- ICON = "icon",
10
- CONTENT = "content",
11
- DEFAULT = "default"
12
- }
13
- export interface IStepperItemProps {
14
- /** Дополнительный класс корневого элемента */
15
- className?: string;
16
- /** Дополнительные классы элементов */
17
- classes?: {
18
- iconButton?: string;
19
- title?: string;
20
- text?: string;
21
- link?: string;
22
- };
23
- /** Тема */
24
- theme?: STEPPER_ITEM_THEME_ENUM;
25
- /** Заголовок */
26
- title?: string;
27
- /** Текст */
28
- text?: string;
29
- /** Текст ссылки */
30
- linkText?: string;
31
- /** Адрес ссылки */
32
- linkUrl?: string;
33
- /** Иконка */
34
- icon?: string | number | JSX.Element;
35
- /** Наличие разделителя */
36
- hasSeparator?: boolean;
37
- /** Направление */
38
- isHorizontal?: boolean;
39
- /** Отключение */
40
- isDisabled?: boolean;
41
- /** Выравнивание */
42
- align?: 'center' | 'left';
43
- /** Варианты отображения */
44
- view?: STEPPER_ITEM_VIEW_ENUM;
45
- /** Дополнительные data атрибуты к внутренним элементам */
46
- dataAttrs?: {
47
- root?: Record<string, string>;
48
- iconButton?: Record<string, string>;
49
- title?: Record<string, string>;
50
- text?: Record<string, string>;
51
- link?: Record<string, string>;
52
- };
53
- /** Обработчик события клика */
54
- onClick?: () => void;
55
- }
56
- declare const StepperItem: React.FC<IStepperItemProps>;
57
- export default StepperItem;
@@ -1,108 +0,0 @@
1
- "use strict";
2
-
3
- function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
4
- Object.defineProperty(exports, "__esModule", {
5
- value: true
6
- });
7
- exports["default"] = exports.STEPPER_ITEM_VIEW_ENUM = exports.STEPPER_ITEM_THEME_ENUM = void 0;
8
- var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
9
- require("core-js/modules/es.string.link.js");
10
- var React = _interopRequireWildcard(require("react"));
11
- var _uiCore = require("@megafon/ui-core");
12
- var _uiHelpers = require("@megafon/ui-helpers");
13
- function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
14
- function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { "default": e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n["default"] = e, t && t.set(e, n), n; }
15
- function _interopRequireDefault(e) { return e && e.__esModule ? e : { "default": e }; }
16
- var STEPPER_ITEM_THEME_ENUM;
17
- (function (STEPPER_ITEM_THEME_ENUM) {
18
- STEPPER_ITEM_THEME_ENUM["CHECKED"] = "checked";
19
- STEPPER_ITEM_THEME_ENUM["ACTIVE"] = "active";
20
- STEPPER_ITEM_THEME_ENUM["DEFAULT"] = "default";
21
- })(STEPPER_ITEM_THEME_ENUM || (exports.STEPPER_ITEM_THEME_ENUM = STEPPER_ITEM_THEME_ENUM = {}));
22
- var STEPPER_ITEM_VIEW_ENUM;
23
- (function (STEPPER_ITEM_VIEW_ENUM) {
24
- STEPPER_ITEM_VIEW_ENUM["ICON"] = "icon";
25
- STEPPER_ITEM_VIEW_ENUM["CONTENT"] = "content";
26
- STEPPER_ITEM_VIEW_ENUM["DEFAULT"] = "default";
27
- })(STEPPER_ITEM_VIEW_ENUM || (exports.STEPPER_ITEM_VIEW_ENUM = STEPPER_ITEM_VIEW_ENUM = {}));
28
- var cn = (0, _uiHelpers.cnCreate)('mfui-9-stepper-item');
29
- var StepperItem = function StepperItem(_ref) {
30
- var className = _ref.className,
31
- _ref$classes = _ref.classes,
32
- _ref$classes2 = _ref$classes === void 0 ? {} : _ref$classes,
33
- iconButtonClassName = _ref$classes2.iconButton,
34
- titleClassName = _ref$classes2.title,
35
- textClassName = _ref$classes2.text,
36
- linkClassName = _ref$classes2.link,
37
- _ref$theme = _ref.theme,
38
- theme = _ref$theme === void 0 ? STEPPER_ITEM_THEME_ENUM.DEFAULT : _ref$theme,
39
- title = _ref.title,
40
- text = _ref.text,
41
- linkText = _ref.linkText,
42
- linkUrl = _ref.linkUrl,
43
- icon = _ref.icon,
44
- hasSeparator = _ref.hasSeparator,
45
- _ref$isHorizontal = _ref.isHorizontal,
46
- isHorizontal = _ref$isHorizontal === void 0 ? true : _ref$isHorizontal,
47
- isDisabled = _ref.isDisabled,
48
- _ref$align = _ref.align,
49
- align = _ref$align === void 0 ? 'center' : _ref$align,
50
- _ref$view = _ref.view,
51
- view = _ref$view === void 0 ? STEPPER_ITEM_VIEW_ENUM.DEFAULT : _ref$view,
52
- _ref$dataAttrs = _ref.dataAttrs,
53
- _ref$dataAttrs2 = _ref$dataAttrs === void 0 ? {} : _ref$dataAttrs,
54
- rootAttrs = _ref$dataAttrs2.root,
55
- iconButtonAttrs = _ref$dataAttrs2.iconButton,
56
- titleAttrs = _ref$dataAttrs2.title,
57
- textAttrs = _ref$dataAttrs2.text,
58
- linkAttrs = _ref$dataAttrs2.link,
59
- onClick = _ref.onClick;
60
- var hasLink = !!linkText && !!linkUrl;
61
- var hasContent = !!title || !!text || hasLink;
62
- var showContent = view !== STEPPER_ITEM_VIEW_ENUM.ICON && hasContent;
63
- var showIcon = view !== STEPPER_ITEM_VIEW_ENUM.CONTENT;
64
- var renderContent = /*#__PURE__*/React.createElement("div", {
65
- className: cn('content')
66
- }, title && /*#__PURE__*/React.createElement(_uiCore.Header, {
67
- className: cn([titleClassName]),
68
- dataAttrs: {
69
- root: titleAttrs
70
- },
71
- as: "h5",
72
- align: align
73
- }, title), text && /*#__PURE__*/React.createElement(_uiCore.Paragraph, {
74
- className: cn([textClassName]),
75
- dataAttrs: {
76
- root: textAttrs
77
- },
78
- hasMargin: false,
79
- align: align
80
- }, text), hasLink && /*#__PURE__*/React.createElement(_uiCore.Button, {
81
- className: cn('link', [linkClassName]),
82
- dataAttrs: {
83
- root: linkAttrs
84
- },
85
- href: linkUrl,
86
- type: "text",
87
- sizeAll: "extra-small"
88
- }, linkText));
89
- return /*#__PURE__*/React.createElement("div", (0, _extends2["default"])({}, (0, _uiHelpers.filterDataAttrs)(rootAttrs), {
90
- className: cn([className], {
91
- theme: theme,
92
- align: align,
93
- 'is-horizontal': isHorizontal
94
- })
95
- }), showIcon && /*#__PURE__*/React.createElement("div", {
96
- className: cn('icon-button-area')
97
- }, /*#__PURE__*/React.createElement("button", (0, _extends2["default"])({}, (0, _uiHelpers.filterDataAttrs)(iconButtonAttrs), {
98
- className: cn('icon-button', [iconButtonClassName]),
99
- type: "button",
100
- disabled: isDisabled,
101
- onClick: onClick
102
- }), /*#__PURE__*/React.createElement("span", {
103
- className: cn('icon')
104
- }, icon)), hasSeparator && /*#__PURE__*/React.createElement("span", {
105
- className: cn('separator')
106
- })), showContent && renderContent);
107
- };
108
- var _default = exports["default"] = StepperItem;