@gravity-ui/querieskit 1.3.1 → 1.4.0

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

@@ -1,5 +1,5 @@
 import React from 'react';
-import { QueryListComparisonConfig, QueryListEditingConfig, QueryListItem, QueryListRow, QueryListRowAction, QueryListRowRenderData, QueryListRowVariant, QueryListVisibleFieldsConfig } from '../../types/queryList';
+import { QueryListComparisonConfig, QueryListEditingConfig, QueryListItem, QueryListLinkRenderer, QueryListRow, QueryListRowAction, QueryListRowRenderData, QueryListRowVariant, QueryListVisibleFieldsConfig } from '../../types/queryList';
 import './RowsList.scss';
 export type RowsListProps<T extends QueryListRow> = {
     items: QueryListItem<T>[];
@@ -11,7 +11,11 @@ export type RowsListProps<T extends QueryListRow> = {
     getRowActions?: (item: T) => QueryListRowAction<T>[];
     renderRow: (data: QueryListRowRenderData<T>) => React.ReactNode;
     showFiltersHint?: boolean;
+    hasMore?: boolean;
+    loading?: boolean;
+    onLoadMore?: () => void;
+    renderLink?: QueryListLinkRenderer;
     className?: string;
     onItemClick?: (item: QueryListItem<T>, index: number) => void;
 };
-export declare const RowsList: <T extends QueryListRow>({ items, selectedRowId, rowVariant, visibleFields, editing, comparison, getRowActions, renderRow, showFiltersHint, className, onItemClick, }: RowsListProps<T>) => React.JSX.Element;
+export declare const RowsList: <T extends QueryListRow>({ items, selectedRowId, rowVariant, visibleFields, editing, comparison, getRowActions, renderRow, showFiltersHint, hasMore, loading, onLoadMore, renderLink, className, onItemClick, }: RowsListProps<T>) => React.JSX.Element;

package/build/esm/modules/RowsList/RowsList.js

@@ -20,6 +20,10 @@ export var RowsList = function RowsList(_ref) {
     getRowActions = _ref.getRowActions,
     renderRow = _ref.renderRow,
     showFiltersHint = _ref.showFiltersHint,
+    hasMore = _ref.hasMore,
+    loading = _ref.loading,
+    onLoadMore = _ref.onLoadMore,
+    renderLink = _ref.renderLink,
     className = _ref.className,
     onItemClick = _ref.onItemClick;
   var getItemHeight = function getItemHeight(item) {
@@ -36,12 +40,6 @@ export var RowsList = function RowsList(_ref) {
     var selected = comparison.comparedRowIds.includes(item.id);
     comparison.onChange(item, !selected);
   };
-  if (!items.length) {
-    return /*#__PURE__*/_jsx(EmptyContent, {
-      variant: showFiltersHint ? 'nothing-found' : 'no-files',
-      className: className
-    });
-  }
   return /*#__PURE__*/_jsx(LazyList, {
     className: block(null, className),
     items: items,
@@ -55,10 +53,18 @@ export var RowsList = function RowsList(_ref) {
         visibleFields: visibleFields,
         editing: editing,
         comparison: comparison,
-        getRowActions: getRowActions
+        getRowActions: getRowActions,
+        renderLink: renderLink
       }));
     },
     selectedItemIndex: selectedItemIndex,
+    hasMore: hasMore,
+    loading: loading,
+    onLoadMore: onLoadMore,
+    emptyContent: /*#__PURE__*/_jsx(EmptyContent, {
+      variant: showFiltersHint ? 'nothing-found' : 'no-files',
+      className: className
+    }),
     onItemClick: handleItemClick
   });
 };

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

