@gravity-ui/querieskit 1.5.1 → 1.7.0

package/build/esm/components/QueryGraph/QueryGraph.stories.d.ts

@@ -0,0 +1,16 @@
+import type { Meta, StoryObj } from '@storybook/react';
+import type { QueryGraphEdge, QueryGraphNode } from '../../types/queryGraph';
+import { QueryGraph } from './QueryGraph';
+export declare const demoNodes: QueryGraphNode[];
+export declare const demoEdges: QueryGraphEdge[];
+declare const meta: Meta<typeof QueryGraph>;
+export default meta;
+type Story = StoryObj<typeof QueryGraph>;
+export declare const Default: Story;
+export declare const Statuses: Story;
+export declare const OperationTypes: Story;
+export declare const CustomIcon: Story;
+export declare const UpdatingProgress: Story;
+export declare const LargeGraph: Story;
+export declare const LargeGraphThreshold: Story;
+export declare const InvalidGraph: Story;

package/build/esm/components/QueryGraph/QueryGraph.stories.js

@@ -0,0 +1,331 @@
+import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
+import _objectSpread from "@babel/runtime/helpers/objectSpread2";
+import "core-js/modules/es.array.from.js";
+import "core-js/modules/es.array.map.js";
+import "core-js/modules/es.iterator.constructor.js";
+import "core-js/modules/es.iterator.map.js";
+import "core-js/modules/es.object.to-string.js";
+import "core-js/modules/es.string.iterator.js";
+import "core-js/modules/web.timers.js";
+import React, { useEffect, useState } from 'react';
+import { QueryGraph } from "./QueryGraph";
+import { largeGraphEdges, largeGraphNodes } from "./story/largeGraphData";
+import { jsx as _jsx } from "react/jsx-runtime";
+export var demoNodes = [{
+  id: 'source',
+  kind: 'input',
+  name: 'orders',
+  label: 'warehouse.orders'
+}, {
+  id: 'read',
+  kind: 'operation',
+  name: 'Read',
+  operationType: 'read',
+  status: 'completed',
+  progress: {
+    total: 12,
+    completed: 12
+  }
+}, {
+  id: 'map',
+  kind: 'operation',
+  name: 'Map',
+  operationType: 'map',
+  status: 'running',
+  progress: {
+    total: 100,
+    completed: 68,
+    running: 8,
+    pending: 24
+  },
+  popup: {
+    stages: [{
+      name: 'Preparing',
+      duration: 1300
+    }, {
+      name: 'Executing',
+      duration: 8400
+    }],
+    details: [{
+      name: 'Columns',
+      value: ['id', 'price', 'created_at']
+    }, {
+      name: 'Settings',
+      children: [{
+        name: 'Workers',
+        value: 8
+      }]
+    }],
+    jobs: {
+      total: 100,
+      completed: 68,
+      running: 8,
+      pending: 24
+    },
+    inputs: [{
+      name: 'orders',
+      columns: [{
+        name: 'id',
+        type: 'Uint64'
+      }, {
+        name: 'price',
+        type: 'Double'
+      }]
+    }],
+    outputs: [{
+      name: 'mapped',
+      columns: [{
+        name: 'total',
+        type: 'Double'
+      }]
+    }]
+  }
+}, {
+  id: 'reduce',
+  kind: 'operation',
+  name: 'Reduce',
+  operationType: 'reduce',
+  status: 'waiting',
+  progress: {
+    total: 20
+  }
+}, {
+  id: 'sink',
+  kind: 'output',
+  name: 'result',
+  label: 'warehouse.result'
+}];
+export var demoEdges = [{
+  id: 'source-read',
+  source: 'source',
+  target: 'read'
+}, {
+  id: 'read-map',
+  source: 'read',
+  target: 'map'
+}, {
+  id: 'map-reduce',
+  source: 'map',
+  target: 'reduce'
+}, {
+  id: 'reduce-sink',
+  source: 'reduce',
+  target: 'sink'
+}];
+var meta = {
+  title: 'Components/QueryGraph',
+  component: QueryGraph,
+  tags: ['autodocs'],
+  args: {
+    nodes: demoNodes,
+    edges: demoEdges
+  },
+  render: function render(args) {
+    return /*#__PURE__*/_jsx(QueryGraph, _objectSpread(_objectSpread({}, args), {}, {
+      className: "query-graph-story"
+    }));
+  },
+  decorators: [function (Story) {
+    return /*#__PURE__*/_jsx("div", {
+      style: {
+        height: 600
+      },
+      children: /*#__PURE__*/_jsx(Story, {})
+    });
+  }]
+};
+export default meta;
+export var Default = {};
+export var Statuses = {
+  args: {
+    nodes: [{
+      id: 'not-started',
+      kind: 'operation',
+      name: 'Map',
+      status: 'not-started'
+    }, {
+      id: 'waiting',
+      kind: 'operation',
+      name: 'Map',
+      status: 'waiting'
+    }, {
+      id: 'running',
+      kind: 'operation',
+      name: 'Map',
+      status: 'running'
+    }, {
+      id: 'completed',
+      kind: 'operation',
+      name: 'Map',
+      status: 'completed'
+    }, {
+      id: 'failed',
+      kind: 'operation',
+      name: 'Map',
+      status: 'failed'
+    }, {
+      id: 'aborted',
+      kind: 'operation',
+      name: 'Map',
+      status: 'aborted'
+    }].map(function (node, index) {
+      return _objectSpread(_objectSpread({}, node), {}, {
+        progress: {
+          total: index === 5 ? 23 : 2684677
+        }
+      });
+    }),
+    edges: [],
+    largeGraphThreshold: false
+  }
+};
+export var OperationTypes = {
+  args: {
+    nodes: ['read', 'map', 'reduce', 'map-reduce', 'merge', 'sort', 'erase', 'commit', 'operation'].map(function (operationType) {
+      return {
+        id: operationType,
+        kind: 'operation',
+        name: operationType,
+        label: operationType === 'map-reduce' ? 'A very long reusable MapReduce operation label' : operationType,
+        operationType: operationType,
+        status: 'not-started'
+      };
+    }),
+    edges: [{
+      id: 'read-map',
+      source: 'read',
+      target: 'map'
+    }, {
+      id: 'map-reduce',
+      source: 'map',
+      target: 'reduce'
+    }, {
+      id: 'map-reduce-merge',
+      source: 'map-reduce',
+      target: 'merge'
+    }, {
+      id: 'merge-sort',
+      source: 'merge',
+      target: 'sort'
+    }, {
+      id: 'erase-commit',
+      source: 'erase',
+      target: 'commit'
+    }, {
+      id: 'commit-operation',
+      source: 'commit',
+      target: 'operation'
+    }],
+    largeGraphThreshold: false
+  }
+};
+export var CustomIcon = {
+  args: {
+    nodes: [{
+      id: 'custom',
+      kind: 'operation',
+      name: 'Custom operation',
+      status: 'not-started',
+      icon: /*#__PURE__*/_jsx("svg", {
+        width: "16",
+        height: "16",
+        viewBox: "0 0 16 16",
+        xmlns: "http://www.w3.org/2000/svg",
+        children: /*#__PURE__*/_jsx("path", {
+          fill: "currentColor",
+          d: "M8 1 15 8 8 15 1 8z"
+        })
+      })
+    }],
+    edges: [],
+    largeGraphThreshold: false
+  }
+};
+function UpdatingProgressStory(props) {
+  var _useState = useState(0),
+    _useState2 = _slicedToArray(_useState, 2),
+    completed = _useState2[0],
+    setCompleted = _useState2[1];
+  useEffect(function () {
+    var timer = window.setInterval(function () {
+      return setCompleted(function (value) {
+        return (value + 5) % 105;
+      });
+    }, 500);
+    return function () {
+      return window.clearInterval(timer);
+    };
+  }, []);
+  return /*#__PURE__*/_jsx(QueryGraph, _objectSpread(_objectSpread({}, props), {}, {
+    nodes: props.nodes.map(function (node) {
+      return node.id === 'progress' ? _objectSpread(_objectSpread({}, node), {}, {
+        progress: {
+          total: 100,
+          completed: completed,
+          fraction: completed / 100
+        }
+      }) : node;
+    })
+  }));
+}
+export var UpdatingProgress = {
+  args: {
+    nodes: [{
+      id: 'progress',
+      kind: 'operation',
+      name: 'Map',
+      operationType: 'map',
+      status: 'running',
+      progress: {
+        total: 100,
+        completed: 0
+      }
+    }],
+    edges: [],
+    largeGraphThreshold: false
+  },
+  render: function render(args) {
+    return /*#__PURE__*/_jsx(UpdatingProgressStory, _objectSpread({}, args));
+  }
+};
+export var LargeGraph = {
+  args: {
+    nodes: largeGraphNodes,
+    edges: largeGraphEdges,
+    largeGraphThreshold: false
+  }
+};
+export var LargeGraphThreshold = {
+  args: {
+    nodes: Array.from({
+      length: 701
+    }, function (_, index) {
+      return {
+        id: "node-".concat(index),
+        kind: 'operation',
+        name: "Operation ".concat(index),
+        status: index % 3 ? 'completed' : 'running'
+      };
+    }),
+    edges: Array.from({
+      length: 700
+    }, function (_, index) {
+      return {
+        id: "edge-".concat(index),
+        source: "node-".concat(index),
+        target: "node-".concat(index + 1)
+      };
+    })
+  }
+};
+export var InvalidGraph = {
+  args: {
+    nodes: demoNodes,
+    edges: [{
+      id: 'bad',
+      source: 'source',
+      target: 'missing'
+    }]
+  }
+};
+// #sourceMappingURL=QueryGraph.stories.js.map

