@astral/ui 4.2.3 → 4.4.0

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 (65) hide show
  1. package/components/DataGrid/DataGrid.d.ts +2 -162
  2. package/components/DataGrid/DataGrid.js +2 -2
  3. package/components/DataGrid/types.d.ts +164 -0
  4. package/components/DataGrid/useLogic/useLogic.d.ts +3 -3
  5. package/components/DataGrid/useLogic/useLogic.js +3 -1
  6. package/components/DataGridInfinite/DataGridInfinite.d.ts +2 -15
  7. package/components/DataGridInfinite/DataGridInfinite.js +2 -2
  8. package/components/DataGridInfinite/index.d.ts +1 -0
  9. package/components/DataGridInfinite/types.d.ts +19 -0
  10. package/components/DataGridInfinite/types.js +1 -0
  11. package/components/DataGridInfinite/useLogic/useLogic.d.ts +3 -2
  12. package/components/DataGridInfinite/useLogic/useLogic.js +3 -1
  13. package/icons/LogoFillMd/CryptoProFillMd.d.ts +4 -0
  14. package/icons/LogoFillMd/CryptoProFillMd.js +4 -0
  15. package/icons/LogoFillMd/GoogleMonochromeFillMd.d.ts +4 -0
  16. package/icons/LogoFillMd/GoogleMonochromeFillMd.js +4 -0
  17. package/icons/LogoFillMd/JacartaFillMd.d.ts +4 -0
  18. package/icons/LogoFillMd/JacartaFillMd.js +4 -0
  19. package/icons/LogoFillMd/OkMonochromeFillMd.d.ts +4 -0
  20. package/icons/LogoFillMd/OkMonochromeFillMd.js +4 -0
  21. package/icons/LogoFillMd/RutokenFillMd.d.ts +4 -0
  22. package/icons/LogoFillMd/RutokenFillMd.js +4 -0
  23. package/icons/LogoFillMd/TelegramIconMonochromeFillMd.d.ts +4 -0
  24. package/icons/LogoFillMd/TelegramIconMonochromeFillMd.js +4 -0
  25. package/icons/LogoFillMd/TelegramMonochromeFillMd.d.ts +4 -0
  26. package/icons/LogoFillMd/TelegramMonochromeFillMd.js +4 -0
  27. package/icons/LogoFillMd/VkMonochromeFillMd.d.ts +4 -0
  28. package/icons/LogoFillMd/VkMonochromeFillMd.js +4 -0
  29. package/icons/LogoFillMd/YoutubeMonochromeFillMd.d.ts +4 -0
  30. package/icons/LogoFillMd/YoutubeMonochromeFillMd.js +4 -0
  31. package/icons/LogoFillMd/index.d.ts +9 -0
  32. package/icons/LogoFillMd/index.js +9 -0
  33. package/node/components/DataGrid/DataGrid.d.ts +2 -162
  34. package/node/components/DataGrid/DataGrid.js +2 -2
  35. package/node/components/DataGrid/types.d.ts +164 -0
  36. package/node/components/DataGrid/useLogic/useLogic.d.ts +3 -3
  37. package/node/components/DataGrid/useLogic/useLogic.js +3 -1
  38. package/node/components/DataGridInfinite/DataGridInfinite.d.ts +2 -15
  39. package/node/components/DataGridInfinite/DataGridInfinite.js +2 -2
  40. package/node/components/DataGridInfinite/index.d.ts +1 -0
  41. package/node/components/DataGridInfinite/types.d.ts +19 -0
  42. package/node/components/DataGridInfinite/types.js +2 -0
  43. package/node/components/DataGridInfinite/useLogic/useLogic.d.ts +3 -2
  44. package/node/components/DataGridInfinite/useLogic/useLogic.js +3 -1
  45. package/node/icons/LogoFillMd/CryptoProFillMd.d.ts +4 -0
  46. package/node/icons/LogoFillMd/CryptoProFillMd.js +6 -0
  47. package/node/icons/LogoFillMd/GoogleMonochromeFillMd.d.ts +4 -0
  48. package/node/icons/LogoFillMd/GoogleMonochromeFillMd.js +6 -0
  49. package/node/icons/LogoFillMd/JacartaFillMd.d.ts +4 -0
  50. package/node/icons/LogoFillMd/JacartaFillMd.js +6 -0
  51. package/node/icons/LogoFillMd/OkMonochromeFillMd.d.ts +4 -0
  52. package/node/icons/LogoFillMd/OkMonochromeFillMd.js +6 -0
  53. package/node/icons/LogoFillMd/RutokenFillMd.d.ts +4 -0
  54. package/node/icons/LogoFillMd/RutokenFillMd.js +6 -0
  55. package/node/icons/LogoFillMd/TelegramIconMonochromeFillMd.d.ts +4 -0
  56. package/node/icons/LogoFillMd/TelegramIconMonochromeFillMd.js +6 -0
  57. package/node/icons/LogoFillMd/TelegramMonochromeFillMd.d.ts +4 -0
  58. package/node/icons/LogoFillMd/TelegramMonochromeFillMd.js +6 -0
  59. package/node/icons/LogoFillMd/VkMonochromeFillMd.d.ts +4 -0
  60. package/node/icons/LogoFillMd/VkMonochromeFillMd.js +6 -0
  61. package/node/icons/LogoFillMd/YoutubeMonochromeFillMd.d.ts +4 -0
  62. package/node/icons/LogoFillMd/YoutubeMonochromeFillMd.js +6 -0
  63. package/node/icons/LogoFillMd/index.d.ts +9 -0
  64. package/node/icons/LogoFillMd/index.js +19 -1
  65. package/package.json +1 -1