@@ -1 +1 @@
-{"version":3,"names":["React","cn","EmptyContent","LazyList","prepareRowData","SEARCH_ROW_HEIGHT","jsx","_jsx","block","RowsList","_ref","items","selectedRowId","_ref$rowVariant","rowVariant","visibleFields","editing","comparison","getRowActions","renderRow","showFiltersHint","className","onItemClick","getItemHeight","item","height","selectedItemIndex","undefined","findIndex","id","handleItemClick","index","enabled","selected","comparedRowIds","includes","onChange","length","variant","itemHeight","renderItem","isActive"],"sources":["RowsList.tsx"],"sourcesContent":["import React from 'react';\nimport cn from 'bem-cn-lite';\nimport {\n    QueryListComparisonConfig,\n    QueryListEditingConfig,\n    QueryListItem,\n    QueryListRow,\n    QueryListRowAction,\n    QueryListRowRenderData,\n    QueryListRowVariant,\n    QueryListVisibleFieldsConfig,\n} from '../../types/queryList';\nimport {EmptyContent, LazyList} from '../../components';\nimport {prepareRowData} from './helpers/prepareRowData';\nimport {SEARCH_ROW_HEIGHT} from '../../constants/row';\nimport './RowsList.scss';\n\nconst block = cn('qp-rows-list');\n\nexport type RowsListProps<T extends QueryListRow> = {\n    items: QueryListItem<T>[];\n    selectedRowId?: T['id'];\n    rowVariant?: QueryListRowVariant;\n    visibleFields?: QueryListVisibleFieldsConfig<T>;\n    editing?: QueryListEditingConfig<T>;\n    comparison?: QueryListComparisonConfig<T>;\n    getRowActions?: (item: T) => QueryListRowAction<T>[];\n    renderRow: (data: QueryListRowRenderData<T>) => React.ReactNode;\n    showFiltersHint?: boolean;\n    className?: string;\n    onItemClick?: (item: QueryListItem<T>, index: number) => void;\n};\n\nexport const RowsList = <T extends QueryListRow>({\n    items,\n    selectedRowId,\n    rowVariant = 'default',\n    visibleFields,\n    editing,\n    comparison,\n    getRowActions,\n    renderRow,\n    showFiltersHint,\n    className,\n    onItemClick,\n}: RowsListProps<T>) => {\n    const getItemHeight = (item: QueryListItem<T>) =>\n        rowVariant === 'search' && !('header' in item) ? SEARCH_ROW_HEIGHT : item.height;\n    const selectedItemIndex =\n        selectedRowId === undefined\n            ? undefined\n            : items.findIndex((item) => !('header' in item) && item.id === selectedRowId);\n\n    const handleItemClick = (item: QueryListItem<T>, index: number) => {\n        if ('header' in item || !comparison?.enabled) {\n            onItemClick?.(item, index);\n            return;\n        }\n\n        const selected = comparison.comparedRowIds.includes(item.id);\n        comparison.onChange(item, !selected);\n    };\n\n    if (!items.length) {\n        return (\n            <EmptyContent\n                variant={showFiltersHint ? 'nothing-found' : 'no-files'}\n                className={className}\n            />\n        );\n    }\n\n    return (\n        <LazyList<QueryListItem<T>>\n            className={block(null, className)}\n            items={items}\n            itemHeight={getItemHeight}\n            renderItem={(item, isActive, index) =>\n                renderRow(\n                    prepareRowData({\n                        item,\n                        isActive,\n                        index,\n                        variant: rowVariant,\n                        visibleFields,\n                        editing,\n                        comparison,\n                        getRowActions,\n                    }),\n                )\n            }\n            selectedItemIndex={selectedItemIndex}\n            onItemClick={handleItemClick}\n        />\n    );\n};\n"],"mappings":";;;AAAA,OAAOA,KAAK,MAAM,OAAO;AACzB,OAAOC,EAAE,MAAM,aAAa;AAW5B,SAAQC,YAAY,EAAEC,QAAQ;AAC9B,SAAQC,cAAc;AACtB,SAAQC,iBAAiB;AACzB;AAAyB,SAAAC,GAAA,IAAAC,IAAA;AAEzB,IAAMC,KAAK,GAAGP,EAAE,CAAC,cAAc,CAAC;AAgBhC,OAAO,IAAMQ,QAAQ,GAAG,SAAXA,QAAQA,CAAAC,IAAA,EAYG;EAAA,IAXpBC,KAAK,GAAAD,IAAA,CAALC,KAAK;IACLC,aAAa,GAAAF,IAAA,CAAbE,aAAa;IAAAC,eAAA,GAAAH,IAAA,CACbI,UAAU;IAAVA,UAAU,GAAAD,eAAA,cAAG,SAAS,GAAAA,eAAA;IACtBE,aAAa,GAAAL,IAAA,CAAbK,aAAa;IACbC,OAAO,GAAAN,IAAA,CAAPM,OAAO;IACPC,UAAU,GAAAP,IAAA,CAAVO,UAAU;IACVC,aAAa,GAAAR,IAAA,CAAbQ,aAAa;IACbC,SAAS,GAAAT,IAAA,CAATS,SAAS;IACTC,eAAe,GAAAV,IAAA,CAAfU,eAAe;IACfC,SAAS,GAAAX,IAAA,CAATW,SAAS;IACTC,WAAW,GAAAZ,IAAA,CAAXY,WAAW;EAEX,IAAMC,aAAa,GAAG,SAAhBA,aAAaA,CAAIC,IAAsB;IAAA,OACzCV,UAAU,KAAK,QAAQ,IAAI,EAAE,QAAQ,IAAIU,IAAI,CAAC,GAAGnB,iBAAiB,GAAGmB,IAAI,CAACC,MAAM;EAAA;EACpF,IAAMC,iBAAiB,GACnBd,aAAa,KAAKe,SAAS,GACrBA,SAAS,GACThB,KAAK,CAACiB,SAAS,CAAC,UAACJ,IAAI;IAAA,OAAK,EAAE,QAAQ,IAAIA,IAAI,CAAC,IAAIA,IAAI,CAACK,EAAE,KAAKjB,aAAa;EAAA,EAAC;EAErF,IAAMkB,eAAe,GAAG,SAAlBA,eAAeA,CAAIN,IAAsB,EAAEO,KAAa,EAAK;IAC/D,IAAI,QAAQ,IAAIP,IAAI,IAAI,EAACP,UAAU,aAAVA,UAAU,eAAVA,UAAU,CAAEe,OAAO,GAAE;MAC1CV,WAAW,aAAXA,WAAW,eAAXA,WAAW,CAAGE,IAAI,EAAEO,KAAK,CAAC;MAC1B;IACJ;IAEA,IAAME,QAAQ,GAAGhB,UAAU,CAACiB,cAAc,CAACC,QAAQ,CAACX,IAAI,CAACK,EAAE,CAAC;IAC5DZ,UAAU,CAACmB,QAAQ,CAACZ,IAAI,EAAE,CAACS,QAAQ,CAAC;EACxC,CAAC;EAED,IAAI,CAACtB,KAAK,CAAC0B,MAAM,EAAE;IACf,oBACI9B,IAAA,CAACL,YAAY;MACToC,OAAO,EAAElB,eAAe,GAAG,eAAe,GAAG,UAAW;MACxDC,SAAS,EAAEA;IAAU,CACxB,CAAC;EAEV;EAEA,oBACId,IAAA,CAACJ,QAAQ;IACLkB,SAAS,EAAEb,KAAK,CAAC,IAAI,EAAEa,SAAS,CAAE;IAClCV,KAAK,EAAEA,KAAM;IACb4B,UAAU,EAAEhB,aAAc;IAC1BiB,UAAU,EAAE,SAAZA,UAAUA,CAAGhB,IAAI,EAAEiB,QAAQ,EAAEV,KAAK;MAAA,OAC9BZ,SAAS,CACLf,cAAc,CAAC;QACXoB,IAAI,EAAJA,IAAI;QACJiB,QAAQ,EAARA,QAAQ;QACRV,KAAK,EAALA,KAAK;QACLO,OAAO,EAAExB,UAAU;QACnBC,aAAa,EAAbA,aAAa;QACbC,OAAO,EAAPA,OAAO;QACPC,UAAU,EAAVA,UAAU;QACVC,aAAa,EAAbA;MACJ,CAAC,CACL,CAAC;IAAA,CACJ;IACDQ,iBAAiB,EAAEA,iBAAkB;IACrCJ,WAAW,EAAEQ;EAAgB,CAChC,CAAC;AAEV,CAAC","ignoreList":[]}
+{"version":3,"names":["React","cn","EmptyContent","LazyList","prepareRowData","SEARCH_ROW_HEIGHT","jsx","_jsx","block","RowsList","_ref","items","selectedRowId","_ref$rowVariant","rowVariant","visibleFields","editing","comparison","getRowActions","renderRow","showFiltersHint","hasMore","loading","onLoadMore","renderLink","className","onItemClick","getItemHeight","item","height","selectedItemIndex","undefined","findIndex","id","handleItemClick","index","enabled","selected","comparedRowIds","includes","onChange","itemHeight","renderItem","isActive","variant","emptyContent"],"sources":["RowsList.tsx"],"sourcesContent":["import React from 'react';\nimport cn from 'bem-cn-lite';\nimport {\n    QueryListComparisonConfig,\n    QueryListEditingConfig,\n    QueryListItem,\n    QueryListLinkRenderer,\n    QueryListRow,\n    QueryListRowAction,\n    QueryListRowRenderData,\n    QueryListRowVariant,\n    QueryListVisibleFieldsConfig,\n} from '../../types/queryList';\nimport {EmptyContent, LazyList} from '../../components';\nimport {prepareRowData} from './helpers/prepareRowData';\nimport {SEARCH_ROW_HEIGHT} from '../../constants/row';\nimport './RowsList.scss';\n\nconst block = cn('qp-rows-list');\n\nexport type RowsListProps<T extends QueryListRow> = {\n    items: QueryListItem<T>[];\n    selectedRowId?: T['id'];\n    rowVariant?: QueryListRowVariant;\n    visibleFields?: QueryListVisibleFieldsConfig<T>;\n    editing?: QueryListEditingConfig<T>;\n    comparison?: QueryListComparisonConfig<T>;\n    getRowActions?: (item: T) => QueryListRowAction<T>[];\n    renderRow: (data: QueryListRowRenderData<T>) => React.ReactNode;\n    showFiltersHint?: boolean;\n    hasMore?: boolean;\n    loading?: boolean;\n    onLoadMore?: () => void;\n    renderLink?: QueryListLinkRenderer;\n    className?: string;\n    onItemClick?: (item: QueryListItem<T>, index: number) => void;\n};\n\nexport const RowsList = <T extends QueryListRow>({\n    items,\n    selectedRowId,\n    rowVariant = 'default',\n    visibleFields,\n    editing,\n    comparison,\n    getRowActions,\n    renderRow,\n    showFiltersHint,\n    hasMore,\n    loading,\n    onLoadMore,\n    renderLink,\n    className,\n    onItemClick,\n}: RowsListProps<T>) => {\n    const getItemHeight = (item: QueryListItem<T>) =>\n        rowVariant === 'search' && !('header' in item) ? SEARCH_ROW_HEIGHT : item.height;\n    const selectedItemIndex =\n        selectedRowId === undefined\n            ? undefined\n            : items.findIndex((item) => !('header' in item) && item.id === selectedRowId);\n\n    const handleItemClick = (item: QueryListItem<T>, index: number) => {\n        if ('header' in item || !comparison?.enabled) {\n            onItemClick?.(item, index);\n            return;\n        }\n\n        const selected = comparison.comparedRowIds.includes(item.id);\n        comparison.onChange(item, !selected);\n    };\n\n    return (\n        <LazyList<QueryListItem<T>>\n            className={block(null, className)}\n            items={items}\n            itemHeight={getItemHeight}\n            renderItem={(item, isActive, index) =>\n                renderRow(\n                    prepareRowData({\n                        item,\n                        isActive,\n                        index,\n                        variant: rowVariant,\n                        visibleFields,\n                        editing,\n                        comparison,\n                        getRowActions,\n                        renderLink,\n                    }),\n                )\n            }\n            selectedItemIndex={selectedItemIndex}\n            hasMore={hasMore}\n            loading={loading}\n            onLoadMore={onLoadMore}\n            emptyContent={\n                <EmptyContent\n                    variant={showFiltersHint ? 'nothing-found' : 'no-files'}\n                    className={className}\n                />\n            }\n            onItemClick={handleItemClick}\n        />\n    );\n};\n"],"mappings":"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","ignoreList":[]}