package/build/esm/components/QueryGraph/QueryGraph.stories.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["React","useEffect","useState","QueryGraph","largeGraphEdges","largeGraphNodes","jsx","_jsx","demoNodes","id","kind","name","label","operationType","status","progress","total","completed","running","pending","popup","stages","duration","details","value","children","jobs","inputs","columns","type","outputs","demoEdges","source","target","meta","title","component","tags","args","nodes","edges","render","_objectSpread","className","decorators","Story","style","height","Default","Statuses","map","node","index","largeGraphThreshold","OperationTypes","CustomIcon","icon","width","viewBox","xmlns","fill","d","UpdatingProgressStory","props","_useState","_useState2","_slicedToArray","setCompleted","timer","window","setInterval","clearInterval","fraction","UpdatingProgress","LargeGraph","LargeGraphThreshold","Array","from","length","_","concat","InvalidGraph"],"sources":["QueryGraph.stories.tsx"],"sourcesContent":["import React, {useEffect, useState} from 'react';\nimport type {Meta, StoryObj} from '@storybook/react';\n\nimport type {QueryGraphEdge, QueryGraphNode} from '../../types/queryGraph';\nimport {QueryGraph} from './QueryGraph';\nimport {largeGraphEdges, largeGraphNodes} from './story/largeGraphData';\n\nexport const demoNodes: QueryGraphNode[] = [\n    {id: 'source', kind: 'input', name: 'orders', label: 'warehouse.orders'},\n    {\n        id: 'read',\n        kind: 'operation',\n        name: 'Read',\n        operationType: 'read',\n        status: 'completed',\n        progress: {total: 12, completed: 12},\n    },\n    {\n        id: 'map',\n        kind: 'operation',\n        name: 'Map',\n        operationType: 'map',\n        status: 'running',\n        progress: {total: 100, completed: 68, running: 8, pending: 24},\n        popup: {\n            stages: [\n                {name: 'Preparing', duration: 1300},\n                {name: 'Executing', duration: 8400},\n            ],\n            details: [\n                {name: 'Columns', value: ['id', 'price', 'created_at']},\n                {name: 'Settings', children: [{name: 'Workers', value: 8}]},\n            ],\n            jobs: {total: 100, completed: 68, running: 8, pending: 24},\n            inputs: [\n                {\n                    name: 'orders',\n                    columns: [\n                        {name: 'id', type: 'Uint64'},\n                        {name: 'price', type: 'Double'},\n                    ],\n                },\n            ],\n            outputs: [{name: 'mapped', columns: [{name: 'total', type: 'Double'}]}],\n        },\n    },\n    {\n        id: 'reduce',\n        kind: 'operation',\n        name: 'Reduce',\n        operationType: 'reduce',\n        status: 'waiting',\n        progress: {total: 20},\n    },\n    {id: 'sink', kind: 'output', name: 'result', label: 'warehouse.result'},\n];\n\nexport const demoEdges: QueryGraphEdge[] = [\n    {id: 'source-read', source: 'source', target: 'read'},\n    {id: 'read-map', source: 'read', target: 'map'},\n    {id: 'map-reduce', source: 'map', target: 'reduce'},\n    {id: 'reduce-sink', source: 'reduce', target: 'sink'},\n];\n\nconst meta: Meta<typeof QueryGraph> = {\n    title: 'Components/QueryGraph',\n    component: QueryGraph,\n    tags: ['autodocs'],\n    args: {nodes: demoNodes, edges: demoEdges},\n    render: (args) => <QueryGraph {...args} className=\"query-graph-story\" />,\n    decorators: [\n        (Story) => (\n            <div style={{height: 600}}>\n                <Story />\n            </div>\n        ),\n    ],\n};\n\nexport default meta;\ntype Story = StoryObj<typeof QueryGraph>;\n\nexport const Default: Story = {};\n\nexport const Statuses: Story = {\n    args: {\n        nodes: [\n            {id: 'not-started', kind: 'operation', name: 'Map', status: 'not-started'},\n            {id: 'waiting', kind: 'operation', name: 'Map', status: 'waiting'},\n            {id: 'running', kind: 'operation', name: 'Map', status: 'running'},\n            {id: 'completed', kind: 'operation', name: 'Map', status: 'completed'},\n            {id: 'failed', kind: 'operation', name: 'Map', status: 'failed'},\n            {id: 'aborted', kind: 'operation', name: 'Map', status: 'aborted'},\n        ].map((node, index) => ({\n            ...node,\n            progress: {total: index === 5 ? 23 : 2_684_677},\n        })) as QueryGraphNode[],\n        edges: [],\n        largeGraphThreshold: false,\n    },\n};\n\nexport const OperationTypes: Story = {\n    args: {\n        nodes: (\n            [\n                'read',\n                'map',\n                'reduce',\n                'map-reduce',\n                'merge',\n                'sort',\n                'erase',\n                'commit',\n                'operation',\n            ] as const\n        ).map((operationType) => ({\n            id: operationType,\n            kind: 'operation' as const,\n            name: operationType,\n            label:\n                operationType === 'map-reduce'\n                    ? 'A very long reusable MapReduce operation label'\n                    : operationType,\n            operationType,\n            status: 'not-started' as const,\n        })),\n        edges: [\n            {id: 'read-map', source: 'read', target: 'map'},\n            {id: 'map-reduce', source: 'map', target: 'reduce'},\n            {id: 'map-reduce-merge', source: 'map-reduce', target: 'merge'},\n            {id: 'merge-sort', source: 'merge', target: 'sort'},\n            {id: 'erase-commit', source: 'erase', target: 'commit'},\n            {id: 'commit-operation', source: 'commit', target: 'operation'},\n        ],\n        largeGraphThreshold: false,\n    },\n};\n\nexport const CustomIcon: Story = {\n    args: {\n        nodes: [\n            {\n                id: 'custom',\n                kind: 'operation',\n                name: 'Custom operation',\n                status: 'not-started',\n                icon: (\n                    <svg\n                        width=\"16\"\n                        height=\"16\"\n                        viewBox=\"0 0 16 16\"\n                        xmlns=\"http://www.w3.org/2000/svg\"\n                    >\n                        <path fill=\"currentColor\" d=\"M8 1 15 8 8 15 1 8z\" />\n                    </svg>\n                ),\n            },\n        ],\n        edges: [],\n        largeGraphThreshold: false,\n    },\n};\n\nfunction UpdatingProgressStory(props: React.ComponentProps<typeof QueryGraph>) {\n    const [completed, setCompleted] = useState(0);\n    useEffect(() => {\n        const timer = window.setInterval(() => setCompleted((value) => (value + 5) % 105), 500);\n        return () => window.clearInterval(timer);\n    }, []);\n    return (\n        <QueryGraph\n            {...props}\n            nodes={props.nodes.map((node) =>\n                node.id === 'progress'\n                    ? {...node, progress: {total: 100, completed, fraction: completed / 100}}\n                    : node,\n            )}\n        />\n    );\n}\n\nexport const UpdatingProgress: Story = {\n    args: {\n        nodes: [\n            {\n                id: 'progress',\n                kind: 'operation',\n                name: 'Map',\n                operationType: 'map',\n                status: 'running',\n                progress: {total: 100, completed: 0},\n            },\n        ],\n        edges: [],\n        largeGraphThreshold: false,\n    },\n    render: (args) => <UpdatingProgressStory {...args} />,\n};\n\nexport const LargeGraph: Story = {\n    args: {\n        nodes: largeGraphNodes,\n        edges: largeGraphEdges,\n        largeGraphThreshold: false,\n    },\n};\n\nexport const LargeGraphThreshold: Story = {\n    args: {\n        nodes: Array.from({length: 701}, (_, index) => ({\n            id: `node-${index}`,\n            kind: 'operation' as const,\n            name: `Operation ${index}`,\n            status: index % 3 ? ('completed' as const) : ('running' as const),\n        })),\n        edges: Array.from({length: 700}, (_, index) => ({\n            id: `edge-${index}`,\n            source: `node-${index}`,\n            target: `node-${index + 1}`,\n        })),\n    },\n};\n\nexport const InvalidGraph: Story = {\n    args: {nodes: demoNodes, edges: [{id: 'bad', source: 'source', target: 'missing'}]},\n};\n"],"mappings":"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","ignoreList":[]}