@@ -1,163 +1,3 @@
1
- import { type ReactNode } from 'react';
2
- import { Variant } from './enums';
3
- import { type NoDataProps } from './NoData';
4
- import type { CellValue, DataGridColumns, DataGridRow, DataGridRowWithOptions, DataGridSort } from './types';
5
- export type DataGridProps<TData extends Record<string, CellValue> = DataGridRow, TSortField extends keyof TData = keyof TData> = {
6
- /**
7
- * Название класса, применяется к корневому компоненту
8
- */
9
- className?: string;
10
- /**
11
- * Массив данных для таблицы
12
- */
13
- rows: DataGridRowWithOptions<TData>[];
14
- /**
15
- * @example <DataGrid columns={[
16
- * {
17
- * field: 'test',
18
- * label: 'Тестовая колонка',
19
- * sortable: true,
20
- * }]} />
21
- * Конфигурация колонок для таблицы
22
- */
23
- columns: DataGridColumns<TData>[];
24
- /**
25
- * Идентификатор активного элемента массива rows. Выделяет активную строку в таблице
26
- */
27
- activeRowId?: string;
28
- /**
29
- * Поле, которое будет использоваться в качестве ключа
30
- */
31
- keyId: keyof TData;
32
- /**
33
- * @example <DataGrid selectedRows={[{name: 'test'}]} />
34
- * Массив выбранных строк
35
- */
36
- selectedRows?: TData[];
37
- /**
38
- * @example <DataGrid sorting={{fieldId: 'test', sort: 'asc'}} />
39
- * Параметры сортируемой колонки
40
- */
41
- sorting?: DataGridSort<TSortField>;
42
- /**
43
- * Компонент кастомного футера (например Pagination)
44
- */
45
- footer?: ReactNode;
46
- /**
47
- * Используется для отображения placeholder при отсутствии данных в таблице
48
- */
49
- noDataPlaceholder?: ReactNode;
50
- /**
51
- * Максимальная высота для таблицы
52
- */
53
- maxHeight?: number;
54
- /**
55
- * Если true, показывается анимация загрузки
56
- */
57
- isLoading?: boolean;
58
- /**
59
- * Если true, таблица будет заблокирована для взаимодействия
60
- */
61
- isDisabled?: boolean;
62
- /**
63
- * Флаг состояния ошибки
64
- */
65
- isError?: boolean;
66
- /**
67
- * Текст ошибки
68
- */
69
- errorMsg?: string;
70
- /**
71
- * Вариант отображения вложенных элементов
72
- * @default 'tree'
73
- */
74
- variant?: `${Variant}`;
75
- /**
76
- * Опции для отображения древовидных списков
77
- * Применяется если variant="tree"
78
- */
79
- tree?: {
80
- /**
81
- * Если true, то дерево будет раскрыто по умолчанию
82
- * @default 'false'
83
- */
84
- isInitialExpanded?: boolean;
85
- /**
86
- * Уровень раскрытия дерева по умолчанию, при `isInitialExpanded=true`
87
- * @default '1'
88
- */
89
- expandedLevel?: number;
90
- /**
91
- * Количество отображаемых по умолчанию дочерних элементов
92
- * @default '2'
93
- */
94
- initialVisibleChildrenCount?: number;
95
- };
96
- /**
97
- * Опции для отображения вложенных списков
98
- * Применяется если variant="subrows"
99
- */
100
- subrows?: {
101
- /**
102
- * Уровень раскрытия дочерних элементов по умолчанию, при `isInitialExpanded=true`
103
- * @default '1'
104
- */
105
- expandedLevel?: number;
106
- /**
107
- * Количество отображаемых по умолчанию дочерних элементов
108
- * @default '2'
109
- */
110
- initialVisibleChildrenCount?: number;
111
- /**
112
- * Номер колонки, в которой будет расположена кнопка "Показать все"
113
- * @default 1
114
- */
115
- moreButtonColumnPosition?: number;
116
- /**
117
- * Если false, кнопка разворачивания элементов не показывается
118
- * @default true
119
- */
120
- isVisibleCollapseButton?: boolean;
121
- };
122
- /**
123
- * Заглушка для пустых ячеек (если отсутствует field и filter и renderCell)
124
- * @default '—'
125
- */
126
- emptyCellValue?: ReactNode;
127
- /**
128
- * Используется для отображения переданного кол-ва строк при отсутствии данных
129
- * @default 10
130
- */
131
- minDisplayRows?: number;
132
- /**
133
- * Функция обработки нажатия на кнопку "Повторить запрос"
134
- */
135
- onRetry: () => void;
136
- /**
137
- * Обработчик клика строки таблицы
138
- */
139
- onRowClick?: (row: TData) => void;
140
- /**
141
- * Обработчик выбора строки
142
- */
143
- onSelectRow?: (row: TData[]) => void;
144
- /**
145
- * @example <DataGrid onSort={({fieldId: 'test', sort: 'asc'}) => console.log('sorted')} />
146
- * Обработчик сортировки
147
- */
148
- onSort?: (sorting: DataGridSort<TSortField> | undefined) => void;
149
- /**
150
- * Используется для кастомизации компонента, использующегося в сценарии отсутствия данных
151
- */
152
- noDataOptions?: NoDataProps;
153
- /**
154
- * Используется для скрытия чекбокса "Выбрать все"
155
- */
156
- isHideSelectAll?: boolean;
157
- /**
158
- * Место для рендера перед head страницы
159
- * @private Предполагается для использования в реализации изменения размеров таблицы
160
- */
161
- headPreAddon?: ReactNode;
162
- };
1
+ /// <reference types="react" />
2
+ import { type DataGridProps, type DataGridRow } from './types';
163
3
  export declare const DataGrid: <TData extends Record<string, unknown> = DataGridRow, TSortField extends keyof TData = keyof TData>(props: DataGridProps<TData, TSortField>) => JSX.Element;
@@ -12,7 +12,7 @@ import { NoData } from './NoData';
12
12
  import { Container, DataGridWrapper, DisabledDataGridWrapper } from './styles';
13
13
  import { useLogic } from './useLogic';
14
14
  export const DataGrid = (props) => {
15
- const { isDataGridDisabled, treeRenderConfig, headProps, bodyProps, loaderProps, renderRows, isAllowHorizontalScroll, } = useLogic(props);
15
+ const { isDataGridDisabled, treeRenderConfig, headProps, bodyProps, loaderProps, renderRows, isAllowHorizontalScroll, isHideHead, } = useLogic(props);
16
16
  const { emptySymbol } = useContext(ConfigContext);
17
17
  const { columns, selectedRows = [], sorting, maxHeight, minDisplayRows = MIN_DISPLAY_ROWS_BY_DEFAULT, errorMsg, variant = Variant.Tree, footer, noDataPlaceholder, isLoading, isError, subrows, keyId, activeRowId, emptyCellValue = emptySymbol, className, onRowClick, onSort, noDataOptions, onRetry, headPreAddon, } = props;
18
18
  const { moreButtonColumnPosition = 1, isVisibleCollapseButton = true } = subrows || {};
@@ -26,5 +26,5 @@ export const DataGrid = (props) => {
26
26
  }
27
27
  return null;
28
28
  }, [noDataPlaceholder, noDataOptions, isLoading]);
