@hpcc-js/react 3.2.1 → 3.2.3

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@hpcc-js/react",
-    "version": "3.2.1",
+    "version": "3.2.3",
     "description": "hpcc-js - Viz React",
     "type": "module",
     "main": "./dist/index.umd.cjs",
@@ -37,12 +37,12 @@
         "update-major": "npx --yes npm-check-updates -u"
     },
     "dependencies": {
-        "@hpcc-js/common": "^3.3.0"
+        "@hpcc-js/common": "^3.3.2"
     },
     "devDependencies": {
-        "@hpcc-js/esbuild-plugins": "^1.4.0",
-        "@preact/preset-vite": "2.9.2",
-        "preact": "10.25.0"
+        "@hpcc-js/esbuild-plugins": "^1.4.2",
+        "@preact/preset-vite": "2.10.1",
+        "preact": "10.26.5"
     },
     "repository": {
         "type": "git",
@@ -55,5 +55,5 @@
         "url": "https://github.com/hpcc-systems/Visualization/issues"
     },
     "homepage": "https://github.com/hpcc-systems/Visualization",
-    "gitHead": "ed4453ec6a4a8af9c0beb11b46c7f4365bc0669e"
+    "gitHead": "c54b3bd37ed839305001ba47f2657a1f8eb8628a"
 }

package/src/ImageChar.tsx

