@eccenca/gui-elements 24.4.1 → 25.0.0-bugfixcenterednodecontentmenuitemscmem7184.0

package/dist/types/components/Spinner/Spinner.d.ts

@@ -1,20 +1,28 @@
 import React from "react";
 import { OverlayProps as BlueprintOverlayProps, SpinnerProps as BlueprintSpinnerProps } from "@blueprintjs/core";
+import Color from "color";
+import { ButtonProps } from "./../Button/Button";
 type SpinnerPosition = "local" | "inline" | "global";
 type SpinnerSize = "tiny" | "small" | "medium" | "large" | "xlarge" | "inherit";
 type SpinnerStroke = "thin" | "medium" | "bold";
-type Intent = "inherit" | "primary" | "success" | "warning" | "danger" | "none";
 /** A spinner that is either displayed globally or locally. */
-export interface SpinnerProps extends Omit<BlueprintSpinnerProps, "size" | "intent"> {
+export interface SpinnerProps extends Omit<BlueprintSpinnerProps, "size" | "intent" | "color"> {
     /**
-     * intent value or a valid css color definition
-     * @deprecated (v25) it will allow in the future only a color value string and that for other states the intent property needs to be used
+     * Must be a valid css color definition.
+     * `intent` property will always overwrite this setting.
      */
-    color?: Intent | string;
+    color?: Color | string | "inherit";
     /**
-     * Intent state of the field item.
+     * Intent state of the spinner.
+     * When used the spinner is colored.
+     * Property overwrites `elevated` setting.
      */
-    intent?: Intent;
+    intent?: ButtonProps["intent"];
+    /**
+     * Highlight the spinner.
+     * It is displayed with accent color intent.
+     */
+    elevated?: boolean;
     /**
      * Additional CSS class names.
      */
@@ -51,12 +59,6 @@ export interface SpinnerProps extends Omit<BlueprintSpinnerProps, "size" | "inte
      * Use this property to alter the display of the backdrop used for the global spinner
      */
     overlayProps?: BlueprintOverlayProps;
-    /**
-     * Label displayed next to the spinner (planned).
-     * You can set it to document the purpose of the spinner.
-     * It is currently not supported and not displayed.
-     */
-    description?: string;
 }
-export declare const Spinner: ({ className, color, intent, position, size, stroke, showLocalBackdrop, delay, overlayProps, description, ...otherProps }: SpinnerProps) => React.JSX.Element | null;
+export declare const Spinner: ({ className, color, intent, elevated, position, size, stroke, showLocalBackdrop, delay, overlayProps, ...otherProps }: SpinnerProps) => React.JSX.Element | null;
 export default Spinner;

package/dist/types/components/Structure/TitleSubsection.d.ts

@@ -132,7 +132,7 @@ export declare const TitleSubsection: ({ children, className, useHtmlElement, ..
     onBlurCapture?: React.FocusEventHandler<HTMLElement> | undefined;
     onChange?: React.FormEventHandler<HTMLElement> | undefined;
     onChangeCapture?: React.FormEventHandler<HTMLElement> | undefined;
-    onBeforeInput?: React.FormEventHandler<HTMLElement> | undefined;
+    onBeforeInput?: React.InputEventHandler<HTMLElement> | undefined;
     onBeforeInputCapture?: React.FormEventHandler<HTMLElement> | undefined;
     onInput?: React.FormEventHandler<HTMLElement> | undefined;
     onInputCapture?: React.FormEventHandler<HTMLElement> | undefined;

package/dist/types/components/SuggestField/index.d.ts

@@ -1,4 +1,8 @@
-export * from "./SuggestField";
+export * from "./../AutocompleteField/AutoCompleteField";
+export * from "./../AutocompleteField/interfaces";
 export declare const suggestFieldUtils: {
-    createNewItemRendererFactory: (itemTextRenderer: (query: string) => string | JSX.Element, iconName?: import("../Icon/canonicalIconNames").ValidIconName | import("react").ReactElement<import("..").TestIconProps>) => (query: string, modifiers: import("..").IRenderModifiers, handleClick: import("react").MouseEventHandler<HTMLElement>) => import("react").JSX.Element;
+    createNewItemRendererFactory: (itemTextRenderer: (query: string) => string | JSX.Element, iconName?: import("../Icon/canonicalIconNames").ValidIconName | import("react").ReactElement<import("..").TestIconProps>) => (query: string, modifiers: import("./../AutocompleteField/interfaces").SuggestFieldItemRendererModifierProps, handleClick: import("react").MouseEventHandler<HTMLElement>) => import("react").JSX.Element;
+};
+export declare const autoCompleteFieldUtils: {
+    createNewItemRendererFactory: (itemTextRenderer: (query: string) => string | JSX.Element, iconName?: import("../Icon/canonicalIconNames").ValidIconName | import("react").ReactElement<import("..").TestIconProps>) => (query: string, modifiers: import("./../AutocompleteField/interfaces").SuggestFieldItemRendererModifierProps, handleClick: import("react").MouseEventHandler<HTMLElement>) => import("react").JSX.Element;
 };

package/dist/types/components/Table/Table.d.ts

@@ -1,6 +1,6 @@
 import React from "react";
 import { DataTableSize as CarbonDataTableSize, Table as CarbonTable } from "@carbon/react";
-export type TableRowHeightSize = "small" | "medium" | "large";
+type TableRowHeightSize = "small" | "medium" | "large";
 type CarbonTableProps = React.ComponentProps<typeof CarbonTable>;
 export interface TableProps extends Omit<CarbonTableProps, "size" | "overflowMenuOnHover" | "stickyHeader" | "useStaticWidth">, React.TableHTMLAttributes<HTMLTableElement> {
     /**

package/dist/types/components/Table/TableContainer.d.ts

@@ -1,10 +1,10 @@
 import React from "react";
 import { DataTableHeader as CarbonDataTableHeader, DataTableProps as CarbonDataTableProps, DataTableRow as CarbonDataTableRow } from "@carbon/react";
 import { TableContainerProps as CarbonTableContainerProps } from "@carbon/react/es/components/DataTable/TableContainer";
-import { TableRowHeightSize } from "./Table";
+import { TableProps } from "./Table";
 export interface TableDataContainerProps extends Omit<CarbonDataTableProps<Array<Omit<CarbonDataTableRow<Array<CarbonDataTableHeader>>, "cells">>, Array<CarbonDataTableHeader>>, "size" | "overflowMenuOnHover" | "stickyHeader" | "useStaticWidth">, React.TableHTMLAttributes<HTMLTableElement> {
     children(signature: any): JSX.Element;
-    size?: TableRowHeightSize;
+    size?: TableProps["size"];
 }
 export interface TableSimpleContainerProps extends Omit<CarbonTableContainerProps, "description" | "stickyHeader" | "title" | "useStaticWidth">, React.HTMLAttributes<HTMLDivElement> {
     children?: JSX.Element;

package/dist/types/components/Tabs/Tab.d.ts

@@ -29,6 +29,7 @@ export declare const transformTabProperties: ({ title, dontShrink, className, ba
     };
     "data-test-id"?: string;
     "data-testid"?: string;
+    color?: string | undefined;
     slot?: string | undefined;
     children?: React.ReactNode;
     disabled?: boolean;
@@ -67,7 +68,6 @@ export declare const transformTabProperties: ({ title, dontShrink, className, ba
     vocab?: string | undefined;
     autoCorrect?: string | undefined;
     autoSave?: string | undefined;
-    color?: string | undefined;
     itemProp?: string | undefined;
     itemScope?: boolean | undefined;
     itemType?: string | undefined;
@@ -154,7 +154,7 @@ export declare const transformTabProperties: ({ title, dontShrink, className, ba
     onBlurCapture?: React.FocusEventHandler<HTMLDivElement> | undefined;
     onChange?: React.FormEventHandler<HTMLDivElement> | undefined;
     onChangeCapture?: React.FormEventHandler<HTMLDivElement> | undefined;
-    onBeforeInput?: React.FormEventHandler<HTMLDivElement> | undefined;
+    onBeforeInput?: React.InputEventHandler<HTMLDivElement> | undefined;
     onBeforeInputCapture?: React.FormEventHandler<HTMLDivElement> | undefined;
     onInput?: React.FormEventHandler<HTMLDivElement> | undefined;
     onInputCapture?: React.FormEventHandler<HTMLDivElement> | undefined;
@@ -307,6 +307,7 @@ export declare const transformTabProperties: ({ title, dontShrink, className, ba
     style?: React.CSSProperties | undefined;
     "data-test-id"?: string;
     "data-testid"?: string;
+    color?: string | undefined;
     slot?: string | undefined;
     children?: React.ReactNode;
     disabled?: boolean;
@@ -345,7 +346,6 @@ export declare const transformTabProperties: ({ title, dontShrink, className, ba
     vocab?: string | undefined;
     autoCorrect?: string | undefined;
     autoSave?: string | undefined;
-    color?: string | undefined;
     itemProp?: string | undefined;
     itemScope?: boolean | undefined;
     itemType?: string | undefined;
@@ -432,7 +432,7 @@ export declare const transformTabProperties: ({ title, dontShrink, className, ba
     onBlurCapture?: React.FocusEventHandler<HTMLDivElement> | undefined;
     onChange?: React.FormEventHandler<HTMLDivElement> | undefined;
     onChangeCapture?: React.FormEventHandler<HTMLDivElement> | undefined;
-    onBeforeInput?: React.FormEventHandler<HTMLDivElement> | undefined;
+    onBeforeInput?: React.InputEventHandler<HTMLDivElement> | undefined;
     onBeforeInputCapture?: React.FormEventHandler<HTMLDivElement> | undefined;
     onInput?: React.FormEventHandler<HTMLDivElement> | undefined;
     onInputCapture?: React.FormEventHandler<HTMLDivElement> | undefined;

package/dist/types/components/TextField/SearchField.d.ts

@@ -1,7 +1,7 @@
 import React from "react";
 import { TestableComponent } from "../../components/interfaces";
 import { TextFieldProps } from "./TextField";
-export interface SearchFieldProps extends TestableComponent, Omit<TextFieldProps, "placeholder | hasStatePrimary | hasStateSuccess | hasStateWarning | hasStateDanger | fullWidth"> {
+export interface SearchFieldProps extends TestableComponent, Omit<TextFieldProps, "placeholder" | "fullWidth"> {
     /**
      * Placeholder text for search box.
      */

package/dist/types/components/TextReducer/TextReducer.d.ts

@@ -0,0 +1,40 @@
+import React from "react";
+import { DecodeHtmlEntitiesOptions } from "../../common";
+import { OverflowTextProps } from "./../Typography";
+export interface TextReducerProps extends Pick<React.HTMLAttributes<HTMLElement>, "children"> {
+    /**
+     * Maximum number of nodes that are used from the HTML content.
+     * An HTML element with multiple sub elements is count as only 1 node.
+     */
+    maxNodes?: number;
+    /**
+     * Set maximum string length of returned content.
+     */
+    maxLength?: number;
+    /**
+     * Wrap returned content automatically in a `OverflowText` component.
+     * This way you always will get a element returned that displays only 1 single text line.
+     */
+    useOverflowTextWrapper?: boolean;
+    /**
+     * Specify more `OverflowText` properties used when `useOverflowTextWrapper` is set to `true`.
+     */
+    overflowTextProps?: Omit<OverflowTextProps, "passDown">;
+    /**
+     * If you transform HTML markup to text then the result could contain HTML entity encoded strings.
+     * By enabling this option they are decoded back to it's original char.
+     */
+    decodeHtmlEntities?: boolean;
+    /**
+     * Set the options used to decode the HTML entities, if `decodeHtmlEntities` is enabled.
+     * Internally we use `he` library, see their [documentation on decode options](https://www.npmjs.com/package/he#hedecodehtml-options).
+     * If not set we use `{ isAttributeValue: true, strict: true }` as default value.
+     */
+    decodeHtmlEntitiesOptions?: DecodeHtmlEntitiesOptions;
+}
+/**
+ * Component to reduce HTML markup content to simple text.
+ * Display can be wrapped easily in `OverflowText`.
+ */
+export declare const TextReducer: ({ children, useOverflowTextWrapper, overflowTextProps, ...reduceToTextOptions }: TextReducerProps) => React.JSX.Element;
+export default TextReducer;

package/dist/types/components/Tooltip/Tooltip.d.ts

@@ -10,7 +10,7 @@ export interface TooltipProps extends Omit<BlueprintTooltipProps, "position"> {
     /**
      * The size specifies the dimension the tooltip overlay element can maximal grow.
      */
-    size?: "small" | "medium" | "large";
+    size?: TooltipSize;
     /**
      * The tooltip will be attached to this element when it is hovered.
      */
@@ -40,5 +40,6 @@ export interface TooltipProps extends Omit<BlueprintTooltipProps, "position"> {
      */
     swapPlaceholderDelay?: number;
 }
+export type TooltipSize = "small" | "medium" | "large";
 export declare const Tooltip: ({ children, content, className, size, addIndicator, markdownEnabler, markdownProps, usePlaceholder, swapPlaceholderDelay, hoverOpenDelay, ...otherTooltipProps }: TooltipProps) => React.JSX.Element | null;
 export default Tooltip;

package/dist/types/components/Typography/InlineText.d.ts

@@ -0,0 +1,13 @@
+import React from "react";
+import { TestableComponent } from "../interfaces";
+export interface InlineTextProps extends React.HTMLAttributes<HTMLElement>, TestableComponent {
+    /**
+     * Additional CSS class name.
+     */
+    className?: string;
+}
+/**
+ * Forces all children to be displayed as inline content.
+ */
+export declare const InlineText: ({ className, children, ...otherProps }: InlineTextProps) => React.JSX.Element;
+export default InlineText;

package/dist/types/components/Typography/OverflowText.d.ts

@@ -22,11 +22,6 @@ export interface OverflowTextProps extends React.HTMLAttributes<HTMLElement>, Te
      * HTML element that is used for the component.
      */
     useHtmlElement?: "p" | "div" | "span";
-    /**
-     * Used for all other necessary properties.
-     * @deprecated (v25) we will allow only basic HTML element properties and testing IDs
-     */
-    [key: string]: any;
 }
 /** Prevents text from overflowing. */
 export declare const OverflowText: ({ className, children, ellipsis, inline, passDown, useHtmlElement, ...otherProps }: OverflowTextProps) => React.JSX.Element;

package/dist/types/components/Typography/index.d.ts

@@ -2,3 +2,4 @@ export * from "./Highlighter";
 export * from "./HtmlContentBlock";
 export * from "./OverflowText";
 export * from "./WhiteSpaceContainer";
+export * from "./InlineText";

package/dist/types/components/VisualTour/VisualTour.d.ts

@@ -0,0 +1,39 @@
+import React from "react";
+import { ModalSize, TooltipSize } from "../../index";
+export interface VisualTourProps {
+    /** The steps of the tour. */
+    steps: VisualTourStep[];
+    /** Called when the tour is cancelled or closed at then end. This should usually remove the component from the outside. */
+    onClose: () => void;
+    /** Label of the button to close the tour. */
+    closeLabel?: string;
+    /** The label for the 'next' button. */
+    nextLabel?: string;
+    /** The label for the 'previous' button. */
+    prevLabel?: string;
+    /** The step target is usable, e.g. it can be clicked. */
+    usableStepTarget?: boolean;
+    /** Need to be set to `true` that the tour is displayed. */
+    isOpen?: boolean;
+}
+export interface VisualTourStep {
+    title: string;
+    /** The description or more elaborate content element that is shown in the modal/overlay. */
+    content: string | (() => React.JSX.Element);
+    /** Optional element that should be highlighted. The step content is displayed as a tooltip instead of a modal.
+     * In case of an array, the first match is highlighted. */
+    highlightElementQuery?: string | string[];
+    /** The texts used in the step, e.g. when custom layouts are rendered, these will be used for the text strings. */
+    texts?: Record<string, string>;
+    /** An image URL. This will be displayed in the step description. */
+    image?: string;
+    /** The size of the tooltip or modal. */
+    size?: TooltipSize | ModalSize;
+    /** The step target is usable, e.g. it can be clicked. Overwrites the setting in `<VisualTour/>`. */
+    usableStepTarget?: boolean;
+}
+/** This should be used for defining steps in a separate object/file. Use with 'satisfies' after the object definition. */
+export type VisualTourStepDefinitions = Record<string, Partial<VisualTourStep>>;
+/** A visual tour multi-step tour of the current view. */
+export declare const VisualTour: ({ steps, onClose, closeLabel, nextLabel, prevLabel, usableStepTarget, isOpen, }: VisualTourProps) => React.JSX.Element | null;
+export default VisualTour;

package/dist/types/components/index.d.ts

@@ -1,14 +1,13 @@
 export * from "./Accordion";
 export * from "./Application";
-export * from "./AutocompleteField";
-export * from "./SuggestField";
-export * from "./AutoSuggestion";
-export * from "./CodeAutocompleteField";
 export * from "./Badge/Badge";
 export * from "./Breadcrumb";
 export * from "./Button/Button";
 export * from "./Card";
+export * from "./Chat";
 export * from "./Checkbox/Checkbox";
+export * from "./CodeAutocompleteField";
+export * from "./ContentGroup/ContentGroup";
 export * from "./ContextOverlay";
 export * from "./Depiction/Depiction";
 export * from "./Dialog";
@@ -23,8 +22,7 @@ export * from "./Label/Label";
 export * from "./Link/Link";
 export * from "./List/List";
 export * from "./Menu";
-export * from "./MultiSelect/MultiSelect";
-export * from "./MultiSuggestField/MultiSuggestField";
+export * from "./MultiSuggestField";
 export * from "./Notification";
 export * from "./OverviewItem";
 export * from "./Pagination/Pagination";
@@ -38,15 +36,17 @@ export * from "./Skeleton/Skeleton";
 export * from "./Spinner/Spinner";
 export * from "./Sticky";
 export * from "./Structure";
+export * from "./SuggestField";
 export * from "./Switch/Switch";
 export * from "./Table";
 export * from "./Tabs";
 export * from "./Tag";
 export * from "./TextField";
+export * from "./TextReducer/TextReducer";
 export * from "./Toolbar";
 export * from "./Tooltip/Tooltip";
 export * from "./Tree/Tree";
 export * from "./Typography";
+export * from "./VisualTour/VisualTour";
 export * from "./Workspace";
-export * from "./ContentGroup/ContentGroup";
 export * from "./interfaces";

package/dist/types/configuration/constants.d.ts

@@ -1 +1,3 @@
 export declare const CLASSPREFIX = "eccgui";
+export declare const COLORMINDISTANCE = 10;
+export declare const COLORMINCONTRAST = 4;

package/dist/types/extensions/codemirror/CodeMirror.d.ts

@@ -4,7 +4,7 @@ import { EditorView, Rect } from "@codemirror/view";
 import { IntentTypes } from "../../common/Intent";
 import { TestableComponent } from "../../components/interfaces";
 import { SupportedCodeEditorModes } from "./hooks/useCodemirrorModeExtension.hooks";
-export interface CodeEditorProps extends TestableComponent {
+export interface CodeEditorProps extends Omit<React.HTMLAttributes<HTMLDivElement>, "translate" | "onChange" | "onKeyDown" | "onMouseDown" | "onScroll">, TestableComponent {
     setEditorView?: (editor: EditorView | undefined) => void;
     /**
      * `name` attribute of connected textarea element.
@@ -22,9 +22,8 @@ export interface CodeEditorProps extends TestableComponent {
     /**
      * Handler method to receive onChange events.
      * As input the new value is given.
-     * @deprecated (v25) use `(v: string) => void` in future
      */
-    onChange?: (v: any) => void;
+    onChange?: (v: string) => void;
     /**
      *  Called when the focus status changes
      */
@@ -66,7 +65,11 @@ export interface CodeEditorProps extends TestableComponent {
     height?: number | string;
     /** Long lines are wrapped and displayed on multiple lines */
     wrapLines?: boolean;
-    outerDivAttributes?: Omit<React.HTMLAttributes<HTMLDivElement>, "id" | "data-test-id">;
+    /**
+     * Add properties to the `div` used as warpper element.
+     * @deprecated (v26) You can now use all properties directly on `CodeEditor`.
+     */
+    outerDivAttributes?: Omit<React.HTMLAttributes<HTMLDivElement>, "id" | "data-test-id" | "data-testid" | "translate" | "onChange" | "onKeyDown" | "onMouseDown" | "onScroll">;
     /**
      * Size in spaces that is used for a tabulator key.
      */
@@ -134,6 +137,6 @@ export interface CodeEditorProps extends TestableComponent {
  * Includes a code editor, currently we use CodeMirror library as base.
  */
 export declare const CodeEditor: {
-    ({ onChange, onSelection, onMouseDown, onFocusChange, onKeyDown, onCursorChange, name, id, mode, preventLineNumbers, defaultValue, readOnly, shouldHaveMinimalSetup, wrapLines, onScroll, setEditorView, supportCodeFolding, shouldHighlightActiveLine, outerDivAttributes, tabIntentSize, tabIntentStyle, placeholder, additionalExtensions, tabForceSpaceForModes, enableTab, height, useLinting, "data-test-id": dataTestId, autoFocus, disabled, intent, useToolbar, translate, ...otherCodeEditorProps }: CodeEditorProps): React.JSX.Element;
-    supportedModes: ("markdown" | "python" | "sparql" | "turtle" | "xml" | "yaml" | "jinja2" | "json" | "ntriples" | "mathematica" | "sql" | "javascript")[];
+    ({ className, onChange, onSelection, onMouseDown, onFocusChange, onKeyDown, onCursorChange, name, id, mode, preventLineNumbers, defaultValue, readOnly, shouldHaveMinimalSetup, wrapLines, onScroll, setEditorView, supportCodeFolding, shouldHighlightActiveLine, outerDivAttributes, tabIntentSize, tabIntentStyle, placeholder, additionalExtensions, tabForceSpaceForModes, enableTab, height, useLinting, autoFocus, disabled, intent, useToolbar, translate, ...otherCodeEditorProps }: CodeEditorProps): React.JSX.Element;
+    supportedModes: ("html" | "markdown" | "python" | "sparql" | "turtle" | "xml" | "yaml" | "jinja2" | "json" | "ntriples" | "mathematica" | "sql" | "javascript")[];
 };

package/dist/types/extensions/codemirror/hooks/useCodemirrorModeExtension.hooks.d.ts

@@ -1,3 +1,4 @@
+import { html } from "@codemirror/lang-html";
 import { javascript } from "@codemirror/lang-javascript";
 import { json } from "@codemirror/lang-json";
 import { markdown } from "@codemirror/lang-markdown";
@@ -18,6 +19,7 @@ declare const supportedModes: {
     readonly mathematica: StreamParser<unknown>;
     readonly sql: typeof sql;
     readonly javascript: typeof javascript;
+    readonly html: typeof html;
 };
 export declare const supportedCodeEditorModes: Array<keyof typeof supportedModes>;
 export type SupportedCodeEditorModes = (typeof supportedCodeEditorModes)[number];

package/dist/types/extensions/codemirror/tests/codemirrorTestHelper.d.ts

@@ -5,7 +5,7 @@
  *              'EditorView is not a constructor'
  * This errors do not exist during compilation only during testing.
  */
-import { Extension, Compartment } from "@codemirror/state";
+import { Compartment, Extension } from "@codemirror/state";
 /** placeholder extension, current error '_view.placeholder is not a function' */
 export declare const adaptedPlaceholder: (text?: string) => Extension;
 /** current error '_view.Editor is not a constructor' */

package/dist/types/extensions/react-flow/edges/EdgeBezier.d.ts

@@ -0,0 +1,20 @@
+import React from "react";
+import { Edge, EdgeProps } from "@xyflow/react";
+import { EdgeDefaultV9Props } from "./EdgeDefault";
+import { EdgeDefaultV12DataProps, EdgeDefaultV12Props } from "./EdgeDefaultV12";
+interface EdgeBezierDataV12Props extends EdgeDefaultV12DataProps {
+    curvature?: number;
+}
+/**
+ * @deprecated (v26) v9 support is removed after v25
+ */
+export interface EdgeBezierV12Props extends Omit<EdgeDefaultV12Props, "data">, EdgeProps<Edge<EdgeBezierDataV12Props>> {
+}
+export type EdgeBezierProps = EdgeDefaultV9Props | EdgeBezierV12Props;
+/**
+ * This element cannot be used directly, it must be connected via a `edgeTypes` definition.
+ * Our v9 edges do not support bezier paths.
+ * @see https://reactflow.dev/docs/api/nodes/
+ */
+export declare const EdgeBezier: React.MemoExoticComponent<(props: EdgeBezierProps) => React.JSX.Element>;
+export {};

package/dist/types/extensions/react-flow/edges/EdgeDefault.d.ts

@@ -1,7 +1,9 @@
 import React from "react";
 import { EdgeProps as ReactFlowEdgeProps } from "react-flow-renderer/dist/types";
 import { IntentTypes } from "../../../common/Intent";
+import { ReactFlowVersions } from "../versionsupport";
 import { NodeHighlightColor } from "./../nodes/sharedTypes";
+import { EdgeDefaultV12Props } from "./EdgeDefaultV12";
 export interface EdgeDefaultDataProps {
     /**
      * Overwrites the default style how the edge stroke is displayed.
@@ -19,11 +21,13 @@ export interface EdgeDefaultDataProps {
      * Size of the "glow" effect when the edge is hovered.
      */
     pathGlowWidth?: number;
-    inversePath?: boolean;
     /**
-     * Reference link to the SVG marker used for the start of the edge
+     * Controls where arrow heads appear on the edge.
+     * - `normal`: arrow at the end (target)
+     * - `inversed`: arrow at the start (source)
+     * - `bidirectional`: arrows at both start and end
      */
-    markerStart?: string;
+    arrowDirection?: "normal" | "inversed" | "bidirectional";
     /**
      * Callback handler that returns a React element used as edge title.
      */
@@ -34,19 +38,37 @@ export interface EdgeDefaultDataProps {
      */
     edgeSvgProps?: React.SVGProps<SVGGElement>;
 }
-export interface EdgeDefaultProps extends ReactFlowEdgeProps {
+/**
+ * @deprecated (v26) v9 support is removed after v25
+ */
+export interface EdgeDefaultV9DataProps extends EdgeDefaultDataProps {
+    /**
+     * Reference link to the SVG marker used for the start of the edge
+     * @deprecated (v26) only necessary for react flow v9
+     */
+    markerStart?: string;
+}
+/**
+ * @deprecated (v26) v9 support is removed after v25
+ */
+export interface EdgeDefaultV9Props extends ReactFlowEdgeProps {
     /**
      * Defining content and markers for the edge.
      */
-    data?: EdgeDefaultDataProps;
+    data?: EdgeDefaultV9DataProps;
     /**
      * Callback handler that returns a SVG path as string to define how the edge is rendered.
      */
     drawSvgPath?: (edge: ReactFlowEdgeProps) => string;
 }
-export declare const EdgeDefault: React.MemoExoticComponent<({ data, drawSvgPath, ...edgeOriginalProperties }: EdgeDefaultProps) => React.JSX.Element>;
+export type EdgeDefaultProps = EdgeDefaultV9Props | EdgeDefaultV12Props;
+/**
+ * This element cannot be used directly, it must be connected via a `edgeTypes` definition.
+ * @see https://reactflow.dev/docs/api/nodes/
+ */
+export declare const EdgeDefault: React.MemoExoticComponent<(props: EdgeDefaultProps) => React.JSX.Element>;
 export declare const edgeDefaultUtils: {
-    createEdgeDefaultClassName: ({ strokeType, intent, highlightColor }: EdgeDefaultDataProps, baseClass?: string) => string;
+    createEdgeDefaultClassName: ({ strokeType, intent, highlightColor }: EdgeDefaultDataProps, baseClass?: string, flowVersion?: ReactFlowVersions) => string;
     drawEdgeStep: ({ sourceX, sourceY, sourcePosition, targetX, targetY, targetPosition, data, }: import("./EdgeStep").EdgeStepProps) => string;
     drawEdgeStraight: ({ sourceX, sourceY, sourcePosition, targetX, targetY, targetPosition, }: EdgeDefaultProps) => string;
 };

package/dist/types/extensions/react-flow/edges/EdgeDefaultV12.d.ts

@@ -1,38 +1,27 @@
 import React from "react";
-import { Edge, EdgeProps } from "@xyflow/react";
-import { IntentTypes } from "../../../common/Intent";
-import { NodeHighlightColor } from "../nodes/sharedTypes";
-export type EdgeDefaultV12DataProps = Record<string, unknown> & {
-    /**
-     * Overwrites the default style how the edge stroke is displayed.
-     */
-    strokeType?: "solid" | "dashed" | "dotted" | "double" | "doubledashed";
-    /**
-     * Feedback state of the node.
-     */
-    intent?: IntentTypes;
-    /**
-     * Set the color of used highlights to mark the edge.
-     */
-    highlightColor?: NodeHighlightColor | [NodeHighlightColor, NodeHighlightColor];
-    /**
-     * Size of the "glow" effect when the edge is hovered.
-     */
-    pathGlowWidth?: number;
-    inversePath?: boolean;
+import { Edge, EdgeProps, GetBezierPathParams } from "@xyflow/react";
+import { EdgeDefaultDataProps } from "./EdgeDefault";
+/**
+ * @deprecated (v26) use EdgeDefaultDataProps
+ */
+export interface EdgeDefaultV12DataProps extends Record<string, unknown>, EdgeDefaultDataProps {
     /**
-     * Callback handler that returns a React element used as edge title.
+     * Set the marker used on the start or end of the edge.
      */
-    renderLabel?: (edgeCenter: [number, number, number, number]) => React.ReactNode;
+    markerAppearance?: "arrow-closed" | "none";
+}
+/**
+ * @deprecated (v26) use EdgeDefaultProps
+ */
+export type EdgeDefaultV12Props = EdgeProps<Edge<EdgeDefaultV12DataProps>> & {
     /**
-     * Properties are forwarded to the internally used SVG `g` element.
-     * Data attributes for test ids coud be included here.
+     * Callback handler that returns SVG path and label position of the edge.
      */
-    edgeSvgProps?: React.SVGProps<SVGGElement>;
+    getPath?: (edgeParams: Omit<GetBezierPathParams, "curvature"> & Record<string, unknown>) => [path: string, labelX: number, labelY: number, offsetX: number, offsetY: number];
 };
 /**
  * This element cannot be used directly, it must be connected via a `edgeTypes` definition.
  * @see https://reactflow.dev/docs/api/nodes/
  * @deprecated (v26) will be removed when `EdgeDefault` supports v12 directly
  */
-export declare const EdgeDefaultV12: React.MemoExoticComponent<({ id, sourceX, sourceY, targetX, targetY, sourcePosition, targetPosition, label, labelStyle, labelShowBg, labelBgStyle, labelBgPadding, labelBgBorderRadius, data, ...edgeOriginalProperties }: EdgeProps<Edge<EdgeDefaultV12DataProps>>) => React.JSX.Element>;
+export declare const EdgeDefaultV12: React.MemoExoticComponent<({ id, sourceX, sourceY, targetX, targetY, sourcePosition, targetPosition, label, labelStyle, labelShowBg, labelBgStyle, labelBgPadding, labelBgBorderRadius, data, getPath, ...edgeOriginalProperties }: EdgeDefaultV12Props) => React.JSX.Element>;

package/dist/types/extensions/react-flow/edges/EdgeDefs.d.ts

@@ -1,2 +1,5 @@
 import React from "react";
+/**
+ * @deprecated (v26) use `<ReactFlowMarkers />`
+ */
 export declare const EdgeDefs: React.MemoExoticComponent<() => React.JSX.Element>;

package/dist/types/extensions/react-flow/edges/EdgeLabel.d.ts

@@ -25,7 +25,7 @@ export interface EdgeLabelProps extends React.HTMLAttributes<HTMLDivElement> {
      */
     fullWidth?: boolean;
     /**
-     * Label is diaplayed without a box that comes with borders and background color.
+     * Label is displayed without a box that comes with borders and background color.
      */
     loose?: boolean;
     /**

package/dist/types/extensions/react-flow/edges/EdgeNew.d.ts

@@ -0,0 +1,3 @@
+import React from "react";
+import { ConnectionLineComponentProps } from "@xyflow/react";
+export declare const EdgeNew: (edgeNewProps: ConnectionLineComponentProps) => React.JSX.Element;

package/dist/types/extensions/react-flow/edges/EdgeStep.d.ts

@@ -1,10 +1,28 @@
 import React from "react";
-import { EdgeDefaultDataProps, EdgeDefaultProps } from "./EdgeDefault";
-interface EdgeStepDataProps extends EdgeDefaultDataProps {
+import { Edge, EdgeProps } from "@xyflow/react";
+import { EdgeDefaultV9DataProps, EdgeDefaultV9Props } from "./EdgeDefault";
+import { EdgeDefaultV12DataProps, EdgeDefaultV12Props } from "./EdgeDefaultV12";
+interface EdgeStepDataV9Props extends EdgeDefaultV9DataProps {
     stepCornerRadius?: number;
 }
-export interface EdgeStepProps extends EdgeDefaultProps {
-    data?: EdgeStepDataProps;
+interface EdgeStepDataV12Props extends EdgeDefaultV12DataProps {
+    stepCornerRadius?: number;
+}
+/**
+ * @deprecated (v26) v9 support is removed after v25
+ */
+export interface EdgeStepV9Props extends EdgeDefaultV9Props {
+    data?: EdgeStepDataV9Props;
+}
+/**
+ * @deprecated (v26) v9 support is removed after v25
+ */
+export interface EdgeStepV12Props extends Omit<EdgeDefaultV12Props, "data">, EdgeProps<Edge<EdgeStepDataV12Props>> {
 }
-export declare const EdgeStep: React.MemoExoticComponent<(edge: EdgeStepProps) => React.JSX.Element>;
+export type EdgeStepProps = EdgeStepV9Props | EdgeStepV12Props;
+/**
+ * This element cannot be used directly, it must be connected via a `edgeTypes` definition.
+ * @see https://reactflow.dev/docs/api/nodes/
+ */
+export declare const EdgeStep: React.MemoExoticComponent<(props: EdgeStepProps) => React.JSX.Element>;
 export {};

package/dist/types/extensions/react-flow/edges/EdgeStraight.d.ts

@@ -0,0 +1 @@
+export { EdgeDefault as EdgeStraight } from "./EdgeDefault";

package/dist/types/extensions/react-flow/edges/utils.d.ts

@@ -1,4 +1,6 @@
+import { GetBezierPathParams } from "@xyflow/react";
 import { EdgeDefaultProps } from "./EdgeDefault";
 import { EdgeStepProps } from "./EdgeStep";
 export declare const drawEdgeStraight: ({ sourceX, sourceY, sourcePosition, targetX, targetY, targetPosition, }: EdgeDefaultProps) => string;
+export declare const getStraightPath: (params: Omit<GetBezierPathParams, "curvature">) => [path: string, labelX: number, labelY: number, offsetX: number, offsetY: number];
 export declare const drawEdgeStep: ({ sourceX, sourceY, sourcePosition, targetX, targetY, targetPosition, data, }: EdgeStepProps) => string;