29
- return (_jsx(DataGridContextProvider, { isLoading: isLoading, children: _jsxs(Container, { "$maxHeight": maxHeight, "$isAllowHorizontalScroll": isAllowHorizontalScroll, className: classNames(dataGridClassnames.root, className), children: [_jsxs(TableContainer, { "$isAllowHorizontalScroll": isAllowHorizontalScroll, inert: isDataGridDisabled ? '' : undefined, children: [headPreAddon, _jsx(Head, { ...headProps, sorting: sorting, onSort: onSort }), _jsx(Body, { ...bodyProps, activeRowId: activeRowId, keyId: keyId, selectedRows: selectedRows, minDisplayRows: minDisplayRows, rows: renderRows, columns: columns, variant: variant, emptyCellValue: emptyCellValue, isInitialExpanded: isInitialExpanded, expandedLevel: expandedLevel, initialVisibleChildrenCount: initialVisibleChildrenCount, moreButtonColumnPosition: moreButtonColumnPosition, isVisibleCollapseButton: isVisibleCollapseButton, isLoading: isLoading, isError: isError, errorMsg: errorMsg, noDataPlaceholder: renderedPlaceholder(), onRowClick: onRowClick, onRetry: onRetry })] }), _jsx(Loader, { ...loaderProps }), footer && footer] }) }));
29
+ return (_jsx(DataGridContextProvider, { isLoading: isLoading, children: _jsxs(Container, { "$maxHeight": maxHeight, "$isAllowHorizontalScroll": isAllowHorizontalScroll, className: classNames(dataGridClassnames.root, className), children: [_jsxs(TableContainer, { "$isAllowHorizontalScroll": isAllowHorizontalScroll, inert: isDataGridDisabled ? '' : undefined, children: [headPreAddon, !isHideHead && (_jsx(Head, { ...headProps, sorting: sorting, onSort: onSort })), _jsx(Body, { ...bodyProps, activeRowId: activeRowId, keyId: keyId, selectedRows: selectedRows, minDisplayRows: minDisplayRows, rows: renderRows, columns: columns, variant: variant, emptyCellValue: emptyCellValue, isInitialExpanded: isInitialExpanded, expandedLevel: expandedLevel, initialVisibleChildrenCount: initialVisibleChildrenCount, moreButtonColumnPosition: moreButtonColumnPosition, isVisibleCollapseButton: isVisibleCollapseButton, isLoading: isLoading, isError: isError, errorMsg: errorMsg, noDataPlaceholder: renderedPlaceholder(), onRowClick: onRowClick, onRetry: onRetry })] }), _jsx(Loader, { ...loaderProps }), footer && footer] }) }));
30
30
  };
@@ -1,9 +1,173 @@
1
1
  import { type CSSProperties, type ReactNode } from 'react';
2
2
  import { type Target } from '../utils';
3
+ import { type Variant } from './enums';
4
+ import type { NoDataProps } from './NoData';
3
5
  export type AlignVariant = 'left' | 'center' | 'right';
4
6
  export type SortState = 'asc' | 'desc';
5
7
  export type RenderCell<TData> = (params: TData) => ReactNode;
6
8
  export type CellValue = unknown;
