@sima-land/ui-nucleons 45.0.0-alpha.4 → 45.0.0-alpha.5

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 (190) hide show
  1. package/_internal/custom-scrollbar/index.js +5 -27
  2. package/_internal/dropdown-loading/index.js +2 -3
  3. package/_internal/page-scroll-lock/context.js +3 -25
  4. package/alert/index.d.ts +2 -2
  5. package/alert/index.js +4 -30
  6. package/arrow-button/index.js +18 -19
  7. package/autocomplete/autocomplete.js +49 -76
  8. package/autocomplete-deprecated/index.d.ts +1 -1
  9. package/autocomplete-deprecated/index.js +43 -67
  10. package/avatar/avatar.module.scss +3 -1
  11. package/avatar/index.d.ts +1 -1
  12. package/avatar/index.js +7 -33
  13. package/avatar/user.d.ts +1 -1
  14. package/avatar/user.js +8 -29
  15. package/base-input/base-input.js +5 -31
  16. package/base-input-deprecated/index.d.ts +2 -2
  17. package/base-input-deprecated/index.js +8 -34
  18. package/bordered-layout/index.d.ts +1 -1
  19. package/bordered-layout/index.js +2 -3
  20. package/bottom-bar/bottom-bar.js +2 -3
  21. package/box/index.d.ts +1 -1
  22. package/box/index.js +2 -2
  23. package/button/index.d.ts +2 -2
  24. package/button/index.js +6 -32
  25. package/card/index.js +2 -8
  26. package/card/slots.d.ts +1 -1
  27. package/card/slots.js +9 -31
  28. package/carousel/draggable.d.ts +1 -1
  29. package/carousel/draggable.js +5 -28
  30. package/carousel/index.d.ts +1 -1
  31. package/carousel/index.js +17 -43
  32. package/checkbox/index.d.ts +2 -2
  33. package/checkbox/index.js +3 -29
  34. package/checkbox-field/index.d.ts +2 -2
  35. package/checkbox-field/index.js +3 -31
  36. package/chips/index.d.ts +1 -1
  37. package/chips/index.js +3 -25
  38. package/chips/item.d.ts +1 -1
  39. package/chips/item.js +3 -5
  40. package/clean-buttons/index.js +6 -28
  41. package/dot-nav/index.d.ts +1 -1
  42. package/dot-nav/index.js +12 -34
  43. package/dropdown/index.d.ts +2 -2
  44. package/dropdown/index.js +3 -26
  45. package/dropdown-item/index.d.ts +1 -1
  46. package/dropdown-item/index.js +4 -9
  47. package/expandable/index.d.ts +2 -2
  48. package/expandable/index.js +8 -36
  49. package/field-block/index.js +2 -9
  50. package/field-grid/index.d.ts +1 -1
  51. package/field-grid/index.js +43 -65
  52. package/file-icon/index.d.ts +1 -1
  53. package/file-icon/index.js +5 -10
  54. package/group-overflow/index.js +6 -30
  55. package/helpers/define-slots.d.ts +1 -1
  56. package/helpers/events.d.ts +1 -1
  57. package/helpers/on.d.ts +1 -1
  58. package/hint/hint-view.js +3 -3
  59. package/hint/hint.js +3 -8
  60. package/hint-deprecated/index.d.ts +2 -2
  61. package/hint-deprecated/index.js +3 -26
  62. package/hooks/breakpoint/index.js +3 -25
  63. package/info-text/index.js +15 -42
  64. package/input/index.js +8 -30
  65. package/layout/layout.js +2 -2
  66. package/layout/legacy.d.ts +5 -5
  67. package/layout/legacy.js +3 -25
  68. package/link/index.d.ts +6 -3
  69. package/link/index.js +3 -25
  70. package/loading-overlay/index.d.ts +1 -1
  71. package/loading-overlay/index.js +2 -3
  72. package/masked-field/index.d.ts +2 -2
  73. package/masked-field/index.js +3 -25
  74. package/masked-input/masked-input.js +3 -25
  75. package/modal/index.d.ts +1 -1
  76. package/modal/index.js +3 -10
  77. package/modal/slots.js +6 -29
  78. package/modal-overlay/index.js +3 -26
  79. package/no-index/index.d.ts +3 -3
  80. package/no-index/index.js +4 -8
  81. package/no-index-mark/index.d.ts +2 -2
  82. package/no-index-mark/index.js +7 -6
  83. package/package.json +6 -11
  84. package/pagination/index.d.ts +4 -20
  85. package/pagination/index.js +8 -15
  86. package/pagination/pagination-item.d.ts +8 -0
  87. package/pagination/pagination-item.js +31 -0
  88. package/pagination/pagination-item.module.scss +49 -0
  89. package/pagination/pagination.d.ts +8 -0
  90. package/pagination/pagination.js +78 -0
  91. package/pagination/pagination.module.scss +14 -70
  92. package/pagination/types.d.ts +28 -0
  93. package/pagination/types.js +2 -0
  94. package/pagination/utils.d.ts +15 -43
  95. package/pagination/utils.js +38 -87
  96. package/{pagination → pagination-deprecated}/base-pagination.d.ts +6 -1
  97. package/{pagination → pagination-deprecated}/base-pagination.js +33 -33
  98. package/pagination-deprecated/index.d.ts +22 -0
  99. package/pagination-deprecated/index.js +15 -0
  100. package/{pagination → pagination-deprecated}/page-button.d.ts +2 -1
  101. package/{pagination → pagination-deprecated}/page-button.js +3 -5
  102. package/pagination-deprecated/pagination.module.scss +76 -0
  103. package/pagination-deprecated/utils.d.ts +58 -0
  104. package/pagination-deprecated/utils.js +124 -0
  105. package/panel/index.js +3 -6
  106. package/phone-input/images/armenia.png +0 -0
  107. package/phone-input/images/azerbaijan.png +0 -0
  108. package/phone-input/images/belarus.png +0 -0
  109. package/phone-input/images/georgia.png +0 -0
  110. package/phone-input/images/kazakhstan.png +0 -0
  111. package/phone-input/images/kyrgyzstan.png +0 -0
  112. package/phone-input/images/moldova.png +0 -0
  113. package/phone-input/images/other.png +0 -0
  114. package/phone-input/images/russia.png +0 -0
  115. package/phone-input/images/tajikistan.png +0 -0
  116. package/phone-input/images/turkmenistan.png +0 -0
  117. package/phone-input/images/ukraine.png +0 -0
  118. package/phone-input/images/uzbekistan.png +0 -0
  119. package/phone-input/phone-input.js +13 -37
  120. package/phone-input/presets.js +2 -0
  121. package/phone-input-deprecated/index.d.ts +1 -1
  122. package/phone-input-deprecated/index.js +31 -57
  123. package/plate/index.d.ts +2 -2
  124. package/plate/index.js +3 -25
  125. package/popup/popup-view.js +3 -6
  126. package/popup/popup.js +4 -26
  127. package/portal/index.d.ts +1 -1
  128. package/price/index.js +2 -2
  129. package/radio-button/index.js +2 -4
  130. package/range/index.d.ts +1 -1
  131. package/range/index.js +6 -33
  132. package/rating/index.d.ts +1 -1
  133. package/rating/index.js +4 -9
  134. package/readme.md +4 -67
  135. package/screen/index.d.ts +5 -5
  136. package/screen/index.js +11 -37
  137. package/screen/slots.d.ts +3 -3
  138. package/screen/slots.js +9 -31
  139. package/select/parts/block.js +6 -28
  140. package/select/parts/button.js +7 -29
  141. package/select/parts/menu.js +12 -33
  142. package/select/select.js +4 -28
  143. package/select-deprecated/index.d.ts +1 -1
  144. package/select-deprecated/index.js +32 -56
  145. package/side-page/index.js +4 -30
  146. package/side-page/slots.js +4 -4
  147. package/spinner/index.d.ts +1 -1
  148. package/spinner/index.js +3 -5
  149. package/spinner/spinner.module.scss +3 -1
  150. package/stepper/index.d.ts +2 -2
  151. package/stepper/index.js +11 -38
  152. package/stroked-svg/index.d.ts +2 -2
  153. package/stroked-svg/index.js +3 -27
  154. package/styling/sizes.module.scss +3 -1
  155. package/super-ellipse-clip-path/index.js +2 -8
  156. package/switcher-row/index.js +5 -10
  157. package/tabs/index.d.ts +1 -1
  158. package/tabs/index.js +4 -26
  159. package/text/index.d.ts +2 -2
  160. package/text/index.js +3 -25
  161. package/text-button/index.d.ts +2 -2
  162. package/text-button/index.js +4 -7
  163. package/text-field/index.d.ts +2 -2
  164. package/text-field/index.js +25 -55
  165. package/textarea/index.js +4 -26
  166. package/timer/index.d.ts +1 -1
  167. package/timer/index.js +3 -25
  168. package/toggle/index.d.ts +2 -2
  169. package/toggle/index.js +3 -27
  170. package/tooltip/index.d.ts +2 -2
  171. package/tooltip/index.js +4 -28
  172. package/top-bar/top-bar.js +5 -45
  173. package/top-bar/utils.d.ts +2 -2
  174. package/top-bar/utils.js +6 -28
  175. package/touch-slider/index.d.ts +1 -1
  176. package/touch-slider/index.js +2 -4
  177. package/unknown-content/index.d.ts +1 -1
  178. package/unknown-content/index.js +3 -25
  179. package/upload-area/upload-area.js +8 -38
  180. package/with-hint/index.d.ts +1 -1
  181. package/with-hint/index.js +3 -28
  182. package/with-hint/positioning-hint.d.ts +1 -1
  183. package/with-hint/positioning-hint.js +3 -25
  184. package/with-tooltip/index.d.ts +1 -1
  185. package/with-tooltip/index.js +6 -31
  186. package/with-tooltip/positioning-tooltip.d.ts +1 -1
  187. package/with-tooltip/positioning-tooltip.js +4 -26
  188. package/file-icon/unknown.svg +0 -9
  189. package/rating/star.svg +0 -3
  190. package/upload-area/upload.svg +0 -6
