@gravity-ui/querieskit 1.2.0 → 1.3.1

package/build/esm/modules/Attachments/Attachments.stories.d.ts

@@ -0,0 +1,41 @@
+import React from 'react';
+import type { StoryObj } from '@storybook/react';
+declare const meta: {
+    title: string;
+    component: ({ tokens, placeholderProps, attachmentListProps, onChange, attachments: customerAttachments, deletedAttachments: customerDeletedAttachments, }: import("./Attachments").AttachmentsProps) => React.JSX.Element;
+    tags: string[];
+    parameters: {
+        layout: string;
+    };
+    decorators: ((Story: import("storybook/internal/csf").PartialStoryFn<import("@storybook/react").ReactRenderer, {
+        tokens?: {
+            value: string;
+            title: string;
+        }[] | undefined;
+        placeholderProps?: Omit<import("../..").AttachmentListPlaceholderProps, "onAddFile" | "onAddLink"> | undefined;
+        attachmentListProps?: Pick<import("../..").AttachmentListProps, "className"> | undefined;
+        attachments?: import("./Attachments").AttachItem[] | undefined;
+        deletedAttachments?: import("./Attachments").AttachItem[] | undefined;
+        onChange?: ((payload: {
+            attachments: import("./Attachments").AttachItem[];
+            deletedAttachments: import("./Attachments").AttachItem[];
+        }) => void) | undefined;
+    }>) => React.JSX.Element)[];
+    args: {
+        tokens: {
+            value: string;
+            title: string;
+        }[];
+        onChange: import("@vitest/spy").Mock<(...args: any[]) => any>;
+    };
+};
+export default meta;
+type Story = StoryObj<typeof meta>;
+/** Empty state with content configured through `placeholderProps`. */
+export declare const Default: Story;
+/** Initial files and links supplied through the uncontrolled `attachments` API. */
+export declare const WithAttachments: Story;
+/** Current and deleted collections. Open the Deleted tab to restore an attachment. */
+export declare const WithDeletedAttachments: Story;
+/** Controlled usage: every edit, delete, restore, or addition is applied from `onChange`. */
+export declare const Controlled: Story;

package/build/esm/modules/Attachments/Attachments.stories.js

@@ -0,0 +1,115 @@
+import _objectSpread from "@babel/runtime/helpers/objectSpread2";
+import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
+import React, { useState } from 'react';
+import { fn } from 'storybook/test';
+import { Attachments } from "./Attachments";
+import { jsx as _jsx } from "react/jsx-runtime";
+var attachments = [{
+  id: 'readme',
+  name: 'README.md'
+}, {
+  id: 'query',
+  name: 'daily-report.sql'
+}, {
+  id: 'documentation',
+  name: 'Query documentation',
+  link: 'https://example.com/docs/query',
+  token: 'documentation-token'
+}];
+var deletedAttachments = [{
+  id: 'archive',
+  name: 'archive.csv'
+}, {
+  id: 'old-dashboard',
+  name: 'Old dashboard',
+  link: 'https://example.com/dashboards/old',
+  token: 'dashboard-token'
+}];
+var tokens = [{
+  value: 'documentation-token',
+  title: 'Documentation token'
+}, {
+  value: 'dashboard-token',
+  title: 'Dashboard token'
+}];
+var meta = {
+  title: 'Modules/Attachments',
+  component: Attachments,
+  tags: ['autodocs'],
+  parameters: {
+    layout: 'padded'
+  },
+  decorators: [function (Story) {
+    return /*#__PURE__*/_jsx("div", {
+      style: {
+        height: 500,
+        width: 322
+      },
+      children: /*#__PURE__*/_jsx(Story, {})
+    });
+  }],
+  args: {
+    tokens: tokens,
+    onChange: fn()
+  }
+};
+export default meta;
+/** Empty state with content configured through `placeholderProps`. */
+export var Default = {
+  args: {
+    placeholderProps: {
+      title: 'No attachments',
+      description: 'Add files or links that should be available to the query.',
+      linkForDoc: '#attachments-help',
+      linkText: 'About attachments'
+    }
+  }
+};
+
+/** Initial files and links supplied through the uncontrolled `attachments` API. */
+export var WithAttachments = {
+  args: {
+    attachments: attachments
+  }
+};
+
+/** Current and deleted collections. Open the Deleted tab to restore an attachment. */
+export var WithDeletedAttachments = {
+  args: {
+    attachments: attachments,
+    deletedAttachments: deletedAttachments
+  }
+};
+var ControlledAttachments = function ControlledAttachments(props) {
+  var _props$attachments, _props$deletedAttachm;
+  var _useState = useState((_props$attachments = props.attachments) !== null && _props$attachments !== void 0 ? _props$attachments : []),
+    _useState2 = _slicedToArray(_useState, 2),
+    currentAttachments = _useState2[0],
+    setCurrentAttachments = _useState2[1];
+  var _useState3 = useState((_props$deletedAttachm = props.deletedAttachments) !== null && _props$deletedAttachm !== void 0 ? _props$deletedAttachm : []),
+    _useState4 = _slicedToArray(_useState3, 2),
+    currentDeletedAttachments = _useState4[0],
+    setCurrentDeletedAttachments = _useState4[1];
+  return /*#__PURE__*/_jsx(Attachments, _objectSpread(_objectSpread({}, props), {}, {
+    attachments: currentAttachments,
+    deletedAttachments: currentDeletedAttachments,
+    onChange: function onChange(payload) {
+      var _props$onChange;
+      setCurrentAttachments(payload.attachments);
+      setCurrentDeletedAttachments(payload.deletedAttachments);
+      (_props$onChange = props.onChange) === null || _props$onChange === void 0 || _props$onChange.call(props, payload);
+    }
+  }));
+};
+
+/** Controlled usage: every edit, delete, restore, or addition is applied from `onChange`. */
+export var Controlled = {
+  args: {
+    attachments: attachments,
+    deletedAttachments: deletedAttachments
+  },
+  render: function render(args) {
+    return /*#__PURE__*/_jsx(ControlledAttachments, _objectSpread({}, args));
+  }
+};
+// #sourceMappingURL=Attachments.stories.js.map

