@alfalab/core-components-picker-button 7.4.3 → 7.6.1

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 (77) hide show
  1. package/CHANGELOG.md +40 -0
  2. package/dist/Component.d.ts +28 -6
  3. package/dist/Component.js +13 -7
  4. package/dist/cssm/Component.d.ts +28 -6
  5. package/dist/cssm/Component.js +13 -6
  6. package/dist/cssm/field/Component.d.ts +10 -0
  7. package/dist/cssm/field/Component.js +25 -8
  8. package/dist/cssm/field/index.d.ts +1 -1
  9. package/dist/cssm/field/index.js +7 -3
  10. package/dist/cssm/index.js +9 -3
  11. package/dist/cssm/index.module.css +4 -0
  12. package/dist/cssm/option/Component.d.ts +11 -0
  13. package/dist/cssm/option/Component.js +25 -0
  14. package/dist/cssm/option/index.d.ts +1 -0
  15. package/dist/cssm/option/index.js +13 -0
  16. package/dist/cssm/option/index.module.css +24 -0
  17. package/dist/cssm/tslib.es6-ce870b46.d.ts +32 -0
  18. package/dist/cssm/tslib.es6-ce870b46.js +42 -0
  19. package/dist/{Component-52c236b9.d.ts → cssm/typings-a22d6eaf.d.ts} +180 -187
  20. package/dist/cssm/utils/index.d.ts +4 -0
  21. package/dist/cssm/utils/index.js +17 -0
  22. package/dist/esm/Component.d.ts +28 -6
  23. package/dist/esm/Component.js +14 -8
  24. package/dist/esm/field/Component.d.ts +10 -0
  25. package/dist/esm/field/Component.js +24 -6
  26. package/dist/esm/field/index.css +3 -3
  27. package/dist/esm/field/index.d.ts +1 -1
  28. package/dist/esm/field/index.js +7 -3
  29. package/dist/esm/index.css +9 -5
  30. package/dist/esm/index.js +8 -3
  31. package/dist/esm/option/Component.d.ts +11 -0
  32. package/dist/esm/option/Component.js +18 -0
  33. package/dist/esm/option/index.css +25 -0
  34. package/dist/esm/option/index.d.ts +1 -0
  35. package/dist/esm/option/index.js +4 -0
  36. package/dist/esm/tslib.es6-bb0d3a15.d.ts +32 -0
  37. package/dist/esm/tslib.es6-bb0d3a15.js +40 -0
  38. package/dist/esm/{Component-d3b8be4d.d.ts → typings-a22d6eaf.d.ts} +180 -187
  39. package/dist/esm/utils/index.d.ts +4 -0
  40. package/dist/esm/utils/index.js +13 -0
  41. package/dist/field/Component.d.ts +10 -0
  42. package/dist/field/Component.js +26 -7
  43. package/dist/field/index.css +3 -3
  44. package/dist/field/index.d.ts +1 -1
  45. package/dist/field/index.js +7 -3
  46. package/dist/index.css +9 -5
  47. package/dist/index.js +8 -3
  48. package/dist/modern/Component.d.ts +28 -6
  49. package/dist/modern/Component.js +12 -7
  50. package/dist/modern/field/Component.d.ts +5 -707
  51. package/dist/modern/field/Component.js +10 -7
  52. package/dist/modern/field/index.css +3 -3
  53. package/dist/modern/field/index.js +5 -2
  54. package/dist/modern/index.css +9 -5
  55. package/dist/modern/index.js +6 -2
  56. package/dist/modern/option/Component.d.ts +11 -0
  57. package/dist/modern/option/Component.js +16 -0
  58. package/dist/modern/option/index.css +25 -0
  59. package/dist/modern/option/index.d.ts +1 -0
  60. package/dist/modern/option/index.js +3 -0
  61. package/dist/{cssm/Component-aeb02c1b.d.ts → modern/typings-a22d6eaf.d.ts} +180 -187
  62. package/dist/modern/utils/index.d.ts +4 -0
  63. package/dist/modern/utils/index.js +13 -0
  64. package/dist/option/Component.d.ts +11 -0
  65. package/dist/option/Component.js +26 -0
  66. package/dist/option/index.css +25 -0
  67. package/dist/option/index.d.ts +1 -0
  68. package/dist/option/index.js +12 -0
  69. package/dist/tslib.es6-b5c82847.d.ts +32 -0
  70. package/dist/tslib.es6-b5c82847.js +42 -0
  71. package/dist/typings-a22d6eaf.d.ts +867 -0
  72. package/dist/utils/index.d.ts +4 -0
  73. package/dist/utils/index.js +17 -0
  74. package/package.json +4 -4
  75. package/dist/Component-52c236b9.js +0 -67
  76. package/dist/cssm/Component-aeb02c1b.js +0 -66
  77. package/dist/esm/Component-d3b8be4d.js +0 -59