@@ -1,38 +1,16 @@
1
1
  "use strict";
2
- var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
3
- if (k2 === undefined) k2 = k;
4
- var desc = Object.getOwnPropertyDescriptor(m, k);
5
- if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
6
- desc = { enumerable: true, get: function() { return m[k]; } };
7
- }
8
- Object.defineProperty(o, k2, desc);
9
- }) : (function(o, m, k, k2) {
10
- if (k2 === undefined) k2 = k;
11
- o[k2] = m[k];
12
- }));
13
- var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
14
- Object.defineProperty(o, "default", { enumerable: true, value: v });
15
- }) : function(o, v) {
16
- o["default"] = v;
17
- });
18
- var __importStar = (this && this.__importStar) || function (mod) {
19
- if (mod && mod.__esModule) return mod;
20
- var result = {};
21
- if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
22
- __setModuleDefault(result, mod);
23
- return result;
24
- };
25
2
  var __importDefault = (this && this.__importDefault) || function (mod) {
26
3
  return (mod && mod.__esModule) ? mod : { "default": mod };
27
4
  };
28
5
  Object.defineProperty(exports, "__esModule", { value: true });
29
6
  exports.getViewport = exports.useFullScroll = exports.CustomScrollbar = void 0;
30
- const react_1 = __importStar(require("react"));
7
+ const jsx_runtime_1 = require("react/jsx-runtime");
8
+ const react_1 = require("react");
31
9
  const overlayscrollbars_react_1 = require("overlayscrollbars-react");
32
10
  const bind_1 = __importDefault(require("classnames/bind"));