9
+ export type DataGridProps<TData extends Record<string, CellValue> = DataGridRow, TSortField extends keyof TData = keyof TData> = {
10
+ /**
11
+ * Название класса, применяется к корневому компоненту
12
+ */
13
+ className?: string;
14
+ /**
15
+ * Массив данных для таблицы
16
+ */
17
+ rows: DataGridRowWithOptions<TData>[];
18
+ /**
19
+ * @example <DataGrid columns={[
20
+ * {
21
+ * field: 'test',
22
+ * label: 'Тестовая колонка',
23
+ * sortable: true,
24
+ * }]} />
25
+ * Конфигурация колонок для таблицы
26
+ */
27
+ columns: DataGridColumns<TData>[];
28
+ /**
29
+ * Идентификатор активного элемента массива rows. Выделяет активную строку в таблице
30
+ */
31
+ activeRowId?: string;
32
+ /**
33
+ * Поле, которое будет использоваться в качестве ключа
34
+ */
35
+ keyId: keyof TData;
36
+ /**
37
+ * @example <DataGrid selectedRows={[{name: 'test'}]} />
38
+ * Массив выбранных строк
39
+ */
40
+ selectedRows?: TData[];
41
+ /**
42
+ * @example <DataGrid sorting={{fieldId: 'test', sort: 'asc'}} />
43
+ * Параметры сортируемой колонки
44
+ */
45
+ sorting?: DataGridSort<TSortField>;
46
+ /**
47
+ * Компонент кастомного футера (например Pagination)
48
+ */
49
+ footer?: ReactNode;
50
+ /**
51
+ * Используется для отображения placeholder при отсутствии данных в таблице
52
+ */
53
+ noDataPlaceholder?: ReactNode;
54
+ /**
55
+ * Максимальная высота для таблицы
56
+ */
57
+ maxHeight?: number;
58
+ /**
59
+ * Если true, показывается анимация загрузки
60
+ */
61
+ isLoading?: boolean;
62
+ /**
63
+ * Если true, таблица будет заблокирована для взаимодействия
64
+ */
65
+ isDisabled?: boolean;
66
+ /**
67
+ * Флаг состояния ошибки
68
+ */
69
+ isError?: boolean;
70
+ /**
71
+ * Текст ошибки
72
+ */
73
+ errorMsg?: string;
74
+ /**
75
+ * Вариант отображения вложенных элементов
76
+ * @default 'tree'
77
+ */
78
+ variant?: `${Variant}`;
79
+ /**
80
+ * Опции для отображения древовидных списков
81
+ * Применяется если variant="tree"
82
+ */
83
+ tree?: {
84
+ /**
85
+ * Если true, то дерево будет раскрыто по умолчанию
86
+ * @default 'false'
87
+ */
88
+ isInitialExpanded?: boolean;
89
+ /**
90
+ * Уровень раскрытия дерева по умолчанию, при `isInitialExpanded=true`
91
+ * @default '1'
92
+ */
93
+ expandedLevel?: number;
94
+ /**
95
+ * Количество отображаемых по умолчанию дочерних элементов
96
+ * @default '2'
97
+ */
98
+ initialVisibleChildrenCount?: number;
99
+ };
100
+ /**
101
+ * Опции для отображения вложенных списков
102
+ * Применяется если variant="subrows"
103
+ */
104
+ subrows?: {
105
+ /**
106
+ * Уровень раскрытия дочерних элементов по умолчанию, при `isInitialExpanded=true`
107
+ * @default '1'
108
+ */
109
+ expandedLevel?: number;
110
+ /**
111
+ * Количество отображаемых по умолчанию дочерних элементов
112
+ * @default '2'
113
+ */
114
+ initialVisibleChildrenCount?: number;
115
+ /**
116
+ * Номер колонки, в которой будет расположена кнопка "Показать все"
117
+ * @default 1
118
+ */
119
+ moreButtonColumnPosition?: number;
120
+ /**
121
+ * Если false, кнопка разворачивания элементов не показывается
122
+ * @default true
123
+ */
124
+ isVisibleCollapseButton?: boolean;
125
+ };
126
+ /**
127
+ * Заглушка для пустых ячеек (если отсутствует field и filter и renderCell)
128
+ * @default '—'
129
+ */
130
+ emptyCellValue?: ReactNode;
131
+ /**
132
+ * Используется для отображения переданного кол-ва строк при отсутствии данных
133
+ * @default 10
134
+ */
135
+ minDisplayRows?: number;
136
+ /**
137
+ * Функция обработки нажатия на кнопку "Повторить запрос"
138
+ */
139
+ onRetry: () => void;
140
+ /**
141
+ * Обработчик клика строки таблицы
142
+ */
143
+ onRowClick?: (row: TData) => void;
144
+ /**
145
+ * Обработчик выбора строки
146
+ */
147
+ onSelectRow?: (row: TData[]) => void;
148
+ /**
149
+ * @example <DataGrid onSort={({fieldId: 'test', sort: 'asc'}) => console.log('sorted')} />
150
+ * Обработчик сортировки
151
+ */
152
+ onSort?: (sorting: DataGridSort<TSortField> | undefined) => void;
153
+ /**
154
+ * Используется для кастомизации компонента, использующегося в сценарии отсутствия данных
155
+ */
156
+ noDataOptions?: NoDataProps;
157
+ /**
158
+ * Используется для скрытия чекбокса "Выбрать все"
159
+ */
160
+ isHideSelectAll?: boolean;
161
+ /**
162
+ * Место для рендера перед head страницы
163
+ * @private Предполагается для использования в реализации изменения размеров таблицы
164
+ */
165
+ headPreAddon?: ReactNode;
166
+ /**
167
+ * Убирает шапку таблицы, когда нет данных
168
+ */
169
+ isHideHeaderIfNoData?: boolean;
170
+ };
7
171
  export type DataGridSort<TSortField> = {
8
172
  /**
9
173
  * @example {fieldId: 'test'}
@@ -1,8 +1,7 @@
1
1
  import { type ChangeEvent } from 'react';
2
- import { type DataGridProps } from '../DataGrid';
3
- import type { CellValue, DataGridRow } from '../types';
2
+ import type { CellValue, DataGridProps, DataGridRow } from '../types';
4
3
  type UseLogicParams<TData extends Record<string, CellValue> = DataGridRow, TSortField extends keyof TData = keyof TData> = DataGridProps<TData, TSortField>;
5
- export declare const useLogic: <TData extends Record<string, unknown> = DataGridRow, TSortField extends keyof TData = keyof TData>({ keyId, columns, rows, variant, tree, subrows, selectedRows, isLoading, isDisabled, onSelectRow, isHideSelectAll, }: UseLogicParams<TData, TSortField>) => {
4
+ export declare const useLogic: <TData extends Record<string, unknown> = DataGridRow, TSortField extends keyof TData = keyof TData>({ keyId, columns, rows, variant, tree, subrows, selectedRows, isLoading, isDisabled, onSelectRow, isHideSelectAll, isHideHeaderIfNoData, }: UseLogicParams<TData, TSortField>) => {
6
5
  isDataGridDisabled: boolean | undefined;
7
6
  treeRenderConfig: {
8
7
  isInitialExpanded?: boolean | undefined;
@@ -11,6 +10,7 @@ export declare const useLogic: <TData extends Record<string, unknown> = DataGrid
11
10
  } | undefined;
12
11
  renderRows: TData[];
13
12
  isAllowHorizontalScroll: boolean;
13
+ isHideHead: boolean;
14
14
  headProps: {
15
15
  rowsCount: number;
16
16
  uncheckedRowsCount: number;
@@ -3,7 +3,7 @@ import { useFirstMountState } from '../../hooks';
3
3
  import { prop, uniqueBy } from '../../utils';
4
4
  import { Variant } from '../enums';
5
5
  import { getGridTemplateColumns, getIsAllowHorizontalScroll } from './utils';
6
- export const useLogic = ({ keyId, columns, rows = [], variant, tree, subrows, selectedRows = [], isLoading, isDisabled, onSelectRow, isHideSelectAll, }) => {
6
+ export const useLogic = ({ keyId, columns, rows = [], variant, tree, subrows, selectedRows = [], isLoading, isDisabled, onSelectRow, isHideSelectAll, isHideHeaderIfNoData = false, }) => {
7
7
  const isFirstRender = useFirstMountState();
8
8
  const isSelectable = Boolean(onSelectRow);
9
9
  const isDataGridDisabled = isLoading || isDisabled;
@@ -54,11 +54,13 @@ export const useLogic = ({ keyId, columns, rows = [], variant, tree, subrows, se
54
54
  }
55
55
  onSelectRow(selectedRowsRef.current.filter((selectedRow) => selectedRow[keyId] !== row[keyId]));
56
56
  };
57
+ const isHideHead = isHideHeaderIfNoData && rows.length === 0;
57
58
  return {
58
59
  isDataGridDisabled,
59
60
  treeRenderConfig,
60
61
  renderRows,
61
62
  isAllowHorizontalScroll,
63
+ isHideHead,
62
64
  headProps: {
63
65
  rowsCount: availableRows.length,
64
66
  uncheckedRowsCount,
@@ -1,17 +1,4 @@
1
1
  /// <reference types="react" />
2
- import { type CellValue, type DataGridProps, type DataGridRow } from '../DataGrid';
3
- export type DataGridInfiniteProps<TData extends Record<string, CellValue> = DataGridRow, TSortField extends keyof TData = keyof TData> = Omit<DataGridProps<TData, TSortField>, 'footer' | 'minDisplayRows'> & {
4
- /**
5
- * Флаг достижения конца списка
6
- */
7
- isEndReached?: boolean;
8
- /**
9
- * Текст достижения конца списка
10
- */
11
- endOfScrollMsg?: string;
12
- /**
13
- * Обработчик подгрузки данных
14
- */
15
- onEndReached?: () => void;
16
- };
2
+ import { type DataGridRow } from '../DataGrid';
3
+ import { type DataGridInfiniteProps } from './types';
17
4
  export declare const DataGridInfinite: <TData extends Record<string, unknown> = DataGridRow, TSortField extends keyof TData = keyof TData>(props: DataGridInfiniteProps<TData, TSortField>) => JSX.Element;