package/build/esm/components/QueryGraph/helpers/layout.d.ts

@@ -0,0 +1,9 @@
+import type { TMultipointConnection } from '@gravity-ui/graph';
+import type { QueryGraphEdge, QueryGraphNode } from '../../../types/queryGraph';
+export declare function getQueryGraphNodeSize(node: QueryGraphNode): {
+    width: number;
+    height: number;
+};
+export declare function validateQueryGraph(nodes: QueryGraphNode[], edges: QueryGraphEdge[]): void;
+export declare function createQueryGraphConnections(edges: QueryGraphEdge[], routes?: Record<string | number | symbol, Pick<TMultipointConnection, 'points' | 'labels'>>): TMultipointConnection[];
+export declare function getQueryGraphProgress(node: QueryGraphNode): number;

package/build/esm/components/QueryGraph/helpers/layout.js

@@ -0,0 +1,128 @@
+import _objectSpread from "@babel/runtime/helpers/objectSpread2";
+import _createForOfIteratorHelper from "@babel/runtime/helpers/createForOfIteratorHelper";
+import "core-js/modules/es.error.cause.js";
+import "core-js/modules/es.error.to-string.js";
+import "core-js/modules/es.array.filter.js";
+import "core-js/modules/es.array.for-each.js";
+import "core-js/modules/es.array.iterator.js";
+import "core-js/modules/es.array.map.js";
+import "core-js/modules/es.array.push.js";
+import "core-js/modules/es.iterator.constructor.js";
+import "core-js/modules/es.iterator.filter.js";
+import "core-js/modules/es.iterator.for-each.js";
+import "core-js/modules/es.iterator.map.js";
+import "core-js/modules/es.map.js";
+import "core-js/modules/es.object.to-string.js";
+import "core-js/modules/es.set.js";
+import "core-js/modules/es.set.difference.v2.js";
+import "core-js/modules/es.set.intersection.v2.js";
+import "core-js/modules/es.set.is-disjoint-from.v2.js";
+import "core-js/modules/es.set.is-subset-of.v2.js";
+import "core-js/modules/es.set.is-superset-of.v2.js";
+import "core-js/modules/es.set.symmetric-difference.v2.js";
+import "core-js/modules/es.set.union.v2.js";
+import "core-js/modules/es.string.iterator.js";
+import "core-js/modules/esnext.map.get-or-insert.js";
+import "core-js/modules/esnext.map.get-or-insert-computed.js";
+import "core-js/modules/web.dom-collections.for-each.js";
+import "core-js/modules/web.dom-collections.iterator.js";
+var OPERATION_SIZE = 65;
+var RESOURCE_WIDTH = 36;
+var RESOURCE_HEIGHT = 36;
+export function getQueryGraphNodeSize(node) {
+  return node.kind === 'operation' ? {
+    width: OPERATION_SIZE,
+    height: OPERATION_SIZE
+  } : {
+    width: RESOURCE_WIDTH,
+    height: RESOURCE_HEIGHT
+  };
+}
+export function validateQueryGraph(nodes, edges) {
+  var ids = new Set();
+  var _iterator = _createForOfIteratorHelper(nodes),
+    _step;
+  try {
+    for (_iterator.s(); !(_step = _iterator.n()).done;) {
+      var node = _step.value;
+      if (ids.has(node.id)) throw new Error("Duplicate query graph node id: ".concat(node.id));
+      ids.add(node.id);
+    }
+  } catch (err) {
+    _iterator.e(err);
+  } finally {
+    _iterator.f();
+  }
+  var edgeIds = new Set();
+  var _iterator2 = _createForOfIteratorHelper(edges),
+    _step2;
+  try {
+    for (_iterator2.s(); !(_step2 = _iterator2.n()).done;) {
+      var edge = _step2.value;
+      if (edgeIds.has(edge.id)) throw new Error("Duplicate query graph edge id: ".concat(edge.id));
+      edgeIds.add(edge.id);
+      if (!ids.has(edge.source)) throw new Error("Unknown source node: ".concat(edge.source));
+      if (!ids.has(edge.target)) throw new Error("Unknown target node: ".concat(edge.target));
+    }
+  } catch (err) {
+    _iterator2.e(err);
+  } finally {
+    _iterator2.f();
+  }
+  var incoming = new Map(nodes.map(function (node) {
+    return [node.id, 0];
+  }));
+  var outgoing = new Map(nodes.map(function (node) {
+    return [node.id, []];
+  }));
+  edges.forEach(function (edge) {
+    var _incoming$get, _outgoing$get;
+    incoming.set(edge.target, ((_incoming$get = incoming.get(edge.target)) !== null && _incoming$get !== void 0 ? _incoming$get : 0) + 1);
+    (_outgoing$get = outgoing.get(edge.source)) === null || _outgoing$get === void 0 || _outgoing$get.push(edge.target);
+  });
+  var queue = nodes.filter(function (node) {
+    return incoming.get(node.id) === 0;
+  }).map(function (node) {
+    return node.id;
+  });
+  var visited = 0;
+  for (var index = 0; index < queue.length; index++) {
+    var _outgoing$get2;
+    var id = queue[index];
+    visited++;
+    var _iterator3 = _createForOfIteratorHelper((_outgoing$get2 = outgoing.get(id)) !== null && _outgoing$get2 !== void 0 ? _outgoing$get2 : []),
+      _step3;
+    try {
+      for (_iterator3.s(); !(_step3 = _iterator3.n()).done;) {
+        var _incoming$get2;
+        var target = _step3.value;
+        var nextIncoming = ((_incoming$get2 = incoming.get(target)) !== null && _incoming$get2 !== void 0 ? _incoming$get2 : 0) - 1;
+        incoming.set(target, nextIncoming);
+        if (nextIncoming === 0) queue.push(target);
+      }
+    } catch (err) {
+      _iterator3.e(err);
+    } finally {
+      _iterator3.f();
+    }
+  }
+  if (visited !== nodes.length) throw new Error('Query graph contains a cycle');
+}
+export function createQueryGraphConnections(edges, routes) {
+  return edges.map(function (edge) {
+    return _objectSpread({
+      id: edge.id,
+      sourceBlockId: edge.source,
+      targetBlockId: edge.target
+    }, routes === null || routes === void 0 ? void 0 : routes[edge.id]);
+  });
+}
+export function getQueryGraphProgress(node) {
+  var _node$progress, _node$progress$total, _node$progress2, _node$progress$comple, _node$progress3;
+  var fraction = (_node$progress = node.progress) === null || _node$progress === void 0 ? void 0 : _node$progress.fraction;
+  if (typeof fraction === 'number') return Math.min(1, Math.max(0, fraction));
+  var total = (_node$progress$total = (_node$progress2 = node.progress) === null || _node$progress2 === void 0 ? void 0 : _node$progress2.total) !== null && _node$progress$total !== void 0 ? _node$progress$total : 0;
+  if (total <= 0) return 0;
+  return Math.min(1, Math.max(0, ((_node$progress$comple = (_node$progress3 = node.progress) === null || _node$progress3 === void 0 ? void 0 : _node$progress3.completed) !== null && _node$progress$comple !== void 0 ? _node$progress$comple : 0) / total));
+}
+// #sourceMappingURL=layout.js.map

