@sqlrooms/schema-tree 0.16.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/LICENSE.md +9 -0
- package/README.md +19 -0
- package/dist/TableSchemaTree.d.ts +10 -0
- package/dist/TableSchemaTree.d.ts.map +1 -0
- package/dist/TableSchemaTree.js +32 -0
- package/dist/TableSchemaTree.js.map +1 -0
- package/dist/index.d.ts +12 -0
- package/dist/index.d.ts.map +1 -0
- package/dist/index.js +12 -0
- package/dist/index.js.map +1 -0
- package/dist/nodes/BaseTreeNode.d.ts +7 -0
- package/dist/nodes/BaseTreeNode.d.ts.map +1 -0
- package/dist/nodes/BaseTreeNode.js +9 -0
- package/dist/nodes/BaseTreeNode.js.map +1 -0
- package/dist/nodes/ColumnTreeNode.d.ts +8 -0
- package/dist/nodes/ColumnTreeNode.d.ts.map +1 -0
- package/dist/nodes/ColumnTreeNode.js +11 -0
- package/dist/nodes/ColumnTreeNode.js.map +1 -0
- package/dist/nodes/DatabaseTreeNode.d.ts +8 -0
- package/dist/nodes/DatabaseTreeNode.d.ts.map +1 -0
- package/dist/nodes/DatabaseTreeNode.js +9 -0
- package/dist/nodes/DatabaseTreeNode.js.map +1 -0
- package/dist/nodes/SchemaTreeNode.d.ts +8 -0
- package/dist/nodes/SchemaTreeNode.d.ts.map +1 -0
- package/dist/nodes/SchemaTreeNode.js +9 -0
- package/dist/nodes/SchemaTreeNode.js.map +1 -0
- package/dist/nodes/TableTreeNode.d.ts +9 -0
- package/dist/nodes/TableTreeNode.d.ts.map +1 -0
- package/dist/nodes/TableTreeNode.js +26 -0
- package/dist/nodes/TableTreeNode.js.map +1 -0
- package/dist/nodes/TreeNodeActionsMenu.d.ts +19 -0
- package/dist/nodes/TreeNodeActionsMenu.d.ts.map +1 -0
- package/dist/nodes/TreeNodeActionsMenu.js +22 -0
- package/dist/nodes/TreeNodeActionsMenu.js.map +1 -0
- package/package.json +41 -0
package/LICENSE.md
ADDED
|
@@ -0,0 +1,9 @@
|
|
|
1
|
+
MIT License
|
|
2
|
+
|
|
3
|
+
Copyright 2025 Ilya Boyandin
|
|
4
|
+
|
|
5
|
+
Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the “Software”), to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so, subject to the following conditions:
|
|
6
|
+
|
|
7
|
+
The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.
|
|
8
|
+
|
|
9
|
+
THE SOFTWARE IS PROVIDED “AS IS”, WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
|
package/README.md
ADDED
|
@@ -0,0 +1,19 @@
|
|
|
1
|
+
This package is part of the SQLRooms framework.
|
|
2
|
+
|
|
3
|
+
# DuckDB schema tree
|
|
4
|
+
|
|
5
|
+
A React component library for rendering DuckDB schema trees in a hierarchical view. It provides components to display database schemas, tables, and columns in an interactive tree structure with features like:
|
|
6
|
+
|
|
7
|
+
- Expandable/collapsible tree nodes
|
|
8
|
+
- Column type badges
|
|
9
|
+
- Context menus for actions (e.g. copying column names)
|
|
10
|
+
- Customizable node rendering
|
|
11
|
+
- Hover states and visual feedback
|
|
12
|
+
|
|
13
|
+
The main components are:
|
|
14
|
+
|
|
15
|
+
- `TableSchemaTree`: The root tree component that renders the full schema hierarchy
|
|
16
|
+
- `ColumnTreeNode`: Specialized node for displaying column information
|
|
17
|
+
- `TreeNodeActionsMenu`: Reusable menu component for node actions
|
|
18
|
+
|
|
19
|
+
This package is used by SQLRooms to provide schema browsing capabilities in the database explorer interface.
|
|
@@ -0,0 +1,10 @@
|
|
|
1
|
+
import { DbSchemaNode } from '@sqlrooms/duckdb';
|
|
2
|
+
import { FC } from 'react';
|
|
3
|
+
export declare const defaultRenderTableSchemaNode: (node: DbSchemaNode) => import("react/jsx-runtime").JSX.Element | null;
|
|
4
|
+
export declare const TableSchemaTree: FC<{
|
|
5
|
+
className?: string;
|
|
6
|
+
schemaTrees: DbSchemaNode[];
|
|
7
|
+
renderNode?: (node: DbSchemaNode, isOpen: boolean) => React.ReactNode;
|
|
8
|
+
skipSingleDatabaseOrSchema?: boolean;
|
|
9
|
+
}>;
|
|
10
|
+
//# sourceMappingURL=TableSchemaTree.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"TableSchemaTree.d.ts","sourceRoot":"","sources":["../src/TableSchemaTree.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAC,YAAY,EAAC,MAAM,kBAAkB,CAAC;AAE9C,OAAO,EAAC,EAAE,EAAC,MAAM,OAAO,CAAC;AAMzB,eAAO,MAAM,4BAA4B,GAAI,MAAM,YAAY,mDAc9D,CAAC;AAEF,eAAO,MAAM,eAAe,EAAE,EAAE,CAAC;IAC/B,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,WAAW,EAAE,YAAY,EAAE,CAAC;IAC5B,UAAU,CAAC,EAAE,CAAC,IAAI,EAAE,YAAY,EAAE,MAAM,EAAE,OAAO,KAAK,KAAK,CAAC,SAAS,CAAC;IACtE,0BAA0B,CAAC,EAAE,OAAO,CAAC;CACtC,CA2BA,CAAC"}
|
|
@@ -0,0 +1,32 @@
|
|
|
1
|
+
import { jsx as _jsx } from "react/jsx-runtime";
|
|
2
|
+
import { cn, Tree } from '@sqlrooms/ui';
|
|
3
|
+
import { ColumnTreeNode } from './nodes/ColumnTreeNode';
|
|
4
|
+
import { DatabaseTreeNode } from './nodes/DatabaseTreeNode';
|
|
5
|
+
import { SchemaTreeNode } from './nodes/SchemaTreeNode';
|
|
6
|
+
import { TableTreeNode } from './nodes/TableTreeNode';
|
|
7
|
+
export const defaultRenderTableSchemaNode = (node) => {
|
|
8
|
+
const { object: nodeObject } = node;
|
|
9
|
+
switch (nodeObject.type) {
|
|
10
|
+
case 'database':
|
|
11
|
+
return _jsx(DatabaseTreeNode, { nodeObject: nodeObject });
|
|
12
|
+
case 'schema':
|
|
13
|
+
return _jsx(SchemaTreeNode, { nodeObject: nodeObject });
|
|
14
|
+
case 'table':
|
|
15
|
+
return _jsx(TableTreeNode, { nodeObject: nodeObject });
|
|
16
|
+
case 'column':
|
|
17
|
+
return _jsx(ColumnTreeNode, { nodeObject: nodeObject });
|
|
18
|
+
default:
|
|
19
|
+
return null;
|
|
20
|
+
}
|
|
21
|
+
};
|
|
22
|
+
export const TableSchemaTree = ({ className, schemaTrees, renderNode = defaultRenderTableSchemaNode, skipSingleDatabaseOrSchema = false, }) => {
|
|
23
|
+
const trees = skipSingleDatabaseOrSchema
|
|
24
|
+
? schemaTrees.length > 1
|
|
25
|
+
? schemaTrees
|
|
26
|
+
: schemaTrees[0]?.children && schemaTrees[0]?.children?.length > 1
|
|
27
|
+
? schemaTrees[0].children
|
|
28
|
+
: schemaTrees[0]?.children?.[0]?.children
|
|
29
|
+
: schemaTrees;
|
|
30
|
+
return (_jsx("div", { className: cn('flex h-full flex-col gap-2 overflow-auto p-0', className), children: trees?.map((subtree) => (_jsx(Tree, { treeData: subtree, renderNode: renderNode }, subtree.object.name))) }));
|
|
31
|
+
};
|
|
32
|
+
//# sourceMappingURL=TableSchemaTree.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"TableSchemaTree.js","sourceRoot":"","sources":["../src/TableSchemaTree.tsx"],"names":[],"mappings":";AACA,OAAO,EAAC,EAAE,EAAE,IAAI,EAAC,MAAM,cAAc,CAAC;AAEtC,OAAO,EAAC,cAAc,EAAC,MAAM,wBAAwB,CAAC;AACtD,OAAO,EAAC,gBAAgB,EAAC,MAAM,0BAA0B,CAAC;AAC1D,OAAO,EAAC,cAAc,EAAC,MAAM,wBAAwB,CAAC;AACtD,OAAO,EAAC,aAAa,EAAC,MAAM,uBAAuB,CAAC;AAEpD,MAAM,CAAC,MAAM,4BAA4B,GAAG,CAAC,IAAkB,EAAE,EAAE;IACjE,MAAM,EAAC,MAAM,EAAE,UAAU,EAAC,GAAG,IAAI,CAAC;IAClC,QAAQ,UAAU,CAAC,IAAI,EAAE,CAAC;QACxB,KAAK,UAAU;YACb,OAAO,KAAC,gBAAgB,IAAC,UAAU,EAAE,UAAU,GAAI,CAAC;QACtD,KAAK,QAAQ;YACX,OAAO,KAAC,cAAc,IAAC,UAAU,EAAE,UAAU,GAAI,CAAC;QACpD,KAAK,OAAO;YACV,OAAO,KAAC,aAAa,IAAC,UAAU,EAAE,UAAU,GAAI,CAAC;QACnD,KAAK,QAAQ;YACX,OAAO,KAAC,cAAc,IAAC,UAAU,EAAE,UAAU,GAAI,CAAC;QACpD;YACE,OAAO,IAAI,CAAC;IAChB,CAAC;AACH,CAAC,CAAC;AAEF,MAAM,CAAC,MAAM,eAAe,GAKvB,CAAC,EACJ,SAAS,EACT,WAAW,EACX,UAAU,GAAG,4BAA4B,EACzC,0BAA0B,GAAG,KAAK,GACnC,EAAE,EAAE;IACH,MAAM,KAAK,GAAG,0BAA0B;QACtC,CAAC,CAAC,WAAW,CAAC,MAAM,GAAG,CAAC;YACtB,CAAC,CAAC,WAAW;YACb,CAAC,CAAC,WAAW,CAAC,CAAC,CAAC,EAAE,QAAQ,IAAI,WAAW,CAAC,CAAC,CAAC,EAAE,QAAQ,EAAE,MAAM,GAAG,CAAC;gBAChE,CAAC,CAAC,WAAW,CAAC,CAAC,CAAC,CAAC,QAAQ;gBACzB,CAAC,CAAC,WAAW,CAAC,CAAC,CAAC,EAAE,QAAQ,EAAE,CAAC,CAAC,CAAC,EAAE,QAAQ;QAC7C,CAAC,CAAC,WAAW,CAAC;IAEhB,OAAO,CACL,cACE,SAAS,EAAE,EAAE,CAAC,8CAA8C,EAAE,SAAS,CAAC,YAEvE,KAAK,EAAE,GAAG,CAAC,CAAC,OAAO,EAAE,EAAE,CAAC,CACvB,KAAC,IAAI,IAEH,QAAQ,EAAE,OAAO,EACjB,UAAU,EAAE,UAAU,IAFjB,OAAO,CAAC,MAAM,CAAC,IAAI,CAGxB,CACH,CAAC,GACE,CACP,CAAC;AACJ,CAAC,CAAC","sourcesContent":["import {DbSchemaNode} from '@sqlrooms/duckdb';\nimport {cn, Tree} from '@sqlrooms/ui';\nimport {FC} from 'react';\nimport {ColumnTreeNode} from './nodes/ColumnTreeNode';\nimport {DatabaseTreeNode} from './nodes/DatabaseTreeNode';\nimport {SchemaTreeNode} from './nodes/SchemaTreeNode';\nimport {TableTreeNode} from './nodes/TableTreeNode';\n\nexport const defaultRenderTableSchemaNode = (node: DbSchemaNode) => {\n const {object: nodeObject} = node;\n switch (nodeObject.type) {\n case 'database':\n return <DatabaseTreeNode nodeObject={nodeObject} />;\n case 'schema':\n return <SchemaTreeNode nodeObject={nodeObject} />;\n case 'table':\n return <TableTreeNode nodeObject={nodeObject} />;\n case 'column':\n return <ColumnTreeNode nodeObject={nodeObject} />;\n default:\n return null;\n }\n};\n\nexport const TableSchemaTree: FC<{\n className?: string;\n schemaTrees: DbSchemaNode[];\n renderNode?: (node: DbSchemaNode, isOpen: boolean) => React.ReactNode;\n skipSingleDatabaseOrSchema?: boolean;\n}> = ({\n className,\n schemaTrees,\n renderNode = defaultRenderTableSchemaNode,\n skipSingleDatabaseOrSchema = false,\n}) => {\n const trees = skipSingleDatabaseOrSchema\n ? schemaTrees.length > 1\n ? schemaTrees\n : schemaTrees[0]?.children && schemaTrees[0]?.children?.length > 1\n ? schemaTrees[0].children\n : schemaTrees[0]?.children?.[0]?.children\n : schemaTrees;\n\n return (\n <div\n className={cn('flex h-full flex-col gap-2 overflow-auto p-0', className)}\n >\n {trees?.map((subtree) => (\n <Tree\n key={subtree.object.name}\n treeData={subtree}\n renderNode={renderNode}\n />\n ))}\n </div>\n );\n};\n"]}
|
package/dist/index.d.ts
ADDED
|
@@ -0,0 +1,12 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* {@include ../README.md}
|
|
3
|
+
* @packageDocumentation
|
|
4
|
+
*/
|
|
5
|
+
export { BaseTreeNode } from './nodes/BaseTreeNode';
|
|
6
|
+
export { ColumnTreeNode } from './nodes/ColumnTreeNode';
|
|
7
|
+
export { TableTreeNode, defaultRenderTableNodeMenuItems, } from './nodes/TableTreeNode';
|
|
8
|
+
export { SchemaTreeNode } from './nodes/SchemaTreeNode';
|
|
9
|
+
export { DatabaseTreeNode } from './nodes/DatabaseTreeNode';
|
|
10
|
+
export { TableSchemaTree, defaultRenderTableSchemaNode } from './TableSchemaTree';
|
|
11
|
+
export { TreeNodeActionsMenu, TreeNodeActionsMenuItem, } from './nodes/TreeNodeActionsMenu';
|
|
12
|
+
//# sourceMappingURL=index.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA;;;GAGG;AAEH,OAAO,EAAC,YAAY,EAAC,MAAM,sBAAsB,CAAC;AAClD,OAAO,EAAC,cAAc,EAAC,MAAM,wBAAwB,CAAC;AACtD,OAAO,EACL,aAAa,EACb,+BAA+B,GAChC,MAAM,uBAAuB,CAAC;AAC/B,OAAO,EAAC,cAAc,EAAC,MAAM,wBAAwB,CAAC;AACtD,OAAO,EAAC,gBAAgB,EAAC,MAAM,0BAA0B,CAAC;AAC1D,OAAO,EAAC,eAAe,EAAE,4BAA4B,EAAC,MAAM,mBAAmB,CAAC;AAChF,OAAO,EACL,mBAAmB,EACnB,uBAAuB,GACxB,MAAM,6BAA6B,CAAC"}
|
package/dist/index.js
ADDED
|
@@ -0,0 +1,12 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* {@include ../README.md}
|
|
3
|
+
* @packageDocumentation
|
|
4
|
+
*/
|
|
5
|
+
export { BaseTreeNode } from './nodes/BaseTreeNode';
|
|
6
|
+
export { ColumnTreeNode } from './nodes/ColumnTreeNode';
|
|
7
|
+
export { TableTreeNode, defaultRenderTableNodeMenuItems, } from './nodes/TableTreeNode';
|
|
8
|
+
export { SchemaTreeNode } from './nodes/SchemaTreeNode';
|
|
9
|
+
export { DatabaseTreeNode } from './nodes/DatabaseTreeNode';
|
|
10
|
+
export { TableSchemaTree, defaultRenderTableSchemaNode } from './TableSchemaTree';
|
|
11
|
+
export { TreeNodeActionsMenu, TreeNodeActionsMenuItem, } from './nodes/TreeNodeActionsMenu';
|
|
12
|
+
//# sourceMappingURL=index.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA;;;GAGG;AAEH,OAAO,EAAC,YAAY,EAAC,MAAM,sBAAsB,CAAC;AAClD,OAAO,EAAC,cAAc,EAAC,MAAM,wBAAwB,CAAC;AACtD,OAAO,EACL,aAAa,EACb,+BAA+B,GAChC,MAAM,uBAAuB,CAAC;AAC/B,OAAO,EAAC,cAAc,EAAC,MAAM,wBAAwB,CAAC;AACtD,OAAO,EAAC,gBAAgB,EAAC,MAAM,0BAA0B,CAAC;AAC1D,OAAO,EAAC,eAAe,EAAE,4BAA4B,EAAC,MAAM,mBAAmB,CAAC;AAChF,OAAO,EACL,mBAAmB,EACnB,uBAAuB,GACxB,MAAM,6BAA6B,CAAC","sourcesContent":["/**\n * {@include ../README.md}\n * @packageDocumentation\n */\n\nexport {BaseTreeNode} from './nodes/BaseTreeNode';\nexport {ColumnTreeNode} from './nodes/ColumnTreeNode';\nexport {\n TableTreeNode,\n defaultRenderTableNodeMenuItems,\n} from './nodes/TableTreeNode';\nexport {SchemaTreeNode} from './nodes/SchemaTreeNode';\nexport {DatabaseTreeNode} from './nodes/DatabaseTreeNode';\nexport {TableSchemaTree, defaultRenderTableSchemaNode} from './TableSchemaTree';\nexport {\n TreeNodeActionsMenu,\n TreeNodeActionsMenuItem,\n} from './nodes/TreeNodeActionsMenu';\n"]}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"BaseTreeNode.d.ts","sourceRoot":"","sources":["../../src/nodes/BaseTreeNode.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAC,iBAAiB,EAAC,MAAM,OAAO,CAAC;AAExC,wBAAgB,YAAY,CAAC,CAAC,EAC5B,KAAK,EAAE,iBAAiB,CAAC;IACvB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,UAAU,EAAE,CAAC,CAAC;IACd,OAAO,CAAC,EAAE,OAAO,CAAC;CACnB,CAAC,2CAqBH"}
|
|
@@ -0,0 +1,9 @@
|
|
|
1
|
+
import { jsx as _jsx } from "react/jsx-runtime";
|
|
2
|
+
import { Slot } from '@radix-ui/react-slot';
|
|
3
|
+
import { cn } from '@sqlrooms/ui';
|
|
4
|
+
export function BaseTreeNode(props) {
|
|
5
|
+
const { className, asChild, children } = props;
|
|
6
|
+
const Comp = asChild ? Slot : 'div';
|
|
7
|
+
return (_jsx(Comp, { className: cn('hover:bg-foreground/10 w-full flex-grow cursor-pointer select-none rounded-sm p-[1px]', className), children: _jsx("div", { className: cn('group relative flex w-full items-center overflow-hidden', className), children: children }) }));
|
|
8
|
+
}
|
|
9
|
+
//# sourceMappingURL=BaseTreeNode.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"BaseTreeNode.js","sourceRoot":"","sources":["../../src/nodes/BaseTreeNode.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAC,IAAI,EAAC,MAAM,sBAAsB,CAAC;AAC1C,OAAO,EAAC,EAAE,EAAC,MAAM,cAAc,CAAC;AAGhC,MAAM,UAAU,YAAY,CAC1B,KAIE;IAEF,MAAM,EAAC,SAAS,EAAE,OAAO,EAAE,QAAQ,EAAC,GAAG,KAAK,CAAC;IAC7C,MAAM,IAAI,GAAG,OAAO,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,KAAK,CAAC;IACpC,OAAO,CACL,KAAC,IAAI,IACH,SAAS,EAAE,EAAE,CACX,uFAAuF,EACvF,SAAS,CACV,YAED,cACE,SAAS,EAAE,EAAE,CACX,yDAAyD,EACzD,SAAS,CACV,YAEA,QAAQ,GACL,GACD,CACR,CAAC;AACJ,CAAC","sourcesContent":["import {Slot} from '@radix-ui/react-slot';\nimport {cn} from '@sqlrooms/ui';\nimport {PropsWithChildren} from 'react';\n\nexport function BaseTreeNode<T>(\n props: PropsWithChildren<{\n className?: string;\n nodeObject: T;\n asChild?: boolean;\n }>,\n) {\n const {className, asChild, children} = props;\n const Comp = asChild ? Slot : 'div';\n return (\n <Comp\n className={cn(\n 'hover:bg-foreground/10 w-full flex-grow cursor-pointer select-none rounded-sm p-[1px]',\n className,\n )}\n >\n <div\n className={cn(\n 'group relative flex w-full items-center overflow-hidden',\n className,\n )}\n >\n {children}\n </div>\n </Comp>\n );\n}\n"]}
|
|
@@ -0,0 +1,8 @@
|
|
|
1
|
+
import { ColumnNodeObject } from '@sqlrooms/duckdb';
|
|
2
|
+
import { FC } from 'react';
|
|
3
|
+
export declare const ColumnTreeNode: FC<{
|
|
4
|
+
className?: string;
|
|
5
|
+
nodeObject: ColumnNodeObject;
|
|
6
|
+
additionalMenuItems?: React.ReactNode;
|
|
7
|
+
}>;
|
|
8
|
+
//# sourceMappingURL=ColumnTreeNode.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"ColumnTreeNode.d.ts","sourceRoot":"","sources":["../../src/nodes/ColumnTreeNode.tsx"],"names":[],"mappings":"AAGA,OAAO,EAAC,gBAAgB,EAAC,MAAM,kBAAkB,CAAC;AAElD,OAAO,EAAC,EAAE,EAAC,MAAM,OAAO,CAAC;AAOzB,eAAO,MAAM,cAAc,EAAE,EAAE,CAAC;IAC9B,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,UAAU,EAAE,gBAAgB,CAAC;IAC7B,mBAAmB,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;CACvC,CAuBA,CAAC"}
|
|
@@ -0,0 +1,11 @@
|
|
|
1
|
+
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
|
+
// Copyright 2022 Foursquare Labs, Inc. All Rights Reserved.
|
|
3
|
+
import { ColumnTypeBadge } from '@sqlrooms/data-table';
|
|
4
|
+
import { CopyIcon } from 'lucide-react';
|
|
5
|
+
import { BaseTreeNode } from './BaseTreeNode';
|
|
6
|
+
import { TreeNodeActionsMenu, TreeNodeActionsMenuItem, } from './TreeNodeActionsMenu';
|
|
7
|
+
export const ColumnTreeNode = (props) => {
|
|
8
|
+
const { className, nodeObject, additionalMenuItems } = props;
|
|
9
|
+
return (_jsxs(BaseTreeNode, { asChild: true, className: className, nodeObject: nodeObject, children: [_jsxs("div", { className: "flex w-full items-center space-x-2", children: [_jsx(ColumnTypeBadge, { className: "opacity-50", columnType: nodeObject.columnType, typeCategory: nodeObject.columnTypeCategory }), _jsx("span", { className: "text-xs", children: nodeObject.name })] }), _jsxs(TreeNodeActionsMenu, { children: [_jsxs(TreeNodeActionsMenuItem, { onClick: () => navigator.clipboard.writeText(nodeObject.name), children: [_jsx(CopyIcon, { width: "15px" }), "Copy column name"] }), additionalMenuItems] })] }));
|
|
10
|
+
};
|
|
11
|
+
//# sourceMappingURL=ColumnTreeNode.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"ColumnTreeNode.js","sourceRoot":"","sources":["../../src/nodes/ColumnTreeNode.tsx"],"names":[],"mappings":";AAAA,4DAA4D;AAE5D,OAAO,EAAC,eAAe,EAAC,MAAM,sBAAsB,CAAC;AAErD,OAAO,EAAC,QAAQ,EAAC,MAAM,cAAc,CAAC;AAEtC,OAAO,EAAC,YAAY,EAAC,MAAM,gBAAgB,CAAC;AAC5C,OAAO,EACL,mBAAmB,EACnB,uBAAuB,GACxB,MAAM,uBAAuB,CAAC;AAE/B,MAAM,CAAC,MAAM,cAAc,GAItB,CAAC,KAAK,EAAE,EAAE;IACb,MAAM,EAAC,SAAS,EAAE,UAAU,EAAE,mBAAmB,EAAC,GAAG,KAAK,CAAC;IAC3D,OAAO,CACL,MAAC,YAAY,IAAC,OAAO,QAAC,SAAS,EAAE,SAAS,EAAE,UAAU,EAAE,UAAU,aAChE,eAAK,SAAS,EAAC,oCAAoC,aACjD,KAAC,eAAe,IACd,SAAS,EAAC,YAAY,EACtB,UAAU,EAAE,UAAU,CAAC,UAAU,EACjC,YAAY,EAAE,UAAU,CAAC,kBAAkB,GAC3C,EACF,eAAM,SAAS,EAAC,SAAS,YAAE,UAAU,CAAC,IAAI,GAAQ,IAC9C,EACN,MAAC,mBAAmB,eAClB,MAAC,uBAAuB,IACtB,OAAO,EAAE,GAAG,EAAE,CAAC,SAAS,CAAC,SAAS,CAAC,SAAS,CAAC,UAAU,CAAC,IAAI,CAAC,aAE7D,KAAC,QAAQ,IAAC,KAAK,EAAC,MAAM,GAAG,wBAED,EACzB,mBAAmB,IACA,IACT,CAChB,CAAC;AACJ,CAAC,CAAC","sourcesContent":["// Copyright 2022 Foursquare Labs, Inc. All Rights Reserved.\n\nimport {ColumnTypeBadge} from '@sqlrooms/data-table';\nimport {ColumnNodeObject} from '@sqlrooms/duckdb';\nimport {CopyIcon} from 'lucide-react';\nimport {FC} from 'react';\nimport {BaseTreeNode} from './BaseTreeNode';\nimport {\n TreeNodeActionsMenu,\n TreeNodeActionsMenuItem,\n} from './TreeNodeActionsMenu';\n\nexport const ColumnTreeNode: FC<{\n className?: string;\n nodeObject: ColumnNodeObject;\n additionalMenuItems?: React.ReactNode;\n}> = (props) => {\n const {className, nodeObject, additionalMenuItems} = props;\n return (\n <BaseTreeNode asChild className={className} nodeObject={nodeObject}>\n <div className=\"flex w-full items-center space-x-2\">\n <ColumnTypeBadge\n className=\"opacity-50\"\n columnType={nodeObject.columnType}\n typeCategory={nodeObject.columnTypeCategory}\n />\n <span className=\"text-xs\">{nodeObject.name}</span>\n </div>\n <TreeNodeActionsMenu>\n <TreeNodeActionsMenuItem\n onClick={() => navigator.clipboard.writeText(nodeObject.name)}\n >\n <CopyIcon width=\"15px\" />\n Copy column name\n </TreeNodeActionsMenuItem>\n {additionalMenuItems}\n </TreeNodeActionsMenu>\n </BaseTreeNode>\n );\n};\n"]}
|
|
@@ -0,0 +1,8 @@
|
|
|
1
|
+
import { DatabaseNodeObject } from '@sqlrooms/duckdb';
|
|
2
|
+
import { FC } from 'react';
|
|
3
|
+
export declare const DatabaseTreeNode: FC<{
|
|
4
|
+
className?: string;
|
|
5
|
+
nodeObject: DatabaseNodeObject;
|
|
6
|
+
additionalMenuItems?: React.ReactNode;
|
|
7
|
+
}>;
|
|
8
|
+
//# sourceMappingURL=DatabaseTreeNode.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"DatabaseTreeNode.d.ts","sourceRoot":"","sources":["../../src/nodes/DatabaseTreeNode.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAC,kBAAkB,EAAC,MAAM,kBAAkB,CAAC;AAEpD,OAAO,EAAC,EAAE,EAAC,MAAM,OAAO,CAAC;AAOzB,eAAO,MAAM,gBAAgB,EAAE,EAAE,CAAC;IAChC,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,UAAU,EAAE,kBAAkB,CAAC;IAC/B,mBAAmB,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;CACvC,CAmBA,CAAC"}
|
|
@@ -0,0 +1,9 @@
|
|
|
1
|
+
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
|
+
import { CopyIcon, DatabaseIcon } from 'lucide-react';
|
|
3
|
+
import { BaseTreeNode } from './BaseTreeNode';
|
|
4
|
+
import { TreeNodeActionsMenu, TreeNodeActionsMenuItem, } from './TreeNodeActionsMenu';
|
|
5
|
+
export const DatabaseTreeNode = (props) => {
|
|
6
|
+
const { className, nodeObject, additionalMenuItems } = props;
|
|
7
|
+
return (_jsxs(BaseTreeNode, { asChild: true, className: className, nodeObject: nodeObject, children: [_jsxs("div", { className: "flex w-full items-center space-x-2", children: [_jsx(DatabaseIcon, { size: "16px", className: "shrink-0 text-green-500" }), _jsx("span", { className: "text-sm", children: nodeObject.name })] }), _jsxs(TreeNodeActionsMenu, { children: [_jsxs(TreeNodeActionsMenuItem, { onClick: () => navigator.clipboard.writeText(nodeObject.name), children: [_jsx(CopyIcon, { width: "15px" }), "Copy database name"] }), additionalMenuItems] })] }));
|
|
8
|
+
};
|
|
9
|
+
//# sourceMappingURL=DatabaseTreeNode.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"DatabaseTreeNode.js","sourceRoot":"","sources":["../../src/nodes/DatabaseTreeNode.tsx"],"names":[],"mappings":";AAGA,OAAO,EAAC,QAAQ,EAAE,YAAY,EAAC,MAAM,cAAc,CAAC;AAEpD,OAAO,EAAC,YAAY,EAAC,MAAM,gBAAgB,CAAC;AAC5C,OAAO,EACL,mBAAmB,EACnB,uBAAuB,GACxB,MAAM,uBAAuB,CAAC;AAE/B,MAAM,CAAC,MAAM,gBAAgB,GAIxB,CAAC,KAAK,EAAE,EAAE;IACb,MAAM,EAAC,SAAS,EAAE,UAAU,EAAE,mBAAmB,EAAC,GAAG,KAAK,CAAC;IAC3D,OAAO,CACL,MAAC,YAAY,IAAC,OAAO,QAAC,SAAS,EAAE,SAAS,EAAE,UAAU,EAAE,UAAU,aAChE,eAAK,SAAS,EAAC,oCAAoC,aACjD,KAAC,YAAY,IAAC,IAAI,EAAC,MAAM,EAAC,SAAS,EAAC,yBAAyB,GAAG,EAChE,eAAM,SAAS,EAAC,SAAS,YAAE,UAAU,CAAC,IAAI,GAAQ,IAC9C,EACN,MAAC,mBAAmB,eAClB,MAAC,uBAAuB,IACtB,OAAO,EAAE,GAAG,EAAE,CAAC,SAAS,CAAC,SAAS,CAAC,SAAS,CAAC,UAAU,CAAC,IAAI,CAAC,aAE7D,KAAC,QAAQ,IAAC,KAAK,EAAC,MAAM,GAAG,0BAED,EACzB,mBAAmB,IACA,IACT,CAChB,CAAC;AACJ,CAAC,CAAC","sourcesContent":["// Copyright 2022 Foursquare Labs, Inc. All Rights Reserved.\n\nimport {DatabaseNodeObject} from '@sqlrooms/duckdb';\nimport {CopyIcon, DatabaseIcon} from 'lucide-react';\nimport {FC} from 'react';\nimport {BaseTreeNode} from './BaseTreeNode';\nimport {\n TreeNodeActionsMenu,\n TreeNodeActionsMenuItem,\n} from './TreeNodeActionsMenu';\n\nexport const DatabaseTreeNode: FC<{\n className?: string;\n nodeObject: DatabaseNodeObject;\n additionalMenuItems?: React.ReactNode;\n}> = (props) => {\n const {className, nodeObject, additionalMenuItems} = props;\n return (\n <BaseTreeNode asChild className={className} nodeObject={nodeObject}>\n <div className=\"flex w-full items-center space-x-2\">\n <DatabaseIcon size=\"16px\" className=\"shrink-0 text-green-500\" />\n <span className=\"text-sm\">{nodeObject.name}</span>\n </div>\n <TreeNodeActionsMenu>\n <TreeNodeActionsMenuItem\n onClick={() => navigator.clipboard.writeText(nodeObject.name)}\n >\n <CopyIcon width=\"15px\" />\n Copy database name\n </TreeNodeActionsMenuItem>\n {additionalMenuItems}\n </TreeNodeActionsMenu>\n </BaseTreeNode>\n );\n};\n"]}
|
|
@@ -0,0 +1,8 @@
|
|
|
1
|
+
import { SchemaNodeObject } from '@sqlrooms/duckdb';
|
|
2
|
+
import { FC } from 'react';
|
|
3
|
+
export declare const SchemaTreeNode: FC<{
|
|
4
|
+
className?: string;
|
|
5
|
+
nodeObject: SchemaNodeObject;
|
|
6
|
+
additionalMenuItems?: React.ReactNode;
|
|
7
|
+
}>;
|
|
8
|
+
//# sourceMappingURL=SchemaTreeNode.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"SchemaTreeNode.d.ts","sourceRoot":"","sources":["../../src/nodes/SchemaTreeNode.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAC,gBAAgB,EAAC,MAAM,kBAAkB,CAAC;AAElD,OAAO,EAAC,EAAE,EAAC,MAAM,OAAO,CAAC;AAOzB,eAAO,MAAM,cAAc,EAAE,EAAE,CAAC;IAC9B,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,UAAU,EAAE,gBAAgB,CAAC;IAC7B,mBAAmB,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;CACvC,CAmBA,CAAC"}
|
|
@@ -0,0 +1,9 @@
|
|
|
1
|
+
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
|
+
import { CopyIcon, FolderIcon } from 'lucide-react';
|
|
3
|
+
import { BaseTreeNode } from './BaseTreeNode';
|
|
4
|
+
import { TreeNodeActionsMenu, TreeNodeActionsMenuItem, } from './TreeNodeActionsMenu';
|
|
5
|
+
export const SchemaTreeNode = (props) => {
|
|
6
|
+
const { className, nodeObject, additionalMenuItems } = props;
|
|
7
|
+
return (_jsxs(BaseTreeNode, { asChild: true, className: className, nodeObject: nodeObject, children: [_jsxs("div", { className: "flex w-full items-center space-x-2", children: [_jsx(FolderIcon, { size: "16px", className: "shrink-0 text-yellow-500" }), _jsx("span", { className: "text-sm", children: nodeObject.name })] }), _jsxs(TreeNodeActionsMenu, { children: [_jsxs(TreeNodeActionsMenuItem, { onClick: () => navigator.clipboard.writeText(nodeObject.name), children: [_jsx(CopyIcon, { width: "15px" }), "Copy schema name"] }), additionalMenuItems] })] }));
|
|
8
|
+
};
|
|
9
|
+
//# sourceMappingURL=SchemaTreeNode.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"SchemaTreeNode.js","sourceRoot":"","sources":["../../src/nodes/SchemaTreeNode.tsx"],"names":[],"mappings":";AAGA,OAAO,EAAC,QAAQ,EAAE,UAAU,EAAC,MAAM,cAAc,CAAC;AAElD,OAAO,EAAC,YAAY,EAAC,MAAM,gBAAgB,CAAC;AAC5C,OAAO,EACL,mBAAmB,EACnB,uBAAuB,GACxB,MAAM,uBAAuB,CAAC;AAE/B,MAAM,CAAC,MAAM,cAAc,GAItB,CAAC,KAAK,EAAE,EAAE;IACb,MAAM,EAAC,SAAS,EAAE,UAAU,EAAE,mBAAmB,EAAC,GAAG,KAAK,CAAC;IAC3D,OAAO,CACL,MAAC,YAAY,IAAC,OAAO,QAAC,SAAS,EAAE,SAAS,EAAE,UAAU,EAAE,UAAU,aAChE,eAAK,SAAS,EAAC,oCAAoC,aACjD,KAAC,UAAU,IAAC,IAAI,EAAC,MAAM,EAAC,SAAS,EAAC,0BAA0B,GAAG,EAC/D,eAAM,SAAS,EAAC,SAAS,YAAE,UAAU,CAAC,IAAI,GAAQ,IAC9C,EACN,MAAC,mBAAmB,eAClB,MAAC,uBAAuB,IACtB,OAAO,EAAE,GAAG,EAAE,CAAC,SAAS,CAAC,SAAS,CAAC,SAAS,CAAC,UAAU,CAAC,IAAI,CAAC,aAE7D,KAAC,QAAQ,IAAC,KAAK,EAAC,MAAM,GAAG,wBAED,EACzB,mBAAmB,IACA,IACT,CAChB,CAAC;AACJ,CAAC,CAAC","sourcesContent":["// Copyright 2022 Foursquare Labs, Inc. All Rights Reserved.\n\nimport {SchemaNodeObject} from '@sqlrooms/duckdb';\nimport {CopyIcon, FolderIcon} from 'lucide-react';\nimport {FC} from 'react';\nimport {BaseTreeNode} from './BaseTreeNode';\nimport {\n TreeNodeActionsMenu,\n TreeNodeActionsMenuItem,\n} from './TreeNodeActionsMenu';\n\nexport const SchemaTreeNode: FC<{\n className?: string;\n nodeObject: SchemaNodeObject;\n additionalMenuItems?: React.ReactNode;\n}> = (props) => {\n const {className, nodeObject, additionalMenuItems} = props;\n return (\n <BaseTreeNode asChild className={className} nodeObject={nodeObject}>\n <div className=\"flex w-full items-center space-x-2\">\n <FolderIcon size=\"16px\" className=\"shrink-0 text-yellow-500\" />\n <span className=\"text-sm\">{nodeObject.name}</span>\n </div>\n <TreeNodeActionsMenu>\n <TreeNodeActionsMenuItem\n onClick={() => navigator.clipboard.writeText(nodeObject.name)}\n >\n <CopyIcon width=\"15px\" />\n Copy schema name\n </TreeNodeActionsMenuItem>\n {additionalMenuItems}\n </TreeNodeActionsMenu>\n </BaseTreeNode>\n );\n};\n"]}
|
|
@@ -0,0 +1,9 @@
|
|
|
1
|
+
import { TableNodeObject } from '@sqlrooms/duckdb';
|
|
2
|
+
import { FC } from 'react';
|
|
3
|
+
export declare const defaultRenderTableNodeMenuItems: (nodeObject: TableNodeObject) => import("react/jsx-runtime").JSX.Element;
|
|
4
|
+
export declare const TableTreeNode: FC<{
|
|
5
|
+
className?: string;
|
|
6
|
+
nodeObject: TableNodeObject;
|
|
7
|
+
renderMenuItems?: (nodeObject: TableNodeObject) => React.ReactNode;
|
|
8
|
+
}>;
|
|
9
|
+
//# sourceMappingURL=TableTreeNode.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"TableTreeNode.d.ts","sourceRoot":"","sources":["../../src/nodes/TableTreeNode.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAC,eAAe,EAAC,MAAM,kBAAkB,CAAC;AAEjD,OAAO,EAAC,EAAE,EAAC,MAAM,OAAO,CAAC;AAOzB,eAAO,MAAM,+BAA+B,GAC1C,YAAY,eAAe,4CAqC5B,CAAC;AAEF,eAAO,MAAM,aAAa,EAAE,EAAE,CAAC;IAC7B,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,UAAU,EAAE,eAAe,CAAC;IAC5B,eAAe,CAAC,EAAE,CAAC,UAAU,EAAE,eAAe,KAAK,KAAK,CAAC,SAAS,CAAC;CACpE,CAeA,CAAC"}
|
|
@@ -0,0 +1,26 @@
|
|
|
1
|
+
import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
|
|
2
|
+
import { CopyIcon, SquareTerminalIcon, TableIcon } from 'lucide-react';
|
|
3
|
+
import { BaseTreeNode } from './BaseTreeNode';
|
|
4
|
+
import { TreeNodeActionsMenu, TreeNodeActionsMenuItem, } from './TreeNodeActionsMenu';
|
|
5
|
+
export const defaultRenderTableNodeMenuItems = (nodeObject) => {
|
|
6
|
+
const { database, schema, name } = nodeObject;
|
|
7
|
+
return (_jsxs(_Fragment, { children: [_jsxs(TreeNodeActionsMenuItem, { onClick: (evt) => {
|
|
8
|
+
evt.stopPropagation();
|
|
9
|
+
navigator.clipboard.writeText(nodeObject.schema == 'main'
|
|
10
|
+
? nodeObject.name
|
|
11
|
+
: `${nodeObject.schema}.${nodeObject.name}`);
|
|
12
|
+
}, children: [_jsx(CopyIcon, { width: "15px" }), "Copy table name"] }), _jsxs(TreeNodeActionsMenuItem, { onClick: (evt) => {
|
|
13
|
+
evt.stopPropagation();
|
|
14
|
+
navigator.clipboard.writeText([
|
|
15
|
+
`SELECT * FROM `,
|
|
16
|
+
database === 'memory' ? '' : `${database}.`,
|
|
17
|
+
schema === 'main' ? '' : `${schema}.`,
|
|
18
|
+
name,
|
|
19
|
+
].join(''));
|
|
20
|
+
}, children: [_jsx(SquareTerminalIcon, { width: "15px" }), "Copy SELECT query"] })] }));
|
|
21
|
+
};
|
|
22
|
+
export const TableTreeNode = (props) => {
|
|
23
|
+
const { className, nodeObject, renderMenuItems = defaultRenderTableNodeMenuItems, } = props;
|
|
24
|
+
return (_jsxs(BaseTreeNode, { asChild: true, className: className, nodeObject: nodeObject, children: [_jsxs("div", { className: "flex w-full items-center space-x-2", children: [_jsx(TableIcon, { size: "16px", className: "shrink-0 text-blue-500" }), _jsx("span", { className: "text-sm", children: nodeObject.name })] }), _jsx(TreeNodeActionsMenu, { children: renderMenuItems(nodeObject) })] }));
|
|
25
|
+
};
|
|
26
|
+
//# sourceMappingURL=TableTreeNode.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"TableTreeNode.js","sourceRoot":"","sources":["../../src/nodes/TableTreeNode.tsx"],"names":[],"mappings":";AAGA,OAAO,EAAC,QAAQ,EAAE,kBAAkB,EAAE,SAAS,EAAC,MAAM,cAAc,CAAC;AAErE,OAAO,EAAC,YAAY,EAAC,MAAM,gBAAgB,CAAC;AAC5C,OAAO,EACL,mBAAmB,EACnB,uBAAuB,GACxB,MAAM,uBAAuB,CAAC;AAE/B,MAAM,CAAC,MAAM,+BAA+B,GAAG,CAC7C,UAA2B,EAC3B,EAAE;IACF,MAAM,EAAC,QAAQ,EAAE,MAAM,EAAE,IAAI,EAAC,GAAG,UAAU,CAAC;IAC5C,OAAO,CACL,8BACE,MAAC,uBAAuB,IACtB,OAAO,EAAE,CAAC,GAAG,EAAE,EAAE;oBACf,GAAG,CAAC,eAAe,EAAE,CAAC;oBACtB,SAAS,CAAC,SAAS,CAAC,SAAS,CAC3B,UAAU,CAAC,MAAM,IAAI,MAAM;wBACzB,CAAC,CAAC,UAAU,CAAC,IAAI;wBACjB,CAAC,CAAC,GAAG,UAAU,CAAC,MAAM,IAAI,UAAU,CAAC,IAAI,EAAE,CAC9C,CAAC;gBACJ,CAAC,aAED,KAAC,QAAQ,IAAC,KAAK,EAAC,MAAM,GAAG,uBAED,EAE1B,MAAC,uBAAuB,IACtB,OAAO,EAAE,CAAC,GAAG,EAAE,EAAE;oBACf,GAAG,CAAC,eAAe,EAAE,CAAC;oBACtB,SAAS,CAAC,SAAS,CAAC,SAAS,CAC3B;wBACE,gBAAgB;wBAChB,QAAQ,KAAK,QAAQ,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,GAAG,QAAQ,GAAG;wBAC3C,MAAM,KAAK,MAAM,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,GAAG,MAAM,GAAG;wBACrC,IAAI;qBACL,CAAC,IAAI,CAAC,EAAE,CAAC,CACX,CAAC;gBACJ,CAAC,aAED,KAAC,kBAAkB,IAAC,KAAK,EAAC,MAAM,GAAG,yBAEX,IACzB,CACJ,CAAC;AACJ,CAAC,CAAC;AAEF,MAAM,CAAC,MAAM,aAAa,GAIrB,CAAC,KAAK,EAAE,EAAE;IACb,MAAM,EACJ,SAAS,EACT,UAAU,EACV,eAAe,GAAG,+BAA+B,GAClD,GAAG,KAAK,CAAC;IACV,OAAO,CACL,MAAC,YAAY,IAAC,OAAO,QAAC,SAAS,EAAE,SAAS,EAAE,UAAU,EAAE,UAAU,aAChE,eAAK,SAAS,EAAC,oCAAoC,aACjD,KAAC,SAAS,IAAC,IAAI,EAAC,MAAM,EAAC,SAAS,EAAC,wBAAwB,GAAG,EAC5D,eAAM,SAAS,EAAC,SAAS,YAAE,UAAU,CAAC,IAAI,GAAQ,IAC9C,EACN,KAAC,mBAAmB,cAAE,eAAe,CAAC,UAAU,CAAC,GAAuB,IAC3D,CAChB,CAAC;AACJ,CAAC,CAAC","sourcesContent":["// Copyright 2022 Foursquare Labs, Inc. All Rights Reserved.\n\nimport {TableNodeObject} from '@sqlrooms/duckdb';\nimport {CopyIcon, SquareTerminalIcon, TableIcon} from 'lucide-react';\nimport {FC} from 'react';\nimport {BaseTreeNode} from './BaseTreeNode';\nimport {\n TreeNodeActionsMenu,\n TreeNodeActionsMenuItem,\n} from './TreeNodeActionsMenu';\n\nexport const defaultRenderTableNodeMenuItems = (\n nodeObject: TableNodeObject,\n) => {\n const {database, schema, name} = nodeObject;\n return (\n <>\n <TreeNodeActionsMenuItem\n onClick={(evt) => {\n evt.stopPropagation();\n navigator.clipboard.writeText(\n nodeObject.schema == 'main'\n ? nodeObject.name\n : `${nodeObject.schema}.${nodeObject.name}`,\n );\n }}\n >\n <CopyIcon width=\"15px\" />\n Copy table name\n </TreeNodeActionsMenuItem>\n\n <TreeNodeActionsMenuItem\n onClick={(evt) => {\n evt.stopPropagation();\n navigator.clipboard.writeText(\n [\n `SELECT * FROM `,\n database === 'memory' ? '' : `${database}.`,\n schema === 'main' ? '' : `${schema}.`,\n name,\n ].join(''),\n );\n }}\n >\n <SquareTerminalIcon width=\"15px\" />\n Copy SELECT query\n </TreeNodeActionsMenuItem>\n </>\n );\n};\n\nexport const TableTreeNode: FC<{\n className?: string;\n nodeObject: TableNodeObject;\n renderMenuItems?: (nodeObject: TableNodeObject) => React.ReactNode;\n}> = (props) => {\n const {\n className,\n nodeObject,\n renderMenuItems = defaultRenderTableNodeMenuItems,\n } = props;\n return (\n <BaseTreeNode asChild className={className} nodeObject={nodeObject}>\n <div className=\"flex w-full items-center space-x-2\">\n <TableIcon size=\"16px\" className=\"shrink-0 text-blue-500\" />\n <span className=\"text-sm\">{nodeObject.name}</span>\n </div>\n <TreeNodeActionsMenu>{renderMenuItems(nodeObject)}</TreeNodeActionsMenu>\n </BaseTreeNode>\n );\n};\n"]}
|
|
@@ -0,0 +1,19 @@
|
|
|
1
|
+
import { FC, PropsWithChildren } from 'react';
|
|
2
|
+
export type TreeNodeActionsMenuProps = PropsWithChildren<{
|
|
3
|
+
className?: string;
|
|
4
|
+
}>;
|
|
5
|
+
/**
|
|
6
|
+
* Component that renders a tree node "more actions" menu.
|
|
7
|
+
* The menu items are passed as children.
|
|
8
|
+
*
|
|
9
|
+
* The menu is hidden by default and is shown when the user hovers over the node.
|
|
10
|
+
* For this to work the parent element must have the `group` class.
|
|
11
|
+
* It should also have classes `relative overflow-hidden`.
|
|
12
|
+
*
|
|
13
|
+
* @param children - The menu items.
|
|
14
|
+
*/
|
|
15
|
+
export declare const TreeNodeActionsMenu: FC<TreeNodeActionsMenuProps>;
|
|
16
|
+
export declare const TreeNodeActionsMenuItem: import("react").ForwardRefExoticComponent<Omit<Omit<import("@radix-ui/react-dropdown-menu").DropdownMenuItemProps & import("react").RefAttributes<HTMLDivElement>, "ref"> & {
|
|
17
|
+
inset?: boolean;
|
|
18
|
+
} & import("react").RefAttributes<HTMLDivElement>, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
|
|
19
|
+
//# sourceMappingURL=TreeNodeActionsMenu.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"TreeNodeActionsMenu.d.ts","sourceRoot":"","sources":["../../src/nodes/TreeNodeActionsMenu.tsx"],"names":[],"mappings":"AASA,OAAO,EAGL,EAAE,EAEF,iBAAiB,EAClB,MAAM,OAAO,CAAC;AAGf,MAAM,MAAM,wBAAwB,GAAG,iBAAiB,CAAC;IACvD,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB,CAAC,CAAC;AAEH;;;;;;;;;GASG;AACH,eAAO,MAAM,mBAAmB,EAAE,EAAE,CAAC,wBAAwB,CAgB5D,CAAC;AAEF,eAAO,MAAM,uBAAuB;;0GASlC,CAAC"}
|
|
@@ -0,0 +1,22 @@
|
|
|
1
|
+
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
|
+
// Copyright 2022 Foursquare Labs, Inc. All Rights Reserved.
|
|
3
|
+
import { DropdownMenu, DropdownMenuTrigger, DropdownMenuContent, DropdownMenuItem, cn, } from '@sqlrooms/ui';
|
|
4
|
+
import { forwardRef, } from 'react';
|
|
5
|
+
import { EllipsisVerticalIcon } from 'lucide-react';
|
|
6
|
+
/**
|
|
7
|
+
* Component that renders a tree node "more actions" menu.
|
|
8
|
+
* The menu items are passed as children.
|
|
9
|
+
*
|
|
10
|
+
* The menu is hidden by default and is shown when the user hovers over the node.
|
|
11
|
+
* For this to work the parent element must have the `group` class.
|
|
12
|
+
* It should also have classes `relative overflow-hidden`.
|
|
13
|
+
*
|
|
14
|
+
* @param children - The menu items.
|
|
15
|
+
*/
|
|
16
|
+
export const TreeNodeActionsMenu = (props) => {
|
|
17
|
+
const { children } = props;
|
|
18
|
+
return (_jsx("div", { className: "absolute right-0 top-[1px] opacity-0 outline-none group-hover:opacity-100", children: _jsxs(DropdownMenu, { children: [_jsx(DropdownMenuTrigger, { asChild: true, children: _jsx("div", { className: "hover:bg-foreground/10 flex h-5 w-7 items-center justify-center p-0 outline-none transition-colors", children: _jsx(EllipsisVerticalIcon, { size: "16px" }) }) }), _jsx(DropdownMenuContent, { align: "start", side: "bottom", children: children })] }) }));
|
|
19
|
+
};
|
|
20
|
+
export const TreeNodeActionsMenuItem = forwardRef(({ className, ...props }, ref) => (_jsx(DropdownMenuItem, { ref: ref, className: cn('gap-2 text-xs', className), ...props })));
|
|
21
|
+
TreeNodeActionsMenuItem.displayName = 'TreeNodeActionsMenuItem';
|
|
22
|
+
//# sourceMappingURL=TreeNodeActionsMenu.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"TreeNodeActionsMenu.js","sourceRoot":"","sources":["../../src/nodes/TreeNodeActionsMenu.tsx"],"names":[],"mappings":";AAAA,4DAA4D;AAE5D,OAAO,EACL,YAAY,EACZ,mBAAmB,EACnB,mBAAmB,EACnB,gBAAgB,EAChB,EAAE,GACH,MAAM,cAAc,CAAC;AACtB,OAAO,EAIL,UAAU,GAEX,MAAM,OAAO,CAAC;AACf,OAAO,EAAC,oBAAoB,EAAC,MAAM,cAAc,CAAC;AAMlD;;;;;;;;;GASG;AACH,MAAM,CAAC,MAAM,mBAAmB,GAAiC,CAAC,KAAK,EAAE,EAAE;IACzE,MAAM,EAAC,QAAQ,EAAC,GAAG,KAAK,CAAC;IACzB,OAAO,CACL,cAAK,SAAS,EAAC,2EAA2E,YACxF,MAAC,YAAY,eACX,KAAC,mBAAmB,IAAC,OAAO,kBAC1B,cAAK,SAAS,EAAC,oGAAoG,YACjH,KAAC,oBAAoB,IAAC,IAAI,EAAC,MAAM,GAAG,GAChC,GACc,EACtB,KAAC,mBAAmB,IAAC,KAAK,EAAC,OAAO,EAAC,IAAI,EAAC,QAAQ,YAC7C,QAAQ,GACW,IACT,GACX,CACP,CAAC;AACJ,CAAC,CAAC;AAEF,MAAM,CAAC,MAAM,uBAAuB,GAAG,UAAU,CAG/C,CAAC,EAAC,SAAS,EAAE,GAAG,KAAK,EAAC,EAAE,GAAG,EAAE,EAAE,CAAC,CAChC,KAAC,gBAAgB,IACf,GAAG,EAAE,GAAG,EACR,SAAS,EAAE,EAAE,CAAC,eAAe,EAAE,SAAS,CAAC,KACrC,KAAK,GACT,CACH,CAAC,CAAC;AACH,uBAAuB,CAAC,WAAW,GAAG,yBAAyB,CAAC","sourcesContent":["// Copyright 2022 Foursquare Labs, Inc. All Rights Reserved.\n\nimport {\n DropdownMenu,\n DropdownMenuTrigger,\n DropdownMenuContent,\n DropdownMenuItem,\n cn,\n} from '@sqlrooms/ui';\nimport {\n ComponentPropsWithoutRef,\n ElementRef,\n FC,\n forwardRef,\n PropsWithChildren,\n} from 'react';\nimport {EllipsisVerticalIcon} from 'lucide-react';\n\nexport type TreeNodeActionsMenuProps = PropsWithChildren<{\n className?: string;\n}>;\n\n/**\n * Component that renders a tree node \"more actions\" menu.\n * The menu items are passed as children.\n *\n * The menu is hidden by default and is shown when the user hovers over the node.\n * For this to work the parent element must have the `group` class.\n * It should also have classes `relative overflow-hidden`.\n *\n * @param children - The menu items.\n */\nexport const TreeNodeActionsMenu: FC<TreeNodeActionsMenuProps> = (props) => {\n const {children} = props;\n return (\n <div className=\"absolute right-0 top-[1px] opacity-0 outline-none group-hover:opacity-100\">\n <DropdownMenu>\n <DropdownMenuTrigger asChild>\n <div className=\"hover:bg-foreground/10 flex h-5 w-7 items-center justify-center p-0 outline-none transition-colors\">\n <EllipsisVerticalIcon size=\"16px\" />\n </div>\n </DropdownMenuTrigger>\n <DropdownMenuContent align=\"start\" side=\"bottom\">\n {children}\n </DropdownMenuContent>\n </DropdownMenu>\n </div>\n );\n};\n\nexport const TreeNodeActionsMenuItem = forwardRef<\n ElementRef<typeof DropdownMenuItem>,\n ComponentPropsWithoutRef<typeof DropdownMenuItem>\n>(({className, ...props}, ref) => (\n <DropdownMenuItem\n ref={ref}\n className={cn('gap-2 text-xs', className)}\n {...props}\n />\n));\nTreeNodeActionsMenuItem.displayName = 'TreeNodeActionsMenuItem';\n"]}
|
package/package.json
ADDED
|
@@ -0,0 +1,41 @@
|
|
|
1
|
+
{
|
|
2
|
+
"name": "@sqlrooms/schema-tree",
|
|
3
|
+
"version": "0.16.0",
|
|
4
|
+
"author": "Ilya Boyandin <ilya@boyandin.me>",
|
|
5
|
+
"license": "MIT",
|
|
6
|
+
"repository": {
|
|
7
|
+
"type": "git",
|
|
8
|
+
"url": "https://github.com/sqlrooms/sqlrooms.git"
|
|
9
|
+
},
|
|
10
|
+
"files": [
|
|
11
|
+
"dist"
|
|
12
|
+
],
|
|
13
|
+
"publishConfig": {
|
|
14
|
+
"access": "public"
|
|
15
|
+
},
|
|
16
|
+
"main": "dist/index.js",
|
|
17
|
+
"types": "dist/index.d.ts",
|
|
18
|
+
"module": "dist/index.js",
|
|
19
|
+
"type": "module",
|
|
20
|
+
"scripts": {
|
|
21
|
+
"dev": "tsc -w",
|
|
22
|
+
"build": "tsc",
|
|
23
|
+
"lint": "eslint .",
|
|
24
|
+
"typedoc": "typedoc"
|
|
25
|
+
},
|
|
26
|
+
"dependencies": {
|
|
27
|
+
"@sqlrooms/data-table": "0.16.0",
|
|
28
|
+
"@sqlrooms/duckdb": "0.16.0",
|
|
29
|
+
"@sqlrooms/ui": "0.16.0",
|
|
30
|
+
"lucide-react": "^0.474.0"
|
|
31
|
+
},
|
|
32
|
+
"peerDependencies": {
|
|
33
|
+
"react": "*",
|
|
34
|
+
"react-dom": "*"
|
|
35
|
+
},
|
|
36
|
+
"devDependencies": {
|
|
37
|
+
"@types/react": "19.1.7",
|
|
38
|
+
"@types/react-dom": "^18.3.7"
|
|
39
|
+
},
|
|
40
|
+
"gitHead": "94dfdc97417dd715b9d6886122a3944b789b0b13"
|
|
41
|
+
}
|