package/build/esm/modules/RowsList/helpers/prepareRowData.d.ts

@@ -1,4 +1,4 @@
-import { QueryListComparisonConfig, QueryListEditingConfig, QueryListItem, QueryListRow, QueryListRowAction, QueryListRowRenderData, QueryListRowVariant, QueryListVisibleFieldsConfig } from '../../../types/queryList';
+import { QueryListComparisonConfig, QueryListEditingConfig, QueryListItem, QueryListLinkRenderer, QueryListRow, QueryListRowAction, QueryListRowRenderData, QueryListRowVariant, QueryListVisibleFieldsConfig } from '../../../types/queryList';
 type Props<T extends QueryListRow> = {
     item: QueryListItem<T>;
     isActive: boolean;
@@ -8,6 +8,7 @@ type Props<T extends QueryListRow> = {
     editing?: QueryListEditingConfig<T>;
     comparison?: QueryListComparisonConfig<T>;
     getRowActions?: (item: T) => QueryListRowAction<T>[];
+    renderLink?: QueryListLinkRenderer;
 };
-export declare const prepareRowData: <T extends QueryListRow>({ item, isActive, index, variant, visibleFields, editing, comparison, getRowActions, }: Props<T>) => QueryListRowRenderData<T>;
+export declare const prepareRowData: <T extends QueryListRow>({ item, isActive, index, variant, visibleFields, editing, comparison, getRowActions, renderLink, }: Props<T>) => QueryListRowRenderData<T>;
 export {};

package/build/esm/modules/RowsList/helpers/prepareRowData.js

@@ -8,7 +8,8 @@ export var prepareRowData = function prepareRowData(_ref) {
     visibleFields = _ref.visibleFields,
     editing = _ref.editing,
     comparison = _ref.comparison,
-    getRowActions = _ref.getRowActions;
+    getRowActions = _ref.getRowActions,
+    renderLink = _ref.renderLink;
   var isRow = !('header' in item);
   var actions = isRow && getRowActions ? getRowActions(item) : undefined;
   var editingData = isRow && editing ? {
@@ -28,7 +29,8 @@ export var prepareRowData = function prepareRowData(_ref) {
     visibleFields: visibleFields,
     actions: actions,
     editing: editingData,
-    comparison: comparisonData
+    comparison: comparisonData,
+    renderLink: renderLink
   };
 };
 // #sourceMappingURL=prepareRowData.js.map

package/build/esm/modules/RowsList/helpers/prepareRowData.js.map

@@ -1 +1 @@
-{"version":3,"names":["prepareRowData","_ref","item","isActive","index","variant","visibleFields","editing","comparison","getRowActions","isRow","actions","undefined","editingData","enabled","rowId","id","onSubmit","onCancel","comparisonData","checked","comparedRowIds","includes"],"sources":["prepareRowData.ts"],"sourcesContent":["import {\n    QueryListComparisonConfig,\n    QueryListEditingConfig,\n    QueryListItem,\n    QueryListRow,\n    QueryListRowAction,\n    QueryListRowRenderData,\n    QueryListRowVariant,\n    QueryListVisibleFieldsConfig,\n} from '../../../types/queryList';\n\ntype Props<T extends QueryListRow> = {\n    item: QueryListItem<T>;\n    isActive: boolean;\n    index: number;\n    variant: QueryListRowVariant;\n    visibleFields?: QueryListVisibleFieldsConfig<T>;\n    editing?: QueryListEditingConfig<T>;\n    comparison?: QueryListComparisonConfig<T>;\n    getRowActions?: (item: T) => QueryListRowAction<T>[];\n};\n\nexport const prepareRowData = <T extends QueryListRow>({\n    item,\n    isActive,\n    index,\n    variant,\n    visibleFields,\n    editing,\n    comparison,\n    getRowActions,\n}: Props<T>): QueryListRowRenderData<T> => {\n    const isRow = !('header' in item);\n    const actions = isRow && getRowActions ? getRowActions(item) : undefined;\n    const editingData =\n        isRow && editing\n            ? {\n                  enabled: editing.rowId === item.id,\n                  onSubmit: editing.onSubmit,\n                  onCancel: editing.onCancel,\n              }\n            : undefined;\n    const comparisonData =\n        isRow && comparison && comparison.enabled\n            ? {\n                  enabled: true,\n                  checked: comparison.comparedRowIds.includes(item.id),\n              }\n            : undefined;\n\n    return {\n        item,\n        index,\n        isActive,\n        variant,\n        visibleFields,\n        actions,\n        editing: editingData,\n        comparison: comparisonData,\n    };\n};\n"],"mappings":";;AAsBA,OAAO,IAAMA,cAAc,GAAG,SAAjBA,cAAcA,CAAAC,IAAA,EASgB;EAAA,IARvCC,IAAI,GAAAD,IAAA,CAAJC,IAAI;IACJC,QAAQ,GAAAF,IAAA,CAARE,QAAQ;IACRC,KAAK,GAAAH,IAAA,CAALG,KAAK;IACLC,OAAO,GAAAJ,IAAA,CAAPI,OAAO;IACPC,aAAa,GAAAL,IAAA,CAAbK,aAAa;IACbC,OAAO,GAAAN,IAAA,CAAPM,OAAO;IACPC,UAAU,GAAAP,IAAA,CAAVO,UAAU;IACVC,aAAa,GAAAR,IAAA,CAAbQ,aAAa;EAEb,IAAMC,KAAK,GAAG,EAAE,QAAQ,IAAIR,IAAI,CAAC;EACjC,IAAMS,OAAO,GAAGD,KAAK,IAAID,aAAa,GAAGA,aAAa,CAACP,IAAI,CAAC,GAAGU,SAAS;EACxE,IAAMC,WAAW,GACbH,KAAK,IAAIH,OAAO,GACV;IACIO,OAAO,EAAEP,OAAO,CAACQ,KAAK,KAAKb,IAAI,CAACc,EAAE;IAClCC,QAAQ,EAAEV,OAAO,CAACU,QAAQ;IAC1BC,QAAQ,EAAEX,OAAO,CAACW;EACtB,CAAC,GACDN,SAAS;EACnB,IAAMO,cAAc,GAChBT,KAAK,IAAIF,UAAU,IAAIA,UAAU,CAACM,OAAO,GACnC;IACIA,OAAO,EAAE,IAAI;IACbM,OAAO,EAAEZ,UAAU,CAACa,cAAc,CAACC,QAAQ,CAACpB,IAAI,CAACc,EAAE;EACvD,CAAC,GACDJ,SAAS;EAEnB,OAAO;IACHV,IAAI,EAAJA,IAAI;IACJE,KAAK,EAALA,KAAK;IACLD,QAAQ,EAARA,QAAQ;IACRE,OAAO,EAAPA,OAAO;IACPC,aAAa,EAAbA,aAAa;IACbK,OAAO,EAAPA,OAAO;IACPJ,OAAO,EAAEM,WAAW;IACpBL,UAAU,EAAEW;EAChB,CAAC;AACL,CAAC","ignoreList":[]}
+{"version":3,"names":["prepareRowData","_ref","item","isActive","index","variant","visibleFields","editing","comparison","getRowActions","renderLink","isRow","actions","undefined","editingData","enabled","rowId","id","onSubmit","onCancel","comparisonData","checked","comparedRowIds","includes"],"sources":["prepareRowData.ts"],"sourcesContent":["import {\n    QueryListComparisonConfig,\n    QueryListEditingConfig,\n    QueryListItem,\n    QueryListLinkRenderer,\n    QueryListRow,\n    QueryListRowAction,\n    QueryListRowRenderData,\n    QueryListRowVariant,\n    QueryListVisibleFieldsConfig,\n} from '../../../types/queryList';\n\ntype Props<T extends QueryListRow> = {\n    item: QueryListItem<T>;\n    isActive: boolean;\n    index: number;\n    variant: QueryListRowVariant;\n    visibleFields?: QueryListVisibleFieldsConfig<T>;\n    editing?: QueryListEditingConfig<T>;\n    comparison?: QueryListComparisonConfig<T>;\n    getRowActions?: (item: T) => QueryListRowAction<T>[];\n    renderLink?: QueryListLinkRenderer;\n};\n\nexport const prepareRowData = <T extends QueryListRow>({\n    item,\n    isActive,\n    index,\n    variant,\n    visibleFields,\n    editing,\n    comparison,\n    getRowActions,\n    renderLink,\n}: Props<T>): QueryListRowRenderData<T> => {\n    const isRow = !('header' in item);\n    const actions = isRow && getRowActions ? getRowActions(item) : undefined;\n    const editingData =\n        isRow && editing\n            ? {\n                  enabled: editing.rowId === item.id,\n                  onSubmit: editing.onSubmit,\n                  onCancel: editing.onCancel,\n              }\n            : undefined;\n    const comparisonData =\n        isRow && comparison && comparison.enabled\n            ? {\n                  enabled: true,\n                  checked: comparison.comparedRowIds.includes(item.id),\n              }\n            : undefined;\n\n    return {\n        item,\n        index,\n        isActive,\n        variant,\n        visibleFields,\n        actions,\n        editing: editingData,\n        comparison: comparisonData,\n        renderLink,\n    };\n};\n"],"mappings":";;AAwBA,OAAO,IAAMA,cAAc,GAAG,SAAjBA,cAAcA,CAAAC,IAAA,EAUgB;EAAA,IATvCC,IAAI,GAAAD,IAAA,CAAJC,IAAI;IACJC,QAAQ,GAAAF,IAAA,CAARE,QAAQ;IACRC,KAAK,GAAAH,IAAA,CAALG,KAAK;IACLC,OAAO,GAAAJ,IAAA,CAAPI,OAAO;IACPC,aAAa,GAAAL,IAAA,CAAbK,aAAa;IACbC,OAAO,GAAAN,IAAA,CAAPM,OAAO;IACPC,UAAU,GAAAP,IAAA,CAAVO,UAAU;IACVC,aAAa,GAAAR,IAAA,CAAbQ,aAAa;IACbC,UAAU,GAAAT,IAAA,CAAVS,UAAU;EAEV,IAAMC,KAAK,GAAG,EAAE,QAAQ,IAAIT,IAAI,CAAC;EACjC,IAAMU,OAAO,GAAGD,KAAK,IAAIF,aAAa,GAAGA,aAAa,CAACP,IAAI,CAAC,GAAGW,SAAS;EACxE,IAAMC,WAAW,GACbH,KAAK,IAAIJ,OAAO,GACV;IACIQ,OAAO,EAAER,OAAO,CAACS,KAAK,KAAKd,IAAI,CAACe,EAAE;IAClCC,QAAQ,EAAEX,OAAO,CAACW,QAAQ;IAC1BC,QAAQ,EAAEZ,OAAO,CAACY;EACtB,CAAC,GACDN,SAAS;EACnB,IAAMO,cAAc,GAChBT,KAAK,IAAIH,UAAU,IAAIA,UAAU,CAACO,OAAO,GACnC;IACIA,OAAO,EAAE,IAAI;IACbM,OAAO,EAAEb,UAAU,CAACc,cAAc,CAACC,QAAQ,CAACrB,IAAI,CAACe,EAAE;EACvD,CAAC,GACDJ,SAAS;EAEnB,OAAO;IACHX,IAAI,EAAJA,IAAI;IACJE,KAAK,EAALA,KAAK;IACLD,QAAQ,EAARA,QAAQ;IACRE,OAAO,EAAPA,OAAO;IACPC,aAAa,EAAbA,aAAa;IACbM,OAAO,EAAPA,OAAO;IACPL,OAAO,EAAEO,WAAW;IACpBN,UAAU,EAAEY,cAAc;IAC1BV,UAAU,EAAVA;EACJ,CAAC;AACL,CAAC","ignoreList":[]}

package/build/esm/types/queryList.d.ts

@@ -1,4 +1,4 @@
-import { ReactNode } from 'react';
+import type { ComponentPropsWithoutRef, ReactElement, ReactNode } from 'react';
 import { RegisteredFormFields } from './forms';
 /** ISO 8601 date string or Unix timestamp in milliseconds. */
 export type QueryTimestamp = string | number;
@@ -16,6 +16,7 @@ export type QueryListRow = {
 } & QueryListRowRenderProps;
 export type QueryListItem<T extends QueryListRow = QueryListRow> = QueryListHeader | T;
 export type QueryListRowVariant = 'default' | 'search';
+export type QueryListLinkRenderer = (props: ComponentPropsWithoutRef<'a'>) => ReactElement;
 export type QueryListRowAction<T extends QueryListRow = QueryListRow> = {
     text: ReactNode;
     icon?: ReactNode;
@@ -27,6 +28,7 @@ export type QueryListRowAction<T extends QueryListRow = QueryListRow> = {
 export type QueryListSearchConfig = {
     value?: string;
     fullSearch?: boolean;
+    fullSearchAvailable?: boolean;
     hasClear?: boolean;
     onUpdate: (data: {
         value: string;
@@ -79,5 +81,6 @@ export type QueryListRowRenderData<T extends QueryListRow = QueryListRow> = {
     visibleFields?: QueryListVisibleFieldsConfig<T>;
     actions?: QueryListRowAction<T>[];
     editing?: QueryListEditingRenderData<T>;
+    renderLink?: QueryListLinkRenderer;
 };
 export {};

package/build/esm/types/queryList.js.map

@@ -1 +1 @@
-{"version":3,"names":[],"sources":["queryList.ts"],"sourcesContent":["import {ReactNode} from 'react';\nimport {RegisteredFormFields} from './forms';\n\n/** ISO 8601 date string or Unix timestamp in milliseconds. */\nexport type QueryTimestamp = string | number;\n\nexport type QueryListRowRenderProps = {height: number};\n\nexport type QueryListHeader = {header: string} & QueryListRowRenderProps;\n\nexport type QueryListRow = {\n    id: number | string;\n    title: string;\n    query?: string;\n    href?: string;\n} & QueryListRowRenderProps;\n\nexport type QueryListItem<T extends QueryListRow = QueryListRow> = QueryListHeader | T;\n\nexport type QueryListRowVariant = 'default' | 'search';\n\nexport type QueryListRowAction<T extends QueryListRow = QueryListRow> = {\n    text: ReactNode;\n    icon?: ReactNode;\n    theme?: 'normal' | 'danger';\n    hidden?: boolean;\n    disabled?: boolean;\n    onClick: (item: T) => void;\n};\n\nexport type QueryListSearchConfig = {\n    value?: string;\n    fullSearch?: boolean;\n    hasClear?: boolean;\n    onUpdate: (data: {value: string; fullSearch: boolean}) => void;\n};\n\nexport type QueryListFilterConfig = {\n    fields?: RegisteredFormFields[];\n    values?: Record<string, any>;\n    initialValues?: Record<string, any>;\n    isChanged?: boolean;\n    onApply?: (values: Record<string, any>) => void;\n    onReset?: () => void;\n};\n\nexport type QueryListEditingConfig<T extends QueryListRow = QueryListRow> = {\n    rowId?: T['id'];\n    onSubmit?: (item: T, title: string) => void;\n    onCancel?: (item: T) => void;\n};\n\nexport type QueryListComparisonConfig<T extends QueryListRow = QueryListRow> = {\n    enabled: boolean;\n    comparedRowIds: T['id'][];\n    onChange: (item: T, selected: boolean) => void;\n    onCancel: () => void;\n    onCompare: () => void;\n};\n\ntype RowFieldKey<T extends QueryListRow> = Exclude<keyof T & string, keyof QueryListRowRenderProps>;\n\nexport type QueryListFieldKey<T extends QueryListRow = QueryListRow> = RowFieldKey<T> | 'duration';\n\nexport type QueryListFieldOption<K extends string = string> = {\n    id: K;\n    title: ReactNode;\n};\n\nexport type QueryListVisibleFieldsConfig<T extends QueryListRow = QueryListRow> = {\n    value: QueryListFieldKey<T>[];\n    fields: QueryListFieldOption<QueryListFieldKey<T>>[];\n    onChange: (value: QueryListFieldKey<T>[]) => void;\n};\n\nexport type QueryListEditingRenderData<T extends QueryListRow = QueryListRow> = {\n    enabled: boolean;\n} & Pick<QueryListEditingConfig<T>, 'onSubmit' | 'onCancel'>;\n\nexport type QueryListRowRenderData<T extends QueryListRow = QueryListRow> = {\n    item: QueryListItem<T>;\n    index: number;\n    isActive: boolean;\n    variant: QueryListRowVariant;\n    comparison?: {\n        enabled: boolean;\n        checked: boolean;\n    };\n    visibleFields?: QueryListVisibleFieldsConfig<T>;\n    actions?: QueryListRowAction<T>[];\n    editing?: QueryListEditingRenderData<T>;\n};\n"],"mappings":"","ignoreList":[]}
+{"version":3,"names":[],"sources":["queryList.ts"],"sourcesContent":["import type {ComponentPropsWithoutRef, ReactElement, ReactNode} from 'react';\nimport {RegisteredFormFields} from './forms';\n\n/** ISO 8601 date string or Unix timestamp in milliseconds. */\nexport type QueryTimestamp = string | number;\n\nexport type QueryListRowRenderProps = {height: number};\n\nexport type QueryListHeader = {header: string} & QueryListRowRenderProps;\n\nexport type QueryListRow = {\n    id: number | string;\n    title: string;\n    query?: string;\n    href?: string;\n} & QueryListRowRenderProps;\n\nexport type QueryListItem<T extends QueryListRow = QueryListRow> = QueryListHeader | T;\n\nexport type QueryListRowVariant = 'default' | 'search';\n\nexport type QueryListLinkRenderer = (props: ComponentPropsWithoutRef<'a'>) => ReactElement;\n\nexport type QueryListRowAction<T extends QueryListRow = QueryListRow> = {\n    text: ReactNode;\n    icon?: ReactNode;\n    theme?: 'normal' | 'danger';\n    hidden?: boolean;\n    disabled?: boolean;\n    onClick: (item: T) => void;\n};\n\nexport type QueryListSearchConfig = {\n    value?: string;\n    fullSearch?: boolean;\n    fullSearchAvailable?: boolean;\n    hasClear?: boolean;\n    onUpdate: (data: {value: string; fullSearch: boolean}) => void;\n};\n\nexport type QueryListFilterConfig = {\n    fields?: RegisteredFormFields[];\n    values?: Record<string, any>;\n    initialValues?: Record<string, any>;\n    isChanged?: boolean;\n    onApply?: (values: Record<string, any>) => void;\n    onReset?: () => void;\n};\n\nexport type QueryListEditingConfig<T extends QueryListRow = QueryListRow> = {\n    rowId?: T['id'];\n    onSubmit?: (item: T, title: string) => void;\n    onCancel?: (item: T) => void;\n};\n\nexport type QueryListComparisonConfig<T extends QueryListRow = QueryListRow> = {\n    enabled: boolean;\n    comparedRowIds: T['id'][];\n    onChange: (item: T, selected: boolean) => void;\n    onCancel: () => void;\n    onCompare: () => void;\n};\n\ntype RowFieldKey<T extends QueryListRow> = Exclude<keyof T & string, keyof QueryListRowRenderProps>;\n\nexport type QueryListFieldKey<T extends QueryListRow = QueryListRow> = RowFieldKey<T> | 'duration';\n\nexport type QueryListFieldOption<K extends string = string> = {\n    id: K;\n    title: ReactNode;\n};\n\nexport type QueryListVisibleFieldsConfig<T extends QueryListRow = QueryListRow> = {\n    value: QueryListFieldKey<T>[];\n    fields: QueryListFieldOption<QueryListFieldKey<T>>[];\n    onChange: (value: QueryListFieldKey<T>[]) => void;\n};\n\nexport type QueryListEditingRenderData<T extends QueryListRow = QueryListRow> = {\n    enabled: boolean;\n} & Pick<QueryListEditingConfig<T>, 'onSubmit' | 'onCancel'>;\n\nexport type QueryListRowRenderData<T extends QueryListRow = QueryListRow> = {\n    item: QueryListItem<T>;\n    index: number;\n    isActive: boolean;\n    variant: QueryListRowVariant;\n    comparison?: {\n        enabled: boolean;\n        checked: boolean;\n    };\n    visibleFields?: QueryListVisibleFieldsConfig<T>;\n    actions?: QueryListRowAction<T>[];\n    editing?: QueryListEditingRenderData<T>;\n    renderLink?: QueryListLinkRenderer;\n};\n"],"mappings":"","ignoreList":[]}

package/build/esm/widgets/QueriesHistory/QueriesHistory.d.ts

@@ -1,5 +1,5 @@
 import React from 'react';
-import { QueryListComparisonConfig, QueryListEditingConfig, QueryListFilterConfig, QueryListItem, QueryListRowAction, QueryListRowRenderData, QueryListSearchConfig, QueryListVisibleFieldsConfig } from '../../types/queryList';
+import { QueryListComparisonConfig, QueryListEditingConfig, QueryListFilterConfig, QueryListItem, QueryListLinkRenderer, QueryListRowAction, QueryListRowRenderData, QueryListSearchConfig, QueryListVisibleFieldsConfig } from '../../types/queryList';
 import { QueryHistoryRow } from '../../types/history';
 import './QueriesHistory.scss';
 export type QueriesHistoryProps<T extends QueryHistoryRow = QueryHistoryRow> = {
@@ -16,5 +16,9 @@ export type QueriesHistoryProps<T extends QueryHistoryRow = QueryHistoryRow> = {
     renderRowItem?: (data: QueryListRowRenderData<T>) => React.ReactNode;
     getRowActions?: (item: T) => QueryListRowAction<T>[];
     onListItemClick?: (item: QueryListItem<T>) => void;
+    hasMore?: boolean;
+    loading?: boolean;
+    onLoadMore?: () => void;
+    renderLink?: QueryListLinkRenderer;
 };
-export declare const QueriesHistory: <T extends QueryHistoryRow>({ title, logo, search, filter, items, selectedRowId, editing, comparison, visibleFields, renderRowItem, getRowActions, onListItemClick, className, }: QueriesHistoryProps<T>) => React.JSX.Element;
+export declare const QueriesHistory: <T extends QueryHistoryRow>({ title, logo, search, filter, items, selectedRowId, editing, comparison, visibleFields, renderRowItem, getRowActions, onListItemClick, hasMore, loading, onLoadMore, renderLink, className, }: QueriesHistoryProps<T>) => React.JSX.Element;

package/build/esm/widgets/QueriesHistory/QueriesHistory.js

@@ -25,6 +25,10 @@ export var QueriesHistory = function QueriesHistory(_ref) {
     renderRowItem = _ref.renderRowItem,
     getRowActions = _ref.getRowActions,
     onListItemClick = _ref.onListItemClick,
+    hasMore = _ref.hasMore,
+    loading = _ref.loading,
+    onLoadMore = _ref.onLoadMore,
+    renderLink = _ref.renderLink,
     className = _ref.className;
   return /*#__PURE__*/_jsx(QueriesList, {
     className: block(null, className),
@@ -41,7 +45,11 @@ export var QueriesHistory = function QueriesHistory(_ref) {
     renderRow: function renderRow(data) {
       return renderRowItem ? renderRowItem(data) : /*#__PURE__*/_jsx(HistoryRowContent, _objectSpread({}, data));
     },
-    onListItemClick: onListItemClick
+    onListItemClick: onListItemClick,
+    hasMore: hasMore,
+    loading: loading,
+    onLoadMore: onLoadMore,
+    renderLink: renderLink
   });
 };
 // #sourceMappingURL=QueriesHistory.js.map

package/build/esm/widgets/QueriesHistory/QueriesHistory.js.map

@@ -1 +1 @@
-{"version":3,"names":["React","cn","QueriesList","HistoryRowContent","jsx","_jsx","block","QueriesHistory","_ref","title","logo","search","filter","items","selectedRowId","editing","comparison","visibleFields","renderRowItem","getRowActions","onListItemClick","className","renderRow","data","_objectSpread"],"sources":["QueriesHistory.tsx"],"sourcesContent":["import React from 'react';\nimport cn from 'bem-cn-lite';\nimport {QueriesList} from '../../modules';\nimport {\n    QueryListComparisonConfig,\n    QueryListEditingConfig,\n    QueryListFilterConfig,\n    QueryListItem,\n    QueryListRowAction,\n    QueryListRowRenderData,\n    QueryListSearchConfig,\n    QueryListVisibleFieldsConfig,\n} from '../../types/queryList';\nimport {QueryHistoryRow} from '../../types/history';\nimport {HistoryRowContent} from './internal/HistoryRowContent';\nimport './QueriesHistory.scss';\n\nexport type QueriesHistoryProps<T extends QueryHistoryRow = QueryHistoryRow> = {\n    className?: string;\n    title?: string;\n    logo?: React.ReactNode;\n    search: QueryListSearchConfig;\n    filter?: QueryListFilterConfig;\n    items: QueryListItem<T>[];\n    selectedRowId?: T['id'];\n    editing?: QueryListEditingConfig<T>;\n    comparison?: QueryListComparisonConfig<T>;\n    visibleFields?: QueryListVisibleFieldsConfig<T>;\n    renderRowItem?: (data: QueryListRowRenderData<T>) => React.ReactNode;\n    getRowActions?: (item: T) => QueryListRowAction<T>[];\n    onListItemClick?: (item: QueryListItem<T>) => void;\n};\n\nconst block = cn('qp-query-history');\n\nexport const QueriesHistory = <T extends QueryHistoryRow>({\n    title,\n    logo,\n    search,\n    filter,\n    items,\n    selectedRowId,\n    editing,\n    comparison,\n    visibleFields,\n    renderRowItem,\n    getRowActions,\n    onListItemClick,\n    className,\n}: QueriesHistoryProps<T>) => {\n    return (\n        <QueriesList\n            className={block(null, className)}\n            title={title}\n            logo={logo}\n            search={search}\n            filter={filter}\n            items={items}\n            selectedRowId={selectedRowId}\n            visibleFields={visibleFields}\n            editing={editing}\n            comparison={comparison}\n            getRowActions={getRowActions}\n            renderRow={(data) =>\n                renderRowItem ? renderRowItem(data) : <HistoryRowContent {...data} />\n            }\n            onListItemClick={onListItemClick}\n        />\n    );\n};\n"],"mappings":";;;;;;;AAAA,OAAOA,KAAK,MAAM,OAAO;AACzB,OAAOC,EAAE,MAAM,aAAa;AAC5B,SAAQC,WAAW;AAYnB,SAAQC,iBAAiB;AACzB;AAA+B,SAAAC,GAAA,IAAAC,IAAA;AAkB/B,IAAMC,KAAK,GAAGL,EAAE,CAAC,kBAAkB,CAAC;AAEpC,OAAO,IAAMM,cAAc,GAAG,SAAjBA,cAAcA,CAAAC,IAAA,EAcG;EAAA,IAb1BC,KAAK,GAAAD,IAAA,CAALC,KAAK;IACLC,IAAI,GAAAF,IAAA,CAAJE,IAAI;IACJC,MAAM,GAAAH,IAAA,CAANG,MAAM;IACNC,MAAM,GAAAJ,IAAA,CAANI,MAAM;IACNC,KAAK,GAAAL,IAAA,CAALK,KAAK;IACLC,aAAa,GAAAN,IAAA,CAAbM,aAAa;IACbC,OAAO,GAAAP,IAAA,CAAPO,OAAO;IACPC,UAAU,GAAAR,IAAA,CAAVQ,UAAU;IACVC,aAAa,GAAAT,IAAA,CAAbS,aAAa;IACbC,aAAa,GAAAV,IAAA,CAAbU,aAAa;IACbC,aAAa,GAAAX,IAAA,CAAbW,aAAa;IACbC,eAAe,GAAAZ,IAAA,CAAfY,eAAe;IACfC,SAAS,GAAAb,IAAA,CAATa,SAAS;EAET,oBACIhB,IAAA,CAACH,WAAW;IACRmB,SAAS,EAAEf,KAAK,CAAC,IAAI,EAAEe,SAAS,CAAE;IAClCZ,KAAK,EAAEA,KAAM;IACbC,IAAI,EAAEA,IAAK;IACXC,MAAM,EAAEA,MAAO;IACfC,MAAM,EAAEA,MAAO;IACfC,KAAK,EAAEA,KAAM;IACbC,aAAa,EAAEA,aAAc;IAC7BG,aAAa,EAAEA,aAAc;IAC7BF,OAAO,EAAEA,OAAQ;IACjBC,UAAU,EAAEA,UAAW;IACvBG,aAAa,EAAEA,aAAc;IAC7BG,SAAS,EAAE,SAAXA,SAASA,CAAGC,IAAI;MAAA,OACZL,aAAa,GAAGA,aAAa,CAACK,IAAI,CAAC,gBAAGlB,IAAA,CAACF,iBAAiB,EAAAqB,aAAA,KAAKD,IAAI,CAAG,CAAC;IAAA,CACxE;IACDH,eAAe,EAAEA;EAAgB,CACpC,CAAC;AAEV,CAAC","ignoreList":[]}
+{"version":3,"names":["React","cn","QueriesList","HistoryRowContent","jsx","_jsx","block","QueriesHistory","_ref","title","logo","search","filter","items","selectedRowId","editing","comparison","visibleFields","renderRowItem","getRowActions","onListItemClick","hasMore","loading","onLoadMore","renderLink","className","renderRow","data","_objectSpread"],"sources":["QueriesHistory.tsx"],"sourcesContent":["import React from 'react';\nimport cn from 'bem-cn-lite';\nimport {QueriesList} from '../../modules';\nimport {\n    QueryListComparisonConfig,\n    QueryListEditingConfig,\n    QueryListFilterConfig,\n    QueryListItem,\n    QueryListLinkRenderer,\n    QueryListRowAction,\n    QueryListRowRenderData,\n    QueryListSearchConfig,\n    QueryListVisibleFieldsConfig,\n} from '../../types/queryList';\nimport {QueryHistoryRow} from '../../types/history';\nimport {HistoryRowContent} from './internal/HistoryRowContent';\nimport './QueriesHistory.scss';\n\nexport type QueriesHistoryProps<T extends QueryHistoryRow = QueryHistoryRow> = {\n    className?: string;\n    title?: string;\n    logo?: React.ReactNode;\n    search: QueryListSearchConfig;\n    filter?: QueryListFilterConfig;\n    items: QueryListItem<T>[];\n    selectedRowId?: T['id'];\n    editing?: QueryListEditingConfig<T>;\n    comparison?: QueryListComparisonConfig<T>;\n    visibleFields?: QueryListVisibleFieldsConfig<T>;\n    renderRowItem?: (data: QueryListRowRenderData<T>) => React.ReactNode;\n    getRowActions?: (item: T) => QueryListRowAction<T>[];\n    onListItemClick?: (item: QueryListItem<T>) => void;\n    hasMore?: boolean;\n    loading?: boolean;\n    onLoadMore?: () => void;\n    renderLink?: QueryListLinkRenderer;\n};\n\nconst block = cn('qp-query-history');\n\nexport const QueriesHistory = <T extends QueryHistoryRow>({\n    title,\n    logo,\n    search,\n    filter,\n    items,\n    selectedRowId,\n    editing,\n    comparison,\n    visibleFields,\n    renderRowItem,\n    getRowActions,\n    onListItemClick,\n    hasMore,\n    loading,\n    onLoadMore,\n    renderLink,\n    className,\n}: QueriesHistoryProps<T>) => {\n    return (\n        <QueriesList\n            className={block(null, className)}\n            title={title}\n            logo={logo}\n            search={search}\n            filter={filter}\n            items={items}\n            selectedRowId={selectedRowId}\n            visibleFields={visibleFields}\n            editing={editing}\n            comparison={comparison}\n            getRowActions={getRowActions}\n            renderRow={(data) =>\n                renderRowItem ? renderRowItem(data) : <HistoryRowContent {...data} />\n            }\n            onListItemClick={onListItemClick}\n            hasMore={hasMore}\n            loading={loading}\n            onLoadMore={onLoadMore}\n            renderLink={renderLink}\n        />\n    );\n};\n"],"mappings":";;;;;;;AAAA,OAAOA,KAAK,MAAM,OAAO;AACzB,OAAOC,EAAE,MAAM,aAAa;AAC5B,SAAQC,WAAW;AAanB,SAAQC,iBAAiB;AACzB;AAA+B,SAAAC,GAAA,IAAAC,IAAA;AAsB/B,IAAMC,KAAK,GAAGL,EAAE,CAAC,kBAAkB,CAAC;AAEpC,OAAO,IAAMM,cAAc,GAAG,SAAjBA,cAAcA,CAAAC,IAAA,EAkBG;EAAA,IAjB1BC,KAAK,GAAAD,IAAA,CAALC,KAAK;IACLC,IAAI,GAAAF,IAAA,CAAJE,IAAI;IACJC,MAAM,GAAAH,IAAA,CAANG,MAAM;IACNC,MAAM,GAAAJ,IAAA,CAANI,MAAM;IACNC,KAAK,GAAAL,IAAA,CAALK,KAAK;IACLC,aAAa,GAAAN,IAAA,CAAbM,aAAa;IACbC,OAAO,GAAAP,IAAA,CAAPO,OAAO;IACPC,UAAU,GAAAR,IAAA,CAAVQ,UAAU;IACVC,aAAa,GAAAT,IAAA,CAAbS,aAAa;IACbC,aAAa,GAAAV,IAAA,CAAbU,aAAa;IACbC,aAAa,GAAAX,IAAA,CAAbW,aAAa;IACbC,eAAe,GAAAZ,IAAA,CAAfY,eAAe;IACfC,OAAO,GAAAb,IAAA,CAAPa,OAAO;IACPC,OAAO,GAAAd,IAAA,CAAPc,OAAO;IACPC,UAAU,GAAAf,IAAA,CAAVe,UAAU;IACVC,UAAU,GAAAhB,IAAA,CAAVgB,UAAU;IACVC,SAAS,GAAAjB,IAAA,CAATiB,SAAS;EAET,oBACIpB,IAAA,CAACH,WAAW;IACRuB,SAAS,EAAEnB,KAAK,CAAC,IAAI,EAAEmB,SAAS,CAAE;IAClChB,KAAK,EAAEA,KAAM;IACbC,IAAI,EAAEA,IAAK;IACXC,MAAM,EAAEA,MAAO;IACfC,MAAM,EAAEA,MAAO;IACfC,KAAK,EAAEA,KAAM;IACbC,aAAa,EAAEA,aAAc;IAC7BG,aAAa,EAAEA,aAAc;IAC7BF,OAAO,EAAEA,OAAQ;IACjBC,UAAU,EAAEA,UAAW;IACvBG,aAAa,EAAEA,aAAc;IAC7BO,SAAS,EAAE,SAAXA,SAASA,CAAGC,IAAI;MAAA,OACZT,aAAa,GAAGA,aAAa,CAACS,IAAI,CAAC,gBAAGtB,IAAA,CAACF,iBAAiB,EAAAyB,aAAA,KAAKD,IAAI,CAAG,CAAC;IAAA,CACxE;IACDP,eAAe,EAAEA,eAAgB;IACjCC,OAAO,EAAEA,OAAQ;IACjBC,OAAO,EAAEA,OAAQ;IACjBC,UAAU,EAAEA,UAAW;IACvBC,UAAU,EAAEA;EAAW,CAC1B,CAAC;AAEV,CAAC","ignoreList":[]}

package/build/esm/widgets/QueriesHistory/QueriesHistory.stories.d.ts

@@ -5,4 +5,9 @@ export default meta;
 type Story = StoryObj<typeof QueriesHistory>;
 export declare const Default: Story;
 export declare const Empty: Story;
+export declare const InitialLoading: Story;
+export declare const Paginated: Story;
+export declare const FullSearchUnavailable: Story;
+export declare const RouterLinks: Story;
+export declare const CustomRowRenderer: Story;
 export declare const WithHeader: Story;

package/build/esm/widgets/QueriesHistory/QueriesHistory.stories.js

@@ -1,18 +1,23 @@
-import _objectSpread from "@babel/runtime/helpers/objectSpread2";
 import _toConsumableArray from "@babel/runtime/helpers/toConsumableArray";
 import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
+import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
+import _objectSpread from "@babel/runtime/helpers/objectSpread2";
+var _excluded = ["onClick"];
 import "core-js/modules/es.array.concat.js";
 import "core-js/modules/es.array.filter.js";
 import "core-js/modules/es.array.find-index.js";
 import "core-js/modules/es.array.includes.js";
+import "core-js/modules/es.array.map.js";
 import "core-js/modules/es.array.slice.js";
 import "core-js/modules/es.date.now.js";
 import "core-js/modules/es.iterator.constructor.js";
 import "core-js/modules/es.iterator.filter.js";
 import "core-js/modules/es.object.to-string.js";
 import "core-js/modules/es.string.includes.js";
+import "core-js/modules/web.timers.js";
 import React, { useState } from 'react';
-import { SegmentedRadioGroup } from '@gravity-ui/uikit';
+import { SegmentedRadioGroup, Text } from '@gravity-ui/uikit';
+import { HistoryGroupHeader, RowLink } from "../../components";
 import { QueriesHistory } from "./QueriesHistory";
 import { action } from 'storybook/actions';
 import { jsx as _jsx } from "react/jsx-runtime";
@@ -101,6 +106,12 @@ var BASE_ITEMS = [{
   query: QUERY,
   height: 52
 }];
+var LINK_ITEMS = BASE_ITEMS.map(function (item) {
+  return 'id' in item ? _objectSpread(_objectSpread({}, item), {}, {
+    href: "/queries/".concat(item.id)
+  }) : item;
+});
+var PAGINATION_PAGES = [LINK_ITEMS.slice(0, 3), LINK_ITEMS.slice(3, 6), LINK_ITEMS.slice(6)];
 var activeFields = ['duration', 'mode', 'startTime', 'engine', 'isPrivate'];
 var fields = [{
   id: 'duration',
@@ -142,6 +153,21 @@ var filterFields = [{
 }];
 var logFilterApply = action('onFilterApply');
 var logFilterReset = action('onFilterReset');
+var renderRouterLink = function renderRouterLink(_ref) {
+  var _onClick = _ref.onClick,
+    props = _objectWithoutProperties(_ref, _excluded);
+  return /*#__PURE__*/_jsx("a", _objectSpread(_objectSpread({}, props), {}, {
+    "data-router-link": true,
+    onClick: function onClick(event) {
+      _onClick === null || _onClick === void 0 || _onClick(event);
+      if (event.defaultPrevented || event.button !== 0 || event.metaKey || event.ctrlKey || event.shiftKey || event.altKey) {
+        return;
+      }
+      event.preventDefault();
+      action('routerNavigate')(props.href);
+    }
+  }));
+};
 var meta = {
   title: 'Widgets/QueriesHistory',
   component: QueriesHistory,
@@ -159,7 +185,7 @@ var operationFilterOptions = [{
 }];
 export default meta;
 var DefaultStory = function DefaultStory() {
-  var _useState = useState([].concat(BASE_ITEMS)),
+  var _useState = useState(_toConsumableArray(LINK_ITEMS)),
     _useState2 = _slicedToArray(_useState, 2),
     items = _useState2[0],
     setItems = _useState2[1];
@@ -218,10 +244,10 @@ var DefaultStory = function DefaultStory() {
   var handleOnSearch = function handleOnSearch(data) {
     setSearch(data);
     if (!data.value) {
-      setItems(BASE_ITEMS);
+      setItems(LINK_ITEMS);
       return;
     }
-    var newItems = BASE_ITEMS.filter(function (item) {
+    var newItems = LINK_ITEMS.filter(function (item) {
       var _item$query;
       if (!('id' in item)) return false;
       var title = item.title.toLowerCase();
@@ -283,7 +309,8 @@ var DefaultStory = function DefaultStory() {
         rowId: editingId,
         onSubmit: handleEditSubmit,
         onCancel: handleEditCancel
-      }
+      },
+      renderLink: renderRouterLink
     })
   });
 };
@@ -353,6 +380,134 @@ var WithHeaderStory = function WithHeaderStory() {
     })
   });
 };
+var PaginatedStory = function PaginatedStory() {
+  var _useState17 = useState(PAGINATION_PAGES[0]),
+    _useState18 = _slicedToArray(_useState17, 2),
+    items = _useState18[0],
+    setItems = _useState18[1];
+  var _useState19 = useState(1),
+    _useState20 = _slicedToArray(_useState19, 2),
+    page = _useState20[0],
+    setPage = _useState20[1];
+  var _useState21 = useState(false),
+    _useState22 = _slicedToArray(_useState21, 2),
+    loading = _useState22[0],
+    setLoading = _useState22[1];
+  var handleLoadMore = function handleLoadMore() {
+    var nextPage = PAGINATION_PAGES[page];
+    if (loading || !nextPage) {
+      return;
+    }
+    action('onLoadMore')(page);
+    setLoading(true);
+    window.setTimeout(function () {
+      setItems(function (currentItems) {
+        return [].concat(_toConsumableArray(currentItems), _toConsumableArray(nextPage));
+      });
+      setPage(function (currentPage) {
+        return currentPage + 1;
+      });
+      setLoading(false);
+    }, 700);
+  };
+  return /*#__PURE__*/_jsx("div", {
+    style: {
+      width: 300,
+      height: 300
+    },
+    children: /*#__PURE__*/_jsx(QueriesHistory, {
+      title: "Paginated history",
+      items: items,
+      selectedRowId: 2,
+      loading: loading,
+      hasMore: page < PAGINATION_PAGES.length,
+      onLoadMore: handleLoadMore,
+      search: {
+        onUpdate: action('onSearchUpdate')
+      }
+    })
+  });
+};
+var FullSearchUnavailableStory = function FullSearchUnavailableStory() {
+  var _useState23 = useState({
+      value: 'Query',
+      fullSearch: true
+    }),
+    _useState24 = _slicedToArray(_useState23, 2),
+    search = _useState24[0],
+    setSearch = _useState24[1];
+  return /*#__PURE__*/_jsx("div", {
+    style: {
+      width: 300,
+      height: 500
+    },
+    children: /*#__PURE__*/_jsx(QueriesHistory, {
+      title: "Basic search only",
+      items: LINK_ITEMS,
+      search: _objectSpread(_objectSpread({}, search), {}, {
+        fullSearchAvailable: false,
+        hasClear: true,
+        onUpdate: function onUpdate(data) {
+          action('onSearchUpdate')(data);
+          setSearch(data);
+        }
+      })
+    })
+  });
+};
+var RouterLinksStory = function RouterLinksStory() {
+  var _useState25 = useState({
+      value: '',
+      fullSearch: false
+    }),
+    _useState26 = _slicedToArray(_useState25, 2),
+    search = _useState26[0],
+    setSearch = _useState26[1];
+  return /*#__PURE__*/_jsx("div", {
+    style: {
+      width: 500,
+      height: 500
+    },
+    children: /*#__PURE__*/_jsx(QueriesHistory, {
+      title: "Router links",
+      items: LINK_ITEMS,
+      renderLink: renderRouterLink,
+      search: _objectSpread(_objectSpread({}, search), {}, {
+        hasClear: true,
+        onUpdate: setSearch
+      })
+    })
+  });
+};
+var CustomRowRendererStory = function CustomRowRendererStory() {
+  return /*#__PURE__*/_jsx("div", {
+    style: {
+      width: 300,
+      height: 300
+    },
+    children: /*#__PURE__*/_jsx(QueriesHistory, {
+      title: "Custom row renderer",
+      items: LINK_ITEMS.slice(0, 3),
+      renderLink: renderRouterLink,
+      renderRowItem: function renderRowItem(_ref2) {
+        var item = _ref2.item,
+          renderLink = _ref2.renderLink;
+        return 'header' in item ? /*#__PURE__*/_jsx(HistoryGroupHeader, {
+          title: item.header
+        }) : /*#__PURE__*/_jsx(RowLink, {
+          href: item.href,
+          renderLink: renderLink,
+          children: /*#__PURE__*/_jsx(Text, {
+            children: item.title
+          })
+        });
+      },
+      search: {
+        onUpdate: action('onSearchUpdate')
+      }
+    })
+  });
+};
 export var Default = {
   render: function render() {
     return /*#__PURE__*/_jsx(DefaultStory, {});
@@ -363,6 +518,45 @@ export var Empty = {
     return /*#__PURE__*/_jsx(EmptyStory, {});
   }
 };
+export var InitialLoading = {
+  args: {
+    title: 'Loading history',
+    items: [],
+    loading: true,
+    search: {
+      onUpdate: action('onSearchUpdate')
+    }
+  },
+  decorators: [function (StoryComponent) {
+    return /*#__PURE__*/_jsx("div", {
+      style: {
+        width: 300,
+        height: 500
+      },
+      children: /*#__PURE__*/_jsx(StoryComponent, {})
+    });
+  }]
+};
+export var Paginated = {
+  render: function render() {
+    return /*#__PURE__*/_jsx(PaginatedStory, {});
+  }
+};
+export var FullSearchUnavailable = {
+  render: function render() {
+    return /*#__PURE__*/_jsx(FullSearchUnavailableStory, {});
+  }
+};
+export var RouterLinks = {
+  render: function render() {
+    return /*#__PURE__*/_jsx(RouterLinksStory, {});
+  }
+};
+export var CustomRowRenderer = {
+  render: function render() {
+    return /*#__PURE__*/_jsx(CustomRowRendererStory, {});
+  }
+};
 export var WithHeader = {
   render: function render() {
     return /*#__PURE__*/_jsx(WithHeaderStory, {});