package/build/esm/components/QueryGraph/helpers/layout.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["OPERATION_SIZE","RESOURCE_WIDTH","RESOURCE_HEIGHT","getQueryGraphNodeSize","node","kind","width","height","validateQueryGraph","nodes","edges","ids","Set","_iterator","_createForOfIteratorHelper","_step","s","n","done","value","has","id","Error","concat","add","err","e","f","edgeIds","_iterator2","_step2","edge","source","target","incoming","Map","map","outgoing","forEach","_incoming$get","_outgoing$get","set","get","push","queue","filter","visited","index","length","_outgoing$get2","_iterator3","_step3","_incoming$get2","nextIncoming","createQueryGraphConnections","routes","_objectSpread","sourceBlockId","targetBlockId","getQueryGraphProgress","_node$progress","_node$progress$total","_node$progress2","_node$progress$comple","_node$progress3","fraction","progress","Math","min","max","total","completed"],"sources":["layout.ts"],"sourcesContent":["import type {TMultipointConnection} from '@gravity-ui/graph';\n\nimport type {QueryGraphEdge, QueryGraphNode} from '../../../types/queryGraph';\n\nconst OPERATION_SIZE = 65;\nconst RESOURCE_WIDTH = 36;\nconst RESOURCE_HEIGHT = 36;\n\nexport function getQueryGraphNodeSize(node: QueryGraphNode) {\n    return node.kind === 'operation'\n        ? {width: OPERATION_SIZE, height: OPERATION_SIZE}\n        : {width: RESOURCE_WIDTH, height: RESOURCE_HEIGHT};\n}\n\nexport function validateQueryGraph(nodes: QueryGraphNode[], edges: QueryGraphEdge[]) {\n    const ids = new Set<string>();\n    for (const node of nodes) {\n        if (ids.has(node.id)) throw new Error(`Duplicate query graph node id: ${node.id}`);\n        ids.add(node.id);\n    }\n\n    const edgeIds = new Set<string>();\n    for (const edge of edges) {\n        if (edgeIds.has(edge.id)) throw new Error(`Duplicate query graph edge id: ${edge.id}`);\n        edgeIds.add(edge.id);\n        if (!ids.has(edge.source)) throw new Error(`Unknown source node: ${edge.source}`);\n        if (!ids.has(edge.target)) throw new Error(`Unknown target node: ${edge.target}`);\n    }\n\n    const incoming = new Map(nodes.map((node) => [node.id, 0]));\n    const outgoing = new Map(nodes.map((node) => [node.id, [] as string[]]));\n    edges.forEach((edge) => {\n        incoming.set(edge.target, (incoming.get(edge.target) ?? 0) + 1);\n        outgoing.get(edge.source)?.push(edge.target);\n    });\n\n    const queue = nodes.filter((node) => incoming.get(node.id) === 0).map((node) => node.id);\n    let visited = 0;\n    for (let index = 0; index < queue.length; index++) {\n        const id = queue[index];\n        visited++;\n        for (const target of outgoing.get(id) ?? []) {\n            const nextIncoming = (incoming.get(target) ?? 0) - 1;\n            incoming.set(target, nextIncoming);\n            if (nextIncoming === 0) queue.push(target);\n        }\n    }\n    if (visited !== nodes.length) throw new Error('Query graph contains a cycle');\n}\n\nexport function createQueryGraphConnections(\n    edges: QueryGraphEdge[],\n    routes?: Record<string | number | symbol, Pick<TMultipointConnection, 'points' | 'labels'>>,\n): TMultipointConnection[] {\n    return edges.map((edge) => ({\n        id: edge.id,\n        sourceBlockId: edge.source,\n        targetBlockId: edge.target,\n        ...routes?.[edge.id],\n    }));\n}\n\nexport function getQueryGraphProgress(node: QueryGraphNode) {\n    const fraction = node.progress?.fraction;\n    if (typeof fraction === 'number') return Math.min(1, Math.max(0, fraction));\n    const total = node.progress?.total ?? 0;\n    if (total <= 0) return 0;\n    return Math.min(1, Math.max(0, (node.progress?.completed ?? 0) / total));\n}\n"],"mappings":"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","ignoreList":[]}