33
11
  const custom_scrollbar_module_scss_1 = __importDefault(require("./custom-scrollbar.module.scss"));
34
- require("overlayscrollbars/css/OverlayScrollbars.css");
35
12
  const identity_1 = require("../../hooks/identity");
13
+ require("overlayscrollbars/css/OverlayScrollbars.css");
36
14
  const cx = bind_1.default.bind(custom_scrollbar_module_scss_1.default);
37
15
  /**
38
16
  * Компонент блока с кастомными полосами прокрутки по гайдам.
@@ -41,10 +19,10 @@ const cx = bind_1.default.bind(custom_scrollbar_module_scss_1.default);
41
19
  */
42
20
  function CustomScrollbar({ osComponentRef, style, className, children, overflow, inFlexBox = false, onFullScroll, fullScrollThreshold, }) {
43
21
  const onScrollStop = useFullScroll(onFullScroll, fullScrollThreshold);
44
- return (react_1.default.createElement(overlayscrollbars_react_1.OverlayScrollbarsComponent, { ref: osComponentRef, style: style, className: cx('custom-scrollbar', className, { 'os-host-flexbox': inFlexBox }), options: {
22
+ return ((0, jsx_runtime_1.jsx)(overlayscrollbars_react_1.OverlayScrollbarsComponent, Object.assign({ ref: osComponentRef, style: style, className: cx('custom-scrollbar', className, { 'os-host-flexbox': inFlexBox }), options: {
45
23
  overflowBehavior: overflow,
46
24
  callbacks: { onScrollStop },
47
- } }, children));
25
+ } }, { children: children })));
48
26
  }
49
27
  exports.CustomScrollbar = CustomScrollbar;
50
28
  /**
@@ -4,7 +4,7 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
4
4
  };
5
5
  Object.defineProperty(exports, "__esModule", { value: true });
6
6
  exports.DropdownLoading = void 0;
7
- const react_1 = __importDefault(require("react"));
7
+ const jsx_runtime_1 = require("react/jsx-runtime");
8
8
  const spinner_1 = require("../../spinner");
9
9
  const index_module_scss_1 = __importDefault(require("./index.module.scss"));
10
10
  /**
@@ -13,7 +13,6 @@ const index_module_scss_1 = __importDefault(require("./index.module.scss"));
13
13
  * @return Элемент.
14
14
  */
15
15
  function DropdownLoading(props) {
16
- return (react_1.default.createElement("div", Object.assign({}, props, { className: index_module_scss_1.default.root }),
17
- react_1.default.createElement(spinner_1.SpinnerSVG, { size: 's' })));
16
+ return ((0, jsx_runtime_1.jsx)("div", Object.assign({}, props, { className: index_module_scss_1.default.root }, { children: (0, jsx_runtime_1.jsx)(spinner_1.SpinnerSVG, { size: 's' }) })));
18
17
  }
19
18
  exports.DropdownLoading = DropdownLoading;
@@ -1,30 +1,8 @@
1
1
  "use strict";
2
- var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
3
- if (k2 === undefined) k2 = k;
4
- var desc = Object.getOwnPropertyDescriptor(m, k);
5
- if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
6
- desc = { enumerable: true, get: function() { return m[k]; } };
7
- }
8
- Object.defineProperty(o, k2, desc);
9
- }) : (function(o, m, k, k2) {
10
- if (k2 === undefined) k2 = k;
11
- o[k2] = m[k];
12
- }));
13
- var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
14
- Object.defineProperty(o, "default", { enumerable: true, value: v });
15
- }) : function(o, v) {
16
- o["default"] = v;
17
- });
18
- var __importStar = (this && this.__importStar) || function (mod) {
19
- if (mod && mod.__esModule) return mod;
20
- var result = {};
21
- if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
22
- __setModuleDefault(result, mod);
23
- return result;
24
- };
25
2
  Object.defineProperty(exports, "__esModule", { value: true });
26
3
  exports.usePageScrollContext = exports.PageScrollProvider = void 0;
27
- const react_1 = __importStar(require("react"));
4
+ const jsx_runtime_1 = require("react/jsx-runtime");
5
+ const react_1 = require("react");
28
6
  const body_scroll_lock_1 = require("./adapters/body-scroll-lock");
29
7
  const PageScrollContext = (0, react_1.createContext)(null);
30
8
  const DEFAULTS = {
@@ -40,7 +18,7 @@ function PageScrollProvider({ children, adapter }) {
40
18
  if (contextValue !== null) {
41
19
  throw Error('PageScrollContext: only one provider allowed in jsx tree');
42
20
  }
43
- return react_1.default.createElement(PageScrollContext.Provider, { value: { adapter } }, children);
21
+ return (0, jsx_runtime_1.jsx)(PageScrollContext.Provider, Object.assign({ value: { adapter } }, { children: children }));
44
22
  }
45
23
  exports.PageScrollProvider = PageScrollProvider;
46
24
  /**
package/alert/index.d.ts CHANGED
@@ -1,9 +1,9 @@
1
- import React from 'react';
1
+ import { ReactNode } from 'react';
2
2
  import { WithPageScrollLock } from '../_internal/page-scroll-lock';
3
3
  import { CardContentProps } from '../card/slots';
4
4
  export interface AlertProps extends WithPageScrollLock {
5
5
  /** Основное содержимое. */
6
- children?: React.ReactNode;
6
+ children?: ReactNode;
7
7
  /** Будет вызвана при закрытии окна нажатием на затемнение. */
8
8
  onClose?: VoidFunction;
9
9
  }
package/alert/index.js CHANGED
@@ -1,33 +1,11 @@
1
1
  "use strict";
