@eccenca/gui-elements 23.8.0 → 24.0.0-rc.1

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

@@ -27,11 +27,11 @@ export declare const transformTabProperties: ({ title, dontShrink, className, ba
     } | {
         flexShrink?: undefined;
     };
-    "data-test-id"?: string | undefined;
-    "data-testid"?: string | undefined;
+    "data-test-id"?: string;
+    "data-testid"?: string;
     slot?: string | undefined;
     children?: React.ReactNode;
-    disabled?: boolean | undefined;
+    disabled?: boolean;
     defaultChecked?: boolean | undefined;
     defaultValue?: string | number | readonly string[] | undefined;
     suppressContentEditableWarning?: boolean | undefined;
@@ -75,29 +75,29 @@ export declare const transformTabProperties: ({ title, dontShrink, className, ba
     results?: number | undefined;
     security?: string | undefined;
     unselectable?: "on" | "off" | undefined;
-    inputMode?: "none" | "text" | "search" | "tel" | "url" | "email" | "numeric" | "decimal" | undefined;
+    inputMode?: "none" | "text" | "tel" | "url" | "email" | "numeric" | "decimal" | "search" | undefined;
     is?: string | undefined;
     "aria-activedescendant"?: string | undefined;
     "aria-atomic"?: (boolean | "true" | "false") | undefined;
-    "aria-autocomplete"?: "none" | "list" | "inline" | "both" | undefined;
+    "aria-autocomplete"?: "none" | "inline" | "list" | "both" | undefined;
     "aria-busy"?: (boolean | "true" | "false") | undefined;
-    "aria-checked"?: boolean | "true" | "false" | "mixed" | undefined;
+    "aria-checked"?: boolean | "false" | "mixed" | "true" | undefined;
     "aria-colcount"?: number | undefined;
     "aria-colindex"?: number | undefined;
     "aria-colspan"?: number | undefined;
     "aria-controls"?: string | undefined;
-    "aria-current"?: boolean | "time" | "true" | "false" | "page" | "step" | "location" | "date" | undefined;
+    "aria-current"?: boolean | "false" | "true" | "page" | "step" | "location" | "date" | "time" | undefined;
     "aria-describedby"?: string | undefined;
     "aria-details"?: string | undefined;
     "aria-disabled"?: (boolean | "true" | "false") | undefined;
-    "aria-dropeffect"?: "none" | "link" | "copy" | "execute" | "move" | "popup" | undefined;
+    "aria-dropeffect"?: "none" | "copy" | "execute" | "link" | "move" | "popup" | undefined;
     "aria-errormessage"?: string | undefined;
     "aria-expanded"?: (boolean | "true" | "false") | undefined;
     "aria-flowto"?: string | undefined;
     "aria-grabbed"?: (boolean | "true" | "false") | undefined;
-    "aria-haspopup"?: boolean | "dialog" | "menu" | "true" | "false" | "grid" | "listbox" | "tree" | undefined;
+    "aria-haspopup"?: boolean | "false" | "true" | "menu" | "listbox" | "tree" | "grid" | "dialog" | undefined;
     "aria-hidden"?: (boolean | "true" | "false") | undefined;
-    "aria-invalid"?: boolean | "true" | "false" | "grammar" | "spelling" | undefined;
+    "aria-invalid"?: boolean | "false" | "true" | "grammar" | "spelling" | undefined;
     "aria-keyshortcuts"?: string | undefined;
     "aria-label"?: string | undefined;
     "aria-labelledby"?: string | undefined;
@@ -110,9 +110,9 @@ export declare const transformTabProperties: ({ title, dontShrink, className, ba
     "aria-owns"?: string | undefined;
     "aria-placeholder"?: string | undefined;
     "aria-posinset"?: number | undefined;
-    "aria-pressed"?: boolean | "true" | "false" | "mixed" | undefined;
+    "aria-pressed"?: boolean | "false" | "mixed" | "true" | undefined;
     "aria-readonly"?: (boolean | "true" | "false") | undefined;
-    "aria-relevant"?: "text" | "additions" | "additions removals" | "additions text" | "all" | "removals" | "removals additions" | "removals text" | "text additions" | "text removals" | undefined;
+    "aria-relevant"?: "additions" | "additions removals" | "additions text" | "all" | "removals" | "removals additions" | "removals text" | "text" | "text additions" | "text removals" | undefined;
     "aria-required"?: (boolean | "true" | "false") | undefined;
     "aria-roledescription"?: string | undefined;
     "aria-rowcount"?: number | undefined;
@@ -288,23 +288,20 @@ export declare const transformTabProperties: ({ title, dontShrink, className, ba
     onTransitionEnd?: React.TransitionEventHandler<HTMLDivElement> | undefined;
     onTransitionEndCapture?: React.TransitionEventHandler<HTMLDivElement> | undefined;
     icon?: import("@blueprintjs/core").IconName | import("@blueprintjs/core").MaybeElement;
-    tagProps?: Omit<import("@blueprintjs/core").TagProps, "children"> | undefined;
-    panel?: React.JSX.Element | ((props: {
-        tabTitleId: string;
-        tabPanelId: string;
-    }) => React.JSX.Element) | undefined;
-    panelClassName?: string | undefined;
-    tagContent?: React.ReactNode;
+    tagProps?: Omit<import("@blueprintjs/core").TagProps, "children">;
+    panel?: React.JSX.Element | ((props: import("@blueprintjs/core/lib/esm/components/tabs/tab").TabIdProps) => React.JSX.Element);
+    panelClassName?: string;
+    tagContent?: import("@blueprintjs/core").TagProps["children"];
     key: import("@blueprintjs/core").TabId;
     className: string;
     title: React.JSX.Element;
 } | {
     style?: React.CSSProperties | undefined;
-    "data-test-id"?: string | undefined;
-    "data-testid"?: string | undefined;
+    "data-test-id"?: string;
+    "data-testid"?: string;
     slot?: string | undefined;
     children?: React.ReactNode;
-    disabled?: boolean | undefined;
+    disabled?: boolean;
     defaultChecked?: boolean | undefined;
     defaultValue?: string | number | readonly string[] | undefined;
     suppressContentEditableWarning?: boolean | undefined;
@@ -348,29 +345,29 @@ export declare const transformTabProperties: ({ title, dontShrink, className, ba
     results?: number | undefined;
     security?: string | undefined;
     unselectable?: "on" | "off" | undefined;
-    inputMode?: "none" | "text" | "search" | "tel" | "url" | "email" | "numeric" | "decimal" | undefined;
+    inputMode?: "none" | "text" | "tel" | "url" | "email" | "numeric" | "decimal" | "search" | undefined;
     is?: string | undefined;
     "aria-activedescendant"?: string | undefined;
     "aria-atomic"?: (boolean | "true" | "false") | undefined;
-    "aria-autocomplete"?: "none" | "list" | "inline" | "both" | undefined;
+    "aria-autocomplete"?: "none" | "inline" | "list" | "both" | undefined;
     "aria-busy"?: (boolean | "true" | "false") | undefined;
-    "aria-checked"?: boolean | "true" | "false" | "mixed" | undefined;
+    "aria-checked"?: boolean | "false" | "mixed" | "true" | undefined;
     "aria-colcount"?: number | undefined;
     "aria-colindex"?: number | undefined;
     "aria-colspan"?: number | undefined;
     "aria-controls"?: string | undefined;
-    "aria-current"?: boolean | "time" | "true" | "false" | "page" | "step" | "location" | "date" | undefined;
+    "aria-current"?: boolean | "false" | "true" | "page" | "step" | "location" | "date" | "time" | undefined;
     "aria-describedby"?: string | undefined;
     "aria-details"?: string | undefined;
     "aria-disabled"?: (boolean | "true" | "false") | undefined;
-    "aria-dropeffect"?: "none" | "link" | "copy" | "execute" | "move" | "popup" | undefined;
+    "aria-dropeffect"?: "none" | "copy" | "execute" | "link" | "move" | "popup" | undefined;
     "aria-errormessage"?: string | undefined;
     "aria-expanded"?: (boolean | "true" | "false") | undefined;
     "aria-flowto"?: string | undefined;
     "aria-grabbed"?: (boolean | "true" | "false") | undefined;
-    "aria-haspopup"?: boolean | "dialog" | "menu" | "true" | "false" | "grid" | "listbox" | "tree" | undefined;
+    "aria-haspopup"?: boolean | "false" | "true" | "menu" | "listbox" | "tree" | "grid" | "dialog" | undefined;
     "aria-hidden"?: (boolean | "true" | "false") | undefined;
-    "aria-invalid"?: boolean | "true" | "false" | "grammar" | "spelling" | undefined;
+    "aria-invalid"?: boolean | "false" | "true" | "grammar" | "spelling" | undefined;
     "aria-keyshortcuts"?: string | undefined;
     "aria-label"?: string | undefined;
     "aria-labelledby"?: string | undefined;
@@ -383,9 +380,9 @@ export declare const transformTabProperties: ({ title, dontShrink, className, ba
     "aria-owns"?: string | undefined;
     "aria-placeholder"?: string | undefined;
     "aria-posinset"?: number | undefined;
-    "aria-pressed"?: boolean | "true" | "false" | "mixed" | undefined;
+    "aria-pressed"?: boolean | "false" | "mixed" | "true" | undefined;
     "aria-readonly"?: (boolean | "true" | "false") | undefined;
-    "aria-relevant"?: "text" | "additions" | "additions removals" | "additions text" | "all" | "removals" | "removals additions" | "removals text" | "text additions" | "text removals" | undefined;
+    "aria-relevant"?: "additions" | "additions removals" | "additions text" | "all" | "removals" | "removals additions" | "removals text" | "text" | "text additions" | "text removals" | undefined;
     "aria-required"?: (boolean | "true" | "false") | undefined;
     "aria-roledescription"?: string | undefined;
     "aria-rowcount"?: number | undefined;
@@ -561,13 +558,10 @@ export declare const transformTabProperties: ({ title, dontShrink, className, ba
     onTransitionEnd?: React.TransitionEventHandler<HTMLDivElement> | undefined;
     onTransitionEndCapture?: React.TransitionEventHandler<HTMLDivElement> | undefined;
     icon?: import("@blueprintjs/core").IconName | import("@blueprintjs/core").MaybeElement;
-    tagProps?: Omit<import("@blueprintjs/core").TagProps, "children"> | undefined;
-    panel?: React.JSX.Element | ((props: {
-        tabTitleId: string;
-        tabPanelId: string;
-    }) => React.JSX.Element) | undefined;
-    panelClassName?: string | undefined;
-    tagContent?: React.ReactNode;
+    tagProps?: Omit<import("@blueprintjs/core").TagProps, "children">;
+    panel?: React.JSX.Element | ((props: import("@blueprintjs/core/lib/esm/components/tabs/tab").TabIdProps) => React.JSX.Element);
+    panelClassName?: string;
+    tagContent?: import("@blueprintjs/core").TagProps["children"];
     key: import("@blueprintjs/core").TabId;
     className: string;
     title: React.JSX.Element;

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

@@ -1,5 +1,5 @@
 import React from "react";
-declare type WhiteSpaceSizes = "tiny" | "small" | "regular" | "large" | "xlarge";
+type WhiteSpaceSizes = "tiny" | "small" | "regular" | "large" | "xlarge";
 export interface WhiteSpaceContainerProps extends React.HTMLAttributes<HTMLDivElement> {
     /**
      * Insert line breaks within an otherwise unbreakable string to prevent text from overflowing the container.

package/dist/types/components/Workspace/WorkspaceContent.d.ts

@@ -1,5 +1,5 @@
 import React from "react";
 import { GridProps } from "./../Grid/Grid";
-export declare type WorkspaceContentProps = GridProps;
+export type WorkspaceContentProps = GridProps;
 export declare const WorkspaceContent: ({ children, className, ...restProps }: WorkspaceContentProps) => React.JSX.Element;
 export default WorkspaceContent;

package/dist/types/components/Workspace/WorkspaceHeader.d.ts

@@ -6,6 +6,6 @@ export interface WorkspaceHeaderProps extends React.HTMLAttributes<HTMLDivElemen
     */
     className?: string;
 }
-export declare type IWorkspaceHeaderProps = WorkspaceHeaderProps;
+export type IWorkspaceHeaderProps = WorkspaceHeaderProps;
 export declare const WorkspaceHeader: ({ children, className, ...otherProps }: WorkspaceHeaderProps) => React.JSX.Element;
 export default WorkspaceHeader;

package/dist/types/components/Workspace/WorkspaceMain.d.ts

@@ -1,5 +1,5 @@
 import React from "react";
 import { GridColumnProps } from "./../Grid/GridColumn";
-export declare type WorkspaceMainProps = GridColumnProps;
+export type WorkspaceMainProps = GridColumnProps;
 export declare const WorkspaceMain: ({ children, className, ...restProps }: GridColumnProps) => React.JSX.Element;
 export default WorkspaceMain;

package/dist/types/components/Workspace/WorkspaceSide.d.ts

@@ -1,5 +1,5 @@
 import React from "react";
 import { GridColumnProps } from "./../Grid/GridColumn";
-export declare type WorkspaceSideProps = GridColumnProps;
+export type WorkspaceSideProps = GridColumnProps;
 export declare const WorkspaceSide: ({ children, className, ...restProps }: GridColumnProps) => React.JSX.Element;
 export default WorkspaceSide;

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

@@ -17,8 +17,8 @@ import "codemirror/addon/fold/foldgutter";
 import "codemirror/addon/fold/brace-fold";
 import "codemirror/addon/fold/xml-fold.js";
 export declare const supportedCodeEditorModes: readonly ["markdown", "python", "sparql", "sql", "turtle", "xml", "jinja2", "yaml", "json", "ntriples", "mathematica", "undefined"];
-declare type SupportedModesTuple = typeof supportedCodeEditorModes;
-export declare type SupportedCodeEditorModes = SupportedModesTuple[number];
+type SupportedModesTuple = typeof supportedCodeEditorModes;
+export type SupportedCodeEditorModes = SupportedModesTuple[number];
 export interface CodeEditorProps {
     setEditorInstance?: (editor: CodeMirror.Editor) => any;
     /**

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

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 export declare const edgeTypes: {
     default: import("react").MemoExoticComponent<({ data, drawSvgPath, ...edgeOriginalProperties }: import("./EdgeDefault").EdgeDefaultProps) => import("react").JSX.Element>;
     straight: import("react").MemoExoticComponent<({ data, drawSvgPath, ...edgeOriginalProperties }: import("./EdgeDefault").EdgeDefaultProps) => import("react").JSX.Element>;

package/dist/types/extensions/react-flow/handles/HandleDefault.d.ts

@@ -4,7 +4,7 @@ import { HandleProps as ReactFlowHandleNextProps } from "react-flow-renderer-lts
 import { IntentTypes } from "../../../common/Intent";
 import { ReacFlowVersionSupportProps } from "../versionsupport";
 import { HandleContentProps } from "./HandleContent";
-export declare type HandleCategory = "configuration" | "flexible" | "fixed" | "unknown" | "dependency";
+export type HandleCategory = "configuration" | "flexible" | "fixed" | "unknown" | "dependency";
 interface HandleExtensionProps extends ReacFlowVersionSupportProps, Omit<React.HTMLAttributes<HTMLDivElement>, "id" | "children"> {
     /**
      * Defines the handle category, mainly used to adjust layout.
@@ -28,6 +28,6 @@ export interface HandleProps extends HandleExtensionProps, ReactFlowHandleLegacy
 }
 export interface HandleNextProps extends HandleExtensionProps, ReactFlowHandleNextProps {
 }
-export declare type HandleDefaultProps = HandleProps | HandleNextProps;
+export type HandleDefaultProps = HandleProps | HandleNextProps;
 export declare const HandleDefault: React.MemoExoticComponent<({ flowVersion, data, tooltip, children, category, intent, ...handleProps }: HandleDefaultProps) => React.JSX.Element>;
 export {};

package/dist/types/extensions/react-flow/index.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 export * from "./nodes/NodeDefault";
 export * from "./nodes/NodeContent";
 export * from "./nodes/NodeContentExtension";

package/dist/types/extensions/react-flow/nodes/NodeContent.d.ts

@@ -8,16 +8,16 @@ import { HandleNextProps, HandleProps } from "./../handles/HandleDefault";
 import { NodeContentExtensionProps } from "./NodeContentExtension";
 import { NodeProps } from "./NodeDefault";
 import { HighlightingState, NodeHighlightColor } from "./sharedTypes";
-declare type NodeContentHandleLegacyProps = HandleProps;
-declare type NodeContentHandleNextProps = HandleNextProps;
-export declare type NodeContentHandleProps = NodeContentHandleLegacyProps | NodeContentHandleNextProps;
+type NodeContentHandleLegacyProps = HandleProps;
+type NodeContentHandleNextProps = HandleNextProps;
+export type NodeContentHandleProps = NodeContentHandleLegacyProps | NodeContentHandleNextProps;
 export type { HighlightingState };
-export declare type IHandleProps = NodeContentHandleLegacyProps;
-export declare type NodeDimensions = {
+export type IHandleProps = NodeContentHandleLegacyProps;
+export type NodeDimensions = {
     width: number;
     height: number;
 };
-declare type IntroductionTime = {
+type IntroductionTime = {
     /**
      * The delay time in ms before the introduction animation is displayed.
      * Until the animation starts the node is invisible.
@@ -200,7 +200,7 @@ export interface NodeContentProps<NODE_DATA, NODE_CONTENT_PROPS = any> extends N
  */
 export declare function NodeContent<CONTENT_PROPS = any>({ flowVersion, iconName, depiction, leftElement, typeLabel, label, labelSubline, enlargeHeader, fullWidth, showExecutionButtons, executionButtons, menuButtons, content, contentExtension, footerContent, size, minimalShape, highlightedState, intent, border, highlightColor, adaptHeightForHandleMinCount, adaptSizeIncrement, getMinimalTooltipData, style, showUnconnectableHandles, animated, introductionTime, onNodeResize, nodeDimensions, targetPosition, sourcePosition, isConnectable, selected, letPassWheelEvents, businessData, ...otherDomProps }: NodeContentProps<any>): React.JSX.Element;
 export declare const nodeContentUtils: {
-    evaluateHighlightColors: (baseCustomProperty: string, highlightColor?: NodeHighlightColor | NodeHighlightColor[] | undefined) => {
+    evaluateHighlightColors: (baseCustomProperty: string, highlightColor?: NodeHighlightColor | NodeHighlightColor[]) => {
         highlightClassNameSuffix: string[];
         highlightCustomPropertySettings: React.CSSProperties;
     };

package/dist/types/extensions/react-flow/nodes/NodeDefault.d.ts

@@ -9,7 +9,7 @@ export interface NodeDefaultProps<NODE_DATA, NODE_CONTENT_PROPS = any> extends R
      */
     data: NodeContentProps<NODE_DATA, NODE_CONTENT_PROPS>;
 }
-export declare type NodeProps<NODE_DATA, NODE_CONTENT_PROPS = any> = NodeDefaultProps<NODE_DATA, NODE_CONTENT_PROPS>;
+export type NodeProps<NODE_DATA, NODE_CONTENT_PROPS = any> = NodeDefaultProps<NODE_DATA, NODE_CONTENT_PROPS>;
 /**
  * The `NodeDefault` element manages the display of React-Flow nodes.
  * This element cannot be used directly, it must be connected via a `nodeTypes` definition and all properties need to be routed through the `elements` property items inside the `ReactFlow` container.

package/dist/types/extensions/react-flow/nodes/nodeTypes.d.ts

@@ -1,13 +1,12 @@
-/// <reference types="react" />
 export declare const nodeTypes: {
-    default: import("react").MemoExoticComponent<(node: import("./NodeDefault").NodeDefaultProps<any, any>) => import("react").JSX.Element>;
-    graphNode: import("react").MemoExoticComponent<(node: import("./NodeDefault").NodeDefaultProps<any, any>) => import("react").JSX.Element>;
-    classNode: import("react").MemoExoticComponent<(node: import("./NodeDefault").NodeDefaultProps<any, any>) => import("react").JSX.Element>;
-    instanceNode: import("react").MemoExoticComponent<(node: import("./NodeDefault").NodeDefaultProps<any, any>) => import("react").JSX.Element>;
-    propertyNode: import("react").MemoExoticComponent<(node: import("./NodeDefault").NodeDefaultProps<any, any>) => import("react").JSX.Element>;
-    datasetNode: import("react").MemoExoticComponent<(node: import("./NodeDefault").NodeDefaultProps<any, any>) => import("react").JSX.Element>;
-    linkingNode: import("react").MemoExoticComponent<(node: import("./NodeDefault").NodeDefaultProps<any, any>) => import("react").JSX.Element>;
-    transformNode: import("react").MemoExoticComponent<(node: import("./NodeDefault").NodeDefaultProps<any, any>) => import("react").JSX.Element>;
-    taskNode: import("react").MemoExoticComponent<(node: import("./NodeDefault").NodeDefaultProps<any, any>) => import("react").JSX.Element>;
-    workflowNode: import("react").MemoExoticComponent<(node: import("./NodeDefault").NodeDefaultProps<any, any>) => import("react").JSX.Element>;
+    default: import("react").MemoExoticComponent<(node: import("./NodeDefault").NodeDefaultProps<any>) => import("react").JSX.Element>;
+    graphNode: import("react").MemoExoticComponent<(node: import("./NodeDefault").NodeDefaultProps<any>) => import("react").JSX.Element>;
+    classNode: import("react").MemoExoticComponent<(node: import("./NodeDefault").NodeDefaultProps<any>) => import("react").JSX.Element>;
+    instanceNode: import("react").MemoExoticComponent<(node: import("./NodeDefault").NodeDefaultProps<any>) => import("react").JSX.Element>;
+    propertyNode: import("react").MemoExoticComponent<(node: import("./NodeDefault").NodeDefaultProps<any>) => import("react").JSX.Element>;
+    datasetNode: import("react").MemoExoticComponent<(node: import("./NodeDefault").NodeDefaultProps<any>) => import("react").JSX.Element>;
+    linkingNode: import("react").MemoExoticComponent<(node: import("./NodeDefault").NodeDefaultProps<any>) => import("react").JSX.Element>;
+    transformNode: import("react").MemoExoticComponent<(node: import("./NodeDefault").NodeDefaultProps<any>) => import("react").JSX.Element>;
+    taskNode: import("react").MemoExoticComponent<(node: import("./NodeDefault").NodeDefaultProps<any>) => import("react").JSX.Element>;
+    workflowNode: import("react").MemoExoticComponent<(node: import("./NodeDefault").NodeDefaultProps<any>) => import("react").JSX.Element>;
 };

package/dist/types/extensions/react-flow/nodes/nodeUtils.d.ts

@@ -1,6 +1,6 @@
 import { CSSProperties } from "react";
 import { Node } from "react-flow-renderer";
-declare type IStickyNote = {
+type IStickyNote = {
     id: string;
     content: string;
     color: string;

package/dist/types/extensions/react-flow/nodes/sharedTypes.d.ts

@@ -1,3 +1,3 @@
 import Color from "color";
-export declare type HighlightingState = "success" | "warning" | "danger" | "match" | "altmatch";
-export declare type NodeHighlightColor = "default" | "alternate" | Color | string;
+export type HighlightingState = "success" | "warning" | "danger" | "match" | "altmatch";
+export type NodeHighlightColor = "default" | "alternate" | Color | string;

package/package.json

@@ -1,7 +1,7 @@
 {
     "name": "@eccenca/gui-elements",
     "description": "GUI elements based on other libraries, usable in React application, written in Typescript.",
-    "version": "23.8.0",
+    "version": "24.0.0-rc.1",
     "license": "Apache-2.0",
     "homepage": "https://github.com/eccenca/gui-elements",
     "bugs": "https://github.com/eccenca/gui-elements/issues",
@@ -28,7 +28,7 @@
         "registry": "https://registry.npmjs.org"
     },
     "engines": {
-        "node": ">=16.x"
+        "node": ">=18"
     },
     "style": "src/index.scss",
     "main": "dist/cjs/index.js",
@@ -66,16 +66,15 @@
     },
     "dependencies": {
         "@blueprintjs/colors": "^5.1.1",
-        "@blueprintjs/core": "^5.10.3",
-        "@blueprintjs/select": "^5.1.5",
-        "@carbon/icons": "^11.19.0",
-        "@carbon/icons-react": "11.19.0",
-        "@carbon/styles": "1.32.0",
+        "@blueprintjs/core": "^5.11.0",
+        "@blueprintjs/select": "^5.2.2",
+        "@carbon/icons": "^11.47.1",
+        "@carbon/react": "^1.64.1",
         "@mavrin/remark-typograf": "^2.2.0",
-        "carbon-components-react": "^8.28.0",
         "codemirror": "^5.65.16",
         "codemirror-formatting": "^1.0.0",
         "color": "^4.2.3",
+        "compute-scroll-into-view": "^3.1.0",
         "lodash": "^4.17.21",
         "re-resizable": "6.9.9",
         "react": "^16.13.1",
@@ -85,91 +84,81 @@
         "react-flow-renderer-lts": "npm:react-flow-renderer@^10.3.17",
         "react-inlinesvg": "^3.0.3",
         "react-markdown": "^8.0.7",
-        "react-syntax-highlighter": "15.5.0",
+        "react-syntax-highlighter": "^15.5.0",
         "rehype-raw": "^6.1.1",
         "remark-definition-list": "^1.2.0",
         "remark-gfm": "^3.0.1",
         "remark-parse": "^10.0.2",
         "reset-css": "^5.0.2",
-        "unified": "^11.0.4",
-        "wicg-inert": "^3.1.2"
+        "unified": "^11.0.5",
+        "wicg-inert": "^3.1.3"
     },
     "devDependencies": {
-        "@babel/core": "^7.23.9",
+        "@babel/core": "^7.25.2",
         "@babel/plugin-proposal-class-properties": "^7.16.7",
         "@babel/plugin-proposal-private-methods": "^7.16.11",
         "@babel/plugin-proposal-private-property-in-object": "^7.21.11",
-        "@babel/preset-env": "^7.23.9",
-        "@babel/preset-flow": "^7.23.3",
-        "@babel/preset-react": "^7.23.3",
-        "@babel/preset-typescript": "^7.23.3",
-        "@storybook/addon-actions": "^7.6.17",
-        "@storybook/addon-essentials": "^7.6.17",
-        "@storybook/addon-jest": "^7.6.17",
-        "@storybook/addon-links": "^7.6.17",
-        "@storybook/cli": "^7.6.17",
+        "@babel/preset-env": "^7.25.4",
+        "@babel/preset-flow": "^7.24.7",
+        "@babel/preset-react": "^7.24.7",
+        "@babel/preset-typescript": "^7.24.7",
+        "@storybook/addon-actions": "^8.2.9",
+        "@storybook/addon-essentials": "^8.2.9",
+        "@storybook/addon-jest": "^8.2.9",
+        "@storybook/addon-links": "^8.2.9",
+        "@storybook/addon-webpack5-compiler-babel": "^3.0.3",
+        "@storybook/cli": "^8.2.9",
         "@storybook/preset-scss": "^1.0.3",
-        "@storybook/react": "^7.6.17",
-        "@storybook/react-webpack5": "^7.6.17",
-        "@testing-library/jest-dom": "^6.4.2",
+        "@storybook/react": "^8.2.9",
+        "@storybook/react-webpack5": "^8.2.9",
+        "@storybook/test": "^8.2.9",
+        "@testing-library/jest-dom": "^6.5.0",
         "@testing-library/react": "^12.1.2",
-        "@types/carbon-components-react": "^7.55.10",
         "@types/codemirror": "^5.60.15",
         "@types/color": "^3.0.6",
         "@types/jest": "^29.5.12",
-        "@types/lodash": "^4.14.202",
-        "@types/react-syntax-highlighter": "15.5.11",
+        "@types/lodash": "^4.17.7",
+        "@types/react-syntax-highlighter": "^15.5.13",
         "@typescript-eslint/eslint-plugin": "^5.62.0",
         "@typescript-eslint/parser": "^5.62.0",
         "babel-jest": "^29.7.0",
-        "chromatic": "^10.9.6",
-        "eslint": "^8.56.0",
-        "eslint-plugin-react": "^7.33.2",
-        "eslint-plugin-react-hooks": "^4.6.0",
-        "eslint-plugin-simple-import-sort": "^10.0.0",
+        "chromatic": "^11.7.1",
+        "eslint": "^8.57.0",
+        "eslint-plugin-react": "^7.35.0",
+        "eslint-plugin-react-hooks": "^4.6.2",
+        "eslint-plugin-simple-import-sort": "^12.1.1",
         "husky": "4",
         "identity-obj-proxy": "^3.0.0",
         "jest": "^29.7.0",
         "jest-environment-jsdom": "^29.7.0",
         "jest-pnp-resolver": "^1.2.3",
-        "lint-staged": "^13.3.0",
+        "lint-staged": "^15.2.9",
         "node-sass-package-importer": "^5.3.3",
         "prettier": "^2.8.8",
         "react-app-polyfill": "^3.0.0",
         "react-lorem-ipsum": "^1.4.9",
         "regenerator-runtime": "^0.13.9",
-        "rimraf": "^5.0.5",
+        "rimraf": "^5.0.10",
         "sass": "1.62.1",
         "sass-loader": "10.3.1",
-        "storybook": "^7.6.17",
+        "storybook": "^8.2.9",
         "stylelint": "^15.11.0",
         "stylelint-config-recess-order": "^4.6.0",
         "stylelint-config-standard-scss": "^9.0.0",
         "ts-node": "^10.9.2",
-        "tsc-esm-fix": "^2.20.25",
-        "typescript": "4.5.2",
+        "tsc-esm-fix": "^3.0.2",
+        "typescript": "5.5.3",
         "url-loader": "^4.1.1",
         "yargs": "^17.7.2"
     },
     "peerDependencies": {
-        "@carbon/icons-react": ">=11.34.1",
-        "@carbon/styles": "<1.33.0",
-        "@types/carbon-components-react": ">=7",
+        "@blueprintjs/core": ">=5",
         "react": ">=16",
         "react-dom": ">=16"
     },
     "resolutions": {
-        "**/@types/react": "^17.0.75",
-        "**/@carbon/icons-react": "11.19.0",
-        "**/jackspeak": "2.1.1",
-        "node-sass-package-importer/**/postcss": "^8.4.31",
-        "**/word-wrap": "^1.2.4",
-        "**/webpack-dev-middleware": "^6.1.2",
-        "**/braces": "^3.0.3",
-        "**/ws": "^8.17.1",
-        "**/ejs": "^3.1.10",
-        "**/tar": "^6.2.1",
-        "**/express": "^4.19.2"
+        "**/@types/react": "^17.0.80",
+        "node-sass-package-importer/**/postcss": "^8.4.41"
     },
     "husky": {
         "hooks": {

package/src/cmem/ActivityControl/ActivityControlWidget.stories.tsx

@@ -1,6 +1,6 @@
 import React from "react";
 import { loremIpsum } from "react-lorem-ipsum";
-import { ComponentMeta, ComponentStory } from "@storybook/react";
+import { Meta, StoryFn } from "@storybook/react";
 
 import { helpersArgTypes } from "../../../.storybook/helpers";
 import { ActivityControlWidget, Tag, TagList } from "../../../index";
@@ -9,31 +9,13 @@ export default {
     title: "Cmem/ActivityControlWidget",
     component: ActivityControlWidget,
     argTypes: {
-        border: {
-            table: {
-                defaultValue: { summary: false },
-                type: { summary: "boolean" },
-            },
-        },
-        small: {
-            table: {
-                defaultValue: { summary: false },
-                type: { summary: "boolean" },
-            },
-        },
-        canShrink: {
-            table: {
-                defaultValue: { summary: false },
-                type: { summary: "boolean" },
-            },
-        },
         progressSpinnerFinishedIcon: {
             ...helpersArgTypes.exampleIcon,
         },
     },
-} as ComponentMeta<typeof ActivityControlWidget>;
+} as Meta<typeof ActivityControlWidget>;
 
-const Template: ComponentStory<typeof ActivityControlWidget> = (args) => <ActivityControlWidget {...args} />;
+const Template: StoryFn<typeof ActivityControlWidget> = (args) => <ActivityControlWidget {...args} />;
 
 export const FullExample = Template.bind({});
 
@@ -82,7 +64,7 @@ FullExample.args = {
     ...commonWidgetArgs,
 };
 
-const TemplateWithTags: ComponentStory<typeof ActivityControlWidget> = (args) => <ActivityControlWidget {...args} />;
+const TemplateWithTags: StoryFn<typeof ActivityControlWidget> = (args) => <ActivityControlWidget {...args} />;
 
 export const WidgetWithTags = TemplateWithTags.bind({});
 

package/src/cmem/ConfidenceValue/ConfidenceValue.stories.tsx

@@ -1,5 +1,5 @@
 import React from "react";
-import { ComponentMeta, ComponentStory } from "@storybook/react";
+import { Meta, StoryFn } from "@storybook/react";
 
 import { ConfidenceValue } from "../../../index";
 
@@ -11,9 +11,9 @@ export default {
             control: "color",
         },
     },
-} as ComponentMeta<typeof ConfidenceValue>;
+} as Meta<typeof ConfidenceValue>;
 
-const TemplateIcons: ComponentStory<typeof ConfidenceValue> = (args) => <ConfidenceValue {...args} />;
+const TemplateIcons: StoryFn<typeof ConfidenceValue> = (args) => <ConfidenceValue {...args} />;
 export const Default = TemplateIcons.bind({});
 Default.args = {
     value: "0.5",

package/src/cmem/markdown/Markdown.stories.tsx

@@ -1,6 +1,6 @@
 import React from "react";
 import { Blockquote } from "@blueprintjs/core";
-import { ComponentMeta, ComponentStory } from "@storybook/react";
+import { Meta, StoryFn } from "@storybook/react";
 
 import { Markdown } from "./../../../index";
 
@@ -8,9 +8,9 @@ export default {
     title: "Cmem/Markdown",
     component: Markdown,
     argTypes: {},
-} as ComponentMeta<typeof Markdown>;
+} as Meta<typeof Markdown>;
 
-const Template: ComponentStory<typeof Markdown> = (args) => <Markdown {...args} />;
+const Template: StoryFn<typeof Markdown> = (args) => <Markdown {...args} />;
 
 export const Default = Template.bind({});
 

package/src/components/Accordion/Accordion.tsx

@@ -1,11 +1,12 @@
-import React from "react";
-import { Accordion as CarbonAccordion, AccordionProps as CarbonAccordionProps } from "carbon-components-react";
+import React, { ReactNode } from "react";
+import { Accordion as CarbonAccordion, AccordionProps as CarbonAccordionProps } from "@carbon/react";
 
 import { CLASSPREFIX as eccgui } from "../../configuration/constants";
 
 import { AccordionItemProps } from "./AccordionItem";
 
-export interface AccordionProps extends Omit<CarbonAccordionProps, "className" | "size"> {
+export interface AccordionProps extends Omit<CarbonAccordionProps, "children" | "className" | "size" | "isFlush"> {
+    children?: ReactNode;
     /**
      * Additional CSS classes.
      */