package/build/esm/modules/Attachments/Attachments.stories.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["React","useState","fn","Attachments","jsx","_jsx","attachments","id","name","link","token","deletedAttachments","tokens","value","title","meta","component","tags","parameters","layout","decorators","Story","style","height","width","children","args","onChange","Default","placeholderProps","description","linkForDoc","linkText","WithAttachments","WithDeletedAttachments","ControlledAttachments","props","_props$attachments","_props$deletedAttachm","_useState","_useState2","_slicedToArray","currentAttachments","setCurrentAttachments","_useState3","_useState4","currentDeletedAttachments","setCurrentDeletedAttachments","_objectSpread","payload","_props$onChange","call","Controlled","render"],"sources":["Attachments.stories.tsx"],"sourcesContent":["import React, {useState} from 'react';\nimport type {Meta, StoryObj} from '@storybook/react';\nimport {fn} from 'storybook/test';\nimport {Attachments} from './Attachments';\n\ntype AttachmentsProps = React.ComponentProps<typeof Attachments>;\ntype Attachment = NonNullable<AttachmentsProps['attachments']>[number];\n\nconst attachments: Attachment[] = [\n    {id: 'readme', name: 'README.md'},\n    {id: 'query', name: 'daily-report.sql'},\n    {\n        id: 'documentation',\n        name: 'Query documentation',\n        link: 'https://example.com/docs/query',\n        token: 'documentation-token',\n    },\n];\n\nconst deletedAttachments: Attachment[] = [\n    {id: 'archive', name: 'archive.csv'},\n    {\n        id: 'old-dashboard',\n        name: 'Old dashboard',\n        link: 'https://example.com/dashboards/old',\n        token: 'dashboard-token',\n    },\n];\n\nconst tokens: NonNullable<AttachmentsProps['tokens']> = [\n    {value: 'documentation-token', title: 'Documentation token'},\n    {value: 'dashboard-token', title: 'Dashboard token'},\n];\n\nconst meta = {\n    title: 'Modules/Attachments',\n    component: Attachments,\n    tags: ['autodocs'],\n    parameters: {\n        layout: 'padded',\n    },\n    decorators: [\n        (Story) => (\n            <div style={{height: 500, width: 322}}>\n                <Story />\n            </div>\n        ),\n    ],\n    args: {\n        tokens,\n        onChange: fn(),\n    },\n} satisfies Meta<typeof Attachments>;\n\nexport default meta;\ntype Story = StoryObj<typeof meta>;\n\n/** Empty state with content configured through `placeholderProps`. */\nexport const Default: Story = {\n    args: {\n        placeholderProps: {\n            title: 'No attachments',\n            description: 'Add files or links that should be available to the query.',\n            linkForDoc: '#attachments-help',\n            linkText: 'About attachments',\n        },\n    },\n};\n\n/** Initial files and links supplied through the uncontrolled `attachments` API. */\nexport const WithAttachments: Story = {\n    args: {\n        attachments,\n    },\n};\n\n/** Current and deleted collections. Open the Deleted tab to restore an attachment. */\nexport const WithDeletedAttachments: Story = {\n    args: {\n        attachments,\n        deletedAttachments,\n    },\n};\n\nconst ControlledAttachments = (props: AttachmentsProps) => {\n    const [currentAttachments, setCurrentAttachments] = useState(props.attachments ?? []);\n    const [currentDeletedAttachments, setCurrentDeletedAttachments] = useState(\n        props.deletedAttachments ?? [],\n    );\n\n    return (\n        <Attachments\n            {...props}\n            attachments={currentAttachments}\n            deletedAttachments={currentDeletedAttachments}\n            onChange={(payload) => {\n                setCurrentAttachments(payload.attachments);\n                setCurrentDeletedAttachments(payload.deletedAttachments);\n                props.onChange?.(payload);\n            }}\n        />\n    );\n};\n\n/** Controlled usage: every edit, delete, restore, or addition is applied from `onChange`. */\nexport const Controlled: Story = {\n    args: {\n        attachments,\n        deletedAttachments,\n    },\n    render: (args) => <ControlledAttachments {...args} />,\n};\n"],"mappings":"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","ignoreList":[]}

package/build/esm/modules/Attachments/i18n/dicts.d.ts

@@ -0,0 +1,13 @@
+declare const _default: {
+    en: {
+        "action_add-file": string;
+        "action_add-link": string;
+        "action_remove-all": string;
+    };
+    ru: {
+        "action_add-file": string;
+        "action_add-link": string;
+        "action_remove-all": string;
+    };
+};
+export default _default;

package/build/esm/modules/Attachments/i18n/dicts.js

@@ -0,0 +1,7 @@
+import en from "./en.json";
+import ru from "./ru.json";
+export default {
+  en: en,
+  ru: ru
+};
+// #sourceMappingURL=dicts.js.map

package/build/esm/modules/Attachments/i18n/dicts.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["en","ru"],"sources":["dicts.ts"],"sourcesContent":["import en from './en.json';\nimport ru from './ru.json';\n\nexport default {en, ru};\n"],"mappings":"AAAA,OAAOA,EAAE;AACT,OAAOC,EAAE;AAET,eAAe;EAACD,EAAE,EAAFA,EAAE;EAAEC,EAAE,EAAFA;AAAE,CAAC","ignoreList":[]}

package/build/esm/modules/Attachments/i18n/en.json

@@ -0,0 +1,5 @@
+{
+  "action_add-file": "File",
+  "action_add-link": "Link",
+  "action_remove-all": "Remove all"
+}

package/build/esm/modules/Attachments/i18n/index.d.ts

@@ -0,0 +1,6 @@
+declare const _default: ((key: "action_add-file" | "action_add-link" | "action_remove-all", params?: import("@gravity-ui/i18n").Params) => string) & {
+    keysetData: {
+        "qp:attachments": Record<"action_add-file" | "action_add-link" | "action_remove-all", import("@gravity-ui/i18n").KeyData>;
+    };
+};
+export default _default;

package/build/esm/modules/Attachments/i18n/index.js

@@ -0,0 +1,4 @@
+import { addI18Keysets } from "../../../i18n";
+import dicts from "./dicts";
+export default addI18Keysets('qp:attachments', dicts);
+// #sourceMappingURL=index.js.map

package/build/esm/modules/Attachments/i18n/index.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["addI18Keysets","dicts"],"sources":["index.ts"],"sourcesContent":["import {addI18Keysets} from '../../../i18n';\n\nimport dicts from './dicts';\n\nexport default addI18Keysets('qp:attachments', dicts);\n"],"mappings":"AAAA,SAAQA,aAAa;AAErB,OAAOC,KAAK;AAEZ,eAAeD,aAAa,CAAC,gBAAgB,EAAEC,KAAK,CAAC","ignoreList":[]}

package/build/esm/modules/Attachments/i18n/ru.json

@@ -0,0 +1,5 @@
+{
+  "action_add-file": "Файл",
+  "action_add-link": "Ссылка",
+  "action_remove-all": "Удалить все"
+}

package/build/esm/modules/Attachments/index.d.ts

@@ -0,0 +1,2 @@
+export { Attachments } from './Attachments';
+export type { AttachmentsProps, AttachItem } from './Attachments';

package/build/esm/modules/Attachments/index.js

@@ -0,0 +1,2 @@
+export { Attachments } from "./Attachments";
+// #sourceMappingURL=index.js.map

package/build/esm/modules/Attachments/index.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["Attachments"],"sources":["index.ts"],"sourcesContent":["export {Attachments} from './Attachments';\nexport type {AttachmentsProps, AttachItem} from './Attachments';\n"],"mappings":"AAAA,SAAQA,WAAW","ignoreList":[]}

package/build/esm/modules/HistoryLayout/HistoryLayout.d.ts

