@uipath/apollo-react 3.71.0 → 4.0.0

package/dist/canvas/controls/Breadcrumb/Breadcrumb.cjs

@@ -39,9 +39,9 @@ const jsx_runtime_namespaceObject = require("react/jsx-runtime");
 const styled_namespaceObject = require("@emotion/styled");
 var styled_default = /*#__PURE__*/ __webpack_require__.n(styled_namespaceObject);
 const apollo_core_namespaceObject = require("@uipath/apollo-core");
-const index_cjs_namespaceObject = require("../../../material/index.cjs");
 const external_react_namespaceObject = require("react");
-const external_layouts_index_cjs_namespaceObject = require("../../layouts/index.cjs");
+const CanvasTooltip_cjs_namespaceObject = require("../../components/CanvasTooltip.cjs");
+const index_cjs_namespaceObject = require("../../layouts/index.cjs");
 const OlStyled = styled_default().ol`
   display: flex;
   flex-direction: row;
@@ -54,12 +54,11 @@ const LiStyled = styled_default().li`
   padding: 0;
 `;
 const Breadcrumb = /*#__PURE__*/ (0, external_react_namespaceObject.memo)(({ items, delimiter = '>' })=>{
-    const delimiterNode = 'string' == typeof delimiter ? /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(index_cjs_namespaceObject.ApTypography, {
+    const delimiterNode = 'string' == typeof delimiter ? /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)("span", {
         "aria-hidden": "true",
-        color: "var(--color-foreground-de-emp)",
         children: delimiter
     }) : delimiter;
-    return /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_layouts_index_cjs_namespaceObject.Row, {
+    return /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(index_cjs_namespaceObject.Row, {
         align: "center",
         style: {
             overflow: 'hidden',
@@ -82,23 +81,18 @@ const Breadcrumb = /*#__PURE__*/ (0, external_react_namespaceObject.memo)(({ ite
                             },
                             onClick: (e)=>item.onClick?.(e),
                             onKeyDown: (e)=>'Enter' === e.key && item.onClick?.(e),
-                            children: /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsxs)(external_layouts_index_cjs_namespaceObject.Row, {
+                            children: /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsxs)(index_cjs_namespaceObject.Row, {
                                 overflow: "hidden",
                                 align: "center",
                                 gap: apollo_core_namespaceObject.Spacing.SpacingMicro,
                                 "aria-current": index === items.length - 1 ? 'page' : void 0,
                                 children: [
                                     item.startAdornment,
-                                    /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(index_cjs_namespaceObject.ApTooltip, {
+                                    /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(CanvasTooltip_cjs_namespaceObject.CanvasTooltip, {
                                         smartTooltip: true,
                                         content: item.label,
-                                        children: /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(index_cjs_namespaceObject.ApTypography, {
-                                            variant: index === items.length - 1 ? apollo_core_namespaceObject.FontVariantToken.fontSizeMBold : apollo_core_namespaceObject.FontVariantToken.fontSizeM,
-                                            style: {
-                                                textOverflow: 'ellipsis',
-                                                overflow: 'hidden',
-                                                whiteSpace: 'nowrap'
-                                            },
+                                        children: /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)("span", {
+                                            className: `${index === items.length - 1 ? 'text-sm font-bold' : 'text-sm'} truncate`,
                                             "data-testid": `breadcrumb-item-${item.label}`,
                                             children: item.label
                                         })
@@ -106,23 +100,18 @@ const Breadcrumb = /*#__PURE__*/ (0, external_react_namespaceObject.memo)(({ ite
                                     item.endAdornment
                                 ]
                             })
-                        }) : /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsxs)(external_layouts_index_cjs_namespaceObject.Row, {
+                        }) : /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsxs)(index_cjs_namespaceObject.Row, {
                             overflow: "hidden",
                             align: "center",
                             gap: apollo_core_namespaceObject.Spacing.SpacingMicro,
                             "aria-current": index === items.length - 1 ? 'page' : void 0,
                             children: [
                                 item.startAdornment,
-                                /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(index_cjs_namespaceObject.ApTooltip, {
+                                /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(CanvasTooltip_cjs_namespaceObject.CanvasTooltip, {
                                     smartTooltip: true,
                                     content: item.label,
-                                    children: /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(index_cjs_namespaceObject.ApTypography, {
-                                        variant: index === items.length - 1 ? apollo_core_namespaceObject.FontVariantToken.fontSizeMBold : apollo_core_namespaceObject.FontVariantToken.fontSizeM,
-                                        style: {
-                                            textOverflow: 'ellipsis',
-                                            overflow: 'hidden',
-                                            whiteSpace: 'nowrap'
-                                        },
+                                    children: /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)("span", {
+                                        className: `${index === items.length - 1 ? 'text-sm font-bold' : 'text-sm'} truncate`,
                                         "data-testid": `breadcrumb-item-${item.label}`,
                                         children: item.label
                                     })

package/dist/canvas/controls/Breadcrumb/Breadcrumb.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Breadcrumb.d.ts","sourceRoot":"","sources":["../../../../src/canvas/controls/Breadcrumb/Breadcrumb.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAK/B,MAAM,MAAM,cAAc,GAAG;IAC3B,KAAK,EAAE,MAAM,CAAC;IACd,OAAO,CAAC,EAAE,CACR,CAAC,EAAE,KAAK,CAAC,UAAU,CAAC,iBAAiB,CAAC,GAAG,KAAK,CAAC,aAAa,CAAC,iBAAiB,CAAC,KAC5E,IAAI,CAAC;IACV,cAAc,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACjC,YAAY,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;CAChC,CAAC;AAEF,KAAK,eAAe,GAAG;IACrB,KAAK,EAAE,cAAc,EAAE,CAAC;IACxB,SAAS,CAAC,EAAE,KAAK,CAAC,SAAS,GAAG,MAAM,CAAC;CACtC,CAAC;AAeF,eAAO,MAAM,UAAU,EAAE,KAAK,CAAC,EAAE,CAAC,eAAe,CAsF/C,CAAC"}
+{"version":3,"file":"Breadcrumb.d.ts","sourceRoot":"","sources":["../../../../src/canvas/controls/Breadcrumb/Breadcrumb.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAM/B,MAAM,MAAM,cAAc,GAAG;IAC3B,KAAK,EAAE,MAAM,CAAC;IACd,OAAO,CAAC,EAAE,CACR,CAAC,EAAE,KAAK,CAAC,UAAU,CAAC,iBAAiB,CAAC,GAAG,KAAK,CAAC,aAAa,CAAC,iBAAiB,CAAC,KAC5E,IAAI,CAAC;IACV,cAAc,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACjC,YAAY,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;CAChC,CAAC;AAEF,KAAK,eAAe,GAAG;IACrB,KAAK,EAAE,cAAc,EAAE,CAAC;IACxB,SAAS,CAAC,EAAE,KAAK,CAAC,SAAS,GAAG,MAAM,CAAC;CACtC,CAAC;AAeF,eAAO,MAAM,UAAU,EAAE,KAAK,CAAC,EAAE,CAAC,eAAe,CAsE/C,CAAC"}

package/dist/canvas/controls/Breadcrumb/Breadcrumb.js

@@ -1,8 +1,8 @@
 import { jsx, jsxs } from "react/jsx-runtime";
 import styled from "@emotion/styled";
-import { FontVariantToken, Spacing } from "@uipath/apollo-core";
-import { ApTooltip, ApTypography } from "../../../material/index.js";
+import { Spacing } from "@uipath/apollo-core";
 import { memo } from "react";
+import { CanvasTooltip } from "../../components/CanvasTooltip.js";
 import { Row } from "../../layouts/index.js";
 const OlStyled = styled.ol`
   display: flex;