2
- var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
3
- if (k2 === undefined) k2 = k;
4
- var desc = Object.getOwnPropertyDescriptor(m, k);
5
- if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
6
- desc = { enumerable: true, get: function() { return m[k]; } };
7
- }
8
- Object.defineProperty(o, k2, desc);
9
- }) : (function(o, m, k, k2) {
10
- if (k2 === undefined) k2 = k;
11
- o[k2] = m[k];
12
- }));
13
- var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
14
- Object.defineProperty(o, "default", { enumerable: true, value: v });
15
- }) : function(o, v) {
16
- o["default"] = v;
17
- });
18
- var __importStar = (this && this.__importStar) || function (mod) {
19
- if (mod && mod.__esModule) return mod;
20
- var result = {};
21
- if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
22
- __setModuleDefault(result, mod);
23
- return result;
24
- };
25
2
  var __importDefault = (this && this.__importDefault) || function (mod) {
26
3
  return (mod && mod.__esModule) ? mod : { "default": mod };
27
4
  };
28
5
  Object.defineProperty(exports, "__esModule", { value: true });
29
6
  exports.AlertBody = exports.Alert = void 0;
30
- const react_1 = __importStar(require("react"));
7
+ const jsx_runtime_1 = require("react/jsx-runtime");
8
+ const react_1 = require("react");
31
9
  const page_scroll_lock_1 = require("../_internal/page-scroll-lock");
32
10
  const modal_overlay_1 = require("../modal-overlay");
33
11
  const card_1 = require("../card");
@@ -53,11 +31,7 @@ function Alert({ children, withScrollDisable = false, scrollDisableOptions, onCl
53
31
  });
54
32
  const overlayClickBind = (0, utils_1.useExactClick)(onClose);
55
33
  (0, react_1.useImperativeHandle)(body === null || body === void 0 ? void 0 : body.props.scrollableRef, () => scrollableRef.current);
56
- return (react_1.default.createElement(modal_overlay_1.ModalOverlay, Object.assign({ className: alert_module_scss_1.default.overlay }, overlayClickBind),
57
- react_1.default.createElement(card_1.Card, { shadow: 'z4', rounds: 'm', className: cx('alert'), "data-testid": 'alert' },
58
- topBar && react_1.default.createElement(top_bar_1.TopBar, Object.assign({}, topBar.props, { size: 's' })),
59
- body && (react_1.default.createElement(card_1.CardContent, Object.assign({}, body.props, { scrollableRef: scrollableRef }), body)),
60
- bottomBar && react_1.default.createElement(bottom_bar_1.BottomBar, Object.assign({}, bottomBar.props, { size: 's' })))));
34
+ return ((0, jsx_runtime_1.jsx)(modal_overlay_1.ModalOverlay, Object.assign({ className: alert_module_scss_1.default.overlay }, overlayClickBind, { children: (0, jsx_runtime_1.jsxs)(card_1.Card, Object.assign({ shadow: 'z4', rounds: 'm', className: cx('alert'), "data-testid": 'alert' }, { children: [topBar && (0, jsx_runtime_1.jsx)(top_bar_1.TopBar, Object.assign({ size: 's' }, topBar.props)), body && ((0, jsx_runtime_1.jsx)(card_1.CardContent, Object.assign({}, body.props, { scrollableRef: scrollableRef }, { children: body }))), bottomBar && (0, jsx_runtime_1.jsx)(bottom_bar_1.BottomBar, Object.assign({ size: 's' }, bottomBar.props))] })) })));
61
35
  }
62
36
  exports.Alert = Alert;
63
37
  /**
@@ -66,6 +40,6 @@ exports.Alert = Alert;
66
40
  * @return Элемент.
67
41
  */
68
42
  function AlertBody({ children }) {
69
- return react_1.default.createElement(react_1.default.Fragment, null, children);
43
+ return (0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: children });
70
44
  }
71
45
  exports.AlertBody = AlertBody;
@@ -15,30 +15,30 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
15
15
  };
16
16
  Object.defineProperty(exports, "__esModule", { value: true });
17
17
  exports.ArrowButton = void 0;
18
- const react_1 = __importDefault(require("react"));
18
+ const jsx_runtime_1 = require("react/jsx-runtime");
19
19
  const bind_1 = __importDefault(require("classnames/bind"));
20
20
  const arrow_button_module_scss_1 = __importDefault(require("./arrow-button.module.scss"));
21
- const arrow_up_1 = __importDefault(require("@sima-land/ui-quarks/icons/24x24/Stroked/arrow-up"));
22
- const arrow_right_1 = __importDefault(require("@sima-land/ui-quarks/icons/24x24/Stroked/arrow-right"));
23
- const arrow_down_1 = __importDefault(require("@sima-land/ui-quarks/icons/24x24/Stroked/arrow-down"));
24
- const arrow_left_1 = __importDefault(require("@sima-land/ui-quarks/icons/24x24/Stroked/arrow-left"));
25
- const arrow_up_2 = __importDefault(require("@sima-land/ui-quarks/icons/16x16/Stroked/arrow-up"));
26
- const arrow_right_2 = __importDefault(require("@sima-land/ui-quarks/icons/16x16/Stroked/arrow-right"));
27
- const arrow_down_2 = __importDefault(require("@sima-land/ui-quarks/icons/16x16/Stroked/arrow-down"));
28
- const arrow_left_2 = __importDefault(require("@sima-land/ui-quarks/icons/16x16/Stroked/arrow-left"));
21
+ const ArrowUp_1 = __importDefault(require("@sima-land/ui-quarks/icons/24x24/Stroked/ArrowUp"));
22
+ const ArrowRight_1 = __importDefault(require("@sima-land/ui-quarks/icons/24x24/Stroked/ArrowRight"));
23
+ const ArrowDown_1 = __importDefault(require("@sima-land/ui-quarks/icons/24x24/Stroked/ArrowDown"));
24
+ const ArrowLeft_1 = __importDefault(require("@sima-land/ui-quarks/icons/24x24/Stroked/ArrowLeft"));
25
+ const ArrowUp_2 = __importDefault(require("@sima-land/ui-quarks/icons/16x16/Stroked/ArrowUp"));
26
+ const ArrowRight_2 = __importDefault(require("@sima-land/ui-quarks/icons/16x16/Stroked/ArrowRight"));
27
+ const ArrowDown_2 = __importDefault(require("@sima-land/ui-quarks/icons/16x16/Stroked/ArrowDown"));
28
+ const ArrowLeft_2 = __importDefault(require("@sima-land/ui-quarks/icons/16x16/Stroked/ArrowLeft"));
29
29
  const cx = bind_1.default.bind(arrow_button_module_scss_1.default);