@@ -1,7 +1,7 @@
 import { FC, ReactNode } from 'react';
 import './HistoryLayout.scss';
 export type HistoryLayoutProps = {
-    title: ReactNode;
+    title?: ReactNode;
     logo?: ReactNode;
     actions?: ReactNode;
     header?: ReactNode;

package/build/esm/modules/HistoryLayout/HistoryLayout.js

@@ -24,7 +24,7 @@ export var HistoryLayout = function HistoryLayout(_ref) {
         alignItems: "center",
         justifyContent: logo ? 'space-between' : 'flex-end',
         children: [logo, actions]
-      }), /*#__PURE__*/_jsx(Text, {
+      }), title !== null && /*#__PURE__*/_jsx(Text, {
         variant: "subheader-1",
         children: title
       }), header]

package/build/esm/modules/HistoryLayout/HistoryLayout.js.map

@@ -1 +1 @@
-{"version":3,"names":["React","Flex","Text","cn","jsxs","_jsxs","jsx","_jsx","block","HistoryLayout","_ref","title","logo","actions","header","footer","className","children","direction","gap","alignItems","justifyContent","variant"],"sources":["HistoryLayout.tsx"],"sourcesContent":["import React, {FC, ReactNode} from 'react';\nimport {Flex, Text} from '@gravity-ui/uikit';\nimport cn from 'bem-cn-lite';\nimport './HistoryLayout.scss';\n\nconst block = cn('qp-history-layout');\n\nexport type HistoryLayoutProps = {\n    title: ReactNode;\n    logo?: ReactNode;\n    actions?: ReactNode;\n    header?: ReactNode;\n    footer?: ReactNode;\n    className?: string;\n    children: ReactNode;\n};\n\nexport const HistoryLayout: FC<HistoryLayoutProps> = ({\n    title,\n    logo,\n    actions,\n    header,\n    footer,\n    className,\n    children,\n}) => {\n    return (\n        <Flex direction=\"column\" gap={1} className={block(null, className)}>\n            <Flex direction=\"column\" gap={1} className={block('header')}>\n                {(logo || actions) && (\n                    <Flex alignItems=\"center\" justifyContent={logo ? 'space-between' : 'flex-end'}>\n                        {logo}\n                        {actions}\n                    </Flex>\n                )}\n                <Text variant=\"subheader-1\">{title}</Text>\n                {header}\n            </Flex>\n            {children}\n            {footer}\n        </Flex>\n    );\n};\n"],"mappings":"AAAA,OAAOA,KAAK,MAAuB,OAAO;AAC1C,SAAQC,IAAI,EAAEC,IAAI,QAAO,mBAAmB;AAC5C,OAAOC,EAAE,MAAM,aAAa;AAC5B;AAA8B,SAAAC,IAAA,IAAAC,KAAA,EAAAC,GAAA,IAAAC,IAAA;AAE9B,IAAMC,KAAK,GAAGL,EAAE,CAAC,mBAAmB,CAAC;AAYrC,OAAO,IAAMM,aAAqC,GAAG,SAAxCA,aAAqCA,CAAAC,IAAA,EAQ5C;EAAA,IAPFC,KAAK,GAAAD,IAAA,CAALC,KAAK;IACLC,IAAI,GAAAF,IAAA,CAAJE,IAAI;IACJC,OAAO,GAAAH,IAAA,CAAPG,OAAO;IACPC,MAAM,GAAAJ,IAAA,CAANI,MAAM;IACNC,MAAM,GAAAL,IAAA,CAANK,MAAM;IACNC,SAAS,GAAAN,IAAA,CAATM,SAAS;IACTC,QAAQ,GAAAP,IAAA,CAARO,QAAQ;EAER,oBACIZ,KAAA,CAACJ,IAAI;IAACiB,SAAS,EAAC,QAAQ;IAACC,GAAG,EAAE,CAAE;IAACH,SAAS,EAAER,KAAK,CAAC,IAAI,EAAEQ,SAAS,CAAE;IAAAC,QAAA,gBAC/DZ,KAAA,CAACJ,IAAI;MAACiB,SAAS,EAAC,QAAQ;MAACC,GAAG,EAAE,CAAE;MAACH,SAAS,EAAER,KAAK,CAAC,QAAQ,CAAE;MAAAS,QAAA,GACvD,CAACL,IAAI,IAAIC,OAAO,kBACbR,KAAA,CAACJ,IAAI;QAACmB,UAAU,EAAC,QAAQ;QAACC,cAAc,EAAET,IAAI,GAAG,eAAe,GAAG,UAAW;QAAAK,QAAA,GACzEL,IAAI,EACJC,OAAO;MAAA,CACN,CACT,eACDN,IAAA,CAACL,IAAI;QAACoB,OAAO,EAAC,aAAa;QAAAL,QAAA,EAAEN;MAAK,CAAO,CAAC,EACzCG,MAAM;IAAA,CACL,CAAC,EACNG,QAAQ,EACRF,MAAM;EAAA,CACL,CAAC;AAEf,CAAC","ignoreList":[]}
+{"version":3,"names":["React","Flex","Text","cn","jsxs","_jsxs","jsx","_jsx","block","HistoryLayout","_ref","title","logo","actions","header","footer","className","children","direction","gap","alignItems","justifyContent","variant"],"sources":["HistoryLayout.tsx"],"sourcesContent":["import React, {FC, ReactNode} from 'react';\nimport {Flex, Text} from '@gravity-ui/uikit';\nimport cn from 'bem-cn-lite';\nimport './HistoryLayout.scss';\n\nconst block = cn('qp-history-layout');\n\nexport type HistoryLayoutProps = {\n    title?: ReactNode;\n    logo?: ReactNode;\n    actions?: ReactNode;\n    header?: ReactNode;\n    footer?: ReactNode;\n    className?: string;\n    children: ReactNode;\n};\n\nexport const HistoryLayout: FC<HistoryLayoutProps> = ({\n    title,\n    logo,\n    actions,\n    header,\n    footer,\n    className,\n    children,\n}) => {\n    return (\n        <Flex direction=\"column\" gap={1} className={block(null, className)}>\n            <Flex direction=\"column\" gap={1} className={block('header')}>\n                {(logo || actions) && (\n                    <Flex alignItems=\"center\" justifyContent={logo ? 'space-between' : 'flex-end'}>\n                        {logo}\n                        {actions}\n                    </Flex>\n                )}\n                {title !== null && <Text variant=\"subheader-1\">{title}</Text>}\n                {header}\n            </Flex>\n            {children}\n            {footer}\n        </Flex>\n    );\n};\n"],"mappings":"AAAA,OAAOA,KAAK,MAAuB,OAAO;AAC1C,SAAQC,IAAI,EAAEC,IAAI,QAAO,mBAAmB;AAC5C,OAAOC,EAAE,MAAM,aAAa;AAC5B;AAA8B,SAAAC,IAAA,IAAAC,KAAA,EAAAC,GAAA,IAAAC,IAAA;AAE9B,IAAMC,KAAK,GAAGL,EAAE,CAAC,mBAAmB,CAAC;AAYrC,OAAO,IAAMM,aAAqC,GAAG,SAAxCA,aAAqCA,CAAAC,IAAA,EAQ5C;EAAA,IAPFC,KAAK,GAAAD,IAAA,CAALC,KAAK;IACLC,IAAI,GAAAF,IAAA,CAAJE,IAAI;IACJC,OAAO,GAAAH,IAAA,CAAPG,OAAO;IACPC,MAAM,GAAAJ,IAAA,CAANI,MAAM;IACNC,MAAM,GAAAL,IAAA,CAANK,MAAM;IACNC,SAAS,GAAAN,IAAA,CAATM,SAAS;IACTC,QAAQ,GAAAP,IAAA,CAARO,QAAQ;EAER,oBACIZ,KAAA,CAACJ,IAAI;IAACiB,SAAS,EAAC,QAAQ;IAACC,GAAG,EAAE,CAAE;IAACH,SAAS,EAAER,KAAK,CAAC,IAAI,EAAEQ,SAAS,CAAE;IAAAC,QAAA,gBAC/DZ,KAAA,CAACJ,IAAI;MAACiB,SAAS,EAAC,QAAQ;MAACC,GAAG,EAAE,CAAE;MAACH,SAAS,EAAER,KAAK,CAAC,QAAQ,CAAE;MAAAS,QAAA,GACvD,CAACL,IAAI,IAAIC,OAAO,kBACbR,KAAA,CAACJ,IAAI;QAACmB,UAAU,EAAC,QAAQ;QAACC,cAAc,EAAET,IAAI,GAAG,eAAe,GAAG,UAAW;QAAAK,QAAA,GACzEL,IAAI,EACJC,OAAO;MAAA,CACN,CACT,EACAF,KAAK,KAAK,IAAI,iBAAIJ,IAAA,CAACL,IAAI;QAACoB,OAAO,EAAC,aAAa;QAAAL,QAAA,EAAEN;MAAK,CAAO,CAAC,EAC5DG,MAAM;IAAA,CACL,CAAC,EACNG,QAAQ,EACRF,MAAM;EAAA,CACL,CAAC;AAEf,CAAC","ignoreList":[]}