@@ -1,42 +1,9 @@
1
1
  /// <reference types="react-transition-group" />
2
2
  /// <reference types="react" />
3
3
  import React from "react";
4
- import { ReactNode, FC, RefAttributes, AriaAttributes, FocusEvent, MouseEvent, ReactElement, CSSProperties, MutableRefObject, InputHTMLAttributes, ChangeEvent, RefObject, HTMLAttributes } from "react";
4
+ import { CSSProperties, MutableRefObject, ReactNode, InputHTMLAttributes, ChangeEvent, MouseEvent, FC, RefObject, HTMLAttributes, RefAttributes, AriaAttributes, FocusEvent, ReactElement } from "react";
5
5
  import { CSSTransitionProps } from "react-transition-group/CSSTransition";
6
6
  import { BasePlacement, VariationPlacement } from "@popperjs/core";
7
- import { ButtonProps } from "@alfalab/core-components-button";
8
- import { PickerButtonSize } from "./index";
9
- declare function __extends(d: any, b: any): void;
10
- declare function __rest(s: any, e: any): {};
11
- declare function __decorate(decorators: any, target: any, key: any, desc: any, ...args: any[]): any;
12
- declare function __param(paramIndex: any, decorator: any): (target: any, key: any) => void;
13
- declare function __metadata(metadataKey: any, metadataValue: any): any;
14
- declare function __awaiter(thisArg: any, _arguments: any, P: any, generator: any): any;
15
- declare function __generator(thisArg: any, body: any): {
16
- next: (v: any) => any;
17
- throw: (v: any) => any;
18
- return: (v: any) => any;
19
- };
20
- declare function __exportStar(m: any, o: any): void;
21
- declare function __values(o: any): any;
22
- declare function __read(o: any, n: any): any;
23
- declare function __spread(...args: any[]): any[];
24
- declare function __spreadArrays(...args: any[]): any[];
25
- declare function __await(v: any): any;
26
- declare class __await {
27
- constructor(v: any);
28
- v: any;
29
- }
30
- declare function __asyncGenerator(thisArg: any, _arguments: any, generator: any): {};
31
- declare function __asyncDelegator(o: any): {};
32
- declare function __asyncValues(o: any): any;
33
- declare function __makeTemplateObject(cooked: any, raw: any): any;
34
- declare function __importStar(mod: any): any;
35
- declare function __importDefault(mod: any): any;
36
- declare function __classPrivateFieldGet(receiver: any, privateMap: any): any;
37
- declare function __classPrivateFieldSet(receiver: any, privateMap: any, value: any): any;
38
- declare function __assign(...args: any[]): any;
39
- declare function __createBinding(o: any, m: any, k: any, k2: any): void;
40
7
  type RefElement = HTMLElement | null;
41
8
  type Position = BasePlacement | VariationPlacement;