30
30
  const ICONS = {
31
31
  s: {
32
- up: arrow_up_2.default,
33
- right: arrow_right_2.default,
34
- down: arrow_down_2.default,
35
- left: arrow_left_2.default,
32
+ up: ArrowUp_2.default,
33
+ right: ArrowRight_2.default,
34
+ down: ArrowDown_2.default,
35
+ left: ArrowLeft_2.default,
36
36
  },
37
37
  l: {
38
- up: arrow_up_1.default,
39
- right: arrow_right_1.default,
40
- down: arrow_down_1.default,
41
- left: arrow_left_1.default,
38
+ up: ArrowUp_1.default,
39
+ right: ArrowRight_1.default,
40
+ down: ArrowDown_1.default,
41
+ left: ArrowLeft_1.default,
42
42
  },
43
43
  };
44
44
  /**
@@ -49,7 +49,6 @@ const ICONS = {
49
49
  const ArrowButton = (_a) => {
50
50
  var { size = 'l', direction = 'right', className, 'data-testid': testId = 'arrow-button' } = _a, buttonProps = __rest(_a, ["size", "direction", "className", 'data-testid']);
51
51
  const Icon = ICONS[size][direction];
52
- return (react_1.default.createElement("button", Object.assign({ type: 'button' }, buttonProps, { className: cx('arrow-button', `size-${size}`, className), "data-testid": testId }),
53
- react_1.default.createElement(Icon, { "aria-hidden": true, fill: 'currentColor' })));
52
+ return ((0, jsx_runtime_1.jsx)("button", Object.assign({ type: 'button' }, buttonProps, { className: cx('arrow-button', `size-${size}`, className), "data-testid": testId }, { children: (0, jsx_runtime_1.jsx)(Icon, { "aria-hidden": true, fill: 'currentColor' }) })));
54
53
  };
55
54
  exports.ArrowButton = ArrowButton;
@@ -1,27 +1,4 @@
1
1
  "use strict";
2
- var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
3
- if (k2 === undefined) k2 = k;
4
- var desc = Object.getOwnPropertyDescriptor(m, k);
5
- if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
6
- desc = { enumerable: true, get: function() { return m[k]; } };
7
- }
8
- Object.defineProperty(o, k2, desc);
9
- }) : (function(o, m, k, k2) {
10
- if (k2 === undefined) k2 = k;
11
- o[k2] = m[k];
12
- }));
13
- var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
14
- Object.defineProperty(o, "default", { enumerable: true, value: v });
15
- }) : function(o, v) {
16
- o["default"] = v;
17
- });
18
- var __importStar = (this && this.__importStar) || function (mod) {
19
- if (mod && mod.__esModule) return mod;
20
- var result = {};
21
- if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
22
- __setModuleDefault(result, mod);
23
- return result;
24
- };
25
2
  var __rest = (this && this.__rest) || function (s, e) {
26
3
  var t = {};
27
4
  for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
@@ -38,7 +15,8 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
38
15
  };
39
16
  Object.defineProperty(exports, "__esModule", { value: true });
40
17
  exports.Autocomplete = void 0;
41
- const react_1 = __importStar(require("react"));
18
+ const jsx_runtime_1 = require("react/jsx-runtime");
19
+ const react_1 = require("react");
42
20
  const dropdown_1 = require("../dropdown");
43
21
  const dropdown_item_1 = require("../dropdown-item");
44
22
  const utils_1 = require("../dropdown-item/utils");
@@ -48,8 +26,8 @@ const input_1 = require("../input");
48
26
  const hooks_1 = require("../hooks");
49
27
  const utils_2 = require("../dropdown/utils");
50
28
  const events_1 = require("../helpers/events");
51
- const down_1 = __importDefault(require("@sima-land/ui-quarks/icons/16x16/Stroked/Arrows/down"));
52
- const up_1 = __importDefault(require("@sima-land/ui-quarks/icons/16x16/Stroked/Arrows/up"));
29
+ const Down_1 = __importDefault(require("@sima-land/ui-quarks/icons/16x16/Stroked/Arrows/Down"));
30
+ const Up_1 = __importDefault(require("@sima-land/ui-quarks/icons/16x16/Stroked/Arrows/Up"));
53
31
  const autocomplete_module_scss_1 = __importDefault(require("./autocomplete.module.scss"));
54
32
  /**
55
33
  * Поле ввода с подсказками.
@@ -120,54 +98,49 @@ function Autocomplete(_a) {
120
98
  }
121
99
  }
122
100
  }, [menuShown, activeIndex, items, selectItem, onKeyDown]);
123
- return (react_1.default.createElement(react_1.default.Fragment, null,
124
- react_1.default.createElement(input_1.Input, Object.assign({}, restProps, {
125
- autoComplete,
126
- autoFocus,
127
- defaultValue,
128
- disabled,
129
- id,
130
- name,
131
- onInput,
132
- placeholder,
133
- readOnly,
134
- required,
135
- type,
136
- value,
137
- }, { inputRef: inputRef, blockRef: refs.setReference, onFocus: e => {
138
- onFocus === null || onFocus === void 0 ? void 0 : onFocus(e);
139
- setNeedMenu(true);
140
- }, onBlur: e => {
141
- onBlur === null || onBlur === void 0 ? void 0 : onBlur(e);
142
- setNeedMenu(false);
143
- setActiveIndex(-1);
144
- }, onChange: e => {
145
- onChange === null || onChange === void 0 ? void 0 : onChange(e);
146
- setNeedMenu(true);
147
- setActiveIndex(-1);
148
- setCurrentValue(e.target.value);
149
- },
150
- // @todo выяснить надо ли переключать меню при клике и раскомментировать/убрать
151
- // blockProps={{
152
- // onMouseDown: () => {
153
- // !disabled && setNeedMenu(a => !a);
154
- // },
155
- // }}
156
- baseInputProps: Object.assign(Object.assign({}, baseInputProps), { onKeyDown: handleKeyDown }), adornmentEnd: typeof adornmentEnd === 'function' ? adornmentEnd({ menuShown }) : adornmentEnd })),
157
- react_1.default.createElement(react_2.FloatingPortal, { id: '' }, menuShown && (react_1.default.createElement(dropdown_1.Dropdown, Object.assign({ ref: refs.setFloating }, dropdownProps, { style: Object.assign(Object.assign({}, dropdownProps === null || dropdownProps === void 0 ? void 0 : dropdownProps.style), floatingStyle) }),
158
- !loading &&
159
- items.length > 0 &&
160
- items.map((item, index) => (react_1.default.createElement(dropdown_item_1.DropdownItem, Object.assign({ key: index, checked: index === activeIndex }, item.props, { onMouseDown: e => {
161
- var _a, _b;
162
- e.preventDefault();
163
- (_b = (_a = item.props).onMouseDown) === null || _b === void 0 ? void 0 : _b.call(_a, e);
164
- }, onClick: e => {
165
- var _a, _b;
166
- (_b = (_a = item.props).onClick) === null || _b === void 0 ? void 0 : _b.call(_a, e);
167
- !e.defaultPrevented && selectItem(item);
168
- } })))),
169
- !loading && items.length === 0 && (react_1.default.createElement(dropdown_item_1.DropdownItem, { size: 's', noHover: true }, "\u041D\u0435 \u043D\u0430\u0439\u0434\u0435\u043D\u043E")),
170
- loading && react_1.default.createElement(dropdown_loading_1.DropdownLoading, null))))));
101
+ return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(input_1.Input, Object.assign({}, restProps, {
102
+ autoComplete,
103
+ autoFocus,
104
+ defaultValue,
105
+ disabled,
106
+ id,
107
+ name,
108
+ onInput,
109
+ placeholder,
110
+ readOnly,
111
+ required,
112
+ type,
113
+ value,
114
+ }, { inputRef: inputRef, blockRef: refs.setReference, onFocus: e => {
115
+ onFocus === null || onFocus === void 0 ? void 0 : onFocus(e);
116
+ setNeedMenu(true);
117
+ }, onBlur: e => {
118
+ onBlur === null || onBlur === void 0 ? void 0 : onBlur(e);
119
+ setNeedMenu(false);
120
+ setActiveIndex(-1);
121
+ }, onChange: e => {
122
+ onChange === null || onChange === void 0 ? void 0 : onChange(e);
123
+ setNeedMenu(true);
124
+ setActiveIndex(-1);
125
+ setCurrentValue(e.target.value);
126
+ },
127
+ // @todo выяснить надо ли переключать меню при клике и раскомментировать/убрать
128
+ // blockProps={{
129
+ // onMouseDown: () => {
130
+ // !disabled && setNeedMenu(a => !a);
131
+ // },
132
+ // }}
133
+ baseInputProps: Object.assign(Object.assign({}, baseInputProps), { onKeyDown: handleKeyDown }), adornmentEnd: typeof adornmentEnd === 'function' ? adornmentEnd({ menuShown }) : adornmentEnd })), (0, jsx_runtime_1.jsx)(react_2.FloatingPortal, Object.assign({ id: '' }, { children: menuShown && ((0, jsx_runtime_1.jsxs)(dropdown_1.Dropdown, Object.assign({ ref: refs.setFloating }, dropdownProps, { style: Object.assign(Object.assign({}, dropdownProps === null || dropdownProps === void 0 ? void 0 : dropdownProps.style), floatingStyle) }, { children: [!loading &&
134
+ items.length > 0 &&
135
+ items.map((item, index) => ((0, jsx_runtime_1.jsx)(dropdown_item_1.DropdownItem, Object.assign({ checked: index === activeIndex }, item.props, { onMouseDown: e => {
136
+ var _a, _b;
137
+ e.preventDefault();
138
+ (_b = (_a = item.props).onMouseDown) === null || _b === void 0 ? void 0 : _b.call(_a, e);
139
+ }, onClick: e => {
140
+ var _a, _b;
141
+ (_b = (_a = item.props).onClick) === null || _b === void 0 ? void 0 : _b.call(_a, e);
142
+ !e.defaultPrevented && selectItem(item);
143
+ } }), index))), !loading && items.length === 0 && ((0, jsx_runtime_1.jsx)(dropdown_item_1.DropdownItem, Object.assign({ size: 's', noHover: true }, { children: "\u041D\u0435 \u043D\u0430\u0439\u0434\u0435\u043D\u043E" }))), loading && (0, jsx_runtime_1.jsx)(dropdown_loading_1.DropdownLoading, {})] }))) }))] }));
171
144
  }
172
145
  exports.Autocomplete = Autocomplete;
173
146
  /**
@@ -185,6 +158,6 @@ function defaultFilterOption(item, inputValue) {
185
158
  * @return Элемент.
186
159
  */