package/build/esm/modules/NavigationPreview/NavigationPreview.css

@@ -9,7 +9,13 @@
   overflow-x: auto;
 }
 .qp-navigation-preview .data-table__row,
-.qp-navigation-preview .data-table__head {
+.qp-navigation-preview .data-table__head-row {
+  height: 40px;
+}
+.qp-navigation-preview .data-table__box_sticky-head_moving .data-table__head-row {
+  height: auto;
+}
+.qp-navigation-preview .data-table__sticky_head .data-table__head-row {
   height: 40px;
 }
 .qp-navigation-preview .data-table__th,

package/build/esm/modules/NavigationPreview/NavigationPreview.css.map

@@ -1 +1 @@
-{"version":3,"sources":["NavigationPreview.scss"],"names":[],"mappings":"AAAA;EACE,sDAAA;EAEA,YAAA;AAAF;AAEE;EACE,cAAA;AAAJ;AAGE;EACE,gBAAA;AADJ;AAIE;;EAEE,YAAA;AAFJ;AAKE;;EAEE,qBAAA;EACA,sBAAA;AAHJ","file":"NavigationPreview.css","sourcesContent":[".qp-navigation-preview {\n  --data-table-border-color: var(--g-color-line-generic);\n\n  min-width: 0;\n\n  &__error {\n    display: block;\n  }\n\n  &__table {\n    overflow-x: auto;\n  }\n\n  .data-table__row,\n  .data-table__head {\n    height: 40px;\n  }\n\n  .data-table__th,\n  .data-table__td {\n    border-width: 0 0 1px;\n    vertical-align: middle;\n  }\n}\n"],"sourceRoot":""}
+{"version":3,"sources":["NavigationPreview.scss"],"names":[],"mappings":"AAAA;EACI,sDAAA;EAEA,YAAA;AAAJ;AAEI;EACI,cAAA;AAAR;AAGI;EACI,gBAAA;AADR;AAII;;EAEI,YAAA;AAFR;AAKI;EACI,YAAA;AAHR;AAMI;EACI,YAAA;AAJR;AAOI;;EAEI,qBAAA;EACA,sBAAA;AALR","file":"NavigationPreview.css","sourcesContent":[".qp-navigation-preview {\n    --data-table-border-color: var(--g-color-line-generic);\n\n    min-width: 0;\n\n    &__error {\n        display: block;\n    }\n\n    &__table {\n        overflow-x: auto;\n    }\n\n    .data-table__row,\n    .data-table__head-row {\n        height: 40px;\n    }\n\n    .data-table__box_sticky-head_moving .data-table__head-row {\n        height: auto;\n    }\n\n    .data-table__sticky_head .data-table__head-row {\n        height: 40px;\n    }\n\n    .data-table__th,\n    .data-table__td {\n        border-width: 0 0 1px;\n        vertical-align: middle;\n    }\n}\n"],"sourceRoot":""}

package/build/esm/modules/NavigationPreview/NavigationPreview.d.ts

@@ -1,8 +1,8 @@
 import React from 'react';
 import { type Column } from '../../components';
-import type { NavigationPreviewConfig, NavigationPreviewRow } from '../../types/navigation';
+import type { NavigationPreviewConfig, NavigationPreviewFormatterConfig, NavigationPreviewRow } from '../../types/navigation';
 import './NavigationPreview.scss';
-export type NavigationPreviewViewConfig<TRow extends NavigationPreviewRow = NavigationPreviewRow> = {
+export type NavigationPreviewViewConfig<TRow extends NavigationPreviewRow = NavigationPreviewRow> = NavigationPreviewFormatterConfig & {
     tableColumns?: Array<Column<TRow>>;
     extraColumns?: Array<Column<TRow>>;
 };

package/build/esm/modules/NavigationPreview/NavigationPreview.js

@@ -4,6 +4,7 @@ import "core-js/modules/es.array.concat.js";
 import "core-js/modules/es.array.filter.js";
 import "core-js/modules/es.array.includes.js";
 import "core-js/modules/es.array.map.js";
+import "core-js/modules/es.function.name.js";
 import "core-js/modules/es.iterator.constructor.js";
 import "core-js/modules/es.iterator.filter.js";
 import "core-js/modules/es.iterator.map.js";
@@ -14,7 +15,7 @@ import "core-js/modules/es.string.search.js";
 import React, { useMemo } from 'react';
 import { Flex, Text } from '@gravity-ui/uikit';
 import cn from 'bem-cn-lite';
-import { DataTable, FieldsSearchToolbar } from "../../components";
+import { DataTable, FieldsSearchToolbar, QueryResultsTable } from "../../components";
 import { useVisibleColumns } from "../../helpers/useVisibleColumns";
 import { buildPreviewColumns } from "./helpers/buildPreviewColumns";
 import { filterPreviewRows } from "./helpers/filterPreviewRows";
@@ -22,6 +23,12 @@ import i18n from "./i18n";
 import "./NavigationPreview.css";
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 var block = cn('qp-navigation-preview');
+function getColumnName(column) {
+  return typeof column === 'string' ? column : column.name;
+}
+function isQueryResultColumn(column) {
+  return typeof column !== 'string';
+}
 export function NavigationPreview(_ref) {
   var data = _ref.data,
     view = _ref.view,
@@ -41,8 +48,13 @@ export function NavigationPreview(_ref) {
     errorContent = data.errorContent;
   var _ref2 = view !== null && view !== void 0 ? view : {},
     tableColumns = _ref2.tableColumns,
-    extraColumns = _ref2.extraColumns;
-  var _useVisibleColumns = useVisibleColumns(columns, {
+    extraColumns = _ref2.extraColumns,
+    formatterSettings = _ref2.formatterSettings,
+    maxVisibleLines = _ref2.maxVisibleLines;
+  var columnNames = useMemo(function () {
+    return columns.map(getColumnName);
+  }, [columns]);
+  var _useVisibleColumns = useVisibleColumns(columnNames, {
       value: visibleColumns,
       onChange: onVisibleColumnsChange,
       defaultValue: defaultVisibleColumns
@@ -50,11 +62,18 @@ export function NavigationPreview(_ref) {
     _useVisibleColumns2 = _slicedToArray(_useVisibleColumns, 2),
     activeVisibleColumns = _useVisibleColumns2[0],
     handleVisibleColumnsChange = _useVisibleColumns2[1];
-  var displayedColumnNames = useMemo(function () {
+  var displayedColumns = useMemo(function () {
     return columns.filter(function (column) {
-      return activeVisibleColumns.includes(column);
+      return activeVisibleColumns.includes(getColumnName(column));
     });
   }, [columns, activeVisibleColumns]);
+  var displayedColumnNames = useMemo(function () {
+    return displayedColumns.map(getColumnName);
+  }, [displayedColumns]);
+  var typedColumns = useMemo(function () {
+    return displayedColumns.filter(isQueryResultColumn);
+  }, [displayedColumns]);
+  var canUseQueryResultsTable = !tableColumns && !(extraColumns !== null && extraColumns !== void 0 && extraColumns.length) && typedColumns.length === displayedColumns.length;
   var resolvedColumns = useMemo(function () {
     if (tableColumns) {
       return tableColumns;
@@ -63,9 +82,10 @@ export function NavigationPreview(_ref) {
   }, [tableColumns, extraColumns, displayedColumnNames]);
   var fieldsOptions = useMemo(function () {
     return columns.map(function (column) {
+      var _column$header;
       return {
-        id: column,
-        title: column
+        id: getColumnName(column),
+        title: typeof column === 'string' ? column : (_column$header = column.header) !== null && _column$header !== void 0 ? _column$header : column.name
       };
     });
   }, [columns]);
@@ -91,7 +111,17 @@ export function NavigationPreview(_ref) {
       visibleFields: activeVisibleColumns,
       onVisibleFieldsChange: handleVisibleColumnsChange,
       hideFieldsSelector: hideFieldsSelector
-    }), /*#__PURE__*/_jsx(DataTable, {
+    }), canUseQueryResultsTable ? /*#__PURE__*/_jsx(QueryResultsTable, {
+      columns: typedColumns,
+      rows: filteredRows,
+      loading: loading,
+      loaded: loaded,
+      formatterSettings: formatterSettings,
+      maxVisibleLines: maxVisibleLines,
+      emptyVariant: search ? 'nothing-found' : 'no-data',
+      displayIndices: false,
+      className: block('table')
+    }) : /*#__PURE__*/_jsx(DataTable, {
       columns: resolvedColumns,
       data: filteredRows,
       loading: loading,

package/build/esm/modules/NavigationPreview/NavigationPreview.js.map

@@ -1 +1 @@
-{"version":3,"names":["React","useMemo","Flex","Text","cn","DataTable","FieldsSearchToolbar","useVisibleColumns","buildPreviewColumns","filterPreviewRows","i18n","jsx","_jsx","jsxs","_jsxs","block","NavigationPreview","_ref","data","view","search","onSearchUpdate","searchPlaceholder","visibleColumns","onVisibleColumnsChange","defaultVisibleColumns","hideToolbar","hideFieldsSelector","className","columns","rows","loading","loaded","errorContent","_ref2","tableColumns","extraColumns","_useVisibleColumns","value","onChange","defaultValue","_useVisibleColumns2","_slicedToArray","activeVisibleColumns","handleVisibleColumnsChange","displayedColumnNames","filter","column","includes","resolvedColumns","concat","_toConsumableArray","fieldsOptions","map","id","title","filteredRows","color","children","direction","gap","fields","visibleFields","onVisibleFieldsChange","emptyVariant","settings","displayIndices"],"sources":["NavigationPreview.tsx"],"sourcesContent":["import React, {useMemo} from 'react';\nimport {Flex, Text} from '@gravity-ui/uikit';\nimport cn from 'bem-cn-lite';\nimport {type Column, DataTable, FieldsSearchToolbar} from '../../components';\nimport {useVisibleColumns} from '../../helpers/useVisibleColumns';\nimport type {NavigationPreviewConfig, NavigationPreviewRow} from '../../types/navigation';\nimport {buildPreviewColumns} from './helpers/buildPreviewColumns';\nimport {filterPreviewRows} from './helpers/filterPreviewRows';\nimport i18n from './i18n';\nimport './NavigationPreview.scss';\n\nconst block = cn('qp-navigation-preview');\n\nexport type NavigationPreviewViewConfig<TRow extends NavigationPreviewRow = NavigationPreviewRow> =\n    {\n        tableColumns?: Array<Column<TRow>>;\n        extraColumns?: Array<Column<TRow>>;\n    };\n\nexport type NavigationPreviewProps<TRow extends NavigationPreviewRow = NavigationPreviewRow> = {\n    data: NavigationPreviewConfig<TRow>;\n    view?: NavigationPreviewViewConfig<TRow>;\n    search?: string;\n    onSearchUpdate?: (value: string) => void;\n    searchPlaceholder?: string;\n    visibleColumns?: string[];\n    onVisibleColumnsChange?: (value: string[]) => void;\n    defaultVisibleColumns?: string[];\n    hideToolbar?: boolean;\n    hideFieldsSelector?: boolean;\n    className?: string;\n};\n\nexport function NavigationPreview<TRow extends NavigationPreviewRow = NavigationPreviewRow>({\n    data,\n    view,\n    search,\n    onSearchUpdate,\n    searchPlaceholder,\n    visibleColumns,\n    onVisibleColumnsChange,\n    defaultVisibleColumns,\n    hideToolbar,\n    hideFieldsSelector,\n    className,\n}: NavigationPreviewProps<TRow>) {\n    const {columns, rows, loading, loaded, errorContent} = data;\n    const {tableColumns, extraColumns} = view ?? {};\n\n    const [activeVisibleColumns, handleVisibleColumnsChange] = useVisibleColumns(columns, {\n        value: visibleColumns,\n        onChange: onVisibleColumnsChange,\n        defaultValue: defaultVisibleColumns,\n    });\n\n    const displayedColumnNames = useMemo(\n        () => columns.filter((column) => activeVisibleColumns.includes(column)),\n        [columns, activeVisibleColumns],\n    );\n\n    const resolvedColumns = useMemo(() => {\n        if (tableColumns) {\n            return tableColumns;\n        }\n        return [...buildPreviewColumns<TRow>(displayedColumnNames, i18n), ...(extraColumns ?? [])];\n    }, [tableColumns, extraColumns, displayedColumnNames]);\n\n    const fieldsOptions = useMemo(\n        () => columns.map((column) => ({id: column, title: column})),\n        [columns],\n    );\n\n    const filteredRows = useMemo(\n        () => filterPreviewRows(rows, displayedColumnNames, search),\n        [rows, displayedColumnNames, search],\n    );\n\n    if (errorContent) {\n        return (\n            <Text color=\"danger\" className={block('error')}>\n                {errorContent}\n            </Text>\n        );\n    }\n\n    return (\n        <Flex direction=\"column\" gap={2} className={block(null, className)}>\n            {!hideToolbar && (\n                <FieldsSearchToolbar\n                    search={search}\n                    onSearchUpdate={onSearchUpdate}\n                    searchPlaceholder={searchPlaceholder}\n                    fields={fieldsOptions}\n                    visibleFields={activeVisibleColumns}\n                    onVisibleFieldsChange={handleVisibleColumnsChange}\n                    hideFieldsSelector={hideFieldsSelector}\n                />\n            )}\n            <DataTable<TRow>\n                columns={resolvedColumns}\n                data={filteredRows}\n                loading={loading}\n                loaded={loaded}\n                emptyVariant={search ? 'nothing-found' : 'no-data'}\n                settings={{displayIndices: false}}\n                className={block('table')}\n            />\n        </Flex>\n    );\n}\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"names":["React","useMemo","Flex","Text","cn","DataTable","FieldsSearchToolbar","QueryResultsTable","useVisibleColumns","buildPreviewColumns","filterPreviewRows","i18n","jsx","_jsx","jsxs","_jsxs","block","getColumnName","column","name","isQueryResultColumn","NavigationPreview","_ref","data","view","search","onSearchUpdate","searchPlaceholder","visibleColumns","onVisibleColumnsChange","defaultVisibleColumns","hideToolbar","hideFieldsSelector","className","columns","rows","loading","loaded","errorContent","_ref2","tableColumns","extraColumns","formatterSettings","maxVisibleLines","columnNames","map","_useVisibleColumns","value","onChange","defaultValue","_useVisibleColumns2","_slicedToArray","activeVisibleColumns","handleVisibleColumnsChange","displayedColumns","filter","includes","displayedColumnNames","typedColumns","canUseQueryResultsTable","length","resolvedColumns","concat","_toConsumableArray","fieldsOptions","_column$header","id","title","header","filteredRows","color","children","direction","gap","fields","visibleFields","onVisibleFieldsChange","emptyVariant","displayIndices","settings"],"sources":["NavigationPreview.tsx"],"sourcesContent":["import React, {useMemo} from 'react';\nimport {Flex, Text} from '@gravity-ui/uikit';\nimport cn from 'bem-cn-lite';\nimport {type Column, DataTable, FieldsSearchToolbar, QueryResultsTable} from '../../components';\nimport {useVisibleColumns} from '../../helpers/useVisibleColumns';\nimport type {\n    NavigationPreviewColumn,\n    NavigationPreviewConfig,\n    NavigationPreviewFormatterConfig,\n    NavigationPreviewRow,\n} from '../../types/navigation';\nimport type {QueryResultColumn} from '../../types/queryResults';\nimport {buildPreviewColumns} from './helpers/buildPreviewColumns';\nimport {filterPreviewRows} from './helpers/filterPreviewRows';\nimport i18n from './i18n';\nimport './NavigationPreview.scss';\n\nconst block = cn('qp-navigation-preview');\n\nexport type NavigationPreviewViewConfig<TRow extends NavigationPreviewRow = NavigationPreviewRow> =\n    NavigationPreviewFormatterConfig & {\n        tableColumns?: Array<Column<TRow>>;\n        extraColumns?: Array<Column<TRow>>;\n    };\n\nexport type NavigationPreviewProps<TRow extends NavigationPreviewRow = NavigationPreviewRow> = {\n    data: NavigationPreviewConfig<TRow>;\n    view?: NavigationPreviewViewConfig<TRow>;\n    search?: string;\n    onSearchUpdate?: (value: string) => void;\n    searchPlaceholder?: string;\n    visibleColumns?: string[];\n    onVisibleColumnsChange?: (value: string[]) => void;\n    defaultVisibleColumns?: string[];\n    hideToolbar?: boolean;\n    hideFieldsSelector?: boolean;\n    className?: string;\n};\n\nfunction getColumnName<TRow extends NavigationPreviewRow>(column: NavigationPreviewColumn<TRow>) {\n    return typeof column === 'string' ? column : column.name;\n}\n\nfunction isQueryResultColumn<TRow extends NavigationPreviewRow>(\n    column: NavigationPreviewColumn<TRow>,\n): column is QueryResultColumn<TRow> {\n    return typeof column !== 'string';\n}\n\nexport function NavigationPreview<TRow extends NavigationPreviewRow = NavigationPreviewRow>({\n    data,\n    view,\n    search,\n    onSearchUpdate,\n    searchPlaceholder,\n    visibleColumns,\n    onVisibleColumnsChange,\n    defaultVisibleColumns,\n    hideToolbar,\n    hideFieldsSelector,\n    className,\n}: NavigationPreviewProps<TRow>) {\n    const {columns, rows, loading, loaded, errorContent} = data;\n    const {tableColumns, extraColumns, formatterSettings, maxVisibleLines} = view ?? {};\n    const columnNames = useMemo(() => columns.map(getColumnName), [columns]);\n\n    const [activeVisibleColumns, handleVisibleColumnsChange] = useVisibleColumns(columnNames, {\n        value: visibleColumns,\n        onChange: onVisibleColumnsChange,\n        defaultValue: defaultVisibleColumns,\n    });\n\n    const displayedColumns = useMemo(\n        () => columns.filter((column) => activeVisibleColumns.includes(getColumnName(column))),\n        [columns, activeVisibleColumns],\n    );\n    const displayedColumnNames = useMemo(\n        () => displayedColumns.map(getColumnName),\n        [displayedColumns],\n    );\n    const typedColumns = useMemo(\n        () => displayedColumns.filter(isQueryResultColumn),\n        [displayedColumns],\n    );\n    const canUseQueryResultsTable =\n        !tableColumns && !extraColumns?.length && typedColumns.length === displayedColumns.length;\n\n    const resolvedColumns = useMemo(() => {\n        if (tableColumns) {\n            return tableColumns;\n        }\n        return [...buildPreviewColumns<TRow>(displayedColumnNames, i18n), ...(extraColumns ?? [])];\n    }, [tableColumns, extraColumns, displayedColumnNames]);\n\n    const fieldsOptions = useMemo(\n        () =>\n            columns.map((column) => ({\n                id: getColumnName(column),\n                title: typeof column === 'string' ? column : (column.header ?? column.name),\n            })),\n        [columns],\n    );\n\n    const filteredRows = useMemo(\n        () => filterPreviewRows(rows, displayedColumnNames, search),\n        [rows, displayedColumnNames, search],\n    );\n\n    if (errorContent) {\n        return (\n            <Text color=\"danger\" className={block('error')}>\n                {errorContent}\n            </Text>\n        );\n    }\n\n    return (\n        <Flex direction=\"column\" gap={2} className={block(null, className)}>\n            {!hideToolbar && (\n                <FieldsSearchToolbar\n                    search={search}\n                    onSearchUpdate={onSearchUpdate}\n                    searchPlaceholder={searchPlaceholder}\n                    fields={fieldsOptions}\n                    visibleFields={activeVisibleColumns}\n                    onVisibleFieldsChange={handleVisibleColumnsChange}\n                    hideFieldsSelector={hideFieldsSelector}\n                />\n            )}\n            {canUseQueryResultsTable ? (\n                <QueryResultsTable<TRow>\n                    columns={typedColumns}\n                    rows={filteredRows}\n                    loading={loading}\n                    loaded={loaded}\n                    formatterSettings={formatterSettings}\n                    maxVisibleLines={maxVisibleLines}\n                    emptyVariant={search ? 'nothing-found' : 'no-data'}\n                    displayIndices={false}\n                    className={block('table')}\n                />\n            ) : (\n                <DataTable<TRow>\n                    columns={resolvedColumns}\n                    data={filteredRows}\n                    loading={loading}\n                    loaded={loaded}\n                    emptyVariant={search ? 'nothing-found' : 'no-data'}\n                    settings={{displayIndices: false}}\n                    className={block('table')}\n                />\n            )}\n        </Flex>\n    );\n}\n"],"mappings":"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","ignoreList":[]}

package/build/esm/modules/NavigationPreview/NavigationPreview.scss

@@ -1,24 +1,32 @@
 .qp-navigation-preview {
-  --data-table-border-color: var(--g-color-line-generic);
+    --data-table-border-color: var(--g-color-line-generic);
 
-  min-width: 0;
+    min-width: 0;
 
-  &__error {
-    display: block;
-  }
+    &__error {
+        display: block;
+    }
 
-  &__table {
-    overflow-x: auto;
-  }
+    &__table {
+        overflow-x: auto;
+    }
 
-  .data-table__row,
-  .data-table__head {
-    height: 40px;
-  }
+    .data-table__row,
+    .data-table__head-row {
+        height: 40px;
+    }
 
-  .data-table__th,
-  .data-table__td {
-    border-width: 0 0 1px;
-    vertical-align: middle;
-  }
+    .data-table__box_sticky-head_moving .data-table__head-row {
+        height: auto;
+    }
+
+    .data-table__sticky_head .data-table__head-row {
+        height: 40px;
+    }
+
+    .data-table__th,
+    .data-table__td {
+        border-width: 0 0 1px;
+        vertical-align: middle;
+    }
 }

package/build/esm/modules/NavigationPreview/story/NavigationPreview.stories.d.ts

@@ -8,4 +8,5 @@ export declare const ControlledSearchAndColumns: Story;
 export declare const Loading: Story;
 export declare const Empty: Story;
 export declare const Error: Story;
+export declare const TypedValues: Story;
 export declare const CustomColumns: Story;

package/build/esm/modules/NavigationPreview/story/NavigationPreview.stories.js

@@ -105,6 +105,30 @@ export var Error = {
     }
   }
 };
+var TYPED_COLUMNS = [{
+  name: 'id',
+  type: ['DataType', 'Uint64']
+}, {
+  name: 'tags',
+  type: ['ListType', ['DataType', 'Utf8']]
+}, {
+  name: 'details',
+  type: ['StructType', [['name', ['DataType', 'Utf8']], ['score', ['DataType', 'Double']]]]
+}];
+var TYPED_ROWS = [{
+  id: 1,
+  tags: ['primary', 'preview'],
+  details: ['Result', 42.5]
+}];
+export var TypedValues = {
+  args: {
+    data: {
+      columns: TYPED_COLUMNS,
+      rows: TYPED_ROWS,
+      loaded: true
+    }
+  }
+};
 var CUSTOM_ROWS = PREVIEW_ROWS.map(function (row, index) {
   return _objectSpread(_objectSpread({}, row), {}, {
     lock: index % 2 === 0 ? 'shared' : undefined

package/build/esm/modules/NavigationPreview/story/NavigationPreview.stories.js.map

@@ -1 +1 @@
-{"version":3,"names":["React","useState","Icon","Label","LockIcon","props","_jsx","_objectSpread","children","fill","fillRule","d","clipRule","defaultProps","xmlns","width","height","viewBox","NavigationPreview","PREVIEW_COLUMNS","PREVIEW_ROWS","jsx","meta","title","component","tags","parameters","layout","decorators","Story","style","Default","args","data","columns","rows","loaded","ControlledStory","_useState","_useState2","_slicedToArray","search","setSearch","_useState3","_useState4","visibleColumns","setVisibleColumns","onSearchUpdate","onVisibleColumnsChange","ControlledSearchAndColumns","render","Loading","loading","Empty","Error","errorContent","CUSTOM_ROWS","map","row","index","lock","undefined","CustomColumns","view","extraColumns","name","header","_ref","icon","size"],"sources":["NavigationPreview.stories.tsx"],"sourcesContent":["import React, {useState} from 'react';\nimport type {Meta, StoryObj} from '@storybook/react';\nimport {Icon, Label} from '@gravity-ui/uikit';\nimport LockIcon from '@gravity-ui/icons/svgs/lock.svg';\nimport {NavigationPreview} from '..';\nimport type {NavigationPreviewRow} from '../../../types/navigation';\nimport {PREVIEW_COLUMNS, PREVIEW_ROWS} from './mockData';\n\nconst meta: Meta<typeof NavigationPreview> = {\n    title: 'Modules/NavigationPreview',\n    component: NavigationPreview,\n    tags: ['autodocs'],\n    parameters: {\n        layout: 'padded',\n    },\n    decorators: [\n        (Story) => (\n            <div style={{width: 560}}>\n                <Story />\n            </div>\n        ),\n    ],\n};\n\nexport default meta;\ntype Story = StoryObj<typeof NavigationPreview>;\n\nexport const Default: Story = {\n    args: {\n        data: {columns: PREVIEW_COLUMNS, rows: PREVIEW_ROWS, loaded: true},\n    },\n};\n\nconst ControlledStory = () => {\n    const [search, setSearch] = useState('');\n    const [visibleColumns, setVisibleColumns] = useState<string[]>(['id', 'title', 'status']);\n\n    return (\n        <NavigationPreview\n            data={{columns: PREVIEW_COLUMNS, rows: PREVIEW_ROWS, loaded: true}}\n            search={search}\n            onSearchUpdate={setSearch}\n            visibleColumns={visibleColumns}\n            onVisibleColumnsChange={setVisibleColumns}\n        />\n    );\n};\n\nexport const ControlledSearchAndColumns: Story = {\n    render: () => <ControlledStory />,\n};\n\nexport const Loading: Story = {\n    args: {\n        data: {columns: [], rows: [], loading: true},\n    },\n};\n\nexport const Empty: Story = {\n    args: {\n        data: {columns: PREVIEW_COLUMNS, rows: [], loaded: true},\n    },\n};\n\nexport const Error: Story = {\n    args: {\n        data: {columns: [], rows: [], errorContent: 'Failed to load table preview'},\n    },\n};\n\ntype CustomRow = NavigationPreviewRow & {lock?: string};\n\nconst CUSTOM_ROWS: CustomRow[] = PREVIEW_ROWS.map((row, index) => ({\n    ...row,\n    lock: index % 2 === 0 ? 'shared' : undefined,\n}));\n\nexport const CustomColumns: Story = {\n    args: {\n        data: {columns: PREVIEW_COLUMNS, rows: CUSTOM_ROWS, loaded: true},\n        view: {\n            extraColumns: [\n                {\n                    name: 'lock',\n                    header: 'Lock',\n                    render: ({row}) =>\n                        (row as CustomRow).lock ? (\n                            <Label icon={<Icon data={LockIcon} size={12} />}>\n                                {(row as CustomRow).lock}\n                            </Label>\n                        ) : (\n                            '—'\n                        ),\n                },\n            ],\n        },\n    },\n};\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"names":["React","useState","Icon","Label","LockIcon","props","_jsx","_objectSpread","children","fill","fillRule","d","clipRule","defaultProps","xmlns","width","height","viewBox","NavigationPreview","PREVIEW_COLUMNS","PREVIEW_ROWS","jsx","meta","title","component","tags","parameters","layout","decorators","Story","style","Default","args","data","columns","rows","loaded","ControlledStory","_useState","_useState2","_slicedToArray","search","setSearch","_useState3","_useState4","visibleColumns","setVisibleColumns","onSearchUpdate","onVisibleColumnsChange","ControlledSearchAndColumns","render","Loading","loading","Empty","Error","errorContent","TYPED_COLUMNS","name","type","TYPED_ROWS","id","details","TypedValues","CUSTOM_ROWS","map","row","index","lock","undefined","CustomColumns","view","extraColumns","header","_ref","icon","size"],"sources":["NavigationPreview.stories.tsx"],"sourcesContent":["import React, {useState} from 'react';\nimport type {Meta, StoryObj} from '@storybook/react';\nimport {Icon, Label} from '@gravity-ui/uikit';\nimport LockIcon from '@gravity-ui/icons/svgs/lock.svg';\nimport {NavigationPreview} from '..';\nimport type {NavigationPreviewColumn, NavigationPreviewRow} from '../../../types/navigation';\nimport {PREVIEW_COLUMNS, PREVIEW_ROWS} from './mockData';\n\nconst meta: Meta<typeof NavigationPreview> = {\n    title: 'Modules/NavigationPreview',\n    component: NavigationPreview,\n    tags: ['autodocs'],\n    parameters: {\n        layout: 'padded',\n    },\n    decorators: [\n        (Story) => (\n            <div style={{width: 560}}>\n                <Story />\n            </div>\n        ),\n    ],\n};\n\nexport default meta;\ntype Story = StoryObj<typeof NavigationPreview>;\n\nexport const Default: Story = {\n    args: {\n        data: {columns: PREVIEW_COLUMNS, rows: PREVIEW_ROWS, loaded: true},\n    },\n};\n\nconst ControlledStory = () => {\n    const [search, setSearch] = useState('');\n    const [visibleColumns, setVisibleColumns] = useState<string[]>(['id', 'title', 'status']);\n\n    return (\n        <NavigationPreview\n            data={{columns: PREVIEW_COLUMNS, rows: PREVIEW_ROWS, loaded: true}}\n            search={search}\n            onSearchUpdate={setSearch}\n            visibleColumns={visibleColumns}\n            onVisibleColumnsChange={setVisibleColumns}\n        />\n    );\n};\n\nexport const ControlledSearchAndColumns: Story = {\n    render: () => <ControlledStory />,\n};\n\nexport const Loading: Story = {\n    args: {\n        data: {columns: [], rows: [], loading: true},\n    },\n};\n\nexport const Empty: Story = {\n    args: {\n        data: {columns: PREVIEW_COLUMNS, rows: [], loaded: true},\n    },\n};\n\nexport const Error: Story = {\n    args: {\n        data: {columns: [], rows: [], errorContent: 'Failed to load table preview'},\n    },\n};\n\nconst TYPED_COLUMNS: Array<NavigationPreviewColumn<NavigationPreviewRow>> = [\n    {name: 'id', type: ['DataType', 'Uint64']},\n    {name: 'tags', type: ['ListType', ['DataType', 'Utf8']]},\n    {\n        name: 'details',\n        type: [\n            'StructType',\n            [\n                ['name', ['DataType', 'Utf8']],\n                ['score', ['DataType', 'Double']],\n            ],\n        ],\n    },\n];\n\nconst TYPED_ROWS: NavigationPreviewRow[] = [\n    {id: 1, tags: ['primary', 'preview'], details: ['Result', 42.5]},\n];\n\nexport const TypedValues: Story = {\n    args: {\n        data: {columns: TYPED_COLUMNS, rows: TYPED_ROWS, loaded: true},\n    },\n};\n\ntype CustomRow = NavigationPreviewRow & {lock?: string};\n\nconst CUSTOM_ROWS: CustomRow[] = PREVIEW_ROWS.map((row, index) => ({\n    ...row,\n    lock: index % 2 === 0 ? 'shared' : undefined,\n}));\n\nexport const CustomColumns: Story = {\n    args: {\n        data: {columns: PREVIEW_COLUMNS, rows: CUSTOM_ROWS, loaded: true},\n        view: {\n            extraColumns: [\n                {\n                    name: 'lock',\n                    header: 'Lock',\n                    render: ({row}) =>\n                        (row as CustomRow).lock ? (\n                            <Label icon={<Icon data={LockIcon} size={12} />}>\n                                {(row as CustomRow).lock}\n                            </Label>\n                        ) : (\n                            '—'\n                        ),\n                },\n            ],\n        },\n    },\n};\n"],"mappings":"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","ignoreList":[]}

package/build/esm/modules/NavigationPreview/story/mockData.d.ts

@@ -1,3 +1,3 @@
-import type { NavigationPreviewRow } from '../../../types/navigation';
-export declare const PREVIEW_COLUMNS: string[];
+import type { NavigationPreviewColumn, NavigationPreviewRow } from '../../../types/navigation';
+export declare const PREVIEW_COLUMNS: Array<NavigationPreviewColumn<NavigationPreviewRow>>;
 export declare const PREVIEW_ROWS: NavigationPreviewRow[];