chore: use @gravity-ui/table

Author: ma-efremoff

package-lock.json

@@ -53,7 +53,6 @@
     "@gravity-ui/i18n": "^1.0.0",
     "@gravity-ui/icons": "^2.13.0",
     "@gravity-ui/prettier-config": "^1.0.1",
-    "@gravity-ui/react-data-table": "^2.2.1",
     "@gravity-ui/stylelint-config": "^2.0.0",
     "@gravity-ui/tsconfig": "^1.0.0",
     "@gravity-ui/uikit": "^7.1.1",
@@ -90,6 +89,7 @@
     "@bem-react/classname": "^1.6.0",
     "@gravity-ui/i18n": "^1.0.0",
     "@gravity-ui/icons": "^2.0.0",
+    "@gravity-ui/table": "^1.10.1",
     "@gravity-ui/uikit": "^7.1.1"
   },
   "nano-staged": {

package.json

@@ -42,7 +42,7 @@ export default function HighlightedText({
     );
 }
 
-interface MultiProps extends Omit<Props, 'start'> {
+export interface MultiHighlightedTextProps extends Omit<Props, 'start'> {
     starts: Array<number>;
 }
 
@@ -53,7 +53,7 @@ export function MultiHighlightedText({
     starts,
     length,
     hasComa,
-}: MultiProps) {
+}: MultiHighlightedTextProps) {
     if (!length || !starts.length) {
         const comma = hasComa ? <>,&nbsp;</> : null;
         return (

src/HighlightedText/HighlightedText.tsx

@@ -1,6 +1,5 @@
 import React from 'react';
 
-import type {Settings} from '@gravity-ui/react-data-table';
 // @ts-expect-error
 import unipika from '@gravity-ui/unipika/lib/unipika';
 
@@ -19,7 +18,6 @@ export interface ReactUnipikaProps {
     extraTools?: React.ReactNode;
     virtualized?: boolean;
     className?: string;
-    tableSettings?: Settings;
     customLayout?: (args: {toolbar: React.ReactNode; content: React.ReactNode}) => React.ReactNode;
     toolbarStickyTop?: number;
 }
@@ -41,7 +39,6 @@ export function ReactUnipika({
     virtualized = true,
     extraTools,
     className,
-    tableSettings,
     customLayout,
     toolbarStickyTop = 0,
 }: ReactUnipikaProps) {
@@ -90,7 +87,6 @@ export function ReactUnipika({
         <div className={classes} title={getFormattedTitle()} dir="auto">
             {virtualized ? (
                 <StructuredYson
-                    tableSettings={tableSettings}
                     value={convertedValue}
                     settings={settings}
                     extraTools={extraTools}

src/ReactUnipika/ReactUnipika.tsx

@@ -1,15 +1,26 @@
+import {CSSProperties} from 'react';
 import {Meta, StoryObj} from '@storybook/react';
 
 import {ReactUnipika, ReactUnipikaProps} from '../../index';
 
+import data from './data.json';
+
 const meta: Meta<ReactUnipikaProps> = {
     title: 'ReactUnipika',
     component: ReactUnipika,
 };
 export default meta;
 
+//const root = document.getElementById('storybook-root') as HTMLElement;
+const style: CSSProperties = {
+    //    overflow: 'auto',
+    //    height: '400px',
+    //    outline: 'solid 1px lightgray',
+};
+Object.assign(document.body.style ?? {}, style);
+
 export const Default: StoryObj<ReactUnipikaProps> = {
     args: {
-        value: {foo: 'bar', hello: {world: 'Hello world'}},
+        value: data,
     },
 };