187
160
  function getDefaultAdornmentEnd(data) {
188
- const ArrowSVG = data.menuShown ? up_1.default : down_1.default;
189
- return react_1.default.createElement(ArrowSVG, { className: autocomplete_module_scss_1.default.arrow, "data-testid": 'autocomplete:arrow-up' });
161
+ const ArrowSVG = data.menuShown ? Up_1.default : Down_1.default;
162
+ return (0, jsx_runtime_1.jsx)(ArrowSVG, { className: autocomplete_module_scss_1.default.arrow, "data-testid": 'autocomplete:arrow-up' });
190
163
  }
@@ -1,4 +1,4 @@
1
- import React from 'react';
1
+ /// <reference types="react" />
2
2
  import { DropdownItemProps } from '../dropdown-item';
3
3
  import { TextFieldProps } from '../text-field';
4
4
  export interface AutocompleteProps extends Omit<TextFieldProps, 'ref' | 'value' | 'defaultValue'> {
@@ -1,27 +1,4 @@
1
1
  "use strict";
2
- var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
3
- if (k2 === undefined) k2 = k;
4
- var desc = Object.getOwnPropertyDescriptor(m, k);
5
- if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
6
- desc = { enumerable: true, get: function() { return m[k]; } };
7
- }
8
- Object.defineProperty(o, k2, desc);
9
- }) : (function(o, m, k, k2) {
10
- if (k2 === undefined) k2 = k;
11
- o[k2] = m[k];
12
- }));
13
- var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
14
- Object.defineProperty(o, "default", { enumerable: true, value: v });
15
- }) : function(o, v) {
16
- o["default"] = v;
17
- });
18
- var __importStar = (this && this.__importStar) || function (mod) {
19
- if (mod && mod.__esModule) return mod;
20
- var result = {};
21
- if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
22
- __setModuleDefault(result, mod);
23
- return result;
24
- };
25
2
  var __rest = (this && this.__rest) || function (s, e) {
26
3
  var t = {};
27
4
  for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
@@ -38,13 +15,14 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
38
15
  };