@@ -16,9 +16,8 @@ const LiStyled = styled.li`
   padding: 0;
 `;
 const Breadcrumb = /*#__PURE__*/ memo(({ items, delimiter = '>' })=>{
-    const delimiterNode = 'string' == typeof delimiter ? /*#__PURE__*/ jsx(ApTypography, {
+    const delimiterNode = 'string' == typeof delimiter ? /*#__PURE__*/ jsx("span", {
         "aria-hidden": "true",
-        color: "var(--color-foreground-de-emp)",
         children: delimiter
     }) : delimiter;
     return /*#__PURE__*/ jsx(Row, {
@@ -51,16 +50,11 @@ const Breadcrumb = /*#__PURE__*/ memo(({ items, delimiter = '>' })=>{
                                 "aria-current": index === items.length - 1 ? 'page' : void 0,
                                 children: [
                                     item.startAdornment,
-                                    /*#__PURE__*/ jsx(ApTooltip, {
+                                    /*#__PURE__*/ jsx(CanvasTooltip, {
                                         smartTooltip: true,
                                         content: item.label,
-                                        children: /*#__PURE__*/ jsx(ApTypography, {
-                                            variant: index === items.length - 1 ? FontVariantToken.fontSizeMBold : FontVariantToken.fontSizeM,
-                                            style: {
-                                                textOverflow: 'ellipsis',
-                                                overflow: 'hidden',
-                                                whiteSpace: 'nowrap'
-                                            },
+                                        children: /*#__PURE__*/ jsx("span", {
+                                            className: `${index === items.length - 1 ? 'text-sm font-bold' : 'text-sm'} truncate`,
                                             "data-testid": `breadcrumb-item-${item.label}`,
                                             children: item.label
                                         })
@@ -75,16 +69,11 @@ const Breadcrumb = /*#__PURE__*/ memo(({ items, delimiter = '>' })=>{
                             "aria-current": index === items.length - 1 ? 'page' : void 0,
                             children: [
                                 item.startAdornment,
-                                /*#__PURE__*/ jsx(ApTooltip, {
+                                /*#__PURE__*/ jsx(CanvasTooltip, {
                                     smartTooltip: true,
                                     content: item.label,
-                                    children: /*#__PURE__*/ jsx(ApTypography, {
-                                        variant: index === items.length - 1 ? FontVariantToken.fontSizeMBold : FontVariantToken.fontSizeM,
-                                        style: {
-                                            textOverflow: 'ellipsis',
-                                            overflow: 'hidden',
-                                            whiteSpace: 'nowrap'
-                                        },
+                                    children: /*#__PURE__*/ jsx("span", {
+                                        className: `${index === items.length - 1 ? 'text-sm font-bold' : 'text-sm'} truncate`,
                                         "data-testid": `breadcrumb-item-${item.label}`,
                                         children: item.label
                                     })

package/dist/canvas/storybook-utils/components/StoryInfoPanel.cjs

@@ -27,11 +27,11 @@ __webpack_require__.d(__webpack_exports__, {
     StoryInfoPanel: ()=>StoryInfoPanel
 });
 const jsx_runtime_namespaceObject = require("react/jsx-runtime");
-const apollo_core_namespaceObject = require("@uipath/apollo-core");
 const index_cjs_namespaceObject = require("../../layouts/index.cjs");
 const react_cjs_namespaceObject = require("../../xyflow/react.cjs");
-const external_material_index_cjs_namespaceObject = require("../../../material/index.cjs");
+const apollo_wind_namespaceObject = require("@uipath/apollo-wind");
 const external_react_namespaceObject = require("react");
+const icon_registry_cjs_namespaceObject = require("../../utils/icon-registry.cjs");
 function StoryInfoPanel({ title, description, children, collapsible = false, defaultCollapsed = false, position = 'top-left' }) {
     const [isCollapsed, setIsCollapsed] = (0, external_react_namespaceObject.useState)(defaultCollapsed);
     const hasContent = description || children;
@@ -54,16 +54,19 @@ function StoryInfoPanel({ title, description, children, collapsible = false, def
                     align: "center",
                     gap: 12,
                     children: [
-                        /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_material_index_cjs_namespaceObject.ApTypography, {
-                            variant: apollo_core_namespaceObject.FontVariantToken.fontSizeH4Bold,
+                        /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)("span", {
+                            className: "text-lg font-bold",
                             children: title
                         }),
-                        collapsible && hasContent && /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_material_index_cjs_namespaceObject.ApIconButton, {
-                            size: "small",
+                        collapsible && hasContent && /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(apollo_wind_namespaceObject.Button, {
+                            variant: "ghost",
+                            size: "icon",
+                            className: "h-6 w-6",
                             onClick: ()=>setIsCollapsed(!isCollapsed),
                             "aria-label": isCollapsed ? 'Expand panel' : 'Collapse panel',
-                            children: /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_material_index_cjs_namespaceObject.ApIcon, {
-                                name: isCollapsed ? 'expand_more' : 'expand_less'
+                            children: /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(icon_registry_cjs_namespaceObject.CanvasIcon, {
+                                icon: isCollapsed ? 'chevron-down' : 'chevron-up',
+                                size: 16
                             })
                         })
                     ]
@@ -77,9 +80,8 @@ function StoryInfoPanel({ title, description, children, collapsible = false, def
                         marginTop: isCollapsed && collapsible ? 0 : void 0
                     },
                     children: [
-                        description && /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_material_index_cjs_namespaceObject.ApTypography, {
-                            variant: apollo_core_namespaceObject.FontVariantToken.fontSizeS,
-                            color: "var(--uix-canvas-foreground-de-emp)",
+                        description && /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)("span", {
+                            className: "text-xs text-foreground-muted",
                             children: description
                         }),
                         children

package/dist/canvas/storybook-utils/components/StoryInfoPanel.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"StoryInfoPanel.d.ts","sourceRoot":"","sources":["../../../../src/canvas/storybook-utils/components/StoryInfoPanel.tsx"],"names":[],"mappings":"AAMA,MAAM,WAAW,mBAAmB;IAElC,KAAK,EAAE,MAAM,CAAC;IAEd,WAAW,CAAC,EAAE,MAAM,CAAC;IAErB,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAE3B,WAAW,CAAC,EAAE,OAAO,CAAC;IAEtB,gBAAgB,CAAC,EAAE,OAAO,CAAC;IAE3B,QAAQ,CAAC,EAAE,UAAU,GAAG,WAAW,GAAG,aAAa,GAAG,cAAc,CAAC;CACtE;AAED,wBAAgB,cAAc,CAAC,EAC7B,KAAK,EACL,WAAW,EACX,QAAQ,EACR,WAAmB,EACnB,gBAAwB,EACxB,QAAqB,GACtB,EAAE,mBAAmB,2CAwDrB"}
+{"version":3,"file":"StoryInfoPanel.d.ts","sourceRoot":"","sources":["../../../../src/canvas/storybook-utils/components/StoryInfoPanel.tsx"],"names":[],"mappings":"AAMA,MAAM,WAAW,mBAAmB;IAElC,KAAK,EAAE,MAAM,CAAC;IAEd,WAAW,CAAC,EAAE,MAAM,CAAC;IAErB,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAE3B,WAAW,CAAC,EAAE,OAAO,CAAC;IAEtB,gBAAgB,CAAC,EAAE,OAAO,CAAC;IAE3B,QAAQ,CAAC,EAAE,UAAU,GAAG,WAAW,GAAG,aAAa,GAAG,cAAc,CAAC;CACtE;AAED,wBAAgB,cAAc,CAAC,EAC7B,KAAK,EACL,WAAW,EACX,QAAQ,EACR,WAAmB,EACnB,gBAAwB,EACxB,QAAqB,GACtB,EAAE,mBAAmB,2CAmDrB"}

package/dist/canvas/storybook-utils/components/StoryInfoPanel.js

@@ -1,9 +1,9 @@
 import { jsx, jsxs } from "react/jsx-runtime";
-import { FontVariantToken } from "@uipath/apollo-core";
 import { Column, Row } from "../../layouts/index.js";
 import { Panel } from "../../xyflow/react.js";
-import { ApIcon, ApIconButton, ApTypography } from "../../../material/index.js";
+import { Button } from "@uipath/apollo-wind";
 import { useState } from "react";
+import { CanvasIcon } from "../../utils/icon-registry.js";
 function StoryInfoPanel({ title, description, children, collapsible = false, defaultCollapsed = false, position = 'top-left' }) {
     const [isCollapsed, setIsCollapsed] = useState(defaultCollapsed);
     const hasContent = description || children;
@@ -26,16 +26,19 @@ function StoryInfoPanel({ title, description, children, collapsible = false, def
                     align: "center",
                     gap: 12,
                     children: [
-                        /*#__PURE__*/ jsx(ApTypography, {
-                            variant: FontVariantToken.fontSizeH4Bold,
+                        /*#__PURE__*/ jsx("span", {
+                            className: "text-lg font-bold",
                             children: title
                         }),
-                        collapsible && hasContent && /*#__PURE__*/ jsx(ApIconButton, {
-                            size: "small",
+                        collapsible && hasContent && /*#__PURE__*/ jsx(Button, {
+                            variant: "ghost",
+                            size: "icon",
+                            className: "h-6 w-6",
                             onClick: ()=>setIsCollapsed(!isCollapsed),
                             "aria-label": isCollapsed ? 'Expand panel' : 'Collapse panel',
-                            children: /*#__PURE__*/ jsx(ApIcon, {
-                                name: isCollapsed ? 'expand_more' : 'expand_less'
+                            children: /*#__PURE__*/ jsx(CanvasIcon, {
+                                icon: isCollapsed ? 'chevron-down' : 'chevron-up',
+                                size: 16
                             })
                         })
                     ]
@@ -49,9 +52,8 @@ function StoryInfoPanel({ title, description, children, collapsible = false, def
                         marginTop: isCollapsed && collapsible ? 0 : void 0
                     },
                     children: [
-                        description && /*#__PURE__*/ jsx(ApTypography, {
-                            variant: FontVariantToken.fontSizeS,
-                            color: "var(--uix-canvas-foreground-de-emp)",
+                        description && /*#__PURE__*/ jsx("span", {
+                            className: "text-xs text-foreground-muted",
                             children: description
                         }),
                         children

package/dist/canvas/storybook-utils/decorators.cjs

@@ -29,7 +29,9 @@ __webpack_require__.d(__webpack_exports__, {
 });
 const jsx_runtime_namespaceObject = require("react/jsx-runtime");
 const react_cjs_namespaceObject = require("../xyflow/react.cjs");
+const apollo_wind_namespaceObject = require("@uipath/apollo-wind");
 const external_react_namespaceObject = require("react");
+const CanvasTooltip_cjs_namespaceObject = require("../components/CanvasTooltip.cjs");
 const index_cjs_namespaceObject = require("../core/index.cjs");
 const external_hooks_index_cjs_namespaceObject = require("../hooks/index.cjs");
 const external_manifests_index_cjs_namespaceObject = require("./manifests/index.cjs");
@@ -64,7 +66,11 @@ function withCanvasProviders(options = {}) {
                 children: /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_hooks_index_cjs_namespaceObject.ValidationStatusContext.Provider, {
                     value: validations,
                     children: /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(react_cjs_namespaceObject.ReactFlowProvider, {
-                        children: /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(Story, {})
+                        children: /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(apollo_wind_namespaceObject.TooltipProvider, {
+                            children: /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(CanvasTooltip_cjs_namespaceObject.CanvasTooltipProviderMarker, {
+                                children: /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(Story, {})
+                            })
+                        })
                     })
                 })
             })

package/dist/canvas/storybook-utils/decorators.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"decorators.d.ts","sourceRoot":"","sources":["../../../src/canvas/storybook-utils/decorators.tsx"],"names":[],"mappings":"AAMA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,kBAAkB,CAAC;AAElD,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAG/B,OAAO,EACL,KAAK,0BAA0B,EAE/B,KAAK,2BAA2B,EAEjC,MAAM,UAAU,CAAC;AASlB,MAAM,MAAM,oBAAoB,GAAG,0BAA0B,CAAC;AAK9D,MAAM,WAAW,sBAAsB;IAIrC,cAAc,CAAC,EAAE,oBAAoB,CAAC;IAKtC,eAAe,CAAC,EAAE,2BAA2B,CAAC;IAM9C,UAAU,CAAC,EAAE,OAAO,CAAC;IAKrB,cAAc,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC;CACtC;AAqED,wBAAgB,mBAAmB,CAAC,OAAO,GAAE,sBAA2B,GAAG,SAAS,CA+BnF;AAaD,wBAAgB,cAAc,CAAC,KAAK,CAAC,EAAE,KAAK,CAAC,aAAa,GAAG,SAAS,CAQrE"}
+{"version":3,"file":"decorators.d.ts","sourceRoot":"","sources":["../../../src/canvas/storybook-utils/decorators.tsx"],"names":[],"mappings":"AAMA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,kBAAkB,CAAC;AAGlD,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAI/B,OAAO,EACL,KAAK,0BAA0B,EAE/B,KAAK,2BAA2B,EAEjC,MAAM,UAAU,CAAC;AASlB,MAAM,MAAM,oBAAoB,GAAG,0BAA0B,CAAC;AAK9D,MAAM,WAAW,sBAAsB;IAIrC,cAAc,CAAC,EAAE,oBAAoB,CAAC;IAKtC,eAAe,CAAC,EAAE,2BAA2B,CAAC;IAM9C,UAAU,CAAC,EAAE,OAAO,CAAC;IAKrB,cAAc,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC;CACtC;AAqED,wBAAgB,mBAAmB,CAAC,OAAO,GAAE,sBAA2B,GAAG,SAAS,CAmCnF;AAaD,wBAAgB,cAAc,CAAC,KAAK,CAAC,EAAE,KAAK,CAAC,aAAa,GAAG,SAAS,CAQrE"}

package/dist/canvas/storybook-utils/decorators.js

@@ -1,6 +1,8 @@
 import { jsx } from "react/jsx-runtime";
 import { ReactFlowProvider } from "../xyflow/react.js";
+import { TooltipProvider } from "@uipath/apollo-wind";
 import { useMemo } from "react";
+import { CanvasTooltipProviderMarker } from "../components/CanvasTooltip.js";
 import { NodeRegistryProvider } from "../core/index.js";
 import { ExecutionStatusContext, ValidationStatusContext } from "../hooks/index.js";
 import { defaultWorkflowManifest } from "./manifests/index.js";
@@ -35,7 +37,11 @@ function withCanvasProviders(options = {}) {
                 children: /*#__PURE__*/ jsx(ValidationStatusContext.Provider, {
                     value: validations,
                     children: /*#__PURE__*/ jsx(ReactFlowProvider, {
-                        children: /*#__PURE__*/ jsx(Story, {})
+                        children: /*#__PURE__*/ jsx(TooltipProvider, {
+                            children: /*#__PURE__*/ jsx(CanvasTooltipProviderMarker, {
+                                children: /*#__PURE__*/ jsx(Story, {})
+                            })
+                        })
                     })
                 })
             })