@@ -1,5 +1,4 @@
-import { FunctionComponent } from "preact";
-import { useMemo } from "preact/hooks";
+import * as PReact from "./preact-shim.ts";
 import { Utility } from "@hpcc-js/common";
 
 export interface ImageCharProps {
@@ -14,7 +13,7 @@ export interface ImageCharProps {
     fontWeight?: number;
 }
 
-export const ImageChar: FunctionComponent<ImageCharProps> = ({
+export const ImageChar: PReact.FunctionComponent<ImageCharProps> = ({
     x,
     y = 0,
     height = 12,
@@ -25,7 +24,7 @@ export const ImageChar: FunctionComponent<ImageCharProps> = ({
     fontWeight
 }) => {
 
-    const renderChar = useMemo(() => {
+    const renderChar = PReact.useMemo(() => {
         return fontFamily === "FontAwesome" ? Utility.faChar(char) : char;
     }, [char, fontFamily]);
 

package/src/edge.tsx

@@ -1,4 +1,4 @@
-import { FunctionComponent } from "preact";
+import * as PReact from "./preact-shim.ts";
 import { VertexProps } from "./vertex.tsx";
 import { Text } from "./text.tsx";
 
@@ -23,7 +23,7 @@ export interface EdgeProps<V extends VertexProps = VertexProps> {
     curveDepth?: number;
 }
 
-export const Edge: FunctionComponent<EdgeProps> = ({
+export const Edge: PReact.FunctionComponent<EdgeProps> = ({
     label,
     labelPos,
     labelFill = "black",

package/src/icon.tsx

@@ -1,4 +1,4 @@
-import { FunctionComponent } from "preact";
+import * as PReact from "./preact-shim.ts";
 import { Palette } from "@hpcc-js/common";
 import { Image } from "./image.tsx";
 import { ImageChar } from "./ImageChar.tsx";
@@ -22,7 +22,7 @@ export interface IconProps {
     shapeRendering?: "auto" | "optimizeSpeed" | "crispEdges" | "geometricPrecision";
 }
 
-export const Icon: FunctionComponent<IconProps> = ({
+export const Icon: PReact.FunctionComponent<IconProps> = ({
     shape = "circle",
     width,
     height = 32,
@@ -78,7 +78,7 @@ export interface IconsProps {
     icons: IconEx[];
 }
 
-export const Icons: FunctionComponent<IconsProps> = ({
+export const Icons: PReact.FunctionComponent<IconsProps> = ({
     icons = []
 }) => {
     const IconComponents = icons.map(cat => {

package/src/image.tsx

@@ -1,4 +1,4 @@
-import { FunctionComponent } from "preact";
+import * as PReact from "./preact-shim.ts";
 
 interface ImageProps {
     href: string;
@@ -8,7 +8,7 @@ interface ImageProps {
     yOffset?: number;
 }
 
-export const Image: FunctionComponent<ImageProps> = ({
+export const Image: PReact.FunctionComponent<ImageProps> = ({
     href,
     x,
     y = 0,

package/src/shape.tsx

@@ -1,4 +1,4 @@
-import { FunctionComponent } from "preact";
+import * as PReact from "./preact-shim.ts";
 
 interface CircleProps {
     radius?: number;
@@ -8,7 +8,7 @@ interface CircleProps {
     shapeRendering?: "auto" | "optimizeSpeed" | "crispEdges" | "geometricPrecision";
 }
 
-export const Circle: FunctionComponent<CircleProps> = ({
+export const Circle: PReact.FunctionComponent<CircleProps> = ({
     radius = 32,
     fill = "navy",
     stroke = fill,
@@ -31,7 +31,7 @@ interface SquareProps {
     shapeRendering?: "auto" | "optimizeSpeed" | "crispEdges" | "geometricPrecision";
 }
 
-export const Square: FunctionComponent<SquareProps> = ({
+export const Square: PReact.FunctionComponent<SquareProps> = ({
     radius = 30,
     cornerRadius = 0,
     fill = "white",
@@ -61,7 +61,7 @@ interface RectangleProps {
     shapeRendering?: "auto" | "optimizeSpeed" | "crispEdges" | "geometricPrecision";
 }
 
-export const Rectangle: FunctionComponent<RectangleProps> = ({
+export const Rectangle: PReact.FunctionComponent<RectangleProps> = ({
     width = 30,
     height = 30,
     cornerRadius = 0,
@@ -95,7 +95,7 @@ interface ShapeProps {
     cornerRadius?: number;
 }
 
-export const Shape: FunctionComponent<ShapeProps> = ({
+export const Shape: PReact.FunctionComponent<ShapeProps> = ({
     shape = "circle",
     height = 128,
     width,

package/src/span.tsx

@@ -1,9 +1,9 @@
-import { FunctionComponent } from "preact";
+import * as PReact from "./preact-shim.ts";
 
 export interface SpanProps {
     text: string;
 }
 
-export const Span: FunctionComponent<SpanProps> = ({
+export const Span: PReact.FunctionComponent<SpanProps> = ({
     text
 }) => <span>{text}</span>;

package/src/subgraph.tsx

@@ -1,4 +1,4 @@
-import { FunctionComponent } from "preact";
+import * as PReact from "./preact-shim.ts";
 import { Utility } from "@hpcc-js/common";
 import { Rectangle } from "./shape.tsx";
 import { Text } from "./text.tsx";
@@ -15,7 +15,7 @@ export interface SubgraphProps {
     fontFamily?: string;
 }
 
-export const Subgraph: FunctionComponent<SubgraphProps> = ({
+export const Subgraph: PReact.FunctionComponent<SubgraphProps> = ({
     text,
     width = 100,
     height = 100,

package/src/text.tsx

@@ -1,5 +1,4 @@
-import { FunctionComponent } from "preact";
-import { useCallback, useEffect, useLayoutEffect, useMemo, useState } from "preact/hooks";
+import * as PReact from "./preact-shim.ts";
 import { Utility } from "@hpcc-js/common";
 import { Icon } from "./icon.tsx";
 import { Rectangle } from "./shape.tsx";
@@ -13,7 +12,7 @@ export interface TextLineProps {
     fill?: string;
 }
 
-export const TextLine: FunctionComponent<TextLineProps> = ({
+export const TextLine: PReact.FunctionComponent<TextLineProps> = ({
     text,
     height = 12,
     anchor = "middle",
@@ -38,33 +37,33 @@ export interface TextProps {
     onSizeUpdate?: (size: { width: number, height: number }) => void;
 }
 
-export const Text: FunctionComponent<TextProps> = ({
+export const Text: PReact.FunctionComponent<TextProps> = ({
     text,
     height = 12,
     fontFamily = "Verdana",
     fill = "black",
     onSizeUpdate
 }) => {
-    const [totalWidth, setTotalWidth] = useState(0);
-    const [totalHeight, setTotalHeight] = useState(0);
+    const [totalWidth, setTotalWidth] = PReact.useState(0);
+    const [totalHeight, setTotalHeight] = PReact.useState(0);
 
-    useEffect(() => {
+    PReact.useEffect(() => {
         if (onSizeUpdate) {
             onSizeUpdate({ width: totalWidth, height: totalHeight });
         }
     }, [totalWidth, totalHeight, onSizeUpdate]);
 
-    const parts = useMemo(() => {
+    const parts = PReact.useMemo(() => {
         return text.split("\n");
     }, [text]);
 
-    useLayoutEffect(() => {
+    PReact.useLayoutEffect(() => {
         const size = Utility.textSize(parts, fontFamily, height);
         setTotalWidth(size.width);
         setTotalHeight(size.height);
     }, [fontFamily, height, parts]);
 
-    const TextLines = useMemo(() => {
+    const TextLines = PReact.useMemo(() => {
         const yOffset = -(totalHeight / 2) + (height / 2);
         return parts.map((p, i) => {
             return <g key={`key-${i}`} transform={`translate(0 ${yOffset + i * (height + 2)})`}>
@@ -95,7 +94,7 @@ export interface TextBoxProps {
     onSizeUpdate?: (size: { width: number, height: number }) => void;
 }
 
-export const TextBox: FunctionComponent<TextBoxProps> = ({
+export const TextBox: PReact.FunctionComponent<TextBoxProps> = ({
     text,
     height = 12,
     fontFamily = "Verdana",
@@ -107,16 +106,16 @@ export const TextBox: FunctionComponent<TextBoxProps> = ({
     cornerRadius = 0,
     onSizeUpdate
 }) => {
-    const [textWidth, setTextWidthUpdate] = useState(0);
-    const [textHeight, setTextHeightUpdate] = useState(0);
+    const [textWidth, setTextWidthUpdate] = PReact.useState(0);
+    const [textHeight, setTextHeightUpdate] = PReact.useState(0);
 
-    useEffect(() => {
+    PReact.useEffect(() => {
         if (onSizeUpdate) {
             onSizeUpdate({ width: textWidth, height: textHeight });
         }
     }, [textWidth, textHeight, onSizeUpdate]);
 
-    const onTextSizeUpdate = useCallback(size => {
+    const onTextSizeUpdate = PReact.useCallback(size => {
         setTextWidthUpdate(size.width);
         setTextHeightUpdate(size.height);
     }, []);
@@ -151,7 +150,7 @@ export interface LabelledRect extends TextBoxProps {
     fontSize?: number;
 }
 
-export const LabelledRect: FunctionComponent<LabelledRect> = ({
+export const LabelledRect: PReact.FunctionComponent<LabelledRect> = ({
     text,
     height = 12,
     width = 12,
@@ -166,16 +165,16 @@ export const LabelledRect: FunctionComponent<LabelledRect> = ({
     onSizeUpdate
 }) => {
 
-    const [actualWidth, setActualWidthUpdate] = useState(width);
-    const [actualHeight, setActualHeightUpdate] = useState(height);
+    const [actualWidth, setActualWidthUpdate] = PReact.useState(width);
+    const [actualHeight, setActualHeightUpdate] = PReact.useState(height);
 
-    useLayoutEffect(() => {
+    PReact.useLayoutEffect(() => {
         const size = Utility.textSize(text, fontFamily, fontSize);
         setActualWidthUpdate(size.width + padding * 2);
         setActualHeightUpdate(size.height + padding * 2);
     }, [text, fontFamily, fontSize, padding]);
 
-    useLayoutEffect(() => {
+    PReact.useLayoutEffect(() => {
         if (onSizeUpdate) {
             onSizeUpdate({ width: actualWidth, height: actualHeight });
         }
@@ -209,7 +208,7 @@ export interface IconLabelledRect extends LabelledRect {
     iconFontSize?: number;
 }
 
-export const IconLabelledRect: FunctionComponent<IconLabelledRect> = ({
+export const IconLabelledRect: PReact.FunctionComponent<IconLabelledRect> = ({
     icon,
     iconFontFamily,
     text,

package/src/vertex.tsx

@@ -1,5 +1,4 @@
-import { FunctionComponent } from "preact";
-import { useCallback, useEffect, useState } from "preact/hooks";
+import * as PReact from "./preact-shim.ts";
 import { Icon, IconProps } from "./icon.tsx";
 import { TextBox } from "./text.tsx";
 
@@ -10,7 +9,7 @@ export interface AnnotationsProps {
     stepSize?: number;
 }
 
-export const Annotations: FunctionComponent<AnnotationsProps> = ({
+export const Annotations: PReact.FunctionComponent<AnnotationsProps> = ({
     x,
     y,
     annotationIDs = [],
@@ -48,7 +47,7 @@ export interface VertexProps {
     scale?: number
 }
 
-export const Vertex: FunctionComponent<VertexProps> = ({
+export const Vertex: React.FunctionComponent<VertexProps> = ({
     categoryID = "",
     text = "",
     textHeight = 12,
@@ -71,10 +70,10 @@ export const Vertex: FunctionComponent<VertexProps> = ({
         ...icon
     };
 
-    const [textBoxWidth, setTextBoxWidthUpdate] = useState(0);
-    const [textBoxHeight, setTextBoxHeightUpdate] = useState(0);
+    const [textBoxWidth, setTextBoxWidthUpdate] = PReact.useState(0);
+    const [textBoxHeight, setTextBoxHeightUpdate] = PReact.useState(0);
 
-    useEffect(() => {
+    PReact.useEffect(() => {
         if (onSizeUpdate) {
             onSizeUpdate({ width: 0, height: 0 });
         }
@@ -90,7 +89,7 @@ export const Vertex: FunctionComponent<VertexProps> = ({
         annotationOffsetY -= textBoxHeight + textPadding;
     }
 
-    const onTextBoxSizeUpdate = useCallback(size => {
+    const onTextBoxSizeUpdate = PReact.useCallback(size => {
         setTextBoxWidthUpdate(size.width);
         setTextBoxHeightUpdate(size.height);
     }, []);

package/src/vertex2.tsx

@@ -1,11 +1,10 @@
-import { FunctionComponent } from "preact";
-import { useMemo } from "preact/hooks";
+import * as PReact from "./preact-shim.ts";
 import { Utility } from "@hpcc-js/common";
 import { Icon, IconProps } from "./icon.tsx";
 import { TextBox } from "./text.tsx";
 import { Annotations, VertexProps } from "./vertex.tsx";
 
-export const Vertex2: FunctionComponent<VertexProps> = ({
+export const Vertex2: PReact.FunctionComponent<VertexProps> = ({
     categoryID = "",
     text = "",
     textHeight = 12,
@@ -27,7 +26,7 @@ export const Vertex2: FunctionComponent<VertexProps> = ({
         ...icon
     };
     const textBoxHeight = textHeight + textPadding * 2;
-    const { width } = useMemo(() => {
+    const { width } = PReact.useMemo(() => {
         return Utility.textSize(text, textFontFamily, textHeight, false);
     }, [text, textFontFamily, textHeight]);
 

package/src/vertex3.tsx

@@ -1,5 +1,4 @@
-import { FunctionComponent } from "preact";
-import { useMemo } from "preact/hooks";
+import * as PReact from "./preact-shim.ts";
 import { Utility } from "@hpcc-js/common";
 import { Icon, IconProps } from "./icon.tsx";
 import { TextBox, TextBoxProps } from "./text.tsx";
@@ -30,7 +29,7 @@ export interface Vertex3Props extends VertexProps {
     scale?: number;
 }
 
-export const Vertex3: FunctionComponent<Vertex3Props> = ({
+export const Vertex3: PReact.FunctionComponent<Vertex3Props> = ({
     text = "",
     textHeight = 10,
     textPadding = 4,
@@ -80,7 +79,7 @@ export const Vertex3: FunctionComponent<Vertex3Props> = ({
 
     const annoOffsetY = 0;
 
-    const labelWidth = useMemo(() => {
+    const labelWidth = PReact.useMemo(() => {
         return Utility.textSize(text, textFontFamily, textHeight, false).width;
     }, [text, textFontFamily, textHeight]);
 
@@ -175,7 +174,7 @@ export const Vertex3: FunctionComponent<Vertex3Props> = ({
     </g >;
 };
 
-export const CentroidVertex3: FunctionComponent<Vertex3Props> = function ({
+export const CentroidVertex3: PReact.FunctionComponent<Vertex3Props> = function ({
     id,
     categoryID = "",
     text = "",

package/src/vertex4.tsx

@@ -1,5 +1,4 @@
-import { FunctionComponent } from "preact";
-import { useMemo } from "preact/hooks";
+import * as PReact from "./preact-shim.ts";
 import { Utility } from "@hpcc-js/common";
 import { Icon, IconProps } from "./icon.tsx";
 import { TextBox, TextBoxProps } from "./text.tsx";
@@ -33,7 +32,7 @@ export interface IVertex4 extends VertexProps {
     shapeRendering?: "auto" | "optimizeSpeed" | "crispEdges" | "geometricPrecision";
 }
 
-export const Vertex4: FunctionComponent<IVertex4> = ({
+export const Vertex4: PReact.FunctionComponent<IVertex4> = ({
     categoryID = "",
     text = "",
     textHeight = 10,
@@ -87,7 +86,7 @@ export const Vertex4: FunctionComponent<IVertex4> = ({
     };
 
     const annoOffsetY = 0;
-    const labelWidth = useMemo(() => {
+    const labelWidth = PReact.useMemo(() => {
         return Utility.textSize(text, textFontFamily, textHeight, false).width;
     }, [text, textFontFamily, textHeight]);
 
@@ -212,7 +211,7 @@ export const Vertex4: FunctionComponent<IVertex4> = ({
         ;
 };
 
-export const CentroidVertex4: FunctionComponent<IVertex4> = function ({
+export const CentroidVertex4: PReact.FunctionComponent<IVertex4> = function ({
     id,
     categoryID = "",
     text = "",

package/types/ImageChar.d.ts

@@ -1,4 +1,4 @@
-import { FunctionComponent } from "preact";
+import * as PReact from "./preact-shim.ts";
 export interface ImageCharProps {
     x?: number;
     y?: number;
@@ -10,4 +10,4 @@ export interface ImageCharProps {
     yOffset?: number;
     fontWeight?: number;
 }
-export declare const ImageChar: FunctionComponent<ImageCharProps>;
+export declare const ImageChar: PReact.FunctionComponent<ImageCharProps>;

package/types/edge.d.ts

@@ -1,4 +1,4 @@
-import { FunctionComponent } from "preact";
+import * as PReact from "./preact-shim.ts";
 import { VertexProps } from "./vertex.tsx";
 type Point = [number, number];
 export interface EdgeProps<V extends VertexProps = VertexProps> {
@@ -19,5 +19,5 @@ export interface EdgeProps<V extends VertexProps = VertexProps> {
     points?: Array<[number, number]>;
     curveDepth?: number;
 }
-export declare const Edge: FunctionComponent<EdgeProps>;
+export declare const Edge: PReact.FunctionComponent<EdgeProps>;
 export {};

package/types/icon.d.ts

@@ -1,4 +1,4 @@
-import { FunctionComponent } from "preact";
+import * as PReact from "./preact-shim.ts";
 export interface IconProps {
     shape?: "circle" | "square" | "rectangle";
     width?: number;
@@ -16,11 +16,11 @@ export interface IconProps {
     cornerRadius?: number;
     shapeRendering?: "auto" | "optimizeSpeed" | "crispEdges" | "geometricPrecision";
 }
-export declare const Icon: FunctionComponent<IconProps>;
+export declare const Icon: PReact.FunctionComponent<IconProps>;
 export interface IconEx extends IconProps {
     id: string;
 }
 export interface IconsProps {
     icons: IconEx[];
 }
-export declare const Icons: FunctionComponent<IconsProps>;
+export declare const Icons: PReact.FunctionComponent<IconsProps>;

package/types/image.d.ts

@@ -1,4 +1,4 @@
-import { FunctionComponent } from "preact";
+import * as PReact from "./preact-shim.ts";
 interface ImageProps {
     href: string;
     x?: number;
@@ -6,5 +6,5 @@ interface ImageProps {
     height?: number;
     yOffset?: number;
 }
-export declare const Image: FunctionComponent<ImageProps>;
+export declare const Image: PReact.FunctionComponent<ImageProps>;
 export {};

package/types/shape.d.ts

@@ -1,4 +1,4 @@
-import { FunctionComponent } from "preact";
+import * as PReact from "./preact-shim.ts";
 interface CircleProps {
     radius?: number;
     fill?: string;
@@ -6,7 +6,7 @@ interface CircleProps {
     strokeWidth?: number;
     shapeRendering?: "auto" | "optimizeSpeed" | "crispEdges" | "geometricPrecision";
 }
-export declare const Circle: FunctionComponent<CircleProps>;
+export declare const Circle: PReact.FunctionComponent<CircleProps>;
 interface SquareProps {
     radius?: number;
     cornerRadius?: number;
@@ -15,7 +15,7 @@ interface SquareProps {
     strokeWidth?: number;
     shapeRendering?: "auto" | "optimizeSpeed" | "crispEdges" | "geometricPrecision";
 }
-export declare const Square: FunctionComponent<SquareProps>;
+export declare const Square: PReact.FunctionComponent<SquareProps>;
 interface RectangleProps {
     width?: number;
     height?: number;
@@ -25,7 +25,7 @@ interface RectangleProps {
     strokeWidth?: number;
     shapeRendering?: "auto" | "optimizeSpeed" | "crispEdges" | "geometricPrecision";
 }
-export declare const Rectangle: FunctionComponent<RectangleProps>;
+export declare const Rectangle: PReact.FunctionComponent<RectangleProps>;
 interface ShapeProps {
     shape?: "circle" | "square" | "rectangle";
     height?: number;
@@ -36,5 +36,5 @@ interface ShapeProps {
     shapeRendering?: "auto" | "optimizeSpeed" | "crispEdges" | "geometricPrecision";
     cornerRadius?: number;
 }
-export declare const Shape: FunctionComponent<ShapeProps>;
+export declare const Shape: PReact.FunctionComponent<ShapeProps>;
 export {};

package/types/span.d.ts

@@ -1,5 +1,5 @@
-import { FunctionComponent } from "preact";
+import * as PReact from "./preact-shim.ts";
 export interface SpanProps {
     text: string;
 }
-export declare const Span: FunctionComponent<SpanProps>;
+export declare const Span: PReact.FunctionComponent<SpanProps>;

package/types/subgraph.d.ts

@@ -1,4 +1,4 @@
-import { FunctionComponent } from "preact";
+import * as PReact from "./preact-shim.ts";
 export interface SubgraphProps {
     id: string;
     origData?: any;
@@ -10,4 +10,4 @@ export interface SubgraphProps {
     fontHeight?: number;
     fontFamily?: string;
 }
-export declare const Subgraph: FunctionComponent<SubgraphProps>;
+export declare const Subgraph: PReact.FunctionComponent<SubgraphProps>;

package/types/text.d.ts

@@ -1,4 +1,4 @@
-import { FunctionComponent } from "preact";
+import * as PReact from "./preact-shim.ts";
 export interface TextLineProps {
     text: string;
     height?: number;
@@ -7,7 +7,7 @@ export interface TextLineProps {
     fontFamily?: string;
     fill?: string;
 }
-export declare const TextLine: FunctionComponent<TextLineProps>;
+export declare const TextLine: PReact.FunctionComponent<TextLineProps>;
 export interface TextProps {
     text: string;
     height?: number;
@@ -18,7 +18,7 @@ export interface TextProps {
         height: number;
     }) => void;
 }
-export declare const Text: FunctionComponent<TextProps>;
+export declare const Text: PReact.FunctionComponent<TextProps>;
 export interface TextBoxProps {
     text: string;
     height?: number;
@@ -35,15 +35,15 @@ export interface TextBoxProps {
         height: number;
     }) => void;
 }
-export declare const TextBox: FunctionComponent<TextBoxProps>;
+export declare const TextBox: PReact.FunctionComponent<TextBoxProps>;
 export interface LabelledRect extends TextBoxProps {
     width?: number;
     fontSize?: number;
 }
-export declare const LabelledRect: FunctionComponent<LabelledRect>;
+export declare const LabelledRect: PReact.FunctionComponent<LabelledRect>;
 export interface IconLabelledRect extends LabelledRect {
     icon: string;
     iconFontFamily?: string;
     iconFontSize?: number;
 }
-export declare const IconLabelledRect: FunctionComponent<IconLabelledRect>;
+export declare const IconLabelledRect: PReact.FunctionComponent<IconLabelledRect>;

package/types/vertex.d.ts

@@ -1,4 +1,4 @@
-import { FunctionComponent } from "preact";
+import * as PReact from "./preact-shim.ts";
 import { IconProps } from "./icon.tsx";
 export interface AnnotationsProps {
     x: number;
@@ -6,7 +6,7 @@ export interface AnnotationsProps {
     annotationIDs: string[];
     stepSize?: number;
 }
-export declare const Annotations: FunctionComponent<AnnotationsProps>;
+export declare const Annotations: PReact.FunctionComponent<AnnotationsProps>;
 export interface VertexProps {
     id: string | number;
     origData?: any;
@@ -29,4 +29,4 @@ export interface VertexProps {
     showLabel?: boolean;
     scale?: number;
 }
-export declare const Vertex: FunctionComponent<VertexProps>;
+export declare const Vertex: React.FunctionComponent<VertexProps>;

package/types/vertex2.d.ts

@@ -1,3 +1,3 @@
-import { FunctionComponent } from "preact";
+import * as PReact from "./preact-shim.ts";
 import { VertexProps } from "./vertex.tsx";
-export declare const Vertex2: FunctionComponent<VertexProps>;
+export declare const Vertex2: PReact.FunctionComponent<VertexProps>;

package/types/vertex3.d.ts

@@ -1,4 +1,4 @@
-import { FunctionComponent } from "preact";
+import * as PReact from "./preact-shim.ts";
 import { IconProps } from "./icon.tsx";
 import { TextBoxProps } from "./text.tsx";
 import { VertexProps } from "./vertex.tsx";
@@ -29,5 +29,5 @@ export interface Vertex3Props extends VertexProps {
     expansionIcon?: IconProps;
     scale?: number;
 }
-export declare const Vertex3: FunctionComponent<Vertex3Props>;
-export declare const CentroidVertex3: FunctionComponent<Vertex3Props>;
+export declare const Vertex3: PReact.FunctionComponent<Vertex3Props>;
+export declare const CentroidVertex3: PReact.FunctionComponent<Vertex3Props>;