39
16
  Object.defineProperty(exports, "__esModule", { value: true });
40
17
  exports.Autocomplete = void 0;
41
- const react_1 = __importStar(require("react"));
18
+ const jsx_runtime_1 = require("react/jsx-runtime");
19
+ const react_1 = require("react");
42
20
  const dropdown_1 = require("../dropdown");
43
21
  const dropdown_item_1 = require("../dropdown-item");
44
22
  const text_field_1 = require("../text-field");
45
23
  const dropdown_2 = require("../_internal/utils/dropdown");
46
- const down_1 = __importDefault(require("@sima-land/ui-quarks/icons/16x16/Stroked/Arrows/down"));
47
- const up_1 = __importDefault(require("@sima-land/ui-quarks/icons/16x16/Stroked/Arrows/up"));
24
+ const Down_1 = __importDefault(require("@sima-land/ui-quarks/icons/16x16/Stroked/Arrows/Down"));
25
+ const Up_1 = __importDefault(require("@sima-land/ui-quarks/icons/16x16/Stroked/Arrows/Up"));
48
26
  const dropdown_loading_1 = require("../_internal/dropdown-loading");
49
27
  const bind_1 = __importDefault(require("classnames/bind"));
50
28
  const autocomplete_module_scss_1 = __importDefault(require("./autocomplete.module.scss"));
@@ -64,7 +42,7 @@ const Autocomplete = (_a) => {
64
42
  const [realValue, setRealValue] = (0, react_1.useState)(value || defaultValue);
65
43
  const [activeIndex, setActiveIndex] = (0, react_1.useState)(null);
66
44
  const needMenu = preset === 'filled-only-list' ? withMenu && realValue && realValue.length > 0 : withMenu;
67
- const arrowIcon = needMenu ? (react_1.default.createElement(up_1.default, { className: cx('arrow'), "data-testid": 'autocomplete:arrow-up' })) : (react_1.default.createElement(down_1.default, { className: cx('arrow'), "data-testid": 'autocomplete:arrow-down' }));
45
+ const arrowIcon = needMenu ? ((0, jsx_runtime_1.jsx)(Up_1.default, { className: cx('arrow'), "data-testid": 'autocomplete:arrow-up' })) : ((0, jsx_runtime_1.jsx)(Down_1.default, { className: cx('arrow'), "data-testid": 'autocomplete:arrow-down' }));
68
46
  const endAdornment = preset === 'default' ? arrowIcon : undefined;
69
47
  (0, react_1.useEffect)(() => {
70
48
  setRealValue(value);
@@ -85,46 +63,44 @@ const Autocomplete = (_a) => {
85
63
  });
86
64
  }
87
65
  }, [activeIndex]);