@@ -18,12 +18,12 @@ import { useLogic } from './useLogic';
18
18
  const INITIAL_LEVEL = 0;
19
19
  export const DataGridInfinite = (props) => {
20
20
  const { imagesMap, emptySymbol } = useContext(ConfigContext);
21
- const { isNoData, isDataGridDisabled, isStickyButtonActive, treeRenderConfig, virtuosoProps, headProps, rowProps, scrollToTopButtonProps, isEndReached, } = useLogic(props);
21
+ const { isNoData, isDataGridDisabled, isStickyButtonActive, treeRenderConfig, virtuosoProps, headProps, rowProps, scrollToTopButtonProps, isEndReached, isHideHead, } = useLogic(props);
22
22
  const { columns, rows = [], selectedRows = [], sorting, maxHeight, isLoading, isDisabled, keyId, activeRowId, emptyCellValue = emptySymbol, variant = Variant.Tree, subrows, className, isError, endOfScrollMsg, errorMsg, noDataPlaceholder, onRowClick, onSort, onRetry, headPreAddon, } = props;
23
23
  const { moreButtonColumnPosition = 1, isVisibleCollapseButton = true } = subrows || {};
24
24
  const { isInitialExpanded = false, expandedLevel = EXPANDED_LEVEL_BY_DEFAULT, initialVisibleChildrenCount = INITIAL_OPENED_NESTED_CHILDREN_COUNT_BY_DEFAULT, } = treeRenderConfig || {};
25
25
  const TableContainer = isDisabled ? DisabledDataGridWrapper : DataGridWrapper;
26
- return (_jsx(DataGridContextProvider, { children: _jsxs(Container, { "$maxHeight": maxHeight, className: classNames(dataGridClassnames.root, className), children: [headPreAddon, _jsxs(TableContainer, { inert: isDataGridDisabled ? '' : undefined, children: [_jsx(Head, { ...headProps, onSort: onSort, sorting: sorting, columns: columns }), _jsx(ContentState, { isLoading: isLoading && !isNoData, loadingTitle: "\u0417\u0430\u0433\u0440\u0443\u0437\u043A\u0430 \u0434\u0430\u043D\u043D\u044B\u0445", isError: isError && !isNoData, errorState: {
26
+ return (_jsx(DataGridContextProvider, { children: _jsxs(Container, { "$maxHeight": maxHeight, className: classNames(dataGridClassnames.root, className), children: [headPreAddon, _jsxs(TableContainer, { inert: isDataGridDisabled ? '' : undefined, children: [!isHideHead && (_jsx(Head, { ...headProps, onSort: onSort, sorting: sorting, columns: columns })), _jsx(ContentState, { isLoading: isLoading && !isNoData, loadingTitle: "\u0417\u0430\u0433\u0440\u0443\u0437\u043A\u0430 \u0434\u0430\u043D\u043D\u044B\u0445", isError: isError && !isNoData, errorState: {
27
27
  imgAlt: 'Что-то пошло не так',
28
28
  errorList: [errorMsg || ''],
29
29
  imgSrc: imagesMap.defaultErrorImgSrc,
@@ -1 +1,2 @@
1
1
  export * from './DataGridInfinite';
2
+ export type { DataGridInfiniteProps } from './types';
@@ -0,0 +1,19 @@
1
+ import type { CellValue, DataGridProps, DataGridRow } from '../DataGrid';
2
+ export type DataGridInfiniteProps<TData extends Record<string, CellValue> = DataGridRow, TSortField extends keyof TData = keyof TData> = Omit<DataGridProps<TData, TSortField>, 'footer' | 'minDisplayRows'> & {
3
+ /**
4
+ * Флаг достижения конца списка
5
+ */
6
+ isEndReached?: boolean;
7
+ /**
8
+ * Текст достижения конца списка
9
+ */
10
+ endOfScrollMsg?: string;
11
+ /**
12
+ * Обработчик подгрузки данных
13
+ */
14
+ onEndReached?: () => void;
15
+ /**
16
+ * Убирает шапку таблицы, когда нет данных
17
+ */
18
+ isHideHeaderIfNoData?: boolean;
19
+ };
@@ -0,0 +1 @@
1
+ export {};
@@ -1,9 +1,9 @@
1
1
  import { type ChangeEvent } from 'react';
2
2
  import type { ListRange, VirtuosoHandle } from 'react-virtuoso';
3
3
  import { type CellValue, type DataGridRow } from '../../DataGrid';
4
- import { type DataGridInfiniteProps } from '../DataGridInfinite';
4
+ import { type DataGridInfiniteProps } from '../types';
5
5
  type UseLogicParams<TData extends Record<string, CellValue> = DataGridRow, TSortField extends keyof TData = keyof TData> = DataGridInfiniteProps<TData, TSortField>;
6
- export declare const useLogic: <TData extends Record<string, unknown> = DataGridRow, TSortField extends keyof TData = keyof TData>({ keyId, columns, rows, variant, tree, subrows, selectedRows, isLoading, isDisabled, isEndReached, onEndReached, onSelectRow, isHideSelectAll, }: UseLogicParams<TData, TSortField>) => {
6
+ export declare const useLogic: <TData extends Record<string, unknown> = DataGridRow, TSortField extends keyof TData = keyof TData>({ keyId, columns, rows, variant, tree, subrows, selectedRows, isLoading, isDisabled, isEndReached, onEndReached, onSelectRow, isHideSelectAll, isHideHeaderIfNoData, }: UseLogicParams<TData, TSortField>) => {
7
7
  isNoData: boolean;
8
8
  isDataGridDisabled: boolean | undefined;
9
9
  isStickyButtonActive: boolean;
@@ -13,6 +13,7 @@ export declare const useLogic: <TData extends Record<string, unknown> = DataGrid
13
13
  initialVisibleChildrenCount?: number | undefined;
14
14
  } | undefined;
15
15
  isEndReached: boolean | undefined;
16
+ isHideHead: boolean;
16
17
  virtuosoProps: {
17
18
  id: string;
18
19
  ref: import("react").RefObject<VirtuosoHandle>;
@@ -4,7 +4,7 @@ import { getGridTemplateColumns } from '../../DataGrid/useLogic/utils';
4
4
  import { useToggle } from '../../hooks';
5
5
  import { prop, uniqueBy } from '../../utils';
6
6
  import { VIRTUOSO_CONTAINER_ID, VIRTUOSO_LIST_ID } from '../constants';
7
- export const useLogic = ({ keyId, columns, rows, variant, tree, subrows, selectedRows = [], isLoading, isDisabled, isEndReached, onEndReached, onSelectRow, isHideSelectAll, }) => {
7
+ export const useLogic = ({ keyId, columns, rows, variant, tree, subrows, selectedRows = [], isLoading, isDisabled, isEndReached, onEndReached, onSelectRow, isHideSelectAll, isHideHeaderIfNoData = false, }) => {
8
8
  const virtuoso = useRef(null);
9
9
  const [hasVerticalScroll, setHasVerticalScroll] = useState(false);
10
10
  const [isStickyButtonActive, showStickyButton, hideStickyButton] = useToggle();
@@ -57,12 +57,14 @@ export const useLogic = ({ keyId, columns, rows, variant, tree, subrows, selecte
57
57
  setHasVerticalScroll(list?.clientHeight > container?.clientHeight);
58
58
  }
59
59
  };
60
+ const isHideHead = isHideHeaderIfNoData && rows.length === 0;
60
61
  return {
61
62
  isNoData,
62
63
  isDataGridDisabled,
63
64
  isStickyButtonActive,
64
65
  treeRenderConfig,
65
66
  isEndReached: isEndReached && hasVerticalScroll,
67
+ isHideHead,
66
68
  virtuosoProps: {
67
69
  id: VIRTUOSO_CONTAINER_ID,
68
70
  ref: virtuoso,
@@ -0,0 +1,4 @@
1
+ import type { FunctionComponent } from 'react';
2
+ import { type SvgIconProps } from '../../components/SvgIcon';
3
+ declare const CryptoProFillMd: FunctionComponent<SvgIconProps>;
4
+ export default CryptoProFillMd;
@@ -0,0 +1,4 @@
1
+ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
2
+ import { SvgIcon } from '../../components/SvgIcon';
3
+ const CryptoProFillMd = ({ ...props }) => (_jsxs(SvgIcon, { ...props, children: [_jsx("path", { d: "M12 2C17.5228 2 22 6.47715 22 12C22 17.5228 17.5228 22 12 22C8.63864 22 5.66653 20.3402 3.85352 17.7969L5.16211 17.0488C6.71036 19.1422 9.19639 20.5 12 20.5C16.6944 20.5 20.5 16.6944 20.5 12C20.5 7.30558 16.6944 3.5 12 3.5C9.19667 3.5 6.7104 4.85715 5.16211 6.9502L3.85352 6.20215C5.66658 3.65922 8.63892 2 12 2Z", fill: "#1366B2" }), _jsx("path", { d: "M9.89709 12.0173L0.886873 17.4551C0.886873 17.4551 5.01299e-05 15.9122 5.0303e-05 12.0173C5.04762e-05 8.12232 0.886873 6.5794 0.886873 6.5794L9.89709 12.0173Z", fill: "#E50909" })] }));
4
+ export default CryptoProFillMd;
@@ -0,0 +1,4 @@
1
+ import type { FunctionComponent } from 'react';
2
+ import { type SvgIconProps } from '../../components/SvgIcon';
3
+ declare const GoogleMonochromeFillMd: FunctionComponent<SvgIconProps>;
4
+ export default GoogleMonochromeFillMd;
@@ -0,0 +1,4 @@
1
+ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
2
+ import { SvgIcon } from '../../components/SvgIcon';
3
+ const GoogleMonochromeFillMd = ({ ...props }) => (_jsxs(SvgIcon, { ...props, children: [_jsx("path", { d: "m6.432 14.086-.696 2.6-2.544.053A9.96 9.96 0 0 1 2 12a9.95 9.95 0 0 1 1.118-4.599l2.266.415.992 2.252A6 6 0 0 0 6.056 12c0 .734.132 1.437.376 2.086" }), _jsx("path", { d: "M21.825 10.132Q22 11.042 22 12q-.002 1.076-.219 2.088a10 10 0 0 1-3.52 5.71h-.001l-2.853-.146-.404-2.52a5.96 5.96 0 0 0 2.564-3.044H12.22v-3.956h9.605" }), _jsx("path", { d: "M18.26 19.798A9.96 9.96 0 0 1 12 22a10 10 0 0 1-8.808-5.26l3.24-2.654a5.946 5.946 0 0 0 8.57 3.045z" }), _jsx("path", { d: "m18.383 4.302-3.24 2.652a5.948 5.948 0 0 0-8.767 3.114L3.12 7.401h-.001A10 10 0 0 1 12 2c2.426 0 4.651.864 6.383 2.302" })] }));
4
+ export default GoogleMonochromeFillMd;
@@ -0,0 +1,4 @@
1
+ import type { FunctionComponent } from 'react';
2
+ import { type SvgIconProps } from '../../components/SvgIcon';
3
+ declare const JacartaFillMd: FunctionComponent<SvgIconProps>;
4
+ export default JacartaFillMd;
@@ -0,0 +1,4 @@
1
+ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
2
+ import { SvgIcon } from '../../components/SvgIcon';
3
+ const JacartaFillMd = ({ ...props }) => (_jsxs(SvgIcon, { ...props, children: [_jsx("path", { d: "M16.9963 8.00009H21.9529C22.5292 8.00009 22.9963 8.46727 22.9963 9.04357V14.9566C22.9963 15.5329 22.5292 16.0001 21.9529 16.0001H16.9963V8.00009Z", fill: "#ADADAD" }), _jsx("rect", { x: "19.4995", y: "9.50009", width: "1.5", height: "1.5", rx: "0.521739", fill: "#494949" }), _jsx("rect", { x: "19.4995", y: "13.0001", width: "1.5", height: "1.5", rx: "0.521739", fill: "#494949" }), _jsx("rect", { x: "5.99951", y: "6.50009", width: "11", height: "11", rx: "1.04348", fill: "#636562" }), _jsx("path", { d: "M8.00342 17.5H6.50342C3.46585 17.5 1.00342 15.0376 1.00342 12C1.00347 8.96248 3.46588 6.5 6.50342 6.5H8.00342V17.5ZM5.99951 8.25C4.34269 8.25 2.99956 9.59319 2.99951 11.25L2.99951 12.75C2.99951 14.4069 4.34266 15.75 5.99951 15.75L5.99951 8.25Z", fill: "#FD7F18" })] }));
4
+ export default JacartaFillMd;
@@ -0,0 +1,4 @@
1
+ import type { FunctionComponent } from 'react';
2
+ import { type SvgIconProps } from '../../components/SvgIcon';
3
+ declare const OkMonochromeFillMd: FunctionComponent<SvgIconProps>;
4
+ export default OkMonochromeFillMd;
@@ -0,0 +1,4 @@
1
+ import { jsx as _jsx } from "react/jsx-runtime";
2
+ import { SvgIcon } from '../../components/SvgIcon';
3
+ const OkMonochromeFillMd = ({ ...props }) => (_jsx(SvgIcon, { ...props, children: _jsx("path", { d: "M12 1.5c5.799 0 10.5 4.701 10.5 10.5S17.799 22.5 12 22.5 1.5 17.799 1.5 12 6.201 1.5 12 1.5m3.6 11.225c-.288-.425-.893-.553-1.351-.285a4.53 4.53 0 0 1-4.499 0c-.458-.268-1.062-.14-1.35.285-.287.424-.15.983.307 1.25.604.352 1.26.601 1.94.745L8.78 16.45a.86.86 0 0 0 .001 1.283c.192.177.442.266.692.266s.502-.089.693-.266l1.835-1.7 1.836 1.7a1.034 1.034 0 0 0 1.384 0 .86.86 0 0 0 0-1.283l-1.868-1.731a6.6 6.6 0 0 0 1.941-.744c.457-.268.595-.828.307-1.251M11.99 6C10.15 6 8.65 7.39 8.65 9.097s1.5 3.095 3.342 3.095c1.844 0 3.342-1.388 3.342-3.095S13.834 6 11.991 6m0 1.814c.763 0 1.384.576 1.384 1.283 0 .706-.62 1.282-1.384 1.282-.762 0-1.383-.576-1.383-1.282s.621-1.282 1.383-1.283" }) }));
4
+ export default OkMonochromeFillMd;
@@ -0,0 +1,4 @@
1
+ import type { FunctionComponent } from 'react';
2
+ import { type SvgIconProps } from '../../components/SvgIcon';
3
+ declare const RutokenFillMd: FunctionComponent<SvgIconProps>;
4
+ export default RutokenFillMd;
@@ -0,0 +1,4 @@
1
+ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
2
+ import { SvgIcon } from '../../components/SvgIcon';
3
+ const RutokenFillMd = ({ ...props }) => (_jsxs(SvgIcon, { ...props, children: [_jsx("path", { d: "M17.0039 7.85686H21.9778C22.5401 7.85686 22.996 8.31274 22.996 8.8751V14.9845C22.996 15.5469 22.5401 16.0027 21.9778 16.0027H17.0039V7.85686Z", fill: "#ADADAD" }), _jsx("rect", { x: "19.3", y: "9.2146", width: "1.69706", height: "1.69706", rx: "0.509117", fill: "#494949" }), _jsx("rect", { x: "19.3", y: "12.9478", width: "1.69706", height: "1.69706", rx: "0.509117", fill: "#494949" }), _jsx("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M1.00391 11.9997C1.00391 7.35242 9.14978 6.5 11.1862 6.5L15.5 6.50036C16.1567 6.51556 17.001 7.24005 17.001 7.94896V16.0508C17 16.7597 16.3 17.4997 15.5 17.4997L11.1862 17.4994C9.21557 17.4994 1.52384 16.7011 1.02893 12.4383C1.01241 12.296 1.00391 12.1498 1.00391 11.9997ZM4.56194 10.6252L4.55149 10.6253C4.4372 10.6275 2.36327 10.6866 2.36327 11.9999C2.36327 13.3126 4.43523 13.3726 4.55132 13.375L4.56203 13.375H5.41797C5.98033 13.375 6.43621 12.9134 6.43621 12.3438V11.6564C6.43621 11.0869 5.98033 10.6252 5.41797 10.6252H4.56194Z", fill: "#D1D4DD" }), _jsx("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M15.5 6.50036L11.1879 6.50064C9.15141 6.50064 1.00554 7.19779 1.00554 12.0003C1.00554 12.1503 1.01348 12.2962 1.02893 12.4383C1.52384 16.7011 9.21557 17.4994 11.1862 17.4994L15.5 17.4997C16.3 17.4997 17 16.7597 17.001 16.0508V7.94896C17.001 7.24005 16.1567 6.51556 15.5 6.50036ZM4.56194 10.6252L4.55149 10.6253C4.4372 10.6275 2.36327 10.6866 2.36327 11.9999C2.36327 13.3126 4.43523 13.3726 4.55132 13.375L4.56203 13.375H5.41797C5.98033 13.375 6.43621 12.9134 6.43621 12.3438V11.6564C6.43621 11.0869 5.98033 10.6252 5.41797 10.6252H4.56194Z", fill: "#D50C0C" }), _jsx("g", { filter: "url(#filter0_i_6008_21979)", children: _jsx("path", { d: "M7.5 10.4399C7.5 10.1587 7.72794 9.93076 8.00912 9.93076H14.9909C15.2721 9.93076 15.5 10.1587 15.5 10.4399V13.4216C15.5 13.7028 15.2721 13.9308 14.9909 13.9308H8.00912C7.72794 13.9308 7.5 13.7028 7.5 13.4216V10.4399Z", fill: "#CC0E0E" }) }), _jsx("defs", { children: _jsxs("filter", { id: "filter0_i_6008_21979", x: "7.5", y: "9.93076", width: "8", height: "4", filterUnits: "userSpaceOnUse", colorInterpolationFilters: "sRGB", children: [_jsx("feFlood", { floodOpacity: "0", result: "BackgroundImageFix" }), _jsx("feBlend", { mode: "normal", in: "SourceGraphic", in2: "BackgroundImageFix", result: "shape" }), _jsx("feColorMatrix", { in: "SourceAlpha", type: "matrix", values: "0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0", result: "hardAlpha" }), _jsx("feOffset", {}), _jsx("feGaussianBlur", { stdDeviation: "0.5" }), _jsx("feComposite", { in2: "hardAlpha", operator: "arithmetic", k2: "-1", k3: "1" }), _jsx("feColorMatrix", { type: "matrix", values: "0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.25 0" }), _jsx("feBlend", { mode: "normal", in2: "shape", result: "effect1_innerShadow_6008_21979" })] }) })] }));
4
+ export default RutokenFillMd;
@@ -0,0 +1,4 @@
1
+ import type { FunctionComponent } from 'react';
2
+ import { type SvgIconProps } from '../../components/SvgIcon';
3
+ declare const TelegramIconMonochromeFillMd: FunctionComponent<SvgIconProps>;
4
+ export default TelegramIconMonochromeFillMd;
@@ -0,0 +1,4 @@
1
+ import { jsx as _jsx } from "react/jsx-runtime";
2
+ import { SvgIcon } from '../../components/SvgIcon';
3
+ const TelegramIconMonochromeFillMd = ({ ...props }) => (_jsx(SvgIcon, { ...props, children: _jsx("path", { d: "M 20.390625 3.410156 C 21.296875 3.019531 22.265625 3.808594 22.109375 4.808594 L 19.773438 19.609375 C 19.632812 20.507812 18.65625 20.976562 17.898438 20.507812 L 11.132812 16.347656 C 10.425781 15.914062 10.3125 14.910156 10.898438 14.316406 L 16.9375 8.203125 C 17.15625 7.984375 16.878906 7.632812 16.625 7.804688 L 8.234375 13.492188 C 7.613281 13.914062 6.839844 14.027344 6.128906 13.808594 L 2.410156 12.644531 C 1.734375 12.433594 1.6875 11.46875 2.335938 11.1875 Z M 20.390625 3.410156 " }) }));
4
+ export default TelegramIconMonochromeFillMd;
@@ -0,0 +1,4 @@
1
+ import type { FunctionComponent } from 'react';
2
+ import { type SvgIconProps } from '../../components/SvgIcon';
3
+ declare const TelegramMonochromeFillMd: FunctionComponent<SvgIconProps>;
4
+ export default TelegramMonochromeFillMd;
@@ -0,0 +1,4 @@
1
+ import { jsx as _jsx } from "react/jsx-runtime";
2
+ import { SvgIcon } from '../../components/SvgIcon';
3
+ const TelegramMonochromeFillMd = ({ ...props }) => (_jsx(SvgIcon, { ...props, children: _jsx("path", { d: "M12 1.5c5.799 0 10.5 4.701 10.5 10.5S17.799 22.5 12 22.5 1.5 17.799 1.5 12 6.201 1.5 12 1.5m5.24 6.156c.093-.604-.481-1.08-1.018-.844L5.523 11.509c-.385.169-.356.752.043.88l2.206.702c.422.134.878.064 1.246-.19l4.973-3.436c.15-.104.314.11.186.242l-3.581 3.691c-.347.359-.278.965.14 1.227l4.008 2.515c.45.281 1.028-.002 1.112-.545z" }) }));
4
+ export default TelegramMonochromeFillMd;
@@ -0,0 +1,4 @@
1
+ import type { FunctionComponent } from 'react';
2
+ import { type SvgIconProps } from '../../components/SvgIcon';
3
+ declare const VkMonochromeFillMd: FunctionComponent<SvgIconProps>;
4
+ export default VkMonochromeFillMd;
@@ -0,0 +1,4 @@
1
+ import { jsx as _jsx } from "react/jsx-runtime";
2
+ import { SvgIcon } from '../../components/SvgIcon';
3
+ const VkMonochromeFillMd = ({ ...props }) => (_jsx(SvgIcon, { ...props, children: _jsx("path", { d: "M12.438 1.5c4.75 0 7.131 0 8.601 1.47C22.5 4.44 22.5 6.82 22.5 11.545v.893c0 4.742 0 7.122-1.46 8.592-1.47 1.47-3.842 1.47-8.602 1.47h-.876c-4.742 0-7.122 0-8.592-1.47S1.5 17.18 1.5 12.455v-.893c0-4.742 0-7.122 1.46-8.592C4.43 1.5 6.804 1.5 11.564 1.5zM5.25 8.25c.11 5.153 2.74 8.25 7.352 8.25h.262v-2.948c.814.1 1.58.433 2.2.958a4.07 4.07 0 0 1 1.291 1.99h2.395a6.5 6.5 0 0 0-1.28-2.433 6.6 6.6 0 0 0-2.186-1.705 6.4 6.4 0 0 0 1.918-1.754c.51-.707.864-1.51 1.042-2.358h-2.176c-.472 1.635-1.872 3.121-3.204 3.262V8.25h-2.176v5.715c-1.349-.33-3.052-1.933-3.127-5.715z" }) }));
4
+ export default VkMonochromeFillMd;
@@ -0,0 +1,4 @@
1
+ import type { FunctionComponent } from 'react';
2
+ import { type SvgIconProps } from '../../components/SvgIcon';
3
+ declare const YoutubeMonochromeFillMd: FunctionComponent<SvgIconProps>;
4
+ export default YoutubeMonochromeFillMd;
@@ -0,0 +1,4 @@
1
+ import { jsx as _jsx } from "react/jsx-runtime";
2
+ import { SvgIcon } from '../../components/SvgIcon';
3
+ const YoutubeMonochromeFillMd = ({ ...props }) => (_jsx(SvgIcon, { ...props, children: _jsx("path", { d: "M12 4s7.096 0 8.872.478a2.86 2.86 0 0 1 2.008 2.02c.475 1.783.475 5.502.475 5.502s0 3.719-.475 5.502a2.86 2.86 0 0 1-2.008 2.02C19.096 20 12 20 12 20c-.031 0-7.1-.001-8.872-.477a2.86 2.86 0 0 1-2.008-2.021C.645 15.719.646 12 .646 12s0-3.719.474-5.502a2.85 2.85 0 0 1 2.008-2.02C4.9 4 11.968 4 12 4M9.546 15.568 15.818 12 9.546 8.432z" }) }));
4
+ export default YoutubeMonochromeFillMd;