42
9
  type PopoverProps = {
@@ -130,6 +97,7 @@ type PopoverProps = {
130
97
  */
131
98
  children?: ReactNode;
132
99
  };
100
+ declare const Popover: React.ForwardRefExoticComponent<PopoverProps & React.RefAttributes<HTMLDivElement>>;
133
101
  type InputProps = Omit<InputHTMLAttributes<HTMLInputElement>, "size" | "type" | "value" | "defaultValue" | "onChange" | "onClick" | "onMouseDown"> & {
134
102
  /**
135
103
  * Значение поля ввода
@@ -246,6 +214,169 @@ type InputProps = Omit<InputHTMLAttributes<HTMLInputElement>, "size" | "type" |
246
214
  */
247
215
  dataTestId?: string;
248
216
  };
217
+ declare const Input: React.ForwardRefExoticComponent<Pick<React.InputHTMLAttributes<HTMLInputElement>, "className" | "form" | "slot" | "style" | "title" | "pattern" | "children" | "defaultChecked" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "contentEditable" | "contextMenu" | "dir" | "draggable" | "hidden" | "id" | "lang" | "placeholder" | "spellCheck" | "tabIndex" | "translate" | "radioGroup" | "role" | "about" | "datatype" | "inlist" | "prefix" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "color" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "inputMode" | "is" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocus" | "onFocusCapture" | "onBlur" | "onBlurCapture" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDown" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerEnterCapture" | "onPointerLeave" | "onPointerLeaveCapture" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture" | "list" | "step" | "autoFocus" | "disabled" | "formAction" | "formEncType" | "formMethod" | "formNoValidate" | "formTarget" | "name" | "height" | "width" | "multiple" | "accept" | "alt" | "autoComplete" | "capture" | "checked" | "crossOrigin" | "max" | "maxLength" | "min" | "minLength" | "readOnly" | "required" | "src"> & {
218
+ value?: string | undefined;
219
+ defaultValue?: string | undefined;
220
+ block?: boolean | undefined;
221
+ clear?: boolean | undefined;
222
+ size?: "s" | "m" | "l" | "xl" | undefined;
223
+ colors?: "default" | "inverted" | undefined;
224
+ error?: React.ReactNode;
225
+ success?: boolean | undefined;
226
+ hint?: React.ReactNode;
227
+ label?: React.ReactNode;
228
+ type?: "number" | "text" | "tel" | "email" | "card" | "money" | "password" | undefined;
229
+ wrapperRef?: ((instance: HTMLDivElement | null) => void) | React.RefObject<HTMLDivElement> | null | undefined;
230
+ leftAddons?: React.ReactNode;
231
+ rightAddons?: React.ReactNode;
232
+ bottomAddons?: React.ReactNode;
233
+ className?: string | undefined;
234
+ fieldClassName?: string | undefined;
235
+ inputClassName?: string | undefined;
236
+ labelClassName?: string | undefined;
237
+ addonsClassName?: string | undefined;
238
+ focusedClassName?: string | undefined;
239
+ filledClassName?: string | undefined;
240
+ onChange?: ((event: React.ChangeEvent<HTMLInputElement>, payload: {
241
+ value: string;
242
+ }) => void) | undefined;
243
+ onClear?: ((event: React.MouseEvent<HTMLButtonElement, globalThis.MouseEvent>) => void) | undefined;
244
+ onClick?: ((event: React.MouseEvent<HTMLDivElement, globalThis.MouseEvent>) => void) | undefined;
245
+ onMouseDown?: ((event: React.MouseEvent<HTMLDivElement, globalThis.MouseEvent>) => void) | undefined;
246
+ onMouseUp?: ((event: React.MouseEvent<HTMLDivElement, globalThis.MouseEvent>) => void) | undefined;
247
+ dataTestId?: string | undefined;
248
+ } & React.RefAttributes<HTMLInputElement>>;
249
+ /**
250
+ * Набор констант для z-index соответствующих классов компонентов.
251
+ * Значения выбраны по приоритету.
252
+ */
253
+ declare const stackingOrder: {
254
+ FOCUSED: number;
255
+ DEFAULT: number;
256
+ POPOVER: number;
257
+ MODAL: number;
258
+ TOAST: number;
259
+ };
260
+ declare const StackingContext: import("react").Context<number>;
261
+ type StackProps = {
262
+ /**
263
+ * Render prop, в который передается функция.
264
+ * Функция принимает аргумент со значением z-index из текущего контекста.
265
+ */
266
+ children: (value: number) => ReactNode;
267
+ /**
268
+ * Исходное значение для z-index.
269
+ * @default 5
270
+ */
271
+ value?: number;
272
+ };
273
+ declare const Stack: FC<StackProps>;
274
+ type PortalProps = {
275
+ /** Контент */
276
+ children?: ReactNode;
277
+ /**
278
+ * Функция, возвращающая контейнер, в который будут рендериться дочерние элементы
279
+ */
280
+ getPortalContainer?: () => Element;
281
+ };
282
+ declare const Portal: import("react").ForwardRefExoticComponent<PortalProps & import("react").RefAttributes<Element>>;
283
+ declare const PORTAL_CONTAINER_ATTRIBUTE = "alfa-portal-container";
284
+ declare const getDefaultPortalContainer: () => Element;
285
+ declare function setRef<T>(ref: RefObject<T> | ((instance: T | null) => void) | null | undefined, value: T | null): void;
286
+ type FormControlProps = HTMLAttributes<HTMLDivElement> & {
287
+ /**
288
+ * Растягивает компонент на ширину контейнера
289
+ */
290
+ block?: boolean;
291
+ /**
292
+ * Размер компонента
293
+ */
294
+ size?: "s" | "m" | "l" | "xl";
295
+ /**
296
+ * Набор цветов для компонента
297
+ */
298
+ colors?: "default" | "inverted";
299
+ /**
300
+ * Заблокированное состояние
301
+ */
302
+ disabled?: boolean;
303
+ /**
304
+ * Заполненное состояние
305
+ */
306
+ filled?: boolean;
307
+ /**
308
+ * Выбранное (фокус) состояние
309
+ */
310
+ focused?: boolean;
311
+ /**
312
+ * Отображение ошибки
313
+ */
314
+ error?: ReactNode | boolean;
315
+ /**
316
+ * Текст подсказки
317
+ */
318
+ hint?: ReactNode;
319
+ /**
320
+ * Лейбл компонента
321
+ */
322
+ label?: ReactNode;
323
+ /**
324
+ * Слот слева
325
+ */
326
+ leftAddons?: ReactNode;
327
+ /**
328
+ * Слот справа
329
+ */
330
+ rightAddons?: ReactNode;
331
+ /**
332
+ * Слот под полем
333
+ */
334
+ bottomAddons?: ReactNode;
335
+ /**
336
+ * Дополнительный класс
337
+ */
338
+ className?: string;
339
+ /**
340
+ * Дополнительный класс для поля
341
+ */
342
+ fieldClassName?: string;
343
+ /**
344
+ * Дополнительный класс для лейбла
345
+ */
346
+ labelClassName?: string;
347
+ /**
348
+ * Дополнительный класс для аддонов
349
+ */
350
+ addonsClassName?: string;
351
+ /**
352
+ * Идентификатор для систем автоматизированного тестирования
353
+ */
354
+ dataTestId?: string;
355
+ /**
356
+ * Компонент поля (инпут, textarea и пр.)
357
+ */
358
+ children?: ReactNode;
359
+ };
360
+ declare const FormControl: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLDivElement> & {
361
+ block?: boolean | undefined;
362
+ size?: "s" | "m" | "l" | "xl" | undefined;
363
+ colors?: "default" | "inverted" | undefined;
364
+ disabled?: boolean | undefined;
365
+ filled?: boolean | undefined;
366
+ focused?: boolean | undefined;
367
+ error?: React.ReactNode;
368
+ hint?: React.ReactNode;
369
+ label?: React.ReactNode;
370
+ leftAddons?: React.ReactNode;
371
+ rightAddons?: React.ReactNode;
372
+ bottomAddons?: React.ReactNode;
373
+ className?: string | undefined;
374
+ fieldClassName?: string | undefined;
375
+ labelClassName?: string | undefined;
376
+ addonsClassName?: string | undefined;
377
+ dataTestId?: string | undefined;
378
+ children?: React.ReactNode;
379
+ } & React.RefAttributes<HTMLDivElement>>;
249
380
  type OptionShape = {
250
381
  /**
251
382
  * Текстовое представление пункта
@@ -262,7 +393,6 @@ type OptionShape = {
262
393
  /**
263
394
  * Дополнительные данные
264
395
  */
265
- // eslint-disable-next-line @typescript-eslint/no-explicit-any
266
396
  value?: any;
267
397
  };
268
398
  type GroupShape = {
@@ -331,11 +461,11 @@ type BaseSelectProps = {
331
461
  /**
332
462
  * Размер компонента
333
463
  */
334
- size?: "s" | "m" | "l" | "xl";
464
+ size?: 's' | 'm' | 'l' | 'xl';
335
465
  /**
336
466
  * Размер пунктов меню
337
467
  */
338
- optionsSize?: "s" | "m" | "l" | "xl";
468
+ optionsSize?: 's' | 'm' | 'l' | 'xl';
339
469
  /**
340
470
  * Растягивает компонент на ширину контейнера
341
471
  */
@@ -344,7 +474,7 @@ type BaseSelectProps = {
344
474
  * Управляет шириной выпадающего меню.
345
475
  * Ширину определяет контент, либо ширина равна ширине поля
346
476
  */
347
- optionsListWidth?: "content" | "field";
477
+ optionsListWidth?: 'content' | 'field';
348
478
  /**
349
479
  * Лейбл поля
350
480
  */
@@ -393,7 +523,7 @@ type BaseSelectProps = {
393
523
  /**
394
524
  * Позиционирование выпадающего списка
395
525
  */
396
- popoverPosition?: PopoverProps["position"];
526
+ popoverPosition?: PopoverProps['position'];
397
527
  /**
398
528
  * Количество видимых пунктов меню (5 = 5.5)
399
529
  */
@@ -401,7 +531,7 @@ type BaseSelectProps = {
401
531
  /**
402
532
  * Кастомный рендер выбранного пункта
403
533
  */
404
- valueRenderer?: ({ selected, selectedMultiple }: {
534
+ valueRenderer?: ({ selected, selectedMultiple, }: {
405
535
  selected?: OptionShape;
406
536
  selectedMultiple: OptionShape[];
407
537
  }) => ReactNode;
@@ -468,17 +598,16 @@ type BaseSelectProps = {
468
598
  /**
469
599
  * Хранит функцию, с помощью которой можно обновить положение поповера
470
600
  */
471
- updatePopover?: PopoverProps["update"];
601
+ updatePopover?: PopoverProps['update'];
472
602
  /**
473
603
  * z-index поповера
474
604
  */
475
- zIndexPopover?: PopoverProps["zIndex"];
605
+ zIndexPopover?: PopoverProps['zIndex'];
476
606
  /**
477
607
  * Показывать OptionsList, если он пустой
478
608
  */
479
609
  showEmptyOptionsList?: boolean;
480
610
  };
481
- // TODO: использовать InputProps
482
611
  type FieldProps = {
483
612
  /**
484
613
  * Дополнительный класс
@@ -487,7 +616,7 @@ type FieldProps = {
487
616
  /**
488
617
  * Размер компонента
489
618
  */
490
- size?: "s" | "m" | "l" | "xl";
619
+ size?: 's' | 'm' | 'l' | 'xl';
491
620
  /**
492
621
  * Выбранный пункт
493
622
  */
@@ -543,7 +672,7 @@ type FieldProps = {
543
672
  /**
544
673
  * Кастомный рендер выбранного пункта
545
674
  */
546
- valueRenderer?: BaseSelectProps["valueRenderer"];
675
+ valueRenderer?: BaseSelectProps['valueRenderer'];
547
676
  /**
548
677
  * Внутренние свойства, которые должны быть установлены компоненту.
549
678
  */
@@ -577,7 +706,7 @@ type OptionsListProps = {
577
706
  /**
578
707
  * Размер компонента
579
708
  */
580
- size?: "s" | "m" | "l" | "xl";
709
+ size?: 's' | 'm' | 'l' | 'xl';
581
710
  /**
582
711
  * Компонент пункта меню
583
712
  */
@@ -625,7 +754,7 @@ type OptionsListProps = {
625
754
  /**
626
755
  * Компонент группы
627
756
  */
628
- Optgroup?: BaseSelectProps["Optgroup"];
757
+ Optgroup?: BaseSelectProps['Optgroup'];
629
758
  /**
630
759
  * Будет отображаться, если компонент пустой
631
760
  */
@@ -651,7 +780,7 @@ type OptgroupProps = {
651
780
  /**
652
781
  * Размер компонента
653
782
  */
654
- size?: "s" | "m" | "l" | "xl";
783
+ size?: 's' | 'm' | 'l' | 'xl';
655
784
  /**
656
785
  * Заголовок группы
657
786
  */
@@ -669,7 +798,7 @@ type OptionProps = {
669
798
  /**
670
799
  * Размер компонента
671
800
  */
672
- size?: "s" | "m" | "l" | "xl";
801
+ size?: 's' | 'm' | 'l' | 'xl';
673
802
  /**
674
803
  * Контент пункта меню
675
804
  */
@@ -733,142 +862,6 @@ type CheckmarkProps = {
733
862
  /**
734
863
  * Расположение отметки
735
864
  */
736
- position?: "before" | "after";
737
- };
738
- /**
739
- * Набор констант для z-index соответствующих классов компонентов.
740
- * Значения выбраны по приоритету.
741
- */
742
- declare const stackingOrder: {
743
- FOCUSED: number;
744
- DEFAULT: number;
745
- POPOVER: number;
746
- MODAL: number;
747
- TOAST: number;
748
- };
749
- declare const StackingContext: import("react").Context<number>;
750
- type StackProps = {
751
- /**
752
- * Render prop, в который передается функция.
753
- * Функция принимает аргумент со значением z-index из текущего контекста.
754
- */
755
- children: (value: number) => ReactNode;
756
- /**
757
- * Исходное значение для z-index.
758
- * @default 5
759
- */
760
- value?: number;
761
- };
762
- declare const Stack: FC<StackProps>;
763
- type PortalProps = {
764
- /** Контент */
765
- children?: ReactNode;
766
- /**
767
- * Функция, возвращающая контейнер, в который будут рендериться дочерние элементы
768
- */
769
- getPortalContainer?: () => Element;
770
- };
771
- declare const Portal: import("react").ForwardRefExoticComponent<PortalProps & import("react").RefAttributes<Element>>;
772
- declare const PORTAL_CONTAINER_ATTRIBUTE = "alfa-portal-container";
773
- declare const getDefaultPortalContainer: () => Element;
774
- declare function setRef<T>(ref: RefObject<T> | ((instance: T | null) => void) | null | undefined, value: T | null): void;
775
- type FormControlProps = HTMLAttributes<HTMLDivElement> & {
776
- /**
777
- * Растягивает компонент на ширину контейнера
778
- */
779
- block?: boolean;
780
- /**
781
- * Размер компонента
782
- */
783
- size?: "s" | "m" | "l" | "xl";
784
- /**
785
- * Набор цветов для компонента
786
- */
787
- colors?: "default" | "inverted";
788
- /**
789
- * Заблокированное состояние
790
- */
791
- disabled?: boolean;
792
- /**
793
- * Заполненное состояние
794
- */
795
- filled?: boolean;
796
- /**
797
- * Выбранное (фокус) состояние
798
- */
799
- focused?: boolean;
800
- /**
801
- * Отображение ошибки
802
- */
803
- error?: ReactNode | boolean;
804
- /**
805
- * Текст подсказки
806
- */
807
- hint?: ReactNode;
808
- /**
809
- * Лейбл компонента
810
- */
811
- label?: ReactNode;
812
- /**
813
- * Слот слева
814
- */
815
- leftAddons?: ReactNode;
816
- /**
817
- * Слот справа
818
- */
819
- rightAddons?: ReactNode;
820
- /**
821
- * Слот под полем
822
- */
823
- bottomAddons?: ReactNode;
824
- /**
825
- * Дополнительный класс
826
- */
827
- className?: string;
828
- /**
829
- * Дополнительный класс для поля
830
- */
831
- fieldClassName?: string;
832
- /**
833
- * Дополнительный класс для лейбла
834
- */
835
- labelClassName?: string;
836
- /**
837
- * Дополнительный класс для аддонов
838
- */
839
- addonsClassName?: string;
840
- /**
841
- * Идентификатор для систем автоматизированного тестирования
842
- */
843
- dataTestId?: string;
844
- /**
845
- * Компонент поля (инпут, textarea и пр.)
846
- */
847
- children?: ReactNode;
848
- };
849
- declare const FormControl: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLDivElement> & {
850
- block?: boolean | undefined;
851
- size?: "s" | "m" | "l" | "xl" | undefined;
852
- colors?: "default" | "inverted" | undefined;
853
- disabled?: boolean | undefined;
854
- filled?: boolean | undefined;
855
- focused?: boolean | undefined;
856
- error?: React.ReactNode;
857
- hint?: React.ReactNode;
858
- label?: React.ReactNode;
859
- leftAddons?: React.ReactNode;
860
- rightAddons?: React.ReactNode;
861
- bottomAddons?: React.ReactNode;
862
- className?: string | undefined;
863
- fieldClassName?: string | undefined;
864
- labelClassName?: string | undefined;
865
- addonsClassName?: string | undefined;
866
- dataTestId?: string | undefined;
867
- children?: React.ReactNode;
868
- } & React.RefAttributes<HTMLDivElement>>;
869
- type BaseFieldProps = FieldProps;
870
- type FieldProps$0 = Omit<BaseFieldProps, 'size' | 'hint' | 'success' | 'error' | 'placeholder'> & ButtonProps & {
871
- buttonSize?: PickerButtonSize;
865
+ position?: 'before' | 'after';
872
866
  };
873
- declare const Field: ({ buttonSize, view, label, open, multiple, rightAddons, Arrow, innerProps, className, selected, selectedMultiple, valueRenderer, ...restProps }: FieldProps$0) => JSX.Element;
874
- export { __extends, __rest, __decorate, __param, __metadata, __awaiter, __generator, __exportStar, __values, __read, __spread, __spreadArrays, __await, __asyncGenerator, __asyncDelegator, __asyncValues, __makeTemplateObject, __importStar, __importDefault, __classPrivateFieldGet, __classPrivateFieldSet, __assign, __createBinding, OptionShape, GroupShape, BaseSelectProps, FieldProps, ArrowProps, OptionsListProps, OptgroupProps, OptionProps, CheckmarkProps, stackingOrder, StackingContext, StackProps, Stack, PortalProps, Portal, PORTAL_CONTAINER_ATTRIBUTE, getDefaultPortalContainer, setRef, FormControlProps, FormControl, Field };
867
+ export { Position, PopoverProps, Popover, InputProps, Input, stackingOrder, StackingContext, StackProps, Stack, PortalProps, Portal, PORTAL_CONTAINER_ATTRIBUTE, getDefaultPortalContainer, setRef, FormControlProps, FormControl, OptionShape, GroupShape, BaseSelectProps, FieldProps, ArrowProps, OptionsListProps, OptgroupProps, OptionProps, CheckmarkProps };
@@ -0,0 +1,4 @@
1
+ import { FC, SVGProps } from 'react';
2
+ import { PickerButtonVariant } from "../index";
3
+ declare const getIcon: (variant: PickerButtonVariant, size: "s" | "xxs" | "xs" | "m" | "l" | "xl") => FC<SVGProps<SVGSVGElement>>;
4
+ export { getIcon };
@@ -0,0 +1,13 @@
1
+ import { ChevronDownMIcon } from '@alfalab/icons-glyph/ChevronDownMIcon';
2
+ import { ChevronDownCompactSIcon } from '@alfalab/icons-glyph/ChevronDownCompactSIcon';
3
+ import { MoreMIcon } from '@alfalab/icons-glyph/MoreMIcon';
4
+ import { MoreSIcon } from '@alfalab/icons-glyph/MoreSIcon';
5
+
6
+ var getIcon = function (variant, size) {
7
+ if (variant === 'compact') {
8
+ return size === 'xxs' ? MoreSIcon : MoreMIcon;
9
+ }
10
+ return size === 'xxs' ? ChevronDownCompactSIcon : ChevronDownMIcon;
11
+ };
12
+
13
+ export { getIcon };
@@ -0,0 +1,10 @@
1
+ /// <reference types="react" />
2
+ import { ButtonProps } from "@alfalab/core-components-button";
3
+ import { FieldProps as BaseFieldProps } from "../typings-a22d6eaf";
4
+ import { PickerButtonSize, PickerButtonVariant } from "../Component";
5
+ type FieldProps = Omit<BaseFieldProps, 'size' | 'hint' | 'success' | 'error' | 'placeholder'> & ButtonProps & {
6
+ buttonSize?: PickerButtonSize;
7
+ buttonVariant?: PickerButtonVariant;
8
+ };
9
+ declare const Field: ({ buttonSize, buttonVariant, view, label, open, multiple, rightAddons, Arrow, innerProps, className, selected, selectedMultiple, valueRenderer, ...restProps }: FieldProps) => JSX.Element;
10
+ export { Field };
@@ -2,13 +2,32 @@
2
2
 
3
3
  Object.defineProperty(exports, '__esModule', { value: true });
4
4
 
5
- var field_Component = require('../Component-52c236b9.js');
6
- require('react');
7
- require('classnames');
8
- require('@alfalab/core-components-button');
9
- require('@alfalab/icons-classic/ArrowDownMIcon');
10
- require('@alfalab/icons-classic/ArrowDownSIcon');
5
+ var tslib_es6 = require('../tslib.es6-b5c82847.js');
6
+ var React = require('react');
7
+ var cn = require('classnames');
8
+ var coreComponentsButton = require('@alfalab/core-components-button');
9
+ require('@alfalab/icons-glyph/ChevronDownMIcon');
10
+ require('@alfalab/icons-glyph/ChevronDownCompactSIcon');
11
+ require('@alfalab/icons-glyph/MoreMIcon');
12
+ require('@alfalab/icons-glyph/MoreSIcon');
13
+ var utils_index = require('../utils/index.js');
11
14
 
15
+ function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
12
16
 
17
+ var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
18
+ var cn__default = /*#__PURE__*/_interopDefaultLegacy(cn);
13
19
 
14
- exports.Field = field_Component.Field;
20
+ var styles = {"iconContainer":"picker-button__iconContainer_18u4x","open":"picker-button__open_18u4x"};
21
+ require('./index.css')
22
+
23
+ var Field = function (_a) {
24
+ var _b = _a.buttonSize, buttonSize = _b === void 0 ? 'm' : _b, _c = _a.buttonVariant, buttonVariant = _c === void 0 ? 'default' : _c, view = _a.view, label = _a.label, open = _a.open, multiple = _a.multiple, rightAddons = _a.rightAddons, Arrow = _a.Arrow, innerProps = _a.innerProps, className = _a.className, selected = _a.selected, selectedMultiple = _a.selectedMultiple, valueRenderer = _a.valueRenderer, restProps = tslib_es6.__rest(_a, ["buttonSize", "buttonVariant", "view", "label", "open", "multiple", "rightAddons", "Arrow", "innerProps", "className", "selected", "selectedMultiple", "valueRenderer"]);
25
+ var Icon = utils_index.getIcon(buttonVariant, buttonSize);
26
+ var ref = innerProps.ref, restInnerProps = tslib_es6.__rest(innerProps, ["ref"]);
27
+ var buttonProps = tslib_es6.__assign(tslib_es6.__assign({}, restProps), restInnerProps);
28
+ return (React__default['default'].createElement("div", { ref: ref },
29
+ React__default['default'].createElement(coreComponentsButton.Button, tslib_es6.__assign({}, buttonProps, { rightAddons: rightAddons !== null && rightAddons !== void 0 ? rightAddons : (React__default['default'].createElement("span", { className: cn__default['default'](styles.iconContainer, buttonVariant !== 'compact' && open && styles.open) },
30
+ React__default['default'].createElement(Icon, { "data-test-id": 'picker-button-icon' }))), block: true, view: view, size: buttonSize, className: cn__default['default'](styles.component, view === 'primary' && styles.primary, className) }), buttonVariant !== 'compact' && label)));
31
+ };
32
+
33
+ exports.Field = Field;
@@ -1,4 +1,4 @@
1
- /* hash: 730bk */
1
+ /* hash: 4hptb */
2
2
  :root {
3
3
 
4
4
  /* Hard */
@@ -10,10 +10,10 @@
10
10
  :root {
11
11
  --arrow-transform: rotate(180deg);
12
12
  }
13
- .picker-button__iconContainer_gcut4 {
13
+ .picker-button__iconContainer_18u4x {
14
14
  display: flex;
15
15
  transition: transform 0.15s ease-in-out;
16
16
  }
17
- .picker-button__open_gcut4 {
17
+ .picker-button__open_18u4x {
18
18
  transform: var(--arrow-transform);
19
19
  }
@@ -1 +1 @@
1
- export * from "../Component-52c236b9";
1
+ export * from "./Component";
@@ -2,12 +2,16 @@
2
2
 
3
3
  Object.defineProperty(exports, '__esModule', { value: true });
4
4
 
5
- var field_Component = require('../Component-52c236b9.js');
5
+ require('../tslib.es6-b5c82847.js');
6
6
  require('react');
7
7
  require('classnames');
8
8
  require('@alfalab/core-components-button');
9
- require('@alfalab/icons-classic/ArrowDownMIcon');
10
- require('@alfalab/icons-classic/ArrowDownSIcon');
9
+ require('@alfalab/icons-glyph/ChevronDownMIcon');
10
+ require('@alfalab/icons-glyph/ChevronDownCompactSIcon');
11
+ require('@alfalab/icons-glyph/MoreMIcon');
12
+ require('@alfalab/icons-glyph/MoreSIcon');
13
+ require('../utils/index.js');
14
+ var field_Component = require('./Component.js');
11
15
 
12
16
 
13
17
 
package/dist/index.css CHANGED
@@ -1,4 +1,4 @@
1
- /* hash: 11tf9 */
1
+ /* hash: z84rf */
2
2
  :root {
3
3
 
4
4
  /* Hard */
@@ -9,19 +9,23 @@
9
9
  }
10
10
  :root {
11
11
  --gap-xs: 8px;
12
+ --gap-m: 16px;
12
13
  }
13
14
  :root {
14
15
  --border-radius-s: 4px;
15
16
  }
16
- .picker-button__container_1b5wz {
17
+ .picker-button__container_1mcgq {
17
18
  min-width: auto;
18
19
  }
19
- .picker-button__optionsPopover_1b5wz {
20
+ .picker-button__optionsPopover_1mcgq {
20
21
  padding: var(--gap-xs) 0
21
22
  }
22
- .picker-button__optionsPopover_1b5wz.picker-button__sideGap_1b5wz {
23
+ .picker-button__optionsPopover_1mcgq.picker-button__sideGap_1mcgq {
23
24
  padding: 0 var(--gap-xs);
24
25
  }
25
- .picker-button__optionsListContainer_1b5wz {
26
+ .picker-button__optionsListContainer_1mcgq {
26
27
  border-radius: var(--border-radius-s);
27
28
  }
29
+ .picker-button__option_1mcgq {
30
+ padding: 0 var(--gap-m);
31
+ }