88
- return (react_1.default.createElement("div", { style: style, className: cx('root', className), "data-testid": dataTestId },
89
- react_1.default.createElement(text_field_1.TextField, Object.assign({}, restProps, { ref: fieldRef, focused: withMenu, endAdornment: endAdornment, "data-testid": 'autocomplete:field', variant: 'desktop', value: realValue, multiline: false, className: cx('field'), onFocus: () => {
90
- toggleMenu(true);
91
- setActiveIndex(null);
92
- }, onBlur: () => {
93
- toggleMenu(false);
94
- }, onChange: (event) => {
95
- setRealValue(event.target.value);
96
- setActiveIndex(0);
97
- onChange === null || onChange === void 0 ? void 0 : onChange(event);
98
- }, onKeyDown: (event) => {
99
- const size = (items === null || items === void 0 ? void 0 : items.length) || 0;
100
- let nextIndex;
101
- switch (event.key) {
102
- case 'ArrowDown':
103
- nextIndex = (activeIndex !== null ? size + activeIndex + 1 : 0) % size;
104
- break;
105
- case 'ArrowUp':
106
- nextIndex = (size + Number(activeIndex) - 1) % size;
107
- break;
108
- case 'Enter':
109
- if (items && activeIndex !== null && items.length > activeIndex) {
110
- onSelect && onSelect(items[activeIndex]);
66
+ return ((0, jsx_runtime_1.jsxs)("div", Object.assign({ style: style, className: cx('root', className), "data-testid": dataTestId }, { children: [(0, jsx_runtime_1.jsx)(text_field_1.TextField, Object.assign({}, restProps, { ref: fieldRef, focused: withMenu, endAdornment: endAdornment, "data-testid": 'autocomplete:field', variant: 'desktop', value: realValue, multiline: false, className: cx('field'), onFocus: () => {
67
+ toggleMenu(true);
68
+ setActiveIndex(null);
69
+ }, onBlur: () => {
70
+ toggleMenu(false);
71
+ }, onChange: (event) => {
72
+ setRealValue(event.target.value);
73
+ setActiveIndex(0);
74
+ onChange === null || onChange === void 0 ? void 0 : onChange(event);
75
+ }, onKeyDown: (event) => {
76
+ const size = (items === null || items === void 0 ? void 0 : items.length) || 0;
77
+ let nextIndex;
78
+ switch (event.key) {
79
+ case 'ArrowDown':
80
+ nextIndex = (activeIndex !== null ? size + activeIndex + 1 : 0) % size;
81
+ break;
82
+ case 'ArrowUp':
83
+ nextIndex = (size + Number(activeIndex) - 1) % size;
84
+ break;
85
+ case 'Enter':
86
+ if (items && activeIndex !== null && items.length > activeIndex) {
87
+ onSelect && onSelect(items[activeIndex]);
88
+ toggleMenu(false);
89
+ }
90
+ break;
91
+ }
92
+ if (typeof nextIndex === 'number') {
93
+ event.preventDefault(); // не даём каретке в поле перемещаться
94
+ setActiveIndex(nextIndex);
95
+ }
96
+ onKeyDown === null || onKeyDown === void 0 ? void 0 : onKeyDown(event);
97
+ } })), needMenu && ((0, jsx_runtime_1.jsx)(dropdown_1.Dropdown, Object.assign({}, (0, dropdown_2.placeDropdown)(restProps.size), { ref: menuRef, "data-testid": 'autocomplete:menu', className: cx('menu'), role: 'menu', customScrollbarProps: { osComponentRef } }, { children: loading ? ((0, jsx_runtime_1.jsx)(dropdown_loading_1.DropdownLoading, { "data-testid": 'autocomplete:loading-area' })) : ((0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: items && items.length > 0 ? (items.map((item, index) => ((0, jsx_runtime_1.jsx)(dropdown_item_1.DropdownItem, Object.assign({ size: itemSize, role: 'menuitem', checked: index === activeIndex, onMouseDown: event => {
98
+ // чтобы при нажатии на опцию предотвратить blur на поле
99
+ event.preventDefault();
100
+ }, onClick: () => {
101
+ onSelect === null || onSelect === void 0 ? void 0 : onSelect(item);
102
+ setActiveIndex(null);
111
103
  toggleMenu(false);
112
- }
113
- break;
114
- }
115
- if (typeof nextIndex === 'number') {
116
- event.preventDefault(); // не даём каретке в поле перемещаться
117
- setActiveIndex(nextIndex);
118
- }
119
- onKeyDown === null || onKeyDown === void 0 ? void 0 : onKeyDown(event);
120
- } })),
121
- needMenu && (react_1.default.createElement(dropdown_1.Dropdown, Object.assign({}, (0, dropdown_2.placeDropdown)(restProps.size), { ref: menuRef, "data-testid": 'autocomplete:menu', className: cx('menu'), role: 'menu', customScrollbarProps: { osComponentRef } }), loading ? (react_1.default.createElement(dropdown_loading_1.DropdownLoading, { "data-testid": 'autocomplete:loading-area' })) : (react_1.default.createElement(react_1.default.Fragment, null, items && items.length > 0 ? (items.map((item, index) => (react_1.default.createElement(dropdown_item_1.DropdownItem, { size: itemSize, key: index, role: 'menuitem', checked: index === activeIndex, onMouseDown: event => {
122
- // чтобы при нажатии на опцию предотвратить blur на поле
123
- event.preventDefault();
124
- }, onClick: () => {
125
- onSelect === null || onSelect === void 0 ? void 0 : onSelect(item);
126
- setActiveIndex(null);
127
- toggleMenu(false);
128
- } }, renderItem(item))))) : (react_1.default.createElement(dropdown_item_1.DropdownItem, { size: 'm', noHover: true }, "\u041D\u0435 \u043D\u0430\u0439\u0434\u0435\u043D\u043E"))))))));
104
+ } }, { children: renderItem(item) }), index)))) : ((0, jsx_runtime_1.jsx)(dropdown_item_1.DropdownItem, Object.assign({ size: 'm', noHover: true }, { children: "\u041D\u0435 \u043D\u0430\u0439\u0434\u0435\u043D\u043E" }))) })) })))] })));
129
105
  };
130
106
  exports.Autocomplete = Autocomplete;
@@ -1,3 +1,5 @@
1
+ @use 'sass:map';
2
+
1
3
  $sizes: 40, 48, 56, 64, 72, 80, 104;
2
4
 
3
5
  $textSizes: (
@@ -41,7 +43,7 @@ $textSizes: (
41
43
  width: #{$size}px;
42
44
  height: #{$size}px;
43
45
  .monogram {
44
- font-size: #{map-get($textSizes, $size)}px;
46
+ font-size: #{map.get($textSizes, $size)}px;
45
47
  }
46
48
  }
47
49
  }
package/avatar/index.d.ts CHANGED
@@ -27,4 +27,4 @@ export interface AvatarProps {
27
27
  * @param props Свойства компонента.
28
28
  * @return Элемент.
29
29
  */
30
- export declare const Avatar: ({ size: sizeProp, imageUrl, bgColor, bgOpacity, textColor, title, monogram, className, style, "data-testid": testId, }: AvatarProps) => JSX.Element;
30
+ export declare function Avatar({ size: sizeProp, imageUrl, bgColor, bgOpacity, textColor, title, monogram, className, style, 'data-testid': testId, }: AvatarProps): JSX.Element;