package/build/esm/components/QueryGraph/helpers/presentation.d.ts

@@ -0,0 +1,18 @@
+import type { QueryGraphNode } from '../../../types/queryGraph';
+export declare function getQueryGraphNodeContent(node: QueryGraphNode): {
+    readonly kind: "icon";
+    readonly value?: undefined;
+} | {
+    readonly kind: "counter";
+    readonly value: string;
+} | {
+    readonly kind: "empty";
+    readonly value?: undefined;
+};
+export declare function getScaleAdjustedFontSize(fontSize: number, cameraScale: number): number;
+export declare function fitCanvasFontSize(fontSize: number, measuredWidth: number, maxWidth: number): number;
+export declare function fitCanvasText(context: {
+    measureText: (text: string) => {
+        width: number;
+    };
+}, text: string, maxWidth: number, trimStart: boolean): string;

package/build/esm/components/QueryGraph/helpers/presentation.js

@@ -0,0 +1,35 @@
+import "core-js/modules/es.array.slice.js";
+export function getQueryGraphNodeContent(node) {
+  var _node$status, _node$progress;
+  var status = (_node$status = node.status) !== null && _node$status !== void 0 ? _node$status : 'not-started';
+  if (status === 'not-started') return {
+    kind: 'icon'
+  };
+  var total = (_node$progress = node.progress) === null || _node$progress === void 0 ? void 0 : _node$progress.total;
+  return typeof total === 'number' && total > 0 ? {
+    kind: 'counter',
+    value: String(total)
+  } : {
+    kind: 'empty'
+  };
+}
+export function getScaleAdjustedFontSize(fontSize, cameraScale) {
+  return cameraScale > 0 ? fontSize / cameraScale : fontSize;
+}
+export function fitCanvasFontSize(fontSize, measuredWidth, maxWidth) {
+  if (measuredWidth <= 0 || measuredWidth <= maxWidth) return fontSize;
+  return fontSize * (maxWidth / measuredWidth);
+}
+export function fitCanvasText(context, text, maxWidth, trimStart) {
+  if (context.measureText(text).width <= maxWidth) return text;
+  var ellipsis = '…';
+  var low = 0;
+  var high = text.length;
+  while (low < high) {
+    var length = Math.ceil((low + high) / 2);
+    var candidate = trimStart ? ellipsis + text.slice(text.length - length) : text.slice(0, length) + ellipsis;
+    if (context.measureText(candidate).width <= maxWidth) low = length;else high = length - 1;
+  }
+  return trimStart ? ellipsis + text.slice(text.length - low) : text.slice(0, low) + ellipsis;
+}
+// #sourceMappingURL=presentation.js.map

package/build/esm/components/QueryGraph/helpers/presentation.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["getQueryGraphNodeContent","node","_node$status","_node$progress","status","kind","total","progress","value","String","getScaleAdjustedFontSize","fontSize","cameraScale","fitCanvasFontSize","measuredWidth","maxWidth","fitCanvasText","context","text","trimStart","measureText","width","ellipsis","low","high","length","Math","ceil","candidate","slice"],"sources":["presentation.ts"],"sourcesContent":["import type {QueryGraphNode} from '../../../types/queryGraph';\n\nexport function getQueryGraphNodeContent(node: QueryGraphNode) {\n    const status = node.status ?? 'not-started';\n    if (status === 'not-started') return {kind: 'icon'} as const;\n    const total = node.progress?.total;\n    return typeof total === 'number' && total > 0\n        ? ({kind: 'counter', value: String(total)} as const)\n        : ({kind: 'empty'} as const);\n}\n\nexport function getScaleAdjustedFontSize(fontSize: number, cameraScale: number) {\n    return cameraScale > 0 ? fontSize / cameraScale : fontSize;\n}\n\nexport function fitCanvasFontSize(fontSize: number, measuredWidth: number, maxWidth: number) {\n    if (measuredWidth <= 0 || measuredWidth <= maxWidth) return fontSize;\n    return fontSize * (maxWidth / measuredWidth);\n}\n\nexport function fitCanvasText(\n    context: {measureText: (text: string) => {width: number}},\n    text: string,\n    maxWidth: number,\n    trimStart: boolean,\n) {\n    if (context.measureText(text).width <= maxWidth) return text;\n    const ellipsis = '…';\n    let low = 0;\n    let high = text.length;\n    while (low < high) {\n        const length = Math.ceil((low + high) / 2);\n        const candidate = trimStart\n            ? ellipsis + text.slice(text.length - length)\n            : text.slice(0, length) + ellipsis;\n        if (context.measureText(candidate).width <= maxWidth) low = length;\n        else high = length - 1;\n    }\n    return trimStart ? ellipsis + text.slice(text.length - low) : text.slice(0, low) + ellipsis;\n}\n"],"mappings":";AAEA,OAAO,SAASA,wBAAwBA,CAACC,IAAoB,EAAE;EAAA,IAAAC,YAAA,EAAAC,cAAA;EAC3D,IAAMC,MAAM,IAAAF,YAAA,GAAGD,IAAI,CAACG,MAAM,cAAAF,YAAA,cAAAA,YAAA,GAAI,aAAa;EAC3C,IAAIE,MAAM,KAAK,aAAa,EAAE,OAAO;IAACC,IAAI,EAAE;EAAM,CAAC;EACnD,IAAMC,KAAK,IAAAH,cAAA,GAAGF,IAAI,CAACM,QAAQ,cAAAJ,cAAA,uBAAbA,cAAA,CAAeG,KAAK;EAClC,OAAO,OAAOA,KAAK,KAAK,QAAQ,IAAIA,KAAK,GAAG,CAAC,GACtC;IAACD,IAAI,EAAE,SAAS;IAAEG,KAAK,EAAEC,MAAM,CAACH,KAAK;EAAC,CAAC,GACvC;IAACD,IAAI,EAAE;EAAO,CAAW;AACpC;AAEA,OAAO,SAASK,wBAAwBA,CAACC,QAAgB,EAAEC,WAAmB,EAAE;EAC5E,OAAOA,WAAW,GAAG,CAAC,GAAGD,QAAQ,GAAGC,WAAW,GAAGD,QAAQ;AAC9D;AAEA,OAAO,SAASE,iBAAiBA,CAACF,QAAgB,EAAEG,aAAqB,EAAEC,QAAgB,EAAE;EACzF,IAAID,aAAa,IAAI,CAAC,IAAIA,aAAa,IAAIC,QAAQ,EAAE,OAAOJ,QAAQ;EACpE,OAAOA,QAAQ,IAAII,QAAQ,GAAGD,aAAa,CAAC;AAChD;AAEA,OAAO,SAASE,aAAaA,CACzBC,OAAyD,EACzDC,IAAY,EACZH,QAAgB,EAChBI,SAAkB,EACpB;EACE,IAAIF,OAAO,CAACG,WAAW,CAACF,IAAI,CAAC,CAACG,KAAK,IAAIN,QAAQ,EAAE,OAAOG,IAAI;EAC5D,IAAMI,QAAQ,GAAG,GAAG;EACpB,IAAIC,GAAG,GAAG,CAAC;EACX,IAAIC,IAAI,GAAGN,IAAI,CAACO,MAAM;EACtB,OAAOF,GAAG,GAAGC,IAAI,EAAE;IACf,IAAMC,MAAM,GAAGC,IAAI,CAACC,IAAI,CAAC,CAACJ,GAAG,GAAGC,IAAI,IAAI,CAAC,CAAC;IAC1C,IAAMI,SAAS,GAAGT,SAAS,GACrBG,QAAQ,GAAGJ,IAAI,CAACW,KAAK,CAACX,IAAI,CAACO,MAAM,GAAGA,MAAM,CAAC,GAC3CP,IAAI,CAACW,KAAK,CAAC,CAAC,EAAEJ,MAAM,CAAC,GAAGH,QAAQ;IACtC,IAAIL,OAAO,CAACG,WAAW,CAACQ,SAAS,CAAC,CAACP,KAAK,IAAIN,QAAQ,EAAEQ,GAAG,GAAGE,MAAM,CAAC,KAC9DD,IAAI,GAAGC,MAAM,GAAG,CAAC;EAC1B;EACA,OAAON,SAAS,GAAGG,QAAQ,GAAGJ,IAAI,CAACW,KAAK,CAACX,IAAI,CAACO,MAAM,GAAGF,GAAG,CAAC,GAAGL,IAAI,CAACW,KAAK,CAAC,CAAC,EAAEN,GAAG,CAAC,GAAGD,QAAQ;AAC/F","ignoreList":[]}

package/build/esm/components/QueryGraph/i18n/dicts.d.ts

@@ -0,0 +1,55 @@
+declare const _default: {
+    en: {
+        action_fit: string;
+        "action_zoom-in": string;
+        "action_zoom-out": string;
+        "action_show-graph": string;
+        "context_large-graph": string;
+        context_empty: string;
+        value_stages: string;
+        value_details: string;
+        value_jobs: string;
+        value_schemas: string;
+        field_stage: string;
+        field_duration: string;
+        field_status: string;
+        field_count: string;
+        field_name: string;
+        field_type: string;
+        value_total: string;
+        value_inputs: string;
+        value_outputs: string;
+        status_pending: string;
+        status_running: string;
+        status_completed: string;
+        status_failed: string;
+        status_aborted: string;
+    };
+    ru: {
+        action_fit: string;
+        "action_zoom-in": string;
+        "action_zoom-out": string;
+        "action_show-graph": string;
+        "context_large-graph": string;
+        context_empty: string;
+        value_stages: string;
+        value_details: string;
+        value_jobs: string;
+        value_schemas: string;
+        field_stage: string;
+        field_duration: string;
+        field_status: string;
+        field_count: string;
+        field_name: string;
+        field_type: string;
+        value_total: string;
+        value_inputs: string;
+        value_outputs: string;
+        status_pending: string;
+        status_running: string;
+        status_completed: string;
+        status_failed: string;
+        status_aborted: string;
+    };
+};
+export default _default;

package/build/esm/components/QueryGraph/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